@wuchale/svelte 0.18.0 → 0.18.2
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/README.md +1 -1
- package/dist/index.d.ts +3 -2
- package/dist/index.js +4 -4
- package/dist/transformer.d.ts +4 -7
- package/dist/transformer.js +28 -67
- package/package.json +4 -4
- package/src/loaders/bundle.svelte.js +3 -3
- package/src/loaders/svelte.svelte.js +1 -1
- package/src/loaders/sveltekit.ssr.svelte.js +1 -1
- package/src/runtime.svelte +1 -1
package/README.md
CHANGED
|
@@ -10,5 +10,5 @@ automatically extracts and replaces translatable strings at build time.
|
|
|
10
10
|
|
|
11
11
|
- Main documentation: [wuchale.dev](https://wuchale.dev)
|
|
12
12
|
- Setup instructions: [Getting started](https://wuchale.dev/intro/start/)
|
|
13
|
-
- Adapter docs: [
|
|
13
|
+
- Adapter docs: [Svelte](https://wuchale.dev/adapters/svelte)
|
|
14
14
|
- Repository: [wuchalejs/wuchale](https://github.com/wuchalejs/wuchale)
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
import { type RuntimeCtxSv } from
|
|
1
|
+
import type { Adapter, AdapterArgs, CreateHeuristicOpts, HeuristicFunc, LoaderChoice } from 'wuchale';
|
|
2
|
+
import { type RuntimeCtxSv } from './transformer.js';
|
|
3
3
|
export type { RuntimeCtxSv };
|
|
4
4
|
export declare function createSvelteHeuristic(opts: CreateHeuristicOpts): HeuristicFunc;
|
|
5
5
|
/** Default Svelte heuristic which extracts top level variable assignments as well, leading to `$derived` being auto added when needed */
|
|
@@ -9,6 +9,7 @@ export declare const svelteKitDefaultHeuristic: HeuristicFunc;
|
|
|
9
9
|
export declare const svelteDefaultHeuristicDerivedReq: HeuristicFunc;
|
|
10
10
|
type LoadersAvailable = 'svelte' | 'sveltekit';
|
|
11
11
|
export type SvelteArgs = AdapterArgs<LoadersAvailable, RuntimeCtxSv>;
|
|
12
|
+
export declare const defaultArgs: SvelteArgs;
|
|
12
13
|
export declare function getDefaultLoaderPath(loader: LoaderChoice<LoadersAvailable>, bundle: boolean): string | {
|
|
13
14
|
client: string;
|
|
14
15
|
server: string;
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { SvelteTransformer } from "./transformer.js";
|
|
1
|
+
import { createHeuristic, deepMergeObjects, defaultGenerateLoadID, defaultHeuristicOpts } from 'wuchale';
|
|
3
2
|
import { loaderPathResolver } from 'wuchale/adapter-utils';
|
|
4
3
|
import { pluralPattern } from 'wuchale/adapter-vanilla';
|
|
4
|
+
import { SvelteTransformer } from './transformer.js';
|
|
5
5
|
export function createSvelteHeuristic(opts) {
|
|
6
6
|
const defaultHeuristic = createHeuristic(opts);
|
|
7
7
|
return msg => {
|
|
@@ -38,7 +38,7 @@ export const svelteDefaultHeuristicDerivedReq = msg => {
|
|
|
38
38
|
}
|
|
39
39
|
return false;
|
|
40
40
|
};
|
|
41
|
-
const defaultArgs = {
|
|
41
|
+
export const defaultArgs = {
|
|
42
42
|
files: ['src/**/*.svelte', 'src/**/*.svelte.{js,ts}'],
|
|
43
43
|
localesDir: './src/locales',
|
|
44
44
|
patterns: [pluralPattern],
|
|
@@ -50,7 +50,7 @@ const defaultArgs = {
|
|
|
50
50
|
runtime: {
|
|
51
51
|
initReactive: ({ file, funcName, module }) => {
|
|
52
52
|
const inTopLevel = funcName == null;
|
|
53
|
-
return file.endsWith('.svelte.js') || module ? inTopLevel :
|
|
53
|
+
return file.endsWith('.svelte.js') || module ? inTopLevel : inTopLevel ? true : null;
|
|
54
54
|
},
|
|
55
55
|
useReactive: ({ file, funcName, module }) => {
|
|
56
56
|
const inTopLevel = funcName == null;
|
package/dist/transformer.d.ts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
|
-
import type { AnyNode, VariableDeclarator } from
|
|
2
|
-
import { type AST } from
|
|
3
|
-
import { Message } from 'wuchale';
|
|
1
|
+
import type { AnyNode, VariableDeclarator } from 'acorn';
|
|
2
|
+
import { type AST } from 'svelte/compiler';
|
|
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, CatalogExpr, RuntimeConf, CodePattern, UrlMatcher } from 'wuchale';
|
|
6
|
-
import { MixedVisitor, type CommentDirectives } from "wuchale/adapter-utils";
|
|
7
6
|
type MixedNodesTypes = AST.Text | AST.Tag | AST.ElementLike | AST.Block | AST.Comment;
|
|
8
7
|
export type RuntimeCtxSv = {
|
|
9
8
|
module: boolean;
|
|
@@ -11,8 +10,6 @@ export type RuntimeCtxSv = {
|
|
|
11
10
|
export declare class SvelteTransformer extends Transformer<RuntimeCtxSv> {
|
|
12
11
|
currentElement?: string;
|
|
13
12
|
inCompoundText: boolean;
|
|
14
|
-
commentDirectivesStack: CommentDirectives[];
|
|
15
|
-
lastVisitIsComment: boolean;
|
|
16
13
|
currentSnippet: number;
|
|
17
14
|
moduleExportRanges: [number, number][];
|
|
18
15
|
mixedVisitor: MixedVisitor<MixedNodesTypes>;
|
package/dist/transformer.js
CHANGED
|
@@ -1,28 +1,22 @@
|
|
|
1
|
-
import MagicString from
|
|
2
|
-
import { parse, preprocess } from
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { MixedVisitor, nonWhitespaceText, processCommentDirectives, varNames } from "wuchale/adapter-utils";
|
|
1
|
+
import MagicString from 'magic-string';
|
|
2
|
+
import { parse, preprocess } from 'svelte/compiler';
|
|
3
|
+
import { MixedVisitor, nonWhitespaceText, varNames } from 'wuchale/adapter-utils';
|
|
4
|
+
import { parseScript, Transformer } from 'wuchale/adapter-vanilla';
|
|
6
5
|
const nodesWithChildren = ['RegularElement', 'Component'];
|
|
7
6
|
const rtComponent = 'W_tx_';
|
|
7
|
+
const headerAdd = `\nimport ${rtComponent} from "@wuchale/svelte/runtime.svelte"`;
|
|
8
8
|
const snipPrefix = '_w_snippet_';
|
|
9
9
|
const rtModuleVar = varNames.rt + 'mod_';
|
|
10
10
|
// for use before actually parsing the code,
|
|
11
|
-
// to remove the contents of e.g. <style lang="scss">
|
|
11
|
+
// to remove the contents of e.g. <style lang="scss"> which can cause parse errors
|
|
12
12
|
// without messing up indices for magic-string
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
code: ' '.repeat(content.length),
|
|
17
|
-
};
|
|
18
|
-
}
|
|
19
|
-
};
|
|
13
|
+
const removeCSS = ({ content }) => ({
|
|
14
|
+
code: ' '.repeat(content.length),
|
|
15
|
+
});
|
|
20
16
|
export class SvelteTransformer extends Transformer {
|
|
21
17
|
// state
|
|
22
18
|
currentElement;
|
|
23
19
|
inCompoundText = false;
|
|
24
|
-
commentDirectivesStack = [];
|
|
25
|
-
lastVisitIsComment = false;
|
|
26
20
|
currentSnippet = 0;
|
|
27
21
|
moduleExportRanges = []; // to choose which runtime var to use for snippets
|
|
28
22
|
mixedVisitor;
|
|
@@ -34,11 +28,15 @@ export class SvelteTransformer extends Transformer {
|
|
|
34
28
|
visitVariableDeclarator = (node) => {
|
|
35
29
|
const msgs = this.defaultVisitVariableDeclarator(node);
|
|
36
30
|
const init = node.init;
|
|
37
|
-
if (!msgs.length ||
|
|
31
|
+
if (!msgs.length ||
|
|
32
|
+
this.heuristciDetails.declaring != null ||
|
|
33
|
+
init == null ||
|
|
34
|
+
['ArrowFunctionExpression', 'FunctionExpression'].includes(init.type)) {
|
|
38
35
|
return msgs;
|
|
39
36
|
}
|
|
40
37
|
const needsWrapping = msgs.some(msg => {
|
|
41
|
-
if (msg.details.topLevelCall &&
|
|
38
|
+
if (msg.details.topLevelCall &&
|
|
39
|
+
['$props', '$state', '$derived', '$derived.by'].includes(msg.details.topLevelCall)) {
|
|
42
40
|
return false;
|
|
43
41
|
}
|
|
44
42
|
if (msg.details.declaring !== 'variable') {
|
|
@@ -65,7 +63,7 @@ export class SvelteTransformer extends Transformer {
|
|
|
65
63
|
leaveInPlace: node => ['ConstTag', 'SnippetBlock'].includes(node.type),
|
|
66
64
|
isExpression: node => node.type === 'ExpressionTag',
|
|
67
65
|
getTextContent: (node) => node.data,
|
|
68
|
-
getCommentData: (node) => node.data,
|
|
66
|
+
getCommentData: (node) => node.data.trim(),
|
|
69
67
|
canHaveChildren: (node) => nodesWithChildren.includes(node.type),
|
|
70
68
|
visitFunc: (child, inCompoundText) => {
|
|
71
69
|
const inCompoundTextPrev = this.inCompoundText;
|
|
@@ -116,7 +114,7 @@ export class SvelteTransformer extends Transformer {
|
|
|
116
114
|
inCompoundText: this.inCompoundText,
|
|
117
115
|
scope: 'markup',
|
|
118
116
|
element: this.currentElement,
|
|
119
|
-
useComponent: this.currentElement !== 'title'
|
|
117
|
+
useComponent: this.currentElement !== 'title',
|
|
120
118
|
});
|
|
121
119
|
visitRegularElement = (node) => {
|
|
122
120
|
const currentElement = this.currentElement;
|
|
@@ -221,10 +219,7 @@ export class SvelteTransformer extends Transformer {
|
|
|
221
219
|
return msgs;
|
|
222
220
|
};
|
|
223
221
|
visitEachBlock = (node) => {
|
|
224
|
-
const msgs = [
|
|
225
|
-
...this.visit(node.expression),
|
|
226
|
-
...this.visitSv(node.body),
|
|
227
|
-
];
|
|
222
|
+
const msgs = [...this.visit(node.expression), ...this.visitSv(node.body)];
|
|
228
223
|
if (node.key) {
|
|
229
224
|
msgs.push(...this.visit(node.key));
|
|
230
225
|
}
|
|
@@ -234,10 +229,7 @@ export class SvelteTransformer extends Transformer {
|
|
|
234
229
|
return msgs;
|
|
235
230
|
};
|
|
236
231
|
visitKeyBlock = (node) => {
|
|
237
|
-
return [
|
|
238
|
-
...this.visit(node.expression),
|
|
239
|
-
...this.visitSv(node.fragment),
|
|
240
|
-
];
|
|
232
|
+
return [...this.visit(node.expression), ...this.visitSv(node.fragment)];
|
|
241
233
|
};
|
|
242
234
|
visitAwaitBlock = (node) => {
|
|
243
235
|
const msgs = this.visit(node.expression);
|
|
@@ -252,16 +244,16 @@ export class SvelteTransformer extends Transformer {
|
|
|
252
244
|
}
|
|
253
245
|
return msgs;
|
|
254
246
|
};
|
|
255
|
-
visitSvelteBody = (node) => node.attributes.
|
|
256
|
-
visitSvelteDocument = (node) => node.attributes.
|
|
257
|
-
visitSvelteElement = (node) => node.attributes.
|
|
247
|
+
visitSvelteBody = (node) => node.attributes.flatMap(this.visitSv);
|
|
248
|
+
visitSvelteDocument = (node) => node.attributes.flatMap(this.visitSv);
|
|
249
|
+
visitSvelteElement = (node) => node.attributes.flatMap(this.visitSv);
|
|
258
250
|
visitSvelteBoundary = (node) => [
|
|
259
|
-
...node.attributes.
|
|
251
|
+
...node.attributes.flatMap(this.visitSv),
|
|
260
252
|
...this.visitSv(node.fragment),
|
|
261
253
|
];
|
|
262
254
|
visitSvelteHead = (node) => this.visitSv(node.fragment);
|
|
263
255
|
visitTitleElement = (node) => this.visitRegularElement(node);
|
|
264
|
-
visitSvelteWindow = (node) => node.attributes.
|
|
256
|
+
visitSvelteWindow = (node) => node.attributes.flatMap(this.visitSv);
|
|
265
257
|
visitRoot = (node) => {
|
|
266
258
|
const msgs = [];
|
|
267
259
|
if (node.module) {
|
|
@@ -287,36 +279,7 @@ export class SvelteTransformer extends Transformer {
|
|
|
287
279
|
msgs.push(...this.visitFragment(node.fragment));
|
|
288
280
|
return msgs;
|
|
289
281
|
};
|
|
290
|
-
visitSv = (node) =>
|
|
291
|
-
if (node.type === 'Comment') {
|
|
292
|
-
this.commentDirectives = processCommentDirectives(node.data.trim(), this.commentDirectives);
|
|
293
|
-
if (this.lastVisitIsComment) {
|
|
294
|
-
this.commentDirectivesStack[this.commentDirectivesStack.length - 1] = this.commentDirectives;
|
|
295
|
-
}
|
|
296
|
-
else {
|
|
297
|
-
this.commentDirectivesStack.push(this.commentDirectives);
|
|
298
|
-
}
|
|
299
|
-
this.lastVisitIsComment = true;
|
|
300
|
-
return [];
|
|
301
|
-
}
|
|
302
|
-
if (node.type === 'Text' && !node.data.trim()) {
|
|
303
|
-
return [];
|
|
304
|
-
}
|
|
305
|
-
let msgs = [];
|
|
306
|
-
const commentDirectivesPrev = this.commentDirectives;
|
|
307
|
-
if (this.lastVisitIsComment) {
|
|
308
|
-
this.commentDirectives = this.commentDirectivesStack.pop();
|
|
309
|
-
this.lastVisitIsComment = false;
|
|
310
|
-
}
|
|
311
|
-
if (this.commentDirectives.ignoreFile) {
|
|
312
|
-
return [];
|
|
313
|
-
}
|
|
314
|
-
if (this.commentDirectives.forceType !== false) {
|
|
315
|
-
msgs = this.visit(node);
|
|
316
|
-
}
|
|
317
|
-
this.commentDirectives = commentDirectivesPrev;
|
|
318
|
-
return msgs;
|
|
319
|
-
};
|
|
282
|
+
visitSv = (node) => this.visit(node);
|
|
320
283
|
/** collects the ranges that will be checked if a snippet identifier is exported using RegExp test to simplify */
|
|
321
284
|
collectModuleExportRanges = (script) => {
|
|
322
285
|
for (const stmt of script.content.body) {
|
|
@@ -349,13 +312,12 @@ export class SvelteTransformer extends Transformer {
|
|
|
349
312
|
const isComponent = this.heuristciDetails.file.endsWith('.svelte');
|
|
350
313
|
let ast;
|
|
351
314
|
if (isComponent) {
|
|
352
|
-
const prepd = await preprocess(this.content, { style:
|
|
315
|
+
const prepd = await preprocess(this.content, { style: removeCSS });
|
|
353
316
|
ast = parse(prepd.code, { modern: true });
|
|
354
317
|
}
|
|
355
318
|
else {
|
|
356
|
-
|
|
357
|
-
ast =
|
|
358
|
-
this.comments = comments;
|
|
319
|
+
;
|
|
320
|
+
[ast, this.comments] = parseScript(this.content);
|
|
359
321
|
}
|
|
360
322
|
this.mstr = new MagicString(this.content);
|
|
361
323
|
this.mixedVisitor = this.initMixedVisitor();
|
|
@@ -393,7 +355,6 @@ export class SvelteTransformer extends Transformer {
|
|
|
393
355
|
this.mstr.prependRight(instanceStart, `${initRuntime}\n</script>\n`);
|
|
394
356
|
// now hmr data can be prependRight(0, ...)
|
|
395
357
|
}
|
|
396
|
-
const headerAdd = `\nimport ${rtComponent} from "@wuchale/svelte/runtime.svelte"`;
|
|
397
358
|
return this.finalize(msgs, headerIndex, headerAdd);
|
|
398
359
|
};
|
|
399
360
|
}
|
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wuchale/svelte",
|
|
3
|
-
"version": "0.18.
|
|
3
|
+
"version": "0.18.2",
|
|
4
4
|
"description": "Protobuf-like i18n from plain code: Svelte adapter",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"dev": "tsc --watch",
|
|
7
7
|
"build": "tsc",
|
|
8
|
-
"test": "node
|
|
8
|
+
"test": "node --import ../wuchale/testing/resolve.ts --test"
|
|
9
9
|
},
|
|
10
10
|
"keywords": [
|
|
11
11
|
"i18n",
|
|
@@ -51,9 +51,9 @@
|
|
|
51
51
|
"author": "K1DV5",
|
|
52
52
|
"license": "MIT",
|
|
53
53
|
"dependencies": {
|
|
54
|
-
"svelte": "^5.37.0",
|
|
55
54
|
"magic-string": "^0.30.21",
|
|
56
|
-
"
|
|
55
|
+
"svelte": "^5.53.1",
|
|
56
|
+
"wuchale": "^0.20.0"
|
|
57
57
|
},
|
|
58
58
|
"devDependencies": {
|
|
59
59
|
"acorn": "^8.15.0",
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import toRuntime from
|
|
1
|
+
import toRuntime from 'wuchale/runtime'
|
|
2
2
|
import { locales } from '${DATA}'
|
|
3
3
|
|
|
4
4
|
let locale = $state(locales[0])
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* @param {string} newLocale
|
|
8
|
-
*/
|
|
8
|
+
*/
|
|
9
9
|
export function setLocale(newLocale) {
|
|
10
10
|
locale = newLocale
|
|
11
11
|
}
|
|
@@ -13,7 +13,7 @@ export function setLocale(newLocale) {
|
|
|
13
13
|
// for non-reactive
|
|
14
14
|
/**
|
|
15
15
|
* @param {{ [locale: string]: import("wuchale/runtime").CatalogModule }} catalogs
|
|
16
|
-
*/
|
|
16
|
+
*/
|
|
17
17
|
export const getRuntime = catalogs => toRuntime(catalogs[locale], locale)
|
|
18
18
|
|
|
19
19
|
// same function, only will be inside $derived when used
|
package/src/runtime.svelte
CHANGED