@wuchale/svelte 0.18.1 → 0.19.0

package/README.md

@@ -10,5 +10,5 @@ automatically extracts and replaces translatable strings at build time.
 
 - Main documentation: [wuchale.dev](https://wuchale.dev)
 - Setup instructions: [Getting started](https://wuchale.dev/intro/start/)
-- Adapter docs: [JSX](https://wuchale.dev/adapters/svelte)
+- Adapter docs: [Svelte](https://wuchale.dev/adapters/svelte)
 - Repository: [wuchalejs/wuchale](https://github.com/wuchalejs/wuchale)

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export declare const svelteKitDefaultHeuristic: HeuristicFunc;
 export declare const svelteDefaultHeuristicDerivedReq: HeuristicFunc;
 type LoadersAvailable = 'svelte' | 'sveltekit';
 export type SvelteArgs = AdapterArgs<LoadersAvailable, RuntimeCtxSv>;
+export declare const defaultArgs: SvelteArgs;
 export declare function getDefaultLoaderPath(loader: LoaderChoice<LoadersAvailable>, bundle: boolean): string | {
     client: string;
     server: string;

package/dist/index.js

@@ -1,10 +1,10 @@
-import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts } from 'wuchale';
+import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts, pofile } 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;
@@ -38,9 +38,9 @@ export const svelteDefaultHeuristicDerivedReq = (msg) => {
     }
     return false;
 };
-const defaultArgs = {
+export const defaultArgs = {
     files: ['src/**/*.svelte', 'src/**/*.svelte.{js,ts}'],
-    localesDir: './src/locales',
+    storage: pofile(),
     patterns: [pluralPattern],
     heuristic: svelteKitDefaultHeuristic,
     granularLoad: false,
@@ -57,12 +57,12 @@ const defaultArgs = {
             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.js

@@ -1,5 +1,6 @@
 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'];
@@ -8,15 +9,11 @@ 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,
-// to remove the contents of e.g. <style lang="scss">
+// to remove the contents of e.g. <style lang="scss"> which can cause parse errors
 // without messing up indices for magic-string
-const removeSCSS = ({ attributes, content }) => {
-    if (attributes.lang) {
-        return {
-            code: ' '.repeat(content.length),
-        };
-    }
-};
+const removeCSS = ({ content }) => ({
+    code: ' '.repeat(content.length),
+});
 export class SvelteTransformer extends Transformer {
     // state
     currentElement;
@@ -38,7 +35,7 @@ export class SvelteTransformer extends Transformer {
             ['ArrowFunctionExpression', 'FunctionExpression'].includes(init.type)) {
             return msgs;
         }
-        const needsWrapping = msgs.some((msg) => {
+        const needsWrapping = msgs.some(msg => {
             if (msg.details.topLevelCall &&
                 ['$props', '$state', '$derived', '$derived.by'].includes(msg.details.topLevelCall)) {
                 return false;
@@ -61,11 +58,11 @@ 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.trim(),
         canHaveChildren: (node) => nodesWithChildren.includes(node.type),
@@ -100,7 +97,7 @@ export class SvelteTransformer extends Transformer {
                 begin += `{${this.vars().nestCtx}} n`;
             }
             else {
-                const index = this.index.get(msgInfo.toKey());
+                const index = this.index.get(getKey(msgInfo.msgStr, msgInfo.context));
                 begin += `{${this.vars().rtCtx}(${index})}`;
             }
             let end = ' />\n';
@@ -141,7 +138,7 @@ export class SvelteTransformer extends Transformer {
         if (!pass) {
             return [];
         }
-        this.mstr.update(node.start + startWh, node.end - endWh, `{${this.vars().rtTrans}(${this.index.get(msgInfo.toKey())})}`);
+        this.mstr.update(node.start + startWh, node.end - endWh, `{${this.vars().rtTrans}(${this.index.get(getKey(msgInfo.msgStr, msgInfo.context))})}`);
         return [msgInfo];
     };
     visitSpreadAttribute = (node) => this.visit(node.expression);
@@ -188,7 +185,7 @@ export class SvelteTransformer extends Transformer {
         if (!pass) {
             return [];
         }
-        this.mstr.update(value.start, value.end, `{${this.vars().rtTrans}(${this.index.get(msgInfo.toKey())})}`);
+        this.mstr.update(value.start, value.end, `{${this.literalRepl(msgInfo)}}`);
         if (`'"`.includes(this.content[value.start - 1])) {
             this.mstr.remove(value.start - 1, value.start);
             this.mstr.remove(value.end, value.end + 1);
@@ -316,7 +313,7 @@ export class SvelteTransformer extends Transformer {
         const isComponent = this.heuristciDetails.file.endsWith('.svelte');
         let ast;
         if (isComponent) {
-            const prepd = await preprocess(this.content, { style: removeSCSS });
+            const prepd = await preprocess(this.content, { style: removeCSS });
             ast = parse(prepd.code, { modern: true });
         }
         else {

package/package.json

@@ -1,11 +1,11 @@
 {
     "name": "@wuchale/svelte",
-    "version": "0.18.1",
+    "version": "0.19.0",
     "description": "Protobuf-like i18n from plain code: Svelte adapter",
     "scripts": {
         "dev": "tsc --watch",
         "build": "tsc",
-        "test": "node tests/index.ts"
+        "test": "node --import ../wuchale/testing/resolve.ts --test"
     },
     "keywords": [
         "i18n",
@@ -51,12 +51,12 @@
     "author": "K1DV5",
     "license": "MIT",
     "dependencies": {
-        "svelte": "^5.37.0",
         "magic-string": "^0.30.21",
-        "wuchale": "^0.19.1"
+        "svelte": "^5",
+        "wuchale": "^0.21.0"
     },
     "devDependencies": {
-        "acorn": "^8.15.0",
+        "acorn": "^8.16.0",
         "typescript": "^5.9.3"
     },
     "type": "module"

package/src/loaders/bundle.svelte.js

@@ -4,7 +4,7 @@ import { locales } from '${DATA}'
 let locale = $state(locales[0])
 
 /**
- * @param {string} newLocale
+ * @param {import('${DATA}').Locale} newLocale
  */
 export function setLocale(newLocale) {
     locale = newLocale
@@ -14,7 +14,7 @@ export function setLocale(newLocale) {
 /**
  * @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