From 0279546e02f5735fd6d47428a3d93a8384254c3a Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Wed, 31 Jan 2024 12:27:04 +0100 Subject: [PATCH] fix: adjust broken types The generated types were invalid TypeScript ("cannot use unique symbol at this position"). Use utility types to ensure the types are not unpacked during type generation. Leftover from #9988 --- packages/svelte/src/internal/client/render.js | 4 +- packages/svelte/src/legacy/legacy-client.js | 2 +- packages/svelte/src/legacy/legacy-server.js | 2 +- packages/svelte/src/main/public.d.ts | 2 +- packages/svelte/types/index.d.ts | 64 ++++++++++--------- 5 files changed, 38 insertions(+), 36 deletions(-) diff --git a/packages/svelte/src/internal/client/render.js b/packages/svelte/src/internal/client/render.js index 96ad9d8e40..3080a1b8bd 100644 --- a/packages/svelte/src/internal/client/render.js +++ b/packages/svelte/src/internal/client/render.js @@ -2759,7 +2759,7 @@ export function spread_props(...props) { * @template {Record} Props * @template {Record | undefined} Exports * @template {Record} Events - * @param {typeof import('../../main/public.js').SvelteComponent} component + * @param {import('../../main/public.js').ComponentType>} component * @param {{ * target: Node; * props?: Props; @@ -2809,7 +2809,7 @@ export function createRoot(component, options) { * @template {Record} Props * @template {Record | undefined} Exports * @template {Record} Events - * @param {typeof import('../../main/public.js').SvelteComponent} component + * @param {import('../../main/public.js').ComponentType>} component * @param {{ * target: Node; * props?: Props; diff --git a/packages/svelte/src/legacy/legacy-client.js b/packages/svelte/src/legacy/legacy-client.js index 9ad99401d8..d4887422f9 100644 --- a/packages/svelte/src/legacy/legacy-client.js +++ b/packages/svelte/src/legacy/legacy-client.js @@ -34,7 +34,7 @@ export function createClassComponent(options) { * @template {Record} Slots * * @param {import('../main/public.js').SvelteComponent} component - * @returns {typeof import('../main/public.js').SvelteComponent & Exports} + * @returns {import('../main/public.js').ComponentType & Exports>} */ export function asClassComponent(component) { // @ts-expect-error $$prop_def etc are not actually defined diff --git a/packages/svelte/src/legacy/legacy-server.js b/packages/svelte/src/legacy/legacy-server.js index aeba694ea6..0f9f96af8e 100644 --- a/packages/svelte/src/legacy/legacy-server.js +++ b/packages/svelte/src/legacy/legacy-server.js @@ -30,7 +30,7 @@ export function asClassComponent(component) { html: result.html }; }; - // this is present for SSR + // @ts-expect-error this is present for SSR component_constructor.render = _render; // @ts-ignore diff --git a/packages/svelte/src/main/public.d.ts b/packages/svelte/src/main/public.d.ts index 10e8e11a9d..aaf771e460 100644 --- a/packages/svelte/src/main/public.d.ts +++ b/packages/svelte/src/main/public.d.ts @@ -23,7 +23,7 @@ type PropsWithChildren = Props & (Props extends { children?: any } ? {} : Slots extends { default: any } - ? { children?: Snippet<[]> } + ? { children?: Snippet } : {}); /** diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts index 06cc791184..5593b03984 100644 --- a/packages/svelte/types/index.d.ts +++ b/packages/svelte/types/index.d.ts @@ -24,7 +24,7 @@ declare module 'svelte' { (Props extends { children?: any } ? {} : Slots extends { default: any } - ? { children?: Snippet<[]> } + ? { children?: Snippet } : {}); /** @@ -321,15 +321,7 @@ declare module 'svelte' { * If you don't need to interact with the component after mounting, use `mount` instead to save some bytes. * * */ - export function createRoot, Exports extends Record | undefined, Events extends Record>(component: { - new (options: ComponentConstructorOptions unique symbol & { - _: "functions passed to {@render ...} tags must use the `Snippet` type imported from \"svelte\""; - }) | undefined; - })>): SvelteComponent; - }, options: { + export function createRoot, Exports extends Record | undefined, Events extends Record>(component: ComponentType>, options: { target: Node; props?: Props | undefined; events?: Events | undefined; @@ -346,15 +338,7 @@ declare module 'svelte' { * If you need to interact with the component after mounting, use `createRoot` instead. * * */ - export function mount, Exports extends Record | undefined, Events extends Record>(component: { - new (options: ComponentConstructorOptions unique symbol & { - _: "functions passed to {@render ...} tags must use the `Snippet` type imported from \"svelte\""; - }) | undefined; - })>): SvelteComponent; - }, options: { + export function mount, Exports extends Record | undefined, Events extends Record>(component: ComponentType>, options: { target: Node; props?: Props | undefined; events?: Events | undefined; @@ -1734,17 +1718,7 @@ declare module 'svelte/legacy' { * @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5. * * */ - export function asClassComponent, Exports extends Record, Events extends Record, Slots extends Record>(component: SvelteComponent): { - new (options: ComponentConstructorOptions unique symbol & { - _: "functions passed to {@render ...} tags must use the `Snippet` type imported from \"svelte\""; - }) | undefined; - } : {})>): SvelteComponent; - } & Exports; + export function asClassComponent, Exports extends Record, Events extends Record, Slots extends Record>(component: SvelteComponent): ComponentType & Exports>; // This should contain all the public interfaces (not all of them are actually importable, check current Svelte for which ones are). /** @@ -1770,7 +1744,7 @@ declare module 'svelte/legacy' { (Props extends { children?: any } ? {} : Slots extends { default: any } - ? { children?: Snippet<[]> } + ? { children?: Snippet } : {}); /** @@ -1859,6 +1833,34 @@ declare module 'svelte/legacy' { $set(props: Partial): void; } + /** + * Convenience type to get the type of a Svelte component. Useful for example in combination with + * dynamic components using ``. + * + * Example: + * ```html + * + * + * + * + * ``` + */ + type ComponentType = (new ( + options: ComponentConstructorOptions< + Comp extends SvelteComponent ? Props : Record + > + ) => Comp) & { + /** The custom element version of the component. Only present if compiled with the `customElement` compiler option */ + element?: typeof HTMLElement; + }; + const SnippetReturn: unique symbol; /**