Web: components: RadioButtonGroup: added isDisabledGroup prop
This commit is contained in:
parent
8db94c83d3
commit
2e1fba1ce1
@ -5,6 +5,7 @@ import styled from 'styled-components';
|
|||||||
|
|
||||||
const StyledDiv = styled.div`
|
const StyledDiv = styled.div`
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
`;
|
`;
|
||||||
|
|
||||||
class RadioButtonGroup extends React.Component {
|
class RadioButtonGroup extends React.Component {
|
||||||
@ -38,7 +39,7 @@ class RadioButtonGroup extends React.Component {
|
|||||||
value={option.value}
|
value={option.value}
|
||||||
checked={this.state.selectedOption === option.value}
|
checked={this.state.selectedOption === option.value}
|
||||||
onChange={this.handleOptionChange}
|
onChange={this.handleOptionChange}
|
||||||
disabled={option.disabled}
|
disabled={this.props.isDisabledGroup || option.disabled}
|
||||||
label={option.label}
|
label={option.label}
|
||||||
spaceBtwnElems={this.props.spaceBtwnElems}
|
spaceBtwnElems={this.props.spaceBtwnElems}
|
||||||
/>
|
/>
|
||||||
@ -52,6 +53,7 @@ class RadioButtonGroup extends React.Component {
|
|||||||
};
|
};
|
||||||
|
|
||||||
RadioButtonGroup.propTypes = {
|
RadioButtonGroup.propTypes = {
|
||||||
|
isDisabledGroup: PropTypes.bool,
|
||||||
name: PropTypes.string.isRequired,
|
name: PropTypes.string.isRequired,
|
||||||
options: PropTypes.arrayOf(PropTypes.shape({
|
options: PropTypes.arrayOf(PropTypes.shape({
|
||||||
value: PropTypes.string.isRequired,
|
value: PropTypes.string.isRequired,
|
||||||
@ -63,6 +65,7 @@ RadioButtonGroup.propTypes = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
RadioButtonGroup.defaultProps = {
|
RadioButtonGroup.defaultProps = {
|
||||||
|
isDisabledGroup: false,
|
||||||
selected: undefined,
|
selected: undefined,
|
||||||
spaceBtwnElems: 33
|
spaceBtwnElems: 33
|
||||||
}
|
}
|
||||||
|
@ -13,7 +13,7 @@ storiesOf('Components|Input', module)
|
|||||||
return (
|
return (
|
||||||
<Section>
|
<Section>
|
||||||
<>
|
<>
|
||||||
<RadioButtonGroup selected={text('selected radio button(value)', 'second')} spaceBtwnElems={number('spaceBtwnElems', 33)} name={text('name of your group', 'group')} options={
|
<RadioButtonGroup isDisabledGroup={boolean('isDisabledGroup', false)} selected={text('selected radio button(value)', 'second')} spaceBtwnElems={number('spaceBtwnElems', 33)} name={text('name of your group', 'group')} options={
|
||||||
[
|
[
|
||||||
{ value: text('value 1st radiobutton', 'first'), label: text('label 1st radiobutton', 'First radiobtn'), disabled: boolean('isDisabled 1st radiobutton', false) },
|
{ value: text('value 1st radiobutton', 'first'), label: text('label 1st radiobutton', 'First radiobtn'), disabled: boolean('isDisabled 1st radiobutton', false) },
|
||||||
{ value: text('value 2nd radiobutton', 'second'), label: text('label 2nd radiobutton', 'Second radiobtn'), disabled: boolean('isDisabled 2nd radiobutton', true) },
|
{ value: text('value 2nd radiobutton', 'second'), label: text('label 2nd radiobutton', 'Second radiobtn'), disabled: boolean('isDisabled 2nd radiobutton', true) },
|
||||||
|
Loading…
Reference in New Issue
Block a user