@vue/compat 3.4.0-alpha.3 → 3.4.0-beta.1

package/dist/vue.cjs.js

@@ -15,8 +15,8 @@ const EMPTY_ARR = Object.freeze([]) ;
 const NOOP = () => {
 };
 const NO = () => false;
-const onRE = /^on[^a-z]/;
-const isOn = (key) => onRE.test(key);
+const isOn = (key) => key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && // uppercase letter
+(key.charCodeAt(2) > 122 || key.charCodeAt(2) < 97);
 const isModelListener = (key) => key.startsWith("onUpdate:");
 const extend = Object.assign;
 const remove = (arr, el) => {
@@ -128,7 +128,7 @@ const slotFlagsText = {
   [3]: "FORWARDED"
 };
 
-const GLOBALS_ALLOWED = "Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,Object,Boolean,String,RegExp,Map,Set,JSON,Intl,BigInt,console";
+const GLOBALS_ALLOWED = "Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,Object,Boolean,String,RegExp,Map,Set,JSON,Intl,BigInt,console,Error";
 const isGloballyAllowed = /* @__PURE__ */ makeMap(GLOBALS_ALLOWED);
 
 const range = 2;
@@ -250,9 +250,11 @@ function normalizeProps(props) {
 
 const HTML_TAGS = "html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot";
 const SVG_TAGS = "svg,animate,animateMotion,animateTransform,circle,clipPath,color-profile,defs,desc,discard,ellipse,feBlend,feColorMatrix,feComponentTransfer,feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,feDistantLight,feDropShadow,feFlood,feFuncA,feFuncB,feFuncG,feFuncR,feGaussianBlur,feImage,feMerge,feMergeNode,feMorphology,feOffset,fePointLight,feSpecularLighting,feSpotLight,feTile,feTurbulence,filter,foreignObject,g,hatch,hatchpath,image,line,linearGradient,marker,mask,mesh,meshgradient,meshpatch,meshrow,metadata,mpath,path,pattern,polygon,polyline,radialGradient,rect,set,solidcolor,stop,switch,symbol,text,textPath,title,tspan,unknown,use,view";
+const MATH_TAGS = "math,maction,annotation,annotation-xml,menclose,merror,mfenced,mfrac,mi,mmultiscripts,mn,mo,mover,mpadded,mphantom,mprescripts,mroot,mrow,ms,semantics,mspace,msqrt,mstyle,msub,msup,msubsup,mtable,mtd,mtext,mtr,munder,munderover";
 const VOID_TAGS = "area,base,br,col,embed,hr,img,input,link,meta,param,source,track,wbr";
 const isHTMLTag = /* @__PURE__ */ makeMap(HTML_TAGS);
 const isSVGTag = /* @__PURE__ */ makeMap(SVG_TAGS);
+const isMathMLTag = /* @__PURE__ */ makeMap(MATH_TAGS);
 const isVoidTag = /* @__PURE__ */ makeMap(VOID_TAGS);
 
 const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
@@ -267,7 +269,7 @@ const isKnownHtmlAttr = /* @__PURE__ */ makeMap(
   `accept,accept-charset,accesskey,action,align,allow,alt,async,autocapitalize,autocomplete,autofocus,autoplay,background,bgcolor,border,buffered,capture,challenge,charset,checked,cite,class,code,codebase,color,cols,colspan,content,contenteditable,contextmenu,controls,coords,crossorigin,csp,data,datetime,decoding,default,defer,dir,dirname,disabled,download,draggable,dropzone,enctype,enterkeyhint,for,form,formaction,formenctype,formmethod,formnovalidate,formtarget,headers,height,hidden,high,href,hreflang,http-equiv,icon,id,importance,inert,integrity,ismap,itemprop,keytype,kind,label,lang,language,loading,list,loop,low,manifest,max,maxlength,minlength,media,min,multiple,muted,name,novalidate,open,optimum,pattern,ping,placeholder,poster,preload,radiogroup,readonly,referrerpolicy,rel,required,reversed,rows,rowspan,sandbox,scope,scoped,selected,shape,size,sizes,slot,span,spellcheck,src,srcdoc,srclang,srcset,start,step,style,summary,tabindex,target,title,translate,type,usemap,value,width,wrap`
 );
 const isKnownSvgAttr = /* @__PURE__ */ makeMap(
-  `xmlns,accent-height,accumulate,additive,alignment-baseline,alphabetic,amplitude,arabic-form,ascent,attributeName,attributeType,azimuth,baseFrequency,baseline-shift,baseProfile,bbox,begin,bias,by,calcMode,cap-height,class,clip,clipPathUnits,clip-path,clip-rule,color,color-interpolation,color-interpolation-filters,color-profile,color-rendering,contentScriptType,contentStyleType,crossorigin,cursor,cx,cy,d,decelerate,descent,diffuseConstant,direction,display,divisor,dominant-baseline,dur,dx,dy,edgeMode,elevation,enable-background,end,exponent,fill,fill-opacity,fill-rule,filter,filterRes,filterUnits,flood-color,flood-opacity,font-family,font-size,font-size-adjust,font-stretch,font-style,font-variant,font-weight,format,from,fr,fx,fy,g1,g2,glyph-name,glyph-orientation-horizontal,glyph-orientation-vertical,glyphRef,gradientTransform,gradientUnits,hanging,height,href,hreflang,horiz-adv-x,horiz-origin-x,id,ideographic,image-rendering,in,in2,intercept,k,k1,k2,k3,k4,kernelMatrix,kernelUnitLength,kerning,keyPoints,keySplines,keyTimes,lang,lengthAdjust,letter-spacing,lighting-color,limitingConeAngle,local,marker-end,marker-mid,marker-start,markerHeight,markerUnits,markerWidth,mask,maskContentUnits,maskUnits,mathematical,max,media,method,min,mode,name,numOctaves,offset,opacity,operator,order,orient,orientation,origin,overflow,overline-position,overline-thickness,panose-1,paint-order,path,pathLength,patternContentUnits,patternTransform,patternUnits,ping,pointer-events,points,pointsAtX,pointsAtY,pointsAtZ,preserveAlpha,preserveAspectRatio,primitiveUnits,r,radius,referrerPolicy,refX,refY,rel,rendering-intent,repeatCount,repeatDur,requiredExtensions,requiredFeatures,restart,result,rotate,rx,ry,scale,seed,shape-rendering,slope,spacing,specularConstant,specularExponent,speed,spreadMethod,startOffset,stdDeviation,stemh,stemv,stitchTiles,stop-color,stop-opacity,strikethrough-position,strikethrough-thickness,string,stroke,stroke-dasharray,stroke-dashoffset,stroke-linecap,stroke-linejoin,stroke-miterlimit,stroke-opacity,stroke-width,style,surfaceScale,systemLanguage,tabindex,tableValues,target,targetX,targetY,text-anchor,text-decoration,text-rendering,textLength,to,transform,transform-origin,type,u1,u2,underline-position,underline-thickness,unicode,unicode-bidi,unicode-range,units-per-em,v-alphabetic,v-hanging,v-ideographic,v-mathematical,values,vector-effect,version,vert-adv-y,vert-origin-x,vert-origin-y,viewBox,viewTarget,visibility,width,widths,word-spacing,writing-mode,x,x-height,x1,x2,xChannelSelector,xlink:actuate,xlink:arcrole,xlink:href,xlink:role,xlink:show,xlink:title,xlink:type,xml:base,xml:lang,xml:space,y,y1,y2,yChannelSelector,z,zoomAndPan`
+  `xmlns,accent-height,accumulate,additive,alignment-baseline,alphabetic,amplitude,arabic-form,ascent,attributeName,attributeType,azimuth,baseFrequency,baseline-shift,baseProfile,bbox,begin,bias,by,calcMode,cap-height,class,clip,clipPathUnits,clip-path,clip-rule,color,color-interpolation,color-interpolation-filters,color-profile,color-rendering,contentScriptType,contentStyleType,crossorigin,cursor,cx,cy,d,decelerate,descent,diffuseConstant,direction,display,divisor,dominant-baseline,dur,dx,dy,edgeMode,elevation,enable-background,end,exponent,fill,fill-opacity,fill-rule,filter,filterRes,filterUnits,flood-color,flood-opacity,font-family,font-size,font-size-adjust,font-stretch,font-style,font-variant,font-weight,format,from,fr,fx,fy,g1,g2,glyph-name,glyph-orientation-horizontal,glyph-orientation-vertical,glyphRef,gradientTransform,gradientUnits,hanging,height,href,hreflang,horiz-adv-x,horiz-origin-x,id,ideographic,image-rendering,in,in2,intercept,k,k1,k2,k3,k4,kernelMatrix,kernelUnitLength,kerning,keyPoints,keySplines,keyTimes,lang,lengthAdjust,letter-spacing,lighting-color,limitingConeAngle,local,marker-end,marker-mid,marker-start,markerHeight,markerUnits,markerWidth,mask,maskContentUnits,maskUnits,mathematical,max,media,method,min,mode,name,numOctaves,offset,opacity,operator,order,orient,orientation,origin,overflow,overline-position,overline-thickness,panose-1,paint-order,path,pathLength,patternContentUnits,patternTransform,patternUnits,ping,pointer-events,points,pointsAtX,pointsAtY,pointsAtZ,preserveAlpha,preserveAspectRatio,primitiveUnits,r,radius,referrerPolicy,refX,refY,rel,rendering-intent,repeatCount,repeatDur,requiredExtensions,requiredFeatures,restart,result,rotate,rx,ry,scale,seed,shape-rendering,slope,spacing,specularConstant,specularExponent,speed,spreadMethod,startOffset,stdDeviation,stemh,stemv,stitchTiles,stop-color,stop-opacity,strikethrough-position,strikethrough-thickness,string,stroke,stroke-dasharray,stroke-dashoffset,stroke-linecap,stroke-linejoin,stroke-miterlimit,stroke-opacity,stroke-width,style,surfaceScale,systemLanguage,tabindex,tableValues,target,targetX,targetY,text-anchor,text-decoration,text-rendering,textLength,to,transform,transform-origin,type,u1,u2,underline-position,underline-thickness,unicode,unicode-bidi,unicode-range,units-per-em,v-alphabetic,v-hanging,v-ideographic,v-mathematical,values,vector-effect,version,vert-adv-y,vert-origin-x,vert-origin-y,viewBox,viewTarget,visibility,width,widths,word-spacing,writing-mode,x,x-height,x1,x2,xChannelSelector,xlink:actuate,xlink:arcrole,xlink:href,xlink:role,xlink:show,xlink:title,xlink:type,xmlns:xlink,xml:base,xml:lang,xml:space,y,y1,y2,yChannelSelector,z,zoomAndPan`
 );
 
 const escapeRE = /["'&<>]/;
@@ -370,20 +372,29 @@ const replacer = (_key, val) => {
     return replacer(_key, val.value);
   } else if (isMap(val)) {
     return {
-      [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val2]) => {
-        entries[`${key} =>`] = val2;
-        return entries;
-      }, {})
+      [`Map(${val.size})`]: [...val.entries()].reduce(
+        (entries, [key, val2], i) => {
+          entries[stringifySymbol(key, i) + " =>"] = val2;
+          return entries;
+        },
+        {}
+      )
     };
   } else if (isSet(val)) {
     return {
-      [`Set(${val.size})`]: [...val.values()]
+      [`Set(${val.size})`]: [...val.values()].map((v) => stringifySymbol(v))
     };
+  } else if (isSymbol(val)) {
+    return stringifySymbol(val);
   } else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
     return String(val);
   }
   return val;
 };
+const stringifySymbol = (v, i = "") => {
+  var _a;
+  return isSymbol(v) ? `Symbol(${(_a = v.description) != null ? _a : i})` : v;
+};
 
 function warn$1(msg, ...args) {
   console.warn(`[Vue warn] ${msg}`, ...args);
@@ -832,8 +843,13 @@ class BaseReactiveHandler {
       return isReadonly2;
     } else if (key === "__v_isShallow") {
       return shallow;
-    } else if (key === "__v_raw" && receiver === (isReadonly2 ? shallow ? shallowReadonlyMap : readonlyMap : shallow ? shallowReactiveMap : reactiveMap).get(target)) {
-      return target;
+    } else if (key === "__v_raw") {
+      if (receiver === (isReadonly2 ? shallow ? shallowReadonlyMap : readonlyMap : shallow ? shallowReactiveMap : reactiveMap).get(target) || // receiver is not the reactive proxy, but has the same prototype
+      // this means the reciever is a user proxy of the reactive proxy
+      Object.getPrototypeOf(target) === Object.getPrototypeOf(receiver)) {
+        return target;
+      }
+      return;
     }
     const targetIsArray = isArray(target);
     if (!isReadonly2) {
@@ -869,17 +885,19 @@ class MutableReactiveHandler extends BaseReactiveHandler {
   }
   set(target, key, value, receiver) {
     let oldValue = target[key];
-    if (isReadonly(oldValue) && isRef(oldValue) && !isRef(value)) {
-      return false;
-    }
     if (!this._shallow) {
+      const isOldValueReadonly = isReadonly(oldValue);
       if (!isShallow(value) && !isReadonly(value)) {
         oldValue = toRaw(oldValue);
         value = toRaw(value);
       }
       if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
-        oldValue.value = value;
-        return true;
+        if (isOldValueReadonly) {
+          return false;
+        } else {
+          oldValue.value = value;
+          return true;
+        }
       }
     }
     const hadKey = isArray(target) && isIntegerKey(key) ? Number(key) < target.length : hasOwn(target, key);
@@ -1572,6 +1590,18 @@ function propertyToRef(source, key, defaultValue) {
   return isRef(val) ? val : new ObjectRefImpl(source, key, defaultValue);
 }
 
+const TrackOpTypes = {
+  "GET": "get",
+  "HAS": "has",
+  "ITERATE": "iterate"
+};
+const TriggerOpTypes = {
+  "SET": "set",
+  "ADD": "add",
+  "DELETE": "delete",
+  "CLEAR": "clear"
+};
+
 const stack$1 = [];
 function pushWarningContext(vnode) {
   stack$1.push(vnode);
@@ -1686,6 +1716,38 @@ function assertNumber(val, type) {
   }
 }
 
+const ErrorCodes = {
+  "SETUP_FUNCTION": 0,
+  "0": "SETUP_FUNCTION",
+  "RENDER_FUNCTION": 1,
+  "1": "RENDER_FUNCTION",
+  "WATCH_GETTER": 2,
+  "2": "WATCH_GETTER",
+  "WATCH_CALLBACK": 3,
+  "3": "WATCH_CALLBACK",
+  "WATCH_CLEANUP": 4,
+  "4": "WATCH_CLEANUP",
+  "NATIVE_EVENT_HANDLER": 5,
+  "5": "NATIVE_EVENT_HANDLER",
+  "COMPONENT_EVENT_HANDLER": 6,
+  "6": "COMPONENT_EVENT_HANDLER",
+  "VNODE_HOOK": 7,
+  "7": "VNODE_HOOK",
+  "DIRECTIVE_HOOK": 8,
+  "8": "DIRECTIVE_HOOK",
+  "TRANSITION_HOOK": 9,
+  "9": "TRANSITION_HOOK",
+  "APP_ERROR_HANDLER": 10,
+  "10": "APP_ERROR_HANDLER",
+  "APP_WARN_HANDLER": 11,
+  "11": "APP_WARN_HANDLER",
+  "FUNCTION_REF": 12,
+  "12": "FUNCTION_REF",
+  "ASYNC_COMPONENT_LOADER": 13,
+  "13": "ASYNC_COMPONENT_LOADER",
+  "SCHEDULER": 14,
+  "14": "SCHEDULER"
+};
 const ErrorTypeStrings$1 = {
   ["sp"]: "serverPrefetch hook",
   ["bc"]: "beforeCreate hook",
@@ -1857,13 +1919,16 @@ function queuePostFlushCb(cb) {
   }
   queueFlush();
 }
-function flushPreFlushCbs(seen, i = isFlushing ? flushIndex + 1 : 0) {
+function flushPreFlushCbs(instance, seen, i = isFlushing ? flushIndex + 1 : 0) {
   {
     seen = seen || /* @__PURE__ */ new Map();
   }
   for (; i < queue.length; i++) {
     const cb = queue[i];
     if (cb && cb.pre) {
+      if (instance && cb.id !== instance.uid) {
+        continue;
+      }
       if (checkRecursiveUpdates(seen, cb)) {
         continue;
       }
@@ -2168,6 +2233,50 @@ function devtoolsComponentEmit(component, event, params) {
   );
 }
 
+const DeprecationTypes$1 = {
+  "GLOBAL_MOUNT": "GLOBAL_MOUNT",
+  "GLOBAL_MOUNT_CONTAINER": "GLOBAL_MOUNT_CONTAINER",
+  "GLOBAL_EXTEND": "GLOBAL_EXTEND",
+  "GLOBAL_PROTOTYPE": "GLOBAL_PROTOTYPE",
+  "GLOBAL_SET": "GLOBAL_SET",
+  "GLOBAL_DELETE": "GLOBAL_DELETE",
+  "GLOBAL_OBSERVABLE": "GLOBAL_OBSERVABLE",
+  "GLOBAL_PRIVATE_UTIL": "GLOBAL_PRIVATE_UTIL",
+  "CONFIG_SILENT": "CONFIG_SILENT",
+  "CONFIG_DEVTOOLS": "CONFIG_DEVTOOLS",
+  "CONFIG_KEY_CODES": "CONFIG_KEY_CODES",
+  "CONFIG_PRODUCTION_TIP": "CONFIG_PRODUCTION_TIP",
+  "CONFIG_IGNORED_ELEMENTS": "CONFIG_IGNORED_ELEMENTS",
+  "CONFIG_WHITESPACE": "CONFIG_WHITESPACE",
+  "CONFIG_OPTION_MERGE_STRATS": "CONFIG_OPTION_MERGE_STRATS",
+  "INSTANCE_SET": "INSTANCE_SET",
+  "INSTANCE_DELETE": "INSTANCE_DELETE",
+  "INSTANCE_DESTROY": "INSTANCE_DESTROY",
+  "INSTANCE_EVENT_EMITTER": "INSTANCE_EVENT_EMITTER",
+  "INSTANCE_EVENT_HOOKS": "INSTANCE_EVENT_HOOKS",
+  "INSTANCE_CHILDREN": "INSTANCE_CHILDREN",
+  "INSTANCE_LISTENERS": "INSTANCE_LISTENERS",
+  "INSTANCE_SCOPED_SLOTS": "INSTANCE_SCOPED_SLOTS",
+  "INSTANCE_ATTRS_CLASS_STYLE": "INSTANCE_ATTRS_CLASS_STYLE",
+  "OPTIONS_DATA_FN": "OPTIONS_DATA_FN",
+  "OPTIONS_DATA_MERGE": "OPTIONS_DATA_MERGE",
+  "OPTIONS_BEFORE_DESTROY": "OPTIONS_BEFORE_DESTROY",
+  "OPTIONS_DESTROYED": "OPTIONS_DESTROYED",
+  "WATCH_ARRAY": "WATCH_ARRAY",
+  "PROPS_DEFAULT_THIS": "PROPS_DEFAULT_THIS",
+  "V_ON_KEYCODE_MODIFIER": "V_ON_KEYCODE_MODIFIER",
+  "CUSTOM_DIR": "CUSTOM_DIR",
+  "ATTR_FALSE_VALUE": "ATTR_FALSE_VALUE",
+  "ATTR_ENUMERATED_COERCION": "ATTR_ENUMERATED_COERCION",
+  "TRANSITION_CLASSES": "TRANSITION_CLASSES",
+  "TRANSITION_GROUP_ROOT": "TRANSITION_GROUP_ROOT",
+  "COMPONENT_ASYNC": "COMPONENT_ASYNC",
+  "COMPONENT_FUNCTIONAL": "COMPONENT_FUNCTIONAL",
+  "COMPONENT_V_MODEL": "COMPONENT_V_MODEL",
+  "RENDER_FUNCTION": "RENDER_FUNCTION",
+  "FILTERS": "FILTERS",
+  "PRIVATE_APIS": "PRIVATE_APIS"
+};
 const deprecationData$1 = {
   ["GLOBAL_MOUNT"]: {
     message: `The global app bootstrapping API has changed: vm.$mount() and the "el" option have been removed. Use createApp(RootComponent).mount() instead.`,
@@ -3096,9 +3205,17 @@ function hasPropsChanged(prevProps, nextProps, emitsOptions) {
   return false;
 }
 function updateHOCHostEl({ vnode, parent }, el) {
-  while (parent && parent.subTree === vnode) {
-    (vnode = parent.vnode).el = el;
-    parent = parent.parent;
+  while (parent) {
+    const root = parent.subTree;
+    if (root.suspense && root.suspense.activeBranch === vnode) {
+      root.el = vnode.el;
+    }
+    if (root === vnode) {
+      (vnode = parent.vnode).el = el;
+      parent = parent.parent;
+    } else {
+      break;
+    }
   }
 }
 
@@ -3162,6 +3279,7 @@ function resolve(registry, name) {
 }
 
 const isSuspense = (type) => type.__isSuspense;
+let suspenseId = 0;
 const SuspenseImpl = {
   name: "Suspense",
   // In order to make Suspense tree-shakable, we need to avoid importing it
@@ -3169,7 +3287,7 @@ const SuspenseImpl = {
   // on a vnode's type and calls the `process` method, passing in renderer
   // internals.
   __isSuspense: true,
-  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) {
+  process(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) {
     if (n1 == null) {
       mountSuspense(
         n2,
@@ -3177,7 +3295,7 @@ const SuspenseImpl = {
         anchor,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized,
         rendererInternals
@@ -3189,7 +3307,7 @@ const SuspenseImpl = {
         container,
         anchor,
         parentComponent,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized,
         rendererInternals
@@ -3207,7 +3325,7 @@ function triggerEvent(vnode, name) {
     eventListener();
   }
 }
-function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals) {
+function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) {
   const {
     p: patch,
     o: { createElement }
@@ -3220,7 +3338,7 @@ function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense
     container,
     hiddenContainer,
     anchor,
-    isSVG,
+    namespace,
     slotScopeIds,
     optimized,
     rendererInternals
@@ -3232,7 +3350,7 @@ function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense
     null,
     parentComponent,
     suspense,
-    isSVG,
+    namespace,
     slotScopeIds
   );
   if (suspense.deps > 0) {
@@ -3246,7 +3364,7 @@ function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense
       parentComponent,
       null,
       // fallback tree will not have suspense context
-      isSVG,
+      namespace,
       slotScopeIds
     );
     setActiveBranch(suspense, vnode.ssFallback);
@@ -3254,7 +3372,7 @@ function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense
     suspense.resolve(false, true);
   }
 }
-function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) {
+function patchSuspense(n1, n2, container, anchor, parentComponent, namespace, slotScopeIds, optimized, { p: patch, um: unmount, o: { createElement } }) {
   const suspense = n2.suspense = n1.suspense;
   suspense.vnode = n2;
   n2.el = n1.el;
@@ -3271,29 +3389,31 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
         null,
         parentComponent,
         suspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
       if (suspense.deps <= 0) {
         suspense.resolve();
       } else if (isInFallback) {
-        patch(
-          activeBranch,
-          newFallback,
-          container,
-          anchor,
-          parentComponent,
-          null,
-          // fallback tree will not have suspense context
-          isSVG,
-          slotScopeIds,
-          optimized
-        );
-        setActiveBranch(suspense, newFallback);
+        if (!isHydrating) {
+          patch(
+            activeBranch,
+            newFallback,
+            container,
+            anchor,
+            parentComponent,
+            null,
+            // fallback tree will not have suspense context
+            namespace,
+            slotScopeIds,
+            optimized
+          );
+          setActiveBranch(suspense, newFallback);
+        }
       }
     } else {
-      suspense.pendingId++;
+      suspense.pendingId = suspenseId++;
       if (isHydrating) {
         suspense.isHydrating = false;
         suspense.activeBranch = pendingBranch;
@@ -3311,7 +3431,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
           null,
           parentComponent,
           suspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -3326,7 +3446,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
             parentComponent,
             null,
             // fallback tree will not have suspense context
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -3340,7 +3460,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
           anchor,
           parentComponent,
           suspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -3353,7 +3473,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
           null,
           parentComponent,
           suspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -3371,7 +3491,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
         anchor,
         parentComponent,
         suspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
@@ -3379,7 +3499,11 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
     } else {
       triggerEvent(n2, "onPending");
       suspense.pendingBranch = newBranch;
-      suspense.pendingId++;
+      if (newBranch.shapeFlag & 512) {
+        suspense.pendingId = newBranch.component.suspenseId;
+      } else {
+        suspense.pendingId = suspenseId++;
+      }
       patch(
         null,
         newBranch,
@@ -3387,7 +3511,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
         null,
         parentComponent,
         suspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
@@ -3409,7 +3533,7 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, slotSc
   }
 }
 let hasWarned = false;
-function createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, slotScopeIds, optimized, rendererInternals, isHydrating = false) {
+function createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, namespace, slotScopeIds, optimized, rendererInternals, isHydrating = false) {
   if (!hasWarned) {
     hasWarned = true;
     console[console.info ? "info" : "log"](
@@ -3439,7 +3563,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
     vnode,
     parent: parentSuspense,
     parentComponent,
-    isSVG,
+    namespace,
     container,
     hiddenContainer,
     anchor,
@@ -3448,7 +3572,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
     timeout: typeof timeout === "number" ? timeout : -1,
     activeBranch: null,
     pendingBranch: null,
-    isInFallback: true,
+    isInFallback: !isHydrating,
     isHydrating,
     isUnmounted: false,
     effects: [],
@@ -3482,7 +3606,12 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
         if (delayEnter) {
           activeBranch.transition.afterLeave = () => {
             if (pendingId === suspense.pendingId) {
-              move(pendingBranch, container2, anchor2, 0);
+              move(
+                pendingBranch,
+                container2,
+                next(activeBranch),
+                0
+              );
               queuePostFlushCb(effects);
             }
           };
@@ -3527,7 +3656,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
       if (!suspense.pendingBranch) {
         return;
       }
-      const { vnode: vnode2, activeBranch, parentComponent: parentComponent2, container: container2, isSVG: isSVG2 } = suspense;
+      const { vnode: vnode2, activeBranch, parentComponent: parentComponent2, container: container2, namespace: namespace2 } = suspense;
       triggerEvent(vnode2, "onFallback");
       const anchor2 = next(activeBranch);
       const mountFallback = () => {
@@ -3542,7 +3671,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
           parentComponent2,
           null,
           // fallback tree will not have suspense context
-          isSVG2,
+          namespace2,
           slotScopeIds,
           optimized
         );
@@ -3605,7 +3734,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
           // consider the comment placeholder case.
           hydratedEl ? null : next(instance.subTree),
           suspense,
-          isSVG,
+          namespace,
           optimized
         );
         if (placeholder) {
@@ -3642,7 +3771,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
   };
   return suspense;
 }
-function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, rendererInternals, hydrateNode) {
+function hydrateSuspense(node, vnode, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals, hydrateNode) {
   const suspense = vnode.suspense = createSuspenseBoundary(
     vnode,
     parentSuspense,
@@ -3650,7 +3779,7 @@ function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, sl
     node.parentNode,
     document.createElement("div"),
     null,
-    isSVG,
+    namespace,
     slotScopeIds,
     optimized,
     rendererInternals,
@@ -4619,7 +4748,7 @@ const KeepAliveImpl = {
       }
     } = sharedContext;
     const storageContainer = createElement("div");
-    sharedContext.activate = (vnode, container, anchor, isSVG, optimized) => {
+    sharedContext.activate = (vnode, container, anchor, namespace, optimized) => {
       const instance2 = vnode.component;
       move(vnode, container, anchor, 0, parentSuspense);
       patch(
@@ -4629,7 +4758,7 @@ const KeepAliveImpl = {
         anchor,
         instance2,
         parentSuspense,
-        isSVG,
+        namespace,
         vnode.slotScopeIds,
         optimized
       );
@@ -5817,7 +5946,7 @@ function useSlots() {
 function useAttrs() {
   return getContext().attrs;
 }
-function useModel(props, name, options) {
+function useModel(props, name) {
   const i = getCurrentInstance();
   if (!i) {
     warn(`useModel() called without active instance.`);
@@ -5827,29 +5956,24 @@ function useModel(props, name, options) {
     warn(`useModel() called with prop "${name}" which is not declared.`);
     return ref();
   }
-  if (options && options.local) {
-    const proxy = ref(props[name]);
-    watch(
-      () => props[name],
-      (v) => proxy.value = v
-    );
-    watch(proxy, (value) => {
-      if (value !== props[name]) {
-        i.emit(`update:${name}`, value);
-      }
-    });
-    return proxy;
-  } else {
-    return {
-      __v_isRef: true,
-      get value() {
-        return props[name];
-      },
-      set value(value) {
-        i.emit(`update:${name}`, value);
+  let localValue;
+  watchSyncEffect(() => {
+    localValue = props[name];
+  });
+  return customRef((track, trigger) => ({
+    get() {
+      track();
+      return localValue;
+    },
+    set(value) {
+      const rawProps = i.vnode.props;
+      if (!(rawProps && name in rawProps) && hasChanged(value, localValue)) {
+        localValue = value;
+        trigger();
       }
-    };
-  }
+      i.emit(`update:${name}`, value);
+    }
+  }));
 }
 function getContext() {
   const i = getCurrentInstance();
@@ -6423,7 +6547,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
       return vm;
     }
   }
-  Vue.version = `2.6.14-compat:${"3.4.0-alpha.3"}`;
+  Vue.version = `2.6.14-compat:${"3.4.0-beta.1"}`;
   Vue.config = singletonApp.config;
   Vue.use = (p, ...options) => {
     if (p && isFunction(p.install)) {
@@ -6668,12 +6792,16 @@ function installCompatMount(app, context, render) {
       } else {
         container = selectorOrEl || document.createElement("div");
       }
-      const isSVG = container instanceof SVGElement;
+      let namespace;
+      if (container instanceof SVGElement)
+        namespace = "svg";
+      else if (typeof MathMLElement === "function" && container instanceof MathMLElement)
+        namespace = "mathml";
       {
         context.reload = () => {
           const cloned = cloneVNode(vnode);
           cloned.component = null;
-          render(cloned, container, isSVG);
+          render(cloned, container, namespace);
         };
       }
       if (hasNoRender && instance.render === emptyRender) {
@@ -6696,7 +6824,7 @@ function installCompatMount(app, context, render) {
         );
       }
       container.innerHTML = "";
-      render(vnode, container, isSVG);
+      render(vnode, container, namespace);
       if (container instanceof Element) {
         container.removeAttribute("v-cloak");
         container.setAttribute("data-v-app", "");
@@ -6824,18 +6952,6 @@ function createAppAPI(render, hydrate) {
       rootProps = null;
     }
     const context = createAppContext();
-    {
-      Object.defineProperty(context.config, "unwrapInjectedRef", {
-        get() {
-          return true;
-        },
-        set() {
-          warn(
-            `app.config.unwrapInjectedRef has been deprecated. 3.3 now always unwraps injected refs in Options API.`
-          );
-        }
-      });
-    }
     const installedPlugins = /* @__PURE__ */ new WeakSet();
     let isMounted = false;
     const app = context.app = {
@@ -6910,7 +7026,7 @@ function createAppAPI(render, hydrate) {
         context.directives[name] = directive;
         return app;
       },
-      mount(rootContainer, isHydrate, isSVG) {
+      mount(rootContainer, isHydrate, namespace) {
         if (!isMounted) {
           if (rootContainer.__vue_app__) {
             warn(
@@ -6920,15 +7036,24 @@ function createAppAPI(render, hydrate) {
           }
           const vnode = createVNode(rootComponent, rootProps);
           vnode.appContext = context;
+          if (namespace === true) {
+            namespace = "svg";
+          } else if (namespace === false) {
+            namespace = void 0;
+          }
           {
             context.reload = () => {
-              render(cloneVNode(vnode), rootContainer, isSVG);
+              render(
+                cloneVNode(vnode),
+                rootContainer,
+                namespace
+              );
             };
           }
           if (isHydrate && hydrate) {
             hydrate(vnode, rootContainer);
           } else {
-            render(vnode, rootContainer, isSVG);
+            render(vnode, rootContainer, namespace);
           }
           isMounted = true;
           app._container = rootContainer;
@@ -7393,11 +7518,12 @@ function validateProps(rawProps, props, instance) {
       key,
       resolvedValues[key],
       opt,
+      shallowReadonly(resolvedValues) ,
       !hasOwn(rawProps, key) && !hasOwn(rawProps, hyphenate(key))
     );
   }
 }
-function validateProp(name, value, prop, isAbsent) {
+function validateProp(name, value, prop, props, isAbsent) {
   const { type, required, validator, skipCheck } = prop;
   if (required && isAbsent) {
     warn('Missing required prop: "' + name + '"');
@@ -7420,7 +7546,7 @@ function validateProp(name, value, prop, isAbsent) {
       return;
     }
   }
-  if (validator && !validator(value)) {
+  if (validator && !validator(value, props)) {
     warn('Invalid prop: custom validator check failed for prop "' + name + '".');
   }
 }
@@ -7678,7 +7804,15 @@ function setRef(rawRef, oldRawRef, parentSuspense, vnode, isUnmount = false) {
 }
 
 let hasMismatch = false;
-const isSVGContainer = (container) => /svg/.test(container.namespaceURI) && container.tagName !== "foreignObject";
+const isSVGContainer = (container) => container.namespaceURI.includes("svg") && container.tagName !== "foreignObject";
+const isMathMLContainer = (container) => container.namespaceURI.includes("MathML");
+const getContainerType = (container) => {
+  if (isSVGContainer(container))
+    return "svg";
+  if (isMathMLContainer(container))
+    return "mathml";
+  return void 0;
+};
 const isComment = (node) => node.nodeType === 8 /* COMMENT */;
 function createHydrationFunctions(rendererInternals) {
   const {
@@ -7757,11 +7891,13 @@ function createHydrationFunctions(rendererInternals) {
           if (node.data !== vnode.children) {
             hasMismatch = true;
             warn(
-              `Hydration text mismatch:
-- Server rendered: ${JSON.stringify(
+              `Hydration text mismatch in`,
+              node.parentNode,
+              `
+  - rendered on server: ${JSON.stringify(
                 node.data
               )}
-- Client rendered: ${JSON.stringify(vnode.children)}`
+  - expected on client: ${JSON.stringify(vnode.children)}`
             );
             node.data = vnode.children;
           }
@@ -7847,7 +7983,7 @@ function createHydrationFunctions(rendererInternals) {
             null,
             parentComponent,
             parentSuspense,
-            isSVGContainer(container),
+            getContainerType(container),
             optimized
           );
           if (isAsyncWrapper(vnode)) {
@@ -7882,7 +8018,7 @@ function createHydrationFunctions(rendererInternals) {
             vnode,
             parentComponent,
             parentSuspense,
-            isSVGContainer(parentNode(node)),
+            getContainerType(parentNode(node)),
             slotScopeIds,
             optimized,
             rendererInternals,
@@ -7905,38 +8041,6 @@ function createHydrationFunctions(rendererInternals) {
       if (dirs) {
         invokeDirectiveHook(vnode, null, parentComponent, "created");
       }
-      if (props) {
-        if (forcePatch || !optimized || patchFlag & (16 | 32)) {
-          for (const key in props) {
-            if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
-            key[0] === ".") {
-              patchProp(
-                el,
-                key,
-                null,
-                props[key],
-                false,
-                void 0,
-                parentComponent
-              );
-            }
-          }
-        } else if (props.onClick) {
-          patchProp(
-            el,
-            "onClick",
-            null,
-            props.onClick,
-            false,
-            void 0,
-            parentComponent
-          );
-        }
-      }
-      let vnodeHooks;
-      if (vnodeHooks = props && props.onVnodeBeforeMount) {
-        invokeVNodeHook(vnodeHooks, parentComponent, vnode);
-      }
       let needCallTransitionHooks = false;
       if (isTemplateNode(el)) {
         needCallTransitionHooks = needTransition(parentSuspense, transition) && parentComponent && parentComponent.vnode.props && parentComponent.vnode.props.appear;
@@ -7947,16 +8051,6 @@ function createHydrationFunctions(rendererInternals) {
         replaceNode(content, el, parentComponent);
         vnode.el = el = content;
       }
-      if (dirs) {
-        invokeDirectiveHook(vnode, null, parentComponent, "beforeMount");
-      }
-      if ((vnodeHooks = props && props.onVnodeMounted) || dirs || needCallTransitionHooks) {
-        queueEffectWithSuspense(() => {
-          vnodeHooks && invokeVNodeHook(vnodeHooks, parentComponent, vnode);
-          needCallTransitionHooks && transition.enter(el);
-          dirs && invokeDirectiveHook(vnode, null, parentComponent, "mounted");
-        }, parentSuspense);
-      }
       if (shapeFlag & 16 && // skip if element has innerHTML / textContent
       !(props && (props.innerHTML || props.textContent))) {
         let next = hydrateChildren(
@@ -7973,7 +8067,10 @@ function createHydrationFunctions(rendererInternals) {
           hasMismatch = true;
           if (!hasWarned) {
             warn(
-              `Hydration children mismatch in <${vnode.type}>: server rendered element contains more child nodes than client vdom.`
+              `Hydration children mismatch on`,
+              el,
+              `
+Server rendered element contains more child nodes than client vdom.`
             );
             hasWarned = true;
           }
@@ -7985,13 +8082,50 @@ function createHydrationFunctions(rendererInternals) {
         if (el.textContent !== vnode.children) {
           hasMismatch = true;
           warn(
-            `Hydration text content mismatch in <${vnode.type}>:
-- Server rendered: ${el.textContent}
-- Client rendered: ${vnode.children}`
+            `Hydration text content mismatch on`,
+            el,
+            `
+  - rendered on server: ${el.textContent}
+  - expected on client: ${vnode.children}`
           );
           el.textContent = vnode.children;
         }
       }
+      if (props) {
+        {
+          for (const key in props) {
+            if (propHasMismatch(el, key, props[key])) {
+              hasMismatch = true;
+            }
+            if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
+            key[0] === ".") {
+              patchProp(
+                el,
+                key,
+                null,
+                props[key],
+                void 0,
+                void 0,
+                parentComponent
+              );
+            }
+          }
+        }
+      }
+      let vnodeHooks;
+      if (vnodeHooks = props && props.onVnodeBeforeMount) {
+        invokeVNodeHook(vnodeHooks, parentComponent, vnode);
+      }
+      if (dirs) {
+        invokeDirectiveHook(vnode, null, parentComponent, "beforeMount");
+      }
+      if ((vnodeHooks = props && props.onVnodeMounted) || dirs || needCallTransitionHooks) {
+        queueEffectWithSuspense(() => {
+          vnodeHooks && invokeVNodeHook(vnodeHooks, parentComponent, vnode);
+          needCallTransitionHooks && transition.enter(el);
+          dirs && invokeDirectiveHook(vnode, null, parentComponent, "mounted");
+        }, parentSuspense);
+      }
     }
     return el.nextSibling;
   };
@@ -8017,7 +8151,10 @@ function createHydrationFunctions(rendererInternals) {
         hasMismatch = true;
         if (!hasWarned) {
           warn(
-            `Hydration children mismatch in <${container.tagName.toLowerCase()}>: server rendered element contains fewer child nodes than client vdom.`
+            `Hydration children mismatch on`,
+            container,
+            `
+Server rendered element contains fewer child nodes than client vdom.`
           );
           hasWarned = true;
         }
@@ -8028,7 +8165,7 @@ function createHydrationFunctions(rendererInternals) {
           null,
           parentComponent,
           parentSuspense,
-          isSVGContainer(container),
+          getContainerType(container),
           slotScopeIds
         );
       }
@@ -8062,12 +8199,12 @@ function createHydrationFunctions(rendererInternals) {
     hasMismatch = true;
     warn(
       `Hydration node mismatch:
-- Client vnode:`,
-      vnode.type,
-      `
-- Server rendered DOM:`,
+- rendered on server:`,
       node,
-      node.nodeType === 3 /* TEXT */ ? `(text)` : isComment(node) && node.data === "[" ? `(start of fragment)` : ``
+      node.nodeType === 3 /* TEXT */ ? `(text)` : isComment(node) && node.data === "[" ? `(start of fragment)` : ``,
+      `
+- expected on client:`,
+      vnode.type
     );
     vnode.el = null;
     if (isFragment) {
@@ -8091,7 +8228,7 @@ function createHydrationFunctions(rendererInternals) {
       next,
       parentComponent,
       parentSuspense,
-      isSVGContainer(container),
+      getContainerType(container),
       slotScopeIds
     );
     return next;
@@ -8132,6 +8269,46 @@ function createHydrationFunctions(rendererInternals) {
   };
   return [hydrate, hydrateNode];
 }
+function propHasMismatch(el, key, clientValue) {
+  let mismatchType;
+  let mismatchKey;
+  let actual;
+  let expected;
+  if (key === "class") {
+    actual = el.className;
+    expected = normalizeClass(clientValue);
+    if (actual !== expected) {
+      mismatchType = mismatchKey = `class`;
+    }
+  } else if (key === "style") {
+    actual = el.getAttribute("style");
+    expected = isString(clientValue) ? clientValue : stringifyStyle(normalizeStyle(clientValue));
+    if (actual !== expected) {
+      mismatchType = mismatchKey = "style";
+    }
+  } else if (el instanceof SVGElement && isKnownSvgAttr(key) || el instanceof HTMLElement && (isBooleanAttr(key) || isKnownHtmlAttr(key))) {
+    actual = el.hasAttribute(key) && el.getAttribute(key);
+    expected = isBooleanAttr(key) ? includeBooleanAttr(clientValue) ? "" : false : clientValue == null ? false : String(clientValue);
+    if (actual !== expected) {
+      mismatchType = `attribute`;
+      mismatchKey = key;
+    }
+  }
+  if (mismatchType) {
+    const format = (v) => v === false ? `(not rendered)` : `${mismatchKey}="${v}"`;
+    warn(
+      `Hydration ${mismatchType} mismatch on`,
+      el,
+      `
+  - rendered on server: ${format(actual)}
+  - expected on client: ${format(expected)}
+  Note: this mismatch is check-only. The DOM will not be rectified in production due to performance overhead.
+  You should fix the source of the mismatch.`
+    );
+    return true;
+  }
+  return false;
+}
 
 let supported;
 let perf;
@@ -8200,7 +8377,7 @@ function baseCreateRenderer(options, createHydrationFns) {
     setScopeId: hostSetScopeId = NOOP,
     insertStaticContent: hostInsertStaticContent
   } = options;
-  const patch = (n1, n2, container, anchor = null, parentComponent = null, parentSuspense = null, isSVG = false, slotScopeIds = null, optimized = isHmrUpdating ? false : !!n2.dynamicChildren) => {
+  const patch = (n1, n2, container, anchor = null, parentComponent = null, parentSuspense = null, namespace = void 0, slotScopeIds = null, optimized = isHmrUpdating ? false : !!n2.dynamicChildren) => {
     if (n1 === n2) {
       return;
     }
@@ -8223,9 +8400,9 @@ function baseCreateRenderer(options, createHydrationFns) {
         break;
       case Static:
         if (n1 == null) {
-          mountStaticNode(n2, container, anchor, isSVG);
+          mountStaticNode(n2, container, anchor, namespace);
         } else {
-          patchStaticNode(n1, n2, container, isSVG);
+          patchStaticNode(n1, n2, container, namespace);
         }
         break;
       case Fragment:
@@ -8236,7 +8413,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           anchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -8250,7 +8427,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -8262,7 +8439,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -8274,7 +8451,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized,
             internals
@@ -8287,7 +8464,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized,
             internals
@@ -8325,17 +8502,17 @@ function baseCreateRenderer(options, createHydrationFns) {
       n2.el = n1.el;
     }
   };
-  const mountStaticNode = (n2, container, anchor, isSVG) => {
+  const mountStaticNode = (n2, container, anchor, namespace) => {
     [n2.el, n2.anchor] = hostInsertStaticContent(
       n2.children,
       container,
       anchor,
-      isSVG,
+      namespace,
       n2.el,
       n2.anchor
     );
   };
-  const patchStaticNode = (n1, n2, container, isSVG) => {
+  const patchStaticNode = (n1, n2, container, namespace) => {
     if (n2.children !== n1.children) {
       const anchor = hostNextSibling(n1.anchor);
       removeStaticNode(n1);
@@ -8343,7 +8520,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         n2.children,
         container,
         anchor,
-        isSVG
+        namespace
       );
     } else {
       n2.el = n1.el;
@@ -8368,8 +8545,12 @@ function baseCreateRenderer(options, createHydrationFns) {
     }
     hostRemove(anchor);
   };
-  const processElement = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
-    isSVG = isSVG || n2.type === "svg";
+  const processElement = (n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
+    if (n2.type === "svg") {
+      namespace = "svg";
+    } else if (n2.type === "math") {
+      namespace = "mathml";
+    }
     if (n1 == null) {
       mountElement(
         n2,
@@ -8377,7 +8558,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         anchor,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
@@ -8387,19 +8568,19 @@ function baseCreateRenderer(options, createHydrationFns) {
         n2,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
     }
   };
-  const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const mountElement = (vnode, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     let el;
     let vnodeHook;
-    const { type, props, shapeFlag, transition, dirs } = vnode;
+    const { props, shapeFlag, transition, dirs } = vnode;
     el = vnode.el = hostCreateElement(
       vnode.type,
-      isSVG,
+      namespace,
       props && props.is,
       props
     );
@@ -8412,7 +8593,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         null,
         parentComponent,
         parentSuspense,
-        isSVG && type !== "foreignObject",
+        resolveChildrenNamespace(vnode, namespace),
         slotScopeIds,
         optimized
       );
@@ -8429,7 +8610,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             key,
             null,
             props[key],
-            isSVG,
+            namespace,
             vnode.children,
             parentComponent,
             parentSuspense,
@@ -8438,7 +8619,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         }
       }
       if ("value" in props) {
-        hostPatchProp(el, "value", null, props.value);
+        hostPatchProp(el, "value", null, props.value, namespace);
       }
       if (vnodeHook = props.onVnodeBeforeMount) {
         invokeVNodeHook(vnodeHook, parentComponent, vnode);
@@ -8496,7 +8677,7 @@ function baseCreateRenderer(options, createHydrationFns) {
       }
     }
   };
-  const mountChildren = (children, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, start = 0) => {
+  const mountChildren = (children, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, start = 0) => {
     for (let i = start; i < children.length; i++) {
       const child = children[i] = optimized ? cloneIfMounted(children[i]) : normalizeVNode(children[i]);
       patch(
@@ -8506,13 +8687,13 @@ function baseCreateRenderer(options, createHydrationFns) {
         anchor,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
     }
   };
-  const patchElement = (n1, n2, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const patchElement = (n1, n2, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     const el = n2.el = n1.el;
     let { patchFlag, dynamicChildren, dirs } = n2;
     patchFlag |= n1.patchFlag & 16;
@@ -8532,7 +8713,6 @@ function baseCreateRenderer(options, createHydrationFns) {
       optimized = false;
       dynamicChildren = null;
     }
-    const areChildrenSVG = isSVG && n2.type !== "foreignObject";
     if (dynamicChildren) {
       patchBlockChildren(
         n1.dynamicChildren,
@@ -8540,7 +8720,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         el,
         parentComponent,
         parentSuspense,
-        areChildrenSVG,
+        resolveChildrenNamespace(n2, namespace),
         slotScopeIds
       );
       {
@@ -8554,7 +8734,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         null,
         parentComponent,
         parentSuspense,
-        areChildrenSVG,
+        resolveChildrenNamespace(n2, namespace),
         slotScopeIds,
         false
       );
@@ -8568,16 +8748,16 @@ function baseCreateRenderer(options, createHydrationFns) {
           newProps,
           parentComponent,
           parentSuspense,
-          isSVG
+          namespace
         );
       } else {
         if (patchFlag & 2) {
           if (oldProps.class !== newProps.class) {
-            hostPatchProp(el, "class", null, newProps.class, isSVG);
+            hostPatchProp(el, "class", null, newProps.class, namespace);
           }
         }
         if (patchFlag & 4) {
-          hostPatchProp(el, "style", oldProps.style, newProps.style, isSVG);
+          hostPatchProp(el, "style", oldProps.style, newProps.style, namespace);
         }
         if (patchFlag & 8) {
           const propsToUpdate = n2.dynamicProps;
@@ -8591,7 +8771,7 @@ function baseCreateRenderer(options, createHydrationFns) {
                 key,
                 prev,
                 next,
-                isSVG,
+                namespace,
                 n1.children,
                 parentComponent,
                 parentSuspense,
@@ -8614,7 +8794,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         newProps,
         parentComponent,
         parentSuspense,
-        isSVG
+        namespace
       );
     }
     if ((vnodeHook = newProps.onVnodeUpdated) || dirs) {
@@ -8624,7 +8804,7 @@ function baseCreateRenderer(options, createHydrationFns) {
       }, parentSuspense);
     }
   };
-  const patchBlockChildren = (oldChildren, newChildren, fallbackContainer, parentComponent, parentSuspense, isSVG, slotScopeIds) => {
+  const patchBlockChildren = (oldChildren, newChildren, fallbackContainer, parentComponent, parentSuspense, namespace, slotScopeIds) => {
     for (let i = 0; i < newChildren.length; i++) {
       const oldVNode = oldChildren[i];
       const newVNode = newChildren[i];
@@ -8649,13 +8829,13 @@ function baseCreateRenderer(options, createHydrationFns) {
         null,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         true
       );
     }
   };
-  const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, isSVG) => {
+  const patchProps = (el, vnode, oldProps, newProps, parentComponent, parentSuspense, namespace) => {
     if (oldProps !== newProps) {
       if (oldProps !== EMPTY_OBJ) {
         for (const key in oldProps) {
@@ -8665,7 +8845,7 @@ function baseCreateRenderer(options, createHydrationFns) {
               key,
               oldProps[key],
               null,
-              isSVG,
+              namespace,
               vnode.children,
               parentComponent,
               parentSuspense,
@@ -8685,7 +8865,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             key,
             prev,
             next,
-            isSVG,
+            namespace,
             vnode.children,
             parentComponent,
             parentSuspense,
@@ -8694,11 +8874,11 @@ function baseCreateRenderer(options, createHydrationFns) {
         }
       }
       if ("value" in newProps) {
-        hostPatchProp(el, "value", oldProps.value, newProps.value);
+        hostPatchProp(el, "value", oldProps.value, newProps.value, namespace);
       }
     }
   };
-  const processFragment = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const processFragment = (n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     const fragmentStartAnchor = n2.el = n1 ? n1.el : hostCreateText("");
     const fragmentEndAnchor = n2.anchor = n1 ? n1.anchor : hostCreateText("");
     let { patchFlag, dynamicChildren, slotScopeIds: fragmentSlotScopeIds } = n2;
@@ -8722,7 +8902,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         fragmentEndAnchor,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
@@ -8736,7 +8916,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           container,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds
         );
         {
@@ -8750,14 +8930,14 @@ function baseCreateRenderer(options, createHydrationFns) {
           fragmentEndAnchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
       }
     }
   };
-  const processComponent = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const processComponent = (n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     n2.slotScopeIds = slotScopeIds;
     if (n1 == null) {
       if (n2.shapeFlag & 512) {
@@ -8765,7 +8945,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           n2,
           container,
           anchor,
-          isSVG,
+          namespace,
           optimized
         );
       } else {
@@ -8775,7 +8955,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           anchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           optimized
         );
       }
@@ -8783,7 +8963,7 @@ function baseCreateRenderer(options, createHydrationFns) {
       updateComponent(n1, n2, optimized);
     }
   };
-  const mountComponent = (initialVNode, container, anchor, parentComponent, parentSuspense, isSVG, optimized) => {
+  const mountComponent = (initialVNode, container, anchor, parentComponent, parentSuspense, namespace, optimized) => {
     const compatMountInstance = initialVNode.isCompatRoot && initialVNode.component;
     const instance = compatMountInstance || (initialVNode.component = createComponentInstance(
       initialVNode,
@@ -8815,17 +8995,17 @@ function baseCreateRenderer(options, createHydrationFns) {
         const placeholder = instance.subTree = createVNode(Comment);
         processCommentNode(null, placeholder, container, anchor);
       }
-      return;
+    } else {
+      setupRenderEffect(
+        instance,
+        initialVNode,
+        container,
+        anchor,
+        parentSuspense,
+        namespace,
+        optimized
+      );
     }
-    setupRenderEffect(
-      instance,
-      initialVNode,
-      container,
-      anchor,
-      parentSuspense,
-      isSVG,
-      optimized
-    );
     {
       popWarningContext();
       endMeasure(instance, `mount`);
@@ -8854,7 +9034,7 @@ function baseCreateRenderer(options, createHydrationFns) {
       instance.vnode = n2;
     }
   };
-  const setupRenderEffect = (instance, initialVNode, container, anchor, parentSuspense, isSVG, optimized) => {
+  const setupRenderEffect = (instance, initialVNode, container, anchor, parentSuspense, namespace, optimized) => {
     const componentUpdateFn = () => {
       if (!instance.isMounted) {
         let vnodeHook;
@@ -8924,7 +9104,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             instance,
             parentSuspense,
-            isSVG
+            namespace
           );
           {
             endMeasure(instance, `patch`);
@@ -8963,6 +9143,21 @@ function baseCreateRenderer(options, createHydrationFns) {
         initialVNode = container = anchor = null;
       } else {
         let { next, bu, u, parent, vnode } = instance;
+        {
+          const nonHydratedAsyncRoot = locateNonHydratedAsyncRoot(instance);
+          if (nonHydratedAsyncRoot) {
+            if (next) {
+              next.el = vnode.el;
+              updateComponentPreRender(instance, next, optimized);
+            }
+            nonHydratedAsyncRoot.asyncDep.then(() => {
+              if (!instance.isUnmounted) {
+                componentUpdateFn();
+              }
+            });
+            return;
+          }
+        }
         let originNext = next;
         let vnodeHook;
         {
@@ -9006,7 +9201,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           getNextHostNode(prevTree),
           instance,
           parentSuspense,
-          isSVG
+          namespace
         );
         {
           endMeasure(instance, `patch`);
@@ -9067,10 +9262,10 @@ function baseCreateRenderer(options, createHydrationFns) {
     updateProps(instance, nextVNode.props, prevProps, optimized);
     updateSlots(instance, nextVNode.children, optimized);
     pauseTracking();
-    flushPreFlushCbs();
+    flushPreFlushCbs(instance);
     resetTracking();
   };
-  const patchChildren = (n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized = false) => {
+  const patchChildren = (n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized = false) => {
     const c1 = n1 && n1.children;
     const prevShapeFlag = n1 ? n1.shapeFlag : 0;
     const c2 = n2.children;
@@ -9084,7 +9279,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           anchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -9097,7 +9292,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           anchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -9121,7 +9316,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9139,7 +9334,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9147,7 +9342,7 @@ function baseCreateRenderer(options, createHydrationFns) {
       }
     }
   };
-  const patchUnkeyedChildren = (c1, c2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const patchUnkeyedChildren = (c1, c2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     c1 = c1 || EMPTY_ARR;
     c2 = c2 || EMPTY_ARR;
     const oldLength = c1.length;
@@ -9163,7 +9358,7 @@ function baseCreateRenderer(options, createHydrationFns) {
         null,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized
       );
@@ -9184,14 +9379,14 @@ function baseCreateRenderer(options, createHydrationFns) {
         anchor,
         parentComponent,
         parentSuspense,
-        isSVG,
+        namespace,
         slotScopeIds,
         optimized,
         commonLength
       );
     }
   };
-  const patchKeyedChildren = (c1, c2, container, parentAnchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized) => {
+  const patchKeyedChildren = (c1, c2, container, parentAnchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized) => {
     let i = 0;
     const l2 = c2.length;
     let e1 = c1.length - 1;
@@ -9207,7 +9402,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           null,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -9227,7 +9422,7 @@ function baseCreateRenderer(options, createHydrationFns) {
           null,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           optimized
         );
@@ -9249,7 +9444,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9319,7 +9514,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             null,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9340,7 +9535,7 @@ function baseCreateRenderer(options, createHydrationFns) {
             anchor,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9570,13 +9765,21 @@ function baseCreateRenderer(options, createHydrationFns) {
     }
     return hostNextSibling(vnode.anchor || vnode.el);
   };
-  const render = (vnode, container, isSVG) => {
+  const render = (vnode, container, namespace) => {
     if (vnode == null) {
       if (container._vnode) {
         unmount(container._vnode, null, null, true);
       }
     } else {
-      patch(container._vnode || null, vnode, container, null, null, null, isSVG);
+      patch(
+        container._vnode || null,
+        vnode,
+        container,
+        null,
+        null,
+        null,
+        namespace
+      );
     }
     flushPreFlushCbs();
     flushPostFlushCbs();
@@ -9607,6 +9810,9 @@ function baseCreateRenderer(options, createHydrationFns) {
     createApp: createAppAPI(render, hydrate)
   };
 }
+function resolveChildrenNamespace({ type, props }, currentNamespace) {
+  return currentNamespace === "svg" && type === "foreignObject" || currentNamespace === "mathml" && type === "annotation-xml" && props && props.encoding && props.encoding.includes("html") ? void 0 : currentNamespace;
+}
 function toggleRecurse({ effect, update }, allowed) {
   effect.allowRecurse = update.allowRecurse = allowed;
 }
@@ -9677,10 +9883,21 @@ function getSequence(arr) {
   }
   return result;
 }
+function locateNonHydratedAsyncRoot(instance) {
+  const subComponent = instance.subTree.component;
+  if (subComponent) {
+    if (subComponent.asyncDep && !subComponent.asyncResolved) {
+      return subComponent;
+    } else {
+      return locateNonHydratedAsyncRoot(subComponent);
+    }
+  }
+}
 
 const isTeleport = (type) => type.__isTeleport;
 const isTeleportDisabled = (props) => props && (props.disabled || props.disabled === "");
 const isTargetSVG = (target) => typeof SVGElement !== "undefined" && target instanceof SVGElement;
+const isTargetMathML = (target) => typeof MathMLElement === "function" && target instanceof MathMLElement;
 const resolveTarget = (props, select) => {
   const targetSelector = props && props.to;
   if (isString(targetSelector)) {
@@ -9708,7 +9925,7 @@ const resolveTarget = (props, select) => {
 const TeleportImpl = {
   name: "Teleport",
   __isTeleport: true,
-  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
+  process(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, internals) {
     const {
       mc: mountChildren,
       pc: patchChildren,
@@ -9730,7 +9947,11 @@ const TeleportImpl = {
       const targetAnchor = n2.targetAnchor = createText("");
       if (target) {
         insert(targetAnchor, target);
-        isSVG = isSVG || isTargetSVG(target);
+        if (namespace === "svg" || isTargetSVG(target)) {
+          namespace = "svg";
+        } else if (namespace === "mathml" || isTargetMathML(target)) {
+          namespace = "mathml";
+        }
       } else if (!disabled) {
         warn("Invalid Teleport target on mount:", target, `(${typeof target})`);
       }
@@ -9742,7 +9963,7 @@ const TeleportImpl = {
             anchor2,
             parentComponent,
             parentSuspense,
-            isSVG,
+            namespace,
             slotScopeIds,
             optimized
           );
@@ -9761,7 +9982,11 @@ const TeleportImpl = {
       const wasDisabled = isTeleportDisabled(n1.props);
       const currentContainer = wasDisabled ? container : target;
       const currentAnchor = wasDisabled ? mainAnchor : targetAnchor;
-      isSVG = isSVG || isTargetSVG(target);
+      if (namespace === "svg" || isTargetSVG(target)) {
+        namespace = "svg";
+      } else if (namespace === "mathml" || isTargetMathML(target)) {
+        namespace = "mathml";
+      }
       if (dynamicChildren) {
         patchBlockChildren(
           n1.dynamicChildren,
@@ -9769,7 +9994,7 @@ const TeleportImpl = {
           currentContainer,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds
         );
         traverseStaticChildren(n1, n2, true);
@@ -9781,7 +10006,7 @@ const TeleportImpl = {
           currentAnchor,
           parentComponent,
           parentSuspense,
-          isSVG,
+          namespace,
           slotScopeIds,
           false
         );
@@ -10465,20 +10690,29 @@ function createComponentInstance(vnode, parent, suspense) {
 let currentInstance = null;
 const getCurrentInstance = () => currentInstance || currentRenderingInstance;
 let internalSetCurrentInstance;
-let globalCurrentInstanceSetters;
-let settersKey = "__VUE_INSTANCE_SETTERS__";
+let setInSSRSetupState;
 {
-  if (!(globalCurrentInstanceSetters = getGlobalThis()[settersKey])) {
-    globalCurrentInstanceSetters = getGlobalThis()[settersKey] = [];
-  }
-  globalCurrentInstanceSetters.push((i) => currentInstance = i);
-  internalSetCurrentInstance = (instance) => {
-    if (globalCurrentInstanceSetters.length > 1) {
-      globalCurrentInstanceSetters.forEach((s) => s(instance));
-    } else {
-      globalCurrentInstanceSetters[0](instance);
-    }
+  const g = getGlobalThis();
+  const registerGlobalSetter = (key, setter) => {
+    let setters;
+    if (!(setters = g[key]))
+      setters = g[key] = [];
+    setters.push(setter);
+    return (v) => {
+      if (setters.length > 1)
+        setters.forEach((set) => set(v));
+      else
+        setters[0](v);
+    };
   };
+  internalSetCurrentInstance = registerGlobalSetter(
+    `__VUE_INSTANCE_SETTERS__`,
+    (v) => currentInstance = v
+  );
+  setInSSRSetupState = registerGlobalSetter(
+    `__VUE_SSR_SETTERS__`,
+    (v) => isInSSRComponentSetup = v
+  );
 }
 const setCurrentInstance = (instance) => {
   internalSetCurrentInstance(instance);
@@ -10502,13 +10736,13 @@ function isStatefulComponent(instance) {
 }
 let isInSSRComponentSetup = false;
 function setupComponent(instance, isSSR = false) {
-  isInSSRComponentSetup = isSSR;
+  isSSR && setInSSRSetupState(isSSR);
   const { props, children } = instance.vnode;
   const isStateful = isStatefulComponent(instance);
   initProps(instance, props, isStateful, isSSR);
   initSlots(instance, children);
   const setupResult = isStateful ? setupStatefulComponent(instance, isSSR) : void 0;
-  isInSSRComponentSetup = false;
+  isSSR && setInSSRSetupState(false);
   return setupResult;
 }
 function setupStatefulComponent(instance, isSSR) {
@@ -10838,9 +11072,9 @@ function initCustomFormatter() {
     return;
   }
   const vueStyle = { style: "color:#3ba776" };
-  const numberStyle = { style: "color:#0b1bc9" };
-  const stringStyle = { style: "color:#b62e24" };
-  const keywordStyle = { style: "color:#9d288c" };
+  const numberStyle = { style: "color:#1677ff" };
+  const stringStyle = { style: "color:#f5222d" };
+  const keywordStyle = { style: "color:#eb2f96" };
   const formatter = {
     header(obj) {
       if (!isObject(obj)) {
@@ -11034,7 +11268,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.4.0-alpha.3";
+const version = "3.4.0-beta.1";
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const _ssrUtils = {
   createComponentInstance,
@@ -11054,8 +11288,10 @@ const _compatUtils = {
   softAssertCompatEnabled
 };
 const compatUtils = _compatUtils ;
+const DeprecationTypes = DeprecationTypes$1 ;
 
 const svgNS = "http://www.w3.org/2000/svg";
+const mathmlNS = "http://www.w3.org/1998/Math/MathML";
 const doc = typeof document !== "undefined" ? document : null;
 const templateContainer = doc && /* @__PURE__ */ doc.createElement("template");
 const nodeOps = {
@@ -11068,8 +11304,8 @@ const nodeOps = {
       parent.removeChild(child);
     }
   },
-  createElement: (tag, isSVG, is, props) => {
-    const el = isSVG ? doc.createElementNS(svgNS, tag) : doc.createElement(tag, is ? { is } : void 0);
+  createElement: (tag, namespace, is, props) => {
+    const el = namespace === "svg" ? doc.createElementNS(svgNS, tag) : namespace === "mathml" ? doc.createElementNS(mathmlNS, tag) : doc.createElement(tag, is ? { is } : void 0);
     if (tag === "select" && props && props.multiple != null) {
       el.setAttribute("multiple", props.multiple);
     }
@@ -11093,7 +11329,7 @@ const nodeOps = {
   // Reason: innerHTML.
   // Static content here can only come from compiled templates.
   // As long as the user only uses trusted templates, this is safe.
-  insertStaticContent(content, parent, anchor, isSVG, start, end) {
+  insertStaticContent(content, parent, anchor, namespace, start, end) {
     const before = anchor ? anchor.previousSibling : parent.lastChild;
     if (start && (start === end || start.nextSibling)) {
       while (true) {
@@ -11102,9 +11338,9 @@ const nodeOps = {
           break;
       }
     } else {
-      templateContainer.innerHTML = isSVG ? `<svg>${content}</svg>` : content;
+      templateContainer.innerHTML = namespace === "svg" ? `<svg>${content}</svg>` : namespace === "mathml" ? `<math>${content}</math>` : content;
       const template = templateContainer.content;
-      if (isSVG) {
+      if (namespace === "svg" || namespace === "mathml") {
         const wrapper = template.firstChild;
         while (wrapper.firstChild) {
           template.appendChild(wrapper.firstChild);
@@ -11749,8 +11985,10 @@ function patchStopImmediatePropagation(e, value) {
   }
 }
 
-const nativeOnRE = /^on[a-z]/;
-const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
+const isNativeOn = (key) => key.charCodeAt(0) === 111 && key.charCodeAt(1) === 110 && // lowercase letter
+key.charCodeAt(2) > 96 && key.charCodeAt(2) < 123;
+const patchProp = (el, key, prevValue, nextValue, namespace, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
+  const isSVG = namespace === "svg";
   if (key === "class") {
     patchClass(el, nextValue, isSVG);
   } else if (key === "style") {
@@ -11783,7 +12021,7 @@ function shouldSetAsProp(el, key, value, isSVG) {
     if (key === "innerHTML" || key === "textContent") {
       return true;
     }
-    if (key in el && nativeOnRE.test(key) && isFunction(value)) {
+    if (key in el && isNativeOn(key) && isFunction(value)) {
       return true;
     }
     return false;
@@ -11800,7 +12038,13 @@ function shouldSetAsProp(el, key, value, isSVG) {
   if (key === "type" && el.tagName === "TEXTAREA") {
     return false;
   }
-  if (nativeOnRE.test(key) && isString(value)) {
+  if (key === "width" || key === "height") {
+    const tag = el.tagName;
+    if (tag === "IMG" || tag === "VIDEO" || tag === "CANVAS" || tag === "SOURCE") {
+      return false;
+    }
+  }
+  if (isNativeOn(key) && isString(value)) {
     return false;
   }
   return key in el;
@@ -12469,14 +12713,14 @@ const modifierGuards = {
   exact: (e, modifiers) => systemModifiers.some((m) => e[`${m}Key`] && !modifiers.includes(m))
 };
 const withModifiers = (fn, modifiers) => {
-  return (event, ...args) => {
+  return fn._withMods || (fn._withMods = (event, ...args) => {
     for (let i = 0; i < modifiers.length; i++) {
       const guard = modifierGuards[modifiers[i]];
       if (guard && guard(event, modifiers))
         return;
     }
     return fn(event, ...args);
-  };
+  });
 };
 const keyNames = {
   esc: "escape",
@@ -12504,7 +12748,7 @@ const withKeys = (fn, modifiers) => {
       );
     }
   }
-  return (event) => {
+  return fn._withKeys || (fn._withKeys = (event) => {
     if (!("key" in event)) {
       return;
     }
@@ -12532,7 +12776,7 @@ const withKeys = (fn, modifiers) => {
         }
       }
     }
-  };
+  });
 };
 
 const rendererOptions = /* @__PURE__ */ extend({ patchProp }, nodeOps);
@@ -12580,7 +12824,7 @@ const createApp = (...args) => {
       }
     }
     container.innerHTML = "";
-    const proxy = mount(container, false, container instanceof SVGElement);
+    const proxy = mount(container, false, resolveRootNamespace(container));
     if (container instanceof Element) {
       container.removeAttribute("v-cloak");
       container.setAttribute("data-v-app", "");
@@ -12599,14 +12843,22 @@ const createSSRApp = (...args) => {
   app.mount = (containerOrSelector) => {
     const container = normalizeContainer(containerOrSelector);
     if (container) {
-      return mount(container, true, container instanceof SVGElement);
+      return mount(container, true, resolveRootNamespace(container));
     }
   };
   return app;
 };
+function resolveRootNamespace(container) {
+  if (container instanceof SVGElement) {
+    return "svg";
+  }
+  if (typeof MathMLElement === "function" && container instanceof MathMLElement) {
+    return "mathml";
+  }
+}
 function injectNativeTagCheck(app) {
   Object.defineProperty(app.config, "isNativeTag", {
-    value: (tag) => isHTMLTag(tag) || isSVGTag(tag),
+    value: (tag) => isHTMLTag(tag) || isSVGTag(tag) || isMathMLTag(tag),
     writable: false
   });
 }
@@ -12670,7 +12922,9 @@ var runtimeDom = /*#__PURE__*/Object.freeze({
   BaseTransition: BaseTransition,
   BaseTransitionPropsValidators: BaseTransitionPropsValidators,
   Comment: Comment,
+  DeprecationTypes: DeprecationTypes,
   EffectScope: EffectScope,
+  ErrorCodes: ErrorCodes,
   ErrorTypeStrings: ErrorTypeStrings,
   Fragment: Fragment,
   KeepAlive: KeepAlive,
@@ -12679,8 +12933,10 @@ var runtimeDom = /*#__PURE__*/Object.freeze({
   Suspense: Suspense,
   Teleport: Teleport,
   Text: Text,
+  TrackOpTypes: TrackOpTypes,
   Transition: Transition,
   TransitionGroup: TransitionGroup,
+  TriggerOpTypes: TriggerOpTypes,
   VueElement: VueElement,
   assertNumber: assertNumber,
   callWithAsyncErrorHandling: callWithAsyncErrorHandling,
@@ -13137,7 +13393,9 @@ class Tokenizer {
     this.inRCDATA = false;
     /** For disabling RCDATA tags handling */
     this.inXML = false;
-    /** Reocrd newline positions for fast line / column calculation */
+    /** For disabling interpolation parsing in v-pre */
+    this.inVPre = false;
+    /** Record newline positions for fast line / column calculation */
     this.newlines = [];
     this.mode = 0;
     this.delimiterOpen = defaultDelimitersOpen;
@@ -13162,6 +13420,7 @@ class Tokenizer {
     this.sectionStart = 0;
     this.index = 0;
     this.baseState = 1;
+    this.inRCDATA = false;
     this.currentSequence = void 0;
     this.newlines.length = 0;
     this.delimiterOpen = defaultDelimitersOpen;
@@ -13202,7 +13461,7 @@ class Tokenizer {
       this.sectionStart = this.index;
     } else if (c === 38) {
       this.startEntity();
-    } else if (c === this.delimiterOpen[0]) {
+    } else if (!this.inVPre && c === this.delimiterOpen[0]) {
       this.state = 2;
       this.delimiterIndex = 0;
       this.stateInterpolationOpen(c);
@@ -14071,50 +14330,311 @@ const errorMessages = {
 Use a v-bind binding combined with a v-on listener that emits update:x event instead.`,
   [45]: `Error parsing JavaScript expression: `,
   [46]: `<KeepAlive> expects exactly one child component.`,
+  [51]: `@vnode-* hooks in templates are deprecated. Use the vue: prefix instead. For example, @vnode-mounted should be changed to @vue:mounted. @vnode-* hooks support will be removed in 3.4.`,
   // generic errors
   [47]: `"prefixIdentifiers" option is not supported in this build of compiler.`,
   [48]: `ES module mode is not supported in this build of compiler.`,
   [49]: `"cacheHandlers" option is only supported when the "prefixIdentifiers" option is enabled.`,
   [50]: `"scopeId" option is only supported in module mode.`,
-  // deprecations
-  [51]: `@vnode-* hooks in templates are deprecated. Use the vue: prefix instead. For example, @vnode-mounted should be changed to @vue:mounted. @vnode-* hooks support will be removed in 3.4.`,
-  [52]: `v-is="component-name" has been deprecated. Use is="vue:component-name" instead. v-is support will be removed in 3.4.`,
   // just to fulfill types
-  [53]: ``
+  [52]: ``
 };
 
-const isStaticExp = (p) => p.type === 4 && p.isStatic;
-function isCoreComponent(tag) {
-  switch (tag) {
-    case "Teleport":
-    case "teleport":
-      return TELEPORT;
-    case "Suspense":
-    case "suspense":
-      return SUSPENSE;
-    case "KeepAlive":
-    case "keep-alive":
-      return KEEP_ALIVE;
-    case "BaseTransition":
-    case "base-transition":
-      return BASE_TRANSITION;
-  }
-}
-const nonIdentifierRE = /^\d|[^\$\w]/;
-const isSimpleIdentifier = (name) => !nonIdentifierRE.test(name);
-const isMemberExpressionNode = (path, context) => {
-  try {
-    let ret = parser.parseExpression(path, {
-      plugins: context.expressionPlugins
-    });
-    if (ret.type === "TSAsExpression" || ret.type === "TSTypeAssertion") {
-      ret = ret.expression;
-    }
-    return ret.type === "MemberExpression" || ret.type === "OptionalMemberExpression" || ret.type === "Identifier";
-  } catch (e) {
-    return false;
-  }
-};
+function walkIdentifiers(root, onIdentifier, includeAll = false, parentStack = [], knownIds = /* @__PURE__ */ Object.create(null)) {
+  const rootExp = root.type === "Program" ? root.body[0].type === "ExpressionStatement" && root.body[0].expression : root;
+  estreeWalker.walk(root, {
+    enter(node, parent) {
+      parent && parentStack.push(parent);
+      if (parent && parent.type.startsWith("TS") && !TS_NODE_TYPES.includes(parent.type)) {
+        return this.skip();
+      }
+      if (node.type === "Identifier") {
+        const isLocal = !!knownIds[node.name];
+        const isRefed = isReferencedIdentifier(node, parent, parentStack);
+        if (includeAll || isRefed && !isLocal) {
+          onIdentifier(node, parent, parentStack, isRefed, isLocal);
+        }
+      } else if (node.type === "ObjectProperty" && parent.type === "ObjectPattern") {
+        node.inPattern = true;
+      } else if (isFunctionType(node)) {
+        walkFunctionParams(node, (id) => markScopeIdentifier(node, id, knownIds));
+      } else if (node.type === "BlockStatement") {
+        walkBlockDeclarations(
+          node,
+          (id) => markScopeIdentifier(node, id, knownIds)
+        );
+      }
+    },
+    leave(node, parent) {
+      parent && parentStack.pop();
+      if (node !== rootExp && node.scopeIds) {
+        for (const id of node.scopeIds) {
+          knownIds[id]--;
+          if (knownIds[id] === 0) {
+            delete knownIds[id];
+          }
+        }
+      }
+    }
+  });
+}
+function isReferencedIdentifier(id, parent, parentStack) {
+  if (!parent) {
+    return true;
+  }
+  if (id.name === "arguments") {
+    return false;
+  }
+  if (isReferenced(id, parent)) {
+    return true;
+  }
+  switch (parent.type) {
+    case "AssignmentExpression":
+    case "AssignmentPattern":
+      return true;
+    case "ObjectPattern":
+    case "ArrayPattern":
+      return isInDestructureAssignment(parent, parentStack);
+  }
+  return false;
+}
+function isInDestructureAssignment(parent, parentStack) {
+  if (parent && (parent.type === "ObjectProperty" || parent.type === "ArrayPattern")) {
+    let i = parentStack.length;
+    while (i--) {
+      const p = parentStack[i];
+      if (p.type === "AssignmentExpression") {
+        return true;
+      } else if (p.type !== "ObjectProperty" && !p.type.endsWith("Pattern")) {
+        break;
+      }
+    }
+  }
+  return false;
+}
+function walkFunctionParams(node, onIdent) {
+  for (const p of node.params) {
+    for (const id of extractIdentifiers(p)) {
+      onIdent(id);
+    }
+  }
+}
+function walkBlockDeclarations(block, onIdent) {
+  for (const stmt of block.body) {
+    if (stmt.type === "VariableDeclaration") {
+      if (stmt.declare)
+        continue;
+      for (const decl of stmt.declarations) {
+        for (const id of extractIdentifiers(decl.id)) {
+          onIdent(id);
+        }
+      }
+    } else if (stmt.type === "FunctionDeclaration" || stmt.type === "ClassDeclaration") {
+      if (stmt.declare || !stmt.id)
+        continue;
+      onIdent(stmt.id);
+    } else if (stmt.type === "ForOfStatement" || stmt.type === "ForInStatement" || stmt.type === "ForStatement") {
+      const variable = stmt.type === "ForStatement" ? stmt.init : stmt.left;
+      if (variable && variable.type === "VariableDeclaration") {
+        for (const decl of variable.declarations) {
+          for (const id of extractIdentifiers(decl.id)) {
+            onIdent(id);
+          }
+        }
+      }
+    }
+  }
+}
+function extractIdentifiers(param, nodes = []) {
+  switch (param.type) {
+    case "Identifier":
+      nodes.push(param);
+      break;
+    case "MemberExpression":
+      let object = param;
+      while (object.type === "MemberExpression") {
+        object = object.object;
+      }
+      nodes.push(object);
+      break;
+    case "ObjectPattern":
+      for (const prop of param.properties) {
+        if (prop.type === "RestElement") {
+          extractIdentifiers(prop.argument, nodes);
+        } else {
+          extractIdentifiers(prop.value, nodes);
+        }
+      }
+      break;
+    case "ArrayPattern":
+      param.elements.forEach((element) => {
+        if (element)
+          extractIdentifiers(element, nodes);
+      });
+      break;
+    case "RestElement":
+      extractIdentifiers(param.argument, nodes);
+      break;
+    case "AssignmentPattern":
+      extractIdentifiers(param.left, nodes);
+      break;
+  }
+  return nodes;
+}
+function markScopeIdentifier(node, child, knownIds) {
+  const { name } = child;
+  if (node.scopeIds && node.scopeIds.has(name)) {
+    return;
+  }
+  if (name in knownIds) {
+    knownIds[name]++;
+  } else {
+    knownIds[name] = 1;
+  }
+  (node.scopeIds || (node.scopeIds = /* @__PURE__ */ new Set())).add(name);
+}
+const isFunctionType = (node) => {
+  return /Function(?:Expression|Declaration)$|Method$/.test(node.type);
+};
+const isStaticProperty = (node) => node && (node.type === "ObjectProperty" || node.type === "ObjectMethod") && !node.computed;
+const isStaticPropertyKey = (node, parent) => isStaticProperty(parent) && parent.key === node;
+function isReferenced(node, parent, grandparent) {
+  switch (parent.type) {
+    case "MemberExpression":
+    case "OptionalMemberExpression":
+      if (parent.property === node) {
+        return !!parent.computed;
+      }
+      return parent.object === node;
+    case "JSXMemberExpression":
+      return parent.object === node;
+    case "VariableDeclarator":
+      return parent.init === node;
+    case "ArrowFunctionExpression":
+      return parent.body === node;
+    case "PrivateName":
+      return false;
+    case "ClassMethod":
+    case "ClassPrivateMethod":
+    case "ObjectMethod":
+      if (parent.key === node) {
+        return !!parent.computed;
+      }
+      return false;
+    case "ObjectProperty":
+      if (parent.key === node) {
+        return !!parent.computed;
+      }
+      return !grandparent || grandparent.type !== "ObjectPattern";
+    case "ClassProperty":
+      if (parent.key === node) {
+        return !!parent.computed;
+      }
+      return true;
+    case "ClassPrivateProperty":
+      return parent.key !== node;
+    case "ClassDeclaration":
+    case "ClassExpression":
+      return parent.superClass === node;
+    case "AssignmentExpression":
+      return parent.right === node;
+    case "AssignmentPattern":
+      return parent.right === node;
+    case "LabeledStatement":
+      return false;
+    case "CatchClause":
+      return false;
+    case "RestElement":
+      return false;
+    case "BreakStatement":
+    case "ContinueStatement":
+      return false;
+    case "FunctionDeclaration":
+    case "FunctionExpression":
+      return false;
+    case "ExportNamespaceSpecifier":
+    case "ExportDefaultSpecifier":
+      return false;
+    case "ExportSpecifier":
+      if (grandparent == null ? void 0 : grandparent.source) {
+        return false;
+      }
+      return parent.local === node;
+    case "ImportDefaultSpecifier":
+    case "ImportNamespaceSpecifier":
+    case "ImportSpecifier":
+      return false;
+    case "ImportAttribute":
+      return false;
+    case "JSXAttribute":
+      return false;
+    case "ObjectPattern":
+    case "ArrayPattern":
+      return false;
+    case "MetaProperty":
+      return false;
+    case "ObjectTypeProperty":
+      return parent.key !== node;
+    case "TSEnumMember":
+      return parent.id !== node;
+    case "TSPropertySignature":
+      if (parent.key === node) {
+        return !!parent.computed;
+      }
+      return true;
+  }
+  return true;
+}
+const TS_NODE_TYPES = [
+  "TSAsExpression",
+  // foo as number
+  "TSTypeAssertion",
+  // (<number>foo)
+  "TSNonNullExpression",
+  // foo!
+  "TSInstantiationExpression",
+  // foo<string>
+  "TSSatisfiesExpression"
+  // foo satisfies T
+];
+function unwrapTSNode(node) {
+  if (TS_NODE_TYPES.includes(node.type)) {
+    return unwrapTSNode(node.expression);
+  } else {
+    return node;
+  }
+}
+
+const isStaticExp = (p) => p.type === 4 && p.isStatic;
+function isCoreComponent(tag) {
+  switch (tag) {
+    case "Teleport":
+    case "teleport":
+      return TELEPORT;
+    case "Suspense":
+    case "suspense":
+      return SUSPENSE;
+    case "KeepAlive":
+    case "keep-alive":
+      return KEEP_ALIVE;
+    case "BaseTransition":
+    case "base-transition":
+      return BASE_TRANSITION;
+  }
+}
+const nonIdentifierRE = /^\d|[^\$\w]/;
+const isSimpleIdentifier = (name) => !nonIdentifierRE.test(name);
+const isMemberExpressionNode = (path, context) => {
+  try {
+    let ret = parser.parseExpression(path, {
+      plugins: context.expressionPlugins
+    });
+    ret = unwrapTSNode(ret);
+    return ret.type === "MemberExpression" || ret.type === "OptionalMemberExpression" || ret.type === "Identifier";
+  } catch (e) {
+    return false;
+  }
+};
 const isMemberExpression = isMemberExpressionNode;
 function advancePositionWithClone(pos, source, numberOfCharacters = source.length) {
   return advancePositionWithMutation(
@@ -14335,7 +14855,8 @@ const defaultParserOptions = {
   isCustomElement: NO,
   onError: defaultOnError,
   onWarn: defaultOnWarn,
-  comments: true
+  comments: true,
+  prefixIdentifiers: false
 };
 let currentOptions = defaultParserOptions;
 let currentRoot = null;
@@ -14377,7 +14898,7 @@ const tokenizer = new Tokenizer(stack, {
     }
     addNode({
       type: 5,
-      content: createSimpleExpression(exp, false, getLoc(innerStart, innerEnd)),
+      content: createExp(exp, false, getLoc(innerStart, innerEnd)),
       loc: getLoc(start, end)
     });
   },
@@ -14470,7 +14991,7 @@ const tokenizer = new Tokenizer(stack, {
         loc: getLoc(start)
       };
       if (name === "pre") {
-        inVPre = true;
+        inVPre = tokenizer.inVPre = true;
         currentVPreBoundary = currentOpenTag;
         const props = currentOpenTag.props;
         for (let i = 0; i < props.length; i++) {
@@ -14490,7 +15011,7 @@ const tokenizer = new Tokenizer(stack, {
       setLocEnd(currentProp.nameLoc, end);
     } else {
       const isStatic = arg[0] !== `[`;
-      currentProp.arg = createSimpleExpression(
+      currentProp.arg = createExp(
         isStatic ? arg : arg.slice(1, -1),
         isStatic,
         getLoc(start, end),
@@ -14557,10 +15078,22 @@ const tokenizer = new Tokenizer(stack, {
             tokenizer.enterRCDATA(toCharCodes(`</template`), 0);
           }
         } else {
-          currentProp.exp = createSimpleExpression(
+          let expParseMode = 0 /* Normal */;
+          {
+            if (currentProp.name === "for") {
+              expParseMode = 3 /* Skip */;
+            } else if (currentProp.name === "slot") {
+              expParseMode = 1 /* Params */;
+            } else if (currentProp.name === "on" && currentAttrValue.includes(";")) {
+              expParseMode = 2 /* Statements */;
+            }
+          }
+          currentProp.exp = createExp(
             currentAttrValue,
             false,
-            getLoc(currentAttrStartIndex, currentAttrEndIndex)
+            getLoc(currentAttrStartIndex, currentAttrEndIndex),
+            0,
+            expParseMode
           );
           if (currentProp.name === "for") {
             currentProp.forParseResult = parseForExpression(currentProp.exp);
@@ -14663,10 +15196,16 @@ function parseForExpression(input) {
   if (!inMatch)
     return;
   const [, LHS, RHS] = inMatch;
-  const createAliasExpression = (content, offset) => {
+  const createAliasExpression = (content, offset, asParam = false) => {
     const start = loc.start.offset + offset;
     const end = start + content.length;
-    return createSimpleExpression(content, false, getLoc(start, end));
+    return createExp(
+      content,
+      false,
+      getLoc(start, end),
+      0,
+      asParam ? 1 /* Params */ : 0 /* Normal */
+    );
   };
   const result = {
     source: createAliasExpression(RHS.trim(), exp.indexOf(RHS, LHS.length)),
@@ -14684,7 +15223,7 @@ function parseForExpression(input) {
     let keyOffset;
     if (keyContent) {
       keyOffset = exp.indexOf(keyContent, trimmedOffset + valueContent.length);
-      result.key = createAliasExpression(keyContent, keyOffset);
+      result.key = createAliasExpression(keyContent, keyOffset, true);
     }
     if (iteratorMatch[2]) {
       const indexContent = iteratorMatch[2].trim();
@@ -14694,13 +15233,14 @@ function parseForExpression(input) {
           exp.indexOf(
             indexContent,
             result.key ? keyOffset + keyContent.length : trimmedOffset + valueContent.length
-          )
+          ),
+          true
         );
       }
     }
   }
   if (valueContent) {
-    result.value = createAliasExpression(valueContent, trimmedOffset);
+    result.value = createAliasExpression(valueContent, trimmedOffset, true);
   }
   return result;
 }
@@ -14771,7 +15311,7 @@ function onCloseTag(el, end, isImplied = false) {
     inPre--;
   }
   if (currentVPreBoundary === el) {
-    inVPre = false;
+    inVPre = tokenizer.inVPre = false;
     currentVPreBoundary = null;
   }
   if (tokenizer.inXML && (stack[0] ? stack[0].ns : currentOptions.ns) === 0) {
@@ -15006,8 +15546,36 @@ function dirToAttr(dir) {
   }
   return attr;
 }
-function emitError(code, index) {
-  currentOptions.onError(createCompilerError(code, getLoc(index, index)));
+function createExp(content, isStatic = false, loc, constType = 0, parseMode = 0 /* Normal */) {
+  const exp = createSimpleExpression(content, isStatic, loc, constType);
+  if (!isStatic && currentOptions.prefixIdentifiers && parseMode !== 3 /* Skip */ && content.trim()) {
+    if (isSimpleIdentifier(content)) {
+      exp.ast = null;
+      return exp;
+    }
+    try {
+      const plugins = currentOptions.expressionPlugins;
+      const options = {
+        plugins: plugins ? [...plugins, "typescript"] : ["typescript"]
+      };
+      if (parseMode === 2 /* Statements */) {
+        exp.ast = parser.parse(` ${content} `, options).program;
+      } else if (parseMode === 1 /* Params */) {
+        exp.ast = parser.parseExpression(`(${content})=>{}`, options);
+      } else {
+        exp.ast = parser.parseExpression(`(${content})`, options);
+      }
+    } catch (e) {
+      exp.ast = false;
+      emitError(45, loc.start.offset, e.message);
+    }
+  }
+  return exp;
+}
+function emitError(code, index, message) {
+  currentOptions.onError(
+    createCompilerError(code, getLoc(index, index), void 0, message)
+  );
 }
 function reset() {
   tokenizer.reset();
@@ -15038,6 +15606,7 @@ function baseParse(input, options) {
     }
   }
   tokenizer.mode = currentOptions.parseMode === "html" ? 1 : currentOptions.parseMode === "sfc" ? 2 : 0;
+  tokenizer.inXML = currentOptions.ns === 1 || currentOptions.ns === 2;
   const delimiters = options == null ? void 0 : options.delimiters;
   if (delimiters) {
     tokenizer.delimiterOpen = toCharCodes(delimiters[0]);
@@ -15322,6 +15891,7 @@ function createTransformContext(root, {
   const nameMatch = filename.replace(/\?.*$/, "").match(/([^/\\]+)\.\w+$/);
   const context = {
     // options
+    filename,
     selfName: nameMatch && capitalize(camelize(nameMatch[1])),
     prefixIdentifiers,
     hoistStatic: hoistStatic2,
@@ -16326,332 +16896,74 @@ function genCacheExpression(node, context) {
     push(`,`);
     newline();
     push(`${helper(SET_BLOCK_TRACKING)}(1),`);
-    newline();
-    push(`_cache[${node.index}]`);
-    deindent();
-  }
-  push(`)`);
-}
-function genTemplateLiteral(node, context) {
-  const { push, indent, deindent } = context;
-  push("`");
-  const l = node.elements.length;
-  const multilines = l > 3;
-  for (let i = 0; i < l; i++) {
-    const e = node.elements[i];
-    if (isString(e)) {
-      push(e.replace(/(`|\$|\\)/g, "\\$1"), -3 /* Unknown */);
-    } else {
-      push("${");
-      if (multilines)
-        indent();
-      genNode(e, context);
-      if (multilines)
-        deindent();
-      push("}");
-    }
-  }
-  push("`");
-}
-function genIfStatement(node, context) {
-  const { push, indent, deindent } = context;
-  const { test, consequent, alternate } = node;
-  push(`if (`);
-  genNode(test, context);
-  push(`) {`);
-  indent();
-  genNode(consequent, context);
-  deindent();
-  push(`}`);
-  if (alternate) {
-    push(` else `);
-    if (alternate.type === 23) {
-      genIfStatement(alternate, context);
-    } else {
-      push(`{`);
-      indent();
-      genNode(alternate, context);
-      deindent();
-      push(`}`);
-    }
-  }
-}
-function genAssignmentExpression(node, context) {
-  genNode(node.left, context);
-  context.push(` = `);
-  genNode(node.right, context);
-}
-function genSequenceExpression(node, context) {
-  context.push(`(`);
-  genNodeList(node.expressions, context);
-  context.push(`)`);
-}
-function genReturnStatement({ returns }, context) {
-  context.push(`return `);
-  if (isArray(returns)) {
-    genNodeListAsArray(returns, context);
-  } else {
-    genNode(returns, context);
-  }
-}
-
-function walkIdentifiers(root, onIdentifier, includeAll = false, parentStack = [], knownIds = /* @__PURE__ */ Object.create(null)) {
-  const rootExp = root.type === "Program" && root.body[0].type === "ExpressionStatement" && root.body[0].expression;
-  estreeWalker.walk(root, {
-    enter(node, parent) {
-      parent && parentStack.push(parent);
-      if (parent && parent.type.startsWith("TS") && !TS_NODE_TYPES.includes(parent.type)) {
-        return this.skip();
-      }
-      if (node.type === "Identifier") {
-        const isLocal = !!knownIds[node.name];
-        const isRefed = isReferencedIdentifier(node, parent, parentStack);
-        if (includeAll || isRefed && !isLocal) {
-          onIdentifier(node, parent, parentStack, isRefed, isLocal);
-        }
-      } else if (node.type === "ObjectProperty" && parent.type === "ObjectPattern") {
-        node.inPattern = true;
-      } else if (isFunctionType(node)) {
-        walkFunctionParams(node, (id) => markScopeIdentifier(node, id, knownIds));
-      } else if (node.type === "BlockStatement") {
-        walkBlockDeclarations(
-          node,
-          (id) => markScopeIdentifier(node, id, knownIds)
-        );
-      }
-    },
-    leave(node, parent) {
-      parent && parentStack.pop();
-      if (node !== rootExp && node.scopeIds) {
-        for (const id of node.scopeIds) {
-          knownIds[id]--;
-          if (knownIds[id] === 0) {
-            delete knownIds[id];
-          }
-        }
-      }
-    }
-  });
-}
-function isReferencedIdentifier(id, parent, parentStack) {
-  if (!parent) {
-    return true;
-  }
-  if (id.name === "arguments") {
-    return false;
-  }
-  if (isReferenced(id, parent)) {
-    return true;
-  }
-  switch (parent.type) {
-    case "AssignmentExpression":
-    case "AssignmentPattern":
-      return true;
-    case "ObjectPattern":
-    case "ArrayPattern":
-      return isInDestructureAssignment(parent, parentStack);
-  }
-  return false;
-}
-function isInDestructureAssignment(parent, parentStack) {
-  if (parent && (parent.type === "ObjectProperty" || parent.type === "ArrayPattern")) {
-    let i = parentStack.length;
-    while (i--) {
-      const p = parentStack[i];
-      if (p.type === "AssignmentExpression") {
-        return true;
-      } else if (p.type !== "ObjectProperty" && !p.type.endsWith("Pattern")) {
-        break;
-      }
-    }
+    newline();
+    push(`_cache[${node.index}]`);
+    deindent();
   }
-  return false;
+  push(`)`);
 }
-function walkFunctionParams(node, onIdent) {
-  for (const p of node.params) {
-    for (const id of extractIdentifiers(p)) {
-      onIdent(id);
+function genTemplateLiteral(node, context) {
+  const { push, indent, deindent } = context;
+  push("`");
+  const l = node.elements.length;
+  const multilines = l > 3;
+  for (let i = 0; i < l; i++) {
+    const e = node.elements[i];
+    if (isString(e)) {
+      push(e.replace(/(`|\$|\\)/g, "\\$1"), -3 /* Unknown */);
+    } else {
+      push("${");
+      if (multilines)
+        indent();
+      genNode(e, context);
+      if (multilines)
+        deindent();
+      push("}");
     }
   }
+  push("`");
 }
-function walkBlockDeclarations(block, onIdent) {
-  for (const stmt of block.body) {
-    if (stmt.type === "VariableDeclaration") {
-      if (stmt.declare)
-        continue;
-      for (const decl of stmt.declarations) {
-        for (const id of extractIdentifiers(decl.id)) {
-          onIdent(id);
-        }
-      }
-    } else if (stmt.type === "FunctionDeclaration" || stmt.type === "ClassDeclaration") {
-      if (stmt.declare || !stmt.id)
-        continue;
-      onIdent(stmt.id);
-    } else if (stmt.type === "ForOfStatement" || stmt.type === "ForInStatement" || stmt.type === "ForStatement") {
-      const variable = stmt.type === "ForStatement" ? stmt.init : stmt.left;
-      if (variable && variable.type === "VariableDeclaration") {
-        for (const decl of variable.declarations) {
-          for (const id of extractIdentifiers(decl.id)) {
-            onIdent(id);
-          }
-        }
-      }
+function genIfStatement(node, context) {
+  const { push, indent, deindent } = context;
+  const { test, consequent, alternate } = node;
+  push(`if (`);
+  genNode(test, context);
+  push(`) {`);
+  indent();
+  genNode(consequent, context);
+  deindent();
+  push(`}`);
+  if (alternate) {
+    push(` else `);
+    if (alternate.type === 23) {
+      genIfStatement(alternate, context);
+    } else {
+      push(`{`);
+      indent();
+      genNode(alternate, context);
+      deindent();
+      push(`}`);
     }
   }
 }
-function extractIdentifiers(param, nodes = []) {
-  switch (param.type) {
-    case "Identifier":
-      nodes.push(param);
-      break;
-    case "MemberExpression":
-      let object = param;
-      while (object.type === "MemberExpression") {
-        object = object.object;
-      }
-      nodes.push(object);
-      break;
-    case "ObjectPattern":
-      for (const prop of param.properties) {
-        if (prop.type === "RestElement") {
-          extractIdentifiers(prop.argument, nodes);
-        } else {
-          extractIdentifiers(prop.value, nodes);
-        }
-      }
-      break;
-    case "ArrayPattern":
-      param.elements.forEach((element) => {
-        if (element)
-          extractIdentifiers(element, nodes);
-      });
-      break;
-    case "RestElement":
-      extractIdentifiers(param.argument, nodes);
-      break;
-    case "AssignmentPattern":
-      extractIdentifiers(param.left, nodes);
-      break;
-  }
-  return nodes;
+function genAssignmentExpression(node, context) {
+  genNode(node.left, context);
+  context.push(` = `);
+  genNode(node.right, context);
 }
-function markScopeIdentifier(node, child, knownIds) {
-  const { name } = child;
-  if (node.scopeIds && node.scopeIds.has(name)) {
-    return;
-  }
-  if (name in knownIds) {
-    knownIds[name]++;
-  } else {
-    knownIds[name] = 1;
-  }
-  (node.scopeIds || (node.scopeIds = /* @__PURE__ */ new Set())).add(name);
+function genSequenceExpression(node, context) {
+  context.push(`(`);
+  genNodeList(node.expressions, context);
+  context.push(`)`);
 }
-const isFunctionType = (node) => {
-  return /Function(?:Expression|Declaration)$|Method$/.test(node.type);
-};
-const isStaticProperty = (node) => node && (node.type === "ObjectProperty" || node.type === "ObjectMethod") && !node.computed;
-const isStaticPropertyKey = (node, parent) => isStaticProperty(parent) && parent.key === node;
-function isReferenced(node, parent, grandparent) {
-  switch (parent.type) {
-    case "MemberExpression":
-    case "OptionalMemberExpression":
-      if (parent.property === node) {
-        return !!parent.computed;
-      }
-      return parent.object === node;
-    case "JSXMemberExpression":
-      return parent.object === node;
-    case "VariableDeclarator":
-      return parent.init === node;
-    case "ArrowFunctionExpression":
-      return parent.body === node;
-    case "PrivateName":
-      return false;
-    case "ClassMethod":
-    case "ClassPrivateMethod":
-    case "ObjectMethod":
-      if (parent.key === node) {
-        return !!parent.computed;
-      }
-      return false;
-    case "ObjectProperty":
-      if (parent.key === node) {
-        return !!parent.computed;
-      }
-      return !grandparent || grandparent.type !== "ObjectPattern";
-    case "ClassProperty":
-      if (parent.key === node) {
-        return !!parent.computed;
-      }
-      return true;
-    case "ClassPrivateProperty":
-      return parent.key !== node;
-    case "ClassDeclaration":
-    case "ClassExpression":
-      return parent.superClass === node;
-    case "AssignmentExpression":
-      return parent.right === node;
-    case "AssignmentPattern":
-      return parent.right === node;
-    case "LabeledStatement":
-      return false;
-    case "CatchClause":
-      return false;
-    case "RestElement":
-      return false;
-    case "BreakStatement":
-    case "ContinueStatement":
-      return false;
-    case "FunctionDeclaration":
-    case "FunctionExpression":
-      return false;
-    case "ExportNamespaceSpecifier":
-    case "ExportDefaultSpecifier":
-      return false;
-    case "ExportSpecifier":
-      if (grandparent == null ? void 0 : grandparent.source) {
-        return false;
-      }
-      return parent.local === node;
-    case "ImportDefaultSpecifier":
-    case "ImportNamespaceSpecifier":
-    case "ImportSpecifier":
-      return false;
-    case "ImportAttribute":
-      return false;
-    case "JSXAttribute":
-      return false;
-    case "ObjectPattern":
-    case "ArrayPattern":
-      return false;
-    case "MetaProperty":
-      return false;
-    case "ObjectTypeProperty":
-      return parent.key !== node;
-    case "TSEnumMember":
-      return parent.id !== node;
-    case "TSPropertySignature":
-      if (parent.key === node) {
-        return !!parent.computed;
-      }
-      return true;
+function genReturnStatement({ returns }, context) {
+  context.push(`return `);
+  if (isArray(returns)) {
+    genNodeListAsArray(returns, context);
+  } else {
+    genNode(returns, context);
   }
-  return true;
 }
-const TS_NODE_TYPES = [
-  "TSAsExpression",
-  // foo as number
-  "TSTypeAssertion",
-  // (<number>foo)
-  "TSNonNullExpression",
-  // foo!
-  "TSInstantiationExpression",
-  // foo<string>
-  "TSSatisfiesExpression"
-  // foo satisfies T
-];
 
 const isLiteralWhitelisted = /* @__PURE__ */ makeMap("true,false,null,this");
 const constantBailRE = /\w\s*\(|\.[^\d]/;
@@ -16745,7 +17057,11 @@ function processExpression(node, context, asParams = false, asRawStatements = fa
   };
   const rawExp = node.content;
   const bailConstant = constantBailRE.test(rawExp);
-  if (isSimpleIdentifier(rawExp)) {
+  let ast = node.ast;
+  if (ast === false) {
+    return node;
+  }
+  if (ast === null || !ast && isSimpleIdentifier(rawExp)) {
     const isScopeVarReference = context.identifiers[rawExp];
     const isAllowedGlobal = isGloballyAllowed(rawExp);
     const isLiteral = isLiteralWhitelisted(rawExp);
@@ -16763,22 +17079,23 @@ function processExpression(node, context, asParams = false, asRawStatements = fa
     }
     return node;
   }
-  let ast;
-  const source = asRawStatements ? ` ${rawExp} ` : `(${rawExp})${asParams ? `=>{}` : ``}`;
-  try {
-    ast = parser.parse(source, {
-      plugins: context.expressionPlugins
-    }).program;
-  } catch (e) {
-    context.onError(
-      createCompilerError(
-        45,
-        node.loc,
-        void 0,
-        e.message
-      )
-    );
-    return node;
+  if (!ast) {
+    const source = asRawStatements ? ` ${rawExp} ` : `(${rawExp})${asParams ? `=>{}` : ``}`;
+    try {
+      ast = parser.parse(source, {
+        plugins: context.expressionPlugins
+      }).program;
+    } catch (e) {
+      context.onError(
+        createCompilerError(
+          45,
+          node.loc,
+          void 0,
+          e.message
+        )
+      );
+      return node;
+    }
   }
   const ids = [];
   const parentStack = [];
@@ -16821,15 +17138,15 @@ function processExpression(node, context, asParams = false, asRawStatements = fa
     if (leadingText.length || id.prefix) {
       children.push(leadingText + (id.prefix || ``));
     }
-    const source2 = rawExp.slice(start, end);
+    const source = rawExp.slice(start, end);
     children.push(
       createSimpleExpression(
         id.name,
         false,
         {
-          start: advancePositionWithClone(node.loc.start, source2, start),
-          end: advancePositionWithClone(node.loc.start, source2, end),
-          source: source2
+          start: advancePositionWithClone(node.loc.start, source, start),
+          end: advancePositionWithClone(node.loc.start, source, end),
+          source
         },
         id.isConstant ? 3 : 0
       )
@@ -16841,6 +17158,7 @@ function processExpression(node, context, asParams = false, asRawStatements = fa
   let ret;
   if (children.length) {
     ret = createCompoundExpression(children, node.loc);
+    ret.ast = ast;
   } else {
     ret = node;
     ret.constType = bailConstant ? 0 : 3;
@@ -17800,6 +18118,10 @@ function resolveSetupReference(name, context) {
       `${context.helperString(UNREF)}(${fromMaybeRef})`
     ) : `$setup[${JSON.stringify(fromMaybeRef)}]`;
   }
+  const fromProps = checkType("props");
+  if (fromProps) {
+    return `${context.helperString(UNREF)}(${context.inline ? "__props" : "$props"}[${JSON.stringify(fromProps)}])`;
+  }
 }
 function buildProps(node, context, props = node.props, isComponent, isDynamicComponent, ssr = false) {
   const { tag, loc: elementLoc, children } = node;
@@ -17840,6 +18162,9 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
       if (isEventHandler && isReservedProp(name)) {
         hasVnodeHook = true;
       }
+      if (isEventHandler && value.type === 14) {
+        value = value.arguments[0];
+      }
       if (value.type === 20 || (value.type === 4 || value.type === 8) && getConstantType(value, context) > 0) {
         return;
       }
@@ -18307,9 +18632,7 @@ const transformOn$1 = (dir, node, context, augmentor) => {
     if (arg.isStatic) {
       let rawName = arg.content;
       if (rawName.startsWith("vnode")) {
-        context.onWarn(
-          createCompilerError(51, arg.loc)
-        );
+        context.onError(createCompilerError(51, arg.loc));
       }
       if (rawName.startsWith("vue:")) {
         rawName = `vnode-${rawName.slice(4)}`;
@@ -18848,7 +19171,10 @@ function baseCompile(source, options = {}) {
   if (options.scopeId && !isModuleMode) {
     onError(createCompilerError(50));
   }
-  const ast = isString(source) ? baseParse(source, options) : source;
+  const resolvedOptions = extend({}, options, {
+    prefixIdentifiers
+  });
+  const ast = isString(source) ? baseParse(source, resolvedOptions) : source;
   const [nodeTransforms, directiveTransforms] = getBaseTransformPreset(prefixIdentifiers);
   if (options.isTS) {
     const { expressionPlugins } = options;
@@ -18858,8 +19184,7 @@ function baseCompile(source, options = {}) {
   }
   transform(
     ast,
-    extend({}, options, {
-      prefixIdentifiers,
+    extend({}, resolvedOptions, {
       nodeTransforms: [
         ...nodeTransforms,
         ...options.nodeTransforms || []
@@ -18873,12 +19198,7 @@ function baseCompile(source, options = {}) {
       )
     })
   );
-  return generate(
-    ast,
-    extend({}, options, {
-      prefixIdentifiers
-    })
-  );
+  return generate(ast, resolvedOptions);
 }
 
 const noopDirectiveTransform = () => ({ props: [] });
@@ -18909,7 +19229,7 @@ registerRuntimeHelpers({
 const parserOptions = {
   parseMode: "html",
   isVoidTag,
-  isNativeTag: (tag) => isHTMLTag(tag) || isSVGTag(tag),
+  isNativeTag: (tag) => isHTMLTag(tag) || isSVGTag(tag) || isMathMLTag(tag),
   isPreTag: (tag) => tag === "pre",
   decodeEntities: void 0,
   isBuiltInComponent: (tag) => {