@vue-jsx-vapor/compiler 2.4.8 → 2.5.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.cjs +1376 -82
- package/dist/index.d.cts +36 -11
- package/dist/index.d.ts +36 -11
- package/dist/index.js +1378 -85
- package/package.json +5 -4
package/dist/index.cjs
CHANGED
@@ -22,10 +22,11 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
22
22
|
|
23
23
|
//#endregion
|
24
24
|
const __babel_parser = __toESM(require("@babel/parser"));
|
25
|
-
const __vue_compiler_vapor = __toESM(require("@vue/compiler-vapor"));
|
26
25
|
const __vue_shared = __toESM(require("@vue/shared"));
|
27
26
|
const __vue_compiler_dom = __toESM(require("@vue/compiler-dom"));
|
27
|
+
const ast_kit = __toESM(require("ast-kit"));
|
28
28
|
const __babel_types = __toESM(require("@babel/types"));
|
29
|
+
const source_map_js = __toESM(require("source-map-js"));
|
29
30
|
|
30
31
|
//#region src/ir/component.ts
|
31
32
|
let IRDynamicPropsKind = /* @__PURE__ */ function(IRDynamicPropsKind$1) {
|
@@ -89,32 +90,37 @@ function isBlockOperation(op) {
|
|
89
90
|
}
|
90
91
|
|
91
92
|
//#endregion
|
92
|
-
//#region src/
|
93
|
-
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
const { helper } = context;
|
99
|
-
const { element, values, generated } = oper;
|
100
|
-
return [__vue_compiler_vapor.NEWLINE, ...(0, __vue_compiler_vapor.genCall)(helper("setNodes"), `${generated ? "x" : "n"}${element}`, combineValues(values, context))];
|
93
|
+
//#region src/transforms/utils.ts
|
94
|
+
function newDynamic() {
|
95
|
+
return {
|
96
|
+
flags: DynamicFlag.REFERENCED,
|
97
|
+
children: []
|
98
|
+
};
|
101
99
|
}
|
102
|
-
function
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
100
|
+
function newBlock(node) {
|
101
|
+
return {
|
102
|
+
type: 1,
|
103
|
+
node,
|
104
|
+
dynamic: newDynamic(),
|
105
|
+
effect: [],
|
106
|
+
operation: [],
|
107
|
+
returns: [],
|
108
|
+
tempId: 0
|
109
|
+
};
|
110
110
|
}
|
111
|
-
function
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
|
111
|
+
function createBranch(node, context, isVFor) {
|
112
|
+
context.node = node = wrapFragment(node);
|
113
|
+
const branch = newBlock(node);
|
114
|
+
const exitBlock = context.enterBlock(branch, isVFor);
|
115
|
+
context.reference();
|
116
|
+
return [branch, exitBlock];
|
117
|
+
}
|
118
|
+
function wrapFragment(node) {
|
119
|
+
if (node.type === "JSXFragment" || isTemplate(node)) return node;
|
120
|
+
return (0, __babel_types.jsxFragment)((0, __babel_types.jsxOpeningFragment)(), (0, __babel_types.jsxClosingFragment)(), [node.type === "JSXElement" ? node : (0, __babel_types.jsxExpressionContainer)(node)]);
|
117
121
|
}
|
122
|
+
const EMPTY_EXPRESSION = (0, __vue_compiler_dom.createSimpleExpression)("", true);
|
123
|
+
const isFragmentNode = (node) => node.type === IRNodeTypes.ROOT || node.type === "JSXFragment" || node.type === "JSXElement" && !!isTemplate(node);
|
118
124
|
|
119
125
|
//#endregion
|
120
126
|
//#region src/utils.ts
|
@@ -171,22 +177,17 @@ function resolveSimpleExpressionNode(exp) {
|
|
171
177
|
}
|
172
178
|
return exp;
|
173
179
|
}
|
174
|
-
const resolvedExpressions = /* @__PURE__ */ new WeakSet();
|
175
180
|
function resolveExpression(node, context, effect = false) {
|
176
181
|
if (!node) return (0, __vue_compiler_dom.createSimpleExpression)("", true);
|
177
182
|
node = (0, __vue_compiler_dom.unwrapTSNode)(node.type === "JSXExpressionContainer" ? node.expression : node);
|
178
183
|
const isStatic = node.type === "StringLiteral" || node.type === "JSXText" || node.type === "JSXIdentifier";
|
179
184
|
let source = node.type === "JSXEmptyExpression" ? "" : node.type === "JSXIdentifier" ? node.name : node.type === "StringLiteral" ? node.value : node.type === "JSXText" ? resolveJSXText(node) : node.type === "Identifier" ? node.name : context.ir.source.slice(node.start, node.end);
|
180
185
|
const location = node.loc;
|
181
|
-
const isResolved = resolvedExpressions.has(node);
|
182
186
|
if (source && !isStatic && effect && !isConstant(node)) {
|
183
187
|
source = `() => (${source})`;
|
184
|
-
|
185
|
-
location.start.column -= 7;
|
186
|
-
node.start -= 7;
|
187
|
-
}
|
188
|
+
node._offset = 7;
|
188
189
|
}
|
189
|
-
return resolveSimpleExpression(source, isStatic, location, isStatic ? void 0 :
|
190
|
+
return resolveSimpleExpression(source, isStatic, location, isStatic ? void 0 : node);
|
190
191
|
}
|
191
192
|
function resolveSimpleExpression(source, isStatic, location, ast) {
|
192
193
|
const result = (0, __vue_compiler_dom.createSimpleExpression)(source, isStatic, resolveLocation(location, source));
|
@@ -279,48 +280,1352 @@ function isTemplate(node) {
|
|
279
280
|
}
|
280
281
|
|
281
282
|
//#endregion
|
282
|
-
//#region src/
|
283
|
-
|
283
|
+
//#region src/generators/utils.ts
|
284
|
+
const NEWLINE = Symbol(`newline`);
|
285
|
+
const INDENT_START = Symbol(`indent start`);
|
286
|
+
const INDENT_END = Symbol(`indent end`);
|
287
|
+
function buildCodeFragment(...frag) {
|
288
|
+
const push = frag.push.bind(frag);
|
289
|
+
const unshift = frag.unshift.bind(frag);
|
290
|
+
return [
|
291
|
+
frag,
|
292
|
+
push,
|
293
|
+
unshift
|
294
|
+
];
|
295
|
+
}
|
296
|
+
function genMulti([left, right, seg, placeholder], ...frags) {
|
297
|
+
if (placeholder) {
|
298
|
+
while (frags.length > 0 && !frags.at(-1)) frags.pop();
|
299
|
+
frags = frags.map((frag$1) => frag$1 || placeholder);
|
300
|
+
} else frags = frags.filter(Boolean);
|
301
|
+
const frag = [];
|
302
|
+
push(left);
|
303
|
+
for (const [i, fn] of frags.entries()) {
|
304
|
+
push(fn);
|
305
|
+
if (i < frags.length - 1) push(seg);
|
306
|
+
}
|
307
|
+
push(right);
|
308
|
+
return frag;
|
309
|
+
function push(fn) {
|
310
|
+
if (!(0, __vue_shared.isArray)(fn)) fn = [fn];
|
311
|
+
frag.push(...fn);
|
312
|
+
}
|
313
|
+
}
|
314
|
+
const DELIMITERS_ARRAY = [
|
315
|
+
"[",
|
316
|
+
"]",
|
317
|
+
", "
|
318
|
+
];
|
319
|
+
const DELIMITERS_ARRAY_NEWLINE = [
|
320
|
+
[
|
321
|
+
"[",
|
322
|
+
INDENT_START,
|
323
|
+
NEWLINE
|
324
|
+
],
|
325
|
+
[
|
326
|
+
INDENT_END,
|
327
|
+
NEWLINE,
|
328
|
+
"]"
|
329
|
+
],
|
330
|
+
[", ", NEWLINE]
|
331
|
+
];
|
332
|
+
const DELIMITERS_OBJECT = [
|
333
|
+
"{ ",
|
334
|
+
" }",
|
335
|
+
", "
|
336
|
+
];
|
337
|
+
const DELIMITERS_OBJECT_NEWLINE = [
|
338
|
+
[
|
339
|
+
"{",
|
340
|
+
INDENT_START,
|
341
|
+
NEWLINE
|
342
|
+
],
|
343
|
+
[
|
344
|
+
INDENT_END,
|
345
|
+
NEWLINE,
|
346
|
+
"}"
|
347
|
+
],
|
348
|
+
[", ", NEWLINE]
|
349
|
+
];
|
350
|
+
function genCall(name, ...frags) {
|
351
|
+
const hasPlaceholder = (0, __vue_shared.isArray)(name);
|
352
|
+
const fnName = hasPlaceholder ? name[0] : name;
|
353
|
+
const placeholder = hasPlaceholder ? name[1] : "null";
|
354
|
+
return [fnName, ...genMulti([
|
355
|
+
"(",
|
356
|
+
")",
|
357
|
+
", ",
|
358
|
+
placeholder
|
359
|
+
], ...frags)];
|
360
|
+
}
|
361
|
+
function codeFragmentToString(code, context) {
|
362
|
+
const { options: { filename, sourceMap } } = context;
|
363
|
+
let map;
|
364
|
+
if (sourceMap) {
|
365
|
+
map = new source_map_js.SourceMapGenerator();
|
366
|
+
map.setSourceContent(filename, context.ir.source);
|
367
|
+
map._sources.add(filename);
|
368
|
+
}
|
369
|
+
let codegen = "";
|
370
|
+
const pos = {
|
371
|
+
line: 1,
|
372
|
+
column: 1,
|
373
|
+
offset: 0
|
374
|
+
};
|
375
|
+
let indentLevel = 0;
|
376
|
+
for (let frag of code) {
|
377
|
+
if (!frag) continue;
|
378
|
+
if (frag === NEWLINE) frag = [`\n${` `.repeat(indentLevel)}`, __vue_compiler_dom.NewlineType.Start];
|
379
|
+
else if (frag === INDENT_START) {
|
380
|
+
indentLevel++;
|
381
|
+
continue;
|
382
|
+
} else if (frag === INDENT_END) {
|
383
|
+
indentLevel--;
|
384
|
+
continue;
|
385
|
+
}
|
386
|
+
if ((0, __vue_shared.isString)(frag)) frag = [frag];
|
387
|
+
let [code$1, newlineIndex = __vue_compiler_dom.NewlineType.None, loc, name] = frag;
|
388
|
+
codegen += code$1;
|
389
|
+
if (map) {
|
390
|
+
if (loc) addMapping(loc.start, name);
|
391
|
+
if (newlineIndex === __vue_compiler_dom.NewlineType.Unknown) (0, __vue_compiler_dom.advancePositionWithMutation)(pos, code$1);
|
392
|
+
else {
|
393
|
+
pos.offset += code$1.length;
|
394
|
+
if (newlineIndex === __vue_compiler_dom.NewlineType.None) pos.column += code$1.length;
|
395
|
+
else {
|
396
|
+
if (newlineIndex === __vue_compiler_dom.NewlineType.End) newlineIndex = code$1.length - 1;
|
397
|
+
pos.line++;
|
398
|
+
pos.column = code$1.length - newlineIndex;
|
399
|
+
}
|
400
|
+
}
|
401
|
+
if (loc && loc !== __vue_compiler_dom.locStub) addMapping(loc.end);
|
402
|
+
}
|
403
|
+
}
|
404
|
+
return [codegen, map];
|
405
|
+
function addMapping(loc, name = null) {
|
406
|
+
const { _names, _mappings } = map;
|
407
|
+
if (name !== null && !_names.has(name)) _names.add(name);
|
408
|
+
_mappings.add({
|
409
|
+
originalLine: loc.line,
|
410
|
+
originalColumn: loc.column - 1,
|
411
|
+
generatedLine: pos.line,
|
412
|
+
generatedColumn: pos.column - 1,
|
413
|
+
source: filename,
|
414
|
+
name
|
415
|
+
});
|
416
|
+
}
|
417
|
+
}
|
418
|
+
|
419
|
+
//#endregion
|
420
|
+
//#region src/generators/expression.ts
|
421
|
+
function genExpression(node, context, assignment) {
|
422
|
+
const { content, ast, isStatic, loc } = node;
|
423
|
+
if (isStatic) return [[
|
424
|
+
JSON.stringify(content),
|
425
|
+
__vue_compiler_dom.NewlineType.None,
|
426
|
+
loc
|
427
|
+
]];
|
428
|
+
if (!node.content.trim() || ast === false || isConstantExpression(node)) return [[
|
429
|
+
content,
|
430
|
+
__vue_compiler_dom.NewlineType.None,
|
431
|
+
loc
|
432
|
+
], assignment && ` = ${assignment}`];
|
433
|
+
if (ast === null) return genIdentifier(content, context, loc, assignment);
|
434
|
+
const ids = [];
|
435
|
+
const parentStackMap = /* @__PURE__ */ new Map();
|
436
|
+
const parentStack = [];
|
437
|
+
(0, ast_kit.walkIdentifiers)(ast, (id) => {
|
438
|
+
ids.push(id);
|
439
|
+
parentStackMap.set(id, parentStack.slice());
|
440
|
+
}, false, parentStack);
|
441
|
+
let hasMemberExpression = false;
|
442
|
+
if (ids.length) {
|
443
|
+
const [frag, push] = buildCodeFragment();
|
444
|
+
const isTSNode = ast && __vue_compiler_dom.TS_NODE_TYPES.includes(ast.type);
|
445
|
+
const offset = (ast?.start ? ast.start - 1 : 0) - (ast._offset || 0);
|
446
|
+
ids.sort((a, b) => a.start - b.start).forEach((id, i) => {
|
447
|
+
const start = id.start - 1 - offset;
|
448
|
+
const end = id.end - 1 - offset;
|
449
|
+
const last = ids[i - 1];
|
450
|
+
if (!isTSNode || i !== 0) {
|
451
|
+
const leadingText = content.slice(last ? last.end - 1 - offset : 0, start);
|
452
|
+
if (leadingText.length) push([leadingText, __vue_compiler_dom.NewlineType.Unknown]);
|
453
|
+
}
|
454
|
+
const source = content.slice(start, end);
|
455
|
+
const parentStack$1 = parentStackMap.get(id);
|
456
|
+
const parent = parentStack$1.at(-1);
|
457
|
+
hasMemberExpression ||= !!parent && (parent.type === "MemberExpression" || parent.type === "OptionalMemberExpression");
|
458
|
+
push(...genIdentifier(source, context, {
|
459
|
+
start: (0, __vue_compiler_dom.advancePositionWithClone)(node.loc.start, source, start),
|
460
|
+
end: (0, __vue_compiler_dom.advancePositionWithClone)(node.loc.start, source, end),
|
461
|
+
source
|
462
|
+
}, hasMemberExpression ? void 0 : assignment, parent));
|
463
|
+
if (i === ids.length - 1 && end < content.length && !isTSNode) push([content.slice(end), __vue_compiler_dom.NewlineType.Unknown]);
|
464
|
+
});
|
465
|
+
if (assignment && hasMemberExpression) push(` = ${assignment}`);
|
466
|
+
return frag;
|
467
|
+
} else return [[
|
468
|
+
content,
|
469
|
+
__vue_compiler_dom.NewlineType.Unknown,
|
470
|
+
loc
|
471
|
+
]];
|
472
|
+
}
|
473
|
+
function genIdentifier(raw, context, loc, assignment, parent) {
|
474
|
+
const { identifiers } = context;
|
475
|
+
const name = raw;
|
476
|
+
const idMap = identifiers[raw];
|
477
|
+
if (idMap && idMap.length) {
|
478
|
+
const replacement = idMap[0];
|
479
|
+
if ((0, __vue_shared.isString)(replacement)) if (parent && parent.type === "ObjectProperty" && parent.shorthand) return [[
|
480
|
+
`${name}: ${replacement}`,
|
481
|
+
__vue_compiler_dom.NewlineType.None,
|
482
|
+
loc
|
483
|
+
]];
|
484
|
+
else return [[
|
485
|
+
replacement,
|
486
|
+
__vue_compiler_dom.NewlineType.None,
|
487
|
+
loc
|
488
|
+
]];
|
489
|
+
else return genExpression(replacement, context, assignment);
|
490
|
+
}
|
491
|
+
let prefix;
|
492
|
+
if ((0, __vue_compiler_dom.isStaticProperty)(parent) && parent.shorthand) prefix = `${raw}: `;
|
493
|
+
raw = withAssignment(raw);
|
494
|
+
return [prefix, [
|
495
|
+
raw,
|
496
|
+
__vue_compiler_dom.NewlineType.None,
|
497
|
+
loc,
|
498
|
+
name
|
499
|
+
]];
|
500
|
+
function withAssignment(s) {
|
501
|
+
return assignment ? `${s} = ${assignment}` : s;
|
502
|
+
}
|
503
|
+
}
|
504
|
+
|
505
|
+
//#endregion
|
506
|
+
//#region src/generators/vModel.ts
|
507
|
+
const helperMap = {
|
508
|
+
text: "applyTextModel",
|
509
|
+
radio: "applyRadioModel",
|
510
|
+
checkbox: "applyCheckboxModel",
|
511
|
+
select: "applySelectModel",
|
512
|
+
dynamic: "applyDynamicModel"
|
513
|
+
};
|
514
|
+
function genVModel(oper, context) {
|
515
|
+
const { modelType, element, dir: { exp, modifiers } } = oper;
|
516
|
+
return [NEWLINE, ...genCall(context.helper(helperMap[modelType]), `n${element}`, [
|
517
|
+
`() => (`,
|
518
|
+
...genExpression(exp, context),
|
519
|
+
`)`
|
520
|
+
], genModelHandler(exp, context), modifiers.length ? `{ ${modifiers.map((e) => `${e.content}: true`).join(",")} }` : void 0)];
|
521
|
+
}
|
522
|
+
function genModelHandler(exp, context) {
|
523
|
+
return [
|
524
|
+
`${context.options.isTS ? `(_value: any)` : `_value`} => (`,
|
525
|
+
...genExpression(exp, context, "_value"),
|
526
|
+
")"
|
527
|
+
];
|
528
|
+
}
|
529
|
+
|
530
|
+
//#endregion
|
531
|
+
//#region src/generators/vShow.ts
|
532
|
+
function genVShow(oper, context) {
|
533
|
+
return [NEWLINE, ...genCall(context.helper("applyVShow"), `n${oper.element}`, [
|
534
|
+
`() => (`,
|
535
|
+
...genExpression(oper.dir.exp, context),
|
536
|
+
`)`
|
537
|
+
])];
|
538
|
+
}
|
539
|
+
|
540
|
+
//#endregion
|
541
|
+
//#region src/generators/directive.ts
|
542
|
+
function genBuiltinDirective(oper, context) {
|
543
|
+
switch (oper.name) {
|
544
|
+
case "show": return genVShow(oper, context);
|
545
|
+
case "model": return genVModel(oper, context);
|
546
|
+
default: return [];
|
547
|
+
}
|
548
|
+
}
|
549
|
+
/**
|
550
|
+
* user directives via `withVaporDirectives`
|
551
|
+
* TODO the compiler side is implemented but no runtime support yet
|
552
|
+
* it was removed due to perf issues
|
553
|
+
*/
|
554
|
+
function genDirectivesForElement(id, context) {
|
555
|
+
const dirs = filterCustomDirectives(id, context.block.operation);
|
556
|
+
return dirs.length ? genCustomDirectives(dirs, context) : [];
|
557
|
+
}
|
558
|
+
function genCustomDirectives(opers, context) {
|
559
|
+
const { helper } = context;
|
560
|
+
const element = `n${opers[0].element}`;
|
561
|
+
const directiveItems = opers.map(genDirectiveItem);
|
562
|
+
const directives = genMulti(DELIMITERS_ARRAY, ...directiveItems);
|
563
|
+
return [NEWLINE, ...genCall(helper("withVaporDirectives"), element, directives)];
|
564
|
+
function genDirectiveItem({ dir, name, asset }) {
|
565
|
+
const directiveVar = asset ? (0, __vue_compiler_dom.toValidAssetId)(name, "directive") : genExpression((0, __vue_shared.extend)((0, __vue_compiler_dom.createSimpleExpression)(name, false), { ast: null }), context);
|
566
|
+
const value = dir.exp && ["() => ", ...genExpression(dir.exp, context)];
|
567
|
+
const argument = dir.arg && genExpression(dir.arg, context);
|
568
|
+
const modifiers = !!dir.modifiers.length && [
|
569
|
+
"{ ",
|
570
|
+
genDirectiveModifiers(dir.modifiers.map((m) => m.content)),
|
571
|
+
" }"
|
572
|
+
];
|
573
|
+
return genMulti(DELIMITERS_ARRAY.concat("void 0"), directiveVar, value, argument, modifiers);
|
574
|
+
}
|
575
|
+
}
|
576
|
+
function genDirectiveModifiers(modifiers) {
|
577
|
+
return modifiers.map((value) => `${(0, __vue_compiler_dom.isSimpleIdentifier)(value) ? value : JSON.stringify(value)}: true`).join(", ");
|
578
|
+
}
|
579
|
+
function filterCustomDirectives(id, operations) {
|
580
|
+
return operations.filter((oper) => oper.type === IRNodeTypes.DIRECTIVE && oper.element === id && !oper.builtin);
|
581
|
+
}
|
582
|
+
|
583
|
+
//#endregion
|
584
|
+
//#region src/generators/event.ts
|
585
|
+
function genSetEvent(oper, context) {
|
586
|
+
const { helper } = context;
|
587
|
+
const { element, key, keyOverride, value, modifiers, delegate, effect } = oper;
|
588
|
+
const name = genName();
|
589
|
+
const handler = genEventHandler(context, value, modifiers);
|
590
|
+
const eventOptions = genEventOptions();
|
591
|
+
if (delegate) {
|
592
|
+
context.delegates.add(key.content);
|
593
|
+
if (!context.block.operation.some(isSameDelegateEvent)) return [
|
594
|
+
NEWLINE,
|
595
|
+
`n${element}.$evt${key.content} = `,
|
596
|
+
...handler
|
597
|
+
];
|
598
|
+
}
|
599
|
+
return [NEWLINE, ...genCall(helper(delegate ? "delegate" : "on"), `n${element}`, name, handler, eventOptions)];
|
600
|
+
function genName() {
|
601
|
+
const expr = genExpression(key, context);
|
602
|
+
if (keyOverride) {
|
603
|
+
const find = JSON.stringify(keyOverride[0]);
|
604
|
+
const replacement = JSON.stringify(keyOverride[1]);
|
605
|
+
const wrapped = [
|
606
|
+
"(",
|
607
|
+
...expr,
|
608
|
+
")"
|
609
|
+
];
|
610
|
+
return [
|
611
|
+
...wrapped,
|
612
|
+
` === ${find} ? ${replacement} : `,
|
613
|
+
...wrapped
|
614
|
+
];
|
615
|
+
} else return genExpression(key, context);
|
616
|
+
}
|
617
|
+
function genEventOptions() {
|
618
|
+
const { options } = modifiers;
|
619
|
+
if (!options.length && !effect) return;
|
620
|
+
return genMulti(DELIMITERS_OBJECT_NEWLINE, effect && ["effect: true"], ...options.map((option) => [`${option}: true`]));
|
621
|
+
}
|
622
|
+
function isSameDelegateEvent(op) {
|
623
|
+
if (op.type === IRNodeTypes.SET_EVENT && op !== oper && op.delegate && op.element === oper.element && op.key.content === key.content) return true;
|
624
|
+
}
|
625
|
+
}
|
626
|
+
function genSetDynamicEvents(oper, context) {
|
627
|
+
const { helper } = context;
|
628
|
+
return [NEWLINE, ...genCall(helper("setDynamicEvents"), `n${oper.element}`, genExpression(oper.event, context))];
|
629
|
+
}
|
630
|
+
function genEventHandler(context, value, modifiers = {
|
631
|
+
nonKeys: [],
|
632
|
+
keys: []
|
633
|
+
}, extraWrap = false) {
|
634
|
+
let handlerExp = [`() => {}`];
|
635
|
+
if (value && value.content.trim()) if ((0, __vue_compiler_dom.isMemberExpression)(value, context.options)) {
|
636
|
+
handlerExp = genExpression(value, context);
|
637
|
+
if (!extraWrap) handlerExp = [
|
638
|
+
`e => `,
|
639
|
+
...handlerExp,
|
640
|
+
`(e)`
|
641
|
+
];
|
642
|
+
} else if ((0, __vue_compiler_dom.isFnExpression)(value, context.options)) handlerExp = genExpression(value, context);
|
643
|
+
else {
|
644
|
+
const referencesEvent = value.content.includes("$event");
|
645
|
+
const hasMultipleStatements = value.content.includes(`;`);
|
646
|
+
const expr = referencesEvent ? context.withId(() => genExpression(value, context), { $event: null }) : genExpression(value, context);
|
647
|
+
handlerExp = [
|
648
|
+
referencesEvent ? "$event => " : "() => ",
|
649
|
+
hasMultipleStatements ? "{" : "(",
|
650
|
+
...expr,
|
651
|
+
hasMultipleStatements ? "}" : ")"
|
652
|
+
];
|
653
|
+
}
|
654
|
+
const { keys, nonKeys } = modifiers;
|
655
|
+
if (nonKeys.length) handlerExp = genWithModifiers(context, handlerExp, nonKeys);
|
656
|
+
if (keys.length) handlerExp = genWithKeys(context, handlerExp, keys);
|
657
|
+
if (extraWrap) handlerExp.unshift(`() => `);
|
658
|
+
return handlerExp;
|
659
|
+
}
|
660
|
+
function genWithModifiers(context, handler, nonKeys) {
|
661
|
+
return genCall(context.helper("withModifiers"), handler, JSON.stringify(nonKeys));
|
662
|
+
}
|
663
|
+
function genWithKeys(context, handler, keys) {
|
664
|
+
return genCall(context.helper("withKeys"), handler, JSON.stringify(keys));
|
665
|
+
}
|
666
|
+
|
667
|
+
//#endregion
|
668
|
+
//#region src/generators/prop.ts
|
669
|
+
const helpers = {
|
670
|
+
setText: { name: "setText" },
|
671
|
+
setHtml: { name: "setHtml" },
|
672
|
+
setClass: { name: "setClass" },
|
673
|
+
setStyle: { name: "setStyle" },
|
674
|
+
setValue: { name: "setValue" },
|
675
|
+
setAttr: {
|
676
|
+
name: "setAttr",
|
677
|
+
needKey: true
|
678
|
+
},
|
679
|
+
setProp: {
|
680
|
+
name: "setProp",
|
681
|
+
needKey: true
|
682
|
+
},
|
683
|
+
setDOMProp: {
|
684
|
+
name: "setDOMProp",
|
685
|
+
needKey: true
|
686
|
+
},
|
687
|
+
setDynamicProps: { name: "setDynamicProps" }
|
688
|
+
};
|
689
|
+
function genSetProp(oper, context) {
|
690
|
+
const { helper } = context;
|
691
|
+
const { prop: { key, values, modifier }, tag } = oper;
|
692
|
+
const resolvedHelper = getRuntimeHelper(tag, key.content, modifier);
|
693
|
+
const propValue = genPropValue(values, context);
|
694
|
+
return [NEWLINE, ...genCall([helper(resolvedHelper.name), null], `n${oper.element}`, resolvedHelper.needKey ? genExpression(key, context) : false, propValue)];
|
695
|
+
}
|
696
|
+
function genDynamicProps(oper, context) {
|
697
|
+
const { helper } = context;
|
698
|
+
const values = oper.props.map((props) => Array.isArray(props) ? genLiteralObjectProps(props, context) : props.kind === IRDynamicPropsKind.ATTRIBUTE ? genLiteralObjectProps([props], context) : genExpression(props.value, context));
|
699
|
+
return [NEWLINE, ...genCall(helper("setDynamicProps"), `n${oper.element}`, genMulti(DELIMITERS_ARRAY, ...values), oper.root && "true")];
|
700
|
+
}
|
701
|
+
function genLiteralObjectProps(props, context) {
|
702
|
+
return genMulti(DELIMITERS_OBJECT, ...props.map((prop) => [
|
703
|
+
...genPropKey(prop, context),
|
704
|
+
`: `,
|
705
|
+
...genPropValue(prop.values, context)
|
706
|
+
]));
|
707
|
+
}
|
708
|
+
function genPropKey({ key: node, modifier, runtimeCamelize, handler, handlerModifiers }, context) {
|
709
|
+
const { helper } = context;
|
710
|
+
const handlerModifierPostfix = handlerModifiers && handlerModifiers.options ? handlerModifiers.options.map(__vue_shared.capitalize).join("") : "";
|
711
|
+
if (node.isStatic) {
|
712
|
+
const keyName = (handler ? (0, __vue_shared.toHandlerKey)(node.content) : node.content) + handlerModifierPostfix;
|
713
|
+
return [[
|
714
|
+
(0, __vue_compiler_dom.isSimpleIdentifier)(keyName) ? keyName : JSON.stringify(keyName),
|
715
|
+
__vue_compiler_dom.NewlineType.None,
|
716
|
+
node.loc
|
717
|
+
]];
|
718
|
+
}
|
719
|
+
let key = genExpression(node, context);
|
720
|
+
if (runtimeCamelize) key = genCall(helper("camelize"), key);
|
721
|
+
if (handler) key = genCall(helper("toHandlerKey"), key);
|
722
|
+
return [
|
723
|
+
"[",
|
724
|
+
modifier && `${JSON.stringify(modifier)} + `,
|
725
|
+
...key,
|
726
|
+
handlerModifierPostfix ? ` + ${JSON.stringify(handlerModifierPostfix)}` : void 0,
|
727
|
+
"]"
|
728
|
+
];
|
729
|
+
}
|
730
|
+
function genPropValue(values, context) {
|
731
|
+
if (values.length === 1) return genExpression(values[0], context);
|
732
|
+
return genMulti(DELIMITERS_ARRAY, ...values.map((expr) => genExpression(expr, context)));
|
733
|
+
}
|
734
|
+
function getRuntimeHelper(tag, key, modifier) {
|
735
|
+
const tagName = tag.toUpperCase();
|
736
|
+
if (modifier) if (modifier === ".") return getSpecialHelper(key, tagName) || helpers.setDOMProp;
|
737
|
+
else return helpers.setAttr;
|
738
|
+
const helper = getSpecialHelper(key, tagName);
|
739
|
+
if (helper) return helper;
|
740
|
+
if (/aria[A-Z]/.test(key)) return helpers.setDOMProp;
|
741
|
+
if ((0, __vue_shared.isSVGTag)(tag)) return helpers.setAttr;
|
742
|
+
if ((0, __vue_shared.shouldSetAsAttr)(tagName, key) || key.includes("-")) return helpers.setAttr;
|
743
|
+
return helpers.setProp;
|
744
|
+
}
|
745
|
+
function getSpecialHelper(keyName, tagName) {
|
746
|
+
if (keyName === "value" && (0, __vue_shared.canSetValueDirectly)(tagName)) return helpers.setValue;
|
747
|
+
else if (keyName === "class") return helpers.setClass;
|
748
|
+
else if (keyName === "style") return helpers.setStyle;
|
749
|
+
else if (keyName === "innerHTML") return helpers.setHtml;
|
750
|
+
else if (keyName === "textContent") return helpers.setText;
|
751
|
+
}
|
752
|
+
|
753
|
+
//#endregion
|
754
|
+
//#region src/generators/component.ts
|
755
|
+
function genCreateComponent(operation, context) {
|
756
|
+
const { helper } = context;
|
757
|
+
const tag = genTag();
|
758
|
+
const { root, props, slots, once } = operation;
|
759
|
+
const rawSlots = genRawSlots(slots, context);
|
760
|
+
const [ids, handlers] = processInlineHandlers(props, context);
|
761
|
+
const rawProps = context.withId(() => genRawProps(props, context), ids);
|
762
|
+
const inlineHandlers = handlers.reduce((acc, { name, value }) => {
|
763
|
+
const handler = genEventHandler(context, value, void 0, false);
|
764
|
+
return [
|
765
|
+
...acc,
|
766
|
+
`const ${name} = `,
|
767
|
+
...handler,
|
768
|
+
NEWLINE
|
769
|
+
];
|
770
|
+
}, []);
|
771
|
+
return [
|
772
|
+
NEWLINE,
|
773
|
+
...inlineHandlers,
|
774
|
+
`const n${operation.id} = `,
|
775
|
+
...genCall(operation.dynamic && !operation.dynamic.isStatic ? helper("createDynamicComponent") : operation.asset ? helper("createComponentWithFallback") : helper("createComponent"), tag, rawProps, rawSlots, root ? "true" : false, once && "true"),
|
776
|
+
...genDirectivesForElement(operation.id, context)
|
777
|
+
];
|
778
|
+
function genTag() {
|
779
|
+
if (operation.dynamic) if (operation.dynamic.isStatic) return genCall(helper("resolveDynamicComponent"), genExpression(operation.dynamic, context));
|
780
|
+
else return [
|
781
|
+
"() => (",
|
782
|
+
...genExpression(operation.dynamic, context),
|
783
|
+
")"
|
784
|
+
];
|
785
|
+
else if (operation.asset) return (0, __vue_compiler_dom.toValidAssetId)(operation.tag, "component");
|
786
|
+
else return genExpression((0, __vue_shared.extend)((0, __vue_compiler_dom.createSimpleExpression)(operation.tag, false), { ast: null }), context);
|
787
|
+
}
|
788
|
+
}
|
789
|
+
function getUniqueHandlerName(context, name) {
|
790
|
+
const { seenInlineHandlerNames } = context;
|
791
|
+
const count = seenInlineHandlerNames[name] || 0;
|
792
|
+
seenInlineHandlerNames[name] = count + 1;
|
793
|
+
return count === 0 ? name : `${name}${count}`;
|
794
|
+
}
|
795
|
+
function processInlineHandlers(props, context) {
|
796
|
+
const ids = Object.create(null);
|
797
|
+
const handlers = [];
|
798
|
+
const staticProps = props[0];
|
799
|
+
if ((0, __vue_shared.isArray)(staticProps)) for (const prop of staticProps) {
|
800
|
+
if (!prop.handler) continue;
|
801
|
+
prop.values.forEach((value, i) => {
|
802
|
+
const isMemberExp = (0, __vue_compiler_dom.isMemberExpression)(value, context.options);
|
803
|
+
if (!isMemberExp) {
|
804
|
+
const name = getUniqueHandlerName(context, `_on_${prop.key.content.replace(":", "_")}`);
|
805
|
+
handlers.push({
|
806
|
+
name,
|
807
|
+
value
|
808
|
+
});
|
809
|
+
ids[name] = null;
|
810
|
+
prop.values[i] = (0, __vue_shared.extend)({ ast: null }, (0, __vue_compiler_dom.createSimpleExpression)(name));
|
811
|
+
}
|
812
|
+
});
|
813
|
+
}
|
814
|
+
return [ids, handlers];
|
815
|
+
}
|
816
|
+
function genRawProps(props, context) {
|
817
|
+
const staticProps = props[0];
|
818
|
+
if ((0, __vue_shared.isArray)(staticProps)) {
|
819
|
+
if (!staticProps.length && props.length === 1) return;
|
820
|
+
return genStaticProps(staticProps, context, genDynamicProps$1(props.slice(1), context));
|
821
|
+
} else if (props.length) return genStaticProps([], context, genDynamicProps$1(props, context));
|
822
|
+
}
|
823
|
+
function genStaticProps(props, context, dynamicProps) {
|
824
|
+
const args = props.map((prop) => genProp(prop, context, true));
|
825
|
+
if (dynamicProps) args.push([`$: `, ...dynamicProps]);
|
826
|
+
return genMulti(args.length > 1 ? DELIMITERS_OBJECT_NEWLINE : DELIMITERS_OBJECT, ...args);
|
827
|
+
}
|
828
|
+
function genDynamicProps$1(props, context) {
|
829
|
+
const { helper } = context;
|
830
|
+
const frags = [];
|
831
|
+
for (const p of props) {
|
832
|
+
let expr;
|
833
|
+
if ((0, __vue_shared.isArray)(p)) {
|
834
|
+
if (p.length) frags.push(genStaticProps(p, context));
|
835
|
+
continue;
|
836
|
+
} else if (p.kind === IRDynamicPropsKind.ATTRIBUTE) expr = genMulti(DELIMITERS_OBJECT, genProp(p, context));
|
837
|
+
else {
|
838
|
+
expr = genExpression(p.value, context);
|
839
|
+
if (p.handler) expr = genCall(helper("toHandlers"), expr);
|
840
|
+
}
|
841
|
+
frags.push([
|
842
|
+
"() => (",
|
843
|
+
...expr,
|
844
|
+
")"
|
845
|
+
]);
|
846
|
+
}
|
847
|
+
if (frags.length) return genMulti(DELIMITERS_ARRAY_NEWLINE, ...frags);
|
848
|
+
}
|
849
|
+
function genProp(prop, context, isStatic) {
|
850
|
+
const values = genPropValue(prop.values, context);
|
851
|
+
return [
|
852
|
+
...genPropKey(prop, context),
|
853
|
+
": ",
|
854
|
+
...prop.handler ? genEventHandler(context, prop.values[0], prop.handlerModifiers, true) : isStatic ? [
|
855
|
+
"() => (",
|
856
|
+
...values,
|
857
|
+
")"
|
858
|
+
] : values,
|
859
|
+
...prop.model ? [...genModelEvent(prop, context), ...genModelModifiers(prop, context)] : []
|
860
|
+
];
|
861
|
+
}
|
862
|
+
function genModelEvent(prop, context) {
|
863
|
+
const name = prop.key.isStatic ? [JSON.stringify(`onUpdate:${(0, __vue_shared.camelize)(prop.key.content)}`)] : [
|
864
|
+
"[\"onUpdate:\" + ",
|
865
|
+
...genExpression(prop.key, context),
|
866
|
+
"]"
|
867
|
+
];
|
868
|
+
const handler = genModelHandler(prop.values[0], context);
|
869
|
+
return [
|
870
|
+
",",
|
871
|
+
NEWLINE,
|
872
|
+
...name,
|
873
|
+
": () => ",
|
874
|
+
...handler
|
875
|
+
];
|
876
|
+
}
|
877
|
+
function genModelModifiers(prop, context) {
|
878
|
+
const { key, modelModifiers } = prop;
|
879
|
+
if (!modelModifiers || !modelModifiers.length) return [];
|
880
|
+
const modifiersKey = key.isStatic ? [`${key.content}Modifiers`] : [
|
881
|
+
"[",
|
882
|
+
...genExpression(key, context),
|
883
|
+
" + \"Modifiers\"]"
|
884
|
+
];
|
885
|
+
const modifiersVal = genDirectiveModifiers(modelModifiers);
|
886
|
+
return [
|
887
|
+
",",
|
888
|
+
NEWLINE,
|
889
|
+
...modifiersKey,
|
890
|
+
`: () => ({ ${modifiersVal} })`
|
891
|
+
];
|
892
|
+
}
|
893
|
+
function genRawSlots(slots, context) {
|
894
|
+
if (!slots.length) return;
|
895
|
+
const staticSlots = slots[0];
|
896
|
+
if (staticSlots.slotType === IRSlotType.STATIC) return genStaticSlots(staticSlots, context, slots.length > 1 ? slots.slice(1) : void 0);
|
897
|
+
else return genStaticSlots({
|
898
|
+
slotType: IRSlotType.STATIC,
|
899
|
+
slots: {}
|
900
|
+
}, context, slots);
|
901
|
+
}
|
902
|
+
function genStaticSlots({ slots }, context, dynamicSlots) {
|
903
|
+
const args = Object.keys(slots).map((name) => [`${JSON.stringify(name)}: `, ...genSlotBlockWithProps(slots[name], context)]);
|
904
|
+
if (dynamicSlots) args.push([`$: `, ...genDynamicSlots(dynamicSlots, context)]);
|
905
|
+
return genMulti(DELIMITERS_OBJECT_NEWLINE, ...args);
|
906
|
+
}
|
907
|
+
function genDynamicSlots(slots, context) {
|
908
|
+
return genMulti(DELIMITERS_ARRAY_NEWLINE, ...slots.map((slot) => slot.slotType === IRSlotType.STATIC ? genStaticSlots(slot, context) : slot.slotType === IRSlotType.EXPRESSION ? slot.slots.content : genDynamicSlot(slot, context, true)));
|
909
|
+
}
|
910
|
+
function genDynamicSlot(slot, context, withFunction = false) {
|
911
|
+
let frag;
|
912
|
+
switch (slot.slotType) {
|
913
|
+
case IRSlotType.DYNAMIC:
|
914
|
+
frag = genBasicDynamicSlot(slot, context);
|
915
|
+
break;
|
916
|
+
case IRSlotType.LOOP:
|
917
|
+
frag = genLoopSlot(slot, context);
|
918
|
+
break;
|
919
|
+
case IRSlotType.CONDITIONAL:
|
920
|
+
frag = genConditionalSlot(slot, context);
|
921
|
+
break;
|
922
|
+
}
|
923
|
+
return withFunction ? [
|
924
|
+
"() => (",
|
925
|
+
...frag,
|
926
|
+
")"
|
927
|
+
] : frag;
|
928
|
+
}
|
929
|
+
function genBasicDynamicSlot(slot, context) {
|
930
|
+
const { name, fn } = slot;
|
931
|
+
return genMulti(DELIMITERS_OBJECT_NEWLINE, ["name: ", ...genExpression(name, context)], ["fn: ", ...genSlotBlockWithProps(fn, context)]);
|
932
|
+
}
|
933
|
+
function genLoopSlot(slot, context) {
|
934
|
+
const { name, fn, loop } = slot;
|
935
|
+
const { value, key, index, source } = loop;
|
936
|
+
const rawValue = value && value.content;
|
937
|
+
const rawKey = key && key.content;
|
938
|
+
const rawIndex = index && index.content;
|
939
|
+
const idMap = {};
|
940
|
+
if (rawValue) idMap[rawValue] = rawValue;
|
941
|
+
if (rawKey) idMap[rawKey] = rawKey;
|
942
|
+
if (rawIndex) idMap[rawIndex] = rawIndex;
|
943
|
+
const slotExpr = genMulti(DELIMITERS_OBJECT_NEWLINE, ["name: ", ...context.withId(() => genExpression(name, context), idMap)], ["fn: ", ...context.withId(() => genSlotBlockWithProps(fn, context), idMap)]);
|
944
|
+
return [...genCall(context.helper("createForSlots"), genExpression(source, context), [
|
945
|
+
...genMulti([
|
946
|
+
"(",
|
947
|
+
")",
|
948
|
+
", "
|
949
|
+
], rawValue ? rawValue : rawKey || rawIndex ? "_" : void 0, rawKey ? rawKey : rawIndex ? "__" : void 0, rawIndex),
|
950
|
+
" => (",
|
951
|
+
...slotExpr,
|
952
|
+
")"
|
953
|
+
])];
|
954
|
+
}
|
955
|
+
function genConditionalSlot(slot, context) {
|
956
|
+
const { condition, positive, negative } = slot;
|
957
|
+
return [
|
958
|
+
...genExpression(condition, context),
|
959
|
+
INDENT_START,
|
960
|
+
NEWLINE,
|
961
|
+
"? ",
|
962
|
+
...genDynamicSlot(positive, context),
|
963
|
+
NEWLINE,
|
964
|
+
": ",
|
965
|
+
...negative ? [...genDynamicSlot(negative, context)] : ["void 0"],
|
966
|
+
INDENT_END
|
967
|
+
];
|
968
|
+
}
|
969
|
+
function genSlotBlockWithProps(oper, context) {
|
970
|
+
let isDestructureAssignment = false;
|
971
|
+
let rawProps;
|
972
|
+
let propsName;
|
973
|
+
let exitScope;
|
974
|
+
let depth;
|
975
|
+
const { props } = oper;
|
976
|
+
const idsOfProps = /* @__PURE__ */ new Set();
|
977
|
+
if (props) {
|
978
|
+
rawProps = props.content;
|
979
|
+
if (isDestructureAssignment = !!props.ast) {
|
980
|
+
[depth, exitScope] = context.enterScope();
|
981
|
+
propsName = `_slotProps${depth}`;
|
982
|
+
(0, ast_kit.walkIdentifiers)(props.ast, (id, _, __, ___, isLocal) => {
|
983
|
+
if (isLocal) idsOfProps.add(id.name);
|
984
|
+
}, true);
|
985
|
+
} else idsOfProps.add(propsName = rawProps);
|
986
|
+
}
|
987
|
+
const idMap = {};
|
988
|
+
idsOfProps.forEach((id) => idMap[id] = isDestructureAssignment ? `${propsName}[${JSON.stringify(id)}]` : null);
|
989
|
+
const blockFn = context.withId(() => genBlock(oper, context, [propsName]), idMap);
|
990
|
+
exitScope && exitScope();
|
991
|
+
return blockFn;
|
992
|
+
}
|
993
|
+
|
994
|
+
//#endregion
|
995
|
+
//#region src/generators/dom.ts
|
996
|
+
function genInsertNode({ parent, elements, anchor }, { helper }) {
|
997
|
+
let element = elements.map((el) => `n${el}`).join(", ");
|
998
|
+
if (elements.length > 1) element = `[${element}]`;
|
999
|
+
return [NEWLINE, ...genCall(helper("insert"), element, `n${parent}`, anchor === void 0 ? void 0 : `n${anchor}`)];
|
1000
|
+
}
|
1001
|
+
function genPrependNode(oper, { helper }) {
|
1002
|
+
return [NEWLINE, ...genCall(helper("prepend"), `n${oper.parent}`, ...oper.elements.map((el) => `n${el}`))];
|
1003
|
+
}
|
1004
|
+
|
1005
|
+
//#endregion
|
1006
|
+
//#region src/generators/for.ts
|
1007
|
+
/**
|
1008
|
+
* Flags to optimize vapor `createFor` runtime behavior, shared between the
|
1009
|
+
* compiler and the runtime
|
1010
|
+
*/
|
1011
|
+
let VaporVForFlags = /* @__PURE__ */ function(VaporVForFlags$1) {
|
1012
|
+
/**
|
1013
|
+
* v-for is the only child of a parent container, so it can take the fast
|
1014
|
+
* path with textContent = '' when the whole list is emptied
|
1015
|
+
*/
|
1016
|
+
VaporVForFlags$1[VaporVForFlags$1["FAST_REMOVE"] = 1] = "FAST_REMOVE";
|
1017
|
+
/**
|
1018
|
+
* v-for used on component - we can skip creating child scopes for each block
|
1019
|
+
* because the component itself already has a scope.
|
1020
|
+
*/
|
1021
|
+
VaporVForFlags$1[VaporVForFlags$1["IS_COMPONENT"] = 2] = "IS_COMPONENT";
|
1022
|
+
/**
|
1023
|
+
* v-for inside v-ince
|
1024
|
+
*/
|
1025
|
+
VaporVForFlags$1[VaporVForFlags$1["ONCE"] = 4] = "ONCE";
|
1026
|
+
return VaporVForFlags$1;
|
1027
|
+
}({});
|
1028
|
+
function genFor(oper, context) {
|
1029
|
+
const { helper } = context;
|
1030
|
+
const { source, value, key, index, render, keyProp, once, id, component, onlyChild } = oper;
|
1031
|
+
let rawValue = null;
|
1032
|
+
const rawKey = key && key.content;
|
1033
|
+
const rawIndex = index && index.content;
|
1034
|
+
const sourceExpr = [
|
1035
|
+
"() => (",
|
1036
|
+
...genExpression(source, context),
|
1037
|
+
")"
|
1038
|
+
];
|
1039
|
+
const idToPathMap = parseValueDestructure();
|
1040
|
+
const [depth, exitScope] = context.enterScope();
|
1041
|
+
const idMap = {};
|
1042
|
+
const itemVar = `_for_item${depth}`;
|
1043
|
+
idMap[itemVar] = null;
|
1044
|
+
idToPathMap.forEach((pathInfo, id$1) => {
|
1045
|
+
let path = `${itemVar}.value${pathInfo ? pathInfo.path : ""}`;
|
1046
|
+
if (pathInfo) {
|
1047
|
+
if (pathInfo.helper) {
|
1048
|
+
idMap[pathInfo.helper] = null;
|
1049
|
+
path = `${pathInfo.helper}(${path}, ${pathInfo.helperArgs})`;
|
1050
|
+
}
|
1051
|
+
if (pathInfo.dynamic) {
|
1052
|
+
const node = idMap[id$1] = (0, __vue_compiler_dom.createSimpleExpression)(path);
|
1053
|
+
const plugins = context.options.expressionPlugins;
|
1054
|
+
node.ast = (0, __babel_parser.parseExpression)(`(${path})`, { plugins: plugins ? [...plugins, "typescript"] : ["typescript"] });
|
1055
|
+
} else idMap[id$1] = path;
|
1056
|
+
} else idMap[id$1] = path;
|
1057
|
+
});
|
1058
|
+
const args = [itemVar];
|
1059
|
+
if (rawKey) {
|
1060
|
+
const keyVar = `_for_key${depth}`;
|
1061
|
+
args.push(`, ${keyVar}`);
|
1062
|
+
idMap[rawKey] = `${keyVar}.value`;
|
1063
|
+
idMap[keyVar] = null;
|
1064
|
+
}
|
1065
|
+
if (rawIndex) {
|
1066
|
+
const indexVar = `_for_index${depth}`;
|
1067
|
+
args.push(`, ${indexVar}`);
|
1068
|
+
idMap[rawIndex] = `${indexVar}.value`;
|
1069
|
+
idMap[indexVar] = null;
|
1070
|
+
}
|
1071
|
+
const { selectorPatterns, keyOnlyBindingPatterns } = matchPatterns(render, keyProp, idMap);
|
1072
|
+
const patternFrag = [];
|
1073
|
+
for (const [i, { selector }] of selectorPatterns.entries()) {
|
1074
|
+
const selectorName = `_selector${id}_${i}`;
|
1075
|
+
patternFrag.push(NEWLINE, `const ${selectorName} = `, ...genCall(`n${id}.useSelector`, [`() => `, ...genExpression(selector, context)]));
|
1076
|
+
}
|
1077
|
+
const blockFn = context.withId(() => {
|
1078
|
+
const frag = [];
|
1079
|
+
frag.push("(", ...args, ") => {", INDENT_START);
|
1080
|
+
if (selectorPatterns.length || keyOnlyBindingPatterns.length) frag.push(...genBlockContent(render, context, false, () => {
|
1081
|
+
const patternFrag$1 = [];
|
1082
|
+
for (const [i, { effect }] of selectorPatterns.entries()) {
|
1083
|
+
patternFrag$1.push(NEWLINE, `_selector${id}_${i}(() => {`, INDENT_START);
|
1084
|
+
for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
|
1085
|
+
patternFrag$1.push(INDENT_END, NEWLINE, `})`);
|
1086
|
+
}
|
1087
|
+
for (const { effect } of keyOnlyBindingPatterns) for (const oper$1 of effect.operations) patternFrag$1.push(...genOperation(oper$1, context));
|
1088
|
+
return patternFrag$1;
|
1089
|
+
}));
|
1090
|
+
else frag.push(...genBlockContent(render, context));
|
1091
|
+
frag.push(INDENT_END, NEWLINE, "}");
|
1092
|
+
return frag;
|
1093
|
+
}, idMap);
|
1094
|
+
exitScope();
|
1095
|
+
let flags = 0;
|
1096
|
+
if (onlyChild) flags |= VaporVForFlags.FAST_REMOVE;
|
1097
|
+
if (component) flags |= VaporVForFlags.IS_COMPONENT;
|
1098
|
+
if (once) flags |= VaporVForFlags.ONCE;
|
1099
|
+
return [
|
1100
|
+
NEWLINE,
|
1101
|
+
`const n${id} = `,
|
1102
|
+
...genCall(helper("createFor"), sourceExpr, blockFn, genCallback(keyProp), flags ? String(flags) : void 0),
|
1103
|
+
...patternFrag
|
1104
|
+
];
|
1105
|
+
function parseValueDestructure() {
|
1106
|
+
const map = /* @__PURE__ */ new Map();
|
1107
|
+
if (value) {
|
1108
|
+
rawValue = value && value.content;
|
1109
|
+
if (value.ast) (0, __vue_compiler_dom.walkIdentifiers)(value.ast, (id$1, _, parentStack, ___, isLocal) => {
|
1110
|
+
if (isLocal) {
|
1111
|
+
let path = "";
|
1112
|
+
let isDynamic = false;
|
1113
|
+
let helper$1;
|
1114
|
+
let helperArgs;
|
1115
|
+
for (let i = 0; i < parentStack.length; i++) {
|
1116
|
+
const parent = parentStack[i];
|
1117
|
+
const child = parentStack[i + 1] || id$1;
|
1118
|
+
if (parent.type === "ObjectProperty" && parent.value === child) if (parent.key.type === "StringLiteral") path += `[${JSON.stringify(parent.key.value)}]`;
|
1119
|
+
else if (parent.computed) {
|
1120
|
+
isDynamic = true;
|
1121
|
+
path += `[${value.content.slice(parent.key.start - 1, parent.key.end - 1)}]`;
|
1122
|
+
} else path += `.${parent.key.name}`;
|
1123
|
+
else if (parent.type === "ArrayPattern") {
|
1124
|
+
const index$1 = parent.elements.indexOf(child);
|
1125
|
+
if (child.type === "RestElement") path += `.slice(${index$1})`;
|
1126
|
+
else path += `[${index$1}]`;
|
1127
|
+
} else if (parent.type === "ObjectPattern" && child.type === "RestElement") {
|
1128
|
+
helper$1 = context.helper("getRestElement");
|
1129
|
+
helperArgs = `[${parent.properties.filter((p) => p.type === "ObjectProperty").map((p) => {
|
1130
|
+
if (p.key.type === "StringLiteral") return JSON.stringify(p.key.value);
|
1131
|
+
else if (p.computed) {
|
1132
|
+
isDynamic = true;
|
1133
|
+
return value.content.slice(p.key.start - 1, p.key.end - 1);
|
1134
|
+
} else return JSON.stringify(p.key.name);
|
1135
|
+
}).join(", ")}]`;
|
1136
|
+
}
|
1137
|
+
if (child.type === "AssignmentPattern" && (parent.type === "ObjectProperty" || parent.type === "ArrayPattern")) {
|
1138
|
+
isDynamic = true;
|
1139
|
+
helper$1 = context.helper("getDefaultValue");
|
1140
|
+
helperArgs = value.content.slice(child.right.start - 1, child.right.end - 1);
|
1141
|
+
}
|
1142
|
+
}
|
1143
|
+
map.set(id$1.name, {
|
1144
|
+
path,
|
1145
|
+
dynamic: isDynamic,
|
1146
|
+
helper: helper$1,
|
1147
|
+
helperArgs
|
1148
|
+
});
|
1149
|
+
}
|
1150
|
+
}, true);
|
1151
|
+
else map.set(rawValue, null);
|
1152
|
+
}
|
1153
|
+
return map;
|
1154
|
+
}
|
1155
|
+
function genCallback(expr) {
|
1156
|
+
if (!expr) return false;
|
1157
|
+
const res = context.withId(() => genExpression(expr, context), genSimpleIdMap());
|
1158
|
+
return [
|
1159
|
+
...genMulti([
|
1160
|
+
"(",
|
1161
|
+
")",
|
1162
|
+
", "
|
1163
|
+
], rawValue ? rawValue : rawKey || rawIndex ? "_" : void 0, rawKey ? rawKey : rawIndex ? "__" : void 0, rawIndex),
|
1164
|
+
" => (",
|
1165
|
+
...res,
|
1166
|
+
")"
|
1167
|
+
];
|
1168
|
+
}
|
1169
|
+
function genSimpleIdMap() {
|
1170
|
+
const idMap$1 = {};
|
1171
|
+
if (rawKey) idMap$1[rawKey] = null;
|
1172
|
+
if (rawIndex) idMap$1[rawIndex] = null;
|
1173
|
+
idToPathMap.forEach((_, id$1) => idMap$1[id$1] = null);
|
1174
|
+
return idMap$1;
|
1175
|
+
}
|
1176
|
+
}
|
1177
|
+
function matchPatterns(render, keyProp, idMap) {
|
1178
|
+
const selectorPatterns = [];
|
1179
|
+
const keyOnlyBindingPatterns = [];
|
1180
|
+
render.effect = render.effect.filter((effect) => {
|
1181
|
+
if (keyProp !== void 0) {
|
1182
|
+
const selector = matchSelectorPattern(effect, keyProp.ast, idMap);
|
1183
|
+
if (selector) {
|
1184
|
+
selectorPatterns.push(selector);
|
1185
|
+
return false;
|
1186
|
+
}
|
1187
|
+
const keyOnly = matchKeyOnlyBindingPattern(effect, keyProp.ast);
|
1188
|
+
if (keyOnly) {
|
1189
|
+
keyOnlyBindingPatterns.push(keyOnly);
|
1190
|
+
return false;
|
1191
|
+
}
|
1192
|
+
}
|
1193
|
+
return true;
|
1194
|
+
});
|
284
1195
|
return {
|
285
|
-
|
286
|
-
|
1196
|
+
keyOnlyBindingPatterns,
|
1197
|
+
selectorPatterns
|
287
1198
|
};
|
288
1199
|
}
|
289
|
-
function
|
1200
|
+
function matchKeyOnlyBindingPattern(effect, keyAst) {
|
1201
|
+
if (effect.expressions.length === 1) {
|
1202
|
+
const ast = effect.expressions[0].ast;
|
1203
|
+
if (typeof ast === "object" && ast !== null && isKeyOnlyBinding(ast, keyAst)) return { effect };
|
1204
|
+
}
|
1205
|
+
}
|
1206
|
+
function matchSelectorPattern(effect, keyAst, idMap) {
|
1207
|
+
if (effect.expressions.length === 1) {
|
1208
|
+
const ast = effect.expressions[0].ast;
|
1209
|
+
const offset = effect.expressions[0].loc.start.offset;
|
1210
|
+
if (typeof ast === "object" && ast) {
|
1211
|
+
const matcheds = [];
|
1212
|
+
(0, ast_kit.walkAST)(ast, { enter(node) {
|
1213
|
+
if (typeof node === "object" && node && node.type === "BinaryExpression" && node.operator === "===" && node.left.type !== "PrivateName") {
|
1214
|
+
const { left, right } = node;
|
1215
|
+
for (const [a, b] of [[left, right], [right, left]]) {
|
1216
|
+
const aIsKey = isKeyOnlyBinding(a, keyAst);
|
1217
|
+
const bIsKey = isKeyOnlyBinding(b, keyAst);
|
1218
|
+
const bVars = analyzeVariableScopes(b, idMap);
|
1219
|
+
if (aIsKey && !bIsKey && !bVars.locals.length) matcheds.push([a, b]);
|
1220
|
+
}
|
1221
|
+
}
|
1222
|
+
} });
|
1223
|
+
if (matcheds.length === 1) {
|
1224
|
+
const [key, selector] = matcheds[0];
|
1225
|
+
const content$1 = effect.expressions[0].content;
|
1226
|
+
let hasExtraId = false;
|
1227
|
+
const parentStackMap = /* @__PURE__ */ new Map();
|
1228
|
+
const parentStack = [];
|
1229
|
+
(0, __vue_compiler_dom.walkIdentifiers)(ast, (id) => {
|
1230
|
+
if (id.start !== key.start && id.start !== selector.start) hasExtraId = true;
|
1231
|
+
parentStackMap.set(id, parentStack.slice());
|
1232
|
+
}, false, parentStack);
|
1233
|
+
if (!hasExtraId) {
|
1234
|
+
const name = content$1.slice(selector.start - offset, selector.end - offset);
|
1235
|
+
return {
|
1236
|
+
effect,
|
1237
|
+
selector: {
|
1238
|
+
content: name,
|
1239
|
+
ast: (0, __vue_shared.extend)({}, selector, {
|
1240
|
+
start: 1,
|
1241
|
+
end: name.length + 1
|
1242
|
+
}),
|
1243
|
+
loc: selector.loc,
|
1244
|
+
isStatic: false
|
1245
|
+
}
|
1246
|
+
};
|
1247
|
+
}
|
1248
|
+
}
|
1249
|
+
}
|
1250
|
+
const content = effect.expressions[0].content;
|
1251
|
+
if (typeof ast === "object" && ast && ast.type === "ConditionalExpression" && ast.test.type === "BinaryExpression" && ast.test.operator === "===" && ast.test.left.type !== "PrivateName" && (0, __vue_compiler_dom.isStaticNode)(ast.consequent) && (0, __vue_compiler_dom.isStaticNode)(ast.alternate)) {
|
1252
|
+
const left = ast.test.left;
|
1253
|
+
const right = ast.test.right;
|
1254
|
+
for (const [a, b] of [[left, right], [right, left]]) {
|
1255
|
+
const aIsKey = isKeyOnlyBinding(a, keyAst);
|
1256
|
+
const bIsKey = isKeyOnlyBinding(b, keyAst);
|
1257
|
+
const bVars = analyzeVariableScopes(b, idMap);
|
1258
|
+
if (aIsKey && !bIsKey && !bVars.locals.length) return {
|
1259
|
+
effect,
|
1260
|
+
selector: {
|
1261
|
+
content: content.slice(b.start - offset, b.end - offset),
|
1262
|
+
ast: b,
|
1263
|
+
loc: b.loc,
|
1264
|
+
isStatic: false
|
1265
|
+
}
|
1266
|
+
};
|
1267
|
+
}
|
1268
|
+
}
|
1269
|
+
}
|
1270
|
+
}
|
1271
|
+
function analyzeVariableScopes(ast, idMap) {
|
1272
|
+
const globals = [];
|
1273
|
+
const locals = [];
|
1274
|
+
const ids = [];
|
1275
|
+
const parentStackMap = /* @__PURE__ */ new Map();
|
1276
|
+
const parentStack = [];
|
1277
|
+
(0, __vue_compiler_dom.walkIdentifiers)(ast, (id) => {
|
1278
|
+
ids.push(id);
|
1279
|
+
parentStackMap.set(id, parentStack.slice());
|
1280
|
+
}, false, parentStack);
|
1281
|
+
for (const id of ids) {
|
1282
|
+
if ((0, __vue_shared.isGloballyAllowed)(id.name)) continue;
|
1283
|
+
if (idMap[id.name]) locals.push(id.name);
|
1284
|
+
else globals.push(id.name);
|
1285
|
+
}
|
290
1286
|
return {
|
291
|
-
|
292
|
-
|
293
|
-
dynamic: newDynamic(),
|
294
|
-
effect: [],
|
295
|
-
operation: [],
|
296
|
-
returns: [],
|
297
|
-
tempId: 0
|
1287
|
+
globals,
|
1288
|
+
locals
|
298
1289
|
};
|
299
1290
|
}
|
300
|
-
function
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
1291
|
+
function isKeyOnlyBinding(expr, keyAst) {
|
1292
|
+
let only = true;
|
1293
|
+
(0, ast_kit.walkAST)(expr, { enter(node) {
|
1294
|
+
if ((0, __babel_types.isNodesEquivalent)(node, keyAst)) {
|
1295
|
+
this.skip();
|
1296
|
+
return;
|
1297
|
+
}
|
1298
|
+
if (node.type === "Identifier") only = false;
|
1299
|
+
} });
|
1300
|
+
return only;
|
306
1301
|
}
|
307
|
-
|
308
|
-
|
309
|
-
|
1302
|
+
|
1303
|
+
//#endregion
|
1304
|
+
//#region src/generators/html.ts
|
1305
|
+
function genSetHtml(oper, context) {
|
1306
|
+
const { helper } = context;
|
1307
|
+
const { value, element } = oper;
|
1308
|
+
return [NEWLINE, ...genCall(helper("setHtml"), `n${element}`, genExpression(value, context))];
|
1309
|
+
}
|
1310
|
+
|
1311
|
+
//#endregion
|
1312
|
+
//#region src/generators/if.ts
|
1313
|
+
function genIf(oper, context, isNested = false) {
|
1314
|
+
const { helper } = context;
|
1315
|
+
const { condition, positive, negative, once } = oper;
|
1316
|
+
const [frag, push] = buildCodeFragment();
|
1317
|
+
const conditionExpr = [
|
1318
|
+
"() => (",
|
1319
|
+
...genExpression(condition, context),
|
1320
|
+
")"
|
1321
|
+
];
|
1322
|
+
const positiveArg = genBlock(positive, context);
|
1323
|
+
let negativeArg = false;
|
1324
|
+
if (negative) if (negative.type === IRNodeTypes.BLOCK) negativeArg = genBlock(negative, context);
|
1325
|
+
else negativeArg = ["() => ", ...genIf(negative, context, true)];
|
1326
|
+
if (!isNested) push(NEWLINE, `const n${oper.id} = `);
|
1327
|
+
push(...genCall(helper("createIf"), conditionExpr, positiveArg, negativeArg, once && "true"));
|
1328
|
+
return frag;
|
1329
|
+
}
|
1330
|
+
|
1331
|
+
//#endregion
|
1332
|
+
//#region src/generators/templateRef.ts
|
1333
|
+
const setTemplateRefIdent = `_setTemplateRef`;
|
1334
|
+
function genSetTemplateRef(oper, context) {
|
1335
|
+
return [
|
1336
|
+
NEWLINE,
|
1337
|
+
oper.effect && `r${oper.element} = `,
|
1338
|
+
...genCall(setTemplateRefIdent, `n${oper.element}`, genExpression(oper.value, context), oper.effect ? `r${oper.element}` : oper.refFor ? "void 0" : void 0, oper.refFor && "true")
|
1339
|
+
];
|
1340
|
+
}
|
1341
|
+
function genDeclareOldRef(oper) {
|
1342
|
+
return [NEWLINE, `let r${oper.id}`];
|
1343
|
+
}
|
1344
|
+
|
1345
|
+
//#endregion
|
1346
|
+
//#region src/generators/text.ts
|
1347
|
+
function genSetText(oper, context) {
|
1348
|
+
const { helper } = context;
|
1349
|
+
const { element, values, generated } = oper;
|
1350
|
+
const texts = combineValues(values, context, true);
|
1351
|
+
return [NEWLINE, ...genCall(helper("setText"), `${generated ? "x" : "n"}${element}`, texts)];
|
1352
|
+
}
|
1353
|
+
function genGetTextChild(oper, context) {
|
1354
|
+
return [NEWLINE, `const x${oper.parent} = ${context.helper("child")}(n${oper.parent})`];
|
1355
|
+
}
|
1356
|
+
function genSetNodes(oper, context) {
|
1357
|
+
const { helper } = context;
|
1358
|
+
const { element, values, generated } = oper;
|
1359
|
+
return [NEWLINE, ...genCall(helper("setNodes"), `${generated ? "x" : "n"}${element}`, combineValues(values, context))];
|
1360
|
+
}
|
1361
|
+
function genCreateNodes(oper, context) {
|
1362
|
+
const { helper } = context;
|
1363
|
+
const { id, values } = oper;
|
1364
|
+
return [
|
1365
|
+
NEWLINE,
|
1366
|
+
`const n${id} = `,
|
1367
|
+
...genCall(helper("createNodes"), values && combineValues(values, context))
|
1368
|
+
];
|
1369
|
+
}
|
1370
|
+
function combineValues(values, context, setText) {
|
1371
|
+
return values.flatMap((value, i) => {
|
1372
|
+
let exp = genExpression(value, context);
|
1373
|
+
if (setText && getLiteralExpressionValue(value) == null) exp = genCall(context.helper("toDisplayString"), exp);
|
1374
|
+
if (i > 0) exp.unshift(setText ? " + " : ", ");
|
1375
|
+
return exp;
|
1376
|
+
});
|
1377
|
+
}
|
1378
|
+
|
1379
|
+
//#endregion
|
1380
|
+
//#region src/generators/operation.ts
|
1381
|
+
function genOperations(opers, context) {
|
1382
|
+
const [frag, push] = buildCodeFragment();
|
1383
|
+
for (const operation of opers) push(...genOperationWithInsertionState(operation, context));
|
1384
|
+
return frag;
|
1385
|
+
}
|
1386
|
+
function genOperationWithInsertionState(oper, context) {
|
1387
|
+
const [frag, push] = buildCodeFragment();
|
1388
|
+
if (isBlockOperation(oper) && oper.parent) push(...genInsertionState(oper, context));
|
1389
|
+
push(...genOperation(oper, context));
|
1390
|
+
return frag;
|
1391
|
+
}
|
1392
|
+
function genOperation(oper, context) {
|
1393
|
+
switch (oper.type) {
|
1394
|
+
case IRNodeTypes.SET_PROP: return genSetProp(oper, context);
|
1395
|
+
case IRNodeTypes.SET_DYNAMIC_PROPS: return genDynamicProps(oper, context);
|
1396
|
+
case IRNodeTypes.SET_TEXT: return genSetText(oper, context);
|
1397
|
+
case IRNodeTypes.SET_EVENT: return genSetEvent(oper, context);
|
1398
|
+
case IRNodeTypes.SET_DYNAMIC_EVENTS: return genSetDynamicEvents(oper, context);
|
1399
|
+
case IRNodeTypes.SET_HTML: return genSetHtml(oper, context);
|
1400
|
+
case IRNodeTypes.SET_TEMPLATE_REF: return genSetTemplateRef(oper, context);
|
1401
|
+
case IRNodeTypes.INSERT_NODE: return genInsertNode(oper, context);
|
1402
|
+
case IRNodeTypes.PREPEND_NODE: return genPrependNode(oper, context);
|
1403
|
+
case IRNodeTypes.IF: return genIf(oper, context);
|
1404
|
+
case IRNodeTypes.FOR: return genFor(oper, context);
|
1405
|
+
case IRNodeTypes.CREATE_COMPONENT_NODE: return genCreateComponent(oper, context);
|
1406
|
+
case IRNodeTypes.DECLARE_OLD_REF: return genDeclareOldRef(oper);
|
1407
|
+
case IRNodeTypes.SLOT_OUTLET_NODE: return [];
|
1408
|
+
case IRNodeTypes.DIRECTIVE: return genBuiltinDirective(oper, context);
|
1409
|
+
case IRNodeTypes.GET_TEXT_CHILD: return genGetTextChild(oper, context);
|
1410
|
+
case IRNodeTypes.SET_NODES: return genSetNodes(oper, context);
|
1411
|
+
case IRNodeTypes.CREATE_NODES: return genCreateNodes(oper, context);
|
1412
|
+
default: {
|
1413
|
+
const exhaustiveCheck = oper;
|
1414
|
+
throw new Error(`Unhandled operation type in genOperation: ${exhaustiveCheck}`);
|
1415
|
+
}
|
1416
|
+
}
|
1417
|
+
}
|
1418
|
+
function genEffects(effects, context, genExtraFrag) {
|
1419
|
+
const { helper } = context;
|
1420
|
+
const [frag, push, unshift] = buildCodeFragment();
|
1421
|
+
let operationsCount = 0;
|
1422
|
+
for (const [i, effect] of effects.entries()) {
|
1423
|
+
operationsCount += effect.operations.length;
|
1424
|
+
const frags = genEffect(effect, context);
|
1425
|
+
i > 0 && push(NEWLINE);
|
1426
|
+
if (frag.at(-1) === ")" && frags[0] === "(") push(";");
|
1427
|
+
push(...frags);
|
1428
|
+
}
|
1429
|
+
const newLineCount = frag.filter((frag$1) => frag$1 === NEWLINE).length;
|
1430
|
+
if (newLineCount > 1 || operationsCount > 1) {
|
1431
|
+
unshift(`{`, INDENT_START, NEWLINE);
|
1432
|
+
push(INDENT_END, NEWLINE, "}");
|
1433
|
+
}
|
1434
|
+
if (effects.length) {
|
1435
|
+
unshift(NEWLINE, `${helper("renderEffect")}(() => `);
|
1436
|
+
push(`)`);
|
1437
|
+
}
|
1438
|
+
if (genExtraFrag) push(...context.withId(genExtraFrag, {}));
|
1439
|
+
return frag;
|
1440
|
+
}
|
1441
|
+
function genEffect({ operations }, context) {
|
1442
|
+
const [frag, push] = buildCodeFragment();
|
1443
|
+
const operationsExps = genOperations(operations, context);
|
1444
|
+
const newlineCount = operationsExps.filter((frag$1) => frag$1 === NEWLINE).length;
|
1445
|
+
if (newlineCount > 1) push(...operationsExps);
|
1446
|
+
else push(...operationsExps.filter((frag$1) => frag$1 !== NEWLINE));
|
1447
|
+
return frag;
|
1448
|
+
}
|
1449
|
+
function genInsertionState(operation, context) {
|
1450
|
+
return [NEWLINE, ...genCall(context.helper("setInsertionState"), `n${operation.parent}`, operation.anchor == null ? void 0 : operation.anchor === -1 ? `0` : `n${operation.anchor}`)];
|
1451
|
+
}
|
1452
|
+
|
1453
|
+
//#endregion
|
1454
|
+
//#region src/generators/template.ts
|
1455
|
+
function genTemplates(templates, rootIndex, { helper }) {
|
1456
|
+
return templates.map((template, i) => template.startsWith("_template") ? template : `${helper("template")}(${JSON.stringify(template)}${i === rootIndex ? ", true" : ""})`);
|
1457
|
+
}
|
1458
|
+
function genSelf(dynamic, context) {
|
1459
|
+
const [frag, push] = buildCodeFragment();
|
1460
|
+
const { id, template, operation } = dynamic;
|
1461
|
+
if (id !== void 0 && template !== void 0) {
|
1462
|
+
push(NEWLINE, `const n${id} = t${template}()`);
|
1463
|
+
push(...genDirectivesForElement(id, context));
|
1464
|
+
}
|
1465
|
+
if (operation) push(...genOperationWithInsertionState(operation, context));
|
1466
|
+
return frag;
|
1467
|
+
}
|
1468
|
+
function genChildren(dynamic, context, pushBlock, from = `n${dynamic.id}`) {
|
1469
|
+
const { helper } = context;
|
1470
|
+
const [frag, push] = buildCodeFragment();
|
1471
|
+
const { children } = dynamic;
|
1472
|
+
let offset = 0;
|
1473
|
+
let prev;
|
1474
|
+
const childrenToGen = [];
|
1475
|
+
for (const [index, child] of children.entries()) {
|
1476
|
+
if (child.flags & DynamicFlag.NON_TEMPLATE) offset--;
|
1477
|
+
const id = child.flags & DynamicFlag.REFERENCED ? child.flags & DynamicFlag.INSERT ? child.anchor : child.id : void 0;
|
1478
|
+
if (id === void 0 && !child.hasDynamicChild) {
|
1479
|
+
push(...genSelf(child, context));
|
1480
|
+
continue;
|
1481
|
+
}
|
1482
|
+
const elementIndex = Number(index) + offset;
|
1483
|
+
const variable = id === void 0 ? `p${context.block.tempId++}` : `n${id}`;
|
1484
|
+
pushBlock(NEWLINE, `const ${variable} = `);
|
1485
|
+
if (prev) if (elementIndex - prev[1] === 1) pushBlock(...genCall(helper("next"), prev[0]));
|
1486
|
+
else pushBlock(...genCall(helper("nthChild"), from, String(elementIndex)));
|
1487
|
+
else if (elementIndex === 0) pushBlock(...genCall(helper("child"), from));
|
1488
|
+
else {
|
1489
|
+
let init = genCall(helper("child"), from);
|
1490
|
+
if (elementIndex === 1) init = genCall(helper("next"), init);
|
1491
|
+
else if (elementIndex > 1) init = genCall(helper("nthChild"), from, String(elementIndex));
|
1492
|
+
pushBlock(...init);
|
1493
|
+
}
|
1494
|
+
if (id === child.anchor) push(...genSelf(child, context));
|
1495
|
+
if (id !== void 0) push(...genDirectivesForElement(id, context));
|
1496
|
+
prev = [variable, elementIndex];
|
1497
|
+
childrenToGen.push([child, variable]);
|
1498
|
+
}
|
1499
|
+
if (childrenToGen.length) for (const [child, from$1] of childrenToGen) push(...genChildren(child, context, pushBlock, from$1));
|
1500
|
+
return frag;
|
1501
|
+
}
|
1502
|
+
|
1503
|
+
//#endregion
|
1504
|
+
//#region src/generators/block.ts
|
1505
|
+
function genBlock(oper, context, args = [], root) {
|
1506
|
+
return [
|
1507
|
+
"(",
|
1508
|
+
...args,
|
1509
|
+
") => {",
|
1510
|
+
INDENT_START,
|
1511
|
+
...genBlockContent(oper, context, root),
|
1512
|
+
INDENT_END,
|
1513
|
+
NEWLINE,
|
1514
|
+
"}"
|
1515
|
+
];
|
1516
|
+
}
|
1517
|
+
function genBlockContent(block, context, root, genEffectsExtraFrag) {
|
1518
|
+
const [frag, push] = buildCodeFragment();
|
1519
|
+
const { dynamic, effect, operation, returns } = block;
|
1520
|
+
const resetBlock = context.enterBlock(block);
|
1521
|
+
if (root) {
|
1522
|
+
for (let name of context.ir.component) {
|
1523
|
+
const id = (0, __vue_compiler_dom.toValidAssetId)(name, "component");
|
1524
|
+
const maybeSelfReference = name.endsWith("__self");
|
1525
|
+
if (maybeSelfReference) name = name.slice(0, -6);
|
1526
|
+
push(NEWLINE, `const ${id} = `, ...genCall(context.helper("resolveComponent"), JSON.stringify(name), maybeSelfReference ? "true" : void 0));
|
1527
|
+
}
|
1528
|
+
genResolveAssets("directive", "resolveDirective");
|
1529
|
+
}
|
1530
|
+
for (const child of dynamic.children) push(...genSelf(child, context));
|
1531
|
+
for (const child of dynamic.children) push(...genChildren(child, context, push, `n${child.id}`));
|
1532
|
+
push(...genOperations(operation, context));
|
1533
|
+
push(...genEffects(effect, context, genEffectsExtraFrag));
|
1534
|
+
push(NEWLINE, `return `);
|
1535
|
+
const returnNodes = returns.map((n) => `n${n}`);
|
1536
|
+
const returnsCode = returnNodes.length > 1 ? genMulti(DELIMITERS_ARRAY, ...returnNodes) : [returnNodes[0] || "null"];
|
1537
|
+
push(...returnsCode);
|
1538
|
+
resetBlock();
|
1539
|
+
return frag;
|
1540
|
+
function genResolveAssets(kind, helper) {
|
1541
|
+
for (const name of context.ir[kind]) push(NEWLINE, `const ${(0, __vue_compiler_dom.toValidAssetId)(name, kind)} = `, ...genCall(context.helper(helper), JSON.stringify(name)));
|
1542
|
+
}
|
1543
|
+
}
|
1544
|
+
|
1545
|
+
//#endregion
|
1546
|
+
//#region src/generate.ts
|
1547
|
+
var CodegenContext = class {
|
1548
|
+
options;
|
1549
|
+
helpers = new Set([]);
|
1550
|
+
helper = (name) => {
|
1551
|
+
this.helpers.add(name);
|
1552
|
+
return `_${name}`;
|
1553
|
+
};
|
1554
|
+
delegates = /* @__PURE__ */ new Set();
|
1555
|
+
identifiers = Object.create(null);
|
1556
|
+
seenInlineHandlerNames = Object.create(null);
|
1557
|
+
block;
|
1558
|
+
withId(fn, map) {
|
1559
|
+
const { identifiers } = this;
|
1560
|
+
const ids = Object.keys(map);
|
1561
|
+
for (const id of ids) {
|
1562
|
+
identifiers[id] ||= [];
|
1563
|
+
identifiers[id].unshift(map[id] || id);
|
1564
|
+
}
|
1565
|
+
const ret = fn();
|
1566
|
+
ids.forEach((id) => (0, __vue_shared.remove)(identifiers[id], map[id] || id));
|
1567
|
+
return ret;
|
1568
|
+
}
|
1569
|
+
enterBlock(block) {
|
1570
|
+
const parent = this.block;
|
1571
|
+
this.block = block;
|
1572
|
+
return () => this.block = parent;
|
1573
|
+
}
|
1574
|
+
scopeLevel = 0;
|
1575
|
+
enterScope() {
|
1576
|
+
return [this.scopeLevel++, () => this.scopeLevel--];
|
1577
|
+
}
|
1578
|
+
constructor(ir, options) {
|
1579
|
+
this.ir = ir;
|
1580
|
+
const defaultOptions$1 = {
|
1581
|
+
mode: "module",
|
1582
|
+
sourceMap: false,
|
1583
|
+
filename: `template.vue.html`,
|
1584
|
+
scopeId: null,
|
1585
|
+
runtimeGlobalName: `Vue`,
|
1586
|
+
runtimeModuleName: `vue`,
|
1587
|
+
ssrRuntimeModuleName: "vue/server-renderer",
|
1588
|
+
ssr: false,
|
1589
|
+
isTS: false,
|
1590
|
+
inSSR: false,
|
1591
|
+
templates: [],
|
1592
|
+
expressionPlugins: []
|
1593
|
+
};
|
1594
|
+
this.options = (0, __vue_shared.extend)(defaultOptions$1, options);
|
1595
|
+
this.block = ir.block;
|
1596
|
+
}
|
1597
|
+
};
|
1598
|
+
function generate(ir, options = {}) {
|
1599
|
+
const [frag, push] = buildCodeFragment();
|
1600
|
+
const context = new CodegenContext(ir, options);
|
1601
|
+
const { helpers: helpers$1 } = context;
|
1602
|
+
push(INDENT_START);
|
1603
|
+
if (ir.hasTemplateRef) push(NEWLINE, `const ${setTemplateRefIdent} = ${context.helper("createTemplateRefSetter")}()`);
|
1604
|
+
push(...genBlockContent(ir.block, context, true));
|
1605
|
+
push(INDENT_END, NEWLINE);
|
1606
|
+
if (context.delegates.size) context.helper("delegateEvents");
|
1607
|
+
const templates = genTemplates(ir.templates, ir.rootTemplateIndex, context);
|
1608
|
+
const [code, map] = codeFragmentToString(frag, context);
|
1609
|
+
return {
|
1610
|
+
code,
|
1611
|
+
ast: ir,
|
1612
|
+
map: map && map.toJSON(),
|
1613
|
+
helpers: helpers$1,
|
1614
|
+
templates,
|
1615
|
+
delegates: context.delegates
|
1616
|
+
};
|
310
1617
|
}
|
311
|
-
const EMPTY_EXPRESSION = (0, __vue_compiler_dom.createSimpleExpression)("", true);
|
312
|
-
const isFragmentNode = (node) => node.type === IRNodeTypes.ROOT || node.type === "JSXFragment" || node.type === "JSXElement" && !!isTemplate(node);
|
313
1618
|
|
314
1619
|
//#endregion
|
315
1620
|
//#region src/transform.ts
|
316
1621
|
const defaultOptions = {
|
317
1622
|
filename: "",
|
318
|
-
prefixIdentifiers: false,
|
319
1623
|
hoistStatic: false,
|
320
1624
|
hmr: false,
|
321
1625
|
cacheHandlers: false,
|
322
1626
|
nodeTransforms: [],
|
323
1627
|
directiveTransforms: {},
|
1628
|
+
templates: [],
|
324
1629
|
transformHoist: null,
|
325
1630
|
isBuiltInComponent: __vue_shared.NOOP,
|
326
1631
|
isCustomElement: __vue_shared.NOOP,
|
@@ -330,8 +1635,6 @@ const defaultOptions = {
|
|
330
1635
|
ssr: false,
|
331
1636
|
inSSR: false,
|
332
1637
|
ssrCssVars: ``,
|
333
|
-
bindingMetadata: __vue_shared.EMPTY_OBJ,
|
334
|
-
inline: false,
|
335
1638
|
isTS: false,
|
336
1639
|
onError: __vue_compiler_dom.defaultOnError,
|
337
1640
|
onWarn: __vue_compiler_dom.defaultOnWarn
|
@@ -387,10 +1690,10 @@ var TransformContext = class TransformContext {
|
|
387
1690
|
return this.dynamic.id = this.increaseId();
|
388
1691
|
}
|
389
1692
|
pushTemplate(content) {
|
390
|
-
const existing = this.ir.
|
1693
|
+
const existing = this.ir.templates.indexOf(content);
|
391
1694
|
if (existing !== -1) return existing;
|
392
|
-
this.ir.
|
393
|
-
return this.ir.
|
1695
|
+
this.ir.templates.push(content);
|
1696
|
+
return this.ir.templates.length - 1;
|
394
1697
|
}
|
395
1698
|
registerTemplate() {
|
396
1699
|
if (!this.template) return -1;
|
@@ -425,7 +1728,7 @@ function transform(node, options = {}) {
|
|
425
1728
|
type: IRNodeTypes.ROOT,
|
426
1729
|
node,
|
427
1730
|
source: node.source,
|
428
|
-
|
1731
|
+
templates: options.templates || [],
|
429
1732
|
component: /* @__PURE__ */ new Set(),
|
430
1733
|
directive: /* @__PURE__ */ new Set(),
|
431
1734
|
block: newBlock(node),
|
@@ -610,7 +1913,7 @@ function transformNativeElement(tag, propsResult, singleRoot, context, getEffect
|
|
610
1913
|
}
|
611
1914
|
template += `>${context.childrenTemplate.join("")}`;
|
612
1915
|
if (!(0, __vue_shared.isVoidTag)(tag)) template += `</${tag}>`;
|
613
|
-
if (singleRoot) context.ir.rootTemplateIndex = context.ir.
|
1916
|
+
if (singleRoot) context.ir.rootTemplateIndex = context.ir.templates.length;
|
614
1917
|
if (context.parent && context.parent.node.type === "JSXElement" && context.parent.node.openingElement.name.type === "JSXIdentifier" && !(0, __vue_compiler_dom.isValidHTMLNesting)(context.parent.node.openingElement.name.name, tag)) {
|
615
1918
|
context.reference();
|
616
1919
|
context.dynamic.template = context.pushTemplate(template);
|
@@ -1002,7 +2305,7 @@ function processIf(node, attribute, context) {
|
|
1002
2305
|
id,
|
1003
2306
|
condition: dir.exp,
|
1004
2307
|
positive: branch,
|
1005
|
-
once: context.inVOnce || (0, __vue_compiler_dom.isConstantNode)(attribute.value,
|
2308
|
+
once: context.inVOnce || (0, __vue_compiler_dom.isConstantNode)(attribute.value, {})
|
1006
2309
|
};
|
1007
2310
|
};
|
1008
2311
|
} else {
|
@@ -1119,9 +2422,9 @@ function hasDynamicKeyVBind(node) {
|
|
1119
2422
|
const delegatedEvents = /* @__PURE__ */ (0, __vue_shared.makeMap)("beforeinput,click,dblclick,contextmenu,focusin,focusout,input,keydown,keyup,mousedown,mousemove,mouseout,mouseover,mouseup,pointerdown,pointermove,pointerout,pointerover,pointerup,touchend,touchmove,touchstart");
|
1120
2423
|
const transformVOn = (dir, node, context) => {
|
1121
2424
|
const { name, loc, value } = dir;
|
1122
|
-
if (name
|
2425
|
+
if (!name) return;
|
1123
2426
|
const isComponent = isJSXComponent(node);
|
1124
|
-
const [nameString, ...modifiers] = name.name.replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
|
2427
|
+
const [nameString, ...modifiers] = context.ir.source.slice(name.start, name.end).replace(/^on([A-Z])/, (_, $1) => $1.toLowerCase()).split("_");
|
1125
2428
|
if (!value && !modifiers.length) context.options.onError((0, __vue_compiler_dom.createCompilerError)(__vue_compiler_dom.ErrorCodes.X_V_ON_NO_EXPRESSION, resolveLocation(loc, context)));
|
1126
2429
|
let arg = resolveSimpleExpression(nameString, true, dir.name.loc);
|
1127
2430
|
const exp = resolveExpression(dir.value, context);
|
@@ -1319,13 +2622,10 @@ function createSlotBlock(slotNode, dir, context) {
|
|
1319
2622
|
//#region src/transforms/vSlots.ts
|
1320
2623
|
const transformVSlots = (dir, node, context) => {
|
1321
2624
|
if (!isJSXComponent(node)) return;
|
1322
|
-
if (dir.value?.type === "JSXExpressionContainer") {
|
1323
|
-
|
1324
|
-
|
1325
|
-
|
1326
|
-
}];
|
1327
|
-
if (node.children.length) context.options.onError((0, __vue_compiler_dom.createCompilerError)(__vue_compiler_dom.ErrorCodes.X_V_SLOT_MIXED_SLOT_USAGE, resolveLocation(node.children[0].loc, context)));
|
1328
|
-
}
|
2625
|
+
if (dir.value?.type === "JSXExpressionContainer") context.slots = [{
|
2626
|
+
slotType: IRSlotType.EXPRESSION,
|
2627
|
+
slots: resolveExpression(dir.value.expression, context)
|
2628
|
+
}];
|
1329
2629
|
};
|
1330
2630
|
|
1331
2631
|
//#endregion
|
@@ -1362,11 +2662,7 @@ const transformVText = (dir, node, context) => {
|
|
1362
2662
|
//#endregion
|
1363
2663
|
//#region src/compile.ts
|
1364
2664
|
function compile(source, options = {}) {
|
1365
|
-
const resolvedOptions = (0, __vue_shared.extend)({}, options, {
|
1366
|
-
inline: true,
|
1367
|
-
prefixIdentifiers: false,
|
1368
|
-
expressionPlugins: options.expressionPlugins || ["jsx"]
|
1369
|
-
});
|
2665
|
+
const resolvedOptions = (0, __vue_shared.extend)({}, options, { expressionPlugins: options.expressionPlugins || ["jsx"] });
|
1370
2666
|
if (!resolvedOptions.source && (0, __vue_shared.isString)(source)) resolvedOptions.source = source;
|
1371
2667
|
if (resolvedOptions.isTS) {
|
1372
2668
|
const { expressionPlugins } = resolvedOptions;
|
@@ -1387,10 +2683,7 @@ function compile(source, options = {}) {
|
|
1387
2683
|
nodeTransforms: [...nodeTransforms, ...resolvedOptions.nodeTransforms || []],
|
1388
2684
|
directiveTransforms: (0, __vue_shared.extend)({}, directiveTransforms, resolvedOptions.directiveTransforms || {})
|
1389
2685
|
}));
|
1390
|
-
return
|
1391
|
-
...resolvedOptions,
|
1392
|
-
customGenOperation
|
1393
|
-
});
|
2686
|
+
return generate(ir, resolvedOptions);
|
1394
2687
|
}
|
1395
2688
|
function getBaseTransformPreset() {
|
1396
2689
|
return [[
|
@@ -1414,6 +2707,7 @@ function getBaseTransformPreset() {
|
|
1414
2707
|
}
|
1415
2708
|
|
1416
2709
|
//#endregion
|
2710
|
+
exports.CodegenContext = CodegenContext;
|
1417
2711
|
exports.DynamicFlag = DynamicFlag;
|
1418
2712
|
exports.IRDynamicPropsKind = IRDynamicPropsKind;
|
1419
2713
|
exports.IRNodeTypes = IRNodeTypes;
|
@@ -1421,7 +2715,7 @@ exports.IRSlotType = IRSlotType;
|
|
1421
2715
|
exports.TransformContext = TransformContext;
|
1422
2716
|
exports.compile = compile;
|
1423
2717
|
exports.createStructuralDirectiveTransform = createStructuralDirectiveTransform;
|
1424
|
-
exports.generate =
|
2718
|
+
exports.generate = generate;
|
1425
2719
|
exports.isBlockOperation = isBlockOperation;
|
1426
2720
|
exports.transform = transform;
|
1427
2721
|
exports.transformChildren = transformChildren;
|