@vue/runtime-dom 3.2.44 → 3.2.46

package/dist/runtime-dom.esm-browser.js

@@ -96,7 +96,7 @@ function normalizeProps(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,' +
+    'header,hgroup,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,' +
@@ -108,7 +108,7 @@ const HTML_TAGS = 'html,body,base,head,link,meta,style,title,address,article,asi
 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,' +
+    'feDistantLight,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,' +
@@ -259,12 +259,13 @@ const remove = (arr, el) => {
         arr.splice(i, 1);
     }
 };
-const hasOwnProperty = Object.prototype.hasOwnProperty;
-const hasOwn = (val, key) => hasOwnProperty.call(val, key);
+const hasOwnProperty$1 = Object.prototype.hasOwnProperty;
+const hasOwn = (val, key) => hasOwnProperty$1.call(val, key);
 const isArray = Array.isArray;
 const isMap = (val) => toTypeString(val) === '[object Map]';
 const isSet = (val) => toTypeString(val) === '[object Set]';
 const isDate = (val) => toTypeString(val) === '[object Date]';
+const isRegExp = (val) => toTypeString(val) === '[object RegExp]';
 const isFunction = (val) => typeof val === 'function';
 const isString = (val) => typeof val === 'string';
 const isSymbol = (val) => typeof val === 'symbol';
@@ -331,10 +332,22 @@ const def = (obj, key, value) => {
         value
     });
 };
-const toNumber = (val) => {
+/**
+ * "123-foo" will be parsed to 123
+ * This is used for the .number modifier in v-model
+ */
+const looseToNumber = (val) => {
     const n = parseFloat(val);
     return isNaN(n) ? val : n;
 };
+/**
+ * Only conerces number-like strings
+ * "123-foo" will be returned as-is
+ */
+const toNumber = (val) => {
+    const n = isString(val) ? Number(val) : NaN;
+    return isNaN(n) ? val : n;
+};
 let _globalThis;
 const getGlobalThis = () => {
     return (_globalThis ||
@@ -350,7 +363,7 @@ const getGlobalThis = () => {
                             : {}));
 };
 
-function warn(msg, ...args) {
+function warn$1(msg, ...args) {
     console.warn(`[Vue warn] ${msg}`, ...args);
 }
 
@@ -361,7 +374,7 @@ class EffectScope {
         /**
          * @internal
          */
-        this.active = true;
+        this._active = true;
         /**
          * @internal
          */
@@ -376,8 +389,11 @@ class EffectScope {
                 (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(this) - 1;
         }
     }
+    get active() {
+        return this._active;
+    }
     run(fn) {
-        if (this.active) {
+        if (this._active) {
             const currentEffectScope = activeEffectScope;
             try {
                 activeEffectScope = this;
@@ -388,7 +404,7 @@ class EffectScope {
             }
         }
         else {
-            warn(`cannot run an inactive effect scope.`);
+            warn$1(`cannot run an inactive effect scope.`);
         }
     }
     /**
@@ -406,7 +422,7 @@ class EffectScope {
         activeEffectScope = this.parent;
     }
     stop(fromParent) {
-        if (this.active) {
+        if (this._active) {
             let i, l;
             for (i = 0, l = this.effects.length; i < l; i++) {
                 this.effects[i].stop();
@@ -429,7 +445,7 @@ class EffectScope {
                 }
             }
             this.parent = undefined;
-            this.active = false;
+            this._active = false;
         }
     }
 }
@@ -449,7 +465,7 @@ function onScopeDispose(fn) {
         activeEffectScope.cleanups.push(fn);
     }
     else {
-        warn(`onScopeDispose() is called when there is no active effect scope` +
+        warn$1(`onScopeDispose() is called when there is no active effect scope` +
             ` to be associated with.`);
     }
 }
@@ -650,7 +666,7 @@ function trigger(target, type, key, newValue, oldValue, oldTarget) {
         deps = [...depsMap.values()];
     }
     else if (key === 'length' && isArray(target)) {
-        const newLength = toNumber(newValue);
+        const newLength = Number(newValue);
         depsMap.forEach((dep, key) => {
             if (key === 'length' || key >= newLength) {
                 deps.push(dep);
@@ -739,6 +755,10 @@ function triggerEffect(effect, debuggerEventExtraInfo) {
         }
     }
 }
+function getDepFromReactive(object, key) {
+    var _a;
+    return (_a = targetMap.get(object)) === null || _a === void 0 ? void 0 : _a.get(key);
+}
 
 const isNonTrackableKeys = /*#__PURE__*/ makeMap(`__proto__,__v_isRef,__isVue`);
 const builtInSymbols = new Set(
@@ -750,7 +770,7 @@ Object.getOwnPropertyNames(Symbol)
     .filter(key => key !== 'arguments' && key !== 'caller')
     .map(key => Symbol[key])
     .filter(isSymbol));
-const get = /*#__PURE__*/ createGetter();
+const get$1 = /*#__PURE__*/ createGetter();
 const shallowGet = /*#__PURE__*/ createGetter(false, true);
 const readonlyGet = /*#__PURE__*/ createGetter(true);
 const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);
@@ -784,6 +804,11 @@ function createArrayInstrumentations() {
     });
     return instrumentations;
 }
+function hasOwnProperty(key) {
+    const obj = toRaw(this);
+    track(obj, "has" /* TrackOpTypes.HAS */, key);
+    return obj.hasOwnProperty(key);
+}
 function createGetter(isReadonly = false, shallow = false) {
     return function get(target, key, receiver) {
         if (key === "__v_isReactive" /* ReactiveFlags.IS_REACTIVE */) {
@@ -807,8 +832,13 @@ function createGetter(isReadonly = false, shallow = false) {
             return target;
         }
         const targetIsArray = isArray(target);
-        if (!isReadonly && targetIsArray && hasOwn(arrayInstrumentations, key)) {
-            return Reflect.get(arrayInstrumentations, key, receiver);
+        if (!isReadonly) {
+            if (targetIsArray && hasOwn(arrayInstrumentations, key)) {
+                return Reflect.get(arrayInstrumentations, key, receiver);
+            }
+            if (key === 'hasOwnProperty') {
+                return hasOwnProperty;
+            }
         }
         const res = Reflect.get(target, key, receiver);
         if (isSymbol(key) ? builtInSymbols.has(key) : isNonTrackableKeys(key)) {
@@ -833,7 +863,7 @@ function createGetter(isReadonly = false, shallow = false) {
         return res;
     };
 }
-const set = /*#__PURE__*/ createSetter();
+const set$1 = /*#__PURE__*/ createSetter();
 const shallowSet = /*#__PURE__*/ createSetter(true);
 function createSetter(shallow = false) {
     return function set(target, key, value, receiver) {
@@ -876,7 +906,7 @@ function deleteProperty(target, key) {
     }
     return result;
 }
-function has(target, key) {
+function has$1(target, key) {
     const result = Reflect.has(target, key);
     if (!isSymbol(key) || !builtInSymbols.has(key)) {
         track(target, "has" /* TrackOpTypes.HAS */, key);
@@ -888,23 +918,23 @@ function ownKeys(target) {
     return Reflect.ownKeys(target);
 }
 const mutableHandlers = {
-    get,
-    set,
+    get: get$1,
+    set: set$1,
     deleteProperty,
-    has,
+    has: has$1,
     ownKeys
 };
 const readonlyHandlers = {
     get: readonlyGet,
     set(target, key) {
         {
-            warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
+            warn$1(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
         }
         return true;
     },
     deleteProperty(target, key) {
         {
-            warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
+            warn$1(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
         }
         return true;
     }
@@ -922,7 +952,7 @@ const shallowReadonlyHandlers = /*#__PURE__*/ extend({}, readonlyHandlers, {
 
 const toShallow = (value) => value;
 const getProto = (v) => Reflect.getPrototypeOf(v);
-function get$1(target, key, isReadonly = false, isShallow = false) {
+function get(target, key, isReadonly = false, isShallow = false) {
     // #1772: readonly(reactive(Map)) should return readonly + reactive version
     // of the value
     target = target["__v_raw" /* ReactiveFlags.RAW */];
@@ -948,7 +978,7 @@ function get$1(target, key, isReadonly = false, isShallow = false) {
         target.get(key);
     }
 }
-function has$1(key, isReadonly = false) {
+function has(key, isReadonly = false) {
     const target = this["__v_raw" /* ReactiveFlags.RAW */];
     const rawTarget = toRaw(target);
     const rawKey = toRaw(key);
@@ -978,7 +1008,7 @@ function add(value) {
     }
     return this;
 }
-function set$1(key, value) {
+function set(key, value) {
     value = toRaw(value);
     const target = toRaw(this);
     const { has, get } = getProto(target);
@@ -1091,41 +1121,41 @@ function createReadonlyMethod(type) {
 function createInstrumentations() {
     const mutableInstrumentations = {
         get(key) {
-            return get$1(this, key);
+            return get(this, key);
         },
         get size() {
             return size(this);
         },
-        has: has$1,
+        has,
         add,
-        set: set$1,
+        set,
         delete: deleteEntry,
         clear,
         forEach: createForEach(false, false)
     };
     const shallowInstrumentations = {
         get(key) {
-            return get$1(this, key, false, true);
+            return get(this, key, false, true);
         },
         get size() {
             return size(this);
         },
-        has: has$1,
+        has,
         add,
-        set: set$1,
+        set,
         delete: deleteEntry,
         clear,
         forEach: createForEach(false, true)
     };
     const readonlyInstrumentations = {
         get(key) {
-            return get$1(this, key, true);
+            return get(this, key, true);
         },
         get size() {
             return size(this, true);
         },
         has(key) {
-            return has$1.call(this, key, true);
+            return has.call(this, key, true);
         },
         add: createReadonlyMethod("add" /* TriggerOpTypes.ADD */),
         set: createReadonlyMethod("set" /* TriggerOpTypes.SET */),
@@ -1135,13 +1165,13 @@ function createInstrumentations() {
     };
     const shallowReadonlyInstrumentations = {
         get(key) {
-            return get$1(this, key, true, true);
+            return get(this, key, true, true);
         },
         get size() {
             return size(this, true);
         },
         has(key) {
-            return has$1.call(this, key, true);
+            return has.call(this, key, true);
         },
         add: createReadonlyMethod("add" /* TriggerOpTypes.ADD */),
         set: createReadonlyMethod("set" /* TriggerOpTypes.SET */),
@@ -1332,9 +1362,10 @@ function trackRefValue(ref) {
 }
 function triggerRefValue(ref, newVal) {
     ref = toRaw(ref);
-    if (ref.dep) {
+    const dep = ref.dep;
+    if (dep) {
         {
-            triggerEffects(ref.dep, {
+            triggerEffects(dep, {
                 target: ref,
                 type: "set" /* TriggerOpTypes.SET */,
                 key: 'value',
@@ -1446,6 +1477,9 @@ class ObjectRefImpl {
     set value(newVal) {
         this._object[this._key] = newVal;
     }
+    get dep() {
+        return getDepFromReactive(toRaw(this._object), this._key);
+    }
 }
 function toRef(object, key, defaultValue) {
     const val = object[key];
@@ -1487,7 +1521,7 @@ class ComputedRefImpl {
     }
 }
 _a = "__v_isReadonly" /* ReactiveFlags.IS_READONLY */;
-function computed(getterOrOptions, debugOptions, isSSR = false) {
+function computed$1(getterOrOptions, debugOptions, isSSR = false) {
     let getter;
     let setter;
     const onlyGetter = isFunction(getterOrOptions);
@@ -1517,7 +1551,7 @@ function pushWarningContext(vnode) {
 function popWarningContext() {
     stack.pop();
 }
-function warn$1(msg, ...args) {
+function warn(msg, ...args) {
     // avoid props formatting or warn handler tracking deps that might be mutated
     // during patch, leading to infinite recursion.
     pauseTracking();
@@ -1623,6 +1657,20 @@ function formatProp(key, value, raw) {
         return raw ? value : [`${key}=`, value];
     }
 }
+/**
+ * @internal
+ */
+function assertNumber(val, type) {
+    if (val === undefined) {
+        return;
+    }
+    else if (typeof val !== 'number') {
+        warn(`${type} is not a valid number - ` + `got ${JSON.stringify(val)}.`);
+    }
+    else if (isNaN(val)) {
+        warn(`${type} is NaN - ` + 'the duration expression might be incorrect.');
+    }
+}
 
 const ErrorTypeStrings = {
     ["sp" /* LifecycleHooks.SERVER_PREFETCH */]: 'serverPrefetch hook',
@@ -1716,7 +1764,7 @@ function logError(err, type, contextVNode, throwInDev = true) {
         if (contextVNode) {
             pushWarningContext(contextVNode);
         }
-        warn$1(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
+        warn(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
         if (contextVNode) {
             popWarningContext();
         }
@@ -1912,7 +1960,7 @@ function checkRecursiveUpdates(seen, fn) {
         if (count > RECURSION_LIMIT) {
             const instance = fn.ownerInstance;
             const componentName = instance && getComponentName(instance.type);
-            warn$1(`Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. ` +
+            warn(`Maximum recursive updates exceeded${componentName ? ` in component <${componentName}>` : ``}. ` +
                 `This means you have a reactive effect that is mutating its own ` +
                 `dependencies and thus recursively triggering itself. Possible sources ` +
                 `include component template, render function, updated hook or ` +
@@ -2019,12 +2067,6 @@ function reload(id, newComp) {
             // 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
@@ -2069,7 +2111,7 @@ function tryWrap(fn) {
 let devtools;
 let buffer = [];
 let devtoolsNotInstalled = false;
-function emit(event, ...args) {
+function emit$1(event, ...args) {
     if (devtools) {
         devtools.emit(event, ...args);
     }
@@ -2116,7 +2158,7 @@ function setDevtoolsHook(hook, target) {
     }
 }
 function devtoolsInitApp(app, version) {
-    emit("app:init" /* DevtoolsHooks.APP_INIT */, app, version, {
+    emit$1("app:init" /* DevtoolsHooks.APP_INIT */, app, version, {
         Fragment,
         Text,
         Comment,
@@ -2124,7 +2166,7 @@ function devtoolsInitApp(app, version) {
     });
 }
 function devtoolsUnmountApp(app) {
-    emit("app:unmount" /* DevtoolsHooks.APP_UNMOUNT */, app);
+    emit$1("app:unmount" /* DevtoolsHooks.APP_UNMOUNT */, app);
 }
 const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* DevtoolsHooks.COMPONENT_ADDED */);
 const devtoolsComponentUpdated = 
@@ -2140,21 +2182,21 @@ const devtoolsComponentRemoved = (component) => {
 };
 function createDevtoolsComponentHook(hook) {
     return (component) => {
-        emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component);
+        emit$1(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined, component);
     };
 }
 const devtoolsPerfStart = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:start" /* DevtoolsHooks.PERFORMANCE_START */);
 const devtoolsPerfEnd = /*#__PURE__*/ createDevtoolsPerformanceHook("perf:end" /* DevtoolsHooks.PERFORMANCE_END */);
 function createDevtoolsPerformanceHook(hook) {
     return (component, type, time) => {
-        emit(hook, component.appContext.app, component.uid, component, type, time);
+        emit$1(hook, component.appContext.app, component.uid, component, type, time);
     };
 }
 function devtoolsComponentEmit(component, event, params) {
-    emit("component:emit" /* DevtoolsHooks.COMPONENT_EMIT */, component.appContext.app, component, event, params);
+    emit$1("component:emit" /* DevtoolsHooks.COMPONENT_EMIT */, component.appContext.app, component, event, params);
 }
 
-function emit$1(instance, event, ...rawArgs) {
+function emit(instance, event, ...rawArgs) {
     if (instance.isUnmounted)
         return;
     const props = instance.vnode.props || EMPTY_OBJ;
@@ -2164,7 +2206,7 @@ function emit$1(instance, event, ...rawArgs) {
             if (!(event in emitsOptions) &&
                 !(false )) {
                 if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
-                    warn$1(`Component emitted event "${event}" but it is neither declared in ` +
+                    warn(`Component emitted event "${event}" but it is neither declared in ` +
                         `the emits option nor as an "${toHandlerKey(event)}" prop.`);
                 }
             }
@@ -2173,7 +2215,7 @@ function emit$1(instance, event, ...rawArgs) {
                 if (isFunction(validator)) {
                     const isValid = validator(...rawArgs);
                     if (!isValid) {
-                        warn$1(`Invalid event arguments: event validation failed for event "${event}".`);
+                        warn(`Invalid event arguments: event validation failed for event "${event}".`);
                     }
                 }
             }
@@ -2190,7 +2232,7 @@ function emit$1(instance, event, ...rawArgs) {
             args = rawArgs.map(a => (isString(a) ? a.trim() : a));
         }
         if (number) {
-            args = rawArgs.map(toNumber);
+            args = rawArgs.map(looseToNumber);
         }
     }
     {
@@ -2199,7 +2241,7 @@ function emit$1(instance, event, ...rawArgs) {
     {
         const lowerCaseEvent = event.toLowerCase();
         if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) {
-            warn$1(`Event "${lowerCaseEvent}" is emitted in component ` +
+            warn(`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. ` +
@@ -2474,13 +2516,13 @@ function renderComponentRoot(instance) {
                     }
                 }
                 if (extraAttrs.length) {
-                    warn$1(`Extraneous non-props attributes (` +
+                    warn(`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 (` +
+                    warn(`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. ` +
@@ -2493,7 +2535,7 @@ function renderComponentRoot(instance) {
     // inherit directives
     if (vnode.dirs) {
         if (!isElementRoot(root)) {
-            warn$1(`Runtime directive used on component with non-element root node. ` +
+            warn(`Runtime directive used on component with non-element root node. ` +
                 `The directives will not function as intended.`);
         }
         // clone before mutating since the root may be a hoisted vnode
@@ -2503,7 +2545,7 @@ function renderComponentRoot(instance) {
     // inherit transition data
     if (vnode.transition) {
         if (!isElementRoot(root)) {
-            warn$1(`Component inside <Transition> renders non-element root node ` +
+            warn(`Component inside <Transition> renders non-element root node ` +
                 `that cannot be animated.`);
         }
         root.transition = vnode.transition;
@@ -2838,7 +2880,10 @@ function createSuspenseBoundary(vnode, parent, parentComponent, container, hidde
         console[console.info ? 'info' : 'log'](`<Suspense> 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 timeout = vnode.props ? toNumber(vnode.props.timeout) : undefined;
+    {
+        assertNumber(timeout, `Suspense timeout`);
+    }
     const suspense = {
         vnode,
         parent,
@@ -3066,7 +3111,7 @@ function normalizeSuspenseSlot(s) {
     if (isArray(s)) {
         const singleChild = filterSingleRoot(s);
         if (!singleChild) {
-            warn$1(`<Suspense> slots expect a single root node.`);
+            warn(`<Suspense> slots expect a single root node.`);
         }
         s = singleChild;
     }
@@ -3104,7 +3149,7 @@ function setActiveBranch(suspense, branch) {
 function provide(key, value) {
     if (!currentInstance) {
         {
-            warn$1(`provide() can only be used inside setup().`);
+            warn(`provide() can only be used inside setup().`);
         }
     }
     else {
@@ -3143,11 +3188,11 @@ function inject(key, defaultValue, treatDefaultAsFactory = false) {
                 : defaultValue;
         }
         else {
-            warn$1(`injection "${String(key)}" not found.`);
+            warn(`injection "${String(key)}" not found.`);
         }
     }
     else {
-        warn$1(`inject() can only be used inside setup() or functional components.`);
+        warn(`inject() can only be used inside setup() or functional components.`);
     }
 }
 
@@ -3156,17 +3201,17 @@ function watchEffect(effect, options) {
     return doWatch(effect, null, options);
 }
 function watchPostEffect(effect, options) {
-    return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'post' }) ));
+    return doWatch(effect, null, Object.assign(Object.assign({}, options), { flush: 'post' }) );
 }
 function watchSyncEffect(effect, options) {
-    return doWatch(effect, null, (Object.assign(Object.assign({}, options), { flush: 'sync' }) ));
+    return doWatch(effect, null, Object.assign(Object.assign({}, options), { flush: 'sync' }) );
 }
 // initial value for watchers to trigger on undefined initial values
 const INITIAL_WATCHER_VALUE = {};
 // implementation
 function watch(source, cb, options) {
     if (!isFunction(cb)) {
-        warn$1(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
+        warn(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
             `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
             `supports \`watch(source, cb, options?) signature.`);
     }
@@ -3175,19 +3220,20 @@ function watch(source, cb, options) {
 function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EMPTY_OBJ) {
     if (!cb) {
         if (immediate !== undefined) {
-            warn$1(`watch() "immediate" option is only respected when using the ` +
+            warn(`watch() "immediate" option is only respected when using the ` +
                 `watch(source, callback, options?) signature.`);
         }
         if (deep !== undefined) {
-            warn$1(`watch() "deep" option is only respected when using the ` +
+            warn(`watch() "deep" option is only respected when using the ` +
                 `watch(source, callback, options?) signature.`);
         }
     }
     const warnInvalidSource = (s) => {
-        warn$1(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
+        warn(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
             `a reactive object, or an array of these types.`);
     };
-    const instance = currentInstance;
+    const instance = getCurrentScope() === (currentInstance === null || currentInstance === void 0 ? void 0 : currentInstance.scope) ? currentInstance : null;
+    // const instance = currentInstance
     let getter;
     let forceTrigger = false;
     let isMultiSource = false;
@@ -3274,7 +3320,7 @@ function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EM
                     // pass undefined as the old value when it's changed for the first time
                     oldValue === INITIAL_WATCHER_VALUE
                         ? undefined
-                        : (isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE)
+                        : isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE
                             ? []
                             : oldValue,
                     onCleanup
@@ -3454,7 +3500,7 @@ const BaseTransitionImpl = {
                     if (c.type !== Comment) {
                         if (hasFound) {
                             // warn more than one non-comment child
-                            warn$1('<transition> can only be used on a single element or component. ' +
+                            warn('<transition> can only be used on a single element or component. ' +
                                 'Use <transition-group> for lists.');
                             break;
                         }
@@ -3472,7 +3518,7 @@ const BaseTransitionImpl = {
                 mode !== 'in-out' &&
                 mode !== 'out-in' &&
                 mode !== 'default') {
-                warn$1(`invalid <transition> mode: ${mode}`);
+                warn(`invalid <transition> mode: ${mode}`);
             }
             if (state.isLeaving) {
                 return emptyPlaceholder(child);
@@ -3780,7 +3826,7 @@ function defineAsyncComponent(source) {
                         return pendingRequest;
                     }
                     if (!comp) {
-                        warn$1(`Async component loader resolved to undefined. ` +
+                        warn(`Async component loader resolved to undefined. ` +
                             `If you are using retry(), make sure to return its return value.`);
                     }
                     // interop module default
@@ -3873,10 +3919,15 @@ function defineAsyncComponent(source) {
         }
     });
 }
-function createInnerComp(comp, { vnode: { ref, props, children, shapeFlag }, parent }) {
+function createInnerComp(comp, parent) {
+    const { ref, props, children, ce } = parent.vnode;
     const vnode = createVNode(comp, props, children);
     // ensure inner component inherits the async wrapper's ref owner
     vnode.ref = ref;
+    // pass the custom element callback on to the inner comp
+    // and remove it from the async wrapper
+    vnode.ce = ce;
+    delete parent.vnode.ce;
     return vnode;
 }
 
@@ -3962,7 +4013,7 @@ const KeepAliveImpl = {
         }
         function pruneCacheEntry(key) {
             const cached = cache.get(key);
-            if (!current || cached.type !== current.type) {
+            if (!current || !isSameVNodeType(cached, current)) {
                 unmount(cached);
             }
             else if (current) {
@@ -3994,7 +4045,7 @@ const KeepAliveImpl = {
             cache.forEach(cached => {
                 const { subTree, suspense } = instance;
                 const vnode = getInnerChild(subTree);
-                if (cached.type === vnode.type) {
+                if (cached.type === vnode.type && cached.key === vnode.key) {
                     // current instance will be unmounted as part of keep-alive's unmount
                     resetShapeFlag(vnode);
                     // but invoke its deactivated hook here
@@ -4014,7 +4065,7 @@ const KeepAliveImpl = {
             const rawVNode = children[0];
             if (children.length > 1) {
                 {
-                    warn$1(`KeepAlive should contain exactly one component child.`);
+                    warn(`KeepAlive should contain exactly one component child.`);
                 }
                 current = null;
                 return children;
@@ -4034,8 +4085,7 @@ const KeepAliveImpl = {
                 : comp);
             const { include, exclude, max } = props;
             if ((include && (!name || !matches(include, name))) ||
-                (exclude && name && matches(exclude, name)) ||
-                (hmrDirtyComponents.has(comp))) {
+                (exclude && name && matches(exclude, name))) {
                 current = vnode;
                 return rawVNode;
             }
@@ -4092,7 +4142,7 @@ function matches(pattern, name) {
     else if (isString(pattern)) {
         return pattern.split(',').includes(name);
     }
-    else if (pattern.test) {
+    else if (isRegExp(pattern)) {
         return pattern.test(name);
     }
     /* istanbul ignore next */
@@ -4145,14 +4195,9 @@ function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
     }, target);
 }
 function resetShapeFlag(vnode) {
-    let shapeFlag = vnode.shapeFlag;
-    if (shapeFlag & 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */) {
-        shapeFlag -= 256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
-    }
-    if (shapeFlag & 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */) {
-        shapeFlag -= 512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
-    }
-    vnode.shapeFlag = shapeFlag;
+    // bitwise operations to remove keep alive flags
+    vnode.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
+    vnode.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
 }
 function getInnerChild(vnode) {
     return vnode.shapeFlag & 128 /* ShapeFlags.SUSPENSE */ ? vnode.ssContent : vnode;
@@ -4191,7 +4236,7 @@ function injectHook(type, hook, target = currentInstance, prepend = false) {
     }
     else {
         const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
-        warn$1(`${apiName} is called when there is no active component instance to be ` +
+        warn(`${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 ` +
@@ -4230,7 +4275,7 @@ return withDirectives(h(comp), [
 */
 function validateDirectiveName(name) {
     if (isBuiltInDirective(name)) {
-        warn$1('Do not use built-in directive ids as custom directive id: ' + name);
+        warn('Do not use built-in directive ids as custom directive id: ' + name);
     }
 }
 /**
@@ -4239,7 +4284,7 @@ function validateDirectiveName(name) {
 function withDirectives(vnode, directives) {
     const internalInstance = currentRenderingInstance;
     if (internalInstance === null) {
-        warn$1(`withDirectives can only be used inside render functions.`);
+        warn(`withDirectives can only be used inside render functions.`);
         return vnode;
     }
     const instance = getExposeProxy(internalInstance) ||
@@ -4350,12 +4395,12 @@ function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false
                 ? `\nIf this is a native custom element, make sure to exclude it from ` +
                     `component resolution via compilerOptions.isCustomElement.`
                 : ``;
-            warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
+            warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
         }
         return res;
     }
     else {
-        warn$1(`resolve${capitalize(type.slice(0, -1))} ` +
+        warn(`resolve${capitalize(type.slice(0, -1))} ` +
             `can only be used in render() or setup().`);
     }
 }
@@ -4380,7 +4425,7 @@ function renderList(source, renderItem, cache, index) {
     }
     else if (typeof source === 'number') {
         if (!Number.isInteger(source)) {
-            warn$1(`The v-for range expect an integer value but got ${source}.`);
+            warn(`The v-for range expect an integer value but got ${source}.`);
         }
         ret = new Array(source);
         for (let i = 0; i < source; i++) {
@@ -4451,11 +4496,13 @@ fallback, noSlotted) {
         (currentRenderingInstance.parent &&
             isAsyncWrapper(currentRenderingInstance.parent) &&
             currentRenderingInstance.parent.isCE)) {
-        return createVNode('slot', name === 'default' ? null : { name }, fallback && fallback());
+        if (name !== 'default')
+            props.name = name;
+        return createVNode('slot', props, fallback && fallback());
     }
     let slot = slots[name];
     if (slot && slot.length > 1) {
-        warn$1(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
+        warn(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
             `function. You need to mark this component with $dynamic-slots in the ` +
             `parent template.`);
         slot = () => [];
@@ -4508,7 +4555,7 @@ function ensureValidVNode(vnodes) {
 function toHandlers(obj, preserveCaseIfNecessary) {
     const ret = {};
     if (!isObject(obj)) {
-        warn$1(`v-on with no argument expects an object value.`);
+        warn(`v-on with no argument expects an object value.`);
         return ret;
     }
     for (const key in obj) {
@@ -4551,6 +4598,7 @@ const publicPropertiesMap =
     $watch: i => (instanceWatch.bind(i) )
 });
 const isReservedPrefix = (key) => key === '_' || key === '$';
+const hasSetupBinding = (state, key) => state !== EMPTY_OBJ && !state.__isScriptSetup && hasOwn(state, key);
 const PublicInstanceProxyHandlers = {
     get({ _: instance }, key) {
         const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
@@ -4558,15 +4606,6 @@ const PublicInstanceProxyHandlers = {
         if (key === '__isVue') {
             return true;
         }
-        // prioritize <script setup> bindings during dev.
-        // this allows even properties that start with _ or $ to be used - so that
-        // it aligns with the production behavior where the render fn is inlined and
-        // indeed has access to all declared variables.
-        if (setupState !== EMPTY_OBJ &&
-            setupState.__isScriptSetup &&
-            hasOwn(setupState, key)) {
-            return setupState[key];
-        }
         // data / props / ctx
         // This getter gets called for every property access on the render context
         // during render and is a major hotspot. The most expensive part of this
@@ -4589,7 +4628,7 @@ const PublicInstanceProxyHandlers = {
                     // default: just fallthrough
                 }
             }
-            else if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
+            else if (hasSetupBinding(setupState, key)) {
                 accessCache[key] = 1 /* AccessTypes.SETUP */;
                 return setupState[key];
             }
@@ -4648,32 +4687,37 @@ const PublicInstanceProxyHandlers = {
                 // to infinite warning loop
                 key.indexOf('__v') !== 0)) {
             if (data !== EMPTY_OBJ && isReservedPrefix(key[0]) && hasOwn(data, key)) {
-                warn$1(`Property ${JSON.stringify(key)} must be accessed via $data because it starts with a reserved ` +
+                warn(`Property ${JSON.stringify(key)} must be accessed via $data because it starts with a reserved ` +
                     `character ("$" or "_") and is not proxied on the render context.`);
             }
             else if (instance === currentRenderingInstance) {
-                warn$1(`Property ${JSON.stringify(key)} was accessed during render ` +
+                warn(`Property ${JSON.stringify(key)} was accessed during render ` +
                     `but is not defined on instance.`);
             }
         }
     },
     set({ _: instance }, key, value) {
         const { data, setupState, ctx } = instance;
-        if (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) {
+        if (hasSetupBinding(setupState, key)) {
             setupState[key] = value;
             return true;
         }
+        else if (setupState.__isScriptSetup &&
+            hasOwn(setupState, key)) {
+            warn(`Cannot mutate <script setup> binding "${key}" from Options API.`);
+            return false;
+        }
         else if (data !== EMPTY_OBJ && hasOwn(data, key)) {
             data[key] = value;
             return true;
         }
         else if (hasOwn(instance.props, key)) {
-            warn$1(`Attempting to mutate prop "${key}". Props are readonly.`, instance);
+            warn(`Attempting to mutate prop "${key}". Props are readonly.`);
             return false;
         }
         if (key[0] === '$' && key.slice(1) in instance) {
-            warn$1(`Attempting to mutate public property "${key}". ` +
-                    `Properties starting with $ are reserved and readonly.`, instance);
+            warn(`Attempting to mutate public property "${key}". ` +
+                    `Properties starting with $ are reserved and readonly.`);
             return false;
         }
         else {
@@ -4694,7 +4738,7 @@ const PublicInstanceProxyHandlers = {
         let normalizedProps;
         return (!!accessCache[key] ||
             (data !== EMPTY_OBJ && hasOwn(data, key)) ||
-            (setupState !== EMPTY_OBJ && hasOwn(setupState, key)) ||
+            hasSetupBinding(setupState, key) ||
             ((normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key)) ||
             hasOwn(ctx, key) ||
             hasOwn(publicPropertiesMap, key) ||
@@ -4713,7 +4757,7 @@ const PublicInstanceProxyHandlers = {
 };
 {
     PublicInstanceProxyHandlers.ownKeys = (target) => {
-        warn$1(`Avoid app logic that relies on enumerating keys on a component instance. ` +
+        warn(`Avoid app logic that relies on enumerating keys on a component instance. ` +
             `The keys will be empty in production mode to avoid performance overhead.`);
         return Reflect.ownKeys(target);
     };
@@ -4729,7 +4773,7 @@ const RuntimeCompiledPublicInstanceProxyHandlers = /*#__PURE__*/ extend({}, Publ
     has(_, key) {
         const has = key[0] !== '_' && !isGloballyWhitelisted(key);
         if (!has && PublicInstanceProxyHandlers.has(_, key)) {
-            warn$1(`Property ${JSON.stringify(key)} should not start with _ which is a reserved prefix for Vue internals.`);
+            warn(`Property ${JSON.stringify(key)} should not start with _ which is a reserved prefix for Vue internals.`);
         }
         return has;
     }
@@ -4779,7 +4823,7 @@ function exposeSetupStateOnRenderContext(instance) {
     Object.keys(toRaw(setupState)).forEach(key => {
         if (!setupState.__isScriptSetup) {
             if (isReservedPrefix(key[0])) {
-                warn$1(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
+                warn(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
                     `which are reserved prefixes for Vue internals.`);
                 return;
             }
@@ -4797,7 +4841,7 @@ function createDuplicateChecker() {
     const cache = Object.create(null);
     return (type, key) => {
         if (cache[key]) {
-            warn$1(`${type} property "${key}" is already defined in ${cache[key]}.`);
+            warn(`${type} property "${key}" is already defined in ${cache[key]}.`);
         }
         else {
             cache[key] = type;
@@ -4814,7 +4858,7 @@ function applyOptions(instance) {
     // call beforeCreate first before accessing other options since
     // the hook may mutate resolved options (#2791)
     if (options.beforeCreate) {
-        callHook(options.beforeCreate, instance, "bc" /* LifecycleHooks.BEFORE_CREATE */);
+        callHook$1(options.beforeCreate, instance, "bc" /* LifecycleHooks.BEFORE_CREATE */);
     }
     const { 
     // state
@@ -4864,24 +4908,24 @@ function applyOptions(instance) {
                 }
             }
             else {
-                warn$1(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` +
+                warn(`Method "${key}" has type "${typeof methodHandler}" in the component definition. ` +
                     `Did you reference the function correctly?`);
             }
         }
     }
     if (dataOptions) {
         if (!isFunction(dataOptions)) {
-            warn$1(`The data option must be a function. ` +
+            warn(`The data option must be a function. ` +
                 `Plain object usage is no longer supported.`);
         }
         const data = dataOptions.call(publicThis, publicThis);
         if (isPromise(data)) {
-            warn$1(`data() returned a Promise - note data() cannot be async; If you ` +
+            warn(`data() returned a Promise - note data() cannot be async; If you ` +
                 `intend to perform data fetching before component renders, use ` +
                 `async setup() + <Suspense>.`);
         }
         if (!isObject(data)) {
-            warn$1(`data() should return an object.`);
+            warn(`data() should return an object.`);
         }
         else {
             instance.data = reactive(data);
@@ -4912,15 +4956,15 @@ function applyOptions(instance) {
                     ? opt.get.bind(publicThis, publicThis)
                     : NOOP;
             if (get === NOOP) {
-                warn$1(`Computed property "${key}" has no getter.`);
+                warn(`Computed property "${key}" has no getter.`);
             }
             const set = !isFunction(opt) && isFunction(opt.set)
                 ? opt.set.bind(publicThis)
                 : () => {
-                        warn$1(`Write operation failed: computed property "${key}" is readonly.`);
+                        warn(`Write operation failed: computed property "${key}" is readonly.`);
                     }
                     ;
-            const c = computed$1({
+            const c = computed({
                 get,
                 set
             });
@@ -4949,7 +4993,7 @@ function applyOptions(instance) {
         });
     }
     if (created) {
-        callHook(created, instance, "c" /* LifecycleHooks.CREATED */);
+        callHook$1(created, instance, "c" /* LifecycleHooks.CREATED */);
     }
     function registerLifecycleHook(register, hook) {
         if (isArray(hook)) {
@@ -5029,7 +5073,7 @@ function resolveInjections(injectOptions, ctx, checkDuplicateProperties = NOOP,
             }
             else {
                 {
-                    warn$1(`injected property "${key}" is a ref and will be auto-unwrapped ` +
+                    warn(`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 ` +
@@ -5046,7 +5090,7 @@ function resolveInjections(injectOptions, ctx, checkDuplicateProperties = NOOP,
         }
     }
 }
-function callHook(hook, instance, type) {
+function callHook$1(hook, instance, type) {
     callWithAsyncErrorHandling(isArray(hook)
         ? hook.map(h => h.bind(instance.proxy))
         : hook.bind(instance.proxy), instance, type);
@@ -5061,7 +5105,7 @@ function createWatcher(raw, ctx, publicThis, key) {
             watch(getter, handler);
         }
         else {
-            warn$1(`Invalid watch handler specified by key "${raw}"`, handler);
+            warn(`Invalid watch handler specified by key "${raw}"`, handler);
         }
     }
     else if (isFunction(raw)) {
@@ -5079,12 +5123,12 @@ function createWatcher(raw, ctx, publicThis, key) {
                 watch(getter, handler, raw);
             }
             else {
-                warn$1(`Invalid watch handler specified by key "${raw.handler}"`, handler);
+                warn(`Invalid watch handler specified by key "${raw.handler}"`, handler);
             }
         }
     }
     else {
-        warn$1(`Invalid watch option: "${key}"`, raw);
+        warn(`Invalid watch option: "${key}"`, raw);
     }
 }
 /**
@@ -5128,7 +5172,7 @@ function mergeOptions(to, from, strats, asMixin = false) {
     }
     for (const key in from) {
         if (asMixin && key === 'expose') {
-            warn$1(`"expose" option is ignored when declared in mixins or extends. ` +
+            warn(`"expose" option is ignored when declared in mixins or extends. ` +
                     `It should only be declared in the base component itself.`);
         }
         else {
@@ -5461,7 +5505,7 @@ function normalizePropsOptions(comp, appContext, asMixin = false) {
     if (isArray(raw)) {
         for (let i = 0; i < raw.length; i++) {
             if (!isString(raw[i])) {
-                warn$1(`props must be strings when using array syntax.`, raw[i]);
+                warn(`props must be strings when using array syntax.`, raw[i]);
             }
             const normalizedKey = camelize(raw[i]);
             if (validatePropName(normalizedKey)) {
@@ -5471,7 +5515,7 @@ function normalizePropsOptions(comp, appContext, asMixin = false) {
     }
     else if (raw) {
         if (!isObject(raw)) {
-            warn$1(`invalid props options`, raw);
+            warn(`invalid props options`, raw);
         }
         for (const key in raw) {
             const normalizedKey = camelize(key);
@@ -5504,15 +5548,15 @@ function validatePropName(key) {
         return true;
     }
     else {
-        warn$1(`Invalid prop name: "${key}" is a reserved property.`);
+        warn(`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' : '';
+    const match = ctor && ctor.toString().match(/^\s*(function|class) (\w+)/);
+    return match ? match[2] : ctor === null ? 'null' : '';
 }
 function isSameType(a, b) {
     return getType(a) === getType(b);
@@ -5546,7 +5590,7 @@ function validateProp(name, value, prop, isAbsent) {
     const { type, required, validator } = prop;
     // required!
     if (required && isAbsent) {
-        warn$1('Missing required prop: "' + name + '"');
+        warn('Missing required prop: "' + name + '"');
         return;
     }
     // missing but optional
@@ -5565,13 +5609,13 @@ function validateProp(name, value, prop, isAbsent) {
             isValid = valid;
         }
         if (!isValid) {
-            warn$1(getInvalidTypeMessage(name, value, expectedTypes));
+            warn(getInvalidTypeMessage(name, value, expectedTypes));
             return;
         }
     }
     // custom validator
     if (validator && !validator(value)) {
-        warn$1('Invalid prop: custom validator check failed for prop "' + name + '".');
+        warn('Invalid prop: custom validator check failed for prop "' + name + '".');
     }
 }
 const isSimpleType = /*#__PURE__*/ makeMap('String,Number,Boolean,Function,Symbol,BigInt');
@@ -5668,7 +5712,7 @@ const normalizeSlot = (key, rawSlot, ctx) => {
     }
     const normalized = withCtx((...args) => {
         if (true && currentInstance) {
-            warn$1(`Slot "${key}" invoked outside of the render function: ` +
+            warn(`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.`);
         }
@@ -5688,7 +5732,7 @@ const normalizeObjectSlots = (rawSlots, slots, instance) => {
         }
         else if (value != null) {
             {
-                warn$1(`Non-function value encountered for slot "${key}". ` +
+                warn(`Non-function value encountered for slot "${key}". ` +
                     `Prefer function slots for better performance.`);
             }
             const normalized = normalizeSlotValue(value);
@@ -5699,7 +5743,7 @@ const normalizeObjectSlots = (rawSlots, slots, instance) => {
 const normalizeVNodeSlots = (instance, children) => {
     if (!isKeepAlive(instance.vnode) &&
         !(false )) {
-        warn$1(`Non-function value encountered for default slot. ` +
+        warn(`Non-function value encountered for default slot. ` +
             `Prefer function slots for better performance.`);
     }
     const normalized = normalizeSlotValue(children);
@@ -5800,21 +5844,21 @@ function createAppContext() {
         emitsCache: new WeakMap()
     };
 }
-let uid = 0;
+let uid$1 = 0;
 function createAppAPI(render, hydrate) {
     return function createApp(rootComponent, rootProps = null) {
         if (!isFunction(rootComponent)) {
             rootComponent = Object.assign({}, rootComponent);
         }
         if (rootProps != null && !isObject(rootProps)) {
-            warn$1(`root props passed to app.mount() must be an object.`);
+            warn(`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++,
+            _uid: uid$1++,
             _component: rootComponent,
             _props: rootProps,
             _container: null,
@@ -5826,12 +5870,12 @@ function createAppAPI(render, hydrate) {
             },
             set config(v) {
                 {
-                    warn$1(`app.config cannot be replaced. Modify individual options instead.`);
+                    warn(`app.config cannot be replaced. Modify individual options instead.`);
                 }
             },
             use(plugin, ...options) {
                 if (installedPlugins.has(plugin)) {
-                    warn$1(`Plugin has already been applied to target app.`);
+                    warn(`Plugin has already been applied to target app.`);
                 }
                 else if (plugin && isFunction(plugin.install)) {
                     installedPlugins.add(plugin);
@@ -5842,7 +5886,7 @@ function createAppAPI(render, hydrate) {
                     plugin(app, ...options);
                 }
                 else {
-                    warn$1(`A plugin must either be a function or an object with an "install" ` +
+                    warn(`A plugin must either be a function or an object with an "install" ` +
                         `function.`);
                 }
                 return app;
@@ -5853,7 +5897,7 @@ function createAppAPI(render, hydrate) {
                         context.mixins.push(mixin);
                     }
                     else {
-                        warn$1('Mixin has already been applied to target app' +
+                        warn('Mixin has already been applied to target app' +
                             (mixin.name ? `: ${mixin.name}` : ''));
                     }
                 }
@@ -5867,7 +5911,7 @@ function createAppAPI(render, hydrate) {
                     return context.components[name];
                 }
                 if (context.components[name]) {
-                    warn$1(`Component "${name}" has already been registered in target app.`);
+                    warn(`Component "${name}" has already been registered in target app.`);
                 }
                 context.components[name] = component;
                 return app;
@@ -5880,7 +5924,7 @@ function createAppAPI(render, hydrate) {
                     return context.directives[name];
                 }
                 if (context.directives[name]) {
-                    warn$1(`Directive "${name}" has already been registered in target app.`);
+                    warn(`Directive "${name}" has already been registered in target app.`);
                 }
                 context.directives[name] = directive;
                 return app;
@@ -5889,7 +5933,7 @@ function createAppAPI(render, hydrate) {
                 if (!isMounted) {
                     // #5571
                     if (rootContainer.__vue_app__) {
-                        warn$1(`There is already an app instance mounted on the host container.\n` +
+                        warn(`There is already an app instance mounted on the host container.\n` +
                             ` If you want to mount another app on the same host container,` +
                             ` you need to unmount the previous app by calling \`app.unmount()\` first.`);
                     }
@@ -5919,7 +5963,7 @@ function createAppAPI(render, hydrate) {
                     return getExposeProxy(vnode.component) || vnode.component.proxy;
                 }
                 else {
-                    warn$1(`App has already been mounted.\n` +
+                    warn(`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)\``);
@@ -5935,12 +5979,12 @@ function createAppAPI(render, hydrate) {
                     delete app._container.__vue_app__;
                 }
                 else {
-                    warn$1(`Cannot unmount an app that is not mounted.`);
+                    warn(`Cannot unmount an app that is not mounted.`);
                 }
             },
             provide(key, value) {
                 if (key in context.provides) {
-                    warn$1(`App already provides property with key "${String(key)}". ` +
+                    warn(`App already provides property with key "${String(key)}". ` +
                         `It will be overwritten with the new value.`);
                 }
                 context.provides[key] = value;
@@ -5970,7 +6014,7 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
     const value = isUnmount ? null : refValue;
     const { i: owner, r: ref } = rawRef;
     if (!owner) {
-        warn$1(`Missing ref owner context. ref cannot be used on hoisted vnodes. ` +
+        warn(`Missing ref owner context. ref cannot be used on hoisted vnodes. ` +
             `A vnode with ref must be created inside the render function.`);
         return;
     }
@@ -6037,7 +6081,7 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
                         refs[rawRef.k] = value;
                 }
                 else {
-                    warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
+                    warn('Invalid template ref type:', ref, `(${typeof ref})`);
                 }
             };
             if (value) {
@@ -6049,7 +6093,7 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
             }
         }
         else {
-            warn$1('Invalid template ref type:', ref, `(${typeof ref})`);
+            warn('Invalid template ref type:', ref, `(${typeof ref})`);
         }
     }
 }
@@ -6066,7 +6110,7 @@ function createHydrationFunctions(rendererInternals) {
     const { mt: mountComponent, p: patch, o: { patchProp, createText, nextSibling, parentNode, remove, insert, createComment } } = rendererInternals;
     const hydrate = (vnode, container) => {
         if (!container.hasChildNodes()) {
-            warn$1(`Attempting to hydrate existing markup but container is empty. ` +
+            warn(`Attempting to hydrate existing markup but container is empty. ` +
                     `Performing full mount instead.`);
             patch(null, vnode, container);
             flushPostFlushCbs();
@@ -6109,7 +6153,7 @@ function createHydrationFunctions(rendererInternals) {
                 else {
                     if (node.data !== vnode.children) {
                         hasMismatch = true;
-                        warn$1(`Hydration text mismatch:` +
+                        warn(`Hydration text mismatch:` +
                                 `\n- Client: ${JSON.stringify(node.data)}` +
                                 `\n- Server: ${JSON.stringify(vnode.children)}`);
                         node.data = vnode.children;
@@ -6224,7 +6268,7 @@ function createHydrationFunctions(rendererInternals) {
                     nextNode = vnode.type.hydrate(node, vnode, parentComponent, parentSuspense, isSVGContainer(parentNode(node)), slotScopeIds, optimized, rendererInternals, hydrateNode);
                 }
                 else {
-                    warn$1('Invalid HostVNode type:', type, `(${typeof type})`);
+                    warn('Invalid HostVNode type:', type, `(${typeof type})`);
                 }
         }
         if (ref != null) {
@@ -6285,7 +6329,7 @@ function createHydrationFunctions(rendererInternals) {
                 while (next) {
                     hasMismatch = true;
                     if (!hasWarned) {
-                        warn$1(`Hydration children mismatch in <${vnode.type}>: ` +
+                        warn(`Hydration children mismatch in <${vnode.type}>: ` +
                             `server rendered element contains more child nodes than client vdom.`);
                         hasWarned = true;
                     }
@@ -6298,7 +6342,7 @@ function createHydrationFunctions(rendererInternals) {
             else if (shapeFlag & 8 /* ShapeFlags.TEXT_CHILDREN */) {
                 if (el.textContent !== vnode.children) {
                     hasMismatch = true;
-                    warn$1(`Hydration text content mismatch in <${vnode.type}>:\n` +
+                    warn(`Hydration text content mismatch in <${vnode.type}>:\n` +
                             `- Client: ${el.textContent}\n` +
                             `- Server: ${vnode.children}`);
                     el.textContent = vnode.children;
@@ -6325,7 +6369,7 @@ function createHydrationFunctions(rendererInternals) {
             else {
                 hasMismatch = true;
                 if (!hasWarned) {
-                    warn$1(`Hydration children mismatch in <${container.tagName.toLowerCase()}>: ` +
+                    warn(`Hydration children mismatch in <${container.tagName.toLowerCase()}>: ` +
                         `server rendered element contains fewer child nodes than client vdom.`);
                     hasWarned = true;
                 }
@@ -6358,7 +6402,7 @@ function createHydrationFunctions(rendererInternals) {
     };
     const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
         hasMismatch = true;
-        warn$1(`Hydration node mismatch:\n- Client vnode:`, vnode.type, `\n- Server rendered DOM:`, node, node.nodeType === 3 /* DOMNodeTypes.TEXT */
+        warn(`Hydration node mismatch:\n- Client vnode:`, vnode.type, `\n- Server rendered DOM:`, node, node.nodeType === 3 /* DOMNodeTypes.TEXT */
                 ? `(text)`
                 : isComment(node) && node.data === '['
                     ? `(start of fragment)`
@@ -6526,7 +6570,7 @@ function baseCreateRenderer(options, createHydrationFns) {
                     type.process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals);
                 }
                 else {
-                    warn$1('Invalid VNode type:', type, `(${typeof type})`);
+                    warn('Invalid VNode type:', type, `(${typeof type})`);
                 }
         }
         // set ref
@@ -6616,6 +6660,8 @@ function baseCreateRenderer(options, createHydrationFns) {
         if (dirs) {
             invokeDirectiveHook(vnode, null, parentComponent, 'created');
         }
+        // scopeId
+        setScopeId(el, vnode, vnode.scopeId, slotScopeIds, parentComponent);
         // props
         if (props) {
             for (const key in props) {
@@ -6639,8 +6685,6 @@ function baseCreateRenderer(options, createHydrationFns) {
                 invokeVNodeHook(vnodeHook, parentComponent, vnode);
             }
         }
-        // scopeId
-        setScopeId(el, vnode, vnode.scopeId, slotScopeIds, parentComponent);
         {
             Object.defineProperty(el, '__vnode', {
                 value: vnode,
@@ -7350,7 +7394,7 @@ function baseCreateRenderer(options, createHydrationFns) {
                     : normalizeVNode(c2[i]));
                 if (nextChild.key != null) {
                     if (keyToNewIndexMap.has(nextChild.key)) {
-                        warn$1(`Duplicate keys found during update:`, JSON.stringify(nextChild.key), `Make sure keys are unique.`);
+                        warn(`Duplicate keys found during update:`, JSON.stringify(nextChild.key), `Make sure keys are unique.`);
                     }
                     keyToNewIndexMap.set(nextChild.key, i);
                 }
@@ -7733,6 +7777,10 @@ function traverseStaticChildren(n1, n2, shallow = false) {
                 if (!shallow)
                     traverseStaticChildren(c1, c2);
             }
+            // #6852 also inherit for text nodes
+            if (c2.type === Text) {
+                c2.el = c1.el;
+            }
             // also inherit for comment nodes, but not placeholders (e.g. v-if which
             // would have received .el during block patch)
             if (c2.type === Comment && !c2.el) {
@@ -7791,14 +7839,14 @@ const resolveTarget = (props, select) => {
     const targetSelector = props && props.to;
     if (isString(targetSelector)) {
         if (!select) {
-            warn$1(`Current renderer does not support string target for Teleports. ` +
+            warn(`Current renderer does not support string target for Teleports. ` +
                     `(missing querySelector renderer option)`);
             return null;
         }
         else {
             const target = select(targetSelector);
             if (!target) {
-                warn$1(`Failed to locate Teleport target with selector "${targetSelector}". ` +
+                warn(`Failed to locate Teleport target with selector "${targetSelector}". ` +
                         `Note the target element must exist before the component is mounted - ` +
                         `i.e. the target cannot be rendered by the component itself, and ` +
                         `ideally should be outside of the entire Vue component tree.`);
@@ -7808,7 +7856,7 @@ const resolveTarget = (props, select) => {
     }
     else {
         if (!targetSelector && !isTeleportDisabled(props)) {
-            warn$1(`Invalid Teleport target: ${targetSelector}`);
+            warn(`Invalid Teleport target: ${targetSelector}`);
         }
         return targetSelector;
     }
@@ -7841,7 +7889,7 @@ const TeleportImpl = {
                 isSVG = isSVG || isTargetSVG(target);
             }
             else if (!disabled) {
-                warn$1('Invalid Teleport target on mount:', target, `(${typeof target})`);
+                warn('Invalid Teleport target on mount:', target, `(${typeof target})`);
             }
             const mount = (container, anchor) => {
                 // Teleport *always* has Array children. This is enforced in both the
@@ -7893,7 +7941,7 @@ const TeleportImpl = {
                         moveTeleport(n2, nextTarget, null, internals, 0 /* TeleportMoveTypes.TARGET_CHANGE */);
                     }
                     else {
-                        warn$1('Invalid Teleport target on update:', target, `(${typeof target})`);
+                        warn('Invalid Teleport target on update:', target, `(${typeof target})`);
                     }
                 }
                 else if (wasDisabled) {
@@ -7903,6 +7951,7 @@ const TeleportImpl = {
                 }
             }
         }
+        updateCssVars(n2);
     },
     remove(vnode, parentComponent, parentSuspense, optimized, { um: unmount, o: { remove: hostRemove } }, doRemove) {
         const { shapeFlag, children, anchor, targetAnchor, target, props } = vnode;
@@ -7981,11 +8030,26 @@ function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScope
                 hydrateChildren(targetNode, vnode, target, parentComponent, parentSuspense, slotScopeIds, optimized);
             }
         }
+        updateCssVars(vnode);
     }
     return vnode.anchor && nextSibling(vnode.anchor);
 }
 // Force-casted public typing for h and TSX props inference
 const Teleport = TeleportImpl;
+function updateCssVars(vnode) {
+    // presence of .ut method indicates owner component uses css vars.
+    // code path here can assume browser environment.
+    const ctx = vnode.ctx;
+    if (ctx && ctx.ut) {
+        let node = vnode.children[0].el;
+        while (node !== vnode.targetAnchor) {
+            if (node.nodeType === 1)
+                node.setAttribute('data-v-owner', ctx.uid);
+            node = node.nextSibling;
+        }
+        ctx.ut();
+    }
+}
 
 const Fragment = Symbol('Fragment' );
 const Text = Symbol('Text' );
@@ -8080,6 +8144,10 @@ function isVNode(value) {
 function isSameVNodeType(n1, n2) {
     if (n2.shapeFlag & 6 /* ShapeFlags.COMPONENT */ &&
         hmrDirtyComponents.has(n2.type)) {
+        // #7042, ensure the vnode being unmounted during HMR
+        // bitwise operations to remove keep alive flags
+        n1.shapeFlag &= ~256 /* ShapeFlags.COMPONENT_SHOULD_KEEP_ALIVE */;
+        n2.shapeFlag &= ~512 /* ShapeFlags.COMPONENT_KEPT_ALIVE */;
         // HMR only: if the component has been hot-updated, force a reload.
         return false;
     }
@@ -8135,7 +8203,8 @@ function createBaseVNode(type, props = null, children = null, patchFlag = 0, dyn
         patchFlag,
         dynamicProps,
         dynamicChildren: null,
-        appContext: null
+        appContext: null,
+        ctx: currentRenderingInstance
     };
     if (needFullChildrenNormalization) {
         normalizeChildren(vnode, children);
@@ -8153,7 +8222,7 @@ function createBaseVNode(type, props = null, children = null, patchFlag = 0, dyn
     }
     // validate key
     if (vnode.key !== vnode.key) {
-        warn$1(`VNode created with invalid key (NaN). VNode type:`, vnode.type);
+        warn(`VNode created with invalid key (NaN). VNode type:`, vnode.type);
     }
     // track vnode for block tree
     if (isBlockTreeEnabled > 0 &&
@@ -8177,7 +8246,7 @@ const createVNode = (createVNodeWithArgsTransform );
 function _createVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, isBlockNode = false) {
     if (!type || type === NULL_DYNAMIC_COMPONENT) {
         if (!type) {
-            warn$1(`Invalid vnode type when creating vnode: ${type}.`);
+            warn(`Invalid vnode type when creating vnode: ${type}.`);
         }
         type = Comment;
     }
@@ -8235,7 +8304,7 @@ function _createVNode(type, props = null, children = null, patchFlag = 0, dynami
                         : 0;
     if (shapeFlag & 4 /* ShapeFlags.STATEFUL_COMPONENT */ && isProxy(type)) {
         type = toRaw(type);
-        warn$1(`Vue received a Component which was made a reactive object. This can ` +
+        warn(`Vue received a Component which was made a reactive object. This can ` +
             `lead to unnecessary performance overhead, and should be avoided by ` +
             `marking the component with \`markRaw\` or using \`shallowRef\` ` +
             `instead of \`ref\`.`, `\nComponent that was made reactive: `, type);
@@ -8302,7 +8371,9 @@ function cloneVNode(vnode, extraProps, mergeRef = false) {
         ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
         ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
         el: vnode.el,
-        anchor: vnode.anchor
+        anchor: vnode.anchor,
+        ctx: vnode.ctx,
+        ce: vnode.ce
     };
     return cloned;
 }
@@ -8469,13 +8540,13 @@ function invokeVNodeHook(hook, instance, vnode, prevVNode = null) {
 }
 
 const emptyAppContext = createAppContext();
-let uid$1 = 0;
+let uid = 0;
 function createComponentInstance(vnode, parent, suspense) {
     const type = vnode.type;
     // inherit parent app context - or - if root, adopt from root vnode
     const appContext = (parent ? parent.appContext : vnode.appContext) || emptyAppContext;
     const instance = {
-        uid: uid$1++,
+        uid: uid++,
         vnode,
         type,
         parent,
@@ -8545,7 +8616,7 @@ function createComponentInstance(vnode, parent, suspense) {
         instance.ctx = createDevRenderContext(instance);
     }
     instance.root = parent ? parent.root : instance;
-    instance.emit = emit$1.bind(null, instance);
+    instance.emit = emit.bind(null, instance);
     // apply custom element special handling
     if (vnode.ce) {
         vnode.ce(instance);
@@ -8566,7 +8637,7 @@ const isBuiltInTag = /*#__PURE__*/ makeMap('slot,component');
 function validateComponentName(name, config) {
     const appIsNativeTag = config.isNativeTag || NO;
     if (isBuiltInTag(name) || appIsNativeTag(name)) {
-        warn$1('Do not use built-in or reserved HTML elements as component id: ' + name);
+        warn('Do not use built-in or reserved HTML elements as component id: ' + name);
     }
 }
 function isStatefulComponent(instance) {
@@ -8605,7 +8676,7 @@ function setupStatefulComponent(instance, isSSR) {
             }
         }
         if (Component.compilerOptions && isRuntimeOnly()) {
-            warn$1(`"compilerOptions" is only supported when using a build of Vue that ` +
+            warn(`"compilerOptions" is only supported when using a build of Vue that ` +
                 `includes the runtime compiler. Since you are using a runtime-only ` +
                 `build, the options should be passed via your build tool config instead.`);
         }
@@ -8646,7 +8717,7 @@ function setupStatefulComponent(instance, isSSR) {
                 instance.asyncDep = setupResult;
                 if (!instance.suspense) {
                     const name = (_a = Component.name) !== null && _a !== void 0 ? _a : 'Anonymous';
-                    warn$1(`Component <${name}>: setup function returned a promise, but no ` +
+                    warn(`Component <${name}>: setup function returned a promise, but no ` +
                         `<Suspense> boundary was found in the parent component tree. ` +
                         `A component with async setup() must be nested in a <Suspense> ` +
                         `in order to be rendered.`);
@@ -8670,7 +8741,7 @@ function handleSetupResult(instance, setupResult, isSSR) {
     }
     else if (isObject(setupResult)) {
         if (isVNode(setupResult)) {
-            warn$1(`setup() should not return VNodes directly - ` +
+            warn(`setup() should not return VNodes directly - ` +
                 `return a render function instead.`);
         }
         // setup returned bindings.
@@ -8684,7 +8755,7 @@ function handleSetupResult(instance, setupResult, isSSR) {
         }
     }
     else if (setupResult !== undefined) {
-        warn$1(`setup() should return an object. Received: ${setupResult === null ? 'null' : typeof setupResult}`);
+        warn(`setup() should return an object. Received: ${setupResult === null ? 'null' : typeof setupResult}`);
     }
     finishComponentSetup(instance, isSSR);
 }
@@ -8751,13 +8822,13 @@ function finishComponentSetup(instance, isSSR, skipOptions) {
     if (!Component.render && instance.render === NOOP && !isSSR) {
         /* istanbul ignore if */
         if (!compile && Component.template) {
-            warn$1(`Component provided template option but ` +
+            warn(`Component provided template option but ` +
                 `runtime compilation is not supported in this build of Vue.` +
                 (` Use "vue.esm-browser.js" instead.`
                         ) /* should not happen */);
         }
         else {
-            warn$1(`Component is missing template or render function.`);
+            warn(`Component is missing template or render function.`);
         }
     }
 }
@@ -8769,11 +8840,11 @@ function createAttrsProxy(instance) {
                 return target[key];
             },
             set() {
-                warn$1(`setupContext.attrs is readonly.`);
+                warn(`setupContext.attrs is readonly.`);
                 return false;
             },
             deleteProperty() {
-                warn$1(`setupContext.attrs is readonly.`);
+                warn(`setupContext.attrs is readonly.`);
                 return false;
             }
         }
@@ -8781,8 +8852,24 @@ function createAttrsProxy(instance) {
 }
 function createSetupContext(instance) {
     const expose = exposed => {
-        if (instance.exposed) {
-            warn$1(`expose() should be called only once per setup().`);
+        {
+            if (instance.exposed) {
+                warn(`expose() should be called only once per setup().`);
+            }
+            if (exposed != null) {
+                let exposedType = typeof exposed;
+                if (exposedType === 'object') {
+                    if (isArray(exposed)) {
+                        exposedType = 'array';
+                    }
+                    else if (isRef(exposed)) {
+                        exposedType = 'ref';
+                    }
+                }
+                if (exposedType !== 'object') {
+                    warn(`expose() should be passed a plain object, received ${exposedType}.`);
+                }
+            }
         }
         instance.exposed = exposed || {};
     };
@@ -8857,13 +8944,13 @@ function isClassComponent(value) {
     return isFunction(value) && '__vccOpts' in value;
 }
 
-const computed$1 = ((getterOrOptions, debugOptions) => {
+const computed = ((getterOrOptions, debugOptions) => {
     // @ts-ignore
-    return computed(getterOrOptions, debugOptions, isInSSRComponentSetup);
+    return computed$1(getterOrOptions, debugOptions, isInSSRComponentSetup);
 });
 
 // dev only
-const warnRuntimeUsage = (method) => warn$1(`${method}() is a compiler-hint helper that is only usable inside ` +
+const warnRuntimeUsage = (method) => warn(`${method}() is a compiler-hint helper that is only usable inside ` +
     `<script setup> of a single file component. Its arguments should be ` +
     `compiled away and passing it at runtime has no effect.`);
 // implementation
@@ -8930,7 +9017,7 @@ function useAttrs() {
 function getContext() {
     const i = getCurrentInstance();
     if (!i) {
-        warn$1(`useContext() called without active instance.`);
+        warn(`useContext() called without active instance.`);
     }
     return i.setupContext || (i.setupContext = createSetupContext(i));
 }
@@ -8957,7 +9044,7 @@ function mergeDefaults(raw, defaults) {
             props[key] = { default: defaults[key] };
         }
         else {
-            warn$1(`props default key "${key}" has no corresponding declaration.`);
+            warn(`props default key "${key}" has no corresponding declaration.`);
         }
     }
     return props;
@@ -9000,7 +9087,7 @@ function createPropsRestProxy(props, excludedKeys) {
 function withAsyncContext(getAwaitable) {
     const ctx = getCurrentInstance();
     if (!ctx) {
-        warn$1(`withAsyncContext called without active current instance. ` +
+        warn(`withAsyncContext called without active current instance. ` +
             `This is likely a bug.`);
     }
     let awaitable = getAwaitable();
@@ -9047,7 +9134,7 @@ const useSSRContext = () => {
     {
         const ctx = inject(ssrContextKey);
         if (!ctx) {
-            warn$1(`Server rendering context not provided. Make sure to only call ` +
+            warn(`Server rendering context not provided. Make sure to only call ` +
                     `useSSRContext() conditionally in the server build.`);
         }
         return ctx;
@@ -9271,7 +9358,7 @@ function isMemoSame(cached, memo) {
 }
 
 // Core API ------------------------------------------------------------------
-const version = "3.2.44";
+const version = "3.2.46";
 /**
  * SSR utils for \@vue/server-renderer. Only exposed in ssr-possible builds.
  * @internal
@@ -9388,9 +9475,6 @@ function patchStyle(el, prev, next) {
     const style = el.style;
     const isCssString = isString(next);
     if (next && !isCssString) {
-        for (const key in next) {
-            setStyle(style, key, next[key]);
-        }
         if (prev && !isString(prev)) {
             for (const key in prev) {
                 if (next[key] == null) {
@@ -9398,6 +9482,9 @@ function patchStyle(el, prev, next) {
                 }
             }
         }
+        for (const key in next) {
+            setStyle(style, key, next[key]);
+        }
     }
     else {
         const currentDisplay = style.display;
@@ -9428,7 +9515,7 @@ function setStyle(style, name, val) {
             val = '';
         {
             if (semicolonRE.test(val)) {
-                warn$1(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
+                warn(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
             }
         }
         if (name.startsWith('--')) {
@@ -9552,7 +9639,7 @@ prevChildren, parentComponent, parentSuspense, unmountChildren) {
     catch (e) {
         // do not warn if value is auto-coerced from nullish values
         if (!needRemove) {
-            warn$1(`Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: ` +
+            warn(`Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: ` +
                 `value ${value} is invalid.`, e);
         }
     }
@@ -9756,16 +9843,25 @@ class VueElement extends BaseClass {
         }
         else {
             if (this.shadowRoot) {
-                warn$1(`Custom element has pre-rendered declarative shadow root but is not ` +
+                warn(`Custom element has pre-rendered declarative shadow root but is not ` +
                     `defined as hydratable. Use \`defineSSRCustomElement\`.`);
             }
             this.attachShadow({ mode: 'open' });
+            if (!this._def.__asyncLoader) {
+                // for sync component defs we can immediately resolve props
+                this._resolveProps(this._def);
+            }
         }
     }
     connectedCallback() {
         this._connected = true;
         if (!this._instance) {
-            this._resolveDef();
+            if (this._resolved) {
+                this._update();
+            }
+            else {
+                this._resolveDef();
+            }
         }
     }
     disconnectedCallback() {
@@ -9781,9 +9877,6 @@ class VueElement extends BaseClass {
      * resolve inner component definition (handle possible async component)
      */
     _resolveDef() {
-        if (this._resolved) {
-            return;
-        }
         this._resolved = true;
         // set initial attrs
         for (let i = 0; i < this.attributes.length; i++) {
@@ -9795,38 +9888,26 @@ class VueElement extends BaseClass {
                 this._setAttr(m.attributeName);
             }
         }).observe(this, { attributes: true });
-        const resolve = (def) => {
-            const { props = {}, styles } = def;
-            const hasOptions = !isArray(props);
-            const rawKeys = props ? (hasOptions ? Object.keys(props) : props) : [];
+        const resolve = (def, isAsync = false) => {
+            const { props, styles } = def;
             // cast Number-type props set before resolve
             let numberProps;
-            if (hasOptions) {
-                for (const key in this._props) {
+            if (props && !isArray(props)) {
+                for (const key in props) {
                     const opt = props[key];
                     if (opt === Number || (opt && opt.type === Number)) {
-                        this._props[key] = toNumber(this._props[key]);
-                        (numberProps || (numberProps = Object.create(null)))[key] = true;
+                        if (key in this._props) {
+                            this._props[key] = toNumber(this._props[key]);
+                        }
+                        (numberProps || (numberProps = Object.create(null)))[camelize(key)] = true;
                     }
                 }
             }
             this._numberProps = numberProps;
-            // check if there are props set pre-upgrade or connect
-            for (const key of Object.keys(this)) {
-                if (key[0] !== '_') {
-                    this._setProp(key, this[key], true, false);
-                }
-            }
-            // defining getter/setters on prototype
-            for (const key of rawKeys.map(camelize)) {
-                Object.defineProperty(this, key, {
-                    get() {
-                        return this._getProp(key);
-                    },
-                    set(val) {
-                        this._setProp(key, val);
-                    }
-                });
+            if (isAsync) {
+                // defining getter/setters on prototype
+                // for sync defs, this already happened in the constructor
+                this._resolveProps(def);
             }
             // apply CSS
             this._applyStyles(styles);
@@ -9835,12 +9916,33 @@ class VueElement extends BaseClass {
         };
         const asyncDef = this._def.__asyncLoader;
         if (asyncDef) {
-            asyncDef().then(resolve);
+            asyncDef().then(def => resolve(def, true));
         }
         else {
             resolve(this._def);
         }
     }
+    _resolveProps(def) {
+        const { props } = def;
+        const declaredPropKeys = isArray(props) ? props : Object.keys(props || {});
+        // check if there are props set pre-upgrade or connect
+        for (const key of Object.keys(this)) {
+            if (key[0] !== '_' && declaredPropKeys.includes(key)) {
+                this._setProp(key, this[key], true, false);
+            }
+        }
+        // defining getter/setters on prototype
+        for (const key of declaredPropKeys.map(camelize)) {
+            Object.defineProperty(this, key, {
+                get() {
+                    return this._getProp(key);
+                },
+                set(val) {
+                    this._setProp(key, val);
+                }
+            });
+        }
+    }
     _setAttr(key) {
         let value = this.getAttribute(key);
         const camelKey = camelize(key);
@@ -9896,27 +9998,31 @@ class VueElement extends BaseClass {
                             this._styles.length = 0;
                         }
                         this._applyStyles(newStyles);
-                        // if this is an async component, ceReload is called from the inner
-                        // component so no need to reload the async wrapper
-                        if (!this._def.__asyncLoader) {
-                            // reload
-                            this._instance = null;
-                            this._update();
-                        }
+                        this._instance = null;
+                        this._update();
                     };
                 }
-                // intercept emit
-                instance.emit = (event, ...args) => {
+                const dispatch = (event, args) => {
                     this.dispatchEvent(new CustomEvent(event, {
                         detail: args
                     }));
                 };
+                // intercept emit
+                instance.emit = (event, ...args) => {
+                    // dispatch both the raw and hyphenated versions of an event
+                    // to match Vue behavior
+                    dispatch(event, args);
+                    if (hyphenate(event) !== event) {
+                        dispatch(hyphenate(event), args);
+                    }
+                };
                 // locate nearest Vue custom element parent for provide/inject
                 let parent = this;
                 while ((parent =
                     parent && (parent.parentNode || parent.host))) {
                     if (parent instanceof VueElement) {
                         instance.parent = parent._instance;
+                        instance.provides = parent._instance.provides;
                         break;
                     }
                 }
@@ -9944,17 +10050,17 @@ function useCssModule(name = '$style') {
     {
         const instance = getCurrentInstance();
         if (!instance) {
-            warn$1(`useCssModule must be called inside setup()`);
+            warn(`useCssModule must be called inside setup()`);
             return EMPTY_OBJ;
         }
         const modules = instance.type.__cssModules;
         if (!modules) {
-            warn$1(`Current instance does not have CSS modules injected.`);
+            warn(`Current instance does not have CSS modules injected.`);
             return EMPTY_OBJ;
         }
         const mod = modules[name];
         if (!mod) {
-            warn$1(`Current instance does not have CSS module named "${name}".`);
+            warn(`Current instance does not have CSS module named "${name}".`);
             return EMPTY_OBJ;
         }
         return mod;
@@ -9969,10 +10075,17 @@ function useCssVars(getter) {
     const instance = getCurrentInstance();
     /* istanbul ignore next */
     if (!instance) {
-        warn$1(`useCssVars is called without current active component instance.`);
+        warn(`useCssVars is called without current active component instance.`);
         return;
     }
-    const setVars = () => setVarsOnVNode(instance.subTree, getter(instance.proxy));
+    const updateTeleports = (instance.ut = (vars = getter(instance.proxy)) => {
+        Array.from(document.querySelectorAll(`[data-v-owner="${instance.uid}"]`)).forEach(node => setVarsOnNode(node, vars));
+    });
+    const setVars = () => {
+        const vars = getter(instance.proxy);
+        setVarsOnVNode(instance.subTree, vars);
+        updateTeleports(vars);
+    };
     watchPostEffect(setVars);
     onMounted(() => {
         const ob = new MutationObserver(setVars);
@@ -10049,7 +10162,7 @@ const TransitionPropsValidators = (Transition.props =
  * #3227 Incoming hooks may be merged into arrays when wrapping Transition
  * with custom HOCs.
  */
-const callHook$1 = (hook, args = []) => {
+const callHook = (hook, args = []) => {
     if (isArray(hook)) {
         hook.forEach(h => h(...args));
     }
@@ -10099,7 +10212,7 @@ function resolveTransitionProps(rawProps) {
         return (el, done) => {
             const hook = isAppear ? onAppear : onEnter;
             const resolve = () => finishEnter(el, isAppear, done);
-            callHook$1(hook, [el, resolve]);
+            callHook(hook, [el, resolve]);
             nextFrame(() => {
                 removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
                 addTransitionClass(el, isAppear ? appearToClass : enterToClass);
@@ -10111,12 +10224,12 @@ function resolveTransitionProps(rawProps) {
     };
     return extend(baseProps, {
         onBeforeEnter(el) {
-            callHook$1(onBeforeEnter, [el]);
+            callHook(onBeforeEnter, [el]);
             addTransitionClass(el, enterFromClass);
             addTransitionClass(el, enterActiveClass);
         },
         onBeforeAppear(el) {
-            callHook$1(onBeforeAppear, [el]);
+            callHook(onBeforeAppear, [el]);
             addTransitionClass(el, appearFromClass);
             addTransitionClass(el, appearActiveClass);
         },
@@ -10140,19 +10253,19 @@ function resolveTransitionProps(rawProps) {
                     whenTransitionEnds(el, type, leaveDuration, resolve);
                 }
             });
-            callHook$1(onLeave, [el, resolve]);
+            callHook(onLeave, [el, resolve]);
         },
         onEnterCancelled(el) {
             finishEnter(el, false);
-            callHook$1(onEnterCancelled, [el]);
+            callHook(onEnterCancelled, [el]);
         },
         onAppearCancelled(el) {
             finishEnter(el, true);
-            callHook$1(onAppearCancelled, [el]);
+            callHook(onAppearCancelled, [el]);
         },
         onLeaveCancelled(el) {
             finishLeave(el);
-            callHook$1(onLeaveCancelled, [el]);
+            callHook(onLeaveCancelled, [el]);
         }
     });
 }
@@ -10170,18 +10283,10 @@ function normalizeDuration(duration) {
 }
 function NumberOf(val) {
     const res = toNumber(val);
-    validateDuration(res);
-    return res;
-}
-function validateDuration(val) {
-    if (typeof val !== 'number') {
-        warn$1(`<transition> explicit duration is not a valid number - ` +
-            `got ${JSON.stringify(val)}.`);
-    }
-    else if (isNaN(val)) {
-        warn$1(`<transition> explicit duration is NaN - ` +
-            'the duration expression might be incorrect.');
+    {
+        assertNumber(res, '<transition> explicit duration');
     }
+    return res;
 }
 function addTransitionClass(el, cls) {
     cls.split(/\s+/).forEach(c => c && el.classList.add(c));
@@ -10364,7 +10469,7 @@ const TransitionGroupImpl = {
                     setTransitionHooks(child, resolveTransitionHooks(child, cssTransitionProps, state, instance));
                 }
                 else {
-                    warn$1(`<TransitionGroup> children must be keyed.`);
+                    warn(`<TransitionGroup> children must be keyed.`);
                 }
             }
             if (prevChildren) {
@@ -10378,6 +10483,14 @@ const TransitionGroupImpl = {
         };
     }
 };
+/**
+ * TransitionGroup does not support "mode" so we need to remove it from the
+ * props declarations, but direct delete operation is considered a side effect
+ * and will make the entire transition feature non-tree-shakeable, so we do it
+ * in a function and mark the function's invocation as pure.
+ */
+const removeMode = (props) => delete props.mode;
+/*#__PURE__*/ removeMode(TransitionGroupImpl.props);
 const TransitionGroup = TransitionGroupImpl;
 function callPendingCbs(c) {
     const el = c.el;
@@ -10453,7 +10566,7 @@ const vModelText = {
                 domValue = domValue.trim();
             }
             if (castToNumber) {
-                domValue = toNumber(domValue);
+                domValue = looseToNumber(domValue);
             }
             el._assign(domValue);
         });
@@ -10488,7 +10601,8 @@ const vModelText = {
             if (trim && el.value.trim() === value) {
                 return;
             }
-            if ((number || el.type === 'number') && toNumber(el.value) === value) {
+            if ((number || el.type === 'number') &&
+                looseToNumber(el.value) === value) {
                 return;
             }
         }
@@ -10577,7 +10691,7 @@ const vModelSelect = {
         addEventListener(el, 'change', () => {
             const selectedVal = Array.prototype.filter
                 .call(el.options, (o) => o.selected)
-                .map((o) => number ? toNumber(getValue(o)) : getValue(o));
+                .map((o) => number ? looseToNumber(getValue(o)) : getValue(o));
             el._assign(el.multiple
                 ? isSetModel
                     ? new Set(selectedVal)
@@ -10601,7 +10715,7 @@ const vModelSelect = {
 function setSelected(el, value) {
     const isMultiple = el.multiple;
     if (isMultiple && !isArray(value) && !isSet(value)) {
-        warn$1(`<select multiple v-model> expects an Array or Set value for its binding, ` +
+        warn(`<select multiple v-model> expects an Array or Set value for its binding, ` +
                 `but got ${Object.prototype.toString.call(value).slice(8, -1)}.`);
         return;
     }
@@ -10854,7 +10968,7 @@ function injectCompilerOptionsCheck(app) {
                 return isCustomElement;
             },
             set() {
-                warn$1(`The \`isCustomElement\` config option is deprecated. Use ` +
+                warn(`The \`isCustomElement\` config option is deprecated. Use ` +
                     `\`compilerOptions.isCustomElement\` instead.`);
             }
         });
@@ -10868,11 +10982,11 @@ function injectCompilerOptionsCheck(app) {
             `- For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-dom`;
         Object.defineProperty(app.config, 'compilerOptions', {
             get() {
-                warn$1(msg);
+                warn(msg);
                 return compilerOptions;
             },
             set() {
-                warn$1(msg);
+                warn(msg);
             }
         });
     }
@@ -10881,14 +10995,14 @@ function normalizeContainer(container) {
     if (isString(container)) {
         const res = document.querySelector(container);
         if (!res) {
-            warn$1(`Failed to mount app: mount target selector "${container}" returned null.`);
+            warn(`Failed to mount app: mount target selector "${container}" returned null.`);
         }
         return res;
     }
     if (window.ShadowRoot &&
         container instanceof window.ShadowRoot &&
         container.mode === 'closed') {
-        warn$1(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
+        warn(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
     }
     return container;
 }
@@ -10897,4 +11011,4 @@ function normalizeContainer(container) {
  */
 const initDirectivesForSSR = NOOP;
 
-export { BaseTransition, Comment, EffectScope, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, Transition, TransitionGroup, VueElement, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, computed$1 as computed, createApp, createBlock, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineProps, defineSSRCustomElement, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hydrate, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useSSRContext, useSlots, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn$1 as warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId };
+export { BaseTransition, Comment, EffectScope, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, Transition, TransitionGroup, VueElement, assertNumber, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, computed, createApp, createBlock, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineProps, defineSSRCustomElement, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hydrate, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useSSRContext, useSlots, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId };