@vue/reactivity 3.5.17 → 3.6.0-alpha.2

package/dist/reactivity.esm-browser.js

@@ -1,5 +1,5 @@
 /**
-* @vue/reactivity v3.5.17
+* @vue/reactivity v3.6.0-alpha.2
 * (c) 2018-present Yuxi (Evan) You and Vue contributors
 * @license MIT
 **/
@@ -15,12 +15,6 @@ const EMPTY_OBJ = Object.freeze({}) ;
 const NOOP = () => {
 };
 const extend = Object.assign;
-const remove = (arr, el) => {
-  const i = arr.indexOf(el);
-  if (i > -1) {
-    arr.splice(i, 1);
-  }
-};
 const hasOwnProperty$1 = Object.prototype.hasOwnProperty;
 const hasOwn = (val, key) => hasOwnProperty$1.call(val, key);
 const isArray = Array.isArray;
@@ -61,633 +55,343 @@ function warn(msg, ...args) {
   console.warn(`[Vue warn] ${msg}`, ...args);
 }
 
-let activeEffectScope;
-class EffectScope {
-  constructor(detached = false) {
-    this.detached = detached;
-    /**
-     * @internal
-     */
-    this._active = true;
-    /**
-     * @internal track `on` calls, allow `on` call multiple times
-     */
-    this._on = 0;
-    /**
-     * @internal
-     */
-    this.effects = [];
-    /**
-     * @internal
-     */
-    this.cleanups = [];
-    this._isPaused = false;
-    this.parent = activeEffectScope;
-    if (!detached && activeEffectScope) {
-      this.index = (activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(
-        this
-      ) - 1;
-    }
+var ReactiveFlags$1 = /* @__PURE__ */ ((ReactiveFlags2) => {
+  ReactiveFlags2[ReactiveFlags2["None"] = 0] = "None";
+  ReactiveFlags2[ReactiveFlags2["Mutable"] = 1] = "Mutable";
+  ReactiveFlags2[ReactiveFlags2["Watching"] = 2] = "Watching";
+  ReactiveFlags2[ReactiveFlags2["RecursedCheck"] = 4] = "RecursedCheck";
+  ReactiveFlags2[ReactiveFlags2["Recursed"] = 8] = "Recursed";
+  ReactiveFlags2[ReactiveFlags2["Dirty"] = 16] = "Dirty";
+  ReactiveFlags2[ReactiveFlags2["Pending"] = 32] = "Pending";
+  return ReactiveFlags2;
+})(ReactiveFlags$1 || {});
+const notifyBuffer = [];
+let batchDepth = 0;
+let activeSub = void 0;
+let notifyIndex = 0;
+let notifyBufferLength = 0;
+function setActiveSub(sub) {
+  try {
+    return activeSub;
+  } finally {
+    activeSub = sub;
   }
-  get active() {
-    return this._active;
+}
+function startBatch() {
+  ++batchDepth;
+}
+function endBatch() {
+  if (!--batchDepth && notifyBufferLength) {
+    flush();
   }
-  pause() {
-    if (this._active) {
-      this._isPaused = true;
-      let i, l;
-      if (this.scopes) {
-        for (i = 0, l = this.scopes.length; i < l; i++) {
-          this.scopes[i].pause();
-        }
-      }
-      for (i = 0, l = this.effects.length; i < l; i++) {
-        this.effects[i].pause();
-      }
-    }
+}
+function link(dep, sub) {
+  const prevDep = sub.depsTail;
+  if (prevDep !== void 0 && prevDep.dep === dep) {
+    return;
   }
-  /**
-   * Resumes the effect scope, including all child scopes and effects.
-   */
-  resume() {
-    if (this._active) {
-      if (this._isPaused) {
-        this._isPaused = false;
-        let i, l;
-        if (this.scopes) {
-          for (i = 0, l = this.scopes.length; i < l; i++) {
-            this.scopes[i].resume();
-          }
-        }
-        for (i = 0, l = this.effects.length; i < l; i++) {
-          this.effects[i].resume();
-        }
-      }
+  let nextDep = void 0;
+  const recursedCheck = sub.flags & 4 /* RecursedCheck */;
+  if (recursedCheck) {
+    nextDep = prevDep !== void 0 ? prevDep.nextDep : sub.deps;
+    if (nextDep !== void 0 && nextDep.dep === dep) {
+      sub.depsTail = nextDep;
+      return;
     }
   }
-  run(fn) {
-    if (this._active) {
-      const currentEffectScope = activeEffectScope;
-      try {
-        activeEffectScope = this;
-        return fn();
-      } finally {
-        activeEffectScope = currentEffectScope;
-      }
-    } else {
-      warn(`cannot run an inactive effect scope.`);
-    }
+  const prevSub = dep.subsTail;
+  const newLink = sub.depsTail = dep.subsTail = {
+    dep,
+    sub,
+    prevDep,
+    nextDep,
+    prevSub,
+    nextSub: void 0
+  };
+  if (nextDep !== void 0) {
+    nextDep.prevDep = newLink;
   }
-  /**
-   * This should only be called on non-detached scopes
-   * @internal
-   */
-  on() {
-    if (++this._on === 1) {
-      this.prevScope = activeEffectScope;
-      activeEffectScope = this;
-    }
+  if (prevDep !== void 0) {
+    prevDep.nextDep = newLink;
+  } else {
+    sub.deps = newLink;
   }
-  /**
-   * This should only be called on non-detached scopes
-   * @internal
-   */
-  off() {
-    if (this._on > 0 && --this._on === 0) {
-      activeEffectScope = this.prevScope;
-      this.prevScope = void 0;
-    }
-  }
-  stop(fromParent) {
-    if (this._active) {
-      this._active = false;
-      let i, l;
-      for (i = 0, l = this.effects.length; i < l; i++) {
-        this.effects[i].stop();
-      }
-      this.effects.length = 0;
-      for (i = 0, l = this.cleanups.length; i < l; i++) {
-        this.cleanups[i]();
-      }
-      this.cleanups.length = 0;
-      if (this.scopes) {
-        for (i = 0, l = this.scopes.length; i < l; i++) {
-          this.scopes[i].stop(true);
-        }
-        this.scopes.length = 0;
-      }
-      if (!this.detached && this.parent && !fromParent) {
-        const last = this.parent.scopes.pop();
-        if (last && last !== this) {
-          this.parent.scopes[this.index] = last;
-          last.index = this.index;
-        }
-      }
-      this.parent = void 0;
-    }
+  if (prevSub !== void 0) {
+    prevSub.nextSub = newLink;
+  } else {
+    dep.subs = newLink;
   }
 }
-function effectScope(detached) {
-  return new EffectScope(detached);
-}
-function getCurrentScope() {
-  return activeEffectScope;
-}
-function onScopeDispose(fn, failSilently = false) {
-  if (activeEffectScope) {
-    activeEffectScope.cleanups.push(fn);
-  } else if (!failSilently) {
-    warn(
-      `onScopeDispose() is called when there is no active effect scope to be associated with.`
-    );
+function unlink(link2, sub = link2.sub) {
+  const dep = link2.dep;
+  const prevDep = link2.prevDep;
+  const nextDep = link2.nextDep;
+  const nextSub = link2.nextSub;
+  const prevSub = link2.prevSub;
+  if (nextDep !== void 0) {
+    nextDep.prevDep = prevDep;
+  } else {
+    sub.depsTail = prevDep;
   }
-}
-
-let activeSub;
-const EffectFlags = {
-  "ACTIVE": 1,
-  "1": "ACTIVE",
-  "RUNNING": 2,
-  "2": "RUNNING",
-  "TRACKING": 4,
-  "4": "TRACKING",
-  "NOTIFIED": 8,
-  "8": "NOTIFIED",
-  "DIRTY": 16,
-  "16": "DIRTY",
-  "ALLOW_RECURSE": 32,
-  "32": "ALLOW_RECURSE",
-  "PAUSED": 64,
-  "64": "PAUSED",
-  "EVALUATED": 128,
-  "128": "EVALUATED"
-};
-const pausedQueueEffects = /* @__PURE__ */ new WeakSet();
-class ReactiveEffect {
-  constructor(fn) {
-    this.fn = fn;
-    /**
-     * @internal
-     */
-    this.deps = void 0;
-    /**
-     * @internal
-     */
-    this.depsTail = void 0;
-    /**
-     * @internal
-     */
-    this.flags = 1 | 4;
-    /**
-     * @internal
-     */
-    this.next = void 0;
-    /**
-     * @internal
-     */
-    this.cleanup = void 0;
-    this.scheduler = void 0;
-    if (activeEffectScope && activeEffectScope.active) {
-      activeEffectScope.effects.push(this);
-    }
+  if (prevDep !== void 0) {
+    prevDep.nextDep = nextDep;
+  } else {
+    sub.deps = nextDep;
   }
-  pause() {
-    this.flags |= 64;
+  if (nextSub !== void 0) {
+    nextSub.prevSub = prevSub;
+  } else {
+    dep.subsTail = prevSub;
   }
-  resume() {
-    if (this.flags & 64) {
-      this.flags &= -65;
-      if (pausedQueueEffects.has(this)) {
-        pausedQueueEffects.delete(this);
-        this.trigger();
+  if (prevSub !== void 0) {
+    prevSub.nextSub = nextSub;
+  } else if ((dep.subs = nextSub) === void 0) {
+    let toRemove = dep.deps;
+    if (toRemove !== void 0) {
+      do {
+        toRemove = unlink(toRemove, dep);
+      } while (toRemove !== void 0);
+      dep.flags |= 16 /* Dirty */;
+    }
+  }
+  return nextDep;
+}
+function propagate(link2) {
+  let next = link2.nextSub;
+  let stack;
+  top: do {
+    const sub = link2.sub;
+    let flags = sub.flags;
+    if (flags & (1 /* Mutable */ | 2 /* Watching */)) {
+      if (!(flags & (4 /* RecursedCheck */ | 8 /* Recursed */ | 16 /* Dirty */ | 32 /* Pending */))) {
+        sub.flags = flags | 32 /* Pending */;
+      } else if (!(flags & (4 /* RecursedCheck */ | 8 /* Recursed */))) {
+        flags = 0 /* None */;
+      } else if (!(flags & 4 /* RecursedCheck */)) {
+        sub.flags = flags & -9 /* Recursed */ | 32 /* Pending */;
+      } else if (!(flags & (16 /* Dirty */ | 32 /* Pending */)) && isValidLink(link2, sub)) {
+        sub.flags = flags | 8 /* Recursed */ | 32 /* Pending */;
+        flags &= 1 /* Mutable */;
+      } else {
+        flags = 0 /* None */;
       }
-    }
-  }
-  /**
-   * @internal
-   */
-  notify() {
-    if (this.flags & 2 && !(this.flags & 32)) {
-      return;
-    }
-    if (!(this.flags & 8)) {
-      batch(this);
-    }
-  }
-  run() {
-    if (!(this.flags & 1)) {
-      return this.fn();
-    }
-    this.flags |= 2;
-    cleanupEffect(this);
-    prepareDeps(this);
-    const prevEffect = activeSub;
-    const prevShouldTrack = shouldTrack;
-    activeSub = this;
-    shouldTrack = true;
-    try {
-      return this.fn();
-    } finally {
-      if (activeSub !== this) {
-        warn(
-          "Active effect was not restored correctly - this is likely a Vue internal bug."
-        );
+      if (flags & 2 /* Watching */) {
+        notifyBuffer[notifyBufferLength++] = sub;
       }
-      cleanupDeps(this);
-      activeSub = prevEffect;
-      shouldTrack = prevShouldTrack;
-      this.flags &= -3;
-    }
-  }
-  stop() {
-    if (this.flags & 1) {
-      for (let link = this.deps; link; link = link.nextDep) {
-        removeSub(link);
+      if (flags & 1 /* Mutable */) {
+        const subSubs = sub.subs;
+        if (subSubs !== void 0) {
+          link2 = subSubs;
+          if (subSubs.nextSub !== void 0) {
+            stack = { value: next, prev: stack };
+            next = link2.nextSub;
+          }
+          continue;
+        }
       }
-      this.deps = this.depsTail = void 0;
-      cleanupEffect(this);
-      this.onStop && this.onStop();
-      this.flags &= -2;
     }
-  }
-  trigger() {
-    if (this.flags & 64) {
-      pausedQueueEffects.add(this);
-    } else if (this.scheduler) {
-      this.scheduler();
-    } else {
-      this.runIfDirty();
+    if ((link2 = next) !== void 0) {
+      next = link2.nextSub;
+      continue;
     }
-  }
-  /**
-   * @internal
-   */
-  runIfDirty() {
-    if (isDirty(this)) {
-      this.run();
+    while (stack !== void 0) {
+      link2 = stack.value;
+      stack = stack.prev;
+      if (link2 !== void 0) {
+        next = link2.nextSub;
+        continue top;
+      }
     }
-  }
-  get dirty() {
-    return isDirty(this);
-  }
+    break;
+  } while (true);
 }
-let batchDepth = 0;
-let batchedSub;
-let batchedComputed;
-function batch(sub, isComputed = false) {
-  sub.flags |= 8;
-  if (isComputed) {
-    sub.next = batchedComputed;
-    batchedComputed = sub;
-    return;
-  }
-  sub.next = batchedSub;
-  batchedSub = sub;
+function startTracking(sub) {
+  sub.depsTail = void 0;
+  sub.flags = sub.flags & -57 | 4 /* RecursedCheck */;
+  return setActiveSub(sub);
 }
-function startBatch() {
-  batchDepth++;
-}
-function endBatch() {
-  if (--batchDepth > 0) {
-    return;
+function endTracking(sub, prevSub) {
+  if (activeSub !== sub) {
+    warn(
+      "Active effect was not restored correctly - this is likely a Vue internal bug."
+    );
   }
-  if (batchedComputed) {
-    let e = batchedComputed;
-    batchedComputed = void 0;
-    while (e) {
-      const next = e.next;
-      e.next = void 0;
-      e.flags &= -9;
-      e = next;
-    }
-  }
-  let error;
-  while (batchedSub) {
-    let e = batchedSub;
-    batchedSub = void 0;
-    while (e) {
-      const next = e.next;
-      e.next = void 0;
-      e.flags &= -9;
-      if (e.flags & 1) {
-        try {
-          ;
-          e.trigger();
-        } catch (err) {
-          if (!error) error = err;
+  activeSub = prevSub;
+  const depsTail = sub.depsTail;
+  let toRemove = depsTail !== void 0 ? depsTail.nextDep : sub.deps;
+  while (toRemove !== void 0) {
+    toRemove = unlink(toRemove, sub);
+  }
+  sub.flags &= -5 /* RecursedCheck */;
+}
+function flush() {
+  while (notifyIndex < notifyBufferLength) {
+    const effect = notifyBuffer[notifyIndex];
+    notifyBuffer[notifyIndex++] = void 0;
+    effect.notify();
+  }
+  notifyIndex = 0;
+  notifyBufferLength = 0;
+}
+function checkDirty(link2, sub) {
+  let stack;
+  let checkDepth = 0;
+  top: do {
+    const dep = link2.dep;
+    const depFlags = dep.flags;
+    let dirty = false;
+    if (sub.flags & 16 /* Dirty */) {
+      dirty = true;
+    } else if ((depFlags & (1 /* Mutable */ | 16 /* Dirty */)) === (1 /* Mutable */ | 16 /* Dirty */)) {
+      if (dep.update()) {
+        const subs = dep.subs;
+        if (subs.nextSub !== void 0) {
+          shallowPropagate(subs);
         }
+        dirty = true;
       }
-      e = next;
-    }
-  }
-  if (error) throw error;
-}
-function prepareDeps(sub) {
-  for (let link = sub.deps; link; link = link.nextDep) {
-    link.version = -1;
-    link.prevActiveLink = link.dep.activeLink;
-    link.dep.activeLink = link;
+    } else if ((depFlags & (1 /* Mutable */ | 32 /* Pending */)) === (1 /* Mutable */ | 32 /* Pending */)) {
+      if (link2.nextSub !== void 0 || link2.prevSub !== void 0) {
+        stack = { value: link2, prev: stack };
+      }
+      link2 = dep.deps;
+      sub = dep;
+      ++checkDepth;
+      continue;
+    }
+    if (!dirty && link2.nextDep !== void 0) {
+      link2 = link2.nextDep;
+      continue;
+    }
+    while (checkDepth) {
+      --checkDepth;
+      const firstSub = sub.subs;
+      const hasMultipleSubs = firstSub.nextSub !== void 0;
+      if (hasMultipleSubs) {
+        link2 = stack.value;
+        stack = stack.prev;
+      } else {
+        link2 = firstSub;
+      }
+      if (dirty) {
+        if (sub.update()) {
+          if (hasMultipleSubs) {
+            shallowPropagate(firstSub);
+          }
+          sub = link2.sub;
+          continue;
+        }
+      } else {
+        sub.flags &= -33 /* Pending */;
+      }
+      sub = link2.sub;
+      if (link2.nextDep !== void 0) {
+        link2 = link2.nextDep;
+        continue top;
+      }
+      dirty = false;
+    }
+    return dirty;
+  } while (true);
+}
+function shallowPropagate(link2) {
+  do {
+    const sub = link2.sub;
+    const nextSub = link2.nextSub;
+    const subFlags = sub.flags;
+    if ((subFlags & (32 /* Pending */ | 16 /* Dirty */)) === 32 /* Pending */) {
+      sub.flags = subFlags | 16 /* Dirty */;
+    }
+    link2 = nextSub;
+  } while (link2 !== void 0);
+}
+function isValidLink(checkLink, sub) {
+  const depsTail = sub.depsTail;
+  if (depsTail !== void 0) {
+    let link2 = sub.deps;
+    do {
+      if (link2 === checkLink) {
+        return true;
+      }
+      if (link2 === depsTail) {
+        break;
+      }
+      link2 = link2.nextDep;
+    } while (link2 !== void 0);
   }
+  return false;
 }
-function cleanupDeps(sub) {
-  let head;
-  let tail = sub.depsTail;
-  let link = tail;
-  while (link) {
-    const prev = link.prevDep;
-    if (link.version === -1) {
-      if (link === tail) tail = prev;
-      removeSub(link);
-      removeDep(link);
-    } else {
-      head = link;
-    }
-    link.dep.activeLink = link.prevActiveLink;
-    link.prevActiveLink = void 0;
-    link = prev;
+
+const triggerEventInfos = [];
+function onTrack(sub, debugInfo) {
+  if (sub.onTrack) {
+    sub.onTrack(
+      extend(
+        {
+          effect: sub
+        },
+        debugInfo
+      )
+    );
   }
-  sub.deps = head;
-  sub.depsTail = tail;
 }
-function isDirty(sub) {
-  for (let link = sub.deps; link; link = link.nextDep) {
-    if (link.dep.version !== link.version || link.dep.computed && (refreshComputed(link.dep.computed) || link.dep.version !== link.version)) {
-      return true;
-    }
-  }
-  if (sub._dirty) {
-    return true;
+function onTrigger(sub) {
+  if (sub.onTrigger) {
+    const debugInfo = triggerEventInfos[triggerEventInfos.length - 1];
+    sub.onTrigger(
+      extend(
+        {
+          effect: sub
+        },
+        debugInfo
+      )
+    );
   }
-  return false;
 }
-function refreshComputed(computed) {
-  if (computed.flags & 4 && !(computed.flags & 16)) {
-    return;
-  }
-  computed.flags &= -17;
-  if (computed.globalVersion === globalVersion) {
-    return;
-  }
-  computed.globalVersion = globalVersion;
-  if (!computed.isSSR && computed.flags & 128 && (!computed.deps && !computed._dirty || !isDirty(computed))) {
-    return;
-  }
-  computed.flags |= 2;
-  const dep = computed.dep;
-  const prevSub = activeSub;
-  const prevShouldTrack = shouldTrack;
-  activeSub = computed;
-  shouldTrack = true;
-  try {
-    prepareDeps(computed);
-    const value = computed.fn(computed._value);
-    if (dep.version === 0 || hasChanged(value, computed._value)) {
-      computed.flags |= 128;
-      computed._value = value;
-      dep.version++;
+function setupOnTrigger(target) {
+  Object.defineProperty(target.prototype, "onTrigger", {
+    get() {
+      return this._onTrigger;
+    },
+    set(val) {
+      if (val && !this._onTrigger) setupFlagsHandler(this);
+      this._onTrigger = val;
     }
-  } catch (err) {
-    dep.version++;
-    throw err;
-  } finally {
-    activeSub = prevSub;
-    shouldTrack = prevShouldTrack;
-    cleanupDeps(computed);
-    computed.flags &= -3;
-  }
+  });
 }
-function removeSub(link, soft = false) {
-  const { dep, prevSub, nextSub } = link;
-  if (prevSub) {
-    prevSub.nextSub = nextSub;
-    link.prevSub = void 0;
-  }
-  if (nextSub) {
-    nextSub.prevSub = prevSub;
-    link.nextSub = void 0;
-  }
-  if (dep.subsHead === link) {
-    dep.subsHead = nextSub;
-  }
-  if (dep.subs === link) {
-    dep.subs = prevSub;
-    if (!prevSub && dep.computed) {
-      dep.computed.flags &= -5;
-      for (let l = dep.computed.deps; l; l = l.nextDep) {
-        removeSub(l, true);
+function setupFlagsHandler(target) {
+  target._flags = target.flags;
+  Object.defineProperty(target, "flags", {
+    get() {
+      return target._flags;
+    },
+    set(value) {
+      if (!(target._flags & (ReactiveFlags$1.Dirty | ReactiveFlags$1.Pending)) && !!(value & (ReactiveFlags$1.Dirty | ReactiveFlags$1.Pending))) {
+        onTrigger(this);
       }
+      target._flags = value;
     }
-  }
-  if (!soft && !--dep.sc && dep.map) {
-    dep.map.delete(dep.key);
-  }
-}
-function removeDep(link) {
-  const { prevDep, nextDep } = link;
-  if (prevDep) {
-    prevDep.nextDep = nextDep;
-    link.prevDep = void 0;
-  }
-  if (nextDep) {
-    nextDep.prevDep = prevDep;
-    link.nextDep = void 0;
-  }
-}
-function effect(fn, options) {
-  if (fn.effect instanceof ReactiveEffect) {
-    fn = fn.effect.fn;
-  }
-  const e = new ReactiveEffect(fn);
-  if (options) {
-    extend(e, options);
-  }
-  try {
-    e.run();
-  } catch (err) {
-    e.stop();
-    throw err;
-  }
-  const runner = e.run.bind(e);
-  runner.effect = e;
-  return runner;
-}
-function stop(runner) {
-  runner.effect.stop();
-}
-let shouldTrack = true;
-const trackStack = [];
-function pauseTracking() {
-  trackStack.push(shouldTrack);
-  shouldTrack = false;
-}
-function enableTracking() {
-  trackStack.push(shouldTrack);
-  shouldTrack = true;
-}
-function resetTracking() {
-  const last = trackStack.pop();
-  shouldTrack = last === void 0 ? true : last;
-}
-function onEffectCleanup(fn, failSilently = false) {
-  if (activeSub instanceof ReactiveEffect) {
-    activeSub.cleanup = fn;
-  } else if (!failSilently) {
-    warn(
-      `onEffectCleanup() was called when there was no active effect to associate with.`
-    );
-  }
-}
-function cleanupEffect(e) {
-  const { cleanup } = e;
-  e.cleanup = void 0;
-  if (cleanup) {
-    const prevSub = activeSub;
-    activeSub = void 0;
-    try {
-      cleanup();
-    } finally {
-      activeSub = prevSub;
-    }
-  }
+  });
 }
 
-let globalVersion = 0;
-class Link {
-  constructor(sub, dep) {
-    this.sub = sub;
-    this.dep = dep;
-    this.version = dep.version;
-    this.nextDep = this.prevDep = this.nextSub = this.prevSub = this.prevActiveLink = void 0;
-  }
-}
 class Dep {
-  // TODO isolatedDeclarations "__v_skip"
-  constructor(computed) {
-    this.computed = computed;
-    this.version = 0;
-    /**
-     * Link between this dep and the current active effect
-     */
-    this.activeLink = void 0;
-    /**
-     * Doubly linked list representing the subscribing effects (tail)
-     */
-    this.subs = void 0;
-    /**
-     * For object property deps cleanup
-     */
-    this.map = void 0;
-    this.key = void 0;
-    /**
-     * Subscriber counter
-     */
-    this.sc = 0;
-    /**
-     * @internal
-     */
-    this.__v_skip = true;
-    {
-      this.subsHead = void 0;
-    }
+  constructor(map, key) {
+    this.map = map;
+    this.key = key;
+    this._subs = void 0;
+    this.subsTail = void 0;
+    this.flags = ReactiveFlags$1.None;
   }
-  track(debugInfo) {
-    if (!activeSub || !shouldTrack || activeSub === this.computed) {
-      return;
-    }
-    let link = this.activeLink;
-    if (link === void 0 || link.sub !== activeSub) {
-      link = this.activeLink = new Link(activeSub, this);
-      if (!activeSub.deps) {
-        activeSub.deps = activeSub.depsTail = link;
-      } else {
-        link.prevDep = activeSub.depsTail;
-        activeSub.depsTail.nextDep = link;
-        activeSub.depsTail = link;
-      }
-      addSub(link);
-    } else if (link.version === -1) {
-      link.version = this.version;
-      if (link.nextDep) {
-        const next = link.nextDep;
-        next.prevDep = link.prevDep;
-        if (link.prevDep) {
-          link.prevDep.nextDep = next;
-        }
-        link.prevDep = activeSub.depsTail;
-        link.nextDep = void 0;
-        activeSub.depsTail.nextDep = link;
-        activeSub.depsTail = link;
-        if (activeSub.deps === link) {
-          activeSub.deps = next;
-        }
-      }
-    }
-    if (activeSub.onTrack) {
-      activeSub.onTrack(
-        extend(
-          {
-            effect: activeSub
-          },
-          debugInfo
-        )
-      );
-    }
-    return link;
+  get subs() {
+    return this._subs;
   }
-  trigger(debugInfo) {
-    this.version++;
-    globalVersion++;
-    this.notify(debugInfo);
-  }
-  notify(debugInfo) {
-    startBatch();
-    try {
-      if (true) {
-        for (let head = this.subsHead; head; head = head.nextSub) {
-          if (head.sub.onTrigger && !(head.sub.flags & 8)) {
-            head.sub.onTrigger(
-              extend(
-                {
-                  effect: head.sub
-                },
-                debugInfo
-              )
-            );
-          }
-        }
-      }
-      for (let link = this.subs; link; link = link.prevSub) {
-        if (link.sub.notify()) {
-          ;
-          link.sub.dep.notify();
-        }
-      }
-    } finally {
-      endBatch();
+  set subs(value) {
+    this._subs = value;
+    if (value === void 0) {
+      this.map.delete(this.key);
     }
   }
 }
-function addSub(link) {
-  link.dep.sc++;
-  if (link.sub.flags & 4) {
-    const computed = link.dep.computed;
-    if (computed && !link.dep.subs) {
-      computed.flags |= 4 | 16;
-      for (let l = computed.deps; l; l = l.nextDep) {
-        addSub(l);
-      }
-    }
-    const currentTail = link.dep.subs;
-    if (currentTail !== link) {
-      link.prevSub = currentTail;
-      if (currentTail) currentTail.nextSub = link;
-    }
-    if (link.dep.subsHead === void 0) {
-      link.dep.subsHead = link;
-    }
-    link.dep.subs = link;
-  }
-}
 const targetMap = /* @__PURE__ */ new WeakMap();
 const ITERATE_KEY = Symbol(
   "Object iterate" 
@@ -699,36 +403,34 @@ const ARRAY_ITERATE_KEY = Symbol(
   "Array iterate" 
 );
 function track(target, type, key) {
-  if (shouldTrack && activeSub) {
+  if (activeSub !== void 0) {
     let depsMap = targetMap.get(target);
     if (!depsMap) {
       targetMap.set(target, depsMap = /* @__PURE__ */ new Map());
     }
     let dep = depsMap.get(key);
     if (!dep) {
-      depsMap.set(key, dep = new Dep());
-      dep.map = depsMap;
-      dep.key = key;
+      depsMap.set(key, dep = new Dep(depsMap, key));
     }
     {
-      dep.track({
+      onTrack(activeSub, {
         target,
         type,
         key
       });
     }
+    link(dep, activeSub);
   }
 }
 function trigger(target, type, key, newValue, oldValue, oldTarget) {
   const depsMap = targetMap.get(target);
   if (!depsMap) {
-    globalVersion++;
     return;
   }
   const run = (dep) => {
-    if (dep) {
+    if (dep !== void 0 && dep.subs !== void 0) {
       {
-        dep.trigger({
+        triggerEventInfos.push({
           target,
           type,
           key,
@@ -737,6 +439,11 @@ function trigger(target, type, key, newValue, oldValue, oldTarget) {
           oldTarget
         });
       }
+      propagate(dep.subs);
+      shallowPropagate(dep.subs);
+      {
+        triggerEventInfos.pop();
+      }
     }
   };
   startBatch();
@@ -961,11 +668,11 @@ function searchProxy(self, method, args) {
   return res;
 }
 function noTracking(self, method, args = []) {
-  pauseTracking();
   startBatch();
+  const prevSub = setActiveSub();
   const res = toRaw(self)[method].apply(self, args);
+  setActiveSub(prevSub);
   endBatch();
-  resetTracking();
   return res;
 }
 
@@ -1011,14 +718,18 @@ class BaseReactiveHandler {
         return hasOwnProperty;
       }
     }
+    const wasRef = isRef(target);
     const res = Reflect.get(
       target,
       key,
       // if this is a proxy wrapping a ref, return methods using the raw ref
       // as receiver so that we don't have to call `toRaw` on the ref in all
       // its class methods
-      isRef(target) ? target : receiver
+      wasRef ? target : receiver
     );
+    if (wasRef && key !== "value") {
+      return res;
+    }
     if (isSymbol(key) ? builtInSymbols.has(key) : isNonTrackableKeys(key)) {
       return res;
     }
@@ -1470,33 +1181,47 @@ function isRef(r) {
   return r ? r["__v_isRef"] === true : false;
 }
 function ref(value) {
-  return createRef(value, false);
+  return createRef(value, toReactive);
 }
 function shallowRef(value) {
-  return createRef(value, true);
+  return createRef(value);
 }
-function createRef(rawValue, shallow) {
+function createRef(rawValue, wrap) {
   if (isRef(rawValue)) {
     return rawValue;
   }
-  return new RefImpl(rawValue, shallow);
+  return new RefImpl(rawValue, wrap);
 }
 class RefImpl {
-  constructor(value, isShallow2) {
-    this.dep = new Dep();
-    this["__v_isRef"] = true;
-    this["__v_isShallow"] = false;
-    this._rawValue = isShallow2 ? value : toRaw(value);
-    this._value = isShallow2 ? value : toReactive(value);
-    this["__v_isShallow"] = isShallow2;
+  // TODO isolatedDeclarations "__v_isShallow"
+  constructor(value, wrap) {
+    this.subs = void 0;
+    this.subsTail = void 0;
+    this.flags = ReactiveFlags$1.Mutable;
+    /**
+     * @internal
+     */
+    this.__v_isRef = true;
+    // TODO isolatedDeclarations "__v_isRef"
+    /**
+     * @internal
+     */
+    this.__v_isShallow = false;
+    this._oldValue = this._rawValue = wrap ? toRaw(value) : value;
+    this._value = wrap ? wrap(value) : value;
+    this._wrap = wrap;
+    this["__v_isShallow"] = !wrap;
+  }
+  get dep() {
+    return this;
   }
   get value() {
-    {
-      this.dep.track({
-        target: this,
-        type: "get",
-        key: "value"
-      });
+    trackRef(this);
+    if (this.flags & ReactiveFlags$1.Dirty && this.update()) {
+      const subs = this.subs;
+      if (subs !== void 0) {
+        shallowPropagate(subs);
+      }
     }
     return this._value;
   }
@@ -1505,191 +1230,539 @@ class RefImpl {
     const useDirectValue = this["__v_isShallow"] || isShallow(newValue) || isReadonly(newValue);
     newValue = useDirectValue ? newValue : toRaw(newValue);
     if (hasChanged(newValue, oldValue)) {
+      this.flags |= ReactiveFlags$1.Dirty;
       this._rawValue = newValue;
-      this._value = useDirectValue ? newValue : toReactive(newValue);
-      {
-        this.dep.trigger({
-          target: this,
-          type: "set",
-          key: "value",
-          newValue,
-          oldValue
-        });
+      this._value = !useDirectValue && this._wrap ? this._wrap(newValue) : newValue;
+      const subs = this.subs;
+      if (subs !== void 0) {
+        {
+          triggerEventInfos.push({
+            target: this,
+            type: "set",
+            key: "value",
+            newValue,
+            oldValue
+          });
+        }
+        propagate(subs);
+        if (!batchDepth) {
+          flush();
+        }
+        {
+          triggerEventInfos.pop();
+        }
+      }
+    }
+  }
+  update() {
+    this.flags &= ~ReactiveFlags$1.Dirty;
+    return hasChanged(this._oldValue, this._oldValue = this._rawValue);
+  }
+}
+function triggerRef(ref2) {
+  const dep = ref2.dep;
+  if (dep !== void 0 && dep.subs !== void 0) {
+    propagate(dep.subs);
+    shallowPropagate(dep.subs);
+    if (!batchDepth) {
+      flush();
+    }
+  }
+}
+function trackRef(dep) {
+  if (activeSub !== void 0) {
+    {
+      onTrack(activeSub, {
+        target: dep,
+        type: "get",
+        key: "value"
+      });
+    }
+    link(dep, activeSub);
+  }
+}
+function unref(ref2) {
+  return isRef(ref2) ? ref2.value : ref2;
+}
+function toValue(source) {
+  return isFunction(source) ? source() : unref(source);
+}
+const shallowUnwrapHandlers = {
+  get: (target, key, receiver) => key === "__v_raw" ? target : unref(Reflect.get(target, key, receiver)),
+  set: (target, key, value, receiver) => {
+    const oldValue = target[key];
+    if (isRef(oldValue) && !isRef(value)) {
+      oldValue.value = value;
+      return true;
+    } else {
+      return Reflect.set(target, key, value, receiver);
+    }
+  }
+};
+function proxyRefs(objectWithRefs) {
+  return isReactive(objectWithRefs) ? objectWithRefs : new Proxy(objectWithRefs, shallowUnwrapHandlers);
+}
+class CustomRefImpl {
+  constructor(factory) {
+    this.subs = void 0;
+    this.subsTail = void 0;
+    this.flags = ReactiveFlags$1.None;
+    this["__v_isRef"] = true;
+    this._value = void 0;
+    const { get, set } = factory(
+      () => trackRef(this),
+      () => triggerRef(this)
+    );
+    this._get = get;
+    this._set = set;
+  }
+  get dep() {
+    return this;
+  }
+  get value() {
+    return this._value = this._get();
+  }
+  set value(newVal) {
+    this._set(newVal);
+  }
+}
+function customRef(factory) {
+  return new CustomRefImpl(factory);
+}
+function toRefs(object) {
+  const ret = isArray(object) ? new Array(object.length) : {};
+  for (const key in object) {
+    ret[key] = propertyToRef(object, key);
+  }
+  return ret;
+}
+class ObjectRefImpl {
+  constructor(_object, _key, _defaultValue) {
+    this._object = _object;
+    this._key = _key;
+    this._defaultValue = _defaultValue;
+    this["__v_isRef"] = true;
+    this._value = void 0;
+  }
+  get value() {
+    const val = this._object[this._key];
+    return this._value = val === void 0 ? this._defaultValue : val;
+  }
+  set value(newVal) {
+    this._object[this._key] = newVal;
+  }
+  get dep() {
+    return getDepFromReactive(toRaw(this._object), this._key);
+  }
+}
+class GetterRefImpl {
+  constructor(_getter) {
+    this._getter = _getter;
+    this["__v_isRef"] = true;
+    this["__v_isReadonly"] = true;
+    this._value = void 0;
+  }
+  get value() {
+    return this._value = this._getter();
+  }
+}
+function toRef(source, key, defaultValue) {
+  if (isRef(source)) {
+    return source;
+  } else if (isFunction(source)) {
+    return new GetterRefImpl(source);
+  } else if (isObject(source) && arguments.length > 1) {
+    return propertyToRef(source, key, defaultValue);
+  } else {
+    return ref(source);
+  }
+}
+function propertyToRef(source, key, defaultValue) {
+  const val = source[key];
+  return isRef(val) ? val : new ObjectRefImpl(source, key, defaultValue);
+}
+
+const EffectFlags = {
+  "ALLOW_RECURSE": 128,
+  "128": "ALLOW_RECURSE",
+  "PAUSED": 256,
+  "256": "PAUSED",
+  "STOP": 1024,
+  "1024": "STOP"
+};
+class ReactiveEffect {
+  constructor(fn) {
+    this.deps = void 0;
+    this.depsTail = void 0;
+    this.subs = void 0;
+    this.subsTail = void 0;
+    this.flags = ReactiveFlags$1.Watching | ReactiveFlags$1.Dirty;
+    /**
+     * @internal
+     */
+    this.cleanups = [];
+    /**
+     * @internal
+     */
+    this.cleanupsLength = 0;
+    if (fn !== void 0) {
+      this.fn = fn;
+    }
+    if (activeEffectScope) {
+      link(this, activeEffectScope);
+    }
+  }
+  // @ts-expect-error
+  fn() {
+  }
+  get active() {
+    return !(this.flags & 1024);
+  }
+  pause() {
+    this.flags |= 256;
+  }
+  resume() {
+    const flags = this.flags &= -257;
+    if (flags & (ReactiveFlags$1.Dirty | ReactiveFlags$1.Pending)) {
+      this.notify();
+    }
+  }
+  notify() {
+    if (!(this.flags & 256) && this.dirty) {
+      this.run();
+    }
+  }
+  run() {
+    if (!this.active) {
+      return this.fn();
+    }
+    cleanup(this);
+    const prevSub = startTracking(this);
+    try {
+      return this.fn();
+    } finally {
+      endTracking(this, prevSub);
+      const flags = this.flags;
+      if ((flags & (ReactiveFlags$1.Recursed | 128)) === (ReactiveFlags$1.Recursed | 128)) {
+        this.flags = flags & ~ReactiveFlags$1.Recursed;
+        this.notify();
+      }
+    }
+  }
+  stop() {
+    if (!this.active) {
+      return;
+    }
+    this.flags = 1024;
+    let dep = this.deps;
+    while (dep !== void 0) {
+      dep = unlink(dep, this);
+    }
+    const sub = this.subs;
+    if (sub !== void 0) {
+      unlink(sub);
+    }
+    cleanup(this);
+  }
+  get dirty() {
+    const flags = this.flags;
+    if (flags & ReactiveFlags$1.Dirty) {
+      return true;
+    }
+    if (flags & ReactiveFlags$1.Pending) {
+      if (checkDirty(this.deps, this)) {
+        this.flags = flags | ReactiveFlags$1.Dirty;
+        return true;
+      } else {
+        this.flags = flags & ~ReactiveFlags$1.Pending;
       }
     }
+    return false;
+  }
+}
+{
+  setupOnTrigger(ReactiveEffect);
+}
+function effect(fn, options) {
+  if (fn.effect instanceof ReactiveEffect) {
+    fn = fn.effect.fn;
+  }
+  const e = new ReactiveEffect(fn);
+  if (options) {
+    const { onStop, scheduler } = options;
+    if (onStop) {
+      options.onStop = void 0;
+      const stop2 = e.stop.bind(e);
+      e.stop = () => {
+        stop2();
+        onStop();
+      };
+    }
+    if (scheduler) {
+      options.scheduler = void 0;
+      e.notify = () => {
+        if (!(e.flags & 256)) {
+          scheduler();
+        }
+      };
+    }
+    extend(e, options);
   }
-}
-function triggerRef(ref2) {
-  if (ref2.dep) {
-    {
-      ref2.dep.trigger({
-        target: ref2,
-        type: "set",
-        key: "value",
-        newValue: ref2._value
-      });
-    }
+  try {
+    e.run();
+  } catch (err) {
+    e.stop();
+    throw err;
   }
+  const runner = e.run.bind(e);
+  runner.effect = e;
+  return runner;
 }
-function unref(ref2) {
-  return isRef(ref2) ? ref2.value : ref2;
+function stop(runner) {
+  runner.effect.stop();
 }
-function toValue(source) {
-  return isFunction(source) ? source() : unref(source);
+const resetTrackingStack = [];
+function pauseTracking() {
+  resetTrackingStack.push(activeSub);
+  setActiveSub();
 }
-const shallowUnwrapHandlers = {
-  get: (target, key, receiver) => key === "__v_raw" ? target : unref(Reflect.get(target, key, receiver)),
-  set: (target, key, value, receiver) => {
-    const oldValue = target[key];
-    if (isRef(oldValue) && !isRef(value)) {
-      oldValue.value = value;
-      return true;
-    } else {
-      return Reflect.set(target, key, value, receiver);
+function enableTracking() {
+  const isPaused = activeSub === void 0;
+  if (!isPaused) {
+    resetTrackingStack.push(activeSub);
+  } else {
+    resetTrackingStack.push(void 0);
+    for (let i = resetTrackingStack.length - 1; i >= 0; i--) {
+      if (resetTrackingStack[i] !== void 0) {
+        setActiveSub(resetTrackingStack[i]);
+        break;
+      }
     }
   }
-};
-function proxyRefs(objectWithRefs) {
-  return isReactive(objectWithRefs) ? objectWithRefs : new Proxy(objectWithRefs, shallowUnwrapHandlers);
 }
-class CustomRefImpl {
-  constructor(factory) {
-    this["__v_isRef"] = true;
-    this._value = void 0;
-    const dep = this.dep = new Dep();
-    const { get, set } = factory(dep.track.bind(dep), dep.trigger.bind(dep));
-    this._get = get;
-    this._set = set;
-  }
-  get value() {
-    return this._value = this._get();
+function resetTracking() {
+  if (resetTrackingStack.length === 0) {
+    warn(
+      `resetTracking() was called when there was no active tracking to reset.`
+    );
   }
-  set value(newVal) {
-    this._set(newVal);
+  if (resetTrackingStack.length) {
+    setActiveSub(resetTrackingStack.pop());
+  } else {
+    setActiveSub();
   }
 }
-function customRef(factory) {
-  return new CustomRefImpl(factory);
+function cleanup(sub) {
+  const l = sub.cleanupsLength;
+  if (l) {
+    for (let i = 0; i < l; i++) {
+      sub.cleanups[i]();
+    }
+    sub.cleanupsLength = 0;
+  }
 }
-function toRefs(object) {
-  if (!isProxy(object)) {
-    warn(`toRefs() expects a reactive object but received a plain one.`);
+function onEffectCleanup(fn, failSilently = false) {
+  if (activeSub instanceof ReactiveEffect) {
+    activeSub.cleanups[activeSub.cleanupsLength++] = () => cleanupEffect(fn);
+  } else if (!failSilently) {
+    warn(
+      `onEffectCleanup() was called when there was no active effect to associate with.`
+    );
   }
-  const ret = isArray(object) ? new Array(object.length) : {};
-  for (const key in object) {
-    ret[key] = propertyToRef(object, key);
+}
+function cleanupEffect(fn) {
+  const prevSub = setActiveSub();
+  try {
+    fn();
+  } finally {
+    setActiveSub(prevSub);
   }
-  return ret;
 }
-class ObjectRefImpl {
-  constructor(_object, _key, _defaultValue) {
-    this._object = _object;
-    this._key = _key;
-    this._defaultValue = _defaultValue;
-    this["__v_isRef"] = true;
-    this._value = void 0;
+
+let activeEffectScope;
+class EffectScope {
+  constructor(detached = false) {
+    this.deps = void 0;
+    this.depsTail = void 0;
+    this.subs = void 0;
+    this.subsTail = void 0;
+    this.flags = 0;
+    /**
+     * @internal
+     */
+    this.cleanups = [];
+    /**
+     * @internal
+     */
+    this.cleanupsLength = 0;
+    if (!detached && activeEffectScope) {
+      link(this, activeEffectScope);
+    }
   }
-  get value() {
-    const val = this._object[this._key];
-    return this._value = val === void 0 ? this._defaultValue : val;
+  get active() {
+    return !(this.flags & 1024);
   }
-  set value(newVal) {
-    this._object[this._key] = newVal;
+  pause() {
+    if (!(this.flags & 256)) {
+      this.flags |= 256;
+      for (let link2 = this.deps; link2 !== void 0; link2 = link2.nextDep) {
+        const dep = link2.dep;
+        if ("pause" in dep) {
+          dep.pause();
+        }
+      }
+    }
   }
-  get dep() {
-    return getDepFromReactive(toRaw(this._object), this._key);
+  /**
+   * Resumes the effect scope, including all child scopes and effects.
+   */
+  resume() {
+    const flags = this.flags;
+    if (flags & 256) {
+      this.flags = flags & -257;
+      for (let link2 = this.deps; link2 !== void 0; link2 = link2.nextDep) {
+        const dep = link2.dep;
+        if ("resume" in dep) {
+          dep.resume();
+        }
+      }
+    }
   }
-}
-class GetterRefImpl {
-  constructor(_getter) {
-    this._getter = _getter;
-    this["__v_isRef"] = true;
-    this["__v_isReadonly"] = true;
-    this._value = void 0;
+  run(fn) {
+    const prevScope = activeEffectScope;
+    try {
+      activeEffectScope = this;
+      return fn();
+    } finally {
+      activeEffectScope = prevScope;
+    }
   }
-  get value() {
-    return this._value = this._getter();
+  stop() {
+    if (!this.active) {
+      return;
+    }
+    this.flags = 1024;
+    let dep = this.deps;
+    while (dep !== void 0) {
+      const node = dep.dep;
+      if ("stop" in node) {
+        dep = dep.nextDep;
+        node.stop();
+      } else {
+        dep = unlink(dep, this);
+      }
+    }
+    const sub = this.subs;
+    if (sub !== void 0) {
+      unlink(sub);
+    }
+    cleanup(this);
   }
 }
-function toRef(source, key, defaultValue) {
-  if (isRef(source)) {
-    return source;
-  } else if (isFunction(source)) {
-    return new GetterRefImpl(source);
-  } else if (isObject(source) && arguments.length > 1) {
-    return propertyToRef(source, key, defaultValue);
-  } else {
-    return ref(source);
+function effectScope(detached) {
+  return new EffectScope(detached);
+}
+function getCurrentScope() {
+  return activeEffectScope;
+}
+function setCurrentScope(scope) {
+  try {
+    return activeEffectScope;
+  } finally {
+    activeEffectScope = scope;
   }
 }
-function propertyToRef(source, key, defaultValue) {
-  const val = source[key];
-  return isRef(val) ? val : new ObjectRefImpl(source, key, defaultValue);
+function onScopeDispose(fn, failSilently = false) {
+  if (activeEffectScope !== void 0) {
+    activeEffectScope.cleanups[activeEffectScope.cleanupsLength++] = fn;
+  } else if (!failSilently) {
+    warn(
+      `onScopeDispose() is called when there is no active effect scope to be associated with.`
+    );
+  }
 }
 
 class ComputedRefImpl {
-  constructor(fn, setter, isSSR) {
+  constructor(fn, setter) {
     this.fn = fn;
     this.setter = setter;
     /**
      * @internal
      */
     this._value = void 0;
-    /**
-     * @internal
-     */
-    this.dep = new Dep(this);
-    /**
-     * @internal
-     */
-    this.__v_isRef = true;
-    // TODO isolatedDeclarations "__v_isReadonly"
-    // A computed is also a subscriber that tracks other deps
-    /**
-     * @internal
-     */
+    this.subs = void 0;
+    this.subsTail = void 0;
     this.deps = void 0;
-    /**
-     * @internal
-     */
     this.depsTail = void 0;
+    this.flags = ReactiveFlags$1.Mutable | ReactiveFlags$1.Dirty;
     /**
      * @internal
      */
-    this.flags = 16;
-    /**
-     * @internal
-     */
-    this.globalVersion = globalVersion - 1;
-    /**
-     * @internal
-     */
-    this.next = void 0;
-    // for backwards compat
-    this.effect = this;
+    this.__v_isRef = true;
     this["__v_isReadonly"] = !setter;
-    this.isSSR = isSSR;
+  }
+  // TODO isolatedDeclarations "__v_isReadonly"
+  // for backwards compat
+  get effect() {
+    return this;
+  }
+  // for backwards compat
+  get dep() {
+    return this;
   }
   /**
    * @internal
+   * for backwards compat
    */
-  notify() {
-    this.flags |= 16;
-    if (!(this.flags & 8) && // avoid infinite self recursion
-    activeSub !== this) {
-      batch(this, true);
+  get _dirty() {
+    const flags = this.flags;
+    if (flags & ReactiveFlags$1.Dirty) {
       return true;
     }
+    if (flags & ReactiveFlags$1.Pending) {
+      if (checkDirty(this.deps, this)) {
+        this.flags = flags | ReactiveFlags$1.Dirty;
+        return true;
+      } else {
+        this.flags = flags & ~ReactiveFlags$1.Pending;
+      }
+    }
+    return false;
+  }
+  /**
+   * @internal
+   * for backwards compat
+   */
+  set _dirty(v) {
+    if (v) {
+      this.flags |= ReactiveFlags$1.Dirty;
+    } else {
+      this.flags &= ~(ReactiveFlags$1.Dirty | ReactiveFlags$1.Pending);
+    }
   }
   get value() {
-    const link = this.dep.track({
-      target: this,
-      type: "get",
-      key: "value"
-    }) ;
-    refreshComputed(this);
-    if (link) {
-      link.version = this.dep.version;
+    const flags = this.flags;
+    if (flags & ReactiveFlags$1.Dirty || flags & ReactiveFlags$1.Pending && checkDirty(this.deps, this)) {
+      if (this.update()) {
+        const subs = this.subs;
+        if (subs !== void 0) {
+          shallowPropagate(subs);
+        }
+      }
+    } else if (flags & ReactiveFlags$1.Pending) {
+      this.flags = flags & ~ReactiveFlags$1.Pending;
+    }
+    if (activeSub !== void 0) {
+      {
+        onTrack(activeSub, {
+          target: this,
+          type: "get",
+          key: "value"
+        });
+      }
+      link(this, activeSub);
+    } else if (activeEffectScope !== void 0) {
+      link(this, activeEffectScope);
     }
     return this._value;
   }
@@ -1700,6 +1773,23 @@ class ComputedRefImpl {
       warn("Write operation failed: computed value is readonly");
     }
   }
+  update() {
+    const prevSub = startTracking(this);
+    try {
+      const oldValue = this._value;
+      const newValue = this.fn(oldValue);
+      if (hasChanged(oldValue, newValue)) {
+        this._value = newValue;
+        return true;
+      }
+      return false;
+    } finally {
+      endTracking(this, prevSub);
+    }
+  }
+}
+{
+  setupOnTrigger(ComputedRefImpl);
 }
 function computed(getterOrOptions, debugOptions, isSSR = false) {
   let getter;
@@ -1710,7 +1800,7 @@ function computed(getterOrOptions, debugOptions, isSSR = false) {
     getter = getterOrOptions.get;
     setter = getterOrOptions.set;
   }
-  const cRef = new ComputedRefImpl(getter, setter, isSSR);
+  const cRef = new ComputedRefImpl(getter, setter);
   if (debugOptions && !isSSR) {
     cRef.onTrack = debugOptions.onTrack;
     cRef.onTrigger = debugOptions.onTrigger;
@@ -1747,177 +1837,155 @@ const WatchErrorCodes = {
   "4": "WATCH_CLEANUP"
 };
 const INITIAL_WATCHER_VALUE = {};
-const cleanupMap = /* @__PURE__ */ new WeakMap();
 let activeWatcher = void 0;
 function getCurrentWatcher() {
   return activeWatcher;
 }
 function onWatcherCleanup(cleanupFn, failSilently = false, owner = activeWatcher) {
   if (owner) {
-    let cleanups = cleanupMap.get(owner);
-    if (!cleanups) cleanupMap.set(owner, cleanups = []);
-    cleanups.push(cleanupFn);
+    const { call } = owner.options;
+    if (call) {
+      owner.cleanups[owner.cleanupsLength++] = () => call(cleanupFn, 4);
+    } else {
+      owner.cleanups[owner.cleanupsLength++] = cleanupFn;
+    }
   } else if (!failSilently) {
     warn(
       `onWatcherCleanup() was called when there was no active watcher to associate with.`
     );
   }
 }
-function watch(source, cb, options = EMPTY_OBJ) {
-  const { immediate, deep, once, scheduler, augmentJob, call } = options;
-  const warnInvalidSource = (s) => {
-    (options.onWarn || warn)(
-      `Invalid watch source: `,
-      s,
-      `A watch source can only be a getter/effect function, a ref, a reactive object, or an array of these types.`
-    );
-  };
-  const reactiveGetter = (source2) => {
-    if (deep) return source2;
-    if (isShallow(source2) || deep === false || deep === 0)
-      return traverse(source2, 1);
-    return traverse(source2);
-  };
-  let effect;
-  let getter;
-  let cleanup;
-  let boundCleanup;
-  let forceTrigger = false;
-  let isMultiSource = false;
-  if (isRef(source)) {
-    getter = () => source.value;
-    forceTrigger = isShallow(source);
-  } else if (isReactive(source)) {
-    getter = () => reactiveGetter(source);
-    forceTrigger = true;
-  } else if (isArray(source)) {
-    isMultiSource = true;
-    forceTrigger = source.some((s) => isReactive(s) || isShallow(s));
-    getter = () => source.map((s) => {
-      if (isRef(s)) {
-        return s.value;
-      } else if (isReactive(s)) {
-        return reactiveGetter(s);
-      } else if (isFunction(s)) {
-        return call ? call(s, 2) : s();
+class WatcherEffect extends ReactiveEffect {
+  constructor(source, cb, options = EMPTY_OBJ) {
+    const { deep, once, call, onWarn } = options;
+    let getter;
+    let forceTrigger = false;
+    let isMultiSource = false;
+    if (isRef(source)) {
+      getter = () => source.value;
+      forceTrigger = isShallow(source);
+    } else if (isReactive(source)) {
+      getter = () => reactiveGetter(source, deep);
+      forceTrigger = true;
+    } else if (isArray(source)) {
+      isMultiSource = true;
+      forceTrigger = source.some((s) => isReactive(s) || isShallow(s));
+      getter = () => source.map((s) => {
+        if (isRef(s)) {
+          return s.value;
+        } else if (isReactive(s)) {
+          return reactiveGetter(s, deep);
+        } else if (isFunction(s)) {
+          return call ? call(s, 2) : s();
+        } else {
+          warnInvalidSource(s, onWarn);
+        }
+      });
+    } else if (isFunction(source)) {
+      if (cb) {
+        getter = call ? () => call(source, 2) : source;
       } else {
-        warnInvalidSource(s);
-      }
-    });
-  } else if (isFunction(source)) {
-    if (cb) {
-      getter = call ? () => call(source, 2) : source;
-    } else {
-      getter = () => {
-        if (cleanup) {
-          pauseTracking();
+        getter = () => {
+          if (this.cleanupsLength) {
+            const prevSub = setActiveSub();
+            try {
+              cleanup(this);
+            } finally {
+              setActiveSub(prevSub);
+            }
+          }
+          const currentEffect = activeWatcher;
+          activeWatcher = this;
           try {
-            cleanup();
+            return call ? call(source, 3, [
+              this.boundCleanup
+            ]) : source(this.boundCleanup);
           } finally {
-            resetTracking();
+            activeWatcher = currentEffect;
           }
-        }
-        const currentEffect = activeWatcher;
-        activeWatcher = effect;
-        try {
-          return call ? call(source, 3, [boundCleanup]) : source(boundCleanup);
-        } finally {
-          activeWatcher = currentEffect;
-        }
+        };
+      }
+    } else {
+      getter = NOOP;
+      warnInvalidSource(source, onWarn);
+    }
+    if (cb && deep) {
+      const baseGetter = getter;
+      const depth = deep === true ? Infinity : deep;
+      getter = () => traverse(baseGetter(), depth);
+    }
+    super(getter);
+    this.cb = cb;
+    this.options = options;
+    this.boundCleanup = (fn) => onWatcherCleanup(fn, false, this);
+    this.forceTrigger = forceTrigger;
+    this.isMultiSource = isMultiSource;
+    if (once && cb) {
+      const _cb = cb;
+      cb = (...args) => {
+        _cb(...args);
+        this.stop();
       };
     }
-  } else {
-    getter = NOOP;
-    warnInvalidSource(source);
-  }
-  if (cb && deep) {
-    const baseGetter = getter;
-    const depth = deep === true ? Infinity : deep;
-    getter = () => traverse(baseGetter(), depth);
-  }
-  const scope = getCurrentScope();
-  const watchHandle = () => {
-    effect.stop();
-    if (scope && scope.active) {
-      remove(scope.effects, effect);
+    this.cb = cb;
+    this.oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
+    {
+      this.onTrack = options.onTrack;
+      this.onTrigger = options.onTrigger;
     }
-  };
-  if (once && cb) {
-    const _cb = cb;
-    cb = (...args) => {
-      _cb(...args);
-      watchHandle();
-    };
   }
-  let oldValue = isMultiSource ? new Array(source.length).fill(INITIAL_WATCHER_VALUE) : INITIAL_WATCHER_VALUE;
-  const job = (immediateFirstRun) => {
-    if (!(effect.flags & 1) || !effect.dirty && !immediateFirstRun) {
+  run(initialRun = false) {
+    const oldValue = this.oldValue;
+    const newValue = this.oldValue = super.run();
+    if (!this.cb) {
       return;
     }
-    if (cb) {
-      const newValue = effect.run();
-      if (deep || forceTrigger || (isMultiSource ? newValue.some((v, i) => hasChanged(v, oldValue[i])) : hasChanged(newValue, oldValue))) {
-        if (cleanup) {
-          cleanup();
-        }
-        const currentWatcher = activeWatcher;
-        activeWatcher = effect;
-        try {
-          const args = [
-            newValue,
-            // pass undefined as the old value when it's changed for the first time
-            oldValue === INITIAL_WATCHER_VALUE ? void 0 : isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE ? [] : oldValue,
-            boundCleanup
-          ];
-          oldValue = newValue;
-          call ? call(cb, 3, args) : (
-            // @ts-expect-error
-            cb(...args)
-          );
-        } finally {
-          activeWatcher = currentWatcher;
-        }
-      }
-    } else {
-      effect.run();
+    const { immediate, deep, call } = this.options;
+    if (initialRun && !immediate) {
+      return;
     }
-  };
-  if (augmentJob) {
-    augmentJob(job);
-  }
-  effect = new ReactiveEffect(getter);
-  effect.scheduler = scheduler ? () => scheduler(job, false) : job;
-  boundCleanup = (fn) => onWatcherCleanup(fn, false, effect);
-  cleanup = effect.onStop = () => {
-    const cleanups = cleanupMap.get(effect);
-    if (cleanups) {
-      if (call) {
-        call(cleanups, 4);
-      } else {
-        for (const cleanup2 of cleanups) cleanup2();
+    if (deep || this.forceTrigger || (this.isMultiSource ? newValue.some((v, i) => hasChanged(v, oldValue[i])) : hasChanged(newValue, oldValue))) {
+      cleanup(this);
+      const currentWatcher = activeWatcher;
+      activeWatcher = this;
+      try {
+        const args = [
+          newValue,
+          // pass undefined as the old value when it's changed for the first time
+          oldValue === INITIAL_WATCHER_VALUE ? void 0 : this.isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE ? [] : oldValue,
+          this.boundCleanup
+        ];
+        call ? call(this.cb, 3, args) : (
+          // @ts-expect-error
+          this.cb(...args)
+        );
+      } finally {
+        activeWatcher = currentWatcher;
       }
-      cleanupMap.delete(effect);
-    }
-  };
-  {
-    effect.onTrack = options.onTrack;
-    effect.onTrigger = options.onTrigger;
-  }
-  if (cb) {
-    if (immediate) {
-      job(true);
-    } else {
-      oldValue = effect.run();
     }
-  } else if (scheduler) {
-    scheduler(job.bind(null, true), true);
-  } else {
-    effect.run();
   }
-  watchHandle.pause = effect.pause.bind(effect);
-  watchHandle.resume = effect.resume.bind(effect);
-  watchHandle.stop = watchHandle;
-  return watchHandle;
+}
+function reactiveGetter(source, deep) {
+  if (deep) return source;
+  if (isShallow(source) || deep === false || deep === 0)
+    return traverse(source, 1);
+  return traverse(source);
+}
+function warnInvalidSource(s, onWarn) {
+  (onWarn || warn)(
+    `Invalid watch source: `,
+    s,
+    `A watch source can only be a getter/effect function, a ref, a reactive object, or an array of these types.`
+  );
+}
+function watch(source, cb, options = EMPTY_OBJ) {
+  const effect = new WatcherEffect(source, cb, options);
+  effect.run(true);
+  const stop = effect.stop.bind(effect);
+  stop.pause = effect.pause.bind(effect);
+  stop.resume = effect.resume.bind(effect);
+  stop.stop = stop;
+  return stop;
 }
 function traverse(value, depth = Infinity, seen) {
   if (depth <= 0 || !isObject(value) || value["__v_skip"]) {
@@ -1952,4 +2020,4 @@ function traverse(value, depth = Infinity, seen) {
   return value;
 }
 
-export { ARRAY_ITERATE_KEY, EffectFlags, EffectScope, ITERATE_KEY, MAP_KEY_ITERATE_KEY, ReactiveEffect, ReactiveFlags, TrackOpTypes, TriggerOpTypes, WatchErrorCodes, computed, customRef, effect, effectScope, enableTracking, getCurrentScope, getCurrentWatcher, isProxy, isReactive, isReadonly, isRef, isShallow, markRaw, onEffectCleanup, onScopeDispose, onWatcherCleanup, pauseTracking, proxyRefs, reactive, reactiveReadArray, readonly, ref, resetTracking, shallowReactive, shallowReadArray, shallowReadonly, shallowRef, stop, toRaw, toReactive, toReadonly, toRef, toRefs, toValue, track, traverse, trigger, triggerRef, unref, watch };
+export { ARRAY_ITERATE_KEY, EffectFlags, EffectScope, ITERATE_KEY, MAP_KEY_ITERATE_KEY, ReactiveEffect, ReactiveFlags, TrackOpTypes, TriggerOpTypes, WatchErrorCodes, WatcherEffect, computed, customRef, effect, effectScope, enableTracking, getCurrentScope, getCurrentWatcher, isProxy, isReactive, isReadonly, isRef, isShallow, markRaw, onEffectCleanup, onScopeDispose, onWatcherCleanup, pauseTracking, proxyRefs, reactive, reactiveReadArray, readonly, ref, resetTracking, setActiveSub, setCurrentScope, shallowReactive, shallowReadArray, shallowReadonly, shallowRef, stop, toRaw, toReactive, toReadonly, toRef, toRefs, toValue, track, traverse, trigger, triggerRef, unref, watch };