ivue 2.3.0 → 2.4.0

package/dist/Reactive.d.ts

@@ -32,7 +32,7 @@ export declare type VuePropsWithDefaults<T extends VuePropsObject> = {
  * @param val Any value
  * @returns boolean If it's a JavaScript Class returns true
  */
-export declare const isClass: (val: any) => boolean;
+export declare function isClass(val: any): boolean;
 /**
  * Creates props with defaults in defineComponent() style.
  *
@@ -64,7 +64,7 @@ export declare const isClass: (val: any) => boolean;
  * @param customCloner Optional cloner used for object/array defaults (defaults to structuredClone)
  * @returns Props declared in defineComponent() style with all properties having default property declared.
  */
-export declare const propsWithDefaults: <T extends VuePropsObject>(defaults: Record<string, any>, typedProps: T, customCloner?: ((val: any) => any) | undefined) => VuePropsWithDefaults<T>;
+export declare function propsWithDefaults<T extends VuePropsObject>(defaults: Record<string, any>, typedProps: T, customCloner?: (val: any) => any): VuePropsWithDefaults<T>;
 /**
  * Type Utilities
  */
@@ -84,8 +84,12 @@ export declare type ReactiveInstance<T> = T & WritableGetters<T> & {
     $watch: typeof watch;
     /** Register a watchEffect in the instance's lazy effect scope (same signature as Vue `watchEffect`). */
     $watchEffect: typeof watchEffect;
-    /** Stop the instance's effect scope and drop cached cells. */
-    $stopEffects: () => void;
+    /** Stop the instance's effect scope and drop cached cells (the next
+     * touch re-materializes). `{ reset: false }` stops watchers only —
+     * every cached cell survives with its current value. */
+    $stopEffects: (options?: {
+        reset?: boolean;
+    }) => void;
 };
 export declare type ReactiveClass<C extends new (...args: any) => any> = {
     [Key in keyof C]: C[Key];

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),g=Object.hasOwn,y=Object.getPrototypeOf,w=Object.getOwnPropertyDescriptor,m=Object.getOwnPropertyNames,a=Object.defineProperty,d=Object.prototype,b=Symbol.for("ivue.raw"),p=Symbol.for("ivue.scope"),h=Symbol.for("ivue.processed");function s(e){const r=l.toRaw(e);if(r!==e)return r[b]??(r[b]=r);const n=e[b];return n?n===e?n:l.toRaw(n):e[b]=e}function O(e,r,n,o){a(e,r,{configurable:!0,enumerable:!1,get(){const t=s(this);return t[n]??(t[n]=o.bind(t))},set(t){s(this)[n]=t}})}function S(e,r,n,o,t){const f=r[0]==="$";a(e,r,{configurable:!0,enumerable:!1,get:function(){const c=s(this);if(n in c)return c[n];const i=o.call(c);return f?(c[n]=i,i):(l.isRef(i)?c[n]=i:a(e,r,{configurable:!0,enumerable:!1,get(){return o.call(s(this))},set:t?function(u){return t.call(s(this),u)}:void 0}),i)},set:t?function(c){return t.call(s(this),c)}:void 0})}const v=e=>{var r;return typeof e=="function"&&!!e.prototype&&!((r=w(e,"prototype"))!=null&&r.writable)};exports.Reactive=function(e){const r=[];let n=e.prototype;for(;n&&n!==d;)r.push(n),n=y(n);r.reverse();for(const o of r){if(g(o,h))continue;const t=m(o),f=[];for(const c of t){if(c==="constructor")continue;const i=w(o,c);if(typeof i.value=="function"){const u=Symbol(c);f.push(u),O(o,c,u,i.value)}else if(i.get){const u=Symbol(c);f.push(u),S(o,c,u,i.get,i.set)}}a(o,h,{value:f})}return g(e.prototype,"$stopEffects")||(a(e.prototype,"$watch",{enumerable:!1,configurable:!0,writable:!0,value:function(...o){const t=s(this);return(t[p]??(t[p]=l.effectScope(!0))).run(()=>l.watch(...o))}}),a(e.prototype,"$watchEffect",{enumerable:!1,configurable:!0,writable:!0,value:function(...o){const t=s(this);return(t[p]??(t[p]=l.effectScope(!0))).run(()=>l.watchEffect(...o))}}),a(e.prototype,"$stopEffects",{enumerable:!1,configurable:!0,writable:!0,value:function(){const o=s(this);try{const t=o[p];t&&t.stop()}finally{delete o[p];let t=y(o);for(;t&&t!==d;){const f=t[h];if(f)for(const c of f)delete o[c];t=y(t)}}}})),e},exports.isClass=v,exports.propsWithDefaults=(e,r,n)=>{const o={};for(const t in r){const f=e==null?void 0:e[t],c=r[t];o[t]={...c},c.required||f===void 0||(typeof f=="object"&&f!==null?o[t].default=()=>n?n(f):structuredClone(f):v(f)?o[t].default=()=>f:o[t].default=f)}return o};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("vue"),g=Object.hasOwn,y=Object.getPrototypeOf,w=Object.getOwnPropertyDescriptor,m=Object.getOwnPropertyNames,a=Object.defineProperty,d=Object.prototype,b=Symbol.for("ivue.raw"),p=Symbol.for("ivue.scope"),h=Symbol.for("ivue.processed");function i(e){const c=l.toRaw(e);if(c!==e)return c[b]??(c[b]=c);const r=e[b];return r?r===e?r:l.toRaw(r):e[b]=e}function O(e,c,r,o){a(e,c,{configurable:!0,enumerable:!1,get(){const t=i(this);return t[r]??(t[r]=o.bind(t))},set(t){i(this)[r]=t}})}function S(e,c,r,o,t){const n=c[0]==="$";a(e,c,{configurable:!0,enumerable:!1,get:function(){const u=i(this);if(r in u)return u[r];const f=o.call(u);return n?(u[r]=f,f):(l.isRef(f)?u[r]=f:a(e,c,{configurable:!0,enumerable:!1,get(){return o.call(i(this))},set:t?function(s){return t.call(i(this),s)}:void 0}),f)},set:t?function(u){return t.call(i(this),u)}:void 0})}function v(e){var c;return typeof e=="function"&&!!e.prototype&&!((c=w(e,"prototype"))!=null&&c.writable)}exports.Reactive=function(e){const c=[];let r=e.prototype;for(;r&&r!==d;)c.push(r),r=y(r);c.reverse();for(const o of c){if(g(o,h))continue;const t=m(o),n=[];for(const u of t){if(u==="constructor")continue;const f=w(o,u);if(typeof f.value=="function"){const s=Symbol(u);n.push(s),O(o,u,s,f.value)}else if(f.get){const s=Symbol(u);n.push(s),S(o,u,s,f.get,f.set)}}a(o,h,{value:n})}return g(e.prototype,"$stopEffects")||(a(e.prototype,"$watch",{enumerable:!1,configurable:!0,writable:!0,value:function(...o){const t=i(this);return(t[p]??(t[p]=l.effectScope(!0))).run(()=>l.watch(...o))}}),a(e.prototype,"$watchEffect",{enumerable:!1,configurable:!0,writable:!0,value:function(...o){const t=i(this);return(t[p]??(t[p]=l.effectScope(!0))).run(()=>l.watchEffect(...o))}}),a(e.prototype,"$stopEffects",{enumerable:!1,configurable:!0,writable:!0,value:function(o){const t=i(this);try{const n=t[p];n&&n.stop()}finally{if(delete t[p],(o==null?void 0:o.reset)!==!1){let n=y(t);for(;n&&n!==d;){const u=n[h];if(u)for(const f of u)delete t[f];n=y(n)}}}}})),e},exports.isClass=v,exports.propsWithDefaults=function(e,c,r){const o={};for(const t in c){const n=e==null?void 0:e[t],u=c[t];o[t]={...u},u.required||n===void 0||(typeof n=="object"&&n!==null?o[t].default=()=>r?r(n):structuredClone(n):v(n)?o[t].default=()=>n:o[t].default=n)}return o};

package/dist/index.es.js

@@ -1,59 +1,59 @@
 import { effectScope as h, watch as w, watchEffect as O, toRaw as g, isRef as j } from "vue";
 const m = Object.hasOwn, b = Object.getPrototypeOf, d = Object.getOwnPropertyDescriptor, S = Object.getOwnPropertyNames, a = Object.defineProperty, v = Object.prototype, p = Symbol.for("ivue.raw"), l = Symbol.for("ivue.scope"), y = Symbol.for("ivue.processed");
 function f(e) {
-  const r = g(e);
-  if (r !== e)
-    return r[p] ?? (r[p] = r);
-  const n = e[p];
-  return n ? n === e ? n : g(n) : e[p] = e;
+  const c = g(e);
+  if (c !== e)
+    return c[p] ?? (c[p] = c);
+  const r = e[p];
+  return r ? r === e ? r : g(r) : e[p] = e;
 }
-function $(e, r, n, o) {
-  a(e, r, { configurable: !0, enumerable: !1, get() {
+function $(e, c, r, o) {
+  a(e, c, { configurable: !0, enumerable: !1, get() {
     const t = f(this);
-    return t[n] ?? (t[n] = o.bind(t));
+    return t[r] ?? (t[r] = o.bind(t));
   }, set(t) {
-    f(this)[n] = t;
+    f(this)[r] = t;
   } });
 }
-function E(e, r, n, o, t) {
-  const s = r[0] === "$";
-  a(e, r, { configurable: !0, enumerable: !1, get: function() {
-    const c = f(this);
-    if (n in c)
-      return c[n];
-    const u = o.call(c);
-    return s ? (c[n] = u, u) : (j(u) ? c[n] = u : a(e, r, { configurable: !0, enumerable: !1, get() {
+function E(e, c, r, o, t) {
+  const n = c[0] === "$";
+  a(e, c, { configurable: !0, enumerable: !1, get: function() {
+    const s = f(this);
+    if (r in s)
+      return s[r];
+    const u = o.call(s);
+    return n ? (s[r] = u, u) : (j(u) ? s[r] = u : a(e, c, { configurable: !0, enumerable: !1, get() {
       return o.call(f(this));
     }, set: t ? function(i) {
       return t.call(f(this), i);
     } : void 0 }), u);
-  }, set: t ? function(c) {
-    return t.call(f(this), c);
+  }, set: t ? function(s) {
+    return t.call(f(this), s);
   } : void 0 });
 }
 function C(e) {
-  const r = [];
-  let n = e.prototype;
-  for (; n && n !== v; )
-    r.push(n), n = b(n);
-  r.reverse();
-  for (const o of r) {
+  const c = [];
+  let r = e.prototype;
+  for (; r && r !== v; )
+    c.push(r), r = b(r);
+  c.reverse();
+  for (const o of c) {
     if (m(o, y))
       continue;
-    const t = S(o), s = [];
-    for (const c of t) {
-      if (c === "constructor")
+    const t = S(o), n = [];
+    for (const s of t) {
+      if (s === "constructor")
         continue;
-      const u = d(o, c);
+      const u = d(o, s);
       if (typeof u.value == "function") {
-        const i = Symbol(c);
-        s.push(i), $(o, c, i, u.value);
+        const i = Symbol(s);
+        n.push(i), $(o, s, i, u.value);
       } else if (u.get) {
-        const i = Symbol(c);
-        s.push(i), E(o, c, i, u.get, u.set);
+        const i = Symbol(s);
+        n.push(i), E(o, s, i, u.get, u.set);
       }
     }
-    a(o, y, { value: s });
+    a(o, y, { value: n });
   }
   return m(e.prototype, "$stopEffects") || (a(e.prototype, "$watch", { enumerable: !1, configurable: !0, writable: !0, value: function(...o) {
     const t = f(this);
@@ -61,35 +61,37 @@ function C(e) {
   } }), a(e.prototype, "$watchEffect", { enumerable: !1, configurable: !0, writable: !0, value: function(...o) {
     const t = f(this);
     return (t[l] ?? (t[l] = h(!0))).run(() => O(...o));
-  } }), a(e.prototype, "$stopEffects", { enumerable: !1, configurable: !0, writable: !0, value: function() {
-    const o = f(this);
+  } }), a(e.prototype, "$stopEffects", { enumerable: !1, configurable: !0, writable: !0, value: function(o) {
+    const t = f(this);
     try {
-      const t = o[l];
-      t && t.stop();
+      const n = t[l];
+      n && n.stop();
     } finally {
-      delete o[l];
-      let t = b(o);
-      for (; t && t !== v; ) {
-        const s = t[y];
-        if (s)
-          for (const c of s)
-            delete o[c];
-        t = b(t);
+      if (delete t[l], (o == null ? void 0 : o.reset) !== !1) {
+        let n = b(t);
+        for (; n && n !== v; ) {
+          const s = n[y];
+          if (s)
+            for (const u of s)
+              delete t[u];
+          n = b(n);
+        }
       }
     }
   } })), e;
 }
-const P = (e) => {
-  var r;
-  return typeof e == "function" && !!e.prototype && !((r = d(e, "prototype")) != null && r.writable);
-}, D = (e, r, n) => {
+function P(e) {
+  var c;
+  return typeof e == "function" && !!e.prototype && !((c = d(e, "prototype")) != null && c.writable);
+}
+function D(e, c, r) {
   const o = {};
-  for (const t in r) {
-    const s = e == null ? void 0 : e[t], c = r[t];
-    o[t] = { ...c }, c.required || s === void 0 || (typeof s == "object" && s !== null ? o[t].default = () => n ? n(s) : structuredClone(s) : P(s) ? o[t].default = () => s : o[t].default = s);
+  for (const t in c) {
+    const n = e == null ? void 0 : e[t], s = c[t];
+    o[t] = { ...s }, s.required || n === void 0 || (typeof n == "object" && n !== null ? o[t].default = () => r ? r(n) : structuredClone(n) : P(n) ? o[t].default = () => n : o[t].default = n);
   }
   return o;
-};
+}
 export {
   C as Reactive,
   P as isClass,

package/lib/Reactive.ts

@@ -257,15 +257,19 @@ export function Reactive<C extends new (...args: any) => any>(
 
     /**
      * Tear down the instance: stop its effect scope (any watchers created via
-     * $watch) and drop all cached cells so refs/computeds become collectable.
-     * No hooks — ivue never calls user code; compose richer cleanup as an
-     * ordinary method that does its own work and then calls $stopEffects().
+     * $watch) and drop all cached cells so refs/computeds become collectable —
+     * the next touch re-materializes fresh cells (disposal is a reset).
+     * Pass { reset: false } to stop the watchers ONLY: every cached cell
+     * survives with its current value, and the instance can $watch again in a
+     * fresh scope. No hooks — ivue never calls user code; compose richer
+     * cleanup as an ordinary method that does its own work and then calls
+     * $stopEffects().
      */
     defineProperty(targetClass.prototype, '$stopEffects', {
       enumerable: false,
       configurable: true,
       writable: true,
-      value: function (this: any) {
+      value: function (this: any, options?: { reset?: boolean }) {
         const raw = resolveRaw(this);
         try {
           const scope = raw[SCOPE];
@@ -274,18 +278,22 @@ export function Reactive<C extends new (...args: any) => any>(
           // SCOPE is ivue-owned but is not a method/getter cache key.
           delete raw[SCOPE];
 
-          // Each processed prototype's PROCESSED marker carries the
-          // symbols it may cache on an instance. Walk Child -> Base and
-          // remove only those known keys.
-          let prototype = getPrototypeOf(raw);
-          while (prototype && prototype !== objectPrototype) {
-            const cacheKeys = prototype[PROCESSED] as
-              | readonly symbol[]
-              | undefined;
-            if (cacheKeys) {
-              for (const cacheKey of cacheKeys) delete raw[cacheKey];
+          // { reset: false } = stop watchers only; cells keep their
+          // values (a `return` here would swallow a throwing stop()).
+          if (options?.reset !== false) {
+            // Each processed prototype's PROCESSED marker carries the
+            // symbols it may cache on an instance. Walk Child -> Base and
+            // remove only those known keys.
+            let prototype = getPrototypeOf(raw);
+            while (prototype && prototype !== objectPrototype) {
+              const cacheKeys = prototype[PROCESSED] as
+                | readonly symbol[]
+                | undefined;
+              if (cacheKeys) {
+                for (const cacheKey of cacheKeys) delete raw[cacheKey];
+              }
+              prototype = getPrototypeOf(prototype);
             }
-            prototype = getPrototypeOf(prototype);
           }
         }
       },
@@ -321,7 +329,7 @@ export type VuePropsWithDefaults<T extends VuePropsObject> = {
  * @param val Any value
  * @returns boolean If it's a JavaScript Class returns true
  */
-export const isClass = (val: any): boolean => {
+export function isClass(val: any): boolean {
   if (typeof val !== 'function') return false; // Not a function, so not a class function either
 
   if (!val.prototype) return false; // Arrow function, so not a class
@@ -333,7 +341,7 @@ export const isClass = (val: any): boolean => {
   } else {
     return true; // Class -> Not a function
   }
-};
+}
 /**
  * Creates props with defaults in defineComponent() style.
  *
@@ -365,12 +373,12 @@ export const isClass = (val: any): boolean => {
  * @param customCloner Optional cloner used for object/array defaults (defaults to structuredClone)
  * @returns Props declared in defineComponent() style with all properties having default property declared.
  */
-export const propsWithDefaults = <T extends VuePropsObject>(
+export function propsWithDefaults<T extends VuePropsObject>(
   defaults: Record<string, any>,
   typedProps: T,
   // Optional: Allows user to pass a custom cloner if structuredClone isn't enough
   customCloner?: (val: any) => any,
-): VuePropsWithDefaults<T> => {
+): VuePropsWithDefaults<T> {
   // NON-MUTATING: descriptor objects are routinely SHARED between props
   // maps (`{ ...baseParamsTypes, extra }` — the spread copies the outer
   // object but every inner `{ type }` descriptor stays the same reference).
@@ -396,7 +404,7 @@ export const propsWithDefaults = <T extends VuePropsObject>(
     }
   }
   return result as VuePropsWithDefaults<T>;
-};
+}
 
 /**
  * Type Utilities
@@ -430,8 +438,10 @@ export type ReactiveInstance<T> = T &
     $watch: typeof watch;
     /** Register a watchEffect in the instance's lazy effect scope (same signature as Vue `watchEffect`). */
     $watchEffect: typeof watchEffect;
-    /** Stop the instance's effect scope and drop cached cells. */
-    $stopEffects: () => void;
+    /** Stop the instance's effect scope and drop cached cells (the next
+     * touch re-materializes). `{ reset: false }` stops watchers only —
+     * every cached cell survives with its current value. */
+    $stopEffects: (options?: { reset?: boolean }) => void;
   };
 
 export type ReactiveClass<C extends new (...args: any) => any> = {

package/lib/__tests__/Reactive.vitest.spec.ts

@@ -735,6 +735,64 @@ describe('Reactive()', () => {
       expect(() => instance.$stopEffects()).not.toThrow();
     });
 
+    it('{ reset: false } stops watchers but every cached cell survives', async () => {
+      class Session {
+        get counter() {
+          return ref(0);
+        }
+        get doubled() {
+          return computed(() => (this as any).counter.value * 2);
+        }
+      }
+      const instance: any = new (Reactive(Session))();
+      let observed = 0;
+      instance.$watchEffect(() => {
+        observed = instance.doubled.value; // first-touches the computed IN the scope
+      });
+      const counterCell = instance.counter;
+      const doubledCell = instance.doubled;
+      instance.counter.value = 21;
+      await nextTick();
+      expect(observed).toBe(42);
+
+      instance.$stopEffects({ reset: false });
+
+      // watchers are dead…
+      instance.counter.value = 100;
+      await nextTick();
+      expect(observed).toBe(42);
+      // …but the cells survive with their CURRENT values (no re-init)
+      expect(instance.counter).toBe(counterCell);
+      expect(instance.doubled).toBe(doubledCell);
+      expect(instance.counter.value).toBe(100);
+      // the surviving computed still evaluates (pull-based past scope death)
+      expect(instance.doubled.value).toBe(200);
+
+      // and a SECOND life works: a fresh scope tracks the old cells
+      let observedAgain = 0;
+      instance.$watch(
+        () => instance.doubled.value,
+        (doubledValue: number) => {
+          observedAgain = doubledValue;
+        },
+      );
+      instance.counter.value = 7;
+      await nextTick();
+      expect(observedAgain).toBe(14);
+    });
+
+    it('default call still resets — cells re-initialize after teardown', () => {
+      class Session {
+        get counter() {
+          return ref(0);
+        }
+      }
+      const instance: any = new (Reactive(Session))();
+      instance.counter.value = 41;
+      instance.$stopEffects();
+      expect(instance.counter.value).toBe(0);
+    });
+
     it('$stopEffects is injected only once (idempotent re-Reactive)', () => {
       class Store {
         m() {

package/lib/ivue.ts

@@ -1,3 +1,20 @@
+/**
+ * ============================================================
+ *  DEPRECATED — ivue v1 (the reactive-proxy engine)
+ * ============================================================
+ *
+ * This file is the ORIGINAL v1 implementation: `ivue(Class, ...args)`
+ * wraps instances in `reactive()` and converts accessors to computeds.
+ * It is kept in-tree for reference and migration only.
+ *
+ * v2 is `Reactive()` in ./Reactive.ts (the package's main entry) — a
+ * one-time prototype transform: instances stay plain objects, plain
+ * getters cost zero bytes, creation measures 55-253x faster. New code
+ * must never import from this file.
+ *
+ * Migration guide: https://ivue.dev/guide/standard
+ */
+
 import type { ComputedRef, ExtractPropTypes, Ref, ToRef } from 'vue';
 import { computed, markRaw, reactive, ref, shallowRef, toRef } from 'vue';
 import type { Ref as DemiRef } from 'vue-demi';
@@ -399,6 +416,8 @@ const getClassPropertiesAccessorsMap = (obj: object): PropsMapValue => {
  *    get getter () { return 'hello world'; }
  * }
  *
+ * @deprecated v1 engine — use `Reactive()` from the main `ivue` entry
+ * instead; see https://ivue.dev/guide/standard for the migration.
  * @param className Any Class
  * @param args Class constructor arguments that you would pass to a `new AnyClass(args...)`
  * @returns {IVue<T>}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ivue",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "Infinite Vue – Class Based Architecture for Vue 3",
   "type": "module",
   "exports": {
@@ -47,6 +47,7 @@
     "render:form-header": "node docs_v2/scripts/brand-image-generator.mjs form-header",
     "render:banner": "node docs_v2/scripts/brand-image-generator.mjs blog",
     "render:diagram": "node docs_v2/scripts/brand-image-generator.mjs diagram",
+    "render:page-og": "node docs_v2/scripts/page-og-generator.mjs",
     "render:embeds": "node docs_v2/scripts/blog-embed-shots.mjs",
     "render:code-shots": "node docs_v2/scripts/blog-code-shots.mjs",
     "sync:blog-dates": "node docs_v2/scripts/blog-dates-generator.mjs",

package/skills/ivue/SKILL.md

@@ -387,14 +387,32 @@ class $Session {
   // Outliving instance: $watch/$watchEffect register in the
   // instance's lazy effectScope — there is no component scope here
   // to reap plain watch.
+  // WATCHERS live behind a method, not inline in the constructor —
+  // the constructor calls it once, and the instance can RESTART its
+  // watchers after a keep-state stop (see suspend() below).
   constructor() {
+    this.startWatchers();
+    // If constructed INSIDE some scope, auto-wire teardown instead:
+    //   getCurrentScope() && onScopeDispose(() => this.$stopEffects());
+  }
+
+  startWatchers() {
     this.$watch(
       () => this.user.value,
       (user, previousUser) => this.onUserChanged(user, previousUser),
     );
     this.$watchEffect(() => this.persist());
-    // If constructed INSIDE some scope, auto-wire teardown instead:
-    //   getCurrentScope() && onScopeDispose(() => this.$stopEffects());
+  }
+
+  // SUSPEND / RESUME: { reset: false } stops the watchers ONLY — every
+  // cached cell survives with its current value. startWatchers() in a
+  // fresh scope resumes. (Default $stopEffects() also CLEARS the cells:
+  // the next touch re-runs initializers — disposal is a reset.)
+  suspend() {
+    this.$stopEffects({ reset: false });
+  }
+  resume() {
+    this.startWatchers();
   }
 
   // CLEANUP composes as an ORDINARY method — no hooks, no reserved
@@ -490,7 +508,11 @@ until mount — use `?.` in watch getters).
   its leaf reads subscribe directly (non-intuitive but structural).
 - The source MUST be the FUNCTION form. `watch(instance.plainGetter, cb)` passes a
   dead snapshot and never fires.
-- `$stopEffects()` stops the instance scope and clears cached Refs/Computeds;
+- `$stopEffects()` stops the instance scope and clears cached Refs/Computeds
+  (the next touch re-materializes — disposal is a reset);
+  `$stopEffects({ reset: false })` stops the WATCHERS only — every cached
+  cell survives with its current value, and `startWatchers()` in a fresh
+  scope resumes (the suspend/resume pattern above);
   instances that never `$watch` allocate no scope. There are NO hooks — richer
   cleanup is an ordinary method that does its work and then calls
   `$stopEffects()` itself. Every outliving instance needs an OWNER that calls