UNPKG

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