@vue/compat 3.3.9 → 3.4.0-alpha.2

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.
@@ -2,12 +2,8 @@ var Vue = (function () {
2
2
  'use strict';
3
3
 
4
4
  function makeMap(str, expectsLowerCase) {
5
- const map = /* @__PURE__ */ Object.create(null);
6
- const list = str.split(",");
7
- for (let i = 0; i < list.length; i++) {
8
- map[list[i]] = true;
9
- }
10
- return expectsLowerCase ? (val) => !!map[val.toLowerCase()] : (val) => !!map[val];
5
+ const set = new Set(str.split(","));
6
+ return expectsLowerCase ? (val) => set.has(val.toLowerCase()) : (val) => set.has(val);
11
7
  }
12
8
 
13
9
  const EMPTY_OBJ = Object.freeze({}) ;
@@ -357,117 +353,120 @@ var Vue = (function () {
357
353
  }
358
354
  }
359
355
 
360
- const createDep = (effects) => {
361
- const dep = new Set(effects);
362
- dep.w = 0;
363
- dep.n = 0;
364
- return dep;
365
- };
366
- const wasTracked = (dep) => (dep.w & trackOpBit) > 0;
367
- const newTracked = (dep) => (dep.n & trackOpBit) > 0;
368
- const initDepMarkers = ({ deps }) => {
369
- if (deps.length) {
370
- for (let i = 0; i < deps.length; i++) {
371
- deps[i].w |= trackOpBit;
372
- }
373
- }
374
- };
375
- const finalizeDepMarkers = (effect) => {
376
- const { deps } = effect;
377
- if (deps.length) {
378
- let ptr = 0;
379
- for (let i = 0; i < deps.length; i++) {
380
- const dep = deps[i];
381
- if (wasTracked(dep) && !newTracked(dep)) {
382
- dep.delete(effect);
383
- } else {
384
- deps[ptr++] = dep;
385
- }
386
- dep.w &= ~trackOpBit;
387
- dep.n &= ~trackOpBit;
388
- }
389
- deps.length = ptr;
390
- }
391
- };
392
-
393
- const targetMap = /* @__PURE__ */ new WeakMap();
394
- let effectTrackDepth = 0;
395
- let trackOpBit = 1;
396
- const maxMarkerBits = 30;
397
356
  let activeEffect;
398
- const ITERATE_KEY = Symbol("iterate" );
399
- const MAP_KEY_ITERATE_KEY = Symbol("Map key iterate" );
400
357
  class ReactiveEffect {
401
- constructor(fn, scheduler = null, scope) {
358
+ constructor(fn, trigger, scheduler, scope) {
402
359
  this.fn = fn;
360
+ this.trigger = trigger;
403
361
  this.scheduler = scheduler;
404
362
  this.active = true;
405
363
  this.deps = [];
406
- this.parent = void 0;
364
+ /**
365
+ * @internal
366
+ */
367
+ this._dirtyLevel = 3;
368
+ /**
369
+ * @internal
370
+ */
371
+ this._trackId = 0;
372
+ /**
373
+ * @internal
374
+ */
375
+ this._runnings = 0;
376
+ /**
377
+ * @internal
378
+ */
379
+ this._queryings = 0;
380
+ /**
381
+ * @internal
382
+ */
383
+ this._depsLength = 0;
407
384
  recordEffectScope(this, scope);
408
385
  }
386
+ get dirty() {
387
+ if (this._dirtyLevel === 1) {
388
+ this._dirtyLevel = 0;
389
+ this._queryings++;
390
+ pauseTracking();
391
+ for (const dep of this.deps) {
392
+ if (dep.computed) {
393
+ triggerComputed(dep.computed);
394
+ if (this._dirtyLevel >= 2) {
395
+ break;
396
+ }
397
+ }
398
+ }
399
+ resetTracking();
400
+ this._queryings--;
401
+ }
402
+ return this._dirtyLevel >= 2;
403
+ }
404
+ set dirty(v) {
405
+ this._dirtyLevel = v ? 3 : 0;
406
+ }
409
407
  run() {
408
+ this._dirtyLevel = 0;
410
409
  if (!this.active) {
411
410
  return this.fn();
412
411
  }
413
- let parent = activeEffect;
414
412
  let lastShouldTrack = shouldTrack;
415
- while (parent) {
416
- if (parent === this) {
417
- return;
418
- }
419
- parent = parent.parent;
420
- }
413
+ let lastEffect = activeEffect;
421
414
  try {
422
- this.parent = activeEffect;
423
- activeEffect = this;
424
415
  shouldTrack = true;
425
- trackOpBit = 1 << ++effectTrackDepth;
426
- if (effectTrackDepth <= maxMarkerBits) {
427
- initDepMarkers(this);
428
- } else {
429
- cleanupEffect(this);
430
- }
416
+ activeEffect = this;
417
+ this._runnings++;
418
+ preCleanupEffect(this);
431
419
  return this.fn();
432
420
  } finally {
433
- if (effectTrackDepth <= maxMarkerBits) {
434
- finalizeDepMarkers(this);
435
- }
436
- trackOpBit = 1 << --effectTrackDepth;
437
- activeEffect = this.parent;
421
+ postCleanupEffect(this);
422
+ this._runnings--;
423
+ activeEffect = lastEffect;
438
424
  shouldTrack = lastShouldTrack;
439
- this.parent = void 0;
440
- if (this.deferStop) {
441
- this.stop();
442
- }
443
425
  }
444
426
  }
445
427
  stop() {
446
- if (activeEffect === this) {
447
- this.deferStop = true;
448
- } else if (this.active) {
449
- cleanupEffect(this);
450
- if (this.onStop) {
451
- this.onStop();
452
- }
428
+ var _a;
429
+ if (this.active) {
430
+ preCleanupEffect(this);
431
+ postCleanupEffect(this);
432
+ (_a = this.onStop) == null ? void 0 : _a.call(this);
453
433
  this.active = false;
454
434
  }
455
435
  }
456
436
  }
457
- function cleanupEffect(effect2) {
458
- const { deps } = effect2;
459
- if (deps.length) {
460
- for (let i = 0; i < deps.length; i++) {
461
- deps[i].delete(effect2);
437
+ function triggerComputed(computed) {
438
+ return computed.value;
439
+ }
440
+ function preCleanupEffect(effect2) {
441
+ effect2._trackId++;
442
+ effect2._depsLength = 0;
443
+ }
444
+ function postCleanupEffect(effect2) {
445
+ if (effect2.deps && effect2.deps.length > effect2._depsLength) {
446
+ for (let i = effect2._depsLength; i < effect2.deps.length; i++) {
447
+ cleanupDepEffect(effect2.deps[i], effect2);
448
+ }
449
+ effect2.deps.length = effect2._depsLength;
450
+ }
451
+ }
452
+ function cleanupDepEffect(dep, effect2) {
453
+ const trackId = dep.get(effect2);
454
+ if (trackId !== void 0 && effect2._trackId !== trackId) {
455
+ dep.delete(effect2);
456
+ if (dep.size === 0) {
457
+ dep.cleanup();
462
458
  }
463
- deps.length = 0;
464
459
  }
465
460
  }
466
461
  function effect(fn, options) {
467
462
  if (fn.effect instanceof ReactiveEffect) {
468
463
  fn = fn.effect.fn;
469
464
  }
470
- const _effect = new ReactiveEffect(fn);
465
+ const _effect = new ReactiveEffect(fn, NOOP, () => {
466
+ if (_effect.dirty) {
467
+ _effect.run();
468
+ }
469
+ });
471
470
  if (options) {
472
471
  extend(_effect, options);
473
472
  if (options.scope)
@@ -484,6 +483,7 @@ var Vue = (function () {
484
483
  runner.effect.stop();
485
484
  }
486
485
  let shouldTrack = true;
486
+ let pauseScheduleStack = 0;
487
487
  const trackStack = [];
488
488
  function pauseTracking() {
489
489
  trackStack.push(shouldTrack);
@@ -493,6 +493,68 @@ var Vue = (function () {
493
493
  const last = trackStack.pop();
494
494
  shouldTrack = last === void 0 ? true : last;
495
495
  }
496
+ function pauseScheduling() {
497
+ pauseScheduleStack++;
498
+ }
499
+ function resetScheduling() {
500
+ pauseScheduleStack--;
501
+ while (!pauseScheduleStack && queueEffectSchedulers.length) {
502
+ queueEffectSchedulers.shift()();
503
+ }
504
+ }
505
+ function trackEffect(effect2, dep, debuggerEventExtraInfo) {
506
+ var _a;
507
+ if (dep.get(effect2) !== effect2._trackId) {
508
+ dep.set(effect2, effect2._trackId);
509
+ const oldDep = effect2.deps[effect2._depsLength];
510
+ if (oldDep !== dep) {
511
+ if (oldDep) {
512
+ cleanupDepEffect(oldDep, effect2);
513
+ }
514
+ effect2.deps[effect2._depsLength++] = dep;
515
+ } else {
516
+ effect2._depsLength++;
517
+ }
518
+ {
519
+ (_a = effect2.onTrack) == null ? void 0 : _a.call(effect2, extend({ effect: effect2 }, debuggerEventExtraInfo));
520
+ }
521
+ }
522
+ }
523
+ const queueEffectSchedulers = [];
524
+ function triggerEffects(dep, dirtyLevel, debuggerEventExtraInfo) {
525
+ var _a;
526
+ pauseScheduling();
527
+ for (const effect2 of dep.keys()) {
528
+ if (!effect2.allowRecurse && effect2._runnings) {
529
+ continue;
530
+ }
531
+ if (effect2._dirtyLevel < dirtyLevel && (!effect2._runnings || dirtyLevel !== 2)) {
532
+ const lastDirtyLevel = effect2._dirtyLevel;
533
+ effect2._dirtyLevel = dirtyLevel;
534
+ if (lastDirtyLevel === 0 && (!effect2._queryings || dirtyLevel !== 2)) {
535
+ {
536
+ (_a = effect2.onTrigger) == null ? void 0 : _a.call(effect2, extend({ effect: effect2 }, debuggerEventExtraInfo));
537
+ }
538
+ effect2.trigger();
539
+ if (effect2.scheduler) {
540
+ queueEffectSchedulers.push(effect2.scheduler);
541
+ }
542
+ }
543
+ }
544
+ }
545
+ resetScheduling();
546
+ }
547
+
548
+ const createDep = (cleanup, computed) => {
549
+ const dep = /* @__PURE__ */ new Map();
550
+ dep.cleanup = cleanup;
551
+ dep.computed = computed;
552
+ return dep;
553
+ };
554
+
555
+ const targetMap = /* @__PURE__ */ new WeakMap();
556
+ const ITERATE_KEY = Symbol("iterate" );
557
+ const MAP_KEY_ITERATE_KEY = Symbol("Map key iterate" );
496
558
  function track(target, type, key) {
497
559
  if (shouldTrack && activeEffect) {
498
560
  let depsMap = targetMap.get(target);
@@ -501,35 +563,17 @@ var Vue = (function () {
501
563
  }
502
564
  let dep = depsMap.get(key);
503
565
  if (!dep) {
504
- depsMap.set(key, dep = createDep());
505
- }
506
- const eventInfo = { effect: activeEffect, target, type, key } ;
507
- trackEffects(dep, eventInfo);
508
- }
509
- }
510
- function trackEffects(dep, debuggerEventExtraInfo) {
511
- let shouldTrack2 = false;
512
- if (effectTrackDepth <= maxMarkerBits) {
513
- if (!newTracked(dep)) {
514
- dep.n |= trackOpBit;
515
- shouldTrack2 = !wasTracked(dep);
516
- }
517
- } else {
518
- shouldTrack2 = !dep.has(activeEffect);
519
- }
520
- if (shouldTrack2) {
521
- dep.add(activeEffect);
522
- activeEffect.deps.push(dep);
523
- if (activeEffect.onTrack) {
524
- activeEffect.onTrack(
525
- extend(
526
- {
527
- effect: activeEffect
528
- },
529
- debuggerEventExtraInfo
530
- )
531
- );
566
+ depsMap.set(key, dep = createDep(() => depsMap.delete(key)));
532
567
  }
568
+ trackEffect(
569
+ activeEffect,
570
+ dep,
571
+ {
572
+ target,
573
+ type,
574
+ key
575
+ }
576
+ );
533
577
  }
534
578
  }
535
579
  function trigger(target, type, key, newValue, oldValue, oldTarget) {
@@ -577,49 +621,24 @@ var Vue = (function () {
577
621
  break;
578
622
  }
579
623
  }
580
- const eventInfo = { target, type, key, newValue, oldValue, oldTarget } ;
581
- if (deps.length === 1) {
582
- if (deps[0]) {
583
- {
584
- triggerEffects(deps[0], eventInfo);
585
- }
586
- }
587
- } else {
588
- const effects = [];
589
- for (const dep of deps) {
590
- if (dep) {
591
- effects.push(...dep);
592
- }
593
- }
594
- {
595
- triggerEffects(createDep(effects), eventInfo);
596
- }
597
- }
598
- }
599
- function triggerEffects(dep, debuggerEventExtraInfo) {
600
- const effects = isArray(dep) ? dep : [...dep];
601
- for (const effect2 of effects) {
602
- if (effect2.computed) {
603
- triggerEffect(effect2, debuggerEventExtraInfo);
604
- }
605
- }
606
- for (const effect2 of effects) {
607
- if (!effect2.computed) {
608
- triggerEffect(effect2, debuggerEventExtraInfo);
609
- }
610
- }
611
- }
612
- function triggerEffect(effect2, debuggerEventExtraInfo) {
613
- if (effect2 !== activeEffect || effect2.allowRecurse) {
614
- if (effect2.onTrigger) {
615
- effect2.onTrigger(extend({ effect: effect2 }, debuggerEventExtraInfo));
616
- }
617
- if (effect2.scheduler) {
618
- effect2.scheduler();
619
- } else {
620
- effect2.run();
624
+ pauseScheduling();
625
+ for (const dep of deps) {
626
+ if (dep) {
627
+ triggerEffects(
628
+ dep,
629
+ 3,
630
+ {
631
+ target,
632
+ type,
633
+ key,
634
+ newValue,
635
+ oldValue,
636
+ oldTarget
637
+ }
638
+ );
621
639
  }
622
640
  }
641
+ resetScheduling();
623
642
  }
624
643
  function getDepFromReactive(object, key) {
625
644
  var _a;
@@ -650,7 +669,9 @@ var Vue = (function () {
650
669
  ["push", "pop", "shift", "unshift", "splice"].forEach((key) => {
651
670
  instrumentations[key] = function(...args) {
652
671
  pauseTracking();
672
+ pauseScheduling();
653
673
  const res = toRaw(this)[key].apply(this, args);
674
+ resetScheduling();
654
675
  resetTracking();
655
676
  return res;
656
677
  };
@@ -1189,30 +1210,94 @@ var Vue = (function () {
1189
1210
  const toReactive = (value) => isObject(value) ? reactive(value) : value;
1190
1211
  const toReadonly = (value) => isObject(value) ? readonly(value) : value;
1191
1212
 
1213
+ class ComputedRefImpl {
1214
+ constructor(getter, _setter, isReadonly, isSSR) {
1215
+ this._setter = _setter;
1216
+ this.dep = void 0;
1217
+ this.__v_isRef = true;
1218
+ this["__v_isReadonly"] = false;
1219
+ this.effect = new ReactiveEffect(
1220
+ () => getter(this._value),
1221
+ () => triggerRefValue(this, 1)
1222
+ );
1223
+ this.effect.computed = this;
1224
+ this.effect.active = this._cacheable = !isSSR;
1225
+ this["__v_isReadonly"] = isReadonly;
1226
+ }
1227
+ get value() {
1228
+ const self = toRaw(this);
1229
+ trackRefValue(self);
1230
+ if (!self._cacheable || self.effect.dirty) {
1231
+ if (hasChanged(self._value, self._value = self.effect.run())) {
1232
+ triggerRefValue(self, 2);
1233
+ }
1234
+ }
1235
+ return self._value;
1236
+ }
1237
+ set value(newValue) {
1238
+ this._setter(newValue);
1239
+ }
1240
+ // #region polyfill _dirty for backward compatibility third party code for Vue <= 3.3.x
1241
+ get _dirty() {
1242
+ return this.effect.dirty;
1243
+ }
1244
+ set _dirty(v) {
1245
+ this.effect.dirty = v;
1246
+ }
1247
+ // #endregion
1248
+ }
1249
+ function computed$1(getterOrOptions, debugOptions, isSSR = false) {
1250
+ let getter;
1251
+ let setter;
1252
+ const onlyGetter = isFunction(getterOrOptions);
1253
+ if (onlyGetter) {
1254
+ getter = getterOrOptions;
1255
+ setter = () => {
1256
+ console.warn("Write operation failed: computed value is readonly");
1257
+ } ;
1258
+ } else {
1259
+ getter = getterOrOptions.get;
1260
+ setter = getterOrOptions.set;
1261
+ }
1262
+ const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter, isSSR);
1263
+ if (debugOptions && !isSSR) {
1264
+ cRef.effect.onTrack = debugOptions.onTrack;
1265
+ cRef.effect.onTrigger = debugOptions.onTrigger;
1266
+ }
1267
+ return cRef;
1268
+ }
1269
+
1192
1270
  function trackRefValue(ref2) {
1193
1271
  if (shouldTrack && activeEffect) {
1194
1272
  ref2 = toRaw(ref2);
1195
- {
1196
- trackEffects(ref2.dep || (ref2.dep = createDep()), {
1273
+ trackEffect(
1274
+ activeEffect,
1275
+ ref2.dep || (ref2.dep = createDep(
1276
+ () => ref2.dep = void 0,
1277
+ ref2 instanceof ComputedRefImpl ? ref2 : void 0
1278
+ )),
1279
+ {
1197
1280
  target: ref2,
1198
1281
  type: "get",
1199
1282
  key: "value"
1200
- });
1201
- }
1283
+ }
1284
+ );
1202
1285
  }
1203
1286
  }
1204
- function triggerRefValue(ref2, newVal) {
1287
+ function triggerRefValue(ref2, dirtyLevel = 3, newVal) {
1205
1288
  ref2 = toRaw(ref2);
1206
1289
  const dep = ref2.dep;
1207
1290
  if (dep) {
1208
- {
1209
- triggerEffects(dep, {
1291
+ triggerEffects(
1292
+ dep,
1293
+ dirtyLevel,
1294
+ {
1210
1295
  target: ref2,
1211
1296
  type: "set",
1212
1297
  key: "value",
1213
1298
  newValue: newVal
1214
- });
1215
- }
1299
+ }
1300
+ );
1216
1301
  }
1217
1302
  }
1218
1303
  function isRef(r) {
@@ -1248,12 +1333,12 @@ var Vue = (function () {
1248
1333
  if (hasChanged(newVal, this._rawValue)) {
1249
1334
  this._rawValue = newVal;
1250
1335
  this._value = useDirectValue ? newVal : toReactive(newVal);
1251
- triggerRefValue(this, newVal);
1336
+ triggerRefValue(this, 3, newVal);
1252
1337
  }
1253
1338
  }
1254
1339
  }
1255
1340
  function triggerRef(ref2) {
1256
- triggerRefValue(ref2, ref2.value );
1341
+ triggerRefValue(ref2, 3, ref2.value );
1257
1342
  }
1258
1343
  function unref(ref2) {
1259
1344
  return isRef(ref2) ? ref2.value : ref2;
@@ -1351,57 +1436,6 @@ var Vue = (function () {
1351
1436
  return isRef(val) ? val : new ObjectRefImpl(source, key, defaultValue);
1352
1437
  }
1353
1438
 
1354
- class ComputedRefImpl {
1355
- constructor(getter, _setter, isReadonly, isSSR) {
1356
- this._setter = _setter;
1357
- this.dep = void 0;
1358
- this.__v_isRef = true;
1359
- this["__v_isReadonly"] = false;
1360
- this._dirty = true;
1361
- this.effect = new ReactiveEffect(getter, () => {
1362
- if (!this._dirty) {
1363
- this._dirty = true;
1364
- triggerRefValue(this);
1365
- }
1366
- });
1367
- this.effect.computed = this;
1368
- this.effect.active = this._cacheable = !isSSR;
1369
- this["__v_isReadonly"] = isReadonly;
1370
- }
1371
- get value() {
1372
- const self = toRaw(this);
1373
- trackRefValue(self);
1374
- if (self._dirty || !self._cacheable) {
1375
- self._dirty = false;
1376
- self._value = self.effect.run();
1377
- }
1378
- return self._value;
1379
- }
1380
- set value(newValue) {
1381
- this._setter(newValue);
1382
- }
1383
- }
1384
- function computed$1(getterOrOptions, debugOptions, isSSR = false) {
1385
- let getter;
1386
- let setter;
1387
- const onlyGetter = isFunction(getterOrOptions);
1388
- if (onlyGetter) {
1389
- getter = getterOrOptions;
1390
- setter = () => {
1391
- console.warn("Write operation failed: computed value is readonly");
1392
- } ;
1393
- } else {
1394
- getter = getterOrOptions.get;
1395
- setter = getterOrOptions.set;
1396
- }
1397
- const cRef = new ComputedRefImpl(getter, setter, onlyGetter || !setter, isSSR);
1398
- if (debugOptions && !isSSR) {
1399
- cRef.effect.onTrack = debugOptions.onTrack;
1400
- cRef.effect.onTrigger = debugOptions.onTrigger;
1401
- }
1402
- return cRef;
1403
- }
1404
-
1405
1439
  const stack = [];
1406
1440
  function pushWarningContext(vnode) {
1407
1441
  stack.push(vnode);
@@ -1516,7 +1550,7 @@ var Vue = (function () {
1516
1550
  }
1517
1551
  }
1518
1552
 
1519
- const ErrorTypeStrings = {
1553
+ const ErrorTypeStrings$1 = {
1520
1554
  ["sp"]: "serverPrefetch hook",
1521
1555
  ["bc"]: "beforeCreate hook",
1522
1556
  ["c"]: "created hook",
@@ -1577,7 +1611,7 @@ var Vue = (function () {
1577
1611
  if (instance) {
1578
1612
  let cur = instance.parent;
1579
1613
  const exposedInstance = instance.proxy;
1580
- const errorInfo = ErrorTypeStrings[type] ;
1614
+ const errorInfo = ErrorTypeStrings$1[type] ;
1581
1615
  while (cur) {
1582
1616
  const errorCapturedHooks = cur.ec;
1583
1617
  if (errorCapturedHooks) {
@@ -1604,7 +1638,7 @@ var Vue = (function () {
1604
1638
  }
1605
1639
  function logError(err, type, contextVNode, throwInDev = true) {
1606
1640
  {
1607
- const info = ErrorTypeStrings[type];
1641
+ const info = ErrorTypeStrings$1[type];
1608
1642
  if (contextVNode) {
1609
1643
  pushWarningContext(contextVNode);
1610
1644
  }
@@ -1832,6 +1866,7 @@ var Vue = (function () {
1832
1866
  }
1833
1867
  instance.renderCache = [];
1834
1868
  isHmrUpdating = true;
1869
+ instance.effect.dirty = true;
1835
1870
  instance.update();
1836
1871
  isHmrUpdating = false;
1837
1872
  });
@@ -1859,6 +1894,7 @@ var Vue = (function () {
1859
1894
  instance.ceReload(newComp.styles);
1860
1895
  hmrDirtyComponents.delete(oldComp);
1861
1896
  } else if (instance.parent) {
1897
+ instance.parent.effect.dirty = true;
1862
1898
  queueJob(instance.parent.update);
1863
1899
  } else if (instance.appContext.reload) {
1864
1900
  instance.appContext.reload();
@@ -3623,8 +3659,15 @@ If this is a native custom element, make sure to exclude it from component resol
3623
3659
  }
3624
3660
  return doWatch(source, cb, options);
3625
3661
  }
3626
- function doWatch(source, cb, { immediate, deep, flush, onTrack, onTrigger } = EMPTY_OBJ) {
3662
+ function doWatch(source, cb, { immediate, deep, flush, once, onTrack, onTrigger } = EMPTY_OBJ) {
3627
3663
  var _a;
3664
+ if (cb && once) {
3665
+ const _cb = cb;
3666
+ cb = (...args) => {
3667
+ _cb(...args);
3668
+ unwatch();
3669
+ };
3670
+ }
3628
3671
  if (!cb) {
3629
3672
  if (immediate !== void 0) {
3630
3673
  warn(
@@ -3636,6 +3679,11 @@ If this is a native custom element, make sure to exclude it from component resol
3636
3679
  `watch() "deep" option is only respected when using the watch(source, callback, options?) signature.`
3637
3680
  );
3638
3681
  }
3682
+ if (once !== void 0) {
3683
+ warn(
3684
+ `watch() "once" option is only respected when using the watch(source, callback, options?) signature.`
3685
+ );
3686
+ }
3639
3687
  }
3640
3688
  const warnInvalidSource = (s) => {
3641
3689
  warn(
@@ -3714,7 +3762,7 @@ If this is a native custom element, make sure to exclude it from component resol
3714
3762
  };
3715
3763
  let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
3716
3764
  const job = () => {
3717
- if (!effect.active) {
3765
+ if (!effect.active || !effect.dirty) {
3718
3766
  return;
3719
3767
  }
3720
3768
  if (cb) {
@@ -3747,7 +3795,13 @@ If this is a native custom element, make sure to exclude it from component resol
3747
3795
  job.id = instance.uid;
3748
3796
  scheduler = () => queueJob(job);
3749
3797
  }
3750
- const effect = new ReactiveEffect(getter, scheduler);
3798
+ const effect = new ReactiveEffect(getter, NOOP, scheduler);
3799
+ const unwatch = () => {
3800
+ effect.stop();
3801
+ if (instance && instance.scope) {
3802
+ remove(instance.scope.effects, effect);
3803
+ }
3804
+ };
3751
3805
  {
3752
3806
  effect.onTrack = onTrack;
3753
3807
  effect.onTrigger = onTrigger;
@@ -3766,12 +3820,6 @@ If this is a native custom element, make sure to exclude it from component resol
3766
3820
  } else {
3767
3821
  effect.run();
3768
3822
  }
3769
- const unwatch = () => {
3770
- effect.stop();
3771
- if (instance && instance.scope) {
3772
- remove(instance.scope.effects, effect);
3773
- }
3774
- };
3775
3823
  return unwatch;
3776
3824
  }
3777
3825
  function instanceWatch(source, value, options) {
@@ -4004,6 +4052,7 @@ If this is a native custom element, make sure to exclude it from component resol
4004
4052
  leavingHooks.afterLeave = () => {
4005
4053
  state.isLeaving = false;
4006
4054
  if (instance.update.active !== false) {
4055
+ instance.effect.dirty = true;
4007
4056
  instance.update();
4008
4057
  }
4009
4058
  };
@@ -4346,6 +4395,7 @@ If this is a native custom element, make sure to exclude it from component resol
4346
4395
  load().then(() => {
4347
4396
  loaded.value = true;
4348
4397
  if (instance.parent && isKeepAlive(instance.parent.vnode)) {
4398
+ instance.parent.effect.dirty = true;
4349
4399
  queueJob(instance.parent.update);
4350
4400
  }
4351
4401
  }).catch((err) => {
@@ -4643,7 +4693,7 @@ If this is a native custom element, make sure to exclude it from component resol
4643
4693
  }
4644
4694
  return wrappedHook;
4645
4695
  } else {
4646
- const apiName = toHandlerKey(ErrorTypeStrings[type].replace(/ hook$/, ""));
4696
+ const apiName = toHandlerKey(ErrorTypeStrings$1[type].replace(/ hook$/, ""));
4647
4697
  warn(
4648
4698
  `${apiName} is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup().` + (` If you are using async setup(), make sure to register lifecycle hooks before the first await statement.` )
4649
4699
  );
@@ -5306,7 +5356,10 @@ If this is a native custom element, make sure to exclude it from component resol
5306
5356
  $root: (i) => getPublicInstance(i.root),
5307
5357
  $emit: (i) => i.emit,
5308
5358
  $options: (i) => resolveMergedOptions(i) ,
5309
- $forceUpdate: (i) => i.f || (i.f = () => queueJob(i.update)),
5359
+ $forceUpdate: (i) => i.f || (i.f = () => {
5360
+ i.effect.dirty = true;
5361
+ queueJob(i.update);
5362
+ }),
5310
5363
  $nextTick: (i) => i.n || (i.n = nextTick.bind(i.proxy)),
5311
5364
  $watch: (i) => instanceWatch.bind(i)
5312
5365
  })
@@ -6207,7 +6260,7 @@ If this is a native custom element, make sure to exclude it from component resol
6207
6260
  return vm;
6208
6261
  }
6209
6262
  }
6210
- Vue.version = `2.6.14-compat:${"3.3.9"}`;
6263
+ Vue.version = `2.6.14-compat:${"3.4.0-alpha.2"}`;
6211
6264
  Vue.config = singletonApp.config;
6212
6265
  Vue.use = (p, ...options) => {
6213
6266
  if (p && isFunction(p.install)) {
@@ -8630,6 +8683,7 @@ If you want to remount the same app, move your app creation logic into a factory
8630
8683
  } else {
8631
8684
  instance.next = n2;
8632
8685
  invalidateJob(instance.update);
8686
+ instance.effect.dirty = true;
8633
8687
  instance.update();
8634
8688
  }
8635
8689
  } else {
@@ -8823,11 +8877,16 @@ If you want to remount the same app, move your app creation logic into a factory
8823
8877
  };
8824
8878
  const effect = instance.effect = new ReactiveEffect(
8825
8879
  componentUpdateFn,
8880
+ NOOP,
8826
8881
  () => queueJob(update),
8827
8882
  instance.scope
8828
8883
  // track it in component's effect scope
8829
8884
  );
8830
- const update = instance.update = () => effect.run();
8885
+ const update = instance.update = () => {
8886
+ if (effect.dirty) {
8887
+ effect.run();
8888
+ }
8889
+ };
8831
8890
  update.id = instance.uid;
8832
8891
  toggleRecurse(instance, true);
8833
8892
  {
@@ -10794,7 +10853,8 @@ Component that was made reactive: `,
10794
10853
  return true;
10795
10854
  }
10796
10855
 
10797
- const version = "3.3.9";
10856
+ const version = "3.4.0-alpha.2";
10857
+ const ErrorTypeStrings = ErrorTypeStrings$1 ;
10798
10858
  const ssrUtils = null;
10799
10859
  const resolveFilter = resolveFilter$1 ;
10800
10860
  const _compatUtils = {
@@ -12417,6 +12477,7 @@ Component that was made reactive: `,
12417
12477
  BaseTransitionPropsValidators: BaseTransitionPropsValidators,
12418
12478
  Comment: Comment,
12419
12479
  EffectScope: EffectScope,
12480
+ ErrorTypeStrings: ErrorTypeStrings,
12420
12481
  Fragment: Fragment,
12421
12482
  KeepAlive: KeepAlive,
12422
12483
  ReactiveEffect: ReactiveEffect,