1 | declare module 'svelte' {
|
2 | /**
|
3 | * @deprecated In Svelte 4, components are classes. In Svelte 5, they are functions.
|
4 | * Use `mount` instead to instantiate components.
|
5 | * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes)
|
6 | * for more info.
|
7 | */
|
8 | export interface ComponentConstructorOptions<
|
9 | Props extends Record<string, any> = Record<string, any>
|
10 | > {
|
11 | target: Element | Document | ShadowRoot;
|
12 | anchor?: Element;
|
13 | props?: Props;
|
14 | context?: Map<any, any>;
|
15 | hydrate?: boolean;
|
16 | intro?: boolean;
|
17 | recover?: boolean;
|
18 | sync?: boolean;
|
19 | $$inline?: boolean;
|
20 | }
|
21 |
|
22 | /**
|
23 | * Utility type for ensuring backwards compatibility on a type level that if there's a default slot, add 'children' to the props
|
24 | */
|
25 | type Properties<Props, Slots> = Props &
|
26 | (Slots extends { default: any }
|
27 | ? // This is unfortunate because it means "accepts no props" turns into "accepts any prop"
|
28 | // but the alternative is non-fixable type errors because of the way TypeScript index
|
29 | // signatures work (they will always take precedence and make an impossible-to-satisfy children type).
|
30 | Props extends Record<string, never>
|
31 | ? any
|
32 | : { children?: any }
|
33 | : {});
|
34 |
|
35 | /**
|
36 | * This was the base class for Svelte components in Svelte 4. Svelte 5+ components
|
37 | * are completely different under the hood. For typing, use `Component` instead.
|
38 | * To instantiate components, use `mount` instead`.
|
39 | * See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more info.
|
40 | */
|
41 | export class SvelteComponent<
|
42 | Props extends Record<string, any> = Record<string, any>,
|
43 | Events extends Record<string, any> = any,
|
44 | Slots extends Record<string, any> = any
|
45 | > {
|
46 | /** The custom element version of the component. Only present if compiled with the `customElement` compiler option */
|
47 | static element?: typeof HTMLElement;
|
48 |
|
49 | [prop: string]: any;
|
50 | /**
|
51 | * @deprecated This constructor only exists when using the `asClassComponent` compatibility helper, which
|
52 | * is a stop-gap solution. Migrate towards using `mount` instead. See
|
53 | * https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes for more info.
|
54 | */
|
55 | constructor(options: ComponentConstructorOptions<Properties<Props, Slots>>);
|
56 | /**
|
57 | * For type checking capabilities only.
|
58 | * Does not exist at runtime.
|
59 | * ### DO NOT USE!
|
60 | */
|
61 | $$prop_def: Props; // Without Properties: unnecessary, causes type bugs
|
62 | /**
|
63 | * For type checking capabilities only.
|
64 | * Does not exist at runtime.
|
65 | * ### DO NOT USE!
|
66 | */
|
67 | $$events_def: Events;
|
68 | /**
|
69 | * For type checking capabilities only.
|
70 | * Does not exist at runtime.
|
71 | * ### DO NOT USE!
|
72 | */
|
73 | $$slot_def: Slots;
|
74 | /**
|
75 | * For type checking capabilities only.
|
76 | * Does not exist at runtime.
|
77 | * ### DO NOT USE!
|
78 | */
|
79 | $$bindings?: string;
|
80 |
|
81 | /**
|
82 | * @deprecated This method only exists when using one of the legacy compatibility helpers, which
|
83 | * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
|
84 | * for more info.
|
85 | */
|
86 | $destroy(): void;
|
87 |
|
88 | /**
|
89 | * @deprecated This method only exists when using one of the legacy compatibility helpers, which
|
90 | * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
|
91 | * for more info.
|
92 | */
|
93 | $on<K extends Extract<keyof Events, string>>(
|
94 | type: K,
|
95 | callback: (e: Events[K]) => void
|
96 | ): () => void;
|
97 |
|
98 | /**
|
99 | * @deprecated This method only exists when using one of the legacy compatibility helpers, which
|
100 | * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
|
101 | * for more info.
|
102 | */
|
103 | $set(props: Partial<Props>): void;
|
104 | }
|
105 |
|
106 | const brand: unique symbol;
|
107 | type Brand<B> = { [brand]: B };
|
108 | type Branded<T, B> = T & Brand<B>;
|
109 |
|
110 | /**
|
111 | * Internal implementation details that vary between environments
|
112 | */
|
113 | export type ComponentInternals = Branded<{}, 'ComponentInternals'>;
|
114 |
|
115 | /**
|
116 | * Can be used to create strongly typed Svelte components.
|
117 | *
|
118 | * #### Example:
|
119 | *
|
120 | * You have component library on npm called `component-library`, from which
|
121 | * you export a component called `MyComponent`. For Svelte+TypeScript users,
|
122 | * you want to provide typings. Therefore you create a `index.d.ts`:
|
123 | * ```ts
|
124 | * import type { Component } from 'svelte';
|
125 | * export declare const MyComponent: Component<{ foo: string }> {}
|
126 | * ```
|
127 | * Typing this makes it possible for IDEs like VS Code with the Svelte extension
|
128 | * to provide intellisense and to use the component like this in a Svelte file
|
129 | * with TypeScript:
|
130 | * ```svelte
|
131 | * <script lang="ts">
|
132 | * import { MyComponent } from "component-library";
|
133 | * </script>
|
134 | * <MyComponent foo={'bar'} />
|
135 | * ```
|
136 | */
|
137 | export interface Component<
|
138 | Props extends Record<string, any> = {},
|
139 | Exports extends Record<string, any> = {},
|
140 | Bindings extends keyof Props | '' = string
|
141 | > {
|
142 | /**
|
143 | * @param internal An internal object used by Svelte. Do not use or modify.
|
144 | * @param props The props passed to the component.
|
145 | */
|
146 | (
|
147 | this: void,
|
148 | internals: ComponentInternals,
|
149 | props: Props
|
150 | ): {
|
151 | /**
|
152 | * @deprecated This method only exists when using one of the legacy compatibility helpers, which
|
153 | * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
|
154 | * for more info.
|
155 | */
|
156 | $on?(type: string, callback: (e: any) => void): () => void;
|
157 | /**
|
158 | * @deprecated This method only exists when using one of the legacy compatibility helpers, which
|
159 | * is a stop-gap solution. See https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes
|
160 | * for more info.
|
161 | */
|
162 | $set?(props: Partial<Props>): void;
|
163 | } & Exports;
|
164 | /** The custom element version of the component. Only present if compiled with the `customElement` compiler option */
|
165 | element?: typeof HTMLElement;
|
166 | /** Does not exist at runtime, for typing capabilities only. DO NOT USE */
|
167 | z_$$bindings?: Bindings;
|
168 | }
|
169 |
|
170 | /**
|
171 | * @deprecated Use `Component` instead. See [migration guide](https://svelte.dev/docs/svelte/v5-migration-guide#Components-are-no-longer-classes) for more information.
|
172 | */
|
173 | export class SvelteComponentTyped<
|
174 | Props extends Record<string, any> = Record<string, any>,
|
175 | Events extends Record<string, any> = any,
|
176 | Slots extends Record<string, any> = any
|
177 | > extends SvelteComponent<Props, Events, Slots> {}
|
178 |
|
179 | /**
|
180 | * @deprecated The new `Component` type does not have a dedicated Events type. Use `ComponentProps` instead.
|
181 | *
|
182 | * @description
|
183 | * Convenience type to get the events the given component expects. Example:
|
184 | * ```html
|
185 | * <script lang="ts">
|
186 | * import type { ComponentEvents } from 'svelte';
|
187 | * import Component from './Component.svelte';
|
188 | *
|
189 | * function handleCloseEvent(event: ComponentEvents<Component>['close']) {
|
190 | * console.log(event.detail);
|
191 | * }
|
192 | * </script>
|
193 | *
|
194 | * <Component on:close={handleCloseEvent} />
|
195 | * ```
|
196 | */
|
197 | export type ComponentEvents<Comp extends SvelteComponent> =
|
198 | Comp extends SvelteComponent<any, infer Events> ? Events : never;
|
199 |
|
200 | /**
|
201 | * Convenience type to get the props the given component expects.
|
202 | *
|
203 | * Example: Ensure a variable contains the props expected by `MyComponent`:
|
204 | *
|
205 | * ```ts
|
206 | * import type { ComponentProps } from 'svelte';
|
207 | * import MyComponent from './MyComponent.svelte';
|
208 | *
|
209 | * // Errors if these aren't the correct props expected by MyComponent.
|
210 | * const props: ComponentProps<typeof MyComponent> = { foo: 'bar' };
|
211 | * ```
|
212 | *
|
213 | * > [!NOTE] In Svelte 4, you would do `ComponentProps<MyComponent>` because `MyComponent` was a class.
|
214 | *
|
215 | * Example: A generic function that accepts some component and infers the type of its props:
|
216 | *
|
217 | * ```ts
|
218 | * import type { Component, ComponentProps } from 'svelte';
|
219 | * import MyComponent from './MyComponent.svelte';
|
220 | *
|
221 | * function withProps<TComponent extends Component<any>>(
|
222 | * component: TComponent,
|
223 | * props: ComponentProps<TComponent>
|
224 | * ) {};
|
225 | *
|
226 | * // Errors if the second argument is not the correct props expected by the component in the first argument.
|
227 | * withProps(MyComponent, { foo: 'bar' });
|
228 | * ```
|
229 | */
|
230 | export type ComponentProps<Comp extends SvelteComponent | Component<any, any>> =
|
231 | Comp extends SvelteComponent<infer Props>
|
232 | ? Props
|
233 | : Comp extends Component<infer Props, any>
|
234 | ? Props
|
235 | : never;
|
236 |
|
237 | /**
|
238 | * @deprecated This type is obsolete when working with the new `Component` type.
|
239 | *
|
240 | * @description
|
241 | * Convenience type to get the type of a Svelte component. Useful for example in combination with
|
242 | * dynamic components using `<svelte:component>`.
|
243 | *
|
244 | * Example:
|
245 | * ```html
|
246 | * <script lang="ts">
|
247 | * import type { ComponentType, SvelteComponent } from 'svelte';
|
248 | * import Component1 from './Component1.svelte';
|
249 | * import Component2 from './Component2.svelte';
|
250 | *
|
251 | * const component: ComponentType = someLogic() ? Component1 : Component2;
|
252 | * const componentOfCertainSubType: ComponentType<SvelteComponent<{ needsThisProp: string }>> = someLogic() ? Component1 : Component2;
|
253 | * </script>
|
254 | *
|
255 | * <svelte:component this={component} />
|
256 | * <svelte:component this={componentOfCertainSubType} needsThisProp="hello" />
|
257 | * ```
|
258 | */
|
259 | export type ComponentType<Comp extends SvelteComponent = SvelteComponent> = (new (
|
260 | options: ComponentConstructorOptions<
|
261 | Comp extends SvelteComponent<infer Props> ? Props : Record<string, any>
|
262 | >
|
263 | ) => Comp) & {
|
264 | /** The custom element version of the component. Only present if compiled with the `customElement` compiler option */
|
265 | element?: typeof HTMLElement;
|
266 | };
|
267 |
|
268 | const SnippetReturn: unique symbol;
|
269 |
|
270 | // Use an interface instead of a type, makes for better intellisense info because the type is named in more situations.
|
271 | /**
|
272 | * The type of a `#snippet` block. You can use it to (for example) express that your component expects a snippet of a certain type:
|
273 | * ```ts
|
274 | * let { banner }: { banner: Snippet<[{ text: string }]> } = $props();
|
275 | * ```
|
276 | * You can only call a snippet through the `{@render ...}` tag.
|
277 | *
|
278 | * https://svelte.dev/docs/svelte/snippet
|
279 | *
|
280 | * @template Parameters the parameters that the snippet expects (if any) as a tuple.
|
281 | */
|
282 | export interface Snippet<Parameters extends unknown[] = []> {
|
283 | (
|
284 | this: void,
|
285 | // this conditional allows tuples but not arrays. Arrays would indicate a
|
286 | // rest parameter type, which is not supported. If rest parameters are added
|
287 | // in the future, the condition can be removed.
|
288 | ...args: number extends Parameters['length'] ? never : Parameters
|
289 | ): {
|
290 | '{@render ...} must be called with a Snippet': "import type { Snippet } from 'svelte'";
|
291 | } & typeof SnippetReturn;
|
292 | }
|
293 |
|
294 | interface DispatchOptions {
|
295 | cancelable?: boolean;
|
296 | }
|
297 |
|
298 | export interface EventDispatcher<EventMap extends Record<string, any>> {
|
299 | // Implementation notes:
|
300 | // - undefined extends X instead of X extends undefined makes this work better with both strict and nonstrict mode
|
301 | // - | null | undefined is added for convenience, as they are equivalent for the custom event constructor (both result in a null detail)
|
302 | <Type extends keyof EventMap>(
|
303 | ...args: null extends EventMap[Type]
|
304 | ? [type: Type, parameter?: EventMap[Type] | null | undefined, options?: DispatchOptions]
|
305 | : undefined extends EventMap[Type]
|
306 | ? [type: Type, parameter?: EventMap[Type] | null | undefined, options?: DispatchOptions]
|
307 | : [type: Type, parameter: EventMap[Type], options?: DispatchOptions]
|
308 | ): boolean;
|
309 | }
|
310 |
|
311 | /**
|
312 | * Defines the options accepted by the `mount()` function.
|
313 | */
|
314 | export type MountOptions<Props extends Record<string, any> = Record<string, any>> = {
|
315 | /**
|
316 | * Target element where the component will be mounted.
|
317 | */
|
318 | target: Document | Element | ShadowRoot;
|
319 | /**
|
320 | * Optional node inside `target`. When specified, it is used to render the component immediately before it.
|
321 | */
|
322 | anchor?: Node;
|
323 | /**
|
324 | * Allows the specification of events.
|
325 | * @deprecated Use callback props instead.
|
326 | */
|
327 | events?: Record<string, (e: any) => any>;
|
328 | /**
|
329 | * Can be accessed via `getContext()` at the component level.
|
330 | */
|
331 | context?: Map<any, any>;
|
332 | /**
|
333 | * Whether or not to play transitions on initial render.
|
334 | * @default true
|
335 | */
|
336 | intro?: boolean;
|
337 | } & ({} extends Props
|
338 | ? {
|
339 | /**
|
340 | * Component properties.
|
341 | */
|
342 | props?: Props;
|
343 | }
|
344 | : {
|
345 | /**
|
346 | * Component properties.
|
347 | */
|
348 | props: Props;
|
349 | });
|
350 | /**
|
351 | * The `onMount` function schedules a callback to run as soon as the component has been mounted to the DOM.
|
352 | * It must be called during the component's initialisation (but doesn't need to live *inside* the component;
|
353 | * it can be called from an external module).
|
354 | *
|
355 | * If a function is returned _synchronously_ from `onMount`, it will be called when the component is unmounted.
|
356 | *
|
357 | * `onMount` does not run inside [server-side components](https://svelte.dev/docs/svelte/svelte-server#render).
|
358 | *
|
359 | * */
|
360 | export function onMount<T>(fn: () => NotFunction<T> | Promise<NotFunction<T>> | (() => any)): void;
|
361 | /**
|
362 | * Schedules a callback to run immediately before the component is unmounted.
|
363 | *
|
364 | * Out of `onMount`, `beforeUpdate`, `afterUpdate` and `onDestroy`, this is the
|
365 | * only one that runs inside a server-side component.
|
366 | *
|
367 | * */
|
368 | export function onDestroy(fn: () => any): void;
|
369 | /**
|
370 | * Creates an event dispatcher that can be used to dispatch [component events](https://svelte.dev/docs/svelte/legacy-on#Component-events).
|
371 | * Event dispatchers are functions that can take two arguments: `name` and `detail`.
|
372 | *
|
373 | * Component events created with `createEventDispatcher` create a
|
374 | * [CustomEvent](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent).
|
375 | * These events do not [bubble](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Event_bubbling_and_capture).
|
376 | * The `detail` argument corresponds to the [CustomEvent.detail](https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/detail)
|
377 | * property and can contain any type of data.
|
378 | *
|
379 | * The event dispatcher can be typed to narrow the allowed event names and the type of the `detail` argument:
|
380 | * ```ts
|
381 | * const dispatch = createEventDispatcher<{
|
382 | * loaded: never; // does not take a detail argument
|
383 | * change: string; // takes a detail argument of type string, which is required
|
384 | * optional: number | null; // takes an optional detail argument of type number
|
385 | * }>();
|
386 | * ```
|
387 | *
|
388 | * @deprecated Use callback props and/or the `$host()` rune instead — see https://svelte.dev/docs/svelte/v5-migration-guide#Event-changes-Component-events
|
389 | * */
|
390 | export function createEventDispatcher<EventMap extends Record<string, any> = any>(): EventDispatcher<EventMap>;
|
391 | /**
|
392 | * Schedules a callback to run immediately before the component is updated after any state change.
|
393 | *
|
394 | * The first time the callback runs will be before the initial `onMount`.
|
395 | *
|
396 | * In runes mode use `$effect.pre` instead.
|
397 | *
|
398 | * @deprecated Use `$effect.pre` instead — see https://svelte.dev/docs/svelte/$effect#$effect.pre
|
399 | * */
|
400 | export function beforeUpdate(fn: () => void): void;
|
401 | /**
|
402 | * Schedules a callback to run immediately after the component has been updated.
|
403 | *
|
404 | * The first time the callback runs will be after the initial `onMount`.
|
405 | *
|
406 | * In runes mode use `$effect` instead.
|
407 | *
|
408 | * @deprecated Use `$effect` instead — see https://svelte.dev/docs/svelte/$effect
|
409 | * */
|
410 | export function afterUpdate(fn: () => void): void;
|
411 | /**
|
412 | * Synchronously flushes any pending state changes and those that result from it.
|
413 | * */
|
414 | export function flushSync(fn?: (() => void) | undefined): void;
|
415 | /**
|
416 | * Create a snippet programmatically
|
417 | * */
|
418 | export function createRawSnippet<Params extends unknown[]>(fn: (...params: Getters<Params>) => {
|
419 | render: () => string;
|
420 | setup?: (element: Element) => void | (() => void);
|
421 | }): Snippet<Params>;
|
422 | /** Anything except a function */
|
423 | type NotFunction<T> = T extends Function ? never : T;
|
424 | /**
|
425 | * Mounts a component to the given target and returns the exports and potentially the props (if compiled with `accessors: true`) of the component.
|
426 | * Transitions will play during the initial render unless the `intro` option is set to `false`.
|
427 | *
|
428 | * */
|
429 | export function mount<Props extends Record<string, any>, Exports extends Record<string, any>>(component: ComponentType<SvelteComponent<Props>> | Component<Props, Exports, any>, options: MountOptions<Props>): Exports;
|
430 | /**
|
431 | * Hydrates a component on the given target and returns the exports and potentially the props (if compiled with `accessors: true`) of the component
|
432 | *
|
433 | * */
|
434 | export function hydrate<Props extends Record<string, any>, Exports extends Record<string, any>>(component: ComponentType<SvelteComponent<Props>> | Component<Props, Exports, any>, options: {} extends Props ? {
|
435 | target: Document | Element | ShadowRoot;
|
436 | props?: Props;
|
437 | events?: Record<string, (e: any) => any>;
|
438 | context?: Map<any, any>;
|
439 | intro?: boolean;
|
440 | recover?: boolean;
|
441 | } : {
|
442 | target: Document | Element | ShadowRoot;
|
443 | props: Props;
|
444 | events?: Record<string, (e: any) => any>;
|
445 | context?: Map<any, any>;
|
446 | intro?: boolean;
|
447 | recover?: boolean;
|
448 | }): Exports;
|
449 | /**
|
450 | * Unmounts a component that was previously mounted using `mount` or `hydrate`.
|
451 | * */
|
452 | export function unmount(component: Record<string, any>): void;
|
453 | /**
|
454 | * Returns a promise that resolves once any pending state changes have been applied.
|
455 | * */
|
456 | export function tick(): Promise<void>;
|
457 | /**
|
458 | * When used inside a [`$derived`](https://svelte.dev/docs/svelte/$derived) or [`$effect`](https://svelte.dev/docs/svelte/$effect),
|
459 | * any state read inside `fn` will not be treated as a dependency.
|
460 | *
|
461 | * ```ts
|
462 | * $effect(() => {
|
463 | * // this will run when `data` changes, but not when `time` changes
|
464 | * save(data, {
|
465 | * timestamp: untrack(() => time)
|
466 | * });
|
467 | * });
|
468 | * ```
|
469 | * */
|
470 | export function untrack<T>(fn: () => T): T;
|
471 | /**
|
472 | * Retrieves the context that belongs to the closest parent component with the specified `key`.
|
473 | * Must be called during component initialisation.
|
474 | *
|
475 | * */
|
476 | export function getContext<T>(key: any): T;
|
477 | /**
|
478 | * Associates an arbitrary `context` object with the current component and the specified `key`
|
479 | * and returns that object. The context is then available to children of the component
|
480 | * (including slotted content) with `getContext`.
|
481 | *
|
482 | * Like lifecycle functions, this must be called during component initialisation.
|
483 | *
|
484 | * */
|
485 | export function setContext<T>(key: any, context: T): T;
|
486 | /**
|
487 | * Checks whether a given `key` has been set in the context of a parent component.
|
488 | * Must be called during component initialisation.
|
489 | *
|
490 | * */
|
491 | export function hasContext(key: any): boolean;
|
492 | /**
|
493 | * Retrieves the whole context map that belongs to the closest parent component.
|
494 | * Must be called during component initialisation. Useful, for example, if you
|
495 | * programmatically create a component and want to pass the existing context to it.
|
496 | *
|
497 | * */
|
498 | export function getAllContexts<T extends Map<any, any> = Map<any, any>>(): T;
|
499 | type Getters<T> = {
|
500 | [K in keyof T]: () => T[K];
|
501 | };
|
502 |
|
503 | export {};
|
504 | }
|
505 |
|
506 | declare module 'svelte/action' {
|
507 | /**
|
508 | * Actions can return an object containing the two properties defined in this interface. Both are optional.
|
509 | * - update: An action can have a parameter. This method will be called whenever that parameter changes,
|
510 | * immediately after Svelte has applied updates to the markup. `ActionReturn` and `ActionReturn<undefined>` both
|
511 | * mean that the action accepts no parameters.
|
512 | * - destroy: Method that is called after the element is unmounted
|
513 | *
|
514 | * Additionally, you can specify which additional attributes and events the action enables on the applied element.
|
515 | * This applies to TypeScript typings only and has no effect at runtime.
|
516 | *
|
517 | * Example usage:
|
518 | * ```ts
|
519 | * interface Attributes {
|
520 | * newprop?: string;
|
521 | * 'on:event': (e: CustomEvent<boolean>) => void;
|
522 | * }
|
523 | *
|
524 | * export function myAction(node: HTMLElement, parameter: Parameter): ActionReturn<Parameter, Attributes> {
|
525 | * // ...
|
526 | * return {
|
527 | * update: (updatedParameter) => {...},
|
528 | * destroy: () => {...}
|
529 | * };
|
530 | * }
|
531 | * ```
|
532 | */
|
533 | export interface ActionReturn<
|
534 | Parameter = undefined,
|
535 | Attributes extends Record<string, any> = Record<never, any>
|
536 | > {
|
537 | update?: (parameter: Parameter) => void;
|
538 | destroy?: () => void;
|
539 | /**
|
540 | * ### DO NOT USE THIS
|
541 | * This exists solely for type-checking and has no effect at runtime.
|
542 | * Set this through the `Attributes` generic instead.
|
543 | */
|
544 | $$_attributes?: Attributes;
|
545 | }
|
546 |
|
547 | /**
|
548 | * Actions are functions that are called when an element is created.
|
549 | * You can use this interface to type such actions.
|
550 | * The following example defines an action that only works on `<div>` elements
|
551 | * and optionally accepts a parameter which it has a default value for:
|
552 | * ```ts
|
553 | * export const myAction: Action<HTMLDivElement, { someProperty: boolean } | undefined> = (node, param = { someProperty: true }) => {
|
554 | * // ...
|
555 | * }
|
556 | * ```
|
557 | * `Action<HTMLDivElement>` and `Action<HTMLDivElement, undefined>` both signal that the action accepts no parameters.
|
558 | *
|
559 | * You can return an object with methods `update` and `destroy` from the function and type which additional attributes and events it has.
|
560 | * See interface `ActionReturn` for more details.
|
561 | */
|
562 | export interface Action<
|
563 | Element = HTMLElement,
|
564 | Parameter = undefined,
|
565 | Attributes extends Record<string, any> = Record<never, any>
|
566 | > {
|
567 | <Node extends Element>(
|
568 | ...args: undefined extends Parameter
|
569 | ? [node: Node, parameter?: Parameter]
|
570 | : [node: Node, parameter: Parameter]
|
571 | ): void | ActionReturn<Parameter, Attributes>;
|
572 | }
|
573 |
|
574 | // Implementation notes:
|
575 | // - undefined extends X instead of X extends undefined makes this work better with both strict and nonstrict mode
|
576 |
|
577 | export {};
|
578 | }
|
579 |
|
580 | declare module 'svelte/animate' {
|
581 | // todo: same as Transition, should it be shared?
|
582 | export interface AnimationConfig {
|
583 | delay?: number;
|
584 | duration?: number;
|
585 | easing?: (t: number) => number;
|
586 | css?: (t: number, u: number) => string;
|
587 | tick?: (t: number, u: number) => void;
|
588 | }
|
589 |
|
590 | export interface FlipParams {
|
591 | delay?: number;
|
592 | duration?: number | ((len: number) => number);
|
593 | easing?: (t: number) => number;
|
594 | }
|
595 | /**
|
596 | * The flip function calculates the start and end position of an element and animates between them, translating the x and y values.
|
597 | * `flip` stands for [First, Last, Invert, Play](https://aerotwist.com/blog/flip-your-animations/).
|
598 | *
|
599 | * */
|
600 | export function flip(node: Element, { from, to }: {
|
601 | from: DOMRect;
|
602 | to: DOMRect;
|
603 | }, params?: FlipParams): AnimationConfig;
|
604 |
|
605 | export {};
|
606 | }
|
607 |
|
608 | declare module 'svelte/compiler' {
|
609 | import type { Expression, Identifier, ArrayExpression, ArrowFunctionExpression, VariableDeclaration, VariableDeclarator, MemberExpression, ObjectExpression, Pattern, Program, ChainExpression, SimpleCallExpression } from 'estree';
|
610 | import type { SourceMap } from 'magic-string';
|
611 | import type { Location } from 'locate-character';
|
612 | /**
|
613 | * `compile` converts your `.svelte` source code into a JavaScript module that exports a component
|
614 | *
|
615 | * @param source The component source code
|
616 | * @param options The compiler options
|
617 | * */
|
618 | export function compile(source: string, options: CompileOptions): CompileResult;
|
619 | /**
|
620 | * `compileModule` takes your JavaScript source code containing runes, and turns it into a JavaScript module.
|
621 | *
|
622 | * @param source The component source code
|
623 | * */
|
624 | export function compileModule(source: string, options: ModuleCompileOptions): CompileResult;
|
625 | /**
|
626 | * The parse function parses a component, returning only its abstract syntax tree.
|
627 | *
|
628 | * The `modern` option (`false` by default in Svelte 5) makes the parser return a modern AST instead of the legacy AST.
|
629 | * `modern` will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
|
630 | *
|
631 | * */
|
632 | export function parse(source: string, options: {
|
633 | filename?: string;
|
634 | modern: true;
|
635 | }): AST.Root;
|
636 | /**
|
637 | * The parse function parses a component, returning only its abstract syntax tree.
|
638 | *
|
639 | * The `modern` option (`false` by default in Svelte 5) makes the parser return a modern AST instead of the legacy AST.
|
640 | * `modern` will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
|
641 | *
|
642 | * */
|
643 | export function parse(source: string, options?: {
|
644 | filename?: string;
|
645 | modern?: false;
|
646 | } | undefined): Record<string, any>;
|
647 | /**
|
648 | * @deprecated Replace this with `import { walk } from 'estree-walker'`
|
649 | * */
|
650 | export function walk(): never;
|
651 | /**
|
652 | * The result of a preprocessor run. If the preprocessor does not return a result, it is assumed that the code is unchanged.
|
653 | */
|
654 | export interface Processed {
|
655 | /**
|
656 | * The new code
|
657 | */
|
658 | code: string;
|
659 | /**
|
660 | * A source map mapping back to the original code
|
661 | */
|
662 | map?: string | object; // we are opaque with the type here to avoid dependency on the remapping module for our public types.
|
663 | /**
|
664 | * A list of additional files to watch for changes
|
665 | */
|
666 | dependencies?: string[];
|
667 | /**
|
668 | * Only for script/style preprocessors: The updated attributes to set on the tag. If undefined, attributes stay unchanged.
|
669 | */
|
670 | attributes?: Record<string, string | boolean>;
|
671 | toString?: () => string;
|
672 | }
|
673 |
|
674 | /**
|
675 | * A markup preprocessor that takes a string of code and returns a processed version.
|
676 | */
|
677 | export type MarkupPreprocessor = (options: {
|
678 | /**
|
679 | * The whole Svelte file content
|
680 | */
|
681 | content: string;
|
682 | /**
|
683 | * The filename of the Svelte file
|
684 | */
|
685 | filename?: string;
|
686 | }) => Processed | void | Promise<Processed | void>;
|
687 |
|
688 | /**
|
689 | * A script/style preprocessor that takes a string of code and returns a processed version.
|
690 | */
|
691 | export type Preprocessor = (options: {
|
692 | /**
|
693 | * The script/style tag content
|
694 | */
|
695 | content: string;
|
696 | /**
|
697 | * The attributes on the script/style tag
|
698 | */
|
699 | attributes: Record<string, string | boolean>;
|
700 | /**
|
701 | * The whole Svelte file content
|
702 | */
|
703 | markup: string;
|
704 | /**
|
705 | * The filename of the Svelte file
|
706 | */
|
707 | filename?: string;
|
708 | }) => Processed | void | Promise<Processed | void>;
|
709 |
|
710 | /**
|
711 | * A preprocessor group is a set of preprocessors that are applied to a Svelte file.
|
712 | */
|
713 | export interface PreprocessorGroup {
|
714 | /** Name of the preprocessor. Will be a required option in the next major version */
|
715 | name?: string;
|
716 | markup?: MarkupPreprocessor;
|
717 | style?: Preprocessor;
|
718 | script?: Preprocessor;
|
719 | }
|
720 | /** The return value of `compile` from `svelte/compiler` */
|
721 | export interface CompileResult {
|
722 | /** The compiled JavaScript */
|
723 | js: {
|
724 | /** The generated code */
|
725 | code: string;
|
726 | /** A source map */
|
727 | map: SourceMap;
|
728 | };
|
729 | /** The compiled CSS */
|
730 | css: null | {
|
731 | /** The generated code */
|
732 | code: string;
|
733 | /** A source map */
|
734 | map: SourceMap;
|
735 | };
|
736 | /**
|
737 | * An array of warning objects that were generated during compilation. Each warning has several properties:
|
738 | * - `code` is a string identifying the category of warning
|
739 | * - `message` describes the issue in human-readable terms
|
740 | * - `start` and `end`, if the warning relates to a specific location, are objects with `line`, `column` and `character` properties
|
741 | */
|
742 | warnings: Warning[];
|
743 | /**
|
744 | * Metadata about the compiled component
|
745 | */
|
746 | metadata: {
|
747 | /**
|
748 | * Whether the file was compiled in runes mode, either because of an explicit option or inferred from usage.
|
749 | * For `compileModule`, this is always `true`
|
750 | */
|
751 | runes: boolean;
|
752 | };
|
753 | /** The AST */
|
754 | ast: any;
|
755 | }
|
756 |
|
757 | export interface Warning extends ICompileDiagnostic {}
|
758 |
|
759 | export interface CompileError extends ICompileDiagnostic {}
|
760 |
|
761 | type CssHashGetter = (args: {
|
762 | name: string;
|
763 | filename: string;
|
764 | css: string;
|
765 | hash: (input: string) => string;
|
766 | }) => string;
|
767 |
|
768 | export interface CompileOptions extends ModuleCompileOptions {
|
769 | /**
|
770 | * Sets the name of the resulting JavaScript class (though the compiler will rename it if it would otherwise conflict with other variables in scope).
|
771 | * If unspecified, will be inferred from `filename`
|
772 | */
|
773 | name?: string;
|
774 | /**
|
775 | * If `true`, tells the compiler to generate a custom element constructor instead of a regular Svelte component.
|
776 | *
|
777 | * @default false
|
778 | */
|
779 | customElement?: boolean;
|
780 | /**
|
781 | * If `true`, getters and setters will be created for the component's props. If `false`, they will only be created for readonly exported values (i.e. those declared with `const`, `class` and `function`). If compiling with `customElement: true` this option defaults to `true`.
|
782 | *
|
783 | * @default false
|
784 | * @deprecated This will have no effect in runes mode
|
785 | */
|
786 | accessors?: boolean;
|
787 | /**
|
788 | * The namespace of the element; e.g., `"html"`, `"svg"`, `"mathml"`.
|
789 | *
|
790 | * @default 'html'
|
791 | */
|
792 | namespace?: Namespace;
|
793 | /**
|
794 | * If `true`, tells the compiler that you promise not to mutate any objects.
|
795 | * This allows it to be less conservative about checking whether values have changed.
|
796 | *
|
797 | * @default false
|
798 | * @deprecated This will have no effect in runes mode
|
799 | */
|
800 | immutable?: boolean;
|
801 | /**
|
802 | * - `'injected'`: styles will be included in the `head` when using `render(...)`, and injected into the document (if not already present) when the component mounts. For components compiled as custom elements, styles are injected to the shadow root.
|
803 | * - `'external'`: the CSS will only be returned in the `css` field of the compilation result. Most Svelte bundler plugins will set this to `'external'` and use the CSS that is statically generated for better performance, as it will result in smaller JavaScript bundles and the output can be served as cacheable `.css` files.
|
804 | * This is always `'injected'` when compiling with `customElement` mode.
|
805 | */
|
806 | css?: 'injected' | 'external';
|
807 | /**
|
808 | * A function that takes a `{ hash, css, name, filename }` argument and returns the string that is used as a classname for scoped CSS.
|
809 | * It defaults to returning `svelte-${hash(css)}`.
|
810 | *
|
811 | * @default undefined
|
812 | */
|
813 | cssHash?: CssHashGetter;
|
814 | /**
|
815 | * If `true`, your HTML comments will be preserved in the output. By default, they are stripped out.
|
816 | *
|
817 | * @default false
|
818 | */
|
819 | preserveComments?: boolean;
|
820 | /**
|
821 | * If `true`, whitespace inside and between elements is kept as you typed it, rather than removed or collapsed to a single space where possible.
|
822 | *
|
823 | * @default false
|
824 | */
|
825 | preserveWhitespace?: boolean;
|
826 | /**
|
827 | * Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage.
|
828 | * Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage.
|
829 | * Set to `undefined` (the default) to infer runes mode from the component code.
|
830 | * Is always `true` for JS/TS modules compiled with Svelte.
|
831 | * Will be `true` by default in Svelte 6.
|
832 | * Note that setting this to `true` in your `svelte.config.js` will force runes mode for your entire project, including components in `node_modules`,
|
833 | * which is likely not what you want. If you're using Vite, consider using [dynamicCompileOptions](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/config.md#dynamiccompileoptions) instead.
|
834 | * @default undefined
|
835 | */
|
836 | runes?: boolean | undefined;
|
837 | /**
|
838 | * If `true`, exposes the Svelte major version in the browser by adding it to a `Set` stored in the global `window.__svelte.v`.
|
839 | *
|
840 | * @default true
|
841 | */
|
842 | discloseVersion?: boolean;
|
843 | /**
|
844 | * @deprecated Use these only as a temporary solution before migrating your code
|
845 | */
|
846 | compatibility?: {
|
847 | /**
|
848 | * Applies a transformation so that the default export of Svelte files can still be instantiated the same way as in Svelte 4 —
|
849 | * as a class when compiling for the browser (as though using `createClassComponent(MyComponent, {...})` from `svelte/legacy`)
|
850 | * or as an object with a `.render(...)` method when compiling for the server
|
851 | * @default 5
|
852 | */
|
853 | componentApi?: 4 | 5;
|
854 | };
|
855 | /**
|
856 | * An initial sourcemap that will be merged into the final output sourcemap.
|
857 | * This is usually the preprocessor sourcemap.
|
858 | *
|
859 | * @default null
|
860 | */
|
861 | sourcemap?: object | string;
|
862 | /**
|
863 | * Used for your JavaScript sourcemap.
|
864 | *
|
865 | * @default null
|
866 | */
|
867 | outputFilename?: string;
|
868 | /**
|
869 | * Used for your CSS sourcemap.
|
870 | *
|
871 | * @default null
|
872 | */
|
873 | cssOutputFilename?: string;
|
874 | /**
|
875 | * If `true`, compiles components with hot reloading support.
|
876 | *
|
877 | * @default false
|
878 | */
|
879 | hmr?: boolean;
|
880 | /**
|
881 | * If `true`, returns the modern version of the AST.
|
882 | * Will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
|
883 | *
|
884 | * @default false
|
885 | */
|
886 | modernAst?: boolean;
|
887 | }
|
888 |
|
889 | export interface ModuleCompileOptions {
|
890 | /**
|
891 | * If `true`, causes extra code to be added that will perform runtime checks and provide debugging information during development.
|
892 | *
|
893 | * @default false
|
894 | */
|
895 | dev?: boolean;
|
896 | /**
|
897 | * If `"client"`, Svelte emits code designed to run in the browser.
|
898 | * If `"server"`, Svelte emits code suitable for server-side rendering.
|
899 | * If `false`, nothing is generated. Useful for tooling that is only interested in warnings.
|
900 | *
|
901 | * @default 'client'
|
902 | */
|
903 | generate?: 'client' | 'server' | false;
|
904 | /**
|
905 | * Used for debugging hints and sourcemaps. Your bundler plugin will set it automatically.
|
906 | */
|
907 | filename?: string;
|
908 | /**
|
909 | * Used for ensuring filenames don't leak filesystem information. Your bundler plugin will set it automatically.
|
910 | * @default process.cwd() on node-like environments, undefined elsewhere
|
911 | */
|
912 | rootDir?: string;
|
913 | /**
|
914 | * A function that gets a `Warning` as an argument and returns a boolean.
|
915 | * Use this to filter out warnings. Return `true` to keep the warning, `false` to discard it.
|
916 | */
|
917 | warningFilter?: (warning: Warning) => boolean;
|
918 | }
|
919 | /**
|
920 | * - `html` — the default, for e.g. `<div>` or `<span>`
|
921 | * - `svg` — for e.g. `<svg>` or `<g>`
|
922 | * - `mathml` — for e.g. `<math>` or `<mrow>`
|
923 | */
|
924 | type Namespace = 'html' | 'svg' | 'mathml';
|
925 |
|
926 | export namespace AST {
|
927 | export interface BaseNode {
|
928 | type: string;
|
929 | start: number;
|
930 | end: number;
|
931 | }
|
932 |
|
933 | export interface Fragment {
|
934 | type: 'Fragment';
|
935 | nodes: Array<Text | Tag | ElementLike | Block | Comment>;
|
936 | }
|
937 |
|
938 | export interface Root extends BaseNode {
|
939 | type: 'Root';
|
940 | /**
|
941 | * Inline options provided by `<svelte:options>` — these override options passed to `compile(...)`
|
942 | */
|
943 | options: SvelteOptions | null;
|
944 | fragment: Fragment;
|
945 | /** The parsed `<style>` element, if exists */
|
946 | css: Css.StyleSheet | null;
|
947 | /** The parsed `<script>` element, if exists */
|
948 | instance: Script | null;
|
949 | /** The parsed `<script module>` element, if exists */
|
950 | module: Script | null;
|
951 | }
|
952 |
|
953 | export interface SvelteOptions {
|
954 | // start/end info (needed for warnings and for our Prettier plugin)
|
955 | start: number;
|
956 | end: number;
|
957 | // options
|
958 | runes?: boolean;
|
959 | immutable?: boolean;
|
960 | accessors?: boolean;
|
961 | preserveWhitespace?: boolean;
|
962 | namespace?: Namespace;
|
963 | css?: 'injected';
|
964 | customElement?: {
|
965 | tag?: string;
|
966 | shadow?: 'open' | 'none';
|
967 | props?: Record<
|
968 | string,
|
969 | {
|
970 | attribute?: string;
|
971 | reflect?: boolean;
|
972 | type?: 'Array' | 'Boolean' | 'Number' | 'Object' | 'String';
|
973 | }
|
974 | >;
|
975 | /**
|
976 | * Is of type
|
977 | * ```ts
|
978 | * (ceClass: new () => HTMLElement) => new () => HTMLElement
|
979 | * ```
|
980 | */
|
981 | extend?: ArrowFunctionExpression | Identifier;
|
982 | };
|
983 | attributes: Attribute[];
|
984 | }
|
985 |
|
986 | /** Static text */
|
987 | export interface Text extends BaseNode {
|
988 | type: 'Text';
|
989 | /** Text with decoded HTML entities */
|
990 | data: string;
|
991 | /** The original text, with undecoded HTML entities */
|
992 | raw: string;
|
993 | }
|
994 |
|
995 | /** A (possibly reactive) template expression — `{...}` */
|
996 | export interface ExpressionTag extends BaseNode {
|
997 | type: 'ExpressionTag';
|
998 | expression: Expression;
|
999 | }
|
1000 |
|
1001 | /** A (possibly reactive) HTML template expression — `{@html ...}` */
|
1002 | export interface HtmlTag extends BaseNode {
|
1003 | type: 'HtmlTag';
|
1004 | expression: Expression;
|
1005 | }
|
1006 |
|
1007 | /** An HTML comment */
|
1008 | // TODO rename to disambiguate
|
1009 | export interface Comment extends BaseNode {
|
1010 | type: 'Comment';
|
1011 | /** the contents of the comment */
|
1012 | data: string;
|
1013 | }
|
1014 |
|
1015 | /** A `{@const ...}` tag */
|
1016 | export interface ConstTag extends BaseNode {
|
1017 | type: 'ConstTag';
|
1018 | declaration: VariableDeclaration & {
|
1019 | declarations: [VariableDeclarator & { id: Pattern; init: Expression }];
|
1020 | };
|
1021 | }
|
1022 |
|
1023 | /** A `{@debug ...}` tag */
|
1024 | export interface DebugTag extends BaseNode {
|
1025 | type: 'DebugTag';
|
1026 | identifiers: Identifier[];
|
1027 | }
|
1028 |
|
1029 | /** A `{@render foo(...)} tag */
|
1030 | export interface RenderTag extends BaseNode {
|
1031 | type: 'RenderTag';
|
1032 | expression: SimpleCallExpression | (ChainExpression & { expression: SimpleCallExpression });
|
1033 | }
|
1034 |
|
1035 | /** An `animate:` directive */
|
1036 | export interface AnimateDirective extends BaseNode {
|
1037 | type: 'AnimateDirective';
|
1038 | /** The 'x' in `animate:x` */
|
1039 | name: string;
|
1040 | /** The y in `animate:x={y}` */
|
1041 | expression: null | Expression;
|
1042 | }
|
1043 |
|
1044 | /** A `bind:` directive */
|
1045 | export interface BindDirective extends BaseNode {
|
1046 | type: 'BindDirective';
|
1047 | /** The 'x' in `bind:x` */
|
1048 | name: string;
|
1049 | /** The y in `bind:x={y}` */
|
1050 | expression: Identifier | MemberExpression;
|
1051 | }
|
1052 |
|
1053 | /** A `class:` directive */
|
1054 | export interface ClassDirective extends BaseNode {
|
1055 | type: 'ClassDirective';
|
1056 | /** The 'x' in `class:x` */
|
1057 | name: 'class';
|
1058 | /** The 'y' in `class:x={y}`, or the `x` in `class:x` */
|
1059 | expression: Expression;
|
1060 | }
|
1061 |
|
1062 | /** A `let:` directive */
|
1063 | export interface LetDirective extends BaseNode {
|
1064 | type: 'LetDirective';
|
1065 | /** The 'x' in `let:x` */
|
1066 | name: string;
|
1067 | /** The 'y' in `let:x={y}` */
|
1068 | expression: null | Identifier | ArrayExpression | ObjectExpression;
|
1069 | }
|
1070 |
|
1071 | /** An `on:` directive */
|
1072 | export interface OnDirective extends BaseNode {
|
1073 | type: 'OnDirective';
|
1074 | /** The 'x' in `on:x` */
|
1075 | name: string;
|
1076 | /** The 'y' in `on:x={y}` */
|
1077 | expression: null | Expression;
|
1078 | modifiers: string[];
|
1079 | }
|
1080 |
|
1081 | /** A `style:` directive */
|
1082 | export interface StyleDirective extends BaseNode {
|
1083 | type: 'StyleDirective';
|
1084 | /** The 'x' in `style:x` */
|
1085 | name: string;
|
1086 | /** The 'y' in `style:x={y}` */
|
1087 | value: true | ExpressionTag | Array<ExpressionTag | Text>;
|
1088 | modifiers: Array<'important'>;
|
1089 | }
|
1090 |
|
1091 | // TODO have separate in/out/transition directives
|
1092 | /** A `transition:`, `in:` or `out:` directive */
|
1093 | export interface TransitionDirective extends BaseNode {
|
1094 | type: 'TransitionDirective';
|
1095 | /** The 'x' in `transition:x` */
|
1096 | name: string;
|
1097 | /** The 'y' in `transition:x={y}` */
|
1098 | expression: null | Expression;
|
1099 | modifiers: Array<'local' | 'global'>;
|
1100 | /** True if this is a `transition:` or `in:` directive */
|
1101 | intro: boolean;
|
1102 | /** True if this is a `transition:` or `out:` directive */
|
1103 | outro: boolean;
|
1104 | }
|
1105 |
|
1106 | /** A `use:` directive */
|
1107 | export interface UseDirective extends BaseNode {
|
1108 | type: 'UseDirective';
|
1109 | /** The 'x' in `use:x` */
|
1110 | name: string;
|
1111 | /** The 'y' in `use:x={y}` */
|
1112 | expression: null | Expression;
|
1113 | }
|
1114 |
|
1115 | interface BaseElement extends BaseNode {
|
1116 | name: string;
|
1117 | attributes: Array<Attribute | SpreadAttribute | Directive>;
|
1118 | fragment: Fragment;
|
1119 | }
|
1120 |
|
1121 | export interface Component extends BaseElement {
|
1122 | type: 'Component';
|
1123 | }
|
1124 |
|
1125 | export interface TitleElement extends BaseElement {
|
1126 | type: 'TitleElement';
|
1127 | name: 'title';
|
1128 | }
|
1129 |
|
1130 | export interface SlotElement extends BaseElement {
|
1131 | type: 'SlotElement';
|
1132 | name: 'slot';
|
1133 | }
|
1134 |
|
1135 | export interface RegularElement extends BaseElement {
|
1136 | type: 'RegularElement';
|
1137 | }
|
1138 |
|
1139 | export interface SvelteBody extends BaseElement {
|
1140 | type: 'SvelteBody';
|
1141 | name: 'svelte:body';
|
1142 | }
|
1143 |
|
1144 | export interface SvelteComponent extends BaseElement {
|
1145 | type: 'SvelteComponent';
|
1146 | name: 'svelte:component';
|
1147 | expression: Expression;
|
1148 | }
|
1149 |
|
1150 | export interface SvelteDocument extends BaseElement {
|
1151 | type: 'SvelteDocument';
|
1152 | name: 'svelte:document';
|
1153 | }
|
1154 |
|
1155 | export interface SvelteElement extends BaseElement {
|
1156 | type: 'SvelteElement';
|
1157 | name: 'svelte:element';
|
1158 | tag: Expression;
|
1159 | }
|
1160 |
|
1161 | export interface SvelteFragment extends BaseElement {
|
1162 | type: 'SvelteFragment';
|
1163 | name: 'svelte:fragment';
|
1164 | }
|
1165 |
|
1166 | export interface SvelteHead extends BaseElement {
|
1167 | type: 'SvelteHead';
|
1168 | name: 'svelte:head';
|
1169 | }
|
1170 |
|
1171 | /** This is only an intermediate representation while parsing, it doesn't exist in the final AST */
|
1172 | export interface SvelteOptionsRaw extends BaseElement {
|
1173 | type: 'SvelteOptions';
|
1174 | name: 'svelte:options';
|
1175 | }
|
1176 |
|
1177 | export interface SvelteSelf extends BaseElement {
|
1178 | type: 'SvelteSelf';
|
1179 | name: 'svelte:self';
|
1180 | }
|
1181 |
|
1182 | export interface SvelteWindow extends BaseElement {
|
1183 | type: 'SvelteWindow';
|
1184 | name: 'svelte:window';
|
1185 | }
|
1186 |
|
1187 | /** An `{#each ...}` block */
|
1188 | export interface EachBlock extends BaseNode {
|
1189 | type: 'EachBlock';
|
1190 | expression: Expression;
|
1191 | context: Pattern;
|
1192 | body: Fragment;
|
1193 | fallback?: Fragment;
|
1194 | index?: string;
|
1195 | key?: Expression;
|
1196 | }
|
1197 |
|
1198 | /** An `{#if ...}` block */
|
1199 | export interface IfBlock extends BaseNode {
|
1200 | type: 'IfBlock';
|
1201 | elseif: boolean;
|
1202 | test: Expression;
|
1203 | consequent: Fragment;
|
1204 | alternate: Fragment | null;
|
1205 | }
|
1206 |
|
1207 | /** An `{#await ...}` block */
|
1208 | export interface AwaitBlock extends BaseNode {
|
1209 | type: 'AwaitBlock';
|
1210 | expression: Expression;
|
1211 | // TODO can/should we move these inside the ThenBlock and CatchBlock?
|
1212 | /** The resolved value inside the `then` block */
|
1213 | value: Pattern | null;
|
1214 | /** The rejection reason inside the `catch` block */
|
1215 | error: Pattern | null;
|
1216 | pending: Fragment | null;
|
1217 | then: Fragment | null;
|
1218 | catch: Fragment | null;
|
1219 | }
|
1220 |
|
1221 | export interface KeyBlock extends BaseNode {
|
1222 | type: 'KeyBlock';
|
1223 | expression: Expression;
|
1224 | fragment: Fragment;
|
1225 | }
|
1226 |
|
1227 | export interface SnippetBlock extends BaseNode {
|
1228 | type: 'SnippetBlock';
|
1229 | expression: Identifier;
|
1230 | parameters: Pattern[];
|
1231 | body: Fragment;
|
1232 | }
|
1233 |
|
1234 | export interface Attribute extends BaseNode {
|
1235 | type: 'Attribute';
|
1236 | name: string;
|
1237 | /**
|
1238 | * Quoted/string values are represented by an array, even if they contain a single expression like `"{x}"`
|
1239 | */
|
1240 | value: true | ExpressionTag | Array<Text | ExpressionTag>;
|
1241 | }
|
1242 |
|
1243 | export interface SpreadAttribute extends BaseNode {
|
1244 | type: 'SpreadAttribute';
|
1245 | expression: Expression;
|
1246 | }
|
1247 |
|
1248 | export interface Script extends BaseNode {
|
1249 | type: 'Script';
|
1250 | context: 'default' | 'module';
|
1251 | content: Program;
|
1252 | attributes: Attribute[];
|
1253 | }
|
1254 | }
|
1255 |
|
1256 | type Tag = AST.ExpressionTag | AST.HtmlTag | AST.ConstTag | AST.DebugTag | AST.RenderTag;
|
1257 |
|
1258 | type Directive =
|
1259 | | AST.AnimateDirective
|
1260 | | AST.BindDirective
|
1261 | | AST.ClassDirective
|
1262 | | AST.LetDirective
|
1263 | | AST.OnDirective
|
1264 | | AST.StyleDirective
|
1265 | | AST.TransitionDirective
|
1266 | | AST.UseDirective;
|
1267 |
|
1268 | type Block = AST.EachBlock | AST.IfBlock | AST.AwaitBlock | AST.KeyBlock | AST.SnippetBlock;
|
1269 |
|
1270 | type ElementLike =
|
1271 | | AST.Component
|
1272 | | AST.TitleElement
|
1273 | | AST.SlotElement
|
1274 | | AST.RegularElement
|
1275 | | AST.SvelteBody
|
1276 | | AST.SvelteComponent
|
1277 | | AST.SvelteDocument
|
1278 | | AST.SvelteElement
|
1279 | | AST.SvelteFragment
|
1280 | | AST.SvelteHead
|
1281 | | AST.SvelteOptionsRaw
|
1282 | | AST.SvelteSelf
|
1283 | | AST.SvelteWindow;
|
1284 | /**
|
1285 | * The preprocess function provides convenient hooks for arbitrarily transforming component source code.
|
1286 | * For example, it can be used to convert a `<style lang="sass">` block into vanilla CSS.
|
1287 | *
|
1288 | * */
|
1289 | export function preprocess(source: string, preprocessor: PreprocessorGroup | PreprocessorGroup[], options?: {
|
1290 | filename?: string;
|
1291 | } | undefined): Promise<Processed>;
|
1292 | /**
|
1293 | * The current version, as set in package.json.
|
1294 | *
|
1295 | * https://svelte.dev/docs/svelte-compiler#svelte-version
|
1296 | * */
|
1297 | export const VERSION: string;
|
1298 | /**
|
1299 | * Does a best-effort migration of Svelte code towards using runes, event attributes and render tags.
|
1300 | * May throw an error if the code is too complex to migrate automatically.
|
1301 | *
|
1302 | * */
|
1303 | export function migrate(source: string, { filename, use_ts }?: {
|
1304 | filename?: string;
|
1305 | use_ts?: boolean;
|
1306 | } | undefined): {
|
1307 | code: string;
|
1308 | };
|
1309 | namespace Css {
|
1310 | export interface BaseNode {
|
1311 | start: number;
|
1312 | end: number;
|
1313 | }
|
1314 |
|
1315 | export interface StyleSheet extends BaseNode {
|
1316 | type: 'StyleSheet';
|
1317 | attributes: any[]; // TODO
|
1318 | children: Array<Atrule | Rule>;
|
1319 | content: {
|
1320 | start: number;
|
1321 | end: number;
|
1322 | styles: string;
|
1323 | /** Possible comment atop the style tag */
|
1324 | comment: AST.Comment | null;
|
1325 | };
|
1326 | }
|
1327 |
|
1328 | export interface Atrule extends BaseNode {
|
1329 | type: 'Atrule';
|
1330 | name: string;
|
1331 | prelude: string;
|
1332 | block: Block | null;
|
1333 | }
|
1334 |
|
1335 | export interface Rule extends BaseNode {
|
1336 | type: 'Rule';
|
1337 | prelude: SelectorList;
|
1338 | block: Block;
|
1339 | }
|
1340 |
|
1341 | /**
|
1342 | * A list of selectors, e.g. `a, b, c {}`
|
1343 | */
|
1344 | export interface SelectorList extends BaseNode {
|
1345 | type: 'SelectorList';
|
1346 | /**
|
1347 | * The `a`, `b` and `c` in `a, b, c {}`
|
1348 | */
|
1349 | children: ComplexSelector[];
|
1350 | }
|
1351 |
|
1352 | /**
|
1353 | * A complex selector, e.g. `a b c {}`
|
1354 | */
|
1355 | export interface ComplexSelector extends BaseNode {
|
1356 | type: 'ComplexSelector';
|
1357 | /**
|
1358 | * The `a`, `b` and `c` in `a b c {}`
|
1359 | */
|
1360 | children: RelativeSelector[];
|
1361 | }
|
1362 |
|
1363 | /**
|
1364 | * A relative selector, e.g the `a` and `> b` in `a > b {}`
|
1365 | */
|
1366 | export interface RelativeSelector extends BaseNode {
|
1367 | type: 'RelativeSelector';
|
1368 | /**
|
1369 | * In `a > b`, `> b` forms one relative selector, and `>` is the combinator. `null` for the first selector.
|
1370 | */
|
1371 | combinator: null | Combinator;
|
1372 | /**
|
1373 | * The `b:is(...)` in `> b:is(...)`
|
1374 | */
|
1375 | selectors: SimpleSelector[];
|
1376 | }
|
1377 |
|
1378 | export interface TypeSelector extends BaseNode {
|
1379 | type: 'TypeSelector';
|
1380 | name: string;
|
1381 | }
|
1382 |
|
1383 | export interface IdSelector extends BaseNode {
|
1384 | type: 'IdSelector';
|
1385 | name: string;
|
1386 | }
|
1387 |
|
1388 | export interface ClassSelector extends BaseNode {
|
1389 | type: 'ClassSelector';
|
1390 | name: string;
|
1391 | }
|
1392 |
|
1393 | export interface AttributeSelector extends BaseNode {
|
1394 | type: 'AttributeSelector';
|
1395 | name: string;
|
1396 | matcher: string | null;
|
1397 | value: string | null;
|
1398 | flags: string | null;
|
1399 | }
|
1400 |
|
1401 | export interface PseudoElementSelector extends BaseNode {
|
1402 | type: 'PseudoElementSelector';
|
1403 | name: string;
|
1404 | }
|
1405 |
|
1406 | export interface PseudoClassSelector extends BaseNode {
|
1407 | type: 'PseudoClassSelector';
|
1408 | name: string;
|
1409 | args: SelectorList | null;
|
1410 | }
|
1411 |
|
1412 | export interface Percentage extends BaseNode {
|
1413 | type: 'Percentage';
|
1414 | value: string;
|
1415 | }
|
1416 |
|
1417 | export interface NestingSelector extends BaseNode {
|
1418 | type: 'NestingSelector';
|
1419 | name: '&';
|
1420 | }
|
1421 |
|
1422 | export interface Nth extends BaseNode {
|
1423 | type: 'Nth';
|
1424 | value: string;
|
1425 | }
|
1426 |
|
1427 | export type SimpleSelector =
|
1428 | | TypeSelector
|
1429 | | IdSelector
|
1430 | | ClassSelector
|
1431 | | AttributeSelector
|
1432 | | PseudoElementSelector
|
1433 | | PseudoClassSelector
|
1434 | | Percentage
|
1435 | | Nth
|
1436 | | NestingSelector;
|
1437 |
|
1438 | export interface Combinator extends BaseNode {
|
1439 | type: 'Combinator';
|
1440 | name: string;
|
1441 | }
|
1442 |
|
1443 | export interface Block extends BaseNode {
|
1444 | type: 'Block';
|
1445 | children: Array<Declaration | Rule | Atrule>;
|
1446 | }
|
1447 |
|
1448 | export interface Declaration extends BaseNode {
|
1449 | type: 'Declaration';
|
1450 | property: string;
|
1451 | value: string;
|
1452 | }
|
1453 |
|
1454 | // for zimmerframe
|
1455 | export type Node =
|
1456 | | StyleSheet
|
1457 | | Rule
|
1458 | | Atrule
|
1459 | | SelectorList
|
1460 | | Block
|
1461 | | ComplexSelector
|
1462 | | RelativeSelector
|
1463 | | Combinator
|
1464 | | SimpleSelector
|
1465 | | Declaration;
|
1466 | }
|
1467 | type ICompileDiagnostic = {
|
1468 | code: string;
|
1469 | message: string;
|
1470 | stack?: string;
|
1471 | filename?: string;
|
1472 | start?: Location;
|
1473 | end?: Location;
|
1474 | position?: [number, number];
|
1475 | frame?: string;
|
1476 | };
|
1477 |
|
1478 | export {};
|
1479 | }
|
1480 |
|
1481 | declare module 'svelte/easing' {
|
1482 | export function linear(t: number): number;
|
1483 |
|
1484 | export function backInOut(t: number): number;
|
1485 |
|
1486 | export function backIn(t: number): number;
|
1487 |
|
1488 | export function backOut(t: number): number;
|
1489 |
|
1490 | export function bounceOut(t: number): number;
|
1491 |
|
1492 | export function bounceInOut(t: number): number;
|
1493 |
|
1494 | export function bounceIn(t: number): number;
|
1495 |
|
1496 | export function circInOut(t: number): number;
|
1497 |
|
1498 | export function circIn(t: number): number;
|
1499 |
|
1500 | export function circOut(t: number): number;
|
1501 |
|
1502 | export function cubicInOut(t: number): number;
|
1503 |
|
1504 | export function cubicIn(t: number): number;
|
1505 |
|
1506 | export function cubicOut(t: number): number;
|
1507 |
|
1508 | export function elasticInOut(t: number): number;
|
1509 |
|
1510 | export function elasticIn(t: number): number;
|
1511 |
|
1512 | export function elasticOut(t: number): number;
|
1513 |
|
1514 | export function expoInOut(t: number): number;
|
1515 |
|
1516 | export function expoIn(t: number): number;
|
1517 |
|
1518 | export function expoOut(t: number): number;
|
1519 |
|
1520 | export function quadInOut(t: number): number;
|
1521 |
|
1522 | export function quadIn(t: number): number;
|
1523 |
|
1524 | export function quadOut(t: number): number;
|
1525 |
|
1526 | export function quartInOut(t: number): number;
|
1527 |
|
1528 | export function quartIn(t: number): number;
|
1529 |
|
1530 | export function quartOut(t: number): number;
|
1531 |
|
1532 | export function quintInOut(t: number): number;
|
1533 |
|
1534 | export function quintIn(t: number): number;
|
1535 |
|
1536 | export function quintOut(t: number): number;
|
1537 |
|
1538 | export function sineInOut(t: number): number;
|
1539 |
|
1540 | export function sineIn(t: number): number;
|
1541 |
|
1542 | export function sineOut(t: number): number;
|
1543 |
|
1544 | export {};
|
1545 | }
|
1546 |
|
1547 | declare module 'svelte/legacy' {
|
1548 | import type { ComponentConstructorOptions, SvelteComponent, ComponentType, Component } from 'svelte';
|
1549 | /**
|
1550 | * Takes the same options as a Svelte 4 component and the component function and returns a Svelte 4 compatible component.
|
1551 | *
|
1552 | * @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5.
|
1553 | *
|
1554 | * */
|
1555 | 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> & {
|
1556 | component: ComponentType<SvelteComponent<Props, Events, Slots>> | Component<Props>;
|
1557 | }): SvelteComponent<Props, Events, Slots> & Exports;
|
1558 | /**
|
1559 | * Takes the component function and returns a Svelte 4 compatible component constructor.
|
1560 | *
|
1561 | * @deprecated Use this only as a temporary solution to migrate your imperative component code to Svelte 5.
|
1562 | *
|
1563 | * */
|
1564 | 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> | Component<Props>): ComponentType<SvelteComponent<Props, Events, Slots> & Exports>;
|
1565 | /**
|
1566 | * Runs the given function once immediately on the server, and works like `$effect.pre` on the client.
|
1567 | *
|
1568 | * @deprecated Use this only as a temporary solution to migrate your component code to Svelte 5.
|
1569 | * */
|
1570 | export function run(fn: () => void | (() => void)): void;
|
1571 | /**
|
1572 | * Function to mimic the multiple listeners available in svelte 4
|
1573 | * @deprecated
|
1574 | * */
|
1575 | export function handlers(...handlers: EventListener[]): EventListener;
|
1576 | /**
|
1577 | * Function to create a `bubble` function that mimic the behavior of `on:click` without handler available in svelte 4.
|
1578 | * @deprecated Use this only as a temporary solution to migrate your automatically delegated events in Svelte 5.
|
1579 | */
|
1580 | export function createBubbler(): (type: string) => (event: Event) => boolean;
|
1581 | /**
|
1582 | * Substitute for the `trusted` event modifier
|
1583 | * @deprecated
|
1584 | * */
|
1585 | export function trusted(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1586 | /**
|
1587 | * Substitute for the `self` event modifier
|
1588 | * @deprecated
|
1589 | * */
|
1590 | export function self(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1591 | /**
|
1592 | * Substitute for the `stopPropagation` event modifier
|
1593 | * @deprecated
|
1594 | * */
|
1595 | export function stopPropagation(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1596 | /**
|
1597 | * Substitute for the `once` event modifier
|
1598 | * @deprecated
|
1599 | * */
|
1600 | export function once(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1601 | /**
|
1602 | * Substitute for the `stopImmediatePropagation` event modifier
|
1603 | * @deprecated
|
1604 | * */
|
1605 | export function stopImmediatePropagation(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1606 | /**
|
1607 | * Substitute for the `preventDefault` event modifier
|
1608 | * @deprecated
|
1609 | * */
|
1610 | export function preventDefault(fn: (event: Event, ...args: Array<unknown>) => void): (event: Event, ...args: unknown[]) => void;
|
1611 | /**
|
1612 | * Substitute for the `passive` event modifier, implemented as an action
|
1613 | * @deprecated
|
1614 | * */
|
1615 | export function passive(node: HTMLElement, [event, handler]: [event: string, handler: () => EventListener]): void;
|
1616 | /**
|
1617 | * Substitute for the `nonpassive` event modifier, implemented as an action
|
1618 | * @deprecated
|
1619 | * */
|
1620 | export function nonpassive(node: HTMLElement, [event, handler]: [event: string, handler: () => EventListener]): void;
|
1621 |
|
1622 | export {};
|
1623 | }
|
1624 |
|
1625 | declare module 'svelte/motion' {
|
1626 | export interface Spring<T> extends Readable<T> {
|
1627 | set: (new_value: T, opts?: SpringUpdateOpts) => Promise<void>;
|
1628 | update: (fn: Updater<T>, opts?: SpringUpdateOpts) => Promise<void>;
|
1629 | precision: number;
|
1630 | damping: number;
|
1631 | stiffness: number;
|
1632 | }
|
1633 |
|
1634 | export interface Tweened<T> extends Readable<T> {
|
1635 | set(value: T, opts?: TweenedOptions<T>): Promise<void>;
|
1636 | update(updater: Updater<T>, opts?: TweenedOptions<T>): Promise<void>;
|
1637 | }
|
1638 | /** Callback to inform of a value updates. */
|
1639 | type Subscriber<T> = (value: T) => void;
|
1640 |
|
1641 | /** Unsubscribes from value updates. */
|
1642 | type Unsubscriber = () => void;
|
1643 |
|
1644 | /** Readable interface for subscribing. */
|
1645 | interface Readable<T> {
|
1646 | /**
|
1647 | * Subscribe on value changes.
|
1648 | * @param run subscription callback
|
1649 | * @param invalidate cleanup callback
|
1650 | */
|
1651 | subscribe(this: void, run: Subscriber<T>, invalidate?: () => void): Unsubscriber;
|
1652 | }
|
1653 | interface SpringOpts {
|
1654 | stiffness?: number;
|
1655 | damping?: number;
|
1656 | precision?: number;
|
1657 | }
|
1658 |
|
1659 | interface SpringUpdateOpts {
|
1660 | hard?: any;
|
1661 | soft?: string | number | boolean;
|
1662 | }
|
1663 |
|
1664 | type Updater<T> = (target_value: T, value: T) => T;
|
1665 |
|
1666 | interface TweenedOptions<T> {
|
1667 | delay?: number;
|
1668 | duration?: number | ((from: T, to: T) => number);
|
1669 | easing?: (t: number) => number;
|
1670 | interpolate?: (a: T, b: T) => (t: number) => T;
|
1671 | }
|
1672 | /**
|
1673 | * The spring function in Svelte creates a store whose value is animated, with a motion that simulates the behavior of a spring. This means when the value changes, instead of transitioning at a steady rate, it "bounces" like a spring would, depending on the physics parameters provided. This adds a level of realism to the transitions and can enhance the user experience.
|
1674 | *
|
1675 | * */
|
1676 | export function spring<T = any>(value?: T | undefined, opts?: SpringOpts | undefined): Spring<T>;
|
1677 | /**
|
1678 | * A tweened store in Svelte is a special type of store that provides smooth transitions between state values over time.
|
1679 | *
|
1680 | * */
|
1681 | export function tweened<T>(value?: T | undefined, defaults?: TweenedOptions<T> | undefined): Tweened<T>;
|
1682 |
|
1683 | export {};
|
1684 | }
|
1685 |
|
1686 | declare module 'svelte/reactivity' {
|
1687 | export class SvelteDate extends Date {
|
1688 |
|
1689 | constructor(...params: any[]);
|
1690 | #private;
|
1691 | }
|
1692 | export class SvelteSet<T> extends Set<T> {
|
1693 |
|
1694 | constructor(value?: Iterable<T> | null | undefined);
|
1695 |
|
1696 | add(value: T): this;
|
1697 | #private;
|
1698 | }
|
1699 | export class SvelteMap<K, V> extends Map<K, V> {
|
1700 |
|
1701 | constructor(value?: Iterable<readonly [K, V]> | null | undefined);
|
1702 |
|
1703 | set(key: K, value: V): this;
|
1704 | #private;
|
1705 | }
|
1706 | export class SvelteURL extends URL {
|
1707 | get searchParams(): SvelteURLSearchParams;
|
1708 | #private;
|
1709 | }
|
1710 | const REPLACE: unique symbol;
|
1711 | export class SvelteURLSearchParams extends URLSearchParams {
|
1712 |
|
1713 | [REPLACE](params: URLSearchParams): void;
|
1714 | #private;
|
1715 | }
|
1716 |
|
1717 | export {};
|
1718 | }
|
1719 |
|
1720 | declare module 'svelte/server' {
|
1721 | import type { ComponentProps, Component, SvelteComponent, ComponentType } from 'svelte';
|
1722 | /**
|
1723 | * Only available on the server and when compiling with the `server` option.
|
1724 | * Takes a component and returns an object with `body` and `head` properties on it, which you can use to populate the HTML when server-rendering your app.
|
1725 | */
|
1726 | export function render<
|
1727 | Comp extends SvelteComponent<any> | Component<any>,
|
1728 | Props extends ComponentProps<Comp> = ComponentProps<Comp>
|
1729 | >(
|
1730 | ...args: {} extends Props
|
1731 | ? [
|
1732 | component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
|
1733 | options?: { props?: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
|
1734 | ]
|
1735 | : [
|
1736 | component: Comp extends SvelteComponent<any> ? ComponentType<Comp> : Comp,
|
1737 | options: { props: Omit<Props, '$$slots' | '$$events'>; context?: Map<any, any> }
|
1738 | ]
|
1739 | ): RenderOutput;
|
1740 | interface RenderOutput {
|
1741 | /** HTML that goes into the `<head>` */
|
1742 | head: string;
|
1743 | /** @deprecated use `body` instead */
|
1744 | html: string;
|
1745 | /** HTML that goes somewhere into the `<body>` */
|
1746 | body: string;
|
1747 | }
|
1748 |
|
1749 | export {};
|
1750 | }
|
1751 |
|
1752 | declare module 'svelte/store' {
|
1753 | /** Callback to inform of a value updates. */
|
1754 | export type Subscriber<T> = (value: T) => void;
|
1755 |
|
1756 | /** Unsubscribes from value updates. */
|
1757 | export type Unsubscriber = () => void;
|
1758 |
|
1759 | /** Callback to update a value. */
|
1760 | export type Updater<T> = (value: T) => T;
|
1761 |
|
1762 | /**
|
1763 | * Start and stop notification callbacks.
|
1764 | * This function is called when the first subscriber subscribes.
|
1765 | *
|
1766 | * @param set Function that sets the value of the store.
|
1767 | * @param update Function that sets the value of the store after passing the current value to the update function.
|
1768 | * @returns Optionally, a cleanup function that is called when the last remaining
|
1769 | * subscriber unsubscribes.
|
1770 | */
|
1771 | export type StartStopNotifier<T> = (
|
1772 | set: (value: T) => void,
|
1773 | update: (fn: Updater<T>) => void
|
1774 | ) => void | (() => void);
|
1775 |
|
1776 | /** Readable interface for subscribing. */
|
1777 | export interface Readable<T> {
|
1778 | /**
|
1779 | * Subscribe on value changes.
|
1780 | * @param run subscription callback
|
1781 | * @param invalidate cleanup callback
|
1782 | */
|
1783 | subscribe(this: void, run: Subscriber<T>, invalidate?: () => void): Unsubscriber;
|
1784 | }
|
1785 |
|
1786 | /** Writable interface for both updating and subscribing. */
|
1787 | export interface Writable<T> extends Readable<T> {
|
1788 | /**
|
1789 | * Set value and inform subscribers.
|
1790 | * @param value to set
|
1791 | */
|
1792 | set(this: void, value: T): void;
|
1793 |
|
1794 | /**
|
1795 | * Update value using callback and inform subscribers.
|
1796 | * @param updater callback
|
1797 | */
|
1798 | update(this: void, updater: Updater<T>): void;
|
1799 | }
|
1800 | export function toStore<V>(get: () => V, set: (v: V) => void): Writable<V>;
|
1801 |
|
1802 | export function toStore<V>(get: () => V): Readable<V>;
|
1803 |
|
1804 | export function fromStore<V>(store: Writable<V>): {
|
1805 | current: V;
|
1806 | };
|
1807 |
|
1808 | export function fromStore<V>(store: Readable<V>): {
|
1809 | readonly current: V;
|
1810 | };
|
1811 | /**
|
1812 | * Creates a `Readable` store that allows reading by subscription.
|
1813 | *
|
1814 | * @param value initial value
|
1815 | * */
|
1816 | export function readable<T>(value?: T | undefined, start?: StartStopNotifier<T> | undefined): Readable<T>;
|
1817 | /**
|
1818 | * Create a `Writable` store that allows both updating and reading by subscription.
|
1819 | *
|
1820 | * @param value initial value
|
1821 | * */
|
1822 | export function writable<T>(value?: T | undefined, start?: StartStopNotifier<T> | undefined): Writable<T>;
|
1823 | /**
|
1824 | * Derived value store by synchronizing one or more readable stores and
|
1825 | * applying an aggregation function over its input values.
|
1826 | *
|
1827 | * */
|
1828 | export function derived<S extends Stores, T>(stores: S, fn: (values: StoresValues<S>, set: (value: T) => void, update: (fn: Updater<T>) => void) => Unsubscriber | void, initial_value?: T | undefined): Readable<T>;
|
1829 | /**
|
1830 | * Derived value store by synchronizing one or more readable stores and
|
1831 | * applying an aggregation function over its input values.
|
1832 | *
|
1833 | * */
|
1834 | export function derived<S extends Stores, T>(stores: S, fn: (values: StoresValues<S>) => T, initial_value?: T | undefined): Readable<T>;
|
1835 | /**
|
1836 | * Takes a store and returns a new one derived from the old one that is readable.
|
1837 | *
|
1838 | * @param store - store to make readonly
|
1839 | * */
|
1840 | export function readonly<T>(store: Readable<T>): Readable<T>;
|
1841 | /**
|
1842 | * Get the current value from a store by subscribing and immediately unsubscribing.
|
1843 | *
|
1844 | * */
|
1845 | export function get<T>(store: Readable<T>): T;
|
1846 | /** One or more `Readable`s. */
|
1847 | type Stores = Readable<any> | [Readable<any>, ...Array<Readable<any>>] | Array<Readable<any>>;
|
1848 |
|
1849 | /** One or more values from `Readable` stores. */
|
1850 | type StoresValues<T> =
|
1851 | T extends Readable<infer U> ? U : { [K in keyof T]: T[K] extends Readable<infer U> ? U : never };
|
1852 |
|
1853 | export {};
|
1854 | }
|
1855 |
|
1856 | declare module 'svelte/transition' {
|
1857 | export type EasingFunction = (t: number) => number;
|
1858 |
|
1859 | export interface TransitionConfig {
|
1860 | delay?: number;
|
1861 | duration?: number;
|
1862 | easing?: EasingFunction;
|
1863 | css?: (t: number, u: number) => string;
|
1864 | tick?: (t: number, u: number) => void;
|
1865 | }
|
1866 |
|
1867 | export interface BlurParams {
|
1868 | delay?: number;
|
1869 | duration?: number;
|
1870 | easing?: EasingFunction;
|
1871 | amount?: number | string;
|
1872 | opacity?: number;
|
1873 | }
|
1874 |
|
1875 | export interface FadeParams {
|
1876 | delay?: number;
|
1877 | duration?: number;
|
1878 | easing?: EasingFunction;
|
1879 | }
|
1880 |
|
1881 | export interface FlyParams {
|
1882 | delay?: number;
|
1883 | duration?: number;
|
1884 | easing?: EasingFunction;
|
1885 | x?: number | string;
|
1886 | y?: number | string;
|
1887 | opacity?: number;
|
1888 | }
|
1889 |
|
1890 | export interface SlideParams {
|
1891 | delay?: number;
|
1892 | duration?: number;
|
1893 | easing?: EasingFunction;
|
1894 | axis?: 'x' | 'y';
|
1895 | }
|
1896 |
|
1897 | export interface ScaleParams {
|
1898 | delay?: number;
|
1899 | duration?: number;
|
1900 | easing?: EasingFunction;
|
1901 | start?: number;
|
1902 | opacity?: number;
|
1903 | }
|
1904 |
|
1905 | export interface DrawParams {
|
1906 | delay?: number;
|
1907 | speed?: number;
|
1908 | duration?: number | ((len: number) => number);
|
1909 | easing?: EasingFunction;
|
1910 | }
|
1911 |
|
1912 | export interface CrossfadeParams {
|
1913 | delay?: number;
|
1914 | duration?: number | ((len: number) => number);
|
1915 | easing?: EasingFunction;
|
1916 | }
|
1917 | /**
|
1918 | * Animates a `blur` filter alongside an element's opacity.
|
1919 | *
|
1920 | * */
|
1921 | export function blur(node: Element, { delay, duration, easing, amount, opacity }?: BlurParams | undefined): TransitionConfig;
|
1922 | /**
|
1923 | * Animates the opacity of an element from 0 to the current opacity for `in` transitions and from the current opacity to 0 for `out` transitions.
|
1924 | *
|
1925 | * */
|
1926 | export function fade(node: Element, { delay, duration, easing }?: FadeParams | undefined): TransitionConfig;
|
1927 | /**
|
1928 | * Animates the x and y positions and the opacity of an element. `in` transitions animate from the provided values, passed as parameters to the element's default values. `out` transitions animate from the element's default values to the provided values.
|
1929 | *
|
1930 | * */
|
1931 | export function fly(node: Element, { delay, duration, easing, x, y, opacity }?: FlyParams | undefined): TransitionConfig;
|
1932 | /**
|
1933 | * Slides an element in and out.
|
1934 | *
|
1935 | * */
|
1936 | export function slide(node: Element, { delay, duration, easing, axis }?: SlideParams | undefined): TransitionConfig;
|
1937 | /**
|
1938 | * Animates the opacity and scale of an element. `in` transitions animate from an element's current (default) values to the provided values, passed as parameters. `out` transitions animate from the provided values to an element's default values.
|
1939 | *
|
1940 | * */
|
1941 | export function scale(node: Element, { delay, duration, easing, start, opacity }?: ScaleParams | undefined): TransitionConfig;
|
1942 | /**
|
1943 | * Animates the stroke of an SVG element, like a snake in a tube. `in` transitions begin with the path invisible and draw the path to the screen over time. `out` transitions start in a visible state and gradually erase the path. `draw` only works with elements that have a `getTotalLength` method, like `<path>` and `<polyline>`.
|
1944 | *
|
1945 | * */
|
1946 | export function draw(node: SVGElement & {
|
1947 | getTotalLength(): number;
|
1948 | }, { delay, speed, duration, easing }?: DrawParams | undefined): TransitionConfig;
|
1949 | /**
|
1950 | * The `crossfade` function creates a pair of [transitions](https://svelte.dev/docs/svelte/transition) called `send` and `receive`. When an element is 'sent', it looks for a corresponding element being 'received', and generates a transition that transforms the element to its counterpart's position and fades it out. When an element is 'received', the reverse happens. If there is no counterpart, the `fallback` transition is used.
|
1951 | *
|
1952 | * */
|
1953 | export function crossfade({ fallback, ...defaults }: CrossfadeParams & {
|
1954 | fallback?: (node: Element, params: CrossfadeParams, intro: boolean) => TransitionConfig;
|
1955 | }): [(node: any, params: CrossfadeParams & {
|
1956 | key: any;
|
1957 | }) => () => TransitionConfig, (node: any, params: CrossfadeParams & {
|
1958 | key: any;
|
1959 | }) => () => TransitionConfig];
|
1960 |
|
1961 | export {};
|
1962 | }
|
1963 |
|
1964 | declare module 'svelte/events' {
|
1965 | // Once https://github.com/microsoft/TypeScript/issues/59980 is fixed we can put these overloads into the JSDoc comments of the `on` function
|
1966 |
|
1967 | /**
|
1968 | * Attaches an event handler to the window and returns a function that removes the handler. Using this
|
1969 | * rather than `addEventListener` will preserve the correct order relative to handlers added declaratively
|
1970 | * (with attributes like `onclick`), which use event delegation for performance reasons
|
1971 | */
|
1972 | export function on<Type extends keyof WindowEventMap>(
|
1973 | window: Window,
|
1974 | type: Type,
|
1975 | handler: (this: Window, event: WindowEventMap[Type]) => any,
|
1976 | options?: AddEventListenerOptions | undefined
|
1977 | ): () => void;
|
1978 | /**
|
1979 | * Attaches an event handler to the document and returns a function that removes the handler. Using this
|
1980 | * rather than `addEventListener` will preserve the correct order relative to handlers added declaratively
|
1981 | * (with attributes like `onclick`), which use event delegation for performance reasons
|
1982 | */
|
1983 | export function on<Type extends keyof DocumentEventMap>(
|
1984 | document: Document,
|
1985 | type: Type,
|
1986 | handler: (this: Document, event: DocumentEventMap[Type]) => any,
|
1987 | options?: AddEventListenerOptions | undefined
|
1988 | ): () => void;
|
1989 | /**
|
1990 | * Attaches an event handler to an element and returns a function that removes the handler. Using this
|
1991 | * rather than `addEventListener` will preserve the correct order relative to handlers added declaratively
|
1992 | * (with attributes like `onclick`), which use event delegation for performance reasons
|
1993 | */
|
1994 | export function on<Element extends HTMLElement, Type extends keyof HTMLElementEventMap>(
|
1995 | element: Element,
|
1996 | type: Type,
|
1997 | handler: (this: Element, event: HTMLElementEventMap[Type]) => any,
|
1998 | options?: AddEventListenerOptions | undefined
|
1999 | ): () => void;
|
2000 | /**
|
2001 | * Attaches an event handler to an element and returns a function that removes the handler. Using this
|
2002 | * rather than `addEventListener` will preserve the correct order relative to handlers added declaratively
|
2003 | * (with attributes like `onclick`), which use event delegation for performance reasons
|
2004 | */
|
2005 | export function on<Element extends MediaQueryList, Type extends keyof MediaQueryListEventMap>(
|
2006 | element: Element,
|
2007 | type: Type,
|
2008 | handler: (this: Element, event: MediaQueryListEventMap[Type]) => any,
|
2009 | options?: AddEventListenerOptions | undefined
|
2010 | ): () => void;
|
2011 | /**
|
2012 | * Attaches an event handler to an element and returns a function that removes the handler. Using this
|
2013 | * rather than `addEventListener` will preserve the correct order relative to handlers added declaratively
|
2014 | * (with attributes like `onclick`), which use event delegation for performance reasons
|
2015 | */
|
2016 | export function on(
|
2017 | element: EventTarget,
|
2018 | type: string,
|
2019 | handler: EventListener,
|
2020 | options?: AddEventListenerOptions | undefined
|
2021 | ): () => void;
|
2022 |
|
2023 | export {};
|
2024 | }
|
2025 |
|
2026 | declare module 'svelte/types/compiler/preprocess' {
|
2027 | /** @deprecated import this from 'svelte/preprocess' instead */
|
2028 | export type MarkupPreprocessor = MarkupPreprocessor_1;
|
2029 | /** @deprecated import this from 'svelte/preprocess' instead */
|
2030 | export type Preprocessor = Preprocessor_1;
|
2031 | /** @deprecated import this from 'svelte/preprocess' instead */
|
2032 | export type PreprocessorGroup = PreprocessorGroup_1;
|
2033 | /** @deprecated import this from 'svelte/preprocess' instead */
|
2034 | export type Processed = Processed_1;
|
2035 | /** @deprecated import this from 'svelte/preprocess' instead */
|
2036 | export type SveltePreprocessor<PreprocessorType extends keyof PreprocessorGroup_1, Options = any> = SveltePreprocessor_1<
|
2037 | PreprocessorType,
|
2038 | Options
|
2039 | >;
|
2040 | /**
|
2041 | * The result of a preprocessor run. If the preprocessor does not return a result, it is assumed that the code is unchanged.
|
2042 | */
|
2043 | interface Processed_1 {
|
2044 | /**
|
2045 | * The new code
|
2046 | */
|
2047 | code: string;
|
2048 | /**
|
2049 | * A source map mapping back to the original code
|
2050 | */
|
2051 | map?: string | object; // we are opaque with the type here to avoid dependency on the remapping module for our public types.
|
2052 | /**
|
2053 | * A list of additional files to watch for changes
|
2054 | */
|
2055 | dependencies?: string[];
|
2056 | /**
|
2057 | * Only for script/style preprocessors: The updated attributes to set on the tag. If undefined, attributes stay unchanged.
|
2058 | */
|
2059 | attributes?: Record<string, string | boolean>;
|
2060 | toString?: () => string;
|
2061 | }
|
2062 |
|
2063 | /**
|
2064 | * A markup preprocessor that takes a string of code and returns a processed version.
|
2065 | */
|
2066 | type MarkupPreprocessor_1 = (options: {
|
2067 | /**
|
2068 | * The whole Svelte file content
|
2069 | */
|
2070 | content: string;
|
2071 | /**
|
2072 | * The filename of the Svelte file
|
2073 | */
|
2074 | filename?: string;
|
2075 | }) => Processed_1 | void | Promise<Processed_1 | void>;
|
2076 |
|
2077 | /**
|
2078 | * A script/style preprocessor that takes a string of code and returns a processed version.
|
2079 | */
|
2080 | type Preprocessor_1 = (options: {
|
2081 | /**
|
2082 | * The script/style tag content
|
2083 | */
|
2084 | content: string;
|
2085 | /**
|
2086 | * The attributes on the script/style tag
|
2087 | */
|
2088 | attributes: Record<string, string | boolean>;
|
2089 | /**
|
2090 | * The whole Svelte file content
|
2091 | */
|
2092 | markup: string;
|
2093 | /**
|
2094 | * The filename of the Svelte file
|
2095 | */
|
2096 | filename?: string;
|
2097 | }) => Processed_1 | void | Promise<Processed_1 | void>;
|
2098 |
|
2099 | /**
|
2100 | * A preprocessor group is a set of preprocessors that are applied to a Svelte file.
|
2101 | */
|
2102 | interface PreprocessorGroup_1 {
|
2103 | /** Name of the preprocessor. Will be a required option in the next major version */
|
2104 | name?: string;
|
2105 | markup?: MarkupPreprocessor_1;
|
2106 | style?: Preprocessor_1;
|
2107 | script?: Preprocessor_1;
|
2108 | }
|
2109 |
|
2110 | /**
|
2111 | * @description Utility type to extract the type of a preprocessor from a preprocessor group
|
2112 | * @deprecated Create this utility type yourself instead
|
2113 | */
|
2114 | interface SveltePreprocessor_1<
|
2115 | PreprocessorType extends keyof PreprocessorGroup_1,
|
2116 | Options = any
|
2117 | > {
|
2118 | (options?: Options): Required<Pick<PreprocessorGroup_1, PreprocessorType>>;
|
2119 | }
|
2120 |
|
2121 | export {};
|
2122 | }
|
2123 |
|
2124 | declare module 'svelte/types/compiler/interfaces' {
|
2125 | import type { Location } from 'locate-character';
|
2126 | /** @deprecated import this from 'svelte' instead */
|
2127 | export type CompileOptions = CompileOptions_1;
|
2128 | /** @deprecated import this from 'svelte' instead */
|
2129 | export type Warning = Warning_1;
|
2130 | interface Warning_1 extends ICompileDiagnostic {}
|
2131 |
|
2132 | type CssHashGetter = (args: {
|
2133 | name: string;
|
2134 | filename: string;
|
2135 | css: string;
|
2136 | hash: (input: string) => string;
|
2137 | }) => string;
|
2138 |
|
2139 | interface CompileOptions_1 extends ModuleCompileOptions {
|
2140 | /**
|
2141 | * Sets the name of the resulting JavaScript class (though the compiler will rename it if it would otherwise conflict with other variables in scope).
|
2142 | * If unspecified, will be inferred from `filename`
|
2143 | */
|
2144 | name?: string;
|
2145 | /**
|
2146 | * If `true`, tells the compiler to generate a custom element constructor instead of a regular Svelte component.
|
2147 | *
|
2148 | * @default false
|
2149 | */
|
2150 | customElement?: boolean;
|
2151 | /**
|
2152 | * If `true`, getters and setters will be created for the component's props. If `false`, they will only be created for readonly exported values (i.e. those declared with `const`, `class` and `function`). If compiling with `customElement: true` this option defaults to `true`.
|
2153 | *
|
2154 | * @default false
|
2155 | * @deprecated This will have no effect in runes mode
|
2156 | */
|
2157 | accessors?: boolean;
|
2158 | /**
|
2159 | * The namespace of the element; e.g., `"html"`, `"svg"`, `"mathml"`.
|
2160 | *
|
2161 | * @default 'html'
|
2162 | */
|
2163 | namespace?: Namespace;
|
2164 | /**
|
2165 | * If `true`, tells the compiler that you promise not to mutate any objects.
|
2166 | * This allows it to be less conservative about checking whether values have changed.
|
2167 | *
|
2168 | * @default false
|
2169 | * @deprecated This will have no effect in runes mode
|
2170 | */
|
2171 | immutable?: boolean;
|
2172 | /**
|
2173 | * - `'injected'`: styles will be included in the `head` when using `render(...)`, and injected into the document (if not already present) when the component mounts. For components compiled as custom elements, styles are injected to the shadow root.
|
2174 | * - `'external'`: the CSS will only be returned in the `css` field of the compilation result. Most Svelte bundler plugins will set this to `'external'` and use the CSS that is statically generated for better performance, as it will result in smaller JavaScript bundles and the output can be served as cacheable `.css` files.
|
2175 | * This is always `'injected'` when compiling with `customElement` mode.
|
2176 | */
|
2177 | css?: 'injected' | 'external';
|
2178 | /**
|
2179 | * A function that takes a `{ hash, css, name, filename }` argument and returns the string that is used as a classname for scoped CSS.
|
2180 | * It defaults to returning `svelte-${hash(css)}`.
|
2181 | *
|
2182 | * @default undefined
|
2183 | */
|
2184 | cssHash?: CssHashGetter;
|
2185 | /**
|
2186 | * If `true`, your HTML comments will be preserved in the output. By default, they are stripped out.
|
2187 | *
|
2188 | * @default false
|
2189 | */
|
2190 | preserveComments?: boolean;
|
2191 | /**
|
2192 | * If `true`, whitespace inside and between elements is kept as you typed it, rather than removed or collapsed to a single space where possible.
|
2193 | *
|
2194 | * @default false
|
2195 | */
|
2196 | preserveWhitespace?: boolean;
|
2197 | /**
|
2198 | * Set to `true` to force the compiler into runes mode, even if there are no indications of runes usage.
|
2199 | * Set to `false` to force the compiler into ignoring runes, even if there are indications of runes usage.
|
2200 | * Set to `undefined` (the default) to infer runes mode from the component code.
|
2201 | * Is always `true` for JS/TS modules compiled with Svelte.
|
2202 | * Will be `true` by default in Svelte 6.
|
2203 | * Note that setting this to `true` in your `svelte.config.js` will force runes mode for your entire project, including components in `node_modules`,
|
2204 | * which is likely not what you want. If you're using Vite, consider using [dynamicCompileOptions](https://github.com/sveltejs/vite-plugin-svelte/blob/main/docs/config.md#dynamiccompileoptions) instead.
|
2205 | * @default undefined
|
2206 | */
|
2207 | runes?: boolean | undefined;
|
2208 | /**
|
2209 | * If `true`, exposes the Svelte major version in the browser by adding it to a `Set` stored in the global `window.__svelte.v`.
|
2210 | *
|
2211 | * @default true
|
2212 | */
|
2213 | discloseVersion?: boolean;
|
2214 | /**
|
2215 | * @deprecated Use these only as a temporary solution before migrating your code
|
2216 | */
|
2217 | compatibility?: {
|
2218 | /**
|
2219 | * Applies a transformation so that the default export of Svelte files can still be instantiated the same way as in Svelte 4 —
|
2220 | * as a class when compiling for the browser (as though using `createClassComponent(MyComponent, {...})` from `svelte/legacy`)
|
2221 | * or as an object with a `.render(...)` method when compiling for the server
|
2222 | * @default 5
|
2223 | */
|
2224 | componentApi?: 4 | 5;
|
2225 | };
|
2226 | /**
|
2227 | * An initial sourcemap that will be merged into the final output sourcemap.
|
2228 | * This is usually the preprocessor sourcemap.
|
2229 | *
|
2230 | * @default null
|
2231 | */
|
2232 | sourcemap?: object | string;
|
2233 | /**
|
2234 | * Used for your JavaScript sourcemap.
|
2235 | *
|
2236 | * @default null
|
2237 | */
|
2238 | outputFilename?: string;
|
2239 | /**
|
2240 | * Used for your CSS sourcemap.
|
2241 | *
|
2242 | * @default null
|
2243 | */
|
2244 | cssOutputFilename?: string;
|
2245 | /**
|
2246 | * If `true`, compiles components with hot reloading support.
|
2247 | *
|
2248 | * @default false
|
2249 | */
|
2250 | hmr?: boolean;
|
2251 | /**
|
2252 | * If `true`, returns the modern version of the AST.
|
2253 | * Will become `true` by default in Svelte 6, and the option will be removed in Svelte 7.
|
2254 | *
|
2255 | * @default false
|
2256 | */
|
2257 | modernAst?: boolean;
|
2258 | }
|
2259 |
|
2260 | interface ModuleCompileOptions {
|
2261 | /**
|
2262 | * If `true`, causes extra code to be added that will perform runtime checks and provide debugging information during development.
|
2263 | *
|
2264 | * @default false
|
2265 | */
|
2266 | dev?: boolean;
|
2267 | /**
|
2268 | * If `"client"`, Svelte emits code designed to run in the browser.
|
2269 | * If `"server"`, Svelte emits code suitable for server-side rendering.
|
2270 | * If `false`, nothing is generated. Useful for tooling that is only interested in warnings.
|
2271 | *
|
2272 | * @default 'client'
|
2273 | */
|
2274 | generate?: 'client' | 'server' | false;
|
2275 | /**
|
2276 | * Used for debugging hints and sourcemaps. Your bundler plugin will set it automatically.
|
2277 | */
|
2278 | filename?: string;
|
2279 | /**
|
2280 | * Used for ensuring filenames don't leak filesystem information. Your bundler plugin will set it automatically.
|
2281 | * @default process.cwd() on node-like environments, undefined elsewhere
|
2282 | */
|
2283 | rootDir?: string;
|
2284 | /**
|
2285 | * A function that gets a `Warning` as an argument and returns a boolean.
|
2286 | * Use this to filter out warnings. Return `true` to keep the warning, `false` to discard it.
|
2287 | */
|
2288 | warningFilter?: (warning: Warning_1) => boolean;
|
2289 | }
|
2290 | /**
|
2291 | * - `html` — the default, for e.g. `<div>` or `<span>`
|
2292 | * - `svg` — for e.g. `<svg>` or `<g>`
|
2293 | * - `mathml` — for e.g. `<math>` or `<mrow>`
|
2294 | */
|
2295 | type Namespace = 'html' | 'svg' | 'mathml';
|
2296 | type ICompileDiagnostic = {
|
2297 | code: string;
|
2298 | message: string;
|
2299 | stack?: string;
|
2300 | filename?: string;
|
2301 | start?: Location;
|
2302 | end?: Location;
|
2303 | position?: [number, number];
|
2304 | frame?: string;
|
2305 | };
|
2306 |
|
2307 | export {};
|
2308 | }declare module '*.svelte' {
|
2309 | // use prettier-ignore for a while because of https://github.com/sveltejs/language-tools/commit/026111228b5814a9109cc4d779d37fb02955fb8b
|
2310 | // prettier-ignore
|
2311 | import { SvelteComponent, Component, type ComponentConstructorOptions } from 'svelte'
|
2312 |
|
2313 | // Support using the component as both a class and function during the transition period
|
2314 | // prettier-ignore
|
2315 | interface ComponentType {
|
2316 | (
|
2317 | ...args: Parameters<Component<Record<string, any>>>
|
2318 | ): ReturnType<Component<Record<string, any>, Record<string, any>>>
|
2319 | new (o: ComponentConstructorOptions): SvelteComponent
|
2320 | }
|
2321 | const Comp: ComponentType;
|
2322 | type Comp = SvelteComponent;
|
2323 | export default Comp;
|
2324 | }
|
2325 |
|
2326 | /**
|
2327 | * Declares reactive state.
|
2328 | *
|
2329 | * Example:
|
2330 | * ```ts
|
2331 | * let count = $state(0);
|
2332 | * ```
|
2333 | *
|
2334 | * https://svelte.dev/docs/svelte/$state
|
2335 | *
|
2336 | * @param initial The initial value
|
2337 | */
|
2338 | declare function $state<T>(initial: T): T;
|
2339 | declare function $state<T>(): T | undefined;
|
2340 |
|
2341 | declare namespace $state {
|
2342 | type Primitive = string | number | boolean | null | undefined;
|
2343 |
|
2344 | type TypedArray =
|
2345 | | Int8Array
|
2346 | | Uint8Array
|
2347 | | Uint8ClampedArray
|
2348 | | Int16Array
|
2349 | | Uint16Array
|
2350 | | Int32Array
|
2351 | | Uint32Array
|
2352 | | Float32Array
|
2353 | | Float64Array
|
2354 | | BigInt64Array
|
2355 | | BigUint64Array;
|
2356 |
|
2357 | /** The things that `structuredClone` can handle — https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm */
|
2358 | export type Cloneable =
|
2359 | | ArrayBuffer
|
2360 | | DataView
|
2361 | | Date
|
2362 | | Error
|
2363 | | Map<any, any>
|
2364 | | RegExp
|
2365 | | Set<any>
|
2366 | | TypedArray
|
2367 | // web APIs
|
2368 | | Blob
|
2369 | | CryptoKey
|
2370 | | DOMException
|
2371 | | DOMMatrix
|
2372 | | DOMMatrixReadOnly
|
2373 | | DOMPoint
|
2374 | | DOMPointReadOnly
|
2375 | | DOMQuad
|
2376 | | DOMRect
|
2377 | | DOMRectReadOnly
|
2378 | | File
|
2379 | | FileList
|
2380 | | FileSystemDirectoryHandle
|
2381 | | FileSystemFileHandle
|
2382 | | FileSystemHandle
|
2383 | | ImageBitmap
|
2384 | | ImageData
|
2385 | | RTCCertificate
|
2386 | | VideoFrame;
|
2387 |
|
2388 | /** Turn `SvelteDate`, `SvelteMap` and `SvelteSet` into their non-reactive counterparts. (`URL` is uncloneable.) */
|
2389 | type NonReactive<T> = T extends Date
|
2390 | ? Date
|
2391 | : T extends Map<infer K, infer V>
|
2392 | ? Map<K, V>
|
2393 | : T extends Set<infer K>
|
2394 | ? Set<K>
|
2395 | : T;
|
2396 |
|
2397 | type Snapshot<T> = T extends Primitive
|
2398 | ? T
|
2399 | : T extends Cloneable
|
2400 | ? NonReactive<T>
|
2401 | : T extends { toJSON(): infer R }
|
2402 | ? R
|
2403 | : T extends Array<infer U>
|
2404 | ? Array<Snapshot<U>>
|
2405 | : T extends object
|
2406 | ? T extends { [key: string]: any }
|
2407 | ? { [K in keyof T]: Snapshot<T[K]> }
|
2408 | : never
|
2409 | : never;
|
2410 |
|
2411 | /**
|
2412 | * Declares state that is _not_ made deeply reactive — instead of mutating it,
|
2413 | * you must reassign it.
|
2414 | *
|
2415 | * Example:
|
2416 | * ```ts
|
2417 | * <script>
|
2418 | * let items = $state.raw([0]);
|
2419 | *
|
2420 | * const addItem = () => {
|
2421 | * items = [...items, items.length];
|
2422 | * };
|
2423 | * </script>
|
2424 | *
|
2425 | * <button on:click={addItem}>
|
2426 | * {items.join(', ')}
|
2427 | * </button>
|
2428 | * ```
|
2429 | *
|
2430 | * https://svelte.dev/docs/svelte/$state#$state.raw
|
2431 | *
|
2432 | * @param initial The initial value
|
2433 | */
|
2434 | export function raw<T>(initial: T): T;
|
2435 | export function raw<T>(): T | undefined;
|
2436 | /**
|
2437 | * To take a static snapshot of a deeply reactive `$state` proxy, use `$state.snapshot`:
|
2438 | *
|
2439 | * Example:
|
2440 | * ```ts
|
2441 | * <script>
|
2442 | * let counter = $state({ count: 0 });
|
2443 | *
|
2444 | * function onclick() {
|
2445 | * // Will log `{ count: ... }` rather than `Proxy { ... }`
|
2446 | * console.log($state.snapshot(counter));
|
2447 | * };
|
2448 | * </script>
|
2449 | * ```
|
2450 | *
|
2451 | * https://svelte.dev/docs/svelte/$state#$state.snapshot
|
2452 | *
|
2453 | * @param state The value to snapshot
|
2454 | */
|
2455 | export function snapshot<T>(state: T): Snapshot<T>;
|
2456 |
|
2457 | // prevent intellisense from being unhelpful
|
2458 | /** @deprecated */
|
2459 | export const apply: never;
|
2460 | /** @deprecated */
|
2461 | // @ts-ignore
|
2462 | export const arguments: never;
|
2463 | /** @deprecated */
|
2464 | export const bind: never;
|
2465 | /** @deprecated */
|
2466 | export const call: never;
|
2467 | /** @deprecated */
|
2468 | export const caller: never;
|
2469 | /** @deprecated */
|
2470 | export const length: never;
|
2471 | /** @deprecated */
|
2472 | export const name: never;
|
2473 | /** @deprecated */
|
2474 | export const prototype: never;
|
2475 | /** @deprecated */
|
2476 | export const toString: never;
|
2477 | }
|
2478 |
|
2479 | /**
|
2480 | * Declares derived state, i.e. one that depends on other state variables.
|
2481 | * The expression inside `$derived(...)` should be free of side-effects.
|
2482 | *
|
2483 | * Example:
|
2484 | * ```ts
|
2485 | * let double = $derived(count * 2);
|
2486 | * ```
|
2487 | *
|
2488 | * https://svelte.dev/docs/svelte/$derived
|
2489 | *
|
2490 | * @param expression The derived state expression
|
2491 | */
|
2492 | declare function $derived<T>(expression: T): T;
|
2493 |
|
2494 | declare namespace $derived {
|
2495 | /**
|
2496 | * Sometimes you need to create complex derivations that don't fit inside a short expression.
|
2497 | * In these cases, you can use `$derived.by` which accepts a function as its argument.
|
2498 | *
|
2499 | * Example:
|
2500 | * ```ts
|
2501 | * let total = $derived.by(() => {
|
2502 | * let result = 0;
|
2503 | * for (const n of numbers) {
|
2504 | * result += n;
|
2505 | * }
|
2506 | * return result;
|
2507 | * });
|
2508 | * ```
|
2509 | *
|
2510 | * https://svelte.dev/docs/svelte/$derived#$derived.by
|
2511 | */
|
2512 | export function by<T>(fn: () => T): T;
|
2513 |
|
2514 | // prevent intellisense from being unhelpful
|
2515 | /** @deprecated */
|
2516 | export const apply: never;
|
2517 | /** @deprecated */
|
2518 | // @ts-ignore
|
2519 | export const arguments: never;
|
2520 | /** @deprecated */
|
2521 | export const bind: never;
|
2522 | /** @deprecated */
|
2523 | export const call: never;
|
2524 | /** @deprecated */
|
2525 | export const caller: never;
|
2526 | /** @deprecated */
|
2527 | export const length: never;
|
2528 | /** @deprecated */
|
2529 | export const name: never;
|
2530 | /** @deprecated */
|
2531 | export const prototype: never;
|
2532 | /** @deprecated */
|
2533 | export const toString: never;
|
2534 | }
|
2535 |
|
2536 | /**
|
2537 | * Runs code when a component is mounted to the DOM, and then whenever its dependencies change, i.e. `$state` or `$derived` values.
|
2538 | * The timing of the execution is after the DOM has been updated.
|
2539 | *
|
2540 | * Example:
|
2541 | * ```ts
|
2542 | * $effect(() => console.log('The count is now ' + count));
|
2543 | * ```
|
2544 | *
|
2545 | * If you return a function from the effect, it will be called right before the effect is run again, or when the component is unmounted.
|
2546 | *
|
2547 | * Does not run during server side rendering.
|
2548 | *
|
2549 | * https://svelte.dev/docs/svelte/$effect
|
2550 | * @param fn The function to execute
|
2551 | */
|
2552 | declare function $effect(fn: () => void | (() => void)): void;
|
2553 |
|
2554 | declare namespace $effect {
|
2555 | /**
|
2556 | * Runs code right before a component is mounted to the DOM, and then whenever its dependencies change, i.e. `$state` or `$derived` values.
|
2557 | * The timing of the execution is right before the DOM is updated.
|
2558 | *
|
2559 | * Example:
|
2560 | * ```ts
|
2561 | * $effect.pre(() => console.log('The count is now ' + count));
|
2562 | * ```
|
2563 | *
|
2564 | * If you return a function from the effect, it will be called right before the effect is run again, or when the component is unmounted.
|
2565 | *
|
2566 | * Does not run during server side rendering.
|
2567 | *
|
2568 | * https://svelte.dev/docs/svelte/$effect#$effect.pre
|
2569 | * @param fn The function to execute
|
2570 | */
|
2571 | export function pre(fn: () => void | (() => void)): void;
|
2572 |
|
2573 | /**
|
2574 | * The `$effect.tracking` rune is an advanced feature that tells you whether or not the code is running inside a tracking context, such as an effect or inside your template.
|
2575 | *
|
2576 | * Example:
|
2577 | * ```svelte
|
2578 | * <script>
|
2579 | * console.log('in component setup:', $effect.tracking()); // false
|
2580 | *
|
2581 | * $effect(() => {
|
2582 | * console.log('in effect:', $effect.tracking()); // true
|
2583 | * });
|
2584 | * </script>
|
2585 | *
|
2586 | * <p>in template: {$effect.tracking()}</p> <!-- true -->
|
2587 | * ```
|
2588 | *
|
2589 | * This allows you to (for example) add things like subscriptions without causing memory leaks, by putting them in child effects.
|
2590 | *
|
2591 | * https://svelte.dev/docs/svelte/$effect#$effect.tracking
|
2592 | */
|
2593 | export function tracking(): boolean;
|
2594 |
|
2595 | /**
|
2596 | * The `$effect.root` rune is an advanced feature that creates a non-tracked scope that doesn't auto-cleanup. This is useful for
|
2597 | * nested effects that you want to manually control. This rune also allows for creation of effects outside of the component
|
2598 | * initialisation phase.
|
2599 | *
|
2600 | * Example:
|
2601 | * ```svelte
|
2602 | * <script>
|
2603 | * let count = $state(0);
|
2604 | *
|
2605 | * const cleanup = $effect.root(() => {
|
2606 | * $effect(() => {
|
2607 | * console.log(count);
|
2608 | * })
|
2609 | *
|
2610 | * return () => {
|
2611 | * console.log('effect root cleanup');
|
2612 | * }
|
2613 | * });
|
2614 | * </script>
|
2615 | *
|
2616 | * <button onclick={() => cleanup()}>cleanup</button>
|
2617 | * ```
|
2618 | *
|
2619 | * https://svelte.dev/docs/svelte/$effect#$effect.root
|
2620 | */
|
2621 | export function root(fn: () => void | (() => void)): () => void;
|
2622 |
|
2623 | // prevent intellisense from being unhelpful
|
2624 | /** @deprecated */
|
2625 | export const apply: never;
|
2626 | /** @deprecated */
|
2627 | // @ts-ignore
|
2628 | export const arguments: never;
|
2629 | /** @deprecated */
|
2630 | export const bind: never;
|
2631 | /** @deprecated */
|
2632 | export const call: never;
|
2633 | /** @deprecated */
|
2634 | export const caller: never;
|
2635 | /** @deprecated */
|
2636 | export const length: never;
|
2637 | /** @deprecated */
|
2638 | export const name: never;
|
2639 | /** @deprecated */
|
2640 | export const prototype: never;
|
2641 | /** @deprecated */
|
2642 | export const toString: never;
|
2643 | }
|
2644 |
|
2645 | /**
|
2646 | * Declares the props that a component accepts. Example:
|
2647 | *
|
2648 | * ```ts
|
2649 | * let { optionalProp = 42, requiredProp, bindableProp = $bindable() }: { optionalProp?: number; requiredProps: string; bindableProp: boolean } = $props();
|
2650 | * ```
|
2651 | *
|
2652 | * https://svelte.dev/docs/svelte/$props
|
2653 | */
|
2654 | declare function $props(): any;
|
2655 |
|
2656 | /**
|
2657 | * Declares a prop as bindable, meaning the parent component can use `bind:propName={value}` to bind to it.
|
2658 | *
|
2659 | * ```ts
|
2660 | * let { propName = $bindable() }: { propName: boolean } = $props();
|
2661 | * ```
|
2662 | *
|
2663 | * https://svelte.dev/docs/svelte/$bindable
|
2664 | */
|
2665 | declare function $bindable<T>(fallback?: T): T;
|
2666 |
|
2667 | /**
|
2668 | * Inspects one or more values whenever they, or the properties they contain, change. Example:
|
2669 | *
|
2670 | * ```ts
|
2671 | * $inspect(someValue, someOtherValue)
|
2672 | * ```
|
2673 | *
|
2674 | * `$inspect` returns a `with` function, which you can invoke with a callback function that
|
2675 | * will be called with the value and the event type (`'init'` or `'update'`) on every change.
|
2676 | * By default, the values will be logged to the console.
|
2677 | *
|
2678 | * ```ts
|
2679 | * $inspect(x).with(console.trace);
|
2680 | * $inspect(x, y).with(() => { debugger; });
|
2681 | * ```
|
2682 | *
|
2683 | * https://svelte.dev/docs/svelte/$inspect
|
2684 | */
|
2685 | declare function $inspect<T extends any[]>(
|
2686 | ...values: T
|
2687 | ): { with: (fn: (type: 'init' | 'update', ...values: T) => void) => void };
|
2688 |
|
2689 | /**
|
2690 | * Retrieves the `this` reference of the custom element that contains this component. Example:
|
2691 | *
|
2692 | * ```svelte
|
2693 | * <svelte:options customElement="my-element" />
|
2694 | *
|
2695 | * <script>
|
2696 | * function greet(greeting) {
|
2697 | * $host().dispatchEvent(new CustomEvent('greeting', { detail: greeting }))
|
2698 | * }
|
2699 | * </script>
|
2700 | *
|
2701 | * <button onclick={() => greet('hello')}>say hello</button>
|
2702 | * ```
|
2703 | *
|
2704 | * Only available inside custom element components, and only on the client-side.
|
2705 | *
|
2706 | * https://svelte.dev/docs/svelte/$host
|
2707 | */
|
2708 | declare function $host<El extends HTMLElement = HTMLElement>(): El;
|
2709 |
|
2710 | //# sourceMappingURL=index.d.ts.map |
\ | No newline at end of file |