@vue/runtime-dom 3.6.0-rc.1 → 3.6.0-rc.11

package/dist/runtime-dom.cjs.js

@@ -1,5 +1,5 @@
 /**
-  * @vue/runtime-dom v3.6.0-rc.1
+  * @vue/runtime-dom v3.6.0-rc.11
   * (c) 2018-present Yuxi (Evan) You and Vue contributors
   * @license MIT
   **/
@@ -13,7 +13,7 @@ let _vue_shared = require("@vue/shared");
 let policy = void 0;
 const tt = typeof window !== "undefined" && window.trustedTypes;
 if (tt) try {
-	policy = /* @__PURE__ */ tt.createPolicy("vue", { createHTML: (val) => val });
+	policy = /*@__PURE__*/ tt.createPolicy("vue", { createHTML: (val) => val });
 } catch (e) {
 	(0, _vue_runtime_core.warn)(`Error creating trusted types policy: ${e}`);
 }
@@ -21,7 +21,7 @@ const unsafeToTrustedHTML = policy ? (val) => policy.createHTML(val) : (val) =>
 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 templateContainer = doc && /*@__PURE__*/ doc.createElement("template");
 const nodeOps = {
 	insert: (child, parent, anchor) => {
 		parent.insertBefore(child, anchor || null);
@@ -95,7 +95,7 @@ const DOMTransitionPropsValidators = {
 	leaveActiveClass: String,
 	leaveToClass: String
 };
-const TransitionPropsValidators = /* @__PURE__ */ (0, _vue_shared.extend)({}, _vue_runtime_core.BaseTransitionPropsValidators, DOMTransitionPropsValidators);
+const TransitionPropsValidators = /*@__PURE__*/ (0, _vue_shared.extend)({}, _vue_runtime_core.BaseTransitionPropsValidators, DOMTransitionPropsValidators);
 /**
 * Wrap logic that attaches extra properties to Transition in a function
 * so that it can be annotated as pure
@@ -109,7 +109,7 @@ const decorate$1 = (t) => {
 * DOM Transition is a higher-order-component based on the platform-agnostic
 * base Transition component, with DOM-specific logic.
 */
-const Transition = /* @__PURE__ */ decorate$1((props, { slots }) => (0, _vue_runtime_core.h)(_vue_runtime_core.BaseTransition, resolveTransitionProps(props), slots));
+const Transition = /*@__PURE__*/ decorate$1((props, { slots }) => (0, _vue_runtime_core.h)(_vue_runtime_core.BaseTransition, resolveTransitionProps(props), slots));
 /**
 * #3227 Incoming hooks may be merged into arrays when wrapping Transition
 * with custom HOCs.
@@ -331,14 +331,15 @@ const vShow = {
 	},
 	updated(el, { value, oldValue }, { transition }) {
 		if (!value === !oldValue) return;
-		if (transition) if (value) {
-			transition.beforeEnter(el);
-			setDisplay(el, true);
-			transition.enter(el);
-		} else transition.leave(el, () => {
-			setDisplay(el, false);
-		});
-		else setDisplay(el, value);
+		if (transition) {
+			if (value) {
+				transition.beforeEnter(el);
+				setDisplay(el, true);
+				transition.enter(el);
+			} else transition.leave(el, () => {
+				setDisplay(el, false);
+			});
+		} else setDisplay(el, value);
 	},
 	beforeUnmount(el, { value }) {
 		setDisplay(el, value);
@@ -369,11 +370,13 @@ function patchStyle(el, prev, next) {
 	const isCssString = (0, _vue_shared.isString)(next);
 	let hasControlledDisplay = false;
 	if (next && !isCssString) {
-		if (prev) if (!(0, _vue_shared.isString)(prev)) {
-			for (const key in prev) if (next[key] == null) setStyle(style, key, "");
-		} else for (const prevStyle of prev.split(";")) {
-			const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
-			if (next[key] == null) setStyle(style, key, "");
+		if (prev) {
+			if (!(0, _vue_shared.isString)(prev)) {
+				for (const key in prev) if (next[key] == null) setStyle(style, key, "");
+			} else for (const prevStyle of prev.split(";")) {
+				const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
+				if (next[key] == null) setStyle(style, key, "");
+			}
 		}
 		for (const key in next) {
 			if (key === "display") hasControlledDisplay = true;
@@ -389,7 +392,11 @@ function patchStyle(el, prev, next) {
 			style.cssText = next;
 			hasControlledDisplay = displayRE.test(next);
 		}
-	} else if (prev) el.removeAttribute("style");
+	} else if (prev) {
+		const cssVarText = style[CSS_VAR_TEXT];
+		if (cssVarText) style.cssText = cssVarText;
+		else el.removeAttribute("style");
+	}
 	if (vShowOriginalDisplay in el) {
 		el[vShowOriginalDisplay] = hasControlledDisplay ? style.display : "";
 		if (el[vShowHidden]) style.display = "none";
@@ -402,8 +409,10 @@ function setStyle(style, name, rawVal) {
 	else {
 		const val = rawVal == null ? "" : String(rawVal);
 		if (semicolonRE.test(val)) (0, _vue_runtime_core.warn)(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
-		if (name.startsWith("--")) style.setProperty(name, val);
-		else {
+		if (name.startsWith("--")) {
+			if (importantRE.test(val)) style.setProperty(name, val.replace(importantRE, ""), "important");
+			else style.setProperty(name, val);
+		} else {
 			const prefixed = autoPrefix(style, name);
 			if (importantRE.test(val)) style.setProperty((0, _vue_shared.hyphenate)(prefixed), val.replace(importantRE, ""), "important");
 			else style[prefixed] = val;
@@ -440,9 +449,10 @@ function shouldPreserveTextareaResizeStyle(el, key, prev, next) {
 //#region packages/runtime-dom/src/modules/attrs.ts
 const xlinkNS = "http://www.w3.org/1999/xlink";
 function patchAttr(el, key, value, isSVG, instance, isBoolean = (0, _vue_shared.isSpecialBooleanAttr)(key)) {
-	if (isSVG && key.startsWith("xlink:")) if (value == null) el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
-	else el.setAttributeNS(xlinkNS, key, value);
-	else if (value == null || isBoolean && !(0, _vue_shared.includeBooleanAttr)(value)) el.removeAttribute(key);
+	if (isSVG && key.startsWith("xlink:")) {
+		if (value == null) el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
+		else el.setAttributeNS(xlinkNS, key, value);
+	} else if (value == null || isBoolean && !(0, _vue_shared.includeBooleanAttr)(value)) el.removeAttribute(key);
 	else el.setAttribute(key, isBoolean ? "" : (0, _vue_shared.isSymbol)(value) ? String(value) : value);
 }
 //#endregion
@@ -515,7 +525,7 @@ function parseEventName(name) {
 	return [name[2] === ":" ? name.slice(3) : (0, _vue_shared.hyphenate)(name.slice(2)), options];
 }
 let cachedNow = 0;
-const p = /* @__PURE__ */ Promise.resolve();
+const p = /*@__PURE__*/ Promise.resolve();
 const getNow = () => cachedNow || (p.then(() => cachedNow = 0), cachedNow = Date.now());
 function createInvoker(initialValue, instance) {
 	const invoker = (e) => {
@@ -583,7 +593,7 @@ function shouldSetAsPropForVueCE(el, key) {
 //#endregion
 //#region packages/runtime-dom/src/apiCustomElement.ts
 const REMOVAL = {};
-/* @__NO_SIDE_EFFECTS__ */
+/*@__NO_SIDE_EFFECTS__*/
 function defineCustomElement(options, extraOptions, _createApp) {
 	let Comp = (0, _vue_runtime_core.defineComponent)(options, extraOptions);
 	if ((0, _vue_shared.isPlainObject)(Comp)) Comp = (0, _vue_shared.extend)({}, Comp, extraOptions);
@@ -632,12 +642,14 @@ var VueElementBase = class VueElementBase extends BaseClass {
 			this._parent = parent;
 			break;
 		}
-		if (!this._instance) if (this._resolved) this._mountComponent(this._def);
-		else if (parent && parent._pendingResolve) this._pendingResolve = parent._pendingResolve.then(() => {
-			this._pendingResolve = void 0;
-			this._resolveDef();
-		});
-		else this._resolveDef();
+		if (!this._instance) {
+			if (this._resolved) this._mountComponent(this._def);
+			else if (parent && parent._pendingResolve) this._pendingResolve = parent._pendingResolve.then(() => {
+				this._pendingResolve = void 0;
+				if (this.isConnected) return this._resolveDef();
+			});
+			else this._resolveDef();
+		}
 	}
 	disconnectedCallback() {
 		this._connected = false;
@@ -671,7 +683,7 @@ var VueElementBase = class VueElementBase extends BaseClass {
 	* resolve inner component definition (handle possible async component)
 	*/
 	_resolveDef() {
-		if (this._pendingResolve) return;
+		if (this._pendingResolve) return this._pendingResolve;
 		for (let i = 0; i < this.attributes.length; i++) this._setAttr(this.attributes[i].name);
 		this._ob = new MutationObserver(this._processMutations.bind(this));
 		this._ob.observe(this, { attributes: true });
@@ -701,6 +713,7 @@ var VueElementBase = class VueElementBase extends BaseClass {
 				this._def = def;
 				resolve(def);
 			});
+			return this._pendingResolve;
 		} else resolve(this._def);
 	}
 	_mountComponent(def) {
@@ -739,14 +752,17 @@ var VueElementBase = class VueElementBase extends BaseClass {
 		const { props } = def;
 		const declaredPropKeys = (0, _vue_shared.isArray)(props) ? props : Object.keys(props || {});
 		for (const key of Object.keys(this)) if (key[0] !== "_" && declaredPropKeys.includes(key)) this._setProp(key, this[key]);
-		for (const key of declaredPropKeys.map(_vue_shared.camelize)) Object.defineProperty(this, key, {
-			get() {
-				return this._getProp(key);
-			},
-			set(val) {
-				this._setProp(key, val, true, !this._patching);
-			}
-		});
+		for (const key of declaredPropKeys.map(_vue_shared.camelize)) {
+			if (key in Object.getPrototypeOf(this)) (0, _vue_runtime_core.warn)(`Custom element prop "${key}" conflicts with an existing property on the element and will overwrite it.`);
+			Object.defineProperty(this, key, {
+				get() {
+					return this._getProp(key);
+				},
+				set(val) {
+					this._setProp(key, val, true, !this._patching);
+				}
+			});
+		}
 	}
 	_setAttr(key) {
 		if (key.startsWith("data-v-")) return;
@@ -849,13 +865,11 @@ var VueElementBase = class VueElementBase extends BaseClass {
 	_renderSlots() {
 		const outlets = this._getSlots();
 		const scopeId = this._instance.type.__scopeId;
-		const slotReplacements = /* @__PURE__ */ new Map();
 		for (let i = 0; i < outlets.length; i++) {
 			const o = outlets[i];
 			const slotName = o.getAttribute("name") || "default";
 			const content = this._slots[slotName];
 			const parent = o.parentNode;
-			const replacementNodes = [];
 			if (content) for (const n of content) {
 				if (scopeId && n.nodeType === 1) {
 					const id = scopeId + "-s";
@@ -865,20 +879,10 @@ var VueElementBase = class VueElementBase extends BaseClass {
 					while (child = walker.nextNode()) child.setAttribute(id, "");
 				}
 				parent.insertBefore(n, o);
-				replacementNodes.push(n);
-			}
-			else while (o.firstChild) {
-				const child = o.firstChild;
-				parent.insertBefore(child, o);
-				replacementNodes.push(child);
 			}
+			else while (o.firstChild) parent.insertBefore(o.firstChild, o);
 			parent.removeChild(o);
-			slotReplacements.set(o, {
-				nodes: replacementNodes,
-				usedFallback: !content
-			});
 		}
-		this._updateSlotNodes(slotReplacements);
 	}
 	/**
 	* @internal
@@ -917,7 +921,7 @@ var VueElementBase = class VueElementBase extends BaseClass {
 	* @internal
 	*/
 	_hasShadowRoot() {
-		return this._def.shadowRoot !== false;
+		return this._root !== this;
 	}
 	/**
 	* @internal
@@ -962,10 +966,6 @@ var VueElement = class extends VueElementBase {
 		if (this._instance && this._instance.ce) this._instance.ce = void 0;
 		this._app = this._instance = null;
 	}
-	/**
-	* Only called when shadowRoot is false
-	*/
-	_updateSlotNodes(replacements) {}
 	_createVNode() {
 		const baseProps = {};
 		if (!this.shadowRoot) baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
@@ -1031,7 +1031,7 @@ const decorate = (t) => {
 };
 const TransitionGroup = /* @__PURE__ */ decorate({
 	name: "TransitionGroup",
-	props: /* @__PURE__ */ (0, _vue_shared.extend)({}, TransitionPropsValidators, {
+	props: /*@__PURE__*/ (0, _vue_shared.extend)({}, TransitionPropsValidators, {
 		tag: String,
 		moveClass: String
 	}),
@@ -1162,13 +1162,22 @@ function onCompositionEnd(e) {
 	}
 }
 const assignKey = Symbol("_assign");
+const initialValueKey = Symbol("_initialValue");
 const vModelText = {
 	created(el, { modifiers: { lazy, trim, number } }, vnode) {
+		if (el.parentNode) {
+			if (el.type === "text") el[initialValueKey] = el.defaultValue.replace(/[\r\n]/g, "");
+			else if (el.type === "textarea") el[initialValueKey] = el.defaultValue.replace(/\r\n?/g, "\n");
+		}
 		el[assignKey] = getModelAssigner(vnode);
 		vModelTextInit(el, trim, number || !!(vnode.props && vnode.props.type === "number"), lazy);
 	},
-	mounted(el, { value }) {
-		el.value = value == null ? "" : value;
+	mounted(el, { value, modifiers: { trim, number } }) {
+		const newValue = value == null ? "" : value;
+		const initialValue = el[initialValueKey];
+		delete el[initialValueKey];
+		if (initialValue !== void 0 && (el.type === "text" || el.type === "textarea") && el.value !== initialValue) el[assignKey](castValue(el.value, trim, number));
+		else el.value = newValue;
 	},
 	beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
 		el[assignKey] = getModelAssigner(vnode);
@@ -1303,19 +1312,39 @@ const vModelSelectInit = (el, value, number, set) => {
 	el._modelValue = value;
 	addEventListener(el, "change", () => {
 		const selectedVal = Array.prototype.filter.call(el.options, (o) => o.selected).map((o) => number ? (0, _vue_shared.looseToNumber)(getValue(o)) : getValue(o));
-		(set || el[assignKey])(el.multiple ? (0, _vue_shared.isSet)(el._modelValue) ? new Set(selectedVal) : selectedVal : selectedVal[0]);
-		el._assigning = true;
-		(0, _vue_runtime_core.nextTick)(() => {
-			el._assigning = false;
-		});
+		const multiple = el.multiple;
+		const assignedValue = multiple ? (0, _vue_shared.isSet)(el._modelValue) ? new Set(selectedVal) : selectedVal : selectedVal[0];
+		const pending = el._pendingValue = [multiple, multiple ? (0, _vue_shared.isArray)(assignedValue) ? selectedVal.slice() : selectedVal : assignedValue];
+		try {
+			(set || el[assignKey])(assignedValue);
+		} finally {
+			(0, _vue_runtime_core.nextTick)(() => {
+				if (el._pendingValue === pending) el._pendingValue = void 0;
+			});
+		}
 	});
 };
+function isSameSelectValue(value, assignedValue, multiple) {
+	if (!multiple) return (0, _vue_shared.looseEqual)(value, assignedValue);
+	if ((0, _vue_shared.isArray)(value)) return (0, _vue_shared.looseEqual)(value, assignedValue);
+	if ((0, _vue_shared.isSet)(value)) {
+		if (value.size !== assignedValue.length) return false;
+		for (const item of assignedValue) if (!value.has(item)) return false;
+		return true;
+	}
+	return false;
+}
 /**
 * @internal
 */
 const vModelSetSelected = (el, value) => {
 	el._modelValue = value;
-	if (el._assigning) return;
+	const pending = el._pendingValue;
+	el._pendingValue = void 0;
+	if (pending && pending[0] === el.multiple && isSameSelectValue(value, pending[1], pending[0])) return;
+	setSelected(el, value);
+};
+function setSelected(el, value) {
 	const isMultiple = el.multiple;
 	const isArrayValue = (0, _vue_shared.isArray)(value);
 	if (isMultiple && !isArrayValue && !(0, _vue_shared.isSet)(value)) {
@@ -1325,18 +1354,19 @@ const vModelSetSelected = (el, value) => {
 	for (let i = 0, l = el.options.length; i < l; i++) {
 		const option = el.options[i];
 		const optionValue = getValue(option);
-		if (isMultiple) if (isArrayValue) {
-			const optionType = typeof optionValue;
-			if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
-			else option.selected = (0, _vue_shared.looseIndexOf)(value, optionValue) > -1;
-		} else option.selected = value.has(optionValue);
-		else if ((0, _vue_shared.looseEqual)(getValue(option), value)) {
+		if (isMultiple) {
+			if (isArrayValue) {
+				const optionType = typeof optionValue;
+				if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
+				else option.selected = (0, _vue_shared.looseIndexOf)(value, optionValue) > -1;
+			} else option.selected = value.has(optionValue);
+		} else if ((0, _vue_shared.looseEqual)(getValue(option), value)) {
 			if (el.selectedIndex !== i) el.selectedIndex = i;
 			return;
 		}
 	}
 	if (!isMultiple && el.selectedIndex !== -1) el.selectedIndex = -1;
-};
+}
 /**
 * @internal retrieve raw value set via :value bindings
 */
@@ -1456,7 +1486,7 @@ const withKeys = (fn, modifiers) => {
 };
 //#endregion
 //#region packages/runtime-dom/src/index.ts
-const rendererOptions = /* @__PURE__ */ (0, _vue_shared.extend)({ patchProp }, nodeOps);
+const rendererOptions = /*@__PURE__*/ (0, _vue_shared.extend)({ patchProp }, nodeOps);
 let renderer;
 let enabledHydration = false;
 function ensureRenderer() {