@vue/runtime-dom 3.6.0-alpha.7 → 3.6.0-beta.10
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 +1358 -1729
- package/dist/runtime-dom.cjs.prod.js +1266 -1585
- package/dist/runtime-dom.d.ts +1313 -1296
- package/dist/runtime-dom.esm-browser.js +8925 -12295
- package/dist/runtime-dom.esm-browser.prod.js +7 -6
- package/dist/runtime-dom.esm-bundler.js +1423 -1794
- package/dist/runtime-dom.global.js +10094 -13361
- package/dist/runtime-dom.global.prod.js +7 -6
- package/package.json +5 -5
package/dist/runtime-dom.cjs.js
CHANGED
|
@@ -1,25 +1,21 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @vue/runtime-dom v3.6.0-
|
|
3
|
-
* (c) 2018-present Yuxi (Evan) You and Vue contributors
|
|
4
|
-
* @license MIT
|
|
5
|
-
**/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
2
|
+
* @vue/runtime-dom v3.6.0-beta.10
|
|
3
|
+
* (c) 2018-present Yuxi (Evan) You and Vue contributors
|
|
4
|
+
* @license MIT
|
|
5
|
+
**/
|
|
6
|
+
Object.defineProperties(exports, {
|
|
7
|
+
__esModule: { value: true },
|
|
8
|
+
[Symbol.toStringTag]: { value: "Module" }
|
|
9
|
+
});
|
|
10
|
+
let _vue_runtime_core = require("@vue/runtime-core");
|
|
11
|
+
let _vue_shared = require("@vue/shared");
|
|
12
|
+
//#region packages/runtime-dom/src/nodeOps.ts
|
|
13
13
|
let policy = void 0;
|
|
14
14
|
const tt = typeof window !== "undefined" && window.trustedTypes;
|
|
15
|
-
if (tt) {
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
});
|
|
20
|
-
} catch (e) {
|
|
21
|
-
runtimeCore.warn(`Error creating trusted types policy: ${e}`);
|
|
22
|
-
}
|
|
15
|
+
if (tt) try {
|
|
16
|
+
policy = /* @__PURE__ */ tt.createPolicy("vue", { createHTML: (val) => val });
|
|
17
|
+
} catch (e) {
|
|
18
|
+
(0, _vue_runtime_core.warn)(`Error creating trusted types policy: ${e}`);
|
|
23
19
|
}
|
|
24
20
|
const unsafeToTrustedHTML = policy ? (val) => policy.createHTML(val) : (val) => val;
|
|
25
21
|
const svgNS = "http://www.w3.org/2000/svg";
|
|
@@ -27,1899 +23,1527 @@ const mathmlNS = "http://www.w3.org/1998/Math/MathML";
|
|
|
27
23
|
const doc = typeof document !== "undefined" ? document : null;
|
|
28
24
|
const templateContainer = doc && /* @__PURE__ */ doc.createElement("template");
|
|
29
25
|
const nodeOps = {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
);
|
|
75
|
-
const template = templateContainer.content;
|
|
76
|
-
if (namespace === "svg" || namespace === "mathml") {
|
|
77
|
-
const wrapper = template.firstChild;
|
|
78
|
-
while (wrapper.firstChild) {
|
|
79
|
-
template.appendChild(wrapper.firstChild);
|
|
80
|
-
}
|
|
81
|
-
template.removeChild(wrapper);
|
|
82
|
-
}
|
|
83
|
-
parent.insertBefore(template, anchor);
|
|
84
|
-
}
|
|
85
|
-
return [
|
|
86
|
-
// first
|
|
87
|
-
before ? before.nextSibling : parent.firstChild,
|
|
88
|
-
// last
|
|
89
|
-
anchor ? anchor.previousSibling : parent.lastChild
|
|
90
|
-
];
|
|
91
|
-
}
|
|
26
|
+
insert: (child, parent, anchor) => {
|
|
27
|
+
parent.insertBefore(child, anchor || null);
|
|
28
|
+
},
|
|
29
|
+
remove: (child) => {
|
|
30
|
+
const parent = child.parentNode;
|
|
31
|
+
if (parent) parent.removeChild(child);
|
|
32
|
+
},
|
|
33
|
+
createElement: (tag, namespace, is, props) => {
|
|
34
|
+
const el = namespace === "svg" ? doc.createElementNS(svgNS, tag) : namespace === "mathml" ? doc.createElementNS(mathmlNS, tag) : is ? doc.createElement(tag, { is }) : doc.createElement(tag);
|
|
35
|
+
if (tag === "select" && props && props.multiple != null) el.setAttribute("multiple", props.multiple);
|
|
36
|
+
return el;
|
|
37
|
+
},
|
|
38
|
+
createText: (text) => doc.createTextNode(text),
|
|
39
|
+
createComment: (text) => doc.createComment(text),
|
|
40
|
+
setText: (node, text) => {
|
|
41
|
+
node.nodeValue = text;
|
|
42
|
+
},
|
|
43
|
+
setElementText: (el, text) => {
|
|
44
|
+
el.textContent = text;
|
|
45
|
+
},
|
|
46
|
+
parentNode: (node) => node.parentNode,
|
|
47
|
+
nextSibling: (node) => node.nextSibling,
|
|
48
|
+
querySelector: (selector) => doc.querySelector(selector),
|
|
49
|
+
setScopeId(el, id) {
|
|
50
|
+
el.setAttribute(id, "");
|
|
51
|
+
},
|
|
52
|
+
insertStaticContent(content, parent, anchor, namespace, start, end) {
|
|
53
|
+
const before = anchor ? anchor.previousSibling : parent.lastChild;
|
|
54
|
+
if (start && (start === end || start.nextSibling)) while (true) {
|
|
55
|
+
parent.insertBefore(start.cloneNode(true), anchor);
|
|
56
|
+
if (start === end || !(start = start.nextSibling)) break;
|
|
57
|
+
}
|
|
58
|
+
else {
|
|
59
|
+
templateContainer.innerHTML = unsafeToTrustedHTML(namespace === "svg" ? `<svg>${content}</svg>` : namespace === "mathml" ? `<math>${content}</math>` : content);
|
|
60
|
+
const template = templateContainer.content;
|
|
61
|
+
if (namespace === "svg" || namespace === "mathml") {
|
|
62
|
+
const wrapper = template.firstChild;
|
|
63
|
+
while (wrapper.firstChild) template.appendChild(wrapper.firstChild);
|
|
64
|
+
template.removeChild(wrapper);
|
|
65
|
+
}
|
|
66
|
+
parent.insertBefore(template, anchor);
|
|
67
|
+
}
|
|
68
|
+
return [before ? before.nextSibling : parent.firstChild, anchor ? anchor.previousSibling : parent.lastChild];
|
|
69
|
+
}
|
|
92
70
|
};
|
|
93
|
-
|
|
71
|
+
//#endregion
|
|
72
|
+
//#region packages/runtime-dom/src/components/Transition.ts
|
|
94
73
|
const TRANSITION = "transition";
|
|
95
74
|
const ANIMATION = "animation";
|
|
96
75
|
const vtcKey = Symbol("_vtc");
|
|
97
76
|
const DOMTransitionPropsValidators = {
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
77
|
+
name: String,
|
|
78
|
+
type: String,
|
|
79
|
+
css: {
|
|
80
|
+
type: Boolean,
|
|
81
|
+
default: true
|
|
82
|
+
},
|
|
83
|
+
duration: [
|
|
84
|
+
String,
|
|
85
|
+
Number,
|
|
86
|
+
Object
|
|
87
|
+
],
|
|
88
|
+
enterFromClass: String,
|
|
89
|
+
enterActiveClass: String,
|
|
90
|
+
enterToClass: String,
|
|
91
|
+
appearFromClass: String,
|
|
92
|
+
appearActiveClass: String,
|
|
93
|
+
appearToClass: String,
|
|
94
|
+
leaveFromClass: String,
|
|
95
|
+
leaveActiveClass: String,
|
|
96
|
+
leaveToClass: String
|
|
114
97
|
};
|
|
115
|
-
const TransitionPropsValidators = /* @__PURE__ */
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
98
|
+
const TransitionPropsValidators = /* @__PURE__ */ (0, _vue_shared.extend)({}, _vue_runtime_core.BaseTransitionPropsValidators, DOMTransitionPropsValidators);
|
|
99
|
+
/**
|
|
100
|
+
* Wrap logic that attaches extra properties to Transition in a function
|
|
101
|
+
* so that it can be annotated as pure
|
|
102
|
+
*/
|
|
120
103
|
const decorate$1 = (t) => {
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
104
|
+
t.displayName = "Transition";
|
|
105
|
+
t.props = TransitionPropsValidators;
|
|
106
|
+
return t;
|
|
124
107
|
};
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
108
|
+
/**
|
|
109
|
+
* DOM Transition is a higher-order-component based on the platform-agnostic
|
|
110
|
+
* base Transition component, with DOM-specific logic.
|
|
111
|
+
*/
|
|
112
|
+
const Transition = /* @__PURE__ */ decorate$1((props, { slots }) => (0, _vue_runtime_core.h)(_vue_runtime_core.BaseTransition, resolveTransitionProps(props), slots));
|
|
113
|
+
/**
|
|
114
|
+
* #3227 Incoming hooks may be merged into arrays when wrapping Transition
|
|
115
|
+
* with custom HOCs.
|
|
116
|
+
*/
|
|
128
117
|
const callHook = (hook, args = []) => {
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
} else if (hook) {
|
|
132
|
-
hook(...args);
|
|
133
|
-
}
|
|
118
|
+
if ((0, _vue_shared.isArray)(hook)) hook.forEach((h) => h(...args));
|
|
119
|
+
else if (hook) hook(...args);
|
|
134
120
|
};
|
|
121
|
+
/**
|
|
122
|
+
* Check if a hook expects a callback (2nd arg), which means the user
|
|
123
|
+
* intends to explicitly control the end of the transition.
|
|
124
|
+
*/
|
|
135
125
|
const hasExplicitCallback = (hook) => {
|
|
136
|
-
|
|
126
|
+
return hook ? (0, _vue_shared.isArray)(hook) ? hook.some((h) => h.length > 1) : hook.length > 1 : false;
|
|
137
127
|
};
|
|
138
128
|
function resolveTransitionProps(rawProps) {
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
const resolve = () => finishLeave(el, done);
|
|
218
|
-
addTransitionClass(el, leaveFromClass);
|
|
219
|
-
if (!el._enterCancelled) {
|
|
220
|
-
forceReflow(el);
|
|
221
|
-
addTransitionClass(el, leaveActiveClass);
|
|
222
|
-
} else {
|
|
223
|
-
addTransitionClass(el, leaveActiveClass);
|
|
224
|
-
forceReflow(el);
|
|
225
|
-
}
|
|
226
|
-
nextFrame(() => {
|
|
227
|
-
if (!el._isLeaving) {
|
|
228
|
-
return;
|
|
229
|
-
}
|
|
230
|
-
removeTransitionClass(el, leaveFromClass);
|
|
231
|
-
addTransitionClass(el, leaveToClass);
|
|
232
|
-
if (!hasExplicitCallback(onLeave)) {
|
|
233
|
-
whenTransitionEnds(el, type, leaveDuration, resolve);
|
|
234
|
-
}
|
|
235
|
-
});
|
|
236
|
-
callHook(onLeave, [el, resolve]);
|
|
237
|
-
},
|
|
238
|
-
onEnterCancelled(el) {
|
|
239
|
-
finishEnter(el, false, void 0, true);
|
|
240
|
-
callHook(onEnterCancelled, [el]);
|
|
241
|
-
},
|
|
242
|
-
onAppearCancelled(el) {
|
|
243
|
-
finishEnter(el, true, void 0, true);
|
|
244
|
-
callHook(onAppearCancelled, [el]);
|
|
245
|
-
},
|
|
246
|
-
onLeaveCancelled(el) {
|
|
247
|
-
finishLeave(el);
|
|
248
|
-
callHook(onLeaveCancelled, [el]);
|
|
249
|
-
}
|
|
250
|
-
});
|
|
129
|
+
const baseProps = {};
|
|
130
|
+
for (const key in rawProps) if (!(key in DOMTransitionPropsValidators)) baseProps[key] = rawProps[key];
|
|
131
|
+
if (rawProps.css === false) return baseProps;
|
|
132
|
+
const { name = "v", type, duration, enterFromClass = `${name}-enter-from`, enterActiveClass = `${name}-enter-active`, enterToClass = `${name}-enter-to`, appearFromClass = enterFromClass, appearActiveClass = enterActiveClass, appearToClass = enterToClass, leaveFromClass = `${name}-leave-from`, leaveActiveClass = `${name}-leave-active`, leaveToClass = `${name}-leave-to` } = rawProps;
|
|
133
|
+
const durations = normalizeDuration(duration);
|
|
134
|
+
const enterDuration = durations && durations[0];
|
|
135
|
+
const leaveDuration = durations && durations[1];
|
|
136
|
+
const { onBeforeEnter, onEnter, onEnterCancelled, onLeave, onLeaveCancelled, onBeforeAppear = onBeforeEnter, onAppear = onEnter, onAppearCancelled = onEnterCancelled } = baseProps;
|
|
137
|
+
const finishEnter = (el, isAppear, done, isCancelled) => {
|
|
138
|
+
el._enterCancelled = isCancelled;
|
|
139
|
+
removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
|
|
140
|
+
removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
|
|
141
|
+
done && done();
|
|
142
|
+
};
|
|
143
|
+
const finishLeave = (el, done) => {
|
|
144
|
+
el._isLeaving = false;
|
|
145
|
+
removeTransitionClass(el, leaveFromClass);
|
|
146
|
+
removeTransitionClass(el, leaveToClass);
|
|
147
|
+
removeTransitionClass(el, leaveActiveClass);
|
|
148
|
+
done && done();
|
|
149
|
+
};
|
|
150
|
+
const makeEnterHook = (isAppear) => {
|
|
151
|
+
return (el, done) => {
|
|
152
|
+
const hook = isAppear ? onAppear : onEnter;
|
|
153
|
+
const resolve = () => finishEnter(el, isAppear, done);
|
|
154
|
+
callHook(hook, [el, resolve]);
|
|
155
|
+
nextFrame(() => {
|
|
156
|
+
removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
|
|
157
|
+
addTransitionClass(el, isAppear ? appearToClass : enterToClass);
|
|
158
|
+
if (!hasExplicitCallback(hook)) whenTransitionEnds(el, type, enterDuration, resolve);
|
|
159
|
+
});
|
|
160
|
+
};
|
|
161
|
+
};
|
|
162
|
+
return (0, _vue_shared.extend)(baseProps, {
|
|
163
|
+
onBeforeEnter(el) {
|
|
164
|
+
callHook(onBeforeEnter, [el]);
|
|
165
|
+
addTransitionClass(el, enterFromClass);
|
|
166
|
+
addTransitionClass(el, enterActiveClass);
|
|
167
|
+
},
|
|
168
|
+
onBeforeAppear(el) {
|
|
169
|
+
callHook(onBeforeAppear, [el]);
|
|
170
|
+
addTransitionClass(el, appearFromClass);
|
|
171
|
+
addTransitionClass(el, appearActiveClass);
|
|
172
|
+
},
|
|
173
|
+
onEnter: makeEnterHook(false),
|
|
174
|
+
onAppear: makeEnterHook(true),
|
|
175
|
+
onLeave(el, done) {
|
|
176
|
+
el._isLeaving = true;
|
|
177
|
+
const resolve = () => finishLeave(el, done);
|
|
178
|
+
addTransitionClass(el, leaveFromClass);
|
|
179
|
+
if (!el._enterCancelled) {
|
|
180
|
+
forceReflow(el);
|
|
181
|
+
addTransitionClass(el, leaveActiveClass);
|
|
182
|
+
} else {
|
|
183
|
+
addTransitionClass(el, leaveActiveClass);
|
|
184
|
+
forceReflow(el);
|
|
185
|
+
}
|
|
186
|
+
nextFrame(() => {
|
|
187
|
+
if (!el._isLeaving) return;
|
|
188
|
+
removeTransitionClass(el, leaveFromClass);
|
|
189
|
+
addTransitionClass(el, leaveToClass);
|
|
190
|
+
if (!hasExplicitCallback(onLeave)) whenTransitionEnds(el, type, leaveDuration, resolve);
|
|
191
|
+
});
|
|
192
|
+
callHook(onLeave, [el, resolve]);
|
|
193
|
+
},
|
|
194
|
+
onEnterCancelled(el) {
|
|
195
|
+
finishEnter(el, false, void 0, true);
|
|
196
|
+
callHook(onEnterCancelled, [el]);
|
|
197
|
+
},
|
|
198
|
+
onAppearCancelled(el) {
|
|
199
|
+
finishEnter(el, true, void 0, true);
|
|
200
|
+
callHook(onAppearCancelled, [el]);
|
|
201
|
+
},
|
|
202
|
+
onLeaveCancelled(el) {
|
|
203
|
+
finishLeave(el);
|
|
204
|
+
callHook(onLeaveCancelled, [el]);
|
|
205
|
+
}
|
|
206
|
+
});
|
|
251
207
|
}
|
|
252
208
|
function normalizeDuration(duration) {
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
return [n, n];
|
|
260
|
-
}
|
|
209
|
+
if (duration == null) return null;
|
|
210
|
+
else if ((0, _vue_shared.isObject)(duration)) return [NumberOf(duration.enter), NumberOf(duration.leave)];
|
|
211
|
+
else {
|
|
212
|
+
const n = NumberOf(duration);
|
|
213
|
+
return [n, n];
|
|
214
|
+
}
|
|
261
215
|
}
|
|
262
216
|
function NumberOf(val) {
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
}
|
|
267
|
-
return res;
|
|
217
|
+
const res = (0, _vue_shared.toNumber)(val);
|
|
218
|
+
(0, _vue_runtime_core.assertNumber)(res, "<transition> explicit duration");
|
|
219
|
+
return res;
|
|
268
220
|
}
|
|
269
221
|
function addTransitionClass(el, cls) {
|
|
270
|
-
|
|
271
|
-
|
|
222
|
+
cls.split(/\s+/).forEach((c) => c && el.classList.add(c));
|
|
223
|
+
(el[vtcKey] || (el[vtcKey] = /* @__PURE__ */ new Set())).add(cls);
|
|
272
224
|
}
|
|
273
225
|
function removeTransitionClass(el, cls) {
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
}
|
|
281
|
-
}
|
|
226
|
+
cls.split(/\s+/).forEach((c) => c && el.classList.remove(c));
|
|
227
|
+
const _vtc = el[vtcKey];
|
|
228
|
+
if (_vtc) {
|
|
229
|
+
_vtc.delete(cls);
|
|
230
|
+
if (!_vtc.size) el[vtcKey] = void 0;
|
|
231
|
+
}
|
|
282
232
|
}
|
|
283
233
|
function nextFrame(cb) {
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
234
|
+
requestAnimationFrame(() => {
|
|
235
|
+
requestAnimationFrame(cb);
|
|
236
|
+
});
|
|
287
237
|
}
|
|
288
238
|
let endId = 0;
|
|
289
239
|
function whenTransitionEnds(el, expectedType, explicitTimeout, resolve) {
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
if (e.target === el && ++ended >= propCount) {
|
|
311
|
-
end();
|
|
312
|
-
}
|
|
313
|
-
};
|
|
314
|
-
setTimeout(() => {
|
|
315
|
-
if (ended < propCount) {
|
|
316
|
-
end();
|
|
317
|
-
}
|
|
318
|
-
}, timeout + 1);
|
|
319
|
-
el.addEventListener(endEvent, onEnd);
|
|
240
|
+
const id = el._endId = ++endId;
|
|
241
|
+
const resolveIfNotStale = () => {
|
|
242
|
+
if (id === el._endId) resolve();
|
|
243
|
+
};
|
|
244
|
+
if (explicitTimeout != null) return setTimeout(resolveIfNotStale, explicitTimeout);
|
|
245
|
+
const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
|
|
246
|
+
if (!type) return resolve();
|
|
247
|
+
const endEvent = type + "end";
|
|
248
|
+
let ended = 0;
|
|
249
|
+
const end = () => {
|
|
250
|
+
el.removeEventListener(endEvent, onEnd);
|
|
251
|
+
resolveIfNotStale();
|
|
252
|
+
};
|
|
253
|
+
const onEnd = (e) => {
|
|
254
|
+
if (e.target === el && ++ended >= propCount) end();
|
|
255
|
+
};
|
|
256
|
+
setTimeout(() => {
|
|
257
|
+
if (ended < propCount) end();
|
|
258
|
+
}, timeout + 1);
|
|
259
|
+
el.addEventListener(endEvent, onEnd);
|
|
320
260
|
}
|
|
321
261
|
function getTransitionInfo(el, expectedType) {
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
hasTransform
|
|
358
|
-
};
|
|
262
|
+
const styles = window.getComputedStyle(el);
|
|
263
|
+
const getStyleProperties = (key) => (styles[key] || "").split(", ");
|
|
264
|
+
const transitionDelays = getStyleProperties(`${TRANSITION}Delay`);
|
|
265
|
+
const transitionDurations = getStyleProperties(`${TRANSITION}Duration`);
|
|
266
|
+
const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
|
|
267
|
+
const animationDelays = getStyleProperties(`${ANIMATION}Delay`);
|
|
268
|
+
const animationDurations = getStyleProperties(`${ANIMATION}Duration`);
|
|
269
|
+
const animationTimeout = getTimeout(animationDelays, animationDurations);
|
|
270
|
+
let type = null;
|
|
271
|
+
let timeout = 0;
|
|
272
|
+
let propCount = 0;
|
|
273
|
+
if (expectedType === TRANSITION) {
|
|
274
|
+
if (transitionTimeout > 0) {
|
|
275
|
+
type = TRANSITION;
|
|
276
|
+
timeout = transitionTimeout;
|
|
277
|
+
propCount = transitionDurations.length;
|
|
278
|
+
}
|
|
279
|
+
} else if (expectedType === ANIMATION) {
|
|
280
|
+
if (animationTimeout > 0) {
|
|
281
|
+
type = ANIMATION;
|
|
282
|
+
timeout = animationTimeout;
|
|
283
|
+
propCount = animationDurations.length;
|
|
284
|
+
}
|
|
285
|
+
} else {
|
|
286
|
+
timeout = Math.max(transitionTimeout, animationTimeout);
|
|
287
|
+
type = timeout > 0 ? transitionTimeout > animationTimeout ? TRANSITION : ANIMATION : null;
|
|
288
|
+
propCount = type ? type === TRANSITION ? transitionDurations.length : animationDurations.length : 0;
|
|
289
|
+
}
|
|
290
|
+
const hasTransform = type === TRANSITION && /\b(?:transform|all)(?:,|$)/.test(getStyleProperties(`${TRANSITION}Property`).toString());
|
|
291
|
+
return {
|
|
292
|
+
type,
|
|
293
|
+
timeout,
|
|
294
|
+
propCount,
|
|
295
|
+
hasTransform
|
|
296
|
+
};
|
|
359
297
|
}
|
|
360
298
|
function getTimeout(delays, durations) {
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
}
|
|
364
|
-
return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
|
|
299
|
+
while (delays.length < durations.length) delays = delays.concat(delays);
|
|
300
|
+
return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
|
|
365
301
|
}
|
|
366
302
|
function toMs(s) {
|
|
367
|
-
|
|
368
|
-
|
|
303
|
+
if (s === "auto") return 0;
|
|
304
|
+
return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
|
|
369
305
|
}
|
|
370
306
|
function forceReflow(el) {
|
|
371
|
-
|
|
372
|
-
return targetDocument.body.offsetHeight;
|
|
307
|
+
return (el ? el.ownerDocument : document).body.offsetHeight;
|
|
373
308
|
}
|
|
374
|
-
|
|
309
|
+
//#endregion
|
|
310
|
+
//#region packages/runtime-dom/src/modules/class.ts
|
|
375
311
|
function patchClass(el, value, isSVG) {
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
el.removeAttribute("class");
|
|
382
|
-
} else if (isSVG) {
|
|
383
|
-
el.setAttribute("class", value);
|
|
384
|
-
} else {
|
|
385
|
-
el.className = value;
|
|
386
|
-
}
|
|
312
|
+
const transitionClasses = el[vtcKey];
|
|
313
|
+
if (transitionClasses) value = (value ? [value, ...transitionClasses] : [...transitionClasses]).join(" ");
|
|
314
|
+
if (value == null) el.removeAttribute("class");
|
|
315
|
+
else if (isSVG) el.setAttribute("class", value);
|
|
316
|
+
else el.className = value;
|
|
387
317
|
}
|
|
388
|
-
|
|
318
|
+
//#endregion
|
|
319
|
+
//#region packages/runtime-dom/src/directives/vShow.ts
|
|
389
320
|
const vShowOriginalDisplay = Symbol("_vod");
|
|
390
321
|
const vShowHidden = Symbol("_vsh");
|
|
391
322
|
const vShow = {
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
transition.leave(el, () => {
|
|
416
|
-
setDisplay(el, false);
|
|
417
|
-
});
|
|
418
|
-
}
|
|
419
|
-
} else {
|
|
420
|
-
setDisplay(el, value);
|
|
421
|
-
}
|
|
422
|
-
},
|
|
423
|
-
beforeUnmount(el, { value }) {
|
|
424
|
-
setDisplay(el, value);
|
|
425
|
-
}
|
|
323
|
+
name: "show",
|
|
324
|
+
beforeMount(el, { value }, { transition }) {
|
|
325
|
+
el[vShowOriginalDisplay] = el.style.display === "none" ? "" : el.style.display;
|
|
326
|
+
if (transition && value) transition.beforeEnter(el);
|
|
327
|
+
else setDisplay(el, value);
|
|
328
|
+
},
|
|
329
|
+
mounted(el, { value }, { transition }) {
|
|
330
|
+
if (transition && value) transition.enter(el);
|
|
331
|
+
},
|
|
332
|
+
updated(el, { value, oldValue }, { transition }) {
|
|
333
|
+
if (!value === !oldValue) return;
|
|
334
|
+
if (transition) if (value) {
|
|
335
|
+
transition.beforeEnter(el);
|
|
336
|
+
setDisplay(el, true);
|
|
337
|
+
transition.enter(el);
|
|
338
|
+
} else transition.leave(el, () => {
|
|
339
|
+
setDisplay(el, false);
|
|
340
|
+
});
|
|
341
|
+
else setDisplay(el, value);
|
|
342
|
+
},
|
|
343
|
+
beforeUnmount(el, { value }) {
|
|
344
|
+
setDisplay(el, value);
|
|
345
|
+
}
|
|
426
346
|
};
|
|
427
347
|
function setDisplay(el, value) {
|
|
428
|
-
|
|
429
|
-
|
|
348
|
+
el.style.display = value ? el[vShowOriginalDisplay] : "none";
|
|
349
|
+
el[vShowHidden] = !value;
|
|
430
350
|
}
|
|
431
351
|
function initVShowForSSR() {
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
}
|
|
436
|
-
};
|
|
437
|
-
}
|
|
438
|
-
|
|
439
|
-
const CSS_VAR_TEXT = Symbol("CSS_VAR_TEXT" );
|
|
440
|
-
function useCssVars(getter) {
|
|
441
|
-
return;
|
|
352
|
+
vShow.getSSRProps = ({ value }) => {
|
|
353
|
+
if (!value) return { style: { display: "none" } };
|
|
354
|
+
};
|
|
442
355
|
}
|
|
443
|
-
|
|
356
|
+
//#endregion
|
|
357
|
+
//#region packages/runtime-dom/src/helpers/useCssVars.ts
|
|
358
|
+
const CSS_VAR_TEXT = Symbol("CSS_VAR_TEXT");
|
|
359
|
+
/**
|
|
360
|
+
* Runtime helper for SFC's CSS variable injection feature.
|
|
361
|
+
* @private
|
|
362
|
+
*/
|
|
363
|
+
function useCssVars(getter) {}
|
|
364
|
+
//#endregion
|
|
365
|
+
//#region packages/runtime-dom/src/modules/style.ts
|
|
444
366
|
const displayRE = /(?:^|;)\s*display\s*:/;
|
|
445
367
|
function patchStyle(el, prev, next) {
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
} else {
|
|
473
|
-
if (isCssString) {
|
|
474
|
-
if (prev !== next) {
|
|
475
|
-
const cssVarText = style[CSS_VAR_TEXT];
|
|
476
|
-
if (cssVarText) {
|
|
477
|
-
next += ";" + cssVarText;
|
|
478
|
-
}
|
|
479
|
-
style.cssText = next;
|
|
480
|
-
hasControlledDisplay = displayRE.test(next);
|
|
481
|
-
}
|
|
482
|
-
} else if (prev) {
|
|
483
|
-
el.removeAttribute("style");
|
|
484
|
-
}
|
|
485
|
-
}
|
|
486
|
-
if (vShowOriginalDisplay in el) {
|
|
487
|
-
el[vShowOriginalDisplay] = hasControlledDisplay ? style.display : "";
|
|
488
|
-
if (el[vShowHidden]) {
|
|
489
|
-
style.display = "none";
|
|
490
|
-
}
|
|
491
|
-
}
|
|
368
|
+
const style = el.style;
|
|
369
|
+
const isCssString = (0, _vue_shared.isString)(next);
|
|
370
|
+
let hasControlledDisplay = false;
|
|
371
|
+
if (next && !isCssString) {
|
|
372
|
+
if (prev) if (!(0, _vue_shared.isString)(prev)) {
|
|
373
|
+
for (const key in prev) if (next[key] == null) setStyle(style, key, "");
|
|
374
|
+
} else for (const prevStyle of prev.split(";")) {
|
|
375
|
+
const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
|
|
376
|
+
if (next[key] == null) setStyle(style, key, "");
|
|
377
|
+
}
|
|
378
|
+
for (const key in next) {
|
|
379
|
+
if (key === "display") hasControlledDisplay = true;
|
|
380
|
+
setStyle(style, key, next[key]);
|
|
381
|
+
}
|
|
382
|
+
} else if (isCssString) {
|
|
383
|
+
if (prev !== next) {
|
|
384
|
+
const cssVarText = style[CSS_VAR_TEXT];
|
|
385
|
+
if (cssVarText) next += ";" + cssVarText;
|
|
386
|
+
style.cssText = next;
|
|
387
|
+
hasControlledDisplay = displayRE.test(next);
|
|
388
|
+
}
|
|
389
|
+
} else if (prev) el.removeAttribute("style");
|
|
390
|
+
if (vShowOriginalDisplay in el) {
|
|
391
|
+
el[vShowOriginalDisplay] = hasControlledDisplay ? style.display : "";
|
|
392
|
+
if (el[vShowHidden]) style.display = "none";
|
|
393
|
+
}
|
|
492
394
|
}
|
|
493
395
|
const semicolonRE = /[^\\];\s*$/;
|
|
494
396
|
const importantRE = /\s*!important$/;
|
|
495
397
|
function setStyle(style, name, rawVal) {
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
if (name.startsWith("--")) {
|
|
508
|
-
style.setProperty(name, val);
|
|
509
|
-
} else {
|
|
510
|
-
const prefixed = autoPrefix(style, name);
|
|
511
|
-
if (importantRE.test(val)) {
|
|
512
|
-
style.setProperty(
|
|
513
|
-
shared.hyphenate(prefixed),
|
|
514
|
-
val.replace(importantRE, ""),
|
|
515
|
-
"important"
|
|
516
|
-
);
|
|
517
|
-
} else {
|
|
518
|
-
style[prefixed] = val;
|
|
519
|
-
}
|
|
520
|
-
}
|
|
521
|
-
}
|
|
398
|
+
if ((0, _vue_shared.isArray)(rawVal)) rawVal.forEach((v) => setStyle(style, name, v));
|
|
399
|
+
else {
|
|
400
|
+
const val = rawVal == null ? "" : String(rawVal);
|
|
401
|
+
if (semicolonRE.test(val)) (0, _vue_runtime_core.warn)(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
|
|
402
|
+
if (name.startsWith("--")) style.setProperty(name, val);
|
|
403
|
+
else {
|
|
404
|
+
const prefixed = autoPrefix(style, name);
|
|
405
|
+
if (importantRE.test(val)) style.setProperty((0, _vue_shared.hyphenate)(prefixed), val.replace(importantRE, ""), "important");
|
|
406
|
+
else style[prefixed] = val;
|
|
407
|
+
}
|
|
408
|
+
}
|
|
522
409
|
}
|
|
523
|
-
const prefixes = [
|
|
410
|
+
const prefixes = [
|
|
411
|
+
"Webkit",
|
|
412
|
+
"Moz",
|
|
413
|
+
"ms"
|
|
414
|
+
];
|
|
524
415
|
const prefixCache = {};
|
|
525
416
|
function autoPrefix(style, rawName) {
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
const prefixed = prefixes[i] + name;
|
|
537
|
-
if (prefixed in style) {
|
|
538
|
-
return prefixCache[rawName] = prefixed;
|
|
539
|
-
}
|
|
540
|
-
}
|
|
541
|
-
return rawName;
|
|
417
|
+
const cached = prefixCache[rawName];
|
|
418
|
+
if (cached) return cached;
|
|
419
|
+
let name = (0, _vue_runtime_core.camelize)(rawName);
|
|
420
|
+
if (name !== "filter" && name in style) return prefixCache[rawName] = name;
|
|
421
|
+
name = (0, _vue_shared.capitalize)(name);
|
|
422
|
+
for (let i = 0; i < prefixes.length; i++) {
|
|
423
|
+
const prefixed = prefixes[i] + name;
|
|
424
|
+
if (prefixed in style) return prefixCache[rawName] = prefixed;
|
|
425
|
+
}
|
|
426
|
+
return rawName;
|
|
542
427
|
}
|
|
543
|
-
|
|
428
|
+
//#endregion
|
|
429
|
+
//#region packages/runtime-dom/src/modules/attrs.ts
|
|
544
430
|
const xlinkNS = "http://www.w3.org/1999/xlink";
|
|
545
|
-
function patchAttr(el, key, value, isSVG, instance, isBoolean =
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
el.setAttributeNS(xlinkNS, key, value);
|
|
551
|
-
}
|
|
552
|
-
} else {
|
|
553
|
-
if (value == null || isBoolean && !shared.includeBooleanAttr(value)) {
|
|
554
|
-
el.removeAttribute(key);
|
|
555
|
-
} else {
|
|
556
|
-
el.setAttribute(
|
|
557
|
-
key,
|
|
558
|
-
isBoolean ? "" : shared.isSymbol(value) ? String(value) : value
|
|
559
|
-
);
|
|
560
|
-
}
|
|
561
|
-
}
|
|
431
|
+
function patchAttr(el, key, value, isSVG, instance, isBoolean = (0, _vue_shared.isSpecialBooleanAttr)(key)) {
|
|
432
|
+
if (isSVG && key.startsWith("xlink:")) if (value == null) el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
|
|
433
|
+
else el.setAttributeNS(xlinkNS, key, value);
|
|
434
|
+
else if (value == null || isBoolean && !(0, _vue_shared.includeBooleanAttr)(value)) el.removeAttribute(key);
|
|
435
|
+
else el.setAttribute(key, isBoolean ? "" : (0, _vue_shared.isSymbol)(value) ? String(value) : value);
|
|
562
436
|
}
|
|
563
|
-
|
|
437
|
+
//#endregion
|
|
438
|
+
//#region packages/runtime-dom/src/modules/props.ts
|
|
564
439
|
function patchDOMProp(el, key, value, parentComponent, attrName) {
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
} else if (type === "number") {
|
|
597
|
-
value = 0;
|
|
598
|
-
needRemove = true;
|
|
599
|
-
}
|
|
600
|
-
}
|
|
601
|
-
try {
|
|
602
|
-
el[key] = value;
|
|
603
|
-
} catch (e) {
|
|
604
|
-
if (!needRemove) {
|
|
605
|
-
runtimeCore.warn(
|
|
606
|
-
`Failed setting prop "${key}" on <${tag.toLowerCase()}>: value ${value} is invalid.`,
|
|
607
|
-
e
|
|
608
|
-
);
|
|
609
|
-
}
|
|
610
|
-
}
|
|
611
|
-
needRemove && el.removeAttribute(attrName || key);
|
|
440
|
+
if (key === "innerHTML" || key === "textContent") {
|
|
441
|
+
if (value != null) el[key] = key === "innerHTML" ? unsafeToTrustedHTML(value) : value;
|
|
442
|
+
return;
|
|
443
|
+
}
|
|
444
|
+
const tag = el.tagName;
|
|
445
|
+
if (key === "value" && (0, _vue_shared.canSetValueDirectly)(tag)) {
|
|
446
|
+
const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
|
|
447
|
+
const newValue = value == null ? el.type === "checkbox" ? "on" : "" : String(value);
|
|
448
|
+
if (oldValue !== newValue || !("_value" in el)) el.value = newValue;
|
|
449
|
+
if (value == null) el.removeAttribute(key);
|
|
450
|
+
el._value = value;
|
|
451
|
+
return;
|
|
452
|
+
}
|
|
453
|
+
let needRemove = false;
|
|
454
|
+
if (value === "" || value == null) {
|
|
455
|
+
const type = typeof el[key];
|
|
456
|
+
if (type === "boolean") value = (0, _vue_shared.includeBooleanAttr)(value);
|
|
457
|
+
else if (value == null && type === "string") {
|
|
458
|
+
value = "";
|
|
459
|
+
needRemove = true;
|
|
460
|
+
} else if (type === "number") {
|
|
461
|
+
value = 0;
|
|
462
|
+
needRemove = true;
|
|
463
|
+
}
|
|
464
|
+
}
|
|
465
|
+
try {
|
|
466
|
+
el[key] = value;
|
|
467
|
+
} catch (e) {
|
|
468
|
+
if (!needRemove) (0, _vue_runtime_core.warn)(`Failed setting prop "${key}" on <${tag.toLowerCase()}>: value ${value} is invalid.`, e);
|
|
469
|
+
}
|
|
470
|
+
needRemove && el.removeAttribute(attrName || key);
|
|
612
471
|
}
|
|
613
|
-
|
|
472
|
+
//#endregion
|
|
473
|
+
//#region packages/runtime-dom/src/modules/events.ts
|
|
614
474
|
function addEventListener(el, event, handler, options) {
|
|
615
|
-
|
|
475
|
+
el.addEventListener(event, handler, options);
|
|
616
476
|
}
|
|
617
477
|
function removeEventListener(el, event, handler, options) {
|
|
618
|
-
|
|
478
|
+
el.removeEventListener(event, handler, options);
|
|
619
479
|
}
|
|
620
480
|
const veiKey = Symbol("_vei");
|
|
621
481
|
function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
addEventListener(el, name, invoker, options);
|
|
634
|
-
} else if (existingInvoker) {
|
|
635
|
-
removeEventListener(el, name, existingInvoker, options);
|
|
636
|
-
invokers[rawName] = void 0;
|
|
637
|
-
}
|
|
638
|
-
}
|
|
482
|
+
const invokers = el[veiKey] || (el[veiKey] = {});
|
|
483
|
+
const existingInvoker = invokers[rawName];
|
|
484
|
+
if (nextValue && existingInvoker) existingInvoker.value = sanitizeEventValue(nextValue, rawName);
|
|
485
|
+
else {
|
|
486
|
+
const [name, options] = parseName(rawName);
|
|
487
|
+
if (nextValue) addEventListener(el, name, invokers[rawName] = createInvoker(sanitizeEventValue(nextValue, rawName), instance), options);
|
|
488
|
+
else if (existingInvoker) {
|
|
489
|
+
removeEventListener(el, name, existingInvoker, options);
|
|
490
|
+
invokers[rawName] = void 0;
|
|
491
|
+
}
|
|
492
|
+
}
|
|
639
493
|
}
|
|
640
494
|
const optionsModifierRE = /(?:Once|Passive|Capture)$/;
|
|
641
495
|
function parseName(name) {
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
return [event, options];
|
|
496
|
+
let options;
|
|
497
|
+
if (optionsModifierRE.test(name)) {
|
|
498
|
+
options = {};
|
|
499
|
+
let m;
|
|
500
|
+
while (m = name.match(optionsModifierRE)) {
|
|
501
|
+
name = name.slice(0, name.length - m[0].length);
|
|
502
|
+
options[m[0].toLowerCase()] = true;
|
|
503
|
+
}
|
|
504
|
+
}
|
|
505
|
+
return [name[2] === ":" ? name.slice(3) : (0, _vue_shared.hyphenate)(name.slice(2)), options];
|
|
653
506
|
}
|
|
654
507
|
let cachedNow = 0;
|
|
655
508
|
const p = /* @__PURE__ */ Promise.resolve();
|
|
656
509
|
const getNow = () => cachedNow || (p.then(() => cachedNow = 0), cachedNow = Date.now());
|
|
657
510
|
function createInvoker(initialValue, instance) {
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
instance,
|
|
667
|
-
5,
|
|
668
|
-
[e]
|
|
669
|
-
);
|
|
670
|
-
};
|
|
671
|
-
invoker.value = initialValue;
|
|
672
|
-
invoker.attached = getNow();
|
|
673
|
-
return invoker;
|
|
511
|
+
const invoker = (e) => {
|
|
512
|
+
if (!e._vts) e._vts = Date.now();
|
|
513
|
+
else if (e._vts <= invoker.attached) return;
|
|
514
|
+
(0, _vue_runtime_core.callWithAsyncErrorHandling)(patchStopImmediatePropagation(e, invoker.value), instance, 5, [e]);
|
|
515
|
+
};
|
|
516
|
+
invoker.value = initialValue;
|
|
517
|
+
invoker.attached = getNow();
|
|
518
|
+
return invoker;
|
|
674
519
|
}
|
|
675
520
|
function sanitizeEventValue(value, propName) {
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
runtimeCore.warn(
|
|
680
|
-
`Wrong type passed as event handler to ${propName} - did you forget @ or : in front of your prop?
|
|
681
|
-
Expected function or array of functions, received type ${typeof value}.`
|
|
682
|
-
);
|
|
683
|
-
return shared.NOOP;
|
|
521
|
+
if ((0, _vue_shared.isFunction)(value) || (0, _vue_shared.isArray)(value)) return value;
|
|
522
|
+
(0, _vue_runtime_core.warn)(`Wrong type passed as event handler to ${propName} - did you forget @ or : in front of your prop?\nExpected function or array of functions, received type ${typeof value}.`);
|
|
523
|
+
return _vue_shared.NOOP;
|
|
684
524
|
}
|
|
685
525
|
function patchStopImmediatePropagation(e, value) {
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
);
|
|
695
|
-
} else {
|
|
696
|
-
return value;
|
|
697
|
-
}
|
|
526
|
+
if ((0, _vue_shared.isArray)(value)) {
|
|
527
|
+
const originalStop = e.stopImmediatePropagation;
|
|
528
|
+
e.stopImmediatePropagation = () => {
|
|
529
|
+
originalStop.call(e);
|
|
530
|
+
e._stopped = true;
|
|
531
|
+
};
|
|
532
|
+
return value.map((fn) => (e) => !e._stopped && fn && fn(e));
|
|
533
|
+
} else return value;
|
|
698
534
|
}
|
|
699
|
-
|
|
535
|
+
//#endregion
|
|
536
|
+
//#region packages/runtime-dom/src/patchProp.ts
|
|
700
537
|
const patchProp = (el, key, prevValue, nextValue, namespace, parentComponent) => {
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
} else if (
|
|
716
|
-
// #11081 force set props for possible async custom element
|
|
717
|
-
el._isVueCE && (/[A-Z]/.test(key) || !shared.isString(nextValue))
|
|
718
|
-
) {
|
|
719
|
-
patchDOMProp(el, shared.camelize(key), nextValue, parentComponent, key);
|
|
720
|
-
} else {
|
|
721
|
-
if (key === "true-value") {
|
|
722
|
-
el._trueValue = nextValue;
|
|
723
|
-
} else if (key === "false-value") {
|
|
724
|
-
el._falseValue = nextValue;
|
|
725
|
-
}
|
|
726
|
-
patchAttr(el, key, nextValue, isSVG);
|
|
727
|
-
}
|
|
538
|
+
const isSVG = namespace === "svg";
|
|
539
|
+
if (key === "class") patchClass(el, nextValue, isSVG);
|
|
540
|
+
else if (key === "style") patchStyle(el, prevValue, nextValue);
|
|
541
|
+
else if ((0, _vue_shared.isOn)(key)) {
|
|
542
|
+
if (!(0, _vue_shared.isModelListener)(key)) patchEvent(el, key, prevValue, nextValue, parentComponent);
|
|
543
|
+
} else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, nextValue, isSVG)) {
|
|
544
|
+
patchDOMProp(el, key, nextValue, parentComponent);
|
|
545
|
+
if (!el.tagName.includes("-") && (key === "value" || key === "checked" || key === "selected")) patchAttr(el, key, nextValue, isSVG, parentComponent, key !== "value");
|
|
546
|
+
} else if (el._isVueCE && (shouldSetAsPropForVueCE(el, key) || el._def.__asyncLoader && (/[A-Z]/.test(key) || !(0, _vue_shared.isString)(nextValue)))) patchDOMProp(el, (0, _vue_shared.camelize)(key), nextValue, parentComponent, key);
|
|
547
|
+
else {
|
|
548
|
+
if (key === "true-value") el._trueValue = nextValue;
|
|
549
|
+
else if (key === "false-value") el._falseValue = nextValue;
|
|
550
|
+
patchAttr(el, key, nextValue, isSVG, parentComponent);
|
|
551
|
+
}
|
|
728
552
|
};
|
|
729
553
|
function shouldSetAsProp(el, key, value, isSVG) {
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
}
|
|
739
|
-
if (shared.shouldSetAsAttr(el.tagName, key)) {
|
|
740
|
-
return false;
|
|
741
|
-
}
|
|
742
|
-
if (shared.isNativeOn(key) && shared.isString(value)) {
|
|
743
|
-
return false;
|
|
744
|
-
}
|
|
745
|
-
return key in el;
|
|
554
|
+
if (isSVG) {
|
|
555
|
+
if (key === "innerHTML" || key === "textContent") return true;
|
|
556
|
+
if (key in el && (0, _vue_shared.isNativeOn)(key) && (0, _vue_shared.isFunction)(value)) return true;
|
|
557
|
+
return false;
|
|
558
|
+
}
|
|
559
|
+
if ((0, _vue_shared.shouldSetAsAttr)(el.tagName, key)) return false;
|
|
560
|
+
if ((0, _vue_shared.isNativeOn)(key) && (0, _vue_shared.isString)(value)) return false;
|
|
561
|
+
return key in el;
|
|
746
562
|
}
|
|
747
|
-
|
|
563
|
+
function shouldSetAsPropForVueCE(el, key) {
|
|
564
|
+
const props = el._def.props;
|
|
565
|
+
if (!props) return false;
|
|
566
|
+
const camelKey = (0, _vue_shared.camelize)(key);
|
|
567
|
+
return Array.isArray(props) ? props.some((prop) => (0, _vue_shared.camelize)(prop) === camelKey) : Object.keys(props).some((prop) => (0, _vue_shared.camelize)(prop) === camelKey);
|
|
568
|
+
}
|
|
569
|
+
//#endregion
|
|
570
|
+
//#region packages/runtime-dom/src/apiCustomElement.ts
|
|
748
571
|
const REMOVAL = {};
|
|
749
|
-
|
|
572
|
+
/* @__NO_SIDE_EFFECTS__ */
|
|
750
573
|
function defineCustomElement(options, extraOptions, _createApp) {
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
574
|
+
let Comp = (0, _vue_runtime_core.defineComponent)(options, extraOptions);
|
|
575
|
+
if ((0, _vue_shared.isPlainObject)(Comp)) Comp = (0, _vue_shared.extend)({}, Comp, extraOptions);
|
|
576
|
+
class VueCustomElement extends VueElement {
|
|
577
|
+
constructor(initialProps) {
|
|
578
|
+
super(Comp, initialProps, _createApp);
|
|
579
|
+
}
|
|
580
|
+
}
|
|
581
|
+
VueCustomElement.def = Comp;
|
|
582
|
+
return VueCustomElement;
|
|
760
583
|
}
|
|
761
|
-
const defineSSRCustomElement = (
|
|
762
|
-
|
|
584
|
+
const defineSSRCustomElement = ((options, extraOptions) => {
|
|
585
|
+
return /* @__PURE__ */ defineCustomElement(options, extraOptions, createSSRApp);
|
|
763
586
|
});
|
|
764
|
-
const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
|
|
587
|
+
const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {};
|
|
588
|
+
var VueElementBase = class VueElementBase extends BaseClass {
|
|
589
|
+
constructor(def, props = {}, createAppFn) {
|
|
590
|
+
super();
|
|
591
|
+
this._isVueCE = true;
|
|
592
|
+
this._instance = null;
|
|
593
|
+
this._app = null;
|
|
594
|
+
this._connected = false;
|
|
595
|
+
this._resolved = false;
|
|
596
|
+
this._numberProps = null;
|
|
597
|
+
this._styleChildren = /* @__PURE__ */ new WeakSet();
|
|
598
|
+
this._styleAnchors = /* @__PURE__ */ new WeakMap();
|
|
599
|
+
this._patching = false;
|
|
600
|
+
this._dirty = false;
|
|
601
|
+
this._ob = null;
|
|
602
|
+
this._def = def;
|
|
603
|
+
this._props = props;
|
|
604
|
+
this._createApp = createAppFn;
|
|
605
|
+
this._nonce = def.nonce;
|
|
606
|
+
if (this._needsHydration()) this._root = this.shadowRoot;
|
|
607
|
+
else if (def.shadowRoot !== false) {
|
|
608
|
+
this.attachShadow((0, _vue_shared.extend)({}, def.shadowRootOptions, { mode: "open" }));
|
|
609
|
+
this._root = this.shadowRoot;
|
|
610
|
+
} else this._root = this;
|
|
611
|
+
}
|
|
612
|
+
connectedCallback() {
|
|
613
|
+
if (!this.isConnected) return;
|
|
614
|
+
if (!this.shadowRoot && !this._resolved) this._parseSlots();
|
|
615
|
+
this._connected = true;
|
|
616
|
+
let parent = this;
|
|
617
|
+
while (parent = parent && (parent.assignedSlot || parent.parentNode || parent.host)) if (parent instanceof VueElementBase) {
|
|
618
|
+
this._parent = parent;
|
|
619
|
+
break;
|
|
620
|
+
}
|
|
621
|
+
if (!this._instance) if (this._resolved) this._mountComponent(this._def);
|
|
622
|
+
else if (parent && parent._pendingResolve) this._pendingResolve = parent._pendingResolve.then(() => {
|
|
623
|
+
this._pendingResolve = void 0;
|
|
624
|
+
this._resolveDef();
|
|
625
|
+
});
|
|
626
|
+
else this._resolveDef();
|
|
627
|
+
}
|
|
628
|
+
disconnectedCallback() {
|
|
629
|
+
this._connected = false;
|
|
630
|
+
(0, _vue_runtime_core.nextTick)(() => {
|
|
631
|
+
if (!this._connected) {
|
|
632
|
+
if (this._ob) {
|
|
633
|
+
this._ob.disconnect();
|
|
634
|
+
this._ob = null;
|
|
635
|
+
}
|
|
636
|
+
this._unmount();
|
|
637
|
+
if (this._teleportTargets) {
|
|
638
|
+
this._teleportTargets.clear();
|
|
639
|
+
this._teleportTargets = void 0;
|
|
640
|
+
}
|
|
641
|
+
}
|
|
642
|
+
});
|
|
643
|
+
}
|
|
644
|
+
_setParent(parent = this._parent) {
|
|
645
|
+
if (parent && this._instance) {
|
|
646
|
+
this._instance.parent = parent._instance;
|
|
647
|
+
this._inheritParentContext(parent);
|
|
648
|
+
}
|
|
649
|
+
}
|
|
650
|
+
_inheritParentContext(parent = this._parent) {
|
|
651
|
+
if (parent && this._app) Object.setPrototypeOf(this._app._context.provides, parent._instance.provides);
|
|
652
|
+
}
|
|
653
|
+
_processMutations(mutations) {
|
|
654
|
+
for (const m of mutations) this._setAttr(m.attributeName);
|
|
655
|
+
}
|
|
656
|
+
/**
|
|
657
|
+
* resolve inner component definition (handle possible async component)
|
|
658
|
+
*/
|
|
659
|
+
_resolveDef() {
|
|
660
|
+
if (this._pendingResolve) return;
|
|
661
|
+
for (let i = 0; i < this.attributes.length; i++) this._setAttr(this.attributes[i].name);
|
|
662
|
+
this._ob = new MutationObserver(this._processMutations.bind(this));
|
|
663
|
+
this._ob.observe(this, { attributes: true });
|
|
664
|
+
const resolve = (def) => {
|
|
665
|
+
this._resolved = true;
|
|
666
|
+
this._pendingResolve = void 0;
|
|
667
|
+
const { props, styles } = def;
|
|
668
|
+
let numberProps;
|
|
669
|
+
if (props && !(0, _vue_shared.isArray)(props)) for (const key in props) {
|
|
670
|
+
const opt = props[key];
|
|
671
|
+
if (opt === Number || opt && opt.type === Number) {
|
|
672
|
+
if (key in this._props) this._props[key] = (0, _vue_shared.toNumber)(this._props[key]);
|
|
673
|
+
(numberProps || (numberProps = Object.create(null)))[(0, _vue_shared.camelize)(key)] = true;
|
|
674
|
+
}
|
|
675
|
+
}
|
|
676
|
+
this._numberProps = numberProps;
|
|
677
|
+
this._resolveProps(def);
|
|
678
|
+
if (this.shadowRoot) this._applyStyles(styles);
|
|
679
|
+
else if (styles) (0, _vue_runtime_core.warn)("Custom element style injection is not supported when using shadowRoot: false");
|
|
680
|
+
this._mountComponent(def);
|
|
681
|
+
};
|
|
682
|
+
const asyncDef = this._def.__asyncLoader;
|
|
683
|
+
if (asyncDef) {
|
|
684
|
+
const { configureApp } = this._def;
|
|
685
|
+
this._pendingResolve = asyncDef().then((def) => {
|
|
686
|
+
def.configureApp = configureApp;
|
|
687
|
+
this._def = def;
|
|
688
|
+
resolve(def);
|
|
689
|
+
});
|
|
690
|
+
} else resolve(this._def);
|
|
691
|
+
}
|
|
692
|
+
_mountComponent(def) {
|
|
693
|
+
this._mount(def);
|
|
694
|
+
this._processExposed();
|
|
695
|
+
}
|
|
696
|
+
_processExposed() {
|
|
697
|
+
const exposed = this._instance && this._instance.exposed;
|
|
698
|
+
if (!exposed) return;
|
|
699
|
+
for (const key in exposed) if (!(0, _vue_shared.hasOwn)(this, key)) Object.defineProperty(this, key, { get: () => (0, _vue_runtime_core.unref)(exposed[key]) });
|
|
700
|
+
else (0, _vue_runtime_core.warn)(`Exposed property "${key}" already exists on custom element.`);
|
|
701
|
+
}
|
|
702
|
+
_processInstance() {
|
|
703
|
+
this._instance.ce = this;
|
|
704
|
+
this._instance.isCE = true;
|
|
705
|
+
this._instance.ceReload = (newStyles) => {
|
|
706
|
+
if (this._styles) {
|
|
707
|
+
this._styles.forEach((s) => this._root.removeChild(s));
|
|
708
|
+
this._styles.length = 0;
|
|
709
|
+
}
|
|
710
|
+
this._styleAnchors.delete(this._def);
|
|
711
|
+
this._applyStyles(newStyles);
|
|
712
|
+
if (!this._instance.vapor) this._instance = null;
|
|
713
|
+
this._update();
|
|
714
|
+
};
|
|
715
|
+
const dispatch = (event, args) => {
|
|
716
|
+
this.dispatchEvent(new CustomEvent(event, (0, _vue_shared.isPlainObject)(args[0]) ? (0, _vue_shared.extend)({ detail: args }, args[0]) : { detail: args }));
|
|
717
|
+
};
|
|
718
|
+
this._instance.emit = (event, ...args) => {
|
|
719
|
+
dispatch(event, args);
|
|
720
|
+
if ((0, _vue_shared.hyphenate)(event) !== event) dispatch((0, _vue_shared.hyphenate)(event), args);
|
|
721
|
+
};
|
|
722
|
+
this._setParent();
|
|
723
|
+
}
|
|
724
|
+
_resolveProps(def) {
|
|
725
|
+
const { props } = def;
|
|
726
|
+
const declaredPropKeys = (0, _vue_shared.isArray)(props) ? props : Object.keys(props || {});
|
|
727
|
+
for (const key of Object.keys(this)) if (key[0] !== "_" && declaredPropKeys.includes(key)) this._setProp(key, this[key]);
|
|
728
|
+
for (const key of declaredPropKeys.map(_vue_shared.camelize)) Object.defineProperty(this, key, {
|
|
729
|
+
get() {
|
|
730
|
+
return this._getProp(key);
|
|
731
|
+
},
|
|
732
|
+
set(val) {
|
|
733
|
+
this._setProp(key, val, true, !this._patching);
|
|
734
|
+
}
|
|
735
|
+
});
|
|
736
|
+
}
|
|
737
|
+
_setAttr(key) {
|
|
738
|
+
if (key.startsWith("data-v-")) return;
|
|
739
|
+
const has = this.hasAttribute(key);
|
|
740
|
+
let value = has ? this.getAttribute(key) : REMOVAL;
|
|
741
|
+
const camelKey = (0, _vue_shared.camelize)(key);
|
|
742
|
+
if (has && this._numberProps && this._numberProps[camelKey]) value = (0, _vue_shared.toNumber)(value);
|
|
743
|
+
this._setProp(camelKey, value, false, true);
|
|
744
|
+
}
|
|
745
|
+
/**
|
|
746
|
+
* @internal
|
|
747
|
+
*/
|
|
748
|
+
_getProp(key) {
|
|
749
|
+
return this._props[key];
|
|
750
|
+
}
|
|
751
|
+
/**
|
|
752
|
+
* @internal
|
|
753
|
+
*/
|
|
754
|
+
_setProp(key, val, shouldReflect = true, shouldUpdate = false) {
|
|
755
|
+
if (val !== this._props[key]) {
|
|
756
|
+
this._dirty = true;
|
|
757
|
+
if (val === REMOVAL) delete this._props[key];
|
|
758
|
+
else {
|
|
759
|
+
this._props[key] = val;
|
|
760
|
+
if (key === "key" && this._app && this._app._ceVNode) this._app._ceVNode.key = val;
|
|
761
|
+
}
|
|
762
|
+
if (shouldUpdate && this._instance) this._update();
|
|
763
|
+
if (shouldReflect) {
|
|
764
|
+
const ob = this._ob;
|
|
765
|
+
if (ob) {
|
|
766
|
+
this._processMutations(ob.takeRecords());
|
|
767
|
+
ob.disconnect();
|
|
768
|
+
}
|
|
769
|
+
if (val === true) this.setAttribute((0, _vue_shared.hyphenate)(key), "");
|
|
770
|
+
else if (typeof val === "string" || typeof val === "number") this.setAttribute((0, _vue_shared.hyphenate)(key), val + "");
|
|
771
|
+
else if (!val) this.removeAttribute((0, _vue_shared.hyphenate)(key));
|
|
772
|
+
ob && ob.observe(this, { attributes: true });
|
|
773
|
+
}
|
|
774
|
+
}
|
|
775
|
+
}
|
|
776
|
+
_applyStyles(styles, owner, parentComp) {
|
|
777
|
+
if (!styles) return;
|
|
778
|
+
if (owner) {
|
|
779
|
+
if (owner === this._def || this._styleChildren.has(owner)) return;
|
|
780
|
+
this._styleChildren.add(owner);
|
|
781
|
+
}
|
|
782
|
+
const nonce = this._nonce;
|
|
783
|
+
const root = this.shadowRoot;
|
|
784
|
+
const insertionAnchor = parentComp ? this._getStyleAnchor(parentComp) || this._getStyleAnchor(this._def) : this._getRootStyleInsertionAnchor(root);
|
|
785
|
+
let last = null;
|
|
786
|
+
for (let i = styles.length - 1; i >= 0; i--) {
|
|
787
|
+
const s = document.createElement("style");
|
|
788
|
+
if (nonce) s.setAttribute("nonce", nonce);
|
|
789
|
+
s.textContent = styles[i];
|
|
790
|
+
root.insertBefore(s, last || insertionAnchor);
|
|
791
|
+
last = s;
|
|
792
|
+
if (i === 0) {
|
|
793
|
+
if (!parentComp) this._styleAnchors.set(this._def, s);
|
|
794
|
+
if (owner) this._styleAnchors.set(owner, s);
|
|
795
|
+
}
|
|
796
|
+
if (owner) {
|
|
797
|
+
if (owner.__hmrId) {
|
|
798
|
+
if (!this._childStyles) this._childStyles = /* @__PURE__ */ new Map();
|
|
799
|
+
let entry = this._childStyles.get(owner.__hmrId);
|
|
800
|
+
if (!entry) this._childStyles.set(owner.__hmrId, entry = []);
|
|
801
|
+
entry.push(s);
|
|
802
|
+
}
|
|
803
|
+
} else (this._styles || (this._styles = [])).push(s);
|
|
804
|
+
}
|
|
805
|
+
}
|
|
806
|
+
_getStyleAnchor(comp) {
|
|
807
|
+
if (!comp) return null;
|
|
808
|
+
const anchor = this._styleAnchors.get(comp);
|
|
809
|
+
if (anchor && anchor.parentNode === this.shadowRoot) return anchor;
|
|
810
|
+
if (anchor) this._styleAnchors.delete(comp);
|
|
811
|
+
return null;
|
|
812
|
+
}
|
|
813
|
+
_getRootStyleInsertionAnchor(root) {
|
|
814
|
+
for (let i = 0; i < root.childNodes.length; i++) {
|
|
815
|
+
const node = root.childNodes[i];
|
|
816
|
+
if (!(node instanceof HTMLStyleElement)) return node;
|
|
817
|
+
}
|
|
818
|
+
return null;
|
|
819
|
+
}
|
|
820
|
+
/**
|
|
821
|
+
* Only called when shadowRoot is false
|
|
822
|
+
*/
|
|
823
|
+
_parseSlots() {
|
|
824
|
+
const slots = this._slots = {};
|
|
825
|
+
let n;
|
|
826
|
+
while (n = this.firstChild) {
|
|
827
|
+
const slotName = n.nodeType === 1 && n.getAttribute("slot") || "default";
|
|
828
|
+
(slots[slotName] || (slots[slotName] = [])).push(n);
|
|
829
|
+
this.removeChild(n);
|
|
830
|
+
}
|
|
831
|
+
}
|
|
832
|
+
/**
|
|
833
|
+
* Only called when shadowRoot is false
|
|
834
|
+
*/
|
|
835
|
+
_renderSlots() {
|
|
836
|
+
const outlets = this._getSlots();
|
|
837
|
+
const scopeId = this._instance.type.__scopeId;
|
|
838
|
+
const slotReplacements = /* @__PURE__ */ new Map();
|
|
839
|
+
for (let i = 0; i < outlets.length; i++) {
|
|
840
|
+
const o = outlets[i];
|
|
841
|
+
const slotName = o.getAttribute("name") || "default";
|
|
842
|
+
const content = this._slots[slotName];
|
|
843
|
+
const parent = o.parentNode;
|
|
844
|
+
const replacementNodes = [];
|
|
845
|
+
if (content) for (const n of content) {
|
|
846
|
+
if (scopeId && n.nodeType === 1) {
|
|
847
|
+
const id = scopeId + "-s";
|
|
848
|
+
const walker = document.createTreeWalker(n, 1);
|
|
849
|
+
n.setAttribute(id, "");
|
|
850
|
+
let child;
|
|
851
|
+
while (child = walker.nextNode()) child.setAttribute(id, "");
|
|
852
|
+
}
|
|
853
|
+
parent.insertBefore(n, o);
|
|
854
|
+
replacementNodes.push(n);
|
|
855
|
+
}
|
|
856
|
+
else while (o.firstChild) {
|
|
857
|
+
const child = o.firstChild;
|
|
858
|
+
parent.insertBefore(child, o);
|
|
859
|
+
replacementNodes.push(child);
|
|
860
|
+
}
|
|
861
|
+
parent.removeChild(o);
|
|
862
|
+
slotReplacements.set(o, replacementNodes);
|
|
863
|
+
}
|
|
864
|
+
this._updateSlotNodes(slotReplacements);
|
|
865
|
+
}
|
|
866
|
+
/**
|
|
867
|
+
* @internal
|
|
868
|
+
*/
|
|
869
|
+
_getSlots() {
|
|
870
|
+
const roots = [this];
|
|
871
|
+
if (this._teleportTargets) roots.push(...this._teleportTargets);
|
|
872
|
+
const slots = /* @__PURE__ */ new Set();
|
|
873
|
+
for (const root of roots) {
|
|
874
|
+
const found = root.querySelectorAll("slot");
|
|
875
|
+
for (let i = 0; i < found.length; i++) slots.add(found[i]);
|
|
876
|
+
}
|
|
877
|
+
return Array.from(slots);
|
|
878
|
+
}
|
|
879
|
+
/**
|
|
880
|
+
* @internal
|
|
881
|
+
*/
|
|
882
|
+
_injectChildStyle(comp, parentComp) {
|
|
883
|
+
this._applyStyles(comp.styles, comp, parentComp);
|
|
884
|
+
}
|
|
885
|
+
/**
|
|
886
|
+
* @internal
|
|
887
|
+
*/
|
|
888
|
+
_beginPatch() {
|
|
889
|
+
this._patching = true;
|
|
890
|
+
this._dirty = false;
|
|
891
|
+
}
|
|
892
|
+
/**
|
|
893
|
+
* @internal
|
|
894
|
+
*/
|
|
895
|
+
_endPatch() {
|
|
896
|
+
this._patching = false;
|
|
897
|
+
if (this._dirty && this._instance) this._update();
|
|
898
|
+
}
|
|
899
|
+
/**
|
|
900
|
+
* @internal
|
|
901
|
+
*/
|
|
902
|
+
_hasShadowRoot() {
|
|
903
|
+
return this._def.shadowRoot !== false;
|
|
904
|
+
}
|
|
905
|
+
/**
|
|
906
|
+
* @internal
|
|
907
|
+
*/
|
|
908
|
+
_removeChildStyle(comp) {
|
|
909
|
+
this._styleChildren.delete(comp);
|
|
910
|
+
this._styleAnchors.delete(comp);
|
|
911
|
+
if (this._childStyles && comp.__hmrId) {
|
|
912
|
+
const oldStyles = this._childStyles.get(comp.__hmrId);
|
|
913
|
+
if (oldStyles) {
|
|
914
|
+
oldStyles.forEach((s) => this._root.removeChild(s));
|
|
915
|
+
oldStyles.length = 0;
|
|
916
|
+
}
|
|
917
|
+
}
|
|
918
|
+
}
|
|
919
|
+
};
|
|
920
|
+
var VueElement = class extends VueElementBase {
|
|
921
|
+
constructor(def, props = {}, createAppFn = createApp) {
|
|
922
|
+
super(def, props, createAppFn);
|
|
923
|
+
}
|
|
924
|
+
_needsHydration() {
|
|
925
|
+
if (this.shadowRoot && this._createApp !== createApp) return true;
|
|
926
|
+
else if (this.shadowRoot) (0, _vue_runtime_core.warn)("Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use `defineSSRCustomElement`.");
|
|
927
|
+
return false;
|
|
928
|
+
}
|
|
929
|
+
_mount(def) {
|
|
930
|
+
if (!def.name) def.name = "VueElement";
|
|
931
|
+
this._app = this._createApp(def);
|
|
932
|
+
this._inheritParentContext();
|
|
933
|
+
if (def.configureApp) def.configureApp(this._app);
|
|
934
|
+
this._app._ceVNode = this._createVNode();
|
|
935
|
+
this._app.mount(this._root);
|
|
936
|
+
}
|
|
937
|
+
_update() {
|
|
938
|
+
if (!this._app) return;
|
|
939
|
+
const vnode = this._createVNode();
|
|
940
|
+
vnode.appContext = this._app._context;
|
|
941
|
+
render(vnode, this._root);
|
|
942
|
+
}
|
|
943
|
+
_unmount() {
|
|
944
|
+
if (this._app) this._app.unmount();
|
|
945
|
+
if (this._instance && this._instance.ce) this._instance.ce = void 0;
|
|
946
|
+
this._app = this._instance = null;
|
|
947
|
+
}
|
|
948
|
+
/**
|
|
949
|
+
* Only called when shadowRoot is false
|
|
950
|
+
*/
|
|
951
|
+
_updateSlotNodes(replacements) {}
|
|
952
|
+
_createVNode() {
|
|
953
|
+
const baseProps = {};
|
|
954
|
+
if (!this.shadowRoot) baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
|
|
955
|
+
const vnode = (0, _vue_runtime_core.createVNode)(this._def, (0, _vue_shared.extend)(baseProps, this._props));
|
|
956
|
+
if (!this._instance) vnode.ce = (instance) => {
|
|
957
|
+
this._instance = instance;
|
|
958
|
+
this._processInstance();
|
|
959
|
+
};
|
|
960
|
+
return vnode;
|
|
961
|
+
}
|
|
765
962
|
};
|
|
766
|
-
class VueElementBase extends BaseClass {
|
|
767
|
-
constructor(def, props = {}, createAppFn) {
|
|
768
|
-
super();
|
|
769
|
-
this._isVueCE = true;
|
|
770
|
-
/**
|
|
771
|
-
* @internal
|
|
772
|
-
*/
|
|
773
|
-
this._instance = null;
|
|
774
|
-
/**
|
|
775
|
-
* @internal
|
|
776
|
-
*/
|
|
777
|
-
this._app = null;
|
|
778
|
-
this._connected = false;
|
|
779
|
-
this._resolved = false;
|
|
780
|
-
this._numberProps = null;
|
|
781
|
-
this._styleChildren = /* @__PURE__ */ new WeakSet();
|
|
782
|
-
this._patching = false;
|
|
783
|
-
this._dirty = false;
|
|
784
|
-
this._ob = null;
|
|
785
|
-
this._def = def;
|
|
786
|
-
this._props = props;
|
|
787
|
-
this._createApp = createAppFn;
|
|
788
|
-
this._nonce = def.nonce;
|
|
789
|
-
if (this._needsHydration()) {
|
|
790
|
-
this._root = this.shadowRoot;
|
|
791
|
-
} else {
|
|
792
|
-
if (def.shadowRoot !== false) {
|
|
793
|
-
this.attachShadow(
|
|
794
|
-
shared.extend({}, def.shadowRootOptions, {
|
|
795
|
-
mode: "open"
|
|
796
|
-
})
|
|
797
|
-
);
|
|
798
|
-
this._root = this.shadowRoot;
|
|
799
|
-
} else {
|
|
800
|
-
this._root = this;
|
|
801
|
-
}
|
|
802
|
-
}
|
|
803
|
-
}
|
|
804
|
-
connectedCallback() {
|
|
805
|
-
if (!this.isConnected) return;
|
|
806
|
-
if (!this.shadowRoot && !this._resolved) {
|
|
807
|
-
this._parseSlots();
|
|
808
|
-
}
|
|
809
|
-
this._connected = true;
|
|
810
|
-
let parent = this;
|
|
811
|
-
while (parent = parent && (parent.parentNode || parent.host)) {
|
|
812
|
-
if (parent instanceof VueElementBase) {
|
|
813
|
-
this._parent = parent;
|
|
814
|
-
break;
|
|
815
|
-
}
|
|
816
|
-
}
|
|
817
|
-
if (!this._instance) {
|
|
818
|
-
if (this._resolved) {
|
|
819
|
-
this._mountComponent(this._def);
|
|
820
|
-
} else {
|
|
821
|
-
if (parent && parent._pendingResolve) {
|
|
822
|
-
this._pendingResolve = parent._pendingResolve.then(() => {
|
|
823
|
-
this._pendingResolve = void 0;
|
|
824
|
-
this._resolveDef();
|
|
825
|
-
});
|
|
826
|
-
} else {
|
|
827
|
-
this._resolveDef();
|
|
828
|
-
}
|
|
829
|
-
}
|
|
830
|
-
}
|
|
831
|
-
}
|
|
832
|
-
disconnectedCallback() {
|
|
833
|
-
this._connected = false;
|
|
834
|
-
runtimeCore.nextTick(() => {
|
|
835
|
-
if (!this._connected) {
|
|
836
|
-
if (this._ob) {
|
|
837
|
-
this._ob.disconnect();
|
|
838
|
-
this._ob = null;
|
|
839
|
-
}
|
|
840
|
-
this._unmount();
|
|
841
|
-
if (this._teleportTargets) {
|
|
842
|
-
this._teleportTargets.clear();
|
|
843
|
-
this._teleportTargets = void 0;
|
|
844
|
-
}
|
|
845
|
-
}
|
|
846
|
-
});
|
|
847
|
-
}
|
|
848
|
-
_setParent(parent = this._parent) {
|
|
849
|
-
if (parent && this._instance) {
|
|
850
|
-
this._instance.parent = parent._instance;
|
|
851
|
-
this._inheritParentContext(parent);
|
|
852
|
-
}
|
|
853
|
-
}
|
|
854
|
-
_inheritParentContext(parent = this._parent) {
|
|
855
|
-
if (parent && this._app) {
|
|
856
|
-
Object.setPrototypeOf(
|
|
857
|
-
this._app._context.provides,
|
|
858
|
-
parent._instance.provides
|
|
859
|
-
);
|
|
860
|
-
}
|
|
861
|
-
}
|
|
862
|
-
_processMutations(mutations) {
|
|
863
|
-
for (const m of mutations) {
|
|
864
|
-
this._setAttr(m.attributeName);
|
|
865
|
-
}
|
|
866
|
-
}
|
|
867
|
-
/**
|
|
868
|
-
* resolve inner component definition (handle possible async component)
|
|
869
|
-
*/
|
|
870
|
-
_resolveDef() {
|
|
871
|
-
if (this._pendingResolve) {
|
|
872
|
-
return;
|
|
873
|
-
}
|
|
874
|
-
for (let i = 0; i < this.attributes.length; i++) {
|
|
875
|
-
this._setAttr(this.attributes[i].name);
|
|
876
|
-
}
|
|
877
|
-
this._ob = new MutationObserver(this._processMutations.bind(this));
|
|
878
|
-
this._ob.observe(this, { attributes: true });
|
|
879
|
-
const resolve = (def) => {
|
|
880
|
-
this._resolved = true;
|
|
881
|
-
this._pendingResolve = void 0;
|
|
882
|
-
const { props, styles } = def;
|
|
883
|
-
let numberProps;
|
|
884
|
-
if (props && !shared.isArray(props)) {
|
|
885
|
-
for (const key in props) {
|
|
886
|
-
const opt = props[key];
|
|
887
|
-
if (opt === Number || opt && opt.type === Number) {
|
|
888
|
-
if (key in this._props) {
|
|
889
|
-
this._props[key] = shared.toNumber(this._props[key]);
|
|
890
|
-
}
|
|
891
|
-
(numberProps || (numberProps = /* @__PURE__ */ Object.create(null)))[shared.camelize(key)] = true;
|
|
892
|
-
}
|
|
893
|
-
}
|
|
894
|
-
}
|
|
895
|
-
this._numberProps = numberProps;
|
|
896
|
-
this._resolveProps(def);
|
|
897
|
-
if (this.shadowRoot) {
|
|
898
|
-
this._applyStyles(styles);
|
|
899
|
-
} else if (styles) {
|
|
900
|
-
runtimeCore.warn(
|
|
901
|
-
"Custom element style injection is not supported when using shadowRoot: false"
|
|
902
|
-
);
|
|
903
|
-
}
|
|
904
|
-
this._mountComponent(def);
|
|
905
|
-
};
|
|
906
|
-
const asyncDef = this._def.__asyncLoader;
|
|
907
|
-
if (asyncDef) {
|
|
908
|
-
const { configureApp } = this._def;
|
|
909
|
-
this._pendingResolve = asyncDef().then((def) => {
|
|
910
|
-
def.configureApp = configureApp;
|
|
911
|
-
this._def = def;
|
|
912
|
-
resolve(def);
|
|
913
|
-
});
|
|
914
|
-
} else {
|
|
915
|
-
resolve(this._def);
|
|
916
|
-
}
|
|
917
|
-
}
|
|
918
|
-
_mountComponent(def) {
|
|
919
|
-
this._mount(def);
|
|
920
|
-
this._processExposed();
|
|
921
|
-
}
|
|
922
|
-
_processExposed() {
|
|
923
|
-
const exposed = this._instance && this._instance.exposed;
|
|
924
|
-
if (!exposed) return;
|
|
925
|
-
for (const key in exposed) {
|
|
926
|
-
if (!shared.hasOwn(this, key)) {
|
|
927
|
-
Object.defineProperty(this, key, {
|
|
928
|
-
// unwrap ref to be consistent with public instance behavior
|
|
929
|
-
get: () => runtimeCore.unref(exposed[key])
|
|
930
|
-
});
|
|
931
|
-
} else {
|
|
932
|
-
runtimeCore.warn(`Exposed property "${key}" already exists on custom element.`);
|
|
933
|
-
}
|
|
934
|
-
}
|
|
935
|
-
}
|
|
936
|
-
_processInstance() {
|
|
937
|
-
this._instance.ce = this;
|
|
938
|
-
this._instance.isCE = true;
|
|
939
|
-
{
|
|
940
|
-
this._instance.ceReload = (newStyles) => {
|
|
941
|
-
if (this._styles) {
|
|
942
|
-
this._styles.forEach((s) => this._root.removeChild(s));
|
|
943
|
-
this._styles.length = 0;
|
|
944
|
-
}
|
|
945
|
-
this._applyStyles(newStyles);
|
|
946
|
-
if (!this._instance.vapor) {
|
|
947
|
-
this._instance = null;
|
|
948
|
-
}
|
|
949
|
-
this._update();
|
|
950
|
-
};
|
|
951
|
-
}
|
|
952
|
-
const dispatch = (event, args) => {
|
|
953
|
-
this.dispatchEvent(
|
|
954
|
-
new CustomEvent(
|
|
955
|
-
event,
|
|
956
|
-
shared.isPlainObject(args[0]) ? shared.extend({ detail: args }, args[0]) : { detail: args }
|
|
957
|
-
)
|
|
958
|
-
);
|
|
959
|
-
};
|
|
960
|
-
this._instance.emit = (event, ...args) => {
|
|
961
|
-
dispatch(event, args);
|
|
962
|
-
if (shared.hyphenate(event) !== event) {
|
|
963
|
-
dispatch(shared.hyphenate(event), args);
|
|
964
|
-
}
|
|
965
|
-
};
|
|
966
|
-
this._setParent();
|
|
967
|
-
}
|
|
968
|
-
_resolveProps(def) {
|
|
969
|
-
const { props } = def;
|
|
970
|
-
const declaredPropKeys = shared.isArray(props) ? props : Object.keys(props || {});
|
|
971
|
-
for (const key of Object.keys(this)) {
|
|
972
|
-
if (key[0] !== "_" && declaredPropKeys.includes(key)) {
|
|
973
|
-
this._setProp(key, this[key]);
|
|
974
|
-
}
|
|
975
|
-
}
|
|
976
|
-
for (const key of declaredPropKeys.map(shared.camelize)) {
|
|
977
|
-
Object.defineProperty(this, key, {
|
|
978
|
-
get() {
|
|
979
|
-
return this._getProp(key);
|
|
980
|
-
},
|
|
981
|
-
set(val) {
|
|
982
|
-
this._setProp(key, val, true, !this._patching);
|
|
983
|
-
}
|
|
984
|
-
});
|
|
985
|
-
}
|
|
986
|
-
}
|
|
987
|
-
_setAttr(key) {
|
|
988
|
-
if (key.startsWith("data-v-")) return;
|
|
989
|
-
const has = this.hasAttribute(key);
|
|
990
|
-
let value = has ? this.getAttribute(key) : REMOVAL;
|
|
991
|
-
const camelKey = shared.camelize(key);
|
|
992
|
-
if (has && this._numberProps && this._numberProps[camelKey]) {
|
|
993
|
-
value = shared.toNumber(value);
|
|
994
|
-
}
|
|
995
|
-
this._setProp(camelKey, value, false, true);
|
|
996
|
-
}
|
|
997
|
-
/**
|
|
998
|
-
* @internal
|
|
999
|
-
*/
|
|
1000
|
-
_getProp(key) {
|
|
1001
|
-
return this._props[key];
|
|
1002
|
-
}
|
|
1003
|
-
/**
|
|
1004
|
-
* @internal
|
|
1005
|
-
*/
|
|
1006
|
-
_setProp(key, val, shouldReflect = true, shouldUpdate = false) {
|
|
1007
|
-
if (val !== this._props[key]) {
|
|
1008
|
-
this._dirty = true;
|
|
1009
|
-
if (val === REMOVAL) {
|
|
1010
|
-
delete this._props[key];
|
|
1011
|
-
} else {
|
|
1012
|
-
this._props[key] = val;
|
|
1013
|
-
if (key === "key" && this._app && this._app._ceVNode) {
|
|
1014
|
-
this._app._ceVNode.key = val;
|
|
1015
|
-
}
|
|
1016
|
-
}
|
|
1017
|
-
if (shouldUpdate && this._instance) {
|
|
1018
|
-
this._update();
|
|
1019
|
-
}
|
|
1020
|
-
if (shouldReflect) {
|
|
1021
|
-
const ob = this._ob;
|
|
1022
|
-
if (ob) {
|
|
1023
|
-
this._processMutations(ob.takeRecords());
|
|
1024
|
-
ob.disconnect();
|
|
1025
|
-
}
|
|
1026
|
-
if (val === true) {
|
|
1027
|
-
this.setAttribute(shared.hyphenate(key), "");
|
|
1028
|
-
} else if (typeof val === "string" || typeof val === "number") {
|
|
1029
|
-
this.setAttribute(shared.hyphenate(key), val + "");
|
|
1030
|
-
} else if (!val) {
|
|
1031
|
-
this.removeAttribute(shared.hyphenate(key));
|
|
1032
|
-
}
|
|
1033
|
-
ob && ob.observe(this, { attributes: true });
|
|
1034
|
-
}
|
|
1035
|
-
}
|
|
1036
|
-
}
|
|
1037
|
-
_applyStyles(styles, owner) {
|
|
1038
|
-
if (!styles) return;
|
|
1039
|
-
if (owner) {
|
|
1040
|
-
if (owner === this._def || this._styleChildren.has(owner)) {
|
|
1041
|
-
return;
|
|
1042
|
-
}
|
|
1043
|
-
this._styleChildren.add(owner);
|
|
1044
|
-
}
|
|
1045
|
-
const nonce = this._nonce;
|
|
1046
|
-
for (let i = styles.length - 1; i >= 0; i--) {
|
|
1047
|
-
const s = document.createElement("style");
|
|
1048
|
-
if (nonce) s.setAttribute("nonce", nonce);
|
|
1049
|
-
s.textContent = styles[i];
|
|
1050
|
-
this.shadowRoot.prepend(s);
|
|
1051
|
-
{
|
|
1052
|
-
if (owner) {
|
|
1053
|
-
if (owner.__hmrId) {
|
|
1054
|
-
if (!this._childStyles) this._childStyles = /* @__PURE__ */ new Map();
|
|
1055
|
-
let entry = this._childStyles.get(owner.__hmrId);
|
|
1056
|
-
if (!entry) {
|
|
1057
|
-
this._childStyles.set(owner.__hmrId, entry = []);
|
|
1058
|
-
}
|
|
1059
|
-
entry.push(s);
|
|
1060
|
-
}
|
|
1061
|
-
} else {
|
|
1062
|
-
(this._styles || (this._styles = [])).push(s);
|
|
1063
|
-
}
|
|
1064
|
-
}
|
|
1065
|
-
}
|
|
1066
|
-
}
|
|
1067
|
-
/**
|
|
1068
|
-
* Only called when shadowRoot is false
|
|
1069
|
-
*/
|
|
1070
|
-
_parseSlots() {
|
|
1071
|
-
const slots = this._slots = {};
|
|
1072
|
-
let n;
|
|
1073
|
-
while (n = this.firstChild) {
|
|
1074
|
-
const slotName = n.nodeType === 1 && n.getAttribute("slot") || "default";
|
|
1075
|
-
(slots[slotName] || (slots[slotName] = [])).push(n);
|
|
1076
|
-
this.removeChild(n);
|
|
1077
|
-
}
|
|
1078
|
-
}
|
|
1079
|
-
/**
|
|
1080
|
-
* Only called when shadowRoot is false
|
|
1081
|
-
*/
|
|
1082
|
-
_renderSlots() {
|
|
1083
|
-
const outlets = this._getSlots();
|
|
1084
|
-
const scopeId = this._instance.type.__scopeId;
|
|
1085
|
-
const slotReplacements = /* @__PURE__ */ new Map();
|
|
1086
|
-
for (let i = 0; i < outlets.length; i++) {
|
|
1087
|
-
const o = outlets[i];
|
|
1088
|
-
const slotName = o.getAttribute("name") || "default";
|
|
1089
|
-
const content = this._slots[slotName];
|
|
1090
|
-
const parent = o.parentNode;
|
|
1091
|
-
const replacementNodes = [];
|
|
1092
|
-
if (content) {
|
|
1093
|
-
for (const n of content) {
|
|
1094
|
-
if (scopeId && n.nodeType === 1) {
|
|
1095
|
-
const id = scopeId + "-s";
|
|
1096
|
-
const walker = document.createTreeWalker(n, 1);
|
|
1097
|
-
n.setAttribute(id, "");
|
|
1098
|
-
let child;
|
|
1099
|
-
while (child = walker.nextNode()) {
|
|
1100
|
-
child.setAttribute(id, "");
|
|
1101
|
-
}
|
|
1102
|
-
}
|
|
1103
|
-
parent.insertBefore(n, o);
|
|
1104
|
-
replacementNodes.push(n);
|
|
1105
|
-
}
|
|
1106
|
-
} else {
|
|
1107
|
-
while (o.firstChild) {
|
|
1108
|
-
const child = o.firstChild;
|
|
1109
|
-
parent.insertBefore(child, o);
|
|
1110
|
-
replacementNodes.push(child);
|
|
1111
|
-
}
|
|
1112
|
-
}
|
|
1113
|
-
parent.removeChild(o);
|
|
1114
|
-
slotReplacements.set(o, replacementNodes);
|
|
1115
|
-
}
|
|
1116
|
-
this._updateSlotNodes(slotReplacements);
|
|
1117
|
-
}
|
|
1118
|
-
/**
|
|
1119
|
-
* @internal
|
|
1120
|
-
*/
|
|
1121
|
-
_getSlots() {
|
|
1122
|
-
const roots = [this];
|
|
1123
|
-
if (this._teleportTargets) {
|
|
1124
|
-
roots.push(...this._teleportTargets);
|
|
1125
|
-
}
|
|
1126
|
-
const slots = /* @__PURE__ */ new Set();
|
|
1127
|
-
for (const root of roots) {
|
|
1128
|
-
const found = root.querySelectorAll("slot");
|
|
1129
|
-
for (let i = 0; i < found.length; i++) {
|
|
1130
|
-
slots.add(found[i]);
|
|
1131
|
-
}
|
|
1132
|
-
}
|
|
1133
|
-
return Array.from(slots);
|
|
1134
|
-
}
|
|
1135
|
-
/**
|
|
1136
|
-
* @internal
|
|
1137
|
-
*/
|
|
1138
|
-
_injectChildStyle(comp) {
|
|
1139
|
-
this._applyStyles(comp.styles, comp);
|
|
1140
|
-
}
|
|
1141
|
-
/**
|
|
1142
|
-
* @internal
|
|
1143
|
-
*/
|
|
1144
|
-
_beginPatch() {
|
|
1145
|
-
this._patching = true;
|
|
1146
|
-
this._dirty = false;
|
|
1147
|
-
}
|
|
1148
|
-
/**
|
|
1149
|
-
* @internal
|
|
1150
|
-
*/
|
|
1151
|
-
_endPatch() {
|
|
1152
|
-
this._patching = false;
|
|
1153
|
-
if (this._dirty && this._instance) {
|
|
1154
|
-
this._update();
|
|
1155
|
-
}
|
|
1156
|
-
}
|
|
1157
|
-
/**
|
|
1158
|
-
* @internal
|
|
1159
|
-
*/
|
|
1160
|
-
_removeChildStyle(comp) {
|
|
1161
|
-
{
|
|
1162
|
-
this._styleChildren.delete(comp);
|
|
1163
|
-
if (this._childStyles && comp.__hmrId) {
|
|
1164
|
-
const oldStyles = this._childStyles.get(comp.__hmrId);
|
|
1165
|
-
if (oldStyles) {
|
|
1166
|
-
oldStyles.forEach((s) => this._root.removeChild(s));
|
|
1167
|
-
oldStyles.length = 0;
|
|
1168
|
-
}
|
|
1169
|
-
}
|
|
1170
|
-
}
|
|
1171
|
-
}
|
|
1172
|
-
}
|
|
1173
|
-
class VueElement extends VueElementBase {
|
|
1174
|
-
constructor(def, props = {}, createAppFn = createApp) {
|
|
1175
|
-
super(def, props, createAppFn);
|
|
1176
|
-
}
|
|
1177
|
-
_needsHydration() {
|
|
1178
|
-
if (this.shadowRoot && this._createApp !== createApp) {
|
|
1179
|
-
return true;
|
|
1180
|
-
} else {
|
|
1181
|
-
if (this.shadowRoot) {
|
|
1182
|
-
runtimeCore.warn(
|
|
1183
|
-
`Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
|
|
1184
|
-
);
|
|
1185
|
-
}
|
|
1186
|
-
}
|
|
1187
|
-
return false;
|
|
1188
|
-
}
|
|
1189
|
-
_mount(def) {
|
|
1190
|
-
if (!def.name) {
|
|
1191
|
-
def.name = "VueElement";
|
|
1192
|
-
}
|
|
1193
|
-
this._app = this._createApp(def);
|
|
1194
|
-
this._inheritParentContext();
|
|
1195
|
-
if (def.configureApp) {
|
|
1196
|
-
def.configureApp(this._app);
|
|
1197
|
-
}
|
|
1198
|
-
this._app._ceVNode = this._createVNode();
|
|
1199
|
-
this._app.mount(this._root);
|
|
1200
|
-
}
|
|
1201
|
-
_update() {
|
|
1202
|
-
if (!this._app) return;
|
|
1203
|
-
const vnode = this._createVNode();
|
|
1204
|
-
vnode.appContext = this._app._context;
|
|
1205
|
-
render(vnode, this._root);
|
|
1206
|
-
}
|
|
1207
|
-
_unmount() {
|
|
1208
|
-
if (this._app) {
|
|
1209
|
-
this._app.unmount();
|
|
1210
|
-
}
|
|
1211
|
-
if (this._instance && this._instance.ce) {
|
|
1212
|
-
this._instance.ce = void 0;
|
|
1213
|
-
}
|
|
1214
|
-
this._app = this._instance = null;
|
|
1215
|
-
}
|
|
1216
|
-
/**
|
|
1217
|
-
* Only called when shadowRoot is false
|
|
1218
|
-
*/
|
|
1219
|
-
_updateSlotNodes(replacements) {
|
|
1220
|
-
}
|
|
1221
|
-
_createVNode() {
|
|
1222
|
-
const baseProps = {};
|
|
1223
|
-
if (!this.shadowRoot) {
|
|
1224
|
-
baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
|
|
1225
|
-
}
|
|
1226
|
-
const vnode = runtimeCore.createVNode(this._def, shared.extend(baseProps, this._props));
|
|
1227
|
-
if (!this._instance) {
|
|
1228
|
-
vnode.ce = (instance) => {
|
|
1229
|
-
this._instance = instance;
|
|
1230
|
-
this._processInstance();
|
|
1231
|
-
};
|
|
1232
|
-
}
|
|
1233
|
-
return vnode;
|
|
1234
|
-
}
|
|
1235
|
-
}
|
|
1236
963
|
function useHost(caller) {
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
runtimeCore.warn(
|
|
1244
|
-
`${caller || "useHost"} called without an active component instance.`
|
|
1245
|
-
);
|
|
1246
|
-
} else {
|
|
1247
|
-
runtimeCore.warn(
|
|
1248
|
-
`${caller || "useHost"} can only be used in components defined via defineCustomElement.`
|
|
1249
|
-
);
|
|
1250
|
-
}
|
|
1251
|
-
}
|
|
1252
|
-
return null;
|
|
964
|
+
const { hasInstance, value } = (0, _vue_runtime_core.useInstanceOption)("ce", true);
|
|
965
|
+
const el = value;
|
|
966
|
+
if (el) return el;
|
|
967
|
+
else if (!hasInstance) (0, _vue_runtime_core.warn)(`${caller || "useHost"} called without an active component instance.`);
|
|
968
|
+
else (0, _vue_runtime_core.warn)(`${caller || "useHost"} can only be used in components defined via defineCustomElement.`);
|
|
969
|
+
return null;
|
|
1253
970
|
}
|
|
971
|
+
/**
|
|
972
|
+
* Retrieve the shadowRoot of the current custom element. Only usable in setup()
|
|
973
|
+
* of a `defineCustomElement` component.
|
|
974
|
+
*/
|
|
1254
975
|
function useShadowRoot() {
|
|
1255
|
-
|
|
1256
|
-
|
|
976
|
+
const el = useHost("useShadowRoot");
|
|
977
|
+
return el && el.shadowRoot;
|
|
1257
978
|
}
|
|
1258
|
-
|
|
979
|
+
//#endregion
|
|
980
|
+
//#region packages/runtime-dom/src/helpers/useCssModule.ts
|
|
1259
981
|
function useCssModule(name = "$style") {
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
982
|
+
{
|
|
983
|
+
const { hasInstance, value: type } = (0, _vue_runtime_core.useInstanceOption)("type", true);
|
|
984
|
+
if (!hasInstance) {
|
|
985
|
+
(0, _vue_runtime_core.warn)(`useCssModule must be called inside setup()`);
|
|
986
|
+
return _vue_shared.EMPTY_OBJ;
|
|
987
|
+
}
|
|
988
|
+
const modules = type.__cssModules;
|
|
989
|
+
if (!modules) {
|
|
990
|
+
(0, _vue_runtime_core.warn)(`Current instance does not have CSS modules injected.`);
|
|
991
|
+
return _vue_shared.EMPTY_OBJ;
|
|
992
|
+
}
|
|
993
|
+
const mod = modules[name];
|
|
994
|
+
if (!mod) {
|
|
995
|
+
(0, _vue_runtime_core.warn)(`Current instance does not have CSS module named "${name}".`);
|
|
996
|
+
return _vue_shared.EMPTY_OBJ;
|
|
997
|
+
}
|
|
998
|
+
return mod;
|
|
999
|
+
}
|
|
1278
1000
|
}
|
|
1279
|
-
|
|
1001
|
+
//#endregion
|
|
1002
|
+
//#region packages/runtime-dom/src/components/TransitionGroup.ts
|
|
1280
1003
|
const positionMap = /* @__PURE__ */ new WeakMap();
|
|
1281
1004
|
const newPositionMap = /* @__PURE__ */ new WeakMap();
|
|
1282
1005
|
const moveCbKey = Symbol("_moveCb");
|
|
1283
1006
|
const enterCbKey = Symbol("_enterCb");
|
|
1007
|
+
/**
|
|
1008
|
+
* Wrap logic that modifies TransitionGroup properties in a function
|
|
1009
|
+
* so that it can be annotated as pure
|
|
1010
|
+
*/
|
|
1284
1011
|
const decorate = (t) => {
|
|
1285
|
-
|
|
1286
|
-
|
|
1012
|
+
delete t.props.mode;
|
|
1013
|
+
return t;
|
|
1287
1014
|
};
|
|
1288
|
-
const
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
instance
|
|
1339
|
-
)
|
|
1340
|
-
);
|
|
1341
|
-
positionMap.set(child, {
|
|
1342
|
-
left: child.el.offsetLeft,
|
|
1343
|
-
top: child.el.offsetTop
|
|
1344
|
-
});
|
|
1345
|
-
}
|
|
1346
|
-
}
|
|
1347
|
-
}
|
|
1348
|
-
children = slots.default ? runtimeCore.getTransitionRawChildren(slots.default()) : [];
|
|
1349
|
-
for (let i = 0; i < children.length; i++) {
|
|
1350
|
-
const child = children[i];
|
|
1351
|
-
if (child.key != null) {
|
|
1352
|
-
runtimeCore.setTransitionHooks(
|
|
1353
|
-
child,
|
|
1354
|
-
runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance)
|
|
1355
|
-
);
|
|
1356
|
-
} else if (child.type !== runtimeCore.Text) {
|
|
1357
|
-
runtimeCore.warn(`<TransitionGroup> children must be keyed.`);
|
|
1358
|
-
}
|
|
1359
|
-
}
|
|
1360
|
-
return runtimeCore.createVNode(tag, null, children);
|
|
1361
|
-
};
|
|
1362
|
-
}
|
|
1015
|
+
const TransitionGroup = /* @__PURE__ */ decorate({
|
|
1016
|
+
name: "TransitionGroup",
|
|
1017
|
+
props: /* @__PURE__ */ (0, _vue_shared.extend)({}, TransitionPropsValidators, {
|
|
1018
|
+
tag: String,
|
|
1019
|
+
moveClass: String
|
|
1020
|
+
}),
|
|
1021
|
+
setup(props, { slots }) {
|
|
1022
|
+
const instance = (0, _vue_runtime_core.getCurrentInstance)();
|
|
1023
|
+
const state = (0, _vue_runtime_core.useTransitionState)();
|
|
1024
|
+
let prevChildren;
|
|
1025
|
+
let children;
|
|
1026
|
+
(0, _vue_runtime_core.onUpdated)(() => {
|
|
1027
|
+
if (!prevChildren.length) return;
|
|
1028
|
+
const moveClass = props.moveClass || `${props.name || "v"}-move`;
|
|
1029
|
+
if (!hasCSSTransform(prevChildren[0].el, instance.vnode.el, moveClass)) {
|
|
1030
|
+
prevChildren = [];
|
|
1031
|
+
return;
|
|
1032
|
+
}
|
|
1033
|
+
prevChildren.forEach((vnode) => callPendingCbs(vnode.el));
|
|
1034
|
+
prevChildren.forEach(recordPosition);
|
|
1035
|
+
const movedChildren = prevChildren.filter(applyTranslation);
|
|
1036
|
+
forceReflow(instance.vnode.el);
|
|
1037
|
+
movedChildren.forEach((c) => {
|
|
1038
|
+
const el = c.el;
|
|
1039
|
+
handleMovedChildren(el, moveClass);
|
|
1040
|
+
});
|
|
1041
|
+
prevChildren = [];
|
|
1042
|
+
});
|
|
1043
|
+
return () => {
|
|
1044
|
+
const rawProps = (0, _vue_runtime_core.toRaw)(props);
|
|
1045
|
+
const cssTransitionProps = resolveTransitionProps(rawProps);
|
|
1046
|
+
let tag = rawProps.tag || _vue_runtime_core.Fragment;
|
|
1047
|
+
prevChildren = [];
|
|
1048
|
+
if (children) for (let i = 0; i < children.length; i++) {
|
|
1049
|
+
const child = children[i];
|
|
1050
|
+
if (child.el && child.el instanceof Element) {
|
|
1051
|
+
prevChildren.push(child);
|
|
1052
|
+
(0, _vue_runtime_core.setTransitionHooks)(child, (0, _vue_runtime_core.resolveTransitionHooks)(child, cssTransitionProps, state, instance));
|
|
1053
|
+
positionMap.set(child, getPosition(child.el));
|
|
1054
|
+
}
|
|
1055
|
+
}
|
|
1056
|
+
children = slots.default ? (0, _vue_runtime_core.getTransitionRawChildren)(slots.default()) : [];
|
|
1057
|
+
for (let i = 0; i < children.length; i++) {
|
|
1058
|
+
const child = children[i];
|
|
1059
|
+
if (child.key != null) (0, _vue_runtime_core.setTransitionHooks)(child, (0, _vue_runtime_core.resolveTransitionHooks)(child, cssTransitionProps, state, instance));
|
|
1060
|
+
else if (child.type !== _vue_runtime_core.Text) (0, _vue_runtime_core.warn)(`<TransitionGroup> children must be keyed.`);
|
|
1061
|
+
}
|
|
1062
|
+
return (0, _vue_runtime_core.createVNode)(tag, null, children);
|
|
1063
|
+
};
|
|
1064
|
+
}
|
|
1363
1065
|
});
|
|
1364
|
-
const TransitionGroup = TransitionGroupImpl;
|
|
1365
1066
|
function callPendingCbs(el) {
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
}
|
|
1369
|
-
if (el[enterCbKey]) {
|
|
1370
|
-
el[enterCbKey]();
|
|
1371
|
-
}
|
|
1067
|
+
if (el[moveCbKey]) el[moveCbKey]();
|
|
1068
|
+
if (el[enterCbKey]) el[enterCbKey]();
|
|
1372
1069
|
}
|
|
1373
1070
|
function recordPosition(c) {
|
|
1374
|
-
|
|
1375
|
-
left: c.el.offsetLeft,
|
|
1376
|
-
top: c.el.offsetTop
|
|
1377
|
-
});
|
|
1071
|
+
newPositionMap.set(c, getPosition(c.el));
|
|
1378
1072
|
}
|
|
1379
1073
|
function applyTranslation(c) {
|
|
1380
|
-
|
|
1381
|
-
positionMap.get(c),
|
|
1382
|
-
newPositionMap.get(c),
|
|
1383
|
-
c.el
|
|
1384
|
-
)) {
|
|
1385
|
-
return c;
|
|
1386
|
-
}
|
|
1074
|
+
if (baseApplyTranslation(positionMap.get(c), newPositionMap.get(c), c.el)) return c;
|
|
1387
1075
|
}
|
|
1388
1076
|
function baseApplyTranslation(oldPos, newPos, el) {
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1077
|
+
const dx = oldPos.left - newPos.left;
|
|
1078
|
+
const dy = oldPos.top - newPos.top;
|
|
1079
|
+
if (dx || dy) {
|
|
1080
|
+
const s = el.style;
|
|
1081
|
+
const rect = el.getBoundingClientRect();
|
|
1082
|
+
let scaleX = 1;
|
|
1083
|
+
let scaleY = 1;
|
|
1084
|
+
if (el.offsetWidth) scaleX = rect.width / el.offsetWidth;
|
|
1085
|
+
if (el.offsetHeight) scaleY = rect.height / el.offsetHeight;
|
|
1086
|
+
if (!Number.isFinite(scaleX) || scaleX === 0) scaleX = 1;
|
|
1087
|
+
if (!Number.isFinite(scaleY) || scaleY === 0) scaleY = 1;
|
|
1088
|
+
if (Math.abs(scaleX - 1) < .01) scaleX = 1;
|
|
1089
|
+
if (Math.abs(scaleY - 1) < .01) scaleY = 1;
|
|
1090
|
+
s.transform = s.webkitTransform = `translate(${dx / scaleX}px,${dy / scaleY}px)`;
|
|
1091
|
+
s.transitionDuration = "0s";
|
|
1092
|
+
return true;
|
|
1093
|
+
}
|
|
1094
|
+
return false;
|
|
1095
|
+
}
|
|
1096
|
+
function getPosition(el) {
|
|
1097
|
+
const rect = el.getBoundingClientRect();
|
|
1098
|
+
return {
|
|
1099
|
+
left: rect.left,
|
|
1100
|
+
top: rect.top
|
|
1101
|
+
};
|
|
1398
1102
|
}
|
|
1399
1103
|
function hasCSSTransform(el, root, moveClass) {
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
container.removeChild(clone);
|
|
1413
|
-
return hasTransform;
|
|
1104
|
+
const clone = el.cloneNode();
|
|
1105
|
+
const _vtc = el[vtcKey];
|
|
1106
|
+
if (_vtc) _vtc.forEach((cls) => {
|
|
1107
|
+
cls.split(/\s+/).forEach((c) => c && clone.classList.remove(c));
|
|
1108
|
+
});
|
|
1109
|
+
moveClass.split(/\s+/).forEach((c) => c && clone.classList.add(c));
|
|
1110
|
+
clone.style.display = "none";
|
|
1111
|
+
const container = root.nodeType === 1 ? root : root.parentNode;
|
|
1112
|
+
container.appendChild(clone);
|
|
1113
|
+
const { hasTransform } = getTransitionInfo(clone);
|
|
1114
|
+
container.removeChild(clone);
|
|
1115
|
+
return hasTransform;
|
|
1414
1116
|
}
|
|
1415
1117
|
const handleMovedChildren = (el, moveClass) => {
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
};
|
|
1429
|
-
el.addEventListener("transitionend", cb);
|
|
1118
|
+
const style = el.style;
|
|
1119
|
+
addTransitionClass(el, moveClass);
|
|
1120
|
+
style.transform = style.webkitTransform = style.transitionDuration = "";
|
|
1121
|
+
const cb = el[moveCbKey] = (e) => {
|
|
1122
|
+
if (e && e.target !== el) return;
|
|
1123
|
+
if (!e || e.propertyName.endsWith("transform")) {
|
|
1124
|
+
el.removeEventListener("transitionend", cb);
|
|
1125
|
+
el[moveCbKey] = null;
|
|
1126
|
+
removeTransitionClass(el, moveClass);
|
|
1127
|
+
}
|
|
1128
|
+
};
|
|
1129
|
+
el.addEventListener("transitionend", cb);
|
|
1430
1130
|
};
|
|
1431
|
-
|
|
1131
|
+
//#endregion
|
|
1132
|
+
//#region packages/runtime-dom/src/directives/vModel.ts
|
|
1432
1133
|
const getModelAssigner = (vnode) => {
|
|
1433
|
-
|
|
1434
|
-
|
|
1134
|
+
const fn = vnode.props["onUpdate:modelValue"] || false;
|
|
1135
|
+
return (0, _vue_shared.isArray)(fn) ? (value) => (0, _vue_shared.invokeArrayFns)(fn, value) : fn;
|
|
1435
1136
|
};
|
|
1436
1137
|
function onCompositionStart(e) {
|
|
1437
|
-
|
|
1138
|
+
e.target.composing = true;
|
|
1438
1139
|
}
|
|
1439
1140
|
function onCompositionEnd(e) {
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1141
|
+
const target = e.target;
|
|
1142
|
+
if (target.composing) {
|
|
1143
|
+
target.composing = false;
|
|
1144
|
+
target.dispatchEvent(new Event("input"));
|
|
1145
|
+
}
|
|
1445
1146
|
}
|
|
1446
1147
|
const assignKey = Symbol("_assign");
|
|
1447
1148
|
const vModelText = {
|
|
1448
|
-
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
el.value = value == null ? "" : value;
|
|
1460
|
-
},
|
|
1461
|
-
beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
|
|
1462
|
-
el[assignKey] = getModelAssigner(vnode);
|
|
1463
|
-
vModelTextUpdate(el, oldValue, value, trim, number, lazy);
|
|
1464
|
-
}
|
|
1149
|
+
created(el, { modifiers: { lazy, trim, number } }, vnode) {
|
|
1150
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1151
|
+
vModelTextInit(el, trim, number || !!(vnode.props && vnode.props.type === "number"), lazy);
|
|
1152
|
+
},
|
|
1153
|
+
mounted(el, { value }) {
|
|
1154
|
+
el.value = value == null ? "" : value;
|
|
1155
|
+
},
|
|
1156
|
+
beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
|
|
1157
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1158
|
+
vModelTextUpdate(el, oldValue, value, trim, number, lazy);
|
|
1159
|
+
}
|
|
1465
1160
|
};
|
|
1466
1161
|
function castValue(value, trim, number) {
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1162
|
+
if (trim) value = value.trim();
|
|
1163
|
+
if (number) value = (0, _vue_shared.looseToNumber)(value);
|
|
1164
|
+
return value;
|
|
1470
1165
|
}
|
|
1166
|
+
/**
|
|
1167
|
+
* @internal
|
|
1168
|
+
*/
|
|
1471
1169
|
const vModelTextInit = (el, trim, number, lazy, set) => {
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
addEventListener(el, "compositionstart", onCompositionStart);
|
|
1485
|
-
addEventListener(el, "compositionend", onCompositionEnd);
|
|
1486
|
-
addEventListener(el, "change", onCompositionEnd);
|
|
1487
|
-
}
|
|
1170
|
+
addEventListener(el, lazy ? "change" : "input", (e) => {
|
|
1171
|
+
if (e.target.composing) return;
|
|
1172
|
+
(set || el[assignKey])(castValue(el.value, trim, number || el.type === "number"));
|
|
1173
|
+
});
|
|
1174
|
+
if (trim || number) addEventListener(el, "change", () => {
|
|
1175
|
+
el.value = castValue(el.value, trim, number || el.type === "number");
|
|
1176
|
+
});
|
|
1177
|
+
if (!lazy) {
|
|
1178
|
+
addEventListener(el, "compositionstart", onCompositionStart);
|
|
1179
|
+
addEventListener(el, "compositionend", onCompositionEnd);
|
|
1180
|
+
addEventListener(el, "change", onCompositionEnd);
|
|
1181
|
+
}
|
|
1488
1182
|
};
|
|
1183
|
+
/**
|
|
1184
|
+
* @internal
|
|
1185
|
+
*/
|
|
1489
1186
|
const vModelTextUpdate = (el, oldValue, value, trim, number, lazy) => {
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
if (trim && el.value.trim() === newValue) {
|
|
1501
|
-
return;
|
|
1502
|
-
}
|
|
1503
|
-
}
|
|
1504
|
-
el.value = newValue;
|
|
1187
|
+
if (el.composing) return;
|
|
1188
|
+
const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? (0, _vue_shared.looseToNumber)(el.value) : el.value;
|
|
1189
|
+
const newValue = value == null ? "" : value;
|
|
1190
|
+
if (elValue === newValue) return;
|
|
1191
|
+
const rootNode = el.getRootNode();
|
|
1192
|
+
if ((rootNode instanceof Document || rootNode instanceof ShadowRoot) && rootNode.activeElement === el && el.type !== "range") {
|
|
1193
|
+
if (lazy && value === oldValue) return;
|
|
1194
|
+
if (trim && el.value.trim() === newValue) return;
|
|
1195
|
+
}
|
|
1196
|
+
el.value = newValue;
|
|
1505
1197
|
};
|
|
1506
1198
|
const vModelCheckbox = {
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
vnode.props.value
|
|
1520
|
-
);
|
|
1521
|
-
},
|
|
1522
|
-
beforeUpdate(el, binding, vnode) {
|
|
1523
|
-
el[assignKey] = getModelAssigner(vnode);
|
|
1524
|
-
vModelCheckboxUpdate(
|
|
1525
|
-
el,
|
|
1526
|
-
binding.oldValue,
|
|
1527
|
-
binding.value,
|
|
1528
|
-
vnode.props.value
|
|
1529
|
-
);
|
|
1530
|
-
}
|
|
1199
|
+
deep: true,
|
|
1200
|
+
created(el, _, vnode) {
|
|
1201
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1202
|
+
vModelCheckboxInit(el);
|
|
1203
|
+
},
|
|
1204
|
+
mounted(el, binding, vnode) {
|
|
1205
|
+
vModelCheckboxUpdate(el, binding.oldValue, binding.value, vnode.props.value);
|
|
1206
|
+
},
|
|
1207
|
+
beforeUpdate(el, binding, vnode) {
|
|
1208
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1209
|
+
vModelCheckboxUpdate(el, binding.oldValue, binding.value, vnode.props.value);
|
|
1210
|
+
}
|
|
1531
1211
|
};
|
|
1212
|
+
/**
|
|
1213
|
+
* @internal
|
|
1214
|
+
*/
|
|
1532
1215
|
const vModelCheckboxInit = (el, set) => {
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
}
|
|
1555
|
-
assign(cloned);
|
|
1556
|
-
} else {
|
|
1557
|
-
assign(getCheckboxValue(el, checked));
|
|
1558
|
-
}
|
|
1559
|
-
});
|
|
1216
|
+
addEventListener(el, "change", () => {
|
|
1217
|
+
const assign = set || el[assignKey];
|
|
1218
|
+
const modelValue = el._modelValue;
|
|
1219
|
+
const elementValue = getValue(el);
|
|
1220
|
+
const checked = el.checked;
|
|
1221
|
+
if ((0, _vue_shared.isArray)(modelValue)) {
|
|
1222
|
+
const index = (0, _vue_shared.looseIndexOf)(modelValue, elementValue);
|
|
1223
|
+
const found = index !== -1;
|
|
1224
|
+
if (checked && !found) assign(modelValue.concat(elementValue));
|
|
1225
|
+
else if (!checked && found) {
|
|
1226
|
+
const filtered = [...modelValue];
|
|
1227
|
+
filtered.splice(index, 1);
|
|
1228
|
+
assign(filtered);
|
|
1229
|
+
}
|
|
1230
|
+
} else if ((0, _vue_shared.isSet)(modelValue)) {
|
|
1231
|
+
const cloned = new Set(modelValue);
|
|
1232
|
+
if (checked) cloned.add(elementValue);
|
|
1233
|
+
else cloned.delete(elementValue);
|
|
1234
|
+
assign(cloned);
|
|
1235
|
+
} else assign(getCheckboxValue(el, checked));
|
|
1236
|
+
});
|
|
1560
1237
|
};
|
|
1238
|
+
/**
|
|
1239
|
+
* @internal
|
|
1240
|
+
*/
|
|
1561
1241
|
const vModelCheckboxUpdate = (el, oldValue, value, rawValue = getValue(el)) => {
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
}
|
|
1572
|
-
if (el.checked !== checked) {
|
|
1573
|
-
el.checked = checked;
|
|
1574
|
-
}
|
|
1242
|
+
el._modelValue = value;
|
|
1243
|
+
let checked;
|
|
1244
|
+
if ((0, _vue_shared.isArray)(value)) checked = (0, _vue_shared.looseIndexOf)(value, rawValue) > -1;
|
|
1245
|
+
else if ((0, _vue_shared.isSet)(value)) checked = value.has(rawValue);
|
|
1246
|
+
else {
|
|
1247
|
+
if (value === oldValue) return;
|
|
1248
|
+
checked = (0, _vue_shared.looseEqual)(value, getCheckboxValue(el, true));
|
|
1249
|
+
}
|
|
1250
|
+
if (el.checked !== checked) el.checked = checked;
|
|
1575
1251
|
};
|
|
1576
1252
|
const vModelRadio = {
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
}
|
|
1589
|
-
}
|
|
1253
|
+
created(el, { value }, vnode) {
|
|
1254
|
+
el.checked = (0, _vue_shared.looseEqual)(value, vnode.props.value);
|
|
1255
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1256
|
+
addEventListener(el, "change", () => {
|
|
1257
|
+
el[assignKey](getValue(el));
|
|
1258
|
+
});
|
|
1259
|
+
},
|
|
1260
|
+
beforeUpdate(el, { value, oldValue }, vnode) {
|
|
1261
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1262
|
+
if (value !== oldValue) el.checked = (0, _vue_shared.looseEqual)(value, vnode.props.value);
|
|
1263
|
+
}
|
|
1590
1264
|
};
|
|
1591
1265
|
const vModelSelect = {
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
updated(el, { value }) {
|
|
1607
|
-
vModelSetSelected(el, value);
|
|
1608
|
-
}
|
|
1266
|
+
deep: true,
|
|
1267
|
+
created(el, { value, modifiers: { number } }, vnode) {
|
|
1268
|
+
vModelSelectInit(el, value, number);
|
|
1269
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1270
|
+
},
|
|
1271
|
+
mounted(el, { value }) {
|
|
1272
|
+
vModelSetSelected(el, value);
|
|
1273
|
+
},
|
|
1274
|
+
beforeUpdate(el, _binding, vnode) {
|
|
1275
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1276
|
+
},
|
|
1277
|
+
updated(el, { value }) {
|
|
1278
|
+
vModelSetSelected(el, value);
|
|
1279
|
+
}
|
|
1609
1280
|
};
|
|
1281
|
+
/**
|
|
1282
|
+
* @internal
|
|
1283
|
+
*/
|
|
1610
1284
|
const vModelSelectInit = (el, value, number, set) => {
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
runtimeCore.nextTick(() => {
|
|
1621
|
-
el._assigning = false;
|
|
1622
|
-
});
|
|
1623
|
-
});
|
|
1285
|
+
const isSetModel = (0, _vue_shared.isSet)(value);
|
|
1286
|
+
addEventListener(el, "change", () => {
|
|
1287
|
+
const selectedVal = Array.prototype.filter.call(el.options, (o) => o.selected).map((o) => number ? (0, _vue_shared.looseToNumber)(getValue(o)) : getValue(o));
|
|
1288
|
+
(set || el[assignKey])(el.multiple ? isSetModel ? new Set(selectedVal) : selectedVal : selectedVal[0]);
|
|
1289
|
+
el._assigning = true;
|
|
1290
|
+
(0, _vue_runtime_core.nextTick)(() => {
|
|
1291
|
+
el._assigning = false;
|
|
1292
|
+
});
|
|
1293
|
+
});
|
|
1624
1294
|
};
|
|
1295
|
+
/**
|
|
1296
|
+
* @internal
|
|
1297
|
+
*/
|
|
1625
1298
|
const vModelSetSelected = (el, value) => {
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
option.selected = value.has(optionValue);
|
|
1648
|
-
}
|
|
1649
|
-
} else if (shared.looseEqual(getValue(option), value)) {
|
|
1650
|
-
if (el.selectedIndex !== i) el.selectedIndex = i;
|
|
1651
|
-
return;
|
|
1652
|
-
}
|
|
1653
|
-
}
|
|
1654
|
-
if (!isMultiple && el.selectedIndex !== -1) {
|
|
1655
|
-
el.selectedIndex = -1;
|
|
1656
|
-
}
|
|
1299
|
+
if (el._assigning) return;
|
|
1300
|
+
const isMultiple = el.multiple;
|
|
1301
|
+
const isArrayValue = (0, _vue_shared.isArray)(value);
|
|
1302
|
+
if (isMultiple && !isArrayValue && !(0, _vue_shared.isSet)(value)) {
|
|
1303
|
+
(0, _vue_runtime_core.warn)(`<select multiple v-model> expects an Array or Set value for its binding, but got ${Object.prototype.toString.call(value).slice(8, -1)}.`);
|
|
1304
|
+
return;
|
|
1305
|
+
}
|
|
1306
|
+
for (let i = 0, l = el.options.length; i < l; i++) {
|
|
1307
|
+
const option = el.options[i];
|
|
1308
|
+
const optionValue = getValue(option);
|
|
1309
|
+
if (isMultiple) if (isArrayValue) {
|
|
1310
|
+
const optionType = typeof optionValue;
|
|
1311
|
+
if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
|
|
1312
|
+
else option.selected = (0, _vue_shared.looseIndexOf)(value, optionValue) > -1;
|
|
1313
|
+
} else option.selected = value.has(optionValue);
|
|
1314
|
+
else if ((0, _vue_shared.looseEqual)(getValue(option), value)) {
|
|
1315
|
+
if (el.selectedIndex !== i) el.selectedIndex = i;
|
|
1316
|
+
return;
|
|
1317
|
+
}
|
|
1318
|
+
}
|
|
1319
|
+
if (!isMultiple && el.selectedIndex !== -1) el.selectedIndex = -1;
|
|
1657
1320
|
};
|
|
1321
|
+
/**
|
|
1322
|
+
* @internal retrieve raw value set via :value bindings
|
|
1323
|
+
*/
|
|
1658
1324
|
function getValue(el) {
|
|
1659
|
-
|
|
1325
|
+
return "_value" in el ? el._value : el.value;
|
|
1660
1326
|
}
|
|
1661
1327
|
function getCheckboxValue(el, checked) {
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
if (el.hasAttribute(attr)) {
|
|
1668
|
-
return el.getAttribute(attr);
|
|
1669
|
-
}
|
|
1670
|
-
return checked;
|
|
1328
|
+
const key = checked ? "_trueValue" : "_falseValue";
|
|
1329
|
+
if (key in el) return el[key];
|
|
1330
|
+
const attr = checked ? "true-value" : "false-value";
|
|
1331
|
+
if (el.hasAttribute(attr)) return el.getAttribute(attr);
|
|
1332
|
+
return checked;
|
|
1671
1333
|
}
|
|
1672
1334
|
const vModelDynamic = {
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1335
|
+
created(el, binding, vnode) {
|
|
1336
|
+
callModelHook(el, binding, vnode, null, "created");
|
|
1337
|
+
},
|
|
1338
|
+
mounted(el, binding, vnode) {
|
|
1339
|
+
callModelHook(el, binding, vnode, null, "mounted");
|
|
1340
|
+
},
|
|
1341
|
+
beforeUpdate(el, binding, vnode, prevVNode) {
|
|
1342
|
+
callModelHook(el, binding, vnode, prevVNode, "beforeUpdate");
|
|
1343
|
+
},
|
|
1344
|
+
updated(el, binding, vnode, prevVNode) {
|
|
1345
|
+
callModelHook(el, binding, vnode, prevVNode, "updated");
|
|
1346
|
+
}
|
|
1685
1347
|
};
|
|
1686
1348
|
function resolveDynamicModel(tagName, type) {
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
case "radio":
|
|
1697
|
-
return vModelRadio;
|
|
1698
|
-
default:
|
|
1699
|
-
return vModelText;
|
|
1700
|
-
}
|
|
1701
|
-
}
|
|
1349
|
+
switch (tagName) {
|
|
1350
|
+
case "SELECT": return vModelSelect;
|
|
1351
|
+
case "TEXTAREA": return vModelText;
|
|
1352
|
+
default: switch (type) {
|
|
1353
|
+
case "checkbox": return vModelCheckbox;
|
|
1354
|
+
case "radio": return vModelRadio;
|
|
1355
|
+
default: return vModelText;
|
|
1356
|
+
}
|
|
1357
|
+
}
|
|
1702
1358
|
}
|
|
1703
1359
|
function callModelHook(el, binding, vnode, prevVNode, hook) {
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
vnode.props && vnode.props.type
|
|
1707
|
-
);
|
|
1708
|
-
const fn = modelToUse[hook];
|
|
1709
|
-
fn && fn(el, binding, vnode, prevVNode);
|
|
1360
|
+
const fn = resolveDynamicModel(el.tagName, vnode.props && vnode.props.type)[hook];
|
|
1361
|
+
fn && fn(el, binding, vnode, prevVNode);
|
|
1710
1362
|
}
|
|
1711
1363
|
function initVModelForSSR() {
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
return { checked: true };
|
|
1729
|
-
}
|
|
1730
|
-
};
|
|
1731
|
-
vModelDynamic.getSSRProps = (binding, vnode) => {
|
|
1732
|
-
if (typeof vnode.type !== "string") {
|
|
1733
|
-
return;
|
|
1734
|
-
}
|
|
1735
|
-
const modelToUse = resolveDynamicModel(
|
|
1736
|
-
// resolveDynamicModel expects an uppercase tag name, but vnode.type is lowercase
|
|
1737
|
-
vnode.type.toUpperCase(),
|
|
1738
|
-
vnode.props && vnode.props.type
|
|
1739
|
-
);
|
|
1740
|
-
if (modelToUse.getSSRProps) {
|
|
1741
|
-
return modelToUse.getSSRProps(binding, vnode);
|
|
1742
|
-
}
|
|
1743
|
-
};
|
|
1364
|
+
vModelText.getSSRProps = ({ value }) => ({ value });
|
|
1365
|
+
vModelRadio.getSSRProps = ({ value }, vnode) => {
|
|
1366
|
+
if (vnode.props && (0, _vue_shared.looseEqual)(vnode.props.value, value)) return { checked: true };
|
|
1367
|
+
};
|
|
1368
|
+
vModelCheckbox.getSSRProps = ({ value }, vnode) => {
|
|
1369
|
+
if ((0, _vue_shared.isArray)(value)) {
|
|
1370
|
+
if (vnode.props && (0, _vue_shared.looseIndexOf)(value, vnode.props.value) > -1) return { checked: true };
|
|
1371
|
+
} else if ((0, _vue_shared.isSet)(value)) {
|
|
1372
|
+
if (vnode.props && value.has(vnode.props.value)) return { checked: true };
|
|
1373
|
+
} else if (value) return { checked: true };
|
|
1374
|
+
};
|
|
1375
|
+
vModelDynamic.getSSRProps = (binding, vnode) => {
|
|
1376
|
+
if (typeof vnode.type !== "string") return;
|
|
1377
|
+
const modelToUse = resolveDynamicModel(vnode.type.toUpperCase(), vnode.props && vnode.props.type);
|
|
1378
|
+
if (modelToUse.getSSRProps) return modelToUse.getSSRProps(binding, vnode);
|
|
1379
|
+
};
|
|
1744
1380
|
}
|
|
1745
|
-
|
|
1746
|
-
|
|
1381
|
+
//#endregion
|
|
1382
|
+
//#region packages/runtime-dom/src/directives/vOn.ts
|
|
1383
|
+
const systemModifiers = [
|
|
1384
|
+
"ctrl",
|
|
1385
|
+
"shift",
|
|
1386
|
+
"alt",
|
|
1387
|
+
"meta"
|
|
1388
|
+
];
|
|
1747
1389
|
const modifierGuards = {
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
|
|
1758
|
-
|
|
1390
|
+
stop: (e) => e.stopPropagation(),
|
|
1391
|
+
prevent: (e) => e.preventDefault(),
|
|
1392
|
+
self: (e) => e.target !== e.currentTarget,
|
|
1393
|
+
ctrl: (e) => !e.ctrlKey,
|
|
1394
|
+
shift: (e) => !e.shiftKey,
|
|
1395
|
+
alt: (e) => !e.altKey,
|
|
1396
|
+
meta: (e) => !e.metaKey,
|
|
1397
|
+
left: (e) => "button" in e && e.button !== 0,
|
|
1398
|
+
middle: (e) => "button" in e && e.button !== 1,
|
|
1399
|
+
right: (e) => "button" in e && e.button !== 2,
|
|
1400
|
+
exact: (e, modifiers) => systemModifiers.some((m) => e[`${m}Key`] && !modifiers.includes(m))
|
|
1759
1401
|
};
|
|
1402
|
+
/**
|
|
1403
|
+
* @private
|
|
1404
|
+
*/
|
|
1760
1405
|
const withModifiers = (fn, modifiers) => {
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1406
|
+
if (!fn) return fn;
|
|
1407
|
+
const cache = fn._withMods || (fn._withMods = {});
|
|
1408
|
+
const cacheKey = modifiers.join(".");
|
|
1409
|
+
return cache[cacheKey] || (cache[cacheKey] = ((event, ...args) => {
|
|
1410
|
+
for (let i = 0; i < modifiers.length; i++) {
|
|
1411
|
+
const guard = modifierGuards[modifiers[i]];
|
|
1412
|
+
if (guard && guard(event, modifiers)) return;
|
|
1413
|
+
}
|
|
1414
|
+
return fn(event, ...args);
|
|
1415
|
+
}));
|
|
1770
1416
|
};
|
|
1771
1417
|
const keyNames = {
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1776
|
-
|
|
1777
|
-
|
|
1778
|
-
|
|
1418
|
+
esc: "escape",
|
|
1419
|
+
space: " ",
|
|
1420
|
+
up: "arrow-up",
|
|
1421
|
+
left: "arrow-left",
|
|
1422
|
+
right: "arrow-right",
|
|
1423
|
+
down: "arrow-down",
|
|
1424
|
+
delete: "backspace"
|
|
1779
1425
|
};
|
|
1426
|
+
/**
|
|
1427
|
+
* @private
|
|
1428
|
+
*/
|
|
1780
1429
|
const withKeys = (fn, modifiers) => {
|
|
1781
|
-
|
|
1782
|
-
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
if (modifiers.some(
|
|
1789
|
-
(k) => k === eventKey || keyNames[k] === eventKey
|
|
1790
|
-
)) {
|
|
1791
|
-
return fn(event);
|
|
1792
|
-
}
|
|
1793
|
-
}));
|
|
1430
|
+
const cache = fn._withKeys || (fn._withKeys = {});
|
|
1431
|
+
const cacheKey = modifiers.join(".");
|
|
1432
|
+
return cache[cacheKey] || (cache[cacheKey] = ((event) => {
|
|
1433
|
+
if (!("key" in event)) return;
|
|
1434
|
+
const eventKey = (0, _vue_shared.hyphenate)(event.key);
|
|
1435
|
+
if (modifiers.some((k) => k === eventKey || keyNames[k] === eventKey)) return fn(event);
|
|
1436
|
+
}));
|
|
1794
1437
|
};
|
|
1795
|
-
|
|
1796
|
-
|
|
1438
|
+
//#endregion
|
|
1439
|
+
//#region packages/runtime-dom/src/index.ts
|
|
1440
|
+
const rendererOptions = /* @__PURE__ */ (0, _vue_shared.extend)({ patchProp }, nodeOps);
|
|
1797
1441
|
let renderer;
|
|
1798
1442
|
let enabledHydration = false;
|
|
1799
1443
|
function ensureRenderer() {
|
|
1800
|
-
|
|
1444
|
+
return renderer || (renderer = (0, _vue_runtime_core.createRenderer)(rendererOptions));
|
|
1801
1445
|
}
|
|
1802
1446
|
function ensureHydrationRenderer() {
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1447
|
+
renderer = enabledHydration ? renderer : (0, _vue_runtime_core.createHydrationRenderer)(rendererOptions);
|
|
1448
|
+
enabledHydration = true;
|
|
1449
|
+
return renderer;
|
|
1806
1450
|
}
|
|
1807
1451
|
const render = ((...args) => {
|
|
1808
|
-
|
|
1452
|
+
ensureRenderer().render(...args);
|
|
1809
1453
|
});
|
|
1810
1454
|
const hydrate = ((...args) => {
|
|
1811
|
-
|
|
1455
|
+
ensureHydrationRenderer().hydrate(...args);
|
|
1812
1456
|
});
|
|
1813
1457
|
const createApp = ((...args) => {
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
container.removeAttribute("v-cloak");
|
|
1833
|
-
container.setAttribute("data-v-app", "");
|
|
1834
|
-
}
|
|
1835
|
-
return proxy;
|
|
1836
|
-
};
|
|
1837
|
-
return app;
|
|
1458
|
+
const app = ensureRenderer().createApp(...args);
|
|
1459
|
+
injectNativeTagCheck(app);
|
|
1460
|
+
injectCompilerOptionsCheck(app);
|
|
1461
|
+
const { mount } = app;
|
|
1462
|
+
app.mount = (containerOrSelector) => {
|
|
1463
|
+
const container = normalizeContainer(containerOrSelector);
|
|
1464
|
+
if (!container) return;
|
|
1465
|
+
const component = app._component;
|
|
1466
|
+
if (!(0, _vue_shared.isFunction)(component) && !component.render && !component.template) component.template = container.innerHTML;
|
|
1467
|
+
if (container.nodeType === 1) container.textContent = "";
|
|
1468
|
+
const proxy = mount(container, false, resolveRootNamespace(container));
|
|
1469
|
+
if (container instanceof Element) {
|
|
1470
|
+
container.removeAttribute("v-cloak");
|
|
1471
|
+
container.setAttribute("data-v-app", "");
|
|
1472
|
+
}
|
|
1473
|
+
return proxy;
|
|
1474
|
+
};
|
|
1475
|
+
return app;
|
|
1838
1476
|
});
|
|
1839
1477
|
const createSSRApp = ((...args) => {
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
|
|
1850
|
-
}
|
|
1851
|
-
};
|
|
1852
|
-
return app;
|
|
1478
|
+
(0, _vue_runtime_core.setIsHydratingEnabled)(true);
|
|
1479
|
+
const app = ensureHydrationRenderer().createApp(...args);
|
|
1480
|
+
injectNativeTagCheck(app);
|
|
1481
|
+
injectCompilerOptionsCheck(app);
|
|
1482
|
+
const { mount } = app;
|
|
1483
|
+
app.mount = (containerOrSelector) => {
|
|
1484
|
+
const container = normalizeContainer(containerOrSelector);
|
|
1485
|
+
if (container) return mount(container, true, resolveRootNamespace(container));
|
|
1486
|
+
};
|
|
1487
|
+
return app;
|
|
1853
1488
|
});
|
|
1854
1489
|
function resolveRootNamespace(container) {
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
}
|
|
1858
|
-
if (typeof MathMLElement === "function" && container instanceof MathMLElement) {
|
|
1859
|
-
return "mathml";
|
|
1860
|
-
}
|
|
1490
|
+
if (container instanceof SVGElement) return "svg";
|
|
1491
|
+
if (typeof MathMLElement === "function" && container instanceof MathMLElement) return "mathml";
|
|
1861
1492
|
}
|
|
1862
1493
|
function injectNativeTagCheck(app) {
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1494
|
+
Object.defineProperty(app.config, "isNativeTag", {
|
|
1495
|
+
value: (tag) => (0, _vue_shared.isHTMLTag)(tag) || (0, _vue_shared.isSVGTag)(tag) || (0, _vue_shared.isMathMLTag)(tag),
|
|
1496
|
+
writable: false
|
|
1497
|
+
});
|
|
1867
1498
|
}
|
|
1868
1499
|
function injectCompilerOptionsCheck(app) {
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1891
|
-
set() {
|
|
1892
|
-
runtimeCore.warn(msg);
|
|
1893
|
-
}
|
|
1894
|
-
});
|
|
1895
|
-
}
|
|
1500
|
+
if ((0, _vue_runtime_core.isRuntimeOnly)()) {
|
|
1501
|
+
const isCustomElement = app.config.isCustomElement;
|
|
1502
|
+
Object.defineProperty(app.config, "isCustomElement", {
|
|
1503
|
+
get() {
|
|
1504
|
+
return isCustomElement;
|
|
1505
|
+
},
|
|
1506
|
+
set() {
|
|
1507
|
+
(0, _vue_runtime_core.warn)("The `isCustomElement` config option is deprecated. Use `compilerOptions.isCustomElement` instead.");
|
|
1508
|
+
}
|
|
1509
|
+
});
|
|
1510
|
+
const compilerOptions = app.config.compilerOptions;
|
|
1511
|
+
const msg = "The `compilerOptions` config option is only respected when using a build of Vue.js that includes the runtime compiler (aka \"full build\"). Since you are using the runtime-only build, `compilerOptions` must be passed to `@vue/compiler-dom` in the build setup instead.\n- For vue-loader: pass it via vue-loader's `compilerOptions` loader option.\n- For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader\n- For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-sfc";
|
|
1512
|
+
Object.defineProperty(app.config, "compilerOptions", {
|
|
1513
|
+
get() {
|
|
1514
|
+
(0, _vue_runtime_core.warn)(msg);
|
|
1515
|
+
return compilerOptions;
|
|
1516
|
+
},
|
|
1517
|
+
set() {
|
|
1518
|
+
(0, _vue_runtime_core.warn)(msg);
|
|
1519
|
+
}
|
|
1520
|
+
});
|
|
1521
|
+
}
|
|
1896
1522
|
}
|
|
1523
|
+
/**
|
|
1524
|
+
* @internal
|
|
1525
|
+
*/
|
|
1897
1526
|
function normalizeContainer(container) {
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
return res;
|
|
1906
|
-
}
|
|
1907
|
-
if (window.ShadowRoot && container instanceof window.ShadowRoot && container.mode === "closed") {
|
|
1908
|
-
runtimeCore.warn(
|
|
1909
|
-
`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
|
|
1910
|
-
);
|
|
1911
|
-
}
|
|
1912
|
-
return container;
|
|
1527
|
+
if ((0, _vue_shared.isString)(container)) {
|
|
1528
|
+
const res = document.querySelector(container);
|
|
1529
|
+
if (!res) (0, _vue_runtime_core.warn)(`Failed to mount app: mount target selector "${container}" returned null.`);
|
|
1530
|
+
return res;
|
|
1531
|
+
}
|
|
1532
|
+
if (window.ShadowRoot && container instanceof window.ShadowRoot && container.mode === "closed") (0, _vue_runtime_core.warn)(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
|
|
1533
|
+
return container;
|
|
1913
1534
|
}
|
|
1914
1535
|
let ssrDirectiveInitialized = false;
|
|
1536
|
+
/**
|
|
1537
|
+
* @internal
|
|
1538
|
+
*/
|
|
1915
1539
|
const initDirectivesForSSR = () => {
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
}
|
|
1922
|
-
|
|
1540
|
+
if (!ssrDirectiveInitialized) {
|
|
1541
|
+
ssrDirectiveInitialized = true;
|
|
1542
|
+
initVModelForSSR();
|
|
1543
|
+
initVShowForSSR();
|
|
1544
|
+
}
|
|
1545
|
+
};
|
|
1546
|
+
//#endregion
|
|
1923
1547
|
exports.Transition = Transition;
|
|
1924
1548
|
exports.TransitionGroup = TransitionGroup;
|
|
1925
1549
|
exports.VueElement = VueElement;
|
|
@@ -1945,6 +1569,11 @@ exports.vModelText = vModelText;
|
|
|
1945
1569
|
exports.vShow = vShow;
|
|
1946
1570
|
exports.withKeys = withKeys;
|
|
1947
1571
|
exports.withModifiers = withModifiers;
|
|
1948
|
-
Object.keys(
|
|
1949
|
-
|
|
1572
|
+
Object.keys(_vue_runtime_core).forEach(function(k) {
|
|
1573
|
+
if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
|
|
1574
|
+
enumerable: true,
|
|
1575
|
+
get: function() {
|
|
1576
|
+
return _vue_runtime_core[k];
|
|
1577
|
+
}
|
|
1578
|
+
});
|
|
1950
1579
|
});
|