@vue/compat 3.5.0-alpha.5 → 3.5.0-beta.1

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.5.0-alpha.5
2
+ * @vue/compat v3.5.0-beta.1
3
3
  * (c) 2018-present Yuxi (Evan) You and Vue contributors
4
4
  * @license MIT
5
5
  **/
@@ -61,9 +61,11 @@ const cacheStringFunction = (fn) => {
61
61
  };
62
62
  };
63
63
  const camelizeRE = /-(\w)/g;
64
- const camelize = cacheStringFunction((str) => {
65
- return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : "");
66
- });
64
+ const camelize = cacheStringFunction(
65
+ (str) => {
66
+ return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : "");
67
+ }
68
+ );
67
69
  const hyphenateRE = /\B([A-Z])/g;
68
70
  const hyphenate = cacheStringFunction(
69
71
  (str) => str.replace(hyphenateRE, "-$1").toLowerCase()
@@ -71,10 +73,12 @@ const hyphenate = cacheStringFunction(
71
73
  const capitalize = cacheStringFunction((str) => {
72
74
  return str.charAt(0).toUpperCase() + str.slice(1);
73
75
  });
74
- const toHandlerKey = cacheStringFunction((str) => {
75
- const s = str ? `on${capitalize(str)}` : ``;
76
- return s;
77
- });
76
+ const toHandlerKey = cacheStringFunction(
77
+ (str) => {
78
+ const s = str ? `on${capitalize(str)}` : ``;
79
+ return s;
80
+ }
81
+ );
78
82
  const hasChanged = (value, oldValue) => !Object.is(value, oldValue);
79
83
  const invokeArrayFns = (fns, ...arg) => {
80
84
  for (let i = 0; i < fns.length; i++) {
@@ -319,6 +323,7 @@ class EffectScope {
319
323
  * @internal
320
324
  */
321
325
  this.cleanups = [];
326
+ this._isPaused = false;
322
327
  this.parent = activeEffectScope;
323
328
  if (!detached && activeEffectScope) {
324
329
  this.index = (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(
@@ -329,6 +334,37 @@ class EffectScope {
329
334
  get active() {
330
335
  return this._active;
331
336
  }
337
+ pause() {
338
+ if (this._active) {
339
+ this._isPaused = true;
340
+ if (this.scopes) {
341
+ for (let i = 0, l = this.scopes.length; i < l; i++) {
342
+ this.scopes[i].pause();
343
+ }
344
+ }
345
+ for (let i = 0, l = this.effects.length; i < l; i++) {
346
+ this.effects[i].pause();
347
+ }
348
+ }
349
+ }
350
+ /**
351
+ * Resumes the effect scope, including all child scopes and effects.
352
+ */
353
+ resume() {
354
+ if (this._active) {
355
+ if (this._isPaused) {
356
+ this._isPaused = false;
357
+ if (this.scopes) {
358
+ for (let i = 0, l = this.scopes.length; i < l; i++) {
359
+ this.scopes[i].resume();
360
+ }
361
+ }
362
+ for (let i = 0, l = this.effects.length; i < l; i++) {
363
+ this.effects[i].resume();
364
+ }
365
+ }
366
+ }
367
+ }
332
368
  run(fn) {
333
369
  if (this._active) {
334
370
  const currentEffectScope = activeEffectScope;
@@ -399,6 +435,7 @@ function onScopeDispose(fn, failSilently = false) {
399
435
  }
400
436
 
401
437
  let activeSub;
438
+ const pausedQueueEffects = /* @__PURE__ */ new WeakSet();
402
439
  class ReactiveEffect {
403
440
  constructor(fn) {
404
441
  this.fn = fn;
@@ -427,6 +464,18 @@ class ReactiveEffect {
427
464
  activeEffectScope.effects.push(this);
428
465
  }
429
466
  }
467
+ pause() {
468
+ this.flags |= 128;
469
+ }
470
+ resume() {
471
+ if (this.flags & 128) {
472
+ this.flags &= ~128;
473
+ if (pausedQueueEffects.has(this)) {
474
+ pausedQueueEffects.delete(this);
475
+ this.trigger();
476
+ }
477
+ }
478
+ }
430
479
  /**
431
480
  * @internal
432
481
  */
@@ -480,7 +529,9 @@ class ReactiveEffect {
480
529
  }
481
530
  }
482
531
  trigger() {
483
- if (this.scheduler) {
532
+ if (this.flags & 128) {
533
+ pausedQueueEffects.add(this);
534
+ } else if (this.scheduler) {
484
535
  this.scheduler();
485
536
  } else {
486
537
  this.runIfDirty();
@@ -800,9 +851,15 @@ function addSub(link) {
800
851
  link.dep.subs = link;
801
852
  }
802
853
  const targetMap = /* @__PURE__ */ new WeakMap();
803
- const ITERATE_KEY = Symbol(!!(process.env.NODE_ENV !== "production") ? "Object iterate" : "");
804
- const MAP_KEY_ITERATE_KEY = Symbol(!!(process.env.NODE_ENV !== "production") ? "Map keys iterate" : "");
805
- const ARRAY_ITERATE_KEY = Symbol(!!(process.env.NODE_ENV !== "production") ? "Array iterate" : "");
854
+ const ITERATE_KEY = Symbol(
855
+ !!(process.env.NODE_ENV !== "production") ? "Object iterate" : ""
856
+ );
857
+ const MAP_KEY_ITERATE_KEY = Symbol(
858
+ !!(process.env.NODE_ENV !== "production") ? "Map keys iterate" : ""
859
+ );
860
+ const ARRAY_ITERATE_KEY = Symbol(
861
+ !!(process.env.NODE_ENV !== "production") ? "Array iterate" : ""
862
+ );
806
863
  function track(target, type, key) {
807
864
  if (shouldTrack && activeSub) {
808
865
  let depsMap = targetMap.get(target);
@@ -1096,7 +1153,7 @@ class BaseReactiveHandler {
1096
1153
  return isShallow2;
1097
1154
  } else if (key === "__v_raw") {
1098
1155
  if (receiver === (isReadonly2 ? isShallow2 ? shallowReadonlyMap : readonlyMap : isShallow2 ? shallowReactiveMap : reactiveMap).get(target) || // receiver is not the reactive proxy, but has the same prototype
1099
- // this means the reciever is a user proxy of the reactive proxy
1156
+ // this means the receiver is a user proxy of the reactive proxy
1100
1157
  Object.getPrototypeOf(target) === Object.getPrototypeOf(receiver)) {
1101
1158
  return target;
1102
1159
  }
@@ -1220,9 +1277,7 @@ class ReadonlyReactiveHandler extends BaseReactiveHandler {
1220
1277
  }
1221
1278
  const mutableHandlers = /* @__PURE__ */ new MutableReactiveHandler();
1222
1279
  const readonlyHandlers = /* @__PURE__ */ new ReadonlyReactiveHandler();
1223
- const shallowReactiveHandlers = /* @__PURE__ */ new MutableReactiveHandler(
1224
- true
1225
- );
1280
+ const shallowReactiveHandlers = /* @__PURE__ */ new MutableReactiveHandler(true);
1226
1281
  const shallowReadonlyHandlers = /* @__PURE__ */ new ReadonlyReactiveHandler(true);
1227
1282
 
1228
1283
  const toShallow = (value) => value;
@@ -1723,13 +1778,14 @@ function proxyRefs(objectWithRefs) {
1723
1778
  class CustomRefImpl {
1724
1779
  constructor(factory) {
1725
1780
  this["__v_isRef"] = true;
1781
+ this._value = void 0;
1726
1782
  const dep = this.dep = new Dep();
1727
1783
  const { get, set } = factory(dep.track.bind(dep), dep.trigger.bind(dep));
1728
1784
  this._get = get;
1729
1785
  this._set = set;
1730
1786
  }
1731
1787
  get value() {
1732
- return this._get();
1788
+ return this._value = this._get();
1733
1789
  }
1734
1790
  set value(newVal) {
1735
1791
  this._set(newVal);
@@ -1754,10 +1810,11 @@ class ObjectRefImpl {
1754
1810
  this._key = _key;
1755
1811
  this._defaultValue = _defaultValue;
1756
1812
  this["__v_isRef"] = true;
1813
+ this._value = void 0;
1757
1814
  }
1758
1815
  get value() {
1759
1816
  const val = this._object[this._key];
1760
- return val === void 0 ? this._defaultValue : val;
1817
+ return this._value = val === void 0 ? this._defaultValue : val;
1761
1818
  }
1762
1819
  set value(newVal) {
1763
1820
  this._object[this._key] = newVal;
@@ -1771,9 +1828,10 @@ class GetterRefImpl {
1771
1828
  this._getter = _getter;
1772
1829
  this["__v_isRef"] = true;
1773
1830
  this["__v_isReadonly"] = true;
1831
+ this._value = void 0;
1774
1832
  }
1775
1833
  get value() {
1776
- return this._getter();
1834
+ return this._value = this._getter();
1777
1835
  }
1778
1836
  }
1779
1837
  function toRef(source, key, defaultValue) {
@@ -1807,7 +1865,8 @@ class ComputedRefImpl {
1807
1865
  /**
1808
1866
  * @internal
1809
1867
  */
1810
- this["__v_isRef"] = true;
1868
+ this.__v_isRef = true;
1869
+ // TODO isolatedDeclarations "__v_isReadonly"
1811
1870
  // A computed is also a subscriber that tracks other deps
1812
1871
  /**
1813
1872
  * @internal
@@ -2437,6 +2496,9 @@ function reload(id, newComp) {
2437
2496
  "[HMR] Root or manually mounted instance modified. Full reload required."
2438
2497
  );
2439
2498
  }
2499
+ if (instance.root.ce && instance !== instance.root) {
2500
+ instance.root.ce._removeChildStyle(oldComp);
2501
+ }
2440
2502
  }
2441
2503
  queuePostFlushCb(() => {
2442
2504
  hmrDirtyComponents.clear();
@@ -2516,9 +2578,7 @@ function devtoolsInitApp(app, version) {
2516
2578
  function devtoolsUnmountApp(app) {
2517
2579
  emit$2("app:unmount" /* APP_UNMOUNT */, app);
2518
2580
  }
2519
- const devtoolsComponentAdded = /* @__PURE__ */ createDevtoolsComponentHook(
2520
- "component:added" /* COMPONENT_ADDED */
2521
- );
2581
+ const devtoolsComponentAdded = /* @__PURE__ */ createDevtoolsComponentHook("component:added" /* COMPONENT_ADDED */);
2522
2582
  const devtoolsComponentUpdated = /* @__PURE__ */ createDevtoolsComponentHook("component:updated" /* COMPONENT_UPDATED */);
2523
2583
  const _devtoolsComponentRemoved = /* @__PURE__ */ createDevtoolsComponentHook(
2524
2584
  "component:removed" /* COMPONENT_REMOVED */
@@ -2542,12 +2602,8 @@ function createDevtoolsComponentHook(hook) {
2542
2602
  );
2543
2603
  };
2544
2604
  }
2545
- const devtoolsPerfStart = /* @__PURE__ */ createDevtoolsPerformanceHook(
2546
- "perf:start" /* PERFORMANCE_START */
2547
- );
2548
- const devtoolsPerfEnd = /* @__PURE__ */ createDevtoolsPerformanceHook(
2549
- "perf:end" /* PERFORMANCE_END */
2550
- );
2605
+ const devtoolsPerfStart = /* @__PURE__ */ createDevtoolsPerformanceHook("perf:start" /* PERFORMANCE_START */);
2606
+ const devtoolsPerfEnd = /* @__PURE__ */ createDevtoolsPerformanceHook("perf:end" /* PERFORMANCE_END */);
2551
2607
  function createDevtoolsPerformanceHook(hook) {
2552
2608
  return (component, type, time) => {
2553
2609
  emit$2(hook, component.appContext.app, component.uid, component, type, time);
@@ -4260,6 +4316,7 @@ Server rendered element contains more child nodes than client vdom.`
4260
4316
  }
4261
4317
  if (props) {
4262
4318
  if (!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__ || forcePatch || !optimized || patchFlag & (16 | 32)) {
4319
+ const isCustomElement = el.tagName.includes("-");
4263
4320
  for (const key in props) {
4264
4321
  if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_HYDRATION_MISMATCH_DETAILS__) && // #11189 skip if this node has directives that have created hooks
4265
4322
  // as it could have mutated the DOM in any possible way
@@ -4267,7 +4324,7 @@ Server rendered element contains more child nodes than client vdom.`
4267
4324
  logMismatchError();
4268
4325
  }
4269
4326
  if (forcePatch && (key.endsWith("value") || key === "indeterminate") || isOn(key) && !isReservedProp(key) || // force hydrate v-bind with .prop modifiers
4270
- key[0] === ".") {
4327
+ key[0] === "." || isCustomElement) {
4271
4328
  patchProp(el, key, null, props[key], void 0, parentComponent);
4272
4329
  }
4273
4330
  }
@@ -4603,24 +4660,19 @@ function isMismatchAllowed(el, allowedType) {
4603
4660
  }
4604
4661
  }
4605
4662
 
4606
- const hydrateOnIdle = () => (hydrate) => {
4607
- const id = requestIdleCallback(hydrate);
4663
+ const hydrateOnIdle = (timeout = 1e4) => (hydrate) => {
4664
+ const id = requestIdleCallback(hydrate, { timeout });
4608
4665
  return () => cancelIdleCallback(id);
4609
4666
  };
4610
- const hydrateOnVisible = (margin = 0) => (hydrate, forEach) => {
4611
- const ob = new IntersectionObserver(
4612
- (entries) => {
4613
- for (const e of entries) {
4614
- if (!e.isIntersecting) continue;
4615
- ob.disconnect();
4616
- hydrate();
4617
- break;
4618
- }
4619
- },
4620
- {
4621
- rootMargin: isString(margin) ? margin : margin + "px"
4667
+ const hydrateOnVisible = (opts) => (hydrate, forEach) => {
4668
+ const ob = new IntersectionObserver((entries) => {
4669
+ for (const e of entries) {
4670
+ if (!e.isIntersecting) continue;
4671
+ ob.disconnect();
4672
+ hydrate();
4673
+ break;
4622
4674
  }
4623
- );
4675
+ }, opts);
4624
4676
  forEach((el) => ob.observe(el));
4625
4677
  return () => ob.disconnect();
4626
4678
  };
@@ -4935,7 +4987,7 @@ const KeepAliveImpl = {
4935
4987
  }
4936
4988
  function pruneCacheEntry(key) {
4937
4989
  const cached = cache.get(key);
4938
- if (!current || !isSameVNodeType(cached, current)) {
4990
+ if (cached && (!current || !isSameVNodeType(cached, current))) {
4939
4991
  unmount(cached);
4940
4992
  } else if (current) {
4941
4993
  resetShapeFlag(current);
@@ -4997,6 +5049,10 @@ const KeepAliveImpl = {
4997
5049
  return rawVNode;
4998
5050
  }
4999
5051
  let vnode = getInnerChild(rawVNode);
5052
+ if (vnode.type === Comment) {
5053
+ current = null;
5054
+ return vnode;
5055
+ }
5000
5056
  const comp = vnode.type;
5001
5057
  const name = getComponentName(
5002
5058
  isAsyncWrapper(vnode) ? vnode.type.__asyncResolved || {} : comp
@@ -5129,17 +5185,19 @@ const createHook = (lifecycle) => (hook, target = currentInstance) => {
5129
5185
  };
5130
5186
  const onBeforeMount = createHook("bm");
5131
5187
  const onMounted = createHook("m");
5132
- const onBeforeUpdate = createHook("bu");
5188
+ const onBeforeUpdate = createHook(
5189
+ "bu"
5190
+ );
5133
5191
  const onUpdated = createHook("u");
5134
- const onBeforeUnmount = createHook("bum");
5135
- const onUnmounted = createHook("um");
5136
- const onServerPrefetch = createHook("sp");
5137
- const onRenderTriggered = createHook(
5138
- "rtg"
5192
+ const onBeforeUnmount = createHook(
5193
+ "bum"
5139
5194
  );
5140
- const onRenderTracked = createHook(
5141
- "rtc"
5195
+ const onUnmounted = createHook("um");
5196
+ const onServerPrefetch = createHook(
5197
+ "sp"
5142
5198
  );
5199
+ const onRenderTriggered = createHook("rtg");
5200
+ const onRenderTracked = createHook("rtc");
5143
5201
  function onErrorCaptured(hook, target = currentInstance) {
5144
5202
  injectHook("ec", hook, target);
5145
5203
  }
@@ -5553,9 +5611,14 @@ function createSlots(slots, dynamicSlots) {
5553
5611
  }
5554
5612
 
5555
5613
  function renderSlot(slots, name, props = {}, fallback, noSlotted) {
5556
- if (currentRenderingInstance.isCE || currentRenderingInstance.parent && isAsyncWrapper(currentRenderingInstance.parent) && currentRenderingInstance.parent.isCE) {
5614
+ if (currentRenderingInstance.ce || currentRenderingInstance.parent && isAsyncWrapper(currentRenderingInstance.parent) && currentRenderingInstance.parent.ce) {
5557
5615
  if (name !== "default") props.name = name;
5558
- return createVNode("slot", props, fallback && fallback());
5616
+ return openBlock(), createBlock(
5617
+ Fragment,
5618
+ null,
5619
+ [createVNode("slot", props, fallback && fallback())],
5620
+ 64
5621
+ );
5559
5622
  }
5560
5623
  let slot = slots[name];
5561
5624
  if (!!(process.env.NODE_ENV !== "production") && slot && slot.length > 1) {
@@ -5857,6 +5920,7 @@ const publicPropertiesMap = (
5857
5920
  $refs: (i) => !!(process.env.NODE_ENV !== "production") ? shallowReadonly(i.refs) : i.refs,
5858
5921
  $parent: (i) => getPublicInstance(i.parent),
5859
5922
  $root: (i) => getPublicInstance(i.root),
5923
+ $host: (i) => i.ce,
5860
5924
  $emit: (i) => i.emit,
5861
5925
  $options: (i) => __VUE_OPTIONS_API__ ? resolveMergedOptions(i) : i.type,
5862
5926
  $forceUpdate: (i) => i.f || (i.f = () => {
@@ -6017,29 +6081,25 @@ if (!!(process.env.NODE_ENV !== "production") && true) {
6017
6081
  return Reflect.ownKeys(target);
6018
6082
  };
6019
6083
  }
6020
- const RuntimeCompiledPublicInstanceProxyHandlers = /* @__PURE__ */ extend(
6021
- {},
6022
- PublicInstanceProxyHandlers,
6023
- {
6024
- get(target, key) {
6025
- if (key === Symbol.unscopables) {
6026
- return;
6027
- }
6028
- return PublicInstanceProxyHandlers.get(target, key, target);
6029
- },
6030
- has(_, key) {
6031
- const has = key[0] !== "_" && !isGloballyAllowed(key);
6032
- if (!!(process.env.NODE_ENV !== "production") && !has && PublicInstanceProxyHandlers.has(_, key)) {
6033
- warn$1(
6034
- `Property ${JSON.stringify(
6035
- key
6036
- )} should not start with _ which is a reserved prefix for Vue internals.`
6037
- );
6038
- }
6039
- return has;
6084
+ const RuntimeCompiledPublicInstanceProxyHandlers = /* @__PURE__ */ extend({}, PublicInstanceProxyHandlers, {
6085
+ get(target, key) {
6086
+ if (key === Symbol.unscopables) {
6087
+ return;
6088
+ }
6089
+ return PublicInstanceProxyHandlers.get(target, key, target);
6090
+ },
6091
+ has(_, key) {
6092
+ const has = key[0] !== "_" && !isGloballyAllowed(key);
6093
+ if (!!(process.env.NODE_ENV !== "production") && !has && PublicInstanceProxyHandlers.has(_, key)) {
6094
+ warn$1(
6095
+ `Property ${JSON.stringify(
6096
+ key
6097
+ )} should not start with _ which is a reserved prefix for Vue internals.`
6098
+ );
6040
6099
  }
6100
+ return has;
6041
6101
  }
6042
- );
6102
+ });
6043
6103
  function createDevRenderContext(instance) {
6044
6104
  const target = {};
6045
6105
  Object.defineProperty(target, `_`, {
@@ -6728,7 +6788,7 @@ function createCompatVue$1(createApp, createSingletonApp) {
6728
6788
  return vm;
6729
6789
  }
6730
6790
  }
6731
- Vue.version = `2.6.14-compat:${"3.5.0-alpha.5"}`;
6791
+ Vue.version = `2.6.14-compat:${"3.5.0-beta.1"}`;
6732
6792
  Vue.config = singletonApp.config;
6733
6793
  Vue.use = (plugin, ...options) => {
6734
6794
  if (plugin && isFunction(plugin.install)) {
@@ -7001,7 +7061,7 @@ function installCompatMount(app, context, render) {
7001
7061
  /* skip options */
7002
7062
  );
7003
7063
  }
7004
- container.innerHTML = "";
7064
+ container.textContent = "";
7005
7065
  render(vnode, container, namespace);
7006
7066
  if (container instanceof Element) {
7007
7067
  container.removeAttribute("v-cloak");
@@ -7215,7 +7275,7 @@ function createAppAPI(render, hydrate) {
7215
7275
  If you want to mount another app on the same host container, you need to unmount the previous app by calling \`app.unmount()\` first.`
7216
7276
  );
7217
7277
  }
7218
- const vnode = createVNode(rootComponent, rootProps);
7278
+ const vnode = app._ceVNode || createVNode(rootComponent, rootProps);
7219
7279
  vnode.appContext = context;
7220
7280
  if (namespace === true) {
7221
7281
  namespace = "svg";
@@ -7320,7 +7380,7 @@ function provide(key, value) {
7320
7380
  function inject(key, defaultValue, treatDefaultAsFactory = false) {
7321
7381
  const instance = currentInstance || currentRenderingInstance;
7322
7382
  if (instance || currentApp) {
7323
- const provides = instance ? instance.parent == null ? instance.vnode.appContext && instance.vnode.appContext.provides : instance.parent.provides : currentApp._context.provides;
7383
+ const provides = currentApp ? currentApp._context.provides : instance ? instance.parent == null ? instance.vnode.appContext && instance.vnode.appContext.provides : instance.parent.provides : void 0;
7324
7384
  if (provides && key in provides) {
7325
7385
  return provides[key];
7326
7386
  } else if (arguments.length > 1) {
@@ -7594,6 +7654,9 @@ function resolvePropValue(options, props, key, value, instance, isAbsent) {
7594
7654
  } else {
7595
7655
  value = defaultValue;
7596
7656
  }
7657
+ if (instance.ce) {
7658
+ instance.ce._setProp(key, value);
7659
+ }
7597
7660
  }
7598
7661
  if (opt[0 /* shouldCast */]) {
7599
7662
  if (isAbsent && !hasDefault) {
@@ -8634,8 +8697,8 @@ function baseCreateRenderer(options, createHydrationFns) {
8634
8697
  const componentUpdateFn = () => {
8635
8698
  if (!instance.isMounted) {
8636
8699
  let vnodeHook;
8637
- const { el, props, type } = initialVNode;
8638
- const { bm, m, parent } = instance;
8700
+ const { el, props } = initialVNode;
8701
+ const { bm, m, parent, root, type } = instance;
8639
8702
  const isAsyncWrapperVNode = isAsyncWrapper(initialVNode);
8640
8703
  toggleRecurse(instance, false);
8641
8704
  if (bm) {
@@ -8681,6 +8744,9 @@ function baseCreateRenderer(options, createHydrationFns) {
8681
8744
  hydrateSubTree();
8682
8745
  }
8683
8746
  } else {
8747
+ if (root.ce) {
8748
+ root.ce._injectChildStyle(type);
8749
+ }
8684
8750
  if (!!(process.env.NODE_ENV !== "production")) {
8685
8751
  startMeasure(instance, `render`);
8686
8752
  }
@@ -9384,13 +9450,13 @@ function baseCreateRenderer(options, createHydrationFns) {
9384
9450
  namespace
9385
9451
  );
9386
9452
  }
9453
+ container._vnode = vnode;
9387
9454
  if (!isFlushing) {
9388
9455
  isFlushing = true;
9389
9456
  flushPreFlushCbs();
9390
9457
  flushPostFlushCbs();
9391
9458
  isFlushing = false;
9392
9459
  }
9393
- container._vnode = vnode;
9394
9460
  };
9395
9461
  const internals = {
9396
9462
  p: patch,
@@ -9564,14 +9630,9 @@ function doWatch(source, cb, {
9564
9630
  const _cb = cb;
9565
9631
  cb = (...args) => {
9566
9632
  _cb(...args);
9567
- unwatch();
9633
+ watchHandle();
9568
9634
  };
9569
9635
  }
9570
- if (!!(process.env.NODE_ENV !== "production") && deep !== void 0 && typeof deep === "number") {
9571
- warn$1(
9572
- `watch() "deep" option with number value will be used as watch depth in future versions. Please use a boolean instead to avoid potential breakage.`
9573
- );
9574
- }
9575
9636
  if (!!(process.env.NODE_ENV !== "production") && !cb) {
9576
9637
  if (immediate !== void 0) {
9577
9638
  warn$1(
@@ -9597,10 +9658,12 @@ function doWatch(source, cb, {
9597
9658
  );
9598
9659
  };
9599
9660
  const instance = currentInstance;
9600
- const reactiveGetter = (source2) => deep === true ? source2 : (
9601
- // for deep: false, only traverse root-level properties
9602
- traverse(source2, deep === false ? 1 : void 0)
9603
- );
9661
+ const reactiveGetter = (source2) => {
9662
+ if (deep) return source2;
9663
+ if (isShallow(source2) || deep === false || deep === 0)
9664
+ return traverse(source2, 1);
9665
+ return traverse(source2);
9666
+ };
9604
9667
  let getter;
9605
9668
  let forceTrigger = false;
9606
9669
  let isMultiSource = false;
@@ -9656,7 +9719,8 @@ function doWatch(source, cb, {
9656
9719
  }
9657
9720
  if (cb && deep) {
9658
9721
  const baseGetter = getter;
9659
- getter = () => traverse(baseGetter());
9722
+ const depth = deep === true ? Infinity : deep;
9723
+ getter = () => traverse(baseGetter(), depth);
9660
9724
  }
9661
9725
  let cleanup;
9662
9726
  let onCleanup = (fn) => {
@@ -9681,7 +9745,12 @@ function doWatch(source, cb, {
9681
9745
  const ctx = useSSRContext();
9682
9746
  ssrCleanup = ctx.__watcherHandles || (ctx.__watcherHandles = []);
9683
9747
  } else {
9684
- return NOOP;
9748
+ const watchHandle2 = () => {
9749
+ };
9750
+ watchHandle2.stop = NOOP;
9751
+ watchHandle2.resume = NOOP;
9752
+ watchHandle2.pause = NOOP;
9753
+ return watchHandle2;
9685
9754
  }
9686
9755
  }
9687
9756
  let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
@@ -9722,12 +9791,15 @@ function doWatch(source, cb, {
9722
9791
  }
9723
9792
  effect.scheduler = scheduler;
9724
9793
  const scope = getCurrentScope();
9725
- const unwatch = () => {
9794
+ const watchHandle = () => {
9726
9795
  effect.stop();
9727
9796
  if (scope) {
9728
9797
  remove(scope.effects, effect);
9729
9798
  }
9730
9799
  };
9800
+ watchHandle.pause = effect.pause.bind(effect);
9801
+ watchHandle.resume = effect.resume.bind(effect);
9802
+ watchHandle.stop = watchHandle;
9731
9803
  if (!!(process.env.NODE_ENV !== "production")) {
9732
9804
  effect.onTrack = onTrack;
9733
9805
  effect.onTrigger = onTrigger;
@@ -9746,8 +9818,8 @@ function doWatch(source, cb, {
9746
9818
  } else {
9747
9819
  effect.run();
9748
9820
  }
9749
- if (ssrCleanup) ssrCleanup.push(unwatch);
9750
- return unwatch;
9821
+ if (ssrCleanup) ssrCleanup.push(watchHandle);
9822
+ return watchHandle;
9751
9823
  }
9752
9824
  function instanceWatch(source, value, options) {
9753
9825
  const publicThis = this.proxy;
@@ -9837,7 +9909,8 @@ function useModel(props, name, options = EMPTY_OBJ) {
9837
9909
  return options.get ? options.get(localValue) : localValue;
9838
9910
  },
9839
9911
  set(value) {
9840
- if (!hasChanged(value, localValue) && !(prevSetValue !== EMPTY_OBJ && hasChanged(value, prevSetValue))) {
9912
+ const emittedValue = options.set ? options.set(value) : value;
9913
+ if (!hasChanged(emittedValue, localValue) && !(prevSetValue !== EMPTY_OBJ && hasChanged(value, prevSetValue))) {
9841
9914
  return;
9842
9915
  }
9843
9916
  const rawProps = i.vnode.props;
@@ -9846,7 +9919,6 @@ function useModel(props, name, options = EMPTY_OBJ) {
9846
9919
  localValue = value;
9847
9920
  trigger();
9848
9921
  }
9849
- const emittedValue = options.set ? options.set(value) : value;
9850
9922
  i.emit(`update:${name}`, emittedValue);
9851
9923
  if (hasChanged(value, emittedValue) && hasChanged(value, prevSetValue) && !hasChanged(emittedValue, prevEmittedValue)) {
9852
9924
  trigger();
@@ -9884,9 +9956,9 @@ function emit(instance, event, ...rawArgs) {
9884
9956
  } = instance;
9885
9957
  if (emitsOptions) {
9886
9958
  if (!(event in emitsOptions) && !(event.startsWith("hook:") || event.startsWith(compatModelEventPrefix))) {
9887
- if (!propsOptions || !(toHandlerKey(event) in propsOptions)) {
9959
+ if (!propsOptions || !(toHandlerKey(camelize(event)) in propsOptions)) {
9888
9960
  warn$1(
9889
- `Component emitted event "${event}" but it is neither declared in the emits option nor as an "${toHandlerKey(event)}" prop.`
9961
+ `Component emitted event "${event}" but it is neither declared in the emits option nor as an "${toHandlerKey(camelize(event))}" prop.`
9890
9962
  );
9891
9963
  }
9892
9964
  } else {
@@ -11831,11 +11903,16 @@ function useTemplateRef(key) {
11831
11903
  const r = shallowRef(null);
11832
11904
  if (i) {
11833
11905
  const refs = i.refs === EMPTY_OBJ ? i.refs = {} : i.refs;
11834
- Object.defineProperty(refs, key, {
11835
- enumerable: true,
11836
- get: () => r.value,
11837
- set: (val) => r.value = val
11838
- });
11906
+ let desc;
11907
+ if (!!(process.env.NODE_ENV !== "production") && (desc = Object.getOwnPropertyDescriptor(refs, key)) && !desc.configurable) {
11908
+ warn$1(`useTemplateRef('${key}') already exists.`);
11909
+ } else {
11910
+ Object.defineProperty(refs, key, {
11911
+ enumerable: true,
11912
+ get: () => r.value,
11913
+ set: (val) => r.value = val
11914
+ });
11915
+ }
11839
11916
  } else if (!!(process.env.NODE_ENV !== "production")) {
11840
11917
  warn$1(
11841
11918
  `useTemplateRef() is called when there is no active component instance to be associated with.`
@@ -12069,7 +12146,7 @@ function isMemoSame(cached, memo) {
12069
12146
  return true;
12070
12147
  }
12071
12148
 
12072
- const version = "3.5.0-alpha.5";
12149
+ const version = "3.5.0-beta.1";
12073
12150
  const warn = !!(process.env.NODE_ENV !== "production") ? warn$1 : NOOP;
12074
12151
  const ErrorTypeStrings = ErrorTypeStrings$1 ;
12075
12152
  const devtools = !!(process.env.NODE_ENV !== "production") || true ? devtools$1 : void 0;
@@ -12081,7 +12158,8 @@ const _ssrUtils = {
12081
12158
  setCurrentRenderingInstance,
12082
12159
  isVNode: isVNode,
12083
12160
  normalizeVNode,
12084
- getComponentPublicInstance
12161
+ getComponentPublicInstance,
12162
+ ensureValidVNode
12085
12163
  };
12086
12164
  const ssrUtils = _ssrUtils ;
12087
12165
  const resolveFilter = resolveFilter$1 ;
@@ -12095,6 +12173,18 @@ const _compatUtils = {
12095
12173
  const compatUtils = _compatUtils ;
12096
12174
  const DeprecationTypes = DeprecationTypes$1 ;
12097
12175
 
12176
+ let policy = void 0;
12177
+ const tt = typeof window !== "undefined" && window.trustedTypes;
12178
+ if (tt) {
12179
+ try {
12180
+ policy = /* @__PURE__ */ tt.createPolicy("vue", {
12181
+ createHTML: (val) => val
12182
+ });
12183
+ } catch (e) {
12184
+ !!(process.env.NODE_ENV !== "production") && warn(`Error creating trusted types policy: ${e}`);
12185
+ }
12186
+ }
12187
+ const unsafeToTrustedHTML = policy ? (val) => policy.createHTML(val) : (val) => val;
12098
12188
  const svgNS = "http://www.w3.org/2000/svg";
12099
12189
  const mathmlNS = "http://www.w3.org/1998/Math/MathML";
12100
12190
  const doc = typeof document !== "undefined" ? document : null;
@@ -12142,7 +12232,9 @@ const nodeOps = {
12142
12232
  if (start === end || !(start = start.nextSibling)) break;
12143
12233
  }
12144
12234
  } else {
12145
- templateContainer.innerHTML = namespace === "svg" ? `<svg>${content}</svg>` : namespace === "mathml" ? `<math>${content}</math>` : content;
12235
+ templateContainer.innerHTML = unsafeToTrustedHTML(
12236
+ namespace === "svg" ? `<svg>${content}</svg>` : namespace === "mathml" ? `<math>${content}</math>` : content
12237
+ );
12146
12238
  const template = templateContainer.content;
12147
12239
  if (namespace === "svg" || namespace === "mathml") {
12148
12240
  const wrapper = template.firstChild;
@@ -12549,11 +12641,17 @@ function useCssVars(getter) {
12549
12641
  }
12550
12642
  const setVars = () => {
12551
12643
  const vars = getter(instance.proxy);
12552
- setVarsOnVNode(instance.subTree, vars);
12644
+ if (instance.ce) {
12645
+ setVarsOnNode(instance.ce, vars);
12646
+ } else {
12647
+ setVarsOnVNode(instance.subTree, vars);
12648
+ }
12553
12649
  updateTeleports(vars);
12554
12650
  };
12555
- onMounted(() => {
12651
+ onBeforeMount(() => {
12556
12652
  watchPostEffect(setVars);
12653
+ });
12654
+ onMounted(() => {
12557
12655
  const ob = new MutationObserver(setVars);
12558
12656
  ob.observe(instance.subTree.el.parentNode, { childList: true });
12559
12657
  onUnmounted(() => ob.disconnect());
@@ -12950,16 +13048,24 @@ function shouldSetAsProp(el, key, value, isSVG) {
12950
13048
  if (isNativeOn(key) && isString(value)) {
12951
13049
  return false;
12952
13050
  }
12953
- return key in el;
13051
+ if (key in el) {
13052
+ return true;
13053
+ }
13054
+ if (el._isVueCE && (/[A-Z]/.test(key) || !isString(value))) {
13055
+ return true;
13056
+ }
13057
+ return false;
12954
13058
  }
12955
13059
 
13060
+ const REMOVAL = {};
12956
13061
  /*! #__NO_SIDE_EFFECTS__ */
12957
13062
  // @__NO_SIDE_EFFECTS__
12958
- function defineCustomElement(options, extraOptions, hydrate2) {
13063
+ function defineCustomElement(options, extraOptions, _createApp) {
12959
13064
  const Comp = defineComponent(options, extraOptions);
13065
+ if (isPlainObject(Comp)) extend(Comp, extraOptions);
12960
13066
  class VueCustomElement extends VueElement {
12961
13067
  constructor(initialProps) {
12962
- super(Comp, initialProps, hydrate2);
13068
+ super(Comp, initialProps, _createApp);
12963
13069
  }
12964
13070
  }
12965
13071
  VueCustomElement.def = Comp;
@@ -12967,47 +13073,88 @@ function defineCustomElement(options, extraOptions, hydrate2) {
12967
13073
  }
12968
13074
  /*! #__NO_SIDE_EFFECTS__ */
12969
13075
  const defineSSRCustomElement = /* @__NO_SIDE_EFFECTS__ */ (options, extraOptions) => {
12970
- return /* @__PURE__ */ defineCustomElement(options, extraOptions, hydrate);
13076
+ return /* @__PURE__ */ defineCustomElement(options, extraOptions, createSSRApp);
12971
13077
  };
12972
13078
  const BaseClass = typeof HTMLElement !== "undefined" ? HTMLElement : class {
12973
13079
  };
12974
13080
  class VueElement extends BaseClass {
12975
- constructor(_def, _props = {}, hydrate2) {
13081
+ constructor(_def, _props = {}, _createApp = createApp) {
12976
13082
  super();
12977
13083
  this._def = _def;
12978
13084
  this._props = _props;
13085
+ this._createApp = _createApp;
13086
+ this._isVueCE = true;
12979
13087
  /**
12980
13088
  * @internal
12981
13089
  */
12982
13090
  this._instance = null;
13091
+ /**
13092
+ * @internal
13093
+ */
13094
+ this._app = null;
13095
+ /**
13096
+ * @internal
13097
+ */
13098
+ this._nonce = this._def.nonce;
12983
13099
  this._connected = false;
12984
13100
  this._resolved = false;
12985
13101
  this._numberProps = null;
13102
+ this._styleChildren = /* @__PURE__ */ new WeakSet();
12986
13103
  this._ob = null;
12987
- if (this.shadowRoot && hydrate2) {
12988
- hydrate2(this._createVNode(), this.shadowRoot);
13104
+ if (this.shadowRoot && _createApp !== createApp) {
13105
+ this._root = this.shadowRoot;
13106
+ this._mount(_def);
12989
13107
  } else {
12990
13108
  if (!!(process.env.NODE_ENV !== "production") && this.shadowRoot) {
12991
13109
  warn(
12992
13110
  `Custom element has pre-rendered declarative shadow root but is not defined as hydratable. Use \`defineSSRCustomElement\`.`
12993
13111
  );
12994
13112
  }
12995
- this.attachShadow({ mode: "open" });
13113
+ if (_def.shadowRoot !== false) {
13114
+ this.attachShadow({ mode: "open" });
13115
+ this._root = this.shadowRoot;
13116
+ } else {
13117
+ this._root = this;
13118
+ }
12996
13119
  if (!this._def.__asyncLoader) {
12997
13120
  this._resolveProps(this._def);
12998
13121
  }
12999
13122
  }
13000
13123
  }
13001
13124
  connectedCallback() {
13125
+ if (!this.shadowRoot) {
13126
+ this._parseSlots();
13127
+ }
13002
13128
  this._connected = true;
13129
+ let parent = this;
13130
+ while (parent = parent && (parent.parentNode || parent.host)) {
13131
+ if (parent instanceof VueElement) {
13132
+ this._parent = parent;
13133
+ break;
13134
+ }
13135
+ }
13003
13136
  if (!this._instance) {
13004
13137
  if (this._resolved) {
13138
+ this._setParent();
13005
13139
  this._update();
13006
13140
  } else {
13007
- this._resolveDef();
13141
+ if (parent && parent._pendingResolve) {
13142
+ this._pendingResolve = parent._pendingResolve.then(() => {
13143
+ this._pendingResolve = void 0;
13144
+ this._resolveDef();
13145
+ });
13146
+ } else {
13147
+ this._resolveDef();
13148
+ }
13008
13149
  }
13009
13150
  }
13010
13151
  }
13152
+ _setParent(parent = this._parent) {
13153
+ if (parent) {
13154
+ this._instance.parent = parent._instance;
13155
+ this._instance.provides = parent._instance.provides;
13156
+ }
13157
+ }
13011
13158
  disconnectedCallback() {
13012
13159
  this._connected = false;
13013
13160
  nextTick(() => {
@@ -13016,8 +13163,9 @@ class VueElement extends BaseClass {
13016
13163
  this._ob.disconnect();
13017
13164
  this._ob = null;
13018
13165
  }
13019
- render(null, this.shadowRoot);
13020
- this._instance = null;
13166
+ this._app && this._app.unmount();
13167
+ this._instance.ce = void 0;
13168
+ this._app = this._instance = null;
13021
13169
  }
13022
13170
  });
13023
13171
  }
@@ -13025,7 +13173,9 @@ class VueElement extends BaseClass {
13025
13173
  * resolve inner component definition (handle possible async component)
13026
13174
  */
13027
13175
  _resolveDef() {
13028
- this._resolved = true;
13176
+ if (this._pendingResolve) {
13177
+ return;
13178
+ }
13029
13179
  for (let i = 0; i < this.attributes.length; i++) {
13030
13180
  this._setAttr(this.attributes[i].name);
13031
13181
  }
@@ -13036,6 +13186,8 @@ class VueElement extends BaseClass {
13036
13186
  });
13037
13187
  this._ob.observe(this, { attributes: true });
13038
13188
  const resolve = (def, isAsync = false) => {
13189
+ this._resolved = true;
13190
+ this._pendingResolve = void 0;
13039
13191
  const { props, styles } = def;
13040
13192
  let numberProps;
13041
13193
  if (props && !isArray(props)) {
@@ -13053,22 +13205,53 @@ class VueElement extends BaseClass {
13053
13205
  if (isAsync) {
13054
13206
  this._resolveProps(def);
13055
13207
  }
13056
- this._applyStyles(styles);
13057
- this._update();
13208
+ if (this.shadowRoot) {
13209
+ this._applyStyles(styles);
13210
+ } else if (!!(process.env.NODE_ENV !== "production") && styles) {
13211
+ warn(
13212
+ "Custom element style injection is not supported when using shadowRoot: false"
13213
+ );
13214
+ }
13215
+ this._mount(def);
13058
13216
  };
13059
13217
  const asyncDef = this._def.__asyncLoader;
13060
13218
  if (asyncDef) {
13061
- asyncDef().then((def) => resolve(def, true));
13219
+ this._pendingResolve = asyncDef().then(
13220
+ (def) => resolve(this._def = def, true)
13221
+ );
13062
13222
  } else {
13063
13223
  resolve(this._def);
13064
13224
  }
13065
13225
  }
13226
+ _mount(def) {
13227
+ if ((!!(process.env.NODE_ENV !== "production") || __VUE_PROD_DEVTOOLS__) && !def.name) {
13228
+ def.name = "VueElement";
13229
+ }
13230
+ this._app = this._createApp(def);
13231
+ if (def.configureApp) {
13232
+ def.configureApp(this._app);
13233
+ }
13234
+ this._app._ceVNode = this._createVNode();
13235
+ this._app.mount(this._root);
13236
+ const exposed = this._instance && this._instance.exposed;
13237
+ if (!exposed) return;
13238
+ for (const key in exposed) {
13239
+ if (!hasOwn(this, key)) {
13240
+ Object.defineProperty(this, key, {
13241
+ // unwrap ref to be consistent with public instance behavior
13242
+ get: () => unref(exposed[key])
13243
+ });
13244
+ } else if (!!(process.env.NODE_ENV !== "production")) {
13245
+ warn(`Exposed property "${key}" already exists on custom element.`);
13246
+ }
13247
+ }
13248
+ }
13066
13249
  _resolveProps(def) {
13067
13250
  const { props } = def;
13068
13251
  const declaredPropKeys = isArray(props) ? props : Object.keys(props || {});
13069
13252
  for (const key of Object.keys(this)) {
13070
13253
  if (key[0] !== "_" && declaredPropKeys.includes(key)) {
13071
- this._setProp(key, this[key], true, false);
13254
+ this._setProp(key, this[key]);
13072
13255
  }
13073
13256
  }
13074
13257
  for (const key of declaredPropKeys.map(camelize)) {
@@ -13077,18 +13260,20 @@ class VueElement extends BaseClass {
13077
13260
  return this._getProp(key);
13078
13261
  },
13079
13262
  set(val) {
13080
- this._setProp(key, val);
13263
+ this._setProp(key, val, true, true);
13081
13264
  }
13082
13265
  });
13083
13266
  }
13084
13267
  }
13085
13268
  _setAttr(key) {
13086
- let value = this.hasAttribute(key) ? this.getAttribute(key) : void 0;
13269
+ if (key.startsWith("data-v-")) return;
13270
+ const has = this.hasAttribute(key);
13271
+ let value = has ? this.getAttribute(key) : REMOVAL;
13087
13272
  const camelKey = camelize(key);
13088
- if (this._numberProps && this._numberProps[camelKey]) {
13273
+ if (has && this._numberProps && this._numberProps[camelKey]) {
13089
13274
  value = toNumber(value);
13090
13275
  }
13091
- this._setProp(camelKey, value, false);
13276
+ this._setProp(camelKey, value, false, true);
13092
13277
  }
13093
13278
  /**
13094
13279
  * @internal
@@ -13099,9 +13284,13 @@ class VueElement extends BaseClass {
13099
13284
  /**
13100
13285
  * @internal
13101
13286
  */
13102
- _setProp(key, val, shouldReflect = true, shouldUpdate = true) {
13287
+ _setProp(key, val, shouldReflect = true, shouldUpdate = false) {
13103
13288
  if (val !== this._props[key]) {
13104
- this._props[key] = val;
13289
+ if (val === REMOVAL) {
13290
+ delete this._props[key];
13291
+ } else {
13292
+ this._props[key] = val;
13293
+ }
13105
13294
  if (shouldUpdate && this._instance) {
13106
13295
  this._update();
13107
13296
  }
@@ -13117,18 +13306,22 @@ class VueElement extends BaseClass {
13117
13306
  }
13118
13307
  }
13119
13308
  _update() {
13120
- render(this._createVNode(), this.shadowRoot);
13309
+ render(this._createVNode(), this._root);
13121
13310
  }
13122
13311
  _createVNode() {
13123
- const vnode = createVNode(this._def, extend({}, this._props));
13312
+ const baseProps = {};
13313
+ if (!this.shadowRoot) {
13314
+ baseProps.onVnodeMounted = baseProps.onVnodeUpdated = this._renderSlots.bind(this);
13315
+ }
13316
+ const vnode = createVNode(this._def, extend(baseProps, this._props));
13124
13317
  if (!this._instance) {
13125
13318
  vnode.ce = (instance) => {
13126
13319
  this._instance = instance;
13127
- instance.isCE = true;
13320
+ instance.ce = this;
13128
13321
  if (!!(process.env.NODE_ENV !== "production")) {
13129
13322
  instance.ceReload = (newStyles) => {
13130
13323
  if (this._styles) {
13131
- this._styles.forEach((s) => this.shadowRoot.removeChild(s));
13324
+ this._styles.forEach((s) => this._root.removeChild(s));
13132
13325
  this._styles.length = 0;
13133
13326
  }
13134
13327
  this._applyStyles(newStyles);
@@ -13138,9 +13331,10 @@ class VueElement extends BaseClass {
13138
13331
  }
13139
13332
  const dispatch = (event, args) => {
13140
13333
  this.dispatchEvent(
13141
- new CustomEvent(event, {
13142
- detail: args
13143
- })
13334
+ new CustomEvent(
13335
+ event,
13336
+ isPlainObject(args[0]) ? extend({ detail: args }, args[0]) : { detail: args }
13337
+ )
13144
13338
  );
13145
13339
  };
13146
13340
  instance.emit = (event, ...args) => {
@@ -13149,30 +13343,126 @@ class VueElement extends BaseClass {
13149
13343
  dispatch(hyphenate(event), args);
13150
13344
  }
13151
13345
  };
13152
- let parent = this;
13153
- while (parent = parent && (parent.parentNode || parent.host)) {
13154
- if (parent instanceof VueElement) {
13155
- instance.parent = parent._instance;
13156
- instance.provides = parent._instance.provides;
13157
- break;
13158
- }
13159
- }
13346
+ this._setParent();
13160
13347
  };
13161
13348
  }
13162
13349
  return vnode;
13163
13350
  }
13164
- _applyStyles(styles) {
13165
- if (styles) {
13166
- styles.forEach((css) => {
13167
- const s = document.createElement("style");
13168
- s.textContent = css;
13169
- this.shadowRoot.appendChild(s);
13170
- if (!!(process.env.NODE_ENV !== "production")) {
13351
+ _applyStyles(styles, owner) {
13352
+ if (!styles) return;
13353
+ if (owner) {
13354
+ if (owner === this._def || this._styleChildren.has(owner)) {
13355
+ return;
13356
+ }
13357
+ this._styleChildren.add(owner);
13358
+ }
13359
+ const nonce = this._nonce;
13360
+ for (let i = styles.length - 1; i >= 0; i--) {
13361
+ const s = document.createElement("style");
13362
+ if (nonce) s.setAttribute("nonce", nonce);
13363
+ s.textContent = styles[i];
13364
+ this.shadowRoot.prepend(s);
13365
+ if (!!(process.env.NODE_ENV !== "production")) {
13366
+ if (owner) {
13367
+ if (owner.__hmrId) {
13368
+ if (!this._childStyles) this._childStyles = /* @__PURE__ */ new Map();
13369
+ let entry = this._childStyles.get(owner.__hmrId);
13370
+ if (!entry) {
13371
+ this._childStyles.set(owner.__hmrId, entry = []);
13372
+ }
13373
+ entry.push(s);
13374
+ }
13375
+ } else {
13171
13376
  (this._styles || (this._styles = [])).push(s);
13172
13377
  }
13173
- });
13378
+ }
13379
+ }
13380
+ }
13381
+ /**
13382
+ * Only called when shaddowRoot is false
13383
+ */
13384
+ _parseSlots() {
13385
+ const slots = this._slots = {};
13386
+ let n;
13387
+ while (n = this.firstChild) {
13388
+ const slotName = n.nodeType === 1 && n.getAttribute("slot") || "default";
13389
+ (slots[slotName] || (slots[slotName] = [])).push(n);
13390
+ this.removeChild(n);
13174
13391
  }
13175
13392
  }
13393
+ /**
13394
+ * Only called when shaddowRoot is false
13395
+ */
13396
+ _renderSlots() {
13397
+ const outlets = this.querySelectorAll("slot");
13398
+ const scopeId = this._instance.type.__scopeId;
13399
+ for (let i = 0; i < outlets.length; i++) {
13400
+ const o = outlets[i];
13401
+ const slotName = o.getAttribute("name") || "default";
13402
+ const content = this._slots[slotName];
13403
+ const parent = o.parentNode;
13404
+ if (content) {
13405
+ for (const n of content) {
13406
+ if (scopeId && n.nodeType === 1) {
13407
+ const id = scopeId + "-s";
13408
+ const walker = document.createTreeWalker(n, 1);
13409
+ n.setAttribute(id, "");
13410
+ let child;
13411
+ while (child = walker.nextNode()) {
13412
+ child.setAttribute(id, "");
13413
+ }
13414
+ }
13415
+ parent.insertBefore(n, o);
13416
+ }
13417
+ } else {
13418
+ while (o.firstChild) parent.insertBefore(o.firstChild, o);
13419
+ }
13420
+ parent.removeChild(o);
13421
+ }
13422
+ }
13423
+ /**
13424
+ * @internal
13425
+ */
13426
+ _injectChildStyle(comp) {
13427
+ this._applyStyles(comp.styles, comp);
13428
+ }
13429
+ /**
13430
+ * @internal
13431
+ */
13432
+ _removeChildStyle(comp) {
13433
+ if (!!(process.env.NODE_ENV !== "production")) {
13434
+ this._styleChildren.delete(comp);
13435
+ if (this._childStyles && comp.__hmrId) {
13436
+ const oldStyles = this._childStyles.get(comp.__hmrId);
13437
+ if (oldStyles) {
13438
+ oldStyles.forEach((s) => this._root.removeChild(s));
13439
+ oldStyles.length = 0;
13440
+ }
13441
+ }
13442
+ }
13443
+ }
13444
+ }
13445
+ function useHost(caller) {
13446
+ const instance = getCurrentInstance();
13447
+ const el = instance && instance.ce;
13448
+ if (el) {
13449
+ return el;
13450
+ } else if (!!(process.env.NODE_ENV !== "production")) {
13451
+ if (!instance) {
13452
+ warn(
13453
+ `${caller || "useHost"} called without an active component instance.`
13454
+ );
13455
+ } else {
13456
+ warn(
13457
+ `${caller || "useHost"} can only be used in components defined via defineCustomElement.`
13458
+ );
13459
+ }
13460
+ }
13461
+ return null;
13462
+ }
13463
+ function useShadowRoot() {
13464
+ const el = !!(process.env.NODE_ENV !== "production") ? useHost("useShadowRoot") : useHost();
13465
+ return el && el.shadowRoot;
13176
13466
  }
13177
13467
 
13178
13468
  function useCssModule(name = "$style") {
@@ -13731,7 +14021,7 @@ const createApp = (...args) => {
13731
14021
  const component = app._component;
13732
14022
  if (!isFunction(component) && !component.render && !component.template) {
13733
14023
  component.template = container.innerHTML;
13734
- if (!!(process.env.NODE_ENV !== "production")) {
14024
+ if (!!(process.env.NODE_ENV !== "production") && container.nodeType === 1) {
13735
14025
  for (let i = 0; i < container.attributes.length; i++) {
13736
14026
  const attr = container.attributes[i];
13737
14027
  if (attr.name !== "v-cloak" && /^(v-|:|@)/.test(attr.name)) {
@@ -13744,7 +14034,9 @@ const createApp = (...args) => {
13744
14034
  }
13745
14035
  }
13746
14036
  }
13747
- container.innerHTML = "";
14037
+ if (container.nodeType === 1) {
14038
+ container.textContent = "";
14039
+ }
13748
14040
  const proxy = mount(container, false, resolveRootNamespace(container));
13749
14041
  if (container instanceof Element) {
13750
14042
  container.removeAttribute("v-cloak");
@@ -13978,9 +14270,11 @@ var runtimeDom = /*#__PURE__*/Object.freeze({
13978
14270
  useAttrs: useAttrs,
13979
14271
  useCssModule: useCssModule,
13980
14272
  useCssVars: useCssVars,
14273
+ useHost: useHost,
13981
14274
  useId: useId,
13982
14275
  useModel: useModel,
13983
14276
  useSSRContext: useSSRContext,
14277
+ useShadowRoot: useShadowRoot,
13984
14278
  useSlots: useSlots,
13985
14279
  useTemplateRef: useTemplateRef,
13986
14280
  useTransitionState: useTransitionState,
@@ -14041,6 +14335,6 @@ Vue.compile = () => {
14041
14335
  }
14042
14336
  };
14043
14337
 
14044
- const { configureCompat } = Vue;
14338
+ const configureCompat = Vue.configureCompat;
14045
14339
 
14046
- export { BaseTransition, BaseTransitionPropsValidators, Comment, DeprecationTypes, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, TrackOpTypes, Transition, TransitionGroup, TriggerOpTypes, VueElement, assertNumber, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, computed, configureCompat, createApp, createBlock, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, Vue as default, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSSRCustomElement, defineSlots, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hasInjectionContext, hydrate, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toValue, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useId, useModel, useSSRContext, useSlots, useTemplateRef, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId };
14340
+ export { BaseTransition, BaseTransitionPropsValidators, Comment, DeprecationTypes, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, TrackOpTypes, Transition, TransitionGroup, TriggerOpTypes, VueElement, assertNumber, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, computed, configureCompat, createApp, createBlock, createCommentVNode, createElementBlock, createBaseVNode as createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, Vue as default, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSSRCustomElement, defineSlots, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hasInjectionContext, hydrate, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, toValue, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useHost, useId, useModel, useSSRContext, useShadowRoot, useSlots, useTemplateRef, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId };