@vue/compiler-dom 3.2.47 → 3.3.0-alpha.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.
@@ -16,16 +16,16 @@ const V_SHOW = Symbol(`vShow` );
16
16
  const TRANSITION = Symbol(`Transition` );
17
17
  const TRANSITION_GROUP = Symbol(`TransitionGroup` );
18
18
  compilerCore.registerRuntimeHelpers({
19
- [V_MODEL_RADIO]: `vModelRadio`,
20
- [V_MODEL_CHECKBOX]: `vModelCheckbox`,
21
- [V_MODEL_TEXT]: `vModelText`,
22
- [V_MODEL_SELECT]: `vModelSelect`,
23
- [V_MODEL_DYNAMIC]: `vModelDynamic`,
24
- [V_ON_WITH_MODIFIERS]: `withModifiers`,
25
- [V_ON_WITH_KEYS]: `withKeys`,
26
- [V_SHOW]: `vShow`,
27
- [TRANSITION]: `Transition`,
28
- [TRANSITION_GROUP]: `TransitionGroup`
19
+ [V_MODEL_RADIO]: `vModelRadio`,
20
+ [V_MODEL_CHECKBOX]: `vModelCheckbox`,
21
+ [V_MODEL_TEXT]: `vModelText`,
22
+ [V_MODEL_SELECT]: `vModelSelect`,
23
+ [V_MODEL_DYNAMIC]: `vModelDynamic`,
24
+ [V_ON_WITH_MODIFIERS]: `withModifiers`,
25
+ [V_ON_WITH_KEYS]: `withKeys`,
26
+ [V_SHOW]: `vShow`,
27
+ [TRANSITION]: `Transition`,
28
+ [TRANSITION_GROUP]: `TransitionGroup`
29
29
  });
30
30
 
31
31
  var namedCharacterReferences = {
@@ -2262,861 +2262,764 @@ var namedCharacterReferences = {
2262
2262
  "CounterClockwiseContourIntegral;": "∳"
2263
2263
  };
2264
2264
 
2265
- // lazy compute this to make this file tree-shakable for browser
2266
2265
  let maxCRNameLength;
2267
2266
  const decodeHtml = (rawText, asAttr) => {
2268
- let offset = 0;
2269
- const end = rawText.length;
2270
- let decodedText = '';
2271
- function advance(length) {
2272
- offset += length;
2273
- rawText = rawText.slice(length);
2267
+ let offset = 0;
2268
+ const end = rawText.length;
2269
+ let decodedText = "";
2270
+ function advance(length) {
2271
+ offset += length;
2272
+ rawText = rawText.slice(length);
2273
+ }
2274
+ while (offset < end) {
2275
+ const head = /&(?:#x?)?/i.exec(rawText);
2276
+ if (!head || offset + head.index >= end) {
2277
+ const remaining = end - offset;
2278
+ decodedText += rawText.slice(0, remaining);
2279
+ advance(remaining);
2280
+ break;
2274
2281
  }
2275
- while (offset < end) {
2276
- const head = /&(?:#x?)?/i.exec(rawText);
2277
- if (!head || offset + head.index >= end) {
2278
- const remaining = end - offset;
2279
- decodedText += rawText.slice(0, remaining);
2280
- advance(remaining);
2281
- break;
2282
+ decodedText += rawText.slice(0, head.index);
2283
+ advance(head.index);
2284
+ if (head[0] === "&") {
2285
+ let name = "";
2286
+ let value = void 0;
2287
+ if (/[0-9a-z]/i.test(rawText[1])) {
2288
+ if (!maxCRNameLength) {
2289
+ maxCRNameLength = Object.keys(namedCharacterReferences).reduce(
2290
+ (max, name2) => Math.max(max, name2.length),
2291
+ 0
2292
+ );
2282
2293
  }
2283
- // Advance to the "&".
2284
- decodedText += rawText.slice(0, head.index);
2285
- advance(head.index);
2286
- if (head[0] === '&') {
2287
- // Named character reference.
2288
- let name = '';
2289
- let value = undefined;
2290
- if (/[0-9a-z]/i.test(rawText[1])) {
2291
- if (!maxCRNameLength) {
2292
- maxCRNameLength = Object.keys(namedCharacterReferences).reduce((max, name) => Math.max(max, name.length), 0);
2293
- }
2294
- for (let length = maxCRNameLength; !value && length > 0; --length) {
2295
- name = rawText.slice(1, 1 + length);
2296
- value = namedCharacterReferences[name];
2297
- }
2298
- if (value) {
2299
- const semi = name.endsWith(';');
2300
- if (asAttr &&
2301
- !semi &&
2302
- /[=a-z0-9]/i.test(rawText[name.length + 1] || '')) {
2303
- decodedText += '&' + name;
2304
- advance(1 + name.length);
2305
- }
2306
- else {
2307
- decodedText += value;
2308
- advance(1 + name.length);
2309
- }
2310
- }
2311
- else {
2312
- decodedText += '&' + name;
2313
- advance(1 + name.length);
2314
- }
2315
- }
2316
- else {
2317
- decodedText += '&';
2318
- advance(1);
2319
- }
2294
+ for (let length = maxCRNameLength; !value && length > 0; --length) {
2295
+ name = rawText.slice(1, 1 + length);
2296
+ value = namedCharacterReferences[name];
2320
2297
  }
2321
- else {
2322
- // Numeric character reference.
2323
- const hex = head[0] === '&#x';
2324
- const pattern = hex ? /^&#x([0-9a-f]+);?/i : /^&#([0-9]+);?/;
2325
- const body = pattern.exec(rawText);
2326
- if (!body) {
2327
- decodedText += head[0];
2328
- advance(head[0].length);
2329
- }
2330
- else {
2331
- // https://html.spec.whatwg.org/multipage/parsing.html#numeric-character-reference-end-state
2332
- let cp = Number.parseInt(body[1], hex ? 16 : 10);
2333
- if (cp === 0) {
2334
- cp = 0xfffd;
2335
- }
2336
- else if (cp > 0x10ffff) {
2337
- cp = 0xfffd;
2338
- }
2339
- else if (cp >= 0xd800 && cp <= 0xdfff) {
2340
- cp = 0xfffd;
2341
- }
2342
- else if ((cp >= 0xfdd0 && cp <= 0xfdef) || (cp & 0xfffe) === 0xfffe) ;
2343
- else if ((cp >= 0x01 && cp <= 0x08) ||
2344
- cp === 0x0b ||
2345
- (cp >= 0x0d && cp <= 0x1f) ||
2346
- (cp >= 0x7f && cp <= 0x9f)) {
2347
- cp = CCR_REPLACEMENTS[cp] || cp;
2348
- }
2349
- decodedText += String.fromCodePoint(cp);
2350
- advance(body[0].length);
2351
- }
2298
+ if (value) {
2299
+ const semi = name.endsWith(";");
2300
+ if (asAttr && !semi && /[=a-z0-9]/i.test(rawText[name.length + 1] || "")) {
2301
+ decodedText += "&" + name;
2302
+ advance(1 + name.length);
2303
+ } else {
2304
+ decodedText += value;
2305
+ advance(1 + name.length);
2306
+ }
2307
+ } else {
2308
+ decodedText += "&" + name;
2309
+ advance(1 + name.length);
2310
+ }
2311
+ } else {
2312
+ decodedText += "&";
2313
+ advance(1);
2314
+ }
2315
+ } else {
2316
+ const hex = head[0] === "&#x";
2317
+ const pattern = hex ? /^&#x([0-9a-f]+);?/i : /^&#([0-9]+);?/;
2318
+ const body = pattern.exec(rawText);
2319
+ if (!body) {
2320
+ decodedText += head[0];
2321
+ advance(head[0].length);
2322
+ } else {
2323
+ let cp = Number.parseInt(body[1], hex ? 16 : 10);
2324
+ if (cp === 0) {
2325
+ cp = 65533;
2326
+ } else if (cp > 1114111) {
2327
+ cp = 65533;
2328
+ } else if (cp >= 55296 && cp <= 57343) {
2329
+ cp = 65533;
2330
+ } else if (cp >= 64976 && cp <= 65007 || (cp & 65534) === 65534) ; else if (cp >= 1 && cp <= 8 || cp === 11 || cp >= 13 && cp <= 31 || cp >= 127 && cp <= 159) {
2331
+ cp = CCR_REPLACEMENTS[cp] || cp;
2352
2332
  }
2333
+ decodedText += String.fromCodePoint(cp);
2334
+ advance(body[0].length);
2335
+ }
2353
2336
  }
2354
- return decodedText;
2337
+ }
2338
+ return decodedText;
2355
2339
  };
2356
- // https://html.spec.whatwg.org/multipage/parsing.html#numeric-character-reference-end-state
2357
2340
  const CCR_REPLACEMENTS = {
2358
- 0x80: 0x20ac,
2359
- 0x82: 0x201a,
2360
- 0x83: 0x0192,
2361
- 0x84: 0x201e,
2362
- 0x85: 0x2026,
2363
- 0x86: 0x2020,
2364
- 0x87: 0x2021,
2365
- 0x88: 0x02c6,
2366
- 0x89: 0x2030,
2367
- 0x8a: 0x0160,
2368
- 0x8b: 0x2039,
2369
- 0x8c: 0x0152,
2370
- 0x8e: 0x017d,
2371
- 0x91: 0x2018,
2372
- 0x92: 0x2019,
2373
- 0x93: 0x201c,
2374
- 0x94: 0x201d,
2375
- 0x95: 0x2022,
2376
- 0x96: 0x2013,
2377
- 0x97: 0x2014,
2378
- 0x98: 0x02dc,
2379
- 0x99: 0x2122,
2380
- 0x9a: 0x0161,
2381
- 0x9b: 0x203a,
2382
- 0x9c: 0x0153,
2383
- 0x9e: 0x017e,
2384
- 0x9f: 0x0178
2341
+ 128: 8364,
2342
+ 130: 8218,
2343
+ 131: 402,
2344
+ 132: 8222,
2345
+ 133: 8230,
2346
+ 134: 8224,
2347
+ 135: 8225,
2348
+ 136: 710,
2349
+ 137: 8240,
2350
+ 138: 352,
2351
+ 139: 8249,
2352
+ 140: 338,
2353
+ 142: 381,
2354
+ 145: 8216,
2355
+ 146: 8217,
2356
+ 147: 8220,
2357
+ 148: 8221,
2358
+ 149: 8226,
2359
+ 150: 8211,
2360
+ 151: 8212,
2361
+ 152: 732,
2362
+ 153: 8482,
2363
+ 154: 353,
2364
+ 155: 8250,
2365
+ 156: 339,
2366
+ 158: 382,
2367
+ 159: 376
2385
2368
  };
2386
2369
 
2387
- const isRawTextContainer = /*#__PURE__*/ shared.makeMap('style,iframe,script,noscript', true);
2370
+ const isRawTextContainer = /* @__PURE__ */ shared.makeMap(
2371
+ "style,iframe,script,noscript",
2372
+ true
2373
+ );
2388
2374
  const parserOptions = {
2389
- isVoidTag: shared.isVoidTag,
2390
- isNativeTag: tag => shared.isHTMLTag(tag) || shared.isSVGTag(tag),
2391
- isPreTag: tag => tag === 'pre',
2392
- decodeEntities: decodeHtml,
2393
- isBuiltInComponent: (tag) => {
2394
- if (compilerCore.isBuiltInType(tag, `Transition`)) {
2395
- return TRANSITION;
2396
- }
2397
- else if (compilerCore.isBuiltInType(tag, `TransitionGroup`)) {
2398
- return TRANSITION_GROUP;
2399
- }
2400
- },
2401
- // https://html.spec.whatwg.org/multipage/parsing.html#tree-construction-dispatcher
2402
- getNamespace(tag, parent) {
2403
- let ns = parent ? parent.ns : 0 /* DOMNamespaces.HTML */;
2404
- if (parent && ns === 2 /* DOMNamespaces.MATH_ML */) {
2405
- if (parent.tag === 'annotation-xml') {
2406
- if (tag === 'svg') {
2407
- return 1 /* DOMNamespaces.SVG */;
2408
- }
2409
- if (parent.props.some(a => a.type === 6 /* NodeTypes.ATTRIBUTE */ &&
2410
- a.name === 'encoding' &&
2411
- a.value != null &&
2412
- (a.value.content === 'text/html' ||
2413
- a.value.content === 'application/xhtml+xml'))) {
2414
- ns = 0 /* DOMNamespaces.HTML */;
2415
- }
2416
- }
2417
- else if (/^m(?:[ions]|text)$/.test(parent.tag) &&
2418
- tag !== 'mglyph' &&
2419
- tag !== 'malignmark') {
2420
- ns = 0 /* DOMNamespaces.HTML */;
2421
- }
2422
- }
2423
- else if (parent && ns === 1 /* DOMNamespaces.SVG */) {
2424
- if (parent.tag === 'foreignObject' ||
2425
- parent.tag === 'desc' ||
2426
- parent.tag === 'title') {
2427
- ns = 0 /* DOMNamespaces.HTML */;
2428
- }
2429
- }
2430
- if (ns === 0 /* DOMNamespaces.HTML */) {
2431
- if (tag === 'svg') {
2432
- return 1 /* DOMNamespaces.SVG */;
2433
- }
2434
- if (tag === 'math') {
2435
- return 2 /* DOMNamespaces.MATH_ML */;
2436
- }
2375
+ isVoidTag: shared.isVoidTag,
2376
+ isNativeTag: (tag) => shared.isHTMLTag(tag) || shared.isSVGTag(tag),
2377
+ isPreTag: (tag) => tag === "pre",
2378
+ decodeEntities: decodeHtml,
2379
+ isBuiltInComponent: (tag) => {
2380
+ if (compilerCore.isBuiltInType(tag, `Transition`)) {
2381
+ return TRANSITION;
2382
+ } else if (compilerCore.isBuiltInType(tag, `TransitionGroup`)) {
2383
+ return TRANSITION_GROUP;
2384
+ }
2385
+ },
2386
+ // https://html.spec.whatwg.org/multipage/parsing.html#tree-construction-dispatcher
2387
+ getNamespace(tag, parent) {
2388
+ let ns = parent ? parent.ns : 0;
2389
+ if (parent && ns === 2) {
2390
+ if (parent.tag === "annotation-xml") {
2391
+ if (tag === "svg") {
2392
+ return 1;
2437
2393
  }
2438
- return ns;
2439
- },
2440
- // https://html.spec.whatwg.org/multipage/parsing.html#parsing-html-fragments
2441
- getTextMode({ tag, ns }) {
2442
- if (ns === 0 /* DOMNamespaces.HTML */) {
2443
- if (tag === 'textarea' || tag === 'title') {
2444
- return 1 /* TextModes.RCDATA */;
2445
- }
2446
- if (isRawTextContainer(tag)) {
2447
- return 2 /* TextModes.RAWTEXT */;
2448
- }
2394
+ if (parent.props.some(
2395
+ (a) => a.type === 6 && a.name === "encoding" && a.value != null && (a.value.content === "text/html" || a.value.content === "application/xhtml+xml")
2396
+ )) {
2397
+ ns = 0;
2449
2398
  }
2450
- return 0 /* TextModes.DATA */;
2399
+ } else if (/^m(?:[ions]|text)$/.test(parent.tag) && tag !== "mglyph" && tag !== "malignmark") {
2400
+ ns = 0;
2401
+ }
2402
+ } else if (parent && ns === 1) {
2403
+ if (parent.tag === "foreignObject" || parent.tag === "desc" || parent.tag === "title") {
2404
+ ns = 0;
2405
+ }
2406
+ }
2407
+ if (ns === 0) {
2408
+ if (tag === "svg") {
2409
+ return 1;
2410
+ }
2411
+ if (tag === "math") {
2412
+ return 2;
2413
+ }
2414
+ }
2415
+ return ns;
2416
+ },
2417
+ // https://html.spec.whatwg.org/multipage/parsing.html#parsing-html-fragments
2418
+ getTextMode({ tag, ns }) {
2419
+ if (ns === 0) {
2420
+ if (tag === "textarea" || tag === "title") {
2421
+ return 1;
2422
+ }
2423
+ if (isRawTextContainer(tag)) {
2424
+ return 2;
2425
+ }
2451
2426
  }
2427
+ return 0;
2428
+ }
2452
2429
  };
2453
2430
 
2454
- // Parse inline CSS strings for static style attributes into an object.
2455
- // This is a NodeTransform since it works on the static `style` attribute and
2456
- // converts it into a dynamic equivalent:
2457
- // style="color: red" -> :style='{ "color": "red" }'
2458
- // It is then processed by `transformElement` and included in the generated
2459
- // props.
2460
- const transformStyle = node => {
2461
- if (node.type === 1 /* NodeTypes.ELEMENT */) {
2462
- node.props.forEach((p, i) => {
2463
- if (p.type === 6 /* NodeTypes.ATTRIBUTE */ && p.name === 'style' && p.value) {
2464
- // replace p with an expression node
2465
- node.props[i] = {
2466
- type: 7 /* NodeTypes.DIRECTIVE */,
2467
- name: `bind`,
2468
- arg: compilerCore.createSimpleExpression(`style`, true, p.loc),
2469
- exp: parseInlineCSS(p.value.content, p.loc),
2470
- modifiers: [],
2471
- loc: p.loc
2472
- };
2473
- }
2474
- });
2475
- }
2431
+ const transformStyle = (node) => {
2432
+ if (node.type === "element") {
2433
+ node.props.forEach((p, i) => {
2434
+ if (p.type === 6 && p.name === "style" && p.value) {
2435
+ node.props[i] = {
2436
+ type: 7,
2437
+ name: `bind`,
2438
+ arg: compilerCore.createSimpleExpression(`style`, true, p.loc),
2439
+ exp: parseInlineCSS(p.value.content, p.loc),
2440
+ modifiers: [],
2441
+ loc: p.loc
2442
+ };
2443
+ }
2444
+ });
2445
+ }
2476
2446
  };
2477
2447
  const parseInlineCSS = (cssText, loc) => {
2478
- const normalized = shared.parseStringStyle(cssText);
2479
- return compilerCore.createSimpleExpression(JSON.stringify(normalized), false, loc, 3 /* ConstantTypes.CAN_STRINGIFY */);
2448
+ const normalized = shared.parseStringStyle(cssText);
2449
+ return compilerCore.createSimpleExpression(
2450
+ JSON.stringify(normalized),
2451
+ false,
2452
+ loc,
2453
+ 3
2454
+ );
2480
2455
  };
2481
2456
 
2482
2457
  function createDOMCompilerError(code, loc) {
2483
- return compilerCore.createCompilerError(code, loc, DOMErrorMessages );
2458
+ return compilerCore.createCompilerError(
2459
+ code,
2460
+ loc,
2461
+ DOMErrorMessages
2462
+ );
2484
2463
  }
2485
2464
  const DOMErrorMessages = {
2486
- [51 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */]: `v-html is missing expression.`,
2487
- [52 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */]: `v-html will override element children.`,
2488
- [53 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */]: `v-text is missing expression.`,
2489
- [54 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */]: `v-text will override element children.`,
2490
- [55 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */]: `v-model can only be used on <input>, <textarea> and <select> elements.`,
2491
- [56 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */]: `v-model argument is not supported on plain elements.`,
2492
- [57 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */]: `v-model cannot be used on file inputs since they are read-only. Use a v-on:change listener instead.`,
2493
- [58 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`,
2494
- [59 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */]: `v-show is missing expression.`,
2495
- [60 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */]: `<Transition> expects exactly one child element or component.`,
2496
- [61 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */]: `Tags with side effect (<script> and <style>) are ignored in client component templates.`
2465
+ [51]: `v-html is missing expression.`,
2466
+ [52]: `v-html will override element children.`,
2467
+ [53]: `v-text is missing expression.`,
2468
+ [54]: `v-text will override element children.`,
2469
+ [55]: `v-model can only be used on <input>, <textarea> and <select> elements.`,
2470
+ [56]: `v-model argument is not supported on plain elements.`,
2471
+ [57]: `v-model cannot be used on file inputs since they are read-only. Use a v-on:change listener instead.`,
2472
+ [58]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`,
2473
+ [59]: `v-show is missing expression.`,
2474
+ [60]: `<Transition> expects exactly one child element or component.`,
2475
+ [61]: `Tags with side effect (<script> and <style>) are ignored in client component templates.`
2497
2476
  };
2498
2477
 
2499
2478
  const transformVHtml = (dir, node, context) => {
2500
- const { exp, loc } = dir;
2501
- if (!exp) {
2502
- context.onError(createDOMCompilerError(51 /* DOMErrorCodes.X_V_HTML_NO_EXPRESSION */, loc));
2503
- }
2504
- if (node.children.length) {
2505
- context.onError(createDOMCompilerError(52 /* DOMErrorCodes.X_V_HTML_WITH_CHILDREN */, loc));
2506
- node.children.length = 0;
2507
- }
2508
- return {
2509
- props: [
2510
- compilerCore.createObjectProperty(compilerCore.createSimpleExpression(`innerHTML`, true, loc), exp || compilerCore.createSimpleExpression('', true))
2511
- ]
2512
- };
2479
+ const { exp, loc } = dir;
2480
+ if (!exp) {
2481
+ context.onError(
2482
+ createDOMCompilerError(51, loc)
2483
+ );
2484
+ }
2485
+ if (node.children.length) {
2486
+ context.onError(
2487
+ createDOMCompilerError(52, loc)
2488
+ );
2489
+ node.children.length = 0;
2490
+ }
2491
+ return {
2492
+ props: [
2493
+ compilerCore.createObjectProperty(
2494
+ compilerCore.createSimpleExpression(`innerHTML`, true, loc),
2495
+ exp || compilerCore.createSimpleExpression("", true)
2496
+ )
2497
+ ]
2498
+ };
2513
2499
  };
2514
2500
 
2515
2501
  const transformVText = (dir, node, context) => {
2516
- const { exp, loc } = dir;
2517
- if (!exp) {
2518
- context.onError(createDOMCompilerError(53 /* DOMErrorCodes.X_V_TEXT_NO_EXPRESSION */, loc));
2519
- }
2520
- if (node.children.length) {
2521
- context.onError(createDOMCompilerError(54 /* DOMErrorCodes.X_V_TEXT_WITH_CHILDREN */, loc));
2522
- node.children.length = 0;
2523
- }
2524
- return {
2525
- props: [
2526
- compilerCore.createObjectProperty(compilerCore.createSimpleExpression(`textContent`, true), exp
2527
- ? compilerCore.getConstantType(exp, context) > 0
2528
- ? exp
2529
- : compilerCore.createCallExpression(context.helperString(compilerCore.TO_DISPLAY_STRING), [exp], loc)
2530
- : compilerCore.createSimpleExpression('', true))
2531
- ]
2532
- };
2502
+ const { exp, loc } = dir;
2503
+ if (!exp) {
2504
+ context.onError(
2505
+ createDOMCompilerError(53, loc)
2506
+ );
2507
+ }
2508
+ if (node.children.length) {
2509
+ context.onError(
2510
+ createDOMCompilerError(54, loc)
2511
+ );
2512
+ node.children.length = 0;
2513
+ }
2514
+ return {
2515
+ props: [
2516
+ compilerCore.createObjectProperty(
2517
+ compilerCore.createSimpleExpression(`textContent`, true),
2518
+ exp ? compilerCore.getConstantType(exp, context) > 0 ? exp : compilerCore.createCallExpression(
2519
+ context.helperString(compilerCore.TO_DISPLAY_STRING),
2520
+ [exp],
2521
+ loc
2522
+ ) : compilerCore.createSimpleExpression("", true)
2523
+ )
2524
+ ]
2525
+ };
2533
2526
  };
2534
2527
 
2535
2528
  const transformModel = (dir, node, context) => {
2536
- const baseResult = compilerCore.transformModel(dir, node, context);
2537
- // base transform has errors OR component v-model (only need props)
2538
- if (!baseResult.props.length || node.tagType === 1 /* ElementTypes.COMPONENT */) {
2539
- return baseResult;
2540
- }
2541
- if (dir.arg) {
2542
- context.onError(createDOMCompilerError(56 /* DOMErrorCodes.X_V_MODEL_ARG_ON_ELEMENT */, dir.arg.loc));
2543
- }
2544
- function checkDuplicatedValue() {
2545
- const value = compilerCore.findProp(node, 'value');
2546
- if (value) {
2547
- context.onError(createDOMCompilerError(58 /* DOMErrorCodes.X_V_MODEL_UNNECESSARY_VALUE */, value.loc));
2548
- }
2529
+ const baseResult = compilerCore.transformModel(dir, node, context);
2530
+ if (!baseResult.props.length || node.tagType === 1) {
2531
+ return baseResult;
2532
+ }
2533
+ if (dir.arg) {
2534
+ context.onError(
2535
+ createDOMCompilerError(
2536
+ 56,
2537
+ dir.arg.loc
2538
+ )
2539
+ );
2540
+ }
2541
+ function checkDuplicatedValue() {
2542
+ const value = compilerCore.findProp(node, "value");
2543
+ if (value) {
2544
+ context.onError(
2545
+ createDOMCompilerError(
2546
+ 58,
2547
+ value.loc
2548
+ )
2549
+ );
2549
2550
  }
2550
- const { tag } = node;
2551
- const isCustomElement = context.isCustomElement(tag);
2552
- if (tag === 'input' ||
2553
- tag === 'textarea' ||
2554
- tag === 'select' ||
2555
- isCustomElement) {
2556
- let directiveToUse = V_MODEL_TEXT;
2557
- let isInvalidType = false;
2558
- if (tag === 'input' || isCustomElement) {
2559
- const type = compilerCore.findProp(node, `type`);
2560
- if (type) {
2561
- if (type.type === 7 /* NodeTypes.DIRECTIVE */) {
2562
- // :type="foo"
2563
- directiveToUse = V_MODEL_DYNAMIC;
2564
- }
2565
- else if (type.value) {
2566
- switch (type.value.content) {
2567
- case 'radio':
2568
- directiveToUse = V_MODEL_RADIO;
2569
- break;
2570
- case 'checkbox':
2571
- directiveToUse = V_MODEL_CHECKBOX;
2572
- break;
2573
- case 'file':
2574
- isInvalidType = true;
2575
- context.onError(createDOMCompilerError(57 /* DOMErrorCodes.X_V_MODEL_ON_FILE_INPUT_ELEMENT */, dir.loc));
2576
- break;
2577
- default:
2578
- // text type
2579
- checkDuplicatedValue();
2580
- break;
2581
- }
2582
- }
2583
- }
2584
- else if (compilerCore.hasDynamicKeyVBind(node)) {
2585
- // element has bindings with dynamic keys, which can possibly contain
2586
- // "type".
2587
- directiveToUse = V_MODEL_DYNAMIC;
2588
- }
2589
- else {
2590
- // text type
2591
- checkDuplicatedValue();
2592
- }
2593
- }
2594
- else if (tag === 'select') {
2595
- directiveToUse = V_MODEL_SELECT;
2596
- }
2597
- else {
2598
- // textarea
2599
- checkDuplicatedValue();
2600
- }
2601
- // inject runtime directive
2602
- // by returning the helper symbol via needRuntime
2603
- // the import will replaced a resolveDirective call.
2604
- if (!isInvalidType) {
2605
- baseResult.needRuntime = context.helper(directiveToUse);
2551
+ }
2552
+ const { tag } = node;
2553
+ const isCustomElement = context.isCustomElement(tag);
2554
+ if (tag === "input" || tag === "textarea" || tag === "select" || isCustomElement) {
2555
+ let directiveToUse = V_MODEL_TEXT;
2556
+ let isInvalidType = false;
2557
+ if (tag === "input" || isCustomElement) {
2558
+ const type = compilerCore.findProp(node, `type`);
2559
+ if (type) {
2560
+ if (type.type === 7) {
2561
+ directiveToUse = V_MODEL_DYNAMIC;
2562
+ } else if (type.value) {
2563
+ switch (type.value.content) {
2564
+ case "radio":
2565
+ directiveToUse = V_MODEL_RADIO;
2566
+ break;
2567
+ case "checkbox":
2568
+ directiveToUse = V_MODEL_CHECKBOX;
2569
+ break;
2570
+ case "file":
2571
+ isInvalidType = true;
2572
+ context.onError(
2573
+ createDOMCompilerError(
2574
+ 57,
2575
+ dir.loc
2576
+ )
2577
+ );
2578
+ break;
2579
+ default:
2580
+ checkDuplicatedValue();
2581
+ break;
2582
+ }
2606
2583
  }
2584
+ } else if (compilerCore.hasDynamicKeyVBind(node)) {
2585
+ directiveToUse = V_MODEL_DYNAMIC;
2586
+ } else {
2587
+ checkDuplicatedValue();
2588
+ }
2589
+ } else if (tag === "select") {
2590
+ directiveToUse = V_MODEL_SELECT;
2591
+ } else {
2592
+ checkDuplicatedValue();
2607
2593
  }
2608
- else {
2609
- context.onError(createDOMCompilerError(55 /* DOMErrorCodes.X_V_MODEL_ON_INVALID_ELEMENT */, dir.loc));
2594
+ if (!isInvalidType) {
2595
+ baseResult.needRuntime = context.helper(directiveToUse);
2610
2596
  }
2611
- // native vmodel doesn't need the `modelValue` props since they are also
2612
- // passed to the runtime as `binding.value`. removing it reduces code size.
2613
- baseResult.props = baseResult.props.filter(p => !(p.key.type === 4 /* NodeTypes.SIMPLE_EXPRESSION */ &&
2614
- p.key.content === 'modelValue'));
2615
- return baseResult;
2597
+ } else {
2598
+ context.onError(
2599
+ createDOMCompilerError(
2600
+ 55,
2601
+ dir.loc
2602
+ )
2603
+ );
2604
+ }
2605
+ baseResult.props = baseResult.props.filter(
2606
+ (p) => !(p.key.type === 4 && p.key.content === "modelValue")
2607
+ );
2608
+ return baseResult;
2616
2609
  };
2617
2610
 
2618
- const isEventOptionModifier = /*#__PURE__*/ shared.makeMap(`passive,once,capture`);
2619
- const isNonKeyModifier = /*#__PURE__*/ shared.makeMap(
2620
- // event propagation management
2621
- `stop,prevent,self,` +
2622
- // system modifiers + exact
2623
- `ctrl,shift,alt,meta,exact,` +
2624
- // mouse
2625
- `middle`);
2626
- // left & right could be mouse or key modifiers based on event type
2627
- const maybeKeyModifier = /*#__PURE__*/ shared.makeMap('left,right');
2628
- const isKeyboardEvent = /*#__PURE__*/ shared.makeMap(`onkeyup,onkeydown,onkeypress`, true);
2611
+ const isEventOptionModifier = /* @__PURE__ */ shared.makeMap(`passive,once,capture`);
2612
+ const isNonKeyModifier = /* @__PURE__ */ shared.makeMap(
2613
+ // event propagation management
2614
+ `stop,prevent,self,ctrl,shift,alt,meta,exact,middle`
2615
+ );
2616
+ const maybeKeyModifier = /* @__PURE__ */ shared.makeMap("left,right");
2617
+ const isKeyboardEvent = /* @__PURE__ */ shared.makeMap(
2618
+ `onkeyup,onkeydown,onkeypress`,
2619
+ true
2620
+ );
2629
2621
  const resolveModifiers = (key, modifiers, context, loc) => {
2630
- const keyModifiers = [];
2631
- const nonKeyModifiers = [];
2632
- const eventOptionModifiers = [];
2633
- for (let i = 0; i < modifiers.length; i++) {
2634
- const modifier = modifiers[i];
2635
- if (modifier === 'native' &&
2636
- compilerCore.checkCompatEnabled("COMPILER_V_ON_NATIVE" /* CompilerDeprecationTypes.COMPILER_V_ON_NATIVE */, context, loc)) {
2637
- eventOptionModifiers.push(modifier);
2622
+ const keyModifiers = [];
2623
+ const nonKeyModifiers = [];
2624
+ const eventOptionModifiers = [];
2625
+ for (let i = 0; i < modifiers.length; i++) {
2626
+ const modifier = modifiers[i];
2627
+ if (modifier === "native" && compilerCore.checkCompatEnabled(
2628
+ "COMPILER_V_ON_NATIVE",
2629
+ context,
2630
+ loc
2631
+ )) {
2632
+ eventOptionModifiers.push(modifier);
2633
+ } else if (isEventOptionModifier(modifier)) {
2634
+ eventOptionModifiers.push(modifier);
2635
+ } else {
2636
+ if (maybeKeyModifier(modifier)) {
2637
+ if (compilerCore.isStaticExp(key)) {
2638
+ if (isKeyboardEvent(key.content)) {
2639
+ keyModifiers.push(modifier);
2640
+ } else {
2641
+ nonKeyModifiers.push(modifier);
2642
+ }
2643
+ } else {
2644
+ keyModifiers.push(modifier);
2645
+ nonKeyModifiers.push(modifier);
2638
2646
  }
2639
- else if (isEventOptionModifier(modifier)) {
2640
- // eventOptionModifiers: modifiers for addEventListener() options,
2641
- // e.g. .passive & .capture
2642
- eventOptionModifiers.push(modifier);
2643
- }
2644
- else {
2645
- // runtimeModifiers: modifiers that needs runtime guards
2646
- if (maybeKeyModifier(modifier)) {
2647
- if (compilerCore.isStaticExp(key)) {
2648
- if (isKeyboardEvent(key.content)) {
2649
- keyModifiers.push(modifier);
2650
- }
2651
- else {
2652
- nonKeyModifiers.push(modifier);
2653
- }
2654
- }
2655
- else {
2656
- keyModifiers.push(modifier);
2657
- nonKeyModifiers.push(modifier);
2658
- }
2659
- }
2660
- else {
2661
- if (isNonKeyModifier(modifier)) {
2662
- nonKeyModifiers.push(modifier);
2663
- }
2664
- else {
2665
- keyModifiers.push(modifier);
2666
- }
2667
- }
2647
+ } else {
2648
+ if (isNonKeyModifier(modifier)) {
2649
+ nonKeyModifiers.push(modifier);
2650
+ } else {
2651
+ keyModifiers.push(modifier);
2668
2652
  }
2653
+ }
2669
2654
  }
2670
- return {
2671
- keyModifiers,
2672
- nonKeyModifiers,
2673
- eventOptionModifiers
2674
- };
2655
+ }
2656
+ return {
2657
+ keyModifiers,
2658
+ nonKeyModifiers,
2659
+ eventOptionModifiers
2660
+ };
2675
2661
  };
2676
2662
  const transformClick = (key, event) => {
2677
- const isStaticClick = compilerCore.isStaticExp(key) && key.content.toLowerCase() === 'onclick';
2678
- return isStaticClick
2679
- ? compilerCore.createSimpleExpression(event, true)
2680
- : key.type !== 4 /* NodeTypes.SIMPLE_EXPRESSION */
2681
- ? compilerCore.createCompoundExpression([
2682
- `(`,
2683
- key,
2684
- `) === "onClick" ? "${event}" : (`,
2685
- key,
2686
- `)`
2687
- ])
2688
- : key;
2663
+ const isStaticClick = compilerCore.isStaticExp(key) && key.content.toLowerCase() === "onclick";
2664
+ return isStaticClick ? compilerCore.createSimpleExpression(event, true) : key.type !== 4 ? compilerCore.createCompoundExpression([
2665
+ `(`,
2666
+ key,
2667
+ `) === "onClick" ? "${event}" : (`,
2668
+ key,
2669
+ `)`
2670
+ ]) : key;
2689
2671
  };
2690
2672
  const transformOn = (dir, node, context) => {
2691
- return compilerCore.transformOn(dir, node, context, baseResult => {
2692
- const { modifiers } = dir;
2693
- if (!modifiers.length)
2694
- return baseResult;
2695
- let { key, value: handlerExp } = baseResult.props[0];
2696
- const { keyModifiers, nonKeyModifiers, eventOptionModifiers } = resolveModifiers(key, modifiers, context, dir.loc);
2697
- // normalize click.right and click.middle since they don't actually fire
2698
- if (nonKeyModifiers.includes('right')) {
2699
- key = transformClick(key, `onContextmenu`);
2700
- }
2701
- if (nonKeyModifiers.includes('middle')) {
2702
- key = transformClick(key, `onMouseup`);
2703
- }
2704
- if (nonKeyModifiers.length) {
2705
- handlerExp = compilerCore.createCallExpression(context.helper(V_ON_WITH_MODIFIERS), [
2706
- handlerExp,
2707
- JSON.stringify(nonKeyModifiers)
2708
- ]);
2709
- }
2710
- if (keyModifiers.length &&
2711
- // if event name is dynamic, always wrap with keys guard
2712
- (!compilerCore.isStaticExp(key) || isKeyboardEvent(key.content))) {
2713
- handlerExp = compilerCore.createCallExpression(context.helper(V_ON_WITH_KEYS), [
2714
- handlerExp,
2715
- JSON.stringify(keyModifiers)
2716
- ]);
2717
- }
2718
- if (eventOptionModifiers.length) {
2719
- const modifierPostfix = eventOptionModifiers.map(shared.capitalize).join('');
2720
- key = compilerCore.isStaticExp(key)
2721
- ? compilerCore.createSimpleExpression(`${key.content}${modifierPostfix}`, true)
2722
- : compilerCore.createCompoundExpression([`(`, key, `) + "${modifierPostfix}"`]);
2723
- }
2724
- return {
2725
- props: [compilerCore.createObjectProperty(key, handlerExp)]
2726
- };
2727
- });
2728
- };
2729
-
2730
- const transformShow = (dir, node, context) => {
2731
- const { exp, loc } = dir;
2732
- if (!exp) {
2733
- context.onError(createDOMCompilerError(59 /* DOMErrorCodes.X_V_SHOW_NO_EXPRESSION */, loc));
2673
+ return compilerCore.transformOn(dir, node, context, (baseResult) => {
2674
+ const { modifiers } = dir;
2675
+ if (!modifiers.length)
2676
+ return baseResult;
2677
+ let { key, value: handlerExp } = baseResult.props[0];
2678
+ const { keyModifiers, nonKeyModifiers, eventOptionModifiers } = resolveModifiers(key, modifiers, context, dir.loc);
2679
+ if (nonKeyModifiers.includes("right")) {
2680
+ key = transformClick(key, `onContextmenu`);
2681
+ }
2682
+ if (nonKeyModifiers.includes("middle")) {
2683
+ key = transformClick(key, `onMouseup`);
2684
+ }
2685
+ if (nonKeyModifiers.length) {
2686
+ handlerExp = compilerCore.createCallExpression(context.helper(V_ON_WITH_MODIFIERS), [
2687
+ handlerExp,
2688
+ JSON.stringify(nonKeyModifiers)
2689
+ ]);
2690
+ }
2691
+ if (keyModifiers.length && // if event name is dynamic, always wrap with keys guard
2692
+ (!compilerCore.isStaticExp(key) || isKeyboardEvent(key.content))) {
2693
+ handlerExp = compilerCore.createCallExpression(context.helper(V_ON_WITH_KEYS), [
2694
+ handlerExp,
2695
+ JSON.stringify(keyModifiers)
2696
+ ]);
2697
+ }
2698
+ if (eventOptionModifiers.length) {
2699
+ const modifierPostfix = eventOptionModifiers.map(shared.capitalize).join("");
2700
+ key = compilerCore.isStaticExp(key) ? compilerCore.createSimpleExpression(`${key.content}${modifierPostfix}`, true) : compilerCore.createCompoundExpression([`(`, key, `) + "${modifierPostfix}"`]);
2734
2701
  }
2735
2702
  return {
2736
- props: [],
2737
- needRuntime: context.helper(V_SHOW)
2703
+ props: [compilerCore.createObjectProperty(key, handlerExp)]
2738
2704
  };
2705
+ });
2706
+ };
2707
+
2708
+ const transformShow = (dir, node, context) => {
2709
+ const { exp, loc } = dir;
2710
+ if (!exp) {
2711
+ context.onError(
2712
+ createDOMCompilerError(59, loc)
2713
+ );
2714
+ }
2715
+ return {
2716
+ props: [],
2717
+ needRuntime: context.helper(V_SHOW)
2718
+ };
2739
2719
  };
2740
2720
 
2741
2721
  const transformTransition = (node, context) => {
2742
- if (node.type === 1 /* NodeTypes.ELEMENT */ &&
2743
- node.tagType === 1 /* ElementTypes.COMPONENT */) {
2744
- const component = context.isBuiltInComponent(node.tag);
2745
- if (component === TRANSITION) {
2746
- return () => {
2747
- if (!node.children.length) {
2748
- return;
2749
- }
2750
- // warn multiple transition children
2751
- if (hasMultipleChildren(node)) {
2752
- context.onError(createDOMCompilerError(60 /* DOMErrorCodes.X_TRANSITION_INVALID_CHILDREN */, {
2753
- start: node.children[0].loc.start,
2754
- end: node.children[node.children.length - 1].loc.end,
2755
- source: ''
2756
- }));
2757
- }
2758
- // check if it's s single child w/ v-show
2759
- // if yes, inject "persisted: true" to the transition props
2760
- const child = node.children[0];
2761
- if (child.type === 1 /* NodeTypes.ELEMENT */) {
2762
- for (const p of child.props) {
2763
- if (p.type === 7 /* NodeTypes.DIRECTIVE */ && p.name === 'show') {
2764
- node.props.push({
2765
- type: 6 /* NodeTypes.ATTRIBUTE */,
2766
- name: 'persisted',
2767
- value: undefined,
2768
- loc: node.loc
2769
- });
2770
- }
2771
- }
2772
- }
2773
- };
2722
+ if (node.type === "element" && node.tagType === 1) {
2723
+ const component = context.isBuiltInComponent(node.tag);
2724
+ if (component === TRANSITION) {
2725
+ return () => {
2726
+ if (!node.children.length) {
2727
+ return;
2728
+ }
2729
+ if (hasMultipleChildren(node)) {
2730
+ context.onError(
2731
+ createDOMCompilerError(
2732
+ 60,
2733
+ {
2734
+ start: node.children[0].loc.start,
2735
+ end: node.children[node.children.length - 1].loc.end,
2736
+ source: ""
2737
+ }
2738
+ )
2739
+ );
2740
+ }
2741
+ const child = node.children[0];
2742
+ if (child.type === "element") {
2743
+ for (const p of child.props) {
2744
+ if (p.type === 7 && p.name === "show") {
2745
+ node.props.push({
2746
+ type: 6,
2747
+ name: "persisted",
2748
+ value: void 0,
2749
+ loc: node.loc
2750
+ });
2751
+ }
2752
+ }
2774
2753
  }
2754
+ };
2775
2755
  }
2756
+ }
2776
2757
  };
2777
2758
  function hasMultipleChildren(node) {
2778
- // #1352 filter out potential comment nodes.
2779
- const children = (node.children = node.children.filter(c => c.type !== 3 /* NodeTypes.COMMENT */ &&
2780
- !(c.type === 2 /* NodeTypes.TEXT */ && !c.content.trim())));
2781
- const child = children[0];
2782
- return (children.length !== 1 ||
2783
- child.type === 11 /* NodeTypes.FOR */ ||
2784
- (child.type === 9 /* NodeTypes.IF */ && child.branches.some(hasMultipleChildren)));
2759
+ const children = node.children = node.children.filter(
2760
+ (c) => c.type !== "comment" && !(c.type === "text" && !c.content.trim())
2761
+ );
2762
+ const child = children[0];
2763
+ return children.length !== 1 || child.type === 11 || child.type === 9 && child.branches.some(hasMultipleChildren);
2785
2764
  }
2786
2765
 
2787
- /**
2788
- * This module is Node-only.
2789
- */
2790
- /**
2791
- * Regex for replacing placeholders for embedded constant variables
2792
- * (e.g. import URL string constants generated by compiler-sfc)
2793
- */
2794
2766
  const expReplaceRE = /__VUE_EXP_START__(.*?)__VUE_EXP_END__/g;
2795
- /**
2796
- * Turn eligible hoisted static trees into stringified static nodes, e.g.
2797
- *
2798
- * ```js
2799
- * const _hoisted_1 = createStaticVNode(`<div class="foo">bar</div>`)
2800
- * ```
2801
- *
2802
- * A single static vnode can contain stringified content for **multiple**
2803
- * consecutive nodes (element and plain text), called a "chunk".
2804
- * `@vue/runtime-dom` will create the content via innerHTML in a hidden
2805
- * container element and insert all the nodes in place. The call must also
2806
- * provide the number of nodes contained in the chunk so that during hydration
2807
- * we can know how many nodes the static vnode should adopt.
2808
- *
2809
- * The optimization scans a children list that contains hoisted nodes, and
2810
- * tries to find the largest chunk of consecutive hoisted nodes before running
2811
- * into a non-hoisted node or the end of the list. A chunk is then converted
2812
- * into a single static vnode and replaces the hoisted expression of the first
2813
- * node in the chunk. Other nodes in the chunk are considered "merged" and
2814
- * therefore removed from both the hoist list and the children array.
2815
- *
2816
- * This optimization is only performed in Node.js.
2817
- */
2818
2767
  const stringifyStatic = (children, context, parent) => {
2819
- // bail stringification for slot content
2820
- if (context.scopes.vSlot > 0) {
2821
- return;
2822
- }
2823
- let nc = 0; // current node count
2824
- let ec = 0; // current element with binding count
2825
- const currentChunk = [];
2826
- const stringifyCurrentChunk = (currentIndex) => {
2827
- if (nc >= 20 /* StringifyThresholds.NODE_COUNT */ ||
2828
- ec >= 5 /* StringifyThresholds.ELEMENT_WITH_BINDING_COUNT */) {
2829
- // combine all currently eligible nodes into a single static vnode call
2830
- const staticCall = compilerCore.createCallExpression(context.helper(compilerCore.CREATE_STATIC), [
2831
- JSON.stringify(currentChunk.map(node => stringifyNode(node, context)).join('')).replace(expReplaceRE, `" + $1 + "`),
2832
- // the 2nd argument indicates the number of DOM nodes this static vnode
2833
- // will insert / hydrate
2834
- String(currentChunk.length)
2835
- ]);
2836
- // replace the first node's hoisted expression with the static vnode call
2837
- replaceHoist(currentChunk[0], staticCall, context);
2838
- if (currentChunk.length > 1) {
2839
- for (let i = 1; i < currentChunk.length; i++) {
2840
- // for the merged nodes, set their hoisted expression to null
2841
- replaceHoist(currentChunk[i], null, context);
2842
- }
2843
- // also remove merged nodes from children
2844
- const deleteCount = currentChunk.length - 1;
2845
- children.splice(currentIndex - currentChunk.length + 1, deleteCount);
2846
- return deleteCount;
2847
- }
2768
+ if (context.scopes.vSlot > 0) {
2769
+ return;
2770
+ }
2771
+ let nc = 0;
2772
+ let ec = 0;
2773
+ const currentChunk = [];
2774
+ const stringifyCurrentChunk = (currentIndex) => {
2775
+ if (nc >= 20 || ec >= 5) {
2776
+ const staticCall = compilerCore.createCallExpression(context.helper(compilerCore.CREATE_STATIC), [
2777
+ JSON.stringify(
2778
+ currentChunk.map((node) => stringifyNode(node, context)).join("")
2779
+ ).replace(expReplaceRE, `" + $1 + "`),
2780
+ // the 2nd argument indicates the number of DOM nodes this static vnode
2781
+ // will insert / hydrate
2782
+ String(currentChunk.length)
2783
+ ]);
2784
+ replaceHoist(currentChunk[0], staticCall, context);
2785
+ if (currentChunk.length > 1) {
2786
+ for (let i2 = 1; i2 < currentChunk.length; i2++) {
2787
+ replaceHoist(currentChunk[i2], null, context);
2848
2788
  }
2849
- return 0;
2850
- };
2851
- let i = 0;
2852
- for (; i < children.length; i++) {
2853
- const child = children[i];
2854
- const hoisted = getHoistedNode(child);
2855
- if (hoisted) {
2856
- // presence of hoisted means child must be a stringifiable node
2857
- const node = child;
2858
- const result = analyzeNode(node);
2859
- if (result) {
2860
- // node is stringifiable, record state
2861
- nc += result[0];
2862
- ec += result[1];
2863
- currentChunk.push(node);
2864
- continue;
2865
- }
2866
- }
2867
- // we only reach here if we ran into a node that is not stringifiable
2868
- // check if currently analyzed nodes meet criteria for stringification.
2869
- // adjust iteration index
2870
- i -= stringifyCurrentChunk(i);
2871
- // reset state
2872
- nc = 0;
2873
- ec = 0;
2874
- currentChunk.length = 0;
2789
+ const deleteCount = currentChunk.length - 1;
2790
+ children.splice(currentIndex - currentChunk.length + 1, deleteCount);
2791
+ return deleteCount;
2792
+ }
2875
2793
  }
2876
- // in case the last node was also stringifiable
2877
- stringifyCurrentChunk(i);
2794
+ return 0;
2795
+ };
2796
+ let i = 0;
2797
+ for (; i < children.length; i++) {
2798
+ const child = children[i];
2799
+ const hoisted = getHoistedNode(child);
2800
+ if (hoisted) {
2801
+ const node = child;
2802
+ const result = analyzeNode(node);
2803
+ if (result) {
2804
+ nc += result[0];
2805
+ ec += result[1];
2806
+ currentChunk.push(node);
2807
+ continue;
2808
+ }
2809
+ }
2810
+ i -= stringifyCurrentChunk(i);
2811
+ nc = 0;
2812
+ ec = 0;
2813
+ currentChunk.length = 0;
2814
+ }
2815
+ stringifyCurrentChunk(i);
2878
2816
  };
2879
- const getHoistedNode = (node) => ((node.type === 1 /* NodeTypes.ELEMENT */ && node.tagType === 0 /* ElementTypes.ELEMENT */) ||
2880
- node.type == 12 /* NodeTypes.TEXT_CALL */) &&
2881
- node.codegenNode &&
2882
- node.codegenNode.type === 4 /* NodeTypes.SIMPLE_EXPRESSION */ &&
2883
- node.codegenNode.hoisted;
2817
+ const getHoistedNode = (node) => (node.type === "element" && node.tagType === 0 || node.type == 12) && node.codegenNode && node.codegenNode.type === 4 && node.codegenNode.hoisted;
2884
2818
  const dataAriaRE = /^(data|aria)-/;
2885
2819
  const isStringifiableAttr = (name, ns) => {
2886
- return ((ns === 0 /* DOMNamespaces.HTML */
2887
- ? shared.isKnownHtmlAttr(name)
2888
- : ns === 1 /* DOMNamespaces.SVG */
2889
- ? shared.isKnownSvgAttr(name)
2890
- : false) || dataAriaRE.test(name));
2820
+ return (ns === 0 ? shared.isKnownHtmlAttr(name) : ns === 1 ? shared.isKnownSvgAttr(name) : false) || dataAriaRE.test(name);
2891
2821
  };
2892
2822
  const replaceHoist = (node, replacement, context) => {
2893
- const hoistToReplace = node.codegenNode.hoisted;
2894
- context.hoists[context.hoists.indexOf(hoistToReplace)] = replacement;
2823
+ const hoistToReplace = node.codegenNode.hoisted;
2824
+ context.hoists[context.hoists.indexOf(hoistToReplace)] = replacement;
2895
2825
  };
2896
- const isNonStringifiable = /*#__PURE__*/ shared.makeMap(`caption,thead,tr,th,tbody,td,tfoot,colgroup,col`);
2897
- /**
2898
- * for a hoisted node, analyze it and return:
2899
- * - false: bailed (contains non-stringifiable props or runtime constant)
2900
- * - [nc, ec] where
2901
- * - nc is the number of nodes inside
2902
- * - ec is the number of element with bindings inside
2903
- */
2826
+ const isNonStringifiable = /* @__PURE__ */ shared.makeMap(
2827
+ `caption,thead,tr,th,tbody,td,tfoot,colgroup,col`
2828
+ );
2904
2829
  function analyzeNode(node) {
2905
- if (node.type === 1 /* NodeTypes.ELEMENT */ && isNonStringifiable(node.tag)) {
2906
- return false;
2907
- }
2908
- if (node.type === 12 /* NodeTypes.TEXT_CALL */) {
2909
- return [1, 0];
2830
+ if (node.type === "element" && isNonStringifiable(node.tag)) {
2831
+ return false;
2832
+ }
2833
+ if (node.type === 12) {
2834
+ return [1, 0];
2835
+ }
2836
+ let nc = 1;
2837
+ let ec = node.props.length > 0 ? 1 : 0;
2838
+ let bailed = false;
2839
+ const bail = () => {
2840
+ bailed = true;
2841
+ return false;
2842
+ };
2843
+ function walk(node2) {
2844
+ for (let i = 0; i < node2.props.length; i++) {
2845
+ const p = node2.props[i];
2846
+ if (p.type === 6 && !isStringifiableAttr(p.name, node2.ns)) {
2847
+ return bail();
2848
+ }
2849
+ if (p.type === 7 && p.name === "bind") {
2850
+ if (p.arg && (p.arg.type === 8 || p.arg.isStatic && !isStringifiableAttr(p.arg.content, node2.ns))) {
2851
+ return bail();
2852
+ }
2853
+ if (p.exp && (p.exp.type === 8 || p.exp.constType < 3)) {
2854
+ return bail();
2855
+ }
2856
+ }
2910
2857
  }
2911
- let nc = 1; // node count
2912
- let ec = node.props.length > 0 ? 1 : 0; // element w/ binding count
2913
- let bailed = false;
2914
- const bail = () => {
2915
- bailed = true;
2916
- return false;
2917
- };
2918
- // TODO: check for cases where using innerHTML will result in different
2919
- // output compared to imperative node insertions.
2920
- // probably only need to check for most common case
2921
- // i.e. non-phrasing-content tags inside `<p>`
2922
- function walk(node) {
2923
- for (let i = 0; i < node.props.length; i++) {
2924
- const p = node.props[i];
2925
- // bail on non-attr bindings
2926
- if (p.type === 6 /* NodeTypes.ATTRIBUTE */ &&
2927
- !isStringifiableAttr(p.name, node.ns)) {
2928
- return bail();
2929
- }
2930
- if (p.type === 7 /* NodeTypes.DIRECTIVE */ && p.name === 'bind') {
2931
- // bail on non-attr bindings
2932
- if (p.arg &&
2933
- (p.arg.type === 8 /* NodeTypes.COMPOUND_EXPRESSION */ ||
2934
- (p.arg.isStatic && !isStringifiableAttr(p.arg.content, node.ns)))) {
2935
- return bail();
2936
- }
2937
- if (p.exp &&
2938
- (p.exp.type === 8 /* NodeTypes.COMPOUND_EXPRESSION */ ||
2939
- p.exp.constType < 3 /* ConstantTypes.CAN_STRINGIFY */)) {
2940
- return bail();
2941
- }
2942
- }
2858
+ for (let i = 0; i < node2.children.length; i++) {
2859
+ nc++;
2860
+ const child = node2.children[i];
2861
+ if (child.type === "element") {
2862
+ if (child.props.length > 0) {
2863
+ ec++;
2943
2864
  }
2944
- for (let i = 0; i < node.children.length; i++) {
2945
- nc++;
2946
- const child = node.children[i];
2947
- if (child.type === 1 /* NodeTypes.ELEMENT */) {
2948
- if (child.props.length > 0) {
2949
- ec++;
2950
- }
2951
- walk(child);
2952
- if (bailed) {
2953
- return false;
2954
- }
2955
- }
2865
+ walk(child);
2866
+ if (bailed) {
2867
+ return false;
2956
2868
  }
2957
- return true;
2869
+ }
2958
2870
  }
2959
- return walk(node) ? [nc, ec] : false;
2871
+ return true;
2872
+ }
2873
+ return walk(node) ? [nc, ec] : false;
2960
2874
  }
2961
2875
  function stringifyNode(node, context) {
2962
- if (shared.isString(node)) {
2963
- return node;
2964
- }
2965
- if (shared.isSymbol(node)) {
2966
- return ``;
2967
- }
2968
- switch (node.type) {
2969
- case 1 /* NodeTypes.ELEMENT */:
2970
- return stringifyElement(node, context);
2971
- case 2 /* NodeTypes.TEXT */:
2972
- return shared.escapeHtml(node.content);
2973
- case 3 /* NodeTypes.COMMENT */:
2974
- return `<!--${shared.escapeHtml(node.content)}-->`;
2975
- case 5 /* NodeTypes.INTERPOLATION */:
2976
- return shared.escapeHtml(shared.toDisplayString(evaluateConstant(node.content)));
2977
- case 8 /* NodeTypes.COMPOUND_EXPRESSION */:
2978
- return shared.escapeHtml(evaluateConstant(node));
2979
- case 12 /* NodeTypes.TEXT_CALL */:
2980
- return stringifyNode(node.content, context);
2981
- default:
2982
- // static trees will not contain if/for nodes
2983
- return '';
2984
- }
2876
+ if (shared.isString(node)) {
2877
+ return node;
2878
+ }
2879
+ if (shared.isSymbol(node)) {
2880
+ return ``;
2881
+ }
2882
+ switch (node.type) {
2883
+ case "element":
2884
+ return stringifyElement(node, context);
2885
+ case "text":
2886
+ return shared.escapeHtml(node.content);
2887
+ case "comment":
2888
+ return `<!--${shared.escapeHtml(node.content)}-->`;
2889
+ case 5:
2890
+ return shared.escapeHtml(shared.toDisplayString(evaluateConstant(node.content)));
2891
+ case 8:
2892
+ return shared.escapeHtml(evaluateConstant(node));
2893
+ case 12:
2894
+ return stringifyNode(node.content, context);
2895
+ default:
2896
+ return "";
2897
+ }
2985
2898
  }
2986
2899
  function stringifyElement(node, context) {
2987
- let res = `<${node.tag}`;
2988
- let innerHTML = '';
2989
- for (let i = 0; i < node.props.length; i++) {
2990
- const p = node.props[i];
2991
- if (p.type === 6 /* NodeTypes.ATTRIBUTE */) {
2992
- res += ` ${p.name}`;
2993
- if (p.value) {
2994
- res += `="${shared.escapeHtml(p.value.content)}"`;
2995
- }
2900
+ let res = `<${node.tag}`;
2901
+ let innerHTML = "";
2902
+ for (let i = 0; i < node.props.length; i++) {
2903
+ const p = node.props[i];
2904
+ if (p.type === 6) {
2905
+ res += ` ${p.name}`;
2906
+ if (p.value) {
2907
+ res += `="${shared.escapeHtml(p.value.content)}"`;
2908
+ }
2909
+ } else if (p.type === 7) {
2910
+ if (p.name === "bind") {
2911
+ const exp = p.exp;
2912
+ if (exp.content[0] === "_") {
2913
+ res += ` ${p.arg.content}="__VUE_EXP_START__${exp.content}__VUE_EXP_END__"`;
2914
+ continue;
2996
2915
  }
2997
- else if (p.type === 7 /* NodeTypes.DIRECTIVE */) {
2998
- if (p.name === 'bind') {
2999
- const exp = p.exp;
3000
- if (exp.content[0] === '_') {
3001
- // internally generated string constant references
3002
- // e.g. imported URL strings via compiler-sfc transformAssetUrl plugin
3003
- res += ` ${p.arg.content}="__VUE_EXP_START__${exp.content}__VUE_EXP_END__"`;
3004
- continue;
3005
- }
3006
- // #6568
3007
- if (shared.isBooleanAttr(p.arg.content) &&
3008
- exp.content === 'false') {
3009
- continue;
3010
- }
3011
- // constant v-bind, e.g. :foo="1"
3012
- let evaluated = evaluateConstant(exp);
3013
- if (evaluated != null) {
3014
- const arg = p.arg && p.arg.content;
3015
- if (arg === 'class') {
3016
- evaluated = shared.normalizeClass(evaluated);
3017
- }
3018
- else if (arg === 'style') {
3019
- evaluated = shared.stringifyStyle(shared.normalizeStyle(evaluated));
3020
- }
3021
- res += ` ${p.arg.content}="${shared.escapeHtml(evaluated)}"`;
3022
- }
3023
- }
3024
- else if (p.name === 'html') {
3025
- // #5439 v-html with constant value
3026
- // not sure why would anyone do this but it can happen
3027
- innerHTML = evaluateConstant(p.exp);
3028
- }
3029
- else if (p.name === 'text') {
3030
- innerHTML = shared.escapeHtml(shared.toDisplayString(evaluateConstant(p.exp)));
3031
- }
2916
+ if (shared.isBooleanAttr(p.arg.content) && exp.content === "false") {
2917
+ continue;
3032
2918
  }
3033
- }
3034
- if (context.scopeId) {
3035
- res += ` ${context.scopeId}`;
3036
- }
3037
- res += `>`;
3038
- if (innerHTML) {
3039
- res += innerHTML;
3040
- }
3041
- else {
3042
- for (let i = 0; i < node.children.length; i++) {
3043
- res += stringifyNode(node.children[i], context);
2919
+ let evaluated = evaluateConstant(exp);
2920
+ if (evaluated != null) {
2921
+ const arg = p.arg && p.arg.content;
2922
+ if (arg === "class") {
2923
+ evaluated = shared.normalizeClass(evaluated);
2924
+ } else if (arg === "style") {
2925
+ evaluated = shared.stringifyStyle(shared.normalizeStyle(evaluated));
2926
+ }
2927
+ res += ` ${p.arg.content}="${shared.escapeHtml(
2928
+ evaluated
2929
+ )}"`;
3044
2930
  }
2931
+ } else if (p.name === "html") {
2932
+ innerHTML = evaluateConstant(p.exp);
2933
+ } else if (p.name === "text") {
2934
+ innerHTML = shared.escapeHtml(
2935
+ shared.toDisplayString(evaluateConstant(p.exp))
2936
+ );
2937
+ }
3045
2938
  }
3046
- if (!shared.isVoidTag(node.tag)) {
3047
- res += `</${node.tag}>`;
2939
+ }
2940
+ if (context.scopeId) {
2941
+ res += ` ${context.scopeId}`;
2942
+ }
2943
+ res += `>`;
2944
+ if (innerHTML) {
2945
+ res += innerHTML;
2946
+ } else {
2947
+ for (let i = 0; i < node.children.length; i++) {
2948
+ res += stringifyNode(node.children[i], context);
3048
2949
  }
3049
- return res;
2950
+ }
2951
+ if (!shared.isVoidTag(node.tag)) {
2952
+ res += `</${node.tag}>`;
2953
+ }
2954
+ return res;
3050
2955
  }
3051
- // __UNSAFE__
3052
- // Reason: eval.
3053
- // It's technically safe to eval because only constant expressions are possible
3054
- // here, e.g. `{{ 1 }}` or `{{ 'foo' }}`
3055
- // in addition, constant exps bail on presence of parens so you can't even
3056
- // run JSFuck in here. But we mark it unsafe for security review purposes.
3057
- // (see compiler-core/src/transforms/transformExpression)
3058
2956
  function evaluateConstant(exp) {
3059
- if (exp.type === 4 /* NodeTypes.SIMPLE_EXPRESSION */) {
3060
- return new Function(`return ${exp.content}`)();
3061
- }
3062
- else {
3063
- // compound
3064
- let res = ``;
3065
- exp.children.forEach(c => {
3066
- if (shared.isString(c) || shared.isSymbol(c)) {
3067
- return;
3068
- }
3069
- if (c.type === 2 /* NodeTypes.TEXT */) {
3070
- res += c.content;
3071
- }
3072
- else if (c.type === 5 /* NodeTypes.INTERPOLATION */) {
3073
- res += shared.toDisplayString(evaluateConstant(c.content));
3074
- }
3075
- else {
3076
- res += evaluateConstant(c);
3077
- }
3078
- });
3079
- return res;
3080
- }
2957
+ if (exp.type === 4) {
2958
+ return new Function(`return ${exp.content}`)();
2959
+ } else {
2960
+ let res = ``;
2961
+ exp.children.forEach((c) => {
2962
+ if (shared.isString(c) || shared.isSymbol(c)) {
2963
+ return;
2964
+ }
2965
+ if (c.type === "text") {
2966
+ res += c.content;
2967
+ } else if (c.type === 5) {
2968
+ res += shared.toDisplayString(evaluateConstant(c.content));
2969
+ } else {
2970
+ res += evaluateConstant(c);
2971
+ }
2972
+ });
2973
+ return res;
2974
+ }
3081
2975
  }
3082
2976
 
3083
2977
  const ignoreSideEffectTags = (node, context) => {
3084
- if (node.type === 1 /* NodeTypes.ELEMENT */ &&
3085
- node.tagType === 0 /* ElementTypes.ELEMENT */ &&
3086
- (node.tag === 'script' || node.tag === 'style')) {
3087
- context.onError(createDOMCompilerError(61 /* DOMErrorCodes.X_IGNORED_SIDE_EFFECT_TAG */, node.loc));
3088
- context.removeNode();
3089
- }
2978
+ if (node.type === "element" && node.tagType === 0 && (node.tag === "script" || node.tag === "style")) {
2979
+ context.onError(
2980
+ createDOMCompilerError(61, node.loc)
2981
+ );
2982
+ context.removeNode();
2983
+ }
3090
2984
  };
3091
2985
 
3092
2986
  const DOMNodeTransforms = [
3093
- transformStyle,
3094
- ...([transformTransition] )
2987
+ transformStyle,
2988
+ ...[transformTransition]
3095
2989
  ];
3096
2990
  const DOMDirectiveTransforms = {
3097
- cloak: compilerCore.noopDirectiveTransform,
3098
- html: transformVHtml,
3099
- text: transformVText,
3100
- model: transformModel,
3101
- on: transformOn,
3102
- show: transformShow
2991
+ cloak: compilerCore.noopDirectiveTransform,
2992
+ html: transformVHtml,
2993
+ text: transformVText,
2994
+ model: transformModel,
2995
+ // override compiler-core
2996
+ on: transformOn,
2997
+ // override compiler-core
2998
+ show: transformShow
3103
2999
  };
3104
3000
  function compile(template, options = {}) {
3105
- return compilerCore.baseCompile(template, shared.extend({}, parserOptions, options, {
3106
- nodeTransforms: [
3107
- // ignore <script> and <tag>
3108
- // this is not put inside DOMNodeTransforms because that list is used
3109
- // by compiler-ssr to generate vnode fallback branches
3110
- ignoreSideEffectTags,
3111
- ...DOMNodeTransforms,
3112
- ...(options.nodeTransforms || [])
3113
- ],
3114
- directiveTransforms: shared.extend({}, DOMDirectiveTransforms, options.directiveTransforms || {}),
3115
- transformHoist: stringifyStatic
3116
- }));
3001
+ return compilerCore.baseCompile(
3002
+ template,
3003
+ shared.extend({}, parserOptions, options, {
3004
+ nodeTransforms: [
3005
+ // ignore <script> and <tag>
3006
+ // this is not put inside DOMNodeTransforms because that list is used
3007
+ // by compiler-ssr to generate vnode fallback branches
3008
+ ignoreSideEffectTags,
3009
+ ...DOMNodeTransforms,
3010
+ ...options.nodeTransforms || []
3011
+ ],
3012
+ directiveTransforms: shared.extend(
3013
+ {},
3014
+ DOMDirectiveTransforms,
3015
+ options.directiveTransforms || {}
3016
+ ),
3017
+ transformHoist: stringifyStatic
3018
+ })
3019
+ );
3117
3020
  }
3118
3021
  function parse(template, options = {}) {
3119
- return compilerCore.baseParse(template, shared.extend({}, parserOptions, options));
3022
+ return compilerCore.baseParse(template, shared.extend({}, parserOptions, options));
3120
3023
  }
3121
3024
 
3122
3025
  exports.DOMDirectiveTransforms = DOMDirectiveTransforms;