@wuchale/svelte 0.17.9 → 0.18.1

package/dist/index.d.ts

@@ -1,4 +1,6 @@
-import type { HeuristicFunc, Adapter, AdapterArgs, LoaderChoice, CreateHeuristicOpts } from 'wuchale';
+import type { Adapter, AdapterArgs, CreateHeuristicOpts, HeuristicFunc, LoaderChoice } from 'wuchale';
+import { type RuntimeCtxSv } from './transformer.js';
+export type { RuntimeCtxSv };
 export declare function createSvelteHeuristic(opts: CreateHeuristicOpts): HeuristicFunc;
 /** Default Svelte heuristic which extracts top level variable assignments as well, leading to `$derived` being auto added when needed */
 export declare const svelteDefaultHeuristic: HeuristicFunc;
@@ -6,10 +8,9 @@ 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>;
+export type SvelteArgs = AdapterArgs<LoadersAvailable, RuntimeCtxSv>;
 export declare function getDefaultLoaderPath(loader: LoaderChoice<LoadersAvailable>, bundle: boolean): string | {
     client: string;
     server: string;
 } | null;
 export declare const adapter: (args?: Partial<SvelteArgs>) => Adapter;
-export {};

package/dist/index.js

@@ -1,10 +1,10 @@
-import { defaultGenerateLoadID, deepMergeObjects, createHeuristic, defaultHeuristicOpts } from 'wuchale';
-import { SvelteTransformer } from "./transformer.js";
+import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts } from 'wuchale';
 import { loaderPathResolver } from 'wuchale/adapter-utils';
 import { pluralPattern } from 'wuchale/adapter-vanilla';
+import { SvelteTransformer } from './transformer.js';
 export function createSvelteHeuristic(opts) {
     const defaultHeuristic = createHeuristic(opts);
-    return msg => {
+    return (msg) => {
         const defRes = defaultHeuristic(msg);
         if (!defRes) {
             return false;
@@ -22,7 +22,7 @@ export function createSvelteHeuristic(opts) {
 export const svelteDefaultHeuristic = createSvelteHeuristic(defaultHeuristicOpts);
 export const svelteKitDefaultHeuristic = createSvelteHeuristic({ ...defaultHeuristicOpts, urlCalls: ['goto'] });
 /** Default Svelte heuristic which requires `$derived` or `$derived.by` for top level variable assignments */
-export const svelteDefaultHeuristicDerivedReq = msg => {
+export const svelteDefaultHeuristicDerivedReq = (msg) => {
     const defRes = svelteDefaultHeuristic(msg);
     if (!defRes) {
         return false;
@@ -48,21 +48,21 @@ const defaultArgs = {
     generateLoadID: defaultGenerateLoadID,
     loader: 'svelte',
     runtime: {
-        useReactive: ({ file, funcName, additional }) => {
+        initReactive: ({ file, funcName, module }) => {
             const inTopLevel = funcName == null;
-            const inModule = file.endsWith('.svelte.js') || additional.module;
-            return {
-                init: inModule ? inTopLevel : (inTopLevel ? true : null),
-                use: inModule ? inTopLevel : true,
-            };
+            return file.endsWith('.svelte.js') || module ? inTopLevel : inTopLevel ? true : null;
+        },
+        useReactive: ({ file, funcName, module }) => {
+            const inTopLevel = funcName == null;
+            return file.endsWith('.svelte.js') || module ? inTopLevel : true;
         },
         reactive: {
-            wrapInit: expr => `$derived(${expr})`,
-            wrapUse: expr => expr,
+            wrapInit: (expr) => `$derived(${expr})`,
+            wrapUse: (expr) => expr,
         },
         plain: {
-            wrapInit: expr => expr,
-            wrapUse: expr => expr,
+            wrapInit: (expr) => expr,
+            wrapUse: (expr) => expr,
         },
     },
 };

package/dist/transformer.d.ts

@@ -1,19 +1,19 @@
-import type { AnyNode, VariableDeclarator } from "acorn";
-import { type AST } from "svelte/compiler";
-import { Message } from 'wuchale';
+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 { MixedVisitor } from 'wuchale/adapter-utils';
 import { Transformer } from 'wuchale/adapter-vanilla';
-import type { IndexTracker, HeuristicFunc, TransformOutput, CatalogExpr, RuntimeConf, CodePattern, UrlMatcher } from 'wuchale';
-import { MixedVisitor, type CommentDirectives } from "wuchale/adapter-utils";
 type MixedNodesTypes = AST.Text | AST.Tag | AST.ElementLike | AST.Block | AST.Comment;
-export declare class SvelteTransformer extends Transformer {
+export type RuntimeCtxSv = {
+    module: boolean;
+};
+export declare class SvelteTransformer extends Transformer<RuntimeCtxSv> {
     currentElement?: string;
     inCompoundText: boolean;
-    commentDirectivesStack: CommentDirectives[];
-    lastVisitIsComment: boolean;
     currentSnippet: number;
     moduleExportRanges: [number, number][];
     mixedVisitor: MixedVisitor<MixedNodesTypes>;
-    constructor(content: string, filename: string, index: IndexTracker, heuristic: HeuristicFunc, patterns: CodePattern[], catalogExpr: CatalogExpr, rtConf: RuntimeConf, matchUrl: UrlMatcher);
+    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>;

package/dist/transformer.js

@@ -1,10 +1,10 @@
-import MagicString from "magic-string";
-import { parse, preprocess } from "svelte/compiler";
-import { Message } from 'wuchale';
-import { Transformer, parseScript } from 'wuchale/adapter-vanilla';
-import { MixedVisitor, nonWhitespaceText, processCommentDirectives, varNames } from "wuchale/adapter-utils";
+import MagicString from 'magic-string';
+import { parse, preprocess } from 'svelte/compiler';
+import { MixedVisitor, nonWhitespaceText, varNames } from 'wuchale/adapter-utils';
+import { parseScript, Transformer } from 'wuchale/adapter-vanilla';
 const nodesWithChildren = ['RegularElement', 'Component'];
 const rtComponent = 'W_tx_';
+const headerAdd = `\nimport ${rtComponent} from "@wuchale/svelte/runtime.svelte"`;
 const snipPrefix = '_w_snippet_';
 const rtModuleVar = varNames.rt + 'mod_';
 // for use before actually parsing the code,
@@ -21,23 +21,26 @@ export class SvelteTransformer extends Transformer {
     // state
     currentElement;
     inCompoundText = false;
-    commentDirectivesStack = [];
-    lastVisitIsComment = false;
     currentSnippet = 0;
     moduleExportRanges = []; // 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;
     }
     visitExpressionTag = (node) => this.visit(node.expression);
     visitVariableDeclarator = (node) => {
         const msgs = this.defaultVisitVariableDeclarator(node);
         const init = node.init;
-        if (!msgs.length || this.declaring != null || init == null || ['ArrowFunctionExpression', 'FunctionExpression'].includes(init.type)) {
+        if (!msgs.length ||
+            this.heuristciDetails.declaring != null ||
+            init == null ||
+            ['ArrowFunctionExpression', 'FunctionExpression'].includes(init.type)) {
             return msgs;
         }
-        const needsWrapping = msgs.some(msg => {
-            if (msg.details.topLevelCall && ['$props', '$state', '$derived', '$derived.by'].includes(msg.details.topLevelCall)) {
+        const needsWrapping = msgs.some((msg) => {
+            if (msg.details.topLevelCall &&
+                ['$props', '$state', '$derived', '$derived.by'].includes(msg.details.topLevelCall)) {
                 return false;
             }
             if (msg.details.declaring !== 'variable') {
@@ -58,13 +61,13 @@ export class SvelteTransformer extends Transformer {
     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',
+        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,
+        getCommentData: (node) => node.data.trim(),
         canHaveChildren: (node) => nodesWithChildren.includes(node.type),
         visitFunc: (child, inCompoundText) => {
             const inCompoundTextPrev = this.inCompoundText;
@@ -115,7 +118,7 @@ export class SvelteTransformer extends Transformer {
         inCompoundText: this.inCompoundText,
         scope: 'markup',
         element: this.currentElement,
-        useComponent: this.currentElement !== 'title'
+        useComponent: this.currentElement !== 'title',
     });
     visitRegularElement = (node) => {
         const currentElement = this.currentElement;
@@ -220,10 +223,7 @@ export class SvelteTransformer extends Transformer {
         return msgs;
     };
     visitEachBlock = (node) => {
-        const msgs = [
-            ...this.visit(node.expression),
-            ...this.visitSv(node.body),
-        ];
+        const msgs = [...this.visit(node.expression), ...this.visitSv(node.body)];
         if (node.key) {
             msgs.push(...this.visit(node.key));
         }
@@ -233,10 +233,7 @@ export class SvelteTransformer extends Transformer {
         return msgs;
     };
     visitKeyBlock = (node) => {
-        return [
-            ...this.visit(node.expression),
-            ...this.visitSv(node.fragment),
-        ];
+        return [...this.visit(node.expression), ...this.visitSv(node.fragment)];
     };
     visitAwaitBlock = (node) => {
         const msgs = this.visit(node.expression);
@@ -251,32 +248,32 @@ export class SvelteTransformer extends Transformer {
         }
         return msgs;
     };
-    visitSvelteBody = (node) => node.attributes.map(this.visitSv).flat();
-    visitSvelteDocument = (node) => node.attributes.map(this.visitSv).flat();
-    visitSvelteElement = (node) => node.attributes.map(this.visitSv).flat();
+    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.map(this.visitSv).flat(),
+        ...node.attributes.flatMap(this.visitSv),
         ...this.visitSv(node.fragment),
     ];
     visitSvelteHead = (node) => this.visitSv(node.fragment);
     visitTitleElement = (node) => this.visitRegularElement(node);
-    visitSvelteWindow = (node) => node.attributes.map(this.visitSv).flat();
+    visitSvelteWindow = (node) => node.attributes.flatMap(this.visitSv);
     visitRoot = (node) => {
         const msgs = [];
         if (node.module) {
             const prevRtVar = this.currentRtVar;
             this.currentRtVar = rtModuleVar;
-            this.additionalState = { module: true };
+            this.runtimeCtx = { module: true };
             this.commentDirectives = {}; // reset
             // @ts-expect-error
             msgs.push(...this.visitProgram(node.module.content));
-            const runtimeInit = this.initRuntime(this.filename);
+            const runtimeInit = this.initRuntime();
             if (runtimeInit) {
                 this.mstr.appendRight(
                 // @ts-expect-error
                 this.getRealBodyStart(node.module.content.body) ?? node.module.content.start, runtimeInit);
             }
-            this.additionalState = {}; // reset
+            this.runtimeCtx = { module: false }; // reset
             this.currentRtVar = prevRtVar; // reset
         }
         if (node.instance) {
@@ -286,36 +283,7 @@ export class SvelteTransformer extends Transformer {
         msgs.push(...this.visitFragment(node.fragment));
         return msgs;
     };
-    visitSv = (node) => {
-        if (node.type === 'Comment') {
-            this.commentDirectives = processCommentDirectives(node.data.trim(), this.commentDirectives);
-            if (this.lastVisitIsComment) {
-                this.commentDirectivesStack[this.commentDirectivesStack.length - 1] = this.commentDirectives;
-            }
-            else {
-                this.commentDirectivesStack.push(this.commentDirectives);
-            }
-            this.lastVisitIsComment = true;
-            return [];
-        }
-        if (node.type === 'Text' && !node.data.trim()) {
-            return [];
-        }
-        let msgs = [];
-        const commentDirectivesPrev = this.commentDirectives;
-        if (this.lastVisitIsComment) {
-            this.commentDirectives = this.commentDirectivesStack.pop();
-            this.lastVisitIsComment = false;
-        }
-        if (this.commentDirectives.ignoreFile) {
-            return [];
-        }
-        if (this.commentDirectives.forceType !== false) {
-            msgs = this.visit(node);
-        }
-        this.commentDirectives = commentDirectivesPrev;
-        return msgs;
-    };
+    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) => {
         for (const stmt of script.content.body) {
@@ -345,16 +313,15 @@ export class SvelteTransformer extends Transformer {
         }
     };
     transformSv = async () => {
-        const isComponent = this.filename.endsWith('.svelte');
+        const isComponent = this.heuristciDetails.file.endsWith('.svelte');
         let ast;
         if (isComponent) {
             const prepd = await preprocess(this.content, { style: removeSCSS });
             ast = parse(prepd.code, { modern: true });
         }
         else {
-            const [pAst, comments] = parseScript(this.content);
-            ast = pAst;
-            this.comments = comments;
+            ;
+            [ast, this.comments] = parseScript(this.content);
         }
         this.mstr = new MagicString(this.content);
         this.mixedVisitor = this.initMixedVisitor();
@@ -362,7 +329,7 @@ export class SvelteTransformer extends Transformer {
             this.collectModuleExportRanges(ast.module);
         }
         const msgs = this.visitSv(ast);
-        const initRuntime = this.initRuntime(this.filename);
+        const initRuntime = this.initRuntime();
         if (ast.type === 'Program') {
             const bodyStart = this.getRealBodyStart(ast.body) ?? 0;
             if (initRuntime) {
@@ -392,7 +359,6 @@ export class SvelteTransformer extends Transformer {
             this.mstr.prependRight(instanceStart, `${initRuntime}\n</script>\n`);
             // now hmr data can be prependRight(0, ...)
         }
-        const headerAdd = `\nimport ${rtComponent} from "@wuchale/svelte/runtime.svelte"`;
         return this.finalize(msgs, headerIndex, headerAdd);
     };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@wuchale/svelte",
-    "version": "0.17.9",
+    "version": "0.18.1",
     "description": "Protobuf-like i18n from plain code: Svelte adapter",
     "scripts": {
         "dev": "tsc --watch",
@@ -53,7 +53,7 @@
     "dependencies": {
         "svelte": "^5.37.0",
         "magic-string": "^0.30.21",
-        "wuchale": "^0.18.8"
+        "wuchale": "^0.19.1"
     },
     "devDependencies": {
         "acorn": "^8.15.0",

package/src/loaders/bundle.svelte.js

@@ -1,11 +1,11 @@
-import toRuntime from "wuchale/runtime"
+import toRuntime from 'wuchale/runtime'
 import { locales } from '${DATA}'
 
 let locale = $state(locales[0])
 
 /**
  * @param {string} newLocale
-*/
+ */
 export function setLocale(newLocale) {
     locale = newLocale
 }
@@ -13,8 +13,8 @@ export function setLocale(newLocale) {
 // for non-reactive
 /**
  * @param {{ [locale: string]: import("wuchale/runtime").CatalogModule }} catalogs
-*/ 
-export const getRuntime = catalogs => toRuntime(catalogs[locale], locale)
+ */
+export const getRuntime = (catalogs) => toRuntime(catalogs[locale], locale)
 
 // same function, only will be inside $derived when used
 export const getRuntimeRx = getRuntime

package/src/loaders/svelte.svelte.js

@@ -1,5 +1,5 @@
+import { defaultCollection, registerLoaders } from 'wuchale/load-utils'
 import { loadCatalog, loadIDs } from '${PROXY}'
-import { registerLoaders, defaultCollection } from 'wuchale/load-utils'
 
 const key = '${KEY}'
 

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

@@ -1,5 +1,5 @@
-import { loadCatalog, loadIDs } from '${PROXY_SYNC}'
 import { currentRuntime } from 'wuchale/load-utils/server'
+import { loadCatalog, loadIDs } from '${PROXY_SYNC}'
 
 const key = '${KEY}'
 

package/src/runtime.svelte

@@ -1,5 +1,5 @@
 <script>
-    const {n = false, x, t, a} = $props()
+const { n = false, x, t, a } = $props()
 </script>
 
 {#each x as fragment, i}