diff --git a/CHANGELOG.md b/CHANGELOG.md index 91920c42..bdb4eabe 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,12 @@ All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. +### [0.85.3](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.85.2...v0.85.3) (2024-10-25) + +### Bug Fixes + +- address Svelte 5 warnings ([#2011](https://github.com/carbon-design-system/carbon-components-svelte/issues/2011)) ([43fccac](https://github.com/carbon-design-system/carbon-components-svelte/commit/43fccac1c6273d9aa83b8c26a5f8cecec667db59)) + ### [0.85.2](https://github.com/carbon-design-system/carbon-components-svelte/compare/v0.85.1...v0.85.2) (2024-08-14) ### Bug Fixes diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index b1d68a5b..13444bc1 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -1,6 +1,6 @@ # Component Index -> 165 components exported from carbon-components-svelte@0.85.2. +> 165 components exported from carbon-components-svelte@0.85.3. ## Components @@ -697,12 +697,12 @@ export interface ComboBoxItem { | Event name | Type | Detail | | :--------- | :--------- | :---------------------------------------------------------------------- | | select | dispatched | { selectedId: ComboBoxItemId; selectedItem: ComboBoxItem } | +| clear | dispatched | KeyboardEvent | MouseEvent | | keydown | forwarded | -- | | keyup | forwarded | -- | | focus | forwarded | -- | | blur | forwarded | -- | | paste | forwarded | -- | -| clear | forwarded | -- | | scroll | forwarded | -- | ## `ComposedModal` @@ -933,7 +933,7 @@ export type DataTableValue = any; export interface DataTableEmptyHeader { key: DataTableKey; empty: boolean; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; @@ -943,7 +943,7 @@ export interface DataTableEmptyHeader { export interface DataTableNonEmptyHeader { key: DataTableKey; value: DataTableValue; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; @@ -962,7 +962,7 @@ export type DataTableRowId = any; export interface DataTableCell { key: DataTableKey; value: DataTableValue; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; } ``` @@ -4193,15 +4193,15 @@ export type CarbonTheme = "white" | "g10" | "g80" | "g90" | "g100"; ### Props -| Prop name | Required | Kind | Reactive | Type | Default value | Description | -| :--------- | :------- | :--------------- | :------- | -------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------ | -| theme | No | let | Yes | CarbonTheme | "white" | Set the current Carbon theme | -| tokens | No | let | No | { [token: string]: any; } | {} | Customize a theme with your own tokens
@see https://carbondesignsystem.com/guidelines/themes/overview#customizing-a-theme | -| persist | No | let | No | boolean | false | Set to `true` to persist the theme using window.localStorage | -| persistKey | No | let | No | string | "theme" | Specify the local storage key | -| render | No | let | No | "toggle" | "select" | undefined | Render a toggle or select dropdown to control the theme | -| toggle | No | let | No | import("../Toggle/Toggle").ToggleProps & { themes?: [labelA: CarbonTheme, labelB: CarbonTheme]; } | { themes: ["white", "g100"], labelA: "", labelB: "", labelText: "Dark mode", hideLabel: false, } | Override the default toggle props | -| select | No | let | No | import("../Select/Select").SelectProps & { themes?: CarbonTheme[]; } | { themes: themeKeys, labelText: "Themes", hideLabel: false, } | Override the default select props | +| Prop name | Required | Kind | Reactive | Type | Default value | Description | +| :--------- | :------- | :--------------- | :------- | --------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------ | +| theme | No | let | Yes | CarbonTheme | "white" | Set the current Carbon theme | +| tokens | No | let | No | { [token: string]: any; } | {} | Customize a theme with your own tokens
@see https://carbondesignsystem.com/guidelines/themes/overview#customizing-a-theme | +| persist | No | let | No | boolean | false | Set to `true` to persist the theme using window.localStorage | +| persistKey | No | let | No | string | "theme" | Specify the local storage key | +| render | No | let | No | "toggle" | "select" | undefined | Render a toggle or select dropdown to control the theme | +| toggle | No | let | No | import("../Toggle/Toggle.svelte").ToggleProps & { themes?: [labelA: CarbonTheme, labelB: CarbonTheme]; } | { themes: ["white", "g100"], labelA: "", labelB: "", labelText: "Dark mode", hideLabel: false, } | Override the default toggle props | +| select | No | let | No | import("../Select/Select.svelte").SelectProps & { themes?: CarbonTheme[]; } | { themes: themeKeys, labelText: "Themes", hideLabel: false, } | Override the default select props | ### Slots @@ -4548,16 +4548,16 @@ None. ### Events -| Event name | Type | Detail | -| :--------- | :-------- | :----- | -| clear | forwarded | -- | -| change | forwarded | -- | -| input | forwarded | -- | -| focus | forwarded | -- | -| blur | forwarded | -- | -| keyup | forwarded | -- | -| keydown | forwarded | -- | -| paste | forwarded | -- | +| Event name | Type | Detail | +| :--------- | :--------- | :---------------- | +| clear | dispatched | null | +| change | forwarded | -- | +| input | forwarded | -- | +| focus | forwarded | -- | +| blur | forwarded | -- | +| keyup | forwarded | -- | +| keydown | forwarded | -- | +| paste | forwarded | -- | ## `Tooltip` diff --git a/README.md b/README.md index 391ef37f..c6c6f550 100644 --- a/README.md +++ b/README.md @@ -13,7 +13,7 @@ Design systems facilitate design and development through reuse, consistency, and The Carbon Svelte portfolio also includes: -- **[Carbon Icons Svelte](https://github.com/carbon-design-system/carbon-icons-svelte)**: 2,300+ Carbon icons as Svelte components +- **[Carbon Icons Svelte](https://github.com/carbon-design-system/carbon-icons-svelte)**: 2,400+ Carbon icons as Svelte components - **[Carbon Pictograms Svelte](https://github.com/carbon-design-system/carbon-pictograms-svelte)**: 1,100+ Carbon pictograms as Svelte components - **[Carbon Charts Svelte](https://github.com/carbon-design-system/carbon-charts/tree/master/packages/svelte)**: 20+ charts, powered by d3 - **[Carbon Preprocess Svelte](https://github.com/carbon-design-system/carbon-preprocess-svelte)**: Collection of Svelte preprocessors for Carbon @@ -28,17 +28,18 @@ Other forms of documentation are auto-generated: ## Installation -Install `carbon-components-svelte` as a development dependency. - ```sh -# Yarn -yarn add -D carbon-components-svelte - # npm -npm i -D carbon-components-svelte +npm i carbon-components-svelte # pnpm -pnpm i -D carbon-components-svelte +pnpm i carbon-components-svelte + +# Yarn +yarn add carbon-components-svelte + +# Bun +bun add carbon-components-svelte ``` ## Usage @@ -146,17 +147,20 @@ Import components from `carbon-components-svelte` in the `script` tag of your Sv [carbon-preprocess-svelte](https://github.com/carbon-design-system/carbon-preprocess-svelte) is a collection of Svelte preprocessors for Carbon. > [!NOTE] -> Using `carbon-preprocess-svelte` is optional and not a prerequisite for this library. +> Using `carbon-preprocess-svelte` is optional and not a prerequisite for this library. It should be installed as a development dependency. ```sh -# Yarn -yarn add -D carbon-preprocess-svelte - # npm npm i -D carbon-preprocess-svelte # pnpm pnpm i -D carbon-preprocess-svelte + +# Yarn +yarn add -D carbon-preprocess-svelte + +# Bun +bun add -D carbon-preprocess-svelte ``` ### `optimizeImports` diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index 5b54ad0a..f755b08f 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -1780,12 +1780,16 @@ "name": "select", "detail": "{ selectedId: ComboBoxItemId; selectedItem: ComboBoxItem }" }, + { + "type": "dispatched", + "name": "clear", + "detail": "KeyboardEvent | MouseEvent" + }, { "type": "forwarded", "name": "keydown", "element": "input" }, { "type": "forwarded", "name": "keyup", "element": "input" }, { "type": "forwarded", "name": "focus", "element": "input" }, { "type": "forwarded", "name": "blur", "element": "input" }, { "type": "forwarded", "name": "paste", "element": "input" }, - { "type": "forwarded", "name": "clear", "element": "ListBoxSelection" }, { "type": "forwarded", "name": "scroll", "element": "ListBoxMenu" } ], "typedefs": [ @@ -2730,14 +2734,14 @@ "ts": "type DataTableValue = any" }, { - "type": "{ key: DataTableKey; empty: boolean; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }", + "type": "{ key: DataTableKey; empty: boolean; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }", "name": "DataTableEmptyHeader", - "ts": "interface DataTableEmptyHeader { key: DataTableKey; empty: boolean; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }" + "ts": "interface DataTableEmptyHeader { key: DataTableKey; empty: boolean; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }" }, { - "type": "{ key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }", + "type": "{ key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }", "name": "DataTableNonEmptyHeader", - "ts": "interface DataTableNonEmptyHeader { key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }" + "ts": "interface DataTableNonEmptyHeader { key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }" }, { "type": "DataTableNonEmptyHeader | DataTableEmptyHeader", @@ -2755,9 +2759,9 @@ "ts": "type DataTableRowId = any" }, { - "type": "{ key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; }", + "type": "{ key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; }", "name": "DataTableCell", - "ts": "interface DataTableCell { key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; }" + "ts": "interface DataTableCell { key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; }" } ], "generics": null, @@ -13198,7 +13202,7 @@ "name": "toggle", "kind": "let", "description": "Override the default toggle props", - "type": "import(\"../Toggle/Toggle\").ToggleProps & { themes?: [labelA: CarbonTheme, labelB: CarbonTheme]; }", + "type": "import(\"../Toggle/Toggle.svelte\").ToggleProps & { themes?: [labelA: CarbonTheme, labelB: CarbonTheme]; }", "value": "{ themes: [\"white\", \"g100\"], labelA: \"\", labelB: \"\", labelText: \"Dark mode\", hideLabel: false, }", "isFunction": false, "isFunctionDeclaration": false, @@ -13210,7 +13214,7 @@ "name": "select", "kind": "let", "description": "Override the default select props", - "type": "import(\"../Select/Select\").SelectProps & { themes?: CarbonTheme[]; }", + "type": "import(\"../Select/Select.svelte\").SelectProps & { themes?: CarbonTheme[]; }", "value": "{ themes: themeKeys, labelText: \"Themes\", hideLabel: false, }", "isFunction": false, "isFunctionDeclaration": false, @@ -14253,7 +14257,7 @@ "moduleExports": [], "slots": [], "events": [ - { "type": "forwarded", "name": "clear", "element": "Search" }, + { "type": "dispatched", "name": "clear", "detail": "null" }, { "type": "forwarded", "name": "change", "element": "Search" }, { "type": "forwarded", "name": "input", "element": "Search" }, { "type": "forwarded", "name": "focus", "element": "Search" }, diff --git a/docs/src/pages/components/CodeSnippet.svx b/docs/src/pages/components/CodeSnippet.svx index b5d78490..f29d59b1 100644 --- a/docs/src/pages/components/CodeSnippet.svx +++ b/docs/src/pages/components/CodeSnippet.svx @@ -36,7 +36,7 @@ You can override the default copy functionality with your own implementation. Se ## Default (single-line) - + ## Overriding copy functionality @@ -50,7 +50,7 @@ In this example, we use the open source module [clipboard-copy](https://github.c To prevent text from being copied entirely, pass a no-op function to the `copy` prop. - {}} /> + {}} /> ## Inline @@ -104,7 +104,7 @@ Use the `showMoreText` and `showLessText` props to override the default "Show mo The `disabled` prop applies only to the `"single"` and `"multi"` code snippet types. - +
diff --git a/docs/src/pages/framed/CodeSnippet/CodeSnippetOverride.svelte b/docs/src/pages/framed/CodeSnippet/CodeSnippetOverride.svelte index 9314a6b5..64ccab08 100644 --- a/docs/src/pages/framed/CodeSnippet/CodeSnippetOverride.svelte +++ b/docs/src/pages/framed/CodeSnippet/CodeSnippetOverride.svelte @@ -4,6 +4,6 @@ diff --git a/docs/src/pages/index.svelte b/docs/src/pages/index.svelte index 5d372c4c..7c036b81 100644 --- a/docs/src/pages/index.svelte +++ b/docs/src/pages/index.svelte @@ -21,9 +21,10 @@ metatags.description = "The Svelte implementation of the Carbon Design System featuring UI components, icons, pictograms, and charts."; - const installYarn = "yarn add -D carbon-components-svelte"; - const installNpm = "npm i -D carbon-components-svelte"; - const installPnpm = "pnpm i -D carbon-components-svelte"; + const installNpm = "npm i carbon-components-svelte"; + const installPnpm = "pnpm i carbon-components-svelte"; + const installYarn = "yarn add carbon-components-svelte"; + const installBun = "bun add carbon-components-svelte"; const themes = { white: "White", g10: "Gray 10", @@ -84,20 +85,24 @@ - - + + +
- - - + + + + + +
@@ -124,7 +129,7 @@ - + @@ -230,7 +235,7 @@ diff --git a/package-lock.json b/package-lock.json index beaffacb..9db32e66 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "carbon-components-svelte", - "version": "0.85.2", + "version": "0.85.3", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "carbon-components-svelte", - "version": "0.85.2", + "version": "0.85.3", "hasInstallScript": true, "license": "Apache-2.0", "dependencies": { @@ -27,10 +27,10 @@ "rollup-plugin-terser": "^7.0.2", "sass": "^1.49.11", "standard-version": "^9.5.0", - "sveld": "^0.20.2", + "sveld": "^0.20.3", "svelte": "^4.2.10", "svelte-check": "^3.6.4", - "typescript": "^4.7.4" + "typescript": "^5.6.3" } }, "node_modules/@ampproject/remapping": { @@ -3075,9 +3075,9 @@ } }, "node_modules/sveld": { - "version": "0.20.2", - "resolved": "https://registry.npmjs.org/sveld/-/sveld-0.20.2.tgz", - "integrity": "sha512-pd/RZ4TR7oaX6XphE8uhwAjKIVw1lg19aysYM5lYpD97AthlAJD8kSEgtEXHXw6xFYXsfnhrj0XxGHnbKFsnlA==", + "version": "0.20.3", + "resolved": "https://registry.npmjs.org/sveld/-/sveld-0.20.3.tgz", + "integrity": "sha512-8BFxsG65J/25/+ShuljW4xv2Ax5VtZYnDUyiYt83YS+VS3qGDifppzAsX10IVUuhJpJyEfwOUBGWPeoPdsfdew==", "dev": true, "dependencies": { "@rollup/plugin-node-resolve": "^13.3.0", @@ -3150,19 +3150,6 @@ } } }, - "node_modules/sveld/node_modules/typescript": { - "version": "5.5.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz", - "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==", - "dev": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=14.17" - } - }, "node_modules/svelte": { "version": "4.2.19", "resolved": "https://registry.npmjs.org/svelte/-/svelte-4.2.19.tgz", @@ -3208,19 +3195,6 @@ "svelte": "^3.55.0 || ^4.0.0-next.0 || ^4.0.0 || ^5.0.0-next.0" } }, - "node_modules/svelte-check/node_modules/typescript": { - "version": "5.5.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.5.4.tgz", - "integrity": "sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==", - "dev": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=14.17" - } - }, "node_modules/svelte-preprocess": { "version": "5.1.4", "resolved": "https://registry.npmjs.org/svelte-preprocess/-/svelte-preprocess-5.1.4.tgz", @@ -3446,16 +3420,16 @@ "dev": true }, "node_modules/typescript": { - "version": "4.9.5", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.9.5.tgz", - "integrity": "sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==", + "version": "5.6.3", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.3.tgz", + "integrity": "sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==", "dev": true, "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" }, "engines": { - "node": ">=4.2.0" + "node": ">=14.17" } }, "node_modules/uglify-js": { diff --git a/package.json b/package.json index 745ed7ca..e92ac436 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "carbon-components-svelte", - "version": "0.85.2", + "version": "0.85.3", "license": "Apache-2.0", "description": "Svelte implementation of the Carbon Design System", "svelte": "./src/index.js", @@ -57,10 +57,10 @@ "rollup-plugin-terser": "^7.0.2", "sass": "^1.49.11", "standard-version": "^9.5.0", - "sveld": "^0.20.2", + "sveld": "^0.20.3", "svelte": "^4.2.10", "svelte-check": "^3.6.4", - "typescript": "^4.7.4" + "typescript": "^5.6.3" }, "standard-version": { "skip": { diff --git a/src/Breakpoint/Breakpoint.svelte b/src/Breakpoint/Breakpoint.svelte index c040e903..b9d89dcd 100644 --- a/src/Breakpoint/Breakpoint.svelte +++ b/src/Breakpoint/Breakpoint.svelte @@ -40,6 +40,7 @@ max: size == "max", }; $: if (size != undefined) + // svelte-ignore reactive_declaration_non_reactive_property dispatch("change", { size, breakpointValue: breakpoints[size] }); diff --git a/src/ComboBox/ComboBox.svelte b/src/ComboBox/ComboBox.svelte index 0aee1350..437a5834 100644 --- a/src/ComboBox/ComboBox.svelte +++ b/src/ComboBox/ComboBox.svelte @@ -3,6 +3,7 @@ * @typedef {any} ComboBoxItemId * @typedef {{ id: ComboBoxItemId; text: string; disabled?: boolean; }} ComboBoxItem * @event {{ selectedId: ComboBoxItemId; selectedItem: ComboBoxItem }} select + * @event {KeyboardEvent | MouseEvent} clear * @slot {{ item: ComboBoxItem; index: number }} */ diff --git a/src/DataTable/DataTable.svelte b/src/DataTable/DataTable.svelte index fe982ca8..419d861b 100644 --- a/src/DataTable/DataTable.svelte +++ b/src/DataTable/DataTable.svelte @@ -2,12 +2,12 @@ /** * @typedef {string} DataTableKey * @typedef {any} DataTableValue - * @typedef {{ key: DataTableKey; empty: boolean; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }} DataTableEmptyHeader - * @typedef {{ key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }} DataTableNonEmptyHeader + * @typedef {{ key: DataTableKey; empty: boolean; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }} DataTableEmptyHeader + * @typedef {{ key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; minWidth?: string; }} DataTableNonEmptyHeader * @typedef {DataTableNonEmptyHeader | DataTableEmptyHeader} DataTableHeader * @typedef {{ id: any; [key: string]: DataTableValue; }} DataTableRow * @typedef {any} DataTableRowId - * @typedef {{ key: DataTableKey; value: DataTableValue; display?: (item: Value, row: DataTableRow) => DataTableValue; }} DataTableCell + * @typedef {{ key: DataTableKey; value: DataTableValue; display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; }} DataTableCell * @slot {{ row: DataTableRow; }} expanded-row * @slot {{ header: DataTableNonEmptyHeader; }} cell-header * @slot {{ row: DataTableRow; cell: DataTableCell; rowIndex: number; cellIndex: number; }} cell diff --git a/src/DataTable/ToolbarSearch.svelte b/src/DataTable/ToolbarSearch.svelte index 94a88969..f1e7982d 100644 --- a/src/DataTable/ToolbarSearch.svelte +++ b/src/DataTable/ToolbarSearch.svelte @@ -1,5 +1,8 @@ diff --git a/tsconfig.json b/tsconfig.json index b5c405e8..057f104a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -4,7 +4,7 @@ "esModuleInterop": true, "forceConsistentCasingInFileNames": true, "ignoreDeprecations": "5.0", - "importsNotUsedAsValues": "error", + "verbatimModuleSyntax": true, "isolatedModules": true, "target": "ESNext", "module": "ESNext", diff --git a/types/ComboBox/ComboBox.svelte.d.ts b/types/ComboBox/ComboBox.svelte.d.ts index c147e3ff..c28555d1 100644 --- a/types/ComboBox/ComboBox.svelte.d.ts +++ b/types/ComboBox/ComboBox.svelte.d.ts @@ -164,12 +164,12 @@ export default class ComboBox extends SvelteComponentTyped< selectedId: ComboBoxItemId; selectedItem: ComboBoxItem; }>; + clear: CustomEvent; keydown: WindowEventMap["keydown"]; keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; - clear: WindowEventMap["clear"]; + paste: WindowEventMap["paste"]; scroll: WindowEventMap["scroll"]; }, { default: { item: ComboBoxItem; index: number }; titleText: {} } diff --git a/types/DataTable/DataTable.svelte.d.ts b/types/DataTable/DataTable.svelte.d.ts index 0f072f9c..7e26a826 100644 --- a/types/DataTable/DataTable.svelte.d.ts +++ b/types/DataTable/DataTable.svelte.d.ts @@ -8,7 +8,7 @@ export type DataTableValue = any; export interface DataTableEmptyHeader { key: DataTableKey; empty: boolean; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; @@ -18,7 +18,7 @@ export interface DataTableEmptyHeader { export interface DataTableNonEmptyHeader { key: DataTableKey; value: DataTableValue; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; sort?: false | ((a: DataTableValue, b: DataTableValue) => number); columnMenu?: boolean; width?: string; @@ -37,7 +37,7 @@ export type DataTableRowId = any; export interface DataTableCell { key: DataTableKey; value: DataTableValue; - display?: (item: Value, row: DataTableRow) => DataTableValue; + display?: (item: DataTableValue, row: DataTableRow) => DataTableValue; } type RestProps = SvelteHTMLElements["div"]; diff --git a/types/DataTable/ToolbarSearch.svelte.d.ts b/types/DataTable/ToolbarSearch.svelte.d.ts index 07d69f44..5f1fc4ce 100644 --- a/types/DataTable/ToolbarSearch.svelte.d.ts +++ b/types/DataTable/ToolbarSearch.svelte.d.ts @@ -69,14 +69,14 @@ export interface ToolbarSearchProps extends RestProps { export default class ToolbarSearch extends SvelteComponentTyped< ToolbarSearchProps, { - clear: WindowEventMap["clear"]; + clear: CustomEvent; change: WindowEventMap["change"]; input: WindowEventMap["input"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; keyup: WindowEventMap["keyup"]; keydown: WindowEventMap["keydown"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, {} > {} diff --git a/types/DatePicker/DatePickerInput.svelte.d.ts b/types/DatePicker/DatePickerInput.svelte.d.ts index 5f962cda..29f15071 100644 --- a/types/DatePicker/DatePickerInput.svelte.d.ts +++ b/types/DatePicker/DatePickerInput.svelte.d.ts @@ -110,7 +110,7 @@ export default class DatePickerInput extends SvelteComponentTyped< keydown: WindowEventMap["keydown"]; keyup: WindowEventMap["keyup"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { labelText: {} } > {} diff --git a/types/MultiSelect/MultiSelect.svelte.d.ts b/types/MultiSelect/MultiSelect.svelte.d.ts index ed2bdde9..e3d217be 100644 --- a/types/MultiSelect/MultiSelect.svelte.d.ts +++ b/types/MultiSelect/MultiSelect.svelte.d.ts @@ -255,7 +255,7 @@ export default class MultiSelect extends SvelteComponentTyped< keydown: WindowEventMap["keydown"]; keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { default: { item: MultiSelectItem; index: number }; titleText: {} } > {} diff --git a/types/NumberInput/NumberInput.svelte.d.ts b/types/NumberInput/NumberInput.svelte.d.ts index 4d3200a1..1334bdd5 100644 --- a/types/NumberInput/NumberInput.svelte.d.ts +++ b/types/NumberInput/NumberInput.svelte.d.ts @@ -155,7 +155,7 @@ export default class NumberInput extends SvelteComponentTyped< keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { label: {} } > { diff --git a/types/Search/Search.svelte.d.ts b/types/Search/Search.svelte.d.ts index d0a0a235..3acd317b 100644 --- a/types/Search/Search.svelte.d.ts +++ b/types/Search/Search.svelte.d.ts @@ -119,7 +119,7 @@ export default class Search extends SvelteComponentTyped< blur: WindowEventMap["blur"]; keydown: WindowEventMap["keydown"]; keyup: WindowEventMap["keyup"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; clear: CustomEvent; }, { labelText: {} } diff --git a/types/TextArea/TextArea.svelte.d.ts b/types/TextArea/TextArea.svelte.d.ts index 35432cca..c213bc33 100644 --- a/types/TextArea/TextArea.svelte.d.ts +++ b/types/TextArea/TextArea.svelte.d.ts @@ -116,7 +116,7 @@ export default class TextArea extends SvelteComponentTyped< keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { labelText: {} } > {} diff --git a/types/TextInput/PasswordInput.svelte.d.ts b/types/TextInput/PasswordInput.svelte.d.ts index 04ea10b3..76ccb5a4 100644 --- a/types/TextInput/PasswordInput.svelte.d.ts +++ b/types/TextInput/PasswordInput.svelte.d.ts @@ -146,7 +146,7 @@ export default class PasswordInput extends SvelteComponentTyped< keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { labelText: {} } > {} diff --git a/types/TextInput/TextInput.svelte.d.ts b/types/TextInput/TextInput.svelte.d.ts index adf50d70..f46d3302 100644 --- a/types/TextInput/TextInput.svelte.d.ts +++ b/types/TextInput/TextInput.svelte.d.ts @@ -131,7 +131,7 @@ export default class TextInput extends SvelteComponentTyped< keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { labelText: {} } > {} diff --git a/types/Theme/Theme.svelte.d.ts b/types/Theme/Theme.svelte.d.ts index 3508711d..9a9e034d 100644 --- a/types/Theme/Theme.svelte.d.ts +++ b/types/Theme/Theme.svelte.d.ts @@ -38,7 +38,7 @@ export interface ThemeProps { * Override the default toggle props * @default { themes: ["white", "g100"], labelA: "", labelB: "", labelText: "Dark mode", hideLabel: false, } */ - toggle?: import("../Toggle/Toggle").ToggleProps & { + toggle?: import("../Toggle/Toggle.svelte").ToggleProps & { themes?: [labelA: CarbonTheme, labelB: CarbonTheme]; }; @@ -46,7 +46,9 @@ export interface ThemeProps { * Override the default select props * @default { themes: themeKeys, labelText: "Themes", hideLabel: false, } */ - select?: import("../Select/Select").SelectProps & { themes?: CarbonTheme[] }; + select?: import("../Select/Select.svelte").SelectProps & { + themes?: CarbonTheme[]; + }; } export default class Theme extends SvelteComponentTyped< diff --git a/types/TimePicker/TimePicker.svelte.d.ts b/types/TimePicker/TimePicker.svelte.d.ts index 25f11194..4bfd8d78 100644 --- a/types/TimePicker/TimePicker.svelte.d.ts +++ b/types/TimePicker/TimePicker.svelte.d.ts @@ -104,7 +104,7 @@ export default class TimePicker extends SvelteComponentTyped< keyup: WindowEventMap["keyup"]; focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { default: {}; labelText: {} } > {} diff --git a/types/UIShell/HeaderSearch.svelte.d.ts b/types/UIShell/HeaderSearch.svelte.d.ts index 272b81ed..c9d9a153 100644 --- a/types/UIShell/HeaderSearch.svelte.d.ts +++ b/types/UIShell/HeaderSearch.svelte.d.ts @@ -59,7 +59,7 @@ export default class HeaderSearch extends SvelteComponentTyped< focus: WindowEventMap["focus"]; blur: WindowEventMap["blur"]; keydown: WindowEventMap["keydown"]; - paste: DocumentAndElementEventHandlersEventMap["paste"]; + paste: WindowEventMap["paste"]; }, { default: { result: HeaderSearchResult; index: number } } > {} diff --git a/types/icons/Search.svelte.d.ts b/types/icons/Search.svelte.d.ts deleted file mode 100644 index 7668bdaa..00000000 --- a/types/icons/Search.svelte.d.ts +++ /dev/null @@ -1,17 +0,0 @@ -/// -import { SvelteComponentTyped } from "svelte"; - -export interface SearchProps - extends svelte.JSX.HTMLAttributes { - /** - * @default 16 - */ - size?: number; - - /** - * @default undefined - */ - title?: undefined; -} - -export default class Search extends SvelteComponentTyped {}