From e3ff46e0de7b02e197d29a2cc68d5f7e3f91c07f Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 29 Jan 2024 09:58:13 -0500 Subject: [PATCH] $derived.fn -> $derived.call --- .changeset/nervous-spoons-relax.md | 2 +- .../src/compiler/phases/2-analyze/index.js | 6 ++-- .../compiler/phases/2-analyze/validation.js | 2 +- .../phases/3-transform/client/types.d.ts | 2 +- .../client/visitors/javascript-runes.js | 16 ++++----- .../3-transform/server/transform-server.js | 4 +-- .../svelte/src/compiler/phases/constants.js | 2 +- packages/svelte/src/main/ambient.d.ts | 4 +-- .../class-state-derived-fn/main.svelte | 2 +- .../samples/derived-fn/main.svelte | 2 +- packages/svelte/types/index.d.ts | 36 +++++++++---------- .../src/lib/CodeMirror.svelte | 4 +-- .../routes/docs/content/01-api/02-runes.md | 6 ++-- 13 files changed, 44 insertions(+), 44 deletions(-) diff --git a/.changeset/nervous-spoons-relax.md b/.changeset/nervous-spoons-relax.md index 070d573af2..9480a8ac47 100644 --- a/.changeset/nervous-spoons-relax.md +++ b/.changeset/nervous-spoons-relax.md @@ -2,4 +2,4 @@ "svelte": patch --- -chore: add $derived.fn rune +chore: add $derived.call rune diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js index e322f1e057..e74d2ee9ab 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/index.js +++ b/packages/svelte/src/compiler/phases/2-analyze/index.js @@ -674,7 +674,7 @@ const runes_scope_js_tweaker = { rune !== '$state' && rune !== '$state.frozen' && rune !== '$derived' && - rune !== '$derived.fn' + rune !== '$derived.call' ) return; @@ -710,7 +710,7 @@ const runes_scope_tweaker = { rune !== '$state' && rune !== '$state.frozen' && rune !== '$derived' && - rune !== '$derived.fn' && + rune !== '$derived.call' && rune !== '$props' ) return; @@ -723,7 +723,7 @@ const runes_scope_tweaker = { ? 'state' : rune === '$state.frozen' ? 'frozen_state' - : rune === '$derived' || rune === '$derived.fn' + : rune === '$derived' || rune === '$derived.call' ? 'derived' : path.is_rest ? 'rest_prop' diff --git a/packages/svelte/src/compiler/phases/2-analyze/validation.js b/packages/svelte/src/compiler/phases/2-analyze/validation.js index 848207e027..4202e1b9fe 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/validation.js +++ b/packages/svelte/src/compiler/phases/2-analyze/validation.js @@ -715,7 +715,7 @@ function validate_call_expression(node, scope, path) { error(node, 'invalid-props-location'); } - if (rune === '$state' || rune === '$derived' || rune === '$derived.fn') { + if (rune === '$state' || rune === '$derived' || rune === '$derived.call') { if (parent.type === 'VariableDeclarator') return; if (parent.type === 'PropertyDefinition' && !parent.static && !parent.computed) return; error(node, rune === '$derived' ? 'invalid-derived-location' : 'invalid-state-location'); diff --git a/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts b/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts index d7abee3550..14b628a89d 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts +++ b/packages/svelte/src/compiler/phases/3-transform/client/types.d.ts @@ -58,7 +58,7 @@ export interface ComponentClientTransformState extends ClientTransformState { } export interface StateField { - kind: 'state' | 'frozen_state' | 'derived' | 'derived_fn'; + kind: 'state' | 'frozen_state' | 'derived' | 'derived_call'; id: PrivateIdentifier; } diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/javascript-runes.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/javascript-runes.js index c9d3c7d738..ecafb98b69 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/javascript-runes.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/javascript-runes.js @@ -33,7 +33,7 @@ export const javascript_visitors_runes = { rune === '$state' || rune === '$state.frozen' || rune === '$derived' || - rune === '$derived.fn' + rune === '$derived.call' ) { /** @type {import('../types.js').StateField} */ const field = { @@ -42,8 +42,8 @@ export const javascript_visitors_runes = { ? 'state' : rune === '$state.frozen' ? 'frozen_state' - : rune === '$derived.fn' - ? 'derived_fn' + : rune === '$derived.call' + ? 'derived_call' : 'derived', // @ts-expect-error this is set in the next pass id: is_private ? definition.key : null @@ -102,7 +102,7 @@ export const javascript_visitors_runes = { '$.source', should_proxy_or_freeze(init) ? b.call('$.freeze', init) : init ) - : field.kind === 'derived_fn' + : field.kind === 'derived_call' ? b.call('$.derived', init) : b.call('$.derived', b.thunk(init)); } else { @@ -146,7 +146,7 @@ export const javascript_visitors_runes = { ); } - if ((field.kind === 'derived' || field.kind === 'derived_fn') && state.options.dev) { + if ((field.kind === 'derived' || field.kind === 'derived_call') && state.options.dev) { body.push( b.method( 'set', @@ -286,12 +286,12 @@ export const javascript_visitors_runes = { continue; } - if (rune === '$derived' || rune === '$derived.fn') { + if (rune === '$derived' || rune === '$derived.call') { if (declarator.id.type === 'Identifier') { declarations.push( b.declarator( declarator.id, - b.call('$.derived', rune === '$derived.fn' ? value : b.thunk(value)) + b.call('$.derived', rune === '$derived.call' ? value : b.thunk(value)) ) ); } else { @@ -307,7 +307,7 @@ export const javascript_visitors_runes = { b.block([ b.let( declarator.id, - rune === '$derived.fn' ? b.call(value, b.id('$$derived')) : value + rune === '$derived.call' ? b.call(value, b.id('$$derived')) : value ), b.return(b.array(bindings.map((binding) => binding.node))) ]) diff --git a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js index 4e1fee32da..14b8cd2105 100644 --- a/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js +++ b/packages/svelte/src/compiler/phases/3-transform/server/transform-server.js @@ -558,7 +558,7 @@ const javascript_visitors_runes = { : /** @type {import('estree').Expression} */ (visit(node.value.arguments[0])) }; } - if (rune === '$derived.fn') { + if (rune === '$derived.call') { return { ...node, value: @@ -592,7 +592,7 @@ const javascript_visitors_runes = { ? b.id('undefined') : /** @type {import('estree').Expression} */ (visit(args[0])); - if (rune === '$derived.fn') { + if (rune === '$derived.call') { declarations.push( b.declarator( /** @type {import('estree').Pattern} */ (visit(declarator.id)), diff --git a/packages/svelte/src/compiler/phases/constants.js b/packages/svelte/src/compiler/phases/constants.js index 5d60e428e5..cb8aaef1c8 100644 --- a/packages/svelte/src/compiler/phases/constants.js +++ b/packages/svelte/src/compiler/phases/constants.js @@ -75,7 +75,7 @@ export const Runes = /** @type {const} */ ([ '$state.frozen', '$props', '$derived', - '$derived.fn', + '$derived.call', '$effect', '$effect.pre', '$effect.active', diff --git a/packages/svelte/src/main/ambient.d.ts b/packages/svelte/src/main/ambient.d.ts index d949b1ec29..116295fcf7 100644 --- a/packages/svelte/src/main/ambient.d.ts +++ b/packages/svelte/src/main/ambient.d.ts @@ -62,11 +62,11 @@ declare function $derived(expression: T): T; declare namespace $derived { /** * Sometimes you need to create complex derivations which don't fit inside a short expression. - * In this case, you can resort to `$derived.fn` which accepts a function as its argument and returns its value. + * In this case, you can resort to `$derived.call` which accepts a function as its argument and returns its value. * * Example: * ```ts - * $derived.fn(() => { + * $derived.call(() => { * let tmp = count; * if (count > 10) { * tmp += 100; diff --git a/packages/svelte/tests/runtime-runes/samples/class-state-derived-fn/main.svelte b/packages/svelte/tests/runtime-runes/samples/class-state-derived-fn/main.svelte index 3cb257cc6a..2816780c25 100644 --- a/packages/svelte/tests/runtime-runes/samples/class-state-derived-fn/main.svelte +++ b/packages/svelte/tests/runtime-runes/samples/class-state-derived-fn/main.svelte @@ -1,7 +1,7 @@ diff --git a/packages/svelte/types/index.d.ts b/packages/svelte/types/index.d.ts index 6819181073..718b7e7229 100644 --- a/packages/svelte/types/index.d.ts +++ b/packages/svelte/types/index.d.ts @@ -988,15 +988,15 @@ declare module 'svelte/compiler' { filename?: string | undefined; } | undefined): Promise; export class CompileError extends Error { - + constructor(code: string, message: string, position: [number, number] | undefined); - + filename: CompileError_1['filename']; - + position: CompileError_1['position']; - + start: CompileError_1['start']; - + end: CompileError_1['end']; code: string; } @@ -1007,9 +1007,9 @@ declare module 'svelte/compiler' { * */ export const VERSION: string; class Scope { - + constructor(root: ScopeRoot, parent: Scope | null, porous: boolean); - + root: ScopeRoot; /** * A map of every identifier declared by this scope, and all the @@ -1033,25 +1033,25 @@ declare module 'svelte/compiler' { * which is usually an error. Block statements do not increase this value */ function_depth: number; - + declare(node: import('estree').Identifier, kind: Binding['kind'], declaration_kind: DeclarationKind, initial?: null | import('estree').Expression | import('estree').FunctionDeclaration | import('estree').ClassDeclaration | import('estree').ImportDeclaration | EachBlock): Binding; child(porous?: boolean): Scope; - + generate(preferred_name: string): string; - + get(name: string): Binding | null; - + get_bindings(node: import('estree').VariableDeclarator | LetDirective): Binding[]; - + owner(name: string): Scope | null; - + reference(node: import('estree').Identifier, path: SvelteNode[]): void; #private; } class ScopeRoot { - + conflicts: Set; - + unique(preferred_name: string): import("estree").Identifier; } interface BaseNode { @@ -2464,11 +2464,11 @@ declare function $derived(expression: T): T; declare namespace $derived { /** * Sometimes you need to create complex derivations which don't fit inside a short expression. - * In this case, you can resort to `$derived.fn` which accepts a function as its argument and returns its value. + * In this case, you can resort to `$derived.call` which accepts a function as its argument and returns its value. * * Example: * ```ts - * $derived.fn(() => { + * $derived.call(() => { * let tmp = count; * if (count > 10) { * tmp += 100; @@ -2603,4 +2603,4 @@ declare function $inspect( ...values: T ): { with: (fn: (type: 'init' | 'update', ...values: T) => void) => void }; -//# sourceMappingURL=index.d.ts.map \ No newline at end of file +//# sourceMappingURL=index.d.ts.map diff --git a/sites/svelte-5-preview/src/lib/CodeMirror.svelte b/sites/svelte-5-preview/src/lib/CodeMirror.svelte index e1fc1bf125..9a2438be02 100644 --- a/sites/svelte-5-preview/src/lib/CodeMirror.svelte +++ b/sites/svelte-5-preview/src/lib/CodeMirror.svelte @@ -208,8 +208,8 @@ { label: '$state', type: 'keyword', boost: 10 }, { label: '$props', type: 'keyword', boost: 9 }, { label: '$derived', type: 'keyword', boost: 8 }, - snip('$derived.fn(() => {\n\t${}\n});', { - label: '$derived.fn', + snip('$derived.call(() => {\n\t${}\n});', { + label: '$derived.call', type: 'keyword', boost: 7 }), diff --git a/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md b/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md index d128972b26..78d232fa81 100644 --- a/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md +++ b/sites/svelte-5-preview/src/routes/docs/content/01-api/02-runes.md @@ -134,14 +134,14 @@ If the value of a reactive variable is being computed it should be replaced with ``` ...`double` will be calculated first despite the source order. In runes mode, `triple` cannot reference `double` before it has been declared. -### `$derived.fn` +### `$derived.call` -Sometimes you need to create complex derivations which don't fit inside a short expression. In this case, you can resort to `$derived.fn` which accepts a function as its argument and returns its value. +Sometimes you need to create complex derivations which don't fit inside a short expression. In this case, you can resort to `$derived.call` which accepts a function as its argument and returns its value. ```svelte