runtime-dom.cjs.prod.js 42 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var runtimeCore = require('@vue/runtime-core');
  4. var shared = require('@vue/shared');
  5. const svgNS = 'http://www.w3.org/2000/svg';
  6. const doc = (typeof document !== 'undefined' ? document : null);
  7. let tempContainer;
  8. let tempSVGContainer;
  9. const nodeOps = {
  10. insert: (child, parent, anchor) => {
  11. parent.insertBefore(child, anchor || null);
  12. },
  13. remove: child => {
  14. const parent = child.parentNode;
  15. if (parent) {
  16. parent.removeChild(child);
  17. }
  18. },
  19. createElement: (tag, isSVG, is) => isSVG
  20. ? doc.createElementNS(svgNS, tag)
  21. : doc.createElement(tag, is ? { is } : undefined),
  22. createText: text => doc.createTextNode(text),
  23. createComment: text => doc.createComment(text),
  24. setText: (node, text) => {
  25. node.nodeValue = text;
  26. },
  27. setElementText: (el, text) => {
  28. el.textContent = text;
  29. },
  30. parentNode: node => node.parentNode,
  31. nextSibling: node => node.nextSibling,
  32. querySelector: selector => doc.querySelector(selector),
  33. setScopeId(el, id) {
  34. el.setAttribute(id, '');
  35. },
  36. cloneNode(el) {
  37. return el.cloneNode(true);
  38. },
  39. // __UNSAFE__
  40. // Reason: innerHTML.
  41. // Static content here can only come from compiled templates.
  42. // As long as the user only uses trusted templates, this is safe.
  43. insertStaticContent(content, parent, anchor, isSVG) {
  44. const temp = isSVG
  45. ? tempSVGContainer ||
  46. (tempSVGContainer = doc.createElementNS(svgNS, 'svg'))
  47. : tempContainer || (tempContainer = doc.createElement('div'));
  48. temp.innerHTML = content;
  49. const first = temp.firstChild;
  50. let node = first;
  51. let last = node;
  52. while (node) {
  53. last = node;
  54. nodeOps.insert(node, parent, anchor);
  55. node = temp.firstChild;
  56. }
  57. return [first, last];
  58. }
  59. };
  60. // compiler should normalize class + :class bindings on the same element
  61. // into a single binding ['staticClass', dynamic]
  62. function patchClass(el, value, isSVG) {
  63. if (value == null) {
  64. value = '';
  65. }
  66. if (isSVG) {
  67. el.setAttribute('class', value);
  68. }
  69. else {
  70. // directly setting className should be faster than setAttribute in theory
  71. // if this is an element during a transition, take the temporary transition
  72. // classes into account.
  73. const transitionClasses = el._vtc;
  74. if (transitionClasses) {
  75. value = (value
  76. ? [value, ...transitionClasses]
  77. : [...transitionClasses]).join(' ');
  78. }
  79. el.className = value;
  80. }
  81. }
  82. function patchStyle(el, prev, next) {
  83. const style = el.style;
  84. if (!next) {
  85. el.removeAttribute('style');
  86. }
  87. else if (shared.isString(next)) {
  88. if (prev !== next) {
  89. style.cssText = next;
  90. }
  91. }
  92. else {
  93. for (const key in next) {
  94. setStyle(style, key, next[key]);
  95. }
  96. if (prev && !shared.isString(prev)) {
  97. for (const key in prev) {
  98. if (next[key] == null) {
  99. setStyle(style, key, '');
  100. }
  101. }
  102. }
  103. }
  104. }
  105. const importantRE = /\s*!important$/;
  106. function setStyle(style, name, val) {
  107. if (shared.isArray(val)) {
  108. val.forEach(v => setStyle(style, name, v));
  109. }
  110. else {
  111. if (name.startsWith('--')) {
  112. // custom property definition
  113. style.setProperty(name, val);
  114. }
  115. else {
  116. const prefixed = autoPrefix(style, name);
  117. if (importantRE.test(val)) {
  118. // !important
  119. style.setProperty(shared.hyphenate(prefixed), val.replace(importantRE, ''), 'important');
  120. }
  121. else {
  122. style[prefixed] = val;
  123. }
  124. }
  125. }
  126. }
  127. const prefixes = ['Webkit', 'Moz', 'ms'];
  128. const prefixCache = {};
  129. function autoPrefix(style, rawName) {
  130. const cached = prefixCache[rawName];
  131. if (cached) {
  132. return cached;
  133. }
  134. let name = runtimeCore.camelize(rawName);
  135. if (name !== 'filter' && name in style) {
  136. return (prefixCache[rawName] = name);
  137. }
  138. name = shared.capitalize(name);
  139. for (let i = 0; i < prefixes.length; i++) {
  140. const prefixed = prefixes[i] + name;
  141. if (prefixed in style) {
  142. return (prefixCache[rawName] = prefixed);
  143. }
  144. }
  145. return rawName;
  146. }
  147. const xlinkNS = 'http://www.w3.org/1999/xlink';
  148. function patchAttr(el, key, value, isSVG) {
  149. if (isSVG && key.startsWith('xlink:')) {
  150. if (value == null) {
  151. el.removeAttributeNS(xlinkNS, key.slice(6, key.length));
  152. }
  153. else {
  154. el.setAttributeNS(xlinkNS, key, value);
  155. }
  156. }
  157. else {
  158. // note we are only checking boolean attributes that don't have a
  159. // corresponding dom prop of the same name here.
  160. const isBoolean = shared.isSpecialBooleanAttr(key);
  161. if (value == null || (isBoolean && value === false)) {
  162. el.removeAttribute(key);
  163. }
  164. else {
  165. el.setAttribute(key, isBoolean ? '' : value);
  166. }
  167. }
  168. }
  169. // __UNSAFE__
  170. // functions. The user is responsible for using them with only trusted content.
  171. function patchDOMProp(el, key, value,
  172. // the following args are passed only due to potential innerHTML/textContent
  173. // overriding existing VNodes, in which case the old tree must be properly
  174. // unmounted.
  175. prevChildren, parentComponent, parentSuspense, unmountChildren) {
  176. if (key === 'innerHTML' || key === 'textContent') {
  177. if (prevChildren) {
  178. unmountChildren(prevChildren, parentComponent, parentSuspense);
  179. }
  180. el[key] = value == null ? '' : value;
  181. return;
  182. }
  183. if (key === 'value' && el.tagName !== 'PROGRESS') {
  184. // store value as _value as well since
  185. // non-string values will be stringified.
  186. el._value = value;
  187. const newValue = value == null ? '' : value;
  188. if (el.value !== newValue) {
  189. el.value = newValue;
  190. }
  191. return;
  192. }
  193. if (value === '' && typeof el[key] === 'boolean') {
  194. // e.g. <select multiple> compiles to { multiple: '' }
  195. el[key] = true;
  196. }
  197. else if (value == null && typeof el[key] === 'string') {
  198. // e.g. <div :id="null">
  199. el[key] = '';
  200. el.removeAttribute(key);
  201. }
  202. else {
  203. // some properties perform value validation and throw
  204. try {
  205. el[key] = value;
  206. }
  207. catch (e) {
  208. }
  209. }
  210. }
  211. // Async edge case fix requires storing an event listener's attach timestamp.
  212. let _getNow = Date.now;
  213. // Determine what event timestamp the browser is using. Annoyingly, the
  214. // timestamp can either be hi-res (relative to page load) or low-res
  215. // (relative to UNIX epoch), so in order to compare time we have to use the
  216. // same timestamp type when saving the flush timestamp.
  217. if (typeof document !== 'undefined' &&
  218. _getNow() > document.createEvent('Event').timeStamp) {
  219. // if the low-res timestamp which is bigger than the event timestamp
  220. // (which is evaluated AFTER) it means the event is using a hi-res timestamp,
  221. // and we need to use the hi-res version for event listeners as well.
  222. _getNow = () => performance.now();
  223. }
  224. // To avoid the overhead of repeatedly calling performance.now(), we cache
  225. // and use the same timestamp for all event listeners attached in the same tick.
  226. let cachedNow = 0;
  227. const p = Promise.resolve();
  228. const reset = () => {
  229. cachedNow = 0;
  230. };
  231. const getNow = () => cachedNow || (p.then(reset), (cachedNow = _getNow()));
  232. function addEventListener(el, event, handler, options) {
  233. el.addEventListener(event, handler, options);
  234. }
  235. function removeEventListener(el, event, handler, options) {
  236. el.removeEventListener(event, handler, options);
  237. }
  238. function patchEvent(el, rawName, prevValue, nextValue, instance = null) {
  239. // vei = vue event invokers
  240. const invokers = el._vei || (el._vei = {});
  241. const existingInvoker = invokers[rawName];
  242. if (nextValue && existingInvoker) {
  243. // patch
  244. existingInvoker.value = nextValue;
  245. }
  246. else {
  247. const [name, options] = parseName(rawName);
  248. if (nextValue) {
  249. // add
  250. const invoker = (invokers[rawName] = createInvoker(nextValue, instance));
  251. addEventListener(el, name, invoker, options);
  252. }
  253. else if (existingInvoker) {
  254. // remove
  255. removeEventListener(el, name, existingInvoker, options);
  256. invokers[rawName] = undefined;
  257. }
  258. }
  259. }
  260. const optionsModifierRE = /(?:Once|Passive|Capture)$/;
  261. function parseName(name) {
  262. let options;
  263. if (optionsModifierRE.test(name)) {
  264. options = {};
  265. let m;
  266. while ((m = name.match(optionsModifierRE))) {
  267. name = name.slice(0, name.length - m[0].length);
  268. options[m[0].toLowerCase()] = true;
  269. }
  270. }
  271. return [name.slice(2).toLowerCase(), options];
  272. }
  273. function createInvoker(initialValue, instance) {
  274. const invoker = (e) => {
  275. // async edge case #6566: inner click event triggers patch, event handler
  276. // attached to outer element during patch, and triggered again. This
  277. // happens because browsers fire microtask ticks between event propagation.
  278. // the solution is simple: we save the timestamp when a handler is attached,
  279. // and the handler would only fire if the event passed to it was fired
  280. // AFTER it was attached.
  281. const timeStamp = e.timeStamp || _getNow();
  282. if (timeStamp >= invoker.attached - 1) {
  283. runtimeCore.callWithAsyncErrorHandling(patchStopImmediatePropagation(e, invoker.value), instance, 5 /* NATIVE_EVENT_HANDLER */, [e]);
  284. }
  285. };
  286. invoker.value = initialValue;
  287. invoker.attached = getNow();
  288. return invoker;
  289. }
  290. function patchStopImmediatePropagation(e, value) {
  291. if (shared.isArray(value)) {
  292. const originalStop = e.stopImmediatePropagation;
  293. e.stopImmediatePropagation = () => {
  294. originalStop.call(e);
  295. e._stopped = true;
  296. };
  297. return value.map(fn => (e) => !e._stopped && fn(e));
  298. }
  299. else {
  300. return value;
  301. }
  302. }
  303. const nativeOnRE = /^on[a-z]/;
  304. const forcePatchProp = (_, key) => key === 'value';
  305. const patchProp = (el, key, prevValue, nextValue, isSVG = false, prevChildren, parentComponent, parentSuspense, unmountChildren) => {
  306. switch (key) {
  307. // special
  308. case 'class':
  309. patchClass(el, nextValue, isSVG);
  310. break;
  311. case 'style':
  312. patchStyle(el, prevValue, nextValue);
  313. break;
  314. default:
  315. if (shared.isOn(key)) {
  316. // ignore v-model listeners
  317. if (!shared.isModelListener(key)) {
  318. patchEvent(el, key, prevValue, nextValue, parentComponent);
  319. }
  320. }
  321. else if (shouldSetAsProp(el, key, nextValue, isSVG)) {
  322. patchDOMProp(el, key, nextValue, prevChildren, parentComponent, parentSuspense, unmountChildren);
  323. }
  324. else {
  325. // special case for <input v-model type="checkbox"> with
  326. // :true-value & :false-value
  327. // store value as dom properties since non-string values will be
  328. // stringified.
  329. if (key === 'true-value') {
  330. el._trueValue = nextValue;
  331. }
  332. else if (key === 'false-value') {
  333. el._falseValue = nextValue;
  334. }
  335. patchAttr(el, key, nextValue, isSVG);
  336. }
  337. break;
  338. }
  339. };
  340. function shouldSetAsProp(el, key, value, isSVG) {
  341. if (isSVG) {
  342. // most keys must be set as attribute on svg elements to work
  343. // ...except innerHTML
  344. if (key === 'innerHTML') {
  345. return true;
  346. }
  347. // or native onclick with function values
  348. if (key in el && nativeOnRE.test(key) && shared.isFunction(value)) {
  349. return true;
  350. }
  351. return false;
  352. }
  353. // spellcheck and draggable are numerated attrs, however their
  354. // corresponding DOM properties are actually booleans - this leads to
  355. // setting it with a string "false" value leading it to be coerced to
  356. // `true`, so we need to always treat them as attributes.
  357. // Note that `contentEditable` doesn't have this problem: its DOM
  358. // property is also enumerated string values.
  359. if (key === 'spellcheck' || key === 'draggable') {
  360. return false;
  361. }
  362. // #1787 form as an attribute must be a string, while it accepts an Element as
  363. // a prop
  364. if (key === 'form' && typeof value === 'string') {
  365. return false;
  366. }
  367. // #1526 <input list> must be set as attribute
  368. if (key === 'list' && el.tagName === 'INPUT') {
  369. return false;
  370. }
  371. // native onclick with string value, must be set as attribute
  372. if (nativeOnRE.test(key) && shared.isString(value)) {
  373. return false;
  374. }
  375. return key in el;
  376. }
  377. function useCssModule(name = '$style') {
  378. /* istanbul ignore else */
  379. {
  380. const instance = runtimeCore.getCurrentInstance();
  381. if (!instance) {
  382. return shared.EMPTY_OBJ;
  383. }
  384. const modules = instance.type.__cssModules;
  385. if (!modules) {
  386. return shared.EMPTY_OBJ;
  387. }
  388. const mod = modules[name];
  389. if (!mod) {
  390. return shared.EMPTY_OBJ;
  391. }
  392. return mod;
  393. }
  394. }
  395. function useCssVars(getter, scoped = false) {
  396. const instance = runtimeCore.getCurrentInstance();
  397. /* istanbul ignore next */
  398. if (!instance) {
  399. return;
  400. }
  401. const prefix = scoped && instance.type.__scopeId
  402. ? `${instance.type.__scopeId.replace(/^data-v-/, '')}-`
  403. : ``;
  404. const setVars = () => setVarsOnVNode(instance.subTree, getter(instance.proxy), prefix);
  405. runtimeCore.onMounted(() => runtimeCore.watchEffect(setVars));
  406. runtimeCore.onUpdated(setVars);
  407. }
  408. function setVarsOnVNode(vnode, vars, prefix) {
  409. if ( vnode.shapeFlag & 128 /* SUSPENSE */) {
  410. const suspense = vnode.suspense;
  411. vnode = suspense.activeBranch;
  412. if (suspense.pendingBranch && !suspense.isHydrating) {
  413. suspense.effects.push(() => {
  414. setVarsOnVNode(suspense.activeBranch, vars, prefix);
  415. });
  416. }
  417. }
  418. // drill down HOCs until it's a non-component vnode
  419. while (vnode.component) {
  420. vnode = vnode.component.subTree;
  421. }
  422. if (vnode.shapeFlag & 1 /* ELEMENT */ && vnode.el) {
  423. const style = vnode.el.style;
  424. for (const key in vars) {
  425. style.setProperty(`--${prefix}${key}`, runtimeCore.unref(vars[key]));
  426. }
  427. }
  428. else if (vnode.type === runtimeCore.Fragment) {
  429. vnode.children.forEach(c => setVarsOnVNode(c, vars, prefix));
  430. }
  431. }
  432. const TRANSITION = 'transition';
  433. const ANIMATION = 'animation';
  434. // DOM Transition is a higher-order-component based on the platform-agnostic
  435. // base Transition component, with DOM-specific logic.
  436. const Transition = (props, { slots }) => runtimeCore.h(runtimeCore.BaseTransition, resolveTransitionProps(props), slots);
  437. Transition.displayName = 'Transition';
  438. const DOMTransitionPropsValidators = {
  439. name: String,
  440. type: String,
  441. css: {
  442. type: Boolean,
  443. default: true
  444. },
  445. duration: [String, Number, Object],
  446. enterFromClass: String,
  447. enterActiveClass: String,
  448. enterToClass: String,
  449. appearFromClass: String,
  450. appearActiveClass: String,
  451. appearToClass: String,
  452. leaveFromClass: String,
  453. leaveActiveClass: String,
  454. leaveToClass: String
  455. };
  456. const TransitionPropsValidators = (Transition.props = /*#__PURE__*/ shared.extend({}, runtimeCore.BaseTransition.props, DOMTransitionPropsValidators));
  457. function resolveTransitionProps(rawProps) {
  458. let { name = 'v', type, css = true, 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;
  459. const baseProps = {};
  460. for (const key in rawProps) {
  461. if (!(key in DOMTransitionPropsValidators)) {
  462. baseProps[key] = rawProps[key];
  463. }
  464. }
  465. if (!css) {
  466. return baseProps;
  467. }
  468. const durations = normalizeDuration(duration);
  469. const enterDuration = durations && durations[0];
  470. const leaveDuration = durations && durations[1];
  471. const { onBeforeEnter, onEnter, onEnterCancelled, onLeave, onLeaveCancelled, onBeforeAppear = onBeforeEnter, onAppear = onEnter, onAppearCancelled = onEnterCancelled } = baseProps;
  472. const finishEnter = (el, isAppear, done) => {
  473. removeTransitionClass(el, isAppear ? appearToClass : enterToClass);
  474. removeTransitionClass(el, isAppear ? appearActiveClass : enterActiveClass);
  475. done && done();
  476. };
  477. const finishLeave = (el, done) => {
  478. removeTransitionClass(el, leaveToClass);
  479. removeTransitionClass(el, leaveActiveClass);
  480. done && done();
  481. };
  482. const makeEnterHook = (isAppear) => {
  483. return (el, done) => {
  484. const hook = isAppear ? onAppear : onEnter;
  485. const resolve = () => finishEnter(el, isAppear, done);
  486. hook && hook(el, resolve);
  487. nextFrame(() => {
  488. removeTransitionClass(el, isAppear ? appearFromClass : enterFromClass);
  489. addTransitionClass(el, isAppear ? appearToClass : enterToClass);
  490. if (!(hook && hook.length > 1)) {
  491. if (enterDuration) {
  492. setTimeout(resolve, enterDuration);
  493. }
  494. else {
  495. whenTransitionEnds(el, type, resolve);
  496. }
  497. }
  498. });
  499. };
  500. };
  501. return shared.extend(baseProps, {
  502. onBeforeEnter(el) {
  503. onBeforeEnter && onBeforeEnter(el);
  504. addTransitionClass(el, enterActiveClass);
  505. addTransitionClass(el, enterFromClass);
  506. },
  507. onBeforeAppear(el) {
  508. onBeforeAppear && onBeforeAppear(el);
  509. addTransitionClass(el, appearActiveClass);
  510. addTransitionClass(el, appearFromClass);
  511. },
  512. onEnter: makeEnterHook(false),
  513. onAppear: makeEnterHook(true),
  514. onLeave(el, done) {
  515. const resolve = () => finishLeave(el, done);
  516. addTransitionClass(el, leaveActiveClass);
  517. addTransitionClass(el, leaveFromClass);
  518. nextFrame(() => {
  519. removeTransitionClass(el, leaveFromClass);
  520. addTransitionClass(el, leaveToClass);
  521. if (!(onLeave && onLeave.length > 1)) {
  522. if (leaveDuration) {
  523. setTimeout(resolve, leaveDuration);
  524. }
  525. else {
  526. whenTransitionEnds(el, type, resolve);
  527. }
  528. }
  529. });
  530. onLeave && onLeave(el, resolve);
  531. },
  532. onEnterCancelled(el) {
  533. finishEnter(el, false);
  534. onEnterCancelled && onEnterCancelled(el);
  535. },
  536. onAppearCancelled(el) {
  537. finishEnter(el, true);
  538. onAppearCancelled && onAppearCancelled(el);
  539. },
  540. onLeaveCancelled(el) {
  541. finishLeave(el);
  542. onLeaveCancelled && onLeaveCancelled(el);
  543. }
  544. });
  545. }
  546. function normalizeDuration(duration) {
  547. if (duration == null) {
  548. return null;
  549. }
  550. else if (shared.isObject(duration)) {
  551. return [NumberOf(duration.enter), NumberOf(duration.leave)];
  552. }
  553. else {
  554. const n = NumberOf(duration);
  555. return [n, n];
  556. }
  557. }
  558. function NumberOf(val) {
  559. const res = shared.toNumber(val);
  560. return res;
  561. }
  562. function addTransitionClass(el, cls) {
  563. cls.split(/\s+/).forEach(c => c && el.classList.add(c));
  564. (el._vtc ||
  565. (el._vtc = new Set())).add(cls);
  566. }
  567. function removeTransitionClass(el, cls) {
  568. cls.split(/\s+/).forEach(c => c && el.classList.remove(c));
  569. const { _vtc } = el;
  570. if (_vtc) {
  571. _vtc.delete(cls);
  572. if (!_vtc.size) {
  573. el._vtc = undefined;
  574. }
  575. }
  576. }
  577. function nextFrame(cb) {
  578. requestAnimationFrame(() => {
  579. requestAnimationFrame(cb);
  580. });
  581. }
  582. function whenTransitionEnds(el, expectedType, cb) {
  583. const { type, timeout, propCount } = getTransitionInfo(el, expectedType);
  584. if (!type) {
  585. return cb();
  586. }
  587. const endEvent = type + 'end';
  588. let ended = 0;
  589. const end = () => {
  590. el.removeEventListener(endEvent, onEnd);
  591. cb();
  592. };
  593. const onEnd = (e) => {
  594. if (e.target === el) {
  595. if (++ended >= propCount) {
  596. end();
  597. }
  598. }
  599. };
  600. setTimeout(() => {
  601. if (ended < propCount) {
  602. end();
  603. }
  604. }, timeout + 1);
  605. el.addEventListener(endEvent, onEnd);
  606. }
  607. function getTransitionInfo(el, expectedType) {
  608. const styles = window.getComputedStyle(el);
  609. // JSDOM may return undefined for transition properties
  610. const getStyleProperties = (key) => (styles[key] || '').split(', ');
  611. const transitionDelays = getStyleProperties(TRANSITION + 'Delay');
  612. const transitionDurations = getStyleProperties(TRANSITION + 'Duration');
  613. const transitionTimeout = getTimeout(transitionDelays, transitionDurations);
  614. const animationDelays = getStyleProperties(ANIMATION + 'Delay');
  615. const animationDurations = getStyleProperties(ANIMATION + 'Duration');
  616. const animationTimeout = getTimeout(animationDelays, animationDurations);
  617. let type = null;
  618. let timeout = 0;
  619. let propCount = 0;
  620. /* istanbul ignore if */
  621. if (expectedType === TRANSITION) {
  622. if (transitionTimeout > 0) {
  623. type = TRANSITION;
  624. timeout = transitionTimeout;
  625. propCount = transitionDurations.length;
  626. }
  627. }
  628. else if (expectedType === ANIMATION) {
  629. if (animationTimeout > 0) {
  630. type = ANIMATION;
  631. timeout = animationTimeout;
  632. propCount = animationDurations.length;
  633. }
  634. }
  635. else {
  636. timeout = Math.max(transitionTimeout, animationTimeout);
  637. type =
  638. timeout > 0
  639. ? transitionTimeout > animationTimeout
  640. ? TRANSITION
  641. : ANIMATION
  642. : null;
  643. propCount = type
  644. ? type === TRANSITION
  645. ? transitionDurations.length
  646. : animationDurations.length
  647. : 0;
  648. }
  649. const hasTransform = type === TRANSITION &&
  650. /\b(transform|all)(,|$)/.test(styles[TRANSITION + 'Property']);
  651. return {
  652. type,
  653. timeout,
  654. propCount,
  655. hasTransform
  656. };
  657. }
  658. function getTimeout(delays, durations) {
  659. while (delays.length < durations.length) {
  660. delays = delays.concat(delays);
  661. }
  662. return Math.max(...durations.map((d, i) => toMs(d) + toMs(delays[i])));
  663. }
  664. // Old versions of Chromium (below 61.0.3163.100) formats floating pointer
  665. // numbers in a locale-dependent way, using a comma instead of a dot.
  666. // If comma is not replaced with a dot, the input will be rounded down
  667. // (i.e. acting as a floor function) causing unexpected behaviors
  668. function toMs(s) {
  669. return Number(s.slice(0, -1).replace(',', '.')) * 1000;
  670. }
  671. function toRaw(observed) {
  672. return ((observed && toRaw(observed["__v_raw" /* RAW */])) || observed);
  673. }
  674. const positionMap = new WeakMap();
  675. const newPositionMap = new WeakMap();
  676. const TransitionGroupImpl = {
  677. name: 'TransitionGroup',
  678. props: /*#__PURE__*/ shared.extend({}, TransitionPropsValidators, {
  679. tag: String,
  680. moveClass: String
  681. }),
  682. setup(props, { slots }) {
  683. const instance = runtimeCore.getCurrentInstance();
  684. const state = runtimeCore.useTransitionState();
  685. let prevChildren;
  686. let children;
  687. runtimeCore.onUpdated(() => {
  688. // children is guaranteed to exist after initial render
  689. if (!prevChildren.length) {
  690. return;
  691. }
  692. const moveClass = props.moveClass || `${props.name || 'v'}-move`;
  693. if (!hasCSSTransform(prevChildren[0].el, instance.vnode.el, moveClass)) {
  694. return;
  695. }
  696. // we divide the work into three loops to avoid mixing DOM reads and writes
  697. // in each iteration - which helps prevent layout thrashing.
  698. prevChildren.forEach(callPendingCbs);
  699. prevChildren.forEach(recordPosition);
  700. const movedChildren = prevChildren.filter(applyTranslation);
  701. // force reflow to put everything in position
  702. forceReflow();
  703. movedChildren.forEach(c => {
  704. const el = c.el;
  705. const style = el.style;
  706. addTransitionClass(el, moveClass);
  707. style.transform = style.webkitTransform = style.transitionDuration = '';
  708. const cb = (el._moveCb = (e) => {
  709. if (e && e.target !== el) {
  710. return;
  711. }
  712. if (!e || /transform$/.test(e.propertyName)) {
  713. el.removeEventListener('transitionend', cb);
  714. el._moveCb = null;
  715. removeTransitionClass(el, moveClass);
  716. }
  717. });
  718. el.addEventListener('transitionend', cb);
  719. });
  720. });
  721. return () => {
  722. const rawProps = toRaw(props);
  723. const cssTransitionProps = resolveTransitionProps(rawProps);
  724. const tag = rawProps.tag || runtimeCore.Fragment;
  725. prevChildren = children;
  726. children = slots.default ? runtimeCore.getTransitionRawChildren(slots.default()) : [];
  727. for (let i = 0; i < children.length; i++) {
  728. const child = children[i];
  729. if (child.key != null) {
  730. runtimeCore.setTransitionHooks(child, runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance));
  731. }
  732. }
  733. if (prevChildren) {
  734. for (let i = 0; i < prevChildren.length; i++) {
  735. const child = prevChildren[i];
  736. runtimeCore.setTransitionHooks(child, runtimeCore.resolveTransitionHooks(child, cssTransitionProps, state, instance));
  737. positionMap.set(child, child.el.getBoundingClientRect());
  738. }
  739. }
  740. return runtimeCore.createVNode(tag, null, children);
  741. };
  742. }
  743. };
  744. const TransitionGroup = TransitionGroupImpl;
  745. function callPendingCbs(c) {
  746. const el = c.el;
  747. if (el._moveCb) {
  748. el._moveCb();
  749. }
  750. if (el._enterCb) {
  751. el._enterCb();
  752. }
  753. }
  754. function recordPosition(c) {
  755. newPositionMap.set(c, c.el.getBoundingClientRect());
  756. }
  757. function applyTranslation(c) {
  758. const oldPos = positionMap.get(c);
  759. const newPos = newPositionMap.get(c);
  760. const dx = oldPos.left - newPos.left;
  761. const dy = oldPos.top - newPos.top;
  762. if (dx || dy) {
  763. const s = c.el.style;
  764. s.transform = s.webkitTransform = `translate(${dx}px,${dy}px)`;
  765. s.transitionDuration = '0s';
  766. return c;
  767. }
  768. }
  769. // this is put in a dedicated function to avoid the line from being treeshaken
  770. function forceReflow() {
  771. return document.body.offsetHeight;
  772. }
  773. function hasCSSTransform(el, root, moveClass) {
  774. // Detect whether an element with the move class applied has
  775. // CSS transitions. Since the element may be inside an entering
  776. // transition at this very moment, we make a clone of it and remove
  777. // all other transition classes applied to ensure only the move class
  778. // is applied.
  779. const clone = el.cloneNode();
  780. if (el._vtc) {
  781. el._vtc.forEach(cls => {
  782. cls.split(/\s+/).forEach(c => c && clone.classList.remove(c));
  783. });
  784. }
  785. moveClass.split(/\s+/).forEach(c => c && clone.classList.add(c));
  786. clone.style.display = 'none';
  787. const container = (root.nodeType === 1
  788. ? root
  789. : root.parentNode);
  790. container.appendChild(clone);
  791. const { hasTransform } = getTransitionInfo(clone);
  792. container.removeChild(clone);
  793. return hasTransform;
  794. }
  795. const getModelAssigner = (vnode) => {
  796. const fn = vnode.props['onUpdate:modelValue'];
  797. return shared.isArray(fn) ? value => shared.invokeArrayFns(fn, value) : fn;
  798. };
  799. function onCompositionStart(e) {
  800. e.target.composing = true;
  801. }
  802. function onCompositionEnd(e) {
  803. const target = e.target;
  804. if (target.composing) {
  805. target.composing = false;
  806. trigger(target, 'input');
  807. }
  808. }
  809. function trigger(el, type) {
  810. const e = document.createEvent('HTMLEvents');
  811. e.initEvent(type, true, true);
  812. el.dispatchEvent(e);
  813. }
  814. // We are exporting the v-model runtime directly as vnode hooks so that it can
  815. // be tree-shaken in case v-model is never used.
  816. const vModelText = {
  817. created(el, { modifiers: { lazy, trim, number } }, vnode) {
  818. el._assign = getModelAssigner(vnode);
  819. const castToNumber = number || el.type === 'number';
  820. addEventListener(el, lazy ? 'change' : 'input', e => {
  821. if (e.target.composing)
  822. return;
  823. let domValue = el.value;
  824. if (trim) {
  825. domValue = domValue.trim();
  826. }
  827. else if (castToNumber) {
  828. domValue = shared.toNumber(domValue);
  829. }
  830. el._assign(domValue);
  831. });
  832. if (trim) {
  833. addEventListener(el, 'change', () => {
  834. el.value = el.value.trim();
  835. });
  836. }
  837. if (!lazy) {
  838. addEventListener(el, 'compositionstart', onCompositionStart);
  839. addEventListener(el, 'compositionend', onCompositionEnd);
  840. // Safari < 10.2 & UIWebView doesn't fire compositionend when
  841. // switching focus before confirming composition choice
  842. // this also fixes the issue where some browsers e.g. iOS Chrome
  843. // fires "change" instead of "input" on autocomplete.
  844. addEventListener(el, 'change', onCompositionEnd);
  845. }
  846. },
  847. // set value on mounted so it's after min/max for type="range"
  848. mounted(el, { value }) {
  849. el.value = value == null ? '' : value;
  850. },
  851. beforeUpdate(el, { value, modifiers: { trim, number } }, vnode) {
  852. el._assign = getModelAssigner(vnode);
  853. // avoid clearing unresolved text. #2302
  854. if (el.composing)
  855. return;
  856. if (document.activeElement === el) {
  857. if (trim && el.value.trim() === value) {
  858. return;
  859. }
  860. if ((number || el.type === 'number') && shared.toNumber(el.value) === value) {
  861. return;
  862. }
  863. }
  864. const newValue = value == null ? '' : value;
  865. if (el.value !== newValue) {
  866. el.value = newValue;
  867. }
  868. }
  869. };
  870. const vModelCheckbox = {
  871. created(el, binding, vnode) {
  872. setChecked(el, binding, vnode);
  873. el._assign = getModelAssigner(vnode);
  874. addEventListener(el, 'change', () => {
  875. const modelValue = el._modelValue;
  876. const elementValue = getValue(el);
  877. const checked = el.checked;
  878. const assign = el._assign;
  879. if (shared.isArray(modelValue)) {
  880. const index = shared.looseIndexOf(modelValue, elementValue);
  881. const found = index !== -1;
  882. if (checked && !found) {
  883. assign(modelValue.concat(elementValue));
  884. }
  885. else if (!checked && found) {
  886. const filtered = [...modelValue];
  887. filtered.splice(index, 1);
  888. assign(filtered);
  889. }
  890. }
  891. else if (shared.isSet(modelValue)) {
  892. if (checked) {
  893. modelValue.add(elementValue);
  894. }
  895. else {
  896. modelValue.delete(elementValue);
  897. }
  898. }
  899. else {
  900. assign(getCheckboxValue(el, checked));
  901. }
  902. });
  903. },
  904. beforeUpdate(el, binding, vnode) {
  905. el._assign = getModelAssigner(vnode);
  906. setChecked(el, binding, vnode);
  907. }
  908. };
  909. function setChecked(el, { value, oldValue }, vnode) {
  910. el._modelValue = value;
  911. if (shared.isArray(value)) {
  912. el.checked = shared.looseIndexOf(value, vnode.props.value) > -1;
  913. }
  914. else if (shared.isSet(value)) {
  915. el.checked = value.has(vnode.props.value);
  916. }
  917. else if (value !== oldValue) {
  918. el.checked = shared.looseEqual(value, getCheckboxValue(el, true));
  919. }
  920. }
  921. const vModelRadio = {
  922. created(el, { value }, vnode) {
  923. el.checked = shared.looseEqual(value, vnode.props.value);
  924. el._assign = getModelAssigner(vnode);
  925. addEventListener(el, 'change', () => {
  926. el._assign(getValue(el));
  927. });
  928. },
  929. beforeUpdate(el, { value, oldValue }, vnode) {
  930. el._assign = getModelAssigner(vnode);
  931. if (value !== oldValue) {
  932. el.checked = shared.looseEqual(value, vnode.props.value);
  933. }
  934. }
  935. };
  936. const vModelSelect = {
  937. created(el, { modifiers: { number } }, vnode) {
  938. addEventListener(el, 'change', () => {
  939. const selectedVal = Array.prototype.filter
  940. .call(el.options, (o) => o.selected)
  941. .map((o) => number ? shared.toNumber(getValue(o)) : getValue(o));
  942. el._assign(el.multiple ? selectedVal : selectedVal[0]);
  943. });
  944. el._assign = getModelAssigner(vnode);
  945. },
  946. // set value in mounted & updated because <select> relies on its children
  947. // <option>s.
  948. mounted(el, { value }) {
  949. setSelected(el, value);
  950. },
  951. beforeUpdate(el, _binding, vnode) {
  952. el._assign = getModelAssigner(vnode);
  953. },
  954. updated(el, { value }) {
  955. setSelected(el, value);
  956. }
  957. };
  958. function setSelected(el, value) {
  959. const isMultiple = el.multiple;
  960. if (isMultiple && !shared.isArray(value) && !shared.isSet(value)) {
  961. return;
  962. }
  963. for (let i = 0, l = el.options.length; i < l; i++) {
  964. const option = el.options[i];
  965. const optionValue = getValue(option);
  966. if (isMultiple) {
  967. if (shared.isArray(value)) {
  968. option.selected = shared.looseIndexOf(value, optionValue) > -1;
  969. }
  970. else {
  971. option.selected = value.has(optionValue);
  972. }
  973. }
  974. else {
  975. if (shared.looseEqual(getValue(option), value)) {
  976. el.selectedIndex = i;
  977. return;
  978. }
  979. }
  980. }
  981. if (!isMultiple) {
  982. el.selectedIndex = -1;
  983. }
  984. }
  985. // retrieve raw value set via :value bindings
  986. function getValue(el) {
  987. return '_value' in el ? el._value : el.value;
  988. }
  989. // retrieve raw value for true-value and false-value set via :true-value or :false-value bindings
  990. function getCheckboxValue(el, checked) {
  991. const key = checked ? '_trueValue' : '_falseValue';
  992. return key in el ? el[key] : checked;
  993. }
  994. const vModelDynamic = {
  995. created(el, binding, vnode) {
  996. callModelHook(el, binding, vnode, null, 'created');
  997. },
  998. mounted(el, binding, vnode) {
  999. callModelHook(el, binding, vnode, null, 'mounted');
  1000. },
  1001. beforeUpdate(el, binding, vnode, prevVNode) {
  1002. callModelHook(el, binding, vnode, prevVNode, 'beforeUpdate');
  1003. },
  1004. updated(el, binding, vnode, prevVNode) {
  1005. callModelHook(el, binding, vnode, prevVNode, 'updated');
  1006. }
  1007. };
  1008. function callModelHook(el, binding, vnode, prevVNode, hook) {
  1009. let modelToUse;
  1010. switch (el.tagName) {
  1011. case 'SELECT':
  1012. modelToUse = vModelSelect;
  1013. break;
  1014. case 'TEXTAREA':
  1015. modelToUse = vModelText;
  1016. break;
  1017. default:
  1018. switch (vnode.props && vnode.props.type) {
  1019. case 'checkbox':
  1020. modelToUse = vModelCheckbox;
  1021. break;
  1022. case 'radio':
  1023. modelToUse = vModelRadio;
  1024. break;
  1025. default:
  1026. modelToUse = vModelText;
  1027. }
  1028. }
  1029. const fn = modelToUse[hook];
  1030. fn && fn(el, binding, vnode, prevVNode);
  1031. }
  1032. // SSR vnode transforms
  1033. {
  1034. vModelText.getSSRProps = ({ value }) => ({ value });
  1035. vModelRadio.getSSRProps = ({ value }, vnode) => {
  1036. if (vnode.props && shared.looseEqual(vnode.props.value, value)) {
  1037. return { checked: true };
  1038. }
  1039. };
  1040. vModelCheckbox.getSSRProps = ({ value }, vnode) => {
  1041. if (shared.isArray(value)) {
  1042. if (vnode.props && shared.looseIndexOf(value, vnode.props.value) > -1) {
  1043. return { checked: true };
  1044. }
  1045. }
  1046. else if (shared.isSet(value)) {
  1047. if (vnode.props && value.has(vnode.props.value)) {
  1048. return { checked: true };
  1049. }
  1050. }
  1051. else if (value) {
  1052. return { checked: true };
  1053. }
  1054. };
  1055. }
  1056. const systemModifiers = ['ctrl', 'shift', 'alt', 'meta'];
  1057. const modifierGuards = {
  1058. stop: e => e.stopPropagation(),
  1059. prevent: e => e.preventDefault(),
  1060. self: e => e.target !== e.currentTarget,
  1061. ctrl: e => !e.ctrlKey,
  1062. shift: e => !e.shiftKey,
  1063. alt: e => !e.altKey,
  1064. meta: e => !e.metaKey,
  1065. left: e => 'button' in e && e.button !== 0,
  1066. middle: e => 'button' in e && e.button !== 1,
  1067. right: e => 'button' in e && e.button !== 2,
  1068. exact: (e, modifiers) => systemModifiers.some(m => e[`${m}Key`] && !modifiers.includes(m))
  1069. };
  1070. /**
  1071. * @private
  1072. */
  1073. const withModifiers = (fn, modifiers) => {
  1074. return (event, ...args) => {
  1075. for (let i = 0; i < modifiers.length; i++) {
  1076. const guard = modifierGuards[modifiers[i]];
  1077. if (guard && guard(event, modifiers))
  1078. return;
  1079. }
  1080. return fn(event, ...args);
  1081. };
  1082. };
  1083. // Kept for 2.x compat.
  1084. // Note: IE11 compat for `spacebar` and `del` is removed for now.
  1085. const keyNames = {
  1086. esc: 'escape',
  1087. space: ' ',
  1088. up: 'arrow-up',
  1089. left: 'arrow-left',
  1090. right: 'arrow-right',
  1091. down: 'arrow-down',
  1092. delete: 'backspace'
  1093. };
  1094. /**
  1095. * @private
  1096. */
  1097. const withKeys = (fn, modifiers) => {
  1098. return (event) => {
  1099. if (!('key' in event))
  1100. return;
  1101. const eventKey = shared.hyphenate(event.key);
  1102. if (
  1103. // None of the provided key modifiers match the current event key
  1104. !modifiers.some(k => k === eventKey || keyNames[k] === eventKey)) {
  1105. return;
  1106. }
  1107. return fn(event);
  1108. };
  1109. };
  1110. const vShow = {
  1111. beforeMount(el, { value }, { transition }) {
  1112. el._vod = el.style.display === 'none' ? '' : el.style.display;
  1113. if (transition && value) {
  1114. transition.beforeEnter(el);
  1115. }
  1116. else {
  1117. setDisplay(el, value);
  1118. }
  1119. },
  1120. mounted(el, { value }, { transition }) {
  1121. if (transition && value) {
  1122. transition.enter(el);
  1123. }
  1124. },
  1125. updated(el, { value, oldValue }, { transition }) {
  1126. if (!value === !oldValue)
  1127. return;
  1128. if (transition) {
  1129. if (value) {
  1130. transition.beforeEnter(el);
  1131. setDisplay(el, true);
  1132. transition.enter(el);
  1133. }
  1134. else {
  1135. transition.leave(el, () => {
  1136. setDisplay(el, false);
  1137. });
  1138. }
  1139. }
  1140. else {
  1141. setDisplay(el, value);
  1142. }
  1143. },
  1144. beforeUnmount(el, { value }) {
  1145. setDisplay(el, value);
  1146. }
  1147. };
  1148. {
  1149. vShow.getSSRProps = ({ value }) => {
  1150. if (!value) {
  1151. return { style: { display: 'none' } };
  1152. }
  1153. };
  1154. }
  1155. function setDisplay(el, value) {
  1156. el.style.display = value ? el._vod : 'none';
  1157. }
  1158. const rendererOptions = shared.extend({ patchProp, forcePatchProp }, nodeOps);
  1159. // lazy create the renderer - this makes core renderer logic tree-shakable
  1160. // in case the user only imports reactivity utilities from Vue.
  1161. let renderer;
  1162. let enabledHydration = false;
  1163. function ensureRenderer() {
  1164. return renderer || (renderer = runtimeCore.createRenderer(rendererOptions));
  1165. }
  1166. function ensureHydrationRenderer() {
  1167. renderer = enabledHydration
  1168. ? renderer
  1169. : runtimeCore.createHydrationRenderer(rendererOptions);
  1170. enabledHydration = true;
  1171. return renderer;
  1172. }
  1173. // use explicit type casts here to avoid import() calls in rolled-up d.ts
  1174. const render = ((...args) => {
  1175. ensureRenderer().render(...args);
  1176. });
  1177. const hydrate = ((...args) => {
  1178. ensureHydrationRenderer().hydrate(...args);
  1179. });
  1180. const createApp = ((...args) => {
  1181. const app = ensureRenderer().createApp(...args);
  1182. const { mount } = app;
  1183. app.mount = (containerOrSelector) => {
  1184. const container = normalizeContainer(containerOrSelector);
  1185. if (!container)
  1186. return;
  1187. const component = app._component;
  1188. if (!shared.isFunction(component) && !component.render && !component.template) {
  1189. component.template = container.innerHTML;
  1190. }
  1191. // clear content before mounting
  1192. container.innerHTML = '';
  1193. const proxy = mount(container);
  1194. container.removeAttribute('v-cloak');
  1195. container.setAttribute('data-v-app', '');
  1196. return proxy;
  1197. };
  1198. return app;
  1199. });
  1200. const createSSRApp = ((...args) => {
  1201. const app = ensureHydrationRenderer().createApp(...args);
  1202. const { mount } = app;
  1203. app.mount = (containerOrSelector) => {
  1204. const container = normalizeContainer(containerOrSelector);
  1205. if (container) {
  1206. return mount(container, true);
  1207. }
  1208. };
  1209. return app;
  1210. });
  1211. function normalizeContainer(container) {
  1212. if (shared.isString(container)) {
  1213. const res = document.querySelector(container);
  1214. return res;
  1215. }
  1216. return container;
  1217. }
  1218. Object.keys(runtimeCore).forEach(function (k) {
  1219. if (k !== 'default') exports[k] = runtimeCore[k];
  1220. });
  1221. exports.Transition = Transition;
  1222. exports.TransitionGroup = TransitionGroup;
  1223. exports.createApp = createApp;
  1224. exports.createSSRApp = createSSRApp;
  1225. exports.hydrate = hydrate;
  1226. exports.render = render;
  1227. exports.useCssModule = useCssModule;
  1228. exports.useCssVars = useCssVars;
  1229. exports.vModelCheckbox = vModelCheckbox;
  1230. exports.vModelDynamic = vModelDynamic;
  1231. exports.vModelRadio = vModelRadio;
  1232. exports.vModelSelect = vModelSelect;
  1233. exports.vModelText = vModelText;
  1234. exports.vShow = vShow;
  1235. exports.withKeys = withKeys;
  1236. exports.withModifiers = withModifiers;