mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 11:36:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

docs(radio-button): name must be unique for multiple instances

Browse source
This commit is contained in:
metonym 2023-10-03 11:15:28 -07:00
commit 5a7c201e0c
1 changed files with 5 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
docs/src/pages/components/RadioButton.svx
View file

@ -23,7 +23,7 @@ It's recommended that you provide a legend for accessibility.
Use `hideLegend` to visually hide the legend text. Use `hideLegend` to visually hide the legend text.
<RadioButtonGroup hideLegend legendText="Storage tier (disk)" selected="standard"> <RadioButtonGroup hideLegend legendText="Storage tier (disk)" name="plan-legend" selected="standard">
<RadioButton labelText="Free (1 GB)" value="free" /> <RadioButton labelText="Free (1 GB)" value="free" />
<RadioButton labelText="Standard (10 GB)" value="standard" /> <RadioButton labelText="Standard (10 GB)" value="standard" />
<RadioButton labelText="Pro (128 GB)" value="pro" /> <RadioButton labelText="Pro (128 GB)" value="pro" />
@ -33,7 +33,7 @@ Use `hideLegend` to visually hide the legend text.
Use the named "legendText" slot to customize the legend text. Use the named "legendText" slot to customize the legend text.
<RadioButtonGroup name="plan" selected="standard"> <RadioButtonGroup name="plan-legend-slot" selected="standard">
<div slot="legendText" style:display="flex"> <div slot="legendText" style:display="flex">
Storage tier (disk) Storage tier (disk)
<Tooltip> <Tooltip>
@ -55,7 +55,7 @@ Use the `selected` prop to bind and update the selected value.
## Left-aligned label text ## Left-aligned label text
<RadioButtonGroup labelPosition="left" legendText="Storage tier (disk)" name="plan" selected="standard"> <RadioButtonGroup labelPosition="left" legendText="Storage tier (disk)" name="plan-left-aligned" selected="standard">
<RadioButton labelText="Free (1 GB)" value="free" /> <RadioButton labelText="Free (1 GB)" value="free" />
<RadioButton labelText="Standard (10 GB)" value="standard" /> <RadioButton labelText="Standard (10 GB)" value="standard" />
<RadioButton labelText="Pro (128 GB)" value="pro" /> <RadioButton labelText="Pro (128 GB)" value="pro" />
@ -63,7 +63,7 @@ Use the `selected` prop to bind and update the selected value.
## Disabled buttons ## Disabled buttons
<RadioButtonGroup labelPosition="left" legendText="Storage tier (disk)" name="plan" selected="standard"> <RadioButtonGroup labelPosition="left" legendText="Storage tier (disk)" name="plan-disabled" selected="standard">
<RadioButton disabled labelText="Free (1 GB)" value="free" /> <RadioButton disabled labelText="Free (1 GB)" value="free" />
<RadioButton labelText="Standard (10 GB)" value="standard" /> <RadioButton labelText="Standard (10 GB)" value="standard" />
<RadioButton disabled labelText="Pro (128 GB)" value="pro" /> <RadioButton disabled labelText="Pro (128 GB)" value="pro" />
@ -71,7 +71,7 @@ Use the `selected` prop to bind and update the selected value.
## Vertical orientation ## Vertical orientation
<RadioButtonGroup orientation="vertical" legendText="Storage tier (disk)" name="plan" selected="standard"> <RadioButtonGroup orientation="vertical" legendText="Storage tier (disk)" name="plan-vertical" selected="standard">
<RadioButton labelText="Free (1 GB)" value="free" /> <RadioButton labelText="Free (1 GB)" value="free" />
<RadioButton labelText="Standard (10 GB)" value="standard" /> <RadioButton labelText="Standard (10 GB)" value="standard" />
<RadioButton labelText="Pro (128 GB)" value="pro" /> <RadioButton labelText="Pro (128 GB)" value="pro" />