@vue/compat 3.6.0-rc.8 → 3.6.0-rc.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.
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @vue/compat v3.6.0-rc.8
2
+ * @vue/compat v3.6.0-rc.9
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -231,10 +231,10 @@ function normalizeStyle(value) {
231
231
  }
232
232
  const listDelimiterRE = /;(?![^(]*\))/g;
233
233
  const propertyDelimiterRE = /:([^]+)/;
234
- const styleCommentRE = /\/\*[^]*?\*\//g;
234
+ const styleCommentRE = /"(?:[^"\\]|\\[^])*"|'(?:[^'\\]|\\[^])*'|\\[^]|\/\*[^]*?\*\//g;
235
235
  function parseStringStyle(cssText) {
236
236
  const ret = {};
237
- cssText.replace(styleCommentRE, "").split(listDelimiterRE).forEach((item) => {
237
+ cssText.replace(styleCommentRE, (match) => match.startsWith("/*") ? "" : match).split(listDelimiterRE).forEach((item) => {
238
238
  if (item) {
239
239
  const tmp = item.split(propertyDelimiterRE);
240
240
  tmp.length > 1 && (ret[tmp[0].trim()] = tmp[1].trim());
@@ -362,19 +362,19 @@ function getEscapedCssVarName(key, doubleEscape) {
362
362
  }
363
363
  //#endregion
364
364
  //#region packages/shared/src/looseEqual.ts
365
- function looseCompareArrays(a, b) {
365
+ function looseCompareArrays(a, b, seen) {
366
366
  if (a.length !== b.length) return false;
367
367
  let equal = true;
368
- for (let i = 0; equal && i < a.length; i++) equal = looseEqual(a[i], b[i]);
368
+ for (let i = 0; equal && i < a.length; i++) equal = looseEqual(a[i], b[i], seen);
369
369
  return equal;
370
370
  }
371
- function looseCompareCollections(a, b) {
371
+ function looseCompareCollections(a, b, seen) {
372
372
  if (a.size !== b.size) return false;
373
373
  const candidates = Array.from(b);
374
374
  const matched = new Uint8Array(candidates.length);
375
375
  for (const item of a) {
376
376
  let index = -1;
377
- for (let i = 0; i < candidates.length; i++) if (!matched[i] && looseEqual(item, candidates[i])) {
377
+ for (let i = 0; i < candidates.length; i++) if (!matched[i] && looseEqual(item, candidates[i], seen)) {
378
378
  index = i;
379
379
  break;
380
380
  }
@@ -383,7 +383,33 @@ function looseCompareCollections(a, b) {
383
383
  }
384
384
  return true;
385
385
  }
386
- function looseEqual(a, b) {
386
+ function looseCompareObjects(a, b, seen) {
387
+ let aValidType = isMap(a);
388
+ let bValidType = isMap(b);
389
+ if (aValidType || bValidType) return aValidType && bValidType ? looseCompareCollections(a, b, seen) : false;
390
+ aValidType = isSet(a);
391
+ bValidType = isSet(b);
392
+ if (aValidType || bValidType) return aValidType && bValidType ? looseCompareCollections(a, b, seen) : false;
393
+ if (Object.keys(a).length !== Object.keys(b).length) return false;
394
+ for (const key in a) {
395
+ const aHasKey = a.hasOwnProperty(key);
396
+ const bHasKey = b.hasOwnProperty(key);
397
+ if (aHasKey && !bHasKey || !aHasKey && bHasKey || !looseEqual(a[key], b[key], seen)) return false;
398
+ }
399
+ return String(a) === String(b);
400
+ }
401
+ function looseCompareNested(a, b, seen, compare) {
402
+ if (!seen) seen = [/* @__PURE__ */ new Map(), /* @__PURE__ */ new Map()];
403
+ const [seenA, seenB] = seen;
404
+ if (seenA.has(a) || seenB.has(b)) return seenA.get(a) === b && seenB.get(b) === a;
405
+ seenA.set(a, b);
406
+ seenB.set(b, a);
407
+ const equal = compare(a, b, seen);
408
+ seenA.delete(a);
409
+ seenB.delete(b);
410
+ return equal;
411
+ }
412
+ function looseEqual(a, b, seen) {
387
413
  if (a === b) return true;
388
414
  let aValidType = isDate(a);
389
415
  let bValidType = isDate(b);
@@ -393,23 +419,12 @@ function looseEqual(a, b) {
393
419
  if (aValidType || bValidType) return a === b;
394
420
  aValidType = isArray(a);
395
421
  bValidType = isArray(b);
396
- if (aValidType || bValidType) return aValidType && bValidType ? looseCompareArrays(a, b) : false;
422
+ if (aValidType || bValidType) return aValidType && bValidType ? looseCompareNested(a, b, seen, looseCompareArrays) : false;
397
423
  aValidType = isObject(a);
398
424
  bValidType = isObject(b);
399
425
  if (aValidType || bValidType) {
400
426
  if (!aValidType || !bValidType) return false;
401
- aValidType = isMap(a);
402
- bValidType = isMap(b);
403
- if (aValidType || bValidType) return aValidType && bValidType ? looseCompareCollections(a, b) : false;
404
- aValidType = isSet(a);
405
- bValidType = isSet(b);
406
- if (aValidType || bValidType) return aValidType && bValidType ? looseCompareCollections(a, b) : false;
407
- if (Object.keys(a).length !== Object.keys(b).length) return false;
408
- for (const key in a) {
409
- const aHasKey = a.hasOwnProperty(key);
410
- const bHasKey = b.hasOwnProperty(key);
411
- if (aHasKey && !bHasKey || !aHasKey && bHasKey || !looseEqual(a[key], b[key])) return false;
412
- }
427
+ return looseCompareNested(a, b, seen, looseCompareObjects);
413
428
  }
414
429
  return String(a) === String(b);
415
430
  }
@@ -867,13 +882,17 @@ function getDepFromReactive(object, key) {
867
882
  /**
868
883
  * Track array iteration and return:
869
884
  * - if input is reactive: a cloned raw array with reactive values
870
- * - if input is non-reactive or shallowReactive: the original raw array
885
+ * - if input is readonly: a cloned raw array with readonly values, preserving
886
+ * reactivity
887
+ * - if input is raw or shallow: the original raw array
871
888
  */
872
889
  function reactiveReadArray(array) {
873
890
  const raw = /* @__PURE__ */ toRaw(array);
874
891
  if (raw === array) return raw;
875
892
  track(raw, "iterate", ARRAY_ITERATE_KEY);
876
- return /* @__PURE__ */ isShallow(array) ? raw : raw.map(toReactive);
893
+ if (/* @__PURE__ */ isShallow(array)) return raw;
894
+ if (!/* @__PURE__ */ isReadonly(array)) return raw.map(toReactive);
895
+ return /* @__PURE__ */ isReactive(array) ? raw.map((item) => toReadonly(toReactive(item))) : raw.map(toReadonly);
877
896
  }
878
897
  /**
879
898
  * Track array iteration and return raw array
@@ -4387,12 +4406,12 @@ function createHydrationFunctions(rendererInternals) {
4387
4406
  } else {
4388
4407
  mountComponent(vnode, container, null, parentComponent, parentSuspense, getContainerType(container), optimized);
4389
4408
  const component = vnode.component;
4390
- if (!component.subTree && (isAsyncWrapper(vnode) || component.asyncDep && !component.asyncResolved)) {
4409
+ if (!component.subTree && (isAsyncWrapper(vnode) || component.asyncDep)) {
4391
4410
  let subTree;
4392
4411
  if (isFragmentStart) {
4393
4412
  subTree = createVNode(Static);
4394
4413
  subTree.anchor = nextNode ? nextNode.previousSibling : container.lastChild;
4395
- } else subTree = node.nodeType === 3 ? createTextVNode("") : createVNode("div");
4414
+ } else subTree = node.nodeType === 3 ? createTextVNode("") : createVNode(node.nodeType === 8 ? Comment : "div");
4396
4415
  subTree.el = node;
4397
4416
  component.subTree = subTree;
4398
4417
  }
@@ -6536,7 +6555,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
6536
6555
  if (options.el) return vm.$mount(options.el);
6537
6556
  else return vm;
6538
6557
  }
6539
- Vue.version = `2.6.14-compat:3.6.0-rc.8`;
6558
+ Vue.version = `2.6.14-compat:3.6.0-rc.9`;
6540
6559
  Vue.config = singletonApp.config;
6541
6560
  Vue.use = (plugin, ...options) => {
6542
6561
  if (plugin && isFunction(plugin.install)) plugin.install(Vue, ...options);
@@ -7876,6 +7895,10 @@ function baseCreateRenderer(options, createHydrationFns) {
7876
7895
  optimized = false;
7877
7896
  n2.dynamicChildren = null;
7878
7897
  }
7898
+ if (n2.dynamicChildren && n1 && n1.dynamicChildren && n1.dynamicChildren.hasOnce) {
7899
+ if (n2.dynamicChildren === EMPTY_ARR) n2.dynamicChildren = [];
7900
+ n2.dynamicChildren.hasOnce = true;
7901
+ }
7879
7902
  const { type, ref, shapeFlag } = n2;
7880
7903
  switch (type) {
7881
7904
  case Text:
@@ -8195,6 +8218,7 @@ function baseCreateRenderer(options, createHydrationFns) {
8195
8218
  if (shouldUpdateComponent(n1, n2, optimized)) {
8196
8219
  if (instance.asyncDep && !instance.asyncResolved) {
8197
8220
  pushWarningContext(n2);
8221
+ n2.el = n1.el;
8198
8222
  updateComponentPreRender(instance, n2, optimized);
8199
8223
  popWarningContext();
8200
8224
  return;
@@ -8510,13 +8534,13 @@ function baseCreateRenderer(options, createHydrationFns) {
8510
8534
  };
8511
8535
  const unmount = (vnode, parentComponent, parentSuspense, doRemove = false, optimized = false) => {
8512
8536
  const { type, props, ref, children, dynamicChildren, shapeFlag, patchFlag, dirs, cacheIndex, memo } = vnode;
8513
- if (patchFlag === -2) optimized = false;
8537
+ if (patchFlag === -2 || dynamicChildren && dynamicChildren.hasOnce) optimized = false;
8514
8538
  if (ref != null) {
8515
8539
  const prevSub = setActiveSub();
8516
8540
  setRef(ref, null, parentSuspense, vnode, true);
8517
8541
  setActiveSub(prevSub);
8518
8542
  }
8519
- if (cacheIndex != null) parentComponent.renderCache[cacheIndex] = void 0;
8543
+ if (cacheIndex != null && (!vnode.ctx || vnode.ctx === parentComponent)) parentComponent.renderCache[cacheIndex] = void 0;
8520
8544
  if (shapeFlag & 256) {
8521
8545
  if (isVaporComponent(vnode.type)) getVaporInterface(parentComponent, vnode).deactivate(vnode, parentComponent.ctx.getStorageContainer(), parentSuspense);
8522
8546
  else parentComponent.ctx.deactivate(vnode);
@@ -8570,6 +8594,7 @@ function baseCreateRenderer(options, createHydrationFns) {
8570
8594
  }
8571
8595
  if (type === Static) {
8572
8596
  removeStaticNode(vnode);
8597
+ if (transition && !transition.persisted && transition.afterLeave) transition.afterLeave();
8573
8598
  return;
8574
8599
  }
8575
8600
  if (transition) performTransitionLeave(el, transition, () => hostRemove(el), !!(vnode.shapeFlag & 1));
@@ -8595,7 +8620,10 @@ function baseCreateRenderer(options, createHydrationFns) {
8595
8620
  if (effect) {
8596
8621
  effect.stop();
8597
8622
  unmount(subTree, instance, parentSuspense, doRemove);
8598
- } else if (doRemove && subTree && instance.vnode.el) remove(subTree);
8623
+ } else if (instance.vnode.el && subTree) {
8624
+ subTree.transition = instance.vnode.transition;
8625
+ unmount(subTree, instance, parentSuspense, doRemove);
8626
+ }
8599
8627
  if (um) queuePostRenderEffect(um, void 0, parentSuspense);
8600
8628
  if (isCompatEnabled$1("INSTANCE_EVENT_HOOKS", instance)) queuePostRenderEffect(() => instance.emit("hook:destroyed"), void 0, parentSuspense);
8601
8629
  queuePostRenderEffect(() => instance.isUnmounted = true, void 0, parentSuspense);
@@ -8802,7 +8830,7 @@ const Suspense = {
8802
8830
  process(n1, n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals) {
8803
8831
  if (n1 == null) mountSuspense(n2, container, anchor, parentComponent, parentSuspense, namespace, slotScopeIds, optimized, rendererInternals);
8804
8832
  else {
8805
- if (parentSuspense && parentSuspense.deps > 0 && !n1.suspense.isInFallback) {
8833
+ if (parentSuspense && parentSuspense.deps > 0 && !n1.suspense.isInFallback && !parentSuspense.isHydrating) {
8806
8834
  n2.suspense = n1.suspense;
8807
8835
  n2.suspense.vnode = n2;
8808
8836
  n2.el = n1.el;
@@ -8840,7 +8868,9 @@ function patchSuspense(n1, n2, container, anchor, parentComponent, namespace, sl
8840
8868
  if (pendingBranch) {
8841
8869
  suspense.pendingBranch = newBranch;
8842
8870
  if (isSameVNodeType(pendingBranch, newBranch)) {
8843
- patch(pendingBranch, newBranch, suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized);
8871
+ suspense.deps++;
8872
+ patch(pendingBranch, newBranch, isHydrating ? container : suspense.hiddenContainer, null, parentComponent, suspense, namespace, slotScopeIds, optimized);
8873
+ suspense.deps--;
8844
8874
  if (suspense.deps <= 0) suspense.resolve();
8845
8875
  else if (isInFallback) {
8846
8876
  if (!isHydrating && !suspense.isFallbackMountPending) {
@@ -8976,6 +9006,7 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
8976
9006
  suspense.effects = [];
8977
9007
  if (isSuspensible) {
8978
9008
  if (parentSuspense && parentSuspense.pendingBranch && parentSuspenseId === parentSuspense.pendingId) {
9009
+ parentSuspenseId = void 0;
8979
9010
  parentSuspense.deps--;
8980
9011
  if (parentSuspense.deps === 0 && !sync) parentSuspense.resolve();
8981
9012
  }
@@ -9013,11 +9044,16 @@ function createSuspenseBoundary(vnode, parentSuspense, parentComponent, containe
9013
9044
  registerDep(instance, onResolve) {
9014
9045
  const isInPendingSuspense = !!suspense.pendingBranch;
9015
9046
  if (isInPendingSuspense) suspense.deps++;
9047
+ const hydratedEl = instance.vnode && instance.vnode.el;
9016
9048
  instance.asyncDep.catch((err) => {
9017
9049
  handleError(err, instance, 0);
9018
9050
  }).then((asyncSetupResult) => {
9019
9051
  if (instance.isUnmounted || suspense.isUnmounted || suspense.pendingId !== instance.suspenseId) return;
9020
9052
  setCurrentInstance(null, void 0);
9053
+ if (hydratedEl && !instance.scope.active) {
9054
+ if (isInPendingSuspense && --suspense.deps === 0) suspense.resolve();
9055
+ return;
9056
+ }
9021
9057
  instance.asyncResolved = true;
9022
9058
  onResolve(asyncSetupResult);
9023
9059
  if (isInPendingSuspense && --suspense.deps === 0) suspense.resolve();
@@ -9373,7 +9409,8 @@ function cloneVNode(vnode, extraProps, mergeRef = false, cloneTransition = false
9373
9409
  vs: cloneVaporSlotMeta(vnode),
9374
9410
  vb: vnode.vb,
9375
9411
  ibu: vnode.ibu,
9376
- iu: vnode.iu
9412
+ iu: vnode.iu,
9413
+ cacheIndex: vnode.cacheIndex
9377
9414
  };
9378
9415
  if (transition && cloneTransition) setTransitionHooks(cloned, transition.clone(cloned));
9379
9416
  defineLegacyVNodeProperties(cloned);
@@ -10078,7 +10115,7 @@ function isMemoSame(cached, memo) {
10078
10115
  }
10079
10116
  //#endregion
10080
10117
  //#region packages/runtime-core/src/index.ts
10081
- const version = "3.6.0-rc.8";
10118
+ const version = "3.6.0-rc.9";
10082
10119
  const warn = warn$1;
10083
10120
  /**
10084
10121
  * Runtime error messages. Only exposed in dev or esm builds.
@@ -10476,49 +10513,20 @@ const CSS_VAR_TEXT = Symbol("CSS_VAR_TEXT");
10476
10513
  */
10477
10514
  function useCssVars(getter) {
10478
10515
  const instance = getCurrentInstance();
10479
- const getVars = () => getter(instance.proxy);
10480
- const setVars = (vars) => {
10481
- if (instance.ce) setVarsOnNode(instance.ce, vars);
10482
- else setVarsOnVNode(instance.subTree, vars);
10483
- };
10484
- baseUseCssVars(instance, () => instance.subTree.el.parentNode, getVars, setVars);
10485
- }
10486
- function setVarsOnVNode(vnode, vars) {
10487
- if (vnode.shapeFlag & 128) {
10488
- const suspense = vnode.suspense;
10489
- vnode = suspense.activeBranch;
10490
- if (suspense.pendingBranch && !suspense.isHydrating) suspense.effects.push(() => {
10491
- setVarsOnVNode(suspense.activeBranch, vars);
10492
- });
10493
- }
10494
- while (vnode.component) vnode = vnode.component.subTree;
10495
- if (vnode.shapeFlag & 1 && vnode.el) setVarsOnNode(vnode.el, vars);
10496
- else if (vnode.type === Fragment) vnode.children.forEach((c) => setVarsOnVNode(c, vars));
10497
- else if (vnode.type === Static) {
10498
- let { el, anchor } = vnode;
10499
- while (el) {
10500
- setVarsOnNode(el, vars);
10501
- if (el === anchor) break;
10502
- el = el.nextSibling;
10503
- }
10504
- }
10505
- }
10506
- /**
10507
- * @internal
10508
- * shared between vdom and vapor
10509
- */
10510
- function baseUseCssVars(instance, getParentNode, getVars, setVars) {
10511
10516
  /* v8 ignore start */
10512
10517
  if (!instance) {
10513
10518
  warn(`useCssVars is called without current active component instance.`);
10514
10519
  return;
10515
10520
  }
10521
+ /* v8 ignore stop */
10522
+ const getVars = () => getter(instance.proxy);
10516
10523
  instance.getCssVars = getVars;
10517
10524
  const updateTeleports = instance.ut = (vars = getVars()) => {
10518
10525
  Array.from(document.querySelectorAll(`[data-v-owner="${instance.uid}"]`)).forEach((node) => setVarsOnNode(node, vars));
10519
10526
  };
10520
10527
  const applyCssVars = (vars = getVars()) => {
10521
- setVars(vars);
10528
+ if (instance.ce) setVarsOnNode(instance.ce, vars);
10529
+ else setVarsOnVNode(instance.subTree, vars);
10522
10530
  updateTeleports(vars);
10523
10531
  };
10524
10532
  onBeforeUpdate(() => {
@@ -10531,10 +10539,37 @@ function baseUseCssVars(instance, getParentNode, getVars, setVars) {
10531
10539
  applyCssVars(vars);
10532
10540
  }, NOOP, { flush: "post" });
10533
10541
  const ob = new MutationObserver(() => applyCssVars());
10534
- ob.observe(getParentNode(), { childList: true });
10542
+ ob.observe(instance.subTree.el.parentNode, { childList: true });
10535
10543
  onUnmounted(() => ob.disconnect());
10536
10544
  });
10537
10545
  }
10546
+ function setVarsOnVNode(vnode, vars) {
10547
+ if (vnode.shapeFlag & 128) {
10548
+ const suspense = vnode.suspense;
10549
+ vnode = suspense.activeBranch;
10550
+ if (suspense.pendingBranch && !suspense.isHydrating) suspense.effects.push(() => {
10551
+ setVarsOnVNode(suspense.activeBranch, vars);
10552
+ });
10553
+ }
10554
+ while (vnode.component) {
10555
+ const component = vnode.component;
10556
+ if (component.vapor) {
10557
+ component.appContext.vapor.applyCssVars(vnode, vars);
10558
+ return;
10559
+ }
10560
+ vnode = vnode.component.subTree;
10561
+ }
10562
+ if (vnode.shapeFlag & 1 && vnode.el) setVarsOnNode(vnode.el, vars);
10563
+ else if (vnode.type === Fragment) vnode.children.forEach((c) => setVarsOnVNode(c, vars));
10564
+ else if (vnode.type === Static) {
10565
+ let { el, anchor } = vnode;
10566
+ while (el) {
10567
+ setVarsOnNode(el, vars);
10568
+ if (el === anchor) break;
10569
+ el = el.nextSibling;
10570
+ }
10571
+ }
10572
+ }
10538
10573
  /**
10539
10574
  * @internal
10540
10575
  * shared between vdom and vapor