UNPKG

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