UNPKG

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