@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.
- package/dist/runtime-dom.cjs.js +77 -64
- package/dist/runtime-dom.cjs.prod.js +77 -64
- package/dist/runtime-dom.d.ts +145 -157
- package/dist/runtime-dom.esm-browser.js +622 -458
- package/dist/runtime-dom.esm-browser.prod.js +4 -4
- package/dist/runtime-dom.esm-bundler.js +91 -74
- package/dist/runtime-dom.global.js +622 -458
- package/dist/runtime-dom.global.prod.js +4 -4
- package/package.json +4 -4
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @vue/runtime-dom v3.6.0-rc.
|
|
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 =
|
|
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 &&
|
|
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 =
|
|
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 =
|
|
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)
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
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)
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
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("--"))
|
|
482
|
-
|
|
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:"))
|
|
520
|
-
|
|
521
|
-
|
|
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 =
|
|
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
|
-
|
|
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)
|
|
712
|
-
|
|
713
|
-
this._pendingResolve =
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
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"))
|
|
891
|
-
if (owner
|
|
892
|
-
if (
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
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.
|
|
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"))
|
|
1067
|
-
|
|
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:
|
|
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
|
-
|
|
1398
|
-
el.
|
|
1399
|
-
|
|
1400
|
-
|
|
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
|
-
|
|
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)
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
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 =
|
|
1567
|
+
const rendererOptions = /*@__PURE__*/ extend({ patchProp }, nodeOps);
|
|
1551
1568
|
let renderer;
|
|
1552
1569
|
let enabledHydration = false;
|
|
1553
1570
|
function ensureRenderer() {
|