@wuchale/svelte 0.19.2 → 0.19.4

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import type { Adapter, AdapterArgs, CreateHeuristicOpts, HeuristicFunc, LoaderChoice } from 'wuchale';
+import type { Adapter, AdapterArgs, CreateHeuristicOpts, DeepPartial, HeuristicFunc, LoaderChoice } from 'wuchale';
 import { type RuntimeCtxSv } from './transformer.js';
 export type { RuntimeCtxSv };
 export declare function createSvelteHeuristic(opts: CreateHeuristicOpts): HeuristicFunc;
@@ -8,10 +8,10 @@ export declare const svelteKitDefaultHeuristic: HeuristicFunc;
 /** Default Svelte heuristic which requires `$derived` or `$derived.by` for top level variable assignments */
 export declare const svelteDefaultHeuristicDerivedReq: HeuristicFunc;
 type LoadersAvailable = 'svelte' | 'sveltekit';
-export type SvelteArgs = AdapterArgs<LoadersAvailable, RuntimeCtxSv>;
+export type SvelteArgs = AdapterArgs<LoadersAvailable>;
 export declare const defaultArgs: SvelteArgs;
 export declare function getDefaultLoaderPath(loader: LoaderChoice<LoadersAvailable>, bundle: boolean): string | {
     client: string;
     server: string;
 } | null;
-export declare const adapter: (args?: Partial<SvelteArgs>) => Adapter;
+export declare const adapter: (args?: DeepPartial<SvelteArgs>) => Adapter;

package/dist/index.js

@@ -1,4 +1,4 @@
-import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts, pofile } from 'wuchale';
+import { createHeuristic, defaultGenerateLoadID, defaultHeuristicOpts, fillDefaults, pofile } from 'wuchale';
 import { loaderPathResolver } from 'wuchale/adapter-utils';
 import { pluralPattern } from 'wuchale/adapter-vanilla';
 import { SvelteTransformer } from './transformer.js';
@@ -20,7 +20,10 @@ export function createSvelteHeuristic(opts) {
 }
 /** Default Svelte heuristic which extracts top level variable assignments as well, leading to `$derived` being auto added when needed */
 export const svelteDefaultHeuristic = createSvelteHeuristic(defaultHeuristicOpts);
-export const svelteKitDefaultHeuristic = createSvelteHeuristic({ ...defaultHeuristicOpts, urlCalls: ['goto'] });
+export const svelteKitDefaultHeuristic = createSvelteHeuristic({
+    ...defaultHeuristicOpts,
+    urlCalls: ['asset', 'goto', 'pushState', 'replaceState', 'resolve'],
+});
 /** Default Svelte heuristic which requires `$derived` or `$derived.by` for top level variable assignments */
 export const svelteDefaultHeuristicDerivedReq = msg => {
     const defRes = svelteDefaultHeuristic(msg);
@@ -42,17 +45,17 @@ export const defaultArgs = {
     files: ['src/**/*.svelte', 'src/**/*.svelte.{js,ts}'],
     storage: pofile(),
     patterns: [pluralPattern],
-    heuristic: svelteKitDefaultHeuristic,
+    heuristic: svelteDefaultHeuristic,
     granularLoad: false,
     bundleLoad: false,
     generateLoadID: defaultGenerateLoadID,
     loader: 'svelte',
     runtime: {
-        initReactive: ({ file, funcName, module }) => {
+        initReactive: ({ file, funcName, ctx: { module } }) => {
             const inTopLevel = funcName == null;
             return file.endsWith('.svelte.js') || module ? inTopLevel : inTopLevel ? true : null;
         },
-        useReactive: ({ file, funcName, module }) => {
+        useReactive: ({ file, funcName, ctx: { module } }) => {
             const inTopLevel = funcName == null;
             return file.endsWith('.svelte.js') || module ? inTopLevel : true;
         },
@@ -83,7 +86,10 @@ export function getDefaultLoaderPath(loader, bundle) {
     return resolveLoaderPath(loader);
 }
 export const adapter = (args = defaultArgs) => {
-    const { heuristic, patterns, runtime, loader, ...rest } = deepMergeObjects(args, defaultArgs);
+    if (args.loader === 'sveltekit' && args.heuristic == null) {
+        args.heuristic = svelteKitDefaultHeuristic;
+    }
+    const { heuristic, patterns, runtime, loader, ...rest } = fillDefaults(args, defaultArgs);
     return {
         transform: ({ content, filename, index, expr, matchUrl }) => {
             return new SvelteTransformer(content, filename, index, heuristic, patterns, expr, runtime, matchUrl).transformSv();

package/dist/transformer.d.ts

@@ -4,19 +4,20 @@ import type { CatalogExpr, CodePattern, HeuristicFunc, IndexTracker, Message, Ru
 import { MixedVisitor } from 'wuchale/adapter-utils';
 import { Transformer } from 'wuchale/adapter-vanilla';
 type MixedNodesTypes = AST.Text | AST.Tag | AST.ElementLike | AST.Block | AST.Comment;
+type MixedVisitorSvelte = MixedVisitor<MixedNodesTypes, AST.Text, AST.Comment, AST.ExpressionTag>;
 export type RuntimeCtxSv = {
     module: boolean;
 };
-export declare class SvelteTransformer extends Transformer<RuntimeCtxSv> {
-    currentElement?: string;
+export declare class SvelteTransformer extends Transformer {
+    currentElement?: string | undefined;
     inCompoundText: boolean;
     currentSnippet: number;
-    moduleExportRanges: [number, number][];
-    mixedVisitor: MixedVisitor<MixedNodesTypes>;
-    constructor(content: string, filename: string, index: IndexTracker, heuristic: HeuristicFunc, patterns: CodePattern[], catalogExpr: CatalogExpr, rtConf: RuntimeConf<RuntimeCtxSv>, matchUrl: UrlMatcher);
+    moduleExportExprs: AnyNode[];
+    mixedVisitor: MixedVisitorSvelte;
+    constructor(content: string, filename: string, index: IndexTracker, heuristic: HeuristicFunc, patterns: CodePattern[], catalogExpr: CatalogExpr, rtConf: RuntimeConf, matchUrl: UrlMatcher);
     visitExpressionTag: (node: AST.ExpressionTag) => Message[];
     visitVariableDeclarator: (node: VariableDeclarator) => Message[];
-    initMixedVisitor: () => MixedVisitor<MixedNodesTypes>;
+    initMixedVisitor: () => MixedVisitorSvelte;
     visitFragment: (node: AST.Fragment) => Message[];
     visitRegularElement: (node: AST.ElementLike) => Message[];
     visitComponent: (node: AST.ElementLike) => Message[];
@@ -25,6 +26,9 @@ export declare class SvelteTransformer extends Transformer<RuntimeCtxSv> {
     visitAttribute: (node: AST.Attribute) => Message[];
     visitConstTag: (node: AST.ConstTag) => Message[];
     visitRenderTag: (node: AST.RenderTag) => Message[];
+    visitHtmlTag: (node: AST.HtmlTag) => Message[];
+    visitOnDirective: (node: AST.OnDirective) => Message[];
+    hasIdentifier: (node: AnyNode | AnyNode[], name: string) => boolean;
     visitSnippetBlock: (node: AST.SnippetBlock) => Message[];
     visitIfBlock: (node: AST.IfBlock) => Message[];
     visitEachBlock: (node: AST.EachBlock) => Message[];
@@ -40,7 +44,7 @@ export declare class SvelteTransformer extends Transformer<RuntimeCtxSv> {
     visitRoot: (node: AST.Root) => Message[];
     visitSv: (node: AST.SvelteNode | AnyNode) => Message[];
     /** collects the ranges that will be checked if a snippet identifier is exported using RegExp test to simplify */
-    collectModuleExportRanges: (script: AST.Script) => void;
+    collectModuleExportExprs: (script: AST.Script) => void;
     transformSv: () => Promise<TransformOutput>;
 }
 export {};

package/dist/transformer.js

@@ -1,4 +1,3 @@
-import MagicString from 'magic-string';
 import { parse, preprocess } from 'svelte/compiler';
 import { getKey } from 'wuchale';
 import { MixedVisitor, nonWhitespaceText, varNames } from 'wuchale/adapter-utils';
@@ -8,7 +7,7 @@ const noWrapTopCalls = ['$props', '$state', '$derived', '$effect'];
 const rtComponent = 'W_tx_';
 const headerAdd = `\nimport ${rtComponent} from "@wuchale/svelte/runtime.svelte"`;
 const snipPrefix = '_w_snippet_';
-const rtModuleVar = varNames.rt + 'mod_';
+const rtModuleVar = `${varNames.rt}mod_`;
 // for use before actually parsing the code,
 // to remove the contents of e.g. <style lang="scss"> which can cause parse errors
 // without messing up indices for magic-string
@@ -20,11 +19,12 @@ export class SvelteTransformer extends Transformer {
     currentElement;
     inCompoundText = false;
     currentSnippet = 0;
-    moduleExportRanges = []; // to choose which runtime var to use for snippets
+    moduleExportExprs = []; // to choose which runtime var to use for snippets
     mixedVisitor;
     constructor(content, filename, index, heuristic, patterns, catalogExpr, rtConf, matchUrl) {
         super(content, filename, index, heuristic, patterns, catalogExpr, rtConf, matchUrl, [varNames.rt, rtModuleVar]);
         this.heuristciDetails.insideProgram = false;
+        this.mixedVisitor = this.initMixedVisitor();
     }
     visitExpressionTag = (node) => this.visit(node.expression);
     visitVariableDeclarator = (node) => {
@@ -37,6 +37,9 @@ export class SvelteTransformer extends Transformer {
             return msgs;
         }
         const needsWrapping = msgs.some(msg => {
+            if (msg.details.leftSide) {
+                return false;
+            }
             const topCall = msg.details.topLevelCall ?? '';
             if (noWrapTopCalls.includes(topCall) || noWrapTopCalls.some(c => topCall.startsWith(`${c}.`))) {
                 return false;
@@ -49,7 +52,7 @@ export class SvelteTransformer extends Transformer {
         if (!needsWrapping) {
             return msgs;
         }
-        const isExported = this.moduleExportRanges.some(([start, end]) => init.start >= start && init.end <= end);
+        const isExported = this.moduleExportExprs.some(node => init.start >= node.start && init.end <= node.end);
         if (!isExported) {
             this.mstr.appendLeft(init.start, '$derived(');
             this.mstr.appendRight(init.end, ')');
@@ -64,9 +67,9 @@ export class SvelteTransformer extends Transformer {
         isComment: node => node.type === 'Comment',
         leaveInPlace: node => ['ConstTag', 'SnippetBlock'].includes(node.type),
         isExpression: node => node.type === 'ExpressionTag',
-        getTextContent: (node) => node.data,
-        getCommentData: (node) => node.data.trim(),
-        canHaveChildren: (node) => nodesWithChildren.includes(node.type),
+        getTextContent: node => node.data,
+        getCommentData: node => node.data.trim(),
+        canHaveChildren: node => nodesWithChildren.includes(node.type),
         visitFunc: (child, inCompoundText) => {
             const inCompoundTextPrev = this.inCompoundText;
             this.inCompoundText = inCompoundText;
@@ -104,7 +107,7 @@ export class SvelteTransformer extends Transformer {
             let end = ' />\n';
             if (hasExprs) {
                 begin += ' a={[';
-                end = ']}' + end;
+                end = `]}${end}`;
             }
             this.mstr.appendLeft(lastChildEnd, begin);
             this.mstr.appendRight(lastChildEnd, end);
@@ -197,15 +200,25 @@ export class SvelteTransformer extends Transformer {
         // @ts-expect-error
         return this.visitVariableDeclaration(node.declaration);
     };
-    visitRenderTag = (node) => {
-        // @ts-expect-error
-        return this.visit(node.expression);
+    visitRenderTag = (node) => this.visit(node.expression);
+    visitHtmlTag = (node) => this.visit(node.expression);
+    visitOnDirective = (node) => this.visit(node.expression);
+    hasIdentifier = (node, name) => {
+        if (!node || typeof node !== 'object') {
+            return false;
+        }
+        if (Array.isArray(node)) {
+            return node.some(child => this.hasIdentifier(child, name));
+        }
+        if (node.type === 'Identifier') {
+            return node.name === name;
+        }
+        return Object.values(node).some(value => this.hasIdentifier(value, name));
     };
     visitSnippetBlock = (node) => {
         // use module runtime var because the snippet may be exported from the module
         const prevRtVar = this.currentRtVar;
-        const pattern = new RegExp(`\\b${node.expression.name}\\b`);
-        if (this.moduleExportRanges.some(([start, end]) => pattern.test(this.content.slice(start, end)))) {
+        if (this.hasIdentifier(this.moduleExportExprs, node.expression.name)) {
             this.currentRtVar = rtModuleVar;
         }
         const msgs = this.visitFragment(node.body);
@@ -283,7 +296,7 @@ export class SvelteTransformer extends Transformer {
     };
     visitSv = (node) => this.visit(node);
     /** collects the ranges that will be checked if a snippet identifier is exported using RegExp test to simplify */
-    collectModuleExportRanges = (script) => {
+    collectModuleExportExprs = (script) => {
         for (const stmt of script.content.body) {
             if (stmt.type !== 'ExportNamedDeclaration') {
                 continue;
@@ -291,7 +304,7 @@ export class SvelteTransformer extends Transformer {
             for (const spec of stmt.specifiers) {
                 if (spec.local.type === 'Identifier') {
                     const local = spec.local;
-                    this.moduleExportRanges.push([local.start, local.end]);
+                    this.moduleExportExprs.push(local);
                 }
             }
             const declaration = stmt.declaration;
@@ -299,14 +312,14 @@ export class SvelteTransformer extends Transformer {
                 continue;
             }
             if (declaration.type === 'FunctionDeclaration' || declaration.type === 'ClassDeclaration') {
-                this.moduleExportRanges.push([declaration.start, declaration.end]);
+                this.moduleExportExprs.push(declaration);
                 continue;
             }
             for (const decl of declaration?.declarations ?? []) {
                 if (!decl.init) {
                     continue;
                 }
-                this.moduleExportRanges.push([decl.init.start, decl.init.end]);
+                this.moduleExportExprs.push(decl.init);
             }
         }
     };
@@ -321,10 +334,8 @@ export class SvelteTransformer extends Transformer {
             ;
             [ast, this.comments] = parseScript(this.content);
         }
-        this.mstr = new MagicString(this.content);
-        this.mixedVisitor = this.initMixedVisitor();
         if (ast.type === 'Root' && ast.module) {
-            this.collectModuleExportRanges(ast.module);
+            this.collectModuleExportExprs(ast.module);
         }
         const msgs = this.visitSv(ast);
         const initRuntime = this.initRuntime();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wuchale/svelte",
-    "version": "0.19.2",
+    "version": "0.19.4",
     "description": "Protobuf-like i18n from plain code: Svelte adapter",
     "scripts": {
         "dev": "tsc --watch",
@@ -53,11 +53,12 @@
     "dependencies": {
         "magic-string": "^0.30.21",
         "svelte": "^5",
-        "wuchale": "^0.22.0"
+        "wuchale": "^0.23.0"
     },
     "devDependencies": {
+        "@types/node": "~24.12.2",
         "acorn": "^8.16.0",
-        "typescript": "^5.9.3"
+        "typescript": "^6.0.3"
     },
     "type": "module"
 }

package/src/loaders/sveltekit.ssr.svelte.js

@@ -3,7 +3,7 @@ import { loadCatalog, loadIDs } from '${PROXY_SYNC}'
 
 const key = '${KEY}'
 
-export { loadCatalog, loadIDs, key } // for hooks.server.{js,ts}
+export { key, loadCatalog, loadIDs } // for hooks.server.{js,ts}
 
 // for non-reactive
 export const getRuntime = (/** @type {string} */ loadID) => currentRuntime(key, loadID)