import { isRootHook } from '@dcloudio/uni-shared'; /** * Make a map and return a function for checking if a key * is in that map. * IMPORTANT: all calls of this function must be prefixed with * \/\*#\_\_PURE\_\_\*\/ * So that rollup can tree-shake them if necessary. */ function makeMap(str, expectsLowerCase) { const map = Object.create(null); const list = str.split(','); for (let i = 0; i < list.length; i++) { map[list[i]] = true; } return expectsLowerCase ? val => !!map[val.toLowerCase()] : val => !!map[val]; } const GLOBALS_WHITE_LISTED = 'Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,' + 'decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,' + 'Object,Boolean,String,RegExp,Map,Set,JSON,Intl,BigInt'; const isGloballyWhitelisted = /*#__PURE__*/ makeMap(GLOBALS_WHITE_LISTED); /** * On the client we only need to offer special cases for boolean attributes that * have different names from their corresponding dom properties: * - itemscope -> N/A * - allowfullscreen -> allowFullscreen * - formnovalidate -> formNoValidate * - ismap -> isMap * - nomodule -> noModule * - novalidate -> noValidate * - readonly -> readOnly */ const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`; const isSpecialBooleanAttr = /*#__PURE__*/ makeMap(specialBooleanAttrs); function normalizeStyle(value) { if (isArray(value)) { const res = {}; for (let i = 0; i < value.length; i++) { const item = value[i]; const normalized = isString(item) ? parseStringStyle(item) : normalizeStyle(item); if (normalized) { for (const key in normalized) { res[key] = normalized[key]; } } } return res; } else if (isString(value)) { return value; } else if (isObject(value)) { return value; } } const listDelimiterRE = /;(?![^(]*\))/g; const propertyDelimiterRE = /:(.+)/; function parseStringStyle(cssText) { const ret = {}; cssText.split(listDelimiterRE).forEach(item => { if (item) { const tmp = item.split(propertyDelimiterRE); tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim()); } }); return ret; } function normalizeClass(value) { let res = ''; if (isString(value)) { res = value; } else if (isArray(value)) { for (let i = 0; i < value.length; i++) { const normalized = normalizeClass(value[i]); if (normalized) { res += normalized + ' '; } } } else if (isObject(value)) { for (const name in value) { if (value[name]) { res += name + ' '; } } } return res.trim(); } function normalizeProps(props) { if (!props) return null; let { class: klass, style } = props; if (klass && !isString(klass)) { props.class = normalizeClass(klass); } if (style) { props.style = normalizeStyle(style); } return props; } // These tag configs are shared between compiler-dom and runtime-dom, so they // https://developer.mozilla.org/en-US/docs/Web/HTML/Element const HTML_TAGS = 'html,body,base,head,link,meta,style,title,address,article,aside,footer,' + 'header,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,' + 'figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,' + 'data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,' + 'time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,' + 'canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,' + 'th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,' + 'option,output,progress,select,textarea,details,dialog,menu,' + 'summary,template,blockquote,iframe,tfoot'; // https://developer.mozilla.org/en-US/docs/Web/SVG/Element const SVG_TAGS = 'svg,animate,animateMotion,animateTransform,circle,clipPath,color-profile,' + 'defs,desc,discard,ellipse,feBlend,feColorMatrix,feComponentTransfer,' + 'feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,' + 'feDistanceLight,feDropShadow,feFlood,feFuncA,feFuncB,feFuncG,feFuncR,' + 'feGaussianBlur,feImage,feMerge,feMergeNode,feMorphology,feOffset,' + 'fePointLight,feSpecularLighting,feSpotLight,feTile,feTurbulence,filter,' + 'foreignObject,g,hatch,hatchpath,image,line,linearGradient,marker,mask,' + 'mesh,meshgradient,meshpatch,meshrow,metadata,mpath,path,pattern,' + 'polygon,polyline,radialGradient,rect,set,solidcolor,stop,switch,symbol,' + 'text,textPath,title,tspan,unknown,use,view'; const isHTMLTag = /*#__PURE__*/ makeMap(HTML_TAGS); const isSVGTag = /*#__PURE__*/ makeMap(SVG_TAGS); function looseCompareArrays(a, b) { if (a.length !== b.length) return false; let equal = true; for (let i = 0; equal && i < a.length; i++) { equal = looseEqual(a[i], b[i]); } return equal; } function looseEqual(a, b) { if (a === b) return true; let aValidType = isDate(a); let bValidType = isDate(b); if (aValidType || bValidType) { return aValidType && bValidType ? a.getTime() === b.getTime() : false; } aValidType = isArray(a); bValidType = isArray(b); if (aValidType || bValidType) { return aValidType && bValidType ? looseCompareArrays(a, b) : false; } aValidType = isObject(a); bValidType = isObject(b); if (aValidType || bValidType) { /* istanbul ignore if: this if will probably never be called */ if (!aValidType || !bValidType) { return false; } const aKeysCount = Object.keys(a).length; const bKeysCount = Object.keys(b).length; if (aKeysCount !== bKeysCount) { return false; } for (const key in a) { const aHasKey = a.hasOwnProperty(key); const bHasKey = b.hasOwnProperty(key); if ((aHasKey && !bHasKey) || (!aHasKey && bHasKey) || !looseEqual(a[key], b[key])) { return false; } } } return String(a) === String(b); } function looseIndexOf(arr, val) { return arr.findIndex(item => looseEqual(item, val)); } /** * For converting {{ interpolation }} values to displayed strings. * @private */ const toDisplayString = (val) => { return val == null ? '' : isArray(val) || (isObject(val) && val.toString === objectToString) ? JSON.stringify(val, replacer, 2) : String(val); }; const replacer = (_key, val) => { // can't use isRef here since @vue/shared has no deps if (val && val.__v_isRef) { return replacer(_key, val.value); } else if (isMap(val)) { return { [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val]) => { entries[`${key} =>`] = val; return entries; }, {}) }; } else if (isSet(val)) { return { [`Set(${val.size})`]: [...val.values()] }; } else if (isObject(val) && !isArray(val) && !isPlainObject(val)) { return String(val); } return val; }; const EMPTY_OBJ = (process.env.NODE_ENV !== 'production') ? Object.freeze({}) : {}; const EMPTY_ARR = (process.env.NODE_ENV !== 'production') ? Object.freeze([]) : []; const NOOP = () => { }; /** * Always return false. */ const NO = () => false; const onRE = /^on[^a-z]/; const isOn = (key) => onRE.test(key); const isModelListener = (key) => key.startsWith('onUpdate:'); const extend = Object.assign; const remove = (arr, el) => { const i = arr.indexOf(el); if (i > -1) { arr.splice(i, 1); } }; const hasOwnProperty = Object.prototype.hasOwnProperty; const hasOwn = (val, key) => hasOwnProperty.call(val, key); const isArray = Array.isArray; const isMap = (val) => toTypeString(val) === '[object Map]'; const isSet = (val) => toTypeString(val) === '[object Set]'; const isDate = (val) => val instanceof Date; const isFunction = (val) => typeof val === 'function'; const isString = (val) => typeof val === 'string'; const isSymbol = (val) => typeof val === 'symbol'; const isObject = (val) => val !== null && typeof val === 'object'; const isPromise = (val) => { return isObject(val) && isFunction(val.then) && isFunction(val.catch); }; const objectToString = Object.prototype.toString; const toTypeString = (value) => objectToString.call(value); const toRawType = (value) => { // extract "RawType" from strings like "[object RawType]" return toTypeString(value).slice(8, -1); }; const isPlainObject = (val) => toTypeString(val) === '[object Object]'; const isIntegerKey = (key) => isString(key) && key !== 'NaN' && key[0] !== '-' && '' + parseInt(key, 10) === key; const isReservedProp = /*#__PURE__*/ makeMap( // the leading comma is intentional so empty string "" is also included ',key,ref,' + 'onVnodeBeforeMount,onVnodeMounted,' + 'onVnodeBeforeUpdate,onVnodeUpdated,' + 'onVnodeBeforeUnmount,onVnodeUnmounted'); const cacheStringFunction = (fn) => { const cache = Object.create(null); return ((str) => { const hit = cache[str]; return hit || (cache[str] = fn(str)); }); }; const camelizeRE = /-(\w)/g; /** * @private */ const camelize = cacheStringFunction((str) => { return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : '')); }); const hyphenateRE = /\B([A-Z])/g; /** * @private */ const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase()); /** * @private */ const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1)); /** * @private */ const toHandlerKey = cacheStringFunction((str) => str ? `on${capitalize(str)}` : ``); // compare whether a value has changed, accounting for NaN. const hasChanged = (value, oldValue) => !Object.is(value, oldValue); const invokeArrayFns = (fns, arg) => { for (let i = 0; i < fns.length; i++) { fns[i](arg); } }; const def = (obj, key, value) => { Object.defineProperty(obj, key, { configurable: true, enumerable: false, value }); }; const toNumber = (val) => { const n = parseFloat(val); return isNaN(n) ? val : n; }; let _globalThis; const getGlobalThis = () => { return (_globalThis || (_globalThis = typeof globalThis !== 'undefined' ? globalThis : typeof self !== 'undefined' ? self : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : {})); }; function warn(msg, ...args) { console.warn(`[Vue warn] ${msg}`, ...args); } let activeEffectScope; const effectScopeStack = []; class EffectScope { constructor(detached = false) { this.active = true; this.effects = []; this.cleanups = []; if (!detached && activeEffectScope) { this.parent = activeEffectScope; this.index = (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(this) - 1; } } run(fn) { if (this.active) { try { this.on(); return fn(); } finally { this.off(); } } else if ((process.env.NODE_ENV !== 'production')) { warn(`cannot run an inactive effect scope.`); } } on() { if (this.active) { effectScopeStack.push(this); activeEffectScope = this; } } off() { if (this.active) { effectScopeStack.pop(); activeEffectScope = effectScopeStack[effectScopeStack.length - 1]; } } stop(fromParent) { if (this.active) { this.effects.forEach(e => e.stop()); this.cleanups.forEach(cleanup => cleanup()); if (this.scopes) { this.scopes.forEach(e => e.stop(true)); } // nested scope, dereference from parent to avoid memory leaks if (this.parent && !fromParent) { // optimized O(1) removal const last = this.parent.scopes.pop(); if (last && last !== this) { this.parent.scopes[this.index] = last; last.index = this.index; } } this.active = false; } } } function effectScope(detached) { return new EffectScope(detached); } function recordEffectScope(effect, scope) { scope = scope || activeEffectScope; if (scope && scope.active) { scope.effects.push(effect); } } function getCurrentScope() { return activeEffectScope; } function onScopeDispose(fn) { if (activeEffectScope) { activeEffectScope.cleanups.push(fn); } else if ((process.env.NODE_ENV !== 'production')) { warn(`onDispose() is called when there is no active effect scope` + ` to be associated with.`); } } const createDep = (effects) => { const dep = new Set(effects); dep.w = 0; dep.n = 0; return dep; }; const wasTracked = (dep) => (dep.w & trackOpBit) > 0; const newTracked = (dep) => (dep.n & trackOpBit) > 0; const initDepMarkers = ({ deps }) => { if (deps.length) { for (let i = 0; i < deps.length; i++) { deps[i].w |= trackOpBit; // set was tracked } } }; const finalizeDepMarkers = (effect) => { const { deps } = effect; if (deps.length) { let ptr = 0; for (let i = 0; i < deps.length; i++) { const dep = deps[i]; if (wasTracked(dep) && !newTracked(dep)) { dep.delete(effect); } else { deps[ptr++] = dep; } // clear bits dep.w &= ~trackOpBit; dep.n &= ~trackOpBit; } deps.length = ptr; } }; const targetMap = new WeakMap(); // The number of effects currently being tracked recursively. let effectTrackDepth = 0; let trackOpBit = 1; /** * The bitwise track markers support at most 30 levels op recursion. * This value is chosen to enable modern JS engines to use a SMI on all platforms. * When recursion depth is greater, fall back to using a full cleanup. */ const maxMarkerBits = 30; const effectStack = []; let activeEffect; const ITERATE_KEY = Symbol((process.env.NODE_ENV !== 'production') ? 'iterate' : ''); const MAP_KEY_ITERATE_KEY = Symbol((process.env.NODE_ENV !== 'production') ? 'Map key iterate' : ''); class ReactiveEffect { constructor(fn, scheduler = null, scope) { this.fn = fn; this.scheduler = scheduler; this.active = true; this.deps = []; recordEffectScope(this, scope); } run() { if (!this.active) { return this.fn(); } if (!effectStack.includes(this)) { try { effectStack.push((activeEffect = this)); enableTracking(); trackOpBit = 1 << ++effectTrackDepth; if (effectTrackDepth <= maxMarkerBits) { initDepMarkers(this); } else { cleanupEffect(this); } return this.fn(); } finally { if (effectTrackDepth <= maxMarkerBits) { finalizeDepMarkers(this); } trackOpBit = 1 << --effectTrackDepth; resetTracking(); effectStack.pop(); const n = effectStack.length; activeEffect = n > 0 ? effectStack[n - 1] : undefined; } } } stop() { if (this.active) { cleanupEffect(this); if (this.onStop) { this.onStop(); } this.active = false; } } } function cleanupEffect(effect) { const { deps } = effect; if (deps.length) { for (let i = 0; i < deps.length; i++) { deps[i].delete(effect); } deps.length = 0; } } function effect(fn, options) { if (fn.effect) { fn = fn.effect.fn; } const _effect = new ReactiveEffect(fn); if (options) { extend(_effect, options); if (options.scope) recordEffectScope(_effect, options.scope); } if (!options || !options.lazy) { _effect.run(); } const runner = _effect.run.bind(_effect); runner.effect = _effect; return runner; } function stop(runner) { runner.effect.stop(); } let shouldTrack = true; const trackStack = []; function pauseTracking() { trackStack.push(shouldTrack); shouldTrack = false; } function enableTracking() { trackStack.push(shouldTrack); shouldTrack = true; } function resetTracking() { const last = trackStack.pop(); shouldTrack = last === undefined ? true : last; } function track(target, type, key) { if (!isTracking()) { return; } let depsMap = targetMap.get(target); if (!depsMap) { targetMap.set(target, (depsMap = new Map())); } let dep = depsMap.get(key); if (!dep) { depsMap.set(key, (dep = createDep())); } const eventInfo = (process.env.NODE_ENV !== 'production') ? { effect: activeEffect, target, type, key } : undefined; trackEffects(dep, eventInfo); } function isTracking() { return shouldTrack && activeEffect !== undefined; } function trackEffects(dep, debuggerEventExtraInfo) { let shouldTrack = false; if (effectTrackDepth <= maxMarkerBits) { if (!newTracked(dep)) { dep.n |= trackOpBit; // set newly tracked shouldTrack = !wasTracked(dep); } } else { // Full cleanup mode. shouldTrack = !dep.has(activeEffect); } if (shouldTrack) { dep.add(activeEffect); activeEffect.deps.push(dep); if ((process.env.NODE_ENV !== 'production') && activeEffect.onTrack) { activeEffect.onTrack(Object.assign({ effect: activeEffect }, debuggerEventExtraInfo)); } } } function trigger(target, type, key, newValue, oldValue, oldTarget) { const depsMap = targetMap.get(target); if (!depsMap) { // never been tracked return; } let deps = []; if (type === "clear" /* CLEAR */) { // collection being cleared // trigger all effects for target deps = [...depsMap.values()]; } else if (key === 'length' && isArray(target)) { depsMap.forEach((dep, key) => { if (key === 'length' || key >= newValue) { deps.push(dep); } }); } else { // schedule runs for SET | ADD | DELETE if (key !== void 0) { deps.push(depsMap.get(key)); } // also run for iteration key on ADD | DELETE | Map.SET switch (type) { case "add" /* ADD */: if (!isArray(target)) { deps.push(depsMap.get(ITERATE_KEY)); if (isMap(target)) { deps.push(depsMap.get(MAP_KEY_ITERATE_KEY)); } } else if (isIntegerKey(key)) { // new index added to array -> length changes deps.push(depsMap.get('length')); } break; case "delete" /* DELETE */: if (!isArray(target)) { deps.push(depsMap.get(ITERATE_KEY)); if (isMap(target)) { deps.push(depsMap.get(MAP_KEY_ITERATE_KEY)); } } break; case "set" /* SET */: if (isMap(target)) { deps.push(depsMap.get(ITERATE_KEY)); } break; } } const eventInfo = (process.env.NODE_ENV !== 'production') ? { target, type, key, newValue, oldValue, oldTarget } : undefined; if (deps.length === 1) { if (deps[0]) { if ((process.env.NODE_ENV !== 'production')) { triggerEffects(deps[0], eventInfo); } else { triggerEffects(deps[0]); } } } else { const effects = []; for (const dep of deps) { if (dep) { effects.push(...dep); } } if ((process.env.NODE_ENV !== 'production')) { triggerEffects(createDep(effects), eventInfo); } else { triggerEffects(createDep(effects)); } } } function triggerEffects(dep, debuggerEventExtraInfo) { // spread into array for stabilization for (const effect of isArray(dep) ? dep : [...dep]) { if (effect !== activeEffect || effect.allowRecurse) { if ((process.env.NODE_ENV !== 'production') && effect.onTrigger) { effect.onTrigger(extend({ effect }, debuggerEventExtraInfo)); } if (effect.scheduler) { effect.scheduler(); } else { effect.run(); } } } } const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`); const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol) .map(key => Symbol[key]) .filter(isSymbol)); const get = /*#__PURE__*/ createGetter(); const shallowGet = /*#__PURE__*/ createGetter(false, true); const readonlyGet = /*#__PURE__*/ createGetter(true); const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true); const arrayInstrumentations = /*#__PURE__*/ createArrayInstrumentations(); function createArrayInstrumentations() { const instrumentations = {}; ['includes', 'indexOf', 'lastIndexOf'].forEach(key => { instrumentations[key] = function (...args) { const arr = toRaw(this); for (let i = 0, l = this.length; i < l; i++) { track(arr, "get" /* GET */, i + ''); } // we run the method using the original args first (which may be reactive) const res = arr[key](...args); if (res === -1 || res === false) { // if that didn't work, run it again using raw values. return arr[key](...args.map(toRaw)); } else { return res; } }; }); ['push', 'pop', 'shift', 'unshift', 'splice'].forEach(key => { instrumentations[key] = function (...args) { pauseTracking(); const res = toRaw(this)[key].apply(this, args); resetTracking(); return res; }; }); return instrumentations; } function createGetter(isReadonly = false, shallow = false) { return function get(target, key, receiver) { if (key === "__v_isReactive" /* IS_REACTIVE */) { return !isReadonly; } else if (key === "__v_isReadonly" /* IS_READONLY */) { return isReadonly; } else if (key === "__v_raw" /* RAW */ && receiver === (isReadonly ? shallow ? shallowReadonlyMap : readonlyMap : shallow ? shallowReactiveMap : reactiveMap).get(target)) { return target; } const targetIsArray = isArray(target); if (!isReadonly && targetIsArray && hasOwn(arrayInstrumentations, key)) { return Reflect.get(arrayInstrumentations, key, receiver); } const res = Reflect.get(target, key, receiver); if (isSymbol(key) ? builtInSymbols.has(key) : isNonTrackableKeys(key)) { return res; } if (!isReadonly) { track(target, "get" /* GET */, key); } if (shallow) { return res; } if (isRef(res)) { // ref unwrapping - does not apply for Array + integer key. const shouldUnwrap = !targetIsArray || !isIntegerKey(key); return shouldUnwrap ? res.value : res; } if (isObject(res)) { // Convert returned value into a proxy as well. we do the isObject check // here to avoid invalid value warning. Also need to lazy access readonly // and reactive here to avoid circular dependency. return isReadonly ? readonly(res) : reactive(res); } return res; }; } const set = /*#__PURE__*/ createSetter(); const shallowSet = /*#__PURE__*/ createSetter(true); function createSetter(shallow = false) { return function set(target, key, value, receiver) { let oldValue = target[key]; if (!shallow) { value = toRaw(value); oldValue = toRaw(oldValue); if (!isArray(target) && isRef(oldValue) && !isRef(value)) { oldValue.value = value; return true; } } const hadKey = isArray(target) && isIntegerKey(key) ? Number(key) < target.length : hasOwn(target, key); const result = Reflect.set(target, key, value, receiver); // don't trigger if target is something up in the prototype chain of original if (target === toRaw(receiver)) { if (!hadKey) { trigger(target, "add" /* ADD */, key, value); } else if (hasChanged(value, oldValue)) { trigger(target, "set" /* SET */, key, value, oldValue); } } return result; }; } function deleteProperty(target, key) { const hadKey = hasOwn(target, key); const oldValue = target[key]; const result = Reflect.deleteProperty(target, key); if (result && hadKey) { trigger(target, "delete" /* DELETE */, key, undefined, oldValue); } return result; } function has(target, key) { const result = Reflect.has(target, key); if (!isSymbol(key) || !builtInSymbols.has(key)) { track(target, "has" /* HAS */, key); } return result; } function ownKeys(target) { track(target, "iterate" /* ITERATE */, isArray(target) ? 'length' : ITERATE_KEY); return Reflect.ownKeys(target); } const mutableHandlers = { get, set, deleteProperty, has, ownKeys }; const readonlyHandlers = { get: readonlyGet, set(target, key) { if ((process.env.NODE_ENV !== 'production')) { console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target); } return true; }, deleteProperty(target, key) { if ((process.env.NODE_ENV !== 'production')) { console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target); } return true; } }; const shallowReactiveHandlers = /*#__PURE__*/ extend({}, mutableHandlers, { get: shallowGet, set: shallowSet }); // Props handlers are special in the sense that it should not unwrap top-level // refs (in order to allow refs to be explicitly passed down), but should // retain the reactivity of the normal readonly object. const shallowReadonlyHandlers = /*#__PURE__*/ extend({}, readonlyHandlers, { get: shallowReadonlyGet }); const toReactive = (value) => isObject(value) ? reactive(value) : value; const toReadonly = (value) => isObject(value) ? readonly(value) : value; const toShallow = (value) => value; const getProto = (v) => Reflect.getPrototypeOf(v); function get$1(target, key, isReadonly = false, isShallow = false) { // #1772: readonly(reactive(Map)) should return readonly + reactive version // of the value target = target["__v_raw" /* RAW */]; const rawTarget = toRaw(target); const rawKey = toRaw(key); if (key !== rawKey) { !isReadonly && track(rawTarget, "get" /* GET */, key); } !isReadonly && track(rawTarget, "get" /* GET */, rawKey); const { has } = getProto(rawTarget); const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive; if (has.call(rawTarget, key)) { return wrap(target.get(key)); } else if (has.call(rawTarget, rawKey)) { return wrap(target.get(rawKey)); } else if (target !== rawTarget) { // #3602 readonly(reactive(Map)) // ensure that the nested reactive `Map` can do tracking for itself target.get(key); } } function has$1(key, isReadonly = false) { const target = this["__v_raw" /* RAW */]; const rawTarget = toRaw(target); const rawKey = toRaw(key); if (key !== rawKey) { !isReadonly && track(rawTarget, "has" /* HAS */, key); } !isReadonly && track(rawTarget, "has" /* HAS */, rawKey); return key === rawKey ? target.has(key) : target.has(key) || target.has(rawKey); } function size(target, isReadonly = false) { target = target["__v_raw" /* RAW */]; !isReadonly && track(toRaw(target), "iterate" /* ITERATE */, ITERATE_KEY); return Reflect.get(target, 'size', target); } function add(value) { value = toRaw(value); const target = toRaw(this); const proto = getProto(target); const hadKey = proto.has.call(target, value); if (!hadKey) { target.add(value); trigger(target, "add" /* ADD */, value, value); } return this; } function set$1(key, value) { value = toRaw(value); const target = toRaw(this); const { has, get } = getProto(target); let hadKey = has.call(target, key); if (!hadKey) { key = toRaw(key); hadKey = has.call(target, key); } else if ((process.env.NODE_ENV !== 'production')) { checkIdentityKeys(target, has, key); } const oldValue = get.call(target, key); target.set(key, value); if (!hadKey) { trigger(target, "add" /* ADD */, key, value); } else if (hasChanged(value, oldValue)) { trigger(target, "set" /* SET */, key, value, oldValue); } return this; } function deleteEntry(key) { const target = toRaw(this); const { has, get } = getProto(target); let hadKey = has.call(target, key); if (!hadKey) { key = toRaw(key); hadKey = has.call(target, key); } else if ((process.env.NODE_ENV !== 'production')) { checkIdentityKeys(target, has, key); } const oldValue = get ? get.call(target, key) : undefined; // forward the operation before queueing reactions const result = target.delete(key); if (hadKey) { trigger(target, "delete" /* DELETE */, key, undefined, oldValue); } return result; } function clear() { const target = toRaw(this); const hadItems = target.size !== 0; const oldTarget = (process.env.NODE_ENV !== 'production') ? isMap(target) ? new Map(target) : new Set(target) : undefined; // forward the operation before queueing reactions const result = target.clear(); if (hadItems) { trigger(target, "clear" /* CLEAR */, undefined, undefined, oldTarget); } return result; } function createForEach(isReadonly, isShallow) { return function forEach(callback, thisArg) { const observed = this; const target = observed["__v_raw" /* RAW */]; const rawTarget = toRaw(target); const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive; !isReadonly && track(rawTarget, "iterate" /* ITERATE */, ITERATE_KEY); return target.forEach((value, key) => { // important: make sure the callback is // 1. invoked with the reactive map as `this` and 3rd arg // 2. the value received should be a corresponding reactive/readonly. return callback.call(thisArg, wrap(value), wrap(key), observed); }); }; } function createIterableMethod(method, isReadonly, isShallow) { return function (...args) { const target = this["__v_raw" /* RAW */]; const rawTarget = toRaw(target); const targetIsMap = isMap(rawTarget); const isPair = method === 'entries' || (method === Symbol.iterator && targetIsMap); const isKeyOnly = method === 'keys' && targetIsMap; const innerIterator = target[method](...args); const wrap = isShallow ? toShallow : isReadonly ? toReadonly : toReactive; !isReadonly && track(rawTarget, "iterate" /* ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY); // return a wrapped iterator which returns observed versions of the // values emitted from the real iterator return { // iterator protocol next() { const { value, done } = innerIterator.next(); return done ? { value, done } : { value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value), done }; }, // iterable protocol [Symbol.iterator]() { return this; } }; }; } function createReadonlyMethod(type) { return function (...args) { if ((process.env.NODE_ENV !== 'production')) { const key = args[0] ? `on key "${args[0]}" ` : ``; console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this)); } return type === "delete" /* DELETE */ ? false : this; }; } function createInstrumentations() { const mutableInstrumentations = { get(key) { return get$1(this, key); }, get size() { return size(this); }, has: has$1, add, set: set$1, delete: deleteEntry, clear, forEach: createForEach(false, false) }; const shallowInstrumentations = { get(key) { return get$1(this, key, false, true); }, get size() { return size(this); }, has: has$1, add, set: set$1, delete: deleteEntry, clear, forEach: createForEach(false, true) }; const readonlyInstrumentations = { get(key) { return get$1(this, key, true); }, get size() { return size(this, true); }, has(key) { return has$1.call(this, key, true); }, add: createReadonlyMethod("add" /* ADD */), set: createReadonlyMethod("set" /* SET */), delete: createReadonlyMethod("delete" /* DELETE */), clear: createReadonlyMethod("clear" /* CLEAR */), forEach: createForEach(true, false) }; const shallowReadonlyInstrumentations = { get(key) { return get$1(this, key, true, true); }, get size() { return size(this, true); }, has(key) { return has$1.call(this, key, true); }, add: createReadonlyMethod("add" /* ADD */), set: createReadonlyMethod("set" /* SET */), delete: createReadonlyMethod("delete" /* DELETE */), clear: createReadonlyMethod("clear" /* CLEAR */), forEach: createForEach(true, true) }; const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator]; iteratorMethods.forEach(method => { mutableInstrumentations[method] = createIterableMethod(method, false, false); readonlyInstrumentations[method] = createIterableMethod(method, true, false); shallowInstrumentations[method] = createIterableMethod(method, false, true); shallowReadonlyInstrumentations[method] = createIterableMethod(method, true, true); }); return [ mutableInstrumentations, readonlyInstrumentations, shallowInstrumentations, shallowReadonlyInstrumentations ]; } const [mutableInstrumentations, readonlyInstrumentations, shallowInstrumentations, shallowReadonlyInstrumentations] = /* #__PURE__*/ createInstrumentations(); function createInstrumentationGetter(isReadonly, shallow) { const instrumentations = shallow ? isReadonly ? shallowReadonlyInstrumentations : shallowInstrumentations : isReadonly ? readonlyInstrumentations : mutableInstrumentations; return (target, key, receiver) => { if (key === "__v_isReactive" /* IS_REACTIVE */) { return !isReadonly; } else if (key === "__v_isReadonly" /* IS_READONLY */) { return isReadonly; } else if (key === "__v_raw" /* RAW */) { return target; } return Reflect.get(hasOwn(instrumentations, key) && key in target ? instrumentations : target, key, receiver); }; } const mutableCollectionHandlers = { get: /*#__PURE__*/ createInstrumentationGetter(false, false) }; const shallowCollectionHandlers = { get: /*#__PURE__*/ createInstrumentationGetter(false, true) }; const readonlyCollectionHandlers = { get: /*#__PURE__*/ createInstrumentationGetter(true, false) }; const shallowReadonlyCollectionHandlers = { get: /*#__PURE__*/ createInstrumentationGetter(true, true) }; function checkIdentityKeys(target, has, key) { const rawKey = toRaw(key); if (rawKey !== key && has.call(target, rawKey)) { const type = toRawType(target); console.warn(`Reactive ${type} contains both the raw and reactive ` + `versions of the same object${type === `Map` ? ` as keys` : ``}, ` + `which can lead to inconsistencies. ` + `Avoid differentiating between the raw and reactive versions ` + `of an object and only use the reactive version if possible.`); } } const reactiveMap = new WeakMap(); const shallowReactiveMap = new WeakMap(); const readonlyMap = new WeakMap(); const shallowReadonlyMap = new WeakMap(); function targetTypeMap(rawType) { switch (rawType) { case 'Object': case 'Array': return 1 /* COMMON */; case 'Map': case 'Set': case 'WeakMap': case 'WeakSet': return 2 /* COLLECTION */; default: return 0 /* INVALID */; } } function getTargetType(value) { return value["__v_skip" /* SKIP */] || !Object.isExtensible(value) ? 0 /* INVALID */ : targetTypeMap(toRawType(value)); } function reactive(target) { // if trying to observe a readonly proxy, return the readonly version. if (target && target["__v_isReadonly" /* IS_READONLY */]) { return target; } return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers, reactiveMap); } /** * Return a shallowly-reactive copy of the original object, where only the root * level properties are reactive. It also does not auto-unwrap refs (even at the * root level). */ function shallowReactive(target) { return createReactiveObject(target, false, shallowReactiveHandlers, shallowCollectionHandlers, shallowReactiveMap); } /** * Creates a readonly copy of the original object. Note the returned copy is not * made reactive, but `readonly` can be called on an already reactive object. */ function readonly(target) { return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers, readonlyMap); } /** * Returns a reactive-copy of the original object, where only the root level * properties are readonly, and does NOT unwrap refs nor recursively convert * returned properties. * This is used for creating the props proxy object for stateful components. */ function shallowReadonly(target) { return createReactiveObject(target, true, shallowReadonlyHandlers, shallowReadonlyCollectionHandlers, shallowReadonlyMap); } function createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers, proxyMap) { if (!isObject(target)) { if ((process.env.NODE_ENV !== 'production')) { console.warn(`value cannot be made reactive: ${String(target)}`); } return target; } // target is already a Proxy, return it. // exception: calling readonly() on a reactive object if (target["__v_raw" /* RAW */] && !(isReadonly && target["__v_isReactive" /* IS_REACTIVE */])) { return target; } // target already has corresponding Proxy const existingProxy = proxyMap.get(target); if (existingProxy) { return existingProxy; } // only a whitelist of value types can be observed. const targetType = getTargetType(target); if (targetType === 0 /* INVALID */) { return target; } const proxy = new Proxy(target, targetType === 2 /* COLLECTION */ ? collectionHandlers : baseHandlers); proxyMap.set(target, proxy); return proxy; } function isReactive(value) { if (isReadonly(value)) { return isReactive(value["__v_raw" /* RAW */]); } return !!(value && value["__v_isReactive" /* IS_REACTIVE */]); } function isReadonly(value) { return !!(value && value["__v_isReadonly" /* IS_READONLY */]); } function isProxy(value) { return isReactive(value) || isReadonly(value); } function toRaw(observed) { const raw = observed && observed["__v_raw" /* RAW */]; return raw ? toRaw(raw) : observed; } function markRaw(value) { def(value, "__v_skip" /* SKIP */, true); return value; } function trackRefValue(ref) { if (isTracking()) { ref = toRaw(ref); if (!ref.dep) { ref.dep = createDep(); } if ((process.env.NODE_ENV !== 'production')) { trackEffects(ref.dep, { target: ref, type: "get" /* GET */, key: 'value' }); } else { trackEffects(ref.dep); } } } function triggerRefValue(ref, newVal) { ref = toRaw(ref); if (ref.dep) { if ((process.env.NODE_ENV !== 'production')) { triggerEffects(ref.dep, { target: ref, type: "set" /* SET */, key: 'value', newValue: newVal }); } else { triggerEffects(ref.dep); } } } const convert = (val) => isObject(val) ? reactive(val) : val; function isRef(r) { return Boolean(r && r.__v_isRef === true); } function ref(value) { return createRef(value); } function shallowRef(value) { return createRef(value, true); } class RefImpl { constructor(value, _shallow = false) { this._shallow = _shallow; this.dep = undefined; this.__v_isRef = true; this._rawValue = _shallow ? value : toRaw(value); this._value = _shallow ? value : convert(value); } get value() { trackRefValue(this); return this._value; } set value(newVal) { newVal = this._shallow ? newVal : toRaw(newVal); if (hasChanged(newVal, this._rawValue)) { this._rawValue = newVal; this._value = this._shallow ? newVal : convert(newVal); triggerRefValue(this, newVal); } } } function createRef(rawValue, shallow = false) { if (isRef(rawValue)) { return rawValue; } return new RefImpl(rawValue, shallow); } function triggerRef(ref) { triggerRefValue(ref, (process.env.NODE_ENV !== 'production') ? ref.value : void 0); } function unref(ref) { return isRef(ref) ? ref.value : ref; } const shallowUnwrapHandlers = { get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)), set: (target, key, value, receiver) => { const oldValue = target[key]; if (isRef(oldValue) && !isRef(value)) { oldValue.value = value; return true; } else { return Reflect.set(target, key, value, receiver); } } }; function proxyRefs(objectWithRefs) { return isReactive(objectWithRefs) ? objectWithRefs : new Proxy(objectWithRefs, shallowUnwrapHandlers); } class CustomRefImpl { constructor(factory) { this.dep = undefined; this.__v_isRef = true; const { get, set } = factory(() => trackRefValue(this), () => triggerRefValue(this)); this._get = get; this._set = set; } get value() { return this._get(); } set value(newVal) { this._set(newVal); } } function customRef(factory) { return new CustomRefImpl(factory); } function toRefs(object) { if ((process.env.NODE_ENV !== 'production') && !isProxy(object)) { console.warn(`toRefs() expects a reactive object but received a plain one.`); } const ret = isArray(object) ? new Array(object.length) : {}; for (const key in object) { ret[key] = toRef(object, key); } return ret; } class ObjectRefImpl { constructor(_object, _key) { this._object = _object; this._key = _key; this.__v_isRef = true; } get value() { return this._object[this._key]; } set value(newVal) { this._object[this._key] = newVal; } } function toRef(object, key) { return isRef(object[key]) ? object[key] : new ObjectRefImpl(object, key); } class ComputedRefImpl { constructor(getter, _setter, isReadonly) { this._setter = _setter; this.dep = undefined; this._dirty = true; this.__v_isRef = true; this.effect = new ReactiveEffect(getter, () => { if (!this._dirty) { this._dirty = true; triggerRefValue(this); } }); this["__v_isReadonly" /* IS_READONLY */] = isReadonly; } get value() { // the computed ref may get wrapped by other proxies e.g. readonly() #3376 const self = toRaw(this); trackRefValue(self); if (self._dirty) { self._dirty = false; self._value = self.effect.run(); } return self._value; } set value(newValue) { this._setter(newValue); } } function computed(getterOrOptions, debugOptions) { let getter; let setter; if (isFunction(getterOrOptions)) { getter = getterOrOptions; setter = (process.env.NODE_ENV !== 'production') ? () => { console.warn('Write operation failed: computed value is readonly'); } : NOOP; } else { getter = getterOrOptions.get; setter = getterOrOptions.set; } const cRef = new ComputedRefImpl(getter, setter, isFunction(getterOrOptions) || !getterOrOptions.set); if ((process.env.NODE_ENV !== 'production') && debugOptions) { cRef.effect.onTrack = debugOptions.onTrack; cRef.effect.onTrigger = debugOptions.onTrigger; } return cRef; } /* eslint-disable no-restricted-globals */ let isHmrUpdating = false; const hmrDirtyComponents = new Set(); // Expose the HMR runtime on the global object // This makes it entirely tree-shakable without polluting the exports and makes // it easier to be used in toolings like vue-loader // Note: for a component to be eligible for HMR it also needs the __hmrId option // to be set so that its instances can be registered / removed. if ((process.env.NODE_ENV !== 'production')) { const globalObject = typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : typeof window !== 'undefined' ? window : {}; globalObject.__VUE_HMR_RUNTIME__ = { createRecord: tryWrap(createRecord), rerender: tryWrap(rerender), reload: tryWrap(reload) }; } const map = new Map(); function registerHMR(instance) { const id = instance.type.__hmrId; let record = map.get(id); if (!record) { createRecord(id, instance.type); record = map.get(id); } record.instances.add(instance); } function unregisterHMR(instance) { map.get(instance.type.__hmrId).instances.delete(instance); } function createRecord(id, component) { if (!component) { warn$1(`HMR API usage is out of date.\n` + `Please upgrade vue-loader/vite/rollup-plugin-vue or other relevant ` + `dependency that handles Vue SFC compilation.`); component = {}; } if (map.has(id)) { return false; } map.set(id, { component: isClassComponent(component) ? component.__vccOpts : component, instances: new Set() }); return true; } function rerender(id, newRender) { const record = map.get(id); if (!record) return; if (newRender) record.component.render = newRender; // Array.from creates a snapshot which avoids the set being mutated during // updates Array.from(record.instances).forEach(instance => { if (newRender) { instance.render = newRender; } instance.renderCache = []; // this flag forces child components with slot content to update isHmrUpdating = true; instance.update(); isHmrUpdating = false; }); } function reload(id, newComp) { const record = map.get(id); if (!record) return; // Array.from creates a snapshot which avoids the set being mutated during // updates const { component, instances } = record; if (!hmrDirtyComponents.has(component)) { // 1. Update existing comp definition to match new one newComp = isClassComponent(newComp) ? newComp.__vccOpts : newComp; extend(component, newComp); for (const key in component) { if (key !== '__file' && !(key in newComp)) { delete component[key]; } } // 2. Mark component dirty. This forces the renderer to replace the component // on patch. hmrDirtyComponents.add(component); // 3. Make sure to unmark the component after the reload. queuePostFlushCb(() => { hmrDirtyComponents.delete(component); }); } Array.from(instances).forEach(instance => { // invalidate options resolution cache instance.appContext.optionsCache.delete(instance.type); if (instance.ceReload) { // custom element hmrDirtyComponents.add(component); instance.ceReload(newComp.styles); hmrDirtyComponents.delete(component); } else if (instance.parent) { // 4. Force the parent instance to re-render. This will cause all updated // components to be unmounted and re-mounted. Queue the update so that we // don't end up forcing the same parent to re-render multiple times. queueJob(instance.parent.update); // instance is the inner component of an async custom element // invoke to reset styles if (instance.parent.type.__asyncLoader && instance.parent.ceReload) { instance.parent.ceReload(newComp.styles); } } else if (instance.appContext.reload) { // root instance mounted via createApp() has a reload method instance.appContext.reload(); } else if (typeof window !== 'undefined') { // root instance inside tree created via raw render(). Force reload. window.location.reload(); } else { console.warn('[HMR] Root or manually mounted instance modified. Full reload required.'); } }); } function tryWrap(fn) { return (id, arg) => { try { return fn(id, arg); } catch (e) { console.error(e); console.warn(`[HMR] Something went wrong during Vue component hot-reload. ` + `Full reload required.`); } }; } let devtools; function setDevtoolsHook(hook) { devtools = hook; } function devtoolsInitApp(app, version) { // TODO queue if devtools is undefined if (!devtools) return; devtools.emit("app:init" /* APP_INIT */, app, version, { Fragment, Text, Comment: Comment$1, Static }); } function devtoolsUnmountApp(app) { if (!devtools) return; devtools.emit("app:unmount" /* APP_UNMOUNT */, app); } const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* COMPONENT_ADDED */); const devtoolsComponentUpdated = /*#__PURE__*/ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */); const devtoolsComponentRemoved = /*#__PURE__*/ createDevtoolsComponentHook("component:removed" /* COMPONENT_REMOVED */); function createDevtoolsComponentHook(hook) { return (component) => { if (!devtools) return; devtools.emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component); }; } const devtoolsPerfStart = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:start" /* PERFORMANCE_START */); const devtoolsPerfEnd = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:end" /* PERFORMANCE_END */); function createDevtoolsPerformanceHook(hook) { return (component, type, time) => { if (!devtools) return; devtools.emit(hook, component.appContext.app, component.uid, component, type, time); }; } function devtoolsComponentEmit(component, event, params) { if (!devtools) return; devtools.emit("component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params); } const deprecationData = { ["GLOBAL_MOUNT" /* GLOBAL_MOUNT */]: { message: `The global app bootstrapping API has changed: vm.$mount() and the "el" ` + `option have been removed. Use createApp(RootComponent).mount() instead.`, link: `https://v3.vuejs.org/guide/migration/global-api.html#mounting-app-instance` }, ["GLOBAL_MOUNT_CONTAINER" /* GLOBAL_MOUNT_CONTAINER */]: { message: `Vue detected directives on the mount container. ` + `In Vue 3, the container is no longer considered part of the template ` + `and will not be processed/replaced.`, link: `https://v3.vuejs.org/guide/migration/mount-changes.html` }, ["GLOBAL_EXTEND" /* GLOBAL_EXTEND */]: { message: `Vue.extend() has been removed in Vue 3. ` + `Use defineComponent() instead.`, link: `https://v3.vuejs.org/api/global-api.html#definecomponent` }, ["GLOBAL_PROTOTYPE" /* GLOBAL_PROTOTYPE */]: { message: `Vue.prototype is no longer available in Vue 3. ` + `Use app.config.globalProperties instead.`, link: `https://v3.vuejs.org/guide/migration/global-api.html#vue-prototype-replaced-by-config-globalproperties` }, ["GLOBAL_SET" /* GLOBAL_SET */]: { message: `Vue.set() has been removed as it is no longer needed in Vue 3. ` + `Simply use native JavaScript mutations.` }, ["GLOBAL_DELETE" /* GLOBAL_DELETE */]: { message: `Vue.delete() has been removed as it is no longer needed in Vue 3. ` + `Simply use native JavaScript mutations.` }, ["GLOBAL_OBSERVABLE" /* GLOBAL_OBSERVABLE */]: { message: `Vue.observable() has been removed. ` + `Use \`import { reactive } from "vue"\` from Composition API instead.`, link: `https://v3.vuejs.org/api/basic-reactivity.html` }, ["GLOBAL_PRIVATE_UTIL" /* GLOBAL_PRIVATE_UTIL */]: { message: `Vue.util has been removed. Please refactor to avoid its usage ` + `since it was an internal API even in Vue 2.` }, ["CONFIG_SILENT" /* CONFIG_SILENT */]: { message: `config.silent has been removed because it is not good practice to ` + `intentionally suppress warnings. You can use your browser console's ` + `filter features to focus on relevant messages.` }, ["CONFIG_DEVTOOLS" /* CONFIG_DEVTOOLS */]: { message: `config.devtools has been removed. To enable devtools for ` + `production, configure the __VUE_PROD_DEVTOOLS__ compile-time flag.`, link: `https://github.com/vuejs/vue-next/tree/master/packages/vue#bundler-build-feature-flags` }, ["CONFIG_KEY_CODES" /* CONFIG_KEY_CODES */]: { message: `config.keyCodes has been removed. ` + `In Vue 3, you can directly use the kebab-case key names as v-on modifiers.`, link: `https://v3.vuejs.org/guide/migration/keycode-modifiers.html` }, ["CONFIG_PRODUCTION_TIP" /* CONFIG_PRODUCTION_TIP */]: { message: `config.productionTip has been removed.`, link: `https://v3.vuejs.org/guide/migration/global-api.html#config-productiontip-removed` }, ["CONFIG_IGNORED_ELEMENTS" /* CONFIG_IGNORED_ELEMENTS */]: { message: () => { let msg = `config.ignoredElements has been removed.`; if (isRuntimeOnly()) { msg += ` Pass the "isCustomElement" option to @vue/compiler-dom instead.`; } else { msg += ` Use config.isCustomElement instead.`; } return msg; }, link: `https://v3.vuejs.org/guide/migration/global-api.html#config-ignoredelements-is-now-config-iscustomelement` }, ["CONFIG_WHITESPACE" /* CONFIG_WHITESPACE */]: { // this warning is only relevant in the full build when using runtime // compilation, so it's put in the runtime compatConfig list. message: `Vue 3 compiler's whitespace option will default to "condense" instead of ` + `"preserve". To suppress this warning, provide an explicit value for ` + `\`config.compilerOptions.whitespace\`.` }, ["CONFIG_OPTION_MERGE_STRATS" /* CONFIG_OPTION_MERGE_STRATS */]: { message: `config.optionMergeStrategies no longer exposes internal strategies. ` + `Use custom merge functions instead.` }, ["INSTANCE_SET" /* INSTANCE_SET */]: { message: `vm.$set() has been removed as it is no longer needed in Vue 3. ` + `Simply use native JavaScript mutations.` }, ["INSTANCE_DELETE" /* INSTANCE_DELETE */]: { message: `vm.$delete() has been removed as it is no longer needed in Vue 3. ` + `Simply use native JavaScript mutations.` }, ["INSTANCE_DESTROY" /* INSTANCE_DESTROY */]: { message: `vm.$destroy() has been removed. Use app.unmount() instead.`, link: `https://v3.vuejs.org/api/application-api.html#unmount` }, ["INSTANCE_EVENT_EMITTER" /* INSTANCE_EVENT_EMITTER */]: { message: `vm.$on/$once/$off() have been removed. ` + `Use an external event emitter library instead.`, link: `https://v3.vuejs.org/guide/migration/events-api.html` }, ["INSTANCE_EVENT_HOOKS" /* INSTANCE_EVENT_HOOKS */]: { message: event => `"${event}" lifecycle events are no longer supported. From templates, ` + `use the "vnode" prefix instead of "hook:". For example, @${event} ` + `should be changed to @vnode-${event.slice(5)}. ` + `From JavaScript, use Composition API to dynamically register lifecycle ` + `hooks.`, link: `https://v3.vuejs.org/guide/migration/vnode-lifecycle-events.html` }, ["INSTANCE_CHILDREN" /* INSTANCE_CHILDREN */]: { message: `vm.$children has been removed. Consider refactoring your logic ` + `to avoid relying on direct access to child components.`, link: `https://v3.vuejs.org/guide/migration/children.html` }, ["INSTANCE_LISTENERS" /* INSTANCE_LISTENERS */]: { message: `vm.$listeners has been removed. In Vue 3, parent v-on listeners are ` + `included in vm.$attrs and it is no longer necessary to separately use ` + `v-on="$listeners" if you are already using v-bind="$attrs". ` + `(Note: the Vue 3 behavior only applies if this compat config is disabled)`, link: `https://v3.vuejs.org/guide/migration/listeners-removed.html` }, ["INSTANCE_SCOPED_SLOTS" /* INSTANCE_SCOPED_SLOTS */]: { message: `vm.$scopedSlots has been removed. Use vm.$slots instead.`, link: `https://v3.vuejs.org/guide/migration/slots-unification.html` }, ["INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */]: { message: componentName => `Component <${componentName || 'Anonymous'}> has \`inheritAttrs: false\` but is ` + `relying on class/style fallthrough from parent. In Vue 3, class/style ` + `are now included in $attrs and will no longer fallthrough when ` + `inheritAttrs is false. If you are already using v-bind="$attrs" on ` + `component root it should render the same end result. ` + `If you are binding $attrs to a non-root element and expecting ` + `class/style to fallthrough on root, you will need to now manually bind ` + `them on root via :class="$attrs.class".`, link: `https://v3.vuejs.org/guide/migration/attrs-includes-class-style.html` }, ["OPTIONS_DATA_FN" /* OPTIONS_DATA_FN */]: { message: `The "data" option can no longer be a plain object. ` + `Always use a function.`, link: `https://v3.vuejs.org/guide/migration/data-option.html` }, ["OPTIONS_DATA_MERGE" /* OPTIONS_DATA_MERGE */]: { message: (key) => `Detected conflicting key "${key}" when merging data option values. ` + `In Vue 3, data keys are merged shallowly and will override one another.`, link: `https://v3.vuejs.org/guide/migration/data-option.html#mixin-merge-behavior-change` }, ["OPTIONS_BEFORE_DESTROY" /* OPTIONS_BEFORE_DESTROY */]: { message: `\`beforeDestroy\` has been renamed to \`beforeUnmount\`.` }, ["OPTIONS_DESTROYED" /* OPTIONS_DESTROYED */]: { message: `\`destroyed\` has been renamed to \`unmounted\`.` }, ["WATCH_ARRAY" /* WATCH_ARRAY */]: { message: `"watch" option or vm.$watch on an array value will no longer ` + `trigger on array mutation unless the "deep" option is specified. ` + `If current usage is intended, you can disable the compat behavior and ` + `suppress this warning with:` + `\n\n configureCompat({ ${"WATCH_ARRAY" /* WATCH_ARRAY */}: false })\n`, link: `https://v3.vuejs.org/guide/migration/watch.html` }, ["PROPS_DEFAULT_THIS" /* PROPS_DEFAULT_THIS */]: { message: (key) => `props default value function no longer has access to "this". The compat ` + `build only offers access to this.$options.` + `(found in prop "${key}")`, link: `https://v3.vuejs.org/guide/migration/props-default-this.html` }, ["CUSTOM_DIR" /* CUSTOM_DIR */]: { message: (legacyHook, newHook) => `Custom directive hook "${legacyHook}" has been removed. ` + `Use "${newHook}" instead.`, link: `https://v3.vuejs.org/guide/migration/custom-directives.html` }, ["V_FOR_REF" /* V_FOR_REF */]: { message: `Ref usage on v-for no longer creates array ref values in Vue 3. ` + `Consider using function refs or refactor to avoid ref usage altogether.`, link: `https://v3.vuejs.org/guide/migration/array-refs.html` }, ["V_ON_KEYCODE_MODIFIER" /* V_ON_KEYCODE_MODIFIER */]: { message: `Using keyCode as v-on modifier is no longer supported. ` + `Use kebab-case key name modifiers instead.`, link: `https://v3.vuejs.org/guide/migration/keycode-modifiers.html` }, ["ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */]: { message: (name) => `Attribute "${name}" with v-bind value \`false\` will render ` + `${name}="false" instead of removing it in Vue 3. To remove the attribute, ` + `use \`null\` or \`undefined\` instead. If the usage is intended, ` + `you can disable the compat behavior and suppress this warning with:` + `\n\n configureCompat({ ${"ATTR_FALSE_VALUE" /* ATTR_FALSE_VALUE */}: false })\n`, link: `https://v3.vuejs.org/guide/migration/attribute-coercion.html` }, ["ATTR_ENUMERATED_COERCION" /* ATTR_ENUMERATED_COERCION */]: { message: (name, value, coerced) => `Enumerated attribute "${name}" with v-bind value \`${value}\` will ` + `${value === null ? `be removed` : `render the value as-is`} instead of coercing the value to "${coerced}" in Vue 3. ` + `Always use explicit "true" or "false" values for enumerated attributes. ` + `If the usage is intended, ` + `you can disable the compat behavior and suppress this warning with:` + `\n\n configureCompat({ ${"ATTR_ENUMERATED_COERCION" /* ATTR_ENUMERATED_COERCION */}: false })\n`, link: `https://v3.vuejs.org/guide/migration/attribute-coercion.html` }, ["TRANSITION_CLASSES" /* TRANSITION_CLASSES */]: { message: `` // this feature cannot be runtime-detected }, ["TRANSITION_GROUP_ROOT" /* TRANSITION_GROUP_ROOT */]: { message: ` no longer renders a root element by ` + `default if no "tag" prop is specified. If you do not rely on the span ` + `for styling, you can disable the compat behavior and suppress this ` + `warning with:` + `\n\n configureCompat({ ${"TRANSITION_GROUP_ROOT" /* TRANSITION_GROUP_ROOT */}: false })\n`, link: `https://v3.vuejs.org/guide/migration/transition-group.html` }, ["COMPONENT_ASYNC" /* COMPONENT_ASYNC */]: { message: (comp) => { const name = getComponentName(comp); return (`Async component${name ? ` <${name}>` : `s`} should be explicitly created via \`defineAsyncComponent()\` ` + `in Vue 3. Plain functions will be treated as functional components in ` + `non-compat build. If you have already migrated all async component ` + `usage and intend to use plain functions for functional components, ` + `you can disable the compat behavior and suppress this ` + `warning with:` + `\n\n configureCompat({ ${"COMPONENT_ASYNC" /* COMPONENT_ASYNC */}: false })\n`); }, link: `https://v3.vuejs.org/guide/migration/async-components.html` }, ["COMPONENT_FUNCTIONAL" /* COMPONENT_FUNCTIONAL */]: { message: (comp) => { const name = getComponentName(comp); return (`Functional component${name ? ` <${name}>` : `s`} should be defined as a plain function in Vue 3. The "functional" ` + `option has been removed. NOTE: Before migrating to use plain ` + `functions for functional components, first make sure that all async ` + `components usage have been migrated and its compat behavior has ` + `been disabled.`); }, link: `https://v3.vuejs.org/guide/migration/functional-components.html` }, ["COMPONENT_V_MODEL" /* COMPONENT_V_MODEL */]: { message: (comp) => { const configMsg = `opt-in to ` + `Vue 3 behavior on a per-component basis with \`compatConfig: { ${"COMPONENT_V_MODEL" /* COMPONENT_V_MODEL */}: false }\`.`; if (comp.props && (isArray(comp.props) ? comp.props.includes('modelValue') : hasOwn(comp.props, 'modelValue'))) { return (`Component delcares "modelValue" prop, which is Vue 3 usage, but ` + `is running under Vue 2 compat v-model behavior. You can ${configMsg}`); } return (`v-model usage on component has changed in Vue 3. Component that expects ` + `to work with v-model should now use the "modelValue" prop and emit the ` + `"update:modelValue" event. You can update the usage and then ${configMsg}`); }, link: `https://v3.vuejs.org/guide/migration/v-model.html` }, ["RENDER_FUNCTION" /* RENDER_FUNCTION */]: { message: `Vue 3's render function API has changed. ` + `You can opt-in to the new API with:` + `\n\n configureCompat({ ${"RENDER_FUNCTION" /* RENDER_FUNCTION */}: false })\n` + `\n (This can also be done per-component via the "compatConfig" option.)`, link: `https://v3.vuejs.org/guide/migration/render-function-api.html` }, ["FILTERS" /* FILTERS */]: { message: `filters have been removed in Vue 3. ` + `The "|" symbol will be treated as native JavaScript bitwise OR operator. ` + `Use method calls or computed properties instead.`, link: `https://v3.vuejs.org/guide/migration/filters.html` }, ["PRIVATE_APIS" /* PRIVATE_APIS */]: { message: name => `"${name}" is a Vue 2 private API that no longer exists in Vue 3. ` + `If you are seeing this warning only due to a dependency, you can ` + `suppress this warning via { PRIVATE_APIS: 'supress-warning' }.` } }; const instanceWarned = Object.create(null); const warnCount = Object.create(null); function warnDeprecation(key, instance, ...args) { if (!(process.env.NODE_ENV !== 'production')) { return; } instance = instance || getCurrentInstance(); // check user config const config = getCompatConfigForKey(key, instance); if (config === 'suppress-warning') { return; } const dupKey = key + args.join(''); let compId = instance && formatComponentName(instance, instance.type); if (compId === 'Anonymous' && instance) { compId = instance.uid; } // skip if the same warning is emitted for the same component type const componentDupKey = dupKey + compId; if (componentDupKey in instanceWarned) { return; } instanceWarned[componentDupKey] = true; // same warning, but different component. skip the long message and just // log the key and count. if (dupKey in warnCount) { warn$1(`(deprecation ${key}) (${++warnCount[dupKey] + 1})`); return; } warnCount[dupKey] = 0; const { message, link } = deprecationData[key]; warn$1(`(deprecation ${key}) ${typeof message === 'function' ? message(...args) : message}${link ? `\n Details: ${link}` : ``}`); if (!isCompatEnabled(key, instance, true)) { console.error(`^ The above deprecation's compat behavior is disabled and will likely ` + `lead to runtime errors.`); } } const globalCompatConfig = { MODE: 2 }; function configureCompat(config) { if ((process.env.NODE_ENV !== 'production')) { validateCompatConfig(config); } extend(globalCompatConfig, config); } const seenConfigObjects = /*#__PURE__*/ new WeakSet(); const warnedInvalidKeys = {}; // dev only function validateCompatConfig(config, instance) { if (seenConfigObjects.has(config)) { return; } seenConfigObjects.add(config); for (const key of Object.keys(config)) { if (key !== 'MODE' && !(key in deprecationData) && !(key in warnedInvalidKeys)) { if (key.startsWith('COMPILER_')) { if (isRuntimeOnly()) { warn$1(`Deprecation config "${key}" is compiler-specific and you are ` + `running a runtime-only build of Vue. This deprecation should be ` + `configured via compiler options in your build setup instead.\n` + `Details: https://v3.vuejs.org/guide/migration/migration-build.html`); } } else { warn$1(`Invalid deprecation config "${key}".`); } warnedInvalidKeys[key] = true; } } if (instance && config["OPTIONS_DATA_MERGE" /* OPTIONS_DATA_MERGE */] != null) { warn$1(`Deprecation config "${"OPTIONS_DATA_MERGE" /* OPTIONS_DATA_MERGE */}" can only be configured globally.`); } } function getCompatConfigForKey(key, instance) { const instanceConfig = instance && instance.type.compatConfig; if (instanceConfig && key in instanceConfig) { return instanceConfig[key]; } return globalCompatConfig[key]; } function isCompatEnabled(key, instance, enableForBuiltIn = false) { // skip compat for built-in components if (!enableForBuiltIn && instance && instance.type.__isBuiltIn) { return false; } const rawMode = getCompatConfigForKey('MODE', instance) || 2; const val = getCompatConfigForKey(key, instance); const mode = isFunction(rawMode) ? rawMode(instance && instance.type) : rawMode; if (mode === 2) { return val !== false; } else { return val === true || val === 'suppress-warning'; } } /** * Use this for features that are completely removed in non-compat build. */ function assertCompatEnabled(key, instance, ...args) { if (!isCompatEnabled(key, instance)) { throw new Error(`${key} compat has been disabled.`); } else if ((process.env.NODE_ENV !== 'production')) { warnDeprecation(key, instance, ...args); } } /** * Use this for features where legacy usage is still possible, but will likely * lead to runtime error if compat is disabled. (warn in all cases) */ function softAssertCompatEnabled(key, instance, ...args) { if ((process.env.NODE_ENV !== 'production')) { warnDeprecation(key, instance, ...args); } return isCompatEnabled(key, instance); } /** * Use this for features with the same syntax but with mutually exclusive * behavior in 2 vs 3. Only warn if compat is enabled. * e.g. render function */ function checkCompatEnabled(key, instance, ...args) { const enabled = isCompatEnabled(key, instance); if ((process.env.NODE_ENV !== 'production') && enabled) { warnDeprecation(key, instance, ...args); } return enabled; } const eventRegistryMap = /*#__PURE__*/ new WeakMap(); function getRegistry(instance) { let events = eventRegistryMap.get(instance); if (!events) { eventRegistryMap.set(instance, (events = Object.create(null))); } return events; } function on(instance, event, fn) { if (isArray(event)) { event.forEach(e => on(instance, e, fn)); } else { if (event.startsWith('hook:')) { assertCompatEnabled("INSTANCE_EVENT_HOOKS" /* INSTANCE_EVENT_HOOKS */, instance, event); } else { assertCompatEnabled("INSTANCE_EVENT_EMITTER" /* INSTANCE_EVENT_EMITTER */, instance); } const events = getRegistry(instance); (events[event] || (events[event] = [])).push(fn); } return instance.proxy; } function once(instance, event, fn) { const wrapped = (...args) => { off(instance, event, wrapped); fn.call(instance.proxy, ...args); }; wrapped.fn = fn; on(instance, event, wrapped); return instance.proxy; } function off(instance, event, fn) { assertCompatEnabled("INSTANCE_EVENT_EMITTER" /* INSTANCE_EVENT_EMITTER */, instance); const vm = instance.proxy; // all if (!event) { eventRegistryMap.set(instance, Object.create(null)); return vm; } // array of events if (isArray(event)) { event.forEach(e => off(instance, e, fn)); return vm; } // specific event const events = getRegistry(instance); const cbs = events[event]; if (!cbs) { return vm; } if (!fn) { events[event] = undefined; return vm; } events[event] = cbs.filter(cb => !(cb === fn || cb.fn === fn)); return vm; } function emit(instance, event, args) { const cbs = getRegistry(instance)[event]; if (cbs) { callWithAsyncErrorHandling(cbs.map(cb => cb.bind(instance.proxy)), instance, 6 /* COMPONENT_EVENT_HANDLER */, args); } return instance.proxy; } const compatModelEventPrefix = `onModelCompat:`; const warnedTypes = new WeakSet(); function convertLegacyVModelProps(vnode) { const { type, shapeFlag, props, dynamicProps } = vnode; if (shapeFlag & 6 /* COMPONENT */ && props && 'modelValue' in props) { if (!isCompatEnabled("COMPONENT_V_MODEL" /* COMPONENT_V_MODEL */, // this is a special case where we want to use the vnode component's // compat config instead of the current rendering instance (which is the // parent of the component that exposes v-model) { type })) { return; } if ((process.env.NODE_ENV !== 'production') && !warnedTypes.has(type)) { pushWarningContext(vnode); warnDeprecation("COMPONENT_V_MODEL" /* COMPONENT_V_MODEL */, { type }, type); popWarningContext(); warnedTypes.add(type); } // v3 compiled model code -> v2 compat props // modelValue -> value // onUpdate:modelValue -> onModelCompat:input const { prop = 'value', event = 'input' } = type.model || {}; if (prop !== 'modelValue') { props[prop] = props.modelValue; delete props.modelValue; } // important: update dynamic props if (dynamicProps) { dynamicProps[dynamicProps.indexOf('modelValue')] = prop; } props[compatModelEventPrefix + event] = props['onUpdate:modelValue']; delete props['onUpdate:modelValue']; } } function compatModelEmit(instance, event, args) { if (!isCompatEnabled("COMPONENT_V_MODEL" /* COMPONENT_V_MODEL */, instance)) { return; } const props = instance.vnode.props; const modelHandler = props && props[compatModelEventPrefix + event]; if (modelHandler) { callWithErrorHandling(modelHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args); } } function emit$1(instance, event, ...rawArgs) { const props = instance.vnode.props || EMPTY_OBJ; if ((process.env.NODE_ENV !== 'production')) { const { emitsOptions, propsOptions: [propsOptions] } = instance; if (emitsOptions) { if (!(event in emitsOptions) && !((event.startsWith('hook:') || event.startsWith(compatModelEventPrefix)))) { if (!propsOptions || !(toHandlerKey(event) in propsOptions)) { warn$1(`Component emitted event "${event}" but it is neither declared in ` + `the emits option nor as an "${toHandlerKey(event)}" prop.`); } } else { const validator = emitsOptions[event]; if (isFunction(validator)) { const isValid = validator(...rawArgs); if (!isValid) { warn$1(`Invalid event arguments: event validation failed for event "${event}".`); } } } } } let args = rawArgs; const isModelListener = event.startsWith('update:'); // for v-model update:xxx events, apply modifiers on args const modelArg = isModelListener && event.slice(7); if (modelArg && modelArg in props) { const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`; const { number, trim } = props[modifiersKey] || EMPTY_OBJ; if (trim) { args = rawArgs.map(a => a.trim()); } else if (number) { args = rawArgs.map(toNumber); } } if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { devtoolsComponentEmit(instance, event, args); } if ((process.env.NODE_ENV !== 'production')) { const lowerCaseEvent = event.toLowerCase(); if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) { warn$1(`Event "${lowerCaseEvent}" is emitted in component ` + `${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` + `Note that HTML attributes are case-insensitive and you cannot use ` + `v-on to listen to camelCase events when using in-DOM templates. ` + `You should probably use "${hyphenate(event)}" instead of "${event}".`); } } let handlerName; let handler = props[(handlerName = toHandlerKey(event))] || // also try camelCase event handler (#2249) props[(handlerName = toHandlerKey(camelize(event)))]; // for v-model update:xxx events, also trigger kebab-case equivalent // for props passed via kebab-case if (!handler && isModelListener) { handler = props[(handlerName = toHandlerKey(hyphenate(event)))]; } if (handler) { callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args); } const onceHandler = props[handlerName + `Once`]; if (onceHandler) { if (!instance.emitted) { instance.emitted = {}; } else if (instance.emitted[handlerName]) { return; } instance.emitted[handlerName] = true; callWithAsyncErrorHandling(onceHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args); } { compatModelEmit(instance, event, args); return emit(instance, event, args); } } function normalizeEmitsOptions(comp, appContext, asMixin = false) { const cache = appContext.emitsCache; const cached = cache.get(comp); if (cached !== undefined) { return cached; } const raw = comp.emits; let normalized = {}; // apply mixin/extends props let hasExtends = false; if (__VUE_OPTIONS_API__ && !isFunction(comp)) { const extendEmits = (raw) => { const normalizedFromExtend = normalizeEmitsOptions(raw, appContext, true); if (normalizedFromExtend) { hasExtends = true; extend(normalized, normalizedFromExtend); } }; if (!asMixin && appContext.mixins.length) { appContext.mixins.forEach(extendEmits); } if (comp.extends) { extendEmits(comp.extends); } if (comp.mixins) { comp.mixins.forEach(extendEmits); } } if (!raw && !hasExtends) { cache.set(comp, null); return null; } if (isArray(raw)) { raw.forEach(key => (normalized[key] = null)); } else { extend(normalized, raw); } cache.set(comp, normalized); return normalized; } // Check if an incoming prop key is a declared emit event listener. // e.g. With `emits: { click: null }`, props named `onClick` and `onclick` are // both considered matched listeners. function isEmitListener(options, key) { if (!options || !isOn(key)) { return false; } if (key.startsWith(compatModelEventPrefix)) { return true; } key = key.slice(2).replace(/Once$/, ''); return (hasOwn(options, key[0].toLowerCase() + key.slice(1)) || hasOwn(options, hyphenate(key)) || hasOwn(options, key)); } /** * mark the current rendering instance for asset resolution (e.g. * resolveComponent, resolveDirective) during render */ let currentRenderingInstance = null; let currentScopeId = null; /** * Note: rendering calls maybe nested. The function returns the parent rendering * instance if present, which should be restored after the render is done: * * ```js * const prev = setCurrentRenderingInstance(i) * // ...render * setCurrentRenderingInstance(prev) * ``` */ function setCurrentRenderingInstance(instance) { const prev = currentRenderingInstance; currentRenderingInstance = instance; currentScopeId = (instance && instance.type.__scopeId) || null; // v2 pre-compiled components uses _scopeId instead of __scopeId if (!currentScopeId) { currentScopeId = (instance && instance.type._scopeId) || null; } return prev; } /** * Set scope id when creating hoisted vnodes. * @private compiler helper */ function pushScopeId(id) { currentScopeId = id; } /** * Technically we no longer need this after 3.0.8 but we need to keep the same * API for backwards compat w/ code generated by compilers. * @private */ function popScopeId() { currentScopeId = null; } /** * Only for backwards compat * @private */ const withScopeId = (_id) => withCtx; /** * Wrap a slot function to memoize current rendering instance * @private compiler helper */ function withCtx(fn, ctx = currentRenderingInstance, isNonScopedSlot // true only ) { if (!ctx) return fn; // already normalized if (fn._n) { return fn; } const renderFnWithContext = (...args) => { // If a user calls a compiled slot inside a template expression (#1745), it // can mess up block tracking, so by default we disable block tracking and // force bail out when invoking a compiled slot (indicated by the ._d flag). // This isn't necessary if rendering a compiled ``, so we flip the // ._d flag off when invoking the wrapped fn inside `renderSlot`. if (renderFnWithContext._d) { setBlockTracking(-1); } const prevInstance = setCurrentRenderingInstance(ctx); const res = fn(...args); setCurrentRenderingInstance(prevInstance); if (renderFnWithContext._d) { setBlockTracking(1); } if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { devtoolsComponentUpdated(ctx); } return res; }; // mark normalized to avoid duplicated wrapping renderFnWithContext._n = true; // mark this as compiled by default // this is used in vnode.ts -> normalizeChildren() to set the slot // rendering flag. renderFnWithContext._c = true; // disable block tracking by default renderFnWithContext._d = true; // compat build only flag to distinguish scoped slots from non-scoped ones if (isNonScopedSlot) { renderFnWithContext._ns = true; } return renderFnWithContext; } /** * dev only flag to track whether $attrs was used during render. * If $attrs was used during render then the warning for failed attrs * fallthrough can be suppressed. */ let accessedAttrs = false; function markAttrsAccessed() { accessedAttrs = true; } function renderComponentRoot(instance) { const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx, inheritAttrs } = instance; let result; const prev = setCurrentRenderingInstance(instance); if ((process.env.NODE_ENV !== 'production')) { accessedAttrs = false; } try { let fallthroughAttrs; if (vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */) { // withProxy is a proxy with a different `has` trap only for // runtime-compiled render functions using `with` block. const proxyToUse = withProxy || proxy; result = normalizeVNode(render.call(proxyToUse, proxyToUse, renderCache, props, setupState, data, ctx)); fallthroughAttrs = attrs; } else { // functional const render = Component; // in dev, mark attrs accessed if optional props (attrs === props) if ((process.env.NODE_ENV !== 'production') && attrs === props) { markAttrsAccessed(); } result = normalizeVNode(render.length > 1 ? render(props, (process.env.NODE_ENV !== 'production') ? { get attrs() { markAttrsAccessed(); return attrs; }, slots, emit } : { attrs, slots, emit }) : render(props, null /* we know it doesn't need it */)); fallthroughAttrs = Component.props ? attrs : getFunctionalFallthrough(attrs); } // attr merging // in dev mode, comments are preserved, and it's possible for a template // to have comments along side the root element which makes it a fragment let root = result; let setRoot = undefined; if ((process.env.NODE_ENV !== 'production') && result.patchFlag > 0 && result.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) { ; [root, setRoot] = getChildRoot(result); } if (fallthroughAttrs && inheritAttrs !== false) { const keys = Object.keys(fallthroughAttrs); const { shapeFlag } = root; if (keys.length) { if (shapeFlag & 1 /* ELEMENT */ || shapeFlag & 6 /* COMPONENT */) { if (propsOptions && keys.some(isModelListener)) { // If a v-model listener (onUpdate:xxx) has a corresponding declared // prop, it indicates this component expects to handle v-model and // it should not fallthrough. // related: #1543, #1643, #1989 fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions); } root = cloneVNode(root, fallthroughAttrs); } else if ((process.env.NODE_ENV !== 'production') && !accessedAttrs && root.type !== Comment$1) { const allAttrs = Object.keys(attrs); const eventAttrs = []; const extraAttrs = []; for (let i = 0, l = allAttrs.length; i < l; i++) { const key = allAttrs[i]; if (isOn(key)) { // ignore v-model handlers when they fail to fallthrough if (!isModelListener(key)) { // remove `on`, lowercase first letter to reflect event casing // accurately eventAttrs.push(key[2].toLowerCase() + key.slice(3)); } } else { extraAttrs.push(key); } } if (extraAttrs.length) { warn$1(`Extraneous non-props attributes (` + `${extraAttrs.join(', ')}) ` + `were passed to component but could not be automatically inherited ` + `because component renders fragment or text root nodes.`); } if (eventAttrs.length) { warn$1(`Extraneous non-emits event listeners (` + `${eventAttrs.join(', ')}) ` + `were passed to component but could not be automatically inherited ` + `because component renders fragment or text root nodes. ` + `If the listener is intended to be a component custom event listener only, ` + `declare it using the "emits" option.`); } } } } if (true && isCompatEnabled("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance) && vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */ && (root.shapeFlag & 1 /* ELEMENT */ || root.shapeFlag & 6 /* COMPONENT */)) { const { class: cls, style } = vnode.props || {}; if (cls || style) { if ((process.env.NODE_ENV !== 'production') && inheritAttrs === false) { warnDeprecation("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance, getComponentName(instance.type)); } root = cloneVNode(root, { class: cls, style: style }); } } // inherit directives if (vnode.dirs) { if ((process.env.NODE_ENV !== 'production') && !isElementRoot(root)) { warn$1(`Runtime directive used on component with non-element root node. ` + `The directives will not function as intended.`); } root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs; } // inherit transition data if (vnode.transition) { if ((process.env.NODE_ENV !== 'production') && !isElementRoot(root)) { warn$1(`Component inside renders non-element root node ` + `that cannot be animated.`); } root.transition = vnode.transition; } if ((process.env.NODE_ENV !== 'production') && setRoot) { setRoot(root); } else { result = root; } } catch (err) { blockStack.length = 0; handleError(err, instance, 1 /* RENDER_FUNCTION */); result = createVNode(Comment$1); } setCurrentRenderingInstance(prev); return result; } /** * dev only * In dev mode, template root level comments are rendered, which turns the * template into a fragment root, but we need to locate the single element * root for attrs and scope id processing. */ const getChildRoot = (vnode) => { const rawChildren = vnode.children; const dynamicChildren = vnode.dynamicChildren; const childRoot = filterSingleRoot(rawChildren); if (!childRoot) { return [vnode, undefined]; } const index = rawChildren.indexOf(childRoot); const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1; const setRoot = (updatedRoot) => { rawChildren[index] = updatedRoot; if (dynamicChildren) { if (dynamicIndex > -1) { dynamicChildren[dynamicIndex] = updatedRoot; } else if (updatedRoot.patchFlag > 0) { vnode.dynamicChildren = [...dynamicChildren, updatedRoot]; } } }; return [normalizeVNode(childRoot), setRoot]; }; function filterSingleRoot(children) { let singleRoot; for (let i = 0; i < children.length; i++) { const child = children[i]; if (isVNode(child)) { // ignore user comment if (child.type !== Comment$1 || child.children === 'v-if') { if (singleRoot) { // has more than 1 non-comment child, return now return; } else { singleRoot = child; } } } else { return; } } return singleRoot; } const getFunctionalFallthrough = (attrs) => { let res; for (const key in attrs) { if (key === 'class' || key === 'style' || isOn(key)) { (res || (res = {}))[key] = attrs[key]; } } return res; }; const filterModelListeners = (attrs, props) => { const res = {}; for (const key in attrs) { if (!isModelListener(key) || !(key.slice(9) in props)) { res[key] = attrs[key]; } } return res; }; const isElementRoot = (vnode) => { return (vnode.shapeFlag & 6 /* COMPONENT */ || vnode.shapeFlag & 1 /* ELEMENT */ || vnode.type === Comment$1 // potential v-if branch switch ); }; function shouldUpdateComponent(prevVNode, nextVNode, optimized) { const { props: prevProps, children: prevChildren, component } = prevVNode; const { props: nextProps, children: nextChildren, patchFlag } = nextVNode; const emits = component.emitsOptions; // Parent component's render function was hot-updated. Since this may have // caused the child component's slots content to have changed, we need to // force the child to update as well. if ((process.env.NODE_ENV !== 'production') && (prevChildren || nextChildren) && isHmrUpdating) { return true; } // force child update for runtime directive or transition on component vnode. if (nextVNode.dirs || nextVNode.transition) { return true; } if (optimized && patchFlag >= 0) { if (patchFlag & 1024 /* DYNAMIC_SLOTS */) { // slot content that references values that might have changed, // e.g. in a v-for return true; } if (patchFlag & 16 /* FULL_PROPS */) { if (!prevProps) { return !!nextProps; } // presence of this flag indicates props are always non-null return hasPropsChanged(prevProps, nextProps, emits); } else if (patchFlag & 8 /* PROPS */) { const dynamicProps = nextVNode.dynamicProps; for (let i = 0; i < dynamicProps.length; i++) { const key = dynamicProps[i]; if (nextProps[key] !== prevProps[key] && !isEmitListener(emits, key)) { return true; } } } } else { // this path is only taken by manually written render functions // so presence of any children leads to a forced update if (prevChildren || nextChildren) { if (!nextChildren || !nextChildren.$stable) { return true; } } if (prevProps === nextProps) { return false; } if (!prevProps) { return !!nextProps; } if (!nextProps) { return true; } return hasPropsChanged(prevProps, nextProps, emits); } return false; } function hasPropsChanged(prevProps, nextProps, emitsOptions) { const nextKeys = Object.keys(nextProps); if (nextKeys.length !== Object.keys(prevProps).length) { return true; } for (let i = 0; i < nextKeys.length; i++) { const key = nextKeys[i]; if (nextProps[key] !== prevProps[key] && !isEmitListener(emitsOptions, key)) { return true; } } return false; } function updateHOCHostEl({ vnode, parent }, el // HostNode ) { while (parent && parent.subTree === vnode) { (vnode = parent.vnode).el = el; parent = parent.parent; } } const isSuspense = (type) => type.__isSuspense; // Suspense exposes a component-like API, and is treated like a component // in the compiler, but internally it's a special built-in type that hooks // directly into the renderer. const SuspenseImpl = { name: 'Suspense', // In order to make Suspense tree-shakable, we need to avoid importing it // directly in the renderer. The renderer checks for the __isSuspense flag // on a vnode's type and calls the `process` method, passing in renderer // internals. __isSuspense: true, process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, // platform-specific impl passed from renderer rendererInternals) { if (n1 == null) { mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals); } else { patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, rendererInternals); } }, hydrate: hydrateSuspense, create: createSuspenseBoundary, normalize: normalizeSuspenseChildren }; // Force-casted public typing for h and TSX props inference const Suspense = (SuspenseImpl ); function triggerEvent(vnode, name) { const eventListener = vnode.props && vnode.props[name]; if (isFunction(eventListener)) { eventListener(); } } function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) { const { p: patch, o: { createElement } } = rendererInternals; const hiddenContainer = createElement('div'); const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals)); // start mounting the content subtree in an off-dom container patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds); // now check if we have encountered any async deps if (suspense.deps > 0) { // has async // invoke @fallback event triggerEvent(vnode, 'onPending'); triggerEvent(vnode, 'onFallback'); // mount the fallback tree patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context isSVG, slotScopeIds); setActiveBranch(suspense, vnode.ssFallback); } else { // Suspense has no async deps. Just resolve. suspense.resolve(); } } function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) { const suspense = (n2.suspense = n1.suspense); suspense.vnode = n2; n2.el = n1.el; const newBranch = n2.ssContent; const newFallback = n2.ssFallback; const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense; if (pendingBranch) { suspense.pendingBranch = newBranch; if (isSameVNodeType(newBranch, pendingBranch)) { // same root type but content may have changed. patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized); if (suspense.deps <= 0) { suspense.resolve(); } else if (isInFallback) { patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context isSVG, slotScopeIds, optimized); setActiveBranch(suspense, newFallback); } } else { // toggled before pending tree is resolved suspense.pendingId++; if (isHydrating) { // if toggled before hydration is finished, the current DOM tree is // no longer valid. set it as the active branch so it will be unmounted // when resolved suspense.isHydrating = false; suspense.activeBranch = pendingBranch; } else { unmount(pendingBranch, parentComponent, suspense); } // increment pending ID. this is used to invalidate async callbacks // reset suspense state suspense.deps = 0; // discard effects from pending branch suspense.effects.length = 0; // discard previous container suspense.hiddenContainer = createElement('div'); if (isInFallback) { // already in fallback state patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized); if (suspense.deps <= 0) { suspense.resolve(); } else { patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context isSVG, slotScopeIds, optimized); setActiveBranch(suspense, newFallback); } } else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) { // toggled "back" to current active branch patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized); // force resolve suspense.resolve(true); } else { // switched to a 3rd branch patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized); if (suspense.deps <= 0) { suspense.resolve(); } } } } else { if (activeBranch && isSameVNodeType(newBranch, activeBranch)) { // root did not change, just normal patch patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG, slotScopeIds, optimized); setActiveBranch(suspense, newBranch); } else { // root node toggled // invoke @pending event triggerEvent(n2, 'onPending'); // mount pending branch in off-dom container suspense.pendingBranch = newBranch; suspense.pendingId++; patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG, slotScopeIds, optimized); if (suspense.deps <= 0) { // incoming branch has no async deps, resolve now. suspense.resolve(); } else { const { timeout, pendingId } = suspense; if (timeout > 0) { setTimeout(() => { if (suspense.pendingId === pendingId) { suspense.fallback(newFallback); } }, timeout); } else if (timeout === 0) { suspense.fallback(newFallback); } } } } } let hasWarned = false; function createSuspenseBoundary(vnode, parent, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals, isHydrating = false) { /* istanbul ignore if */ if ((process.env.NODE_ENV !== 'production') && !false && !hasWarned) { hasWarned = true; // @ts-ignore `console.info` cannot be null error console[console.info ? 'info' : 'log'](` is an experimental feature and its API will likely change.`); } const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals; const timeout = toNumber(vnode.props && vnode.props.timeout); const suspense = { vnode, parent, parentComponent, isSVG, container, hiddenContainer, anchor, deps: 0, pendingId: 0, timeout: typeof timeout === 'number' ? timeout : -1, activeBranch: null, pendingBranch: null, isInFallback: true, isHydrating, isUnmounted: false, effects: [], resolve(resume = false) { if ((process.env.NODE_ENV !== 'production')) { if (!resume && !suspense.pendingBranch) { throw new Error(`suspense.resolve() is called without a pending branch.`); } if (suspense.isUnmounted) { throw new Error(`suspense.resolve() is called on an already unmounted suspense boundary.`); } } const { vnode, activeBranch, pendingBranch, pendingId, effects, parentComponent, container } = suspense; if (suspense.isHydrating) { suspense.isHydrating = false; } else if (!resume) { const delayEnter = activeBranch && pendingBranch.transition && pendingBranch.transition.mode === 'out-in'; if (delayEnter) { activeBranch.transition.afterLeave = () => { if (pendingId === suspense.pendingId) { move(pendingBranch, container, anchor, 0 /* ENTER */); } }; } // this is initial anchor on mount let { anchor } = suspense; // unmount current active tree if (activeBranch) { // if the fallback tree was mounted, it may have been moved // as part of a parent suspense. get the latest anchor for insertion anchor = next(activeBranch); unmount(activeBranch, parentComponent, suspense, true); } if (!delayEnter) { // move content from off-dom container to actual container move(pendingBranch, container, anchor, 0 /* ENTER */); } } setActiveBranch(suspense, pendingBranch); suspense.pendingBranch = null; suspense.isInFallback = false; // flush buffered effects // check if there is a pending parent suspense let parent = suspense.parent; let hasUnresolvedAncestor = false; while (parent) { if (parent.pendingBranch) { // found a pending parent suspense, merge buffered post jobs // into that parent parent.effects.push(...effects); hasUnresolvedAncestor = true; break; } parent = parent.parent; } // no pending parent suspense, flush all jobs if (!hasUnresolvedAncestor) { queuePostFlushCb(effects); } suspense.effects = []; // invoke @resolve event triggerEvent(vnode, 'onResolve'); }, fallback(fallbackVNode) { if (!suspense.pendingBranch) { return; } const { vnode, activeBranch, parentComponent, container, isSVG } = suspense; // invoke @fallback event triggerEvent(vnode, 'onFallback'); const anchor = next(activeBranch); const mountFallback = () => { if (!suspense.isInFallback) { return; } // mount the fallback tree patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context isSVG, slotScopeIds, optimized); setActiveBranch(suspense, fallbackVNode); }; const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in'; if (delayEnter) { activeBranch.transition.afterLeave = mountFallback; } suspense.isInFallback = true; // unmount current active branch unmount(activeBranch, parentComponent, null, // no suspense so unmount hooks fire now true // shouldRemove ); if (!delayEnter) { mountFallback(); } }, move(container, anchor, type) { suspense.activeBranch && move(suspense.activeBranch, container, anchor, type); suspense.container = container; }, next() { return suspense.activeBranch && next(suspense.activeBranch); }, registerDep(instance, setupRenderEffect) { const isInPendingSuspense = !!suspense.pendingBranch; if (isInPendingSuspense) { suspense.deps++; } const hydratedEl = instance.vnode.el; instance .asyncDep.catch(err => { handleError(err, instance, 0 /* SETUP_FUNCTION */); }) .then(asyncSetupResult => { // retry when the setup() promise resolves. // component may have been unmounted before resolve. if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) { return; } // retry from this component instance.asyncResolved = true; const { vnode } = instance; if ((process.env.NODE_ENV !== 'production')) { pushWarningContext(vnode); } handleSetupResult(instance, asyncSetupResult, false); if (hydratedEl) { // vnode may have been replaced if an update happened before the // async dep is resolved. vnode.el = hydratedEl; } const placeholder = !hydratedEl && instance.subTree.el; setupRenderEffect(instance, vnode, // component may have been moved before resolve. // if this is not a hydration, instance.subTree will be the comment // placeholder. parentNode(hydratedEl || instance.subTree.el), // anchor will not be used if this is hydration, so only need to // consider the comment placeholder case. hydratedEl ? null : next(instance.subTree), suspense, isSVG, optimized); if (placeholder) { remove(placeholder); } updateHOCHostEl(instance, vnode.el); if ((process.env.NODE_ENV !== 'production')) { popWarningContext(); } // only decrease deps count if suspense is not already resolved if (isInPendingSuspense && --suspense.deps === 0) { suspense.resolve(); } }); }, unmount(parentSuspense, doRemove) { suspense.isUnmounted = true; if (suspense.activeBranch) { unmount(suspense.activeBranch, parentComponent, parentSuspense, doRemove); } if (suspense.pendingBranch) { unmount(suspense.pendingBranch, parentComponent, parentSuspense, doRemove); } } }; return suspense; } function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals, hydrateNode) { /* eslint-disable no-restricted-globals */ const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, node.parentNode, document.createElement('div'), null, isSVG, slotScopeIds, optimized, rendererInternals, true /* hydrating */)); // there are two possible scenarios for server-rendered suspense: // - success: ssr content should be fully resolved // - failure: ssr content should be the fallback branch. // however, on the client we don't really know if it has failed or not // attempt to hydrate the DOM assuming it has succeeded, but we still // need to construct a suspense boundary first const result = hydrateNode(node, (suspense.pendingBranch = vnode.ssContent), parentComponent, suspense, slotScopeIds, optimized); if (suspense.deps === 0) { suspense.resolve(); } return result; /* eslint-enable no-restricted-globals */ } function normalizeSuspenseChildren(vnode) { const { shapeFlag, children } = vnode; const isSlotChildren = shapeFlag & 32 /* SLOTS_CHILDREN */; vnode.ssContent = normalizeSuspenseSlot(isSlotChildren ? children.default : children); vnode.ssFallback = isSlotChildren ? normalizeSuspenseSlot(children.fallback) : createVNode(Comment); } function normalizeSuspenseSlot(s) { let block; if (isFunction(s)) { const isCompiledSlot = s._c; if (isCompiledSlot) { // disableTracking: false // allow block tracking for compiled slots // (see ./componentRenderContext.ts) s._d = false; openBlock(); } s = s(); if (isCompiledSlot) { s._d = true; block = currentBlock; closeBlock(); } } if (isArray(s)) { const singleChild = filterSingleRoot(s); if ((process.env.NODE_ENV !== 'production') && !singleChild) { warn$1(` slots expect a single root node.`); } s = singleChild; } s = normalizeVNode(s); if (block && !s.dynamicChildren) { s.dynamicChildren = block.filter(c => c !== s); } return s; } function queueEffectWithSuspense(fn, suspense) { if (suspense && suspense.pendingBranch) { if (isArray(fn)) { suspense.effects.push(...fn); } else { suspense.effects.push(fn); } } else { queuePostFlushCb(fn); } } function setActiveBranch(suspense, branch) { suspense.activeBranch = branch; const { vnode, parentComponent } = suspense; const el = (vnode.el = branch.el); // in case suspense is the root node of a component, // recursively update the HOC el if (parentComponent && parentComponent.subTree === vnode) { parentComponent.vnode.el = el; updateHOCHostEl(parentComponent, el); } } function provide(key, value) { if (!currentInstance) { if ((process.env.NODE_ENV !== 'production')) { warn$1(`provide() can only be used inside setup().`); } } else { let provides = currentInstance.provides; // by default an instance inherits its parent's provides object // but when it needs to provide values of its own, it creates its // own provides object using parent provides object as prototype. // this way in `inject` we can simply look up injections from direct // parent and let the prototype chain do the work. const parentProvides = currentInstance.parent && currentInstance.parent.provides; if (parentProvides === provides) { provides = currentInstance.provides = Object.create(parentProvides); } // TS doesn't allow symbol as index type provides[key] = value; } } function inject(key, defaultValue, treatDefaultAsFactory = false) { // fallback to `currentRenderingInstance` so that this can be called in // a functional component const instance = currentInstance || currentRenderingInstance; if (instance) { // #2400 // to support `app.use` plugins, // fallback to appContext's `provides` if the intance is at root const provides = instance.parent == null ? instance.vnode.appContext && instance.vnode.appContext.provides : instance.parent.provides; if (provides && key in provides) { // TS doesn't allow symbol as index type return provides[key]; } else if (arguments.length > 1) { return treatDefaultAsFactory && isFunction(defaultValue) ? defaultValue.call(instance.proxy) : defaultValue; } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`injection "${String(key)}" not found.`); } } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`inject() can only be used inside setup() or functional components.`); } } function useTransitionState() { const state = { isMounted: false, isLeaving: false, isUnmounting: false, leavingVNodes: new Map() }; onMounted(() => { state.isMounted = true; }); onBeforeUnmount(() => { state.isUnmounting = true; }); return state; } const TransitionHookValidator = [Function, Array]; const BaseTransitionImpl = { name: `BaseTransition`, props: { mode: String, appear: Boolean, persisted: Boolean, // enter onBeforeEnter: TransitionHookValidator, onEnter: TransitionHookValidator, onAfterEnter: TransitionHookValidator, onEnterCancelled: TransitionHookValidator, // leave onBeforeLeave: TransitionHookValidator, onLeave: TransitionHookValidator, onAfterLeave: TransitionHookValidator, onLeaveCancelled: TransitionHookValidator, // appear onBeforeAppear: TransitionHookValidator, onAppear: TransitionHookValidator, onAfterAppear: TransitionHookValidator, onAppearCancelled: TransitionHookValidator }, setup(props, { slots }) { const instance = getCurrentInstance(); const state = useTransitionState(); let prevTransitionKey; return () => { const children = slots.default && getTransitionRawChildren(slots.default(), true); if (!children || !children.length) { return; } // warn multiple elements if ((process.env.NODE_ENV !== 'production') && children.length > 1) { warn$1(' can only be used on a single element or component. Use ' + ' for lists.'); } // there's no need to track reactivity for these props so use the raw // props for a bit better perf const rawProps = toRaw(props); const { mode } = rawProps; // check mode if ((process.env.NODE_ENV !== 'production') && mode && !['in-out', 'out-in', 'default'].includes(mode)) { warn$1(`invalid mode: ${mode}`); } // at this point children has a guaranteed length of 1. const child = children[0]; if (state.isLeaving) { return emptyPlaceholder(child); } // in the case of , we need to // compare the type of the kept-alive children. const innerChild = getKeepAliveChild(child); if (!innerChild) { return emptyPlaceholder(child); } const enterHooks = resolveTransitionHooks(innerChild, rawProps, state, instance); setTransitionHooks(innerChild, enterHooks); const oldChild = instance.subTree; const oldInnerChild = oldChild && getKeepAliveChild(oldChild); let transitionKeyChanged = false; const { getTransitionKey } = innerChild.type; if (getTransitionKey) { const key = getTransitionKey(); if (prevTransitionKey === undefined) { prevTransitionKey = key; } else if (key !== prevTransitionKey) { prevTransitionKey = key; transitionKeyChanged = true; } } // handle mode if (oldInnerChild && oldInnerChild.type !== Comment$1 && (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)) { const leavingHooks = resolveTransitionHooks(oldInnerChild, rawProps, state, instance); // update old tree's hooks in case of dynamic transition setTransitionHooks(oldInnerChild, leavingHooks); // switching between different views if (mode === 'out-in') { state.isLeaving = true; // return placeholder node and queue update when leave finishes leavingHooks.afterLeave = () => { state.isLeaving = false; instance.update(); }; return emptyPlaceholder(child); } else if (mode === 'in-out' && innerChild.type !== Comment$1) { leavingHooks.delayLeave = (el, earlyRemove, delayedLeave) => { const leavingVNodesCache = getLeavingNodesForType(state, oldInnerChild); leavingVNodesCache[String(oldInnerChild.key)] = oldInnerChild; // early removal callback el._leaveCb = () => { earlyRemove(); el._leaveCb = undefined; delete enterHooks.delayedLeave; }; enterHooks.delayedLeave = delayedLeave; }; } } return child; }; } }; { BaseTransitionImpl.__isBuiltIn = true; } // export the public type for h/tsx inference // also to avoid inline import() in generated d.ts files const BaseTransition = BaseTransitionImpl; function getLeavingNodesForType(state, vnode) { const { leavingVNodes } = state; let leavingVNodesCache = leavingVNodes.get(vnode.type); if (!leavingVNodesCache) { leavingVNodesCache = Object.create(null); leavingVNodes.set(vnode.type, leavingVNodesCache); } return leavingVNodesCache; } // The transition hooks are attached to the vnode as vnode.transition // and will be called at appropriate timing in the renderer. function resolveTransitionHooks(vnode, props, state, instance) { const { appear, mode, persisted = false, onBeforeEnter, onEnter, onAfterEnter, onEnterCancelled, onBeforeLeave, onLeave, onAfterLeave, onLeaveCancelled, onBeforeAppear, onAppear, onAfterAppear, onAppearCancelled } = props; const key = String(vnode.key); const leavingVNodesCache = getLeavingNodesForType(state, vnode); const callHook = (hook, args) => { hook && callWithAsyncErrorHandling(hook, instance, 9 /* TRANSITION_HOOK */, args); }; const hooks = { mode, persisted, beforeEnter(el) { let hook = onBeforeEnter; if (!state.isMounted) { if (appear) { hook = onBeforeAppear || onBeforeEnter; } else { return; } } // for same element (v-show) if (el._leaveCb) { el._leaveCb(true /* cancelled */); } // for toggled element with same key (v-if) const leavingVNode = leavingVNodesCache[key]; if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el._leaveCb) { // force early removal (not cancelled) leavingVNode.el._leaveCb(); } callHook(hook, [el]); }, enter(el) { let hook = onEnter; let afterHook = onAfterEnter; let cancelHook = onEnterCancelled; if (!state.isMounted) { if (appear) { hook = onAppear || onEnter; afterHook = onAfterAppear || onAfterEnter; cancelHook = onAppearCancelled || onEnterCancelled; } else { return; } } let called = false; const done = (el._enterCb = (cancelled) => { if (called) return; called = true; if (cancelled) { callHook(cancelHook, [el]); } else { callHook(afterHook, [el]); } if (hooks.delayedLeave) { hooks.delayedLeave(); } el._enterCb = undefined; }); if (hook) { hook(el, done); if (hook.length <= 1) { done(); } } else { done(); } }, leave(el, remove) { const key = String(vnode.key); if (el._enterCb) { el._enterCb(true /* cancelled */); } if (state.isUnmounting) { return remove(); } callHook(onBeforeLeave, [el]); let called = false; const done = (el._leaveCb = (cancelled) => { if (called) return; called = true; remove(); if (cancelled) { callHook(onLeaveCancelled, [el]); } else { callHook(onAfterLeave, [el]); } el._leaveCb = undefined; if (leavingVNodesCache[key] === vnode) { delete leavingVNodesCache[key]; } }); leavingVNodesCache[key] = vnode; if (onLeave) { onLeave(el, done); if (onLeave.length <= 1) { done(); } } else { done(); } }, clone(vnode) { return resolveTransitionHooks(vnode, props, state, instance); } }; return hooks; } // the placeholder really only handles one special case: KeepAlive // in the case of a KeepAlive in a leave phase we need to return a KeepAlive // placeholder with empty content to avoid the KeepAlive instance from being // unmounted. function emptyPlaceholder(vnode) { if (isKeepAlive(vnode)) { vnode = cloneVNode(vnode); vnode.children = null; return vnode; } } function getKeepAliveChild(vnode) { return isKeepAlive(vnode) ? vnode.children ? vnode.children[0] : undefined : vnode; } function setTransitionHooks(vnode, hooks) { if (vnode.shapeFlag & 6 /* COMPONENT */ && vnode.component) { setTransitionHooks(vnode.component.subTree, hooks); } else if (vnode.shapeFlag & 128 /* SUSPENSE */) { vnode.ssContent.transition = hooks.clone(vnode.ssContent); vnode.ssFallback.transition = hooks.clone(vnode.ssFallback); } else { vnode.transition = hooks; } } function getTransitionRawChildren(children, keepComment = false) { let ret = []; let keyedFragmentCount = 0; for (let i = 0; i < children.length; i++) { const child = children[i]; // handle fragment children case, e.g. v-for if (child.type === Fragment) { if (child.patchFlag & 128 /* KEYED_FRAGMENT */) keyedFragmentCount++; ret = ret.concat(getTransitionRawChildren(child.children, keepComment)); } // comment placeholders should be skipped, e.g. v-if else if (keepComment || child.type !== Comment$1) { ret.push(child); } } // #1126 if a transition children list contains multiple sub fragments, these // fragments will be merged into a flat children array. Since each v-for // fragment may contain different static bindings inside, we need to de-op // these children to force full diffs to ensure correct behavior. if (keyedFragmentCount > 1) { for (let i = 0; i < ret.length; i++) { ret[i].patchFlag = -2 /* BAIL */; } } return ret; } // implementation, close to no-op function defineComponent(options) { return isFunction(options) ? { setup: options, name: options.name } : options; } const isAsyncWrapper = (i) => !!i.type.__asyncLoader; function defineAsyncComponent(source) { if (isFunction(source)) { source = { loader: source }; } const { loader, loadingComponent, errorComponent, delay = 200, timeout, // undefined = never times out suspensible = true, onError: userOnError } = source; let pendingRequest = null; let resolvedComp; let retries = 0; const retry = () => { retries++; pendingRequest = null; return load(); }; const load = () => { let thisRequest; return (pendingRequest || (thisRequest = pendingRequest = loader() .catch(err => { err = err instanceof Error ? err : new Error(String(err)); if (userOnError) { return new Promise((resolve, reject) => { const userRetry = () => resolve(retry()); const userFail = () => reject(err); userOnError(err, userRetry, userFail, retries + 1); }); } else { throw err; } }) .then((comp) => { if (thisRequest !== pendingRequest && pendingRequest) { return pendingRequest; } if ((process.env.NODE_ENV !== 'production') && !comp) { warn$1(`Async component loader resolved to undefined. ` + `If you are using retry(), make sure to return its return value.`); } // interop module default if (comp && (comp.__esModule || comp[Symbol.toStringTag] === 'Module')) { comp = comp.default; } if ((process.env.NODE_ENV !== 'production') && comp && !isObject(comp) && !isFunction(comp)) { throw new Error(`Invalid async component load result: ${comp}`); } resolvedComp = comp; return comp; }))); }; return defineComponent({ name: 'AsyncComponentWrapper', __asyncLoader: load, get __asyncResolved() { return resolvedComp; }, setup() { const instance = currentInstance; // already resolved if (resolvedComp) { return () => createInnerComp(resolvedComp, instance); } const onError = (err) => { pendingRequest = null; handleError(err, instance, 13 /* ASYNC_COMPONENT_LOADER */, !errorComponent /* do not throw in dev if user provided error component */); }; // suspense-controlled or SSR. if ((suspensible && instance.suspense) || (false )) { return load() .then(comp => { return () => createInnerComp(comp, instance); }) .catch(err => { onError(err); return () => errorComponent ? createVNode(errorComponent, { error: err }) : null; }); } const loaded = ref(false); const error = ref(); const delayed = ref(!!delay); if (delay) { setTimeout(() => { delayed.value = false; }, delay); } if (timeout != null) { setTimeout(() => { if (!loaded.value && !error.value) { const err = new Error(`Async component timed out after ${timeout}ms.`); onError(err); error.value = err; } }, timeout); } load() .then(() => { loaded.value = true; if (instance.parent && isKeepAlive(instance.parent.vnode)) { // parent is keep-alive, force update so the loaded component's // name is taken into account queueJob(instance.parent.update); } }) .catch(err => { onError(err); error.value = err; }); return () => { if (loaded.value && resolvedComp) { return createInnerComp(resolvedComp, instance); } else if (error.value && errorComponent) { return createVNode(errorComponent, { error: error.value }); } else if (loadingComponent && !delayed.value) { return createVNode(loadingComponent); } }; } }); } function createInnerComp(comp, { vnode: { ref, props, children } }) { const vnode = createVNode(comp, props, children); // ensure inner component inherits the async wrapper's ref owner vnode.ref = ref; return vnode; } const isKeepAlive = (vnode) => vnode.type.__isKeepAlive; class Cache { constructor(max) { this.max = max; this._cache = new Map(); this._keys = new Set(); this._max = parseInt(max, 10); } get(key) { const { _cache, _keys, _max } = this; const cached = _cache.get(key); if (cached) { // make this key the freshest _keys.delete(key); _keys.add(key); } else { _keys.add(key); // prune oldest entry if (_max && _keys.size > _max) { const staleKey = _keys.values().next().value; this.pruneCacheEntry(_cache.get(staleKey)); this.delete(staleKey); } } return cached; } set(key, value) { this._cache.set(key, value); } delete(key) { this._cache.delete(key); this._keys.delete(key); } forEach(fn, thisArg) { this._cache.forEach(fn.bind(thisArg)); } } const KeepAliveImpl = { name: `KeepAlive`, // Marker for special handling inside the renderer. We are not using a === // check directly on KeepAlive in the renderer, because importing it directly // would prevent it from being tree-shaken. __isKeepAlive: true, props: { include: [String, RegExp, Array], exclude: [String, RegExp, Array], max: [String, Number], matchBy: { type: String, default: 'name' }, cache: Object }, setup(props, { slots }) { const instance = getCurrentInstance(); // KeepAlive communicates with the instantiated renderer via the // ctx where the renderer passes in its internals, // and the KeepAlive instance exposes activate/deactivate implementations. // The whole point of this is to avoid importing KeepAlive directly in the // renderer to facilitate tree-shaking. const sharedContext = instance.ctx; // if the internal renderer is not registered, it indicates that this is server-side rendering, // for KeepAlive, we just need to render its children if (!sharedContext.renderer) { return () => slots.default && slots.default()[0]; // fixed by xxxxxx } if ((process.env.NODE_ENV !== 'production') && props.cache && props.max) { // fixed by xxxxxx warn$1('The `max` prop will be ignored if you provide a custom caching strategy'); } const cache = props.cache || new Cache(props.max); cache.pruneCacheEntry = pruneCacheEntry; let current = null; function pruneCacheEntry(cached) { if (!current || cached.type !== current.type || (props.matchBy === 'key' && cached.key !== current.key)) { unmount(cached); } else if (current) { // current active instance should no longer be kept-alive. // we can't unmount it now but it might be later, so reset its flag now. resetShapeFlag(current); } } const parentSuspense = instance.suspense; const { renderer: { p: patch, m: move, um: _unmount, o: { createElement } } } = sharedContext; const storageContainer = createElement('div'); sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => { const instance = vnode.component; if (instance.ba) { const currentState = instance.isDeactivated; instance.isDeactivated = false; invokeArrayFns(instance.ba); instance.isDeactivated = currentState; } move(vnode, container, anchor, 0 /* ENTER */, parentSuspense); // in case props have changed patch(instance.vnode, vnode, container, anchor, instance, parentSuspense, isSVG, vnode.slotScopeIds, optimized); queuePostRenderEffect(() => { instance.isDeactivated = false; if (instance.a) { invokeArrayFns(instance.a); } const vnodeHook = vnode.props && vnode.props.onVnodeMounted; if (vnodeHook) { invokeVNodeHook(vnodeHook, instance.parent, vnode); } }, parentSuspense); if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { // Update components tree devtoolsComponentAdded(instance); } }; sharedContext.deactivate = (vnode) => { const instance = vnode.component; if (instance.bda) { invokeKeepAliveHooks(instance.bda); } move(vnode, storageContainer, null, 1 /* LEAVE */, parentSuspense); queuePostRenderEffect(() => { if (instance.bda) { resetHookState(instance.bda); } if (instance.da) { invokeArrayFns(instance.da); } const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted; if (vnodeHook) { invokeVNodeHook(vnodeHook, instance.parent, vnode); } instance.isDeactivated = true; }, parentSuspense); if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { // Update components tree devtoolsComponentAdded(instance); } }; function unmount(vnode) { // reset the shapeFlag so it can be properly unmounted resetShapeFlag(vnode); _unmount(vnode, instance, parentSuspense); } function pruneCache(filter) { cache.forEach((vnode, key) => { const name = getMatchingName(vnode, props.matchBy); if (name && (!filter || !filter(name))) { cache.delete(key); pruneCacheEntry(vnode); } }); } // prune cache on include/exclude prop change watch(() => [props.include, props.exclude, props.matchBy], ([include, exclude]) => { include && pruneCache(name => matches(include, name)); exclude && pruneCache(name => !matches(exclude, name)); }, // prune post-render after `current` has been updated { flush: 'post', deep: true }); // cache sub tree after render let pendingCacheKey = null; const cacheSubtree = () => { // fix #1621, the pendingCacheKey could be 0 if (pendingCacheKey != null) { cache.set(pendingCacheKey, getInnerChild(instance.subTree)); } }; onMounted(cacheSubtree); onUpdated(cacheSubtree); onBeforeUnmount(() => { cache.forEach((cached, key) => { cache.delete(key); pruneCacheEntry(cached); const { subTree, suspense } = instance; const vnode = getInnerChild(subTree); if (cached.type === vnode.type && (props.matchBy !== 'key' || cached.key === vnode.key)) { // invoke its beforeDeactivate hook here if (vnode.component.bda) { invokeArrayFns(vnode.component.bda); } // current instance will be unmounted as part of keep-alive's unmount resetShapeFlag(vnode); // but invoke its deactivated hook here const da = vnode.component.da; da && queuePostRenderEffect(da, suspense); return; } }); }); return () => { pendingCacheKey = null; if (!slots.default) { return null; } const children = slots.default(); const rawVNode = children[0]; if (children.length > 1) { if ((process.env.NODE_ENV !== 'production')) { warn$1(`KeepAlive should contain exactly one component child.`); } current = null; return children; } else if (!isVNode(rawVNode) || (!(rawVNode.shapeFlag & 4 /* STATEFUL_COMPONENT */) && !isSuspense(rawVNode.type))) { current = null; return rawVNode; } let vnode = getInnerChild(rawVNode); const comp = vnode.type; const name = getMatchingName(vnode, props.matchBy); const { include, exclude } = props; if ((include && (!name || !matches(include, name))) || (exclude && name && matches(exclude, name))) { current = vnode; return rawVNode; } const key = vnode.key == null ? comp : vnode.key; const cachedVNode = cache.get(key); // clone vnode if it's reused because we are going to mutate it if (vnode.el) { vnode = cloneVNode(vnode); if (isSuspense(rawVNode.type)) { rawVNode.ssContent = vnode; } } // #1513 it's possible for the returned vnode to be cloned due to attr // fallthrough or scopeId, so the vnode here may not be the final vnode // that is mounted. Instead of caching it directly, we store the pending // key and cache `instance.subTree` (the normalized vnode) in // beforeMount/beforeUpdate hooks. pendingCacheKey = key; if (cachedVNode) { // copy over mounted state vnode.el = cachedVNode.el; vnode.component = cachedVNode.component; if (vnode.transition) { // recursively update transition hooks on subTree setTransitionHooks(vnode, vnode.transition); } // avoid vnode being mounted as fresh vnode.shapeFlag |= 512 /* COMPONENT_KEPT_ALIVE */; } // avoid vnode being unmounted vnode.shapeFlag |= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */; current = vnode; return isSuspense(rawVNode.type) ? rawVNode : vnode; }; } }; { KeepAliveImpl.__isBuildIn = true; } // export the public type for h/tsx inference // also to avoid inline import() in generated d.ts files const KeepAlive = KeepAliveImpl; function matches(pattern, name) { if (isArray(pattern)) { return pattern.some((p) => matches(p, name)); } else if (isString(pattern)) { return pattern.split(',').indexOf(name) > -1; } else if (pattern.test) { return pattern.test(name); } /* istanbul ignore next */ return false; } function onBeforeActivate(hook, target) { registerKeepAliveHook(hook, "ba" /* BEFORE_ACTIVATE */, target); } function onActivated(hook, target) { registerKeepAliveHook(hook, "a" /* ACTIVATED */, target); } function onBeforeDeactivate(hook, target) { registerKeepAliveHook(hook, "bda" /* BEFORE_DEACTIVATE */, target); } function onDeactivated(hook, target) { registerKeepAliveHook(hook, "da" /* DEACTIVATED */, target); } function registerKeepAliveHook(hook, type, target = currentInstance) { // cache the deactivate branch check wrapper for injected hooks so the same // hook can be properly deduped by the scheduler. "__wdc" stands for "with // deactivation check". const wrappedHook = hook.__wdc || (hook.__wdc = () => { // only fire the hook if the target instance is NOT in a deactivated branch. let current = target; while (current) { if (current.isDeactivated) { return; } current = current.parent; } hook(); }); wrappedHook.__called = false; injectHook(type, wrappedHook, target); // In addition to registering it on the target instance, we walk up the parent // chain and register it on all ancestor instances that are keep-alive roots. // This avoids the need to walk the entire component tree when invoking these // hooks, and more importantly, avoids the need to track child components in // arrays. if (target) { let current = target.parent; while (current && current.parent) { if (isKeepAlive(current.parent.vnode)) { injectToKeepAliveRoot(wrappedHook, type, target, current); } current = current.parent; } } } function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) { // injectHook wraps the original for error handling, so make sure to remove // the wrapped version. const injected = injectHook(type, hook, keepAliveRoot, true /* prepend */); onUnmounted(() => { remove(keepAliveRoot[type], injected); }, target); } function resetShapeFlag(vnode) { let shapeFlag = vnode.shapeFlag; if (shapeFlag & 256 /* COMPONENT_SHOULD_KEEP_ALIVE */) { shapeFlag -= 256 /* COMPONENT_SHOULD_KEEP_ALIVE */; } if (shapeFlag & 512 /* COMPONENT_KEPT_ALIVE */) { shapeFlag -= 512 /* COMPONENT_KEPT_ALIVE */; } vnode.shapeFlag = shapeFlag; } function getInnerChild(vnode) { return isSuspense(vnode.type) ? vnode.ssContent : vnode; } function getMatchingName(vnode, matchBy) { if (matchBy === 'name') { const comp = vnode.type; return getComponentName(isAsyncWrapper(vnode) ? comp.__asyncResolved || {} : comp); } return String(vnode.key); } function invokeKeepAliveHooks(hooks) { for (let i = 0; i < hooks.length; i++) { const hook = hooks[i]; if (!hook.__called) { hook(); hook.__called = true; } } } function resetHookState(hooks) { hooks.forEach((hook) => (hook.__called = false)); } function injectHook(type, hook, target = currentInstance, prepend = false) { if (target) { // fixed by xxxxxx if (isRootHook(type)) { target = target.root; } const hooks = target[type] || (target[type] = []); // cache the error handling wrapper for injected hooks so the same hook // can be properly deduped by the scheduler. "__weh" stands for "with error // handling". const wrappedHook = hook.__weh || (hook.__weh = (...args) => { if (target.isUnmounted) { return; } // disable tracking inside all lifecycle hooks // since they can potentially be called inside effects. pauseTracking(); // Set currentInstance during hook invocation. // This assumes the hook does not synchronously trigger other hooks, which // can only be false when the user does something really funky. setCurrentInstance(target); // fixed by xxxxxx const res = callWithAsyncErrorHandling(hook, target, type, args); unsetCurrentInstance(); resetTracking(); return res; }); if (prepend) { hooks.unshift(wrappedHook); } else { hooks.push(wrappedHook); } return wrappedHook; } else if ((process.env.NODE_ENV !== 'production')) { const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, '')); warn$1(`${apiName} is called when there is no active component instance to be ` + `associated with. ` + `Lifecycle injection APIs can only be used during execution of setup().` + (` If you are using async setup(), make sure to register lifecycle ` + `hooks before the first await statement.` )); } } const createHook = (lifecycle) => (hook, target = currentInstance) => // post-create lifecycle registrations are noops during SSR (except for serverPrefetch) (!isInSSRComponentSetup || lifecycle === "sp" /* SERVER_PREFETCH */) && injectHook(lifecycle, hook, target); const onBeforeMount = createHook("bm" /* BEFORE_MOUNT */); const onMounted = createHook("m" /* MOUNTED */); const onBeforeUpdate = createHook("bu" /* BEFORE_UPDATE */); const onUpdated = createHook("u" /* UPDATED */); const onBeforeUnmount = createHook("bum" /* BEFORE_UNMOUNT */); const onUnmounted = createHook("um" /* UNMOUNTED */); const onServerPrefetch = createHook("sp" /* SERVER_PREFETCH */); const onRenderTriggered = createHook("rtg" /* RENDER_TRIGGERED */); const onRenderTracked = createHook("rtc" /* RENDER_TRACKED */); function onErrorCaptured(hook, target = currentInstance) { injectHook("ec" /* ERROR_CAPTURED */, hook, target); } function deepMergeData(to, from) { for (const key in from) { const toVal = to[key]; const fromVal = from[key]; if (key in to && isPlainObject(toVal) && isPlainObject(fromVal)) { (process.env.NODE_ENV !== 'production') && warnDeprecation("OPTIONS_DATA_MERGE" /* OPTIONS_DATA_MERGE */, null, key); deepMergeData(toVal, fromVal); } else { to[key] = fromVal; } } return to; } function createDuplicateChecker() { const cache = Object.create(null); return (type, key) => { if (cache[key]) { warn$1(`${type} property "${key}" is already defined in ${cache[key]}.`); } else { cache[key] = type; } }; } let shouldCacheAccess = true; function applyOptions(instance) { const options = resolveMergedOptions(instance); const publicThis = instance.proxy; const ctx = instance.ctx; // do not cache property access on public proxy during state initialization shouldCacheAccess = false; // call beforeCreate first before accessing other options since // the hook may mutate resolved options (#2791) if (options.beforeCreate) { callHook(options.beforeCreate, instance, "bc" /* BEFORE_CREATE */); } const { // state data: dataOptions, computed: computedOptions, methods, watch: watchOptions, provide: provideOptions, inject: injectOptions, // lifecycle created, beforeMount, mounted, beforeUpdate, updated, activated, deactivated, beforeDestroy, beforeUnmount, destroyed, unmounted, render, renderTracked, renderTriggered, errorCaptured, serverPrefetch, // public API expose, inheritAttrs, // assets components, directives, filters } = options; const checkDuplicateProperties = (process.env.NODE_ENV !== 'production') ? createDuplicateChecker() : null; if ((process.env.NODE_ENV !== 'production')) { const [propsOptions] = instance.propsOptions; if (propsOptions) { for (const key in propsOptions) { checkDuplicateProperties("Props" /* PROPS */, key); } } } // options initialization order (to be consistent with Vue 2): // - props (already done outside of this function) // - inject // - methods // - data (deferred since it relies on `this` access) // - computed // - watch (deferred since it relies on `this` access) if (injectOptions) { resolveInjections(injectOptions, ctx, checkDuplicateProperties, instance.appContext.config.unwrapInjectedRef); } if (methods) { for (const key in methods) { const methodHandler = methods[key]; if (isFunction(methodHandler)) { // In dev mode, we use the `createRenderContext` function to define // methods to the proxy target, and those are read-only but // reconfigurable, so it needs to be redefined here if ((process.env.NODE_ENV !== 'production')) { Object.defineProperty(ctx, key, { value: methodHandler.bind(publicThis), configurable: true, enumerable: true, writable: true }); } else { ctx[key] = methodHandler.bind(publicThis); } if ((process.env.NODE_ENV !== 'production')) { checkDuplicateProperties("Methods" /* METHODS */, key); } } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` + `Did you reference the function correctly?`); } } } if (dataOptions) { if ((process.env.NODE_ENV !== 'production') && !isFunction(dataOptions)) { warn$1(`The data option must be a function. ` + `Plain object usage is no longer supported.`); } const data = dataOptions.call(publicThis, publicThis); if ((process.env.NODE_ENV !== 'production') && isPromise(data)) { warn$1(`data() returned a Promise - note data() cannot be async; If you ` + `intend to perform data fetching before component renders, use ` + `async setup() + .`); } if (!isObject(data)) { (process.env.NODE_ENV !== 'production') && warn$1(`data() should return an object.`); } else { instance.data = reactive(data); if ((process.env.NODE_ENV !== 'production')) { for (const key in data) { checkDuplicateProperties("Data" /* DATA */, key); // expose data on ctx during dev if (key[0] !== '$' && key[0] !== '_') { Object.defineProperty(ctx, key, { configurable: true, enumerable: true, get: () => data[key], set: NOOP }); } } } } } // state initialization complete at this point - start caching access shouldCacheAccess = true; if (computedOptions) { for (const key in computedOptions) { const opt = computedOptions[key]; const get = isFunction(opt) ? opt.bind(publicThis, publicThis) : isFunction(opt.get) ? opt.get.bind(publicThis, publicThis) : NOOP; if ((process.env.NODE_ENV !== 'production') && get === NOOP) { warn$1(`Computed property "${key}" has no getter.`); } const set = !isFunction(opt) && isFunction(opt.set) ? opt.set.bind(publicThis) : (process.env.NODE_ENV !== 'production') ? () => { warn$1(`Write operation failed: computed property "${key}" is readonly.`); } : NOOP; const c = computed({ get, set }); Object.defineProperty(ctx, key, { enumerable: true, configurable: true, get: () => c.value, set: v => (c.value = v) }); if ((process.env.NODE_ENV !== 'production')) { checkDuplicateProperties("Computed" /* COMPUTED */, key); } } } if (watchOptions) { for (const key in watchOptions) { createWatcher(watchOptions[key], ctx, publicThis, key); } } if (provideOptions) { const provides = isFunction(provideOptions) ? provideOptions.call(publicThis) : provideOptions; Reflect.ownKeys(provides).forEach(key => { provide(key, provides[key]); }); } if (created) { callHook(created, instance, "c" /* CREATED */); } function registerLifecycleHook(register, hook) { if (isArray(hook)) { hook.forEach(_hook => register(_hook.bind(publicThis))); } else if (hook) { register(hook.bind(publicThis)); } } registerLifecycleHook(onBeforeMount, beforeMount); registerLifecycleHook(onMounted, mounted); registerLifecycleHook(onBeforeUpdate, beforeUpdate); registerLifecycleHook(onUpdated, updated); registerLifecycleHook(onActivated, activated); registerLifecycleHook(onDeactivated, deactivated); registerLifecycleHook(onErrorCaptured, errorCaptured); registerLifecycleHook(onRenderTracked, renderTracked); registerLifecycleHook(onRenderTriggered, renderTriggered); registerLifecycleHook(onBeforeUnmount, beforeUnmount); registerLifecycleHook(onUnmounted, unmounted); registerLifecycleHook(onServerPrefetch, serverPrefetch); { if (beforeDestroy && softAssertCompatEnabled("OPTIONS_BEFORE_DESTROY" /* OPTIONS_BEFORE_DESTROY */, instance)) { registerLifecycleHook(onBeforeUnmount, beforeDestroy); } if (destroyed && softAssertCompatEnabled("OPTIONS_DESTROYED" /* OPTIONS_DESTROYED */, instance)) { registerLifecycleHook(onUnmounted, destroyed); } } if (isArray(expose)) { if (expose.length) { const exposed = instance.exposed || (instance.exposed = {}); expose.forEach(key => { Object.defineProperty(exposed, key, { get: () => publicThis[key], set: val => (publicThis[key] = val) }); }); } else if (!instance.exposed) { instance.exposed = {}; } } // options that are handled when creating the instance but also need to be // applied from mixins if (render && instance.render === NOOP) { instance.render = render; } if (inheritAttrs != null) { instance.inheritAttrs = inheritAttrs; } // asset options. if (components) instance.components = components; if (directives) instance.directives = directives; if (filters && isCompatEnabled("FILTERS" /* FILTERS */, instance)) { instance.filters = filters; } // fixed by xxxxxx const customApplyOptions = instance.appContext.config.globalProperties .$applyOptions; if (customApplyOptions) { customApplyOptions(options, instance, publicThis); } } function resolveInjections(injectOptions, ctx, checkDuplicateProperties = NOOP, unwrapRef = false) { if (isArray(injectOptions)) { injectOptions = normalizeInject(injectOptions); } for (const key in injectOptions) { const opt = injectOptions[key]; let injected; if (isObject(opt)) { if ('default' in opt) { injected = inject(opt.from || key, opt.default, true /* treat default function as factory */); } else { injected = inject(opt.from || key); } } else { injected = inject(opt); } if (isRef(injected)) { // TODO remove the check in 3.3 if (unwrapRef) { Object.defineProperty(ctx, key, { enumerable: true, configurable: true, get: () => injected.value, set: v => (injected.value = v) }); } else { if ((process.env.NODE_ENV !== 'production')) { warn$1(`injected property "${key}" is a ref and will be auto-unwrapped ` + `and no longer needs \`.value\` in the next minor release. ` + `To opt-in to the new behavior now, ` + `set \`app.config.unwrapInjectedRef = true\` (this config is ` + `temporary and will not be needed in the future.)`); } ctx[key] = injected; } } else { ctx[key] = injected; } if ((process.env.NODE_ENV !== 'production')) { checkDuplicateProperties("Inject" /* INJECT */, key); } } } function callHook(hook, instance, type) { callWithAsyncErrorHandling(isArray(hook) ? hook.map(h => h.bind(instance.proxy)) : hook.bind(instance.proxy), instance, type); } function createWatcher(raw, ctx, publicThis, key) { const getter = key.includes('.') ? createPathGetter(publicThis, key) : () => publicThis[key]; if (isString(raw)) { const handler = ctx[raw]; if (isFunction(handler)) { watch(getter, handler); } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Invalid watch handler specified by key "${raw}"`, handler); } } else if (isFunction(raw)) { watch(getter, raw.bind(publicThis)); } else if (isObject(raw)) { if (isArray(raw)) { raw.forEach(r => createWatcher(r, ctx, publicThis, key)); } else { const handler = isFunction(raw.handler) ? raw.handler.bind(publicThis) : ctx[raw.handler]; if (isFunction(handler)) { watch(getter, handler, raw); } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Invalid watch handler specified by key "${raw.handler}"`, handler); } } } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Invalid watch option: "${key}"`, raw); } } /** * Resolve merged options and cache it on the component. * This is done only once per-component since the merging does not involve * instances. */ function resolveMergedOptions(instance) { const base = instance.type; const { mixins, extends: extendsOptions } = base; const { mixins: globalMixins, optionsCache: cache, config: { optionMergeStrategies } } = instance.appContext; const cached = cache.get(base); let resolved; if (cached) { resolved = cached; } else if (!globalMixins.length && !mixins && !extendsOptions) { if (isCompatEnabled("PRIVATE_APIS" /* PRIVATE_APIS */, instance)) { resolved = extend({}, base); resolved.parent = instance.parent && instance.parent.proxy; resolved.propsData = instance.vnode.props; } else { resolved = base; } } else { resolved = {}; if (globalMixins.length) { globalMixins.forEach(m => mergeOptions(resolved, m, optionMergeStrategies, true)); } mergeOptions(resolved, base, optionMergeStrategies); } cache.set(base, resolved); return resolved; } function mergeOptions(to, from, strats, asMixin = false) { if (isFunction(from)) { from = from.options; } const { mixins, extends: extendsOptions } = from; if (extendsOptions) { mergeOptions(to, extendsOptions, strats, true); } if (mixins) { mixins.forEach((m) => mergeOptions(to, m, strats, true)); } for (const key in from) { if (asMixin && key === 'expose') { (process.env.NODE_ENV !== 'production') && warn$1(`"expose" option is ignored when declared in mixins or extends. ` + `It should only be declared in the base component itself.`); } else { const strat = internalOptionMergeStrats[key] || (strats && strats[key]); to[key] = strat ? strat(to[key], from[key]) : from[key]; } } return to; } const internalOptionMergeStrats = { data: mergeDataFn, props: mergeObjectOptions, emits: mergeObjectOptions, // objects methods: mergeObjectOptions, computed: mergeObjectOptions, // lifecycle beforeCreate: mergeAsArray, created: mergeAsArray, beforeMount: mergeAsArray, mounted: mergeAsArray, beforeUpdate: mergeAsArray, updated: mergeAsArray, beforeDestroy: mergeAsArray, destroyed: mergeAsArray, activated: mergeAsArray, deactivated: mergeAsArray, errorCaptured: mergeAsArray, serverPrefetch: mergeAsArray, // assets components: mergeObjectOptions, directives: mergeObjectOptions, // watch watch: mergeWatchOptions, // provide / inject provide: mergeDataFn, inject: mergeInject }; { internalOptionMergeStrats.filters = mergeObjectOptions; } function mergeDataFn(to, from) { if (!from) { return to; } if (!to) { return from; } return function mergedDataFn() { return (isCompatEnabled("OPTIONS_DATA_MERGE" /* OPTIONS_DATA_MERGE */, null) ? deepMergeData : extend)(isFunction(to) ? to.call(this, this) : to, isFunction(from) ? from.call(this, this) : from); }; } function mergeInject(to, from) { return mergeObjectOptions(normalizeInject(to), normalizeInject(from)); } function normalizeInject(raw) { if (isArray(raw)) { const res = {}; for (let i = 0; i < raw.length; i++) { res[raw[i]] = raw[i]; } return res; } return raw; } function mergeAsArray(to, from) { return to ? [...new Set([].concat(to, from))] : from; } function mergeObjectOptions(to, from) { return to ? extend(extend(Object.create(null), to), from) : from; } function mergeWatchOptions(to, from) { if (!to) return from; if (!from) return to; const merged = extend(Object.create(null), to); for (const key in from) { merged[key] = mergeAsArray(to[key], from[key]); } return merged; } function createPropsDefaultThis(instance, rawProps, propKey) { return new Proxy({}, { get(_, key) { (process.env.NODE_ENV !== 'production') && warnDeprecation("PROPS_DEFAULT_THIS" /* PROPS_DEFAULT_THIS */, null, propKey); // $options if (key === '$options') { return resolveMergedOptions(instance); } // props if (key in rawProps) { return rawProps[key]; } // injections const injections = instance.type.inject; if (injections) { if (isArray(injections)) { if (injections.includes(key)) { return inject(key); } } else if (key in injections) { return inject(key); } } } }); } function shouldSkipAttr(key, instance) { if (key === 'is') { return true; } if ((key === 'class' || key === 'style') && isCompatEnabled("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance)) { return true; } if (isOn(key) && isCompatEnabled("INSTANCE_LISTENERS" /* INSTANCE_LISTENERS */, instance)) { return true; } // vue-router if (key.startsWith('routerView') || key === 'registerRouteInstance') { return true; } return false; } function initProps(instance, rawProps, isStateful, // result of bitwise flag comparison isSSR = false) { const props = {}; const attrs = {}; def(attrs, InternalObjectKey, 1); instance.propsDefaults = Object.create(null); setFullProps(instance, rawProps, props, attrs); // ensure all declared prop keys are present for (const key in instance.propsOptions[0]) { if (!(key in props)) { props[key] = undefined; } } // validation if ((process.env.NODE_ENV !== 'production')) { validateProps(rawProps || {}, props, instance); } if (isStateful) { // stateful instance.props = isSSR ? props : shallowReactive(props); } else { if (!instance.type.props) { // functional w/ optional props, props === attrs instance.props = attrs; } else { // functional w/ declared props instance.props = props; } } instance.attrs = attrs; } function updateProps(instance, rawProps, rawPrevProps, optimized) { const { props, attrs, vnode: { patchFlag } } = instance; const rawCurrentProps = toRaw(props); const [options] = instance.propsOptions; let hasAttrsChanged = false; if ( // always force full diff in dev // - #1942 if hmr is enabled with sfc component // - vite#872 non-sfc component used by sfc component !((process.env.NODE_ENV !== 'production') && (instance.type.__hmrId || (instance.parent && instance.parent.type.__hmrId))) && (optimized || patchFlag > 0) && !(patchFlag & 16 /* FULL_PROPS */)) { if (patchFlag & 8 /* PROPS */) { // Compiler-generated props & no keys change, just set the updated // the props. const propsToUpdate = instance.vnode.dynamicProps; for (let i = 0; i < propsToUpdate.length; i++) { let key = propsToUpdate[i]; // PROPS flag guarantees rawProps to be non-null const value = rawProps[key]; if (options) { // attr / props separation was done on init and will be consistent // in this code path, so just check if attrs have it. if (hasOwn(attrs, key)) { if (value !== attrs[key]) { attrs[key] = value; hasAttrsChanged = true; } } else { const camelizedKey = camelize(key); props[camelizedKey] = resolvePropValue(options, rawCurrentProps, camelizedKey, value, instance, false /* isAbsent */); } } else { { if (isOn(key) && key.endsWith('Native')) { key = key.slice(0, -6); // remove Native postfix } else if (shouldSkipAttr(key, instance)) { continue; } } if (value !== attrs[key]) { attrs[key] = value; hasAttrsChanged = true; } } } } } else { // full props update. if (setFullProps(instance, rawProps, props, attrs)) { hasAttrsChanged = true; } // in case of dynamic props, check if we need to delete keys from // the props object let kebabKey; for (const key in rawCurrentProps) { if (!rawProps || // for camelCase (!hasOwn(rawProps, key) && // it's possible the original props was passed in as kebab-case // and converted to camelCase (#955) ((kebabKey = hyphenate(key)) === key || !hasOwn(rawProps, kebabKey)))) { if (options) { if (rawPrevProps && // for camelCase (rawPrevProps[key] !== undefined || // for kebab-case rawPrevProps[kebabKey] !== undefined)) { props[key] = resolvePropValue(options, rawCurrentProps, key, undefined, instance, true /* isAbsent */); } } else { delete props[key]; } } } // in the case of functional component w/o props declaration, props and // attrs point to the same object so it should already have been updated. if (attrs !== rawCurrentProps) { for (const key in attrs) { if (!rawProps || !hasOwn(rawProps, key)) { delete attrs[key]; hasAttrsChanged = true; } } } } // trigger updates for $attrs in case it's used in component slots if (hasAttrsChanged) { trigger(instance, "set" /* SET */, '$attrs'); } if ((process.env.NODE_ENV !== 'production')) { validateProps(rawProps || {}, props, instance); } } function setFullProps(instance, rawProps, props, attrs) { const [options, needCastKeys] = instance.propsOptions; let hasAttrsChanged = false; let rawCastValues; if (rawProps) { for (let key in rawProps) { // key, ref are reserved and never passed down if (isReservedProp(key)) { continue; } { if (key.startsWith('onHook:')) { softAssertCompatEnabled("INSTANCE_EVENT_HOOKS" /* INSTANCE_EVENT_HOOKS */, instance, key.slice(2).toLowerCase()); } if (key === 'inline-template') { continue; } } const value = rawProps[key]; // prop option names are camelized during normalization, so to support // kebab -> camel conversion here we need to camelize the key. let camelKey; if (options && hasOwn(options, (camelKey = camelize(key)))) { if (!needCastKeys || !needCastKeys.includes(camelKey)) { props[camelKey] = value; } else { (rawCastValues || (rawCastValues = {}))[camelKey] = value; } } else if (!isEmitListener(instance.emitsOptions, key)) { // Any non-declared (either as a prop or an emitted event) props are put // into a separate `attrs` object for spreading. Make sure to preserve // original key casing { if (isOn(key) && key.endsWith('Native')) { key = key.slice(0, -6); // remove Native postfix } else if (shouldSkipAttr(key, instance)) { continue; } } if (value !== attrs[key]) { attrs[key] = value; hasAttrsChanged = true; } } } } if (needCastKeys) { const rawCurrentProps = toRaw(props); const castValues = rawCastValues || EMPTY_OBJ; for (let i = 0; i < needCastKeys.length; i++) { const key = needCastKeys[i]; props[key] = resolvePropValue(options, rawCurrentProps, key, castValues[key], instance, !hasOwn(castValues, key)); } } return hasAttrsChanged; } function resolvePropValue(options, props, key, value, instance, isAbsent) { const opt = options[key]; if (opt != null) { const hasDefault = hasOwn(opt, 'default'); // default values if (hasDefault && value === undefined) { const defaultValue = opt.default; if (opt.type !== Function && isFunction(defaultValue)) { const { propsDefaults } = instance; if (key in propsDefaults) { value = propsDefaults[key]; } else { setCurrentInstance(instance); value = propsDefaults[key] = defaultValue.call(isCompatEnabled("PROPS_DEFAULT_THIS" /* PROPS_DEFAULT_THIS */, instance) ? createPropsDefaultThis(instance, props, key) : null, props); unsetCurrentInstance(); } } else { value = defaultValue; } } // boolean casting if (opt[0 /* shouldCast */]) { if (isAbsent && !hasDefault) { value = false; } else if (opt[1 /* shouldCastTrue */] && (value === '' || value === hyphenate(key))) { value = true; } } } return value; } function normalizePropsOptions(comp, appContext, asMixin = false) { const cache = appContext.propsCache; const cached = cache.get(comp); if (cached) { return cached; } const raw = comp.props; const normalized = {}; const needCastKeys = []; // apply mixin/extends props let hasExtends = false; if (__VUE_OPTIONS_API__ && !isFunction(comp)) { const extendProps = (raw) => { if (isFunction(raw)) { raw = raw.options; } hasExtends = true; const [props, keys] = normalizePropsOptions(raw, appContext, true); extend(normalized, props); if (keys) needCastKeys.push(...keys); }; if (!asMixin && appContext.mixins.length) { appContext.mixins.forEach(extendProps); } if (comp.extends) { extendProps(comp.extends); } if (comp.mixins) { comp.mixins.forEach(extendProps); } } if (!raw && !hasExtends) { cache.set(comp, EMPTY_ARR); return EMPTY_ARR; } if (isArray(raw)) { for (let i = 0; i < raw.length; i++) { if ((process.env.NODE_ENV !== 'production') && !isString(raw[i])) { warn$1(`props must be strings when using array syntax.`, raw[i]); } const normalizedKey = camelize(raw[i]); if (validatePropName(normalizedKey)) { normalized[normalizedKey] = EMPTY_OBJ; } } } else if (raw) { if ((process.env.NODE_ENV !== 'production') && !isObject(raw)) { warn$1(`invalid props options`, raw); } for (const key in raw) { const normalizedKey = camelize(key); if (validatePropName(normalizedKey)) { const opt = raw[key]; const prop = (normalized[normalizedKey] = isArray(opt) || isFunction(opt) ? { type: opt } : opt); if (prop) { const booleanIndex = getTypeIndex(Boolean, prop.type); const stringIndex = getTypeIndex(String, prop.type); prop[0 /* shouldCast */] = booleanIndex > -1; prop[1 /* shouldCastTrue */] = stringIndex < 0 || booleanIndex < stringIndex; // if the prop needs boolean casting or default value if (booleanIndex > -1 || hasOwn(prop, 'default')) { needCastKeys.push(normalizedKey); } } } } } const res = [normalized, needCastKeys]; cache.set(comp, res); return res; } function validatePropName(key) { if (key[0] !== '$') { return true; } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Invalid prop name: "${key}" is a reserved property.`); } return false; } // use function string name to check type constructors // so that it works across vms / iframes. function getType(ctor) { const match = ctor && ctor.toString().match(/^\s*function (\w+)/); return match ? match[1] : ctor === null ? 'null' : ''; } function isSameType(a, b) { return getType(a) === getType(b); } function getTypeIndex(type, expectedTypes) { if (isArray(expectedTypes)) { return expectedTypes.findIndex(t => isSameType(t, type)); } else if (isFunction(expectedTypes)) { return isSameType(expectedTypes, type) ? 0 : -1; } return -1; } /** * dev only */ function validateProps(rawProps, props, instance) { const resolvedValues = toRaw(props); const options = instance.propsOptions[0]; for (const key in options) { let opt = options[key]; if (opt == null) continue; validateProp(key, resolvedValues[key], opt, !hasOwn(rawProps, key) && !hasOwn(rawProps, hyphenate(key))); } } /** * dev only */ function validateProp(name, value, prop, isAbsent) { const { type, required, validator } = prop; // required! if (required && isAbsent) { warn$1('Missing required prop: "' + name + '"'); return; } // missing but optional if (value == null && !prop.required) { return; } // type check if (type != null && type !== true) { let isValid = false; const types = isArray(type) ? type : [type]; const expectedTypes = []; // value is valid as long as one of the specified types match for (let i = 0; i < types.length && !isValid; i++) { const { valid, expectedType } = assertType(value, types[i]); expectedTypes.push(expectedType || ''); isValid = valid; } if (!isValid) { warn$1(getInvalidTypeMessage(name, value, expectedTypes)); return; } } // custom validator if (validator && !validator(value)) { warn$1('Invalid prop: custom validator check failed for prop "' + name + '".'); } } const isSimpleType = /*#__PURE__*/ makeMap('String,Number,Boolean,Function,Symbol,BigInt'); /** * dev only */ function assertType(value, type) { let valid; const expectedType = getType(type); if (isSimpleType(expectedType)) { const t = typeof value; valid = t === expectedType.toLowerCase(); // for primitive wrapper objects if (!valid && t === 'object') { valid = value instanceof type; } } else if (expectedType === 'Object') { valid = isObject(value); } else if (expectedType === 'Array') { valid = isArray(value); } else if (expectedType === 'null') { valid = value === null; } else { valid = value instanceof type; } return { valid, expectedType }; } /** * dev only */ function getInvalidTypeMessage(name, value, expectedTypes) { let message = `Invalid prop: type check failed for prop "${name}".` + ` Expected ${expectedTypes.map(capitalize).join(' | ')}`; const expectedType = expectedTypes[0]; const receivedType = toRawType(value); const expectedValue = styleValue(value, expectedType); const receivedValue = styleValue(value, receivedType); // check if we need to specify expected value if (expectedTypes.length === 1 && isExplicable(expectedType) && !isBoolean(expectedType, receivedType)) { message += ` with value ${expectedValue}`; } message += `, got ${receivedType} `; // check if we need to specify received value if (isExplicable(receivedType)) { message += `with value ${receivedValue}.`; } return message; } /** * dev only */ function styleValue(value, type) { if (type === 'String') { return `"${value}"`; } else if (type === 'Number') { return `${Number(value)}`; } else { return `${value}`; } } /** * dev only */ function isExplicable(type) { const explicitTypes = ['string', 'number', 'boolean']; return explicitTypes.some(elem => type.toLowerCase() === elem); } /** * dev only */ function isBoolean(...args) { return args.some(elem => elem.toLowerCase() === 'boolean'); } const isInternalKey = (key) => key[0] === '_' || key === '$stable'; const normalizeSlotValue = (value) => isArray(value) ? value.map(normalizeVNode) : [normalizeVNode(value)]; const normalizeSlot = (key, rawSlot, ctx) => { const normalized = withCtx((props) => { if ((process.env.NODE_ENV !== 'production') && currentInstance) { warn$1(`Slot "${key}" invoked outside of the render function: ` + `this will not track dependencies used in the slot. ` + `Invoke the slot function inside the render function instead.`); } return normalizeSlotValue(rawSlot(props)); }, ctx); normalized._c = false; return normalized; }; const normalizeObjectSlots = (rawSlots, slots, instance) => { const ctx = rawSlots._ctx; for (const key in rawSlots) { if (isInternalKey(key)) continue; const value = rawSlots[key]; if (isFunction(value)) { slots[key] = normalizeSlot(key, value, ctx); } else if (value != null) { if ((process.env.NODE_ENV !== 'production') && !(isCompatEnabled("RENDER_FUNCTION" /* RENDER_FUNCTION */, instance))) { warn$1(`Non-function value encountered for slot "${key}". ` + `Prefer function slots for better performance.`); } const normalized = normalizeSlotValue(value); slots[key] = () => normalized; } } }; const normalizeVNodeSlots = (instance, children) => { if ((process.env.NODE_ENV !== 'production') && !isKeepAlive(instance.vnode) && !(isCompatEnabled("RENDER_FUNCTION" /* RENDER_FUNCTION */, instance))) { warn$1(`Non-function value encountered for default slot. ` + `Prefer function slots for better performance.`); } const normalized = normalizeSlotValue(children); instance.slots.default = () => normalized; }; const initSlots = (instance, children) => { if (instance.vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) { const type = children._; if (type) { // users can get the shallow readonly version of the slots object through `this.$slots`, // we should avoid the proxy object polluting the slots of the internal instance instance.slots = toRaw(children); // make compiler marker non-enumerable def(children, '_', type); } else { normalizeObjectSlots(children, (instance.slots = {}), instance); } } else { instance.slots = {}; if (children) { normalizeVNodeSlots(instance, children); } } def(instance.slots, InternalObjectKey, 1); }; const updateSlots = (instance, children, optimized) => { const { vnode, slots } = instance; let needDeletionCheck = true; let deletionComparisonTarget = EMPTY_OBJ; if (vnode.shapeFlag & 32 /* SLOTS_CHILDREN */) { const type = children._; if (type) { // compiled slots. if ((process.env.NODE_ENV !== 'production') && isHmrUpdating) { // Parent was HMR updated so slot content may have changed. // force update slots and mark instance for hmr as well extend(slots, children); } else if (optimized && type === 1 /* STABLE */) { // compiled AND stable. // no need to update, and skip stale slots removal. needDeletionCheck = false; } else { // compiled but dynamic (v-if/v-for on slots) - update slots, but skip // normalization. extend(slots, children); // #2893 // when rendering the optimized slots by manually written render function, // we need to delete the `slots._` flag if necessary to make subsequent updates reliable, // i.e. let the `renderSlot` create the bailed Fragment if (!optimized && type === 1 /* STABLE */) { delete slots._; } } } else { needDeletionCheck = !children.$stable; normalizeObjectSlots(children, slots, instance); } deletionComparisonTarget = children; } else if (children) { // non slot object children (direct value) passed to a component normalizeVNodeSlots(instance, children); deletionComparisonTarget = { default: 1 }; } // delete stale slots if (needDeletionCheck) { for (const key in slots) { if (!isInternalKey(key) && !(key in deletionComparisonTarget)) { delete slots[key]; } } } }; const legacyDirectiveHookMap = { beforeMount: 'bind', mounted: 'inserted', updated: ['update', 'componentUpdated'], unmounted: 'unbind' }; function mapCompatDirectiveHook(name, dir, instance) { const mappedName = legacyDirectiveHookMap[name]; if (mappedName) { if (isArray(mappedName)) { const hook = []; mappedName.forEach(mapped => { const mappedHook = dir[mapped]; if (mappedHook) { softAssertCompatEnabled("CUSTOM_DIR" /* CUSTOM_DIR */, instance, mapped, name); hook.push(mappedHook); } }); return hook.length ? hook : undefined; } else { if (dir[mappedName]) { softAssertCompatEnabled("CUSTOM_DIR" /* CUSTOM_DIR */, instance, mappedName, name); } return dir[mappedName]; } } } /** Runtime helper for applying directives to a vnode. Example usage: const comp = resolveComponent('comp') const foo = resolveDirective('foo') const bar = resolveDirective('bar') return withDirectives(h(comp), [ [foo, this.x], [bar, this.y] ]) */ const isBuiltInDirective = /*#__PURE__*/ makeMap('bind,cloak,else-if,else,for,html,if,model,on,once,pre,show,slot,text'); function validateDirectiveName(name) { if (isBuiltInDirective(name)) { warn$1('Do not use built-in directive ids as custom directive id: ' + name); } } /** * Adds directives to a VNode. */ function withDirectives(vnode, directives) { const internalInstance = currentRenderingInstance; if (internalInstance === null) { (process.env.NODE_ENV !== 'production') && warn$1(`withDirectives can only be used inside render functions.`); return vnode; } const instance = internalInstance.proxy; const bindings = vnode.dirs || (vnode.dirs = []); for (let i = 0; i < directives.length; i++) { let [dir, value, arg, modifiers = EMPTY_OBJ] = directives[i]; if (isFunction(dir)) { dir = { mounted: dir, updated: dir }; } if (dir.deep) { traverse(value); } bindings.push({ dir, instance, value, oldValue: void 0, arg, modifiers }); } return vnode; } function invokeDirectiveHook(vnode, prevVNode, instance, name) { const bindings = vnode.dirs; const oldBindings = prevVNode && prevVNode.dirs; for (let i = 0; i < bindings.length; i++) { const binding = bindings[i]; if (oldBindings) { binding.oldValue = oldBindings[i].value; } let hook = binding.dir[name]; if (!hook) { hook = mapCompatDirectiveHook(name, binding.dir, instance); } if (hook) { // disable tracking inside all lifecycle hooks // since they can potentially be called inside effects. pauseTracking(); callWithAsyncErrorHandling(hook, instance, 8 /* DIRECTIVE_HOOK */, [ vnode.el, binding, vnode, prevVNode ]); resetTracking(); } } } // dev only function installLegacyConfigWarnings(config) { const legacyConfigOptions = { silent: "CONFIG_SILENT" /* CONFIG_SILENT */, devtools: "CONFIG_DEVTOOLS" /* CONFIG_DEVTOOLS */, ignoredElements: "CONFIG_IGNORED_ELEMENTS" /* CONFIG_IGNORED_ELEMENTS */, keyCodes: "CONFIG_KEY_CODES" /* CONFIG_KEY_CODES */, productionTip: "CONFIG_PRODUCTION_TIP" /* CONFIG_PRODUCTION_TIP */ }; Object.keys(legacyConfigOptions).forEach(key => { let val = config[key]; Object.defineProperty(config, key, { enumerable: true, get() { return val; }, set(newVal) { if (!isCopyingConfig) { warnDeprecation(legacyConfigOptions[key], null); } val = newVal; } }); }); } function installLegacyOptionMergeStrats(config) { config.optionMergeStrategies = new Proxy({}, { get(target, key) { if (key in target) { return target[key]; } if (key in internalOptionMergeStrats && softAssertCompatEnabled("CONFIG_OPTION_MERGE_STRATS" /* CONFIG_OPTION_MERGE_STRATS */, null)) { return internalOptionMergeStrats[key]; } } }); } let isCopyingConfig = false; // exported only for test let singletonApp; let singletonCtor; // Legacy global Vue constructor function createCompatVue(createApp, createSingletonApp) { singletonApp = createSingletonApp({}); const Vue = (singletonCtor = function Vue(options = {}) { return createCompatApp(options, Vue); }); function createCompatApp(options = {}, Ctor) { assertCompatEnabled("GLOBAL_MOUNT" /* GLOBAL_MOUNT */, null); const { data } = options; if (data && !isFunction(data) && softAssertCompatEnabled("OPTIONS_DATA_FN" /* OPTIONS_DATA_FN */, null)) { options.data = () => data; } const app = createApp(options); if (Ctor !== Vue) { applySingletonPrototype(app, Ctor); } const vm = app._createRoot(options); if (options.el) { return vm.$mount(options.el); } else { return vm; } } Vue.version = "3.2.2"; Vue.config = singletonApp.config; Vue.use = (p, ...options) => { if (p && isFunction(p.install)) { p.install(Vue, ...options); } else if (isFunction(p)) { p(Vue, ...options); } return Vue; }; Vue.mixin = m => { singletonApp.mixin(m); return Vue; }; Vue.component = ((name, comp) => { if (comp) { singletonApp.component(name, comp); return Vue; } else { return singletonApp.component(name); } }); Vue.directive = ((name, dir) => { if (dir) { singletonApp.directive(name, dir); return Vue; } else { return singletonApp.directive(name); } }); Vue.options = { _base: Vue }; let cid = 1; Vue.cid = cid; Vue.nextTick = nextTick; const extendCache = new WeakMap(); function extendCtor(extendOptions = {}) { assertCompatEnabled("GLOBAL_EXTEND" /* GLOBAL_EXTEND */, null); if (isFunction(extendOptions)) { extendOptions = extendOptions.options; } if (extendCache.has(extendOptions)) { return extendCache.get(extendOptions); } const Super = this; function SubVue(inlineOptions) { if (!inlineOptions) { return createCompatApp(SubVue.options, SubVue); } else { return createCompatApp(mergeOptions(extend({}, SubVue.options), inlineOptions, internalOptionMergeStrats), SubVue); } } SubVue.super = Super; SubVue.prototype = Object.create(Vue.prototype); SubVue.prototype.constructor = SubVue; // clone non-primitive base option values for edge case of mutating // extended options const mergeBase = {}; for (const key in Super.options) { const superValue = Super.options[key]; mergeBase[key] = isArray(superValue) ? superValue.slice() : isObject(superValue) ? extend(Object.create(null), superValue) : superValue; } SubVue.options = mergeOptions(mergeBase, extendOptions, internalOptionMergeStrats); SubVue.options._base = SubVue; SubVue.extend = extendCtor.bind(SubVue); SubVue.mixin = Super.mixin; SubVue.use = Super.use; SubVue.cid = ++cid; extendCache.set(extendOptions, SubVue); return SubVue; } Vue.extend = extendCtor.bind(Vue); Vue.set = (target, key, value) => { assertCompatEnabled("GLOBAL_SET" /* GLOBAL_SET */, null); target[key] = value; }; Vue.delete = (target, key) => { assertCompatEnabled("GLOBAL_DELETE" /* GLOBAL_DELETE */, null); delete target[key]; }; Vue.observable = (target) => { assertCompatEnabled("GLOBAL_OBSERVABLE" /* GLOBAL_OBSERVABLE */, null); return reactive(target); }; Vue.filter = ((name, filter) => { if (filter) { singletonApp.filter(name, filter); return Vue; } else { return singletonApp.filter(name); } }); // internal utils - these are technically internal but some plugins use it. const util = { warn: (process.env.NODE_ENV !== 'production') ? warn$1 : NOOP, extend, mergeOptions: (parent, child, vm) => mergeOptions(parent, child, vm ? undefined : internalOptionMergeStrats), defineReactive }; Object.defineProperty(Vue, 'util', { get() { assertCompatEnabled("GLOBAL_PRIVATE_UTIL" /* GLOBAL_PRIVATE_UTIL */, null); return util; } }); Vue.configureCompat = configureCompat; return Vue; } function installAppCompatProperties(app, context, render) { installFilterMethod(app, context); installLegacyOptionMergeStrats(app.config); if (!singletonApp) { // this is the call of creating the singleton itself so the rest is // unnecessary return; } installCompatMount(app, context, render); installLegacyAPIs(app); applySingletonAppMutations(app); if ((process.env.NODE_ENV !== 'production')) installLegacyConfigWarnings(app.config); } function installFilterMethod(app, context) { context.filters = {}; app.filter = (name, filter) => { assertCompatEnabled("FILTERS" /* FILTERS */, null); if (!filter) { return context.filters[name]; } if ((process.env.NODE_ENV !== 'production') && context.filters[name]) { warn$1(`Filter "${name}" has already been registered.`); } context.filters[name] = filter; return app; }; } function installLegacyAPIs(app) { // expose global API on app instance for legacy plugins Object.defineProperties(app, { // so that app.use() can work with legacy plugins that extend prototypes prototype: { get() { (process.env.NODE_ENV !== 'production') && warnDeprecation("GLOBAL_PROTOTYPE" /* GLOBAL_PROTOTYPE */, null); return app.config.globalProperties; } }, nextTick: { value: nextTick }, extend: { value: singletonCtor.extend }, set: { value: singletonCtor.set }, delete: { value: singletonCtor.delete }, observable: { value: singletonCtor.observable }, util: { get() { return singletonCtor.util; } } }); } function applySingletonAppMutations(app) { ['mixins', 'components', 'directives', 'filters', 'deopt'].forEach(key => { // @ts-ignore app._context[key] = singletonApp._context[key]; }); // copy over global config mutations isCopyingConfig = true; for (const key in singletonApp.config) { if (key === 'isNativeTag') continue; if (isRuntimeOnly() && (key === 'isCustomElement' || key === 'compilerOptions')) { continue; } const val = singletonApp.config[key]; // @ts-ignore app.config[key] = val; // compat for runtime ignoredElements -> isCustomElement if (key === 'ignoredElements' && isCompatEnabled("CONFIG_IGNORED_ELEMENTS" /* CONFIG_IGNORED_ELEMENTS */, null) && !isRuntimeOnly() && isArray(val)) { app.config.compilerOptions.isCustomElement = tag => { return val.some(v => (isString(v) ? v === tag : v.test(tag))); }; } } isCopyingConfig = false; applySingletonPrototype(app, singletonCtor); } function applySingletonPrototype(app, Ctor) { // copy prototype augmentations as config.globalProperties const enabled = isCompatEnabled("GLOBAL_PROTOTYPE" /* GLOBAL_PROTOTYPE */, null); if (enabled) { app.config.globalProperties = Object.create(Ctor.prototype); } let hasPrototypeAugmentations = false; const descriptors = Object.getOwnPropertyDescriptors(Ctor.prototype); for (const key in descriptors) { if (key !== 'constructor') { hasPrototypeAugmentations = true; if (enabled) { Object.defineProperty(app.config.globalProperties, key, descriptors[key]); } } } if ((process.env.NODE_ENV !== 'production') && hasPrototypeAugmentations) { warnDeprecation("GLOBAL_PROTOTYPE" /* GLOBAL_PROTOTYPE */, null); } } function installCompatMount(app, context, render) { let isMounted = false; /** * Vue 2 supports the behavior of creating a component instance but not * mounting it, which is no longer possible in Vue 3 - this internal * function simulates that behavior. */ app._createRoot = options => { const component = app._component; const vnode = createVNode(component, options.propsData || null); vnode.appContext = context; const hasNoRender = !isFunction(component) && !component.render && !component.template; const emptyRender = () => { }; // create root instance const instance = createComponentInstance(vnode, null, null); // suppress "missing render fn" warning since it can't be determined // until $mount is called if (hasNoRender) { instance.render = emptyRender; } setupComponent(instance); vnode.component = instance; vnode.isCompatRoot = true; // $mount & $destroy // these are defined on ctx and picked up by the $mount/$destroy // public property getters on the instance proxy. // Note: the following assumes DOM environment since the compat build // only targets web. It essentially includes logic for app.mount from // both runtime-core AND runtime-dom. instance.ctx._compat_mount = (selectorOrEl) => { if (isMounted) { (process.env.NODE_ENV !== 'production') && warn$1(`Root instance is already mounted.`); return; } let container; if (typeof selectorOrEl === 'string') { // eslint-disable-next-line const result = document.querySelector(selectorOrEl); if (!result) { (process.env.NODE_ENV !== 'production') && warn$1(`Failed to mount root instance: selector "${selectorOrEl}" returned null.`); return; } container = result; } else { // eslint-disable-next-line container = selectorOrEl || document.createElement('div'); } const isSVG = container instanceof SVGElement; // HMR root reload if ((process.env.NODE_ENV !== 'production')) { context.reload = () => { const cloned = cloneVNode(vnode); // compat mode will use instance if not reset to null cloned.component = null; render(cloned, container, isSVG); }; } // resolve in-DOM template if component did not provide render // and no setup/mixin render functions are provided (by checking // that the instance is still using the placeholder render fn) if (hasNoRender && instance.render === emptyRender) { // root directives check if ((process.env.NODE_ENV !== 'production')) { for (let i = 0; i < container.attributes.length; i++) { const attr = container.attributes[i]; if (attr.name !== 'v-cloak' && /^(v-|:|@)/.test(attr.name)) { warnDeprecation("GLOBAL_MOUNT_CONTAINER" /* GLOBAL_MOUNT_CONTAINER */, null); break; } } } instance.render = null; component.template = container.innerHTML; finishComponentSetup(instance, false, true /* skip options */); } // clear content before mounting container.innerHTML = ''; // TODO hydration render(vnode, container, isSVG); if (container instanceof Element) { container.removeAttribute('v-cloak'); container.setAttribute('data-v-app', ''); } isMounted = true; app._container = container; container.__vue_app__ = app; if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { devtoolsInitApp(app, version); } return instance.proxy; }; instance.ctx._compat_destroy = () => { if (isMounted) { render(null, app._container); if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { devtoolsUnmountApp(app); } delete app._container.__vue_app__; } else { const { bum, scope, um } = instance; // beforeDestroy hooks if (bum) { invokeArrayFns(bum); } if (isCompatEnabled("INSTANCE_EVENT_HOOKS" /* INSTANCE_EVENT_HOOKS */, instance)) { instance.emit('hook:beforeDestroy'); } // stop effects if (scope) { scope.stop(); } // unmounted hook if (um) { invokeArrayFns(um); } if (isCompatEnabled("INSTANCE_EVENT_HOOKS" /* INSTANCE_EVENT_HOOKS */, instance)) { instance.emit('hook:destroyed'); } } }; return instance.proxy; }; } const methodsToPatch = [ 'push', 'pop', 'shift', 'unshift', 'splice', 'sort', 'reverse' ]; const patched = new WeakSet(); function defineReactive(obj, key, val) { // it's possible for the orignial object to be mutated after being defined // and expecting reactivity... we are covering it here because this seems to // be a bit more common. if (isObject(val) && !isReactive(val) && !patched.has(val)) { const reactiveVal = reactive(val); if (isArray(val)) { methodsToPatch.forEach(m => { // @ts-ignore val[m] = (...args) => { // @ts-ignore Array.prototype[m].call(reactiveVal, ...args); }; }); } else { Object.keys(val).forEach(key => { try { defineReactiveSimple(val, key, val[key]); } catch (e) { } }); } } const i = obj.$; if (i && obj === i.proxy) { // target is a Vue instance - define on instance.ctx defineReactiveSimple(i.ctx, key, val); i.accessCache = Object.create(null); } else if (isReactive(obj)) { obj[key] = val; } else { defineReactiveSimple(obj, key, val); } } function defineReactiveSimple(obj, key, val) { val = isObject(val) ? reactive(val) : val; Object.defineProperty(obj, key, { enumerable: true, configurable: true, get() { track(obj, "get" /* GET */, key); return val; }, set(newVal) { val = isObject(newVal) ? reactive(newVal) : newVal; trigger(obj, "set" /* SET */, key, newVal); } }); } function createAppContext() { return { app: null, config: { isNativeTag: NO, performance: false, globalProperties: {}, optionMergeStrategies: {}, errorHandler: undefined, warnHandler: undefined, compilerOptions: {} }, mixins: [], components: {}, directives: {}, provides: Object.create(null), optionsCache: new WeakMap(), propsCache: new WeakMap(), emitsCache: new WeakMap() }; } let uid = 0; function createAppAPI(render, hydrate) { return function createApp(rootComponent, rootProps = null) { if (rootProps != null && !isObject(rootProps)) { (process.env.NODE_ENV !== 'production') && warn$1(`root props passed to app.mount() must be an object.`); rootProps = null; } const context = createAppContext(); const installedPlugins = new Set(); let isMounted = false; const app = (context.app = { _uid: uid++, _component: rootComponent, _props: rootProps, _container: null, _context: context, _instance: null, version, get config() { return context.config; }, set config(v) { if ((process.env.NODE_ENV !== 'production')) { warn$1(`app.config cannot be replaced. Modify individual options instead.`); } }, use(plugin, ...options) { if (installedPlugins.has(plugin)) { (process.env.NODE_ENV !== 'production') && warn$1(`Plugin has already been applied to target app.`); } else if (plugin && isFunction(plugin.install)) { installedPlugins.add(plugin); plugin.install(app, ...options); } else if (isFunction(plugin)) { installedPlugins.add(plugin); plugin(app, ...options); } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`A plugin must either be a function or an object with an "install" ` + `function.`); } return app; }, mixin(mixin) { if (__VUE_OPTIONS_API__) { if (!context.mixins.includes(mixin)) { context.mixins.push(mixin); } else if ((process.env.NODE_ENV !== 'production')) { warn$1('Mixin has already been applied to target app' + (mixin.name ? `: ${mixin.name}` : '')); } } else if ((process.env.NODE_ENV !== 'production')) { warn$1('Mixins are only available in builds supporting Options API'); } return app; }, component(name, component) { if ((process.env.NODE_ENV !== 'production')) { validateComponentName(name, context.config); } if (!component) { return context.components[name]; } if ((process.env.NODE_ENV !== 'production') && context.components[name]) { warn$1(`Component "${name}" has already been registered in target app.`); } context.components[name] = component; return app; }, directive(name, directive) { if ((process.env.NODE_ENV !== 'production')) { validateDirectiveName(name); } if (!directive) { return context.directives[name]; } if ((process.env.NODE_ENV !== 'production') && context.directives[name]) { warn$1(`Directive "${name}" has already been registered in target app.`); } context.directives[name] = directive; return app; }, mount(rootContainer, isHydrate, isSVG) { if (!isMounted) { const vnode = createVNode(rootComponent, rootProps); // store app context on the root VNode. // this will be set on the root instance on initial mount. vnode.appContext = context; // HMR root reload if ((process.env.NODE_ENV !== 'production')) { context.reload = () => { render(cloneVNode(vnode), rootContainer, isSVG); }; } if (isHydrate && hydrate) { hydrate(vnode, rootContainer); } else { render(vnode, rootContainer, isSVG); } isMounted = true; app._container = rootContainer; rootContainer.__vue_app__ = app; if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { app._instance = vnode.component; devtoolsInitApp(app, version); } return vnode.component.proxy; } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`App has already been mounted.\n` + `If you want to remount the same app, move your app creation logic ` + `into a factory function and create fresh app instances for each ` + `mount - e.g. \`const createMyApp = () => createApp(App)\``); } }, unmount() { if (isMounted) { render(null, app._container); if ((process.env.NODE_ENV !== 'production') || __VUE_PROD_DEVTOOLS__) { app._instance = null; devtoolsUnmountApp(app); } delete app._container.__vue_app__; } else if ((process.env.NODE_ENV !== 'production')) { warn$1(`Cannot unmount an app that is not mounted.`); } }, provide(key, value) { if ((process.env.NODE_ENV !== 'production') && key in context.provides) { warn$1(`App already provides property with key "${String(key)}". ` + `It will be overwritten with the new value.`); } // TypeScript doesn't allow symbols as index type // https://github.com/Microsoft/TypeScript/issues/24587 context.provides[key] = value; return app; } }); { installAppCompatProperties(app, context, render); } return app; }; } let hasMismatch = false; const isSVGContainer = (container) => /svg/.test(container.namespaceURI) && container.tagName !== 'foreignObject'; const isComment = (node) => node.nodeType === 8 /* COMMENT */; // Note: hydration is DOM-specific // But we have to place it in core due to tight coupling with core - splitting // it out creates a ton of unnecessary complexity. // Hydration also depends on some renderer internal logic which needs to be // passed in via arguments. function createHydrationFunctions(rendererInternals) { const { mt: mountComponent, p: patch, o: { patchProp, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals; const hydrate = (vnode, container) => { if (!container.hasChildNodes()) { (process.env.NODE_ENV !== 'production') && warn$1(`Attempting to hydrate existing markup but container is empty. ` + `Performing full mount instead.`); patch(null, vnode, container); flushPostFlushCbs(); return; } hasMismatch = false; hydrateNode(container.firstChild, vnode, null, null, null); flushPostFlushCbs(); if (hasMismatch && !false) { // this error should show up in production console.error(`Hydration completed but contains mismatches.`); } }; const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => { const isFragmentStart = isComment(node) && node.data === '['; const onMismatch = () => handleMismatch(node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragmentStart); const { type, ref, shapeFlag } = vnode; const domType = node.nodeType; vnode.el = node; let nextNode = null; switch (type) { case Text: if (domType !== 3 /* TEXT */) { nextNode = onMismatch(); } else { if (node.data !== vnode.children) { hasMismatch = true; (process.env.NODE_ENV !== 'production') && warn$1(`Hydration text mismatch:` + `\n- Client: ${JSON.stringify(node.data)}` + `\n- Server: ${JSON.stringify(vnode.children)}`); node.data = vnode.children; } nextNode = nextSibling(node); } break; case Comment$1: if (domType !== 8 /* COMMENT */ || isFragmentStart) { nextNode = onMismatch(); } else { nextNode = nextSibling(node); } break; case Static: if (domType !== 1 /* ELEMENT */) { nextNode = onMismatch(); } else { // determine anchor, adopt content nextNode = node; // if the static vnode has its content stripped during build, // adopt it from the server-rendered HTML. const needToAdoptContent = !vnode.children.length; for (let i = 0; i < vnode.staticCount; i++) { if (needToAdoptContent) vnode.children += nextNode.outerHTML; if (i === vnode.staticCount - 1) { vnode.anchor = nextNode; } nextNode = nextSibling(nextNode); } return nextNode; } break; case Fragment: if (!isFragmentStart) { nextNode = onMismatch(); } else { nextNode = hydrateFragment(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized); } break; default: if (shapeFlag & 1 /* ELEMENT */) { if (domType !== 1 /* ELEMENT */ || vnode.type.toLowerCase() !== node.tagName.toLowerCase()) { nextNode = onMismatch(); } else { nextNode = hydrateElement(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized); } } else if (shapeFlag & 6 /* COMPONENT */) { // when setting up the render effect, if the initial vnode already // has .el set, the component will perform hydration instead of mount // on its sub-tree. vnode.slotScopeIds = slotScopeIds; const container = parentNode(node); mountComponent(vnode, container, null, parentComponent, parentSuspense, isSVGContainer(container), optimized); // component may be async, so in the case of fragments we cannot rely // on component's rendered output to determine the end of the fragment // instead, we do a lookahead to find the end anchor node. nextNode = isFragmentStart ? locateClosingAsyncAnchor(node) : nextSibling(node); // #3787 // if component is async, it may get moved / unmounted before its // inner component is loaded, so we need to give it a placeholder // vnode that matches its adopted DOM. if (isAsyncWrapper(vnode)) { let subTree; if (isFragmentStart) { subTree = createVNode(Fragment); subTree.anchor = nextNode ? nextNode.previousSibling : container.lastChild; } else { subTree = node.nodeType === 3 ? createTextVNode('') : createVNode('div'); } subTree.el = node; vnode.component.subTree = subTree; } } else if (shapeFlag & 64 /* TELEPORT */) { if (domType !== 8 /* COMMENT */) { nextNode = onMismatch(); } else { nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, rendererInternals, hydrateChildren); } } else if (shapeFlag & 128 /* SUSPENSE */) { nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, isSVGContainer(parentNode(node)), slotScopeIds, optimized, rendererInternals, hydrateNode); } else if ((process.env.NODE_ENV !== 'production')) { warn$1('Invalid HostVNode type:', type, `(${typeof type})`); } } if (ref != null) { setRef(ref, null, parentSuspense, vnode); } return nextNode; }; const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => { optimized = optimized || !!vnode.dynamicChildren; const { type, props, patchFlag, shapeFlag, dirs } = vnode; // #4006 for form elements with non-string v-model value bindings // e.g.