diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 24bf5357..efb80020 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -3666,10 +3666,6 @@ None. | Event name | Type | Detail | | :--------- | :--------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | | change | dispatched | -- | ## `StructuredListBody` @@ -3686,12 +3682,7 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | +None. ## `StructuredListCell` @@ -3699,7 +3690,6 @@ None. | Prop name | Required | Kind | Reactive | Type | Default value | Description | | :-------- | :------- | :--------------- | :------- | -------------------- | ------------------ | --------------------------------- | -| head | No | let | No | boolean | false | Set to `true` to use as a header | | noWrap | No | let | No | boolean | false | Set to `true` to prevent wrapping | ### Slots @@ -3710,12 +3700,7 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | +None. ## `StructuredListHead` @@ -3731,25 +3716,22 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | +None. ## `StructuredListInput` ### Props -| Prop name | Required | Kind | Reactive | Type | Default value | Description | -| :-------- | :------- | :--------------- | :------- | ----------------------------------------- | ------------------------------------------------ | -------------------------------------------- | -| ref | No | let | Yes | null | HTMLInputElement | null | Obtain a reference to the input HTML element | -| checked | No | let | Yes | boolean | false | Set to `true` to check the input | -| title | No | let | No | string | "title" | Specify the title of the input | -| value | No | let | No | string | "value" | Specify the value of the input | -| id | No | let | No | string | "ccs-" + Math.random().toString(36) | Set an id for the input element | -| name | No | let | No | string | "" | Specify a name attribute for the input | +| Prop name | Required | Kind | Reactive | Type | Default value | Description | +| :-------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------------- | +| ref | No | let | Yes | null | HTMLInputElement | null | Obtain a reference to the input HTML element | +| checked | No | let | Yes | boolean | false | Set to `true` to check the input | +| title | No | let | No | string | "title" | Specify the title of the input | +| value | No | let | No | string | "value" | Specify the value of the input | +| id | No | let | No | string | "ccs-" + Math.random().toString(36) | Set an id for the input element | +| name | No | let | No | string | "" | Specify a name attribute for the input | +| icon | No | let | No | typeof import("svelte").SvelteComponent | undefined | Specify the icon to render | +| iconDescription | No | let | No | string | "Select an option" | Specify the ARIA label for the accordion item chevron icon. | ### Slots @@ -3757,17 +3739,18 @@ None. ### Events -None. +| Event name | Type | Detail | +| :--------- | :-------- | :----- | +| change | forwarded | -- | ## `StructuredListRow` ### Props -| Prop name | Required | Kind | Reactive | Type | Default value | Description | -| :-------- | :------- | :--------------- | :------- | -------------------- | ------------------ | ------------------------------------ | -| head | No | let | No | boolean | false | Set to `true` to use as a header | -| label | No | let | No | boolean | false | Set to `true` to render a label slot | -| tabindex | No | let | No | string | "0" | Specify the tabindex | +| Prop name | Required | Kind | Reactive | Type | Default value | Description | +| :-------- | :------- | :--------------- | :------- | ---------------------------------------- | ------------------ | --------------------------------------- | +| tag | No | let | No | keyof HTMLElementTagNameMap | "div" | Specify the tag name | +| selected | No | let | No | boolean | false | Set to `true` to use the selected state | ### Slots @@ -3777,13 +3760,7 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | -| keydown | forwarded | -- | +None. ## `StructuredListSkeleton` @@ -3791,7 +3768,7 @@ None. | Prop name | Required | Kind | Reactive | Type | Default value | Description | | :-------- | :------- | :--------------- | :------- | ------------------- | -------------- | -------------------------- | -| rows | No | let | No | number | 5 | Specify the number of rows | +| count | No | let | No | number | 5 | Specify the number of rows | ### Slots @@ -3799,12 +3776,7 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| click | forwarded | -- | -| mouseover | forwarded | -- | -| mouseenter | forwarded | -- | -| mouseleave | forwarded | -- | +None. ## `Switch` diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index 7de6625f..a8d40ca8 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -11560,13 +11560,7 @@ ], "moduleExports": [], "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], - "events": [ - { "type": "forwarded", "name": "click", "element": "div" }, - { "type": "forwarded", "name": "mouseover", "element": "div" }, - { "type": "forwarded", "name": "mouseenter", "element": "div" }, - { "type": "forwarded", "name": "mouseleave", "element": "div" }, - { "type": "dispatched", "name": "change" } - ], + "events": [{ "type": "dispatched", "name": "change" }], "typedefs": [], "rest_props": { "type": "Element", "name": "div" } }, @@ -11576,12 +11570,7 @@ "props": [], "moduleExports": [], "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], - "events": [ - { "type": "forwarded", "name": "click", "element": "div" }, - { "type": "forwarded", "name": "mouseover", "element": "div" }, - { "type": "forwarded", "name": "mouseenter", "element": "div" }, - { "type": "forwarded", "name": "mouseleave", "element": "div" } - ], + "events": [], "typedefs": [], "rest_props": { "type": "Element", "name": "div" } }, @@ -11589,18 +11578,6 @@ "moduleName": "StructuredListCell", "filePath": "src/StructuredList/StructuredListCell.svelte", "props": [ - { - "name": "head", - "kind": "let", - "description": "Set to `true` to use as a header", - "type": "boolean", - "value": "false", - "isFunction": false, - "isFunctionDeclaration": false, - "isRequired": false, - "constant": false, - "reactive": false - }, { "name": "noWrap", "kind": "let", @@ -11616,12 +11593,7 @@ ], "moduleExports": [], "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], - "events": [ - { "type": "forwarded", "name": "click", "element": "div" }, - { "type": "forwarded", "name": "mouseover", "element": "div" }, - { "type": "forwarded", "name": "mouseenter", "element": "div" }, - { "type": "forwarded", "name": "mouseleave", "element": "div" } - ], + "events": [], "typedefs": [], "rest_props": { "type": "Element", "name": "div" } }, @@ -11631,12 +11603,7 @@ "props": [], "moduleExports": [], "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], - "events": [ - { "type": "forwarded", "name": "click", "element": "div" }, - { "type": "forwarded", "name": "mouseover", "element": "div" }, - { "type": "forwarded", "name": "mouseenter", "element": "div" }, - { "type": "forwarded", "name": "mouseleave", "element": "div" } - ], + "events": [], "typedefs": [], "rest_props": { "type": "Element", "name": "div" } }, @@ -11715,11 +11682,34 @@ "isRequired": false, "constant": false, "reactive": true + }, + { + "name": "icon", + "kind": "let", + "description": "Specify the icon to render", + "type": "typeof import(\"svelte\").SvelteComponent", + "isFunction": false, + "isFunctionDeclaration": false, + "isRequired": false, + "constant": false, + "reactive": false + }, + { + "name": "iconDescription", + "kind": "let", + "description": "Specify the ARIA label for the accordion item chevron icon.", + "type": "string", + "value": "\"Select an option\"", + "isFunction": false, + "isFunctionDeclaration": false, + "isRequired": false, + "constant": false, + "reactive": false } ], "moduleExports": [], "slots": [], - "events": [], + "events": [{ "type": "forwarded", "name": "change", "element": "input" }], "typedefs": [], "rest_props": { "type": "Element", "name": "input" } }, @@ -11728,11 +11718,11 @@ "filePath": "src/StructuredList/StructuredListRow.svelte", "props": [ { - "name": "head", + "name": "tag", "kind": "let", - "description": "Set to `true` to use as a header", - "type": "boolean", - "value": "false", + "description": "Specify the tag name", + "type": "keyof HTMLElementTagNameMap", + "value": "\"div\"", "isFunction": false, "isFunctionDeclaration": false, "isRequired": false, @@ -11740,9 +11730,9 @@ "reactive": false }, { - "name": "label", + "name": "selected", "kind": "let", - "description": "Set to `true` to render a label slot", + "description": "Set to `true` to use the selected state", "type": "boolean", "value": "false", "isFunction": false, @@ -11750,38 +11740,20 @@ "isRequired": false, "constant": false, "reactive": false - }, - { - "name": "tabindex", - "kind": "let", - "description": "Specify the tabindex", - "type": "string", - "value": "\"0\"", - "isFunction": false, - "isFunctionDeclaration": false, - "isRequired": false, - "constant": false, - "reactive": false } ], "moduleExports": [], "slots": [{ "name": "__default__", "default": true, "slot_props": "{}" }], - "events": [ - { "type": "forwarded", "name": "click", "element": "label" }, - { "type": "forwarded", "name": "mouseover", "element": "label" }, - { "type": "forwarded", "name": "mouseenter", "element": "label" }, - { "type": "forwarded", "name": "mouseleave", "element": "label" }, - { "type": "forwarded", "name": "keydown", "element": "label" } - ], + "events": [], "typedefs": [], - "rest_props": { "type": "Element", "name": "label" } + "rest_props": { "type": "Element", "name": "svelte:element" } }, { "moduleName": "StructuredListSkeleton", "filePath": "src/StructuredList/StructuredListSkeleton.svelte", "props": [ { - "name": "rows", + "name": "count", "kind": "let", "description": "Specify the number of rows", "type": "number", @@ -11795,14 +11767,8 @@ ], "moduleExports": [], "slots": [], - "events": [ - { "type": "forwarded", "name": "click", "element": "div" }, - { "type": "forwarded", "name": "mouseover", "element": "div" }, - { "type": "forwarded", "name": "mouseenter", "element": "div" }, - { "type": "forwarded", "name": "mouseleave", "element": "div" } - ], - "typedefs": [], - "rest_props": { "type": "Element", "name": "div" } + "events": [], + "typedefs": [] }, { "moduleName": "Switch", diff --git a/docs/src/pages/components/StructuredList.svx b/docs/src/pages/components/StructuredList.svx index 775139f4..96a5f0d2 100644 --- a/docs/src/pages/components/StructuredList.svx +++ b/docs/src/pages/components/StructuredList.svx @@ -12,10 +12,10 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " - - Column A - Column B - Column C + + Column A + Column B + Column C @@ -24,9 +24,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -34,9 +32,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -44,9 +40,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -56,10 +50,10 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " - - Column A - Column B - Column C + + Column A + Column B + Column C @@ -68,9 +62,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -78,9 +70,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -88,9 +78,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -100,10 +88,10 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " - - Column A - Column B - Column C + + Column A + Column B + Column C @@ -112,9 +100,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 1 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -122,9 +108,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 2 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -132,9 +116,7 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " Row 3 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. + magna, finibus id tortor sed, aliquet bibendum augue. @@ -142,44 +124,14 @@ components: ["StructuredList", "StructuredListSkeleton", "StructuredListBody", " ## Selectable rows - - - - ColumnA - ColumnB - ColumnC - {''} - - - - {#each [1, 2, 3] as item} - - Row {item} - Row {item} - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean - posuere sem vel euismod dignissim. Nulla ut cursus dolor. - Pellentesque vulputate nisl a porttitor interdum. - - - - - - - {/each} - - + ## Skeleton - + + +## Skeleton (custom count) + +By default, the skeleton will render 5 rows. You can customize the number of rows by passing a `count` prop. + + \ No newline at end of file diff --git a/docs/src/pages/framed/StructuredList/ProgrammaticStructuredList.svelte b/docs/src/pages/framed/StructuredList/ProgrammaticStructuredList.svelte new file mode 100644 index 00000000..b0dbf7c2 --- /dev/null +++ b/docs/src/pages/framed/StructuredList/ProgrammaticStructuredList.svelte @@ -0,0 +1,44 @@ + + + + + + Service + Description + + + + + {#each rows as row (row.value)} + {@const selected =row.value === selected} + + {row.value} + {row.description} + + + {/each} + + diff --git a/src/StructuredList/StructuredList.svelte b/src/StructuredList/StructuredList.svelte index 4acc311e..68998746 100644 --- a/src/StructuredList/StructuredList.svelte +++ b/src/StructuredList/StructuredList.svelte @@ -1,4 +1,6 @@ - -
diff --git a/src/StructuredList/StructuredListBody.svelte b/src/StructuredList/StructuredListBody.svelte index f722ff93..4a8cd04c 100644 --- a/src/StructuredList/StructuredListBody.svelte +++ b/src/StructuredList/StructuredListBody.svelte @@ -1,13 +1,7 @@ - -
diff --git a/src/StructuredList/StructuredListCell.svelte b/src/StructuredList/StructuredListCell.svelte index 93a162b3..d20ebea3 100644 --- a/src/StructuredList/StructuredListCell.svelte +++ b/src/StructuredList/StructuredListCell.svelte @@ -1,22 +1,21 @@ -
diff --git a/src/StructuredList/StructuredListHead.svelte b/src/StructuredList/StructuredListHead.svelte index 3004a5dd..1d803cd8 100644 --- a/src/StructuredList/StructuredListHead.svelte +++ b/src/StructuredList/StructuredListHead.svelte @@ -1,13 +1,10 @@ - - -
+ + +
diff --git a/src/StructuredList/StructuredListInput.svelte b/src/StructuredList/StructuredListInput.svelte index 2b0f365e..3d8abb3a 100644 --- a/src/StructuredList/StructuredListInput.svelte +++ b/src/StructuredList/StructuredListInput.svelte @@ -1,4 +1,6 @@ - -{#if label} - - - - -{:else} - -
- -
-{/if} + + + diff --git a/src/StructuredList/StructuredListSkeleton.svelte b/src/StructuredList/StructuredListSkeleton.svelte index 300294d9..e661f7fd 100644 --- a/src/StructuredList/StructuredListSkeleton.svelte +++ b/src/StructuredList/StructuredListSkeleton.svelte @@ -1,19 +1,11 @@ - - -
+
- {#each Array.from({ length: rows }, (_, i) => i) as row, i (row)} + {#each Array.from({ length: count }) as row}
diff --git a/tests/StructuredList.test.svelte b/tests/StructuredList.test.svelte index e5cbdbc8..83d233ce 100644 --- a/tests/StructuredList.test.svelte +++ b/tests/StructuredList.test.svelte @@ -13,82 +13,33 @@ - - Column A - Column B - Column C + + Column A + Column B + Column C Row 1 Row 1 - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui magna, - finibus id tortor sed, aliquet bibendum augue. Aenean posuere sem vel - euismod dignissim. Nulla ut cursus dolor. Pellentesque vulputate nisl a - porttitor interdum. - + Row 1. - - Row 2 - Row 2 - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui magna, - finibus id tortor sed, aliquet bibendum augue. Aenean posuere sem vel - euismod dignissim. Nulla ut cursus dolor. Pellentesque vulputate nisl a - porttitor interdum. - - - - Row 3 - Row 3 - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui magna, - finibus id tortor sed, aliquet bibendum augue. Aenean posuere sem vel - euismod dignissim. Nulla ut cursus dolor. Pellentesque vulputate nisl a - porttitor interdum. - - - - - - - - - ColumnA - ColumnB - ColumnC - {""} - - - {#each [1, 2, 3] as item} - + + Row {item} Row {item} Row {item} - - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc dui - magna, finibus id tortor sed, aliquet bibendum augue. Aenean posuere - sem vel euismod dignissim. Nulla ut cursus dolor. Pellentesque - vulputate nisl a porttitor interdum. - - - - {/each} - + diff --git a/types/StructuredList/StructuredList.svelte.d.ts b/types/StructuredList/StructuredList.svelte.d.ts index b8172b44..597a4d70 100644 --- a/types/StructuredList/StructuredList.svelte.d.ts +++ b/types/StructuredList/StructuredList.svelte.d.ts @@ -33,12 +33,6 @@ export interface StructuredListProps extends RestProps { export default class StructuredList extends SvelteComponentTyped< StructuredListProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - change: CustomEvent; - }, + { change: CustomEvent }, { default: {} } > {} diff --git a/types/StructuredList/StructuredListBody.svelte.d.ts b/types/StructuredList/StructuredListBody.svelte.d.ts index b865022a..dcc17dcb 100644 --- a/types/StructuredList/StructuredListBody.svelte.d.ts +++ b/types/StructuredList/StructuredListBody.svelte.d.ts @@ -9,11 +9,6 @@ export interface StructuredListBodyProps extends RestProps { export default class StructuredListBody extends SvelteComponentTyped< StructuredListBodyProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - }, + Record, { default: {} } > {} diff --git a/types/StructuredList/StructuredListCell.svelte.d.ts b/types/StructuredList/StructuredListCell.svelte.d.ts index 101ee103..40f3d5d5 100644 --- a/types/StructuredList/StructuredListCell.svelte.d.ts +++ b/types/StructuredList/StructuredListCell.svelte.d.ts @@ -4,12 +4,6 @@ import type { SvelteHTMLElements } from "svelte/elements"; type RestProps = SvelteHTMLElements["div"]; export interface StructuredListCellProps extends RestProps { - /** - * Set to `true` to use as a header - * @default false - */ - head?: boolean; - /** * Set to `true` to prevent wrapping * @default false @@ -21,11 +15,6 @@ export interface StructuredListCellProps extends RestProps { export default class StructuredListCell extends SvelteComponentTyped< StructuredListCellProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - }, + Record, { default: {} } > {} diff --git a/types/StructuredList/StructuredListHead.svelte.d.ts b/types/StructuredList/StructuredListHead.svelte.d.ts index 3b0a2890..55323f4e 100644 --- a/types/StructuredList/StructuredListHead.svelte.d.ts +++ b/types/StructuredList/StructuredListHead.svelte.d.ts @@ -9,11 +9,6 @@ export interface StructuredListHeadProps extends RestProps { export default class StructuredListHead extends SvelteComponentTyped< StructuredListHeadProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - }, + Record, { default: {} } > {} diff --git a/types/StructuredList/StructuredListInput.svelte.d.ts b/types/StructuredList/StructuredListInput.svelte.d.ts index 95282fbb..a7237366 100644 --- a/types/StructuredList/StructuredListInput.svelte.d.ts +++ b/types/StructuredList/StructuredListInput.svelte.d.ts @@ -40,11 +40,23 @@ export interface StructuredListInputProps extends RestProps { */ ref?: null | HTMLInputElement; + /** + * Specify the icon to render + * @default undefined + */ + icon?: typeof import("svelte").SvelteComponent; + + /** + * Specify the ARIA label for the accordion item chevron icon. + * @default "Select an option" + */ + iconDescription?: string; + [key: `data-${string}`]: any; } export default class StructuredListInput extends SvelteComponentTyped< StructuredListInputProps, - Record, + { change: WindowEventMap["change"] }, {} > {} diff --git a/types/StructuredList/StructuredListRow.svelte.d.ts b/types/StructuredList/StructuredListRow.svelte.d.ts index a7a7c8f8..484bc8b2 100644 --- a/types/StructuredList/StructuredListRow.svelte.d.ts +++ b/types/StructuredList/StructuredListRow.svelte.d.ts @@ -1,38 +1,26 @@ import type { SvelteComponentTyped } from "svelte"; import type { SvelteHTMLElements } from "svelte/elements"; -type RestProps = SvelteHTMLElements["label"]; +type RestProps = SvelteHTMLElements["svelte:element"]; export interface StructuredListRowProps extends RestProps { /** - * Set to `true` to use as a header - * @default false + * Specify the tag name + * @default "div" */ - head?: boolean; + tag?: keyof HTMLElementTagNameMap; /** - * Set to `true` to render a label slot + * Set to `true` to use the selected state * @default false */ - label?: boolean; - - /** - * Specify the tabindex - * @default "0" - */ - tabindex?: string; + selected?: boolean; [key: `data-${string}`]: any; } export default class StructuredListRow extends SvelteComponentTyped< StructuredListRowProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - keydown: WindowEventMap["keydown"]; - }, + Record, { default: {} } > {} diff --git a/types/StructuredList/StructuredListSkeleton.svelte.d.ts b/types/StructuredList/StructuredListSkeleton.svelte.d.ts index 555a201f..fa6d00aa 100644 --- a/types/StructuredList/StructuredListSkeleton.svelte.d.ts +++ b/types/StructuredList/StructuredListSkeleton.svelte.d.ts @@ -1,25 +1,15 @@ import type { SvelteComponentTyped } from "svelte"; -import type { SvelteHTMLElements } from "svelte/elements"; -type RestProps = SvelteHTMLElements["div"]; - -export interface StructuredListSkeletonProps extends RestProps { +export interface StructuredListSkeletonProps { /** * Specify the number of rows * @default 5 */ - rows?: number; - - [key: `data-${string}`]: any; + count?: number; } export default class StructuredListSkeleton extends SvelteComponentTyped< StructuredListSkeletonProps, - { - click: WindowEventMap["click"]; - mouseover: WindowEventMap["mouseover"]; - mouseenter: WindowEventMap["mouseenter"]; - mouseleave: WindowEventMap["mouseleave"]; - }, + Record, {} > {}