fix(types): loosen icon prop type to any (#2095)

Fixes https://github.com/carbon-design-system/carbon-icons-svelte/issues/207

`carbon-icons-svelte@13` and `carbon-pictograms-svelte@13` now  
only support TypeScript for Svelte 4/5.

The new `Component` type is incompatible with the `icon` prop in  
`carbon-components-svelte`, causing a type error with Svelte 5, as  
`typeof SvelteComponent` doesn't match the new `Component` type.

Since `Component` isn't available in Svelte 3/4, this PR changes  
the `icon` prop type to `any` for compatibility across Svelte 3, 4, and 5.
This commit is contained in:
Eric Liu 2025-02-02 19:49:53 -08:00 committed by GitHub
commit 6bf72d4602
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
44 changed files with 273 additions and 251 deletions

View file

@ -44,7 +44,7 @@ type $Props = {
* Alternatively, use the named slot "icon" (e.g., `<Icon slot="icon" size="{20}" />`)
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the ARIA label for the button icon

View file

@ -14,7 +14,7 @@ type $Props = {
* Specify the primary button icon
* @default undefined
*/
primaryButtonIcon?: typeof import("svelte").SvelteComponent<any>;
primaryButtonIcon?: any;
/**
* Set to `true` to disable the primary button

View file

@ -27,7 +27,7 @@ type $Props = {
* Icon is rendered to the left of the label text
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the label text.

View file

@ -27,7 +27,7 @@ type $Props = {
* `inline` must be `false`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Set to `true` to disable the checkbox

View file

@ -86,7 +86,7 @@ type $Props = {
* Specify the primary button icon
* @default undefined
*/
primaryButtonIcon?: typeof import("svelte").SvelteComponent<any>;
primaryButtonIcon?: any;
/**
* Set to `true` for the "submit" and "click:button--primary" events

View file

@ -14,7 +14,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the title of the icon

View file

@ -45,7 +45,7 @@ type $Props = {
* Defaults to `<OverflowMenuVertical />`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the icon class

View file

@ -87,7 +87,7 @@ type $Props = {
* Defaults to `<Search />`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Set an id for the input element

View file

@ -61,7 +61,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Set an id for the filterable tag

View file

@ -33,7 +33,7 @@ type $Props = {
* Default to `<Information />`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the ARIA label for the tooltip button

View file

@ -15,7 +15,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Set to `true` to disable the tooltip icon

View file

@ -6,7 +6,7 @@ export type TreeNodeId = string | number;
export interface TreeNode {
id: TreeNodeId;
text: any;
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
disabled?: boolean;
nodes?: TreeNode[];
}

View file

@ -72,14 +72,14 @@ type $Props = {
* Defaults to `<Menu size={20} />`
* @default undefined
*/
iconMenu?: typeof import("svelte").SvelteComponent<any>;
iconMenu?: any;
/**
* Specify the icon to render for the opened state.
* Defaults to `<Close size={20} />`
* @default undefined
*/
iconClose?: typeof import("svelte").SvelteComponent<any>;
iconClose?: any;
[key: `data-${string}`]: any;
};

View file

@ -15,14 +15,14 @@ type $Props = {
* Defaults to `<Switcher size={20} />`
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Specify the icon to render when the action panel is open.
* Defaults to `<Close size={20} />`
* @default undefined
*/
closeIcon?: typeof import("svelte").SvelteComponent<any>;
closeIcon?: any;
/**
* Specify the text.

View file

@ -20,7 +20,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Obtain a reference to the HTML anchor element

View file

@ -12,7 +12,7 @@ export type HeaderGlobalActionProps = ButtonProps & {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Obtain a reference to the HTML button element

View file

@ -26,7 +26,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Obtain a reference to the HTML anchor element

View file

@ -20,7 +20,7 @@ type $Props = {
* Specify the icon to render
* @default undefined
*/
icon?: typeof import("svelte").SvelteComponent<any>;
icon?: any;
/**
* Obtain a reference to the HTML button element