@wuchale/jsx 0.10.1 → 0.11.0

package/dist/index.d.ts

@@ -6,6 +6,7 @@ type LoadersAvailable = 'default' | 'react' | 'solidjs';
 export type JSXArgs = AdapterArgs<LoadersAvailable> & {
     variant: JSXLib;
 };
+export declare const defaultArgs: JSXArgs;
 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 { getDefaultLoaderPath as getDefaultLoaderPathVanilla, pluralPattern } from 'wuchale/adapter-vanilla';
 import { JSXTransformer } from './transformer.js';
 export function createJsxHeuristic(opts) {
     const defaultHeuristic = createHeuristic(opts);
-    return (msg) => {
+    return msg => {
         const defRes = defaultHeuristic(msg);
         if (!defRes) {
             return false;
@@ -29,12 +29,12 @@ const defaultRuntime = {
         !nested &&
         ((funcName.startsWith('use') && funcName.length > 3) || /[A-Z]/.test(funcName[0])),
     reactive: {
-        wrapInit: (expr) => expr,
-        wrapUse: (expr) => expr,
+        wrapInit: expr => expr,
+        wrapUse: expr => expr,
     },
     plain: {
-        wrapInit: (expr) => expr,
-        wrapUse: (expr) => expr,
+        wrapInit: expr => expr,
+        wrapUse: expr => expr,
     },
 };
 const defaultRuntimeSolid = {
@@ -42,13 +42,13 @@ const defaultRuntimeSolid = {
     initReactive: ({ funcName }) => (funcName == null ? true : null), // init only in top level
     useReactive: true, // always reactive, because solidjs doesn't have a problem with it
     reactive: {
-        wrapInit: (expr) => `() => ${expr}`,
-        wrapUse: (expr) => `${expr}()`,
+        wrapInit: expr => `() => ${expr}`,
+        wrapUse: expr => `${expr}()`,
     },
 };
-const defaultArgs = {
+export const defaultArgs = {
     files: { include: 'src/**/*.{js,ts,jsx,tsx}', ignore: '**/*.d.ts' },
-    localesDir: './src/locales',
+    storage: pofile(),
     patterns: [pluralPattern],
     heuristic: jsxDefaultHeuristic,
     granularLoad: false,

package/dist/transformer.js

@@ -1,6 +1,7 @@
 import { tsPlugin } from '@sveltejs/acorn-typescript';
 import { Parser } from 'acorn';
 import MagicString from 'magic-string';
+import { getKey } from 'wuchale';
 import { MixedVisitor, nonWhitespaceText } from 'wuchale/adapter-utils';
 import { parseScript, scriptParseOptionsWithComments, Transformer } from 'wuchale/adapter-vanilla';
 const JsxParser = Parser.extend(tsPlugin({ jsx: true }));
@@ -23,19 +24,19 @@ export class JSXTransformer extends Transformer {
     initMixedVisitor = () => new MixedVisitor({
         mstr: this.mstr,
         vars: this.vars,
-        getRange: (node) => ({
+        getRange: node => ({
             start: node.start,
             end: node.end,
         }),
-        isComment: (node) => node.type === 'JSXExpressionContainer' &&
+        isComment: node => node.type === 'JSXExpressionContainer' &&
             node.expression.type === 'JSXEmptyExpression' &&
             node.expression.end > node.expression.start,
-        isText: (node) => node.type === 'JSXText',
+        isText: node => node.type === 'JSXText',
         leaveInPlace: () => false,
-        isExpression: (node) => node.type === 'JSXExpressionContainer',
+        isExpression: node => node.type === 'JSXExpressionContainer',
         getTextContent: (node) => node.value,
         getCommentData: (node) => this.getMarkupCommentBody(node.expression),
-        canHaveChildren: (node) => nodesWithChildren.includes(node.type),
+        canHaveChildren: node => nodesWithChildren.includes(node.type),
         visitFunc: (child, inCompoundText) => {
             const inCompoundTextPrev = this.inCompoundText;
             this.inCompoundText = inCompoundText;
@@ -67,7 +68,7 @@ export class JSXTransformer 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 = ' />';
@@ -110,7 +111,7 @@ export class JSXTransformer extends Transformer {
             msgs.push(...this.visitJx(attr));
         }
         if (this.inCompoundText && this.currentJsxKey != null) {
-            const key = node.openingElement.attributes.find((attr) => attr.type === 'JSXAttribute' && attr.name.name === 'key');
+            const key = node.openingElement.attributes.find(attr => attr.type === 'JSXAttribute' && attr.name.name === 'key');
             if (!key) {
                 this.mstr.appendLeft(node.openingElement.name.end, ` key="_${this.currentJsxKey}"`);
                 this.currentJsxKey++;
@@ -128,7 +129,7 @@ export class JSXTransformer 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];
     };
     visitJSXFragment = (node) => this.visitChildrenJ(node);
@@ -177,7 +178,7 @@ export class JSXTransformer 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)}}`);
         return [msgInfo];
     };
     visitJSXSpreadAttribute = (node) => this.visit(node.argument);

package/package.json

@@ -1,11 +1,11 @@
 {
     "name": "@wuchale/jsx",
-    "version": "0.10.1",
+    "version": "0.11.0",
     "description": "Protobuf-like i18n from plain code: JSX adapter",
     "scripts": {
         "dev": "tsc --watch",
         "build": "tsc",
-        "test": "node tests/index.ts"
+        "test": "node --import ../wuchale/testing/resolve.ts --test"
     },
     "keywords": [
         "i18n",
@@ -58,10 +58,10 @@
     "author": "K1DV5",
     "license": "MIT",
     "dependencies": {
-        "@sveltejs/acorn-typescript": "^1.0.8",
-        "acorn": "^8.15.0",
+        "@sveltejs/acorn-typescript": "^1.0.9",
+        "acorn": "^8.16.0",
         "magic-string": "^0.30.21",
-        "wuchale": "^0.19.1"
+        "wuchale": "^0.21.0"
     },
     "devDependencies": {
         "@types/estree-jsx": "^1.0.5",

package/src/loaders/react.bundle.js

@@ -5,13 +5,13 @@ import { locales } from '${DATA}'
 let locale = locales[0]
 
 const callbacks = new Set([
-    (/** @type {string} */ loc) => {
+    (/** @type {import('${DATA}').Locale} */ loc) => {
         locale = loc
     },
 ])
 
 /**
- * @param {string} locale
+ * @param {import('${DATA}').Locale} locale
  */
 export function setLocale(locale) {
     for (const callback of callbacks) {

package/src/loaders/react.js

@@ -14,7 +14,7 @@ const collection = {
     get: getRuntime,
     set: (/** @type {string} */ loadID, /** @type {import('wuchale/runtime').Runtime} */ runtime) => {
         store[loadID] = runtime // for when useEffect hasn't run yet
-        callbacks[loadID]?.forEach((cb) => {
+        callbacks[loadID]?.forEach(cb => {
             cb(runtime)
         })
     },

package/src/loaders/solidjs.bundle.js

@@ -8,6 +8,6 @@ export { setLocale }
 /**
  * @param {{ [locale: string]: import('wuchale/runtime').CatalogModule }} catalogs
  */
-export const getRuntimeRx = (catalogs) => toRuntime(catalogs[locale()], locale())
+export const getRuntimeRx = catalogs => toRuntime(catalogs[locale()], locale())
 // same function, because solid-js can use them anywhere
 export const getRuntime = getRuntimeRx

package/src/loaders/solidjs.js

@@ -8,7 +8,7 @@ const [store, setStore] = createStore({})
 
 // two exports. can be the same because solid-js can use them anywhere unlike react
 export const getRuntimeRx = registerLoaders(key, loadCatalog, loadIDs, {
-    get: (loadID) => store[loadID],
+    get: loadID => store[loadID],
     set: (loadID, runtime) => setStore(loadID, () => runtime),
 })
 export const getRuntime = getRuntimeRx