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

docs: add "Disabled items" examples

Browse source
This commit is contained in:
Eric Liu 2022-06-02 17:55:06 -07:00
commit c690bee810
3 changed files with 45 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

16
docs/src/pages/components/ComboBox.svx
View file

@ -112,7 +112,7 @@ items={[
{id: "2", text: "Fax"}
]} />
### Disabled
### Disabled state
<ComboBox disabled titleText="Contact" placeholder="Select contact method"
items={[
@ -120,3 +120,17 @@ items={[
{id: "1", text: "Email"},
{id: "2", text: "Fax"}
]} />
### Disabled items
Use the `disabled` property in the `items` prop to disable specific items.
<ComboBox
titleText="Contact"
placeholder="Select contact method"
items={[
{ id: "0", text: "Slack" },
{ id: "1", text: "Email", disabled: true },
{ id: "2", text: "Fax" },
]}
/>

14
docs/src/pages/components/Dropdown.svx
View file

@ -95,6 +95,20 @@ Set `direction` to `"top"` for the dropdown menu to appear above the input.
{id: "1", text: "Email"},
{id: "2", text: "Fax"}]}" />
### Disabled items
Use the `disabled` property in the `items` prop to disable specific items.
<Dropdown
selectedId="0"
titleText="Contact"
items={[
{ id: "0", text: "Slack" },
{ id: "1", text: "Email", disabled: true },
{ id: "2", text: "Fax" },
]}
/>
### Skeleton
<DropdownSkeleton />

14
docs/src/pages/components/MultiSelect.svx
View file

@ -146,3 +146,17 @@ Set `direction` to `"top"` for the dropdown menu to appear above the input.
{id: "1", text: "Email"},
{id: "2", text: "Fax"}]}"
/>
### Disabled items
Use the `disabled` property in the `items` prop to disable specific items.
<MultiSelect
titleText="Contact"
label="Select contact methods..."
items={[
{ id: "0", text: "Slack" },
{ id: "1", text: "Email", disabled: true },
{ id: "2", text: "Fax" },
]}
/>