@vue/compat 3.2.9 → 3.2.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1485,7 +1485,8 @@ class ComputedRefImpl {
1485
1485
  function computed(getterOrOptions, debugOptions) {
1486
1486
  let getter;
1487
1487
  let setter;
1488
- if (isFunction(getterOrOptions)) {
1488
+ const onlyGetter = isFunction(getterOrOptions);
1489
+ if (onlyGetter) {
1489
1490
  getter = getterOrOptions;
1490
1491
  setter = () => {
1491
1492
  console.warn('Write operation failed: computed value is readonly');
@@ -1496,7 +1497,7 @@ function computed(getterOrOptions, debugOptions) {
1496
1497
  getter = getterOrOptions.get;
1497
1498
  setter = getterOrOptions.set;
1498
1499
  }
1499
- const cRef = new ComputedRefImpl(getter, setter, isFunction(getterOrOptions) || !getterOrOptions.set);
1500
+ const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter);
1500
1501
  if (debugOptions) {
1501
1502
  cRef.effect.onTrack = debugOptions.onTrack;
1502
1503
  cRef.effect.onTrigger = debugOptions.onTrigger;
@@ -1531,41 +1532,33 @@ function registerHMR(instance) {
1531
1532
  const id = instance.type.__hmrId;
1532
1533
  let record = map.get(id);
1533
1534
  if (!record) {
1534
- createRecord(id, instance.type);
1535
+ createRecord(id);
1535
1536
  record = map.get(id);
1536
1537
  }
1537
- record.instances.add(instance);
1538
+ record.add(instance);
1538
1539
  }
1539
1540
  function unregisterHMR(instance) {
1540
- map.get(instance.type.__hmrId).instances.delete(instance);
1541
+ map.get(instance.type.__hmrId).delete(instance);
1541
1542
  }
1542
- function createRecord(id, component) {
1543
- if (!component) {
1544
- warn$1(`HMR API usage is out of date.\n` +
1545
- `Please upgrade vue-loader/vite/rollup-plugin-vue or other relevant ` +
1546
- `dependency that handles Vue SFC compilation.`);
1547
- component = {};
1548
- }
1543
+ function createRecord(id) {
1549
1544
  if (map.has(id)) {
1550
1545
  return false;
1551
1546
  }
1552
- map.set(id, {
1553
- component: isClassComponent(component) ? component.__vccOpts : component,
1554
- instances: new Set()
1555
- });
1547
+ map.set(id, new Set());
1556
1548
  return true;
1557
1549
  }
1550
+ function normalizeClassComponent(component) {
1551
+ return isClassComponent(component) ? component.__vccOpts : component;
1552
+ }
1558
1553
  function rerender(id, newRender) {
1559
1554
  const record = map.get(id);
1560
- if (!record)
1555
+ if (!record) {
1561
1556
  return;
1562
- if (newRender)
1563
- record.component.render = newRender;
1564
- // Array.from creates a snapshot which avoids the set being mutated during
1565
- // updates
1566
- Array.from(record.instances).forEach(instance => {
1557
+ }
1558
+ [...record].forEach(instance => {
1567
1559
  if (newRender) {
1568
1560
  instance.render = newRender;
1561
+ normalizeClassComponent(instance.type).render = newRender;
1569
1562
  }
1570
1563
  instance.renderCache = [];
1571
1564
  // this flag forces child components with slot content to update
@@ -1578,34 +1571,31 @@ function reload(id, newComp) {
1578
1571
  const record = map.get(id);
1579
1572
  if (!record)
1580
1573
  return;
1581
- // Array.from creates a snapshot which avoids the set being mutated during
1582
- // updates
1583
- const { component, instances } = record;
1584
- if (!hmrDirtyComponents.has(component)) {
1585
- // 1. Update existing comp definition to match new one
1586
- newComp = isClassComponent(newComp) ? newComp.__vccOpts : newComp;
1587
- extend(component, newComp);
1588
- for (const key in component) {
1589
- if (key !== '__file' && !(key in newComp)) {
1590
- delete component[key];
1591
- }
1592
- }
1593
- // 2. Mark component dirty. This forces the renderer to replace the component
1594
- // on patch.
1595
- hmrDirtyComponents.add(component);
1596
- // 3. Make sure to unmark the component after the reload.
1597
- queuePostFlushCb(() => {
1598
- hmrDirtyComponents.delete(component);
1599
- });
1600
- }
1601
- Array.from(instances).forEach(instance => {
1602
- // invalidate options resolution cache
1574
+ newComp = normalizeClassComponent(newComp);
1575
+ // create a snapshot which avoids the set being mutated during updates
1576
+ const instances = [...record];
1577
+ for (const instance of instances) {
1578
+ const oldComp = normalizeClassComponent(instance.type);
1579
+ if (!hmrDirtyComponents.has(oldComp)) {
1580
+ // 1. Update existing comp definition to match new one
1581
+ extend(oldComp, newComp);
1582
+ for (const key in oldComp) {
1583
+ if (key !== '__file' && !(key in newComp)) {
1584
+ delete oldComp[key];
1585
+ }
1586
+ }
1587
+ // 2. mark definition dirty. This forces the renderer to replace the
1588
+ // component on patch.
1589
+ hmrDirtyComponents.add(oldComp);
1590
+ }
1591
+ // 3. invalidate options resolution cache
1603
1592
  instance.appContext.optionsCache.delete(instance.type);
1593
+ // 4. actually update
1604
1594
  if (instance.ceReload) {
1605
1595
  // custom element
1606
- hmrDirtyComponents.add(component);
1596
+ hmrDirtyComponents.add(oldComp);
1607
1597
  instance.ceReload(newComp.styles);
1608
- hmrDirtyComponents.delete(component);
1598
+ hmrDirtyComponents.delete(oldComp);
1609
1599
  }
1610
1600
  else if (instance.parent) {
1611
1601
  // 4. Force the parent instance to re-render. This will cause all updated
@@ -1630,6 +1620,12 @@ function reload(id, newComp) {
1630
1620
  else {
1631
1621
  console.warn('[HMR] Root or manually mounted instance modified. Full reload required.');
1632
1622
  }
1623
+ }
1624
+ // 5. make sure to cleanup dirty hmr components after update
1625
+ queuePostFlushCb(() => {
1626
+ for (const instance of instances) {
1627
+ hmrDirtyComponents.delete(normalizeClassComponent(instance.type));
1628
+ }
1633
1629
  });
1634
1630
  }
1635
1631
  function tryWrap(fn) {
@@ -1956,7 +1952,7 @@ const deprecationData = {
1956
1952
  ["PRIVATE_APIS" /* PRIVATE_APIS */]: {
1957
1953
  message: name => `"${name}" is a Vue 2 private API that no longer exists in Vue 3. ` +
1958
1954
  `If you are seeing this warning only due to a dependency, you can ` +
1959
- `suppress this warning via { PRIVATE_APIS: 'supress-warning' }.`
1955
+ `suppress this warning via { PRIVATE_APIS: 'suppress-warning' }.`
1960
1956
  }
1961
1957
  };
1962
1958
  const instanceWarned = Object.create(null);
@@ -2443,12 +2439,12 @@ function markAttrsAccessed() {
2443
2439
  function renderComponentRoot(instance) {
2444
2440
  const { type: Component, vnode, proxy, withProxy, props, propsOptions: [propsOptions], slots, attrs, emit, render, renderCache, data, setupState, ctx, inheritAttrs } = instance;
2445
2441
  let result;
2442
+ let fallthroughAttrs;
2446
2443
  const prev = setCurrentRenderingInstance(instance);
2447
2444
  {
2448
2445
  accessedAttrs = false;
2449
2446
  }
2450
2447
  try {
2451
- let fallthroughAttrs;
2452
2448
  if (vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */) {
2453
2449
  // withProxy is a proxy with a different `has` trap only for
2454
2450
  // runtime-compiled render functions using `with` block.
@@ -2479,108 +2475,105 @@ function renderComponentRoot(instance) {
2479
2475
  ? attrs
2480
2476
  : getFunctionalFallthrough(attrs);
2481
2477
  }
2482
- // attr merging
2483
- // in dev mode, comments are preserved, and it's possible for a template
2484
- // to have comments along side the root element which makes it a fragment
2485
- let root = result;
2486
- let setRoot = undefined;
2487
- if (true &&
2488
- result.patchFlag > 0 &&
2489
- result.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
2490
- ;
2491
- [root, setRoot] = getChildRoot(result);
2492
- }
2493
- if (fallthroughAttrs && inheritAttrs !== false) {
2494
- const keys = Object.keys(fallthroughAttrs);
2495
- const { shapeFlag } = root;
2496
- if (keys.length) {
2497
- if (shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
2498
- if (propsOptions && keys.some(isModelListener)) {
2499
- // If a v-model listener (onUpdate:xxx) has a corresponding declared
2500
- // prop, it indicates this component expects to handle v-model and
2501
- // it should not fallthrough.
2502
- // related: #1543, #1643, #1989
2503
- fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
2504
- }
2505
- root = cloneVNode(root, fallthroughAttrs);
2506
- }
2507
- else if (true && !accessedAttrs && root.type !== Comment) {
2508
- const allAttrs = Object.keys(attrs);
2509
- const eventAttrs = [];
2510
- const extraAttrs = [];
2511
- for (let i = 0, l = allAttrs.length; i < l; i++) {
2512
- const key = allAttrs[i];
2513
- if (isOn(key)) {
2514
- // ignore v-model handlers when they fail to fallthrough
2515
- if (!isModelListener(key)) {
2516
- // remove `on`, lowercase first letter to reflect event casing
2517
- // accurately
2518
- eventAttrs.push(key[2].toLowerCase() + key.slice(3));
2519
- }
2520
- }
2521
- else {
2522
- extraAttrs.push(key);
2478
+ }
2479
+ catch (err) {
2480
+ blockStack.length = 0;
2481
+ handleError(err, instance, 1 /* RENDER_FUNCTION */);
2482
+ result = createVNode(Comment);
2483
+ }
2484
+ // attr merging
2485
+ // in dev mode, comments are preserved, and it's possible for a template
2486
+ // to have comments along side the root element which makes it a fragment
2487
+ let root = result;
2488
+ let setRoot = undefined;
2489
+ if (result.patchFlag > 0 &&
2490
+ result.patchFlag & 2048 /* DEV_ROOT_FRAGMENT */) {
2491
+ [root, setRoot] = getChildRoot(result);
2492
+ }
2493
+ if (fallthroughAttrs && inheritAttrs !== false) {
2494
+ const keys = Object.keys(fallthroughAttrs);
2495
+ const { shapeFlag } = root;
2496
+ if (keys.length) {
2497
+ if (shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
2498
+ if (propsOptions && keys.some(isModelListener)) {
2499
+ // If a v-model listener (onUpdate:xxx) has a corresponding declared
2500
+ // prop, it indicates this component expects to handle v-model and
2501
+ // it should not fallthrough.
2502
+ // related: #1543, #1643, #1989
2503
+ fallthroughAttrs = filterModelListeners(fallthroughAttrs, propsOptions);
2504
+ }
2505
+ root = cloneVNode(root, fallthroughAttrs);
2506
+ }
2507
+ else if (!accessedAttrs && root.type !== Comment) {
2508
+ const allAttrs = Object.keys(attrs);
2509
+ const eventAttrs = [];
2510
+ const extraAttrs = [];
2511
+ for (let i = 0, l = allAttrs.length; i < l; i++) {
2512
+ const key = allAttrs[i];
2513
+ if (isOn(key)) {
2514
+ // ignore v-model handlers when they fail to fallthrough
2515
+ if (!isModelListener(key)) {
2516
+ // remove `on`, lowercase first letter to reflect event casing
2517
+ // accurately
2518
+ eventAttrs.push(key[2].toLowerCase() + key.slice(3));
2523
2519
  }
2524
2520
  }
2525
- if (extraAttrs.length) {
2526
- warn$1(`Extraneous non-props attributes (` +
2527
- `${extraAttrs.join(', ')}) ` +
2528
- `were passed to component but could not be automatically inherited ` +
2529
- `because component renders fragment or text root nodes.`);
2530
- }
2531
- if (eventAttrs.length) {
2532
- warn$1(`Extraneous non-emits event listeners (` +
2533
- `${eventAttrs.join(', ')}) ` +
2534
- `were passed to component but could not be automatically inherited ` +
2535
- `because component renders fragment or text root nodes. ` +
2536
- `If the listener is intended to be a component custom event listener only, ` +
2537
- `declare it using the "emits" option.`);
2521
+ else {
2522
+ extraAttrs.push(key);
2538
2523
  }
2539
2524
  }
2540
- }
2541
- }
2542
- if (true &&
2543
- isCompatEnabled("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance) &&
2544
- vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */ &&
2545
- root.shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
2546
- const { class: cls, style } = vnode.props || {};
2547
- if (cls || style) {
2548
- if (true && inheritAttrs === false) {
2549
- warnDeprecation("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance, getComponentName(instance.type));
2525
+ if (extraAttrs.length) {
2526
+ warn$1(`Extraneous non-props attributes (` +
2527
+ `${extraAttrs.join(', ')}) ` +
2528
+ `were passed to component but could not be automatically inherited ` +
2529
+ `because component renders fragment or text root nodes.`);
2530
+ }
2531
+ if (eventAttrs.length) {
2532
+ warn$1(`Extraneous non-emits event listeners (` +
2533
+ `${eventAttrs.join(', ')}) ` +
2534
+ `were passed to component but could not be automatically inherited ` +
2535
+ `because component renders fragment or text root nodes. ` +
2536
+ `If the listener is intended to be a component custom event listener only, ` +
2537
+ `declare it using the "emits" option.`);
2550
2538
  }
2551
- root = cloneVNode(root, {
2552
- class: cls,
2553
- style: style
2554
- });
2555
- }
2556
- }
2557
- // inherit directives
2558
- if (vnode.dirs) {
2559
- if (true && !isElementRoot(root)) {
2560
- warn$1(`Runtime directive used on component with non-element root node. ` +
2561
- `The directives will not function as intended.`);
2562
2539
  }
2563
- root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
2564
2540
  }
2565
- // inherit transition data
2566
- if (vnode.transition) {
2567
- if (true && !isElementRoot(root)) {
2568
- warn$1(`Component inside <Transition> renders non-element root node ` +
2569
- `that cannot be animated.`);
2541
+ }
2542
+ if (isCompatEnabled("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance) &&
2543
+ vnode.shapeFlag & 4 /* STATEFUL_COMPONENT */ &&
2544
+ root.shapeFlag & (1 /* ELEMENT */ | 6 /* COMPONENT */)) {
2545
+ const { class: cls, style } = vnode.props || {};
2546
+ if (cls || style) {
2547
+ if (inheritAttrs === false) {
2548
+ warnDeprecation("INSTANCE_ATTRS_CLASS_STYLE" /* INSTANCE_ATTRS_CLASS_STYLE */, instance, getComponentName(instance.type));
2570
2549
  }
2571
- root.transition = vnode.transition;
2550
+ root = cloneVNode(root, {
2551
+ class: cls,
2552
+ style: style
2553
+ });
2572
2554
  }
2573
- if (true && setRoot) {
2574
- setRoot(root);
2555
+ }
2556
+ // inherit directives
2557
+ if (vnode.dirs) {
2558
+ if (!isElementRoot(root)) {
2559
+ warn$1(`Runtime directive used on component with non-element root node. ` +
2560
+ `The directives will not function as intended.`);
2575
2561
  }
2576
- else {
2577
- result = root;
2562
+ root.dirs = root.dirs ? root.dirs.concat(vnode.dirs) : vnode.dirs;
2563
+ }
2564
+ // inherit transition data
2565
+ if (vnode.transition) {
2566
+ if (!isElementRoot(root)) {
2567
+ warn$1(`Component inside <Transition> renders non-element root node ` +
2568
+ `that cannot be animated.`);
2578
2569
  }
2570
+ root.transition = vnode.transition;
2579
2571
  }
2580
- catch (err) {
2581
- blockStack.length = 0;
2582
- handleError(err, instance, 1 /* RENDER_FUNCTION */);
2583
- result = createVNode(Comment);
2572
+ if (setRoot) {
2573
+ setRoot(root);
2574
+ }
2575
+ else {
2576
+ result = root;
2584
2577
  }
2585
2578
  setCurrentRenderingInstance(prev);
2586
2579
  return result;
@@ -3115,8 +3108,8 @@ function normalizeSuspenseChildren(vnode) {
3115
3108
  function normalizeSuspenseSlot(s) {
3116
3109
  let block;
3117
3110
  if (isFunction(s)) {
3118
- const isCompiledSlot = s._c;
3119
- if (isCompiledSlot) {
3111
+ const trackBlock = isBlockTreeEnabled && s._c;
3112
+ if (trackBlock) {
3120
3113
  // disableTracking: false
3121
3114
  // allow block tracking for compiled slots
3122
3115
  // (see ./componentRenderContext.ts)
@@ -3124,7 +3117,7 @@ function normalizeSuspenseSlot(s) {
3124
3117
  openBlock();
3125
3118
  }
3126
3119
  s = s();
3127
- if (isCompiledSlot) {
3120
+ if (trackBlock) {
3128
3121
  s._d = true;
3129
3122
  block = currentBlock;
3130
3123
  closeBlock();
@@ -5280,7 +5273,7 @@ function createCompatVue(createApp, createSingletonApp) {
5280
5273
  return vm;
5281
5274
  }
5282
5275
  }
5283
- Vue.version = "3.2.9";
5276
+ Vue.version = "3.2.13";
5284
5277
  Vue.config = singletonApp.config;
5285
5278
  Vue.use = (p, ...options) => {
5286
5279
  if (p && isFunction(p.install)) {
@@ -5811,7 +5804,7 @@ function createAppAPI(render, hydrate) {
5811
5804
  app._instance = vnode.component;
5812
5805
  devtoolsInitApp(app, version);
5813
5806
  }
5814
- return vnode.component.proxy;
5807
+ return getExposeProxy(vnode.component) || vnode.component.proxy;
5815
5808
  }
5816
5809
  else {
5817
5810
  warn$1(`App has already been mounted.\n` +
@@ -6020,14 +6013,14 @@ function createHydrationFunctions(rendererInternals) {
6020
6013
  for (const key in props) {
6021
6014
  if ((forcePatchValue && key.endsWith('value')) ||
6022
6015
  (isOn(key) && !isReservedProp(key))) {
6023
- patchProp(el, key, null, props[key]);
6016
+ patchProp(el, key, null, props[key], false, undefined, parentComponent);
6024
6017
  }
6025
6018
  }
6026
6019
  }
6027
6020
  else if (props.onClick) {
6028
6021
  // Fast path for click listeners (which is most often) to avoid
6029
6022
  // iterating through props.
6030
- patchProp(el, 'onClick', null, props.onClick);
6023
+ patchProp(el, 'onClick', null, props.onClick, false, undefined, parentComponent);
6031
6024
  }
6032
6025
  }
6033
6026
  // vnode / directive hooks
@@ -7928,7 +7921,11 @@ function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false
7928
7921
  return Component;
7929
7922
  }
7930
7923
  if (warnMissing && !res) {
7931
- warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}`);
7924
+ const extra = type === COMPONENTS
7925
+ ? `\nIf this is a native custom element, make sure to exclude it from ` +
7926
+ `component resolution via compilerOptions.isCustomElement.`
7927
+ : ``;
7928
+ warn$1(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
7932
7929
  }
7933
7930
  return res;
7934
7931
  }
@@ -9370,17 +9367,19 @@ function exposePropsOnRenderContext(instance) {
9370
9367
  function exposeSetupStateOnRenderContext(instance) {
9371
9368
  const { ctx, setupState } = instance;
9372
9369
  Object.keys(toRaw(setupState)).forEach(key => {
9373
- if (!setupState.__isScriptSetup && (key[0] === '$' || key[0] === '_')) {
9374
- warn$1(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
9375
- `which are reserved prefixes for Vue internals.`);
9376
- return;
9370
+ if (!setupState.__isScriptSetup) {
9371
+ if (key[0] === '$' || key[0] === '_') {
9372
+ warn$1(`setup() return property ${JSON.stringify(key)} should not start with "$" or "_" ` +
9373
+ `which are reserved prefixes for Vue internals.`);
9374
+ return;
9375
+ }
9376
+ Object.defineProperty(ctx, key, {
9377
+ enumerable: true,
9378
+ configurable: true,
9379
+ get: () => setupState[key],
9380
+ set: NOOP
9381
+ });
9377
9382
  }
9378
- Object.defineProperty(ctx, key, {
9379
- enumerable: true,
9380
- configurable: true,
9381
- get: () => setupState[key],
9382
- set: NOOP
9383
- });
9384
9383
  });
9385
9384
  }
9386
9385
 
@@ -10139,11 +10138,18 @@ function flushJobs(seen) {
10139
10138
  // 2. If a component is unmounted during a parent component's update,
10140
10139
  // its update can be skipped.
10141
10140
  queue.sort((a, b) => getId(a) - getId(b));
10141
+ // conditional usage of checkRecursiveUpdate must be determined out of
10142
+ // try ... catch block since Rollup by default de-optimizes treeshaking
10143
+ // inside try-catch. This can leave all warning code unshaked. Although
10144
+ // they would get eventually shaken by a minifier like terser, some minifiers
10145
+ // would fail to do that (e.g. https://github.com/evanw/esbuild/issues/1610)
10146
+ const check = (job) => checkRecursiveUpdates(seen, job)
10147
+ ;
10142
10148
  try {
10143
10149
  for (flushIndex = 0; flushIndex < queue.length; flushIndex++) {
10144
10150
  const job = queue[flushIndex];
10145
10151
  if (job && job.active !== false) {
10146
- if (true && checkRecursiveUpdates(seen, job)) {
10152
+ if (true && check(job)) {
10147
10153
  continue;
10148
10154
  }
10149
10155
  // console.log(`running:`, job.id)
@@ -10420,7 +10426,7 @@ function createPathGetter(ctx, path) {
10420
10426
  return cur;
10421
10427
  };
10422
10428
  }
10423
- function traverse(value, seen = new Set()) {
10429
+ function traverse(value, seen) {
10424
10430
  if (!isObject(value) || value["__v_skip" /* SKIP */]) {
10425
10431
  return value;
10426
10432
  }
@@ -10836,7 +10842,7 @@ function isMemoSame(cached, memo) {
10836
10842
  }
10837
10843
 
10838
10844
  // Core API ------------------------------------------------------------------
10839
- const version = "3.2.9";
10845
+ const version = "3.2.13";
10840
10846
  /**
10841
10847
  * SSR utils for \@vue/server-renderer. Only exposed in cjs builds.
10842
10848
  * @internal
@@ -10965,19 +10971,13 @@ function patchClass(el, value, isSVG) {
10965
10971
 
10966
10972
  function patchStyle(el, prev, next) {
10967
10973
  const style = el.style;
10974
+ const currentDisplay = style.display;
10968
10975
  if (!next) {
10969
10976
  el.removeAttribute('style');
10970
10977
  }
10971
10978
  else if (isString(next)) {
10972
10979
  if (prev !== next) {
10973
- const current = style.display;
10974
10980
  style.cssText = next;
10975
- // indicates that the `display` of the element is controlled by `v-show`,
10976
- // so we always keep the current `display` value regardless of the `style` value,
10977
- // thus handing over control to `v-show`.
10978
- if ('_vod' in el) {
10979
- style.display = current;
10980
- }
10981
10981
  }
10982
10982
  }
10983
10983
  else {
@@ -10992,6 +10992,12 @@ function patchStyle(el, prev, next) {
10992
10992
  }
10993
10993
  }
10994
10994
  }
10995
+ // indicates that the `display` of the element is controlled by `v-show`,
10996
+ // so we always keep the current `display` value regardless of the `style` value,
10997
+ // thus handing over control to `v-show`.
10998
+ if ('_vod' in el) {
10999
+ style.display = currentDisplay;
11000
+ }
10995
11001
  }
10996
11002
  const importantRE = /\s*!important$/;
10997
11003
  function setStyle(style, name, val) {
@@ -11362,6 +11368,7 @@ class VueElement extends BaseClass {
11362
11368
  this._instance = null;
11363
11369
  this._connected = false;
11364
11370
  this._resolved = false;
11371
+ this._numberProps = null;
11365
11372
  if (this.shadowRoot && hydrate) {
11366
11373
  hydrate(this._createVNode(), this.shadowRoot);
11367
11374
  }
@@ -11377,18 +11384,17 @@ class VueElement extends BaseClass {
11377
11384
  this._setAttr(this.attributes[i].name);
11378
11385
  }
11379
11386
  // watch future attr changes
11380
- const observer = new MutationObserver(mutations => {
11387
+ new MutationObserver(mutations => {
11381
11388
  for (const m of mutations) {
11382
11389
  this._setAttr(m.attributeName);
11383
11390
  }
11384
- });
11385
- observer.observe(this, { attributes: true });
11391
+ }).observe(this, { attributes: true });
11386
11392
  }
11387
11393
  connectedCallback() {
11388
11394
  this._connected = true;
11389
11395
  if (!this._instance) {
11390
11396
  this._resolveDef();
11391
- render(this._createVNode(), this.shadowRoot);
11397
+ this._update();
11392
11398
  }
11393
11399
  }
11394
11400
  disconnectedCallback() {
@@ -11409,15 +11415,31 @@ class VueElement extends BaseClass {
11409
11415
  }
11410
11416
  const resolve = (def) => {
11411
11417
  this._resolved = true;
11418
+ const { props, styles } = def;
11419
+ const hasOptions = !isArray(props);
11420
+ const rawKeys = props ? (hasOptions ? Object.keys(props) : props) : [];
11421
+ // cast Number-type props set before resolve
11422
+ let numberProps;
11423
+ if (hasOptions) {
11424
+ for (const key in this._props) {
11425
+ const opt = props[key];
11426
+ if (opt === Number || (opt && opt.type === Number)) {
11427
+ this._props[key] = toNumber(this._props[key]);
11428
+ (numberProps || (numberProps = Object.create(null)))[key] = true;
11429
+ }
11430
+ }
11431
+ }
11432
+ if (numberProps) {
11433
+ this._numberProps = numberProps;
11434
+ this._update();
11435
+ }
11412
11436
  // check if there are props set pre-upgrade or connect
11413
11437
  for (const key of Object.keys(this)) {
11414
11438
  if (key[0] !== '_') {
11415
11439
  this._setProp(key, this[key]);
11416
11440
  }
11417
11441
  }
11418
- const { props, styles } = def;
11419
11442
  // defining getter/setters on prototype
11420
- const rawKeys = props ? (isArray(props) ? props : Object.keys(props)) : [];
11421
11443
  for (const key of rawKeys.map(camelize)) {
11422
11444
  Object.defineProperty(this, key, {
11423
11445
  get() {
@@ -11439,7 +11461,11 @@ class VueElement extends BaseClass {
11439
11461
  }
11440
11462
  }
11441
11463
  _setAttr(key) {
11442
- this._setProp(camelize(key), toNumber(this.getAttribute(key)), false);
11464
+ let value = this.getAttribute(key);
11465
+ if (this._numberProps && this._numberProps[key]) {
11466
+ value = toNumber(value);
11467
+ }
11468
+ this._setProp(camelize(key), value, false);
11443
11469
  }
11444
11470
  /**
11445
11471
  * @internal
@@ -11454,7 +11480,7 @@ class VueElement extends BaseClass {
11454
11480
  if (val !== this._props[key]) {
11455
11481
  this._props[key] = val;
11456
11482
  if (this._instance) {
11457
- render(this._createVNode(), this.shadowRoot);
11483
+ this._update();
11458
11484
  }
11459
11485
  // reflect
11460
11486
  if (shouldReflect) {
@@ -11470,6 +11496,9 @@ class VueElement extends BaseClass {
11470
11496
  }
11471
11497
  }
11472
11498
  }
11499
+ _update() {
11500
+ render(this._createVNode(), this.shadowRoot);
11501
+ }
11473
11502
  _createVNode() {
11474
11503
  const vnode = createVNode(this._def, extend({}, this._props));
11475
11504
  if (!this._instance) {
@@ -11490,7 +11519,7 @@ class VueElement extends BaseClass {
11490
11519
  if (!this._def.__asyncLoader) {
11491
11520
  // reload
11492
11521
  this._instance = null;
11493
- render(this._createVNode(), this.shadowRoot);
11522
+ this._update();
11494
11523
  }
11495
11524
  };
11496
11525
  }
@@ -12797,7 +12826,7 @@ const errorMessages = {
12797
12826
  // transform errors
12798
12827
  [28 /* X_V_IF_NO_EXPRESSION */]: `v-if/v-else-if is missing expression.`,
12799
12828
  [29 /* X_V_IF_SAME_KEY */]: `v-if/else branches must use unique keys.`,
12800
- [30 /* X_V_ELSE_NO_ADJACENT_IF */]: `v-else/v-else-if has no adjacent v-if.`,
12829
+ [30 /* X_V_ELSE_NO_ADJACENT_IF */]: `v-else/v-else-if has no adjacent v-if or v-else-if.`,
12801
12830
  [31 /* X_V_FOR_NO_EXPRESSION */]: `v-for is missing expression.`,
12802
12831
  [32 /* X_V_FOR_MALFORMED_EXPRESSION */]: `v-for has invalid expression.`,
12803
12832
  [33 /* X_V_FOR_TEMPLATE_KEY_PLACEMENT */]: `<template v-for> key should be placed on the <template> tag.`,
@@ -13075,7 +13104,7 @@ const whitespaceRE = /\s+[.[]\s*|\s*[.[]\s+/g;
13075
13104
  * inside square brackets), but it's ok since these are only used on template
13076
13105
  * expressions and false positives are invalid expressions in the first place.
13077
13106
  */
13078
- const isMemberExpression = (path) => {
13107
+ const isMemberExpressionBrowser = (path) => {
13079
13108
  // remove whitespaces around . or [ first
13080
13109
  path = path.trim().replace(whitespaceRE, s => s.trim());
13081
13110
  let state = 0 /* inMemberExp */;
@@ -13145,6 +13174,8 @@ const isMemberExpression = (path) => {
13145
13174
  }
13146
13175
  return !currentOpenBracketCount && !currentOpenParensCount;
13147
13176
  };
13177
+ const isMemberExpression = isMemberExpressionBrowser
13178
+ ;
13148
13179
  function getInnerRange(loc, offset, length) {
13149
13180
  const source = loc.source.substr(offset, length);
13150
13181
  const newLoc = {
@@ -13948,6 +13979,13 @@ function parseAttributes(context, type) {
13948
13979
  emitError(context, 3 /* END_TAG_WITH_ATTRIBUTES */);
13949
13980
  }
13950
13981
  const attr = parseAttribute(context, attributeNames);
13982
+ // Trim whitespace between class
13983
+ // https://github.com/vuejs/vue-next/issues/4251
13984
+ if (attr.type === 6 /* ATTRIBUTE */ &&
13985
+ attr.value &&
13986
+ attr.name === 'class') {
13987
+ attr.value.content = attr.value.content.replace(/\s+/g, ' ').trim();
13988
+ }
13951
13989
  if (type === 0 /* Start */) {
13952
13990
  props.push(attr);
13953
13991
  }
@@ -14010,8 +14048,11 @@ function parseAttribute(context, nameSet) {
14010
14048
  isStatic = false;
14011
14049
  if (!content.endsWith(']')) {
14012
14050
  emitError(context, 27 /* X_MISSING_DYNAMIC_DIRECTIVE_ARGUMENT_END */);
14051
+ content = content.substr(1);
14052
+ }
14053
+ else {
14054
+ content = content.substr(1, content.length - 2);
14013
14055
  }
14014
- content = content.substr(1, content.length - 2);
14015
14056
  }
14016
14057
  else if (isSlot) {
14017
14058
  // #1241 special case for v-slot: vuetify relies extensively on slot
@@ -14281,7 +14322,7 @@ function walk$1(node, context, doNotHoistNode = false) {
14281
14322
  // This is only a concern for pre-stringification (via transformHoist by
14282
14323
  // @vue/compiler-dom), but doing it here allows us to perform only one full
14283
14324
  // walk of the AST and allow `stringifyStatic` to stop walking as soon as its
14284
- // stringficiation threshold is met.
14325
+ // stringification threshold is met.
14285
14326
  let canStringify = true;
14286
14327
  const { children } = node;
14287
14328
  const originalCount = children.length;
@@ -14527,7 +14568,7 @@ function getGeneratedPropsConstantType(node, context) {
14527
14568
  else if (value.type === 14 /* JS_CALL_EXPRESSION */) {
14528
14569
  // some helper calls can be hoisted,
14529
14570
  // such as the `normalizeProps` generated by the compiler for pre-normalize class,
14530
- // in this case we need to respect the ConstanType of the helper's argments
14571
+ // in this case we need to respect the ConstantType of the helper's argments
14531
14572
  valueType = getConstantTypeOfHelperCall(value, context);
14532
14573
  }
14533
14574
  else {
@@ -15040,13 +15081,14 @@ function genHoists(hoists, context) {
15040
15081
  context.pure = true;
15041
15082
  const { push, newline, helper, scopeId, mode } = context;
15042
15083
  newline();
15043
- hoists.forEach((exp, i) => {
15084
+ for (let i = 0; i < hoists.length; i++) {
15085
+ const exp = hoists[i];
15044
15086
  if (exp) {
15045
- push(`const _hoisted_${i + 1} = `);
15087
+ push(`const _hoisted_${i + 1} = ${``}`);
15046
15088
  genNode(exp, context);
15047
15089
  newline();
15048
15090
  }
15049
- });
15091
+ }
15050
15092
  context.pure = false;
15051
15093
  }
15052
15094
  function isText$1(n) {
@@ -15553,6 +15595,11 @@ function processIf(node, dir, context, processCodegen) {
15553
15595
  continue;
15554
15596
  }
15555
15597
  if (sibling && sibling.type === 9 /* IF */) {
15598
+ // Check if v-else was followed by v-else-if
15599
+ if (dir.name === 'else-if' &&
15600
+ sibling.branches[sibling.branches.length - 1].condition === undefined) {
15601
+ context.onError(createCompilerError(30 /* X_V_ELSE_NO_ADJACENT_IF */, node.loc));
15602
+ }
15556
15603
  // move the node to the if node's branches
15557
15604
  context.removeNode();
15558
15605
  const branch = createIfBranch(node, dir);
@@ -16644,7 +16691,7 @@ function dedupeProperties(properties) {
16644
16691
  const name = prop.key.content;
16645
16692
  const existing = knownProps.get(name);
16646
16693
  if (existing) {
16647
- if (name === 'style' || name === 'class' || name.startsWith('on')) {
16694
+ if (name === 'style' || name === 'class' || isOn(name)) {
16648
16695
  mergeAsArray$1(existing, prop);
16649
16696
  }
16650
16697
  // unexpected duplicate, should have emitted error during parse
@@ -16719,26 +16766,24 @@ const transformSlotOutlet = (node, context) => {
16719
16766
  const { slotName, slotProps } = processSlotOutlet(node, context);
16720
16767
  const slotArgs = [
16721
16768
  context.prefixIdentifiers ? `_ctx.$slots` : `$slots`,
16722
- slotName
16769
+ slotName,
16770
+ '{}',
16771
+ 'undefined',
16772
+ 'true'
16723
16773
  ];
16774
+ let expectedLen = 2;
16724
16775
  if (slotProps) {
16725
- slotArgs.push(slotProps);
16776
+ slotArgs[2] = slotProps;
16777
+ expectedLen = 3;
16726
16778
  }
16727
16779
  if (children.length) {
16728
- if (!slotProps) {
16729
- slotArgs.push(`{}`);
16730
- }
16731
- slotArgs.push(createFunctionExpression([], children, false, false, loc));
16780
+ slotArgs[3] = createFunctionExpression([], children, false, false, loc);
16781
+ expectedLen = 4;
16732
16782
  }
16733
16783
  if (context.scopeId && !context.slotted) {
16734
- if (!slotProps) {
16735
- slotArgs.push(`{}`);
16736
- }
16737
- if (!children.length) {
16738
- slotArgs.push(`undefined`);
16739
- }
16740
- slotArgs.push(`true`);
16784
+ expectedLen = 5;
16741
16785
  }
16786
+ slotArgs.splice(expectedLen); // remove unused arguments
16742
16787
  node.codegenNode = createCallExpression(context.helper(RENDER_SLOT), slotArgs, loc);
16743
16788
  }
16744
16789
  };
@@ -16785,7 +16830,7 @@ function processSlotOutlet(node, context) {
16785
16830
  };
16786
16831
  }
16787
16832
 
16788
- const fnExpRE = /^\s*([\w$_]+|\([^)]*?\))\s*=>|^\s*function(?:\s+[\w$]+)?\s*\(/;
16833
+ const fnExpRE = /^\s*([\w$_]+|(async\s*)?\([^)]*?\))\s*=>|^\s*(async\s+)?function(?:\s+[\w$]+)?\s*\(/;
16789
16834
  const transformOn = (dir, node, context, augmentor) => {
16790
16835
  const { loc, modifiers, arg } = dir;
16791
16836
  if (!dir.exp && !modifiers.length) {
@@ -17040,7 +17085,8 @@ const transformModel = (dir, node, context) => {
17040
17085
  // _unref(exp)
17041
17086
  context.bindingMetadata[rawExp];
17042
17087
  const maybeRef = !true /* SETUP_CONST */;
17043
- if (!expString.trim() || (!isMemberExpression(expString) && !maybeRef)) {
17088
+ if (!expString.trim() ||
17089
+ (!isMemberExpression(expString) && !maybeRef)) {
17044
17090
  context.onError(createCompilerError(42 /* X_V_MODEL_MALFORMED_EXPRESSION */, exp.loc));
17045
17091
  return createTransformProps();
17046
17092
  }
@@ -17746,7 +17792,8 @@ const warnTransitionChildren = (node, context) => {
17746
17792
  };
17747
17793
  function hasMultipleChildren(node) {
17748
17794
  // #1352 filter out potential comment nodes.
17749
- const children = (node.children = node.children.filter(c => c.type !== 3 /* COMMENT */));
17795
+ const children = (node.children = node.children.filter(c => c.type !== 3 /* COMMENT */ &&
17796
+ !(c.type === 2 /* TEXT */ && !c.content.trim())));
17750
17797
  const child = children[0];
17751
17798
  return (children.length !== 1 ||
17752
17799
  child.type === 11 /* FOR */ ||