@vue/compat 3.6.0-alpha.2 → 3.6.0-alpha.4

package/dist/vue.global.js

@@ -1,12 +1,11 @@
 /**
-* @vue/compat v3.6.0-alpha.2
+* @vue/compat v3.6.0-alpha.4
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
 var Vue = (function () {
   'use strict';
 
-  /*! #__NO_SIDE_EFFECTS__ */
   // @__NO_SIDE_EFFECTS__
   function makeMap(str) {
     const map = /* @__PURE__ */ Object.create(null);
@@ -62,10 +61,10 @@ var Vue = (function () {
   );
   const cacheStringFunction = (fn) => {
     const cache = /* @__PURE__ */ Object.create(null);
-    return (str) => {
+    return ((str) => {
       const hit = cache[str];
       return hit || (cache[str] = fn(str));
-    };
+    });
   };
   const camelizeRE = /-(\w)/g;
   const camelizeReplacer = (_, c) => c ? c.toUpperCase() : "";
@@ -85,6 +84,9 @@ var Vue = (function () {
       return s;
     }
   );
+  const getModifierPropName = (name) => {
+    return `${name === "modelValue" || name === "model-value" ? "model" : name}Modifiers${name === "model" ? "$" : ""}`;
+  };
   const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
   const invokeArrayFns = (fns, ...arg) => {
     for (let i = 0; i < fns.length; i++) {
@@ -311,6 +313,9 @@ var Vue = (function () {
     if ((key === "width" || key === "height") && (tagName === "IMG" || tagName === "VIDEO" || tagName === "CANVAS" || tagName === "SOURCE")) {
       return true;
     }
+    if (key === "sandbox" && tagName === "IFRAME") {
+      return true;
+    }
     return false;
   }
 
@@ -500,6 +505,7 @@ var Vue = (function () {
   const notifyBuffer = [];
   let batchDepth = 0;
   let activeSub = void 0;
+  let globalVersion = 0;
   let notifyIndex = 0;
   let notifyBufferLength = 0;
   function setActiveSub(sub) {
@@ -522,17 +528,18 @@ var Vue = (function () {
     if (prevDep !== void 0 && prevDep.dep === dep) {
       return;
     }
-    let nextDep = void 0;
-    const recursedCheck = sub.flags & 4 /* RecursedCheck */;
-    if (recursedCheck) {
-      nextDep = prevDep !== void 0 ? prevDep.nextDep : sub.deps;
-      if (nextDep !== void 0 && nextDep.dep === dep) {
-        sub.depsTail = nextDep;
-        return;
-      }
+    const nextDep = prevDep !== void 0 ? prevDep.nextDep : sub.deps;
+    if (nextDep !== void 0 && nextDep.dep === dep) {
+      nextDep.version = globalVersion;
+      sub.depsTail = nextDep;
+      return;
     }
     const prevSub = dep.subsTail;
+    if (prevSub !== void 0 && prevSub.version === globalVersion && prevSub.sub === sub) {
+      return;
+    }
     const newLink = sub.depsTail = dep.subsTail = {
+      version: globalVersion,
       dep,
       sub,
       prevDep,
@@ -638,6 +645,7 @@ var Vue = (function () {
     } while (true);
   }
   function startTracking(sub) {
+    ++globalVersion;
     sub.depsTail = void 0;
     sub.flags = sub.flags & -57 | 4 /* RecursedCheck */;
     return setActiveSub(sub);
@@ -738,18 +746,12 @@ var Vue = (function () {
     } while (link2 !== void 0);
   }
   function isValidLink(checkLink, sub) {
-    const depsTail = sub.depsTail;
-    if (depsTail !== void 0) {
-      let link2 = sub.deps;
-      do {
-        if (link2 === checkLink) {
-          return true;
-        }
-        if (link2 === depsTail) {
-          break;
-        }
-        link2 = link2.nextDep;
-      } while (link2 !== void 0);
+    let link2 = sub.depsTail;
+    while (link2 !== void 0) {
+      if (link2 === checkLink) {
+        return true;
+      }
+      link2 = link2.prevDep;
     }
     return false;
   }
@@ -989,7 +991,7 @@ var Vue = (function () {
     join(separator) {
       return reactiveReadArray(this).join(separator);
     },
-    // keys() iterator only reads `length`, no optimisation required
+    // keys() iterator only reads `length`, no optimization required
     lastIndexOf(...args) {
       return searchProxy(this, "lastIndexOf", args);
     },
@@ -1041,7 +1043,7 @@ var Vue = (function () {
       iter._next = iter.next;
       iter.next = () => {
         const result = iter._next();
-        if (result.value) {
+        if (!result.done) {
           result.value = wrapValue(result.value);
         }
         return result;
@@ -1172,7 +1174,8 @@ var Vue = (function () {
         return res;
       }
       if (isRef(res)) {
-        return targetIsArray && isIntegerKey(key) ? res : res.value;
+        const value = targetIsArray && isIntegerKey(key) ? res : res.value;
+        return isReadonly2 && isObject(value) ? readonly(value) : value;
       }
       if (isObject(res)) {
         return isReadonly2 ? readonly(res) : reactive(res);
@@ -1194,7 +1197,13 @@ var Vue = (function () {
         }
         if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
           if (isOldValueReadonly) {
-            return false;
+            {
+              warn$2(
+                `Set operation on key "${String(key)}" failed: target is readonly.`,
+                target[key]
+              );
+            }
+            return true;
           } else {
             oldValue.value = value;
             return true;
@@ -1339,7 +1348,7 @@ var Vue = (function () {
       get size() {
         const target = this["__v_raw"];
         !readonly && track(toRaw(target), "iterate", ITERATE_KEY);
-        return Reflect.get(target, "size", target);
+        return target.size;
       },
       has(key) {
         const target = this["__v_raw"];
@@ -2342,11 +2351,11 @@ var Vue = (function () {
     if (depth <= 0 || !isObject(value) || value["__v_skip"]) {
       return value;
     }
-    seen = seen || /* @__PURE__ */ new Set();
-    if (seen.has(value)) {
+    seen = seen || /* @__PURE__ */ new Map();
+    if ((seen.get(value) || 0) >= depth) {
       return value;
     }
-    seen.add(value);
+    seen.set(value, depth);
     depth--;
     if (isRef(value)) {
       traverse(value.value, depth, seen);
@@ -2892,8 +2901,10 @@ var Vue = (function () {
         instance.hmrRerender();
       } else {
         const i = instance;
-        i.renderCache = [];
-        i.effect.run();
+        if (!(i.effect.flags & 1024)) {
+          i.renderCache = [];
+          i.effect.run();
+        }
       }
       nextTick(() => {
         isHmrUpdating = false;
@@ -2906,7 +2917,12 @@ var Vue = (function () {
     newComp = normalizeClassComponent(newComp);
     updateComponentDef(record.initialDef, newComp);
     const instances = [...record.instances];
-    if (newComp.__vapor) {
+    if (newComp.__vapor && !instances.some((i) => i.ceReload)) {
+      for (const instance of instances) {
+        if (instance.root && instance.root.ce && instance !== instance.root) {
+          instance.root.ce._removeChildStyle(instance.type);
+        }
+      }
       for (const instance of instances) {
         instance.hmrReload(newComp);
       }
@@ -2935,7 +2951,10 @@ var Vue = (function () {
             if (parent.vapor) {
               parent.hmrRerender();
             } else {
-              parent.effect.run();
+              if (!(parent.effect.flags & 1024)) {
+                parent.renderCache = [];
+                parent.effect.run();
+              }
             }
             nextTick(() => {
               isHmrUpdating = false;
@@ -3045,7 +3064,6 @@ var Vue = (function () {
       _devtoolsComponentRemoved(component);
     }
   };
-  /*! #__NO_SIDE_EFFECTS__ */
   // @__NO_SIDE_EFFECTS__
   function createDevtoolsComponentHook(hook) {
     return (component) => {
@@ -3759,9 +3777,6 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
         insert(mainAnchor, container, anchor);
         const mount = (container2, anchor2) => {
           if (shapeFlag & 16) {
-            if (parentComponent && parentComponent.isCE) {
-              parentComponent.ce._teleportTarget = container2;
-            }
             mountChildren(
               children,
               container2,
@@ -3783,6 +3798,9 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
             } else if (namespace !== "mathml" && isTargetMathML(target)) {
               namespace = "mathml";
             }
+            if (parentComponent && parentComponent.isCE) {
+              (parentComponent.ce._teleportTargets || (parentComponent.ce._teleportTargets = /* @__PURE__ */ new Set())).add(target);
+            }
             if (!disabled) {
               mount(target, targetAnchor);
               updateCssVars(n2, false);
@@ -3983,26 +4001,34 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
   function hydrateTeleport(node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized, {
     o: { nextSibling, parentNode, querySelector, insert, createText }
   }, hydrateChildren) {
+    function hydrateDisabledTeleport(node2, vnode2, targetStart, targetAnchor) {
+      vnode2.anchor = hydrateChildren(
+        nextSibling(node2),
+        vnode2,
+        parentNode(node2),
+        parentComponent,
+        parentSuspense,
+        slotScopeIds,
+        optimized
+      );
+      vnode2.targetStart = targetStart;
+      vnode2.targetAnchor = targetAnchor;
+    }
     const target = vnode.target = resolveTarget(
       vnode.props,
       querySelector
     );
+    const disabled = isTeleportDisabled(vnode.props);
     if (target) {
-      const disabled = isTeleportDisabled(vnode.props);
       const targetNode = target._lpa || target.firstChild;
       if (vnode.shapeFlag & 16) {
         if (disabled) {
-          vnode.anchor = hydrateChildren(
-            nextSibling(node),
+          hydrateDisabledTeleport(
+            node,
             vnode,
-            parentNode(node),
-            parentComponent,
-            parentSuspense,
-            slotScopeIds,
-            optimized
+            targetNode,
+            targetNode && nextSibling(targetNode)
           );
-          vnode.targetStart = targetNode;
-          vnode.targetAnchor = targetNode && nextSibling(targetNode);
         } else {
           vnode.anchor = nextSibling(node);
           let targetAnchor = targetNode;
@@ -4033,6 +4059,10 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
         }
       }
       updateCssVars(vnode, disabled);
+    } else if (disabled) {
+      if (vnode.shapeFlag & 16) {
+        hydrateDisabledTeleport(node, vnode, node, nextSibling(node));
+      }
     }
     return vnode.anchor && nextSibling(vnode.anchor);
   }
@@ -4073,7 +4103,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
       isMounted: false,
       isLeaving: false,
       isUnmounting: false,
-      leavingVNodes: /* @__PURE__ */ new Map()
+      leavingNodes: /* @__PURE__ */ new Map()
     };
     onMounted(() => {
       state.isMounted = true;
@@ -4105,7 +4135,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
     onAppearCancelled: TransitionHookValidator
   };
   const recursiveGetSubtree = (instance) => {
-    const subTree = instance.subTree;
+    const subTree = instance.type.__vapor ? instance.block : instance.subTree;
     return subTree.component ? recursiveGetSubtree(subTree.component) : subTree;
   };
   const BaseTransitionImpl = {
@@ -4122,9 +4152,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
         const child = findNonCommentChild(children);
         const rawProps = toRaw(props);
         const { mode } = rawProps;
-        if (mode && mode !== "in-out" && mode !== "out-in" && mode !== "default") {
-          warn$1(`invalid <transition> mode: ${mode}`);
-        }
+        checkTransitionMode(mode);
         if (state.isLeaving) {
           return emptyPlaceholder(child);
         }
@@ -4144,7 +4172,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
           setTransitionHooks(innerChild, enterHooks);
         }
         let oldInnerChild = instance.subTree && getInnerChild$1(instance.subTree);
-        if (oldInnerChild && oldInnerChild.type !== Comment && !isSameVNodeType(innerChild, oldInnerChild) && recursiveGetSubtree(instance).type !== Comment) {
+        if (oldInnerChild && oldInnerChild.type !== Comment && !isSameVNodeType(oldInnerChild, innerChild) && recursiveGetSubtree(instance).type !== Comment) {
           let leavingHooks = resolveTransitionHooks(
             oldInnerChild,
             rawProps,
@@ -4216,15 +4244,53 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
   }
   const BaseTransition = BaseTransitionImpl;
   function getLeavingNodesForType(state, vnode) {
-    const { leavingVNodes } = state;
-    let leavingVNodesCache = leavingVNodes.get(vnode.type);
+    const { leavingNodes } = state;
+    let leavingVNodesCache = leavingNodes.get(vnode.type);
     if (!leavingVNodesCache) {
       leavingVNodesCache = /* @__PURE__ */ Object.create(null);
-      leavingVNodes.set(vnode.type, leavingVNodesCache);
+      leavingNodes.set(vnode.type, leavingVNodesCache);
     }
     return leavingVNodesCache;
   }
   function resolveTransitionHooks(vnode, props, state, instance, postClone) {
+    const key = String(vnode.key);
+    const leavingVNodesCache = getLeavingNodesForType(state, vnode);
+    const context = {
+      setLeavingNodeCache: () => {
+        leavingVNodesCache[key] = vnode;
+      },
+      unsetLeavingNodeCache: () => {
+        if (leavingVNodesCache[key] === vnode) {
+          delete leavingVNodesCache[key];
+        }
+      },
+      earlyRemove: () => {
+        const leavingVNode = leavingVNodesCache[key];
+        if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el[leaveCbKey]) {
+          leavingVNode.el[leaveCbKey]();
+        }
+      },
+      cloneHooks: (vnode2) => {
+        const hooks = resolveTransitionHooks(
+          vnode2,
+          props,
+          state,
+          instance,
+          postClone
+        );
+        if (postClone) postClone(hooks);
+        return hooks;
+      }
+    };
+    return baseResolveTransitionHooks(context, props, state, instance);
+  }
+  function baseResolveTransitionHooks(context, props, state, instance) {
+    const {
+      setLeavingNodeCache,
+      unsetLeavingNodeCache,
+      earlyRemove,
+      cloneHooks
+    } = context;
     const {
       appear,
       mode,
@@ -4242,8 +4308,6 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
       onAfterAppear,
       onAppearCancelled
     } = props;
-    const key = String(vnode.key);
-    const leavingVNodesCache = getLeavingNodesForType(state, vnode);
     const callHook = (hook, args) => {
       hook && callWithAsyncErrorHandling(
         hook,
@@ -4279,10 +4343,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
             /* cancelled */
           );
         }
-        const leavingVNode = leavingVNodesCache[key];
-        if (leavingVNode && isSameVNodeType(vnode, leavingVNode) && leavingVNode.el[leaveCbKey]) {
-          leavingVNode.el[leaveCbKey]();
-        }
+        earlyRemove();
         callHook(hook, [el]);
       },
       enter(el) {
@@ -4319,7 +4380,6 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
         }
       },
       leave(el, remove) {
-        const key2 = String(vnode.key);
         if (el[enterCbKey$1]) {
           el[enterCbKey$1](
             true
@@ -4341,27 +4401,17 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
             callHook(onAfterLeave, [el]);
           }
           el[leaveCbKey] = void 0;
-          if (leavingVNodesCache[key2] === vnode) {
-            delete leavingVNodesCache[key2];
-          }
+          unsetLeavingNodeCache(el);
         };
-        leavingVNodesCache[key2] = vnode;
+        setLeavingNodeCache(el);
         if (onLeave) {
           callAsyncHook(onLeave, [el, done]);
         } else {
           done();
         }
       },
-      clone(vnode2) {
-        const hooks2 = resolveTransitionHooks(
-          vnode2,
-          props,
-          state,
-          instance,
-          postClone
-        );
-        if (postClone) postClone(hooks2);
-        return hooks2;
+      clone(node) {
+        return cloneHooks(node);
       }
     };
     return hooks;
@@ -4395,8 +4445,15 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
   }
   function setTransitionHooks(vnode, hooks) {
     if (vnode.shapeFlag & 6 && vnode.component) {
-      vnode.transition = hooks;
-      setTransitionHooks(vnode.component.subTree, hooks);
+      if (vnode.type.__vapor) {
+        getVaporInterface(vnode.component, vnode).setTransitionHooks(
+          vnode.component,
+          hooks
+        );
+      } else {
+        vnode.transition = hooks;
+        setTransitionHooks(vnode.component.subTree, hooks);
+      }
     } else if (vnode.shapeFlag & 128) {
       vnode.ssContent.transition = hooks.clone(vnode.ssContent);
       vnode.ssFallback.transition = hooks.clone(vnode.ssFallback);
@@ -4426,8 +4483,12 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
     }
     return ret;
   }
+  function checkTransitionMode(mode) {
+    if (mode && mode !== "in-out" && mode !== "out-in" && mode !== "default") {
+      warn$1(`invalid <transition> mode: ${mode}`);
+    }
+  }
 
-  /*! #__NO_SIDE_EFFECTS__ */
   // @__NO_SIDE_EFFECTS__
   function defineComponent(options, extraOptions) {
     return isFunction(options) ? (
@@ -4480,6 +4541,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
     return ret;
   }
 
+  const pendingSetRefMap = /* @__PURE__ */ new WeakMap();
   function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
     if (isArray(rawRef)) {
       rawRef.forEach(
@@ -4511,28 +4573,23 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
     const oldRef = oldRawRef && oldRawRef.r;
     const refs = owner.refs === EMPTY_OBJ ? owner.refs = {} : owner.refs;
     const setupState = owner.setupState;
-    const rawSetupState = toRaw(setupState);
-    const canSetSetupRef = setupState === EMPTY_OBJ ? () => false : (key) => {
-      {
-        if (hasOwn(rawSetupState, key) && !isRef(rawSetupState[key])) {
-          warn$1(
-            `Template ref "${key}" used on a non-ref value. It will not work in the production build.`
-          );
-        }
-        if (knownTemplateRefs.has(rawSetupState[key])) {
-          return false;
-        }
-      }
-      return hasOwn(rawSetupState, key);
+    const canSetSetupRef = createCanSetSetupRefChecker(setupState);
+    const canSetRef = (ref2) => {
+      return !knownTemplateRefs.has(ref2);
     };
     if (oldRef != null && oldRef !== ref) {
+      invalidatePendingSetRef(oldRawRef);
       if (isString(oldRef)) {
         refs[oldRef] = null;
         if (canSetSetupRef(oldRef)) {
           setupState[oldRef] = null;
         }
       } else if (isRef(oldRef)) {
-        oldRef.value = null;
+        if (canSetRef(oldRef)) {
+          oldRef.value = null;
+        }
+        const oldRawRefAtom = oldRawRef;
+        if (oldRawRefAtom.k) refs[oldRawRefAtom.k] = null;
       }
     }
     if (isFunction(ref)) {
@@ -4543,7 +4600,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
       if (_isString || _isRef) {
         const doSet = () => {
           if (rawRef.f) {
-            const existing = _isString ? canSetSetupRef(ref) ? setupState[ref] : refs[ref] : ref.value;
+            const existing = _isString ? canSetSetupRef(ref) ? setupState[ref] : refs[ref] : canSetRef(ref) || !rawRef.k ? ref.value : refs[rawRef.k];
             if (isUnmount) {
               isArray(existing) && remove(existing, refValue);
             } else {
@@ -4554,8 +4611,11 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
                     setupState[ref] = refs[ref];
                   }
                 } else {
-                  ref.value = [refValue];
-                  if (rawRef.k) refs[rawRef.k] = ref.value;
+                  const newVal = [refValue];
+                  if (canSetRef(ref)) {
+                    ref.value = newVal;
+                  }
+                  if (rawRef.k) refs[rawRef.k] = newVal;
                 }
               } else if (!existing.includes(refValue)) {
                 existing.push(refValue);
@@ -4567,15 +4627,23 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
               setupState[ref] = value;
             }
           } else if (_isRef) {
-            ref.value = value;
+            if (canSetRef(ref)) {
+              ref.value = value;
+            }
             if (rawRef.k) refs[rawRef.k] = value;
           } else {
             warn$1("Invalid template ref type:", ref, `(${typeof ref})`);
           }
         };
         if (value) {
-          queuePostRenderEffect(doSet, -1, parentSuspense);
+          const job = () => {
+            doSet();
+            pendingSetRefMap.delete(rawRef);
+          };
+          pendingSetRefMap.set(rawRef, job);
+          queuePostRenderEffect(job, -1, parentSuspense);
         } else {
+          invalidatePendingSetRef(rawRef);
           doSet();
         }
       } else {
@@ -4583,6 +4651,29 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
       }
     }
   }
+  function createCanSetSetupRefChecker(setupState) {
+    const rawSetupState = toRaw(setupState);
+    return setupState === void 0 || setupState === EMPTY_OBJ ? NO : (key) => {
+      {
+        if (hasOwn(rawSetupState, key) && !isRef(rawSetupState[key])) {
+          warn$1(
+            `Template ref "${key}" used on a non-ref value. It will not work in the production build.`
+          );
+        }
+        if (knownTemplateRefs.has(rawSetupState[key])) {
+          return false;
+        }
+      }
+      return hasOwn(rawSetupState, key);
+    };
+  }
+  function invalidatePendingSetRef(rawRef) {
+    const pendingSetRef = pendingSetRefMap.get(rawRef);
+    if (pendingSetRef) {
+      pendingSetRef.flags |= 4;
+      pendingSetRefMap.delete(rawRef);
+    }
+  }
 
   let hasLoggedMismatchError = false;
   const logMismatchError = () => {
@@ -4679,7 +4770,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
           }
           break;
         case Comment:
-          if (isTemplateNode(node)) {
+          if (isTemplateNode$1(node)) {
             nextNode = nextSibling(node);
             replaceNode(
               vnode.el = node.content.firstChild,
@@ -4727,9 +4818,15 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
             );
           }
           break;
+        case VaporSlot:
+          nextNode = getVaporInterface(parentComponent, vnode).hydrateSlot(
+            vnode,
+            node
+          );
+          break;
         default:
           if (shapeFlag & 1) {
-            if ((domType !== 1 || vnode.type.toLowerCase() !== node.tagName.toLowerCase()) && !isTemplateNode(node)) {
+            if ((domType !== 1 || vnode.type.toLowerCase() !== node.tagName.toLowerCase()) && !isTemplateNode$1(node)) {
               nextNode = onMismatch();
             } else {
               nextNode = hydrateElement(
@@ -4742,9 +4839,6 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
               );
             }
           } else if (shapeFlag & 6) {
-            if (vnode.type.__vapor) {
-              throw new Error("Vapor component hydration is not supported yet.");
-            }
             vnode.slotScopeIds = slotScopeIds;
             const container = parentNode(node);
             if (isFragmentStart) {
@@ -4754,15 +4848,25 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
             } else {
               nextNode = nextSibling(node);
             }
-            mountComponent(
-              vnode,
-              container,
-              null,
-              parentComponent,
-              parentSuspense,
-              getContainerType(container),
-              optimized
-            );
+            if (vnode.type.__vapor) {
+              getVaporInterface(parentComponent, vnode).hydrate(
+                vnode,
+                node,
+                container,
+                null,
+                parentComponent
+              );
+            } else {
+              mountComponent(
+                vnode,
+                container,
+                null,
+                parentComponent,
+                parentSuspense,
+                getContainerType(container),
+                optimized
+              );
+            }
             if (isAsyncWrapper(vnode) && !vnode.type.__asyncResolved) {
               let subTree;
               if (isFragmentStart) {
@@ -4819,7 +4923,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
           invokeDirectiveHook(vnode, null, parentComponent, "created");
         }
         let needCallTransitionHooks = false;
-        if (isTemplateNode(el)) {
+        if (isTemplateNode$1(el)) {
           needCallTransitionHooks = needTransition(
             null,
             // no need check parentSuspense in hydration
@@ -4847,7 +4951,7 @@ Details: https://v3-migration.vuejs.org/breaking-changes/migration-build.html`
           );
           let hasWarned = false;
           while (next) {
-            if (!isMismatchAllowed(el, 1 /* CHILDREN */)) {
+            if (!isMismatchAllowed(el, 1)) {
               if (!hasWarned) {
                 warn$1(
                   `Hydration children mismatch on`,
@@ -4868,14 +4972,16 @@ Server rendered element contains more child nodes than client vdom.`
           if (clientText[0] === "\n" && (el.tagName === "PRE" || el.tagName === "TEXTAREA")) {
             clientText = clientText.slice(1);
           }
-          if (el.textContent !== clientText) {
-            if (!isMismatchAllowed(el, 0 /* TEXT */)) {
+          const { textContent } = el;
+          if (textContent !== clientText && // innerHTML normalize \r\n or \r into a single \n in the DOM
+          textContent !== clientText.replace(/\r\n|\r/g, "\n")) {
+            if (!isMismatchAllowed(el, 0)) {
               warn$1(
                 `Hydration text content mismatch on`,
                 el,
                 `
-  - rendered on server: ${el.textContent}
-  - expected on client: ${vnode.children}`
+  - rendered on server: ${textContent}
+  - expected on client: ${clientText}`
               );
               logMismatchError();
             }
@@ -4951,7 +5057,7 @@ Server rendered element contains more child nodes than client vdom.`
         } else if (isText && !vnode.children) {
           insert(vnode.el = createText(""), container);
         } else {
-          if (!isMismatchAllowed(container, 1 /* CHILDREN */)) {
+          if (!isMismatchAllowed(container, 1)) {
             if (!hasWarned) {
               warn$1(
                 `Hydration children mismatch on`,
@@ -5001,7 +5107,7 @@ Server rendered element contains fewer child nodes than client vdom.`
       }
     };
     const handleMismatch = (node, vnode, parentComponent, parentSuspense, slotScopeIds, isFragment) => {
-      if (!isMismatchAllowed(node.parentElement, 1 /* CHILDREN */)) {
+      if (!isMismatchAllowed(node.parentElement, 1)) {
         warn$1(
           `Hydration node mismatch:
 - rendered on server:`,
@@ -5074,11 +5180,11 @@ Server rendered element contains fewer child nodes than client vdom.`
         parent = parent.parent;
       }
     };
-    const isTemplateNode = (node) => {
-      return node.nodeType === 1 && node.tagName === "TEMPLATE";
-    };
     return [hydrate, hydrateNode];
   }
+  const isTemplateNode$1 = (node) => {
+    return node.nodeType === 1 && node.tagName === "TEMPLATE";
+  };
   function propHasMismatch(el, key, clientValue, vnode, instance) {
     let mismatchType;
     let mismatchKey;
@@ -5093,7 +5199,7 @@ Server rendered element contains fewer child nodes than client vdom.`
       }
       expected = normalizeClass(clientValue);
       if (!isSetEqual(toClassSet(actual || ""), toClassSet(expected))) {
-        mismatchType = 2 /* CLASS */;
+        mismatchType = 2;
         mismatchKey = `class`;
       }
     } else if (key === "style") {
@@ -5112,31 +5218,43 @@ Server rendered element contains fewer child nodes than client vdom.`
         resolveCssVars(instance, vnode, expectedMap);
       }
       if (!isMapEqual(actualMap, expectedMap)) {
-        mismatchType = 3 /* STYLE */;
+        mismatchType = 3;
         mismatchKey = "style";
       }
-    } else if (el instanceof SVGElement && isKnownSvgAttr(key) || el instanceof HTMLElement && (isBooleanAttr(key) || isKnownHtmlAttr(key))) {
-      if (isBooleanAttr(key)) {
-        actual = el.hasAttribute(key);
-        expected = includeBooleanAttr(clientValue);
-      } else if (clientValue == null) {
-        actual = el.hasAttribute(key);
-        expected = false;
-      } else {
-        if (el.hasAttribute(key)) {
-          actual = el.getAttribute(key);
-        } else if (key === "value" && el.tagName === "TEXTAREA") {
-          actual = el.value;
-        } else {
-          actual = false;
-        }
-        expected = isRenderableAttrValue(clientValue) ? String(clientValue) : false;
-      }
+    } else if (isValidHtmlOrSvgAttribute(el, key)) {
+      ({ actual, expected } = getAttributeMismatch(el, key, clientValue));
       if (actual !== expected) {
-        mismatchType = 4 /* ATTRIBUTE */;
+        mismatchType = 4;
         mismatchKey = key;
       }
     }
+    return warnPropMismatch(el, mismatchKey, mismatchType, actual, expected);
+  }
+  function getAttributeMismatch(el, key, clientValue) {
+    let actual;
+    let expected;
+    if (isBooleanAttr(key)) {
+      actual = el.hasAttribute(key);
+      expected = includeBooleanAttr(clientValue);
+    } else if (clientValue == null) {
+      actual = el.hasAttribute(key);
+      expected = false;
+    } else {
+      if (el.hasAttribute(key)) {
+        actual = el.getAttribute(key);
+      } else if (key === "value" && el.tagName === "TEXTAREA") {
+        actual = el.value;
+      } else {
+        actual = false;
+      }
+      expected = isRenderableAttrValue(clientValue) ? String(clientValue) : false;
+    }
+    return { actual, expected };
+  }
+  function isValidHtmlOrSvgAttribute(el, key) {
+    return el instanceof SVGElement && isKnownSvgAttr(key) || el instanceof HTMLElement && (isBooleanAttr(key) || isKnownHtmlAttr(key));
+  }
+  function warnPropMismatch(el, mismatchKey, mismatchType, actual, expected) {
     if (mismatchType != null && !isMismatchAllowed(el, mismatchType)) {
       const format = (v) => v === false ? `(not rendered)` : `${mismatchKey}="${v}"`;
       const preSegment = `Hydration ${MismatchTypeString[mismatchType]} mismatch on`;
@@ -5208,14 +5326,14 @@ Server rendered element contains fewer child nodes than client vdom.`
   }
   const allowMismatchAttr = "data-allow-mismatch";
   const MismatchTypeString = {
-    [0 /* TEXT */]: "text",
-    [1 /* CHILDREN */]: "children",
-    [2 /* CLASS */]: "class",
-    [3 /* STYLE */]: "style",
-    [4 /* ATTRIBUTE */]: "attribute"
+    [0]: "text",
+    [1]: "children",
+    [2]: "class",
+    [3]: "style",
+    [4]: "attribute"
   };
   function isMismatchAllowed(el, allowedType) {
-    if (allowedType === 0 /* TEXT */ || allowedType === 1 /* CHILDREN */) {
+    if (allowedType === 0 || allowedType === 1) {
       while (el && !el.hasAttribute(allowMismatchAttr)) {
         el = el.parentElement;
       }
@@ -5227,7 +5345,7 @@ Server rendered element contains fewer child nodes than client vdom.`
       return true;
     } else {
       const list = allowedAttr.split(",");
-      if (allowedType === 0 /* TEXT */ && list.includes("children")) {
+      if (allowedType === 0 && list.includes("children")) {
         return true;
       }
       return list.includes(MismatchTypeString[allowedType]);
@@ -5284,7 +5402,9 @@ Server rendered element contains fewer child nodes than client vdom.`
         hasHydrated = true;
         teardown();
         hydrate();
-        e.target.dispatchEvent(new e.constructor(e.type, e));
+        if (!(`$evt${e.type}` in e.target)) {
+          e.target.dispatchEvent(new e.constructor(e.type, e));
+        }
       }
     };
     const teardown = () => {
@@ -5326,104 +5446,46 @@ Server rendered element contains fewer child nodes than client vdom.`
   }
 
   const isAsyncWrapper = (i) => !!i.type.__asyncLoader;
-  /*! #__NO_SIDE_EFFECTS__ */
   // @__NO_SIDE_EFFECTS__
   function defineAsyncComponent(source) {
-    if (isFunction(source)) {
-      source = { loader: source };
-    }
     const {
-      loader,
-      loadingComponent,
-      errorComponent,
-      delay = 200,
-      hydrate: hydrateStrategy,
-      timeout,
-      // undefined = never times out
-      suspensible = true,
-      onError: userOnError
-    } = source;
-    let pendingRequest = null;
-    let resolvedComp;
-    let retries = 0;
-    const retry = () => {
-      retries++;
-      pendingRequest = null;
-      return load();
-    };
-    const load = () => {
-      let thisRequest;
-      return pendingRequest || (thisRequest = pendingRequest = loader().catch((err) => {
-        err = err instanceof Error ? err : new Error(String(err));
-        if (userOnError) {
-          return new Promise((resolve, reject) => {
-            const userRetry = () => resolve(retry());
-            const userFail = () => reject(err);
-            userOnError(err, userRetry, userFail, retries + 1);
-          });
-        } else {
-          throw err;
-        }
-      }).then((comp) => {
-        if (thisRequest !== pendingRequest && pendingRequest) {
-          return pendingRequest;
-        }
-        if (!comp) {
-          warn$1(
-            `Async component loader resolved to undefined. If you are using retry(), make sure to return its return value.`
-          );
-        }
-        if (comp && (comp.__esModule || comp[Symbol.toStringTag] === "Module")) {
-          comp = comp.default;
-        }
-        if (comp && !isObject(comp) && !isFunction(comp)) {
-          throw new Error(`Invalid async component load result: ${comp}`);
-        }
-        resolvedComp = comp;
-        return comp;
-      }));
-    };
+      load,
+      getResolvedComp,
+      setPendingRequest,
+      source: {
+        loadingComponent,
+        errorComponent,
+        delay,
+        hydrate: hydrateStrategy,
+        timeout,
+        suspensible = true
+      }
+    } = createAsyncComponentContext(source);
     return defineComponent({
       name: "AsyncComponentWrapper",
       __asyncLoader: load,
       __asyncHydrate(el, instance, hydrate) {
-        let patched = false;
-        const doHydrate = hydrateStrategy ? () => {
-          const performHydrate = () => {
-            if (patched) {
-              warn$1(
-                `Skipping lazy hydration for component '${getComponentName(resolvedComp)}': it was updated before lazy hydration performed.`
-              );
-              return;
-            }
-            hydrate();
-          };
-          const teardown = hydrateStrategy(
-            performHydrate,
-            (cb) => forEachElement(el, cb)
-          );
-          if (teardown) {
-            (instance.bum || (instance.bum = [])).push(teardown);
-          }
-          (instance.u || (instance.u = [])).push(() => patched = true);
-        } : hydrate;
-        if (resolvedComp) {
-          doHydrate();
-        } else {
-          load().then(() => !instance.isUnmounted && doHydrate());
-        }
+        performAsyncHydrate(
+          el,
+          instance,
+          hydrate,
+          getResolvedComp,
+          load,
+          hydrateStrategy
+        );
       },
       get __asyncResolved() {
-        return resolvedComp;
+        return getResolvedComp();
       },
       setup() {
         const instance = currentInstance;
         markAsyncBoundary(instance);
+        let resolvedComp = getResolvedComp();
         if (resolvedComp) {
           return () => createInnerComp(resolvedComp, instance);
         }
         const onError = (err) => {
-          pendingRequest = null;
+          setPendingRequest(null);
           handleError(
             err,
             instance,
@@ -5441,25 +5503,11 @@ Server rendered element contains fewer child nodes than client vdom.`
             }) : null;
           });
         }
-        const loaded = ref(false);
-        const error = ref();
-        const delayed = ref(!!delay);
-        if (delay) {
-          setTimeout(() => {
-            delayed.value = false;
-          }, delay);
-        }
-        if (timeout != null) {
-          setTimeout(() => {
-            if (!loaded.value && !error.value) {
-              const err = new Error(
-                `Async component timed out after ${timeout}ms.`
-              );
-              onError(err);
-              error.value = err;
-            }
-          }, timeout);
-        }
+        const { loaded, error, delayed } = useAsyncComponentState(
+          delay,
+          timeout,
+          onError
+        );
         load().then(() => {
           loaded.value = true;
           if (instance.parent && instance.parent.vnode && isKeepAlive(instance.parent.vnode)) {
@@ -5470,6 +5518,7 @@ Server rendered element contains fewer child nodes than client vdom.`
           error.value = err;
         });
         return () => {
+          resolvedComp = getResolvedComp();
           if (loaded.value && resolvedComp) {
             return createInnerComp(resolvedComp, instance);
           } else if (error.value && errorComponent) {
@@ -5477,7 +5526,10 @@ Server rendered element contains fewer child nodes than client vdom.`
               error: error.value
             });
           } else if (loadingComponent && !delayed.value) {
-            return createVNode(loadingComponent);
+            return createInnerComp(
+              loadingComponent,
+              instance
+            );
           }
         };
       }
@@ -5491,6 +5543,108 @@ Server rendered element contains fewer child nodes than client vdom.`
     delete parent.vnode.ce;
     return vnode;
   }
+  function createAsyncComponentContext(source) {
+    if (isFunction(source)) {
+      source = { loader: source };
+    }
+    const { loader, onError: userOnError } = source;
+    let pendingRequest = null;
+    let resolvedComp;
+    let retries = 0;
+    const retry = () => {
+      retries++;
+      pendingRequest = null;
+      return load();
+    };
+    const load = () => {
+      let thisRequest;
+      return pendingRequest || (thisRequest = pendingRequest = loader().catch((err) => {
+        err = err instanceof Error ? err : new Error(String(err));
+        if (userOnError) {
+          return new Promise((resolve, reject) => {
+            const userRetry = () => resolve(retry());
+            const userFail = () => reject(err);
+            userOnError(err, userRetry, userFail, retries + 1);
+          });
+        } else {
+          throw err;
+        }
+      }).then((comp) => {
+        if (thisRequest !== pendingRequest && pendingRequest) {
+          return pendingRequest;
+        }
+        if (!comp) {
+          warn$1(
+            `Async component loader resolved to undefined. If you are using retry(), make sure to return its return value.`
+          );
+        }
+        if (comp && (comp.__esModule || comp[Symbol.toStringTag] === "Module")) {
+          comp = comp.default;
+        }
+        if (comp && !isObject(comp) && !isFunction(comp)) {
+          throw new Error(`Invalid async component load result: ${comp}`);
+        }
+        resolvedComp = comp;
+        return comp;
+      }));
+    };
+    return {
+      load,
+      source,
+      getResolvedComp: () => resolvedComp,
+      setPendingRequest: (request) => pendingRequest = request
+    };
+  }
+  const useAsyncComponentState = (delay, timeout, onError) => {
+    const loaded = ref(false);
+    const error = ref();
+    const delayed = ref(!!delay);
+    if (delay) {
+      setTimeout(() => {
+        delayed.value = false;
+      }, delay);
+    }
+    if (timeout != null) {
+      setTimeout(() => {
+        if (!loaded.value && !error.value) {
+          const err = new Error(`Async component timed out after ${timeout}ms.`);
+          onError(err);
+          error.value = err;
+        }
+      }, timeout);
+    }
+    return { loaded, error, delayed };
+  };
+  function performAsyncHydrate(el, instance, hydrate, getResolvedComp, load, hydrateStrategy) {
+    let patched = false;
+    (instance.bu || (instance.bu = [])).push(() => patched = true);
+    const performHydrate = () => {
+      if (patched) {
+        {
+          const resolvedComp = getResolvedComp();
+          warn$1(
+            `Skipping lazy hydration for component '${getComponentName(resolvedComp) || resolvedComp.__file}': it was updated before lazy hydration performed.`
+          );
+        }
+        return;
+      }
+      hydrate();
+    };
+    const doHydrate = hydrateStrategy ? () => {
+      const teardown = hydrateStrategy(
+        performHydrate,
+        (cb) => forEachElement(el, cb)
+      );
+      if (teardown) {
+        (instance.bum || (instance.bum = [])).push(teardown);
+      }
+    } : performHydrate;
+    if (getResolvedComp()) {
+      doHydrate();
+    } else {
+      load().then(() => !instance.isUnmounted && doHydrate());
+    }
+  }
 
   const isKeepAlive = (vnode) => vnode.type.__isKeepAlive;
   const KeepAliveImpl = {
@@ -5514,86 +5668,37 @@ Server rendered element contains fewer child nodes than client vdom.`
         keepAliveInstance.__v_cache = cache;
       }
       const parentSuspense = keepAliveInstance.suspense;
+      const { renderer } = sharedContext;
       const {
-        renderer: {
-          p: patch,
-          m: move,
-          um: _unmount,
-          o: { createElement }
-        }
-      } = sharedContext;
+        um: _unmount,
+        o: { createElement }
+      } = renderer;
       const storageContainer = createElement("div");
+      sharedContext.getStorageContainer = () => storageContainer;
+      sharedContext.getCachedComponent = (vnode) => {
+        const key = vnode.key == null ? vnode.type : vnode.key;
+        return cache.get(key);
+      };
       sharedContext.activate = (vnode, container, anchor, namespace, optimized) => {
-        const instance = vnode.component;
-        move(
+        activate(
           vnode,
           container,
           anchor,
-          0,
+          renderer,
           keepAliveInstance,
-          parentSuspense
-        );
-        patch(
-          instance.vnode,
-          vnode,
-          container,
-          anchor,
-          instance,
           parentSuspense,
           namespace,
-          vnode.slotScopeIds,
           optimized
         );
-        queuePostRenderEffect(
-          () => {
-            instance.isDeactivated = false;
-            if (instance.a) {
-              invokeArrayFns(instance.a);
-            }
-            const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
-            if (vnodeHook) {
-              invokeVNodeHook(vnodeHook, instance.parent, vnode);
-            }
-          },
-          void 0,
-          parentSuspense
-        );
-        {
-          devtoolsComponentAdded(instance);
-        }
       };
       sharedContext.deactivate = (vnode) => {
-        const instance = vnode.component;
-        invalidateMount(instance.m);
-        invalidateMount(instance.a);
-        move(
+        deactivate(
           vnode,
           storageContainer,
-          null,
-          1,
+          renderer,
           keepAliveInstance,
           parentSuspense
         );
-        queuePostRenderEffect(
-          () => {
-            if (instance.da) {
-              invokeArrayFns(instance.da);
-            }
-            const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
-            if (vnodeHook) {
-              invokeVNodeHook(vnodeHook, instance.parent, vnode);
-            }
-            instance.isDeactivated = true;
-          },
-          void 0,
-          parentSuspense
-        );
-        {
-          devtoolsComponentAdded(instance);
-        }
-        {
-          instance.__keepAliveStorageContainer = storageContainer;
-        }
       };
       function unmount(vnode) {
         resetShapeFlag(vnode);
@@ -5744,7 +5849,7 @@ Server rendered element contains fewer child nodes than client vdom.`
   function onDeactivated(hook, target) {
     registerKeepAliveHook(hook, "da", target);
   }
-  function registerKeepAliveHook(hook, type, target = getCurrentInstance()) {
+  function registerKeepAliveHook(hook, type, target = getCurrentGenericInstance()) {
     const wrappedHook = hook.__wdc || (hook.__wdc = () => {
       let current = target;
       while (current) {
@@ -5758,32 +5863,98 @@ Server rendered element contains fewer child nodes than client vdom.`
     injectHook(type, wrappedHook, target);
     if (target) {
       let current = target.parent;
-      while (current && current.parent && current.parent.vnode) {
-        if (isKeepAlive(current.parent.vnode)) {
+      while (current && current.parent) {
+        let parent = current.parent;
+        if (isKeepAlive(parent.vapor ? parent : parent.vnode)) {
           injectToKeepAliveRoot(wrappedHook, type, target, current);
         }
         current = current.parent;
       }
     }
   }
-  function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
-    const injected = injectHook(
-      type,
-      hook,
-      keepAliveRoot,
-      true
-      /* prepend */
+  function injectToKeepAliveRoot(hook, type, target, keepAliveRoot) {
+    const injected = injectHook(
+      type,
+      hook,
+      keepAliveRoot,
+      true
+      /* prepend */
+    );
+    onUnmounted(() => {
+      remove(keepAliveRoot[type], injected);
+    }, target);
+  }
+  function resetShapeFlag(vnode) {
+    vnode.shapeFlag &= -257;
+    vnode.shapeFlag &= -513;
+  }
+  function getInnerChild(vnode) {
+    return vnode.shapeFlag & 128 ? vnode.ssContent : vnode;
+  }
+  function activate(vnode, container, anchor, { p: patch, m: move }, parentComponent, parentSuspense, namespace, optimized) {
+    const instance = vnode.component;
+    move(
+      vnode,
+      container,
+      anchor,
+      0,
+      parentComponent,
+      parentSuspense
+    );
+    patch(
+      instance.vnode,
+      vnode,
+      container,
+      anchor,
+      instance,
+      parentSuspense,
+      namespace,
+      vnode.slotScopeIds,
+      optimized
+    );
+    queuePostRenderEffect(
+      () => {
+        instance.isDeactivated = false;
+        if (instance.a) {
+          invokeArrayFns(instance.a);
+        }
+        const vnodeHook = vnode.props && vnode.props.onVnodeMounted;
+        if (vnodeHook) {
+          invokeVNodeHook(vnodeHook, instance.parent, vnode);
+        }
+      },
+      void 0,
+      parentSuspense
+    );
+    {
+      devtoolsComponentAdded(instance);
+    }
+  }
+  function deactivate(vnode, container, { m: move }, parentComponent, parentSuspense) {
+    const instance = vnode.component;
+    invalidateMount(instance.m);
+    invalidateMount(instance.a);
+    move(vnode, container, null, 1, parentComponent, parentSuspense);
+    queuePostRenderEffect(
+      () => {
+        if (instance.da) {
+          invokeArrayFns(instance.da);
+        }
+        const vnodeHook = vnode.props && vnode.props.onVnodeUnmounted;
+        if (vnodeHook) {
+          invokeVNodeHook(vnodeHook, instance.parent, vnode);
+        }
+        instance.isDeactivated = true;
+      },
+      void 0,
+      parentSuspense
     );
-    onUnmounted(() => {
-      remove(keepAliveRoot[type], injected);
-    }, target);
-  }
-  function resetShapeFlag(vnode) {
-    vnode.shapeFlag &= -257;
-    vnode.shapeFlag &= -513;
-  }
-  function getInnerChild(vnode) {
-    return vnode.shapeFlag & 128 ? vnode.ssContent : vnode;
+    {
+      devtoolsComponentAdded(instance);
+    }
+    {
+      instance.__keepAliveStorageContainer = container;
+    }
   }
 
   function injectHook(type, hook, target = currentInstance, prepend = false) {
@@ -6260,12 +6431,13 @@ If this is a native custom element, make sure to exclude it from component resol
       return ret;
     }
     if (currentRenderingInstance && (currentRenderingInstance.ce || currentRenderingInstance.parent && isAsyncWrapper(currentRenderingInstance.parent) && currentRenderingInstance.parent.ce)) {
+      const hasProps = Object.keys(props).length > 0;
       if (name !== "default") props.name = name;
       return openBlock(), createBlock(
         Fragment,
         null,
         [createVNode("slot", props, fallback && fallback())],
-        64
+        hasProps ? -2 : 64
       );
     }
     if (slot && slot.length > 1) {
@@ -6279,6 +6451,7 @@ If this is a native custom element, make sure to exclude it from component resol
     }
     openBlock();
     const validSlotContent = slot && ensureValidVNode(slot(props));
+    ensureVaporSlotFallback(validSlotContent, fallback);
     const slotKey = props.key || // slot content array of a dynamic conditional slot may have a branch
     // key attached in the `createSlots` helper, respect that
     validSlotContent && validSlotContent.key;
@@ -6308,6 +6481,14 @@ If this is a native custom element, make sure to exclude it from component resol
       return true;
     }) ? vnodes : null;
   }
+  function ensureVaporSlotFallback(vnodes, fallback) {
+    let vaporSlot;
+    if (vnodes && vnodes.length === 1 && isVNode(vnodes[0]) && (vaporSlot = vnodes[0].vs)) {
+      if (!vaporSlot.fallback && fallback) {
+        vaporSlot.fallback = fallback;
+      }
+    }
+  }
 
   function toHandlers(obj, preserveCaseIfNecessary) {
     const ret = {};
@@ -6369,7 +6550,7 @@ If this is a native custom element, make sure to exclude it from component resol
     }
     return renderSlot(instance.slots, name, props, fallback && (() => fallback));
   }
-  function legacyresolveScopedSlots(fns, raw, hasDynamicKeys) {
+  function legacyResolveScopedSlots(fns, raw, hasDynamicKeys) {
     return createSlots(
       raw || { $stable: !hasDynamicKeys },
       mapKeyToName(fns)
@@ -6536,7 +6717,7 @@ If this is a native custom element, make sure to exclude it from component resol
       _b: () => legacyBindObjectProps,
       _v: () => createTextVNode,
       _e: () => createCommentVNode,
-      _u: () => legacyresolveScopedSlots,
+      _u: () => legacyResolveScopedSlots,
       _g: () => legacyBindObjectListeners,
       _d: () => legacyBindDynamicKeys,
       _p: () => legacyPrependModifier
@@ -6708,10 +6889,10 @@ If this is a native custom element, make sure to exclude it from component resol
       return true;
     },
     has({
-      _: { data, setupState, accessCache, ctx, appContext, propsOptions }
+      _: { data, setupState, accessCache, ctx, appContext, propsOptions, type }
     }, key) {
-      let normalizedProps;
-      return !!accessCache[key] || data !== EMPTY_OBJ && hasOwn(data, key) || hasSetupBinding(setupState, key) || (normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key) || hasOwn(ctx, key) || hasOwn(publicPropertiesMap, key) || hasOwn(appContext.config.globalProperties, key);
+      let normalizedProps, cssModules;
+      return !!(accessCache[key] || data !== EMPTY_OBJ && key[0] !== "$" && hasOwn(data, key) || hasSetupBinding(setupState, key) || (normalizedProps = propsOptions[0]) && hasOwn(normalizedProps, key) || hasOwn(ctx, key) || hasOwn(publicPropertiesMap, key) || hasOwn(appContext.config.globalProperties, key) || (cssModules = type.__cssModules) && cssModules[key]);
     },
     defineProperty(target, key, descriptor) {
       if (descriptor.get != null) {
@@ -6863,15 +7044,15 @@ If this is a native custom element, make sure to exclude it from component resol
     return null;
   }
   function useSlots() {
-    return getContext().slots;
+    return getContext("useSlots").slots;
   }
   function useAttrs() {
-    return getContext().attrs;
+    return getContext("useAttrs").attrs;
   }
-  function getContext() {
+  function getContext(calledFunctionName) {
     const i = getCurrentGenericInstance();
     if (!i) {
-      warn$1(`useContext() called without active instance.`);
+      warn$1(`${calledFunctionName}() called without active instance.`);
     }
     if (i.vapor) {
       return i;
@@ -7135,7 +7316,8 @@ If this is a native custom element, make sure to exclude it from component resol
         expose.forEach((key) => {
           Object.defineProperty(exposed, key, {
             get: () => publicThis[key],
-            set: (val) => publicThis[key] = val
+            set: (val) => publicThis[key] = val,
+            enumerable: true
           });
         });
       } else if (!instance.exposed) {
@@ -7458,7 +7640,7 @@ If this is a native custom element, make sure to exclude it from component resol
         return vm;
       }
     }
-    Vue.version = `2.6.14-compat:${"3.6.0-alpha.2"}`;
+    Vue.version = `2.6.14-compat:${"3.6.0-alpha.4"}`;
     Vue.config = singletonApp.config;
     Vue.use = (plugin, ...options) => {
       if (plugin && isFunction(plugin.install)) {
@@ -7472,22 +7654,22 @@ If this is a native custom element, make sure to exclude it from component resol
       singletonApp.mixin(m);
       return Vue;
     };
-    Vue.component = (name, comp) => {
+    Vue.component = ((name, comp) => {
       if (comp) {
         singletonApp.component(name, comp);
         return Vue;
       } else {
         return singletonApp.component(name);
       }
-    };
-    Vue.directive = (name, dir) => {
+    });
+    Vue.directive = ((name, dir) => {
       if (dir) {
         singletonApp.directive(name, dir);
         return Vue;
       } else {
         return singletonApp.directive(name);
       }
-    };
+    });
     Vue.options = { _base: Vue };
     let cid = 1;
     Vue.cid = cid;
@@ -7550,14 +7732,14 @@ If this is a native custom element, make sure to exclude it from component resol
       assertCompatEnabled("GLOBAL_OBSERVABLE", null);
       return reactive(target);
     };
-    Vue.filter = (name, filter) => {
+    Vue.filter = ((name, filter) => {
       if (filter) {
         singletonApp.filter(name, filter);
         return Vue;
       } else {
         return singletonApp.filter(name);
       }
-    };
+    });
     const util = {
       warn: warn$1 ,
       extend,
@@ -7716,7 +7898,7 @@ If this is a native custom element, make sure to exclude it from component resol
           {
             for (let i = 0; i < container.attributes.length; i++) {
               const attr = container.attributes[i];
-              if (attr.name !== "v-cloak" && /^(v-|:|@)/.test(attr.name)) {
+              if (attr.name !== "v-cloak" && /^(?:v-|:|@)/.test(attr.name)) {
                 warnDeprecation$1("GLOBAL_MOUNT_CONTAINER", null);
                 break;
               }
@@ -8550,7 +8732,7 @@ If you want to remount the same app, move your app creation logic into a factory
     return args.some((elem) => elem.toLowerCase() === "boolean");
   }
 
-  const isInternalKey = (key) => key[0] === "_" || key === "$stable";
+  const isInternalKey = (key) => key === "_" || key === "_ctx" || key === "$stable";
   const normalizeSlotValue = (value) => isArray(value) ? value.map(normalizeVNode) : [normalizeVNode(value)];
   const normalizeSlot = (key, rawSlot, ctx) => {
     if (rawSlot._n) {
@@ -8604,8 +8786,6 @@ If you want to remount the same app, move your app creation logic into a factory
   const initSlots = (instance, children, optimized) => {
     const slots = instance.slots = createInternalObject();
     if (instance.vnode.shapeFlag & 32) {
-      const cacheIndexes = children.__;
-      if (cacheIndexes) def(slots, "__", cacheIndexes, true);
       const type = children._;
       if (type) {
         assignSlots(slots, children, optimized);
@@ -8669,12 +8849,10 @@ If you want to remount the same app, move your app creation logic into a factory
     if (instance.appContext.config.performance && isSupported()) {
       const startTag = `vue-${type}-${instance.uid}`;
       const endTag = startTag + `:end`;
+      const measureName = `<${formatComponentName(instance, instance.type)}> ${type}`;
       perf.mark(endTag);
-      perf.measure(
-        `<${formatComponentName(instance, instance.type)}> ${type}`,
-        startTag,
-        endTag
-      );
+      perf.measure(measureName, startTag, endTag);
+      perf.clearMeasures(measureName);
       perf.clearMarks(startTag);
       perf.clearMarks(endTag);
     }
@@ -8913,15 +9091,25 @@ If you want to remount the same app, move your app creation logic into a factory
           optimized
         );
       } else {
-        patchElement(
-          n1,
-          n2,
-          parentComponent,
-          parentSuspense,
-          namespace,
-          slotScopeIds,
-          optimized
-        );
+        const customElement = !!(n1.el && n1.el._isVueCE) ? n1.el : null;
+        try {
+          if (customElement) {
+            customElement._beginPatch();
+          }
+          patchElement(
+            n1,
+            n2,
+            parentComponent,
+            parentSuspense,
+            namespace,
+            slotScopeIds,
+            optimized
+          );
+        } finally {
+          if (customElement) {
+            customElement._endPatch();
+          }
+        }
       }
     };
     const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
@@ -8972,16 +9160,20 @@ If you want to remount the same app, move your app creation logic into a factory
       if (dirs) {
         invokeDirectiveHook(vnode, null, parentComponent, "beforeMount");
       }
-      const needCallTransitionHooks = needTransition(parentSuspense, transition);
-      if (needCallTransitionHooks) {
-        transition.beforeEnter(el);
+      if (transition) {
+        performTransitionEnter(
+          el,
+          transition,
+          () => hostInsert(el, container, anchor),
+          parentSuspense
+        );
+      } else {
+        hostInsert(el, container, anchor);
       }
-      hostInsert(el, container, anchor);
-      if ((vnodeHook = props && props.onVnodeMounted) || needCallTransitionHooks || dirs) {
+      if ((vnodeHook = props && props.onVnodeMounted) || dirs) {
         queuePostRenderEffect(
           () => {
             vnodeHook && invokeVNodeHook(vnodeHook, parentComponent, vnode);
-            needCallTransitionHooks && transition.enter(el);
             dirs && invokeDirectiveHook(vnode, null, parentComponent, "mounted");
           },
           void 0,
@@ -8998,21 +9190,9 @@ If you want to remount the same app, move your app creation logic into a factory
           hostSetScopeId(el, slotScopeIds[i]);
         }
       }
-      let subTree = parentComponent && parentComponent.subTree;
-      if (subTree) {
-        if (subTree.patchFlag > 0 && subTree.patchFlag & 2048) {
-          subTree = filterSingleRoot(subTree.children) || subTree;
-        }
-        if (vnode === subTree || isSuspense(subTree.type) && (subTree.ssContent === vnode || subTree.ssFallback === vnode)) {
-          const parentVNode = parentComponent.vnode;
-          setScopeId(
-            el,
-            parentVNode,
-            parentVNode.scopeId,
-            parentVNode.slotScopeIds,
-            parentComponent.parent
-          );
-        }
+      const inheritedScopeIds = getInheritedScopeIds(vnode, parentComponent);
+      for (let i = 0; i < inheritedScopeIds.length; i++) {
+        hostSetScopeId(el, inheritedScopeIds[i]);
       }
     };
     const mountChildren = (children, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, start = 0) => {
@@ -9253,12 +9433,21 @@ If you want to remount the same app, move your app creation logic into a factory
       n2.slotScopeIds = slotScopeIds;
       if (n2.type.__vapor) {
         if (n1 == null) {
-          getVaporInterface(parentComponent, n2).mount(
-            n2,
-            container,
-            anchor,
-            parentComponent
-          );
+          if (n2.shapeFlag & 512) {
+            getVaporInterface(parentComponent, n2).activate(
+              n2,
+              container,
+              anchor,
+              parentComponent
+            );
+          } else {
+            getVaporInterface(parentComponent, n2).mount(
+              n2,
+              container,
+              anchor,
+              parentComponent
+            );
+          }
         } else {
           getVaporInterface(parentComponent, n2).update(
             n1,
@@ -9322,6 +9511,7 @@ If you want to remount the same app, move your app creation logic into a factory
         if (!initialVNode.el) {
           const placeholder = instance.subTree = createVNode(Comment);
           processCommentNode(null, placeholder, container, anchor);
+          initialVNode.placeholder = placeholder.el;
         }
       } else {
         setupRenderEffect(
@@ -9889,7 +10079,11 @@ If you want to remount the same app, move your app creation logic into a factory
         for (i = toBePatched - 1; i >= 0; i--) {
           const nextIndex = s2 + i;
           const nextChild = c2[nextIndex];
-          const anchor = nextIndex + 1 < l2 ? c2[nextIndex + 1].el : parentAnchor;
+          const anchorVNode = c2[nextIndex + 1];
+          const anchor = nextIndex + 1 < l2 ? (
+            // #13559, fallback to el placeholder for unresolved async component
+            anchorVNode.el || anchorVNode.placeholder
+          ) : parentAnchor;
           if (newIndexToOldIndexMap[i] === 0) {
             patch(
               null,
@@ -9969,12 +10163,12 @@ If you want to remount the same app, move your app creation logic into a factory
       const needTransition2 = moveType !== 2 && shapeFlag & 1 && transition;
       if (needTransition2) {
         if (moveType === 0) {
-          transition.beforeEnter(el);
-          hostInsert(el, container, anchor);
-          queuePostRenderEffect(
-            () => transition.enter(el),
-            void 0,
-            parentSuspense
+          performTransitionEnter(
+            el,
+            transition,
+            () => hostInsert(el, container, anchor),
+            parentSuspense,
+            true
           );
         } else {
           const { leave, delayLeave, afterLeave } = transition;
@@ -9986,6 +10180,12 @@ If you want to remount the same app, move your app creation logic into a factory
             }
           };
           const performLeave = () => {
+            if (el._isLeaving) {
+              el[leaveCbKey](
+                true
+                /* cancelled */
+              );
+            }
             leave(el, () => {
               remove2();
               afterLeave && afterLeave();
@@ -10025,7 +10225,14 @@ If you want to remount the same app, move your app creation logic into a factory
         parentComponent.renderCache[cacheIndex] = void 0;
       }
       if (shapeFlag & 256) {
-        parentComponent.ctx.deactivate(vnode);
+        if (vnode.type.__vapor) {
+          getVaporInterface(parentComponent, vnode).deactivate(
+            vnode,
+            parentComponent.ctx.getStorageContainer()
+          );
+        } else {
+          parentComponent.ctx.deactivate(vnode);
+        }
         return;
       }
       const shouldInvokeDirs = shapeFlag & 1 && dirs;
@@ -10113,22 +10320,15 @@ If you want to remount the same app, move your app creation logic into a factory
         removeStaticNode(vnode);
         return;
       }
-      const performRemove = () => {
-        hostRemove(el);
-        if (transition && !transition.persisted && transition.afterLeave) {
-          transition.afterLeave();
-        }
-      };
-      if (vnode.shapeFlag & 1 && transition && !transition.persisted) {
-        const { leave, delayLeave } = transition;
-        const performLeave = () => leave(el, performRemove);
-        if (delayLeave) {
-          delayLeave(vnode.el, performRemove, performLeave);
-        } else {
-          performLeave();
-        }
+      if (transition) {
+        performTransitionLeave(
+          el,
+          transition,
+          () => hostRemove(el),
+          !!(vnode.shapeFlag & 1)
+        );
       } else {
-        performRemove();
+        hostRemove(el);
       }
     };
     const removeFragment = (cur, end) => {
@@ -10144,27 +10344,12 @@ If you want to remount the same app, move your app creation logic into a factory
       if (instance.type.__hmrId) {
         unregisterHMR(instance);
       }
-      const {
-        bum,
-        scope,
-        effect,
-        subTree,
-        um,
-        m,
-        a,
-        parent,
-        slots: { __: slotCacheKeys }
-      } = instance;
+      const { bum, scope, effect, subTree, um, m, a } = instance;
       invalidateMount(m);
       invalidateMount(a);
       if (bum) {
         invokeArrayFns(bum);
       }
-      if (parent && isArray(slotCacheKeys)) {
-        slotCacheKeys.forEach((v) => {
-          parent.renderCache[v] = void 0;
-        });
-      }
       if (isCompatEnabled$1("INSTANCE_EVENT_HOOKS", instance)) {
         instance.emit("hook:beforeDestroy");
       }
@@ -10188,12 +10373,6 @@ If you want to remount the same app, move your app creation logic into a factory
         void 0,
         parentSuspense
       );
-      if (parentSuspense && parentSuspense.pendingBranch && !parentSuspense.isUnmounted && instance.asyncDep && !instance.asyncResolved && instance.suspenseId === parentSuspense.pendingId) {
-        parentSuspense.deps--;
-        if (parentSuspense.deps === 0) {
-          parentSuspense.resolve();
-        }
-      }
       {
         devtoolsComponentRemoved(instance);
       }
@@ -10206,7 +10385,7 @@ If you want to remount the same app, move your app creation logic into a factory
     const getNextHostNode = (vnode) => {
       if (vnode.shapeFlag & 6) {
         if (vnode.type.__vapor) {
-          return hostNextSibling(vnode.component.block);
+          return hostNextSibling(vnode.anchor);
         }
         return getNextHostNode(vnode.component.subTree);
       }
@@ -10284,6 +10463,7 @@ If you want to remount the same app, move your app creation logic into a factory
     return {
       render,
       hydrate,
+      hydrateNode,
       internals,
       createApp: createAppAPI(
         mountApp,
@@ -10325,7 +10505,8 @@ If you want to remount the same app, move your app creation logic into a factory
           if (!shallow && c2.patchFlag !== -2)
             traverseStaticChildren(c1, c2);
         }
-        if (c2.type === Text) {
+        if (c2.type === Text && // avoid cached text nodes retaining detached dom nodes
+        c2.patchFlag !== -1) {
           c2.el = c1.el;
         }
         if (c2.type === Comment && !c2.el) {
@@ -10338,7 +10519,7 @@ If you want to remount the same app, move your app creation logic into a factory
     }
   }
   function locateNonHydratedAsyncRoot(instance) {
-    const subComponent = instance.vapor ? null : instance.subTree.component;
+    const subComponent = instance.subTree && instance.subTree.component;
     if (subComponent) {
       if (subComponent.asyncDep && !subComponent.asyncResolved) {
         return subComponent;
@@ -10353,6 +10534,34 @@ If you want to remount the same app, move your app creation logic into a factory
         hooks[i].flags |= 4;
     }
   }
+  function performTransitionEnter(el, transition, insert, parentSuspense, force = false) {
+    if (force || needTransition(parentSuspense, transition)) {
+      transition.beforeEnter(el);
+      insert();
+      queuePostRenderEffect(() => transition.enter(el), void 0, parentSuspense);
+    } else {
+      insert();
+    }
+  }
+  function performTransitionLeave(el, transition, remove, isElement = true) {
+    const performRemove = () => {
+      remove();
+      if (transition && !transition.persisted && transition.afterLeave) {
+        transition.afterLeave();
+      }
+    };
+    if (isElement && transition && !transition.persisted) {
+      const { leave, delayLeave } = transition;
+      const performLeave = () => leave(el, performRemove);
+      if (delayLeave) {
+        delayLeave(el, performRemove, performLeave);
+      } else {
+        performLeave();
+      }
+    } else {
+      performRemove();
+    }
+  }
   function getVaporInterface(instance, vnode) {
     const ctx = instance ? instance.appContext : vnode.appContext;
     const res = ctx && ctx.vapor;
@@ -10367,6 +10576,32 @@ app.use(vaporInteropPlugin)
     }
     return res;
   }
+  function getInheritedScopeIds(vnode, parentComponent) {
+    const inheritedScopeIds = [];
+    let currentParent = parentComponent;
+    let currentVNode = vnode;
+    while (currentParent) {
+      let subTree = currentParent.subTree;
+      if (!subTree) break;
+      if (subTree.patchFlag > 0 && subTree.patchFlag & 2048) {
+        subTree = filterSingleRoot(subTree.children) || subTree;
+      }
+      if (currentVNode === subTree || isSuspense(subTree.type) && (subTree.ssContent === currentVNode || subTree.ssFallback === currentVNode)) {
+        const parentVNode = currentParent.vnode;
+        if (parentVNode.scopeId) {
+          inheritedScopeIds.push(parentVNode.scopeId);
+        }
+        if (parentVNode.slotScopeIds) {
+          inheritedScopeIds.push(...parentVNode.slotScopeIds);
+        }
+        currentVNode = parentVNode;
+        currentParent = currentParent.parent;
+      } else {
+        break;
+      }
+    }
+    return inheritedScopeIds;
+  }
 
   const ssrContextKey = Symbol.for("v-scx");
   const useSSRContext = () => {
@@ -10582,7 +10817,7 @@ app.use(vaporInteropPlugin)
     return res;
   }
   const getModelModifiers = (props, modelName, getter) => {
-    return modelName === "modelValue" || modelName === "model-value" ? getter(props, "modelModifiers") : getter(props, `${modelName}Modifiers`) || getter(props, `${camelize(modelName)}Modifiers`) || getter(props, `${hyphenate(modelName)}Modifiers`);
+    return getter(props, getModifierPropName(modelName)) || getter(props, `${camelize(modelName)}Modifiers`) || getter(props, `${hyphenate(modelName)}Modifiers`);
   };
 
   function emit(instance, event, ...rawArgs) {
@@ -10687,8 +10922,9 @@ app.use(vaporInteropPlugin)
   function defaultPropGetter(props, key) {
     return props[key];
   }
+  const mixinEmitsCache = /* @__PURE__ */ new WeakMap();
   function normalizeEmitsOptions(comp, appContext, asMixin = false) {
-    const cache = appContext.emitsCache;
+    const cache = asMixin ? mixinEmitsCache : appContext.emitsCache;
     const cached = cache.get(comp);
     if (cached !== void 0) {
       return cached;
@@ -11160,7 +11396,7 @@ app.use(vaporInteropPlugin)
     const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense;
     if (pendingBranch) {
       suspense.pendingBranch = newBranch;
-      if (isSameVNodeType(newBranch, pendingBranch)) {
+      if (isSameVNodeType(pendingBranch, newBranch)) {
         patch(
           pendingBranch,
           newBranch,
@@ -11231,7 +11467,7 @@ app.use(vaporInteropPlugin)
             );
             setActiveBranch(suspense, newFallback);
           }
-        } else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
+        } else if (activeBranch && isSameVNodeType(activeBranch, newBranch)) {
           patch(
             activeBranch,
             newBranch,
@@ -11262,7 +11498,7 @@ app.use(vaporInteropPlugin)
         }
       }
     } else {
-      if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
+      if (activeBranch && isSameVNodeType(activeBranch, newBranch)) {
         patch(
           activeBranch,
           newBranch,
@@ -11375,7 +11611,8 @@ app.use(vaporInteropPlugin)
           pendingId,
           effects,
           parentComponent: parentComponent2,
-          container: container2
+          container: container2,
+          isInFallback
         } = suspense;
         let delayEnter = false;
         if (suspense.isHydrating) {
@@ -11393,6 +11630,9 @@ app.use(vaporInteropPlugin)
                   parentComponent2
                 );
                 queuePostFlushCb(effects);
+                if (isInFallback && vnode2.ssFallback) {
+                  vnode2.ssFallback.el = null;
+                }
               }
             };
           }
@@ -11401,6 +11641,9 @@ app.use(vaporInteropPlugin)
               anchor = next(activeBranch);
             }
             unmount(activeBranch, parentComponent2, suspense, true);
+            if (!delayEnter && isInFallback && vnode2.ssFallback) {
+              vnode2.ssFallback.el = null;
+            }
           }
           if (!delayEnter) {
             move(
@@ -11525,6 +11768,7 @@ app.use(vaporInteropPlugin)
             optimized2
           );
           if (placeholder) {
+            vnode2.placeholder = null;
             remove(placeholder);
           }
           updateHOCHostEl(instance, vnode2.el);
@@ -11787,15 +12031,11 @@ app.use(vaporInteropPlugin)
     );
   };
   const normalizeKey = ({ key }) => key != null ? key : null;
-  const normalizeRef = ({
-    ref,
-    ref_key,
-    ref_for
-  }) => {
+  const normalizeRef = ({ ref, ref_key, ref_for }, i = currentRenderingInstance) => {
     if (typeof ref === "number") {
       ref = "" + ref;
     }
-    return ref != null ? isString(ref) || isRef(ref) || isFunction(ref) ? { i: currentRenderingInstance, r: ref, k: ref_key, f: !!ref_for } : ref : null;
+    return ref != null ? isString(ref) || isRef(ref) || isFunction(ref) ? { i, r: ref, k: ref_key, f: !!ref_for } : ref : null;
   };
   function createBaseVNode(type, props = null, children = null, patchFlag = 0, dynamicProps = null, shapeFlag = type === Fragment ? 0 : 1, isBlockNode = false, needFullChildrenNormalization = false) {
     const vnode = {
@@ -11968,6 +12208,7 @@ Component that was made reactive: `,
       suspense: vnode.suspense,
       ssContent: vnode.ssContent && cloneVNode(vnode.ssContent),
       ssFallback: vnode.ssFallback && cloneVNode(vnode.ssFallback),
+      placeholder: vnode.placeholder,
       el: vnode.el,
       anchor: vnode.anchor,
       ctx: vnode.ctx,
@@ -12118,6 +12359,25 @@ Component that was made reactive: `,
       simpleSetCurrentInstance(instance);
     }
   };
+  const internalOptions = ["ce", "type"];
+  const useInstanceOption = (key, silent = false) => {
+    const instance = getCurrentGenericInstance();
+    if (!instance) {
+      if (!silent) {
+        warn$1(`useInstanceOption called without an active component instance.`);
+      }
+      return { hasInstance: false, value: void 0 };
+    }
+    if (!internalOptions.includes(key)) {
+      {
+        warn$1(
+          `useInstanceOption only accepts  ${internalOptions.map((k) => `'${k}'`).join(", ")} as key, got '${key}'.`
+        );
+      }
+      return { hasInstance: true, value: void 0 };
+    }
+    return { hasInstance: true, value: instance[key] };
+  };
 
   const emptyAppContext = createAppContext();
   let uid = 0;
@@ -12495,7 +12755,7 @@ Component that was made reactive: `,
       return instance.proxy;
     }
   }
-  const classifyRE = /(?:^|[-_])(\w)/g;
+  const classifyRE = /(?:^|[-_])\w/g;
   const classify = (str) => str.replace(classifyRE, (c) => c.toUpperCase()).replace(/[-_]/g, "");
   function getComponentName(Component, includeInferred = true) {
     return isFunction(Component) ? Component.displayName || Component.name : Component.name || includeInferred && Component.__name;
@@ -12531,23 +12791,28 @@ Component that was made reactive: `,
   };
 
   function h(type, propsOrChildren, children) {
-    const l = arguments.length;
-    if (l === 2) {
-      if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
-        if (isVNode(propsOrChildren)) {
-          return createVNode(type, null, [propsOrChildren]);
+    try {
+      setBlockTracking(-1);
+      const l = arguments.length;
+      if (l === 2) {
+        if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
+          if (isVNode(propsOrChildren)) {
+            return createVNode(type, null, [propsOrChildren]);
+          }
+          return createVNode(type, propsOrChildren);
+        } else {
+          return createVNode(type, null, propsOrChildren);
         }
-        return createVNode(type, propsOrChildren);
       } else {
-        return createVNode(type, null, propsOrChildren);
-      }
-    } else {
-      if (l > 3) {
-        children = Array.prototype.slice.call(arguments, 2);
-      } else if (l === 3 && isVNode(children)) {
-        children = [children];
+        if (l > 3) {
+          children = Array.prototype.slice.call(arguments, 2);
+        } else if (l === 3 && isVNode(children)) {
+          children = [children];
+        }
+        return createVNode(type, propsOrChildren, children);
       }
-      return createVNode(type, propsOrChildren, children);
+    } finally {
+      setBlockTracking(1);
     }
   }
 
@@ -12757,7 +13022,7 @@ Component that was made reactive: `,
     return true;
   }
 
-  const version = "3.6.0-alpha.2";
+  const version = "3.6.0-alpha.4";
   const warn = warn$1 ;
   const ErrorTypeStrings = ErrorTypeStrings$1 ;
   const devtools = devtools$1 ;
@@ -13015,11 +13280,11 @@ Component that was made reactive: `,
           addTransitionClass(el, legacyLeaveFromClass);
         }
         if (!el._enterCancelled) {
-          forceReflow();
+          forceReflow(el);
           addTransitionClass(el, leaveActiveClass);
         } else {
           addTransitionClass(el, leaveActiveClass);
-          forceReflow();
+          forceReflow(el);
         }
         nextFrame(() => {
           if (!el._isLeaving) {
@@ -13148,7 +13413,7 @@ Component that was made reactive: `,
       type = timeout > 0 ? transitionTimeout > animationTimeout ? TRANSITION$1 : ANIMATION : null;
       propCount = type ? type === TRANSITION$1 ? transitionDurations.length : animationDurations.length : 0;
     }
-    const hasTransform = type === TRANSITION$1 && /\b(transform|all)(,|$)/.test(
+    const hasTransform = type === TRANSITION$1 && /\b(?:transform|all)(?:,|$)/.test(
       getStyleProperties(`${TRANSITION$1}Property`).toString()
     );
     return {
@@ -13168,8 +13433,9 @@ Component that was made reactive: `,
     if (s === "auto") return 0;
     return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
   }
-  function forceReflow() {
-    return document.body.offsetHeight;
+  function forceReflow(el) {
+    const targetDocument = el ? el.ownerDocument : document;
+    return targetDocument.body.offsetHeight;
   }
 
   function patchClass(el, value, isSVG) {
@@ -13189,6 +13455,8 @@ Component that was made reactive: `,
   const vShowOriginalDisplay = Symbol("_vod");
   const vShowHidden = Symbol("_vsh");
   const vShow = {
+    // used for prop mismatch check during hydration
+    name: "show",
     beforeMount(el, { value }, { transition }) {
       el[vShowOriginalDisplay] = el.style.display === "none" ? "" : el.style.display;
       if (transition && value) {
@@ -13222,9 +13490,6 @@ Component that was made reactive: `,
       setDisplay(el, value);
     }
   };
-  {
-    vShow.name = "show";
-  }
   function setDisplay(el, value) {
     el.style.display = value ? el[vShowOriginalDisplay] : "none";
     el[vShowHidden] = !value;
@@ -13303,7 +13568,7 @@ Component that was made reactive: `,
     }
   }
 
-  const displayRE = /(^|;)\s*display\s*:/;
+  const displayRE = /(?:^|;)\s*display\s*:/;
   function patchStyle(el, prev, next) {
     const style = el.style;
     const isCssString = isString(next);
@@ -13652,11 +13917,10 @@ Expected function or array of functions, received type ${typeof value}.`
   }
 
   const REMOVAL = {};
-  /*! #__NO_SIDE_EFFECTS__ */
   // @__NO_SIDE_EFFECTS__
   function defineCustomElement(options, extraOptions, _createApp) {
-    const Comp = defineComponent(options, extraOptions);
-    if (isPlainObject(Comp)) extend(Comp, extraOptions);
+    let Comp = defineComponent(options, extraOptions);
+    if (isPlainObject(Comp)) Comp = extend({}, Comp, extraOptions);
     class VueCustomElement extends VueElement {
       constructor(initialProps) {
         super(Comp, initialProps, _createApp);
@@ -13665,18 +13929,14 @@ Expected function or array of functions, received type ${typeof value}.`
     VueCustomElement.def = Comp;
     return VueCustomElement;
   }
-  /*! #__NO_SIDE_EFFECTS__ */
-  const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
+  const defineSSRCustomElement = (/* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
     return /* @__PURE__ */ defineCustomElement(options, extraOptions, createSSRApp);
-  };
+  });
   const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
   };
-  class VueElement extends BaseClass {
-    constructor(_def, _props = {}, _createApp = createApp) {
+  class VueElementBase extends BaseClass {
+    constructor(def, props = {}, createAppFn) {
       super();
-      this._def = _def;
-      this._props = _props;
-      this._createApp = _createApp;
       this._isVueCE = true;
       /**
        * @internal
@@ -13686,25 +13946,26 @@ Expected function or array of functions, received type ${typeof value}.`
        * @internal
        */
       this._app = null;
-      /**
-       * @internal
-       */
-      this._nonce = this._def.nonce;
       this._connected = false;
       this._resolved = false;
       this._numberProps = null;
       this._styleChildren = /* @__PURE__ */ new WeakSet();
+      this._patching = false;
+      this._dirty = false;
       this._ob = null;
-      if (this.shadowRoot && _createApp !== createApp) {
+      this._def = def;
+      this._props = props;
+      this._createApp = createAppFn;
+      this._nonce = def.nonce;
+      if (this._needsHydration()) {
         this._root = this.shadowRoot;
       } else {
-        if (this.shadowRoot) {
-          warn(
-            `Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
+        if (def.shadowRoot !== false) {
+          this.attachShadow(
+            extend({}, def.shadowRootOptions, {
+              mode: "open"
+            })
           );
-        }
-        if (_def.shadowRoot !== false) {
-          this.attachShadow({ mode: "open" });
           this._root = this.shadowRoot;
         } else {
           this._root = this;
@@ -13719,14 +13980,14 @@ Expected function or array of functions, received type ${typeof value}.`
       this._connected = true;
       let parent = this;
       while (parent = parent && (parent.parentNode || parent.host)) {
-        if (parent instanceof VueElement) {
+        if (parent instanceof VueElementBase) {
           this._parent = parent;
           break;
         }
       }
       if (!this._instance) {
         if (this._resolved) {
-          this._mount(this._def);
+          this._mountComponent(this._def);
         } else {
           if (parent && parent._pendingResolve) {
             this._pendingResolve = parent._pendingResolve.then(() => {
@@ -13739,8 +14000,24 @@ Expected function or array of functions, received type ${typeof value}.`
         }
       }
     }
+    disconnectedCallback() {
+      this._connected = false;
+      nextTick(() => {
+        if (!this._connected) {
+          if (this._ob) {
+            this._ob.disconnect();
+            this._ob = null;
+          }
+          this._unmount();
+          if (this._teleportTargets) {
+            this._teleportTargets.clear();
+            this._teleportTargets = void 0;
+          }
+        }
+      });
+    }
     _setParent(parent = this._parent) {
-      if (parent) {
+      if (parent && this._instance) {
         this._instance.parent = parent._instance;
         this._inheritParentContext(parent);
       }
@@ -13753,19 +14030,10 @@ Expected function or array of functions, received type ${typeof value}.`
         );
       }
     }
-    disconnectedCallback() {
-      this._connected = false;
-      nextTick(() => {
-        if (!this._connected) {
-          if (this._ob) {
-            this._ob.disconnect();
-            this._ob = null;
-          }
-          this._app && this._app.unmount();
-          if (this._instance) this._instance.ce = void 0;
-          this._app = this._instance = null;
-        }
-      });
+    _processMutations(mutations) {
+      for (const m of mutations) {
+        this._setAttr(m.attributeName);
+      }
     }
     /**
      * resolve inner component definition (handle possible async component)
@@ -13777,13 +14045,9 @@ Expected function or array of functions, received type ${typeof value}.`
       for (let i = 0; i < this.attributes.length; i++) {
         this._setAttr(this.attributes[i].name);
       }
-      this._ob = new MutationObserver((mutations) => {
-        for (const m of mutations) {
-          this._setAttr(m.attributeName);
-        }
-      });
+      this._ob = new MutationObserver(this._processMutations.bind(this));
       this._ob.observe(this, { attributes: true });
-      const resolve = (def, isAsync = false) => {
+      const resolve = (def) => {
         this._resolved = true;
         this._pendingResolve = void 0;
         const { props, styles } = def;
@@ -13808,29 +14072,25 @@ Expected function or array of functions, received type ${typeof value}.`
             "Custom element style injection is not supported when using shadowRoot: false"
           );
         }
-        this._mount(def);
+        this._mountComponent(def);
       };
       const asyncDef = this._def.__asyncLoader;
       if (asyncDef) {
+        const { configureApp } = this._def;
         this._pendingResolve = asyncDef().then((def) => {
-          def.configureApp = this._def.configureApp;
-          resolve(this._def = def, true);
+          def.configureApp = configureApp;
+          this._def = def;
+          resolve(def);
         });
       } else {
         resolve(this._def);
       }
     }
-    _mount(def) {
-      if (!def.name) {
-        def.name = "VueElement";
-      }
-      this._app = this._createApp(def);
-      this._inheritParentContext();
-      if (def.configureApp) {
-        def.configureApp(this._app);
-      }
-      this._app._ceVNode = this._createVNode();
-      this._app.mount(this._root);
+    _mountComponent(def) {
+      this._mount(def);
+      this._processExposed();
+    }
+    _processExposed() {
       const exposed = this._instance && this._instance.exposed;
       if (!exposed) return;
       for (const key in exposed) {
@@ -13844,6 +14104,38 @@ Expected function or array of functions, received type ${typeof value}.`
         }
       }
     }
+    _processInstance() {
+      this._instance.ce = this;
+      this._instance.isCE = true;
+      {
+        this._instance.ceReload = (newStyles) => {
+          if (this._styles) {
+            this._styles.forEach((s) => this._root.removeChild(s));
+            this._styles.length = 0;
+          }
+          this._applyStyles(newStyles);
+          if (!this._instance.vapor) {
+            this._instance = null;
+          }
+          this._update();
+        };
+      }
+      const dispatch = (event, args) => {
+        this.dispatchEvent(
+          new CustomEvent(
+            event,
+            isPlainObject(args[0]) ? extend({ detail: args }, args[0]) : { detail: args }
+          )
+        );
+      };
+      this._instance.emit = (event, ...args) => {
+        dispatch(event, args);
+        if (hyphenate(event) !== event) {
+          dispatch(hyphenate(event), args);
+        }
+      };
+      this._setParent();
+    }
     _resolveProps(def) {
       const { props } = def;
       const declaredPropKeys = isArray(props) ? props : Object.keys(props || {});
@@ -13858,7 +14150,7 @@ Expected function or array of functions, received type ${typeof value}.`
             return this._getProp(key);
           },
           set(val) {
-            this._setProp(key, val, true, true);
+            this._setProp(key, val, true, !this._patching);
           }
         });
       }
@@ -13884,11 +14176,12 @@ Expected function or array of functions, received type ${typeof value}.`
      */
     _setProp(key, val, shouldReflect = true, shouldUpdate = false) {
       if (val !== this._props[key]) {
+        this._dirty = true;
         if (val === REMOVAL) {
           delete this._props[key];
         } else {
           this._props[key] = val;
-          if (key === "key" && this._app) {
+          if (key === "key" && this._app && this._app._ceVNode) {
             this._app._ceVNode.key = val;
           }
         }
@@ -13897,7 +14190,10 @@ Expected function or array of functions, received type ${typeof value}.`
         }
         if (shouldReflect) {
           const ob = this._ob;
-          ob && ob.disconnect();
+          if (ob) {
+            this._processMutations(ob.takeRecords());
+            ob.disconnect();
+          }
           if (val === true) {
             this.setAttribute(hyphenate(key), "");
           } else if (typeof val === "string" || typeof val === "number") {
@@ -13909,52 +14205,6 @@ Expected function or array of functions, received type ${typeof value}.`
         }
       }
     }
-    _update() {
-      const vnode = this._createVNode();
-      if (this._app) vnode.appContext = this._app._context;
-      render(vnode, this._root);
-    }
-    _createVNode() {
-      const baseProps = {};
-      if (!this.shadowRoot) {
-        baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
-      }
-      const vnode = createVNode(this._def, extend(baseProps, this._props));
-      if (!this._instance) {
-        vnode.ce = (instance) => {
-          this._instance = instance;
-          instance.ce = this;
-          instance.isCE = true;
-          {
-            instance.ceReload = (newStyles) => {
-              if (this._styles) {
-                this._styles.forEach((s) => this._root.removeChild(s));
-                this._styles.length = 0;
-              }
-              this._applyStyles(newStyles);
-              this._instance = null;
-              this._update();
-            };
-          }
-          const dispatch = (event, args) => {
-            this.dispatchEvent(
-              new CustomEvent(
-                event,
-                isPlainObject(args[0]) ? extend({ detail: args }, args[0]) : { detail: args }
-              )
-            );
-          };
-          instance.emit = (event, ...args) => {
-            dispatch(event, args);
-            if (hyphenate(event) !== event) {
-              dispatch(hyphenate(event), args);
-            }
-          };
-          this._setParent();
-        };
-      }
-      return vnode;
-    }
     _applyStyles(styles, owner) {
       if (!styles) return;
       if (owner) {
@@ -14001,13 +14251,15 @@ Expected function or array of functions, received type ${typeof value}.`
      * Only called when shadowRoot is false
      */
     _renderSlots() {
-      const outlets = (this._teleportTarget || this).querySelectorAll("slot");
+      const outlets = this._getSlots();
       const scopeId = this._instance.type.__scopeId;
+      const slotReplacements = /* @__PURE__ */ new Map();
       for (let i = 0; i < outlets.length; i++) {
         const o = outlets[i];
         const slotName = o.getAttribute("name") || "default";
         const content = this._slots[slotName];
         const parent = o.parentNode;
+        const replacementNodes = [];
         if (content) {
           for (const n of content) {
             if (scopeId && n.nodeType === 1) {
@@ -14020,18 +14272,58 @@ Expected function or array of functions, received type ${typeof value}.`
               }
             }
             parent.insertBefore(n, o);
+            replacementNodes.push(n);
           }
         } else {
-          while (o.firstChild) parent.insertBefore(o.firstChild, o);
+          while (o.firstChild) {
+            const child = o.firstChild;
+            parent.insertBefore(child, o);
+            replacementNodes.push(child);
+          }
         }
         parent.removeChild(o);
+        slotReplacements.set(o, replacementNodes);
+      }
+      this._updateSlotNodes(slotReplacements);
+    }
+    /**
+     * @internal
+     */
+    _getSlots() {
+      const roots = [this];
+      if (this._teleportTargets) {
+        roots.push(...this._teleportTargets);
       }
+      const slots = /* @__PURE__ */ new Set();
+      for (const root of roots) {
+        const found = root.querySelectorAll("slot");
+        for (let i = 0; i < found.length; i++) {
+          slots.add(found[i]);
+        }
+      }
+      return Array.from(slots);
+    }
+    /**
+     * @internal
+     */
+    _injectChildStyle(comp) {
+      this._applyStyles(comp.styles, comp);
     }
     /**
      * @internal
      */
-    _injectChildStyle(comp) {
-      this._applyStyles(comp.styles, comp);
+    _beginPatch() {
+      this._patching = true;
+      this._dirty = false;
+    }
+    /**
+     * @internal
+     */
+    _endPatch() {
+      this._patching = false;
+      if (this._dirty && this._instance) {
+        this._update();
+      }
     }
     /**
      * @internal
@@ -14049,13 +14341,76 @@ Expected function or array of functions, received type ${typeof value}.`
       }
     }
   }
+  class VueElement extends VueElementBase {
+    constructor(def, props = {}, createAppFn = createApp) {
+      super(def, props, createAppFn);
+    }
+    _needsHydration() {
+      if (this.shadowRoot && this._createApp !== createApp) {
+        return true;
+      } else {
+        if (this.shadowRoot) {
+          warn(
+            `Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
+          );
+        }
+      }
+      return false;
+    }
+    _mount(def) {
+      if (!def.name) {
+        def.name = "VueElement";
+      }
+      this._app = this._createApp(def);
+      this._inheritParentContext();
+      if (def.configureApp) {
+        def.configureApp(this._app);
+      }
+      this._app._ceVNode = this._createVNode();
+      this._app.mount(this._root);
+    }
+    _update() {
+      if (!this._app) return;
+      const vnode = this._createVNode();
+      vnode.appContext = this._app._context;
+      render(vnode, this._root);
+    }
+    _unmount() {
+      if (this._app) {
+        this._app.unmount();
+      }
+      if (this._instance && this._instance.ce) {
+        this._instance.ce = void 0;
+      }
+      this._app = this._instance = null;
+    }
+    /**
+     * Only called when shadowRoot is false
+     */
+    _updateSlotNodes(replacements) {
+    }
+    _createVNode() {
+      const baseProps = {};
+      if (!this.shadowRoot) {
+        baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
+      }
+      const vnode = createVNode(this._def, extend(baseProps, this._props));
+      if (!this._instance) {
+        vnode.ce = (instance) => {
+          this._instance = instance;
+          this._processInstance();
+        };
+      }
+      return vnode;
+    }
+  }
   function useHost(caller) {
-    const instance = getCurrentInstance();
-    const el = instance && instance.ce;
+    const { hasInstance, value } = useInstanceOption("ce", true);
+    const el = value;
     if (el) {
       return el;
     } else {
-      if (!instance) {
+      if (!hasInstance) {
         warn(
           `${caller || "useHost"} called without an active component instance.`
         );
@@ -14116,26 +14471,13 @@ Expected function or array of functions, received type ${typeof value}.`
           prevChildren = [];
           return;
         }
-        prevChildren.forEach(callPendingCbs);
+        prevChildren.forEach((vnode) => callPendingCbs(vnode.el));
         prevChildren.forEach(recordPosition);
         const movedChildren = prevChildren.filter(applyTranslation);
-        forceReflow();
+        forceReflow(instance.vnode.el);
         movedChildren.forEach((c) => {
           const el = c.el;
-          const style = el.style;
-          addTransitionClass(el, moveClass);
-          style.transform = style.webkitTransform = style.transitionDuration = "";
-          const cb = el[moveCbKey] = (e) => {
-            if (e && e.target !== el) {
-              return;
-            }
-            if (!e || /transform$/.test(e.propertyName)) {
-              el.removeEventListener("transitionend", cb);
-              el[moveCbKey] = null;
-              removeTransitionClass(el, moveClass);
-            }
-          };
-          el.addEventListener("transitionend", cb);
+          handleMovedChildren(el, moveClass);
         });
         prevChildren = [];
       });
@@ -14164,10 +14506,10 @@ Expected function or array of functions, received type ${typeof value}.`
                   instance
                 )
               );
-              positionMap.set(
-                child,
-                child.el.getBoundingClientRect()
-              );
+              positionMap.set(child, {
+                left: child.el.offsetLeft,
+                top: child.el.offsetTop
+              });
             }
           }
         }
@@ -14188,8 +14530,7 @@ Expected function or array of functions, received type ${typeof value}.`
     }
   });
   const TransitionGroup = TransitionGroupImpl;
-  function callPendingCbs(c) {
-    const el = c.el;
+  function callPendingCbs(el) {
     if (el[moveCbKey]) {
       el[moveCbKey]();
     }
@@ -14198,19 +14539,30 @@ Expected function or array of functions, received type ${typeof value}.`
     }
   }
   function recordPosition(c) {
-    newPositionMap.set(c, c.el.getBoundingClientRect());
+    newPositionMap.set(c, {
+      left: c.el.offsetLeft,
+      top: c.el.offsetTop
+    });
   }
   function applyTranslation(c) {
-    const oldPos = positionMap.get(c);
-    const newPos = newPositionMap.get(c);
+    if (baseApplyTranslation(
+      positionMap.get(c),
+      newPositionMap.get(c),
+      c.el
+    )) {
+      return c;
+    }
+  }
+  function baseApplyTranslation(oldPos, newPos, el) {
     const dx = oldPos.left - newPos.left;
     const dy = oldPos.top - newPos.top;
     if (dx || dy) {
-      const s = c.el.style;
+      const s = el.style;
       s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
       s.transitionDuration = "0s";
-      return c;
+      return true;
     }
+    return false;
   }
   function hasCSSTransform(el, root, moveClass) {
     const clone = el.cloneNode();
@@ -14228,6 +14580,22 @@ Expected function or array of functions, received type ${typeof value}.`
     container.removeChild(clone);
     return hasTransform;
   }
+  const handleMovedChildren = (el, moveClass) => {
+    const style = el.style;
+    addTransitionClass(el, moveClass);
+    style.transform = style.webkitTransform = style.transitionDuration = "";
+    const cb = el[moveCbKey] = (e) => {
+      if (e && e.target !== el) {
+        return;
+      }
+      if (!e || e.propertyName.endsWith("transform")) {
+        el.removeEventListener("transitionend", cb);
+        el[moveCbKey] = null;
+        removeTransitionClass(el, moveClass);
+      }
+    };
+    el.addEventListener("transitionend", cb);
+  };
 
   const getModelAssigner = (vnode) => {
     const fn = vnode.props["onUpdate:modelValue"] || vnode.props["onModelCompat:input"];
@@ -14263,21 +14631,21 @@ Expected function or array of functions, received type ${typeof value}.`
       vModelTextUpdate(el, oldValue, value, trim, number, lazy);
     }
   };
+  function castValue(value, trim, number) {
+    if (trim) value = value.trim();
+    if (number) value = looseToNumber(value);
+    return value;
+  }
   const vModelTextInit = (el, trim, number, lazy, set) => {
     addEventListener(el, lazy ? "change" : "input", (e) => {
       if (e.target.composing) return;
-      let domValue = el.value;
-      if (trim) {
-        domValue = domValue.trim();
-      }
-      if (number || el.type === "number") {
-        domValue = looseToNumber(domValue);
-      }
-      (0, el[assignKey])(domValue);
+      (0, el[assignKey])(
+        castValue(el.value, trim, number || el.type === "number")
+      );
     });
-    if (trim) {
+    if (trim || number) {
       addEventListener(el, "change", () => {
-        el.value = el.value.trim();
+        el.value = castValue(el.value, trim, number || el.type === "number");
       });
     }
     if (!lazy) {
@@ -14526,13 +14894,13 @@ Expected function or array of functions, received type ${typeof value}.`
   const withModifiers = (fn, modifiers) => {
     const cache = fn._withMods || (fn._withMods = {});
     const cacheKey = modifiers.join(".");
-    return cache[cacheKey] || (cache[cacheKey] = (event, ...args) => {
+    return cache[cacheKey] || (cache[cacheKey] = ((event, ...args) => {
       for (let i = 0; i < modifiers.length; i++) {
         const guard = modifierGuards[modifiers[i]];
         if (guard && guard(event, modifiers)) return;
       }
       return fn(event, ...args);
-    });
+    }));
   };
   const keyNames = {
     esc: "escape",
@@ -14562,7 +14930,7 @@ Expected function or array of functions, received type ${typeof value}.`
     }
     const cache = fn._withKeys || (fn._withKeys = {});
     const cacheKey = modifiers.join(".");
-    return cache[cacheKey] || (cache[cacheKey] = (event) => {
+    return cache[cacheKey] || (cache[cacheKey] = ((event) => {
       if (!("key" in event)) {
         return;
       }
@@ -14592,7 +14960,7 @@ Expected function or array of functions, received type ${typeof value}.`
           }
         }
       }
-    });
+    }));
   };
 
   const rendererOptions = /* @__PURE__ */ extend({ patchProp }, nodeOps);
@@ -14606,13 +14974,13 @@ Expected function or array of functions, received type ${typeof value}.`
     enabledHydration = true;
     return renderer;
   }
-  const render = (...args) => {
+  const render = ((...args) => {
     ensureRenderer().render(...args);
-  };
-  const hydrate = (...args) => {
+  });
+  const hydrate = ((...args) => {
     ensureHydrationRenderer().hydrate(...args);
-  };
-  const createApp = (...args) => {
+  });
+  const createApp = ((...args) => {
     const app = ensureRenderer().createApp(...args);
     {
       injectNativeTagCheck(app);
@@ -14628,7 +14996,7 @@ Expected function or array of functions, received type ${typeof value}.`
         if (container.nodeType === 1) {
           for (let i = 0; i < container.attributes.length; i++) {
             const attr = container.attributes[i];
-            if (attr.name !== "v-cloak" && /^(v-|:|@)/.test(attr.name)) {
+            if (attr.name !== "v-cloak" && /^(?:v-|:|@)/.test(attr.name)) {
               compatUtils.warnDeprecation(
                 "GLOBAL_MOUNT_CONTAINER",
                 null
@@ -14649,8 +15017,8 @@ Expected function or array of functions, received type ${typeof value}.`
       return proxy;
     };
     return app;
-  };
-  const createSSRApp = (...args) => {
+  });
+  const createSSRApp = ((...args) => {
     const app = ensureHydrationRenderer().createApp(...args);
     {
       injectNativeTagCheck(app);
@@ -14664,7 +15032,7 @@ Expected function or array of functions, received type ${typeof value}.`
       }
     };
     return app;
-  };
+  });
   function resolveRootNamespace(container) {
     if (container instanceof SVGElement) {
       return "svg";
@@ -14748,6 +15116,7 @@ Expected function or array of functions, received type ${typeof value}.`
     TransitionGroup: TransitionGroup,
     TriggerOpTypes: TriggerOpTypes,
     VueElement: VueElement,
+    VueElementBase: VueElementBase,
     assertNumber: assertNumber,
     callWithAsyncErrorHandling: callWithAsyncErrorHandling,
     callWithErrorHandling: callWithErrorHandling,
@@ -14812,6 +15181,7 @@ Expected function or array of functions, received type ${typeof value}.`
     mergeModels: mergeModels,
     mergeProps: mergeProps,
     nextTick: nextTick,
+    nodeOps: nodeOps,
     normalizeClass: normalizeClass,
     normalizeProps: normalizeProps,
     normalizeStyle: normalizeStyle,
@@ -14830,6 +15200,7 @@ Expected function or array of functions, received type ${typeof value}.`
     onUpdated: onUpdated,
     onWatcherCleanup: onWatcherCleanup,
     openBlock: openBlock,
+    patchProp: patchProp,
     popScopeId: popScopeId,
     provide: provide,
     proxyRefs: proxyRefs,
@@ -14871,6 +15242,7 @@ Expected function or array of functions, received type ${typeof value}.`
     useCssVars: useCssVars,
     useHost: useHost,
     useId: useId,
+    useInstanceOption: useInstanceOption,
     useModel: useModel,
     useSSRContext: useSSRContext,
     useShadowRoot: useShadowRoot,
@@ -16163,7 +16535,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
         return BASE_TRANSITION;
     }
   }
-  const nonIdentifierRE = /^\d|[^\$\w\xA0-\uFFFF]/;
+  const nonIdentifierRE = /^$|^\d|[^\$\w\xA0-\uFFFF]/;
   const isSimpleIdentifier = (name) => !nonIdentifierRE.test(name);
   const validFirstIdentCharRE = /[A-Za-z_$\xA0-\uFFFF]/;
   const validIdentCharRE = /[\.\?\w$\xA0-\uFFFF]/;
@@ -16232,7 +16604,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     return !currentOpenBracketCount && !currentOpenParensCount;
   };
   const isMemberExpression = isMemberExpressionBrowser ;
-  const fnExpRE = /^\s*(async\s*)?(\([^)]*?\)|[\w$_]+)\s*(:[^=]+)?=>|^\s*(async\s+)?function(?:\s+[\w$]+)?\s*\(/;
+  const fnExpRE = /^\s*(?:async\s*)?(?:\([^)]*?\)|[\w$_]+)\s*(?::[^=]+)?=>|^\s*(?:async\s+)?function(?:\s+[\w$]+)?\s*\(/;
   const isFnExpressionBrowser = (exp) => fnExpRE.test(getExpSource(exp));
   const isFnExpression = isFnExpressionBrowser ;
   function assert(condition, msg) {
@@ -16275,6 +16647,9 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
   function isText$1(node) {
     return node.type === 5 || node.type === 2;
   }
+  function isVPre(p) {
+    return p.type === 7 && p.name === "pre";
+  }
   function isVSlot(p) {
     return p.type === 7 && p.name === "slot";
   }
@@ -16533,7 +16908,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     ondirarg(start, end) {
       if (start === end) return;
       const arg = getSlice(start, end);
-      if (inVPre) {
+      if (inVPre && !isVPre(currentProp)) {
         currentProp.name += arg;
         setLocEnd(currentProp.nameLoc, end);
       } else {
@@ -16548,7 +16923,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     },
     ondirmodifier(start, end) {
       const mod = getSlice(start, end);
-      if (inVPre) {
+      if (inVPre && !isVPre(currentProp)) {
         currentProp.name += "." + mod;
         setLocEnd(currentProp.nameLoc, end);
       } else if (currentProp.name === "slot") {
@@ -17176,6 +17551,11 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
       } else if (child.type === 12) {
         const constantType = doNotHoistNode ? 0 : getConstantType(child, context);
         if (constantType >= 2) {
+          if (child.codegenNode.type === 14 && child.codegenNode.arguments.length > 0) {
+            child.codegenNode.arguments.push(
+              -1 + (` /* ${PatchFlagNames[-1]} */` )
+            );
+          }
           toCache.push(child);
           continue;
         }
@@ -17204,7 +17584,6 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
       }
     }
     let cachedAsArray = false;
-    const slotCacheKeys = [];
     if (toCache.length === children.length && node.type === 1) {
       if (node.tagType === 0 && node.codegenNode && node.codegenNode.type === 13 && isArray(node.codegenNode.children)) {
         node.codegenNode.children = getCacheExpression(
@@ -17214,7 +17593,6 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
       } else if (node.tagType === 1 && node.codegenNode && node.codegenNode.type === 13 && node.codegenNode.children && !isArray(node.codegenNode.children) && node.codegenNode.children.type === 15) {
         const slot = getSlotNode(node.codegenNode, "default");
         if (slot) {
-          slotCacheKeys.push(context.cached.length);
           slot.returns = getCacheExpression(
             createArrayExpression(slot.returns)
           );
@@ -17224,7 +17602,6 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
         const slotName = findDir(node, "slot", true);
         const slot = slotName && slotName.arg && getSlotNode(parent.codegenNode, slotName.arg);
         if (slot) {
-          slotCacheKeys.push(context.cached.length);
           slot.returns = getCacheExpression(
             createArrayExpression(slot.returns)
           );
@@ -17234,23 +17611,12 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     }
     if (!cachedAsArray) {
       for (const child of toCache) {
-        slotCacheKeys.push(context.cached.length);
         child.codegenNode = context.cache(child.codegenNode);
       }
     }
-    if (slotCacheKeys.length && node.type === 1 && node.tagType === 1 && node.codegenNode && node.codegenNode.type === 13 && node.codegenNode.children && !isArray(node.codegenNode.children) && node.codegenNode.children.type === 15) {
-      node.codegenNode.children.properties.push(
-        createObjectProperty(
-          `__`,
-          createSimpleExpression(JSON.stringify(slotCacheKeys), false)
-        )
-      );
-    }
     function getCacheExpression(value) {
       const exp = context.cache(value);
-      if (inFor && context.hmr) {
-        exp.needArraySpread = true;
-      }
+      exp.needArraySpread = true;
       return exp;
     }
     function getSlotNode(node2, name) {
@@ -18381,7 +18747,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
   }
 
   const transformIf = createStructuralDirectiveTransform(
-    /^(if|else|else-if)$/,
+    /^(?:if|else|else-if)$/,
     (node, dir, context) => {
       return processIf(node, dir, context, (ifNode, branch, isRoot) => {
         const siblings = context.parent.children;
@@ -18450,7 +18816,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
           continue;
         }
         if (sibling && sibling.type === 9) {
-          if (dir.name === "else-if" && sibling.branches[sibling.branches.length - 1].condition === void 0) {
+          if ((dir.name === "else-if" || dir.name === "else") && sibling.branches[sibling.branches.length - 1].condition === void 0) {
             context.onError(
               createCompilerError(30, node.loc)
             );
@@ -18599,80 +18965,6 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     }
   }
 
-  const transformBind = (dir, _node, context) => {
-    const { modifiers, loc } = dir;
-    const arg = dir.arg;
-    let { exp } = dir;
-    if (exp && exp.type === 4 && !exp.content.trim()) {
-      {
-        exp = void 0;
-      }
-    }
-    if (!exp) {
-      if (arg.type !== 4 || !arg.isStatic) {
-        context.onError(
-          createCompilerError(
-            52,
-            arg.loc
-          )
-        );
-        return {
-          props: [
-            createObjectProperty(arg, createSimpleExpression("", true, loc))
-          ]
-        };
-      }
-      transformBindShorthand(dir);
-      exp = dir.exp;
-    }
-    if (arg.type !== 4) {
-      arg.children.unshift(`(`);
-      arg.children.push(`) || ""`);
-    } else if (!arg.isStatic) {
-      arg.content = `${arg.content} || ""`;
-    }
-    if (modifiers.some((mod) => mod.content === "camel")) {
-      if (arg.type === 4) {
-        if (arg.isStatic) {
-          arg.content = camelize(arg.content);
-        } else {
-          arg.content = `${context.helperString(CAMELIZE)}(${arg.content})`;
-        }
-      } else {
-        arg.children.unshift(`${context.helperString(CAMELIZE)}(`);
-        arg.children.push(`)`);
-      }
-    }
-    if (!context.inSSR) {
-      if (modifiers.some((mod) => mod.content === "prop")) {
-        injectPrefix(arg, ".");
-      }
-      if (modifiers.some((mod) => mod.content === "attr")) {
-        injectPrefix(arg, "^");
-      }
-    }
-    return {
-      props: [createObjectProperty(arg, exp)]
-    };
-  };
-  const transformBindShorthand = (dir, context) => {
-    const arg = dir.arg;
-    const propName = camelize(arg.content);
-    dir.exp = createSimpleExpression(propName, false, arg.loc);
-  };
-  const injectPrefix = (arg, prefix) => {
-    if (arg.type === 4) {
-      if (arg.isStatic) {
-        arg.content = prefix + arg.content;
-      } else {
-        arg.content = `\`${prefix}\${${arg.content}}\``;
-      }
-    } else {
-      arg.children.unshift(`'${prefix}' + (`);
-      arg.children.push(`)`);
-    }
-  };
-
   const transformFor = createStructuralDirectiveTransform(
     "for",
     (node, dir, context) => {
@@ -18684,10 +18976,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
         const isTemplate = isTemplateNode(node);
         const memo = findDir(node, "memo");
         const keyProp = findProp(node, `key`, false, true);
-        const isDirKey = keyProp && keyProp.type === 7;
-        if (isDirKey && !keyProp.exp) {
-          transformBindShorthand(keyProp);
-        }
+        keyProp && keyProp.type === 7;
         let keyExp = keyProp && (keyProp.type === 6 ? keyProp.value ? createSimpleExpression(keyProp.value.content, true) : void 0 : keyProp.exp);
         const keyProperty = keyProp && keyExp ? createObjectProperty(`key`, keyExp) : null;
         const isStableFragment = forNode.source.type === 4 && forNode.source.constType > 0;
@@ -18968,7 +19257,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
         );
       } else if (vElse = findDir(
         slotElement,
-        /^else(-if)?$/,
+        /^else(?:-if)?$/,
         true
         /* allowEmpty */
       )) {
@@ -18980,7 +19269,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
             break;
           }
         }
-        if (prev && isTemplateNode(prev) && findDir(prev, /^(else-)?if$/)) {
+        if (prev && isTemplateNode(prev) && findDir(prev, /^(?:else-)?if$/)) {
           let conditional = dynamicSlots[dynamicSlots.length - 1];
           while (conditional.alternate.type === 19) {
             conditional = conditional.alternate;
@@ -19840,6 +20129,58 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     return ret;
   };
 
+  const transformBind = (dir, _node, context) => {
+    const { modifiers, loc } = dir;
+    const arg = dir.arg;
+    let { exp } = dir;
+    if (exp && exp.type === 4 && !exp.content.trim()) {
+      {
+        exp = void 0;
+      }
+    }
+    if (arg.type !== 4) {
+      arg.children.unshift(`(`);
+      arg.children.push(`) || ""`);
+    } else if (!arg.isStatic) {
+      arg.content = arg.content ? `${arg.content} || ""` : `""`;
+    }
+    if (modifiers.some((mod) => mod.content === "camel")) {
+      if (arg.type === 4) {
+        if (arg.isStatic) {
+          arg.content = camelize(arg.content);
+        } else {
+          arg.content = `${context.helperString(CAMELIZE)}(${arg.content})`;
+        }
+      } else {
+        arg.children.unshift(`${context.helperString(CAMELIZE)}(`);
+        arg.children.push(`)`);
+      }
+    }
+    if (!context.inSSR) {
+      if (modifiers.some((mod) => mod.content === "prop")) {
+        injectPrefix(arg, ".");
+      }
+      if (modifiers.some((mod) => mod.content === "attr")) {
+        injectPrefix(arg, "^");
+      }
+    }
+    return {
+      props: [createObjectProperty(arg, exp)]
+    };
+  };
+  const injectPrefix = (arg, prefix) => {
+    if (arg.type === 4) {
+      if (arg.isStatic) {
+        arg.content = prefix + arg.content;
+      } else {
+        arg.content = `\`${prefix}\${${arg.content}}\``;
+      }
+    } else {
+      arg.children.unshift(`'${prefix}' + (`);
+      arg.children.push(`)`);
+    }
+  };
+
   const transformText = (node, context) => {
     if (node.type === 0 || node.type === 1 || node.type === 11 || node.type === 10) {
       return () => {
@@ -19976,7 +20317,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     ];
     if (dir.modifiers.length && node.tagType === 1) {
       const modifiers = dir.modifiers.map((m) => m.content).map((m) => (isSimpleIdentifier(m) ? m : JSON.stringify(m)) + `: true`).join(`, `);
-      const modifiersKey = arg ? isStaticExp(arg) ? `${arg.content}Modifiers` : createCompoundExpression([arg, ' + "Modifiers"']) : `modelModifiers`;
+      const modifiersKey = arg ? isStaticExp(arg) ? getModifierPropName(arg.content) : createCompoundExpression([arg, ' + "Modifiers"']) : `modelModifiers`;
       props.push(
         createObjectProperty(
           modifiersKey,
@@ -20148,7 +20489,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
   const transformMemo = (node, context) => {
     if (node.type === 1) {
       const dir = findDir(node, "memo");
-      if (!dir || seen.has(node)) {
+      if (!dir || seen.has(node) || context.inSSR) {
         return;
       }
       seen.add(node);
@@ -20170,9 +20511,36 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     }
   };
 
+  const transformVBindShorthand = (node, context) => {
+    if (node.type === 1) {
+      for (const prop of node.props) {
+        if (prop.type === 7 && prop.name === "bind" && (!prop.exp || // #13930 :foo in in-DOM templates will be parsed into :foo="" by browser
+        prop.exp.type === 4 && !prop.exp.content.trim()) && prop.arg) {
+          const arg = prop.arg;
+          if (arg.type !== 4 || !arg.isStatic) {
+            context.onError(
+              createCompilerError(
+                52,
+                arg.loc
+              )
+            );
+            prop.exp = createSimpleExpression("", true, arg.loc);
+          } else {
+            const propName = camelize(arg.content);
+            if (validFirstIdentCharRE.test(propName[0]) || // allow hyphen first char for https://github.com/vuejs/language-tools/pull/3424
+            propName[0] === "-") {
+              prop.exp = createSimpleExpression(propName, false, arg.loc);
+            }
+          }
+        }
+      }
+    }
+  };
+
   function getBaseTransformPreset(prefixIdentifiers) {
     return [
       [
+        transformVBindShorthand,
         transformOnce,
         transformIf,
         transformMemo,
@@ -20302,7 +20670,7 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
       let ns = parent ? parent.ns : rootNamespace;
       if (parent && ns === 2) {
         if (parent.tag === "annotation-xml") {
-          if (tag === "svg") {
+          if (isSVGTag(tag)) {
             return 1;
           }
           if (parent.props.some(
@@ -20319,10 +20687,10 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
         }
       }
       if (ns === 0) {
-        if (tag === "svg") {
+        if (isSVGTag(tag)) {
           return 1;
         }
-        if (tag === "math") {
+        if (isMathMLTag(tag)) {
           return 2;
         }
       }
@@ -20623,46 +20991,46 @@ Use a v-bind binding combined with a v-on listener that emits update:x event ins
     if (node.type === 1 && node.tagType === 1) {
       const component = context.isBuiltInComponent(node.tag);
       if (component === TRANSITION) {
-        return () => {
-          if (!node.children.length) {
-            return;
-          }
-          if (hasMultipleChildren(node)) {
-            context.onError(
-              createDOMCompilerError(
-                62,
-                {
-                  start: node.children[0].loc.start,
-                  end: node.children[node.children.length - 1].loc.end,
-                  source: ""
-                }
-              )
-            );
-          }
-          const child = node.children[0];
-          if (child.type === 1) {
-            for (const p of child.props) {
-              if (p.type === 7 && p.name === "show") {
-                node.props.push({
-                  type: 6,
-                  name: "persisted",
-                  nameLoc: node.loc,
-                  value: void 0,
-                  loc: node.loc
-                });
-              }
-            }
-          }
-        };
+        return postTransformTransition(node, context.onError);
       }
     }
   };
-  function hasMultipleChildren(node) {
+  function postTransformTransition(node, onError, hasMultipleChildren = defaultHasMultipleChildren) {
+    return () => {
+      if (!node.children.length) {
+        return;
+      }
+      if (hasMultipleChildren(node)) {
+        onError(
+          createDOMCompilerError(62, {
+            start: node.children[0].loc.start,
+            end: node.children[node.children.length - 1].loc.end,
+            source: ""
+          })
+        );
+      }
+      const child = node.children[0];
+      if (child.type === 1) {
+        for (const p of child.props) {
+          if (p.type === 7 && p.name === "show") {
+            node.props.push({
+              type: 6,
+              name: "persisted",
+              nameLoc: node.loc,
+              value: void 0,
+              loc: node.loc
+            });
+          }
+        }
+      }
+    };
+  }
+  function defaultHasMultipleChildren(node) {
     const children = node.children = node.children.filter(
       (c) => c.type !== 3 && !(c.type === 2 && !c.content.trim())
     );
     const child = children[0];
-    return children.length !== 1 || child.type === 11 || child.type === 9 && child.branches.some(hasMultipleChildren);
+    return children.length !== 1 || child.type === 11 || child.type === 9 && child.branches.some(defaultHasMultipleChildren);
   }
 
   const ignoreSideEffectTags = (node, context) => {