From 2218b1e97fe82d63f754f7383e85656f416cc4cd Mon Sep 17 00:00:00 2001 From: Elliott Johnson Date: Thu, 13 Nov 2025 16:21:09 -0700 Subject: [PATCH] types --- packages/svelte/src/index.d.ts | 1 + packages/svelte/types/index.d.ts | 98 ++++++++++++++++---------------- 2 files changed, 50 insertions(+), 49 deletions(-) diff --git a/packages/svelte/src/index.d.ts b/packages/svelte/src/index.d.ts index a1782f5b61..42507385d6 100644 --- a/packages/svelte/src/index.d.ts +++ b/packages/svelte/src/index.d.ts @@ -369,3 +369,4 @@ export interface Fork { } export * from './index-client.js'; +export { Hydratable, Transport, Encode, Decode } from '#shared'; diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts index 616d209be2..81700ae95b 100644 --- a/packages/svelte/types/index.d.ts +++ b/packages/svelte/types/index.d.ts @@ -450,6 +450,55 @@ declare module 'svelte' { * @deprecated Use [`$effect`](https://svelte.dev/docs/svelte/$effect) instead * */ export function afterUpdate(fn: () => void): void; + type Getters = { + [K in keyof T]: () => T[K]; + }; + + /** Decode a value. The value will be whatever the evaluated JavaScript emitted by the corresponding {@link Encode} function evaluates to. */ + export type Decode = (value: any) => T; + + /** Encode a value as a string. The string should be _valid JavaScript code_ -- for example, the output of `devalue`'s `uneval` function. */ + export type Encode = (value: T) => string; + + /** + * Custom encode and decode options. This must be used in combination with an environment variable to enable treeshaking, eg: + * ```ts + * import { BROWSER } from 'esm-env'; + * const transport: Transport = BROWSER ? { decode: myDecodeFunction } : { encode: myEncodeFunction }; + * ``` + */ + export type Transport = + | { + encode: Encode; + decode?: undefined; + } + | { + encode?: undefined; + decode: Decode; + }; + + /** Make the result of a function hydratable. This means it will be serialized on the server and available synchronously during hydration on the client. */ + export type Hydratable = { + ( + /** + * A key to identify this hydratable value. Each hydratable value must have a unique key. + * If writing a library that utilizes `hydratable`, prefix your keys with your library name to prevent naming collisions. + */ + key: string, + /** + * A function that returns the value to be hydrated. On the server, this value will be stashed and serialized. + * On the client during hydration, the value will be used synchronously instead of invoking the function. + */ + fn: () => T, + options?: { transport?: Transport } + ): T; + /** Get a hydratable value from the server-rendered store. If used after hydration, will always return `undefined`. Only works on the client. */ + get: (key: string, options?: { decode?: Decode }) => T | undefined; + /** Check if a hydratable value exists in the server-rendered store. */ + has: (key: string) => boolean; + /** Set a hydratable value. Only works on the server during `render`. */ + set: (key: string, value: T, options?: { encode?: Encode }) => void; + }; export const hydratable: Hydratable; /** * Create a snippet programmatically @@ -592,55 +641,6 @@ declare module 'svelte' { * ``` * */ export function untrack(fn: () => T): T; - type Getters = { - [K in keyof T]: () => T[K]; - }; - - /** Decode a value. The value will be whatever the evaluated JavaScript emitted by the corresponding {@link Encode} function evaluates to. */ - type Decode = (value: any) => T; - - /** Encode a value as a string. The string should be _valid JavaScript code_ -- for example, the output of `devalue`'s `uneval` function. */ - type Encode = (value: T) => string; - - /** - * Custom encode and decode options. This must be used in combination with an environment variable to enable treeshaking, eg: - * ```ts - * import { BROWSER } from 'esm-env'; - * const transport: Transport = BROWSER ? { decode: myDecodeFunction } : { encode: myEncodeFunction }; - * ``` - */ - type Transport = - | { - encode: Encode; - decode?: undefined; - } - | { - encode?: undefined; - decode: Decode; - }; - - /** Make the result of a function hydratable. This means it will be serialized on the server and available synchronously during hydration on the client. */ - type Hydratable = { - ( - /** - * A key to identify this hydratable value. Each hydratable value must have a unique key. - * If writing a library that utilizes `hydratable`, prefix your keys with your library name to prevent naming collisions. - */ - key: string, - /** - * A function that returns the value to be hydrated. On the server, this value will be stashed and serialized. - * On the client during hydration, the value will be used synchronously instead of invoking the function. - */ - fn: () => T, - options?: { transport?: Transport } - ): T; - /** Get a hydratable value from the server-rendered store. If used after hydration, will always return `undefined`. Only works on the client. */ - get: (key: string, options?: { decode?: Decode }) => T | undefined; - /** Check if a hydratable value exists in the server-rendered store. */ - has: (key: string) => boolean; - /** Set a hydratable value. Only works on the server during `render`. */ - set: (key: string, value: T, options?: { encode?: Encode }) => void; - }; export {}; }