@ -1728,184 +1728,19 @@ declare module 'svelte/legacy' {
* @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5 .
*
* * /
export function createClassComponent < Props extends Record < string , any > , Exports extends Record < string , any > , Events extends Record < string , any > , Slots extends Record < string , any > > ( options : ComponentConstructorOptions< Props > & {
component : SvelteComponent< Props, Events , Slots >;
export function createClassComponent < Props extends Record < string , any > , Exports extends Record < string , any > , Events extends Record < string , any > , Slots extends Record < string , any > > ( options : import( "svelte" ) . ComponentConstructorOptions< Props > & {
component : import( "svelte" ) . ComponentType < import ( " svelte " ) .SvelteComponent < Props, Events , Slots > >;
immutable? : boolean | undefined ;
hydrate? : boolean | undefined ;
recover? : boolean | undefined ;
} ) : SvelteComponent < Props , Events , Slots > & Exports ;
} ) : import ( "svelte" ) . SvelteComponent < Props , Events , Slots > & Exports ;
/ * *
* Takes the component function and returns a Svelte 4 compatible component constructor .
*
* @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5 .
*
* * /
export function asClassComponent < Props extends Record < string , any > , Exports extends Record < string , any > , Events extends Record < string , any > , Slots extends Record < string , any > > ( component : SvelteComponent < Props , Events , Slots > ) : ComponentType < SvelteComponent < Props , Events , Slots > & Exports > ;
// This should contain all the public interfaces (not all of them are actually importable, check current Svelte for which ones are).
/ * *
* @deprecated Svelte components were classes in Svelte 4 . In Svelte 5 , thy are not anymore .
* Use ` mount ` or ` createRoot ` instead to instantiate components .
* See [ breaking changes ] ( https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes)
* for more info .
* /
interface ComponentConstructorOptions <
Props extends Record < string , any > = Record < string , any >
> {
target : Element | Document | ShadowRoot ;
anchor? : Element ;
props? : Props ;
context? : Map < any , any > ;
hydrate? : boolean ;
intro? : boolean ;
$$inline? : boolean ;
}
// Utility type for ensuring backwards compatibility on a type level: If there's a default slot, add 'children' to the props if it doesn't exist there already
type PropsWithChildren < Props , Slots > = Props &
( Props extends { children? : any }
? { }
: Slots extends { default : any }
? { children? : Snippet }
: { } ) ;
/ * *
* Can be used to create strongly typed Svelte components .
*
* # # # # Example :
*
* You have component library on npm called ` component-library ` , from which
* you export a component called ` MyComponent ` . For Svelte + TypeScript users ,
* you want to provide typings . Therefore you create a ` index.d.ts ` :
* ` ` ` ts
* import { SvelteComponent } from "svelte" ;
* export class MyComponent extends SvelteComponent < { foo : string } > { }
* ` ` `
* Typing this makes it possible for IDEs like VS Code with the Svelte extension
* to provide intellisense and to use the component like this in a Svelte file
* with TypeScript :
* ` ` ` svelte
* < script lang = "ts" >
* import { MyComponent } from "component-library" ;
* < / script >
* < MyComponent foo = { 'bar' } / >
* ` ` `
*
* This was the base class for Svelte components in Svelte 4 . Svelte 5 + components
* are completely different under the hood . You should only use this type for typing ,
* not actually instantiate components with ` new ` - use ` mount ` or ` createRoot ` instead .
* See [ breaking changes ] ( https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes)
* for more info .
* /
class SvelteComponent <
Props extends Record < string , any > = any ,
Events extends Record < string , any > = any ,
Slots extends Record < string , any > = any
> {
[ prop : string ] : any ;
/ * *
* @deprecated This constructor only exists when using the ` asClassComponent ` compatibility helper , which
* is a stop - gap solution . Migrate towards using ` mount ` or ` createRoot ` instead . See
* https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes for more info.
* /
constructor ( options : ComponentConstructorOptions < PropsWithChildren < Props , Slots > > ) ;
/ * *
* For type checking capabilities only .
* Does not exist at runtime .
* # # # DO NOT USE !
* * /
$$prop_def : PropsWithChildren < Props , Slots > ;
/ * *
* For type checking capabilities only .
* Does not exist at runtime .
* # # # DO NOT USE !
*
* * /
$$events_def : Events ;
/ * *
* For type checking capabilities only .
* Does not exist at runtime .
* # # # DO NOT USE !
*
* * /
$$slot_def : Slots ;
/ * *
* @deprecated This method only exists when using one of the legacy compatibility helpers , which
* is a stop - gap solution . See https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* for more info .
* /
$destroy ( ) : void ;
/ * *
* @deprecated This method only exists when using one of the legacy compatibility helpers , which
* is a stop - gap solution . See https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* for more info .
* /
$on < K extends Extract < keyof Events , string > > (
type : K ,
callback : ( e : Events [ K ] ) = > void
) : ( ) = > void ;
/ * *
* @deprecated This method only exists when using one of the legacy compatibility helpers , which
* is a stop - gap solution . See https : //svelte-5-preview.vercel.app/docs/breaking-changes#components-are-no-longer-classes
* for more info .
* /
$set ( props : Partial < Props > ) : void ;
}
/ * *
* Convenience type to get the type of a Svelte component . Useful for example in combination with
* dynamic components using ` <svelte:component> ` .
*
* Example :
* ` ` ` html
* < script lang = "ts" >
* import type { ComponentType , SvelteComponent } from 'svelte' ;
* import Component1 from './Component1.svelte' ;
* import Component2 from './Component2.svelte' ;
*
* const component : ComponentType = someLogic ( ) ? Component1 : Component2 ;
* const componentOfCertainSubType : ComponentType < SvelteComponent < { needsThisProp : string } > > = someLogic ( ) ? Component1 : Component2 ;
* < / script >
*
* < svelte : component this = { component } / >
* < svelte : component this = { componentOfCertainSubType } needsThisProp = "hello" / >
* ` ` `
* /
type ComponentType < Comp extends SvelteComponent = SvelteComponent > = ( new (
options : ComponentConstructorOptions <
Comp extends SvelteComponent < infer Props > ? Props : Record < string , any >
>
) = > Comp ) & {
/** The custom element version of the component. Only present if compiled with the `customElement` compiler option */
element? : typeof HTMLElement ;
} ;
const SnippetReturn : unique symbol ;
/ * *
* The type of a ` #snippet ` block . You can use it to ( for example ) express that your component expects a snippet of a certain type :
* ` ` ` ts
* let { banner } : { banner : Snippet < { text : string } > } = $props ( ) ;
* ` ` `
* You can only call a snippet through the ` {@render ...} ` tag .
* /
type Snippet < T extends unknown [ ] = [ ] > =
// this conditional allows tuples but not arrays. Arrays would indicate a
// rest parameter type, which is not supported. If rest parameters are added
// in the future, the condition can be removed.
number extends T [ 'length' ]
? never
: {
(
this : void ,
. . . args : T
) : typeof SnippetReturn & {
_ : 'functions passed to {@render ...} tags must use the `Snippet` type imported from "svelte"' ;
} ;
} ;
export function asClassComponent < Props extends Record < string , any > , Exports extends Record < string , any > , Events extends Record < string , any > , Slots extends Record < string , any > > ( component : import ( "svelte" ) . SvelteComponent < Props , Events , Slots > ) : import ( "svelte" ) . ComponentType < import ( " svelte " ) .SvelteComponent < Props , Events , Slots > & Exports > ;
}
declare module 'svelte/motion' {