@vue/runtime-vapor 3.6.0-alpha.1 → 3.6.0-alpha.3

package/dist/runtime-vapor.esm-bundler.js

@@ -1,282 +1,339 @@
 /**
-* @vue/runtime-vapor v3.6.0-alpha.1
+* @vue/runtime-vapor v3.6.0-alpha.3
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
-import { warn, baseEmit, currentInstance, startMeasure, setCurrentInstance, queuePostFlushCb, queueJob, baseNormalizePropsOptions, pushWarningContext, validateProps, popWarningContext, resolvePropValue, isEmitListener, patchStyle, mergeProps, shouldSetAsProp, isRef, registerHMR, callWithErrorHandling, endMeasure, unregisterHMR, nextUid, EffectScope as EffectScope$1, expose, createAppAPI, initFeatureFlags, setDevtoolsHook, flushOnAppMount, normalizeContainer, ensureRenderer, shallowRef, simpleSetCurrentInstance, renderSlot, createVNode, shallowReactive, createInternalObject, onScopeDispose as onScopeDispose$1, resolveDynamicComponent, vShowOriginalDisplay, vShowHidden, vModelTextInit, vModelCheckboxInit, vModelSelectInit, onMounted, vModelTextUpdate, vModelCheckboxUpdate, vModelGetValue, vModelSetSelected } from '@vue/runtime-dom';
-import { isArray, EMPTY_OBJ, hasOwn, invokeArrayFns, EMPTY_ARR, isFunction, camelize, isString, NO, YES, normalizeClass, normalizeStyle, parseStringStyle, isOn, canSetValueDirectly, toDisplayString, getGlobalThis, extend, isObject, remove as remove$1, looseEqual } from '@vue/shared';
-import { setActiveSub, EffectScope, ReactiveEffect, onEffectCleanup, proxyRefs, onScopeDispose, markRaw, unref, watch, isReactive, isShallow, shallowReadArray, isReadonly, toReadonly, toReactive, shallowRef as shallowRef$1, isRef as isRef$1, traverse } from '@vue/reactivity';
-
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function createTextNode(value = "") {
-  return document.createTextNode(value);
-}
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function createComment(data) {
-  return document.createComment(data);
-}
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function child(node) {
-  return node.firstChild;
-}
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function nthChild(node, i) {
-  return node.childNodes[i];
-}
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function next(node) {
-  return node.nextSibling;
-}
+import { isMismatchAllowed, warn, currentInstance, startMeasure, setCurrentInstance, queuePostFlushCb, queueJob, TransitionPropsValidators, leaveCbKey, isAsyncWrapper, getComponentName, baseResolveTransitionHooks, isTemplateNode, checkTransitionMode, resolveTransitionProps, useTransitionState, isKeepAlive, isRef, unsafeToTrustedHTML, patchStyle, mergeProps, shouldSetAsProp, toClassSet, isSetEqual, warnPropMismatch, toStyleMap, vShowHidden, isMapEqual, isValidHtmlOrSvgAttribute, getAttributeMismatch, onMounted, onUpdated, onBeforeUnmount, resetShapeFlag, watch, matches, devtoolsComponentAdded, ensureRenderer, shallowRef, simpleSetCurrentInstance, renderSlot, ensureVaporSlotFallback, createVNode, shallowReactive, createInternalObject, isEmitListener, onScopeDispose, activate as activate$1, setTransitionHooks as setTransitionHooks$1, normalizeRef, isVNode, Fragment, ensureHydrationRenderer, setRef as setRef$1, deactivate as deactivate$1, baseEmit, baseNormalizePropsOptions, pushWarningContext, validateProps, popWarningContext, resolvePropValue, resolveTeleportTarget, isTeleportDisabled, isTeleportDeferred, performTransitionEnter, performTransitionLeave, getInheritedScopeIds, registerHMR, endMeasure, unregisterHMR, nextUid, EffectScope as EffectScope$1, expose, callWithErrorHandling, createAppAPI, initFeatureFlags, setDevtoolsHook, flushOnAppMount, normalizeContainer, createAsyncComponentContext, markAsyncBoundary, useAsyncComponentState, performAsyncHydrate, handleError, createCanSetSetupRefChecker, resolveDynamicComponent, vShowOriginalDisplay, vModelTextInit, vModelCheckboxInit, vModelSelectInit, vModelTextUpdate, vModelCheckboxUpdate, vModelGetValue, vModelSetSelected, onBeforeUpdate, hasCSSTransform, callPendingCbs, forceReflow, handleMovedChildren, baseApplyTranslation } from '@vue/runtime-dom';
+import { invokeArrayFns, isArray, extend, EMPTY_OBJ, isFunction, NO, hasOwn, normalizeClass, normalizeStyle, includeBooleanAttr, toDisplayString, isString, parseStringStyle, isOn, canSetValueDirectly, stringifyStyle, isReservedProp, EMPTY_ARR, camelize, YES, getGlobalThis, isObject, remove as remove$1, looseEqual } from '@vue/shared';
+import { ReactiveEffect, setActiveSub, EffectScope, onEffectCleanup, pauseTracking, resetTracking, onScopeDispose as onScopeDispose$1, markRaw, unref, proxyRefs, watch as watch$1, isReactive, isShallow, shallowReadArray, isReadonly, toReadonly, toReactive, shallowRef as shallowRef$1, isRef as isRef$1, traverse } from '@vue/reactivity';
 
 let insertionParent;
 let insertionAnchor;
-function setInsertionState(parent, anchor) {
+let isLastInsertion;
+function setInsertionState(parent, anchor, last) {
   insertionParent = parent;
-  insertionAnchor = anchor;
+  isLastInsertion = last;
+  if (anchor !== void 0) {
+    if (isHydrating) {
+      insertionAnchor = anchor;
+    } else {
+      insertionAnchor = typeof anchor === "number" && anchor > 0 ? null : anchor;
+      if (anchor === 0 && !parent.$fc) {
+        parent.$fc = parent.firstChild;
+      }
+    }
+  } else {
+    insertionAnchor = void 0;
+  }
 }
 function resetInsertionState() {
-  insertionParent = insertionAnchor = void 0;
+  insertionParent = insertionAnchor = isLastInsertion = void 0;
 }
 
+const isHydratingStack = [];
 let isHydrating = false;
 let currentHydrationNode = null;
+function pushIsHydrating(value) {
+  isHydratingStack.push(isHydrating = value);
+}
+function popIsHydrating() {
+  isHydratingStack.pop();
+  isHydrating = isHydratingStack[isHydratingStack.length - 1] || false;
+}
+function runWithoutHydration(fn) {
+  try {
+    pushIsHydrating(false);
+    return fn();
+  } finally {
+    popIsHydrating();
+  }
+}
 let isOptimized$1 = false;
-function withHydration(container, fn) {
-  adoptTemplate = adoptTemplateImpl;
-  locateHydrationNode = locateHydrationNodeImpl;
+function performHydration(fn, setup, cleanup) {
   if (!isOptimized$1) {
-    Comment.prototype.$fs = void 0;
+    adoptTemplate = adoptTemplateImpl;
+    locateHydrationNode = locateHydrationNodeImpl;
+    Comment.prototype.$fe = void 0;
+    Node.prototype.$pns = void 0;
+    Node.prototype.$idx = void 0;
+    Node.prototype.$llc = void 0;
+    Node.prototype.$lpn = void 0;
+    Node.prototype.$lan = void 0;
+    Node.prototype.$lin = void 0;
+    Node.prototype.$curIdx = void 0;
     isOptimized$1 = true;
   }
-  isHydrating = true;
-  setInsertionState(container, 0);
+  enableHydrationNodeLookup();
+  pushIsHydrating(true);
+  setup();
   const res = fn();
-  resetInsertionState();
+  cleanup();
   currentHydrationNode = null;
-  isHydrating = false;
+  popIsHydrating();
+  if (!isHydrating) disableHydrationNodeLookup();
   return res;
 }
+function withHydration(container, fn) {
+  const setup = () => setInsertionState(container);
+  const cleanup = () => resetInsertionState();
+  return performHydration(fn, setup, cleanup);
+}
+function hydrateNode(node, fn) {
+  const setup = () => currentHydrationNode = node;
+  const cleanup = () => {
+  };
+  return performHydration(fn, setup, cleanup);
+}
 let adoptTemplate;
 let locateHydrationNode;
 const isComment = (node, data) => node.nodeType === 8 && node.data === data;
+function setCurrentHydrationNode(node) {
+  currentHydrationNode = node;
+}
+function locateNextSiblingOfParent(n) {
+  if (!n.parentNode) return null;
+  return n.parentNode.nextSibling || locateNextSiblingOfParent(n.parentNode);
+}
+function advanceHydrationNode(node) {
+  const ret = node.nextSibling || // pns is short for "parent next sibling"
+  node.$pns || (node.$pns = locateNextSiblingOfParent(node));
+  if (ret) setCurrentHydrationNode(ret);
+}
 function adoptTemplateImpl(node, template) {
   if (!(template[0] === "<" && template[1] === "!")) {
-    while (node.nodeType === 8) node = next(node);
-  }
-  if (!!(process.env.NODE_ENV !== "production")) {
-    const type = node.nodeType;
-    if (type === 8 && !template.startsWith("<!") || type === 1 && !template.startsWith(`<` + node.tagName.toLowerCase()) || type === 3 && template.trim() && !template.startsWith(node.data)) {
-      warn(`adopted: `, node);
-      warn(`template: ${template}`);
-      warn("hydration mismatch!");
+    while (node.nodeType === 8) {
+      node = node.nextSibling;
+      if (template.trim() === "" && isComment(node, "]") && isComment(node.previousSibling, "[")) {
+        node.before(node = createTextNode());
+        break;
+      }
     }
   }
-  currentHydrationNode = next(node);
+  const type = node.nodeType;
+  if (
+    // comment node
+    type === 8 && !template.startsWith("<!") || // element node
+    type === 1 && !template.startsWith(`<` + node.tagName.toLowerCase())
+  ) {
+    node = handleMismatch(node, template);
+  }
+  currentHydrationNode = node.nextSibling;
   return node;
 }
+function locateNextNode(node) {
+  return isComment(node, "[") ? _next(locateEndAnchor(node)) : isComment(node, "teleport start") ? _next(locateEndAnchor(node, "teleport start", "teleport end")) : _next(node);
+}
 function locateHydrationNodeImpl() {
   let node;
-  if (insertionAnchor === 0) {
-    node = child(insertionParent);
+  if (insertionAnchor !== void 0) {
+    const { $lpn: lastPrepend, $lan: lastAppend, firstChild } = insertionParent;
+    if (insertionAnchor === 0) {
+      node = insertionParent.$lpn = lastPrepend ? locateNextNode(lastPrepend) : firstChild;
+    } else if (insertionAnchor instanceof Node) {
+      const { $lin: lastInsertedNode } = insertionAnchor;
+      node = insertionAnchor.$lin = lastInsertedNode ? locateNextNode(lastInsertedNode) : insertionAnchor;
+    } else {
+      node = insertionParent.$lan = lastAppend ? locateNextNode(lastAppend) : insertionAnchor === null ? firstChild : locateChildByLogicalIndex(insertionParent, insertionAnchor);
+    }
+    insertionParent.$llc = node;
+    node.$idx = insertionParent.$curIdx = insertionParent.$curIdx === void 0 ? 0 : insertionParent.$curIdx + 1;
   } else {
-    node = insertionAnchor ? insertionAnchor.previousSibling : insertionParent ? insertionParent.lastChild : currentHydrationNode;
-    if (node && isComment(node, "]")) {
-      if (node.$fs) {
-        node = node.$fs;
-      } else {
-        let cur = node;
-        let curFragEnd = node;
-        let fragDepth = 0;
-        node = null;
-        while (cur) {
-          cur = cur.previousSibling;
-          if (cur) {
-            if (isComment(cur, "[")) {
-              curFragEnd.$fs = cur;
-              if (!fragDepth) {
-                node = cur;
-                break;
-              } else {
-                fragDepth--;
-              }
-            } else if (isComment(cur, "]")) {
-              curFragEnd = cur;
-              fragDepth++;
-            }
-          }
-        }
-      }
+    node = currentHydrationNode;
+    if (insertionParent && (!node || node.parentNode !== insertionParent)) {
+      node = insertionParent.firstChild;
     }
   }
   if (!!(process.env.NODE_ENV !== "production") && !node) {
-    warn("Hydration mismatch in ", insertionParent);
+    throw new Error(
+      `No current hydration node was found.
+this is likely a Vue internal bug.`
+    );
   }
   resetInsertionState();
   currentHydrationNode = node;
 }
-
-class VaporFragment {
-  constructor(nodes) {
-    this.nodes = nodes;
-  }
-}
-class DynamicFragment extends VaporFragment {
-  constructor(anchorLabel) {
-    super([]);
-    this.anchor = !!(process.env.NODE_ENV !== "production") && anchorLabel ? createComment(anchorLabel) : createTextNode();
+function locateEndAnchor(node, open = "[", close = "]") {
+  if (node.$fe) {
+    return node.$fe;
   }
-  update(render, key = render) {
-    if (key === this.current) {
-      return;
-    }
-    this.current = key;
-    const prevSub = setActiveSub();
-    const parent = this.anchor.parentNode;
-    if (this.scope) {
-      this.scope.stop();
-      parent && remove(this.nodes, parent);
-    }
-    if (render) {
-      this.scope = new EffectScope();
-      this.nodes = this.scope.run(render) || [];
-      if (parent) insert(this.nodes, parent, this.anchor);
-    } else {
-      this.scope = void 0;
-      this.nodes = [];
-    }
-    if (this.fallback && !isValidBlock(this.nodes)) {
-      parent && remove(this.nodes, parent);
-      this.nodes = (this.scope || (this.scope = new EffectScope())).run(this.fallback) || [];
-      parent && insert(this.nodes, parent, this.anchor);
+  const stack = [node];
+  while ((node = node.nextSibling) && stack.length > 0) {
+    if (node.nodeType === 8) {
+      if (node.data === open) {
+        stack.push(node);
+      } else if (node.data === close) {
+        const matchingOpen = stack.pop();
+        matchingOpen.$fe = node;
+        if (stack.length === 0) return node;
+      }
     }
-    setActiveSub(prevSub);
   }
+  return null;
 }
-function isFragment(val) {
-  return val instanceof VaporFragment;
-}
-function isBlock(val) {
-  return val instanceof Node || isArray(val) || isVaporComponent(val) || isFragment(val);
+function locateFragmentEndAnchor(label = "]") {
+  let node = currentHydrationNode;
+  while (node) {
+    if (isComment(node, label)) return node;
+    node = node.nextSibling;
+  }
+  return null;
 }
-function isValidBlock(block) {
-  if (block instanceof Node) {
-    return !(block instanceof Comment);
-  } else if (isVaporComponent(block)) {
-    return isValidBlock(block.block);
-  } else if (isArray(block)) {
-    return block.length > 0 && block.every(isValidBlock);
-  } else {
-    return isValidBlock(block.nodes);
+function handleMismatch(node, template) {
+  if (!isMismatchAllowed(node.parentElement, 1)) {
+    (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && warn(
+      `Hydration node mismatch:
+- rendered on server:`,
+      node,
+      node.nodeType === 3 ? `(text)` : isComment(node, "[[") ? `(start of block node)` : ``,
+      `
+- expected on client:`,
+      template
+    );
+    logMismatchError();
+  }
+  if (isComment(node, "[")) {
+    removeFragmentNodes(node);
   }
+  const next = _next(node);
+  const container = parentNode(node);
+  remove(node, container);
+  if (template[0] !== "<") {
+    return container.insertBefore(createTextNode(template), next);
+  }
+  const t = createElement("template");
+  t.innerHTML = template;
+  const newNode = _child(t.content).cloneNode(true);
+  newNode.innerHTML = node.innerHTML;
+  Array.from(node.attributes).forEach((attr) => {
+    newNode.setAttribute(attr.name, attr.value);
+  });
+  container.insertBefore(newNode, next);
+  return newNode;
 }
-function insert(block, parent, anchor = null) {
-  anchor = anchor === 0 ? parent.firstChild : anchor;
-  if (block instanceof Node) {
-    if (!isHydrating) {
-      parent.insertBefore(block, anchor);
-    }
-  } else if (isVaporComponent(block)) {
-    if (block.isMounted) {
-      insert(block.block, parent, anchor);
-    } else {
-      mountComponent(block, parent, anchor);
-    }
-  } else if (isArray(block)) {
-    for (const b of block) {
-      insert(b, parent, anchor);
-    }
-  } else {
-    if (block.insert) {
-      block.insert(parent, anchor);
+let hasLoggedMismatchError = false;
+const logMismatchError = () => {
+  if (hasLoggedMismatchError) {
+    return;
+  }
+  console.error("Hydration completed but contains mismatches.");
+  hasLoggedMismatchError = true;
+};
+function removeFragmentNodes(node, endAnchor) {
+  const end = endAnchor || locateEndAnchor(node);
+  while (true) {
+    const next = _next(node);
+    if (next && next !== end) {
+      remove(next, parentNode(node));
     } else {
-      insert(block.nodes, parent, anchor);
+      break;
     }
-    if (block.anchor) insert(block.anchor, parent, anchor);
   }
 }
-function prepend(parent, ...blocks) {
-  let i = blocks.length;
-  while (i--) insert(blocks[i], parent, 0);
+
+// @__NO_SIDE_EFFECTS__
+function createElement(tagName) {
+  return document.createElement(tagName);
 }
-function remove(block, parent) {
-  if (block instanceof Node) {
-    parent && parent.removeChild(block);
-  } else if (isVaporComponent(block)) {
-    unmountComponent(block, parent);
-  } else if (isArray(block)) {
-    for (let i = 0; i < block.length; i++) {
-      remove(block[i], parent);
-    }
-  } else {
-    if (block.remove) {
-      block.remove(parent);
-    } else {
-      remove(block.nodes, parent);
-    }
-    if (block.anchor) remove(block.anchor, parent);
-    if (block.scope) {
-      block.scope.stop();
-    }
-  }
+// @__NO_SIDE_EFFECTS__
+function createTextNode(value = "") {
+  return document.createTextNode(value);
 }
-function normalizeBlock(block) {
-  if (!!!(process.env.NODE_ENV !== "production") && true) {
-    throw new Error(
-      "normalizeBlock should not be used in production code paths"
-    );
-  }
-  const nodes = [];
-  if (block instanceof Node) {
-    nodes.push(block);
-  } else if (isArray(block)) {
-    block.forEach((child) => nodes.push(...normalizeBlock(child)));
-  } else if (isVaporComponent(block)) {
-    nodes.push(...normalizeBlock(block.block));
-  } else {
-    nodes.push(...normalizeBlock(block.nodes));
-    block.anchor && nodes.push(block.anchor);
-  }
-  return nodes;
+// @__NO_SIDE_EFFECTS__
+function createComment(data) {
+  return document.createComment(data);
 }
-
-function normalizeEmitsOptions(comp) {
-  const cached = comp.__emitsOptions;
-  if (cached) return cached;
-  const raw = comp.emits;
-  if (!raw) return null;
-  let normalized;
-  if (isArray(raw)) {
-    normalized = {};
-    for (const key of raw) normalized[key] = null;
-  } else {
-    normalized = raw;
+// @__NO_SIDE_EFFECTS__
+function querySelector(selectors) {
+  return document.querySelector(selectors);
+}
+/*! @__NO_SIDE_EFFECTS__ */
+// @__NO_SIDE_EFFECTS__
+function parentNode(node) {
+  return node.parentNode;
+}
+const _txt = _child;
+const __txt = /* @__NO_SIDE_EFFECTS__ */ (node) => {
+  let n = node.firstChild;
+  if (!n) {
+    return node.appendChild(/* @__PURE__ */ createTextNode());
   }
-  return comp.__emitsOptions = normalized;
+  return n;
+};
+// @__NO_SIDE_EFFECTS__
+function _child(node) {
+  return node.firstChild;
 }
-function emit(instance, event, ...rawArgs) {
-  baseEmit(
-    instance,
-    instance.rawProps || EMPTY_OBJ,
-    propGetter,
-    event,
-    ...rawArgs
+// @__NO_SIDE_EFFECTS__
+function __child(node, logicalIndex = 0) {
+  return locateChildByLogicalIndex(node, logicalIndex);
+}
+// @__NO_SIDE_EFFECTS__
+function _nthChild(node, i) {
+  return node.childNodes[i];
+}
+// @__NO_SIDE_EFFECTS__
+function __nthChild(node, logicalIndex) {
+  return locateChildByLogicalIndex(node, logicalIndex);
+}
+// @__NO_SIDE_EFFECTS__
+function _next(node) {
+  return node.nextSibling;
+}
+// @__NO_SIDE_EFFECTS__
+function __next(node, logicalIndex) {
+  return locateChildByLogicalIndex(
+    node.parentNode,
+    logicalIndex
   );
 }
-function propGetter(rawProps, key) {
-  const dynamicSources = rawProps.$;
-  if (dynamicSources) {
-    let i = dynamicSources.length;
-    while (i--) {
-      const source = resolveSource(dynamicSources[i]);
-      if (hasOwn(source, key)) return resolveSource(source[key]);
+const txt = /* @__NO_SIDE_EFFECTS__ */ (...args) => {
+  return txt.impl(...args);
+};
+txt.impl = _txt;
+const child = /* @__NO_SIDE_EFFECTS__ */ (...args) => {
+  return child.impl(...args);
+};
+child.impl = _child;
+const next = /* @__NO_SIDE_EFFECTS__ */ (...args) => {
+  return next.impl(...args);
+};
+next.impl = _next;
+const nthChild = /* @__NO_SIDE_EFFECTS__ */ (...args) => {
+  return nthChild.impl(...args);
+};
+nthChild.impl = _nthChild;
+function enableHydrationNodeLookup() {
+  txt.impl = __txt;
+  child.impl = __child;
+  next.impl = __next;
+  nthChild.impl = __nthChild;
+}
+function disableHydrationNodeLookup() {
+  txt.impl = _txt;
+  child.impl = _child;
+  next.impl = _next;
+  nthChild.impl = _nthChild;
+}
+function locateChildByLogicalIndex(parent, logicalIndex) {
+  let child2 = parent.$llc || parent.firstChild;
+  let fromIndex = child2.$idx || 0;
+  while (child2) {
+    if (fromIndex === logicalIndex) {
+      child2.$idx = logicalIndex;
+      return parent.$llc = child2;
     }
+    child2 = isComment(child2, "[") ? (
+      // fragment start: jump to the node after the matching end anchor
+      locateEndAnchor(child2).nextSibling
+    ) : child2.nextSibling;
+    fromIndex++;
   }
-  return rawProps[key] && resolveSource(rawProps[key]);
+  return null;
+}
+function updateLastLogicalChild(parent, child2) {
+  if (!isComment(child2, "]")) return;
+  child2.$idx = parent.$curIdx || 0;
+  parent.$llc = child2;
 }
 
 class RenderEffect extends ReactiveEffect {
@@ -300,6 +357,7 @@ class RenderEffect extends ReactiveEffect {
       if (!!(process.env.NODE_ENV !== "production")) {
         this.onTrack = instance.rtc ? (e) => invokeArrayFns(instance.rtc, e) : void 0;
         this.onTrigger = instance.rtg ? (e) => invokeArrayFns(instance.rtg, e) : void 0;
+        (instance.renderEffects || (instance.renderEffects = [])).push(this);
       }
       job.i = instance;
     }
@@ -342,282 +400,591 @@ function renderEffect(fn, noLifecycle = false) {
   effect.run();
 }
 
-function resolveSource(source) {
-  return isFunction(source) ? source() : source;
-}
-function getPropsProxyHandlers(comp) {
-  if (comp.__propsHandlers) {
-    return comp.__propsHandlers;
-  }
-  const propsOptions = normalizePropsOptions(comp)[0];
-  const emitsOptions = normalizeEmitsOptions(comp);
-  const isProp = propsOptions ? (key) => isString(key) && hasOwn(propsOptions, camelize(key)) : NO;
-  const isAttr = propsOptions ? (key) => key !== "$" && !isProp(key) && !isEmitListener(emitsOptions, key) : YES;
-  const getProp = (instance, key) => {
-    if (key === "__v_isReactive") return true;
-    if (!isProp(key)) return;
-    const rawProps = instance.rawProps;
-    const dynamicSources = rawProps.$;
-    if (dynamicSources) {
-      let i = dynamicSources.length;
-      let source, isDynamic, rawKey;
-      while (i--) {
-        source = dynamicSources[i];
-        isDynamic = isFunction(source);
-        source = isDynamic ? source() : source;
-        for (rawKey in source) {
-          if (camelize(rawKey) === key) {
-            return resolvePropValue(
-              propsOptions,
-              key,
-              isDynamic ? source[rawKey] : source[rawKey](),
-              instance,
-              resolveDefault
-            );
-          }
+const displayName = "VaporTransition";
+const decorate$1 = (t) => {
+  t.displayName = displayName;
+  t.props = TransitionPropsValidators;
+  t.__vapor = true;
+  return t;
+};
+const VaporTransition = /* @__PURE__ */ decorate$1(
+  (props, { slots, attrs }) => {
+    let resetDisplay;
+    if (isHydrating && currentHydrationNode && isTemplateNode(currentHydrationNode)) {
+      const {
+        content: { firstChild },
+        parentNode
+      } = currentHydrationNode;
+      if (firstChild) {
+        if (firstChild instanceof HTMLElement || firstChild instanceof SVGElement) {
+          const originalDisplay = firstChild.style.display;
+          firstChild.style.display = "none";
+          resetDisplay = () => firstChild.style.display = originalDisplay;
         }
+        parentNode.replaceChild(firstChild, currentHydrationNode);
+        setCurrentHydrationNode(firstChild);
       }
     }
-    for (const rawKey in rawProps) {
-      if (camelize(rawKey) === key) {
-        return resolvePropValue(
-          propsOptions,
-          key,
-          rawProps[rawKey](),
-          instance,
-          resolveDefault
-        );
+    const children = slots.default && slots.default();
+    if (!children) return;
+    const instance = currentInstance;
+    const { mode } = props;
+    checkTransitionMode(mode);
+    let resolvedProps;
+    let isMounted = false;
+    renderEffect(() => {
+      resolvedProps = resolveTransitionProps(props);
+      if (isMounted) {
+        if (isFragment(children)) {
+          children.$transition.props = resolvedProps;
+        } else {
+          const child = findTransitionBlock(children);
+          if (child) {
+            child.$transition.props = resolvedProps;
+            applyTransitionHooks(child, child.$transition, void 0, true);
+          }
+        }
+      } else {
+        isMounted = true;
       }
+    });
+    let fallthroughAttrs = true;
+    if (instance.hasFallthrough) {
+      renderEffect(() => {
+        const resolvedAttrs = extend({}, attrs);
+        const child = findTransitionBlock(children);
+        if (child) {
+          child.$root = true;
+          applyFallthroughProps(child, resolvedAttrs);
+          fallthroughAttrs = false;
+        }
+      });
     }
-    return resolvePropValue(
-      propsOptions,
-      key,
-      void 0,
-      instance,
-      resolveDefault,
-      true
+    const hooks = applyTransitionHooks(
+      children,
+      {
+        state: useTransitionState(),
+        props: resolvedProps,
+        instance
+      },
+      fallthroughAttrs
     );
-  };
-  const propsHandlers = propsOptions ? {
-    get: (target, key) => getProp(target, key),
-    has: (_, key) => isProp(key),
-    ownKeys: () => Object.keys(propsOptions),
-    getOwnPropertyDescriptor(target, key) {
-      if (isProp(key)) {
-        return {
-          configurable: true,
-          enumerable: true,
-          get: () => getProp(target, key)
-        };
-      }
+    if (resetDisplay && resolvedProps.appear) {
+      const child = findTransitionBlock(children);
+      hooks.beforeEnter(child);
+      resetDisplay();
+      queuePostFlushCb(() => hooks.enter(child));
     }
-  } : null;
-  if (!!(process.env.NODE_ENV !== "production") && propsOptions) {
-    Object.assign(propsHandlers, {
-      set: propsSetDevTrap,
-      deleteProperty: propsDeleteDevTrap
-    });
+    return children;
   }
-  const getAttr = (target, key) => {
-    if (!isProp(key) && !isEmitListener(emitsOptions, key)) {
-      return getAttrFromRawProps(target, key);
-    }
-  };
-  const hasAttr = (target, key) => {
-    if (isAttr(key)) {
-      return hasAttrFromRawProps(target, key);
-    } else {
-      return false;
-    }
-  };
-  const attrsHandlers = {
-    get: (target, key) => getAttr(target.rawProps, key),
-    has: (target, key) => hasAttr(target.rawProps, key),
-    ownKeys: (target) => getKeysFromRawProps(target.rawProps).filter(isAttr),
-    getOwnPropertyDescriptor(target, key) {
-      if (hasAttr(target.rawProps, key)) {
-        return {
-          configurable: true,
-          enumerable: true,
-          get: () => getAttr(target.rawProps, key)
-        };
+);
+const getTransitionHooksContext = (key, props, state, instance, postClone) => {
+  const { leavingNodes } = state;
+  const context = {
+    setLeavingNodeCache: (el) => {
+      leavingNodes.set(key, el);
+    },
+    unsetLeavingNodeCache: (el) => {
+      const leavingNode = leavingNodes.get(key);
+      if (leavingNode === el) {
+        leavingNodes.delete(key);
+      }
+    },
+    earlyRemove: () => {
+      const leavingNode = leavingNodes.get(key);
+      if (leavingNode && leavingNode[leaveCbKey]) {
+        leavingNode[leaveCbKey]();
       }
+    },
+    cloneHooks: (block) => {
+      const hooks = resolveTransitionHooks(
+        block,
+        props,
+        state,
+        instance,
+        postClone
+      );
+      if (postClone) postClone(hooks);
+      return hooks;
     }
   };
-  if (!!(process.env.NODE_ENV !== "production")) {
-    Object.assign(attrsHandlers, {
-      set: propsSetDevTrap,
-      deleteProperty: propsDeleteDevTrap
-    });
+  return context;
+};
+function resolveTransitionHooks(block, props, state, instance, postClone) {
+  const context = getTransitionHooksContext(
+    String(block.$key),
+    props,
+    state,
+    instance,
+    postClone
+  );
+  const hooks = baseResolveTransitionHooks(
+    context,
+    props,
+    state,
+    instance
+  );
+  hooks.state = state;
+  hooks.props = props;
+  hooks.instance = instance;
+  return hooks;
+}
+function applyTransitionHooks(block, hooks, fallthroughAttrs = true, isResolved = false) {
+  if (isArray(block)) {
+    block = block.filter((b) => !(b instanceof Comment));
+    if (block.length === 1) {
+      block = block[0];
+    } else if (block.length === 0) {
+      return hooks;
+    }
   }
-  return comp.__propsHandlers = [propsHandlers, attrsHandlers];
+  const isFrag = isFragment(block);
+  const child = isResolved ? block : findTransitionBlock(block, isFrag);
+  if (!child) {
+    if (isFrag) setTransitionHooksOnFragment(block, hooks);
+    return hooks;
+  }
+  const { props, instance, state, delayedLeave } = hooks;
+  let resolvedHooks = resolveTransitionHooks(
+    child,
+    props,
+    state,
+    instance,
+    (hooks2) => resolvedHooks = hooks2
+  );
+  resolvedHooks.delayedLeave = delayedLeave;
+  child.$transition = resolvedHooks;
+  if (isFrag) setTransitionHooksOnFragment(block, resolvedHooks);
+  if (fallthroughAttrs && instance.hasFallthrough) {
+    child.$root = true;
+    applyFallthroughProps(child, instance.attrs);
+  }
+  return resolvedHooks;
 }
-function getAttrFromRawProps(rawProps, key) {
-  if (key === "$") return;
-  const merged = key === "class" || key === "style" ? [] : void 0;
-  const dynamicSources = rawProps.$;
-  if (dynamicSources) {
-    let i = dynamicSources.length;
-    let source, isDynamic;
-    while (i--) {
-      source = dynamicSources[i];
-      isDynamic = isFunction(source);
-      source = isDynamic ? source() : source;
-      if (source && hasOwn(source, key)) {
-        const value = isDynamic ? source[key] : source[key]();
-        if (merged) {
-          merged.push(value);
-        } else {
-          return value;
-        }
+function applyTransitionLeaveHooks(block, enterHooks, afterLeaveCb) {
+  const leavingBlock = findTransitionBlock(block);
+  if (!leavingBlock) return void 0;
+  const { props, state, instance } = enterHooks;
+  const leavingHooks = resolveTransitionHooks(
+    leavingBlock,
+    props,
+    state,
+    instance
+  );
+  leavingBlock.$transition = leavingHooks;
+  const { mode } = props;
+  if (mode === "out-in") {
+    state.isLeaving = true;
+    leavingHooks.afterLeave = () => {
+      state.isLeaving = false;
+      afterLeaveCb();
+      leavingBlock.$transition = void 0;
+      delete leavingHooks.afterLeave;
+    };
+  } else if (mode === "in-out") {
+    leavingHooks.delayLeave = (block2, earlyRemove, delayedLeave) => {
+      state.leavingNodes.set(String(leavingBlock.$key), leavingBlock);
+      block2[leaveCbKey] = () => {
+        earlyRemove();
+        block2[leaveCbKey] = void 0;
+        leavingBlock.$transition = void 0;
+        delete enterHooks.delayedLeave;
+      };
+      enterHooks.delayedLeave = () => {
+        delayedLeave();
+        leavingBlock.$transition = void 0;
+        delete enterHooks.delayedLeave;
+      };
+    };
+  }
+}
+function findTransitionBlock(block, inFragment = false) {
+  let child;
+  if (block instanceof Node) {
+    if (block instanceof Element) child = block;
+  } else if (isVaporComponent(block)) {
+    if (isAsyncWrapper(block) && !block.type.__asyncResolved) {
+      child = block;
+    } else {
+      if (getComponentName(block.type) === displayName) return void 0;
+      child = findTransitionBlock(block.block, inFragment);
+      if (child && child.$key === void 0) child.$key = block.uid;
+    }
+  } else if (isArray(block)) {
+    let hasFound = false;
+    for (const c of block) {
+      if (c instanceof Comment) continue;
+      if (isFragment(c)) inFragment = true;
+      const item = findTransitionBlock(c, inFragment);
+      if (!!(process.env.NODE_ENV !== "production") && hasFound) {
+        warn(
+          "<transition> can only be used on a single element or component. Use <transition-group> for lists."
+        );
+        break;
       }
+      child = item;
+      hasFound = true;
+      if (!!!(process.env.NODE_ENV !== "production")) break;
     }
-  }
-  if (hasOwn(rawProps, key)) {
-    if (merged) {
-      merged.push(rawProps[key]());
+  } else if (isFragment(block)) {
+    inFragment = true;
+    if (block.insert) {
+      child = block;
     } else {
-      return rawProps[key]();
+      child = findTransitionBlock(block.nodes, true);
     }
   }
-  if (merged && merged.length) {
-    return merged;
+  if (!!(process.env.NODE_ENV !== "production") && !child && !inFragment) {
+    warn("Transition component has no valid child element");
   }
+  return child;
 }
-function hasAttrFromRawProps(rawProps, key) {
-  if (key === "$") return false;
-  const dynamicSources = rawProps.$;
-  if (dynamicSources) {
-    let i = dynamicSources.length;
-    while (i--) {
-      const source = resolveSource(dynamicSources[i]);
-      if (source && hasOwn(source, key)) {
-        return true;
-      }
+function setTransitionHooksOnFragment(block, hooks) {
+  if (isFragment(block)) {
+    block.$transition = hooks;
+  } else if (isArray(block)) {
+    for (let i = 0; i < block.length; i++) {
+      setTransitionHooksOnFragment(block[i], hooks);
     }
   }
-  return hasOwn(rawProps, key);
 }
-function getKeysFromRawProps(rawProps) {
-  const keys = [];
-  for (const key in rawProps) {
-    if (key !== "$") keys.push(key);
-  }
-  const dynamicSources = rawProps.$;
-  if (dynamicSources) {
-    let i = dynamicSources.length;
-    let source;
-    while (i--) {
-      source = resolveSource(dynamicSources[i]);
-      for (const key in source) {
-        keys.push(key);
-      }
-    }
+function setTransitionHooks(block, hooks) {
+  if (isVaporComponent(block)) {
+    block = findTransitionBlock(block.block);
+    if (!block) return;
   }
-  return Array.from(new Set(keys));
+  block.$transition = hooks;
 }
-function normalizePropsOptions(comp) {
-  const cached = comp.__propsOptions;
-  if (cached) return cached;
-  const raw = comp.props;
-  if (!raw) return EMPTY_ARR;
-  const normalized = {};
-  const needCastKeys = [];
-  baseNormalizePropsOptions(raw, normalized, needCastKeys);
-  return comp.__propsOptions = [normalized, needCastKeys];
+
+class VaporFragment {
+  constructor(nodes) {
+    this.vnode = null;
+    this.nodes = nodes;
+  }
 }
-function resolveDefault(factory, instance) {
-  const prev = setCurrentInstance(instance);
-  const res = factory.call(null, instance.props);
-  setCurrentInstance(...prev);
-  return res;
+class ForFragment extends VaporFragment {
+  constructor(nodes) {
+    super(nodes);
+  }
 }
-function hasFallthroughAttrs(comp, rawProps) {
-  if (rawProps) {
-    if (rawProps.$ || !comp.props) {
-      return true;
-    } else {
-      const propsOptions = normalizePropsOptions(comp)[0];
-      for (const key in rawProps) {
-        if (!hasOwn(propsOptions, camelize(key))) {
-          return true;
+class DynamicFragment extends VaporFragment {
+  constructor(anchorLabel) {
+    super([]);
+    this.hydrate = (isEmpty = false) => {
+      if (this.anchor) return;
+      if (this.anchorLabel === "if") {
+        if (isEmpty) {
+          this.anchor = locateFragmentEndAnchor("");
+          if (!!(process.env.NODE_ENV !== "production") && !this.anchor) {
+            throw new Error(
+              "Failed to locate if anchor. this is likely a Vue internal bug."
+            );
+          } else {
+            if (!!(process.env.NODE_ENV !== "production")) {
+              this.anchor.data = this.anchorLabel;
+            }
+            return;
+          }
+        }
+      } else if (this.anchorLabel === "slot") {
+        if (isEmpty && isComment(currentHydrationNode, "")) {
+          this.anchor = currentHydrationNode;
+          if (!!(process.env.NODE_ENV !== "production")) {
+            this.anchor.data = this.anchorLabel;
+          }
+          return;
+        }
+        this.anchor = locateFragmentEndAnchor();
+        if (!!(process.env.NODE_ENV !== "production") && !this.anchor) {
+          throw new Error(
+            "Failed to locate slot anchor. this is likely a Vue internal bug."
+          );
+        } else {
+          return;
         }
       }
+      const { parentNode, nextNode } = findBlockNode(this.nodes);
+      queuePostFlushCb(() => {
+        parentNode.insertBefore(
+          this.anchor = !!(process.env.NODE_ENV !== "production") ? createComment(this.anchorLabel) : createTextNode(),
+          nextNode
+        );
+      });
+    };
+    if (isHydrating) {
+      this.anchorLabel = anchorLabel;
+      locateHydrationNode();
+    } else {
+      this.anchor = !!(process.env.NODE_ENV !== "production") && anchorLabel ? createComment(anchorLabel) : createTextNode();
     }
   }
-  return false;
-}
-function setupPropsValidation(instance) {
-  const rawProps = instance.rawProps;
-  if (!rawProps) return;
-  renderEffect(
-    () => {
-      pushWarningContext(instance);
-      validateProps(
-        resolveDynamicProps(rawProps),
-        instance.props,
-        normalizePropsOptions(instance.type)[0]
-      );
-      popWarningContext();
-    },
-    true
-    /* noLifecycle */
-  );
-}
-function resolveDynamicProps(props) {
-  const mergedRawProps = {};
-  for (const key in props) {
-    if (key !== "$") {
-      mergedRawProps[key] = props[key]();
+  update(render, key = render) {
+    if (key === this.current) {
+      if (isHydrating) this.hydrate(true);
+      return;
     }
-  }
-  if (props.$) {
-    for (const source of props.$) {
-      const isDynamic = isFunction(source);
-      const resolved = isDynamic ? source() : source;
-      for (const key in resolved) {
-        const value = isDynamic ? resolved[key] : resolved[key]();
-        if (key === "class" || key === "style") {
-          const existing = mergedRawProps[key];
-          if (isArray(existing)) {
-            existing.push(value);
+    this.current = key;
+    const prevSub = setActiveSub();
+    const parent = isHydrating ? null : this.anchor.parentNode;
+    const transition = this.$transition;
+    const instance = currentInstance;
+    this.inKeepAlive = isKeepAlive(instance);
+    if (this.scope) {
+      if (this.inKeepAlive) {
+        instance.processFragment(this);
+        if (!this.keptAliveScopes) this.keptAliveScopes = /* @__PURE__ */ new Map();
+        this.keptAliveScopes.set(this.current, this.scope);
+      } else {
+        this.scope.stop();
+      }
+      const mode = transition && transition.mode;
+      if (mode) {
+        applyTransitionLeaveHooks(
+          this.nodes,
+          transition,
+          () => this.render(render, instance, transition, parent)
+        );
+        parent && remove(this.nodes, parent);
+        if (mode === "out-in") {
+          setActiveSub(prevSub);
+          return;
+        }
+      } else {
+        parent && remove(this.nodes, parent);
+      }
+    }
+    this.render(render, instance, transition, parent);
+    if (this.fallback) {
+      const hasNestedFragment = isFragment(this.nodes);
+      if (hasNestedFragment) {
+        setFragmentFallback(this.nodes, this.fallback);
+      }
+      const invalidFragment = findInvalidFragment(this);
+      if (invalidFragment) {
+        parent && remove(this.nodes, parent);
+        const scope = this.scope || (this.scope = new EffectScope());
+        scope.run(() => {
+          if (hasNestedFragment) {
+            renderFragmentFallback(invalidFragment);
           } else {
-            mergedRawProps[key] = [existing, value];
+            this.nodes = this.fallback() || [];
           }
-        } else {
-          mergedRawProps[key] = value;
-        }
+        });
+        parent && insert(this.nodes, parent, this.anchor);
       }
     }
+    setActiveSub(prevSub);
+    if (isHydrating) this.hydrate();
+  }
+  render(render, instance, transition, parent) {
+    if (render) {
+      const scope = this.inKeepAlive && this.keptAliveScopes ? this.keptAliveScopes.get(this.current) : void 0;
+      if (scope) {
+        this.scope = scope;
+        this.keptAliveScopes.delete(this.current);
+        this.scope.resume();
+      } else {
+        this.scope = new EffectScope();
+      }
+      this.nodes = this.scope.run(render) || [];
+      if (this.inKeepAlive) {
+        instance.cacheFragment(this);
+      }
+      if (transition) {
+        this.$transition = applyTransitionHooks(this.nodes, transition);
+      }
+      if (parent) insert(this.nodes, parent, this.anchor);
+    } else {
+      this.scope = void 0;
+      this.nodes = [];
+    }
   }
-  return mergedRawProps;
 }
-function propsSetDevTrap(_, key) {
-  warn(
-    `Attempt to mutate prop ${JSON.stringify(key)} failed. Props are readonly.`
-  );
-  return true;
+function setFragmentFallback(fragment, fallback) {
+  if (fragment.fallback) {
+    const originalFallback = fragment.fallback;
+    fragment.fallback = () => {
+      const fallbackNodes = originalFallback();
+      if (isValidBlock(fallbackNodes)) {
+        return fallbackNodes;
+      }
+      return fallback();
+    };
+  } else {
+    fragment.fallback = fallback;
+  }
+  if (isFragment(fragment.nodes)) {
+    setFragmentFallback(fragment.nodes, fragment.fallback);
+  }
 }
-function propsDeleteDevTrap(_, key) {
-  warn(
-    `Attempt to delete prop ${JSON.stringify(key)} failed. Props are readonly.`
-  );
-  return true;
+function renderFragmentFallback(fragment) {
+  if (fragment instanceof ForFragment) {
+    fragment.nodes[0] = [fragment.fallback() || []];
+  } else if (fragment instanceof DynamicFragment) {
+    fragment.update(fragment.fallback);
+  } else ;
 }
-const rawPropsProxyHandlers = {
-  get: getAttrFromRawProps,
-  has: hasAttrFromRawProps,
-  ownKeys: getKeysFromRawProps,
+function findInvalidFragment(fragment) {
+  if (isValidBlock(fragment.nodes)) return null;
+  return isFragment(fragment.nodes) ? findInvalidFragment(fragment.nodes) || fragment : fragment;
+}
+function isFragment(val) {
+  return val instanceof VaporFragment;
+}
+
+let currentSlotScopeIds = null;
+function setCurrentSlotScopeIds(scopeIds) {
+  const prev = currentSlotScopeIds;
+  currentSlotScopeIds = scopeIds;
+  return prev;
+}
+const dynamicSlotsProxyHandlers = {
+  get: getSlot,
+  has: (target, key) => !!getSlot(target, key),
   getOwnPropertyDescriptor(target, key) {
-    if (hasAttrFromRawProps(target, key)) {
+    const slot = getSlot(target, key);
+    if (slot) {
       return {
         configurable: true,
         enumerable: true,
-        get: () => getAttrFromRawProps(target, key)
+        value: slot
       };
     }
-  }
+  },
+  ownKeys(target) {
+    let keys = Object.keys(target);
+    const dynamicSources = target.$;
+    if (dynamicSources) {
+      keys = keys.filter((k) => k !== "$");
+      for (const source of dynamicSources) {
+        if (isFunction(source)) {
+          const slot = source();
+          if (isArray(slot)) {
+            for (const s of slot) keys.push(String(s.name));
+          } else {
+            keys.push(String(slot.name));
+          }
+        } else {
+          keys.push(...Object.keys(source));
+        }
+      }
+    }
+    return keys;
+  },
+  set: NO,
+  deleteProperty: NO
 };
+function getSlot(target, key) {
+  if (key === "$") return;
+  const dynamicSources = target.$;
+  if (dynamicSources) {
+    let i = dynamicSources.length;
+    let source;
+    while (i--) {
+      source = dynamicSources[i];
+      if (isFunction(source)) {
+        const slot = source();
+        if (slot) {
+          if (isArray(slot)) {
+            for (const s of slot) {
+              if (String(s.name) === key) return s.fn;
+            }
+          } else if (String(slot.name) === key) {
+            return slot.fn;
+          }
+        }
+      } else if (hasOwn(source, key)) {
+        return source[key];
+      }
+    }
+  }
+  if (hasOwn(target, key)) {
+    return target[key];
+  }
+}
+function withVaporCtx(fn) {
+  const instance = currentInstance;
+  return (...args) => {
+    const prev = setCurrentInstance(instance);
+    try {
+      return fn(...args);
+    } finally {
+      setCurrentInstance(...prev);
+    }
+  };
+}
+function createSlot(name, rawProps, fallback, noSlotted) {
+  const _insertionParent = insertionParent;
+  const _insertionAnchor = insertionAnchor;
+  const _isLastInsertion = isLastInsertion;
+  if (!isHydrating) resetInsertionState();
+  const instance = currentInstance;
+  const rawSlots = instance.rawSlots;
+  const slotProps = rawProps ? new Proxy(rawProps, rawPropsProxyHandlers) : EMPTY_OBJ;
+  let fragment;
+  if (isRef(rawSlots._)) {
+    if (isHydrating) locateHydrationNode();
+    fragment = instance.appContext.vapor.vdomSlot(
+      rawSlots._,
+      name,
+      slotProps,
+      instance,
+      fallback
+    );
+  } else {
+    fragment = isHydrating || !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("slot") : new DynamicFragment();
+    const isDynamicName = isFunction(name);
+    const slotScopeIds = [];
+    if (!noSlotted) {
+      const scopeId = instance.type.__scopeId;
+      if (scopeId) {
+        slotScopeIds.push(`${scopeId}-s`);
+      }
+    }
+    const renderSlot = () => {
+      const slot = getSlot(rawSlots, isFunction(name) ? name() : name);
+      if (slot) {
+        fragment.fallback = fallback;
+        fragment.update(
+          slot._bound || (slot._bound = () => {
+            const prevSlotScopeIds = setCurrentSlotScopeIds(
+              slotScopeIds.length > 0 ? slotScopeIds : null
+            );
+            try {
+              return slot(slotProps);
+            } finally {
+              setCurrentSlotScopeIds(prevSlotScopeIds);
+            }
+          })
+        );
+      } else {
+        fragment.update(fallback);
+      }
+    };
+    if (isDynamicName || rawSlots.$) {
+      renderEffect(renderSlot);
+    } else {
+      renderSlot();
+    }
+  }
+  if (!isHydrating) {
+    if (!noSlotted) {
+      const scopeId = instance.type.__scopeId;
+      if (scopeId) {
+        setScopeId(fragment, [`${scopeId}-s`]);
+      }
+    }
+    if (_insertionParent) insert(fragment, _insertionParent, _insertionAnchor);
+  } else {
+    if (fragment.insert) {
+      fragment.hydrate();
+    }
+    if (_isLastInsertion) {
+      advanceHydrationNode(_insertionParent);
+    }
+  }
+  return fragment;
+}
 
 function addEventListener(el, event, handler, options) {
   el.addEventListener(event, handler, options);
@@ -708,6 +1075,10 @@ function setAttr(el, key, value) {
   } else if (key === "false-value") {
     el._falseValue = value;
   }
+  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !attributeHasMismatch(el, key, value)) {
+    el[`$${key}`] = value;
+    return;
+  }
   if (value !== el[`$${key}`]) {
     el[`$${key}`] = value;
     if (value != null) {
@@ -717,10 +1088,13 @@ function setAttr(el, key, value) {
     }
   }
 }
-function setDOMProp(el, key, value) {
+function setDOMProp(el, key, value, forceHydrate = false) {
   if (!isApplyingFallthroughProps && el.$root && hasFallthroughKey(key)) {
     return;
   }
+  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !attributeHasMismatch(el, key, value) && !shouldForceHydrate(el, key) && !forceHydrate) {
+    return;
+  }
   const prev = el[key];
   if (value === prev) {
     return;
@@ -728,7 +1102,9 @@ function setDOMProp(el, key, value) {
   let needRemove = false;
   if (value === "" || value == null) {
     const type = typeof prev;
-    if (value == null && type === "string") {
+    if (type === "boolean") {
+      value = includeBooleanAttr(value);
+    } else if (value == null && type === "string") {
       value = "";
       needRemove = true;
     } else if (type === "number") {
@@ -751,14 +1127,26 @@ function setDOMProp(el, key, value) {
 function setClass(el, value) {
   if (el.$root) {
     setClassIncremental(el, value);
-  } else if ((value = normalizeClass(value)) !== el.$cls) {
-    el.className = el.$cls = value;
+  } else {
+    value = normalizeClass(value);
+    if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !classHasMismatch(el, value, false)) {
+      el.$cls = value;
+      return;
+    }
+    if (value !== el.$cls) {
+      el.className = el.$cls = value;
+    }
   }
 }
 function setClassIncremental(el, value) {
   const cacheKey = `$clsi${isApplyingFallthroughProps ? "$" : ""}`;
+  const normalizedValue = normalizeClass(value);
+  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !classHasMismatch(el, normalizedValue, true)) {
+    el[cacheKey] = normalizedValue;
+    return;
+  }
   const prev = el[cacheKey];
-  if ((value = el[cacheKey] = normalizeClass(value)) !== prev) {
+  if ((value = el[cacheKey] = normalizedValue) !== prev) {
     const nextList = value.split(/\s+/);
     if (value) {
       el.classList.add(...nextList);
@@ -774,23 +1162,31 @@ function setStyle(el, value) {
   if (el.$root) {
     setStyleIncremental(el, value);
   } else {
-    const prev = el.$sty;
-    value = el.$sty = normalizeStyle(value);
-    patchStyle(el, prev, value);
+    const normalizedValue = normalizeStyle(value);
+    if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !styleHasMismatch(el, value, normalizedValue, false)) {
+      el.$sty = normalizedValue;
+      return;
+    }
+    patchStyle(el, el.$sty, el.$sty = normalizedValue);
   }
 }
 function setStyleIncremental(el, value) {
   const cacheKey = `$styi${isApplyingFallthroughProps ? "$" : ""}`;
-  const prev = el[cacheKey];
-  value = el[cacheKey] = isString(value) ? parseStringStyle(value) : normalizeStyle(value);
-  patchStyle(el, prev, value);
-  return value;
+  const normalizedValue = isString(value) ? parseStringStyle(value) : normalizeStyle(value);
+  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !styleHasMismatch(el, value, normalizedValue, true)) {
+    el[cacheKey] = normalizedValue;
+    return;
+  }
+  patchStyle(el, el[cacheKey], el[cacheKey] = normalizedValue);
 }
-function setValue(el, value) {
+function setValue(el, value, forceHydrate = false) {
   if (!isApplyingFallthroughProps && el.$root && hasFallthroughKey("value")) {
     return;
   }
   el._value = value;
+  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating && !attributeHasMismatch(el, "value", getClientText(el, value)) && !shouldForceHydrate(el, "value") && !forceHydrate) {
+    return;
+  }
   const oldValue = el.tagName === "OPTION" ? el.getAttribute("value") : el.value;
   const newValue = value == null ? "" : value;
   if (oldValue !== newValue) {
@@ -801,21 +1197,105 @@ function setValue(el, value) {
   }
 }
 function setText(el, value) {
+  if (isHydrating) {
+    const clientText = getClientText(el.parentNode, value);
+    if (el.nodeValue == clientText) {
+      el.$txt = clientText;
+      return;
+    }
+    (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && warn(
+      `Hydration text mismatch in`,
+      el.parentNode,
+      `
+  - rendered on server: ${JSON.stringify(el.data)}
+  - expected on client: ${JSON.stringify(value)}`
+    );
+    logMismatchError();
+  }
   if (el.$txt !== value) {
     el.nodeValue = el.$txt = value;
   }
 }
 function setElementText(el, value) {
-  if (el.$txt !== (value = toDisplayString(value))) {
+  value = toDisplayString(value);
+  if (isHydrating) {
+    let clientText = getClientText(el, value);
+    if (el.textContent === clientText) {
+      el.$txt = clientText;
+      return;
+    }
+    if (!isMismatchAllowed(el, 0)) {
+      (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && warn(
+        `Hydration text content mismatch on`,
+        el,
+        `
+  - rendered on server: ${el.textContent}
+  - expected on client: ${clientText}`
+      );
+      logMismatchError();
+    }
+  }
+  if (el.$txt !== value) {
     el.textContent = el.$txt = value;
   }
 }
-function setHtml(el, value) {
+function setBlockText(block, value) {
   value = value == null ? "" : value;
+  if (block.$txt !== value) {
+    setTextToBlock(block, block.$txt = value);
+  }
+}
+function warnCannotSetProp(prop) {
+  warn(
+    `Extraneous non-props attributes (${prop}) were passed to component but could not be automatically inherited because component renders text or multiple root nodes.`
+  );
+}
+function setTextToBlock(block, value) {
+  if (block instanceof Node) {
+    if (block instanceof Element) {
+      block.textContent = value;
+    } else if (!!(process.env.NODE_ENV !== "production")) {
+      warnCannotSetProp("textContent");
+    }
+  } else if (isVaporComponent(block)) {
+    setTextToBlock(block.block, value);
+  } else if (isArray(block)) {
+    if (!!(process.env.NODE_ENV !== "production")) {
+      warnCannotSetProp("textContent");
+    }
+  } else {
+    setTextToBlock(block.nodes, value);
+  }
+}
+function setHtml(el, value) {
+  value = value == null ? "" : unsafeToTrustedHTML(value);
   if (el.$html !== value) {
     el.innerHTML = el.$html = value;
   }
 }
+function setBlockHtml(block, value) {
+  value = value == null ? "" : unsafeToTrustedHTML(value);
+  if (block.$html !== value) {
+    setHtmlToBlock(block, block.$html = value);
+  }
+}
+function setHtmlToBlock(block, value) {
+  if (block instanceof Node) {
+    if (block instanceof Element) {
+      block.innerHTML = value;
+    } else if (!!(process.env.NODE_ENV !== "production")) {
+      warnCannotSetProp("innerHTML");
+    }
+  } else if (isVaporComponent(block)) {
+    setHtmlToBlock(block.block, value);
+  } else if (isArray(block)) {
+    if (!!(process.env.NODE_ENV !== "production")) {
+      warnCannotSetProp("innerHTML");
+    }
+  } else {
+    setHtmlToBlock(block.nodes, value);
+  }
+}
 function setDynamicProps(el, args) {
   const props = args.length > 1 ? mergeProps(...args) : args[0];
   const cacheKey = `$dprops${isApplyingFallthroughProps ? "$" : ""}`;
@@ -833,21 +1313,25 @@ function setDynamicProps(el, args) {
 }
 function setDynamicProp(el, key, value) {
   const isSVG = false;
+  let forceHydrate = false;
   if (key === "class") {
     setClass(el, value);
   } else if (key === "style") {
     setStyle(el, value);
   } else if (isOn(key)) {
     on(el, key[2].toLowerCase() + key.slice(3), value, { effect: true });
-  } else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, value, isSVG)) {
+  } else if (
+    // force hydrate v-bind with .prop modifiers
+    (forceHydrate = key[0] === ".") ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, value, isSVG)
+  ) {
     if (key === "innerHTML") {
       setHtml(el, value);
     } else if (key === "textContent") {
       setElementText(el, value);
     } else if (key === "value" && canSetValueDirectly(el.tagName)) {
-      setValue(el, value);
+      setValue(el, value, forceHydrate);
     } else {
-      setDOMProp(el, key, value);
+      setDOMProp(el, key, value, forceHydrate);
     }
   } else {
     setAttr(el, key, value);
@@ -859,124 +1343,1453 @@ function optimizePropertyLookup() {
   if (isOptimized) return;
   isOptimized = true;
   const proto = Element.prototype;
-  proto.$evtclick = void 0;
+  proto.$transition = void 0;
+  proto.$key = void 0;
+  proto.$fc = proto.$evtclick = void 0;
   proto.$root = false;
   proto.$html = proto.$txt = proto.$cls = proto.$sty = Text.prototype.$txt = "";
 }
-
-const dynamicSlotsProxyHandlers = {
-  get: getSlot,
-  has: (target, key) => !!getSlot(target, key),
-  getOwnPropertyDescriptor(target, key) {
-    const slot = getSlot(target, key);
-    if (slot) {
-      return {
-        configurable: true,
-        enumerable: true,
-        value: slot
-      };
+function classHasMismatch(el, expected, isIncremental) {
+  const actual = el.getAttribute("class");
+  const actualClassSet = toClassSet(actual || "");
+  const expectedClassSet = toClassSet(expected);
+  let hasMismatch = false;
+  if (isIncremental) {
+    if (expected) {
+      hasMismatch = Array.from(expectedClassSet).some(
+        (cls) => !actualClassSet.has(cls)
+      );
     }
-  },
-  ownKeys(target) {
-    let keys = Object.keys(target);
-    const dynamicSources = target.$;
-    if (dynamicSources) {
-      keys = keys.filter((k) => k !== "$");
-      for (const source of dynamicSources) {
-        if (isFunction(source)) {
-          const slot = source();
-          if (isArray(slot)) {
-            for (const s of slot) keys.push(String(s.name));
-          } else {
-            keys.push(String(slot.name));
-          }
-        } else {
-          keys.push(...Object.keys(source));
-        }
-      }
+  } else {
+    hasMismatch = !isSetEqual(actualClassSet, expectedClassSet);
+  }
+  if (hasMismatch) {
+    warnPropMismatch(el, "class", 2, actual, expected);
+    logMismatchError();
+    return true;
+  }
+  return false;
+}
+function styleHasMismatch(el, value, normalizedValue, isIncremental) {
+  const actual = el.getAttribute("style");
+  const actualStyleMap = toStyleMap(actual || "");
+  const expected = isString(value) ? value : stringifyStyle(normalizedValue);
+  const expectedStyleMap = toStyleMap(expected);
+  if (el[vShowHidden]) {
+    expectedStyleMap.set("display", "none");
+  }
+  let hasMismatch = false;
+  if (isIncremental) {
+    if (expected) {
+      hasMismatch = Array.from(expectedStyleMap.entries()).some(
+        ([key, val]) => actualStyleMap.get(key) !== val
+      );
     }
-    return keys;
-  },
-  set: NO,
-  deleteProperty: NO
-};
-function getSlot(target, key) {
-  if (key === "$") return;
-  const dynamicSources = target.$;
-  if (dynamicSources) {
-    let i = dynamicSources.length;
-    let source;
+  } else {
+    hasMismatch = !isMapEqual(actualStyleMap, expectedStyleMap);
+  }
+  if (hasMismatch) {
+    warnPropMismatch(el, "style", 3, actual, expected);
+    logMismatchError();
+    return true;
+  }
+  return false;
+}
+function attributeHasMismatch(el, key, value) {
+  if (isValidHtmlOrSvgAttribute(el, key)) {
+    const { actual, expected } = getAttributeMismatch(el, key, value);
+    if (actual !== expected) {
+      warnPropMismatch(el, key, 4, actual, expected);
+      logMismatchError();
+      return true;
+    }
+  }
+  return false;
+}
+function getClientText(el, value) {
+  if (value[0] === "\n" && (el.tagName === "PRE" || el.tagName === "TEXTAREA")) {
+    value = value.slice(1);
+  }
+  return value;
+}
+function shouldForceHydrate(el, key) {
+  const { tagName } = el;
+  return (tagName === "INPUT" || tagName === "OPTION") && (key.endsWith("value") || key === "indeterminate") || // force hydrate custom element dynamic props
+  tagName.includes("-");
+}
+
+/*! #__NO_SIDE_EFFECTS__ */
+// @__NO_SIDE_EFFECTS__
+function defineVaporComponent(comp, extraOptions) {
+  if (isFunction(comp)) {
+    return /* @__PURE__ */ (() => extend({ name: comp.name }, extraOptions, {
+      setup: comp,
+      __vapor: true
+    }))();
+  }
+  comp.__vapor = true;
+  return comp;
+}
+
+const VaporKeepAliveImpl = defineVaporComponent({
+  name: "VaporKeepAlive",
+  __isKeepAlive: true,
+  props: {
+    include: [String, RegExp, Array],
+    exclude: [String, RegExp, Array],
+    max: [String, Number]
+  },
+  setup(props, { slots }) {
+    if (!slots.default) {
+      return void 0;
+    }
+    const keepAliveInstance = currentInstance;
+    const cache = /* @__PURE__ */ new Map();
+    const keys = /* @__PURE__ */ new Set();
+    const storageContainer = createElement("div");
+    let current;
+    if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
+      keepAliveInstance.__v_cache = cache;
+    }
+    function shouldCache(instance) {
+      if (isAsyncWrapper(instance) && !instance.type.__asyncResolved) {
+        return false;
+      }
+      const { include, exclude } = props;
+      const name = getComponentName(
+        isAsyncWrapper(instance) ? instance.type.__asyncResolved : instance.type
+      );
+      return !(include && (!name || !matches(include, name)) || exclude && name && matches(exclude, name));
+    }
+    function innerCacheBlock(key, instance) {
+      const { max } = props;
+      if (cache.has(key)) {
+        keys.delete(key);
+        keys.add(key);
+      } else {
+        keys.add(key);
+        if (max && keys.size > parseInt(max, 10)) {
+          pruneCacheEntry(keys.values().next().value);
+        }
+      }
+      cache.set(key, instance);
+      current = instance;
+    }
+    function cacheBlock() {
+      const block = keepAliveInstance.block;
+      const innerBlock = getInnerBlock(block);
+      if (!innerBlock || !shouldCache(innerBlock)) return;
+      let toCache;
+      let key;
+      let frag;
+      if (isFragment(block) && (frag = findInteropFragment(block))) {
+        toCache = frag;
+        key = frag.vnode.type;
+      } else {
+        toCache = innerBlock;
+        key = innerBlock.type;
+      }
+      innerCacheBlock(key, toCache);
+    }
+    onMounted(cacheBlock);
+    onUpdated(cacheBlock);
+    onBeforeUnmount(() => {
+      cache.forEach((cached, key) => {
+        const instance = getInstanceFromCache(cached);
+        if (!instance) return;
+        resetCachedShapeFlag(cached);
+        cache.delete(key);
+        if (current) {
+          const currentKey = isVaporComponent(current) ? current.type : current.vnode.type;
+          if (currentKey === key) {
+            const da = instance.da;
+            da && queuePostFlushCb(da);
+            return;
+          }
+        }
+        remove(cached, storageContainer);
+      });
+    });
+    keepAliveInstance.getStorageContainer = () => storageContainer;
+    keepAliveInstance.getCachedComponent = (comp) => {
+      return cache.get(comp);
+    };
+    keepAliveInstance.cacheComponent = (instance) => {
+      if (!shouldCache(instance)) return;
+      instance.shapeFlag |= 256;
+      innerCacheBlock(instance.type, instance);
+    };
+    keepAliveInstance.processFragment = (frag) => {
+      const innerBlock = getInnerBlock(frag.nodes);
+      if (!innerBlock) return;
+      const fragment = findInteropFragment(frag.nodes);
+      if (fragment) {
+        if (cache.has(fragment.vnode.type)) {
+          fragment.vnode.shapeFlag |= 512;
+        }
+        if (shouldCache(innerBlock)) {
+          fragment.vnode.shapeFlag |= 256;
+        }
+      } else {
+        if (cache.has(innerBlock.type)) {
+          innerBlock.shapeFlag |= 512;
+        }
+        if (shouldCache(innerBlock)) {
+          innerBlock.shapeFlag |= 256;
+        }
+      }
+    };
+    keepAliveInstance.cacheFragment = (fragment) => {
+      const innerBlock = getInnerBlock(fragment.nodes);
+      if (!innerBlock || !shouldCache(innerBlock)) return;
+      let toCache;
+      let key;
+      const frag = findInteropFragment(fragment);
+      if (frag) {
+        frag.vnode.shapeFlag |= 256;
+        toCache = frag;
+        key = frag.vnode.type;
+      } else {
+        innerBlock.shapeFlag |= 256;
+        toCache = innerBlock;
+        key = innerBlock.type;
+      }
+      innerCacheBlock(key, toCache);
+    };
+    keepAliveInstance.activate = (instance, parentNode, anchor) => {
+      current = instance;
+      activate(instance, parentNode, anchor);
+    };
+    keepAliveInstance.deactivate = (instance) => {
+      current = void 0;
+      deactivate(instance, storageContainer);
+    };
+    function resetCachedShapeFlag(cached) {
+      if (isVaporComponent(cached)) {
+        resetShapeFlag(cached);
+      } else {
+        resetShapeFlag(cached.vnode);
+      }
+    }
+    let children = slots.default();
+    if (isArray(children) && children.length > 1) {
+      if (!!(process.env.NODE_ENV !== "production")) {
+        warn(`KeepAlive should contain exactly one component child.`);
+      }
+      return children;
+    }
+    if (isVaporComponent(children)) {
+      children.shapeFlag |= 256;
+    } else if (isInteropFragment(children)) {
+      children.vnode.shapeFlag |= 256;
+    }
+    function pruneCache(filter) {
+      cache.forEach((cached, key) => {
+        const instance = getInstanceFromCache(cached);
+        if (!instance) return;
+        const name = getComponentName(instance.type);
+        if (name && !filter(name)) {
+          pruneCacheEntry(key);
+        }
+      });
+    }
+    function pruneCacheEntry(key) {
+      const cached = cache.get(key);
+      resetCachedShapeFlag(cached);
+      if (cached !== current) {
+        remove(cached);
+      }
+      cache.delete(key);
+      keys.delete(key);
+    }
+    watch(
+      () => [props.include, props.exclude],
+      ([include, exclude]) => {
+        include && pruneCache((name) => matches(include, name));
+        exclude && pruneCache((name) => !matches(exclude, name));
+      },
+      // prune post-render after `current` has been updated
+      { flush: "post", deep: true }
+    );
+    return children;
+  }
+});
+function getInnerBlock(block) {
+  if (isVaporComponent(block)) {
+    return block;
+  } else if (isInteropFragment(block)) {
+    return block.vnode;
+  } else if (isFragment(block)) {
+    return getInnerBlock(block.nodes);
+  }
+}
+function isInteropFragment(block) {
+  return !!(isFragment(block) && block.vnode);
+}
+function findInteropFragment(block) {
+  if (isInteropFragment(block)) {
+    return block;
+  }
+  if (isFragment(block)) {
+    return findInteropFragment(block.nodes);
+  }
+}
+function getInstanceFromCache(cached) {
+  if (isVaporComponent(cached)) {
+    return cached;
+  }
+  return cached.vnode.component;
+}
+function activate(instance, parentNode, anchor) {
+  insert(instance.block, parentNode, anchor);
+  queuePostFlushCb(() => {
+    instance.isDeactivated = false;
+    if (instance.a) invokeArrayFns(instance.a);
+  });
+  if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
+    devtoolsComponentAdded(instance);
+  }
+}
+function deactivate(instance, container) {
+  insert(instance.block, container);
+  queuePostFlushCb(() => {
+    if (instance.da) invokeArrayFns(instance.da);
+    instance.isDeactivated = true;
+  });
+  if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
+    devtoolsComponentAdded(instance);
+  }
+}
+function findParentKeepAlive(instance) {
+  let parent = instance;
+  while (parent) {
+    if (isKeepAlive(parent)) {
+      return parent;
+    }
+    parent = parent.parent;
+  }
+  return null;
+}
+
+const interopKey = Symbol(`interop`);
+const vaporInteropImpl = {
+  mount(vnode, container, anchor, parentComponent) {
+    let selfAnchor = vnode.el = vnode.anchor = createTextNode();
+    if (isHydrating) {
+      queuePostFlushCb(() => container.insertBefore(selfAnchor, anchor));
+    } else {
+      container.insertBefore(selfAnchor, anchor);
+    }
+    const prev = currentInstance;
+    simpleSetCurrentInstance(parentComponent);
+    const props = {};
+    for (const key in vnode.props) {
+      if (!isReservedProp(key)) {
+        props[key] = vnode.props[key];
+      }
+    }
+    const propsRef = shallowRef(props);
+    const slotsRef = shallowRef(vnode.children);
+    const dynamicPropSource = [
+      () => propsRef.value
+    ];
+    dynamicPropSource[interopKey] = true;
+    const instance = vnode.component = createComponent(
+      vnode.type,
+      {
+        $: dynamicPropSource
+      },
+      {
+        _: slotsRef
+        // pass the slots ref
+      },
+      void 0,
+      void 0,
+      parentComponent ? parentComponent.appContext : vnode.appContext
+    );
+    instance.rawPropsRef = propsRef;
+    instance.rawSlotsRef = slotsRef;
+    if (isKeepAlive(parentComponent)) instance.shapeFlag = vnode.shapeFlag;
+    if (vnode.transition) {
+      setTransitionHooks(
+        instance,
+        vnode.transition
+      );
+    }
+    mountComponent(instance, container, selfAnchor);
+    simpleSetCurrentInstance(prev);
+    return instance;
+  },
+  update(n1, n2, shouldUpdate) {
+    n2.component = n1.component;
+    n2.el = n2.anchor = n1.anchor;
+    if (shouldUpdate) {
+      const instance = n2.component;
+      instance.rawPropsRef.value = n2.props;
+      instance.rawSlotsRef.value = n2.children;
+    }
+  },
+  unmount(vnode, doRemove) {
+    const container = doRemove ? vnode.anchor.parentNode : void 0;
+    if (vnode.component) {
+      unmountComponent(vnode.component, container);
+    } else if (vnode.vb) {
+      remove(vnode.vb, container);
+    }
+    remove(vnode.anchor, container);
+  },
+  /**
+   * vapor slot in vdom
+   */
+  slot(n1, n2, container, anchor) {
+    if (!n1) {
+      let selfAnchor;
+      const { slot, fallback } = n2.vs;
+      const propsRef = n2.vs.ref = shallowRef(n2.props);
+      const slotBlock = slot(new Proxy(propsRef, vaporSlotPropsProxyHandler));
+      if (fallback && isFragment(slotBlock)) {
+        setFragmentFallback(slotBlock, createFallback(fallback));
+        selfAnchor = slotBlock.anchor;
+      }
+      if (!selfAnchor) selfAnchor = createTextNode();
+      insert(n2.el = n2.anchor = selfAnchor, container, anchor);
+      insert(n2.vb = slotBlock, container, selfAnchor);
+    } else {
+      n2.el = n2.anchor = n1.anchor;
+      n2.vb = n1.vb;
+      (n2.vs.ref = n1.vs.ref).value = n2.props;
+    }
+  },
+  move(vnode, container, anchor) {
+    insert(vnode.vb || vnode.component, container, anchor);
+    insert(vnode.anchor, container, anchor);
+  },
+  hydrate(vnode, node, container, anchor, parentComponent) {
+    hydrateNode(
+      node,
+      () => this.mount(vnode, container, anchor, parentComponent)
+    );
+    return _next(node);
+  },
+  hydrateSlot(vnode, node) {
+    const { slot } = vnode.vs;
+    const propsRef = vnode.vs.ref = shallowRef(vnode.props);
+    hydrateNode(node, () => {
+      vnode.vb = slot(new Proxy(propsRef, vaporSlotPropsProxyHandler));
+      vnode.anchor = vnode.el = currentHydrationNode;
+      if (!!(process.env.NODE_ENV !== "production") && !vnode.anchor) {
+        throw new Error(
+          `Failed to locate slot anchor. this is likely a Vue internal bug.`
+        );
+      }
+    });
+    return _next(vnode.anchor);
+  },
+  setTransitionHooks(component, hooks) {
+    setTransitionHooks(component, hooks);
+  },
+  activate(vnode, container, anchor, parentComponent) {
+    const cached = parentComponent.ctx.getCachedComponent(
+      vnode
+    );
+    vnode.el = cached.el;
+    vnode.component = cached.component;
+    vnode.anchor = cached.anchor;
+    activate(vnode.component, container, anchor);
+    insert(vnode.anchor, container, anchor);
+  },
+  deactivate(vnode, container) {
+    deactivate(vnode.component, container);
+    insert(vnode.anchor, container);
+  }
+};
+const vaporSlotPropsProxyHandler = {
+  get(target, key) {
+    return target.value[key];
+  },
+  has(target, key) {
+    return target.value[key];
+  },
+  ownKeys(target) {
+    return Object.keys(target.value);
+  }
+};
+const vaporSlotsProxyHandler = {
+  get(target, key) {
+    const slot = target[key];
+    if (isFunction(slot)) {
+      slot.__vapor = true;
+    }
+    return slot;
+  }
+};
+let vdomHydrateNode;
+function createVDOMComponent(internals, component, rawProps, rawSlots) {
+  const parentInstance = currentInstance;
+  const frag = new VaporFragment([]);
+  const vnode = frag.vnode = createVNode(
+    component,
+    rawProps && extend({}, new Proxy(rawProps, rawPropsProxyHandlers))
+  );
+  const wrapper = new VaporComponentInstance(
+    { props: component.props },
+    rawProps,
+    rawSlots
+  );
+  vnode.vi = (instance) => {
+    instance.props = shallowReactive(wrapper.props);
+    const attrs = instance.attrs = createInternalObject();
+    for (const key in wrapper.attrs) {
+      if (!isEmitListener(instance.emitsOptions, key)) {
+        attrs[key] = wrapper.attrs[key];
+      }
+    }
+    instance.slots = wrapper.slots === EMPTY_OBJ ? EMPTY_OBJ : new Proxy(wrapper.slots, vaporSlotsProxyHandler);
+  };
+  let rawRef = null;
+  let isMounted = false;
+  const unmount = (parentNode, transition) => {
+    if (rawRef) setRef$1(rawRef, null, null, vnode, true);
+    if (transition) setTransitionHooks$1(vnode, transition);
+    if (vnode.shapeFlag & 256) {
+      deactivate$1(
+        vnode,
+        findParentKeepAlive(parentInstance).getStorageContainer(),
+        internals,
+        parentInstance,
+        null
+      );
+      return;
+    }
+    internals.umt(vnode.component, null, !!parentNode);
+  };
+  frag.hydrate = () => {
+    hydrateVNode(vnode, parentInstance);
+    onScopeDispose(unmount, true);
+    isMounted = true;
+    frag.nodes = vnode.el;
+  };
+  vnode.scopeId = parentInstance && parentInstance.type.__scopeId;
+  vnode.slotScopeIds = currentSlotScopeIds;
+  frag.insert = (parentNode, anchor, transition) => {
+    if (isHydrating) return;
+    if (vnode.shapeFlag & 512) {
+      activate$1(
+        vnode,
+        parentNode,
+        anchor,
+        internals,
+        parentInstance,
+        null,
+        void 0,
+        false
+      );
+    } else {
+      const prev = currentInstance;
+      simpleSetCurrentInstance(parentInstance);
+      if (!isMounted) {
+        if (transition) setTransitionHooks$1(vnode, transition);
+        internals.mt(
+          vnode,
+          parentNode,
+          anchor,
+          parentInstance,
+          null,
+          void 0,
+          false
+        );
+        if (rawRef) setRef$1(rawRef, null, null, vnode);
+        onScopeDispose(unmount, true);
+        isMounted = true;
+      } else {
+        internals.m(
+          vnode,
+          parentNode,
+          anchor,
+          2,
+          parentInstance
+        );
+      }
+      simpleSetCurrentInstance(prev);
+    }
+    frag.nodes = vnode.el;
+  };
+  frag.remove = unmount;
+  frag.setRef = (instance, ref, refFor, refKey) => {
+    rawRef = normalizeRef(
+      {
+        ref,
+        ref_for: refFor,
+        ref_key: refKey
+      },
+      instance
+    );
+  };
+  return frag;
+}
+function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallback) {
+  const frag = new VaporFragment([]);
+  let isMounted = false;
+  let fallbackNodes;
+  let oldVNode = null;
+  frag.fallback = fallback;
+  frag.insert = (parentNode, anchor) => {
+    if (isHydrating) return;
+    if (!isMounted) {
+      render(parentNode, anchor);
+      isMounted = true;
+    } else {
+      internals.m(
+        oldVNode,
+        parentNode,
+        anchor,
+        2,
+        parentComponent
+      );
+    }
+    frag.remove = (parentNode2) => {
+      if (fallbackNodes) {
+        remove(fallbackNodes, parentNode2);
+      } else if (oldVNode) {
+        internals.um(oldVNode, parentComponent, null);
+      }
+    };
+  };
+  const render = (parentNode, anchor) => {
+    renderEffect(() => {
+      let vnode;
+      let isValidSlot = false;
+      if (slotsRef.value) {
+        vnode = renderSlot(
+          slotsRef.value,
+          isFunction(name) ? name() : name,
+          props
+        );
+        let children = vnode.children;
+        ensureVaporSlotFallback(children, fallback);
+        isValidSlot = children.length > 0;
+      }
+      if (isValidSlot) {
+        if (isHydrating) {
+          if (isVNode(vnode)) {
+            hydrateVNode(vnode, parentComponent);
+            oldVNode = vnode;
+            frag.nodes = vnode.el;
+          }
+        } else {
+          if (fallbackNodes) {
+            remove(fallbackNodes, parentNode);
+            fallbackNodes = void 0;
+          }
+          internals.p(
+            oldVNode,
+            vnode,
+            parentNode,
+            anchor,
+            parentComponent,
+            null,
+            // parentSuspense
+            void 0,
+            // namespace
+            vnode.slotScopeIds
+            // pass slotScopeIds for :slotted styles
+          );
+          oldVNode = vnode;
+          frag.nodes = vnode.el;
+        }
+      } else {
+        fallback = frag.fallback;
+        if (fallback && !fallbackNodes) {
+          fallbackNodes = fallback(internals, parentComponent);
+          if (isHydrating) {
+            if (isVNode(fallbackNodes)) {
+              hydrateVNode(fallbackNodes, parentComponent);
+              frag.nodes = fallbackNodes.el;
+            }
+          } else {
+            if (oldVNode) {
+              internals.um(oldVNode, parentComponent, null, true);
+            }
+            insert(fallbackNodes, parentNode, anchor);
+            frag.nodes = fallbackNodes;
+          }
+        }
+        oldVNode = null;
+      }
+    });
+  };
+  frag.hydrate = () => {
+    render();
+    isMounted = true;
+  };
+  return frag;
+}
+const vaporInteropPlugin = (app) => {
+  const internals = ensureRenderer().internals;
+  app._context.vapor = extend(vaporInteropImpl, {
+    vdomMount: createVDOMComponent.bind(null, internals),
+    vdomUnmount: internals.umt,
+    vdomSlot: renderVDOMSlot.bind(null, internals)
+  });
+  const mount = app.mount;
+  app.mount = ((...args) => {
+    optimizePropertyLookup();
+    return mount(...args);
+  });
+};
+function hydrateVNode(vnode, parentComponent) {
+  locateHydrationNode();
+  let node = currentHydrationNode;
+  while (isComment(node, "[") && // vnode is not a fragment
+  vnode.type !== Fragment && // not inside vdom slot
+  !(isVaporComponent(parentComponent) && isRef(parentComponent.rawSlots._))) {
+    node = node.nextSibling;
+  }
+  if (currentHydrationNode !== node) setCurrentHydrationNode(node);
+  if (!vdomHydrateNode) vdomHydrateNode = ensureHydrationRenderer().hydrateNode;
+  const nextNode = vdomHydrateNode(
+    currentHydrationNode,
+    vnode,
+    parentComponent,
+    null,
+    null,
+    false
+  );
+  if (nextNode) setCurrentHydrationNode(nextNode);
+  else advanceHydrationNode(node);
+}
+const createFallback = (fallback) => (internals, parentComponent) => {
+  const fallbackNodes = fallback();
+  if (isArray(fallbackNodes) && fallbackNodes.every(isVNode)) {
+    const frag = new VaporFragment([]);
+    frag.insert = (parentNode, anchor) => {
+      fallbackNodes.forEach((vnode) => {
+        internals.p(null, vnode, parentNode, anchor, parentComponent);
+      });
+    };
+    frag.remove = (parentNode) => {
+      fallbackNodes.forEach((vnode) => {
+        internals.um(vnode, parentComponent, null, true);
+      });
+    };
+    return frag;
+  }
+  return fallbackNodes;
+};
+
+function normalizeEmitsOptions(comp) {
+  const cached = comp.__emitsOptions;
+  if (cached) return cached;
+  const raw = comp.emits;
+  if (!raw) return null;
+  let normalized;
+  if (isArray(raw)) {
+    normalized = {};
+    for (const key of raw) normalized[key] = null;
+  } else {
+    normalized = raw;
+  }
+  return comp.__emitsOptions = normalized;
+}
+function emit(instance, event, ...rawArgs) {
+  baseEmit(
+    instance,
+    instance.rawProps || EMPTY_OBJ,
+    propGetter,
+    event,
+    ...rawArgs
+  );
+}
+function propGetter(rawProps, key) {
+  const dynamicSources = rawProps.$;
+  if (dynamicSources) {
+    let i = dynamicSources.length;
+    while (i--) {
+      const source = resolveSource(dynamicSources[i]);
+      if (hasOwn(source, key))
+        return dynamicSources[interopKey] ? source[key] : resolveSource(source[key]);
+    }
+  }
+  return rawProps[key] && resolveSource(rawProps[key]);
+}
+
+function resolveSource(source) {
+  return isFunction(source) ? source() : source;
+}
+function getPropsProxyHandlers(comp, once) {
+  if (comp.__propsHandlers) {
+    return comp.__propsHandlers;
+  }
+  const propsOptions = normalizePropsOptions(comp)[0];
+  const emitsOptions = normalizeEmitsOptions(comp);
+  const isProp = propsOptions ? (key) => isString(key) && hasOwn(propsOptions, camelize(key)) : NO;
+  const isAttr = propsOptions ? (key) => key !== "$" && !isProp(key) && !isEmitListener(emitsOptions, key) : YES;
+  const getProp = (instance, key) => {
+    if (key === "__v_isReactive") return true;
+    if (!isProp(key)) return;
+    const rawProps = instance.rawProps;
+    const dynamicSources = rawProps.$;
+    if (dynamicSources) {
+      let i = dynamicSources.length;
+      let source, isDynamic, rawKey;
+      while (i--) {
+        source = dynamicSources[i];
+        isDynamic = isFunction(source);
+        source = isDynamic ? source() : source;
+        for (rawKey in source) {
+          if (camelize(rawKey) === key) {
+            return resolvePropValue(
+              propsOptions,
+              key,
+              isDynamic ? source[rawKey] : source[rawKey](),
+              instance,
+              resolveDefault
+            );
+          }
+        }
+      }
+    }
+    for (const rawKey in rawProps) {
+      if (camelize(rawKey) === key) {
+        return resolvePropValue(
+          propsOptions,
+          key,
+          rawProps[rawKey](),
+          instance,
+          resolveDefault
+        );
+      }
+    }
+    return resolvePropValue(
+      propsOptions,
+      key,
+      void 0,
+      instance,
+      resolveDefault,
+      true
+    );
+  };
+  const getPropValue = once ? (...args) => {
+    pauseTracking();
+    const value = getProp(...args);
+    resetTracking();
+    return value;
+  } : getProp;
+  const propsHandlers = propsOptions ? {
+    get: (target, key) => getPropValue(target, key),
+    has: (_, key) => isProp(key),
+    ownKeys: () => Object.keys(propsOptions),
+    getOwnPropertyDescriptor(target, key) {
+      if (isProp(key)) {
+        return {
+          configurable: true,
+          enumerable: true,
+          get: () => getPropValue(target, key)
+        };
+      }
+    }
+  } : null;
+  if (!!(process.env.NODE_ENV !== "production") && propsOptions) {
+    Object.assign(propsHandlers, {
+      set: propsSetDevTrap,
+      deleteProperty: propsDeleteDevTrap
+    });
+  }
+  const getAttr = (target, key) => {
+    if (!isProp(key) && !isEmitListener(emitsOptions, key)) {
+      return getAttrFromRawProps(target, key);
+    }
+  };
+  const hasAttr = (target, key) => {
+    if (isAttr(key)) {
+      return hasAttrFromRawProps(target, key);
+    } else {
+      return false;
+    }
+  };
+  const getAttrValue = once ? (...args) => {
+    pauseTracking();
+    const value = getAttr(...args);
+    resetTracking();
+    return value;
+  } : getAttr;
+  const attrsHandlers = {
+    get: (target, key) => getAttrValue(target.rawProps, key),
+    has: (target, key) => hasAttr(target.rawProps, key),
+    ownKeys: (target) => getKeysFromRawProps(target.rawProps).filter(isAttr),
+    getOwnPropertyDescriptor(target, key) {
+      if (hasAttr(target.rawProps, key)) {
+        return {
+          configurable: true,
+          enumerable: true,
+          get: () => getAttrValue(target.rawProps, key)
+        };
+      }
+    }
+  };
+  if (!!(process.env.NODE_ENV !== "production")) {
+    Object.assign(attrsHandlers, {
+      set: propsSetDevTrap,
+      deleteProperty: propsDeleteDevTrap
+    });
+  }
+  return comp.__propsHandlers = [propsHandlers, attrsHandlers];
+}
+function getAttrFromRawProps(rawProps, key) {
+  if (key === "$") return;
+  const merged = key === "class" || key === "style" ? [] : void 0;
+  const dynamicSources = rawProps.$;
+  if (dynamicSources) {
+    let i = dynamicSources.length;
+    let source, isDynamic;
     while (i--) {
       source = dynamicSources[i];
-      if (isFunction(source)) {
-        const slot = source();
-        if (slot) {
-          if (isArray(slot)) {
-            for (const s of slot) {
-              if (String(s.name) === key) return s.fn;
+      isDynamic = isFunction(source);
+      source = isDynamic ? source() : source;
+      if (source && hasOwn(source, key)) {
+        const value = isDynamic ? source[key] : source[key]();
+        if (merged) {
+          merged.push(value);
+        } else {
+          return value;
+        }
+      }
+    }
+  }
+  if (hasOwn(rawProps, key)) {
+    if (merged) {
+      merged.push(rawProps[key]());
+    } else {
+      return rawProps[key]();
+    }
+  }
+  if (merged && merged.length) {
+    return merged;
+  }
+}
+function hasAttrFromRawProps(rawProps, key) {
+  if (key === "$") return false;
+  const dynamicSources = rawProps.$;
+  if (dynamicSources) {
+    let i = dynamicSources.length;
+    while (i--) {
+      const source = resolveSource(dynamicSources[i]);
+      if (source && hasOwn(source, key)) {
+        return true;
+      }
+    }
+  }
+  return hasOwn(rawProps, key);
+}
+function getKeysFromRawProps(rawProps) {
+  const keys = [];
+  for (const key in rawProps) {
+    if (key !== "$") keys.push(key);
+  }
+  const dynamicSources = rawProps.$;
+  if (dynamicSources) {
+    let i = dynamicSources.length;
+    let source;
+    while (i--) {
+      source = resolveSource(dynamicSources[i]);
+      for (const key in source) {
+        keys.push(key);
+      }
+    }
+  }
+  return Array.from(new Set(keys));
+}
+function normalizePropsOptions(comp) {
+  const cached = comp.__propsOptions;
+  if (cached) return cached;
+  const raw = comp.props;
+  if (!raw) return EMPTY_ARR;
+  const normalized = {};
+  const needCastKeys = [];
+  baseNormalizePropsOptions(raw, normalized, needCastKeys);
+  return comp.__propsOptions = [normalized, needCastKeys];
+}
+function resolveDefault(factory, instance) {
+  const prev = setCurrentInstance(instance);
+  const res = factory.call(null, instance.props);
+  setCurrentInstance(...prev);
+  return res;
+}
+function hasFallthroughAttrs(comp, rawProps) {
+  if (rawProps) {
+    if (rawProps.$ || !comp.props) {
+      return true;
+    } else {
+      const propsOptions = normalizePropsOptions(comp)[0];
+      for (const key in rawProps) {
+        if (!hasOwn(propsOptions, camelize(key))) {
+          return true;
+        }
+      }
+    }
+  }
+  return false;
+}
+function setupPropsValidation(instance) {
+  const rawProps = instance.rawProps;
+  if (!rawProps) return;
+  renderEffect(
+    () => {
+      pushWarningContext(instance);
+      validateProps(
+        resolveDynamicProps(rawProps),
+        instance.props,
+        normalizePropsOptions(instance.type)[0]
+      );
+      popWarningContext();
+    },
+    true
+    /* noLifecycle */
+  );
+}
+function resolveDynamicProps(props) {
+  const mergedRawProps = {};
+  for (const key in props) {
+    if (key !== "$") {
+      mergedRawProps[key] = props[key]();
+    }
+  }
+  if (props.$) {
+    for (const source of props.$) {
+      const isDynamic = isFunction(source);
+      const resolved = isDynamic ? source() : source;
+      for (const key in resolved) {
+        const value = isDynamic ? resolved[key] : resolved[key]();
+        if (key === "class" || key === "style") {
+          const existing = mergedRawProps[key];
+          if (isArray(existing)) {
+            existing.push(value);
+          } else {
+            mergedRawProps[key] = [existing, value];
+          }
+        } else {
+          mergedRawProps[key] = value;
+        }
+      }
+    }
+  }
+  return mergedRawProps;
+}
+function propsSetDevTrap(_, key) {
+  warn(
+    `Attempt to mutate prop ${JSON.stringify(key)} failed. Props are readonly.`
+  );
+  return true;
+}
+function propsDeleteDevTrap(_, key) {
+  warn(
+    `Attempt to delete prop ${JSON.stringify(key)} failed. Props are readonly.`
+  );
+  return true;
+}
+const rawPropsProxyHandlers = {
+  get: getAttrFromRawProps,
+  has: hasAttrFromRawProps,
+  ownKeys: getKeysFromRawProps,
+  getOwnPropertyDescriptor(target, key) {
+    if (hasAttrFromRawProps(target, key)) {
+      return {
+        configurable: true,
+        enumerable: true,
+        get: () => getAttrFromRawProps(target, key)
+      };
+    }
+  }
+};
+
+const VaporTeleportImpl = {
+  name: "VaporTeleport",
+  __isTeleport: true,
+  __vapor: true,
+  process(props, slots) {
+    return new TeleportFragment(props, slots);
+  }
+};
+class TeleportFragment extends VaporFragment {
+  constructor(props, slots) {
+    super([]);
+    this.insert = (container, anchor) => {
+      if (isHydrating) return;
+      this.placeholder = !!(process.env.NODE_ENV !== "production") ? createComment("teleport start") : createTextNode();
+      insert(this.placeholder, container, anchor);
+      insert(this.anchor, container, anchor);
+      this.handlePropsUpdate();
+    };
+    this.remove = (parent = this.parent) => {
+      if (this.nodes) {
+        remove(this.nodes, this.mountContainer);
+        this.nodes = [];
+      }
+      if (this.targetStart) {
+        remove(this.targetStart, this.target);
+        this.targetStart = void 0;
+        remove(this.targetAnchor, this.target);
+        this.targetAnchor = void 0;
+      }
+      if (this.anchor) {
+        remove(this.anchor, this.anchor.parentNode);
+        this.anchor = void 0;
+      }
+      if (this.placeholder) {
+        remove(this.placeholder, parent);
+        this.placeholder = void 0;
+      }
+      this.mountContainer = void 0;
+      this.mountAnchor = void 0;
+    };
+    this.hydrate = () => {
+      const target = this.target = resolveTeleportTarget(
+        this.resolvedProps,
+        querySelector
+      );
+      const disabled = isTeleportDisabled(this.resolvedProps);
+      this.placeholder = currentHydrationNode;
+      if (target) {
+        const targetNode = target._lpa || target.firstChild;
+        if (disabled) {
+          this.hydrateDisabledTeleport(targetNode);
+        } else {
+          this.anchor = locateTeleportEndAnchor();
+          this.mountContainer = target;
+          let targetAnchor = targetNode;
+          while (targetAnchor) {
+            if (targetAnchor && targetAnchor.nodeType === 8) {
+              if (targetAnchor.data === "teleport start anchor") {
+                this.targetStart = targetAnchor;
+              } else if (targetAnchor.data === "teleport anchor") {
+                this.mountAnchor = this.targetAnchor = targetAnchor;
+                target._lpa = this.targetAnchor && this.targetAnchor.nextSibling;
+                break;
+              }
             }
-          } else if (String(slot.name) === key) {
-            return slot.fn;
+            targetAnchor = targetAnchor.nextSibling;
+          }
+          if (targetNode) {
+            setCurrentHydrationNode(targetNode.nextSibling);
+          }
+          if (!this.targetAnchor) {
+            this.mount(target);
+          } else {
+            this.initChildren();
           }
         }
-      } else if (hasOwn(source, key)) {
-        return source[key];
+      } else if (disabled) {
+        this.hydrateDisabledTeleport(currentHydrationNode);
       }
+      advanceHydrationNode(this.anchor);
+    };
+    this.rawProps = props;
+    this.rawSlots = slots;
+    this.anchor = isHydrating ? void 0 : !!(process.env.NODE_ENV !== "production") ? createComment("teleport end") : createTextNode();
+    renderEffect(() => {
+      this.resolvedProps = extend(
+        {},
+        new Proxy(
+          this.rawProps,
+          rawPropsProxyHandlers
+        )
+      );
+      this.handlePropsUpdate();
+    });
+    if (!isHydrating) {
+      this.initChildren();
     }
   }
-  if (hasOwn(target, key)) {
-    return target[key];
+  get parent() {
+    return this.anchor ? this.anchor.parentNode : null;
   }
-}
-function createSlot(name, rawProps, fallback) {
-  const _insertionParent = insertionParent;
-  const _insertionAnchor = insertionAnchor;
-  if (isHydrating) {
-    locateHydrationNode();
-  } else {
-    resetInsertionState();
+  initChildren() {
+    renderEffect(() => {
+      this.handleChildrenUpdate(
+        this.rawSlots.default && this.rawSlots.default()
+      );
+    });
+    if (!!(process.env.NODE_ENV !== "production")) {
+      const nodes = this.nodes;
+      if (isVaporComponent(nodes)) {
+        nodes.parentTeleport = this;
+      } else if (isArray(nodes)) {
+        nodes.forEach(
+          (node) => isVaporComponent(node) && (node.parentTeleport = this)
+        );
+      }
+    }
   }
-  const instance = currentInstance;
-  const rawSlots = instance.rawSlots;
-  const slotProps = rawProps ? new Proxy(rawProps, rawPropsProxyHandlers) : EMPTY_OBJ;
-  let fragment;
-  if (isRef(rawSlots._)) {
-    fragment = instance.appContext.vapor.vdomSlot(
-      rawSlots._,
-      name,
-      slotProps,
-      instance,
-      fallback
+  handleChildrenUpdate(children) {
+    if (!this.parent || isHydrating) {
+      this.nodes = children;
+      return;
+    }
+    remove(this.nodes, this.mountContainer);
+    insert(this.nodes = children, this.mountContainer, this.mountAnchor);
+  }
+  handlePropsUpdate() {
+    if (!this.parent || isHydrating) return;
+    const mount = (parent, anchor) => {
+      if (this.$transition) {
+        applyTransitionHooks(this.nodes, this.$transition);
+      }
+      insert(
+        this.nodes,
+        this.mountContainer = parent,
+        this.mountAnchor = anchor
+      );
+    };
+    const mountToTarget = () => {
+      const target = this.target = resolveTeleportTarget(
+        this.resolvedProps,
+        querySelector
+      );
+      if (target) {
+        if (
+          // initial mount into target
+          !this.targetAnchor || // target changed
+          this.targetAnchor.parentNode !== target
+        ) {
+          insert(this.targetStart = createTextNode(""), target);
+          insert(this.targetAnchor = createTextNode(""), target);
+        }
+        mount(target, this.targetAnchor);
+      } else if (!!(process.env.NODE_ENV !== "production")) {
+        warn(
+          `Invalid Teleport target on ${this.targetAnchor ? "update" : "mount"}:`,
+          target,
+          `(${typeof target})`
+        );
+      }
+    };
+    if (isTeleportDisabled(this.resolvedProps)) {
+      mount(this.parent, this.anchor);
+    } else {
+      if (isTeleportDeferred(this.resolvedProps)) {
+        queuePostFlushCb(mountToTarget);
+      } else {
+        mountToTarget();
+      }
+    }
+  }
+  hydrateDisabledTeleport(targetNode) {
+    let nextNode = this.placeholder.nextSibling;
+    setCurrentHydrationNode(nextNode);
+    this.mountAnchor = this.anchor = locateTeleportEndAnchor(nextNode);
+    this.mountContainer = this.anchor.parentNode;
+    this.targetStart = targetNode;
+    this.targetAnchor = targetNode && targetNode.nextSibling;
+    this.initChildren();
+  }
+  mount(target) {
+    target.appendChild(this.targetStart = createTextNode(""));
+    target.appendChild(
+      this.mountAnchor = this.targetAnchor = createTextNode("")
     );
+    if (!isMismatchAllowed(target, 1)) {
+      if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) {
+        warn(
+          `Hydration children mismatch on`,
+          target,
+          `
+Server rendered element contains fewer child nodes than client nodes.`
+        );
+      }
+      logMismatchError();
+    }
+    runWithoutHydration(this.initChildren.bind(this));
+  }
+}
+function isVaporTeleport(value) {
+  return value === VaporTeleportImpl;
+}
+function locateTeleportEndAnchor(node = currentHydrationNode) {
+  while (node) {
+    if (isComment(node, "teleport end")) {
+      return node;
+    }
+    node = node.nextSibling;
+  }
+  return null;
+}
+
+function isBlock(val) {
+  return val instanceof Node || isArray(val) || isVaporComponent(val) || isFragment(val);
+}
+function isValidBlock(block) {
+  if (block instanceof Node) {
+    return !(block instanceof Comment);
+  } else if (isVaporComponent(block)) {
+    return isValidBlock(block.block);
+  } else if (isArray(block)) {
+    return block.length > 0 && block.some(isValidBlock);
   } else {
-    fragment = !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("slot") : new DynamicFragment();
-    const isDynamicName = isFunction(name);
-    const renderSlot = () => {
-      const slot = getSlot(rawSlots, isFunction(name) ? name() : name);
-      if (slot) {
-        fragment.update(
-          slot._bound || (slot._bound = () => {
-            const slotContent = slot(slotProps);
-            if (slotContent instanceof DynamicFragment) {
-              slotContent.fallback = fallback;
-            }
-            return slotContent;
-          })
+    return isValidBlock(block.nodes);
+  }
+}
+function insert(block, parent, anchor = null, parentSuspense) {
+  anchor = anchor === 0 ? parent.$fc || _child(parent) : anchor;
+  if (block instanceof Node) {
+    if (!isHydrating) {
+      if (block instanceof Element && block.$transition && !block.$transition.disabled) {
+        performTransitionEnter(
+          block,
+          block.$transition,
+          () => parent.insertBefore(block, anchor),
+          parentSuspense
         );
       } else {
-        fragment.update(fallback);
+        parent.insertBefore(block, anchor);
       }
-    };
-    if (isDynamicName || rawSlots.$) {
-      renderEffect(renderSlot);
+    }
+  } else if (isVaporComponent(block)) {
+    if (block.isMounted && !block.isDeactivated) {
+      insert(block.block, parent, anchor);
+    } else {
+      mountComponent(block, parent, anchor);
+    }
+  } else if (isArray(block)) {
+    for (const b of block) {
+      insert(b, parent, anchor);
+    }
+  } else {
+    if (block.anchor) {
+      insert(block.anchor, parent, anchor);
+      anchor = block.anchor;
+    }
+    if (block.insert) {
+      block.insert(parent, anchor, block.$transition);
+    } else {
+      insert(block.nodes, parent, anchor, parentSuspense);
+    }
+  }
+}
+function prepend(parent, ...blocks) {
+  let i = blocks.length;
+  while (i--) insert(blocks[i], parent, 0);
+}
+function remove(block, parent) {
+  if (block instanceof Node) {
+    if (block.$transition && block instanceof Element) {
+      performTransitionLeave(
+        block,
+        block.$transition,
+        () => parent && parent.removeChild(block)
+      );
+    } else {
+      parent && parent.removeChild(block);
+    }
+  } else if (isVaporComponent(block)) {
+    unmountComponent(block, parent);
+  } else if (isArray(block)) {
+    for (let i = 0; i < block.length; i++) {
+      remove(block[i], parent);
+    }
+  } else {
+    if (block.remove) {
+      block.remove(parent, block.$transition);
+    } else {
+      remove(block.nodes, parent);
+    }
+    if (block.anchor) remove(block.anchor, parent);
+    if (block.scope) {
+      block.scope.stop();
+      const scopes = block.keptAliveScopes;
+      if (scopes) {
+        scopes.forEach((scope) => scope.stop());
+        scopes.clear();
+      }
+    }
+  }
+}
+function normalizeBlock(block) {
+  if (!!!(process.env.NODE_ENV !== "production") && true) {
+    throw new Error(
+      "normalizeBlock should not be used in production code paths"
+    );
+  }
+  const nodes = [];
+  if (block instanceof Node) {
+    nodes.push(block);
+  } else if (isArray(block)) {
+    block.forEach((child) => nodes.push(...normalizeBlock(child)));
+  } else if (isVaporComponent(block)) {
+    nodes.push(...normalizeBlock(block.block));
+  } else {
+    if (block instanceof TeleportFragment) {
+      nodes.push(block.placeholder, block.anchor);
     } else {
-      renderSlot();
+      nodes.push(...normalizeBlock(block.nodes));
+      block.anchor && nodes.push(block.anchor);
     }
   }
-  if (!isHydrating && _insertionParent) {
-    insert(fragment, _insertionParent, _insertionAnchor);
+  return nodes;
+}
+function findBlockNode(block) {
+  let { parentNode, nextSibling: nextNode } = findLastChild(block);
+  if (nextNode && isComment(nextNode, "]") && isFragmentBlock(block)) {
+    nextNode = nextNode.nextSibling;
+  }
+  return {
+    parentNode,
+    nextNode
+  };
+}
+function findLastChild(node) {
+  if (node && node instanceof Node) {
+    return node;
+  } else if (isArray(node)) {
+    return findLastChild(node[node.length - 1]);
+  } else if (isVaporComponent(node)) {
+    return findLastChild(node.block);
+  } else {
+    if (node.anchor) return node.anchor;
+    return findLastChild(node.nodes);
+  }
+}
+function isFragmentBlock(block) {
+  if (isArray(block)) {
+    return true;
+  } else if (isVaporComponent(block)) {
+    return isFragmentBlock(block.block);
+  } else if (isFragment(block)) {
+    return isFragmentBlock(block.nodes);
+  }
+  return false;
+}
+function setScopeId(block, scopeIds) {
+  if (block instanceof Element) {
+    for (const id of scopeIds) {
+      block.setAttribute(id, "");
+    }
+  } else if (isVaporComponent(block)) {
+    setScopeId(block.block, scopeIds);
+  } else if (isArray(block)) {
+    for (const b of block) {
+      setScopeId(b, scopeIds);
+    }
+  } else if (isFragment(block)) {
+    setScopeId(block.nodes, scopeIds);
+  }
+}
+function setComponentScopeId(instance) {
+  const parent = instance.parent;
+  if (!parent) return;
+  if (isArray(instance.block) && instance.block.length > 1) return;
+  const scopeIds = [];
+  const scopeId = parent.type.__scopeId;
+  if (scopeId) {
+    scopeIds.push(scopeId);
+  }
+  if (parent.subTree && parent.subTree.component === instance && parent.vnode.scopeId) {
+    scopeIds.push(parent.vnode.scopeId);
+    const inheritedScopeIds = getInheritedScopeIds(parent.vnode, parent.parent);
+    scopeIds.push(...inheritedScopeIds);
+  }
+  if (scopeIds.length > 0) {
+    setScopeId(instance.block, scopeIds);
   }
-  return fragment;
 }
 
 function hmrRerender(instance) {
@@ -985,6 +2798,10 @@ function hmrRerender(instance) {
   const anchor = normalized[normalized.length - 1].nextSibling;
   remove(instance.block, parent);
   const prev = setCurrentInstance(instance);
+  if (instance.renderEffects) {
+    instance.renderEffects.forEach((e) => e.stop());
+    instance.renderEffects = [];
+  }
   pushWarningContext(instance);
   devRender(instance);
   popWarningContext();
@@ -996,7 +2813,8 @@ function hmrReload(instance, newComp) {
   const parent = normalized[0].parentNode;
   const anchor = normalized[normalized.length - 1].nextSibling;
   unmountComponent(instance, parent);
-  const prev = setCurrentInstance(instance.parent);
+  const parentInstance = instance.parent;
+  const prev = setCurrentInstance(parentInstance);
   const newInstance = createComponent(
     newComp,
     instance.rawProps,
@@ -1005,42 +2823,99 @@ function hmrReload(instance, newComp) {
   );
   setCurrentInstance(...prev);
   mountComponent(newInstance, parent, anchor);
+  updateParentBlockOnHmrReload(parentInstance, instance, newInstance);
+  updateParentTeleportOnHmrReload(instance, newInstance);
+}
+function updateParentBlockOnHmrReload(parentInstance, instance, newInstance) {
+  if (parentInstance) {
+    if (parentInstance.block === instance) {
+      parentInstance.block = newInstance;
+    } else if (isArray(parentInstance.block)) {
+      for (let i = 0; i < parentInstance.block.length; i++) {
+        if (parentInstance.block[i] === instance) {
+          parentInstance.block[i] = newInstance;
+          break;
+        }
+      }
+    }
+  }
+}
+function updateParentTeleportOnHmrReload(instance, newInstance) {
+  const teleport = instance.parentTeleport;
+  if (teleport) {
+    newInstance.parentTeleport = teleport;
+    if (teleport.nodes === instance) {
+      teleport.nodes = newInstance;
+    } else if (isArray(teleport.nodes)) {
+      for (let i = 0; i < teleport.nodes.length; i++) {
+        if (teleport.nodes[i] === instance) {
+          teleport.nodes[i] = newInstance;
+          break;
+        }
+      }
+    }
+  }
 }
 
-function createComponent(component, rawProps, rawSlots, isSingleRoot, appContext = currentInstance && currentInstance.appContext || emptyContext) {
+function createComponent(component, rawProps, rawSlots, isSingleRoot, once, appContext = currentInstance && currentInstance.appContext || emptyContext) {
   const _insertionParent = insertionParent;
   const _insertionAnchor = insertionAnchor;
+  const _isLastInsertion = isLastInsertion;
   if (isHydrating) {
     locateHydrationNode();
   } else {
     resetInsertionState();
   }
+  if (isSingleRoot && component.inheritAttrs !== false && isVaporComponent(currentInstance) && currentInstance.hasFallthrough) {
+    const attrs = currentInstance.attrs;
+    if (rawProps) {
+      (rawProps.$ || (rawProps.$ = [])).push(
+        () => attrs
+      );
+    } else {
+      rawProps = { $: [() => attrs] };
+    }
+  }
+  if (currentInstance && currentInstance.vapor && isKeepAlive(currentInstance)) {
+    const cached = currentInstance.getCachedComponent(
+      component
+    );
+    if (cached) return cached;
+  }
   if (appContext.vapor && !component.__vapor) {
     const frag = appContext.vapor.vdomMount(
       component,
       rawProps,
       rawSlots
     );
-    if (!isHydrating && _insertionParent) {
-      insert(frag, _insertionParent, _insertionAnchor);
+    if (!isHydrating) {
+      if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
+    } else {
+      frag.hydrate();
+      if (_isLastInsertion) {
+        advanceHydrationNode(_insertionParent);
+      }
     }
     return frag;
   }
-  if (isSingleRoot && component.inheritAttrs !== false && isVaporComponent(currentInstance) && currentInstance.hasFallthrough) {
-    const attrs = currentInstance.attrs;
-    if (rawProps) {
-      (rawProps.$ || (rawProps.$ = [])).push(
-        () => attrs
-      );
+  if (isVaporTeleport(component)) {
+    const frag = component.process(rawProps, rawSlots);
+    if (!isHydrating) {
+      if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
     } else {
-      rawProps = { $: [() => attrs] };
+      frag.hydrate();
+      if (_isLastInsertion) {
+        advanceHydrationNode(_insertionParent);
+      }
     }
+    return frag;
   }
   const instance = new VaporComponentInstance(
     component,
     rawProps,
     rawSlots,
-    appContext
+    appContext,
+    once
   );
   if (!!(process.env.NODE_ENV !== "production") && component.__hmrId) {
     registerHMR(instance);
@@ -1054,6 +2929,45 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, appContext
     instance.propsOptions = normalizePropsOptions(component);
     instance.emitsOptions = normalizeEmitsOptions(component);
   }
+  if (isHydrating && isAsyncWrapper(instance) && component.__asyncHydrate && !component.__asyncResolved) {
+    const el = currentHydrationNode;
+    if (isComment(el, "[")) {
+      const end = _next(locateEndAnchor(el));
+      const block = instance.block = [el];
+      let cur = el;
+      while (true) {
+        let n = _next(cur);
+        if (n && n !== end) {
+          block.push(cur = n);
+        } else {
+          break;
+        }
+      }
+    } else {
+      instance.block = el;
+    }
+    instance.isMounted = true;
+    setCurrentHydrationNode(
+      isComment(el, "[") ? locateEndAnchor(el) : el.nextSibling
+    );
+    component.__asyncHydrate(
+      el,
+      instance,
+      () => setupComponent(instance, component)
+    );
+  } else {
+    setupComponent(instance, component);
+  }
+  onScopeDispose$1(() => unmountComponent(instance), true);
+  if (_insertionParent || isHydrating) {
+    mountComponent(instance, _insertionParent, _insertionAnchor);
+  }
+  if (isHydrating && _insertionAnchor !== void 0) {
+    advanceHydrationNode(_insertionParent);
+  }
+  return instance;
+}
+function setupComponent(instance, component) {
   const prevInstance = setCurrentInstance(instance);
   const prevSub = setActiveSub();
   if (!!(process.env.NODE_ENV !== "production")) {
@@ -1090,14 +3004,7 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, appContext
     }
   }
   if (instance.hasFallthrough && component.inheritAttrs !== false && Object.keys(instance.attrs).length) {
-    const el = getRootElement(instance);
-    if (el) {
-      renderEffect(() => {
-        isApplyingFallthroughProps = true;
-        setDynamicProps(el, [instance.attrs]);
-        isApplyingFallthroughProps = false;
-      });
-    }
+    renderEffect(() => applyFallthroughProps(instance.block, instance.attrs));
   }
   setActiveSub(prevSub);
   setCurrentInstance(...prevInstance);
@@ -1105,13 +3012,16 @@ function createComponent(component, rawProps, rawSlots, isSingleRoot, appContext
     popWarningContext();
     endMeasure(instance, "init");
   }
-  onScopeDispose(() => unmountComponent(instance), true);
-  if (!isHydrating && _insertionParent) {
-    mountComponent(instance, _insertionParent, _insertionAnchor);
-  }
-  return instance;
 }
 let isApplyingFallthroughProps = false;
+function applyFallthroughProps(block, attrs) {
+  const el = getRootElement(block);
+  if (el) {
+    isApplyingFallthroughProps = true;
+    setDynamicProps(el, [attrs]);
+    isApplyingFallthroughProps = false;
+  }
+}
 function devRender(instance) {
   instance.block = (instance.type.render ? callWithErrorHandling(
     instance.type.render,
@@ -1145,7 +3055,7 @@ const emptyContext = {
   provides: /* @__PURE__ */ Object.create(null)
 };
 class VaporComponentInstance {
-  constructor(comp, rawProps, rawSlots, appContext) {
+  constructor(comp, rawProps, rawSlots, appContext, once) {
     this.vapor = true;
     this.uid = nextUid();
     this.type = comp;
@@ -1170,7 +3080,7 @@ class VaporComponentInstance {
     this.rawProps = rawProps || EMPTY_OBJ;
     this.hasFallthrough = hasFallthroughAttrs(comp, rawProps);
     if (rawProps || comp.props) {
-      const [propsHandlers, attrsHandlers] = getPropsProxyHandlers(comp);
+      const [propsHandlers, attrsHandlers] = getPropsProxyHandlers(comp, once);
       this.attrs = new Proxy(this, attrsHandlers);
       this.props = comp.props ? new Proxy(this, propsHandlers) : isFunction(comp) ? this.attrs : EMPTY_OBJ;
     } else {
@@ -1190,47 +3100,85 @@ class VaporComponentInstance {
 function isVaporComponent(value) {
   return value instanceof VaporComponentInstance;
 }
-function createComponentWithFallback(comp, rawProps, rawSlots, isSingleRoot) {
+function createComponentWithFallback(comp, rawProps, rawSlots, isSingleRoot, once, appContext) {
   if (!isString(comp)) {
-    return createComponent(comp, rawProps, rawSlots, isSingleRoot);
+    return createComponent(
+      comp,
+      rawProps,
+      rawSlots,
+      isSingleRoot,
+      once,
+      appContext
+    );
   }
   const _insertionParent = insertionParent;
   const _insertionAnchor = insertionAnchor;
+  const _isLastInsertion = isLastInsertion;
   if (isHydrating) {
     locateHydrationNode();
   } else {
     resetInsertionState();
   }
-  const el = document.createElement(comp);
+  const el = isHydrating ? adoptTemplate(currentHydrationNode, `<${comp}/>`) : createElement(comp);
   el.$root = isSingleRoot;
+  if (!isHydrating) {
+    const scopeId = currentInstance.type.__scopeId;
+    if (scopeId) setScopeId(el, [scopeId]);
+  }
   if (rawProps) {
-    renderEffect(() => {
-      setDynamicProps(el, [resolveDynamicProps(rawProps)]);
-    });
+    const setFn = () => setDynamicProps(el, [resolveDynamicProps(rawProps)]);
+    if (once) setFn();
+    else renderEffect(setFn);
   }
   if (rawSlots) {
+    let nextNode = null;
+    if (isHydrating) {
+      nextNode = locateNextNode(el);
+      setCurrentHydrationNode(el.firstChild);
+    }
     if (rawSlots.$) ; else {
       insert(getSlot(rawSlots, "default")(), el);
     }
+    if (isHydrating) {
+      setCurrentHydrationNode(nextNode);
+    }
   }
-  if (!isHydrating && _insertionParent) {
-    insert(el, _insertionParent, _insertionAnchor);
+  if (!isHydrating) {
+    if (_insertionParent) insert(el, _insertionParent, _insertionAnchor);
+  } else {
+    if (_isLastInsertion) {
+      advanceHydrationNode(_insertionParent);
+    }
   }
   return el;
 }
 function mountComponent(instance, parent, anchor) {
+  if (instance.shapeFlag & 512) {
+    findParentKeepAlive(instance).activate(instance, parent, anchor);
+    return;
+  }
   if (!!(process.env.NODE_ENV !== "production")) {
     startMeasure(instance, `mount`);
   }
   if (instance.bm) invokeArrayFns(instance.bm);
-  insert(instance.block, parent, anchor);
-  if (instance.m) queuePostFlushCb(() => invokeArrayFns(instance.m));
+  if (!isHydrating) {
+    insert(instance.block, parent, anchor);
+    setComponentScopeId(instance);
+  }
+  if (instance.m) queuePostFlushCb(instance.m);
+  if (instance.shapeFlag & 256 && instance.a) {
+    queuePostFlushCb(instance.a);
+  }
   instance.isMounted = true;
   if (!!(process.env.NODE_ENV !== "production")) {
     endMeasure(instance, `mount`);
   }
 }
 function unmountComponent(instance, parentNode) {
+  if (parentNode && instance.parent && instance.parent.vapor && instance.shapeFlag & 256) {
+    findParentKeepAlive(instance).deactivate(instance);
+    return;
+  }
   if (instance.isMounted && !instance.isUnmounted) {
     if (!!(process.env.NODE_ENV !== "production") && instance.type.__hmrId) {
       unregisterHMR(instance);
@@ -1240,7 +3188,7 @@ function unmountComponent(instance, parentNode) {
     }
     instance.scope.stop();
     if (instance.um) {
-      queuePostFlushCb(() => invokeArrayFns(instance.um));
+      queuePostFlushCb(instance.um);
     }
     instance.isUnmounted = true;
   }
@@ -1255,9 +3203,7 @@ function getExposed(instance) {
     }));
   }
 }
-function getRootElement({
-  block
-}) {
+function getRootElement(block) {
   if (block instanceof Element) {
     return block;
   }
@@ -1283,6 +3229,7 @@ const mountApp = (app, container) => {
     app._props,
     null,
     false,
+    false,
     app._context
   );
   mountComponent(instance, container);
@@ -1299,6 +3246,7 @@ const hydrateApp = (app, container) => {
       app._props,
       null,
       false,
+      false,
       app._context
     );
     mountComponent(instance, container);
@@ -1317,261 +3265,160 @@ function prepareApp() {
   target.__VUE__ = true;
   if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
     setDevtoolsHook(target.__VUE_DEVTOOLS_GLOBAL_HOOK__, target);
-  }
-}
-function postPrepareApp(app) {
-  if (!!(process.env.NODE_ENV !== "production")) {
-    app.config.globalProperties = new Proxy(
-      {},
-      {
-        set() {
-          warn(`app.config.globalProperties is not supported in vapor mode.`);
-          return false;
-        }
-      }
-    );
-  }
-  app.vapor = true;
-  const mount = app.mount;
-  app.mount = (container, ...args) => {
-    container = normalizeContainer(container);
-    return mount(container, ...args);
-  };
-}
-const createVaporApp = (comp, props) => {
-  prepareApp();
-  if (!_createApp) _createApp = createAppAPI(mountApp, unmountApp, getExposed);
-  const app = _createApp(comp, props);
-  postPrepareApp(app);
-  return app;
-};
-const createVaporSSRApp = (comp, props) => {
-  prepareApp();
-  if (!_hydrateApp)
-    _hydrateApp = createAppAPI(hydrateApp, unmountApp, getExposed);
-  const app = _hydrateApp(comp, props);
-  postPrepareApp(app);
-  return app;
-};
-
-/*! #__NO_SIDE_EFFECTS__ */
-// @__NO_SIDE_EFFECTS__
-function defineVaporComponent(comp, extraOptions) {
-  if (isFunction(comp)) {
-    return /* @__PURE__ */ (() => extend({ name: comp.name }, extraOptions, {
-      setup: comp,
-      __vapor: true
-    }))();
-  }
-  comp.__vapor = true;
-  return comp;
-}
-
-const vaporInteropImpl = {
-  mount(vnode, container, anchor, parentComponent) {
-    const selfAnchor = vnode.el = vnode.anchor = createTextNode();
-    container.insertBefore(selfAnchor, anchor);
-    const prev = currentInstance;
-    simpleSetCurrentInstance(parentComponent);
-    const propsRef = shallowRef(vnode.props);
-    const slotsRef = shallowRef(vnode.children);
-    const instance = vnode.component = createComponent(
-      vnode.type,
-      {
-        $: [() => propsRef.value]
-      },
-      {
-        _: slotsRef
-        // pass the slots ref
-      }
-    );
-    instance.rawPropsRef = propsRef;
-    instance.rawSlotsRef = slotsRef;
-    mountComponent(instance, container, selfAnchor);
-    simpleSetCurrentInstance(prev);
-    return instance;
-  },
-  update(n1, n2, shouldUpdate) {
-    n2.component = n1.component;
-    n2.el = n2.anchor = n1.anchor;
-    if (shouldUpdate) {
-      const instance = n2.component;
-      instance.rawPropsRef.value = n2.props;
-      instance.rawSlotsRef.value = n2.children;
-    }
-  },
-  unmount(vnode, doRemove) {
-    const container = doRemove ? vnode.anchor.parentNode : void 0;
-    if (vnode.component) {
-      unmountComponent(vnode.component, container);
-    } else if (vnode.vb) {
-      remove(vnode.vb, container);
-    }
-    remove(vnode.anchor, container);
-  },
-  /**
-   * vapor slot in vdom
-   */
-  slot(n1, n2, container, anchor) {
-    if (!n1) {
-      const selfAnchor = n2.el = n2.anchor = createTextNode();
-      insert(selfAnchor, container, anchor);
-      const { slot, fallback } = n2.vs;
-      const propsRef = n2.vs.ref = shallowRef(n2.props);
-      const slotBlock = slot(new Proxy(propsRef, vaporSlotPropsProxyHandler));
-      insert(n2.vb = slotBlock, container, selfAnchor);
-    } else {
-      n2.el = n2.anchor = n1.anchor;
-      n2.vb = n1.vb;
-      (n2.vs.ref = n1.vs.ref).value = n2.props;
-    }
-  },
-  move(vnode, container, anchor) {
-    insert(vnode.vb || vnode.component, container, anchor);
-    insert(vnode.anchor, container, anchor);
-  }
-};
-const vaporSlotPropsProxyHandler = {
-  get(target, key) {
-    return target.value[key];
-  },
-  has(target, key) {
-    return target.value[key];
-  },
-  ownKeys(target) {
-    return Object.keys(target.value);
-  }
-};
-const vaporSlotsProxyHandler = {
-  get(target, key) {
-    const slot = target[key];
-    if (isFunction(slot)) {
-      slot.__vapor = true;
-    }
-    return slot;
-  }
-};
-function createVDOMComponent(internals, component, rawProps, rawSlots) {
-  const frag = new VaporFragment([]);
-  const vnode = createVNode(
-    component,
-    rawProps && new Proxy(rawProps, rawPropsProxyHandlers)
-  );
-  const wrapper = new VaporComponentInstance(
-    { props: component.props },
-    rawProps,
-    rawSlots
-  );
-  vnode.vi = (instance) => {
-    instance.props = shallowReactive(wrapper.props);
-    const attrs = instance.attrs = createInternalObject();
-    for (const key in wrapper.attrs) {
-      if (!isEmitListener(instance.emitsOptions, key)) {
-        attrs[key] = wrapper.attrs[key];
-      }
+  }
+}
+function postPrepareApp(app) {
+  app.vapor = true;
+  const mount = app.mount;
+  app.mount = (container, ...args) => {
+    container = normalizeContainer(container);
+    const proxy = mount(container, ...args);
+    if (container instanceof Element) {
+      container.removeAttribute("v-cloak");
+      container.setAttribute("data-v-app", "");
     }
-    instance.slots = wrapper.slots === EMPTY_OBJ ? EMPTY_OBJ : new Proxy(wrapper.slots, vaporSlotsProxyHandler);
+    return proxy;
   };
-  let isMounted = false;
-  const parentInstance = currentInstance;
-  const unmount = (parentNode) => {
-    internals.umt(vnode.component, null, !!parentNode);
-  };
-  frag.insert = (parentNode, anchor) => {
-    if (!isMounted) {
-      internals.mt(
-        vnode,
-        parentNode,
-        anchor,
-        parentInstance,
-        null,
-        void 0,
-        false
+}
+const createVaporApp = (comp, props) => {
+  prepareApp();
+  if (!_createApp) _createApp = createAppAPI(mountApp, unmountApp, getExposed);
+  const app = _createApp(comp, props);
+  postPrepareApp(app);
+  return app;
+};
+const createVaporSSRApp = (comp, props) => {
+  prepareApp();
+  if (!_hydrateApp)
+    _hydrateApp = createAppAPI(hydrateApp, unmountApp, getExposed);
+  const app = _hydrateApp(comp, props);
+  postPrepareApp(app);
+  return app;
+};
+
+function defineVaporAsyncComponent(source) {
+  const {
+    load,
+    getResolvedComp,
+    setPendingRequest,
+    source: {
+      loadingComponent,
+      errorComponent,
+      delay,
+      hydrate: hydrateStrategy,
+      timeout,
+      suspensible = true
+    }
+  } = createAsyncComponentContext(source);
+  return defineVaporComponent({
+    name: "VaporAsyncComponentWrapper",
+    __asyncLoader: load,
+    __asyncHydrate(el, instance, hydrate) {
+      let isHydrated = false;
+      watch(
+        () => instance.attrs,
+        () => {
+          if (isHydrated) return;
+          instance.bu && invokeArrayFns(instance.bu);
+          const parent = parentNode(el);
+          load().then(() => {
+            if (instance.isUnmounted) return;
+            hydrate();
+            if (isComment(el, "[")) {
+              const endAnchor = locateEndAnchor(el);
+              removeFragmentNodes(el, endAnchor);
+              insert(instance.block, parent, endAnchor);
+            } else {
+              insert(instance.block, parent, el);
+              remove(el, parent);
+            }
+          });
+        },
+        { deep: true, once: true }
       );
-      onScopeDispose$1(unmount, true);
-      isMounted = true;
-    } else {
-      internals.m(
-        vnode,
-        parentNode,
-        anchor,
-        2,
-        parentInstance
+      performAsyncHydrate(
+        el,
+        instance,
+        () => {
+          hydrateNode(el, () => {
+            hydrate();
+            insert(instance.block, parentNode(el), el);
+            isHydrated = true;
+          });
+        },
+        getResolvedComp,
+        load,
+        hydrateStrategy
       );
-    }
-  };
-  frag.remove = unmount;
-  return frag;
-}
-function renderVDOMSlot(internals, slotsRef, name, props, parentComponent, fallback) {
-  const frag = new VaporFragment([]);
-  let isMounted = false;
-  let fallbackNodes;
-  let oldVNode = null;
-  frag.insert = (parentNode, anchor) => {
-    if (!isMounted) {
-      renderEffect(() => {
-        const vnode = renderSlot(
-          slotsRef.value,
-          isFunction(name) ? name() : name,
-          props
+    },
+    get __asyncResolved() {
+      return getResolvedComp();
+    },
+    setup() {
+      const instance = currentInstance;
+      markAsyncBoundary(instance);
+      const frag = !!(process.env.NODE_ENV !== "production") || isHydrating ? new DynamicFragment("async component") : new DynamicFragment();
+      let resolvedComp = getResolvedComp();
+      if (resolvedComp) {
+        frag.update(() => createInnerComp(resolvedComp, instance, frag));
+        return frag;
+      }
+      const onError = (err) => {
+        setPendingRequest(null);
+        handleError(
+          err,
+          instance,
+          13,
+          !errorComponent
         );
-        if (vnode.children.length) {
-          if (fallbackNodes) {
-            remove(fallbackNodes, parentNode);
-            fallbackNodes = void 0;
-          }
-          internals.p(
-            oldVNode,
-            vnode,
-            parentNode,
-            anchor,
-            parentComponent
-          );
-          oldVNode = vnode;
-        } else {
-          if (fallback && !fallbackNodes) {
-            if (oldVNode) {
-              internals.um(oldVNode, parentComponent, null, true);
-            }
-            insert(fallbackNodes = fallback(props), parentNode, anchor);
-          }
-          oldVNode = null;
+      };
+      if (suspensible && instance.suspense) ;
+      const { loaded, error, delayed } = useAsyncComponentState(
+        delay,
+        timeout,
+        onError
+      );
+      load().then(() => {
+        loaded.value = true;
+      }).catch((err) => {
+        onError(err);
+        error.value = err;
+      });
+      renderEffect(() => {
+        resolvedComp = getResolvedComp();
+        let render;
+        if (loaded.value && resolvedComp) {
+          render = () => createInnerComp(resolvedComp, instance, frag);
+        } else if (error.value && errorComponent) {
+          render = () => createComponent(errorComponent, { error: () => error.value });
+        } else if (loadingComponent && !delayed.value) {
+          render = () => createComponent(loadingComponent);
         }
+        if (instance.$transition) frag.$transition = instance.$transition;
+        frag.update(render);
       });
-      isMounted = true;
-    } else {
-      internals.m(
-        oldVNode,
-        parentNode,
-        anchor,
-        2,
-        parentComponent
-      );
+      return frag;
     }
-    frag.remove = (parentNode2) => {
-      if (fallbackNodes) {
-        remove(fallbackNodes, parentNode2);
-      } else if (oldVNode) {
-        internals.um(oldVNode, parentComponent, null);
-      }
-    };
-  };
-  return frag;
-}
-const vaporInteropPlugin = (app) => {
-  const internals = ensureRenderer().internals;
-  app._context.vapor = extend(vaporInteropImpl, {
-    vdomMount: createVDOMComponent.bind(null, internals),
-    vdomUnmount: internals.umt,
-    vdomSlot: renderVDOMSlot.bind(null, internals)
   });
-  const mount = app.mount;
-  app.mount = (...args) => {
-    optimizePropertyLookup();
-    return mount(...args);
-  };
-};
+}
+function createInnerComp(comp, parent, frag) {
+  const { rawProps, rawSlots, isSingleRoot, appContext, $transition } = parent;
+  const instance = createComponent(
+    comp,
+    rawProps,
+    rawSlots,
+    isSingleRoot,
+    void 0,
+    appContext
+  );
+  if (parent.parent && isKeepAlive(parent.parent)) {
+    parent.parent.cacheComponent(instance);
+    parent.parent.cacheComponent(parent);
+  }
+  if ($transition) setTransitionHooks(instance, $transition);
+  frag && frag.setRef && frag.setRef(instance);
+  return instance;
+}
 
 let t;
 /*! #__NO_SIDE_EFFECTS__ */
@@ -1580,18 +3427,17 @@ function template(html, root) {
   let node;
   return () => {
     if (isHydrating) {
-      if (!!(process.env.NODE_ENV !== "production") && !currentHydrationNode) {
-        throw new Error("No current hydration node");
-      }
-      return adoptTemplate(currentHydrationNode, html);
+      const adopted = adoptTemplate(currentHydrationNode, html);
+      if (root) adopted.$root = true;
+      return adopted;
     }
     if (html[0] !== "<") {
       return createTextNode(html);
     }
     if (!node) {
-      t = t || document.createElement("template");
+      t = t || createElement("template");
       t.innerHTML = html;
-      node = child(t.content);
+      node = _child(t.content);
     }
     const ret = node.cloneNode(true);
     if (root) ret.$root = true;
@@ -1602,20 +3448,40 @@ function template(html, root) {
 function createIf(condition, b1, b2, once) {
   const _insertionParent = insertionParent;
   const _insertionAnchor = insertionAnchor;
-  if (isHydrating) {
-    locateHydrationNode();
-  } else {
-    resetInsertionState();
-  }
+  const _isLastInsertion = isLastInsertion;
+  if (!isHydrating) resetInsertionState();
   let frag;
   if (once) {
     frag = condition() ? b1() : b2 ? b2() : [];
   } else {
-    frag = !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("if") : new DynamicFragment();
+    frag = isHydrating || !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("if") : new DynamicFragment();
     renderEffect(() => frag.update(condition() ? b1 : b2));
   }
-  if (!isHydrating && _insertionParent) {
-    insert(frag, _insertionParent, _insertionAnchor);
+  if (!isHydrating) {
+    if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
+  } else {
+    if (_isLastInsertion) {
+      advanceHydrationNode(_insertionParent);
+    }
+  }
+  return frag;
+}
+
+function createKeyedFragment(key, render) {
+  const _insertionParent = insertionParent;
+  const _insertionAnchor = insertionAnchor;
+  const _isLastInsertion = isLastInsertion;
+  if (!isHydrating) resetInsertionState();
+  const frag = !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("keyed") : new DynamicFragment();
+  renderEffect(() => {
+    frag.update(render, key());
+  });
+  if (!isHydrating) {
+    if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
+  } else {
+    if (_isLastInsertion) {
+      advanceHydrationNode(_insertionParent);
+    }
   }
   return frag;
 }
@@ -1630,9 +3496,10 @@ class ForBlock extends VaporFragment {
     this.key = renderKey;
   }
 }
-const createFor = (src, renderItem, getKey, flags = 0) => {
+const createFor = (src, renderItem, getKey, flags = 0, setup) => {
   const _insertionParent = insertionParent;
   const _insertionAnchor = insertionAnchor;
+  const _isLastInsertion = isLastInsertion;
   if (isHydrating) {
     locateHydrationNode();
   } else {
@@ -1643,8 +3510,11 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
   let newBlocks;
   let parent;
   let currentKey;
-  const parentAnchor = !!(process.env.NODE_ENV !== "production") ? createComment("for") : createTextNode();
-  const frag = new VaporFragment(oldBlocks);
+  let parentAnchor;
+  if (!isHydrating) {
+    parentAnchor = !!(process.env.NODE_ENV !== "production") ? createComment("for") : createTextNode();
+  }
+  const frag = new ForFragment(oldBlocks);
   const instance = currentInstance;
   const canUseFastRemove = !!(flags & 1);
   const isComponent = !!(flags & 2);
@@ -1657,15 +3527,33 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
     const newLength = source.values.length;
     const oldLength = oldBlocks.length;
     newBlocks = new Array(newLength);
+    let isFallback = false;
     const prevSub = setActiveSub();
     if (!isMounted) {
       isMounted = true;
       for (let i = 0; i < newLength; i++) {
-        mount(source, i);
+        const nodes = mount(source, i).nodes;
+        if (isHydrating) {
+          setCurrentHydrationNode(findBlockNode(nodes).nextNode);
+        }
+      }
+      if (isHydrating) {
+        parentAnchor = newLength === 0 ? currentHydrationNode.nextSibling : currentHydrationNode;
+        if (!!(process.env.NODE_ENV !== "production") && (!parentAnchor || parentAnchor && !isComment(parentAnchor, "]"))) {
+          throw new Error(
+            `v-for fragment anchor node was not found. this is likely a Vue internal bug.`
+          );
+        }
+        if (_insertionParent) {
+          updateLastLogicalChild(_insertionParent, parentAnchor);
+        }
       }
     } else {
       parent = parent || parentAnchor.parentNode;
       if (!oldLength) {
+        if (frag.fallback && frag.nodes[0].length > 0) {
+          remove(frag.nodes[0], parent);
+        }
         for (let i = 0; i < newLength; i++) {
           mount(source, i);
         }
@@ -1681,6 +3569,10 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
           parent.textContent = "";
           parent.appendChild(parentAnchor);
         }
+        if (frag.fallback) {
+          insert(frag.nodes[0] = frag.fallback(), parent, parentAnchor);
+          isFallback = true;
+        }
       } else if (!getKey) {
         const commonLength = Math.min(newLength, oldLength);
         for (let i = 0; i < commonLength; i++) {
@@ -1693,147 +3585,163 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
           unmount(oldBlocks[i]);
         }
       } else {
-        const sharedBlockCount = Math.min(oldLength, newLength);
-        const previousKeyIndexPairs = new Array(oldLength);
+        if (!!(process.env.NODE_ENV !== "production")) {
+          const keyToIndexMap = /* @__PURE__ */ new Map();
+          for (let i = 0; i < newLength; i++) {
+            const item = getItem(source, i);
+            const key = getKey(...item);
+            if (key != null) {
+              if (keyToIndexMap.has(key)) {
+                warn(
+                  `Duplicate keys found during update:`,
+                  JSON.stringify(key),
+                  `Make sure keys are unique.`
+                );
+              }
+              keyToIndexMap.set(key, i);
+            }
+          }
+        }
+        const commonLength = Math.min(oldLength, newLength);
+        const oldKeyIndexPairs = new Array(oldLength);
         const queuedBlocks = new Array(newLength);
-        let anchorFallback = parentAnchor;
         let endOffset = 0;
-        let startOffset = 0;
-        let queuedBlocksInsertIndex = 0;
-        let previousKeyIndexInsertIndex = 0;
-        while (endOffset < sharedBlockCount) {
-          const currentIndex = newLength - endOffset - 1;
-          const currentItem = getItem(source, currentIndex);
-          const currentKey2 = getKey(...currentItem);
+        let queuedBlocksLength = 0;
+        let oldKeyIndexPairsLength = 0;
+        while (endOffset < commonLength) {
+          const index = newLength - endOffset - 1;
+          const item = getItem(source, index);
+          const key = getKey(...item);
           const existingBlock = oldBlocks[oldLength - endOffset - 1];
-          if (existingBlock.key === currentKey2) {
-            update(existingBlock, ...currentItem);
-            newBlocks[currentIndex] = existingBlock;
-            endOffset++;
-            continue;
-          }
-          if (endOffset !== 0) {
-            anchorFallback = normalizeAnchor(newBlocks[currentIndex + 1].nodes);
-          }
-          break;
+          if (existingBlock.key !== key) break;
+          update(existingBlock, ...item);
+          newBlocks[index] = existingBlock;
+          endOffset++;
         }
-        while (startOffset < sharedBlockCount - endOffset) {
-          const currentItem = getItem(source, startOffset);
+        const e1 = commonLength - endOffset;
+        const e2 = oldLength - endOffset;
+        const e3 = newLength - endOffset;
+        for (let i = 0; i < e1; i++) {
+          const currentItem = getItem(source, i);
           const currentKey2 = getKey(...currentItem);
-          const previousBlock = oldBlocks[startOffset];
-          const previousKey = previousBlock.key;
-          if (previousKey === currentKey2) {
-            update(newBlocks[startOffset] = previousBlock, currentItem[0]);
+          const oldBlock = oldBlocks[i];
+          const oldKey = oldBlock.key;
+          if (oldKey === currentKey2) {
+            update(newBlocks[i] = oldBlock, currentItem[0]);
           } else {
-            queuedBlocks[queuedBlocksInsertIndex++] = [
-              startOffset,
-              currentItem,
-              currentKey2
-            ];
-            previousKeyIndexPairs[previousKeyIndexInsertIndex++] = [
-              previousKey,
-              startOffset
-            ];
+            queuedBlocks[queuedBlocksLength++] = [i, currentItem, currentKey2];
+            oldKeyIndexPairs[oldKeyIndexPairsLength++] = [oldKey, i];
           }
-          startOffset++;
         }
-        for (let i = startOffset; i < oldLength - endOffset; i++) {
-          previousKeyIndexPairs[previousKeyIndexInsertIndex++] = [
-            oldBlocks[i].key,
-            i
-          ];
+        for (let i = e1; i < e2; i++) {
+          oldKeyIndexPairs[oldKeyIndexPairsLength++] = [oldBlocks[i].key, i];
         }
-        const preparationBlockCount = Math.min(
-          newLength - endOffset,
-          sharedBlockCount
-        );
-        for (let i = startOffset; i < preparationBlockCount; i++) {
+        for (let i = e1; i < e3; i++) {
           const blockItem = getItem(source, i);
           const blockKey = getKey(...blockItem);
-          queuedBlocks[queuedBlocksInsertIndex++] = [i, blockItem, blockKey];
+          queuedBlocks[queuedBlocksLength++] = [i, blockItem, blockKey];
         }
-        if (!queuedBlocksInsertIndex && !previousKeyIndexInsertIndex) {
-          for (let i = preparationBlockCount; i < newLength - endOffset; i++) {
-            const blockItem = getItem(source, i);
-            const blockKey = getKey(...blockItem);
-            mount(source, i, anchorFallback, blockItem, blockKey);
+        queuedBlocks.length = queuedBlocksLength;
+        oldKeyIndexPairs.length = oldKeyIndexPairsLength;
+        const oldKeyIndexMap = new Map(oldKeyIndexPairs);
+        const opers = new Array(queuedBlocks.length);
+        let mountCounter = 0;
+        let opersLength = 0;
+        for (let i = queuedBlocks.length - 1; i >= 0; i--) {
+          const [index, item, key] = queuedBlocks[i];
+          const oldIndex = oldKeyIndexMap.get(key);
+          if (oldIndex !== void 0) {
+            oldKeyIndexMap.delete(key);
+            const reusedBlock = newBlocks[index] = oldBlocks[oldIndex];
+            update(reusedBlock, ...item);
+            opers[opersLength++] = { index, block: reusedBlock };
+          } else {
+            mountCounter++;
+            opers[opersLength++] = { source, index, item, key };
           }
-        } else {
-          queuedBlocks.length = queuedBlocksInsertIndex;
-          previousKeyIndexPairs.length = previousKeyIndexInsertIndex;
-          const previousKeyIndexMap = new Map(previousKeyIndexPairs);
-          const blocksToMount = [];
-          const relocateOrMountBlock = (blockIndex, blockItem, blockKey, anchorOffset) => {
-            const previousIndex = previousKeyIndexMap.get(blockKey);
-            if (previousIndex !== void 0) {
-              const reusedBlock = newBlocks[blockIndex] = oldBlocks[previousIndex];
-              update(reusedBlock, ...blockItem);
-              insert(
-                reusedBlock,
-                parent,
-                anchorOffset === -1 ? anchorFallback : normalizeAnchor(newBlocks[anchorOffset].nodes)
-              );
-              previousKeyIndexMap.delete(blockKey);
-            } else {
-              blocksToMount.push([
-                blockIndex,
-                blockItem,
-                blockKey,
-                anchorOffset
-              ]);
-            }
-          };
-          for (let i = queuedBlocks.length - 1; i >= 0; i--) {
-            const [blockIndex, blockItem, blockKey] = queuedBlocks[i];
-            relocateOrMountBlock(
-              blockIndex,
-              blockItem,
-              blockKey,
-              blockIndex < preparationBlockCount - 1 ? blockIndex + 1 : -1
-            );
+        }
+        const useFastRemove = mountCounter === newLength;
+        for (const leftoverIndex of oldKeyIndexMap.values()) {
+          unmount(
+            oldBlocks[leftoverIndex],
+            !(useFastRemove && canUseFastRemove),
+            !useFastRemove
+          );
+        }
+        if (useFastRemove) {
+          for (const selector of selectors) {
+            selector.cleanup();
           }
-          for (let i = preparationBlockCount; i < newLength - endOffset; i++) {
-            const blockItem = getItem(source, i);
-            const blockKey = getKey(...blockItem);
-            relocateOrMountBlock(i, blockItem, blockKey, -1);
+          if (canUseFastRemove) {
+            parent.textContent = "";
+            parent.appendChild(parentAnchor);
           }
-          const useFastRemove = blocksToMount.length === newLength;
-          for (const leftoverIndex of previousKeyIndexMap.values()) {
-            unmount(
-              oldBlocks[leftoverIndex],
-              !(useFastRemove && canUseFastRemove),
-              !useFastRemove
+        }
+        if (opers.length === mountCounter) {
+          for (const { source: source2, index, item, key } of opers) {
+            mount(
+              source2,
+              index,
+              index < newLength - 1 ? normalizeAnchor(newBlocks[index + 1].nodes) : parentAnchor,
+              item,
+              key
             );
           }
-          if (useFastRemove) {
-            for (const selector of selectors) {
-              selector.cleanup();
+        } else if (opers.length) {
+          let anchor = oldBlocks[0];
+          let blocksTail;
+          for (let i = 0; i < oldLength; i++) {
+            const block = oldBlocks[i];
+            if (oldKeyIndexMap.has(block.key)) {
+              continue;
             }
-            if (canUseFastRemove) {
-              parent.textContent = "";
-              parent.appendChild(parentAnchor);
+            block.prevAnchor = anchor;
+            anchor = oldBlocks[i + 1];
+            if (blocksTail !== void 0) {
+              blocksTail.next = block;
+              block.prev = blocksTail;
             }
+            blocksTail = block;
           }
-          for (const [
-            blockIndex,
-            blockItem,
-            blockKey,
-            anchorOffset
-          ] of blocksToMount) {
-            mount(
-              source,
-              blockIndex,
-              anchorOffset === -1 ? anchorFallback : normalizeAnchor(newBlocks[anchorOffset].nodes),
-              blockItem,
-              blockKey
-            );
+          for (const action of opers) {
+            const { index } = action;
+            if (index < newLength - 1) {
+              const nextBlock = newBlocks[index + 1];
+              let anchorNode = normalizeAnchor(nextBlock.prevAnchor.nodes);
+              if (!anchorNode.parentNode)
+                anchorNode = normalizeAnchor(nextBlock.nodes);
+              if ("source" in action) {
+                const { item, key } = action;
+                const block = mount(source, index, anchorNode, item, key);
+                moveLink(block, nextBlock.prev, nextBlock);
+              } else if (action.block.next !== nextBlock) {
+                insert(action.block, parent, anchorNode);
+                moveLink(action.block, nextBlock.prev, nextBlock);
+              }
+            } else if ("source" in action) {
+              const { item, key } = action;
+              const block = mount(source, index, parentAnchor, item, key);
+              moveLink(block, blocksTail);
+              blocksTail = block;
+            } else if (action.block.next !== void 0) {
+              let anchorNode = anchor ? normalizeAnchor(anchor.nodes) : parentAnchor;
+              if (!anchorNode.parentNode) anchorNode = parentAnchor;
+              insert(action.block, parent, anchorNode);
+              moveLink(action.block, blocksTail);
+              blocksTail = action.block;
+            }
+          }
+          for (const block of newBlocks) {
+            block.prevAnchor = block.next = block.prev = void 0;
           }
         }
       }
     }
-    frag.nodes = [oldBlocks = newBlocks];
-    if (parentAnchor) {
-      frag.nodes.push(parentAnchor);
+    if (!isFallback) {
+      frag.nodes = [oldBlocks = newBlocks];
+      if (parentAnchor) frag.nodes.push(parentAnchor);
+    } else {
+      oldBlocks = [];
     }
     setActiveSub(prevSub);
   };
@@ -1862,6 +3770,9 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
       indexRef,
       key2
     );
+    if (frag.$transition) {
+      applyTransitionHooks(block.nodes, frag.$transition, false);
+    }
     if (parent) insert(block.nodes, parent, anchor);
     return block;
   };
@@ -1889,21 +3800,25 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
       }
     }
   };
+  if (setup) {
+    setup({ createSelector });
+  }
   if (flags & 4) {
     renderList();
   } else {
     renderEffect(renderList);
   }
-  if (!isHydrating && _insertionParent) {
-    insert(frag, _insertionParent, _insertionAnchor);
+  if (!isHydrating) {
+    if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
+  } else {
+    advanceHydrationNode(_isLastInsertion ? _insertionParent : parentAnchor);
   }
-  frag.useSelector = useSelector;
   return frag;
-  function useSelector(source) {
+  function createSelector(source) {
     let operMap = /* @__PURE__ */ new Map();
     let activeKey = source();
     let activeOpers;
-    watch(source, (newValue) => {
+    watch$1(source, (newValue) => {
       if (activeOpers !== void 0) {
         for (const oper of activeOpers) {
           oper();
@@ -1943,6 +3858,21 @@ const createFor = (src, renderItem, getKey, flags = 0) => {
     }
   }
 };
+function moveLink(block, newPrev, newNext) {
+  const { prev: oldPrev, next: oldNext } = block;
+  if (oldPrev) oldPrev.next = oldNext;
+  if (oldNext) {
+    oldNext.prev = oldPrev;
+    if (block.prevAnchor !== block) {
+      oldNext.prevAnchor = block.prevAnchor;
+    }
+  }
+  if (newPrev) newPrev.next = block;
+  if (newNext) newNext.prev = block;
+  block.prev = newPrev;
+  block.next = newNext;
+  block.prevAnchor = block;
+}
 function createForSlots(rawSource, getSlot) {
   const source = normalizeSource(rawSource);
   const sourceLength = source.values.length;
@@ -2018,16 +3948,34 @@ function getRestElement(val, keys) {
 function getDefaultValue(val, defaultVal) {
   return val === void 0 ? defaultVal : val;
 }
+function isForBlock(block) {
+  return block instanceof ForBlock;
+}
 
 function createTemplateRefSetter() {
   const instance = currentInstance;
   return (...args) => setRef(instance, ...args);
 }
-function setRef(instance, el, ref, oldRef, refFor = false) {
+function setRef(instance, el, ref, oldRef, refFor = false, refKey) {
   if (!instance || instance.isUnmounted) return;
+  if (isFragment(el) && el.setRef) {
+    el.setRef(instance, ref, refFor, refKey);
+    return;
+  }
+  const isVaporComp = isVaporComponent(el);
+  if (isVaporComp && isAsyncWrapper(el)) {
+    const i = el;
+    const frag = i.block;
+    if (!i.type.__asyncResolved) {
+      frag.setRef = (i2) => setRef(instance, i2, ref, oldRef, refFor);
+      return;
+    }
+    el = frag.nodes;
+  }
   const setupState = !!(process.env.NODE_ENV !== "production") ? instance.setupState || {} : null;
   const refValue = getRefValue(el);
   const refs = instance.refs === EMPTY_OBJ ? instance.refs = {} : instance.refs;
+  const canSetSetupRef = createCanSetSetupRefChecker(setupState);
   if (oldRef != null && oldRef !== ref) {
     if (isString(oldRef)) {
       refs[oldRef] = null;
@@ -2046,7 +3994,7 @@ function setRef(instance, el, ref, oldRef, refFor = false) {
       ]);
     };
     invokeRefSetter(refValue);
-    onScopeDispose(() => invokeRefSetter());
+    onScopeDispose$1(() => invokeRefSetter());
   } else {
     const _isString = isString(ref);
     const _isRef = isRef$1(ref);
@@ -2054,44 +4002,47 @@ function setRef(instance, el, ref, oldRef, refFor = false) {
     if (_isString || _isRef) {
       const doSet = () => {
         if (refFor) {
-          existing = _isString ? !!(process.env.NODE_ENV !== "production") && hasOwn(setupState, ref) ? setupState[ref] : refs[ref] : ref.value;
+          existing = _isString ? !!(process.env.NODE_ENV !== "production") && canSetSetupRef(ref) ? setupState[ref] : refs[ref] : ref.value;
           if (!isArray(existing)) {
             existing = [refValue];
             if (_isString) {
               refs[ref] = existing;
-              if (!!(process.env.NODE_ENV !== "production") && hasOwn(setupState, ref)) {
+              if (!!(process.env.NODE_ENV !== "production") && canSetSetupRef(ref)) {
                 setupState[ref] = refs[ref];
                 existing = setupState[ref];
               }
             } else {
               ref.value = existing;
+              if (refKey) refs[refKey] = existing;
             }
           } else if (!existing.includes(refValue)) {
             existing.push(refValue);
           }
         } else if (_isString) {
           refs[ref] = refValue;
-          if (!!(process.env.NODE_ENV !== "production") && hasOwn(setupState, ref)) {
+          if (!!(process.env.NODE_ENV !== "production") && canSetSetupRef(ref)) {
             setupState[ref] = refValue;
           }
         } else if (_isRef) {
           ref.value = refValue;
+          if (refKey) refs[refKey] = refValue;
         } else if (!!(process.env.NODE_ENV !== "production")) {
           warn("Invalid template ref type:", ref, `(${typeof ref})`);
         }
       };
       queuePostFlushCb(doSet, -1);
-      onScopeDispose(() => {
+      onScopeDispose$1(() => {
         queuePostFlushCb(() => {
           if (isArray(existing)) {
             remove$1(existing, refValue);
           } else if (_isString) {
             refs[ref] = null;
-            if (!!(process.env.NODE_ENV !== "production") && hasOwn(setupState, ref)) {
+            if (!!(process.env.NODE_ENV !== "production") && canSetSetupRef(ref)) {
               setupState[ref] = null;
             }
           } else if (_isRef) {
             ref.value = null;
+            if (refKey) refs[refKey] = null;
           }
         });
       });
@@ -2110,29 +4061,35 @@ const getRefValue = (el) => {
   return el;
 };
 
-function createDynamicComponent(getter, rawProps, rawSlots, isSingleRoot) {
+function createDynamicComponent(getter, rawProps, rawSlots, isSingleRoot, once) {
   const _insertionParent = insertionParent;
   const _insertionAnchor = insertionAnchor;
-  if (isHydrating) {
-    locateHydrationNode();
-  } else {
-    resetInsertionState();
-  }
-  const frag = !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("dynamic-component") : new DynamicFragment();
-  renderEffect(() => {
+  const _isLastInsertion = isLastInsertion;
+  if (!isHydrating) resetInsertionState();
+  const frag = isHydrating || !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("dynamic-component") : new DynamicFragment();
+  const renderFn = () => {
     const value = getter();
+    const appContext = currentInstance && currentInstance.appContext || emptyContext;
     frag.update(
       () => createComponentWithFallback(
         resolveDynamicComponent(value),
         rawProps,
         rawSlots,
-        isSingleRoot
+        isSingleRoot,
+        once,
+        appContext
       ),
       value
     );
-  });
-  if (!isHydrating && _insertionParent) {
-    insert(frag, _insertionParent, _insertionAnchor);
+  };
+  if (once) renderFn();
+  else renderEffect(renderFn);
+  if (!isHydrating) {
+    if (_insertionParent) insert(frag, _insertionParent, _insertionAnchor);
+  } else {
+    if (_isLastInsertion) {
+      advanceHydrationNode(_insertionParent);
+    }
   }
   return frag;
 }
@@ -2150,6 +4107,12 @@ function applyVShow(target, source) {
       update.call(target, render, key);
       setDisplay(target, source());
     };
+  } else if (target instanceof VaporFragment && target.insert) {
+    const insert = target.insert;
+    target.insert = (parent, anchor) => {
+      insert.call(target, parent, anchor);
+      setDisplay(target, source());
+    };
   }
   renderEffect(() => setDisplay(target, source()));
 }
@@ -2157,18 +4120,54 @@ function setDisplay(target, value) {
   if (isVaporComponent(target)) {
     return setDisplay(target, value);
   }
-  if (isArray(target) && target.length === 1) {
-    return setDisplay(target[0], value);
+  if (isArray(target)) {
+    if (target.length === 0) return;
+    if (target.length === 1) return setDisplay(target[0], value);
   }
   if (target instanceof DynamicFragment) {
     return setDisplay(target.nodes, value);
   }
+  if (target instanceof VaporFragment && target.insert) {
+    return setDisplay(target.nodes, value);
+  }
+  const { $transition } = target;
   if (target instanceof Element) {
     const el = target;
     if (!(vShowOriginalDisplay in el)) {
       el[vShowOriginalDisplay] = el.style.display === "none" ? "" : el.style.display;
     }
-    el.style.display = value ? el[vShowOriginalDisplay] : "none";
+    if ($transition) {
+      if (value) {
+        $transition.beforeEnter(target);
+        el.style.display = el[vShowOriginalDisplay];
+        $transition.enter(target);
+      } else {
+        if (target.isConnected) {
+          $transition.leave(target, () => {
+            el.style.display = "none";
+          });
+        } else {
+          el.style.display = "none";
+        }
+      }
+    } else {
+      if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && isHydrating) {
+        if (!value && el.style.display !== "none") {
+          warnPropMismatch(
+            el,
+            "style",
+            3,
+            `display: ${el.style.display}`,
+            "display: none"
+          );
+          logMismatchError();
+          el.style.display = "none";
+          el[vShowOriginalDisplay] = "";
+        }
+      } else {
+        el.style.display = value ? el[vShowOriginalDisplay] : "none";
+      }
+    }
     el[vShowHidden] = !value;
   } else if (!!(process.env.NODE_ENV !== "production")) {
     warn(
@@ -2242,9 +4241,158 @@ function withVaporDirectives(node, dirs) {
   for (const [dir, value, argument, modifiers] of dirs) {
     if (dir) {
       const ret = dir(node, value, argument, modifiers);
-      if (ret) onScopeDispose$1(ret);
+      if (ret) onScopeDispose(ret);
+    }
+  }
+}
+
+const positionMap = /* @__PURE__ */ new WeakMap();
+const newPositionMap = /* @__PURE__ */ new WeakMap();
+const decorate = (t) => {
+  delete t.props.mode;
+  t.__vapor = true;
+  return t;
+};
+const VaporTransitionGroup = decorate({
+  name: "VaporTransitionGroup",
+  props: /* @__PURE__ */ extend({}, TransitionPropsValidators, {
+    tag: String,
+    moveClass: String
+  }),
+  setup(props, { slots }) {
+    const instance = currentInstance;
+    const state = useTransitionState();
+    const cssTransitionProps = resolveTransitionProps(props);
+    let prevChildren;
+    let children;
+    const slottedBlock = slots.default && slots.default();
+    onBeforeUpdate(() => {
+      prevChildren = [];
+      children = getTransitionBlocks(slottedBlock);
+      if (children) {
+        for (let i = 0; i < children.length; i++) {
+          const child = children[i];
+          if (isValidTransitionBlock(child)) {
+            prevChildren.push(child);
+            child.$transition.disabled = true;
+            positionMap.set(
+              child,
+              getTransitionElement(child).getBoundingClientRect()
+            );
+          }
+        }
+      }
+    });
+    onUpdated(() => {
+      if (!prevChildren.length) {
+        return;
+      }
+      const moveClass = props.moveClass || `${props.name || "v"}-move`;
+      const firstChild = getFirstConnectedChild(prevChildren);
+      if (!firstChild || !hasCSSTransform(
+        firstChild,
+        firstChild.parentNode,
+        moveClass
+      )) {
+        prevChildren = [];
+        return;
+      }
+      prevChildren.forEach(callPendingCbs);
+      prevChildren.forEach((child) => {
+        child.$transition.disabled = false;
+        recordPosition(child);
+      });
+      const movedChildren = prevChildren.filter(applyTranslation);
+      forceReflow();
+      movedChildren.forEach(
+        (c) => handleMovedChildren(
+          getTransitionElement(c),
+          moveClass
+        )
+      );
+      prevChildren = [];
+    });
+    setTransitionHooksOnFragment(slottedBlock, {
+      props: cssTransitionProps,
+      state,
+      instance
+    });
+    children = getTransitionBlocks(slottedBlock);
+    for (let i = 0; i < children.length; i++) {
+      const child = children[i];
+      if (isValidTransitionBlock(child)) {
+        if (child.$key != null) {
+          setTransitionHooks(
+            child,
+            resolveTransitionHooks(child, cssTransitionProps, state, instance)
+          );
+        } else if (!!(process.env.NODE_ENV !== "production") && child.$key == null) {
+          warn(`<transition-group> children must be keyed`);
+        }
+      }
+    }
+    const tag = props.tag;
+    if (tag) {
+      const container = createElement(tag);
+      insert(slottedBlock, container);
+      if (instance.hasFallthrough) {
+        container.$root = true;
+        renderEffect(() => applyFallthroughProps(container, instance.attrs));
+      }
+      return container;
+    } else {
+      const frag = !!(process.env.NODE_ENV !== "production") ? new DynamicFragment("transition-group") : new DynamicFragment();
+      renderEffect(() => frag.update(() => slottedBlock));
+      return frag;
     }
   }
+});
+function getTransitionBlocks(block) {
+  let children = [];
+  if (block instanceof Node) {
+    children.push(block);
+  } else if (isVaporComponent(block)) {
+    children.push(...getTransitionBlocks(block.block));
+  } else if (isArray(block)) {
+    for (let i = 0; i < block.length; i++) {
+      const b = block[i];
+      const blocks = getTransitionBlocks(b);
+      if (isForBlock(b)) blocks.forEach((block2) => block2.$key = b.key);
+      children.push(...blocks);
+    }
+  } else if (isFragment(block)) {
+    if (block.insert) {
+      children.push(block);
+    } else {
+      children.push(...getTransitionBlocks(block.nodes));
+    }
+  }
+  return children;
+}
+function isValidTransitionBlock(block) {
+  return !!(block instanceof Element || isFragment(block) && block.insert);
+}
+function getTransitionElement(c) {
+  return isFragment(c) ? c.nodes : c;
+}
+function recordPosition(c) {
+  newPositionMap.set(c, getTransitionElement(c).getBoundingClientRect());
+}
+function applyTranslation(c) {
+  if (baseApplyTranslation(
+    positionMap.get(c),
+    newPositionMap.get(c),
+    getTransitionElement(c)
+  )) {
+    return c;
+  }
+}
+function getFirstConnectedChild(children) {
+  for (let i = 0; i < children.length; i++) {
+    const child = children[i];
+    const el = getTransitionElement(child);
+    if (el.isConnected) return el;
+  }
 }
 
-export { VaporFragment, applyCheckboxModel, applyDynamicModel, applyRadioModel, applySelectModel, applyTextModel, applyVShow, child, createComponent, createComponentWithFallback, createDynamicComponent, createFor, createForSlots, createIf, createSlot, createTemplateRefSetter, createTextNode, createVaporApp, createVaporSSRApp, defineVaporComponent, delegate, delegateEvents, getDefaultValue, getRestElement, insert, isFragment, isVaporComponent, next, nthChild, on, prepend, remove, renderEffect, setAttr, setClass, setDOMProp, setDynamicEvents, setDynamicProps, setHtml, setInsertionState, setProp, setStyle, setText, setValue, template, vaporInteropPlugin, withVaporDirectives };
+export { VaporFragment, VaporKeepAliveImpl as VaporKeepAlive, VaporTeleportImpl as VaporTeleport, VaporTransition, VaporTransitionGroup, applyCheckboxModel, applyDynamicModel, applyRadioModel, applySelectModel, applyTextModel, applyVShow, child, createComponent, createComponentWithFallback, createDynamicComponent, createFor, createForSlots, createIf, createKeyedFragment, createSlot, createTemplateRefSetter, createTextNode, createVaporApp, createVaporSSRApp, defineVaporAsyncComponent, defineVaporComponent, delegate, delegateEvents, getDefaultValue, getRestElement, insert, isFragment, isVaporComponent, next, nthChild, on, prepend, remove, renderEffect, setAttr, setBlockHtml, setBlockText, setClass, setDOMProp, setDynamicEvents, setDynamicProps, setElementText, setHtml, setInsertionState, setProp, setStyle, setText, setValue, template, txt, vaporInteropPlugin, withVaporCtx, withVaporDirectives };