@vue/compat 3.4.19 → 3.4.21

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.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @vue/compat v3.4.19
2
+ * @vue/compat v3.4.21
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -733,20 +733,20 @@ var Vue = (function () {
733
733
  return obj.hasOwnProperty(key);
734
734
  }
735
735
  class BaseReactiveHandler {
736
- constructor(_isReadonly = false, _shallow = false) {
736
+ constructor(_isReadonly = false, _isShallow = false) {
737
737
  this._isReadonly = _isReadonly;
738
- this._shallow = _shallow;
738
+ this._isShallow = _isShallow;
739
739
  }
740
740
  get(target, key, receiver) {
741
- const isReadonly2 = this._isReadonly, shallow = this._shallow;
741
+ const isReadonly2 = this._isReadonly, isShallow2 = this._isShallow;
742
742
  if (key === "__v_isReactive") {
743
743
  return !isReadonly2;
744
744
  } else if (key === "__v_isReadonly") {
745
745
  return isReadonly2;
746
746
  } else if (key === "__v_isShallow") {
747
- return shallow;
747
+ return isShallow2;
748
748
  } else if (key === "__v_raw") {
749
- if (receiver === (isReadonly2 ? shallow ? shallowReadonlyMap : readonlyMap : shallow ? shallowReactiveMap : reactiveMap).get(target) || // receiver is not the reactive proxy, but has the same prototype
749
+ if (receiver === (isReadonly2 ? isShallow2 ? shallowReadonlyMap : readonlyMap : isShallow2 ? shallowReactiveMap : reactiveMap).get(target) || // receiver is not the reactive proxy, but has the same prototype
750
750
  // this means the reciever is a user proxy of the reactive proxy
751
751
  Object.getPrototypeOf(target) === Object.getPrototypeOf(receiver)) {
752
752
  return target;
@@ -769,7 +769,7 @@ var Vue = (function () {
769
769
  if (!isReadonly2) {
770
770
  track(target, "get", key);
771
771
  }
772
- if (shallow) {
772
+ if (isShallow2) {
773
773
  return res;
774
774
  }
775
775
  if (isRef(res)) {
@@ -782,12 +782,12 @@ var Vue = (function () {
782
782
  }
783
783
  }
784
784
  class MutableReactiveHandler extends BaseReactiveHandler {
785
- constructor(shallow = false) {
786
- super(false, shallow);
785
+ constructor(isShallow2 = false) {
786
+ super(false, isShallow2);
787
787
  }
788
788
  set(target, key, value, receiver) {
789
789
  let oldValue = target[key];
790
- if (!this._shallow) {
790
+ if (!this._isShallow) {
791
791
  const isOldValueReadonly = isReadonly(oldValue);
792
792
  if (!isShallow(value) && !isReadonly(value)) {
793
793
  oldValue = toRaw(oldValue);
@@ -839,8 +839,8 @@ var Vue = (function () {
839
839
  }
840
840
  }
841
841
  class ReadonlyReactiveHandler extends BaseReactiveHandler {
842
- constructor(shallow = false) {
843
- super(true, shallow);
842
+ constructor(isShallow2 = false) {
843
+ super(true, isShallow2);
844
844
  }
845
845
  set(target, key) {
846
846
  {
@@ -1011,7 +1011,7 @@ var Vue = (function () {
1011
1011
  return function(...args) {
1012
1012
  {
1013
1013
  const key = args[0] ? `on key "${args[0]}" ` : ``;
1014
- console.warn(
1014
+ warn$2(
1015
1015
  `${capitalize(type)} operation ${key}failed: target is readonly.`,
1016
1016
  toRaw(this)
1017
1017
  );
@@ -1149,7 +1149,7 @@ var Vue = (function () {
1149
1149
  const rawKey = toRaw(key);
1150
1150
  if (rawKey !== key && has2.call(target, rawKey)) {
1151
1151
  const type = toRawType(target);
1152
- console.warn(
1152
+ warn$2(
1153
1153
  `Reactive ${type} contains both the raw and reactive versions of the same object${type === `Map` ? ` as keys` : ``}, which can lead to inconsistencies. Avoid differentiating between the raw and reactive versions of an object and only use the reactive version if possible.`
1154
1154
  );
1155
1155
  }
@@ -1218,7 +1218,7 @@ var Vue = (function () {
1218
1218
  function createReactiveObject(target, isReadonly2, baseHandlers, collectionHandlers, proxyMap) {
1219
1219
  if (!isObject(target)) {
1220
1220
  {
1221
- console.warn(`value cannot be made reactive: ${String(target)}`);
1221
+ warn$2(`value cannot be made reactive: ${String(target)}`);
1222
1222
  }
1223
1223
  return target;
1224
1224
  }
@@ -1271,6 +1271,7 @@ var Vue = (function () {
1271
1271
  const COMPUTED_SIDE_EFFECT_WARN = `Computed is still dirty after getter evaluation, likely because a computed is mutating its own dependency in its getter. State mutations in computed getters should be avoided. Check the docs for more details: https://vuejs.org/guide/essentials/computed.html#getters-should-be-side-effect-free`;
1272
1272
  class ComputedRefImpl {
1273
1273
  constructor(getter, _setter, isReadonly, isSSR) {
1274
+ this.getter = getter;
1274
1275
  this._setter = _setter;
1275
1276
  this.dep = void 0;
1276
1277
  this.__v_isRef = true;
@@ -1293,7 +1294,11 @@ var Vue = (function () {
1293
1294
  }
1294
1295
  trackRefValue(self);
1295
1296
  if (self.effect._dirtyLevel >= 2) {
1296
- warn$2(COMPUTED_SIDE_EFFECT_WARN);
1297
+ if (this._warnRecursive) {
1298
+ warn$2(COMPUTED_SIDE_EFFECT_WARN, `
1299
+
1300
+ getter: `, this.getter);
1301
+ }
1297
1302
  triggerRefValue(self, 2);
1298
1303
  }
1299
1304
  return self._value;
@@ -1449,7 +1454,7 @@ var Vue = (function () {
1449
1454
  }
1450
1455
  function toRefs(object) {
1451
1456
  if (!isProxy(object)) {
1452
- console.warn(`toRefs() expects a reactive object but received a plain one.`);
1457
+ warn$2(`toRefs() expects a reactive object but received a plain one.`);
1453
1458
  }
1454
1459
  const ret = isArray(object) ? new Array(object.length) : {};
1455
1460
  for (const key in object) {
@@ -1531,7 +1536,10 @@ var Vue = (function () {
1531
1536
  instance,
1532
1537
  11,
1533
1538
  [
1534
- msg + args.join(""),
1539
+ msg + args.map((a) => {
1540
+ var _a, _b;
1541
+ return (_b = (_a = a.toString) == null ? void 0 : _a.call(a)) != null ? _b : JSON.stringify(a);
1542
+ }).join(""),
1535
1543
  instance && instance.proxy,
1536
1544
  trace.map(
1537
1545
  ({ vnode }) => `at <${formatComponentName(instance, vnode.type)}>`
@@ -3219,8 +3227,10 @@ If this is a native custom element, make sure to exclude it from component resol
3219
3227
  rendererInternals
3220
3228
  );
3221
3229
  } else {
3222
- if (parentSuspense && parentSuspense.deps > 0) {
3230
+ if (parentSuspense && parentSuspense.deps > 0 && !n1.suspense.isInFallback) {
3223
3231
  n2.suspense = n1.suspense;
3232
+ n2.suspense.vnode = n2;
3233
+ n2.el = n1.el;
3224
3234
  return;
3225
3235
  }
3226
3236
  patchSuspense(
@@ -4198,7 +4208,6 @@ If this is a native custom element, make sure to exclude it from component resol
4198
4208
  setup(props, { slots }) {
4199
4209
  const instance = getCurrentInstance();
4200
4210
  const state = useTransitionState();
4201
- let prevTransitionKey;
4202
4211
  return () => {
4203
4212
  const children = slots.default && getTransitionRawChildren(slots.default(), true);
4204
4213
  if (!children || !children.length) {
@@ -4241,18 +4250,7 @@ If this is a native custom element, make sure to exclude it from component resol
4241
4250
  setTransitionHooks(innerChild, enterHooks);
4242
4251
  const oldChild = instance.subTree;
4243
4252
  const oldInnerChild = oldChild && getKeepAliveChild(oldChild);
4244
- let transitionKeyChanged = false;
4245
- const { getTransitionKey } = innerChild.type;
4246
- if (getTransitionKey) {
4247
- const key = getTransitionKey();
4248
- if (prevTransitionKey === void 0) {
4249
- prevTransitionKey = key;
4250
- } else if (key !== prevTransitionKey) {
4251
- prevTransitionKey = key;
4252
- transitionKeyChanged = true;
4253
- }
4254
- }
4255
- if (oldInnerChild && oldInnerChild.type !== Comment && (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)) {
4253
+ if (oldInnerChild && oldInnerChild.type !== Comment && !isSameVNodeType(innerChild, oldInnerChild)) {
4256
4254
  const leavingHooks = resolveTransitionHooks(
4257
4255
  oldInnerChild,
4258
4256
  rawProps,
@@ -6434,7 +6432,7 @@ If this is a native custom element, make sure to exclude it from component resol
6434
6432
  return vm;
6435
6433
  }
6436
6434
  }
6437
- Vue.version = `2.6.14-compat:${"3.4.19"}`;
6435
+ Vue.version = `2.6.14-compat:${"3.4.21"}`;
6438
6436
  Vue.config = singletonApp.config;
6439
6437
  Vue.use = (p, ...options) => {
6440
6438
  if (p && isFunction(p.install)) {
@@ -10682,9 +10680,8 @@ Component that was made reactive: `,
10682
10680
  internalSetCurrentInstance(null);
10683
10681
  };
10684
10682
  const isBuiltInTag = /* @__PURE__ */ makeMap("slot,component");
10685
- function validateComponentName(name, config) {
10686
- const appIsNativeTag = config.isNativeTag || NO;
10687
- if (isBuiltInTag(name) || appIsNativeTag(name)) {
10683
+ function validateComponentName(name, { isNativeTag }) {
10684
+ if (isBuiltInTag(name) || isNativeTag(name)) {
10688
10685
  warn$1(
10689
10686
  "Do not use built-in or reserved HTML elements as component id: " + name
10690
10687
  );
@@ -10989,7 +10986,14 @@ Component that was made reactive: `,
10989
10986
  }
10990
10987
 
10991
10988
  const computed = (getterOrOptions, debugOptions) => {
10992
- return computed$1(getterOrOptions, debugOptions, isInSSRComponentSetup);
10989
+ const c = computed$1(getterOrOptions, debugOptions, isInSSRComponentSetup);
10990
+ {
10991
+ const i = getCurrentInstance();
10992
+ if (i && i.appContext.config.warnRecursiveComputed) {
10993
+ c._warnRecursive = true;
10994
+ }
10995
+ }
10996
+ return c;
10993
10997
  };
10994
10998
 
10995
10999
  function useModel(props, name, options = EMPTY_OBJ) {
@@ -11267,7 +11271,7 @@ Component that was made reactive: `,
11267
11271
  return true;
11268
11272
  }
11269
11273
 
11270
- const version = "3.4.19";
11274
+ const version = "3.4.21";
11271
11275
  const warn = warn$1 ;
11272
11276
  const ErrorTypeStrings = ErrorTypeStrings$1 ;
11273
11277
  const devtools = devtools$1 ;
@@ -11672,10 +11676,11 @@ Component that was made reactive: `,
11672
11676
  }
11673
11677
  }
11674
11678
 
11675
- const vShowOldKey = Symbol("_vod");
11679
+ const vShowOriginalDisplay = Symbol("_vod");
11680
+ const vShowHidden = Symbol("_vsh");
11676
11681
  const vShow = {
11677
11682
  beforeMount(el, { value }, { transition }) {
11678
- el[vShowOldKey] = el.style.display === "none" ? "" : el.style.display;
11683
+ el[vShowOriginalDisplay] = el.style.display === "none" ? "" : el.style.display;
11679
11684
  if (transition && value) {
11680
11685
  transition.beforeEnter(el);
11681
11686
  } else {
@@ -11688,7 +11693,7 @@ Component that was made reactive: `,
11688
11693
  }
11689
11694
  },
11690
11695
  updated(el, { value, oldValue }, { transition }) {
11691
- if (!value === !oldValue && (el.style.display === el[vShowOldKey] || !value))
11696
+ if (!value === !oldValue)
11692
11697
  return;
11693
11698
  if (transition) {
11694
11699
  if (value) {
@@ -11712,7 +11717,8 @@ Component that was made reactive: `,
11712
11717
  vShow.name = "show";
11713
11718
  }
11714
11719
  function setDisplay(el, value) {
11715
- el.style.display = value ? el[vShowOldKey] : "none";
11720
+ el.style.display = value ? el[vShowOriginalDisplay] : "none";
11721
+ el[vShowHidden] = !value;
11716
11722
  }
11717
11723
 
11718
11724
  const CSS_VAR_TEXT = Symbol("CSS_VAR_TEXT" );
@@ -11785,13 +11791,21 @@ Component that was made reactive: `,
11785
11791
  function patchStyle(el, prev, next) {
11786
11792
  const style = el.style;
11787
11793
  const isCssString = isString(next);
11788
- const currentDisplay = style.display;
11789
11794
  let hasControlledDisplay = false;
11790
11795
  if (next && !isCssString) {
11791
- if (prev && !isString(prev)) {
11792
- for (const key in prev) {
11793
- if (next[key] == null) {
11794
- setStyle(style, key, "");
11796
+ if (prev) {
11797
+ if (!isString(prev)) {
11798
+ for (const key in prev) {
11799
+ if (next[key] == null) {
11800
+ setStyle(style, key, "");
11801
+ }
11802
+ }
11803
+ } else {
11804
+ for (const prevStyle of prev.split(";")) {
11805
+ const key = prevStyle.slice(0, prevStyle.indexOf(":")).trim();
11806
+ if (next[key] == null) {
11807
+ setStyle(style, key, "");
11808
+ }
11795
11809
  }
11796
11810
  }
11797
11811
  }
@@ -11815,9 +11829,11 @@ Component that was made reactive: `,
11815
11829
  el.removeAttribute("style");
11816
11830
  }
11817
11831
  }
11818
- if (vShowOldKey in el) {
11819
- el[vShowOldKey] = hasControlledDisplay ? style.display : "";
11820
- style.display = currentDisplay;
11832
+ if (vShowOriginalDisplay in el) {
11833
+ el[vShowOriginalDisplay] = hasControlledDisplay ? style.display : "";
11834
+ if (el[vShowHidden]) {
11835
+ style.display = "none";
11836
+ }
11821
11837
  }
11822
11838
  }
11823
11839
  const semicolonRE = /[^\\];\s*$/;
@@ -11928,15 +11944,15 @@ Component that was made reactive: `,
11928
11944
  const tag = el.tagName;
11929
11945
  if (key === "value" && tag !== "PROGRESS" && // custom elements may use _value internally
11930
11946
  !tag.includes("-")) {
11931
- el._value = value;
11932
- const oldValue = tag === "OPTION" ? el.getAttribute("value") : el.value;
11947
+ const oldValue = tag === "OPTION" ? el.getAttribute("value") || "" : el.value;
11933
11948
  const newValue = value == null ? "" : value;
11934
- if (oldValue !== newValue) {
11949
+ if (oldValue !== newValue || !("_value" in el)) {
11935
11950
  el.value = newValue;
11936
11951
  }
11937
11952
  if (value == null) {
11938
11953
  el.removeAttribute(key);
11939
11954
  }
11955
+ el._value = value;
11940
11956
  return;
11941
11957
  }
11942
11958
  let needRemove = false;
@@ -12633,19 +12649,19 @@ Component that was made reactive: `,
12633
12649
  },
12634
12650
  // set value in mounted & updated because <select> relies on its children
12635
12651
  // <option>s.
12636
- mounted(el, { value, oldValue, modifiers: { number } }) {
12637
- setSelected(el, value, oldValue, number);
12652
+ mounted(el, { value, modifiers: { number } }) {
12653
+ setSelected(el, value, number);
12638
12654
  },
12639
12655
  beforeUpdate(el, _binding, vnode) {
12640
12656
  el[assignKey] = getModelAssigner(vnode);
12641
12657
  },
12642
- updated(el, { value, oldValue, modifiers: { number } }) {
12658
+ updated(el, { value, modifiers: { number } }) {
12643
12659
  if (!el._assigning) {
12644
- setSelected(el, value, oldValue, number);
12660
+ setSelected(el, value, number);
12645
12661
  }
12646
12662
  }
12647
12663
  };
12648
- function setSelected(el, value, oldValue, number) {
12664
+ function setSelected(el, value, number) {
12649
12665
  const isMultiple = el.multiple;
12650
12666
  const isArrayValue = isArray(value);
12651
12667
  if (isMultiple && !isArrayValue && !isSet(value)) {
@@ -12670,12 +12686,10 @@ Component that was made reactive: `,
12670
12686
  } else {
12671
12687
  option.selected = value.has(optionValue);
12672
12688
  }
12673
- } else {
12674
- if (looseEqual(getValue(option), value)) {
12675
- if (el.selectedIndex !== i)
12676
- el.selectedIndex = i;
12677
- return;
12678
- }
12689
+ } else if (looseEqual(getValue(option), value)) {
12690
+ if (el.selectedIndex !== i)
12691
+ el.selectedIndex = i;
12692
+ return;
12679
12693
  }
12680
12694
  }
12681
12695
  if (!isMultiple && el.selectedIndex !== -1) {