UNPKG

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