UNPKG

632 kBJavaScriptView Raw
1var Vue = (function (exports) {
2 'use strict';
3
4 /**
5 * Make a map and return a function for checking if a key
6 * is in that map.
7 * IMPORTANT: all calls of this function must be prefixed with
8 * \/\*#\_\_PURE\_\_\*\/
9 * So that rollup can tree-shake them if necessary.
10 */
11 function makeMap(str, expectsLowerCase) {
12 const map = Object.create(null);
13 const list = str.split(',');
14 for (let i = 0; i < list.length; i++) {
15 map[list[i]] = true;
16 }
17 return expectsLowerCase ? val => !!map[val.toLowerCase()] : val => !!map[val];
18 }
19
20 /**
21 * dev only flag -> name mapping
22 */
23 const PatchFlagNames = {
24 [1 /* TEXT */]: `TEXT`,
25 [2 /* CLASS */]: `CLASS`,
26 [4 /* STYLE */]: `STYLE`,
27 [8 /* PROPS */]: `PROPS`,
28 [16 /* FULL_PROPS */]: `FULL_PROPS`,
29 [32 /* HYDRATE_EVENTS */]: `HYDRATE_EVENTS`,
30 [64 /* STABLE_FRAGMENT */]: `STABLE_FRAGMENT`,
31 [128 /* KEYED_FRAGMENT */]: `KEYED_FRAGMENT`,
32 [256 /* UNKEYED_FRAGMENT */]: `UNKEYED_FRAGMENT`,
33 [512 /* NEED_PATCH */]: `NEED_PATCH`,
34 [1024 /* DYNAMIC_SLOTS */]: `DYNAMIC_SLOTS`,
35 [2048 /* DEV_ROOT_FRAGMENT */]: `DEV_ROOT_FRAGMENT`,
36 [-1 /* HOISTED */]: `HOISTED`,
37 [-2 /* BAIL */]: `BAIL`
38 };
39
40 /**
41 * Dev only
42 */
43 const slotFlagsText = {
44 [1 /* STABLE */]: 'STABLE',
45 [2 /* DYNAMIC */]: 'DYNAMIC',
46 [3 /* FORWARDED */]: 'FORWARDED'
47 };
48
49 const GLOBALS_WHITE_LISTED = 'Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,' +
50 'decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,' +
51 'Object,Boolean,String,RegExp,Map,Set,JSON,Intl,BigInt';
52 const isGloballyWhitelisted = /*#__PURE__*/ makeMap(GLOBALS_WHITE_LISTED);
53
54 const range = 2;
55 function generateCodeFrame(source, start = 0, end = source.length) {
56 // Split the content into individual lines but capture the newline sequence
57 // that separated each line. This is important because the actual sequence is
58 // needed to properly take into account the full line length for offset
59 // comparison
60 let lines = source.split(/(\r?\n)/);
61 // Separate the lines and newline sequences into separate arrays for easier referencing
62 const newlineSequences = lines.filter((_, idx) => idx % 2 === 1);
63 lines = lines.filter((_, idx) => idx % 2 === 0);
64 let count = 0;
65 const res = [];
66 for (let i = 0; i < lines.length; i++) {
67 count +=
68 lines[i].length +
69 ((newlineSequences[i] && newlineSequences[i].length) || 0);
70 if (count >= start) {
71 for (let j = i - range; j <= i + range || end > count; j++) {
72 if (j < 0 || j >= lines.length)
73 continue;
74 const line = j + 1;
75 res.push(`${line}${' '.repeat(Math.max(3 - String(line).length, 0))}| ${lines[j]}`);
76 const lineLength = lines[j].length;
77 const newLineSeqLength = (newlineSequences[j] && newlineSequences[j].length) || 0;
78 if (j === i) {
79 // push underline
80 const pad = start - (count - (lineLength + newLineSeqLength));
81 const length = Math.max(1, end > count ? lineLength - pad : end - start);
82 res.push(` | ` + ' '.repeat(pad) + '^'.repeat(length));
83 }
84 else if (j > i) {
85 if (end > count) {
86 const length = Math.max(Math.min(end - count, lineLength), 1);
87 res.push(` | ` + '^'.repeat(length));
88 }
89 count += lineLength + newLineSeqLength;
90 }
91 }
92 break;
93 }
94 }
95 return res.join('\n');
96 }
97
98 /**
99 * On the client we only need to offer special cases for boolean attributes that
100 * have different names from their corresponding dom properties:
101 * - itemscope -> N/A
102 * - allowfullscreen -> allowFullscreen
103 * - formnovalidate -> formNoValidate
104 * - ismap -> isMap
105 * - nomodule -> noModule
106 * - novalidate -> noValidate
107 * - readonly -> readOnly
108 */
109 const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
110 const isSpecialBooleanAttr = /*#__PURE__*/ makeMap(specialBooleanAttrs);
111 /**
112 * Boolean attributes should be included if the value is truthy or ''.
113 * e.g. `<select multiple>` compiles to `{ multiple: '' }`
114 */
115 function includeBooleanAttr(value) {
116 return !!value || value === '';
117 }
118
119 function normalizeStyle(value) {
120 if (isArray(value)) {
121 const res = {};
122 for (let i = 0; i < value.length; i++) {
123 const item = value[i];
124 const normalized = isString(item)
125 ? parseStringStyle(item)
126 : normalizeStyle(item);
127 if (normalized) {
128 for (const key in normalized) {
129 res[key] = normalized[key];
130 }
131 }
132 }
133 return res;
134 }
135 else if (isString(value)) {
136 return value;
137 }
138 else if (isObject(value)) {
139 return value;
140 }
141 }
142 const listDelimiterRE = /;(?![^(]*\))/g;
143 const propertyDelimiterRE = /:(.+)/;
144 function parseStringStyle(cssText) {
145 const ret = {};
146 cssText.split(listDelimiterRE).forEach(item => {
147 if (item) {
148 const tmp = item.split(propertyDelimiterRE);
149 tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
150 }
151 });
152 return ret;
153 }
154 function normalizeClass(value) {
155 let res = '';
156 if (isString(value)) {
157 res = value;
158 }
159 else if (isArray(value)) {
160 for (let i = 0; i < value.length; i++) {
161 const normalized = normalizeClass(value[i]);
162 if (normalized) {
163 res += normalized + ' ';
164 }
165 }
166 }
167 else if (isObject(value)) {
168 for (const name in value) {
169 if (value[name]) {
170 res += name + ' ';
171 }
172 }
173 }
174 return res.trim();
175 }
176 function normalizeProps(props) {
177 if (!props)
178 return null;
179 let { class: klass, style } = props;
180 if (klass && !isString(klass)) {
181 props.class = normalizeClass(klass);
182 }
183 if (style) {
184 props.style = normalizeStyle(style);
185 }
186 return props;
187 }
188
189 // These tag configs are shared between compiler-dom and runtime-dom, so they
190 // https://developer.mozilla.org/en-US/docs/Web/HTML/Element
191 const HTML_TAGS = 'html,body,base,head,link,meta,style,title,address,article,aside,footer,' +
192 'header,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,' +
193 'figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,' +
194 'data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,' +
195 'time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,' +
196 'canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,' +
197 'th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,' +
198 'option,output,progress,select,textarea,details,dialog,menu,' +
199 'summary,template,blockquote,iframe,tfoot';
200 // https://developer.mozilla.org/en-US/docs/Web/SVG/Element
201 const SVG_TAGS = 'svg,animate,animateMotion,animateTransform,circle,clipPath,color-profile,' +
202 'defs,desc,discard,ellipse,feBlend,feColorMatrix,feComponentTransfer,' +
203 'feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,' +
204 'feDistanceLight,feDropShadow,feFlood,feFuncA,feFuncB,feFuncG,feFuncR,' +
205 'feGaussianBlur,feImage,feMerge,feMergeNode,feMorphology,feOffset,' +
206 'fePointLight,feSpecularLighting,feSpotLight,feTile,feTurbulence,filter,' +
207 'foreignObject,g,hatch,hatchpath,image,line,linearGradient,marker,mask,' +
208 'mesh,meshgradient,meshpatch,meshrow,metadata,mpath,path,pattern,' +
209 'polygon,polyline,radialGradient,rect,set,solidcolor,stop,switch,symbol,' +
210 'text,textPath,title,tspan,unknown,use,view';
211 const VOID_TAGS = 'area,base,br,col,embed,hr,img,input,link,meta,param,source,track,wbr';
212 /**
213 * Compiler only.
214 * Do NOT use in runtime code paths unless behind `true` flag.
215 */
216 const isHTMLTag = /*#__PURE__*/ makeMap(HTML_TAGS);
217 /**
218 * Compiler only.
219 * Do NOT use in runtime code paths unless behind `true` flag.
220 */
221 const isSVGTag = /*#__PURE__*/ makeMap(SVG_TAGS);
222 /**
223 * Compiler only.
224 * Do NOT use in runtime code paths unless behind `true` flag.
225 */
226 const isVoidTag = /*#__PURE__*/ makeMap(VOID_TAGS);
227
228 function looseCompareArrays(a, b) {
229 if (a.length !== b.length)
230 return false;
231 let equal = true;
232 for (let i = 0; equal && i < a.length; i++) {
233 equal = looseEqual(a[i], b[i]);
234 }
235 return equal;
236 }
237 function looseEqual(a, b) {
238 if (a === b)
239 return true;
240 let aValidType = isDate(a);
241 let bValidType = isDate(b);
242 if (aValidType || bValidType) {
243 return aValidType && bValidType ? a.getTime() === b.getTime() : false;
244 }
245 aValidType = isArray(a);
246 bValidType = isArray(b);
247 if (aValidType || bValidType) {
248 return aValidType && bValidType ? looseCompareArrays(a, b) : false;
249 }
250 aValidType = isObject(a);
251 bValidType = isObject(b);
252 if (aValidType || bValidType) {
253 /* istanbul ignore if: this if will probably never be called */
254 if (!aValidType || !bValidType) {
255 return false;
256 }
257 const aKeysCount = Object.keys(a).length;
258 const bKeysCount = Object.keys(b).length;
259 if (aKeysCount !== bKeysCount) {
260 return false;
261 }
262 for (const key in a) {
263 const aHasKey = a.hasOwnProperty(key);
264 const bHasKey = b.hasOwnProperty(key);
265 if ((aHasKey && !bHasKey) ||
266 (!aHasKey && bHasKey) ||
267 !looseEqual(a[key], b[key])) {
268 return false;
269 }
270 }
271 }
272 return String(a) === String(b);
273 }
274 function looseIndexOf(arr, val) {
275 return arr.findIndex(item => looseEqual(item, val));
276 }
277
278 /**
279 * For converting {{ interpolation }} values to displayed strings.
280 * @private
281 */
282 const toDisplayString = (val) => {
283 return isString(val)
284 ? val
285 : val == null
286 ? ''
287 : isArray(val) ||
288 (isObject(val) &&
289 (val.toString === objectToString || !isFunction(val.toString)))
290 ? JSON.stringify(val, replacer, 2)
291 : String(val);
292 };
293 const replacer = (_key, val) => {
294 // can't use isRef here since @vue/shared has no deps
295 if (val && val.__v_isRef) {
296 return replacer(_key, val.value);
297 }
298 else if (isMap(val)) {
299 return {
300 [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val]) => {
301 entries[`${key} =>`] = val;
302 return entries;
303 }, {})
304 };
305 }
306 else if (isSet(val)) {
307 return {
308 [`Set(${val.size})`]: [...val.values()]
309 };
310 }
311 else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
312 return String(val);
313 }
314 return val;
315 };
316
317 const EMPTY_OBJ = Object.freeze({})
318 ;
319 const EMPTY_ARR = Object.freeze([]) ;
320 const NOOP = () => { };
321 /**
322 * Always return false.
323 */
324 const NO = () => false;
325 const onRE = /^on[^a-z]/;
326 const isOn = (key) => onRE.test(key);
327 const isModelListener = (key) => key.startsWith('onUpdate:');
328 const extend = Object.assign;
329 const remove = (arr, el) => {
330 const i = arr.indexOf(el);
331 if (i > -1) {
332 arr.splice(i, 1);
333 }
334 };
335 const hasOwnProperty = Object.prototype.hasOwnProperty;
336 const hasOwn = (val, key) => hasOwnProperty.call(val, key);
337 const isArray = Array.isArray;
338 const isMap = (val) => toTypeString(val) === '[object Map]';
339 const isSet = (val) => toTypeString(val) === '[object Set]';
340 const isDate = (val) => val instanceof Date;
341 const isFunction = (val) => typeof val === 'function';
342 const isString = (val) => typeof val === 'string';
343 const isSymbol = (val) => typeof val === 'symbol';
344 const isObject = (val) => val !== null && typeof val === 'object';
345 const isPromise = (val) => {
346 return isObject(val) && isFunction(val.then) && isFunction(val.catch);
347 };
348 const objectToString = Object.prototype.toString;
349 const toTypeString = (value) => objectToString.call(value);
350 const toRawType = (value) => {
351 // extract "RawType" from strings like "[object RawType]"
352 return toTypeString(value).slice(8, -1);
353 };
354 const isPlainObject = (val) => toTypeString(val) === '[object Object]';
355 const isIntegerKey = (key) => isString(key) &&
356 key !== 'NaN' &&
357 key[0] !== '-' &&
358 '' + parseInt(key, 10) === key;
359 const isReservedProp = /*#__PURE__*/ makeMap(
360 // the leading comma is intentional so empty string "" is also included
361 ',key,ref,ref_for,ref_key,' +
362 'onVnodeBeforeMount,onVnodeMounted,' +
363 'onVnodeBeforeUpdate,onVnodeUpdated,' +
364 'onVnodeBeforeUnmount,onVnodeUnmounted');
365 const isBuiltInDirective = /*#__PURE__*/ makeMap('bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text,memo');
366 const cacheStringFunction = (fn) => {
367 const cache = Object.create(null);
368 return ((str) => {
369 const hit = cache[str];
370 return hit || (cache[str] = fn(str));
371 });
372 };
373 const camelizeRE = /-(\w)/g;
374 /**
375 * @private
376 */
377 const camelize = cacheStringFunction((str) => {
378 return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''));
379 });
380 const hyphenateRE = /\B([A-Z])/g;
381 /**
382 * @private
383 */
384 const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase());
385 /**
386 * @private
387 */
388 const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
389 /**
390 * @private
391 */
392 const toHandlerKey = cacheStringFunction((str) => str ? `on${capitalize(str)}` : ``);
393 // compare whether a value has changed, accounting for NaN.
394 const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
395 const invokeArrayFns = (fns, arg) => {
396 for (let i = 0; i < fns.length; i++) {
397 fns[i](arg);
398 }
399 };
400 const def = (obj, key, value) => {
401 Object.defineProperty(obj, key, {
402 configurable: true,
403 enumerable: false,
404 value
405 });
406 };
407 const toNumber = (val) => {
408 const n = parseFloat(val);
409 return isNaN(n) ? val : n;
410 };
411 let _globalThis;
412 const getGlobalThis = () => {
413 return (_globalThis ||
414 (_globalThis =
415 typeof globalThis !== 'undefined'
416 ? globalThis
417 : typeof self !== 'undefined'
418 ? self
419 : typeof window !== 'undefined'
420 ? window
421 : typeof global !== 'undefined'
422 ? global
423 : {}));
424 };
425
426 function warn(msg, ...args) {
427 console.warn(`[Vue warn] ${msg}`, ...args);
428 }
429
430 let activeEffectScope;
431 class EffectScope {
432 constructor(detached = false) {
433 this.active = true;
434 this.effects = [];
435 this.cleanups = [];
436 if (!detached && activeEffectScope) {
437 this.parent = activeEffectScope;
438 this.index =
439 (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(this) - 1;
440 }
441 }
442 run(fn) {
443 if (this.active) {
444 try {
445 activeEffectScope = this;
446 return fn();
447 }
448 finally {
449 activeEffectScope = this.parent;
450 }
451 }
452 else {
453 warn(`cannot run an inactive effect scope.`);
454 }
455 }
456 on() {
457 activeEffectScope = this;
458 }
459 off() {
460 activeEffectScope = this.parent;
461 }
462 stop(fromParent) {
463 if (this.active) {
464 let i, l;
465 for (i = 0, l = this.effects.length; i < l; i++) {
466 this.effects[i].stop();
467 }
468 for (i = 0, l = this.cleanups.length; i < l; i++) {
469 this.cleanups[i]();
470 }
471 if (this.scopes) {
472 for (i = 0, l = this.scopes.length; i < l; i++) {
473 this.scopes[i].stop(true);
474 }
475 }
476 // nested scope, dereference from parent to avoid memory leaks
477 if (this.parent && !fromParent) {
478 // optimized O(1) removal
479 const last = this.parent.scopes.pop();
480 if (last && last !== this) {
481 this.parent.scopes[this.index] = last;
482 last.index = this.index;
483 }
484 }
485 this.active = false;
486 }
487 }
488 }
489 function effectScope(detached) {
490 return new EffectScope(detached);
491 }
492 function recordEffectScope(effect, scope = activeEffectScope) {
493 if (scope && scope.active) {
494 scope.effects.push(effect);
495 }
496 }
497 function getCurrentScope() {
498 return activeEffectScope;
499 }
500 function onScopeDispose(fn) {
501 if (activeEffectScope) {
502 activeEffectScope.cleanups.push(fn);
503 }
504 else {
505 warn(`onScopeDispose() is called when there is no active effect scope` +
506 ` to be associated with.`);
507 }
508 }
509
510 const createDep = (effects) => {
511 const dep = new Set(effects);
512 dep.w = 0;
513 dep.n = 0;
514 return dep;
515 };
516 const wasTracked = (dep) => (dep.w & trackOpBit) > 0;
517 const newTracked = (dep) => (dep.n & trackOpBit) > 0;
518 const initDepMarkers = ({ deps }) => {
519 if (deps.length) {
520 for (let i = 0; i < deps.length; i++) {
521 deps[i].w |= trackOpBit; // set was tracked
522 }
523 }
524 };
525 const finalizeDepMarkers = (effect) => {
526 const { deps } = effect;
527 if (deps.length) {
528 let ptr = 0;
529 for (let i = 0; i < deps.length; i++) {
530 const dep = deps[i];
531 if (wasTracked(dep) && !newTracked(dep)) {
532 dep.delete(effect);
533 }
534 else {
535 deps[ptr++] = dep;
536 }
537 // clear bits
538 dep.w &= ~trackOpBit;
539 dep.n &= ~trackOpBit;
540 }
541 deps.length = ptr;
542 }
543 };
544
545 const targetMap = new WeakMap();
546 // The number of effects currently being tracked recursively.
547 let effectTrackDepth = 0;
548 let trackOpBit = 1;
549 /**
550 * The bitwise track markers support at most 30 levels of recursion.
551 * This value is chosen to enable modern JS engines to use a SMI on all platforms.
552 * When recursion depth is greater, fall back to using a full cleanup.
553 */
554 const maxMarkerBits = 30;
555 let activeEffect;
556 const ITERATE_KEY = Symbol('iterate' );
557 const MAP_KEY_ITERATE_KEY = Symbol('Map key iterate' );
558 class ReactiveEffect {
559 constructor(fn, scheduler = null, scope) {
560 this.fn = fn;
561 this.scheduler = scheduler;
562 this.active = true;
563 this.deps = [];
564 this.parent = undefined;
565 recordEffectScope(this, scope);
566 }
567 run() {
568 if (!this.active) {
569 return this.fn();
570 }
571 let parent = activeEffect;
572 let lastShouldTrack = shouldTrack;
573 while (parent) {
574 if (parent === this) {
575 return;
576 }
577 parent = parent.parent;
578 }
579 try {
580 this.parent = activeEffect;
581 activeEffect = this;
582 shouldTrack = true;
583 trackOpBit = 1 << ++effectTrackDepth;
584 if (effectTrackDepth <= maxMarkerBits) {
585 initDepMarkers(this);
586 }
587 else {
588 cleanupEffect(this);
589 }
590 return this.fn();
591 }
592 finally {
593 if (effectTrackDepth <= maxMarkerBits) {
594 finalizeDepMarkers(this);
595 }
596 trackOpBit = 1 << --effectTrackDepth;
597 activeEffect = this.parent;
598 shouldTrack = lastShouldTrack;
599 this.parent = undefined;
600 }
601 }
602 stop() {
603 if (this.active) {
604 cleanupEffect(this);
605 if (this.onStop) {
606 this.onStop();
607 }
608 this.active = false;
609 }
610 }
611 }
612 function cleanupEffect(effect) {
613 const { deps } = effect;
614 if (deps.length) {
615 for (let i = 0; i < deps.length; i++) {
616 deps[i].delete(effect);
617 }
618 deps.length = 0;
619 }
620 }
621 function effect(fn, options) {
622 if (fn.effect) {
623 fn = fn.effect.fn;
624 }
625 const _effect = new ReactiveEffect(fn);
626 if (options) {
627 extend(_effect, options);
628 if (options.scope)
629 recordEffectScope(_effect, options.scope);
630 }
631 if (!options || !options.lazy) {
632 _effect.run();
633 }
634 const runner = _effect.run.bind(_effect);
635 runner.effect = _effect;
636 return runner;
637 }
638 function stop(runner) {
639 runner.effect.stop();
640 }
641 let shouldTrack = true;
642 const trackStack = [];
643 function pauseTracking() {
644 trackStack.push(shouldTrack);
645 shouldTrack = false;
646 }
647 function resetTracking() {
648 const last = trackStack.pop();
649 shouldTrack = last === undefined ? true : last;
650 }
651 function track(target, type, key) {
652 if (shouldTrack && activeEffect) {
653 let depsMap = targetMap.get(target);
654 if (!depsMap) {
655 targetMap.set(target, (depsMap = new Map()));
656 }
657 let dep = depsMap.get(key);
658 if (!dep) {
659 depsMap.set(key, (dep = createDep()));
660 }
661 const eventInfo = { effect: activeEffect, target, type, key }
662 ;
663 trackEffects(dep, eventInfo);
664 }
665 }
666 function trackEffects(dep, debuggerEventExtraInfo) {
667 let shouldTrack = false;
668 if (effectTrackDepth <= maxMarkerBits) {
669 if (!newTracked(dep)) {
670 dep.n |= trackOpBit; // set newly tracked
671 shouldTrack = !wasTracked(dep);
672 }
673 }
674 else {
675 // Full cleanup mode.
676 shouldTrack = !dep.has(activeEffect);
677 }
678 if (shouldTrack) {
679 dep.add(activeEffect);
680 activeEffect.deps.push(dep);
681 if (activeEffect.onTrack) {
682 activeEffect.onTrack(Object.assign({
683 effect: activeEffect
684 }, debuggerEventExtraInfo));
685 }
686 }
687 }
688 function trigger(target, type, key, newValue, oldValue, oldTarget) {
689 const depsMap = targetMap.get(target);
690 if (!depsMap) {
691 // never been tracked
692 return;
693 }
694 let deps = [];
695 if (type === "clear" /* CLEAR */) {
696 // collection being cleared
697 // trigger all effects for target
698 deps = [...depsMap.values()];
699 }
700 else if (key === 'length' && isArray(target)) {
701 depsMap.forEach((dep, key) => {
702 if (key === 'length' || key >= newValue) {
703 deps.push(dep);
704 }
705 });
706 }
707 else {
708 // schedule runs for SET | ADD | DELETE
709 if (key !== void 0) {
710 deps.push(depsMap.get(key));
711 }
712 // also run for iteration key on ADD | DELETE | Map.SET
713 switch (type) {
714 case "add" /* ADD */:
715 if (!isArray(target)) {
716 deps.push(depsMap.get(ITERATE_KEY));
717 if (isMap(target)) {
718 deps.push(depsMap.get(MAP_KEY_ITERATE_KEY));
719 }
720 }
721 else if (isIntegerKey(key)) {
722 // new index added to array -> length changes
723 deps.push(depsMap.get('length'));
724 }
725 break;
726 case "delete" /* DELETE */:
727 if (!isArray(target)) {
728 deps.push(depsMap.get(ITERATE_KEY));
729 if (isMap(target)) {
730 deps.push(depsMap.get(MAP_KEY_ITERATE_KEY));
731 }
732 }
733 break;
734 case "set" /* SET */:
735 if (isMap(target)) {
736 deps.push(depsMap.get(ITERATE_KEY));
737 }
738 break;
739 }
740 }
741 const eventInfo = { target, type, key, newValue, oldValue, oldTarget }
742 ;
743 if (deps.length === 1) {
744 if (deps[0]) {
745 {
746 triggerEffects(deps[0], eventInfo);
747 }
748 }
749 }
750 else {
751 const effects = [];
752 for (const dep of deps) {
753 if (dep) {
754 effects.push(...dep);
755 }
756 }
757 {
758 triggerEffects(createDep(effects), eventInfo);
759 }
760 }
761 }
762 function triggerEffects(dep, debuggerEventExtraInfo) {
763 // spread into array for stabilization
764 for (const effect of isArray(dep) ? dep : [...dep]) {
765 if (effect !== activeEffect || effect.allowRecurse) {
766 if (effect.onTrigger) {
767 effect.onTrigger(extend({ effect }, debuggerEventExtraInfo));
768 }
769 if (effect.scheduler) {
770 effect.scheduler();
771 }
772 else {
773 effect.run();
774 }
775 }
776 }
777 }
778
779 const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
780 const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)
781 .map(key => Symbol[key])
782 .filter(isSymbol));
783 const get = /*#__PURE__*/ createGetter();
784 const shallowGet = /*#__PURE__*/ createGetter(false, true);
785 const readonlyGet = /*#__PURE__*/ createGetter(true);
786 const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);
787 const arrayInstrumentations = /*#__PURE__*/ createArrayInstrumentations();
788 function createArrayInstrumentations() {
789 const instrumentations = {};
790 ['includes', 'indexOf', 'lastIndexOf'].forEach(key => {
791 instrumentations[key] = function (...args) {
792 const arr = toRaw(this);
793 for (let i = 0, l = this.length; i < l; i++) {
794 track(arr, "get" /* GET */, i + '');
795 }
796 // we run the method using the original args first (which may be reactive)
797 const res = arr[key](...args);
798 if (res === -1 || res === false) {
799 // if that didn't work, run it again using raw values.
800 return arr[key](...args.map(toRaw));
801 }
802 else {
803 return res;
804 }
805 };
806 });
807 ['push', 'pop', 'shift', 'unshift', 'splice'].forEach(key => {
808 instrumentations[key] = function (...args) {
809 pauseTracking();
810 const res = toRaw(this)[key].apply(this, args);
811 resetTracking();
812 return res;
813 };
814 });
815 return instrumentations;
816 }
817 function createGetter(isReadonly = false, shallow = false) {
818 return function get(target, key, receiver) {
819 if (key === "__v_isReactive" /* IS_REACTIVE */) {
820 return !isReadonly;
821 }
822 else if (key === "__v_isReadonly" /* IS_READONLY */) {
823 return isReadonly;
824 }
825 else if (key === "__v_isShallow" /* IS_SHALLOW */) {
826 return shallow;
827 }
828 else if (key === "__v_raw" /* RAW */ &&
829 receiver ===
830 (isReadonly
831 ? shallow
832 ? shallowReadonlyMap
833 : readonlyMap
834 : shallow
835 ? shallowReactiveMap
836 : reactiveMap).get(target)) {
837 return target;
838 }
839 const targetIsArray = isArray(target);
840 if (!isReadonly && targetIsArray && hasOwn(arrayInstrumentations, key)) {
841 return Reflect.get(arrayInstrumentations, key, receiver);
842 }
843 const res = Reflect.get(target, key, receiver);
844 if (isSymbol(key) ? builtInSymbols.has(key) : isNonTrackableKeys(key)) {
845 return res;
846 }
847 if (!isReadonly) {
848 track(target, "get" /* GET */, key);
849 }
850 if (shallow) {
851 return res;
852 }
853 if (isRef(res)) {
854 // ref unwrapping - does not apply for Array + integer key.
855 const shouldUnwrap = !targetIsArray || !isIntegerKey(key);
856 return shouldUnwrap ? res.value : res;
857 }
858 if (isObject(res)) {
859 // Convert returned value into a proxy as well. we do the isObject check
860 // here to avoid invalid value warning. Also need to lazy access readonly
861 // and reactive here to avoid circular dependency.
862 return isReadonly ? readonly(res) : reactive(res);
863 }
864 return res;
865 };
866 }
867 const set = /*#__PURE__*/ createSetter();
868 const shallowSet = /*#__PURE__*/ createSetter(true);
869 function createSetter(shallow = false) {
870 return function set(target, key, value, receiver) {
871 let oldValue = target[key];
872 if (isReadonly(oldValue) && isRef(oldValue) && !isRef(value)) {
873 return false;
874 }
875 if (!shallow && !isReadonly(value)) {
876 if (!isShallow(value)) {
877 value = toRaw(value);
878 oldValue = toRaw(oldValue);
879 }
880 if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
881 oldValue.value = value;
882 return true;
883 }
884 }
885 const hadKey = isArray(target) && isIntegerKey(key)
886 ? Number(key) < target.length
887 : hasOwn(target, key);
888 const result = Reflect.set(target, key, value, receiver);
889 // don't trigger if target is something up in the prototype chain of original
890 if (target === toRaw(receiver)) {
891 if (!hadKey) {
892 trigger(target, "add" /* ADD */, key, value);
893 }
894 else if (hasChanged(value, oldValue)) {
895 trigger(target, "set" /* SET */, key, value, oldValue);
896 }
897 }
898 return result;
899 };
900 }
901 function deleteProperty(target, key) {
902 const hadKey = hasOwn(target, key);
903 const oldValue = target[key];
904 const result = Reflect.deleteProperty(target, key);
905 if (result && hadKey) {
906 trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
907 }
908 return result;
909 }
910 function has(target, key) {
911 const result = Reflect.has(target, key);
912 if (!isSymbol(key) || !builtInSymbols.has(key)) {
913 track(target, "has" /* HAS */, key);
914 }
915 return result;
916 }
917 function ownKeys(target) {
918 track(target, "iterate" /* ITERATE */, isArray(target) ? 'length' : ITERATE_KEY);
919 return Reflect.ownKeys(target);
920 }
921 const mutableHandlers = {
922 get,
923 set,
924 deleteProperty,
925 has,
926 ownKeys
927 };
928 const readonlyHandlers = {
929 get: readonlyGet,
930 set(target, key) {
931 {
932 console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
933 }
934 return true;
935 },
936 deleteProperty(target, key) {
937 {
938 console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
939 }
940 return true;
941 }
942 };
943 const shallowReactiveHandlers = /*#__PURE__*/ extend({}, mutableHandlers, {
944 get: shallowGet,
945 set: shallowSet
946 });
947 // Props handlers are special in the sense that it should not unwrap top-level
948 // refs (in order to allow refs to be explicitly passed down), but should
949 // retain the reactivity of the normal readonly object.
950 const shallowReadonlyHandlers = /*#__PURE__*/ extend({}, readonlyHandlers, {
951 get: shallowReadonlyGet
952 });
953
954 const toShallow = (value) => value;
955 const getProto = (v) => Reflect.getPrototypeOf(v);
956 function get$1(target, key, isReadonly = false, isShallow = false) {
957 // #1772: readonly(reactive(Map)) should return readonly + reactive version
958 // of the value
959 target = target["__v_raw" /* RAW */];
960 const rawTarget = toRaw(target);
961 const rawKey = toRaw(key);
962 if (key !== rawKey) {
963 !isReadonly && track(rawTarget, "get" /* GET */, key);
964 }
965 !isReadonly && track(rawTarget, "get" /* GET */, rawKey);
966 const { has } = getProto(rawTarget);
967 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
968 if (has.call(rawTarget, key)) {
969 return wrap(target.get(key));
970 }
971 else if (has.call(rawTarget, rawKey)) {
972 return wrap(target.get(rawKey));
973 }
974 else if (target !== rawTarget) {
975 // #3602 readonly(reactive(Map))
976 // ensure that the nested reactive `Map` can do tracking for itself
977 target.get(key);
978 }
979 }
980 function has$1(key, isReadonly = false) {
981 const target = this["__v_raw" /* RAW */];
982 const rawTarget = toRaw(target);
983 const rawKey = toRaw(key);
984 if (key !== rawKey) {
985 !isReadonly && track(rawTarget, "has" /* HAS */, key);
986 }
987 !isReadonly && track(rawTarget, "has" /* HAS */, rawKey);
988 return key === rawKey
989 ? target.has(key)
990 : target.has(key) || target.has(rawKey);
991 }
992 function size(target, isReadonly = false) {
993 target = target["__v_raw" /* RAW */];
994 !isReadonly && track(toRaw(target), "iterate" /* ITERATE */, ITERATE_KEY);
995 return Reflect.get(target, 'size', target);
996 }
997 function add(value) {
998 value = toRaw(value);
999 const target = toRaw(this);
1000 const proto = getProto(target);
1001 const hadKey = proto.has.call(target, value);
1002 if (!hadKey) {
1003 target.add(value);
1004 trigger(target, "add" /* ADD */, value, value);
1005 }
1006 return this;
1007 }
1008 function set$1(key, value) {
1009 value = toRaw(value);
1010 const target = toRaw(this);
1011 const { has, get } = getProto(target);
1012 let hadKey = has.call(target, key);
1013 if (!hadKey) {
1014 key = toRaw(key);
1015 hadKey = has.call(target, key);
1016 }
1017 else {
1018 checkIdentityKeys(target, has, key);
1019 }
1020 const oldValue = get.call(target, key);
1021 target.set(key, value);
1022 if (!hadKey) {
1023 trigger(target, "add" /* ADD */, key, value);
1024 }
1025 else if (hasChanged(value, oldValue)) {
1026 trigger(target, "set" /* SET */, key, value, oldValue);
1027 }
1028 return this;
1029 }
1030 function deleteEntry(key) {
1031 const target = toRaw(this);
1032 const { has, get } = getProto(target);
1033 let hadKey = has.call(target, key);
1034 if (!hadKey) {
1035 key = toRaw(key);
1036 hadKey = has.call(target, key);
1037 }
1038 else {
1039 checkIdentityKeys(target, has, key);
1040 }
1041 const oldValue = get ? get.call(target, key) : undefined;
1042 // forward the operation before queueing reactions
1043 const result = target.delete(key);
1044 if (hadKey) {
1045 trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
1046 }
1047 return result;
1048 }
1049 function clear() {
1050 const target = toRaw(this);
1051 const hadItems = target.size !== 0;
1052 const oldTarget = isMap(target)
1053 ? new Map(target)
1054 : new Set(target)
1055 ;
1056 // forward the operation before queueing reactions
1057 const result = target.clear();
1058 if (hadItems) {
1059 trigger(target, "clear" /* CLEAR */, undefined, undefined, oldTarget);
1060 }
1061 return result;
1062 }
1063 function createForEach(isReadonly, isShallow) {
1064 return function forEach(callback, thisArg) {
1065 const observed = this;
1066 const target = observed["__v_raw" /* RAW */];
1067 const rawTarget = toRaw(target);
1068 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
1069 !isReadonly && track(rawTarget, "iterate" /* ITERATE */, ITERATE_KEY);
1070 return target.forEach((value, key) => {
1071 // important: make sure the callback is
1072 // 1. invoked with the reactive map as `this` and 3rd arg
1073 // 2. the value received should be a corresponding reactive/readonly.
1074 return callback.call(thisArg, wrap(value), wrap(key), observed);
1075 });
1076 };
1077 }
1078 function createIterableMethod(method, isReadonly, isShallow) {
1079 return function (...args) {
1080 const target = this["__v_raw" /* RAW */];
1081 const rawTarget = toRaw(target);
1082 const targetIsMap = isMap(rawTarget);
1083 const isPair = method === 'entries' || (method === Symbol.iterator && targetIsMap);
1084 const isKeyOnly = method === 'keys' && targetIsMap;
1085 const innerIterator = target[method](...args);
1086 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
1087 !isReadonly &&
1088 track(rawTarget, "iterate" /* ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY);
1089 // return a wrapped iterator which returns observed versions of the
1090 // values emitted from the real iterator
1091 return {
1092 // iterator protocol
1093 next() {
1094 const { value, done } = innerIterator.next();
1095 return done
1096 ? { value, done }
1097 : {
1098 value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value),
1099 done
1100 };
1101 },
1102 // iterable protocol
1103 [Symbol.iterator]() {
1104 return this;
1105 }
1106 };
1107 };
1108 }
1109 function createReadonlyMethod(type) {
1110 return function (...args) {
1111 {
1112 const key = args[0] ? `on key "${args[0]}" ` : ``;
1113 console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this));
1114 }
1115 return type === "delete" /* DELETE */ ? false : this;
1116 };
1117 }
1118 function createInstrumentations() {
1119 const mutableInstrumentations = {
1120 get(key) {
1121 return get$1(this, key);
1122 },
1123 get size() {
1124 return size(this);
1125 },
1126 has: has$1,
1127 add,
1128 set: set$1,
1129 delete: deleteEntry,
1130 clear,
1131 forEach: createForEach(false, false)
1132 };
1133 const shallowInstrumentations = {
1134 get(key) {
1135 return get$1(this, key, false, true);
1136 },
1137 get size() {
1138 return size(this);
1139 },
1140 has: has$1,
1141 add,
1142 set: set$1,
1143 delete: deleteEntry,
1144 clear,
1145 forEach: createForEach(false, true)
1146 };
1147 const readonlyInstrumentations = {
1148 get(key) {
1149 return get$1(this, key, true);
1150 },
1151 get size() {
1152 return size(this, true);
1153 },
1154 has(key) {
1155 return has$1.call(this, key, true);
1156 },
1157 add: createReadonlyMethod("add" /* ADD */),
1158 set: createReadonlyMethod("set" /* SET */),
1159 delete: createReadonlyMethod("delete" /* DELETE */),
1160 clear: createReadonlyMethod("clear" /* CLEAR */),
1161 forEach: createForEach(true, false)
1162 };
1163 const shallowReadonlyInstrumentations = {
1164 get(key) {
1165 return get$1(this, key, true, true);
1166 },
1167 get size() {
1168 return size(this, true);
1169 },
1170 has(key) {
1171 return has$1.call(this, key, true);
1172 },
1173 add: createReadonlyMethod("add" /* ADD */),
1174 set: createReadonlyMethod("set" /* SET */),
1175 delete: createReadonlyMethod("delete" /* DELETE */),
1176 clear: createReadonlyMethod("clear" /* CLEAR */),
1177 forEach: createForEach(true, true)
1178 };
1179 const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator];
1180 iteratorMethods.forEach(method => {
1181 mutableInstrumentations[method] = createIterableMethod(method, false, false);
1182 readonlyInstrumentations[method] = createIterableMethod(method, true, false);
1183 shallowInstrumentations[method] = createIterableMethod(method, false, true);
1184 shallowReadonlyInstrumentations[method] = createIterableMethod(method, true, true);
1185 });
1186 return [
1187 mutableInstrumentations,
1188 readonlyInstrumentations,
1189 shallowInstrumentations,
1190 shallowReadonlyInstrumentations
1191 ];
1192 }
1193 const [mutableInstrumentations, readonlyInstrumentations, shallowInstrumentations, shallowReadonlyInstrumentations] = /* #__PURE__*/ createInstrumentations();
1194 function createInstrumentationGetter(isReadonly, shallow) {
1195 const instrumentations = shallow
1196 ? isReadonly
1197 ? shallowReadonlyInstrumentations
1198 : shallowInstrumentations
1199 : isReadonly
1200 ? readonlyInstrumentations
1201 : mutableInstrumentations;
1202 return (target, key, receiver) => {
1203 if (key === "__v_isReactive" /* IS_REACTIVE */) {
1204 return !isReadonly;
1205 }
1206 else if (key === "__v_isReadonly" /* IS_READONLY */) {
1207 return isReadonly;
1208 }
1209 else if (key === "__v_raw" /* RAW */) {
1210 return target;
1211 }
1212 return Reflect.get(hasOwn(instrumentations, key) && key in target
1213 ? instrumentations
1214 : target, key, receiver);
1215 };
1216 }
1217 const mutableCollectionHandlers = {
1218 get: /*#__PURE__*/ createInstrumentationGetter(false, false)
1219 };
1220 const shallowCollectionHandlers = {
1221 get: /*#__PURE__*/ createInstrumentationGetter(false, true)
1222 };
1223 const readonlyCollectionHandlers = {
1224 get: /*#__PURE__*/ createInstrumentationGetter(true, false)
1225 };
1226 const shallowReadonlyCollectionHandlers = {
1227 get: /*#__PURE__*/ createInstrumentationGetter(true, true)
1228 };
1229 function checkIdentityKeys(target, has, key) {
1230 const rawKey = toRaw(key);
1231 if (rawKey !== key && has.call(target, rawKey)) {
1232 const type = toRawType(target);
1233 console.warn(`Reactive ${type} contains both the raw and reactive ` +
1234 `versions of the same object${type === `Map` ? ` as keys` : ``}, ` +
1235 `which can lead to inconsistencies. ` +
1236 `Avoid differentiating between the raw and reactive versions ` +
1237 `of an object and only use the reactive version if possible.`);
1238 }
1239 }
1240
1241 const reactiveMap = new WeakMap();
1242 const shallowReactiveMap = new WeakMap();
1243 const readonlyMap = new WeakMap();
1244 const shallowReadonlyMap = new WeakMap();
1245 function targetTypeMap(rawType) {
1246 switch (rawType) {
1247 case 'Object':
1248 case 'Array':
1249 return 1 /* COMMON */;
1250 case 'Map':
1251 case 'Set':
1252 case 'WeakMap':
1253 case 'WeakSet':
1254 return 2 /* COLLECTION */;
1255 default:
1256 return 0 /* INVALID */;
1257 }
1258 }
1259 function getTargetType(value) {
1260 return value["__v_skip" /* SKIP */] || !Object.isExtensible(value)
1261 ? 0 /* INVALID */
1262 : targetTypeMap(toRawType(value));
1263 }
1264 function reactive(target) {
1265 // if trying to observe a readonly proxy, return the readonly version.
1266 if (isReadonly(target)) {
1267 return target;
1268 }
1269 return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers, reactiveMap);
1270 }
1271 /**
1272 * Return a shallowly-reactive copy of the original object, where only the root
1273 * level properties are reactive. It also does not auto-unwrap refs (even at the
1274 * root level).
1275 */
1276 function shallowReactive(target) {
1277 return createReactiveObject(target, false, shallowReactiveHandlers, shallowCollectionHandlers, shallowReactiveMap);
1278 }
1279 /**
1280 * Creates a readonly copy of the original object. Note the returned copy is not
1281 * made reactive, but `readonly` can be called on an already reactive object.
1282 */
1283 function readonly(target) {
1284 return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers, readonlyMap);
1285 }
1286 /**
1287 * Returns a reactive-copy of the original object, where only the root level
1288 * properties are readonly, and does NOT unwrap refs nor recursively convert
1289 * returned properties.
1290 * This is used for creating the props proxy object for stateful components.
1291 */
1292 function shallowReadonly(target) {
1293 return createReactiveObject(target, true, shallowReadonlyHandlers, shallowReadonlyCollectionHandlers, shallowReadonlyMap);
1294 }
1295 function createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers, proxyMap) {
1296 if (!isObject(target)) {
1297 {
1298 console.warn(`value cannot be made reactive: ${String(target)}`);
1299 }
1300 return target;
1301 }
1302 // target is already a Proxy, return it.
1303 // exception: calling readonly() on a reactive object
1304 if (target["__v_raw" /* RAW */] &&
1305 !(isReadonly && target["__v_isReactive" /* IS_REACTIVE */])) {
1306 return target;
1307 }
1308 // target already has corresponding Proxy
1309 const existingProxy = proxyMap.get(target);
1310 if (existingProxy) {
1311 return existingProxy;
1312 }
1313 // only a whitelist of value types can be observed.
1314 const targetType = getTargetType(target);
1315 if (targetType === 0 /* INVALID */) {
1316 return target;
1317 }
1318 const proxy = new Proxy(target, targetType === 2 /* COLLECTION */ ? collectionHandlers : baseHandlers);
1319 proxyMap.set(target, proxy);
1320 return proxy;
1321 }
1322 function isReactive(value) {
1323 if (isReadonly(value)) {
1324 return isReactive(value["__v_raw" /* RAW */]);
1325 }
1326 return !!(value && value["__v_isReactive" /* IS_REACTIVE */]);
1327 }
1328 function isReadonly(value) {
1329 return !!(value && value["__v_isReadonly" /* IS_READONLY */]);
1330 }
1331 function isShallow(value) {
1332 return !!(value && value["__v_isShallow" /* IS_SHALLOW */]);
1333 }
1334 function isProxy(value) {
1335 return isReactive(value) || isReadonly(value);
1336 }
1337 function toRaw(observed) {
1338 const raw = observed && observed["__v_raw" /* RAW */];
1339 return raw ? toRaw(raw) : observed;
1340 }
1341 function markRaw(value) {
1342 def(value, "__v_skip" /* SKIP */, true);
1343 return value;
1344 }
1345 const toReactive = (value) => isObject(value) ? reactive(value) : value;
1346 const toReadonly = (value) => isObject(value) ? readonly(value) : value;
1347
1348 function trackRefValue(ref) {
1349 if (shouldTrack && activeEffect) {
1350 ref = toRaw(ref);
1351 {
1352 trackEffects(ref.dep || (ref.dep = createDep()), {
1353 target: ref,
1354 type: "get" /* GET */,
1355 key: 'value'
1356 });
1357 }
1358 }
1359 }
1360 function triggerRefValue(ref, newVal) {
1361 ref = toRaw(ref);
1362 if (ref.dep) {
1363 {
1364 triggerEffects(ref.dep, {
1365 target: ref,
1366 type: "set" /* SET */,
1367 key: 'value',
1368 newValue: newVal
1369 });
1370 }
1371 }
1372 }
1373 function isRef(r) {
1374 return !!(r && r.__v_isRef === true);
1375 }
1376 function ref(value) {
1377 return createRef(value, false);
1378 }
1379 function shallowRef(value) {
1380 return createRef(value, true);
1381 }
1382 function createRef(rawValue, shallow) {
1383 if (isRef(rawValue)) {
1384 return rawValue;
1385 }
1386 return new RefImpl(rawValue, shallow);
1387 }
1388 class RefImpl {
1389 constructor(value, __v_isShallow) {
1390 this.__v_isShallow = __v_isShallow;
1391 this.dep = undefined;
1392 this.__v_isRef = true;
1393 this._rawValue = __v_isShallow ? value : toRaw(value);
1394 this._value = __v_isShallow ? value : toReactive(value);
1395 }
1396 get value() {
1397 trackRefValue(this);
1398 return this._value;
1399 }
1400 set value(newVal) {
1401 newVal = this.__v_isShallow ? newVal : toRaw(newVal);
1402 if (hasChanged(newVal, this._rawValue)) {
1403 this._rawValue = newVal;
1404 this._value = this.__v_isShallow ? newVal : toReactive(newVal);
1405 triggerRefValue(this, newVal);
1406 }
1407 }
1408 }
1409 function triggerRef(ref) {
1410 triggerRefValue(ref, ref.value );
1411 }
1412 function unref(ref) {
1413 return isRef(ref) ? ref.value : ref;
1414 }
1415 const shallowUnwrapHandlers = {
1416 get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
1417 set: (target, key, value, receiver) => {
1418 const oldValue = target[key];
1419 if (isRef(oldValue) && !isRef(value)) {
1420 oldValue.value = value;
1421 return true;
1422 }
1423 else {
1424 return Reflect.set(target, key, value, receiver);
1425 }
1426 }
1427 };
1428 function proxyRefs(objectWithRefs) {
1429 return isReactive(objectWithRefs)
1430 ? objectWithRefs
1431 : new Proxy(objectWithRefs, shallowUnwrapHandlers);
1432 }
1433 class CustomRefImpl {
1434 constructor(factory) {
1435 this.dep = undefined;
1436 this.__v_isRef = true;
1437 const { get, set } = factory(() => trackRefValue(this), () => triggerRefValue(this));
1438 this._get = get;
1439 this._set = set;
1440 }
1441 get value() {
1442 return this._get();
1443 }
1444 set value(newVal) {
1445 this._set(newVal);
1446 }
1447 }
1448 function customRef(factory) {
1449 return new CustomRefImpl(factory);
1450 }
1451 function toRefs(object) {
1452 if (!isProxy(object)) {
1453 console.warn(`toRefs() expects a reactive object but received a plain one.`);
1454 }
1455 const ret = isArray(object) ? new Array(object.length) : {};
1456 for (const key in object) {
1457 ret[key] = toRef(object, key);
1458 }
1459 return ret;
1460 }
1461 class ObjectRefImpl {
1462 constructor(_object, _key, _defaultValue) {
1463 this._object = _object;
1464 this._key = _key;
1465 this._defaultValue = _defaultValue;
1466 this.__v_isRef = true;
1467 }
1468 get value() {
1469 const val = this._object[this._key];
1470 return val === undefined ? this._defaultValue : val;
1471 }
1472 set value(newVal) {
1473 this._object[this._key] = newVal;
1474 }
1475 }
1476 function toRef(object, key, defaultValue) {
1477 const val = object[key];
1478 return isRef(val)
1479 ? val
1480 : new ObjectRefImpl(object, key, defaultValue);
1481 }
1482
1483 class ComputedRefImpl {
1484 constructor(getter, _setter, isReadonly, isSSR) {
1485 this._setter = _setter;
1486 this.dep = undefined;
1487 this.__v_isRef = true;
1488 this._dirty = true;
1489 this.effect = new ReactiveEffect(getter, () => {
1490 if (!this._dirty) {
1491 this._dirty = true;
1492 triggerRefValue(this);
1493 }
1494 });
1495 this.effect.computed = this;
1496 this.effect.active = this._cacheable = !isSSR;
1497 this["__v_isReadonly" /* IS_READONLY */] = isReadonly;
1498 }
1499 get value() {
1500 // the computed ref may get wrapped by other proxies e.g. readonly() #3376
1501 const self = toRaw(this);
1502 trackRefValue(self);
1503 if (self._dirty || !self._cacheable) {
1504 self._dirty = false;
1505 self._value = self.effect.run();
1506 }
1507 return self._value;
1508 }
1509 set value(newValue) {
1510 this._setter(newValue);
1511 }
1512 }
1513 function computed(getterOrOptions, debugOptions, isSSR = false) {
1514 let getter;
1515 let setter;
1516 const onlyGetter = isFunction(getterOrOptions);
1517 if (onlyGetter) {
1518 getter = getterOrOptions;
1519 setter = () => {
1520 console.warn('Write operation failed: computed value is readonly');
1521 }
1522 ;
1523 }
1524 else {
1525 getter = getterOrOptions.get;
1526 setter = getterOrOptions.set;
1527 }
1528 const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter, isSSR);
1529 if (debugOptions && !isSSR) {
1530 cRef.effect.onTrack = debugOptions.onTrack;
1531 cRef.effect.onTrigger = debugOptions.onTrigger;
1532 }
1533 return cRef;
1534 }
1535
1536 const stack = [];
1537 function pushWarningContext(vnode) {
1538 stack.push(vnode);
1539 }
1540 function popWarningContext() {
1541 stack.pop();
1542 }
1543 function warn$1(msg, ...args) {
1544 // avoid props formatting or warn handler tracking deps that might be mutated
1545 // during patch, leading to infinite recursion.
1546 pauseTracking();
1547 const instance = stack.length ? stack[stack.length - 1].component : null;
1548 const appWarnHandler = instance && instance.appContext.config.warnHandler;
1549 const trace = getComponentTrace();
1550 if (appWarnHandler) {
1551 callWithErrorHandling(appWarnHandler, instance, 11 /* APP_WARN_HANDLER */, [
1552 msg + args.join(''),
1553 instance && instance.proxy,
1554 trace
1555 .map(({ vnode }) => `at <${formatComponentName(instance, vnode.type)}>`)
1556 .join('\n'),
1557 trace
1558 ]);
1559 }
1560 else {
1561 const warnArgs = [`[Vue warn]: ${msg}`, ...args];
1562 /* istanbul ignore if */
1563 if (trace.length &&
1564 // avoid spamming console during tests
1565 !false) {
1566 warnArgs.push(`\n`, ...formatTrace(trace));
1567 }
1568 console.warn(...warnArgs);
1569 }
1570 resetTracking();
1571 }
1572 function getComponentTrace() {
1573 let currentVNode = stack[stack.length - 1];
1574 if (!currentVNode) {
1575 return [];
1576 }
1577 // we can't just use the stack because it will be incomplete during updates
1578 // that did not start from the root. Re-construct the parent chain using
1579 // instance parent pointers.
1580 const normalizedStack = [];
1581 while (currentVNode) {
1582 const last = normalizedStack[0];
1583 if (last && last.vnode === currentVNode) {
1584 last.recurseCount++;
1585 }
1586 else {
1587 normalizedStack.push({
1588 vnode: currentVNode,
1589 recurseCount: 0
1590 });
1591 }
1592 const parentInstance = currentVNode.component && currentVNode.component.parent;
1593 currentVNode = parentInstance && parentInstance.vnode;
1594 }
1595 return normalizedStack;
1596 }
1597 /* istanbul ignore next */
1598 function formatTrace(trace) {
1599 const logs = [];
1600 trace.forEach((entry, i) => {
1601 logs.push(...(i === 0 ? [] : [`\n`]), ...formatTraceEntry(entry));
1602 });
1603 return logs;
1604 }
1605 function formatTraceEntry({ vnode, recurseCount }) {
1606 const postfix = recurseCount > 0 ? `... (${recurseCount} recursive calls)` : ``;
1607 const isRoot = vnode.component ? vnode.component.parent == null : false;
1608 const open = ` at <${formatComponentName(vnode.component, vnode.type, isRoot)}`;
1609 const close = `>` + postfix;
1610 return vnode.props
1611 ? [open, ...formatProps(vnode.props), close]
1612 : [open + close];
1613 }
1614 /* istanbul ignore next */
1615 function formatProps(props) {
1616 const res = [];
1617 const keys = Object.keys(props);
1618 keys.slice(0, 3).forEach(key => {
1619 res.push(...formatProp(key, props[key]));
1620 });
1621 if (keys.length > 3) {
1622 res.push(` ...`);
1623 }
1624 return res;
1625 }
1626 /* istanbul ignore next */
1627 function formatProp(key, value, raw) {
1628 if (isString(value)) {
1629 value = JSON.stringify(value);
1630 return raw ? value : [`${key}=${value}`];
1631 }
1632 else if (typeof value === 'number' ||
1633 typeof value === 'boolean' ||
1634 value == null) {
1635 return raw ? value : [`${key}=${value}`];
1636 }
1637 else if (isRef(value)) {
1638 value = formatProp(key, toRaw(value.value), true);
1639 return raw ? value : [`${key}=Ref<`, value, `>`];
1640 }
1641 else if (isFunction(value)) {
1642 return [`${key}=fn${value.name ? `<${value.name}>` : ``}`];
1643 }
1644 else {
1645 value = toRaw(value);
1646 return raw ? value : [`${key}=`, value];
1647 }
1648 }
1649
1650 const ErrorTypeStrings = {
1651 ["sp" /* SERVER_PREFETCH */]: 'serverPrefetch hook',
1652 ["bc" /* BEFORE_CREATE */]: 'beforeCreate hook',
1653 ["c" /* CREATED */]: 'created hook',
1654 ["bm" /* BEFORE_MOUNT */]: 'beforeMount hook',
1655 ["m" /* MOUNTED */]: 'mounted hook',
1656 ["bu" /* BEFORE_UPDATE */]: 'beforeUpdate hook',
1657 ["u" /* UPDATED */]: 'updated',
1658 ["bum" /* BEFORE_UNMOUNT */]: 'beforeUnmount hook',
1659 ["um" /* UNMOUNTED */]: 'unmounted hook',
1660 ["a" /* ACTIVATED */]: 'activated hook',
1661 ["da" /* DEACTIVATED */]: 'deactivated hook',
1662 ["ec" /* ERROR_CAPTURED */]: 'errorCaptured hook',
1663 ["rtc" /* RENDER_TRACKED */]: 'renderTracked hook',
1664 ["rtg" /* RENDER_TRIGGERED */]: 'renderTriggered hook',
1665 [0 /* SETUP_FUNCTION */]: 'setup function',
1666 [1 /* RENDER_FUNCTION */]: 'render function',
1667 [2 /* WATCH_GETTER */]: 'watcher getter',
1668 [3 /* WATCH_CALLBACK */]: 'watcher callback',
1669 [4 /* WATCH_CLEANUP */]: 'watcher cleanup function',
1670 [5 /* NATIVE_EVENT_HANDLER */]: 'native event handler',
1671 [6 /* COMPONENT_EVENT_HANDLER */]: 'component event handler',
1672 [7 /* VNODE_HOOK */]: 'vnode hook',
1673 [8 /* DIRECTIVE_HOOK */]: 'directive hook',
1674 [9 /* TRANSITION_HOOK */]: 'transition hook',
1675 [10 /* APP_ERROR_HANDLER */]: 'app errorHandler',
1676 [11 /* APP_WARN_HANDLER */]: 'app warnHandler',
1677 [12 /* FUNCTION_REF */]: 'ref function',
1678 [13 /* ASYNC_COMPONENT_LOADER */]: 'async component loader',
1679 [14 /* SCHEDULER */]: 'scheduler flush. This is likely a Vue internals bug. ' +
1680 'Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core'
1681 };
1682 function callWithErrorHandling(fn, instance, type, args) {
1683 let res;
1684 try {
1685 res = args ? fn(...args) : fn();
1686 }
1687 catch (err) {
1688 handleError(err, instance, type);
1689 }
1690 return res;
1691 }
1692 function callWithAsyncErrorHandling(fn, instance, type, args) {
1693 if (isFunction(fn)) {
1694 const res = callWithErrorHandling(fn, instance, type, args);
1695 if (res && isPromise(res)) {
1696 res.catch(err => {
1697 handleError(err, instance, type);
1698 });
1699 }
1700 return res;
1701 }
1702 const values = [];
1703 for (let i = 0; i < fn.length; i++) {
1704 values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
1705 }
1706 return values;
1707 }
1708 function handleError(err, instance, type, throwInDev = true) {
1709 const contextVNode = instance ? instance.vnode : null;
1710 if (instance) {
1711 let cur = instance.parent;
1712 // the exposed instance is the render proxy to keep it consistent with 2.x
1713 const exposedInstance = instance.proxy;
1714 // in production the hook receives only the error code
1715 const errorInfo = ErrorTypeStrings[type] ;
1716 while (cur) {
1717 const errorCapturedHooks = cur.ec;
1718 if (errorCapturedHooks) {
1719 for (let i = 0; i < errorCapturedHooks.length; i++) {
1720 if (errorCapturedHooks[i](err, exposedInstance, errorInfo) === false) {
1721 return;
1722 }
1723 }
1724 }
1725 cur = cur.parent;
1726 }
1727 // app-level handling
1728 const appErrorHandler = instance.appContext.config.errorHandler;
1729 if (appErrorHandler) {
1730 callWithErrorHandling(appErrorHandler, null, 10 /* APP_ERROR_HANDLER */, [err, exposedInstance, errorInfo]);
1731 return;
1732 }
1733 }
1734 logError(err, type, contextVNode, throwInDev);
1735 }
1736 function logError(err, type, contextVNode, throwInDev = true) {
1737 {
1738 const info = ErrorTypeStrings[type];
1739 if (contextVNode) {
1740 pushWarningContext(contextVNode);
1741 }
1742 warn$1(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
1743 if (contextVNode) {
1744 popWarningContext();
1745 }
1746 // crash in dev by default so it's more noticeable
1747 if (throwInDev) {
1748 throw err;
1749 }
1750 else {
1751 console.error(err);
1752 }
1753 }
1754 }
1755
1756 let isFlushing = false;
1757 let isFlushPending = false;
1758 const queue = [];
1759 let flushIndex = 0;
1760 const pendingPreFlushCbs = [];
1761 let activePreFlushCbs = null;
1762 let preFlushIndex = 0;
1763 const pendingPostFlushCbs = [];
1764 let activePostFlushCbs = null;
1765 let postFlushIndex = 0;
1766 const resolvedPromise = Promise.resolve();
1767 let currentFlushPromise = null;
1768 let currentPreFlushParentJob = null;
1769 const RECURSION_LIMIT = 100;
1770 function nextTick(fn) {
1771 const p = currentFlushPromise || resolvedPromise;
1772 return fn ? p.then(this ? fn.bind(this) : fn) : p;
1773 }
1774 // #2768
1775 // Use binary-search to find a suitable position in the queue,
1776 // so that the queue maintains the increasing order of job's id,
1777 // which can prevent the job from being skipped and also can avoid repeated patching.
1778 function findInsertionIndex(id) {
1779 // the start index should be `flushIndex + 1`
1780 let start = flushIndex + 1;
1781 let end = queue.length;
1782 while (start < end) {
1783 const middle = (start + end) >>> 1;
1784 const middleJobId = getId(queue[middle]);
1785 middleJobId < id ? (start = middle + 1) : (end = middle);
1786 }
1787 return start;
1788 }
1789 function queueJob(job) {
1790 // the dedupe search uses the startIndex argument of Array.includes()
1791 // by default the search index includes the current job that is being run
1792 // so it cannot recursively trigger itself again.
1793 // if the job is a watch() callback, the search will start with a +1 index to
1794 // allow it recursively trigger itself - it is the user's responsibility to
1795 // ensure it doesn't end up in an infinite loop.
1796 if ((!queue.length ||
1797 !queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)) &&
1798 job !== currentPreFlushParentJob) {
1799 if (job.id == null) {
1800 queue.push(job);
1801 }
1802 else {
1803 queue.splice(findInsertionIndex(job.id), 0, job);
1804 }
1805 queueFlush();
1806 }
1807 }
1808 function queueFlush() {
1809 if (!isFlushing && !isFlushPending) {
1810 isFlushPending = true;
1811 currentFlushPromise = resolvedPromise.then(flushJobs);
1812 }
1813 }
1814 function invalidateJob(job) {
1815 const i = queue.indexOf(job);
1816 if (i > flushIndex) {
1817 queue.splice(i, 1);
1818 }
1819 }
1820 function queueCb(cb, activeQueue, pendingQueue, index) {
1821 if (!isArray(cb)) {
1822 if (!activeQueue ||
1823 !activeQueue.includes(cb, cb.allowRecurse ? index + 1 : index)) {
1824 pendingQueue.push(cb);
1825 }
1826 }
1827 else {
1828 // if cb is an array, it is a component lifecycle hook which can only be
1829 // triggered by a job, which is already deduped in the main queue, so
1830 // we can skip duplicate check here to improve perf
1831 pendingQueue.push(...cb);
1832 }
1833 queueFlush();
1834 }
1835 function queuePreFlushCb(cb) {
1836 queueCb(cb, activePreFlushCbs, pendingPreFlushCbs, preFlushIndex);
1837 }
1838 function queuePostFlushCb(cb) {
1839 queueCb(cb, activePostFlushCbs, pendingPostFlushCbs, postFlushIndex);
1840 }
1841 function flushPreFlushCbs(seen, parentJob = null) {
1842 if (pendingPreFlushCbs.length) {
1843 currentPreFlushParentJob = parentJob;
1844 activePreFlushCbs = [...new Set(pendingPreFlushCbs)];
1845 pendingPreFlushCbs.length = 0;
1846 {
1847 seen = seen || new Map();
1848 }
1849 for (preFlushIndex = 0; preFlushIndex < activePreFlushCbs.length; preFlushIndex++) {
1850 if (checkRecursiveUpdates(seen, activePreFlushCbs[preFlushIndex])) {
1851 continue;
1852 }
1853 activePreFlushCbs[preFlushIndex]();
1854 }
1855 activePreFlushCbs = null;
1856 preFlushIndex = 0;
1857 currentPreFlushParentJob = null;
1858 // recursively flush until it drains
1859 flushPreFlushCbs(seen, parentJob);
1860 }
1861 }
1862 function flushPostFlushCbs(seen) {
1863 if (pendingPostFlushCbs.length) {
1864 const deduped = [...new Set(pendingPostFlushCbs)];
1865 pendingPostFlushCbs.length = 0;
1866 // #1947 already has active queue, nested flushPostFlushCbs call
1867 if (activePostFlushCbs) {
1868 activePostFlushCbs.push(...deduped);
1869 return;
1870 }
1871 activePostFlushCbs = deduped;
1872 {
1873 seen = seen || new Map();
1874 }
1875 activePostFlushCbs.sort((a, b) => getId(a) - getId(b));
1876 for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
1877 if (checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex])) {
1878 continue;
1879 }
1880 activePostFlushCbs[postFlushIndex]();
1881 }
1882 activePostFlushCbs = null;
1883 postFlushIndex = 0;
1884 }
1885 }
1886 const getId = (job) => job.id == null ? Infinity : job.id;
1887 function flushJobs(seen) {
1888 isFlushPending = false;
1889 isFlushing = true;
1890 {
1891 seen = seen || new Map();
1892 }
1893 flushPreFlushCbs(seen);
1894 // Sort queue before flush.
1895 // This ensures that:
1896 // 1. Components are updated from parent to child. (because parent is always
1897 // created before the child so its render effect will have smaller
1898 // priority number)
1899 // 2. If a component is unmounted during a parent component's update,
1900 // its update can be skipped.
1901 queue.sort((a, b) => getId(a) - getId(b));
1902 // conditional usage of checkRecursiveUpdate must be determined out of
1903 // try ... catch block since Rollup by default de-optimizes treeshaking
1904 // inside try-catch. This can leave all warning code unshaked. Although
1905 // they would get eventually shaken by a minifier like terser, some minifiers
1906 // would fail to do that (e.g. https://github.com/evanw/esbuild/issues/1610)
1907 const check = (job) => checkRecursiveUpdates(seen, job)
1908 ;
1909 try {
1910 for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
1911 const job = queue[flushIndex];
1912 if (job && job.active !== false) {
1913 if (true && check(job)) {
1914 continue;
1915 }
1916 // console.log(`running:`, job.id)
1917 callWithErrorHandling(job, null, 14 /* SCHEDULER */);
1918 }
1919 }
1920 }
1921 finally {
1922 flushIndex = 0;
1923 queue.length = 0;
1924 flushPostFlushCbs(seen);
1925 isFlushing = false;
1926 currentFlushPromise = null;
1927 // some postFlushCb queued jobs!
1928 // keep flushing until it drains.
1929 if (queue.length ||
1930 pendingPreFlushCbs.length ||
1931 pendingPostFlushCbs.length) {
1932 flushJobs(seen);
1933 }
1934 }
1935 }
1936 function checkRecursiveUpdates(seen, fn) {
1937 if (!seen.has(fn)) {
1938 seen.set(fn, 1);
1939 }
1940 else {
1941 const count = seen.get(fn);
1942 if (count > RECURSION_LIMIT) {
1943 const instance = fn.ownerInstance;
1944 const componentName = instance && getComponentName(instance.type);
1945 warn$1(`Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. ` +
1946 `This means you have a reactive effect that is mutating its own ` +
1947 `dependencies and thus recursively triggering itself. Possible sources ` +
1948 `include component template, render function, updated hook or ` +
1949 `watcher source function.`);
1950 return true;
1951 }
1952 else {
1953 seen.set(fn, count + 1);
1954 }
1955 }
1956 }
1957
1958 /* eslint-disable no-restricted-globals */
1959 let isHmrUpdating = false;
1960 const hmrDirtyComponents = new Set();
1961 // Expose the HMR runtime on the global object
1962 // This makes it entirely tree-shakable without polluting the exports and makes
1963 // it easier to be used in toolings like vue-loader
1964 // Note: for a component to be eligible for HMR it also needs the __hmrId option
1965 // to be set so that its instances can be registered / removed.
1966 {
1967 getGlobalThis().__VUE_HMR_RUNTIME__ = {
1968 createRecord: tryWrap(createRecord),
1969 rerender: tryWrap(rerender),
1970 reload: tryWrap(reload)
1971 };
1972 }
1973 const map = new Map();
1974 function registerHMR(instance) {
1975 const id = instance.type.__hmrId;
1976 let record = map.get(id);
1977 if (!record) {
1978 createRecord(id, instance.type);
1979 record = map.get(id);
1980 }
1981 record.instances.add(instance);
1982 }
1983 function unregisterHMR(instance) {
1984 map.get(instance.type.__hmrId).instances.delete(instance);
1985 }
1986 function createRecord(id, initialDef) {
1987 if (map.has(id)) {
1988 return false;
1989 }
1990 map.set(id, {
1991 initialDef: normalizeClassComponent(initialDef),
1992 instances: new Set()
1993 });
1994 return true;
1995 }
1996 function normalizeClassComponent(component) {
1997 return isClassComponent(component) ? component.__vccOpts : component;
1998 }
1999 function rerender(id, newRender) {
2000 const record = map.get(id);
2001 if (!record) {
2002 return;
2003 }
2004 // update initial record (for not-yet-rendered component)
2005 record.initialDef.render = newRender;
2006 [...record.instances].forEach(instance => {
2007 if (newRender) {
2008 instance.render = newRender;
2009 normalizeClassComponent(instance.type).render = newRender;
2010 }
2011 instance.renderCache = [];
2012 // this flag forces child components with slot content to update
2013 isHmrUpdating = true;
2014 instance.update();
2015 isHmrUpdating = false;
2016 });
2017 }
2018 function reload(id, newComp) {
2019 const record = map.get(id);
2020 if (!record)
2021 return;
2022 newComp = normalizeClassComponent(newComp);
2023 // update initial def (for not-yet-rendered components)
2024 updateComponentDef(record.initialDef, newComp);
2025 // create a snapshot which avoids the set being mutated during updates
2026 const instances = [...record.instances];
2027 for (const instance of instances) {
2028 const oldComp = normalizeClassComponent(instance.type);
2029 if (!hmrDirtyComponents.has(oldComp)) {
2030 // 1. Update existing comp definition to match new one
2031 if (oldComp !== record.initialDef) {
2032 updateComponentDef(oldComp, newComp);
2033 }
2034 // 2. mark definition dirty. This forces the renderer to replace the
2035 // component on patch.
2036 hmrDirtyComponents.add(oldComp);
2037 }
2038 // 3. invalidate options resolution cache
2039 instance.appContext.optionsCache.delete(instance.type);
2040 // 4. actually update
2041 if (instance.ceReload) {
2042 // custom element
2043 hmrDirtyComponents.add(oldComp);
2044 instance.ceReload(newComp.styles);
2045 hmrDirtyComponents.delete(oldComp);
2046 }
2047 else if (instance.parent) {
2048 // 4. Force the parent instance to re-render. This will cause all updated
2049 // components to be unmounted and re-mounted. Queue the update so that we
2050 // don't end up forcing the same parent to re-render multiple times.
2051 queueJob(instance.parent.update);
2052 // instance is the inner component of an async custom element
2053 // invoke to reset styles
2054 if (instance.parent.type.__asyncLoader &&
2055 instance.parent.ceReload) {
2056 instance.parent.ceReload(newComp.styles);
2057 }
2058 }
2059 else if (instance.appContext.reload) {
2060 // root instance mounted via createApp() has a reload method
2061 instance.appContext.reload();
2062 }
2063 else if (typeof window !== 'undefined') {
2064 // root instance inside tree created via raw render(). Force reload.
2065 window.location.reload();
2066 }
2067 else {
2068 console.warn('[HMR] Root or manually mounted instance modified. Full reload required.');
2069 }
2070 }
2071 // 5. make sure to cleanup dirty hmr components after update
2072 queuePostFlushCb(() => {
2073 for (const instance of instances) {
2074 hmrDirtyComponents.delete(normalizeClassComponent(instance.type));
2075 }
2076 });
2077 }
2078 function updateComponentDef(oldComp, newComp) {
2079 extend(oldComp, newComp);
2080 for (const key in oldComp) {
2081 if (key !== '__file' && !(key in newComp)) {
2082 delete oldComp[key];
2083 }
2084 }
2085 }
2086 function tryWrap(fn) {
2087 return (id, arg) => {
2088 try {
2089 return fn(id, arg);
2090 }
2091 catch (e) {
2092 console.error(e);
2093 console.warn(`[HMR] Something went wrong during Vue component hot-reload. ` +
2094 `Full reload required.`);
2095 }
2096 };
2097 }
2098
2099 let buffer = [];
2100 let devtoolsNotInstalled = false;
2101 function emit(event, ...args) {
2102 if (exports.devtools) {
2103 exports.devtools.emit(event, ...args);
2104 }
2105 else if (!devtoolsNotInstalled) {
2106 buffer.push({ event, args });
2107 }
2108 }
2109 function setDevtoolsHook(hook, target) {
2110 var _a, _b;
2111 exports.devtools = hook;
2112 if (exports.devtools) {
2113 exports.devtools.enabled = true;
2114 buffer.forEach(({ event, args }) => exports.devtools.emit(event, ...args));
2115 buffer = [];
2116 }
2117 else if (
2118 // handle late devtools injection - only do this if we are in an actual
2119 // browser environment to avoid the timer handle stalling test runner exit
2120 // (#4815)
2121 // eslint-disable-next-line no-restricted-globals
2122 typeof window !== 'undefined' &&
2123 // some envs mock window but not fully
2124 window.HTMLElement &&
2125 // also exclude jsdom
2126 !((_b = (_a = window.navigator) === null || _a === void 0 ? void 0 : _a.userAgent) === null || _b === void 0 ? void 0 : _b.includes('jsdom'))) {
2127 const replay = (target.__VUE_DEVTOOLS_HOOK_REPLAY__ =
2128 target.__VUE_DEVTOOLS_HOOK_REPLAY__ || []);
2129 replay.push((newHook) => {
2130 setDevtoolsHook(newHook, target);
2131 });
2132 // clear buffer after 3s - the user probably doesn't have devtools installed
2133 // at all, and keeping the buffer will cause memory leaks (#4738)
2134 setTimeout(() => {
2135 if (!exports.devtools) {
2136 target.__VUE_DEVTOOLS_HOOK_REPLAY__ = null;
2137 devtoolsNotInstalled = true;
2138 buffer = [];
2139 }
2140 }, 3000);
2141 }
2142 else {
2143 // non-browser env, assume not installed
2144 devtoolsNotInstalled = true;
2145 buffer = [];
2146 }
2147 }
2148 function devtoolsInitApp(app, version) {
2149 emit("app:init" /* APP_INIT */, app, version, {
2150 Fragment,
2151 Text,
2152 Comment,
2153 Static
2154 });
2155 }
2156 function devtoolsUnmountApp(app) {
2157 emit("app:unmount" /* APP_UNMOUNT */, app);
2158 }
2159 const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* COMPONENT_ADDED */);
2160 const devtoolsComponentUpdated =
2161 /*#__PURE__*/ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */);
2162 const devtoolsComponentRemoved =
2163 /*#__PURE__*/ createDevtoolsComponentHook("component:removed" /* COMPONENT_REMOVED */);
2164 function createDevtoolsComponentHook(hook) {
2165 return (component) => {
2166 emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component);
2167 };
2168 }
2169 const devtoolsPerfStart = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:start" /* PERFORMANCE_START */);
2170 const devtoolsPerfEnd = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:end" /* PERFORMANCE_END */);
2171 function createDevtoolsPerformanceHook(hook) {
2172 return (component, type, time) => {
2173 emit(hook, component.appContext.app, component.uid, component, type, time);
2174 };
2175 }
2176 function devtoolsComponentEmit(component, event, params) {
2177 emit("component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params);
2178 }
2179
2180 function emit$1(instance, event, ...rawArgs) {
2181 const props = instance.vnode.props || EMPTY_OBJ;
2182 {
2183 const { emitsOptions, propsOptions: [propsOptions] } = instance;
2184 if (emitsOptions) {
2185 if (!(event in emitsOptions) &&
2186 !(false )) {
2187 if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
2188 warn$1(`Component emitted event "${event}" but it is neither declared in ` +
2189 `the emits option nor as an "${toHandlerKey(event)}" prop.`);
2190 }
2191 }
2192 else {
2193 const validator = emitsOptions[event];
2194 if (isFunction(validator)) {
2195 const isValid = validator(...rawArgs);
2196 if (!isValid) {
2197 warn$1(`Invalid event arguments: event validation failed for event "${event}".`);
2198 }
2199 }
2200 }
2201 }
2202 }
2203 let args = rawArgs;
2204 const isModelListener = event.startsWith('update:');
2205 // for v-model update:xxx events, apply modifiers on args
2206 const modelArg = isModelListener && event.slice(7);
2207 if (modelArg && modelArg in props) {
2208 const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`;
2209 const { number, trim } = props[modifiersKey] || EMPTY_OBJ;
2210 if (trim) {
2211 args = rawArgs.map(a => a.trim());
2212 }
2213 else if (number) {
2214 args = rawArgs.map(toNumber);
2215 }
2216 }
2217 {
2218 devtoolsComponentEmit(instance, event, args);
2219 }
2220 {
2221 const lowerCaseEvent = event.toLowerCase();
2222 if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) {
2223 warn$1(`Event "${lowerCaseEvent}" is emitted in component ` +
2224 `${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` +
2225 `Note that HTML attributes are case-insensitive and you cannot use ` +
2226 `v-on to listen to camelCase events when using in-DOM templates. ` +
2227 `You should probably use "${hyphenate(event)}" instead of "${event}".`);
2228 }
2229 }
2230 let handlerName;
2231 let handler = props[(handlerName = toHandlerKey(event))] ||
2232 // also try camelCase event handler (#2249)
2233 props[(handlerName = toHandlerKey(camelize(event)))];
2234 // for v-model update:xxx events, also trigger kebab-case equivalent
2235 // for props passed via kebab-case
2236 if (!handler && isModelListener) {
2237 handler = props[(handlerName = toHandlerKey(hyphenate(event)))];
2238 }
2239 if (handler) {
2240 callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
2241 }
2242 const onceHandler = props[handlerName + `Once`];
2243 if (onceHandler) {
2244 if (!instance.emitted) {
2245 instance.emitted = {};
2246 }
2247 else if (instance.emitted[handlerName]) {
2248 return;
2249 }
2250 instance.emitted[handlerName] = true;
2251 callWithAsyncErrorHandling(onceHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
2252 }
2253 }
2254 function normalizeEmitsOptions(comp, appContext, asMixin = false) {
2255 const cache = appContext.emitsCache;
2256 const cached = cache.get(comp);
2257 if (cached !== undefined) {
2258 return cached;
2259 }
2260 const raw = comp.emits;
2261 let normalized = {};
2262 // apply mixin/extends props
2263 let hasExtends = false;
2264 if (!isFunction(comp)) {
2265 const extendEmits = (raw) => {
2266 const normalizedFromExtend = normalizeEmitsOptions(raw, appContext, true);
2267 if (normalizedFromExtend) {
2268 hasExtends = true;
2269 extend(normalized, normalizedFromExtend);
2270 }
2271 };
2272 if (!asMixin && appContext.mixins.length) {
2273 appContext.mixins.forEach(extendEmits);
2274 }
2275 if (comp.extends) {
2276 extendEmits(comp.extends);
2277 }
2278 if (comp.mixins) {
2279 comp.mixins.forEach(extendEmits);
2280 }
2281 }
2282 if (!raw && !hasExtends) {
2283 cache.set(comp, null);
2284 return null;
2285 }
2286 if (isArray(raw)) {
2287 raw.forEach(key => (normalized[key] = null));
2288 }
2289 else {
2290 extend(normalized, raw);
2291 }
2292 cache.set(comp, normalized);
2293 return normalized;
2294 }
2295 // Check if an incoming prop key is a declared emit event listener.
2296 // e.g. With `emits: { click: null }`, props named `onClick` and `onclick` are
2297 // both considered matched listeners.
2298 function isEmitListener(options, key) {
2299 if (!options || !isOn(key)) {
2300 return false;
2301 }
2302 key = key.slice(2).replace(/Once$/, '');
2303 return (hasOwn(options, key[0].toLowerCase() + key.slice(1)) ||
2304 hasOwn(options, hyphenate(key)) ||
2305 hasOwn(options, key));
2306 }
2307
2308 /**
2309 * mark the current rendering instance for asset resolution (e.g.
2310 * resolveComponent, resolveDirective) during render
2311 */
2312 let currentRenderingInstance = null;
2313 let currentScopeId = null;
2314 /**
2315 * Note: rendering calls maybe nested. The function returns the parent rendering
2316 * instance if present, which should be restored after the render is done:
2317 *
2318 * ```js
2319 * const prev = setCurrentRenderingInstance(i)
2320 * // ...render
2321 * setCurrentRenderingInstance(prev)
2322 * ```
2323 */
2324 function setCurrentRenderingInstance(instance) {
2325 const prev = currentRenderingInstance;
2326 currentRenderingInstance = instance;
2327 currentScopeId = (instance && instance.type.__scopeId) || null;
2328 return prev;
2329 }
2330 /**
2331 * Set scope id when creating hoisted vnodes.
2332 * @private compiler helper
2333 */
2334 function pushScopeId(id) {
2335 currentScopeId = id;
2336 }
2337 /**
2338 * Technically we no longer need this after 3.0.8 but we need to keep the same
2339 * API for backwards compat w/ code generated by compilers.
2340 * @private
2341 */
2342 function popScopeId() {
2343 currentScopeId = null;
2344 }
2345 /**
2346 * Only for backwards compat
2347 * @private
2348 */
2349 const withScopeId = (_id) => withCtx;
2350 /**
2351 * Wrap a slot function to memoize current rendering instance
2352 * @private compiler helper
2353 */
2354 function withCtx(fn, ctx = currentRenderingInstance, isNonScopedSlot // false only
2355 ) {
2356 if (!ctx)
2357 return fn;
2358 // already normalized
2359 if (fn._n) {
2360 return fn;
2361 }
2362 const renderFnWithContext = (...args) => {
2363 // If a user calls a compiled slot inside a template expression (#1745), it
2364 // can mess up block tracking, so by default we disable block tracking and
2365 // force bail out when invoking a compiled slot (indicated by the ._d flag).
2366 // This isn't necessary if rendering a compiled `<slot>`, so we flip the
2367 // ._d flag off when invoking the wrapped fn inside `renderSlot`.
2368 if (renderFnWithContext._d) {
2369 setBlockTracking(-1);
2370 }
2371 const prevInstance = setCurrentRenderingInstance(ctx);
2372 const res = fn(...args);
2373 setCurrentRenderingInstance(prevInstance);
2374 if (renderFnWithContext._d) {
2375 setBlockTracking(1);
2376 }
2377 {
2378 devtoolsComponentUpdated(ctx);
2379 }
2380 return res;
2381 };
2382 // mark normalized to avoid duplicated wrapping
2383 renderFnWithContext._n = true;
2384 // mark this as compiled by default
2385 // this is used in vnode.ts -> normalizeChildren() to set the slot
2386 // rendering flag.
2387 renderFnWithContext._c = true;
2388 // disable block tracking by default
2389 renderFnWithContext._d = true;
2390 return renderFnWithContext;
2391 }
2392
2393 /**
2394 * dev only flag to track whether $attrs was used during render.
2395 * If $attrs was used during render then the warning for failed attrs
2396 * fallthrough can be suppressed.
2397 */
2398 let accessedAttrs = false;
2399 function markAttrsAccessed() {
2400 accessedAttrs = true;
2401 }
2402 function renderComponentRoot(instance) {
2403 const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx, inheritAttrs } = instance;
2404 let result;
2405 let fallthroughAttrs;
2406 const prev = setCurrentRenderingInstance(instance);
2407 {
2408 accessedAttrs = false;
2409 }
2410 try {
2411 if (vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */) {
2412 // withProxy is a proxy with a different `has` trap only for
2413 // runtime-compiled render functions using `with` block.
2414 const proxyToUse = withProxy || proxy;
2415 result = normalizeVNode(render.call(proxyToUse, proxyToUse, renderCache, props, setupState, data, ctx));
2416 fallthroughAttrs = attrs;
2417 }
2418 else {
2419 // functional
2420 const render = Component;
2421 // in dev, mark attrs accessed if optional props (attrs === props)
2422 if (true && attrs === props) {
2423 markAttrsAccessed();
2424 }
2425 result = normalizeVNode(render.length > 1
2426 ? render(props, true
2427 ? {
2428 get attrs() {
2429 markAttrsAccessed();
2430 return attrs;
2431 },
2432 slots,
2433 emit
2434 }
2435 : { attrs, slots, emit })
2436 : render(props, null /* we know it doesn't need it */));
2437 fallthroughAttrs = Component.props
2438 ? attrs
2439 : getFunctionalFallthrough(attrs);
2440 }
2441 }
2442 catch (err) {
2443 blockStack.length = 0;
2444 handleError(err, instance, 1 /* RENDER_FUNCTION */);
2445 result = createVNode(Comment);
2446 }
2447 // attr merging
2448 // in dev mode, comments are preserved, and it's possible for a template
2449 // to have comments along side the root element which makes it a fragment
2450 let root = result;
2451 let setRoot = undefined;
2452 if (result.patchFlag > 0 &&
2453 result.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
2454 [root, setRoot] = getChildRoot(result);
2455 }
2456 if (fallthroughAttrs && inheritAttrs !== false) {
2457 const keys = Object.keys(fallthroughAttrs);
2458 const { shapeFlag } = root;
2459 if (keys.length) {
2460 if (shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
2461 if (propsOptions && keys.some(isModelListener)) {
2462 // If a v-model listener (onUpdate:xxx) has a corresponding declared
2463 // prop, it indicates this component expects to handle v-model and
2464 // it should not fallthrough.
2465 // related: #1543, #1643, #1989
2466 fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
2467 }
2468 root = cloneVNode(root, fallthroughAttrs);
2469 }
2470 else if (!accessedAttrs && root.type !== Comment) {
2471 const allAttrs = Object.keys(attrs);
2472 const eventAttrs = [];
2473 const extraAttrs = [];
2474 for (let i = 0, l = allAttrs.length; i < l; i++) {
2475 const key = allAttrs[i];
2476 if (isOn(key)) {
2477 // ignore v-model handlers when they fail to fallthrough
2478 if (!isModelListener(key)) {
2479 // remove `on`, lowercase first letter to reflect event casing
2480 // accurately
2481 eventAttrs.push(key[2].toLowerCase() + key.slice(3));
2482 }
2483 }
2484 else {
2485 extraAttrs.push(key);
2486 }
2487 }
2488 if (extraAttrs.length) {
2489 warn$1(`Extraneous non-props attributes (` +
2490 `${extraAttrs.join(', ')}) ` +
2491 `were passed to component but could not be automatically inherited ` +
2492 `because component renders fragment or text root nodes.`);
2493 }
2494 if (eventAttrs.length) {
2495 warn$1(`Extraneous non-emits event listeners (` +
2496 `${eventAttrs.join(', ')}) ` +
2497 `were passed to component but could not be automatically inherited ` +
2498 `because component renders fragment or text root nodes. ` +
2499 `If the listener is intended to be a component custom event listener only, ` +
2500 `declare it using the "emits" option.`);
2501 }
2502 }
2503 }
2504 }
2505 // inherit directives
2506 if (vnode.dirs) {
2507 if (!isElementRoot(root)) {
2508 warn$1(`Runtime directive used on component with non-element root node. ` +
2509 `The directives will not function as intended.`);
2510 }
2511 root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
2512 }
2513 // inherit transition data
2514 if (vnode.transition) {
2515 if (!isElementRoot(root)) {
2516 warn$1(`Component inside <Transition> renders non-element root node ` +
2517 `that cannot be animated.`);
2518 }
2519 root.transition = vnode.transition;
2520 }
2521 if (setRoot) {
2522 setRoot(root);
2523 }
2524 else {
2525 result = root;
2526 }
2527 setCurrentRenderingInstance(prev);
2528 return result;
2529 }
2530 /**
2531 * dev only
2532 * In dev mode, template root level comments are rendered, which turns the
2533 * template into a fragment root, but we need to locate the single element
2534 * root for attrs and scope id processing.
2535 */
2536 const getChildRoot = (vnode) => {
2537 const rawChildren = vnode.children;
2538 const dynamicChildren = vnode.dynamicChildren;
2539 const childRoot = filterSingleRoot(rawChildren);
2540 if (!childRoot) {
2541 return [vnode, undefined];
2542 }
2543 const index = rawChildren.indexOf(childRoot);
2544 const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1;
2545 const setRoot = (updatedRoot) => {
2546 rawChildren[index] = updatedRoot;
2547 if (dynamicChildren) {
2548 if (dynamicIndex > -1) {
2549 dynamicChildren[dynamicIndex] = updatedRoot;
2550 }
2551 else if (updatedRoot.patchFlag > 0) {
2552 vnode.dynamicChildren = [...dynamicChildren, updatedRoot];
2553 }
2554 }
2555 };
2556 return [normalizeVNode(childRoot), setRoot];
2557 };
2558 function filterSingleRoot(children) {
2559 let singleRoot;
2560 for (let i = 0; i < children.length; i++) {
2561 const child = children[i];
2562 if (isVNode(child)) {
2563 // ignore user comment
2564 if (child.type !== Comment || child.children === 'v-if') {
2565 if (singleRoot) {
2566 // has more than 1 non-comment child, return now
2567 return;
2568 }
2569 else {
2570 singleRoot = child;
2571 }
2572 }
2573 }
2574 else {
2575 return;
2576 }
2577 }
2578 return singleRoot;
2579 }
2580 const getFunctionalFallthrough = (attrs) => {
2581 let res;
2582 for (const key in attrs) {
2583 if (key === 'class' || key === 'style' || isOn(key)) {
2584 (res || (res = {}))[key] = attrs[key];
2585 }
2586 }
2587 return res;
2588 };
2589 const filterModelListeners = (attrs, props) => {
2590 const res = {};
2591 for (const key in attrs) {
2592 if (!isModelListener(key) || !(key.slice(9) in props)) {
2593 res[key] = attrs[key];
2594 }
2595 }
2596 return res;
2597 };
2598 const isElementRoot = (vnode) => {
2599 return (vnode.shapeFlag & (6 /* COMPONENT */ | 1 /* ELEMENT */) ||
2600 vnode.type === Comment // potential v-if branch switch
2601 );
2602 };
2603 function shouldUpdateComponent(prevVNode, nextVNode, optimized) {
2604 const { props: prevProps, children: prevChildren, component } = prevVNode;
2605 const { props: nextProps, children: nextChildren, patchFlag } = nextVNode;
2606 const emits = component.emitsOptions;
2607 // Parent component's render function was hot-updated. Since this may have
2608 // caused the child component's slots content to have changed, we need to
2609 // force the child to update as well.
2610 if ((prevChildren || nextChildren) && isHmrUpdating) {
2611 return true;
2612 }
2613 // force child update for runtime directive or transition on component vnode.
2614 if (nextVNode.dirs || nextVNode.transition) {
2615 return true;
2616 }
2617 if (optimized && patchFlag >= 0) {
2618 if (patchFlag & 1024 /* DYNAMIC_SLOTS */) {
2619 // slot content that references values that might have changed,
2620 // e.g. in a v-for
2621 return true;
2622 }
2623 if (patchFlag & 16 /* FULL_PROPS */) {
2624 if (!prevProps) {
2625 return !!nextProps;
2626 }
2627 // presence of this flag indicates props are always non-null
2628 return hasPropsChanged(prevProps, nextProps, emits);
2629 }
2630 else if (patchFlag & 8 /* PROPS */) {
2631 const dynamicProps = nextVNode.dynamicProps;
2632 for (let i = 0; i < dynamicProps.length; i++) {
2633 const key = dynamicProps[i];
2634 if (nextProps[key] !== prevProps[key] &&
2635 !isEmitListener(emits, key)) {
2636 return true;
2637 }
2638 }
2639 }
2640 }
2641 else {
2642 // this path is only taken by manually written render functions
2643 // so presence of any children leads to a forced update
2644 if (prevChildren || nextChildren) {
2645 if (!nextChildren || !nextChildren.$stable) {
2646 return true;
2647 }
2648 }
2649 if (prevProps === nextProps) {
2650 return false;
2651 }
2652 if (!prevProps) {
2653 return !!nextProps;
2654 }
2655 if (!nextProps) {
2656 return true;
2657 }
2658 return hasPropsChanged(prevProps, nextProps, emits);
2659 }
2660 return false;
2661 }
2662 function hasPropsChanged(prevProps, nextProps, emitsOptions) {
2663 const nextKeys = Object.keys(nextProps);
2664 if (nextKeys.length !== Object.keys(prevProps).length) {
2665 return true;
2666 }
2667 for (let i = 0; i < nextKeys.length; i++) {
2668 const key = nextKeys[i];
2669 if (nextProps[key] !== prevProps[key] &&
2670 !isEmitListener(emitsOptions, key)) {
2671 return true;
2672 }
2673 }
2674 return false;
2675 }
2676 function updateHOCHostEl({ vnode, parent }, el // HostNode
2677 ) {
2678 while (parent && parent.subTree === vnode) {
2679 (vnode = parent.vnode).el = el;
2680 parent = parent.parent;
2681 }
2682 }
2683
2684 const isSuspense = (type) => type.__isSuspense;
2685 // Suspense exposes a component-like API, and is treated like a component
2686 // in the compiler, but internally it's a special built-in type that hooks
2687 // directly into the renderer.
2688 const SuspenseImpl = {
2689 name: 'Suspense',
2690 // In order to make Suspense tree-shakable, we need to avoid importing it
2691 // directly in the renderer. The renderer checks for the __isSuspense flag
2692 // on a vnode's type and calls the `process` method, passing in renderer
2693 // internals.
2694 __isSuspense: true,
2695 process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized,
2696 // platform-specific impl passed from renderer
2697 rendererInternals) {
2698 if (n1 == null) {
2699 mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals);
2700 }
2701 else {
2702 patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, rendererInternals);
2703 }
2704 },
2705 hydrate: hydrateSuspense,
2706 create: createSuspenseBoundary,
2707 normalize: normalizeSuspenseChildren
2708 };
2709 // Force-casted public typing for h and TSX props inference
2710 const Suspense = (SuspenseImpl );
2711 function triggerEvent(vnode, name) {
2712 const eventListener = vnode.props && vnode.props[name];
2713 if (isFunction(eventListener)) {
2714 eventListener();
2715 }
2716 }
2717 function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) {
2718 const { p: patch, o: { createElement } } = rendererInternals;
2719 const hiddenContainer = createElement('div');
2720 const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals));
2721 // start mounting the content subtree in an off-dom container
2722 patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds);
2723 // now check if we have encountered any async deps
2724 if (suspense.deps > 0) {
2725 // has async
2726 // invoke @fallback event
2727 triggerEvent(vnode, 'onPending');
2728 triggerEvent(vnode, 'onFallback');
2729 // mount the fallback tree
2730 patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2731 isSVG, slotScopeIds);
2732 setActiveBranch(suspense, vnode.ssFallback);
2733 }
2734 else {
2735 // Suspense has no async deps. Just resolve.
2736 suspense.resolve();
2737 }
2738 }
2739 function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) {
2740 const suspense = (n2.suspense = n1.suspense);
2741 suspense.vnode = n2;
2742 n2.el = n1.el;
2743 const newBranch = n2.ssContent;
2744 const newFallback = n2.ssFallback;
2745 const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense;
2746 if (pendingBranch) {
2747 suspense.pendingBranch = newBranch;
2748 if (isSameVNodeType(newBranch, pendingBranch)) {
2749 // same root type but content may have changed.
2750 patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2751 if (suspense.deps <= 0) {
2752 suspense.resolve();
2753 }
2754 else if (isInFallback) {
2755 patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2756 isSVG, slotScopeIds, optimized);
2757 setActiveBranch(suspense, newFallback);
2758 }
2759 }
2760 else {
2761 // toggled before pending tree is resolved
2762 suspense.pendingId++;
2763 if (isHydrating) {
2764 // if toggled before hydration is finished, the current DOM tree is
2765 // no longer valid. set it as the active branch so it will be unmounted
2766 // when resolved
2767 suspense.isHydrating = false;
2768 suspense.activeBranch = pendingBranch;
2769 }
2770 else {
2771 unmount(pendingBranch, parentComponent, suspense);
2772 }
2773 // increment pending ID. this is used to invalidate async callbacks
2774 // reset suspense state
2775 suspense.deps = 0;
2776 // discard effects from pending branch
2777 suspense.effects.length = 0;
2778 // discard previous container
2779 suspense.hiddenContainer = createElement('div');
2780 if (isInFallback) {
2781 // already in fallback state
2782 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2783 if (suspense.deps <= 0) {
2784 suspense.resolve();
2785 }
2786 else {
2787 patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2788 isSVG, slotScopeIds, optimized);
2789 setActiveBranch(suspense, newFallback);
2790 }
2791 }
2792 else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2793 // toggled "back" to current active branch
2794 patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2795 // force resolve
2796 suspense.resolve(true);
2797 }
2798 else {
2799 // switched to a 3rd branch
2800 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2801 if (suspense.deps <= 0) {
2802 suspense.resolve();
2803 }
2804 }
2805 }
2806 }
2807 else {
2808 if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2809 // root did not change, just normal patch
2810 patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2811 setActiveBranch(suspense, newBranch);
2812 }
2813 else {
2814 // root node toggled
2815 // invoke @pending event
2816 triggerEvent(n2, 'onPending');
2817 // mount pending branch in off-dom container
2818 suspense.pendingBranch = newBranch;
2819 suspense.pendingId++;
2820 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2821 if (suspense.deps <= 0) {
2822 // incoming branch has no async deps, resolve now.
2823 suspense.resolve();
2824 }
2825 else {
2826 const { timeout, pendingId } = suspense;
2827 if (timeout > 0) {
2828 setTimeout(() => {
2829 if (suspense.pendingId === pendingId) {
2830 suspense.fallback(newFallback);
2831 }
2832 }, timeout);
2833 }
2834 else if (timeout === 0) {
2835 suspense.fallback(newFallback);
2836 }
2837 }
2838 }
2839 }
2840 }
2841 let hasWarned = false;
2842 function createSuspenseBoundary(vnode, parent, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals, isHydrating = false) {
2843 /* istanbul ignore if */
2844 if (!hasWarned) {
2845 hasWarned = true;
2846 // @ts-ignore `console.info` cannot be null error
2847 console[console.info ? 'info' : 'log'](`<Suspense> is an experimental feature and its API will likely change.`);
2848 }
2849 const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals;
2850 const timeout = toNumber(vnode.props && vnode.props.timeout);
2851 const suspense = {
2852 vnode,
2853 parent,
2854 parentComponent,
2855 isSVG,
2856 container,
2857 hiddenContainer,
2858 anchor,
2859 deps: 0,
2860 pendingId: 0,
2861 timeout: typeof timeout === 'number' ? timeout : -1,
2862 activeBranch: null,
2863 pendingBranch: null,
2864 isInFallback: true,
2865 isHydrating,
2866 isUnmounted: false,
2867 effects: [],
2868 resolve(resume = false) {
2869 {
2870 if (!resume && !suspense.pendingBranch) {
2871 throw new Error(`suspense.resolve() is called without a pending branch.`);
2872 }
2873 if (suspense.isUnmounted) {
2874 throw new Error(`suspense.resolve() is called on an already unmounted suspense boundary.`);
2875 }
2876 }
2877 const { vnode, activeBranch, pendingBranch, pendingId, effects, parentComponent, container } = suspense;
2878 if (suspense.isHydrating) {
2879 suspense.isHydrating = false;
2880 }
2881 else if (!resume) {
2882 const delayEnter = activeBranch &&
2883 pendingBranch.transition &&
2884 pendingBranch.transition.mode === 'out-in';
2885 if (delayEnter) {
2886 activeBranch.transition.afterLeave = () => {
2887 if (pendingId === suspense.pendingId) {
2888 move(pendingBranch, container, anchor, 0 /* ENTER */);
2889 }
2890 };
2891 }
2892 // this is initial anchor on mount
2893 let { anchor } = suspense;
2894 // unmount current active tree
2895 if (activeBranch) {
2896 // if the fallback tree was mounted, it may have been moved
2897 // as part of a parent suspense. get the latest anchor for insertion
2898 anchor = next(activeBranch);
2899 unmount(activeBranch, parentComponent, suspense, true);
2900 }
2901 if (!delayEnter) {
2902 // move content from off-dom container to actual container
2903 move(pendingBranch, container, anchor, 0 /* ENTER */);
2904 }
2905 }
2906 setActiveBranch(suspense, pendingBranch);
2907 suspense.pendingBranch = null;
2908 suspense.isInFallback = false;
2909 // flush buffered effects
2910 // check if there is a pending parent suspense
2911 let parent = suspense.parent;
2912 let hasUnresolvedAncestor = false;
2913 while (parent) {
2914 if (parent.pendingBranch) {
2915 // found a pending parent suspense, merge buffered post jobs
2916 // into that parent
2917 parent.effects.push(...effects);
2918 hasUnresolvedAncestor = true;
2919 break;
2920 }
2921 parent = parent.parent;
2922 }
2923 // no pending parent suspense, flush all jobs
2924 if (!hasUnresolvedAncestor) {
2925 queuePostFlushCb(effects);
2926 }
2927 suspense.effects = [];
2928 // invoke @resolve event
2929 triggerEvent(vnode, 'onResolve');
2930 },
2931 fallback(fallbackVNode) {
2932 if (!suspense.pendingBranch) {
2933 return;
2934 }
2935 const { vnode, activeBranch, parentComponent, container, isSVG } = suspense;
2936 // invoke @fallback event
2937 triggerEvent(vnode, 'onFallback');
2938 const anchor = next(activeBranch);
2939 const mountFallback = () => {
2940 if (!suspense.isInFallback) {
2941 return;
2942 }
2943 // mount the fallback tree
2944 patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2945 isSVG, slotScopeIds, optimized);
2946 setActiveBranch(suspense, fallbackVNode);
2947 };
2948 const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in';
2949 if (delayEnter) {
2950 activeBranch.transition.afterLeave = mountFallback;
2951 }
2952 suspense.isInFallback = true;
2953 // unmount current active branch
2954 unmount(activeBranch, parentComponent, null, // no suspense so unmount hooks fire now
2955 true // shouldRemove
2956 );
2957 if (!delayEnter) {
2958 mountFallback();
2959 }
2960 },
2961 move(container, anchor, type) {
2962 suspense.activeBranch &&
2963 move(suspense.activeBranch, container, anchor, type);
2964 suspense.container = container;
2965 },
2966 next() {
2967 return suspense.activeBranch && next(suspense.activeBranch);
2968 },
2969 registerDep(instance, setupRenderEffect) {
2970 const isInPendingSuspense = !!suspense.pendingBranch;
2971 if (isInPendingSuspense) {
2972 suspense.deps++;
2973 }
2974 const hydratedEl = instance.vnode.el;
2975 instance
2976 .asyncDep.catch(err => {
2977 handleError(err, instance, 0 /* SETUP_FUNCTION */);
2978 })
2979 .then(asyncSetupResult => {
2980 // retry when the setup() promise resolves.
2981 // component may have been unmounted before resolve.
2982 if (instance.isUnmounted ||
2983 suspense.isUnmounted ||
2984 suspense.pendingId !== instance.suspenseId) {
2985 return;
2986 }
2987 // retry from this component
2988 instance.asyncResolved = true;
2989 const { vnode } = instance;
2990 {
2991 pushWarningContext(vnode);
2992 }
2993 handleSetupResult(instance, asyncSetupResult, false);
2994 if (hydratedEl) {
2995 // vnode may have been replaced if an update happened before the
2996 // async dep is resolved.
2997 vnode.el = hydratedEl;
2998 }
2999 const placeholder = !hydratedEl && instance.subTree.el;
3000 setupRenderEffect(instance, vnode,
3001 // component may have been moved before resolve.
3002 // if this is not a hydration, instance.subTree will be the comment
3003 // placeholder.
3004 parentNode(hydratedEl || instance.subTree.el),
3005 // anchor will not be used if this is hydration, so only need to
3006 // consider the comment placeholder case.
3007 hydratedEl ? null : next(instance.subTree), suspense, isSVG, optimized);
3008 if (placeholder) {
3009 remove(placeholder);
3010 }
3011 updateHOCHostEl(instance, vnode.el);
3012 {
3013 popWarningContext();
3014 }
3015 // only decrease deps count if suspense is not already resolved
3016 if (isInPendingSuspense && --suspense.deps === 0) {
3017 suspense.resolve();
3018 }
3019 });
3020 },
3021 unmount(parentSuspense, doRemove) {
3022 suspense.isUnmounted = true;
3023 if (suspense.activeBranch) {
3024 unmount(suspense.activeBranch, parentComponent, parentSuspense, doRemove);
3025 }
3026 if (suspense.pendingBranch) {
3027 unmount(suspense.pendingBranch, parentComponent, parentSuspense, doRemove);
3028 }
3029 }
3030 };
3031 return suspense;
3032 }
3033 function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals, hydrateNode) {
3034 /* eslint-disable no-restricted-globals */
3035 const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, node.parentNode, document.createElement('div'), null, isSVG, slotScopeIds, optimized, rendererInternals, true /* hydrating */));
3036 // there are two possible scenarios for server-rendered suspense:
3037 // - success: ssr content should be fully resolved
3038 // - failure: ssr content should be the fallback branch.
3039 // however, on the client we don't really know if it has failed or not
3040 // attempt to hydrate the DOM assuming it has succeeded, but we still
3041 // need to construct a suspense boundary first
3042 const result = hydrateNode(node, (suspense.pendingBranch = vnode.ssContent), parentComponent, suspense, slotScopeIds, optimized);
3043 if (suspense.deps === 0) {
3044 suspense.resolve();
3045 }
3046 return result;
3047 /* eslint-enable no-restricted-globals */
3048 }
3049 function normalizeSuspenseChildren(vnode) {
3050 const { shapeFlag, children } = vnode;
3051 const isSlotChildren = shapeFlag & 32 /* SLOTS_CHILDREN */;
3052 vnode.ssContent = normalizeSuspenseSlot(isSlotChildren ? children.default : children);
3053 vnode.ssFallback = isSlotChildren
3054 ? normalizeSuspenseSlot(children.fallback)
3055 : createVNode(Comment);
3056 }
3057 function normalizeSuspenseSlot(s) {
3058 let block;
3059 if (isFunction(s)) {
3060 const trackBlock = isBlockTreeEnabled && s._c;
3061 if (trackBlock) {
3062 // disableTracking: false
3063 // allow block tracking for compiled slots
3064 // (see ./componentRenderContext.ts)
3065 s._d = false;
3066 openBlock();
3067 }
3068 s = s();
3069 if (trackBlock) {
3070 s._d = true;
3071 block = currentBlock;
3072 closeBlock();
3073 }
3074 }
3075 if (isArray(s)) {
3076 const singleChild = filterSingleRoot(s);
3077 if (!singleChild) {
3078 warn$1(`<Suspense> slots expect a single root node.`);
3079 }
3080 s = singleChild;
3081 }
3082 s = normalizeVNode(s);
3083 if (block && !s.dynamicChildren) {
3084 s.dynamicChildren = block.filter(c => c !== s);
3085 }
3086 return s;
3087 }
3088 function queueEffectWithSuspense(fn, suspense) {
3089 if (suspense && suspense.pendingBranch) {
3090 if (isArray(fn)) {
3091 suspense.effects.push(...fn);
3092 }
3093 else {
3094 suspense.effects.push(fn);
3095 }
3096 }
3097 else {
3098 queuePostFlushCb(fn);
3099 }
3100 }
3101 function setActiveBranch(suspense, branch) {
3102 suspense.activeBranch = branch;
3103 const { vnode, parentComponent } = suspense;
3104 const el = (vnode.el = branch.el);
3105 // in case suspense is the root node of a component,
3106 // recursively update the HOC el
3107 if (parentComponent && parentComponent.subTree === vnode) {
3108 parentComponent.vnode.el = el;
3109 updateHOCHostEl(parentComponent, el);
3110 }
3111 }
3112
3113 function provide(key, value) {
3114 if (!currentInstance) {
3115 {
3116 warn$1(`provide() can only be used inside setup().`);
3117 }
3118 }
3119 else {
3120 let provides = currentInstance.provides;
3121 // by default an instance inherits its parent's provides object
3122 // but when it needs to provide values of its own, it creates its
3123 // own provides object using parent provides object as prototype.
3124 // this way in `inject` we can simply look up injections from direct
3125 // parent and let the prototype chain do the work.
3126 const parentProvides = currentInstance.parent && currentInstance.parent.provides;
3127 if (parentProvides === provides) {
3128 provides = currentInstance.provides = Object.create(parentProvides);
3129 }
3130 // TS doesn't allow symbol as index type
3131 provides[key] = value;
3132 }
3133 }
3134 function inject(key, defaultValue, treatDefaultAsFactory = false) {
3135 // fallback to `currentRenderingInstance` so that this can be called in
3136 // a functional component
3137 const instance = currentInstance || currentRenderingInstance;
3138 if (instance) {
3139 // #2400
3140 // to support `app.use` plugins,
3141 // fallback to appContext's `provides` if the instance is at root
3142 const provides = instance.parent == null
3143 ? instance.vnode.appContext && instance.vnode.appContext.provides
3144 : instance.parent.provides;
3145 if (provides && key in provides) {
3146 // TS doesn't allow symbol as index type
3147 return provides[key];
3148 }
3149 else if (arguments.length > 1) {
3150 return treatDefaultAsFactory && isFunction(defaultValue)
3151 ? defaultValue.call(instance.proxy)
3152 : defaultValue;
3153 }
3154 else {
3155 warn$1(`injection "${String(key)}" not found.`);
3156 }
3157 }
3158 else {
3159 warn$1(`inject() can only be used inside setup() or functional components.`);
3160 }
3161 }
3162
3163 // Simple effect.
3164 function watchEffect(effect, options) {
3165 return doWatch(effect, null, options);
3166 }
3167 function watchPostEffect(effect, options) {
3168 return doWatch(effect, null, (Object.assign(options || {}, { flush: 'post' })
3169 ));
3170 }
3171 function watchSyncEffect(effect, options) {
3172 return doWatch(effect, null, (Object.assign(options || {}, { flush: 'sync' })
3173 ));
3174 }
3175 // initial value for watchers to trigger on undefined initial values
3176 const INITIAL_WATCHER_VALUE = {};
3177 // implementation
3178 function watch(source, cb, options) {
3179 if (!isFunction(cb)) {
3180 warn$1(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
3181 `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
3182 `supports \`watch(source, cb, options?) signature.`);
3183 }
3184 return doWatch(source, cb, options);
3185 }
3186 function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EMPTY_OBJ) {
3187 if (!cb) {
3188 if (immediate !== undefined) {
3189 warn$1(`watch() "immediate" option is only respected when using the ` +
3190 `watch(source, callback, options?) signature.`);
3191 }
3192 if (deep !== undefined) {
3193 warn$1(`watch() "deep" option is only respected when using the ` +
3194 `watch(source, callback, options?) signature.`);
3195 }
3196 }
3197 const warnInvalidSource = (s) => {
3198 warn$1(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
3199 `a reactive object, or an array of these types.`);
3200 };
3201 const instance = currentInstance;
3202 let getter;
3203 let forceTrigger = false;
3204 let isMultiSource = false;
3205 if (isRef(source)) {
3206 getter = () => source.value;
3207 forceTrigger = isShallow(source);
3208 }
3209 else if (isReactive(source)) {
3210 getter = () => source;
3211 deep = true;
3212 }
3213 else if (isArray(source)) {
3214 isMultiSource = true;
3215 forceTrigger = source.some(isReactive);
3216 getter = () => source.map(s => {
3217 if (isRef(s)) {
3218 return s.value;
3219 }
3220 else if (isReactive(s)) {
3221 return traverse(s);
3222 }
3223 else if (isFunction(s)) {
3224 return callWithErrorHandling(s, instance, 2 /* WATCH_GETTER */);
3225 }
3226 else {
3227 warnInvalidSource(s);
3228 }
3229 });
3230 }
3231 else if (isFunction(source)) {
3232 if (cb) {
3233 // getter with cb
3234 getter = () => callWithErrorHandling(source, instance, 2 /* WATCH_GETTER */);
3235 }
3236 else {
3237 // no cb -> simple effect
3238 getter = () => {
3239 if (instance && instance.isUnmounted) {
3240 return;
3241 }
3242 if (cleanup) {
3243 cleanup();
3244 }
3245 return callWithAsyncErrorHandling(source, instance, 3 /* WATCH_CALLBACK */, [onCleanup]);
3246 };
3247 }
3248 }
3249 else {
3250 getter = NOOP;
3251 warnInvalidSource(source);
3252 }
3253 if (cb && deep) {
3254 const baseGetter = getter;
3255 getter = () => traverse(baseGetter());
3256 }
3257 let cleanup;
3258 let onCleanup = (fn) => {
3259 cleanup = effect.onStop = () => {
3260 callWithErrorHandling(fn, instance, 4 /* WATCH_CLEANUP */);
3261 };
3262 };
3263 let oldValue = isMultiSource ? [] : INITIAL_WATCHER_VALUE;
3264 const job = () => {
3265 if (!effect.active) {
3266 return;
3267 }
3268 if (cb) {
3269 // watch(source, cb)
3270 const newValue = effect.run();
3271 if (deep ||
3272 forceTrigger ||
3273 (isMultiSource
3274 ? newValue.some((v, i) => hasChanged(v, oldValue[i]))
3275 : hasChanged(newValue, oldValue)) ||
3276 (false )) {
3277 // cleanup before running cb again
3278 if (cleanup) {
3279 cleanup();
3280 }
3281 callWithAsyncErrorHandling(cb, instance, 3 /* WATCH_CALLBACK */, [
3282 newValue,
3283 // pass undefined as the old value when it's changed for the first time
3284 oldValue === INITIAL_WATCHER_VALUE ? undefined : oldValue,
3285 onCleanup
3286 ]);
3287 oldValue = newValue;
3288 }
3289 }
3290 else {
3291 // watchEffect
3292 effect.run();
3293 }
3294 };
3295 // important: mark the job as a watcher callback so that scheduler knows
3296 // it is allowed to self-trigger (#1727)
3297 job.allowRecurse = !!cb;
3298 let scheduler;
3299 if (flush === 'sync') {
3300 scheduler = job; // the scheduler function gets called directly
3301 }
3302 else if (flush === 'post') {
3303 scheduler = () => queuePostRenderEffect(job, instance && instance.suspense);
3304 }
3305 else {
3306 // default: 'pre'
3307 scheduler = () => {
3308 if (!instance || instance.isMounted) {
3309 queuePreFlushCb(job);
3310 }
3311 else {
3312 // with 'pre' option, the first call must happen before
3313 // the component is mounted so it is called synchronously.
3314 job();
3315 }
3316 };
3317 }
3318 const effect = new ReactiveEffect(getter, scheduler);
3319 {
3320 effect.onTrack = onTrack;
3321 effect.onTrigger = onTrigger;
3322 }
3323 // initial run
3324 if (cb) {
3325 if (immediate) {
3326 job();
3327 }
3328 else {
3329 oldValue = effect.run();
3330 }
3331 }
3332 else if (flush === 'post') {
3333 queuePostRenderEffect(effect.run.bind(effect), instance && instance.suspense);
3334 }
3335 else {
3336 effect.run();
3337 }
3338 return () => {
3339 effect.stop();
3340 if (instance && instance.scope) {
3341 remove(instance.scope.effects, effect);
3342 }
3343 };
3344 }
3345 // this.$watch
3346 function instanceWatch(source, value, options) {
3347 const publicThis = this.proxy;
3348 const getter = isString(source)
3349 ? source.includes('.')
3350 ? createPathGetter(publicThis, source)
3351 : () => publicThis[source]
3352 : source.bind(publicThis, publicThis);
3353 let cb;
3354 if (isFunction(value)) {
3355 cb = value;
3356 }
3357 else {
3358 cb = value.handler;
3359 options = value;
3360 }
3361 const cur = currentInstance;
3362 setCurrentInstance(this);
3363 const res = doWatch(getter, cb.bind(publicThis), options);
3364 if (cur) {
3365 setCurrentInstance(cur);
3366 }
3367 else {
3368 unsetCurrentInstance();
3369 }
3370 return res;
3371 }
3372 function createPathGetter(ctx, path) {
3373 const segments = path.split('.');
3374 return () => {
3375 let cur = ctx;
3376 for (let i = 0; i < segments.length && cur; i++) {
3377 cur = cur[segments[i]];
3378 }
3379 return cur;
3380 };
3381 }
3382 function traverse(value, seen) {
3383 if (!isObject(value) || value["__v_skip" /* SKIP */]) {
3384 return value;
3385 }
3386 seen = seen || new Set();
3387 if (seen.has(value)) {
3388 return value;
3389 }
3390 seen.add(value);
3391 if (isRef(value)) {
3392 traverse(value.value, seen);
3393 }
3394 else if (isArray(value)) {
3395 for (let i = 0; i < value.length; i++) {
3396 traverse(value[i], seen);
3397 }
3398 }
3399 else if (isSet(value) || isMap(value)) {
3400 value.forEach((v) => {
3401 traverse(v, seen);
3402 });
3403 }
3404 else if (isPlainObject(value)) {
3405 for (const key in value) {
3406 traverse(value[key], seen);
3407 }
3408 }
3409 return value;
3410 }
3411
3412 function useTransitionState() {
3413 const state = {
3414 isMounted: false,
3415 isLeaving: false,
3416 isUnmounting: false,
3417 leavingVNodes: new Map()
3418 };
3419 onMounted(() => {
3420 state.isMounted = true;
3421 });
3422 onBeforeUnmount(() => {
3423 state.isUnmounting = true;
3424 });
3425 return state;
3426 }
3427 const TransitionHookValidator = [Function, Array];
3428 const BaseTransitionImpl = {
3429 name: `BaseTransition`,
3430 props: {
3431 mode: String,
3432 appear: Boolean,
3433 persisted: Boolean,
3434 // enter
3435 onBeforeEnter: TransitionHookValidator,
3436 onEnter: TransitionHookValidator,
3437 onAfterEnter: TransitionHookValidator,
3438 onEnterCancelled: TransitionHookValidator,
3439 // leave
3440 onBeforeLeave: TransitionHookValidator,
3441 onLeave: TransitionHookValidator,
3442 onAfterLeave: TransitionHookValidator,
3443 onLeaveCancelled: TransitionHookValidator,
3444 // appear
3445 onBeforeAppear: TransitionHookValidator,
3446 onAppear: TransitionHookValidator,
3447 onAfterAppear: TransitionHookValidator,
3448 onAppearCancelled: TransitionHookValidator
3449 },
3450 setup(props, { slots }) {
3451 const instance = getCurrentInstance();
3452 const state = useTransitionState();
3453 let prevTransitionKey;
3454 return () => {
3455 const children = slots.default && getTransitionRawChildren(slots.default(), true);
3456 if (!children || !children.length) {
3457 return;
3458 }
3459 // warn multiple elements
3460 if (children.length > 1) {
3461 warn$1('<transition> can only be used on a single element or component. Use ' +
3462 '<transition-group> for lists.');
3463 }
3464 // there's no need to track reactivity for these props so use the raw
3465 // props for a bit better perf
3466 const rawProps = toRaw(props);
3467 const { mode } = rawProps;
3468 // check mode
3469 if (mode &&
3470 mode !== 'in-out' && mode !== 'out-in' && mode !== 'default') {
3471 warn$1(`invalid <transition> mode: ${mode}`);
3472 }
3473 // at this point children has a guaranteed length of 1.
3474 const child = children[0];
3475 if (state.isLeaving) {
3476 return emptyPlaceholder(child);
3477 }
3478 // in the case of <transition><keep-alive/></transition>, we need to
3479 // compare the type of the kept-alive children.
3480 const innerChild = getKeepAliveChild(child);
3481 if (!innerChild) {
3482 return emptyPlaceholder(child);
3483 }
3484 const enterHooks = resolveTransitionHooks(innerChild, rawProps, state, instance);
3485 setTransitionHooks(innerChild, enterHooks);
3486 const oldChild = instance.subTree;
3487 const oldInnerChild = oldChild && getKeepAliveChild(oldChild);
3488 let transitionKeyChanged = false;
3489 const { getTransitionKey } = innerChild.type;
3490 if (getTransitionKey) {
3491 const key = getTransitionKey();
3492 if (prevTransitionKey === undefined) {
3493 prevTransitionKey = key;
3494 }
3495 else if (key !== prevTransitionKey) {
3496 prevTransitionKey = key;
3497 transitionKeyChanged = true;
3498 }
3499 }
3500 // handle mode
3501 if (oldInnerChild &&
3502 oldInnerChild.type !== Comment &&
3503 (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)) {
3504 const leavingHooks = resolveTransitionHooks(oldInnerChild, rawProps, state, instance);
3505 // update old tree's hooks in case of dynamic transition
3506 setTransitionHooks(oldInnerChild, leavingHooks);
3507 // switching between different views
3508 if (mode === 'out-in') {
3509 state.isLeaving = true;
3510 // return placeholder node and queue update when leave finishes
3511 leavingHooks.afterLeave = () => {
3512 state.isLeaving = false;
3513 instance.update();
3514 };
3515 return emptyPlaceholder(child);
3516 }
3517 else if (mode === 'in-out' && innerChild.type !== Comment) {
3518 leavingHooks.delayLeave = (el, earlyRemove, delayedLeave) => {
3519 const leavingVNodesCache = getLeavingNodesForType(state, oldInnerChild);
3520 leavingVNodesCache[String(oldInnerChild.key)] = oldInnerChild;
3521 // early removal callback
3522 el._leaveCb = () => {
3523 earlyRemove();
3524 el._leaveCb = undefined;
3525 delete enterHooks.delayedLeave;
3526 };
3527 enterHooks.delayedLeave = delayedLeave;
3528 };
3529 }
3530 }
3531 return child;
3532 };
3533 }
3534 };
3535 // export the public type for h/tsx inference
3536 // also to avoid inline import() in generated d.ts files
3537 const BaseTransition = BaseTransitionImpl;
3538 function getLeavingNodesForType(state, vnode) {
3539 const { leavingVNodes } = state;
3540 let leavingVNodesCache = leavingVNodes.get(vnode.type);
3541 if (!leavingVNodesCache) {
3542 leavingVNodesCache = Object.create(null);
3543 leavingVNodes.set(vnode.type, leavingVNodesCache);
3544 }
3545 return leavingVNodesCache;
3546 }
3547 // The transition hooks are attached to the vnode as vnode.transition
3548 // and will be called at appropriate timing in the renderer.
3549 function resolveTransitionHooks(vnode, props, state, instance) {
3550 const { appear, mode, persisted = false, onBeforeEnter, onEnter, onAfterEnter, onEnterCancelled, onBeforeLeave, onLeave, onAfterLeave, onLeaveCancelled, onBeforeAppear, onAppear, onAfterAppear, onAppearCancelled } = props;
3551 const key = String(vnode.key);
3552 const leavingVNodesCache = getLeavingNodesForType(state, vnode);
3553 const callHook = (hook, args) => {
3554 hook &&
3555 callWithAsyncErrorHandling(hook, instance, 9 /* TRANSITION_HOOK */, args);
3556 };
3557 const hooks = {
3558 mode,
3559 persisted,
3560 beforeEnter(el) {
3561 let hook = onBeforeEnter;
3562 if (!state.isMounted) {
3563 if (appear) {
3564 hook = onBeforeAppear || onBeforeEnter;
3565 }
3566 else {
3567 return;
3568 }
3569 }
3570 // for same element (v-show)
3571 if (el._leaveCb) {
3572 el._leaveCb(true /* cancelled */);
3573 }
3574 // for toggled element with same key (v-if)
3575 const leavingVNode = leavingVNodesCache[key];
3576 if (leavingVNode &&
3577 isSameVNodeType(vnode, leavingVNode) &&
3578 leavingVNode.el._leaveCb) {
3579 // force early removal (not cancelled)
3580 leavingVNode.el._leaveCb();
3581 }
3582 callHook(hook, [el]);
3583 },
3584 enter(el) {
3585 let hook = onEnter;
3586 let afterHook = onAfterEnter;
3587 let cancelHook = onEnterCancelled;
3588 if (!state.isMounted) {
3589 if (appear) {
3590 hook = onAppear || onEnter;
3591 afterHook = onAfterAppear || onAfterEnter;
3592 cancelHook = onAppearCancelled || onEnterCancelled;
3593 }
3594 else {
3595 return;
3596 }
3597 }
3598 let called = false;
3599 const done = (el._enterCb = (cancelled) => {
3600 if (called)
3601 return;
3602 called = true;
3603 if (cancelled) {
3604 callHook(cancelHook, [el]);
3605 }
3606 else {
3607 callHook(afterHook, [el]);
3608 }
3609 if (hooks.delayedLeave) {
3610 hooks.delayedLeave();
3611 }
3612 el._enterCb = undefined;
3613 });
3614 if (hook) {
3615 hook(el, done);
3616 if (hook.length <= 1) {
3617 done();
3618 }
3619 }
3620 else {
3621 done();
3622 }
3623 },
3624 leave(el, remove) {
3625 const key = String(vnode.key);
3626 if (el._enterCb) {
3627 el._enterCb(true /* cancelled */);
3628 }
3629 if (state.isUnmounting) {
3630 return remove();
3631 }
3632 callHook(onBeforeLeave, [el]);
3633 let called = false;
3634 const done = (el._leaveCb = (cancelled) => {
3635 if (called)
3636 return;
3637 called = true;
3638 remove();
3639 if (cancelled) {
3640 callHook(onLeaveCancelled, [el]);
3641 }
3642 else {
3643 callHook(onAfterLeave, [el]);
3644 }
3645 el._leaveCb = undefined;
3646 if (leavingVNodesCache[key] === vnode) {
3647 delete leavingVNodesCache[key];
3648 }
3649 });
3650 leavingVNodesCache[key] = vnode;
3651 if (onLeave) {
3652 onLeave(el, done);
3653 if (onLeave.length <= 1) {
3654 done();
3655 }
3656 }
3657 else {
3658 done();
3659 }
3660 },
3661 clone(vnode) {
3662 return resolveTransitionHooks(vnode, props, state, instance);
3663 }
3664 };
3665 return hooks;
3666 }
3667 // the placeholder really only handles one special case: KeepAlive
3668 // in the case of a KeepAlive in a leave phase we need to return a KeepAlive
3669 // placeholder with empty content to avoid the KeepAlive instance from being
3670 // unmounted.
3671 function emptyPlaceholder(vnode) {
3672 if (isKeepAlive(vnode)) {
3673 vnode = cloneVNode(vnode);
3674 vnode.children = null;
3675 return vnode;
3676 }
3677 }
3678 function getKeepAliveChild(vnode) {
3679 return isKeepAlive(vnode)
3680 ? vnode.children
3681 ? vnode.children[0]
3682 : undefined
3683 : vnode;
3684 }
3685 function setTransitionHooks(vnode, hooks) {
3686 if (vnode.shapeFlag & 6 /* COMPONENT */ && vnode.component) {
3687 setTransitionHooks(vnode.component.subTree, hooks);
3688 }
3689 else if (vnode.shapeFlag & 128 /* SUSPENSE */) {
3690 vnode.ssContent.transition = hooks.clone(vnode.ssContent);
3691 vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
3692 }
3693 else {
3694 vnode.transition = hooks;
3695 }
3696 }
3697 function getTransitionRawChildren(children, keepComment = false) {
3698 let ret = [];
3699 let keyedFragmentCount = 0;
3700 for (let i = 0; i < children.length; i++) {
3701 const child = children[i];
3702 // handle fragment children case, e.g. v-for
3703 if (child.type === Fragment) {
3704 if (child.patchFlag & 128 /* KEYED_FRAGMENT */)
3705 keyedFragmentCount++;
3706 ret = ret.concat(getTransitionRawChildren(child.children, keepComment));
3707 }
3708 // comment placeholders should be skipped, e.g. v-if
3709 else if (keepComment || child.type !== Comment) {
3710 ret.push(child);
3711 }
3712 }
3713 // #1126 if a transition children list contains multiple sub fragments, these
3714 // fragments will be merged into a flat children array. Since each v-for
3715 // fragment may contain different static bindings inside, we need to de-op
3716 // these children to force full diffs to ensure correct behavior.
3717 if (keyedFragmentCount > 1) {
3718 for (let i = 0; i < ret.length; i++) {
3719 ret[i].patchFlag = -2 /* BAIL */;
3720 }
3721 }
3722 return ret;
3723 }
3724
3725 // implementation, close to no-op
3726 function defineComponent(options) {
3727 return isFunction(options) ? { setup: options, name: options.name } : options;
3728 }
3729
3730 const isAsyncWrapper = (i) => !!i.type.__asyncLoader;
3731 function defineAsyncComponent(source) {
3732 if (isFunction(source)) {
3733 source = { loader: source };
3734 }
3735 const { loader, loadingComponent, errorComponent, delay = 200, timeout, // undefined = never times out
3736 suspensible = true, onError: userOnError } = source;
3737 let pendingRequest = null;
3738 let resolvedComp;
3739 let retries = 0;
3740 const retry = () => {
3741 retries++;
3742 pendingRequest = null;
3743 return load();
3744 };
3745 const load = () => {
3746 let thisRequest;
3747 return (pendingRequest ||
3748 (thisRequest = pendingRequest =
3749 loader()
3750 .catch(err => {
3751 err = err instanceof Error ? err : new Error(String(err));
3752 if (userOnError) {
3753 return new Promise((resolve, reject) => {
3754 const userRetry = () => resolve(retry());
3755 const userFail = () => reject(err);
3756 userOnError(err, userRetry, userFail, retries + 1);
3757 });
3758 }
3759 else {
3760 throw err;
3761 }
3762 })
3763 .then((comp) => {
3764 if (thisRequest !== pendingRequest && pendingRequest) {
3765 return pendingRequest;
3766 }
3767 if (!comp) {
3768 warn$1(`Async component loader resolved to undefined. ` +
3769 `If you are using retry(), make sure to return its return value.`);
3770 }
3771 // interop module default
3772 if (comp &&
3773 (comp.__esModule || comp[Symbol.toStringTag] === 'Module')) {
3774 comp = comp.default;
3775 }
3776 if (comp && !isObject(comp) && !isFunction(comp)) {
3777 throw new Error(`Invalid async component load result: ${comp}`);
3778 }
3779 resolvedComp = comp;
3780 return comp;
3781 })));
3782 };
3783 return defineComponent({
3784 name: 'AsyncComponentWrapper',
3785 __asyncLoader: load,
3786 get __asyncResolved() {
3787 return resolvedComp;
3788 },
3789 setup() {
3790 const instance = currentInstance;
3791 // already resolved
3792 if (resolvedComp) {
3793 return () => createInnerComp(resolvedComp, instance);
3794 }
3795 const onError = (err) => {
3796 pendingRequest = null;
3797 handleError(err, instance, 13 /* ASYNC_COMPONENT_LOADER */, !errorComponent /* do not throw in dev if user provided error component */);
3798 };
3799 // suspense-controlled or SSR.
3800 if ((suspensible && instance.suspense) ||
3801 (false )) {
3802 return load()
3803 .then(comp => {
3804 return () => createInnerComp(comp, instance);
3805 })
3806 .catch(err => {
3807 onError(err);
3808 return () => errorComponent
3809 ? createVNode(errorComponent, {
3810 error: err
3811 })
3812 : null;
3813 });
3814 }
3815 const loaded = ref(false);
3816 const error = ref();
3817 const delayed = ref(!!delay);
3818 if (delay) {
3819 setTimeout(() => {
3820 delayed.value = false;
3821 }, delay);
3822 }
3823 if (timeout != null) {
3824 setTimeout(() => {
3825 if (!loaded.value && !error.value) {
3826 const err = new Error(`Async component timed out after ${timeout}ms.`);
3827 onError(err);
3828 error.value = err;
3829 }
3830 }, timeout);
3831 }
3832 load()
3833 .then(() => {
3834 loaded.value = true;
3835 if (instance.parent && isKeepAlive(instance.parent.vnode)) {
3836 // parent is keep-alive, force update so the loaded component's
3837 // name is taken into account
3838 queueJob(instance.parent.update);
3839 }
3840 })
3841 .catch(err => {
3842 onError(err);
3843 error.value = err;
3844 });
3845 return () => {
3846 if (loaded.value && resolvedComp) {
3847 return createInnerComp(resolvedComp, instance);
3848 }
3849 else if (error.value && errorComponent) {
3850 return createVNode(errorComponent, {
3851 error: error.value
3852 });
3853 }
3854 else if (loadingComponent && !delayed.value) {
3855 return createVNode(loadingComponent);
3856 }
3857 };
3858 }
3859 });
3860 }
3861 function createInnerComp(comp, { vnode: { ref, props, children } }) {
3862 const vnode = createVNode(comp, props, children);
3863 // ensure inner component inherits the async wrapper's ref owner
3864 vnode.ref = ref;
3865 return vnode;
3866 }
3867
3868 const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
3869 const KeepAliveImpl = {
3870 name: `KeepAlive`,
3871 // Marker for special handling inside the renderer. We are not using a ===
3872 // check directly on KeepAlive in the renderer, because importing it directly
3873 // would prevent it from being tree-shaken.
3874 __isKeepAlive: true,
3875 props: {
3876 include: [String, RegExp, Array],
3877 exclude: [String, RegExp, Array],
3878 max: [String, Number]
3879 },
3880 setup(props, { slots }) {
3881 const instance = getCurrentInstance();
3882 // KeepAlive communicates with the instantiated renderer via the
3883 // ctx where the renderer passes in its internals,
3884 // and the KeepAlive instance exposes activate/deactivate implementations.
3885 // The whole point of this is to avoid importing KeepAlive directly in the
3886 // renderer to facilitate tree-shaking.
3887 const sharedContext = instance.ctx;
3888 // if the internal renderer is not registered, it indicates that this is server-side rendering,
3889 // for KeepAlive, we just need to render its children
3890 if (!sharedContext.renderer) {
3891 return slots.default;
3892 }
3893 const cache = new Map();
3894 const keys = new Set();
3895 let current = null;
3896 {
3897 instance.__v_cache = cache;
3898 }
3899 const parentSuspense = instance.suspense;
3900 const { renderer: { p: patch, m: move, um: _unmount, o: { createElement } } } = sharedContext;
3901 const storageContainer = createElement('div');
3902 sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => {
3903 const instance = vnode.component;
3904 move(vnode, container, anchor, 0 /* ENTER */, parentSuspense);
3905 // in case props have changed
3906 patch(instance.vnode, vnode, container, anchor, instance, parentSuspense, isSVG, vnode.slotScopeIds, optimized);
3907 queuePostRenderEffect(() => {
3908 instance.isDeactivated = false;
3909 if (instance.a) {
3910 invokeArrayFns(instance.a);
3911 }
3912 const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
3913 if (vnodeHook) {
3914 invokeVNodeHook(vnodeHook, instance.parent, vnode);
3915 }
3916 }, parentSuspense);
3917 {
3918 // Update components tree
3919 devtoolsComponentAdded(instance);
3920 }
3921 };
3922 sharedContext.deactivate = (vnode) => {
3923 const instance = vnode.component;
3924 move(vnode, storageContainer, null, 1 /* LEAVE */, parentSuspense);
3925 queuePostRenderEffect(() => {
3926 if (instance.da) {
3927 invokeArrayFns(instance.da);
3928 }
3929 const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
3930 if (vnodeHook) {
3931 invokeVNodeHook(vnodeHook, instance.parent, vnode);
3932 }
3933 instance.isDeactivated = true;
3934 }, parentSuspense);
3935 {
3936 // Update components tree
3937 devtoolsComponentAdded(instance);
3938 }
3939 };
3940 function unmount(vnode) {
3941 // reset the shapeFlag so it can be properly unmounted
3942 resetShapeFlag(vnode);
3943 _unmount(vnode, instance, parentSuspense, true);
3944 }
3945 function pruneCache(filter) {
3946 cache.forEach((vnode, key) => {
3947 const name = getComponentName(vnode.type);
3948 if (name && (!filter || !filter(name))) {
3949 pruneCacheEntry(key);
3950 }
3951 });
3952 }
3953 function pruneCacheEntry(key) {
3954 const cached = cache.get(key);
3955 if (!current || cached.type !== current.type) {
3956 unmount(cached);
3957 }
3958 else if (current) {
3959 // current active instance should no longer be kept-alive.
3960 // we can't unmount it now but it might be later, so reset its flag now.
3961 resetShapeFlag(current);
3962 }
3963 cache.delete(key);
3964 keys.delete(key);
3965 }
3966 // prune cache on include/exclude prop change
3967 watch(() => [props.include, props.exclude], ([include, exclude]) => {
3968 include && pruneCache(name => matches(include, name));
3969 exclude && pruneCache(name => !matches(exclude, name));
3970 },
3971 // prune post-render after `current` has been updated
3972 { flush: 'post', deep: true });
3973 // cache sub tree after render
3974 let pendingCacheKey = null;
3975 const cacheSubtree = () => {
3976 // fix #1621, the pendingCacheKey could be 0
3977 if (pendingCacheKey != null) {
3978 cache.set(pendingCacheKey, getInnerChild(instance.subTree));
3979 }
3980 };
3981 onMounted(cacheSubtree);
3982 onUpdated(cacheSubtree);
3983 onBeforeUnmount(() => {
3984 cache.forEach(cached => {
3985 const { subTree, suspense } = instance;
3986 const vnode = getInnerChild(subTree);
3987 if (cached.type === vnode.type) {
3988 // current instance will be unmounted as part of keep-alive's unmount
3989 resetShapeFlag(vnode);
3990 // but invoke its deactivated hook here
3991 const da = vnode.component.da;
3992 da && queuePostRenderEffect(da, suspense);
3993 return;
3994 }
3995 unmount(cached);
3996 });
3997 });
3998 return () => {
3999 pendingCacheKey = null;
4000 if (!slots.default) {
4001 return null;
4002 }
4003 const children = slots.default();
4004 const rawVNode = children[0];
4005 if (children.length > 1) {
4006 {
4007 warn$1(`KeepAlive should contain exactly one component child.`);
4008 }
4009 current = null;
4010 return children;
4011 }
4012 else if (!isVNode(rawVNode) ||
4013 (!(rawVNode.shapeFlag & 4 /* STATEFUL_COMPONENT */) &&
4014 !(rawVNode.shapeFlag & 128 /* SUSPENSE */))) {
4015 current = null;
4016 return rawVNode;
4017 }
4018 let vnode = getInnerChild(rawVNode);
4019 const comp = vnode.type;
4020 // for async components, name check should be based in its loaded
4021 // inner component if available
4022 const name = getComponentName(isAsyncWrapper(vnode)
4023 ? vnode.type.__asyncResolved || {}
4024 : comp);
4025 const { include, exclude, max } = props;
4026 if ((include && (!name || !matches(include, name))) ||
4027 (exclude && name && matches(exclude, name))) {
4028 current = vnode;
4029 return rawVNode;
4030 }
4031 const key = vnode.key == null ? comp : vnode.key;
4032 const cachedVNode = cache.get(key);
4033 // clone vnode if it's reused because we are going to mutate it
4034 if (vnode.el) {
4035 vnode = cloneVNode(vnode);
4036 if (rawVNode.shapeFlag & 128 /* SUSPENSE */) {
4037 rawVNode.ssContent = vnode;
4038 }
4039 }
4040 // #1513 it's possible for the returned vnode to be cloned due to attr
4041 // fallthrough or scopeId, so the vnode here may not be the final vnode
4042 // that is mounted. Instead of caching it directly, we store the pending
4043 // key and cache `instance.subTree` (the normalized vnode) in
4044 // beforeMount/beforeUpdate hooks.
4045 pendingCacheKey = key;
4046 if (cachedVNode) {
4047 // copy over mounted state
4048 vnode.el = cachedVNode.el;
4049 vnode.component = cachedVNode.component;
4050 if (vnode.transition) {
4051 // recursively update transition hooks on subTree
4052 setTransitionHooks(vnode, vnode.transition);
4053 }
4054 // avoid vnode being mounted as fresh
4055 vnode.shapeFlag |= 512 /* COMPONENT_KEPT_ALIVE */;
4056 // make this key the freshest
4057 keys.delete(key);
4058 keys.add(key);
4059 }
4060 else {
4061 keys.add(key);
4062 // prune oldest entry
4063 if (max && keys.size > parseInt(max, 10)) {
4064 pruneCacheEntry(keys.values().next().value);
4065 }
4066 }
4067 // avoid vnode being unmounted
4068 vnode.shapeFlag |= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */;
4069 current = vnode;
4070 return rawVNode;
4071 };
4072 }
4073 };
4074 // export the public type for h/tsx inference
4075 // also to avoid inline import() in generated d.ts files
4076 const KeepAlive = KeepAliveImpl;
4077 function matches(pattern, name) {
4078 if (isArray(pattern)) {
4079 return pattern.some((p) => matches(p, name));
4080 }
4081 else if (isString(pattern)) {
4082 return pattern.split(',').includes(name);
4083 }
4084 else if (pattern.test) {
4085 return pattern.test(name);
4086 }
4087 /* istanbul ignore next */
4088 return false;
4089 }
4090 function onActivated(hook, target) {
4091 registerKeepAliveHook(hook, "a" /* ACTIVATED */, target);
4092 }
4093 function onDeactivated(hook, target) {
4094 registerKeepAliveHook(hook, "da" /* DEACTIVATED */, target);
4095 }
4096 function registerKeepAliveHook(hook, type, target = currentInstance) {
4097 // cache the deactivate branch check wrapper for injected hooks so the same
4098 // hook can be properly deduped by the scheduler. "__wdc" stands for "with
4099 // deactivation check".
4100 const wrappedHook = hook.__wdc ||
4101 (hook.__wdc = () => {
4102 // only fire the hook if the target instance is NOT in a deactivated branch.
4103 let current = target;
4104 while (current) {
4105 if (current.isDeactivated) {
4106 return;
4107 }
4108 current = current.parent;
4109 }
4110 return hook();
4111 });
4112 injectHook(type, wrappedHook, target);
4113 // In addition to registering it on the target instance, we walk up the parent
4114 // chain and register it on all ancestor instances that are keep-alive roots.
4115 // This avoids the need to walk the entire component tree when invoking these
4116 // hooks, and more importantly, avoids the need to track child components in
4117 // arrays.
4118 if (target) {
4119 let current = target.parent;
4120 while (current && current.parent) {
4121 if (isKeepAlive(current.parent.vnode)) {
4122 injectToKeepAliveRoot(wrappedHook, type, target, current);
4123 }
4124 current = current.parent;
4125 }
4126 }
4127 }
4128 function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
4129 // injectHook wraps the original for error handling, so make sure to remove
4130 // the wrapped version.
4131 const injected = injectHook(type, hook, keepAliveRoot, true /* prepend */);
4132 onUnmounted(() => {
4133 remove(keepAliveRoot[type], injected);
4134 }, target);
4135 }
4136 function resetShapeFlag(vnode) {
4137 let shapeFlag = vnode.shapeFlag;
4138 if (shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
4139 shapeFlag -= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */;
4140 }
4141 if (shapeFlag & 512 /* COMPONENT_KEPT_ALIVE */) {
4142 shapeFlag -= 512 /* COMPONENT_KEPT_ALIVE */;
4143 }
4144 vnode.shapeFlag = shapeFlag;
4145 }
4146 function getInnerChild(vnode) {
4147 return vnode.shapeFlag & 128 /* SUSPENSE */ ? vnode.ssContent : vnode;
4148 }
4149
4150 function injectHook(type, hook, target = currentInstance, prepend = false) {
4151 if (target) {
4152 const hooks = target[type] || (target[type] = []);
4153 // cache the error handling wrapper for injected hooks so the same hook
4154 // can be properly deduped by the scheduler. "__weh" stands for "with error
4155 // handling".
4156 const wrappedHook = hook.__weh ||
4157 (hook.__weh = (...args) => {
4158 if (target.isUnmounted) {
4159 return;
4160 }
4161 // disable tracking inside all lifecycle hooks
4162 // since they can potentially be called inside effects.
4163 pauseTracking();
4164 // Set currentInstance during hook invocation.
4165 // This assumes the hook does not synchronously trigger other hooks, which
4166 // can only be false when the user does something really funky.
4167 setCurrentInstance(target);
4168 const res = callWithAsyncErrorHandling(hook, target, type, args);
4169 unsetCurrentInstance();
4170 resetTracking();
4171 return res;
4172 });
4173 if (prepend) {
4174 hooks.unshift(wrappedHook);
4175 }
4176 else {
4177 hooks.push(wrappedHook);
4178 }
4179 return wrappedHook;
4180 }
4181 else {
4182 const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
4183 warn$1(`${apiName} is called when there is no active component instance to be ` +
4184 `associated with. ` +
4185 `Lifecycle injection APIs can only be used during execution of setup().` +
4186 (` If you are using async setup(), make sure to register lifecycle ` +
4187 `hooks before the first await statement.`
4188 ));
4189 }
4190 }
4191 const createHook = (lifecycle) => (hook, target = currentInstance) =>
4192 // post-create lifecycle registrations are noops during SSR (except for serverPrefetch)
4193 (!isInSSRComponentSetup || lifecycle === "sp" /* SERVER_PREFETCH */) &&
4194 injectHook(lifecycle, hook, target);
4195 const onBeforeMount = createHook("bm" /* BEFORE_MOUNT */);
4196 const onMounted = createHook("m" /* MOUNTED */);
4197 const onBeforeUpdate = createHook("bu" /* BEFORE_UPDATE */);
4198 const onUpdated = createHook("u" /* UPDATED */);
4199 const onBeforeUnmount = createHook("bum" /* BEFORE_UNMOUNT */);
4200 const onUnmounted = createHook("um" /* UNMOUNTED */);
4201 const onServerPrefetch = createHook("sp" /* SERVER_PREFETCH */);
4202 const onRenderTriggered = createHook("rtg" /* RENDER_TRIGGERED */);
4203 const onRenderTracked = createHook("rtc" /* RENDER_TRACKED */);
4204 function onErrorCaptured(hook, target = currentInstance) {
4205 injectHook("ec" /* ERROR_CAPTURED */, hook, target);
4206 }
4207
4208 function createDuplicateChecker() {
4209 const cache = Object.create(null);
4210 return (type, key) => {
4211 if (cache[key]) {
4212 warn$1(`${type} property "${key}" is already defined in ${cache[key]}.`);
4213 }
4214 else {
4215 cache[key] = type;
4216 }
4217 };
4218 }
4219 let shouldCacheAccess = true;
4220 function applyOptions(instance) {
4221 const options = resolveMergedOptions(instance);
4222 const publicThis = instance.proxy;
4223 const ctx = instance.ctx;
4224 // do not cache property access on public proxy during state initialization
4225 shouldCacheAccess = false;
4226 // call beforeCreate first before accessing other options since
4227 // the hook may mutate resolved options (#2791)
4228 if (options.beforeCreate) {
4229 callHook(options.beforeCreate, instance, "bc" /* BEFORE_CREATE */);
4230 }
4231 const {
4232 // state
4233 data: dataOptions, computed: computedOptions, methods, watch: watchOptions, provide: provideOptions, inject: injectOptions,
4234 // lifecycle
4235 created, beforeMount, mounted, beforeUpdate, updated, activated, deactivated, beforeDestroy, beforeUnmount, destroyed, unmounted, render, renderTracked, renderTriggered, errorCaptured, serverPrefetch,
4236 // public API
4237 expose, inheritAttrs,
4238 // assets
4239 components, directives, filters } = options;
4240 const checkDuplicateProperties = createDuplicateChecker() ;
4241 {
4242 const [propsOptions] = instance.propsOptions;
4243 if (propsOptions) {
4244 for (const key in propsOptions) {
4245 checkDuplicateProperties("Props" /* PROPS */, key);
4246 }
4247 }
4248 }
4249 // options initialization order (to be consistent with Vue 2):
4250 // - props (already done outside of this function)
4251 // - inject
4252 // - methods
4253 // - data (deferred since it relies on `this` access)
4254 // - computed
4255 // - watch (deferred since it relies on `this` access)
4256 if (injectOptions) {
4257 resolveInjections(injectOptions, ctx, checkDuplicateProperties, instance.appContext.config.unwrapInjectedRef);
4258 }
4259 if (methods) {
4260 for (const key in methods) {
4261 const methodHandler = methods[key];
4262 if (isFunction(methodHandler)) {
4263 // In dev mode, we use the `createRenderContext` function to define
4264 // methods to the proxy target, and those are read-only but
4265 // reconfigurable, so it needs to be redefined here
4266 {
4267 Object.defineProperty(ctx, key, {
4268 value: methodHandler.bind(publicThis),
4269 configurable: true,
4270 enumerable: true,
4271 writable: true
4272 });
4273 }
4274 {
4275 checkDuplicateProperties("Methods" /* METHODS */, key);
4276 }
4277 }
4278 else {
4279 warn$1(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` +
4280 `Did you reference the function correctly?`);
4281 }
4282 }
4283 }
4284 if (dataOptions) {
4285 if (!isFunction(dataOptions)) {
4286 warn$1(`The data option must be a function. ` +
4287 `Plain object usage is no longer supported.`);
4288 }
4289 const data = dataOptions.call(publicThis, publicThis);
4290 if (isPromise(data)) {
4291 warn$1(`data() returned a Promise - note data() cannot be async; If you ` +
4292 `intend to perform data fetching before component renders, use ` +
4293 `async setup() + <Suspense>.`);
4294 }
4295 if (!isObject(data)) {
4296 warn$1(`data() should return an object.`);
4297 }
4298 else {
4299 instance.data = reactive(data);
4300 {
4301 for (const key in data) {
4302 checkDuplicateProperties("Data" /* DATA */, key);
4303 // expose data on ctx during dev
4304 if (key[0] !== '$' && key[0] !== '_') {
4305 Object.defineProperty(ctx, key, {
4306 configurable: true,
4307 enumerable: true,
4308 get: () => data[key],
4309 set: NOOP
4310 });
4311 }
4312 }
4313 }
4314 }
4315 }
4316 // state initialization complete at this point - start caching access
4317 shouldCacheAccess = true;
4318 if (computedOptions) {
4319 for (const key in computedOptions) {
4320 const opt = computedOptions[key];
4321 const get = isFunction(opt)
4322 ? opt.bind(publicThis, publicThis)
4323 : isFunction(opt.get)
4324 ? opt.get.bind(publicThis, publicThis)
4325 : NOOP;
4326 if (get === NOOP) {
4327 warn$1(`Computed property "${key}" has no getter.`);
4328 }
4329 const set = !isFunction(opt) && isFunction(opt.set)
4330 ? opt.set.bind(publicThis)
4331 : () => {
4332 warn$1(`Write operation failed: computed property "${key}" is readonly.`);
4333 }
4334 ;
4335 const c = computed$1({
4336 get,
4337 set
4338 });
4339 Object.defineProperty(ctx, key, {
4340 enumerable: true,
4341 configurable: true,
4342 get: () => c.value,
4343 set: v => (c.value = v)
4344 });
4345 {
4346 checkDuplicateProperties("Computed" /* COMPUTED */, key);
4347 }
4348 }
4349 }
4350 if (watchOptions) {
4351 for (const key in watchOptions) {
4352 createWatcher(watchOptions[key], ctx, publicThis, key);
4353 }
4354 }
4355 if (provideOptions) {
4356 const provides = isFunction(provideOptions)
4357 ? provideOptions.call(publicThis)
4358 : provideOptions;
4359 Reflect.ownKeys(provides).forEach(key => {
4360 provide(key, provides[key]);
4361 });
4362 }
4363 if (created) {
4364 callHook(created, instance, "c" /* CREATED */);
4365 }
4366 function registerLifecycleHook(register, hook) {
4367 if (isArray(hook)) {
4368 hook.forEach(_hook => register(_hook.bind(publicThis)));
4369 }
4370 else if (hook) {
4371 register(hook.bind(publicThis));
4372 }
4373 }
4374 registerLifecycleHook(onBeforeMount, beforeMount);
4375 registerLifecycleHook(onMounted, mounted);
4376 registerLifecycleHook(onBeforeUpdate, beforeUpdate);
4377 registerLifecycleHook(onUpdated, updated);
4378 registerLifecycleHook(onActivated, activated);
4379 registerLifecycleHook(onDeactivated, deactivated);
4380 registerLifecycleHook(onErrorCaptured, errorCaptured);
4381 registerLifecycleHook(onRenderTracked, renderTracked);
4382 registerLifecycleHook(onRenderTriggered, renderTriggered);
4383 registerLifecycleHook(onBeforeUnmount, beforeUnmount);
4384 registerLifecycleHook(onUnmounted, unmounted);
4385 registerLifecycleHook(onServerPrefetch, serverPrefetch);
4386 if (isArray(expose)) {
4387 if (expose.length) {
4388 const exposed = instance.exposed || (instance.exposed = {});
4389 expose.forEach(key => {
4390 Object.defineProperty(exposed, key, {
4391 get: () => publicThis[key],
4392 set: val => (publicThis[key] = val)
4393 });
4394 });
4395 }
4396 else if (!instance.exposed) {
4397 instance.exposed = {};
4398 }
4399 }
4400 // options that are handled when creating the instance but also need to be
4401 // applied from mixins
4402 if (render && instance.render === NOOP) {
4403 instance.render = render;
4404 }
4405 if (inheritAttrs != null) {
4406 instance.inheritAttrs = inheritAttrs;
4407 }
4408 // asset options.
4409 if (components)
4410 instance.components = components;
4411 if (directives)
4412 instance.directives = directives;
4413 }
4414 function resolveInjections(injectOptions, ctx, checkDuplicateProperties = NOOP, unwrapRef = false) {
4415 if (isArray(injectOptions)) {
4416 injectOptions = normalizeInject(injectOptions);
4417 }
4418 for (const key in injectOptions) {
4419 const opt = injectOptions[key];
4420 let injected;
4421 if (isObject(opt)) {
4422 if ('default' in opt) {
4423 injected = inject(opt.from || key, opt.default, true /* treat default function as factory */);
4424 }
4425 else {
4426 injected = inject(opt.from || key);
4427 }
4428 }
4429 else {
4430 injected = inject(opt);
4431 }
4432 if (isRef(injected)) {
4433 // TODO remove the check in 3.3
4434 if (unwrapRef) {
4435 Object.defineProperty(ctx, key, {
4436 enumerable: true,
4437 configurable: true,
4438 get: () => injected.value,
4439 set: v => (injected.value = v)
4440 });
4441 }
4442 else {
4443 {
4444 warn$1(`injected property "${key}" is a ref and will be auto-unwrapped ` +
4445 `and no longer needs \`.value\` in the next minor release. ` +
4446 `To opt-in to the new behavior now, ` +
4447 `set \`app.config.unwrapInjectedRef = true\` (this config is ` +
4448 `temporary and will not be needed in the future.)`);
4449 }
4450 ctx[key] = injected;
4451 }
4452 }
4453 else {
4454 ctx[key] = injected;
4455 }
4456 {
4457 checkDuplicateProperties("Inject" /* INJECT */, key);
4458 }
4459 }
4460 }
4461 function callHook(hook, instance, type) {
4462 callWithAsyncErrorHandling(isArray(hook)
4463 ? hook.map(h => h.bind(instance.proxy))
4464 : hook.bind(instance.proxy), instance, type);
4465 }
4466 function createWatcher(raw, ctx, publicThis, key) {
4467 const getter = key.includes('.')
4468 ? createPathGetter(publicThis, key)
4469 : () => publicThis[key];
4470 if (isString(raw)) {
4471 const handler = ctx[raw];
4472 if (isFunction(handler)) {
4473 watch(getter, handler);
4474 }
4475 else {
4476 warn$1(`Invalid watch handler specified by key "${raw}"`, handler);
4477 }
4478 }
4479 else if (isFunction(raw)) {
4480 watch(getter, raw.bind(publicThis));
4481 }
4482 else if (isObject(raw)) {
4483 if (isArray(raw)) {
4484 raw.forEach(r => createWatcher(r, ctx, publicThis, key));
4485 }
4486 else {
4487 const handler = isFunction(raw.handler)
4488 ? raw.handler.bind(publicThis)
4489 : ctx[raw.handler];
4490 if (isFunction(handler)) {
4491 watch(getter, handler, raw);
4492 }
4493 else {
4494 warn$1(`Invalid watch handler specified by key "${raw.handler}"`, handler);
4495 }
4496 }
4497 }
4498 else {
4499 warn$1(`Invalid watch option: "${key}"`, raw);
4500 }
4501 }
4502 /**
4503 * Resolve merged options and cache it on the component.
4504 * This is done only once per-component since the merging does not involve
4505 * instances.
4506 */
4507 function resolveMergedOptions(instance) {
4508 const base = instance.type;
4509 const { mixins, extends: extendsOptions } = base;
4510 const { mixins: globalMixins, optionsCache: cache, config: { optionMergeStrategies } } = instance.appContext;
4511 const cached = cache.get(base);
4512 let resolved;
4513 if (cached) {
4514 resolved = cached;
4515 }
4516 else if (!globalMixins.length && !mixins && !extendsOptions) {
4517 {
4518 resolved = base;
4519 }
4520 }
4521 else {
4522 resolved = {};
4523 if (globalMixins.length) {
4524 globalMixins.forEach(m => mergeOptions(resolved, m, optionMergeStrategies, true));
4525 }
4526 mergeOptions(resolved, base, optionMergeStrategies);
4527 }
4528 cache.set(base, resolved);
4529 return resolved;
4530 }
4531 function mergeOptions(to, from, strats, asMixin = false) {
4532 const { mixins, extends: extendsOptions } = from;
4533 if (extendsOptions) {
4534 mergeOptions(to, extendsOptions, strats, true);
4535 }
4536 if (mixins) {
4537 mixins.forEach((m) => mergeOptions(to, m, strats, true));
4538 }
4539 for (const key in from) {
4540 if (asMixin && key === 'expose') {
4541 warn$1(`"expose" option is ignored when declared in mixins or extends. ` +
4542 `It should only be declared in the base component itself.`);
4543 }
4544 else {
4545 const strat = internalOptionMergeStrats[key] || (strats && strats[key]);
4546 to[key] = strat ? strat(to[key], from[key]) : from[key];
4547 }
4548 }
4549 return to;
4550 }
4551 const internalOptionMergeStrats = {
4552 data: mergeDataFn,
4553 props: mergeObjectOptions,
4554 emits: mergeObjectOptions,
4555 // objects
4556 methods: mergeObjectOptions,
4557 computed: mergeObjectOptions,
4558 // lifecycle
4559 beforeCreate: mergeAsArray,
4560 created: mergeAsArray,
4561 beforeMount: mergeAsArray,
4562 mounted: mergeAsArray,
4563 beforeUpdate: mergeAsArray,
4564 updated: mergeAsArray,
4565 beforeDestroy: mergeAsArray,
4566 beforeUnmount: mergeAsArray,
4567 destroyed: mergeAsArray,
4568 unmounted: mergeAsArray,
4569 activated: mergeAsArray,
4570 deactivated: mergeAsArray,
4571 errorCaptured: mergeAsArray,
4572 serverPrefetch: mergeAsArray,
4573 // assets
4574 components: mergeObjectOptions,
4575 directives: mergeObjectOptions,
4576 // watch
4577 watch: mergeWatchOptions,
4578 // provide / inject
4579 provide: mergeDataFn,
4580 inject: mergeInject
4581 };
4582 function mergeDataFn(to, from) {
4583 if (!from) {
4584 return to;
4585 }
4586 if (!to) {
4587 return from;
4588 }
4589 return function mergedDataFn() {
4590 return (extend)(isFunction(to) ? to.call(this, this) : to, isFunction(from) ? from.call(this, this) : from);
4591 };
4592 }
4593 function mergeInject(to, from) {
4594 return mergeObjectOptions(normalizeInject(to), normalizeInject(from));
4595 }
4596 function normalizeInject(raw) {
4597 if (isArray(raw)) {
4598 const res = {};
4599 for (let i = 0; i < raw.length; i++) {
4600 res[raw[i]] = raw[i];
4601 }
4602 return res;
4603 }
4604 return raw;
4605 }
4606 function mergeAsArray(to, from) {
4607 return to ? [...new Set([].concat(to, from))] : from;
4608 }
4609 function mergeObjectOptions(to, from) {
4610 return to ? extend(extend(Object.create(null), to), from) : from;
4611 }
4612 function mergeWatchOptions(to, from) {
4613 if (!to)
4614 return from;
4615 if (!from)
4616 return to;
4617 const merged = extend(Object.create(null), to);
4618 for (const key in from) {
4619 merged[key] = mergeAsArray(to[key], from[key]);
4620 }
4621 return merged;
4622 }
4623
4624 function initProps(instance, rawProps, isStateful, // result of bitwise flag comparison
4625 isSSR = false) {
4626 const props = {};
4627 const attrs = {};
4628 def(attrs, InternalObjectKey, 1);
4629 instance.propsDefaults = Object.create(null);
4630 setFullProps(instance, rawProps, props, attrs);
4631 // ensure all declared prop keys are present
4632 for (const key in instance.propsOptions[0]) {
4633 if (!(key in props)) {
4634 props[key] = undefined;
4635 }
4636 }
4637 // validation
4638 {
4639 validateProps(rawProps || {}, props, instance);
4640 }
4641 if (isStateful) {
4642 // stateful
4643 instance.props = isSSR ? props : shallowReactive(props);
4644 }
4645 else {
4646 if (!instance.type.props) {
4647 // functional w/ optional props, props === attrs
4648 instance.props = attrs;
4649 }
4650 else {
4651 // functional w/ declared props
4652 instance.props = props;
4653 }
4654 }
4655 instance.attrs = attrs;
4656 }
4657 function updateProps(instance, rawProps, rawPrevProps, optimized) {
4658 const { props, attrs, vnode: { patchFlag } } = instance;
4659 const rawCurrentProps = toRaw(props);
4660 const [options] = instance.propsOptions;
4661 let hasAttrsChanged = false;
4662 if (
4663 // always force full diff in dev
4664 // - #1942 if hmr is enabled with sfc component
4665 // - vite#872 non-sfc component used by sfc component
4666 !((instance.type.__hmrId ||
4667 (instance.parent && instance.parent.type.__hmrId))) &&
4668 (optimized || patchFlag > 0) &&
4669 !(patchFlag & 16 /* FULL_PROPS */)) {
4670 if (patchFlag & 8 /* PROPS */) {
4671 // Compiler-generated props & no keys change, just set the updated
4672 // the props.
4673 const propsToUpdate = instance.vnode.dynamicProps;
4674 for (let i = 0; i < propsToUpdate.length; i++) {
4675 let key = propsToUpdate[i];
4676 // PROPS flag guarantees rawProps to be non-null
4677 const value = rawProps[key];
4678 if (options) {
4679 // attr / props separation was done on init and will be consistent
4680 // in this code path, so just check if attrs have it.
4681 if (hasOwn(attrs, key)) {
4682 if (value !== attrs[key]) {
4683 attrs[key] = value;
4684 hasAttrsChanged = true;
4685 }
4686 }
4687 else {
4688 const camelizedKey = camelize(key);
4689 props[camelizedKey] = resolvePropValue(options, rawCurrentProps, camelizedKey, value, instance, false /* isAbsent */);
4690 }
4691 }
4692 else {
4693 if (value !== attrs[key]) {
4694 attrs[key] = value;
4695 hasAttrsChanged = true;
4696 }
4697 }
4698 }
4699 }
4700 }
4701 else {
4702 // full props update.
4703 if (setFullProps(instance, rawProps, props, attrs)) {
4704 hasAttrsChanged = true;
4705 }
4706 // in case of dynamic props, check if we need to delete keys from
4707 // the props object
4708 let kebabKey;
4709 for (const key in rawCurrentProps) {
4710 if (!rawProps ||
4711 // for camelCase
4712 (!hasOwn(rawProps, key) &&
4713 // it's possible the original props was passed in as kebab-case
4714 // and converted to camelCase (#955)
4715 ((kebabKey = hyphenate(key)) === key || !hasOwn(rawProps, kebabKey)))) {
4716 if (options) {
4717 if (rawPrevProps &&
4718 // for camelCase
4719 (rawPrevProps[key] !== undefined ||
4720 // for kebab-case
4721 rawPrevProps[kebabKey] !== undefined)) {
4722 props[key] = resolvePropValue(options, rawCurrentProps, key, undefined, instance, true /* isAbsent */);
4723 }
4724 }
4725 else {
4726 delete props[key];
4727 }
4728 }
4729 }
4730 // in the case of functional component w/o props declaration, props and
4731 // attrs point to the same object so it should already have been updated.
4732 if (attrs !== rawCurrentProps) {
4733 for (const key in attrs) {
4734 if (!rawProps ||
4735 (!hasOwn(rawProps, key) &&
4736 (!false ))) {
4737 delete attrs[key];
4738 hasAttrsChanged = true;
4739 }
4740 }
4741 }
4742 }
4743 // trigger updates for $attrs in case it's used in component slots
4744 if (hasAttrsChanged) {
4745 trigger(instance, "set" /* SET */, '$attrs');
4746 }
4747 {
4748 validateProps(rawProps || {}, props, instance);
4749 }
4750 }
4751 function setFullProps(instance, rawProps, props, attrs) {
4752 const [options, needCastKeys] = instance.propsOptions;
4753 let hasAttrsChanged = false;
4754 let rawCastValues;
4755 if (rawProps) {
4756 for (let key in rawProps) {
4757 // key, ref are reserved and never passed down
4758 if (isReservedProp(key)) {
4759 continue;
4760 }
4761 const value = rawProps[key];
4762 // prop option names are camelized during normalization, so to support
4763 // kebab -> camel conversion here we need to camelize the key.
4764 let camelKey;
4765 if (options && hasOwn(options, (camelKey = camelize(key)))) {
4766 if (!needCastKeys || !needCastKeys.includes(camelKey)) {
4767 props[camelKey] = value;
4768 }
4769 else {
4770 (rawCastValues || (rawCastValues = {}))[camelKey] = value;
4771 }
4772 }
4773 else if (!isEmitListener(instance.emitsOptions, key)) {
4774 if (!(key in attrs) || value !== attrs[key]) {
4775 attrs[key] = value;
4776 hasAttrsChanged = true;
4777 }
4778 }
4779 }
4780 }
4781 if (needCastKeys) {
4782 const rawCurrentProps = toRaw(props);
4783 const castValues = rawCastValues || EMPTY_OBJ;
4784 for (let i = 0; i < needCastKeys.length; i++) {
4785 const key = needCastKeys[i];
4786 props[key] = resolvePropValue(options, rawCurrentProps, key, castValues[key], instance, !hasOwn(castValues, key));
4787 }
4788 }
4789 return hasAttrsChanged;
4790 }
4791 function resolvePropValue(options, props, key, value, instance, isAbsent) {
4792 const opt = options[key];
4793 if (opt != null) {
4794 const hasDefault = hasOwn(opt, 'default');
4795 // default values
4796 if (hasDefault && value === undefined) {
4797 const defaultValue = opt.default;
4798 if (opt.type !== Function && isFunction(defaultValue)) {
4799 const { propsDefaults } = instance;
4800 if (key in propsDefaults) {
4801 value = propsDefaults[key];
4802 }
4803 else {
4804 setCurrentInstance(instance);
4805 value = propsDefaults[key] = defaultValue.call(null, props);
4806 unsetCurrentInstance();
4807 }
4808 }
4809 else {
4810 value = defaultValue;
4811 }
4812 }
4813 // boolean casting
4814 if (opt[0 /* shouldCast */]) {
4815 if (isAbsent && !hasDefault) {
4816 value = false;
4817 }
4818 else if (opt[1 /* shouldCastTrue */] &&
4819 (value === '' || value === hyphenate(key))) {
4820 value = true;
4821 }
4822 }
4823 }
4824 return value;
4825 }
4826 function normalizePropsOptions(comp, appContext, asMixin = false) {
4827 const cache = appContext.propsCache;
4828 const cached = cache.get(comp);
4829 if (cached) {
4830 return cached;
4831 }
4832 const raw = comp.props;
4833 const normalized = {};
4834 const needCastKeys = [];
4835 // apply mixin/extends props
4836 let hasExtends = false;
4837 if (!isFunction(comp)) {
4838 const extendProps = (raw) => {
4839 hasExtends = true;
4840 const [props, keys] = normalizePropsOptions(raw, appContext, true);
4841 extend(normalized, props);
4842 if (keys)
4843 needCastKeys.push(...keys);
4844 };
4845 if (!asMixin && appContext.mixins.length) {
4846 appContext.mixins.forEach(extendProps);
4847 }
4848 if (comp.extends) {
4849 extendProps(comp.extends);
4850 }
4851 if (comp.mixins) {
4852 comp.mixins.forEach(extendProps);
4853 }
4854 }
4855 if (!raw && !hasExtends) {
4856 cache.set(comp, EMPTY_ARR);
4857 return EMPTY_ARR;
4858 }
4859 if (isArray(raw)) {
4860 for (let i = 0; i < raw.length; i++) {
4861 if (!isString(raw[i])) {
4862 warn$1(`props must be strings when using array syntax.`, raw[i]);
4863 }
4864 const normalizedKey = camelize(raw[i]);
4865 if (validatePropName(normalizedKey)) {
4866 normalized[normalizedKey] = EMPTY_OBJ;
4867 }
4868 }
4869 }
4870 else if (raw) {
4871 if (!isObject(raw)) {
4872 warn$1(`invalid props options`, raw);
4873 }
4874 for (const key in raw) {
4875 const normalizedKey = camelize(key);
4876 if (validatePropName(normalizedKey)) {
4877 const opt = raw[key];
4878 const prop = (normalized[normalizedKey] =
4879 isArray(opt) || isFunction(opt) ? { type: opt } : opt);
4880 if (prop) {
4881 const booleanIndex = getTypeIndex(Boolean, prop.type);
4882 const stringIndex = getTypeIndex(String, prop.type);
4883 prop[0 /* shouldCast */] = booleanIndex > -1;
4884 prop[1 /* shouldCastTrue */] =
4885 stringIndex < 0 || booleanIndex < stringIndex;
4886 // if the prop needs boolean casting or default value
4887 if (booleanIndex > -1 || hasOwn(prop, 'default')) {
4888 needCastKeys.push(normalizedKey);
4889 }
4890 }
4891 }
4892 }
4893 }
4894 const res = [normalized, needCastKeys];
4895 cache.set(comp, res);
4896 return res;
4897 }
4898 function validatePropName(key) {
4899 if (key[0] !== '$') {
4900 return true;
4901 }
4902 else {
4903 warn$1(`Invalid prop name: "${key}" is a reserved property.`);
4904 }
4905 return false;
4906 }
4907 // use function string name to check type constructors
4908 // so that it works across vms / iframes.
4909 function getType(ctor) {
4910 const match = ctor && ctor.toString().match(/^\s*function (\w+)/);
4911 return match ? match[1] : ctor === null ? 'null' : '';
4912 }
4913 function isSameType(a, b) {
4914 return getType(a) === getType(b);
4915 }
4916 function getTypeIndex(type, expectedTypes) {
4917 if (isArray(expectedTypes)) {
4918 return expectedTypes.findIndex(t => isSameType(t, type));
4919 }
4920 else if (isFunction(expectedTypes)) {
4921 return isSameType(expectedTypes, type) ? 0 : -1;
4922 }
4923 return -1;
4924 }
4925 /**
4926 * dev only
4927 */
4928 function validateProps(rawProps, props, instance) {
4929 const resolvedValues = toRaw(props);
4930 const options = instance.propsOptions[0];
4931 for (const key in options) {
4932 let opt = options[key];
4933 if (opt == null)
4934 continue;
4935 validateProp(key, resolvedValues[key], opt, !hasOwn(rawProps, key) && !hasOwn(rawProps, hyphenate(key)));
4936 }
4937 }
4938 /**
4939 * dev only
4940 */
4941 function validateProp(name, value, prop, isAbsent) {
4942 const { type, required, validator } = prop;
4943 // required!
4944 if (required && isAbsent) {
4945 warn$1('Missing required prop: "' + name + '"');
4946 return;
4947 }
4948 // missing but optional
4949 if (value == null && !prop.required) {
4950 return;
4951 }
4952 // type check
4953 if (type != null && type !== true) {
4954 let isValid = false;
4955 const types = isArray(type) ? type : [type];
4956 const expectedTypes = [];
4957 // value is valid as long as one of the specified types match
4958 for (let i = 0; i < types.length && !isValid; i++) {
4959 const { valid, expectedType } = assertType(value, types[i]);
4960 expectedTypes.push(expectedType || '');
4961 isValid = valid;
4962 }
4963 if (!isValid) {
4964 warn$1(getInvalidTypeMessage(name, value, expectedTypes));
4965 return;
4966 }
4967 }
4968 // custom validator
4969 if (validator && !validator(value)) {
4970 warn$1('Invalid prop: custom validator check failed for prop "' + name + '".');
4971 }
4972 }
4973 const isSimpleType = /*#__PURE__*/ makeMap('String,Number,Boolean,Function,Symbol,BigInt');
4974 /**
4975 * dev only
4976 */
4977 function assertType(value, type) {
4978 let valid;
4979 const expectedType = getType(type);
4980 if (isSimpleType(expectedType)) {
4981 const t = typeof value;
4982 valid = t === expectedType.toLowerCase();
4983 // for primitive wrapper objects
4984 if (!valid && t === 'object') {
4985 valid = value instanceof type;
4986 }
4987 }
4988 else if (expectedType === 'Object') {
4989 valid = isObject(value);
4990 }
4991 else if (expectedType === 'Array') {
4992 valid = isArray(value);
4993 }
4994 else if (expectedType === 'null') {
4995 valid = value === null;
4996 }
4997 else {
4998 valid = value instanceof type;
4999 }
5000 return {
5001 valid,
5002 expectedType
5003 };
5004 }
5005 /**
5006 * dev only
5007 */
5008 function getInvalidTypeMessage(name, value, expectedTypes) {
5009 let message = `Invalid prop: type check failed for prop "${name}".` +
5010 ` Expected ${expectedTypes.map(capitalize).join(' | ')}`;
5011 const expectedType = expectedTypes[0];
5012 const receivedType = toRawType(value);
5013 const expectedValue = styleValue(value, expectedType);
5014 const receivedValue = styleValue(value, receivedType);
5015 // check if we need to specify expected value
5016 if (expectedTypes.length === 1 &&
5017 isExplicable(expectedType) &&
5018 !isBoolean(expectedType, receivedType)) {
5019 message += ` with value ${expectedValue}`;
5020 }
5021 message += `, got ${receivedType} `;
5022 // check if we need to specify received value
5023 if (isExplicable(receivedType)) {
5024 message += `with value ${receivedValue}.`;
5025 }
5026 return message;
5027 }
5028 /**
5029 * dev only
5030 */
5031 function styleValue(value, type) {
5032 if (type === 'String') {
5033 return `"${value}"`;
5034 }
5035 else if (type === 'Number') {
5036 return `${Number(value)}`;
5037 }
5038 else {
5039 return `${value}`;
5040 }
5041 }
5042 /**
5043 * dev only
5044 */
5045 function isExplicable(type) {
5046 const explicitTypes = ['string', 'number', 'boolean'];
5047 return explicitTypes.some(elem => type.toLowerCase() === elem);
5048 }
5049 /**
5050 * dev only
5051 */
5052 function isBoolean(...args) {
5053 return args.some(elem => elem.toLowerCase() === 'boolean');
5054 }
5055
5056 const isInternalKey = (key) => key[0] === '_' || key === '$stable';
5057 const normalizeSlotValue = (value) => isArray(value)
5058 ? value.map(normalizeVNode)
5059 : [normalizeVNode(value)];
5060 const normalizeSlot = (key, rawSlot, ctx) => {
5061 const normalized = withCtx((...args) => {
5062 if (currentInstance) {
5063 warn$1(`Slot "${key}" invoked outside of the render function: ` +
5064 `this will not track dependencies used in the slot. ` +
5065 `Invoke the slot function inside the render function instead.`);
5066 }
5067 return normalizeSlotValue(rawSlot(...args));
5068 }, ctx);
5069 normalized._c = false;
5070 return normalized;
5071 };
5072 const normalizeObjectSlots = (rawSlots, slots, instance) => {
5073 const ctx = rawSlots._ctx;
5074 for (const key in rawSlots) {
5075 if (isInternalKey(key))
5076 continue;
5077 const value = rawSlots[key];
5078 if (isFunction(value)) {
5079 slots[key] = normalizeSlot(key, value, ctx);
5080 }
5081 else if (value != null) {
5082 {
5083 warn$1(`Non-function value encountered for slot "${key}". ` +
5084 `Prefer function slots for better performance.`);
5085 }
5086 const normalized = normalizeSlotValue(value);
5087 slots[key] = () => normalized;
5088 }
5089 }
5090 };
5091 const normalizeVNodeSlots = (instance, children) => {
5092 if (!isKeepAlive(instance.vnode) &&
5093 !(false )) {
5094 warn$1(`Non-function value encountered for default slot. ` +
5095 `Prefer function slots for better performance.`);
5096 }
5097 const normalized = normalizeSlotValue(children);
5098 instance.slots.default = () => normalized;
5099 };
5100 const initSlots = (instance, children) => {
5101 if (instance.vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) {
5102 const type = children._;
5103 if (type) {
5104 // users can get the shallow readonly version of the slots object through `this.$slots`,
5105 // we should avoid the proxy object polluting the slots of the internal instance
5106 instance.slots = toRaw(children);
5107 // make compiler marker non-enumerable
5108 def(children, '_', type);
5109 }
5110 else {
5111 normalizeObjectSlots(children, (instance.slots = {}));
5112 }
5113 }
5114 else {
5115 instance.slots = {};
5116 if (children) {
5117 normalizeVNodeSlots(instance, children);
5118 }
5119 }
5120 def(instance.slots, InternalObjectKey, 1);
5121 };
5122 const updateSlots = (instance, children, optimized) => {
5123 const { vnode, slots } = instance;
5124 let needDeletionCheck = true;
5125 let deletionComparisonTarget = EMPTY_OBJ;
5126 if (vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) {
5127 const type = children._;
5128 if (type) {
5129 // compiled slots.
5130 if (isHmrUpdating) {
5131 // Parent was HMR updated so slot content may have changed.
5132 // force update slots and mark instance for hmr as well
5133 extend(slots, children);
5134 }
5135 else if (optimized && type === 1 /* STABLE */) {
5136 // compiled AND stable.
5137 // no need to update, and skip stale slots removal.
5138 needDeletionCheck = false;
5139 }
5140 else {
5141 // compiled but dynamic (v-if/v-for on slots) - update slots, but skip
5142 // normalization.
5143 extend(slots, children);
5144 // #2893
5145 // when rendering the optimized slots by manually written render function,
5146 // we need to delete the `slots._` flag if necessary to make subsequent updates reliable,
5147 // i.e. let the `renderSlot` create the bailed Fragment
5148 if (!optimized && type === 1 /* STABLE */) {
5149 delete slots._;
5150 }
5151 }
5152 }
5153 else {
5154 needDeletionCheck = !children.$stable;
5155 normalizeObjectSlots(children, slots);
5156 }
5157 deletionComparisonTarget = children;
5158 }
5159 else if (children) {
5160 // non slot object children (direct value) passed to a component
5161 normalizeVNodeSlots(instance, children);
5162 deletionComparisonTarget = { default: 1 };
5163 }
5164 // delete stale slots
5165 if (needDeletionCheck) {
5166 for (const key in slots) {
5167 if (!isInternalKey(key) && !(key in deletionComparisonTarget)) {
5168 delete slots[key];
5169 }
5170 }
5171 }
5172 };
5173
5174 /**
5175 Runtime helper for applying directives to a vnode. Example usage:
5176
5177 const comp = resolveComponent('comp')
5178 const foo = resolveDirective('foo')
5179 const bar = resolveDirective('bar')
5180
5181 return withDirectives(h(comp), [
5182 [foo, this.x],
5183 [bar, this.y]
5184 ])
5185 */
5186 function validateDirectiveName(name) {
5187 if (isBuiltInDirective(name)) {
5188 warn$1('Do not use built-in directive ids as custom directive id: ' + name);
5189 }
5190 }
5191 /**
5192 * Adds directives to a VNode.
5193 */
5194 function withDirectives(vnode, directives) {
5195 const internalInstance = currentRenderingInstance;
5196 if (internalInstance === null) {
5197 warn$1(`withDirectives can only be used inside render functions.`);
5198 return vnode;
5199 }
5200 const instance = internalInstance.proxy;
5201 const bindings = vnode.dirs || (vnode.dirs = []);
5202 for (let i = 0; i < directives.length; i++) {
5203 let [dir, value, arg, modifiers = EMPTY_OBJ] = directives[i];
5204 if (isFunction(dir)) {
5205 dir = {
5206 mounted: dir,
5207 updated: dir
5208 };
5209 }
5210 if (dir.deep) {
5211 traverse(value);
5212 }
5213 bindings.push({
5214 dir,
5215 instance,
5216 value,
5217 oldValue: void 0,
5218 arg,
5219 modifiers
5220 });
5221 }
5222 return vnode;
5223 }
5224 function invokeDirectiveHook(vnode, prevVNode, instance, name) {
5225 const bindings = vnode.dirs;
5226 const oldBindings = prevVNode && prevVNode.dirs;
5227 for (let i = 0; i < bindings.length; i++) {
5228 const binding = bindings[i];
5229 if (oldBindings) {
5230 binding.oldValue = oldBindings[i].value;
5231 }
5232 let hook = binding.dir[name];
5233 if (hook) {
5234 // disable tracking inside all lifecycle hooks
5235 // since they can potentially be called inside effects.
5236 pauseTracking();
5237 callWithAsyncErrorHandling(hook, instance, 8 /* DIRECTIVE_HOOK */, [
5238 vnode.el,
5239 binding,
5240 vnode,
5241 prevVNode
5242 ]);
5243 resetTracking();
5244 }
5245 }
5246 }
5247
5248 function createAppContext() {
5249 return {
5250 app: null,
5251 config: {
5252 isNativeTag: NO,
5253 performance: false,
5254 globalProperties: {},
5255 optionMergeStrategies: {},
5256 errorHandler: undefined,
5257 warnHandler: undefined,
5258 compilerOptions: {}
5259 },
5260 mixins: [],
5261 components: {},
5262 directives: {},
5263 provides: Object.create(null),
5264 optionsCache: new WeakMap(),
5265 propsCache: new WeakMap(),
5266 emitsCache: new WeakMap()
5267 };
5268 }
5269 let uid = 0;
5270 function createAppAPI(render, hydrate) {
5271 return function createApp(rootComponent, rootProps = null) {
5272 if (rootProps != null && !isObject(rootProps)) {
5273 warn$1(`root props passed to app.mount() must be an object.`);
5274 rootProps = null;
5275 }
5276 const context = createAppContext();
5277 const installedPlugins = new Set();
5278 let isMounted = false;
5279 const app = (context.app = {
5280 _uid: uid++,
5281 _component: rootComponent,
5282 _props: rootProps,
5283 _container: null,
5284 _context: context,
5285 _instance: null,
5286 version,
5287 get config() {
5288 return context.config;
5289 },
5290 set config(v) {
5291 {
5292 warn$1(`app.config cannot be replaced. Modify individual options instead.`);
5293 }
5294 },
5295 use(plugin, ...options) {
5296 if (installedPlugins.has(plugin)) {
5297 warn$1(`Plugin has already been applied to target app.`);
5298 }
5299 else if (plugin && isFunction(plugin.install)) {
5300 installedPlugins.add(plugin);
5301 plugin.install(app, ...options);
5302 }
5303 else if (isFunction(plugin)) {
5304 installedPlugins.add(plugin);
5305 plugin(app, ...options);
5306 }
5307 else {
5308 warn$1(`A plugin must either be a function or an object with an "install" ` +
5309 `function.`);
5310 }
5311 return app;
5312 },
5313 mixin(mixin) {
5314 {
5315 if (!context.mixins.includes(mixin)) {
5316 context.mixins.push(mixin);
5317 }
5318 else {
5319 warn$1('Mixin has already been applied to target app' +
5320 (mixin.name ? `: ${mixin.name}` : ''));
5321 }
5322 }
5323 return app;
5324 },
5325 component(name, component) {
5326 {
5327 validateComponentName(name, context.config);
5328 }
5329 if (!component) {
5330 return context.components[name];
5331 }
5332 if (context.components[name]) {
5333 warn$1(`Component "${name}" has already been registered in target app.`);
5334 }
5335 context.components[name] = component;
5336 return app;
5337 },
5338 directive(name, directive) {
5339 {
5340 validateDirectiveName(name);
5341 }
5342 if (!directive) {
5343 return context.directives[name];
5344 }
5345 if (context.directives[name]) {
5346 warn$1(`Directive "${name}" has already been registered in target app.`);
5347 }
5348 context.directives[name] = directive;
5349 return app;
5350 },
5351 mount(rootContainer, isHydrate, isSVG) {
5352 if (!isMounted) {
5353 const vnode = createVNode(rootComponent, rootProps);
5354 // store app context on the root VNode.
5355 // this will be set on the root instance on initial mount.
5356 vnode.appContext = context;
5357 // HMR root reload
5358 {
5359 context.reload = () => {
5360 render(cloneVNode(vnode), rootContainer, isSVG);
5361 };
5362 }
5363 if (isHydrate && hydrate) {
5364 hydrate(vnode, rootContainer);
5365 }
5366 else {
5367 render(vnode, rootContainer, isSVG);
5368 }
5369 isMounted = true;
5370 app._container = rootContainer;
5371 rootContainer.__vue_app__ = app;
5372 {
5373 app._instance = vnode.component;
5374 devtoolsInitApp(app, version);
5375 }
5376 return getExposeProxy(vnode.component) || vnode.component.proxy;
5377 }
5378 else {
5379 warn$1(`App has already been mounted.\n` +
5380 `If you want to remount the same app, move your app creation logic ` +
5381 `into a factory function and create fresh app instances for each ` +
5382 `mount - e.g. \`const createMyApp = () => createApp(App)\``);
5383 }
5384 },
5385 unmount() {
5386 if (isMounted) {
5387 render(null, app._container);
5388 {
5389 app._instance = null;
5390 devtoolsUnmountApp(app);
5391 }
5392 delete app._container.__vue_app__;
5393 }
5394 else {
5395 warn$1(`Cannot unmount an app that is not mounted.`);
5396 }
5397 },
5398 provide(key, value) {
5399 if (key in context.provides) {
5400 warn$1(`App already provides property with key "${String(key)}". ` +
5401 `It will be overwritten with the new value.`);
5402 }
5403 // TypeScript doesn't allow symbols as index type
5404 // https://github.com/Microsoft/TypeScript/issues/24587
5405 context.provides[key] = value;
5406 return app;
5407 }
5408 });
5409 return app;
5410 };
5411 }
5412
5413 /**
5414 * Function for handling a template ref
5415 */
5416 function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
5417 if (isArray(rawRef)) {
5418 rawRef.forEach((r, i) => setRef(r, oldRawRef && (isArray(oldRawRef) ? oldRawRef[i] : oldRawRef), parentSuspense, vnode, isUnmount));
5419 return;
5420 }
5421 if (isAsyncWrapper(vnode) && !isUnmount) {
5422 // when mounting async components, nothing needs to be done,
5423 // because the template ref is forwarded to inner component
5424 return;
5425 }
5426 const refValue = vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */
5427 ? getExposeProxy(vnode.component) || vnode.component.proxy
5428 : vnode.el;
5429 const value = isUnmount ? null : refValue;
5430 const { i: owner, r: ref } = rawRef;
5431 if (!owner) {
5432 warn$1(`Missing ref owner context. ref cannot be used on hoisted vnodes. ` +
5433 `A vnode with ref must be created inside the render function.`);
5434 return;
5435 }
5436 const oldRef = oldRawRef && oldRawRef.r;
5437 const refs = owner.refs === EMPTY_OBJ ? (owner.refs = {}) : owner.refs;
5438 const setupState = owner.setupState;
5439 // dynamic ref changed. unset old ref
5440 if (oldRef != null && oldRef !== ref) {
5441 if (isString(oldRef)) {
5442 refs[oldRef] = null;
5443 if (hasOwn(setupState, oldRef)) {
5444 setupState[oldRef] = null;
5445 }
5446 }
5447 else if (isRef(oldRef)) {
5448 oldRef.value = null;
5449 }
5450 }
5451 if (isFunction(ref)) {
5452 callWithErrorHandling(ref, owner, 12 /* FUNCTION_REF */, [value, refs]);
5453 }
5454 else {
5455 const _isString = isString(ref);
5456 const _isRef = isRef(ref);
5457 if (_isString || _isRef) {
5458 const doSet = () => {
5459 if (rawRef.f) {
5460 const existing = _isString ? refs[ref] : ref.value;
5461 if (isUnmount) {
5462 isArray(existing) && remove(existing, refValue);
5463 }
5464 else {
5465 if (!isArray(existing)) {
5466 if (_isString) {
5467 refs[ref] = [refValue];
5468 }
5469 else {
5470 ref.value = [refValue];
5471 if (rawRef.k)
5472 refs[rawRef.k] = ref.value;
5473 }
5474 }
5475 else if (!existing.includes(refValue)) {
5476 existing.push(refValue);
5477 }
5478 }
5479 }
5480 else if (_isString) {
5481 refs[ref] = value;
5482 if (hasOwn(setupState, ref)) {
5483 setupState[ref] = value;
5484 }
5485 }
5486 else if (isRef(ref)) {
5487 ref.value = value;
5488 if (rawRef.k)
5489 refs[rawRef.k] = value;
5490 }
5491 else {
5492 warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
5493 }
5494 };
5495 if (value) {
5496 doSet.id = -1;
5497 queuePostRenderEffect(doSet, parentSuspense);
5498 }
5499 else {
5500 doSet();
5501 }
5502 }
5503 else {
5504 warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
5505 }
5506 }
5507 }
5508
5509 let hasMismatch = false;
5510 const isSVGContainer = (container) => /svg/.test(container.namespaceURI) && container.tagName !== 'foreignObject';
5511 const isComment = (node) => node.nodeType === 8 /* COMMENT */;
5512 // Note: hydration is DOM-specific
5513 // But we have to place it in core due to tight coupling with core - splitting
5514 // it out creates a ton of unnecessary complexity.
5515 // Hydration also depends on some renderer internal logic which needs to be
5516 // passed in via arguments.
5517 function createHydrationFunctions(rendererInternals) {
5518 const { mt: mountComponent, p: patch, o: { patchProp, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals;
5519 const hydrate = (vnode, container) => {
5520 if (!container.hasChildNodes()) {
5521 warn$1(`Attempting to hydrate existing markup but container is empty. ` +
5522 `Performing full mount instead.`);
5523 patch(null, vnode, container);
5524 flushPostFlushCbs();
5525 return;
5526 }
5527 hasMismatch = false;
5528 hydrateNode(container.firstChild, vnode, null, null, null);
5529 flushPostFlushCbs();
5530 if (hasMismatch && !false) {
5531 // this error should show up in production
5532 console.error(`Hydration completed but contains mismatches.`);
5533 }
5534 };
5535 const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => {
5536 const isFragmentStart = isComment(node) && node.data === '[';
5537 const onMismatch = () => handleMismatch(node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragmentStart);
5538 const { type, ref, shapeFlag } = vnode;
5539 const domType = node.nodeType;
5540 vnode.el = node;
5541 let nextNode = null;
5542 switch (type) {
5543 case Text:
5544 if (domType !== 3 /* TEXT */) {
5545 nextNode = onMismatch();
5546 }
5547 else {
5548 if (node.data !== vnode.children) {
5549 hasMismatch = true;
5550 warn$1(`Hydration text mismatch:` +
5551 `\n- Client: ${JSON.stringify(node.data)}` +
5552 `\n- Server: ${JSON.stringify(vnode.children)}`);
5553 node.data = vnode.children;
5554 }
5555 nextNode = nextSibling(node);
5556 }
5557 break;
5558 case Comment:
5559 if (domType !== 8 /* COMMENT */ || isFragmentStart) {
5560 nextNode = onMismatch();
5561 }
5562 else {
5563 nextNode = nextSibling(node);
5564 }
5565 break;
5566 case Static:
5567 if (domType !== 1 /* ELEMENT */) {
5568 nextNode = onMismatch();
5569 }
5570 else {
5571 // determine anchor, adopt content
5572 nextNode = node;
5573 // if the static vnode has its content stripped during build,
5574 // adopt it from the server-rendered HTML.
5575 const needToAdoptContent = !vnode.children.length;
5576 for (let i = 0; i < vnode.staticCount; i++) {
5577 if (needToAdoptContent)
5578 vnode.children += nextNode.outerHTML;
5579 if (i === vnode.staticCount - 1) {
5580 vnode.anchor = nextNode;
5581 }
5582 nextNode = nextSibling(nextNode);
5583 }
5584 return nextNode;
5585 }
5586 break;
5587 case Fragment:
5588 if (!isFragmentStart) {
5589 nextNode = onMismatch();
5590 }
5591 else {
5592 nextNode = hydrateFragment(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
5593 }
5594 break;
5595 default:
5596 if (shapeFlag & 1 /* ELEMENT */) {
5597 if (domType !== 1 /* ELEMENT */ ||
5598 vnode.type.toLowerCase() !==
5599 node.tagName.toLowerCase()) {
5600 nextNode = onMismatch();
5601 }
5602 else {
5603 nextNode = hydrateElement(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
5604 }
5605 }
5606 else if (shapeFlag & 6 /* COMPONENT */) {
5607 // when setting up the render effect, if the initial vnode already
5608 // has .el set, the component will perform hydration instead of mount
5609 // on its sub-tree.
5610 vnode.slotScopeIds = slotScopeIds;
5611 const container = parentNode(node);
5612 mountComponent(vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), optimized);
5613 // component may be async, so in the case of fragments we cannot rely
5614 // on component's rendered output to determine the end of the fragment
5615 // instead, we do a lookahead to find the end anchor node.
5616 nextNode = isFragmentStart
5617 ? locateClosingAsyncAnchor(node)
5618 : nextSibling(node);
5619 // #3787
5620 // if component is async, it may get moved / unmounted before its
5621 // inner component is loaded, so we need to give it a placeholder
5622 // vnode that matches its adopted DOM.
5623 if (isAsyncWrapper(vnode)) {
5624 let subTree;
5625 if (isFragmentStart) {
5626 subTree = createVNode(Fragment);
5627 subTree.anchor = nextNode
5628 ? nextNode.previousSibling
5629 : container.lastChild;
5630 }
5631 else {
5632 subTree =
5633 node.nodeType === 3 ? createTextVNode('') : createVNode('div');
5634 }
5635 subTree.el = node;
5636 vnode.component.subTree = subTree;
5637 }
5638 }
5639 else if (shapeFlag & 64 /* TELEPORT */) {
5640 if (domType !== 8 /* COMMENT */) {
5641 nextNode = onMismatch();
5642 }
5643 else {
5644 nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, rendererInternals, hydrateChildren);
5645 }
5646 }
5647 else if (shapeFlag & 128 /* SUSPENSE */) {
5648 nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, isSVGContainer(parentNode(node)), slotScopeIds, optimized, rendererInternals, hydrateNode);
5649 }
5650 else {
5651 warn$1('Invalid HostVNode type:', type, `(${typeof type})`);
5652 }
5653 }
5654 if (ref != null) {
5655 setRef(ref, null, parentSuspense, vnode);
5656 }
5657 return nextNode;
5658 };
5659 const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
5660 optimized = optimized || !!vnode.dynamicChildren;
5661 const { type, props, patchFlag, shapeFlag, dirs } = vnode;
5662 // #4006 for form elements with non-string v-model value bindings
5663 // e.g. <option :value="obj">, <input type="checkbox" :true-value="1">
5664 const forcePatchValue = (type === 'input' && dirs) || type === 'option';
5665 // skip props & children if this is hoisted static nodes
5666 // #5405 in dev, always hydrate children for HMR
5667 {
5668 if (dirs) {
5669 invokeDirectiveHook(vnode, null, parentComponent, 'created');
5670 }
5671 // props
5672 if (props) {
5673 if (forcePatchValue ||
5674 !optimized ||
5675 patchFlag & (16 /* FULL_PROPS */ | 32 /* HYDRATE_EVENTS */)) {
5676 for (const key in props) {
5677 if ((forcePatchValue && key.endsWith('value')) ||
5678 (isOn(key) && !isReservedProp(key))) {
5679 patchProp(el, key, null, props[key], false, undefined, parentComponent);
5680 }
5681 }
5682 }
5683 else if (props.onClick) {
5684 // Fast path for click listeners (which is most often) to avoid
5685 // iterating through props.
5686 patchProp(el, 'onClick', null, props.onClick, false, undefined, parentComponent);
5687 }
5688 }
5689 // vnode / directive hooks
5690 let vnodeHooks;
5691 if ((vnodeHooks = props && props.onVnodeBeforeMount)) {
5692 invokeVNodeHook(vnodeHooks, parentComponent, vnode);
5693 }
5694 if (dirs) {
5695 invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
5696 }
5697 if ((vnodeHooks = props && props.onVnodeMounted) || dirs) {
5698 queueEffectWithSuspense(() => {
5699 vnodeHooks && invokeVNodeHook(vnodeHooks, parentComponent, vnode);
5700 dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
5701 }, parentSuspense);
5702 }
5703 // children
5704 if (shapeFlag & 16 /* ARRAY_CHILDREN */ &&
5705 // skip if element has innerHTML / textContent
5706 !(props && (props.innerHTML || props.textContent))) {
5707 let next = hydrateChildren(el.firstChild, vnode, el, parentComponent, parentSuspense, slotScopeIds, optimized);
5708 let hasWarned = false;
5709 while (next) {
5710 hasMismatch = true;
5711 if (!hasWarned) {
5712 warn$1(`Hydration children mismatch in <${vnode.type}>: ` +
5713 `server rendered element contains more child nodes than client vdom.`);
5714 hasWarned = true;
5715 }
5716 // The SSRed DOM contains more nodes than it should. Remove them.
5717 const cur = next;
5718 next = next.nextSibling;
5719 remove(cur);
5720 }
5721 }
5722 else if (shapeFlag & 8 /* TEXT_CHILDREN */) {
5723 if (el.textContent !== vnode.children) {
5724 hasMismatch = true;
5725 warn$1(`Hydration text content mismatch in <${vnode.type}>:\n` +
5726 `- Client: ${el.textContent}\n` +
5727 `- Server: ${vnode.children}`);
5728 el.textContent = vnode.children;
5729 }
5730 }
5731 }
5732 return el.nextSibling;
5733 };
5734 const hydrateChildren = (node, parentVNode, container, parentComponent, parentSuspense, slotScopeIds, optimized) => {
5735 optimized = optimized || !!parentVNode.dynamicChildren;
5736 const children = parentVNode.children;
5737 const l = children.length;
5738 let hasWarned = false;
5739 for (let i = 0; i < l; i++) {
5740 const vnode = optimized
5741 ? children[i]
5742 : (children[i] = normalizeVNode(children[i]));
5743 if (node) {
5744 node = hydrateNode(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
5745 }
5746 else if (vnode.type === Text && !vnode.children) {
5747 continue;
5748 }
5749 else {
5750 hasMismatch = true;
5751 if (!hasWarned) {
5752 warn$1(`Hydration children mismatch in <${container.tagName.toLowerCase()}>: ` +
5753 `server rendered element contains fewer child nodes than client vdom.`);
5754 hasWarned = true;
5755 }
5756 // the SSRed DOM didn't contain enough nodes. Mount the missing ones.
5757 patch(null, vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
5758 }
5759 }
5760 return node;
5761 };
5762 const hydrateFragment = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
5763 const { slotScopeIds: fragmentSlotScopeIds } = vnode;
5764 if (fragmentSlotScopeIds) {
5765 slotScopeIds = slotScopeIds
5766 ? slotScopeIds.concat(fragmentSlotScopeIds)
5767 : fragmentSlotScopeIds;
5768 }
5769 const container = parentNode(node);
5770 const next = hydrateChildren(nextSibling(node), vnode, container, parentComponent, parentSuspense, slotScopeIds, optimized);
5771 if (next && isComment(next) && next.data === ']') {
5772 return nextSibling((vnode.anchor = next));
5773 }
5774 else {
5775 // fragment didn't hydrate successfully, since we didn't get a end anchor
5776 // back. This should have led to node/children mismatch warnings.
5777 hasMismatch = true;
5778 // since the anchor is missing, we need to create one and insert it
5779 insert((vnode.anchor = createComment(`]`)), container, next);
5780 return next;
5781 }
5782 };
5783 const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
5784 hasMismatch = true;
5785 warn$1(`Hydration node mismatch:\n- Client vnode:`, vnode.type, `\n- Server rendered DOM:`, node, node.nodeType === 3 /* TEXT */
5786 ? `(text)`
5787 : isComment(node) && node.data === '['
5788 ? `(start of fragment)`
5789 : ``);
5790 vnode.el = null;
5791 if (isFragment) {
5792 // remove excessive fragment nodes
5793 const end = locateClosingAsyncAnchor(node);
5794 while (true) {
5795 const next = nextSibling(node);
5796 if (next && next !== end) {
5797 remove(next);
5798 }
5799 else {
5800 break;
5801 }
5802 }
5803 }
5804 const next = nextSibling(node);
5805 const container = parentNode(node);
5806 remove(node);
5807 patch(null, vnode, container, next, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
5808 return next;
5809 };
5810 const locateClosingAsyncAnchor = (node) => {
5811 let match = 0;
5812 while (node) {
5813 node = nextSibling(node);
5814 if (node && isComment(node)) {
5815 if (node.data === '[')
5816 match++;
5817 if (node.data === ']') {
5818 if (match === 0) {
5819 return nextSibling(node);
5820 }
5821 else {
5822 match--;
5823 }
5824 }
5825 }
5826 }
5827 return node;
5828 };
5829 return [hydrate, hydrateNode];
5830 }
5831
5832 /* eslint-disable no-restricted-globals */
5833 let supported;
5834 let perf;
5835 function startMeasure(instance, type) {
5836 if (instance.appContext.config.performance && isSupported()) {
5837 perf.mark(`vue-${type}-${instance.uid}`);
5838 }
5839 {
5840 devtoolsPerfStart(instance, type, supported ? perf.now() : Date.now());
5841 }
5842 }
5843 function endMeasure(instance, type) {
5844 if (instance.appContext.config.performance && isSupported()) {
5845 const startTag = `vue-${type}-${instance.uid}`;
5846 const endTag = startTag + `:end`;
5847 perf.mark(endTag);
5848 perf.measure(`<${formatComponentName(instance, instance.type)}> ${type}`, startTag, endTag);
5849 perf.clearMarks(startTag);
5850 perf.clearMarks(endTag);
5851 }
5852 {
5853 devtoolsPerfEnd(instance, type, supported ? perf.now() : Date.now());
5854 }
5855 }
5856 function isSupported() {
5857 if (supported !== undefined) {
5858 return supported;
5859 }
5860 if (typeof window !== 'undefined' && window.performance) {
5861 supported = true;
5862 perf = window.performance;
5863 }
5864 else {
5865 supported = false;
5866 }
5867 return supported;
5868 }
5869
5870 const queuePostRenderEffect = queueEffectWithSuspense
5871 ;
5872 /**
5873 * The createRenderer function accepts two generic arguments:
5874 * HostNode and HostElement, corresponding to Node and Element types in the
5875 * host environment. For example, for runtime-dom, HostNode would be the DOM
5876 * `Node` interface and HostElement would be the DOM `Element` interface.
5877 *
5878 * Custom renderers can pass in the platform specific types like this:
5879 *
5880 * ``` js
5881 * const { render, createApp } = createRenderer<Node, Element>({
5882 * patchProp,
5883 * ...nodeOps
5884 * })
5885 * ```
5886 */
5887 function createRenderer(options) {
5888 return baseCreateRenderer(options);
5889 }
5890 // Separate API for creating hydration-enabled renderer.
5891 // Hydration logic is only used when calling this function, making it
5892 // tree-shakable.
5893 function createHydrationRenderer(options) {
5894 return baseCreateRenderer(options, createHydrationFunctions);
5895 }
5896 // implementation
5897 function baseCreateRenderer(options, createHydrationFns) {
5898 const target = getGlobalThis();
5899 target.__VUE__ = true;
5900 {
5901 setDevtoolsHook(target.__VUE_DEVTOOLS_GLOBAL_HOOK__, target);
5902 }
5903 const { insert: hostInsert, remove: hostRemove, patchProp: hostPatchProp, createElement: hostCreateElement, createText: hostCreateText, createComment: hostCreateComment, setText: hostSetText, setElementText: hostSetElementText, parentNode: hostParentNode, nextSibling: hostNextSibling, setScopeId: hostSetScopeId = NOOP, cloneNode: hostCloneNode, insertStaticContent: hostInsertStaticContent } = options;
5904 // Note: functions inside this closure should use `const xxx = () => {}`
5905 // style in order to prevent being inlined by minifiers.
5906 const patch = (n1, n2, container, anchor = null, parentComponent = null, parentSuspense = null, isSVG = false, slotScopeIds = null, optimized = isHmrUpdating ? false : !!n2.dynamicChildren) => {
5907 if (n1 === n2) {
5908 return;
5909 }
5910 // patching & not same type, unmount old tree
5911 if (n1 && !isSameVNodeType(n1, n2)) {
5912 anchor = getNextHostNode(n1);
5913 unmount(n1, parentComponent, parentSuspense, true);
5914 n1 = null;
5915 }
5916 if (n2.patchFlag === -2 /* BAIL */) {
5917 optimized = false;
5918 n2.dynamicChildren = null;
5919 }
5920 const { type, ref, shapeFlag } = n2;
5921 switch (type) {
5922 case Text:
5923 processText(n1, n2, container, anchor);
5924 break;
5925 case Comment:
5926 processCommentNode(n1, n2, container, anchor);
5927 break;
5928 case Static:
5929 if (n1 == null) {
5930 mountStaticNode(n2, container, anchor, isSVG);
5931 }
5932 else {
5933 patchStaticNode(n1, n2, container, isSVG);
5934 }
5935 break;
5936 case Fragment:
5937 processFragment(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
5938 break;
5939 default:
5940 if (shapeFlag & 1 /* ELEMENT */) {
5941 processElement(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
5942 }
5943 else if (shapeFlag & 6 /* COMPONENT */) {
5944 processComponent(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
5945 }
5946 else if (shapeFlag & 64 /* TELEPORT */) {
5947 type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
5948 }
5949 else if (shapeFlag & 128 /* SUSPENSE */) {
5950 type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
5951 }
5952 else {
5953 warn$1('Invalid VNode type:', type, `(${typeof type})`);
5954 }
5955 }
5956 // set ref
5957 if (ref != null && parentComponent) {
5958 setRef(ref, n1 && n1.ref, parentSuspense, n2 || n1, !n2);
5959 }
5960 };
5961 const processText = (n1, n2, container, anchor) => {
5962 if (n1 == null) {
5963 hostInsert((n2.el = hostCreateText(n2.children)), container, anchor);
5964 }
5965 else {
5966 const el = (n2.el = n1.el);
5967 if (n2.children !== n1.children) {
5968 hostSetText(el, n2.children);
5969 }
5970 }
5971 };
5972 const processCommentNode = (n1, n2, container, anchor) => {
5973 if (n1 == null) {
5974 hostInsert((n2.el = hostCreateComment(n2.children || '')), container, anchor);
5975 }
5976 else {
5977 // there's no support for dynamic comments
5978 n2.el = n1.el;
5979 }
5980 };
5981 const mountStaticNode = (n2, container, anchor, isSVG) => {
5982 [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG, n2.el, n2.anchor);
5983 };
5984 /**
5985 * Dev / HMR only
5986 */
5987 const patchStaticNode = (n1, n2, container, isSVG) => {
5988 // static nodes are only patched during dev for HMR
5989 if (n2.children !== n1.children) {
5990 const anchor = hostNextSibling(n1.anchor);
5991 // remove existing
5992 removeStaticNode(n1);
5993 [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG);
5994 }
5995 else {
5996 n2.el = n1.el;
5997 n2.anchor = n1.anchor;
5998 }
5999 };
6000 const moveStaticNode = ({ el, anchor }, container, nextSibling) => {
6001 let next;
6002 while (el && el !== anchor) {
6003 next = hostNextSibling(el);
6004 hostInsert(el, container, nextSibling);
6005 el = next;
6006 }
6007 hostInsert(anchor, container, nextSibling);
6008 };
6009 const removeStaticNode = ({ el, anchor }) => {
6010 let next;
6011 while (el && el !== anchor) {
6012 next = hostNextSibling(el);
6013 hostRemove(el);
6014 el = next;
6015 }
6016 hostRemove(anchor);
6017 };
6018 const processElement = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6019 isSVG = isSVG || n2.type === 'svg';
6020 if (n1 == null) {
6021 mountElement(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6022 }
6023 else {
6024 patchElement(n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6025 }
6026 };
6027 const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6028 let el;
6029 let vnodeHook;
6030 const { type, props, shapeFlag, transition, patchFlag, dirs } = vnode;
6031 {
6032 el = vnode.el = hostCreateElement(vnode.type, isSVG, props && props.is, props);
6033 // mount children first, since some props may rely on child content
6034 // being already rendered, e.g. `<select value>`
6035 if (shapeFlag & 8 /* TEXT_CHILDREN */) {
6036 hostSetElementText(el, vnode.children);
6037 }
6038 else if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
6039 mountChildren(vnode.children, el, null, parentComponent, parentSuspense, isSVG && type !== 'foreignObject', slotScopeIds, optimized);
6040 }
6041 if (dirs) {
6042 invokeDirectiveHook(vnode, null, parentComponent, 'created');
6043 }
6044 // props
6045 if (props) {
6046 for (const key in props) {
6047 if (key !== 'value' && !isReservedProp(key)) {
6048 hostPatchProp(el, key, null, props[key], isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6049 }
6050 }
6051 /**
6052 * Special case for setting value on DOM elements:
6053 * - it can be order-sensitive (e.g. should be set *after* min/max, #2325, #4024)
6054 * - it needs to be forced (#1471)
6055 * #2353 proposes adding another renderer option to configure this, but
6056 * the properties affects are so finite it is worth special casing it
6057 * here to reduce the complexity. (Special casing it also should not
6058 * affect non-DOM renderers)
6059 */
6060 if ('value' in props) {
6061 hostPatchProp(el, 'value', null, props.value);
6062 }
6063 if ((vnodeHook = props.onVnodeBeforeMount)) {
6064 invokeVNodeHook(vnodeHook, parentComponent, vnode);
6065 }
6066 }
6067 // scopeId
6068 setScopeId(el, vnode, vnode.scopeId, slotScopeIds, parentComponent);
6069 }
6070 {
6071 Object.defineProperty(el, '__vnode', {
6072 value: vnode,
6073 enumerable: false
6074 });
6075 Object.defineProperty(el, '__vueParentComponent', {
6076 value: parentComponent,
6077 enumerable: false
6078 });
6079 }
6080 if (dirs) {
6081 invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
6082 }
6083 // #1583 For inside suspense + suspense not resolved case, enter hook should call when suspense resolved
6084 // #1689 For inside suspense + suspense resolved case, just call it
6085 const needCallTransitionHooks = (!parentSuspense || (parentSuspense && !parentSuspense.pendingBranch)) &&
6086 transition &&
6087 !transition.persisted;
6088 if (needCallTransitionHooks) {
6089 transition.beforeEnter(el);
6090 }
6091 hostInsert(el, container, anchor);
6092 if ((vnodeHook = props && props.onVnodeMounted) ||
6093 needCallTransitionHooks ||
6094 dirs) {
6095 queuePostRenderEffect(() => {
6096 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
6097 needCallTransitionHooks && transition.enter(el);
6098 dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
6099 }, parentSuspense);
6100 }
6101 };
6102 const setScopeId = (el, vnode, scopeId, slotScopeIds, parentComponent) => {
6103 if (scopeId) {
6104 hostSetScopeId(el, scopeId);
6105 }
6106 if (slotScopeIds) {
6107 for (let i = 0; i < slotScopeIds.length; i++) {
6108 hostSetScopeId(el, slotScopeIds[i]);
6109 }
6110 }
6111 if (parentComponent) {
6112 let subTree = parentComponent.subTree;
6113 if (subTree.patchFlag > 0 &&
6114 subTree.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
6115 subTree =
6116 filterSingleRoot(subTree.children) || subTree;
6117 }
6118 if (vnode === subTree) {
6119 const parentVNode = parentComponent.vnode;
6120 setScopeId(el, parentVNode, parentVNode.scopeId, parentVNode.slotScopeIds, parentComponent.parent);
6121 }
6122 }
6123 };
6124 const mountChildren = (children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, start = 0) => {
6125 for (let i = start; i < children.length; i++) {
6126 const child = (children[i] = optimized
6127 ? cloneIfMounted(children[i])
6128 : normalizeVNode(children[i]));
6129 patch(null, child, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6130 }
6131 };
6132 const patchElement = (n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6133 const el = (n2.el = n1.el);
6134 let { patchFlag, dynamicChildren, dirs } = n2;
6135 // #1426 take the old vnode's patch flag into account since user may clone a
6136 // compiler-generated vnode, which de-opts to FULL_PROPS
6137 patchFlag |= n1.patchFlag & 16 /* FULL_PROPS */;
6138 const oldProps = n1.props || EMPTY_OBJ;
6139 const newProps = n2.props || EMPTY_OBJ;
6140 let vnodeHook;
6141 // disable recurse in beforeUpdate hooks
6142 parentComponent && toggleRecurse(parentComponent, false);
6143 if ((vnodeHook = newProps.onVnodeBeforeUpdate)) {
6144 invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
6145 }
6146 if (dirs) {
6147 invokeDirectiveHook(n2, n1, parentComponent, 'beforeUpdate');
6148 }
6149 parentComponent && toggleRecurse(parentComponent, true);
6150 if (isHmrUpdating) {
6151 // HMR updated, force full diff
6152 patchFlag = 0;
6153 optimized = false;
6154 dynamicChildren = null;
6155 }
6156 const areChildrenSVG = isSVG && n2.type !== 'foreignObject';
6157 if (dynamicChildren) {
6158 patchBlockChildren(n1.dynamicChildren, dynamicChildren, el, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds);
6159 if (parentComponent && parentComponent.type.__hmrId) {
6160 traverseStaticChildren(n1, n2);
6161 }
6162 }
6163 else if (!optimized) {
6164 // full diff
6165 patchChildren(n1, n2, el, null, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds, false);
6166 }
6167 if (patchFlag > 0) {
6168 // the presence of a patchFlag means this element's render code was
6169 // generated by the compiler and can take the fast path.
6170 // in this path old node and new node are guaranteed to have the same shape
6171 // (i.e. at the exact same position in the source template)
6172 if (patchFlag & 16 /* FULL_PROPS */) {
6173 // element props contain dynamic keys, full diff needed
6174 patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
6175 }
6176 else {
6177 // class
6178 // this flag is matched when the element has dynamic class bindings.
6179 if (patchFlag & 2 /* CLASS */) {
6180 if (oldProps.class !== newProps.class) {
6181 hostPatchProp(el, 'class', null, newProps.class, isSVG);
6182 }
6183 }
6184 // style
6185 // this flag is matched when the element has dynamic style bindings
6186 if (patchFlag & 4 /* STYLE */) {
6187 hostPatchProp(el, 'style', oldProps.style, newProps.style, isSVG);
6188 }
6189 // props
6190 // This flag is matched when the element has dynamic prop/attr bindings
6191 // other than class and style. The keys of dynamic prop/attrs are saved for
6192 // faster iteration.
6193 // Note dynamic keys like :[foo]="bar" will cause this optimization to
6194 // bail out and go through a full diff because we need to unset the old key
6195 if (patchFlag & 8 /* PROPS */) {
6196 // if the flag is present then dynamicProps must be non-null
6197 const propsToUpdate = n2.dynamicProps;
6198 for (let i = 0; i < propsToUpdate.length; i++) {
6199 const key = propsToUpdate[i];
6200 const prev = oldProps[key];
6201 const next = newProps[key];
6202 // #1471 force patch value
6203 if (next !== prev || key === 'value') {
6204 hostPatchProp(el, key, prev, next, isSVG, n1.children, parentComponent, parentSuspense, unmountChildren);
6205 }
6206 }
6207 }
6208 }
6209 // text
6210 // This flag is matched when the element has only dynamic text children.
6211 if (patchFlag & 1 /* TEXT */) {
6212 if (n1.children !== n2.children) {
6213 hostSetElementText(el, n2.children);
6214 }
6215 }
6216 }
6217 else if (!optimized && dynamicChildren == null) {
6218 // unoptimized, full diff
6219 patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
6220 }
6221 if ((vnodeHook = newProps.onVnodeUpdated) || dirs) {
6222 queuePostRenderEffect(() => {
6223 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
6224 dirs && invokeDirectiveHook(n2, n1, parentComponent, 'updated');
6225 }, parentSuspense);
6226 }
6227 };
6228 // The fast path for blocks.
6229 const patchBlockChildren = (oldChildren, newChildren, fallbackContainer, parentComponent, parentSuspense, isSVG, slotScopeIds) => {
6230 for (let i = 0; i < newChildren.length; i++) {
6231 const oldVNode = oldChildren[i];
6232 const newVNode = newChildren[i];
6233 // Determine the container (parent element) for the patch.
6234 const container =
6235 // oldVNode may be an errored async setup() component inside Suspense
6236 // which will not have a mounted element
6237 oldVNode.el &&
6238 // - In the case of a Fragment, we need to provide the actual parent
6239 // of the Fragment itself so it can move its children.
6240 (oldVNode.type === Fragment ||
6241 // - In the case of different nodes, there is going to be a replacement
6242 // which also requires the correct parent container
6243 !isSameVNodeType(oldVNode, newVNode) ||
6244 // - In the case of a component, it could contain anything.
6245 oldVNode.shapeFlag & (6 /* COMPONENT */ | 64 /* TELEPORT */))
6246 ? hostParentNode(oldVNode.el)
6247 : // In other cases, the parent container is not actually used so we
6248 // just pass the block element here to avoid a DOM parentNode call.
6249 fallbackContainer;
6250 patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, true);
6251 }
6252 };
6253 const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, isSVG) => {
6254 if (oldProps !== newProps) {
6255 for (const key in newProps) {
6256 // empty string is not valid prop
6257 if (isReservedProp(key))
6258 continue;
6259 const next = newProps[key];
6260 const prev = oldProps[key];
6261 // defer patching value
6262 if (next !== prev && key !== 'value') {
6263 hostPatchProp(el, key, prev, next, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6264 }
6265 }
6266 if (oldProps !== EMPTY_OBJ) {
6267 for (const key in oldProps) {
6268 if (!isReservedProp(key) && !(key in newProps)) {
6269 hostPatchProp(el, key, oldProps[key], null, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6270 }
6271 }
6272 }
6273 if ('value' in newProps) {
6274 hostPatchProp(el, 'value', oldProps.value, newProps.value);
6275 }
6276 }
6277 };
6278 const processFragment = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6279 const fragmentStartAnchor = (n2.el = n1 ? n1.el : hostCreateText(''));
6280 const fragmentEndAnchor = (n2.anchor = n1 ? n1.anchor : hostCreateText(''));
6281 let { patchFlag, dynamicChildren, slotScopeIds: fragmentSlotScopeIds } = n2;
6282 if (isHmrUpdating) {
6283 // HMR updated, force full diff
6284 patchFlag = 0;
6285 optimized = false;
6286 dynamicChildren = null;
6287 }
6288 // check if this is a slot fragment with :slotted scope ids
6289 if (fragmentSlotScopeIds) {
6290 slotScopeIds = slotScopeIds
6291 ? slotScopeIds.concat(fragmentSlotScopeIds)
6292 : fragmentSlotScopeIds;
6293 }
6294 if (n1 == null) {
6295 hostInsert(fragmentStartAnchor, container, anchor);
6296 hostInsert(fragmentEndAnchor, container, anchor);
6297 // a fragment can only have array children
6298 // since they are either generated by the compiler, or implicitly created
6299 // from arrays.
6300 mountChildren(n2.children, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6301 }
6302 else {
6303 if (patchFlag > 0 &&
6304 patchFlag & 64 /* STABLE_FRAGMENT */ &&
6305 dynamicChildren &&
6306 // #2715 the previous fragment could've been a BAILed one as a result
6307 // of renderSlot() with no valid children
6308 n1.dynamicChildren) {
6309 // a stable fragment (template root or <template v-for>) doesn't need to
6310 // patch children order, but it may contain dynamicChildren.
6311 patchBlockChildren(n1.dynamicChildren, dynamicChildren, container, parentComponent, parentSuspense, isSVG, slotScopeIds);
6312 if (parentComponent && parentComponent.type.__hmrId) {
6313 traverseStaticChildren(n1, n2);
6314 }
6315 else if (
6316 // #2080 if the stable fragment has a key, it's a <template v-for> that may
6317 // get moved around. Make sure all root level vnodes inherit el.
6318 // #2134 or if it's a component root, it may also get moved around
6319 // as the component is being moved.
6320 n2.key != null ||
6321 (parentComponent && n2 === parentComponent.subTree)) {
6322 traverseStaticChildren(n1, n2, true /* shallow */);
6323 }
6324 }
6325 else {
6326 // keyed / unkeyed, or manual fragments.
6327 // for keyed & unkeyed, since they are compiler generated from v-for,
6328 // each child is guaranteed to be a block so the fragment will never
6329 // have dynamicChildren.
6330 patchChildren(n1, n2, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6331 }
6332 }
6333 };
6334 const processComponent = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6335 n2.slotScopeIds = slotScopeIds;
6336 if (n1 == null) {
6337 if (n2.shapeFlag & 512 /* COMPONENT_KEPT_ALIVE */) {
6338 parentComponent.ctx.activate(n2, container, anchor, isSVG, optimized);
6339 }
6340 else {
6341 mountComponent(n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized);
6342 }
6343 }
6344 else {
6345 updateComponent(n1, n2, optimized);
6346 }
6347 };
6348 const mountComponent = (initialVNode, container, anchor, parentComponent, parentSuspense, isSVG, optimized) => {
6349 const instance = (initialVNode.component = createComponentInstance(initialVNode, parentComponent, parentSuspense));
6350 if (instance.type.__hmrId) {
6351 registerHMR(instance);
6352 }
6353 {
6354 pushWarningContext(initialVNode);
6355 startMeasure(instance, `mount`);
6356 }
6357 // inject renderer internals for keepAlive
6358 if (isKeepAlive(initialVNode)) {
6359 instance.ctx.renderer = internals;
6360 }
6361 // resolve props and slots for setup context
6362 {
6363 {
6364 startMeasure(instance, `init`);
6365 }
6366 setupComponent(instance);
6367 {
6368 endMeasure(instance, `init`);
6369 }
6370 }
6371 // setup() is async. This component relies on async logic to be resolved
6372 // before proceeding
6373 if (instance.asyncDep) {
6374 parentSuspense && parentSuspense.registerDep(instance, setupRenderEffect);
6375 // Give it a placeholder if this is not hydration
6376 // TODO handle self-defined fallback
6377 if (!initialVNode.el) {
6378 const placeholder = (instance.subTree = createVNode(Comment));
6379 processCommentNode(null, placeholder, container, anchor);
6380 }
6381 return;
6382 }
6383 setupRenderEffect(instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized);
6384 {
6385 popWarningContext();
6386 endMeasure(instance, `mount`);
6387 }
6388 };
6389 const updateComponent = (n1, n2, optimized) => {
6390 const instance = (n2.component = n1.component);
6391 if (shouldUpdateComponent(n1, n2, optimized)) {
6392 if (instance.asyncDep &&
6393 !instance.asyncResolved) {
6394 // async & still pending - just update props and slots
6395 // since the component's reactive effect for render isn't set-up yet
6396 {
6397 pushWarningContext(n2);
6398 }
6399 updateComponentPreRender(instance, n2, optimized);
6400 {
6401 popWarningContext();
6402 }
6403 return;
6404 }
6405 else {
6406 // normal update
6407 instance.next = n2;
6408 // in case the child component is also queued, remove it to avoid
6409 // double updating the same child component in the same flush.
6410 invalidateJob(instance.update);
6411 // instance.update is the reactive effect.
6412 instance.update();
6413 }
6414 }
6415 else {
6416 // no update needed. just copy over properties
6417 n2.component = n1.component;
6418 n2.el = n1.el;
6419 instance.vnode = n2;
6420 }
6421 };
6422 const setupRenderEffect = (instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized) => {
6423 const componentUpdateFn = () => {
6424 if (!instance.isMounted) {
6425 let vnodeHook;
6426 const { el, props } = initialVNode;
6427 const { bm, m, parent } = instance;
6428 const isAsyncWrapperVNode = isAsyncWrapper(initialVNode);
6429 toggleRecurse(instance, false);
6430 // beforeMount hook
6431 if (bm) {
6432 invokeArrayFns(bm);
6433 }
6434 // onVnodeBeforeMount
6435 if (!isAsyncWrapperVNode &&
6436 (vnodeHook = props && props.onVnodeBeforeMount)) {
6437 invokeVNodeHook(vnodeHook, parent, initialVNode);
6438 }
6439 toggleRecurse(instance, true);
6440 if (el && hydrateNode) {
6441 // vnode has adopted host node - perform hydration instead of mount.
6442 const hydrateSubTree = () => {
6443 {
6444 startMeasure(instance, `render`);
6445 }
6446 instance.subTree = renderComponentRoot(instance);
6447 {
6448 endMeasure(instance, `render`);
6449 }
6450 {
6451 startMeasure(instance, `hydrate`);
6452 }
6453 hydrateNode(el, instance.subTree, instance, parentSuspense, null);
6454 {
6455 endMeasure(instance, `hydrate`);
6456 }
6457 };
6458 if (isAsyncWrapperVNode) {
6459 initialVNode.type.__asyncLoader().then(
6460 // note: we are moving the render call into an async callback,
6461 // which means it won't track dependencies - but it's ok because
6462 // a server-rendered async wrapper is already in resolved state
6463 // and it will never need to change.
6464 () => !instance.isUnmounted && hydrateSubTree());
6465 }
6466 else {
6467 hydrateSubTree();
6468 }
6469 }
6470 else {
6471 {
6472 startMeasure(instance, `render`);
6473 }
6474 const subTree = (instance.subTree = renderComponentRoot(instance));
6475 {
6476 endMeasure(instance, `render`);
6477 }
6478 {
6479 startMeasure(instance, `patch`);
6480 }
6481 patch(null, subTree, container, anchor, instance, parentSuspense, isSVG);
6482 {
6483 endMeasure(instance, `patch`);
6484 }
6485 initialVNode.el = subTree.el;
6486 }
6487 // mounted hook
6488 if (m) {
6489 queuePostRenderEffect(m, parentSuspense);
6490 }
6491 // onVnodeMounted
6492 if (!isAsyncWrapperVNode &&
6493 (vnodeHook = props && props.onVnodeMounted)) {
6494 const scopedInitialVNode = initialVNode;
6495 queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, scopedInitialVNode), parentSuspense);
6496 }
6497 // activated hook for keep-alive roots.
6498 // #1742 activated hook must be accessed after first render
6499 // since the hook may be injected by a child keep-alive
6500 if (initialVNode.shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
6501 instance.a && queuePostRenderEffect(instance.a, parentSuspense);
6502 }
6503 instance.isMounted = true;
6504 {
6505 devtoolsComponentAdded(instance);
6506 }
6507 // #2458: deference mount-only object parameters to prevent memleaks
6508 initialVNode = container = anchor = null;
6509 }
6510 else {
6511 // updateComponent
6512 // This is triggered by mutation of component's own state (next: null)
6513 // OR parent calling processComponent (next: VNode)
6514 let { next, bu, u, parent, vnode } = instance;
6515 let originNext = next;
6516 let vnodeHook;
6517 {
6518 pushWarningContext(next || instance.vnode);
6519 }
6520 // Disallow component effect recursion during pre-lifecycle hooks.
6521 toggleRecurse(instance, false);
6522 if (next) {
6523 next.el = vnode.el;
6524 updateComponentPreRender(instance, next, optimized);
6525 }
6526 else {
6527 next = vnode;
6528 }
6529 // beforeUpdate hook
6530 if (bu) {
6531 invokeArrayFns(bu);
6532 }
6533 // onVnodeBeforeUpdate
6534 if ((vnodeHook = next.props && next.props.onVnodeBeforeUpdate)) {
6535 invokeVNodeHook(vnodeHook, parent, next, vnode);
6536 }
6537 toggleRecurse(instance, true);
6538 // render
6539 {
6540 startMeasure(instance, `render`);
6541 }
6542 const nextTree = renderComponentRoot(instance);
6543 {
6544 endMeasure(instance, `render`);
6545 }
6546 const prevTree = instance.subTree;
6547 instance.subTree = nextTree;
6548 {
6549 startMeasure(instance, `patch`);
6550 }
6551 patch(prevTree, nextTree,
6552 // parent may have changed if it's in a teleport
6553 hostParentNode(prevTree.el),
6554 // anchor may have changed if it's in a fragment
6555 getNextHostNode(prevTree), instance, parentSuspense, isSVG);
6556 {
6557 endMeasure(instance, `patch`);
6558 }
6559 next.el = nextTree.el;
6560 if (originNext === null) {
6561 // self-triggered update. In case of HOC, update parent component
6562 // vnode el. HOC is indicated by parent instance's subTree pointing
6563 // to child component's vnode
6564 updateHOCHostEl(instance, nextTree.el);
6565 }
6566 // updated hook
6567 if (u) {
6568 queuePostRenderEffect(u, parentSuspense);
6569 }
6570 // onVnodeUpdated
6571 if ((vnodeHook = next.props && next.props.onVnodeUpdated)) {
6572 queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, next, vnode), parentSuspense);
6573 }
6574 {
6575 devtoolsComponentUpdated(instance);
6576 }
6577 {
6578 popWarningContext();
6579 }
6580 }
6581 };
6582 // create reactive effect for rendering
6583 const effect = (instance.effect = new ReactiveEffect(componentUpdateFn, () => queueJob(instance.update), instance.scope // track it in component's effect scope
6584 ));
6585 const update = (instance.update = effect.run.bind(effect));
6586 update.id = instance.uid;
6587 // allowRecurse
6588 // #1801, #2043 component render effects should allow recursive updates
6589 toggleRecurse(instance, true);
6590 {
6591 effect.onTrack = instance.rtc
6592 ? e => invokeArrayFns(instance.rtc, e)
6593 : void 0;
6594 effect.onTrigger = instance.rtg
6595 ? e => invokeArrayFns(instance.rtg, e)
6596 : void 0;
6597 // @ts-ignore (for scheduler)
6598 update.ownerInstance = instance;
6599 }
6600 update();
6601 };
6602 const updateComponentPreRender = (instance, nextVNode, optimized) => {
6603 nextVNode.component = instance;
6604 const prevProps = instance.vnode.props;
6605 instance.vnode = nextVNode;
6606 instance.next = null;
6607 updateProps(instance, nextVNode.props, prevProps, optimized);
6608 updateSlots(instance, nextVNode.children, optimized);
6609 pauseTracking();
6610 // props update may have triggered pre-flush watchers.
6611 // flush them before the render update.
6612 flushPreFlushCbs(undefined, instance.update);
6613 resetTracking();
6614 };
6615 const patchChildren = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized = false) => {
6616 const c1 = n1 && n1.children;
6617 const prevShapeFlag = n1 ? n1.shapeFlag : 0;
6618 const c2 = n2.children;
6619 const { patchFlag, shapeFlag } = n2;
6620 // fast path
6621 if (patchFlag > 0) {
6622 if (patchFlag & 128 /* KEYED_FRAGMENT */) {
6623 // this could be either fully-keyed or mixed (some keyed some not)
6624 // presence of patchFlag means children are guaranteed to be arrays
6625 patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6626 return;
6627 }
6628 else if (patchFlag & 256 /* UNKEYED_FRAGMENT */) {
6629 // unkeyed
6630 patchUnkeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6631 return;
6632 }
6633 }
6634 // children has 3 possibilities: text, array or no children.
6635 if (shapeFlag & 8 /* TEXT_CHILDREN */) {
6636 // text children fast path
6637 if (prevShapeFlag & 16 /* ARRAY_CHILDREN */) {
6638 unmountChildren(c1, parentComponent, parentSuspense);
6639 }
6640 if (c2 !== c1) {
6641 hostSetElementText(container, c2);
6642 }
6643 }
6644 else {
6645 if (prevShapeFlag & 16 /* ARRAY_CHILDREN */) {
6646 // prev children was array
6647 if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
6648 // two arrays, cannot assume anything, do full diff
6649 patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6650 }
6651 else {
6652 // no new children, just unmount old
6653 unmountChildren(c1, parentComponent, parentSuspense, true);
6654 }
6655 }
6656 else {
6657 // prev children was text OR null
6658 // new children is array OR null
6659 if (prevShapeFlag & 8 /* TEXT_CHILDREN */) {
6660 hostSetElementText(container, '');
6661 }
6662 // mount new if array
6663 if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
6664 mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6665 }
6666 }
6667 }
6668 };
6669 const patchUnkeyedChildren = (c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6670 c1 = c1 || EMPTY_ARR;
6671 c2 = c2 || EMPTY_ARR;
6672 const oldLength = c1.length;
6673 const newLength = c2.length;
6674 const commonLength = Math.min(oldLength, newLength);
6675 let i;
6676 for (i = 0; i < commonLength; i++) {
6677 const nextChild = (c2[i] = optimized
6678 ? cloneIfMounted(c2[i])
6679 : normalizeVNode(c2[i]));
6680 patch(c1[i], nextChild, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6681 }
6682 if (oldLength > newLength) {
6683 // remove old
6684 unmountChildren(c1, parentComponent, parentSuspense, true, false, commonLength);
6685 }
6686 else {
6687 // mount new
6688 mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, commonLength);
6689 }
6690 };
6691 // can be all-keyed or mixed
6692 const patchKeyedChildren = (c1, c2, container, parentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6693 let i = 0;
6694 const l2 = c2.length;
6695 let e1 = c1.length - 1; // prev ending index
6696 let e2 = l2 - 1; // next ending index
6697 // 1. sync from start
6698 // (a b) c
6699 // (a b) d e
6700 while (i <= e1 && i <= e2) {
6701 const n1 = c1[i];
6702 const n2 = (c2[i] = optimized
6703 ? cloneIfMounted(c2[i])
6704 : normalizeVNode(c2[i]));
6705 if (isSameVNodeType(n1, n2)) {
6706 patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6707 }
6708 else {
6709 break;
6710 }
6711 i++;
6712 }
6713 // 2. sync from end
6714 // a (b c)
6715 // d e (b c)
6716 while (i <= e1 && i <= e2) {
6717 const n1 = c1[e1];
6718 const n2 = (c2[e2] = optimized
6719 ? cloneIfMounted(c2[e2])
6720 : normalizeVNode(c2[e2]));
6721 if (isSameVNodeType(n1, n2)) {
6722 patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6723 }
6724 else {
6725 break;
6726 }
6727 e1--;
6728 e2--;
6729 }
6730 // 3. common sequence + mount
6731 // (a b)
6732 // (a b) c
6733 // i = 2, e1 = 1, e2 = 2
6734 // (a b)
6735 // c (a b)
6736 // i = 0, e1 = -1, e2 = 0
6737 if (i > e1) {
6738 if (i <= e2) {
6739 const nextPos = e2 + 1;
6740 const anchor = nextPos < l2 ? c2[nextPos].el : parentAnchor;
6741 while (i <= e2) {
6742 patch(null, (c2[i] = optimized
6743 ? cloneIfMounted(c2[i])
6744 : normalizeVNode(c2[i])), container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6745 i++;
6746 }
6747 }
6748 }
6749 // 4. common sequence + unmount
6750 // (a b) c
6751 // (a b)
6752 // i = 2, e1 = 2, e2 = 1
6753 // a (b c)
6754 // (b c)
6755 // i = 0, e1 = 0, e2 = -1
6756 else if (i > e2) {
6757 while (i <= e1) {
6758 unmount(c1[i], parentComponent, parentSuspense, true);
6759 i++;
6760 }
6761 }
6762 // 5. unknown sequence
6763 // [i ... e1 + 1]: a b [c d e] f g
6764 // [i ... e2 + 1]: a b [e d c h] f g
6765 // i = 2, e1 = 4, e2 = 5
6766 else {
6767 const s1 = i; // prev starting index
6768 const s2 = i; // next starting index
6769 // 5.1 build key:index map for newChildren
6770 const keyToNewIndexMap = new Map();
6771 for (i = s2; i <= e2; i++) {
6772 const nextChild = (c2[i] = optimized
6773 ? cloneIfMounted(c2[i])
6774 : normalizeVNode(c2[i]));
6775 if (nextChild.key != null) {
6776 if (keyToNewIndexMap.has(nextChild.key)) {
6777 warn$1(`Duplicate keys found during update:`, JSON.stringify(nextChild.key), `Make sure keys are unique.`);
6778 }
6779 keyToNewIndexMap.set(nextChild.key, i);
6780 }
6781 }
6782 // 5.2 loop through old children left to be patched and try to patch
6783 // matching nodes & remove nodes that are no longer present
6784 let j;
6785 let patched = 0;
6786 const toBePatched = e2 - s2 + 1;
6787 let moved = false;
6788 // used to track whether any node has moved
6789 let maxNewIndexSoFar = 0;
6790 // works as Map<newIndex, oldIndex>
6791 // Note that oldIndex is offset by +1
6792 // and oldIndex = 0 is a special value indicating the new node has
6793 // no corresponding old node.
6794 // used for determining longest stable subsequence
6795 const newIndexToOldIndexMap = new Array(toBePatched);
6796 for (i = 0; i < toBePatched; i++)
6797 newIndexToOldIndexMap[i] = 0;
6798 for (i = s1; i <= e1; i++) {
6799 const prevChild = c1[i];
6800 if (patched >= toBePatched) {
6801 // all new children have been patched so this can only be a removal
6802 unmount(prevChild, parentComponent, parentSuspense, true);
6803 continue;
6804 }
6805 let newIndex;
6806 if (prevChild.key != null) {
6807 newIndex = keyToNewIndexMap.get(prevChild.key);
6808 }
6809 else {
6810 // key-less node, try to locate a key-less node of the same type
6811 for (j = s2; j <= e2; j++) {
6812 if (newIndexToOldIndexMap[j - s2] === 0 &&
6813 isSameVNodeType(prevChild, c2[j])) {
6814 newIndex = j;
6815 break;
6816 }
6817 }
6818 }
6819 if (newIndex === undefined) {
6820 unmount(prevChild, parentComponent, parentSuspense, true);
6821 }
6822 else {
6823 newIndexToOldIndexMap[newIndex - s2] = i + 1;
6824 if (newIndex >= maxNewIndexSoFar) {
6825 maxNewIndexSoFar = newIndex;
6826 }
6827 else {
6828 moved = true;
6829 }
6830 patch(prevChild, c2[newIndex], container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6831 patched++;
6832 }
6833 }
6834 // 5.3 move and mount
6835 // generate longest stable subsequence only when nodes have moved
6836 const increasingNewIndexSequence = moved
6837 ? getSequence(newIndexToOldIndexMap)
6838 : EMPTY_ARR;
6839 j = increasingNewIndexSequence.length - 1;
6840 // looping backwards so that we can use last patched node as anchor
6841 for (i = toBePatched - 1; i >= 0; i--) {
6842 const nextIndex = s2 + i;
6843 const nextChild = c2[nextIndex];
6844 const anchor = nextIndex + 1 < l2 ? c2[nextIndex + 1].el : parentAnchor;
6845 if (newIndexToOldIndexMap[i] === 0) {
6846 // mount new
6847 patch(null, nextChild, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6848 }
6849 else if (moved) {
6850 // move if:
6851 // There is no stable subsequence (e.g. a reverse)
6852 // OR current node is not among the stable sequence
6853 if (j < 0 || i !== increasingNewIndexSequence[j]) {
6854 move(nextChild, container, anchor, 2 /* REORDER */);
6855 }
6856 else {
6857 j--;
6858 }
6859 }
6860 }
6861 }
6862 };
6863 const move = (vnode, container, anchor, moveType, parentSuspense = null) => {
6864 const { el, type, transition, children, shapeFlag } = vnode;
6865 if (shapeFlag & 6 /* COMPONENT */) {
6866 move(vnode.component.subTree, container, anchor, moveType);
6867 return;
6868 }
6869 if (shapeFlag & 128 /* SUSPENSE */) {
6870 vnode.suspense.move(container, anchor, moveType);
6871 return;
6872 }
6873 if (shapeFlag & 64 /* TELEPORT */) {
6874 type.move(vnode, container, anchor, internals);
6875 return;
6876 }
6877 if (type === Fragment) {
6878 hostInsert(el, container, anchor);
6879 for (let i = 0; i < children.length; i++) {
6880 move(children[i], container, anchor, moveType);
6881 }
6882 hostInsert(vnode.anchor, container, anchor);
6883 return;
6884 }
6885 if (type === Static) {
6886 moveStaticNode(vnode, container, anchor);
6887 return;
6888 }
6889 // single nodes
6890 const needTransition = moveType !== 2 /* REORDER */ &&
6891 shapeFlag & 1 /* ELEMENT */ &&
6892 transition;
6893 if (needTransition) {
6894 if (moveType === 0 /* ENTER */) {
6895 transition.beforeEnter(el);
6896 hostInsert(el, container, anchor);
6897 queuePostRenderEffect(() => transition.enter(el), parentSuspense);
6898 }
6899 else {
6900 const { leave, delayLeave, afterLeave } = transition;
6901 const remove = () => hostInsert(el, container, anchor);
6902 const performLeave = () => {
6903 leave(el, () => {
6904 remove();
6905 afterLeave && afterLeave();
6906 });
6907 };
6908 if (delayLeave) {
6909 delayLeave(el, remove, performLeave);
6910 }
6911 else {
6912 performLeave();
6913 }
6914 }
6915 }
6916 else {
6917 hostInsert(el, container, anchor);
6918 }
6919 };
6920 const unmount = (vnode, parentComponent, parentSuspense, doRemove = false, optimized = false) => {
6921 const { type, props, ref, children, dynamicChildren, shapeFlag, patchFlag, dirs } = vnode;
6922 // unset ref
6923 if (ref != null) {
6924 setRef(ref, null, parentSuspense, vnode, true);
6925 }
6926 if (shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) {
6927 parentComponent.ctx.deactivate(vnode);
6928 return;
6929 }
6930 const shouldInvokeDirs = shapeFlag & 1 /* ELEMENT */ && dirs;
6931 const shouldInvokeVnodeHook = !isAsyncWrapper(vnode);
6932 let vnodeHook;
6933 if (shouldInvokeVnodeHook &&
6934 (vnodeHook = props && props.onVnodeBeforeUnmount)) {
6935 invokeVNodeHook(vnodeHook, parentComponent, vnode);
6936 }
6937 if (shapeFlag & 6 /* COMPONENT */) {
6938 unmountComponent(vnode.component, parentSuspense, doRemove);
6939 }
6940 else {
6941 if (shapeFlag & 128 /* SUSPENSE */) {
6942 vnode.suspense.unmount(parentSuspense, doRemove);
6943 return;
6944 }
6945 if (shouldInvokeDirs) {
6946 invokeDirectiveHook(vnode, null, parentComponent, 'beforeUnmount');
6947 }
6948 if (shapeFlag & 64 /* TELEPORT */) {
6949 vnode.type.remove(vnode, parentComponent, parentSuspense, optimized, internals, doRemove);
6950 }
6951 else if (dynamicChildren &&
6952 // #1153: fast path should not be taken for non-stable (v-for) fragments
6953 (type !== Fragment ||
6954 (patchFlag > 0 && patchFlag & 64 /* STABLE_FRAGMENT */))) {
6955 // fast path for block nodes: only need to unmount dynamic children.
6956 unmountChildren(dynamicChildren, parentComponent, parentSuspense, false, true);
6957 }
6958 else if ((type === Fragment &&
6959 patchFlag &
6960 (128 /* KEYED_FRAGMENT */ | 256 /* UNKEYED_FRAGMENT */)) ||
6961 (!optimized && shapeFlag & 16 /* ARRAY_CHILDREN */)) {
6962 unmountChildren(children, parentComponent, parentSuspense);
6963 }
6964 if (doRemove) {
6965 remove(vnode);
6966 }
6967 }
6968 if ((shouldInvokeVnodeHook &&
6969 (vnodeHook = props && props.onVnodeUnmounted)) ||
6970 shouldInvokeDirs) {
6971 queuePostRenderEffect(() => {
6972 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
6973 shouldInvokeDirs &&
6974 invokeDirectiveHook(vnode, null, parentComponent, 'unmounted');
6975 }, parentSuspense);
6976 }
6977 };
6978 const remove = vnode => {
6979 const { type, el, anchor, transition } = vnode;
6980 if (type === Fragment) {
6981 removeFragment(el, anchor);
6982 return;
6983 }
6984 if (type === Static) {
6985 removeStaticNode(vnode);
6986 return;
6987 }
6988 const performRemove = () => {
6989 hostRemove(el);
6990 if (transition && !transition.persisted && transition.afterLeave) {
6991 transition.afterLeave();
6992 }
6993 };
6994 if (vnode.shapeFlag & 1 /* ELEMENT */ &&
6995 transition &&
6996 !transition.persisted) {
6997 const { leave, delayLeave } = transition;
6998 const performLeave = () => leave(el, performRemove);
6999 if (delayLeave) {
7000 delayLeave(vnode.el, performRemove, performLeave);
7001 }
7002 else {
7003 performLeave();
7004 }
7005 }
7006 else {
7007 performRemove();
7008 }
7009 };
7010 const removeFragment = (cur, end) => {
7011 // For fragments, directly remove all contained DOM nodes.
7012 // (fragment child nodes cannot have transition)
7013 let next;
7014 while (cur !== end) {
7015 next = hostNextSibling(cur);
7016 hostRemove(cur);
7017 cur = next;
7018 }
7019 hostRemove(end);
7020 };
7021 const unmountComponent = (instance, parentSuspense, doRemove) => {
7022 if (instance.type.__hmrId) {
7023 unregisterHMR(instance);
7024 }
7025 const { bum, scope, update, subTree, um } = instance;
7026 // beforeUnmount hook
7027 if (bum) {
7028 invokeArrayFns(bum);
7029 }
7030 // stop effects in component scope
7031 scope.stop();
7032 // update may be null if a component is unmounted before its async
7033 // setup has resolved.
7034 if (update) {
7035 // so that scheduler will no longer invoke it
7036 update.active = false;
7037 unmount(subTree, instance, parentSuspense, doRemove);
7038 }
7039 // unmounted hook
7040 if (um) {
7041 queuePostRenderEffect(um, parentSuspense);
7042 }
7043 queuePostRenderEffect(() => {
7044 instance.isUnmounted = true;
7045 }, parentSuspense);
7046 // A component with async dep inside a pending suspense is unmounted before
7047 // its async dep resolves. This should remove the dep from the suspense, and
7048 // cause the suspense to resolve immediately if that was the last dep.
7049 if (parentSuspense &&
7050 parentSuspense.pendingBranch &&
7051 !parentSuspense.isUnmounted &&
7052 instance.asyncDep &&
7053 !instance.asyncResolved &&
7054 instance.suspenseId === parentSuspense.pendingId) {
7055 parentSuspense.deps--;
7056 if (parentSuspense.deps === 0) {
7057 parentSuspense.resolve();
7058 }
7059 }
7060 {
7061 devtoolsComponentRemoved(instance);
7062 }
7063 };
7064 const unmountChildren = (children, parentComponent, parentSuspense, doRemove = false, optimized = false, start = 0) => {
7065 for (let i = start; i < children.length; i++) {
7066 unmount(children[i], parentComponent, parentSuspense, doRemove, optimized);
7067 }
7068 };
7069 const getNextHostNode = vnode => {
7070 if (vnode.shapeFlag & 6 /* COMPONENT */) {
7071 return getNextHostNode(vnode.component.subTree);
7072 }
7073 if (vnode.shapeFlag & 128 /* SUSPENSE */) {
7074 return vnode.suspense.next();
7075 }
7076 return hostNextSibling((vnode.anchor || vnode.el));
7077 };
7078 const render = (vnode, container, isSVG) => {
7079 if (vnode == null) {
7080 if (container._vnode) {
7081 unmount(container._vnode, null, null, true);
7082 }
7083 }
7084 else {
7085 patch(container._vnode || null, vnode, container, null, null, null, isSVG);
7086 }
7087 flushPostFlushCbs();
7088 container._vnode = vnode;
7089 };
7090 const internals = {
7091 p: patch,
7092 um: unmount,
7093 m: move,
7094 r: remove,
7095 mt: mountComponent,
7096 mc: mountChildren,
7097 pc: patchChildren,
7098 pbc: patchBlockChildren,
7099 n: getNextHostNode,
7100 o: options
7101 };
7102 let hydrate;
7103 let hydrateNode;
7104 if (createHydrationFns) {
7105 [hydrate, hydrateNode] = createHydrationFns(internals);
7106 }
7107 return {
7108 render,
7109 hydrate,
7110 createApp: createAppAPI(render, hydrate)
7111 };
7112 }
7113 function toggleRecurse({ effect, update }, allowed) {
7114 effect.allowRecurse = update.allowRecurse = allowed;
7115 }
7116 /**
7117 * #1156
7118 * When a component is HMR-enabled, we need to make sure that all static nodes
7119 * inside a block also inherit the DOM element from the previous tree so that
7120 * HMR updates (which are full updates) can retrieve the element for patching.
7121 *
7122 * #2080
7123 * Inside keyed `template` fragment static children, if a fragment is moved,
7124 * the children will always be moved. Therefore, in order to ensure correct move
7125 * position, el should be inherited from previous nodes.
7126 */
7127 function traverseStaticChildren(n1, n2, shallow = false) {
7128 const ch1 = n1.children;
7129 const ch2 = n2.children;
7130 if (isArray(ch1) && isArray(ch2)) {
7131 for (let i = 0; i < ch1.length; i++) {
7132 // this is only called in the optimized path so array children are
7133 // guaranteed to be vnodes
7134 const c1 = ch1[i];
7135 let c2 = ch2[i];
7136 if (c2.shapeFlag & 1 /* ELEMENT */ && !c2.dynamicChildren) {
7137 if (c2.patchFlag <= 0 || c2.patchFlag === 32 /* HYDRATE_EVENTS */) {
7138 c2 = ch2[i] = cloneIfMounted(ch2[i]);
7139 c2.el = c1.el;
7140 }
7141 if (!shallow)
7142 traverseStaticChildren(c1, c2);
7143 }
7144 // also inherit for comment nodes, but not placeholders (e.g. v-if which
7145 // would have received .el during block patch)
7146 if (c2.type === Comment && !c2.el) {
7147 c2.el = c1.el;
7148 }
7149 }
7150 }
7151 }
7152 // https://en.wikipedia.org/wiki/Longest_increasing_subsequence
7153 function getSequence(arr) {
7154 const p = arr.slice();
7155 const result = [0];
7156 let i, j, u, v, c;
7157 const len = arr.length;
7158 for (i = 0; i < len; i++) {
7159 const arrI = arr[i];
7160 if (arrI !== 0) {
7161 j = result[result.length - 1];
7162 if (arr[j] < arrI) {
7163 p[i] = j;
7164 result.push(i);
7165 continue;
7166 }
7167 u = 0;
7168 v = result.length - 1;
7169 while (u < v) {
7170 c = (u + v) >> 1;
7171 if (arr[result[c]] < arrI) {
7172 u = c + 1;
7173 }
7174 else {
7175 v = c;
7176 }
7177 }
7178 if (arrI < arr[result[u]]) {
7179 if (u > 0) {
7180 p[i] = result[u - 1];
7181 }
7182 result[u] = i;
7183 }
7184 }
7185 }
7186 u = result.length;
7187 v = result[u - 1];
7188 while (u-- > 0) {
7189 result[u] = v;
7190 v = p[v];
7191 }
7192 return result;
7193 }
7194
7195 const isTeleport = (type) => type.__isTeleport;
7196 const isTeleportDisabled = (props) => props && (props.disabled || props.disabled === '');
7197 const isTargetSVG = (target) => typeof SVGElement !== 'undefined' && target instanceof SVGElement;
7198 const resolveTarget = (props, select) => {
7199 const targetSelector = props && props.to;
7200 if (isString(targetSelector)) {
7201 if (!select) {
7202 warn$1(`Current renderer does not support string target for Teleports. ` +
7203 `(missing querySelector renderer option)`);
7204 return null;
7205 }
7206 else {
7207 const target = select(targetSelector);
7208 if (!target) {
7209 warn$1(`Failed to locate Teleport target with selector "${targetSelector}". ` +
7210 `Note the target element must exist before the component is mounted - ` +
7211 `i.e. the target cannot be rendered by the component itself, and ` +
7212 `ideally should be outside of the entire Vue component tree.`);
7213 }
7214 return target;
7215 }
7216 }
7217 else {
7218 if (!targetSelector && !isTeleportDisabled(props)) {
7219 warn$1(`Invalid Teleport target: ${targetSelector}`);
7220 }
7221 return targetSelector;
7222 }
7223 };
7224 const TeleportImpl = {
7225 __isTeleport: true,
7226 process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
7227 const { mc: mountChildren, pc: patchChildren, pbc: patchBlockChildren, o: { insert, querySelector, createText, createComment } } = internals;
7228 const disabled = isTeleportDisabled(n2.props);
7229 let { shapeFlag, children, dynamicChildren } = n2;
7230 // #3302
7231 // HMR updated, force full diff
7232 if (isHmrUpdating) {
7233 optimized = false;
7234 dynamicChildren = null;
7235 }
7236 if (n1 == null) {
7237 // insert anchors in the main view
7238 const placeholder = (n2.el = createComment('teleport start')
7239 );
7240 const mainAnchor = (n2.anchor = createComment('teleport end')
7241 );
7242 insert(placeholder, container, anchor);
7243 insert(mainAnchor, container, anchor);
7244 const target = (n2.target = resolveTarget(n2.props, querySelector));
7245 const targetAnchor = (n2.targetAnchor = createText(''));
7246 if (target) {
7247 insert(targetAnchor, target);
7248 // #2652 we could be teleporting from a non-SVG tree into an SVG tree
7249 isSVG = isSVG || isTargetSVG(target);
7250 }
7251 else if (!disabled) {
7252 warn$1('Invalid Teleport target on mount:', target, `(${typeof target})`);
7253 }
7254 const mount = (container, anchor) => {
7255 // Teleport *always* has Array children. This is enforced in both the
7256 // compiler and vnode children normalization.
7257 if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
7258 mountChildren(children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7259 }
7260 };
7261 if (disabled) {
7262 mount(container, mainAnchor);
7263 }
7264 else if (target) {
7265 mount(target, targetAnchor);
7266 }
7267 }
7268 else {
7269 // update content
7270 n2.el = n1.el;
7271 const mainAnchor = (n2.anchor = n1.anchor);
7272 const target = (n2.target = n1.target);
7273 const targetAnchor = (n2.targetAnchor = n1.targetAnchor);
7274 const wasDisabled = isTeleportDisabled(n1.props);
7275 const currentContainer = wasDisabled ? container : target;
7276 const currentAnchor = wasDisabled ? mainAnchor : targetAnchor;
7277 isSVG = isSVG || isTargetSVG(target);
7278 if (dynamicChildren) {
7279 // fast path when the teleport happens to be a block root
7280 patchBlockChildren(n1.dynamicChildren, dynamicChildren, currentContainer, parentComponent, parentSuspense, isSVG, slotScopeIds);
7281 // even in block tree mode we need to make sure all root-level nodes
7282 // in the teleport inherit previous DOM references so that they can
7283 // be moved in future patches.
7284 traverseStaticChildren(n1, n2, true);
7285 }
7286 else if (!optimized) {
7287 patchChildren(n1, n2, currentContainer, currentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, false);
7288 }
7289 if (disabled) {
7290 if (!wasDisabled) {
7291 // enabled -> disabled
7292 // move into main container
7293 moveTeleport(n2, container, mainAnchor, internals, 1 /* TOGGLE */);
7294 }
7295 }
7296 else {
7297 // target changed
7298 if ((n2.props && n2.props.to) !== (n1.props && n1.props.to)) {
7299 const nextTarget = (n2.target = resolveTarget(n2.props, querySelector));
7300 if (nextTarget) {
7301 moveTeleport(n2, nextTarget, null, internals, 0 /* TARGET_CHANGE */);
7302 }
7303 else {
7304 warn$1('Invalid Teleport target on update:', target, `(${typeof target})`);
7305 }
7306 }
7307 else if (wasDisabled) {
7308 // disabled -> enabled
7309 // move into teleport target
7310 moveTeleport(n2, target, targetAnchor, internals, 1 /* TOGGLE */);
7311 }
7312 }
7313 }
7314 },
7315 remove(vnode, parentComponent, parentSuspense, optimized, { um: unmount, o: { remove: hostRemove } }, doRemove) {
7316 const { shapeFlag, children, anchor, targetAnchor, target, props } = vnode;
7317 if (target) {
7318 hostRemove(targetAnchor);
7319 }
7320 // an unmounted teleport should always remove its children if not disabled
7321 if (doRemove || !isTeleportDisabled(props)) {
7322 hostRemove(anchor);
7323 if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
7324 for (let i = 0; i < children.length; i++) {
7325 const child = children[i];
7326 unmount(child, parentComponent, parentSuspense, true, !!child.dynamicChildren);
7327 }
7328 }
7329 }
7330 },
7331 move: moveTeleport,
7332 hydrate: hydrateTeleport
7333 };
7334 function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, moveType = 2 /* REORDER */) {
7335 // move target anchor if this is a target change.
7336 if (moveType === 0 /* TARGET_CHANGE */) {
7337 insert(vnode.targetAnchor, container, parentAnchor);
7338 }
7339 const { el, anchor, shapeFlag, children, props } = vnode;
7340 const isReorder = moveType === 2 /* REORDER */;
7341 // move main view anchor if this is a re-order.
7342 if (isReorder) {
7343 insert(el, container, parentAnchor);
7344 }
7345 // if this is a re-order and teleport is enabled (content is in target)
7346 // do not move children. So the opposite is: only move children if this
7347 // is not a reorder, or the teleport is disabled
7348 if (!isReorder || isTeleportDisabled(props)) {
7349 // Teleport has either Array children or no children.
7350 if (shapeFlag & 16 /* ARRAY_CHILDREN */) {
7351 for (let i = 0; i < children.length; i++) {
7352 move(children[i], container, parentAnchor, 2 /* REORDER */);
7353 }
7354 }
7355 }
7356 // move main view anchor if this is a re-order.
7357 if (isReorder) {
7358 insert(anchor, container, parentAnchor);
7359 }
7360 }
7361 function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, { o: { nextSibling, parentNode, querySelector } }, hydrateChildren) {
7362 const target = (vnode.target = resolveTarget(vnode.props, querySelector));
7363 if (target) {
7364 // if multiple teleports rendered to the same target element, we need to
7365 // pick up from where the last teleport finished instead of the first node
7366 const targetNode = target._lpa || target.firstChild;
7367 if (vnode.shapeFlag & 16 /* ARRAY_CHILDREN */) {
7368 if (isTeleportDisabled(vnode.props)) {
7369 vnode.anchor = hydrateChildren(nextSibling(node), vnode, parentNode(node), parentComponent, parentSuspense, slotScopeIds, optimized);
7370 vnode.targetAnchor = targetNode;
7371 }
7372 else {
7373 vnode.anchor = nextSibling(node);
7374 vnode.targetAnchor = hydrateChildren(targetNode, vnode, target, parentComponent, parentSuspense, slotScopeIds, optimized);
7375 }
7376 target._lpa =
7377 vnode.targetAnchor && nextSibling(vnode.targetAnchor);
7378 }
7379 }
7380 return vnode.anchor && nextSibling(vnode.anchor);
7381 }
7382 // Force-casted public typing for h and TSX props inference
7383 const Teleport = TeleportImpl;
7384
7385 const COMPONENTS = 'components';
7386 const DIRECTIVES = 'directives';
7387 /**
7388 * @private
7389 */
7390 function resolveComponent(name, maybeSelfReference) {
7391 return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
7392 }
7393 const NULL_DYNAMIC_COMPONENT = Symbol();
7394 /**
7395 * @private
7396 */
7397 function resolveDynamicComponent(component) {
7398 if (isString(component)) {
7399 return resolveAsset(COMPONENTS, component, false) || component;
7400 }
7401 else {
7402 // invalid types will fallthrough to createVNode and raise warning
7403 return (component || NULL_DYNAMIC_COMPONENT);
7404 }
7405 }
7406 /**
7407 * @private
7408 */
7409 function resolveDirective(name) {
7410 return resolveAsset(DIRECTIVES, name);
7411 }
7412 // implementation
7413 function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
7414 const instance = currentRenderingInstance || currentInstance;
7415 if (instance) {
7416 const Component = instance.type;
7417 // explicit self name has highest priority
7418 if (type === COMPONENTS) {
7419 const selfName = getComponentName(Component);
7420 if (selfName &&
7421 (selfName === name ||
7422 selfName === camelize(name) ||
7423 selfName === capitalize(camelize(name)))) {
7424 return Component;
7425 }
7426 }
7427 const res =
7428 // local registration
7429 // check instance[type] first which is resolved for options API
7430 resolve(instance[type] || Component[type], name) ||
7431 // global registration
7432 resolve(instance.appContext[type], name);
7433 if (!res && maybeSelfReference) {
7434 // fallback to implicit self-reference
7435 return Component;
7436 }
7437 if (warnMissing && !res) {
7438 const extra = type === COMPONENTS
7439 ? `\nIf this is a native custom element, make sure to exclude it from ` +
7440 `component resolution via compilerOptions.isCustomElement.`
7441 : ``;
7442 warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
7443 }
7444 return res;
7445 }
7446 else {
7447 warn$1(`resolve${capitalize(type.slice(0, -1))} ` +
7448 `can only be used in render() or setup().`);
7449 }
7450 }
7451 function resolve(registry, name) {
7452 return (registry &&
7453 (registry[name] ||
7454 registry[camelize(name)] ||
7455 registry[capitalize(camelize(name))]));
7456 }
7457
7458 const Fragment = Symbol('Fragment' );
7459 const Text = Symbol('Text' );
7460 const Comment = Symbol('Comment' );
7461 const Static = Symbol('Static' );
7462 // Since v-if and v-for are the two possible ways node structure can dynamically
7463 // change, once we consider v-if branches and each v-for fragment a block, we
7464 // can divide a template into nested blocks, and within each block the node
7465 // structure would be stable. This allows us to skip most children diffing
7466 // and only worry about the dynamic nodes (indicated by patch flags).
7467 const blockStack = [];
7468 let currentBlock = null;
7469 /**
7470 * Open a block.
7471 * This must be called before `createBlock`. It cannot be part of `createBlock`
7472 * because the children of the block are evaluated before `createBlock` itself
7473 * is called. The generated code typically looks like this:
7474 *
7475 * ```js
7476 * function render() {
7477 * return (openBlock(),createBlock('div', null, [...]))
7478 * }
7479 * ```
7480 * disableTracking is true when creating a v-for fragment block, since a v-for
7481 * fragment always diffs its children.
7482 *
7483 * @private
7484 */
7485 function openBlock(disableTracking = false) {
7486 blockStack.push((currentBlock = disableTracking ? null : []));
7487 }
7488 function closeBlock() {
7489 blockStack.pop();
7490 currentBlock = blockStack[blockStack.length - 1] || null;
7491 }
7492 // Whether we should be tracking dynamic child nodes inside a block.
7493 // Only tracks when this value is > 0
7494 // We are not using a simple boolean because this value may need to be
7495 // incremented/decremented by nested usage of v-once (see below)
7496 let isBlockTreeEnabled = 1;
7497 /**
7498 * Block tracking sometimes needs to be disabled, for example during the
7499 * creation of a tree that needs to be cached by v-once. The compiler generates
7500 * code like this:
7501 *
7502 * ``` js
7503 * _cache[1] || (
7504 * setBlockTracking(-1),
7505 * _cache[1] = createVNode(...),
7506 * setBlockTracking(1),
7507 * _cache[1]
7508 * )
7509 * ```
7510 *
7511 * @private
7512 */
7513 function setBlockTracking(value) {
7514 isBlockTreeEnabled += value;
7515 }
7516 function setupBlock(vnode) {
7517 // save current block children on the block vnode
7518 vnode.dynamicChildren =
7519 isBlockTreeEnabled > 0 ? currentBlock || EMPTY_ARR : null;
7520 // close block
7521 closeBlock();
7522 // a block is always going to be patched, so track it as a child of its
7523 // parent block
7524 if (isBlockTreeEnabled > 0 && currentBlock) {
7525 currentBlock.push(vnode);
7526 }
7527 return vnode;
7528 }
7529 /**
7530 * @private
7531 */
7532 function createElementBlock(type, props, children, patchFlag, dynamicProps, shapeFlag) {
7533 return setupBlock(createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, true /* isBlock */));
7534 }
7535 /**
7536 * Create a block root vnode. Takes the same exact arguments as `createVNode`.
7537 * A block root keeps track of dynamic nodes within the block in the
7538 * `dynamicChildren` array.
7539 *
7540 * @private
7541 */
7542 function createBlock(type, props, children, patchFlag, dynamicProps) {
7543 return setupBlock(createVNode(type, props, children, patchFlag, dynamicProps, true /* isBlock: prevent a block from tracking itself */));
7544 }
7545 function isVNode(value) {
7546 return value ? value.__v_isVNode === true : false;
7547 }
7548 function isSameVNodeType(n1, n2) {
7549 if (n2.shapeFlag & 6 /* COMPONENT */ &&
7550 hmrDirtyComponents.has(n2.type)) {
7551 // HMR only: if the component has been hot-updated, force a reload.
7552 return false;
7553 }
7554 return n1.type === n2.type && n1.key === n2.key;
7555 }
7556 let vnodeArgsTransformer;
7557 /**
7558 * Internal API for registering an arguments transform for createVNode
7559 * used for creating stubs in the test-utils
7560 * It is *internal* but needs to be exposed for test-utils to pick up proper
7561 * typings
7562 */
7563 function transformVNodeArgs(transformer) {
7564 vnodeArgsTransformer = transformer;
7565 }
7566 const createVNodeWithArgsTransform = (...args) => {
7567 return _createVNode(...(vnodeArgsTransformer
7568 ? vnodeArgsTransformer(args, currentRenderingInstance)
7569 : args));
7570 };
7571 const InternalObjectKey = `__vInternal`;
7572 const normalizeKey = ({ key }) => key != null ? key : null;
7573 const normalizeRef = ({ ref, ref_key, ref_for }) => {
7574 return (ref != null
7575 ? isString(ref) || isRef(ref) || isFunction(ref)
7576 ? { i: currentRenderingInstance, r: ref, k: ref_key, f: !!ref_for }
7577 : ref
7578 : null);
7579 };
7580 function createBaseVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, shapeFlag = type === Fragment ? 0 : 1 /* ELEMENT */, isBlockNode = false, needFullChildrenNormalization = false) {
7581 const vnode = {
7582 __v_isVNode: true,
7583 __v_skip: true,
7584 type,
7585 props,
7586 key: props && normalizeKey(props),
7587 ref: props && normalizeRef(props),
7588 scopeId: currentScopeId,
7589 slotScopeIds: null,
7590 children,
7591 component: null,
7592 suspense: null,
7593 ssContent: null,
7594 ssFallback: null,
7595 dirs: null,
7596 transition: null,
7597 el: null,
7598 anchor: null,
7599 target: null,
7600 targetAnchor: null,
7601 staticCount: 0,
7602 shapeFlag,
7603 patchFlag,
7604 dynamicProps,
7605 dynamicChildren: null,
7606 appContext: null
7607 };
7608 if (needFullChildrenNormalization) {
7609 normalizeChildren(vnode, children);
7610 // normalize suspense children
7611 if (shapeFlag & 128 /* SUSPENSE */) {
7612 type.normalize(vnode);
7613 }
7614 }
7615 else if (children) {
7616 // compiled element vnode - if children is passed, only possible types are
7617 // string or Array.
7618 vnode.shapeFlag |= isString(children)
7619 ? 8 /* TEXT_CHILDREN */
7620 : 16 /* ARRAY_CHILDREN */;
7621 }
7622 // validate key
7623 if (vnode.key !== vnode.key) {
7624 warn$1(`VNode created with invalid key (NaN). VNode type:`, vnode.type);
7625 }
7626 // track vnode for block tree
7627 if (isBlockTreeEnabled > 0 &&
7628 // avoid a block node from tracking itself
7629 !isBlockNode &&
7630 // has current parent block
7631 currentBlock &&
7632 // presence of a patch flag indicates this node needs patching on updates.
7633 // component nodes also should always be patched, because even if the
7634 // component doesn't need to update, it needs to persist the instance on to
7635 // the next vnode so that it can be properly unmounted later.
7636 (vnode.patchFlag > 0 || shapeFlag & 6 /* COMPONENT */) &&
7637 // the EVENTS flag is only for hydration and if it is the only flag, the
7638 // vnode should not be considered dynamic due to handler caching.
7639 vnode.patchFlag !== 32 /* HYDRATE_EVENTS */) {
7640 currentBlock.push(vnode);
7641 }
7642 return vnode;
7643 }
7644 const createVNode = (createVNodeWithArgsTransform );
7645 function _createVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, isBlockNode = false) {
7646 if (!type || type === NULL_DYNAMIC_COMPONENT) {
7647 if (!type) {
7648 warn$1(`Invalid vnode type when creating vnode: ${type}.`);
7649 }
7650 type = Comment;
7651 }
7652 if (isVNode(type)) {
7653 // createVNode receiving an existing vnode. This happens in cases like
7654 // <component :is="vnode"/>
7655 // #2078 make sure to merge refs during the clone instead of overwriting it
7656 const cloned = cloneVNode(type, props, true /* mergeRef: true */);
7657 if (children) {
7658 normalizeChildren(cloned, children);
7659 }
7660 return cloned;
7661 }
7662 // class component normalization.
7663 if (isClassComponent(type)) {
7664 type = type.__vccOpts;
7665 }
7666 // class & style normalization.
7667 if (props) {
7668 // for reactive or proxy objects, we need to clone it to enable mutation.
7669 props = guardReactiveProps(props);
7670 let { class: klass, style } = props;
7671 if (klass && !isString(klass)) {
7672 props.class = normalizeClass(klass);
7673 }
7674 if (isObject(style)) {
7675 // reactive state objects need to be cloned since they are likely to be
7676 // mutated
7677 if (isProxy(style) && !isArray(style)) {
7678 style = extend({}, style);
7679 }
7680 props.style = normalizeStyle(style);
7681 }
7682 }
7683 // encode the vnode type information into a bitmap
7684 const shapeFlag = isString(type)
7685 ? 1 /* ELEMENT */
7686 : isSuspense(type)
7687 ? 128 /* SUSPENSE */
7688 : isTeleport(type)
7689 ? 64 /* TELEPORT */
7690 : isObject(type)
7691 ? 4 /* STATEFUL_COMPONENT */
7692 : isFunction(type)
7693 ? 2 /* FUNCTIONAL_COMPONENT */
7694 : 0;
7695 if (shapeFlag & 4 /* STATEFUL_COMPONENT */ && isProxy(type)) {
7696 type = toRaw(type);
7697 warn$1(`Vue received a Component which was made a reactive object. This can ` +
7698 `lead to unnecessary performance overhead, and should be avoided by ` +
7699 `marking the component with \`markRaw\` or using \`shallowRef\` ` +
7700 `instead of \`ref\`.`, `\nComponent that was made reactive: `, type);
7701 }
7702 return createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, isBlockNode, true);
7703 }
7704 function guardReactiveProps(props) {
7705 if (!props)
7706 return null;
7707 return isProxy(props) || InternalObjectKey in props
7708 ? extend({}, props)
7709 : props;
7710 }
7711 function cloneVNode(vnode, extraProps, mergeRef = false) {
7712 // This is intentionally NOT using spread or extend to avoid the runtime
7713 // key enumeration cost.
7714 const { props, ref, patchFlag, children } = vnode;
7715 const mergedProps = extraProps ? mergeProps(props || {}, extraProps) : props;
7716 const cloned = {
7717 __v_isVNode: true,
7718 __v_skip: true,
7719 type: vnode.type,
7720 props: mergedProps,
7721 key: mergedProps && normalizeKey(mergedProps),
7722 ref: extraProps && extraProps.ref
7723 ? // #2078 in the case of <component :is="vnode" ref="extra"/>
7724 // if the vnode itself already has a ref, cloneVNode will need to merge
7725 // the refs so the single vnode can be set on multiple refs
7726 mergeRef && ref
7727 ? isArray(ref)
7728 ? ref.concat(normalizeRef(extraProps))
7729 : [ref, normalizeRef(extraProps)]
7730 : normalizeRef(extraProps)
7731 : ref,
7732 scopeId: vnode.scopeId,
7733 slotScopeIds: vnode.slotScopeIds,
7734 children: patchFlag === -1 /* HOISTED */ && isArray(children)
7735 ? children.map(deepCloneVNode)
7736 : children,
7737 target: vnode.target,
7738 targetAnchor: vnode.targetAnchor,
7739 staticCount: vnode.staticCount,
7740 shapeFlag: vnode.shapeFlag,
7741 // if the vnode is cloned with extra props, we can no longer assume its
7742 // existing patch flag to be reliable and need to add the FULL_PROPS flag.
7743 // note: preserve flag for fragments since they use the flag for children
7744 // fast paths only.
7745 patchFlag: extraProps && vnode.type !== Fragment
7746 ? patchFlag === -1 // hoisted node
7747 ? 16 /* FULL_PROPS */
7748 : patchFlag | 16 /* FULL_PROPS */
7749 : patchFlag,
7750 dynamicProps: vnode.dynamicProps,
7751 dynamicChildren: vnode.dynamicChildren,
7752 appContext: vnode.appContext,
7753 dirs: vnode.dirs,
7754 transition: vnode.transition,
7755 // These should technically only be non-null on mounted VNodes. However,
7756 // they *should* be copied for kept-alive vnodes. So we just always copy
7757 // them since them being non-null during a mount doesn't affect the logic as
7758 // they will simply be overwritten.
7759 component: vnode.component,
7760 suspense: vnode.suspense,
7761 ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
7762 ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
7763 el: vnode.el,
7764 anchor: vnode.anchor
7765 };
7766 return cloned;
7767 }
7768 /**
7769 * Dev only, for HMR of hoisted vnodes reused in v-for
7770 * https://github.com/vitejs/vite/issues/2022
7771 */
7772 function deepCloneVNode(vnode) {
7773 const cloned = cloneVNode(vnode);
7774 if (isArray(vnode.children)) {
7775 cloned.children = vnode.children.map(deepCloneVNode);
7776 }
7777 return cloned;
7778 }
7779 /**
7780 * @private
7781 */
7782 function createTextVNode(text = ' ', flag = 0) {
7783 return createVNode(Text, null, text, flag);
7784 }
7785 /**
7786 * @private
7787 */
7788 function createStaticVNode(content, numberOfNodes) {
7789 // A static vnode can contain multiple stringified elements, and the number
7790 // of elements is necessary for hydration.
7791 const vnode = createVNode(Static, null, content);
7792 vnode.staticCount = numberOfNodes;
7793 return vnode;
7794 }
7795 /**
7796 * @private
7797 */
7798 function createCommentVNode(text = '',
7799 // when used as the v-else branch, the comment node must be created as a
7800 // block to ensure correct updates.
7801 asBlock = false) {
7802 return asBlock
7803 ? (openBlock(), createBlock(Comment, null, text))
7804 : createVNode(Comment, null, text);
7805 }
7806 function normalizeVNode(child) {
7807 if (child == null || typeof child === 'boolean') {
7808 // empty placeholder
7809 return createVNode(Comment);
7810 }
7811 else if (isArray(child)) {
7812 // fragment
7813 return createVNode(Fragment, null,
7814 // #3666, avoid reference pollution when reusing vnode
7815 child.slice());
7816 }
7817 else if (typeof child === 'object') {
7818 // already vnode, this should be the most common since compiled templates
7819 // always produce all-vnode children arrays
7820 return cloneIfMounted(child);
7821 }
7822 else {
7823 // strings and numbers
7824 return createVNode(Text, null, String(child));
7825 }
7826 }
7827 // optimized normalization for template-compiled render fns
7828 function cloneIfMounted(child) {
7829 return child.el === null || child.memo ? child : cloneVNode(child);
7830 }
7831 function normalizeChildren(vnode, children) {
7832 let type = 0;
7833 const { shapeFlag } = vnode;
7834 if (children == null) {
7835 children = null;
7836 }
7837 else if (isArray(children)) {
7838 type = 16 /* ARRAY_CHILDREN */;
7839 }
7840 else if (typeof children === 'object') {
7841 if (shapeFlag & (1 /* ELEMENT */ | 64 /* TELEPORT */)) {
7842 // Normalize slot to plain children for plain element and Teleport
7843 const slot = children.default;
7844 if (slot) {
7845 // _c marker is added by withCtx() indicating this is a compiled slot
7846 slot._c && (slot._d = false);
7847 normalizeChildren(vnode, slot());
7848 slot._c && (slot._d = true);
7849 }
7850 return;
7851 }
7852 else {
7853 type = 32 /* SLOTS_CHILDREN */;
7854 const slotFlag = children._;
7855 if (!slotFlag && !(InternalObjectKey in children)) {
7856 children._ctx = currentRenderingInstance;
7857 }
7858 else if (slotFlag === 3 /* FORWARDED */ && currentRenderingInstance) {
7859 // a child component receives forwarded slots from the parent.
7860 // its slot type is determined by its parent's slot type.
7861 if (currentRenderingInstance.slots._ === 1 /* STABLE */) {
7862 children._ = 1 /* STABLE */;
7863 }
7864 else {
7865 children._ = 2 /* DYNAMIC */;
7866 vnode.patchFlag |= 1024 /* DYNAMIC_SLOTS */;
7867 }
7868 }
7869 }
7870 }
7871 else if (isFunction(children)) {
7872 children = { default: children, _ctx: currentRenderingInstance };
7873 type = 32 /* SLOTS_CHILDREN */;
7874 }
7875 else {
7876 children = String(children);
7877 // force teleport children to array so it can be moved around
7878 if (shapeFlag & 64 /* TELEPORT */) {
7879 type = 16 /* ARRAY_CHILDREN */;
7880 children = [createTextVNode(children)];
7881 }
7882 else {
7883 type = 8 /* TEXT_CHILDREN */;
7884 }
7885 }
7886 vnode.children = children;
7887 vnode.shapeFlag |= type;
7888 }
7889 function mergeProps(...args) {
7890 const ret = {};
7891 for (let i = 0; i < args.length; i++) {
7892 const toMerge = args[i];
7893 for (const key in toMerge) {
7894 if (key === 'class') {
7895 if (ret.class !== toMerge.class) {
7896 ret.class = normalizeClass([ret.class, toMerge.class]);
7897 }
7898 }
7899 else if (key === 'style') {
7900 ret.style = normalizeStyle([ret.style, toMerge.style]);
7901 }
7902 else if (isOn(key)) {
7903 const existing = ret[key];
7904 const incoming = toMerge[key];
7905 if (incoming &&
7906 existing !== incoming &&
7907 !(isArray(existing) && existing.includes(incoming))) {
7908 ret[key] = existing
7909 ? [].concat(existing, incoming)
7910 : incoming;
7911 }
7912 }
7913 else if (key !== '') {
7914 ret[key] = toMerge[key];
7915 }
7916 }
7917 }
7918 return ret;
7919 }
7920 function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
7921 callWithAsyncErrorHandling(hook, instance, 7 /* VNODE_HOOK */, [
7922 vnode,
7923 prevVNode
7924 ]);
7925 }
7926
7927 /**
7928 * Actual implementation
7929 */
7930 function renderList(source, renderItem, cache, index) {
7931 let ret;
7932 const cached = (cache && cache[index]);
7933 if (isArray(source) || isString(source)) {
7934 ret = new Array(source.length);
7935 for (let i = 0, l = source.length; i < l; i++) {
7936 ret[i] = renderItem(source[i], i, undefined, cached && cached[i]);
7937 }
7938 }
7939 else if (typeof source === 'number') {
7940 if (!Number.isInteger(source)) {
7941 warn$1(`The v-for range expect an integer value but got ${source}.`);
7942 return [];
7943 }
7944 ret = new Array(source);
7945 for (let i = 0; i < source; i++) {
7946 ret[i] = renderItem(i + 1, i, undefined, cached && cached[i]);
7947 }
7948 }
7949 else if (isObject(source)) {
7950 if (source[Symbol.iterator]) {
7951 ret = Array.from(source, (item, i) => renderItem(item, i, undefined, cached && cached[i]));
7952 }
7953 else {
7954 const keys = Object.keys(source);
7955 ret = new Array(keys.length);
7956 for (let i = 0, l = keys.length; i < l; i++) {
7957 const key = keys[i];
7958 ret[i] = renderItem(source[key], key, i, cached && cached[i]);
7959 }
7960 }
7961 }
7962 else {
7963 ret = [];
7964 }
7965 if (cache) {
7966 cache[index] = ret;
7967 }
7968 return ret;
7969 }
7970
7971 /**
7972 * Compiler runtime helper for creating dynamic slots object
7973 * @private
7974 */
7975 function createSlots(slots, dynamicSlots) {
7976 for (let i = 0; i < dynamicSlots.length; i++) {
7977 const slot = dynamicSlots[i];
7978 // array of dynamic slot generated by <template v-for="..." #[...]>
7979 if (isArray(slot)) {
7980 for (let j = 0; j < slot.length; j++) {
7981 slots[slot[j].name] = slot[j].fn;
7982 }
7983 }
7984 else if (slot) {
7985 // conditional single slot generated by <template v-if="..." #foo>
7986 slots[slot.name] = slot.fn;
7987 }
7988 }
7989 return slots;
7990 }
7991
7992 /**
7993 * Compiler runtime helper for rendering `<slot/>`
7994 * @private
7995 */
7996 function renderSlot(slots, name, props = {},
7997 // this is not a user-facing function, so the fallback is always generated by
7998 // the compiler and guaranteed to be a function returning an array
7999 fallback, noSlotted) {
8000 if (currentRenderingInstance.isCE) {
8001 return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
8002 }
8003 let slot = slots[name];
8004 if (slot && slot.length > 1) {
8005 warn$1(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
8006 `function. You need to mark this component with $dynamic-slots in the ` +
8007 `parent template.`);
8008 slot = () => [];
8009 }
8010 // a compiled slot disables block tracking by default to avoid manual
8011 // invocation interfering with template-based block tracking, but in
8012 // `renderSlot` we can be sure that it's template-based so we can force
8013 // enable it.
8014 if (slot && slot._c) {
8015 slot._d = false;
8016 }
8017 openBlock();
8018 const validSlotContent = slot && ensureValidVNode(slot(props));
8019 const rendered = createBlock(Fragment, { key: props.key || `_${name}` }, validSlotContent || (fallback ? fallback() : []), validSlotContent && slots._ === 1 /* STABLE */
8020 ? 64 /* STABLE_FRAGMENT */
8021 : -2 /* BAIL */);
8022 if (!noSlotted && rendered.scopeId) {
8023 rendered.slotScopeIds = [rendered.scopeId + '-s'];
8024 }
8025 if (slot && slot._c) {
8026 slot._d = true;
8027 }
8028 return rendered;
8029 }
8030 function ensureValidVNode(vnodes) {
8031 return vnodes.some(child => {
8032 if (!isVNode(child))
8033 return true;
8034 if (child.type === Comment)
8035 return false;
8036 if (child.type === Fragment &&
8037 !ensureValidVNode(child.children))
8038 return false;
8039 return true;
8040 })
8041 ? vnodes
8042 : null;
8043 }
8044
8045 /**
8046 * For prefixing keys in v-on="obj" with "on"
8047 * @private
8048 */
8049 function toHandlers(obj) {
8050 const ret = {};
8051 if (!isObject(obj)) {
8052 warn$1(`v-on with no argument expects an object value.`);
8053 return ret;
8054 }
8055 for (const key in obj) {
8056 ret[toHandlerKey(key)] = obj[key];
8057 }
8058 return ret;
8059 }
8060
8061 /**
8062 * #2437 In Vue 3, functional components do not have a public instance proxy but
8063 * they exist in the internal parent chain. For code that relies on traversing
8064 * public $parent chains, skip functional ones and go to the parent instead.
8065 */
8066 const getPublicInstance = (i) => {
8067 if (!i)
8068 return null;
8069 if (isStatefulComponent(i))
8070 return getExposeProxy(i) || i.proxy;
8071 return getPublicInstance(i.parent);
8072 };
8073 const publicPropertiesMap = extend(Object.create(null), {
8074 $: i => i,
8075 $el: i => i.vnode.el,
8076 $data: i => i.data,
8077 $props: i => (shallowReadonly(i.props) ),
8078 $attrs: i => (shallowReadonly(i.attrs) ),
8079 $slots: i => (shallowReadonly(i.slots) ),
8080 $refs: i => (shallowReadonly(i.refs) ),
8081 $parent: i => getPublicInstance(i.parent),
8082 $root: i => getPublicInstance(i.root),
8083 $emit: i => i.emit,
8084 $options: i => (resolveMergedOptions(i) ),
8085 $forceUpdate: i => () => queueJob(i.update),
8086 $nextTick: i => nextTick.bind(i.proxy),
8087 $watch: i => (instanceWatch.bind(i) )
8088 });
8089 const PublicInstanceProxyHandlers = {
8090 get({ _: instance }, key) {
8091 const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
8092 // for internal formatters to know that this is a Vue instance
8093 if (key === '__isVue') {
8094 return true;
8095 }
8096 // prioritize <script setup> bindings during dev.
8097 // this allows even properties that start with _ or $ to be used - so that
8098 // it aligns with the production behavior where the render fn is inlined and
8099 // indeed has access to all declared variables.
8100 if (setupState !== EMPTY_OBJ &&
8101 setupState.__isScriptSetup &&
8102 hasOwn(setupState, key)) {
8103 return setupState[key];
8104 }
8105 // data / props / ctx
8106 // This getter gets called for every property access on the render context
8107 // during render and is a major hotspot. The most expensive part of this
8108 // is the multiple hasOwn() calls. It's much faster to do a simple property
8109 // access on a plain object, so we use an accessCache object (with null
8110 // prototype) to memoize what access type a key corresponds to.
8111 let normalizedProps;
8112 if (key[0] !== '$') {
8113 const n = accessCache[key];
8114 if (n !== undefined) {
8115 switch (n) {
8116 case 1 /* SETUP */:
8117 return setupState[key];
8118 case 2 /* DATA */:
8119 return data[key];
8120 case 4 /* CONTEXT */:
8121 return ctx[key];
8122 case 3 /* PROPS */:
8123 return props[key];
8124 // default: just fallthrough
8125 }
8126 }
8127 else if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
8128 accessCache[key] = 1 /* SETUP */;
8129 return setupState[key];
8130 }
8131 else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
8132 accessCache[key] = 2 /* DATA */;
8133 return data[key];
8134 }
8135 else if (
8136 // only cache other properties when instance has declared (thus stable)
8137 // props
8138 (normalizedProps = instance.propsOptions[0]) &&
8139 hasOwn(normalizedProps, key)) {
8140 accessCache[key] = 3 /* PROPS */;
8141 return props[key];
8142 }
8143 else if (ctx !== EMPTY_OBJ && hasOwn(ctx, key)) {
8144 accessCache[key] = 4 /* CONTEXT */;
8145 return ctx[key];
8146 }
8147 else if (shouldCacheAccess) {
8148 accessCache[key] = 0 /* OTHER */;
8149 }
8150 }
8151 const publicGetter = publicPropertiesMap[key];
8152 let cssModule, globalProperties;
8153 // public $xxx properties
8154 if (publicGetter) {
8155 if (key === '$attrs') {
8156 track(instance, "get" /* GET */, key);
8157 markAttrsAccessed();
8158 }
8159 return publicGetter(instance);
8160 }
8161 else if (
8162 // css module (injected by vue-loader)
8163 (cssModule = type.__cssModules) &&
8164 (cssModule = cssModule[key])) {
8165 return cssModule;
8166 }
8167 else if (ctx !== EMPTY_OBJ && hasOwn(ctx, key)) {
8168 // user may set custom properties to `this` that start with `$`
8169 accessCache[key] = 4 /* CONTEXT */;
8170 return ctx[key];
8171 }
8172 else if (
8173 // global properties
8174 ((globalProperties = appContext.config.globalProperties),
8175 hasOwn(globalProperties, key))) {
8176 {
8177 return globalProperties[key];
8178 }
8179 }
8180 else if (currentRenderingInstance &&
8181 (!isString(key) ||
8182 // #1091 avoid internal isRef/isVNode checks on component instance leading
8183 // to infinite warning loop
8184 key.indexOf('__v') !== 0)) {
8185 if (data !== EMPTY_OBJ &&
8186 (key[0] === '$' || key[0] === '_') &&
8187 hasOwn(data, key)) {
8188 warn$1(`Property ${JSON.stringify(key)} must be accessed via $data because it starts with a reserved ` +
8189 `character ("$" or "_") and is not proxied on the render context.`);
8190 }
8191 else if (instance === currentRenderingInstance) {
8192 warn$1(`Property ${JSON.stringify(key)} was accessed during render ` +
8193 `but is not defined on instance.`);
8194 }
8195 }
8196 },
8197 set({ _: instance }, key, value) {
8198 const { data, setupState, ctx } = instance;
8199 if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
8200 setupState[key] = value;
8201 return true;
8202 }
8203 else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
8204 data[key] = value;
8205 return true;
8206 }
8207 else if (hasOwn(instance.props, key)) {
8208 warn$1(`Attempting to mutate prop "${key}". Props are readonly.`, instance);
8209 return false;
8210 }
8211 if (key[0] === '$' && key.slice(1) in instance) {
8212 warn$1(`Attempting to mutate public property "${key}". ` +
8213 `Properties starting with $ are reserved and readonly.`, instance);
8214 return false;
8215 }
8216 else {
8217 if (key in instance.appContext.config.globalProperties) {
8218 Object.defineProperty(ctx, key, {
8219 enumerable: true,
8220 configurable: true,
8221 value
8222 });
8223 }
8224 else {
8225 ctx[key] = value;
8226 }
8227 }
8228 return true;
8229 },
8230 has({ _: { data, setupState, accessCache, ctx, appContext, propsOptions } }, key) {
8231 let normalizedProps;
8232 return (!!accessCache[key] ||
8233 (data !== EMPTY_OBJ && hasOwn(data, key)) ||
8234 (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) ||
8235 ((normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key)) ||
8236 hasOwn(ctx, key) ||
8237 hasOwn(publicPropertiesMap, key) ||
8238 hasOwn(appContext.config.globalProperties, key));
8239 },
8240 defineProperty(target, key, descriptor) {
8241 if (descriptor.get != null) {
8242 this.set(target, key, descriptor.get(), null);
8243 }
8244 else if (descriptor.value != null) {
8245 this.set(target, key, descriptor.value, null);
8246 }
8247 return Reflect.defineProperty(target, key, descriptor);
8248 }
8249 };
8250 {
8251 PublicInstanceProxyHandlers.ownKeys = (target) => {
8252 warn$1(`Avoid app logic that relies on enumerating keys on a component instance. ` +
8253 `The keys will be empty in production mode to avoid performance overhead.`);
8254 return Reflect.ownKeys(target);
8255 };
8256 }
8257 const RuntimeCompiledPublicInstanceProxyHandlers = /*#__PURE__*/ extend({}, PublicInstanceProxyHandlers, {
8258 get(target, key) {
8259 // fast path for unscopables when using `with` block
8260 if (key === Symbol.unscopables) {
8261 return;
8262 }
8263 return PublicInstanceProxyHandlers.get(target, key, target);
8264 },
8265 has(_, key) {
8266 const has = key[0] !== '_' && !isGloballyWhitelisted(key);
8267 if (!has && PublicInstanceProxyHandlers.has(_, key)) {
8268 warn$1(`Property ${JSON.stringify(key)} should not start with _ which is a reserved prefix for Vue internals.`);
8269 }
8270 return has;
8271 }
8272 });
8273 // dev only
8274 // In dev mode, the proxy target exposes the same properties as seen on `this`
8275 // for easier console inspection. In prod mode it will be an empty object so
8276 // these properties definitions can be skipped.
8277 function createDevRenderContext(instance) {
8278 const target = {};
8279 // expose internal instance for proxy handlers
8280 Object.defineProperty(target, `_`, {
8281 configurable: true,
8282 enumerable: false,
8283 get: () => instance
8284 });
8285 // expose public properties
8286 Object.keys(publicPropertiesMap).forEach(key => {
8287 Object.defineProperty(target, key, {
8288 configurable: true,
8289 enumerable: false,
8290 get: () => publicPropertiesMap[key](instance),
8291 // intercepted by the proxy so no need for implementation,
8292 // but needed to prevent set errors
8293 set: NOOP
8294 });
8295 });
8296 return target;
8297 }
8298 // dev only
8299 function exposePropsOnRenderContext(instance) {
8300 const { ctx, propsOptions: [propsOptions] } = instance;
8301 if (propsOptions) {
8302 Object.keys(propsOptions).forEach(key => {
8303 Object.defineProperty(ctx, key, {
8304 enumerable: true,
8305 configurable: true,
8306 get: () => instance.props[key],
8307 set: NOOP
8308 });
8309 });
8310 }
8311 }
8312 // dev only
8313 function exposeSetupStateOnRenderContext(instance) {
8314 const { ctx, setupState } = instance;
8315 Object.keys(toRaw(setupState)).forEach(key => {
8316 if (!setupState.__isScriptSetup) {
8317 if (key[0] === '$' || key[0] === '_') {
8318 warn$1(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
8319 `which are reserved prefixes for Vue internals.`);
8320 return;
8321 }
8322 Object.defineProperty(ctx, key, {
8323 enumerable: true,
8324 configurable: true,
8325 get: () => setupState[key],
8326 set: NOOP
8327 });
8328 }
8329 });
8330 }
8331
8332 const emptyAppContext = createAppContext();
8333 let uid$1 = 0;
8334 function createComponentInstance(vnode, parent, suspense) {
8335 const type = vnode.type;
8336 // inherit parent app context - or - if root, adopt from root vnode
8337 const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
8338 const instance = {
8339 uid: uid$1++,
8340 vnode,
8341 type,
8342 parent,
8343 appContext,
8344 root: null,
8345 next: null,
8346 subTree: null,
8347 effect: null,
8348 update: null,
8349 scope: new EffectScope(true /* detached */),
8350 render: null,
8351 proxy: null,
8352 exposed: null,
8353 exposeProxy: null,
8354 withProxy: null,
8355 provides: parent ? parent.provides : Object.create(appContext.provides),
8356 accessCache: null,
8357 renderCache: [],
8358 // local resovled assets
8359 components: null,
8360 directives: null,
8361 // resolved props and emits options
8362 propsOptions: normalizePropsOptions(type, appContext),
8363 emitsOptions: normalizeEmitsOptions(type, appContext),
8364 // emit
8365 emit: null,
8366 emitted: null,
8367 // props default value
8368 propsDefaults: EMPTY_OBJ,
8369 // inheritAttrs
8370 inheritAttrs: type.inheritAttrs,
8371 // state
8372 ctx: EMPTY_OBJ,
8373 data: EMPTY_OBJ,
8374 props: EMPTY_OBJ,
8375 attrs: EMPTY_OBJ,
8376 slots: EMPTY_OBJ,
8377 refs: EMPTY_OBJ,
8378 setupState: EMPTY_OBJ,
8379 setupContext: null,
8380 // suspense related
8381 suspense,
8382 suspenseId: suspense ? suspense.pendingId : 0,
8383 asyncDep: null,
8384 asyncResolved: false,
8385 // lifecycle hooks
8386 // not using enums here because it results in computed properties
8387 isMounted: false,
8388 isUnmounted: false,
8389 isDeactivated: false,
8390 bc: null,
8391 c: null,
8392 bm: null,
8393 m: null,
8394 bu: null,
8395 u: null,
8396 um: null,
8397 bum: null,
8398 da: null,
8399 a: null,
8400 rtg: null,
8401 rtc: null,
8402 ec: null,
8403 sp: null
8404 };
8405 {
8406 instance.ctx = createDevRenderContext(instance);
8407 }
8408 instance.root = parent ? parent.root : instance;
8409 instance.emit = emit$1.bind(null, instance);
8410 // apply custom element special handling
8411 if (vnode.ce) {
8412 vnode.ce(instance);
8413 }
8414 return instance;
8415 }
8416 let currentInstance = null;
8417 const getCurrentInstance = () => currentInstance || currentRenderingInstance;
8418 const setCurrentInstance = (instance) => {
8419 currentInstance = instance;
8420 instance.scope.on();
8421 };
8422 const unsetCurrentInstance = () => {
8423 currentInstance && currentInstance.scope.off();
8424 currentInstance = null;
8425 };
8426 const isBuiltInTag = /*#__PURE__*/ makeMap('slot,component');
8427 function validateComponentName(name, config) {
8428 const appIsNativeTag = config.isNativeTag || NO;
8429 if (isBuiltInTag(name) || appIsNativeTag(name)) {
8430 warn$1('Do not use built-in or reserved HTML elements as component id: ' + name);
8431 }
8432 }
8433 function isStatefulComponent(instance) {
8434 return instance.vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */;
8435 }
8436 let isInSSRComponentSetup = false;
8437 function setupComponent(instance, isSSR = false) {
8438 isInSSRComponentSetup = isSSR;
8439 const { props, children } = instance.vnode;
8440 const isStateful = isStatefulComponent(instance);
8441 initProps(instance, props, isStateful, isSSR);
8442 initSlots(instance, children);
8443 const setupResult = isStateful
8444 ? setupStatefulComponent(instance, isSSR)
8445 : undefined;
8446 isInSSRComponentSetup = false;
8447 return setupResult;
8448 }
8449 function setupStatefulComponent(instance, isSSR) {
8450 const Component = instance.type;
8451 {
8452 if (Component.name) {
8453 validateComponentName(Component.name, instance.appContext.config);
8454 }
8455 if (Component.components) {
8456 const names = Object.keys(Component.components);
8457 for (let i = 0; i < names.length; i++) {
8458 validateComponentName(names[i], instance.appContext.config);
8459 }
8460 }
8461 if (Component.directives) {
8462 const names = Object.keys(Component.directives);
8463 for (let i = 0; i < names.length; i++) {
8464 validateDirectiveName(names[i]);
8465 }
8466 }
8467 if (Component.compilerOptions && isRuntimeOnly()) {
8468 warn$1(`"compilerOptions" is only supported when using a build of Vue that ` +
8469 `includes the runtime compiler. Since you are using a runtime-only ` +
8470 `build, the options should be passed via your build tool config instead.`);
8471 }
8472 }
8473 // 0. create render proxy property access cache
8474 instance.accessCache = Object.create(null);
8475 // 1. create public instance / render proxy
8476 // also mark it raw so it's never observed
8477 instance.proxy = markRaw(new Proxy(instance.ctx, PublicInstanceProxyHandlers));
8478 {
8479 exposePropsOnRenderContext(instance);
8480 }
8481 // 2. call setup()
8482 const { setup } = Component;
8483 if (setup) {
8484 const setupContext = (instance.setupContext =
8485 setup.length > 1 ? createSetupContext(instance) : null);
8486 setCurrentInstance(instance);
8487 pauseTracking();
8488 const setupResult = callWithErrorHandling(setup, instance, 0 /* SETUP_FUNCTION */, [shallowReadonly(instance.props) , setupContext]);
8489 resetTracking();
8490 unsetCurrentInstance();
8491 if (isPromise(setupResult)) {
8492 setupResult.then(unsetCurrentInstance, unsetCurrentInstance);
8493 if (isSSR) {
8494 // return the promise so server-renderer can wait on it
8495 return setupResult
8496 .then((resolvedResult) => {
8497 handleSetupResult(instance, resolvedResult, isSSR);
8498 })
8499 .catch(e => {
8500 handleError(e, instance, 0 /* SETUP_FUNCTION */);
8501 });
8502 }
8503 else {
8504 // async setup returned Promise.
8505 // bail here and wait for re-entry.
8506 instance.asyncDep = setupResult;
8507 }
8508 }
8509 else {
8510 handleSetupResult(instance, setupResult, isSSR);
8511 }
8512 }
8513 else {
8514 finishComponentSetup(instance, isSSR);
8515 }
8516 }
8517 function handleSetupResult(instance, setupResult, isSSR) {
8518 if (isFunction(setupResult)) {
8519 // setup returned an inline render function
8520 {
8521 instance.render = setupResult;
8522 }
8523 }
8524 else if (isObject(setupResult)) {
8525 if (isVNode(setupResult)) {
8526 warn$1(`setup() should not return VNodes directly - ` +
8527 `return a render function instead.`);
8528 }
8529 // setup returned bindings.
8530 // assuming a render function compiled from template is present.
8531 {
8532 instance.devtoolsRawSetupState = setupResult;
8533 }
8534 instance.setupState = proxyRefs(setupResult);
8535 {
8536 exposeSetupStateOnRenderContext(instance);
8537 }
8538 }
8539 else if (setupResult !== undefined) {
8540 warn$1(`setup() should return an object. Received: ${setupResult === null ? 'null' : typeof setupResult}`);
8541 }
8542 finishComponentSetup(instance, isSSR);
8543 }
8544 let compile;
8545 let installWithProxy;
8546 /**
8547 * For runtime-dom to register the compiler.
8548 * Note the exported method uses any to avoid d.ts relying on the compiler types.
8549 */
8550 function registerRuntimeCompiler(_compile) {
8551 compile = _compile;
8552 installWithProxy = i => {
8553 if (i.render._rc) {
8554 i.withProxy = new Proxy(i.ctx, RuntimeCompiledPublicInstanceProxyHandlers);
8555 }
8556 };
8557 }
8558 // dev only
8559 const isRuntimeOnly = () => !compile;
8560 function finishComponentSetup(instance, isSSR, skipOptions) {
8561 const Component = instance.type;
8562 // template / render function normalization
8563 // could be already set when returned from setup()
8564 if (!instance.render) {
8565 // only do on-the-fly compile if not in SSR - SSR on-the-fly compilation
8566 // is done by server-renderer
8567 if (!isSSR && compile && !Component.render) {
8568 const template = Component.template;
8569 if (template) {
8570 {
8571 startMeasure(instance, `compile`);
8572 }
8573 const { isCustomElement, compilerOptions } = instance.appContext.config;
8574 const { delimiters, compilerOptions: componentCompilerOptions } = Component;
8575 const finalCompilerOptions = extend(extend({
8576 isCustomElement,
8577 delimiters
8578 }, compilerOptions), componentCompilerOptions);
8579 Component.render = compile(template, finalCompilerOptions);
8580 {
8581 endMeasure(instance, `compile`);
8582 }
8583 }
8584 }
8585 instance.render = (Component.render || NOOP);
8586 // for runtime-compiled render functions using `with` blocks, the render
8587 // proxy used needs a different `has` handler which is more performant and
8588 // also only allows a whitelist of globals to fallthrough.
8589 if (installWithProxy) {
8590 installWithProxy(instance);
8591 }
8592 }
8593 // support for 2.x options
8594 {
8595 setCurrentInstance(instance);
8596 pauseTracking();
8597 applyOptions(instance);
8598 resetTracking();
8599 unsetCurrentInstance();
8600 }
8601 // warn missing template/render
8602 // the runtime compilation of template in SSR is done by server-render
8603 if (!Component.render && instance.render === NOOP && !isSSR) {
8604 /* istanbul ignore if */
8605 if (!compile && Component.template) {
8606 warn$1(`Component provided template option but ` +
8607 `runtime compilation is not supported in this build of Vue.` +
8608 (` Use "vue.global.js" instead.`
8609 ) /* should not happen */);
8610 }
8611 else {
8612 warn$1(`Component is missing template or render function.`);
8613 }
8614 }
8615 }
8616 function createAttrsProxy(instance) {
8617 return new Proxy(instance.attrs, {
8618 get(target, key) {
8619 markAttrsAccessed();
8620 track(instance, "get" /* GET */, '$attrs');
8621 return target[key];
8622 },
8623 set() {
8624 warn$1(`setupContext.attrs is readonly.`);
8625 return false;
8626 },
8627 deleteProperty() {
8628 warn$1(`setupContext.attrs is readonly.`);
8629 return false;
8630 }
8631 }
8632 );
8633 }
8634 function createSetupContext(instance) {
8635 const expose = exposed => {
8636 if (instance.exposed) {
8637 warn$1(`expose() should be called only once per setup().`);
8638 }
8639 instance.exposed = exposed || {};
8640 };
8641 let attrs;
8642 {
8643 // We use getters in dev in case libs like test-utils overwrite instance
8644 // properties (overwrites should not be done in prod)
8645 return Object.freeze({
8646 get attrs() {
8647 return attrs || (attrs = createAttrsProxy(instance));
8648 },
8649 get slots() {
8650 return shallowReadonly(instance.slots);
8651 },
8652 get emit() {
8653 return (event, ...args) => instance.emit(event, ...args);
8654 },
8655 expose
8656 });
8657 }
8658 }
8659 function getExposeProxy(instance) {
8660 if (instance.exposed) {
8661 return (instance.exposeProxy ||
8662 (instance.exposeProxy = new Proxy(proxyRefs(markRaw(instance.exposed)), {
8663 get(target, key) {
8664 if (key in target) {
8665 return target[key];
8666 }
8667 else if (key in publicPropertiesMap) {
8668 return publicPropertiesMap[key](instance);
8669 }
8670 }
8671 })));
8672 }
8673 }
8674 const classifyRE = /(?:^|[-_])(\w)/g;
8675 const classify = (str) => str.replace(classifyRE, c => c.toUpperCase()).replace(/[-_]/g, '');
8676 function getComponentName(Component) {
8677 return isFunction(Component)
8678 ? Component.displayName || Component.name
8679 : Component.name;
8680 }
8681 /* istanbul ignore next */
8682 function formatComponentName(instance, Component, isRoot = false) {
8683 let name = getComponentName(Component);
8684 if (!name && Component.__file) {
8685 const match = Component.__file.match(/([^/\\]+)\.\w+$/);
8686 if (match) {
8687 name = match[1];
8688 }
8689 }
8690 if (!name && instance && instance.parent) {
8691 // try to infer the name based on reverse resolution
8692 const inferFromRegistry = (registry) => {
8693 for (const key in registry) {
8694 if (registry[key] === Component) {
8695 return key;
8696 }
8697 }
8698 };
8699 name =
8700 inferFromRegistry(instance.components ||
8701 instance.parent.type.components) || inferFromRegistry(instance.appContext.components);
8702 }
8703 return name ? classify(name) : isRoot ? `App` : `Anonymous`;
8704 }
8705 function isClassComponent(value) {
8706 return isFunction(value) && '__vccOpts' in value;
8707 }
8708
8709 const computed$1 = ((getterOrOptions, debugOptions) => {
8710 // @ts-ignore
8711 return computed(getterOrOptions, debugOptions, isInSSRComponentSetup);
8712 });
8713
8714 // dev only
8715 const warnRuntimeUsage = (method) => warn$1(`${method}() is a compiler-hint helper that is only usable inside ` +
8716 `<script setup> of a single file component. Its arguments should be ` +
8717 `compiled away and passing it at runtime has no effect.`);
8718 // implementation
8719 function defineProps() {
8720 {
8721 warnRuntimeUsage(`defineProps`);
8722 }
8723 return null;
8724 }
8725 // implementation
8726 function defineEmits() {
8727 {
8728 warnRuntimeUsage(`defineEmits`);
8729 }
8730 return null;
8731 }
8732 /**
8733 * Vue `<script setup>` compiler macro for declaring a component's exposed
8734 * instance properties when it is accessed by a parent component via template
8735 * refs.
8736 *
8737 * `<script setup>` components are closed by default - i.e. variables inside
8738 * the `<script setup>` scope is not exposed to parent unless explicitly exposed
8739 * via `defineExpose`.
8740 *
8741 * This is only usable inside `<script setup>`, is compiled away in the
8742 * output and should **not** be actually called at runtime.
8743 */
8744 function defineExpose(exposed) {
8745 {
8746 warnRuntimeUsage(`defineExpose`);
8747 }
8748 }
8749 /**
8750 * Vue `<script setup>` compiler macro for providing props default values when
8751 * using type-based `defineProps` declaration.
8752 *
8753 * Example usage:
8754 * ```ts
8755 * withDefaults(defineProps<{
8756 * size?: number
8757 * labels?: string[]
8758 * }>(), {
8759 * size: 3,
8760 * labels: () => ['default label']
8761 * })
8762 * ```
8763 *
8764 * This is only usable inside `<script setup>`, is compiled away in the output
8765 * and should **not** be actually called at runtime.
8766 */
8767 function withDefaults(props, defaults) {
8768 {
8769 warnRuntimeUsage(`withDefaults`);
8770 }
8771 return null;
8772 }
8773 function useSlots() {
8774 return getContext().slots;
8775 }
8776 function useAttrs() {
8777 return getContext().attrs;
8778 }
8779 function getContext() {
8780 const i = getCurrentInstance();
8781 if (!i) {
8782 warn$1(`useContext() called without active instance.`);
8783 }
8784 return i.setupContext || (i.setupContext = createSetupContext(i));
8785 }
8786 /**
8787 * Runtime helper for merging default declarations. Imported by compiled code
8788 * only.
8789 * @internal
8790 */
8791 function mergeDefaults(raw, defaults) {
8792 const props = isArray(raw)
8793 ? raw.reduce((normalized, p) => ((normalized[p] = {}), normalized), {})
8794 : raw;
8795 for (const key in defaults) {
8796 const opt = props[key];
8797 if (opt) {
8798 if (isArray(opt) || isFunction(opt)) {
8799 props[key] = { type: opt, default: defaults[key] };
8800 }
8801 else {
8802 opt.default = defaults[key];
8803 }
8804 }
8805 else if (opt === null) {
8806 props[key] = { default: defaults[key] };
8807 }
8808 else {
8809 warn$1(`props default key "${key}" has no corresponding declaration.`);
8810 }
8811 }
8812 return props;
8813 }
8814 /**
8815 * Used to create a proxy for the rest element when destructuring props with
8816 * defineProps().
8817 * @internal
8818 */
8819 function createPropsRestProxy(props, excludedKeys) {
8820 const ret = {};
8821 for (const key in props) {
8822 if (!excludedKeys.includes(key)) {
8823 Object.defineProperty(ret, key, {
8824 enumerable: true,
8825 get: () => props[key]
8826 });
8827 }
8828 }
8829 return ret;
8830 }
8831 /**
8832 * `<script setup>` helper for persisting the current instance context over
8833 * async/await flows.
8834 *
8835 * `@vue/compiler-sfc` converts the following:
8836 *
8837 * ```ts
8838 * const x = await foo()
8839 * ```
8840 *
8841 * into:
8842 *
8843 * ```ts
8844 * let __temp, __restore
8845 * const x = (([__temp, __restore] = withAsyncContext(() => foo())),__temp=await __temp,__restore(),__temp)
8846 * ```
8847 * @internal
8848 */
8849 function withAsyncContext(getAwaitable) {
8850 const ctx = getCurrentInstance();
8851 if (!ctx) {
8852 warn$1(`withAsyncContext called without active current instance. ` +
8853 `This is likely a bug.`);
8854 }
8855 let awaitable = getAwaitable();
8856 unsetCurrentInstance();
8857 if (isPromise(awaitable)) {
8858 awaitable = awaitable.catch(e => {
8859 setCurrentInstance(ctx);
8860 throw e;
8861 });
8862 }
8863 return [awaitable, () => setCurrentInstance(ctx)];
8864 }
8865
8866 // Actual implementation
8867 function h(type, propsOrChildren, children) {
8868 const l = arguments.length;
8869 if (l === 2) {
8870 if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
8871 // single vnode without props
8872 if (isVNode(propsOrChildren)) {
8873 return createVNode(type, null, [propsOrChildren]);
8874 }
8875 // props without children
8876 return createVNode(type, propsOrChildren);
8877 }
8878 else {
8879 // omit props
8880 return createVNode(type, null, propsOrChildren);
8881 }
8882 }
8883 else {
8884 if (l > 3) {
8885 children = Array.prototype.slice.call(arguments, 2);
8886 }
8887 else if (l === 3 && isVNode(children)) {
8888 children = [children];
8889 }
8890 return createVNode(type, propsOrChildren, children);
8891 }
8892 }
8893
8894 const ssrContextKey = Symbol(`ssrContext` );
8895 const useSSRContext = () => {
8896 {
8897 warn$1(`useSSRContext() is not supported in the global build.`);
8898 }
8899 };
8900
8901 function initCustomFormatter() {
8902 /* eslint-disable no-restricted-globals */
8903 if (typeof window === 'undefined') {
8904 return;
8905 }
8906 const vueStyle = { style: 'color:#3ba776' };
8907 const numberStyle = { style: 'color:#0b1bc9' };
8908 const stringStyle = { style: 'color:#b62e24' };
8909 const keywordStyle = { style: 'color:#9d288c' };
8910 // custom formatter for Chrome
8911 // https://www.mattzeunert.com/2016/02/19/custom-chrome-devtools-object-formatters.html
8912 const formatter = {
8913 header(obj) {
8914 // TODO also format ComponentPublicInstance & ctx.slots/attrs in setup
8915 if (!isObject(obj)) {
8916 return null;
8917 }
8918 if (obj.__isVue) {
8919 return ['div', vueStyle, `VueInstance`];
8920 }
8921 else if (isRef(obj)) {
8922 return [
8923 'div',
8924 {},
8925 ['span', vueStyle, genRefFlag(obj)],
8926 '<',
8927 formatValue(obj.value),
8928 `>`
8929 ];
8930 }
8931 else if (isReactive(obj)) {
8932 return [
8933 'div',
8934 {},
8935 ['span', vueStyle, isShallow(obj) ? 'ShallowReactive' : 'Reactive'],
8936 '<',
8937 formatValue(obj),
8938 `>${isReadonly(obj) ? ` (readonly)` : ``}`
8939 ];
8940 }
8941 else if (isReadonly(obj)) {
8942 return [
8943 'div',
8944 {},
8945 ['span', vueStyle, isShallow(obj) ? 'ShallowReadonly' : 'Readonly'],
8946 '<',
8947 formatValue(obj),
8948 '>'
8949 ];
8950 }
8951 return null;
8952 },
8953 hasBody(obj) {
8954 return obj && obj.__isVue;
8955 },
8956 body(obj) {
8957 if (obj && obj.__isVue) {
8958 return [
8959 'div',
8960 {},
8961 ...formatInstance(obj.$)
8962 ];
8963 }
8964 }
8965 };
8966 function formatInstance(instance) {
8967 const blocks = [];
8968 if (instance.type.props && instance.props) {
8969 blocks.push(createInstanceBlock('props', toRaw(instance.props)));
8970 }
8971 if (instance.setupState !== EMPTY_OBJ) {
8972 blocks.push(createInstanceBlock('setup', instance.setupState));
8973 }
8974 if (instance.data !== EMPTY_OBJ) {
8975 blocks.push(createInstanceBlock('data', toRaw(instance.data)));
8976 }
8977 const computed = extractKeys(instance, 'computed');
8978 if (computed) {
8979 blocks.push(createInstanceBlock('computed', computed));
8980 }
8981 const injected = extractKeys(instance, 'inject');
8982 if (injected) {
8983 blocks.push(createInstanceBlock('injected', injected));
8984 }
8985 blocks.push([
8986 'div',
8987 {},
8988 [
8989 'span',
8990 {
8991 style: keywordStyle.style + ';opacity:0.66'
8992 },
8993 '$ (internal): '
8994 ],
8995 ['object', { object: instance }]
8996 ]);
8997 return blocks;
8998 }
8999 function createInstanceBlock(type, target) {
9000 target = extend({}, target);
9001 if (!Object.keys(target).length) {
9002 return ['span', {}];
9003 }
9004 return [
9005 'div',
9006 { style: 'line-height:1.25em;margin-bottom:0.6em' },
9007 [
9008 'div',
9009 {
9010 style: 'color:#476582'
9011 },
9012 type
9013 ],
9014 [
9015 'div',
9016 {
9017 style: 'padding-left:1.25em'
9018 },
9019 ...Object.keys(target).map(key => {
9020 return [
9021 'div',
9022 {},
9023 ['span', keywordStyle, key + ': '],
9024 formatValue(target[key], false)
9025 ];
9026 })
9027 ]
9028 ];
9029 }
9030 function formatValue(v, asRaw = true) {
9031 if (typeof v === 'number') {
9032 return ['span', numberStyle, v];
9033 }
9034 else if (typeof v === 'string') {
9035 return ['span', stringStyle, JSON.stringify(v)];
9036 }
9037 else if (typeof v === 'boolean') {
9038 return ['span', keywordStyle, v];
9039 }
9040 else if (isObject(v)) {
9041 return ['object', { object: asRaw ? toRaw(v) : v }];
9042 }
9043 else {
9044 return ['span', stringStyle, String(v)];
9045 }
9046 }
9047 function extractKeys(instance, type) {
9048 const Comp = instance.type;
9049 if (isFunction(Comp)) {
9050 return;
9051 }
9052 const extracted = {};
9053 for (const key in instance.ctx) {
9054 if (isKeyOfType(Comp, key, type)) {
9055 extracted[key] = instance.ctx[key];
9056 }
9057 }
9058 return extracted;
9059 }
9060 function isKeyOfType(Comp, key, type) {
9061 const opts = Comp[type];
9062 if ((isArray(opts) && opts.includes(key)) ||
9063 (isObject(opts) && key in opts)) {
9064 return true;
9065 }
9066 if (Comp.extends && isKeyOfType(Comp.extends, key, type)) {
9067 return true;
9068 }
9069 if (Comp.mixins && Comp.mixins.some(m => isKeyOfType(m, key, type))) {
9070 return true;
9071 }
9072 }
9073 function genRefFlag(v) {
9074 if (isShallow(v)) {
9075 return `ShallowRef`;
9076 }
9077 if (v.effect) {
9078 return `ComputedRef`;
9079 }
9080 return `Ref`;
9081 }
9082 if (window.devtoolsFormatters) {
9083 window.devtoolsFormatters.push(formatter);
9084 }
9085 else {
9086 window.devtoolsFormatters = [formatter];
9087 }
9088 }
9089
9090 function withMemo(memo, render, cache, index) {
9091 const cached = cache[index];
9092 if (cached && isMemoSame(cached, memo)) {
9093 return cached;
9094 }
9095 const ret = render();
9096 // shallow clone
9097 ret.memo = memo.slice();
9098 return (cache[index] = ret);
9099 }
9100 function isMemoSame(cached, memo) {
9101 const prev = cached.memo;
9102 if (prev.length != memo.length) {
9103 return false;
9104 }
9105 for (let i = 0; i < prev.length; i++) {
9106 if (prev[i] !== memo[i]) {
9107 return false;
9108 }
9109 }
9110 // make sure to let parent block track it when returning cached
9111 if (isBlockTreeEnabled > 0 && currentBlock) {
9112 currentBlock.push(cached);
9113 }
9114 return true;
9115 }
9116
9117 // Core API ------------------------------------------------------------------
9118 const version = "3.2.31";
9119 /**
9120 * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
9121 * @internal
9122 */
9123 const ssrUtils = (null);
9124 /**
9125 * @internal only exposed in compat builds
9126 */
9127 const resolveFilter = null;
9128 /**
9129 * @internal only exposed in compat builds.
9130 */
9131 const compatUtils = (null);
9132
9133 const svgNS = 'http://www.w3.org/2000/svg';
9134 const doc = (typeof document !== 'undefined' ? document : null);
9135 const templateContainer = doc && doc.createElement('template');
9136 const nodeOps = {
9137 insert: (child, parent, anchor) => {
9138 parent.insertBefore(child, anchor || null);
9139 },
9140 remove: child => {
9141 const parent = child.parentNode;
9142 if (parent) {
9143 parent.removeChild(child);
9144 }
9145 },
9146 createElement: (tag, isSVG, is, props) => {
9147 const el = isSVG
9148 ? doc.createElementNS(svgNS, tag)
9149 : doc.createElement(tag, is ? { is } : undefined);
9150 if (tag === 'select' && props && props.multiple != null) {
9151 el.setAttribute('multiple', props.multiple);
9152 }
9153 return el;
9154 },
9155 createText: text => doc.createTextNode(text),
9156 createComment: text => doc.createComment(text),
9157 setText: (node, text) => {
9158 node.nodeValue = text;
9159 },
9160 setElementText: (el, text) => {
9161 el.textContent = text;
9162 },
9163 parentNode: node => node.parentNode,
9164 nextSibling: node => node.nextSibling,
9165 querySelector: selector => doc.querySelector(selector),
9166 setScopeId(el, id) {
9167 el.setAttribute(id, '');
9168 },
9169 cloneNode(el) {
9170 const cloned = el.cloneNode(true);
9171 // #3072
9172 // - in `patchDOMProp`, we store the actual value in the `el._value` property.
9173 // - normally, elements using `:value` bindings will not be hoisted, but if
9174 // the bound value is a constant, e.g. `:value="true"` - they do get
9175 // hoisted.
9176 // - in production, hoisted nodes are cloned when subsequent inserts, but
9177 // cloneNode() does not copy the custom property we attached.
9178 // - This may need to account for other custom DOM properties we attach to
9179 // elements in addition to `_value` in the future.
9180 if (`_value` in el) {
9181 cloned._value = el._value;
9182 }
9183 return cloned;
9184 },
9185 // __UNSAFE__
9186 // Reason: innerHTML.
9187 // Static content here can only come from compiled templates.
9188 // As long as the user only uses trusted templates, this is safe.
9189 insertStaticContent(content, parent, anchor, isSVG, start, end) {
9190 // <parent> before | first ... last | anchor </parent>
9191 const before = anchor ? anchor.previousSibling : parent.lastChild;
9192 // #5308 can only take cached path if:
9193 // - has a single root node
9194 // - nextSibling info is still available
9195 if (start && (start === end || start.nextSibling)) {
9196 // cached
9197 while (true) {
9198 parent.insertBefore(start.cloneNode(true), anchor);
9199 if (start === end || !(start = start.nextSibling))
9200 break;
9201 }
9202 }
9203 else {
9204 // fresh insert
9205 templateContainer.innerHTML = isSVG ? `<svg>${content}</svg>` : content;
9206 const template = templateContainer.content;
9207 if (isSVG) {
9208 // remove outer svg wrapper
9209 const wrapper = template.firstChild;
9210 while (wrapper.firstChild) {
9211 template.appendChild(wrapper.firstChild);
9212 }
9213 template.removeChild(wrapper);
9214 }
9215 parent.insertBefore(template, anchor);
9216 }
9217 return [
9218 // first
9219 before ? before.nextSibling : parent.firstChild,
9220 // last
9221 anchor ? anchor.previousSibling : parent.lastChild
9222 ];
9223 }
9224 };
9225
9226 // compiler should normalize class + :class bindings on the same element
9227 // into a single binding ['staticClass', dynamic]
9228 function patchClass(el, value, isSVG) {
9229 // directly setting className should be faster than setAttribute in theory
9230 // if this is an element during a transition, take the temporary transition
9231 // classes into account.
9232 const transitionClasses = el._vtc;
9233 if (transitionClasses) {
9234 value = (value ? [value, ...transitionClasses] : [...transitionClasses]).join(' ');
9235 }
9236 if (value == null) {
9237 el.removeAttribute('class');
9238 }
9239 else if (isSVG) {
9240 el.setAttribute('class', value);
9241 }
9242 else {
9243 el.className = value;
9244 }
9245 }
9246
9247 function patchStyle(el, prev, next) {
9248 const style = el.style;
9249 const isCssString = isString(next);
9250 if (next && !isCssString) {
9251 for (const key in next) {
9252 setStyle(style, key, next[key]);
9253 }
9254 if (prev && !isString(prev)) {
9255 for (const key in prev) {
9256 if (next[key] == null) {
9257 setStyle(style, key, '');
9258 }
9259 }
9260 }
9261 }
9262 else {
9263 const currentDisplay = style.display;
9264 if (isCssString) {
9265 if (prev !== next) {
9266 style.cssText = next;
9267 }
9268 }
9269 else if (prev) {
9270 el.removeAttribute('style');
9271 }
9272 // indicates that the `display` of the element is controlled by `v-show`,
9273 // so we always keep the current `display` value regardless of the `style`
9274 // value, thus handing over control to `v-show`.
9275 if ('_vod' in el) {
9276 style.display = currentDisplay;
9277 }
9278 }
9279 }
9280 const importantRE = /\s*!important$/;
9281 function setStyle(style, name, val) {
9282 if (isArray(val)) {
9283 val.forEach(v => setStyle(style, name, v));
9284 }
9285 else {
9286 if (name.startsWith('--')) {
9287 // custom property definition
9288 style.setProperty(name, val);
9289 }
9290 else {
9291 const prefixed = autoPrefix(style, name);
9292 if (importantRE.test(val)) {
9293 // !important
9294 style.setProperty(hyphenate(prefixed), val.replace(importantRE, ''), 'important');
9295 }
9296 else {
9297 style[prefixed] = val;
9298 }
9299 }
9300 }
9301 }
9302 const prefixes = ['Webkit', 'Moz', 'ms'];
9303 const prefixCache = {};
9304 function autoPrefix(style, rawName) {
9305 const cached = prefixCache[rawName];
9306 if (cached) {
9307 return cached;
9308 }
9309 let name = camelize(rawName);
9310 if (name !== 'filter' && name in style) {
9311 return (prefixCache[rawName] = name);
9312 }
9313 name = capitalize(name);
9314 for (let i = 0; i < prefixes.length; i++) {
9315 const prefixed = prefixes[i] + name;
9316 if (prefixed in style) {
9317 return (prefixCache[rawName] = prefixed);
9318 }
9319 }
9320 return rawName;
9321 }
9322
9323 const xlinkNS = 'http://www.w3.org/1999/xlink';
9324 function patchAttr(el, key, value, isSVG, instance) {
9325 if (isSVG && key.startsWith('xlink:')) {
9326 if (value == null) {
9327 el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
9328 }
9329 else {
9330 el.setAttributeNS(xlinkNS, key, value);
9331 }
9332 }
9333 else {
9334 // note we are only checking boolean attributes that don't have a
9335 // corresponding dom prop of the same name here.
9336 const isBoolean = isSpecialBooleanAttr(key);
9337 if (value == null || (isBoolean && !includeBooleanAttr(value))) {
9338 el.removeAttribute(key);
9339 }
9340 else {
9341 el.setAttribute(key, isBoolean ? '' : value);
9342 }
9343 }
9344 }
9345
9346 // __UNSAFE__
9347 // functions. The user is responsible for using them with only trusted content.
9348 function patchDOMProp(el, key, value,
9349 // the following args are passed only due to potential innerHTML/textContent
9350 // overriding existing VNodes, in which case the old tree must be properly
9351 // unmounted.
9352 prevChildren, parentComponent, parentSuspense, unmountChildren) {
9353 if (key === 'innerHTML' || key === 'textContent') {
9354 if (prevChildren) {
9355 unmountChildren(prevChildren, parentComponent, parentSuspense);
9356 }
9357 el[key] = value == null ? '' : value;
9358 return;
9359 }
9360 if (key === 'value' &&
9361 el.tagName !== 'PROGRESS' &&
9362 // custom elements may use _value internally
9363 !el.tagName.includes('-')) {
9364 // store value as _value as well since
9365 // non-string values will be stringified.
9366 el._value = value;
9367 const newValue = value == null ? '' : value;
9368 if (el.value !== newValue ||
9369 // #4956: always set for OPTION elements because its value falls back to
9370 // textContent if no value attribute is present. And setting .value for
9371 // OPTION has no side effect
9372 el.tagName === 'OPTION') {
9373 el.value = newValue;
9374 }
9375 if (value == null) {
9376 el.removeAttribute(key);
9377 }
9378 return;
9379 }
9380 if (value === '' || value == null) {
9381 const type = typeof el[key];
9382 if (type === 'boolean') {
9383 // e.g. <select multiple> compiles to { multiple: '' }
9384 el[key] = includeBooleanAttr(value);
9385 return;
9386 }
9387 else if (value == null && type === 'string') {
9388 // e.g. <div :id="null">
9389 el[key] = '';
9390 el.removeAttribute(key);
9391 return;
9392 }
9393 else if (type === 'number') {
9394 // e.g. <img :width="null">
9395 // the value of some IDL attr must be greater than 0, e.g. input.size = 0 -> error
9396 try {
9397 el[key] = 0;
9398 }
9399 catch (_a) { }
9400 el.removeAttribute(key);
9401 return;
9402 }
9403 }
9404 // some properties perform value validation and throw
9405 try {
9406 el[key] = value;
9407 }
9408 catch (e) {
9409 {
9410 warn$1(`Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: ` +
9411 `value ${value} is invalid.`, e);
9412 }
9413 }
9414 }
9415
9416 // Async edge case fix requires storing an event listener's attach timestamp.
9417 let _getNow = Date.now;
9418 let skipTimestampCheck = false;
9419 if (typeof window !== 'undefined') {
9420 // Determine what event timestamp the browser is using. Annoyingly, the
9421 // timestamp can either be hi-res (relative to page load) or low-res
9422 // (relative to UNIX epoch), so in order to compare time we have to use the
9423 // same timestamp type when saving the flush timestamp.
9424 if (_getNow() > document.createEvent('Event').timeStamp) {
9425 // if the low-res timestamp which is bigger than the event timestamp
9426 // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
9427 // and we need to use the hi-res version for event listeners as well.
9428 _getNow = () => performance.now();
9429 }
9430 // #3485: Firefox <= 53 has incorrect Event.timeStamp implementation
9431 // and does not fire microtasks in between event propagation, so safe to exclude.
9432 const ffMatch = navigator.userAgent.match(/firefox\/(\d+)/i);
9433 skipTimestampCheck = !!(ffMatch && Number(ffMatch[1]) <= 53);
9434 }
9435 // To avoid the overhead of repeatedly calling performance.now(), we cache
9436 // and use the same timestamp for all event listeners attached in the same tick.
9437 let cachedNow = 0;
9438 const p = Promise.resolve();
9439 const reset = () => {
9440 cachedNow = 0;
9441 };
9442 const getNow = () => cachedNow || (p.then(reset), (cachedNow = _getNow()));
9443 function addEventListener(el, event, handler, options) {
9444 el.addEventListener(event, handler, options);
9445 }
9446 function removeEventListener(el, event, handler, options) {
9447 el.removeEventListener(event, handler, options);
9448 }
9449 function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
9450 // vei = vue event invokers
9451 const invokers = el._vei || (el._vei = {});
9452 const existingInvoker = invokers[rawName];
9453 if (nextValue && existingInvoker) {
9454 // patch
9455 existingInvoker.value = nextValue;
9456 }
9457 else {
9458 const [name, options] = parseName(rawName);
9459 if (nextValue) {
9460 // add
9461 const invoker = (invokers[rawName] = createInvoker(nextValue, instance));
9462 addEventListener(el, name, invoker, options);
9463 }
9464 else if (existingInvoker) {
9465 // remove
9466 removeEventListener(el, name, existingInvoker, options);
9467 invokers[rawName] = undefined;
9468 }
9469 }
9470 }
9471 const optionsModifierRE = /(?:Once|Passive|Capture)$/;
9472 function parseName(name) {
9473 let options;
9474 if (optionsModifierRE.test(name)) {
9475 options = {};
9476 let m;
9477 while ((m = name.match(optionsModifierRE))) {
9478 name = name.slice(0, name.length - m[0].length);
9479 options[m[0].toLowerCase()] = true;
9480 }
9481 }
9482 return [hyphenate(name.slice(2)), options];
9483 }
9484 function createInvoker(initialValue, instance) {
9485 const invoker = (e) => {
9486 // async edge case #6566: inner click event triggers patch, event handler
9487 // attached to outer element during patch, and triggered again. This
9488 // happens because browsers fire microtask ticks between event propagation.
9489 // the solution is simple: we save the timestamp when a handler is attached,
9490 // and the handler would only fire if the event passed to it was fired
9491 // AFTER it was attached.
9492 const timeStamp = e.timeStamp || _getNow();
9493 if (skipTimestampCheck || timeStamp >= invoker.attached - 1) {
9494 callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* NATIVE_EVENT_HANDLER */, [e]);
9495 }
9496 };
9497 invoker.value = initialValue;
9498 invoker.attached = getNow();
9499 return invoker;
9500 }
9501 function patchStopImmediatePropagation(e, value) {
9502 if (isArray(value)) {
9503 const originalStop = e.stopImmediatePropagation;
9504 e.stopImmediatePropagation = () => {
9505 originalStop.call(e);
9506 e._stopped = true;
9507 };
9508 return value.map(fn => (e) => !e._stopped && fn && fn(e));
9509 }
9510 else {
9511 return value;
9512 }
9513 }
9514
9515 const nativeOnRE = /^on[a-z]/;
9516 const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
9517 if (key === 'class') {
9518 patchClass(el, nextValue, isSVG);
9519 }
9520 else if (key === 'style') {
9521 patchStyle(el, prevValue, nextValue);
9522 }
9523 else if (isOn(key)) {
9524 // ignore v-model listeners
9525 if (!isModelListener(key)) {
9526 patchEvent(el, key, prevValue, nextValue, parentComponent);
9527 }
9528 }
9529 else if (key[0] === '.'
9530 ? ((key = key.slice(1)), true)
9531 : key[0] === '^'
9532 ? ((key = key.slice(1)), false)
9533 : shouldSetAsProp(el, key, nextValue, isSVG)) {
9534 patchDOMProp(el, key, nextValue, prevChildren, parentComponent, parentSuspense, unmountChildren);
9535 }
9536 else {
9537 // special case for <input v-model type="checkbox"> with
9538 // :true-value & :false-value
9539 // store value as dom properties since non-string values will be
9540 // stringified.
9541 if (key === 'true-value') {
9542 el._trueValue = nextValue;
9543 }
9544 else if (key === 'false-value') {
9545 el._falseValue = nextValue;
9546 }
9547 patchAttr(el, key, nextValue, isSVG);
9548 }
9549 };
9550 function shouldSetAsProp(el, key, value, isSVG) {
9551 if (isSVG) {
9552 // most keys must be set as attribute on svg elements to work
9553 // ...except innerHTML & textContent
9554 if (key === 'innerHTML' || key === 'textContent') {
9555 return true;
9556 }
9557 // or native onclick with function values
9558 if (key in el && nativeOnRE.test(key) && isFunction(value)) {
9559 return true;
9560 }
9561 return false;
9562 }
9563 // spellcheck and draggable are numerated attrs, however their
9564 // corresponding DOM properties are actually booleans - this leads to
9565 // setting it with a string "false" value leading it to be coerced to
9566 // `true`, so we need to always treat them as attributes.
9567 // Note that `contentEditable` doesn't have this problem: its DOM
9568 // property is also enumerated string values.
9569 if (key === 'spellcheck' || key === 'draggable') {
9570 return false;
9571 }
9572 // #1787, #2840 form property on form elements is readonly and must be set as
9573 // attribute.
9574 if (key === 'form') {
9575 return false;
9576 }
9577 // #1526 <input list> must be set as attribute
9578 if (key === 'list' && el.tagName === 'INPUT') {
9579 return false;
9580 }
9581 // #2766 <textarea type> must be set as attribute
9582 if (key === 'type' && el.tagName === 'TEXTAREA') {
9583 return false;
9584 }
9585 // native onclick with string value, must be set as attribute
9586 if (nativeOnRE.test(key) && isString(value)) {
9587 return false;
9588 }
9589 return key in el;
9590 }
9591
9592 function defineCustomElement(options, hydate) {
9593 const Comp = defineComponent(options);
9594 class VueCustomElement extends VueElement {
9595 constructor(initialProps) {
9596 super(Comp, initialProps, hydate);
9597 }
9598 }
9599 VueCustomElement.def = Comp;
9600 return VueCustomElement;
9601 }
9602 const defineSSRCustomElement = ((options) => {
9603 // @ts-ignore
9604 return defineCustomElement(options, hydrate);
9605 });
9606 const BaseClass = (typeof HTMLElement !== 'undefined' ? HTMLElement : class {
9607 });
9608 class VueElement extends BaseClass {
9609 constructor(_def, _props = {}, hydrate) {
9610 super();
9611 this._def = _def;
9612 this._props = _props;
9613 /**
9614 * @internal
9615 */
9616 this._instance = null;
9617 this._connected = false;
9618 this._resolved = false;
9619 this._numberProps = null;
9620 if (this.shadowRoot && hydrate) {
9621 hydrate(this._createVNode(), this.shadowRoot);
9622 }
9623 else {
9624 if (this.shadowRoot) {
9625 warn$1(`Custom element has pre-rendered declarative shadow root but is not ` +
9626 `defined as hydratable. Use \`defineSSRCustomElement\`.`);
9627 }
9628 this.attachShadow({ mode: 'open' });
9629 }
9630 }
9631 connectedCallback() {
9632 this._connected = true;
9633 if (!this._instance) {
9634 this._resolveDef();
9635 }
9636 }
9637 disconnectedCallback() {
9638 this._connected = false;
9639 nextTick(() => {
9640 if (!this._connected) {
9641 render(null, this.shadowRoot);
9642 this._instance = null;
9643 }
9644 });
9645 }
9646 /**
9647 * resolve inner component definition (handle possible async component)
9648 */
9649 _resolveDef() {
9650 if (this._resolved) {
9651 return;
9652 }
9653 this._resolved = true;
9654 // set initial attrs
9655 for (let i = 0; i < this.attributes.length; i++) {
9656 this._setAttr(this.attributes[i].name);
9657 }
9658 // watch future attr changes
9659 new MutationObserver(mutations => {
9660 for (const m of mutations) {
9661 this._setAttr(m.attributeName);
9662 }
9663 }).observe(this, { attributes: true });
9664 const resolve = (def) => {
9665 const { props, styles } = def;
9666 const hasOptions = !isArray(props);
9667 const rawKeys = props ? (hasOptions ? Object.keys(props) : props) : [];
9668 // cast Number-type props set before resolve
9669 let numberProps;
9670 if (hasOptions) {
9671 for (const key in this._props) {
9672 const opt = props[key];
9673 if (opt === Number || (opt && opt.type === Number)) {
9674 this._props[key] = toNumber(this._props[key]);
9675 (numberProps || (numberProps = Object.create(null)))[key] = true;
9676 }
9677 }
9678 }
9679 this._numberProps = numberProps;
9680 // check if there are props set pre-upgrade or connect
9681 for (const key of Object.keys(this)) {
9682 if (key[0] !== '_') {
9683 this._setProp(key, this[key], true, false);
9684 }
9685 }
9686 // defining getter/setters on prototype
9687 for (const key of rawKeys.map(camelize)) {
9688 Object.defineProperty(this, key, {
9689 get() {
9690 return this._getProp(key);
9691 },
9692 set(val) {
9693 this._setProp(key, val);
9694 }
9695 });
9696 }
9697 // apply CSS
9698 this._applyStyles(styles);
9699 // initial render
9700 this._update();
9701 };
9702 const asyncDef = this._def.__asyncLoader;
9703 if (asyncDef) {
9704 asyncDef().then(resolve);
9705 }
9706 else {
9707 resolve(this._def);
9708 }
9709 }
9710 _setAttr(key) {
9711 let value = this.getAttribute(key);
9712 if (this._numberProps && this._numberProps[key]) {
9713 value = toNumber(value);
9714 }
9715 this._setProp(camelize(key), value, false);
9716 }
9717 /**
9718 * @internal
9719 */
9720 _getProp(key) {
9721 return this._props[key];
9722 }
9723 /**
9724 * @internal
9725 */
9726 _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
9727 if (val !== this._props[key]) {
9728 this._props[key] = val;
9729 if (shouldUpdate && this._instance) {
9730 this._update();
9731 }
9732 // reflect
9733 if (shouldReflect) {
9734 if (val === true) {
9735 this.setAttribute(hyphenate(key), '');
9736 }
9737 else if (typeof val === 'string' || typeof val === 'number') {
9738 this.setAttribute(hyphenate(key), val + '');
9739 }
9740 else if (!val) {
9741 this.removeAttribute(hyphenate(key));
9742 }
9743 }
9744 }
9745 }
9746 _update() {
9747 render(this._createVNode(), this.shadowRoot);
9748 }
9749 _createVNode() {
9750 const vnode = createVNode(this._def, extend({}, this._props));
9751 if (!this._instance) {
9752 vnode.ce = instance => {
9753 this._instance = instance;
9754 instance.isCE = true;
9755 // HMR
9756 {
9757 instance.ceReload = newStyles => {
9758 // always reset styles
9759 if (this._styles) {
9760 this._styles.forEach(s => this.shadowRoot.removeChild(s));
9761 this._styles.length = 0;
9762 }
9763 this._applyStyles(newStyles);
9764 // if this is an async component, ceReload is called from the inner
9765 // component so no need to reload the async wrapper
9766 if (!this._def.__asyncLoader) {
9767 // reload
9768 this._instance = null;
9769 this._update();
9770 }
9771 };
9772 }
9773 // intercept emit
9774 instance.emit = (event, ...args) => {
9775 this.dispatchEvent(new CustomEvent(event, {
9776 detail: args
9777 }));
9778 };
9779 // locate nearest Vue custom element parent for provide/inject
9780 let parent = this;
9781 while ((parent =
9782 parent && (parent.parentNode || parent.host))) {
9783 if (parent instanceof VueElement) {
9784 instance.parent = parent._instance;
9785 break;
9786 }
9787 }
9788 };
9789 }
9790 return vnode;
9791 }
9792 _applyStyles(styles) {
9793 if (styles) {
9794 styles.forEach(css => {
9795 const s = document.createElement('style');
9796 s.textContent = css;
9797 this.shadowRoot.appendChild(s);
9798 // record for HMR
9799 {
9800 (this._styles || (this._styles = [])).push(s);
9801 }
9802 });
9803 }
9804 }
9805 }
9806
9807 function useCssModule(name = '$style') {
9808 /* istanbul ignore else */
9809 {
9810 {
9811 warn$1(`useCssModule() is not supported in the global build.`);
9812 }
9813 return EMPTY_OBJ;
9814 }
9815 }
9816
9817 /**
9818 * Runtime helper for SFC's CSS variable injection feature.
9819 * @private
9820 */
9821 function useCssVars(getter) {
9822 const instance = getCurrentInstance();
9823 /* istanbul ignore next */
9824 if (!instance) {
9825 warn$1(`useCssVars is called without current active component instance.`);
9826 return;
9827 }
9828 const setVars = () => setVarsOnVNode(instance.subTree, getter(instance.proxy));
9829 watchPostEffect(setVars);
9830 onMounted(() => {
9831 const ob = new MutationObserver(setVars);
9832 ob.observe(instance.subTree.el.parentNode, { childList: true });
9833 onUnmounted(() => ob.disconnect());
9834 });
9835 }
9836 function setVarsOnVNode(vnode, vars) {
9837 if (vnode.shapeFlag & 128 /* SUSPENSE */) {
9838 const suspense = vnode.suspense;
9839 vnode = suspense.activeBranch;
9840 if (suspense.pendingBranch && !suspense.isHydrating) {
9841 suspense.effects.push(() => {
9842 setVarsOnVNode(suspense.activeBranch, vars);
9843 });
9844 }
9845 }
9846 // drill down HOCs until it's a non-component vnode
9847 while (vnode.component) {
9848 vnode = vnode.component.subTree;
9849 }
9850 if (vnode.shapeFlag & 1 /* ELEMENT */ && vnode.el) {
9851 setVarsOnNode(vnode.el, vars);
9852 }
9853 else if (vnode.type === Fragment) {
9854 vnode.children.forEach(c => setVarsOnVNode(c, vars));
9855 }
9856 else if (vnode.type === Static) {
9857 let { el, anchor } = vnode;
9858 while (el) {
9859 setVarsOnNode(el, vars);
9860 if (el === anchor)
9861 break;
9862 el = el.nextSibling;
9863 }
9864 }
9865 }
9866 function setVarsOnNode(el, vars) {
9867 if (el.nodeType === 1) {
9868 const style = el.style;
9869 for (const key in vars) {
9870 style.setProperty(`--${key}`, vars[key]);
9871 }
9872 }
9873 }
9874
9875 const TRANSITION = 'transition';
9876 const ANIMATION = 'animation';
9877 // DOM Transition is a higher-order-component based on the platform-agnostic
9878 // base Transition component, with DOM-specific logic.
9879 const Transition = (props, { slots }) => h(BaseTransition, resolveTransitionProps(props), slots);
9880 Transition.displayName = 'Transition';
9881 const DOMTransitionPropsValidators = {
9882 name: String,
9883 type: String,
9884 css: {
9885 type: Boolean,
9886 default: true
9887 },
9888 duration: [String, Number, Object],
9889 enterFromClass: String,
9890 enterActiveClass: String,
9891 enterToClass: String,
9892 appearFromClass: String,
9893 appearActiveClass: String,
9894 appearToClass: String,
9895 leaveFromClass: String,
9896 leaveActiveClass: String,
9897 leaveToClass: String
9898 };
9899 const TransitionPropsValidators = (Transition.props =
9900 /*#__PURE__*/ extend({}, BaseTransition.props, DOMTransitionPropsValidators));
9901 /**
9902 * #3227 Incoming hooks may be merged into arrays when wrapping Transition
9903 * with custom HOCs.
9904 */
9905 const callHook$1 = (hook, args = []) => {
9906 if (isArray(hook)) {
9907 hook.forEach(h => h(...args));
9908 }
9909 else if (hook) {
9910 hook(...args);
9911 }
9912 };
9913 /**
9914 * Check if a hook expects a callback (2nd arg), which means the user
9915 * intends to explicitly control the end of the transition.
9916 */
9917 const hasExplicitCallback = (hook) => {
9918 return hook
9919 ? isArray(hook)
9920 ? hook.some(h => h.length > 1)
9921 : hook.length > 1
9922 : false;
9923 };
9924 function resolveTransitionProps(rawProps) {
9925 const baseProps = {};
9926 for (const key in rawProps) {
9927 if (!(key in DOMTransitionPropsValidators)) {
9928 baseProps[key] = rawProps[key];
9929 }
9930 }
9931 if (rawProps.css === false) {
9932 return baseProps;
9933 }
9934 const { name = 'v', type, duration, enterFromClass = `${name}-enter-from`, enterActiveClass = `${name}-enter-active`, enterToClass = `${name}-enter-to`, appearFromClass = enterFromClass, appearActiveClass = enterActiveClass, appearToClass = enterToClass, leaveFromClass = `${name}-leave-from`, leaveActiveClass = `${name}-leave-active`, leaveToClass = `${name}-leave-to` } = rawProps;
9935 const durations = normalizeDuration(duration);
9936 const enterDuration = durations && durations[0];
9937 const leaveDuration = durations && durations[1];
9938 const { onBeforeEnter, onEnter, onEnterCancelled, onLeave, onLeaveCancelled, onBeforeAppear = onBeforeEnter, onAppear = onEnter, onAppearCancelled = onEnterCancelled } = baseProps;
9939 const finishEnter = (el, isAppear, done) => {
9940 removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
9941 removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
9942 done && done();
9943 };
9944 const finishLeave = (el, done) => {
9945 removeTransitionClass(el, leaveToClass);
9946 removeTransitionClass(el, leaveActiveClass);
9947 done && done();
9948 };
9949 const makeEnterHook = (isAppear) => {
9950 return (el, done) => {
9951 const hook = isAppear ? onAppear : onEnter;
9952 const resolve = () => finishEnter(el, isAppear, done);
9953 callHook$1(hook, [el, resolve]);
9954 nextFrame(() => {
9955 removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
9956 addTransitionClass(el, isAppear ? appearToClass : enterToClass);
9957 if (!hasExplicitCallback(hook)) {
9958 whenTransitionEnds(el, type, enterDuration, resolve);
9959 }
9960 });
9961 };
9962 };
9963 return extend(baseProps, {
9964 onBeforeEnter(el) {
9965 callHook$1(onBeforeEnter, [el]);
9966 addTransitionClass(el, enterFromClass);
9967 addTransitionClass(el, enterActiveClass);
9968 },
9969 onBeforeAppear(el) {
9970 callHook$1(onBeforeAppear, [el]);
9971 addTransitionClass(el, appearFromClass);
9972 addTransitionClass(el, appearActiveClass);
9973 },
9974 onEnter: makeEnterHook(false),
9975 onAppear: makeEnterHook(true),
9976 onLeave(el, done) {
9977 const resolve = () => finishLeave(el, done);
9978 addTransitionClass(el, leaveFromClass);
9979 // force reflow so *-leave-from classes immediately take effect (#2593)
9980 forceReflow();
9981 addTransitionClass(el, leaveActiveClass);
9982 nextFrame(() => {
9983 removeTransitionClass(el, leaveFromClass);
9984 addTransitionClass(el, leaveToClass);
9985 if (!hasExplicitCallback(onLeave)) {
9986 whenTransitionEnds(el, type, leaveDuration, resolve);
9987 }
9988 });
9989 callHook$1(onLeave, [el, resolve]);
9990 },
9991 onEnterCancelled(el) {
9992 finishEnter(el, false);
9993 callHook$1(onEnterCancelled, [el]);
9994 },
9995 onAppearCancelled(el) {
9996 finishEnter(el, true);
9997 callHook$1(onAppearCancelled, [el]);
9998 },
9999 onLeaveCancelled(el) {
10000 finishLeave(el);
10001 callHook$1(onLeaveCancelled, [el]);
10002 }
10003 });
10004 }
10005 function normalizeDuration(duration) {
10006 if (duration == null) {
10007 return null;
10008 }
10009 else if (isObject(duration)) {
10010 return [NumberOf(duration.enter), NumberOf(duration.leave)];
10011 }
10012 else {
10013 const n = NumberOf(duration);
10014 return [n, n];
10015 }
10016 }
10017 function NumberOf(val) {
10018 const res = toNumber(val);
10019 validateDuration(res);
10020 return res;
10021 }
10022 function validateDuration(val) {
10023 if (typeof val !== 'number') {
10024 warn$1(`<transition> explicit duration is not a valid number - ` +
10025 `got ${JSON.stringify(val)}.`);
10026 }
10027 else if (isNaN(val)) {
10028 warn$1(`<transition> explicit duration is NaN - ` +
10029 'the duration expression might be incorrect.');
10030 }
10031 }
10032 function addTransitionClass(el, cls) {
10033 cls.split(/\s+/).forEach(c => c && el.classList.add(c));
10034 (el._vtc ||
10035 (el._vtc = new Set())).add(cls);
10036 }
10037 function removeTransitionClass(el, cls) {
10038 cls.split(/\s+/).forEach(c => c && el.classList.remove(c));
10039 const { _vtc } = el;
10040 if (_vtc) {
10041 _vtc.delete(cls);
10042 if (!_vtc.size) {
10043 el._vtc = undefined;
10044 }
10045 }
10046 }
10047 function nextFrame(cb) {
10048 requestAnimationFrame(() => {
10049 requestAnimationFrame(cb);
10050 });
10051 }
10052 let endId = 0;
10053 function whenTransitionEnds(el, expectedType, explicitTimeout, resolve) {
10054 const id = (el._endId = ++endId);
10055 const resolveIfNotStale = () => {
10056 if (id === el._endId) {
10057 resolve();
10058 }
10059 };
10060 if (explicitTimeout) {
10061 return setTimeout(resolveIfNotStale, explicitTimeout);
10062 }
10063 const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
10064 if (!type) {
10065 return resolve();
10066 }
10067 const endEvent = type + 'end';
10068 let ended = 0;
10069 const end = () => {
10070 el.removeEventListener(endEvent, onEnd);
10071 resolveIfNotStale();
10072 };
10073 const onEnd = (e) => {
10074 if (e.target === el && ++ended >= propCount) {
10075 end();
10076 }
10077 };
10078 setTimeout(() => {
10079 if (ended < propCount) {
10080 end();
10081 }
10082 }, timeout + 1);
10083 el.addEventListener(endEvent, onEnd);
10084 }
10085 function getTransitionInfo(el, expectedType) {
10086 const styles = window.getComputedStyle(el);
10087 // JSDOM may return undefined for transition properties
10088 const getStyleProperties = (key) => (styles[key] || '').split(', ');
10089 const transitionDelays = getStyleProperties(TRANSITION + 'Delay');
10090 const transitionDurations = getStyleProperties(TRANSITION + 'Duration');
10091 const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
10092 const animationDelays = getStyleProperties(ANIMATION + 'Delay');
10093 const animationDurations = getStyleProperties(ANIMATION + 'Duration');
10094 const animationTimeout = getTimeout(animationDelays, animationDurations);
10095 let type = null;
10096 let timeout = 0;
10097 let propCount = 0;
10098 /* istanbul ignore if */
10099 if (expectedType === TRANSITION) {
10100 if (transitionTimeout > 0) {
10101 type = TRANSITION;
10102 timeout = transitionTimeout;
10103 propCount = transitionDurations.length;
10104 }
10105 }
10106 else if (expectedType === ANIMATION) {
10107 if (animationTimeout > 0) {
10108 type = ANIMATION;
10109 timeout = animationTimeout;
10110 propCount = animationDurations.length;
10111 }
10112 }
10113 else {
10114 timeout = Math.max(transitionTimeout, animationTimeout);
10115 type =
10116 timeout > 0
10117 ? transitionTimeout > animationTimeout
10118 ? TRANSITION
10119 : ANIMATION
10120 : null;
10121 propCount = type
10122 ? type === TRANSITION
10123 ? transitionDurations.length
10124 : animationDurations.length
10125 : 0;
10126 }
10127 const hasTransform = type === TRANSITION &&
10128 /\b(transform|all)(,|$)/.test(styles[TRANSITION + 'Property']);
10129 return {
10130 type,
10131 timeout,
10132 propCount,
10133 hasTransform
10134 };
10135 }
10136 function getTimeout(delays, durations) {
10137 while (delays.length < durations.length) {
10138 delays = delays.concat(delays);
10139 }
10140 return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
10141 }
10142 // Old versions of Chromium (below 61.0.3163.100) formats floating pointer
10143 // numbers in a locale-dependent way, using a comma instead of a dot.
10144 // If comma is not replaced with a dot, the input will be rounded down
10145 // (i.e. acting as a floor function) causing unexpected behaviors
10146 function toMs(s) {
10147 return Number(s.slice(0, -1).replace(',', '.')) * 1000;
10148 }
10149 // synchronously force layout to put elements into a certain state
10150 function forceReflow() {
10151 return document.body.offsetHeight;
10152 }
10153
10154 const positionMap = new WeakMap();
10155 const newPositionMap = new WeakMap();
10156 const TransitionGroupImpl = {
10157 name: 'TransitionGroup',
10158 props: /*#__PURE__*/ extend({}, TransitionPropsValidators, {
10159 tag: String,
10160 moveClass: String
10161 }),
10162 setup(props, { slots }) {
10163 const instance = getCurrentInstance();
10164 const state = useTransitionState();
10165 let prevChildren;
10166 let children;
10167 onUpdated(() => {
10168 // children is guaranteed to exist after initial render
10169 if (!prevChildren.length) {
10170 return;
10171 }
10172 const moveClass = props.moveClass || `${props.name || 'v'}-move`;
10173 if (!hasCSSTransform(prevChildren[0].el, instance.vnode.el, moveClass)) {
10174 return;
10175 }
10176 // we divide the work into three loops to avoid mixing DOM reads and writes
10177 // in each iteration - which helps prevent layout thrashing.
10178 prevChildren.forEach(callPendingCbs);
10179 prevChildren.forEach(recordPosition);
10180 const movedChildren = prevChildren.filter(applyTranslation);
10181 // force reflow to put everything in position
10182 forceReflow();
10183 movedChildren.forEach(c => {
10184 const el = c.el;
10185 const style = el.style;
10186 addTransitionClass(el, moveClass);
10187 style.transform = style.webkitTransform = style.transitionDuration = '';
10188 const cb = (el._moveCb = (e) => {
10189 if (e && e.target !== el) {
10190 return;
10191 }
10192 if (!e || /transform$/.test(e.propertyName)) {
10193 el.removeEventListener('transitionend', cb);
10194 el._moveCb = null;
10195 removeTransitionClass(el, moveClass);
10196 }
10197 });
10198 el.addEventListener('transitionend', cb);
10199 });
10200 });
10201 return () => {
10202 const rawProps = toRaw(props);
10203 const cssTransitionProps = resolveTransitionProps(rawProps);
10204 let tag = rawProps.tag || Fragment;
10205 prevChildren = children;
10206 children = slots.default ? getTransitionRawChildren(slots.default()) : [];
10207 for (let i = 0; i < children.length; i++) {
10208 const child = children[i];
10209 if (child.key != null) {
10210 setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
10211 }
10212 else {
10213 warn$1(`<TransitionGroup> children must be keyed.`);
10214 }
10215 }
10216 if (prevChildren) {
10217 for (let i = 0; i < prevChildren.length; i++) {
10218 const child = prevChildren[i];
10219 setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
10220 positionMap.set(child, child.el.getBoundingClientRect());
10221 }
10222 }
10223 return createVNode(tag, null, children);
10224 };
10225 }
10226 };
10227 const TransitionGroup = TransitionGroupImpl;
10228 function callPendingCbs(c) {
10229 const el = c.el;
10230 if (el._moveCb) {
10231 el._moveCb();
10232 }
10233 if (el._enterCb) {
10234 el._enterCb();
10235 }
10236 }
10237 function recordPosition(c) {
10238 newPositionMap.set(c, c.el.getBoundingClientRect());
10239 }
10240 function applyTranslation(c) {
10241 const oldPos = positionMap.get(c);
10242 const newPos = newPositionMap.get(c);
10243 const dx = oldPos.left - newPos.left;
10244 const dy = oldPos.top - newPos.top;
10245 if (dx || dy) {
10246 const s = c.el.style;
10247 s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
10248 s.transitionDuration = '0s';
10249 return c;
10250 }
10251 }
10252 function hasCSSTransform(el, root, moveClass) {
10253 // Detect whether an element with the move class applied has
10254 // CSS transitions. Since the element may be inside an entering
10255 // transition at this very moment, we make a clone of it and remove
10256 // all other transition classes applied to ensure only the move class
10257 // is applied.
10258 const clone = el.cloneNode();
10259 if (el._vtc) {
10260 el._vtc.forEach(cls => {
10261 cls.split(/\s+/).forEach(c => c && clone.classList.remove(c));
10262 });
10263 }
10264 moveClass.split(/\s+/).forEach(c => c && clone.classList.add(c));
10265 clone.style.display = 'none';
10266 const container = (root.nodeType === 1 ? root : root.parentNode);
10267 container.appendChild(clone);
10268 const { hasTransform } = getTransitionInfo(clone);
10269 container.removeChild(clone);
10270 return hasTransform;
10271 }
10272
10273 const getModelAssigner = (vnode) => {
10274 const fn = vnode.props['onUpdate:modelValue'];
10275 return isArray(fn) ? value => invokeArrayFns(fn, value) : fn;
10276 };
10277 function onCompositionStart(e) {
10278 e.target.composing = true;
10279 }
10280 function onCompositionEnd(e) {
10281 const target = e.target;
10282 if (target.composing) {
10283 target.composing = false;
10284 trigger$1(target, 'input');
10285 }
10286 }
10287 function trigger$1(el, type) {
10288 const e = document.createEvent('HTMLEvents');
10289 e.initEvent(type, true, true);
10290 el.dispatchEvent(e);
10291 }
10292 // We are exporting the v-model runtime directly as vnode hooks so that it can
10293 // be tree-shaken in case v-model is never used.
10294 const vModelText = {
10295 created(el, { modifiers: { lazy, trim, number } }, vnode) {
10296 el._assign = getModelAssigner(vnode);
10297 const castToNumber = number || (vnode.props && vnode.props.type === 'number');
10298 addEventListener(el, lazy ? 'change' : 'input', e => {
10299 if (e.target.composing)
10300 return;
10301 let domValue = el.value;
10302 if (trim) {
10303 domValue = domValue.trim();
10304 }
10305 else if (castToNumber) {
10306 domValue = toNumber(domValue);
10307 }
10308 el._assign(domValue);
10309 });
10310 if (trim) {
10311 addEventListener(el, 'change', () => {
10312 el.value = el.value.trim();
10313 });
10314 }
10315 if (!lazy) {
10316 addEventListener(el, 'compositionstart', onCompositionStart);
10317 addEventListener(el, 'compositionend', onCompositionEnd);
10318 // Safari < 10.2 & UIWebView doesn't fire compositionend when
10319 // switching focus before confirming composition choice
10320 // this also fixes the issue where some browsers e.g. iOS Chrome
10321 // fires "change" instead of "input" on autocomplete.
10322 addEventListener(el, 'change', onCompositionEnd);
10323 }
10324 },
10325 // set value on mounted so it's after min/max for type="range"
10326 mounted(el, { value }) {
10327 el.value = value == null ? '' : value;
10328 },
10329 beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
10330 el._assign = getModelAssigner(vnode);
10331 // avoid clearing unresolved text. #2302
10332 if (el.composing)
10333 return;
10334 if (document.activeElement === el) {
10335 if (lazy) {
10336 return;
10337 }
10338 if (trim && el.value.trim() === value) {
10339 return;
10340 }
10341 if ((number || el.type === 'number') && toNumber(el.value) === value) {
10342 return;
10343 }
10344 }
10345 const newValue = value == null ? '' : value;
10346 if (el.value !== newValue) {
10347 el.value = newValue;
10348 }
10349 }
10350 };
10351 const vModelCheckbox = {
10352 // #4096 array checkboxes need to be deep traversed
10353 deep: true,
10354 created(el, _, vnode) {
10355 el._assign = getModelAssigner(vnode);
10356 addEventListener(el, 'change', () => {
10357 const modelValue = el._modelValue;
10358 const elementValue = getValue(el);
10359 const checked = el.checked;
10360 const assign = el._assign;
10361 if (isArray(modelValue)) {
10362 const index = looseIndexOf(modelValue, elementValue);
10363 const found = index !== -1;
10364 if (checked && !found) {
10365 assign(modelValue.concat(elementValue));
10366 }
10367 else if (!checked && found) {
10368 const filtered = [...modelValue];
10369 filtered.splice(index, 1);
10370 assign(filtered);
10371 }
10372 }
10373 else if (isSet(modelValue)) {
10374 const cloned = new Set(modelValue);
10375 if (checked) {
10376 cloned.add(elementValue);
10377 }
10378 else {
10379 cloned.delete(elementValue);
10380 }
10381 assign(cloned);
10382 }
10383 else {
10384 assign(getCheckboxValue(el, checked));
10385 }
10386 });
10387 },
10388 // set initial checked on mount to wait for true-value/false-value
10389 mounted: setChecked,
10390 beforeUpdate(el, binding, vnode) {
10391 el._assign = getModelAssigner(vnode);
10392 setChecked(el, binding, vnode);
10393 }
10394 };
10395 function setChecked(el, { value, oldValue }, vnode) {
10396 el._modelValue = value;
10397 if (isArray(value)) {
10398 el.checked = looseIndexOf(value, vnode.props.value) > -1;
10399 }
10400 else if (isSet(value)) {
10401 el.checked = value.has(vnode.props.value);
10402 }
10403 else if (value !== oldValue) {
10404 el.checked = looseEqual(value, getCheckboxValue(el, true));
10405 }
10406 }
10407 const vModelRadio = {
10408 created(el, { value }, vnode) {
10409 el.checked = looseEqual(value, vnode.props.value);
10410 el._assign = getModelAssigner(vnode);
10411 addEventListener(el, 'change', () => {
10412 el._assign(getValue(el));
10413 });
10414 },
10415 beforeUpdate(el, { value, oldValue }, vnode) {
10416 el._assign = getModelAssigner(vnode);
10417 if (value !== oldValue) {
10418 el.checked = looseEqual(value, vnode.props.value);
10419 }
10420 }
10421 };
10422 const vModelSelect = {
10423 // <select multiple> value need to be deep traversed
10424 deep: true,
10425 created(el, { value, modifiers: { number } }, vnode) {
10426 const isSetModel = isSet(value);
10427 addEventListener(el, 'change', () => {
10428 const selectedVal = Array.prototype.filter
10429 .call(el.options, (o) => o.selected)
10430 .map((o) => number ? toNumber(getValue(o)) : getValue(o));
10431 el._assign(el.multiple
10432 ? isSetModel
10433 ? new Set(selectedVal)
10434 : selectedVal
10435 : selectedVal[0]);
10436 });
10437 el._assign = getModelAssigner(vnode);
10438 },
10439 // set value in mounted & updated because <select> relies on its children
10440 // <option>s.
10441 mounted(el, { value }) {
10442 setSelected(el, value);
10443 },
10444 beforeUpdate(el, _binding, vnode) {
10445 el._assign = getModelAssigner(vnode);
10446 },
10447 updated(el, { value }) {
10448 setSelected(el, value);
10449 }
10450 };
10451 function setSelected(el, value) {
10452 const isMultiple = el.multiple;
10453 if (isMultiple && !isArray(value) && !isSet(value)) {
10454 warn$1(`<select multiple v-model> expects an Array or Set value for its binding, ` +
10455 `but got ${Object.prototype.toString.call(value).slice(8, -1)}.`);
10456 return;
10457 }
10458 for (let i = 0, l = el.options.length; i < l; i++) {
10459 const option = el.options[i];
10460 const optionValue = getValue(option);
10461 if (isMultiple) {
10462 if (isArray(value)) {
10463 option.selected = looseIndexOf(value, optionValue) > -1;
10464 }
10465 else {
10466 option.selected = value.has(optionValue);
10467 }
10468 }
10469 else {
10470 if (looseEqual(getValue(option), value)) {
10471 if (el.selectedIndex !== i)
10472 el.selectedIndex = i;
10473 return;
10474 }
10475 }
10476 }
10477 if (!isMultiple && el.selectedIndex !== -1) {
10478 el.selectedIndex = -1;
10479 }
10480 }
10481 // retrieve raw value set via :value bindings
10482 function getValue(el) {
10483 return '_value' in el ? el._value : el.value;
10484 }
10485 // retrieve raw value for true-value and false-value set via :true-value or :false-value bindings
10486 function getCheckboxValue(el, checked) {
10487 const key = checked ? '_trueValue' : '_falseValue';
10488 return key in el ? el[key] : checked;
10489 }
10490 const vModelDynamic = {
10491 created(el, binding, vnode) {
10492 callModelHook(el, binding, vnode, null, 'created');
10493 },
10494 mounted(el, binding, vnode) {
10495 callModelHook(el, binding, vnode, null, 'mounted');
10496 },
10497 beforeUpdate(el, binding, vnode, prevVNode) {
10498 callModelHook(el, binding, vnode, prevVNode, 'beforeUpdate');
10499 },
10500 updated(el, binding, vnode, prevVNode) {
10501 callModelHook(el, binding, vnode, prevVNode, 'updated');
10502 }
10503 };
10504 function callModelHook(el, binding, vnode, prevVNode, hook) {
10505 let modelToUse;
10506 switch (el.tagName) {
10507 case 'SELECT':
10508 modelToUse = vModelSelect;
10509 break;
10510 case 'TEXTAREA':
10511 modelToUse = vModelText;
10512 break;
10513 default:
10514 switch (vnode.props && vnode.props.type) {
10515 case 'checkbox':
10516 modelToUse = vModelCheckbox;
10517 break;
10518 case 'radio':
10519 modelToUse = vModelRadio;
10520 break;
10521 default:
10522 modelToUse = vModelText;
10523 }
10524 }
10525 const fn = modelToUse[hook];
10526 fn && fn(el, binding, vnode, prevVNode);
10527 }
10528
10529 const systemModifiers = ['ctrl', 'shift', 'alt', 'meta'];
10530 const modifierGuards = {
10531 stop: e => e.stopPropagation(),
10532 prevent: e => e.preventDefault(),
10533 self: e => e.target !== e.currentTarget,
10534 ctrl: e => !e.ctrlKey,
10535 shift: e => !e.shiftKey,
10536 alt: e => !e.altKey,
10537 meta: e => !e.metaKey,
10538 left: e => 'button' in e && e.button !== 0,
10539 middle: e => 'button' in e && e.button !== 1,
10540 right: e => 'button' in e && e.button !== 2,
10541 exact: (e, modifiers) => systemModifiers.some(m => e[`${m}Key`] && !modifiers.includes(m))
10542 };
10543 /**
10544 * @private
10545 */
10546 const withModifiers = (fn, modifiers) => {
10547 return (event, ...args) => {
10548 for (let i = 0; i < modifiers.length; i++) {
10549 const guard = modifierGuards[modifiers[i]];
10550 if (guard && guard(event, modifiers))
10551 return;
10552 }
10553 return fn(event, ...args);
10554 };
10555 };
10556 // Kept for 2.x compat.
10557 // Note: IE11 compat for `spacebar` and `del` is removed for now.
10558 const keyNames = {
10559 esc: 'escape',
10560 space: ' ',
10561 up: 'arrow-up',
10562 left: 'arrow-left',
10563 right: 'arrow-right',
10564 down: 'arrow-down',
10565 delete: 'backspace'
10566 };
10567 /**
10568 * @private
10569 */
10570 const withKeys = (fn, modifiers) => {
10571 return (event) => {
10572 if (!('key' in event)) {
10573 return;
10574 }
10575 const eventKey = hyphenate(event.key);
10576 if (modifiers.some(k => k === eventKey || keyNames[k] === eventKey)) {
10577 return fn(event);
10578 }
10579 };
10580 };
10581
10582 const vShow = {
10583 beforeMount(el, { value }, { transition }) {
10584 el._vod = el.style.display === 'none' ? '' : el.style.display;
10585 if (transition && value) {
10586 transition.beforeEnter(el);
10587 }
10588 else {
10589 setDisplay(el, value);
10590 }
10591 },
10592 mounted(el, { value }, { transition }) {
10593 if (transition && value) {
10594 transition.enter(el);
10595 }
10596 },
10597 updated(el, { value, oldValue }, { transition }) {
10598 if (!value === !oldValue)
10599 return;
10600 if (transition) {
10601 if (value) {
10602 transition.beforeEnter(el);
10603 setDisplay(el, true);
10604 transition.enter(el);
10605 }
10606 else {
10607 transition.leave(el, () => {
10608 setDisplay(el, false);
10609 });
10610 }
10611 }
10612 else {
10613 setDisplay(el, value);
10614 }
10615 },
10616 beforeUnmount(el, { value }) {
10617 setDisplay(el, value);
10618 }
10619 };
10620 function setDisplay(el, value) {
10621 el.style.display = value ? el._vod : 'none';
10622 }
10623
10624 const rendererOptions = extend({ patchProp }, nodeOps);
10625 // lazy create the renderer - this makes core renderer logic tree-shakable
10626 // in case the user only imports reactivity utilities from Vue.
10627 let renderer;
10628 let enabledHydration = false;
10629 function ensureRenderer() {
10630 return (renderer ||
10631 (renderer = createRenderer(rendererOptions)));
10632 }
10633 function ensureHydrationRenderer() {
10634 renderer = enabledHydration
10635 ? renderer
10636 : createHydrationRenderer(rendererOptions);
10637 enabledHydration = true;
10638 return renderer;
10639 }
10640 // use explicit type casts here to avoid import() calls in rolled-up d.ts
10641 const render = ((...args) => {
10642 ensureRenderer().render(...args);
10643 });
10644 const hydrate = ((...args) => {
10645 ensureHydrationRenderer().hydrate(...args);
10646 });
10647 const createApp = ((...args) => {
10648 const app = ensureRenderer().createApp(...args);
10649 {
10650 injectNativeTagCheck(app);
10651 injectCompilerOptionsCheck(app);
10652 }
10653 const { mount } = app;
10654 app.mount = (containerOrSelector) => {
10655 const container = normalizeContainer(containerOrSelector);
10656 if (!container)
10657 return;
10658 const component = app._component;
10659 if (!isFunction(component) && !component.render && !component.template) {
10660 // __UNSAFE__
10661 // Reason: potential execution of JS expressions in in-DOM template.
10662 // The user must make sure the in-DOM template is trusted. If it's
10663 // rendered by the server, the template should not contain any user data.
10664 component.template = container.innerHTML;
10665 }
10666 // clear content before mounting
10667 container.innerHTML = '';
10668 const proxy = mount(container, false, container instanceof SVGElement);
10669 if (container instanceof Element) {
10670 container.removeAttribute('v-cloak');
10671 container.setAttribute('data-v-app', '');
10672 }
10673 return proxy;
10674 };
10675 return app;
10676 });
10677 const createSSRApp = ((...args) => {
10678 const app = ensureHydrationRenderer().createApp(...args);
10679 {
10680 injectNativeTagCheck(app);
10681 injectCompilerOptionsCheck(app);
10682 }
10683 const { mount } = app;
10684 app.mount = (containerOrSelector) => {
10685 const container = normalizeContainer(containerOrSelector);
10686 if (container) {
10687 return mount(container, true, container instanceof SVGElement);
10688 }
10689 };
10690 return app;
10691 });
10692 function injectNativeTagCheck(app) {
10693 // Inject `isNativeTag`
10694 // this is used for component name validation (dev only)
10695 Object.defineProperty(app.config, 'isNativeTag', {
10696 value: (tag) => isHTMLTag(tag) || isSVGTag(tag),
10697 writable: false
10698 });
10699 }
10700 // dev only
10701 function injectCompilerOptionsCheck(app) {
10702 if (isRuntimeOnly()) {
10703 const isCustomElement = app.config.isCustomElement;
10704 Object.defineProperty(app.config, 'isCustomElement', {
10705 get() {
10706 return isCustomElement;
10707 },
10708 set() {
10709 warn$1(`The \`isCustomElement\` config option is deprecated. Use ` +
10710 `\`compilerOptions.isCustomElement\` instead.`);
10711 }
10712 });
10713 const compilerOptions = app.config.compilerOptions;
10714 const msg = `The \`compilerOptions\` config option is only respected when using ` +
10715 `a build of Vue.js that includes the runtime compiler (aka "full build"). ` +
10716 `Since you are using the runtime-only build, \`compilerOptions\` ` +
10717 `must be passed to \`@vue/compiler-dom\` in the build setup instead.\n` +
10718 `- For vue-loader: pass it via vue-loader's \`compilerOptions\` loader option.\n` +
10719 `- For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader\n` +
10720 `- For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-dom`;
10721 Object.defineProperty(app.config, 'compilerOptions', {
10722 get() {
10723 warn$1(msg);
10724 return compilerOptions;
10725 },
10726 set() {
10727 warn$1(msg);
10728 }
10729 });
10730 }
10731 }
10732 function normalizeContainer(container) {
10733 if (isString(container)) {
10734 const res = document.querySelector(container);
10735 if (!res) {
10736 warn$1(`Failed to mount app: mount target selector "${container}" returned null.`);
10737 }
10738 return res;
10739 }
10740 if (window.ShadowRoot &&
10741 container instanceof window.ShadowRoot &&
10742 container.mode === 'closed') {
10743 warn$1(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
10744 }
10745 return container;
10746 }
10747 /**
10748 * @internal
10749 */
10750 const initDirectivesForSSR = NOOP;
10751
10752 function initDev() {
10753 {
10754 {
10755 console.info(`You are running a development build of Vue.\n` +
10756 `Make sure to use the production build (*.prod.js) when deploying for production.`);
10757 }
10758 initCustomFormatter();
10759 }
10760 }
10761
10762 function defaultOnError(error) {
10763 throw error;
10764 }
10765 function defaultOnWarn(msg) {
10766 console.warn(`[Vue warn] ${msg.message}`);
10767 }
10768 function createCompilerError(code, loc, messages, additionalMessage) {
10769 const msg = (messages || errorMessages)[code] + (additionalMessage || ``)
10770 ;
10771 const error = new SyntaxError(String(msg));
10772 error.code = code;
10773 error.loc = loc;
10774 return error;
10775 }
10776 const errorMessages = {
10777 // parse errors
10778 [0 /* ABRUPT_CLOSING_OF_EMPTY_COMMENT */]: 'Illegal comment.',
10779 [1 /* CDATA_IN_HTML_CONTENT */]: 'CDATA section is allowed only in XML context.',
10780 [2 /* DUPLICATE_ATTRIBUTE */]: 'Duplicate attribute.',
10781 [3 /* END_TAG_WITH_ATTRIBUTES */]: 'End tag cannot have attributes.',
10782 [4 /* END_TAG_WITH_TRAILING_SOLIDUS */]: "Illegal '/' in tags.",
10783 [5 /* EOF_BEFORE_TAG_NAME */]: 'Unexpected EOF in tag.',
10784 [6 /* EOF_IN_CDATA */]: 'Unexpected EOF in CDATA section.',
10785 [7 /* EOF_IN_COMMENT */]: 'Unexpected EOF in comment.',
10786 [8 /* EOF_IN_SCRIPT_HTML_COMMENT_LIKE_TEXT */]: 'Unexpected EOF in script.',
10787 [9 /* EOF_IN_TAG */]: 'Unexpected EOF in tag.',
10788 [10 /* INCORRECTLY_CLOSED_COMMENT */]: 'Incorrectly closed comment.',
10789 [11 /* INCORRECTLY_OPENED_COMMENT */]: 'Incorrectly opened comment.',
10790 [12 /* INVALID_FIRST_CHARACTER_OF_TAG_NAME */]: "Illegal tag name. Use '&lt;' to print '<'.",
10791 [13 /* MISSING_ATTRIBUTE_VALUE */]: 'Attribute value was expected.',
10792 [14 /* MISSING_END_TAG_NAME */]: 'End tag name was expected.',
10793 [15 /* MISSING_WHITESPACE_BETWEEN_ATTRIBUTES */]: 'Whitespace was expected.',
10794 [16 /* NESTED_COMMENT */]: "Unexpected '<!--' in comment.",
10795 [17 /* UNEXPECTED_CHARACTER_IN_ATTRIBUTE_NAME */]: 'Attribute name cannot contain U+0022 ("), U+0027 (\'), and U+003C (<).',
10796 [18 /* UNEXPECTED_CHARACTER_IN_UNQUOTED_ATTRIBUTE_VALUE */]: 'Unquoted attribute value cannot contain U+0022 ("), U+0027 (\'), U+003C (<), U+003D (=), and U+0060 (`).',
10797 [19 /* UNEXPECTED_EQUALS_SIGN_BEFORE_ATTRIBUTE_NAME */]: "Attribute name cannot start with '='.",
10798 [21 /* UNEXPECTED_QUESTION_MARK_INSTEAD_OF_TAG_NAME */]: "'<?' is allowed only in XML context.",
10799 [20 /* UNEXPECTED_NULL_CHARACTER */]: `Unexpected null character.`,
10800 [22 /* UNEXPECTED_SOLIDUS_IN_TAG */]: "Illegal '/' in tags.",
10801 // Vue-specific parse errors
10802 [23 /* X_INVALID_END_TAG */]: 'Invalid end tag.',
10803 [24 /* X_MISSING_END_TAG */]: 'Element is missing end tag.',
10804 [25 /* X_MISSING_INTERPOLATION_END */]: 'Interpolation end sign was not found.',
10805 [27 /* X_MISSING_DYNAMIC_DIRECTIVE_ARGUMENT_END */]: 'End bracket for dynamic directive argument was not found. ' +
10806 'Note that dynamic directive argument cannot contain spaces.',
10807 [26 /* X_MISSING_DIRECTIVE_NAME */]: 'Legal directive name was expected.',
10808 // transform errors
10809 [28 /* X_V_IF_NO_EXPRESSION */]: `v-if/v-else-if is missing expression.`,
10810 [29 /* X_V_IF_SAME_KEY */]: `v-if/else branches must use unique keys.`,
10811 [30 /* X_V_ELSE_NO_ADJACENT_IF */]: `v-else/v-else-if has no adjacent v-if or v-else-if.`,
10812 [31 /* X_V_FOR_NO_EXPRESSION */]: `v-for is missing expression.`,
10813 [32 /* X_V_FOR_MALFORMED_EXPRESSION */]: `v-for has invalid expression.`,
10814 [33 /* X_V_FOR_TEMPLATE_KEY_PLACEMENT */]: `<template v-for> key should be placed on the <template> tag.`,
10815 [34 /* X_V_BIND_NO_EXPRESSION */]: `v-bind is missing expression.`,
10816 [35 /* X_V_ON_NO_EXPRESSION */]: `v-on is missing expression.`,
10817 [36 /* X_V_SLOT_UNEXPECTED_DIRECTIVE_ON_SLOT_OUTLET */]: `Unexpected custom directive on <slot> outlet.`,
10818 [37 /* X_V_SLOT_MIXED_SLOT_USAGE */]: `Mixed v-slot usage on both the component and nested <template>.` +
10819 `When there are multiple named slots, all slots should use <template> ` +
10820 `syntax to avoid scope ambiguity.`,
10821 [38 /* X_V_SLOT_DUPLICATE_SLOT_NAMES */]: `Duplicate slot names found. `,
10822 [39 /* X_V_SLOT_EXTRANEOUS_DEFAULT_SLOT_CHILDREN */]: `Extraneous children found when component already has explicitly named ` +
10823 `default slot. These children will be ignored.`,
10824 [40 /* X_V_SLOT_MISPLACED */]: `v-slot can only be used on components or <template> tags.`,
10825 [41 /* X_V_MODEL_NO_EXPRESSION */]: `v-model is missing expression.`,
10826 [42 /* X_V_MODEL_MALFORMED_EXPRESSION */]: `v-model value must be a valid JavaScript member expression.`,
10827 [43 /* X_V_MODEL_ON_SCOPE_VARIABLE */]: `v-model cannot be used on v-for or v-slot scope variables because they are not writable.`,
10828 [44 /* X_INVALID_EXPRESSION */]: `Error parsing JavaScript expression: `,
10829 [45 /* X_KEEP_ALIVE_INVALID_CHILDREN */]: `<KeepAlive> expects exactly one child component.`,
10830 // generic errors
10831 [46 /* X_PREFIX_ID_NOT_SUPPORTED */]: `"prefixIdentifiers" option is not supported in this build of compiler.`,
10832 [47 /* X_MODULE_MODE_NOT_SUPPORTED */]: `ES module mode is not supported in this build of compiler.`,
10833 [48 /* X_CACHE_HANDLER_NOT_SUPPORTED */]: `"cacheHandlers" option is only supported when the "prefixIdentifiers" option is enabled.`,
10834 [49 /* X_SCOPE_ID_NOT_SUPPORTED */]: `"scopeId" option is only supported in module mode.`,
10835 // just to fulfill types
10836 [50 /* __EXTEND_POINT__ */]: ``
10837 };
10838
10839 const FRAGMENT = Symbol(`Fragment` );
10840 const TELEPORT = Symbol(`Teleport` );
10841 const SUSPENSE = Symbol(`Suspense` );
10842 const KEEP_ALIVE = Symbol(`KeepAlive` );
10843 const BASE_TRANSITION = Symbol(`BaseTransition` );
10844 const OPEN_BLOCK = Symbol(`openBlock` );
10845 const CREATE_BLOCK = Symbol(`createBlock` );
10846 const CREATE_ELEMENT_BLOCK = Symbol(`createElementBlock` );
10847 const CREATE_VNODE = Symbol(`createVNode` );
10848 const CREATE_ELEMENT_VNODE = Symbol(`createElementVNode` );
10849 const CREATE_COMMENT = Symbol(`createCommentVNode` );
10850 const CREATE_TEXT = Symbol(`createTextVNode` );
10851 const CREATE_STATIC = Symbol(`createStaticVNode` );
10852 const RESOLVE_COMPONENT = Symbol(`resolveComponent` );
10853 const RESOLVE_DYNAMIC_COMPONENT = Symbol(`resolveDynamicComponent` );
10854 const RESOLVE_DIRECTIVE = Symbol(`resolveDirective` );
10855 const RESOLVE_FILTER = Symbol(`resolveFilter` );
10856 const WITH_DIRECTIVES = Symbol(`withDirectives` );
10857 const RENDER_LIST = Symbol(`renderList` );
10858 const RENDER_SLOT = Symbol(`renderSlot` );
10859 const CREATE_SLOTS = Symbol(`createSlots` );
10860 const TO_DISPLAY_STRING = Symbol(`toDisplayString` );
10861 const MERGE_PROPS = Symbol(`mergeProps` );
10862 const NORMALIZE_CLASS = Symbol(`normalizeClass` );
10863 const NORMALIZE_STYLE = Symbol(`normalizeStyle` );
10864 const NORMALIZE_PROPS = Symbol(`normalizeProps` );
10865 const GUARD_REACTIVE_PROPS = Symbol(`guardReactiveProps` );
10866 const TO_HANDLERS = Symbol(`toHandlers` );
10867 const CAMELIZE = Symbol(`camelize` );
10868 const CAPITALIZE = Symbol(`capitalize` );
10869 const TO_HANDLER_KEY = Symbol(`toHandlerKey` );
10870 const SET_BLOCK_TRACKING = Symbol(`setBlockTracking` );
10871 const PUSH_SCOPE_ID = Symbol(`pushScopeId` );
10872 const POP_SCOPE_ID = Symbol(`popScopeId` );
10873 const WITH_CTX = Symbol(`withCtx` );
10874 const UNREF = Symbol(`unref` );
10875 const IS_REF = Symbol(`isRef` );
10876 const WITH_MEMO = Symbol(`withMemo` );
10877 const IS_MEMO_SAME = Symbol(`isMemoSame` );
10878 // Name mapping for runtime helpers that need to be imported from 'vue' in
10879 // generated code. Make sure these are correctly exported in the runtime!
10880 // Using `any` here because TS doesn't allow symbols as index type.
10881 const helperNameMap = {
10882 [FRAGMENT]: `Fragment`,
10883 [TELEPORT]: `Teleport`,
10884 [SUSPENSE]: `Suspense`,
10885 [KEEP_ALIVE]: `KeepAlive`,
10886 [BASE_TRANSITION]: `BaseTransition`,
10887 [OPEN_BLOCK]: `openBlock`,
10888 [CREATE_BLOCK]: `createBlock`,
10889 [CREATE_ELEMENT_BLOCK]: `createElementBlock`,
10890 [CREATE_VNODE]: `createVNode`,
10891 [CREATE_ELEMENT_VNODE]: `createElementVNode`,
10892 [CREATE_COMMENT]: `createCommentVNode`,
10893 [CREATE_TEXT]: `createTextVNode`,
10894 [CREATE_STATIC]: `createStaticVNode`,
10895 [RESOLVE_COMPONENT]: `resolveComponent`,
10896 [RESOLVE_DYNAMIC_COMPONENT]: `resolveDynamicComponent`,
10897 [RESOLVE_DIRECTIVE]: `resolveDirective`,
10898 [RESOLVE_FILTER]: `resolveFilter`,
10899 [WITH_DIRECTIVES]: `withDirectives`,
10900 [RENDER_LIST]: `renderList`,
10901 [RENDER_SLOT]: `renderSlot`,
10902 [CREATE_SLOTS]: `createSlots`,
10903 [TO_DISPLAY_STRING]: `toDisplayString`,
10904 [MERGE_PROPS]: `mergeProps`,
10905 [NORMALIZE_CLASS]: `normalizeClass`,
10906 [NORMALIZE_STYLE]: `normalizeStyle`,
10907 [NORMALIZE_PROPS]: `normalizeProps`,
10908 [GUARD_REACTIVE_PROPS]: `guardReactiveProps`,
10909 [TO_HANDLERS]: `toHandlers`,
10910 [CAMELIZE]: `camelize`,
10911 [CAPITALIZE]: `capitalize`,
10912 [TO_HANDLER_KEY]: `toHandlerKey`,
10913 [SET_BLOCK_TRACKING]: `setBlockTracking`,
10914 [PUSH_SCOPE_ID]: `pushScopeId`,
10915 [POP_SCOPE_ID]: `popScopeId`,
10916 [WITH_CTX]: `withCtx`,
10917 [UNREF]: `unref`,
10918 [IS_REF]: `isRef`,
10919 [WITH_MEMO]: `withMemo`,
10920 [IS_MEMO_SAME]: `isMemoSame`
10921 };
10922 function registerRuntimeHelpers(helpers) {
10923 Object.getOwnPropertySymbols(helpers).forEach(s => {
10924 helperNameMap[s] = helpers[s];
10925 });
10926 }
10927
10928 // AST Utilities ---------------------------------------------------------------
10929 // Some expressions, e.g. sequence and conditional expressions, are never
10930 // associated with template nodes, so their source locations are just a stub.
10931 // Container types like CompoundExpression also don't need a real location.
10932 const locStub = {
10933 source: '',
10934 start: { line: 1, column: 1, offset: 0 },
10935 end: { line: 1, column: 1, offset: 0 }
10936 };
10937 function createRoot(children, loc = locStub) {
10938 return {
10939 type: 0 /* ROOT */,
10940 children,
10941 helpers: [],
10942 components: [],
10943 directives: [],
10944 hoists: [],
10945 imports: [],
10946 cached: 0,
10947 temps: 0,
10948 codegenNode: undefined,
10949 loc
10950 };
10951 }
10952 function createVNodeCall(context, tag, props, children, patchFlag, dynamicProps, directives, isBlock = false, disableTracking = false, isComponent = false, loc = locStub) {
10953 if (context) {
10954 if (isBlock) {
10955 context.helper(OPEN_BLOCK);
10956 context.helper(getVNodeBlockHelper(context.inSSR, isComponent));
10957 }
10958 else {
10959 context.helper(getVNodeHelper(context.inSSR, isComponent));
10960 }
10961 if (directives) {
10962 context.helper(WITH_DIRECTIVES);
10963 }
10964 }
10965 return {
10966 type: 13 /* VNODE_CALL */,
10967 tag,
10968 props,
10969 children,
10970 patchFlag,
10971 dynamicProps,
10972 directives,
10973 isBlock,
10974 disableTracking,
10975 isComponent,
10976 loc
10977 };
10978 }
10979 function createArrayExpression(elements, loc = locStub) {
10980 return {
10981 type: 17 /* JS_ARRAY_EXPRESSION */,
10982 loc,
10983 elements
10984 };
10985 }
10986 function createObjectExpression(properties, loc = locStub) {
10987 return {
10988 type: 15 /* JS_OBJECT_EXPRESSION */,
10989 loc,
10990 properties
10991 };
10992 }
10993 function createObjectProperty(key, value) {
10994 return {
10995 type: 16 /* JS_PROPERTY */,
10996 loc: locStub,
10997 key: isString(key) ? createSimpleExpression(key, true) : key,
10998 value
10999 };
11000 }
11001 function createSimpleExpression(content, isStatic = false, loc = locStub, constType = 0 /* NOT_CONSTANT */) {
11002 return {
11003 type: 4 /* SIMPLE_EXPRESSION */,
11004 loc,
11005 content,
11006 isStatic,
11007 constType: isStatic ? 3 /* CAN_STRINGIFY */ : constType
11008 };
11009 }
11010 function createCompoundExpression(children, loc = locStub) {
11011 return {
11012 type: 8 /* COMPOUND_EXPRESSION */,
11013 loc,
11014 children
11015 };
11016 }
11017 function createCallExpression(callee, args = [], loc = locStub) {
11018 return {
11019 type: 14 /* JS_CALL_EXPRESSION */,
11020 loc,
11021 callee,
11022 arguments: args
11023 };
11024 }
11025 function createFunctionExpression(params, returns = undefined, newline = false, isSlot = false, loc = locStub) {
11026 return {
11027 type: 18 /* JS_FUNCTION_EXPRESSION */,
11028 params,
11029 returns,
11030 newline,
11031 isSlot,
11032 loc
11033 };
11034 }
11035 function createConditionalExpression(test, consequent, alternate, newline = true) {
11036 return {
11037 type: 19 /* JS_CONDITIONAL_EXPRESSION */,
11038 test,
11039 consequent,
11040 alternate,
11041 newline,
11042 loc: locStub
11043 };
11044 }
11045 function createCacheExpression(index, value, isVNode = false) {
11046 return {
11047 type: 20 /* JS_CACHE_EXPRESSION */,
11048 index,
11049 value,
11050 isVNode,
11051 loc: locStub
11052 };
11053 }
11054 function createBlockStatement(body) {
11055 return {
11056 type: 21 /* JS_BLOCK_STATEMENT */,
11057 body,
11058 loc: locStub
11059 };
11060 }
11061
11062 const isStaticExp = (p) => p.type === 4 /* SIMPLE_EXPRESSION */ && p.isStatic;
11063 const isBuiltInType = (tag, expected) => tag === expected || tag === hyphenate(expected);
11064 function isCoreComponent(tag) {
11065 if (isBuiltInType(tag, 'Teleport')) {
11066 return TELEPORT;
11067 }
11068 else if (isBuiltInType(tag, 'Suspense')) {
11069 return SUSPENSE;
11070 }
11071 else if (isBuiltInType(tag, 'KeepAlive')) {
11072 return KEEP_ALIVE;
11073 }
11074 else if (isBuiltInType(tag, 'BaseTransition')) {
11075 return BASE_TRANSITION;
11076 }
11077 }
11078 const nonIdentifierRE = /^\d|[^\$\w]/;
11079 const isSimpleIdentifier = (name) => !nonIdentifierRE.test(name);
11080 const validFirstIdentCharRE = /[A-Za-z_$\xA0-\uFFFF]/;
11081 const validIdentCharRE = /[\.\?\w$\xA0-\uFFFF]/;
11082 const whitespaceRE = /\s+[.[]\s*|\s*[.[]\s+/g;
11083 /**
11084 * Simple lexer to check if an expression is a member expression. This is
11085 * lax and only checks validity at the root level (i.e. does not validate exps
11086 * inside square brackets), but it's ok since these are only used on template
11087 * expressions and false positives are invalid expressions in the first place.
11088 */
11089 const isMemberExpressionBrowser = (path) => {
11090 // remove whitespaces around . or [ first
11091 path = path.trim().replace(whitespaceRE, s => s.trim());
11092 let state = 0 /* inMemberExp */;
11093 let stateStack = [];
11094 let currentOpenBracketCount = 0;
11095 let currentOpenParensCount = 0;
11096 let currentStringType = null;
11097 for (let i = 0; i < path.length; i++) {
11098 const char = path.charAt(i);
11099 switch (state) {
11100 case 0 /* inMemberExp */:
11101 if (char === '[') {
11102 stateStack.push(state);
11103 state = 1 /* inBrackets */;
11104 currentOpenBracketCount++;
11105 }
11106 else if (char === '(') {
11107 stateStack.push(state);
11108 state = 2 /* inParens */;
11109 currentOpenParensCount++;
11110 }
11111 else if (!(i === 0 ? validFirstIdentCharRE : validIdentCharRE).test(char)) {
11112 return false;
11113 }
11114 break;
11115 case 1 /* inBrackets */:
11116 if (char === `'` || char === `"` || char === '`') {
11117 stateStack.push(state);
11118 state = 3 /* inString */;
11119 currentStringType = char;
11120 }
11121 else if (char === `[`) {
11122 currentOpenBracketCount++;
11123 }
11124 else if (char === `]`) {
11125 if (!--currentOpenBracketCount) {
11126 state = stateStack.pop();
11127 }
11128 }
11129 break;
11130 case 2 /* inParens */:
11131 if (char === `'` || char === `"` || char === '`') {
11132 stateStack.push(state);
11133 state = 3 /* inString */;
11134 currentStringType = char;
11135 }
11136 else if (char === `(`) {
11137 currentOpenParensCount++;
11138 }
11139 else if (char === `)`) {
11140 // if the exp ends as a call then it should not be considered valid
11141 if (i === path.length - 1) {
11142 return false;
11143 }
11144 if (!--currentOpenParensCount) {
11145 state = stateStack.pop();
11146 }
11147 }
11148 break;
11149 case 3 /* inString */:
11150 if (char === currentStringType) {
11151 state = stateStack.pop();
11152 currentStringType = null;
11153 }
11154 break;
11155 }
11156 }
11157 return !currentOpenBracketCount && !currentOpenParensCount;
11158 };
11159 const isMemberExpression = isMemberExpressionBrowser
11160 ;
11161 function getInnerRange(loc, offset, length) {
11162 const source = loc.source.slice(offset, offset + length);
11163 const newLoc = {
11164 source,
11165 start: advancePositionWithClone(loc.start, loc.source, offset),
11166 end: loc.end
11167 };
11168 if (length != null) {
11169 newLoc.end = advancePositionWithClone(loc.start, loc.source, offset + length);
11170 }
11171 return newLoc;
11172 }
11173 function advancePositionWithClone(pos, source, numberOfCharacters = source.length) {
11174 return advancePositionWithMutation(extend({}, pos), source, numberOfCharacters);
11175 }
11176 // advance by mutation without cloning (for performance reasons), since this
11177 // gets called a lot in the parser
11178 function advancePositionWithMutation(pos, source, numberOfCharacters = source.length) {
11179 let linesCount = 0;
11180 let lastNewLinePos = -1;
11181 for (let i = 0; i < numberOfCharacters; i++) {
11182 if (source.charCodeAt(i) === 10 /* newline char code */) {
11183 linesCount++;
11184 lastNewLinePos = i;
11185 }
11186 }
11187 pos.offset += numberOfCharacters;
11188 pos.line += linesCount;
11189 pos.column =
11190 lastNewLinePos === -1
11191 ? pos.column + numberOfCharacters
11192 : numberOfCharacters - lastNewLinePos;
11193 return pos;
11194 }
11195 function assert(condition, msg) {
11196 /* istanbul ignore if */
11197 if (!condition) {
11198 throw new Error(msg || `unexpected compiler condition`);
11199 }
11200 }
11201 function findDir(node, name, allowEmpty = false) {
11202 for (let i = 0; i < node.props.length; i++) {
11203 const p = node.props[i];
11204 if (p.type === 7 /* DIRECTIVE */ &&
11205 (allowEmpty || p.exp) &&
11206 (isString(name) ? p.name === name : name.test(p.name))) {
11207 return p;
11208 }
11209 }
11210 }
11211 function findProp(node, name, dynamicOnly = false, allowEmpty = false) {
11212 for (let i = 0; i < node.props.length; i++) {
11213 const p = node.props[i];
11214 if (p.type === 6 /* ATTRIBUTE */) {
11215 if (dynamicOnly)
11216 continue;
11217 if (p.name === name && (p.value || allowEmpty)) {
11218 return p;
11219 }
11220 }
11221 else if (p.name === 'bind' &&
11222 (p.exp || allowEmpty) &&
11223 isStaticArgOf(p.arg, name)) {
11224 return p;
11225 }
11226 }
11227 }
11228 function isStaticArgOf(arg, name) {
11229 return !!(arg && isStaticExp(arg) && arg.content === name);
11230 }
11231 function hasDynamicKeyVBind(node) {
11232 return node.props.some(p => p.type === 7 /* DIRECTIVE */ &&
11233 p.name === 'bind' &&
11234 (!p.arg || // v-bind="obj"
11235 p.arg.type !== 4 /* SIMPLE_EXPRESSION */ || // v-bind:[_ctx.foo]
11236 !p.arg.isStatic) // v-bind:[foo]
11237 );
11238 }
11239 function isText(node) {
11240 return node.type === 5 /* INTERPOLATION */ || node.type === 2 /* TEXT */;
11241 }
11242 function isVSlot(p) {
11243 return p.type === 7 /* DIRECTIVE */ && p.name === 'slot';
11244 }
11245 function isTemplateNode(node) {
11246 return (node.type === 1 /* ELEMENT */ && node.tagType === 3 /* TEMPLATE */);
11247 }
11248 function isSlotOutlet(node) {
11249 return node.type === 1 /* ELEMENT */ && node.tagType === 2 /* SLOT */;
11250 }
11251 function getVNodeHelper(ssr, isComponent) {
11252 return ssr || isComponent ? CREATE_VNODE : CREATE_ELEMENT_VNODE;
11253 }
11254 function getVNodeBlockHelper(ssr, isComponent) {
11255 return ssr || isComponent ? CREATE_BLOCK : CREATE_ELEMENT_BLOCK;
11256 }
11257 const propsHelperSet = new Set([NORMALIZE_PROPS, GUARD_REACTIVE_PROPS]);
11258 function getUnnormalizedProps(props, callPath = []) {
11259 if (props &&
11260 !isString(props) &&
11261 props.type === 14 /* JS_CALL_EXPRESSION */) {
11262 const callee = props.callee;
11263 if (!isString(callee) && propsHelperSet.has(callee)) {
11264 return getUnnormalizedProps(props.arguments[0], callPath.concat(props));
11265 }
11266 }
11267 return [props, callPath];
11268 }
11269 function injectProp(node, prop, context) {
11270 let propsWithInjection;
11271 /**
11272 * 1. mergeProps(...)
11273 * 2. toHandlers(...)
11274 * 3. normalizeProps(...)
11275 * 4. normalizeProps(guardReactiveProps(...))
11276 *
11277 * we need to get the real props before normalization
11278 */
11279 let props = node.type === 13 /* VNODE_CALL */ ? node.props : node.arguments[2];
11280 let callPath = [];
11281 let parentCall;
11282 if (props &&
11283 !isString(props) &&
11284 props.type === 14 /* JS_CALL_EXPRESSION */) {
11285 const ret = getUnnormalizedProps(props);
11286 props = ret[0];
11287 callPath = ret[1];
11288 parentCall = callPath[callPath.length - 1];
11289 }
11290 if (props == null || isString(props)) {
11291 propsWithInjection = createObjectExpression([prop]);
11292 }
11293 else if (props.type === 14 /* JS_CALL_EXPRESSION */) {
11294 // merged props... add ours
11295 // only inject key to object literal if it's the first argument so that
11296 // if doesn't override user provided keys
11297 const first = props.arguments[0];
11298 if (!isString(first) && first.type === 15 /* JS_OBJECT_EXPRESSION */) {
11299 first.properties.unshift(prop);
11300 }
11301 else {
11302 if (props.callee === TO_HANDLERS) {
11303 // #2366
11304 propsWithInjection = createCallExpression(context.helper(MERGE_PROPS), [
11305 createObjectExpression([prop]),
11306 props
11307 ]);
11308 }
11309 else {
11310 props.arguments.unshift(createObjectExpression([prop]));
11311 }
11312 }
11313 !propsWithInjection && (propsWithInjection = props);
11314 }
11315 else if (props.type === 15 /* JS_OBJECT_EXPRESSION */) {
11316 let alreadyExists = false;
11317 // check existing key to avoid overriding user provided keys
11318 if (prop.key.type === 4 /* SIMPLE_EXPRESSION */) {
11319 const propKeyName = prop.key.content;
11320 alreadyExists = props.properties.some(p => p.key.type === 4 /* SIMPLE_EXPRESSION */ &&
11321 p.key.content === propKeyName);
11322 }
11323 if (!alreadyExists) {
11324 props.properties.unshift(prop);
11325 }
11326 propsWithInjection = props;
11327 }
11328 else {
11329 // single v-bind with expression, return a merged replacement
11330 propsWithInjection = createCallExpression(context.helper(MERGE_PROPS), [
11331 createObjectExpression([prop]),
11332 props
11333 ]);
11334 // in the case of nested helper call, e.g. `normalizeProps(guardReactiveProps(props))`,
11335 // it will be rewritten as `normalizeProps(mergeProps({ key: 0 }, props))`,
11336 // the `guardReactiveProps` will no longer be needed
11337 if (parentCall && parentCall.callee === GUARD_REACTIVE_PROPS) {
11338 parentCall = callPath[callPath.length - 2];
11339 }
11340 }
11341 if (node.type === 13 /* VNODE_CALL */) {
11342 if (parentCall) {
11343 parentCall.arguments[0] = propsWithInjection;
11344 }
11345 else {
11346 node.props = propsWithInjection;
11347 }
11348 }
11349 else {
11350 if (parentCall) {
11351 parentCall.arguments[0] = propsWithInjection;
11352 }
11353 else {
11354 node.arguments[2] = propsWithInjection;
11355 }
11356 }
11357 }
11358 function toValidAssetId(name, type) {
11359 // see issue#4422, we need adding identifier on validAssetId if variable `name` has specific character
11360 return `_${type}_${name.replace(/[^\w]/g, (searchValue, replaceValue) => {
11361 return searchValue === '-' ? '_' : name.charCodeAt(replaceValue).toString();
11362 })}`;
11363 }
11364 function getMemoedVNodeCall(node) {
11365 if (node.type === 14 /* JS_CALL_EXPRESSION */ && node.callee === WITH_MEMO) {
11366 return node.arguments[1].returns;
11367 }
11368 else {
11369 return node;
11370 }
11371 }
11372 function makeBlock(node, { helper, removeHelper, inSSR }) {
11373 if (!node.isBlock) {
11374 node.isBlock = true;
11375 removeHelper(getVNodeHelper(inSSR, node.isComponent));
11376 helper(OPEN_BLOCK);
11377 helper(getVNodeBlockHelper(inSSR, node.isComponent));
11378 }
11379 }
11380
11381 const deprecationData = {
11382 ["COMPILER_IS_ON_ELEMENT" /* COMPILER_IS_ON_ELEMENT */]: {
11383 message: `Platform-native elements with "is" prop will no longer be ` +
11384 `treated as components in Vue 3 unless the "is" value is explicitly ` +
11385 `prefixed with "vue:".`,
11386 link: `https://v3-migration.vuejs.org/breaking-changes/custom-elements-interop.html`
11387 },
11388 ["COMPILER_V_BIND_SYNC" /* COMPILER_V_BIND_SYNC */]: {
11389 message: key => `.sync modifier for v-bind has been removed. Use v-model with ` +
11390 `argument instead. \`v-bind:${key}.sync\` should be changed to ` +
11391 `\`v-model:${key}\`.`,
11392 link: `https://v3-migration.vuejs.org/breaking-changes/v-model.html`
11393 },
11394 ["COMPILER_V_BIND_PROP" /* COMPILER_V_BIND_PROP */]: {
11395 message: `.prop modifier for v-bind has been removed and no longer necessary. ` +
11396 `Vue 3 will automatically set a binding as DOM property when appropriate.`
11397 },
11398 ["COMPILER_V_BIND_OBJECT_ORDER" /* COMPILER_V_BIND_OBJECT_ORDER */]: {
11399 message: `v-bind="obj" usage is now order sensitive and behaves like JavaScript ` +
11400 `object spread: it will now overwrite an existing non-mergeable attribute ` +
11401 `that appears before v-bind in the case of conflict. ` +
11402 `To retain 2.x behavior, move v-bind to make it the first attribute. ` +
11403 `You can also suppress this warning if the usage is intended.`,
11404 link: `https://v3-migration.vuejs.org/breaking-changes/v-bind.html`
11405 },
11406 ["COMPILER_V_ON_NATIVE" /* COMPILER_V_ON_NATIVE */]: {
11407 message: `.native modifier for v-on has been removed as is no longer necessary.`,
11408 link: `https://v3-migration.vuejs.org/breaking-changes/v-on-native-modifier-removed.html`
11409 },
11410 ["COMPILER_V_IF_V_FOR_PRECEDENCE" /* COMPILER_V_IF_V_FOR_PRECEDENCE */]: {
11411 message: `v-if / v-for precedence when used on the same element has changed ` +
11412 `in Vue 3: v-if now takes higher precedence and will no longer have ` +
11413 `access to v-for scope variables. It is best to avoid the ambiguity ` +
11414 `with <template> tags or use a computed property that filters v-for ` +
11415 `data source.`,
11416 link: `https://v3-migration.vuejs.org/breaking-changes/v-if-v-for.html`
11417 },
11418 ["COMPILER_NATIVE_TEMPLATE" /* COMPILER_NATIVE_TEMPLATE */]: {
11419 message: `<template> with no special directives will render as a native template ` +
11420 `element instead of its inner content in Vue 3.`
11421 },
11422 ["COMPILER_INLINE_TEMPLATE" /* COMPILER_INLINE_TEMPLATE */]: {
11423 message: `"inline-template" has been removed in Vue 3.`,
11424 link: `https://v3-migration.vuejs.org/breaking-changes/inline-template-attribute.html`
11425 },
11426 ["COMPILER_FILTER" /* COMPILER_FILTERS */]: {
11427 message: `filters have been removed in Vue 3. ` +
11428 `The "|" symbol will be treated as native JavaScript bitwise OR operator. ` +
11429 `Use method calls or computed properties instead.`,
11430 link: `https://v3-migration.vuejs.org/breaking-changes/filters.html`
11431 }
11432 };
11433 function getCompatValue(key, context) {
11434 const config = context.options
11435 ? context.options.compatConfig
11436 : context.compatConfig;
11437 const value = config && config[key];
11438 if (key === 'MODE') {
11439 return value || 3; // compiler defaults to v3 behavior
11440 }
11441 else {
11442 return value;
11443 }
11444 }
11445 function isCompatEnabled(key, context) {
11446 const mode = getCompatValue('MODE', context);
11447 const value = getCompatValue(key, context);
11448 // in v3 mode, only enable if explicitly set to true
11449 // otherwise enable for any non-false value
11450 return mode === 3 ? value === true : value !== false;
11451 }
11452 function checkCompatEnabled(key, context, loc, ...args) {
11453 const enabled = isCompatEnabled(key, context);
11454 if (enabled) {
11455 warnDeprecation(key, context, loc, ...args);
11456 }
11457 return enabled;
11458 }
11459 function warnDeprecation(key, context, loc, ...args) {
11460 const val = getCompatValue(key, context);
11461 if (val === 'suppress-warning') {
11462 return;
11463 }
11464 const { message, link } = deprecationData[key];
11465 const msg = `(deprecation ${key}) ${typeof message === 'function' ? message(...args) : message}${link ? `\n Details: ${link}` : ``}`;
11466 const err = new SyntaxError(msg);
11467 err.code = key;
11468 if (loc)
11469 err.loc = loc;
11470 context.onWarn(err);
11471 }
11472
11473 // The default decoder only provides escapes for characters reserved as part of
11474 // the template syntax, and is only used if the custom renderer did not provide
11475 // a platform-specific decoder.
11476 const decodeRE = /&(gt|lt|amp|apos|quot);/g;
11477 const decodeMap = {
11478 gt: '>',
11479 lt: '<',
11480 amp: '&',
11481 apos: "'",
11482 quot: '"'
11483 };
11484 const defaultParserOptions = {
11485 delimiters: [`{{`, `}}`],
11486 getNamespace: () => 0 /* HTML */,
11487 getTextMode: () => 0 /* DATA */,
11488 isVoidTag: NO,
11489 isPreTag: NO,
11490 isCustomElement: NO,
11491 decodeEntities: (rawText) => rawText.replace(decodeRE, (_, p1) => decodeMap[p1]),
11492 onError: defaultOnError,
11493 onWarn: defaultOnWarn,
11494 comments: true
11495 };
11496 function baseParse(content, options = {}) {
11497 const context = createParserContext(content, options);
11498 const start = getCursor(context);
11499 return createRoot(parseChildren(context, 0 /* DATA */, []), getSelection(context, start));
11500 }
11501 function createParserContext(content, rawOptions) {
11502 const options = extend({}, defaultParserOptions);
11503 let key;
11504 for (key in rawOptions) {
11505 // @ts-ignore
11506 options[key] =
11507 rawOptions[key] === undefined
11508 ? defaultParserOptions[key]
11509 : rawOptions[key];
11510 }
11511 return {
11512 options,
11513 column: 1,
11514 line: 1,
11515 offset: 0,
11516 originalSource: content,
11517 source: content,
11518 inPre: false,
11519 inVPre: false,
11520 onWarn: options.onWarn
11521 };
11522 }
11523 function parseChildren(context, mode, ancestors) {
11524 const parent = last(ancestors);
11525 const ns = parent ? parent.ns : 0 /* HTML */;
11526 const nodes = [];
11527 while (!isEnd(context, mode, ancestors)) {
11528 const s = context.source;
11529 let node = undefined;
11530 if (mode === 0 /* DATA */ || mode === 1 /* RCDATA */) {
11531 if (!context.inVPre && startsWith(s, context.options.delimiters[0])) {
11532 // '{{'
11533 node = parseInterpolation(context, mode);
11534 }
11535 else if (mode === 0 /* DATA */ && s[0] === '<') {
11536 // https://html.spec.whatwg.org/multipage/parsing.html#tag-open-state
11537 if (s.length === 1) {
11538 emitError(context, 5 /* EOF_BEFORE_TAG_NAME */, 1);
11539 }
11540 else if (s[1] === '!') {
11541 // https://html.spec.whatwg.org/multipage/parsing.html#markup-declaration-open-state
11542 if (startsWith(s, '<!--')) {
11543 node = parseComment(context);
11544 }
11545 else if (startsWith(s, '<!DOCTYPE')) {
11546 // Ignore DOCTYPE by a limitation.
11547 node = parseBogusComment(context);
11548 }
11549 else if (startsWith(s, '<![CDATA[')) {
11550 if (ns !== 0 /* HTML */) {
11551 node = parseCDATA(context, ancestors);
11552 }
11553 else {
11554 emitError(context, 1 /* CDATA_IN_HTML_CONTENT */);
11555 node = parseBogusComment(context);
11556 }
11557 }
11558 else {
11559 emitError(context, 11 /* INCORRECTLY_OPENED_COMMENT */);
11560 node = parseBogusComment(context);
11561 }
11562 }
11563 else if (s[1] === '/') {
11564 // https://html.spec.whatwg.org/multipage/parsing.html#end-tag-open-state
11565 if (s.length === 2) {
11566 emitError(context, 5 /* EOF_BEFORE_TAG_NAME */, 2);
11567 }
11568 else if (s[2] === '>') {
11569 emitError(context, 14 /* MISSING_END_TAG_NAME */, 2);
11570 advanceBy(context, 3);
11571 continue;
11572 }
11573 else if (/[a-z]/i.test(s[2])) {
11574 emitError(context, 23 /* X_INVALID_END_TAG */);
11575 parseTag(context, 1 /* End */, parent);
11576 continue;
11577 }
11578 else {
11579 emitError(context, 12 /* INVALID_FIRST_CHARACTER_OF_TAG_NAME */, 2);
11580 node = parseBogusComment(context);
11581 }
11582 }
11583 else if (/[a-z]/i.test(s[1])) {
11584 node = parseElement(context, ancestors);
11585 }
11586 else if (s[1] === '?') {
11587 emitError(context, 21 /* UNEXPECTED_QUESTION_MARK_INSTEAD_OF_TAG_NAME */, 1);
11588 node = parseBogusComment(context);
11589 }
11590 else {
11591 emitError(context, 12 /* INVALID_FIRST_CHARACTER_OF_TAG_NAME */, 1);
11592 }
11593 }
11594 }
11595 if (!node) {
11596 node = parseText(context, mode);
11597 }
11598 if (isArray(node)) {
11599 for (let i = 0; i < node.length; i++) {
11600 pushNode(nodes, node[i]);
11601 }
11602 }
11603 else {
11604 pushNode(nodes, node);
11605 }
11606 }
11607 // Whitespace handling strategy like v2
11608 let removedWhitespace = false;
11609 if (mode !== 2 /* RAWTEXT */ && mode !== 1 /* RCDATA */) {
11610 const shouldCondense = context.options.whitespace !== 'preserve';
11611 for (let i = 0; i < nodes.length; i++) {
11612 const node = nodes[i];
11613 if (!context.inPre && node.type === 2 /* TEXT */) {
11614 if (!/[^\t\r\n\f ]/.test(node.content)) {
11615 const prev = nodes[i - 1];
11616 const next = nodes[i + 1];
11617 // Remove if:
11618 // - the whitespace is the first or last node, or:
11619 // - (condense mode) the whitespace is adjacent to a comment, or:
11620 // - (condense mode) the whitespace is between two elements AND contains newline
11621 if (!prev ||
11622 !next ||
11623 (shouldCondense &&
11624 (prev.type === 3 /* COMMENT */ ||
11625 next.type === 3 /* COMMENT */ ||
11626 (prev.type === 1 /* ELEMENT */ &&
11627 next.type === 1 /* ELEMENT */ &&
11628 /[\r\n]/.test(node.content))))) {
11629 removedWhitespace = true;
11630 nodes[i] = null;
11631 }
11632 else {
11633 // Otherwise, the whitespace is condensed into a single space
11634 node.content = ' ';
11635 }
11636 }
11637 else if (shouldCondense) {
11638 // in condense mode, consecutive whitespaces in text are condensed
11639 // down to a single space.
11640 node.content = node.content.replace(/[\t\r\n\f ]+/g, ' ');
11641 }
11642 }
11643 // Remove comment nodes if desired by configuration.
11644 else if (node.type === 3 /* COMMENT */ && !context.options.comments) {
11645 removedWhitespace = true;
11646 nodes[i] = null;
11647 }
11648 }
11649 if (context.inPre && parent && context.options.isPreTag(parent.tag)) {
11650 // remove leading newline per html spec
11651 // https://html.spec.whatwg.org/multipage/grouping-content.html#the-pre-element
11652 const first = nodes[0];
11653 if (first && first.type === 2 /* TEXT */) {
11654 first.content = first.content.replace(/^\r?\n/, '');
11655 }
11656 }
11657 }
11658 return removedWhitespace ? nodes.filter(Boolean) : nodes;
11659 }
11660 function pushNode(nodes, node) {
11661 if (node.type === 2 /* TEXT */) {
11662 const prev = last(nodes);
11663 // Merge if both this and the previous node are text and those are
11664 // consecutive. This happens for cases like "a < b".
11665 if (prev &&
11666 prev.type === 2 /* TEXT */ &&
11667 prev.loc.end.offset === node.loc.start.offset) {
11668 prev.content += node.content;
11669 prev.loc.end = node.loc.end;
11670 prev.loc.source += node.loc.source;
11671 return;
11672 }
11673 }
11674 nodes.push(node);
11675 }
11676 function parseCDATA(context, ancestors) {
11677 advanceBy(context, 9);
11678 const nodes = parseChildren(context, 3 /* CDATA */, ancestors);
11679 if (context.source.length === 0) {
11680 emitError(context, 6 /* EOF_IN_CDATA */);
11681 }
11682 else {
11683 advanceBy(context, 3);
11684 }
11685 return nodes;
11686 }
11687 function parseComment(context) {
11688 const start = getCursor(context);
11689 let content;
11690 // Regular comment.
11691 const match = /--(\!)?>/.exec(context.source);
11692 if (!match) {
11693 content = context.source.slice(4);
11694 advanceBy(context, context.source.length);
11695 emitError(context, 7 /* EOF_IN_COMMENT */);
11696 }
11697 else {
11698 if (match.index <= 3) {
11699 emitError(context, 0 /* ABRUPT_CLOSING_OF_EMPTY_COMMENT */);
11700 }
11701 if (match[1]) {
11702 emitError(context, 10 /* INCORRECTLY_CLOSED_COMMENT */);
11703 }
11704 content = context.source.slice(4, match.index);
11705 // Advancing with reporting nested comments.
11706 const s = context.source.slice(0, match.index);
11707 let prevIndex = 1, nestedIndex = 0;
11708 while ((nestedIndex = s.indexOf('<!--', prevIndex)) !== -1) {
11709 advanceBy(context, nestedIndex - prevIndex + 1);
11710 if (nestedIndex + 4 < s.length) {
11711 emitError(context, 16 /* NESTED_COMMENT */);
11712 }
11713 prevIndex = nestedIndex + 1;
11714 }
11715 advanceBy(context, match.index + match[0].length - prevIndex + 1);
11716 }
11717 return {
11718 type: 3 /* COMMENT */,
11719 content,
11720 loc: getSelection(context, start)
11721 };
11722 }
11723 function parseBogusComment(context) {
11724 const start = getCursor(context);
11725 const contentStart = context.source[1] === '?' ? 1 : 2;
11726 let content;
11727 const closeIndex = context.source.indexOf('>');
11728 if (closeIndex === -1) {
11729 content = context.source.slice(contentStart);
11730 advanceBy(context, context.source.length);
11731 }
11732 else {
11733 content = context.source.slice(contentStart, closeIndex);
11734 advanceBy(context, closeIndex + 1);
11735 }
11736 return {
11737 type: 3 /* COMMENT */,
11738 content,
11739 loc: getSelection(context, start)
11740 };
11741 }
11742 function parseElement(context, ancestors) {
11743 // Start tag.
11744 const wasInPre = context.inPre;
11745 const wasInVPre = context.inVPre;
11746 const parent = last(ancestors);
11747 const element = parseTag(context, 0 /* Start */, parent);
11748 const isPreBoundary = context.inPre && !wasInPre;
11749 const isVPreBoundary = context.inVPre && !wasInVPre;
11750 if (element.isSelfClosing || context.options.isVoidTag(element.tag)) {
11751 // #4030 self-closing <pre> tag
11752 if (isPreBoundary) {
11753 context.inPre = false;
11754 }
11755 if (isVPreBoundary) {
11756 context.inVPre = false;
11757 }
11758 return element;
11759 }
11760 // Children.
11761 ancestors.push(element);
11762 const mode = context.options.getTextMode(element, parent);
11763 const children = parseChildren(context, mode, ancestors);
11764 ancestors.pop();
11765 element.children = children;
11766 // End tag.
11767 if (startsWithEndTagOpen(context.source, element.tag)) {
11768 parseTag(context, 1 /* End */, parent);
11769 }
11770 else {
11771 emitError(context, 24 /* X_MISSING_END_TAG */, 0, element.loc.start);
11772 if (context.source.length === 0 && element.tag.toLowerCase() === 'script') {
11773 const first = children[0];
11774 if (first && startsWith(first.loc.source, '<!--')) {
11775 emitError(context, 8 /* EOF_IN_SCRIPT_HTML_COMMENT_LIKE_TEXT */);
11776 }
11777 }
11778 }
11779 element.loc = getSelection(context, element.loc.start);
11780 if (isPreBoundary) {
11781 context.inPre = false;
11782 }
11783 if (isVPreBoundary) {
11784 context.inVPre = false;
11785 }
11786 return element;
11787 }
11788 const isSpecialTemplateDirective = /*#__PURE__*/ makeMap(`if,else,else-if,for,slot`);
11789 function parseTag(context, type, parent) {
11790 // Tag open.
11791 const start = getCursor(context);
11792 const match = /^<\/?([a-z][^\t\r\n\f />]*)/i.exec(context.source);
11793 const tag = match[1];
11794 const ns = context.options.getNamespace(tag, parent);
11795 advanceBy(context, match[0].length);
11796 advanceSpaces(context);
11797 // save current state in case we need to re-parse attributes with v-pre
11798 const cursor = getCursor(context);
11799 const currentSource = context.source;
11800 // check <pre> tag
11801 if (context.options.isPreTag(tag)) {
11802 context.inPre = true;
11803 }
11804 // Attributes.
11805 let props = parseAttributes(context, type);
11806 // check v-pre
11807 if (type === 0 /* Start */ &&
11808 !context.inVPre &&
11809 props.some(p => p.type === 7 /* DIRECTIVE */ && p.name === 'pre')) {
11810 context.inVPre = true;
11811 // reset context
11812 extend(context, cursor);
11813 context.source = currentSource;
11814 // re-parse attrs and filter out v-pre itself
11815 props = parseAttributes(context, type).filter(p => p.name !== 'v-pre');
11816 }
11817 // Tag close.
11818 let isSelfClosing = false;
11819 if (context.source.length === 0) {
11820 emitError(context, 9 /* EOF_IN_TAG */);
11821 }
11822 else {
11823 isSelfClosing = startsWith(context.source, '/>');
11824 if (type === 1 /* End */ && isSelfClosing) {
11825 emitError(context, 4 /* END_TAG_WITH_TRAILING_SOLIDUS */);
11826 }
11827 advanceBy(context, isSelfClosing ? 2 : 1);
11828 }
11829 if (type === 1 /* End */) {
11830 return;
11831 }
11832 let tagType = 0 /* ELEMENT */;
11833 if (!context.inVPre) {
11834 if (tag === 'slot') {
11835 tagType = 2 /* SLOT */;
11836 }
11837 else if (tag === 'template') {
11838 if (props.some(p => p.type === 7 /* DIRECTIVE */ && isSpecialTemplateDirective(p.name))) {
11839 tagType = 3 /* TEMPLATE */;
11840 }
11841 }
11842 else if (isComponent(tag, props, context)) {
11843 tagType = 1 /* COMPONENT */;
11844 }
11845 }
11846 return {
11847 type: 1 /* ELEMENT */,
11848 ns,
11849 tag,
11850 tagType,
11851 props,
11852 isSelfClosing,
11853 children: [],
11854 loc: getSelection(context, start),
11855 codegenNode: undefined // to be created during transform phase
11856 };
11857 }
11858 function isComponent(tag, props, context) {
11859 const options = context.options;
11860 if (options.isCustomElement(tag)) {
11861 return false;
11862 }
11863 if (tag === 'component' ||
11864 /^[A-Z]/.test(tag) ||
11865 isCoreComponent(tag) ||
11866 (options.isBuiltInComponent && options.isBuiltInComponent(tag)) ||
11867 (options.isNativeTag && !options.isNativeTag(tag))) {
11868 return true;
11869 }
11870 // at this point the tag should be a native tag, but check for potential "is"
11871 // casting
11872 for (let i = 0; i < props.length; i++) {
11873 const p = props[i];
11874 if (p.type === 6 /* ATTRIBUTE */) {
11875 if (p.name === 'is' && p.value) {
11876 if (p.value.content.startsWith('vue:')) {
11877 return true;
11878 }
11879 }
11880 }
11881 else {
11882 // directive
11883 // v-is (TODO Deprecate)
11884 if (p.name === 'is') {
11885 return true;
11886 }
11887 else if (
11888 // :is on plain element - only treat as component in compat mode
11889 p.name === 'bind' &&
11890 isStaticArgOf(p.arg, 'is') &&
11891 false &&
11892 checkCompatEnabled("COMPILER_IS_ON_ELEMENT" /* COMPILER_IS_ON_ELEMENT */, context, p.loc)) {
11893 return true;
11894 }
11895 }
11896 }
11897 }
11898 function parseAttributes(context, type) {
11899 const props = [];
11900 const attributeNames = new Set();
11901 while (context.source.length > 0 &&
11902 !startsWith(context.source, '>') &&
11903 !startsWith(context.source, '/>')) {
11904 if (startsWith(context.source, '/')) {
11905 emitError(context, 22 /* UNEXPECTED_SOLIDUS_IN_TAG */);
11906 advanceBy(context, 1);
11907 advanceSpaces(context);
11908 continue;
11909 }
11910 if (type === 1 /* End */) {
11911 emitError(context, 3 /* END_TAG_WITH_ATTRIBUTES */);
11912 }
11913 const attr = parseAttribute(context, attributeNames);
11914 // Trim whitespace between class
11915 // https://github.com/vuejs/core/issues/4251
11916 if (attr.type === 6 /* ATTRIBUTE */ &&
11917 attr.value &&
11918 attr.name === 'class') {
11919 attr.value.content = attr.value.content.replace(/\s+/g, ' ').trim();
11920 }
11921 if (type === 0 /* Start */) {
11922 props.push(attr);
11923 }
11924 if (/^[^\t\r\n\f />]/.test(context.source)) {
11925 emitError(context, 15 /* MISSING_WHITESPACE_BETWEEN_ATTRIBUTES */);
11926 }
11927 advanceSpaces(context);
11928 }
11929 return props;
11930 }
11931 function parseAttribute(context, nameSet) {
11932 // Name.
11933 const start = getCursor(context);
11934 const match = /^[^\t\r\n\f />][^\t\r\n\f />=]*/.exec(context.source);
11935 const name = match[0];
11936 if (nameSet.has(name)) {
11937 emitError(context, 2 /* DUPLICATE_ATTRIBUTE */);
11938 }
11939 nameSet.add(name);
11940 if (name[0] === '=') {
11941 emitError(context, 19 /* UNEXPECTED_EQUALS_SIGN_BEFORE_ATTRIBUTE_NAME */);
11942 }
11943 {
11944 const pattern = /["'<]/g;
11945 let m;
11946 while ((m = pattern.exec(name))) {
11947 emitError(context, 17 /* UNEXPECTED_CHARACTER_IN_ATTRIBUTE_NAME */, m.index);
11948 }
11949 }
11950 advanceBy(context, name.length);
11951 // Value
11952 let value = undefined;
11953 if (/^[\t\r\n\f ]*=/.test(context.source)) {
11954 advanceSpaces(context);
11955 advanceBy(context, 1);
11956 advanceSpaces(context);
11957 value = parseAttributeValue(context);
11958 if (!value) {
11959 emitError(context, 13 /* MISSING_ATTRIBUTE_VALUE */);
11960 }
11961 }
11962 const loc = getSelection(context, start);
11963 if (!context.inVPre && /^(v-[A-Za-z0-9-]|:|\.|@|#)/.test(name)) {
11964 const match = /(?:^v-([a-z0-9-]+))?(?:(?::|^\.|^@|^#)(\[[^\]]+\]|[^\.]+))?(.+)?$/i.exec(name);
11965 let isPropShorthand = startsWith(name, '.');
11966 let dirName = match[1] ||
11967 (isPropShorthand || startsWith(name, ':')
11968 ? 'bind'
11969 : startsWith(name, '@')
11970 ? 'on'
11971 : 'slot');
11972 let arg;
11973 if (match[2]) {
11974 const isSlot = dirName === 'slot';
11975 const startOffset = name.lastIndexOf(match[2]);
11976 const loc = getSelection(context, getNewPosition(context, start, startOffset), getNewPosition(context, start, startOffset + match[2].length + ((isSlot && match[3]) || '').length));
11977 let content = match[2];
11978 let isStatic = true;
11979 if (content.startsWith('[')) {
11980 isStatic = false;
11981 if (!content.endsWith(']')) {
11982 emitError(context, 27 /* X_MISSING_DYNAMIC_DIRECTIVE_ARGUMENT_END */);
11983 content = content.slice(1);
11984 }
11985 else {
11986 content = content.slice(1, content.length - 1);
11987 }
11988 }
11989 else if (isSlot) {
11990 // #1241 special case for v-slot: vuetify relies extensively on slot
11991 // names containing dots. v-slot doesn't have any modifiers and Vue 2.x
11992 // supports such usage so we are keeping it consistent with 2.x.
11993 content += match[3] || '';
11994 }
11995 arg = {
11996 type: 4 /* SIMPLE_EXPRESSION */,
11997 content,
11998 isStatic,
11999 constType: isStatic
12000 ? 3 /* CAN_STRINGIFY */
12001 : 0 /* NOT_CONSTANT */,
12002 loc
12003 };
12004 }
12005 if (value && value.isQuoted) {
12006 const valueLoc = value.loc;
12007 valueLoc.start.offset++;
12008 valueLoc.start.column++;
12009 valueLoc.end = advancePositionWithClone(valueLoc.start, value.content);
12010 valueLoc.source = valueLoc.source.slice(1, -1);
12011 }
12012 const modifiers = match[3] ? match[3].slice(1).split('.') : [];
12013 if (isPropShorthand)
12014 modifiers.push('prop');
12015 return {
12016 type: 7 /* DIRECTIVE */,
12017 name: dirName,
12018 exp: value && {
12019 type: 4 /* SIMPLE_EXPRESSION */,
12020 content: value.content,
12021 isStatic: false,
12022 // Treat as non-constant by default. This can be potentially set to
12023 // other values by `transformExpression` to make it eligible for hoisting.
12024 constType: 0 /* NOT_CONSTANT */,
12025 loc: value.loc
12026 },
12027 arg,
12028 modifiers,
12029 loc
12030 };
12031 }
12032 // missing directive name or illegal directive name
12033 if (!context.inVPre && startsWith(name, 'v-')) {
12034 emitError(context, 26 /* X_MISSING_DIRECTIVE_NAME */);
12035 }
12036 return {
12037 type: 6 /* ATTRIBUTE */,
12038 name,
12039 value: value && {
12040 type: 2 /* TEXT */,
12041 content: value.content,
12042 loc: value.loc
12043 },
12044 loc
12045 };
12046 }
12047 function parseAttributeValue(context) {
12048 const start = getCursor(context);
12049 let content;
12050 const quote = context.source[0];
12051 const isQuoted = quote === `"` || quote === `'`;
12052 if (isQuoted) {
12053 // Quoted value.
12054 advanceBy(context, 1);
12055 const endIndex = context.source.indexOf(quote);
12056 if (endIndex === -1) {
12057 content = parseTextData(context, context.source.length, 4 /* ATTRIBUTE_VALUE */);
12058 }
12059 else {
12060 content = parseTextData(context, endIndex, 4 /* ATTRIBUTE_VALUE */);
12061 advanceBy(context, 1);
12062 }
12063 }
12064 else {
12065 // Unquoted
12066 const match = /^[^\t\r\n\f >]+/.exec(context.source);
12067 if (!match) {
12068 return undefined;
12069 }
12070 const unexpectedChars = /["'<=`]/g;
12071 let m;
12072 while ((m = unexpectedChars.exec(match[0]))) {
12073 emitError(context, 18 /* UNEXPECTED_CHARACTER_IN_UNQUOTED_ATTRIBUTE_VALUE */, m.index);
12074 }
12075 content = parseTextData(context, match[0].length, 4 /* ATTRIBUTE_VALUE */);
12076 }
12077 return { content, isQuoted, loc: getSelection(context, start) };
12078 }
12079 function parseInterpolation(context, mode) {
12080 const [open, close] = context.options.delimiters;
12081 const closeIndex = context.source.indexOf(close, open.length);
12082 if (closeIndex === -1) {
12083 emitError(context, 25 /* X_MISSING_INTERPOLATION_END */);
12084 return undefined;
12085 }
12086 const start = getCursor(context);
12087 advanceBy(context, open.length);
12088 const innerStart = getCursor(context);
12089 const innerEnd = getCursor(context);
12090 const rawContentLength = closeIndex - open.length;
12091 const rawContent = context.source.slice(0, rawContentLength);
12092 const preTrimContent = parseTextData(context, rawContentLength, mode);
12093 const content = preTrimContent.trim();
12094 const startOffset = preTrimContent.indexOf(content);
12095 if (startOffset > 0) {
12096 advancePositionWithMutation(innerStart, rawContent, startOffset);
12097 }
12098 const endOffset = rawContentLength - (preTrimContent.length - content.length - startOffset);
12099 advancePositionWithMutation(innerEnd, rawContent, endOffset);
12100 advanceBy(context, close.length);
12101 return {
12102 type: 5 /* INTERPOLATION */,
12103 content: {
12104 type: 4 /* SIMPLE_EXPRESSION */,
12105 isStatic: false,
12106 // Set `isConstant` to false by default and will decide in transformExpression
12107 constType: 0 /* NOT_CONSTANT */,
12108 content,
12109 loc: getSelection(context, innerStart, innerEnd)
12110 },
12111 loc: getSelection(context, start)
12112 };
12113 }
12114 function parseText(context, mode) {
12115 const endTokens = mode === 3 /* CDATA */ ? [']]>'] : ['<', context.options.delimiters[0]];
12116 let endIndex = context.source.length;
12117 for (let i = 0; i < endTokens.length; i++) {
12118 const index = context.source.indexOf(endTokens[i], 1);
12119 if (index !== -1 && endIndex > index) {
12120 endIndex = index;
12121 }
12122 }
12123 const start = getCursor(context);
12124 const content = parseTextData(context, endIndex, mode);
12125 return {
12126 type: 2 /* TEXT */,
12127 content,
12128 loc: getSelection(context, start)
12129 };
12130 }
12131 /**
12132 * Get text data with a given length from the current location.
12133 * This translates HTML entities in the text data.
12134 */
12135 function parseTextData(context, length, mode) {
12136 const rawText = context.source.slice(0, length);
12137 advanceBy(context, length);
12138 if (mode === 2 /* RAWTEXT */ ||
12139 mode === 3 /* CDATA */ ||
12140 !rawText.includes('&')) {
12141 return rawText;
12142 }
12143 else {
12144 // DATA or RCDATA containing "&"". Entity decoding required.
12145 return context.options.decodeEntities(rawText, mode === 4 /* ATTRIBUTE_VALUE */);
12146 }
12147 }
12148 function getCursor(context) {
12149 const { column, line, offset } = context;
12150 return { column, line, offset };
12151 }
12152 function getSelection(context, start, end) {
12153 end = end || getCursor(context);
12154 return {
12155 start,
12156 end,
12157 source: context.originalSource.slice(start.offset, end.offset)
12158 };
12159 }
12160 function last(xs) {
12161 return xs[xs.length - 1];
12162 }
12163 function startsWith(source, searchString) {
12164 return source.startsWith(searchString);
12165 }
12166 function advanceBy(context, numberOfCharacters) {
12167 const { source } = context;
12168 advancePositionWithMutation(context, source, numberOfCharacters);
12169 context.source = source.slice(numberOfCharacters);
12170 }
12171 function advanceSpaces(context) {
12172 const match = /^[\t\r\n\f ]+/.exec(context.source);
12173 if (match) {
12174 advanceBy(context, match[0].length);
12175 }
12176 }
12177 function getNewPosition(context, start, numberOfCharacters) {
12178 return advancePositionWithClone(start, context.originalSource.slice(start.offset, numberOfCharacters), numberOfCharacters);
12179 }
12180 function emitError(context, code, offset, loc = getCursor(context)) {
12181 if (offset) {
12182 loc.offset += offset;
12183 loc.column += offset;
12184 }
12185 context.options.onError(createCompilerError(code, {
12186 start: loc,
12187 end: loc,
12188 source: ''
12189 }));
12190 }
12191 function isEnd(context, mode, ancestors) {
12192 const s = context.source;
12193 switch (mode) {
12194 case 0 /* DATA */:
12195 if (startsWith(s, '</')) {
12196 // TODO: probably bad performance
12197 for (let i = ancestors.length - 1; i >= 0; --i) {
12198 if (startsWithEndTagOpen(s, ancestors[i].tag)) {
12199 return true;
12200 }
12201 }
12202 }
12203 break;
12204 case 1 /* RCDATA */:
12205 case 2 /* RAWTEXT */: {
12206 const parent = last(ancestors);
12207 if (parent && startsWithEndTagOpen(s, parent.tag)) {
12208 return true;
12209 }
12210 break;
12211 }
12212 case 3 /* CDATA */:
12213 if (startsWith(s, ']]>')) {
12214 return true;
12215 }
12216 break;
12217 }
12218 return !s;
12219 }
12220 function startsWithEndTagOpen(source, tag) {
12221 return (startsWith(source, '</') &&
12222 source.slice(2, 2 + tag.length).toLowerCase() === tag.toLowerCase() &&
12223 /[\t\r\n\f />]/.test(source[2 + tag.length] || '>'));
12224 }
12225
12226 function hoistStatic(root, context) {
12227 walk(root, context,
12228 // Root node is unfortunately non-hoistable due to potential parent
12229 // fallthrough attributes.
12230 isSingleElementRoot(root, root.children[0]));
12231 }
12232 function isSingleElementRoot(root, child) {
12233 const { children } = root;
12234 return (children.length === 1 &&
12235 child.type === 1 /* ELEMENT */ &&
12236 !isSlotOutlet(child));
12237 }
12238 function walk(node, context, doNotHoistNode = false) {
12239 const { children } = node;
12240 const originalCount = children.length;
12241 let hoistedCount = 0;
12242 for (let i = 0; i < children.length; i++) {
12243 const child = children[i];
12244 // only plain elements & text calls are eligible for hoisting.
12245 if (child.type === 1 /* ELEMENT */ &&
12246 child.tagType === 0 /* ELEMENT */) {
12247 const constantType = doNotHoistNode
12248 ? 0 /* NOT_CONSTANT */
12249 : getConstantType(child, context);
12250 if (constantType > 0 /* NOT_CONSTANT */) {
12251 if (constantType >= 2 /* CAN_HOIST */) {
12252 child.codegenNode.patchFlag =
12253 -1 /* HOISTED */ + (` /* HOISTED */` );
12254 child.codegenNode = context.hoist(child.codegenNode);
12255 hoistedCount++;
12256 continue;
12257 }
12258 }
12259 else {
12260 // node may contain dynamic children, but its props may be eligible for
12261 // hoisting.
12262 const codegenNode = child.codegenNode;
12263 if (codegenNode.type === 13 /* VNODE_CALL */) {
12264 const flag = getPatchFlag(codegenNode);
12265 if ((!flag ||
12266 flag === 512 /* NEED_PATCH */ ||
12267 flag === 1 /* TEXT */) &&
12268 getGeneratedPropsConstantType(child, context) >=
12269 2 /* CAN_HOIST */) {
12270 const props = getNodeProps(child);
12271 if (props) {
12272 codegenNode.props = context.hoist(props);
12273 }
12274 }
12275 if (codegenNode.dynamicProps) {
12276 codegenNode.dynamicProps = context.hoist(codegenNode.dynamicProps);
12277 }
12278 }
12279 }
12280 }
12281 else if (child.type === 12 /* TEXT_CALL */ &&
12282 getConstantType(child.content, context) >= 2 /* CAN_HOIST */) {
12283 child.codegenNode = context.hoist(child.codegenNode);
12284 hoistedCount++;
12285 }
12286 // walk further
12287 if (child.type === 1 /* ELEMENT */) {
12288 const isComponent = child.tagType === 1 /* COMPONENT */;
12289 if (isComponent) {
12290 context.scopes.vSlot++;
12291 }
12292 walk(child, context);
12293 if (isComponent) {
12294 context.scopes.vSlot--;
12295 }
12296 }
12297 else if (child.type === 11 /* FOR */) {
12298 // Do not hoist v-for single child because it has to be a block
12299 walk(child, context, child.children.length === 1);
12300 }
12301 else if (child.type === 9 /* IF */) {
12302 for (let i = 0; i < child.branches.length; i++) {
12303 // Do not hoist v-if single child because it has to be a block
12304 walk(child.branches[i], context, child.branches[i].children.length === 1);
12305 }
12306 }
12307 }
12308 if (hoistedCount && context.transformHoist) {
12309 context.transformHoist(children, context, node);
12310 }
12311 // all children were hoisted - the entire children array is hoistable.
12312 if (hoistedCount &&
12313 hoistedCount === originalCount &&
12314 node.type === 1 /* ELEMENT */ &&
12315 node.tagType === 0 /* ELEMENT */ &&
12316 node.codegenNode &&
12317 node.codegenNode.type === 13 /* VNODE_CALL */ &&
12318 isArray(node.codegenNode.children)) {
12319 node.codegenNode.children = context.hoist(createArrayExpression(node.codegenNode.children));
12320 }
12321 }
12322 function getConstantType(node, context) {
12323 const { constantCache } = context;
12324 switch (node.type) {
12325 case 1 /* ELEMENT */:
12326 if (node.tagType !== 0 /* ELEMENT */) {
12327 return 0 /* NOT_CONSTANT */;
12328 }
12329 const cached = constantCache.get(node);
12330 if (cached !== undefined) {
12331 return cached;
12332 }
12333 const codegenNode = node.codegenNode;
12334 if (codegenNode.type !== 13 /* VNODE_CALL */) {
12335 return 0 /* NOT_CONSTANT */;
12336 }
12337 if (codegenNode.isBlock &&
12338 node.tag !== 'svg' &&
12339 node.tag !== 'foreignObject') {
12340 return 0 /* NOT_CONSTANT */;
12341 }
12342 const flag = getPatchFlag(codegenNode);
12343 if (!flag) {
12344 let returnType = 3 /* CAN_STRINGIFY */;
12345 // Element itself has no patch flag. However we still need to check:
12346 // 1. Even for a node with no patch flag, it is possible for it to contain
12347 // non-hoistable expressions that refers to scope variables, e.g. compiler
12348 // injected keys or cached event handlers. Therefore we need to always
12349 // check the codegenNode's props to be sure.
12350 const generatedPropsType = getGeneratedPropsConstantType(node, context);
12351 if (generatedPropsType === 0 /* NOT_CONSTANT */) {
12352 constantCache.set(node, 0 /* NOT_CONSTANT */);
12353 return 0 /* NOT_CONSTANT */;
12354 }
12355 if (generatedPropsType < returnType) {
12356 returnType = generatedPropsType;
12357 }
12358 // 2. its children.
12359 for (let i = 0; i < node.children.length; i++) {
12360 const childType = getConstantType(node.children[i], context);
12361 if (childType === 0 /* NOT_CONSTANT */) {
12362 constantCache.set(node, 0 /* NOT_CONSTANT */);
12363 return 0 /* NOT_CONSTANT */;
12364 }
12365 if (childType < returnType) {
12366 returnType = childType;
12367 }
12368 }
12369 // 3. if the type is not already CAN_SKIP_PATCH which is the lowest non-0
12370 // type, check if any of the props can cause the type to be lowered
12371 // we can skip can_patch because it's guaranteed by the absence of a
12372 // patchFlag.
12373 if (returnType > 1 /* CAN_SKIP_PATCH */) {
12374 for (let i = 0; i < node.props.length; i++) {
12375 const p = node.props[i];
12376 if (p.type === 7 /* DIRECTIVE */ && p.name === 'bind' && p.exp) {
12377 const expType = getConstantType(p.exp, context);
12378 if (expType === 0 /* NOT_CONSTANT */) {
12379 constantCache.set(node, 0 /* NOT_CONSTANT */);
12380 return 0 /* NOT_CONSTANT */;
12381 }
12382 if (expType < returnType) {
12383 returnType = expType;
12384 }
12385 }
12386 }
12387 }
12388 // only svg/foreignObject could be block here, however if they are
12389 // static then they don't need to be blocks since there will be no
12390 // nested updates.
12391 if (codegenNode.isBlock) {
12392 context.removeHelper(OPEN_BLOCK);
12393 context.removeHelper(getVNodeBlockHelper(context.inSSR, codegenNode.isComponent));
12394 codegenNode.isBlock = false;
12395 context.helper(getVNodeHelper(context.inSSR, codegenNode.isComponent));
12396 }
12397 constantCache.set(node, returnType);
12398 return returnType;
12399 }
12400 else {
12401 constantCache.set(node, 0 /* NOT_CONSTANT */);
12402 return 0 /* NOT_CONSTANT */;
12403 }
12404 case 2 /* TEXT */:
12405 case 3 /* COMMENT */:
12406 return 3 /* CAN_STRINGIFY */;
12407 case 9 /* IF */:
12408 case 11 /* FOR */:
12409 case 10 /* IF_BRANCH */:
12410 return 0 /* NOT_CONSTANT */;
12411 case 5 /* INTERPOLATION */:
12412 case 12 /* TEXT_CALL */:
12413 return getConstantType(node.content, context);
12414 case 4 /* SIMPLE_EXPRESSION */:
12415 return node.constType;
12416 case 8 /* COMPOUND_EXPRESSION */:
12417 let returnType = 3 /* CAN_STRINGIFY */;
12418 for (let i = 0; i < node.children.length; i++) {
12419 const child = node.children[i];
12420 if (isString(child) || isSymbol(child)) {
12421 continue;
12422 }
12423 const childType = getConstantType(child, context);
12424 if (childType === 0 /* NOT_CONSTANT */) {
12425 return 0 /* NOT_CONSTANT */;
12426 }
12427 else if (childType < returnType) {
12428 returnType = childType;
12429 }
12430 }
12431 return returnType;
12432 default:
12433 return 0 /* NOT_CONSTANT */;
12434 }
12435 }
12436 const allowHoistedHelperSet = new Set([
12437 NORMALIZE_CLASS,
12438 NORMALIZE_STYLE,
12439 NORMALIZE_PROPS,
12440 GUARD_REACTIVE_PROPS
12441 ]);
12442 function getConstantTypeOfHelperCall(value, context) {
12443 if (value.type === 14 /* JS_CALL_EXPRESSION */ &&
12444 !isString(value.callee) &&
12445 allowHoistedHelperSet.has(value.callee)) {
12446 const arg = value.arguments[0];
12447 if (arg.type === 4 /* SIMPLE_EXPRESSION */) {
12448 return getConstantType(arg, context);
12449 }
12450 else if (arg.type === 14 /* JS_CALL_EXPRESSION */) {
12451 // in the case of nested helper call, e.g. `normalizeProps(guardReactiveProps(exp))`
12452 return getConstantTypeOfHelperCall(arg, context);
12453 }
12454 }
12455 return 0 /* NOT_CONSTANT */;
12456 }
12457 function getGeneratedPropsConstantType(node, context) {
12458 let returnType = 3 /* CAN_STRINGIFY */;
12459 const props = getNodeProps(node);
12460 if (props && props.type === 15 /* JS_OBJECT_EXPRESSION */) {
12461 const { properties } = props;
12462 for (let i = 0; i < properties.length; i++) {
12463 const { key, value } = properties[i];
12464 const keyType = getConstantType(key, context);
12465 if (keyType === 0 /* NOT_CONSTANT */) {
12466 return keyType;
12467 }
12468 if (keyType < returnType) {
12469 returnType = keyType;
12470 }
12471 let valueType;
12472 if (value.type === 4 /* SIMPLE_EXPRESSION */) {
12473 valueType = getConstantType(value, context);
12474 }
12475 else if (value.type === 14 /* JS_CALL_EXPRESSION */) {
12476 // some helper calls can be hoisted,
12477 // such as the `normalizeProps` generated by the compiler for pre-normalize class,
12478 // in this case we need to respect the ConstantType of the helper's arguments
12479 valueType = getConstantTypeOfHelperCall(value, context);
12480 }
12481 else {
12482 valueType = 0 /* NOT_CONSTANT */;
12483 }
12484 if (valueType === 0 /* NOT_CONSTANT */) {
12485 return valueType;
12486 }
12487 if (valueType < returnType) {
12488 returnType = valueType;
12489 }
12490 }
12491 }
12492 return returnType;
12493 }
12494 function getNodeProps(node) {
12495 const codegenNode = node.codegenNode;
12496 if (codegenNode.type === 13 /* VNODE_CALL */) {
12497 return codegenNode.props;
12498 }
12499 }
12500 function getPatchFlag(node) {
12501 const flag = node.patchFlag;
12502 return flag ? parseInt(flag, 10) : undefined;
12503 }
12504
12505 function createTransformContext(root, { filename = '', prefixIdentifiers = false, hoistStatic = false, cacheHandlers = false, nodeTransforms = [], directiveTransforms = {}, transformHoist = null, isBuiltInComponent = NOOP, isCustomElement = NOOP, expressionPlugins = [], scopeId = null, slotted = true, ssr = false, inSSR = false, ssrCssVars = ``, bindingMetadata = EMPTY_OBJ, inline = false, isTS = false, onError = defaultOnError, onWarn = defaultOnWarn, compatConfig }) {
12506 const nameMatch = filename.replace(/\?.*$/, '').match(/([^/\\]+)\.\w+$/);
12507 const context = {
12508 // options
12509 selfName: nameMatch && capitalize(camelize(nameMatch[1])),
12510 prefixIdentifiers,
12511 hoistStatic,
12512 cacheHandlers,
12513 nodeTransforms,
12514 directiveTransforms,
12515 transformHoist,
12516 isBuiltInComponent,
12517 isCustomElement,
12518 expressionPlugins,
12519 scopeId,
12520 slotted,
12521 ssr,
12522 inSSR,
12523 ssrCssVars,
12524 bindingMetadata,
12525 inline,
12526 isTS,
12527 onError,
12528 onWarn,
12529 compatConfig,
12530 // state
12531 root,
12532 helpers: new Map(),
12533 components: new Set(),
12534 directives: new Set(),
12535 hoists: [],
12536 imports: [],
12537 constantCache: new Map(),
12538 temps: 0,
12539 cached: 0,
12540 identifiers: Object.create(null),
12541 scopes: {
12542 vFor: 0,
12543 vSlot: 0,
12544 vPre: 0,
12545 vOnce: 0
12546 },
12547 parent: null,
12548 currentNode: root,
12549 childIndex: 0,
12550 inVOnce: false,
12551 // methods
12552 helper(name) {
12553 const count = context.helpers.get(name) || 0;
12554 context.helpers.set(name, count + 1);
12555 return name;
12556 },
12557 removeHelper(name) {
12558 const count = context.helpers.get(name);
12559 if (count) {
12560 const currentCount = count - 1;
12561 if (!currentCount) {
12562 context.helpers.delete(name);
12563 }
12564 else {
12565 context.helpers.set(name, currentCount);
12566 }
12567 }
12568 },
12569 helperString(name) {
12570 return `_${helperNameMap[context.helper(name)]}`;
12571 },
12572 replaceNode(node) {
12573 /* istanbul ignore if */
12574 {
12575 if (!context.currentNode) {
12576 throw new Error(`Node being replaced is already removed.`);
12577 }
12578 if (!context.parent) {
12579 throw new Error(`Cannot replace root node.`);
12580 }
12581 }
12582 context.parent.children[context.childIndex] = context.currentNode = node;
12583 },
12584 removeNode(node) {
12585 if (!context.parent) {
12586 throw new Error(`Cannot remove root node.`);
12587 }
12588 const list = context.parent.children;
12589 const removalIndex = node
12590 ? list.indexOf(node)
12591 : context.currentNode
12592 ? context.childIndex
12593 : -1;
12594 /* istanbul ignore if */
12595 if (removalIndex < 0) {
12596 throw new Error(`node being removed is not a child of current parent`);
12597 }
12598 if (!node || node === context.currentNode) {
12599 // current node removed
12600 context.currentNode = null;
12601 context.onNodeRemoved();
12602 }
12603 else {
12604 // sibling node removed
12605 if (context.childIndex > removalIndex) {
12606 context.childIndex--;
12607 context.onNodeRemoved();
12608 }
12609 }
12610 context.parent.children.splice(removalIndex, 1);
12611 },
12612 onNodeRemoved: () => { },
12613 addIdentifiers(exp) {
12614 },
12615 removeIdentifiers(exp) {
12616 },
12617 hoist(exp) {
12618 if (isString(exp))
12619 exp = createSimpleExpression(exp);
12620 context.hoists.push(exp);
12621 const identifier = createSimpleExpression(`_hoisted_${context.hoists.length}`, false, exp.loc, 2 /* CAN_HOIST */);
12622 identifier.hoisted = exp;
12623 return identifier;
12624 },
12625 cache(exp, isVNode = false) {
12626 return createCacheExpression(context.cached++, exp, isVNode);
12627 }
12628 };
12629 return context;
12630 }
12631 function transform(root, options) {
12632 const context = createTransformContext(root, options);
12633 traverseNode(root, context);
12634 if (options.hoistStatic) {
12635 hoistStatic(root, context);
12636 }
12637 if (!options.ssr) {
12638 createRootCodegen(root, context);
12639 }
12640 // finalize meta information
12641 root.helpers = [...context.helpers.keys()];
12642 root.components = [...context.components];
12643 root.directives = [...context.directives];
12644 root.imports = context.imports;
12645 root.hoists = context.hoists;
12646 root.temps = context.temps;
12647 root.cached = context.cached;
12648 }
12649 function createRootCodegen(root, context) {
12650 const { helper } = context;
12651 const { children } = root;
12652 if (children.length === 1) {
12653 const child = children[0];
12654 // if the single child is an element, turn it into a block.
12655 if (isSingleElementRoot(root, child) && child.codegenNode) {
12656 // single element root is never hoisted so codegenNode will never be
12657 // SimpleExpressionNode
12658 const codegenNode = child.codegenNode;
12659 if (codegenNode.type === 13 /* VNODE_CALL */) {
12660 makeBlock(codegenNode, context);
12661 }
12662 root.codegenNode = codegenNode;
12663 }
12664 else {
12665 // - single <slot/>, IfNode, ForNode: already blocks.
12666 // - single text node: always patched.
12667 // root codegen falls through via genNode()
12668 root.codegenNode = child;
12669 }
12670 }
12671 else if (children.length > 1) {
12672 // root has multiple nodes - return a fragment block.
12673 let patchFlag = 64 /* STABLE_FRAGMENT */;
12674 let patchFlagText = PatchFlagNames[64 /* STABLE_FRAGMENT */];
12675 // check if the fragment actually contains a single valid child with
12676 // the rest being comments
12677 if (children.filter(c => c.type !== 3 /* COMMENT */).length === 1) {
12678 patchFlag |= 2048 /* DEV_ROOT_FRAGMENT */;
12679 patchFlagText += `, ${PatchFlagNames[2048 /* DEV_ROOT_FRAGMENT */]}`;
12680 }
12681 root.codegenNode = createVNodeCall(context, helper(FRAGMENT), undefined, root.children, patchFlag + (` /* ${patchFlagText} */` ), undefined, undefined, true, undefined, false /* isComponent */);
12682 }
12683 else ;
12684 }
12685 function traverseChildren(parent, context) {
12686 let i = 0;
12687 const nodeRemoved = () => {
12688 i--;
12689 };
12690 for (; i < parent.children.length; i++) {
12691 const child = parent.children[i];
12692 if (isString(child))
12693 continue;
12694 context.parent = parent;
12695 context.childIndex = i;
12696 context.onNodeRemoved = nodeRemoved;
12697 traverseNode(child, context);
12698 }
12699 }
12700 function traverseNode(node, context) {
12701 context.currentNode = node;
12702 // apply transform plugins
12703 const { nodeTransforms } = context;
12704 const exitFns = [];
12705 for (let i = 0; i < nodeTransforms.length; i++) {
12706 const onExit = nodeTransforms[i](node, context);
12707 if (onExit) {
12708 if (isArray(onExit)) {
12709 exitFns.push(...onExit);
12710 }
12711 else {
12712 exitFns.push(onExit);
12713 }
12714 }
12715 if (!context.currentNode) {
12716 // node was removed
12717 return;
12718 }
12719 else {
12720 // node may have been replaced
12721 node = context.currentNode;
12722 }
12723 }
12724 switch (node.type) {
12725 case 3 /* COMMENT */:
12726 if (!context.ssr) {
12727 // inject import for the Comment symbol, which is needed for creating
12728 // comment nodes with `createVNode`
12729 context.helper(CREATE_COMMENT);
12730 }
12731 break;
12732 case 5 /* INTERPOLATION */:
12733 // no need to traverse, but we need to inject toString helper
12734 if (!context.ssr) {
12735 context.helper(TO_DISPLAY_STRING);
12736 }
12737 break;
12738 // for container types, further traverse downwards
12739 case 9 /* IF */:
12740 for (let i = 0; i < node.branches.length; i++) {
12741 traverseNode(node.branches[i], context);
12742 }
12743 break;
12744 case 10 /* IF_BRANCH */:
12745 case 11 /* FOR */:
12746 case 1 /* ELEMENT */:
12747 case 0 /* ROOT */:
12748 traverseChildren(node, context);
12749 break;
12750 }
12751 // exit transforms
12752 context.currentNode = node;
12753 let i = exitFns.length;
12754 while (i--) {
12755 exitFns[i]();
12756 }
12757 }
12758 function createStructuralDirectiveTransform(name, fn) {
12759 const matches = isString(name)
12760 ? (n) => n === name
12761 : (n) => name.test(n);
12762 return (node, context) => {
12763 if (node.type === 1 /* ELEMENT */) {
12764 const { props } = node;
12765 // structural directive transforms are not concerned with slots
12766 // as they are handled separately in vSlot.ts
12767 if (node.tagType === 3 /* TEMPLATE */ && props.some(isVSlot)) {
12768 return;
12769 }
12770 const exitFns = [];
12771 for (let i = 0; i < props.length; i++) {
12772 const prop = props[i];
12773 if (prop.type === 7 /* DIRECTIVE */ && matches(prop.name)) {
12774 // structural directives are removed to avoid infinite recursion
12775 // also we remove them *before* applying so that it can further
12776 // traverse itself in case it moves the node around
12777 props.splice(i, 1);
12778 i--;
12779 const onExit = fn(node, prop, context);
12780 if (onExit)
12781 exitFns.push(onExit);
12782 }
12783 }
12784 return exitFns;
12785 }
12786 };
12787 }
12788
12789 const PURE_ANNOTATION = `/*#__PURE__*/`;
12790 function createCodegenContext(ast, { mode = 'function', prefixIdentifiers = mode === 'module', sourceMap = false, filename = `template.vue.html`, scopeId = null, optimizeImports = false, runtimeGlobalName = `Vue`, runtimeModuleName = `vue`, ssrRuntimeModuleName = 'vue/server-renderer', ssr = false, isTS = false, inSSR = false }) {
12791 const context = {
12792 mode,
12793 prefixIdentifiers,
12794 sourceMap,
12795 filename,
12796 scopeId,
12797 optimizeImports,
12798 runtimeGlobalName,
12799 runtimeModuleName,
12800 ssrRuntimeModuleName,
12801 ssr,
12802 isTS,
12803 inSSR,
12804 source: ast.loc.source,
12805 code: ``,
12806 column: 1,
12807 line: 1,
12808 offset: 0,
12809 indentLevel: 0,
12810 pure: false,
12811 map: undefined,
12812 helper(key) {
12813 return `_${helperNameMap[key]}`;
12814 },
12815 push(code, node) {
12816 context.code += code;
12817 },
12818 indent() {
12819 newline(++context.indentLevel);
12820 },
12821 deindent(withoutNewLine = false) {
12822 if (withoutNewLine) {
12823 --context.indentLevel;
12824 }
12825 else {
12826 newline(--context.indentLevel);
12827 }
12828 },
12829 newline() {
12830 newline(context.indentLevel);
12831 }
12832 };
12833 function newline(n) {
12834 context.push('\n' + ` `.repeat(n));
12835 }
12836 return context;
12837 }
12838 function generate(ast, options = {}) {
12839 const context = createCodegenContext(ast, options);
12840 if (options.onContextCreated)
12841 options.onContextCreated(context);
12842 const { mode, push, prefixIdentifiers, indent, deindent, newline, scopeId, ssr } = context;
12843 const hasHelpers = ast.helpers.length > 0;
12844 const useWithBlock = !prefixIdentifiers && mode !== 'module';
12845 // preambles
12846 // in setup() inline mode, the preamble is generated in a sub context
12847 // and returned separately.
12848 const preambleContext = context;
12849 {
12850 genFunctionPreamble(ast, preambleContext);
12851 }
12852 // enter render function
12853 const functionName = ssr ? `ssrRender` : `render`;
12854 const args = ssr ? ['_ctx', '_push', '_parent', '_attrs'] : ['_ctx', '_cache'];
12855 const signature = args.join(', ');
12856 {
12857 push(`function ${functionName}(${signature}) {`);
12858 }
12859 indent();
12860 if (useWithBlock) {
12861 push(`with (_ctx) {`);
12862 indent();
12863 // function mode const declarations should be inside with block
12864 // also they should be renamed to avoid collision with user properties
12865 if (hasHelpers) {
12866 push(`const { ${ast.helpers
12867 .map(s => `${helperNameMap[s]}: _${helperNameMap[s]}`)
12868 .join(', ')} } = _Vue`);
12869 push(`\n`);
12870 newline();
12871 }
12872 }
12873 // generate asset resolution statements
12874 if (ast.components.length) {
12875 genAssets(ast.components, 'component', context);
12876 if (ast.directives.length || ast.temps > 0) {
12877 newline();
12878 }
12879 }
12880 if (ast.directives.length) {
12881 genAssets(ast.directives, 'directive', context);
12882 if (ast.temps > 0) {
12883 newline();
12884 }
12885 }
12886 if (ast.temps > 0) {
12887 push(`let `);
12888 for (let i = 0; i < ast.temps; i++) {
12889 push(`${i > 0 ? `, ` : ``}_temp${i}`);
12890 }
12891 }
12892 if (ast.components.length || ast.directives.length || ast.temps) {
12893 push(`\n`);
12894 newline();
12895 }
12896 // generate the VNode tree expression
12897 if (!ssr) {
12898 push(`return `);
12899 }
12900 if (ast.codegenNode) {
12901 genNode(ast.codegenNode, context);
12902 }
12903 else {
12904 push(`null`);
12905 }
12906 if (useWithBlock) {
12907 deindent();
12908 push(`}`);
12909 }
12910 deindent();
12911 push(`}`);
12912 return {
12913 ast,
12914 code: context.code,
12915 preamble: ``,
12916 // SourceMapGenerator does have toJSON() method but it's not in the types
12917 map: context.map ? context.map.toJSON() : undefined
12918 };
12919 }
12920 function genFunctionPreamble(ast, context) {
12921 const { ssr, prefixIdentifiers, push, newline, runtimeModuleName, runtimeGlobalName, ssrRuntimeModuleName } = context;
12922 const VueBinding = runtimeGlobalName;
12923 const aliasHelper = (s) => `${helperNameMap[s]}: _${helperNameMap[s]}`;
12924 // Generate const declaration for helpers
12925 // In prefix mode, we place the const declaration at top so it's done
12926 // only once; But if we not prefixing, we place the declaration inside the
12927 // with block so it doesn't incur the `in` check cost for every helper access.
12928 if (ast.helpers.length > 0) {
12929 {
12930 // "with" mode.
12931 // save Vue in a separate variable to avoid collision
12932 push(`const _Vue = ${VueBinding}\n`);
12933 // in "with" mode, helpers are declared inside the with block to avoid
12934 // has check cost, but hoists are lifted out of the function - we need
12935 // to provide the helper here.
12936 if (ast.hoists.length) {
12937 const staticHelpers = [
12938 CREATE_VNODE,
12939 CREATE_ELEMENT_VNODE,
12940 CREATE_COMMENT,
12941 CREATE_TEXT,
12942 CREATE_STATIC
12943 ]
12944 .filter(helper => ast.helpers.includes(helper))
12945 .map(aliasHelper)
12946 .join(', ');
12947 push(`const { ${staticHelpers} } = _Vue\n`);
12948 }
12949 }
12950 }
12951 genHoists(ast.hoists, context);
12952 newline();
12953 push(`return `);
12954 }
12955 function genAssets(assets, type, { helper, push, newline, isTS }) {
12956 const resolver = helper(type === 'component'
12957 ? RESOLVE_COMPONENT
12958 : RESOLVE_DIRECTIVE);
12959 for (let i = 0; i < assets.length; i++) {
12960 let id = assets[i];
12961 // potential component implicit self-reference inferred from SFC filename
12962 const maybeSelfReference = id.endsWith('__self');
12963 if (maybeSelfReference) {
12964 id = id.slice(0, -6);
12965 }
12966 push(`const ${toValidAssetId(id, type)} = ${resolver}(${JSON.stringify(id)}${maybeSelfReference ? `, true` : ``})${isTS ? `!` : ``}`);
12967 if (i < assets.length - 1) {
12968 newline();
12969 }
12970 }
12971 }
12972 function genHoists(hoists, context) {
12973 if (!hoists.length) {
12974 return;
12975 }
12976 context.pure = true;
12977 const { push, newline, helper, scopeId, mode } = context;
12978 newline();
12979 for (let i = 0; i < hoists.length; i++) {
12980 const exp = hoists[i];
12981 if (exp) {
12982 push(`const _hoisted_${i + 1} = ${``}`);
12983 genNode(exp, context);
12984 newline();
12985 }
12986 }
12987 context.pure = false;
12988 }
12989 function isText$1(n) {
12990 return (isString(n) ||
12991 n.type === 4 /* SIMPLE_EXPRESSION */ ||
12992 n.type === 2 /* TEXT */ ||
12993 n.type === 5 /* INTERPOLATION */ ||
12994 n.type === 8 /* COMPOUND_EXPRESSION */);
12995 }
12996 function genNodeListAsArray(nodes, context) {
12997 const multilines = nodes.length > 3 ||
12998 (nodes.some(n => isArray(n) || !isText$1(n)));
12999 context.push(`[`);
13000 multilines && context.indent();
13001 genNodeList(nodes, context, multilines);
13002 multilines && context.deindent();
13003 context.push(`]`);
13004 }
13005 function genNodeList(nodes, context, multilines = false, comma = true) {
13006 const { push, newline } = context;
13007 for (let i = 0; i < nodes.length; i++) {
13008 const node = nodes[i];
13009 if (isString(node)) {
13010 push(node);
13011 }
13012 else if (isArray(node)) {
13013 genNodeListAsArray(node, context);
13014 }
13015 else {
13016 genNode(node, context);
13017 }
13018 if (i < nodes.length - 1) {
13019 if (multilines) {
13020 comma && push(',');
13021 newline();
13022 }
13023 else {
13024 comma && push(', ');
13025 }
13026 }
13027 }
13028 }
13029 function genNode(node, context) {
13030 if (isString(node)) {
13031 context.push(node);
13032 return;
13033 }
13034 if (isSymbol(node)) {
13035 context.push(context.helper(node));
13036 return;
13037 }
13038 switch (node.type) {
13039 case 1 /* ELEMENT */:
13040 case 9 /* IF */:
13041 case 11 /* FOR */:
13042 assert(node.codegenNode != null, `Codegen node is missing for element/if/for node. ` +
13043 `Apply appropriate transforms first.`);
13044 genNode(node.codegenNode, context);
13045 break;
13046 case 2 /* TEXT */:
13047 genText(node, context);
13048 break;
13049 case 4 /* SIMPLE_EXPRESSION */:
13050 genExpression(node, context);
13051 break;
13052 case 5 /* INTERPOLATION */:
13053 genInterpolation(node, context);
13054 break;
13055 case 12 /* TEXT_CALL */:
13056 genNode(node.codegenNode, context);
13057 break;
13058 case 8 /* COMPOUND_EXPRESSION */:
13059 genCompoundExpression(node, context);
13060 break;
13061 case 3 /* COMMENT */:
13062 genComment(node, context);
13063 break;
13064 case 13 /* VNODE_CALL */:
13065 genVNodeCall(node, context);
13066 break;
13067 case 14 /* JS_CALL_EXPRESSION */:
13068 genCallExpression(node, context);
13069 break;
13070 case 15 /* JS_OBJECT_EXPRESSION */:
13071 genObjectExpression(node, context);
13072 break;
13073 case 17 /* JS_ARRAY_EXPRESSION */:
13074 genArrayExpression(node, context);
13075 break;
13076 case 18 /* JS_FUNCTION_EXPRESSION */:
13077 genFunctionExpression(node, context);
13078 break;
13079 case 19 /* JS_CONDITIONAL_EXPRESSION */:
13080 genConditionalExpression(node, context);
13081 break;
13082 case 20 /* JS_CACHE_EXPRESSION */:
13083 genCacheExpression(node, context);
13084 break;
13085 case 21 /* JS_BLOCK_STATEMENT */:
13086 genNodeList(node.body, context, true, false);
13087 break;
13088 // SSR only types
13089 case 22 /* JS_TEMPLATE_LITERAL */:
13090 break;
13091 case 23 /* JS_IF_STATEMENT */:
13092 break;
13093 case 24 /* JS_ASSIGNMENT_EXPRESSION */:
13094 break;
13095 case 25 /* JS_SEQUENCE_EXPRESSION */:
13096 break;
13097 case 26 /* JS_RETURN_STATEMENT */:
13098 break;
13099 /* istanbul ignore next */
13100 case 10 /* IF_BRANCH */:
13101 // noop
13102 break;
13103 default:
13104 {
13105 assert(false, `unhandled codegen node type: ${node.type}`);
13106 // make sure we exhaust all possible types
13107 const exhaustiveCheck = node;
13108 return exhaustiveCheck;
13109 }
13110 }
13111 }
13112 function genText(node, context) {
13113 context.push(JSON.stringify(node.content), node);
13114 }
13115 function genExpression(node, context) {
13116 const { content, isStatic } = node;
13117 context.push(isStatic ? JSON.stringify(content) : content, node);
13118 }
13119 function genInterpolation(node, context) {
13120 const { push, helper, pure } = context;
13121 if (pure)
13122 push(PURE_ANNOTATION);
13123 push(`${helper(TO_DISPLAY_STRING)}(`);
13124 genNode(node.content, context);
13125 push(`)`);
13126 }
13127 function genCompoundExpression(node, context) {
13128 for (let i = 0; i < node.children.length; i++) {
13129 const child = node.children[i];
13130 if (isString(child)) {
13131 context.push(child);
13132 }
13133 else {
13134 genNode(child, context);
13135 }
13136 }
13137 }
13138 function genExpressionAsPropertyKey(node, context) {
13139 const { push } = context;
13140 if (node.type === 8 /* COMPOUND_EXPRESSION */) {
13141 push(`[`);
13142 genCompoundExpression(node, context);
13143 push(`]`);
13144 }
13145 else if (node.isStatic) {
13146 // only quote keys if necessary
13147 const text = isSimpleIdentifier(node.content)
13148 ? node.content
13149 : JSON.stringify(node.content);
13150 push(text, node);
13151 }
13152 else {
13153 push(`[${node.content}]`, node);
13154 }
13155 }
13156 function genComment(node, context) {
13157 const { push, helper, pure } = context;
13158 if (pure) {
13159 push(PURE_ANNOTATION);
13160 }
13161 push(`${helper(CREATE_COMMENT)}(${JSON.stringify(node.content)})`, node);
13162 }
13163 function genVNodeCall(node, context) {
13164 const { push, helper, pure } = context;
13165 const { tag, props, children, patchFlag, dynamicProps, directives, isBlock, disableTracking, isComponent } = node;
13166 if (directives) {
13167 push(helper(WITH_DIRECTIVES) + `(`);
13168 }
13169 if (isBlock) {
13170 push(`(${helper(OPEN_BLOCK)}(${disableTracking ? `true` : ``}), `);
13171 }
13172 if (pure) {
13173 push(PURE_ANNOTATION);
13174 }
13175 const callHelper = isBlock
13176 ? getVNodeBlockHelper(context.inSSR, isComponent)
13177 : getVNodeHelper(context.inSSR, isComponent);
13178 push(helper(callHelper) + `(`, node);
13179 genNodeList(genNullableArgs([tag, props, children, patchFlag, dynamicProps]), context);
13180 push(`)`);
13181 if (isBlock) {
13182 push(`)`);
13183 }
13184 if (directives) {
13185 push(`, `);
13186 genNode(directives, context);
13187 push(`)`);
13188 }
13189 }
13190 function genNullableArgs(args) {
13191 let i = args.length;
13192 while (i--) {
13193 if (args[i] != null)
13194 break;
13195 }
13196 return args.slice(0, i + 1).map(arg => arg || `null`);
13197 }
13198 // JavaScript
13199 function genCallExpression(node, context) {
13200 const { push, helper, pure } = context;
13201 const callee = isString(node.callee) ? node.callee : helper(node.callee);
13202 if (pure) {
13203 push(PURE_ANNOTATION);
13204 }
13205 push(callee + `(`, node);
13206 genNodeList(node.arguments, context);
13207 push(`)`);
13208 }
13209 function genObjectExpression(node, context) {
13210 const { push, indent, deindent, newline } = context;
13211 const { properties } = node;
13212 if (!properties.length) {
13213 push(`{}`, node);
13214 return;
13215 }
13216 const multilines = properties.length > 1 ||
13217 (properties.some(p => p.value.type !== 4 /* SIMPLE_EXPRESSION */));
13218 push(multilines ? `{` : `{ `);
13219 multilines && indent();
13220 for (let i = 0; i < properties.length; i++) {
13221 const { key, value } = properties[i];
13222 // key
13223 genExpressionAsPropertyKey(key, context);
13224 push(`: `);
13225 // value
13226 genNode(value, context);
13227 if (i < properties.length - 1) {
13228 // will only reach this if it's multilines
13229 push(`,`);
13230 newline();
13231 }
13232 }
13233 multilines && deindent();
13234 push(multilines ? `}` : ` }`);
13235 }
13236 function genArrayExpression(node, context) {
13237 genNodeListAsArray(node.elements, context);
13238 }
13239 function genFunctionExpression(node, context) {
13240 const { push, indent, deindent } = context;
13241 const { params, returns, body, newline, isSlot } = node;
13242 if (isSlot) {
13243 // wrap slot functions with owner context
13244 push(`_${helperNameMap[WITH_CTX]}(`);
13245 }
13246 push(`(`, node);
13247 if (isArray(params)) {
13248 genNodeList(params, context);
13249 }
13250 else if (params) {
13251 genNode(params, context);
13252 }
13253 push(`) => `);
13254 if (newline || body) {
13255 push(`{`);
13256 indent();
13257 }
13258 if (returns) {
13259 if (newline) {
13260 push(`return `);
13261 }
13262 if (isArray(returns)) {
13263 genNodeListAsArray(returns, context);
13264 }
13265 else {
13266 genNode(returns, context);
13267 }
13268 }
13269 else if (body) {
13270 genNode(body, context);
13271 }
13272 if (newline || body) {
13273 deindent();
13274 push(`}`);
13275 }
13276 if (isSlot) {
13277 push(`)`);
13278 }
13279 }
13280 function genConditionalExpression(node, context) {
13281 const { test, consequent, alternate, newline: needNewline } = node;
13282 const { push, indent, deindent, newline } = context;
13283 if (test.type === 4 /* SIMPLE_EXPRESSION */) {
13284 const needsParens = !isSimpleIdentifier(test.content);
13285 needsParens && push(`(`);
13286 genExpression(test, context);
13287 needsParens && push(`)`);
13288 }
13289 else {
13290 push(`(`);
13291 genNode(test, context);
13292 push(`)`);
13293 }
13294 needNewline && indent();
13295 context.indentLevel++;
13296 needNewline || push(` `);
13297 push(`? `);
13298 genNode(consequent, context);
13299 context.indentLevel--;
13300 needNewline && newline();
13301 needNewline || push(` `);
13302 push(`: `);
13303 const isNested = alternate.type === 19 /* JS_CONDITIONAL_EXPRESSION */;
13304 if (!isNested) {
13305 context.indentLevel++;
13306 }
13307 genNode(alternate, context);
13308 if (!isNested) {
13309 context.indentLevel--;
13310 }
13311 needNewline && deindent(true /* without newline */);
13312 }
13313 function genCacheExpression(node, context) {
13314 const { push, helper, indent, deindent, newline } = context;
13315 push(`_cache[${node.index}] || (`);
13316 if (node.isVNode) {
13317 indent();
13318 push(`${helper(SET_BLOCK_TRACKING)}(-1),`);
13319 newline();
13320 }
13321 push(`_cache[${node.index}] = `);
13322 genNode(node.value, context);
13323 if (node.isVNode) {
13324 push(`,`);
13325 newline();
13326 push(`${helper(SET_BLOCK_TRACKING)}(1),`);
13327 newline();
13328 push(`_cache[${node.index}]`);
13329 deindent();
13330 }
13331 push(`)`);
13332 }
13333
13334 // these keywords should not appear inside expressions, but operators like
13335 // typeof, instanceof and in are allowed
13336 const prohibitedKeywordRE = new RegExp('\\b' +
13337 ('do,if,for,let,new,try,var,case,else,with,await,break,catch,class,const,' +
13338 'super,throw,while,yield,delete,export,import,return,switch,default,' +
13339 'extends,finally,continue,debugger,function,arguments,typeof,void')
13340 .split(',')
13341 .join('\\b|\\b') +
13342 '\\b');
13343 // strip strings in expressions
13344 const stripStringRE = /'(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*"|`(?:[^`\\]|\\.)*\$\{|\}(?:[^`\\]|\\.)*`|`(?:[^`\\]|\\.)*`/g;
13345 /**
13346 * Validate a non-prefixed expression.
13347 * This is only called when using the in-browser runtime compiler since it
13348 * doesn't prefix expressions.
13349 */
13350 function validateBrowserExpression(node, context, asParams = false, asRawStatements = false) {
13351 const exp = node.content;
13352 // empty expressions are validated per-directive since some directives
13353 // do allow empty expressions.
13354 if (!exp.trim()) {
13355 return;
13356 }
13357 try {
13358 new Function(asRawStatements
13359 ? ` ${exp} `
13360 : `return ${asParams ? `(${exp}) => {}` : `(${exp})`}`);
13361 }
13362 catch (e) {
13363 let message = e.message;
13364 const keywordMatch = exp
13365 .replace(stripStringRE, '')
13366 .match(prohibitedKeywordRE);
13367 if (keywordMatch) {
13368 message = `avoid using JavaScript keyword as property name: "${keywordMatch[0]}"`;
13369 }
13370 context.onError(createCompilerError(44 /* X_INVALID_EXPRESSION */, node.loc, undefined, message));
13371 }
13372 }
13373
13374 const transformExpression = (node, context) => {
13375 if (node.type === 5 /* INTERPOLATION */) {
13376 node.content = processExpression(node.content, context);
13377 }
13378 else if (node.type === 1 /* ELEMENT */) {
13379 // handle directives on element
13380 for (let i = 0; i < node.props.length; i++) {
13381 const dir = node.props[i];
13382 // do not process for v-on & v-for since they are special handled
13383 if (dir.type === 7 /* DIRECTIVE */ && dir.name !== 'for') {
13384 const exp = dir.exp;
13385 const arg = dir.arg;
13386 // do not process exp if this is v-on:arg - we need special handling
13387 // for wrapping inline statements.
13388 if (exp &&
13389 exp.type === 4 /* SIMPLE_EXPRESSION */ &&
13390 !(dir.name === 'on' && arg)) {
13391 dir.exp = processExpression(exp, context,
13392 // slot args must be processed as function params
13393 dir.name === 'slot');
13394 }
13395 if (arg && arg.type === 4 /* SIMPLE_EXPRESSION */ && !arg.isStatic) {
13396 dir.arg = processExpression(arg, context);
13397 }
13398 }
13399 }
13400 }
13401 };
13402 // Important: since this function uses Node.js only dependencies, it should
13403 // always be used with a leading !true check so that it can be
13404 // tree-shaken from the browser build.
13405 function processExpression(node, context,
13406 // some expressions like v-slot props & v-for aliases should be parsed as
13407 // function params
13408 asParams = false,
13409 // v-on handler values may contain multiple statements
13410 asRawStatements = false, localVars = Object.create(context.identifiers)) {
13411 {
13412 {
13413 // simple in-browser validation (same logic in 2.x)
13414 validateBrowserExpression(node, context, asParams, asRawStatements);
13415 }
13416 return node;
13417 }
13418 }
13419
13420 const transformIf = createStructuralDirectiveTransform(/^(if|else|else-if)$/, (node, dir, context) => {
13421 return processIf(node, dir, context, (ifNode, branch, isRoot) => {
13422 // #1587: We need to dynamically increment the key based on the current
13423 // node's sibling nodes, since chained v-if/else branches are
13424 // rendered at the same depth
13425 const siblings = context.parent.children;
13426 let i = siblings.indexOf(ifNode);
13427 let key = 0;
13428 while (i-- >= 0) {
13429 const sibling = siblings[i];
13430 if (sibling && sibling.type === 9 /* IF */) {
13431 key += sibling.branches.length;
13432 }
13433 }
13434 // Exit callback. Complete the codegenNode when all children have been
13435 // transformed.
13436 return () => {
13437 if (isRoot) {
13438 ifNode.codegenNode = createCodegenNodeForBranch(branch, key, context);
13439 }
13440 else {
13441 // attach this branch's codegen node to the v-if root.
13442 const parentCondition = getParentCondition(ifNode.codegenNode);
13443 parentCondition.alternate = createCodegenNodeForBranch(branch, key + ifNode.branches.length - 1, context);
13444 }
13445 };
13446 });
13447 });
13448 // target-agnostic transform used for both Client and SSR
13449 function processIf(node, dir, context, processCodegen) {
13450 if (dir.name !== 'else' &&
13451 (!dir.exp || !dir.exp.content.trim())) {
13452 const loc = dir.exp ? dir.exp.loc : node.loc;
13453 context.onError(createCompilerError(28 /* X_V_IF_NO_EXPRESSION */, dir.loc));
13454 dir.exp = createSimpleExpression(`true`, false, loc);
13455 }
13456 if (dir.exp) {
13457 validateBrowserExpression(dir.exp, context);
13458 }
13459 if (dir.name === 'if') {
13460 const branch = createIfBranch(node, dir);
13461 const ifNode = {
13462 type: 9 /* IF */,
13463 loc: node.loc,
13464 branches: [branch]
13465 };
13466 context.replaceNode(ifNode);
13467 if (processCodegen) {
13468 return processCodegen(ifNode, branch, true);
13469 }
13470 }
13471 else {
13472 // locate the adjacent v-if
13473 const siblings = context.parent.children;
13474 const comments = [];
13475 let i = siblings.indexOf(node);
13476 while (i-- >= -1) {
13477 const sibling = siblings[i];
13478 if (sibling && sibling.type === 3 /* COMMENT */) {
13479 context.removeNode(sibling);
13480 comments.unshift(sibling);
13481 continue;
13482 }
13483 if (sibling &&
13484 sibling.type === 2 /* TEXT */ &&
13485 !sibling.content.trim().length) {
13486 context.removeNode(sibling);
13487 continue;
13488 }
13489 if (sibling && sibling.type === 9 /* IF */) {
13490 // Check if v-else was followed by v-else-if
13491 if (dir.name === 'else-if' &&
13492 sibling.branches[sibling.branches.length - 1].condition === undefined) {
13493 context.onError(createCompilerError(30 /* X_V_ELSE_NO_ADJACENT_IF */, node.loc));
13494 }
13495 // move the node to the if node's branches
13496 context.removeNode();
13497 const branch = createIfBranch(node, dir);
13498 if (comments.length &&
13499 // #3619 ignore comments if the v-if is direct child of <transition>
13500 !(context.parent &&
13501 context.parent.type === 1 /* ELEMENT */ &&
13502 isBuiltInType(context.parent.tag, 'transition'))) {
13503 branch.children = [...comments, ...branch.children];
13504 }
13505 // check if user is forcing same key on different branches
13506 {
13507 const key = branch.userKey;
13508 if (key) {
13509 sibling.branches.forEach(({ userKey }) => {
13510 if (isSameKey(userKey, key)) {
13511 context.onError(createCompilerError(29 /* X_V_IF_SAME_KEY */, branch.userKey.loc));
13512 }
13513 });
13514 }
13515 }
13516 sibling.branches.push(branch);
13517 const onExit = processCodegen && processCodegen(sibling, branch, false);
13518 // since the branch was removed, it will not be traversed.
13519 // make sure to traverse here.
13520 traverseNode(branch, context);
13521 // call on exit
13522 if (onExit)
13523 onExit();
13524 // make sure to reset currentNode after traversal to indicate this
13525 // node has been removed.
13526 context.currentNode = null;
13527 }
13528 else {
13529 context.onError(createCompilerError(30 /* X_V_ELSE_NO_ADJACENT_IF */, node.loc));
13530 }
13531 break;
13532 }
13533 }
13534 }
13535 function createIfBranch(node, dir) {
13536 return {
13537 type: 10 /* IF_BRANCH */,
13538 loc: node.loc,
13539 condition: dir.name === 'else' ? undefined : dir.exp,
13540 children: node.tagType === 3 /* TEMPLATE */ && !findDir(node, 'for')
13541 ? node.children
13542 : [node],
13543 userKey: findProp(node, `key`)
13544 };
13545 }
13546 function createCodegenNodeForBranch(branch, keyIndex, context) {
13547 if (branch.condition) {
13548 return createConditionalExpression(branch.condition, createChildrenCodegenNode(branch, keyIndex, context),
13549 // make sure to pass in asBlock: true so that the comment node call
13550 // closes the current block.
13551 createCallExpression(context.helper(CREATE_COMMENT), [
13552 '"v-if"' ,
13553 'true'
13554 ]));
13555 }
13556 else {
13557 return createChildrenCodegenNode(branch, keyIndex, context);
13558 }
13559 }
13560 function createChildrenCodegenNode(branch, keyIndex, context) {
13561 const { helper } = context;
13562 const keyProperty = createObjectProperty(`key`, createSimpleExpression(`${keyIndex}`, false, locStub, 2 /* CAN_HOIST */));
13563 const { children } = branch;
13564 const firstChild = children[0];
13565 const needFragmentWrapper = children.length !== 1 || firstChild.type !== 1 /* ELEMENT */;
13566 if (needFragmentWrapper) {
13567 if (children.length === 1 && firstChild.type === 11 /* FOR */) {
13568 // optimize away nested fragments when child is a ForNode
13569 const vnodeCall = firstChild.codegenNode;
13570 injectProp(vnodeCall, keyProperty, context);
13571 return vnodeCall;
13572 }
13573 else {
13574 let patchFlag = 64 /* STABLE_FRAGMENT */;
13575 let patchFlagText = PatchFlagNames[64 /* STABLE_FRAGMENT */];
13576 // check if the fragment actually contains a single valid child with
13577 // the rest being comments
13578 if (children.filter(c => c.type !== 3 /* COMMENT */).length === 1) {
13579 patchFlag |= 2048 /* DEV_ROOT_FRAGMENT */;
13580 patchFlagText += `, ${PatchFlagNames[2048 /* DEV_ROOT_FRAGMENT */]}`;
13581 }
13582 return createVNodeCall(context, helper(FRAGMENT), createObjectExpression([keyProperty]), children, patchFlag + (` /* ${patchFlagText} */` ), undefined, undefined, true, false, false /* isComponent */, branch.loc);
13583 }
13584 }
13585 else {
13586 const ret = firstChild.codegenNode;
13587 const vnodeCall = getMemoedVNodeCall(ret);
13588 // Change createVNode to createBlock.
13589 if (vnodeCall.type === 13 /* VNODE_CALL */) {
13590 makeBlock(vnodeCall, context);
13591 }
13592 // inject branch key
13593 injectProp(vnodeCall, keyProperty, context);
13594 return ret;
13595 }
13596 }
13597 function isSameKey(a, b) {
13598 if (!a || a.type !== b.type) {
13599 return false;
13600 }
13601 if (a.type === 6 /* ATTRIBUTE */) {
13602 if (a.value.content !== b.value.content) {
13603 return false;
13604 }
13605 }
13606 else {
13607 // directive
13608 const exp = a.exp;
13609 const branchExp = b.exp;
13610 if (exp.type !== branchExp.type) {
13611 return false;
13612 }
13613 if (exp.type !== 4 /* SIMPLE_EXPRESSION */ ||
13614 exp.isStatic !== branchExp.isStatic ||
13615 exp.content !== branchExp.content) {
13616 return false;
13617 }
13618 }
13619 return true;
13620 }
13621 function getParentCondition(node) {
13622 while (true) {
13623 if (node.type === 19 /* JS_CONDITIONAL_EXPRESSION */) {
13624 if (node.alternate.type === 19 /* JS_CONDITIONAL_EXPRESSION */) {
13625 node = node.alternate;
13626 }
13627 else {
13628 return node;
13629 }
13630 }
13631 else if (node.type === 20 /* JS_CACHE_EXPRESSION */) {
13632 node = node.value;
13633 }
13634 }
13635 }
13636
13637 const transformFor = createStructuralDirectiveTransform('for', (node, dir, context) => {
13638 const { helper, removeHelper } = context;
13639 return processFor(node, dir, context, forNode => {
13640 // create the loop render function expression now, and add the
13641 // iterator on exit after all children have been traversed
13642 const renderExp = createCallExpression(helper(RENDER_LIST), [
13643 forNode.source
13644 ]);
13645 const isTemplate = isTemplateNode(node);
13646 const memo = findDir(node, 'memo');
13647 const keyProp = findProp(node, `key`);
13648 const keyExp = keyProp &&
13649 (keyProp.type === 6 /* ATTRIBUTE */
13650 ? createSimpleExpression(keyProp.value.content, true)
13651 : keyProp.exp);
13652 const keyProperty = keyProp ? createObjectProperty(`key`, keyExp) : null;
13653 const isStableFragment = forNode.source.type === 4 /* SIMPLE_EXPRESSION */ &&
13654 forNode.source.constType > 0 /* NOT_CONSTANT */;
13655 const fragmentFlag = isStableFragment
13656 ? 64 /* STABLE_FRAGMENT */
13657 : keyProp
13658 ? 128 /* KEYED_FRAGMENT */
13659 : 256 /* UNKEYED_FRAGMENT */;
13660 forNode.codegenNode = createVNodeCall(context, helper(FRAGMENT), undefined, renderExp, fragmentFlag +
13661 (` /* ${PatchFlagNames[fragmentFlag]} */` ), undefined, undefined, true /* isBlock */, !isStableFragment /* disableTracking */, false /* isComponent */, node.loc);
13662 return () => {
13663 // finish the codegen now that all children have been traversed
13664 let childBlock;
13665 const { children } = forNode;
13666 // check <template v-for> key placement
13667 if (isTemplate) {
13668 node.children.some(c => {
13669 if (c.type === 1 /* ELEMENT */) {
13670 const key = findProp(c, 'key');
13671 if (key) {
13672 context.onError(createCompilerError(33 /* X_V_FOR_TEMPLATE_KEY_PLACEMENT */, key.loc));
13673 return true;
13674 }
13675 }
13676 });
13677 }
13678 const needFragmentWrapper = children.length !== 1 || children[0].type !== 1 /* ELEMENT */;
13679 const slotOutlet = isSlotOutlet(node)
13680 ? node
13681 : isTemplate &&
13682 node.children.length === 1 &&
13683 isSlotOutlet(node.children[0])
13684 ? node.children[0] // api-extractor somehow fails to infer this
13685 : null;
13686 if (slotOutlet) {
13687 // <slot v-for="..."> or <template v-for="..."><slot/></template>
13688 childBlock = slotOutlet.codegenNode;
13689 if (isTemplate && keyProperty) {
13690 // <template v-for="..." :key="..."><slot/></template>
13691 // we need to inject the key to the renderSlot() call.
13692 // the props for renderSlot is passed as the 3rd argument.
13693 injectProp(childBlock, keyProperty, context);
13694 }
13695 }
13696 else if (needFragmentWrapper) {
13697 // <template v-for="..."> with text or multi-elements
13698 // should generate a fragment block for each loop
13699 childBlock = createVNodeCall(context, helper(FRAGMENT), keyProperty ? createObjectExpression([keyProperty]) : undefined, node.children, 64 /* STABLE_FRAGMENT */ +
13700 (` /* ${PatchFlagNames[64 /* STABLE_FRAGMENT */]} */`
13701 ), undefined, undefined, true, undefined, false /* isComponent */);
13702 }
13703 else {
13704 // Normal element v-for. Directly use the child's codegenNode
13705 // but mark it as a block.
13706 childBlock = children[0]
13707 .codegenNode;
13708 if (isTemplate && keyProperty) {
13709 injectProp(childBlock, keyProperty, context);
13710 }
13711 if (childBlock.isBlock !== !isStableFragment) {
13712 if (childBlock.isBlock) {
13713 // switch from block to vnode
13714 removeHelper(OPEN_BLOCK);
13715 removeHelper(getVNodeBlockHelper(context.inSSR, childBlock.isComponent));
13716 }
13717 else {
13718 // switch from vnode to block
13719 removeHelper(getVNodeHelper(context.inSSR, childBlock.isComponent));
13720 }
13721 }
13722 childBlock.isBlock = !isStableFragment;
13723 if (childBlock.isBlock) {
13724 helper(OPEN_BLOCK);
13725 helper(getVNodeBlockHelper(context.inSSR, childBlock.isComponent));
13726 }
13727 else {
13728 helper(getVNodeHelper(context.inSSR, childBlock.isComponent));
13729 }
13730 }
13731 if (memo) {
13732 const loop = createFunctionExpression(createForLoopParams(forNode.parseResult, [
13733 createSimpleExpression(`_cached`)
13734 ]));
13735 loop.body = createBlockStatement([
13736 createCompoundExpression([`const _memo = (`, memo.exp, `)`]),
13737 createCompoundExpression([
13738 `if (_cached`,
13739 ...(keyExp ? [` && _cached.key === `, keyExp] : []),
13740 ` && ${context.helperString(IS_MEMO_SAME)}(_cached, _memo)) return _cached`
13741 ]),
13742 createCompoundExpression([`const _item = `, childBlock]),
13743 createSimpleExpression(`_item.memo = _memo`),
13744 createSimpleExpression(`return _item`)
13745 ]);
13746 renderExp.arguments.push(loop, createSimpleExpression(`_cache`), createSimpleExpression(String(context.cached++)));
13747 }
13748 else {
13749 renderExp.arguments.push(createFunctionExpression(createForLoopParams(forNode.parseResult), childBlock, true /* force newline */));
13750 }
13751 };
13752 });
13753 });
13754 // target-agnostic transform used for both Client and SSR
13755 function processFor(node, dir, context, processCodegen) {
13756 if (!dir.exp) {
13757 context.onError(createCompilerError(31 /* X_V_FOR_NO_EXPRESSION */, dir.loc));
13758 return;
13759 }
13760 const parseResult = parseForExpression(
13761 // can only be simple expression because vFor transform is applied
13762 // before expression transform.
13763 dir.exp, context);
13764 if (!parseResult) {
13765 context.onError(createCompilerError(32 /* X_V_FOR_MALFORMED_EXPRESSION */, dir.loc));
13766 return;
13767 }
13768 const { addIdentifiers, removeIdentifiers, scopes } = context;
13769 const { source, value, key, index } = parseResult;
13770 const forNode = {
13771 type: 11 /* FOR */,
13772 loc: dir.loc,
13773 source,
13774 valueAlias: value,
13775 keyAlias: key,
13776 objectIndexAlias: index,
13777 parseResult,
13778 children: isTemplateNode(node) ? node.children : [node]
13779 };
13780 context.replaceNode(forNode);
13781 // bookkeeping
13782 scopes.vFor++;
13783 const onExit = processCodegen && processCodegen(forNode);
13784 return () => {
13785 scopes.vFor--;
13786 if (onExit)
13787 onExit();
13788 };
13789 }
13790 const forAliasRE = /([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/;
13791 // This regex doesn't cover the case if key or index aliases have destructuring,
13792 // but those do not make sense in the first place, so this works in practice.
13793 const forIteratorRE = /,([^,\}\]]*)(?:,([^,\}\]]*))?$/;
13794 const stripParensRE = /^\(|\)$/g;
13795 function parseForExpression(input, context) {
13796 const loc = input.loc;
13797 const exp = input.content;
13798 const inMatch = exp.match(forAliasRE);
13799 if (!inMatch)
13800 return;
13801 const [, LHS, RHS] = inMatch;
13802 const result = {
13803 source: createAliasExpression(loc, RHS.trim(), exp.indexOf(RHS, LHS.length)),
13804 value: undefined,
13805 key: undefined,
13806 index: undefined
13807 };
13808 {
13809 validateBrowserExpression(result.source, context);
13810 }
13811 let valueContent = LHS.trim().replace(stripParensRE, '').trim();
13812 const trimmedOffset = LHS.indexOf(valueContent);
13813 const iteratorMatch = valueContent.match(forIteratorRE);
13814 if (iteratorMatch) {
13815 valueContent = valueContent.replace(forIteratorRE, '').trim();
13816 const keyContent = iteratorMatch[1].trim();
13817 let keyOffset;
13818 if (keyContent) {
13819 keyOffset = exp.indexOf(keyContent, trimmedOffset + valueContent.length);
13820 result.key = createAliasExpression(loc, keyContent, keyOffset);
13821 {
13822 validateBrowserExpression(result.key, context, true);
13823 }
13824 }
13825 if (iteratorMatch[2]) {
13826 const indexContent = iteratorMatch[2].trim();
13827 if (indexContent) {
13828 result.index = createAliasExpression(loc, indexContent, exp.indexOf(indexContent, result.key
13829 ? keyOffset + keyContent.length
13830 : trimmedOffset + valueContent.length));
13831 {
13832 validateBrowserExpression(result.index, context, true);
13833 }
13834 }
13835 }
13836 }
13837 if (valueContent) {
13838 result.value = createAliasExpression(loc, valueContent, trimmedOffset);
13839 {
13840 validateBrowserExpression(result.value, context, true);
13841 }
13842 }
13843 return result;
13844 }
13845 function createAliasExpression(range, content, offset) {
13846 return createSimpleExpression(content, false, getInnerRange(range, offset, content.length));
13847 }
13848 function createForLoopParams({ value, key, index }, memoArgs = []) {
13849 return createParamsList([value, key, index, ...memoArgs]);
13850 }
13851 function createParamsList(args) {
13852 let i = args.length;
13853 while (i--) {
13854 if (args[i])
13855 break;
13856 }
13857 return args
13858 .slice(0, i + 1)
13859 .map((arg, i) => arg || createSimpleExpression(`_`.repeat(i + 1), false));
13860 }
13861
13862 const defaultFallback = createSimpleExpression(`undefined`, false);
13863 // A NodeTransform that:
13864 // 1. Tracks scope identifiers for scoped slots so that they don't get prefixed
13865 // by transformExpression. This is only applied in non-browser builds with
13866 // { prefixIdentifiers: true }.
13867 // 2. Track v-slot depths so that we know a slot is inside another slot.
13868 // Note the exit callback is executed before buildSlots() on the same node,
13869 // so only nested slots see positive numbers.
13870 const trackSlotScopes = (node, context) => {
13871 if (node.type === 1 /* ELEMENT */ &&
13872 (node.tagType === 1 /* COMPONENT */ ||
13873 node.tagType === 3 /* TEMPLATE */)) {
13874 // We are only checking non-empty v-slot here
13875 // since we only care about slots that introduce scope variables.
13876 const vSlot = findDir(node, 'slot');
13877 if (vSlot) {
13878 vSlot.exp;
13879 context.scopes.vSlot++;
13880 return () => {
13881 context.scopes.vSlot--;
13882 };
13883 }
13884 }
13885 };
13886 const buildClientSlotFn = (props, children, loc) => createFunctionExpression(props, children, false /* newline */, true /* isSlot */, children.length ? children[0].loc : loc);
13887 // Instead of being a DirectiveTransform, v-slot processing is called during
13888 // transformElement to build the slots object for a component.
13889 function buildSlots(node, context, buildSlotFn = buildClientSlotFn) {
13890 context.helper(WITH_CTX);
13891 const { children, loc } = node;
13892 const slotsProperties = [];
13893 const dynamicSlots = [];
13894 // If the slot is inside a v-for or another v-slot, force it to be dynamic
13895 // since it likely uses a scope variable.
13896 let hasDynamicSlots = context.scopes.vSlot > 0 || context.scopes.vFor > 0;
13897 // 1. Check for slot with slotProps on component itself.
13898 // <Comp v-slot="{ prop }"/>
13899 const onComponentSlot = findDir(node, 'slot', true);
13900 if (onComponentSlot) {
13901 const { arg, exp } = onComponentSlot;
13902 if (arg && !isStaticExp(arg)) {
13903 hasDynamicSlots = true;
13904 }
13905 slotsProperties.push(createObjectProperty(arg || createSimpleExpression('default', true), buildSlotFn(exp, children, loc)));
13906 }
13907 // 2. Iterate through children and check for template slots
13908 // <template v-slot:foo="{ prop }">
13909 let hasTemplateSlots = false;
13910 let hasNamedDefaultSlot = false;
13911 const implicitDefaultChildren = [];
13912 const seenSlotNames = new Set();
13913 for (let i = 0; i < children.length; i++) {
13914 const slotElement = children[i];
13915 let slotDir;
13916 if (!isTemplateNode(slotElement) ||
13917 !(slotDir = findDir(slotElement, 'slot', true))) {
13918 // not a <template v-slot>, skip.
13919 if (slotElement.type !== 3 /* COMMENT */) {
13920 implicitDefaultChildren.push(slotElement);
13921 }
13922 continue;
13923 }
13924 if (onComponentSlot) {
13925 // already has on-component slot - this is incorrect usage.
13926 context.onError(createCompilerError(37 /* X_V_SLOT_MIXED_SLOT_USAGE */, slotDir.loc));
13927 break;
13928 }
13929 hasTemplateSlots = true;
13930 const { children: slotChildren, loc: slotLoc } = slotElement;
13931 const { arg: slotName = createSimpleExpression(`default`, true), exp: slotProps, loc: dirLoc } = slotDir;
13932 // check if name is dynamic.
13933 let staticSlotName;
13934 if (isStaticExp(slotName)) {
13935 staticSlotName = slotName ? slotName.content : `default`;
13936 }
13937 else {
13938 hasDynamicSlots = true;
13939 }
13940 const slotFunction = buildSlotFn(slotProps, slotChildren, slotLoc);
13941 // check if this slot is conditional (v-if/v-for)
13942 let vIf;
13943 let vElse;
13944 let vFor;
13945 if ((vIf = findDir(slotElement, 'if'))) {
13946 hasDynamicSlots = true;
13947 dynamicSlots.push(createConditionalExpression(vIf.exp, buildDynamicSlot(slotName, slotFunction), defaultFallback));
13948 }
13949 else if ((vElse = findDir(slotElement, /^else(-if)?$/, true /* allowEmpty */))) {
13950 // find adjacent v-if
13951 let j = i;
13952 let prev;
13953 while (j--) {
13954 prev = children[j];
13955 if (prev.type !== 3 /* COMMENT */) {
13956 break;
13957 }
13958 }
13959 if (prev && isTemplateNode(prev) && findDir(prev, 'if')) {
13960 // remove node
13961 children.splice(i, 1);
13962 i--;
13963 // attach this slot to previous conditional
13964 let conditional = dynamicSlots[dynamicSlots.length - 1];
13965 while (conditional.alternate.type === 19 /* JS_CONDITIONAL_EXPRESSION */) {
13966 conditional = conditional.alternate;
13967 }
13968 conditional.alternate = vElse.exp
13969 ? createConditionalExpression(vElse.exp, buildDynamicSlot(slotName, slotFunction), defaultFallback)
13970 : buildDynamicSlot(slotName, slotFunction);
13971 }
13972 else {
13973 context.onError(createCompilerError(30 /* X_V_ELSE_NO_ADJACENT_IF */, vElse.loc));
13974 }
13975 }
13976 else if ((vFor = findDir(slotElement, 'for'))) {
13977 hasDynamicSlots = true;
13978 const parseResult = vFor.parseResult ||
13979 parseForExpression(vFor.exp, context);
13980 if (parseResult) {
13981 // Render the dynamic slots as an array and add it to the createSlot()
13982 // args. The runtime knows how to handle it appropriately.
13983 dynamicSlots.push(createCallExpression(context.helper(RENDER_LIST), [
13984 parseResult.source,
13985 createFunctionExpression(createForLoopParams(parseResult), buildDynamicSlot(slotName, slotFunction), true /* force newline */)
13986 ]));
13987 }
13988 else {
13989 context.onError(createCompilerError(32 /* X_V_FOR_MALFORMED_EXPRESSION */, vFor.loc));
13990 }
13991 }
13992 else {
13993 // check duplicate static names
13994 if (staticSlotName) {
13995 if (seenSlotNames.has(staticSlotName)) {
13996 context.onError(createCompilerError(38 /* X_V_SLOT_DUPLICATE_SLOT_NAMES */, dirLoc));
13997 continue;
13998 }
13999 seenSlotNames.add(staticSlotName);
14000 if (staticSlotName === 'default') {
14001 hasNamedDefaultSlot = true;
14002 }
14003 }
14004 slotsProperties.push(createObjectProperty(slotName, slotFunction));
14005 }
14006 }
14007 if (!onComponentSlot) {
14008 const buildDefaultSlotProperty = (props, children) => {
14009 const fn = buildSlotFn(props, children, loc);
14010 return createObjectProperty(`default`, fn);
14011 };
14012 if (!hasTemplateSlots) {
14013 // implicit default slot (on component)
14014 slotsProperties.push(buildDefaultSlotProperty(undefined, children));
14015 }
14016 else if (implicitDefaultChildren.length &&
14017 // #3766
14018 // with whitespace: 'preserve', whitespaces between slots will end up in
14019 // implicitDefaultChildren. Ignore if all implicit children are whitespaces.
14020 implicitDefaultChildren.some(node => isNonWhitespaceContent(node))) {
14021 // implicit default slot (mixed with named slots)
14022 if (hasNamedDefaultSlot) {
14023 context.onError(createCompilerError(39 /* X_V_SLOT_EXTRANEOUS_DEFAULT_SLOT_CHILDREN */, implicitDefaultChildren[0].loc));
14024 }
14025 else {
14026 slotsProperties.push(buildDefaultSlotProperty(undefined, implicitDefaultChildren));
14027 }
14028 }
14029 }
14030 const slotFlag = hasDynamicSlots
14031 ? 2 /* DYNAMIC */
14032 : hasForwardedSlots(node.children)
14033 ? 3 /* FORWARDED */
14034 : 1 /* STABLE */;
14035 let slots = createObjectExpression(slotsProperties.concat(createObjectProperty(`_`,
14036 // 2 = compiled but dynamic = can skip normalization, but must run diff
14037 // 1 = compiled and static = can skip normalization AND diff as optimized
14038 createSimpleExpression(slotFlag + (` /* ${slotFlagsText[slotFlag]} */` ), false))), loc);
14039 if (dynamicSlots.length) {
14040 slots = createCallExpression(context.helper(CREATE_SLOTS), [
14041 slots,
14042 createArrayExpression(dynamicSlots)
14043 ]);
14044 }
14045 return {
14046 slots,
14047 hasDynamicSlots
14048 };
14049 }
14050 function buildDynamicSlot(name, fn) {
14051 return createObjectExpression([
14052 createObjectProperty(`name`, name),
14053 createObjectProperty(`fn`, fn)
14054 ]);
14055 }
14056 function hasForwardedSlots(children) {
14057 for (let i = 0; i < children.length; i++) {
14058 const child = children[i];
14059 switch (child.type) {
14060 case 1 /* ELEMENT */:
14061 if (child.tagType === 2 /* SLOT */ ||
14062 hasForwardedSlots(child.children)) {
14063 return true;
14064 }
14065 break;
14066 case 9 /* IF */:
14067 if (hasForwardedSlots(child.branches))
14068 return true;
14069 break;
14070 case 10 /* IF_BRANCH */:
14071 case 11 /* FOR */:
14072 if (hasForwardedSlots(child.children))
14073 return true;
14074 break;
14075 }
14076 }
14077 return false;
14078 }
14079 function isNonWhitespaceContent(node) {
14080 if (node.type !== 2 /* TEXT */ && node.type !== 12 /* TEXT_CALL */)
14081 return true;
14082 return node.type === 2 /* TEXT */
14083 ? !!node.content.trim()
14084 : isNonWhitespaceContent(node.content);
14085 }
14086
14087 // some directive transforms (e.g. v-model) may return a symbol for runtime
14088 // import, which should be used instead of a resolveDirective call.
14089 const directiveImportMap = new WeakMap();
14090 // generate a JavaScript AST for this element's codegen
14091 const transformElement = (node, context) => {
14092 // perform the work on exit, after all child expressions have been
14093 // processed and merged.
14094 return function postTransformElement() {
14095 node = context.currentNode;
14096 if (!(node.type === 1 /* ELEMENT */ &&
14097 (node.tagType === 0 /* ELEMENT */ ||
14098 node.tagType === 1 /* COMPONENT */))) {
14099 return;
14100 }
14101 const { tag, props } = node;
14102 const isComponent = node.tagType === 1 /* COMPONENT */;
14103 // The goal of the transform is to create a codegenNode implementing the
14104 // VNodeCall interface.
14105 let vnodeTag = isComponent
14106 ? resolveComponentType(node, context)
14107 : `"${tag}"`;
14108 const isDynamicComponent = isObject(vnodeTag) && vnodeTag.callee === RESOLVE_DYNAMIC_COMPONENT;
14109 let vnodeProps;
14110 let vnodeChildren;
14111 let vnodePatchFlag;
14112 let patchFlag = 0;
14113 let vnodeDynamicProps;
14114 let dynamicPropNames;
14115 let vnodeDirectives;
14116 let shouldUseBlock =
14117 // dynamic component may resolve to plain elements
14118 isDynamicComponent ||
14119 vnodeTag === TELEPORT ||
14120 vnodeTag === SUSPENSE ||
14121 (!isComponent &&
14122 // <svg> and <foreignObject> must be forced into blocks so that block
14123 // updates inside get proper isSVG flag at runtime. (#639, #643)
14124 // This is technically web-specific, but splitting the logic out of core
14125 // leads to too much unnecessary complexity.
14126 (tag === 'svg' || tag === 'foreignObject'));
14127 // props
14128 if (props.length > 0) {
14129 const propsBuildResult = buildProps(node, context);
14130 vnodeProps = propsBuildResult.props;
14131 patchFlag = propsBuildResult.patchFlag;
14132 dynamicPropNames = propsBuildResult.dynamicPropNames;
14133 const directives = propsBuildResult.directives;
14134 vnodeDirectives =
14135 directives && directives.length
14136 ? createArrayExpression(directives.map(dir => buildDirectiveArgs(dir, context)))
14137 : undefined;
14138 if (propsBuildResult.shouldUseBlock) {
14139 shouldUseBlock = true;
14140 }
14141 }
14142 // children
14143 if (node.children.length > 0) {
14144 if (vnodeTag === KEEP_ALIVE) {
14145 // Although a built-in component, we compile KeepAlive with raw children
14146 // instead of slot functions so that it can be used inside Transition
14147 // or other Transition-wrapping HOCs.
14148 // To ensure correct updates with block optimizations, we need to:
14149 // 1. Force keep-alive into a block. This avoids its children being
14150 // collected by a parent block.
14151 shouldUseBlock = true;
14152 // 2. Force keep-alive to always be updated, since it uses raw children.
14153 patchFlag |= 1024 /* DYNAMIC_SLOTS */;
14154 if (node.children.length > 1) {
14155 context.onError(createCompilerError(45 /* X_KEEP_ALIVE_INVALID_CHILDREN */, {
14156 start: node.children[0].loc.start,
14157 end: node.children[node.children.length - 1].loc.end,
14158 source: ''
14159 }));
14160 }
14161 }
14162 const shouldBuildAsSlots = isComponent &&
14163 // Teleport is not a real component and has dedicated runtime handling
14164 vnodeTag !== TELEPORT &&
14165 // explained above.
14166 vnodeTag !== KEEP_ALIVE;
14167 if (shouldBuildAsSlots) {
14168 const { slots, hasDynamicSlots } = buildSlots(node, context);
14169 vnodeChildren = slots;
14170 if (hasDynamicSlots) {
14171 patchFlag |= 1024 /* DYNAMIC_SLOTS */;
14172 }
14173 }
14174 else if (node.children.length === 1 && vnodeTag !== TELEPORT) {
14175 const child = node.children[0];
14176 const type = child.type;
14177 // check for dynamic text children
14178 const hasDynamicTextChild = type === 5 /* INTERPOLATION */ ||
14179 type === 8 /* COMPOUND_EXPRESSION */;
14180 if (hasDynamicTextChild &&
14181 getConstantType(child, context) === 0 /* NOT_CONSTANT */) {
14182 patchFlag |= 1 /* TEXT */;
14183 }
14184 // pass directly if the only child is a text node
14185 // (plain / interpolation / expression)
14186 if (hasDynamicTextChild || type === 2 /* TEXT */) {
14187 vnodeChildren = child;
14188 }
14189 else {
14190 vnodeChildren = node.children;
14191 }
14192 }
14193 else {
14194 vnodeChildren = node.children;
14195 }
14196 }
14197 // patchFlag & dynamicPropNames
14198 if (patchFlag !== 0) {
14199 {
14200 if (patchFlag < 0) {
14201 // special flags (negative and mutually exclusive)
14202 vnodePatchFlag = patchFlag + ` /* ${PatchFlagNames[patchFlag]} */`;
14203 }
14204 else {
14205 // bitwise flags
14206 const flagNames = Object.keys(PatchFlagNames)
14207 .map(Number)
14208 .filter(n => n > 0 && patchFlag & n)
14209 .map(n => PatchFlagNames[n])
14210 .join(`, `);
14211 vnodePatchFlag = patchFlag + ` /* ${flagNames} */`;
14212 }
14213 }
14214 if (dynamicPropNames && dynamicPropNames.length) {
14215 vnodeDynamicProps = stringifyDynamicPropNames(dynamicPropNames);
14216 }
14217 }
14218 node.codegenNode = createVNodeCall(context, vnodeTag, vnodeProps, vnodeChildren, vnodePatchFlag, vnodeDynamicProps, vnodeDirectives, !!shouldUseBlock, false /* disableTracking */, isComponent, node.loc);
14219 };
14220 };
14221 function resolveComponentType(node, context, ssr = false) {
14222 let { tag } = node;
14223 // 1. dynamic component
14224 const isExplicitDynamic = isComponentTag(tag);
14225 const isProp = findProp(node, 'is');
14226 if (isProp) {
14227 if (isExplicitDynamic ||
14228 (false )) {
14229 const exp = isProp.type === 6 /* ATTRIBUTE */
14230 ? isProp.value && createSimpleExpression(isProp.value.content, true)
14231 : isProp.exp;
14232 if (exp) {
14233 return createCallExpression(context.helper(RESOLVE_DYNAMIC_COMPONENT), [
14234 exp
14235 ]);
14236 }
14237 }
14238 else if (isProp.type === 6 /* ATTRIBUTE */ &&
14239 isProp.value.content.startsWith('vue:')) {
14240 // <button is="vue:xxx">
14241 // if not <component>, only is value that starts with "vue:" will be
14242 // treated as component by the parse phase and reach here, unless it's
14243 // compat mode where all is values are considered components
14244 tag = isProp.value.content.slice(4);
14245 }
14246 }
14247 // 1.5 v-is (TODO: Deprecate)
14248 const isDir = !isExplicitDynamic && findDir(node, 'is');
14249 if (isDir && isDir.exp) {
14250 return createCallExpression(context.helper(RESOLVE_DYNAMIC_COMPONENT), [
14251 isDir.exp
14252 ]);
14253 }
14254 // 2. built-in components (Teleport, Transition, KeepAlive, Suspense...)
14255 const builtIn = isCoreComponent(tag) || context.isBuiltInComponent(tag);
14256 if (builtIn) {
14257 // built-ins are simply fallthroughs / have special handling during ssr
14258 // so we don't need to import their runtime equivalents
14259 if (!ssr)
14260 context.helper(builtIn);
14261 return builtIn;
14262 }
14263 // 5. user component (resolve)
14264 context.helper(RESOLVE_COMPONENT);
14265 context.components.add(tag);
14266 return toValidAssetId(tag, `component`);
14267 }
14268 function buildProps(node, context, props = node.props, ssr = false) {
14269 const { tag, loc: elementLoc, children } = node;
14270 const isComponent = node.tagType === 1 /* COMPONENT */;
14271 let properties = [];
14272 const mergeArgs = [];
14273 const runtimeDirectives = [];
14274 const hasChildren = children.length > 0;
14275 let shouldUseBlock = false;
14276 // patchFlag analysis
14277 let patchFlag = 0;
14278 let hasRef = false;
14279 let hasClassBinding = false;
14280 let hasStyleBinding = false;
14281 let hasHydrationEventBinding = false;
14282 let hasDynamicKeys = false;
14283 let hasVnodeHook = false;
14284 const dynamicPropNames = [];
14285 const analyzePatchFlag = ({ key, value }) => {
14286 if (isStaticExp(key)) {
14287 const name = key.content;
14288 const isEventHandler = isOn(name);
14289 if (!isComponent &&
14290 isEventHandler &&
14291 // omit the flag for click handlers because hydration gives click
14292 // dedicated fast path.
14293 name.toLowerCase() !== 'onclick' &&
14294 // omit v-model handlers
14295 name !== 'onUpdate:modelValue' &&
14296 // omit onVnodeXXX hooks
14297 !isReservedProp(name)) {
14298 hasHydrationEventBinding = true;
14299 }
14300 if (isEventHandler && isReservedProp(name)) {
14301 hasVnodeHook = true;
14302 }
14303 if (value.type === 20 /* JS_CACHE_EXPRESSION */ ||
14304 ((value.type === 4 /* SIMPLE_EXPRESSION */ ||
14305 value.type === 8 /* COMPOUND_EXPRESSION */) &&
14306 getConstantType(value, context) > 0)) {
14307 // skip if the prop is a cached handler or has constant value
14308 return;
14309 }
14310 if (name === 'ref') {
14311 hasRef = true;
14312 }
14313 else if (name === 'class') {
14314 hasClassBinding = true;
14315 }
14316 else if (name === 'style') {
14317 hasStyleBinding = true;
14318 }
14319 else if (name !== 'key' && !dynamicPropNames.includes(name)) {
14320 dynamicPropNames.push(name);
14321 }
14322 // treat the dynamic class and style binding of the component as dynamic props
14323 if (isComponent &&
14324 (name === 'class' || name === 'style') &&
14325 !dynamicPropNames.includes(name)) {
14326 dynamicPropNames.push(name);
14327 }
14328 }
14329 else {
14330 hasDynamicKeys = true;
14331 }
14332 };
14333 for (let i = 0; i < props.length; i++) {
14334 // static attribute
14335 const prop = props[i];
14336 if (prop.type === 6 /* ATTRIBUTE */) {
14337 const { loc, name, value } = prop;
14338 let isStatic = true;
14339 if (name === 'ref') {
14340 hasRef = true;
14341 if (context.scopes.vFor > 0) {
14342 properties.push(createObjectProperty(createSimpleExpression('ref_for', true), createSimpleExpression('true')));
14343 }
14344 }
14345 // skip is on <component>, or is="vue:xxx"
14346 if (name === 'is' &&
14347 (isComponentTag(tag) ||
14348 (value && value.content.startsWith('vue:')) ||
14349 (false ))) {
14350 continue;
14351 }
14352 properties.push(createObjectProperty(createSimpleExpression(name, true, getInnerRange(loc, 0, name.length)), createSimpleExpression(value ? value.content : '', isStatic, value ? value.loc : loc)));
14353 }
14354 else {
14355 // directives
14356 const { name, arg, exp, loc } = prop;
14357 const isVBind = name === 'bind';
14358 const isVOn = name === 'on';
14359 // skip v-slot - it is handled by its dedicated transform.
14360 if (name === 'slot') {
14361 if (!isComponent) {
14362 context.onError(createCompilerError(40 /* X_V_SLOT_MISPLACED */, loc));
14363 }
14364 continue;
14365 }
14366 // skip v-once/v-memo - they are handled by dedicated transforms.
14367 if (name === 'once' || name === 'memo') {
14368 continue;
14369 }
14370 // skip v-is and :is on <component>
14371 if (name === 'is' ||
14372 (isVBind &&
14373 isStaticArgOf(arg, 'is') &&
14374 (isComponentTag(tag) ||
14375 (false )))) {
14376 continue;
14377 }
14378 // skip v-on in SSR compilation
14379 if (isVOn && ssr) {
14380 continue;
14381 }
14382 if (
14383 // #938: elements with dynamic keys should be forced into blocks
14384 (isVBind && isStaticArgOf(arg, 'key')) ||
14385 // inline before-update hooks need to force block so that it is invoked
14386 // before children
14387 (isVOn && hasChildren && isStaticArgOf(arg, 'vue:before-update'))) {
14388 shouldUseBlock = true;
14389 }
14390 if (isVBind && isStaticArgOf(arg, 'ref') && context.scopes.vFor > 0) {
14391 properties.push(createObjectProperty(createSimpleExpression('ref_for', true), createSimpleExpression('true')));
14392 }
14393 // special case for v-bind and v-on with no argument
14394 if (!arg && (isVBind || isVOn)) {
14395 hasDynamicKeys = true;
14396 if (exp) {
14397 if (properties.length) {
14398 mergeArgs.push(createObjectExpression(dedupeProperties(properties), elementLoc));
14399 properties = [];
14400 }
14401 if (isVBind) {
14402 mergeArgs.push(exp);
14403 }
14404 else {
14405 // v-on="obj" -> toHandlers(obj)
14406 mergeArgs.push({
14407 type: 14 /* JS_CALL_EXPRESSION */,
14408 loc,
14409 callee: context.helper(TO_HANDLERS),
14410 arguments: [exp]
14411 });
14412 }
14413 }
14414 else {
14415 context.onError(createCompilerError(isVBind
14416 ? 34 /* X_V_BIND_NO_EXPRESSION */
14417 : 35 /* X_V_ON_NO_EXPRESSION */, loc));
14418 }
14419 continue;
14420 }
14421 const directiveTransform = context.directiveTransforms[name];
14422 if (directiveTransform) {
14423 // has built-in directive transform.
14424 const { props, needRuntime } = directiveTransform(prop, node, context);
14425 !ssr && props.forEach(analyzePatchFlag);
14426 properties.push(...props);
14427 if (needRuntime) {
14428 runtimeDirectives.push(prop);
14429 if (isSymbol(needRuntime)) {
14430 directiveImportMap.set(prop, needRuntime);
14431 }
14432 }
14433 }
14434 else if (!isBuiltInDirective(name)) {
14435 // no built-in transform, this is a user custom directive.
14436 runtimeDirectives.push(prop);
14437 // custom dirs may use beforeUpdate so they need to force blocks
14438 // to ensure before-update gets called before children update
14439 if (hasChildren) {
14440 shouldUseBlock = true;
14441 }
14442 }
14443 }
14444 }
14445 let propsExpression = undefined;
14446 // has v-bind="object" or v-on="object", wrap with mergeProps
14447 if (mergeArgs.length) {
14448 if (properties.length) {
14449 mergeArgs.push(createObjectExpression(dedupeProperties(properties), elementLoc));
14450 }
14451 if (mergeArgs.length > 1) {
14452 propsExpression = createCallExpression(context.helper(MERGE_PROPS), mergeArgs, elementLoc);
14453 }
14454 else {
14455 // single v-bind with nothing else - no need for a mergeProps call
14456 propsExpression = mergeArgs[0];
14457 }
14458 }
14459 else if (properties.length) {
14460 propsExpression = createObjectExpression(dedupeProperties(properties), elementLoc);
14461 }
14462 // patchFlag analysis
14463 if (hasDynamicKeys) {
14464 patchFlag |= 16 /* FULL_PROPS */;
14465 }
14466 else {
14467 if (hasClassBinding && !isComponent) {
14468 patchFlag |= 2 /* CLASS */;
14469 }
14470 if (hasStyleBinding && !isComponent) {
14471 patchFlag |= 4 /* STYLE */;
14472 }
14473 if (dynamicPropNames.length) {
14474 patchFlag |= 8 /* PROPS */;
14475 }
14476 if (hasHydrationEventBinding) {
14477 patchFlag |= 32 /* HYDRATE_EVENTS */;
14478 }
14479 }
14480 if (!shouldUseBlock &&
14481 (patchFlag === 0 || patchFlag === 32 /* HYDRATE_EVENTS */) &&
14482 (hasRef || hasVnodeHook || runtimeDirectives.length > 0)) {
14483 patchFlag |= 512 /* NEED_PATCH */;
14484 }
14485 // pre-normalize props, SSR is skipped for now
14486 if (!context.inSSR && propsExpression) {
14487 switch (propsExpression.type) {
14488 case 15 /* JS_OBJECT_EXPRESSION */:
14489 // means that there is no v-bind,
14490 // but still need to deal with dynamic key binding
14491 let classKeyIndex = -1;
14492 let styleKeyIndex = -1;
14493 let hasDynamicKey = false;
14494 for (let i = 0; i < propsExpression.properties.length; i++) {
14495 const key = propsExpression.properties[i].key;
14496 if (isStaticExp(key)) {
14497 if (key.content === 'class') {
14498 classKeyIndex = i;
14499 }
14500 else if (key.content === 'style') {
14501 styleKeyIndex = i;
14502 }
14503 }
14504 else if (!key.isHandlerKey) {
14505 hasDynamicKey = true;
14506 }
14507 }
14508 const classProp = propsExpression.properties[classKeyIndex];
14509 const styleProp = propsExpression.properties[styleKeyIndex];
14510 // no dynamic key
14511 if (!hasDynamicKey) {
14512 if (classProp && !isStaticExp(classProp.value)) {
14513 classProp.value = createCallExpression(context.helper(NORMALIZE_CLASS), [classProp.value]);
14514 }
14515 if (styleProp &&
14516 !isStaticExp(styleProp.value) &&
14517 // the static style is compiled into an object,
14518 // so use `hasStyleBinding` to ensure that it is a dynamic style binding
14519 (hasStyleBinding ||
14520 // v-bind:style and style both exist,
14521 // v-bind:style with static literal object
14522 styleProp.value.type === 17 /* JS_ARRAY_EXPRESSION */)) {
14523 styleProp.value = createCallExpression(context.helper(NORMALIZE_STYLE), [styleProp.value]);
14524 }
14525 }
14526 else {
14527 // dynamic key binding, wrap with `normalizeProps`
14528 propsExpression = createCallExpression(context.helper(NORMALIZE_PROPS), [propsExpression]);
14529 }
14530 break;
14531 case 14 /* JS_CALL_EXPRESSION */:
14532 // mergeProps call, do nothing
14533 break;
14534 default:
14535 // single v-bind
14536 propsExpression = createCallExpression(context.helper(NORMALIZE_PROPS), [
14537 createCallExpression(context.helper(GUARD_REACTIVE_PROPS), [
14538 propsExpression
14539 ])
14540 ]);
14541 break;
14542 }
14543 }
14544 return {
14545 props: propsExpression,
14546 directives: runtimeDirectives,
14547 patchFlag,
14548 dynamicPropNames,
14549 shouldUseBlock
14550 };
14551 }
14552 // Dedupe props in an object literal.
14553 // Literal duplicated attributes would have been warned during the parse phase,
14554 // however, it's possible to encounter duplicated `onXXX` handlers with different
14555 // modifiers. We also need to merge static and dynamic class / style attributes.
14556 // - onXXX handlers / style: merge into array
14557 // - class: merge into single expression with concatenation
14558 function dedupeProperties(properties) {
14559 const knownProps = new Map();
14560 const deduped = [];
14561 for (let i = 0; i < properties.length; i++) {
14562 const prop = properties[i];
14563 // dynamic keys are always allowed
14564 if (prop.key.type === 8 /* COMPOUND_EXPRESSION */ || !prop.key.isStatic) {
14565 deduped.push(prop);
14566 continue;
14567 }
14568 const name = prop.key.content;
14569 const existing = knownProps.get(name);
14570 if (existing) {
14571 if (name === 'style' || name === 'class' || isOn(name)) {
14572 mergeAsArray$1(existing, prop);
14573 }
14574 // unexpected duplicate, should have emitted error during parse
14575 }
14576 else {
14577 knownProps.set(name, prop);
14578 deduped.push(prop);
14579 }
14580 }
14581 return deduped;
14582 }
14583 function mergeAsArray$1(existing, incoming) {
14584 if (existing.value.type === 17 /* JS_ARRAY_EXPRESSION */) {
14585 existing.value.elements.push(incoming.value);
14586 }
14587 else {
14588 existing.value = createArrayExpression([existing.value, incoming.value], existing.loc);
14589 }
14590 }
14591 function buildDirectiveArgs(dir, context) {
14592 const dirArgs = [];
14593 const runtime = directiveImportMap.get(dir);
14594 if (runtime) {
14595 // built-in directive with runtime
14596 dirArgs.push(context.helperString(runtime));
14597 }
14598 else {
14599 {
14600 // inject statement for resolving directive
14601 context.helper(RESOLVE_DIRECTIVE);
14602 context.directives.add(dir.name);
14603 dirArgs.push(toValidAssetId(dir.name, `directive`));
14604 }
14605 }
14606 const { loc } = dir;
14607 if (dir.exp)
14608 dirArgs.push(dir.exp);
14609 if (dir.arg) {
14610 if (!dir.exp) {
14611 dirArgs.push(`void 0`);
14612 }
14613 dirArgs.push(dir.arg);
14614 }
14615 if (Object.keys(dir.modifiers).length) {
14616 if (!dir.arg) {
14617 if (!dir.exp) {
14618 dirArgs.push(`void 0`);
14619 }
14620 dirArgs.push(`void 0`);
14621 }
14622 const trueExpression = createSimpleExpression(`true`, false, loc);
14623 dirArgs.push(createObjectExpression(dir.modifiers.map(modifier => createObjectProperty(modifier, trueExpression)), loc));
14624 }
14625 return createArrayExpression(dirArgs, dir.loc);
14626 }
14627 function stringifyDynamicPropNames(props) {
14628 let propsNamesString = `[`;
14629 for (let i = 0, l = props.length; i < l; i++) {
14630 propsNamesString += JSON.stringify(props[i]);
14631 if (i < l - 1)
14632 propsNamesString += ', ';
14633 }
14634 return propsNamesString + `]`;
14635 }
14636 function isComponentTag(tag) {
14637 return tag === 'component' || tag === 'Component';
14638 }
14639
14640 const transformSlotOutlet = (node, context) => {
14641 if (isSlotOutlet(node)) {
14642 const { children, loc } = node;
14643 const { slotName, slotProps } = processSlotOutlet(node, context);
14644 const slotArgs = [
14645 context.prefixIdentifiers ? `_ctx.$slots` : `$slots`,
14646 slotName,
14647 '{}',
14648 'undefined',
14649 'true'
14650 ];
14651 let expectedLen = 2;
14652 if (slotProps) {
14653 slotArgs[2] = slotProps;
14654 expectedLen = 3;
14655 }
14656 if (children.length) {
14657 slotArgs[3] = createFunctionExpression([], children, false, false, loc);
14658 expectedLen = 4;
14659 }
14660 if (context.scopeId && !context.slotted) {
14661 expectedLen = 5;
14662 }
14663 slotArgs.splice(expectedLen); // remove unused arguments
14664 node.codegenNode = createCallExpression(context.helper(RENDER_SLOT), slotArgs, loc);
14665 }
14666 };
14667 function processSlotOutlet(node, context) {
14668 let slotName = `"default"`;
14669 let slotProps = undefined;
14670 const nonNameProps = [];
14671 for (let i = 0; i < node.props.length; i++) {
14672 const p = node.props[i];
14673 if (p.type === 6 /* ATTRIBUTE */) {
14674 if (p.value) {
14675 if (p.name === 'name') {
14676 slotName = JSON.stringify(p.value.content);
14677 }
14678 else {
14679 p.name = camelize(p.name);
14680 nonNameProps.push(p);
14681 }
14682 }
14683 }
14684 else {
14685 if (p.name === 'bind' && isStaticArgOf(p.arg, 'name')) {
14686 if (p.exp)
14687 slotName = p.exp;
14688 }
14689 else {
14690 if (p.name === 'bind' && p.arg && isStaticExp(p.arg)) {
14691 p.arg.content = camelize(p.arg.content);
14692 }
14693 nonNameProps.push(p);
14694 }
14695 }
14696 }
14697 if (nonNameProps.length > 0) {
14698 const { props, directives } = buildProps(node, context, nonNameProps);
14699 slotProps = props;
14700 if (directives.length) {
14701 context.onError(createCompilerError(36 /* X_V_SLOT_UNEXPECTED_DIRECTIVE_ON_SLOT_OUTLET */, directives[0].loc));
14702 }
14703 }
14704 return {
14705 slotName,
14706 slotProps
14707 };
14708 }
14709
14710 const fnExpRE = /^\s*([\w$_]+|(async\s*)?\([^)]*?\))\s*=>|^\s*(async\s+)?function(?:\s+[\w$]+)?\s*\(/;
14711 const transformOn = (dir, node, context, augmentor) => {
14712 const { loc, modifiers, arg } = dir;
14713 if (!dir.exp && !modifiers.length) {
14714 context.onError(createCompilerError(35 /* X_V_ON_NO_EXPRESSION */, loc));
14715 }
14716 let eventName;
14717 if (arg.type === 4 /* SIMPLE_EXPRESSION */) {
14718 if (arg.isStatic) {
14719 let rawName = arg.content;
14720 // TODO deprecate @vnodeXXX usage
14721 if (rawName.startsWith('vue:')) {
14722 rawName = `vnode-${rawName.slice(4)}`;
14723 }
14724 // for all event listeners, auto convert it to camelCase. See issue #2249
14725 eventName = createSimpleExpression(toHandlerKey(camelize(rawName)), true, arg.loc);
14726 }
14727 else {
14728 // #2388
14729 eventName = createCompoundExpression([
14730 `${context.helperString(TO_HANDLER_KEY)}(`,
14731 arg,
14732 `)`
14733 ]);
14734 }
14735 }
14736 else {
14737 // already a compound expression.
14738 eventName = arg;
14739 eventName.children.unshift(`${context.helperString(TO_HANDLER_KEY)}(`);
14740 eventName.children.push(`)`);
14741 }
14742 // handler processing
14743 let exp = dir.exp;
14744 if (exp && !exp.content.trim()) {
14745 exp = undefined;
14746 }
14747 let shouldCache = context.cacheHandlers && !exp && !context.inVOnce;
14748 if (exp) {
14749 const isMemberExp = isMemberExpression(exp.content);
14750 const isInlineStatement = !(isMemberExp || fnExpRE.test(exp.content));
14751 const hasMultipleStatements = exp.content.includes(`;`);
14752 {
14753 validateBrowserExpression(exp, context, false, hasMultipleStatements);
14754 }
14755 if (isInlineStatement || (shouldCache && isMemberExp)) {
14756 // wrap inline statement in a function expression
14757 exp = createCompoundExpression([
14758 `${isInlineStatement
14759 ? `$event`
14760 : `${``}(...args)`} => ${hasMultipleStatements ? `{` : `(`}`,
14761 exp,
14762 hasMultipleStatements ? `}` : `)`
14763 ]);
14764 }
14765 }
14766 let ret = {
14767 props: [
14768 createObjectProperty(eventName, exp || createSimpleExpression(`() => {}`, false, loc))
14769 ]
14770 };
14771 // apply extended compiler augmentor
14772 if (augmentor) {
14773 ret = augmentor(ret);
14774 }
14775 if (shouldCache) {
14776 // cache handlers so that it's always the same handler being passed down.
14777 // this avoids unnecessary re-renders when users use inline handlers on
14778 // components.
14779 ret.props[0].value = context.cache(ret.props[0].value);
14780 }
14781 // mark the key as handler for props normalization check
14782 ret.props.forEach(p => (p.key.isHandlerKey = true));
14783 return ret;
14784 };
14785
14786 // v-bind without arg is handled directly in ./transformElements.ts due to it affecting
14787 // codegen for the entire props object. This transform here is only for v-bind
14788 // *with* args.
14789 const transformBind = (dir, _node, context) => {
14790 const { exp, modifiers, loc } = dir;
14791 const arg = dir.arg;
14792 if (arg.type !== 4 /* SIMPLE_EXPRESSION */) {
14793 arg.children.unshift(`(`);
14794 arg.children.push(`) || ""`);
14795 }
14796 else if (!arg.isStatic) {
14797 arg.content = `${arg.content} || ""`;
14798 }
14799 // .sync is replaced by v-model:arg
14800 if (modifiers.includes('camel')) {
14801 if (arg.type === 4 /* SIMPLE_EXPRESSION */) {
14802 if (arg.isStatic) {
14803 arg.content = camelize(arg.content);
14804 }
14805 else {
14806 arg.content = `${context.helperString(CAMELIZE)}(${arg.content})`;
14807 }
14808 }
14809 else {
14810 arg.children.unshift(`${context.helperString(CAMELIZE)}(`);
14811 arg.children.push(`)`);
14812 }
14813 }
14814 if (!context.inSSR) {
14815 if (modifiers.includes('prop')) {
14816 injectPrefix(arg, '.');
14817 }
14818 if (modifiers.includes('attr')) {
14819 injectPrefix(arg, '^');
14820 }
14821 }
14822 if (!exp ||
14823 (exp.type === 4 /* SIMPLE_EXPRESSION */ && !exp.content.trim())) {
14824 context.onError(createCompilerError(34 /* X_V_BIND_NO_EXPRESSION */, loc));
14825 return {
14826 props: [createObjectProperty(arg, createSimpleExpression('', true, loc))]
14827 };
14828 }
14829 return {
14830 props: [createObjectProperty(arg, exp)]
14831 };
14832 };
14833 const injectPrefix = (arg, prefix) => {
14834 if (arg.type === 4 /* SIMPLE_EXPRESSION */) {
14835 if (arg.isStatic) {
14836 arg.content = prefix + arg.content;
14837 }
14838 else {
14839 arg.content = `\`${prefix}\${${arg.content}}\``;
14840 }
14841 }
14842 else {
14843 arg.children.unshift(`'${prefix}' + (`);
14844 arg.children.push(`)`);
14845 }
14846 };
14847
14848 // Merge adjacent text nodes and expressions into a single expression
14849 // e.g. <div>abc {{ d }} {{ e }}</div> should have a single expression node as child.
14850 const transformText = (node, context) => {
14851 if (node.type === 0 /* ROOT */ ||
14852 node.type === 1 /* ELEMENT */ ||
14853 node.type === 11 /* FOR */ ||
14854 node.type === 10 /* IF_BRANCH */) {
14855 // perform the transform on node exit so that all expressions have already
14856 // been processed.
14857 return () => {
14858 const children = node.children;
14859 let currentContainer = undefined;
14860 let hasText = false;
14861 for (let i = 0; i < children.length; i++) {
14862 const child = children[i];
14863 if (isText(child)) {
14864 hasText = true;
14865 for (let j = i + 1; j < children.length; j++) {
14866 const next = children[j];
14867 if (isText(next)) {
14868 if (!currentContainer) {
14869 currentContainer = children[i] = {
14870 type: 8 /* COMPOUND_EXPRESSION */,
14871 loc: child.loc,
14872 children: [child]
14873 };
14874 }
14875 // merge adjacent text node into current
14876 currentContainer.children.push(` + `, next);
14877 children.splice(j, 1);
14878 j--;
14879 }
14880 else {
14881 currentContainer = undefined;
14882 break;
14883 }
14884 }
14885 }
14886 }
14887 if (!hasText ||
14888 // if this is a plain element with a single text child, leave it
14889 // as-is since the runtime has dedicated fast path for this by directly
14890 // setting textContent of the element.
14891 // for component root it's always normalized anyway.
14892 (children.length === 1 &&
14893 (node.type === 0 /* ROOT */ ||
14894 (node.type === 1 /* ELEMENT */ &&
14895 node.tagType === 0 /* ELEMENT */ &&
14896 // #3756
14897 // custom directives can potentially add DOM elements arbitrarily,
14898 // we need to avoid setting textContent of the element at runtime
14899 // to avoid accidentally overwriting the DOM elements added
14900 // by the user through custom directives.
14901 !node.props.find(p => p.type === 7 /* DIRECTIVE */ &&
14902 !context.directiveTransforms[p.name]) &&
14903 // in compat mode, <template> tags with no special directives
14904 // will be rendered as a fragment so its children must be
14905 // converted into vnodes.
14906 !(false ))))) {
14907 return;
14908 }
14909 // pre-convert text nodes into createTextVNode(text) calls to avoid
14910 // runtime normalization.
14911 for (let i = 0; i < children.length; i++) {
14912 const child = children[i];
14913 if (isText(child) || child.type === 8 /* COMPOUND_EXPRESSION */) {
14914 const callArgs = [];
14915 // createTextVNode defaults to single whitespace, so if it is a
14916 // single space the code could be an empty call to save bytes.
14917 if (child.type !== 2 /* TEXT */ || child.content !== ' ') {
14918 callArgs.push(child);
14919 }
14920 // mark dynamic text with flag so it gets patched inside a block
14921 if (!context.ssr &&
14922 getConstantType(child, context) === 0 /* NOT_CONSTANT */) {
14923 callArgs.push(1 /* TEXT */ +
14924 (` /* ${PatchFlagNames[1 /* TEXT */]} */` ));
14925 }
14926 children[i] = {
14927 type: 12 /* TEXT_CALL */,
14928 content: child,
14929 loc: child.loc,
14930 codegenNode: createCallExpression(context.helper(CREATE_TEXT), callArgs)
14931 };
14932 }
14933 }
14934 };
14935 }
14936 };
14937
14938 const seen = new WeakSet();
14939 const transformOnce = (node, context) => {
14940 if (node.type === 1 /* ELEMENT */ && findDir(node, 'once', true)) {
14941 if (seen.has(node) || context.inVOnce) {
14942 return;
14943 }
14944 seen.add(node);
14945 context.inVOnce = true;
14946 context.helper(SET_BLOCK_TRACKING);
14947 return () => {
14948 context.inVOnce = false;
14949 const cur = context.currentNode;
14950 if (cur.codegenNode) {
14951 cur.codegenNode = context.cache(cur.codegenNode, true /* isVNode */);
14952 }
14953 };
14954 }
14955 };
14956
14957 const transformModel = (dir, node, context) => {
14958 const { exp, arg } = dir;
14959 if (!exp) {
14960 context.onError(createCompilerError(41 /* X_V_MODEL_NO_EXPRESSION */, dir.loc));
14961 return createTransformProps();
14962 }
14963 const rawExp = exp.loc.source;
14964 const expString = exp.type === 4 /* SIMPLE_EXPRESSION */ ? exp.content : rawExp;
14965 // im SFC <script setup> inline mode, the exp may have been transformed into
14966 // _unref(exp)
14967 context.bindingMetadata[rawExp];
14968 const maybeRef = !true /* SETUP_CONST */;
14969 if (!expString.trim() ||
14970 (!isMemberExpression(expString) && !maybeRef)) {
14971 context.onError(createCompilerError(42 /* X_V_MODEL_MALFORMED_EXPRESSION */, exp.loc));
14972 return createTransformProps();
14973 }
14974 const propName = arg ? arg : createSimpleExpression('modelValue', true);
14975 const eventName = arg
14976 ? isStaticExp(arg)
14977 ? `onUpdate:${arg.content}`
14978 : createCompoundExpression(['"onUpdate:" + ', arg])
14979 : `onUpdate:modelValue`;
14980 let assignmentExp;
14981 const eventArg = context.isTS ? `($event: any)` : `$event`;
14982 {
14983 assignmentExp = createCompoundExpression([
14984 `${eventArg} => ((`,
14985 exp,
14986 `) = $event)`
14987 ]);
14988 }
14989 const props = [
14990 // modelValue: foo
14991 createObjectProperty(propName, dir.exp),
14992 // "onUpdate:modelValue": $event => (foo = $event)
14993 createObjectProperty(eventName, assignmentExp)
14994 ];
14995 // modelModifiers: { foo: true, "bar-baz": true }
14996 if (dir.modifiers.length && node.tagType === 1 /* COMPONENT */) {
14997 const modifiers = dir.modifiers
14998 .map(m => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`)
14999 .join(`, `);
15000 const modifiersKey = arg
15001 ? isStaticExp(arg)
15002 ? `${arg.content}Modifiers`
15003 : createCompoundExpression([arg, ' + "Modifiers"'])
15004 : `modelModifiers`;
15005 props.push(createObjectProperty(modifiersKey, createSimpleExpression(`{ ${modifiers} }`, false, dir.loc, 2 /* CAN_HOIST */)));
15006 }
15007 return createTransformProps(props);
15008 };
15009 function createTransformProps(props = []) {
15010 return { props };
15011 }
15012
15013 const seen$1 = new WeakSet();
15014 const transformMemo = (node, context) => {
15015 if (node.type === 1 /* ELEMENT */) {
15016 const dir = findDir(node, 'memo');
15017 if (!dir || seen$1.has(node)) {
15018 return;
15019 }
15020 seen$1.add(node);
15021 return () => {
15022 const codegenNode = node.codegenNode ||
15023 context.currentNode.codegenNode;
15024 if (codegenNode && codegenNode.type === 13 /* VNODE_CALL */) {
15025 // non-component sub tree should be turned into a block
15026 if (node.tagType !== 1 /* COMPONENT */) {
15027 makeBlock(codegenNode, context);
15028 }
15029 node.codegenNode = createCallExpression(context.helper(WITH_MEMO), [
15030 dir.exp,
15031 createFunctionExpression(undefined, codegenNode),
15032 `_cache`,
15033 String(context.cached++)
15034 ]);
15035 }
15036 };
15037 }
15038 };
15039
15040 function getBaseTransformPreset(prefixIdentifiers) {
15041 return [
15042 [
15043 transformOnce,
15044 transformIf,
15045 transformMemo,
15046 transformFor,
15047 ...([]),
15048 ...([transformExpression]
15049 ),
15050 transformSlotOutlet,
15051 transformElement,
15052 trackSlotScopes,
15053 transformText
15054 ],
15055 {
15056 on: transformOn,
15057 bind: transformBind,
15058 model: transformModel
15059 }
15060 ];
15061 }
15062 // we name it `baseCompile` so that higher order compilers like
15063 // @vue/compiler-dom can export `compile` while re-exporting everything else.
15064 function baseCompile(template, options = {}) {
15065 const onError = options.onError || defaultOnError;
15066 const isModuleMode = options.mode === 'module';
15067 /* istanbul ignore if */
15068 {
15069 if (options.prefixIdentifiers === true) {
15070 onError(createCompilerError(46 /* X_PREFIX_ID_NOT_SUPPORTED */));
15071 }
15072 else if (isModuleMode) {
15073 onError(createCompilerError(47 /* X_MODULE_MODE_NOT_SUPPORTED */));
15074 }
15075 }
15076 const prefixIdentifiers = !true ;
15077 if (options.cacheHandlers) {
15078 onError(createCompilerError(48 /* X_CACHE_HANDLER_NOT_SUPPORTED */));
15079 }
15080 if (options.scopeId && !isModuleMode) {
15081 onError(createCompilerError(49 /* X_SCOPE_ID_NOT_SUPPORTED */));
15082 }
15083 const ast = isString(template) ? baseParse(template, options) : template;
15084 const [nodeTransforms, directiveTransforms] = getBaseTransformPreset();
15085 transform(ast, extend({}, options, {
15086 prefixIdentifiers,
15087 nodeTransforms: [
15088 ...nodeTransforms,
15089 ...(options.nodeTransforms || []) // user transforms
15090 ],
15091 directiveTransforms: extend({}, directiveTransforms, options.directiveTransforms || {} // user transforms
15092 )
15093 }));
15094 return generate(ast, extend({}, options, {
15095 prefixIdentifiers
15096 }));
15097 }
15098
15099 const noopDirectiveTransform = () => ({ props: [] });
15100
15101 const V_MODEL_RADIO = Symbol(`vModelRadio` );
15102 const V_MODEL_CHECKBOX = Symbol(`vModelCheckbox` );
15103 const V_MODEL_TEXT = Symbol(`vModelText` );
15104 const V_MODEL_SELECT = Symbol(`vModelSelect` );
15105 const V_MODEL_DYNAMIC = Symbol(`vModelDynamic` );
15106 const V_ON_WITH_MODIFIERS = Symbol(`vOnModifiersGuard` );
15107 const V_ON_WITH_KEYS = Symbol(`vOnKeysGuard` );
15108 const V_SHOW = Symbol(`vShow` );
15109 const TRANSITION$1 = Symbol(`Transition` );
15110 const TRANSITION_GROUP = Symbol(`TransitionGroup` );
15111 registerRuntimeHelpers({
15112 [V_MODEL_RADIO]: `vModelRadio`,
15113 [V_MODEL_CHECKBOX]: `vModelCheckbox`,
15114 [V_MODEL_TEXT]: `vModelText`,
15115 [V_MODEL_SELECT]: `vModelSelect`,
15116 [V_MODEL_DYNAMIC]: `vModelDynamic`,
15117 [V_ON_WITH_MODIFIERS]: `withModifiers`,
15118 [V_ON_WITH_KEYS]: `withKeys`,
15119 [V_SHOW]: `vShow`,
15120 [TRANSITION$1]: `Transition`,
15121 [TRANSITION_GROUP]: `TransitionGroup`
15122 });
15123
15124 /* eslint-disable no-restricted-globals */
15125 let decoder;
15126 function decodeHtmlBrowser(raw, asAttr = false) {
15127 if (!decoder) {
15128 decoder = document.createElement('div');
15129 }
15130 if (asAttr) {
15131 decoder.innerHTML = `<div foo="${raw.replace(/"/g, '&quot;')}">`;
15132 return decoder.children[0].getAttribute('foo');
15133 }
15134 else {
15135 decoder.innerHTML = raw;
15136 return decoder.textContent;
15137 }
15138 }
15139
15140 const isRawTextContainer = /*#__PURE__*/ makeMap('style,iframe,script,noscript', true);
15141 const parserOptions = {
15142 isVoidTag,
15143 isNativeTag: tag => isHTMLTag(tag) || isSVGTag(tag),
15144 isPreTag: tag => tag === 'pre',
15145 decodeEntities: decodeHtmlBrowser ,
15146 isBuiltInComponent: (tag) => {
15147 if (isBuiltInType(tag, `Transition`)) {
15148 return TRANSITION$1;
15149 }
15150 else if (isBuiltInType(tag, `TransitionGroup`)) {
15151 return TRANSITION_GROUP;
15152 }
15153 },
15154 // https://html.spec.whatwg.org/multipage/parsing.html#tree-construction-dispatcher
15155 getNamespace(tag, parent) {
15156 let ns = parent ? parent.ns : 0 /* HTML */;
15157 if (parent && ns === 2 /* MATH_ML */) {
15158 if (parent.tag === 'annotation-xml') {
15159 if (tag === 'svg') {
15160 return 1 /* SVG */;
15161 }
15162 if (parent.props.some(a => a.type === 6 /* ATTRIBUTE */ &&
15163 a.name === 'encoding' &&
15164 a.value != null &&
15165 (a.value.content === 'text/html' ||
15166 a.value.content === 'application/xhtml+xml'))) {
15167 ns = 0 /* HTML */;
15168 }
15169 }
15170 else if (/^m(?:[ions]|text)$/.test(parent.tag) &&
15171 tag !== 'mglyph' &&
15172 tag !== 'malignmark') {
15173 ns = 0 /* HTML */;
15174 }
15175 }
15176 else if (parent && ns === 1 /* SVG */) {
15177 if (parent.tag === 'foreignObject' ||
15178 parent.tag === 'desc' ||
15179 parent.tag === 'title') {
15180 ns = 0 /* HTML */;
15181 }
15182 }
15183 if (ns === 0 /* HTML */) {
15184 if (tag === 'svg') {
15185 return 1 /* SVG */;
15186 }
15187 if (tag === 'math') {
15188 return 2 /* MATH_ML */;
15189 }
15190 }
15191 return ns;
15192 },
15193 // https://html.spec.whatwg.org/multipage/parsing.html#parsing-html-fragments
15194 getTextMode({ tag, ns }) {
15195 if (ns === 0 /* HTML */) {
15196 if (tag === 'textarea' || tag === 'title') {
15197 return 1 /* RCDATA */;
15198 }
15199 if (isRawTextContainer(tag)) {
15200 return 2 /* RAWTEXT */;
15201 }
15202 }
15203 return 0 /* DATA */;
15204 }
15205 };
15206
15207 // Parse inline CSS strings for static style attributes into an object.
15208 // This is a NodeTransform since it works on the static `style` attribute and
15209 // converts it into a dynamic equivalent:
15210 // style="color: red" -> :style='{ "color": "red" }'
15211 // It is then processed by `transformElement` and included in the generated
15212 // props.
15213 const transformStyle = node => {
15214 if (node.type === 1 /* ELEMENT */) {
15215 node.props.forEach((p, i) => {
15216 if (p.type === 6 /* ATTRIBUTE */ && p.name === 'style' && p.value) {
15217 // replace p with an expression node
15218 node.props[i] = {
15219 type: 7 /* DIRECTIVE */,
15220 name: `bind`,
15221 arg: createSimpleExpression(`style`, true, p.loc),
15222 exp: parseInlineCSS(p.value.content, p.loc),
15223 modifiers: [],
15224 loc: p.loc
15225 };
15226 }
15227 });
15228 }
15229 };
15230 const parseInlineCSS = (cssText, loc) => {
15231 const normalized = parseStringStyle(cssText);
15232 return createSimpleExpression(JSON.stringify(normalized), false, loc, 3 /* CAN_STRINGIFY */);
15233 };
15234
15235 function createDOMCompilerError(code, loc) {
15236 return createCompilerError(code, loc, DOMErrorMessages );
15237 }
15238 const DOMErrorMessages = {
15239 [50 /* X_V_HTML_NO_EXPRESSION */]: `v-html is missing expression.`,
15240 [51 /* X_V_HTML_WITH_CHILDREN */]: `v-html will override element children.`,
15241 [52 /* X_V_TEXT_NO_EXPRESSION */]: `v-text is missing expression.`,
15242 [53 /* X_V_TEXT_WITH_CHILDREN */]: `v-text will override element children.`,
15243 [54 /* X_V_MODEL_ON_INVALID_ELEMENT */]: `v-model can only be used on <input>, <textarea> and <select> elements.`,
15244 [55 /* X_V_MODEL_ARG_ON_ELEMENT */]: `v-model argument is not supported on plain elements.`,
15245 [56 /* 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.`,
15246 [57 /* X_V_MODEL_UNNECESSARY_VALUE */]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`,
15247 [58 /* X_V_SHOW_NO_EXPRESSION */]: `v-show is missing expression.`,
15248 [59 /* X_TRANSITION_INVALID_CHILDREN */]: `<Transition> expects exactly one child element or component.`,
15249 [60 /* X_IGNORED_SIDE_EFFECT_TAG */]: `Tags with side effect (<script> and <style>) are ignored in client component templates.`
15250 };
15251
15252 const transformVHtml = (dir, node, context) => {
15253 const { exp, loc } = dir;
15254 if (!exp) {
15255 context.onError(createDOMCompilerError(50 /* X_V_HTML_NO_EXPRESSION */, loc));
15256 }
15257 if (node.children.length) {
15258 context.onError(createDOMCompilerError(51 /* X_V_HTML_WITH_CHILDREN */, loc));
15259 node.children.length = 0;
15260 }
15261 return {
15262 props: [
15263 createObjectProperty(createSimpleExpression(`innerHTML`, true, loc), exp || createSimpleExpression('', true))
15264 ]
15265 };
15266 };
15267
15268 const transformVText = (dir, node, context) => {
15269 const { exp, loc } = dir;
15270 if (!exp) {
15271 context.onError(createDOMCompilerError(52 /* X_V_TEXT_NO_EXPRESSION */, loc));
15272 }
15273 if (node.children.length) {
15274 context.onError(createDOMCompilerError(53 /* X_V_TEXT_WITH_CHILDREN */, loc));
15275 node.children.length = 0;
15276 }
15277 return {
15278 props: [
15279 createObjectProperty(createSimpleExpression(`textContent`, true), exp
15280 ? createCallExpression(context.helperString(TO_DISPLAY_STRING), [exp], loc)
15281 : createSimpleExpression('', true))
15282 ]
15283 };
15284 };
15285
15286 const transformModel$1 = (dir, node, context) => {
15287 const baseResult = transformModel(dir, node, context);
15288 // base transform has errors OR component v-model (only need props)
15289 if (!baseResult.props.length || node.tagType === 1 /* COMPONENT */) {
15290 return baseResult;
15291 }
15292 if (dir.arg) {
15293 context.onError(createDOMCompilerError(55 /* X_V_MODEL_ARG_ON_ELEMENT */, dir.arg.loc));
15294 }
15295 function checkDuplicatedValue() {
15296 const value = findProp(node, 'value');
15297 if (value) {
15298 context.onError(createDOMCompilerError(57 /* X_V_MODEL_UNNECESSARY_VALUE */, value.loc));
15299 }
15300 }
15301 const { tag } = node;
15302 const isCustomElement = context.isCustomElement(tag);
15303 if (tag === 'input' ||
15304 tag === 'textarea' ||
15305 tag === 'select' ||
15306 isCustomElement) {
15307 let directiveToUse = V_MODEL_TEXT;
15308 let isInvalidType = false;
15309 if (tag === 'input' || isCustomElement) {
15310 const type = findProp(node, `type`);
15311 if (type) {
15312 if (type.type === 7 /* DIRECTIVE */) {
15313 // :type="foo"
15314 directiveToUse = V_MODEL_DYNAMIC;
15315 }
15316 else if (type.value) {
15317 switch (type.value.content) {
15318 case 'radio':
15319 directiveToUse = V_MODEL_RADIO;
15320 break;
15321 case 'checkbox':
15322 directiveToUse = V_MODEL_CHECKBOX;
15323 break;
15324 case 'file':
15325 isInvalidType = true;
15326 context.onError(createDOMCompilerError(56 /* X_V_MODEL_ON_FILE_INPUT_ELEMENT */, dir.loc));
15327 break;
15328 default:
15329 // text type
15330 checkDuplicatedValue();
15331 break;
15332 }
15333 }
15334 }
15335 else if (hasDynamicKeyVBind(node)) {
15336 // element has bindings with dynamic keys, which can possibly contain
15337 // "type".
15338 directiveToUse = V_MODEL_DYNAMIC;
15339 }
15340 else {
15341 // text type
15342 checkDuplicatedValue();
15343 }
15344 }
15345 else if (tag === 'select') {
15346 directiveToUse = V_MODEL_SELECT;
15347 }
15348 else {
15349 // textarea
15350 checkDuplicatedValue();
15351 }
15352 // inject runtime directive
15353 // by returning the helper symbol via needRuntime
15354 // the import will replaced a resolveDirective call.
15355 if (!isInvalidType) {
15356 baseResult.needRuntime = context.helper(directiveToUse);
15357 }
15358 }
15359 else {
15360 context.onError(createDOMCompilerError(54 /* X_V_MODEL_ON_INVALID_ELEMENT */, dir.loc));
15361 }
15362 // native vmodel doesn't need the `modelValue` props since they are also
15363 // passed to the runtime as `binding.value`. removing it reduces code size.
15364 baseResult.props = baseResult.props.filter(p => !(p.key.type === 4 /* SIMPLE_EXPRESSION */ &&
15365 p.key.content === 'modelValue'));
15366 return baseResult;
15367 };
15368
15369 const isEventOptionModifier = /*#__PURE__*/ makeMap(`passive,once,capture`);
15370 const isNonKeyModifier = /*#__PURE__*/ makeMap(
15371 // event propagation management
15372`stop,prevent,self,` +
15373 // system modifiers + exact
15374 `ctrl,shift,alt,meta,exact,` +
15375 // mouse
15376 `middle`);
15377 // left & right could be mouse or key modifiers based on event type
15378 const maybeKeyModifier = /*#__PURE__*/ makeMap('left,right');
15379 const isKeyboardEvent = /*#__PURE__*/ makeMap(`onkeyup,onkeydown,onkeypress`, true);
15380 const resolveModifiers = (key, modifiers, context, loc) => {
15381 const keyModifiers = [];
15382 const nonKeyModifiers = [];
15383 const eventOptionModifiers = [];
15384 for (let i = 0; i < modifiers.length; i++) {
15385 const modifier = modifiers[i];
15386 if (isEventOptionModifier(modifier)) {
15387 // eventOptionModifiers: modifiers for addEventListener() options,
15388 // e.g. .passive & .capture
15389 eventOptionModifiers.push(modifier);
15390 }
15391 else {
15392 // runtimeModifiers: modifiers that needs runtime guards
15393 if (maybeKeyModifier(modifier)) {
15394 if (isStaticExp(key)) {
15395 if (isKeyboardEvent(key.content)) {
15396 keyModifiers.push(modifier);
15397 }
15398 else {
15399 nonKeyModifiers.push(modifier);
15400 }
15401 }
15402 else {
15403 keyModifiers.push(modifier);
15404 nonKeyModifiers.push(modifier);
15405 }
15406 }
15407 else {
15408 if (isNonKeyModifier(modifier)) {
15409 nonKeyModifiers.push(modifier);
15410 }
15411 else {
15412 keyModifiers.push(modifier);
15413 }
15414 }
15415 }
15416 }
15417 return {
15418 keyModifiers,
15419 nonKeyModifiers,
15420 eventOptionModifiers
15421 };
15422 };
15423 const transformClick = (key, event) => {
15424 const isStaticClick = isStaticExp(key) && key.content.toLowerCase() === 'onclick';
15425 return isStaticClick
15426 ? createSimpleExpression(event, true)
15427 : key.type !== 4 /* SIMPLE_EXPRESSION */
15428 ? createCompoundExpression([
15429 `(`,
15430 key,
15431 `) === "onClick" ? "${event}" : (`,
15432 key,
15433 `)`
15434 ])
15435 : key;
15436 };
15437 const transformOn$1 = (dir, node, context) => {
15438 return transformOn(dir, node, context, baseResult => {
15439 const { modifiers } = dir;
15440 if (!modifiers.length)
15441 return baseResult;
15442 let { key, value: handlerExp } = baseResult.props[0];
15443 const { keyModifiers, nonKeyModifiers, eventOptionModifiers } = resolveModifiers(key, modifiers, context, dir.loc);
15444 // normalize click.right and click.middle since they don't actually fire
15445 if (nonKeyModifiers.includes('right')) {
15446 key = transformClick(key, `onContextmenu`);
15447 }
15448 if (nonKeyModifiers.includes('middle')) {
15449 key = transformClick(key, `onMouseup`);
15450 }
15451 if (nonKeyModifiers.length) {
15452 handlerExp = createCallExpression(context.helper(V_ON_WITH_MODIFIERS), [
15453 handlerExp,
15454 JSON.stringify(nonKeyModifiers)
15455 ]);
15456 }
15457 if (keyModifiers.length &&
15458 // if event name is dynamic, always wrap with keys guard
15459 (!isStaticExp(key) || isKeyboardEvent(key.content))) {
15460 handlerExp = createCallExpression(context.helper(V_ON_WITH_KEYS), [
15461 handlerExp,
15462 JSON.stringify(keyModifiers)
15463 ]);
15464 }
15465 if (eventOptionModifiers.length) {
15466 const modifierPostfix = eventOptionModifiers.map(capitalize).join('');
15467 key = isStaticExp(key)
15468 ? createSimpleExpression(`${key.content}${modifierPostfix}`, true)
15469 : createCompoundExpression([`(`, key, `) + "${modifierPostfix}"`]);
15470 }
15471 return {
15472 props: [createObjectProperty(key, handlerExp)]
15473 };
15474 });
15475 };
15476
15477 const transformShow = (dir, node, context) => {
15478 const { exp, loc } = dir;
15479 if (!exp) {
15480 context.onError(createDOMCompilerError(58 /* X_V_SHOW_NO_EXPRESSION */, loc));
15481 }
15482 return {
15483 props: [],
15484 needRuntime: context.helper(V_SHOW)
15485 };
15486 };
15487
15488 const warnTransitionChildren = (node, context) => {
15489 if (node.type === 1 /* ELEMENT */ &&
15490 node.tagType === 1 /* COMPONENT */) {
15491 const component = context.isBuiltInComponent(node.tag);
15492 if (component === TRANSITION$1) {
15493 return () => {
15494 if (node.children.length && hasMultipleChildren(node)) {
15495 context.onError(createDOMCompilerError(59 /* X_TRANSITION_INVALID_CHILDREN */, {
15496 start: node.children[0].loc.start,
15497 end: node.children[node.children.length - 1].loc.end,
15498 source: ''
15499 }));
15500 }
15501 };
15502 }
15503 }
15504 };
15505 function hasMultipleChildren(node) {
15506 // #1352 filter out potential comment nodes.
15507 const children = (node.children = node.children.filter(c => c.type !== 3 /* COMMENT */ &&
15508 !(c.type === 2 /* TEXT */ && !c.content.trim())));
15509 const child = children[0];
15510 return (children.length !== 1 ||
15511 child.type === 11 /* FOR */ ||
15512 (child.type === 9 /* IF */ && child.branches.some(hasMultipleChildren)));
15513 }
15514
15515 const ignoreSideEffectTags = (node, context) => {
15516 if (node.type === 1 /* ELEMENT */ &&
15517 node.tagType === 0 /* ELEMENT */ &&
15518 (node.tag === 'script' || node.tag === 'style')) {
15519 context.onError(createDOMCompilerError(60 /* X_IGNORED_SIDE_EFFECT_TAG */, node.loc));
15520 context.removeNode();
15521 }
15522 };
15523
15524 const DOMNodeTransforms = [
15525 transformStyle,
15526 ...([warnTransitionChildren] )
15527 ];
15528 const DOMDirectiveTransforms = {
15529 cloak: noopDirectiveTransform,
15530 html: transformVHtml,
15531 text: transformVText,
15532 model: transformModel$1,
15533 on: transformOn$1,
15534 show: transformShow
15535 };
15536 function compile$1(template, options = {}) {
15537 return baseCompile(template, extend({}, parserOptions, options, {
15538 nodeTransforms: [
15539 // ignore <script> and <tag>
15540 // this is not put inside DOMNodeTransforms because that list is used
15541 // by compiler-ssr to generate vnode fallback branches
15542 ignoreSideEffectTags,
15543 ...DOMNodeTransforms,
15544 ...(options.nodeTransforms || [])
15545 ],
15546 directiveTransforms: extend({}, DOMDirectiveTransforms, options.directiveTransforms || {}),
15547 transformHoist: null
15548 }));
15549 }
15550
15551 // This entry is the "full-build" that includes both the runtime
15552 {
15553 initDev();
15554 }
15555 const compileCache = Object.create(null);
15556 function compileToFunction(template, options) {
15557 if (!isString(template)) {
15558 if (template.nodeType) {
15559 template = template.innerHTML;
15560 }
15561 else {
15562 warn$1(`invalid template option: `, template);
15563 return NOOP;
15564 }
15565 }
15566 const key = template;
15567 const cached = compileCache[key];
15568 if (cached) {
15569 return cached;
15570 }
15571 if (template[0] === '#') {
15572 const el = document.querySelector(template);
15573 if (!el) {
15574 warn$1(`Template element not found or is empty: ${template}`);
15575 }
15576 // __UNSAFE__
15577 // Reason: potential execution of JS expressions in in-DOM template.
15578 // The user must make sure the in-DOM template is trusted. If it's rendered
15579 // by the server, the template should not contain any user data.
15580 template = el ? el.innerHTML : ``;
15581 }
15582 const { code } = compile$1(template, extend({
15583 hoistStatic: true,
15584 onError: onError ,
15585 onWarn: e => onError(e, true)
15586 }, options));
15587 function onError(err, asWarning = false) {
15588 const message = asWarning
15589 ? err.message
15590 : `Template compilation error: ${err.message}`;
15591 const codeFrame = err.loc &&
15592 generateCodeFrame(template, err.loc.start.offset, err.loc.end.offset);
15593 warn$1(codeFrame ? `${message}\n${codeFrame}` : message);
15594 }
15595 // The wildcard import results in a huge object with every export
15596 // with keys that cannot be mangled, and can be quite heavy size-wise.
15597 // In the global build we know `Vue` is available globally so we can avoid
15598 // the wildcard object.
15599 const render = (new Function(code)() );
15600 render._rc = true;
15601 return (compileCache[key] = render);
15602 }
15603 registerRuntimeCompiler(compileToFunction);
15604
15605 exports.BaseTransition = BaseTransition;
15606 exports.Comment = Comment;
15607 exports.EffectScope = EffectScope;
15608 exports.Fragment = Fragment;
15609 exports.KeepAlive = KeepAlive;
15610 exports.ReactiveEffect = ReactiveEffect;
15611 exports.Static = Static;
15612 exports.Suspense = Suspense;
15613 exports.Teleport = Teleport;
15614 exports.Text = Text;
15615 exports.Transition = Transition;
15616 exports.TransitionGroup = TransitionGroup;
15617 exports.VueElement = VueElement;
15618 exports.callWithAsyncErrorHandling = callWithAsyncErrorHandling;
15619 exports.callWithErrorHandling = callWithErrorHandling;
15620 exports.camelize = camelize;
15621 exports.capitalize = capitalize;
15622 exports.cloneVNode = cloneVNode;
15623 exports.compatUtils = compatUtils;
15624 exports.compile = compileToFunction;
15625 exports.computed = computed$1;
15626 exports.createApp = createApp;
15627 exports.createBlock = createBlock;
15628 exports.createCommentVNode = createCommentVNode;
15629 exports.createElementBlock = createElementBlock;
15630 exports.createElementVNode = createBaseVNode;
15631 exports.createHydrationRenderer = createHydrationRenderer;
15632 exports.createPropsRestProxy = createPropsRestProxy;
15633 exports.createRenderer = createRenderer;
15634 exports.createSSRApp = createSSRApp;
15635 exports.createSlots = createSlots;
15636 exports.createStaticVNode = createStaticVNode;
15637 exports.createTextVNode = createTextVNode;
15638 exports.createVNode = createVNode;
15639 exports.customRef = customRef;
15640 exports.defineAsyncComponent = defineAsyncComponent;
15641 exports.defineComponent = defineComponent;
15642 exports.defineCustomElement = defineCustomElement;
15643 exports.defineEmits = defineEmits;
15644 exports.defineExpose = defineExpose;
15645 exports.defineProps = defineProps;
15646 exports.defineSSRCustomElement = defineSSRCustomElement;
15647 exports.effect = effect;
15648 exports.effectScope = effectScope;
15649 exports.getCurrentInstance = getCurrentInstance;
15650 exports.getCurrentScope = getCurrentScope;
15651 exports.getTransitionRawChildren = getTransitionRawChildren;
15652 exports.guardReactiveProps = guardReactiveProps;
15653 exports.h = h;
15654 exports.handleError = handleError;
15655 exports.hydrate = hydrate;
15656 exports.initCustomFormatter = initCustomFormatter;
15657 exports.initDirectivesForSSR = initDirectivesForSSR;
15658 exports.inject = inject;
15659 exports.isMemoSame = isMemoSame;
15660 exports.isProxy = isProxy;
15661 exports.isReactive = isReactive;
15662 exports.isReadonly = isReadonly;
15663 exports.isRef = isRef;
15664 exports.isRuntimeOnly = isRuntimeOnly;
15665 exports.isShallow = isShallow;
15666 exports.isVNode = isVNode;
15667 exports.markRaw = markRaw;
15668 exports.mergeDefaults = mergeDefaults;
15669 exports.mergeProps = mergeProps;
15670 exports.nextTick = nextTick;
15671 exports.normalizeClass = normalizeClass;
15672 exports.normalizeProps = normalizeProps;
15673 exports.normalizeStyle = normalizeStyle;
15674 exports.onActivated = onActivated;
15675 exports.onBeforeMount = onBeforeMount;
15676 exports.onBeforeUnmount = onBeforeUnmount;
15677 exports.onBeforeUpdate = onBeforeUpdate;
15678 exports.onDeactivated = onDeactivated;
15679 exports.onErrorCaptured = onErrorCaptured;
15680 exports.onMounted = onMounted;
15681 exports.onRenderTracked = onRenderTracked;
15682 exports.onRenderTriggered = onRenderTriggered;
15683 exports.onScopeDispose = onScopeDispose;
15684 exports.onServerPrefetch = onServerPrefetch;
15685 exports.onUnmounted = onUnmounted;
15686 exports.onUpdated = onUpdated;
15687 exports.openBlock = openBlock;
15688 exports.popScopeId = popScopeId;
15689 exports.provide = provide;
15690 exports.proxyRefs = proxyRefs;
15691 exports.pushScopeId = pushScopeId;
15692 exports.queuePostFlushCb = queuePostFlushCb;
15693 exports.reactive = reactive;
15694 exports.readonly = readonly;
15695 exports.ref = ref;
15696 exports.registerRuntimeCompiler = registerRuntimeCompiler;
15697 exports.render = render;
15698 exports.renderList = renderList;
15699 exports.renderSlot = renderSlot;
15700 exports.resolveComponent = resolveComponent;
15701 exports.resolveDirective = resolveDirective;
15702 exports.resolveDynamicComponent = resolveDynamicComponent;
15703 exports.resolveFilter = resolveFilter;
15704 exports.resolveTransitionHooks = resolveTransitionHooks;
15705 exports.setBlockTracking = setBlockTracking;
15706 exports.setDevtoolsHook = setDevtoolsHook;
15707 exports.setTransitionHooks = setTransitionHooks;
15708 exports.shallowReactive = shallowReactive;
15709 exports.shallowReadonly = shallowReadonly;
15710 exports.shallowRef = shallowRef;
15711 exports.ssrContextKey = ssrContextKey;
15712 exports.ssrUtils = ssrUtils;
15713 exports.stop = stop;
15714 exports.toDisplayString = toDisplayString;
15715 exports.toHandlerKey = toHandlerKey;
15716 exports.toHandlers = toHandlers;
15717 exports.toRaw = toRaw;
15718 exports.toRef = toRef;
15719 exports.toRefs = toRefs;
15720 exports.transformVNodeArgs = transformVNodeArgs;
15721 exports.triggerRef = triggerRef;
15722 exports.unref = unref;
15723 exports.useAttrs = useAttrs;
15724 exports.useCssModule = useCssModule;
15725 exports.useCssVars = useCssVars;
15726 exports.useSSRContext = useSSRContext;
15727 exports.useSlots = useSlots;
15728 exports.useTransitionState = useTransitionState;
15729 exports.vModelCheckbox = vModelCheckbox;
15730 exports.vModelDynamic = vModelDynamic;
15731 exports.vModelRadio = vModelRadio;
15732 exports.vModelSelect = vModelSelect;
15733 exports.vModelText = vModelText;
15734 exports.vShow = vShow;
15735 exports.version = version;
15736 exports.warn = warn$1;
15737 exports.watch = watch;
15738 exports.watchEffect = watchEffect;
15739 exports.watchPostEffect = watchPostEffect;
15740 exports.watchSyncEffect = watchSyncEffect;
15741 exports.withAsyncContext = withAsyncContext;
15742 exports.withCtx = withCtx;
15743 exports.withDefaults = withDefaults;
15744 exports.withDirectives = withDirectives;
15745 exports.withKeys = withKeys;
15746 exports.withMemo = withMemo;
15747 exports.withModifiers = withModifiers;
15748 exports.withScopeId = withScopeId;
15749
15750 Object.defineProperty(exports, '__esModule', { value: true });
15751
15752 return exports;
15753
15754}({}));