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

docs: add note that items object requires a unique id

Browse source
This commit is contained in:
Eric Liu 2022-03-19 09:58:54 -07:00
commit 2725982e0c
4 changed files with 20 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -3,6 +3,12 @@
import Preview from "../../components/Preview.svelte"; import Preview from "../../components/Preview.svelte";
</script> </script>
`ComboBox` is keyed for performance reasons.
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">Every <code>items</code> object must have a unique "id" property.</div>
</InlineNotification>
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton> <InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01"> <div class="body-short-01">
Since version 0.53, <strong>selectedIndex</strong> has been replaced with <strong>selectedId</strong>. Since version 0.53, <strong>selectedIndex</strong> has been replaced with <strong>selectedId</strong>.

2
docs/src/pages/components/DataTable.svx
View file

@ -10,7 +10,7 @@ components: ["DataTable", "Pagination","Toolbar", "ToolbarContent", "ToolbarSear
const pagination = { pageSize: 5, page: 1} const pagination = { pageSize: 5, page: 1}
</script> </script>
`DataTable` is keyed for both rendering and sorting purposes. `DataTable` is keyed for performance reasons.
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton> <InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">Every <code>headers</code> object must have a unique "key" property.</div> <div class="body-short-01">Every <code>headers</code> object must have a unique "key" property.</div>

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

@ -7,6 +7,12 @@ components: ["Dropdown", "DropdownSkeleton"]
import Preview from "../../components/Preview.svelte"; import Preview from "../../components/Preview.svelte";
</script> </script>
`Dropdown` is keyed for performance reasons.
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">Every <code>items</code> object must have a unique "id" property.</div>
</InlineNotification>
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton> <InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01"> <div class="body-short-01">
Since version 0.53, <strong>selectedIndex</strong> has been replaced with <strong>selectedId</strong>. Since version 0.53, <strong>selectedIndex</strong> has been replaced with <strong>selectedId</strong>.

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

@ -1,8 +1,14 @@
<script> <script>
import { MultiSelect } from "carbon-components-svelte"; import { MultiSelect, InlineNotification } from "carbon-components-svelte";
import Preview from "../../components/Preview.svelte"; import Preview from "../../components/Preview.svelte";
</script> </script>
`MultiSelect` is keyed for performance reasons.
<InlineNotification svx-ignore lowContrast title="Note:" kind="info" hideCloseButton>
<div class="body-short-01">Every <code>items</code> object must have a unique "id" property.</div>
</InlineNotification>
### Default ### Default
By default, items will be ordered alphabetically based on the `item.text` value. To prevent this, see [#no-alphabetical-ordering](#no-alphabetical-ordering). By default, items will be ordered alphabetically based on the `item.text` value. To prevent this, see [#no-alphabetical-ordering](#no-alphabetical-ordering).