@vue/runtime-dom 3.6.0-beta.3 → 3.6.0-beta.5
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 +1316 -1717
- package/dist/runtime-dom.cjs.prod.js +1227 -1574
- package/dist/runtime-dom.d.ts +1285 -1276
- package/dist/runtime-dom.esm-browser.js +8687 -12174
- package/dist/runtime-dom.esm-browser.prod.js +7 -6
- package/dist/runtime-dom.esm-bundler.js +1388 -1783
- package/dist/runtime-dom.global.js +9939 -13323
- 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.5
|
|
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,1899 +21,1501 @@ 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
|
-
_removeChildStyle(comp) {
|
|
1161
|
-
{
|
|
1162
|
-
this._styleChildren.delete(comp);
|
|
1163
|
-
if (this._childStyles && comp.__hmrId) {
|
|
1164
|
-
const oldStyles = this._childStyles.get(comp.__hmrId);
|
|
1165
|
-
if (oldStyles) {
|
|
1166
|
-
oldStyles.forEach((s) => this._root.removeChild(s));
|
|
1167
|
-
oldStyles.length = 0;
|
|
1168
|
-
}
|
|
1169
|
-
}
|
|
1170
|
-
}
|
|
1171
|
-
}
|
|
1172
|
-
}
|
|
1173
|
-
class VueElement extends VueElementBase {
|
|
1174
|
-
constructor(def, props = {}, createAppFn = createApp) {
|
|
1175
|
-
super(def, props, createAppFn);
|
|
1176
|
-
}
|
|
1177
|
-
_needsHydration() {
|
|
1178
|
-
if (this.shadowRoot && this._createApp !== createApp) {
|
|
1179
|
-
return true;
|
|
1180
|
-
} else {
|
|
1181
|
-
if (this.shadowRoot) {
|
|
1182
|
-
runtimeCore.warn(
|
|
1183
|
-
`Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
|
|
1184
|
-
);
|
|
1185
|
-
}
|
|
1186
|
-
}
|
|
1187
|
-
return false;
|
|
1188
|
-
}
|
|
1189
|
-
_mount(def) {
|
|
1190
|
-
if (!def.name) {
|
|
1191
|
-
def.name = "VueElement";
|
|
1192
|
-
}
|
|
1193
|
-
this._app = this._createApp(def);
|
|
1194
|
-
this._inheritParentContext();
|
|
1195
|
-
if (def.configureApp) {
|
|
1196
|
-
def.configureApp(this._app);
|
|
1197
|
-
}
|
|
1198
|
-
this._app._ceVNode = this._createVNode();
|
|
1199
|
-
this._app.mount(this._root);
|
|
1200
|
-
}
|
|
1201
|
-
_update() {
|
|
1202
|
-
if (!this._app) return;
|
|
1203
|
-
const vnode = this._createVNode();
|
|
1204
|
-
vnode.appContext = this._app._context;
|
|
1205
|
-
render(vnode, this._root);
|
|
1206
|
-
}
|
|
1207
|
-
_unmount() {
|
|
1208
|
-
if (this._app) {
|
|
1209
|
-
this._app.unmount();
|
|
1210
|
-
}
|
|
1211
|
-
if (this._instance && this._instance.ce) {
|
|
1212
|
-
this._instance.ce = void 0;
|
|
1213
|
-
}
|
|
1214
|
-
this._app = this._instance = null;
|
|
1215
|
-
}
|
|
1216
|
-
/**
|
|
1217
|
-
* Only called when shadowRoot is false
|
|
1218
|
-
*/
|
|
1219
|
-
_updateSlotNodes(replacements) {
|
|
1220
|
-
}
|
|
1221
|
-
_createVNode() {
|
|
1222
|
-
const baseProps = {};
|
|
1223
|
-
if (!this.shadowRoot) {
|
|
1224
|
-
baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
|
|
1225
|
-
}
|
|
1226
|
-
const vnode = runtimeCore.createVNode(this._def, shared.extend(baseProps, this._props));
|
|
1227
|
-
if (!this._instance) {
|
|
1228
|
-
vnode.ce = (instance) => {
|
|
1229
|
-
this._instance = instance;
|
|
1230
|
-
this._processInstance();
|
|
1231
|
-
};
|
|
1232
|
-
}
|
|
1233
|
-
return vnode;
|
|
1234
|
-
}
|
|
1235
|
-
}
|
|
1236
940
|
function useHost(caller) {
|
|
1237
|
-
|
|
1238
|
-
|
|
1239
|
-
|
|
1240
|
-
|
|
1241
|
-
|
|
1242
|
-
|
|
1243
|
-
runtimeCore.warn(
|
|
1244
|
-
`${caller || "useHost"} called without an active component instance.`
|
|
1245
|
-
);
|
|
1246
|
-
} else {
|
|
1247
|
-
runtimeCore.warn(
|
|
1248
|
-
`${caller || "useHost"} can only be used in components defined via defineCustomElement.`
|
|
1249
|
-
);
|
|
1250
|
-
}
|
|
1251
|
-
}
|
|
1252
|
-
return null;
|
|
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;
|
|
1253
947
|
}
|
|
948
|
+
/**
|
|
949
|
+
* Retrieve the shadowRoot of the current custom element. Only usable in setup()
|
|
950
|
+
* of a `defineCustomElement` component.
|
|
951
|
+
*/
|
|
1254
952
|
function useShadowRoot() {
|
|
1255
|
-
|
|
1256
|
-
|
|
953
|
+
const el = useHost("useShadowRoot");
|
|
954
|
+
return el && el.shadowRoot;
|
|
1257
955
|
}
|
|
1258
956
|
|
|
957
|
+
//#endregion
|
|
958
|
+
//#region packages/runtime-dom/src/helpers/useCssModule.ts
|
|
1259
959
|
function useCssModule(name = "$style") {
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
|
|
1277
|
-
|
|
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
|
+
}
|
|
1278
978
|
}
|
|
1279
979
|
|
|
980
|
+
//#endregion
|
|
981
|
+
//#region packages/runtime-dom/src/components/TransitionGroup.ts
|
|
1280
982
|
const positionMap = /* @__PURE__ */ new WeakMap();
|
|
1281
983
|
const newPositionMap = /* @__PURE__ */ new WeakMap();
|
|
1282
|
-
const moveCbKey =
|
|
1283
|
-
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
|
+
*/
|
|
1284
990
|
const decorate = (t) => {
|
|
1285
|
-
|
|
1286
|
-
|
|
991
|
+
delete t.props.mode;
|
|
992
|
+
return t;
|
|
1287
993
|
};
|
|
1288
994
|
const TransitionGroupImpl = /* @__PURE__ */ decorate({
|
|
1289
|
-
|
|
1290
|
-
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
positionMap.set(child, {
|
|
1342
|
-
left: child.el.offsetLeft,
|
|
1343
|
-
top: child.el.offsetTop
|
|
1344
|
-
});
|
|
1345
|
-
}
|
|
1346
|
-
}
|
|
1347
|
-
}
|
|
1348
|
-
children = slots.default ? runtimeCore.getTransitionRawChildren(slots.default()) : [];
|
|
1349
|
-
for (let i = 0; i < children.length; i++) {
|
|
1350
|
-
const child = children[i];
|
|
1351
|
-
if (child.key != null) {
|
|
1352
|
-
runtimeCore.setTransitionHooks(
|
|
1353
|
-
child,
|
|
1354
|
-
runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance)
|
|
1355
|
-
);
|
|
1356
|
-
} else if (child.type !== runtimeCore.Text) {
|
|
1357
|
-
runtimeCore.warn(`<TransitionGroup> children must be keyed.`);
|
|
1358
|
-
}
|
|
1359
|
-
}
|
|
1360
|
-
return runtimeCore.createVNode(tag, null, children);
|
|
1361
|
-
};
|
|
1362
|
-
}
|
|
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, {
|
|
1033
|
+
left: child.el.offsetLeft,
|
|
1034
|
+
top: child.el.offsetTop
|
|
1035
|
+
});
|
|
1036
|
+
}
|
|
1037
|
+
}
|
|
1038
|
+
children = slots.default ? (0, _vue_runtime_core.getTransitionRawChildren)(slots.default()) : [];
|
|
1039
|
+
for (let i = 0; i < children.length; i++) {
|
|
1040
|
+
const child = children[i];
|
|
1041
|
+
if (child.key != null) (0, _vue_runtime_core.setTransitionHooks)(child, (0, _vue_runtime_core.resolveTransitionHooks)(child, cssTransitionProps, state, instance));
|
|
1042
|
+
else if (child.type !== _vue_runtime_core.Text) (0, _vue_runtime_core.warn)(`<TransitionGroup> children must be keyed.`);
|
|
1043
|
+
}
|
|
1044
|
+
return (0, _vue_runtime_core.createVNode)(tag, null, children);
|
|
1045
|
+
};
|
|
1046
|
+
}
|
|
1363
1047
|
});
|
|
1364
1048
|
const TransitionGroup = TransitionGroupImpl;
|
|
1365
1049
|
function callPendingCbs(el) {
|
|
1366
|
-
|
|
1367
|
-
|
|
1368
|
-
}
|
|
1369
|
-
if (el[enterCbKey]) {
|
|
1370
|
-
el[enterCbKey]();
|
|
1371
|
-
}
|
|
1050
|
+
if (el[moveCbKey]) el[moveCbKey]();
|
|
1051
|
+
if (el[enterCbKey]) el[enterCbKey]();
|
|
1372
1052
|
}
|
|
1373
1053
|
function recordPosition(c) {
|
|
1374
|
-
|
|
1375
|
-
|
|
1376
|
-
|
|
1377
|
-
|
|
1054
|
+
newPositionMap.set(c, {
|
|
1055
|
+
left: c.el.offsetLeft,
|
|
1056
|
+
top: c.el.offsetTop
|
|
1057
|
+
});
|
|
1378
1058
|
}
|
|
1379
1059
|
function applyTranslation(c) {
|
|
1380
|
-
|
|
1381
|
-
positionMap.get(c),
|
|
1382
|
-
newPositionMap.get(c),
|
|
1383
|
-
c.el
|
|
1384
|
-
)) {
|
|
1385
|
-
return c;
|
|
1386
|
-
}
|
|
1060
|
+
if (baseApplyTranslation(positionMap.get(c), newPositionMap.get(c), c.el)) return c;
|
|
1387
1061
|
}
|
|
1388
1062
|
function baseApplyTranslation(oldPos, newPos, el) {
|
|
1389
|
-
|
|
1390
|
-
|
|
1391
|
-
|
|
1392
|
-
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1397
|
-
|
|
1063
|
+
const dx = oldPos.left - newPos.left;
|
|
1064
|
+
const dy = oldPos.top - newPos.top;
|
|
1065
|
+
if (dx || dy) {
|
|
1066
|
+
const s = el.style;
|
|
1067
|
+
s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
|
|
1068
|
+
s.transitionDuration = "0s";
|
|
1069
|
+
return true;
|
|
1070
|
+
}
|
|
1071
|
+
return false;
|
|
1398
1072
|
}
|
|
1399
1073
|
function hasCSSTransform(el, root, moveClass) {
|
|
1400
|
-
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1408
|
-
|
|
1409
|
-
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
container.removeChild(clone);
|
|
1413
|
-
return hasTransform;
|
|
1074
|
+
const clone = el.cloneNode();
|
|
1075
|
+
const _vtc = el[vtcKey];
|
|
1076
|
+
if (_vtc) _vtc.forEach((cls) => {
|
|
1077
|
+
cls.split(/\s+/).forEach((c) => c && clone.classList.remove(c));
|
|
1078
|
+
});
|
|
1079
|
+
moveClass.split(/\s+/).forEach((c) => c && clone.classList.add(c));
|
|
1080
|
+
clone.style.display = "none";
|
|
1081
|
+
const container = root.nodeType === 1 ? root : root.parentNode;
|
|
1082
|
+
container.appendChild(clone);
|
|
1083
|
+
const { hasTransform } = getTransitionInfo(clone);
|
|
1084
|
+
container.removeChild(clone);
|
|
1085
|
+
return hasTransform;
|
|
1414
1086
|
}
|
|
1415
1087
|
const handleMovedChildren = (el, moveClass) => {
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
};
|
|
1429
|
-
el.addEventListener("transitionend", cb);
|
|
1088
|
+
const style = el.style;
|
|
1089
|
+
addTransitionClass(el, moveClass);
|
|
1090
|
+
style.transform = style.webkitTransform = style.transitionDuration = "";
|
|
1091
|
+
const cb = el[moveCbKey] = (e) => {
|
|
1092
|
+
if (e && e.target !== el) return;
|
|
1093
|
+
if (!e || e.propertyName.endsWith("transform")) {
|
|
1094
|
+
el.removeEventListener("transitionend", cb);
|
|
1095
|
+
el[moveCbKey] = null;
|
|
1096
|
+
removeTransitionClass(el, moveClass);
|
|
1097
|
+
}
|
|
1098
|
+
};
|
|
1099
|
+
el.addEventListener("transitionend", cb);
|
|
1430
1100
|
};
|
|
1431
1101
|
|
|
1102
|
+
//#endregion
|
|
1103
|
+
//#region packages/runtime-dom/src/directives/vModel.ts
|
|
1432
1104
|
const getModelAssigner = (vnode) => {
|
|
1433
|
-
|
|
1434
|
-
|
|
1105
|
+
const fn = vnode.props["onUpdate:modelValue"] || false;
|
|
1106
|
+
return (0, _vue_shared.isArray)(fn) ? (value) => (0, _vue_shared.invokeArrayFns)(fn, value) : fn;
|
|
1435
1107
|
};
|
|
1436
1108
|
function onCompositionStart(e) {
|
|
1437
|
-
|
|
1109
|
+
e.target.composing = true;
|
|
1438
1110
|
}
|
|
1439
1111
|
function onCompositionEnd(e) {
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1112
|
+
const target = e.target;
|
|
1113
|
+
if (target.composing) {
|
|
1114
|
+
target.composing = false;
|
|
1115
|
+
target.dispatchEvent(new Event("input"));
|
|
1116
|
+
}
|
|
1445
1117
|
}
|
|
1446
|
-
const assignKey =
|
|
1118
|
+
const assignKey = Symbol("_assign");
|
|
1447
1119
|
const vModelText = {
|
|
1448
|
-
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1453
|
-
|
|
1454
|
-
|
|
1455
|
-
|
|
1456
|
-
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
el.value = value == null ? "" : value;
|
|
1460
|
-
},
|
|
1461
|
-
beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
|
|
1462
|
-
el[assignKey] = getModelAssigner(vnode);
|
|
1463
|
-
vModelTextUpdate(el, oldValue, value, trim, number, lazy);
|
|
1464
|
-
}
|
|
1120
|
+
created(el, { modifiers: { lazy, trim, number } }, vnode) {
|
|
1121
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1122
|
+
vModelTextInit(el, trim, number || !!(vnode.props && vnode.props.type === "number"), lazy);
|
|
1123
|
+
},
|
|
1124
|
+
mounted(el, { value }) {
|
|
1125
|
+
el.value = value == null ? "" : value;
|
|
1126
|
+
},
|
|
1127
|
+
beforeUpdate(el, { value, oldValue, modifiers: { lazy, trim, number } }, vnode) {
|
|
1128
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1129
|
+
vModelTextUpdate(el, oldValue, value, trim, number, lazy);
|
|
1130
|
+
}
|
|
1465
1131
|
};
|
|
1466
1132
|
function castValue(value, trim, number) {
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1133
|
+
if (trim) value = value.trim();
|
|
1134
|
+
if (number) value = (0, _vue_shared.looseToNumber)(value);
|
|
1135
|
+
return value;
|
|
1470
1136
|
}
|
|
1137
|
+
/**
|
|
1138
|
+
* @internal
|
|
1139
|
+
*/
|
|
1471
1140
|
const vModelTextInit = (el, trim, number, lazy, set) => {
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
addEventListener(el, "compositionstart", onCompositionStart);
|
|
1485
|
-
addEventListener(el, "compositionend", onCompositionEnd);
|
|
1486
|
-
addEventListener(el, "change", onCompositionEnd);
|
|
1487
|
-
}
|
|
1141
|
+
addEventListener(el, lazy ? "change" : "input", (e) => {
|
|
1142
|
+
if (e.target.composing) return;
|
|
1143
|
+
(set || el[assignKey])(castValue(el.value, trim, number || el.type === "number"));
|
|
1144
|
+
});
|
|
1145
|
+
if (trim || number) addEventListener(el, "change", () => {
|
|
1146
|
+
el.value = castValue(el.value, trim, number || el.type === "number");
|
|
1147
|
+
});
|
|
1148
|
+
if (!lazy) {
|
|
1149
|
+
addEventListener(el, "compositionstart", onCompositionStart);
|
|
1150
|
+
addEventListener(el, "compositionend", onCompositionEnd);
|
|
1151
|
+
addEventListener(el, "change", onCompositionEnd);
|
|
1152
|
+
}
|
|
1488
1153
|
};
|
|
1154
|
+
/**
|
|
1155
|
+
* @internal
|
|
1156
|
+
*/
|
|
1489
1157
|
const vModelTextUpdate = (el, oldValue, value, trim, number, lazy) => {
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
}
|
|
1500
|
-
if (trim && el.value.trim() === newValue) {
|
|
1501
|
-
return;
|
|
1502
|
-
}
|
|
1503
|
-
}
|
|
1504
|
-
el.value = newValue;
|
|
1158
|
+
if (el.composing) return;
|
|
1159
|
+
const elValue = (number || el.type === "number") && !/^0\d/.test(el.value) ? (0, _vue_shared.looseToNumber)(el.value) : el.value;
|
|
1160
|
+
const newValue = value == null ? "" : value;
|
|
1161
|
+
if (elValue === newValue) return;
|
|
1162
|
+
if (document.activeElement === el && el.type !== "range") {
|
|
1163
|
+
if (lazy && value === oldValue) return;
|
|
1164
|
+
if (trim && el.value.trim() === newValue) return;
|
|
1165
|
+
}
|
|
1166
|
+
el.value = newValue;
|
|
1505
1167
|
};
|
|
1506
1168
|
const vModelCheckbox = {
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
vnode.props.value
|
|
1520
|
-
);
|
|
1521
|
-
},
|
|
1522
|
-
beforeUpdate(el, binding, vnode) {
|
|
1523
|
-
el[assignKey] = getModelAssigner(vnode);
|
|
1524
|
-
vModelCheckboxUpdate(
|
|
1525
|
-
el,
|
|
1526
|
-
binding.oldValue,
|
|
1527
|
-
binding.value,
|
|
1528
|
-
vnode.props.value
|
|
1529
|
-
);
|
|
1530
|
-
}
|
|
1169
|
+
deep: true,
|
|
1170
|
+
created(el, _, vnode) {
|
|
1171
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1172
|
+
vModelCheckboxInit(el);
|
|
1173
|
+
},
|
|
1174
|
+
mounted(el, binding, vnode) {
|
|
1175
|
+
vModelCheckboxUpdate(el, binding.oldValue, binding.value, vnode.props.value);
|
|
1176
|
+
},
|
|
1177
|
+
beforeUpdate(el, binding, vnode) {
|
|
1178
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1179
|
+
vModelCheckboxUpdate(el, binding.oldValue, binding.value, vnode.props.value);
|
|
1180
|
+
}
|
|
1531
1181
|
};
|
|
1182
|
+
/**
|
|
1183
|
+
* @internal
|
|
1184
|
+
*/
|
|
1532
1185
|
const vModelCheckboxInit = (el, set) => {
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
}
|
|
1555
|
-
assign(cloned);
|
|
1556
|
-
} else {
|
|
1557
|
-
assign(getCheckboxValue(el, checked));
|
|
1558
|
-
}
|
|
1559
|
-
});
|
|
1186
|
+
addEventListener(el, "change", () => {
|
|
1187
|
+
const assign = set || el[assignKey];
|
|
1188
|
+
const modelValue = el._modelValue;
|
|
1189
|
+
const elementValue = getValue(el);
|
|
1190
|
+
const checked = el.checked;
|
|
1191
|
+
if ((0, _vue_shared.isArray)(modelValue)) {
|
|
1192
|
+
const index = (0, _vue_shared.looseIndexOf)(modelValue, elementValue);
|
|
1193
|
+
const found = index !== -1;
|
|
1194
|
+
if (checked && !found) assign(modelValue.concat(elementValue));
|
|
1195
|
+
else if (!checked && found) {
|
|
1196
|
+
const filtered = [...modelValue];
|
|
1197
|
+
filtered.splice(index, 1);
|
|
1198
|
+
assign(filtered);
|
|
1199
|
+
}
|
|
1200
|
+
} else if ((0, _vue_shared.isSet)(modelValue)) {
|
|
1201
|
+
const cloned = new Set(modelValue);
|
|
1202
|
+
if (checked) cloned.add(elementValue);
|
|
1203
|
+
else cloned.delete(elementValue);
|
|
1204
|
+
assign(cloned);
|
|
1205
|
+
} else assign(getCheckboxValue(el, checked));
|
|
1206
|
+
});
|
|
1560
1207
|
};
|
|
1208
|
+
/**
|
|
1209
|
+
* @internal
|
|
1210
|
+
*/
|
|
1561
1211
|
const vModelCheckboxUpdate = (el, oldValue, value, rawValue = getValue(el)) => {
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
}
|
|
1572
|
-
if (el.checked !== checked) {
|
|
1573
|
-
el.checked = checked;
|
|
1574
|
-
}
|
|
1212
|
+
el._modelValue = value;
|
|
1213
|
+
let checked;
|
|
1214
|
+
if ((0, _vue_shared.isArray)(value)) checked = (0, _vue_shared.looseIndexOf)(value, rawValue) > -1;
|
|
1215
|
+
else if ((0, _vue_shared.isSet)(value)) checked = value.has(rawValue);
|
|
1216
|
+
else {
|
|
1217
|
+
if (value === oldValue) return;
|
|
1218
|
+
checked = (0, _vue_shared.looseEqual)(value, getCheckboxValue(el, true));
|
|
1219
|
+
}
|
|
1220
|
+
if (el.checked !== checked) el.checked = checked;
|
|
1575
1221
|
};
|
|
1576
1222
|
const vModelRadio = {
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
}
|
|
1589
|
-
}
|
|
1223
|
+
created(el, { value }, vnode) {
|
|
1224
|
+
el.checked = (0, _vue_shared.looseEqual)(value, vnode.props.value);
|
|
1225
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1226
|
+
addEventListener(el, "change", () => {
|
|
1227
|
+
el[assignKey](getValue(el));
|
|
1228
|
+
});
|
|
1229
|
+
},
|
|
1230
|
+
beforeUpdate(el, { value, oldValue }, vnode) {
|
|
1231
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1232
|
+
if (value !== oldValue) el.checked = (0, _vue_shared.looseEqual)(value, vnode.props.value);
|
|
1233
|
+
}
|
|
1590
1234
|
};
|
|
1591
1235
|
const vModelSelect = {
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
updated(el, { value }) {
|
|
1607
|
-
vModelSetSelected(el, value);
|
|
1608
|
-
}
|
|
1236
|
+
deep: true,
|
|
1237
|
+
created(el, { value, modifiers: { number } }, vnode) {
|
|
1238
|
+
vModelSelectInit(el, value, number);
|
|
1239
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1240
|
+
},
|
|
1241
|
+
mounted(el, { value }) {
|
|
1242
|
+
vModelSetSelected(el, value);
|
|
1243
|
+
},
|
|
1244
|
+
beforeUpdate(el, _binding, vnode) {
|
|
1245
|
+
el[assignKey] = getModelAssigner(vnode);
|
|
1246
|
+
},
|
|
1247
|
+
updated(el, { value }) {
|
|
1248
|
+
vModelSetSelected(el, value);
|
|
1249
|
+
}
|
|
1609
1250
|
};
|
|
1251
|
+
/**
|
|
1252
|
+
* @internal
|
|
1253
|
+
*/
|
|
1610
1254
|
const vModelSelectInit = (el, value, number, set) => {
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
runtimeCore.nextTick(() => {
|
|
1621
|
-
el._assigning = false;
|
|
1622
|
-
});
|
|
1623
|
-
});
|
|
1255
|
+
const isSetModel = (0, _vue_shared.isSet)(value);
|
|
1256
|
+
addEventListener(el, "change", () => {
|
|
1257
|
+
const selectedVal = Array.prototype.filter.call(el.options, (o) => o.selected).map((o) => number ? (0, _vue_shared.looseToNumber)(getValue(o)) : getValue(o));
|
|
1258
|
+
(set || el[assignKey])(el.multiple ? isSetModel ? new Set(selectedVal) : selectedVal : selectedVal[0]);
|
|
1259
|
+
el._assigning = true;
|
|
1260
|
+
(0, _vue_runtime_core.nextTick)(() => {
|
|
1261
|
+
el._assigning = false;
|
|
1262
|
+
});
|
|
1263
|
+
});
|
|
1624
1264
|
};
|
|
1265
|
+
/**
|
|
1266
|
+
* @internal
|
|
1267
|
+
*/
|
|
1625
1268
|
const vModelSetSelected = (el, value) => {
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
option.selected = value.has(optionValue);
|
|
1648
|
-
}
|
|
1649
|
-
} else if (shared.looseEqual(getValue(option), value)) {
|
|
1650
|
-
if (el.selectedIndex !== i) el.selectedIndex = i;
|
|
1651
|
-
return;
|
|
1652
|
-
}
|
|
1653
|
-
}
|
|
1654
|
-
if (!isMultiple && el.selectedIndex !== -1) {
|
|
1655
|
-
el.selectedIndex = -1;
|
|
1656
|
-
}
|
|
1269
|
+
if (el._assigning) return;
|
|
1270
|
+
const isMultiple = el.multiple;
|
|
1271
|
+
const isArrayValue = (0, _vue_shared.isArray)(value);
|
|
1272
|
+
if (isMultiple && !isArrayValue && !(0, _vue_shared.isSet)(value)) {
|
|
1273
|
+
(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)}.`);
|
|
1274
|
+
return;
|
|
1275
|
+
}
|
|
1276
|
+
for (let i = 0, l = el.options.length; i < l; i++) {
|
|
1277
|
+
const option = el.options[i];
|
|
1278
|
+
const optionValue = getValue(option);
|
|
1279
|
+
if (isMultiple) if (isArrayValue) {
|
|
1280
|
+
const optionType = typeof optionValue;
|
|
1281
|
+
if (optionType === "string" || optionType === "number") option.selected = value.some((v) => String(v) === String(optionValue));
|
|
1282
|
+
else option.selected = (0, _vue_shared.looseIndexOf)(value, optionValue) > -1;
|
|
1283
|
+
} else option.selected = value.has(optionValue);
|
|
1284
|
+
else if ((0, _vue_shared.looseEqual)(getValue(option), value)) {
|
|
1285
|
+
if (el.selectedIndex !== i) el.selectedIndex = i;
|
|
1286
|
+
return;
|
|
1287
|
+
}
|
|
1288
|
+
}
|
|
1289
|
+
if (!isMultiple && el.selectedIndex !== -1) el.selectedIndex = -1;
|
|
1657
1290
|
};
|
|
1291
|
+
/**
|
|
1292
|
+
* @internal retrieve raw value set via :value bindings
|
|
1293
|
+
*/
|
|
1658
1294
|
function getValue(el) {
|
|
1659
|
-
|
|
1295
|
+
return "_value" in el ? el._value : el.value;
|
|
1660
1296
|
}
|
|
1661
1297
|
function getCheckboxValue(el, checked) {
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
if (el.hasAttribute(attr)) {
|
|
1668
|
-
return el.getAttribute(attr);
|
|
1669
|
-
}
|
|
1670
|
-
return checked;
|
|
1298
|
+
const key = checked ? "_trueValue" : "_falseValue";
|
|
1299
|
+
if (key in el) return el[key];
|
|
1300
|
+
const attr = checked ? "true-value" : "false-value";
|
|
1301
|
+
if (el.hasAttribute(attr)) return el.getAttribute(attr);
|
|
1302
|
+
return checked;
|
|
1671
1303
|
}
|
|
1672
1304
|
const vModelDynamic = {
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1305
|
+
created(el, binding, vnode) {
|
|
1306
|
+
callModelHook(el, binding, vnode, null, "created");
|
|
1307
|
+
},
|
|
1308
|
+
mounted(el, binding, vnode) {
|
|
1309
|
+
callModelHook(el, binding, vnode, null, "mounted");
|
|
1310
|
+
},
|
|
1311
|
+
beforeUpdate(el, binding, vnode, prevVNode) {
|
|
1312
|
+
callModelHook(el, binding, vnode, prevVNode, "beforeUpdate");
|
|
1313
|
+
},
|
|
1314
|
+
updated(el, binding, vnode, prevVNode) {
|
|
1315
|
+
callModelHook(el, binding, vnode, prevVNode, "updated");
|
|
1316
|
+
}
|
|
1685
1317
|
};
|
|
1686
1318
|
function resolveDynamicModel(tagName, type) {
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
case "radio":
|
|
1697
|
-
return vModelRadio;
|
|
1698
|
-
default:
|
|
1699
|
-
return vModelText;
|
|
1700
|
-
}
|
|
1701
|
-
}
|
|
1319
|
+
switch (tagName) {
|
|
1320
|
+
case "SELECT": return vModelSelect;
|
|
1321
|
+
case "TEXTAREA": return vModelText;
|
|
1322
|
+
default: switch (type) {
|
|
1323
|
+
case "checkbox": return vModelCheckbox;
|
|
1324
|
+
case "radio": return vModelRadio;
|
|
1325
|
+
default: return vModelText;
|
|
1326
|
+
}
|
|
1327
|
+
}
|
|
1702
1328
|
}
|
|
1703
1329
|
function callModelHook(el, binding, vnode, prevVNode, hook) {
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
vnode.props && vnode.props.type
|
|
1707
|
-
);
|
|
1708
|
-
const fn = modelToUse[hook];
|
|
1709
|
-
fn && fn(el, binding, vnode, prevVNode);
|
|
1330
|
+
const fn = resolveDynamicModel(el.tagName, vnode.props && vnode.props.type)[hook];
|
|
1331
|
+
fn && fn(el, binding, vnode, prevVNode);
|
|
1710
1332
|
}
|
|
1711
1333
|
function initVModelForSSR() {
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
return { checked: true };
|
|
1729
|
-
}
|
|
1730
|
-
};
|
|
1731
|
-
vModelDynamic.getSSRProps = (binding, vnode) => {
|
|
1732
|
-
if (typeof vnode.type !== "string") {
|
|
1733
|
-
return;
|
|
1734
|
-
}
|
|
1735
|
-
const modelToUse = resolveDynamicModel(
|
|
1736
|
-
// resolveDynamicModel expects an uppercase tag name, but vnode.type is lowercase
|
|
1737
|
-
vnode.type.toUpperCase(),
|
|
1738
|
-
vnode.props && vnode.props.type
|
|
1739
|
-
);
|
|
1740
|
-
if (modelToUse.getSSRProps) {
|
|
1741
|
-
return modelToUse.getSSRProps(binding, vnode);
|
|
1742
|
-
}
|
|
1743
|
-
};
|
|
1334
|
+
vModelText.getSSRProps = ({ value }) => ({ value });
|
|
1335
|
+
vModelRadio.getSSRProps = ({ value }, vnode) => {
|
|
1336
|
+
if (vnode.props && (0, _vue_shared.looseEqual)(vnode.props.value, value)) return { checked: true };
|
|
1337
|
+
};
|
|
1338
|
+
vModelCheckbox.getSSRProps = ({ value }, vnode) => {
|
|
1339
|
+
if ((0, _vue_shared.isArray)(value)) {
|
|
1340
|
+
if (vnode.props && (0, _vue_shared.looseIndexOf)(value, vnode.props.value) > -1) return { checked: true };
|
|
1341
|
+
} else if ((0, _vue_shared.isSet)(value)) {
|
|
1342
|
+
if (vnode.props && value.has(vnode.props.value)) return { checked: true };
|
|
1343
|
+
} else if (value) return { checked: true };
|
|
1344
|
+
};
|
|
1345
|
+
vModelDynamic.getSSRProps = (binding, vnode) => {
|
|
1346
|
+
if (typeof vnode.type !== "string") return;
|
|
1347
|
+
const modelToUse = resolveDynamicModel(vnode.type.toUpperCase(), vnode.props && vnode.props.type);
|
|
1348
|
+
if (modelToUse.getSSRProps) return modelToUse.getSSRProps(binding, vnode);
|
|
1349
|
+
};
|
|
1744
1350
|
}
|
|
1745
1351
|
|
|
1746
|
-
|
|
1352
|
+
//#endregion
|
|
1353
|
+
//#region packages/runtime-dom/src/directives/vOn.ts
|
|
1354
|
+
const systemModifiers = [
|
|
1355
|
+
"ctrl",
|
|
1356
|
+
"shift",
|
|
1357
|
+
"alt",
|
|
1358
|
+
"meta"
|
|
1359
|
+
];
|
|
1747
1360
|
const modifierGuards = {
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
|
|
1758
|
-
|
|
1361
|
+
stop: (e) => e.stopPropagation(),
|
|
1362
|
+
prevent: (e) => e.preventDefault(),
|
|
1363
|
+
self: (e) => e.target !== e.currentTarget,
|
|
1364
|
+
ctrl: (e) => !e.ctrlKey,
|
|
1365
|
+
shift: (e) => !e.shiftKey,
|
|
1366
|
+
alt: (e) => !e.altKey,
|
|
1367
|
+
meta: (e) => !e.metaKey,
|
|
1368
|
+
left: (e) => "button" in e && e.button !== 0,
|
|
1369
|
+
middle: (e) => "button" in e && e.button !== 1,
|
|
1370
|
+
right: (e) => "button" in e && e.button !== 2,
|
|
1371
|
+
exact: (e, modifiers) => systemModifiers.some((m) => e[`${m}Key`] && !modifiers.includes(m))
|
|
1759
1372
|
};
|
|
1373
|
+
/**
|
|
1374
|
+
* @private
|
|
1375
|
+
*/
|
|
1760
1376
|
const withModifiers = (fn, modifiers) => {
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1377
|
+
const cache = fn._withMods || (fn._withMods = {});
|
|
1378
|
+
const cacheKey = modifiers.join(".");
|
|
1379
|
+
return cache[cacheKey] || (cache[cacheKey] = ((event, ...args) => {
|
|
1380
|
+
for (let i = 0; i < modifiers.length; i++) {
|
|
1381
|
+
const guard = modifierGuards[modifiers[i]];
|
|
1382
|
+
if (guard && guard(event, modifiers)) return;
|
|
1383
|
+
}
|
|
1384
|
+
return fn(event, ...args);
|
|
1385
|
+
}));
|
|
1770
1386
|
};
|
|
1771
1387
|
const keyNames = {
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1776
|
-
|
|
1777
|
-
|
|
1778
|
-
|
|
1388
|
+
esc: "escape",
|
|
1389
|
+
space: " ",
|
|
1390
|
+
up: "arrow-up",
|
|
1391
|
+
left: "arrow-left",
|
|
1392
|
+
right: "arrow-right",
|
|
1393
|
+
down: "arrow-down",
|
|
1394
|
+
delete: "backspace"
|
|
1779
1395
|
};
|
|
1396
|
+
/**
|
|
1397
|
+
* @private
|
|
1398
|
+
*/
|
|
1780
1399
|
const withKeys = (fn, modifiers) => {
|
|
1781
|
-
|
|
1782
|
-
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
if (modifiers.some(
|
|
1789
|
-
(k) => k === eventKey || keyNames[k] === eventKey
|
|
1790
|
-
)) {
|
|
1791
|
-
return fn(event);
|
|
1792
|
-
}
|
|
1793
|
-
}));
|
|
1400
|
+
const cache = fn._withKeys || (fn._withKeys = {});
|
|
1401
|
+
const cacheKey = modifiers.join(".");
|
|
1402
|
+
return cache[cacheKey] || (cache[cacheKey] = ((event) => {
|
|
1403
|
+
if (!("key" in event)) return;
|
|
1404
|
+
const eventKey = (0, _vue_shared.hyphenate)(event.key);
|
|
1405
|
+
if (modifiers.some((k) => k === eventKey || keyNames[k] === eventKey)) return fn(event);
|
|
1406
|
+
}));
|
|
1794
1407
|
};
|
|
1795
1408
|
|
|
1796
|
-
|
|
1409
|
+
//#endregion
|
|
1410
|
+
//#region packages/runtime-dom/src/index.ts
|
|
1411
|
+
const rendererOptions = /* @__PURE__ */ (0, _vue_shared.extend)({ patchProp }, nodeOps);
|
|
1797
1412
|
let renderer;
|
|
1798
1413
|
let enabledHydration = false;
|
|
1799
1414
|
function ensureRenderer() {
|
|
1800
|
-
|
|
1415
|
+
return renderer || (renderer = (0, _vue_runtime_core.createRenderer)(rendererOptions));
|
|
1801
1416
|
}
|
|
1802
1417
|
function ensureHydrationRenderer() {
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
|
|
1418
|
+
renderer = enabledHydration ? renderer : (0, _vue_runtime_core.createHydrationRenderer)(rendererOptions);
|
|
1419
|
+
enabledHydration = true;
|
|
1420
|
+
return renderer;
|
|
1806
1421
|
}
|
|
1807
1422
|
const render = ((...args) => {
|
|
1808
|
-
|
|
1423
|
+
ensureRenderer().render(...args);
|
|
1809
1424
|
});
|
|
1810
1425
|
const hydrate = ((...args) => {
|
|
1811
|
-
|
|
1426
|
+
ensureHydrationRenderer().hydrate(...args);
|
|
1812
1427
|
});
|
|
1813
1428
|
const createApp = ((...args) => {
|
|
1814
|
-
|
|
1815
|
-
|
|
1816
|
-
|
|
1817
|
-
|
|
1818
|
-
|
|
1819
|
-
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
container.removeAttribute("v-cloak");
|
|
1833
|
-
container.setAttribute("data-v-app", "");
|
|
1834
|
-
}
|
|
1835
|
-
return proxy;
|
|
1836
|
-
};
|
|
1837
|
-
return app;
|
|
1429
|
+
const app = ensureRenderer().createApp(...args);
|
|
1430
|
+
injectNativeTagCheck(app);
|
|
1431
|
+
injectCompilerOptionsCheck(app);
|
|
1432
|
+
const { mount } = app;
|
|
1433
|
+
app.mount = (containerOrSelector) => {
|
|
1434
|
+
const container = normalizeContainer(containerOrSelector);
|
|
1435
|
+
if (!container) return;
|
|
1436
|
+
const component = app._component;
|
|
1437
|
+
if (!(0, _vue_shared.isFunction)(component) && !component.render && !component.template) component.template = container.innerHTML;
|
|
1438
|
+
if (container.nodeType === 1) container.textContent = "";
|
|
1439
|
+
const proxy = mount(container, false, resolveRootNamespace(container));
|
|
1440
|
+
if (container instanceof Element) {
|
|
1441
|
+
container.removeAttribute("v-cloak");
|
|
1442
|
+
container.setAttribute("data-v-app", "");
|
|
1443
|
+
}
|
|
1444
|
+
return proxy;
|
|
1445
|
+
};
|
|
1446
|
+
return app;
|
|
1838
1447
|
});
|
|
1839
1448
|
const createSSRApp = ((...args) => {
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
|
|
1850
|
-
}
|
|
1851
|
-
};
|
|
1852
|
-
return app;
|
|
1449
|
+
(0, _vue_runtime_core.setIsHydratingEnabled)(true);
|
|
1450
|
+
const app = ensureHydrationRenderer().createApp(...args);
|
|
1451
|
+
injectNativeTagCheck(app);
|
|
1452
|
+
injectCompilerOptionsCheck(app);
|
|
1453
|
+
const { mount } = app;
|
|
1454
|
+
app.mount = (containerOrSelector) => {
|
|
1455
|
+
const container = normalizeContainer(containerOrSelector);
|
|
1456
|
+
if (container) return mount(container, true, resolveRootNamespace(container));
|
|
1457
|
+
};
|
|
1458
|
+
return app;
|
|
1853
1459
|
});
|
|
1854
1460
|
function resolveRootNamespace(container) {
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
}
|
|
1858
|
-
if (typeof MathMLElement === "function" && container instanceof MathMLElement) {
|
|
1859
|
-
return "mathml";
|
|
1860
|
-
}
|
|
1461
|
+
if (container instanceof SVGElement) return "svg";
|
|
1462
|
+
if (typeof MathMLElement === "function" && container instanceof MathMLElement) return "mathml";
|
|
1861
1463
|
}
|
|
1862
1464
|
function injectNativeTagCheck(app) {
|
|
1863
|
-
|
|
1864
|
-
|
|
1865
|
-
|
|
1866
|
-
|
|
1465
|
+
Object.defineProperty(app.config, "isNativeTag", {
|
|
1466
|
+
value: (tag) => (0, _vue_shared.isHTMLTag)(tag) || (0, _vue_shared.isSVGTag)(tag) || (0, _vue_shared.isMathMLTag)(tag),
|
|
1467
|
+
writable: false
|
|
1468
|
+
});
|
|
1867
1469
|
}
|
|
1868
1470
|
function injectCompilerOptionsCheck(app) {
|
|
1869
|
-
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1875
|
-
|
|
1876
|
-
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1891
|
-
set() {
|
|
1892
|
-
runtimeCore.warn(msg);
|
|
1893
|
-
}
|
|
1894
|
-
});
|
|
1895
|
-
}
|
|
1471
|
+
if ((0, _vue_runtime_core.isRuntimeOnly)()) {
|
|
1472
|
+
const isCustomElement = app.config.isCustomElement;
|
|
1473
|
+
Object.defineProperty(app.config, "isCustomElement", {
|
|
1474
|
+
get() {
|
|
1475
|
+
return isCustomElement;
|
|
1476
|
+
},
|
|
1477
|
+
set() {
|
|
1478
|
+
(0, _vue_runtime_core.warn)("The `isCustomElement` config option is deprecated. Use `compilerOptions.isCustomElement` instead.");
|
|
1479
|
+
}
|
|
1480
|
+
});
|
|
1481
|
+
const compilerOptions = app.config.compilerOptions;
|
|
1482
|
+
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";
|
|
1483
|
+
Object.defineProperty(app.config, "compilerOptions", {
|
|
1484
|
+
get() {
|
|
1485
|
+
(0, _vue_runtime_core.warn)(msg);
|
|
1486
|
+
return compilerOptions;
|
|
1487
|
+
},
|
|
1488
|
+
set() {
|
|
1489
|
+
(0, _vue_runtime_core.warn)(msg);
|
|
1490
|
+
}
|
|
1491
|
+
});
|
|
1492
|
+
}
|
|
1896
1493
|
}
|
|
1494
|
+
/**
|
|
1495
|
+
* @internal
|
|
1496
|
+
*/
|
|
1897
1497
|
function normalizeContainer(container) {
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
|
|
1905
|
-
return res;
|
|
1906
|
-
}
|
|
1907
|
-
if (window.ShadowRoot && container instanceof window.ShadowRoot && container.mode === "closed") {
|
|
1908
|
-
runtimeCore.warn(
|
|
1909
|
-
`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
|
|
1910
|
-
);
|
|
1911
|
-
}
|
|
1912
|
-
return container;
|
|
1498
|
+
if ((0, _vue_shared.isString)(container)) {
|
|
1499
|
+
const res = document.querySelector(container);
|
|
1500
|
+
if (!res) (0, _vue_runtime_core.warn)(`Failed to mount app: mount target selector "${container}" returned null.`);
|
|
1501
|
+
return res;
|
|
1502
|
+
}
|
|
1503
|
+
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`);
|
|
1504
|
+
return container;
|
|
1913
1505
|
}
|
|
1914
1506
|
let ssrDirectiveInitialized = false;
|
|
1507
|
+
/**
|
|
1508
|
+
* @internal
|
|
1509
|
+
*/
|
|
1915
1510
|
const initDirectivesForSSR = () => {
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1919
|
-
|
|
1920
|
-
|
|
1921
|
-
}
|
|
1511
|
+
if (!ssrDirectiveInitialized) {
|
|
1512
|
+
ssrDirectiveInitialized = true;
|
|
1513
|
+
initVModelForSSR();
|
|
1514
|
+
initVShowForSSR();
|
|
1515
|
+
}
|
|
1516
|
+
};
|
|
1922
1517
|
|
|
1518
|
+
//#endregion
|
|
1923
1519
|
exports.Transition = Transition;
|
|
1924
1520
|
exports.TransitionGroup = TransitionGroup;
|
|
1925
1521
|
exports.VueElement = VueElement;
|
|
@@ -1945,6 +1541,9 @@ exports.vModelText = vModelText;
|
|
|
1945
1541
|
exports.vShow = vShow;
|
|
1946
1542
|
exports.withKeys = withKeys;
|
|
1947
1543
|
exports.withModifiers = withModifiers;
|
|
1948
|
-
Object.keys(
|
|
1949
|
-
if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) exports
|
|
1544
|
+
Object.keys(_vue_runtime_core).forEach(function (k) {
|
|
1545
|
+
if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
|
|
1546
|
+
enumerable: true,
|
|
1547
|
+
get: function () { return _vue_runtime_core[k]; }
|
|
1548
|
+
});
|
|
1950
1549
|
});
|