@vue/runtime-dom 3.5.21 → 3.5.22

package/dist/runtime-dom.cjs.js

@@ -1,5 +1,5 @@
 /**
-* @vue/runtime-dom v3.5.21
+* @vue/runtime-dom v3.5.22
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -217,11 +217,11 @@ function resolveTransitionProps(rawProps) {
       const resolve = () => finishLeave(el, done);
       addTransitionClass(el, leaveFromClass);
       if (!el._enterCancelled) {
-        forceReflow();
+        forceReflow(el);
         addTransitionClass(el, leaveActiveClass);
       } else {
         addTransitionClass(el, leaveActiveClass);
-        forceReflow();
+        forceReflow(el);
       }
       nextFrame(() => {
         if (!el._isLeaving) {
@@ -367,8 +367,9 @@ function toMs(s) {
   if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
 }
-function forceReflow() {
-  return document.body.offsetHeight;
+function forceReflow(el) {
+  const targetDocument = el ? el.ownerDocument : document;
+  return targetDocument.body.offsetHeight;
 }
 
 function patchClass(el, value, isSVG) {
@@ -813,7 +814,11 @@ class VueElement extends BaseClass {
         );
       }
       if (_def.shadowRoot !== false) {
-        this.attachShadow({ mode: "open" });
+        this.attachShadow(
+          shared.extend({}, _def.shadowRootOptions, {
+            mode: "open"
+          })
+        );
         this._root = this.shadowRoot;
       } else {
         this._root = this;
@@ -873,9 +878,18 @@ class VueElement extends BaseClass {
         this._app && this._app.unmount();
         if (this._instance) this._instance.ce = void 0;
         this._app = this._instance = null;
+        if (this._teleportTargets) {
+          this._teleportTargets.clear();
+          this._teleportTargets = void 0;
+        }
       }
     });
   }
+  _processMutations(mutations) {
+    for (const m of mutations) {
+      this._setAttr(m.attributeName);
+    }
+  }
   /**
    * resolve inner component definition (handle possible async component)
    */
@@ -886,11 +900,7 @@ class VueElement extends BaseClass {
     for (let i = 0; i < this.attributes.length; i++) {
       this._setAttr(this.attributes[i].name);
     }
-    this._ob = new MutationObserver((mutations) => {
-      for (const m of mutations) {
-        this._setAttr(m.attributeName);
-      }
-    });
+    this._ob = new MutationObserver(this._processMutations.bind(this));
     this._ob.observe(this, { attributes: true });
     const resolve = (def, isAsync = false) => {
       this._resolved = true;
@@ -1006,7 +1016,10 @@ class VueElement extends BaseClass {
       }
       if (shouldReflect) {
         const ob = this._ob;
-        ob && ob.disconnect();
+        if (ob) {
+          this._processMutations(ob.takeRecords());
+          ob.disconnect();
+        }
         if (val === true) {
           this.setAttribute(shared.hyphenate(key), "");
         } else if (typeof val === "string" || typeof val === "number") {
@@ -1110,7 +1123,7 @@ class VueElement extends BaseClass {
    * Only called when shadowRoot is false
    */
   _renderSlots() {
-    const outlets = (this._teleportTarget || this).querySelectorAll("slot");
+    const outlets = this._getSlots();
     const scopeId = this._instance.type.__scopeId;
     for (let i = 0; i < outlets.length; i++) {
       const o = outlets[i];
@@ -1136,6 +1149,19 @@ class VueElement extends BaseClass {
       parent.removeChild(o);
     }
   }
+  /**
+   * @internal
+   */
+  _getSlots() {
+    const roots = [this];
+    if (this._teleportTargets) {
+      roots.push(...this._teleportTargets);
+    }
+    return roots.reduce((res, i) => {
+      res.push(...Array.from(i.querySelectorAll("slot")));
+      return res;
+    }, []);
+  }
   /**
    * @internal
    */
@@ -1237,7 +1263,7 @@ const TransitionGroupImpl = /* @__PURE__ */ decorate({
       prevChildren.forEach(callPendingCbs);
       prevChildren.forEach(recordPosition);
       const movedChildren = prevChildren.filter(applyTranslation);
-      forceReflow();
+      forceReflow(instance.vnode.el);
       movedChildren.forEach((c) => {
         const el = c.el;
         const style = el.style;

package/dist/runtime-dom.cjs.prod.js

@@ -1,5 +1,5 @@
 /**
-* @vue/runtime-dom v3.5.21
+* @vue/runtime-dom v3.5.22
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -216,11 +216,11 @@ function resolveTransitionProps(rawProps) {
       const resolve = () => finishLeave(el, done);
       addTransitionClass(el, leaveFromClass);
       if (!el._enterCancelled) {
-        forceReflow();
+        forceReflow(el);
         addTransitionClass(el, leaveActiveClass);
       } else {
         addTransitionClass(el, leaveActiveClass);
-        forceReflow();
+        forceReflow(el);
       }
       nextFrame(() => {
         if (!el._isLeaving) {
@@ -363,8 +363,9 @@ function toMs(s) {
   if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
 }
-function forceReflow() {
-  return document.body.offsetHeight;
+function forceReflow(el) {
+  const targetDocument = el ? el.ownerDocument : document;
+  return targetDocument.body.offsetHeight;
 }
 
 function patchClass(el, value, isSVG) {
@@ -780,7 +781,11 @@ class VueElement extends BaseClass {
       this._root = this.shadowRoot;
     } else {
       if (_def.shadowRoot !== false) {
-        this.attachShadow({ mode: "open" });
+        this.attachShadow(
+          shared.extend({}, _def.shadowRootOptions, {
+            mode: "open"
+          })
+        );
         this._root = this.shadowRoot;
       } else {
         this._root = this;
@@ -840,9 +845,18 @@ class VueElement extends BaseClass {
         this._app && this._app.unmount();
         if (this._instance) this._instance.ce = void 0;
         this._app = this._instance = null;
+        if (this._teleportTargets) {
+          this._teleportTargets.clear();
+          this._teleportTargets = void 0;
+        }
       }
     });
   }
+  _processMutations(mutations) {
+    for (const m of mutations) {
+      this._setAttr(m.attributeName);
+    }
+  }
   /**
    * resolve inner component definition (handle possible async component)
    */
@@ -853,11 +867,7 @@ class VueElement extends BaseClass {
     for (let i = 0; i < this.attributes.length; i++) {
       this._setAttr(this.attributes[i].name);
     }
-    this._ob = new MutationObserver((mutations) => {
-      for (const m of mutations) {
-        this._setAttr(m.attributeName);
-      }
-    });
+    this._ob = new MutationObserver(this._processMutations.bind(this));
     this._ob.observe(this, { attributes: true });
     const resolve = (def, isAsync = false) => {
       this._resolved = true;
@@ -964,7 +974,10 @@ class VueElement extends BaseClass {
       }
       if (shouldReflect) {
         const ob = this._ob;
-        ob && ob.disconnect();
+        if (ob) {
+          this._processMutations(ob.takeRecords());
+          ob.disconnect();
+        }
         if (val === true) {
           this.setAttribute(shared.hyphenate(key), "");
         } else if (typeof val === "string" || typeof val === "number") {
@@ -1043,7 +1056,7 @@ class VueElement extends BaseClass {
    * Only called when shadowRoot is false
    */
   _renderSlots() {
-    const outlets = (this._teleportTarget || this).querySelectorAll("slot");
+    const outlets = this._getSlots();
     const scopeId = this._instance.type.__scopeId;
     for (let i = 0; i < outlets.length; i++) {
       const o = outlets[i];
@@ -1069,6 +1082,19 @@ class VueElement extends BaseClass {
       parent.removeChild(o);
     }
   }
+  /**
+   * @internal
+   */
+  _getSlots() {
+    const roots = [this];
+    if (this._teleportTargets) {
+      roots.push(...this._teleportTargets);
+    }
+    return roots.reduce((res, i) => {
+      res.push(...Array.from(i.querySelectorAll("slot")));
+      return res;
+    }, []);
+  }
   /**
    * @internal
    */
@@ -1147,7 +1173,7 @@ const TransitionGroupImpl = /* @__PURE__ */ decorate({
       prevChildren.forEach(callPendingCbs);
       prevChildren.forEach(recordPosition);
       const movedChildren = prevChildren.filter(applyTranslation);
-      forceReflow();
+      forceReflow(instance.vnode.el);
       movedChildren.forEach((c) => {
         const el = c.el;
         const style = el.style;

package/dist/runtime-dom.d.ts

@@ -92,6 +92,7 @@ export type VueElementConstructor<P = {}> = {
 export interface CustomElementOptions {
     styles?: string[];
     shadowRoot?: boolean;
+    shadowRootOptions?: Omit<ShadowRootInit, 'mode'>;
     nonce?: string;
     configureApp?: (app: App) => void;
 }
@@ -148,6 +149,7 @@ export declare class VueElement extends BaseClass implements ComponentCustomElem
     private _setParent;
     private _inheritParentContext;
     disconnectedCallback(): void;
+    private _processMutations;
     /**
      * resolve inner component definition (handle possible async component)
      */
@@ -496,7 +498,6 @@ export interface DataHTMLAttributes extends HTMLAttributes {
 export interface DetailsHTMLAttributes extends HTMLAttributes {
     name?: string | undefined;
     open?: Booleanish | undefined;
-    onToggle?: ((payload: ToggleEvent) => void) | undefined;
 }
 export interface DelHTMLAttributes extends HTMLAttributes {
     cite?: string | undefined;
@@ -505,6 +506,7 @@ export interface DelHTMLAttributes extends HTMLAttributes {
 export interface DialogHTMLAttributes extends HTMLAttributes {
     open?: Booleanish | undefined;
     onClose?: ((payload: Event) => void) | undefined;
+    onCancel?: ((payload: Event) => void) | undefined;
 }
 export interface EmbedHTMLAttributes extends HTMLAttributes {
     height?: Numberish | undefined;
@@ -605,6 +607,7 @@ export interface InputHTMLAttributes extends HTMLAttributes {
     type?: InputTypeHTMLAttribute | undefined;
     value?: any;
     width?: Numberish | undefined;
+    onCancel?: ((payload: Event) => void) | undefined;
 }
 export interface KeygenHTMLAttributes extends HTMLAttributes {
     autofocus?: Booleanish | undefined;
@@ -1282,18 +1285,18 @@ export interface Events {
     onBlur: FocusEvent;
     onChange: Event;
     onBeforeinput: InputEvent;
-    onInput: Event;
+    onFormdata: FormDataEvent;
+    onInput: InputEvent;
     onReset: Event;
     onSubmit: SubmitEvent;
     onInvalid: Event;
+    onFullscreenchange: Event;
+    onFullscreenerror: Event;
     onLoad: Event;
     onError: Event;
     onKeydown: KeyboardEvent;
     onKeypress: KeyboardEvent;
     onKeyup: KeyboardEvent;
-    onAuxclick: PointerEvent;
-    onClick: PointerEvent;
-    onContextmenu: PointerEvent;
     onDblclick: MouseEvent;
     onMousedown: MouseEvent;
     onMouseenter: MouseEvent;
@@ -1331,6 +1334,11 @@ export interface Events {
     onTouchend: TouchEvent;
     onTouchmove: TouchEvent;
     onTouchstart: TouchEvent;
+    onAuxclick: PointerEvent;
+    onClick: PointerEvent;
+    onContextmenu: PointerEvent;
+    onGotpointercapture: PointerEvent;
+    onLostpointercapture: PointerEvent;
     onPointerdown: PointerEvent;
     onPointermove: PointerEvent;
     onPointerup: PointerEvent;
@@ -1339,11 +1347,17 @@ export interface Events {
     onPointerleave: PointerEvent;
     onPointerover: PointerEvent;
     onPointerout: PointerEvent;
+    onBeforetoggle: ToggleEvent;
+    onToggle: ToggleEvent;
     onWheel: WheelEvent;
+    onAnimationcancel: AnimationEvent;
     onAnimationstart: AnimationEvent;
     onAnimationend: AnimationEvent;
     onAnimationiteration: AnimationEvent;
+    onSecuritypolicyviolation: SecurityPolicyViolationEvent;
+    onTransitioncancel: TransitionEvent;
     onTransitionend: TransitionEvent;
+    onTransitionrun: TransitionEvent;
     onTransitionstart: TransitionEvent;
 }
 type EventHandlers<E> = {
@@ -1365,10 +1379,9 @@ export type NativeElements = {
  *
  * To enable proper types, add `"dom"` to `"lib"` in your `tsconfig.json`.
  */
-type DomStub = {};
 type DomType<T> = typeof globalThis extends {
     window: unknown;
-} ? T : DomStub;
+} ? T : never;
 declare module '@vue/reactivity' {
     interface RefUnwrapBailTypes {
         runtimeDOMBailTypes: DomType<Node | Window>;

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

@@ -1,5 +1,5 @@
 /**
-* @vue/runtime-dom v3.5.21
+* @vue/runtime-dom v3.5.22
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -1142,7 +1142,7 @@ function iterator(self, method, wrapValue) {
     iter._next = iter.next;
     iter.next = () => {
       const result = iter._next();
-      if (result.value) {
+      if (!result.done) {
         result.value = wrapValue(result.value);
       }
       return result;
@@ -1269,7 +1269,8 @@ class BaseReactiveHandler {
       return res;
     }
     if (isRef(res)) {
-      return targetIsArray && isIntegerKey(key) ? res : res.value;
+      const value = targetIsArray && isIntegerKey(key) ? res : res.value;
+      return isReadonly2 && isObject(value) ? readonly(value) : value;
     }
     if (isObject(res)) {
       return isReadonly2 ? readonly(res) : reactive(res);
@@ -2619,14 +2620,11 @@ function checkRecursiveUpdates(seen, fn) {
 let isHmrUpdating = false;
 const hmrDirtyComponents = /* @__PURE__ */ new Map();
 {
-  const g = getGlobalThis();
-  if (!g.__VUE_HMR_RUNTIME__) {
-    g.__VUE_HMR_RUNTIME__ = {
-      createRecord: tryWrap(createRecord),
-      rerender: tryWrap(rerender),
-      reload: tryWrap(reload)
-    };
-  }
+  getGlobalThis().__VUE_HMR_RUNTIME__ = {
+    createRecord: tryWrap(createRecord),
+    rerender: tryWrap(rerender),
+    reload: tryWrap(reload)
+  };
 }
 const map = /* @__PURE__ */ new Map();
 function registerHMR(instance) {
@@ -2993,9 +2991,6 @@ const TeleportImpl = {
       insert(mainAnchor, container, anchor);
       const mount = (container2, anchor2) => {
         if (shapeFlag & 16) {
-          if (parentComponent && parentComponent.isCE) {
-            parentComponent.ce._teleportTarget = container2;
-          }
           mountChildren(
             children,
             container2,
@@ -3017,6 +3012,9 @@ const TeleportImpl = {
           } else if (namespace !== "mathml" && isTargetMathML(target)) {
             namespace = "mathml";
           }
+          if (parentComponent && parentComponent.isCE) {
+            (parentComponent.ce._teleportTargets || (parentComponent.ce._teleportTargets = /* @__PURE__ */ new Set())).add(target);
+          }
           if (!disabled) {
             mount(target, targetAnchor);
             updateCssVars(n2, false);
@@ -5182,12 +5180,13 @@ function createSlots(slots, dynamicSlots) {
 
 function renderSlot(slots, name, props = {}, fallback, noSlotted) {
   if (currentRenderingInstance.ce || currentRenderingInstance.parent && isAsyncWrapper(currentRenderingInstance.parent) && currentRenderingInstance.parent.ce) {
+    const hasProps = Object.keys(props).length > 0;
     if (name !== "default") props.name = name;
     return openBlock(), createBlock(
       Fragment,
       null,
       [createVNode("slot", props, fallback && fallback())],
-      64
+      hasProps ? -2 : 64
     );
   }
   let slot = slots[name];
@@ -10362,31 +10361,28 @@ const computed = (getterOrOptions, debugOptions) => {
 };
 
 function h(type, propsOrChildren, children) {
-  const doCreateVNode = (type2, props, children2) => {
+  try {
     setBlockTracking(-1);
-    try {
-      return createVNode(type2, props, children2);
-    } finally {
-      setBlockTracking(1);
-    }
-  };
-  const l = arguments.length;
-  if (l === 2) {
-    if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
-      if (isVNode(propsOrChildren)) {
-        return doCreateVNode(type, null, [propsOrChildren]);
+    const l = arguments.length;
+    if (l === 2) {
+      if (isObject(propsOrChildren) && !isArray(propsOrChildren)) {
+        if (isVNode(propsOrChildren)) {
+          return createVNode(type, null, [propsOrChildren]);
+        }
+        return createVNode(type, propsOrChildren);
+      } else {
+        return createVNode(type, null, propsOrChildren);
       }
-      return doCreateVNode(type, propsOrChildren);
     } else {
-      return doCreateVNode(type, null, propsOrChildren);
-    }
-  } else {
-    if (l > 3) {
-      children = Array.prototype.slice.call(arguments, 2);
-    } else if (l === 3 && isVNode(children)) {
-      children = [children];
+      if (l > 3) {
+        children = Array.prototype.slice.call(arguments, 2);
+      } else if (l === 3 && isVNode(children)) {
+        children = [children];
+      }
+      return createVNode(type, propsOrChildren, children);
     }
-    return doCreateVNode(type, propsOrChildren, children);
+  } finally {
+    setBlockTracking(1);
   }
 }
 
@@ -10596,7 +10592,7 @@ function isMemoSame(cached, memo) {
   return true;
 }
 
-const version = "3.5.21";
+const version = "3.5.22";
 const warn = warn$1 ;
 const ErrorTypeStrings = ErrorTypeStrings$1 ;
 const devtools = devtools$1 ;
@@ -10825,11 +10821,11 @@ function resolveTransitionProps(rawProps) {
       const resolve = () => finishLeave(el, done);
       addTransitionClass(el, leaveFromClass);
       if (!el._enterCancelled) {
-        forceReflow();
+        forceReflow(el);
         addTransitionClass(el, leaveActiveClass);
       } else {
         addTransitionClass(el, leaveActiveClass);
-        forceReflow();
+        forceReflow(el);
       }
       nextFrame(() => {
         if (!el._isLeaving) {
@@ -10975,8 +10971,9 @@ function toMs(s) {
   if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
 }
-function forceReflow() {
-  return document.body.offsetHeight;
+function forceReflow(el) {
+  const targetDocument = el ? el.ownerDocument : document;
+  return targetDocument.body.offsetHeight;
 }
 
 function patchClass(el, value, isSVG) {
@@ -11489,7 +11486,11 @@ class VueElement extends BaseClass {
         );
       }
       if (_def.shadowRoot !== false) {
-        this.attachShadow({ mode: "open" });
+        this.attachShadow(
+          extend({}, _def.shadowRootOptions, {
+            mode: "open"
+          })
+        );
         this._root = this.shadowRoot;
       } else {
         this._root = this;
@@ -11549,9 +11550,18 @@ class VueElement extends BaseClass {
         this._app && this._app.unmount();
         if (this._instance) this._instance.ce = void 0;
         this._app = this._instance = null;
+        if (this._teleportTargets) {
+          this._teleportTargets.clear();
+          this._teleportTargets = void 0;
+        }
       }
     });
   }
+  _processMutations(mutations) {
+    for (const m of mutations) {
+      this._setAttr(m.attributeName);
+    }
+  }
   /**
    * resolve inner component definition (handle possible async component)
    */
@@ -11562,11 +11572,7 @@ class VueElement extends BaseClass {
     for (let i = 0; i < this.attributes.length; i++) {
       this._setAttr(this.attributes[i].name);
     }
-    this._ob = new MutationObserver((mutations) => {
-      for (const m of mutations) {
-        this._setAttr(m.attributeName);
-      }
-    });
+    this._ob = new MutationObserver(this._processMutations.bind(this));
     this._ob.observe(this, { attributes: true });
     const resolve = (def, isAsync = false) => {
       this._resolved = true;
@@ -11682,7 +11688,10 @@ class VueElement extends BaseClass {
       }
       if (shouldReflect) {
         const ob = this._ob;
-        ob && ob.disconnect();
+        if (ob) {
+          this._processMutations(ob.takeRecords());
+          ob.disconnect();
+        }
         if (val === true) {
           this.setAttribute(hyphenate(key), "");
         } else if (typeof val === "string" || typeof val === "number") {
@@ -11786,7 +11795,7 @@ class VueElement extends BaseClass {
    * Only called when shadowRoot is false
    */
   _renderSlots() {
-    const outlets = (this._teleportTarget || this).querySelectorAll("slot");
+    const outlets = this._getSlots();
     const scopeId = this._instance.type.__scopeId;
     for (let i = 0; i < outlets.length; i++) {
       const o = outlets[i];
@@ -11812,6 +11821,19 @@ class VueElement extends BaseClass {
       parent.removeChild(o);
     }
   }
+  /**
+   * @internal
+   */
+  _getSlots() {
+    const roots = [this];
+    if (this._teleportTargets) {
+      roots.push(...this._teleportTargets);
+    }
+    return roots.reduce((res, i) => {
+      res.push(...Array.from(i.querySelectorAll("slot")));
+      return res;
+    }, []);
+  }
   /**
    * @internal
    */
@@ -11913,7 +11935,7 @@ const TransitionGroupImpl = /* @__PURE__ */ decorate({
       prevChildren.forEach(callPendingCbs);
       prevChildren.forEach(recordPosition);
       const movedChildren = prevChildren.filter(applyTranslation);
-      forceReflow();
+      forceReflow(instance.vnode.el);
       movedChildren.forEach((c) => {
         const el = c.el;
         const style = el.style;