RadioGroup - Design System

1 - Prerequisites

Host element will have the .dcx-radio-button-group class name
Host element will have conditional classes for error state .dcx-radio-button-group--error class name

Name	Description
Default	Instance without specific properties defined
Disabled	Instance with native input disabled
Filled (Checked)	Instance with value
Focus	Instance while receiving focus on native input
Error	Instance with validation errors

Name	Description
Default	Default look & feel

Element	Description	Token Name
InputBox	The native input itself	formcontrol
Label	The label element	formcontrol_label

When developing take a close look to the FormSelect component. It is a form element as well, the tokens and styling approach should be similar.

Considerations:

❗ Take a close look to the FormSelect component. It is a form element as well, the tokens and styling approach should be similar.
Add the tokens to src/design-system/tokens.json
Define all styles in src/design-system/radio-button-group.css
Add import to the new CSS file in src/design-system/index.css

Possible tokens:

Create the pages for:

On each MDX page make examples for each possible variant

Please follow these steps to create your branch:

git checkout release/1.0.0
git pull
git checkout -b 'feature/radio-group-design-system'