Skip to content

Commit

Permalink
Checkbox and radio updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@g-stamatis
g-stamatis committed Jan 14, 2022
1 parent 5f1e5eb commit 24652a2
Show file tree
Hide file tree
Showing 3 changed files with 211 additions and 143 deletions.
133 changes: 71 additions & 62 deletions src/customizations/components/theme/Form/Checkbox.stories.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,54 +13,55 @@ export default {
onChange: {
action: 'checkbox value changed',
},
label:{
description:"Label of the form group",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
label: {
description: 'Label of the form group',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
helperText:{
description:"Helper text of the form group",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
helperText: {
description: 'Helper text of the form group',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
errorMessage:{
description:"Message to be shown in case of an invalid input by the user",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
errorMessage: {
description:
'Message to be shown in case of an invalid input by the user',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
optionalText:{
description:"Text to be shown when the form group is optional",
table:{
type:{summary:'string'},
defaultValue:{summary:' (optional) '}
}
optionalText: {
description: 'Text to be shown when the form group is optional',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' (optional) ' },
},
},
requiredText:{
description:"Text to be shown when the form group is required",
table:{
type:{summary:'string'},
defaultValue:{summary:' * '}
}
requiredText: {
description: 'Text to be shown when the form group is required',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' * ' },
},
},
required:{
description:"Sets the required attribute on the form group",
table:{
type:{summary:'boolean'},
defaultValue:{summary:true}
}
required: {
description: 'Sets the required attribute on the form group',
table: {
type: { summary: 'boolean' },
defaultValue: { summary: true },
},
},
invalid:{
description:"Marks the form group as invalid",
table:{
type:{summary:'boolean'},
defaultValue:{summary:false}
}
invalid: {
description: 'Marks the form group as invalid',
table: {
type: { summary: 'boolean' },
defaultValue: { summary: false },
},
},
},
};
Expand Down Expand Up @@ -89,7 +90,11 @@ function CheckboxForm({
<Message header="Error Message" content={errorMessage} negative />
) : null}
<Form.Field error={invalid}>
<Checkbox className="eeaCheckbox" label="Option 1" defaultChecked></Checkbox>
<Checkbox
className="eeaCheckbox"
label="Option 1"
defaultChecked
></Checkbox>
<Form.Field>Helper text for option 1</Form.Field>
</Form.Field>
<Form.Field error={invalid}>
Expand Down Expand Up @@ -130,7 +135,11 @@ function SingleCheckboxForm({
<Form.Field>{helperText}</Form.Field>

<Form.Field error={invalid}>
<Checkbox className="eeaCheckbox" label="Option 1" defaultChecked></Checkbox>
<Checkbox
className="eeaCheckbox"
label="Option 1"
defaultChecked
></Checkbox>
<Form.Field>Helper text for option 1</Form.Field>
</Form.Field>
{invalid ? (
Expand Down Expand Up @@ -165,12 +174,12 @@ invalid.args = {
};

invalid.argTypes = {
invalid:{
table:{
defaultValue:{summary:true}
}
}
}
invalid: {
table: {
defaultValue: { summary: true },
},
},
};

export const optional = Template.bind({});
optional.args = {
Expand All @@ -184,12 +193,12 @@ optional.args = {
};

optional.argTypes = {
required:{
table:{
defaultValue:{summary:false}
}
}
}
required: {
table: {
defaultValue: { summary: false },
},
},
};

export const single = (args) => (
<SingleCheckboxForm {...args}></SingleCheckboxForm>
Expand All @@ -205,9 +214,9 @@ single.args = {
};

single.argTypes = {
required:{
table:{
defaultValue:{summary:false}
}
}
}
required: {
table: {
defaultValue: { summary: false },
},
},
};
109 changes: 55 additions & 54 deletions src/customizations/components/theme/Form/Radio.stories.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,54 +13,55 @@ export default {
onChange: {
action: 'checkbox value changed',
},
label:{
description:"Label of the form group",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
label: {
description: 'Label of the form group',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
helperText:{
description:"Helper text of the form group",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
helperText: {
description: 'Helper text of the form group',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
errorMessage:{
description:"Message to be shown in case of an invalid input by the user",
table:{
type:{summary:'string'},
defaultValue:{summary:' \""\ '}
}
errorMessage: {
description:
'Message to be shown in case of an invalid input by the user',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' "" ' },
},
},
optionalText:{
description:"Text to be shown when the form group is optional",
table:{
type:{summary:'string'},
defaultValue:{summary:' (optional) '}
}
optionalText: {
description: 'Text to be shown when the form group is optional',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' (optional) ' },
},
},
requiredText:{
description:"Text to be shown when the form group is required",
table:{
type:{summary:'string'},
defaultValue:{summary:' * '}
}
requiredText: {
description: 'Text to be shown when the form group is required',
table: {
type: { summary: 'string' },
defaultValue: { summary: ' * ' },
},
},
required:{
description:"Sets the required attribute on the form group",
table:{
type:{summary:'boolean'},
defaultValue:{summary:true}
}
required: {
description: 'Sets the required attribute on the form group',
table: {
type: { summary: 'boolean' },
defaultValue: { summary: true },
},
},
invalid:{
description:"Marks the form group as invalid",
table:{
type:{summary:'boolean'},
defaultValue:{summary:false}
}
invalid: {
description: 'Marks the form group as invalid',
table: {
type: { summary: 'boolean' },
defaultValue: { summary: false },
},
},
},
};
Expand Down Expand Up @@ -205,12 +206,12 @@ invalid.args = {
};

invalid.argTypes = {
invalid:{
table:{
defaultValue:{summary:true}
}
}
}
invalid: {
table: {
defaultValue: { summary: true },
},
},
};

export const BinaryRadio = (args) => <Binary {...args}></Binary>;
BinaryRadio.args = {
Expand All @@ -224,12 +225,12 @@ BinaryRadio.args = {
};

BinaryRadio.argTypes = {
required:{
table:{
defaultValue:{summary:false}
}
}
}
required: {
table: {
defaultValue: { summary: false },
},
},
};

BinaryRadio.storyName = 'Binary';

Expand Down
Loading

0 comments on commit 24652a2

Please sign in to comment.