How to use devtoolsComponentEmit method in Playwright Internal

Best JavaScript code snippet using playwright-internal

Run Playwright Internal automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

emit.js

Source: emit.js Github

copy
1function emit(instance, event, ...args) {
2    const props = instance.vnode.props || EMPTY_OBJ;
3    {
4        const { emitsOptions, propsOptions: [propsOptions] } = instance;
5        if (emitsOptions) {
6            if (!(event in emitsOptions)) {
7                if (!propsOptions || !(`on` + capitalize(event) in propsOptions)) {
8                    warn(`Component emitted event "${event}" but it is neither declared in ` +
9                        `the emits option nor as an "on${capitalize(event)}" prop.`);
10                }
11            }
12            else {
13                const validator = emitsOptions[event];
14                if (isFunction(validator)) {
15                    const isValid = validator(...args);
16                    if (!isValid) {
17                        warn(`Invalid event arguments: event validation failed for event "${event}".`);
18                    }
19                }
20            }
21        }
22    }
23    {
24        devtoolsComponentEmit(instance, event, args);
25    }
26    let handlerName = `on${capitalize(event)}`;
27    let handler = props[handlerName];
28    // for v-model update:xxx events, also trigger kebab-case equivalent
29    // for props passed via kebab-case
30    if (!handler && event.startsWith('update:')) {
31        handlerName = `on${capitalize(hyphenate(event))}`;
32        handler = props[handlerName];
33    }
34    if (!handler) {
35        handler = props[handlerName + `Once`];
36        if (!instance.emitted) {
37            (instance.emitted = {})[handlerName] = true;
38        }
39        else if (instance.emitted[handlerName]) {
40            return;
41        }
42    }
43    if (handler) {
44        callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
45    }
46}
47
48// emitOption
49
50const instance = {
51    uid: uid$2++,
52    // ...
53    // resolved props and emits options
54    propsOptions: normalizePropsOptions(type, appContext),
55    emitsOptions: normalizeEmitsOptions(type, appContext)
56    // ...
57}
58
59function normalizeEmitsOptions(comp, appContext, asMixin = false) {
60    const appId = appContext.app ? appContext.app._uid : -1;
61    const cache = comp.__emits || (comp.__emits = {});
62    const cached = cache[appId];
63    if (cached !== undefined) {
64        return cached;
65    }
66    const raw = comp.emits;
67    let normalized = {};
68    // apply mixin/extends props
69    let hasExtends = false;
70    if ( !isFunction(comp)) {
71        const extendEmits = (raw) => {
72            hasExtends = true;
73            extend(normalized, normalizeEmitsOptions(raw, appContext, true));
74        };
75        if (!asMixin && appContext.mixins.length) {
76            appContext.mixins.forEach(extendEmits);
77        }
78        if (comp.extends) {
79            extendEmits(comp.extends);
80        }
81        if (comp.mixins) {
82            comp.mixins.forEach(extendEmits);
83        }
84    }
85    if (!raw && !hasExtends) {
86        return (cache[appId] = null);
87    }
88    if (isArray(raw)) {
89        raw.forEach(key => (normalized[key] = null));
90    }
91    else {
92        extend(normalized, raw);
93    }
94    return (cache[appId] = normalized);
95}
96
Full Screen

vue3.js

Source: vue3.js Github

copy
1var Vue = (function (exports) {
2  'use strict';
3
4  /**
5   * Make a map and return a function for checking if a key
6   * is in that map.
7   * IMPORTANT: all calls of this function must be prefixed with
8   * \/\*#\_\_PURE\_\_\*\/
9   * So that rollup can tree-shake them if necessary.
10   */
11  function makeMap(str, expectsLowerCase) {
12      const map = Object.create(null);
13      const list = str.split(',');
14      for (let i = 0; i < list.length; i++) {
15          map[list[i]] = true;
16      }
17      return expectsLowerCase ? val => !!map[val.toLowerCase()] : val => !!map[val];
18  }
19
20  // Patch flags are optimization hints generated by the compiler.
21  // when a block with dynamicChildren is encountered during diff, the algorithm
22  // enters "optimized mode". In this mode, we know that the vdom is produced by
23  // a render function generated by the compiler, so the algorithm only needs to
24  // handle updates explicitly marked by these patch flags.
25  // dev only flag -> name mapping
26  const PatchFlagNames = {
27      [1 /* TEXT */]: `TEXT`,
28      [2 /* CLASS */]: `CLASS`,
29      [4 /* STYLE */]: `STYLE`,
30      [8 /* PROPS */]: `PROPS`,
31      [16 /* FULL_PROPS */]: `FULL_PROPS`,
32      [32 /* HYDRATE_EVENTS */]: `HYDRATE_EVENTS`,
33      [64 /* STABLE_FRAGMENT */]: `STABLE_FRAGMENT`,
34      [128 /* KEYED_FRAGMENT */]: `KEYED_FRAGMENT`,
35      [256 /* UNKEYED_FRAGMENT */]: `UNKEYED_FRAGMENT`,
36      [1024 /* DYNAMIC_SLOTS */]: `DYNAMIC_SLOTS`,
37      [512 /* NEED_PATCH */]: `NEED_PATCH`,
38      [-1 /* HOISTED */]: `HOISTED`,
39      [-2 /* BAIL */]: `BAIL`
40  };
41
42  const GLOBALS_WHITE_LISTED = 'Infinity,undefined,NaN,isFinite,isNaN,parseFloat,parseInt,decodeURI,' +
43      'decodeURIComponent,encodeURI,encodeURIComponent,Math,Number,Date,Array,' +
44      'Object,Boolean,String,RegExp,Map,Set,JSON,Intl';
45  const isGloballyWhitelisted = /*#__PURE__*/ makeMap(GLOBALS_WHITE_LISTED);
46
47  const range = 2;
48  function generateCodeFrame(source, start = 0, end = source.length) {
49      const lines = source.split(/\r?\n/);
50      let count = 0;
51      const res = [];
52      for (let i = 0; i < lines.length; i++) {
53          count += lines[i].length + 1;
54          if (count >= start) {
55              for (let j = i - range; j <= i + range || end > count; j++) {
56                  if (j < 0 || j >= lines.length)
57                      continue;
58                  const line = j + 1;
59                  res.push(`${line}${' '.repeat(Math.max(3 - String(line).length, 0))}|  ${lines[j]}`);
60                  const lineLength = lines[j].length;
61                  if (j === i) {
62                      // push underline
63                      const pad = start - (count - lineLength) + 1;
64                      const length = Math.max(1, end > count ? lineLength - pad : end - start);
65                      res.push(`   |  ` + ' '.repeat(pad) + '^'.repeat(length));
66                  }
67                  else if (j > i) {
68                      if (end > count) {
69                          const length = Math.max(Math.min(end - count, lineLength), 1);
70                          res.push(`   |  ` + '^'.repeat(length));
71                      }
72                      count += lineLength + 1;
73                  }
74              }
75              break;
76          }
77      }
78      return res.join('\n');
79  }
80
81  /**
82   * On the client we only need to offer special cases for boolean attributes that
83   * have different names from their corresponding dom properties:
84   * - itemscope -> N/A
85   * - allowfullscreen -> allowFullscreen
86   * - formnovalidate -> formNoValidate
87   * - ismap -> isMap
88   * - nomodule -> noModule
89   * - novalidate -> noValidate
90   * - readonly -> readOnly
91   */
92  const specialBooleanAttrs = `itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly`;
93  const isSpecialBooleanAttr = /*#__PURE__*/ makeMap(specialBooleanAttrs);
94
95  function normalizeStyle(value) {
96      if (isArray(value)) {
97          const res = {};
98          for (let i = 0; i < value.length; i++) {
99              const item = value[i];
100              const normalized = normalizeStyle(isString(item) ? parseStringStyle(item) : item);
101              if (normalized) {
102                  for (const key in normalized) {
103                      res[key] = normalized[key];
104                  }
105              }
106          }
107          return res;
108      }
109      else if (isObject(value)) {
110          return value;
111      }
112  }
113  const listDelimiterRE = /;(?![^(]*\))/g;
114  const propertyDelimiterRE = /:(.+)/;
115  function parseStringStyle(cssText) {
116      const ret = {};
117      cssText.split(listDelimiterRE).forEach(item => {
118          if (item) {
119              const tmp = item.split(propertyDelimiterRE);
120              tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
121          }
122      });
123      return ret;
124  }
125  function normalizeClass(value) {
126      let res = '';
127      if (isString(value)) {
128          res = value;
129      }
130      else if (isArray(value)) {
131          for (let i = 0; i < value.length; i++) {
132              res += normalizeClass(value[i]) + ' ';
133          }
134      }
135      else if (isObject(value)) {
136          for (const name in value) {
137              if (value[name]) {
138                  res += name + ' ';
139              }
140          }
141      }
142      return res.trim();
143  }
144
145  // These tag configs are shared between compiler-dom and runtime-dom, so they
146  // https://developer.mozilla.org/en-US/docs/Web/HTML/Element
147  const HTML_TAGS = 'html,body,base,head,link,meta,style,title,address,article,aside,footer,' +
148      'header,h1,h2,h3,h4,h5,h6,hgroup,nav,section,div,dd,dl,dt,figcaption,' +
149      'figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,' +
150      'data,dfn,em,i,kbd,mark,q,rp,rt,rtc,ruby,s,samp,small,span,strong,sub,sup,' +
151      'time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,' +
152      'canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,' +
153      'th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,' +
154      'option,output,progress,select,textarea,details,dialog,menu,' +
155      'summary,template,blockquote,iframe,tfoot';
156  // https://developer.mozilla.org/en-US/docs/Web/SVG/Element
157  const SVG_TAGS = 'svg,animate,animateMotion,animateTransform,circle,clipPath,color-profile,' +
158      'defs,desc,discard,ellipse,feBlend,feColorMatrix,feComponentTransfer,' +
159      'feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,' +
160      'feDistanceLight,feDropShadow,feFlood,feFuncA,feFuncB,feFuncG,feFuncR,' +
161      'feGaussianBlur,feImage,feMerge,feMergeNode,feMorphology,feOffset,' +
162      'fePointLight,feSpecularLighting,feSpotLight,feTile,feTurbulence,filter,' +
163      'foreignObject,g,hatch,hatchpath,image,line,linearGradient,marker,mask,' +
164      'mesh,meshgradient,meshpatch,meshrow,metadata,mpath,path,pattern,' +
165      'polygon,polyline,radialGradient,rect,set,solidcolor,stop,switch,symbol,' +
166      'text,textPath,title,tspan,unknown,use,view';
167  const VOID_TAGS = 'area,base,br,col,embed,hr,img,input,link,meta,param,source,track,wbr';
168  const isHTMLTag = /*#__PURE__*/ makeMap(HTML_TAGS);
169  const isSVGTag = /*#__PURE__*/ makeMap(SVG_TAGS);
170  const isVoidTag = /*#__PURE__*/ makeMap(VOID_TAGS);
171
172  function looseCompareArrays(a, b) {
173      if (a.length !== b.length)
174          return false;
175      let equal = true;
176      for (let i = 0; equal && i < a.length; i++) {
177          equal = looseEqual(a[i], b[i]);
178      }
179      return equal;
180  }
181  function looseEqual(a, b) {
182      if (a === b)
183          return true;
184      let aValidType = isDate(a);
185      let bValidType = isDate(b);
186      if (aValidType || bValidType) {
187          return aValidType && bValidType ? a.getTime() === b.getTime() : false;
188      }
189      aValidType = isArray(a);
190      bValidType = isArray(b);
191      if (aValidType || bValidType) {
192          return aValidType && bValidType ? looseCompareArrays(a, b) : false;
193      }
194      aValidType = isObject(a);
195      bValidType = isObject(b);
196      if (aValidType || bValidType) {
197          /* istanbul ignore if: this if will probably never be called */
198          if (!aValidType || !bValidType) {
199              return false;
200          }
201          const aKeysCount = Object.keys(a).length;
202          const bKeysCount = Object.keys(b).length;
203          if (aKeysCount !== bKeysCount) {
204              return false;
205          }
206          for (const key in a) {
207              const aHasKey = a.hasOwnProperty(key);
208              const bHasKey = b.hasOwnProperty(key);
209              if ((aHasKey && !bHasKey) ||
210                  (!aHasKey && bHasKey) ||
211                  !looseEqual(a[key], b[key])) {
212                  return false;
213              }
214          }
215      }
216      return String(a) === String(b);
217  }
218  function looseIndexOf(arr, val) {
219      return arr.findIndex(item => looseEqual(item, val));
220  }
221
222  /**
223   * For converting {{ interpolation }} values to displayed strings.
224   * @private

225   */
226  const toDisplayString = (val) => {
227      return val == null
228          ? ''
229          : isObject(val)
230              ? JSON.stringify(val, replacer, 2)
231              : String(val);
232  };
233  const replacer = (_key, val) => {
234      if (isMap(val)) {
235          return {
236              [`Map(${val.size})`]: [...val.entries()].reduce((entries, [key, val]) => {
237                  entries[`${key} =>`] = val;
238                  return entries;
239              }, {})
240          };
241      }
242      else if (isSet(val)) {
243          return {
244              [`Set(${val.size})`]: [...val.values()]
245          };
246      }
247      else if (isObject(val) && !isArray(val) && !isPlainObject(val)) {
248          return String(val);
249      }
250      return val;
251  };
252
253  const EMPTY_OBJ =  Object.freeze({})
254      ;
255  const EMPTY_ARR =  Object.freeze([]) ;
256  const NOOP = () => { };
257  /**
258   * Always return false.
259   */
260  const NO = () => false;
261  const onRE = /^on[^a-z]/;
262  const isOn = (key) => onRE.test(key);
263  const isModelListener = (key) => key.startsWith('onUpdate:');
264  const extend = Object.assign;
265  const remove = (arr, el) => {
266      const i = arr.indexOf(el);
267      if (i > -1) {
268          arr.splice(i, 1);
269      }
270  };
271  const hasOwnProperty = Object.prototype.hasOwnProperty;
272  const hasOwn = (val, key) => hasOwnProperty.call(val, key);
273  const isArray = Array.isArray;
274  const isMap = (val) => toTypeString(val) === '[object Map]';
275  const isSet = (val) => toTypeString(val) === '[object Set]';
276  const isDate = (val) => val instanceof Date;
277  const isFunction = (val) => typeof val === 'function';
278  const isString = (val) => typeof val === 'string';
279  const isSymbol = (val) => typeof val === 'symbol';
280  const isObject = (val) => val !== null && typeof val === 'object';
281  const isPromise = (val) => {
282      return isObject(val) && isFunction(val.then) && isFunction(val.catch);
283  };
284  const objectToString = Object.prototype.toString;
285  const toTypeString = (value) => objectToString.call(value);
286  const toRawType = (value) => {
287      // extract "RawType" from strings like "[object RawType]"
288      return toTypeString(value).slice(8, -1);
289  };
290  const isPlainObject = (val) => toTypeString(val) === '[object Object]';
291  const isIntegerKey = (key) => isString(key) &&
292      key !== 'NaN' &&
293      key[0] !== '-' &&
294      '' + parseInt(key, 10) === key;
295  const isReservedProp = /*#__PURE__*/ makeMap(
296  // the leading comma is intentional so empty string "" is also included
297  ',key,ref,' +
298      'onVnodeBeforeMount,onVnodeMounted,' +
299      'onVnodeBeforeUpdate,onVnodeUpdated,' +
300      'onVnodeBeforeUnmount,onVnodeUnmounted');
301  const cacheStringFunction = (fn) => {
302      const cache = Object.create(null);
303      return ((str) => {
304          const hit = cache[str];
305          return hit || (cache[str] = fn(str));
306      });
307  };
308  const camelizeRE = /-(\w)/g;
309  /**
310   * @private

311   */
312  const camelize = cacheStringFunction((str) => {
313      return str.replace(camelizeRE, (_, c) => (c ? c.toUpperCase() : ''));
314  });
315  const hyphenateRE = /\B([A-Z])/g;
316  /**
317   * @private

318   */
319  const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, '-$1').toLowerCase());
320  /**
321   * @private

322   */
323  const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
324  /**
325   * @private

326   */
327  const toHandlerKey = cacheStringFunction((str) => (str ? `on${capitalize(str)}` : ``));
328  // compare whether a value has changed, accounting for NaN.
329  const hasChanged = (value, oldValue) => value !== oldValue && (value === value || oldValue === oldValue);
330  const invokeArrayFns = (fns, arg) => {
331      for (let i = 0; i < fns.length; i++) {
332          fns[i](arg);
333      }
334  };
335  const def = (obj, key, value) => {
336      Object.defineProperty(obj, key, {
337          configurable: true,
338          enumerable: false,
339          value
340      });
341  };
342  const toNumber = (val) => {
343      const n = parseFloat(val);
344      return isNaN(n) ? val : n;
345  };
346  let _globalThis;
347  const getGlobalThis = () => {
348      return (_globalThis ||
349          (_globalThis =
350              typeof globalThis !== 'undefined'
351                  ? globalThis
352                  : typeof self !== 'undefined'
353                      ? self
354                      : typeof window !== 'undefined'
355                          ? window
356                          : typeof global !== 'undefined'
357                              ? global
358                              : {}));
359  };
360
361  const targetMap = new WeakMap();
362  const effectStack = [];
363  let activeEffect;
364  const ITERATE_KEY = Symbol( 'iterate' );
365  const MAP_KEY_ITERATE_KEY = Symbol( 'Map key iterate' );
366  function isEffect(fn) {
367      return fn && fn._isEffect === true;
368  }
369  function effect(fn, options = EMPTY_OBJ) {
370      if (isEffect(fn)) {
371          fn = fn.raw;
372      }
373      const effect = createReactiveEffect(fn, options);
374      if (!options.lazy) {
375          effect();
376      }
377      return effect;
378  }
379  function stop(effect) {
380      if (effect.active) {
381          cleanup(effect);
382          if (effect.options.onStop) {
383              effect.options.onStop();
384          }
385          effect.active = false;
386      }
387  }
388  let uid = 0;
389  function createReactiveEffect(fn, options) {
390      const effect = function reactiveEffect() {
391          if (!effect.active) {
392              return options.scheduler ? undefined : fn();
393          }
394          if (!effectStack.includes(effect)) {
395              cleanup(effect);
396              try {
397                  enableTracking();
398                  effectStack.push(effect);
399                  activeEffect = effect;
400                  return fn();
401              }
402              finally {
403                  effectStack.pop();
404                  resetTracking();
405                  activeEffect = effectStack[effectStack.length - 1];
406              }
407          }
408      };
409      effect.id = uid++;
410      effect.allowRecurse = !!options.allowRecurse;
411      effect._isEffect = true;
412      effect.active = true;
413      effect.raw = fn;
414      effect.deps = [];
415      effect.options = options;
416      return effect;
417  }
418  function cleanup(effect) {
419      const { deps } = effect;
420      if (deps.length) {
421          for (let i = 0; i < deps.length; i++) {
422              deps[i].delete(effect);
423          }
424          deps.length = 0;
425      }
426  }
427  let shouldTrack = true;
428  const trackStack = [];
429  function pauseTracking() {
430      trackStack.push(shouldTrack);
431      shouldTrack = false;
432  }
433  function enableTracking() {
434      trackStack.push(shouldTrack);
435      shouldTrack = true;
436  }
437  function resetTracking() {
438      const last = trackStack.pop();
439      shouldTrack = last === undefined ? true : last;
440  }
441  function track(target, type, key) {
442      if (!shouldTrack || activeEffect === undefined) {
443          return;
444      }
445      let depsMap = targetMap.get(target);
446      if (!depsMap) {
447          targetMap.set(target, (depsMap = new Map()));
448      }
449      let dep = depsMap.get(key);
450      if (!dep) {
451          depsMap.set(key, (dep = new Set()));
452      }
453      if (!dep.has(activeEffect)) {
454          dep.add(activeEffect);
455          activeEffect.deps.push(dep);
456          if ( activeEffect.options.onTrack) {
457              activeEffect.options.onTrack({
458                  effect: activeEffect,
459                  target,
460                  type,
461                  key
462              });
463          }
464      }
465  }
466  function trigger(target, type, key, newValue, oldValue, oldTarget) {
467      const depsMap = targetMap.get(target);
468      if (!depsMap) {
469          // never been tracked
470          return;
471      }
472      const effects = new Set();
473      const add = (effectsToAdd) => {
474          if (effectsToAdd) {
475              effectsToAdd.forEach(effect => {
476                  if (effect !== activeEffect || effect.allowRecurse) {
477                      effects.add(effect);
478                  }
479              });
480          }
481      };
482      if (type === "clear" /* CLEAR */) {
483          // collection being cleared
484          // trigger all effects for target
485          depsMap.forEach(add);
486      }
487      else if (key === 'length' && isArray(target)) {
488          depsMap.forEach((dep, key) => {
489              if (key === 'length' || key >= newValue) {
490                  add(dep);
491              }
492          });
493      }
494      else {
495          // schedule runs for SET | ADD | DELETE
496          if (key !== void 0) {
497              add(depsMap.get(key));
498          }
499          // also run for iteration key on ADD | DELETE | Map.SET
500          switch (type) {
501              case "add" /* ADD */:
502                  if (!isArray(target)) {
503                      add(depsMap.get(ITERATE_KEY));
504                      if (isMap(target)) {
505                          add(depsMap.get(MAP_KEY_ITERATE_KEY));
506                      }
507                  }
508                  else if (isIntegerKey(key)) {
509                      // new index added to array -> length changes
510                      add(depsMap.get('length'));
511                  }
512                  break;
513              case "delete" /* DELETE */:
514                  if (!isArray(target)) {
515                      add(depsMap.get(ITERATE_KEY));
516                      if (isMap(target)) {
517                          add(depsMap.get(MAP_KEY_ITERATE_KEY));
518                      }
519                  }
520                  break;
521              case "set" /* SET */:
522                  if (isMap(target)) {
523                      add(depsMap.get(ITERATE_KEY));
524                  }
525                  break;
526          }
527      }
528      const run = (effect) => {
529          if ( effect.options.onTrigger) {
530              effect.options.onTrigger({
531                  effect,
532                  target,
533                  key,
534                  type,
535                  newValue,
536                  oldValue,
537                  oldTarget
538              });
539          }
540          if (effect.options.scheduler) {
541              effect.options.scheduler(effect);
542          }
543          else {
544              effect();
545          }
546      };
547      effects.forEach(run);
548  }
549
550  const builtInSymbols = new Set(Object.getOwnPropertyNames(Symbol)
551      .map(key => Symbol[key])
552      .filter(isSymbol));
553  const get = /*#__PURE__*/ createGetter();
554  const shallowGet = /*#__PURE__*/ createGetter(false, true);
555  const readonlyGet = /*#__PURE__*/ createGetter(true);
556  const shallowReadonlyGet = /*#__PURE__*/ createGetter(true, true);
557  const arrayInstrumentations = {};
558  ['includes', 'indexOf', 'lastIndexOf'].forEach(key => {
559      const method = Array.prototype[key];
560      arrayInstrumentations[key] = function (...args) {
561          const arr = toRaw(this);
562          for (let i = 0, l = this.length; i < l; i++) {
563              track(arr, "get" /* GET */, i + '');
564          }
565          // we run the method using the original args first (which may be reactive)
566          const res = method.apply(arr, args);
567          if (res === -1 || res === false) {
568              // if that didn't work, run it again using raw values.
569              return method.apply(arr, args.map(toRaw));
570          }
571          else {
572              return res;
573          }
574      };
575  });
576  ['push', 'pop', 'shift', 'unshift', 'splice'].forEach(key => {
577      const method = Array.prototype[key];
578      arrayInstrumentations[key] = function (...args) {
579          pauseTracking();
580          const res = method.apply(this, args);
581          resetTracking();
582          return res;
583      };
584  });
585  function createGetter(isReadonly = false, shallow = false) {
586      return function get(target, key, receiver) {
587          if (key === "__v_isReactive" /* IS_REACTIVE */) {
588              return !isReadonly;
589          }
590          else if (key === "__v_isReadonly" /* IS_READONLY */) {
591              return isReadonly;
592          }
593          else if (key === "__v_raw" /* RAW */ &&
594              receiver === (isReadonly ? readonlyMap : reactiveMap).get(target)) {
595              return target;
596          }
597          const targetIsArray = isArray(target);
598          if (targetIsArray && hasOwn(arrayInstrumentations, key)) {
599              return Reflect.get(arrayInstrumentations, key, receiver);
600          }
601          const res = Reflect.get(target, key, receiver);
602          if (isSymbol(key)
603              ? builtInSymbols.has(key)
604              : key === `__proto__` || key === `__v_isRef`) {
605              return res;
606          }
607          if (!isReadonly) {
608              track(target, "get" /* GET */, key);
609          }
610          if (shallow) {
611              return res;
612          }
613          if (isRef(res)) {
614              // ref unwrapping - does not apply for Array + integer key.
615              const shouldUnwrap = !targetIsArray || !isIntegerKey(key);
616              return shouldUnwrap ? res.value : res;
617          }
618          if (isObject(res)) {
619              // Convert returned value into a proxy as well. we do the isObject check
620              // here to avoid invalid value warning. Also need to lazy access readonly
621              // and reactive here to avoid circular dependency.
622              return isReadonly ? readonly(res) : reactive(res);
623          }
624          return res;
625      };
626  }
627  const set = /*#__PURE__*/ createSetter();
628  const shallowSet = /*#__PURE__*/ createSetter(true);
629  function createSetter(shallow = false) {
630      return function set(target, key, value, receiver) {
631          const oldValue = target[key];
632          if (!shallow) {
633              value = toRaw(value);
634              if (!isArray(target) && isRef(oldValue) && !isRef(value)) {
635                  oldValue.value = value;
636                  return true;
637              }
638          }
639          const hadKey = isArray(target) && isIntegerKey(key)
640              ? Number(key) < target.length
641              : hasOwn(target, key);
642          const result = Reflect.set(target, key, value, receiver);
643          // don't trigger if target is something up in the prototype chain of original
644          if (target === toRaw(receiver)) {
645              if (!hadKey) {
646                  trigger(target, "add" /* ADD */, key, value);
647              }
648              else if (hasChanged(value, oldValue)) {
649                  trigger(target, "set" /* SET */, key, value, oldValue);
650              }
651          }
652          return result;
653      };
654  }
655  function deleteProperty(target, key) {
656      const hadKey = hasOwn(target, key);
657      const oldValue = target[key];
658      const result = Reflect.deleteProperty(target, key);
659      if (result && hadKey) {
660          trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
661      }
662      return result;
663  }
664  function has(target, key) {
665      const result = Reflect.has(target, key);
666      if (!isSymbol(key) || !builtInSymbols.has(key)) {
667          track(target, "has" /* HAS */, key);
668      }
669      return result;
670  }
671  function ownKeys(target) {
672      track(target, "iterate" /* ITERATE */, isArray(target) ? 'length' : ITERATE_KEY);
673      return Reflect.ownKeys(target);
674  }
675  const mutableHandlers = {
676      get,
677      set,
678      deleteProperty,
679      has,
680      ownKeys
681  };
682  const readonlyHandlers = {
683      get: readonlyGet,
684      set(target, key) {
685          {
686              console.warn(`Set operation on key "${String(key)}" failed: target is readonly.`, target);
687          }
688          return true;
689      },
690      deleteProperty(target, key) {
691          {
692              console.warn(`Delete operation on key "${String(key)}" failed: target is readonly.`, target);
693          }
694          return true;
695      }
696  };
697  const shallowReactiveHandlers = extend({}, mutableHandlers, {
698      get: shallowGet,
699      set: shallowSet
700  });
701  // Props handlers are special in the sense that it should not unwrap top-level
702  // refs (in order to allow refs to be explicitly passed down), but should
703  // retain the reactivity of the normal readonly object.
704  const shallowReadonlyHandlers = extend({}, readonlyHandlers, {
705      get: shallowReadonlyGet
706  });
707
708  const toReactive = (value) => isObject(value) ? reactive(value) : value;
709  const toReadonly = (value) => isObject(value) ? readonly(value) : value;
710  const toShallow = (value) => value;
711  const getProto = (v) => Reflect.getPrototypeOf(v);
712  function get$1(target, key, isReadonly = false, isShallow = false) {
713      // #1772: readonly(reactive(Map)) should return readonly + reactive version
714      // of the value
715      target = target["__v_raw" /* RAW */];
716      const rawTarget = toRaw(target);
717      const rawKey = toRaw(key);
718      if (key !== rawKey) {
719          !isReadonly && track(rawTarget, "get" /* GET */, key);
720      }
721      !isReadonly && track(rawTarget, "get" /* GET */, rawKey);
722      const { has } = getProto(rawTarget);
723      const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
724      if (has.call(rawTarget, key)) {
725          return wrap(target.get(key));
726      }
727      else if (has.call(rawTarget, rawKey)) {
728          return wrap(target.get(rawKey));
729      }
730  }
731  function has$1(key, isReadonly = false) {
732      const target = this["__v_raw" /* RAW */];
733      const rawTarget = toRaw(target);
734      const rawKey = toRaw(key);
735      if (key !== rawKey) {
736          !isReadonly && track(rawTarget, "has" /* HAS */, key);
737      }
738      !isReadonly && track(rawTarget, "has" /* HAS */, rawKey);
739      return key === rawKey
740          ? target.has(key)
741          : target.has(key) || target.has(rawKey);
742  }
743  function size(target, isReadonly = false) {
744      target = target["__v_raw" /* RAW */];
745      !isReadonly && track(toRaw(target), "iterate" /* ITERATE */, ITERATE_KEY);
746      return Reflect.get(target, 'size', target);
747  }
748  function add(value) {
749      value = toRaw(value);
750      const target = toRaw(this);
751      const proto = getProto(target);
752      const hadKey = proto.has.call(target, value);
753      const result = target.add(value);
754      if (!hadKey) {
755          trigger(target, "add" /* ADD */, value, value);
756      }
757      return result;
758  }
759  function set$1(key, value) {
760      value = toRaw(value);
761      const target = toRaw(this);
762      const { has, get } = getProto(target);
763      let hadKey = has.call(target, key);
764      if (!hadKey) {
765          key = toRaw(key);
766          hadKey = has.call(target, key);
767      }
768      else {
769          checkIdentityKeys(target, has, key);
770      }
771      const oldValue = get.call(target, key);
772      const result = target.set(key, value);
773      if (!hadKey) {
774          trigger(target, "add" /* ADD */, key, value);
775      }
776      else if (hasChanged(value, oldValue)) {
777          trigger(target, "set" /* SET */, key, value, oldValue);
778      }
779      return result;
780  }
781  function deleteEntry(key) {
782      const target = toRaw(this);
783      const { has, get } = getProto(target);
784      let hadKey = has.call(target, key);
785      if (!hadKey) {
786          key = toRaw(key);
787          hadKey = has.call(target, key);
788      }
789      else {
790          checkIdentityKeys(target, has, key);
791      }
792      const oldValue = get ? get.call(target, key) : undefined;
793      // forward the operation before queueing reactions
794      const result = target.delete(key);
795      if (hadKey) {
796          trigger(target, "delete" /* DELETE */, key, undefined, oldValue);
797      }
798      return result;
799  }
800  function clear() {
801      const target = toRaw(this);
802      const hadItems = target.size !== 0;
803      const oldTarget =  isMap(target)
804              ? new Map(target)
805              : new Set(target)
806          ;
807      // forward the operation before queueing reactions
808      const result = target.clear();
809      if (hadItems) {
810          trigger(target, "clear" /* CLEAR */, undefined, undefined, oldTarget);
811      }
812      return result;
813  }
814  function createForEach(isReadonly, isShallow) {
815      return function forEach(callback, thisArg) {
816          const observed = this;
817          const target = observed["__v_raw" /* RAW */];
818          const rawTarget = toRaw(target);
819          const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
820          !isReadonly && track(rawTarget, "iterate" /* ITERATE */, ITERATE_KEY);
821          return target.forEach((value, key) => {
822              // important: make sure the callback is
823              // 1. invoked with the reactive map as `this` and 3rd arg
824              // 2. the value received should be a corresponding reactive/readonly.
825              return callback.call(thisArg, wrap(value), wrap(key), observed);
826          });
827      };
828  }
829  function createIterableMethod(method, isReadonly, isShallow) {
830      return function (...args) {
831          const target = this["__v_raw" /* RAW */];
832          const rawTarget = toRaw(target);
833          const targetIsMap = isMap(rawTarget);
834          const isPair = method === 'entries' || (method === Symbol.iterator && targetIsMap);
835          const isKeyOnly = method === 'keys' && targetIsMap;
836          const innerIterator = target[method](...args);
837          const wrap = isReadonly ? toReadonly : isShallow ? toShallow : toReactive;
838          !isReadonly &&
839              track(rawTarget, "iterate" /* ITERATE */, isKeyOnly ? MAP_KEY_ITERATE_KEY : ITERATE_KEY);
840          // return a wrapped iterator which returns observed versions of the
841          // values emitted from the real iterator
842          return {
843              // iterator protocol
844              next() {
845                  const { value, done } = innerIterator.next();
846                  return done
847                      ? { value, done }
848                      : {
849                          value: isPair ? [wrap(value[0]), wrap(value[1])] : wrap(value),
850                          done
851                      };
852              },
853              // iterable protocol
854              [Symbol.iterator]() {
855                  return this;
856              }
857          };
858      };
859  }
860  function createReadonlyMethod(type) {
861      return function (...args) {
862          {
863              const key = args[0] ? `on key "${args[0]}" ` : ``;
864              console.warn(`${capitalize(type)} operation ${key}failed: target is readonly.`, toRaw(this));
865          }
866          return type === "delete" /* DELETE */ ? false : this;
867      };
868  }
869  const mutableInstrumentations = {
870      get(key) {
871          return get$1(this, key);
872      },
873      get size() {
874          return size(this);
875      },
876      has: has$1,
877      add,
878      set: set$1,
879      delete: deleteEntry,
880      clear,
881      forEach: createForEach(false, false)
882  };
883  const shallowInstrumentations = {
884      get(key) {
885          return get$1(this, key, false, true);
886      },
887      get size() {
888          return size(this);
889      },
890      has: has$1,
891      add,
892      set: set$1,
893      delete: deleteEntry,
894      clear,
895      forEach: createForEach(false, true)
896  };
897  const readonlyInstrumentations = {
898      get(key) {
899          return get$1(this, key, true);
900      },
901      get size() {
902          return size(this, true);
903      },
904      has(key) {
905          return has$1.call(this, key, true);
906      },
907      add: createReadonlyMethod("add" /* ADD */),
908      set: createReadonlyMethod("set" /* SET */),
909      delete: createReadonlyMethod("delete" /* DELETE */),
910      clear: createReadonlyMethod("clear" /* CLEAR */),
911      forEach: createForEach(true, false)
912  };
913  const iteratorMethods = ['keys', 'values', 'entries', Symbol.iterator];
914  iteratorMethods.forEach(method => {
915      mutableInstrumentations[method] = createIterableMethod(method, false, false);
916      readonlyInstrumentations[method] = createIterableMethod(method, true, false);
917      shallowInstrumentations[method] = createIterableMethod(method, false, true);
918  });
919  function createInstrumentationGetter(isReadonly, shallow) {
920      const instrumentations = shallow
921          ? shallowInstrumentations
922          : isReadonly
923              ? readonlyInstrumentations
924              : mutableInstrumentations;
925      return (target, key, receiver) => {
926          if (key === "__v_isReactive" /* IS_REACTIVE */) {
927              return !isReadonly;
928          }
929          else if (key === "__v_isReadonly" /* IS_READONLY */) {
930              return isReadonly;
931          }
932          else if (key === "__v_raw" /* RAW */) {
933              return target;
934          }
935          return Reflect.get(hasOwn(instrumentations, key) && key in target
936              ? instrumentations
937              : target, key, receiver);
938      };
939  }
940  const mutableCollectionHandlers = {
941      get: createInstrumentationGetter(false, false)
942  };
943  const shallowCollectionHandlers = {
944      get: createInstrumentationGetter(false, true)
945  };
946  const readonlyCollectionHandlers = {
947      get: createInstrumentationGetter(true, false)
948  };
949  function checkIdentityKeys(target, has, key) {
950      const rawKey = toRaw(key);
951      if (rawKey !== key && has.call(target, rawKey)) {
952          const type = toRawType(target);
953          console.warn(`Reactive ${type} contains both the raw and reactive ` +
954              `versions of the same object${type === `Map` ? ` as keys` : ``}, ` +
955              `which can lead to inconsistencies. ` +
956              `Avoid differentiating between the raw and reactive versions ` +
957              `of an object and only use the reactive version if possible.`);
958      }
959  }
960
961  const reactiveMap = new WeakMap();
962  const readonlyMap = new WeakMap();
963  function targetTypeMap(rawType) {
964      switch (rawType) {
965          case 'Object':
966          case 'Array':
967              return 1 /* COMMON */;
968          case 'Map':
969          case 'Set':
970          case 'WeakMap':
971          case 'WeakSet':
972              return 2 /* COLLECTION */;
973          default:
974              return 0 /* INVALID */;
975      }
976  }
977  function getTargetType(value) {
978      return value["__v_skip" /* SKIP */] || !Object.isExtensible(value)
979          ? 0 /* INVALID */
980          : targetTypeMap(toRawType(value));
981  }
982  function reactive(target) {
983      // if trying to observe a readonly proxy, return the readonly version.
984      if (target && target["__v_isReadonly" /* IS_READONLY */]) {
985          return target;
986      }
987      return createReactiveObject(target, false, mutableHandlers, mutableCollectionHandlers);
988  }
989  // Return a reactive-copy of the original object, where only the root level
990  // properties are reactive, and does NOT unwrap refs nor recursively convert
991  // returned properties.
992  function shallowReactive(target) {
993      return createReactiveObject(target, false, shallowReactiveHandlers, shallowCollectionHandlers);
994  }
995  function readonly(target) {
996      return createReactiveObject(target, true, readonlyHandlers, readonlyCollectionHandlers);
997  }
998  // Return a reactive-copy of the original object, where only the root level
999  // properties are readonly, and does NOT unwrap refs nor recursively convert
1000  // returned properties.
1001  // This is used for creating the props proxy object for stateful components.
1002  function shallowReadonly(target) {
1003      return createReactiveObject(target, true, shallowReadonlyHandlers, readonlyCollectionHandlers);
1004  }
1005  function createReactiveObject(target, isReadonly, baseHandlers, collectionHandlers) {
1006      if (!isObject(target)) {
1007          {
1008              console.warn(`value cannot be made reactive: ${String(target)}`);
1009          }
1010          return target;
1011      }
1012      // target is already a Proxy, return it.
1013      // exception: calling readonly() on a reactive object
1014      if (target["__v_raw" /* RAW */] &&
1015          !(isReadonly && target["__v_isReactive" /* IS_REACTIVE */])) {
1016          return target;
1017      }
1018      // target already has corresponding Proxy
1019      const proxyMap = isReadonly ? readonlyMap : reactiveMap;
1020      const existingProxy = proxyMap.get(target);
1021      if (existingProxy) {
1022          return existingProxy;
1023      }
1024      // only a whitelist of value types can be observed.
1025      const targetType = getTargetType(target);
1026      if (targetType === 0 /* INVALID */) {
1027          return target;
1028      }
1029      const proxy = new Proxy(target, targetType === 2 /* COLLECTION */ ? collectionHandlers : baseHandlers);
1030      proxyMap.set(target, proxy);
1031      return proxy;
1032  }
1033  function isReactive(value) {
1034      if (isReadonly(value)) {
1035          return isReactive(value["__v_raw" /* RAW */]);
1036      }
1037      return !!(value && value["__v_isReactive" /* IS_REACTIVE */]);
1038  }
1039  function isReadonly(value) {
1040      return !!(value && value["__v_isReadonly" /* IS_READONLY */]);
1041  }
1042  function isProxy(value) {
1043      return isReactive(value) || isReadonly(value);
1044  }
1045  function toRaw(observed) {
1046      return ((observed && toRaw(observed["__v_raw" /* RAW */])) || observed);
1047  }
1048  function markRaw(value) {
1049      def(value, "__v_skip" /* SKIP */, true);
1050      return value;
1051  }
1052
1053  const convert = (val) => isObject(val) ? reactive(val) : val;
1054  function isRef(r) {
1055      return Boolean(r && r.__v_isRef === true);
1056  }
1057  function ref(value) {
1058      return createRef(value);
1059  }
1060  function shallowRef(value) {
1061      return createRef(value, true);
1062  }
1063  class RefImpl {
1064      constructor(_rawValue, _shallow = false) {
1065          this._rawValue = _rawValue;
1066          this._shallow = _shallow;
1067          this.__v_isRef = true;
1068          this._value = _shallow ? _rawValue : convert(_rawValue);
1069      }
1070      get value() {
1071          track(toRaw(this), "get" /* GET */, 'value');
1072          return this._value;
1073      }
1074      set value(newVal) {
1075          if (hasChanged(toRaw(newVal), this._rawValue)) {
1076              this._rawValue = newVal;
1077              this._value = this._shallow ? newVal : convert(newVal);
1078              trigger(toRaw(this), "set" /* SET */, 'value', newVal);
1079          }
1080      }
1081  }
1082  function createRef(rawValue, shallow = false) {
1083      if (isRef(rawValue)) {
1084          return rawValue;
1085      }
1086      return new RefImpl(rawValue, shallow);
1087  }
1088  function triggerRef(ref) {
1089      trigger(toRaw(ref), "set" /* SET */, 'value',  ref.value );
1090  }
1091  function unref(ref) {
1092      return isRef(ref) ? ref.value : ref;
1093  }
1094  const shallowUnwrapHandlers = {
1095      get: (target, key, receiver) => unref(Reflect.get(target, key, receiver)),
1096      set: (target, key, value, receiver) => {
1097          const oldValue = target[key];
1098          if (isRef(oldValue) && !isRef(value)) {
1099              oldValue.value = value;
1100              return true;
1101          }
1102          else {
1103              return Reflect.set(target, key, value, receiver);
1104          }
1105      }
1106  };
1107  function proxyRefs(objectWithRefs) {
1108      return isReactive(objectWithRefs)
1109          ? objectWithRefs
1110          : new Proxy(objectWithRefs, shallowUnwrapHandlers);
1111  }
1112  class CustomRefImpl {
1113      constructor(factory) {
1114          this.__v_isRef = true;
1115          const { get, set } = factory(() => track(this, "get" /* GET */, 'value'), () => trigger(this, "set" /* SET */, 'value'));
1116          this._get = get;
1117          this._set = set;
1118      }
1119      get value() {
1120          return this._get();
1121      }
1122      set value(newVal) {
1123          this._set(newVal);
1124      }
1125  }
1126  function customRef(factory) {
1127      return new CustomRefImpl(factory);
1128  }
1129  function toRefs(object) {
1130      if ( !isProxy(object)) {
1131          console.warn(`toRefs() expects a reactive object but received a plain one.`);
1132      }
1133      const ret = isArray(object) ? new Array(object.length) : {};
1134      for (const key in object) {
1135          ret[key] = toRef(object, key);
1136      }
1137      return ret;
1138  }
1139  class ObjectRefImpl {
1140      constructor(_object, _key) {
1141          this._object = _object;
1142          this._key = _key;
1143          this.__v_isRef = true;
1144      }
1145      get value() {
1146          return this._object[this._key];
1147      }
1148      set value(newVal) {
1149          this._object[this._key] = newVal;
1150      }
1151  }
1152  function toRef(object, key) {
1153      return isRef(object[key])
1154          ? object[key]
1155          : new ObjectRefImpl(object, key);
1156  }
1157
1158  class ComputedRefImpl {
1159      constructor(getter, _setter, isReadonly) {
1160          this._setter = _setter;
1161          this._dirty = true;
1162          this.__v_isRef = true;
1163          this.effect = effect(getter, {
1164              lazy: true,
1165              scheduler: () => {
1166                  if (!this._dirty) {
1167                      this._dirty = true;
1168                      trigger(toRaw(this), "set" /* SET */, 'value');
1169                  }
1170              }
1171          });
1172          this["__v_isReadonly" /* IS_READONLY */] = isReadonly;
1173      }
1174      get value() {
1175          if (this._dirty) {
1176              this._value = this.effect();
1177              this._dirty = false;
1178          }
1179          track(toRaw(this), "get" /* GET */, 'value');
1180          return this._value;
1181      }
1182      set value(newValue) {
1183          this._setter(newValue);
1184      }
1185  }
1186  function computed(getterOrOptions) {
1187      let getter;
1188      let setter;
1189      if (isFunction(getterOrOptions)) {
1190          getter = getterOrOptions;
1191          setter =  () => {
1192                  console.warn('Write operation failed: computed value is readonly');
1193              }
1194              ;
1195      }
1196      else {
1197          getter = getterOrOptions.get;
1198          setter = getterOrOptions.set;
1199      }
1200      return new ComputedRefImpl(getter, setter, isFunction(getterOrOptions) || !getterOrOptions.set);
1201  }
1202
1203  const stack = [];
1204  function pushWarningContext(vnode) {
1205      stack.push(vnode);
1206  }
1207  function popWarningContext() {
1208      stack.pop();
1209  }
1210  function warn(msg, ...args) {
1211      // avoid props formatting or warn handler tracking deps that might be mutated
1212      // during patch, leading to infinite recursion.
1213      pauseTracking();
1214      const instance = stack.length ? stack[stack.length - 1].component : null;
1215      const appWarnHandler = instance && instance.appContext.config.warnHandler;
1216      const trace = getComponentTrace();
1217      if (appWarnHandler) {
1218          callWithErrorHandling(appWarnHandler, instance, 11 /* APP_WARN_HANDLER */, [
1219              msg + args.join(''),
1220              instance && instance.proxy,
1221              trace
1222                  .map(({ vnode }) => `at <${formatComponentName(instance, vnode.type)}>`)
1223                  .join('\n'),
1224              trace
1225          ]);
1226      }
1227      else {
1228          const warnArgs = [`[Vue warn]: ${msg}`, ...args];
1229          /* istanbul ignore if */
1230          if (trace.length &&
1231              // avoid spamming console during tests
1232              !false) {
1233              warnArgs.push(`\n`, ...formatTrace(trace));
1234          }
1235          console.warn(...warnArgs);
1236      }
1237      resetTracking();
1238  }
1239  function getComponentTrace() {
1240      let currentVNode = stack[stack.length - 1];
1241      if (!currentVNode) {
1242          return [];
1243      }
1244      // we can't just use the stack because it will be incomplete during updates
1245      // that did not start from the root. Re-construct the parent chain using
1246      // instance parent pointers.
1247      const normalizedStack = [];
1248      while (currentVNode) {
1249          const last = normalizedStack[0];
1250          if (last && last.vnode === currentVNode) {
1251              last.recurseCount++;
1252          }
1253          else {
1254              normalizedStack.push({
1255                  vnode: currentVNode,
1256                  recurseCount: 0
1257              });
1258          }
1259          const parentInstance = currentVNode.component && currentVNode.component.parent;
1260          currentVNode = parentInstance && parentInstance.vnode;
1261      }
1262      return normalizedStack;
1263  }
1264  /* istanbul ignore next */
1265  function formatTrace(trace) {
1266      const logs = [];
1267      trace.forEach((entry, i) => {
1268          logs.push(...(i === 0 ? [] : [`\n`]), ...formatTraceEntry(entry));
1269      });
1270      return logs;
1271  }
1272  function formatTraceEntry({ vnode, recurseCount }) {
1273      const postfix = recurseCount > 0 ? `... (${recurseCount} recursive calls)` : ``;
1274      const isRoot = vnode.component ? vnode.component.parent == null : false;
1275      const open = ` at <${formatComponentName(vnode.component, vnode.type, isRoot)}`;
1276      const close = `>` + postfix;
1277      return vnode.props
1278          ? [open, ...formatProps(vnode.props), close]
1279          : [open + close];
1280  }
1281  /* istanbul ignore next */
1282  function formatProps(props) {
1283      const res = [];
1284      const keys = Object.keys(props);
1285      keys.slice(0, 3).forEach(key => {
1286          res.push(...formatProp(key, props[key]));
1287      });
1288      if (keys.length > 3) {
1289          res.push(` ...`);
1290      }
1291      return res;
1292  }
1293  /* istanbul ignore next */
1294  function formatProp(key, value, raw) {
1295      if (isString(value)) {
1296          value = JSON.stringify(value);
1297          return raw ? value : [`${key}=${value}`];
1298      }
1299      else if (typeof value === 'number' ||
1300          typeof value === 'boolean' ||
1301          value == null) {
1302          return raw ? value : [`${key}=${value}`];
1303      }
1304      else if (isRef(value)) {
1305          value = formatProp(key, toRaw(value.value), true);
1306          return raw ? value : [`${key}=Ref<`, value, `>`];
1307      }
1308      else if (isFunction(value)) {
1309          return [`${key}=fn${value.name ? `<${value.name}>` : ``}`];
1310      }
1311      else {
1312          value = toRaw(value);
1313          return raw ? value : [`${key}=`, value];
1314      }
1315  }
1316
1317  const ErrorTypeStrings = {
1318      ["bc" /* BEFORE_CREATE */]: 'beforeCreate hook',
1319      ["c" /* CREATED */]: 'created hook',
1320      ["bm" /* BEFORE_MOUNT */]: 'beforeMount hook',
1321      ["m" /* MOUNTED */]: 'mounted hook',
1322      ["bu" /* BEFORE_UPDATE */]: 'beforeUpdate hook',
1323      ["u" /* UPDATED */]: 'updated',
1324      ["bum" /* BEFORE_UNMOUNT */]: 'beforeUnmount hook',
1325      ["um" /* UNMOUNTED */]: 'unmounted hook',
1326      ["a" /* ACTIVATED */]: 'activated hook',
1327      ["da" /* DEACTIVATED */]: 'deactivated hook',
1328      ["ec" /* ERROR_CAPTURED */]: 'errorCaptured hook',
1329      ["rtc" /* RENDER_TRACKED */]: 'renderTracked hook',
1330      ["rtg" /* RENDER_TRIGGERED */]: 'renderTriggered hook',
1331      [0 /* SETUP_FUNCTION */]: 'setup function',
1332      [1 /* RENDER_FUNCTION */]: 'render function',
1333      [2 /* WATCH_GETTER */]: 'watcher getter',
1334      [3 /* WATCH_CALLBACK */]: 'watcher callback',
1335      [4 /* WATCH_CLEANUP */]: 'watcher cleanup function',
1336      [5 /* NATIVE_EVENT_HANDLER */]: 'native event handler',
1337      [6 /* COMPONENT_EVENT_HANDLER */]: 'component event handler',
1338      [7 /* VNODE_HOOK */]: 'vnode hook',
1339      [8 /* DIRECTIVE_HOOK */]: 'directive hook',
1340      [9 /* TRANSITION_HOOK */]: 'transition hook',
1341      [10 /* APP_ERROR_HANDLER */]: 'app errorHandler',
1342      [11 /* APP_WARN_HANDLER */]: 'app warnHandler',
1343      [12 /* FUNCTION_REF */]: 'ref function',
1344      [13 /* ASYNC_COMPONENT_LOADER */]: 'async component loader',
1345      [14 /* SCHEDULER */]: 'scheduler flush. This is likely a Vue internals bug. ' +
1346          'Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/vue-next'
1347  };
1348  function callWithErrorHandling(fn, instance, type, args) {
1349      let res;
1350      try {
1351          res = args ? fn(...args) : fn();
1352      }
1353      catch (err) {
1354          handleError(err, instance, type);
1355      }
1356      return res;
1357  }
1358  function callWithAsyncErrorHandling(fn, instance, type, args) {
1359      if (isFunction(fn)) {
1360          const res = callWithErrorHandling(fn, instance, type, args);
1361          if (res && isPromise(res)) {
1362              res.catch(err => {
1363                  handleError(err, instance, type);
1364              });
1365          }
1366          return res;
1367      }
1368      const values = [];
1369      for (let i = 0; i < fn.length; i++) {
1370          values.push(callWithAsyncErrorHandling(fn[i], instance, type, args));
1371      }
1372      return values;
1373  }
1374  function handleError(err, instance, type, throwInDev = true) {
1375      const contextVNode = instance ? instance.vnode : null;
1376      if (instance) {
1377          let cur = instance.parent;
1378          // the exposed instance is the render proxy to keep it consistent with 2.x
1379          const exposedInstance = instance.proxy;
1380          // in production the hook receives only the error code
1381          const errorInfo =  ErrorTypeStrings[type] ;
1382          while (cur) {
1383              const errorCapturedHooks = cur.ec;
1384              if (errorCapturedHooks) {
1385                  for (let i = 0; i < errorCapturedHooks.length; i++) {
1386                      if (errorCapturedHooks[i](err, exposedInstance, errorInfo) === false) {
1387                          return;
1388                      }
1389                  }
1390              }
1391              cur = cur.parent;
1392          }
1393          // app-level handling
1394          const appErrorHandler = instance.appContext.config.errorHandler;
1395          if (appErrorHandler) {
1396              callWithErrorHandling(appErrorHandler, null, 10 /* APP_ERROR_HANDLER */, [err, exposedInstance, errorInfo]);
1397              return;
1398          }
1399      }
1400      logError(err, type, contextVNode, throwInDev);
1401  }
1402  function logError(err, type, contextVNode, throwInDev = true) {
1403      {
1404          const info = ErrorTypeStrings[type];
1405          if (contextVNode) {
1406              pushWarningContext(contextVNode);
1407          }
1408          warn(`Unhandled error${info ? ` during execution of ${info}` : ``}`);
1409          if (contextVNode) {
1410              popWarningContext();
1411          }
1412          // crash in dev by default so it's more noticeable
1413          if (throwInDev) {
1414              throw err;
1415          }
1416          else {
1417              console.error(err);
1418          }
1419      }
1420  }
1421
1422  let isFlushing = false;
1423  let isFlushPending = false;
1424  const queue = [];
1425  let flushIndex = 0;
1426  const pendingPreFlushCbs = [];
1427  let activePreFlushCbs = null;
1428  let preFlushIndex = 0;
1429  const pendingPostFlushCbs = [];
1430  let activePostFlushCbs = null;
1431  let postFlushIndex = 0;
1432  const resolvedPromise = Promise.resolve();
1433  let currentFlushPromise = null;
1434  let currentPreFlushParentJob = null;
1435  const RECURSION_LIMIT = 100;
1436  function nextTick(fn) {
1437      const p = currentFlushPromise || resolvedPromise;
1438      return fn ? p.then(this ? fn.bind(this) : fn) : p;
1439  }
1440  function queueJob(job) {
1441      // the dedupe search uses the startIndex argument of Array.includes()
1442      // by default the search index includes the current job that is being run
1443      // so it cannot recursively trigger itself again.
1444      // if the job is a watch() callback, the search will start with a +1 index to
1445      // allow it recursively trigger itself - it is the user's responsibility to
1446      // ensure it doesn't end up in an infinite loop.
1447      if ((!queue.length ||
1448          !queue.includes(job, isFlushing && job.allowRecurse ? flushIndex + 1 : flushIndex)) &&
1449          job !== currentPreFlushParentJob) {
1450          queue.push(job);
1451          queueFlush();
1452      }
1453  }
1454  function queueFlush() {
1455      if (!isFlushing && !isFlushPending) {
1456          isFlushPending = true;
1457          currentFlushPromise = resolvedPromise.then(flushJobs);
1458      }
1459  }
1460  function invalidateJob(job) {
1461      const i = queue.indexOf(job);
1462      if (i > -1) {
1463          queue[i] = null;
1464      }
1465  }
1466  function queueCb(cb, activeQueue, pendingQueue, index) {
1467      if (!isArray(cb)) {
1468          if (!activeQueue ||
1469              !activeQueue.includes(cb, cb.allowRecurse ? index + 1 : index)) {
1470              pendingQueue.push(cb);
1471          }
1472      }
1473      else {
1474          // if cb is an array, it is a component lifecycle hook which can only be
1475          // triggered by a job, which is already deduped in the main queue, so
1476          // we can skip duplicate check here to improve perf
1477          pendingQueue.push(...cb);
1478      }
1479      queueFlush();
1480  }
1481  function queuePreFlushCb(cb) {
1482      queueCb(cb, activePreFlushCbs, pendingPreFlushCbs, preFlushIndex);
1483  }
1484  function queuePostFlushCb(cb) {
1485      queueCb(cb, activePostFlushCbs, pendingPostFlushCbs, postFlushIndex);
1486  }
1487  function flushPreFlushCbs(seen, parentJob = null) {
1488      if (pendingPreFlushCbs.length) {
1489          currentPreFlushParentJob = parentJob;
1490          activePreFlushCbs = [...new Set(pendingPreFlushCbs)];
1491          pendingPreFlushCbs.length = 0;
1492          {
1493              seen = seen || new Map();
1494          }
1495          for (preFlushIndex = 0; preFlushIndex < activePreFlushCbs.length; preFlushIndex++) {
1496              {
1497                  checkRecursiveUpdates(seen, activePreFlushCbs[preFlushIndex]);
1498              }
1499              activePreFlushCbs[preFlushIndex]();
1500          }
1501          activePreFlushCbs = null;
1502          preFlushIndex = 0;
1503          currentPreFlushParentJob = null;
1504          // recursively flush until it drains
1505          flushPreFlushCbs(seen, parentJob);
1506      }
1507  }
1508  function flushPostFlushCbs(seen) {
1509      if (pendingPostFlushCbs.length) {
1510          const deduped = [...new Set(pendingPostFlushCbs)];
1511          pendingPostFlushCbs.length = 0;
1512          // #1947 already has active queue, nested flushPostFlushCbs call
1513          if (activePostFlushCbs) {
1514              activePostFlushCbs.push(...deduped);
1515              return;
1516          }
1517          activePostFlushCbs = deduped;
1518          {
1519              seen = seen || new Map();
1520          }
1521          activePostFlushCbs.sort((a, b) => getId(a) - getId(b));
1522          for (postFlushIndex = 0; postFlushIndex < activePostFlushCbs.length; postFlushIndex++) {
1523              {
1524                  checkRecursiveUpdates(seen, activePostFlushCbs[postFlushIndex]);
1525              }
1526              activePostFlushCbs[postFlushIndex]();
1527          }
1528          activePostFlushCbs = null;
1529          postFlushIndex = 0;
1530      }
1531  }
1532  const getId = (job) => job.id == null ? Infinity : job.id;
1533  function flushJobs(seen) {
1534      isFlushPending = false;
1535      isFlushing = true;
1536      {
1537          seen = seen || new Map();
1538      }
1539      flushPreFlushCbs(seen);
1540      // Sort queue before flush.
1541      // This ensures that:
1542      // 1. Components are updated from parent to child. (because parent is always
1543      //    created before the child so its render effect will have smaller
1544      //    priority number)
1545      // 2. If a component is unmounted during a parent component's update,
1546      //    its update can be skipped.
1547      // Jobs can never be null before flush starts, since they are only invalidated
1548      // during execution of another flushed job.
1549      queue.sort((a, b) => getId(a) - getId(b));
1550      try {
1551          for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
1552              const job = queue[flushIndex];
1553              if (job) {
1554                  if (true) {
1555                      checkRecursiveUpdates(seen, job);
1556                  }
1557                  callWithErrorHandling(job, null, 14 /* SCHEDULER */);
1558              }
1559          }
1560      }
1561      finally {
1562          flushIndex = 0;
1563          queue.length = 0;
1564          flushPostFlushCbs(seen);
1565          isFlushing = false;
1566          currentFlushPromise = null;
1567          // some postFlushCb queued jobs!
1568          // keep flushing until it drains.
1569          if (queue.length || pendingPostFlushCbs.length) {
1570              flushJobs(seen);
1571          }
1572      }
1573  }
1574  function checkRecursiveUpdates(seen, fn) {
1575      if (!seen.has(fn)) {
1576          seen.set(fn, 1);
1577      }
1578      else {
1579          const count = seen.get(fn);
1580          if (count > RECURSION_LIMIT) {
1581              throw new Error(`Maximum recursive updates exceeded. ` +
1582                  `This means you have a reactive effect that is mutating its own ` +
1583                  `dependencies and thus recursively triggering itself. Possible sources ` +
1584                  `include component template, render function, updated hook or ` +
1585                  `watcher source function.`);
1586          }
1587          else {
1588              seen.set(fn, count + 1);
1589          }
1590      }
1591  }
1592
1593  /* eslint-disable no-restricted-globals */
1594  let isHmrUpdating = false;
1595  const hmrDirtyComponents = new Set();
1596  // Expose the HMR runtime on the global object
1597  // This makes it entirely tree-shakable without polluting the exports and makes
1598  // it easier to be used in toolings like vue-loader
1599  // Note: for a component to be eligible for HMR it also needs the __hmrId option
1600  // to be set so that its instances can be registered / removed.
1601  {
1602      const globalObject = typeof global !== 'undefined'
1603          ? global
1604          : typeof self !== 'undefined'
1605              ? self
1606              : typeof window !== 'undefined'
1607                  ? window
1608                  : {};
1609      globalObject.__VUE_HMR_RUNTIME__ = {
1610          createRecord: tryWrap(createRecord),
1611          rerender: tryWrap(rerender),
1612          reload: tryWrap(reload)
1613      };
1614  }
1615  const map = new Map();
1616  function registerHMR(instance) {
1617      const id = instance.type.__hmrId;
1618      let record = map.get(id);
1619      if (!record) {
1620          createRecord(id);
1621          record = map.get(id);
1622      }
1623      record.add(instance);
1624  }
1625  function unregisterHMR(instance) {
1626      map.get(instance.type.__hmrId).delete(instance);
1627  }
1628  function createRecord(id) {
1629      if (map.has(id)) {
1630          return false;
1631      }
1632      map.set(id, new Set());
1633      return true;
1634  }
1635  function rerender(id, newRender) {
1636      const record = map.get(id);
1637      if (!record)
1638          return;
1639      // Array.from creates a snapshot which avoids the set being mutated during
1640      // updates
1641      Array.from(record).forEach(instance => {
1642          if (newRender) {
1643              instance.render = newRender;
1644          }
1645          instance.renderCache = [];
1646          // this flag forces child components with slot content to update
1647          isHmrUpdating = true;
1648          instance.update();
1649          isHmrUpdating = false;
1650      });
1651  }
1652  function reload(id, newComp) {
1653      const record = map.get(id);
1654      if (!record)
1655          return;
1656      // Array.from creates a snapshot which avoids the set being mutated during
1657      // updates
1658      Array.from(record).forEach(instance => {
1659          const comp = instance.type;
1660          if (!hmrDirtyComponents.has(comp)) {
1661              // 1. Update existing comp definition to match new one
1662              newComp = isClassComponent(newComp) ? newComp.__vccOpts : newComp;
1663              extend(comp, newComp);
1664              for (const key in comp) {
1665                  if (!(key in newComp)) {
1666                      delete comp[key];
1667                  }
1668              }
1669              // 2. Mark component dirty. This forces the renderer to replace the component
1670              // on patch.
1671              hmrDirtyComponents.add(comp);
1672              // 3. Make sure to unmark the component after the reload.
1673              queuePostFlushCb(() => {
1674                  hmrDirtyComponents.delete(comp);
1675              });
1676          }
1677          if (instance.parent) {
1678              // 4. Force the parent instance to re-render. This will cause all updated
1679              // components to be unmounted and re-mounted. Queue the update so that we
1680              // don't end up forcing the same parent to re-render multiple times.
1681              queueJob(instance.parent.update);
1682          }
1683          else if (instance.appContext.reload) {
1684              // root instance mounted via createApp() has a reload method
1685              instance.appContext.reload();
1686          }
1687          else if (typeof window !== 'undefined') {
1688              // root instance inside tree created via raw render(). Force reload.
1689              window.location.reload();
1690          }
1691          else {
1692              console.warn('[HMR] Root or manually mounted instance modified. Full reload required.');
1693          }
1694      });
1695  }
1696  function tryWrap(fn) {
1697      return (id, arg) => {
1698          try {
1699              return fn(id, arg);
1700          }
1701          catch (e) {
1702              console.error(e);
1703              console.warn(`[HMR] Something went wrong during Vue component hot-reload. ` +
1704                  `Full reload required.`);
1705          }
1706      };
1707  }
1708
1709  function setDevtoolsHook(hook) {
1710      exports.devtools = hook;
1711  }
1712  function devtoolsInitApp(app, version) {
1713      // TODO queue if devtools is undefined
1714      if (!exports.devtools)
1715          return;
1716      exports.devtools.emit("app:init" /* APP_INIT */, app, version, {
1717          Fragment,
1718          Text,
1719          Comment,
1720          Static
1721      });
1722  }
1723  function devtoolsUnmountApp(app) {
1724      if (!exports.devtools)
1725          return;
1726      exports.devtools.emit("app:unmount" /* APP_UNMOUNT */, app);
1727  }
1728  const devtoolsComponentAdded = /*#__PURE__*/ createDevtoolsComponentHook("component:added" /* COMPONENT_ADDED */);
1729  const devtoolsComponentUpdated = /*#__PURE__*/ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */);
1730  const devtoolsComponentRemoved = /*#__PURE__*/ createDevtoolsComponentHook("component:removed" /* COMPONENT_REMOVED */);
1731  function createDevtoolsComponentHook(hook) {
1732      return (component) => {
1733          if (!exports.devtools)
1734              return;
1735          exports.devtools.emit(hook, component.appContext.app, component.uid, component.parent ? component.parent.uid : undefined);
1736      };
1737  }
1738  function devtoolsComponentEmit(component, event, params) {
1739      if (!exports.devtools)
1740          return;
1741      exports.devtools.emit("component:emit" /* COMPONENT_EMIT */, component.appContext.app, component, event, params);
1742  }
1743
1744  function emit(instance, event, ...rawArgs) {
1745      const props = instance.vnode.props || EMPTY_OBJ;
1746      {
1747          const { emitsOptions, propsOptions: [propsOptions] } = instance;
1748          if (emitsOptions) {
1749              if (!(event in emitsOptions)) {
1750                  if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
1751                      warn(`Component emitted event "${event}" but it is neither declared in ` +
1752                          `the emits option nor as an "${toHandlerKey(event)}" prop.`);
1753                  }
1754              }
1755              else {
1756                  const validator = emitsOptions[event];
1757                  if (isFunction(validator)) {
1758                      const isValid = validator(...rawArgs);
1759                      if (!isValid) {
1760                          warn(`Invalid event arguments: event validation failed for event "${event}".`);
1761                      }
1762                  }
1763              }
1764          }
1765      }
1766      let args = rawArgs;
1767      const isModelListener = event.startsWith('update:');
1768      // for v-model update:xxx events, apply modifiers on args
1769      const modelArg = isModelListener && event.slice(7);
1770      if (modelArg && modelArg in props) {
1771          const modifiersKey = `${modelArg === 'modelValue' ? 'model' : modelArg}Modifiers`;
1772          const { number, trim } = props[modifiersKey] || EMPTY_OBJ;
1773          if (trim) {
1774              args = rawArgs.map(a => a.trim());
1775          }
1776          else if (number) {
1777              args = rawArgs.map(toNumber);
1778          }
1779      }
1780      {
1781          devtoolsComponentEmit(instance, event, args);
1782      }
1783      {
1784          const lowerCaseEvent = event.toLowerCase();
1785          if (lowerCaseEvent !== event && props[toHandlerKey(lowerCaseEvent)]) {
1786              warn(`Event "${lowerCaseEvent}" is emitted in component ` +
1787                  `${formatComponentName(instance, instance.type)} but the handler is registered for "${event}". ` +
1788                  `Note that HTML attributes are case-insensitive and you cannot use ` +
1789                  `v-on to listen to camelCase events when using in-DOM templates. ` +
1790                  `You should probably use "${hyphenate(event)}" instead of "${event}".`);
1791          }
1792      }
1793      // convert handler name to camelCase. See issue #2249
1794      let handlerName = toHandlerKey(camelize(event));
1795      let handler = props[handlerName];
1796      // for v-model update:xxx events, also trigger kebab-case equivalent
1797      // for props passed via kebab-case
1798      if (!handler && isModelListener) {
1799          handlerName = toHandlerKey(hyphenate(event));
1800          handler = props[handlerName];
1801      }
1802      if (handler) {
1803          callWithAsyncErrorHandling(handler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
1804      }
1805      const onceHandler = props[handlerName + `Once`];
1806      if (onceHandler) {
1807          if (!instance.emitted) {
1808              (instance.emitted = {})[handlerName] = true;
1809          }
1810          else if (instance.emitted[handlerName]) {
1811              return;
1812          }
1813          callWithAsyncErrorHandling(onceHandler, instance, 6 /* COMPONENT_EVENT_HANDLER */, args);
1814      }
1815  }
1816  function normalizeEmitsOptions(comp, appContext, asMixin = false) {
1817      if (!appContext.deopt && comp.__emits !== undefined) {
1818          return comp.__emits;
1819      }
1820      const raw = comp.emits;
1821      let normalized = {};
1822      // apply mixin/extends props
1823      let hasExtends = false;
1824      if ( !isFunction(comp)) {
1825          const extendEmits = (raw) => {
1826              hasExtends = true;
1827              extend(normalized, normalizeEmitsOptions(raw, appContext, true));
1828          };
1829          if (!asMixin && appContext.mixins.length) {
1830              appContext.mixins.forEach(extendEmits);
1831          }
1832          if (comp.extends) {
1833              extendEmits(comp.extends);
1834          }
1835          if (comp.mixins) {
1836              comp.mixins.forEach(extendEmits);
1837          }
1838      }
1839      if (!raw && !hasExtends) {
1840          return (comp.__emits = null);
1841      }
1842      if (isArray(raw)) {
1843          raw.forEach(key => (normalized[key] = null));
1844      }
1845      else {
1846          extend(normalized, raw);
1847      }
1848      return (comp.__emits = normalized);
1849  }
1850  // Check if an incoming prop key is a declared emit event listener.
1851  // e.g. With `emits: { click: null }`, props named `onClick` and `onclick` are
1852  // both considered matched listeners.
1853  function isEmitListener(options, key) {
1854      if (!options || !isOn(key)) {
1855          return false;
1856      }
1857      key = key.replace(/Once$/, '');
1858      return (hasOwn(options, key[2].toLowerCase() + key.slice(3)) ||
1859          hasOwn(options, key.slice(2)));
1860  }
1861
1862  // mark the current rendering instance for asset resolution (e.g.
1863  // resolveComponent, resolveDirective) during render
1864  let currentRenderingInstance = null;
1865  function setCurrentRenderingInstance(instance) {
1866      currentRenderingInstance = instance;
1867  }
1868  // dev only flag to track whether $attrs was used during render.
1869  // If $attrs was used during render then the warning for failed attrs
1870  // fallthrough can be suppressed.
1871  let accessedAttrs = false;
1872  function markAttrsAccessed() {
1873      accessedAttrs = true;
1874  }
1875  function renderComponentRoot(instance) {
1876      const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx } = instance;
1877      let result;
1878      currentRenderingInstance = instance;
1879      {
1880          accessedAttrs = false;
1881      }
1882      try {
1883          let fallthroughAttrs;
1884          if (vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */) {
1885              // withProxy is a proxy with a different `has` trap only for
1886              // runtime-compiled render functions using `with` block.
1887              const proxyToUse = withProxy || proxy;
1888              result = normalizeVNode(render.call(proxyToUse, proxyToUse, renderCache, props, setupState, data, ctx));
1889              fallthroughAttrs = attrs;
1890          }
1891          else {
1892              // functional
1893              const render = Component;
1894              // in dev, mark attrs accessed if optional props (attrs === props)
1895              if (true && attrs === props) {
1896                  markAttrsAccessed();
1897              }
1898              result = normalizeVNode(render.length > 1
1899                  ? render(props, true
1900                      ? {
1901                          get attrs() {
1902                              markAttrsAccessed();
1903                              return attrs;
1904                          },
1905                          slots,
1906                          emit
1907                      }
1908                      : { attrs, slots, emit })
1909                  : render(props, null /* we know it doesn't need it */));
1910              fallthroughAttrs = Component.props
1911                  ? attrs
1912                  : getFunctionalFallthrough(attrs);
1913          }
1914          // attr merging
1915          // in dev mode, comments are preserved, and it's possible for a template
1916          // to have comments along side the root element which makes it a fragment
1917          let root = result;
1918          let setRoot = undefined;
1919          if (true) {
1920              ;
1921              [root, setRoot] = getChildRoot(result);
1922          }
1923          if (Component.inheritAttrs !== false && fallthroughAttrs) {
1924              const keys = Object.keys(fallthroughAttrs);
1925              const { shapeFlag } = root;
1926              if (keys.length) {
1927                  if (shapeFlag & 1 /* ELEMENT */ ||
1928                      shapeFlag & 6 /* COMPONENT */) {
1929                      if (propsOptions && keys.some(isModelListener)) {
1930                          // If a v-model listener (onUpdate:xxx) has a corresponding declared
1931                          // prop, it indicates this component expects to handle v-model and
1932                          // it should not fallthrough.
1933                          // related: #1543, #1643, #1989
1934                          fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
1935                      }
1936                      root = cloneVNode(root, fallthroughAttrs);
1937                  }
1938                  else if (true && !accessedAttrs && root.type !== Comment) {
1939                      const allAttrs = Object.keys(attrs);
1940                      const eventAttrs = [];
1941                      const extraAttrs = [];
1942                      for (let i = 0, l = allAttrs.length; i < l; i++) {
1943                          const key = allAttrs[i];
1944                          if (isOn(key)) {
1945                              // ignore v-model handlers when they fail to fallthrough
1946                              if (!isModelListener(key)) {
1947                                  // remove `on`, lowercase first letter to reflect event casing
1948                                  // accurately
1949                                  eventAttrs.push(key[2].toLowerCase() + key.slice(3));
1950                              }
1951                          }
1952                          else {
1953                              extraAttrs.push(key);
1954                          }
1955                      }
1956                      if (extraAttrs.length) {
1957                          warn(`Extraneous non-props attributes (` +
1958                              `${extraAttrs.join(', ')}) ` +
1959                              `were passed to component but could not be automatically inherited ` +
1960                              `because component renders fragment or text root nodes.`);
1961                      }
1962                      if (eventAttrs.length) {
1963                          warn(`Extraneous non-emits event listeners (` +
1964                              `${eventAttrs.join(', ')}) ` +
1965                              `were passed to component but could not be automatically inherited ` +
1966                              `because component renders fragment or text root nodes. ` +
1967                              `If the listener is intended to be a component custom event listener only, ` +
1968                              `declare it using the "emits" option.`);
1969                      }
1970                  }
1971              }
1972          }
1973          // inherit directives
1974          if (vnode.dirs) {
1975              if (true && !isElementRoot(root)) {
1976                  warn(`Runtime directive used on component with non-element root node. ` +
1977                      `The directives will not function as intended.`);
1978              }
1979              root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
1980          }
1981          // inherit transition data
1982          if (vnode.transition) {
1983              if (true && !isElementRoot(root)) {
1984                  warn(`Component inside <Transition> renders non-element root node ` +
1985                      `that cannot be animated.`);
1986              }
1987              root.transition = vnode.transition;
1988          }
1989          if (true && setRoot) {
1990              setRoot(root);
1991          }
1992          else {
1993              result = root;
1994          }
1995      }
1996      catch (err) {
1997          handleError(err, instance, 1 /* RENDER_FUNCTION */);
1998          result = createVNode(Comment);
1999      }
2000      currentRenderingInstance = null;
2001      return result;
2002  }
2003  /**
2004   * dev only
2005   * In dev mode, template root level comments are rendered, which turns the
2006   * template into a fragment root, but we need to locate the single element
2007   * root for attrs and scope id processing.
2008   */
2009  const getChildRoot = (vnode) => {
2010      if (vnode.type !== Fragment) {
2011          return [vnode, undefined];
2012      }
2013      const rawChildren = vnode.children;
2014      const dynamicChildren = vnode.dynamicChildren;
2015      const childRoot = filterSingleRoot(rawChildren);
2016      if (!childRoot) {
2017          return [vnode, undefined];
2018      }
2019      const index = rawChildren.indexOf(childRoot);
2020      const dynamicIndex = dynamicChildren ? dynamicChildren.indexOf(childRoot) : -1;
2021      const setRoot = (updatedRoot) => {
2022          rawChildren[index] = updatedRoot;
2023          if (dynamicChildren) {
2024              if (dynamicIndex > -1) {
2025                  dynamicChildren[dynamicIndex] = updatedRoot;
2026              }
2027              else if (updatedRoot.patchFlag > 0) {
2028                  vnode.dynamicChildren = [...dynamicChildren, updatedRoot];
2029              }
2030          }
2031      };
2032      return [normalizeVNode(childRoot), setRoot];
2033  };
2034  /**
2035   * dev only
2036   */
2037  function filterSingleRoot(children) {
2038      const filtered = children.filter(child => {
2039          return !(isVNode(child) &&
2040              child.type === Comment &&
2041              child.children !== 'v-if');
2042      });
2043      return filtered.length === 1 && isVNode(filtered[0]) ? filtered[0] : null;
2044  }
2045  const getFunctionalFallthrough = (attrs) => {
2046      let res;
2047      for (const key in attrs) {
2048          if (key === 'class' || key === 'style' || isOn(key)) {
2049              (res || (res = {}))[key] = attrs[key];
2050          }
2051      }
2052      return res;
2053  };
2054  const filterModelListeners = (attrs, props) => {
2055      const res = {};
2056      for (const key in attrs) {
2057          if (!isModelListener(key) || !(key.slice(9) in props)) {
2058              res[key] = attrs[key];
2059          }
2060      }
2061      return res;
2062  };
2063  const isElementRoot = (vnode) => {
2064      return (vnode.shapeFlag & 6 /* COMPONENT */ ||
2065          vnode.shapeFlag & 1 /* ELEMENT */ ||
2066          vnode.type === Comment // potential v-if branch switch
2067      );
2068  };
2069  function shouldUpdateComponent(prevVNode, nextVNode, optimized) {
2070      const { props: prevProps, children: prevChildren, component } = prevVNode;
2071      const { props: nextProps, children: nextChildren, patchFlag } = nextVNode;
2072      const emits = component.emitsOptions;
2073      // Parent component's render function was hot-updated. Since this may have
2074      // caused the child component's slots content to have changed, we need to
2075      // force the child to update as well.
2076      if ( (prevChildren || nextChildren) && isHmrUpdating) {
2077          return true;
2078      }
2079      // force child update for runtime directive or transition on component vnode.
2080      if (nextVNode.dirs || nextVNode.transition) {
2081          return true;
2082      }
2083      if (optimized && patchFlag > 0) {
2084          if (patchFlag & 1024 /* DYNAMIC_SLOTS */) {
2085              // slot content that references values that might have changed,
2086              // e.g. in a v-for
2087              return true;
2088          }
2089          if (patchFlag & 16 /* FULL_PROPS */) {
2090              if (!prevProps) {
2091                  return !!nextProps;
2092              }
2093              // presence of this flag indicates props are always non-null
2094              return hasPropsChanged(prevProps, nextProps, emits);
2095          }
2096          else if (patchFlag & 8 /* PROPS */) {
2097              const dynamicProps = nextVNode.dynamicProps;
2098              for (let i = 0; i < dynamicProps.length; i++) {
2099                  const key = dynamicProps[i];
2100                  if (nextProps[key] !== prevProps[key] &&
2101                      !isEmitListener(emits, key)) {
2102                      return true;
2103                  }
2104              }
2105          }
2106      }
2107      else {
2108          // this path is only taken by manually written render functions
2109          // so presence of any children leads to a forced update
2110          if (prevChildren || nextChildren) {
2111              if (!nextChildren || !nextChildren.$stable) {
2112                  return true;
2113              }
2114          }
2115          if (prevProps === nextProps) {
2116              return false;
2117          }
2118          if (!prevProps) {
2119              return !!nextProps;
2120          }
2121          if (!nextProps) {
2122              return true;
2123          }
2124          return hasPropsChanged(prevProps, nextProps, emits);
2125      }
2126      return false;
2127  }
2128  function hasPropsChanged(prevProps, nextProps, emitsOptions) {
2129      const nextKeys = Object.keys(nextProps);
2130      if (nextKeys.length !== Object.keys(prevProps).length) {
2131          return true;
2132      }
2133      for (let i = 0; i < nextKeys.length; i++) {
2134          const key = nextKeys[i];
2135          if (nextProps[key] !== prevProps[key] &&
2136              !isEmitListener(emitsOptions, key)) {
2137              return true;
2138          }
2139      }
2140      return false;
2141  }
2142  function updateHOCHostEl({ vnode, parent }, el // HostNode
2143  ) {
2144      while (parent && parent.subTree === vnode) {
2145          (vnode = parent.vnode).el = el;
2146          parent = parent.parent;
2147      }
2148  }
2149
2150  const isSuspense = (type) => type.__isSuspense;
2151  // Suspense exposes a component-like API, and is treated like a component
2152  // in the compiler, but internally it's a special built-in type that hooks
2153  // directly into the renderer.
2154  const SuspenseImpl = {
2155      // In order to make Suspense tree-shakable, we need to avoid importing it
2156      // directly in the renderer. The renderer checks for the __isSuspense flag
2157      // on a vnode's type and calls the `process` method, passing in renderer
2158      // internals.
2159      __isSuspense: true,
2160      process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized, 
2161      // platform-specific impl passed from renderer
2162      rendererInternals) {
2163          if (n1 == null) {
2164              mountSuspense(n2, container, anchor, parentComponent, parentSuspense, isSVG, optimized, rendererInternals);
2165          }
2166          else {
2167              patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, rendererInternals);
2168          }
2169      },
2170      hydrate: hydrateSuspense,
2171      create: createSuspenseBoundary
2172  };
2173  // Force-casted public typing for h and TSX props inference
2174  const Suspense = ( SuspenseImpl
2175      );
2176  function mountSuspense(vnode, container, anchor, parentComponent, parentSuspense, isSVG, optimized, rendererInternals) {
2177      const { p: patch, o: { createElement } } = rendererInternals;
2178      const hiddenContainer = createElement('div');
2179      const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, container, hiddenContainer, anchor, isSVG, optimized, rendererInternals));
2180      // start mounting the content subtree in an off-dom container
2181      patch(null, (suspense.pendingBranch = vnode.ssContent), hiddenContainer, null, parentComponent, suspense, isSVG);
2182      // now check if we have encountered any async deps
2183      if (suspense.deps > 0) {
2184          // has async
2185          // mount the fallback tree
2186          patch(null, vnode.ssFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2187          isSVG);
2188          setActiveBranch(suspense, vnode.ssFallback);
2189      }
2190      else {
2191          // Suspense has no async deps. Just resolve.
2192          suspense.resolve();
2193      }
2194  }
2195  function patchSuspense(n1, n2, container, anchor, parentComponent, isSVG, { p: patch, um: unmount, o: { createElement } }) {
2196      const suspense = (n2.suspense = n1.suspense);
2197      suspense.vnode = n2;
2198      n2.el = n1.el;
2199      const newBranch = n2.ssContent;
2200      const newFallback = n2.ssFallback;
2201      const { activeBranch, pendingBranch, isInFallback, isHydrating } = suspense;
2202      if (pendingBranch) {
2203          suspense.pendingBranch = newBranch;
2204          if (isSameVNodeType(newBranch, pendingBranch)) {
2205              // same root type but content may have changed.
2206              patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
2207              if (suspense.deps <= 0) {
2208                  suspense.resolve();
2209              }
2210              else if (isInFallback) {
2211                  patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2212                  isSVG);
2213                  setActiveBranch(suspense, newFallback);
2214              }
2215          }
2216          else {
2217              // toggled before pending tree is resolved
2218              suspense.pendingId++;
2219              if (isHydrating) {
2220                  // if toggled before hydration is finished, the current DOM tree is
2221                  // no longer valid. set it as the active branch so it will be unmounted
2222                  // when resolved
2223                  suspense.isHydrating = false;
2224                  suspense.activeBranch = pendingBranch;
2225              }
2226              else {
2227                  unmount(pendingBranch, parentComponent, suspense);
2228              }
2229              // increment pending ID. this is used to invalidate async callbacks
2230              // reset suspense state
2231              suspense.deps = 0;
2232              // discard effects from pending branch
2233              suspense.effects.length = 0;
2234              // discard previous container
2235              suspense.hiddenContainer = createElement('div');
2236              if (isInFallback) {
2237                  // already in fallback state
2238                  patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
2239                  if (suspense.deps <= 0) {
2240                      suspense.resolve();
2241                  }
2242                  else {
2243                      patch(activeBranch, newFallback, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2244                      isSVG);
2245                      setActiveBranch(suspense, newFallback);
2246                  }
2247              }
2248              else if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2249                  // toggled "back" to current active branch
2250                  patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG);
2251                  // force resolve
2252                  suspense.resolve(true);
2253              }
2254              else {
2255                  // switched to a 3rd branch
2256                  patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
2257                  if (suspense.deps <= 0) {
2258                      suspense.resolve();
2259                  }
2260              }
2261          }
2262      }
2263      else {
2264          if (activeBranch && isSameVNodeType(newBranch, activeBranch)) {
2265              // root did not change, just normal patch
2266              patch(activeBranch, newBranch, container, anchor, parentComponent, suspense, isSVG);
2267              setActiveBranch(suspense, newBranch);
2268          }
2269          else {
2270              // root node toggled
2271              // invoke @pending event
2272              const onPending = n2.props && n2.props.onPending;
2273              if (isFunction(onPending)) {
2274                  onPending();
2275              }
2276              // mount pending branch in off-dom container
2277              suspense.pendingBranch = newBranch;
2278              suspense.pendingId++;
2279              patch(null, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, isSVG);
2280              if (suspense.deps <= 0) {
2281                  // incoming branch has no async deps, resolve now.
2282                  suspense.resolve();
2283              }
2284              else {
2285                  const { timeout, pendingId } = suspense;
2286                  if (timeout > 0) {
2287                      setTimeout(() => {
2288                          if (suspense.pendingId === pendingId) {
2289                              suspense.fallback(newFallback);
2290                          }
2291                      }, timeout);
2292                  }
2293                  else if (timeout === 0) {
2294                      suspense.fallback(newFallback);
2295                  }
2296              }
2297          }
2298      }
2299  }
2300  let hasWarned = false;
2301  function createSuspenseBoundary(vnode, parent, parentComponent, container, hiddenContainer, anchor, isSVG, optimized, rendererInternals, isHydrating = false) {
2302      /* istanbul ignore if */
2303      if ( !hasWarned) {
2304          hasWarned = true;
2305          // @ts-ignore `console.info` cannot be null error
2306          console[console.info ? 'info' : 'log'](`<Suspense> is an experimental feature and its API will likely change.`);
2307      }
2308      const { p: patch, m: move, um: unmount, n: next, o: { parentNode, remove } } = rendererInternals;
2309      const timeout = toNumber(vnode.props && vnode.props.timeout);
2310      const suspense = {
2311          vnode,
2312          parent,
2313          parentComponent,
2314          isSVG,
2315          container,
2316          hiddenContainer,
2317          anchor,
2318          deps: 0,
2319          pendingId: 0,
2320          timeout: typeof timeout === 'number' ? timeout : -1,
2321          activeBranch: null,
2322          pendingBranch: null,
2323          isInFallback: true,
2324          isHydrating,
2325          isUnmounted: false,
2326          effects: [],
2327          resolve(resume = false) {
2328              {
2329                  if (!resume && !suspense.pendingBranch) {
2330                      throw new Error(`suspense.resolve() is called without a pending branch.`);
2331                  }
2332                  if (suspense.isUnmounted) {
2333                      throw new Error(`suspense.resolve() is called on an already unmounted suspense boundary.`);
2334                  }
2335              }
2336              const { vnode, activeBranch, pendingBranch, pendingId, effects, parentComponent, container } = suspense;
2337              if (suspense.isHydrating) {
2338                  suspense.isHydrating = false;
2339              }
2340              else if (!resume) {
2341                  const delayEnter = activeBranch &&
2342                      pendingBranch.transition &&
2343                      pendingBranch.transition.mode === 'out-in';
2344                  if (delayEnter) {
2345                      activeBranch.transition.afterLeave = () => {
2346                          if (pendingId === suspense.pendingId) {
2347                              move(pendingBranch, container, anchor, 0 /* ENTER */);
2348                          }
2349                      };
2350                  }
2351                  // this is initial anchor on mount
2352                  let { anchor } = suspense;
2353                  // unmount current active tree
2354                  if (activeBranch) {
2355                      // if the fallback tree was mounted, it may have been moved
2356                      // as part of a parent suspense. get the latest anchor for insertion
2357                      anchor = next(activeBranch);
2358                      unmount(activeBranch, parentComponent, suspense, true);
2359                  }
2360                  if (!delayEnter) {
2361                      // move content from off-dom container to actual container
2362                      move(pendingBranch, container, anchor, 0 /* ENTER */);
2363                  }
2364              }
2365              setActiveBranch(suspense, pendingBranch);
2366              suspense.pendingBranch = null;
2367              suspense.isInFallback = false;
2368              // flush buffered effects
2369              // check if there is a pending parent suspense
2370              let parent = suspense.parent;
2371              let hasUnresolvedAncestor = false;
2372              while (parent) {
2373                  if (parent.pendingBranch) {
2374                      // found a pending parent suspense, merge buffered post jobs
2375                      // into that parent
2376                      parent.effects.push(...effects);
2377                      hasUnresolvedAncestor = true;
2378                      break;
2379                  }
2380                  parent = parent.parent;
2381              }
2382              // no pending parent suspense, flush all jobs
2383              if (!hasUnresolvedAncestor) {
2384                  queuePostFlushCb(effects);
2385              }
2386              suspense.effects = [];
2387              // invoke @resolve event
2388              const onResolve = vnode.props && vnode.props.onResolve;
2389              if (isFunction(onResolve)) {
2390                  onResolve();
2391              }
2392          },
2393          fallback(fallbackVNode) {
2394              if (!suspense.pendingBranch) {
2395                  return;
2396              }
2397              const { vnode, activeBranch, parentComponent, container, isSVG } = suspense;
2398              // invoke @fallback event
2399              const onFallback = vnode.props && vnode.props.onFallback;
2400              if (isFunction(onFallback)) {
2401                  onFallback();
2402              }
2403              const anchor = next(activeBranch);
2404              const mountFallback = () => {
2405                  if (!suspense.isInFallback) {
2406                      return;
2407                  }
2408                  // mount the fallback tree
2409                  patch(null, fallbackVNode, container, anchor, parentComponent, null, // fallback tree will not have suspense context
2410                  isSVG);
2411                  setActiveBranch(suspense, fallbackVNode);
2412              };
2413              const delayEnter = fallbackVNode.transition && fallbackVNode.transition.mode === 'out-in';
2414              if (delayEnter) {
2415                  activeBranch.transition.afterLeave = mountFallback;
2416              }
2417              // unmount current active branch
2418              unmount(activeBranch, parentComponent, null, // no suspense so unmount hooks fire now
2419              true // shouldRemove
2420              );
2421              suspense.isInFallback = true;
2422              if (!delayEnter) {
2423                  mountFallback();
2424              }
2425          },
2426          move(container, anchor, type) {
2427              suspense.activeBranch &&
2428                  move(suspense.activeBranch, container, anchor, type);
2429              suspense.container = container;
2430          },
2431          next() {
2432              return suspense.activeBranch && next(suspense.activeBranch);
2433          },
2434          registerDep(instance, setupRenderEffect) {
2435              if (!suspense.pendingBranch) {
2436                  return;
2437              }
2438              const hydratedEl = instance.vnode.el;
2439              suspense.deps++;
2440              instance
2441                  .asyncDep.catch(err => {
2442                  handleError(err, instance, 0 /* SETUP_FUNCTION */);
2443              })
2444                  .then(asyncSetupResult => {
2445                  // retry when the setup() promise resolves.
2446                  // component may have been unmounted before resolve.
2447                  if (instance.isUnmounted ||
2448                      suspense.isUnmounted ||
2449                      suspense.pendingId !== instance.suspenseId) {
2450                      return;
2451                  }
2452                  suspense.deps--;
2453                  // retry from this component
2454                  instance.asyncResolved = true;
2455                  const { vnode } = instance;
2456                  {
2457                      pushWarningContext(vnode);
2458                  }
2459                  handleSetupResult(instance, asyncSetupResult);
2460                  if (hydratedEl) {
2461                      // vnode may have been replaced if an update happened before the
2462                      // async dep is resolved.
2463                      vnode.el = hydratedEl;
2464                  }
2465                  const placeholder = !hydratedEl && instance.subTree.el;
2466                  setupRenderEffect(instance, vnode, 
2467                  // component may have been moved before resolve.
2468                  // if this is not a hydration, instance.subTree will be the comment
2469                  // placeholder.
2470                  parentNode(hydratedEl || instance.subTree.el), 
2471                  // anchor will not be used if this is hydration, so only need to
2472                  // consider the comment placeholder case.
2473                  hydratedEl ? null : next(instance.subTree), suspense, isSVG, optimized);
2474                  if (placeholder) {
2475                      remove(placeholder);
2476                  }
2477                  updateHOCHostEl(instance, vnode.el);
2478                  {
2479                      popWarningContext();
2480                  }
2481                  if (suspense.deps === 0) {
2482                      suspense.resolve();
2483                  }
2484              });
2485          },
2486          unmount(parentSuspense, doRemove) {
2487              suspense.isUnmounted = true;
2488              if (suspense.activeBranch) {
2489                  unmount(suspense.activeBranch, parentComponent, parentSuspense, doRemove);
2490              }
2491              if (suspense.pendingBranch) {
2492                  unmount(suspense.pendingBranch, parentComponent, parentSuspense, doRemove);
2493              }
2494          }
2495      };
2496      return suspense;
2497  }
2498  function hydrateSuspense(node, vnode, parentComponent, parentSuspense, isSVG, optimized, rendererInternals, hydrateNode) {
2499      /* eslint-disable no-restricted-globals */
2500      const suspense = (vnode.suspense = createSuspenseBoundary(vnode, parentSuspense, parentComponent, node.parentNode, document.createElement('div'), null, isSVG, optimized, rendererInternals, true /* hydrating */));
2501      // there are two possible scenarios for server-rendered suspense:
2502      // - success: ssr content should be fully resolved
2503      // - failure: ssr content should be the fallback branch.
2504      // however, on the client we don't really know if it has failed or not
2505      // attempt to hydrate the DOM assuming it has succeeded, but we still
2506      // need to construct a suspense boundary first
2507      const result = hydrateNode(node, (suspense.pendingBranch = vnode.ssContent), parentComponent, suspense, optimized);
2508      if (suspense.deps === 0) {
2509          suspense.resolve();
2510      }
2511      return result;
2512      /* eslint-enable no-restricted-globals */
2513  }
2514  function normalizeSuspenseChildren(vnode) {
2515      const { shapeFlag, children } = vnode;
2516      let content;
2517      let fallback;
2518      if (shapeFlag & 32 /* SLOTS_CHILDREN */) {
2519          content = normalizeSuspenseSlot(children.default);
2520          fallback = normalizeSuspenseSlot(children.fallback);
2521      }
2522      else {
2523          content = normalizeSuspenseSlot(children);
2524          fallback = normalizeVNode(null);
2525      }
2526      return {
2527          content,
2528          fallback
2529      };
2530  }
2531  function normalizeSuspenseSlot(s) {
2532      if (isFunction(s)) {
2533          s = s();
2534      }
2535      if (isArray(s)) {
2536          const singleChild = filterSingleRoot(s);
2537          if ( !singleChild) {
2538              warn(`<Suspense> slots expect a single root node.`);
2539          }
2540          s = singleChild;
2541      }
2542      return normalizeVNode(s);
2543  }
2544  function queueEffectWithSuspense(fn, suspense) {
2545      if (suspense && suspense.pendingBranch) {
2546          if (isArray(fn)) {
2547              suspense.effects.push(...fn);
2548          }
2549          else {
2550              suspense.effects.push(fn);
2551          }
2552      }
2553      else {
2554          queuePostFlushCb(fn);
2555      }
2556  }
2557  function setActiveBranch(suspense, branch) {
2558      suspense.activeBranch = branch;
2559      const { vnode, parentComponent } = suspense;
2560      const el = (vnode.el = branch.el);
2561      // in case suspense is the root node of a component,
2562      // recursively update the HOC el
2563      if (parentComponent && parentComponent.subTree === vnode) {
2564          parentComponent.vnode.el = el;
2565          updateHOCHostEl(parentComponent, el);
2566      }
2567  }
2568
2569  let isRenderingCompiledSlot = 0;
2570  const setCompiledSlotRendering = (n) => (isRenderingCompiledSlot += n);
2571  /**
2572   * Compiler runtime helper for rendering `<slot/>`
2573   * @private

2574   */
2575  function renderSlot(slots, name, props = {}, 
2576  // this is not a user-facing function, so the fallback is always generated by
2577  // the compiler and guaranteed to be a function returning an array
2578  fallback) {
2579      let slot = slots[name];
2580      if ( slot && slot.length > 1) {
2581          warn(`SSR-optimized slot function detected in a non-SSR-optimized render ` +
2582              `function. You need to mark this component with $dynamic-slots in the ` +
2583              `parent template.`);
2584          slot = () => [];
2585      }
2586      // a compiled slot disables block tracking by default to avoid manual
2587      // invocation interfering with template-based block tracking, but in
2588      // `renderSlot` we can be sure that it's template-based so we can force
2589      // enable it.
2590      isRenderingCompiledSlot++;
2591      const rendered = (openBlock(),
2592          createBlock(Fragment, { key: props.key }, slot ? slot(props) : fallback ? fallback() : [], slots._ === 1 /* STABLE */
2593              ? 64 /* STABLE_FRAGMENT */
2594              : -2 /* BAIL */));
2595      isRenderingCompiledSlot--;
2596      return rendered;
2597  }
2598
2599  /**
2600   * Wrap a slot function to memoize current rendering instance
2601   * @private

2602   */
2603  function withCtx(fn, ctx = currentRenderingInstance) {
2604      if (!ctx)
2605          return fn;
2606      const renderFnWithContext = (...args) => {
2607          // If a user calls a compiled slot inside a template expression (#1745), it
2608          // can mess up block tracking, so by default we need to push a null block to
2609          // avoid that. This isn't necessary if rendering a compiled `<slot>`.
2610          if (!isRenderingCompiledSlot) {
2611              openBlock(true /* null block that disables tracking */);
2612          }
2613          const owner = currentRenderingInstance;
2614          setCurrentRenderingInstance(ctx);
2615          const res = fn(...args);
2616          setCurrentRenderingInstance(owner);
2617          if (!isRenderingCompiledSlot) {
2618              closeBlock();
2619          }
2620          return res;
2621      };
2622      renderFnWithContext._c = true;
2623      return renderFnWithContext;
2624  }
2625
2626  // SFC scoped style ID management.
2627  let currentScopeId = null;
2628  const scopeIdStack = [];
2629  /**
2630   * @private

2631   */
2632  function pushScopeId(id) {
2633      scopeIdStack.push((currentScopeId = id));
2634  }
2635  /**
2636   * @private

2637   */
2638  function popScopeId() {
2639      scopeIdStack.pop();
2640      currentScopeId = scopeIdStack[scopeIdStack.length - 1] || null;
2641  }
2642  /**
2643   * @private

2644   */
2645  function withScopeId(id) {
2646      return ((fn) => withCtx(function () {
2647          pushScopeId(id);
2648          const res = fn.apply(this, arguments);
2649          popScopeId();
2650          return res;
2651      }));
2652  }
2653
2654  function initProps(instance, rawProps, isStateful, // result of bitwise flag comparison
2655  isSSR = false) {
2656      const props = {};
2657      const attrs = {};
2658      def(attrs, InternalObjectKey, 1);
2659      setFullProps(instance, rawProps, props, attrs);
2660      // validation
2661      {
2662          validateProps(props, instance);
2663      }
2664      if (isStateful) {
2665          // stateful
2666          instance.props = isSSR ? props : shallowReactive(props);
2667      }
2668      else {
2669          if (!instance.type.props) {
2670              // functional w/ optional props, props === attrs
2671              instance.props = attrs;
2672          }
2673          else {
2674              // functional w/ declared props
2675              instance.props = props;
2676          }
2677      }
2678      instance.attrs = attrs;
2679  }
2680  function updateProps(instance, rawProps, rawPrevProps, optimized) {
2681      const { props, attrs, vnode: { patchFlag } } = instance;
2682      const rawCurrentProps = toRaw(props);
2683      const [options] = instance.propsOptions;
2684      if (
2685      // always force full diff in dev
2686      // - #1942 if hmr is enabled with sfc component
2687      // - vite#872 non-sfc component used by sfc component
2688      !(
2689          (instance.type.__hmrId ||
2690              (instance.parent && instance.parent.type.__hmrId))) &&
2691          (optimized || patchFlag > 0) &&
2692          !(patchFlag & 16 /* FULL_PROPS */)) {
2693          if (patchFlag & 8 /* PROPS */) {
2694              // Compiler-generated props & no keys change, just set the updated
2695              // the props.
2696              const propsToUpdate = instance.vnode.dynamicProps;
2697              for (let i = 0; i < propsToUpdate.length; i++) {
2698                  const key = propsToUpdate[i];
2699                  // PROPS flag guarantees rawProps to be non-null
2700                  const value = rawProps[key];
2701                  if (options) {
2702                      // attr / props separation was done on init and will be consistent
2703                      // in this code path, so just check if attrs have it.
2704                      if (hasOwn(attrs, key)) {
2705                          attrs[key] = value;
2706                      }
2707                      else {
2708                          const camelizedKey = camelize(key);
2709                          props[camelizedKey] = resolvePropValue(options, rawCurrentProps, camelizedKey, value, instance);
2710                      }
2711                  }
2712                  else {
2713                      attrs[key] = value;
2714                  }
2715              }
2716          }
2717      }
2718      else {
2719          // full props update.
2720          setFullProps(instance, rawProps, props, attrs);
2721          // in case of dynamic props, check if we need to delete keys from
2722          // the props object
2723          let kebabKey;
2724          for (const key in rawCurrentProps) {
2725              if (!rawProps ||
2726                  // for camelCase
2727                  (!hasOwn(rawProps, key) &&
2728                      // it's possible the original props was passed in as kebab-case
2729                      // and converted to camelCase (#955)
2730                      ((kebabKey = hyphenate(key)) === key || !hasOwn(rawProps, kebabKey)))) {
2731                  if (options) {
2732                      if (rawPrevProps &&
2733                          // for camelCase
2734                          (rawPrevProps[key] !== undefined ||
2735                              // for kebab-case
2736                              rawPrevProps[kebabKey] !== undefined)) {
2737                          props[key] = resolvePropValue(options, rawProps || EMPTY_OBJ, key, undefined, instance);
2738                      }
2739                  }
2740                  else {
2741                      delete props[key];
2742                  }
2743              }
2744          }
2745          // in the case of functional component w/o props declaration, props and
2746          // attrs point to the same object so it should already have been updated.
2747          if (attrs !== rawCurrentProps) {
2748              for (const key in attrs) {
2749                  if (!rawProps || !hasOwn(rawProps, key)) {
2750                      delete attrs[key];
2751                  }
2752              }
2753          }
2754      }
2755      // trigger updates for $attrs in case it's used in component slots
2756      trigger(instance, "set" /* SET */, '$attrs');
2757      if ( rawProps) {
2758          validateProps(props, instance);
2759      }
2760  }
2761  function setFullProps(instance, rawProps, props, attrs) {
2762      const [options, needCastKeys] = instance.propsOptions;
2763      if (rawProps) {
2764          for (const key in rawProps) {
2765              const value = rawProps[key];
2766              // key, ref are reserved and never passed down
2767              if (isReservedProp(key)) {
2768                  continue;
2769              }
2770              // prop option names are camelized during normalization, so to support
2771              // kebab -> camel conversion here we need to camelize the key.
2772              let camelKey;
2773              if (options && hasOwn(options, (camelKey = camelize(key)))) {
2774                  props[camelKey] = value;
2775              }
2776              else if (!isEmitListener(instance.emitsOptions, key)) {
2777                  // Any non-declared (either as a prop or an emitted event) props are put
2778                  // into a separate `attrs` object for spreading. Make sure to preserve
2779                  // original key casing
2780                  attrs[key] = value;
2781              }
2782          }
2783      }
2784      if (needCastKeys) {
2785          const rawCurrentProps = toRaw(props);
2786          for (let i = 0; i < needCastKeys.length; i++) {
2787              const key = needCastKeys[i];
2788              props[key] = resolvePropValue(options, rawCurrentProps, key, rawCurrentProps[key], instance);
2789          }
2790      }
2791  }
2792  function resolvePropValue(options, props, key, value, instance) {
2793      const opt = options[key];
2794      if (opt != null) {
2795          const hasDefault = hasOwn(opt, 'default');
2796          // default values
2797          if (hasDefault && value === undefined) {
2798              const defaultValue = opt.default;
2799              if (opt.type !== Function && isFunction(defaultValue)) {
2800                  setCurrentInstance(instance);
2801                  value = defaultValue(props);
2802                  setCurrentInstance(null);
2803              }
2804              else {
2805                  value = defaultValue;
2806              }
2807          }
2808          // boolean casting
2809          if (opt[0 /* shouldCast */]) {
2810              if (!hasOwn(props, key) && !hasDefault) {
2811                  value = false;
2812              }
2813              else if (opt[1 /* shouldCastTrue */] &&
2814                  (value === '' || value === hyphenate(key))) {
2815                  value = true;
2816              }
2817          }
2818      }
2819      return value;
2820  }
2821  function normalizePropsOptions(comp, appContext, asMixin = false) {
2822      if (!appContext.deopt && comp.__props) {
2823          return comp.__props;
2824      }
2825      const raw = comp.props;
2826      const normalized = {};
2827      const needCastKeys = [];
2828      // apply mixin/extends props
2829      let hasExtends = false;
2830      if ( !isFunction(comp)) {
2831          const extendProps = (raw) => {
2832              hasExtends = true;
2833              const [props, keys] = normalizePropsOptions(raw, appContext, true);
2834              extend(normalized, props);
2835              if (keys)
2836                  needCastKeys.push(...keys);
2837          };
2838          if (!asMixin && appContext.mixins.length) {
2839              appContext.mixins.forEach(extendProps);
2840          }
2841          if (comp.extends) {
2842              extendProps(comp.extends);
2843          }
2844          if (comp.mixins) {
2845              comp.mixins.forEach(extendProps);
2846          }
2847      }
2848      if (!raw && !hasExtends) {
2849          return (comp.__props = EMPTY_ARR);
2850      }
2851      if (isArray(raw)) {
2852          for (let i = 0; i < raw.length; i++) {
2853              if ( !isString(raw[i])) {
2854                  warn(`props must be strings when using array syntax.`, raw[i]);
2855              }
2856              const normalizedKey = camelize(raw[i]);
2857              if (validatePropName(normalizedKey)) {
2858                  normalized[normalizedKey] = EMPTY_OBJ;
2859              }
2860          }
2861      }
2862      else if (raw) {
2863          if ( !isObject(raw)) {
2864              warn(`invalid props options`, raw);
2865          }
2866          for (const key in raw) {
2867              const normalizedKey = camelize(key);
2868              if (validatePropName(normalizedKey)) {
2869                  const opt = raw[key];
2870                  const prop = (normalized[normalizedKey] =
2871                      isArray(opt) || isFunction(opt) ? { type: opt } : opt);
2872                  if (prop) {
2873                      const booleanIndex = getTypeIndex(Boolean, prop.type);
2874                      const stringIndex = getTypeIndex(String, prop.type);
2875                      prop[0 /* shouldCast */] = booleanIndex > -1;
2876                      prop[1 /* shouldCastTrue */] =
2877                          stringIndex < 0 || booleanIndex < stringIndex;
2878                      // if the prop needs boolean casting or default value
2879                      if (booleanIndex > -1 || hasOwn(prop, 'default')) {
2880                          needCastKeys.push(normalizedKey);
2881                      }
2882                  }
2883              }
2884          }
2885      }
2886      return (comp.__props = [normalized, needCastKeys]);
2887  }
2888  function validatePropName(key) {
2889      if (key[0] !== '$') {
2890          return true;
2891      }
2892      else {
2893          warn(`Invalid prop name: "${key}" is a reserved property.`);
2894      }
2895      return false;
2896  }
2897  // use function string name to check type constructors
2898  // so that it works across vms / iframes.
2899  function getType(ctor) {
2900      const match = ctor && ctor.toString().match(/^\s*function (\w+)/);
2901      return match ? match[1] : '';
2902  }
2903  function isSameType(a, b) {
2904      return getType(a) === getType(b);
2905  }
2906  function getTypeIndex(type, expectedTypes) {
2907      if (isArray(expectedTypes)) {
2908          for (let i = 0, len = expectedTypes.length; i < len; i++) {
2909              if (isSameType(expectedTypes[i], type)) {
2910                  return i;
2911              }
2912          }
2913      }
2914      else if (isFunction(expectedTypes)) {
2915          return isSameType(expectedTypes, type) ? 0 : -1;
2916      }
2917      return -1;
2918  }
2919  /**
2920   * dev only
2921   */
2922  function validateProps(props, instance) {
2923      const rawValues = toRaw(props);
2924      const options = instance.propsOptions[0];
2925      for (const key in options) {
2926          let opt = options[key];
2927          if (opt == null)
2928              continue;
2929          validateProp(key, rawValues[key], opt, !hasOwn(rawValues, key));
2930      }
2931  }
2932  /**
2933   * dev only
2934   */
2935  function validateProp(name, value, prop, isAbsent) {
2936      const { type, required, validator } = prop;
2937      // required!
2938      if (required && isAbsent) {
2939          warn('Missing required prop: "' + name + '"');
2940          return;
2941      }
2942      // missing but optional
2943      if (value == null && !prop.required) {
2944          return;
2945      }
2946      // type check
2947      if (type != null && type !== true) {
2948          let isValid = false;
2949          const types = isArray(type) ? type : [type];
2950          const expectedTypes = [];
2951          // value is valid as long as one of the specified types match
2952          for (let i = 0; i < types.length && !isValid; i++) {
2953              const { valid, expectedType } = assertType(value, types[i]);
2954              expectedTypes.push(expectedType || '');
2955              isValid = valid;
2956          }
2957          if (!isValid) {
2958              warn(getInvalidTypeMessage(name, value, expectedTypes));
2959              return;
2960          }
2961      }
2962      // custom validator
2963      if (validator && !validator(value)) {
2964          warn('Invalid prop: custom validator check failed for prop "' + name + '".');
2965      }
2966  }
2967  const isSimpleType = /*#__PURE__*/ makeMap('String,Number,Boolean,Function,Symbol');
2968  /**
2969   * dev only
2970   */
2971  function assertType(value, type) {
2972      let valid;
2973      const expectedType = getType(type);
2974      if (isSimpleType(expectedType)) {
2975          const t = typeof value;
2976          valid = t === expectedType.toLowerCase();
2977          // for primitive wrapper objects
2978          if (!valid && t === 'object') {
2979              valid = value instanceof type;
2980          }
2981      }
2982      else if (expectedType === 'Object') {
2983          valid = isObject(value);
2984      }
2985      else if (expectedType === 'Array') {
2986          valid = isArray(value);
2987      }
2988      else {
2989          valid = value instanceof type;
2990      }
2991      return {
2992          valid,
2993          expectedType
2994      };
2995  }
2996  /**
2997   * dev only
2998   */
2999  function getInvalidTypeMessage(name, value, expectedTypes) {
3000      let message = `Invalid prop: type check failed for prop "${name}".` +
3001          ` Expected ${expectedTypes.map(capitalize).join(', ')}`;
3002      const expectedType = expectedTypes[0];
3003      const receivedType = toRawType(value);
3004      const expectedValue = styleValue(value, expectedType);
3005      const receivedValue = styleValue(value, receivedType);
3006      // check if we need to specify expected value
3007      if (expectedTypes.length === 1 &&
3008          isExplicable(expectedType) &&
3009          !isBoolean(expectedType, receivedType)) {
3010          message += ` with value ${expectedValue}`;
3011      }
3012      message += `, got ${receivedType} `;
3013      // check if we need to specify received value
3014      if (isExplicable(receivedType)) {
3015          message += `with value ${receivedValue}.`;
3016      }
3017      return message;
3018  }
3019  /**
3020   * dev only
3021   */
3022  function styleValue(value, type) {
3023      if (type === 'String') {
3024          return `"${value}"`;
3025      }
3026      else if (type === 'Number') {
3027          return `${Number(value)}`;
3028      }
3029      else {
3030          return `${value}`;
3031      }
3032  }
3033  /**
3034   * dev only
3035   */
3036  function isExplicable(type) {
3037      const explicitTypes = ['string', 'number', 'boolean'];
3038      return explicitTypes.some(elem => type.toLowerCase() === elem);
3039  }
3040  /**
3041   * dev only
3042   */
3043  function isBoolean(...args) {
3044      return args.some(elem => elem.toLowerCase() === 'boolean');
3045  }
3046
3047  function injectHook(type, hook, target = currentInstance, prepend = false) {
3048      if (target) {
3049          const hooks = target[type] || (target[type] = []);
3050          // cache the error handling wrapper for injected hooks so the same hook
3051          // can be properly deduped by the scheduler. "__weh" stands for "with error
3052          // handling".
3053          const wrappedHook = hook.__weh ||
3054              (hook.__weh = (...args) => {
3055                  if (target.isUnmounted) {
3056                      return;
3057                  }
3058                  // disable tracking inside all lifecycle hooks
3059                  // since they can potentially be called inside effects.
3060                  pauseTracking();
3061                  // Set currentInstance during hook invocation.
3062                  // This assumes the hook does not synchronously trigger other hooks, which
3063                  // can only be false when the user does something really funky.
3064                  setCurrentInstance(target);
3065                  const res = callWithAsyncErrorHandling(hook, target, type, args);
3066                  setCurrentInstance(null);
3067                  resetTracking();
3068                  return res;
3069              });
3070          if (prepend) {
3071              hooks.unshift(wrappedHook);
3072          }
3073          else {
3074              hooks.push(wrappedHook);
3075          }
3076          return wrappedHook;
3077      }
3078      else {
3079          const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ''));
3080          warn(`${apiName} is called when there is no active component instance to be ` +
3081              `associated with. ` +
3082              `Lifecycle injection APIs can only be used during execution of setup().` +
3083              ( ` If you are using async setup(), make sure to register lifecycle ` +
3084                      `hooks before the first await statement.`
3085                  ));
3086      }
3087  }
3088  const createHook = (lifecycle) => (hook, target = currentInstance) => 
3089  // post-create lifecycle registrations are noops during SSR
3090  !isInSSRComponentSetup && injectHook(lifecycle, hook, target);
3091  const onBeforeMount = createHook("bm" /* BEFORE_MOUNT */);
3092  const onMounted = createHook("m" /* MOUNTED */);
3093  const onBeforeUpdate = createHook("bu" /* BEFORE_UPDATE */);
3094  const onUpdated = createHook("u" /* UPDATED */);
3095  const onBeforeUnmount = createHook("bum" /* BEFORE_UNMOUNT */);
3096  const onUnmounted = createHook("um" /* UNMOUNTED */);
3097  const onRenderTriggered = createHook("rtg" /* RENDER_TRIGGERED */);
3098  const onRenderTracked = createHook("rtc" /* RENDER_TRACKED */);
3099  const onErrorCaptured = (hook, target = currentInstance) => {
3100      injectHook("ec" /* ERROR_CAPTURED */, hook, target);
3101  };
3102
3103  // Simple effect.
3104  function watchEffect(effect, options) {
3105      return doWatch(effect, null, options);
3106  }
3107  // initial value for watchers to trigger on undefined initial values
3108  const INITIAL_WATCHER_VALUE = {};
3109  // implementation
3110  function watch(source, cb, options) {
3111      if ( !isFunction(cb)) {
3112          warn(`\`watch(fn, options?)\` signature has been moved to a separate API. ` +
3113              `Use \`watchEffect(fn, options?)\` instead. \`watch\` now only ` +
3114              `supports \`watch(source, cb, options?) signature.`);
3115      }
3116      return doWatch(source, cb, options);
3117  }
3118  function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EMPTY_OBJ, instance = currentInstance) {
3119      if ( !cb) {
3120          if (immediate !== undefined) {
3121              warn(`watch() "immediate" option is only respected when using the ` +
3122                  `watch(source, callback, options?) signature.`);
3123          }
3124          if (deep !== undefined) {
3125              warn(`watch() "deep" option is only respected when using the ` +
3126                  `watch(source, callback, options?) signature.`);
3127          }
3128      }
3129      const warnInvalidSource = (s) => {
3130          warn(`Invalid watch source: `, s, `A watch source can only be a getter/effect function, a ref, ` +
3131              `a reactive object, or an array of these types.`);
3132      };
3133      let getter;
3134      let forceTrigger = false;
3135      if (isRef(source)) {
3136          getter = () => source.value;
3137          forceTrigger = !!source._shallow;
3138      }
3139      else if (isReactive(source)) {
3140          getter = () => source;
3141          deep = true;
3142      }
3143      else if (isArray(source)) {
3144          getter = () => source.map(s => {
3145              if (isRef(s)) {
3146                  return s.value;
3147              }
3148              else if (isReactive(s)) {
3149                  return traverse(s);
3150              }
3151              else if (isFunction(s)) {
3152                  return callWithErrorHandling(s, instance, 2 /* WATCH_GETTER */);
3153              }
3154              else {
3155                   warnInvalidSource(s);
3156              }
3157          });
3158      }
3159      else if (isFunction(source)) {
3160          if (cb) {
3161              // getter with cb
3162              getter = () => callWithErrorHandling(source, instance, 2 /* WATCH_GETTER */);
3163          }
3164          else {
3165              // no cb -> simple effect
3166              getter = () => {
3167                  if (instance && instance.isUnmounted) {
3168                      return;
3169                  }
3170                  if (cleanup) {
3171                      cleanup();
3172                  }
3173                  return callWithErrorHandling(source, instance, 3 /* WATCH_CALLBACK */, [onInvalidate]);
3174              };
3175          }
3176      }
3177      else {
3178          getter = NOOP;
3179           warnInvalidSource(source);
3180      }
3181      if (cb && deep) {
3182          const baseGetter = getter;
3183          getter = () => traverse(baseGetter());
3184      }
3185      let cleanup;
3186      const onInvalidate = (fn) => {
3187          cleanup = runner.options.onStop = () => {
3188              callWithErrorHandling(fn, instance, 4 /* WATCH_CLEANUP */);
3189          };
3190      };
3191      let oldValue = isArray(source) ? [] : INITIAL_WATCHER_VALUE;
3192      const job = () => {
3193          if (!runner.active) {
3194              return;
3195          }
3196          if (cb) {
3197              // watch(source, cb)
3198              const newValue = runner();
3199              if (deep || forceTrigger || hasChanged(newValue, oldValue)) {
3200                  // cleanup before running cb again
3201                  if (cleanup) {
3202                      cleanup();
3203                  }
3204                  callWithAsyncErrorHandling(cb, instance, 3 /* WATCH_CALLBACK */, [
3205                      newValue,
3206                      // pass undefined as the old value when it's changed for the first time
3207                      oldValue === INITIAL_WATCHER_VALUE ? undefined : oldValue,
3208                      onInvalidate
3209                  ]);
3210                  oldValue = newValue;
3211              }
3212          }
3213          else {
3214              // watchEffect
3215              runner();
3216          }
3217      };
3218      // important: mark the job as a watcher callback so that scheduler knows
3219      // it is allowed to self-trigger (#1727)
3220      job.allowRecurse = !!cb;
3221      let scheduler;
3222      if (flush === 'sync') {
3223          scheduler = job;
3224      }