@vue/runtime-dom 3.2.46 → 3.3.0-alpha.1

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.
Files changed (9) hide show
  1. package/dist/runtime-dom.cjs.js +1281 -1456
  2. package/dist/runtime-dom.cjs.prod.js +1194 -1367
  3. package/dist/runtime-dom.d.ts +137 -180
  4. package/dist/runtime-dom.esm-browser.js +9244 -9907
  5. package/dist/runtime-dom.esm-browser.prod.js +1 -1
  6. package/dist/runtime-dom.esm-bundler.js +1333 -1516
  7. package/dist/runtime-dom.global.js +9233 -9896
  8. package/dist/runtime-dom.global.prod.js +1 -1
  9. package/package.json +3 -3
package/dist/runtime-dom.cjs.js CHANGED
@@ -1,1641 +1,1466 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var runtimeCore = require('@vue/runtime-core');
4
6
  var shared = require('@vue/shared');
5
7
 
6
- const svgNS = 'http://www.w3.org/2000/svg';
7
- const doc = (typeof document !== 'undefined' ? document : null);
8
- const templateContainer = doc && /*#__PURE__*/ doc.createElement('template');
8
+ const svgNS = "http://www.w3.org/2000/svg";
9
+ const doc = typeof document !== "undefined" ? document : null;
10
+ const templateContainer = doc && /* @__PURE__ */ doc.createElement("template");
9
11
  const nodeOps = {
10
- insert: (child, parent, anchor) => {
11
- parent.insertBefore(child, anchor || null);
12
- },
13
- remove: child => {
14
- const parent = child.parentNode;
15
- if (parent) {
16
- parent.removeChild(child);
17
- }
18
- },
19
- createElement: (tag, isSVG, is, props) => {
20
- const el = isSVG
21
- ? doc.createElementNS(svgNS, tag)
22
- : doc.createElement(tag, is ? { is } : undefined);
23
- if (tag === 'select' && props && props.multiple != null) {
24
- el.setAttribute('multiple', props.multiple);
25
- }
26
- return el;
27
- },
28
- createText: text => doc.createTextNode(text),
29
- createComment: text => doc.createComment(text),
30
- setText: (node, text) => {
31
- node.nodeValue = text;
32
- },
33
- setElementText: (el, text) => {
34
- el.textContent = text;
35
- },
36
- parentNode: node => node.parentNode,
37
- nextSibling: node => node.nextSibling,
38
- querySelector: selector => doc.querySelector(selector),
39
- setScopeId(el, id) {
40
- el.setAttribute(id, '');
41
- },
42
- // __UNSAFE__
43
- // Reason: innerHTML.
44
- // Static content here can only come from compiled templates.
45
- // As long as the user only uses trusted templates, this is safe.
46
- insertStaticContent(content, parent, anchor, isSVG, start, end) {
47
- // <parent> before | first ... last | anchor </parent>
48
- const before = anchor ? anchor.previousSibling : parent.lastChild;
49
- // #5308 can only take cached path if:
50
- // - has a single root node
51
- // - nextSibling info is still available
52
- if (start && (start === end || start.nextSibling)) {
53
- // cached
54
- while (true) {
55
- parent.insertBefore(start.cloneNode(true), anchor);
56
- if (start === end || !(start = start.nextSibling))
57
- break;
58
- }
59
- }
60
- else {
61
- // fresh insert
62
- templateContainer.innerHTML = isSVG ? `<svg>${content}</svg>` : content;
63
- const template = templateContainer.content;
64
- if (isSVG) {
65
- // remove outer svg wrapper
66
- const wrapper = template.firstChild;
67
- while (wrapper.firstChild) {
68
- template.appendChild(wrapper.firstChild);
69
- }
70
- template.removeChild(wrapper);
71
- }
72
- parent.insertBefore(template, anchor);
73
- }
74
- return [
75
- // first
76
- before ? before.nextSibling : parent.firstChild,
77
- // last
78
- anchor ? anchor.previousSibling : parent.lastChild
79
- ];
80
- }
12
+ insert: (child, parent, anchor) => {
13
+ parent.insertBefore(child, anchor || null);
14
+ },
15
+ remove: (child) => {
16
+ const parent = child.parentNode;
17
+ if (parent) {
18
+ parent.removeChild(child);
19
+ }
20
+ },
21
+ createElement: (tag, isSVG, is, props) => {
22
+ const el = isSVG ? doc.createElementNS(svgNS, tag) : doc.createElement(tag, is ? { is } : void 0);
23
+ if (tag === "select" && props && props.multiple != null) {
24
+ el.setAttribute("multiple", props.multiple);
25
+ }
26
+ return el;
27
+ },
28
+ createText: (text) => doc.createTextNode(text),
29
+ createComment: (text) => doc.createComment(text),
30
+ setText: (node, text) => {
31
+ node.nodeValue = text;
32
+ },
33
+ setElementText: (el, text) => {
34
+ el.textContent = text;
35
+ },
36
+ parentNode: (node) => node.parentNode,
37
+ nextSibling: (node) => node.nextSibling,
38
+ querySelector: (selector) => doc.querySelector(selector),
39
+ setScopeId(el, id) {
40
+ el.setAttribute(id, "");
41
+ },
42
+ // __UNSAFE__
43
+ // Reason: innerHTML.
44
+ // Static content here can only come from compiled templates.
45
+ // As long as the user only uses trusted templates, this is safe.
46
+ insertStaticContent(content, parent, anchor, isSVG, start, end) {
47
+ const before = anchor ? anchor.previousSibling : parent.lastChild;
48
+ if (start && (start === end || start.nextSibling)) {
49
+ while (true) {
50
+ parent.insertBefore(start.cloneNode(true), anchor);
51
+ if (start === end || !(start = start.nextSibling))
52
+ break;
53
+ }
54
+ } else {
55
+ templateContainer.innerHTML = isSVG ? `<svg>${content}</svg>` : content;
56
+ const template = templateContainer.content;
57
+ if (isSVG) {
58
+ const wrapper = template.firstChild;
59
+ while (wrapper.firstChild) {
60
+ template.appendChild(wrapper.firstChild);
61
+ }
62
+ template.removeChild(wrapper);
63
+ }
64
+ parent.insertBefore(template, anchor);
65
+ }
66
+ return [
67
+ // first
68
+ before ? before.nextSibling : parent.firstChild,
69
+ // last
70
+ anchor ? anchor.previousSibling : parent.lastChild
71
+ ];
72
+ }
81
73
  };
82
74
 
83
- // compiler should normalize class + :class bindings on the same element
84
- // into a single binding ['staticClass', dynamic]
85
75
  function patchClass(el, value, isSVG) {
86
- // directly setting className should be faster than setAttribute in theory
87
- // if this is an element during a transition, take the temporary transition
88
- // classes into account.
89
- const transitionClasses = el._vtc;
90
- if (transitionClasses) {
91
- value = (value ? [value, ...transitionClasses] : [...transitionClasses]).join(' ');
92
- }
93
- if (value == null) {
94
- el.removeAttribute('class');
95
- }
96
- else if (isSVG) {
97
- el.setAttribute('class', value);
98
- }
99
- else {
100
- el.className = value;
101
- }
76
+ const transitionClasses = el._vtc;
77
+ if (transitionClasses) {
78
+ value = (value ? [value, ...transitionClasses] : [...transitionClasses]).join(" ");
79
+ }
80
+ if (value == null) {
81
+ el.removeAttribute("class");
82
+ } else if (isSVG) {
83
+ el.setAttribute("class", value);
84
+ } else {
85
+ el.className = value;
86
+ }
102
87
  }
103
88
 
104
89
  function patchStyle(el, prev, next) {
105
- const style = el.style;
106
- const isCssString = shared.isString(next);
107
- if (next && !isCssString) {
108
- if (prev && !shared.isString(prev)) {
109
- for (const key in prev) {
110
- if (next[key] == null) {
111
- setStyle(style, key, '');
112
- }
113
- }
114
- }
115
- for (const key in next) {
116
- setStyle(style, key, next[key]);
117
- }
118
- }
119
- else {
120
- const currentDisplay = style.display;
121
- if (isCssString) {
122
- if (prev !== next) {
123
- style.cssText = next;
124
- }
125
- }
126
- else if (prev) {
127
- el.removeAttribute('style');
128
- }
129
- // indicates that the `display` of the element is controlled by `v-show`,
130
- // so we always keep the current `display` value regardless of the `style`
131
- // value, thus handing over control to `v-show`.
132
- if ('_vod' in el) {
133
- style.display = currentDisplay;
134
- }
135
- }
90
+ const style = el.style;
91
+ const isCssString = shared.isString(next);
92
+ if (next && !isCssString) {
93
+ if (prev && !shared.isString(prev)) {
94
+ for (const key in prev) {
95
+ if (next[key] == null) {
96
+ setStyle(style, key, "");
97
+ }
98
+ }
99
+ }
100
+ for (const key in next) {
101
+ setStyle(style, key, next[key]);
102
+ }
103
+ } else {
104
+ const currentDisplay = style.display;
105
+ if (isCssString) {
106
+ if (prev !== next) {
107
+ style.cssText = next;
108
+ }
109
+ } else if (prev) {
110
+ el.removeAttribute("style");
111
+ }
112
+ if ("_vod" in el) {
113
+ style.display = currentDisplay;
114
+ }
115
+ }
136
116
  }
137
117
  const semicolonRE = /[^\\];\s*$/;
138
118
  const importantRE = /\s*!important$/;
139
119
  function setStyle(style, name, val) {
140
- if (shared.isArray(val)) {
141
- val.forEach(v => setStyle(style, name, v));
142
- }
143
- else {
144
- if (val == null)
145
- val = '';
146
- {
147
- if (semicolonRE.test(val)) {
148
- runtimeCore.warn(`Unexpected semicolon at the end of '${name}' style value: '${val}'`);
149
- }
150
- }
151
- if (name.startsWith('--')) {
152
- // custom property definition
153
- style.setProperty(name, val);
154
- }
155
- else {
156
- const prefixed = autoPrefix(style, name);
157
- if (importantRE.test(val)) {
158
- // !important
159
- style.setProperty(shared.hyphenate(prefixed), val.replace(importantRE, ''), 'important');
160
- }
161
- else {
162
- style[prefixed] = val;
163
- }
164
- }
165
- }
120
+ if (shared.isArray(val)) {
121
+ val.forEach((v) => setStyle(style, name, v));
122
+ } else {
123
+ if (val == null)
124
+ val = "";
125
+ {
126
+ if (semicolonRE.test(val)) {
127
+ runtimeCore.warn(
128
+ `Unexpected semicolon at the end of '${name}' style value: '${val}'`
129
+ );
130
+ }
131
+ }
132
+ if (name.startsWith("--")) {
133
+ style.setProperty(name, val);
134
+ } else {
135
+ const prefixed = autoPrefix(style, name);
136
+ if (importantRE.test(val)) {
137
+ style.setProperty(
138
+ shared.hyphenate(prefixed),
139
+ val.replace(importantRE, ""),
140
+ "important"
141
+ );
142
+ } else {
143
+ style[prefixed] = val;
144
+ }
145
+ }
146
+ }
166
147
  }
167
- const prefixes = ['Webkit', 'Moz', 'ms'];
148
+ const prefixes = ["Webkit", "Moz", "ms"];
168
149
  const prefixCache = {};
169
150
  function autoPrefix(style, rawName) {
170
- const cached = prefixCache[rawName];
171
- if (cached) {
172
- return cached;
173
- }
174
- let name = runtimeCore.camelize(rawName);
175
- if (name !== 'filter' && name in style) {
176
- return (prefixCache[rawName] = name);
177
- }
178
- name = shared.capitalize(name);
179
- for (let i = 0; i < prefixes.length; i++) {
180
- const prefixed = prefixes[i] + name;
181
- if (prefixed in style) {
182
- return (prefixCache[rawName] = prefixed);
183
- }
184
- }
185
- return rawName;
151
+ const cached = prefixCache[rawName];
152
+ if (cached) {
153
+ return cached;
154
+ }
155
+ let name = runtimeCore.camelize(rawName);
156
+ if (name !== "filter" && name in style) {
157
+ return prefixCache[rawName] = name;
158
+ }
159
+ name = shared.capitalize(name);
160
+ for (let i = 0; i < prefixes.length; i++) {
161
+ const prefixed = prefixes[i] + name;
162
+ if (prefixed in style) {
163
+ return prefixCache[rawName] = prefixed;
164
+ }
165
+ }
166
+ return rawName;
186
167
  }
187
168
 
188
- const xlinkNS = 'http://www.w3.org/1999/xlink';
169
+ const xlinkNS = "http://www.w3.org/1999/xlink";
189
170
  function patchAttr(el, key, value, isSVG, instance) {
190
- if (isSVG && key.startsWith('xlink:')) {
191
- if (value == null) {
192
- el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
193
- }
194
- else {
195
- el.setAttributeNS(xlinkNS, key, value);
196
- }
197
- }
198
- else {
199
- // note we are only checking boolean attributes that don't have a
200
- // corresponding dom prop of the same name here.
201
- const isBoolean = shared.isSpecialBooleanAttr(key);
202
- if (value == null || (isBoolean && !shared.includeBooleanAttr(value))) {
203
- el.removeAttribute(key);
204
- }
205
- else {
206
- el.setAttribute(key, isBoolean ? '' : value);
207
- }
208
- }
171
+ if (isSVG && key.startsWith("xlink:")) {
172
+ if (value == null) {
173
+ el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
174
+ } else {
175
+ el.setAttributeNS(xlinkNS, key, value);
176
+ }
177
+ } else {
178
+ const isBoolean = shared.isSpecialBooleanAttr(key);
179
+ if (value == null || isBoolean && !shared.includeBooleanAttr(value)) {
180
+ el.removeAttribute(key);
181
+ } else {
182
+ el.setAttribute(key, isBoolean ? "" : value);
183
+ }
184
+ }
209
185
  }
210
186
 
211
- // __UNSAFE__
212
- // functions. The user is responsible for using them with only trusted content.
213
- function patchDOMProp(el, key, value,
214
- // the following args are passed only due to potential innerHTML/textContent
215
- // overriding existing VNodes, in which case the old tree must be properly
216
- // unmounted.
217
- prevChildren, parentComponent, parentSuspense, unmountChildren) {
218
- if (key === 'innerHTML' || key === 'textContent') {
219
- if (prevChildren) {
220
- unmountChildren(prevChildren, parentComponent, parentSuspense);
221
- }
222
- el[key] = value == null ? '' : value;
223
- return;
224
- }
225
- if (key === 'value' &&
226
- el.tagName !== 'PROGRESS' &&
227
- // custom elements may use _value internally
228
- !el.tagName.includes('-')) {
229
- // store value as _value as well since
230
- // non-string values will be stringified.
231
- el._value = value;
232
- const newValue = value == null ? '' : value;
233
- if (el.value !== newValue ||
234
- // #4956: always set for OPTION elements because its value falls back to
235
- // textContent if no value attribute is present. And setting .value for
236
- // OPTION has no side effect
237
- el.tagName === 'OPTION') {
238
- el.value = newValue;
239
- }
240
- if (value == null) {
241
- el.removeAttribute(key);
242
- }
243
- return;
187
+ function patchDOMProp(el, key, value, prevChildren, parentComponent, parentSuspense, unmountChildren) {
188
+ if (key === "innerHTML" || key === "textContent") {
189
+ if (prevChildren) {
190
+ unmountChildren(prevChildren, parentComponent, parentSuspense);
244
191
  }
245
- let needRemove = false;
246
- if (value === '' || value == null) {
247
- const type = typeof el[key];
248
- if (type === 'boolean') {
249
- // e.g. <select multiple> compiles to { multiple: '' }
250
- value = shared.includeBooleanAttr(value);
251
- }
252
- else if (value == null && type === 'string') {
253
- // e.g. <div :id="null">
254
- value = '';
255
- needRemove = true;
256
- }
257
- else if (type === 'number') {
258
- // e.g. <img :width="null">
259
- value = 0;
260
- needRemove = true;
261
- }
192
+ el[key] = value == null ? "" : value;
193
+ return;
194
+ }
195
+ if (key === "value" && el.tagName !== "PROGRESS" && // custom elements may use _value internally
196
+ !el.tagName.includes("-")) {
197
+ el._value = value;
198
+ const newValue = value == null ? "" : value;
199
+ if (el.value !== newValue || // #4956: always set for OPTION elements because its value falls back to
200
+ // textContent if no value attribute is present. And setting .value for
201
+ // OPTION has no side effect
202
+ el.tagName === "OPTION") {
203
+ el.value = newValue;
262
204
  }
263
- // some properties perform value validation and throw,
264
- // some properties has getter, no setter, will error in 'use strict'
265
- // eg. <select :type="null"></select> <select :willValidate="null"></select>
266
- try {
267
- el[key] = value;
268
- }
269
- catch (e) {
270
- // do not warn if value is auto-coerced from nullish values
271
- if (!needRemove) {
272
- runtimeCore.warn(`Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: ` +
273
- `value ${value} is invalid.`, e);
274
- }
205
+ if (value == null) {
206
+ el.removeAttribute(key);
275
207
  }
276
- needRemove && el.removeAttribute(key);
208
+ return;
209
+ }
210
+ let needRemove = false;
211
+ if (value === "" || value == null) {
212
+ const type = typeof el[key];
213
+ if (type === "boolean") {
214
+ value = shared.includeBooleanAttr(value);
215
+ } else if (value == null && type === "string") {
216
+ value = "";
217
+ needRemove = true;
218
+ } else if (type === "number") {
219
+ value = 0;
220
+ needRemove = true;
221
+ }
222
+ }
223
+ try {
224
+ el[key] = value;
225
+ } catch (e) {
226
+ if (!needRemove) {
227
+ runtimeCore.warn(
228
+ `Failed setting prop "${key}" on <${el.tagName.toLowerCase()}>: value ${value} is invalid.`,
229
+ e
230
+ );
231
+ }
232
+ }
233
+ needRemove && el.removeAttribute(key);
277
234
  }
278
235
 
279
236
  function addEventListener(el, event, handler, options) {
280
- el.addEventListener(event, handler, options);
237
+ el.addEventListener(event, handler, options);
281
238
  }
282
239
  function removeEventListener(el, event, handler, options) {
283
- el.removeEventListener(event, handler, options);
240
+ el.removeEventListener(event, handler, options);
284
241
  }
285
242
  function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
286
- // vei = vue event invokers
287
- const invokers = el._vei || (el._vei = {});
288
- const existingInvoker = invokers[rawName];
289
- if (nextValue && existingInvoker) {
290
- // patch
291
- existingInvoker.value = nextValue;
292
- }
293
- else {
294
- const [name, options] = parseName(rawName);
295
- if (nextValue) {
296
- // add
297
- const invoker = (invokers[rawName] = createInvoker(nextValue, instance));
298
- addEventListener(el, name, invoker, options);
299
- }
300
- else if (existingInvoker) {
301
- // remove
302
- removeEventListener(el, name, existingInvoker, options);
303
- invokers[rawName] = undefined;
304
- }
305
- }
243
+ const invokers = el._vei || (el._vei = {});
244
+ const existingInvoker = invokers[rawName];
245
+ if (nextValue && existingInvoker) {
246
+ existingInvoker.value = nextValue;
247
+ } else {
248
+ const [name, options] = parseName(rawName);
249
+ if (nextValue) {
250
+ const invoker = invokers[rawName] = createInvoker(nextValue, instance);
251
+ addEventListener(el, name, invoker, options);
252
+ } else if (existingInvoker) {
253
+ removeEventListener(el, name, existingInvoker, options);
254
+ invokers[rawName] = void 0;
255
+ }
256
+ }
306
257
  }
307
258
  const optionsModifierRE = /(?:Once|Passive|Capture)$/;
308
259
  function parseName(name) {
309
- let options;
310
- if (optionsModifierRE.test(name)) {
311
- options = {};
312
- let m;
313
- while ((m = name.match(optionsModifierRE))) {
314
- name = name.slice(0, name.length - m[0].length);
315
- options[m[0].toLowerCase()] = true;
316
- }
317
- }
318
- const event = name[2] === ':' ? name.slice(3) : shared.hyphenate(name.slice(2));
319
- return [event, options];
260
+ let options;
261
+ if (optionsModifierRE.test(name)) {
262
+ options = {};
263
+ let m;
264
+ while (m = name.match(optionsModifierRE)) {
265
+ name = name.slice(0, name.length - m[0].length);
266
+ options[m[0].toLowerCase()] = true;
267
+ }
268
+ }
269
+ const event = name[2] === ":" ? name.slice(3) : shared.hyphenate(name.slice(2));
270
+ return [event, options];
320
271
  }
321
- // To avoid the overhead of repeatedly calling Date.now(), we cache
322
- // and use the same timestamp for all event listeners attached in the same tick.
323
272
  let cachedNow = 0;
324
- const p = /*#__PURE__*/ Promise.resolve();
325
- const getNow = () => cachedNow || (p.then(() => (cachedNow = 0)), (cachedNow = Date.now()));
273
+ const p = /* @__PURE__ */ Promise.resolve();
274
+ const getNow = () => cachedNow || (p.then(() => cachedNow = 0), cachedNow = Date.now());
326
275
  function createInvoker(initialValue, instance) {
327
- const invoker = (e) => {
328
- // async edge case vuejs/vue#6566
329
- // inner click event triggers patch, event handler
330
- // attached to outer element during patch, and triggered again. This
331
- // happens because browsers fire microtask ticks between event propagation.
332
- // this no longer happens for templates in Vue 3, but could still be
333
- // theoretically possible for hand-written render functions.
334
- // the solution: we save the timestamp when a handler is attached,
335
- // and also attach the timestamp to any event that was handled by vue
336
- // for the first time (to avoid inconsistent event timestamp implementations
337
- // or events fired from iframes, e.g. #2513)
338
- // The handler would only fire if the event passed to it was fired
339
- // AFTER it was attached.
340
- if (!e._vts) {
341
- e._vts = Date.now();
342
- }
343
- else if (e._vts <= invoker.attached) {
344
- return;
345
- }
346
- runtimeCore.callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* ErrorCodes.NATIVE_EVENT_HANDLER */, [e]);
347
- };
348
- invoker.value = initialValue;
349
- invoker.attached = getNow();
350
- return invoker;
276
+ const invoker = (e) => {
277
+ if (!e._vts) {
278
+ e._vts = Date.now();
279
+ } else if (e._vts <= invoker.attached) {
280
+ return;
281
+ }
282
+ runtimeCore.callWithAsyncErrorHandling(
283
+ patchStopImmediatePropagation(e, invoker.value),
284
+ instance,
285
+ 5,
286
+ [e]
287
+ );
288
+ };
289
+ invoker.value = initialValue;
290
+ invoker.attached = getNow();
291
+ return invoker;
351
292
  }
352
293
  function patchStopImmediatePropagation(e, value) {
353
- if (shared.isArray(value)) {
354
- const originalStop = e.stopImmediatePropagation;
355
- e.stopImmediatePropagation = () => {
356
- originalStop.call(e);
357
- e._stopped = true;
358
- };
359
- return value.map(fn => (e) => !e._stopped && fn && fn(e));
360
- }
361
- else {
362
- return value;
363
- }
294
+ if (shared.isArray(value)) {
295
+ const originalStop = e.stopImmediatePropagation;
296
+ e.stopImmediatePropagation = () => {
297
+ originalStop.call(e);
298
+ e._stopped = true;
299
+ };
300
+ return value.map((fn) => (e2) => !e2._stopped && fn && fn(e2));
301
+ } else {
302
+ return value;
303
+ }
364
304
  }
365
305
 
366
306
  const nativeOnRE = /^on[a-z]/;
367
307
  const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
368
- if (key === 'class') {
369
- patchClass(el, nextValue, isSVG);
370
- }
371
- else if (key === 'style') {
372
- patchStyle(el, prevValue, nextValue);
373
- }
374
- else if (shared.isOn(key)) {
375
- // ignore v-model listeners
376
- if (!shared.isModelListener(key)) {
377
- patchEvent(el, key, prevValue, nextValue, parentComponent);
378
- }
379
- }
380
- else if (key[0] === '.'
381
- ? ((key = key.slice(1)), true)
382
- : key[0] === '^'
383
- ? ((key = key.slice(1)), false)
384
- : shouldSetAsProp(el, key, nextValue, isSVG)) {
385
- patchDOMProp(el, key, nextValue, prevChildren, parentComponent, parentSuspense, unmountChildren);
386
- }
387
- else {
388
- // special case for <input v-model type="checkbox"> with
389
- // :true-value & :false-value
390
- // store value as dom properties since non-string values will be
391
- // stringified.
392
- if (key === 'true-value') {
393
- el._trueValue = nextValue;
394
- }
395
- else if (key === 'false-value') {
396
- el._falseValue = nextValue;
397
- }
398
- patchAttr(el, key, nextValue, isSVG);
399
- }
308
+ if (key === "class") {
309
+ patchClass(el, nextValue, isSVG);
310
+ } else if (key === "style") {
311
+ patchStyle(el, prevValue, nextValue);
312
+ } else if (shared.isOn(key)) {
313
+ if (!shared.isModelListener(key)) {
314
+ patchEvent(el, key, prevValue, nextValue, parentComponent);
315
+ }
316
+ } else if (key[0] === "." ? (key = key.slice(1), true) : key[0] === "^" ? (key = key.slice(1), false) : shouldSetAsProp(el, key, nextValue, isSVG)) {
317
+ patchDOMProp(
318
+ el,
319
+ key,
320
+ nextValue,
321
+ prevChildren,
322
+ parentComponent,
323
+ parentSuspense,
324
+ unmountChildren
325
+ );
326
+ } else {
327
+ if (key === "true-value") {
328
+ el._trueValue = nextValue;
329
+ } else if (key === "false-value") {
330
+ el._falseValue = nextValue;
331
+ }
332
+ patchAttr(el, key, nextValue, isSVG);
333
+ }
400
334
  };
401
335
  function shouldSetAsProp(el, key, value, isSVG) {
402
- if (isSVG) {
403
- // most keys must be set as attribute on svg elements to work
404
- // ...except innerHTML & textContent
405
- if (key === 'innerHTML' || key === 'textContent') {
406
- return true;
407
- }
408
- // or native onclick with function values
409
- if (key in el && nativeOnRE.test(key) && shared.isFunction(value)) {
410
- return true;
411
- }
412
- return false;
413
- }
414
- // these are enumerated attrs, however their corresponding DOM properties
415
- // are actually booleans - this leads to setting it with a string "false"
416
- // value leading it to be coerced to `true`, so we need to always treat
417
- // them as attributes.
418
- // Note that `contentEditable` doesn't have this problem: its DOM
419
- // property is also enumerated string values.
420
- if (key === 'spellcheck' || key === 'draggable' || key === 'translate') {
421
- return false;
422
- }
423
- // #1787, #2840 form property on form elements is readonly and must be set as
424
- // attribute.
425
- if (key === 'form') {
426
- return false;
427
- }
428
- // #1526 <input list> must be set as attribute
429
- if (key === 'list' && el.tagName === 'INPUT') {
430
- return false;
431
- }
432
- // #2766 <textarea type> must be set as attribute
433
- if (key === 'type' && el.tagName === 'TEXTAREA') {
434
- return false;
435
- }
436
- // native onclick with string value, must be set as attribute
437
- if (nativeOnRE.test(key) && shared.isString(value)) {
438
- return false;
439
- }
440
- return key in el;
336
+ if (isSVG) {
337
+ if (key === "innerHTML" || key === "textContent") {
338
+ return true;
339
+ }
340
+ if (key in el && nativeOnRE.test(key) && shared.isFunction(value)) {
341
+ return true;
342
+ }
343
+ return false;
344
+ }
345
+ if (key === "spellcheck" || key === "draggable" || key === "translate") {
346
+ return false;
347
+ }
348
+ if (key === "form") {
349
+ return false;
350
+ }
351
+ if (key === "list" && el.tagName === "INPUT") {
352
+ return false;
353
+ }
354
+ if (key === "type" && el.tagName === "TEXTAREA") {
355
+ return false;
356
+ }
357
+ if (nativeOnRE.test(key) && shared.isString(value)) {
358
+ return false;
359
+ }
360
+ return key in el;
441
361
  }
442
362
 
443
- function defineCustomElement(options, hydrate) {
444
- const Comp = runtimeCore.defineComponent(options);
445
- class VueCustomElement extends VueElement {
446
- constructor(initialProps) {
447
- super(Comp, initialProps, hydrate);
448
- }
449
- }
450
- VueCustomElement.def = Comp;
451
- return VueCustomElement;
363
+ function defineCustomElement(options, hydrate2) {
364
+ const Comp = runtimeCore.defineComponent(options);
365
+ class VueCustomElement extends VueElement {
366
+ constructor(initialProps) {
367
+ super(Comp, initialProps, hydrate2);
368
+ }
369
+ }
370
+ VueCustomElement.def = Comp;
371
+ return VueCustomElement;
452
372
  }
453
- const defineSSRCustomElement = ((options) => {
454
- // @ts-ignore
455
- return defineCustomElement(options, hydrate);
456
- });
457
- const BaseClass = (typeof HTMLElement !== 'undefined' ? HTMLElement : class {
458
- });
373
+ const defineSSRCustomElement = (options) => {
374
+ return defineCustomElement(options, hydrate);
375
+ };
376
+ const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
377
+ };
459
378
  class VueElement extends BaseClass {
460
- constructor(_def, _props = {}, hydrate) {
461
- super();
462
- this._def = _def;
463
- this._props = _props;
464
- /**
465
- * @internal
466
- */
467
- this._instance = null;
468
- this._connected = false;
469
- this._resolved = false;
470
- this._numberProps = null;
471
- if (this.shadowRoot && hydrate) {
472
- hydrate(this._createVNode(), this.shadowRoot);
473
- }
474
- else {
475
- if (this.shadowRoot) {
476
- runtimeCore.warn(`Custom element has pre-rendered declarative shadow root but is not ` +
477
- `defined as hydratable. Use \`defineSSRCustomElement\`.`);
478
- }
479
- this.attachShadow({ mode: 'open' });
480
- if (!this._def.__asyncLoader) {
481
- // for sync component defs we can immediately resolve props
482
- this._resolveProps(this._def);
483
- }
484
- }
485
- }
486
- connectedCallback() {
487
- this._connected = true;
488
- if (!this._instance) {
489
- if (this._resolved) {
490
- this._update();
491
- }
492
- else {
493
- this._resolveDef();
494
- }
495
- }
496
- }
497
- disconnectedCallback() {
498
- this._connected = false;
499
- runtimeCore.nextTick(() => {
500
- if (!this._connected) {
501
- render(null, this.shadowRoot);
502
- this._instance = null;
503
- }
504
- });
505
- }
379
+ constructor(_def, _props = {}, hydrate2) {
380
+ super();
381
+ this._def = _def;
382
+ this._props = _props;
506
383
  /**
507
- * resolve inner component definition (handle possible async component)
384
+ * @internal
508
385
  */
509
- _resolveDef() {
510
- this._resolved = true;
511
- // set initial attrs
512
- for (let i = 0; i < this.attributes.length; i++) {
513
- this._setAttr(this.attributes[i].name);
514
- }
515
- // watch future attr changes
516
- new MutationObserver(mutations => {
517
- for (const m of mutations) {
518
- this._setAttr(m.attributeName);
519
- }
520
- }).observe(this, { attributes: true });
521
- const resolve = (def, isAsync = false) => {
522
- const { props, styles } = def;
523
- // cast Number-type props set before resolve
524
- let numberProps;
525
- if (props && !shared.isArray(props)) {
526
- for (const key in props) {
527
- const opt = props[key];
528
- if (opt === Number || (opt && opt.type === Number)) {
529
- if (key in this._props) {
530
- this._props[key] = shared.toNumber(this._props[key]);
531
- }
532
- (numberProps || (numberProps = Object.create(null)))[shared.camelize(key)] = true;
533
- }
534
- }
386
+ this._instance = null;
387
+ this._connected = false;
388
+ this._resolved = false;
389
+ this._numberProps = null;
390
+ if (this.shadowRoot && hydrate2) {
391
+ hydrate2(this._createVNode(), this.shadowRoot);
392
+ } else {
393
+ if (this.shadowRoot) {
394
+ runtimeCore.warn(
395
+ `Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
396
+ );
397
+ }
398
+ this.attachShadow({ mode: "open" });
399
+ if (!this._def.__asyncLoader) {
400
+ this._resolveProps(this._def);
401
+ }
402
+ }
403
+ }
404
+ connectedCallback() {
405
+ this._connected = true;
406
+ if (!this._instance) {
407
+ if (this._resolved) {
408
+ this._update();
409
+ } else {
410
+ this._resolveDef();
411
+ }
412
+ }
413
+ }
414
+ disconnectedCallback() {
415
+ this._connected = false;
416
+ runtimeCore.nextTick(() => {
417
+ if (!this._connected) {
418
+ render(null, this.shadowRoot);
419
+ this._instance = null;
420
+ }
421
+ });
422
+ }
423
+ /**
424
+ * resolve inner component definition (handle possible async component)
425
+ */
426
+ _resolveDef() {
427
+ this._resolved = true;
428
+ for (let i = 0; i < this.attributes.length; i++) {
429
+ this._setAttr(this.attributes[i].name);
430
+ }
431
+ new MutationObserver((mutations) => {
432
+ for (const m of mutations) {
433
+ this._setAttr(m.attributeName);
434
+ }
435
+ }).observe(this, { attributes: true });
436
+ const resolve = (def, isAsync = false) => {
437
+ const { props, styles } = def;
438
+ let numberProps;
439
+ if (props && !shared.isArray(props)) {
440
+ for (const key in props) {
441
+ const opt = props[key];
442
+ if (opt === Number || opt && opt.type === Number) {
443
+ if (key in this._props) {
444
+ this._props[key] = shared.toNumber(this._props[key]);
535
445
  }
536
- this._numberProps = numberProps;
537
- if (isAsync) {
538
- // defining getter/setters on prototype
539
- // for sync defs, this already happened in the constructor
540
- this._resolveProps(def);
446
+ (numberProps || (numberProps = /* @__PURE__ */ Object.create(null)))[shared.camelize(key)] = true;
447
+ }
448
+ }
449
+ }
450
+ this._numberProps = numberProps;
451
+ if (isAsync) {
452
+ this._resolveProps(def);
453
+ }
454
+ this._applyStyles(styles);
455
+ this._update();
456
+ };
457
+ const asyncDef = this._def.__asyncLoader;
458
+ if (asyncDef) {
459
+ asyncDef().then((def) => resolve(def, true));
460
+ } else {
461
+ resolve(this._def);
462
+ }
463
+ }
464
+ _resolveProps(def) {
465
+ const { props } = def;
466
+ const declaredPropKeys = shared.isArray(props) ? props : Object.keys(props || {});
467
+ for (const key of Object.keys(this)) {
468
+ if (key[0] !== "_" && declaredPropKeys.includes(key)) {
469
+ this._setProp(key, this[key], true, false);
470
+ }
471
+ }
472
+ for (const key of declaredPropKeys.map(shared.camelize)) {
473
+ Object.defineProperty(this, key, {
474
+ get() {
475
+ return this._getProp(key);
476
+ },
477
+ set(val) {
478
+ this._setProp(key, val);
479
+ }
480
+ });
481
+ }
482
+ }
483
+ _setAttr(key) {
484
+ let value = this.getAttribute(key);
485
+ const camelKey = shared.camelize(key);
486
+ if (this._numberProps && this._numberProps[camelKey]) {
487
+ value = shared.toNumber(value);
488
+ }
489
+ this._setProp(camelKey, value, false);
490
+ }
491
+ /**
492
+ * @internal
493
+ */
494
+ _getProp(key) {
495
+ return this._props[key];
496
+ }
497
+ /**
498
+ * @internal
499
+ */
500
+ _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
501
+ if (val !== this._props[key]) {
502
+ this._props[key] = val;
503
+ if (shouldUpdate && this._instance) {
504
+ this._update();
505
+ }
506
+ if (shouldReflect) {
507
+ if (val === true) {
508
+ this.setAttribute(shared.hyphenate(key), "");
509
+ } else if (typeof val === "string" || typeof val === "number") {
510
+ this.setAttribute(shared.hyphenate(key), val + "");
511
+ } else if (!val) {
512
+ this.removeAttribute(shared.hyphenate(key));
513
+ }
514
+ }
515
+ }
516
+ }
517
+ _update() {
518
+ render(this._createVNode(), this.shadowRoot);
519
+ }
520
+ _createVNode() {
521
+ const vnode = runtimeCore.createVNode(this._def, shared.extend({}, this._props));
522
+ if (!this._instance) {
523
+ vnode.ce = (instance) => {
524
+ this._instance = instance;
525
+ instance.isCE = true;
526
+ {
527
+ instance.ceReload = (newStyles) => {
528
+ if (this._styles) {
529
+ this._styles.forEach((s) => this.shadowRoot.removeChild(s));
530
+ this._styles.length = 0;
541
531
  }
542
- // apply CSS
543
- this._applyStyles(styles);
544
- // initial render
532
+ this._applyStyles(newStyles);
533
+ this._instance = null;
545
534
  this._update();
535
+ };
536
+ }
537
+ const dispatch = (event, args) => {
538
+ this.dispatchEvent(
539
+ new CustomEvent(event, {
540
+ detail: args
541
+ })
542
+ );
546
543
  };
547
- const asyncDef = this._def.__asyncLoader;
548
- if (asyncDef) {
549
- asyncDef().then(def => resolve(def, true));
550
- }
551
- else {
552
- resolve(this._def);
553
- }
554
- }
555
- _resolveProps(def) {
556
- const { props } = def;
557
- const declaredPropKeys = shared.isArray(props) ? props : Object.keys(props || {});
558
- // check if there are props set pre-upgrade or connect
559
- for (const key of Object.keys(this)) {
560
- if (key[0] !== '_' && declaredPropKeys.includes(key)) {
561
- this._setProp(key, this[key], true, false);
562
- }
563
- }
564
- // defining getter/setters on prototype
565
- for (const key of declaredPropKeys.map(shared.camelize)) {
566
- Object.defineProperty(this, key, {
567
- get() {
568
- return this._getProp(key);
569
- },
570
- set(val) {
571
- this._setProp(key, val);
572
- }
573
- });
574
- }
575
- }
576
- _setAttr(key) {
577
- let value = this.getAttribute(key);
578
- const camelKey = shared.camelize(key);
579
- if (this._numberProps && this._numberProps[camelKey]) {
580
- value = shared.toNumber(value);
581
- }
582
- this._setProp(camelKey, value, false);
583
- }
584
- /**
585
- * @internal
586
- */
587
- _getProp(key) {
588
- return this._props[key];
589
- }
590
- /**
591
- * @internal
592
- */
593
- _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
594
- if (val !== this._props[key]) {
595
- this._props[key] = val;
596
- if (shouldUpdate && this._instance) {
597
- this._update();
598
- }
599
- // reflect
600
- if (shouldReflect) {
601
- if (val === true) {
602
- this.setAttribute(shared.hyphenate(key), '');
603
- }
604
- else if (typeof val === 'string' || typeof val === 'number') {
605
- this.setAttribute(shared.hyphenate(key), val + '');
606
- }
607
- else if (!val) {
608
- this.removeAttribute(shared.hyphenate(key));
609
- }
610
- }
611
- }
612
- }
613
- _update() {
614
- render(this._createVNode(), this.shadowRoot);
615
- }
616
- _createVNode() {
617
- const vnode = runtimeCore.createVNode(this._def, shared.extend({}, this._props));
618
- if (!this._instance) {
619
- vnode.ce = instance => {
620
- this._instance = instance;
621
- instance.isCE = true;
622
- // HMR
623
- {
624
- instance.ceReload = newStyles => {
625
- // always reset styles
626
- if (this._styles) {
627
- this._styles.forEach(s => this.shadowRoot.removeChild(s));
628
- this._styles.length = 0;
629
- }
630
- this._applyStyles(newStyles);
631
- this._instance = null;
632
- this._update();
633
- };
634
- }
635
- const dispatch = (event, args) => {
636
- this.dispatchEvent(new CustomEvent(event, {
637
- detail: args
638
- }));
639
- };
640
- // intercept emit
641
- instance.emit = (event, ...args) => {
642
- // dispatch both the raw and hyphenated versions of an event
643
- // to match Vue behavior
644
- dispatch(event, args);
645
- if (shared.hyphenate(event) !== event) {
646
- dispatch(shared.hyphenate(event), args);
647
- }
648
- };
649
- // locate nearest Vue custom element parent for provide/inject
650
- let parent = this;
651
- while ((parent =
652
- parent && (parent.parentNode || parent.host))) {
653
- if (parent instanceof VueElement) {
654
- instance.parent = parent._instance;
655
- instance.provides = parent._instance.provides;
656
- break;
657
- }
658
- }
659
- };
660
- }
661
- return vnode;
662
- }
663
- _applyStyles(styles) {
664
- if (styles) {
665
- styles.forEach(css => {
666
- const s = document.createElement('style');
667
- s.textContent = css;
668
- this.shadowRoot.appendChild(s);
669
- // record for HMR
670
- {
671
- (this._styles || (this._styles = [])).push(s);
672
- }
673
- });
544
+ instance.emit = (event, ...args) => {
545
+ dispatch(event, args);
546
+ if (shared.hyphenate(event) !== event) {
547
+ dispatch(shared.hyphenate(event), args);
548
+ }
549
+ };
550
+ let parent = this;
551
+ while (parent = parent && (parent.parentNode || parent.host)) {
552
+ if (parent instanceof VueElement) {
553
+ instance.parent = parent._instance;
554
+ instance.provides = parent._instance.provides;
555
+ break;
556
+ }
557
+ }
558
+ };
559
+ }
560
+ return vnode;
561
+ }
562
+ _applyStyles(styles) {
563
+ if (styles) {
564
+ styles.forEach((css) => {
565
+ const s = document.createElement("style");
566
+ s.textContent = css;
567
+ this.shadowRoot.appendChild(s);
568
+ {
569
+ (this._styles || (this._styles = [])).push(s);
674
570
  }
571
+ });
675
572
  }
573
+ }
676
574
  }
677
575
 
678
- function useCssModule(name = '$style') {
679
- /* istanbul ignore else */
680
- {
681
- const instance = runtimeCore.getCurrentInstance();
682
- if (!instance) {
683
- runtimeCore.warn(`useCssModule must be called inside setup()`);
684
- return shared.EMPTY_OBJ;
685
- }
686
- const modules = instance.type.__cssModules;
687
- if (!modules) {
688
- runtimeCore.warn(`Current instance does not have CSS modules injected.`);
689
- return shared.EMPTY_OBJ;
690
- }
691
- const mod = modules[name];
692
- if (!mod) {
693
- runtimeCore.warn(`Current instance does not have CSS module named "${name}".`);
694
- return shared.EMPTY_OBJ;
695
- }
696
- return mod;
697
- }
576
+ function useCssModule(name = "$style") {
577
+ {
578
+ const instance = runtimeCore.getCurrentInstance();
579
+ if (!instance) {
580
+ runtimeCore.warn(`useCssModule must be called inside setup()`);
581
+ return shared.EMPTY_OBJ;
582
+ }
583
+ const modules = instance.type.__cssModules;
584
+ if (!modules) {
585
+ runtimeCore.warn(`Current instance does not have CSS modules injected.`);
586
+ return shared.EMPTY_OBJ;
587
+ }
588
+ const mod = modules[name];
589
+ if (!mod) {
590
+ runtimeCore.warn(`Current instance does not have CSS module named "${name}".`);
591
+ return shared.EMPTY_OBJ;
592
+ }
593
+ return mod;
594
+ }
698
595
  }
699
596
 
700
- /**
701
- * Runtime helper for SFC's CSS variable injection feature.
702
- * @private
703
- */
704
597
  function useCssVars(getter) {
705
- return;
598
+ return;
706
599
  }
707
600
 
708
- const TRANSITION = 'transition';
709
- const ANIMATION = 'animation';
710
- // DOM Transition is a higher-order-component based on the platform-agnostic
711
- // base Transition component, with DOM-specific logic.
601
+ const TRANSITION = "transition";
602
+ const ANIMATION = "animation";
712
603
  const Transition = (props, { slots }) => runtimeCore.h(runtimeCore.BaseTransition, resolveTransitionProps(props), slots);
713
- Transition.displayName = 'Transition';
604
+ Transition.displayName = "Transition";
714
605
  const DOMTransitionPropsValidators = {
715
- name: String,
716
- type: String,
717
- css: {
718
- type: Boolean,
719
- default: true
720
- },
721
- duration: [String, Number, Object],
722
- enterFromClass: String,
723
- enterActiveClass: String,
724
- enterToClass: String,
725
- appearFromClass: String,
726
- appearActiveClass: String,
727
- appearToClass: String,
728
- leaveFromClass: String,
729
- leaveActiveClass: String,
730
- leaveToClass: String
606
+ name: String,
607
+ type: String,
608
+ css: {
609
+ type: Boolean,
610
+ default: true
611
+ },
612
+ duration: [String, Number, Object],
613
+ enterFromClass: String,
614
+ enterActiveClass: String,
615
+ enterToClass: String,
616
+ appearFromClass: String,
617
+ appearActiveClass: String,
618
+ appearToClass: String,
619
+ leaveFromClass: String,
620
+ leaveActiveClass: String,
621
+ leaveToClass: String
731
622
  };
732
- const TransitionPropsValidators = (Transition.props =
733
- /*#__PURE__*/ shared.extend({}, runtimeCore.BaseTransition.props, DOMTransitionPropsValidators));
734
- /**
735
- * #3227 Incoming hooks may be merged into arrays when wrapping Transition
736
- * with custom HOCs.
737
- */
623
+ const TransitionPropsValidators = Transition.props = /* @__PURE__ */ shared.extend(
624
+ {},
625
+ runtimeCore.BaseTransitionPropsValidators,
626
+ DOMTransitionPropsValidators
627
+ );
738
628
  const callHook = (hook, args = []) => {
739
- if (shared.isArray(hook)) {
740
- hook.forEach(h => h(...args));
741
- }
742
- else if (hook) {
743
- hook(...args);
744
- }
629
+ if (shared.isArray(hook)) {
630
+ hook.forEach((h2) => h2(...args));
631
+ } else if (hook) {
632
+ hook(...args);
633
+ }
745
634
  };
746
- /**
747
- * Check if a hook expects a callback (2nd arg), which means the user
748
- * intends to explicitly control the end of the transition.
749
- */
750
635
  const hasExplicitCallback = (hook) => {
751
- return hook
752
- ? shared.isArray(hook)
753
- ? hook.some(h => h.length > 1)
754
- : hook.length > 1
755
- : false;
636
+ return hook ? shared.isArray(hook) ? hook.some((h2) => h2.length > 1) : hook.length > 1 : false;
756
637
  };
757
638
  function resolveTransitionProps(rawProps) {
758
- const baseProps = {};
759
- for (const key in rawProps) {
760
- if (!(key in DOMTransitionPropsValidators)) {
761
- baseProps[key] = rawProps[key];
762
- }
763
- }
764
- if (rawProps.css === false) {
765
- return baseProps;
766
- }
767
- 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;
768
- const durations = normalizeDuration(duration);
769
- const enterDuration = durations && durations[0];
770
- const leaveDuration = durations && durations[1];
771
- const { onBeforeEnter, onEnter, onEnterCancelled, onLeave, onLeaveCancelled, onBeforeAppear = onBeforeEnter, onAppear = onEnter, onAppearCancelled = onEnterCancelled } = baseProps;
772
- const finishEnter = (el, isAppear, done) => {
773
- removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
774
- removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
775
- done && done();
639
+ const baseProps = {};
640
+ for (const key in rawProps) {
641
+ if (!(key in DOMTransitionPropsValidators)) {
642
+ baseProps[key] = rawProps[key];
643
+ }
644
+ }
645
+ if (rawProps.css === false) {
646
+ return baseProps;
647
+ }
648
+ const {
649
+ name = "v",
650
+ type,
651
+ duration,
652
+ enterFromClass = `${name}-enter-from`,
653
+ enterActiveClass = `${name}-enter-active`,
654
+ enterToClass = `${name}-enter-to`,
655
+ appearFromClass = enterFromClass,
656
+ appearActiveClass = enterActiveClass,
657
+ appearToClass = enterToClass,
658
+ leaveFromClass = `${name}-leave-from`,
659
+ leaveActiveClass = `${name}-leave-active`,
660
+ leaveToClass = `${name}-leave-to`
661
+ } = rawProps;
662
+ const durations = normalizeDuration(duration);
663
+ const enterDuration = durations && durations[0];
664
+ const leaveDuration = durations && durations[1];
665
+ const {
666
+ onBeforeEnter,
667
+ onEnter,
668
+ onEnterCancelled,
669
+ onLeave,
670
+ onLeaveCancelled,
671
+ onBeforeAppear = onBeforeEnter,
672
+ onAppear = onEnter,
673
+ onAppearCancelled = onEnterCancelled
674
+ } = baseProps;
675
+ const finishEnter = (el, isAppear, done) => {
676
+ removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
677
+ removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
678
+ done && done();
679
+ };
680
+ const finishLeave = (el, done) => {
681
+ el._isLeaving = false;
682
+ removeTransitionClass(el, leaveFromClass);
683
+ removeTransitionClass(el, leaveToClass);
684
+ removeTransitionClass(el, leaveActiveClass);
685
+ done && done();
686
+ };
687
+ const makeEnterHook = (isAppear) => {
688
+ return (el, done) => {
689
+ const hook = isAppear ? onAppear : onEnter;
690
+ const resolve = () => finishEnter(el, isAppear, done);
691
+ callHook(hook, [el, resolve]);
692
+ nextFrame(() => {
693
+ removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
694
+ addTransitionClass(el, isAppear ? appearToClass : enterToClass);
695
+ if (!hasExplicitCallback(hook)) {
696
+ whenTransitionEnds(el, type, enterDuration, resolve);
697
+ }
698
+ });
776
699
  };
777
- const finishLeave = (el, done) => {
778
- el._isLeaving = false;
700
+ };
701
+ return shared.extend(baseProps, {
702
+ onBeforeEnter(el) {
703
+ callHook(onBeforeEnter, [el]);
704
+ addTransitionClass(el, enterFromClass);
705
+ addTransitionClass(el, enterActiveClass);
706
+ },
707
+ onBeforeAppear(el) {
708
+ callHook(onBeforeAppear, [el]);
709
+ addTransitionClass(el, appearFromClass);
710
+ addTransitionClass(el, appearActiveClass);
711
+ },
712
+ onEnter: makeEnterHook(false),
713
+ onAppear: makeEnterHook(true),
714
+ onLeave(el, done) {
715
+ el._isLeaving = true;
716
+ const resolve = () => finishLeave(el, done);
717
+ addTransitionClass(el, leaveFromClass);
718
+ forceReflow();
719
+ addTransitionClass(el, leaveActiveClass);
720
+ nextFrame(() => {
721
+ if (!el._isLeaving) {
722
+ return;
723
+ }
779
724
  removeTransitionClass(el, leaveFromClass);
780
- removeTransitionClass(el, leaveToClass);
781
- removeTransitionClass(el, leaveActiveClass);
782
- done && done();
783
- };
784
- const makeEnterHook = (isAppear) => {
785
- return (el, done) => {
786
- const hook = isAppear ? onAppear : onEnter;
787
- const resolve = () => finishEnter(el, isAppear, done);
788
- callHook(hook, [el, resolve]);
789
- nextFrame(() => {
790
- removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
791
- addTransitionClass(el, isAppear ? appearToClass : enterToClass);
792
- if (!hasExplicitCallback(hook)) {
793
- whenTransitionEnds(el, type, enterDuration, resolve);
794
- }
795
- });
796
- };
797
- };
798
- return shared.extend(baseProps, {
799
- onBeforeEnter(el) {
800
- callHook(onBeforeEnter, [el]);
801
- addTransitionClass(el, enterFromClass);
802
- addTransitionClass(el, enterActiveClass);
803
- },
804
- onBeforeAppear(el) {
805
- callHook(onBeforeAppear, [el]);
806
- addTransitionClass(el, appearFromClass);
807
- addTransitionClass(el, appearActiveClass);
808
- },
809
- onEnter: makeEnterHook(false),
810
- onAppear: makeEnterHook(true),
811
- onLeave(el, done) {
812
- el._isLeaving = true;
813
- const resolve = () => finishLeave(el, done);
814
- addTransitionClass(el, leaveFromClass);
815
- // force reflow so *-leave-from classes immediately take effect (#2593)
816
- forceReflow();
817
- addTransitionClass(el, leaveActiveClass);
818
- nextFrame(() => {
819
- if (!el._isLeaving) {
820
- // cancelled
821
- return;
822
- }
823
- removeTransitionClass(el, leaveFromClass);
824
- addTransitionClass(el, leaveToClass);
825
- if (!hasExplicitCallback(onLeave)) {
826
- whenTransitionEnds(el, type, leaveDuration, resolve);
827
- }
828
- });
829
- callHook(onLeave, [el, resolve]);
830
- },
831
- onEnterCancelled(el) {
832
- finishEnter(el, false);
833
- callHook(onEnterCancelled, [el]);
834
- },
835
- onAppearCancelled(el) {
836
- finishEnter(el, true);
837
- callHook(onAppearCancelled, [el]);
838
- },
839
- onLeaveCancelled(el) {
840
- finishLeave(el);
841
- callHook(onLeaveCancelled, [el]);
725
+ addTransitionClass(el, leaveToClass);
726
+ if (!hasExplicitCallback(onLeave)) {
727
+ whenTransitionEnds(el, type, leaveDuration, resolve);
842
728
  }
843
- });
729
+ });
730
+ callHook(onLeave, [el, resolve]);
731
+ },
732
+ onEnterCancelled(el) {
733
+ finishEnter(el, false);
734
+ callHook(onEnterCancelled, [el]);
735
+ },
736
+ onAppearCancelled(el) {
737
+ finishEnter(el, true);
738
+ callHook(onAppearCancelled, [el]);
739
+ },
740
+ onLeaveCancelled(el) {
741
+ finishLeave(el);
742
+ callHook(onLeaveCancelled, [el]);
743
+ }
744
+ });
844
745
  }
845
746
  function normalizeDuration(duration) {
846
- if (duration == null) {
847
- return null;
848
- }
849
- else if (shared.isObject(duration)) {
850
- return [NumberOf(duration.enter), NumberOf(duration.leave)];
851
- }
852
- else {
853
- const n = NumberOf(duration);
854
- return [n, n];
855
- }
747
+ if (duration == null) {
748
+ return null;
749
+ } else if (shared.isObject(duration)) {
750
+ return [NumberOf(duration.enter), NumberOf(duration.leave)];
751
+ } else {
752
+ const n = NumberOf(duration);
753
+ return [n, n];
754
+ }
856
755
  }
857
756
  function NumberOf(val) {
858
- const res = shared.toNumber(val);
859
- {
860
- runtimeCore.assertNumber(res, '<transition> explicit duration');
861
- }
862
- return res;
757
+ const res = shared.toNumber(val);
758
+ {
759
+ runtimeCore.assertNumber(res, "<transition> explicit duration");
760
+ }
761
+ return res;
863
762
  }
864
763
  function addTransitionClass(el, cls) {
865
- cls.split(/\s+/).forEach(c => c && el.classList.add(c));
866
- (el._vtc ||
867
- (el._vtc = new Set())).add(cls);
764
+ cls.split(/\s+/).forEach((c) => c && el.classList.add(c));
765
+ (el._vtc || (el._vtc = /* @__PURE__ */ new Set())).add(cls);
868
766
  }
869
767
  function removeTransitionClass(el, cls) {
870
- cls.split(/\s+/).forEach(c => c && el.classList.remove(c));
871
- const { _vtc } = el;
872
- if (_vtc) {
873
- _vtc.delete(cls);
874
- if (!_vtc.size) {
875
- el._vtc = undefined;
876
- }
877
- }
768
+ cls.split(/\s+/).forEach((c) => c && el.classList.remove(c));
769
+ const { _vtc } = el;
770
+ if (_vtc) {
771
+ _vtc.delete(cls);
772
+ if (!_vtc.size) {
773
+ el._vtc = void 0;
774
+ }
775
+ }
878
776
  }
879
777
  function nextFrame(cb) {
880
- requestAnimationFrame(() => {
881
- requestAnimationFrame(cb);
882
- });
778
+ requestAnimationFrame(() => {
779
+ requestAnimationFrame(cb);
780
+ });
883
781
  }
884
782
  let endId = 0;
885
783
  function whenTransitionEnds(el, expectedType, explicitTimeout, resolve) {
886
- const id = (el._endId = ++endId);
887
- const resolveIfNotStale = () => {
888
- if (id === el._endId) {
889
- resolve();
890
- }
891
- };
892
- if (explicitTimeout) {
893
- return setTimeout(resolveIfNotStale, explicitTimeout);
894
- }
895
- const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
896
- if (!type) {
897
- return resolve();
898
- }
899
- const endEvent = type + 'end';
900
- let ended = 0;
901
- const end = () => {
902
- el.removeEventListener(endEvent, onEnd);
903
- resolveIfNotStale();
904
- };
905
- const onEnd = (e) => {
906
- if (e.target === el && ++ended >= propCount) {
907
- end();
908
- }
909
- };
910
- setTimeout(() => {
911
- if (ended < propCount) {
912
- end();
913
- }
914
- }, timeout + 1);
915
- el.addEventListener(endEvent, onEnd);
784
+ const id = el._endId = ++endId;
785
+ const resolveIfNotStale = () => {
786
+ if (id === el._endId) {
787
+ resolve();
788
+ }
789
+ };
790
+ if (explicitTimeout) {
791
+ return setTimeout(resolveIfNotStale, explicitTimeout);
792
+ }
793
+ const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
794
+ if (!type) {
795
+ return resolve();
796
+ }
797
+ const endEvent = type + "end";
798
+ let ended = 0;
799
+ const end = () => {
800
+ el.removeEventListener(endEvent, onEnd);
801
+ resolveIfNotStale();
802
+ };
803
+ const onEnd = (e) => {
804
+ if (e.target === el && ++ended >= propCount) {
805
+ end();
806
+ }
807
+ };
808
+ setTimeout(() => {
809
+ if (ended < propCount) {
810
+ end();
811
+ }
812
+ }, timeout + 1);
813
+ el.addEventListener(endEvent, onEnd);
916
814
  }
917
815
  function getTransitionInfo(el, expectedType) {
918
- const styles = window.getComputedStyle(el);
919
- // JSDOM may return undefined for transition properties
920
- const getStyleProperties = (key) => (styles[key] || '').split(', ');
921
- const transitionDelays = getStyleProperties(`${TRANSITION}Delay`);
922
- const transitionDurations = getStyleProperties(`${TRANSITION}Duration`);
923
- const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
924
- const animationDelays = getStyleProperties(`${ANIMATION}Delay`);
925
- const animationDurations = getStyleProperties(`${ANIMATION}Duration`);
926
- const animationTimeout = getTimeout(animationDelays, animationDurations);
927
- let type = null;
928
- let timeout = 0;
929
- let propCount = 0;
930
- /* istanbul ignore if */
931
- if (expectedType === TRANSITION) {
932
- if (transitionTimeout > 0) {
933
- type = TRANSITION;
934
- timeout = transitionTimeout;
935
- propCount = transitionDurations.length;
936
- }
937
- }
938
- else if (expectedType === ANIMATION) {
939
- if (animationTimeout > 0) {
940
- type = ANIMATION;
941
- timeout = animationTimeout;
942
- propCount = animationDurations.length;
943
- }
944
- }
945
- else {
946
- timeout = Math.max(transitionTimeout, animationTimeout);
947
- type =
948
- timeout > 0
949
- ? transitionTimeout > animationTimeout
950
- ? TRANSITION
951
- : ANIMATION
952
- : null;
953
- propCount = type
954
- ? type === TRANSITION
955
- ? transitionDurations.length
956
- : animationDurations.length
957
- : 0;
958
- }
959
- const hasTransform = type === TRANSITION &&
960
- /\b(transform|all)(,|$)/.test(getStyleProperties(`${TRANSITION}Property`).toString());
961
- return {
962
- type,
963
- timeout,
964
- propCount,
965
- hasTransform
966
- };
816
+ const styles = window.getComputedStyle(el);
817
+ const getStyleProperties = (key) => (styles[key] || "").split(", ");
818
+ const transitionDelays = getStyleProperties(`${TRANSITION}Delay`);
819
+ const transitionDurations = getStyleProperties(`${TRANSITION}Duration`);
820
+ const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
821
+ const animationDelays = getStyleProperties(`${ANIMATION}Delay`);
822
+ const animationDurations = getStyleProperties(`${ANIMATION}Duration`);
823
+ const animationTimeout = getTimeout(animationDelays, animationDurations);
824
+ let type = null;
825
+ let timeout = 0;
826
+ let propCount = 0;
827
+ if (expectedType === TRANSITION) {
828
+ if (transitionTimeout > 0) {
829
+ type = TRANSITION;
830
+ timeout = transitionTimeout;
831
+ propCount = transitionDurations.length;
832
+ }
833
+ } else if (expectedType === ANIMATION) {
834
+ if (animationTimeout > 0) {
835
+ type = ANIMATION;
836
+ timeout = animationTimeout;
837
+ propCount = animationDurations.length;
838
+ }
839
+ } else {
840
+ timeout = Math.max(transitionTimeout, animationTimeout);
841
+ type = timeout > 0 ? transitionTimeout > animationTimeout ? TRANSITION : ANIMATION : null;
842
+ propCount = type ? type === TRANSITION ? transitionDurations.length : animationDurations.length : 0;
843
+ }
844
+ const hasTransform = type === TRANSITION && /\b(transform|all)(,|$)/.test(
845
+ getStyleProperties(`${TRANSITION}Property`).toString()
846
+ );
847
+ return {
848
+ type,
849
+ timeout,
850
+ propCount,
851
+ hasTransform
852
+ };
967
853
  }
968
854
  function getTimeout(delays, durations) {
969
- while (delays.length < durations.length) {
970
- delays = delays.concat(delays);
971
- }
972
- return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
855
+ while (delays.length < durations.length) {
856
+ delays = delays.concat(delays);
857
+ }
858
+ return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
973
859
  }
974
- // Old versions of Chromium (below 61.0.3163.100) formats floating pointer
975
- // numbers in a locale-dependent way, using a comma instead of a dot.
976
- // If comma is not replaced with a dot, the input will be rounded down
977
- // (i.e. acting as a floor function) causing unexpected behaviors
978
860
  function toMs(s) {
979
- return Number(s.slice(0, -1).replace(',', '.')) * 1000;
861
+ return Number(s.slice(0, -1).replace(",", ".")) * 1e3;
980
862
  }
981
- // synchronously force layout to put elements into a certain state
982
863
  function forceReflow() {
983
- return document.body.offsetHeight;
864
+ return document.body.offsetHeight;
984
865
  }
985
866
 
986
- const positionMap = new WeakMap();
987
- const newPositionMap = new WeakMap();
867
+ const positionMap = /* @__PURE__ */ new WeakMap();
868
+ const newPositionMap = /* @__PURE__ */ new WeakMap();
988
869
  const TransitionGroupImpl = {
989
- name: 'TransitionGroup',
990
- props: /*#__PURE__*/ shared.extend({}, TransitionPropsValidators, {
991
- tag: String,
992
- moveClass: String
993
- }),
994
- setup(props, { slots }) {
995
- const instance = runtimeCore.getCurrentInstance();
996
- const state = runtimeCore.useTransitionState();
997
- let prevChildren;
998
- let children;
999
- runtimeCore.onUpdated(() => {
1000
- // children is guaranteed to exist after initial render
1001
- if (!prevChildren.length) {
1002
- return;
1003
- }
1004
- const moveClass = props.moveClass || `${props.name || 'v'}-move`;
1005
- if (!hasCSSTransform(prevChildren[0].el, instance.vnode.el, moveClass)) {
1006
- return;
1007
- }
1008
- // we divide the work into three loops to avoid mixing DOM reads and writes
1009
- // in each iteration - which helps prevent layout thrashing.
1010
- prevChildren.forEach(callPendingCbs);
1011
- prevChildren.forEach(recordPosition);
1012
- const movedChildren = prevChildren.filter(applyTranslation);
1013
- // force reflow to put everything in position
1014
- forceReflow();
1015
- movedChildren.forEach(c => {
1016
- const el = c.el;
1017
- const style = el.style;
1018
- addTransitionClass(el, moveClass);
1019
- style.transform = style.webkitTransform = style.transitionDuration = '';
1020
- const cb = (el._moveCb = (e) => {
1021
- if (e && e.target !== el) {
1022
- return;
1023
- }
1024
- if (!e || /transform$/.test(e.propertyName)) {
1025
- el.removeEventListener('transitionend', cb);
1026
- el._moveCb = null;
1027
- removeTransitionClass(el, moveClass);
1028
- }
1029
- });
1030
- el.addEventListener('transitionend', cb);
1031
- });
1032
- });
1033
- return () => {
1034
- const rawProps = runtimeCore.toRaw(props);
1035
- const cssTransitionProps = resolveTransitionProps(rawProps);
1036
- let tag = rawProps.tag || runtimeCore.Fragment;
1037
- prevChildren = children;
1038
- children = slots.default ? runtimeCore.getTransitionRawChildren(slots.default()) : [];
1039
- for (let i = 0; i < children.length; i++) {
1040
- const child = children[i];
1041
- if (child.key != null) {
1042
- runtimeCore.setTransitionHooks(child, runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance));
1043
- }
1044
- else {
1045
- runtimeCore.warn(`<TransitionGroup> children must be keyed.`);
1046
- }
1047
- }
1048
- if (prevChildren) {
1049
- for (let i = 0; i < prevChildren.length; i++) {
1050
- const child = prevChildren[i];
1051
- runtimeCore.setTransitionHooks(child, runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance));
1052
- positionMap.set(child, child.el.getBoundingClientRect());
1053
- }
1054
- }
1055
- return runtimeCore.createVNode(tag, null, children);
870
+ name: "TransitionGroup",
871
+ props: /* @__PURE__ */ shared.extend({}, TransitionPropsValidators, {
872
+ tag: String,
873
+ moveClass: String
874
+ }),
875
+ setup(props, { slots }) {
876
+ const instance = runtimeCore.getCurrentInstance();
877
+ const state = runtimeCore.useTransitionState();
878
+ let prevChildren;
879
+ let children;
880
+ runtimeCore.onUpdated(() => {
881
+ if (!prevChildren.length) {
882
+ return;
883
+ }
884
+ const moveClass = props.moveClass || `${props.name || "v"}-move`;
885
+ if (!hasCSSTransform(
886
+ prevChildren[0].el,
887
+ instance.vnode.el,
888
+ moveClass
889
+ )) {
890
+ return;
891
+ }
892
+ prevChildren.forEach(callPendingCbs);
893
+ prevChildren.forEach(recordPosition);
894
+ const movedChildren = prevChildren.filter(applyTranslation);
895
+ forceReflow();
896
+ movedChildren.forEach((c) => {
897
+ const el = c.el;
898
+ const style = el.style;
899
+ addTransitionClass(el, moveClass);
900
+ style.transform = style.webkitTransform = style.transitionDuration = "";
901
+ const cb = el._moveCb = (e) => {
902
+ if (e && e.target !== el) {
903
+ return;
904
+ }
905
+ if (!e || /transform$/.test(e.propertyName)) {
906
+ el.removeEventListener("transitionend", cb);
907
+ el._moveCb = null;
908
+ removeTransitionClass(el, moveClass);
909
+ }
1056
910
  };
1057
- }
911
+ el.addEventListener("transitionend", cb);
912
+ });
913
+ });
914
+ return () => {
915
+ const rawProps = runtimeCore.toRaw(props);
916
+ const cssTransitionProps = resolveTransitionProps(rawProps);
917
+ let tag = rawProps.tag || runtimeCore.Fragment;
918
+ prevChildren = children;
919
+ children = slots.default ? runtimeCore.getTransitionRawChildren(slots.default()) : [];
920
+ for (let i = 0; i < children.length; i++) {
921
+ const child = children[i];
922
+ if (child.key != null) {
923
+ runtimeCore.setTransitionHooks(
924
+ child,
925
+ runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance)
926
+ );
927
+ } else {
928
+ runtimeCore.warn(`<TransitionGroup> children must be keyed.`);
929
+ }
930
+ }
931
+ if (prevChildren) {
932
+ for (let i = 0; i < prevChildren.length; i++) {
933
+ const child = prevChildren[i];
934
+ runtimeCore.setTransitionHooks(
935
+ child,
936
+ runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance)
937
+ );
938
+ positionMap.set(child, child.el.getBoundingClientRect());
939
+ }
940
+ }
941
+ return runtimeCore.createVNode(tag, null, children);
942
+ };
943
+ }
1058
944
  };
1059
- /**
1060
- * TransitionGroup does not support "mode" so we need to remove it from the
1061
- * props declarations, but direct delete operation is considered a side effect
1062
- * and will make the entire transition feature non-tree-shakeable, so we do it
1063
- * in a function and mark the function's invocation as pure.
1064
- */
1065
945
  const removeMode = (props) => delete props.mode;
1066
- /*#__PURE__*/ removeMode(TransitionGroupImpl.props);
946
+ /* @__PURE__ */ removeMode(TransitionGroupImpl.props);
1067
947
  const TransitionGroup = TransitionGroupImpl;
1068
948
  function callPendingCbs(c) {
1069
- const el = c.el;
1070
- if (el._moveCb) {
1071
- el._moveCb();
1072
- }
1073
- if (el._enterCb) {
1074
- el._enterCb();
1075
- }
949
+ const el = c.el;
950
+ if (el._moveCb) {
951
+ el._moveCb();
952
+ }
953
+ if (el._enterCb) {
954
+ el._enterCb();
955
+ }
1076
956
  }
1077
957
  function recordPosition(c) {
1078
- newPositionMap.set(c, c.el.getBoundingClientRect());
958
+ newPositionMap.set(c, c.el.getBoundingClientRect());
1079
959
  }
1080
960
  function applyTranslation(c) {
1081
- const oldPos = positionMap.get(c);
1082
- const newPos = newPositionMap.get(c);
1083
- const dx = oldPos.left - newPos.left;
1084
- const dy = oldPos.top - newPos.top;
1085
- if (dx || dy) {
1086
- const s = c.el.style;
1087
- s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
1088
- s.transitionDuration = '0s';
1089
- return c;
1090
- }
961
+ const oldPos = positionMap.get(c);
962
+ const newPos = newPositionMap.get(c);
963
+ const dx = oldPos.left - newPos.left;
964
+ const dy = oldPos.top - newPos.top;
965
+ if (dx || dy) {
966
+ const s = c.el.style;
967
+ s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
968
+ s.transitionDuration = "0s";
969
+ return c;
970
+ }
1091
971
  }
1092
972
  function hasCSSTransform(el, root, moveClass) {
1093
- // Detect whether an element with the move class applied has
1094
- // CSS transitions. Since the element may be inside an entering
1095
- // transition at this very moment, we make a clone of it and remove
1096
- // all other transition classes applied to ensure only the move class
1097
- // is applied.
1098
- const clone = el.cloneNode();
1099
- if (el._vtc) {
1100
- el._vtc.forEach(cls => {
1101
- cls.split(/\s+/).forEach(c => c && clone.classList.remove(c));
1102
- });
1103
- }
1104
- moveClass.split(/\s+/).forEach(c => c && clone.classList.add(c));
1105
- clone.style.display = 'none';
1106
- const container = (root.nodeType === 1 ? root : root.parentNode);
1107
- container.appendChild(clone);
1108
- const { hasTransform } = getTransitionInfo(clone);
1109
- container.removeChild(clone);
1110
- return hasTransform;
973
+ const clone = el.cloneNode();
974
+ if (el._vtc) {
975
+ el._vtc.forEach((cls) => {
976
+ cls.split(/\s+/).forEach((c) => c && clone.classList.remove(c));
977
+ });
978
+ }
979
+ moveClass.split(/\s+/).forEach((c) => c && clone.classList.add(c));
980
+ clone.style.display = "none";
981
+ const container = root.nodeType === 1 ? root : root.parentNode;
982
+ container.appendChild(clone);
983
+ const { hasTransform } = getTransitionInfo(clone);
984
+ container.removeChild(clone);
985
+ return hasTransform;
1111
986
  }
1112
987
 
1113
988
  const getModelAssigner = (vnode) => {
1114
- const fn = vnode.props['onUpdate:modelValue'] ||
1115
- (false );
1116
- return shared.isArray(fn) ? value => shared.invokeArrayFns(fn, value) : fn;
989
+ const fn = vnode.props["onUpdate:modelValue"] || false;
990
+ return shared.isArray(fn) ? (value) => shared.invokeArrayFns(fn, value) : fn;
1117
991
  };
1118
992
  function onCompositionStart(e) {
1119
- e.target.composing = true;
993
+ e.target.composing = true;
1120
994
  }
1121
995
  function onCompositionEnd(e) {
1122
- const target = e.target;
1123
- if (target.composing) {
1124
- target.composing = false;
1125
- target.dispatchEvent(new Event('input'));
1126
- }
996
+ const target = e.target;
997
+ if (target.composing) {
998
+ target.composing = false;
999
+ target.dispatchEvent(new Event("input"));
1000
+ }
1127
1001
  }
1128
- // We are exporting the v-model runtime directly as vnode hooks so that it can
1129
- // be tree-shaken in case v-model is never used.
1130
1002
  const vModelText = {
1131
- created(el, { modifiers: { lazy, trim, number } }, vnode) {
1132
- el._assign = getModelAssigner(vnode);
1133
- const castToNumber = number || (vnode.props && vnode.props.type === 'number');
1134
- addEventListener(el, lazy ? 'change' : 'input', e => {
1135
- if (e.target.composing)
1136
- return;
1137
- let domValue = el.value;
1138
- if (trim) {
1139
- domValue = domValue.trim();
1140
- }
1141
- if (castToNumber) {
1142
- domValue = shared.looseToNumber(domValue);
1143
- }
1144
- el._assign(domValue);
1145
- });
1146
- if (trim) {
1147
- addEventListener(el, 'change', () => {
1148
- el.value = el.value.trim();
1149
- });
1150
- }
1151
- if (!lazy) {
1152
- addEventListener(el, 'compositionstart', onCompositionStart);
1153
- addEventListener(el, 'compositionend', onCompositionEnd);
1154
- // Safari < 10.2 & UIWebView doesn't fire compositionend when
1155
- // switching focus before confirming composition choice
1156
- // this also fixes the issue where some browsers e.g. iOS Chrome
1157
- // fires "change" instead of "input" on autocomplete.
1158
- addEventListener(el, 'change', onCompositionEnd);
1159
- }
1160
- },
1161
- // set value on mounted so it's after min/max for type="range"
1162
- mounted(el, { value }) {
1163
- el.value = value == null ? '' : value;
1164
- },
1165
- beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
1166
- el._assign = getModelAssigner(vnode);
1167
- // avoid clearing unresolved text. #2302
1168
- if (el.composing)
1169
- return;
1170
- if (document.activeElement === el && el.type !== 'range') {
1171
- if (lazy) {
1172
- return;
1173
- }
1174
- if (trim && el.value.trim() === value) {
1175
- return;
1176
- }
1177
- if ((number || el.type === 'number') &&
1178
- shared.looseToNumber(el.value) === value) {
1179
- return;
1180
- }
1181
- }
1182
- const newValue = value == null ? '' : value;
1183
- if (el.value !== newValue) {
1184
- el.value = newValue;
1185
- }
1003
+ created(el, { modifiers: { lazy, trim, number } }, vnode) {
1004
+ el._assign = getModelAssigner(vnode);
1005
+ const castToNumber = number || vnode.props && vnode.props.type === "number";
1006
+ addEventListener(el, lazy ? "change" : "input", (e) => {
1007
+ if (e.target.composing)
1008
+ return;
1009
+ let domValue = el.value;
1010
+ if (trim) {
1011
+ domValue = domValue.trim();
1012
+ }
1013
+ if (castToNumber) {
1014
+ domValue = shared.looseToNumber(domValue);
1015
+ }
1016
+ el._assign(domValue);
1017
+ });
1018
+ if (trim) {
1019
+ addEventListener(el, "change", () => {
1020
+ el.value = el.value.trim();
1021
+ });
1022
+ }
1023
+ if (!lazy) {
1024
+ addEventListener(el, "compositionstart", onCompositionStart);
1025
+ addEventListener(el, "compositionend", onCompositionEnd);
1026
+ addEventListener(el, "change", onCompositionEnd);
1027
+ }
1028
+ },
1029
+ // set value on mounted so it's after min/max for type="range"
1030
+ mounted(el, { value }) {
1031
+ el.value = value == null ? "" : value;
1032
+ },
1033
+ beforeUpdate(el, { value, modifiers: { lazy, trim, number } }, vnode) {
1034
+ el._assign = getModelAssigner(vnode);
1035
+ if (el.composing)
1036
+ return;
1037
+ if (document.activeElement === el && el.type !== "range") {
1038
+ if (lazy) {
1039
+ return;
1040
+ }
1041
+ if (trim && el.value.trim() === value) {
1042
+ return;
1043
+ }
1044
+ if ((number || el.type === "number") && shared.looseToNumber(el.value) === value) {
1045
+ return;
1046
+ }
1047
+ }
1048
+ const newValue = value == null ? "" : value;
1049
+ if (el.value !== newValue) {
1050
+ el.value = newValue;
1186
1051
  }
1052
+ }
1187
1053
  };
1188
1054
  const vModelCheckbox = {
1189
- // #4096 array checkboxes need to be deep traversed
1190
- deep: true,
1191
- created(el, _, vnode) {
1192
- el._assign = getModelAssigner(vnode);
1193
- addEventListener(el, 'change', () => {
1194
- const modelValue = el._modelValue;
1195
- const elementValue = getValue(el);
1196
- const checked = el.checked;
1197
- const assign = el._assign;
1198
- if (shared.isArray(modelValue)) {
1199
- const index = shared.looseIndexOf(modelValue, elementValue);
1200
- const found = index !== -1;
1201
- if (checked && !found) {
1202
- assign(modelValue.concat(elementValue));
1203
- }
1204
- else if (!checked && found) {
1205
- const filtered = [...modelValue];
1206
- filtered.splice(index, 1);
1207
- assign(filtered);
1208
- }
1209
- }
1210
- else if (shared.isSet(modelValue)) {
1211
- const cloned = new Set(modelValue);
1212
- if (checked) {
1213
- cloned.add(elementValue);
1214
- }
1215
- else {
1216
- cloned.delete(elementValue);
1217
- }
1218
- assign(cloned);
1219
- }
1220
- else {
1221
- assign(getCheckboxValue(el, checked));
1222
- }
1223
- });
1224
- },
1225
- // set initial checked on mount to wait for true-value/false-value
1226
- mounted: setChecked,
1227
- beforeUpdate(el, binding, vnode) {
1228
- el._assign = getModelAssigner(vnode);
1229
- setChecked(el, binding, vnode);
1230
- }
1055
+ // #4096 array checkboxes need to be deep traversed
1056
+ deep: true,
1057
+ created(el, _, vnode) {
1058
+ el._assign = getModelAssigner(vnode);
1059
+ addEventListener(el, "change", () => {
1060
+ const modelValue = el._modelValue;
1061
+ const elementValue = getValue(el);
1062
+ const checked = el.checked;
1063
+ const assign = el._assign;
1064
+ if (shared.isArray(modelValue)) {
1065
+ const index = shared.looseIndexOf(modelValue, elementValue);
1066
+ const found = index !== -1;
1067
+ if (checked && !found) {
1068
+ assign(modelValue.concat(elementValue));
1069
+ } else if (!checked && found) {
1070
+ const filtered = [...modelValue];
1071
+ filtered.splice(index, 1);
1072
+ assign(filtered);
1073
+ }
1074
+ } else if (shared.isSet(modelValue)) {
1075
+ const cloned = new Set(modelValue);
1076
+ if (checked) {
1077
+ cloned.add(elementValue);
1078
+ } else {
1079
+ cloned.delete(elementValue);
1080
+ }
1081
+ assign(cloned);
1082
+ } else {
1083
+ assign(getCheckboxValue(el, checked));
1084
+ }
1085
+ });
1086
+ },
1087
+ // set initial checked on mount to wait for true-value/false-value
1088
+ mounted: setChecked,
1089
+ beforeUpdate(el, binding, vnode) {
1090
+ el._assign = getModelAssigner(vnode);
1091
+ setChecked(el, binding, vnode);
1092
+ }
1231
1093
  };
1232
1094
  function setChecked(el, { value, oldValue }, vnode) {
1233
- el._modelValue = value;
1234
- if (shared.isArray(value)) {
1235
- el.checked = shared.looseIndexOf(value, vnode.props.value) > -1;
1236
- }
1237
- else if (shared.isSet(value)) {
1238
- el.checked = value.has(vnode.props.value);
1239
- }
1240
- else if (value !== oldValue) {
1241
- el.checked = shared.looseEqual(value, getCheckboxValue(el, true));
1242
- }
1095
+ el._modelValue = value;
1096
+ if (shared.isArray(value)) {
1097
+ el.checked = shared.looseIndexOf(value, vnode.props.value) > -1;
1098
+ } else if (shared.isSet(value)) {
1099
+ el.checked = value.has(vnode.props.value);
1100
+ } else if (value !== oldValue) {
1101
+ el.checked = shared.looseEqual(value, getCheckboxValue(el, true));
1102
+ }
1243
1103
  }
1244
1104
  const vModelRadio = {
1245
- created(el, { value }, vnode) {
1246
- el.checked = shared.looseEqual(value, vnode.props.value);
1247
- el._assign = getModelAssigner(vnode);
1248
- addEventListener(el, 'change', () => {
1249
- el._assign(getValue(el));
1250
- });
1251
- },
1252
- beforeUpdate(el, { value, oldValue }, vnode) {
1253
- el._assign = getModelAssigner(vnode);
1254
- if (value !== oldValue) {
1255
- el.checked = shared.looseEqual(value, vnode.props.value);
1256
- }
1105
+ created(el, { value }, vnode) {
1106
+ el.checked = shared.looseEqual(value, vnode.props.value);
1107
+ el._assign = getModelAssigner(vnode);
1108
+ addEventListener(el, "change", () => {
1109
+ el._assign(getValue(el));
1110
+ });
1111
+ },
1112
+ beforeUpdate(el, { value, oldValue }, vnode) {
1113
+ el._assign = getModelAssigner(vnode);
1114
+ if (value !== oldValue) {
1115
+ el.checked = shared.looseEqual(value, vnode.props.value);
1257
1116
  }
1117
+ }
1258
1118
  };
1259
1119
  const vModelSelect = {
1260
- // <select multiple> value need to be deep traversed
1261
- deep: true,
1262
- created(el, { value, modifiers: { number } }, vnode) {
1263
- const isSetModel = shared.isSet(value);
1264
- addEventListener(el, 'change', () => {
1265
- const selectedVal = Array.prototype.filter
1266
- .call(el.options, (o) => o.selected)
1267
- .map((o) => number ? shared.looseToNumber(getValue(o)) : getValue(o));
1268
- el._assign(el.multiple
1269
- ? isSetModel
1270
- ? new Set(selectedVal)
1271
- : selectedVal
1272
- : selectedVal[0]);
1273
- });
1274
- el._assign = getModelAssigner(vnode);
1275
- },
1276
- // set value in mounted & updated because <select> relies on its children
1277
- // <option>s.
1278
- mounted(el, { value }) {
1279
- setSelected(el, value);
1280
- },
1281
- beforeUpdate(el, _binding, vnode) {
1282
- el._assign = getModelAssigner(vnode);
1283
- },
1284
- updated(el, { value }) {
1285
- setSelected(el, value);
1286
- }
1120
+ // <select multiple> value need to be deep traversed
1121
+ deep: true,
1122
+ created(el, { value, modifiers: { number } }, vnode) {
1123
+ const isSetModel = shared.isSet(value);
1124
+ addEventListener(el, "change", () => {
1125
+ const selectedVal = Array.prototype.filter.call(el.options, (o) => o.selected).map(
1126
+ (o) => number ? shared.looseToNumber(getValue(o)) : getValue(o)
1127
+ );
1128
+ el._assign(
1129
+ el.multiple ? isSetModel ? new Set(selectedVal) : selectedVal : selectedVal[0]
1130
+ );
1131
+ });
1132
+ el._assign = getModelAssigner(vnode);
1133
+ },
1134
+ // set value in mounted & updated because <select> relies on its children
1135
+ // <option>s.
1136
+ mounted(el, { value }) {
1137
+ setSelected(el, value);
1138
+ },
1139
+ beforeUpdate(el, _binding, vnode) {
1140
+ el._assign = getModelAssigner(vnode);
1141
+ },
1142
+ updated(el, { value }) {
1143
+ setSelected(el, value);
1144
+ }
1287
1145
  };
1288
1146
  function setSelected(el, value) {
1289
- const isMultiple = el.multiple;
1290
- if (isMultiple && !shared.isArray(value) && !shared.isSet(value)) {
1291
- runtimeCore.warn(`<select multiple v-model> expects an Array or Set value for its binding, ` +
1292
- `but got ${Object.prototype.toString.call(value).slice(8, -1)}.`);
1147
+ const isMultiple = el.multiple;
1148
+ if (isMultiple && !shared.isArray(value) && !shared.isSet(value)) {
1149
+ runtimeCore.warn(
1150
+ `<select multiple v-model> expects an Array or Set value for its binding, but got ${Object.prototype.toString.call(value).slice(8, -1)}.`
1151
+ );
1152
+ return;
1153
+ }
1154
+ for (let i = 0, l = el.options.length; i < l; i++) {
1155
+ const option = el.options[i];
1156
+ const optionValue = getValue(option);
1157
+ if (isMultiple) {
1158
+ if (shared.isArray(value)) {
1159
+ option.selected = shared.looseIndexOf(value, optionValue) > -1;
1160
+ } else {
1161
+ option.selected = value.has(optionValue);
1162
+ }
1163
+ } else {
1164
+ if (shared.looseEqual(getValue(option), value)) {
1165
+ if (el.selectedIndex !== i)
1166
+ el.selectedIndex = i;
1293
1167
  return;
1168
+ }
1294
1169
  }
1295
- for (let i = 0, l = el.options.length; i < l; i++) {
1296
- const option = el.options[i];
1297
- const optionValue = getValue(option);
1298
- if (isMultiple) {
1299
- if (shared.isArray(value)) {
1300
- option.selected = shared.looseIndexOf(value, optionValue) > -1;
1301
- }
1302
- else {
1303
- option.selected = value.has(optionValue);
1304
- }
1305
- }
1306
- else {
1307
- if (shared.looseEqual(getValue(option), value)) {
1308
- if (el.selectedIndex !== i)
1309
- el.selectedIndex = i;
1310
- return;
1311
- }
1312
- }
1313
- }
1314
- if (!isMultiple && el.selectedIndex !== -1) {
1315
- el.selectedIndex = -1;
1316
- }
1170
+ }
1171
+ if (!isMultiple && el.selectedIndex !== -1) {
1172
+ el.selectedIndex = -1;
1173
+ }
1317
1174
  }
1318
- // retrieve raw value set via :value bindings
1319
1175
  function getValue(el) {
1320
- return '_value' in el ? el._value : el.value;
1176
+ return "_value" in el ? el._value : el.value;
1321
1177
  }
1322
- // retrieve raw value for true-value and false-value set via :true-value or :false-value bindings
1323
1178
  function getCheckboxValue(el, checked) {
1324
- const key = checked ? '_trueValue' : '_falseValue';
1325
- return key in el ? el[key] : checked;
1179
+ const key = checked ? "_trueValue" : "_falseValue";
1180
+ return key in el ? el[key] : checked;
1326
1181
  }
1327
1182
  const vModelDynamic = {
1328
- created(el, binding, vnode) {
1329
- callModelHook(el, binding, vnode, null, 'created');
1330
- },
1331
- mounted(el, binding, vnode) {
1332
- callModelHook(el, binding, vnode, null, 'mounted');
1333
- },
1334
- beforeUpdate(el, binding, vnode, prevVNode) {
1335
- callModelHook(el, binding, vnode, prevVNode, 'beforeUpdate');
1336
- },
1337
- updated(el, binding, vnode, prevVNode) {
1338
- callModelHook(el, binding, vnode, prevVNode, 'updated');
1339
- }
1183
+ created(el, binding, vnode) {
1184
+ callModelHook(el, binding, vnode, null, "created");
1185
+ },
1186
+ mounted(el, binding, vnode) {
1187
+ callModelHook(el, binding, vnode, null, "mounted");
1188
+ },
1189
+ beforeUpdate(el, binding, vnode, prevVNode) {
1190
+ callModelHook(el, binding, vnode, prevVNode, "beforeUpdate");
1191
+ },
1192
+ updated(el, binding, vnode, prevVNode) {
1193
+ callModelHook(el, binding, vnode, prevVNode, "updated");
1194
+ }
1340
1195
  };
1341
1196
  function resolveDynamicModel(tagName, type) {
1342
- switch (tagName) {
1343
- case 'SELECT':
1344
- return vModelSelect;
1345
- case 'TEXTAREA':
1346
- return vModelText;
1197
+ switch (tagName) {
1198
+ case "SELECT":
1199
+ return vModelSelect;
1200
+ case "TEXTAREA":
1201
+ return vModelText;
1202
+ default:
1203
+ switch (type) {
1204
+ case "checkbox":
1205
+ return vModelCheckbox;
1206
+ case "radio":
1207
+ return vModelRadio;
1347
1208
  default:
1348
- switch (type) {
1349
- case 'checkbox':
1350
- return vModelCheckbox;
1351
- case 'radio':
1352
- return vModelRadio;
1353
- default:
1354
- return vModelText;
1355
- }
1356
- }
1209
+ return vModelText;
1210
+ }
1211
+ }
1357
1212
  }
1358
1213
  function callModelHook(el, binding, vnode, prevVNode, hook) {
1359
- const modelToUse = resolveDynamicModel(el.tagName, vnode.props && vnode.props.type);
1360
- const fn = modelToUse[hook];
1361
- fn && fn(el, binding, vnode, prevVNode);
1214
+ const modelToUse = resolveDynamicModel(
1215
+ el.tagName,
1216
+ vnode.props && vnode.props.type
1217
+ );
1218
+ const fn = modelToUse[hook];
1219
+ fn && fn(el, binding, vnode, prevVNode);
1362
1220
  }
1363
- // SSR vnode transforms, only used when user includes client-oriented render
1364
- // function in SSR
1365
1221
  function initVModelForSSR() {
1366
- vModelText.getSSRProps = ({ value }) => ({ value });
1367
- vModelRadio.getSSRProps = ({ value }, vnode) => {
1368
- if (vnode.props && shared.looseEqual(vnode.props.value, value)) {
1369
- return { checked: true };
1370
- }
1371
- };
1372
- vModelCheckbox.getSSRProps = ({ value }, vnode) => {
1373
- if (shared.isArray(value)) {
1374
- if (vnode.props && shared.looseIndexOf(value, vnode.props.value) > -1) {
1375
- return { checked: true };
1376
- }
1377
- }
1378
- else if (shared.isSet(value)) {
1379
- if (vnode.props && value.has(vnode.props.value)) {
1380
- return { checked: true };
1381
- }
1382
- }
1383
- else if (value) {
1384
- return { checked: true };
1385
- }
1386
- };
1387
- vModelDynamic.getSSRProps = (binding, vnode) => {
1388
- if (typeof vnode.type !== 'string') {
1389
- return;
1390
- }
1391
- const modelToUse = resolveDynamicModel(
1392
- // resolveDynamicModel expects an uppercase tag name, but vnode.type is lowercase
1393
- vnode.type.toUpperCase(), vnode.props && vnode.props.type);
1394
- if (modelToUse.getSSRProps) {
1395
- return modelToUse.getSSRProps(binding, vnode);
1396
- }
1397
- };
1222
+ vModelText.getSSRProps = ({ value }) => ({ value });
1223
+ vModelRadio.getSSRProps = ({ value }, vnode) => {
1224
+ if (vnode.props && shared.looseEqual(vnode.props.value, value)) {
1225
+ return { checked: true };
1226
+ }
1227
+ };
1228
+ vModelCheckbox.getSSRProps = ({ value }, vnode) => {
1229
+ if (shared.isArray(value)) {
1230
+ if (vnode.props && shared.looseIndexOf(value, vnode.props.value) > -1) {
1231
+ return { checked: true };
1232
+ }
1233
+ } else if (shared.isSet(value)) {
1234
+ if (vnode.props && value.has(vnode.props.value)) {
1235
+ return { checked: true };
1236
+ }
1237
+ } else if (value) {
1238
+ return { checked: true };
1239
+ }
1240
+ };
1241
+ vModelDynamic.getSSRProps = (binding, vnode) => {
1242
+ if (typeof vnode.type !== "string") {
1243
+ return;
1244
+ }
1245
+ const modelToUse = resolveDynamicModel(
1246
+ // resolveDynamicModel expects an uppercase tag name, but vnode.type is lowercase
1247
+ vnode.type.toUpperCase(),
1248
+ vnode.props && vnode.props.type
1249
+ );
1250
+ if (modelToUse.getSSRProps) {
1251
+ return modelToUse.getSSRProps(binding, vnode);
1252
+ }
1253
+ };
1398
1254
  }
1399
1255
 
1400
- const systemModifiers = ['ctrl', 'shift', 'alt', 'meta'];
1256
+ const systemModifiers = ["ctrl", "shift", "alt", "meta"];
1401
1257
  const modifierGuards = {
1402
- stop: e => e.stopPropagation(),
1403
- prevent: e => e.preventDefault(),
1404
- self: e => e.target !== e.currentTarget,
1405
- ctrl: e => !e.ctrlKey,
1406
- shift: e => !e.shiftKey,
1407
- alt: e => !e.altKey,
1408
- meta: e => !e.metaKey,
1409
- left: e => 'button' in e && e.button !== 0,
1410
- middle: e => 'button' in e && e.button !== 1,
1411
- right: e => 'button' in e && e.button !== 2,
1412
- exact: (e, modifiers) => systemModifiers.some(m => e[`${m}Key`] && !modifiers.includes(m))
1258
+ stop: (e) => e.stopPropagation(),
1259
+ prevent: (e) => e.preventDefault(),
1260
+ self: (e) => e.target !== e.currentTarget,
1261
+ ctrl: (e) => !e.ctrlKey,
1262
+ shift: (e) => !e.shiftKey,
1263
+ alt: (e) => !e.altKey,
1264
+ meta: (e) => !e.metaKey,
1265
+ left: (e) => "button" in e && e.button !== 0,
1266
+ middle: (e) => "button" in e && e.button !== 1,
1267
+ right: (e) => "button" in e && e.button !== 2,
1268
+ exact: (e, modifiers) => systemModifiers.some((m) => e[`${m}Key`] && !modifiers.includes(m))
1413
1269
  };
1414
- /**
1415
- * @private
1416
- */
1417
1270
  const withModifiers = (fn, modifiers) => {
1418
- return (event, ...args) => {
1419
- for (let i = 0; i < modifiers.length; i++) {
1420
- const guard = modifierGuards[modifiers[i]];
1421
- if (guard && guard(event, modifiers))
1422
- return;
1423
- }
1424
- return fn(event, ...args);
1425
- };
1271
+ return (event, ...args) => {
1272
+ for (let i = 0; i < modifiers.length; i++) {
1273
+ const guard = modifierGuards[modifiers[i]];
1274
+ if (guard && guard(event, modifiers))
1275
+ return;
1276
+ }
1277
+ return fn(event, ...args);
1278
+ };
1426
1279
  };
1427
- // Kept for 2.x compat.
1428
- // Note: IE11 compat for `spacebar` and `del` is removed for now.
1429
1280
  const keyNames = {
1430
- esc: 'escape',
1431
- space: ' ',
1432
- up: 'arrow-up',
1433
- left: 'arrow-left',
1434
- right: 'arrow-right',
1435
- down: 'arrow-down',
1436
- delete: 'backspace'
1281
+ esc: "escape",
1282
+ space: " ",
1283
+ up: "arrow-up",
1284
+ left: "arrow-left",
1285
+ right: "arrow-right",
1286
+ down: "arrow-down",
1287
+ delete: "backspace"
1437
1288
  };
1438
- /**
1439
- * @private
1440
- */
1441
1289
  const withKeys = (fn, modifiers) => {
1442
- return (event) => {
1443
- if (!('key' in event)) {
1444
- return;
1445
- }
1446
- const eventKey = shared.hyphenate(event.key);
1447
- if (modifiers.some(k => k === eventKey || keyNames[k] === eventKey)) {
1448
- return fn(event);
1449
- }
1450
- };
1290
+ return (event) => {
1291
+ if (!("key" in event)) {
1292
+ return;
1293
+ }
1294
+ const eventKey = shared.hyphenate(event.key);
1295
+ if (modifiers.some((k) => k === eventKey || keyNames[k] === eventKey)) {
1296
+ return fn(event);
1297
+ }
1298
+ };
1451
1299
  };
1452
1300
 
1453
1301
  const vShow = {
1454
- beforeMount(el, { value }, { transition }) {
1455
- el._vod = el.style.display === 'none' ? '' : el.style.display;
1456
- if (transition && value) {
1457
- transition.beforeEnter(el);
1458
- }
1459
- else {
1460
- setDisplay(el, value);
1461
- }
1462
- },
1463
- mounted(el, { value }, { transition }) {
1464
- if (transition && value) {
1465
- transition.enter(el);
1466
- }
1467
- },
1468
- updated(el, { value, oldValue }, { transition }) {
1469
- if (!value === !oldValue)
1470
- return;
1471
- if (transition) {
1472
- if (value) {
1473
- transition.beforeEnter(el);
1474
- setDisplay(el, true);
1475
- transition.enter(el);
1476
- }
1477
- else {
1478
- transition.leave(el, () => {
1479
- setDisplay(el, false);
1480
- });
1481
- }
1482
- }
1483
- else {
1484
- setDisplay(el, value);
1485
- }
1486
- },
1487
- beforeUnmount(el, { value }) {
1488
- setDisplay(el, value);
1489
- }
1302
+ beforeMount(el, { value }, { transition }) {
1303
+ el._vod = el.style.display === "none" ? "" : el.style.display;
1304
+ if (transition && value) {
1305
+ transition.beforeEnter(el);
1306
+ } else {
1307
+ setDisplay(el, value);
1308
+ }
1309
+ },
1310
+ mounted(el, { value }, { transition }) {
1311
+ if (transition && value) {
1312
+ transition.enter(el);
1313
+ }
1314
+ },
1315
+ updated(el, { value, oldValue }, { transition }) {
1316
+ if (!value === !oldValue)
1317
+ return;
1318
+ if (transition) {
1319
+ if (value) {
1320
+ transition.beforeEnter(el);
1321
+ setDisplay(el, true);
1322
+ transition.enter(el);
1323
+ } else {
1324
+ transition.leave(el, () => {
1325
+ setDisplay(el, false);
1326
+ });
1327
+ }
1328
+ } else {
1329
+ setDisplay(el, value);
1330
+ }
1331
+ },
1332
+ beforeUnmount(el, { value }) {
1333
+ setDisplay(el, value);
1334
+ }
1490
1335
  };
1491
1336
  function setDisplay(el, value) {
1492
- el.style.display = value ? el._vod : 'none';
1337
+ el.style.display = value ? el._vod : "none";
1493
1338
  }
1494
- // SSR vnode transforms, only used when user includes client-oriented render
1495
- // function in SSR
1496
1339
  function initVShowForSSR() {
1497
- vShow.getSSRProps = ({ value }) => {
1498
- if (!value) {
1499
- return { style: { display: 'none' } };
1500
- }
1501
- };
1340
+ vShow.getSSRProps = ({ value }) => {
1341
+ if (!value) {
1342
+ return { style: { display: "none" } };
1343
+ }
1344
+ };
1502
1345
  }
1503
1346
 
1504
- const rendererOptions = /*#__PURE__*/ shared.extend({ patchProp }, nodeOps);
1505
- // lazy create the renderer - this makes core renderer logic tree-shakable
1506
- // in case the user only imports reactivity utilities from Vue.
1347
+ const rendererOptions = /* @__PURE__ */ shared.extend({ patchProp }, nodeOps);
1507
1348
  let renderer;
1508
1349
  let enabledHydration = false;
1509
1350
  function ensureRenderer() {
1510
- return (renderer ||
1511
- (renderer = runtimeCore.createRenderer(rendererOptions)));
1351
+ return renderer || (renderer = runtimeCore.createRenderer(rendererOptions));
1512
1352
  }
1513
1353
  function ensureHydrationRenderer() {
1514
- renderer = enabledHydration
1515
- ? renderer
1516
- : runtimeCore.createHydrationRenderer(rendererOptions);
1517
- enabledHydration = true;
1518
- return renderer;
1354
+ renderer = enabledHydration ? renderer : runtimeCore.createHydrationRenderer(rendererOptions);
1355
+ enabledHydration = true;
1356
+ return renderer;
1519
1357
  }
1520
- // use explicit type casts here to avoid import() calls in rolled-up d.ts
1521
- const render = ((...args) => {
1522
- ensureRenderer().render(...args);
1523
- });
1524
- const hydrate = ((...args) => {
1525
- ensureHydrationRenderer().hydrate(...args);
1526
- });
1527
- const createApp = ((...args) => {
1528
- const app = ensureRenderer().createApp(...args);
1529
- {
1530
- injectNativeTagCheck(app);
1531
- injectCompilerOptionsCheck(app);
1532
- }
1533
- const { mount } = app;
1534
- app.mount = (containerOrSelector) => {
1535
- const container = normalizeContainer(containerOrSelector);
1536
- if (!container)
1537
- return;
1538
- const component = app._component;
1539
- if (!shared.isFunction(component) && !component.render && !component.template) {
1540
- // __UNSAFE__
1541
- // Reason: potential execution of JS expressions in in-DOM template.
1542
- // The user must make sure the in-DOM template is trusted. If it's
1543
- // rendered by the server, the template should not contain any user data.
1544
- component.template = container.innerHTML;
1545
- }
1546
- // clear content before mounting
1547
- container.innerHTML = '';
1548
- const proxy = mount(container, false, container instanceof SVGElement);
1549
- if (container instanceof Element) {
1550
- container.removeAttribute('v-cloak');
1551
- container.setAttribute('data-v-app', '');
1552
- }
1553
- return proxy;
1554
- };
1555
- return app;
1556
- });
1557
- const createSSRApp = ((...args) => {
1558
- const app = ensureHydrationRenderer().createApp(...args);
1559
- {
1560
- injectNativeTagCheck(app);
1561
- injectCompilerOptionsCheck(app);
1562
- }
1563
- const { mount } = app;
1564
- app.mount = (containerOrSelector) => {
1565
- const container = normalizeContainer(containerOrSelector);
1566
- if (container) {
1567
- return mount(container, true, container instanceof SVGElement);
1568
- }
1569
- };
1570
- return app;
1571
- });
1358
+ const render = (...args) => {
1359
+ ensureRenderer().render(...args);
1360
+ };
1361
+ const hydrate = (...args) => {
1362
+ ensureHydrationRenderer().hydrate(...args);
1363
+ };
1364
+ const createApp = (...args) => {
1365
+ const app = ensureRenderer().createApp(...args);
1366
+ {
1367
+ injectNativeTagCheck(app);
1368
+ injectCompilerOptionsCheck(app);
1369
+ }
1370
+ const { mount } = app;
1371
+ app.mount = (containerOrSelector) => {
1372
+ const container = normalizeContainer(containerOrSelector);
1373
+ if (!container)
1374
+ return;
1375
+ const component = app._component;
1376
+ if (!shared.isFunction(component) && !component.render && !component.template) {
1377
+ component.template = container.innerHTML;
1378
+ }
1379
+ container.innerHTML = "";
1380
+ const proxy = mount(container, false, container instanceof SVGElement);
1381
+ if (container instanceof Element) {
1382
+ container.removeAttribute("v-cloak");
1383
+ container.setAttribute("data-v-app", "");
1384
+ }
1385
+ return proxy;
1386
+ };
1387
+ return app;
1388
+ };
1389
+ const createSSRApp = (...args) => {
1390
+ const app = ensureHydrationRenderer().createApp(...args);
1391
+ {
1392
+ injectNativeTagCheck(app);
1393
+ injectCompilerOptionsCheck(app);
1394
+ }
1395
+ const { mount } = app;
1396
+ app.mount = (containerOrSelector) => {
1397
+ const container = normalizeContainer(containerOrSelector);
1398
+ if (container) {
1399
+ return mount(container, true, container instanceof SVGElement);
1400
+ }
1401
+ };
1402
+ return app;
1403
+ };
1572
1404
  function injectNativeTagCheck(app) {
1573
- // Inject `isNativeTag`
1574
- // this is used for component name validation (dev only)
1575
- Object.defineProperty(app.config, 'isNativeTag', {
1576
- value: (tag) => shared.isHTMLTag(tag) || shared.isSVGTag(tag),
1577
- writable: false
1578
- });
1405
+ Object.defineProperty(app.config, "isNativeTag", {
1406
+ value: (tag) => shared.isHTMLTag(tag) || shared.isSVGTag(tag),
1407
+ writable: false
1408
+ });
1579
1409
  }
1580
- // dev only
1581
1410
  function injectCompilerOptionsCheck(app) {
1582
- if (runtimeCore.isRuntimeOnly()) {
1583
- const isCustomElement = app.config.isCustomElement;
1584
- Object.defineProperty(app.config, 'isCustomElement', {
1585
- get() {
1586
- return isCustomElement;
1587
- },
1588
- set() {
1589
- runtimeCore.warn(`The \`isCustomElement\` config option is deprecated. Use ` +
1590
- `\`compilerOptions.isCustomElement\` instead.`);
1591
- }
1592
- });
1593
- const compilerOptions = app.config.compilerOptions;
1594
- const msg = `The \`compilerOptions\` config option is only respected when using ` +
1595
- `a build of Vue.js that includes the runtime compiler (aka "full build"). ` +
1596
- `Since you are using the runtime-only build, \`compilerOptions\` ` +
1597
- `must be passed to \`@vue/compiler-dom\` in the build setup instead.\n` +
1598
- `- For vue-loader: pass it via vue-loader's \`compilerOptions\` loader option.\n` +
1599
- `- For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader\n` +
1600
- `- For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-dom`;
1601
- Object.defineProperty(app.config, 'compilerOptions', {
1602
- get() {
1603
- runtimeCore.warn(msg);
1604
- return compilerOptions;
1605
- },
1606
- set() {
1607
- runtimeCore.warn(msg);
1608
- }
1609
- });
1610
- }
1411
+ if (runtimeCore.isRuntimeOnly()) {
1412
+ const isCustomElement = app.config.isCustomElement;
1413
+ Object.defineProperty(app.config, "isCustomElement", {
1414
+ get() {
1415
+ return isCustomElement;
1416
+ },
1417
+ set() {
1418
+ runtimeCore.warn(
1419
+ `The \`isCustomElement\` config option is deprecated. Use \`compilerOptions.isCustomElement\` instead.`
1420
+ );
1421
+ }
1422
+ });
1423
+ const compilerOptions = app.config.compilerOptions;
1424
+ 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.
1425
+ - For vue-loader: pass it via vue-loader's \`compilerOptions\` loader option.
1426
+ - For vue-cli: see https://cli.vuejs.org/guide/webpack.html#modifying-options-of-a-loader
1427
+ - For vite: pass it via @vitejs/plugin-vue options. See https://github.com/vitejs/vite/tree/main/packages/plugin-vue#example-for-passing-options-to-vuecompiler-dom`;
1428
+ Object.defineProperty(app.config, "compilerOptions", {
1429
+ get() {
1430
+ runtimeCore.warn(msg);
1431
+ return compilerOptions;
1432
+ },
1433
+ set() {
1434
+ runtimeCore.warn(msg);
1435
+ }
1436
+ });
1437
+ }
1611
1438
  }
1612
1439
  function normalizeContainer(container) {
1613
- if (shared.isString(container)) {
1614
- const res = document.querySelector(container);
1615
- if (!res) {
1616
- runtimeCore.warn(`Failed to mount app: mount target selector "${container}" returned null.`);
1617
- }
1618
- return res;
1619
- }
1620
- if (window.ShadowRoot &&
1621
- container instanceof window.ShadowRoot &&
1622
- container.mode === 'closed') {
1623
- runtimeCore.warn(`mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`);
1440
+ if (shared.isString(container)) {
1441
+ const res = document.querySelector(container);
1442
+ if (!res) {
1443
+ runtimeCore.warn(
1444
+ `Failed to mount app: mount target selector "${container}" returned null.`
1445
+ );
1624
1446
  }
1625
- return container;
1447
+ return res;
1448
+ }
1449
+ if (window.ShadowRoot && container instanceof window.ShadowRoot && container.mode === "closed") {
1450
+ runtimeCore.warn(
1451
+ `mounting on a ShadowRoot with \`{mode: "closed"}\` may lead to unpredictable bugs`
1452
+ );
1453
+ }
1454
+ return container;
1626
1455
  }
1627
1456
  let ssrDirectiveInitialized = false;
1628
- /**
1629
- * @internal
1630
- */
1631
1457
  const initDirectivesForSSR = () => {
1632
- if (!ssrDirectiveInitialized) {
1633
- ssrDirectiveInitialized = true;
1634
- initVModelForSSR();
1635
- initVShowForSSR();
1636
- }
1637
- }
1638
- ;
1458
+ if (!ssrDirectiveInitialized) {
1459
+ ssrDirectiveInitialized = true;
1460
+ initVModelForSSR();
1461
+ initVShowForSSR();
1462
+ }
1463
+ } ;
1639
1464
 
1640
1465
  exports.Transition = Transition;
1641
1466
  exports.TransitionGroup = TransitionGroup;