runtime-dom.cjs.prod.js 53 KB

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