@buoy-gg/network 7.0.12 → 7.0.13

package/lib/typescript/network/utils/networkSelectionStore.d.ts

@@ -0,0 +1,117 @@
+/**
+ * Which request the detail view is showing, and where it sits in the list —
+ * the prev/next CURSOR.
+ *
+ * ## Why this is a store and not `useState` in the modal
+ *
+ * It used to be `useState` in `NetworkModalInner`. Every tap on Previous/Next
+ * therefore dirtied the modal ROOT, which re-rendered `JsModal` (1833 lines,
+ * nine useStates, animations/gestures/persistence — and it can never bail out,
+ * because its `header` prop is a fresh object literal every render), the whole
+ * header, and all five screens. None of them care which request is selected;
+ * they only care THAT one is.
+ *
+ * This is the same argument `NetworkModal`'s own header comment already makes
+ * about network events ("with the subscription here, 15 events re-rendered
+ * JsModal + every header button 15×"). Stepping is that same class of
+ * high-frequency churn, and it was sitting in the same wrong place. Now the
+ * root subscribes to `hasSelection` — a boolean that flips twice a session —
+ * while the footer, the body and the header's pin actions subscribe to the
+ * parts they actually render.
+ *
+ * ## The three cursors
+ *
+ * `selectedId` is where the USER is. It moves on the tap, synchronously.
+ *
+ * `bodyId` is what the detail body is allowed to render, and it deliberately
+ * LAGS: drawing a request means handing its payload to the virtualized data
+ * viewer to flatten, and that has no business blocking the next tap. It
+ * catches up only once the selection has held still for `settleMs`, so a
+ * burst of taps renders the request you land on and none of the ones you flew
+ * past. (`useDeferredValue` was tried here first and is the wrong tool — it
+ * lowers the priority of that work without preventing it, so every settled
+ * step still queued a flatten and each one delayed the touch behind it.)
+ *
+ * `renderedId` is what actually made it to the screen, reported by the detail
+ * screen after commit. Nothing in the product reads it; it exists so the
+ * benchmark harness can measure "time until request N was really painted"
+ * separately from "time until the cursor reached N".
+ */
+import type { NetworkEvent } from "../types";
+export interface NetworkSelectionState {
+    /** Navigable order — exactly what the list screen renders. */
+    ids: readonly string[];
+    /** Cursor position in `ids`, or -1 when the selection isn't in the list. */
+    index: number;
+    /** Where the user is. Moves synchronously on tap. */
+    selectedId: string | null;
+    /** What the body may render. Lags `selectedId` by `settleMs`. */
+    bodyId: string | null;
+    /** What the body actually committed. Benchmark instrumentation only. */
+    renderedId: string | null;
+}
+export type NetworkSelectionSubscriber = (state: NetworkSelectionState) => void;
+/**
+ * How long the selection must hold still before the body renders it. Short
+ * enough that a single step reads as immediate (the footer and header have
+ * already moved), long enough that a burst collapses to one render.
+ */
+export declare const DEFAULT_SETTLE_MS = 120;
+declare class NetworkSelectionStore {
+    private ids;
+    private index;
+    private selectedId;
+    private bodyId;
+    private renderedId;
+    private settleMs;
+    private settleTimer;
+    private subscribers;
+    private snapshot;
+    private buildSnapshot;
+    /**
+     * One immutable snapshot per mutation, so subscribers can identity-compare
+     * and `useSyncExternalStore` stays happy.
+     */
+    private emit;
+    getState(): NetworkSelectionState;
+    subscribe(subscriber: NetworkSelectionSubscriber): () => void;
+    /**
+     * Publish the navigable order. Called by the stepper whenever its derived
+     * list changes (filter, search, pins, new requests arriving).
+     *
+     * The cursor is re-anchored BY ID, not by position: the live list is
+     * newest-first and new requests are prepended, so holding an index would
+     * silently slide the selection onto a different request every time one
+     * landed.
+     */
+    setIds(ids: readonly string[]): void;
+    select(id: string | null): void;
+    clear(): void;
+    /**
+     * Move the cursor. O(1) — the whole reason `index` is stored rather than
+     * re-derived with a `findIndex` on every render.
+     *
+     * Returns the id it landed on, or null if the move was out of bounds (the
+     * footer disables its arrows at the ends, but the benchmark driver calls
+     * this directly and needs to know when it has run off the end).
+     */
+    step(delta: number): string | null;
+    /**
+     * Opening and closing skip the settle delay: there is no in-flight render to
+     * protect on a null↔id transition, and waiting there just reads as a hang.
+     * Only id → id steps debounce.
+     */
+    private scheduleBody;
+    /** Benchmark toggle — `?settle=0` measures the gate's contribution. */
+    setSettleMs(ms: number): void;
+    getSettleMs(): number;
+    /** Reported by the detail screen after commit. Instrumentation only. */
+    reportRendered(id: string | null): void;
+    /** Test/bench helper — drop all cursor state without touching the events. */
+    reset(): void;
+}
+export declare const networkSelectionStore: NetworkSelectionStore;
+/** Convenience for publishing an event list as the navigable order. */
+export declare function toSelectionIds(events: readonly NetworkEvent[]): string[];
+export {};
+//# sourceMappingURL=networkSelectionStore.d.ts.map

package/lib/typescript/network/utils/networkSelectionStore.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"networkSelectionStore.d.ts","sourceRoot":"","sources":["../../../../src/network/utils/networkSelectionStore.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,WAAW,qBAAqB;IACpC,8DAA8D;IAC9D,GAAG,EAAE,SAAS,MAAM,EAAE,CAAC;IACvB,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,qDAAqD;IACrD,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,iEAAiE;IACjE,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,wEAAwE;IACxE,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAED,MAAM,MAAM,0BAA0B,GAAG,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;AAEhF;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,MAAM,CAAC;AAErC,cAAM,qBAAqB;IACzB,OAAO,CAAC,GAAG,CAAyB;IACpC,OAAO,CAAC,KAAK,CAAM;IACnB,OAAO,CAAC,UAAU,CAAuB;IACzC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,UAAU,CAAuB;IACzC,OAAO,CAAC,QAAQ,CAAqB;IACrC,OAAO,CAAC,WAAW,CAA8C;IACjE,OAAO,CAAC,WAAW,CAAyC;IAC5D,OAAO,CAAC,QAAQ,CAA+C;IAE/D,OAAO,CAAC,aAAa;IAUrB;;;OAGG;IACH,OAAO,CAAC,IAAI;IAKZ,QAAQ,IAAI,qBAAqB;IAIjC,SAAS,CAAC,UAAU,EAAE,0BAA0B,GAAG,MAAM,IAAI;IAO7D;;;;;;;;OAQG;IACH,MAAM,CAAC,GAAG,EAAE,SAAS,MAAM,EAAE,GAAG,IAAI;IAUpC,MAAM,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQ/B,KAAK,IAAI,IAAI;IAIb;;;;;;;OAOG;IACH,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI;IAYlC;;;;OAIG;IACH,OAAO,CAAC,YAAY;IAiBpB,uEAAuE;IACvE,WAAW,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAI7B,WAAW,IAAI,MAAM;IAIrB,wEAAwE;IACxE,cAAc,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAMvC,6EAA6E;IAC7E,KAAK,IAAI,IAAI;CAUd;AAED,eAAO,MAAM,qBAAqB,uBAA8B,CAAC;AAEjE,uEAAuE;AACvE,wBAAgB,cAAc,CAAC,MAAM,EAAE,SAAS,YAAY,EAAE,GAAG,MAAM,EAAE,CAExE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@buoy-gg/network",
-  "version": "7.0.12",
+  "version": "7.0.13",
   "description": "In-app network inspector for React Native — requests, responses, timing & errors live, with GraphQL operation parsing. Part of Buoy devtools.",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -26,7 +26,7 @@
   ],
   "sideEffects": false,
   "dependencies": {
-    "@buoy-gg/shared-ui": "^7.0.12"
+    "@buoy-gg/shared-ui": "^7.0.13"
   },
   "peerDependencies": {
     "react": "*",