@wuchale/svelte 0.19.3 → 0.20.0

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, 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,19 @@ export const defaultArgs = {
     files: ['src/**/*.svelte', 'src/**/*.svelte.{js,ts}'],
     storage: pofile(),
     patterns: [pluralPattern],
-    heuristic: svelteKitDefaultHeuristic,
-    granularLoad: false,
-    bundleLoad: false,
-    generateLoadID: defaultGenerateLoadID,
+    heuristic: svelteDefaultHeuristic,
+    loading: {
+        direct: false,
+        granular: false,
+        group: [],
+    },
     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,13 +88,14 @@ 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();
-        },
+        transform: ctx => new SvelteTransformer(ctx, heuristic, patterns, runtime).transformSv(),
         loaderExts: ['.svelte.js', '.svelte.ts', '.js', '.ts'],
-        defaultLoaderPath: getDefaultLoaderPath(loader, rest.bundleLoad),
+        defaultLoaderPath: getDefaultLoaderPath(loader, rest.loading.direct),
         runtime,
         ...rest,
     };

package/dist/transformer.d.ts

@@ -1,49 +1,54 @@
 import type { AnyNode, VariableDeclarator } from 'acorn';
 import { type AST } from 'svelte/compiler';
-import type { CatalogExpr, CodePattern, HeuristicFunc, IndexTracker, Message, RuntimeConf, TransformOutput, UrlMatcher } from 'wuchale';
+import type { CodePattern, HeuristicFunc, Message, RuntimeConf, TransformCtx, TransformOutput } from 'wuchale';
 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 MixedNodesTypes = AST.Text | AST.Tag | AST.ElementLike | AST.SvelteElement | AST.Block | AST.Comment;
+type AddCtx = {
+    currentSnippet: number;
+};
+type MixedVisitorSvelte = MixedVisitor<MixedNodesTypes, AddCtx, 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;
+    addCtx: AddCtx;
     moduleExportExprs: AnyNode[];
-    mixedVisitor: MixedVisitor<MixedNodesTypes>;
-    constructor(content: string, filename: string, index: IndexTracker, heuristic: HeuristicFunc, patterns: CodePattern[], catalogExpr: CatalogExpr, rtConf: RuntimeConf<RuntimeCtxSv>, matchUrl: UrlMatcher);
-    visitExpressionTag: (node: AST.ExpressionTag) => Message[];
-    visitVariableDeclarator: (node: VariableDeclarator) => Message[];
-    initMixedVisitor: () => MixedVisitor<MixedNodesTypes>;
-    visitFragment: (node: AST.Fragment) => Message[];
-    visitRegularElement: (node: AST.ElementLike) => Message[];
-    visitComponent: (node: AST.ElementLike) => Message[];
-    visitText: (node: AST.Text) => Message[];
-    visitSpreadAttribute: (node: AST.SpreadAttribute) => Message[];
-    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[];
-    visitKeyBlock: (node: AST.KeyBlock) => Message[];
-    visitAwaitBlock: (node: AST.AwaitBlock) => Message[];
-    visitSvelteBody: (node: AST.SvelteBody) => Message[];
-    visitSvelteDocument: (node: AST.SvelteDocument) => Message[];
-    visitSvelteElement: (node: AST.SvelteElement) => Message[];
-    visitSvelteBoundary: (node: AST.SvelteBoundary) => Message[];
-    visitSvelteHead: (node: AST.SvelteHead) => Message[];
-    visitTitleElement: (node: AST.TitleElement) => Message[];
-    visitSvelteWindow: (node: AST.SvelteWindow) => Message[];
-    visitRoot: (node: AST.Root) => Message[];
-    visitSv: (node: AST.SvelteNode | AnyNode) => Message[];
+    mixedVisitor: MixedVisitorSvelte;
+    constructor(ctx: TransformCtx, heuristic: HeuristicFunc, patterns: CodePattern[], rtConf: RuntimeConf);
+    visitExpressionTag(node: AST.ExpressionTag): Message[];
+    visitVariableDeclarator(node: VariableDeclarator): Message[];
+    initMixedVisitor(): MixedVisitorSvelte;
+    visitFragment(node: AST.Fragment): Message[];
+    visitRegularElement(node: AST.ElementLike): Message[];
+    visitComponent(node: AST.Component): Message[];
+    visitText(node: AST.Text): Message[];
+    visitSpreadAttribute(node: AST.SpreadAttribute): Message[];
+    visitAttribute(node: AST.Attribute): Message[];
+    visitConstTag(node: AST.ConstTag): Message[];
+    visitDeclarationTag(node: AST.DeclarationTag): 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[];
+    visitKeyBlock(node: AST.KeyBlock): Message[];
+    visitAwaitBlock(node: AST.AwaitBlock): Message[];
+    visitSvelteBody(node: AST.SvelteBody): Message[];
+    visitSvelteDocument(node: AST.SvelteDocument): Message[];
+    visitSvelteElement(node: AST.SvelteElement): Message[];
+    visitSvelteBoundary(node: AST.SvelteBoundary): Message[];
+    visitSvelteHead(node: AST.SvelteHead): Message[];
+    visitTitleElement(node: AST.TitleElement): Message[];
+    visitSvelteWindow(node: AST.SvelteWindow): Message[];
+    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 */
-    collectModuleExportExprs: (script: AST.Script) => void;
-    transformSv: () => Promise<TransformOutput>;
+    collectModuleExportExprs(script: AST.Script): void;
+    transformSv(): Promise<TransformOutput>;
 }
 export {};

package/dist/transformer.js

@@ -1,14 +1,13 @@
-import MagicString from 'magic-string';
 import { parse, preprocess } from 'svelte/compiler';
 import { getKey } from 'wuchale';
 import { MixedVisitor, nonWhitespaceText, varNames } from 'wuchale/adapter-utils';
 import { parseScript, Transformer } from 'wuchale/adapter-vanilla';
-const nodesWithChildren = ['RegularElement', 'Component'];
+const nodesWithChildren = ['RegularElement', 'Component', 'SvelteElement'];
 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
@@ -19,21 +18,25 @@ export class SvelteTransformer extends Transformer {
     // state
     currentElement;
     inCompoundText = false;
-    currentSnippet = 0;
+    addCtx = { currentSnippet: 0 };
     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]);
+    constructor(ctx, heuristic, patterns, rtConf) {
+        super(ctx, heuristic, patterns, rtConf, [varNames.rt, rtModuleVar]);
         this.heuristciDetails.insideProgram = false;
+        this.mixedVisitor = this.initMixedVisitor();
+    }
+    visitExpressionTag(node) {
+        return this.visit(node.expression);
     }
-    visitExpressionTag = (node) => this.visit(node.expression);
-    visitVariableDeclarator = (node) => {
-        const msgs = this.defaultVisitVariableDeclarator(node);
+    visitVariableDeclarator(node) {
+        const msgs = super.visitVariableDeclarator(node);
         const init = node.init;
         if (!msgs.length ||
-            this.heuristciDetails.declaring != null ||
+            (this.heuristciDetails.declaring != null && this.heuristciDetails.declaring !== 'variable') ||
             init == null ||
-            ['ArrowFunctionExpression', 'FunctionExpression'].includes(init.type)) {
+            init.type === 'ArrowFunctionExpression' ||
+            init.type === 'FunctionExpression') {
             return msgs;
         }
         const needsWrapping = msgs.some(msg => {
@@ -53,75 +56,74 @@ export class SvelteTransformer extends Transformer {
             return msgs;
         }
         const isExported = this.moduleExportExprs.some(node => init.start >= node.start && init.end <= node.end);
-        if (!isExported) {
+        if (!isExported && this.initReactive()) {
             this.mstr.appendLeft(init.start, '$derived(');
             this.mstr.appendRight(init.end, ')');
         }
         return msgs;
-    };
-    initMixedVisitor = () => new MixedVisitor({
-        mstr: this.mstr,
-        vars: this.vars,
-        getRange: node => ({ start: node.start, end: node.end }),
-        isText: node => node.type === 'Text',
-        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),
-        visitFunc: (child, inCompoundText) => {
-            const inCompoundTextPrev = this.inCompoundText;
-            this.inCompoundText = inCompoundText;
-            const childTxts = this.visitSv(child);
-            this.inCompoundText = inCompoundTextPrev; // restore
-            return childTxts;
-        },
-        visitExpressionTag: this.visitExpressionTag,
-        fullHeuristicDetails: this.fullHeuristicDetails,
-        checkHeuristic: this.getHeuristicMessageType,
-        index: this.index,
-        wrapNested: (msgInfo, hasExprs, nestedRanges, lastChildEnd) => {
-            const snippets = [];
-            // create and reference snippets
-            for (const [childStart, childEnd, haveCtx] of nestedRanges) {
-                const snippetName = `${snipPrefix}${this.currentSnippet}`;
-                snippets.push(snippetName);
-                this.currentSnippet++;
-                const snippetBegin = `\n{#snippet ${snippetName}(${haveCtx ? this.vars().nestCtx : ''})}\n`;
-                this.mstr.appendRight(childStart, snippetBegin);
-                this.mstr.prependLeft(childEnd, '\n{/snippet}\n');
-            }
-            let begin = `\n<${rtComponent}`;
-            if (snippets.length) {
-                begin += ` t={[${snippets.join(', ')}]}`;
-            }
-            begin += ' x=';
-            if (this.inCompoundText) {
-                begin += `{${this.vars().nestCtx}} n`;
-            }
-            else {
-                const index = this.index.get(getKey(msgInfo.msgStr, msgInfo.context));
-                begin += `{${this.vars().rtCtx}(${index})}`;
-            }
-            let end = ' />\n';
-            if (hasExprs) {
-                begin += ' a={[';
-                end = ']}' + end;
-            }
-            this.mstr.appendLeft(lastChildEnd, begin);
-            this.mstr.appendRight(lastChildEnd, end);
-        },
-    });
-    visitFragment = (node) => this.mixedVisitor.visit({
-        children: node.nodes,
-        commentDirectives: this.commentDirectives,
-        inCompoundText: this.inCompoundText,
-        scope: 'markup',
-        element: this.currentElement,
-        useComponent: this.currentElement !== 'title',
-    });
-    visitRegularElement = (node) => {
+    }
+    initMixedVisitor() {
+        return new MixedVisitor({
+            vars: this.vars.bind(this),
+            content: this.content,
+            getRange: node => ({ start: node.start, end: node.end }),
+            isText: node => node.type === 'Text',
+            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),
+            visitFunc: MixedVisitor.withCtxRestore(this, this.visitSv.bind(this)),
+            fullHeuristicDetails: this.fullHeuristicDetails.bind(this),
+            checkHeuristic: this.getHeuristicMessageType.bind(this),
+            wrapNested: (msgInfo, hasExprs, nestedRanges, lastChildEnd) => {
+                const snippets = [];
+                // create and reference snippets
+                for (const [childStart, childEnd, haveCtx] of nestedRanges) {
+                    const snippetName = `${snipPrefix}${this.addCtx.currentSnippet}`;
+                    snippets.push(snippetName);
+                    this.addCtx.currentSnippet++;
+                    const snippetBegin = `\n{#snippet ${snippetName}(${haveCtx ? this.vars().nestCtx : ''})}\n`;
+                    this.mstr.appendRight(childStart, snippetBegin);
+                    this.mstr.prependLeft(childEnd, '\n{/snippet}\n');
+                }
+                let begin = `\n<${rtComponent}`;
+                if (snippets.length) {
+                    begin += ` t={[${snippets.join(', ')}]}`;
+                }
+                begin += ' x=';
+                if (this.inCompoundText) {
+                    begin += `{${this.vars().nestCtx}} n`;
+                }
+                else {
+                    const index = this.index.get(getKey(msgInfo.msgStr, msgInfo.context));
+                    begin += `{${this.vars().rtCtx}(${index})}`;
+                }
+                let end = ' />\n';
+                if (hasExprs) {
+                    begin += ' a={[';
+                    end = `]}${end}`;
+                }
+                this.mstr.appendLeft(lastChildEnd, begin);
+                this.mstr.appendRight(lastChildEnd, end);
+            },
+        });
+    }
+    visitFragment(node) {
+        return this.mixedVisitor.visit({
+            mstr: this.mstr,
+            index: this.index,
+            addCtx: this.addCtx,
+            children: node.nodes,
+            commentDirectives: this.commentDirectives,
+            inCompoundText: this.inCompoundText,
+            scope: 'markup',
+            element: this.currentElement,
+            useComponent: this.currentElement !== 'title',
+        });
+    }
+    visitRegularElement(node) {
         const currentElement = this.currentElement;
         this.currentElement = node.name;
         const msgs = [];
@@ -131,9 +133,11 @@ export class SvelteTransformer extends Transformer {
         msgs.push(...this.visitFragment(node.fragment));
         this.currentElement = currentElement;
         return msgs;
-    };
-    visitComponent = this.visitRegularElement;
-    visitText = (node) => {
+    }
+    visitComponent(node) {
+        return this.visitRegularElement(node);
+    }
+    visitText(node) {
         const [startWh, trimmed, endWh] = nonWhitespaceText(node.data);
         const [pass, msgInfo] = this.checkHeuristic(trimmed, {
             scope: 'markup',
@@ -144,9 +148,11 @@ export class SvelteTransformer extends Transformer {
         }
         this.mstr.update(node.start + startWh, node.end - endWh, `{${this.literalRepl(msgInfo)}}`);
         return [msgInfo];
-    };
-    visitSpreadAttribute = (node) => this.visit(node.expression);
-    visitAttribute = (node) => {
+    }
+    visitSpreadAttribute(node) {
+        return this.visit(node.expression);
+    }
+    visitAttribute(node) {
         if (node.value === true) {
             return [];
         }
@@ -159,6 +165,9 @@ export class SvelteTransformer extends Transformer {
         }
         if (values.length > 1) {
             return this.mixedVisitor.visit({
+                mstr: this.mstr,
+                index: this.index,
+                addCtx: this.addCtx,
                 children: values,
                 commentDirectives: this.commentDirectives,
                 inCompoundText: false,
@@ -195,15 +204,29 @@ export class SvelteTransformer extends Transformer {
             this.mstr.remove(value.end, value.end + 1);
         }
         return [msgInfo];
-    };
-    visitConstTag = (node) => {
+    }
+    visitConstTag(node) {
         // @ts-expect-error
         return this.visitVariableDeclaration(node.declaration);
-    };
-    visitRenderTag = (node) => this.visit(node.expression);
-    visitHtmlTag = (node) => this.visit(node.expression);
-    visitOnDirective = (node) => this.visit(node.expression);
-    hasIdentifier = (node, name) => {
+    }
+    visitDeclarationTag(node) {
+        const prevDeclaring = this.heuristciDetails.declaring;
+        this.heuristciDetails.declaring = 'variable';
+        // @ts-expect-error
+        const msgs = this.visitVariableDeclaration(node.declaration);
+        this.heuristciDetails.declaring = prevDeclaring;
+        return msgs;
+    }
+    visitRenderTag(node) {
+        return this.visit(node.expression);
+    }
+    visitHtmlTag(node) {
+        return this.visit(node.expression);
+    }
+    visitOnDirective(node) {
+        return this.visit(node.expression);
+    }
+    hasIdentifier(node, name) {
         if (!node || typeof node !== 'object') {
             return false;
         }
@@ -214,8 +237,8 @@ export class SvelteTransformer extends Transformer {
             return node.name === name;
         }
         return Object.values(node).some(value => this.hasIdentifier(value, name));
-    };
-    visitSnippetBlock = (node) => {
+    }
+    visitSnippetBlock(node) {
         // use module runtime var because the snippet may be exported from the module
         const prevRtVar = this.currentRtVar;
         if (this.hasIdentifier(this.moduleExportExprs, node.expression.name)) {
@@ -224,16 +247,16 @@ export class SvelteTransformer extends Transformer {
         const msgs = this.visitFragment(node.body);
         this.currentRtVar = prevRtVar;
         return msgs;
-    };
-    visitIfBlock = (node) => {
+    }
+    visitIfBlock(node) {
         const msgs = this.visit(node.test);
         msgs.push(...this.visitSv(node.consequent));
         if (node.alternate) {
             msgs.push(...this.visitSv(node.alternate));
         }
         return msgs;
-    };
-    visitEachBlock = (node) => {
+    }
+    visitEachBlock(node) {
         const msgs = [...this.visit(node.expression), ...this.visitSv(node.body)];
         if (node.key) {
             msgs.push(...this.visit(node.key));
@@ -242,11 +265,11 @@ export class SvelteTransformer extends Transformer {
             msgs.push(...this.visitSv(node.fallback));
         }
         return msgs;
-    };
-    visitKeyBlock = (node) => {
+    }
+    visitKeyBlock(node) {
         return [...this.visit(node.expression), ...this.visitSv(node.fragment)];
-    };
-    visitAwaitBlock = (node) => {
+    }
+    visitAwaitBlock(node) {
         const msgs = this.visit(node.expression);
         if (node.then) {
             msgs.push(...this.visitFragment(node.then));
@@ -258,18 +281,38 @@ export class SvelteTransformer extends Transformer {
             msgs.push(...this.visitFragment(node.catch));
         }
         return msgs;
-    };
-    visitSvelteBody = (node) => node.attributes.flatMap(this.visitSv);
-    visitSvelteDocument = (node) => node.attributes.flatMap(this.visitSv);
-    visitSvelteElement = (node) => node.attributes.flatMap(this.visitSv);
-    visitSvelteBoundary = (node) => [
-        ...node.attributes.flatMap(this.visitSv),
-        ...this.visitSv(node.fragment),
-    ];
-    visitSvelteHead = (node) => this.visitSv(node.fragment);
-    visitTitleElement = (node) => this.visitRegularElement(node);
-    visitSvelteWindow = (node) => node.attributes.flatMap(this.visitSv);
-    visitRoot = (node) => {
+    }
+    visitSvelteBody(node) {
+        return node.attributes.flatMap(n => this.visitSv(n));
+    }
+    visitSvelteDocument(node) {
+        return node.attributes.flatMap(n => this.visitSv(n));
+    }
+    visitSvelteElement(node) {
+        const currentElement = this.currentElement;
+        if (node.tag.type === 'Literal' && typeof node.tag.value === 'string') {
+            this.currentElement = node.tag.value;
+        }
+        else {
+            this.currentElement = 'svelte:element';
+        }
+        const msgs = [...node.attributes.flatMap(n => this.visitSv(n)), ...this.visitFragment(node.fragment)];
+        this.currentElement = currentElement;
+        return msgs;
+    }
+    visitSvelteBoundary(node) {
+        return [...node.attributes.flatMap(n => this.visitSv(n)), ...this.visitSv(node.fragment)];
+    }
+    visitSvelteHead(node) {
+        return this.visitSv(node.fragment);
+    }
+    visitTitleElement(node) {
+        return this.visitRegularElement(node);
+    }
+    visitSvelteWindow(node) {
+        return node.attributes.flatMap(n => this.visitSv(n));
+    }
+    visitRoot(node) {
         const msgs = [];
         if (node.module) {
             const prevRtVar = this.currentRtVar;
@@ -293,10 +336,12 @@ export class SvelteTransformer extends Transformer {
         }
         msgs.push(...this.visitFragment(node.fragment));
         return msgs;
-    };
-    visitSv = (node) => this.visit(node);
+    }
+    visitSv(node) {
+        return this.visit(node);
+    }
     /** collects the ranges that will be checked if a snippet identifier is exported using RegExp test to simplify */
-    collectModuleExportExprs = (script) => {
+    collectModuleExportExprs(script) {
         for (const stmt of script.content.body) {
             if (stmt.type !== 'ExportNamedDeclaration') {
                 continue;
@@ -322,8 +367,8 @@ export class SvelteTransformer extends Transformer {
                 this.moduleExportExprs.push(decl.init);
             }
         }
-    };
-    transformSv = async () => {
+    }
+    async transformSv() {
         const isComponent = this.heuristciDetails.file.endsWith('.svelte');
         let ast;
         if (isComponent) {
@@ -334,8 +379,6 @@ 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.collectModuleExportExprs(ast.module);
         }
@@ -371,5 +414,5 @@ export class SvelteTransformer extends Transformer {
             // now hmr data can be prependRight(0, ...)
         }
         return this.finalize(msgs, headerIndex, headerAdd);
-    };
+    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wuchale/svelte",
-    "version": "0.19.3",
+    "version": "0.20.0",
     "description": "Protobuf-like i18n from plain code: Svelte adapter",
     "scripts": {
         "dev": "tsc --watch",
@@ -50,14 +50,17 @@
     "bugs": "https://github.com/wuchalejs/wuchale/issues",
     "author": "K1DV5",
     "license": "MIT",
+    "peerDependencies": {
+        "svelte": "^5"
+    },
     "dependencies": {
-        "magic-string": "^0.30.21",
-        "svelte": "^5",
-        "wuchale": "^0.22.1"
+        "wuchale": "^0.24.0"
     },
     "devDependencies": {
+        "@types/node": "~24.13.1",
+        "svelte": "^5.56.3",
         "acorn": "^8.16.0",
-        "typescript": "^5.9.3"
+        "typescript": "^6.0.3"
     },
     "type": "module"
 }

package/src/loaders/bundle.svelte.js

@@ -12,7 +12,7 @@ export function setLocale(newLocale) {
 
 // for non-reactive
 /**
- * @param {{ [locale: string]: import("wuchale/runtime").CatalogModule }} catalogs
+ * @param {{ [locale in import('${DATA}').Locale]: import("wuchale/runtime").CatalogModule }} catalogs
  */
 export const getRuntime = catalogs => toRuntime(catalogs[locale], locale)
 

package/src/loaders/svelte.svelte.js

@@ -1,12 +1,13 @@
 import { defaultCollection, registerLoaders } from 'wuchale/load-utils'
-import { loadCatalog, loadIDs } from '${PROXY}'
+import { loadCatalog, loadCount } from '${PROXY}'
 
 const key = '${KEY}'
 
-const runtimes = $state({})
+/** @type import('wuchale/runtime').Runtime[] */
+const runtimes = $state([])
 
 // for non-reactive
-export const getRuntime = registerLoaders(key, loadCatalog, loadIDs, defaultCollection(runtimes))
+export const getRuntime = registerLoaders(key, loadCatalog, loadCount, defaultCollection(runtimes))
 
 // same function, only will be inside $derived when used
 export const getRuntimeRx = getRuntime

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

@@ -1,12 +1,12 @@
 import { currentRuntime } from 'wuchale/load-utils/server'
-import { loadCatalog, loadIDs } from '${PROXY_SYNC}'
+import { loadCatalog, loadCount } from '${PROXY_SYNC}'
 
 const key = '${KEY}'
 
-export { loadCatalog, loadIDs, key } // for hooks.server.{js,ts}
+export { key, loadCatalog, loadCount } // for hooks.server.{js,ts}
 
 // for non-reactive
-export const getRuntime = (/** @type {string} */ loadID) => currentRuntime(key, loadID)
+export const getRuntime = (loadID = 0) => currentRuntime(key, loadID)
 
 // same function, only will be inside $derived when used
 export const getRuntimeRx = getRuntime