Web: components: RadioButtonGroup: added spaceBtwnElems prop
This commit is contained in:
parent
0b2a630e2e
commit
67e4b93cbf
@ -39,6 +39,7 @@ class RadioButtonGroup extends React.Component {
|
||||
onChange={this.handleOptionChange}
|
||||
disabled={option.disabled}
|
||||
label={option.label}
|
||||
spaceBtwnElems={this.props.spaceBtwnElems}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@ -56,11 +57,13 @@ RadioButtonGroup.propTypes = {
|
||||
label: PropTypes.string,
|
||||
disabled: PropTypes.bool
|
||||
})).isRequired,
|
||||
selected: PropTypes.string.isRequired
|
||||
selected: PropTypes.string.isRequired,
|
||||
spaceBtwnElems: PropTypes.number
|
||||
}
|
||||
|
||||
RadioButtonGroup.defaultProps = {
|
||||
selected: undefined
|
||||
selected: undefined,
|
||||
spaceBtwnElems: '33'
|
||||
}
|
||||
|
||||
export default RadioButtonGroup;
|
||||
|
@ -84,7 +84,7 @@ const StyledText = styled(TextBody)`
|
||||
|
||||
const StyledSpan = styled.span`
|
||||
&:not(:first-child) {
|
||||
margin-left: 33px;
|
||||
margin-left: ${props => props.spaceBtwnElems}px;
|
||||
}
|
||||
`;
|
||||
|
||||
@ -96,7 +96,7 @@ class RadioButton extends React.Component {
|
||||
(this.props.disabled ? ' disabled' : '');
|
||||
|
||||
return (
|
||||
<StyledSpan>
|
||||
<StyledSpan spaceBtwnElems={this.props.spaceBtwnElems}>
|
||||
<Label>
|
||||
<span>
|
||||
<Input type='radio'
|
||||
|
@ -30,6 +30,7 @@ import { RadioButtonGroup } from 'asc-web-components';
|
||||
| `name` | `string` | ✅ | - | - | Used as HTML `name` property for `<input>` tag. Used for identification RadioButtonGroup
|
||||
| `selected` | `string` | ✅ | - | - | Value of the selected radiobutton
|
||||
| `options` | `arrayOf` | ✅ | - | - | Radiobuttons data: it is array of objects, each of this can include next information: `value` (required), `label`, `disabled`
|
||||
| `spaceBtwnElems` | `number` | - | - | 33 | Margin (in px) between radiobuttons
|
||||
|
||||
#### Prop `options`
|
||||
|
||||
|
@ -17,6 +17,7 @@ storiesOf('Components|Input', module)
|
||||
<div> First list</div>
|
||||
<RadioButtonGroup
|
||||
selected='apple'
|
||||
spaceBtwnElems='50'
|
||||
name="test"
|
||||
options={
|
||||
[
|
||||
|
Loading…
Reference in New Issue
Block a user