sibujs 4.4.0 → 4.5.0

package/dist/index.d.cts

@@ -1,5 +1,5 @@
-import { N as NodeChild, a as NodeChildren, T as TagProps } from './tagFactory-Bzupt4Pj.cjs';
-export { D as Dispose, S as SVG_NS, t as tagFactory } from './tagFactory-Bzupt4Pj.cjs';
+import { N as NodeChild, a as NodeChildren, T as TagProps, A as Accessor, D as DerivedAccessor } from './tagFactory-DVoDpHye.cjs';
+export { b as Dispose, E as ExternalSource, S as SVG_NS, c as SignalOptions, d as derived, e as external, s as signal, t as tagFactory } from './tagFactory-DVoDpHye.cjs';
 export { T as TrustedHTML, t as trustHTML } from './ssr-BiPRdZ6n.cjs';
 import { R as ReactiveSignal } from './signal-BnWpq6WB.cjs';
 
@@ -667,12 +667,22 @@ declare function DynamicComponent(is: () => string | Component$1): HTMLElement;
  * assigns that row a new item or position.
  *
  * Identity is not value freshness: a row keeps its DOM node when its key is
- * unchanged, and still updates its contents when the item behind that key is
- * replaced.
- *
- * Reading `item()` subscribes to the ROW's cell, not to the whole-array signal,
- * so a row only re-renders when its own item/index actually changes — mutating
- * an unrelated row does not disturb it.
+ * unchanged, and its bindings still update when the item behind that key is
+ * replaced — provided they read the getter rather than a value captured when
+ * `render` ran.
+ *
+ * `render` runs untracked, whether the row appears in the first pass or in a
+ * later update: a signal read directly in its body — `item()` and `index()`
+ * included — is a one-time read that never subscribes anything and goes stale
+ * when the key later receives a replacement item or moves. Pass the getters
+ * down (`Row({ item, index })`) or read them inside bindings
+ * (`() => item().name`) and effects created by the row.
+ *
+ * A binding that reads `item()` subscribes to the ROW's cell, not to the
+ * whole-array signal. `render` never re-runs for an existing key; only the
+ * bindings and effects that read that row's `item()` / `index()` re-run, and
+ * only when its own item or position actually changes — mutating an unrelated
+ * row does not disturb it.
  *
  * @param getArray A reactive getter returning an array.
  * @param render A function that receives reactive item and index getters and returns a NodeChild.
@@ -1199,106 +1209,6 @@ type Slots = Record<string, SlotFn>;
  */
 declare function getSlot(slots: Slots | undefined, name?: string): SlotFn | undefined;
 
-declare const __accessor: unique symbol;
-/**
- * A reactive signal getter returned by signal(), derived(), and similar primitives.
- *
- * Pass an Accessor directly into reactive prop positions — never call it there:
- * ```ts
- * const [count, setCount] = signal(0);
- *
- * div(count)                       // ✓ reactive — Accessor passed directly
- * div(() => count())               // ✓ reactive — explicit arrow wrapper
- * div(count())                     // ✗ static  — evaluated once, not reactive
- * ```
- */
-type Accessor<T> = (() => T) & {
-    readonly [__accessor]?: never;
-};
-type SetState<T> = (next: T | ((prev: T) => T)) => void;
-type StateTuple<T> = [Accessor<T>, SetState<T>];
-/** Options for signal */
-interface SignalOptions<T = unknown> {
-    /** Debug name for devtools inspection. Only used in development. */
-    name?: string;
-    /** Custom equality function. Defaults to Object.is(). */
-    equals?: (prev: T, next: T) => boolean;
-}
-/**
- * signal creates a reactive signal that holds a value of type T.
- * Returns a tuple: [getter, setter].
- *
- * @param initial Initial value
- * @param options Optional config: `{ name: "count" }` for devtools labeling
- * @returns A `[getter, setter]` tuple. Calling the getter inside a reactive
- * context subscribes to the signal; the setter accepts a value or an updater.
- */
-declare function signal<T>(initial: T, options?: SignalOptions<T>): StateTuple<T>;
-/**
- * A valueless reactive token standing in for state SibuJS does not own.
- *
- * See {@link external}.
- */
-interface ExternalSource {
-    /**
-     * Declare, from inside a reactive computation, that it reads the external
-     * state this source represents. Call it in the same places you would read a
-     * signal — the top of a binding getter, a `derived()` body, an `effect()`.
-     *
-     * Outside a tracking context it is a no-op, exactly like reading a signal.
-     */
-    track(): void;
-    /**
-     * Declare that the external state changed. Every consumer that called
-     * {@link ExternalSource.track} is invalidated.
-     *
-     * Participates in `batch()` like any signal write: inside a batch, consumers
-     * are notified once when the outermost batch flushes.
-     */
-    invalidate(): void;
-}
-/**
- * Create a reactive source for state that lives outside SibuJS — a domain
- * engine, a media element, a canvas scene, an editor document, a cache a
- * socket writes into.
- *
- * The pattern is two lines: `track()` where you read, `invalidate()` after you
- * mutate.
- *
- * ```ts
- * import { Chess } from "chess.js";
- * import { external } from "sibujs";
- *
- * const game = new Chess();      // owns the rules and the mutable state
- * const moved = external();      // owns "something changed"
- *
- * ctx.text("@status", () => {
- *   moved.track();               // this binding reads the engine
- *   return game.isCheckmate() ? "Checkmate" : `${game.turn()} to move`;
- * });
- *
- * game.move({ from: "e2", to: "e4" });
- * moved.invalidate();            // every consumer above re-reads
- * ```
- *
- * **One source is one invalidation domain.** Every consumer of a source
- * re-runs on every `invalidate()`, so the granularity of your updates is
- * exactly the granularity of your sources: one for a whole engine is the
- * cheapest to write, several (`board`, `clock`, `history`) let an update touch
- * only what it affects. See `docs/architecture/external-state.md` for the
- * trade-offs and when subdividing is worth it.
- *
- * Ownership, disposal and error routing are the consumer's, not the source's:
- * a disposed binding or effect is never invalidated, and a consumer that
- * throws is reported through the normal runtime error pipeline with its own
- * phase and node.
- *
- * @param options `name` labels the source in devtools (development only).
- */
-declare function external(options?: {
-    name?: string;
-}): ExternalSource;
-
 /**
  * Reactive array hook. Provides common array operations that
  * automatically trigger reactive updates.
@@ -1498,45 +1408,6 @@ declare function deepEqual(a: unknown, b: unknown, seen?: Map<object, Set<object
  */
 declare function deepSignal<T>(initial: T): [Accessor<T>, (next: T | ((prev: T) => T)) => void];
 
-/**
- * derived creates a derived reactive signal whose value updates when dependencies change.
- *
- * Uses lazy pull-based evaluation with a single dirty flag:
- * - When a dependency changes, the computed is marked dirty (no re-evaluation).
- * - Dirtiness propagates downstream via propagateDirty.
- * - The getter only re-evaluates when actually read (pull-based).
- * - On re-evaluation, dependencies are re-tracked via retrack() so that
- *   derived-of-derived chains propagate correctly without paying the full
- *   Set-delete + re-add cost of track()'s cleanup phase.
- *
- * STABILIZATION — why a dirty flag is enough:
- *
- * A dirty computed does NOT imply a changed value. Downstream effects are
- * enqueued by `propagateDirty` at write time, before this computed has had a
- * chance to recompute and compare. Rather than adding a three-color
- * (CLEAN/CHECK/DIRTY) propagation pass — which an earlier revision measured as
- * a regression on every benchmark, because the extra state has nothing to skip
- * when values genuinely change — the engine settles the question lazily at
- * DRAIN time: `cs._validate` recomputes a dirty computed and `cs.__v` is bumped
- * ONLY when the new value differs under this computed's comparator. The
- * scheduler compares that version against what each subscriber last observed
- * and suppresses the run when nothing changed (see `depsChanged` in
- * ../../reactivity/track-core.ts).
- *
- * That keeps the cheap boolean dirty flag AND makes `equals` actually stop
- * propagation, with recomputation still fully lazy: `_validate` only ever runs
- * when an effect is genuinely about to observe the value.
- *
- * @returns An accessor for the computed value. It recomputes lazily on read
- * after any dependency changes.
- */
-declare function derived<T>(getter: () => T, options?: {
-    name?: string;
-    /** Custom equality — when the recomputed value equals the previous,
-     *  downstream subscribers are not notified. Defaults to `Object.is`. */
-    equals?: (a: T, b: T) => boolean;
-}): Accessor<T>;
-
 /** Options for effect */
 interface EffectOptions {
     /** Error handler for exceptions thrown during effect execution. */
@@ -1668,7 +1539,9 @@ declare function watch<T>(getter: () => T, callback: (value: T, prev: T | undefi
  * dependency-tracked). The setter typically updates upstream signals,
  * and the derived value recomputes on the next read.
  *
- * Returns a `[getter, setter]` tuple, matching the `signal()` API.
+ * Returns a `[getter, setter]` tuple, matching the `signal()` API. The getter
+ * is the underlying `derived()` accessor, so `getter.dispose()` releases its
+ * upstream subscriptions when the writable is discarded before its sources.
  *
  * @param get Computed getter — reads reactive dependencies
  * @param set Setter — called with the new value, typically updates upstream signals
@@ -1695,11 +1568,11 @@ declare function watch<T>(getter: () => T, callback: (value: T, prev: T | undefi
  * fullName();              // "Jane Smith"
  * ```
  *
- * @returns A store handle with `subscribe`, `set` and `update`.
+ * @returns A `[getter, setter]` tuple; the getter carries `dispose()`.
  */
 declare function writable<T>(get: () => T, set: (value: T) => void, options?: {
     name?: string;
-}): [Accessor<T>, (value: T) => void];
+}): [DerivedAccessor<T>, (value: T) => void];
 
 /**
  * SSR context for SibuJS.
@@ -2306,4 +2179,4 @@ declare const untracked: ReactiveApi["untracked"];
 declare const retrack: ReactiveApi["retrack"];
 declare const setMaxDrainIterations: ReactiveApi["setMaxDrainIterations"];
 
-export { type Accessor, type ActionFn, type AnchorProps, type ArrayActions, type AsyncDerivedContext, type AsyncDerivedState, type AudioProps, type ButtonProps, type Context, DynamicComponent, type EachBindings, type EachEventBindings, type EffectBody, type EffectOptions, type EnhanceContext, type EnhanceSetup, ErrorBoundary, type ErrorBoundaryOptions, type ErrorBoundaryProps, ErrorDisplay, type ErrorDisplayProps, type ErrorSeverity, type ExternalSource, type FormProps, Fragment, type ImgProps, type InputProps, type InputType, type IslandLoader, type IslandRegistration, type IslandStrategy, KeepAlive, type KeepAliveOptions, type LabelProps, type LazyIslandLoader, Loading, type LoadingProps, type LongPressOptions, MAX_DRAIN_TEARDOWNS, type MediaProps, type MountIslandsOptions, NodeChild, NodeChildren, type OnCleanup, type OptionProps, Portal, type Ref, type RuntimeErrorContext, type RuntimeErrorHandler, type RuntimeErrorPhase, type SSRStore, type SelectProps, type SignalOptions, type SlotFn, type Slots, type StoreActions, Suspense, type SuspenseProps, TagProps, type TextareaProps, type TypedTagFunction, type VideoProps, __resetIdCounter, a, abbr, action, address, area, array, article, aside, asyncDerived, audio, autoResize, b, base, batch, bdi, bdo, bindDynamic, blockquote, body, br, button, canvas, caption, catchError, catchErrorAsync, center, checkLeaks, circle, cite, clickOutside, clipPath, code, col, colgroup, context, copyOnClick, createId, customElement, data, datalist, dd, deepEqual, deepSignal, defer, defs, del, derived, details, dfn, dialog, disableSSR, dispose, div, dl, dt, each, effect, ellipse, em, embed, enableSSR, enhance, enhanceAll, enqueueBatchedSignal, external, fieldset, figcaption, figure, font, footer, form, g, getAction, getRequestScopedCache, getRuntimeErrorHandler, getSSRStore, getSlot, h1, h2, h3, h4, h5, h6, head, header, hr, html, i, iframe, img, input, ins, isBatching, isSSR, kbd, label, lazy, lazyIsland, legend, li, line, linearGradient, link, longPress, main, map, mark, marker, marquee, mask, match, math, menu, meta, meter, mount, mountIslands, nav, nextTick, noscript, object, ol, on, onCleanup, onMount, onUnmount, optgroup, option, output, p, param, path, pattern, picture, polygon, polyline, portal, pre, progress, q, radialGradient, reactiveArray, rect, ref, registerAction, registerComponent, registerDisposer, registerIsland, replaceChildrenSafely, reportDrainRunaway, reportError, resolveComponent, retrack, rp, rt, ruby, runInSSRContext, s, samp, script, section, select, setGlobalErrorHandler, setMaxDrainIterations, setRuntimeErrorHandler, show, signal, slot, small, source, span, stop, store, strict, strictEffect, strong, style, sub, summary, sup, svg, symbol, table, takePendingError, tbody, td, template, text, textarea, tfoot, th, thead, time, title, tr, track$1 as track, transition, trapFocus, tspan, u, ul, unregisterComponent, unregisterDisposer, unregisterIsland, untracked, use, var_, video, watch, when, withSSR, writable };
+export { Accessor, type ActionFn, type AnchorProps, type ArrayActions, type AsyncDerivedContext, type AsyncDerivedState, type AudioProps, type ButtonProps, type Context, DerivedAccessor, DynamicComponent, type EachBindings, type EachEventBindings, type EffectBody, type EffectOptions, type EnhanceContext, type EnhanceSetup, ErrorBoundary, type ErrorBoundaryOptions, type ErrorBoundaryProps, ErrorDisplay, type ErrorDisplayProps, type ErrorSeverity, type FormProps, Fragment, type ImgProps, type InputProps, type InputType, type IslandLoader, type IslandRegistration, type IslandStrategy, KeepAlive, type KeepAliveOptions, type LabelProps, type LazyIslandLoader, Loading, type LoadingProps, type LongPressOptions, MAX_DRAIN_TEARDOWNS, type MediaProps, type MountIslandsOptions, NodeChild, NodeChildren, type OnCleanup, type OptionProps, Portal, type Ref, type RuntimeErrorContext, type RuntimeErrorHandler, type RuntimeErrorPhase, type SSRStore, type SelectProps, type SlotFn, type Slots, type StoreActions, Suspense, type SuspenseProps, TagProps, type TextareaProps, type TypedTagFunction, type VideoProps, __resetIdCounter, a, abbr, action, address, area, array, article, aside, asyncDerived, audio, autoResize, b, base, batch, bdi, bdo, bindDynamic, blockquote, body, br, button, canvas, caption, catchError, catchErrorAsync, center, checkLeaks, circle, cite, clickOutside, clipPath, code, col, colgroup, context, copyOnClick, createId, customElement, data, datalist, dd, deepEqual, deepSignal, defer, defs, del, details, dfn, dialog, disableSSR, dispose, div, dl, dt, each, effect, ellipse, em, embed, enableSSR, enhance, enhanceAll, enqueueBatchedSignal, fieldset, figcaption, figure, font, footer, form, g, getAction, getRequestScopedCache, getRuntimeErrorHandler, getSSRStore, getSlot, h1, h2, h3, h4, h5, h6, head, header, hr, html, i, iframe, img, input, ins, isBatching, isSSR, kbd, label, lazy, lazyIsland, legend, li, line, linearGradient, link, longPress, main, map, mark, marker, marquee, mask, match, math, menu, meta, meter, mount, mountIslands, nav, nextTick, noscript, object, ol, on, onCleanup, onMount, onUnmount, optgroup, option, output, p, param, path, pattern, picture, polygon, polyline, portal, pre, progress, q, radialGradient, reactiveArray, rect, ref, registerAction, registerComponent, registerDisposer, registerIsland, replaceChildrenSafely, reportDrainRunaway, reportError, resolveComponent, retrack, rp, rt, ruby, runInSSRContext, s, samp, script, section, select, setGlobalErrorHandler, setMaxDrainIterations, setRuntimeErrorHandler, show, slot, small, source, span, stop, store, strict, strictEffect, strong, style, sub, summary, sup, svg, symbol, table, takePendingError, tbody, td, template, text, textarea, tfoot, th, thead, time, title, tr, track$1 as track, transition, trapFocus, tspan, u, ul, unregisterComponent, unregisterDisposer, unregisterIsland, untracked, use, var_, video, watch, when, withSSR, writable };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { N as NodeChild, a as NodeChildren, T as TagProps } from './tagFactory-Bzupt4Pj.js';
-export { D as Dispose, S as SVG_NS, t as tagFactory } from './tagFactory-Bzupt4Pj.js';
+import { N as NodeChild, a as NodeChildren, T as TagProps, A as Accessor, D as DerivedAccessor } from './tagFactory-DVoDpHye.js';
+export { b as Dispose, E as ExternalSource, S as SVG_NS, c as SignalOptions, d as derived, e as external, s as signal, t as tagFactory } from './tagFactory-DVoDpHye.js';
 export { T as TrustedHTML, t as trustHTML } from './ssr-BiPRdZ6n.js';
 import { R as ReactiveSignal } from './signal-BnWpq6WB.js';
 
@@ -667,12 +667,22 @@ declare function DynamicComponent(is: () => string | Component$1): HTMLElement;
  * assigns that row a new item or position.
  *
  * Identity is not value freshness: a row keeps its DOM node when its key is
- * unchanged, and still updates its contents when the item behind that key is
- * replaced.
- *
- * Reading `item()` subscribes to the ROW's cell, not to the whole-array signal,
- * so a row only re-renders when its own item/index actually changes — mutating
- * an unrelated row does not disturb it.
+ * unchanged, and its bindings still update when the item behind that key is
+ * replaced — provided they read the getter rather than a value captured when
+ * `render` ran.
+ *
+ * `render` runs untracked, whether the row appears in the first pass or in a
+ * later update: a signal read directly in its body — `item()` and `index()`
+ * included — is a one-time read that never subscribes anything and goes stale
+ * when the key later receives a replacement item or moves. Pass the getters
+ * down (`Row({ item, index })`) or read them inside bindings
+ * (`() => item().name`) and effects created by the row.
+ *
+ * A binding that reads `item()` subscribes to the ROW's cell, not to the
+ * whole-array signal. `render` never re-runs for an existing key; only the
+ * bindings and effects that read that row's `item()` / `index()` re-run, and
+ * only when its own item or position actually changes — mutating an unrelated
+ * row does not disturb it.
  *
  * @param getArray A reactive getter returning an array.
  * @param render A function that receives reactive item and index getters and returns a NodeChild.
@@ -1199,106 +1209,6 @@ type Slots = Record<string, SlotFn>;
  */
 declare function getSlot(slots: Slots | undefined, name?: string): SlotFn | undefined;
 
-declare const __accessor: unique symbol;
-/**
- * A reactive signal getter returned by signal(), derived(), and similar primitives.
- *
- * Pass an Accessor directly into reactive prop positions — never call it there:
- * ```ts
- * const [count, setCount] = signal(0);
- *
- * div(count)                       // ✓ reactive — Accessor passed directly
- * div(() => count())               // ✓ reactive — explicit arrow wrapper
- * div(count())                     // ✗ static  — evaluated once, not reactive
- * ```
- */
-type Accessor<T> = (() => T) & {
-    readonly [__accessor]?: never;
-};
-type SetState<T> = (next: T | ((prev: T) => T)) => void;
-type StateTuple<T> = [Accessor<T>, SetState<T>];
-/** Options for signal */
-interface SignalOptions<T = unknown> {
-    /** Debug name for devtools inspection. Only used in development. */
-    name?: string;
-    /** Custom equality function. Defaults to Object.is(). */
-    equals?: (prev: T, next: T) => boolean;
-}
-/**
- * signal creates a reactive signal that holds a value of type T.
- * Returns a tuple: [getter, setter].
- *
- * @param initial Initial value
- * @param options Optional config: `{ name: "count" }` for devtools labeling
- * @returns A `[getter, setter]` tuple. Calling the getter inside a reactive
- * context subscribes to the signal; the setter accepts a value or an updater.
- */
-declare function signal<T>(initial: T, options?: SignalOptions<T>): StateTuple<T>;
-/**
- * A valueless reactive token standing in for state SibuJS does not own.
- *
- * See {@link external}.
- */
-interface ExternalSource {
-    /**
-     * Declare, from inside a reactive computation, that it reads the external
-     * state this source represents. Call it in the same places you would read a
-     * signal — the top of a binding getter, a `derived()` body, an `effect()`.
-     *
-     * Outside a tracking context it is a no-op, exactly like reading a signal.
-     */
-    track(): void;
-    /**
-     * Declare that the external state changed. Every consumer that called
-     * {@link ExternalSource.track} is invalidated.
-     *
-     * Participates in `batch()` like any signal write: inside a batch, consumers
-     * are notified once when the outermost batch flushes.
-     */
-    invalidate(): void;
-}
-/**
- * Create a reactive source for state that lives outside SibuJS — a domain
- * engine, a media element, a canvas scene, an editor document, a cache a
- * socket writes into.
- *
- * The pattern is two lines: `track()` where you read, `invalidate()` after you
- * mutate.
- *
- * ```ts
- * import { Chess } from "chess.js";
- * import { external } from "sibujs";
- *
- * const game = new Chess();      // owns the rules and the mutable state
- * const moved = external();      // owns "something changed"
- *
- * ctx.text("@status", () => {
- *   moved.track();               // this binding reads the engine
- *   return game.isCheckmate() ? "Checkmate" : `${game.turn()} to move`;
- * });
- *
- * game.move({ from: "e2", to: "e4" });
- * moved.invalidate();            // every consumer above re-reads
- * ```
- *
- * **One source is one invalidation domain.** Every consumer of a source
- * re-runs on every `invalidate()`, so the granularity of your updates is
- * exactly the granularity of your sources: one for a whole engine is the
- * cheapest to write, several (`board`, `clock`, `history`) let an update touch
- * only what it affects. See `docs/architecture/external-state.md` for the
- * trade-offs and when subdividing is worth it.
- *
- * Ownership, disposal and error routing are the consumer's, not the source's:
- * a disposed binding or effect is never invalidated, and a consumer that
- * throws is reported through the normal runtime error pipeline with its own
- * phase and node.
- *
- * @param options `name` labels the source in devtools (development only).
- */
-declare function external(options?: {
-    name?: string;
-}): ExternalSource;
-
 /**
  * Reactive array hook. Provides common array operations that
  * automatically trigger reactive updates.
@@ -1498,45 +1408,6 @@ declare function deepEqual(a: unknown, b: unknown, seen?: Map<object, Set<object
  */
 declare function deepSignal<T>(initial: T): [Accessor<T>, (next: T | ((prev: T) => T)) => void];
 
-/**
- * derived creates a derived reactive signal whose value updates when dependencies change.
- *
- * Uses lazy pull-based evaluation with a single dirty flag:
- * - When a dependency changes, the computed is marked dirty (no re-evaluation).
- * - Dirtiness propagates downstream via propagateDirty.
- * - The getter only re-evaluates when actually read (pull-based).
- * - On re-evaluation, dependencies are re-tracked via retrack() so that
- *   derived-of-derived chains propagate correctly without paying the full
- *   Set-delete + re-add cost of track()'s cleanup phase.
- *
- * STABILIZATION — why a dirty flag is enough:
- *
- * A dirty computed does NOT imply a changed value. Downstream effects are
- * enqueued by `propagateDirty` at write time, before this computed has had a
- * chance to recompute and compare. Rather than adding a three-color
- * (CLEAN/CHECK/DIRTY) propagation pass — which an earlier revision measured as
- * a regression on every benchmark, because the extra state has nothing to skip
- * when values genuinely change — the engine settles the question lazily at
- * DRAIN time: `cs._validate` recomputes a dirty computed and `cs.__v` is bumped
- * ONLY when the new value differs under this computed's comparator. The
- * scheduler compares that version against what each subscriber last observed
- * and suppresses the run when nothing changed (see `depsChanged` in
- * ../../reactivity/track-core.ts).
- *
- * That keeps the cheap boolean dirty flag AND makes `equals` actually stop
- * propagation, with recomputation still fully lazy: `_validate` only ever runs
- * when an effect is genuinely about to observe the value.
- *
- * @returns An accessor for the computed value. It recomputes lazily on read
- * after any dependency changes.
- */
-declare function derived<T>(getter: () => T, options?: {
-    name?: string;
-    /** Custom equality — when the recomputed value equals the previous,
-     *  downstream subscribers are not notified. Defaults to `Object.is`. */
-    equals?: (a: T, b: T) => boolean;
-}): Accessor<T>;
-
 /** Options for effect */
 interface EffectOptions {
     /** Error handler for exceptions thrown during effect execution. */
@@ -1668,7 +1539,9 @@ declare function watch<T>(getter: () => T, callback: (value: T, prev: T | undefi
  * dependency-tracked). The setter typically updates upstream signals,
  * and the derived value recomputes on the next read.
  *
- * Returns a `[getter, setter]` tuple, matching the `signal()` API.
+ * Returns a `[getter, setter]` tuple, matching the `signal()` API. The getter
+ * is the underlying `derived()` accessor, so `getter.dispose()` releases its
+ * upstream subscriptions when the writable is discarded before its sources.
  *
  * @param get Computed getter — reads reactive dependencies
  * @param set Setter — called with the new value, typically updates upstream signals
@@ -1695,11 +1568,11 @@ declare function watch<T>(getter: () => T, callback: (value: T, prev: T | undefi
  * fullName();              // "Jane Smith"
  * ```
  *
- * @returns A store handle with `subscribe`, `set` and `update`.
+ * @returns A `[getter, setter]` tuple; the getter carries `dispose()`.
  */
 declare function writable<T>(get: () => T, set: (value: T) => void, options?: {
     name?: string;
-}): [Accessor<T>, (value: T) => void];
+}): [DerivedAccessor<T>, (value: T) => void];
 
 /**
  * SSR context for SibuJS.
@@ -2306,4 +2179,4 @@ declare const untracked: ReactiveApi["untracked"];
 declare const retrack: ReactiveApi["retrack"];
 declare const setMaxDrainIterations: ReactiveApi["setMaxDrainIterations"];
 
-export { type Accessor, type ActionFn, type AnchorProps, type ArrayActions, type AsyncDerivedContext, type AsyncDerivedState, type AudioProps, type ButtonProps, type Context, DynamicComponent, type EachBindings, type EachEventBindings, type EffectBody, type EffectOptions, type EnhanceContext, type EnhanceSetup, ErrorBoundary, type ErrorBoundaryOptions, type ErrorBoundaryProps, ErrorDisplay, type ErrorDisplayProps, type ErrorSeverity, type ExternalSource, type FormProps, Fragment, type ImgProps, type InputProps, type InputType, type IslandLoader, type IslandRegistration, type IslandStrategy, KeepAlive, type KeepAliveOptions, type LabelProps, type LazyIslandLoader, Loading, type LoadingProps, type LongPressOptions, MAX_DRAIN_TEARDOWNS, type MediaProps, type MountIslandsOptions, NodeChild, NodeChildren, type OnCleanup, type OptionProps, Portal, type Ref, type RuntimeErrorContext, type RuntimeErrorHandler, type RuntimeErrorPhase, type SSRStore, type SelectProps, type SignalOptions, type SlotFn, type Slots, type StoreActions, Suspense, type SuspenseProps, TagProps, type TextareaProps, type TypedTagFunction, type VideoProps, __resetIdCounter, a, abbr, action, address, area, array, article, aside, asyncDerived, audio, autoResize, b, base, batch, bdi, bdo, bindDynamic, blockquote, body, br, button, canvas, caption, catchError, catchErrorAsync, center, checkLeaks, circle, cite, clickOutside, clipPath, code, col, colgroup, context, copyOnClick, createId, customElement, data, datalist, dd, deepEqual, deepSignal, defer, defs, del, derived, details, dfn, dialog, disableSSR, dispose, div, dl, dt, each, effect, ellipse, em, embed, enableSSR, enhance, enhanceAll, enqueueBatchedSignal, external, fieldset, figcaption, figure, font, footer, form, g, getAction, getRequestScopedCache, getRuntimeErrorHandler, getSSRStore, getSlot, h1, h2, h3, h4, h5, h6, head, header, hr, html, i, iframe, img, input, ins, isBatching, isSSR, kbd, label, lazy, lazyIsland, legend, li, line, linearGradient, link, longPress, main, map, mark, marker, marquee, mask, match, math, menu, meta, meter, mount, mountIslands, nav, nextTick, noscript, object, ol, on, onCleanup, onMount, onUnmount, optgroup, option, output, p, param, path, pattern, picture, polygon, polyline, portal, pre, progress, q, radialGradient, reactiveArray, rect, ref, registerAction, registerComponent, registerDisposer, registerIsland, replaceChildrenSafely, reportDrainRunaway, reportError, resolveComponent, retrack, rp, rt, ruby, runInSSRContext, s, samp, script, section, select, setGlobalErrorHandler, setMaxDrainIterations, setRuntimeErrorHandler, show, signal, slot, small, source, span, stop, store, strict, strictEffect, strong, style, sub, summary, sup, svg, symbol, table, takePendingError, tbody, td, template, text, textarea, tfoot, th, thead, time, title, tr, track$1 as track, transition, trapFocus, tspan, u, ul, unregisterComponent, unregisterDisposer, unregisterIsland, untracked, use, var_, video, watch, when, withSSR, writable };
+export { Accessor, type ActionFn, type AnchorProps, type ArrayActions, type AsyncDerivedContext, type AsyncDerivedState, type AudioProps, type ButtonProps, type Context, DerivedAccessor, DynamicComponent, type EachBindings, type EachEventBindings, type EffectBody, type EffectOptions, type EnhanceContext, type EnhanceSetup, ErrorBoundary, type ErrorBoundaryOptions, type ErrorBoundaryProps, ErrorDisplay, type ErrorDisplayProps, type ErrorSeverity, type FormProps, Fragment, type ImgProps, type InputProps, type InputType, type IslandLoader, type IslandRegistration, type IslandStrategy, KeepAlive, type KeepAliveOptions, type LabelProps, type LazyIslandLoader, Loading, type LoadingProps, type LongPressOptions, MAX_DRAIN_TEARDOWNS, type MediaProps, type MountIslandsOptions, NodeChild, NodeChildren, type OnCleanup, type OptionProps, Portal, type Ref, type RuntimeErrorContext, type RuntimeErrorHandler, type RuntimeErrorPhase, type SSRStore, type SelectProps, type SlotFn, type Slots, type StoreActions, Suspense, type SuspenseProps, TagProps, type TextareaProps, type TypedTagFunction, type VideoProps, __resetIdCounter, a, abbr, action, address, area, array, article, aside, asyncDerived, audio, autoResize, b, base, batch, bdi, bdo, bindDynamic, blockquote, body, br, button, canvas, caption, catchError, catchErrorAsync, center, checkLeaks, circle, cite, clickOutside, clipPath, code, col, colgroup, context, copyOnClick, createId, customElement, data, datalist, dd, deepEqual, deepSignal, defer, defs, del, details, dfn, dialog, disableSSR, dispose, div, dl, dt, each, effect, ellipse, em, embed, enableSSR, enhance, enhanceAll, enqueueBatchedSignal, fieldset, figcaption, figure, font, footer, form, g, getAction, getRequestScopedCache, getRuntimeErrorHandler, getSSRStore, getSlot, h1, h2, h3, h4, h5, h6, head, header, hr, html, i, iframe, img, input, ins, isBatching, isSSR, kbd, label, lazy, lazyIsland, legend, li, line, linearGradient, link, longPress, main, map, mark, marker, marquee, mask, match, math, menu, meta, meter, mount, mountIslands, nav, nextTick, noscript, object, ol, on, onCleanup, onMount, onUnmount, optgroup, option, output, p, param, path, pattern, picture, polygon, polyline, portal, pre, progress, q, radialGradient, reactiveArray, rect, ref, registerAction, registerComponent, registerDisposer, registerIsland, replaceChildrenSafely, reportDrainRunaway, reportError, resolveComponent, retrack, rp, rt, ruby, runInSSRContext, s, samp, script, section, select, setGlobalErrorHandler, setMaxDrainIterations, setRuntimeErrorHandler, show, slot, small, source, span, stop, store, strict, strictEffect, strong, style, sub, summary, sup, svg, symbol, table, takePendingError, tbody, td, template, text, textarea, tfoot, th, thead, time, title, tr, track$1 as track, transition, trapFocus, tspan, u, ul, unregisterComponent, unregisterDisposer, unregisterIsland, untracked, use, var_, video, watch, when, withSSR, writable };

package/dist/index.js

@@ -52,7 +52,7 @@ import {
   unregisterIsland,
   when,
   writable
-} from "./chunk-ADM46X22.js";
+} from "./chunk-S373NSMK.js";
 import {
   a,
   abbr,
@@ -190,36 +190,36 @@ import {
   use,
   var_,
   video
-} from "./chunk-36S2YPP4.js";
+} from "./chunk-PCT43HW3.js";
 import {
   trustHTML
 } from "./chunk-NIOYEGBQ.js";
 import {
   watch
-} from "./chunk-RR7M3FHM.js";
+} from "./chunk-7LN645I6.js";
 import {
   __resetIdCounter,
   createId
 } from "./chunk-CCSJMTRN.js";
 import {
   context
-} from "./chunk-7NBDXVHS.js";
+} from "./chunk-VUF4ALSW.js";
 import {
   SVG_NS,
   tagFactory
-} from "./chunk-PNIRUQ4C.js";
+} from "./chunk-KEISJXBU.js";
 import {
   bindDynamic
-} from "./chunk-VCTAEPSB.js";
+} from "./chunk-ONOHFDLG.js";
 import {
   derived
-} from "./chunk-W2EQ7X2L.js";
+} from "./chunk-RBTPLM32.js";
 import "./chunk-IXKSNWV5.js";
 import "./chunk-7ZHH77QA.js";
 import {
   effect,
   on
-} from "./chunk-7GIHSAWB.js";
+} from "./chunk-RIXRAYIU.js";
 import {
   disableSSR,
   enableSSR,
@@ -244,12 +244,12 @@ import {
   external,
   isBatching,
   signal
-} from "./chunk-NVNJH22U.js";
+} from "./chunk-XZZOBQAY.js";
 import {
   retrack,
   setMaxDrainIterations,
   untracked
-} from "./chunk-3BTTCZ5J.js";
+} from "./chunk-UGRX3S57.js";
 import {
   getRuntimeErrorHandler,
   reportError,

package/dist/motion.cjs

@@ -391,6 +391,15 @@ function untracked(fn) {
 var subscriberEpochCounter = 0;
 function retrack(effectFn, subscriber) {
   const prev = currentSubscriber;
+  let savedDepth = 0;
+  let savedSuspendSub = null;
+  if (trackingSuspended) {
+    savedDepth = suspendDepth;
+    savedSuspendSub = suspendSavedSub;
+    suspendDepth = 0;
+    suspendSavedSub = null;
+    trackingSuspended = false;
+  }
   currentSubscriber = subscriber;
   const sub = subscriber;
   const epoch = ++subscriberEpochCounter;
@@ -405,6 +414,11 @@ function retrack(effectFn, subscriber) {
     effectFn();
   } finally {
     currentSubscriber = prev;
+    if (savedDepth !== 0) {
+      suspendDepth = savedDepth;
+      suspendSavedSub = savedSuspendSub;
+      trackingSuspended = true;
+    }
     let node = sub.depsHead ?? null;
     while (node !== null) {
       const next = node.subNext;
@@ -424,11 +438,25 @@ function track(effectFn, subscriber) {
   if (!subscriber) return reactiveBinding(effectFn);
   cleanup(subscriber);
   const prev = currentSubscriber;
+  let savedDepth = 0;
+  let savedSuspendSub = null;
+  if (trackingSuspended) {
+    savedDepth = suspendDepth;
+    savedSuspendSub = suspendSavedSub;
+    suspendDepth = 0;
+    suspendSavedSub = null;
+    trackingSuspended = false;
+  }
   currentSubscriber = subscriber;
   try {
     effectFn();
   } finally {
     currentSubscriber = prev;
+    if (savedDepth !== 0) {
+      suspendDepth = savedDepth;
+      suspendSavedSub = savedSuspendSub;
+      trackingSuspended = true;
+    }
     const sub2 = subscriber;
     for (let n = sub2.depsHead ?? null; n !== null; n = n.subNext) {
       const sig = n.sig;
@@ -599,8 +627,9 @@ function propagateDirty(sub) {
         if (s._c) {
           const nSig = s._sig;
           if (nSig) {
-            if (!nSig._d) {
+            if (!nSig._d || nSig._f === true) {
               nSig._d = true;
+              nSig._f = false;
               stack.push(nSig);
             }
           } else {
@@ -700,7 +729,7 @@ function forEachSubscriber(signal2, visit) {
 }
 
 // src/reactivity/track.ts
-var _runtimeVersion = true ? "4.4.0" : "dev";
+var _runtimeVersion = true ? "4.5.0" : "dev";
 var REGISTRY_KEY = /* @__PURE__ */ Symbol.for("sibujs.reactive.v1");
 function resolveReactiveApi() {
   const g = globalThis;

package/dist/motion.js

@@ -20,10 +20,10 @@ import {
   stagger,
   transition,
   viewTransition
-} from "./chunk-SKPTERHP.js";
+} from "./chunk-B3WHI2QA.js";
 import "./chunk-QKRPLZ2V.js";
-import "./chunk-NVNJH22U.js";
-import "./chunk-3BTTCZ5J.js";
+import "./chunk-XZZOBQAY.js";
+import "./chunk-UGRX3S57.js";
 import "./chunk-2WLZ6757.js";
 export {
   TransitionGroup,