@vue/runtime-dom 3.2.40 → 3.2.41

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