@vue/compat 3.3.7 → 3.3.9

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.
@@ -104,7 +104,7 @@ const PatchFlagNames = {
104
104
  [4]: `STYLE`,
105
105
  [8]: `PROPS`,
106
106
  [16]: `FULL_PROPS`,
107
- [32]: `HYDRATE_EVENTS`,
107
+ [32]: `NEED_HYDRATION`,
108
108
  [64]: `STABLE_FRAGMENT`,
109
109
  [128]: `KEYED_FRAGMENT`,
110
110
  [256]: `UNKEYED_FRAGMENT`,
@@ -1005,7 +1005,7 @@ function createReadonlyMethod(type) {
1005
1005
  toRaw(this)
1006
1006
  );
1007
1007
  }
1008
- return type === "delete" ? false : this;
1008
+ return type === "delete" ? false : type === "clear" ? void 0 : this;
1009
1009
  };
1010
1010
  }
1011
1011
  function createInstrumentations() {
@@ -2746,9 +2746,19 @@ function renderComponentRoot(instance) {
2746
2746
  try {
2747
2747
  if (vnode.shapeFlag & 4) {
2748
2748
  const proxyToUse = withProxy || proxy;
2749
+ const thisProxy = !!(process.env.NODE_ENV !== "production") && setupState.__isScriptSetup ? new Proxy(proxyToUse, {
2750
+ get(target, key, receiver) {
2751
+ warn(
2752
+ `Property '${String(
2753
+ key
2754
+ )}' was accessed via 'this'. Avoid using 'this' in templates.`
2755
+ );
2756
+ return Reflect.get(target, key, receiver);
2757
+ }
2758
+ }) : proxyToUse;
2749
2759
  result = normalizeVNode(
2750
2760
  render.call(
2751
- proxyToUse,
2761
+ thisProxy,
2752
2762
  proxyToUse,
2753
2763
  renderCache,
2754
2764
  props,
@@ -2999,6 +3009,65 @@ function updateHOCHostEl({ vnode, parent }, el) {
2999
3009
  }
3000
3010
  }
3001
3011
 
3012
+ const COMPONENTS = "components";
3013
+ const DIRECTIVES = "directives";
3014
+ const FILTERS = "filters";
3015
+ function resolveComponent(name, maybeSelfReference) {
3016
+ return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
3017
+ }
3018
+ const NULL_DYNAMIC_COMPONENT = Symbol.for("v-ndc");
3019
+ function resolveDynamicComponent(component) {
3020
+ if (isString(component)) {
3021
+ return resolveAsset(COMPONENTS, component, false) || component;
3022
+ } else {
3023
+ return component || NULL_DYNAMIC_COMPONENT;
3024
+ }
3025
+ }
3026
+ function resolveDirective(name) {
3027
+ return resolveAsset(DIRECTIVES, name);
3028
+ }
3029
+ function resolveFilter$1(name) {
3030
+ return resolveAsset(FILTERS, name);
3031
+ }
3032
+ function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
3033
+ const instance = currentRenderingInstance || currentInstance;
3034
+ if (instance) {
3035
+ const Component = instance.type;
3036
+ if (type === COMPONENTS) {
3037
+ const selfName = getComponentName(
3038
+ Component,
3039
+ false
3040
+ /* do not include inferred name to avoid breaking existing code */
3041
+ );
3042
+ if (selfName && (selfName === name || selfName === camelize(name) || selfName === capitalize(camelize(name)))) {
3043
+ return Component;
3044
+ }
3045
+ }
3046
+ const res = (
3047
+ // local registration
3048
+ // check instance[type] first which is resolved for options API
3049
+ resolve(instance[type] || Component[type], name) || // global registration
3050
+ resolve(instance.appContext[type], name)
3051
+ );
3052
+ if (!res && maybeSelfReference) {
3053
+ return Component;
3054
+ }
3055
+ if (!!(process.env.NODE_ENV !== "production") && warnMissing && !res) {
3056
+ const extra = type === COMPONENTS ? `
3057
+ If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.` : ``;
3058
+ warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
3059
+ }
3060
+ return res;
3061
+ } else if (!!(process.env.NODE_ENV !== "production")) {
3062
+ warn(
3063
+ `resolve${capitalize(type.slice(0, -1))} can only be used in render() or setup().`
3064
+ );
3065
+ }
3066
+ }
3067
+ function resolve(registry, name) {
3068
+ return registry && (registry[name] || registry[camelize(name)] || registry[capitalize(camelize(name))]);
3069
+ }
3070
+
3002
3071
  const isSuspense = (type) => type.__isSuspense;
3003
3072
  const SuspenseImpl = {
3004
3073
  name: "Suspense",
@@ -3533,7 +3602,7 @@ function normalizeSuspenseSlot(s) {
3533
3602
  }
3534
3603
  if (isArray(s)) {
3535
3604
  const singleChild = filterSingleRoot(s);
3536
- if (!!(process.env.NODE_ENV !== "production") && !singleChild) {
3605
+ if (!!(process.env.NODE_ENV !== "production") && !singleChild && s.filter((child) => child !== NULL_DYNAMIC_COMPONENT).length > 0) {
3537
3606
  warn(`<Suspense> slots expect a single root node.`);
3538
3607
  }
3539
3608
  s = singleChild;
@@ -3719,6 +3788,7 @@ function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EM
3719
3788
  let onCleanup = (fn) => {
3720
3789
  cleanup = effect.onStop = () => {
3721
3790
  callWithErrorHandling(fn, instance, 4);
3791
+ cleanup = effect.onStop = void 0;
3722
3792
  };
3723
3793
  };
3724
3794
  let ssrCleanup;
@@ -4218,7 +4288,11 @@ function emptyPlaceholder(vnode) {
4218
4288
  }
4219
4289
  }
4220
4290
  function getKeepAliveChild(vnode) {
4221
- return isKeepAlive(vnode) ? vnode.children ? vnode.children[0] : void 0 : vnode;
4291
+ return isKeepAlive(vnode) ? (
4292
+ // #7121 ensure get the child component subtree in case
4293
+ // it's been replaced during HMR
4294
+ !!(process.env.NODE_ENV !== "production") && vnode.component ? vnode.component.subTree : vnode.children ? vnode.children[0] : void 0
4295
+ ) : vnode;
4222
4296
  }
4223
4297
  function setTransitionHooks(vnode, hooks) {
4224
4298
  if (vnode.shapeFlag & 6 && vnode.component) {
@@ -4739,65 +4813,6 @@ function getCompatListeners(instance) {
4739
4813
  return listeners;
4740
4814
  }
4741
4815
 
4742
- const COMPONENTS = "components";
4743
- const DIRECTIVES = "directives";
4744
- const FILTERS = "filters";
4745
- function resolveComponent(name, maybeSelfReference) {
4746
- return resolveAsset(COMPONENTS, name, true, maybeSelfReference) || name;
4747
- }
4748
- const NULL_DYNAMIC_COMPONENT = Symbol.for("v-ndc");
4749
- function resolveDynamicComponent(component) {
4750
- if (isString(component)) {
4751
- return resolveAsset(COMPONENTS, component, false) || component;
4752
- } else {
4753
- return component || NULL_DYNAMIC_COMPONENT;
4754
- }
4755
- }
4756
- function resolveDirective(name) {
4757
- return resolveAsset(DIRECTIVES, name);
4758
- }
4759
- function resolveFilter$1(name) {
4760
- return resolveAsset(FILTERS, name);
4761
- }
4762
- function resolveAsset(type, name, warnMissing = true, maybeSelfReference = false) {
4763
- const instance = currentRenderingInstance || currentInstance;
4764
- if (instance) {
4765
- const Component = instance.type;
4766
- if (type === COMPONENTS) {
4767
- const selfName = getComponentName(
4768
- Component,
4769
- false
4770
- /* do not include inferred name to avoid breaking existing code */
4771
- );
4772
- if (selfName && (selfName === name || selfName === camelize(name) || selfName === capitalize(camelize(name)))) {
4773
- return Component;
4774
- }
4775
- }
4776
- const res = (
4777
- // local registration
4778
- // check instance[type] first which is resolved for options API
4779
- resolve(instance[type] || Component[type], name) || // global registration
4780
- resolve(instance.appContext[type], name)
4781
- );
4782
- if (!res && maybeSelfReference) {
4783
- return Component;
4784
- }
4785
- if (!!(process.env.NODE_ENV !== "production") && warnMissing && !res) {
4786
- const extra = type === COMPONENTS ? `
4787
- If this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement.` : ``;
4788
- warn(`Failed to resolve ${type.slice(0, -1)}: ${name}${extra}`);
4789
- }
4790
- return res;
4791
- } else if (!!(process.env.NODE_ENV !== "production")) {
4792
- warn(
4793
- `resolve${capitalize(type.slice(0, -1))} can only be used in render() or setup().`
4794
- );
4795
- }
4796
- }
4797
- function resolve(registry, name) {
4798
- return registry && (registry[name] || registry[camelize(name)] || registry[capitalize(camelize(name))]);
4799
- }
4800
-
4801
4816
  function convertLegacyRenderFn(instance) {
4802
4817
  const Component2 = instance.type;
4803
4818
  const render = Component2.render;
@@ -6302,7 +6317,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
6302
6317
  return vm;
6303
6318
  }
6304
6319
  }
6305
- Vue.version = `2.6.14-compat:${"3.3.7"}`;
6320
+ Vue.version = `2.6.14-compat:${"3.3.9"}`;
6306
6321
  Vue.config = singletonApp.config;
6307
6322
  Vue.use = (p, ...options) => {
6308
6323
  if (p && isFunction(p.install)) {
@@ -7333,6 +7348,9 @@ function assertType(value, type) {
7333
7348
  };
7334
7349
  }
7335
7350
  function getInvalidTypeMessage(name, value, expectedTypes) {
7351
+ if (expectedTypes.length === 0) {
7352
+ return `Prop type [] for prop "${name}" won't match anything. Did you mean to use type Array instead?`;
7353
+ }
7336
7354
  let message = `Invalid prop: type check failed for prop "${name}". Expected ${expectedTypes.map(capitalize).join(" | ")}`;
7337
7355
  const expectedType = expectedTypes[0];
7338
7356
  const receivedType = toRawType(value);
@@ -7604,6 +7622,20 @@ function createHydrationFunctions(rendererInternals) {
7604
7622
  const { type, ref, shapeFlag, patchFlag } = vnode;
7605
7623
  let domType = node.nodeType;
7606
7624
  vnode.el = node;
7625
+ if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) {
7626
+ if (!("__vnode" in node)) {
7627
+ Object.defineProperty(node, "__vnode", {
7628
+ value: vnode,
7629
+ enumerable: false
7630
+ });
7631
+ }
7632
+ if (!("__vueParentComponent" in node)) {
7633
+ Object.defineProperty(node, "__vueParentComponent", {
7634
+ value: parentComponent,
7635
+ enumerable: false
7636
+ });
7637
+ }
7638
+ }
7607
7639
  if (patchFlag === -2) {
7608
7640
  optimized = false;
7609
7641
  vnode.dynamicChildren = null;
@@ -7634,15 +7666,15 @@ function createHydrationFunctions(rendererInternals) {
7634
7666
  }
7635
7667
  break;
7636
7668
  case Comment:
7637
- if (domType !== 8 /* COMMENT */ || isFragmentStart) {
7638
- if (node.tagName.toLowerCase() === "template") {
7639
- const content = vnode.el.content.firstChild;
7640
- replaceNode(content, node, parentComponent);
7641
- vnode.el = node = content;
7642
- nextNode = nextSibling(node);
7643
- } else {
7644
- nextNode = onMismatch();
7645
- }
7669
+ if (isTemplateNode(node)) {
7670
+ nextNode = nextSibling(node);
7671
+ replaceNode(
7672
+ vnode.el = node.content.firstChild,
7673
+ node,
7674
+ parentComponent
7675
+ );
7676
+ } else if (domType !== 8 /* COMMENT */ || isFragmentStart) {
7677
+ nextNode = onMismatch();
7646
7678
  } else {
7647
7679
  nextNode = nextSibling(node);
7648
7680
  }
@@ -7765,15 +7797,16 @@ function createHydrationFunctions(rendererInternals) {
7765
7797
  const hydrateElement = (el, vnode, parentComponent, parentSuspense, slotScopeIds, optimized) => {
7766
7798
  optimized = optimized || !!vnode.dynamicChildren;
7767
7799
  const { type, props, patchFlag, shapeFlag, dirs, transition } = vnode;
7768
- const forcePatchValue = type === "input" && dirs || type === "option";
7769
- if (!!(process.env.NODE_ENV !== "production") || forcePatchValue || patchFlag !== -1) {
7800
+ const forcePatch = type === "input" || type === "option";
7801
+ if (!!(process.env.NODE_ENV !== "production") || forcePatch || patchFlag !== -1) {
7770
7802
  if (dirs) {
7771
7803
  invokeDirectiveHook(vnode, null, parentComponent, "created");
7772
7804
  }
7773
7805
  if (props) {
7774
- if (forcePatchValue || !optimized || patchFlag & (16 | 32)) {
7806
+ if (forcePatch || !optimized || patchFlag & (16 | 32)) {
7775
7807
  for (const key in props) {
7776
- if (forcePatchValue && key.endsWith("value") || isOn(key) && !isReservedProp(key)) {
7808
+ if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
7809
+ key[0] === ".") {
7777
7810
  patchProp(
7778
7811
  el,
7779
7812
  key,
@@ -7986,8 +8019,7 @@ function createHydrationFunctions(rendererInternals) {
7986
8019
  let parent = parentComponent;
7987
8020
  while (parent) {
7988
8021
  if (parent.vnode.el === oldNode) {
7989
- parent.vnode.el = newNode;
7990
- parent.subTree.el = newNode;
8022
+ parent.vnode.el = parent.subTree.el = newNode;
7991
8023
  }
7992
8024
  parent = parent.parent;
7993
8025
  }
@@ -9599,6 +9631,7 @@ const resolveTarget = (props, select) => {
9599
9631
  }
9600
9632
  };
9601
9633
  const TeleportImpl = {
9634
+ name: "Teleport",
9602
9635
  __isTeleport: true,
9603
9636
  process(n1, n2, container, anchor, parentComponent, parentSuspense, isSVG, slotScopeIds, optimized, internals) {
9604
9637
  const {
@@ -10078,7 +10111,7 @@ function _createVNode(type, props = null, children = null, patchFlag = 0, dynami
10078
10111
  if (!!(process.env.NODE_ENV !== "production") && shapeFlag & 4 && isProxy(type)) {
10079
10112
  type = toRaw(type);
10080
10113
  warn(
10081
- `Vue received a Component which was made a reactive object. This can lead to unnecessary performance overhead, and should be avoided by marking the component with \`markRaw\` or using \`shallowRef\` instead of \`ref\`.`,
10114
+ `Vue received a Component that was made a reactive object. This can lead to unnecessary performance overhead and should be avoided by marking the component with \`markRaw\` or using \`shallowRef\` instead of \`ref\`.`,
10082
10115
  `
10083
10116
  Component that was made reactive: `,
10084
10117
  type
@@ -10942,7 +10975,7 @@ function isMemoSame(cached, memo) {
10942
10975
  return true;
10943
10976
  }
10944
10977
 
10945
- const version = "3.3.7";
10978
+ const version = "3.3.9";
10946
10979
  const _ssrUtils = {
10947
10980
  createComponentInstance,
10948
10981
  setupComponent,
@@ -12198,21 +12231,20 @@ const vModelText = {
12198
12231
  el[assignKey] = getModelAssigner(vnode);
12199
12232
  if (el.composing)
12200
12233
  return;
12234
+ const elValue = number || el.type === "number" ? looseToNumber(el.value) : el.value;
12235
+ const newValue = value == null ? "" : value;
12236
+ if (elValue === newValue) {
12237
+ return;
12238
+ }
12201
12239
  if (document.activeElement === el && el.type !== "range") {
12202
12240
  if (lazy) {
12203
12241
  return;
12204
12242
  }
12205
- if (trim && el.value.trim() === value) {
12206
- return;
12207
- }
12208
- if ((number || el.type === "number") && looseToNumber(el.value) === value) {
12243
+ if (trim && el.value.trim() === newValue) {
12209
12244
  return;
12210
12245
  }
12211
12246
  }
12212
- const newValue = value == null ? "" : value;
12213
- if (el.value !== newValue) {
12214
- el.value = newValue;
12215
- }
12247
+ el.value = newValue;
12216
12248
  }
12217
12249
  };
12218
12250
  const vModelCheckbox = {
@@ -13380,6 +13412,7 @@ function getMemoedVNodeCall(node) {
13380
13412
  return node;
13381
13413
  }
13382
13414
  }
13415
+ const forAliasRE = /([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/;
13383
13416
 
13384
13417
  const deprecationData = {
13385
13418
  ["COMPILER_IS_ON_ELEMENT"]: {
@@ -15778,7 +15811,6 @@ function processFor(node, dir, context, processCodegen) {
15778
15811
  onExit();
15779
15812
  };
15780
15813
  }
15781
- const forAliasRE = /([\s\S]*?)\s+(?:in|of)\s+([\s\S]*)/;
15782
15814
  const forIteratorRE = /,([^,\}\]]*)(?:,([^,\}\]]*))?$/;
15783
15815
  const stripParensRE = /^\(|\)$/g;
15784
15816
  function parseForExpression(input, context) {
@@ -16378,7 +16410,7 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
16378
16410
  )
16379
16411
  );
16380
16412
  } else {
16381
- const { name, arg, exp, loc } = prop;
16413
+ const { name, arg, exp, loc, modifiers } = prop;
16382
16414
  const isVBind = name === "bind";
16383
16415
  const isVOn = name === "on";
16384
16416
  if (name === "slot") {
@@ -16471,6 +16503,9 @@ function buildProps(node, context, props = node.props, isComponent, isDynamicCom
16471
16503
  }
16472
16504
  continue;
16473
16505
  }
16506
+ if (isVBind && modifiers.includes("prop")) {
16507
+ patchFlag |= 32;
16508
+ }
16474
16509
  const directiveTransform = context.directiveTransforms[name];
16475
16510
  if (directiveTransform) {
16476
16511
  const { props: props2, needRuntime } = directiveTransform(prop, node, context);
@@ -17503,8 +17538,8 @@ const transformModel = (dir, node, context) => {
17503
17538
  );
17504
17539
  }
17505
17540
  function checkDuplicatedValue() {
17506
- const value = findProp(node, "value");
17507
- if (value) {
17541
+ const value = findDir(node, "bind");
17542
+ if (value && isStaticArgOf(value.arg, "value")) {
17508
17543
  context.onError(
17509
17544
  createDOMCompilerError(
17510
17545
  60,