UNPKG

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