UNPKG

408 kBJavaScriptView Raw
1/**
2 * Make a map and return a function for checking if a key
3 * is in that map.
4 * IMPORTANT: all calls of this function must be prefixed with
5 * \/\*#\_\_PURE\_\_\*\/
6 * So that rollup can tree-shake them if necessary.
7 */
8function makeMap(str, expectsLowerCase) {
9 const map = Object.create(null);
10 const list = str.split(',');
11 for (let i = 0; i < list.length; i++) {
12 map[list[i]] = true;
13 }
14 return expectsLowerCase ? val => !!map[val.toLowerCase()] : val => !!map[val];
15}
16
17const GLOBALS_WHITE_LISTED = 'Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,' +
18 'decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,' +
19 'Object,Boolean,String,RegExp,Map,Set,JSON,Intl,BigInt';
20const isGloballyWhitelisted = /*#__PURE__*/ makeMap(GLOBALS_WHITE_LISTED);
21
22function normalizeStyle(value) {
23 if (isArray(value)) {
24 const res = {};
25 for (let i = 0; i < value.length; i++) {
26 const item = value[i];
27 const normalized = isString(item)
28 ? parseStringStyle(item)
29 : normalizeStyle(item);
30 if (normalized) {
31 for (const key in normalized) {
32 res[key] = normalized[key];
33 }
34 }
35 }
36 return res;
37 }
38 else if (isString(value)) {
39 return value;
40 }
41 else if (isObject(value)) {
42 return value;
43 }
44}
45const listDelimiterRE = /;(?![^(]*\))/g;
46const propertyDelimiterRE = /:([^]+)/;
47const styleCommentRE = /\/\*.*?\*\//gs;
48function parseStringStyle(cssText) {
49 const ret = {};
50 cssText
51 .replace(styleCommentRE, '')
52 .split(listDelimiterRE)
53 .forEach(item => {
54 if (item) {
55 const tmp = item.split(propertyDelimiterRE);
56 tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
57 }
58 });
59 return ret;
60}
61function normalizeClass(value) {
62 let res = '';
63 if (isString(value)) {
64 res = value;
65 }
66 else if (isArray(value)) {
67 for (let i = 0; i < value.length; i++) {
68 const normalized = normalizeClass(value[i]);
69 if (normalized) {
70 res += normalized + ' ';
71 }
72 }
73 }
74 else if (isObject(value)) {
75 for (const name in value) {
76 if (value[name]) {
77 res += name + ' ';
78 }
79 }
80 }
81 return res.trim();
82}
83function normalizeProps(props) {
84 if (!props)
85 return null;
86 let { class: klass, style } = props;
87 if (klass && !isString(klass)) {
88 props.class = normalizeClass(klass);
89 }
90 if (style) {
91 props.style = normalizeStyle(style);
92 }
93 return props;
94}
95
96// These tag configs are shared between compiler-dom and runtime-dom, so they
97// https://developer.mozilla.org/en-US/docs/Web/HTML/Element
98const HTML_TAGS = 'html,body,base,head,link,meta,style,title,address,article,aside,footer,' +
99 'header,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,' +
100 'figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,' +
101 'data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,' +
102 'time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,' +
103 'canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,' +
104 'th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,' +
105 'option,output,progress,select,textarea,details,dialog,menu,' +
106 'summary,template,blockquote,iframe,tfoot';
107// https://developer.mozilla.org/en-US/docs/Web/SVG/Element
108const SVG_TAGS = 'svg,animate,animateMotion,animateTransform,circle,clipPath,color-profile,' +
109 'defs,desc,discard,ellipse,feBlend,feColorMatrix,feComponentTransfer,' +
110 'feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,' +
111 'feDistanceLight,feDropShadow,feFlood,feFuncA,feFuncB,feFuncG,feFuncR,' +
112 'feGaussianBlur,feImage,feMerge,feMergeNode,feMorphology,feOffset,' +
113 'fePointLight,feSpecularLighting,feSpotLight,feTile,feTurbulence,filter,' +
114 'foreignObject,g,hatch,hatchpath,image,line,linearGradient,marker,mask,' +
115 'mesh,meshgradient,meshpatch,meshrow,metadata,mpath,path,pattern,' +
116 'polygon,polyline,radialGradient,rect,set,solidcolor,stop,switch,symbol,' +
117 'text,textPath,title,tspan,unknown,use,view';
118/**
119 * Compiler only.
120 * Do NOT use in runtime code paths unless behind `true` flag.
121 */
122const isHTMLTag = /*#__PURE__*/ makeMap(HTML_TAGS);
123/**
124 * Compiler only.
125 * Do NOT use in runtime code paths unless behind `true` flag.
126 */
127const isSVGTag = /*#__PURE__*/ makeMap(SVG_TAGS);
128
129/**
130 * On the client we only need to offer special cases for boolean attributes that
131 * have different names from their corresponding dom properties:
132 * - itemscope -> N/A
133 * - allowfullscreen -> allowFullscreen
134 * - formnovalidate -> formNoValidate
135 * - ismap -> isMap
136 * - nomodule -> noModule
137 * - novalidate -> noValidate
138 * - readonly -> readOnly
139 */
140const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
141const isSpecialBooleanAttr = /*#__PURE__*/ makeMap(specialBooleanAttrs);
142/**
143 * Boolean attributes should be included if the value is truthy or ''.
144 * e.g. `<select multiple>` compiles to `{ multiple: '' }`
145 */
146function includeBooleanAttr(value) {
147 return !!value || value === '';
148}
149
150function looseCompareArrays(a, b) {
151 if (a.length !== b.length)
152 return false;
153 let equal = true;
154 for (let i = 0; equal && i < a.length; i++) {
155 equal = looseEqual(a[i], b[i]);
156 }
157 return equal;
158}
159function looseEqual(a, b) {
160 if (a === b)
161 return true;
162 let aValidType = isDate(a);
163 let bValidType = isDate(b);
164 if (aValidType || bValidType) {
165 return aValidType && bValidType ? a.getTime() === b.getTime() : false;
166 }
167 aValidType = isSymbol(a);
168 bValidType = isSymbol(b);
169 if (aValidType || bValidType) {
170 return a === b;
171 }
172 aValidType = isArray(a);
173 bValidType = isArray(b);
174 if (aValidType || bValidType) {
175 return aValidType && bValidType ? looseCompareArrays(a, b) : false;
176 }
177 aValidType = isObject(a);
178 bValidType = isObject(b);
179 if (aValidType || bValidType) {
180 /* istanbul ignore if: this if will probably never be called */
181 if (!aValidType || !bValidType) {
182 return false;
183 }
184 const aKeysCount = Object.keys(a).length;
185 const bKeysCount = Object.keys(b).length;
186 if (aKeysCount !== bKeysCount) {
187 return false;
188 }
189 for (const key in a) {
190 const aHasKey = a.hasOwnProperty(key);
191 const bHasKey = b.hasOwnProperty(key);
192 if ((aHasKey && !bHasKey) ||
193 (!aHasKey && bHasKey) ||
194 !looseEqual(a[key], b[key])) {
195 return false;
196 }
197 }
198 }
199 return String(a) === String(b);
200}
201function looseIndexOf(arr, val) {
202 return arr.findIndex(item => looseEqual(item, val));
203}
204
205/**
206 * For converting {{ interpolation }} values to displayed strings.
207 * @private
208 */
209const toDisplayString = (val) => {
210 return isString(val)
211 ? val
212 : val == null
213 ? ''
214 : isArray(val) ||
215 (isObject(val) &&
216 (val.toString === objectToString || !isFunction(val.toString)))
217 ? JSON.stringify(val, replacer, 2)
218 : String(val);
219};
220const replacer = (_key, val) => {
221 // can't use isRef here since @vue/shared has no deps
222 if (val && val.__v_isRef) {
223 return replacer(_key, val.value);
224 }
225 else if (isMap(val)) {
226 return {
227 [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val]) => {
228 entries[`${key} =>`] = val;
229 return entries;
230 }, {})
231 };
232 }
233 else if (isSet(val)) {
234 return {
235 [`Set(${val.size})`]: [...val.values()]
236 };
237 }
238 else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
239 return String(val);
240 }
241 return val;
242};
243
244const EMPTY_OBJ = Object.freeze({})
245 ;
246const EMPTY_ARR = Object.freeze([]) ;
247const NOOP = () => { };
248/**
249 * Always return false.
250 */
251const NO = () => false;
252const onRE = /^on[^a-z]/;
253const isOn = (key) => onRE.test(key);
254const isModelListener = (key) => key.startsWith('onUpdate:');
255const extend = Object.assign;
256const remove = (arr, el) => {
257 const i = arr.indexOf(el);
258 if (i > -1) {
259 arr.splice(i, 1);
260 }
261};
262const hasOwnProperty = Object.prototype.hasOwnProperty;
263const hasOwn = (val, key) => hasOwnProperty.call(val, key);
264const isArray = Array.isArray;
265const isMap = (val) => toTypeString(val) === '[object Map]';
266const isSet = (val) => toTypeString(val) === '[object Set]';
267const isDate = (val) => toTypeString(val) === '[object Date]';
268const isFunction = (val) => typeof val === 'function';
269const isString = (val) => typeof val === 'string';
270const isSymbol = (val) => typeof val === 'symbol';
271const isObject = (val) => val !== null && typeof val === 'object';
272const isPromise = (val) => {
273 return isObject(val) && isFunction(val.then) && isFunction(val.catch);
274};
275const objectToString = Object.prototype.toString;
276const toTypeString = (value) => objectToString.call(value);
277const toRawType = (value) => {
278 // extract "RawType" from strings like "[object RawType]"
279 return toTypeString(value).slice(8, -1);
280};
281const isPlainObject = (val) => toTypeString(val) === '[object Object]';
282const isIntegerKey = (key) => isString(key) &&
283 key !== 'NaN' &&
284 key[0] !== '-' &&
285 '' + parseInt(key, 10) === key;
286const isReservedProp = /*#__PURE__*/ makeMap(
287// the leading comma is intentional so empty string "" is also included
288',key,ref,ref_for,ref_key,' +
289 'onVnodeBeforeMount,onVnodeMounted,' +
290 'onVnodeBeforeUpdate,onVnodeUpdated,' +
291 'onVnodeBeforeUnmount,onVnodeUnmounted');
292const isBuiltInDirective = /*#__PURE__*/ makeMap('bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text,memo');
293const cacheStringFunction = (fn) => {
294 const cache = Object.create(null);
295 return ((str) => {
296 const hit = cache[str];
297 return hit || (cache[str] = fn(str));
298 });
299};
300const camelizeRE = /-(\w)/g;
301/**
302 * @private
303 */
304const camelize = cacheStringFunction((str) => {
305 return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''));
306});
307const hyphenateRE = /\B([A-Z])/g;
308/**
309 * @private
310 */
311const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase());
312/**
313 * @private
314 */
315const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
316/**
317 * @private
318 */
319const toHandlerKey = cacheStringFunction((str) => str ? `on${capitalize(str)}` : ``);
320// compare whether a value has changed, accounting for NaN.
321const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
322const invokeArrayFns = (fns, arg) => {
323 for (let i = 0; i < fns.length; i++) {
324 fns[i](arg);
325 }
326};
327const def = (obj, key, value) => {
328 Object.defineProperty(obj, key, {
329 configurable: true,
330 enumerable: false,
331 value
332 });
333};
334const toNumber = (val) => {
335 const n = parseFloat(val);
336 return isNaN(n) ? val : n;
337};
338let _globalThis;
339const getGlobalThis = () => {
340 return (_globalThis ||
341 (_globalThis =
342 typeof globalThis !== 'undefined'
343 ? globalThis
344 : typeof self !== 'undefined'
345 ? self
346 : typeof window !== 'undefined'
347 ? window
348 : typeof global !== 'undefined'
349 ? global
350 : {}));
351};
352
353function warn(msg, ...args) {
354 console.warn(`[Vue warn] ${msg}`, ...args);
355}
356
357let activeEffectScope;
358class EffectScope {
359 constructor(detached = false) {
360 this.detached = detached;
361 /**
362 * @internal
363 */
364 this.active = true;
365 /**
366 * @internal
367 */
368 this.effects = [];
369 /**
370 * @internal
371 */
372 this.cleanups = [];
373 this.parent = activeEffectScope;
374 if (!detached && activeEffectScope) {
375 this.index =
376 (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(this) - 1;
377 }
378 }
379 run(fn) {
380 if (this.active) {
381 const currentEffectScope = activeEffectScope;
382 try {
383 activeEffectScope = this;
384 return fn();
385 }
386 finally {
387 activeEffectScope = currentEffectScope;
388 }
389 }
390 else {
391 warn(`cannot run an inactive effect scope.`);
392 }
393 }
394 /**
395 * This should only be called on non-detached scopes
396 * @internal
397 */
398 on() {
399 activeEffectScope = this;
400 }
401 /**
402 * This should only be called on non-detached scopes
403 * @internal
404 */
405 off() {
406 activeEffectScope = this.parent;
407 }
408 stop(fromParent) {
409 if (this.active) {
410 let i, l;
411 for (i = 0, l = this.effects.length; i < l; i++) {
412 this.effects[i].stop();
413 }
414 for (i = 0, l = this.cleanups.length; i < l; i++) {
415 this.cleanups[i]();
416 }
417 if (this.scopes) {
418 for (i = 0, l = this.scopes.length; i < l; i++) {
419 this.scopes[i].stop(true);
420 }
421 }
422 // nested scope, dereference from parent to avoid memory leaks
423 if (!this.detached && this.parent && !fromParent) {
424 // optimized O(1) removal
425 const last = this.parent.scopes.pop();
426 if (last && last !== this) {
427 this.parent.scopes[this.index] = last;
428 last.index = this.index;
429 }
430 }
431 this.parent = undefined;
432 this.active = false;
433 }
434 }
435}
436function effectScope(detached) {
437 return new EffectScope(detached);
438}
439function recordEffectScope(effect, scope = activeEffectScope) {
440 if (scope && scope.active) {
441 scope.effects.push(effect);
442 }
443}
444function getCurrentScope() {
445 return activeEffectScope;
446}
447function onScopeDispose(fn) {
448 if (activeEffectScope) {
449 activeEffectScope.cleanups.push(fn);
450 }
451 else {
452 warn(`onScopeDispose() is called when there is no active effect scope` +
453 ` to be associated with.`);
454 }
455}
456
457const createDep = (effects) => {
458 const dep = new Set(effects);
459 dep.w = 0;
460 dep.n = 0;
461 return dep;
462};
463const wasTracked = (dep) => (dep.w & trackOpBit) > 0;
464const newTracked = (dep) => (dep.n & trackOpBit) > 0;
465const initDepMarkers = ({ deps }) => {
466 if (deps.length) {
467 for (let i = 0; i < deps.length; i++) {
468 deps[i].w |= trackOpBit; // set was tracked
469 }
470 }
471};
472const finalizeDepMarkers = (effect) => {
473 const { deps } = effect;
474 if (deps.length) {
475 let ptr = 0;
476 for (let i = 0; i < deps.length; i++) {
477 const dep = deps[i];
478 if (wasTracked(dep) && !newTracked(dep)) {
479 dep.delete(effect);
480 }
481 else {
482 deps[ptr++] = dep;
483 }
484 // clear bits
485 dep.w &= ~trackOpBit;
486 dep.n &= ~trackOpBit;
487 }
488 deps.length = ptr;
489 }
490};
491
492const targetMap = new WeakMap();
493// The number of effects currently being tracked recursively.
494let effectTrackDepth = 0;
495let trackOpBit = 1;
496/**
497 * The bitwise track markers support at most 30 levels of recursion.
498 * This value is chosen to enable modern JS engines to use a SMI on all platforms.
499 * When recursion depth is greater, fall back to using a full cleanup.
500 */
501const maxMarkerBits = 30;
502let activeEffect;
503const ITERATE_KEY = Symbol('iterate' );
504const MAP_KEY_ITERATE_KEY = Symbol('Map key iterate' );
505class ReactiveEffect {
506 constructor(fn, scheduler = null, scope) {
507 this.fn = fn;
508 this.scheduler = scheduler;
509 this.active = true;
510 this.deps = [];
511 this.parent = undefined;
512 recordEffectScope(this, scope);
513 }
514 run() {
515 if (!this.active) {
516 return this.fn();
517 }
518 let parent = activeEffect;
519 let lastShouldTrack = shouldTrack;
520 while (parent) {
521 if (parent === this) {
522 return;
523 }
524 parent = parent.parent;
525 }
526 try {
527 this.parent = activeEffect;
528 activeEffect = this;
529 shouldTrack = true;
530 trackOpBit = 1 << ++effectTrackDepth;
531 if (effectTrackDepth <= maxMarkerBits) {
532 initDepMarkers(this);
533 }
534 else {
535 cleanupEffect(this);
536 }
537 return this.fn();
538 }
539 finally {
540 if (effectTrackDepth <= maxMarkerBits) {
541 finalizeDepMarkers(this);
542 }
543 trackOpBit = 1 << --effectTrackDepth;
544 activeEffect = this.parent;
545 shouldTrack = lastShouldTrack;
546 this.parent = undefined;
547 if (this.deferStop) {
548 this.stop();
549 }
550 }
551 }
552 stop() {
553 // stopped while running itself - defer the cleanup
554 if (activeEffect === this) {
555 this.deferStop = true;
556 }
557 else if (this.active) {
558 cleanupEffect(this);
559 if (this.onStop) {
560 this.onStop();
561 }
562 this.active = false;
563 }
564 }
565}
566function cleanupEffect(effect) {
567 const { deps } = effect;
568 if (deps.length) {
569 for (let i = 0; i < deps.length; i++) {
570 deps[i].delete(effect);
571 }
572 deps.length = 0;
573 }
574}
575function effect(fn, options) {
576 if (fn.effect) {
577 fn = fn.effect.fn;
578 }
579 const _effect = new ReactiveEffect(fn);
580 if (options) {
581 extend(_effect, options);
582 if (options.scope)
583 recordEffectScope(_effect, options.scope);
584 }
585 if (!options || !options.lazy) {
586 _effect.run();
587 }
588 const runner = _effect.run.bind(_effect);
589 runner.effect = _effect;
590 return runner;
591}
592function stop(runner) {
593 runner.effect.stop();
594}
595let shouldTrack = true;
596const trackStack = [];
597function pauseTracking() {
598 trackStack.push(shouldTrack);
599 shouldTrack = false;
600}
601function resetTracking() {
602 const last = trackStack.pop();
603 shouldTrack = last === undefined ? true : last;
604}
605function track(target, type, key) {
606 if (shouldTrack && activeEffect) {
607 let depsMap = targetMap.get(target);
608 if (!depsMap) {
609 targetMap.set(target, (depsMap = new Map()));
610 }
611 let dep = depsMap.get(key);
612 if (!dep) {
613 depsMap.set(key, (dep = createDep()));
614 }
615 const eventInfo = { effect: activeEffect, target, type, key }
616 ;
617 trackEffects(dep, eventInfo);
618 }
619}
620function trackEffects(dep, debuggerEventExtraInfo) {
621 let shouldTrack = false;
622 if (effectTrackDepth <= maxMarkerBits) {
623 if (!newTracked(dep)) {
624 dep.n |= trackOpBit; // set newly tracked
625 shouldTrack = !wasTracked(dep);
626 }
627 }
628 else {
629 // Full cleanup mode.
630 shouldTrack = !dep.has(activeEffect);
631 }
632 if (shouldTrack) {
633 dep.add(activeEffect);
634 activeEffect.deps.push(dep);
635 if (activeEffect.onTrack) {
636 activeEffect.onTrack(Object.assign({ effect: activeEffect }, debuggerEventExtraInfo));
637 }
638 }
639}
640function trigger(target, type, key, newValue, oldValue, oldTarget) {
641 const depsMap = targetMap.get(target);
642 if (!depsMap) {
643 // never been tracked
644 return;
645 }
646 let deps = [];
647 if (type === "clear" /* TriggerOpTypes.CLEAR */) {
648 // collection being cleared
649 // trigger all effects for target
650 deps = [...depsMap.values()];
651 }
652 else if (key === 'length' && isArray(target)) {
653 const newLength = toNumber(newValue);
654 depsMap.forEach((dep, key) => {
655 if (key === 'length' || key >= newLength) {
656 deps.push(dep);
657 }
658 });
659 }
660 else {
661 // schedule runs for SET | ADD | DELETE
662 if (key !== void 0) {
663 deps.push(depsMap.get(key));
664 }
665 // also run for iteration key on ADD | DELETE | Map.SET
666 switch (type) {
667 case "add" /* TriggerOpTypes.ADD */:
668 if (!isArray(target)) {
669 deps.push(depsMap.get(ITERATE_KEY));
670 if (isMap(target)) {
671 deps.push(depsMap.get(MAP_KEY_ITERATE_KEY));
672 }
673 }
674 else if (isIntegerKey(key)) {
675 // new index added to array -> length changes
676 deps.push(depsMap.get('length'));
677 }
678 break;
679 case "delete" /* TriggerOpTypes.DELETE */:
680 if (!isArray(target)) {
681 deps.push(depsMap.get(ITERATE_KEY));
682 if (isMap(target)) {
683 deps.push(depsMap.get(MAP_KEY_ITERATE_KEY));
684 }
685 }
686 break;
687 case "set" /* TriggerOpTypes.SET */:
688 if (isMap(target)) {
689 deps.push(depsMap.get(ITERATE_KEY));
690 }
691 break;
692 }
693 }
694 const eventInfo = { target, type, key, newValue, oldValue, oldTarget }
695 ;
696 if (deps.length === 1) {
697 if (deps[0]) {
698 {
699 triggerEffects(deps[0], eventInfo);
700 }
701 }
702 }
703 else {
704 const effects = [];
705 for (const dep of deps) {
706 if (dep) {
707 effects.push(...dep);
708 }
709 }
710 {
711 triggerEffects(createDep(effects), eventInfo);
712 }
713 }
714}
715function triggerEffects(dep, debuggerEventExtraInfo) {
716 // spread into array for stabilization
717 const effects = isArray(dep) ? dep : [...dep];
718 for (const effect of effects) {
719 if (effect.computed) {
720 triggerEffect(effect, debuggerEventExtraInfo);
721 }
722 }
723 for (const effect of effects) {
724 if (!effect.computed) {
725 triggerEffect(effect, debuggerEventExtraInfo);
726 }
727 }
728}
729function triggerEffect(effect, debuggerEventExtraInfo) {
730 if (effect !== activeEffect || effect.allowRecurse) {
731 if (effect.onTrigger) {
732 effect.onTrigger(extend({ effect }, debuggerEventExtraInfo));
733 }
734 if (effect.scheduler) {
735 effect.scheduler();
736 }
737 else {
738 effect.run();
739 }
740 }
741}
742
743const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
744const builtInSymbols = new Set(
745/*#__PURE__*/
746Object.getOwnPropertyNames(Symbol)
747 // ios10.x Object.getOwnPropertyNames(Symbol) can enumerate 'arguments' and 'caller'
748 // but accessing them on Symbol leads to TypeError because Symbol is a strict mode
749 // function
750 .filter(key => key !== 'arguments' && key !== 'caller')
751 .map(key => Symbol[key])
752 .filter(isSymbol));
753const get = /*#__PURE__*/ createGetter();
754const shallowGet = /*#__PURE__*/ createGetter(false, true);
755const readonlyGet = /*#__PURE__*/ createGetter(true);
756const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);
757const arrayInstrumentations = /*#__PURE__*/ createArrayInstrumentations();
758function createArrayInstrumentations() {
759 const instrumentations = {};
760 ['includes', 'indexOf', 'lastIndexOf'].forEach(key => {
761 instrumentations[key] = function (...args) {
762 const arr = toRaw(this);
763 for (let i = 0, l = this.length; i < l; i++) {
764 track(arr, "get" /* TrackOpTypes.GET */, i + '');
765 }
766 // we run the method using the original args first (which may be reactive)
767 const res = arr[key](...args);
768 if (res === -1 || res === false) {
769 // if that didn't work, run it again using raw values.
770 return arr[key](...args.map(toRaw));
771 }
772 else {
773 return res;
774 }
775 };
776 });
777 ['push', 'pop', 'shift', 'unshift', 'splice'].forEach(key => {
778 instrumentations[key] = function (...args) {
779 pauseTracking();
780 const res = toRaw(this)[key].apply(this, args);
781 resetTracking();
782 return res;
783 };
784 });
785 return instrumentations;
786}
787function createGetter(isReadonly = false, shallow = false) {
788 return function get(target, key, receiver) {
789 if (key === "__v_isReactive" /* ReactiveFlags.IS_REACTIVE */) {
790 return !isReadonly;
791 }
792 else if (key === "__v_isReadonly" /* ReactiveFlags.IS_READONLY */) {
793 return isReadonly;
794 }
795 else if (key === "__v_isShallow" /* ReactiveFlags.IS_SHALLOW */) {
796 return shallow;
797 }
798 else if (key === "__v_raw" /* ReactiveFlags.RAW */ &&
799 receiver ===
800 (isReadonly
801 ? shallow
802 ? shallowReadonlyMap
803 : readonlyMap
804 : shallow
805 ? shallowReactiveMap
806 : reactiveMap).get(target)) {
807 return target;
808 }
809 const targetIsArray = isArray(target);
810 if (!isReadonly && targetIsArray && hasOwn(arrayInstrumentations, key)) {
811 return Reflect.get(arrayInstrumentations, key, receiver);
812 }
813 const res = Reflect.get(target, key, receiver);
814 if (isSymbol(key) ? builtInSymbols.has(key) : isNonTrackableKeys(key)) {
815 return res;
816 }
817 if (!isReadonly) {
818 track(target, "get" /* TrackOpTypes.GET */, key);
819 }
820 if (shallow) {
821 return res;
822 }
823 if (isRef(res)) {
824 // ref unwrapping - skip unwrap for Array + integer key.
825 return targetIsArray && isIntegerKey(key) ? res : res.value;
826 }
827 if (isObject(res)) {
828 // Convert returned value into a proxy as well. we do the isObject check
829 // here to avoid invalid value warning. Also need to lazy access readonly
830 // and reactive here to avoid circular dependency.
831 return isReadonly ? readonly(res) : reactive(res);
832 }
833 return res;
834 };
835}
836const set = /*#__PURE__*/ createSetter();
837const shallowSet = /*#__PURE__*/ createSetter(true);
838function createSetter(shallow = false) {
839 return function set(target, key, value, receiver) {
840 let oldValue = target[key];
841 if (isReadonly(oldValue) && isRef(oldValue) && !isRef(value)) {
842 return false;
843 }
844 if (!shallow) {
845 if (!isShallow(value) && !isReadonly(value)) {
846 oldValue = toRaw(oldValue);
847 value = toRaw(value);
848 }
849 if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
850 oldValue.value = value;
851 return true;
852 }
853 }
854 const hadKey = isArray(target) && isIntegerKey(key)
855 ? Number(key) < target.length
856 : hasOwn(target, key);
857 const result = Reflect.set(target, key, value, receiver);
858 // don't trigger if target is something up in the prototype chain of original
859 if (target === toRaw(receiver)) {
860 if (!hadKey) {
861 trigger(target, "add" /* TriggerOpTypes.ADD */, key, value);
862 }
863 else if (hasChanged(value, oldValue)) {
864 trigger(target, "set" /* TriggerOpTypes.SET */, key, value, oldValue);
865 }
866 }
867 return result;
868 };
869}
870function deleteProperty(target, key) {
871 const hadKey = hasOwn(target, key);
872 const oldValue = target[key];
873 const result = Reflect.deleteProperty(target, key);
874 if (result && hadKey) {
875 trigger(target, "delete" /* TriggerOpTypes.DELETE */, key, undefined, oldValue);
876 }
877 return result;
878}
879function has(target, key) {
880 const result = Reflect.has(target, key);
881 if (!isSymbol(key) || !builtInSymbols.has(key)) {
882 track(target, "has" /* TrackOpTypes.HAS */, key);
883 }
884 return result;
885}
886function ownKeys(target) {
887 track(target, "iterate" /* TrackOpTypes.ITERATE */, isArray(target) ? 'length' : ITERATE_KEY);
888 return Reflect.ownKeys(target);
889}
890const mutableHandlers = {
891 get,
892 set,
893 deleteProperty,
894 has,
895 ownKeys
896};
897const readonlyHandlers = {
898 get: readonlyGet,
899 set(target, key) {
900 {
901 warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
902 }
903 return true;
904 },
905 deleteProperty(target, key) {
906 {
907 warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
908 }
909 return true;
910 }
911};
912const shallowReactiveHandlers = /*#__PURE__*/ extend({}, mutableHandlers, {
913 get: shallowGet,
914 set: shallowSet
915});
916// Props handlers are special in the sense that it should not unwrap top-level
917// refs (in order to allow refs to be explicitly passed down), but should
918// retain the reactivity of the normal readonly object.
919const shallowReadonlyHandlers = /*#__PURE__*/ extend({}, readonlyHandlers, {
920 get: shallowReadonlyGet
921});
922
923const toShallow = (value) => value;
924const getProto = (v) => Reflect.getPrototypeOf(v);
925function get$1(target, key, isReadonly = false, isShallow = false) {
926 // #1772: readonly(reactive(Map)) should return readonly + reactive version
927 // of the value
928 target = target["__v_raw" /* ReactiveFlags.RAW */];
929 const rawTarget = toRaw(target);
930 const rawKey = toRaw(key);
931 if (!isReadonly) {
932 if (key !== rawKey) {
933 track(rawTarget, "get" /* TrackOpTypes.GET */, key);
934 }
935 track(rawTarget, "get" /* TrackOpTypes.GET */, rawKey);
936 }
937 const { has } = getProto(rawTarget);
938 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
939 if (has.call(rawTarget, key)) {
940 return wrap(target.get(key));
941 }
942 else if (has.call(rawTarget, rawKey)) {
943 return wrap(target.get(rawKey));
944 }
945 else if (target !== rawTarget) {
946 // #3602 readonly(reactive(Map))
947 // ensure that the nested reactive `Map` can do tracking for itself
948 target.get(key);
949 }
950}
951function has$1(key, isReadonly = false) {
952 const target = this["__v_raw" /* ReactiveFlags.RAW */];
953 const rawTarget = toRaw(target);
954 const rawKey = toRaw(key);
955 if (!isReadonly) {
956 if (key !== rawKey) {
957 track(rawTarget, "has" /* TrackOpTypes.HAS */, key);
958 }
959 track(rawTarget, "has" /* TrackOpTypes.HAS */, rawKey);
960 }
961 return key === rawKey
962 ? target.has(key)
963 : target.has(key) || target.has(rawKey);
964}
965function size(target, isReadonly = false) {
966 target = target["__v_raw" /* ReactiveFlags.RAW */];
967 !isReadonly && track(toRaw(target), "iterate" /* TrackOpTypes.ITERATE */, ITERATE_KEY);
968 return Reflect.get(target, 'size', target);
969}
970function add(value) {
971 value = toRaw(value);
972 const target = toRaw(this);
973 const proto = getProto(target);
974 const hadKey = proto.has.call(target, value);
975 if (!hadKey) {
976 target.add(value);
977 trigger(target, "add" /* TriggerOpTypes.ADD */, value, value);
978 }
979 return this;
980}
981function set$1(key, value) {
982 value = toRaw(value);
983 const target = toRaw(this);
984 const { has, get } = getProto(target);
985 let hadKey = has.call(target, key);
986 if (!hadKey) {
987 key = toRaw(key);
988 hadKey = has.call(target, key);
989 }
990 else {
991 checkIdentityKeys(target, has, key);
992 }
993 const oldValue = get.call(target, key);
994 target.set(key, value);
995 if (!hadKey) {
996 trigger(target, "add" /* TriggerOpTypes.ADD */, key, value);
997 }
998 else if (hasChanged(value, oldValue)) {
999 trigger(target, "set" /* TriggerOpTypes.SET */, key, value, oldValue);
1000 }
1001 return this;
1002}
1003function deleteEntry(key) {
1004 const target = toRaw(this);
1005 const { has, get } = getProto(target);
1006 let hadKey = has.call(target, key);
1007 if (!hadKey) {
1008 key = toRaw(key);
1009 hadKey = has.call(target, key);
1010 }
1011 else {
1012 checkIdentityKeys(target, has, key);
1013 }
1014 const oldValue = get ? get.call(target, key) : undefined;
1015 // forward the operation before queueing reactions
1016 const result = target.delete(key);
1017 if (hadKey) {
1018 trigger(target, "delete" /* TriggerOpTypes.DELETE */, key, undefined, oldValue);
1019 }
1020 return result;
1021}
1022function clear() {
1023 const target = toRaw(this);
1024 const hadItems = target.size !== 0;
1025 const oldTarget = isMap(target)
1026 ? new Map(target)
1027 : new Set(target)
1028 ;
1029 // forward the operation before queueing reactions
1030 const result = target.clear();
1031 if (hadItems) {
1032 trigger(target, "clear" /* TriggerOpTypes.CLEAR */, undefined, undefined, oldTarget);
1033 }
1034 return result;
1035}
1036function createForEach(isReadonly, isShallow) {
1037 return function forEach(callback, thisArg) {
1038 const observed = this;
1039 const target = observed["__v_raw" /* ReactiveFlags.RAW */];
1040 const rawTarget = toRaw(target);
1041 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
1042 !isReadonly && track(rawTarget, "iterate" /* TrackOpTypes.ITERATE */, ITERATE_KEY);
1043 return target.forEach((value, key) => {
1044 // important: make sure the callback is
1045 // 1. invoked with the reactive map as `this` and 3rd arg
1046 // 2. the value received should be a corresponding reactive/readonly.
1047 return callback.call(thisArg, wrap(value), wrap(key), observed);
1048 });
1049 };
1050}
1051function createIterableMethod(method, isReadonly, isShallow) {
1052 return function (...args) {
1053 const target = this["__v_raw" /* ReactiveFlags.RAW */];
1054 const rawTarget = toRaw(target);
1055 const targetIsMap = isMap(rawTarget);
1056 const isPair = method === 'entries' || (method === Symbol.iterator && targetIsMap);
1057 const isKeyOnly = method === 'keys' && targetIsMap;
1058 const innerIterator = target[method](...args);
1059 const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive;
1060 !isReadonly &&
1061 track(rawTarget, "iterate" /* TrackOpTypes.ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY);
1062 // return a wrapped iterator which returns observed versions of the
1063 // values emitted from the real iterator
1064 return {
1065 // iterator protocol
1066 next() {
1067 const { value, done } = innerIterator.next();
1068 return done
1069 ? { value, done }
1070 : {
1071 value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value),
1072 done
1073 };
1074 },
1075 // iterable protocol
1076 [Symbol.iterator]() {
1077 return this;
1078 }
1079 };
1080 };
1081}
1082function createReadonlyMethod(type) {
1083 return function (...args) {
1084 {
1085 const key = args[0] ? `on key "${args[0]}" ` : ``;
1086 console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this));
1087 }
1088 return type === "delete" /* TriggerOpTypes.DELETE */ ? false : this;
1089 };
1090}
1091function createInstrumentations() {
1092 const mutableInstrumentations = {
1093 get(key) {
1094 return get$1(this, key);
1095 },
1096 get size() {
1097 return size(this);
1098 },
1099 has: has$1,
1100 add,
1101 set: set$1,
1102 delete: deleteEntry,
1103 clear,
1104 forEach: createForEach(false, false)
1105 };
1106 const shallowInstrumentations = {
1107 get(key) {
1108 return get$1(this, key, false, true);
1109 },
1110 get size() {
1111 return size(this);
1112 },
1113 has: has$1,
1114 add,
1115 set: set$1,
1116 delete: deleteEntry,
1117 clear,
1118 forEach: createForEach(false, true)
1119 };
1120 const readonlyInstrumentations = {
1121 get(key) {
1122 return get$1(this, key, true);
1123 },
1124 get size() {
1125 return size(this, true);
1126 },
1127 has(key) {
1128 return has$1.call(this, key, true);
1129 },
1130 add: createReadonlyMethod("add" /* TriggerOpTypes.ADD */),
1131 set: createReadonlyMethod("set" /* TriggerOpTypes.SET */),
1132 delete: createReadonlyMethod("delete" /* TriggerOpTypes.DELETE */),
1133 clear: createReadonlyMethod("clear" /* TriggerOpTypes.CLEAR */),
1134 forEach: createForEach(true, false)
1135 };
1136 const shallowReadonlyInstrumentations = {
1137 get(key) {
1138 return get$1(this, key, true, true);
1139 },
1140 get size() {
1141 return size(this, true);
1142 },
1143 has(key) {
1144 return has$1.call(this, key, true);
1145 },
1146 add: createReadonlyMethod("add" /* TriggerOpTypes.ADD */),
1147 set: createReadonlyMethod("set" /* TriggerOpTypes.SET */),
1148 delete: createReadonlyMethod("delete" /* TriggerOpTypes.DELETE */),
1149 clear: createReadonlyMethod("clear" /* TriggerOpTypes.CLEAR */),
1150 forEach: createForEach(true, true)
1151 };
1152 const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator];
1153 iteratorMethods.forEach(method => {
1154 mutableInstrumentations[method] = createIterableMethod(method, false, false);
1155 readonlyInstrumentations[method] = createIterableMethod(method, true, false);
1156 shallowInstrumentations[method] = createIterableMethod(method, false, true);
1157 shallowReadonlyInstrumentations[method] = createIterableMethod(method, true, true);
1158 });
1159 return [
1160 mutableInstrumentations,
1161 readonlyInstrumentations,
1162 shallowInstrumentations,
1163 shallowReadonlyInstrumentations
1164 ];
1165}
1166const [mutableInstrumentations, readonlyInstrumentations, shallowInstrumentations, shallowReadonlyInstrumentations] = /* #__PURE__*/ createInstrumentations();
1167function createInstrumentationGetter(isReadonly, shallow) {
1168 const instrumentations = shallow
1169 ? isReadonly
1170 ? shallowReadonlyInstrumentations
1171 : shallowInstrumentations
1172 : isReadonly
1173 ? readonlyInstrumentations
1174 : mutableInstrumentations;
1175 return (target, key, receiver) => {
1176 if (key === "__v_isReactive" /* ReactiveFlags.IS_REACTIVE */) {
1177 return !isReadonly;
1178 }
1179 else if (key === "__v_isReadonly" /* ReactiveFlags.IS_READONLY */) {
1180 return isReadonly;
1181 }
1182 else if (key === "__v_raw" /* ReactiveFlags.RAW */) {
1183 return target;
1184 }
1185 return Reflect.get(hasOwn(instrumentations, key) && key in target
1186 ? instrumentations
1187 : target, key, receiver);
1188 };
1189}
1190const mutableCollectionHandlers = {
1191 get: /*#__PURE__*/ createInstrumentationGetter(false, false)
1192};
1193const shallowCollectionHandlers = {
1194 get: /*#__PURE__*/ createInstrumentationGetter(false, true)
1195};
1196const readonlyCollectionHandlers = {
1197 get: /*#__PURE__*/ createInstrumentationGetter(true, false)
1198};
1199const shallowReadonlyCollectionHandlers = {
1200 get: /*#__PURE__*/ createInstrumentationGetter(true, true)
1201};
1202function checkIdentityKeys(target, has, key) {
1203 const rawKey = toRaw(key);
1204 if (rawKey !== key && has.call(target, rawKey)) {
1205 const type = toRawType(target);
1206 console.warn(`Reactive ${type} contains both the raw and reactive ` +
1207 `versions of the same object${type === `Map` ? ` as keys` : ``}, ` +
1208 `which can lead to inconsistencies. ` +
1209 `Avoid differentiating between the raw and reactive versions ` +
1210 `of an object and only use the reactive version if possible.`);
1211 }
1212}
1213
1214const reactiveMap = new WeakMap();
1215const shallowReactiveMap = new WeakMap();
1216const readonlyMap = new WeakMap();
1217const shallowReadonlyMap = new WeakMap();
1218function targetTypeMap(rawType) {
1219 switch (rawType) {
1220 case 'Object':
1221 case 'Array':
1222 return 1 /* TargetType.COMMON */;
1223 case 'Map':
1224 case 'Set':
1225 case 'WeakMap':
1226 case 'WeakSet':
1227 return 2 /* TargetType.COLLECTION */;
1228 default:
1229 return 0 /* TargetType.INVALID */;
1230 }
1231}
1232function getTargetType(value) {
1233 return value["__v_skip" /* ReactiveFlags.SKIP */] || !Object.isExtensible(value)
1234 ? 0 /* TargetType.INVALID */
1235 : targetTypeMap(toRawType(value));
1236}
1237function reactive(target) {
1238 // if trying to observe a readonly proxy, return the readonly version.
1239 if (isReadonly(target)) {
1240 return target;
1241 }
1242 return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers, reactiveMap);
1243}
1244/**
1245 * Return a shallowly-reactive copy of the original object, where only the root
1246 * level properties are reactive. It also does not auto-unwrap refs (even at the
1247 * root level).
1248 */
1249function shallowReactive(target) {
1250 return createReactiveObject(target, false, shallowReactiveHandlers, shallowCollectionHandlers, shallowReactiveMap);
1251}
1252/**
1253 * Creates a readonly copy of the original object. Note the returned copy is not
1254 * made reactive, but `readonly` can be called on an already reactive object.
1255 */
1256function readonly(target) {
1257 return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers, readonlyMap);
1258}
1259/**
1260 * Returns a reactive-copy of the original object, where only the root level
1261 * properties are readonly, and does NOT unwrap refs nor recursively convert
1262 * returned properties.
1263 * This is used for creating the props proxy object for stateful components.
1264 */
1265function shallowReadonly(target) {
1266 return createReactiveObject(target, true, shallowReadonlyHandlers, shallowReadonlyCollectionHandlers, shallowReadonlyMap);
1267}
1268function createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers, proxyMap) {
1269 if (!isObject(target)) {
1270 {
1271 console.warn(`value cannot be made reactive: ${String(target)}`);
1272 }
1273 return target;
1274 }
1275 // target is already a Proxy, return it.
1276 // exception: calling readonly() on a reactive object
1277 if (target["__v_raw" /* ReactiveFlags.RAW */] &&
1278 !(isReadonly && target["__v_isReactive" /* ReactiveFlags.IS_REACTIVE */])) {
1279 return target;
1280 }
1281 // target already has corresponding Proxy
1282 const existingProxy = proxyMap.get(target);
1283 if (existingProxy) {
1284 return existingProxy;
1285 }
1286 // only specific value types can be observed.
1287 const targetType = getTargetType(target);
1288 if (targetType === 0 /* TargetType.INVALID */) {
1289 return target;
1290 }
1291 const proxy = new Proxy(target, targetType === 2 /* TargetType.COLLECTION */ ? collectionHandlers : baseHandlers);
1292 proxyMap.set(target, proxy);
1293 return proxy;
1294}
1295function isReactive(value) {
1296 if (isReadonly(value)) {
1297 return isReactive(value["__v_raw" /* ReactiveFlags.RAW */]);
1298 }
1299 return !!(value && value["__v_isReactive" /* ReactiveFlags.IS_REACTIVE */]);
1300}
1301function isReadonly(value) {
1302 return !!(value && value["__v_isReadonly" /* ReactiveFlags.IS_READONLY */]);
1303}
1304function isShallow(value) {
1305 return !!(value && value["__v_isShallow" /* ReactiveFlags.IS_SHALLOW */]);
1306}
1307function isProxy(value) {
1308 return isReactive(value) || isReadonly(value);
1309}
1310function toRaw(observed) {
1311 const raw = observed && observed["__v_raw" /* ReactiveFlags.RAW */];
1312 return raw ? toRaw(raw) : observed;
1313}
1314function markRaw(value) {
1315 def(value, "__v_skip" /* ReactiveFlags.SKIP */, true);
1316 return value;
1317}
1318const toReactive = (value) => isObject(value) ? reactive(value) : value;
1319const toReadonly = (value) => isObject(value) ? readonly(value) : value;
1320
1321function trackRefValue(ref) {
1322 if (shouldTrack && activeEffect) {
1323 ref = toRaw(ref);
1324 {
1325 trackEffects(ref.dep || (ref.dep = createDep()), {
1326 target: ref,
1327 type: "get" /* TrackOpTypes.GET */,
1328 key: 'value'
1329 });
1330 }
1331 }
1332}
1333function triggerRefValue(ref, newVal) {
1334 ref = toRaw(ref);
1335 if (ref.dep) {
1336 {
1337 triggerEffects(ref.dep, {
1338 target: ref,
1339 type: "set" /* TriggerOpTypes.SET */,
1340 key: 'value',
1341 newValue: newVal
1342 });
1343 }
1344 }
1345}
1346function isRef(r) {
1347 return !!(r && r.__v_isRef === true);
1348}
1349function ref(value) {
1350 return createRef(value, false);
1351}
1352function shallowRef(value) {
1353 return createRef(value, true);
1354}
1355function createRef(rawValue, shallow) {
1356 if (isRef(rawValue)) {
1357 return rawValue;
1358 }
1359 return new RefImpl(rawValue, shallow);
1360}
1361class RefImpl {
1362 constructor(value, __v_isShallow) {
1363 this.__v_isShallow = __v_isShallow;
1364 this.dep = undefined;
1365 this.__v_isRef = true;
1366 this._rawValue = __v_isShallow ? value : toRaw(value);
1367 this._value = __v_isShallow ? value : toReactive(value);
1368 }
1369 get value() {
1370 trackRefValue(this);
1371 return this._value;
1372 }
1373 set value(newVal) {
1374 const useDirectValue = this.__v_isShallow || isShallow(newVal) || isReadonly(newVal);
1375 newVal = useDirectValue ? newVal : toRaw(newVal);
1376 if (hasChanged(newVal, this._rawValue)) {
1377 this._rawValue = newVal;
1378 this._value = useDirectValue ? newVal : toReactive(newVal);
1379 triggerRefValue(this, newVal);
1380 }
1381 }
1382}
1383function triggerRef(ref) {
1384 triggerRefValue(ref, ref.value );
1385}
1386function unref(ref) {
1387 return isRef(ref) ? ref.value : ref;
1388}
1389const shallowUnwrapHandlers = {
1390 get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
1391 set: (target, key, value, receiver) => {
1392 const oldValue = target[key];
1393 if (isRef(oldValue) && !isRef(value)) {
1394 oldValue.value = value;
1395 return true;
1396 }
1397 else {
1398 return Reflect.set(target, key, value, receiver);
1399 }
1400 }
1401};
1402function proxyRefs(objectWithRefs) {
1403 return isReactive(objectWithRefs)
1404 ? objectWithRefs
1405 : new Proxy(objectWithRefs, shallowUnwrapHandlers);
1406}
1407class CustomRefImpl {
1408 constructor(factory) {
1409 this.dep = undefined;
1410 this.__v_isRef = true;
1411 const { get, set } = factory(() => trackRefValue(this), () => triggerRefValue(this));
1412 this._get = get;
1413 this._set = set;
1414 }
1415 get value() {
1416 return this._get();
1417 }
1418 set value(newVal) {
1419 this._set(newVal);
1420 }
1421}
1422function customRef(factory) {
1423 return new CustomRefImpl(factory);
1424}
1425function toRefs(object) {
1426 if (!isProxy(object)) {
1427 console.warn(`toRefs() expects a reactive object but received a plain one.`);
1428 }
1429 const ret = isArray(object) ? new Array(object.length) : {};
1430 for (const key in object) {
1431 ret[key] = toRef(object, key);
1432 }
1433 return ret;
1434}
1435class ObjectRefImpl {
1436 constructor(_object, _key, _defaultValue) {
1437 this._object = _object;
1438 this._key = _key;
1439 this._defaultValue = _defaultValue;
1440 this.__v_isRef = true;
1441 }
1442 get value() {
1443 const val = this._object[this._key];
1444 return val === undefined ? this._defaultValue : val;
1445 }
1446 set value(newVal) {
1447 this._object[this._key] = newVal;
1448 }
1449}
1450function toRef(object, key, defaultValue) {
1451 const val = object[key];
1452 return isRef(val)
1453 ? val
1454 : new ObjectRefImpl(object, key, defaultValue);
1455}
1456
1457var _a;
1458class ComputedRefImpl {
1459 constructor(getter, _setter, isReadonly, isSSR) {
1460 this._setter = _setter;
1461 this.dep = undefined;
1462 this.__v_isRef = true;
1463 this[_a] = false;
1464 this._dirty = true;
1465 this.effect = new ReactiveEffect(getter, () => {
1466 if (!this._dirty) {
1467 this._dirty = true;
1468 triggerRefValue(this);
1469 }
1470 });
1471 this.effect.computed = this;
1472 this.effect.active = this._cacheable = !isSSR;
1473 this["__v_isReadonly" /* ReactiveFlags.IS_READONLY */] = isReadonly;
1474 }
1475 get value() {
1476 // the computed ref may get wrapped by other proxies e.g. readonly() #3376
1477 const self = toRaw(this);
1478 trackRefValue(self);
1479 if (self._dirty || !self._cacheable) {
1480 self._dirty = false;
1481 self._value = self.effect.run();
1482 }
1483 return self._value;
1484 }
1485 set value(newValue) {
1486 this._setter(newValue);
1487 }
1488}
1489_a = "__v_isReadonly" /* ReactiveFlags.IS_READONLY */;
1490function computed(getterOrOptions, debugOptions, isSSR = false) {
1491 let getter;
1492 let setter;
1493 const onlyGetter = isFunction(getterOrOptions);
1494 if (onlyGetter) {
1495 getter = getterOrOptions;
1496 setter = () => {
1497 console.warn('Write operation failed: computed value is readonly');
1498 }
1499 ;
1500 }
1501 else {
1502 getter = getterOrOptions.get;
1503 setter = getterOrOptions.set;
1504 }
1505 const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter, isSSR);
1506 if (debugOptions && !isSSR) {
1507 cRef.effect.onTrack = debugOptions.onTrack;
1508 cRef.effect.onTrigger = debugOptions.onTrigger;
1509 }
1510 return cRef;
1511}
1512
1513const stack = [];
1514function pushWarningContext(vnode) {
1515 stack.push(vnode);
1516}
1517function popWarningContext() {
1518 stack.pop();
1519}
1520function warn$1(msg, ...args) {
1521 // avoid props formatting or warn handler tracking deps that might be mutated
1522 // during patch, leading to infinite recursion.
1523 pauseTracking();
1524 const instance = stack.length ? stack[stack.length - 1].component : null;
1525 const appWarnHandler = instance && instance.appContext.config.warnHandler;
1526 const trace = getComponentTrace();
1527 if (appWarnHandler) {
1528 callWithErrorHandling(appWarnHandler, instance, 11 /* ErrorCodes.APP_WARN_HANDLER */, [
1529 msg + args.join(''),
1530 instance && instance.proxy,
1531 trace
1532 .map(({ vnode }) => `at <${formatComponentName(instance, vnode.type)}>`)
1533 .join('\n'),
1534 trace
1535 ]);
1536 }
1537 else {
1538 const warnArgs = [`[Vue warn]: ${msg}`, ...args];
1539 /* istanbul ignore if */
1540 if (trace.length &&
1541 // avoid spamming console during tests
1542 !false) {
1543 warnArgs.push(`\n`, ...formatTrace(trace));
1544 }
1545 console.warn(...warnArgs);
1546 }
1547 resetTracking();
1548}
1549function getComponentTrace() {
1550 let currentVNode = stack[stack.length - 1];
1551 if (!currentVNode) {
1552 return [];
1553 }
1554 // we can't just use the stack because it will be incomplete during updates
1555 // that did not start from the root. Re-construct the parent chain using
1556 // instance parent pointers.
1557 const normalizedStack = [];
1558 while (currentVNode) {
1559 const last = normalizedStack[0];
1560 if (last && last.vnode === currentVNode) {
1561 last.recurseCount++;
1562 }
1563 else {
1564 normalizedStack.push({
1565 vnode: currentVNode,
1566 recurseCount: 0
1567 });
1568 }
1569 const parentInstance = currentVNode.component && currentVNode.component.parent;
1570 currentVNode = parentInstance && parentInstance.vnode;
1571 }
1572 return normalizedStack;
1573}
1574/* istanbul ignore next */
1575function formatTrace(trace) {
1576 const logs = [];
1577 trace.forEach((entry, i) => {
1578 logs.push(...(i === 0 ? [] : [`\n`]), ...formatTraceEntry(entry));
1579 });
1580 return logs;
1581}
1582function formatTraceEntry({ vnode, recurseCount }) {
1583 const postfix = recurseCount > 0 ? `... (${recurseCount} recursive calls)` : ``;
1584 const isRoot = vnode.component ? vnode.component.parent == null : false;
1585 const open = ` at <${formatComponentName(vnode.component, vnode.type, isRoot)}`;
1586 const close = `>` + postfix;
1587 return vnode.props
1588 ? [open, ...formatProps(vnode.props), close]
1589 : [open + close];
1590}
1591/* istanbul ignore next */
1592function formatProps(props) {
1593 const res = [];
1594 const keys = Object.keys(props);
1595 keys.slice(0, 3).forEach(key => {
1596 res.push(...formatProp(key, props[key]));
1597 });
1598 if (keys.length > 3) {
1599 res.push(` ...`);
1600 }
1601 return res;
1602}
1603/* istanbul ignore next */
1604function formatProp(key, value, raw) {
1605 if (isString(value)) {
1606 value = JSON.stringify(value);
1607 return raw ? value : [`${key}=${value}`];
1608 }
1609 else if (typeof value === 'number' ||
1610 typeof value === 'boolean' ||
1611 value == null) {
1612 return raw ? value : [`${key}=${value}`];
1613 }
1614 else if (isRef(value)) {
1615 value = formatProp(key, toRaw(value.value), true);
1616 return raw ? value : [`${key}=Ref<`, value, `>`];
1617 }
1618 else if (isFunction(value)) {
1619 return [`${key}=fn${value.name ? `<${value.name}>` : ``}`];
1620 }
1621 else {
1622 value = toRaw(value);
1623 return raw ? value : [`${key}=`, value];
1624 }
1625}
1626
1627const ErrorTypeStrings = {
1628 ["sp" /* LifecycleHooks.SERVER_PREFETCH */]: 'serverPrefetch hook',
1629 ["bc" /* LifecycleHooks.BEFORE_CREATE */]: 'beforeCreate hook',
1630 ["c" /* LifecycleHooks.CREATED */]: 'created hook',
1631 ["bm" /* LifecycleHooks.BEFORE_MOUNT */]: 'beforeMount hook',
1632 ["m" /* LifecycleHooks.MOUNTED */]: 'mounted hook',
1633 ["bu" /* LifecycleHooks.BEFORE_UPDATE */]: 'beforeUpdate hook',
1634 ["u" /* LifecycleHooks.UPDATED */]: 'updated',
1635 ["bum" /* LifecycleHooks.BEFORE_UNMOUNT */]: 'beforeUnmount hook',
1636 ["um" /* LifecycleHooks.UNMOUNTED */]: 'unmounted hook',
1637 ["a" /* LifecycleHooks.ACTIVATED */]: 'activated hook',
1638 ["da" /* LifecycleHooks.DEACTIVATED */]: 'deactivated hook',
1639 ["ec" /* LifecycleHooks.ERROR_CAPTURED */]: 'errorCaptured hook',
1640 ["rtc" /* LifecycleHooks.RENDER_TRACKED */]: 'renderTracked hook',
1641 ["rtg" /* LifecycleHooks.RENDER_TRIGGERED */]: 'renderTriggered hook',
1642 [0 /* ErrorCodes.SETUP_FUNCTION */]: 'setup function',
1643 [1 /* ErrorCodes.RENDER_FUNCTION */]: 'render function',
1644 [2 /* ErrorCodes.WATCH_GETTER */]: 'watcher getter',
1645 [3 /* ErrorCodes.WATCH_CALLBACK */]: 'watcher callback',
1646 [4 /* ErrorCodes.WATCH_CLEANUP */]: 'watcher cleanup function',
1647 [5 /* ErrorCodes.NATIVE_EVENT_HANDLER */]: 'native event handler',
1648 [6 /* ErrorCodes.COMPONENT_EVENT_HANDLER */]: 'component event handler',
1649 [7 /* ErrorCodes.VNODE_HOOK */]: 'vnode hook',
1650 [8 /* ErrorCodes.DIRECTIVE_HOOK */]: 'directive hook',
1651 [9 /* ErrorCodes.TRANSITION_HOOK */]: 'transition hook',
1652 [10 /* ErrorCodes.APP_ERROR_HANDLER */]: 'app errorHandler',
1653 [11 /* ErrorCodes.APP_WARN_HANDLER */]: 'app warnHandler',
1654 [12 /* ErrorCodes.FUNCTION_REF */]: 'ref function',
1655 [13 /* ErrorCodes.ASYNC_COMPONENT_LOADER */]: 'async component loader',
1656 [14 /* ErrorCodes.SCHEDULER */]: 'scheduler flush. This is likely a Vue internals bug. ' +
1657 'Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/core'
1658};
1659function callWithErrorHandling(fn, instance, type, args) {
1660 let res;
1661 try {
1662 res = args ? fn(...args) : fn();
1663 }
1664 catch (err) {
1665 handleError(err, instance, type);
1666 }
1667 return res;
1668}
1669function callWithAsyncErrorHandling(fn, instance, type, args) {
1670 if (isFunction(fn)) {
1671 const res = callWithErrorHandling(fn, instance, type, args);
1672 if (res && isPromise(res)) {
1673 res.catch(err => {
1674 handleError(err, instance, type);
1675 });
1676 }
1677 return res;
1678 }
1679 const values = [];
1680 for (let i = 0; i < fn.length; i++) {
1681 values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
1682 }
1683 return values;
1684}
1685function handleError(err, instance, type, throwInDev = true) {
1686 const contextVNode = instance ? instance.vnode : null;
1687 if (instance) {
1688 let cur = instance.parent;
1689 // the exposed instance is the render proxy to keep it consistent with 2.x
1690 const exposedInstance = instance.proxy;
1691 // in production the hook receives only the error code
1692 const errorInfo = ErrorTypeStrings[type] ;
1693 while (cur) {
1694 const errorCapturedHooks = cur.ec;
1695 if (errorCapturedHooks) {
1696 for (let i = 0; i < errorCapturedHooks.length; i++) {
1697 if (errorCapturedHooks[i](err, exposedInstance, errorInfo) === false) {
1698 return;
1699 }
1700 }
1701 }
1702 cur = cur.parent;
1703 }
1704 // app-level handling
1705 const appErrorHandler = instance.appContext.config.errorHandler;
1706 if (appErrorHandler) {
1707 callWithErrorHandling(appErrorHandler, null, 10 /* ErrorCodes.APP_ERROR_HANDLER */, [err, exposedInstance, errorInfo]);
1708 return;
1709 }
1710 }
1711 logError(err, type, contextVNode, throwInDev);
1712}
1713function logError(err, type, contextVNode, throwInDev = true) {
1714 {
1715 const info = ErrorTypeStrings[type];
1716 if (contextVNode) {
1717 pushWarningContext(contextVNode);
1718 }
1719 warn$1(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
1720 if (contextVNode) {
1721 popWarningContext();
1722 }
1723 // crash in dev by default so it's more noticeable
1724 if (throwInDev) {
1725 throw err;
1726 }
1727 else {
1728 console.error(err);
1729 }
1730 }
1731}
1732
1733let isFlushing = false;
1734let isFlushPending = false;
1735const queue = [];
1736let flushIndex = 0;
1737const pendingPostFlushCbs = [];
1738let activePostFlushCbs = null;
1739let postFlushIndex = 0;
1740const resolvedPromise = /*#__PURE__*/ Promise.resolve();
1741let currentFlushPromise = null;
1742const RECURSION_LIMIT = 100;
1743function nextTick(fn) {
1744 const p = currentFlushPromise || resolvedPromise;
1745 return fn ? p.then(this ? fn.bind(this) : fn) : p;
1746}
1747// #2768
1748// Use binary-search to find a suitable position in the queue,
1749// so that the queue maintains the increasing order of job's id,
1750// which can prevent the job from being skipped and also can avoid repeated patching.
1751function findInsertionIndex(id) {
1752 // the start index should be `flushIndex + 1`
1753 let start = flushIndex + 1;
1754 let end = queue.length;
1755 while (start < end) {
1756 const middle = (start + end) >>> 1;
1757 const middleJobId = getId(queue[middle]);
1758 middleJobId < id ? (start = middle + 1) : (end = middle);
1759 }
1760 return start;
1761}
1762function queueJob(job) {
1763 // the dedupe search uses the startIndex argument of Array.includes()
1764 // by default the search index includes the current job that is being run
1765 // so it cannot recursively trigger itself again.
1766 // if the job is a watch() callback, the search will start with a +1 index to
1767 // allow it recursively trigger itself - it is the user's responsibility to
1768 // ensure it doesn't end up in an infinite loop.
1769 if (!queue.length ||
1770 !queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)) {
1771 if (job.id == null) {
1772 queue.push(job);
1773 }
1774 else {
1775 queue.splice(findInsertionIndex(job.id), 0, job);
1776 }
1777 queueFlush();
1778 }
1779}
1780function queueFlush() {
1781 if (!isFlushing && !isFlushPending) {
1782 isFlushPending = true;
1783 currentFlushPromise = resolvedPromise.then(flushJobs);
1784 }
1785}
1786function invalidateJob(job) {
1787 const i = queue.indexOf(job);
1788 if (i > flushIndex) {
1789 queue.splice(i, 1);
1790 }
1791}
1792function queuePostFlushCb(cb) {
1793 if (!isArray(cb)) {
1794 if (!activePostFlushCbs ||
1795 !activePostFlushCbs.includes(cb, cb.allowRecurse ? postFlushIndex + 1 : postFlushIndex)) {
1796 pendingPostFlushCbs.push(cb);
1797 }
1798 }
1799 else {
1800 // if cb is an array, it is a component lifecycle hook which can only be
1801 // triggered by a job, which is already deduped in the main queue, so
1802 // we can skip duplicate check here to improve perf
1803 pendingPostFlushCbs.push(...cb);
1804 }
1805 queueFlush();
1806}
1807function flushPreFlushCbs(seen,
1808// if currently flushing, skip the current job itself
1809i = isFlushing ? flushIndex + 1 : 0) {
1810 {
1811 seen = seen || new Map();
1812 }
1813 for (; i < queue.length; i++) {
1814 const cb = queue[i];
1815 if (cb && cb.pre) {
1816 if (checkRecursiveUpdates(seen, cb)) {
1817 continue;
1818 }
1819 queue.splice(i, 1);
1820 i--;
1821 cb();
1822 }
1823 }
1824}
1825function flushPostFlushCbs(seen) {
1826 if (pendingPostFlushCbs.length) {
1827 const deduped = [...new Set(pendingPostFlushCbs)];
1828 pendingPostFlushCbs.length = 0;
1829 // #1947 already has active queue, nested flushPostFlushCbs call
1830 if (activePostFlushCbs) {
1831 activePostFlushCbs.push(...deduped);
1832 return;
1833 }
1834 activePostFlushCbs = deduped;
1835 {
1836 seen = seen || new Map();
1837 }
1838 activePostFlushCbs.sort((a, b) => getId(a) - getId(b));
1839 for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
1840 if (checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex])) {
1841 continue;
1842 }
1843 activePostFlushCbs[postFlushIndex]();
1844 }
1845 activePostFlushCbs = null;
1846 postFlushIndex = 0;
1847 }
1848}
1849const getId = (job) => job.id == null ? Infinity : job.id;
1850const comparator = (a, b) => {
1851 const diff = getId(a) - getId(b);
1852 if (diff === 0) {
1853 if (a.pre && !b.pre)
1854 return -1;
1855 if (b.pre && !a.pre)
1856 return 1;
1857 }
1858 return diff;
1859};
1860function flushJobs(seen) {
1861 isFlushPending = false;
1862 isFlushing = true;
1863 {
1864 seen = seen || new Map();
1865 }
1866 // Sort queue before flush.
1867 // This ensures that:
1868 // 1. Components are updated from parent to child. (because parent is always
1869 // created before the child so its render effect will have smaller
1870 // priority number)
1871 // 2. If a component is unmounted during a parent component's update,
1872 // its update can be skipped.
1873 queue.sort(comparator);
1874 // conditional usage of checkRecursiveUpdate must be determined out of
1875 // try ... catch block since Rollup by default de-optimizes treeshaking
1876 // inside try-catch. This can leave all warning code unshaked. Although
1877 // they would get eventually shaken by a minifier like terser, some minifiers
1878 // would fail to do that (e.g. https://github.com/evanw/esbuild/issues/1610)
1879 const check = (job) => checkRecursiveUpdates(seen, job)
1880 ;
1881 try {
1882 for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
1883 const job = queue[flushIndex];
1884 if (job && job.active !== false) {
1885 if (true && check(job)) {
1886 continue;
1887 }
1888 // console.log(`running:`, job.id)
1889 callWithErrorHandling(job, null, 14 /* ErrorCodes.SCHEDULER */);
1890 }
1891 }
1892 }
1893 finally {
1894 flushIndex = 0;
1895 queue.length = 0;
1896 flushPostFlushCbs(seen);
1897 isFlushing = false;
1898 currentFlushPromise = null;
1899 // some postFlushCb queued jobs!
1900 // keep flushing until it drains.
1901 if (queue.length || pendingPostFlushCbs.length) {
1902 flushJobs(seen);
1903 }
1904 }
1905}
1906function checkRecursiveUpdates(seen, fn) {
1907 if (!seen.has(fn)) {
1908 seen.set(fn, 1);
1909 }
1910 else {
1911 const count = seen.get(fn);
1912 if (count > RECURSION_LIMIT) {
1913 const instance = fn.ownerInstance;
1914 const componentName = instance && getComponentName(instance.type);
1915 warn$1(`Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. ` +
1916 `This means you have a reactive effect that is mutating its own ` +
1917 `dependencies and thus recursively triggering itself. Possible sources ` +
1918 `include component template, render function, updated hook or ` +
1919 `watcher source function.`);
1920 return true;
1921 }
1922 else {
1923 seen.set(fn, count + 1);
1924 }
1925 }
1926}
1927
1928/* eslint-disable no-restricted-globals */
1929let isHmrUpdating = false;
1930const hmrDirtyComponents = new Set();
1931// Expose the HMR runtime on the global object
1932// This makes it entirely tree-shakable without polluting the exports and makes
1933// it easier to be used in toolings like vue-loader
1934// Note: for a component to be eligible for HMR it also needs the __hmrId option
1935// to be set so that its instances can be registered / removed.
1936{
1937 getGlobalThis().__VUE_HMR_RUNTIME__ = {
1938 createRecord: tryWrap(createRecord),
1939 rerender: tryWrap(rerender),
1940 reload: tryWrap(reload)
1941 };
1942}
1943const map = new Map();
1944function registerHMR(instance) {
1945 const id = instance.type.__hmrId;
1946 let record = map.get(id);
1947 if (!record) {
1948 createRecord(id, instance.type);
1949 record = map.get(id);
1950 }
1951 record.instances.add(instance);
1952}
1953function unregisterHMR(instance) {
1954 map.get(instance.type.__hmrId).instances.delete(instance);
1955}
1956function createRecord(id, initialDef) {
1957 if (map.has(id)) {
1958 return false;
1959 }
1960 map.set(id, {
1961 initialDef: normalizeClassComponent(initialDef),
1962 instances: new Set()
1963 });
1964 return true;
1965}
1966function normalizeClassComponent(component) {
1967 return isClassComponent(component) ? component.__vccOpts : component;
1968}
1969function rerender(id, newRender) {
1970 const record = map.get(id);
1971 if (!record) {
1972 return;
1973 }
1974 // update initial record (for not-yet-rendered component)
1975 record.initialDef.render = newRender;
1976 [...record.instances].forEach(instance => {
1977 if (newRender) {
1978 instance.render = newRender;
1979 normalizeClassComponent(instance.type).render = newRender;
1980 }
1981 instance.renderCache = [];
1982 // this flag forces child components with slot content to update
1983 isHmrUpdating = true;
1984 instance.update();
1985 isHmrUpdating = false;
1986 });
1987}
1988function reload(id, newComp) {
1989 const record = map.get(id);
1990 if (!record)
1991 return;
1992 newComp = normalizeClassComponent(newComp);
1993 // update initial def (for not-yet-rendered components)
1994 updateComponentDef(record.initialDef, newComp);
1995 // create a snapshot which avoids the set being mutated during updates
1996 const instances = [...record.instances];
1997 for (const instance of instances) {
1998 const oldComp = normalizeClassComponent(instance.type);
1999 if (!hmrDirtyComponents.has(oldComp)) {
2000 // 1. Update existing comp definition to match new one
2001 if (oldComp !== record.initialDef) {
2002 updateComponentDef(oldComp, newComp);
2003 }
2004 // 2. mark definition dirty. This forces the renderer to replace the
2005 // component on patch.
2006 hmrDirtyComponents.add(oldComp);
2007 }
2008 // 3. invalidate options resolution cache
2009 instance.appContext.optionsCache.delete(instance.type);
2010 // 4. actually update
2011 if (instance.ceReload) {
2012 // custom element
2013 hmrDirtyComponents.add(oldComp);
2014 instance.ceReload(newComp.styles);
2015 hmrDirtyComponents.delete(oldComp);
2016 }
2017 else if (instance.parent) {
2018 // 4. Force the parent instance to re-render. This will cause all updated
2019 // components to be unmounted and re-mounted. Queue the update so that we
2020 // don't end up forcing the same parent to re-render multiple times.
2021 queueJob(instance.parent.update);
2022 }
2023 else if (instance.appContext.reload) {
2024 // root instance mounted via createApp() has a reload method
2025 instance.appContext.reload();
2026 }
2027 else if (typeof window !== 'undefined') {
2028 // root instance inside tree created via raw render(). Force reload.
2029 window.location.reload();
2030 }
2031 else {
2032 console.warn('[HMR] Root or manually mounted instance modified. Full reload required.');
2033 }
2034 }
2035 // 5. make sure to cleanup dirty hmr components after update
2036 queuePostFlushCb(() => {
2037 for (const instance of instances) {
2038 hmrDirtyComponents.delete(normalizeClassComponent(instance.type));
2039 }
2040 });
2041}
2042function updateComponentDef(oldComp, newComp) {
2043 extend(oldComp, newComp);
2044 for (const key in oldComp) {
2045 if (key !== '__file' && !(key in newComp)) {
2046 delete oldComp[key];
2047 }
2048 }
2049}
2050function tryWrap(fn) {
2051 return (id, arg) => {
2052 try {
2053 return fn(id, arg);
2054 }
2055 catch (e) {
2056 console.error(e);
2057 console.warn(`[HMR] Something went wrong during Vue component hot-reload. ` +
2058 `Full reload required.`);
2059 }
2060 };
2061}
2062
2063let devtools;
2064let buffer = [];
2065let devtoolsNotInstalled = false;
2066function emit(event, ...args) {
2067 if (devtools) {
2068 devtools.emit(event, ...args);
2069 }
2070 else if (!devtoolsNotInstalled) {
2071 buffer.push({ event, args });
2072 }
2073}
2074function setDevtoolsHook(hook, target) {
2075 var _a, _b;
2076 devtools = hook;
2077 if (devtools) {
2078 devtools.enabled = true;
2079 buffer.forEach(({ event, args }) => devtools.emit(event, ...args));
2080 buffer = [];
2081 }
2082 else if (
2083 // handle late devtools injection - only do this if we are in an actual
2084 // browser environment to avoid the timer handle stalling test runner exit
2085 // (#4815)
2086 typeof window !== 'undefined' &&
2087 // some envs mock window but not fully
2088 window.HTMLElement &&
2089 // also exclude jsdom
2090 !((_b = (_a = window.navigator) === null || _a === void 0 ? void 0 : _a.userAgent) === null || _b === void 0 ? void 0 : _b.includes('jsdom'))) {
2091 const replay = (target.__VUE_DEVTOOLS_HOOK_REPLAY__ =
2092 target.__VUE_DEVTOOLS_HOOK_REPLAY__ || []);
2093 replay.push((newHook) => {
2094 setDevtoolsHook(newHook, target);
2095 });
2096 // clear buffer after 3s - the user probably doesn't have devtools installed
2097 // at all, and keeping the buffer will cause memory leaks (#4738)
2098 setTimeout(() => {
2099 if (!devtools) {
2100 target.__VUE_DEVTOOLS_HOOK_REPLAY__ = null;
2101 devtoolsNotInstalled = true;
2102 buffer = [];
2103 }
2104 }, 3000);
2105 }
2106 else {
2107 // non-browser env, assume not installed
2108 devtoolsNotInstalled = true;
2109 buffer = [];
2110 }
2111}
2112function devtoolsInitApp(app, version) {
2113 emit("app:init" /* DevtoolsHooks.APP_INIT */, app, version, {
2114 Fragment,
2115 Text,
2116 Comment,
2117 Static
2118 });
2119}
2120function devtoolsUnmountApp(app) {
2121 emit("app:unmount" /* DevtoolsHooks.APP_UNMOUNT */, app);
2122}
2123const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* DevtoolsHooks.COMPONENT_ADDED */);
2124const devtoolsComponentUpdated =
2125/*#__PURE__*/ createDevtoolsComponentHook("component:updated" /* DevtoolsHooks.COMPONENT_UPDATED */);
2126const _devtoolsComponentRemoved = /*#__PURE__*/ createDevtoolsComponentHook("component:removed" /* DevtoolsHooks.COMPONENT_REMOVED */);
2127const devtoolsComponentRemoved = (component) => {
2128 if (devtools &&
2129 typeof devtools.cleanupBuffer === 'function' &&
2130 // remove the component if it wasn't buffered
2131 !devtools.cleanupBuffer(component)) {
2132 _devtoolsComponentRemoved(component);
2133 }
2134};
2135function createDevtoolsComponentHook(hook) {
2136 return (component) => {
2137 emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component);
2138 };
2139}
2140const devtoolsPerfStart = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:start" /* DevtoolsHooks.PERFORMANCE_START */);
2141const devtoolsPerfEnd = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:end" /* DevtoolsHooks.PERFORMANCE_END */);
2142function createDevtoolsPerformanceHook(hook) {
2143 return (component, type, time) => {
2144 emit(hook, component.appContext.app, component.uid, component, type, time);
2145 };
2146}
2147function devtoolsComponentEmit(component, event, params) {
2148 emit("component:emit" /* DevtoolsHooks.COMPONENT_EMIT */, component.appContext.app, component, event, params);
2149}
2150
2151function emit$1(instance, event, ...rawArgs) {
2152 if (instance.isUnmounted)
2153 return;
2154 const props = instance.vnode.props || EMPTY_OBJ;
2155 {
2156 const { emitsOptions, propsOptions: [propsOptions] } = instance;
2157 if (emitsOptions) {
2158 if (!(event in emitsOptions) &&
2159 !(false )) {
2160 if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
2161 warn$1(`Component emitted event "${event}" but it is neither declared in ` +
2162 `the emits option nor as an "${toHandlerKey(event)}" prop.`);
2163 }
2164 }
2165 else {
2166 const validator = emitsOptions[event];
2167 if (isFunction(validator)) {
2168 const isValid = validator(...rawArgs);
2169 if (!isValid) {
2170 warn$1(`Invalid event arguments: event validation failed for event "${event}".`);
2171 }
2172 }
2173 }
2174 }
2175 }
2176 let args = rawArgs;
2177 const isModelListener = event.startsWith('update:');
2178 // for v-model update:xxx events, apply modifiers on args
2179 const modelArg = isModelListener && event.slice(7);
2180 if (modelArg && modelArg in props) {
2181 const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`;
2182 const { number, trim } = props[modifiersKey] || EMPTY_OBJ;
2183 if (trim) {
2184 args = rawArgs.map(a => (isString(a) ? a.trim() : a));
2185 }
2186 if (number) {
2187 args = rawArgs.map(toNumber);
2188 }
2189 }
2190 {
2191 devtoolsComponentEmit(instance, event, args);
2192 }
2193 {
2194 const lowerCaseEvent = event.toLowerCase();
2195 if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) {
2196 warn$1(`Event "${lowerCaseEvent}" is emitted in component ` +
2197 `${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` +
2198 `Note that HTML attributes are case-insensitive and you cannot use ` +
2199 `v-on to listen to camelCase events when using in-DOM templates. ` +
2200 `You should probably use "${hyphenate(event)}" instead of "${event}".`);
2201 }
2202 }
2203 let handlerName;
2204 let handler = props[(handlerName = toHandlerKey(event))] ||
2205 // also try camelCase event handler (#2249)
2206 props[(handlerName = toHandlerKey(camelize(event)))];
2207 // for v-model update:xxx events, also trigger kebab-case equivalent
2208 // for props passed via kebab-case
2209 if (!handler && isModelListener) {
2210 handler = props[(handlerName = toHandlerKey(hyphenate(event)))];
2211 }
2212 if (handler) {
2213 callWithAsyncErrorHandling(handler, instance, 6 /* ErrorCodes.COMPONENT_EVENT_HANDLER */, args);
2214 }
2215 const onceHandler = props[handlerName + `Once`];
2216 if (onceHandler) {
2217 if (!instance.emitted) {
2218 instance.emitted = {};
2219 }
2220 else if (instance.emitted[handlerName]) {
2221 return;
2222 }
2223 instance.emitted[handlerName] = true;
2224 callWithAsyncErrorHandling(onceHandler, instance, 6 /* ErrorCodes.COMPONENT_EVENT_HANDLER */, args);
2225 }
2226}
2227function normalizeEmitsOptions(comp, appContext, asMixin = false) {
2228 const cache = appContext.emitsCache;
2229 const cached = cache.get(comp);
2230 if (cached !== undefined) {
2231 return cached;
2232 }
2233 const raw = comp.emits;
2234 let normalized = {};
2235 // apply mixin/extends props
2236 let hasExtends = false;
2237 if (!isFunction(comp)) {
2238 const extendEmits = (raw) => {
2239 const normalizedFromExtend = normalizeEmitsOptions(raw, appContext, true);
2240 if (normalizedFromExtend) {
2241 hasExtends = true;
2242 extend(normalized, normalizedFromExtend);
2243 }
2244 };
2245 if (!asMixin && appContext.mixins.length) {
2246 appContext.mixins.forEach(extendEmits);
2247 }
2248 if (comp.extends) {
2249 extendEmits(comp.extends);
2250 }
2251 if (comp.mixins) {
2252 comp.mixins.forEach(extendEmits);
2253 }
2254 }
2255 if (!raw && !hasExtends) {
2256 if (isObject(comp)) {
2257 cache.set(comp, null);
2258 }
2259 return null;
2260 }
2261 if (isArray(raw)) {
2262 raw.forEach(key => (normalized[key] = null));
2263 }
2264 else {
2265 extend(normalized, raw);
2266 }
2267 if (isObject(comp)) {
2268 cache.set(comp, normalized);
2269 }
2270 return normalized;
2271}
2272// Check if an incoming prop key is a declared emit event listener.
2273// e.g. With `emits: { click: null }`, props named `onClick` and `onclick` are
2274// both considered matched listeners.
2275function isEmitListener(options, key) {
2276 if (!options || !isOn(key)) {
2277 return false;
2278 }
2279 key = key.slice(2).replace(/Once$/, '');
2280 return (hasOwn(options, key[0].toLowerCase() + key.slice(1)) ||
2281 hasOwn(options, hyphenate(key)) ||
2282 hasOwn(options, key));
2283}
2284
2285/**
2286 * mark the current rendering instance for asset resolution (e.g.
2287 * resolveComponent, resolveDirective) during render
2288 */
2289let currentRenderingInstance = null;
2290let currentScopeId = null;
2291/**
2292 * Note: rendering calls maybe nested. The function returns the parent rendering
2293 * instance if present, which should be restored after the render is done:
2294 *
2295 * ```js
2296 * const prev = setCurrentRenderingInstance(i)
2297 * // ...render
2298 * setCurrentRenderingInstance(prev)
2299 * ```
2300 */
2301function setCurrentRenderingInstance(instance) {
2302 const prev = currentRenderingInstance;
2303 currentRenderingInstance = instance;
2304 currentScopeId = (instance && instance.type.__scopeId) || null;
2305 return prev;
2306}
2307/**
2308 * Set scope id when creating hoisted vnodes.
2309 * @private compiler helper
2310 */
2311function pushScopeId(id) {
2312 currentScopeId = id;
2313}
2314/**
2315 * Technically we no longer need this after 3.0.8 but we need to keep the same
2316 * API for backwards compat w/ code generated by compilers.
2317 * @private
2318 */
2319function popScopeId() {
2320 currentScopeId = null;
2321}
2322/**
2323 * Only for backwards compat
2324 * @private
2325 */
2326const withScopeId = (_id) => withCtx;
2327/**
2328 * Wrap a slot function to memoize current rendering instance
2329 * @private compiler helper
2330 */
2331function withCtx(fn, ctx = currentRenderingInstance, isNonScopedSlot // false only
2332) {
2333 if (!ctx)
2334 return fn;
2335 // already normalized
2336 if (fn._n) {
2337 return fn;
2338 }
2339 const renderFnWithContext = (...args) => {
2340 // If a user calls a compiled slot inside a template expression (#1745), it
2341 // can mess up block tracking, so by default we disable block tracking and
2342 // force bail out when invoking a compiled slot (indicated by the ._d flag).
2343 // This isn't necessary if rendering a compiled `<slot>`, so we flip the
2344 // ._d flag off when invoking the wrapped fn inside `renderSlot`.
2345 if (renderFnWithContext._d) {
2346 setBlockTracking(-1);
2347 }
2348 const prevInstance = setCurrentRenderingInstance(ctx);
2349 let res;
2350 try {
2351 res = fn(...args);
2352 }
2353 finally {
2354 setCurrentRenderingInstance(prevInstance);
2355 if (renderFnWithContext._d) {
2356 setBlockTracking(1);
2357 }
2358 }
2359 {
2360 devtoolsComponentUpdated(ctx);
2361 }
2362 return res;
2363 };
2364 // mark normalized to avoid duplicated wrapping
2365 renderFnWithContext._n = true;
2366 // mark this as compiled by default
2367 // this is used in vnode.ts -> normalizeChildren() to set the slot
2368 // rendering flag.
2369 renderFnWithContext._c = true;
2370 // disable block tracking by default
2371 renderFnWithContext._d = true;
2372 return renderFnWithContext;
2373}
2374
2375/**
2376 * dev only flag to track whether $attrs was used during render.
2377 * If $attrs was used during render then the warning for failed attrs
2378 * fallthrough can be suppressed.
2379 */
2380let accessedAttrs = false;
2381function markAttrsAccessed() {
2382 accessedAttrs = true;
2383}
2384function renderComponentRoot(instance) {
2385 const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx, inheritAttrs } = instance;
2386 let result;
2387 let fallthroughAttrs;
2388 const prev = setCurrentRenderingInstance(instance);
2389 {
2390 accessedAttrs = false;
2391 }
2392 try {
2393 if (vnode.shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */) {
2394 // withProxy is a proxy with a different `has` trap only for
2395 // runtime-compiled render functions using `with` block.
2396 const proxyToUse = withProxy || proxy;
2397 result = normalizeVNode(render.call(proxyToUse, proxyToUse, renderCache, props, setupState, data, ctx));
2398 fallthroughAttrs = attrs;
2399 }
2400 else {
2401 // functional
2402 const render = Component;
2403 // in dev, mark attrs accessed if optional props (attrs === props)
2404 if (true && attrs === props) {
2405 markAttrsAccessed();
2406 }
2407 result = normalizeVNode(render.length > 1
2408 ? render(props, true
2409 ? {
2410 get attrs() {
2411 markAttrsAccessed();
2412 return attrs;
2413 },
2414 slots,
2415 emit
2416 }
2417 : { attrs, slots, emit })
2418 : render(props, null /* we know it doesn't need it */));
2419 fallthroughAttrs = Component.props
2420 ? attrs
2421 : getFunctionalFallthrough(attrs);
2422 }
2423 }
2424 catch (err) {
2425 blockStack.length = 0;
2426 handleError(err, instance, 1 /* ErrorCodes.RENDER_FUNCTION */);
2427 result = createVNode(Comment);
2428 }
2429 // attr merging
2430 // in dev mode, comments are preserved, and it's possible for a template
2431 // to have comments along side the root element which makes it a fragment
2432 let root = result;
2433 let setRoot = undefined;
2434 if (result.patchFlag > 0 &&
2435 result.patchFlag & 2048 /* PatchFlags.DEV_ROOT_FRAGMENT */) {
2436 [root, setRoot] = getChildRoot(result);
2437 }
2438 if (fallthroughAttrs && inheritAttrs !== false) {
2439 const keys = Object.keys(fallthroughAttrs);
2440 const { shapeFlag } = root;
2441 if (keys.length) {
2442 if (shapeFlag & (1 /* ShapeFlags.ELEMENT */ | 6 /* ShapeFlags.COMPONENT */)) {
2443 if (propsOptions && keys.some(isModelListener)) {
2444 // If a v-model listener (onUpdate:xxx) has a corresponding declared
2445 // prop, it indicates this component expects to handle v-model and
2446 // it should not fallthrough.
2447 // related: #1543, #1643, #1989
2448 fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
2449 }
2450 root = cloneVNode(root, fallthroughAttrs);
2451 }
2452 else if (!accessedAttrs && root.type !== Comment) {
2453 const allAttrs = Object.keys(attrs);
2454 const eventAttrs = [];
2455 const extraAttrs = [];
2456 for (let i = 0, l = allAttrs.length; i < l; i++) {
2457 const key = allAttrs[i];
2458 if (isOn(key)) {
2459 // ignore v-model handlers when they fail to fallthrough
2460 if (!isModelListener(key)) {
2461 // remove `on`, lowercase first letter to reflect event casing
2462 // accurately
2463 eventAttrs.push(key[2].toLowerCase() + key.slice(3));
2464 }
2465 }
2466 else {
2467 extraAttrs.push(key);
2468 }
2469 }
2470 if (extraAttrs.length) {
2471 warn$1(`Extraneous non-props attributes (` +
2472 `${extraAttrs.join(', ')}) ` +
2473 `were passed to component but could not be automatically inherited ` +
2474 `because component renders fragment or text root nodes.`);
2475 }
2476 if (eventAttrs.length) {
2477 warn$1(`Extraneous non-emits event listeners (` +
2478 `${eventAttrs.join(', ')}) ` +
2479 `were passed to component but could not be automatically inherited ` +
2480 `because component renders fragment or text root nodes. ` +
2481 `If the listener is intended to be a component custom event listener only, ` +
2482 `declare it using the "emits" option.`);
2483 }
2484 }
2485 }
2486 }
2487 // inherit directives
2488 if (vnode.dirs) {
2489 if (!isElementRoot(root)) {
2490 warn$1(`Runtime directive used on component with non-element root node. ` +
2491 `The directives will not function as intended.`);
2492 }
2493 // clone before mutating since the root may be a hoisted vnode
2494 root = cloneVNode(root);
2495 root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
2496 }
2497 // inherit transition data
2498 if (vnode.transition) {
2499 if (!isElementRoot(root)) {
2500 warn$1(`Component inside <Transition> renders non-element root node ` +
2501 `that cannot be animated.`);
2502 }
2503 root.transition = vnode.transition;
2504 }
2505 if (setRoot) {
2506 setRoot(root);
2507 }
2508 else {
2509 result = root;
2510 }
2511 setCurrentRenderingInstance(prev);
2512 return result;
2513}
2514/**
2515 * dev only
2516 * In dev mode, template root level comments are rendered, which turns the
2517 * template into a fragment root, but we need to locate the single element
2518 * root for attrs and scope id processing.
2519 */
2520const getChildRoot = (vnode) => {
2521 const rawChildren = vnode.children;
2522 const dynamicChildren = vnode.dynamicChildren;
2523 const childRoot = filterSingleRoot(rawChildren);
2524 if (!childRoot) {
2525 return [vnode, undefined];
2526 }
2527 const index = rawChildren.indexOf(childRoot);
2528 const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1;
2529 const setRoot = (updatedRoot) => {
2530 rawChildren[index] = updatedRoot;
2531 if (dynamicChildren) {
2532 if (dynamicIndex > -1) {
2533 dynamicChildren[dynamicIndex] = updatedRoot;
2534 }
2535 else if (updatedRoot.patchFlag > 0) {
2536 vnode.dynamicChildren = [...dynamicChildren, updatedRoot];
2537 }
2538 }
2539 };
2540 return [normalizeVNode(childRoot), setRoot];
2541};
2542function filterSingleRoot(children) {
2543 let singleRoot;
2544 for (let i = 0; i < children.length; i++) {
2545 const child = children[i];
2546 if (isVNode(child)) {
2547 // ignore user comment
2548 if (child.type !== Comment || child.children === 'v-if') {
2549 if (singleRoot) {
2550 // has more than 1 non-comment child, return now
2551 return;
2552 }
2553 else {
2554 singleRoot = child;
2555 }
2556 }
2557 }
2558 else {
2559 return;
2560 }
2561 }
2562 return singleRoot;
2563}
2564const getFunctionalFallthrough = (attrs) => {
2565 let res;
2566 for (const key in attrs) {
2567 if (key === 'class' || key === 'style' || isOn(key)) {
2568 (res || (res = {}))[key] = attrs[key];
2569 }
2570 }
2571 return res;
2572};
2573const filterModelListeners = (attrs, props) => {
2574 const res = {};
2575 for (const key in attrs) {
2576 if (!isModelListener(key) || !(key.slice(9) in props)) {
2577 res[key] = attrs[key];
2578 }
2579 }
2580 return res;
2581};
2582const isElementRoot = (vnode) => {
2583 return (vnode.shapeFlag & (6 /* ShapeFlags.COMPONENT */ | 1 /* ShapeFlags.ELEMENT */) ||
2584 vnode.type === Comment // potential v-if branch switch
2585 );
2586};
2587function shouldUpdateComponent(prevVNode, nextVNode, optimized) {
2588 const { props: prevProps, children: prevChildren, component } = prevVNode;
2589 const { props: nextProps, children: nextChildren, patchFlag } = nextVNode;
2590 const emits = component.emitsOptions;
2591 // Parent component's render function was hot-updated. Since this may have
2592 // caused the child component's slots content to have changed, we need to
2593 // force the child to update as well.
2594 if ((prevChildren || nextChildren) && isHmrUpdating) {
2595 return true;
2596 }
2597 // force child update for runtime directive or transition on component vnode.
2598 if (nextVNode.dirs || nextVNode.transition) {
2599 return true;
2600 }
2601 if (optimized && patchFlag >= 0) {
2602 if (patchFlag & 1024 /* PatchFlags.DYNAMIC_SLOTS */) {
2603 // slot content that references values that might have changed,
2604 // e.g. in a v-for
2605 return true;
2606 }
2607 if (patchFlag & 16 /* PatchFlags.FULL_PROPS */) {
2608 if (!prevProps) {
2609 return !!nextProps;
2610 }
2611 // presence of this flag indicates props are always non-null
2612 return hasPropsChanged(prevProps, nextProps, emits);
2613 }
2614 else if (patchFlag & 8 /* PatchFlags.PROPS */) {
2615 const dynamicProps = nextVNode.dynamicProps;
2616 for (let i = 0; i < dynamicProps.length; i++) {
2617 const key = dynamicProps[i];
2618 if (nextProps[key] !== prevProps[key] &&
2619 !isEmitListener(emits, key)) {
2620 return true;
2621 }
2622 }
2623 }
2624 }
2625 else {
2626 // this path is only taken by manually written render functions
2627 // so presence of any children leads to a forced update
2628 if (prevChildren || nextChildren) {
2629 if (!nextChildren || !nextChildren.$stable) {
2630 return true;
2631 }
2632 }
2633 if (prevProps === nextProps) {
2634 return false;
2635 }
2636 if (!prevProps) {
2637 return !!nextProps;
2638 }
2639 if (!nextProps) {
2640 return true;
2641 }
2642 return hasPropsChanged(prevProps, nextProps, emits);
2643 }
2644 return false;
2645}
2646function hasPropsChanged(prevProps, nextProps, emitsOptions) {
2647 const nextKeys = Object.keys(nextProps);
2648 if (nextKeys.length !== Object.keys(prevProps).length) {
2649 return true;
2650 }
2651 for (let i = 0; i < nextKeys.length; i++) {
2652 const key = nextKeys[i];
2653 if (nextProps[key] !== prevProps[key] &&
2654 !isEmitListener(emitsOptions, key)) {
2655 return true;
2656 }
2657 }
2658 return false;
2659}
2660function updateHOCHostEl({ vnode, parent }, el // HostNode
2661) {
2662 while (parent && parent.subTree === vnode) {
2663 (vnode = parent.vnode).el = el;
2664 parent = parent.parent;
2665 }
2666}
2667
2668const isSuspense = (type) => type.__isSuspense;
2669// Suspense exposes a component-like API, and is treated like a component
2670// in the compiler, but internally it's a special built-in type that hooks
2671// directly into the renderer.
2672const SuspenseImpl = {
2673 name: 'Suspense',
2674 // In order to make Suspense tree-shakable, we need to avoid importing it
2675 // directly in the renderer. The renderer checks for the __isSuspense flag
2676 // on a vnode's type and calls the `process` method, passing in renderer
2677 // internals.
2678 __isSuspense: true,
2679 process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized,
2680 // platform-specific impl passed from renderer
2681 rendererInternals) {
2682 if (n1 == null) {
2683 mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals);
2684 }
2685 else {
2686 patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, rendererInternals);
2687 }
2688 },
2689 hydrate: hydrateSuspense,
2690 create: createSuspenseBoundary,
2691 normalize: normalizeSuspenseChildren
2692};
2693// Force-casted public typing for h and TSX props inference
2694const Suspense = (SuspenseImpl
2695 );
2696function triggerEvent(vnode, name) {
2697 const eventListener = vnode.props && vnode.props[name];
2698 if (isFunction(eventListener)) {
2699 eventListener();
2700 }
2701}
2702function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) {
2703 const { p: patch, o: { createElement } } = rendererInternals;
2704 const hiddenContainer = createElement('div');
2705 const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals));
2706 // start mounting the content subtree in an off-dom container
2707 patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds);
2708 // now check if we have encountered any async deps
2709 if (suspense.deps > 0) {
2710 // has async
2711 // invoke @fallback event
2712 triggerEvent(vnode, 'onPending');
2713 triggerEvent(vnode, 'onFallback');
2714 // mount the fallback tree
2715 patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2716 isSVG, slotScopeIds);
2717 setActiveBranch(suspense, vnode.ssFallback);
2718 }
2719 else {
2720 // Suspense has no async deps. Just resolve.
2721 suspense.resolve();
2722 }
2723}
2724function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) {
2725 const suspense = (n2.suspense = n1.suspense);
2726 suspense.vnode = n2;
2727 n2.el = n1.el;
2728 const newBranch = n2.ssContent;
2729 const newFallback = n2.ssFallback;
2730 const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense;
2731 if (pendingBranch) {
2732 suspense.pendingBranch = newBranch;
2733 if (isSameVNodeType(newBranch, pendingBranch)) {
2734 // same root type but content may have changed.
2735 patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2736 if (suspense.deps <= 0) {
2737 suspense.resolve();
2738 }
2739 else if (isInFallback) {
2740 patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2741 isSVG, slotScopeIds, optimized);
2742 setActiveBranch(suspense, newFallback);
2743 }
2744 }
2745 else {
2746 // toggled before pending tree is resolved
2747 suspense.pendingId++;
2748 if (isHydrating) {
2749 // if toggled before hydration is finished, the current DOM tree is
2750 // no longer valid. set it as the active branch so it will be unmounted
2751 // when resolved
2752 suspense.isHydrating = false;
2753 suspense.activeBranch = pendingBranch;
2754 }
2755 else {
2756 unmount(pendingBranch, parentComponent, suspense);
2757 }
2758 // increment pending ID. this is used to invalidate async callbacks
2759 // reset suspense state
2760 suspense.deps = 0;
2761 // discard effects from pending branch
2762 suspense.effects.length = 0;
2763 // discard previous container
2764 suspense.hiddenContainer = createElement('div');
2765 if (isInFallback) {
2766 // already in fallback state
2767 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2768 if (suspense.deps <= 0) {
2769 suspense.resolve();
2770 }
2771 else {
2772 patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2773 isSVG, slotScopeIds, optimized);
2774 setActiveBranch(suspense, newFallback);
2775 }
2776 }
2777 else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2778 // toggled "back" to current active branch
2779 patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2780 // force resolve
2781 suspense.resolve(true);
2782 }
2783 else {
2784 // switched to a 3rd branch
2785 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2786 if (suspense.deps <= 0) {
2787 suspense.resolve();
2788 }
2789 }
2790 }
2791 }
2792 else {
2793 if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2794 // root did not change, just normal patch
2795 patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2796 setActiveBranch(suspense, newBranch);
2797 }
2798 else {
2799 // root node toggled
2800 // invoke @pending event
2801 triggerEvent(n2, 'onPending');
2802 // mount pending branch in off-dom container
2803 suspense.pendingBranch = newBranch;
2804 suspense.pendingId++;
2805 patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized);
2806 if (suspense.deps <= 0) {
2807 // incoming branch has no async deps, resolve now.
2808 suspense.resolve();
2809 }
2810 else {
2811 const { timeout, pendingId } = suspense;
2812 if (timeout > 0) {
2813 setTimeout(() => {
2814 if (suspense.pendingId === pendingId) {
2815 suspense.fallback(newFallback);
2816 }
2817 }, timeout);
2818 }
2819 else if (timeout === 0) {
2820 suspense.fallback(newFallback);
2821 }
2822 }
2823 }
2824 }
2825}
2826let hasWarned = false;
2827function createSuspenseBoundary(vnode, parent, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals, isHydrating = false) {
2828 /* istanbul ignore if */
2829 if (!hasWarned) {
2830 hasWarned = true;
2831 // @ts-ignore `console.info` cannot be null error
2832 console[console.info ? 'info' : 'log'](`<Suspense> is an experimental feature and its API will likely change.`);
2833 }
2834 const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals;
2835 const timeout = toNumber(vnode.props && vnode.props.timeout);
2836 const suspense = {
2837 vnode,
2838 parent,
2839 parentComponent,
2840 isSVG,
2841 container,
2842 hiddenContainer,
2843 anchor,
2844 deps: 0,
2845 pendingId: 0,
2846 timeout: typeof timeout === 'number' ? timeout : -1,
2847 activeBranch: null,
2848 pendingBranch: null,
2849 isInFallback: true,
2850 isHydrating,
2851 isUnmounted: false,
2852 effects: [],
2853 resolve(resume = false) {
2854 {
2855 if (!resume && !suspense.pendingBranch) {
2856 throw new Error(`suspense.resolve() is called without a pending branch.`);
2857 }
2858 if (suspense.isUnmounted) {
2859 throw new Error(`suspense.resolve() is called on an already unmounted suspense boundary.`);
2860 }
2861 }
2862 const { vnode, activeBranch, pendingBranch, pendingId, effects, parentComponent, container } = suspense;
2863 if (suspense.isHydrating) {
2864 suspense.isHydrating = false;
2865 }
2866 else if (!resume) {
2867 const delayEnter = activeBranch &&
2868 pendingBranch.transition &&
2869 pendingBranch.transition.mode === 'out-in';
2870 if (delayEnter) {
2871 activeBranch.transition.afterLeave = () => {
2872 if (pendingId === suspense.pendingId) {
2873 move(pendingBranch, container, anchor, 0 /* MoveType.ENTER */);
2874 }
2875 };
2876 }
2877 // this is initial anchor on mount
2878 let { anchor } = suspense;
2879 // unmount current active tree
2880 if (activeBranch) {
2881 // if the fallback tree was mounted, it may have been moved
2882 // as part of a parent suspense. get the latest anchor for insertion
2883 anchor = next(activeBranch);
2884 unmount(activeBranch, parentComponent, suspense, true);
2885 }
2886 if (!delayEnter) {
2887 // move content from off-dom container to actual container
2888 move(pendingBranch, container, anchor, 0 /* MoveType.ENTER */);
2889 }
2890 }
2891 setActiveBranch(suspense, pendingBranch);
2892 suspense.pendingBranch = null;
2893 suspense.isInFallback = false;
2894 // flush buffered effects
2895 // check if there is a pending parent suspense
2896 let parent = suspense.parent;
2897 let hasUnresolvedAncestor = false;
2898 while (parent) {
2899 if (parent.pendingBranch) {
2900 // found a pending parent suspense, merge buffered post jobs
2901 // into that parent
2902 parent.effects.push(...effects);
2903 hasUnresolvedAncestor = true;
2904 break;
2905 }
2906 parent = parent.parent;
2907 }
2908 // no pending parent suspense, flush all jobs
2909 if (!hasUnresolvedAncestor) {
2910 queuePostFlushCb(effects);
2911 }
2912 suspense.effects = [];
2913 // invoke @resolve event
2914 triggerEvent(vnode, 'onResolve');
2915 },
2916 fallback(fallbackVNode) {
2917 if (!suspense.pendingBranch) {
2918 return;
2919 }
2920 const { vnode, activeBranch, parentComponent, container, isSVG } = suspense;
2921 // invoke @fallback event
2922 triggerEvent(vnode, 'onFallback');
2923 const anchor = next(activeBranch);
2924 const mountFallback = () => {
2925 if (!suspense.isInFallback) {
2926 return;
2927 }
2928 // mount the fallback tree
2929 patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2930 isSVG, slotScopeIds, optimized);
2931 setActiveBranch(suspense, fallbackVNode);
2932 };
2933 const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in';
2934 if (delayEnter) {
2935 activeBranch.transition.afterLeave = mountFallback;
2936 }
2937 suspense.isInFallback = true;
2938 // unmount current active branch
2939 unmount(activeBranch, parentComponent, null, // no suspense so unmount hooks fire now
2940 true // shouldRemove
2941 );
2942 if (!delayEnter) {
2943 mountFallback();
2944 }
2945 },
2946 move(container, anchor, type) {
2947 suspense.activeBranch &&
2948 move(suspense.activeBranch, container, anchor, type);
2949 suspense.container = container;
2950 },
2951 next() {
2952 return suspense.activeBranch && next(suspense.activeBranch);
2953 },
2954 registerDep(instance, setupRenderEffect) {
2955 const isInPendingSuspense = !!suspense.pendingBranch;
2956 if (isInPendingSuspense) {
2957 suspense.deps++;
2958 }
2959 const hydratedEl = instance.vnode.el;
2960 instance
2961 .asyncDep.catch(err => {
2962 handleError(err, instance, 0 /* ErrorCodes.SETUP_FUNCTION */);
2963 })
2964 .then(asyncSetupResult => {
2965 // retry when the setup() promise resolves.
2966 // component may have been unmounted before resolve.
2967 if (instance.isUnmounted ||
2968 suspense.isUnmounted ||
2969 suspense.pendingId !== instance.suspenseId) {
2970 return;
2971 }
2972 // retry from this component
2973 instance.asyncResolved = true;
2974 const { vnode } = instance;
2975 {
2976 pushWarningContext(vnode);
2977 }
2978 handleSetupResult(instance, asyncSetupResult, false);
2979 if (hydratedEl) {
2980 // vnode may have been replaced if an update happened before the
2981 // async dep is resolved.
2982 vnode.el = hydratedEl;
2983 }
2984 const placeholder = !hydratedEl && instance.subTree.el;
2985 setupRenderEffect(instance, vnode,
2986 // component may have been moved before resolve.
2987 // if this is not a hydration, instance.subTree will be the comment
2988 // placeholder.
2989 parentNode(hydratedEl || instance.subTree.el),
2990 // anchor will not be used if this is hydration, so only need to
2991 // consider the comment placeholder case.
2992 hydratedEl ? null : next(instance.subTree), suspense, isSVG, optimized);
2993 if (placeholder) {
2994 remove(placeholder);
2995 }
2996 updateHOCHostEl(instance, vnode.el);
2997 {
2998 popWarningContext();
2999 }
3000 // only decrease deps count if suspense is not already resolved
3001 if (isInPendingSuspense && --suspense.deps === 0) {
3002 suspense.resolve();
3003 }
3004 });
3005 },
3006 unmount(parentSuspense, doRemove) {
3007 suspense.isUnmounted = true;
3008 if (suspense.activeBranch) {
3009 unmount(suspense.activeBranch, parentComponent, parentSuspense, doRemove);
3010 }
3011 if (suspense.pendingBranch) {
3012 unmount(suspense.pendingBranch, parentComponent, parentSuspense, doRemove);
3013 }
3014 }
3015 };
3016 return suspense;
3017}
3018function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals, hydrateNode) {
3019 /* eslint-disable no-restricted-globals */
3020 const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, node.parentNode, document.createElement('div'), null, isSVG, slotScopeIds, optimized, rendererInternals, true /* hydrating */));
3021 // there are two possible scenarios for server-rendered suspense:
3022 // - success: ssr content should be fully resolved
3023 // - failure: ssr content should be the fallback branch.
3024 // however, on the client we don't really know if it has failed or not
3025 // attempt to hydrate the DOM assuming it has succeeded, but we still
3026 // need to construct a suspense boundary first
3027 const result = hydrateNode(node, (suspense.pendingBranch = vnode.ssContent), parentComponent, suspense, slotScopeIds, optimized);
3028 if (suspense.deps === 0) {
3029 suspense.resolve();
3030 }
3031 return result;
3032 /* eslint-enable no-restricted-globals */
3033}
3034function normalizeSuspenseChildren(vnode) {
3035 const { shapeFlag, children } = vnode;
3036 const isSlotChildren = shapeFlag & 32 /* ShapeFlags.SLOTS_CHILDREN */;
3037 vnode.ssContent = normalizeSuspenseSlot(isSlotChildren ? children.default : children);
3038 vnode.ssFallback = isSlotChildren
3039 ? normalizeSuspenseSlot(children.fallback)
3040 : createVNode(Comment);
3041}
3042function normalizeSuspenseSlot(s) {
3043 let block;
3044 if (isFunction(s)) {
3045 const trackBlock = isBlockTreeEnabled && s._c;
3046 if (trackBlock) {
3047 // disableTracking: false
3048 // allow block tracking for compiled slots
3049 // (see ./componentRenderContext.ts)
3050 s._d = false;
3051 openBlock();
3052 }
3053 s = s();
3054 if (trackBlock) {
3055 s._d = true;
3056 block = currentBlock;
3057 closeBlock();
3058 }
3059 }
3060 if (isArray(s)) {
3061 const singleChild = filterSingleRoot(s);
3062 if (!singleChild) {
3063 warn$1(`<Suspense> slots expect a single root node.`);
3064 }
3065 s = singleChild;
3066 }
3067 s = normalizeVNode(s);
3068 if (block && !s.dynamicChildren) {
3069 s.dynamicChildren = block.filter(c => c !== s);
3070 }
3071 return s;
3072}
3073function queueEffectWithSuspense(fn, suspense) {
3074 if (suspense && suspense.pendingBranch) {
3075 if (isArray(fn)) {
3076 suspense.effects.push(...fn);
3077 }
3078 else {
3079 suspense.effects.push(fn);
3080 }
3081 }
3082 else {
3083 queuePostFlushCb(fn);
3084 }
3085}
3086function setActiveBranch(suspense, branch) {
3087 suspense.activeBranch = branch;
3088 const { vnode, parentComponent } = suspense;
3089 const el = (vnode.el = branch.el);
3090 // in case suspense is the root node of a component,
3091 // recursively update the HOC el
3092 if (parentComponent && parentComponent.subTree === vnode) {
3093 parentComponent.vnode.el = el;
3094 updateHOCHostEl(parentComponent, el);
3095 }
3096}
3097
3098function provide(key, value) {
3099 if (!currentInstance) {
3100 {
3101 warn$1(`provide() can only be used inside setup().`);
3102 }
3103 }
3104 else {
3105 let provides = currentInstance.provides;
3106 // by default an instance inherits its parent's provides object
3107 // but when it needs to provide values of its own, it creates its
3108 // own provides object using parent provides object as prototype.
3109 // this way in `inject` we can simply look up injections from direct
3110 // parent and let the prototype chain do the work.
3111 const parentProvides = currentInstance.parent && currentInstance.parent.provides;
3112 if (parentProvides === provides) {
3113 provides = currentInstance.provides = Object.create(parentProvides);
3114 }
3115 // TS doesn't allow symbol as index type
3116 provides[key] = value;
3117 }
3118}
3119function inject(key, defaultValue, treatDefaultAsFactory = false) {
3120 // fallback to `currentRenderingInstance` so that this can be called in
3121 // a functional component
3122 const instance = currentInstance || currentRenderingInstance;
3123 if (instance) {
3124 // #2400
3125 // to support `app.use` plugins,
3126 // fallback to appContext's `provides` if the instance is at root
3127 const provides = instance.parent == null
3128 ? instance.vnode.appContext && instance.vnode.appContext.provides
3129 : instance.parent.provides;
3130 if (provides && key in provides) {
3131 // TS doesn't allow symbol as index type
3132 return provides[key];
3133 }
3134 else if (arguments.length > 1) {
3135 return treatDefaultAsFactory && isFunction(defaultValue)
3136 ? defaultValue.call(instance.proxy)
3137 : defaultValue;
3138 }
3139 else {
3140 warn$1(`injection "${String(key)}" not found.`);
3141 }
3142 }
3143 else {
3144 warn$1(`inject() can only be used inside setup() or functional components.`);
3145 }
3146}
3147
3148// Simple effect.
3149function watchEffect(effect, options) {
3150 return doWatch(effect, null, options);
3151}
3152function watchPostEffect(effect, options) {
3153 return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'post' }) ));
3154}
3155function watchSyncEffect(effect, options) {
3156 return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'sync' }) ));
3157}
3158// initial value for watchers to trigger on undefined initial values
3159const INITIAL_WATCHER_VALUE = {};
3160// implementation
3161function watch(source, cb, options) {
3162 if (!isFunction(cb)) {
3163 warn$1(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
3164 `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
3165 `supports \`watch(source, cb, options?) signature.`);
3166 }
3167 return doWatch(source, cb, options);
3168}
3169function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EMPTY_OBJ) {
3170 if (!cb) {
3171 if (immediate !== undefined) {
3172 warn$1(`watch() "immediate" option is only respected when using the ` +
3173 `watch(source, callback, options?) signature.`);
3174 }
3175 if (deep !== undefined) {
3176 warn$1(`watch() "deep" option is only respected when using the ` +
3177 `watch(source, callback, options?) signature.`);
3178 }
3179 }
3180 const warnInvalidSource = (s) => {
3181 warn$1(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
3182 `a reactive object, or an array of these types.`);
3183 };
3184 const instance = currentInstance;
3185 let getter;
3186 let forceTrigger = false;
3187 let isMultiSource = false;
3188 if (isRef(source)) {
3189 getter = () => source.value;
3190 forceTrigger = isShallow(source);
3191 }
3192 else if (isReactive(source)) {
3193 getter = () => source;
3194 deep = true;
3195 }
3196 else if (isArray(source)) {
3197 isMultiSource = true;
3198 forceTrigger = source.some(s => isReactive(s) || isShallow(s));
3199 getter = () => source.map(s => {
3200 if (isRef(s)) {
3201 return s.value;
3202 }
3203 else if (isReactive(s)) {
3204 return traverse(s);
3205 }
3206 else if (isFunction(s)) {
3207 return callWithErrorHandling(s, instance, 2 /* ErrorCodes.WATCH_GETTER */);
3208 }
3209 else {
3210 warnInvalidSource(s);
3211 }
3212 });
3213 }
3214 else if (isFunction(source)) {
3215 if (cb) {
3216 // getter with cb
3217 getter = () => callWithErrorHandling(source, instance, 2 /* ErrorCodes.WATCH_GETTER */);
3218 }
3219 else {
3220 // no cb -> simple effect
3221 getter = () => {
3222 if (instance && instance.isUnmounted) {
3223 return;
3224 }
3225 if (cleanup) {
3226 cleanup();
3227 }
3228 return callWithAsyncErrorHandling(source, instance, 3 /* ErrorCodes.WATCH_CALLBACK */, [onCleanup]);
3229 };
3230 }
3231 }
3232 else {
3233 getter = NOOP;
3234 warnInvalidSource(source);
3235 }
3236 if (cb && deep) {
3237 const baseGetter = getter;
3238 getter = () => traverse(baseGetter());
3239 }
3240 let cleanup;
3241 let onCleanup = (fn) => {
3242 cleanup = effect.onStop = () => {
3243 callWithErrorHandling(fn, instance, 4 /* ErrorCodes.WATCH_CLEANUP */);
3244 };
3245 };
3246 let oldValue = isMultiSource
3247 ? new Array(source.length).fill(INITIAL_WATCHER_VALUE)
3248 : INITIAL_WATCHER_VALUE;
3249 const job = () => {
3250 if (!effect.active) {
3251 return;
3252 }
3253 if (cb) {
3254 // watch(source, cb)
3255 const newValue = effect.run();
3256 if (deep ||
3257 forceTrigger ||
3258 (isMultiSource
3259 ? newValue.some((v, i) => hasChanged(v, oldValue[i]))
3260 : hasChanged(newValue, oldValue)) ||
3261 (false )) {
3262 // cleanup before running cb again
3263 if (cleanup) {
3264 cleanup();
3265 }
3266 callWithAsyncErrorHandling(cb, instance, 3 /* ErrorCodes.WATCH_CALLBACK */, [
3267 newValue,
3268 // pass undefined as the old value when it's changed for the first time
3269 oldValue === INITIAL_WATCHER_VALUE
3270 ? undefined
3271 : (isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE)
3272 ? []
3273 : oldValue,
3274 onCleanup
3275 ]);
3276 oldValue = newValue;
3277 }
3278 }
3279 else {
3280 // watchEffect
3281 effect.run();
3282 }
3283 };
3284 // important: mark the job as a watcher callback so that scheduler knows
3285 // it is allowed to self-trigger (#1727)
3286 job.allowRecurse = !!cb;
3287 let scheduler;
3288 if (flush === 'sync') {
3289 scheduler = job; // the scheduler function gets called directly
3290 }
3291 else if (flush === 'post') {
3292 scheduler = () => queuePostRenderEffect(job, instance && instance.suspense);
3293 }
3294 else {
3295 // default: 'pre'
3296 job.pre = true;
3297 if (instance)
3298 job.id = instance.uid;
3299 scheduler = () => queueJob(job);
3300 }
3301 const effect = new ReactiveEffect(getter, scheduler);
3302 {
3303 effect.onTrack = onTrack;
3304 effect.onTrigger = onTrigger;
3305 }
3306 // initial run
3307 if (cb) {
3308 if (immediate) {
3309 job();
3310 }
3311 else {
3312 oldValue = effect.run();
3313 }
3314 }
3315 else if (flush === 'post') {
3316 queuePostRenderEffect(effect.run.bind(effect), instance && instance.suspense);
3317 }
3318 else {
3319 effect.run();
3320 }
3321 const unwatch = () => {
3322 effect.stop();
3323 if (instance && instance.scope) {
3324 remove(instance.scope.effects, effect);
3325 }
3326 };
3327 return unwatch;
3328}
3329// this.$watch
3330function instanceWatch(source, value, options) {
3331 const publicThis = this.proxy;
3332 const getter = isString(source)
3333 ? source.includes('.')
3334 ? createPathGetter(publicThis, source)
3335 : () => publicThis[source]
3336 : source.bind(publicThis, publicThis);
3337 let cb;
3338 if (isFunction(value)) {
3339 cb = value;
3340 }
3341 else {
3342 cb = value.handler;
3343 options = value;
3344 }
3345 const cur = currentInstance;
3346 setCurrentInstance(this);
3347 const res = doWatch(getter, cb.bind(publicThis), options);
3348 if (cur) {
3349 setCurrentInstance(cur);
3350 }
3351 else {
3352 unsetCurrentInstance();
3353 }
3354 return res;
3355}
3356function createPathGetter(ctx, path) {
3357 const segments = path.split('.');
3358 return () => {
3359 let cur = ctx;
3360 for (let i = 0; i < segments.length && cur; i++) {
3361 cur = cur[segments[i]];
3362 }
3363 return cur;
3364 };
3365}
3366function traverse(value, seen) {
3367 if (!isObject(value) || value["__v_skip" /* ReactiveFlags.SKIP */]) {
3368 return value;
3369 }
3370 seen = seen || new Set();
3371 if (seen.has(value)) {
3372 return value;
3373 }
3374 seen.add(value);
3375 if (isRef(value)) {
3376 traverse(value.value, seen);
3377 }
3378 else if (isArray(value)) {
3379 for (let i = 0; i < value.length; i++) {
3380 traverse(value[i], seen);
3381 }
3382 }
3383 else if (isSet(value) || isMap(value)) {
3384 value.forEach((v) => {
3385 traverse(v, seen);
3386 });
3387 }
3388 else if (isPlainObject(value)) {
3389 for (const key in value) {
3390 traverse(value[key], seen);
3391 }
3392 }
3393 return value;
3394}
3395
3396function useTransitionState() {
3397 const state = {
3398 isMounted: false,
3399 isLeaving: false,
3400 isUnmounting: false,
3401 leavingVNodes: new Map()
3402 };
3403 onMounted(() => {
3404 state.isMounted = true;
3405 });
3406 onBeforeUnmount(() => {
3407 state.isUnmounting = true;
3408 });
3409 return state;
3410}
3411const TransitionHookValidator = [Function, Array];
3412const BaseTransitionImpl = {
3413 name: `BaseTransition`,
3414 props: {
3415 mode: String,
3416 appear: Boolean,
3417 persisted: Boolean,
3418 // enter
3419 onBeforeEnter: TransitionHookValidator,
3420 onEnter: TransitionHookValidator,
3421 onAfterEnter: TransitionHookValidator,
3422 onEnterCancelled: TransitionHookValidator,
3423 // leave
3424 onBeforeLeave: TransitionHookValidator,
3425 onLeave: TransitionHookValidator,
3426 onAfterLeave: TransitionHookValidator,
3427 onLeaveCancelled: TransitionHookValidator,
3428 // appear
3429 onBeforeAppear: TransitionHookValidator,
3430 onAppear: TransitionHookValidator,
3431 onAfterAppear: TransitionHookValidator,
3432 onAppearCancelled: TransitionHookValidator
3433 },
3434 setup(props, { slots }) {
3435 const instance = getCurrentInstance();
3436 const state = useTransitionState();
3437 let prevTransitionKey;
3438 return () => {
3439 const children = slots.default && getTransitionRawChildren(slots.default(), true);
3440 if (!children || !children.length) {
3441 return;
3442 }
3443 let child = children[0];
3444 if (children.length > 1) {
3445 let hasFound = false;
3446 // locate first non-comment child
3447 for (const c of children) {
3448 if (c.type !== Comment) {
3449 if (hasFound) {
3450 // warn more than one non-comment child
3451 warn$1('<transition> can only be used on a single element or component. ' +
3452 'Use <transition-group> for lists.');
3453 break;
3454 }
3455 child = c;
3456 hasFound = true;
3457 }
3458 }
3459 }
3460 // there's no need to track reactivity for these props so use the raw
3461 // props for a bit better perf
3462 const rawProps = toRaw(props);
3463 const { mode } = rawProps;
3464 // check mode
3465 if (mode &&
3466 mode !== 'in-out' &&
3467 mode !== 'out-in' &&
3468 mode !== 'default') {
3469 warn$1(`invalid <transition> mode: ${mode}`);
3470 }
3471 if (state.isLeaving) {
3472 return emptyPlaceholder(child);
3473 }
3474 // in the case of <transition><keep-alive/></transition>, we need to
3475 // compare the type of the kept-alive children.
3476 const innerChild = getKeepAliveChild(child);
3477 if (!innerChild) {
3478 return emptyPlaceholder(child);
3479 }
3480 const enterHooks = resolveTransitionHooks(innerChild, rawProps, state, instance);
3481 setTransitionHooks(innerChild, enterHooks);
3482 const oldChild = instance.subTree;
3483 const oldInnerChild = oldChild && getKeepAliveChild(oldChild);
3484 let transitionKeyChanged = false;
3485 const { getTransitionKey } = innerChild.type;
3486 if (getTransitionKey) {
3487 const key = getTransitionKey();
3488 if (prevTransitionKey === undefined) {
3489 prevTransitionKey = key;
3490 }
3491 else if (key !== prevTransitionKey) {
3492 prevTransitionKey = key;
3493 transitionKeyChanged = true;
3494 }
3495 }
3496 // handle mode
3497 if (oldInnerChild &&
3498 oldInnerChild.type !== Comment &&
3499 (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)) {
3500 const leavingHooks = resolveTransitionHooks(oldInnerChild, rawProps, state, instance);
3501 // update old tree's hooks in case of dynamic transition
3502 setTransitionHooks(oldInnerChild, leavingHooks);
3503 // switching between different views
3504 if (mode === 'out-in') {
3505 state.isLeaving = true;
3506 // return placeholder node and queue update when leave finishes
3507 leavingHooks.afterLeave = () => {
3508 state.isLeaving = false;
3509 // #6835
3510 // it also needs to be updated when active is undefined
3511 if (instance.update.active !== false) {
3512 instance.update();
3513 }
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
3537const BaseTransition = BaseTransitionImpl;
3538function 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.
3549function 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 /* ErrorCodes.TRANSITION_HOOK */, args);
3556 };
3557 const callAsyncHook = (hook, args) => {
3558 const done = args[1];
3559 callHook(hook, args);
3560 if (isArray(hook)) {
3561 if (hook.every(hook => hook.length <= 1))
3562 done();
3563 }
3564 else if (hook.length <= 1) {
3565 done();
3566 }
3567 };
3568 const hooks = {
3569 mode,
3570 persisted,
3571 beforeEnter(el) {
3572 let hook = onBeforeEnter;
3573 if (!state.isMounted) {
3574 if (appear) {
3575 hook = onBeforeAppear || onBeforeEnter;
3576 }
3577 else {
3578 return;
3579 }
3580 }
3581 // for same element (v-show)
3582 if (el._leaveCb) {
3583 el._leaveCb(true /* cancelled */);
3584 }
3585 // for toggled element with same key (v-if)
3586 const leavingVNode = leavingVNodesCache[key];
3587 if (leavingVNode &&
3588 isSameVNodeType(vnode, leavingVNode) &&
3589 leavingVNode.el._leaveCb) {
3590 // force early removal (not cancelled)
3591 leavingVNode.el._leaveCb();
3592 }
3593 callHook(hook, [el]);
3594 },
3595 enter(el) {
3596 let hook = onEnter;
3597 let afterHook = onAfterEnter;
3598 let cancelHook = onEnterCancelled;
3599 if (!state.isMounted) {
3600 if (appear) {
3601 hook = onAppear || onEnter;
3602 afterHook = onAfterAppear || onAfterEnter;
3603 cancelHook = onAppearCancelled || onEnterCancelled;
3604 }
3605 else {
3606 return;
3607 }
3608 }
3609 let called = false;
3610 const done = (el._enterCb = (cancelled) => {
3611 if (called)
3612 return;
3613 called = true;
3614 if (cancelled) {
3615 callHook(cancelHook, [el]);
3616 }
3617 else {
3618 callHook(afterHook, [el]);
3619 }
3620 if (hooks.delayedLeave) {
3621 hooks.delayedLeave();
3622 }
3623 el._enterCb = undefined;
3624 });
3625 if (hook) {
3626 callAsyncHook(hook, [el, done]);
3627 }
3628 else {
3629 done();
3630 }
3631 },
3632 leave(el, remove) {
3633 const key = String(vnode.key);
3634 if (el._enterCb) {
3635 el._enterCb(true /* cancelled */);
3636 }
3637 if (state.isUnmounting) {
3638 return remove();
3639 }
3640 callHook(onBeforeLeave, [el]);
3641 let called = false;
3642 const done = (el._leaveCb = (cancelled) => {
3643 if (called)
3644 return;
3645 called = true;
3646 remove();
3647 if (cancelled) {
3648 callHook(onLeaveCancelled, [el]);
3649 }
3650 else {
3651 callHook(onAfterLeave, [el]);
3652 }
3653 el._leaveCb = undefined;
3654 if (leavingVNodesCache[key] === vnode) {
3655 delete leavingVNodesCache[key];
3656 }
3657 });
3658 leavingVNodesCache[key] = vnode;
3659 if (onLeave) {
3660 callAsyncHook(onLeave, [el, done]);
3661 }
3662 else {
3663 done();
3664 }
3665 },
3666 clone(vnode) {
3667 return resolveTransitionHooks(vnode, props, state, instance);
3668 }
3669 };
3670 return hooks;
3671}
3672// the placeholder really only handles one special case: KeepAlive
3673// in the case of a KeepAlive in a leave phase we need to return a KeepAlive
3674// placeholder with empty content to avoid the KeepAlive instance from being
3675// unmounted.
3676function emptyPlaceholder(vnode) {
3677 if (isKeepAlive(vnode)) {
3678 vnode = cloneVNode(vnode);
3679 vnode.children = null;
3680 return vnode;
3681 }
3682}
3683function getKeepAliveChild(vnode) {
3684 return isKeepAlive(vnode)
3685 ? vnode.children
3686 ? vnode.children[0]
3687 : undefined
3688 : vnode;
3689}
3690function setTransitionHooks(vnode, hooks) {
3691 if (vnode.shapeFlag & 6 /* ShapeFlags.COMPONENT */ && vnode.component) {
3692 setTransitionHooks(vnode.component.subTree, hooks);
3693 }
3694 else if (vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
3695 vnode.ssContent.transition = hooks.clone(vnode.ssContent);
3696 vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
3697 }
3698 else {
3699 vnode.transition = hooks;
3700 }
3701}
3702function getTransitionRawChildren(children, keepComment = false, parentKey) {
3703 let ret = [];
3704 let keyedFragmentCount = 0;
3705 for (let i = 0; i < children.length; i++) {
3706 let child = children[i];
3707 // #5360 inherit parent key in case of <template v-for>
3708 const key = parentKey == null
3709 ? child.key
3710 : String(parentKey) + String(child.key != null ? child.key : i);
3711 // handle fragment children case, e.g. v-for
3712 if (child.type === Fragment) {
3713 if (child.patchFlag & 128 /* PatchFlags.KEYED_FRAGMENT */)
3714 keyedFragmentCount++;
3715 ret = ret.concat(getTransitionRawChildren(child.children, keepComment, key));
3716 }
3717 // comment placeholders should be skipped, e.g. v-if
3718 else if (keepComment || child.type !== Comment) {
3719 ret.push(key != null ? cloneVNode(child, { key }) : child);
3720 }
3721 }
3722 // #1126 if a transition children list contains multiple sub fragments, these
3723 // fragments will be merged into a flat children array. Since each v-for
3724 // fragment may contain different static bindings inside, we need to de-op
3725 // these children to force full diffs to ensure correct behavior.
3726 if (keyedFragmentCount > 1) {
3727 for (let i = 0; i < ret.length; i++) {
3728 ret[i].patchFlag = -2 /* PatchFlags.BAIL */;
3729 }
3730 }
3731 return ret;
3732}
3733
3734// implementation, close to no-op
3735function defineComponent(options) {
3736 return isFunction(options) ? { setup: options, name: options.name } : options;
3737}
3738
3739const isAsyncWrapper = (i) => !!i.type.__asyncLoader;
3740function defineAsyncComponent(source) {
3741 if (isFunction(source)) {
3742 source = { loader: source };
3743 }
3744 const { loader, loadingComponent, errorComponent, delay = 200, timeout, // undefined = never times out
3745 suspensible = true, onError: userOnError } = source;
3746 let pendingRequest = null;
3747 let resolvedComp;
3748 let retries = 0;
3749 const retry = () => {
3750 retries++;
3751 pendingRequest = null;
3752 return load();
3753 };
3754 const load = () => {
3755 let thisRequest;
3756 return (pendingRequest ||
3757 (thisRequest = pendingRequest =
3758 loader()
3759 .catch(err => {
3760 err = err instanceof Error ? err : new Error(String(err));
3761 if (userOnError) {
3762 return new Promise((resolve, reject) => {
3763 const userRetry = () => resolve(retry());
3764 const userFail = () => reject(err);
3765 userOnError(err, userRetry, userFail, retries + 1);
3766 });
3767 }
3768 else {
3769 throw err;
3770 }
3771 })
3772 .then((comp) => {
3773 if (thisRequest !== pendingRequest && pendingRequest) {
3774 return pendingRequest;
3775 }
3776 if (!comp) {
3777 warn$1(`Async component loader resolved to undefined. ` +
3778 `If you are using retry(), make sure to return its return value.`);
3779 }
3780 // interop module default
3781 if (comp &&
3782 (comp.__esModule || comp[Symbol.toStringTag] === 'Module')) {
3783 comp = comp.default;
3784 }
3785 if (comp && !isObject(comp) && !isFunction(comp)) {
3786 throw new Error(`Invalid async component load result: ${comp}`);
3787 }
3788 resolvedComp = comp;
3789 return comp;
3790 })));
3791 };
3792 return defineComponent({
3793 name: 'AsyncComponentWrapper',
3794 __asyncLoader: load,
3795 get __asyncResolved() {
3796 return resolvedComp;
3797 },
3798 setup() {
3799 const instance = currentInstance;
3800 // already resolved
3801 if (resolvedComp) {
3802 return () => createInnerComp(resolvedComp, instance);
3803 }
3804 const onError = (err) => {
3805 pendingRequest = null;
3806 handleError(err, instance, 13 /* ErrorCodes.ASYNC_COMPONENT_LOADER */, !errorComponent /* do not throw in dev if user provided error component */);
3807 };
3808 // suspense-controlled or SSR.
3809 if ((suspensible && instance.suspense) ||
3810 (false )) {
3811 return load()
3812 .then(comp => {
3813 return () => createInnerComp(comp, instance);
3814 })
3815 .catch(err => {
3816 onError(err);
3817 return () => errorComponent
3818 ? createVNode(errorComponent, {
3819 error: err
3820 })
3821 : null;
3822 });
3823 }
3824 const loaded = ref(false);
3825 const error = ref();
3826 const delayed = ref(!!delay);
3827 if (delay) {
3828 setTimeout(() => {
3829 delayed.value = false;
3830 }, delay);
3831 }
3832 if (timeout != null) {
3833 setTimeout(() => {
3834 if (!loaded.value && !error.value) {
3835 const err = new Error(`Async component timed out after ${timeout}ms.`);
3836 onError(err);
3837 error.value = err;
3838 }
3839 }, timeout);
3840 }
3841 load()
3842 .then(() => {
3843 loaded.value = true;
3844 if (instance.parent && isKeepAlive(instance.parent.vnode)) {
3845 // parent is keep-alive, force update so the loaded component's
3846 // name is taken into account
3847 queueJob(instance.parent.update);
3848 }
3849 })
3850 .catch(err => {
3851 onError(err);
3852 error.value = err;
3853 });
3854 return () => {
3855 if (loaded.value && resolvedComp) {
3856 return createInnerComp(resolvedComp, instance);
3857 }
3858 else if (error.value && errorComponent) {
3859 return createVNode(errorComponent, {
3860 error: error.value
3861 });
3862 }
3863 else if (loadingComponent && !delayed.value) {
3864 return createVNode(loadingComponent);
3865 }
3866 };
3867 }
3868 });
3869}
3870function createInnerComp(comp, parent) {
3871 const { ref, props, children, ce } = parent.vnode;
3872 const vnode = createVNode(comp, props, children);
3873 // ensure inner component inherits the async wrapper's ref owner
3874 vnode.ref = ref;
3875 // pass the custom element callback on to the inner comp
3876 // and remove it from the async wrapper
3877 vnode.ce = ce;
3878 delete parent.vnode.ce;
3879 return vnode;
3880}
3881
3882const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
3883const KeepAliveImpl = {
3884 name: `KeepAlive`,
3885 // Marker for special handling inside the renderer. We are not using a ===
3886 // check directly on KeepAlive in the renderer, because importing it directly
3887 // would prevent it from being tree-shaken.
3888 __isKeepAlive: true,
3889 props: {
3890 include: [String, RegExp, Array],
3891 exclude: [String, RegExp, Array],
3892 max: [String, Number]
3893 },
3894 setup(props, { slots }) {
3895 const instance = getCurrentInstance();
3896 // KeepAlive communicates with the instantiated renderer via the
3897 // ctx where the renderer passes in its internals,
3898 // and the KeepAlive instance exposes activate/deactivate implementations.
3899 // The whole point of this is to avoid importing KeepAlive directly in the
3900 // renderer to facilitate tree-shaking.
3901 const sharedContext = instance.ctx;
3902 const cache = new Map();
3903 const keys = new Set();
3904 let current = null;
3905 {
3906 instance.__v_cache = cache;
3907 }
3908 const parentSuspense = instance.suspense;
3909 const { renderer: { p: patch, m: move, um: _unmount, o: { createElement } } } = sharedContext;
3910 const storageContainer = createElement('div');
3911 sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => {
3912 const instance = vnode.component;
3913 move(vnode, container, anchor, 0 /* MoveType.ENTER */, parentSuspense);
3914 // in case props have changed
3915 patch(instance.vnode, vnode, container, anchor, instance, parentSuspense, isSVG, vnode.slotScopeIds, optimized);
3916 queuePostRenderEffect(() => {
3917 instance.isDeactivated = false;
3918 if (instance.a) {
3919 invokeArrayFns(instance.a);
3920 }
3921 const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
3922 if (vnodeHook) {
3923 invokeVNodeHook(vnodeHook, instance.parent, vnode);
3924 }
3925 }, parentSuspense);
3926 {
3927 // Update components tree
3928 devtoolsComponentAdded(instance);
3929 }
3930 };
3931 sharedContext.deactivate = (vnode) => {
3932 const instance = vnode.component;
3933 move(vnode, storageContainer, null, 1 /* MoveType.LEAVE */, parentSuspense);
3934 queuePostRenderEffect(() => {
3935 if (instance.da) {
3936 invokeArrayFns(instance.da);
3937 }
3938 const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
3939 if (vnodeHook) {
3940 invokeVNodeHook(vnodeHook, instance.parent, vnode);
3941 }
3942 instance.isDeactivated = true;
3943 }, parentSuspense);
3944 {
3945 // Update components tree
3946 devtoolsComponentAdded(instance);
3947 }
3948 };
3949 function unmount(vnode) {
3950 // reset the shapeFlag so it can be properly unmounted
3951 resetShapeFlag(vnode);
3952 _unmount(vnode, instance, parentSuspense, true);
3953 }
3954 function pruneCache(filter) {
3955 cache.forEach((vnode, key) => {
3956 const name = getComponentName(vnode.type);
3957 if (name && (!filter || !filter(name))) {
3958 pruneCacheEntry(key);
3959 }
3960 });
3961 }
3962 function pruneCacheEntry(key) {
3963 const cached = cache.get(key);
3964 if (!current || cached.type !== current.type) {
3965 unmount(cached);
3966 }
3967 else if (current) {
3968 // current active instance should no longer be kept-alive.
3969 // we can't unmount it now but it might be later, so reset its flag now.
3970 resetShapeFlag(current);
3971 }
3972 cache.delete(key);
3973 keys.delete(key);
3974 }
3975 // prune cache on include/exclude prop change
3976 watch(() => [props.include, props.exclude], ([include, exclude]) => {
3977 include && pruneCache(name => matches(include, name));
3978 exclude && pruneCache(name => !matches(exclude, name));
3979 },
3980 // prune post-render after `current` has been updated
3981 { flush: 'post', deep: true });
3982 // cache sub tree after render
3983 let pendingCacheKey = null;
3984 const cacheSubtree = () => {
3985 // fix #1621, the pendingCacheKey could be 0
3986 if (pendingCacheKey != null) {
3987 cache.set(pendingCacheKey, getInnerChild(instance.subTree));
3988 }
3989 };
3990 onMounted(cacheSubtree);
3991 onUpdated(cacheSubtree);
3992 onBeforeUnmount(() => {
3993 cache.forEach(cached => {
3994 const { subTree, suspense } = instance;
3995 const vnode = getInnerChild(subTree);
3996 if (cached.type === vnode.type) {
3997 // current instance will be unmounted as part of keep-alive's unmount
3998 resetShapeFlag(vnode);
3999 // but invoke its deactivated hook here
4000 const da = vnode.component.da;
4001 da && queuePostRenderEffect(da, suspense);
4002 return;
4003 }
4004 unmount(cached);
4005 });
4006 });
4007 return () => {
4008 pendingCacheKey = null;
4009 if (!slots.default) {
4010 return null;
4011 }
4012 const children = slots.default();
4013 const rawVNode = children[0];
4014 if (children.length > 1) {
4015 {
4016 warn$1(`KeepAlive should contain exactly one component child.`);
4017 }
4018 current = null;
4019 return children;
4020 }
4021 else if (!isVNode(rawVNode) ||
4022 (!(rawVNode.shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */) &&
4023 !(rawVNode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */))) {
4024 current = null;
4025 return rawVNode;
4026 }
4027 let vnode = getInnerChild(rawVNode);
4028 const comp = vnode.type;
4029 // for async components, name check should be based in its loaded
4030 // inner component if available
4031 const name = getComponentName(isAsyncWrapper(vnode)
4032 ? vnode.type.__asyncResolved || {}
4033 : comp);
4034 const { include, exclude, max } = props;
4035 if ((include && (!name || !matches(include, name))) ||
4036 (exclude && name && matches(exclude, name))) {
4037 current = vnode;
4038 return rawVNode;
4039 }
4040 const key = vnode.key == null ? comp : vnode.key;
4041 const cachedVNode = cache.get(key);
4042 // clone vnode if it's reused because we are going to mutate it
4043 if (vnode.el) {
4044 vnode = cloneVNode(vnode);
4045 if (rawVNode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
4046 rawVNode.ssContent = vnode;
4047 }
4048 }
4049 // #1513 it's possible for the returned vnode to be cloned due to attr
4050 // fallthrough or scopeId, so the vnode here may not be the final vnode
4051 // that is mounted. Instead of caching it directly, we store the pending
4052 // key and cache `instance.subTree` (the normalized vnode) in
4053 // beforeMount/beforeUpdate hooks.
4054 pendingCacheKey = key;
4055 if (cachedVNode) {
4056 // copy over mounted state
4057 vnode.el = cachedVNode.el;
4058 vnode.component = cachedVNode.component;
4059 if (vnode.transition) {
4060 // recursively update transition hooks on subTree
4061 setTransitionHooks(vnode, vnode.transition);
4062 }
4063 // avoid vnode being mounted as fresh
4064 vnode.shapeFlag |= 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
4065 // make this key the freshest
4066 keys.delete(key);
4067 keys.add(key);
4068 }
4069 else {
4070 keys.add(key);
4071 // prune oldest entry
4072 if (max && keys.size > parseInt(max, 10)) {
4073 pruneCacheEntry(keys.values().next().value);
4074 }
4075 }
4076 // avoid vnode being unmounted
4077 vnode.shapeFlag |= 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
4078 current = vnode;
4079 return isSuspense(rawVNode.type) ? rawVNode : vnode;
4080 };
4081 }
4082};
4083// export the public type for h/tsx inference
4084// also to avoid inline import() in generated d.ts files
4085const KeepAlive = KeepAliveImpl;
4086function matches(pattern, name) {
4087 if (isArray(pattern)) {
4088 return pattern.some((p) => matches(p, name));
4089 }
4090 else if (isString(pattern)) {
4091 return pattern.split(',').includes(name);
4092 }
4093 else if (pattern.test) {
4094 return pattern.test(name);
4095 }
4096 /* istanbul ignore next */
4097 return false;
4098}
4099function onActivated(hook, target) {
4100 registerKeepAliveHook(hook, "a" /* LifecycleHooks.ACTIVATED */, target);
4101}
4102function onDeactivated(hook, target) {
4103 registerKeepAliveHook(hook, "da" /* LifecycleHooks.DEACTIVATED */, target);
4104}
4105function registerKeepAliveHook(hook, type, target = currentInstance) {
4106 // cache the deactivate branch check wrapper for injected hooks so the same
4107 // hook can be properly deduped by the scheduler. "__wdc" stands for "with
4108 // deactivation check".
4109 const wrappedHook = hook.__wdc ||
4110 (hook.__wdc = () => {
4111 // only fire the hook if the target instance is NOT in a deactivated branch.
4112 let current = target;
4113 while (current) {
4114 if (current.isDeactivated) {
4115 return;
4116 }
4117 current = current.parent;
4118 }
4119 return hook();
4120 });
4121 injectHook(type, wrappedHook, target);
4122 // In addition to registering it on the target instance, we walk up the parent
4123 // chain and register it on all ancestor instances that are keep-alive roots.
4124 // This avoids the need to walk the entire component tree when invoking these
4125 // hooks, and more importantly, avoids the need to track child components in
4126 // arrays.
4127 if (target) {
4128 let current = target.parent;
4129 while (current && current.parent) {
4130 if (isKeepAlive(current.parent.vnode)) {
4131 injectToKeepAliveRoot(wrappedHook, type, target, current);
4132 }
4133 current = current.parent;
4134 }
4135 }
4136}
4137function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
4138 // injectHook wraps the original for error handling, so make sure to remove
4139 // the wrapped version.
4140 const injected = injectHook(type, hook, keepAliveRoot, true /* prepend */);
4141 onUnmounted(() => {
4142 remove(keepAliveRoot[type], injected);
4143 }, target);
4144}
4145function resetShapeFlag(vnode) {
4146 // bitwise operations to remove keep alive flags
4147 vnode.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
4148 vnode.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
4149}
4150function getInnerChild(vnode) {
4151 return vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */ ? vnode.ssContent : vnode;
4152}
4153
4154function injectHook(type, hook, target = currentInstance, prepend = false) {
4155 if (target) {
4156 const hooks = target[type] || (target[type] = []);
4157 // cache the error handling wrapper for injected hooks so the same hook
4158 // can be properly deduped by the scheduler. "__weh" stands for "with error
4159 // handling".
4160 const wrappedHook = hook.__weh ||
4161 (hook.__weh = (...args) => {
4162 if (target.isUnmounted) {
4163 return;
4164 }
4165 // disable tracking inside all lifecycle hooks
4166 // since they can potentially be called inside effects.
4167 pauseTracking();
4168 // Set currentInstance during hook invocation.
4169 // This assumes the hook does not synchronously trigger other hooks, which
4170 // can only be false when the user does something really funky.
4171 setCurrentInstance(target);
4172 const res = callWithAsyncErrorHandling(hook, target, type, args);
4173 unsetCurrentInstance();
4174 resetTracking();
4175 return res;
4176 });
4177 if (prepend) {
4178 hooks.unshift(wrappedHook);
4179 }
4180 else {
4181 hooks.push(wrappedHook);
4182 }
4183 return wrappedHook;
4184 }
4185 else {
4186 const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
4187 warn$1(`${apiName} is called when there is no active component instance to be ` +
4188 `associated with. ` +
4189 `Lifecycle injection APIs can only be used during execution of setup().` +
4190 (` If you are using async setup(), make sure to register lifecycle ` +
4191 `hooks before the first await statement.`
4192 ));
4193 }
4194}
4195const createHook = (lifecycle) => (hook, target = currentInstance) =>
4196// post-create lifecycle registrations are noops during SSR (except for serverPrefetch)
4197(!isInSSRComponentSetup || lifecycle === "sp" /* LifecycleHooks.SERVER_PREFETCH */) &&
4198 injectHook(lifecycle, (...args) => hook(...args), target);
4199const onBeforeMount = createHook("bm" /* LifecycleHooks.BEFORE_MOUNT */);
4200const onMounted = createHook("m" /* LifecycleHooks.MOUNTED */);
4201const onBeforeUpdate = createHook("bu" /* LifecycleHooks.BEFORE_UPDATE */);
4202const onUpdated = createHook("u" /* LifecycleHooks.UPDATED */);
4203const onBeforeUnmount = createHook("bum" /* LifecycleHooks.BEFORE_UNMOUNT */);
4204const onUnmounted = createHook("um" /* LifecycleHooks.UNMOUNTED */);
4205const onServerPrefetch = createHook("sp" /* LifecycleHooks.SERVER_PREFETCH */);
4206const onRenderTriggered = createHook("rtg" /* LifecycleHooks.RENDER_TRIGGERED */);
4207const onRenderTracked = createHook("rtc" /* LifecycleHooks.RENDER_TRACKED */);
4208function onErrorCaptured(hook, target = currentInstance) {
4209 injectHook("ec" /* LifecycleHooks.ERROR_CAPTURED */, hook, target);
4210}
4211
4212/**
4213Runtime helper for applying directives to a vnode. Example usage:
4214
4215const comp = resolveComponent('comp')
4216const foo = resolveDirective('foo')
4217const bar = resolveDirective('bar')
4218
4219return withDirectives(h(comp), [
4220 [foo, this.x],
4221 [bar, this.y]
4222])
4223*/
4224function validateDirectiveName(name) {
4225 if (isBuiltInDirective(name)) {
4226 warn$1('Do not use built-in directive ids as custom directive id: ' + name);
4227 }
4228}
4229/**
4230 * Adds directives to a VNode.
4231 */
4232function withDirectives(vnode, directives) {
4233 const internalInstance = currentRenderingInstance;
4234 if (internalInstance === null) {
4235 warn$1(`withDirectives can only be used inside render functions.`);
4236 return vnode;
4237 }
4238 const instance = getExposeProxy(internalInstance) ||
4239 internalInstance.proxy;
4240 const bindings = vnode.dirs || (vnode.dirs = []);
4241 for (let i = 0; i < directives.length; i++) {
4242 let [dir, value, arg, modifiers = EMPTY_OBJ] = directives[i];
4243 if (dir) {
4244 if (isFunction(dir)) {
4245 dir = {
4246 mounted: dir,
4247 updated: dir
4248 };
4249 }
4250 if (dir.deep) {
4251 traverse(value);
4252 }
4253 bindings.push({
4254 dir,
4255 instance,
4256 value,
4257 oldValue: void 0,
4258 arg,
4259 modifiers
4260 });
4261 }
4262 }
4263 return vnode;
4264}
4265function invokeDirectiveHook(vnode, prevVNode, instance, name) {
4266 const bindings = vnode.dirs;
4267 const oldBindings = prevVNode && prevVNode.dirs;
4268 for (let i = 0; i < bindings.length; i++) {
4269 const binding = bindings[i];
4270 if (oldBindings) {
4271 binding.oldValue = oldBindings[i].value;
4272 }
4273 let hook = binding.dir[name];
4274 if (hook) {
4275 // disable tracking inside all lifecycle hooks
4276 // since they can potentially be called inside effects.
4277 pauseTracking();
4278 callWithAsyncErrorHandling(hook, instance, 8 /* ErrorCodes.DIRECTIVE_HOOK */, [
4279 vnode.el,
4280 binding,
4281 vnode,
4282 prevVNode
4283 ]);
4284 resetTracking();
4285 }
4286 }
4287}
4288
4289const COMPONENTS = 'components';
4290const DIRECTIVES = 'directives';
4291/**
4292 * @private
4293 */
4294function resolveComponent(name, maybeSelfReference) {
4295 return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
4296}
4297const NULL_DYNAMIC_COMPONENT = Symbol();
4298/**
4299 * @private
4300 */
4301function resolveDynamicComponent(component) {
4302 if (isString(component)) {
4303 return resolveAsset(COMPONENTS, component, false) || component;
4304 }
4305 else {
4306 // invalid types will fallthrough to createVNode and raise warning
4307 return (component || NULL_DYNAMIC_COMPONENT);
4308 }
4309}
4310/**
4311 * @private
4312 */
4313function resolveDirective(name) {
4314 return resolveAsset(DIRECTIVES, name);
4315}
4316// implementation
4317function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
4318 const instance = currentRenderingInstance || currentInstance;
4319 if (instance) {
4320 const Component = instance.type;
4321 // explicit self name has highest priority
4322 if (type === COMPONENTS) {
4323 const selfName = getComponentName(Component, false /* do not include inferred name to avoid breaking existing code */);
4324 if (selfName &&
4325 (selfName === name ||
4326 selfName === camelize(name) ||
4327 selfName === capitalize(camelize(name)))) {
4328 return Component;
4329 }
4330 }
4331 const res =
4332 // local registration
4333 // check instance[type] first which is resolved for options API
4334 resolve(instance[type] || Component[type], name) ||
4335 // global registration
4336 resolve(instance.appContext[type], name);
4337 if (!res && maybeSelfReference) {
4338 // fallback to implicit self-reference
4339 return Component;
4340 }
4341 if (warnMissing && !res) {
4342 const extra = type === COMPONENTS
4343 ? `\nIf this is a native custom element, make sure to exclude it from ` +
4344 `component resolution via compilerOptions.isCustomElement.`
4345 : ``;
4346 warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
4347 }
4348 return res;
4349 }
4350 else {
4351 warn$1(`resolve${capitalize(type.slice(0, -1))} ` +
4352 `can only be used in render() or setup().`);
4353 }
4354}
4355function resolve(registry, name) {
4356 return (registry &&
4357 (registry[name] ||
4358 registry[camelize(name)] ||
4359 registry[capitalize(camelize(name))]));
4360}
4361
4362/**
4363 * Actual implementation
4364 */
4365function renderList(source, renderItem, cache, index) {
4366 let ret;
4367 const cached = (cache && cache[index]);
4368 if (isArray(source) || isString(source)) {
4369 ret = new Array(source.length);
4370 for (let i = 0, l = source.length; i < l; i++) {
4371 ret[i] = renderItem(source[i], i, undefined, cached && cached[i]);
4372 }
4373 }
4374 else if (typeof source === 'number') {
4375 if (!Number.isInteger(source)) {
4376 warn$1(`The v-for range expect an integer value but got ${source}.`);
4377 }
4378 ret = new Array(source);
4379 for (let i = 0; i < source; i++) {
4380 ret[i] = renderItem(i + 1, i, undefined, cached && cached[i]);
4381 }
4382 }
4383 else if (isObject(source)) {
4384 if (source[Symbol.iterator]) {
4385 ret = Array.from(source, (item, i) => renderItem(item, i, undefined, cached && cached[i]));
4386 }
4387 else {
4388 const keys = Object.keys(source);
4389 ret = new Array(keys.length);
4390 for (let i = 0, l = keys.length; i < l; i++) {
4391 const key = keys[i];
4392 ret[i] = renderItem(source[key], key, i, cached && cached[i]);
4393 }
4394 }
4395 }
4396 else {
4397 ret = [];
4398 }
4399 if (cache) {
4400 cache[index] = ret;
4401 }
4402 return ret;
4403}
4404
4405/**
4406 * Compiler runtime helper for creating dynamic slots object
4407 * @private
4408 */
4409function createSlots(slots, dynamicSlots) {
4410 for (let i = 0; i < dynamicSlots.length; i++) {
4411 const slot = dynamicSlots[i];
4412 // array of dynamic slot generated by <template v-for="..." #[...]>
4413 if (isArray(slot)) {
4414 for (let j = 0; j < slot.length; j++) {
4415 slots[slot[j].name] = slot[j].fn;
4416 }
4417 }
4418 else if (slot) {
4419 // conditional single slot generated by <template v-if="..." #foo>
4420 slots[slot.name] = slot.key
4421 ? (...args) => {
4422 const res = slot.fn(...args);
4423 // attach branch key so each conditional branch is considered a
4424 // different fragment
4425 if (res)
4426 res.key = slot.key;
4427 return res;
4428 }
4429 : slot.fn;
4430 }
4431 }
4432 return slots;
4433}
4434
4435/**
4436 * Compiler runtime helper for rendering `<slot/>`
4437 * @private
4438 */
4439function renderSlot(slots, name, props = {},
4440// this is not a user-facing function, so the fallback is always generated by
4441// the compiler and guaranteed to be a function returning an array
4442fallback, noSlotted) {
4443 if (currentRenderingInstance.isCE ||
4444 (currentRenderingInstance.parent &&
4445 isAsyncWrapper(currentRenderingInstance.parent) &&
4446 currentRenderingInstance.parent.isCE)) {
4447 if (name !== 'default')
4448 props.name = name;
4449 return createVNode('slot', props, fallback && fallback());
4450 }
4451 let slot = slots[name];
4452 if (slot && slot.length > 1) {
4453 warn$1(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
4454 `function. You need to mark this component with $dynamic-slots in the ` +
4455 `parent template.`);
4456 slot = () => [];
4457 }
4458 // a compiled slot disables block tracking by default to avoid manual
4459 // invocation interfering with template-based block tracking, but in
4460 // `renderSlot` we can be sure that it's template-based so we can force
4461 // enable it.
4462 if (slot && slot._c) {
4463 slot._d = false;
4464 }
4465 openBlock();
4466 const validSlotContent = slot && ensureValidVNode(slot(props));
4467 const rendered = createBlock(Fragment, {
4468 key: props.key ||
4469 // slot content array of a dynamic conditional slot may have a branch
4470 // key attached in the `createSlots` helper, respect that
4471 (validSlotContent && validSlotContent.key) ||
4472 `_${name}`
4473 }, validSlotContent || (fallback ? fallback() : []), validSlotContent && slots._ === 1 /* SlotFlags.STABLE */
4474 ? 64 /* PatchFlags.STABLE_FRAGMENT */
4475 : -2 /* PatchFlags.BAIL */);
4476 if (!noSlotted && rendered.scopeId) {
4477 rendered.slotScopeIds = [rendered.scopeId + '-s'];
4478 }
4479 if (slot && slot._c) {
4480 slot._d = true;
4481 }
4482 return rendered;
4483}
4484function ensureValidVNode(vnodes) {
4485 return vnodes.some(child => {
4486 if (!isVNode(child))
4487 return true;
4488 if (child.type === Comment)
4489 return false;
4490 if (child.type === Fragment &&
4491 !ensureValidVNode(child.children))
4492 return false;
4493 return true;
4494 })
4495 ? vnodes
4496 : null;
4497}
4498
4499/**
4500 * For prefixing keys in v-on="obj" with "on"
4501 * @private
4502 */
4503function toHandlers(obj, preserveCaseIfNecessary) {
4504 const ret = {};
4505 if (!isObject(obj)) {
4506 warn$1(`v-on with no argument expects an object value.`);
4507 return ret;
4508 }
4509 for (const key in obj) {
4510 ret[preserveCaseIfNecessary && /[A-Z]/.test(key)
4511 ? `on:${key}`
4512 : toHandlerKey(key)] = obj[key];
4513 }
4514 return ret;
4515}
4516
4517/**
4518 * #2437 In Vue 3, functional components do not have a public instance proxy but
4519 * they exist in the internal parent chain. For code that relies on traversing
4520 * public $parent chains, skip functional ones and go to the parent instead.
4521 */
4522const getPublicInstance = (i) => {
4523 if (!i)
4524 return null;
4525 if (isStatefulComponent(i))
4526 return getExposeProxy(i) || i.proxy;
4527 return getPublicInstance(i.parent);
4528};
4529const publicPropertiesMap =
4530// Move PURE marker to new line to workaround compiler discarding it
4531// due to type annotation
4532/*#__PURE__*/ extend(Object.create(null), {
4533 $: i => i,
4534 $el: i => i.vnode.el,
4535 $data: i => i.data,
4536 $props: i => (shallowReadonly(i.props) ),
4537 $attrs: i => (shallowReadonly(i.attrs) ),
4538 $slots: i => (shallowReadonly(i.slots) ),
4539 $refs: i => (shallowReadonly(i.refs) ),
4540 $parent: i => getPublicInstance(i.parent),
4541 $root: i => getPublicInstance(i.root),
4542 $emit: i => i.emit,
4543 $options: i => (resolveMergedOptions(i) ),
4544 $forceUpdate: i => i.f || (i.f = () => queueJob(i.update)),
4545 $nextTick: i => i.n || (i.n = nextTick.bind(i.proxy)),
4546 $watch: i => (instanceWatch.bind(i) )
4547});
4548const isReservedPrefix = (key) => key === '_' || key === '$';
4549const hasSetupBinding = (state, key) => state !== EMPTY_OBJ && !state.__isScriptSetup && hasOwn(state, key);
4550const PublicInstanceProxyHandlers = {
4551 get({ _: instance }, key) {
4552 const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
4553 // for internal formatters to know that this is a Vue instance
4554 if (key === '__isVue') {
4555 return true;
4556 }
4557 // data / props / ctx
4558 // This getter gets called for every property access on the render context
4559 // during render and is a major hotspot. The most expensive part of this
4560 // is the multiple hasOwn() calls. It's much faster to do a simple property
4561 // access on a plain object, so we use an accessCache object (with null
4562 // prototype) to memoize what access type a key corresponds to.
4563 let normalizedProps;
4564 if (key[0] !== '$') {
4565 const n = accessCache[key];
4566 if (n !== undefined) {
4567 switch (n) {
4568 case 1 /* AccessTypes.SETUP */:
4569 return setupState[key];
4570 case 2 /* AccessTypes.DATA */:
4571 return data[key];
4572 case 4 /* AccessTypes.CONTEXT */:
4573 return ctx[key];
4574 case 3 /* AccessTypes.PROPS */:
4575 return props[key];
4576 // default: just fallthrough
4577 }
4578 }
4579 else if (hasSetupBinding(setupState, key)) {
4580 accessCache[key] = 1 /* AccessTypes.SETUP */;
4581 return setupState[key];
4582 }
4583 else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
4584 accessCache[key] = 2 /* AccessTypes.DATA */;
4585 return data[key];
4586 }
4587 else if (
4588 // only cache other properties when instance has declared (thus stable)
4589 // props
4590 (normalizedProps = instance.propsOptions[0]) &&
4591 hasOwn(normalizedProps, key)) {
4592 accessCache[key] = 3 /* AccessTypes.PROPS */;
4593 return props[key];
4594 }
4595 else if (ctx !== EMPTY_OBJ && hasOwn(ctx, key)) {
4596 accessCache[key] = 4 /* AccessTypes.CONTEXT */;
4597 return ctx[key];
4598 }
4599 else if (shouldCacheAccess) {
4600 accessCache[key] = 0 /* AccessTypes.OTHER */;
4601 }
4602 }
4603 const publicGetter = publicPropertiesMap[key];
4604 let cssModule, globalProperties;
4605 // public $xxx properties
4606 if (publicGetter) {
4607 if (key === '$attrs') {
4608 track(instance, "get" /* TrackOpTypes.GET */, key);
4609 markAttrsAccessed();
4610 }
4611 return publicGetter(instance);
4612 }
4613 else if (
4614 // css module (injected by vue-loader)
4615 (cssModule = type.__cssModules) &&
4616 (cssModule = cssModule[key])) {
4617 return cssModule;
4618 }
4619 else if (ctx !== EMPTY_OBJ && hasOwn(ctx, key)) {
4620 // user may set custom properties to `this` that start with `$`
4621 accessCache[key] = 4 /* AccessTypes.CONTEXT */;
4622 return ctx[key];
4623 }
4624 else if (
4625 // global properties
4626 ((globalProperties = appContext.config.globalProperties),
4627 hasOwn(globalProperties, key))) {
4628 {
4629 return globalProperties[key];
4630 }
4631 }
4632 else if (currentRenderingInstance &&
4633 (!isString(key) ||
4634 // #1091 avoid internal isRef/isVNode checks on component instance leading
4635 // to infinite warning loop
4636 key.indexOf('__v') !== 0)) {
4637 if (data !== EMPTY_OBJ && isReservedPrefix(key[0]) && hasOwn(data, key)) {
4638 warn$1(`Property ${JSON.stringify(key)} must be accessed via $data because it starts with a reserved ` +
4639 `character ("$" or "_") and is not proxied on the render context.`);
4640 }
4641 else if (instance === currentRenderingInstance) {
4642 warn$1(`Property ${JSON.stringify(key)} was accessed during render ` +
4643 `but is not defined on instance.`);
4644 }
4645 }
4646 },
4647 set({ _: instance }, key, value) {
4648 const { data, setupState, ctx } = instance;
4649 if (hasSetupBinding(setupState, key)) {
4650 setupState[key] = value;
4651 return true;
4652 }
4653 else if (setupState.__isScriptSetup &&
4654 hasOwn(setupState, key)) {
4655 warn$1(`Cannot mutate <script setup> binding "${key}" from Options API.`);
4656 return false;
4657 }
4658 else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
4659 data[key] = value;
4660 return true;
4661 }
4662 else if (hasOwn(instance.props, key)) {
4663 warn$1(`Attempting to mutate prop "${key}". Props are readonly.`);
4664 return false;
4665 }
4666 if (key[0] === '$' && key.slice(1) in instance) {
4667 warn$1(`Attempting to mutate public property "${key}". ` +
4668 `Properties starting with $ are reserved and readonly.`);
4669 return false;
4670 }
4671 else {
4672 if (key in instance.appContext.config.globalProperties) {
4673 Object.defineProperty(ctx, key, {
4674 enumerable: true,
4675 configurable: true,
4676 value
4677 });
4678 }
4679 else {
4680 ctx[key] = value;
4681 }
4682 }
4683 return true;
4684 },
4685 has({ _: { data, setupState, accessCache, ctx, appContext, propsOptions } }, key) {
4686 let normalizedProps;
4687 return (!!accessCache[key] ||
4688 (data !== EMPTY_OBJ && hasOwn(data, key)) ||
4689 hasSetupBinding(setupState, key) ||
4690 ((normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key)) ||
4691 hasOwn(ctx, key) ||
4692 hasOwn(publicPropertiesMap, key) ||
4693 hasOwn(appContext.config.globalProperties, key));
4694 },
4695 defineProperty(target, key, descriptor) {
4696 if (descriptor.get != null) {
4697 // invalidate key cache of a getter based property #5417
4698 target._.accessCache[key] = 0;
4699 }
4700 else if (hasOwn(descriptor, 'value')) {
4701 this.set(target, key, descriptor.value, null);
4702 }
4703 return Reflect.defineProperty(target, key, descriptor);
4704 }
4705};
4706{
4707 PublicInstanceProxyHandlers.ownKeys = (target) => {
4708 warn$1(`Avoid app logic that relies on enumerating keys on a component instance. ` +
4709 `The keys will be empty in production mode to avoid performance overhead.`);
4710 return Reflect.ownKeys(target);
4711 };
4712}
4713const RuntimeCompiledPublicInstanceProxyHandlers = /*#__PURE__*/ extend({}, PublicInstanceProxyHandlers, {
4714 get(target, key) {
4715 // fast path for unscopables when using `with` block
4716 if (key === Symbol.unscopables) {
4717 return;
4718 }
4719 return PublicInstanceProxyHandlers.get(target, key, target);
4720 },
4721 has(_, key) {
4722 const has = key[0] !== '_' && !isGloballyWhitelisted(key);
4723 if (!has && PublicInstanceProxyHandlers.has(_, key)) {
4724 warn$1(`Property ${JSON.stringify(key)} should not start with _ which is a reserved prefix for Vue internals.`);
4725 }
4726 return has;
4727 }
4728});
4729// dev only
4730// In dev mode, the proxy target exposes the same properties as seen on `this`
4731// for easier console inspection. In prod mode it will be an empty object so
4732// these properties definitions can be skipped.
4733function createDevRenderContext(instance) {
4734 const target = {};
4735 // expose internal instance for proxy handlers
4736 Object.defineProperty(target, `_`, {
4737 configurable: true,
4738 enumerable: false,
4739 get: () => instance
4740 });
4741 // expose public properties
4742 Object.keys(publicPropertiesMap).forEach(key => {
4743 Object.defineProperty(target, key, {
4744 configurable: true,
4745 enumerable: false,
4746 get: () => publicPropertiesMap[key](instance),
4747 // intercepted by the proxy so no need for implementation,
4748 // but needed to prevent set errors
4749 set: NOOP
4750 });
4751 });
4752 return target;
4753}
4754// dev only
4755function exposePropsOnRenderContext(instance) {
4756 const { ctx, propsOptions: [propsOptions] } = instance;
4757 if (propsOptions) {
4758 Object.keys(propsOptions).forEach(key => {
4759 Object.defineProperty(ctx, key, {
4760 enumerable: true,
4761 configurable: true,
4762 get: () => instance.props[key],
4763 set: NOOP
4764 });
4765 });
4766 }
4767}
4768// dev only
4769function exposeSetupStateOnRenderContext(instance) {
4770 const { ctx, setupState } = instance;
4771 Object.keys(toRaw(setupState)).forEach(key => {
4772 if (!setupState.__isScriptSetup) {
4773 if (isReservedPrefix(key[0])) {
4774 warn$1(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
4775 `which are reserved prefixes for Vue internals.`);
4776 return;
4777 }
4778 Object.defineProperty(ctx, key, {
4779 enumerable: true,
4780 configurable: true,
4781 get: () => setupState[key],
4782 set: NOOP
4783 });
4784 }
4785 });
4786}
4787
4788function createDuplicateChecker() {
4789 const cache = Object.create(null);
4790 return (type, key) => {
4791 if (cache[key]) {
4792 warn$1(`${type} property "${key}" is already defined in ${cache[key]}.`);
4793 }
4794 else {
4795 cache[key] = type;
4796 }
4797 };
4798}
4799let shouldCacheAccess = true;
4800function applyOptions(instance) {
4801 const options = resolveMergedOptions(instance);
4802 const publicThis = instance.proxy;
4803 const ctx = instance.ctx;
4804 // do not cache property access on public proxy during state initialization
4805 shouldCacheAccess = false;
4806 // call beforeCreate first before accessing other options since
4807 // the hook may mutate resolved options (#2791)
4808 if (options.beforeCreate) {
4809 callHook(options.beforeCreate, instance, "bc" /* LifecycleHooks.BEFORE_CREATE */);
4810 }
4811 const {
4812 // state
4813 data: dataOptions, computed: computedOptions, methods, watch: watchOptions, provide: provideOptions, inject: injectOptions,
4814 // lifecycle
4815 created, beforeMount, mounted, beforeUpdate, updated, activated, deactivated, beforeDestroy, beforeUnmount, destroyed, unmounted, render, renderTracked, renderTriggered, errorCaptured, serverPrefetch,
4816 // public API
4817 expose, inheritAttrs,
4818 // assets
4819 components, directives, filters } = options;
4820 const checkDuplicateProperties = createDuplicateChecker() ;
4821 {
4822 const [propsOptions] = instance.propsOptions;
4823 if (propsOptions) {
4824 for (const key in propsOptions) {
4825 checkDuplicateProperties("Props" /* OptionTypes.PROPS */, key);
4826 }
4827 }
4828 }
4829 // options initialization order (to be consistent with Vue 2):
4830 // - props (already done outside of this function)
4831 // - inject
4832 // - methods
4833 // - data (deferred since it relies on `this` access)
4834 // - computed
4835 // - watch (deferred since it relies on `this` access)
4836 if (injectOptions) {
4837 resolveInjections(injectOptions, ctx, checkDuplicateProperties, instance.appContext.config.unwrapInjectedRef);
4838 }
4839 if (methods) {
4840 for (const key in methods) {
4841 const methodHandler = methods[key];
4842 if (isFunction(methodHandler)) {
4843 // In dev mode, we use the `createRenderContext` function to define
4844 // methods to the proxy target, and those are read-only but
4845 // reconfigurable, so it needs to be redefined here
4846 {
4847 Object.defineProperty(ctx, key, {
4848 value: methodHandler.bind(publicThis),
4849 configurable: true,
4850 enumerable: true,
4851 writable: true
4852 });
4853 }
4854 {
4855 checkDuplicateProperties("Methods" /* OptionTypes.METHODS */, key);
4856 }
4857 }
4858 else {
4859 warn$1(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` +
4860 `Did you reference the function correctly?`);
4861 }
4862 }
4863 }
4864 if (dataOptions) {
4865 if (!isFunction(dataOptions)) {
4866 warn$1(`The data option must be a function. ` +
4867 `Plain object usage is no longer supported.`);
4868 }
4869 const data = dataOptions.call(publicThis, publicThis);
4870 if (isPromise(data)) {
4871 warn$1(`data() returned a Promise - note data() cannot be async; If you ` +
4872 `intend to perform data fetching before component renders, use ` +
4873 `async setup() + <Suspense>.`);
4874 }
4875 if (!isObject(data)) {
4876 warn$1(`data() should return an object.`);
4877 }
4878 else {
4879 instance.data = reactive(data);
4880 {
4881 for (const key in data) {
4882 checkDuplicateProperties("Data" /* OptionTypes.DATA */, key);
4883 // expose data on ctx during dev
4884 if (!isReservedPrefix(key[0])) {
4885 Object.defineProperty(ctx, key, {
4886 configurable: true,
4887 enumerable: true,
4888 get: () => data[key],
4889 set: NOOP
4890 });
4891 }
4892 }
4893 }
4894 }
4895 }
4896 // state initialization complete at this point - start caching access
4897 shouldCacheAccess = true;
4898 if (computedOptions) {
4899 for (const key in computedOptions) {
4900 const opt = computedOptions[key];
4901 const get = isFunction(opt)
4902 ? opt.bind(publicThis, publicThis)
4903 : isFunction(opt.get)
4904 ? opt.get.bind(publicThis, publicThis)
4905 : NOOP;
4906 if (get === NOOP) {
4907 warn$1(`Computed property "${key}" has no getter.`);
4908 }
4909 const set = !isFunction(opt) && isFunction(opt.set)
4910 ? opt.set.bind(publicThis)
4911 : () => {
4912 warn$1(`Write operation failed: computed property "${key}" is readonly.`);
4913 }
4914 ;
4915 const c = computed$1({
4916 get,
4917 set
4918 });
4919 Object.defineProperty(ctx, key, {
4920 enumerable: true,
4921 configurable: true,
4922 get: () => c.value,
4923 set: v => (c.value = v)
4924 });
4925 {
4926 checkDuplicateProperties("Computed" /* OptionTypes.COMPUTED */, key);
4927 }
4928 }
4929 }
4930 if (watchOptions) {
4931 for (const key in watchOptions) {
4932 createWatcher(watchOptions[key], ctx, publicThis, key);
4933 }
4934 }
4935 if (provideOptions) {
4936 const provides = isFunction(provideOptions)
4937 ? provideOptions.call(publicThis)
4938 : provideOptions;
4939 Reflect.ownKeys(provides).forEach(key => {
4940 provide(key, provides[key]);
4941 });
4942 }
4943 if (created) {
4944 callHook(created, instance, "c" /* LifecycleHooks.CREATED */);
4945 }
4946 function registerLifecycleHook(register, hook) {
4947 if (isArray(hook)) {
4948 hook.forEach(_hook => register(_hook.bind(publicThis)));
4949 }
4950 else if (hook) {
4951 register(hook.bind(publicThis));
4952 }
4953 }
4954 registerLifecycleHook(onBeforeMount, beforeMount);
4955 registerLifecycleHook(onMounted, mounted);
4956 registerLifecycleHook(onBeforeUpdate, beforeUpdate);
4957 registerLifecycleHook(onUpdated, updated);
4958 registerLifecycleHook(onActivated, activated);
4959 registerLifecycleHook(onDeactivated, deactivated);
4960 registerLifecycleHook(onErrorCaptured, errorCaptured);
4961 registerLifecycleHook(onRenderTracked, renderTracked);
4962 registerLifecycleHook(onRenderTriggered, renderTriggered);
4963 registerLifecycleHook(onBeforeUnmount, beforeUnmount);
4964 registerLifecycleHook(onUnmounted, unmounted);
4965 registerLifecycleHook(onServerPrefetch, serverPrefetch);
4966 if (isArray(expose)) {
4967 if (expose.length) {
4968 const exposed = instance.exposed || (instance.exposed = {});
4969 expose.forEach(key => {
4970 Object.defineProperty(exposed, key, {
4971 get: () => publicThis[key],
4972 set: val => (publicThis[key] = val)
4973 });
4974 });
4975 }
4976 else if (!instance.exposed) {
4977 instance.exposed = {};
4978 }
4979 }
4980 // options that are handled when creating the instance but also need to be
4981 // applied from mixins
4982 if (render && instance.render === NOOP) {
4983 instance.render = render;
4984 }
4985 if (inheritAttrs != null) {
4986 instance.inheritAttrs = inheritAttrs;
4987 }
4988 // asset options.
4989 if (components)
4990 instance.components = components;
4991 if (directives)
4992 instance.directives = directives;
4993}
4994function resolveInjections(injectOptions, ctx, checkDuplicateProperties = NOOP, unwrapRef = false) {
4995 if (isArray(injectOptions)) {
4996 injectOptions = normalizeInject(injectOptions);
4997 }
4998 for (const key in injectOptions) {
4999 const opt = injectOptions[key];
5000 let injected;
5001 if (isObject(opt)) {
5002 if ('default' in opt) {
5003 injected = inject(opt.from || key, opt.default, true /* treat default function as factory */);
5004 }
5005 else {
5006 injected = inject(opt.from || key);
5007 }
5008 }
5009 else {
5010 injected = inject(opt);
5011 }
5012 if (isRef(injected)) {
5013 // TODO remove the check in 3.3
5014 if (unwrapRef) {
5015 Object.defineProperty(ctx, key, {
5016 enumerable: true,
5017 configurable: true,
5018 get: () => injected.value,
5019 set: v => (injected.value = v)
5020 });
5021 }
5022 else {
5023 {
5024 warn$1(`injected property "${key}" is a ref and will be auto-unwrapped ` +
5025 `and no longer needs \`.value\` in the next minor release. ` +
5026 `To opt-in to the new behavior now, ` +
5027 `set \`app.config.unwrapInjectedRef = true\` (this config is ` +
5028 `temporary and will not be needed in the future.)`);
5029 }
5030 ctx[key] = injected;
5031 }
5032 }
5033 else {
5034 ctx[key] = injected;
5035 }
5036 {
5037 checkDuplicateProperties("Inject" /* OptionTypes.INJECT */, key);
5038 }
5039 }
5040}
5041function callHook(hook, instance, type) {
5042 callWithAsyncErrorHandling(isArray(hook)
5043 ? hook.map(h => h.bind(instance.proxy))
5044 : hook.bind(instance.proxy), instance, type);
5045}
5046function createWatcher(raw, ctx, publicThis, key) {
5047 const getter = key.includes('.')
5048 ? createPathGetter(publicThis, key)
5049 : () => publicThis[key];
5050 if (isString(raw)) {
5051 const handler = ctx[raw];
5052 if (isFunction(handler)) {
5053 watch(getter, handler);
5054 }
5055 else {
5056 warn$1(`Invalid watch handler specified by key "${raw}"`, handler);
5057 }
5058 }
5059 else if (isFunction(raw)) {
5060 watch(getter, raw.bind(publicThis));
5061 }
5062 else if (isObject(raw)) {
5063 if (isArray(raw)) {
5064 raw.forEach(r => createWatcher(r, ctx, publicThis, key));
5065 }
5066 else {
5067 const handler = isFunction(raw.handler)
5068 ? raw.handler.bind(publicThis)
5069 : ctx[raw.handler];
5070 if (isFunction(handler)) {
5071 watch(getter, handler, raw);
5072 }
5073 else {
5074 warn$1(`Invalid watch handler specified by key "${raw.handler}"`, handler);
5075 }
5076 }
5077 }
5078 else {
5079 warn$1(`Invalid watch option: "${key}"`, raw);
5080 }
5081}
5082/**
5083 * Resolve merged options and cache it on the component.
5084 * This is done only once per-component since the merging does not involve
5085 * instances.
5086 */
5087function resolveMergedOptions(instance) {
5088 const base = instance.type;
5089 const { mixins, extends: extendsOptions } = base;
5090 const { mixins: globalMixins, optionsCache: cache, config: { optionMergeStrategies } } = instance.appContext;
5091 const cached = cache.get(base);
5092 let resolved;
5093 if (cached) {
5094 resolved = cached;
5095 }
5096 else if (!globalMixins.length && !mixins && !extendsOptions) {
5097 {
5098 resolved = base;
5099 }
5100 }
5101 else {
5102 resolved = {};
5103 if (globalMixins.length) {
5104 globalMixins.forEach(m => mergeOptions(resolved, m, optionMergeStrategies, true));
5105 }
5106 mergeOptions(resolved, base, optionMergeStrategies);
5107 }
5108 if (isObject(base)) {
5109 cache.set(base, resolved);
5110 }
5111 return resolved;
5112}
5113function mergeOptions(to, from, strats, asMixin = false) {
5114 const { mixins, extends: extendsOptions } = from;
5115 if (extendsOptions) {
5116 mergeOptions(to, extendsOptions, strats, true);
5117 }
5118 if (mixins) {
5119 mixins.forEach((m) => mergeOptions(to, m, strats, true));
5120 }
5121 for (const key in from) {
5122 if (asMixin && key === 'expose') {
5123 warn$1(`"expose" option is ignored when declared in mixins or extends. ` +
5124 `It should only be declared in the base component itself.`);
5125 }
5126 else {
5127 const strat = internalOptionMergeStrats[key] || (strats && strats[key]);
5128 to[key] = strat ? strat(to[key], from[key]) : from[key];
5129 }
5130 }
5131 return to;
5132}
5133const internalOptionMergeStrats = {
5134 data: mergeDataFn,
5135 props: mergeObjectOptions,
5136 emits: mergeObjectOptions,
5137 // objects
5138 methods: mergeObjectOptions,
5139 computed: mergeObjectOptions,
5140 // lifecycle
5141 beforeCreate: mergeAsArray,
5142 created: mergeAsArray,
5143 beforeMount: mergeAsArray,
5144 mounted: mergeAsArray,
5145 beforeUpdate: mergeAsArray,
5146 updated: mergeAsArray,
5147 beforeDestroy: mergeAsArray,
5148 beforeUnmount: mergeAsArray,
5149 destroyed: mergeAsArray,
5150 unmounted: mergeAsArray,
5151 activated: mergeAsArray,
5152 deactivated: mergeAsArray,
5153 errorCaptured: mergeAsArray,
5154 serverPrefetch: mergeAsArray,
5155 // assets
5156 components: mergeObjectOptions,
5157 directives: mergeObjectOptions,
5158 // watch
5159 watch: mergeWatchOptions,
5160 // provide / inject
5161 provide: mergeDataFn,
5162 inject: mergeInject
5163};
5164function mergeDataFn(to, from) {
5165 if (!from) {
5166 return to;
5167 }
5168 if (!to) {
5169 return from;
5170 }
5171 return function mergedDataFn() {
5172 return (extend)(isFunction(to) ? to.call(this, this) : to, isFunction(from) ? from.call(this, this) : from);
5173 };
5174}
5175function mergeInject(to, from) {
5176 return mergeObjectOptions(normalizeInject(to), normalizeInject(from));
5177}
5178function normalizeInject(raw) {
5179 if (isArray(raw)) {
5180 const res = {};
5181 for (let i = 0; i < raw.length; i++) {
5182 res[raw[i]] = raw[i];
5183 }
5184 return res;
5185 }
5186 return raw;
5187}
5188function mergeAsArray(to, from) {
5189 return to ? [...new Set([].concat(to, from))] : from;
5190}
5191function mergeObjectOptions(to, from) {
5192 return to ? extend(extend(Object.create(null), to), from) : from;
5193}
5194function mergeWatchOptions(to, from) {
5195 if (!to)
5196 return from;
5197 if (!from)
5198 return to;
5199 const merged = extend(Object.create(null), to);
5200 for (const key in from) {
5201 merged[key] = mergeAsArray(to[key], from[key]);
5202 }
5203 return merged;
5204}
5205
5206function initProps(instance, rawProps, isStateful, // result of bitwise flag comparison
5207isSSR = false) {
5208 const props = {};
5209 const attrs = {};
5210 def(attrs, InternalObjectKey, 1);
5211 instance.propsDefaults = Object.create(null);
5212 setFullProps(instance, rawProps, props, attrs);
5213 // ensure all declared prop keys are present
5214 for (const key in instance.propsOptions[0]) {
5215 if (!(key in props)) {
5216 props[key] = undefined;
5217 }
5218 }
5219 // validation
5220 {
5221 validateProps(rawProps || {}, props, instance);
5222 }
5223 if (isStateful) {
5224 // stateful
5225 instance.props = isSSR ? props : shallowReactive(props);
5226 }
5227 else {
5228 if (!instance.type.props) {
5229 // functional w/ optional props, props === attrs
5230 instance.props = attrs;
5231 }
5232 else {
5233 // functional w/ declared props
5234 instance.props = props;
5235 }
5236 }
5237 instance.attrs = attrs;
5238}
5239function isInHmrContext(instance) {
5240 while (instance) {
5241 if (instance.type.__hmrId)
5242 return true;
5243 instance = instance.parent;
5244 }
5245}
5246function updateProps(instance, rawProps, rawPrevProps, optimized) {
5247 const { props, attrs, vnode: { patchFlag } } = instance;
5248 const rawCurrentProps = toRaw(props);
5249 const [options] = instance.propsOptions;
5250 let hasAttrsChanged = false;
5251 if (
5252 // always force full diff in dev
5253 // - #1942 if hmr is enabled with sfc component
5254 // - vite#872 non-sfc component used by sfc component
5255 !(isInHmrContext(instance)) &&
5256 (optimized || patchFlag > 0) &&
5257 !(patchFlag & 16 /* PatchFlags.FULL_PROPS */)) {
5258 if (patchFlag & 8 /* PatchFlags.PROPS */) {
5259 // Compiler-generated props & no keys change, just set the updated
5260 // the props.
5261 const propsToUpdate = instance.vnode.dynamicProps;
5262 for (let i = 0; i < propsToUpdate.length; i++) {
5263 let key = propsToUpdate[i];
5264 // skip if the prop key is a declared emit event listener
5265 if (isEmitListener(instance.emitsOptions, key)) {
5266 continue;
5267 }
5268 // PROPS flag guarantees rawProps to be non-null
5269 const value = rawProps[key];
5270 if (options) {
5271 // attr / props separation was done on init and will be consistent
5272 // in this code path, so just check if attrs have it.
5273 if (hasOwn(attrs, key)) {
5274 if (value !== attrs[key]) {
5275 attrs[key] = value;
5276 hasAttrsChanged = true;
5277 }
5278 }
5279 else {
5280 const camelizedKey = camelize(key);
5281 props[camelizedKey] = resolvePropValue(options, rawCurrentProps, camelizedKey, value, instance, false /* isAbsent */);
5282 }
5283 }
5284 else {
5285 if (value !== attrs[key]) {
5286 attrs[key] = value;
5287 hasAttrsChanged = true;
5288 }
5289 }
5290 }
5291 }
5292 }
5293 else {
5294 // full props update.
5295 if (setFullProps(instance, rawProps, props, attrs)) {
5296 hasAttrsChanged = true;
5297 }
5298 // in case of dynamic props, check if we need to delete keys from
5299 // the props object
5300 let kebabKey;
5301 for (const key in rawCurrentProps) {
5302 if (!rawProps ||
5303 // for camelCase
5304 (!hasOwn(rawProps, key) &&
5305 // it's possible the original props was passed in as kebab-case
5306 // and converted to camelCase (#955)
5307 ((kebabKey = hyphenate(key)) === key || !hasOwn(rawProps, kebabKey)))) {
5308 if (options) {
5309 if (rawPrevProps &&
5310 // for camelCase
5311 (rawPrevProps[key] !== undefined ||
5312 // for kebab-case
5313 rawPrevProps[kebabKey] !== undefined)) {
5314 props[key] = resolvePropValue(options, rawCurrentProps, key, undefined, instance, true /* isAbsent */);
5315 }
5316 }
5317 else {
5318 delete props[key];
5319 }
5320 }
5321 }
5322 // in the case of functional component w/o props declaration, props and
5323 // attrs point to the same object so it should already have been updated.
5324 if (attrs !== rawCurrentProps) {
5325 for (const key in attrs) {
5326 if (!rawProps ||
5327 (!hasOwn(rawProps, key) &&
5328 (!false ))) {
5329 delete attrs[key];
5330 hasAttrsChanged = true;
5331 }
5332 }
5333 }
5334 }
5335 // trigger updates for $attrs in case it's used in component slots
5336 if (hasAttrsChanged) {
5337 trigger(instance, "set" /* TriggerOpTypes.SET */, '$attrs');
5338 }
5339 {
5340 validateProps(rawProps || {}, props, instance);
5341 }
5342}
5343function setFullProps(instance, rawProps, props, attrs) {
5344 const [options, needCastKeys] = instance.propsOptions;
5345 let hasAttrsChanged = false;
5346 let rawCastValues;
5347 if (rawProps) {
5348 for (let key in rawProps) {
5349 // key, ref are reserved and never passed down
5350 if (isReservedProp(key)) {
5351 continue;
5352 }
5353 const value = rawProps[key];
5354 // prop option names are camelized during normalization, so to support
5355 // kebab -> camel conversion here we need to camelize the key.
5356 let camelKey;
5357 if (options && hasOwn(options, (camelKey = camelize(key)))) {
5358 if (!needCastKeys || !needCastKeys.includes(camelKey)) {
5359 props[camelKey] = value;
5360 }
5361 else {
5362 (rawCastValues || (rawCastValues = {}))[camelKey] = value;
5363 }
5364 }
5365 else if (!isEmitListener(instance.emitsOptions, key)) {
5366 if (!(key in attrs) || value !== attrs[key]) {
5367 attrs[key] = value;
5368 hasAttrsChanged = true;
5369 }
5370 }
5371 }
5372 }
5373 if (needCastKeys) {
5374 const rawCurrentProps = toRaw(props);
5375 const castValues = rawCastValues || EMPTY_OBJ;
5376 for (let i = 0; i < needCastKeys.length; i++) {
5377 const key = needCastKeys[i];
5378 props[key] = resolvePropValue(options, rawCurrentProps, key, castValues[key], instance, !hasOwn(castValues, key));
5379 }
5380 }
5381 return hasAttrsChanged;
5382}
5383function resolvePropValue(options, props, key, value, instance, isAbsent) {
5384 const opt = options[key];
5385 if (opt != null) {
5386 const hasDefault = hasOwn(opt, 'default');
5387 // default values
5388 if (hasDefault && value === undefined) {
5389 const defaultValue = opt.default;
5390 if (opt.type !== Function && isFunction(defaultValue)) {
5391 const { propsDefaults } = instance;
5392 if (key in propsDefaults) {
5393 value = propsDefaults[key];
5394 }
5395 else {
5396 setCurrentInstance(instance);
5397 value = propsDefaults[key] = defaultValue.call(null, props);
5398 unsetCurrentInstance();
5399 }
5400 }
5401 else {
5402 value = defaultValue;
5403 }
5404 }
5405 // boolean casting
5406 if (opt[0 /* BooleanFlags.shouldCast */]) {
5407 if (isAbsent && !hasDefault) {
5408 value = false;
5409 }
5410 else if (opt[1 /* BooleanFlags.shouldCastTrue */] &&
5411 (value === '' || value === hyphenate(key))) {
5412 value = true;
5413 }
5414 }
5415 }
5416 return value;
5417}
5418function normalizePropsOptions(comp, appContext, asMixin = false) {
5419 const cache = appContext.propsCache;
5420 const cached = cache.get(comp);
5421 if (cached) {
5422 return cached;
5423 }
5424 const raw = comp.props;
5425 const normalized = {};
5426 const needCastKeys = [];
5427 // apply mixin/extends props
5428 let hasExtends = false;
5429 if (!isFunction(comp)) {
5430 const extendProps = (raw) => {
5431 hasExtends = true;
5432 const [props, keys] = normalizePropsOptions(raw, appContext, true);
5433 extend(normalized, props);
5434 if (keys)
5435 needCastKeys.push(...keys);
5436 };
5437 if (!asMixin && appContext.mixins.length) {
5438 appContext.mixins.forEach(extendProps);
5439 }
5440 if (comp.extends) {
5441 extendProps(comp.extends);
5442 }
5443 if (comp.mixins) {
5444 comp.mixins.forEach(extendProps);
5445 }
5446 }
5447 if (!raw && !hasExtends) {
5448 if (isObject(comp)) {
5449 cache.set(comp, EMPTY_ARR);
5450 }
5451 return EMPTY_ARR;
5452 }
5453 if (isArray(raw)) {
5454 for (let i = 0; i < raw.length; i++) {
5455 if (!isString(raw[i])) {
5456 warn$1(`props must be strings when using array syntax.`, raw[i]);
5457 }
5458 const normalizedKey = camelize(raw[i]);
5459 if (validatePropName(normalizedKey)) {
5460 normalized[normalizedKey] = EMPTY_OBJ;
5461 }
5462 }
5463 }
5464 else if (raw) {
5465 if (!isObject(raw)) {
5466 warn$1(`invalid props options`, raw);
5467 }
5468 for (const key in raw) {
5469 const normalizedKey = camelize(key);
5470 if (validatePropName(normalizedKey)) {
5471 const opt = raw[key];
5472 const prop = (normalized[normalizedKey] =
5473 isArray(opt) || isFunction(opt) ? { type: opt } : Object.assign({}, opt));
5474 if (prop) {
5475 const booleanIndex = getTypeIndex(Boolean, prop.type);
5476 const stringIndex = getTypeIndex(String, prop.type);
5477 prop[0 /* BooleanFlags.shouldCast */] = booleanIndex > -1;
5478 prop[1 /* BooleanFlags.shouldCastTrue */] =
5479 stringIndex < 0 || booleanIndex < stringIndex;
5480 // if the prop needs boolean casting or default value
5481 if (booleanIndex > -1 || hasOwn(prop, 'default')) {
5482 needCastKeys.push(normalizedKey);
5483 }
5484 }
5485 }
5486 }
5487 }
5488 const res = [normalized, needCastKeys];
5489 if (isObject(comp)) {
5490 cache.set(comp, res);
5491 }
5492 return res;
5493}
5494function validatePropName(key) {
5495 if (key[0] !== '$') {
5496 return true;
5497 }
5498 else {
5499 warn$1(`Invalid prop name: "${key}" is a reserved property.`);
5500 }
5501 return false;
5502}
5503// use function string name to check type constructors
5504// so that it works across vms / iframes.
5505function getType(ctor) {
5506 const match = ctor && ctor.toString().match(/^\s*function (\w+)/);
5507 return match ? match[1] : ctor === null ? 'null' : '';
5508}
5509function isSameType(a, b) {
5510 return getType(a) === getType(b);
5511}
5512function getTypeIndex(type, expectedTypes) {
5513 if (isArray(expectedTypes)) {
5514 return expectedTypes.findIndex(t => isSameType(t, type));
5515 }
5516 else if (isFunction(expectedTypes)) {
5517 return isSameType(expectedTypes, type) ? 0 : -1;
5518 }
5519 return -1;
5520}
5521/**
5522 * dev only
5523 */
5524function validateProps(rawProps, props, instance) {
5525 const resolvedValues = toRaw(props);
5526 const options = instance.propsOptions[0];
5527 for (const key in options) {
5528 let opt = options[key];
5529 if (opt == null)
5530 continue;
5531 validateProp(key, resolvedValues[key], opt, !hasOwn(rawProps, key) && !hasOwn(rawProps, hyphenate(key)));
5532 }
5533}
5534/**
5535 * dev only
5536 */
5537function validateProp(name, value, prop, isAbsent) {
5538 const { type, required, validator } = prop;
5539 // required!
5540 if (required && isAbsent) {
5541 warn$1('Missing required prop: "' + name + '"');
5542 return;
5543 }
5544 // missing but optional
5545 if (value == null && !prop.required) {
5546 return;
5547 }
5548 // type check
5549 if (type != null && type !== true) {
5550 let isValid = false;
5551 const types = isArray(type) ? type : [type];
5552 const expectedTypes = [];
5553 // value is valid as long as one of the specified types match
5554 for (let i = 0; i < types.length && !isValid; i++) {
5555 const { valid, expectedType } = assertType(value, types[i]);
5556 expectedTypes.push(expectedType || '');
5557 isValid = valid;
5558 }
5559 if (!isValid) {
5560 warn$1(getInvalidTypeMessage(name, value, expectedTypes));
5561 return;
5562 }
5563 }
5564 // custom validator
5565 if (validator && !validator(value)) {
5566 warn$1('Invalid prop: custom validator check failed for prop "' + name + '".');
5567 }
5568}
5569const isSimpleType = /*#__PURE__*/ makeMap('String,Number,Boolean,Function,Symbol,BigInt');
5570/**
5571 * dev only
5572 */
5573function assertType(value, type) {
5574 let valid;
5575 const expectedType = getType(type);
5576 if (isSimpleType(expectedType)) {
5577 const t = typeof value;
5578 valid = t === expectedType.toLowerCase();
5579 // for primitive wrapper objects
5580 if (!valid && t === 'object') {
5581 valid = value instanceof type;
5582 }
5583 }
5584 else if (expectedType === 'Object') {
5585 valid = isObject(value);
5586 }
5587 else if (expectedType === 'Array') {
5588 valid = isArray(value);
5589 }
5590 else if (expectedType === 'null') {
5591 valid = value === null;
5592 }
5593 else {
5594 valid = value instanceof type;
5595 }
5596 return {
5597 valid,
5598 expectedType
5599 };
5600}
5601/**
5602 * dev only
5603 */
5604function getInvalidTypeMessage(name, value, expectedTypes) {
5605 let message = `Invalid prop: type check failed for prop "${name}".` +
5606 ` Expected ${expectedTypes.map(capitalize).join(' | ')}`;
5607 const expectedType = expectedTypes[0];
5608 const receivedType = toRawType(value);
5609 const expectedValue = styleValue(value, expectedType);
5610 const receivedValue = styleValue(value, receivedType);
5611 // check if we need to specify expected value
5612 if (expectedTypes.length === 1 &&
5613 isExplicable(expectedType) &&
5614 !isBoolean(expectedType, receivedType)) {
5615 message += ` with value ${expectedValue}`;
5616 }
5617 message += `, got ${receivedType} `;
5618 // check if we need to specify received value
5619 if (isExplicable(receivedType)) {
5620 message += `with value ${receivedValue}.`;
5621 }
5622 return message;
5623}
5624/**
5625 * dev only
5626 */
5627function styleValue(value, type) {
5628 if (type === 'String') {
5629 return `"${value}"`;
5630 }
5631 else if (type === 'Number') {
5632 return `${Number(value)}`;
5633 }
5634 else {
5635 return `${value}`;
5636 }
5637}
5638/**
5639 * dev only
5640 */
5641function isExplicable(type) {
5642 const explicitTypes = ['string', 'number', 'boolean'];
5643 return explicitTypes.some(elem => type.toLowerCase() === elem);
5644}
5645/**
5646 * dev only
5647 */
5648function isBoolean(...args) {
5649 return args.some(elem => elem.toLowerCase() === 'boolean');
5650}
5651
5652const isInternalKey = (key) => key[0] === '_' || key === '$stable';
5653const normalizeSlotValue = (value) => isArray(value)
5654 ? value.map(normalizeVNode)
5655 : [normalizeVNode(value)];
5656const normalizeSlot = (key, rawSlot, ctx) => {
5657 if (rawSlot._n) {
5658 // already normalized - #5353
5659 return rawSlot;
5660 }
5661 const normalized = withCtx((...args) => {
5662 if (true && currentInstance) {
5663 warn$1(`Slot "${key}" invoked outside of the render function: ` +
5664 `this will not track dependencies used in the slot. ` +
5665 `Invoke the slot function inside the render function instead.`);
5666 }
5667 return normalizeSlotValue(rawSlot(...args));
5668 }, ctx);
5669 normalized._c = false;
5670 return normalized;
5671};
5672const normalizeObjectSlots = (rawSlots, slots, instance) => {
5673 const ctx = rawSlots._ctx;
5674 for (const key in rawSlots) {
5675 if (isInternalKey(key))
5676 continue;
5677 const value = rawSlots[key];
5678 if (isFunction(value)) {
5679 slots[key] = normalizeSlot(key, value, ctx);
5680 }
5681 else if (value != null) {
5682 {
5683 warn$1(`Non-function value encountered for slot "${key}". ` +
5684 `Prefer function slots for better performance.`);
5685 }
5686 const normalized = normalizeSlotValue(value);
5687 slots[key] = () => normalized;
5688 }
5689 }
5690};
5691const normalizeVNodeSlots = (instance, children) => {
5692 if (!isKeepAlive(instance.vnode) &&
5693 !(false )) {
5694 warn$1(`Non-function value encountered for default slot. ` +
5695 `Prefer function slots for better performance.`);
5696 }
5697 const normalized = normalizeSlotValue(children);
5698 instance.slots.default = () => normalized;
5699};
5700const initSlots = (instance, children) => {
5701 if (instance.vnode.shapeFlag & 32 /* ShapeFlags.SLOTS_CHILDREN */) {
5702 const type = children._;
5703 if (type) {
5704 // users can get the shallow readonly version of the slots object through `this.$slots`,
5705 // we should avoid the proxy object polluting the slots of the internal instance
5706 instance.slots = toRaw(children);
5707 // make compiler marker non-enumerable
5708 def(children, '_', type);
5709 }
5710 else {
5711 normalizeObjectSlots(children, (instance.slots = {}));
5712 }
5713 }
5714 else {
5715 instance.slots = {};
5716 if (children) {
5717 normalizeVNodeSlots(instance, children);
5718 }
5719 }
5720 def(instance.slots, InternalObjectKey, 1);
5721};
5722const updateSlots = (instance, children, optimized) => {
5723 const { vnode, slots } = instance;
5724 let needDeletionCheck = true;
5725 let deletionComparisonTarget = EMPTY_OBJ;
5726 if (vnode.shapeFlag & 32 /* ShapeFlags.SLOTS_CHILDREN */) {
5727 const type = children._;
5728 if (type) {
5729 // compiled slots.
5730 if (isHmrUpdating) {
5731 // Parent was HMR updated so slot content may have changed.
5732 // force update slots and mark instance for hmr as well
5733 extend(slots, children);
5734 }
5735 else if (optimized && type === 1 /* SlotFlags.STABLE */) {
5736 // compiled AND stable.
5737 // no need to update, and skip stale slots removal.
5738 needDeletionCheck = false;
5739 }
5740 else {
5741 // compiled but dynamic (v-if/v-for on slots) - update slots, but skip
5742 // normalization.
5743 extend(slots, children);
5744 // #2893
5745 // when rendering the optimized slots by manually written render function,
5746 // we need to delete the `slots._` flag if necessary to make subsequent updates reliable,
5747 // i.e. let the `renderSlot` create the bailed Fragment
5748 if (!optimized && type === 1 /* SlotFlags.STABLE */) {
5749 delete slots._;
5750 }
5751 }
5752 }
5753 else {
5754 needDeletionCheck = !children.$stable;
5755 normalizeObjectSlots(children, slots);
5756 }
5757 deletionComparisonTarget = children;
5758 }
5759 else if (children) {
5760 // non slot object children (direct value) passed to a component
5761 normalizeVNodeSlots(instance, children);
5762 deletionComparisonTarget = { default: 1 };
5763 }
5764 // delete stale slots
5765 if (needDeletionCheck) {
5766 for (const key in slots) {
5767 if (!isInternalKey(key) && !(key in deletionComparisonTarget)) {
5768 delete slots[key];
5769 }
5770 }
5771 }
5772};
5773
5774function createAppContext() {
5775 return {
5776 app: null,
5777 config: {
5778 isNativeTag: NO,
5779 performance: false,
5780 globalProperties: {},
5781 optionMergeStrategies: {},
5782 errorHandler: undefined,
5783 warnHandler: undefined,
5784 compilerOptions: {}
5785 },
5786 mixins: [],
5787 components: {},
5788 directives: {},
5789 provides: Object.create(null),
5790 optionsCache: new WeakMap(),
5791 propsCache: new WeakMap(),
5792 emitsCache: new WeakMap()
5793 };
5794}
5795let uid = 0;
5796function createAppAPI(render, hydrate) {
5797 return function createApp(rootComponent, rootProps = null) {
5798 if (!isFunction(rootComponent)) {
5799 rootComponent = Object.assign({}, rootComponent);
5800 }
5801 if (rootProps != null && !isObject(rootProps)) {
5802 warn$1(`root props passed to app.mount() must be an object.`);
5803 rootProps = null;
5804 }
5805 const context = createAppContext();
5806 const installedPlugins = new Set();
5807 let isMounted = false;
5808 const app = (context.app = {
5809 _uid: uid++,
5810 _component: rootComponent,
5811 _props: rootProps,
5812 _container: null,
5813 _context: context,
5814 _instance: null,
5815 version,
5816 get config() {
5817 return context.config;
5818 },
5819 set config(v) {
5820 {
5821 warn$1(`app.config cannot be replaced. Modify individual options instead.`);
5822 }
5823 },
5824 use(plugin, ...options) {
5825 if (installedPlugins.has(plugin)) {
5826 warn$1(`Plugin has already been applied to target app.`);
5827 }
5828 else if (plugin && isFunction(plugin.install)) {
5829 installedPlugins.add(plugin);
5830 plugin.install(app, ...options);
5831 }
5832 else if (isFunction(plugin)) {
5833 installedPlugins.add(plugin);
5834 plugin(app, ...options);
5835 }
5836 else {
5837 warn$1(`A plugin must either be a function or an object with an "install" ` +
5838 `function.`);
5839 }
5840 return app;
5841 },
5842 mixin(mixin) {
5843 {
5844 if (!context.mixins.includes(mixin)) {
5845 context.mixins.push(mixin);
5846 }
5847 else {
5848 warn$1('Mixin has already been applied to target app' +
5849 (mixin.name ? `: ${mixin.name}` : ''));
5850 }
5851 }
5852 return app;
5853 },
5854 component(name, component) {
5855 {
5856 validateComponentName(name, context.config);
5857 }
5858 if (!component) {
5859 return context.components[name];
5860 }
5861 if (context.components[name]) {
5862 warn$1(`Component "${name}" has already been registered in target app.`);
5863 }
5864 context.components[name] = component;
5865 return app;
5866 },
5867 directive(name, directive) {
5868 {
5869 validateDirectiveName(name);
5870 }
5871 if (!directive) {
5872 return context.directives[name];
5873 }
5874 if (context.directives[name]) {
5875 warn$1(`Directive "${name}" has already been registered in target app.`);
5876 }
5877 context.directives[name] = directive;
5878 return app;
5879 },
5880 mount(rootContainer, isHydrate, isSVG) {
5881 if (!isMounted) {
5882 // #5571
5883 if (rootContainer.__vue_app__) {
5884 warn$1(`There is already an app instance mounted on the host container.\n` +
5885 ` If you want to mount another app on the same host container,` +
5886 ` you need to unmount the previous app by calling \`app.unmount()\` first.`);
5887 }
5888 const vnode = createVNode(rootComponent, rootProps);
5889 // store app context on the root VNode.
5890 // this will be set on the root instance on initial mount.
5891 vnode.appContext = context;
5892 // HMR root reload
5893 {
5894 context.reload = () => {
5895 render(cloneVNode(vnode), rootContainer, isSVG);
5896 };
5897 }
5898 if (isHydrate && hydrate) {
5899 hydrate(vnode, rootContainer);
5900 }
5901 else {
5902 render(vnode, rootContainer, isSVG);
5903 }
5904 isMounted = true;
5905 app._container = rootContainer;
5906 rootContainer.__vue_app__ = app;
5907 {
5908 app._instance = vnode.component;
5909 devtoolsInitApp(app, version);
5910 }
5911 return getExposeProxy(vnode.component) || vnode.component.proxy;
5912 }
5913 else {
5914 warn$1(`App has already been mounted.\n` +
5915 `If you want to remount the same app, move your app creation logic ` +
5916 `into a factory function and create fresh app instances for each ` +
5917 `mount - e.g. \`const createMyApp = () => createApp(App)\``);
5918 }
5919 },
5920 unmount() {
5921 if (isMounted) {
5922 render(null, app._container);
5923 {
5924 app._instance = null;
5925 devtoolsUnmountApp(app);
5926 }
5927 delete app._container.__vue_app__;
5928 }
5929 else {
5930 warn$1(`Cannot unmount an app that is not mounted.`);
5931 }
5932 },
5933 provide(key, value) {
5934 if (key in context.provides) {
5935 warn$1(`App already provides property with key "${String(key)}". ` +
5936 `It will be overwritten with the new value.`);
5937 }
5938 context.provides[key] = value;
5939 return app;
5940 }
5941 });
5942 return app;
5943 };
5944}
5945
5946/**
5947 * Function for handling a template ref
5948 */
5949function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
5950 if (isArray(rawRef)) {
5951 rawRef.forEach((r, i) => setRef(r, oldRawRef && (isArray(oldRawRef) ? oldRawRef[i] : oldRawRef), parentSuspense, vnode, isUnmount));
5952 return;
5953 }
5954 if (isAsyncWrapper(vnode) && !isUnmount) {
5955 // when mounting async components, nothing needs to be done,
5956 // because the template ref is forwarded to inner component
5957 return;
5958 }
5959 const refValue = vnode.shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */
5960 ? getExposeProxy(vnode.component) || vnode.component.proxy
5961 : vnode.el;
5962 const value = isUnmount ? null : refValue;
5963 const { i: owner, r: ref } = rawRef;
5964 if (!owner) {
5965 warn$1(`Missing ref owner context. ref cannot be used on hoisted vnodes. ` +
5966 `A vnode with ref must be created inside the render function.`);
5967 return;
5968 }
5969 const oldRef = oldRawRef && oldRawRef.r;
5970 const refs = owner.refs === EMPTY_OBJ ? (owner.refs = {}) : owner.refs;
5971 const setupState = owner.setupState;
5972 // dynamic ref changed. unset old ref
5973 if (oldRef != null && oldRef !== ref) {
5974 if (isString(oldRef)) {
5975 refs[oldRef] = null;
5976 if (hasOwn(setupState, oldRef)) {
5977 setupState[oldRef] = null;
5978 }
5979 }
5980 else if (isRef(oldRef)) {
5981 oldRef.value = null;
5982 }
5983 }
5984 if (isFunction(ref)) {
5985 callWithErrorHandling(ref, owner, 12 /* ErrorCodes.FUNCTION_REF */, [value, refs]);
5986 }
5987 else {
5988 const _isString = isString(ref);
5989 const _isRef = isRef(ref);
5990 if (_isString || _isRef) {
5991 const doSet = () => {
5992 if (rawRef.f) {
5993 const existing = _isString
5994 ? hasOwn(setupState, ref)
5995 ? setupState[ref]
5996 : refs[ref]
5997 : ref.value;
5998 if (isUnmount) {
5999 isArray(existing) && remove(existing, refValue);
6000 }
6001 else {
6002 if (!isArray(existing)) {
6003 if (_isString) {
6004 refs[ref] = [refValue];
6005 if (hasOwn(setupState, ref)) {
6006 setupState[ref] = refs[ref];
6007 }
6008 }
6009 else {
6010 ref.value = [refValue];
6011 if (rawRef.k)
6012 refs[rawRef.k] = ref.value;
6013 }
6014 }
6015 else if (!existing.includes(refValue)) {
6016 existing.push(refValue);
6017 }
6018 }
6019 }
6020 else if (_isString) {
6021 refs[ref] = value;
6022 if (hasOwn(setupState, ref)) {
6023 setupState[ref] = value;
6024 }
6025 }
6026 else if (_isRef) {
6027 ref.value = value;
6028 if (rawRef.k)
6029 refs[rawRef.k] = value;
6030 }
6031 else {
6032 warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
6033 }
6034 };
6035 if (value) {
6036 doSet.id = -1;
6037 queuePostRenderEffect(doSet, parentSuspense);
6038 }
6039 else {
6040 doSet();
6041 }
6042 }
6043 else {
6044 warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
6045 }
6046 }
6047}
6048
6049let hasMismatch = false;
6050const isSVGContainer = (container) => /svg/.test(container.namespaceURI) && container.tagName !== 'foreignObject';
6051const isComment = (node) => node.nodeType === 8 /* DOMNodeTypes.COMMENT */;
6052// Note: hydration is DOM-specific
6053// But we have to place it in core due to tight coupling with core - splitting
6054// it out creates a ton of unnecessary complexity.
6055// Hydration also depends on some renderer internal logic which needs to be
6056// passed in via arguments.
6057function createHydrationFunctions(rendererInternals) {
6058 const { mt: mountComponent, p: patch, o: { patchProp, createText, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals;
6059 const hydrate = (vnode, container) => {
6060 if (!container.hasChildNodes()) {
6061 warn$1(`Attempting to hydrate existing markup but container is empty. ` +
6062 `Performing full mount instead.`);
6063 patch(null, vnode, container);
6064 flushPostFlushCbs();
6065 container._vnode = vnode;
6066 return;
6067 }
6068 hasMismatch = false;
6069 hydrateNode(container.firstChild, vnode, null, null, null);
6070 flushPostFlushCbs();
6071 container._vnode = vnode;
6072 if (hasMismatch && !false) {
6073 // this error should show up in production
6074 console.error(`Hydration completed but contains mismatches.`);
6075 }
6076 };
6077 const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => {
6078 const isFragmentStart = isComment(node) && node.data === '[';
6079 const onMismatch = () => handleMismatch(node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragmentStart);
6080 const { type, ref, shapeFlag, patchFlag } = vnode;
6081 let domType = node.nodeType;
6082 vnode.el = node;
6083 if (patchFlag === -2 /* PatchFlags.BAIL */) {
6084 optimized = false;
6085 vnode.dynamicChildren = null;
6086 }
6087 let nextNode = null;
6088 switch (type) {
6089 case Text:
6090 if (domType !== 3 /* DOMNodeTypes.TEXT */) {
6091 // #5728 empty text node inside a slot can cause hydration failure
6092 // because the server rendered HTML won't contain a text node
6093 if (vnode.children === '') {
6094 insert((vnode.el = createText('')), parentNode(node), node);
6095 nextNode = node;
6096 }
6097 else {
6098 nextNode = onMismatch();
6099 }
6100 }
6101 else {
6102 if (node.data !== vnode.children) {
6103 hasMismatch = true;
6104 warn$1(`Hydration text mismatch:` +
6105 `\n- Client: ${JSON.stringify(node.data)}` +
6106 `\n- Server: ${JSON.stringify(vnode.children)}`);
6107 node.data = vnode.children;
6108 }
6109 nextNode = nextSibling(node);
6110 }
6111 break;
6112 case Comment:
6113 if (domType !== 8 /* DOMNodeTypes.COMMENT */ || isFragmentStart) {
6114 nextNode = onMismatch();
6115 }
6116 else {
6117 nextNode = nextSibling(node);
6118 }
6119 break;
6120 case Static:
6121 if (isFragmentStart) {
6122 // entire template is static but SSRed as a fragment
6123 node = nextSibling(node);
6124 domType = node.nodeType;
6125 }
6126 if (domType === 1 /* DOMNodeTypes.ELEMENT */ || domType === 3 /* DOMNodeTypes.TEXT */) {
6127 // determine anchor, adopt content
6128 nextNode = node;
6129 // if the static vnode has its content stripped during build,
6130 // adopt it from the server-rendered HTML.
6131 const needToAdoptContent = !vnode.children.length;
6132 for (let i = 0; i < vnode.staticCount; i++) {
6133 if (needToAdoptContent)
6134 vnode.children +=
6135 nextNode.nodeType === 1 /* DOMNodeTypes.ELEMENT */
6136 ? nextNode.outerHTML
6137 : nextNode.data;
6138 if (i === vnode.staticCount - 1) {
6139 vnode.anchor = nextNode;
6140 }
6141 nextNode = nextSibling(nextNode);
6142 }
6143 return isFragmentStart ? nextSibling(nextNode) : nextNode;
6144 }
6145 else {
6146 onMismatch();
6147 }
6148 break;
6149 case Fragment:
6150 if (!isFragmentStart) {
6151 nextNode = onMismatch();
6152 }
6153 else {
6154 nextNode = hydrateFragment(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
6155 }
6156 break;
6157 default:
6158 if (shapeFlag & 1 /* ShapeFlags.ELEMENT */) {
6159 if (domType !== 1 /* DOMNodeTypes.ELEMENT */ ||
6160 vnode.type.toLowerCase() !==
6161 node.tagName.toLowerCase()) {
6162 nextNode = onMismatch();
6163 }
6164 else {
6165 nextNode = hydrateElement(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
6166 }
6167 }
6168 else if (shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
6169 // when setting up the render effect, if the initial vnode already
6170 // has .el set, the component will perform hydration instead of mount
6171 // on its sub-tree.
6172 vnode.slotScopeIds = slotScopeIds;
6173 const container = parentNode(node);
6174 mountComponent(vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), optimized);
6175 // component may be async, so in the case of fragments we cannot rely
6176 // on component's rendered output to determine the end of the fragment
6177 // instead, we do a lookahead to find the end anchor node.
6178 nextNode = isFragmentStart
6179 ? locateClosingAsyncAnchor(node)
6180 : nextSibling(node);
6181 // #4293 teleport as component root
6182 if (nextNode &&
6183 isComment(nextNode) &&
6184 nextNode.data === 'teleport end') {
6185 nextNode = nextSibling(nextNode);
6186 }
6187 // #3787
6188 // if component is async, it may get moved / unmounted before its
6189 // inner component is loaded, so we need to give it a placeholder
6190 // vnode that matches its adopted DOM.
6191 if (isAsyncWrapper(vnode)) {
6192 let subTree;
6193 if (isFragmentStart) {
6194 subTree = createVNode(Fragment);
6195 subTree.anchor = nextNode
6196 ? nextNode.previousSibling
6197 : container.lastChild;
6198 }
6199 else {
6200 subTree =
6201 node.nodeType === 3 ? createTextVNode('') : createVNode('div');
6202 }
6203 subTree.el = node;
6204 vnode.component.subTree = subTree;
6205 }
6206 }
6207 else if (shapeFlag & 64 /* ShapeFlags.TELEPORT */) {
6208 if (domType !== 8 /* DOMNodeTypes.COMMENT */) {
6209 nextNode = onMismatch();
6210 }
6211 else {
6212 nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, rendererInternals, hydrateChildren);
6213 }
6214 }
6215 else if (shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
6216 nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, isSVGContainer(parentNode(node)), slotScopeIds, optimized, rendererInternals, hydrateNode);
6217 }
6218 else {
6219 warn$1('Invalid HostVNode type:', type, `(${typeof type})`);
6220 }
6221 }
6222 if (ref != null) {
6223 setRef(ref, null, parentSuspense, vnode);
6224 }
6225 return nextNode;
6226 };
6227 const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
6228 optimized = optimized || !!vnode.dynamicChildren;
6229 const { type, props, patchFlag, shapeFlag, dirs } = vnode;
6230 // #4006 for form elements with non-string v-model value bindings
6231 // e.g. <option :value="obj">, <input type="checkbox" :true-value="1">
6232 const forcePatchValue = (type === 'input' && dirs) || type === 'option';
6233 // skip props & children if this is hoisted static nodes
6234 // #5405 in dev, always hydrate children for HMR
6235 {
6236 if (dirs) {
6237 invokeDirectiveHook(vnode, null, parentComponent, 'created');
6238 }
6239 // props
6240 if (props) {
6241 if (forcePatchValue ||
6242 !optimized ||
6243 patchFlag & (16 /* PatchFlags.FULL_PROPS */ | 32 /* PatchFlags.HYDRATE_EVENTS */)) {
6244 for (const key in props) {
6245 if ((forcePatchValue && key.endsWith('value')) ||
6246 (isOn(key) && !isReservedProp(key))) {
6247 patchProp(el, key, null, props[key], false, undefined, parentComponent);
6248 }
6249 }
6250 }
6251 else if (props.onClick) {
6252 // Fast path for click listeners (which is most often) to avoid
6253 // iterating through props.
6254 patchProp(el, 'onClick', null, props.onClick, false, undefined, parentComponent);
6255 }
6256 }
6257 // vnode / directive hooks
6258 let vnodeHooks;
6259 if ((vnodeHooks = props && props.onVnodeBeforeMount)) {
6260 invokeVNodeHook(vnodeHooks, parentComponent, vnode);
6261 }
6262 if (dirs) {
6263 invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
6264 }
6265 if ((vnodeHooks = props && props.onVnodeMounted) || dirs) {
6266 queueEffectWithSuspense(() => {
6267 vnodeHooks && invokeVNodeHook(vnodeHooks, parentComponent, vnode);
6268 dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
6269 }, parentSuspense);
6270 }
6271 // children
6272 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */ &&
6273 // skip if element has innerHTML / textContent
6274 !(props && (props.innerHTML || props.textContent))) {
6275 let next = hydrateChildren(el.firstChild, vnode, el, parentComponent, parentSuspense, slotScopeIds, optimized);
6276 let hasWarned = false;
6277 while (next) {
6278 hasMismatch = true;
6279 if (!hasWarned) {
6280 warn$1(`Hydration children mismatch in <${vnode.type}>: ` +
6281 `server rendered element contains more child nodes than client vdom.`);
6282 hasWarned = true;
6283 }
6284 // The SSRed DOM contains more nodes than it should. Remove them.
6285 const cur = next;
6286 next = next.nextSibling;
6287 remove(cur);
6288 }
6289 }
6290 else if (shapeFlag & 8 /* ShapeFlags.TEXT_CHILDREN */) {
6291 if (el.textContent !== vnode.children) {
6292 hasMismatch = true;
6293 warn$1(`Hydration text content mismatch in <${vnode.type}>:\n` +
6294 `- Client: ${el.textContent}\n` +
6295 `- Server: ${vnode.children}`);
6296 el.textContent = vnode.children;
6297 }
6298 }
6299 }
6300 return el.nextSibling;
6301 };
6302 const hydrateChildren = (node, parentVNode, container, parentComponent, parentSuspense, slotScopeIds, optimized) => {
6303 optimized = optimized || !!parentVNode.dynamicChildren;
6304 const children = parentVNode.children;
6305 const l = children.length;
6306 let hasWarned = false;
6307 for (let i = 0; i < l; i++) {
6308 const vnode = optimized
6309 ? children[i]
6310 : (children[i] = normalizeVNode(children[i]));
6311 if (node) {
6312 node = hydrateNode(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized);
6313 }
6314 else if (vnode.type === Text && !vnode.children) {
6315 continue;
6316 }
6317 else {
6318 hasMismatch = true;
6319 if (!hasWarned) {
6320 warn$1(`Hydration children mismatch in <${container.tagName.toLowerCase()}>: ` +
6321 `server rendered element contains fewer child nodes than client vdom.`);
6322 hasWarned = true;
6323 }
6324 // the SSRed DOM didn't contain enough nodes. Mount the missing ones.
6325 patch(null, vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
6326 }
6327 }
6328 return node;
6329 };
6330 const hydrateFragment = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
6331 const { slotScopeIds: fragmentSlotScopeIds } = vnode;
6332 if (fragmentSlotScopeIds) {
6333 slotScopeIds = slotScopeIds
6334 ? slotScopeIds.concat(fragmentSlotScopeIds)
6335 : fragmentSlotScopeIds;
6336 }
6337 const container = parentNode(node);
6338 const next = hydrateChildren(nextSibling(node), vnode, container, parentComponent, parentSuspense, slotScopeIds, optimized);
6339 if (next && isComment(next) && next.data === ']') {
6340 return nextSibling((vnode.anchor = next));
6341 }
6342 else {
6343 // fragment didn't hydrate successfully, since we didn't get a end anchor
6344 // back. This should have led to node/children mismatch warnings.
6345 hasMismatch = true;
6346 // since the anchor is missing, we need to create one and insert it
6347 insert((vnode.anchor = createComment(`]`)), container, next);
6348 return next;
6349 }
6350 };
6351 const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
6352 hasMismatch = true;
6353 warn$1(`Hydration node mismatch:\n- Client vnode:`, vnode.type, `\n- Server rendered DOM:`, node, node.nodeType === 3 /* DOMNodeTypes.TEXT */
6354 ? `(text)`
6355 : isComment(node) && node.data === '['
6356 ? `(start of fragment)`
6357 : ``);
6358 vnode.el = null;
6359 if (isFragment) {
6360 // remove excessive fragment nodes
6361 const end = locateClosingAsyncAnchor(node);
6362 while (true) {
6363 const next = nextSibling(node);
6364 if (next && next !== end) {
6365 remove(next);
6366 }
6367 else {
6368 break;
6369 }
6370 }
6371 }
6372 const next = nextSibling(node);
6373 const container = parentNode(node);
6374 remove(node);
6375 patch(null, vnode, container, next, parentComponent, parentSuspense, isSVGContainer(container), slotScopeIds);
6376 return next;
6377 };
6378 const locateClosingAsyncAnchor = (node) => {
6379 let match = 0;
6380 while (node) {
6381 node = nextSibling(node);
6382 if (node && isComment(node)) {
6383 if (node.data === '[')
6384 match++;
6385 if (node.data === ']') {
6386 if (match === 0) {
6387 return nextSibling(node);
6388 }
6389 else {
6390 match--;
6391 }
6392 }
6393 }
6394 }
6395 return node;
6396 };
6397 return [hydrate, hydrateNode];
6398}
6399
6400/* eslint-disable no-restricted-globals */
6401let supported;
6402let perf;
6403function startMeasure(instance, type) {
6404 if (instance.appContext.config.performance && isSupported()) {
6405 perf.mark(`vue-${type}-${instance.uid}`);
6406 }
6407 {
6408 devtoolsPerfStart(instance, type, isSupported() ? perf.now() : Date.now());
6409 }
6410}
6411function endMeasure(instance, type) {
6412 if (instance.appContext.config.performance && isSupported()) {
6413 const startTag = `vue-${type}-${instance.uid}`;
6414 const endTag = startTag + `:end`;
6415 perf.mark(endTag);
6416 perf.measure(`<${formatComponentName(instance, instance.type)}> ${type}`, startTag, endTag);
6417 perf.clearMarks(startTag);
6418 perf.clearMarks(endTag);
6419 }
6420 {
6421 devtoolsPerfEnd(instance, type, isSupported() ? perf.now() : Date.now());
6422 }
6423}
6424function isSupported() {
6425 if (supported !== undefined) {
6426 return supported;
6427 }
6428 if (typeof window !== 'undefined' && window.performance) {
6429 supported = true;
6430 perf = window.performance;
6431 }
6432 else {
6433 supported = false;
6434 }
6435 return supported;
6436}
6437
6438const queuePostRenderEffect = queueEffectWithSuspense
6439 ;
6440/**
6441 * The createRenderer function accepts two generic arguments:
6442 * HostNode and HostElement, corresponding to Node and Element types in the
6443 * host environment. For example, for runtime-dom, HostNode would be the DOM
6444 * `Node` interface and HostElement would be the DOM `Element` interface.
6445 *
6446 * Custom renderers can pass in the platform specific types like this:
6447 *
6448 * ``` js
6449 * const { render, createApp } = createRenderer<Node, Element>({
6450 * patchProp,
6451 * ...nodeOps
6452 * })
6453 * ```
6454 */
6455function createRenderer(options) {
6456 return baseCreateRenderer(options);
6457}
6458// Separate API for creating hydration-enabled renderer.
6459// Hydration logic is only used when calling this function, making it
6460// tree-shakable.
6461function createHydrationRenderer(options) {
6462 return baseCreateRenderer(options, createHydrationFunctions);
6463}
6464// implementation
6465function baseCreateRenderer(options, createHydrationFns) {
6466 const target = getGlobalThis();
6467 target.__VUE__ = true;
6468 {
6469 setDevtoolsHook(target.__VUE_DEVTOOLS_GLOBAL_HOOK__, target);
6470 }
6471 const { insert: hostInsert, remove: hostRemove, patchProp: hostPatchProp, createElement: hostCreateElement, createText: hostCreateText, createComment: hostCreateComment, setText: hostSetText, setElementText: hostSetElementText, parentNode: hostParentNode, nextSibling: hostNextSibling, setScopeId: hostSetScopeId = NOOP, insertStaticContent: hostInsertStaticContent } = options;
6472 // Note: functions inside this closure should use `const xxx = () => {}`
6473 // style in order to prevent being inlined by minifiers.
6474 const patch = (n1, n2, container, anchor = null, parentComponent = null, parentSuspense = null, isSVG = false, slotScopeIds = null, optimized = isHmrUpdating ? false : !!n2.dynamicChildren) => {
6475 if (n1 === n2) {
6476 return;
6477 }
6478 // patching & not same type, unmount old tree
6479 if (n1 && !isSameVNodeType(n1, n2)) {
6480 anchor = getNextHostNode(n1);
6481 unmount(n1, parentComponent, parentSuspense, true);
6482 n1 = null;
6483 }
6484 if (n2.patchFlag === -2 /* PatchFlags.BAIL */) {
6485 optimized = false;
6486 n2.dynamicChildren = null;
6487 }
6488 const { type, ref, shapeFlag } = n2;
6489 switch (type) {
6490 case Text:
6491 processText(n1, n2, container, anchor);
6492 break;
6493 case Comment:
6494 processCommentNode(n1, n2, container, anchor);
6495 break;
6496 case Static:
6497 if (n1 == null) {
6498 mountStaticNode(n2, container, anchor, isSVG);
6499 }
6500 else {
6501 patchStaticNode(n1, n2, container, isSVG);
6502 }
6503 break;
6504 case Fragment:
6505 processFragment(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6506 break;
6507 default:
6508 if (shapeFlag & 1 /* ShapeFlags.ELEMENT */) {
6509 processElement(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6510 }
6511 else if (shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
6512 processComponent(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6513 }
6514 else if (shapeFlag & 64 /* ShapeFlags.TELEPORT */) {
6515 type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
6516 }
6517 else if (shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
6518 type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
6519 }
6520 else {
6521 warn$1('Invalid VNode type:', type, `(${typeof type})`);
6522 }
6523 }
6524 // set ref
6525 if (ref != null && parentComponent) {
6526 setRef(ref, n1 && n1.ref, parentSuspense, n2 || n1, !n2);
6527 }
6528 };
6529 const processText = (n1, n2, container, anchor) => {
6530 if (n1 == null) {
6531 hostInsert((n2.el = hostCreateText(n2.children)), container, anchor);
6532 }
6533 else {
6534 const el = (n2.el = n1.el);
6535 if (n2.children !== n1.children) {
6536 hostSetText(el, n2.children);
6537 }
6538 }
6539 };
6540 const processCommentNode = (n1, n2, container, anchor) => {
6541 if (n1 == null) {
6542 hostInsert((n2.el = hostCreateComment(n2.children || '')), container, anchor);
6543 }
6544 else {
6545 // there's no support for dynamic comments
6546 n2.el = n1.el;
6547 }
6548 };
6549 const mountStaticNode = (n2, container, anchor, isSVG) => {
6550 [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG, n2.el, n2.anchor);
6551 };
6552 /**
6553 * Dev / HMR only
6554 */
6555 const patchStaticNode = (n1, n2, container, isSVG) => {
6556 // static nodes are only patched during dev for HMR
6557 if (n2.children !== n1.children) {
6558 const anchor = hostNextSibling(n1.anchor);
6559 // remove existing
6560 removeStaticNode(n1);
6561 [n2.el, n2.anchor] = hostInsertStaticContent(n2.children, container, anchor, isSVG);
6562 }
6563 else {
6564 n2.el = n1.el;
6565 n2.anchor = n1.anchor;
6566 }
6567 };
6568 const moveStaticNode = ({ el, anchor }, container, nextSibling) => {
6569 let next;
6570 while (el && el !== anchor) {
6571 next = hostNextSibling(el);
6572 hostInsert(el, container, nextSibling);
6573 el = next;
6574 }
6575 hostInsert(anchor, container, nextSibling);
6576 };
6577 const removeStaticNode = ({ el, anchor }) => {
6578 let next;
6579 while (el && el !== anchor) {
6580 next = hostNextSibling(el);
6581 hostRemove(el);
6582 el = next;
6583 }
6584 hostRemove(anchor);
6585 };
6586 const processElement = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6587 isSVG = isSVG || n2.type === 'svg';
6588 if (n1 == null) {
6589 mountElement(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6590 }
6591 else {
6592 patchElement(n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6593 }
6594 };
6595 const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6596 let el;
6597 let vnodeHook;
6598 const { type, props, shapeFlag, transition, dirs } = vnode;
6599 el = vnode.el = hostCreateElement(vnode.type, isSVG, props && props.is, props);
6600 // mount children first, since some props may rely on child content
6601 // being already rendered, e.g. `<select value>`
6602 if (shapeFlag & 8 /* ShapeFlags.TEXT_CHILDREN */) {
6603 hostSetElementText(el, vnode.children);
6604 }
6605 else if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
6606 mountChildren(vnode.children, el, null, parentComponent, parentSuspense, isSVG && type !== 'foreignObject', slotScopeIds, optimized);
6607 }
6608 if (dirs) {
6609 invokeDirectiveHook(vnode, null, parentComponent, 'created');
6610 }
6611 // props
6612 if (props) {
6613 for (const key in props) {
6614 if (key !== 'value' && !isReservedProp(key)) {
6615 hostPatchProp(el, key, null, props[key], isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6616 }
6617 }
6618 /**
6619 * Special case for setting value on DOM elements:
6620 * - it can be order-sensitive (e.g. should be set *after* min/max, #2325, #4024)
6621 * - it needs to be forced (#1471)
6622 * #2353 proposes adding another renderer option to configure this, but
6623 * the properties affects are so finite it is worth special casing it
6624 * here to reduce the complexity. (Special casing it also should not
6625 * affect non-DOM renderers)
6626 */
6627 if ('value' in props) {
6628 hostPatchProp(el, 'value', null, props.value);
6629 }
6630 if ((vnodeHook = props.onVnodeBeforeMount)) {
6631 invokeVNodeHook(vnodeHook, parentComponent, vnode);
6632 }
6633 }
6634 // scopeId
6635 setScopeId(el, vnode, vnode.scopeId, slotScopeIds, parentComponent);
6636 {
6637 Object.defineProperty(el, '__vnode', {
6638 value: vnode,
6639 enumerable: false
6640 });
6641 Object.defineProperty(el, '__vueParentComponent', {
6642 value: parentComponent,
6643 enumerable: false
6644 });
6645 }
6646 if (dirs) {
6647 invokeDirectiveHook(vnode, null, parentComponent, 'beforeMount');
6648 }
6649 // #1583 For inside suspense + suspense not resolved case, enter hook should call when suspense resolved
6650 // #1689 For inside suspense + suspense resolved case, just call it
6651 const needCallTransitionHooks = (!parentSuspense || (parentSuspense && !parentSuspense.pendingBranch)) &&
6652 transition &&
6653 !transition.persisted;
6654 if (needCallTransitionHooks) {
6655 transition.beforeEnter(el);
6656 }
6657 hostInsert(el, container, anchor);
6658 if ((vnodeHook = props && props.onVnodeMounted) ||
6659 needCallTransitionHooks ||
6660 dirs) {
6661 queuePostRenderEffect(() => {
6662 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
6663 needCallTransitionHooks && transition.enter(el);
6664 dirs && invokeDirectiveHook(vnode, null, parentComponent, 'mounted');
6665 }, parentSuspense);
6666 }
6667 };
6668 const setScopeId = (el, vnode, scopeId, slotScopeIds, parentComponent) => {
6669 if (scopeId) {
6670 hostSetScopeId(el, scopeId);
6671 }
6672 if (slotScopeIds) {
6673 for (let i = 0; i < slotScopeIds.length; i++) {
6674 hostSetScopeId(el, slotScopeIds[i]);
6675 }
6676 }
6677 if (parentComponent) {
6678 let subTree = parentComponent.subTree;
6679 if (subTree.patchFlag > 0 &&
6680 subTree.patchFlag & 2048 /* PatchFlags.DEV_ROOT_FRAGMENT */) {
6681 subTree =
6682 filterSingleRoot(subTree.children) || subTree;
6683 }
6684 if (vnode === subTree) {
6685 const parentVNode = parentComponent.vnode;
6686 setScopeId(el, parentVNode, parentVNode.scopeId, parentVNode.slotScopeIds, parentComponent.parent);
6687 }
6688 }
6689 };
6690 const mountChildren = (children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, start = 0) => {
6691 for (let i = start; i < children.length; i++) {
6692 const child = (children[i] = optimized
6693 ? cloneIfMounted(children[i])
6694 : normalizeVNode(children[i]));
6695 patch(null, child, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6696 }
6697 };
6698 const patchElement = (n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6699 const el = (n2.el = n1.el);
6700 let { patchFlag, dynamicChildren, dirs } = n2;
6701 // #1426 take the old vnode's patch flag into account since user may clone a
6702 // compiler-generated vnode, which de-opts to FULL_PROPS
6703 patchFlag |= n1.patchFlag & 16 /* PatchFlags.FULL_PROPS */;
6704 const oldProps = n1.props || EMPTY_OBJ;
6705 const newProps = n2.props || EMPTY_OBJ;
6706 let vnodeHook;
6707 // disable recurse in beforeUpdate hooks
6708 parentComponent && toggleRecurse(parentComponent, false);
6709 if ((vnodeHook = newProps.onVnodeBeforeUpdate)) {
6710 invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
6711 }
6712 if (dirs) {
6713 invokeDirectiveHook(n2, n1, parentComponent, 'beforeUpdate');
6714 }
6715 parentComponent && toggleRecurse(parentComponent, true);
6716 if (isHmrUpdating) {
6717 // HMR updated, force full diff
6718 patchFlag = 0;
6719 optimized = false;
6720 dynamicChildren = null;
6721 }
6722 const areChildrenSVG = isSVG && n2.type !== 'foreignObject';
6723 if (dynamicChildren) {
6724 patchBlockChildren(n1.dynamicChildren, dynamicChildren, el, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds);
6725 if (parentComponent && parentComponent.type.__hmrId) {
6726 traverseStaticChildren(n1, n2);
6727 }
6728 }
6729 else if (!optimized) {
6730 // full diff
6731 patchChildren(n1, n2, el, null, parentComponent, parentSuspense, areChildrenSVG, slotScopeIds, false);
6732 }
6733 if (patchFlag > 0) {
6734 // the presence of a patchFlag means this element's render code was
6735 // generated by the compiler and can take the fast path.
6736 // in this path old node and new node are guaranteed to have the same shape
6737 // (i.e. at the exact same position in the source template)
6738 if (patchFlag & 16 /* PatchFlags.FULL_PROPS */) {
6739 // element props contain dynamic keys, full diff needed
6740 patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
6741 }
6742 else {
6743 // class
6744 // this flag is matched when the element has dynamic class bindings.
6745 if (patchFlag & 2 /* PatchFlags.CLASS */) {
6746 if (oldProps.class !== newProps.class) {
6747 hostPatchProp(el, 'class', null, newProps.class, isSVG);
6748 }
6749 }
6750 // style
6751 // this flag is matched when the element has dynamic style bindings
6752 if (patchFlag & 4 /* PatchFlags.STYLE */) {
6753 hostPatchProp(el, 'style', oldProps.style, newProps.style, isSVG);
6754 }
6755 // props
6756 // This flag is matched when the element has dynamic prop/attr bindings
6757 // other than class and style. The keys of dynamic prop/attrs are saved for
6758 // faster iteration.
6759 // Note dynamic keys like :[foo]="bar" will cause this optimization to
6760 // bail out and go through a full diff because we need to unset the old key
6761 if (patchFlag & 8 /* PatchFlags.PROPS */) {
6762 // if the flag is present then dynamicProps must be non-null
6763 const propsToUpdate = n2.dynamicProps;
6764 for (let i = 0; i < propsToUpdate.length; i++) {
6765 const key = propsToUpdate[i];
6766 const prev = oldProps[key];
6767 const next = newProps[key];
6768 // #1471 force patch value
6769 if (next !== prev || key === 'value') {
6770 hostPatchProp(el, key, prev, next, isSVG, n1.children, parentComponent, parentSuspense, unmountChildren);
6771 }
6772 }
6773 }
6774 }
6775 // text
6776 // This flag is matched when the element has only dynamic text children.
6777 if (patchFlag & 1 /* PatchFlags.TEXT */) {
6778 if (n1.children !== n2.children) {
6779 hostSetElementText(el, n2.children);
6780 }
6781 }
6782 }
6783 else if (!optimized && dynamicChildren == null) {
6784 // unoptimized, full diff
6785 patchProps(el, n2, oldProps, newProps, parentComponent, parentSuspense, isSVG);
6786 }
6787 if ((vnodeHook = newProps.onVnodeUpdated) || dirs) {
6788 queuePostRenderEffect(() => {
6789 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, n2, n1);
6790 dirs && invokeDirectiveHook(n2, n1, parentComponent, 'updated');
6791 }, parentSuspense);
6792 }
6793 };
6794 // The fast path for blocks.
6795 const patchBlockChildren = (oldChildren, newChildren, fallbackContainer, parentComponent, parentSuspense, isSVG, slotScopeIds) => {
6796 for (let i = 0; i < newChildren.length; i++) {
6797 const oldVNode = oldChildren[i];
6798 const newVNode = newChildren[i];
6799 // Determine the container (parent element) for the patch.
6800 const container =
6801 // oldVNode may be an errored async setup() component inside Suspense
6802 // which will not have a mounted element
6803 oldVNode.el &&
6804 // - In the case of a Fragment, we need to provide the actual parent
6805 // of the Fragment itself so it can move its children.
6806 (oldVNode.type === Fragment ||
6807 // - In the case of different nodes, there is going to be a replacement
6808 // which also requires the correct parent container
6809 !isSameVNodeType(oldVNode, newVNode) ||
6810 // - In the case of a component, it could contain anything.
6811 oldVNode.shapeFlag & (6 /* ShapeFlags.COMPONENT */ | 64 /* ShapeFlags.TELEPORT */))
6812 ? hostParentNode(oldVNode.el)
6813 : // In other cases, the parent container is not actually used so we
6814 // just pass the block element here to avoid a DOM parentNode call.
6815 fallbackContainer;
6816 patch(oldVNode, newVNode, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, true);
6817 }
6818 };
6819 const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, isSVG) => {
6820 if (oldProps !== newProps) {
6821 if (oldProps !== EMPTY_OBJ) {
6822 for (const key in oldProps) {
6823 if (!isReservedProp(key) && !(key in newProps)) {
6824 hostPatchProp(el, key, oldProps[key], null, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6825 }
6826 }
6827 }
6828 for (const key in newProps) {
6829 // empty string is not valid prop
6830 if (isReservedProp(key))
6831 continue;
6832 const next = newProps[key];
6833 const prev = oldProps[key];
6834 // defer patching value
6835 if (next !== prev && key !== 'value') {
6836 hostPatchProp(el, key, prev, next, isSVG, vnode.children, parentComponent, parentSuspense, unmountChildren);
6837 }
6838 }
6839 if ('value' in newProps) {
6840 hostPatchProp(el, 'value', oldProps.value, newProps.value);
6841 }
6842 }
6843 };
6844 const processFragment = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6845 const fragmentStartAnchor = (n2.el = n1 ? n1.el : hostCreateText(''));
6846 const fragmentEndAnchor = (n2.anchor = n1 ? n1.anchor : hostCreateText(''));
6847 let { patchFlag, dynamicChildren, slotScopeIds: fragmentSlotScopeIds } = n2;
6848 if (// #5523 dev root fragment may inherit directives
6849 (isHmrUpdating || patchFlag & 2048 /* PatchFlags.DEV_ROOT_FRAGMENT */)) {
6850 // HMR updated / Dev root fragment (w/ comments), force full diff
6851 patchFlag = 0;
6852 optimized = false;
6853 dynamicChildren = null;
6854 }
6855 // check if this is a slot fragment with :slotted scope ids
6856 if (fragmentSlotScopeIds) {
6857 slotScopeIds = slotScopeIds
6858 ? slotScopeIds.concat(fragmentSlotScopeIds)
6859 : fragmentSlotScopeIds;
6860 }
6861 if (n1 == null) {
6862 hostInsert(fragmentStartAnchor, container, anchor);
6863 hostInsert(fragmentEndAnchor, container, anchor);
6864 // a fragment can only have array children
6865 // since they are either generated by the compiler, or implicitly created
6866 // from arrays.
6867 mountChildren(n2.children, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6868 }
6869 else {
6870 if (patchFlag > 0 &&
6871 patchFlag & 64 /* PatchFlags.STABLE_FRAGMENT */ &&
6872 dynamicChildren &&
6873 // #2715 the previous fragment could've been a BAILed one as a result
6874 // of renderSlot() with no valid children
6875 n1.dynamicChildren) {
6876 // a stable fragment (template root or <template v-for>) doesn't need to
6877 // patch children order, but it may contain dynamicChildren.
6878 patchBlockChildren(n1.dynamicChildren, dynamicChildren, container, parentComponent, parentSuspense, isSVG, slotScopeIds);
6879 if (parentComponent && parentComponent.type.__hmrId) {
6880 traverseStaticChildren(n1, n2);
6881 }
6882 else if (
6883 // #2080 if the stable fragment has a key, it's a <template v-for> that may
6884 // get moved around. Make sure all root level vnodes inherit el.
6885 // #2134 or if it's a component root, it may also get moved around
6886 // as the component is being moved.
6887 n2.key != null ||
6888 (parentComponent && n2 === parentComponent.subTree)) {
6889 traverseStaticChildren(n1, n2, true /* shallow */);
6890 }
6891 }
6892 else {
6893 // keyed / unkeyed, or manual fragments.
6894 // for keyed & unkeyed, since they are compiler generated from v-for,
6895 // each child is guaranteed to be a block so the fragment will never
6896 // have dynamicChildren.
6897 patchChildren(n1, n2, container, fragmentEndAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
6898 }
6899 }
6900 };
6901 const processComponent = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
6902 n2.slotScopeIds = slotScopeIds;
6903 if (n1 == null) {
6904 if (n2.shapeFlag & 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */) {
6905 parentComponent.ctx.activate(n2, container, anchor, isSVG, optimized);
6906 }
6907 else {
6908 mountComponent(n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized);
6909 }
6910 }
6911 else {
6912 updateComponent(n1, n2, optimized);
6913 }
6914 };
6915 const mountComponent = (initialVNode, container, anchor, parentComponent, parentSuspense, isSVG, optimized) => {
6916 const instance = (initialVNode.component = createComponentInstance(initialVNode, parentComponent, parentSuspense));
6917 if (instance.type.__hmrId) {
6918 registerHMR(instance);
6919 }
6920 {
6921 pushWarningContext(initialVNode);
6922 startMeasure(instance, `mount`);
6923 }
6924 // inject renderer internals for keepAlive
6925 if (isKeepAlive(initialVNode)) {
6926 instance.ctx.renderer = internals;
6927 }
6928 // resolve props and slots for setup context
6929 {
6930 {
6931 startMeasure(instance, `init`);
6932 }
6933 setupComponent(instance);
6934 {
6935 endMeasure(instance, `init`);
6936 }
6937 }
6938 // setup() is async. This component relies on async logic to be resolved
6939 // before proceeding
6940 if (instance.asyncDep) {
6941 parentSuspense && parentSuspense.registerDep(instance, setupRenderEffect);
6942 // Give it a placeholder if this is not hydration
6943 // TODO handle self-defined fallback
6944 if (!initialVNode.el) {
6945 const placeholder = (instance.subTree = createVNode(Comment));
6946 processCommentNode(null, placeholder, container, anchor);
6947 }
6948 return;
6949 }
6950 setupRenderEffect(instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized);
6951 {
6952 popWarningContext();
6953 endMeasure(instance, `mount`);
6954 }
6955 };
6956 const updateComponent = (n1, n2, optimized) => {
6957 const instance = (n2.component = n1.component);
6958 if (shouldUpdateComponent(n1, n2, optimized)) {
6959 if (instance.asyncDep &&
6960 !instance.asyncResolved) {
6961 // async & still pending - just update props and slots
6962 // since the component's reactive effect for render isn't set-up yet
6963 {
6964 pushWarningContext(n2);
6965 }
6966 updateComponentPreRender(instance, n2, optimized);
6967 {
6968 popWarningContext();
6969 }
6970 return;
6971 }
6972 else {
6973 // normal update
6974 instance.next = n2;
6975 // in case the child component is also queued, remove it to avoid
6976 // double updating the same child component in the same flush.
6977 invalidateJob(instance.update);
6978 // instance.update is the reactive effect.
6979 instance.update();
6980 }
6981 }
6982 else {
6983 // no update needed. just copy over properties
6984 n2.el = n1.el;
6985 instance.vnode = n2;
6986 }
6987 };
6988 const setupRenderEffect = (instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized) => {
6989 const componentUpdateFn = () => {
6990 if (!instance.isMounted) {
6991 let vnodeHook;
6992 const { el, props } = initialVNode;
6993 const { bm, m, parent } = instance;
6994 const isAsyncWrapperVNode = isAsyncWrapper(initialVNode);
6995 toggleRecurse(instance, false);
6996 // beforeMount hook
6997 if (bm) {
6998 invokeArrayFns(bm);
6999 }
7000 // onVnodeBeforeMount
7001 if (!isAsyncWrapperVNode &&
7002 (vnodeHook = props && props.onVnodeBeforeMount)) {
7003 invokeVNodeHook(vnodeHook, parent, initialVNode);
7004 }
7005 toggleRecurse(instance, true);
7006 if (el && hydrateNode) {
7007 // vnode has adopted host node - perform hydration instead of mount.
7008 const hydrateSubTree = () => {
7009 {
7010 startMeasure(instance, `render`);
7011 }
7012 instance.subTree = renderComponentRoot(instance);
7013 {
7014 endMeasure(instance, `render`);
7015 }
7016 {
7017 startMeasure(instance, `hydrate`);
7018 }
7019 hydrateNode(el, instance.subTree, instance, parentSuspense, null);
7020 {
7021 endMeasure(instance, `hydrate`);
7022 }
7023 };
7024 if (isAsyncWrapperVNode) {
7025 initialVNode.type.__asyncLoader().then(
7026 // note: we are moving the render call into an async callback,
7027 // which means it won't track dependencies - but it's ok because
7028 // a server-rendered async wrapper is already in resolved state
7029 // and it will never need to change.
7030 () => !instance.isUnmounted && hydrateSubTree());
7031 }
7032 else {
7033 hydrateSubTree();
7034 }
7035 }
7036 else {
7037 {
7038 startMeasure(instance, `render`);
7039 }
7040 const subTree = (instance.subTree = renderComponentRoot(instance));
7041 {
7042 endMeasure(instance, `render`);
7043 }
7044 {
7045 startMeasure(instance, `patch`);
7046 }
7047 patch(null, subTree, container, anchor, instance, parentSuspense, isSVG);
7048 {
7049 endMeasure(instance, `patch`);
7050 }
7051 initialVNode.el = subTree.el;
7052 }
7053 // mounted hook
7054 if (m) {
7055 queuePostRenderEffect(m, parentSuspense);
7056 }
7057 // onVnodeMounted
7058 if (!isAsyncWrapperVNode &&
7059 (vnodeHook = props && props.onVnodeMounted)) {
7060 const scopedInitialVNode = initialVNode;
7061 queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, scopedInitialVNode), parentSuspense);
7062 }
7063 // activated hook for keep-alive roots.
7064 // #1742 activated hook must be accessed after first render
7065 // since the hook may be injected by a child keep-alive
7066 if (initialVNode.shapeFlag & 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */ ||
7067 (parent &&
7068 isAsyncWrapper(parent.vnode) &&
7069 parent.vnode.shapeFlag & 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */)) {
7070 instance.a && queuePostRenderEffect(instance.a, parentSuspense);
7071 }
7072 instance.isMounted = true;
7073 {
7074 devtoolsComponentAdded(instance);
7075 }
7076 // #2458: deference mount-only object parameters to prevent memleaks
7077 initialVNode = container = anchor = null;
7078 }
7079 else {
7080 // updateComponent
7081 // This is triggered by mutation of component's own state (next: null)
7082 // OR parent calling processComponent (next: VNode)
7083 let { next, bu, u, parent, vnode } = instance;
7084 let originNext = next;
7085 let vnodeHook;
7086 {
7087 pushWarningContext(next || instance.vnode);
7088 }
7089 // Disallow component effect recursion during pre-lifecycle hooks.
7090 toggleRecurse(instance, false);
7091 if (next) {
7092 next.el = vnode.el;
7093 updateComponentPreRender(instance, next, optimized);
7094 }
7095 else {
7096 next = vnode;
7097 }
7098 // beforeUpdate hook
7099 if (bu) {
7100 invokeArrayFns(bu);
7101 }
7102 // onVnodeBeforeUpdate
7103 if ((vnodeHook = next.props && next.props.onVnodeBeforeUpdate)) {
7104 invokeVNodeHook(vnodeHook, parent, next, vnode);
7105 }
7106 toggleRecurse(instance, true);
7107 // render
7108 {
7109 startMeasure(instance, `render`);
7110 }
7111 const nextTree = renderComponentRoot(instance);
7112 {
7113 endMeasure(instance, `render`);
7114 }
7115 const prevTree = instance.subTree;
7116 instance.subTree = nextTree;
7117 {
7118 startMeasure(instance, `patch`);
7119 }
7120 patch(prevTree, nextTree,
7121 // parent may have changed if it's in a teleport
7122 hostParentNode(prevTree.el),
7123 // anchor may have changed if it's in a fragment
7124 getNextHostNode(prevTree), instance, parentSuspense, isSVG);
7125 {
7126 endMeasure(instance, `patch`);
7127 }
7128 next.el = nextTree.el;
7129 if (originNext === null) {
7130 // self-triggered update. In case of HOC, update parent component
7131 // vnode el. HOC is indicated by parent instance's subTree pointing
7132 // to child component's vnode
7133 updateHOCHostEl(instance, nextTree.el);
7134 }
7135 // updated hook
7136 if (u) {
7137 queuePostRenderEffect(u, parentSuspense);
7138 }
7139 // onVnodeUpdated
7140 if ((vnodeHook = next.props && next.props.onVnodeUpdated)) {
7141 queuePostRenderEffect(() => invokeVNodeHook(vnodeHook, parent, next, vnode), parentSuspense);
7142 }
7143 {
7144 devtoolsComponentUpdated(instance);
7145 }
7146 {
7147 popWarningContext();
7148 }
7149 }
7150 };
7151 // create reactive effect for rendering
7152 const effect = (instance.effect = new ReactiveEffect(componentUpdateFn, () => queueJob(update), instance.scope // track it in component's effect scope
7153 ));
7154 const update = (instance.update = () => effect.run());
7155 update.id = instance.uid;
7156 // allowRecurse
7157 // #1801, #2043 component render effects should allow recursive updates
7158 toggleRecurse(instance, true);
7159 {
7160 effect.onTrack = instance.rtc
7161 ? e => invokeArrayFns(instance.rtc, e)
7162 : void 0;
7163 effect.onTrigger = instance.rtg
7164 ? e => invokeArrayFns(instance.rtg, e)
7165 : void 0;
7166 update.ownerInstance = instance;
7167 }
7168 update();
7169 };
7170 const updateComponentPreRender = (instance, nextVNode, optimized) => {
7171 nextVNode.component = instance;
7172 const prevProps = instance.vnode.props;
7173 instance.vnode = nextVNode;
7174 instance.next = null;
7175 updateProps(instance, nextVNode.props, prevProps, optimized);
7176 updateSlots(instance, nextVNode.children, optimized);
7177 pauseTracking();
7178 // props update may have triggered pre-flush watchers.
7179 // flush them before the render update.
7180 flushPreFlushCbs();
7181 resetTracking();
7182 };
7183 const patchChildren = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized = false) => {
7184 const c1 = n1 && n1.children;
7185 const prevShapeFlag = n1 ? n1.shapeFlag : 0;
7186 const c2 = n2.children;
7187 const { patchFlag, shapeFlag } = n2;
7188 // fast path
7189 if (patchFlag > 0) {
7190 if (patchFlag & 128 /* PatchFlags.KEYED_FRAGMENT */) {
7191 // this could be either fully-keyed or mixed (some keyed some not)
7192 // presence of patchFlag means children are guaranteed to be arrays
7193 patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7194 return;
7195 }
7196 else if (patchFlag & 256 /* PatchFlags.UNKEYED_FRAGMENT */) {
7197 // unkeyed
7198 patchUnkeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7199 return;
7200 }
7201 }
7202 // children has 3 possibilities: text, array or no children.
7203 if (shapeFlag & 8 /* ShapeFlags.TEXT_CHILDREN */) {
7204 // text children fast path
7205 if (prevShapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7206 unmountChildren(c1, parentComponent, parentSuspense);
7207 }
7208 if (c2 !== c1) {
7209 hostSetElementText(container, c2);
7210 }
7211 }
7212 else {
7213 if (prevShapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7214 // prev children was array
7215 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7216 // two arrays, cannot assume anything, do full diff
7217 patchKeyedChildren(c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7218 }
7219 else {
7220 // no new children, just unmount old
7221 unmountChildren(c1, parentComponent, parentSuspense, true);
7222 }
7223 }
7224 else {
7225 // prev children was text OR null
7226 // new children is array OR null
7227 if (prevShapeFlag & 8 /* ShapeFlags.TEXT_CHILDREN */) {
7228 hostSetElementText(container, '');
7229 }
7230 // mount new if array
7231 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7232 mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7233 }
7234 }
7235 }
7236 };
7237 const patchUnkeyedChildren = (c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
7238 c1 = c1 || EMPTY_ARR;
7239 c2 = c2 || EMPTY_ARR;
7240 const oldLength = c1.length;
7241 const newLength = c2.length;
7242 const commonLength = Math.min(oldLength, newLength);
7243 let i;
7244 for (i = 0; i < commonLength; i++) {
7245 const nextChild = (c2[i] = optimized
7246 ? cloneIfMounted(c2[i])
7247 : normalizeVNode(c2[i]));
7248 patch(c1[i], nextChild, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7249 }
7250 if (oldLength > newLength) {
7251 // remove old
7252 unmountChildren(c1, parentComponent, parentSuspense, true, false, commonLength);
7253 }
7254 else {
7255 // mount new
7256 mountChildren(c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, commonLength);
7257 }
7258 };
7259 // can be all-keyed or mixed
7260 const patchKeyedChildren = (c1, c2, container, parentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
7261 let i = 0;
7262 const l2 = c2.length;
7263 let e1 = c1.length - 1; // prev ending index
7264 let e2 = l2 - 1; // next ending index
7265 // 1. sync from start
7266 // (a b) c
7267 // (a b) d e
7268 while (i <= e1 && i <= e2) {
7269 const n1 = c1[i];
7270 const n2 = (c2[i] = optimized
7271 ? cloneIfMounted(c2[i])
7272 : normalizeVNode(c2[i]));
7273 if (isSameVNodeType(n1, n2)) {
7274 patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7275 }
7276 else {
7277 break;
7278 }
7279 i++;
7280 }
7281 // 2. sync from end
7282 // a (b c)
7283 // d e (b c)
7284 while (i <= e1 && i <= e2) {
7285 const n1 = c1[e1];
7286 const n2 = (c2[e2] = optimized
7287 ? cloneIfMounted(c2[e2])
7288 : normalizeVNode(c2[e2]));
7289 if (isSameVNodeType(n1, n2)) {
7290 patch(n1, n2, container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7291 }
7292 else {
7293 break;
7294 }
7295 e1--;
7296 e2--;
7297 }
7298 // 3. common sequence + mount
7299 // (a b)
7300 // (a b) c
7301 // i = 2, e1 = 1, e2 = 2
7302 // (a b)
7303 // c (a b)
7304 // i = 0, e1 = -1, e2 = 0
7305 if (i > e1) {
7306 if (i <= e2) {
7307 const nextPos = e2 + 1;
7308 const anchor = nextPos < l2 ? c2[nextPos].el : parentAnchor;
7309 while (i <= e2) {
7310 patch(null, (c2[i] = optimized
7311 ? cloneIfMounted(c2[i])
7312 : normalizeVNode(c2[i])), container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7313 i++;
7314 }
7315 }
7316 }
7317 // 4. common sequence + unmount
7318 // (a b) c
7319 // (a b)
7320 // i = 2, e1 = 2, e2 = 1
7321 // a (b c)
7322 // (b c)
7323 // i = 0, e1 = 0, e2 = -1
7324 else if (i > e2) {
7325 while (i <= e1) {
7326 unmount(c1[i], parentComponent, parentSuspense, true);
7327 i++;
7328 }
7329 }
7330 // 5. unknown sequence
7331 // [i ... e1 + 1]: a b [c d e] f g
7332 // [i ... e2 + 1]: a b [e d c h] f g
7333 // i = 2, e1 = 4, e2 = 5
7334 else {
7335 const s1 = i; // prev starting index
7336 const s2 = i; // next starting index
7337 // 5.1 build key:index map for newChildren
7338 const keyToNewIndexMap = new Map();
7339 for (i = s2; i <= e2; i++) {
7340 const nextChild = (c2[i] = optimized
7341 ? cloneIfMounted(c2[i])
7342 : normalizeVNode(c2[i]));
7343 if (nextChild.key != null) {
7344 if (keyToNewIndexMap.has(nextChild.key)) {
7345 warn$1(`Duplicate keys found during update:`, JSON.stringify(nextChild.key), `Make sure keys are unique.`);
7346 }
7347 keyToNewIndexMap.set(nextChild.key, i);
7348 }
7349 }
7350 // 5.2 loop through old children left to be patched and try to patch
7351 // matching nodes & remove nodes that are no longer present
7352 let j;
7353 let patched = 0;
7354 const toBePatched = e2 - s2 + 1;
7355 let moved = false;
7356 // used to track whether any node has moved
7357 let maxNewIndexSoFar = 0;
7358 // works as Map<newIndex, oldIndex>
7359 // Note that oldIndex is offset by +1
7360 // and oldIndex = 0 is a special value indicating the new node has
7361 // no corresponding old node.
7362 // used for determining longest stable subsequence
7363 const newIndexToOldIndexMap = new Array(toBePatched);
7364 for (i = 0; i < toBePatched; i++)
7365 newIndexToOldIndexMap[i] = 0;
7366 for (i = s1; i <= e1; i++) {
7367 const prevChild = c1[i];
7368 if (patched >= toBePatched) {
7369 // all new children have been patched so this can only be a removal
7370 unmount(prevChild, parentComponent, parentSuspense, true);
7371 continue;
7372 }
7373 let newIndex;
7374 if (prevChild.key != null) {
7375 newIndex = keyToNewIndexMap.get(prevChild.key);
7376 }
7377 else {
7378 // key-less node, try to locate a key-less node of the same type
7379 for (j = s2; j <= e2; j++) {
7380 if (newIndexToOldIndexMap[j - s2] === 0 &&
7381 isSameVNodeType(prevChild, c2[j])) {
7382 newIndex = j;
7383 break;
7384 }
7385 }
7386 }
7387 if (newIndex === undefined) {
7388 unmount(prevChild, parentComponent, parentSuspense, true);
7389 }
7390 else {
7391 newIndexToOldIndexMap[newIndex - s2] = i + 1;
7392 if (newIndex >= maxNewIndexSoFar) {
7393 maxNewIndexSoFar = newIndex;
7394 }
7395 else {
7396 moved = true;
7397 }
7398 patch(prevChild, c2[newIndex], container, null, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7399 patched++;
7400 }
7401 }
7402 // 5.3 move and mount
7403 // generate longest stable subsequence only when nodes have moved
7404 const increasingNewIndexSequence = moved
7405 ? getSequence(newIndexToOldIndexMap)
7406 : EMPTY_ARR;
7407 j = increasingNewIndexSequence.length - 1;
7408 // looping backwards so that we can use last patched node as anchor
7409 for (i = toBePatched - 1; i >= 0; i--) {
7410 const nextIndex = s2 + i;
7411 const nextChild = c2[nextIndex];
7412 const anchor = nextIndex + 1 < l2 ? c2[nextIndex + 1].el : parentAnchor;
7413 if (newIndexToOldIndexMap[i] === 0) {
7414 // mount new
7415 patch(null, nextChild, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7416 }
7417 else if (moved) {
7418 // move if:
7419 // There is no stable subsequence (e.g. a reverse)
7420 // OR current node is not among the stable sequence
7421 if (j < 0 || i !== increasingNewIndexSequence[j]) {
7422 move(nextChild, container, anchor, 2 /* MoveType.REORDER */);
7423 }
7424 else {
7425 j--;
7426 }
7427 }
7428 }
7429 }
7430 };
7431 const move = (vnode, container, anchor, moveType, parentSuspense = null) => {
7432 const { el, type, transition, children, shapeFlag } = vnode;
7433 if (shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
7434 move(vnode.component.subTree, container, anchor, moveType);
7435 return;
7436 }
7437 if (shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
7438 vnode.suspense.move(container, anchor, moveType);
7439 return;
7440 }
7441 if (shapeFlag & 64 /* ShapeFlags.TELEPORT */) {
7442 type.move(vnode, container, anchor, internals);
7443 return;
7444 }
7445 if (type === Fragment) {
7446 hostInsert(el, container, anchor);
7447 for (let i = 0; i < children.length; i++) {
7448 move(children[i], container, anchor, moveType);
7449 }
7450 hostInsert(vnode.anchor, container, anchor);
7451 return;
7452 }
7453 if (type === Static) {
7454 moveStaticNode(vnode, container, anchor);
7455 return;
7456 }
7457 // single nodes
7458 const needTransition = moveType !== 2 /* MoveType.REORDER */ &&
7459 shapeFlag & 1 /* ShapeFlags.ELEMENT */ &&
7460 transition;
7461 if (needTransition) {
7462 if (moveType === 0 /* MoveType.ENTER */) {
7463 transition.beforeEnter(el);
7464 hostInsert(el, container, anchor);
7465 queuePostRenderEffect(() => transition.enter(el), parentSuspense);
7466 }
7467 else {
7468 const { leave, delayLeave, afterLeave } = transition;
7469 const remove = () => hostInsert(el, container, anchor);
7470 const performLeave = () => {
7471 leave(el, () => {
7472 remove();
7473 afterLeave && afterLeave();
7474 });
7475 };
7476 if (delayLeave) {
7477 delayLeave(el, remove, performLeave);
7478 }
7479 else {
7480 performLeave();
7481 }
7482 }
7483 }
7484 else {
7485 hostInsert(el, container, anchor);
7486 }
7487 };
7488 const unmount = (vnode, parentComponent, parentSuspense, doRemove = false, optimized = false) => {
7489 const { type, props, ref, children, dynamicChildren, shapeFlag, patchFlag, dirs } = vnode;
7490 // unset ref
7491 if (ref != null) {
7492 setRef(ref, null, parentSuspense, vnode, true);
7493 }
7494 if (shapeFlag & 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */) {
7495 parentComponent.ctx.deactivate(vnode);
7496 return;
7497 }
7498 const shouldInvokeDirs = shapeFlag & 1 /* ShapeFlags.ELEMENT */ && dirs;
7499 const shouldInvokeVnodeHook = !isAsyncWrapper(vnode);
7500 let vnodeHook;
7501 if (shouldInvokeVnodeHook &&
7502 (vnodeHook = props && props.onVnodeBeforeUnmount)) {
7503 invokeVNodeHook(vnodeHook, parentComponent, vnode);
7504 }
7505 if (shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
7506 unmountComponent(vnode.component, parentSuspense, doRemove);
7507 }
7508 else {
7509 if (shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
7510 vnode.suspense.unmount(parentSuspense, doRemove);
7511 return;
7512 }
7513 if (shouldInvokeDirs) {
7514 invokeDirectiveHook(vnode, null, parentComponent, 'beforeUnmount');
7515 }
7516 if (shapeFlag & 64 /* ShapeFlags.TELEPORT */) {
7517 vnode.type.remove(vnode, parentComponent, parentSuspense, optimized, internals, doRemove);
7518 }
7519 else if (dynamicChildren &&
7520 // #1153: fast path should not be taken for non-stable (v-for) fragments
7521 (type !== Fragment ||
7522 (patchFlag > 0 && patchFlag & 64 /* PatchFlags.STABLE_FRAGMENT */))) {
7523 // fast path for block nodes: only need to unmount dynamic children.
7524 unmountChildren(dynamicChildren, parentComponent, parentSuspense, false, true);
7525 }
7526 else if ((type === Fragment &&
7527 patchFlag &
7528 (128 /* PatchFlags.KEYED_FRAGMENT */ | 256 /* PatchFlags.UNKEYED_FRAGMENT */)) ||
7529 (!optimized && shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */)) {
7530 unmountChildren(children, parentComponent, parentSuspense);
7531 }
7532 if (doRemove) {
7533 remove(vnode);
7534 }
7535 }
7536 if ((shouldInvokeVnodeHook &&
7537 (vnodeHook = props && props.onVnodeUnmounted)) ||
7538 shouldInvokeDirs) {
7539 queuePostRenderEffect(() => {
7540 vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
7541 shouldInvokeDirs &&
7542 invokeDirectiveHook(vnode, null, parentComponent, 'unmounted');
7543 }, parentSuspense);
7544 }
7545 };
7546 const remove = vnode => {
7547 const { type, el, anchor, transition } = vnode;
7548 if (type === Fragment) {
7549 if (vnode.patchFlag > 0 &&
7550 vnode.patchFlag & 2048 /* PatchFlags.DEV_ROOT_FRAGMENT */ &&
7551 transition &&
7552 !transition.persisted) {
7553 vnode.children.forEach(child => {
7554 if (child.type === Comment) {
7555 hostRemove(child.el);
7556 }
7557 else {
7558 remove(child);
7559 }
7560 });
7561 }
7562 else {
7563 removeFragment(el, anchor);
7564 }
7565 return;
7566 }
7567 if (type === Static) {
7568 removeStaticNode(vnode);
7569 return;
7570 }
7571 const performRemove = () => {
7572 hostRemove(el);
7573 if (transition && !transition.persisted && transition.afterLeave) {
7574 transition.afterLeave();
7575 }
7576 };
7577 if (vnode.shapeFlag & 1 /* ShapeFlags.ELEMENT */ &&
7578 transition &&
7579 !transition.persisted) {
7580 const { leave, delayLeave } = transition;
7581 const performLeave = () => leave(el, performRemove);
7582 if (delayLeave) {
7583 delayLeave(vnode.el, performRemove, performLeave);
7584 }
7585 else {
7586 performLeave();
7587 }
7588 }
7589 else {
7590 performRemove();
7591 }
7592 };
7593 const removeFragment = (cur, end) => {
7594 // For fragments, directly remove all contained DOM nodes.
7595 // (fragment child nodes cannot have transition)
7596 let next;
7597 while (cur !== end) {
7598 next = hostNextSibling(cur);
7599 hostRemove(cur);
7600 cur = next;
7601 }
7602 hostRemove(end);
7603 };
7604 const unmountComponent = (instance, parentSuspense, doRemove) => {
7605 if (instance.type.__hmrId) {
7606 unregisterHMR(instance);
7607 }
7608 const { bum, scope, update, subTree, um } = instance;
7609 // beforeUnmount hook
7610 if (bum) {
7611 invokeArrayFns(bum);
7612 }
7613 // stop effects in component scope
7614 scope.stop();
7615 // update may be null if a component is unmounted before its async
7616 // setup has resolved.
7617 if (update) {
7618 // so that scheduler will no longer invoke it
7619 update.active = false;
7620 unmount(subTree, instance, parentSuspense, doRemove);
7621 }
7622 // unmounted hook
7623 if (um) {
7624 queuePostRenderEffect(um, parentSuspense);
7625 }
7626 queuePostRenderEffect(() => {
7627 instance.isUnmounted = true;
7628 }, parentSuspense);
7629 // A component with async dep inside a pending suspense is unmounted before
7630 // its async dep resolves. This should remove the dep from the suspense, and
7631 // cause the suspense to resolve immediately if that was the last dep.
7632 if (parentSuspense &&
7633 parentSuspense.pendingBranch &&
7634 !parentSuspense.isUnmounted &&
7635 instance.asyncDep &&
7636 !instance.asyncResolved &&
7637 instance.suspenseId === parentSuspense.pendingId) {
7638 parentSuspense.deps--;
7639 if (parentSuspense.deps === 0) {
7640 parentSuspense.resolve();
7641 }
7642 }
7643 {
7644 devtoolsComponentRemoved(instance);
7645 }
7646 };
7647 const unmountChildren = (children, parentComponent, parentSuspense, doRemove = false, optimized = false, start = 0) => {
7648 for (let i = start; i < children.length; i++) {
7649 unmount(children[i], parentComponent, parentSuspense, doRemove, optimized);
7650 }
7651 };
7652 const getNextHostNode = vnode => {
7653 if (vnode.shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
7654 return getNextHostNode(vnode.component.subTree);
7655 }
7656 if (vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
7657 return vnode.suspense.next();
7658 }
7659 return hostNextSibling((vnode.anchor || vnode.el));
7660 };
7661 const render = (vnode, container, isSVG) => {
7662 if (vnode == null) {
7663 if (container._vnode) {
7664 unmount(container._vnode, null, null, true);
7665 }
7666 }
7667 else {
7668 patch(container._vnode || null, vnode, container, null, null, null, isSVG);
7669 }
7670 flushPreFlushCbs();
7671 flushPostFlushCbs();
7672 container._vnode = vnode;
7673 };
7674 const internals = {
7675 p: patch,
7676 um: unmount,
7677 m: move,
7678 r: remove,
7679 mt: mountComponent,
7680 mc: mountChildren,
7681 pc: patchChildren,
7682 pbc: patchBlockChildren,
7683 n: getNextHostNode,
7684 o: options
7685 };
7686 let hydrate;
7687 let hydrateNode;
7688 if (createHydrationFns) {
7689 [hydrate, hydrateNode] = createHydrationFns(internals);
7690 }
7691 return {
7692 render,
7693 hydrate,
7694 createApp: createAppAPI(render, hydrate)
7695 };
7696}
7697function toggleRecurse({ effect, update }, allowed) {
7698 effect.allowRecurse = update.allowRecurse = allowed;
7699}
7700/**
7701 * #1156
7702 * When a component is HMR-enabled, we need to make sure that all static nodes
7703 * inside a block also inherit the DOM element from the previous tree so that
7704 * HMR updates (which are full updates) can retrieve the element for patching.
7705 *
7706 * #2080
7707 * Inside keyed `template` fragment static children, if a fragment is moved,
7708 * the children will always be moved. Therefore, in order to ensure correct move
7709 * position, el should be inherited from previous nodes.
7710 */
7711function traverseStaticChildren(n1, n2, shallow = false) {
7712 const ch1 = n1.children;
7713 const ch2 = n2.children;
7714 if (isArray(ch1) && isArray(ch2)) {
7715 for (let i = 0; i < ch1.length; i++) {
7716 // this is only called in the optimized path so array children are
7717 // guaranteed to be vnodes
7718 const c1 = ch1[i];
7719 let c2 = ch2[i];
7720 if (c2.shapeFlag & 1 /* ShapeFlags.ELEMENT */ && !c2.dynamicChildren) {
7721 if (c2.patchFlag <= 0 || c2.patchFlag === 32 /* PatchFlags.HYDRATE_EVENTS */) {
7722 c2 = ch2[i] = cloneIfMounted(ch2[i]);
7723 c2.el = c1.el;
7724 }
7725 if (!shallow)
7726 traverseStaticChildren(c1, c2);
7727 }
7728 // #6852 also inherit for text nodes
7729 if (c2.type === Text) {
7730 c2.el = c1.el;
7731 }
7732 // also inherit for comment nodes, but not placeholders (e.g. v-if which
7733 // would have received .el during block patch)
7734 if (c2.type === Comment && !c2.el) {
7735 c2.el = c1.el;
7736 }
7737 }
7738 }
7739}
7740// https://en.wikipedia.org/wiki/Longest_increasing_subsequence
7741function getSequence(arr) {
7742 const p = arr.slice();
7743 const result = [0];
7744 let i, j, u, v, c;
7745 const len = arr.length;
7746 for (i = 0; i < len; i++) {
7747 const arrI = arr[i];
7748 if (arrI !== 0) {
7749 j = result[result.length - 1];
7750 if (arr[j] < arrI) {
7751 p[i] = j;
7752 result.push(i);
7753 continue;
7754 }
7755 u = 0;
7756 v = result.length - 1;
7757 while (u < v) {
7758 c = (u + v) >> 1;
7759 if (arr[result[c]] < arrI) {
7760 u = c + 1;
7761 }
7762 else {
7763 v = c;
7764 }
7765 }
7766 if (arrI < arr[result[u]]) {
7767 if (u > 0) {
7768 p[i] = result[u - 1];
7769 }
7770 result[u] = i;
7771 }
7772 }
7773 }
7774 u = result.length;
7775 v = result[u - 1];
7776 while (u-- > 0) {
7777 result[u] = v;
7778 v = p[v];
7779 }
7780 return result;
7781}
7782
7783const isTeleport = (type) => type.__isTeleport;
7784const isTeleportDisabled = (props) => props && (props.disabled || props.disabled === '');
7785const isTargetSVG = (target) => typeof SVGElement !== 'undefined' && target instanceof SVGElement;
7786const resolveTarget = (props, select) => {
7787 const targetSelector = props && props.to;
7788 if (isString(targetSelector)) {
7789 if (!select) {
7790 warn$1(`Current renderer does not support string target for Teleports. ` +
7791 `(missing querySelector renderer option)`);
7792 return null;
7793 }
7794 else {
7795 const target = select(targetSelector);
7796 if (!target) {
7797 warn$1(`Failed to locate Teleport target with selector "${targetSelector}". ` +
7798 `Note the target element must exist before the component is mounted - ` +
7799 `i.e. the target cannot be rendered by the component itself, and ` +
7800 `ideally should be outside of the entire Vue component tree.`);
7801 }
7802 return target;
7803 }
7804 }
7805 else {
7806 if (!targetSelector && !isTeleportDisabled(props)) {
7807 warn$1(`Invalid Teleport target: ${targetSelector}`);
7808 }
7809 return targetSelector;
7810 }
7811};
7812const TeleportImpl = {
7813 __isTeleport: true,
7814 process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
7815 const { mc: mountChildren, pc: patchChildren, pbc: patchBlockChildren, o: { insert, querySelector, createText, createComment } } = internals;
7816 const disabled = isTeleportDisabled(n2.props);
7817 let { shapeFlag, children, dynamicChildren } = n2;
7818 // #3302
7819 // HMR updated, force full diff
7820 if (isHmrUpdating) {
7821 optimized = false;
7822 dynamicChildren = null;
7823 }
7824 if (n1 == null) {
7825 // insert anchors in the main view
7826 const placeholder = (n2.el = createComment('teleport start')
7827 );
7828 const mainAnchor = (n2.anchor = createComment('teleport end')
7829 );
7830 insert(placeholder, container, anchor);
7831 insert(mainAnchor, container, anchor);
7832 const target = (n2.target = resolveTarget(n2.props, querySelector));
7833 const targetAnchor = (n2.targetAnchor = createText(''));
7834 if (target) {
7835 insert(targetAnchor, target);
7836 // #2652 we could be teleporting from a non-SVG tree into an SVG tree
7837 isSVG = isSVG || isTargetSVG(target);
7838 }
7839 else if (!disabled) {
7840 warn$1('Invalid Teleport target on mount:', target, `(${typeof target})`);
7841 }
7842 const mount = (container, anchor) => {
7843 // Teleport *always* has Array children. This is enforced in both the
7844 // compiler and vnode children normalization.
7845 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7846 mountChildren(children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized);
7847 }
7848 };
7849 if (disabled) {
7850 mount(container, mainAnchor);
7851 }
7852 else if (target) {
7853 mount(target, targetAnchor);
7854 }
7855 }
7856 else {
7857 // update content
7858 n2.el = n1.el;
7859 const mainAnchor = (n2.anchor = n1.anchor);
7860 const target = (n2.target = n1.target);
7861 const targetAnchor = (n2.targetAnchor = n1.targetAnchor);
7862 const wasDisabled = isTeleportDisabled(n1.props);
7863 const currentContainer = wasDisabled ? container : target;
7864 const currentAnchor = wasDisabled ? mainAnchor : targetAnchor;
7865 isSVG = isSVG || isTargetSVG(target);
7866 if (dynamicChildren) {
7867 // fast path when the teleport happens to be a block root
7868 patchBlockChildren(n1.dynamicChildren, dynamicChildren, currentContainer, parentComponent, parentSuspense, isSVG, slotScopeIds);
7869 // even in block tree mode we need to make sure all root-level nodes
7870 // in the teleport inherit previous DOM references so that they can
7871 // be moved in future patches.
7872 traverseStaticChildren(n1, n2, true);
7873 }
7874 else if (!optimized) {
7875 patchChildren(n1, n2, currentContainer, currentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, false);
7876 }
7877 if (disabled) {
7878 if (!wasDisabled) {
7879 // enabled -> disabled
7880 // move into main container
7881 moveTeleport(n2, container, mainAnchor, internals, 1 /* TeleportMoveTypes.TOGGLE */);
7882 }
7883 }
7884 else {
7885 // target changed
7886 if ((n2.props && n2.props.to) !== (n1.props && n1.props.to)) {
7887 const nextTarget = (n2.target = resolveTarget(n2.props, querySelector));
7888 if (nextTarget) {
7889 moveTeleport(n2, nextTarget, null, internals, 0 /* TeleportMoveTypes.TARGET_CHANGE */);
7890 }
7891 else {
7892 warn$1('Invalid Teleport target on update:', target, `(${typeof target})`);
7893 }
7894 }
7895 else if (wasDisabled) {
7896 // disabled -> enabled
7897 // move into teleport target
7898 moveTeleport(n2, target, targetAnchor, internals, 1 /* TeleportMoveTypes.TOGGLE */);
7899 }
7900 }
7901 }
7902 updateCssVars(n2);
7903 },
7904 remove(vnode, parentComponent, parentSuspense, optimized, { um: unmount, o: { remove: hostRemove } }, doRemove) {
7905 const { shapeFlag, children, anchor, targetAnchor, target, props } = vnode;
7906 if (target) {
7907 hostRemove(targetAnchor);
7908 }
7909 // an unmounted teleport should always remove its children if not disabled
7910 if (doRemove || !isTeleportDisabled(props)) {
7911 hostRemove(anchor);
7912 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7913 for (let i = 0; i < children.length; i++) {
7914 const child = children[i];
7915 unmount(child, parentComponent, parentSuspense, true, !!child.dynamicChildren);
7916 }
7917 }
7918 }
7919 },
7920 move: moveTeleport,
7921 hydrate: hydrateTeleport
7922};
7923function moveTeleport(vnode, container, parentAnchor, { o: { insert }, m: move }, moveType = 2 /* TeleportMoveTypes.REORDER */) {
7924 // move target anchor if this is a target change.
7925 if (moveType === 0 /* TeleportMoveTypes.TARGET_CHANGE */) {
7926 insert(vnode.targetAnchor, container, parentAnchor);
7927 }
7928 const { el, anchor, shapeFlag, children, props } = vnode;
7929 const isReorder = moveType === 2 /* TeleportMoveTypes.REORDER */;
7930 // move main view anchor if this is a re-order.
7931 if (isReorder) {
7932 insert(el, container, parentAnchor);
7933 }
7934 // if this is a re-order and teleport is enabled (content is in target)
7935 // do not move children. So the opposite is: only move children if this
7936 // is not a reorder, or the teleport is disabled
7937 if (!isReorder || isTeleportDisabled(props)) {
7938 // Teleport has either Array children or no children.
7939 if (shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7940 for (let i = 0; i < children.length; i++) {
7941 move(children[i], container, parentAnchor, 2 /* MoveType.REORDER */);
7942 }
7943 }
7944 }
7945 // move main view anchor if this is a re-order.
7946 if (isReorder) {
7947 insert(anchor, container, parentAnchor);
7948 }
7949}
7950function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, { o: { nextSibling, parentNode, querySelector } }, hydrateChildren) {
7951 const target = (vnode.target = resolveTarget(vnode.props, querySelector));
7952 if (target) {
7953 // if multiple teleports rendered to the same target element, we need to
7954 // pick up from where the last teleport finished instead of the first node
7955 const targetNode = target._lpa || target.firstChild;
7956 if (vnode.shapeFlag & 16 /* ShapeFlags.ARRAY_CHILDREN */) {
7957 if (isTeleportDisabled(vnode.props)) {
7958 vnode.anchor = hydrateChildren(nextSibling(node), vnode, parentNode(node), parentComponent, parentSuspense, slotScopeIds, optimized);
7959 vnode.targetAnchor = targetNode;
7960 }
7961 else {
7962 vnode.anchor = nextSibling(node);
7963 // lookahead until we find the target anchor
7964 // we cannot rely on return value of hydrateChildren() because there
7965 // could be nested teleports
7966 let targetAnchor = targetNode;
7967 while (targetAnchor) {
7968 targetAnchor = nextSibling(targetAnchor);
7969 if (targetAnchor &&
7970 targetAnchor.nodeType === 8 &&
7971 targetAnchor.data === 'teleport anchor') {
7972 vnode.targetAnchor = targetAnchor;
7973 target._lpa =
7974 vnode.targetAnchor && nextSibling(vnode.targetAnchor);
7975 break;
7976 }
7977 }
7978 hydrateChildren(targetNode, vnode, target, parentComponent, parentSuspense, slotScopeIds, optimized);
7979 }
7980 }
7981 updateCssVars(vnode);
7982 }
7983 return vnode.anchor && nextSibling(vnode.anchor);
7984}
7985// Force-casted public typing for h and TSX props inference
7986const Teleport = TeleportImpl;
7987function updateCssVars(vnode) {
7988 // presence of .ut method indicates owner component uses css vars.
7989 // code path here can assume browser environment.
7990 const ctx = vnode.ctx;
7991 if (ctx && ctx.ut) {
7992 let node = vnode.children[0].el;
7993 while (node !== vnode.targetAnchor) {
7994 if (node.nodeType === 1)
7995 node.setAttribute('data-v-owner', ctx.uid);
7996 node = node.nextSibling;
7997 }
7998 ctx.ut();
7999 }
8000}
8001
8002const Fragment = Symbol('Fragment' );
8003const Text = Symbol('Text' );
8004const Comment = Symbol('Comment' );
8005const Static = Symbol('Static' );
8006// Since v-if and v-for are the two possible ways node structure can dynamically
8007// change, once we consider v-if branches and each v-for fragment a block, we
8008// can divide a template into nested blocks, and within each block the node
8009// structure would be stable. This allows us to skip most children diffing
8010// and only worry about the dynamic nodes (indicated by patch flags).
8011const blockStack = [];
8012let currentBlock = null;
8013/**
8014 * Open a block.
8015 * This must be called before `createBlock`. It cannot be part of `createBlock`
8016 * because the children of the block are evaluated before `createBlock` itself
8017 * is called. The generated code typically looks like this:
8018 *
8019 * ```js
8020 * function render() {
8021 * return (openBlock(),createBlock('div', null, [...]))
8022 * }
8023 * ```
8024 * disableTracking is true when creating a v-for fragment block, since a v-for
8025 * fragment always diffs its children.
8026 *
8027 * @private
8028 */
8029function openBlock(disableTracking = false) {
8030 blockStack.push((currentBlock = disableTracking ? null : []));
8031}
8032function closeBlock() {
8033 blockStack.pop();
8034 currentBlock = blockStack[blockStack.length - 1] || null;
8035}
8036// Whether we should be tracking dynamic child nodes inside a block.
8037// Only tracks when this value is > 0
8038// We are not using a simple boolean because this value may need to be
8039// incremented/decremented by nested usage of v-once (see below)
8040let isBlockTreeEnabled = 1;
8041/**
8042 * Block tracking sometimes needs to be disabled, for example during the
8043 * creation of a tree that needs to be cached by v-once. The compiler generates
8044 * code like this:
8045 *
8046 * ``` js
8047 * _cache[1] || (
8048 * setBlockTracking(-1),
8049 * _cache[1] = createVNode(...),
8050 * setBlockTracking(1),
8051 * _cache[1]
8052 * )
8053 * ```
8054 *
8055 * @private
8056 */
8057function setBlockTracking(value) {
8058 isBlockTreeEnabled += value;
8059}
8060function setupBlock(vnode) {
8061 // save current block children on the block vnode
8062 vnode.dynamicChildren =
8063 isBlockTreeEnabled > 0 ? currentBlock || EMPTY_ARR : null;
8064 // close block
8065 closeBlock();
8066 // a block is always going to be patched, so track it as a child of its
8067 // parent block
8068 if (isBlockTreeEnabled > 0 && currentBlock) {
8069 currentBlock.push(vnode);
8070 }
8071 return vnode;
8072}
8073/**
8074 * @private
8075 */
8076function createElementBlock(type, props, children, patchFlag, dynamicProps, shapeFlag) {
8077 return setupBlock(createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, true /* isBlock */));
8078}
8079/**
8080 * Create a block root vnode. Takes the same exact arguments as `createVNode`.
8081 * A block root keeps track of dynamic nodes within the block in the
8082 * `dynamicChildren` array.
8083 *
8084 * @private
8085 */
8086function createBlock(type, props, children, patchFlag, dynamicProps) {
8087 return setupBlock(createVNode(type, props, children, patchFlag, dynamicProps, true /* isBlock: prevent a block from tracking itself */));
8088}
8089function isVNode(value) {
8090 return value ? value.__v_isVNode === true : false;
8091}
8092function isSameVNodeType(n1, n2) {
8093 if (n2.shapeFlag & 6 /* ShapeFlags.COMPONENT */ &&
8094 hmrDirtyComponents.has(n2.type)) {
8095 // #7042, ensure the vnode being unmounted during HMR
8096 // bitwise operations to remove keep alive flags
8097 n1.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
8098 n2.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
8099 // HMR only: if the component has been hot-updated, force a reload.
8100 return false;
8101 }
8102 return n1.type === n2.type && n1.key === n2.key;
8103}
8104let vnodeArgsTransformer;
8105/**
8106 * Internal API for registering an arguments transform for createVNode
8107 * used for creating stubs in the test-utils
8108 * It is *internal* but needs to be exposed for test-utils to pick up proper
8109 * typings
8110 */
8111function transformVNodeArgs(transformer) {
8112 vnodeArgsTransformer = transformer;
8113}
8114const createVNodeWithArgsTransform = (...args) => {
8115 return _createVNode(...(vnodeArgsTransformer
8116 ? vnodeArgsTransformer(args, currentRenderingInstance)
8117 : args));
8118};
8119const InternalObjectKey = `__vInternal`;
8120const normalizeKey = ({ key }) => key != null ? key : null;
8121const normalizeRef = ({ ref, ref_key, ref_for }) => {
8122 return (ref != null
8123 ? isString(ref) || isRef(ref) || isFunction(ref)
8124 ? { i: currentRenderingInstance, r: ref, k: ref_key, f: !!ref_for }
8125 : ref
8126 : null);
8127};
8128function createBaseVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, shapeFlag = type === Fragment ? 0 : 1 /* ShapeFlags.ELEMENT */, isBlockNode = false, needFullChildrenNormalization = false) {
8129 const vnode = {
8130 __v_isVNode: true,
8131 __v_skip: true,
8132 type,
8133 props,
8134 key: props && normalizeKey(props),
8135 ref: props && normalizeRef(props),
8136 scopeId: currentScopeId,
8137 slotScopeIds: null,
8138 children,
8139 component: null,
8140 suspense: null,
8141 ssContent: null,
8142 ssFallback: null,
8143 dirs: null,
8144 transition: null,
8145 el: null,
8146 anchor: null,
8147 target: null,
8148 targetAnchor: null,
8149 staticCount: 0,
8150 shapeFlag,
8151 patchFlag,
8152 dynamicProps,
8153 dynamicChildren: null,
8154 appContext: null,
8155 ctx: currentRenderingInstance
8156 };
8157 if (needFullChildrenNormalization) {
8158 normalizeChildren(vnode, children);
8159 // normalize suspense children
8160 if (shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
8161 type.normalize(vnode);
8162 }
8163 }
8164 else if (children) {
8165 // compiled element vnode - if children is passed, only possible types are
8166 // string or Array.
8167 vnode.shapeFlag |= isString(children)
8168 ? 8 /* ShapeFlags.TEXT_CHILDREN */
8169 : 16 /* ShapeFlags.ARRAY_CHILDREN */;
8170 }
8171 // validate key
8172 if (vnode.key !== vnode.key) {
8173 warn$1(`VNode created with invalid key (NaN). VNode type:`, vnode.type);
8174 }
8175 // track vnode for block tree
8176 if (isBlockTreeEnabled > 0 &&
8177 // avoid a block node from tracking itself
8178 !isBlockNode &&
8179 // has current parent block
8180 currentBlock &&
8181 // presence of a patch flag indicates this node needs patching on updates.
8182 // component nodes also should always be patched, because even if the
8183 // component doesn't need to update, it needs to persist the instance on to
8184 // the next vnode so that it can be properly unmounted later.
8185 (vnode.patchFlag > 0 || shapeFlag & 6 /* ShapeFlags.COMPONENT */) &&
8186 // the EVENTS flag is only for hydration and if it is the only flag, the
8187 // vnode should not be considered dynamic due to handler caching.
8188 vnode.patchFlag !== 32 /* PatchFlags.HYDRATE_EVENTS */) {
8189 currentBlock.push(vnode);
8190 }
8191 return vnode;
8192}
8193const createVNode = (createVNodeWithArgsTransform );
8194function _createVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, isBlockNode = false) {
8195 if (!type || type === NULL_DYNAMIC_COMPONENT) {
8196 if (!type) {
8197 warn$1(`Invalid vnode type when creating vnode: ${type}.`);
8198 }
8199 type = Comment;
8200 }
8201 if (isVNode(type)) {
8202 // createVNode receiving an existing vnode. This happens in cases like
8203 // <component :is="vnode"/>
8204 // #2078 make sure to merge refs during the clone instead of overwriting it
8205 const cloned = cloneVNode(type, props, true /* mergeRef: true */);
8206 if (children) {
8207 normalizeChildren(cloned, children);
8208 }
8209 if (isBlockTreeEnabled > 0 && !isBlockNode && currentBlock) {
8210 if (cloned.shapeFlag & 6 /* ShapeFlags.COMPONENT */) {
8211 currentBlock[currentBlock.indexOf(type)] = cloned;
8212 }
8213 else {
8214 currentBlock.push(cloned);
8215 }
8216 }
8217 cloned.patchFlag |= -2 /* PatchFlags.BAIL */;
8218 return cloned;
8219 }
8220 // class component normalization.
8221 if (isClassComponent(type)) {
8222 type = type.__vccOpts;
8223 }
8224 // class & style normalization.
8225 if (props) {
8226 // for reactive or proxy objects, we need to clone it to enable mutation.
8227 props = guardReactiveProps(props);
8228 let { class: klass, style } = props;
8229 if (klass && !isString(klass)) {
8230 props.class = normalizeClass(klass);
8231 }
8232 if (isObject(style)) {
8233 // reactive state objects need to be cloned since they are likely to be
8234 // mutated
8235 if (isProxy(style) && !isArray(style)) {
8236 style = extend({}, style);
8237 }
8238 props.style = normalizeStyle(style);
8239 }
8240 }
8241 // encode the vnode type information into a bitmap
8242 const shapeFlag = isString(type)
8243 ? 1 /* ShapeFlags.ELEMENT */
8244 : isSuspense(type)
8245 ? 128 /* ShapeFlags.SUSPENSE */
8246 : isTeleport(type)
8247 ? 64 /* ShapeFlags.TELEPORT */
8248 : isObject(type)
8249 ? 4 /* ShapeFlags.STATEFUL_COMPONENT */
8250 : isFunction(type)
8251 ? 2 /* ShapeFlags.FUNCTIONAL_COMPONENT */
8252 : 0;
8253 if (shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */ && isProxy(type)) {
8254 type = toRaw(type);
8255 warn$1(`Vue received a Component which was made a reactive object. This can ` +
8256 `lead to unnecessary performance overhead, and should be avoided by ` +
8257 `marking the component with \`markRaw\` or using \`shallowRef\` ` +
8258 `instead of \`ref\`.`, `\nComponent that was made reactive: `, type);
8259 }
8260 return createBaseVNode(type, props, children, patchFlag, dynamicProps, shapeFlag, isBlockNode, true);
8261}
8262function guardReactiveProps(props) {
8263 if (!props)
8264 return null;
8265 return isProxy(props) || InternalObjectKey in props
8266 ? extend({}, props)
8267 : props;
8268}
8269function cloneVNode(vnode, extraProps, mergeRef = false) {
8270 // This is intentionally NOT using spread or extend to avoid the runtime
8271 // key enumeration cost.
8272 const { props, ref, patchFlag, children } = vnode;
8273 const mergedProps = extraProps ? mergeProps(props || {}, extraProps) : props;
8274 const cloned = {
8275 __v_isVNode: true,
8276 __v_skip: true,
8277 type: vnode.type,
8278 props: mergedProps,
8279 key: mergedProps && normalizeKey(mergedProps),
8280 ref: extraProps && extraProps.ref
8281 ? // #2078 in the case of <component :is="vnode" ref="extra"/>
8282 // if the vnode itself already has a ref, cloneVNode will need to merge
8283 // the refs so the single vnode can be set on multiple refs
8284 mergeRef && ref
8285 ? isArray(ref)
8286 ? ref.concat(normalizeRef(extraProps))
8287 : [ref, normalizeRef(extraProps)]
8288 : normalizeRef(extraProps)
8289 : ref,
8290 scopeId: vnode.scopeId,
8291 slotScopeIds: vnode.slotScopeIds,
8292 children: patchFlag === -1 /* PatchFlags.HOISTED */ && isArray(children)
8293 ? children.map(deepCloneVNode)
8294 : children,
8295 target: vnode.target,
8296 targetAnchor: vnode.targetAnchor,
8297 staticCount: vnode.staticCount,
8298 shapeFlag: vnode.shapeFlag,
8299 // if the vnode is cloned with extra props, we can no longer assume its
8300 // existing patch flag to be reliable and need to add the FULL_PROPS flag.
8301 // note: preserve flag for fragments since they use the flag for children
8302 // fast paths only.
8303 patchFlag: extraProps && vnode.type !== Fragment
8304 ? patchFlag === -1 // hoisted node
8305 ? 16 /* PatchFlags.FULL_PROPS */
8306 : patchFlag | 16 /* PatchFlags.FULL_PROPS */
8307 : patchFlag,
8308 dynamicProps: vnode.dynamicProps,
8309 dynamicChildren: vnode.dynamicChildren,
8310 appContext: vnode.appContext,
8311 dirs: vnode.dirs,
8312 transition: vnode.transition,
8313 // These should technically only be non-null on mounted VNodes. However,
8314 // they *should* be copied for kept-alive vnodes. So we just always copy
8315 // them since them being non-null during a mount doesn't affect the logic as
8316 // they will simply be overwritten.
8317 component: vnode.component,
8318 suspense: vnode.suspense,
8319 ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
8320 ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
8321 el: vnode.el,
8322 anchor: vnode.anchor,
8323 ctx: vnode.ctx
8324 };
8325 return cloned;
8326}
8327/**
8328 * Dev only, for HMR of hoisted vnodes reused in v-for
8329 * https://github.com/vitejs/vite/issues/2022
8330 */
8331function deepCloneVNode(vnode) {
8332 const cloned = cloneVNode(vnode);
8333 if (isArray(vnode.children)) {
8334 cloned.children = vnode.children.map(deepCloneVNode);
8335 }
8336 return cloned;
8337}
8338/**
8339 * @private
8340 */
8341function createTextVNode(text = ' ', flag = 0) {
8342 return createVNode(Text, null, text, flag);
8343}
8344/**
8345 * @private
8346 */
8347function createStaticVNode(content, numberOfNodes) {
8348 // A static vnode can contain multiple stringified elements, and the number
8349 // of elements is necessary for hydration.
8350 const vnode = createVNode(Static, null, content);
8351 vnode.staticCount = numberOfNodes;
8352 return vnode;
8353}
8354/**
8355 * @private
8356 */
8357function createCommentVNode(text = '',
8358// when used as the v-else branch, the comment node must be created as a
8359// block to ensure correct updates.
8360asBlock = false) {
8361 return asBlock
8362 ? (openBlock(), createBlock(Comment, null, text))
8363 : createVNode(Comment, null, text);
8364}
8365function normalizeVNode(child) {
8366 if (child == null || typeof child === 'boolean') {
8367 // empty placeholder
8368 return createVNode(Comment);
8369 }
8370 else if (isArray(child)) {
8371 // fragment
8372 return createVNode(Fragment, null,
8373 // #3666, avoid reference pollution when reusing vnode
8374 child.slice());
8375 }
8376 else if (typeof child === 'object') {
8377 // already vnode, this should be the most common since compiled templates
8378 // always produce all-vnode children arrays
8379 return cloneIfMounted(child);
8380 }
8381 else {
8382 // strings and numbers
8383 return createVNode(Text, null, String(child));
8384 }
8385}
8386// optimized normalization for template-compiled render fns
8387function cloneIfMounted(child) {
8388 return (child.el === null && child.patchFlag !== -1 /* PatchFlags.HOISTED */) ||
8389 child.memo
8390 ? child
8391 : cloneVNode(child);
8392}
8393function normalizeChildren(vnode, children) {
8394 let type = 0;
8395 const { shapeFlag } = vnode;
8396 if (children == null) {
8397 children = null;
8398 }
8399 else if (isArray(children)) {
8400 type = 16 /* ShapeFlags.ARRAY_CHILDREN */;
8401 }
8402 else if (typeof children === 'object') {
8403 if (shapeFlag & (1 /* ShapeFlags.ELEMENT */ | 64 /* ShapeFlags.TELEPORT */)) {
8404 // Normalize slot to plain children for plain element and Teleport
8405 const slot = children.default;
8406 if (slot) {
8407 // _c marker is added by withCtx() indicating this is a compiled slot
8408 slot._c && (slot._d = false);
8409 normalizeChildren(vnode, slot());
8410 slot._c && (slot._d = true);
8411 }
8412 return;
8413 }
8414 else {
8415 type = 32 /* ShapeFlags.SLOTS_CHILDREN */;
8416 const slotFlag = children._;
8417 if (!slotFlag && !(InternalObjectKey in children)) {
8418 children._ctx = currentRenderingInstance;
8419 }
8420 else if (slotFlag === 3 /* SlotFlags.FORWARDED */ && currentRenderingInstance) {
8421 // a child component receives forwarded slots from the parent.
8422 // its slot type is determined by its parent's slot type.
8423 if (currentRenderingInstance.slots._ === 1 /* SlotFlags.STABLE */) {
8424 children._ = 1 /* SlotFlags.STABLE */;
8425 }
8426 else {
8427 children._ = 2 /* SlotFlags.DYNAMIC */;
8428 vnode.patchFlag |= 1024 /* PatchFlags.DYNAMIC_SLOTS */;
8429 }
8430 }
8431 }
8432 }
8433 else if (isFunction(children)) {
8434 children = { default: children, _ctx: currentRenderingInstance };
8435 type = 32 /* ShapeFlags.SLOTS_CHILDREN */;
8436 }
8437 else {
8438 children = String(children);
8439 // force teleport children to array so it can be moved around
8440 if (shapeFlag & 64 /* ShapeFlags.TELEPORT */) {
8441 type = 16 /* ShapeFlags.ARRAY_CHILDREN */;
8442 children = [createTextVNode(children)];
8443 }
8444 else {
8445 type = 8 /* ShapeFlags.TEXT_CHILDREN */;
8446 }
8447 }
8448 vnode.children = children;
8449 vnode.shapeFlag |= type;
8450}
8451function mergeProps(...args) {
8452 const ret = {};
8453 for (let i = 0; i < args.length; i++) {
8454 const toMerge = args[i];
8455 for (const key in toMerge) {
8456 if (key === 'class') {
8457 if (ret.class !== toMerge.class) {
8458 ret.class = normalizeClass([ret.class, toMerge.class]);
8459 }
8460 }
8461 else if (key === 'style') {
8462 ret.style = normalizeStyle([ret.style, toMerge.style]);
8463 }
8464 else if (isOn(key)) {
8465 const existing = ret[key];
8466 const incoming = toMerge[key];
8467 if (incoming &&
8468 existing !== incoming &&
8469 !(isArray(existing) && existing.includes(incoming))) {
8470 ret[key] = existing
8471 ? [].concat(existing, incoming)
8472 : incoming;
8473 }
8474 }
8475 else if (key !== '') {
8476 ret[key] = toMerge[key];
8477 }
8478 }
8479 }
8480 return ret;
8481}
8482function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
8483 callWithAsyncErrorHandling(hook, instance, 7 /* ErrorCodes.VNODE_HOOK */, [
8484 vnode,
8485 prevVNode
8486 ]);
8487}
8488
8489const emptyAppContext = createAppContext();
8490let uid$1 = 0;
8491function createComponentInstance(vnode, parent, suspense) {
8492 const type = vnode.type;
8493 // inherit parent app context - or - if root, adopt from root vnode
8494 const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
8495 const instance = {
8496 uid: uid$1++,
8497 vnode,
8498 type,
8499 parent,
8500 appContext,
8501 root: null,
8502 next: null,
8503 subTree: null,
8504 effect: null,
8505 update: null,
8506 scope: new EffectScope(true /* detached */),
8507 render: null,
8508 proxy: null,
8509 exposed: null,
8510 exposeProxy: null,
8511 withProxy: null,
8512 provides: parent ? parent.provides : Object.create(appContext.provides),
8513 accessCache: null,
8514 renderCache: [],
8515 // local resolved assets
8516 components: null,
8517 directives: null,
8518 // resolved props and emits options
8519 propsOptions: normalizePropsOptions(type, appContext),
8520 emitsOptions: normalizeEmitsOptions(type, appContext),
8521 // emit
8522 emit: null,
8523 emitted: null,
8524 // props default value
8525 propsDefaults: EMPTY_OBJ,
8526 // inheritAttrs
8527 inheritAttrs: type.inheritAttrs,
8528 // state
8529 ctx: EMPTY_OBJ,
8530 data: EMPTY_OBJ,
8531 props: EMPTY_OBJ,
8532 attrs: EMPTY_OBJ,
8533 slots: EMPTY_OBJ,
8534 refs: EMPTY_OBJ,
8535 setupState: EMPTY_OBJ,
8536 setupContext: null,
8537 // suspense related
8538 suspense,
8539 suspenseId: suspense ? suspense.pendingId : 0,
8540 asyncDep: null,
8541 asyncResolved: false,
8542 // lifecycle hooks
8543 // not using enums here because it results in computed properties
8544 isMounted: false,
8545 isUnmounted: false,
8546 isDeactivated: false,
8547 bc: null,
8548 c: null,
8549 bm: null,
8550 m: null,
8551 bu: null,
8552 u: null,
8553 um: null,
8554 bum: null,
8555 da: null,
8556 a: null,
8557 rtg: null,
8558 rtc: null,
8559 ec: null,
8560 sp: null
8561 };
8562 {
8563 instance.ctx = createDevRenderContext(instance);
8564 }
8565 instance.root = parent ? parent.root : instance;
8566 instance.emit = emit$1.bind(null, instance);
8567 // apply custom element special handling
8568 if (vnode.ce) {
8569 vnode.ce(instance);
8570 }
8571 return instance;
8572}
8573let currentInstance = null;
8574const getCurrentInstance = () => currentInstance || currentRenderingInstance;
8575const setCurrentInstance = (instance) => {
8576 currentInstance = instance;
8577 instance.scope.on();
8578};
8579const unsetCurrentInstance = () => {
8580 currentInstance && currentInstance.scope.off();
8581 currentInstance = null;
8582};
8583const isBuiltInTag = /*#__PURE__*/ makeMap('slot,component');
8584function validateComponentName(name, config) {
8585 const appIsNativeTag = config.isNativeTag || NO;
8586 if (isBuiltInTag(name) || appIsNativeTag(name)) {
8587 warn$1('Do not use built-in or reserved HTML elements as component id: ' + name);
8588 }
8589}
8590function isStatefulComponent(instance) {
8591 return instance.vnode.shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */;
8592}
8593let isInSSRComponentSetup = false;
8594function setupComponent(instance, isSSR = false) {
8595 isInSSRComponentSetup = isSSR;
8596 const { props, children } = instance.vnode;
8597 const isStateful = isStatefulComponent(instance);
8598 initProps(instance, props, isStateful, isSSR);
8599 initSlots(instance, children);
8600 const setupResult = isStateful
8601 ? setupStatefulComponent(instance, isSSR)
8602 : undefined;
8603 isInSSRComponentSetup = false;
8604 return setupResult;
8605}
8606function setupStatefulComponent(instance, isSSR) {
8607 var _a;
8608 const Component = instance.type;
8609 {
8610 if (Component.name) {
8611 validateComponentName(Component.name, instance.appContext.config);
8612 }
8613 if (Component.components) {
8614 const names = Object.keys(Component.components);
8615 for (let i = 0; i < names.length; i++) {
8616 validateComponentName(names[i], instance.appContext.config);
8617 }
8618 }
8619 if (Component.directives) {
8620 const names = Object.keys(Component.directives);
8621 for (let i = 0; i < names.length; i++) {
8622 validateDirectiveName(names[i]);
8623 }
8624 }
8625 if (Component.compilerOptions && isRuntimeOnly()) {
8626 warn$1(`"compilerOptions" is only supported when using a build of Vue that ` +
8627 `includes the runtime compiler. Since you are using a runtime-only ` +
8628 `build, the options should be passed via your build tool config instead.`);
8629 }
8630 }
8631 // 0. create render proxy property access cache
8632 instance.accessCache = Object.create(null);
8633 // 1. create public instance / render proxy
8634 // also mark it raw so it's never observed
8635 instance.proxy = markRaw(new Proxy(instance.ctx, PublicInstanceProxyHandlers));
8636 {
8637 exposePropsOnRenderContext(instance);
8638 }
8639 // 2. call setup()
8640 const { setup } = Component;
8641 if (setup) {
8642 const setupContext = (instance.setupContext =
8643 setup.length > 1 ? createSetupContext(instance) : null);
8644 setCurrentInstance(instance);
8645 pauseTracking();
8646 const setupResult = callWithErrorHandling(setup, instance, 0 /* ErrorCodes.SETUP_FUNCTION */, [shallowReadonly(instance.props) , setupContext]);
8647 resetTracking();
8648 unsetCurrentInstance();
8649 if (isPromise(setupResult)) {
8650 setupResult.then(unsetCurrentInstance, unsetCurrentInstance);
8651 if (isSSR) {
8652 // return the promise so server-renderer can wait on it
8653 return setupResult
8654 .then((resolvedResult) => {
8655 handleSetupResult(instance, resolvedResult, isSSR);
8656 })
8657 .catch(e => {
8658 handleError(e, instance, 0 /* ErrorCodes.SETUP_FUNCTION */);
8659 });
8660 }
8661 else {
8662 // async setup returned Promise.
8663 // bail here and wait for re-entry.
8664 instance.asyncDep = setupResult;
8665 if (!instance.suspense) {
8666 const name = (_a = Component.name) !== null && _a !== void 0 ? _a : 'Anonymous';
8667 warn$1(`Component <${name}>: setup function returned a promise, but no ` +
8668 `<Suspense> boundary was found in the parent component tree. ` +
8669 `A component with async setup() must be nested in a <Suspense> ` +
8670 `in order to be rendered.`);
8671 }
8672 }
8673 }
8674 else {
8675 handleSetupResult(instance, setupResult, isSSR);
8676 }
8677 }
8678 else {
8679 finishComponentSetup(instance, isSSR);
8680 }
8681}
8682function handleSetupResult(instance, setupResult, isSSR) {
8683 if (isFunction(setupResult)) {
8684 // setup returned an inline render function
8685 {
8686 instance.render = setupResult;
8687 }
8688 }
8689 else if (isObject(setupResult)) {
8690 if (isVNode(setupResult)) {
8691 warn$1(`setup() should not return VNodes directly - ` +
8692 `return a render function instead.`);
8693 }
8694 // setup returned bindings.
8695 // assuming a render function compiled from template is present.
8696 {
8697 instance.devtoolsRawSetupState = setupResult;
8698 }
8699 instance.setupState = proxyRefs(setupResult);
8700 {
8701 exposeSetupStateOnRenderContext(instance);
8702 }
8703 }
8704 else if (setupResult !== undefined) {
8705 warn$1(`setup() should return an object. Received: ${setupResult === null ? 'null' : typeof setupResult}`);
8706 }
8707 finishComponentSetup(instance, isSSR);
8708}
8709let compile;
8710let installWithProxy;
8711/**
8712 * For runtime-dom to register the compiler.
8713 * Note the exported method uses any to avoid d.ts relying on the compiler types.
8714 */
8715function registerRuntimeCompiler(_compile) {
8716 compile = _compile;
8717 installWithProxy = i => {
8718 if (i.render._rc) {
8719 i.withProxy = new Proxy(i.ctx, RuntimeCompiledPublicInstanceProxyHandlers);
8720 }
8721 };
8722}
8723// dev only
8724const isRuntimeOnly = () => !compile;
8725function finishComponentSetup(instance, isSSR, skipOptions) {
8726 const Component = instance.type;
8727 // template / render function normalization
8728 // could be already set when returned from setup()
8729 if (!instance.render) {
8730 // only do on-the-fly compile if not in SSR - SSR on-the-fly compilation
8731 // is done by server-renderer
8732 if (!isSSR && compile && !Component.render) {
8733 const template = Component.template ||
8734 resolveMergedOptions(instance).template;
8735 if (template) {
8736 {
8737 startMeasure(instance, `compile`);
8738 }
8739 const { isCustomElement, compilerOptions } = instance.appContext.config;
8740 const { delimiters, compilerOptions: componentCompilerOptions } = Component;
8741 const finalCompilerOptions = extend(extend({
8742 isCustomElement,
8743 delimiters
8744 }, compilerOptions), componentCompilerOptions);
8745 Component.render = compile(template, finalCompilerOptions);
8746 {
8747 endMeasure(instance, `compile`);
8748 }
8749 }
8750 }
8751 instance.render = (Component.render || NOOP);
8752 // for runtime-compiled render functions using `with` blocks, the render
8753 // proxy used needs a different `has` handler which is more performant and
8754 // also only allows a whitelist of globals to fallthrough.
8755 if (installWithProxy) {
8756 installWithProxy(instance);
8757 }
8758 }
8759 // support for 2.x options
8760 {
8761 setCurrentInstance(instance);
8762 pauseTracking();
8763 applyOptions(instance);
8764 resetTracking();
8765 unsetCurrentInstance();
8766 }
8767 // warn missing template/render
8768 // the runtime compilation of template in SSR is done by server-render
8769 if (!Component.render && instance.render === NOOP && !isSSR) {
8770 /* istanbul ignore if */
8771 if (!compile && Component.template) {
8772 warn$1(`Component provided template option but ` +
8773 `runtime compilation is not supported in this build of Vue.` +
8774 (` Use "vue.esm-browser.js" instead.`
8775 ) /* should not happen */);
8776 }
8777 else {
8778 warn$1(`Component is missing template or render function.`);
8779 }
8780 }
8781}
8782function createAttrsProxy(instance) {
8783 return new Proxy(instance.attrs, {
8784 get(target, key) {
8785 markAttrsAccessed();
8786 track(instance, "get" /* TrackOpTypes.GET */, '$attrs');
8787 return target[key];
8788 },
8789 set() {
8790 warn$1(`setupContext.attrs is readonly.`);
8791 return false;
8792 },
8793 deleteProperty() {
8794 warn$1(`setupContext.attrs is readonly.`);
8795 return false;
8796 }
8797 }
8798 );
8799}
8800function createSetupContext(instance) {
8801 const expose = exposed => {
8802 if (instance.exposed) {
8803 warn$1(`expose() should be called only once per setup().`);
8804 }
8805 instance.exposed = exposed || {};
8806 };
8807 let attrs;
8808 {
8809 // We use getters in dev in case libs like test-utils overwrite instance
8810 // properties (overwrites should not be done in prod)
8811 return Object.freeze({
8812 get attrs() {
8813 return attrs || (attrs = createAttrsProxy(instance));
8814 },
8815 get slots() {
8816 return shallowReadonly(instance.slots);
8817 },
8818 get emit() {
8819 return (event, ...args) => instance.emit(event, ...args);
8820 },
8821 expose
8822 });
8823 }
8824}
8825function getExposeProxy(instance) {
8826 if (instance.exposed) {
8827 return (instance.exposeProxy ||
8828 (instance.exposeProxy = new Proxy(proxyRefs(markRaw(instance.exposed)), {
8829 get(target, key) {
8830 if (key in target) {
8831 return target[key];
8832 }
8833 else if (key in publicPropertiesMap) {
8834 return publicPropertiesMap[key](instance);
8835 }
8836 },
8837 has(target, key) {
8838 return key in target || key in publicPropertiesMap;
8839 }
8840 })));
8841 }
8842}
8843const classifyRE = /(?:^|[-_])(\w)/g;
8844const classify = (str) => str.replace(classifyRE, c => c.toUpperCase()).replace(/[-_]/g, '');
8845function getComponentName(Component, includeInferred = true) {
8846 return isFunction(Component)
8847 ? Component.displayName || Component.name
8848 : Component.name || (includeInferred && Component.__name);
8849}
8850/* istanbul ignore next */
8851function formatComponentName(instance, Component, isRoot = false) {
8852 let name = getComponentName(Component);
8853 if (!name && Component.__file) {
8854 const match = Component.__file.match(/([^/\\]+)\.\w+$/);
8855 if (match) {
8856 name = match[1];
8857 }
8858 }
8859 if (!name && instance && instance.parent) {
8860 // try to infer the name based on reverse resolution
8861 const inferFromRegistry = (registry) => {
8862 for (const key in registry) {
8863 if (registry[key] === Component) {
8864 return key;
8865 }
8866 }
8867 };
8868 name =
8869 inferFromRegistry(instance.components ||
8870 instance.parent.type.components) || inferFromRegistry(instance.appContext.components);
8871 }
8872 return name ? classify(name) : isRoot ? `App` : `Anonymous`;
8873}
8874function isClassComponent(value) {
8875 return isFunction(value) && '__vccOpts' in value;
8876}
8877
8878const computed$1 = ((getterOrOptions, debugOptions) => {
8879 // @ts-ignore
8880 return computed(getterOrOptions, debugOptions, isInSSRComponentSetup);
8881});
8882
8883// dev only
8884const warnRuntimeUsage = (method) => warn$1(`${method}() is a compiler-hint helper that is only usable inside ` +
8885 `<script setup> of a single file component. Its arguments should be ` +
8886 `compiled away and passing it at runtime has no effect.`);
8887// implementation
8888function defineProps() {
8889 {
8890 warnRuntimeUsage(`defineProps`);
8891 }
8892 return null;
8893}
8894// implementation
8895function defineEmits() {
8896 {
8897 warnRuntimeUsage(`defineEmits`);
8898 }
8899 return null;
8900}
8901/**
8902 * Vue `<script setup>` compiler macro for declaring a component's exposed
8903 * instance properties when it is accessed by a parent component via template
8904 * refs.
8905 *
8906 * `<script setup>` components are closed by default - i.e. variables inside
8907 * the `<script setup>` scope is not exposed to parent unless explicitly exposed
8908 * via `defineExpose`.
8909 *
8910 * This is only usable inside `<script setup>`, is compiled away in the
8911 * output and should **not** be actually called at runtime.
8912 */
8913function defineExpose(exposed) {
8914 {
8915 warnRuntimeUsage(`defineExpose`);
8916 }
8917}
8918/**
8919 * Vue `<script setup>` compiler macro for providing props default values when
8920 * using type-based `defineProps` declaration.
8921 *
8922 * Example usage:
8923 * ```ts
8924 * withDefaults(defineProps<{
8925 * size?: number
8926 * labels?: string[]
8927 * }>(), {
8928 * size: 3,
8929 * labels: () => ['default label']
8930 * })
8931 * ```
8932 *
8933 * This is only usable inside `<script setup>`, is compiled away in the output
8934 * and should **not** be actually called at runtime.
8935 */
8936function withDefaults(props, defaults) {
8937 {
8938 warnRuntimeUsage(`withDefaults`);
8939 }
8940 return null;
8941}
8942function useSlots() {
8943 return getContext().slots;
8944}
8945function useAttrs() {
8946 return getContext().attrs;
8947}
8948function getContext() {
8949 const i = getCurrentInstance();
8950 if (!i) {
8951 warn$1(`useContext() called without active instance.`);
8952 }
8953 return i.setupContext || (i.setupContext = createSetupContext(i));
8954}
8955/**
8956 * Runtime helper for merging default declarations. Imported by compiled code
8957 * only.
8958 * @internal
8959 */
8960function mergeDefaults(raw, defaults) {
8961 const props = isArray(raw)
8962 ? raw.reduce((normalized, p) => ((normalized[p] = {}), normalized), {})
8963 : raw;
8964 for (const key in defaults) {
8965 const opt = props[key];
8966 if (opt) {
8967 if (isArray(opt) || isFunction(opt)) {
8968 props[key] = { type: opt, default: defaults[key] };
8969 }
8970 else {
8971 opt.default = defaults[key];
8972 }
8973 }
8974 else if (opt === null) {
8975 props[key] = { default: defaults[key] };
8976 }
8977 else {
8978 warn$1(`props default key "${key}" has no corresponding declaration.`);
8979 }
8980 }
8981 return props;
8982}
8983/**
8984 * Used to create a proxy for the rest element when destructuring props with
8985 * defineProps().
8986 * @internal
8987 */
8988function createPropsRestProxy(props, excludedKeys) {
8989 const ret = {};
8990 for (const key in props) {
8991 if (!excludedKeys.includes(key)) {
8992 Object.defineProperty(ret, key, {
8993 enumerable: true,
8994 get: () => props[key]
8995 });
8996 }
8997 }
8998 return ret;
8999}
9000/**
9001 * `<script setup>` helper for persisting the current instance context over
9002 * async/await flows.
9003 *
9004 * `@vue/compiler-sfc` converts the following:
9005 *
9006 * ```ts
9007 * const x = await foo()
9008 * ```
9009 *
9010 * into:
9011 *
9012 * ```ts
9013 * let __temp, __restore
9014 * const x = (([__temp, __restore] = withAsyncContext(() => foo())),__temp=await __temp,__restore(),__temp)
9015 * ```
9016 * @internal
9017 */
9018function withAsyncContext(getAwaitable) {
9019 const ctx = getCurrentInstance();
9020 if (!ctx) {
9021 warn$1(`withAsyncContext called without active current instance. ` +
9022 `This is likely a bug.`);
9023 }
9024 let awaitable = getAwaitable();
9025 unsetCurrentInstance();
9026 if (isPromise(awaitable)) {
9027 awaitable = awaitable.catch(e => {
9028 setCurrentInstance(ctx);
9029 throw e;
9030 });
9031 }
9032 return [awaitable, () => setCurrentInstance(ctx)];
9033}
9034
9035// Actual implementation
9036function h(type, propsOrChildren, children) {
9037 const l = arguments.length;
9038 if (l === 2) {
9039 if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
9040 // single vnode without props
9041 if (isVNode(propsOrChildren)) {
9042 return createVNode(type, null, [propsOrChildren]);
9043 }
9044 // props without children
9045 return createVNode(type, propsOrChildren);
9046 }
9047 else {
9048 // omit props
9049 return createVNode(type, null, propsOrChildren);
9050 }
9051 }
9052 else {
9053 if (l > 3) {
9054 children = Array.prototype.slice.call(arguments, 2);
9055 }
9056 else if (l === 3 && isVNode(children)) {
9057 children = [children];
9058 }
9059 return createVNode(type, propsOrChildren, children);
9060 }
9061}
9062
9063const ssrContextKey = Symbol(`ssrContext` );
9064const useSSRContext = () => {
9065 {
9066 const ctx = inject(ssrContextKey);
9067 if (!ctx) {
9068 warn$1(`Server rendering context not provided. Make sure to only call ` +
9069 `useSSRContext() conditionally in the server build.`);
9070 }
9071 return ctx;
9072 }
9073};
9074
9075function initCustomFormatter() {
9076 /* eslint-disable no-restricted-globals */
9077 if (typeof window === 'undefined') {
9078 return;
9079 }
9080 const vueStyle = { style: 'color:#3ba776' };
9081 const numberStyle = { style: 'color:#0b1bc9' };
9082 const stringStyle = { style: 'color:#b62e24' };
9083 const keywordStyle = { style: 'color:#9d288c' };
9084 // custom formatter for Chrome
9085 // https://www.mattzeunert.com/2016/02/19/custom-chrome-devtools-object-formatters.html
9086 const formatter = {
9087 header(obj) {
9088 // TODO also format ComponentPublicInstance & ctx.slots/attrs in setup
9089 if (!isObject(obj)) {
9090 return null;
9091 }
9092 if (obj.__isVue) {
9093 return ['div', vueStyle, `VueInstance`];
9094 }
9095 else if (isRef(obj)) {
9096 return [
9097 'div',
9098 {},
9099 ['span', vueStyle, genRefFlag(obj)],
9100 '<',
9101 formatValue(obj.value),
9102 `>`
9103 ];
9104 }
9105 else if (isReactive(obj)) {
9106 return [
9107 'div',
9108 {},
9109 ['span', vueStyle, isShallow(obj) ? 'ShallowReactive' : 'Reactive'],
9110 '<',
9111 formatValue(obj),
9112 `>${isReadonly(obj) ? ` (readonly)` : ``}`
9113 ];
9114 }
9115 else if (isReadonly(obj)) {
9116 return [
9117 'div',
9118 {},
9119 ['span', vueStyle, isShallow(obj) ? 'ShallowReadonly' : 'Readonly'],
9120 '<',
9121 formatValue(obj),
9122 '>'
9123 ];
9124 }
9125 return null;
9126 },
9127 hasBody(obj) {
9128 return obj && obj.__isVue;
9129 },
9130 body(obj) {
9131 if (obj && obj.__isVue) {
9132 return [
9133 'div',
9134 {},
9135 ...formatInstance(obj.$)
9136 ];
9137 }
9138 }
9139 };
9140 function formatInstance(instance) {
9141 const blocks = [];
9142 if (instance.type.props && instance.props) {
9143 blocks.push(createInstanceBlock('props', toRaw(instance.props)));
9144 }
9145 if (instance.setupState !== EMPTY_OBJ) {
9146 blocks.push(createInstanceBlock('setup', instance.setupState));
9147 }
9148 if (instance.data !== EMPTY_OBJ) {
9149 blocks.push(createInstanceBlock('data', toRaw(instance.data)));
9150 }
9151 const computed = extractKeys(instance, 'computed');
9152 if (computed) {
9153 blocks.push(createInstanceBlock('computed', computed));
9154 }
9155 const injected = extractKeys(instance, 'inject');
9156 if (injected) {
9157 blocks.push(createInstanceBlock('injected', injected));
9158 }
9159 blocks.push([
9160 'div',
9161 {},
9162 [
9163 'span',
9164 {
9165 style: keywordStyle.style + ';opacity:0.66'
9166 },
9167 '$ (internal): '
9168 ],
9169 ['object', { object: instance }]
9170 ]);
9171 return blocks;
9172 }
9173 function createInstanceBlock(type, target) {
9174 target = extend({}, target);
9175 if (!Object.keys(target).length) {
9176 return ['span', {}];
9177 }
9178 return [
9179 'div',
9180 { style: 'line-height:1.25em;margin-bottom:0.6em' },
9181 [
9182 'div',
9183 {
9184 style: 'color:#476582'
9185 },
9186 type
9187 ],
9188 [
9189 'div',
9190 {
9191 style: 'padding-left:1.25em'
9192 },
9193 ...Object.keys(target).map(key => {
9194 return [
9195 'div',
9196 {},
9197 ['span', keywordStyle, key + ': '],
9198 formatValue(target[key], false)
9199 ];
9200 })
9201 ]
9202 ];
9203 }
9204 function formatValue(v, asRaw = true) {
9205 if (typeof v === 'number') {
9206 return ['span', numberStyle, v];
9207 }
9208 else if (typeof v === 'string') {
9209 return ['span', stringStyle, JSON.stringify(v)];
9210 }
9211 else if (typeof v === 'boolean') {
9212 return ['span', keywordStyle, v];
9213 }
9214 else if (isObject(v)) {
9215 return ['object', { object: asRaw ? toRaw(v) : v }];
9216 }
9217 else {
9218 return ['span', stringStyle, String(v)];
9219 }
9220 }
9221 function extractKeys(instance, type) {
9222 const Comp = instance.type;
9223 if (isFunction(Comp)) {
9224 return;
9225 }
9226 const extracted = {};
9227 for (const key in instance.ctx) {
9228 if (isKeyOfType(Comp, key, type)) {
9229 extracted[key] = instance.ctx[key];
9230 }
9231 }
9232 return extracted;
9233 }
9234 function isKeyOfType(Comp, key, type) {
9235 const opts = Comp[type];
9236 if ((isArray(opts) && opts.includes(key)) ||
9237 (isObject(opts) && key in opts)) {
9238 return true;
9239 }
9240 if (Comp.extends && isKeyOfType(Comp.extends, key, type)) {
9241 return true;
9242 }
9243 if (Comp.mixins && Comp.mixins.some(m => isKeyOfType(m, key, type))) {
9244 return true;
9245 }
9246 }
9247 function genRefFlag(v) {
9248 if (isShallow(v)) {
9249 return `ShallowRef`;
9250 }
9251 if (v.effect) {
9252 return `ComputedRef`;
9253 }
9254 return `Ref`;
9255 }
9256 if (window.devtoolsFormatters) {
9257 window.devtoolsFormatters.push(formatter);
9258 }
9259 else {
9260 window.devtoolsFormatters = [formatter];
9261 }
9262}
9263
9264function withMemo(memo, render, cache, index) {
9265 const cached = cache[index];
9266 if (cached && isMemoSame(cached, memo)) {
9267 return cached;
9268 }
9269 const ret = render();
9270 // shallow clone
9271 ret.memo = memo.slice();
9272 return (cache[index] = ret);
9273}
9274function isMemoSame(cached, memo) {
9275 const prev = cached.memo;
9276 if (prev.length != memo.length) {
9277 return false;
9278 }
9279 for (let i = 0; i < prev.length; i++) {
9280 if (hasChanged(prev[i], memo[i])) {
9281 return false;
9282 }
9283 }
9284 // make sure to let parent block track it when returning cached
9285 if (isBlockTreeEnabled > 0 && currentBlock) {
9286 currentBlock.push(cached);
9287 }
9288 return true;
9289}
9290
9291// Core API ------------------------------------------------------------------
9292const version = "3.2.45";
9293/**
9294 * SSR utils for \@vue/server-renderer. Only exposed in ssr-possible builds.
9295 * @internal
9296 */
9297const ssrUtils = (null);
9298/**
9299 * @internal only exposed in compat builds
9300 */
9301const resolveFilter = null;
9302/**
9303 * @internal only exposed in compat builds.
9304 */
9305const compatUtils = (null);
9306
9307const svgNS = 'http://www.w3.org/2000/svg';
9308const doc = (typeof document !== 'undefined' ? document : null);
9309const templateContainer = doc && /*#__PURE__*/ doc.createElement('template');
9310const nodeOps = {
9311 insert: (child, parent, anchor) => {
9312 parent.insertBefore(child, anchor || null);
9313 },
9314 remove: child => {
9315 const parent = child.parentNode;
9316 if (parent) {
9317 parent.removeChild(child);
9318 }
9319 },
9320 createElement: (tag, isSVG, is, props) => {
9321 const el = isSVG
9322 ? doc.createElementNS(svgNS, tag)
9323 : doc.createElement(tag, is ? { is } : undefined);
9324 if (tag === 'select' && props && props.multiple != null) {
9325 el.setAttribute('multiple', props.multiple);
9326 }
9327 return el;
9328 },
9329 createText: text => doc.createTextNode(text),
9330 createComment: text => doc.createComment(text),
9331 setText: (node, text) => {
9332 node.nodeValue = text;
9333 },
9334 setElementText: (el, text) => {
9335 el.textContent = text;
9336 },
9337 parentNode: node => node.parentNode,
9338 nextSibling: node => node.nextSibling,
9339 querySelector: selector => doc.querySelector(selector),
9340 setScopeId(el, id) {
9341 el.setAttribute(id, '');
9342 },
9343 // __UNSAFE__
9344 // Reason: innerHTML.
9345 // Static content here can only come from compiled templates.
9346 // As long as the user only uses trusted templates, this is safe.
9347 insertStaticContent(content, parent, anchor, isSVG, start, end) {
9348 // <parent> before | first ... last | anchor </parent>
9349 const before = anchor ? anchor.previousSibling : parent.lastChild;
9350 // #5308 can only take cached path if:
9351 // - has a single root node
9352 // - nextSibling info is still available
9353 if (start && (start === end || start.nextSibling)) {
9354 // cached
9355 while (true) {
9356 parent.insertBefore(start.cloneNode(true), anchor);
9357 if (start === end || !(start = start.nextSibling))
9358 break;
9359 }
9360 }
9361 else {
9362 // fresh insert
9363 templateContainer.innerHTML = isSVG ? `<svg>${content}</svg>` : content;
9364 const template = templateContainer.content;
9365 if (isSVG) {
9366 // remove outer svg wrapper
9367 const wrapper = template.firstChild;
9368 while (wrapper.firstChild) {
9369 template.appendChild(wrapper.firstChild);
9370 }
9371 template.removeChild(wrapper);
9372 }
9373 parent.insertBefore(template, anchor);
9374 }
9375 return [
9376 // first
9377 before ? before.nextSibling : parent.firstChild,
9378 // last
9379 anchor ? anchor.previousSibling : parent.lastChild
9380 ];
9381 }
9382};
9383
9384// compiler should normalize class + :class bindings on the same element
9385// into a single binding ['staticClass', dynamic]
9386function patchClass(el, value, isSVG) {
9387 // directly setting className should be faster than setAttribute in theory
9388 // if this is an element during a transition, take the temporary transition
9389 // classes into account.
9390 const transitionClasses = el._vtc;
9391 if (transitionClasses) {
9392 value = (value ? [value, ...transitionClasses] : [...transitionClasses]).join(' ');
9393 }
9394 if (value == null) {
9395 el.removeAttribute('class');
9396 }
9397 else if (isSVG) {
9398 el.setAttribute('class', value);
9399 }
9400 else {
9401 el.className = value;
9402 }
9403}
9404
9405function patchStyle(el, prev, next) {
9406 const style = el.style;
9407 const isCssString = isString(next);
9408 if (next && !isCssString) {
9409 for (const key in next) {
9410 setStyle(style, key, next[key]);
9411 }
9412 if (prev && !isString(prev)) {
9413 for (const key in prev) {
9414 if (next[key] == null) {
9415 setStyle(style, key, '');
9416 }
9417 }
9418 }
9419 }
9420 else {
9421 const currentDisplay = style.display;
9422 if (isCssString) {
9423 if (prev !== next) {
9424 style.cssText = next;
9425 }
9426 }
9427 else if (prev) {
9428 el.removeAttribute('style');
9429 }
9430 // indicates that the `display` of the element is controlled by `v-show`,
9431 // so we always keep the current `display` value regardless of the `style`
9432 // value, thus handing over control to `v-show`.
9433 if ('_vod' in el) {
9434 style.display = currentDisplay;
9435 }
9436 }
9437}
9438const semicolonRE = /[^\\];\s*$/;
9439const importantRE = /\s*!important$/;
9440function setStyle(style, name, val) {
9441 if (isArray(val)) {
9442 val.forEach(v => setStyle(style, name, v));
9443 }
9444 else {
9445 if (val == null)
9446 val = '';
9447 {
9448 if (semicolonRE.test(val)) {
9449 warn$1(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
9450 }
9451 }
9452 if (name.startsWith('--')) {
9453 // custom property definition
9454 style.setProperty(name, val);
9455 }
9456 else {
9457 const prefixed = autoPrefix(style, name);
9458 if (importantRE.test(val)) {
9459 // !important
9460 style.setProperty(hyphenate(prefixed), val.replace(importantRE, ''), 'important');
9461 }
9462 else {
9463 style[prefixed] = val;
9464 }
9465 }
9466 }
9467}
9468const prefixes = ['Webkit', 'Moz', 'ms'];
9469const prefixCache = {};
9470function autoPrefix(style, rawName) {
9471 const cached = prefixCache[rawName];
9472 if (cached) {
9473 return cached;
9474 }
9475 let name = camelize(rawName);
9476 if (name !== 'filter' && name in style) {
9477 return (prefixCache[rawName] = name);
9478 }
9479 name = capitalize(name);
9480 for (let i = 0; i < prefixes.length; i++) {
9481 const prefixed = prefixes[i] + name;
9482 if (prefixed in style) {
9483 return (prefixCache[rawName] = prefixed);
9484 }
9485 }
9486 return rawName;
9487}
9488
9489const xlinkNS = 'http://www.w3.org/1999/xlink';
9490function patchAttr(el, key, value, isSVG, instance) {
9491 if (isSVG && key.startsWith('xlink:')) {
9492 if (value == null) {
9493 el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
9494 }
9495 else {
9496 el.setAttributeNS(xlinkNS, key, value);
9497 }
9498 }
9499 else {
9500 // note we are only checking boolean attributes that don't have a
9501 // corresponding dom prop of the same name here.
9502 const isBoolean = isSpecialBooleanAttr(key);
9503 if (value == null || (isBoolean && !includeBooleanAttr(value))) {
9504 el.removeAttribute(key);
9505 }
9506 else {
9507 el.setAttribute(key, isBoolean ? '' : value);
9508 }
9509 }
9510}
9511
9512// __UNSAFE__
9513// functions. The user is responsible for using them with only trusted content.
9514function patchDOMProp(el, key, value,
9515// the following args are passed only due to potential innerHTML/textContent
9516// overriding existing VNodes, in which case the old tree must be properly
9517// unmounted.
9518prevChildren, parentComponent, parentSuspense, unmountChildren) {
9519 if (key === 'innerHTML' || key === 'textContent') {
9520 if (prevChildren) {
9521 unmountChildren(prevChildren, parentComponent, parentSuspense);
9522 }
9523 el[key] = value == null ? '' : value;
9524 return;
9525 }
9526 if (key === 'value' &&
9527 el.tagName !== 'PROGRESS' &&
9528 // custom elements may use _value internally
9529 !el.tagName.includes('-')) {
9530 // store value as _value as well since
9531 // non-string values will be stringified.
9532 el._value = value;
9533 const newValue = value == null ? '' : value;
9534 if (el.value !== newValue ||
9535 // #4956: always set for OPTION elements because its value falls back to
9536 // textContent if no value attribute is present. And setting .value for
9537 // OPTION has no side effect
9538 el.tagName === 'OPTION') {
9539 el.value = newValue;
9540 }
9541 if (value == null) {
9542 el.removeAttribute(key);
9543 }
9544 return;
9545 }
9546 let needRemove = false;
9547 if (value === '' || value == null) {
9548 const type = typeof el[key];
9549 if (type === 'boolean') {
9550 // e.g. <select multiple> compiles to { multiple: '' }
9551 value = includeBooleanAttr(value);
9552 }
9553 else if (value == null && type === 'string') {
9554 // e.g. <div :id="null">
9555 value = '';
9556 needRemove = true;
9557 }
9558 else if (type === 'number') {
9559 // e.g. <img :width="null">
9560 value = 0;
9561 needRemove = true;
9562 }
9563 }
9564 // some properties perform value validation and throw,
9565 // some properties has getter, no setter, will error in 'use strict'
9566 // eg. <select :type="null"></select> <select :willValidate="null"></select>
9567 try {
9568 el[key] = value;
9569 }
9570 catch (e) {
9571 // do not warn if value is auto-coerced from nullish values
9572 if (!needRemove) {
9573 warn$1(`Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: ` +
9574 `value ${value} is invalid.`, e);
9575 }
9576 }
9577 needRemove && el.removeAttribute(key);
9578}
9579
9580function addEventListener(el, event, handler, options) {
9581 el.addEventListener(event, handler, options);
9582}
9583function removeEventListener(el, event, handler, options) {
9584 el.removeEventListener(event, handler, options);
9585}
9586function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
9587 // vei = vue event invokers
9588 const invokers = el._vei || (el._vei = {});
9589 const existingInvoker = invokers[rawName];
9590 if (nextValue && existingInvoker) {
9591 // patch
9592 existingInvoker.value = nextValue;
9593 }
9594 else {
9595 const [name, options] = parseName(rawName);
9596 if (nextValue) {
9597 // add
9598 const invoker = (invokers[rawName] = createInvoker(nextValue, instance));
9599 addEventListener(el, name, invoker, options);
9600 }
9601 else if (existingInvoker) {
9602 // remove
9603 removeEventListener(el, name, existingInvoker, options);
9604 invokers[rawName] = undefined;
9605 }
9606 }
9607}
9608const optionsModifierRE = /(?:Once|Passive|Capture)$/;
9609function parseName(name) {
9610 let options;
9611 if (optionsModifierRE.test(name)) {
9612 options = {};
9613 let m;
9614 while ((m = name.match(optionsModifierRE))) {
9615 name = name.slice(0, name.length - m[0].length);
9616 options[m[0].toLowerCase()] = true;
9617 }
9618 }
9619 const event = name[2] === ':' ? name.slice(3) : hyphenate(name.slice(2));
9620 return [event, options];
9621}
9622// To avoid the overhead of repeatedly calling Date.now(), we cache
9623// and use the same timestamp for all event listeners attached in the same tick.
9624let cachedNow = 0;
9625const p = /*#__PURE__*/ Promise.resolve();
9626const getNow = () => cachedNow || (p.then(() => (cachedNow = 0)), (cachedNow = Date.now()));
9627function createInvoker(initialValue, instance) {
9628 const invoker = (e) => {
9629 // async edge case vuejs/vue#6566
9630 // inner click event triggers patch, event handler
9631 // attached to outer element during patch, and triggered again. This
9632 // happens because browsers fire microtask ticks between event propagation.
9633 // this no longer happens for templates in Vue 3, but could still be
9634 // theoretically possible for hand-written render functions.
9635 // the solution: we save the timestamp when a handler is attached,
9636 // and also attach the timestamp to any event that was handled by vue
9637 // for the first time (to avoid inconsistent event timestamp implementations
9638 // or events fired from iframes, e.g. #2513)
9639 // The handler would only fire if the event passed to it was fired
9640 // AFTER it was attached.
9641 if (!e._vts) {
9642 e._vts = Date.now();
9643 }
9644 else if (e._vts <= invoker.attached) {
9645 return;
9646 }
9647 callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* ErrorCodes.NATIVE_EVENT_HANDLER */, [e]);
9648 };
9649 invoker.value = initialValue;
9650 invoker.attached = getNow();
9651 return invoker;
9652}
9653function patchStopImmediatePropagation(e, value) {
9654 if (isArray(value)) {
9655 const originalStop = e.stopImmediatePropagation;
9656 e.stopImmediatePropagation = () => {
9657 originalStop.call(e);
9658 e._stopped = true;
9659 };
9660 return value.map(fn => (e) => !e._stopped && fn && fn(e));
9661 }
9662 else {
9663 return value;
9664 }
9665}
9666
9667const nativeOnRE = /^on[a-z]/;
9668const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
9669 if (key === 'class') {
9670 patchClass(el, nextValue, isSVG);
9671 }
9672 else if (key === 'style') {
9673 patchStyle(el, prevValue, nextValue);
9674 }
9675 else if (isOn(key)) {
9676 // ignore v-model listeners
9677 if (!isModelListener(key)) {
9678 patchEvent(el, key, prevValue, nextValue, parentComponent);
9679 }
9680 }
9681 else if (key[0] === '.'
9682 ? ((key = key.slice(1)), true)
9683 : key[0] === '^'
9684 ? ((key = key.slice(1)), false)
9685 : shouldSetAsProp(el, key, nextValue, isSVG)) {
9686 patchDOMProp(el, key, nextValue, prevChildren, parentComponent, parentSuspense, unmountChildren);
9687 }
9688 else {
9689 // special case for <input v-model type="checkbox"> with
9690 // :true-value & :false-value
9691 // store value as dom properties since non-string values will be
9692 // stringified.
9693 if (key === 'true-value') {
9694 el._trueValue = nextValue;
9695 }
9696 else if (key === 'false-value') {
9697 el._falseValue = nextValue;
9698 }
9699 patchAttr(el, key, nextValue, isSVG);
9700 }
9701};
9702function shouldSetAsProp(el, key, value, isSVG) {
9703 if (isSVG) {
9704 // most keys must be set as attribute on svg elements to work
9705 // ...except innerHTML & textContent
9706 if (key === 'innerHTML' || key === 'textContent') {
9707 return true;
9708 }
9709 // or native onclick with function values
9710 if (key in el && nativeOnRE.test(key) && isFunction(value)) {
9711 return true;
9712 }
9713 return false;
9714 }
9715 // these are enumerated attrs, however their corresponding DOM properties
9716 // are actually booleans - this leads to setting it with a string "false"
9717 // value leading it to be coerced to `true`, so we need to always treat
9718 // them as attributes.
9719 // Note that `contentEditable` doesn't have this problem: its DOM
9720 // property is also enumerated string values.
9721 if (key === 'spellcheck' || key === 'draggable' || key === 'translate') {
9722 return false;
9723 }
9724 // #1787, #2840 form property on form elements is readonly and must be set as
9725 // attribute.
9726 if (key === 'form') {
9727 return false;
9728 }
9729 // #1526 <input list> must be set as attribute
9730 if (key === 'list' && el.tagName === 'INPUT') {
9731 return false;
9732 }
9733 // #2766 <textarea type> must be set as attribute
9734 if (key === 'type' && el.tagName === 'TEXTAREA') {
9735 return false;
9736 }
9737 // native onclick with string value, must be set as attribute
9738 if (nativeOnRE.test(key) && isString(value)) {
9739 return false;
9740 }
9741 return key in el;
9742}
9743
9744function defineCustomElement(options, hydrate) {
9745 const Comp = defineComponent(options);
9746 class VueCustomElement extends VueElement {
9747 constructor(initialProps) {
9748 super(Comp, initialProps, hydrate);
9749 }
9750 }
9751 VueCustomElement.def = Comp;
9752 return VueCustomElement;
9753}
9754const defineSSRCustomElement = ((options) => {
9755 // @ts-ignore
9756 return defineCustomElement(options, hydrate);
9757});
9758const BaseClass = (typeof HTMLElement !== 'undefined' ? HTMLElement : class {
9759});
9760class VueElement extends BaseClass {
9761 constructor(_def, _props = {}, hydrate) {
9762 super();
9763 this._def = _def;
9764 this._props = _props;
9765 /**
9766 * @internal
9767 */
9768 this._instance = null;
9769 this._connected = false;
9770 this._resolved = false;
9771 this._numberProps = null;
9772 if (this.shadowRoot && hydrate) {
9773 hydrate(this._createVNode(), this.shadowRoot);
9774 }
9775 else {
9776 if (this.shadowRoot) {
9777 warn$1(`Custom element has pre-rendered declarative shadow root but is not ` +
9778 `defined as hydratable. Use \`defineSSRCustomElement\`.`);
9779 }
9780 this.attachShadow({ mode: 'open' });
9781 if (!this._def.__asyncLoader) {
9782 // for sync component defs we can immediately resolve props
9783 this._resolveProps(this._def);
9784 }
9785 }
9786 }
9787 connectedCallback() {
9788 this._connected = true;
9789 if (!this._instance) {
9790 if (this._resolved) {
9791 this._update();
9792 }
9793 else {
9794 this._resolveDef();
9795 }
9796 }
9797 }
9798 disconnectedCallback() {
9799 this._connected = false;
9800 nextTick(() => {
9801 if (!this._connected) {
9802 render(null, this.shadowRoot);
9803 this._instance = null;
9804 }
9805 });
9806 }
9807 /**
9808 * resolve inner component definition (handle possible async component)
9809 */
9810 _resolveDef() {
9811 this._resolved = true;
9812 // set initial attrs
9813 for (let i = 0; i < this.attributes.length; i++) {
9814 this._setAttr(this.attributes[i].name);
9815 }
9816 // watch future attr changes
9817 new MutationObserver(mutations => {
9818 for (const m of mutations) {
9819 this._setAttr(m.attributeName);
9820 }
9821 }).observe(this, { attributes: true });
9822 const resolve = (def, isAsync = false) => {
9823 const { props, styles } = def;
9824 // cast Number-type props set before resolve
9825 let numberProps;
9826 if (props && !isArray(props)) {
9827 for (const key in props) {
9828 const opt = props[key];
9829 if (opt === Number || (opt && opt.type === Number)) {
9830 if (key in this._props) {
9831 this._props[key] = toNumber(this._props[key]);
9832 }
9833 (numberProps || (numberProps = Object.create(null)))[camelize(key)] = true;
9834 }
9835 }
9836 }
9837 this._numberProps = numberProps;
9838 if (isAsync) {
9839 // defining getter/setters on prototype
9840 // for sync defs, this already happened in the constructor
9841 this._resolveProps(def);
9842 }
9843 // apply CSS
9844 this._applyStyles(styles);
9845 // initial render
9846 this._update();
9847 };
9848 const asyncDef = this._def.__asyncLoader;
9849 if (asyncDef) {
9850 asyncDef().then(def => resolve(def, true));
9851 }
9852 else {
9853 resolve(this._def);
9854 }
9855 }
9856 _resolveProps(def) {
9857 const { props } = def;
9858 const declaredPropKeys = isArray(props) ? props : Object.keys(props || {});
9859 // check if there are props set pre-upgrade or connect
9860 for (const key of Object.keys(this)) {
9861 if (key[0] !== '_' && declaredPropKeys.includes(key)) {
9862 this._setProp(key, this[key], true, false);
9863 }
9864 }
9865 // defining getter/setters on prototype
9866 for (const key of declaredPropKeys.map(camelize)) {
9867 Object.defineProperty(this, key, {
9868 get() {
9869 return this._getProp(key);
9870 },
9871 set(val) {
9872 this._setProp(key, val);
9873 }
9874 });
9875 }
9876 }
9877 _setAttr(key) {
9878 let value = this.getAttribute(key);
9879 const camelKey = camelize(key);
9880 if (this._numberProps && this._numberProps[camelKey]) {
9881 value = toNumber(value);
9882 }
9883 this._setProp(camelKey, value, false);
9884 }
9885 /**
9886 * @internal
9887 */
9888 _getProp(key) {
9889 return this._props[key];
9890 }
9891 /**
9892 * @internal
9893 */
9894 _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
9895 if (val !== this._props[key]) {
9896 this._props[key] = val;
9897 if (shouldUpdate && this._instance) {
9898 this._update();
9899 }
9900 // reflect
9901 if (shouldReflect) {
9902 if (val === true) {
9903 this.setAttribute(hyphenate(key), '');
9904 }
9905 else if (typeof val === 'string' || typeof val === 'number') {
9906 this.setAttribute(hyphenate(key), val + '');
9907 }
9908 else if (!val) {
9909 this.removeAttribute(hyphenate(key));
9910 }
9911 }
9912 }
9913 }
9914 _update() {
9915 render(this._createVNode(), this.shadowRoot);
9916 }
9917 _createVNode() {
9918 const vnode = createVNode(this._def, extend({}, this._props));
9919 if (!this._instance) {
9920 vnode.ce = instance => {
9921 this._instance = instance;
9922 instance.isCE = true;
9923 // HMR
9924 {
9925 instance.ceReload = newStyles => {
9926 // always reset styles
9927 if (this._styles) {
9928 this._styles.forEach(s => this.shadowRoot.removeChild(s));
9929 this._styles.length = 0;
9930 }
9931 this._applyStyles(newStyles);
9932 this._instance = null;
9933 this._update();
9934 };
9935 }
9936 const dispatch = (event, args) => {
9937 this.dispatchEvent(new CustomEvent(event, {
9938 detail: args
9939 }));
9940 };
9941 // intercept emit
9942 instance.emit = (event, ...args) => {
9943 // dispatch both the raw and hyphenated versions of an event
9944 // to match Vue behavior
9945 dispatch(event, args);
9946 if (hyphenate(event) !== event) {
9947 dispatch(hyphenate(event), args);
9948 }
9949 };
9950 // locate nearest Vue custom element parent for provide/inject
9951 let parent = this;
9952 while ((parent =
9953 parent && (parent.parentNode || parent.host))) {
9954 if (parent instanceof VueElement) {
9955 instance.parent = parent._instance;
9956 instance.provides = parent._instance.provides;
9957 break;
9958 }
9959 }
9960 };
9961 }
9962 return vnode;
9963 }
9964 _applyStyles(styles) {
9965 if (styles) {
9966 styles.forEach(css => {
9967 const s = document.createElement('style');
9968 s.textContent = css;
9969 this.shadowRoot.appendChild(s);
9970 // record for HMR
9971 {
9972 (this._styles || (this._styles = [])).push(s);
9973 }
9974 });
9975 }
9976 }
9977}
9978
9979function useCssModule(name = '$style') {
9980 /* istanbul ignore else */
9981 {
9982 const instance = getCurrentInstance();
9983 if (!instance) {
9984 warn$1(`useCssModule must be called inside setup()`);
9985 return EMPTY_OBJ;
9986 }
9987 const modules = instance.type.__cssModules;
9988 if (!modules) {
9989 warn$1(`Current instance does not have CSS modules injected.`);
9990 return EMPTY_OBJ;
9991 }
9992 const mod = modules[name];
9993 if (!mod) {
9994 warn$1(`Current instance does not have CSS module named "${name}".`);
9995 return EMPTY_OBJ;
9996 }
9997 return mod;
9998 }
9999}
10000
10001/**
10002 * Runtime helper for SFC's CSS variable injection feature.
10003 * @private
10004 */
10005function useCssVars(getter) {
10006 const instance = getCurrentInstance();
10007 /* istanbul ignore next */
10008 if (!instance) {
10009 warn$1(`useCssVars is called without current active component instance.`);
10010 return;
10011 }
10012 const updateTeleports = (instance.ut = (vars = getter(instance.proxy)) => {
10013 Array.from(document.querySelectorAll(`[data-v-owner="${instance.uid}"]`)).forEach(node => setVarsOnNode(node, vars));
10014 });
10015 const setVars = () => {
10016 const vars = getter(instance.proxy);
10017 setVarsOnVNode(instance.subTree, vars);
10018 updateTeleports(vars);
10019 };
10020 watchPostEffect(setVars);
10021 onMounted(() => {
10022 const ob = new MutationObserver(setVars);
10023 ob.observe(instance.subTree.el.parentNode, { childList: true });
10024 onUnmounted(() => ob.disconnect());
10025 });
10026}
10027function setVarsOnVNode(vnode, vars) {
10028 if (vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */) {
10029 const suspense = vnode.suspense;
10030 vnode = suspense.activeBranch;
10031 if (suspense.pendingBranch && !suspense.isHydrating) {
10032 suspense.effects.push(() => {
10033 setVarsOnVNode(suspense.activeBranch, vars);
10034 });
10035 }
10036 }
10037 // drill down HOCs until it's a non-component vnode
10038 while (vnode.component) {
10039 vnode = vnode.component.subTree;
10040 }
10041 if (vnode.shapeFlag & 1 /* ShapeFlags.ELEMENT */ && vnode.el) {
10042 setVarsOnNode(vnode.el, vars);
10043 }
10044 else if (vnode.type === Fragment) {
10045 vnode.children.forEach(c => setVarsOnVNode(c, vars));
10046 }
10047 else if (vnode.type === Static) {
10048 let { el, anchor } = vnode;
10049 while (el) {
10050 setVarsOnNode(el, vars);
10051 if (el === anchor)
10052 break;
10053 el = el.nextSibling;
10054 }
10055 }
10056}
10057function setVarsOnNode(el, vars) {
10058 if (el.nodeType === 1) {
10059 const style = el.style;
10060 for (const key in vars) {
10061 style.setProperty(`--${key}`, vars[key]);
10062 }
10063 }
10064}
10065
10066const TRANSITION = 'transition';
10067const ANIMATION = 'animation';
10068// DOM Transition is a higher-order-component based on the platform-agnostic
10069// base Transition component, with DOM-specific logic.
10070const Transition = (props, { slots }) => h(BaseTransition, resolveTransitionProps(props), slots);
10071Transition.displayName = 'Transition';
10072const DOMTransitionPropsValidators = {
10073 name: String,
10074 type: String,
10075 css: {
10076 type: Boolean,
10077 default: true
10078 },
10079 duration: [String, Number, Object],
10080 enterFromClass: String,
10081 enterActiveClass: String,
10082 enterToClass: String,
10083 appearFromClass: String,
10084 appearActiveClass: String,
10085 appearToClass: String,
10086 leaveFromClass: String,
10087 leaveActiveClass: String,
10088 leaveToClass: String
10089};
10090const TransitionPropsValidators = (Transition.props =
10091 /*#__PURE__*/ extend({}, BaseTransition.props, DOMTransitionPropsValidators));
10092/**
10093 * #3227 Incoming hooks may be merged into arrays when wrapping Transition
10094 * with custom HOCs.
10095 */
10096const callHook$1 = (hook, args = []) => {
10097 if (isArray(hook)) {
10098 hook.forEach(h => h(...args));
10099 }
10100 else if (hook) {
10101 hook(...args);
10102 }
10103};
10104/**
10105 * Check if a hook expects a callback (2nd arg), which means the user
10106 * intends to explicitly control the end of the transition.
10107 */
10108const hasExplicitCallback = (hook) => {
10109 return hook
10110 ? isArray(hook)
10111 ? hook.some(h => h.length > 1)
10112 : hook.length > 1
10113 : false;
10114};
10115function resolveTransitionProps(rawProps) {
10116 const baseProps = {};
10117 for (const key in rawProps) {
10118 if (!(key in DOMTransitionPropsValidators)) {
10119 baseProps[key] = rawProps[key];
10120 }
10121 }
10122 if (rawProps.css === false) {
10123 return baseProps;
10124 }
10125 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;
10126 const durations = normalizeDuration(duration);
10127 const enterDuration = durations && durations[0];
10128 const leaveDuration = durations && durations[1];
10129 const { onBeforeEnter, onEnter, onEnterCancelled, onLeave, onLeaveCancelled, onBeforeAppear = onBeforeEnter, onAppear = onEnter, onAppearCancelled = onEnterCancelled } = baseProps;
10130 const finishEnter = (el, isAppear, done) => {
10131 removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
10132 removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
10133 done && done();
10134 };
10135 const finishLeave = (el, done) => {
10136 el._isLeaving = false;
10137 removeTransitionClass(el, leaveFromClass);
10138 removeTransitionClass(el, leaveToClass);
10139 removeTransitionClass(el, leaveActiveClass);
10140 done && done();
10141 };
10142 const makeEnterHook = (isAppear) => {
10143 return (el, done) => {
10144 const hook = isAppear ? onAppear : onEnter;
10145 const resolve = () => finishEnter(el, isAppear, done);
10146 callHook$1(hook, [el, resolve]);
10147 nextFrame(() => {
10148 removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
10149 addTransitionClass(el, isAppear ? appearToClass : enterToClass);
10150 if (!hasExplicitCallback(hook)) {
10151 whenTransitionEnds(el, type, enterDuration, resolve);
10152 }
10153 });
10154 };
10155 };
10156 return extend(baseProps, {
10157 onBeforeEnter(el) {
10158 callHook$1(onBeforeEnter, [el]);
10159 addTransitionClass(el, enterFromClass);
10160 addTransitionClass(el, enterActiveClass);
10161 },
10162 onBeforeAppear(el) {
10163 callHook$1(onBeforeAppear, [el]);
10164 addTransitionClass(el, appearFromClass);
10165 addTransitionClass(el, appearActiveClass);
10166 },
10167 onEnter: makeEnterHook(false),
10168 onAppear: makeEnterHook(true),
10169 onLeave(el, done) {
10170 el._isLeaving = true;
10171 const resolve = () => finishLeave(el, done);
10172 addTransitionClass(el, leaveFromClass);
10173 // force reflow so *-leave-from classes immediately take effect (#2593)
10174 forceReflow();
10175 addTransitionClass(el, leaveActiveClass);
10176 nextFrame(() => {
10177 if (!el._isLeaving) {
10178 // cancelled
10179 return;
10180 }
10181 removeTransitionClass(el, leaveFromClass);
10182 addTransitionClass(el, leaveToClass);
10183 if (!hasExplicitCallback(onLeave)) {
10184 whenTransitionEnds(el, type, leaveDuration, resolve);
10185 }
10186 });
10187 callHook$1(onLeave, [el, resolve]);
10188 },
10189 onEnterCancelled(el) {
10190 finishEnter(el, false);
10191 callHook$1(onEnterCancelled, [el]);
10192 },
10193 onAppearCancelled(el) {
10194 finishEnter(el, true);
10195 callHook$1(onAppearCancelled, [el]);
10196 },
10197 onLeaveCancelled(el) {
10198 finishLeave(el);
10199 callHook$1(onLeaveCancelled, [el]);
10200 }
10201 });
10202}
10203function normalizeDuration(duration) {
10204 if (duration == null) {
10205 return null;
10206 }
10207 else if (isObject(duration)) {
10208 return [NumberOf(duration.enter), NumberOf(duration.leave)];
10209 }
10210 else {
10211 const n = NumberOf(duration);
10212 return [n, n];
10213 }
10214}
10215function NumberOf(val) {
10216 const res = toNumber(val);
10217 validateDuration(res);
10218 return res;
10219}
10220function validateDuration(val) {
10221 if (typeof val !== 'number') {
10222 warn$1(`<transition> explicit duration is not a valid number - ` +
10223 `got ${JSON.stringify(val)}.`);
10224 }
10225 else if (isNaN(val)) {
10226 warn$1(`<transition> explicit duration is NaN - ` +
10227 'the duration expression might be incorrect.');
10228 }
10229}
10230function addTransitionClass(el, cls) {
10231 cls.split(/\s+/).forEach(c => c && el.classList.add(c));
10232 (el._vtc ||
10233 (el._vtc = new Set())).add(cls);
10234}
10235function removeTransitionClass(el, cls) {
10236 cls.split(/\s+/).forEach(c => c && el.classList.remove(c));
10237 const { _vtc } = el;
10238 if (_vtc) {
10239 _vtc.delete(cls);
10240 if (!_vtc.size) {
10241 el._vtc = undefined;
10242 }
10243 }
10244}
10245function nextFrame(cb) {
10246 requestAnimationFrame(() => {
10247 requestAnimationFrame(cb);
10248 });
10249}
10250let endId = 0;
10251function whenTransitionEnds(el, expectedType, explicitTimeout, resolve) {
10252 const id = (el._endId = ++endId);
10253 const resolveIfNotStale = () => {
10254 if (id === el._endId) {
10255 resolve();
10256 }
10257 };
10258 if (explicitTimeout) {
10259 return setTimeout(resolveIfNotStale, explicitTimeout);
10260 }
10261 const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
10262 if (!type) {
10263 return resolve();
10264 }
10265 const endEvent = type + 'end';
10266 let ended = 0;
10267 const end = () => {
10268 el.removeEventListener(endEvent, onEnd);
10269 resolveIfNotStale();
10270 };
10271 const onEnd = (e) => {
10272 if (e.target === el && ++ended >= propCount) {
10273 end();
10274 }
10275 };
10276 setTimeout(() => {
10277 if (ended < propCount) {
10278 end();
10279 }
10280 }, timeout + 1);
10281 el.addEventListener(endEvent, onEnd);
10282}
10283function getTransitionInfo(el, expectedType) {
10284 const styles = window.getComputedStyle(el);
10285 // JSDOM may return undefined for transition properties
10286 const getStyleProperties = (key) => (styles[key] || '').split(', ');
10287 const transitionDelays = getStyleProperties(`${TRANSITION}Delay`);
10288 const transitionDurations = getStyleProperties(`${TRANSITION}Duration`);
10289 const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
10290 const animationDelays = getStyleProperties(`${ANIMATION}Delay`);
10291 const animationDurations = getStyleProperties(`${ANIMATION}Duration`);
10292 const animationTimeout = getTimeout(animationDelays, animationDurations);
10293 let type = null;
10294 let timeout = 0;
10295 let propCount = 0;
10296 /* istanbul ignore if */
10297 if (expectedType === TRANSITION) {
10298 if (transitionTimeout > 0) {
10299 type = TRANSITION;
10300 timeout = transitionTimeout;
10301 propCount = transitionDurations.length;
10302 }
10303 }
10304 else if (expectedType === ANIMATION) {
10305 if (animationTimeout > 0) {
10306 type = ANIMATION;
10307 timeout = animationTimeout;
10308 propCount = animationDurations.length;
10309 }
10310 }
10311 else {
10312 timeout = Math.max(transitionTimeout, animationTimeout);
10313 type =
10314 timeout > 0
10315 ? transitionTimeout > animationTimeout
10316 ? TRANSITION
10317 : ANIMATION
10318 : null;
10319 propCount = type
10320 ? type === TRANSITION
10321 ? transitionDurations.length
10322 : animationDurations.length
10323 : 0;
10324 }
10325 const hasTransform = type === TRANSITION &&
10326 /\b(transform|all)(,|$)/.test(getStyleProperties(`${TRANSITION}Property`).toString());
10327 return {
10328 type,
10329 timeout,
10330 propCount,
10331 hasTransform
10332 };
10333}
10334function getTimeout(delays, durations) {
10335 while (delays.length < durations.length) {
10336 delays = delays.concat(delays);
10337 }
10338 return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
10339}
10340// Old versions of Chromium (below 61.0.3163.100) formats floating pointer
10341// numbers in a locale-dependent way, using a comma instead of a dot.
10342// If comma is not replaced with a dot, the input will be rounded down
10343// (i.e. acting as a floor function) causing unexpected behaviors
10344function toMs(s) {
10345 return Number(s.slice(0, -1).replace(',', '.')) * 1000;
10346}
10347// synchronously force layout to put elements into a certain state
10348function forceReflow() {
10349 return document.body.offsetHeight;
10350}
10351
10352const positionMap = new WeakMap();
10353const newPositionMap = new WeakMap();
10354const TransitionGroupImpl = {
10355 name: 'TransitionGroup',
10356 props: /*#__PURE__*/ extend({}, TransitionPropsValidators, {
10357 tag: String,
10358 moveClass: String
10359 }),
10360 setup(props, { slots }) {
10361 const instance = getCurrentInstance();
10362 const state = useTransitionState();
10363 let prevChildren;
10364 let children;
10365 onUpdated(() => {
10366 // children is guaranteed to exist after initial render
10367 if (!prevChildren.length) {
10368 return;
10369 }
10370 const moveClass = props.moveClass || `${props.name || 'v'}-move`;
10371 if (!hasCSSTransform(prevChildren[0].el, instance.vnode.el, moveClass)) {
10372 return;
10373 }
10374 // we divide the work into three loops to avoid mixing DOM reads and writes
10375 // in each iteration - which helps prevent layout thrashing.
10376 prevChildren.forEach(callPendingCbs);
10377 prevChildren.forEach(recordPosition);
10378 const movedChildren = prevChildren.filter(applyTranslation);
10379 // force reflow to put everything in position
10380 forceReflow();
10381 movedChildren.forEach(c => {
10382 const el = c.el;
10383 const style = el.style;
10384 addTransitionClass(el, moveClass);
10385 style.transform = style.webkitTransform = style.transitionDuration = '';
10386 const cb = (el._moveCb = (e) => {
10387 if (e && e.target !== el) {
10388 return;
10389 }
10390 if (!e || /transform$/.test(e.propertyName)) {
10391 el.removeEventListener('transitionend', cb);
10392 el._moveCb = null;
10393 removeTransitionClass(el, moveClass);
10394 }
10395 });
10396 el.addEventListener('transitionend', cb);
10397 });
10398 });
10399 return () => {
10400 const rawProps = toRaw(props);
10401 const cssTransitionProps = resolveTransitionProps(rawProps);
10402 let tag = rawProps.tag || Fragment;
10403 prevChildren = children;
10404 children = slots.default ? getTransitionRawChildren(slots.default()) : [];
10405 for (let i = 0; i < children.length; i++) {
10406 const child = children[i];
10407 if (child.key != null) {
10408 setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
10409 }
10410 else {
10411 warn$1(`<TransitionGroup> children must be keyed.`);
10412 }
10413 }
10414 if (prevChildren) {
10415 for (let i = 0; i < prevChildren.length; i++) {
10416 const child = prevChildren[i];
10417 setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
10418 positionMap.set(child, child.el.getBoundingClientRect());
10419 }
10420 }
10421 return createVNode(tag, null, children);
10422 };
10423 }
10424};
10425const TransitionGroup = TransitionGroupImpl;
10426function callPendingCbs(c) {
10427 const el = c.el;
10428 if (el._moveCb) {
10429 el._moveCb();
10430 }
10431 if (el._enterCb) {
10432 el._enterCb();
10433 }
10434}
10435function recordPosition(c) {
10436 newPositionMap.set(c, c.el.getBoundingClientRect());
10437}
10438function applyTranslation(c) {
10439 const oldPos = positionMap.get(c);
10440 const newPos = newPositionMap.get(c);
10441 const dx = oldPos.left - newPos.left;
10442 const dy = oldPos.top - newPos.top;
10443 if (dx || dy) {
10444 const s = c.el.style;
10445 s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
10446 s.transitionDuration = '0s';
10447 return c;
10448 }
10449}
10450function hasCSSTransform(el, root, moveClass) {
10451 // Detect whether an element with the move class applied has
10452 // CSS transitions. Since the element may be inside an entering
10453 // transition at this very moment, we make a clone of it and remove
10454 // all other transition classes applied to ensure only the move class
10455 // is applied.
10456 const clone = el.cloneNode();
10457 if (el._vtc) {
10458 el._vtc.forEach(cls => {
10459 cls.split(/\s+/).forEach(c => c && clone.classList.remove(c));
10460 });
10461 }
10462 moveClass.split(/\s+/).forEach(c => c && clone.classList.add(c));
10463 clone.style.display = 'none';
10464 const container = (root.nodeType === 1 ? root : root.parentNode);
10465 container.appendChild(clone);
10466 const { hasTransform } = getTransitionInfo(clone);
10467 container.removeChild(clone);
10468 return hasTransform;
10469}
10470
10471const getModelAssigner = (vnode) => {
10472 const fn = vnode.props['onUpdate:modelValue'] ||
10473 (false );
10474 return isArray(fn) ? value => invokeArrayFns(fn, value) : fn;
10475};
10476function onCompositionStart(e) {
10477 e.target.composing = true;
10478}
10479function onCompositionEnd(e) {
10480 const target = e.target;
10481 if (target.composing) {
10482 target.composing = false;
10483 target.dispatchEvent(new Event('input'));
10484 }
10485}
10486// We are exporting the v-model runtime directly as vnode hooks so that it can
10487// be tree-shaken in case v-model is never used.
10488const vModelText = {
10489 created(el, { modifiers: { lazy, trim, number } }, vnode) {
10490 el._assign = getModelAssigner(vnode);
10491 const castToNumber = number || (vnode.props && vnode.props.type === 'number');
10492 addEventListener(el, lazy ? 'change' : 'input', e => {
10493 if (e.target.composing)
10494 return;
10495 let domValue = el.value;
10496 if (trim) {
10497 domValue = domValue.trim();
10498 }
10499 if (castToNumber) {
10500 domValue = toNumber(domValue);
10501 }
10502 el._assign(domValue);
10503 });
10504 if (trim) {
10505 addEventListener(el, 'change', () => {
10506 el.value = el.value.trim();
10507 });
10508 }
10509 if (!lazy) {
10510 addEventListener(el, 'compositionstart', onCompositionStart);
10511 addEventListener(el, 'compositionend', onCompositionEnd);
10512 // Safari < 10.2 & UIWebView doesn't fire compositionend when
10513 // switching focus before confirming composition choice
10514 // this also fixes the issue where some browsers e.g. iOS Chrome
10515 // fires "change" instead of "input" on autocomplete.
10516 addEventListener(el, 'change', onCompositionEnd);
10517 }
10518 },
10519 // set value on mounted so it's after min/max for type="range"
10520 mounted(el, { value }) {
10521 el.value = value == null ? '' : value;
10522 },
10523 beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
10524 el._assign = getModelAssigner(vnode);
10525 // avoid clearing unresolved text. #2302
10526 if (el.composing)
10527 return;
10528 if (document.activeElement === el && el.type !== 'range') {
10529 if (lazy) {
10530 return;
10531 }
10532 if (trim && el.value.trim() === value) {
10533 return;
10534 }
10535 if ((number || el.type === 'number') && toNumber(el.value) === value) {
10536 return;
10537 }
10538 }
10539 const newValue = value == null ? '' : value;
10540 if (el.value !== newValue) {
10541 el.value = newValue;
10542 }
10543 }
10544};
10545const vModelCheckbox = {
10546 // #4096 array checkboxes need to be deep traversed
10547 deep: true,
10548 created(el, _, vnode) {
10549 el._assign = getModelAssigner(vnode);
10550 addEventListener(el, 'change', () => {
10551 const modelValue = el._modelValue;
10552 const elementValue = getValue(el);
10553 const checked = el.checked;
10554 const assign = el._assign;
10555 if (isArray(modelValue)) {
10556 const index = looseIndexOf(modelValue, elementValue);
10557 const found = index !== -1;
10558 if (checked && !found) {
10559 assign(modelValue.concat(elementValue));
10560 }
10561 else if (!checked && found) {
10562 const filtered = [...modelValue];
10563 filtered.splice(index, 1);
10564 assign(filtered);
10565 }
10566 }
10567 else if (isSet(modelValue)) {
10568 const cloned = new Set(modelValue);
10569 if (checked) {
10570 cloned.add(elementValue);
10571 }
10572 else {
10573 cloned.delete(elementValue);
10574 }
10575 assign(cloned);
10576 }
10577 else {
10578 assign(getCheckboxValue(el, checked));
10579 }
10580 });
10581 },
10582 // set initial checked on mount to wait for true-value/false-value
10583 mounted: setChecked,
10584 beforeUpdate(el, binding, vnode) {
10585 el._assign = getModelAssigner(vnode);
10586 setChecked(el, binding, vnode);
10587 }
10588};
10589function setChecked(el, { value, oldValue }, vnode) {
10590 el._modelValue = value;
10591 if (isArray(value)) {
10592 el.checked = looseIndexOf(value, vnode.props.value) > -1;
10593 }
10594 else if (isSet(value)) {
10595 el.checked = value.has(vnode.props.value);
10596 }
10597 else if (value !== oldValue) {
10598 el.checked = looseEqual(value, getCheckboxValue(el, true));
10599 }
10600}
10601const vModelRadio = {
10602 created(el, { value }, vnode) {
10603 el.checked = looseEqual(value, vnode.props.value);
10604 el._assign = getModelAssigner(vnode);
10605 addEventListener(el, 'change', () => {
10606 el._assign(getValue(el));
10607 });
10608 },
10609 beforeUpdate(el, { value, oldValue }, vnode) {
10610 el._assign = getModelAssigner(vnode);
10611 if (value !== oldValue) {
10612 el.checked = looseEqual(value, vnode.props.value);
10613 }
10614 }
10615};
10616const vModelSelect = {
10617 // <select multiple> value need to be deep traversed
10618 deep: true,
10619 created(el, { value, modifiers: { number } }, vnode) {
10620 const isSetModel = isSet(value);
10621 addEventListener(el, 'change', () => {
10622 const selectedVal = Array.prototype.filter
10623 .call(el.options, (o) => o.selected)
10624 .map((o) => number ? toNumber(getValue(o)) : getValue(o));
10625 el._assign(el.multiple
10626 ? isSetModel
10627 ? new Set(selectedVal)
10628 : selectedVal
10629 : selectedVal[0]);
10630 });
10631 el._assign = getModelAssigner(vnode);
10632 },
10633 // set value in mounted & updated because <select> relies on its children
10634 // <option>s.
10635 mounted(el, { value }) {
10636 setSelected(el, value);
10637 },
10638 beforeUpdate(el, _binding, vnode) {
10639 el._assign = getModelAssigner(vnode);
10640 },
10641 updated(el, { value }) {
10642 setSelected(el, value);
10643 }
10644};
10645function setSelected(el, value) {
10646 const isMultiple = el.multiple;
10647 if (isMultiple && !isArray(value) && !isSet(value)) {
10648 warn$1(`<select multiple v-model> expects an Array or Set value for its binding, ` +
10649 `but got ${Object.prototype.toString.call(value).slice(8, -1)}.`);
10650 return;
10651 }
10652 for (let i = 0, l = el.options.length; i < l; i++) {
10653 const option = el.options[i];
10654 const optionValue = getValue(option);
10655 if (isMultiple) {
10656 if (isArray(value)) {
10657 option.selected = looseIndexOf(value, optionValue) > -1;
10658 }
10659 else {
10660 option.selected = value.has(optionValue);
10661 }
10662 }
10663 else {
10664 if (looseEqual(getValue(option), value)) {
10665 if (el.selectedIndex !== i)
10666 el.selectedIndex = i;
10667 return;
10668 }
10669 }
10670 }
10671 if (!isMultiple && el.selectedIndex !== -1) {
10672 el.selectedIndex = -1;
10673 }
10674}
10675// retrieve raw value set via :value bindings
10676function getValue(el) {
10677 return '_value' in el ? el._value : el.value;
10678}
10679// retrieve raw value for true-value and false-value set via :true-value or :false-value bindings
10680function getCheckboxValue(el, checked) {
10681 const key = checked ? '_trueValue' : '_falseValue';
10682 return key in el ? el[key] : checked;
10683}
10684const vModelDynamic = {
10685 created(el, binding, vnode) {
10686 callModelHook(el, binding, vnode, null, 'created');
10687 },
10688 mounted(el, binding, vnode) {
10689 callModelHook(el, binding, vnode, null, 'mounted');
10690 },
10691 beforeUpdate(el, binding, vnode, prevVNode) {
10692 callModelHook(el, binding, vnode, prevVNode, 'beforeUpdate');
10693 },
10694 updated(el, binding, vnode, prevVNode) {
10695 callModelHook(el, binding, vnode, prevVNode, 'updated');
10696 }
10697};
10698function resolveDynamicModel(tagName, type) {
10699 switch (tagName) {
10700 case 'SELECT':
10701 return vModelSelect;
10702 case 'TEXTAREA':
10703 return vModelText;
10704 default:
10705 switch (type) {
10706 case 'checkbox':
10707 return vModelCheckbox;
10708 case 'radio':
10709 return vModelRadio;
10710 default:
10711 return vModelText;
10712 }
10713 }
10714}
10715function callModelHook(el, binding, vnode, prevVNode, hook) {
10716 const modelToUse = resolveDynamicModel(el.tagName, vnode.props && vnode.props.type);
10717 const fn = modelToUse[hook];
10718 fn && fn(el, binding, vnode, prevVNode);
10719}
10720
10721const systemModifiers = ['ctrl', 'shift', 'alt', 'meta'];
10722const modifierGuards = {
10723 stop: e => e.stopPropagation(),
10724 prevent: e => e.preventDefault(),
10725 self: e => e.target !== e.currentTarget,
10726 ctrl: e => !e.ctrlKey,
10727 shift: e => !e.shiftKey,
10728 alt: e => !e.altKey,
10729 meta: e => !e.metaKey,
10730 left: e => 'button' in e && e.button !== 0,
10731 middle: e => 'button' in e && e.button !== 1,
10732 right: e => 'button' in e && e.button !== 2,
10733 exact: (e, modifiers) => systemModifiers.some(m => e[`${m}Key`] && !modifiers.includes(m))
10734};
10735/**
10736 * @private
10737 */
10738const withModifiers = (fn, modifiers) => {
10739 return (event, ...args) => {
10740 for (let i = 0; i < modifiers.length; i++) {
10741 const guard = modifierGuards[modifiers[i]];
10742 if (guard && guard(event, modifiers))
10743 return;
10744 }
10745 return fn(event, ...args);
10746 };
10747};
10748// Kept for 2.x compat.
10749// Note: IE11 compat for `spacebar` and `del` is removed for now.
10750const keyNames = {
10751 esc: 'escape',
10752 space: ' ',
10753 up: 'arrow-up',
10754 left: 'arrow-left',
10755 right: 'arrow-right',
10756 down: 'arrow-down',
10757 delete: 'backspace'
10758};
10759/**
10760 * @private
10761 */
10762const withKeys = (fn, modifiers) => {
10763 return (event) => {
10764 if (!('key' in event)) {
10765 return;
10766 }
10767 const eventKey = hyphenate(event.key);
10768 if (modifiers.some(k => k === eventKey || keyNames[k] === eventKey)) {
10769 return fn(event);
10770 }
10771 };
10772};
10773
10774const vShow = {
10775 beforeMount(el, { value }, { transition }) {
10776 el._vod = el.style.display === 'none' ? '' : el.style.display;
10777 if (transition && value) {
10778 transition.beforeEnter(el);
10779 }
10780 else {
10781 setDisplay(el, value);
10782 }
10783 },
10784 mounted(el, { value }, { transition }) {
10785 if (transition && value) {
10786 transition.enter(el);
10787 }
10788 },
10789 updated(el, { value, oldValue }, { transition }) {
10790 if (!value === !oldValue)
10791 return;
10792 if (transition) {
10793 if (value) {
10794 transition.beforeEnter(el);
10795 setDisplay(el, true);
10796 transition.enter(el);
10797 }
10798 else {
10799 transition.leave(el, () => {
10800 setDisplay(el, false);
10801 });
10802 }
10803 }
10804 else {
10805 setDisplay(el, value);
10806 }
10807 },
10808 beforeUnmount(el, { value }) {
10809 setDisplay(el, value);
10810 }
10811};
10812function setDisplay(el, value) {
10813 el.style.display = value ? el._vod : 'none';
10814}
10815
10816const rendererOptions = /*#__PURE__*/ extend({ patchProp }, nodeOps);
10817// lazy create the renderer - this makes core renderer logic tree-shakable
10818// in case the user only imports reactivity utilities from Vue.
10819let renderer;
10820let enabledHydration = false;
10821function ensureRenderer() {
10822 return (renderer ||
10823 (renderer = createRenderer(rendererOptions)));
10824}
10825function ensureHydrationRenderer() {
10826 renderer = enabledHydration
10827 ? renderer
10828 : createHydrationRenderer(rendererOptions);
10829 enabledHydration = true;
10830 return renderer;
10831}
10832// use explicit type casts here to avoid import() calls in rolled-up d.ts
10833const render = ((...args) => {
10834 ensureRenderer().render(...args);
10835});
10836const hydrate = ((...args) => {
10837 ensureHydrationRenderer().hydrate(...args);
10838});
10839const createApp = ((...args) => {
10840 const app = ensureRenderer().createApp(...args);
10841 {
10842 injectNativeTagCheck(app);
10843 injectCompilerOptionsCheck(app);
10844 }
10845 const { mount } = app;
10846 app.mount = (containerOrSelector) => {
10847 const container = normalizeContainer(containerOrSelector);
10848 if (!container)
10849 return;
10850 const component = app._component;
10851 if (!isFunction(component) && !component.render && !component.template) {
10852 // __UNSAFE__
10853 // Reason: potential execution of JS expressions in in-DOM template.
10854 // The user must make sure the in-DOM template is trusted. If it's
10855 // rendered by the server, the template should not contain any user data.
10856 component.template = container.innerHTML;
10857 }
10858 // clear content before mounting
10859 container.innerHTML = '';
10860 const proxy = mount(container, false, container instanceof SVGElement);
10861 if (container instanceof Element) {
10862 container.removeAttribute('v-cloak');
10863 container.setAttribute('data-v-app', '');
10864 }
10865 return proxy;
10866 };
10867 return app;
10868});
10869const createSSRApp = ((...args) => {
10870 const app = ensureHydrationRenderer().createApp(...args);
10871 {
10872 injectNativeTagCheck(app);
10873 injectCompilerOptionsCheck(app);
10874 }
10875 const { mount } = app;
10876 app.mount = (containerOrSelector) => {
10877 const container = normalizeContainer(containerOrSelector);
10878 if (container) {
10879 return mount(container, true, container instanceof SVGElement);
10880 }
10881 };
10882 return app;
10883});
10884function injectNativeTagCheck(app) {
10885 // Inject `isNativeTag`
10886 // this is used for component name validation (dev only)
10887 Object.defineProperty(app.config, 'isNativeTag', {
10888 value: (tag) => isHTMLTag(tag) || isSVGTag(tag),
10889 writable: false
10890 });
10891}
10892// dev only
10893function injectCompilerOptionsCheck(app) {
10894 if (isRuntimeOnly()) {
10895 const isCustomElement = app.config.isCustomElement;
10896 Object.defineProperty(app.config, 'isCustomElement', {
10897 get() {
10898 return isCustomElement;
10899 },
10900 set() {
10901 warn$1(`The \`isCustomElement\` config option is deprecated. Use ` +
10902 `\`compilerOptions.isCustomElement\` instead.`);
10903 }
10904 });
10905 const compilerOptions = app.config.compilerOptions;
10906 const msg = `The \`compilerOptions\` config option is only respected when using ` +
10907 `a build of Vue.js that includes the runtime compiler (aka "full build"). ` +
10908 `Since you are using the runtime-only build, \`compilerOptions\` ` +
10909 `must be passed to \`@vue/compiler-dom\` in the build setup instead.\n` +
10910 `- For vue-loader: pass it via vue-loader's \`compilerOptions\` loader option.\n` +
10911 `- For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader\n` +
10912 `- 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`;
10913 Object.defineProperty(app.config, 'compilerOptions', {
10914 get() {
10915 warn$1(msg);
10916 return compilerOptions;
10917 },
10918 set() {
10919 warn$1(msg);
10920 }
10921 });
10922 }
10923}
10924function normalizeContainer(container) {
10925 if (isString(container)) {
10926 const res = document.querySelector(container);
10927 if (!res) {
10928 warn$1(`Failed to mount app: mount target selector "${container}" returned null.`);
10929 }
10930 return res;
10931 }
10932 if (window.ShadowRoot &&
10933 container instanceof window.ShadowRoot &&
10934 container.mode === 'closed') {
10935 warn$1(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
10936 }
10937 return container;
10938}
10939/**
10940 * @internal
10941 */
10942const initDirectivesForSSR = NOOP;
10943
10944function initDev() {
10945 {
10946 {
10947 console.info(`You are running a development build of Vue.\n` +
10948 `Make sure to use the production build (*.prod.js) when deploying for production.`);
10949 }
10950 initCustomFormatter();
10951 }
10952}
10953
10954// This entry exports the runtime only, and is built as
10955{
10956 initDev();
10957}
10958const compile$1 = () => {
10959 {
10960 warn$1(`Runtime compilation is not supported in this build of Vue.` +
10961 (` Use "vue.esm-browser.js" instead.`
10962 ) /* should not happen */);
10963 }
10964};
10965
10966export { BaseTransition, Comment, EffectScope, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, Transition, TransitionGroup, VueElement, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, compile$1 as compile, computed$1 as computed, createApp, createBlock, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineProps, defineSSRCustomElement, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hydrate, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useSSRContext, useSlots, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn$1 as warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId };