feat(typescript)!: support svelte 4 (#1773)

Closes #1753 

The minimum Svelte version required for TypeScript users is now 3.55.
This commit is contained in:
Eric Liu 2023-07-19 09:44:56 -07:00 committed by GitHub
commit 2f026f792a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
192 changed files with 941 additions and 712 deletions

View file

@ -379,7 +379,7 @@ export type BreakpointValue = 320 | 672 | 1056 | 1312 | 1584;
| size | No | <code>let</code> | No | <code>"default" &#124; "field" &#124; "small" &#124; "lg" &#124; "xl"</code> | <code>"default"</code> | Specify the size of button |
| expressive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use Carbon's expressive typesetting |
| isSelected | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the selected state for an icon-only, ghost button |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the ARIA label for the button icon |
| tooltipAlignment | No | <code>let</code> | No | <code>"start" &#124; "center" &#124; "end"</code> | <code>"center"</code> | Set the alignment of the tooltip relative to the icon.<br />Only applies to icon-only buttons |
| tooltipPosition | No | <code>let</code> | No | <code>"top" &#124; "right" &#124; "bottom" &#124; "left"</code> | <code>"bottom"</code> | Set the position of the tooltip relative to the icon |
@ -841,18 +841,18 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :----------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLLIElement</code> | <code>null</code> | Obtain a reference to the list item HTML element |
| selectable | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to enable the selectable variant<br />Automatically set to `true` if `selected` is `true` |
| selected | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to use the selected variant |
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render<br />Icon is rendered to the left of the label text |
| indented | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to indent the label |
| kind | No | <code>let</code> | No | <code>"default" &#124; "danger"</code> | <code>"default"</code> | Specify the kind of option |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the disabled state |
| labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text<br />Alternatively, use the "labelText" slot (e.g., &lt;span slot="labelText"&gt;...&lt;/span&gt;) |
| shortcutText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the shortcut text<br />Alternatively, use the "shortcutText" slot (e.g., &lt;span slot="shortcutText"&gt;...&lt;/span&gt;) |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Specify the id<br />It's recommended to provide an id as a value to bind to within a selectable/radio menu group |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :----------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLLIElement</code> | <code>null</code> | Obtain a reference to the list item HTML element |
| selectable | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to enable the selectable variant<br />Automatically set to `true` if `selected` is `true` |
| selected | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to use the selected variant |
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render<br />Icon is rendered to the left of the label text |
| indented | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to indent the label |
| kind | No | <code>let</code> | No | <code>"default" &#124; "danger"</code> | <code>"default"</code> | Specify the kind of option |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the disabled state |
| labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text<br />Alternatively, use the "labelText" slot (e.g., &lt;span slot="labelText"&gt;...&lt;/span&gt;) |
| shortcutText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the shortcut text<br />Alternatively, use the "shortcutText" slot (e.g., &lt;span slot="shortcutText"&gt;...&lt;/span&gt;) |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Specify the id<br />It's recommended to provide an id as a value to bind to within a selectable/radio menu group |
### Slots
@ -1568,19 +1568,19 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :---------------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| isSideNavOpen | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the side nav |
| expandedByDefault | No | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `false` to hide the side nav by default |
| uiShellAriaLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the ARIA label for the header |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| company | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the company name. <br />Alternatively, use the named slot "company" (e.g., `&lt;span slot="company"&gt;...&lt;/span&gt;`) |
| platformName | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the platform name.<br />Alternatively, use the named slot "platform" (e.g., `&lt;span slot="platform"&gt;...&lt;/span&gt;`) |
| persistentHamburgerMenu | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to persist the hamburger menu |
| expansionBreakpoint | No | <code>let</code> | No | <code>number</code> | <code>1056</code> | The window width (px) at which the SideNav is expanded and the hamburger menu is hidden.<br />1056 represents the "large" breakpoint in pixels from the Carbon Design System:<br />- small: 320<br />- medium: 672<br />- large: 1056<br />- x-large: 1312<br />- max: 1584 |
| iconMenu | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render for the closed state.<br />Defaults to `&lt;Menu size={20} /&gt;` |
| iconClose | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render for the opened state.<br />Defaults to `&lt;Close size={20} /&gt;` |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :---------------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| isSideNavOpen | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the side nav |
| expandedByDefault | No | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `false` to hide the side nav by default |
| uiShellAriaLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the ARIA label for the header |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| company | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the company name. <br />Alternatively, use the named slot "company" (e.g., `&lt;span slot="company"&gt;...&lt;/span&gt;`) |
| platformName | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the platform name.<br />Alternatively, use the named slot "platform" (e.g., `&lt;span slot="platform"&gt;...&lt;/span&gt;`) |
| persistentHamburgerMenu | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to persist the hamburger menu |
| expansionBreakpoint | No | <code>let</code> | No | <code>number</code> | <code>1056</code> | The window width (px) at which the SideNav is expanded and the hamburger menu is hidden.<br />1056 represents the "large" breakpoint in pixels from the Carbon Design System:<br />- small: 320<br />- medium: 672<br />- large: 1056<br />- x-large: 1312<br />- max: 1584 |
| iconMenu | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render for the closed state.<br />Defaults to `&lt;Menu size={20} /&gt;` |
| iconClose | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render for the opened state.<br />Defaults to `&lt;Close size={20} /&gt;` |
### Slots
@ -1605,8 +1605,8 @@ None.
| :------------------------- | :------- | :--------------- | :------- | ----------------------------------------------------------------- | ------------------------------ | ------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the button HTML element |
| isOpen | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the panel |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render when the action panel is closed.<br />Defaults to `&lt;Switcher size={20} /&gt;` |
| closeIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render when the action panel is open.<br />Defaults to `&lt;Close size={20} /&gt;` |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render when the action panel is closed.<br />Defaults to `&lt;Switcher size={20} /&gt;` |
| closeIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render when the action panel is open.<br />Defaults to `&lt;Close size={20} /&gt;` |
| text | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the text<br />Alternatively, use the named slot "text" (e.g., &lt;div slot="text"&gt;...&lt;/div&gt;) |
| transition | No | <code>let</code> | No | <code>false &#124; import("svelte/transition").SlideParams</code> | <code>{ duration: 200 }</code> | Customize the panel transition (i.e., `transition:slide`).<br />Set to `false` to disable the transition |
| preventCloseOnClickOutside | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to prevent the panel from closing when clicking outside |
@ -1632,12 +1632,12 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :----------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| linkIsActive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the active state |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :----------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| linkIsActive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the active state |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
### Slots
@ -1653,11 +1653,11 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the HTML button element |
| isActive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the active variant |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the HTML button element |
| isActive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the active variant |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
### Slots
@ -1958,7 +1958,7 @@ None.
| size | No | <code>let</code> | No | <code>"sm" &#124; "lg"</code> | <code>undefined</code> | Specify the size of the link |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the href value |
| inline | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the inline variant |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render<br />`inline` must be `false` |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render<br />`inline` must be `false` |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the checkbox |
| visited | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to allow visited styles |
@ -2211,29 +2211,29 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :------------------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLDivElement</code> | <code>null</code> | Obtain a reference to the top-level HTML element |
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the modal |
| size | No | <code>let</code> | No | <code>"xs" &#124; "sm" &#124; "lg"</code> | <code>undefined</code> | Set the size of the modal |
| danger | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the danger variant |
| alert | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable alert mode |
| passiveModal | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the passive variant |
| modalHeading | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the modal heading |
| modalLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the modal label |
| modalAriaLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the ARIA label for the modal |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Close the modal"</code> | Specify the ARIA label for the close icon |
| hasForm | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains form elements |
| hasScrollingContent | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains scrolling content |
| primaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text |
| primaryButtonDisabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button |
| primaryButtonIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the primary button icon |
| shouldSubmitOnEnter | No | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `true` for the "submit" and "click:button--primary" events<br />to be dispatched when pressing "Enter" |
| secondaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text |
| secondaryButtons | No | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` |
| selectorPrimaryFocus | No | <code>let</code> | No | <code>string</code> | <code>"[data-modal-primary-focus]"</code> | Specify a selector to be focused when opening the modal |
| preventCloseOnClickOutside | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to prevent the modal from closing when clicking outside |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the top-level element |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :------------------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLDivElement</code> | <code>null</code> | Obtain a reference to the top-level HTML element |
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the modal |
| size | No | <code>let</code> | No | <code>"xs" &#124; "sm" &#124; "lg"</code> | <code>undefined</code> | Set the size of the modal |
| danger | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the danger variant |
| alert | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable alert mode |
| passiveModal | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the passive variant |
| modalHeading | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the modal heading |
| modalLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the modal label |
| modalAriaLabel | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the ARIA label for the modal |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Close the modal"</code> | Specify the ARIA label for the close icon |
| hasForm | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains form elements |
| hasScrollingContent | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` if the modal contains scrolling content |
| primaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text |
| primaryButtonDisabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button |
| primaryButtonIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the primary button icon |
| shouldSubmitOnEnter | No | <code>let</code> | No | <code>boolean</code> | <code>true</code> | Set to `true` for the "submit" and "click:button--primary" events<br />to be dispatched when pressing "Enter" |
| secondaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text |
| secondaryButtons | No | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` |
| selectorPrimaryFocus | No | <code>let</code> | No | <code>string</code> | <code>"[data-modal-primary-focus]"</code> | Specify a selector to be focused when opening the modal |
| preventCloseOnClickOutside | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to prevent the modal from closing when clicking outside |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the top-level element |
### Slots
@ -2282,16 +2282,16 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | ------------------------------------------------------------------------------------------------------- |
| primaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text |
| primaryButtonIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the primary button icon |
| primaryButtonDisabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button |
| primaryClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a class for the primary button |
| secondaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text |
| secondaryButtons | No | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` |
| secondaryClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a class for the secondary button |
| danger | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the danger variant |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | ------------------------------------------------------------------------------------------------------- |
| primaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the primary button text |
| primaryButtonIcon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the primary button icon |
| primaryButtonDisabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the primary button |
| primaryClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a class for the primary button |
| secondaryButtonText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the secondary button text |
| secondaryButtons | No | <code>let</code> | No | <code>[{ text: string; }, { text: string; }]</code> | <code>[]</code> | 2-tuple prop to render two secondary buttons for a 3 button modal<br />supersedes `secondaryButtonText` |
| secondaryClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify a class for the secondary button |
| danger | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to use the danger variant |
### Slots
@ -2431,12 +2431,12 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ------------------------- | ----------------------------------- |
| notificationType | No | <code>let</code> | No | <code>"toast" &#124; "inline"</code> | <code>"toast"</code> | Set the type of notification |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| title | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the title of the icon |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Close icon"</code> | Specify the ARIA label for the icon |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------- | ----------------------------------- |
| notificationType | No | <code>let</code> | No | <code>"toast" &#124; "inline"</code> | <code>"toast"</code> | Set the type of notification |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
| title | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the title of the icon |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Close icon"</code> | Specify the ARIA label for the icon |
### Slots
@ -2598,20 +2598,20 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------------------------------- |
| menuRef | No | <code>let</code> | Yes | <code>null &#124; HTMLUListElement</code> | <code>null</code> | Obtain a reference to the overflow menu element |
| buttonRef | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the trigger button element |
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `&lt;OverflowMenuVertical /&gt;` |
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the menu |
| size | No | <code>let</code> | No | <code>"sm" &#124; "xl"</code> | <code>undefined</code> | Specify the size of the overflow menu |
| direction | No | <code>let</code> | No | <code>"top" &#124; "bottom"</code> | <code>"bottom"</code> | Specify the direction of the overflow menu relative to the button |
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
| flipped | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to flip the menu relative to the button |
| menuOptionsClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the menu options class |
| iconClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the icon class |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Open and close list of options"</code> | Specify the ARIA label for the icon |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the button element |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------------------------------ | ----------------------------------------------------------------------------- |
| menuRef | No | <code>let</code> | Yes | <code>null &#124; HTMLUListElement</code> | <code>null</code> | Obtain a reference to the overflow menu element |
| buttonRef | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the trigger button element |
| icon | No | <code>let</code> | Yes | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `&lt;OverflowMenuVertical /&gt;` |
| open | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to open the menu |
| size | No | <code>let</code> | No | <code>"sm" &#124; "xl"</code> | <code>undefined</code> | Specify the size of the overflow menu |
| direction | No | <code>let</code> | No | <code>"top" &#124; "bottom"</code> | <code>"bottom"</code> | Specify the direction of the overflow menu relative to the button |
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
| flipped | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to flip the menu relative to the button |
| menuOptionsClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the menu options class |
| iconClass | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the icon class |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>"Open and close list of options"</code> | Specify the ARIA label for the icon |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the button element |
### Slots
@ -3089,24 +3089,24 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :------------------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ------------------------------------------------ | --------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element |
| expanded | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true to expand the search input |
| value | No | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Specify the value of the search input |
| size | No | <code>let</code> | No | <code>"sm" &#124; "lg" &#124; "xl"</code> | <code>"xl"</code> | Specify the size of the search input |
| searchClass | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the class name passed to the outer div element |
| skeleton | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to display the skeleton state |
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the search input |
| expandable | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the expandable variant |
| placeholder | No | <code>let</code> | No | <code>string</code> | <code>"Search..."</code> | Specify the `placeholder` attribute of the search input |
| autocomplete | No | <code>let</code> | No | <code>"on" &#124; "off"</code> | <code>"off"</code> | Specify the `autocomplete` attribute |
| autofocus | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to auto focus the search element |
| closeButtonLabelText | No | <code>let</code> | No | <code>string</code> | <code>"Clear search input"</code> | Specify the close button label text |
| labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `&lt;Search /&gt;` |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the input element |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :------------------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ------------------------------------------------ | --------------------------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element |
| expanded | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true to expand the search input |
| value | No | <code>let</code> | Yes | <code>any</code> | <code>""</code> | Specify the value of the search input |
| size | No | <code>let</code> | No | <code>"sm" &#124; "lg" &#124; "xl"</code> | <code>"xl"</code> | Specify the size of the search input |
| searchClass | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the class name passed to the outer div element |
| skeleton | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to display the skeleton state |
| light | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the light variant |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the search input |
| expandable | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to enable the expandable variant |
| placeholder | No | <code>let</code> | No | <code>string</code> | <code>"Search..."</code> | Specify the `placeholder` attribute of the search input |
| autocomplete | No | <code>let</code> | No | <code>"on" &#124; "off"</code> | <code>"off"</code> | Specify the `autocomplete` attribute |
| autofocus | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to auto focus the search element |
| closeButtonLabelText | No | <code>let</code> | No | <code>string</code> | <code>"Clear search input"</code> | Specify the close button label text |
| labelText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the label text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render.<br />Defaults to `&lt;Search /&gt;` |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the input element |
### Slots
@ -3349,13 +3349,13 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| isSelected | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to select the current link |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| text | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :--------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLAnchorElement</code> | <code>null</code> | Obtain a reference to the HTML anchor element |
| isSelected | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to select the current link |
| href | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the `href` attribute |
| text | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
### Slots
@ -3374,12 +3374,12 @@ None.
### Props
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------- | :------- | :--------------- | :------- | ---------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the HTML button element |
| expanded | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to toggle the expanded state |
| text | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------- | :------- | :--------------- | :------- | --------------------------------------------------------- | ---------------------- | --------------------------------------------- |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the HTML button element |
| expanded | No | <code>let</code> | Yes | <code>boolean</code> | <code>false</code> | Set to `true` to toggle the expanded state |
| text | No | <code>let</code> | No | <code>string</code> | <code>undefined</code> | Specify the text |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
### Slots
@ -3991,7 +3991,7 @@ None.
| interactive | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to render a `button` element instead of a `div` |
| skeleton | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to display the skeleton state |
| title | No | <code>let</code> | No | <code>string</code> | <code>"Clear filter"</code> | Set the title for the close button in a filterable tag |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
| id | No | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the filterable tag |
### Slots
@ -4553,7 +4553,7 @@ None.
| align | No | <code>let</code> | No | <code>"start" &#124; "center" &#124; "end"</code> | <code>"center"</code> | Set the alignment of the tooltip relative to the icon |
| direction | No | <code>let</code> | No | <code>"top" &#124; "right" &#124; "bottom" &#124; "left"</code> | <code>"bottom"</code> | Set the direction of the tooltip relative to the button |
| hideIcon | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to hide the tooltip icon |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render for the tooltip button.<br />Default to `&lt;Information /&gt;` |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render for the tooltip button.<br />Default to `&lt;Information /&gt;` |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the ARIA label for the tooltip button |
| iconName | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the icon name attribute |
| tabindex | No | <code>let</code> | No | <code>string</code> | <code>"0"</code> | Set the button tabindex |
@ -4636,7 +4636,7 @@ None.
| :---------- | :------- | :--------------- | :------- | --------------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------ |
| ref | No | <code>let</code> | Yes | <code>null &#124; HTMLButtonElement</code> | <code>null</code> | Obtain a reference to the button HTML element |
| tooltipText | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the tooltip text.<br />Alternatively, use the "tooltipText" slot |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent</code> | <code>undefined</code> | Specify the icon to render |
| icon | No | <code>let</code> | No | <code>typeof import("svelte").SvelteComponent<any></code> | <code>undefined</code> | Specify the icon to render |
| disabled | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the tooltip icon |
| align | No | <code>let</code> | No | <code>"start" &#124; "center" &#124; "end"</code> | <code>"center"</code> | Set the alignment of the tooltip relative to the icon |
| direction | No | <code>let</code> | No | <code>"top" &#124; "right" &#124; "bottom" &#124; "left"</code> | <code>"bottom"</code> | Set the direction of the tooltip relative to the icon |
@ -4669,7 +4669,7 @@ export type TreeNodeId = string | number;
export interface TreeNode {
id: TreeNodeId;
text: any;
icon?: typeof import("svelte").SvelteComponent;
icon?: typeof import("svelte").SvelteComponent<any>;
disabled?: boolean;
children?: TreeNode[];
}

View file

@ -501,7 +501,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -2117,7 +2117,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render\nIcon is rendered to the left of the label text",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -4811,7 +4811,7 @@
"name": "iconMenu",
"kind": "let",
"description": "Specify the icon to render for the closed state.\nDefaults to `<Menu size={20} />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -4822,7 +4822,7 @@
"name": "iconClose",
"kind": "let",
"description": "Specify the icon to render for the opened state.\nDefaults to `<Close size={20} />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -4871,7 +4871,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render when the action panel is closed.\nDefaults to `<Switcher size={20} />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -4882,7 +4882,7 @@
"name": "closeIcon",
"kind": "let",
"description": "Specify the icon to render when the action panel is open.\nDefaults to `<Close size={20} />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -4998,7 +4998,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -5051,7 +5051,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -5755,7 +5755,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render\n`inline` must be `false`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -6574,7 +6574,7 @@
"name": "primaryButtonIcon",
"kind": "let",
"description": "Specify the primary button icon",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -6765,7 +6765,7 @@
"name": "primaryButtonIcon",
"kind": "let",
"description": "Specify the primary button icon",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -7461,7 +7461,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -8029,7 +8029,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render.\nDefaults to `<OverflowMenuVertical />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -10013,7 +10013,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render.\nDefaults to `<Search />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -10739,7 +10739,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -10809,7 +10809,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -12287,7 +12287,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -14039,7 +14039,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render for the tooltip button.\nDefault to `<Information />`",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -14321,7 +14321,7 @@
"name": "icon",
"kind": "let",
"description": "Specify the icon to render",
"type": "typeof import(\"svelte\").SvelteComponent",
"type": "typeof import(\"svelte\").SvelteComponent<any>",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,
@ -14585,9 +14585,9 @@
"ts": "type TreeNodeId = string | number"
},
{
"type": "{ id: TreeNodeId; text: any; icon?: typeof import(\"svelte\").SvelteComponent; disabled?: boolean; children?: TreeNode[]; }",
"type": "{ id: TreeNodeId; text: any; icon?: typeof import(\"svelte\").SvelteComponent<any>; disabled?: boolean; children?: TreeNode[]; }",
"name": "TreeNode",
"ts": "interface TreeNode { id: TreeNodeId; text: any; icon?: typeof import(\"svelte\").SvelteComponent; disabled?: boolean; children?: TreeNode[]; }"
"ts": "interface TreeNode { id: TreeNodeId; text: any; icon?: typeof import(\"svelte\").SvelteComponent<any>; disabled?: boolean; children?: TreeNode[]; }"
}
],
"rest_props": { "type": "Element", "name": "ul" }

View file

@ -29,7 +29,7 @@
"@tsconfig/svelte": "^4.0.1",
"autoprefixer": "^10.4.8",
"carbon-components": "10.57.0",
"carbon-icons-svelte": "^11.2.0",
"carbon-icons-svelte": "^12.1.0",
"postcss": "^8.4.16",
"prettier": "^2.7.1",
"prettier-plugin-svelte": "^2.7.0",
@ -39,8 +39,8 @@
"sass": "^1.49.11",
"standard-version": "^9.5.0",
"sveld": "^0.18.1",
"svelte": "^3.58.0",
"svelte-check": "^3.4.3",
"svelte": "^4.1.0",
"svelte-check": "^3.4.6",
"typescript": "^4.7.4"
},
"standard-version": {

View file

@ -27,7 +27,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -8,7 +8,7 @@
/**
* Specify the primary button icon
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let primaryButtonIcon = undefined;

View file

@ -14,7 +14,7 @@
/**
* Specify the icon to render
* Icon is rendered to the left of the label text
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -19,7 +19,7 @@
/**
* Specify the icon to render
* `inline` must be `false`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -57,7 +57,7 @@
/**
* Specify the primary button icon
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let primaryButtonIcon = undefined;

View file

@ -7,7 +7,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = Close;

View file

@ -33,7 +33,7 @@
/**
* Specify the icon to render.
* Defaults to `<OverflowMenuVertical />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = OverflowMenuVertical;

View file

@ -56,7 +56,7 @@
/**
* Specify the icon to render.
* Defaults to `<Search />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = IconSearch;

View file

@ -27,7 +27,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -31,7 +31,7 @@
/**
* Specify the icon to render for the tooltip button.
* Default to `<Information />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = Information;

View file

@ -7,7 +7,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -1,7 +1,7 @@
<script>
/**
* @typedef {string | number} TreeNodeId
* @typedef {{ id: TreeNodeId; text: any; icon?: typeof import("svelte").SvelteComponent; disabled?: boolean; children?: TreeNode[]; }} TreeNode
* @typedef {{ id: TreeNodeId; text: any; icon?: typeof import("svelte").SvelteComponent<any>; disabled?: boolean; children?: TreeNode[]; }} TreeNode
* @event {TreeNode & { expanded: boolean; leaf: boolean; }} select
* @event {TreeNode & { expanded: boolean; leaf: boolean; }} toggle
* @event {TreeNode & { expanded: boolean; leaf: boolean; }} focus

View file

@ -45,7 +45,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -15,7 +15,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -11,14 +11,14 @@
/**
* Specify the icon to render for the closed state.
* Defaults to `<Menu size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let iconMenu = Menu;
/**
* Specify the icon to render for the opened state.
* Defaults to `<Close size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let iconClose = Close;

View file

@ -50,14 +50,14 @@
/**
* Specify the icon to render for the closed state.
* Defaults to `<Menu size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let iconMenu = Menu;
/**
* Specify the icon to render for the opened state.
* Defaults to `<Close size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let iconClose = Close;

View file

@ -10,14 +10,14 @@
/**
* Specify the icon to render when the action panel is closed.
* Defaults to `<Switcher size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = Switcher;
/**
* Specify the icon to render when the action panel is open.
* Defaults to `<Close size={20} />`
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let closeIcon = Close;

View file

@ -10,7 +10,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -4,7 +4,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -16,7 +16,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -10,7 +10,7 @@
/**
* Specify the icon to render
* @type {typeof import("svelte").SvelteComponent}
* @type {typeof import("svelte").SvelteComponent<any>}
*/
export let icon = undefined;

View file

@ -20,7 +20,7 @@
<Checkbox id="checkbox-2" labelText="Checkbox Label" disabled />
</FormGroup>
<FormGroup legendText="Radio buttons">
<RadioButtonGroup name="radio-button-group" selected="default-selected">
<RadioButtonGroup selected="default-selected">
<RadioButton
id="radio-1"
value="standard"
@ -40,7 +40,7 @@
</RadioButtonGroup>
</FormGroup>
<FormGroup>
<Select id="select-1" labelText="Select menu" value="placeholder-item">
<Select id="select-1" labelText="Select menu">
<SelectItem
disabled
hidden

View file

@ -6,7 +6,7 @@
<Search placeholder="Search catalog..." value="Cloud functions" />
<Search light name="search" dirname="search" />
<Search light name="search" />
<Search size="lg" />

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { AccordionSkeletonProps } from "./AccordionSkeleton.svelte";

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface AccordionItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["li"]> {
type RestProps = SvelteHTMLElements["li"];
export interface AccordionItemProps extends RestProps {
/**
* Specify the title of the accordion item heading
* Alternatively, use the "title" slot (e.g., <div slot="title">...</div>)

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface AccordionSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["ul"]> {
type RestProps = SvelteHTMLElements["ul"];
export interface AccordionSkeletonProps extends RestProps {
/**
* Specify the number of accordion items to render
* @default 4

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface AspectRatioProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface AspectRatioProps extends RestProps {
/**
* Specify the aspect ratio
* @default "2x1"
@ -23,6 +24,6 @@ export interface AspectRatioProps
export default class AspectRatio extends SvelteComponentTyped<
AspectRatioProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { BreadcrumbSkeletonProps } from "./BreadcrumbSkeleton.svelte";

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface BreadcrumbItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["li"]> {
type RestProps = SvelteHTMLElements["li"];
export interface BreadcrumbItemProps extends RestProps {
/**
* Set the `href` to use an anchor link
* @default undefined

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface BreadcrumbSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface BreadcrumbSkeletonProps extends RestProps {
/**
* Set to `true` to hide the breadcrumb trailing slash
* @default false

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export type BreakpointSize = "sm" | "md" | "lg" | "xlg" | "max";

View file

@ -1,12 +1,13 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
import type { ButtonSkeletonProps } from "./ButtonSkeleton.svelte";
export interface ButtonProps
extends ButtonSkeletonProps,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["button"]>,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["a"]>,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["button"] &
SvelteHTMLElements["a"] &
SvelteHTMLElements["div"];
export interface ButtonProps extends ButtonSkeletonProps, RestProps {
/**
* Specify the kind of button
* @default "primary"
@ -42,7 +43,7 @@ export interface ButtonProps
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent;
icon?: typeof import("svelte").SvelteComponent<any>;
/**
* Specify the ARIA label for the button icon

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ButtonSetProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ButtonSetProps extends RestProps {
/**
* Set to `true` to stack the buttons vertically
* @default false
@ -14,6 +15,6 @@ export interface ButtonSetProps
export default class ButtonSet extends SvelteComponentTyped<
ButtonSetProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ButtonSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["a"]> {
type RestProps = SvelteHTMLElements["a"];
export interface ButtonSkeletonProps extends RestProps {
/**
* Set the `href` to use an anchor link
* @default undefined

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface CheckboxProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface CheckboxProps extends RestProps {
/**
* Specify the value of the checkbox
* @default ""

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface CheckboxSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface CheckboxSkeletonProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export interface CodeSnippetProps {

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface CodeSnippetSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface CodeSnippetSkeletonProps extends RestProps {
/**
* Set the type of code snippet
* @default "single"

View file

@ -1,5 +1,5 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type ComboBoxItemId = any;
@ -9,8 +9,9 @@ export interface ComboBoxItem {
disabled?: boolean;
}
export interface ComboBoxProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["input"]> {
type RestProps = SvelteHTMLElements["input"];
export interface ComboBoxProps extends RestProps {
/**
* Set the combobox items
* @default []

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ComposedModalProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ComposedModalProps extends RestProps {
/**
* Set the size of the composed modal
* @default undefined

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ModalBodyProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ModalBodyProps extends RestProps {
/**
* Set to `true` if the modal contains form elements
* @default false
@ -20,6 +21,6 @@ export interface ModalBodyProps
export default class ModalBody extends SvelteComponentTyped<
ModalBodyProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ModalFooterProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ModalFooterProps extends RestProps {
/**
* Specify the primary button text
* @default ""
@ -13,7 +14,7 @@ export interface ModalFooterProps
* Specify the primary button icon
* @default undefined
*/
primaryButtonIcon?: typeof import("svelte").SvelteComponent;
primaryButtonIcon?: typeof import("svelte").SvelteComponent<any>;
/**
* Set to `true` to disable the primary button

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ModalHeaderProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ModalHeaderProps extends RestProps {
/**
* Specify the modal title
* @default ""

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ContentSwitcherProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ContentSwitcherProps extends RestProps {
/**
* Set the selected index of the switch item
* @default 0

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface SwitchProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["button"]> {
type RestProps = SvelteHTMLElements["button"];
export interface SwitchProps extends RestProps {
/**
* Specify the switch text
* Alternatively, use the "text" slot (e.g., <span slot="text">...</span>)

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ContextMenuProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["ul"]> {
type RestProps = SvelteHTMLElements["ul"];
export interface ContextMenuProps extends RestProps {
/**
* Specify an element or list of elements to trigger the context menu.
* If no element is specified, the context menu applies to the entire window

View file

@ -1,10 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export interface ContextMenuDividerProps {}
export default class ContextMenuDivider extends SvelteComponentTyped<
ContextMenuDividerProps,
{},
Record<string, any>,
{}
> {}

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export interface ContextMenuGroupProps {
@ -16,6 +15,6 @@ export interface ContextMenuGroupProps {
export default class ContextMenuGroup extends SvelteComponentTyped<
ContextMenuGroupProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ContextMenuOptionProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["li"]> {
type RestProps = SvelteHTMLElements["li"];
export interface ContextMenuOptionProps extends RestProps {
/**
* Specify the kind of option
* @default "default"
@ -26,7 +27,7 @@ export interface ContextMenuOptionProps
* Icon is rendered to the left of the label text
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent;
icon?: typeof import("svelte").SvelteComponent<any>;
/**
* Specify the label text

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export interface ContextMenuRadioGroupProps {
@ -17,6 +16,6 @@ export interface ContextMenuRadioGroupProps {
export default class ContextMenuRadioGroup extends SvelteComponentTyped<
ContextMenuRadioGroupProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface CopyButtonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["button"]> {
type RestProps = SvelteHTMLElements["button"];
export interface CopyButtonProps extends RestProps {
/**
* Set the feedback text shown after clicking the button
* @default "Copied!"

View file

@ -1,5 +1,5 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type DataTableKey = string;
@ -40,8 +40,9 @@ export interface DataTableCell {
display?: (item: Value) => DataTableValue;
}
export interface DataTableProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DataTableProps extends RestProps {
/**
* Specify the data table headers
* @default []

View file

@ -1,10 +1,11 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
import type { DataTableHeader } from "./DataTable.svelte";
export interface DataTableSkeletonProps
extends DataTableHeader,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DataTableSkeletonProps extends DataTableHeader, RestProps {
/**
* Specify the number of columns
* Superseded by `headers` if `headers` is a non-empty array

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["section"]> {
type RestProps = SvelteHTMLElements["section"];
export interface TableProps extends RestProps {
/**
* Set the size of the table
* @default undefined
@ -44,6 +45,6 @@ export interface TableProps
export default class Table extends SvelteComponentTyped<
TableProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,13 +1,14 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableBodyProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["tbody"]> {
type RestProps = SvelteHTMLElements["tbody"];
export interface TableBodyProps extends RestProps {
[key: `data-${string}`]: any;
}
export default class TableBody extends SvelteComponentTyped<
TableBodyProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableCellProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["td"]> {
type RestProps = SvelteHTMLElements["td"];
export interface TableCellProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableContainerProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface TableContainerProps extends RestProps {
/**
* Specify the title of the data table
* @default ""
@ -32,6 +33,6 @@ export interface TableContainerProps
export default class TableContainer extends SvelteComponentTyped<
TableContainerProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableHeadProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["thead"]> {
type RestProps = SvelteHTMLElements["thead"];
export interface TableHeadProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableHeaderProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["th"]> {
type RestProps = SvelteHTMLElements["th"];
export interface TableHeaderProps extends RestProps {
/**
* Set to `true` for the sortable variant
* @default false

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface TableRowProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["tr"]> {
type RestProps = SvelteHTMLElements["tr"];
export interface TableRowProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ToolbarProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["section"]> {
type RestProps = SvelteHTMLElements["section"];
export interface ToolbarProps extends RestProps {
/**
* Specify the toolbar size
* @default "default"
@ -14,6 +15,6 @@ export interface ToolbarProps
export default class Toolbar extends SvelteComponentTyped<
ToolbarProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ToolbarBatchActionsProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ToolbarBatchActionsProps extends RestProps {
/**
* Override the total items selected text
* @default (totalSelected) => `${totalSelected} item${totalSelected === 1 ? "" : "s"} selected`

View file

@ -1,10 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
export interface ToolbarContentProps {}
export default class ToolbarContent extends SvelteComponentTyped<
ToolbarContentProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { OverflowMenuProps } from "../OverflowMenu/OverflowMenu.svelte";
@ -6,6 +5,6 @@ export interface ToolbarMenuProps extends OverflowMenuProps {}
export default class ToolbarMenu extends SvelteComponentTyped<
ToolbarMenuProps,
{},
Record<string, any>,
{ default: {} }
> {}

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { OverflowMenuItemProps } from "../OverflowMenu/OverflowMenuItem.svelte";

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ToolbarSearchProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["input"]> {
type RestProps = SvelteHTMLElements["input"];
export interface ToolbarSearchProps extends RestProps {
/**
* Specify the value of the search input
* @default ""

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface DatePickerProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DatePickerProps extends RestProps {
/**
* Specify the date picker type
* @default "simple"

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface DatePickerInputProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["input"]> {
type RestProps = SvelteHTMLElements["input"];
export interface DatePickerInputProps extends RestProps {
/**
* Set the size of the input
* @default undefined

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface DatePickerSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DatePickerSkeletonProps extends RestProps {
/**
* Set to `true` to use the range variant
* @default false

View file

@ -1,5 +1,5 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type DropdownItemId = any;
@ -11,8 +11,9 @@ export interface DropdownItem {
disabled?: boolean;
}
export interface DropdownProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DropdownProps extends RestProps {
/**
* Set the dropdown items
* @default []

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface DropdownSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface DropdownSkeletonProps extends RestProps {
/**
* Set to `true` to use the inline variant
* @default false

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FileUploaderProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface FileUploaderProps extends RestProps {
/**
* Specify the file uploader status
* @default "uploading"

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FileUploaderButtonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["input"]> {
type RestProps = SvelteHTMLElements["input"];
export interface FileUploaderButtonProps extends RestProps {
/**
* Specify the accepted file types
* @default []

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FileUploaderDropContainerProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface FileUploaderDropContainerProps extends RestProps {
/**
* Specify the accepted file types
* @default []

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FileUploaderItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["span"]> {
type RestProps = SvelteHTMLElements["span"];
export interface FileUploaderItemProps extends RestProps {
/**
* Specify the file uploader status
* @default "uploading"

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FileUploaderSkeletonProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface FileUploaderSkeletonProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,10 +1,11 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FilenameProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]>,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["button"]>,
svelte.JSX.SVGAttributes<SVGSVGElement> {
type RestProps = SvelteHTMLElements["div"] &
SvelteHTMLElements["button"] &
SvelteHTMLElements["svg"];
export interface FilenameProps extends RestProps {
/**
* Specify the file name status
* @default "uploading"

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FluidFormProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["form"]> {
type RestProps = SvelteHTMLElements["form"];
export interface FluidFormProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FormProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["form"]> {
type RestProps = SvelteHTMLElements["form"];
export interface FormProps extends RestProps {
/**
* Obtain a reference to the form element
* @default null

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FormGroupProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["fieldset"]> {
type RestProps = SvelteHTMLElements["fieldset"];
export interface FormGroupProps extends RestProps {
/**
* Set to `true` for to remove the bottom margin
* @default false

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FormItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface FormItemProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface FormLabelProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["label"]> {
type RestProps = SvelteHTMLElements["label"];
export interface FormLabelProps extends RestProps {
/**
* Set an id to be used by the label element
* @default "ccs-" + Math.random().toString(36)

View file

@ -1,5 +1,5 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type ColumnSize = boolean | number;
@ -10,8 +10,9 @@ export interface ColumnSizeDescriptor {
export type ColumnBreakpoint = ColumnSize | ColumnSizeDescriptor;
export interface ColumnProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ColumnProps extends RestProps {
/**
* Set to `true` to render a custom HTML element
* Props are destructured as `props` in the default slot (e.g., <Column let:props><article {...props}>...</article></Column>)
@ -84,6 +85,6 @@ export interface ColumnProps
export default class Column extends SvelteComponentTyped<
ColumnProps,
{},
Record<string, any>,
{ default: { props: { class: string; [key: string]: any } } }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface GridProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface GridProps extends RestProps {
/**
* Set to `true` to render a custom HTML element
* Props are destructured as `props` in the default slot (e.g., <Grid let:props><header {...props}>...</header></Grid>)
@ -57,6 +58,6 @@ export interface GridProps
export default class Grid extends SvelteComponentTyped<
GridProps,
{},
Record<string, any>,
{ default: { props: { class: string; [key: string]: any } } }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface RowProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface RowProps extends RestProps {
/**
* Set to `true` to render a custom HTML element
* Props are destructured as `props` in the default slot (e.g., <Row let:props><section {...props}>...</section></Row>)
@ -51,6 +52,6 @@ export interface RowProps
export default class Row extends SvelteComponentTyped<
RowProps,
{},
Record<string, any>,
{ default: { props: { class: string; [key: string]: any } } }
> {}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ImageLoaderProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["img"]> {
type RestProps = SvelteHTMLElements["img"];
export interface ImageLoaderProps extends RestProps {
/**
* Specify the image source
* @default ""

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface InlineLoadingProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface InlineLoadingProps extends RestProps {
/**
* Set the loading status
* @default "active"

View file

@ -1,9 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface LinkProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["a"]>,
svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["p"]> {
type RestProps = SvelteHTMLElements["a"] & SvelteHTMLElements["p"];
export interface LinkProps extends RestProps {
/**
* Specify the size of the link
* @default undefined
@ -27,7 +27,7 @@ export interface LinkProps
* `inline` must be `false`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent;
icon?: typeof import("svelte").SvelteComponent<any>;
/**
* Set to `true` to disable the checkbox

View file

@ -1,4 +1,3 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { LinkProps } from "./Link.svelte";

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ListBoxProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxProps extends RestProps {
/**
* Set the size of the list box
* @default undefined

View file

@ -1,10 +1,11 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type ListBoxFieldTranslationId = "close" | "open";
export interface ListBoxFieldProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxFieldProps extends RestProps {
/**
* Set to `true` to disable the list box field
* @default false

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ListBoxMenuProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxMenuProps extends RestProps {
/**
* Set an id for the top-level element
* @default "ccs-" + Math.random().toString(36)

View file

@ -1,10 +1,11 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type ListBoxMenuIconTranslationId = "close" | "open";
export interface ListBoxMenuIconProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxMenuIconProps extends RestProps {
/**
* Set to `true` to open the list box menu icon
* @default false

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ListBoxMenuItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxMenuItemProps extends RestProps {
/**
* Set to `true` to enable the active state
* @default false

View file

@ -1,10 +1,11 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export type ListBoxSelectionTranslationId = "clearAll" | "clearSelection";
export interface ListBoxSelectionProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface ListBoxSelectionProps extends RestProps {
/**
* Specify the number of selected items
* @default undefined

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface ListItemProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["li"]> {
type RestProps = SvelteHTMLElements["li"];
export interface ListItemProps extends RestProps {
[key: `data-${string}`]: any;
}

View file

@ -1,8 +1,9 @@
/// <reference types="svelte" />
import type { SvelteComponentTyped } from "svelte";
import type { SvelteHTMLElements } from "svelte/elements";
export interface LoadingProps
extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
type RestProps = SvelteHTMLElements["div"];
export interface LoadingProps extends RestProps {
/**
* Set to `true` to use the small variant
* @default false
@ -38,6 +39,6 @@ export interface LoadingProps
export default class Loading extends SvelteComponentTyped<
LoadingProps,
{},
Record<string, any>,
{}
> {}

Some files were not shown because too many files have changed in this diff Show more