@vue/runtime-dom - npm Package Compare versions

Comparing version 3.5.0-alpha.2 to 3.5.0-alpha.3

dist/runtime-dom.cjs.js

 /**
-* @vue/runtime-dom v3.5.0-alpha.2
+* @vue/runtime-dom v3.5.0-alpha.3
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
@@ -28,3 +28,3 @@ * @license MIT
   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);
+    const el = namespace === "svg" ? doc.createElementNS(svgNS, tag) : namespace === "mathml" ? doc.createElementNS(mathmlNS, tag) : is ? doc.createElement(tag, { is }) : doc.createElement(tag);
     if (tag === "select" && props && props.multiple != null) {
@@ -58,4 +58,3 @@ el.setAttribute("multiple", props.multiple);
         parent.insertBefore(start.cloneNode(true), anchor);
-        if (start === end || !(start = start.nextSibling))
-          break;
+        if (start === end || !(start = start.nextSibling)) break;
       }
@@ -344,4 +343,3 @@ } else {
 function toMs(s) {
-  if (s === "auto")
-    return 0;
+  if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
@@ -384,4 +382,3 @@ }
   updated(el, { value, oldValue }, { transition }) {
-    if (!value === !oldValue)
-      return;
+    if (!value === !oldValue) return;
     if (transition) {
@@ -480,4 +477,3 @@ if (value) {
   } else {
-    if (val == null)
-      val = "";
+    if (val == null) val = "";
     {
@@ -528,3 +524,3 @@ if (semicolonRE.test(val)) {
 const xlinkNS = "http://www.w3.org/1999/xlink";
-function patchAttr(el, key, value, isSVG, instance) {
+function patchAttr(el, key, value, isSVG, instance, isBoolean = shared.isSpecialBooleanAttr(key)) {
   if (isSVG && key.startsWith("xlink:")) {
@@ -537,7 +533,9 @@ if (value == null) {
   } else {
-    const isBoolean = shared.isSpecialBooleanAttr(key);
     if (value == null || isBoolean && !shared.includeBooleanAttr(value)) {
       el.removeAttribute(key);
     } else {
-      el.setAttribute(key, isBoolean ? "" : value);
+      el.setAttribute(
+        key,
+        isBoolean ? "" : shared.isSymbol(value) ? String(value) : value
+      );
     }
@@ -547,8 +545,6 @@ }
 
-function patchDOMProp(el, key, value, prevChildren, parentComponent, parentSuspense, unmountChildren) {
+function patchDOMProp(el, key, value, parentComponent) {
   if (key === "innerHTML" || key === "textContent") {
-    if (prevChildren) {
-      unmountChildren(prevChildren, parentComponent, parentSuspense);
-    }
-    el[key] = value == null ? "" : value;
+    if (value == null) return;
+    el[key] = value;
     return;
@@ -560,3 +556,3 @@ }
     const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
-    const newValue = value == null ? "" : value;
+    const newValue = value == null ? "" : String(value);
     if (oldValue !== newValue || !("_value" in el)) {
@@ -685,3 +681,3 @@ el.value = newValue;
 key.charCodeAt(2) > 96 && key.charCodeAt(2) < 123;
-const patchProp = (el, key, prevValue, nextValue, namespace, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
+const patchProp = (el, key, prevValue, nextValue, namespace, parentComponent) => {
   const isSVG = namespace === "svg";
@@ -697,11 +693,6 @@ if (key === "class") {
   } else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, nextValue, isSVG)) {
-    patchDOMProp(
-      el,
-      key,
-      nextValue,
-      prevChildren,
-      parentComponent,
-      parentSuspense,
-      unmountChildren
-    );
+    patchDOMProp(el, key, nextValue);
+    if (!el.tagName.includes("-") && (key === "value" || key === "checked" || key === "selected")) {
+      patchAttr(el, key, nextValue, isSVG, parentComponent, key !== "value");
+    }
   } else {
@@ -752,4 +743,4 @@ if (key === "true-value") {
 // @__NO_SIDE_EFFECTS__
-function defineCustomElement(options, hydrate2) {
-  const Comp = runtimeCore.defineComponent(options);
+function defineCustomElement(options, extraOptions, hydrate2) {
+  const Comp = runtimeCore.defineComponent(options, extraOptions);
   class VueCustomElement extends VueElement {
@@ -764,4 +755,4 @@ constructor(initialProps) {
 /*! #__NO_SIDE_EFFECTS__ */
-const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options) => {
-  return /* @__PURE__ */ defineCustomElement(options, hydrate);
+const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
+  return /* @__PURE__ */ defineCustomElement(options, extraOptions, hydrate);
 };
@@ -809,8 +800,8 @@ const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
     this._connected = false;
-    if (this._ob) {
-      this._ob.disconnect();
-      this._ob = null;
-    }
     runtimeCore.nextTick(() => {
       if (!this._connected) {
+        if (this._ob) {
+          this._ob.disconnect();
+          this._ob = null;
+        }
         render(null, this.shadowRoot);
@@ -1151,4 +1142,3 @@ this._instance = null;
     addEventListener(el, lazy ? "change" : "input", (e) => {
-      if (e.target.composing)
-        return;
+      if (e.target.composing) return;
       let domValue = el.value;
@@ -1178,6 +1168,5 @@ if (trim) {
   },
-  beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
+  beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
     el[assignKey] = getModelAssigner(vnode);
-    if (el.composing)
-      return;
+    if (el.composing) return;
     const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? shared.looseToNumber(el.value) : el.value;
@@ -1189,3 +1178,3 @@ const newValue = value == null ? "" : value;
     if (document.activeElement === el && el.type !== "range") {
-      if (lazy) {
+      if (lazy && value === oldValue) {
         return;
@@ -1322,4 +1311,3 @@ }
     } else if (shared.looseEqual(getValue(option), value)) {
-      if (el.selectedIndex !== i)
-        el.selectedIndex = i;
+      if (el.selectedIndex !== i) el.selectedIndex = i;
       return;
@@ -1433,4 +1421,3 @@ }
       const guard = modifierGuards[modifiers[i]];
-      if (guard && guard(event, modifiers))
-        return;
+      if (guard && guard(event, modifiers)) return;
     }
@@ -1491,4 +1478,3 @@ return fn(event, ...args);
     const container = normalizeContainer(containerOrSelector);
-    if (!container)
-      return;
+    if (!container) return;
     const component = app._component;
@@ -1495,0 +1481,0 @@ if (!shared.isFunction(component) && !component.render && !component.template) {

dist/runtime-dom.cjs.prod.js

 /**
-* @vue/runtime-dom v3.5.0-alpha.2
+* @vue/runtime-dom v3.5.0-alpha.3
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
@@ -28,3 +28,3 @@ * @license MIT
   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);
+    const el = namespace === "svg" ? doc.createElementNS(svgNS, tag) : namespace === "mathml" ? doc.createElementNS(mathmlNS, tag) : is ? doc.createElement(tag, { is }) : doc.createElement(tag);
     if (tag === "select" && props && props.multiple != null) {
@@ -58,4 +58,3 @@ el.setAttribute("multiple", props.multiple);
         parent.insertBefore(start.cloneNode(true), anchor);
-        if (start === end || !(start = start.nextSibling))
-          break;
+        if (start === end || !(start = start.nextSibling)) break;
       }
@@ -341,4 +340,3 @@ } else {
 function toMs(s) {
-  if (s === "auto")
-    return 0;
+  if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
@@ -381,4 +379,3 @@ }
   updated(el, { value, oldValue }, { transition }) {
-    if (!value === !oldValue)
-      return;
+    if (!value === !oldValue) return;
     if (transition) {
@@ -473,4 +470,3 @@ if (value) {
   } else {
-    if (val == null)
-      val = "";
+    if (val == null) val = "";
     if (name.startsWith("--")) {
@@ -514,3 +510,3 @@ style.setProperty(name, val);
 const xlinkNS = "http://www.w3.org/1999/xlink";
-function patchAttr(el, key, value, isSVG, instance) {
+function patchAttr(el, key, value, isSVG, instance, isBoolean = shared.isSpecialBooleanAttr(key)) {
   if (isSVG && key.startsWith("xlink:")) {
@@ -523,7 +519,9 @@ if (value == null) {
   } else {
-    const isBoolean = shared.isSpecialBooleanAttr(key);
     if (value == null || isBoolean && !shared.includeBooleanAttr(value)) {
       el.removeAttribute(key);
     } else {
-      el.setAttribute(key, isBoolean ? "" : value);
+      el.setAttribute(
+        key,
+        isBoolean ? "" : shared.isSymbol(value) ? String(value) : value
+      );
     }
@@ -533,8 +531,6 @@ }
 
-function patchDOMProp(el, key, value, prevChildren, parentComponent, parentSuspense, unmountChildren) {
+function patchDOMProp(el, key, value, parentComponent) {
   if (key === "innerHTML" || key === "textContent") {
-    if (prevChildren) {
-      unmountChildren(prevChildren, parentComponent, parentSuspense);
-    }
-    el[key] = value == null ? "" : value;
+    if (value == null) return;
+    el[key] = value;
     return;
@@ -546,3 +542,3 @@ }
     const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
-    const newValue = value == null ? "" : value;
+    const newValue = value == null ? "" : String(value);
     if (oldValue !== newValue || !("_value" in el)) {
@@ -655,3 +651,3 @@ el.value = newValue;
 key.charCodeAt(2) > 96 && key.charCodeAt(2) < 123;
-const patchProp = (el, key, prevValue, nextValue, namespace, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
+const patchProp = (el, key, prevValue, nextValue, namespace, parentComponent) => {
   const isSVG = namespace === "svg";
@@ -667,11 +663,6 @@ if (key === "class") {
   } else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, nextValue, isSVG)) {
-    patchDOMProp(
-      el,
-      key,
-      nextValue,
-      prevChildren,
-      parentComponent,
-      parentSuspense,
-      unmountChildren
-    );
+    patchDOMProp(el, key, nextValue);
+    if (!el.tagName.includes("-") && (key === "value" || key === "checked" || key === "selected")) {
+      patchAttr(el, key, nextValue, isSVG, parentComponent, key !== "value");
+    }
   } else {
@@ -722,4 +713,4 @@ if (key === "true-value") {
 // @__NO_SIDE_EFFECTS__
-function defineCustomElement(options, hydrate2) {
-  const Comp = runtimeCore.defineComponent(options);
+function defineCustomElement(options, extraOptions, hydrate2) {
+  const Comp = runtimeCore.defineComponent(options, extraOptions);
   class VueCustomElement extends VueElement {
@@ -734,4 +725,4 @@ constructor(initialProps) {
 /*! #__NO_SIDE_EFFECTS__ */
-const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options) => {
-  return /* @__PURE__ */ defineCustomElement(options, hydrate);
+const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
+  return /* @__PURE__ */ defineCustomElement(options, extraOptions, hydrate);
 };
@@ -774,8 +765,8 @@ const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
     this._connected = false;
-    if (this._ob) {
-      this._ob.disconnect();
-      this._ob = null;
-    }
     runtimeCore.nextTick(() => {
       if (!this._connected) {
+        if (this._ob) {
+          this._ob.disconnect();
+          this._ob = null;
+        }
         render(null, this.shadowRoot);
@@ -1097,4 +1088,3 @@ this._instance = null;
     addEventListener(el, lazy ? "change" : "input", (e) => {
-      if (e.target.composing)
-        return;
+      if (e.target.composing) return;
       let domValue = el.value;
@@ -1124,6 +1114,5 @@ if (trim) {
   },
-  beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
+  beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
     el[assignKey] = getModelAssigner(vnode);
-    if (el.composing)
-      return;
+    if (el.composing) return;
     const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? shared.looseToNumber(el.value) : el.value;
@@ -1135,3 +1124,3 @@ const newValue = value == null ? "" : value;
     if (document.activeElement === el && el.type !== "range") {
-      if (lazy) {
+      if (lazy && value === oldValue) {
         return;
@@ -1265,4 +1254,3 @@ }
     } else if (shared.looseEqual(getValue(option), value)) {
-      if (el.selectedIndex !== i)
-        el.selectedIndex = i;
+      if (el.selectedIndex !== i) el.selectedIndex = i;
       return;
@@ -1376,4 +1364,3 @@ }
       const guard = modifierGuards[modifiers[i]];
-      if (guard && guard(event, modifiers))
-        return;
+      if (guard && guard(event, modifiers)) return;
     }
@@ -1430,4 +1417,3 @@ return fn(event, ...args);
     const container = normalizeContainer(containerOrSelector);
-    if (!container)
-      return;
+    if (!container) return;
     const component = app._component;
@@ -1434,0 +1420,0 @@ if (!shared.isFunction(component) && !component.render && !component.template) {

dist/runtime-dom.d.ts

@@ -1,2 +0,2 @@
-import { BaseTransitionProps, FunctionalComponent, ObjectDirective, Directive, SetupContext, RenderFunction, ComponentObjectPropsOptions, EmitsOptions, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentInjectOptions, SlotsType, Component, ComponentProvideOptions, ExtractPropTypes, EmitsToProps, ComponentOptionsBase, CreateComponentPublicInstanceWithMixins, DefineComponent, RootHydrateFunction, ConcreteComponent, VNodeRef, RootRenderFunction, CreateAppFunction } from '@vue/runtime-core';
+import { BaseTransitionProps, FunctionalComponent, ObjectDirective, Directive, SetupContext, RenderFunction, ComponentOptions, ComponentObjectPropsOptions, EmitsOptions, ComputedOptions, MethodOptions, ComponentOptionsMixin, ComponentInjectOptions, SlotsType, Component, ComponentProvideOptions, ExtractPropTypes, EmitsToProps, ComponentOptionsBase, CreateComponentPublicInstanceWithMixins, DefineComponent, RootHydrateFunction, ConcreteComponent, VNodeRef, RootRenderFunction, CreateAppFunction } from '@vue/runtime-core';
 export * from '@vue/runtime-core';
@@ -107,3 +107,8 @@ import * as CSS from 'csstype';
 };
-export declare function defineCustomElement<Props, RawBindings = object>(setup: (props: Readonly<Props>, ctx: SetupContext) => RawBindings | RenderFunction): VueElementConstructor<Props>;
+export declare function defineCustomElement<Props, RawBindings = object>(setup: (props: Props, ctx: SetupContext) => RawBindings | RenderFunction, options?: Pick<ComponentOptions, 'name' | 'inheritAttrs' | 'emits'> & {
+    props?: (keyof Props)[];
+}): VueElementConstructor<Props>;
+export declare function defineCustomElement<Props, RawBindings = object>(setup: (props: Props, ctx: SetupContext) => RawBindings | RenderFunction, options?: Pick<ComponentOptions, 'name' | 'inheritAttrs' | 'emits'> & {
+    props?: ComponentObjectPropsOptions<Props>;
+}): VueElementConstructor<Props>;
 export declare function defineCustomElement<RuntimePropsOptions extends ComponentObjectPropsOptions = ComponentObjectPropsOptions, PropsKeys extends string = string, RuntimeEmitsOptions extends EmitsOptions = {}, EmitsKeys extends string = string, Data = {}, SetupBindings = {}, Computed extends ComputedOptions = {}, Methods extends MethodOptions = {}, Mixin extends ComponentOptionsMixin = ComponentOptionsMixin, Extends extends ComponentOptionsMixin = ComponentOptionsMixin, InjectOptions extends ComponentInjectOptions = {}, InjectKeys extends string = string, Slots extends SlotsType = {}, LocalComponents extends Record<string, Component> = {}, Directives extends Record<string, Directive> = {}, Exposed extends string = string, Provide extends ComponentProvideOptions = ComponentProvideOptions, InferredProps = string extends PropsKeys ? ComponentObjectPropsOptions extends RuntimePropsOptions ? {} : ExtractPropTypes<RuntimePropsOptions> : {
@@ -468,3 +473,3 @@ [key in PropsKeys]?: any;
     open?: Booleanish;
-    onToggle?: Event;
+    onToggle?: (payload: ToggleEvent) => void;
 }
@@ -1322,3 +1327,3 @@ export interface DelHTMLAttributes extends HTMLAttributes {
 export type ReservedProps = {
-    key?: string | number | symbol;
+    key?: PropertyKey;
     ref?: VNodeRef;
@@ -1325,0 +1330,0 @@ ref_for?: boolean;

dist/runtime-dom.esm-bundler.js

 /**
-* @vue/runtime-dom v3.5.0-alpha.2
+* @vue/runtime-dom v3.5.0-alpha.3
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
@@ -8,3 +8,3 @@ * @license MIT
 export * from '@vue/runtime-core';
-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';
+import { extend, isObject, toNumber, isArray, isString, hyphenate, capitalize, includeBooleanAttr, isSymbol, isSpecialBooleanAttr, isFunction, NOOP, isOn, isModelListener, camelize as camelize$1, EMPTY_OBJ, looseToNumber, looseIndexOf, isSet, looseEqual, invokeArrayFns, isHTMLTag, isSVGTag, isMathMLTag } from '@vue/shared';
 
@@ -26,3 +26,3 @@ const svgNS = "http://www.w3.org/2000/svg";
   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);
+    const el = namespace === "svg" ? doc.createElementNS(svgNS, tag) : namespace === "mathml" ? doc.createElementNS(mathmlNS, tag) : is ? doc.createElement(tag, { is }) : doc.createElement(tag);
     if (tag === "select" && props && props.multiple != null) {
@@ -56,4 +56,3 @@ el.setAttribute("multiple", props.multiple);
         parent.insertBefore(start.cloneNode(true), anchor);
-        if (start === end || !(start = start.nextSibling))
-          break;
+        if (start === end || !(start = start.nextSibling)) break;
       }
@@ -342,4 +341,3 @@ } else {
 function toMs(s) {
-  if (s === "auto")
-    return 0;
+  if (s === "auto") return 0;
   return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
@@ -382,4 +380,3 @@ }
   updated(el, { value, oldValue }, { transition }) {
-    if (!value === !oldValue)
-      return;
+    if (!value === !oldValue) return;
     if (transition) {
@@ -466,4 +463,3 @@ if (value) {
       setVarsOnNode(el, vars);
-      if (el === anchor)
-        break;
+      if (el === anchor) break;
       el = el.nextSibling;
@@ -540,4 +536,3 @@ }
   } else {
-    if (val == null)
-      val = "";
+    if (val == null) val = "";
     if (!!(process.env.NODE_ENV !== "production")) {
@@ -588,3 +583,3 @@ if (semicolonRE.test(val)) {
 const xlinkNS = "http://www.w3.org/1999/xlink";
-function patchAttr(el, key, value, isSVG, instance) {
+function patchAttr(el, key, value, isSVG, instance, isBoolean = isSpecialBooleanAttr(key)) {
   if (isSVG && key.startsWith("xlink:")) {
@@ -597,7 +592,9 @@ if (value == null) {
   } else {
-    const isBoolean = isSpecialBooleanAttr(key);
     if (value == null || isBoolean && !includeBooleanAttr(value)) {
       el.removeAttribute(key);
     } else {
-      el.setAttribute(key, isBoolean ? "" : value);
+      el.setAttribute(
+        key,
+        isBoolean ? "" : isSymbol(value) ? String(value) : value
+      );
     }
@@ -607,8 +604,6 @@ }
 
-function patchDOMProp(el, key, value, prevChildren, parentComponent, parentSuspense, unmountChildren) {
+function patchDOMProp(el, key, value, parentComponent) {
   if (key === "innerHTML" || key === "textContent") {
-    if (prevChildren) {
-      unmountChildren(prevChildren, parentComponent, parentSuspense);
-    }
-    el[key] = value == null ? "" : value;
+    if (value == null) return;
+    el[key] = value;
     return;
@@ -620,3 +615,3 @@ }
     const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
-    const newValue = value == null ? "" : value;
+    const newValue = value == null ? "" : String(value);
     if (oldValue !== newValue || !("_value" in el)) {
@@ -745,3 +740,3 @@ el.value = newValue;
 key.charCodeAt(2) > 96 && key.charCodeAt(2) < 123;
-const patchProp = (el, key, prevValue, nextValue, namespace, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
+const patchProp = (el, key, prevValue, nextValue, namespace, parentComponent) => {
   const isSVG = namespace === "svg";
@@ -757,11 +752,6 @@ if (key === "class") {
   } else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, nextValue, isSVG)) {
-    patchDOMProp(
-      el,
-      key,
-      nextValue,
-      prevChildren,
-      parentComponent,
-      parentSuspense,
-      unmountChildren
-    );
+    patchDOMProp(el, key, nextValue);
+    if (!el.tagName.includes("-") && (key === "value" || key === "checked" || key === "selected")) {
+      patchAttr(el, key, nextValue, isSVG, parentComponent, key !== "value");
+    }
   } else {
@@ -812,4 +802,4 @@ if (key === "true-value") {
 // @__NO_SIDE_EFFECTS__
-function defineCustomElement(options, hydrate2) {
-  const Comp = defineComponent(options);
+function defineCustomElement(options, extraOptions, hydrate2) {
+  const Comp = defineComponent(options, extraOptions);
   class VueCustomElement extends VueElement {
@@ -824,4 +814,4 @@ constructor(initialProps) {
 /*! #__NO_SIDE_EFFECTS__ */
-const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options) => {
-  return /* @__PURE__ */ defineCustomElement(options, hydrate);
+const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
+  return /* @__PURE__ */ defineCustomElement(options, extraOptions, hydrate);
 };
@@ -869,8 +859,8 @@ const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
     this._connected = false;
-    if (this._ob) {
-      this._ob.disconnect();
-      this._ob = null;
-    }
     nextTick(() => {
       if (!this._connected) {
+        if (this._ob) {
+          this._ob.disconnect();
+          this._ob = null;
+        }
         render(null, this.shadowRoot);
@@ -1211,4 +1201,3 @@ this._instance = null;
     addEventListener(el, lazy ? "change" : "input", (e) => {
-      if (e.target.composing)
-        return;
+      if (e.target.composing) return;
       let domValue = el.value;
@@ -1238,6 +1227,5 @@ if (trim) {
   },
-  beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
+  beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
     el[assignKey] = getModelAssigner(vnode);
-    if (el.composing)
-      return;
+    if (el.composing) return;
     const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? looseToNumber(el.value) : el.value;
@@ -1249,3 +1237,3 @@ const newValue = value == null ? "" : value;
     if (document.activeElement === el && el.type !== "range") {
-      if (lazy) {
+      if (lazy && value === oldValue) {
         return;
@@ -1382,4 +1370,3 @@ }
     } else if (looseEqual(getValue(option), value)) {
-      if (el.selectedIndex !== i)
-        el.selectedIndex = i;
+      if (el.selectedIndex !== i) el.selectedIndex = i;
       return;
@@ -1493,4 +1480,3 @@ }
       const guard = modifierGuards[modifiers[i]];
-      if (guard && guard(event, modifiers))
-        return;
+      if (guard && guard(event, modifiers)) return;
     }
@@ -1551,4 +1537,3 @@ return fn(event, ...args);
     const container = normalizeContainer(containerOrSelector);
-    if (!container)
-      return;
+    if (!container) return;
     const component = app._component;
@@ -1555,0 +1540,0 @@ if (!isFunction(component) && !component.render && !component.template) {

package.json

 {
   "name": "@vue/runtime-dom",
-  "version": "3.5.0-alpha.2",
+  "version": "3.5.0-alpha.3",
   "description": "@vue/runtime-dom",
@@ -53,5 +53,6 @@ "main": "index.js",
     "csstype": "^3.1.3",
-    "@vue/shared": "3.5.0-alpha.2",
-    "@vue/runtime-core": "3.5.0-alpha.2"
+    "@vue/shared": "3.5.0-alpha.3",
+    "@vue/reactivity": "3.5.0-alpha.3",
+    "@vue/runtime-core": "3.5.0-alpha.3"
   }
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1095831

increased by1.31%

Lines of code

30054

increased by0.67%

Worsened metrics

Dependency count

4

increased by33.33%

Dependency changes

• + Added@vue/reactivity@3.5.0-alpha.3

• + Added@vue/reactivity@3.5.0-alpha.3(transitive)

• + Added@vue/runtime-core@3.5.0-alpha.3(transitive)

• + Added@vue/shared@3.5.0-alpha.3(transitive)

• - Removed@vue/reactivity@3.5.0-alpha.2(transitive)

• - Removed@vue/runtime-core@3.5.0-alpha.2(transitive)

• - Removed@vue/shared@3.5.0-alpha.2(transitive)

• Updated@vue/runtime-core@3.5.0-alpha.3

• Updated@vue/shared@3.5.0-alpha.3