@vue/runtime-dom 3.6.0-rc.5 → 3.6.0-rc.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @vue/runtime-dom v3.6.0-rc.5
2
+ * @vue/runtime-dom v3.6.0-rc.7
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -10,7 +10,7 @@ export * from "@vue/runtime-core";
10
10
  let policy = void 0;
11
11
  const tt = typeof window !== "undefined" && window.trustedTypes;
12
12
  if (tt) try {
13
- policy = /* @__PURE__ */ tt.createPolicy("vue", { createHTML: (val) => val });
13
+ policy = /*@__PURE__*/ tt.createPolicy("vue", { createHTML: (val) => val });
14
14
  } catch (e) {
15
15
  process.env.NODE_ENV !== "production" && warn(`Error creating trusted types policy: ${e}`);
16
16
  }
@@ -18,7 +18,7 @@ const unsafeToTrustedHTML = policy ? (val) => policy.createHTML(val) : (val) =>
18
18
  const svgNS = "http://www.w3.org/2000/svg";
19
19
  const mathmlNS = "http://www.w3.org/1998/Math/MathML";
20
20
  const doc = typeof document !== "undefined" ? document : null;
21
- const templateContainer = doc && /* @__PURE__ */ doc.createElement("template");
21
+ const templateContainer = doc && /*@__PURE__*/ doc.createElement("template");
22
22
  const nodeOps = {
23
23
  insert: (child, parent, anchor) => {
24
24
  parent.insertBefore(child, anchor || null);
@@ -92,7 +92,7 @@ const DOMTransitionPropsValidators = {
92
92
  leaveActiveClass: String,
93
93
  leaveToClass: String
94
94
  };
95
- const TransitionPropsValidators = /* @__PURE__ */ extend({}, BaseTransitionPropsValidators, DOMTransitionPropsValidators);
95
+ const TransitionPropsValidators = /*@__PURE__*/ extend({}, BaseTransitionPropsValidators, DOMTransitionPropsValidators);
96
96
  /**
97
97
  * Wrap logic that attaches extra properties to Transition in a function
98
98
  * so that it can be annotated as pure
@@ -106,7 +106,7 @@ const decorate$1 = (t) => {
106
106
  * DOM Transition is a higher-order-component based on the platform-agnostic
107
107
  * base Transition component, with DOM-specific logic.
108
108
  */
109
- const Transition = /* @__PURE__ */ decorate$1((props, { slots }) => h(BaseTransition, resolveTransitionProps(props), slots));
109
+ const Transition = /*@__PURE__*/ decorate$1((props, { slots }) => h(BaseTransition, resolveTransitionProps(props), slots));
110
110
  /**
111
111
  * #3227 Incoming hooks may be merged into arrays when wrapping Transition
112
112
  * with custom HOCs.
@@ -328,14 +328,15 @@ const vShow = {
328
328
  },
329
329
  updated(el, { value, oldValue }, { transition }) {
330
330
  if (!value === !oldValue) return;
331
- if (transition) if (value) {
332
- transition.beforeEnter(el);
333
- setDisplay(el, true);
334
- transition.enter(el);
335
- } else transition.leave(el, () => {
336
- setDisplay(el, false);
337
- });
338
- else setDisplay(el, value);
331
+ if (transition) {
332
+ if (value) {
333
+ transition.beforeEnter(el);
334
+ setDisplay(el, true);
335
+ transition.enter(el);
336
+ } else transition.leave(el, () => {
337
+ setDisplay(el, false);
338
+ });
339
+ } else setDisplay(el, value);
339
340
  },
340
341
  beforeUnmount(el, { value }) {
341
342
  setDisplay(el, value);
@@ -443,11 +444,13 @@ function patchStyle(el, prev, next) {
443
444
  const isCssString = isString(next);
444
445
  let hasControlledDisplay = false;
445
446
  if (next && !isCssString) {
446
- if (prev) if (!isString(prev)) {
447
- for (const key in prev) if (next[key] == null) setStyle(style, key, "");
448
- } else for (const prevStyle of prev.split(";")) {
449
- const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
450
- if (next[key] == null) setStyle(style, key, "");
447
+ if (prev) {
448
+ if (!isString(prev)) {
449
+ for (const key in prev) if (next[key] == null) setStyle(style, key, "");
450
+ } else for (const prevStyle of prev.split(";")) {
451
+ const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
452
+ if (next[key] == null) setStyle(style, key, "");
453
+ }
451
454
  }
452
455
  for (const key in next) {
453
456
  if (key === "display") hasControlledDisplay = true;
@@ -478,8 +481,10 @@ function setStyle(style, name, rawVal) {
478
481
  if (!!(process.env.NODE_ENV !== "production")) {
479
482
  if (semicolonRE.test(val)) warn(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
480
483
  }
481
- if (name.startsWith("--")) style.setProperty(name, val);
482
- else {
484
+ if (name.startsWith("--")) {
485
+ if (importantRE.test(val)) style.setProperty(name, val.replace(importantRE, ""), "important");
486
+ else style.setProperty(name, val);
487
+ } else {
483
488
  const prefixed = autoPrefix(style, name);
484
489
  if (importantRE.test(val)) style.setProperty(hyphenate(prefixed), val.replace(importantRE, ""), "important");
485
490
  else style[prefixed] = val;
@@ -516,9 +521,10 @@ function shouldPreserveTextareaResizeStyle(el, key, prev, next) {
516
521
  //#region packages/runtime-dom/src/modules/attrs.ts
517
522
  const xlinkNS = "http://www.w3.org/1999/xlink";
518
523
  function patchAttr(el, key, value, isSVG, instance, isBoolean = isSpecialBooleanAttr(key)) {
519
- if (isSVG && key.startsWith("xlink:")) if (value == null) el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
520
- else el.setAttributeNS(xlinkNS, key, value);
521
- else if (value == null || isBoolean && !includeBooleanAttr(value)) el.removeAttribute(key);
524
+ if (isSVG && key.startsWith("xlink:")) {
525
+ if (value == null) el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
526
+ else el.setAttributeNS(xlinkNS, key, value);
527
+ } else if (value == null || isBoolean && !includeBooleanAttr(value)) el.removeAttribute(key);
522
528
  else el.setAttribute(key, isBoolean ? "" : isSymbol(value) ? String(value) : value);
523
529
  }
524
530
  //#endregion
@@ -591,7 +597,7 @@ function parseEventName(name) {
591
597
  return [name[2] === ":" ? name.slice(3) : hyphenate(name.slice(2)), options];
592
598
  }
593
599
  let cachedNow = 0;
594
- const p = /* @__PURE__ */ Promise.resolve();
600
+ const p = /*@__PURE__*/ Promise.resolve();
595
601
  const getNow = () => cachedNow || (p.then(() => cachedNow = 0), cachedNow = Date.now());
596
602
  function createInvoker(initialValue, instance) {
597
603
  const invoker = (e) => {
@@ -659,7 +665,7 @@ function shouldSetAsPropForVueCE(el, key) {
659
665
  //#endregion
660
666
  //#region packages/runtime-dom/src/apiCustomElement.ts
661
667
  const REMOVAL = {};
662
- /* @__NO_SIDE_EFFECTS__ */
668
+ /*@__NO_SIDE_EFFECTS__*/
663
669
  function defineCustomElement(options, extraOptions, _createApp) {
664
670
  let Comp = defineComponent(options, extraOptions);
665
671
  if (isPlainObject(Comp)) Comp = extend({}, Comp, extraOptions);
@@ -708,12 +714,14 @@ var VueElementBase = class VueElementBase extends BaseClass {
708
714
  this._parent = parent;
709
715
  break;
710
716
  }
711
- if (!this._instance) if (this._resolved) this._mountComponent(this._def);
712
- else if (parent && parent._pendingResolve) this._pendingResolve = parent._pendingResolve.then(() => {
713
- this._pendingResolve = void 0;
714
- if (this.isConnected) return this._resolveDef();
715
- });
716
- else this._resolveDef();
717
+ if (!this._instance) {
718
+ if (this._resolved) this._mountComponent(this._def);
719
+ else if (parent && parent._pendingResolve) this._pendingResolve = parent._pendingResolve.then(() => {
720
+ this._pendingResolve = void 0;
721
+ if (this.isConnected) return this._resolveDef();
722
+ });
723
+ else this._resolveDef();
724
+ }
717
725
  }
718
726
  disconnectedCallback() {
719
727
  this._connected = false;
@@ -887,14 +895,16 @@ var VueElementBase = class VueElementBase extends BaseClass {
887
895
  if (!parentComp) this._styleAnchors.set(this._def, s);
888
896
  if (owner) this._styleAnchors.set(owner, s);
889
897
  }
890
- if (!!(process.env.NODE_ENV !== "production")) if (owner) {
891
- if (owner.__hmrId) {
892
- if (!this._childStyles) this._childStyles = /* @__PURE__ */ new Map();
893
- let entry = this._childStyles.get(owner.__hmrId);
894
- if (!entry) this._childStyles.set(owner.__hmrId, entry = []);
895
- entry.push(s);
896
- }
897
- } else (this._styles || (this._styles = [])).push(s);
898
+ if (!!(process.env.NODE_ENV !== "production")) {
899
+ if (owner) {
900
+ if (owner.__hmrId) {
901
+ if (!this._childStyles) this._childStyles = /* @__PURE__ */ new Map();
902
+ let entry = this._childStyles.get(owner.__hmrId);
903
+ if (!entry) this._childStyles.set(owner.__hmrId, entry = []);
904
+ entry.push(s);
905
+ }
906
+ } else (this._styles || (this._styles = [])).push(s);
907
+ }
898
908
  }
899
909
  }
900
910
  _getStyleAnchor(comp) {
@@ -929,13 +939,11 @@ var VueElementBase = class VueElementBase extends BaseClass {
929
939
  _renderSlots() {
930
940
  const outlets = this._getSlots();
931
941
  const scopeId = this._instance.type.__scopeId;
932
- const slotReplacements = /* @__PURE__ */ new Map();
933
942
  for (let i = 0; i < outlets.length; i++) {
934
943
  const o = outlets[i];
935
944
  const slotName = o.getAttribute("name") || "default";
936
945
  const content = this._slots[slotName];
937
946
  const parent = o.parentNode;
938
- const replacementNodes = [];
939
947
  if (content) for (const n of content) {
940
948
  if (scopeId && n.nodeType === 1) {
941
949
  const id = scopeId + "-s";
@@ -945,20 +953,10 @@ var VueElementBase = class VueElementBase extends BaseClass {
945
953
  while (child = walker.nextNode()) child.setAttribute(id, "");
946
954
  }
947
955
  parent.insertBefore(n, o);
948
- replacementNodes.push(n);
949
- }
950
- else while (o.firstChild) {
951
- const child = o.firstChild;
952
- parent.insertBefore(child, o);
953
- replacementNodes.push(child);
954
956
  }
957
+ else while (o.firstChild) parent.insertBefore(o.firstChild, o);
955
958
  parent.removeChild(o);
956
- slotReplacements.set(o, {
957
- nodes: replacementNodes,
958
- usedFallback: !content
959
- });
960
959
  }
961
- this._updateSlotNodes(slotReplacements);
962
960
  }
963
961
  /**
964
962
  * @internal
@@ -997,7 +995,7 @@ var VueElementBase = class VueElementBase extends BaseClass {
997
995
  * @internal
998
996
  */
999
997
  _hasShadowRoot() {
1000
- return this._def.shadowRoot !== false;
998
+ return this._root !== this;
1001
999
  }
1002
1000
  /**
1003
1001
  * @internal
@@ -1044,10 +1042,6 @@ var VueElement = class extends VueElementBase {
1044
1042
  if (this._instance && this._instance.ce) this._instance.ce = void 0;
1045
1043
  this._app = this._instance = null;
1046
1044
  }
1047
- /**
1048
- * Only called when shadowRoot is false
1049
- */
1050
- _updateSlotNodes(replacements) {}
1051
1045
  _createVNode() {
1052
1046
  const baseProps = {};
1053
1047
  if (!this.shadowRoot) baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
@@ -1063,8 +1057,10 @@ function useHost(caller) {
1063
1057
  const { hasInstance, value } = useInstanceOption("ce", true);
1064
1058
  const el = value;
1065
1059
  if (el) return el;
1066
- else if (!!(process.env.NODE_ENV !== "production")) if (!hasInstance) warn(`${caller || "useHost"} called without an active component instance.`);
1067
- else warn(`${caller || "useHost"} can only be used in components defined via defineCustomElement.`);
1060
+ else if (!!(process.env.NODE_ENV !== "production")) {
1061
+ if (!hasInstance) warn(`${caller || "useHost"} called without an active component instance.`);
1062
+ else warn(`${caller || "useHost"} can only be used in components defined via defineCustomElement.`);
1063
+ }
1068
1064
  return null;
1069
1065
  }
1070
1066
  /**
@@ -1113,7 +1109,7 @@ const decorate = (t) => {
1113
1109
  };
1114
1110
  const TransitionGroup = /* @__PURE__ */ decorate({
1115
1111
  name: "TransitionGroup",
1116
- props: /* @__PURE__ */ extend({}, TransitionPropsValidators, {
1112
+ props: /*@__PURE__*/ extend({}, TransitionPropsValidators, {
1117
1113
  tag: String,
1118
1114
  moveClass: String
1119
1115
  }),
@@ -1394,19 +1390,39 @@ const vModelSelectInit = (el, value, number, set) => {
1394
1390
  el._modelValue = value;
1395
1391
  addEventListener(el, "change", () => {
1396
1392
  const selectedVal = Array.prototype.filter.call(el.options, (o) => o.selected).map((o) => number ? looseToNumber(getValue(o)) : getValue(o));
1397
- (set || el[assignKey])(el.multiple ? isSet(el._modelValue) ? new Set(selectedVal) : selectedVal : selectedVal[0]);
1398
- el._assigning = true;
1399
- nextTick(() => {
1400
- el._assigning = false;
1401
- });
1393
+ const multiple = el.multiple;
1394
+ const assignedValue = multiple ? isSet(el._modelValue) ? new Set(selectedVal) : selectedVal : selectedVal[0];
1395
+ const pending = el._pendingValue = [multiple, multiple ? isArray(assignedValue) ? selectedVal.slice() : selectedVal : assignedValue];
1396
+ try {
1397
+ (set || el[assignKey])(assignedValue);
1398
+ } finally {
1399
+ nextTick(() => {
1400
+ if (el._pendingValue === pending) el._pendingValue = void 0;
1401
+ });
1402
+ }
1402
1403
  });
1403
1404
  };
1405
+ function isSameSelectValue(value, assignedValue, multiple) {
1406
+ if (!multiple) return looseEqual(value, assignedValue);
1407
+ if (isArray(value)) return looseEqual(value, assignedValue);
1408
+ if (isSet(value)) {
1409
+ if (value.size !== assignedValue.length) return false;
1410
+ for (const item of assignedValue) if (!value.has(item)) return false;
1411
+ return true;
1412
+ }
1413
+ return false;
1414
+ }
1404
1415
  /**
1405
1416
  * @internal
1406
1417
  */
1407
1418
  const vModelSetSelected = (el, value) => {
1408
1419
  el._modelValue = value;
1409
- if (el._assigning) return;
1420
+ const pending = el._pendingValue;
1421
+ el._pendingValue = void 0;
1422
+ if (pending && pending[0] === el.multiple && isSameSelectValue(value, pending[1], pending[0])) return;
1423
+ setSelected(el, value);
1424
+ };
1425
+ function setSelected(el, value) {
1410
1426
  const isMultiple = el.multiple;
1411
1427
  const isArrayValue = isArray(value);
1412
1428
  if (isMultiple && !isArrayValue && !isSet(value)) {
@@ -1416,18 +1432,19 @@ const vModelSetSelected = (el, value) => {
1416
1432
  for (let i = 0, l = el.options.length; i < l; i++) {
1417
1433
  const option = el.options[i];
1418
1434
  const optionValue = getValue(option);
1419
- if (isMultiple) if (isArrayValue) {
1420
- const optionType = typeof optionValue;
1421
- if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
1422
- else option.selected = looseIndexOf(value, optionValue) > -1;
1423
- } else option.selected = value.has(optionValue);
1424
- else if (looseEqual(getValue(option), value)) {
1435
+ if (isMultiple) {
1436
+ if (isArrayValue) {
1437
+ const optionType = typeof optionValue;
1438
+ if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
1439
+ else option.selected = looseIndexOf(value, optionValue) > -1;
1440
+ } else option.selected = value.has(optionValue);
1441
+ } else if (looseEqual(getValue(option), value)) {
1425
1442
  if (el.selectedIndex !== i) el.selectedIndex = i;
1426
1443
  return;
1427
1444
  }
1428
1445
  }
1429
1446
  if (!isMultiple && el.selectedIndex !== -1) el.selectedIndex = -1;
1430
- };
1447
+ }
1431
1448
  /**
1432
1449
  * @internal retrieve raw value set via :value bindings
1433
1450
  */
@@ -1547,7 +1564,7 @@ const withKeys = (fn, modifiers) => {
1547
1564
  };
1548
1565
  //#endregion
1549
1566
  //#region packages/runtime-dom/src/index.ts
1550
- const rendererOptions = /* @__PURE__ */ extend({ patchProp }, nodeOps);
1567
+ const rendererOptions = /*@__PURE__*/ extend({ patchProp }, nodeOps);
1551
1568
  let renderer;
1552
1569
  let enabledHydration = false;
1553
1570
  function ensureRenderer() {