@vue/runtime-dom 3.4.21 → 3.4.22

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

@@ -1,11 +1,11 @@
 /**
-* @vue/runtime-dom v3.4.21
+* @vue/runtime-dom v3.4.22
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
-import { h, BaseTransition, BaseTransitionPropsValidators, assertNumber, getCurrentInstance, warn, watchPostEffect, onMounted, onUnmounted, Fragment, Static, camelize, callWithAsyncErrorHandling, defineComponent, nextTick, createVNode, useTransitionState, onUpdated, toRaw, getTransitionRawChildren, setTransitionHooks, resolveTransitionHooks, isRuntimeOnly, createRenderer, createHydrationRenderer } from '@vue/runtime-core';
+import { h, BaseTransition, BaseTransitionPropsValidators, assertNumber, getCurrentInstance, warn, onMounted, watchPostEffect, onUnmounted, Fragment, Static, camelize, callWithAsyncErrorHandling, defineComponent, nextTick, createVNode, useTransitionState, onUpdated, toRaw, getTransitionRawChildren, setTransitionHooks, resolveTransitionHooks, isRuntimeOnly, createRenderer, createHydrationRenderer } from '@vue/runtime-core';
 export * from '@vue/runtime-core';
-import { extend, isObject, toNumber, isArray, isString, hyphenate, capitalize, isSpecialBooleanAttr, includeBooleanAttr, isOn, isModelListener, isFunction, camelize as camelize$1, EMPTY_OBJ, looseToNumber, looseIndexOf, isSet, looseEqual, invokeArrayFns, isHTMLTag, isSVGTag, isMathMLTag } from '@vue/shared';
+import { extend, isObject, toNumber, isArray, isString, hyphenate, capitalize, isSpecialBooleanAttr, includeBooleanAttr, isFunction, NOOP, isOn, isModelListener, camelize as camelize$1, EMPTY_OBJ, looseToNumber, looseIndexOf, isSet, looseEqual, invokeArrayFns, isHTMLTag, isSVGTag, isMathMLTag } from '@vue/shared';
 
 const svgNS = "http://www.w3.org/2000/svg";
 const mathmlNS = "http://www.w3.org/1998/Math/MathML";
@@ -430,8 +430,8 @@ function useCssVars(getter) {
     setVarsOnVNode(instance.subTree, vars);
     updateTeleports(vars);
   };
-  watchPostEffect(setVars);
   onMounted(() => {
+    watchPostEffect(setVars);
     const ob = new MutationObserver(setVars);
     ob.observe(instance.subTree.el.parentNode, { childList: true });
     onUnmounted(() => ob.disconnect());
@@ -654,11 +654,14 @@ function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
   const invokers = el[veiKey] || (el[veiKey] = {});
   const existingInvoker = invokers[rawName];
   if (nextValue && existingInvoker) {
-    existingInvoker.value = nextValue;
+    existingInvoker.value = !!(process.env.NODE_ENV !== "production") ? sanitizeEventValue(nextValue, rawName) : nextValue;
   } else {
     const [name, options] = parseName(rawName);
     if (nextValue) {
-      const invoker = invokers[rawName] = createInvoker(nextValue, instance);
+      const invoker = invokers[rawName] = createInvoker(
+        !!(process.env.NODE_ENV !== "production") ? sanitizeEventValue(nextValue, rawName) : nextValue,
+        instance
+      );
       addEventListener(el, name, invoker, options);
     } else if (existingInvoker) {
       removeEventListener(el, name, existingInvoker, options);
@@ -701,6 +704,16 @@ function createInvoker(initialValue, instance) {
   invoker.attached = getNow();
   return invoker;
 }
+function sanitizeEventValue(value, propName) {
+  if (isFunction(value) || isArray(value)) {
+    return value;
+  }
+  warn(
+    `Wrong type passed as event handler to ${propName} - did you forget @ or : in front of your prop?
+Expected function or array of functions, received type ${typeof value}.`
+  );
+  return NOOP;
+}
 function patchStopImmediatePropagation(e, value) {
   if (isArray(value)) {
     const originalStop = e.stopImmediatePropagation;
@@ -708,7 +721,9 @@ function patchStopImmediatePropagation(e, value) {
       originalStop.call(e);
       e._stopped = true;
     };
-    return value.map((fn) => (e2) => !e2._stopped && fn && fn(e2));
+    return value.map(
+      (fn) => (e2) => !e2._stopped && fn && fn(e2)
+    );
   } else {
     return value;
   }
@@ -909,7 +924,7 @@ class VueElement extends BaseClass {
     }
   }
   _setAttr(key) {
-    let value = this.getAttribute(key);
+    let value = this.hasAttribute(key) ? this.getAttribute(key) : void 0;
     const camelKey = camelize$1(key);
     if (this._numberProps && this._numberProps[camelKey]) {
       value = toNumber(value);
@@ -1075,7 +1090,28 @@ const TransitionGroupImpl = {
       const rawProps = toRaw(props);
       const cssTransitionProps = resolveTransitionProps(rawProps);
       let tag = rawProps.tag || Fragment;
-      prevChildren = children;
+      prevChildren = [];
+      if (children) {
+        for (let i = 0; i < children.length; i++) {
+          const child = children[i];
+          if (child.el && child.el instanceof Element) {
+            prevChildren.push(child);
+            setTransitionHooks(
+              child,
+              resolveTransitionHooks(
+                child,
+                cssTransitionProps,
+                state,
+                instance
+              )
+            );
+            positionMap.set(
+              child,
+              child.el.getBoundingClientRect()
+            );
+          }
+        }
+      }
       children = slots.default ? getTransitionRawChildren(slots.default()) : [];
       for (let i = 0; i < children.length; i++) {
         const child = children[i];
@@ -1088,16 +1124,6 @@ const TransitionGroupImpl = {
           warn(`<TransitionGroup> children must be keyed.`);
         }
       }
-      if (prevChildren) {
-        for (let i = 0; i < prevChildren.length; i++) {
-          const child = prevChildren[i];
-          setTransitionHooks(
-            child,
-            resolveTransitionHooks(child, cssTransitionProps, state, instance)
-          );
-          positionMap.set(child, child.el.getBoundingClientRect());
-        }
-      }
       return createVNode(tag, null, children);
     };
   }
@@ -1196,7 +1222,7 @@ const vModelText = {
     el[assignKey] = getModelAssigner(vnode);
     if (el.composing)
       return;
-    const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
+    const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? looseToNumber(el.value) : el.value;
     const newValue = value == null ? "" : value;
     if (elValue === newValue) {
       return;
@@ -1299,14 +1325,14 @@ const vModelSelect = {
   // set value in mounted & updated because <select> relies on its children
   // <option>s.
   mounted(el, { value, modifiers: { number } }) {
-    setSelected(el, value, number);
+    setSelected(el, value);
   },
   beforeUpdate(el, _binding, vnode) {
     el[assignKey] = getModelAssigner(vnode);
   },
   updated(el, { value, modifiers: { number } }) {
     if (!el._assigning) {
-      setSelected(el, value, number);
+      setSelected(el, value);
     }
   }
 };
@@ -1326,9 +1352,7 @@ function setSelected(el, value, number) {
       if (isArrayValue) {
         const optionType = typeof optionValue;
         if (optionType === "string" || optionType === "number") {
-          option.selected = value.includes(
-            number ? looseToNumber(optionValue) : optionValue
-          );
+          option.selected = value.some((v) => String(v) === String(optionValue));
         } else {
           option.selected = looseIndexOf(value, optionValue) > -1;
         }

package/dist/runtime-dom.global.js

@@ -1,11 +1,13 @@
 /**
-* @vue/runtime-dom v3.4.21
+* @vue/runtime-dom v3.4.22
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
 var VueRuntimeDOM = (function (exports) {
   'use strict';
 
+  /*! #__NO_SIDE_EFFECTS__ */
+  // @__NO_SIDE_EFFECTS__
   function makeMap(str, expectsLowerCase) {
     const set = new Set(str.split(","));
     return expectsLowerCase ? (val) => set.has(val.toLowerCase()) : (val) => set.has(val);
@@ -292,7 +294,11 @@ var VueRuntimeDOM = (function (exports) {
   };
   const stringifySymbol = (v, i = "") => {
     var _a;
-    return isSymbol(v) ? `Symbol(${(_a = v.description) != null ? _a : i})` : v;
+    return (
+      // Symbol.description in es2019+ so we need to cast here to pass
+      // the lib: es2016 check
+      isSymbol(v) ? `Symbol(${(_a = v.description) != null ? _a : i})` : v
+    );
   };
 
   function warn$2(msg, ...args) {
@@ -728,6 +734,8 @@ var VueRuntimeDOM = (function (exports) {
     return instrumentations;
   }
   function hasOwnProperty(key) {
+    if (!isSymbol(key))
+      key = String(key);
     const obj = toRaw(this);
     track(obj, "has", key);
     return obj.hasOwnProperty(key);
@@ -1080,23 +1088,16 @@ var VueRuntimeDOM = (function (exports) {
       clear: createReadonlyMethod("clear"),
       forEach: createForEach(true, true)
     };
-    const iteratorMethods = ["keys", "values", "entries", Symbol.iterator];
+    const iteratorMethods = [
+      "keys",
+      "values",
+      "entries",
+      Symbol.iterator
+    ];
     iteratorMethods.forEach((method) => {
-      mutableInstrumentations2[method] = createIterableMethod(
-        method,
-        false,
-        false
-      );
-      readonlyInstrumentations2[method] = createIterableMethod(
-        method,
-        true,
-        false
-      );
-      shallowInstrumentations2[method] = createIterableMethod(
-        method,
-        false,
-        true
-      );
+      mutableInstrumentations2[method] = createIterableMethod(method, false, false);
+      readonlyInstrumentations2[method] = createIterableMethod(method, true, false);
+      shallowInstrumentations2[method] = createIterableMethod(method, false, true);
       shallowReadonlyInstrumentations2[method] = createIterableMethod(
         method,
         true,
@@ -1253,7 +1254,7 @@ var VueRuntimeDOM = (function (exports) {
     return !!(value && value["__v_isShallow"]);
   }
   function isProxy(value) {
-    return isReactive(value) || isReadonly(value);
+    return value ? !!value["__v_raw"] : false;
   }
   function toRaw(observed) {
     const raw = observed && observed["__v_raw"];
@@ -1715,11 +1716,17 @@ getter: `, this.getter);
       }
       return res;
     }
-    const values = [];
-    for (let i = 0; i < fn.length; i++) {
-      values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
+    if (isArray(fn)) {
+      const values = [];
+      for (let i = 0; i < fn.length; i++) {
+        values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
+      }
+      return values;
+    } else {
+      warn$1(
+        `Invalid value type passed to callWithAsyncErrorHandling(): ${typeof fn}`
+      );
     }
-    return values;
   }
   function handleError(err, instance, type, throwInDev = true) {
     const contextVNode = instance ? instance.vnode : null;
@@ -1740,12 +1747,14 @@ getter: `, this.getter);
       }
       const appErrorHandler = instance.appContext.config.errorHandler;
       if (appErrorHandler) {
+        pauseTracking();
         callWithErrorHandling(
           appErrorHandler,
           null,
           10,
           [err, exposedInstance, errorInfo]
         );
+        resetTracking();
         return;
       }
     }
@@ -2121,6 +2130,8 @@ getter: `, this.getter);
       _devtoolsComponentRemoved(component);
     }
   };
+  /*! #__NO_SIDE_EFFECTS__ */
+  // @__NO_SIDE_EFFECTS__
   function createDevtoolsComponentHook(hook) {
     return (component) => {
       emit$1(
@@ -4191,7 +4202,7 @@ If this is a native custom element, make sure to exclude it from component resol
       return () => {
         pendingCacheKey = null;
         if (!slots.default) {
-          return null;
+          return current = null;
         }
         const children = slots.default();
         const rawVNode = children[0];
@@ -4504,6 +4515,9 @@ If this is a native custom element, make sure to exclude it from component resol
   const hasSetupBinding = (state, key) => state !== EMPTY_OBJ && !state.__isScriptSetup && hasOwn(state, key);
   const PublicInstanceProxyHandlers = {
     get({ _: instance }, key) {
+      if (key === "__v_skip") {
+        return true;
+      }
       const { ctx, setupState, data, props, accessCache, type, appContext } = instance;
       if (key === "__isVue") {
         return true;
@@ -5471,10 +5485,10 @@ If you want to remount the same app, move your app creation logic into a factory
     return !!(currentInstance || currentRenderingInstance || currentApp);
   }
 
+  const attrsProto = {};
   function initProps(instance, rawProps, isStateful, isSSR = false) {
     const props = {};
-    const attrs = {};
-    def(attrs, InternalObjectKey, 1);
+    const attrs = Object.create(attrsProto);
     instance.propsDefaults = /* @__PURE__ */ Object.create(null);
     setFullProps(instance, rawProps, props, attrs);
     for (const key in instance.propsOptions[0]) {
@@ -5589,7 +5603,7 @@ If you want to remount the same app, move your app creation logic into a factory
       }
     }
     if (hasAttrsChanged) {
-      trigger(instance, "set", "$attrs");
+      trigger(instance.attrs, "set", "");
     }
     {
       validateProps(rawProps || {}, props, instance);
@@ -5925,7 +5939,7 @@ If you want to remount the same app, move your app creation logic into a factory
       const type = children._;
       if (type) {
         instance.slots = toRaw(children);
-        def(children, "_", type);
+        def(instance.slots, "_", type);
       } else {
         normalizeObjectSlots(
           children,
@@ -5937,7 +5951,6 @@ If you want to remount the same app, move your app creation logic into a factory
         normalizeVNodeSlots(instance, children);
       }
     }
-    def(instance.slots, InternalObjectKey, 1);
   };
   const updateSlots = (instance, children, optimized) => {
     const { vnode, slots } = instance;
@@ -6109,6 +6122,7 @@ If you want to remount the same app, move your app creation logic into a factory
       }
     };
     const hydrateNode = (node, vnode, parentComponent, parentSuspense, slotScopeIds, optimized = false) => {
+      optimized = optimized || !!vnode.dynamicChildren;
       const isFragmentStart = isComment(node) && node.data === "[";
       const onMismatch = () => handleMismatch(
         node,
@@ -8543,7 +8557,6 @@ Server rendered element contains fewer child nodes than client vdom.`
       ...vnodeArgsTransformer ? vnodeArgsTransformer(args, currentRenderingInstance) : args
     );
   };
-  const InternalObjectKey = `__vInternal`;
   const normalizeKey = ({ key }) => key != null ? key : null;
   const normalizeRef = ({
     ref,
@@ -8676,7 +8689,7 @@ Component that was made reactive: `,
   function guardReactiveProps(props) {
     if (!props)
       return null;
-    return isProxy(props) || InternalObjectKey in props ? extend({}, props) : props;
+    return isProxy(props) || Object.getPrototypeOf(props) === attrsProto ? extend({}, props) : props;
   }
   function cloneVNode(vnode, extraProps, mergeRef = false) {
     const { props, ref, patchFlag, children } = vnode;
@@ -8781,7 +8794,7 @@ Component that was made reactive: `,
       } else {
         type = 32;
         const slotFlag = children._;
-        if (!slotFlag && !(InternalObjectKey in children)) {
+        if (!slotFlag) {
           children._ctx = currentRenderingInstance;
         } else if (slotFlag === 3 && currentRenderingInstance) {
           if (currentRenderingInstance.slots._ === 1) {
@@ -9002,7 +9015,7 @@ Component that was made reactive: `,
       }
     }
     instance.accessCache = /* @__PURE__ */ Object.create(null);
-    instance.proxy = markRaw(new Proxy(instance.ctx, PublicInstanceProxyHandlers));
+    instance.proxy = new Proxy(instance.ctx, PublicInstanceProxyHandlers);
     {
       exposePropsOnRenderContext(instance);
     }
@@ -9134,26 +9147,21 @@ Component that was made reactive: `,
       }
     }
   }
-  function getAttrsProxy(instance) {
-    return instance.attrsProxy || (instance.attrsProxy = new Proxy(
-      instance.attrs,
-      {
-        get(target, key) {
-          markAttrsAccessed();
-          track(instance, "get", "$attrs");
-          return target[key];
-        },
-        set() {
-          warn$1(`setupContext.attrs is readonly.`);
-          return false;
-        },
-        deleteProperty() {
-          warn$1(`setupContext.attrs is readonly.`);
-          return false;
-        }
-      } 
-    ));
-  }
+  const attrsProxyHandlers = {
+    get(target, key) {
+      markAttrsAccessed();
+      track(target, "get", "");
+      return target[key];
+    },
+    set() {
+      warn$1(`setupContext.attrs is readonly.`);
+      return false;
+    },
+    deleteProperty() {
+      warn$1(`setupContext.attrs is readonly.`);
+      return false;
+    }
+  } ;
   function getSlotsProxy(instance) {
     return instance.slotsProxy || (instance.slotsProxy = new Proxy(instance.slots, {
       get(target, key) {
@@ -9187,9 +9195,10 @@ Component that was made reactive: `,
       instance.exposed = exposed || {};
     };
     {
+      let attrsProxy;
       return Object.freeze({
         get attrs() {
-          return getAttrsProxy(instance);
+          return attrsProxy || (attrsProxy = new Proxy(instance.attrs, attrsProxyHandlers));
         },
         get slots() {
           return getSlotsProxy(instance);
@@ -9534,7 +9543,7 @@ Component that was made reactive: `,
     return true;
   }
 
-  const version = "3.4.21";
+  const version = "3.4.22";
   const warn = warn$1 ;
   const ErrorTypeStrings = ErrorTypeStrings$1 ;
   const devtools = devtools$1 ;
@@ -9960,8 +9969,8 @@ Component that was made reactive: `,
       setVarsOnVNode(instance.subTree, vars);
       updateTeleports(vars);
     };
-    watchPostEffect(setVars);
     onMounted(() => {
+      watchPostEffect(setVars);
       const ob = new MutationObserver(setVars);
       ob.observe(instance.subTree.el.parentNode, { childList: true });
       onUnmounted(() => ob.disconnect());
@@ -10184,11 +10193,14 @@ Component that was made reactive: `,
     const invokers = el[veiKey] || (el[veiKey] = {});
     const existingInvoker = invokers[rawName];
     if (nextValue && existingInvoker) {
-      existingInvoker.value = nextValue;
+      existingInvoker.value = sanitizeEventValue(nextValue, rawName) ;
     } else {
       const [name, options] = parseName(rawName);
       if (nextValue) {
-        const invoker = invokers[rawName] = createInvoker(nextValue, instance);
+        const invoker = invokers[rawName] = createInvoker(
+          sanitizeEventValue(nextValue, rawName) ,
+          instance
+        );
         addEventListener(el, name, invoker, options);
       } else if (existingInvoker) {
         removeEventListener(el, name, existingInvoker, options);
@@ -10231,6 +10243,16 @@ Component that was made reactive: `,
     invoker.attached = getNow();
     return invoker;
   }
+  function sanitizeEventValue(value, propName) {
+    if (isFunction(value) || isArray(value)) {
+      return value;
+    }
+    warn(
+      `Wrong type passed as event handler to ${propName} - did you forget @ or : in front of your prop?
+Expected function or array of functions, received type ${typeof value}.`
+    );
+    return NOOP;
+  }
   function patchStopImmediatePropagation(e, value) {
     if (isArray(value)) {
       const originalStop = e.stopImmediatePropagation;
@@ -10238,7 +10260,9 @@ Component that was made reactive: `,
         originalStop.call(e);
         e._stopped = true;
       };
-      return value.map((fn) => (e2) => !e2._stopped && fn && fn(e2));
+      return value.map(
+        (fn) => (e2) => !e2._stopped && fn && fn(e2)
+      );
     } else {
       return value;
     }
@@ -10439,7 +10463,7 @@ Component that was made reactive: `,
       }
     }
     _setAttr(key) {
-      let value = this.getAttribute(key);
+      let value = this.hasAttribute(key) ? this.getAttribute(key) : void 0;
       const camelKey = camelize(key);
       if (this._numberProps && this._numberProps[camelKey]) {
         value = toNumber(value);
@@ -10593,7 +10617,28 @@ Component that was made reactive: `,
         const rawProps = toRaw(props);
         const cssTransitionProps = resolveTransitionProps(rawProps);
         let tag = rawProps.tag || Fragment;
-        prevChildren = children;
+        prevChildren = [];
+        if (children) {
+          for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            if (child.el && child.el instanceof Element) {
+              prevChildren.push(child);
+              setTransitionHooks(
+                child,
+                resolveTransitionHooks(
+                  child,
+                  cssTransitionProps,
+                  state,
+                  instance
+                )
+              );
+              positionMap.set(
+                child,
+                child.el.getBoundingClientRect()
+              );
+            }
+          }
+        }
         children = slots.default ? getTransitionRawChildren(slots.default()) : [];
         for (let i = 0; i < children.length; i++) {
           const child = children[i];
@@ -10606,16 +10651,6 @@ Component that was made reactive: `,
             warn(`<TransitionGroup> children must be keyed.`);
           }
         }
-        if (prevChildren) {
-          for (let i = 0; i < prevChildren.length; i++) {
-            const child = prevChildren[i];
-            setTransitionHooks(
-              child,
-              resolveTransitionHooks(child, cssTransitionProps, state, instance)
-            );
-            positionMap.set(child, child.el.getBoundingClientRect());
-          }
-        }
         return createVNode(tag, null, children);
       };
     }
@@ -10714,7 +10749,7 @@ Component that was made reactive: `,
       el[assignKey] = getModelAssigner(vnode);
       if (el.composing)
         return;
-      const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
+      const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? looseToNumber(el.value) : el.value;
       const newValue = value == null ? "" : value;
       if (elValue === newValue) {
         return;
@@ -10817,14 +10852,14 @@ Component that was made reactive: `,
     // set value in mounted & updated because <select> relies on its children
     // <option>s.
     mounted(el, { value, modifiers: { number } }) {
-      setSelected(el, value, number);
+      setSelected(el, value);
     },
     beforeUpdate(el, _binding, vnode) {
       el[assignKey] = getModelAssigner(vnode);
     },
     updated(el, { value, modifiers: { number } }) {
       if (!el._assigning) {
-        setSelected(el, value, number);
+        setSelected(el, value);
       }
     }
   };
@@ -10844,9 +10879,7 @@ Component that was made reactive: `,
         if (isArrayValue) {
           const optionType = typeof optionValue;
           if (optionType === "string" || optionType === "number") {
-            option.selected = value.includes(
-              number ? looseToNumber(optionValue) : optionValue
-            );
+            option.selected = value.some((v) => String(v) === String(optionValue));
           } else {
             option.selected = looseIndexOf(value, optionValue) > -1;
           }