@wuchale/jsx 0.10.0 → 0.10.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import type { HeuristicFunc, Adapter, AdapterArgs, LoaderChoice, CreateHeuristicOpts } from 'wuchale';
2
- import { type JSXLib } from "./transformer.js";
1
+ import type { Adapter, AdapterArgs, CreateHeuristicOpts, HeuristicFunc, LoaderChoice } from 'wuchale';
2
+ import { type JSXLib } from './transformer.js';
3
3
  export declare function createJsxHeuristic(opts: CreateHeuristicOpts): HeuristicFunc;
4
4
  export declare const jsxDefaultHeuristic: HeuristicFunc;
5
5
  type LoadersAvailable = 'default' | 'react' | 'solidjs';
package/dist/index.js CHANGED
@@ -1,10 +1,10 @@
1
- import { defaultGenerateLoadID, deepMergeObjects, createHeuristic, defaultHeuristicOpts } from 'wuchale';
2
- import { pluralPattern, getDefaultLoaderPath as getDefaultLoaderPathVanilla } from 'wuchale/adapter-vanilla';
3
- import { JSXTransformer } from "./transformer.js";
1
+ import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts } from 'wuchale';
4
2
  import { loaderPathResolver } from 'wuchale/adapter-utils';
3
+ import { getDefaultLoaderPath as getDefaultLoaderPathVanilla, pluralPattern } from 'wuchale/adapter-vanilla';
4
+ import { JSXTransformer } from './transformer.js';
5
5
  export function createJsxHeuristic(opts) {
6
6
  const defaultHeuristic = createHeuristic(opts);
7
- return msg => {
7
+ return (msg) => {
8
8
  const defRes = defaultHeuristic(msg);
9
9
  if (!defRes) {
10
10
  return false;
@@ -25,26 +25,26 @@ const defaultRuntime = {
25
25
  const insideReactive = !inTopLevel && !nested && ((funcName.startsWith('use') && funcName.length > 3) || /[A-Z]/.test(funcName[0]));
26
26
  return inTopLevel ? null : insideReactive;
27
27
  },
28
- useReactive: ({ funcName, nested }) => funcName != null
29
- && !nested
30
- && ((funcName.startsWith('use') && funcName.length > 3) || /[A-Z]/.test(funcName[0])),
28
+ useReactive: ({ funcName, nested }) => funcName != null &&
29
+ !nested &&
30
+ ((funcName.startsWith('use') && funcName.length > 3) || /[A-Z]/.test(funcName[0])),
31
31
  reactive: {
32
- wrapInit: expr => expr,
33
- wrapUse: expr => expr,
32
+ wrapInit: (expr) => expr,
33
+ wrapUse: (expr) => expr,
34
34
  },
35
35
  plain: {
36
- wrapInit: expr => expr,
37
- wrapUse: expr => expr,
36
+ wrapInit: (expr) => expr,
37
+ wrapUse: (expr) => expr,
38
38
  },
39
39
  };
40
40
  const defaultRuntimeSolid = {
41
41
  ...defaultRuntime,
42
- initReactive: ({ funcName }) => funcName == null ? true : null, // init only in top level
42
+ initReactive: ({ funcName }) => (funcName == null ? true : null), // init only in top level
43
43
  useReactive: true, // always reactive, because solidjs doesn't have a problem with it
44
44
  reactive: {
45
- wrapInit: expr => `() => ${expr}`,
46
- wrapUse: expr => `${expr}()`
47
- }
45
+ wrapInit: (expr) => `() => ${expr}`,
46
+ wrapUse: (expr) => `${expr}()`,
47
+ },
48
48
  };
49
49
  const defaultArgs = {
50
50
  files: { include: 'src/**/*.{js,ts,jsx,tsx}', ignore: '**/*.d.ts' },
@@ -84,7 +84,7 @@ export const adapter = (args = defaultArgs) => {
84
84
  defaultLoaderPath: getDefaultLoaderPath(loader, rest.bundleLoad),
85
85
  runtime,
86
86
  getRuntimeVars: {
87
- reactive: 'useW_load_rx_'
87
+ reactive: 'useW_load_rx_',
88
88
  },
89
89
  ...rest,
90
90
  };
@@ -1,7 +1,7 @@
1
- import { selectFragment } from './runtime.jsx';
2
1
  import { For } from 'solid-js';
2
+ import { selectFragment } from './runtime.jsx';
3
3
  export default (props) => {
4
- return <For each={props.x}>
5
- {(fragment, i) => <>{selectFragment({ ...props, x: fragment }, i())}</>}
6
- </For>;
4
+ return (<For each={props.x}>
5
+ {(fragment, i) => <>{selectFragment({ ...props, x: fragment }, i())}</>}
6
+ </For>);
7
7
  };
@@ -1,16 +1,14 @@
1
- import { Message } from 'wuchale';
2
- import type * as JX from 'estree-jsx';
3
1
  import type * as Estree from 'acorn';
2
+ import type * as JX from 'estree-jsx';
3
+ import type { CatalogExpr, CodePattern, HeuristicFunc, IndexTracker, Message, RuntimeConf, TransformOutput, UrlMatcher } from 'wuchale';
4
+ import { MixedVisitor } from 'wuchale/adapter-utils';
4
5
  import { Transformer } from 'wuchale/adapter-vanilla';
5
- import type { IndexTracker, HeuristicFunc, TransformOutput, RuntimeConf, CatalogExpr, CodePattern, UrlMatcher } from 'wuchale';
6
- import { MixedVisitor, type CommentDirectives } from "wuchale/adapter-utils";
7
6
  export declare function parseScriptJSX(content: string): [Estree.Program, Estree.Comment[][]];
8
7
  type MixedNodesTypes = JX.JSXElement | JX.JSXFragment | JX.JSXText | JX.JSXExpressionContainer | JX.JSXSpreadChild;
9
8
  export type JSXLib = 'default' | 'solidjs';
10
9
  export declare class JSXTransformer extends Transformer {
11
10
  currentElement?: string;
12
11
  inCompoundText: boolean;
13
- commentDirectivesStack: CommentDirectives[];
14
12
  lastVisitIsComment: boolean;
15
13
  currentJsxKey?: number;
16
14
  mixedVisitor: MixedVisitor<MixedNodesTypes>;
@@ -28,7 +26,6 @@ export declare class JSXTransformer extends Transformer {
28
26
  visitJSXExpressionContainer: (node: JX.JSXExpressionContainer) => Message[];
29
27
  visitJSXAttribute: (node: JX.JSXAttribute) => Message[];
30
28
  visitJSXSpreadAttribute: (node: JX.JSXSpreadAttribute) => Message[];
31
- visitJSXEmptyExpression: (node: JX.JSXEmptyExpression) => Message[];
32
29
  visitJx: (node: JX.Node | JX.JSXSpreadChild | Estree.Program) => Message[];
33
30
  transformJx: (lib: JSXLib) => TransformOutput;
34
31
  }
@@ -1,9 +1,8 @@
1
- import MagicString from 'magic-string';
2
- import { Parser } from 'acorn';
3
- import { Message } from 'wuchale';
4
1
  import { tsPlugin } from '@sveltejs/acorn-typescript';
5
- import { Transformer, scriptParseOptionsWithComments, parseScript } from 'wuchale/adapter-vanilla';
6
- import { nonWhitespaceText, MixedVisitor, processCommentDirectives } from "wuchale/adapter-utils";
2
+ import { Parser } from 'acorn';
3
+ import MagicString from 'magic-string';
4
+ import { MixedVisitor, nonWhitespaceText } from 'wuchale/adapter-utils';
5
+ import { parseScript, scriptParseOptionsWithComments, Transformer } from 'wuchale/adapter-vanilla';
7
6
  const JsxParser = Parser.extend(tsPlugin({ jsx: true }));
8
7
  export function parseScriptJSX(content) {
9
8
  const [opts, comments] = scriptParseOptionsWithComments();
@@ -15,7 +14,6 @@ export class JSXTransformer extends Transformer {
15
14
  // state
16
15
  currentElement;
17
16
  inCompoundText = false;
18
- commentDirectivesStack = [];
19
17
  lastVisitIsComment = false;
20
18
  currentJsxKey;
21
19
  mixedVisitor;
@@ -25,19 +23,19 @@ export class JSXTransformer extends Transformer {
25
23
  initMixedVisitor = () => new MixedVisitor({
26
24
  mstr: this.mstr,
27
25
  vars: this.vars,
28
- getRange: node => ({
26
+ getRange: (node) => ({
29
27
  start: node.start,
30
- end: node.end
28
+ end: node.end,
31
29
  }),
32
- isComment: node => node.type === 'JSXExpressionContainer'
33
- && node.expression.type === 'JSXEmptyExpression'
34
- && node.expression.end > node.expression.start,
35
- isText: node => node.type === 'JSXText',
30
+ isComment: (node) => node.type === 'JSXExpressionContainer' &&
31
+ node.expression.type === 'JSXEmptyExpression' &&
32
+ node.expression.end > node.expression.start,
33
+ isText: (node) => node.type === 'JSXText',
36
34
  leaveInPlace: () => false,
37
- isExpression: node => node.type === 'JSXExpressionContainer',
35
+ isExpression: (node) => node.type === 'JSXExpressionContainer',
38
36
  getTextContent: (node) => node.value,
39
37
  getCommentData: (node) => this.getMarkupCommentBody(node.expression),
40
- canHaveChildren: node => nodesWithChildren.includes(node.type),
38
+ canHaveChildren: (node) => nodesWithChildren.includes(node.type),
41
39
  visitFunc: (child, inCompoundText) => {
42
40
  const inCompoundTextPrev = this.inCompoundText;
43
41
  this.inCompoundText = inCompoundText;
@@ -112,7 +110,7 @@ export class JSXTransformer extends Transformer {
112
110
  msgs.push(...this.visitJx(attr));
113
111
  }
114
112
  if (this.inCompoundText && this.currentJsxKey != null) {
115
- const key = node.openingElement.attributes.find(attr => attr.type === 'JSXAttribute' && attr.name.name === 'key');
113
+ const key = node.openingElement.attributes.find((attr) => attr.type === 'JSXAttribute' && attr.name.name === 'key');
116
114
  if (!key) {
117
115
  this.mstr.appendLeft(node.openingElement.name.end, ` key="_${this.currentJsxKey}"`);
118
116
  this.currentJsxKey++;
@@ -141,9 +139,7 @@ export class JSXTransformer extends Transformer {
141
139
  }
142
140
  return comment.slice(2, -2).trim();
143
141
  };
144
- visitJSXExpressionContainer = (node) => {
145
- return this.visit(node.expression);
146
- };
142
+ visitJSXExpressionContainer = (node) => this.visit(node.expression);
147
143
  visitJSXAttribute = (node) => {
148
144
  if (node.value == null) {
149
145
  return [];
@@ -185,43 +181,7 @@ export class JSXTransformer extends Transformer {
185
181
  return [msgInfo];
186
182
  };
187
183
  visitJSXSpreadAttribute = (node) => this.visit(node.argument);
188
- visitJSXEmptyExpression = (node) => {
189
- const commentContents = this.getMarkupCommentBody(node);
190
- if (!commentContents) {
191
- return [];
192
- }
193
- this.commentDirectives = processCommentDirectives(commentContents, this.commentDirectives);
194
- if (this.lastVisitIsComment) {
195
- this.commentDirectivesStack[this.commentDirectivesStack.length - 1] = this.commentDirectives;
196
- }
197
- else {
198
- this.commentDirectivesStack.push(this.commentDirectives);
199
- }
200
- this.lastVisitIsComment = true;
201
- return [];
202
- };
203
- visitJx = (node) => {
204
- if (node.type === 'JSXText' && !node.value.trim()) {
205
- return [];
206
- }
207
- if (node.type === 'JSXExpressionContainer' && node.expression.type === 'JSXEmptyExpression') { // markup comment
208
- return this.visitJSXEmptyExpression(node.expression);
209
- }
210
- let msgs = [];
211
- const commentDirectivesPrev = this.commentDirectives;
212
- if (this.lastVisitIsComment) {
213
- this.commentDirectives = this.commentDirectivesStack.pop();
214
- this.lastVisitIsComment = false;
215
- }
216
- if (this.commentDirectives.ignoreFile) {
217
- return [];
218
- }
219
- if (this.commentDirectives.forceType !== false) {
220
- msgs = this.visit(node);
221
- }
222
- this.commentDirectives = commentDirectivesPrev;
223
- return msgs;
224
- };
184
+ visitJx = (node) => this.visit(node);
225
185
  transformJx = (lib) => {
226
186
  // jsx vs type casting is not ambiguous in all files except .ts files
227
187
  const [ast, comments] = (this.heuristciDetails.file.endsWith('.ts') ? parseScript : parseScriptJSX)(this.content);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wuchale/jsx",
3
- "version": "0.10.0",
3
+ "version": "0.10.1",
4
4
  "description": "Protobuf-like i18n from plain code: JSX adapter",
5
5
  "scripts": {
6
6
  "dev": "tsc --watch",
@@ -61,7 +61,7 @@
61
61
  "@sveltejs/acorn-typescript": "^1.0.8",
62
62
  "acorn": "^8.15.0",
63
63
  "magic-string": "^0.30.21",
64
- "wuchale": "^0.19.0"
64
+ "wuchale": "^0.19.1"
65
65
  },
66
66
  "devDependencies": {
67
67
  "@types/estree-jsx": "^1.0.5",
@@ -1,10 +1,14 @@
1
- import { useState, useEffect, useMemo } from 'react'
1
+ import { useEffect, useMemo, useState } from 'react'
2
2
  import toRuntime from 'wuchale/runtime'
3
3
  import { locales } from '${DATA}'
4
4
 
5
5
  let locale = locales[0]
6
6
 
7
- const callbacks = new Set([(/** @type {string} */ loc) => {locale = loc}])
7
+ const callbacks = new Set([
8
+ (/** @type {string} */ loc) => {
9
+ locale = loc
10
+ },
11
+ ])
8
12
 
9
13
  /**
10
14
  * @param {string} locale
@@ -26,4 +30,5 @@ export const getRuntimeRx = (/** @type {{[locale: string]: import('wuchale/runti
26
30
  }
27
31
 
28
32
  // non-reactive
29
- export const getRuntime = (/** @type {{[locale: string]: import('wuchale/runtime').CatalogModule }} */ catalogs) => toRuntime(catalogs[locale], locale)
33
+ export const getRuntime = (/** @type {{[locale: string]: import('wuchale/runtime').CatalogModule }} */ catalogs) =>
34
+ toRuntime(catalogs[locale], locale)
@@ -1,6 +1,6 @@
1
- import { loadCatalog, loadIDs } from '${PROXY}'
1
+ import { useEffect, useState } from 'react'
2
2
  import { registerLoaders } from 'wuchale/load-utils'
3
- import { useState, useEffect } from 'react'
3
+ import { loadCatalog, loadIDs } from '${PROXY}'
4
4
 
5
5
  export const key = '${KEY}'
6
6
  /** @type {{[loadID: string]: Set<Function>}} */
@@ -14,8 +14,10 @@ const collection = {
14
14
  get: getRuntime,
15
15
  set: (/** @type {string} */ loadID, /** @type {import('wuchale/runtime').Runtime} */ runtime) => {
16
16
  store[loadID] = runtime // for when useEffect hasn't run yet
17
- callbacks[loadID]?.forEach(cb => cb(runtime))
18
- }
17
+ callbacks[loadID]?.forEach((cb) => {
18
+ cb(runtime)
19
+ })
20
+ },
19
21
  }
20
22
 
21
23
  registerLoaders(key, loadCatalog, loadIDs, collection)
@@ -1,5 +1,5 @@
1
- import { createSignal } from "solid-js"
2
- import toRuntime from "wuchale/runtime"
1
+ import { createSignal } from 'solid-js'
2
+ import toRuntime from 'wuchale/runtime'
3
3
 
4
4
  const [locale, setLocale] = createSignal('en')
5
5
 
@@ -8,6 +8,6 @@ export { setLocale }
8
8
  /**
9
9
  * @param {{ [locale: string]: import('wuchale/runtime').CatalogModule }} catalogs
10
10
  */
11
- export const getRuntimeRx = catalogs => toRuntime(catalogs[locale()], locale())
11
+ export const getRuntimeRx = (catalogs) => toRuntime(catalogs[locale()], locale())
12
12
  // same function, because solid-js can use them anywhere
13
13
  export const getRuntime = getRuntimeRx
@@ -1,6 +1,6 @@
1
- import { loadCatalog, loadIDs } from '${PROXY}'
2
- import { registerLoaders } from 'wuchale/load-utils'
3
1
  import { createStore } from 'solid-js/store'
2
+ import { registerLoaders } from 'wuchale/load-utils'
3
+ import { loadCatalog, loadIDs } from '${PROXY}'
4
4
 
5
5
  const key = '${KEY}'
6
6
 
@@ -8,7 +8,7 @@ const [store, setStore] = createStore({})
8
8
 
9
9
  // two exports. can be the same because solid-js can use them anywhere unlike react
10
10
  export const getRuntimeRx = registerLoaders(key, loadCatalog, loadIDs, {
11
- get: loadID => store[loadID],
11
+ get: (loadID) => store[loadID],
12
12
  set: (loadID, runtime) => setStore(loadID, () => runtime),
13
13
  })
14
14
  export const getRuntime = getRuntimeRx