@n-dx/core 0.1.0

package/packages/web/dist/viewer/hooks/use-file-edges.js

@@ -0,0 +1,221 @@
+/**
+ * useFileEdges — Compute file-level cross-zone edges for the zone diagram.
+ *
+ * When zone boxes are expanded, this hook computes the SVG paths connecting
+ * individual files across zones, replacing the coarser zone-to-zone edges.
+ */
+import { useMemo } from "preact/hooks";
+const FILE_ROW_H = 22;
+const BOX_H_COLLAPSED = 80;
+const FILE_ROWS_MAX = 15;
+/** Get the Y center of a file row within an expanded zone box. */
+function fileRowY(box, fileIndex) {
+    return box.y + BOX_H_COLLAPSED - 4 + fileIndex * FILE_ROW_H + FILE_ROW_H / 2;
+}
+/** Compute a cubic Bézier from a file row position to a target zone box. */
+function computeFileEdgePath(fileBox, fileCenterY, targetBox) {
+    const targetCx = targetBox.x + targetBox.w / 2;
+    const exitRight = targetCx > fileBox.x + fileBox.w / 2;
+    const fromX = exitRight ? fileBox.x + fileBox.w : fileBox.x;
+    const fromY = Math.max(fileBox.y + 4, Math.min(fileCenterY, fileBox.y + fileBox.h - 4));
+    const to = boxEdgeAnchor(targetBox, fromX, fromY);
+    const dx = to.x - fromX;
+    const cp1x = fromX + dx * 0.4;
+    const cp1y = fromY;
+    const cp2x = fromX + dx * 0.6;
+    const cp2y = to.y;
+    return `M ${fromX} ${fromY} C ${cp1x} ${cp1y} ${cp2x} ${cp2y} ${to.x} ${to.y}`;
+}
+/** Compute a cubic Bézier between two file rows in different expanded zone boxes. */
+function computeFileToFileEdgePath(fromBox, fromFileY, toBox, toFileY) {
+    const goRight = toBox.x > fromBox.x;
+    const fromX = goRight ? fromBox.x + fromBox.w : fromBox.x;
+    const toX = goRight ? toBox.x : toBox.x + toBox.w;
+    const fromY = Math.max(fromBox.y + 4, Math.min(fromFileY, fromBox.y + fromBox.h - 4));
+    const toY = Math.max(toBox.y + 4, Math.min(toFileY, toBox.y + toBox.h - 4));
+    const dx = toX - fromX;
+    const cp1x = fromX + dx * 0.4;
+    const cp1y = fromY;
+    const cp2x = fromX + dx * 0.6;
+    const cp2y = toY;
+    return `M ${fromX} ${fromY} C ${cp1x} ${cp1y} ${cp2x} ${cp2y} ${toX} ${toY}`;
+}
+function boxEdgeAnchor(box, tx, ty) {
+    const cx = box.x + box.w / 2;
+    const cy = box.y + box.h / 2;
+    const dx = tx - cx;
+    const dy = ty - cy;
+    if (dx === 0 && dy === 0)
+        return { x: cx, y: cy };
+    const hw = box.w / 2;
+    const hh = box.h / 2;
+    const sx = dx !== 0 ? hw / Math.abs(dx) : Infinity;
+    const sy = dy !== 0 ? hh / Math.abs(dy) : Infinity;
+    const s = Math.min(sx, sy);
+    return { x: cx + dx * s, y: cy + dy * s };
+}
+/**
+ * Compute file-level edges for expanded zones and determine which zone-level
+ * edges should be hidden (replaced by file-level detail).
+ */
+export function useFileEdges(edges, boxes, expandedZones, zoneById, fileConnections, fileToFileMap) {
+    const fileEdgeElements = useMemo(() => {
+        const elements = [];
+        for (const edge of edges) {
+            const fromBox = boxes.get(edge.from);
+            const toBox = boxes.get(edge.to);
+            if (!fromBox || !toBox)
+                continue;
+            const fromExpanded = expandedZones.has(edge.from);
+            const toExpanded = expandedZones.has(edge.to);
+            if (!fromExpanded && !toExpanded)
+                continue;
+            const fromZone = zoneById.get(edge.from);
+            const toZone = zoneById.get(edge.to);
+            // Skip edges for zones expanded with subzones — handled by useSubZoneEdges
+            if (fromExpanded && fromZone?.subZones?.length)
+                continue;
+            if (toExpanded && toZone?.subZones?.length)
+                continue;
+            // Both zones expanded: try file-to-file edges, fall back to file-to-zone
+            if (fromExpanded && toExpanded) {
+                if (!fromZone || !toZone)
+                    continue;
+                buildBothExpandedEdges(elements, fromZone, toZone, fromBox, toBox, edge, fileToFileMap, fileConnections);
+                continue;
+            }
+            // Only source zone expanded: draw from files to target zone box
+            if (fromExpanded) {
+                if (!fromZone)
+                    continue;
+                buildOneExpandedEdges(elements, fromZone, fromBox, toBox, edge.to, toZone?.color ?? "var(--border-strong)", fileConnections);
+                continue;
+            }
+            // Only target zone expanded: draw from source zone box to files
+            if (!toZone)
+                continue;
+            buildOneExpandedEdges(elements, toZone, toBox, fromBox, edge.from, fromZone?.color ?? "var(--border-strong)", fileConnections);
+        }
+        return elements;
+    }, [edges, boxes, expandedZones, zoneById, fileConnections, fileToFileMap]);
+    const hiddenZoneEdges = useMemo(() => {
+        const hidden = new Set();
+        for (const edge of edges) {
+            const fromExpanded = expandedZones.has(edge.from);
+            const toExpanded = expandedZones.has(edge.to);
+            if (fromExpanded || toExpanded) {
+                const hasFileEdges = fileEdgeElements.some((fe) => fe.key.includes(edge.from) || fe.key.includes(edge.to));
+                if (hasFileEdges)
+                    hidden.add(`${edge.from}->${edge.to}`);
+            }
+        }
+        return hidden;
+    }, [edges, expandedZones, fileEdgeElements]);
+    return { fileEdgeElements, hiddenZoneEdges };
+}
+// ── Internal helpers ──────────────────────────────────────────────────
+function buildBothExpandedEdges(elements, fromZone, toZone, fromBox, toBox, edge, fileToFileMap, fileConnections) {
+    const fromFiles = fromZone.files.slice(0, FILE_ROWS_MAX);
+    const toFiles = toZone.files.slice(0, FILE_ROWS_MAX);
+    const toFileIndex = new Map(toFiles.map((f, i) => [f.path, i]));
+    let hasF2F = false;
+    // Try file-to-file edges (from call graph data)
+    for (let fi = 0; fi < fromFiles.length; fi++) {
+        const srcFile = fromFiles[fi];
+        const targets = fileToFileMap.get(srcFile.path);
+        if (!targets)
+            continue;
+        for (const [tgtPath, weight] of targets) {
+            const ti = toFileIndex.get(tgtPath);
+            if (ti === undefined)
+                continue;
+            hasF2F = true;
+            const fromY = fileRowY(fromBox, fi);
+            const toY = fileRowY(toBox, ti);
+            elements.push({
+                key: `ff-${srcFile.path}-${tgtPath}`,
+                d: computeFileToFileEdgePath(fromBox, fromY, toBox, toY),
+                color: toZone.color,
+                weight,
+            });
+        }
+    }
+    // Also check reverse direction for file-to-file
+    const fromFileIndex = new Map(fromFiles.map((f, i) => [f.path, i]));
+    for (let ti = 0; ti < toFiles.length; ti++) {
+        const srcFile = toFiles[ti];
+        const targets = fileToFileMap.get(srcFile.path);
+        if (!targets)
+            continue;
+        for (const [tgtPath, weight] of targets) {
+            const fi = fromFileIndex.get(tgtPath);
+            if (fi === undefined)
+                continue;
+            const dupeKey = `ff-${tgtPath}-${srcFile.path}`;
+            if (elements.some((el) => el.key === dupeKey))
+                continue;
+            hasF2F = true;
+            const fromY = fileRowY(toBox, ti);
+            const toY = fileRowY(fromBox, fi);
+            elements.push({
+                key: `ff-${srcFile.path}-${tgtPath}`,
+                d: computeFileToFileEdgePath(toBox, fromY, fromBox, toY),
+                color: fromZone.color,
+                weight,
+            });
+        }
+    }
+    // Fallback: no file-to-file data → draw file-to-zone from both sides
+    if (!hasF2F) {
+        for (let i = 0; i < fromFiles.length; i++) {
+            const file = fromFiles[i];
+            const conns = fileConnections.get(file.path);
+            if (!conns)
+                continue;
+            const link = conns.find((c) => c.targetZoneId === edge.to);
+            if (!link)
+                continue;
+            elements.push({
+                key: `fe-${file.path}-${edge.to}`,
+                d: computeFileEdgePath(fromBox, fileRowY(fromBox, i), toBox),
+                color: toZone.color,
+                weight: link.weight,
+            });
+        }
+        for (let i = 0; i < toFiles.length; i++) {
+            const file = toFiles[i];
+            const conns = fileConnections.get(file.path);
+            if (!conns)
+                continue;
+            const link = conns.find((c) => c.targetZoneId === edge.from);
+            if (!link)
+                continue;
+            elements.push({
+                key: `fe-${edge.from}-${file.path}`,
+                d: computeFileEdgePath(toBox, fileRowY(toBox, i), fromBox),
+                color: fromZone.color,
+                weight: link.weight,
+            });
+        }
+    }
+}
+function buildOneExpandedEdges(elements, expandedZone, expandedBox, otherBox, otherZoneId, edgeColor, fileConnections) {
+    const visibleFiles = expandedZone.files.slice(0, FILE_ROWS_MAX);
+    for (let i = 0; i < visibleFiles.length; i++) {
+        const file = visibleFiles[i];
+        const conns = fileConnections.get(file.path);
+        if (!conns)
+            continue;
+        const link = conns.find((c) => c.targetZoneId === otherZoneId);
+        if (!link)
+            continue;
+        const fy = fileRowY(expandedBox, i);
+        elements.push({
+            key: `fe-${file.path}-${otherZoneId}`,
+            d: computeFileEdgePath(expandedBox, fy, otherBox),
+            color: edgeColor,
+            weight: link.weight,
+        });
+    }
+}
+//# sourceMappingURL=use-file-edges.js.map

package/packages/web/dist/viewer/hooks/use-file-edges.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-file-edges.js","sourceRoot":"","sources":["../../../src/viewer/hooks/use-file-edges.ts"],"names":[],"mappings":"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"}

package/packages/web/dist/viewer/hooks/use-graceful-degradation.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Preact hook for graceful degradation under memory pressure.
+ *
+ * Provides reactive degradation state to components so they can
+ * conditionally disable resource-intensive features. Starts the
+ * degradation manager on mount and cleans up on unmount.
+ */
+import type { MemoryLevel, DegradableFeature } from "../performance/index.js";
+export interface UseGracefulDegradationResult {
+    /** Current degradation tier (mirrors memory level). */
+    tier: MemoryLevel;
+    /** Whether any degradation is active. */
+    isDegraded: boolean;
+    /** Human-readable summary of disabled features. */
+    summary: string;
+    /** Set of currently disabled features. */
+    disabledFeatures: ReadonlySet<DegradableFeature>;
+    /** Check whether a specific feature is disabled. */
+    isDisabled: (feature: DegradableFeature) => boolean;
+}
+/**
+ * Hook that provides real-time graceful degradation state.
+ *
+ * Usage:
+ * ```tsx
+ * const { isDegraded, isDisabled, summary } = useGracefulDegradation();
+ * if (isDisabled("graphRendering")) return h("p", null, "Graph disabled");
+ * ```
+ */
+export declare function useGracefulDegradation(): UseGracefulDegradationResult;

package/packages/web/dist/viewer/hooks/use-graceful-degradation.js

@@ -0,0 +1,45 @@
+/**
+ * Preact hook for graceful degradation under memory pressure.
+ *
+ * Provides reactive degradation state to components so they can
+ * conditionally disable resource-intensive features. Starts the
+ * degradation manager on mount and cleans up on unmount.
+ */
+import { useState, useEffect, useCallback } from "preact/hooks";
+import { startDegradation, stopDegradation, onDegradationChange, getDegradationState, isFeatureDisabled, } from "../performance/graceful-degradation.js";
+/**
+ * Hook that provides real-time graceful degradation state.
+ *
+ * Usage:
+ * ```tsx
+ * const { isDegraded, isDisabled, summary } = useGracefulDegradation();
+ * if (isDisabled("graphRendering")) return h("p", null, "Graph disabled");
+ * ```
+ */
+export function useGracefulDegradation() {
+    const [state, setState] = useState(getDegradationState);
+    useEffect(() => {
+        startDegradation();
+        const unsubscribe = onDegradationChange((newState) => {
+            setState(newState);
+        });
+        // Sync with current state in case it changed between render and effect.
+        setState(getDegradationState());
+        return () => {
+            unsubscribe();
+            stopDegradation();
+        };
+    }, []);
+    const isDisabled = useCallback((feature) => isFeatureDisabled(feature), 
+    // Re-create when state changes so the closure captures fresh module state.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [state]);
+    return {
+        tier: state.tier,
+        isDegraded: state.isDegraded,
+        summary: state.summary,
+        disabledFeatures: state.disabledFeatures,
+        isDisabled,
+    };
+}
+//# sourceMappingURL=use-graceful-degradation.js.map

package/packages/web/dist/viewer/hooks/use-graceful-degradation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-graceful-degradation.js","sourceRoot":"","sources":["../../../src/viewer/hooks/use-graceful-degradation.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhE,OAAO,EACL,gBAAgB,EAChB,eAAe,EACf,mBAAmB,EACnB,mBAAmB,EACnB,iBAAiB,GAClB,MAAM,wCAAwC,CAAC;AAehD;;;;;;;;GAQG;AACH,MAAM,UAAU,sBAAsB;IACpC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAmB,mBAAmB,CAAC,CAAC;IAE1E,SAAS,CAAC,GAAG,EAAE;QACb,gBAAgB,EAAE,CAAC;QAEnB,MAAM,WAAW,GAAG,mBAAmB,CAAC,CAAC,QAAQ,EAAE,EAAE;YACnD,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACrB,CAAC,CAAC,CAAC;QAEH,wEAAwE;QACxE,QAAQ,CAAC,mBAAmB,EAAE,CAAC,CAAC;QAEhC,OAAO,GAAG,EAAE;YACV,WAAW,EAAE,CAAC;YACd,eAAe,EAAE,CAAC;QACpB,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,OAA0B,EAAE,EAAE,CAAC,iBAAiB,CAAC,OAAO,CAAC;IAC1D,2EAA2E;IAC3E,uDAAuD;IACvD,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,OAAO;QACL,IAAI,EAAE,KAAK,CAAC,IAAI;QAChB,UAAU,EAAE,KAAK,CAAC,UAAU;QAC5B,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,gBAAgB,EAAE,KAAK,CAAC,gBAAgB;QACxC,UAAU;KACX,CAAC;AACJ,CAAC"}

package/packages/web/dist/viewer/hooks/use-item-selection.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Item selection hooks — single select, bulk multi-select, and navigation.
+ *
+ * Extracted from usePRDActions to isolate selection state management
+ * from mutation logic. Handles plain click, ctrl+click toggle, and
+ * shift+click range selection.
+ *
+ * @see ./use-prd-actions.ts — parent hook that composes this
+ */
+import type { PRDDocumentData, PRDItemData } from "../components/prd-tree/types.js";
+import type { DetailItem } from "../types.js";
+export interface ItemSelectionDeps {
+    /** Current PRD document data. */
+    data: PRDDocumentData | null;
+    /** External callback for item selection (parent layout). */
+    onSelectItem?: (detail: DetailItem | null) => void;
+}
+export interface ItemSelectionState {
+    /** Currently selected item ID. */
+    selectedItemId: string | null;
+    /** Set the selected item ID directly (e.g. for clearing on delete). */
+    setSelectedItemId: (id: string | null) => void;
+    /** Set of item IDs selected for bulk operations. */
+    bulkSelectedIds: Set<string>;
+    /** Setter for bulk selection (for clearing from external code). */
+    setBulkSelectedIds: (updater: Set<string> | ((prev: Set<string>) => Set<string>)) => void;
+    /** Items resolved from bulk selection (for merge preview). */
+    selectedItems: PRDItemData[];
+    /** Select an item (opens detail panel). */
+    handleSelectItem: (item: PRDItemData) => void;
+    /**
+     * Multi-select handler for bulk operations.
+     * Ctrl/Cmd+click toggles individual items, Shift+click selects a
+     * contiguous range from the anchor, plain click selects only that item.
+     * `visibleIds` provides the flat ordering of currently visible nodes.
+     */
+    handleBulkSelect: (item: PRDItemData, modifiers: {
+        ctrlKey: boolean;
+        shiftKey: boolean;
+    }, visibleIds: string[]) => void;
+    /** Clear all bulk-selected items. */
+    clearBulkSelection: () => void;
+    /** Navigate to an item by ID (from detail panel links). */
+    handleNavigateToItem: (id: string) => void;
+}
+/**
+ * Hook for item selection state — single select, bulk multi-select, and navigation.
+ */
+export declare function useItemSelection({ data, onSelectItem }: ItemSelectionDeps): ItemSelectionState;

package/packages/web/dist/viewer/hooks/use-item-selection.js

@@ -0,0 +1,117 @@
+/**
+ * Item selection hooks — single select, bulk multi-select, and navigation.
+ *
+ * Extracted from usePRDActions to isolate selection state management
+ * from mutation logic. Handles plain click, ctrl+click toggle, and
+ * shift+click range selection.
+ *
+ * @see ./use-prd-actions.ts — parent hook that composes this
+ */
+import { useState, useCallback, useMemo, useRef } from "preact/hooks";
+import { findItemById } from "../components/prd-tree/tree-utils.js";
+/**
+ * Hook for item selection state — single select, bulk multi-select, and navigation.
+ */
+export function useItemSelection({ data, onSelectItem }) {
+    const [selectedItemId, setSelectedItemId] = useState(null);
+    const [bulkSelectedIds, setBulkSelectedIds] = useState(new Set());
+    // Resolve selected items for merge preview
+    const selectedItems = useMemo(() => {
+        if (!data || bulkSelectedIds.size === 0)
+            return [];
+        const items = [];
+        for (const id of bulkSelectedIds) {
+            const item = findItemById(data.items, id);
+            if (item)
+                items.push(item);
+        }
+        return items;
+    }, [data, bulkSelectedIds]);
+    // ── Item selection ───────────────────────────────────────────────
+    const handleSelectItem = useCallback((item) => {
+        setSelectedItemId(item.id);
+        history.replaceState({ view: "prd", file: null, zone: null, runId: null, taskId: item.id }, "", `/prd/${item.id}`);
+        if (onSelectItem) {
+            onSelectItem({
+                type: "prd",
+                title: item.title,
+                id: item.id,
+                level: item.level,
+                status: item.status,
+                description: item.description,
+                acceptanceCriteria: item.acceptanceCriteria,
+                priority: item.priority,
+                tags: item.tags,
+                blockedBy: item.blockedBy,
+                startedAt: item.startedAt,
+                completedAt: item.completedAt,
+            });
+        }
+    }, [onSelectItem]);
+    // ── Bulk selection (ctrl/shift multi-select) ─────────────────────
+    /** Anchor item ID for shift-click range selection. */
+    const bulkAnchorRef = useRef(null);
+    const handleBulkSelect = useCallback((item, modifiers, visibleIds) => {
+        setBulkSelectedIds((prev) => {
+            if (modifiers.shiftKey && bulkAnchorRef.current) {
+                // Shift+click: select contiguous range from anchor to clicked item
+                const anchorIdx = visibleIds.indexOf(bulkAnchorRef.current);
+                const targetIdx = visibleIds.indexOf(item.id);
+                if (anchorIdx >= 0 && targetIdx >= 0) {
+                    const start = Math.min(anchorIdx, targetIdx);
+                    const end = Math.max(anchorIdx, targetIdx);
+                    const rangeIds = visibleIds.slice(start, end + 1);
+                    // Combine with existing selection when ctrl is also held
+                    const next = modifiers.ctrlKey ? new Set(prev) : new Set();
+                    for (const id of rangeIds)
+                        next.add(id);
+                    return next;
+                }
+                // Anchor not visible — fall through to single select
+            }
+            if (modifiers.ctrlKey) {
+                // Ctrl/Cmd+click: toggle individual item
+                const next = new Set(prev);
+                if (next.has(item.id)) {
+                    next.delete(item.id);
+                }
+                else {
+                    next.add(item.id);
+                }
+                bulkAnchorRef.current = item.id;
+                return next;
+            }
+            // Plain click: select only this item, deselect all others
+            bulkAnchorRef.current = item.id;
+            // If already the sole selection, deselect (toggle off)
+            if (prev.size === 1 && prev.has(item.id)) {
+                return new Set();
+            }
+            return new Set([item.id]);
+        });
+    }, []);
+    const clearBulkSelection = useCallback(() => {
+        setBulkSelectedIds(new Set());
+        bulkAnchorRef.current = null;
+    }, []);
+    // ── Navigation ───────────────────────────────────────────────────
+    const handleNavigateToItem = useCallback((id) => {
+        if (!data)
+            return;
+        const item = findItemById(data.items, id);
+        if (item)
+            handleSelectItem(item);
+    }, [data, handleSelectItem]);
+    return {
+        selectedItemId,
+        setSelectedItemId,
+        bulkSelectedIds,
+        setBulkSelectedIds,
+        selectedItems,
+        handleSelectItem,
+        handleBulkSelect,
+        clearBulkSelection,
+        handleNavigateToItem,
+    };
+}
+//# sourceMappingURL=use-item-selection.js.map

package/packages/web/dist/viewer/hooks/use-item-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-item-selection.js","sourceRoot":"","sources":["../../../src/viewer/hooks/use-item-selection.ts"],"names":[],"mappings":"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"}

package/packages/web/dist/viewer/hooks/use-memory-monitor.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Preact hook for client-side memory monitoring.
+ *
+ * Provides real-time memory usage data and warning levels to components.
+ * Starts the memory monitor on mount, cleans up on unmount, and triggers
+ * re-renders only when the snapshot changes.
+ */
+import type { MemorySnapshot, MemoryLevel, MemoryThresholds } from "../performance/memory-monitor.js";
+export interface UseMemoryMonitorOptions {
+    /** Polling interval in milliseconds (default: 5000). */
+    intervalMs?: number;
+    /** Custom warning thresholds. */
+    thresholds?: Partial<MemoryThresholds>;
+    /** Whether to start monitoring immediately (default: true). */
+    enabled?: boolean;
+}
+export interface UseMemoryMonitorResult {
+    /** Latest memory snapshot, or null if not yet available. */
+    snapshot: MemorySnapshot | null;
+    /** Current warning level. */
+    level: MemoryLevel;
+    /** Whether the warning banner should be shown (warning or critical). */
+    showWarning: boolean;
+    /** Whether the user has dismissed the current warning. */
+    dismissed: boolean;
+    /** Dismiss the current warning banner. Resets if level escalates. */
+    dismiss: () => void;
+    /** Snapshot history for debugging (readonly). */
+    history: readonly MemorySnapshot[];
+}
+/**
+ * Hook that provides real-time memory usage monitoring.
+ *
+ * Usage:
+ * ```tsx
+ * const { snapshot, level, showWarning, dismiss } = useMemoryMonitor();
+ * ```
+ */
+export declare function useMemoryMonitor(options?: UseMemoryMonitorOptions): UseMemoryMonitorResult;

package/packages/web/dist/viewer/hooks/use-memory-monitor.js

@@ -0,0 +1,73 @@
+/**
+ * Preact hook for client-side memory monitoring.
+ *
+ * Provides real-time memory usage data and warning levels to components.
+ * Starts the memory monitor on mount, cleans up on unmount, and triggers
+ * re-renders only when the snapshot changes.
+ */
+import { useState, useEffect, useCallback, useRef } from "preact/hooks";
+import { startMemoryMonitor, stopMemoryMonitor, onSnapshot, getLatestSnapshot, getSnapshotHistory, } from "../performance/memory-monitor.js";
+/**
+ * Hook that provides real-time memory usage monitoring.
+ *
+ * Usage:
+ * ```tsx
+ * const { snapshot, level, showWarning, dismiss } = useMemoryMonitor();
+ * ```
+ */
+export function useMemoryMonitor(options = {}) {
+    const { intervalMs = 5000, thresholds, enabled = true } = options;
+    const [snapshot, setSnapshot] = useState(getLatestSnapshot);
+    const [dismissed, setDismissed] = useState(false);
+    const dismissedLevelRef = useRef(null);
+    useEffect(() => {
+        if (!enabled)
+            return;
+        startMemoryMonitor({
+            intervalMs,
+            thresholds: thresholds,
+            onLevelChange: (snap, prevLevel) => {
+                // If the level escalates beyond what was dismissed, re-show the warning.
+                if (dismissedLevelRef.current &&
+                    isMoreSevere(snap.level, dismissedLevelRef.current)) {
+                    setDismissed(false);
+                    dismissedLevelRef.current = null;
+                }
+            },
+        });
+        const unsubscribe = onSnapshot((snap) => {
+            setSnapshot(snap);
+        });
+        return () => {
+            unsubscribe();
+            stopMemoryMonitor();
+        };
+    }, [enabled, intervalMs, thresholds]);
+    const dismiss = useCallback(() => {
+        setDismissed(true);
+        dismissedLevelRef.current = snapshot?.level ?? null;
+    }, [snapshot]);
+    const level = snapshot?.level ?? "normal";
+    const shouldWarn = level === "warning" || level === "critical";
+    const showWarning = shouldWarn && !dismissed;
+    return {
+        snapshot,
+        level,
+        showWarning,
+        dismissed,
+        dismiss,
+        history: getSnapshotHistory(),
+    };
+}
+// ─── Helpers ─────────────────────────────────────────────────────────────────
+const SEVERITY_ORDER = {
+    normal: 0,
+    elevated: 1,
+    warning: 2,
+    critical: 3,
+};
+/** Returns true if `a` is strictly more severe than `b`. */
+function isMoreSevere(a, b) {
+    return SEVERITY_ORDER[a] > SEVERITY_ORDER[b];
+}
+//# sourceMappingURL=use-memory-monitor.js.map

package/packages/web/dist/viewer/hooks/use-memory-monitor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-memory-monitor.js","sourceRoot":"","sources":["../../../src/viewer/hooks/use-memory-monitor.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAMxE,OAAO,EACL,kBAAkB,EAClB,iBAAiB,EACjB,UAAU,EACV,iBAAiB,EACjB,kBAAkB,GAEnB,MAAM,kCAAkC,CAAC;AA0B1C;;;;;;;GAOG;AACH,MAAM,UAAU,gBAAgB,CAC9B,UAAmC,EAAE;IAErC,MAAM,EAAE,UAAU,GAAG,IAAI,EAAE,UAAU,EAAE,OAAO,GAAG,IAAI,EAAE,GAAG,OAAO,CAAC;IAElE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CACtC,iBAAiB,CAClB,CAAC;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,iBAAiB,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IAE3D,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,kBAAkB,CAAC;YACjB,UAAU;YACV,UAAU,EAAE,UAA0C;YACtD,aAAa,EAAE,CAAC,IAAI,EAAE,SAAS,EAAE,EAAE;gBACjC,yEAAyE;gBACzE,IACE,iBAAiB,CAAC,OAAO;oBACzB,YAAY,CAAC,IAAI,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,EACnD,CAAC;oBACD,YAAY,CAAC,KAAK,CAAC,CAAC;oBACpB,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;gBACnC,CAAC;YACH,CAAC;SACF,CAAC,CAAC;QAEH,MAAM,WAAW,GAAG,UAAU,CAAC,CAAC,IAAI,EAAE,EAAE;YACtC,WAAW,CAAC,IAAI,CAAC,CAAC;QACpB,CAAC,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,WAAW,EAAE,CAAC;YACd,iBAAiB,EAAE,CAAC;QACtB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAC;IAEtC,MAAM,OAAO,GAAG,WAAW,CAAC,GAAG,EAAE;QAC/B,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,iBAAiB,CAAC,OAAO,GAAG,QAAQ,EAAE,KAAK,IAAI,IAAI,CAAC;IACtD,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,KAAK,GAAG,QAAQ,EAAE,KAAK,IAAI,QAAQ,CAAC;IAC1C,MAAM,UAAU,GAAG,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,UAAU,CAAC;IAC/D,MAAM,WAAW,GAAG,UAAU,IAAI,CAAC,SAAS,CAAC;IAE7C,OAAO;QACL,QAAQ;QACR,KAAK;QACL,WAAW;QACX,SAAS;QACT,OAAO;QACP,OAAO,EAAE,kBAAkB,EAAE;KAC9B,CAAC;AACJ,CAAC;AAED,gFAAgF;AAEhF,MAAM,cAAc,GAAgC;IAClD,MAAM,EAAE,CAAC;IACT,QAAQ,EAAE,CAAC;IACX,OAAO,EAAE,CAAC;IACV,QAAQ,EAAE,CAAC;CACZ,CAAC;AAEF,4DAA4D;AAC5D,SAAS,YAAY,CAAC,CAAc,EAAE,CAAc;IAClD,OAAO,cAAc,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;AAC/C,CAAC"}

package/packages/web/dist/viewer/hooks/use-pan-zoom.d.ts

@@ -0,0 +1,33 @@
+/**
+ * usePanZoom — SVG viewport panning and zooming hook.
+ *
+ * Handles:
+ * - Trackpad/mouse wheel scrolling (pan) and pinch-to-zoom (ctrl+wheel)
+ * - Mouse-drag panning on the SVG background
+ * - Programmatic zoom-in, zoom-out, and fit-to-content controls
+ */
+import type { RefObject } from "preact";
+export interface ViewBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+export interface PanZoomState {
+    viewBox: ViewBox;
+    panning: boolean;
+    svgRef: RefObject<SVGSVGElement>;
+    handleWheel: (e: WheelEvent) => void;
+    startPan: (e: MouseEvent) => void;
+    movePan: (e: MouseEvent) => void;
+    endPan: () => void;
+    handleZoomIn: () => void;
+    handleZoomOut: () => void;
+    handleFit: () => void;
+}
+/**
+ * Hook that manages SVG pan/zoom state and interaction handlers.
+ *
+ * @param fitVB - The "fit to content" viewBox dimensions
+ */
+export declare function usePanZoom(fitVB: ViewBox): PanZoomState;