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