@edv4h/usketch-plugin-debug-hud 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 EdV4H
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/fps-graph.d.ts

@@ -0,0 +1,7 @@
+import type { FpsCounter } from "../fps-counter.js";
+interface FpsGraphProps {
+    fpsCounter: FpsCounter;
+}
+export declare function FpsGraph({ fpsCounter }: FpsGraphProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=fps-graph.d.ts.map

package/dist/components/fps-graph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fps-graph.d.ts","sourceRoot":"","sources":["../../src/components/fps-graph.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAGpD,UAAU,aAAa;IACtB,UAAU,EAAE,UAAU,CAAC;CACvB;AAYD,wBAAgB,QAAQ,CAAC,EAAE,UAAU,EAAE,EAAE,aAAa,2CAyDrD"}

package/dist/components/fps-graph.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useRef } from "react";
+import { FPS_GREEN, FPS_RED, FPS_YELLOW } from "../styles.js";
+const WIDTH = 120;
+const HEIGHT = 32;
+const MAX_FPS = 80;
+function colorForFps(fps) {
+    if (fps >= 50)
+        return FPS_GREEN;
+    if (fps >= 30)
+        return FPS_YELLOW;
+    return FPS_RED;
+}
+export function FpsGraph({ fpsCounter }) {
+    const canvasRef = useRef(null);
+    const draw = useCallback(() => {
+        const canvas = canvasRef.current;
+        if (!canvas)
+            return;
+        const ctx = canvas.getContext("2d");
+        if (!ctx)
+            return;
+        const history = fpsCounter.getHistory();
+        ctx.clearRect(0, 0, WIDTH, HEIGHT);
+        if (history.length < 2)
+            return;
+        // Draw 60fps reference line
+        const y60 = HEIGHT - (60 / MAX_FPS) * HEIGHT;
+        ctx.strokeStyle = "rgba(255, 255, 255, 0.1)";
+        ctx.lineWidth = 1;
+        ctx.setLineDash([2, 2]);
+        ctx.beginPath();
+        ctx.moveTo(0, y60);
+        ctx.lineTo(WIDTH, y60);
+        ctx.stroke();
+        ctx.setLineDash([]);
+        // Draw FPS line
+        ctx.lineWidth = 1.5;
+        ctx.beginPath();
+        const step = WIDTH / (60 - 1);
+        const offset = (60 - history.length) * step;
+        for (let i = 0; i < history.length; i++) {
+            const x = offset + i * step;
+            const y = HEIGHT - (Math.min(history[i], MAX_FPS) / MAX_FPS) * HEIGHT;
+            if (i === 0)
+                ctx.moveTo(x, y);
+            else
+                ctx.lineTo(x, y);
+        }
+        const lastFps = history[history.length - 1];
+        ctx.strokeStyle = colorForFps(lastFps);
+        ctx.stroke();
+    }, [fpsCounter]);
+    useEffect(() => {
+        const unsub = fpsCounter.subscribe(draw);
+        draw();
+        return unsub;
+    }, [fpsCounter, draw]);
+    return (_jsx("canvas", { ref: canvasRef, width: WIDTH, height: HEIGHT, style: { width: WIDTH, height: HEIGHT, display: "block", marginTop: 2 } }));
+}
+//# sourceMappingURL=fps-graph.js.map

package/dist/components/fps-graph.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fps-graph.js","sourceRoot":"","sources":["../../src/components/fps-graph.tsx"],"names":[],"mappings":"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"}

package/dist/debug-hud.d.ts

@@ -0,0 +1,21 @@
+import type { BoardStore, CommandRegistry, EventBus, LayerManager, LayerRenderContext, ShapeRegistry, ToolRegistry } from "@edv4h/usketch-shared";
+import type { EventLogger } from "./event-logger.js";
+import type { FpsCounter } from "./fps-counter.js";
+import type { PointerTracker } from "./pointer-tracker.js";
+import type { SyncStatusTrackerLike } from "./sync-status-types.js";
+interface DebugHudProps {
+    store: BoardStore;
+    fpsCounter: FpsCounter;
+    eventLogger: EventLogger;
+    pointerTracker: PointerTracker;
+    commands: CommandRegistry;
+    tools: ToolRegistry;
+    layers: LayerManager;
+    shapes: ShapeRegistry;
+    syncStatus?: SyncStatusTrackerLike;
+    events: EventBus;
+    ctx: LayerRenderContext;
+}
+export declare function DebugHud({ store, fpsCounter, eventLogger, pointerTracker, commands, tools, layers, shapes, syncStatus, events, ctx, }: DebugHudProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=debug-hud.d.ts.map

package/dist/debug-hud.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug-hud.d.ts","sourceRoot":"","sources":["../src/debug-hud.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,UAAU,EACV,eAAe,EACf,QAAQ,EACR,YAAY,EACZ,kBAAkB,EAClB,aAAa,EACb,YAAY,EACZ,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAMnD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAE3D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAEpE,UAAU,aAAa;IACtB,KAAK,EAAE,UAAU,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,WAAW,EAAE,WAAW,CAAC;IACzB,cAAc,EAAE,cAAc,CAAC;IAC/B,QAAQ,EAAE,eAAe,CAAC;IAC1B,KAAK,EAAE,YAAY,CAAC;IACpB,MAAM,EAAE,YAAY,CAAC;IACrB,MAAM,EAAE,aAAa,CAAC;IACtB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,GAAG,EAAE,kBAAkB,CAAC;CACxB;AAQD,wBAAgB,QAAQ,CAAC,EACxB,KAAK,EACL,UAAU,EACV,WAAW,EACX,cAAc,EACd,QAAQ,EACR,KAAK,EACL,MAAM,EACN,MAAM,EACN,UAAU,EACV,MAAM,EACN,GAAG,GACH,EAAE,aAAa,2CAmGf"}

package/dist/debug-hud.js

@@ -0,0 +1,69 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Minimap } from "./overlays/minimap.js";
+import { ShapeBoundsOverlay } from "./overlays/shape-bounds-overlay.js";
+import { EventsPanel } from "./panels/events-panel.js";
+import { GeneralPanel } from "./panels/general-panel.js";
+import { ShapesPanel } from "./panels/shapes-panel.js";
+import { FONT_FAMILY, TEXT_MUTED } from "./styles.js";
+function isEditableTarget(target) {
+    if (!(target instanceof HTMLElement))
+        return false;
+    const tag = target.tagName;
+    return tag === "INPUT" || tag === "TEXTAREA" || target.isContentEditable;
+}
+export function DebugHud({ store, fpsCounter, eventLogger, pointerTracker, commands, tools, layers, shapes, syncStatus, events, ctx, }) {
+    const STORAGE_KEY = "usketch-debug-hud-visible";
+    const [visible, setVisible] = useState(() => {
+        try {
+            return localStorage.getItem(STORAGE_KEY) === "1";
+        }
+        catch {
+            return false;
+        }
+    });
+    const [hoveredShapeId, setHoveredShapeId] = useState(null);
+    // Keyboard shortcut (backtick)
+    useEffect(() => {
+        const handler = (e) => {
+            if (isEditableTarget(e.target))
+                return;
+            if (e.key === "`" || e.code === "Backquote") {
+                if (!e.ctrlKey && !e.metaKey && !e.altKey && !e.shiftKey) {
+                    e.preventDefault();
+                    setVisible((v) => {
+                        const next = !v;
+                        try {
+                            localStorage.setItem(STORAGE_KEY, next ? "1" : "0");
+                        }
+                        catch {
+                            // ignore
+                        }
+                        return next;
+                    });
+                }
+            }
+        };
+        window.addEventListener("keydown", handler);
+        return () => window.removeEventListener("keydown", handler);
+    }, []);
+    const { viewport, shapes: shapeMap, selection } = ctx;
+    const activeToolId = store.getActiveToolId();
+    const hoveredShape = hoveredShapeId ? shapeMap.get(hoveredShapeId) : undefined;
+    // Shortcut hint — bottom-center (always visible)
+    const hint = (_jsxs("div", { style: {
+            position: "absolute",
+            bottom: 8,
+            left: "50%",
+            transform: "translateX(-50%)",
+            color: TEXT_MUTED,
+            fontSize: 10,
+            fontFamily: FONT_FAMILY,
+            pointerEvents: "none",
+        }, children: ["Debug HUD \u00B7 press ", _jsx("kbd", { style: { color: "#e0e0e0" }, children: "`" }), " to ", visible ? "close" : "open"] }));
+    if (!visible) {
+        return hint;
+    }
+    return (_jsxs(_Fragment, { children: [hint, _jsx(ShapeBoundsOverlay, { shape: hoveredShape, store: store }), _jsx(GeneralPanel, { store: store, fpsCounter: fpsCounter, pointerTracker: pointerTracker, commands: commands, tools: tools, layers: layers, shapes: shapes, syncStatus: syncStatus, events: events, viewport: viewport, activeToolId: activeToolId }), _jsx(ShapesPanel, { store: store, commands: commands, shapes: shapeMap, selection: selection, onHoverShape: setHoveredShapeId }), _jsx(EventsPanel, { eventLogger: eventLogger }), _jsx(Minimap, { shapes: shapeMap, viewport: viewport, selection: selection })] }));
+}
+//# sourceMappingURL=debug-hud.js.map

package/dist/debug-hud.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debug-hud.js","sourceRoot":"","sources":["../src/debug-hud.tsx"],"names":[],"mappings":"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"}

package/dist/event-logger.d.ts

@@ -0,0 +1,18 @@
+export interface EventLogEntry {
+    event: string;
+    timestamp: number;
+    count: number;
+}
+export declare class EventLogger {
+    private entries;
+    private listeners;
+    private snapshotCache;
+    push(entry: {
+        event: string;
+        timestamp: number;
+    }): void;
+    clear(): void;
+    subscribe(listener: () => void): () => void;
+    getSnapshot(): readonly EventLogEntry[];
+}
+//# sourceMappingURL=event-logger.d.ts.map

package/dist/event-logger.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-logger.d.ts","sourceRoot":"","sources":["../src/event-logger.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,aAAa;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;CACd;AAID,qBAAa,WAAW;IACvB,OAAO,CAAC,OAAO,CAAuB;IACtC,OAAO,CAAC,SAAS,CAAyB;IAC1C,OAAO,CAAC,aAAa,CAAgC;IAErD,IAAI,CAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,SAAS,EAAE,MAAM,CAAA;KAAE,GAAG,IAAI;IAiBvD,KAAK,IAAI,IAAI;IAQb,SAAS,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI;IAK3C,WAAW,IAAI,SAAS,aAAa,EAAE;CAGvC"}

package/dist/event-logger.js

@@ -0,0 +1,38 @@
+const MAX_ENTRIES = 200;
+export class EventLogger {
+    entries = [];
+    listeners = new Set();
+    snapshotCache = [];
+    push(entry) {
+        const last = this.entries[this.entries.length - 1];
+        if (last && last.event === entry.event) {
+            last.count++;
+            last.timestamp = entry.timestamp;
+        }
+        else {
+            this.entries.push({ ...entry, count: 1 });
+            if (this.entries.length > MAX_ENTRIES) {
+                this.entries.shift();
+            }
+        }
+        this.snapshotCache = [...this.entries];
+        for (const listener of this.listeners) {
+            listener();
+        }
+    }
+    clear() {
+        this.entries = [];
+        this.snapshotCache = [];
+        for (const listener of this.listeners) {
+            listener();
+        }
+    }
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return () => this.listeners.delete(listener);
+    }
+    getSnapshot() {
+        return this.snapshotCache;
+    }
+}
+//# sourceMappingURL=event-logger.js.map

package/dist/event-logger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-logger.js","sourceRoot":"","sources":["../src/event-logger.ts"],"names":[],"mappings":"AAMA,MAAM,WAAW,GAAG,GAAG,CAAC;AAExB,MAAM,OAAO,WAAW;IACf,OAAO,GAAoB,EAAE,CAAC;IAC9B,SAAS,GAAG,IAAI,GAAG,EAAc,CAAC;IAClC,aAAa,GAA6B,EAAE,CAAC;IAErD,IAAI,CAAC,KAA2C;QAC/C,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACnD,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,CAAC,KAAK,EAAE,CAAC;YACxC,IAAI,CAAC,KAAK,EAAE,CAAC;YACb,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC;QAClC,CAAC;aAAM,CAAC;YACP,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;YAC1C,IAAI,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,WAAW,EAAE,CAAC;gBACvC,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YACtB,CAAC;QACF,CAAC;QACD,IAAI,CAAC,aAAa,GAAG,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC;QACvC,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACvC,QAAQ,EAAE,CAAC;QACZ,CAAC;IACF,CAAC;IAED,KAAK;QACJ,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;QAClB,IAAI,CAAC,aAAa,GAAG,EAAE,CAAC;QACxB,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACvC,QAAQ,EAAE,CAAC;QACZ,CAAC;IACF,CAAC;IAED,SAAS,CAAC,QAAoB;QAC7B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC9C,CAAC;IAED,WAAW;QACV,OAAO,IAAI,CAAC,aAAa,CAAC;IAC3B,CAAC;CACD"}

package/dist/fps-counter.d.ts

@@ -0,0 +1,15 @@
+export declare class FpsCounter {
+    private frameCount;
+    private lastTime;
+    private currentFps;
+    private rafId;
+    private listeners;
+    private historyBuffer;
+    start(): void;
+    stop(): void;
+    subscribe(listener: () => void): () => void;
+    getSnapshot(): number;
+    getHistory(): readonly number[];
+    private tick;
+}
+//# sourceMappingURL=fps-counter.d.ts.map

package/dist/fps-counter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fps-counter.d.ts","sourceRoot":"","sources":["../src/fps-counter.ts"],"names":[],"mappings":"AAEA,qBAAa,UAAU;IACtB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,QAAQ,CAAK;IACrB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,SAAS,CAAyB;IAC1C,OAAO,CAAC,aAAa,CAAgB;IAErC,KAAK,IAAI,IAAI;IAMb,IAAI,IAAI,IAAI;IAIZ,SAAS,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI;IAK3C,WAAW,IAAI,MAAM;IAIrB,UAAU,IAAI,SAAS,MAAM,EAAE;IAI/B,OAAO,CAAC,IAAI,CAiBV;CACF"}

package/dist/fps-counter.js

@@ -0,0 +1,46 @@
+const HISTORY_SIZE = 60;
+export class FpsCounter {
+    frameCount = 0;
+    lastTime = 0;
+    currentFps = 0;
+    rafId = 0;
+    listeners = new Set();
+    historyBuffer = [];
+    start() {
+        this.lastTime = performance.now();
+        this.frameCount = 0;
+        this.tick();
+    }
+    stop() {
+        cancelAnimationFrame(this.rafId);
+    }
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return () => this.listeners.delete(listener);
+    }
+    getSnapshot() {
+        return this.currentFps;
+    }
+    getHistory() {
+        return this.historyBuffer;
+    }
+    tick = () => {
+        this.rafId = requestAnimationFrame(this.tick);
+        this.frameCount++;
+        const now = performance.now();
+        const elapsed = now - this.lastTime;
+        if (elapsed >= 1000) {
+            this.currentFps = Math.round((this.frameCount * 1000) / elapsed);
+            this.frameCount = 0;
+            this.lastTime = now;
+            this.historyBuffer.push(this.currentFps);
+            if (this.historyBuffer.length > HISTORY_SIZE) {
+                this.historyBuffer.shift();
+            }
+            for (const listener of this.listeners) {
+                listener();
+            }
+        }
+    };
+}
+//# sourceMappingURL=fps-counter.js.map

package/dist/fps-counter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"fps-counter.js","sourceRoot":"","sources":["../src/fps-counter.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,EAAE,CAAC;AAExB,MAAM,OAAO,UAAU;IACd,UAAU,GAAG,CAAC,CAAC;IACf,QAAQ,GAAG,CAAC,CAAC;IACb,UAAU,GAAG,CAAC,CAAC;IACf,KAAK,GAAG,CAAC,CAAC;IACV,SAAS,GAAG,IAAI,GAAG,EAAc,CAAC;IAClC,aAAa,GAAa,EAAE,CAAC;IAErC,KAAK;QACJ,IAAI,CAAC,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;QAClC,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;QACpB,IAAI,CAAC,IAAI,EAAE,CAAC;IACb,CAAC;IAED,IAAI;QACH,oBAAoB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC;IAED,SAAS,CAAC,QAAoB;QAC7B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC9C,CAAC;IAED,WAAW;QACV,OAAO,IAAI,CAAC,UAAU,CAAC;IACxB,CAAC;IAED,UAAU;QACT,OAAO,IAAI,CAAC,aAAa,CAAC;IAC3B,CAAC;IAEO,IAAI,GAAG,GAAS,EAAE;QACzB,IAAI,CAAC,KAAK,GAAG,qBAAqB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC9C,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,MAAM,GAAG,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;QAC9B,MAAM,OAAO,GAAG,GAAG,GAAG,IAAI,CAAC,QAAQ,CAAC;QACpC,IAAI,OAAO,IAAI,IAAI,EAAE,CAAC;YACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,GAAG,OAAO,CAAC,CAAC;YACjE,IAAI,CAAC,UAAU,GAAG,CAAC,CAAC;YACpB,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC;YACpB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACzC,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,GAAG,YAAY,EAAE,CAAC;gBAC9C,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,CAAC;YAC5B,CAAC;YACD,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACvC,QAAQ,EAAE,CAAC;YACZ,CAAC;QACF,CAAC;IACF,CAAC,CAAC;CACF"}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { debugHudPlugin } from "./plugin.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export { debugHudPlugin } from "./plugin.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC"}

package/dist/overlays/minimap.d.ts

@@ -0,0 +1,9 @@
+import type { ShapeData, Viewport } from "@edv4h/usketch-shared";
+interface MinimapProps {
+    shapes: ReadonlyMap<string, ShapeData>;
+    viewport: Viewport;
+    selection: ReadonlySet<string>;
+}
+export declare function Minimap({ shapes, viewport, selection }: MinimapProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=minimap.d.ts.map

package/dist/overlays/minimap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"minimap.d.ts","sourceRoot":"","sources":["../../src/overlays/minimap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAIjE,UAAU,YAAY;IACrB,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACvC,QAAQ,EAAE,QAAQ,CAAC;IACnB,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC/B;AAKD,wBAAgB,OAAO,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,EAAE,YAAY,2CAmEpE"}

package/dist/overlays/minimap.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { computeMinimap } from "@edv4h/usketch-shared";
+import { ACCENT_DIM, PANEL_BG, PANEL_BLUR, PANEL_BORDER_RADIUS } from "../styles.js";
+const MAP_W = 140;
+const MAP_H = 90;
+export function Minimap({ shapes, viewport, selection }) {
+    const shapeArr = Array.from(shapes.values());
+    // viewport.x/y is a screen-space translate offset, not a world origin.
+    const vpWorldX = -viewport.x / viewport.zoom;
+    const vpWorldY = -viewport.y / viewport.zoom;
+    const vpWorldW = window.innerWidth / viewport.zoom;
+    const vpWorldH = window.innerHeight / viewport.zoom;
+    const result = computeMinimap({
+        shapes: shapeArr,
+        viewportWorld: { x: vpWorldX, y: vpWorldY, width: vpWorldW, height: vpWorldH },
+        mapWidth: MAP_W,
+        mapHeight: MAP_H,
+        padding: 20,
+        minSize: 2,
+    });
+    return (_jsxs("div", { style: {
+            position: "absolute",
+            bottom: 8,
+            left: 8,
+            width: MAP_W,
+            height: MAP_H,
+            background: PANEL_BG,
+            borderRadius: PANEL_BORDER_RADIUS,
+            backdropFilter: PANEL_BLUR,
+            pointerEvents: "auto",
+            overflow: "hidden",
+        }, children: [result.rects.map((r) => (_jsx("div", { style: {
+                    position: "absolute",
+                    left: r.x,
+                    top: r.y,
+                    width: r.width,
+                    height: r.height,
+                    background: selection.has(r.id)
+                        ? "rgba(99, 102, 241, 0.8)"
+                        : "rgba(255, 255, 255, 0.4)",
+                    borderRadius: 1,
+                } }, r.id))), result.viewportRect && (_jsx("div", { style: {
+                    position: "absolute",
+                    left: result.viewportRect.x,
+                    top: result.viewportRect.y,
+                    width: result.viewportRect.width,
+                    height: result.viewportRect.height,
+                    border: `1px solid ${ACCENT_DIM}`,
+                    borderRadius: 2,
+                    boxSizing: "border-box",
+                } }))] }));
+}
+//# sourceMappingURL=minimap.js.map

package/dist/overlays/minimap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"minimap.js","sourceRoot":"","sources":["../../src/overlays/minimap.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,cAAc,EAAsB,MAAM,uBAAuB,CAAC;AAC3E,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAQrF,MAAM,KAAK,GAAG,GAAG,CAAC;AAClB,MAAM,KAAK,GAAG,EAAE,CAAC;AAEjB,MAAM,UAAU,OAAO,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAgB;IACpE,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,CAAC,CAAC;IAE7C,uEAAuE;IACvE,MAAM,QAAQ,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;IAC7C,MAAM,QAAQ,GAAG,CAAC,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;IAC7C,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC;IACnD,MAAM,QAAQ,GAAG,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC;IAEpD,MAAM,MAAM,GAAkB,cAAc,CAAC;QAC5C,MAAM,EAAE,QAAQ;QAChB,aAAa,EAAE,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE;QAC9E,QAAQ,EAAE,KAAK;QACf,SAAS,EAAE,KAAK;QAChB,OAAO,EAAE,EAAE;QACX,OAAO,EAAE,CAAC;KACV,CAAC,CAAC;IAEH,OAAO,CACN,eACC,KAAK,EAAE;YACN,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,CAAC;YACT,IAAI,EAAE,CAAC;YACP,KAAK,EAAE,KAAK;YACZ,MAAM,EAAE,KAAK;YACb,UAAU,EAAE,QAAQ;YACpB,YAAY,EAAE,mBAAmB;YACjC,cAAc,EAAE,UAAU;YAC1B,aAAa,EAAE,MAAM;YACrB,QAAQ,EAAE,QAAQ;SAClB,aAGA,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CACxB,cAEC,KAAK,EAAE;oBACN,QAAQ,EAAE,UAAU;oBACpB,IAAI,EAAE,CAAC,CAAC,CAAC;oBACT,GAAG,EAAE,CAAC,CAAC,CAAC;oBACR,KAAK,EAAE,CAAC,CAAC,KAAK;oBACd,MAAM,EAAE,CAAC,CAAC,MAAM;oBAChB,UAAU,EAAE,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC;wBAC9B,CAAC,CAAC,yBAAyB;wBAC3B,CAAC,CAAC,0BAA0B;oBAC7B,YAAY,EAAE,CAAC;iBACf,IAXI,CAAC,CAAC,EAAE,CAYR,CACF,CAAC,EAED,MAAM,CAAC,YAAY,IAAI,CACvB,cACC,KAAK,EAAE;oBACN,QAAQ,EAAE,UAAU;oBACpB,IAAI,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;oBAC3B,GAAG,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;oBAC1B,KAAK,EAAE,MAAM,CAAC,YAAY,CAAC,KAAK;oBAChC,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,MAAM;oBAClC,MAAM,EAAE,aAAa,UAAU,EAAE;oBACjC,YAAY,EAAE,CAAC;oBACf,SAAS,EAAE,YAAY;iBACvB,GACA,CACF,IACI,CACN,CAAC;AACH,CAAC"}

package/dist/overlays/shape-bounds-overlay.d.ts

@@ -0,0 +1,8 @@
+import type { BoardStore, ShapeData } from "@edv4h/usketch-shared";
+interface ShapeBoundsOverlayProps {
+    shape: ShapeData | undefined;
+    store: BoardStore;
+}
+export declare function ShapeBoundsOverlay({ shape, store }: ShapeBoundsOverlayProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=shape-bounds-overlay.d.ts.map

package/dist/overlays/shape-bounds-overlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape-bounds-overlay.d.ts","sourceRoot":"","sources":["../../src/overlays/shape-bounds-overlay.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAInE,UAAU,uBAAuB;IAChC,KAAK,EAAE,SAAS,GAAG,SAAS,CAAC;IAC7B,KAAK,EAAE,UAAU,CAAC;CAClB;AAED,wBAAgB,kBAAkB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,uBAAuB,kDAgD3E"}

package/dist/overlays/shape-bounds-overlay.js

@@ -0,0 +1,38 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { worldToScreen } from "@edv4h/usketch-shared";
+import { useCallback, useSyncExternalStore } from "react";
+export function ShapeBoundsOverlay({ shape, store }) {
+    // Subscribe to store so viewport changes trigger re-render
+    const viewport = useSyncExternalStore(useCallback((cb) => store.subscribe(cb), [store]), () => store.getViewport());
+    if (!shape)
+        return null;
+    const tl = worldToScreen(shape.x, shape.y, viewport);
+    const br = worldToScreen(shape.x + shape.width, shape.y + shape.height, viewport);
+    const screenX = tl.x;
+    const screenY = tl.y;
+    const screenW = br.x - tl.x;
+    const screenH = br.y - tl.y;
+    return (_jsx("div", { style: {
+            position: "absolute",
+            left: screenX,
+            top: screenY,
+            width: screenW,
+            height: screenH,
+            border: "2px dashed rgba(99, 102, 241, 0.7)",
+            borderRadius: 2,
+            pointerEvents: "none",
+            boxSizing: "border-box",
+        }, children: _jsxs("div", { style: {
+                position: "absolute",
+                top: -16,
+                left: 0,
+                fontSize: 9,
+                fontFamily: "'SF Mono', monospace",
+                color: "rgba(99, 102, 241, 0.9)",
+                background: "rgba(0, 0, 0, 0.6)",
+                padding: "1px 4px",
+                borderRadius: 2,
+                whiteSpace: "nowrap",
+            }, children: [shape.type, " (", Math.round(shape.width), "\u00D7", Math.round(shape.height), ")"] }) }));
+}
+//# sourceMappingURL=shape-bounds-overlay.js.map

package/dist/overlays/shape-bounds-overlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape-bounds-overlay.js","sourceRoot":"","sources":["../../src/overlays/shape-bounds-overlay.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAO1D,MAAM,UAAU,kBAAkB,CAAC,EAAE,KAAK,EAAE,KAAK,EAA2B;IAC3E,2DAA2D;IAC3D,MAAM,QAAQ,GAAG,oBAAoB,CACpC,WAAW,CAAC,CAAC,EAAc,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,EAC7D,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,CACzB,CAAC;IAEF,IAAI,CAAC,KAAK;QAAE,OAAO,IAAI,CAAC;IAExB,MAAM,EAAE,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;IACrD,MAAM,EAAE,GAAG,aAAa,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAClF,MAAM,OAAO,GAAG,EAAE,CAAC,CAAC,CAAC;IACrB,MAAM,OAAO,GAAG,EAAE,CAAC,CAAC,CAAC;IACrB,MAAM,OAAO,GAAG,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAC5B,MAAM,OAAO,GAAG,EAAE,CAAC,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC;IAE5B,OAAO,CACN,cACC,KAAK,EAAE;YACN,QAAQ,EAAE,UAAU;YACpB,IAAI,EAAE,OAAO;YACb,GAAG,EAAE,OAAO;YACZ,KAAK,EAAE,OAAO;YACd,MAAM,EAAE,OAAO;YACf,MAAM,EAAE,oCAAoC;YAC5C,YAAY,EAAE,CAAC;YACf,aAAa,EAAE,MAAM;YACrB,SAAS,EAAE,YAAY;SACvB,YAED,eACC,KAAK,EAAE;gBACN,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC,EAAE;gBACR,IAAI,EAAE,CAAC;gBACP,QAAQ,EAAE,CAAC;gBACX,UAAU,EAAE,sBAAsB;gBAClC,KAAK,EAAE,yBAAyB;gBAChC,UAAU,EAAE,oBAAoB;gBAChC,OAAO,EAAE,SAAS;gBAClB,YAAY,EAAE,CAAC;gBACf,UAAU,EAAE,QAAQ;aACpB,aAEA,KAAK,CAAC,IAAI,QAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,YAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,SAC5D,GACD,CACN,CAAC;AACH,CAAC"}

package/dist/panels/events-panel.d.ts

@@ -0,0 +1,7 @@
+import type { EventLogger } from "../event-logger.js";
+interface EventsPanelProps {
+    eventLogger: EventLogger;
+}
+export declare function EventsPanel({ eventLogger }: EventsPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=events-panel.d.ts.map

package/dist/panels/events-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"events-panel.d.ts","sourceRoot":"","sources":["../../src/panels/events-panel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAiB,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAGrE,UAAU,gBAAgB;IACzB,WAAW,EAAE,WAAW,CAAC;CACzB;AA4BD,wBAAgB,WAAW,CAAC,EAAE,WAAW,EAAE,EAAE,gBAAgB,2CAwE5D"}

package/dist/panels/events-panel.js

@@ -0,0 +1,59 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useState, useSyncExternalStore } from "react";
+import { LABEL_STYLE, MINI_BUTTON, PANEL_BASE, SCROLLABLE_STYLE, TEXT_MUTED } from "../styles.js";
+const EVENT_COLORS = {
+    // canvas events — each action gets its own shade
+    "canvas:pointerdown": "#3b82f6", // blue
+    "canvas:pointerup": "#60a5fa", // light blue
+    "canvas:pointermove": "#93c5fd", // lighter blue
+    "canvas:wheel": "#2563eb", // dark blue
+    "canvas:middle-down": "#1d4ed8", // darker blue
+    // shape events
+    shape: "#4ade80", // green
+    // tool events
+    tool: "#fbbf24", // yellow
+    // selection events
+    selection: "#c084fc", // purple
+    // viewport events
+    viewport: "#f472b6", // pink
+    // command events
+    command: "#fb923c", // orange
+};
+const DEFAULT_EVENT_COLOR = "#a0a0a0";
+function eventColor(event) {
+    // Try exact match first, then prefix
+    return EVENT_COLORS[event] ?? EVENT_COLORS[event.split(":")[0]] ?? DEFAULT_EVENT_COLOR;
+}
+export function EventsPanel({ eventLogger }) {
+    const [filter, setFilter] = useState("");
+    const events = useSyncExternalStore(useCallback((cb) => eventLogger.subscribe(cb), [eventLogger]), () => eventLogger.getSnapshot());
+    const filtered = filter
+        ? events.filter((e) => e.event.toLowerCase().includes(filter.toLowerCase()))
+        : events;
+    return (_jsxs("div", { style: {
+            ...PANEL_BASE,
+            position: "absolute",
+            bottom: 8,
+            right: 8,
+            width: 280,
+            height: 240,
+            display: "flex",
+            flexDirection: "column",
+        }, children: [_jsxs("div", { style: {
+                    ...LABEL_STYLE,
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                }, children: [_jsxs("span", { children: ["Event Log (", filtered.length, ")"] }), _jsx("button", { type: "button", style: MINI_BUTTON, onClick: () => eventLogger.clear(), children: "Clear" })] }), _jsx("input", { type: "text", placeholder: "Filter events...", value: filter, onChange: (e) => setFilter(e.target.value), style: {
+                    background: "rgba(255, 255, 255, 0.08)",
+                    border: "1px solid rgba(255, 255, 255, 0.15)",
+                    borderRadius: 3,
+                    color: "#e0e0e0",
+                    fontFamily: "'SF Mono', monospace",
+                    fontSize: 10,
+                    padding: "3px 6px",
+                    outline: "none",
+                    marginBottom: 4,
+                } }), _jsx("div", { style: { ...SCROLLABLE_STYLE, flexGrow: 1 }, children: filtered.length === 0 ? (_jsx("div", { style: { color: TEXT_MUTED }, children: "No events" })) : ([...filtered].reverse().map((entry, i) => (_jsxs("div", { style: { color: eventColor(entry.event) }, children: [_jsxs("span", { style: { color: TEXT_MUTED }, children: [new Date(entry.timestamp).toLocaleTimeString(), " "] }), entry.event, entry.count > 1 && _jsxs("span", { style: { color: TEXT_MUTED }, children: [" (", entry.count, ")"] })] }, `${entry.timestamp}-${i}`)))) })] }));
+}
+//# sourceMappingURL=events-panel.js.map

package/dist/panels/events-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"events-panel.js","sourceRoot":"","sources":["../../src/panels/events-panel.tsx"],"names":[],"mappings":"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"}

package/dist/panels/general-panel.d.ts

@@ -0,0 +1,20 @@
+import type { BoardStore, CommandRegistry, EventBus, LayerManager, ShapeRegistry, ToolRegistry, Viewport } from "@edv4h/usketch-shared";
+import type { FpsCounter } from "../fps-counter.js";
+import type { PointerTracker } from "../pointer-tracker.js";
+import type { SyncStatusTrackerLike } from "../sync-status-types.js";
+interface GeneralPanelProps {
+    store: BoardStore;
+    fpsCounter: FpsCounter;
+    pointerTracker: PointerTracker;
+    commands: CommandRegistry;
+    tools: ToolRegistry;
+    layers: LayerManager;
+    shapes: ShapeRegistry;
+    syncStatus?: SyncStatusTrackerLike;
+    events: EventBus;
+    viewport: Viewport;
+    activeToolId: string;
+}
+export declare function GeneralPanel({ store, fpsCounter, pointerTracker, commands, tools, layers, shapes, syncStatus, events, viewport, activeToolId, }: GeneralPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=general-panel.d.ts.map

package/dist/panels/general-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"general-panel.d.ts","sourceRoot":"","sources":["../../src/panels/general-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,UAAU,EACV,eAAe,EACf,QAAQ,EACR,YAAY,EACZ,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,MAAM,uBAAuB,CAAC;AAG/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAW5D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAQrE,UAAU,iBAAiB;IAC1B,KAAK,EAAE,UAAU,CAAC;IAClB,UAAU,EAAE,UAAU,CAAC;IACvB,cAAc,EAAE,cAAc,CAAC;IAC/B,QAAQ,EAAE,eAAe,CAAC;IAC1B,KAAK,EAAE,YAAY,CAAC;IACpB,MAAM,EAAE,YAAY,CAAC;IACrB,MAAM,EAAE,aAAa,CAAC;IACtB,UAAU,CAAC,EAAE,qBAAqB,CAAC;IACnC,MAAM,EAAE,QAAQ,CAAC;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;CACrB;AA6BD,wBAAgB,YAAY,CAAC,EAC5B,KAAK,EACL,UAAU,EACV,cAAc,EACd,QAAQ,EACR,KAAK,EACL,MAAM,EACN,MAAM,EACN,UAAU,EACV,MAAM,EACN,QAAQ,EACR,YAAY,GACZ,EAAE,iBAAiB,2CA0MnB"}

package/dist/panels/general-panel.js

@@ -0,0 +1,75 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useEffect, useState, useSyncExternalStore } from "react";
+import { FpsGraph } from "../components/fps-graph.js";
+import { fmt, fpsColor, INLINE_INPUT, LABEL_STYLE, MINI_BUTTON, MINI_BUTTON_ACCENT, PANEL_BASE, SECTION_STYLE, } from "../styles.js";
+const DEFAULT_SYNC_SNAPSHOT = {
+    state: "loading",
+    shapeCount: 0,
+    lastSyncedAt: null,
+    error: null,
+};
+const SYNC_STATE_COLORS = {
+    loading: "#fbbf24",
+    synced: "#4ade80",
+    syncing: "#60a5fa",
+    error: "#f87171",
+};
+const SYNC_STATE_LABELS = {
+    loading: "Loading…",
+    synced: "Synced",
+    syncing: "Syncing…",
+    error: "Error",
+};
+function formatTimestamp(ts) {
+    if (ts === null)
+        return "—";
+    const d = new Date(ts);
+    return `${d.getHours().toString().padStart(2, "0")}:${d.getMinutes().toString().padStart(2, "0")}:${d.getSeconds().toString().padStart(2, "0")}`;
+}
+export function GeneralPanel({ store, fpsCounter, pointerTracker, commands, tools, layers, shapes, syncStatus, events, viewport, activeToolId, }) {
+    const fps = useSyncExternalStore(useCallback((cb) => fpsCounter.subscribe(cb), [fpsCounter]), () => fpsCounter.getSnapshot());
+    const pointer = useSyncExternalStore(useCallback((cb) => pointerTracker.subscribe(cb), [pointerTracker]), () => pointerTracker.getSnapshot());
+    const syncSnapshot = useSyncExternalStore(useCallback((cb) => (syncStatus ? syncStatus.subscribe(cb) : () => { }), [syncStatus]), () => syncStatus?.getSnapshot() ?? DEFAULT_SYNC_SNAPSHOT);
+    const canUndo = commands.canUndo();
+    const canRedo = commands.canRedo();
+    const historySize = commands.getHistorySize();
+    const historyCursor = commands.getCursor();
+    const toolCount = tools.getAll().size;
+    const layerCount = layers.getLayers().length;
+    const shapeTypeCount = shapes.getAll().size;
+    // GPU renderer stats (emitted by gpu-renderer plugin)
+    const [gpuStats, setGpuStats] = useState(null);
+    useEffect(() => {
+        return events.on("gpu-renderer:stats", setGpuStats);
+    }, [events]);
+    // Phase 2: viewport editing
+    const [editingViewport, setEditingViewport] = useState(false);
+    const [vpDraft, setVpDraft] = useState({ x: "", y: "", zoom: "" });
+    const startEditViewport = () => {
+        setVpDraft({ x: String(viewport.x), y: String(viewport.y), zoom: String(viewport.zoom) });
+        setEditingViewport(true);
+    };
+    const commitViewport = () => {
+        const x = Number.parseFloat(vpDraft.x);
+        const y = Number.parseFloat(vpDraft.y);
+        const zoom = Number.parseFloat(vpDraft.zoom);
+        if (!Number.isNaN(x) && !Number.isNaN(y) && !Number.isNaN(zoom) && zoom > 0) {
+            store.setViewport({ x, y, zoom });
+        }
+        setEditingViewport(false);
+    };
+    return (_jsxs("div", { style: {
+            ...PANEL_BASE,
+            position: "absolute",
+            top: 8,
+            right: 8,
+            width: 220,
+        }, children: [_jsxs("div", { style: SECTION_STYLE, children: [_jsxs("span", { style: { color: fpsColor(fps), fontWeight: "bold" }, children: [fps, " FPS"] }), _jsx(FpsGraph, { fpsCounter: fpsCounter })] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsxs("div", { style: LABEL_STYLE, children: ["Viewport", " ", !editingViewport && (_jsx("button", { type: "button", style: MINI_BUTTON, onClick: startEditViewport, children: "edit" }))] }), editingViewport ? (_jsxs("div", { style: { display: "flex", gap: 3, alignItems: "center" }, children: [_jsx("input", { style: INLINE_INPUT, value: vpDraft.x, onChange: (e) => setVpDraft((d) => ({ ...d, x: e.target.value })), onKeyDown: (e) => e.key === "Enter" && commitViewport() }), _jsx("input", { style: INLINE_INPUT, value: vpDraft.y, onChange: (e) => setVpDraft((d) => ({ ...d, y: e.target.value })), onKeyDown: (e) => e.key === "Enter" && commitViewport() }), _jsx("input", { style: { ...INLINE_INPUT, width: 36 }, value: vpDraft.zoom, onChange: (e) => setVpDraft((d) => ({ ...d, zoom: e.target.value })), onKeyDown: (e) => e.key === "Enter" && commitViewport() }), _jsx("button", { type: "button", style: MINI_BUTTON_ACCENT, onClick: commitViewport, children: "OK" })] })) : (_jsxs("div", { children: ["x: ", fmt(viewport.x), " y: ", fmt(viewport.y), " zoom: ", fmt(viewport.zoom)] }))] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsx("div", { style: LABEL_STYLE, children: "Active Tool" }), _jsx("div", { children: activeToolId })] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsx("div", { style: LABEL_STYLE, children: "Pointer" }), _jsxs("div", { children: ["world: (", fmt(pointer.world.x), ", ", fmt(pointer.world.y), ")"] }), _jsxs("div", { children: ["screen: (", fmt(pointer.screen.x), ", ", fmt(pointer.screen.y), ")"] })] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsxs("div", { style: LABEL_STYLE, children: ["History (", historyCursor + 1, "/", historySize, ")"] }), _jsxs("div", { style: { display: "flex", gap: 4 }, children: [_jsx("button", { type: "button", style: { ...MINI_BUTTON, opacity: canUndo ? 1 : 0.3 }, disabled: !canUndo, onClick: () => commands.undo(), children: "\u27F5 Undo" }), _jsx("button", { type: "button", style: { ...MINI_BUTTON, opacity: canRedo ? 1 : 0.3 }, disabled: !canRedo, onClick: () => commands.redo(), children: "Redo \u27F6" })] })] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsx("div", { style: LABEL_STYLE, children: "Persistence (Yjs + IndexedDB)" }), _jsxs("div", { style: { display: "flex", alignItems: "center", gap: 5 }, children: [_jsx("span", { style: {
+                                    display: "inline-block",
+                                    width: 7,
+                                    height: 7,
+                                    borderRadius: "50%",
+                                    background: SYNC_STATE_COLORS[syncSnapshot.state] ?? "#888",
+                                } }), _jsx("span", { style: { color: SYNC_STATE_COLORS[syncSnapshot.state] ?? "#888" }, children: SYNC_STATE_LABELS[syncSnapshot.state] ?? syncSnapshot.state })] }), _jsxs("div", { children: ["Shapes: ", syncSnapshot.shapeCount, " \u00B7 Last: ", formatTimestamp(syncSnapshot.lastSyncedAt)] }), syncSnapshot.error && (_jsx("div", { style: { color: "#f87171", fontSize: 10 }, children: syncSnapshot.error }))] }), _jsxs("div", { style: SECTION_STYLE, children: [_jsx("div", { style: LABEL_STYLE, children: "System" }), _jsxs("div", { children: ["Tools: ", toolCount, " \u00B7 Layers: ", layerCount, " \u00B7 Shape types: ", shapeTypeCount] })] }), _jsxs("div", { children: [_jsx("div", { style: LABEL_STYLE, children: "GPU Renderer" }), gpuStats ? (_jsxs("div", { children: [_jsx("div", { style: { color: "#4ade80" }, children: "Active" }), _jsxs("div", { children: ["GPU: ", gpuStats.gpuShapeCount, " (SDF: ", gpuStats.sdfCount, ", Lines:", " ", gpuStats.polylineCount, ")"] })] })) : (_jsx("div", { style: { color: "#888" }, children: "Inactive (DOM only)" }))] })] }));
+}
+//# sourceMappingURL=general-panel.js.map

package/dist/panels/general-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"general-panel.js","sourceRoot":"","sources":["../../src/panels/general-panel.tsx"],"names":[],"mappings":"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"}

package/dist/panels/shapes-panel.d.ts

@@ -0,0 +1,11 @@
+import type { BoardStore, CommandRegistry, ShapeData } from "@edv4h/usketch-shared";
+interface ShapesPanelProps {
+    store: BoardStore;
+    commands: CommandRegistry;
+    shapes: ReadonlyMap<string, ShapeData>;
+    selection: ReadonlySet<string>;
+    onHoverShape: (id: string | null) => void;
+}
+export declare function ShapesPanel({ store, commands, shapes, selection, onHoverShape, }: ShapesPanelProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=shapes-panel.d.ts.map

package/dist/panels/shapes-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shapes-panel.d.ts","sourceRoot":"","sources":["../../src/panels/shapes-panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAepF,UAAU,gBAAgB;IACzB,KAAK,EAAE,UAAU,CAAC;IAClB,QAAQ,EAAE,eAAe,CAAC;IAC1B,MAAM,EAAE,WAAW,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IACvC,SAAS,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC/B,YAAY,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AA4DD,wBAAgB,WAAW,CAAC,EAC3B,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,YAAY,GACZ,EAAE,gBAAgB,2CA2FlB"}

package/dist/panels/shapes-panel.js

@@ -0,0 +1,101 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+import { ACCENT_DIM, fmt, INLINE_INPUT, LABEL_STYLE, MINI_BUTTON, MINI_BUTTON_ACCENT, PANEL_BASE, SCROLLABLE_STYLE, shortId, TEXT_MUTED, } from "../styles.js";
+const KNOWN_KEYS = new Set(["id", "type", "x", "y", "width", "height", "style", "rotation"]);
+function EditableField({ label, value, onCommit, }) {
+    const [editing, setEditing] = useState(false);
+    const [draft, setDraft] = useState("");
+    const committedRef = useRef(false);
+    const start = () => {
+        committedRef.current = false;
+        setDraft(String(value));
+        setEditing(true);
+    };
+    const commit = () => {
+        if (committedRef.current)
+            return;
+        committedRef.current = true;
+        const n = Number.parseFloat(draft);
+        if (!Number.isNaN(n))
+            onCommit(n);
+        setEditing(false);
+    };
+    if (editing) {
+        return (_jsxs("span", { children: [label, ":", " ", _jsx("input", { style: { ...INLINE_INPUT, width: 44 }, value: draft, onChange: (e) => setDraft(e.target.value), onKeyDown: (e) => {
+                        if (e.key === "Enter")
+                            commit();
+                        if (e.key === "Escape")
+                            setEditing(false);
+                    }, onBlur: commit, 
+                    // biome-ignore lint/a11y/noAutofocus: debug tool inline edit needs immediate focus
+                    autoFocus: true })] }));
+    }
+    return (
+    // biome-ignore lint/a11y/useKeyWithClickEvents: debug tool
+    // biome-ignore lint/a11y/noStaticElementInteractions: debug tool
+    _jsxs("span", { onClick: start, style: { cursor: "text" }, title: "Click to edit", children: [label, ": ", fmt(value)] }));
+}
+export function ShapesPanel({ store, commands, shapes, selection, onHoverShape, }) {
+    const [expandedId, setExpandedId] = useState(null);
+    const shapeEntries = Array.from(shapes.values());
+    const updateField = (id, field, value) => {
+        const shape = store.getShape(id);
+        if (!shape)
+            return;
+        const from = { [field]: shape[field] };
+        const to = { [field]: value };
+        commands.execute({
+            execute: () => store.updateShape(id, to),
+            undo: () => store.updateShape(id, from),
+        });
+    };
+    const deleteShape = (id) => {
+        const snapshot = store.getShape(id);
+        if (!snapshot)
+            return;
+        commands.execute({
+            execute: () => store.deleteShape(id),
+            undo: () => store.addShape(snapshot),
+        });
+    };
+    return (_jsxs("div", { style: {
+            ...PANEL_BASE,
+            position: "absolute",
+            top: 8,
+            left: 8,
+            width: 240,
+            height: 300,
+            display: "flex",
+            flexDirection: "column",
+        }, children: [_jsxs("div", { style: LABEL_STYLE, children: ["Shapes (", shapes.size, ")"] }), _jsx("div", { style: { ...SCROLLABLE_STYLE, flexGrow: 1, maxHeight: "none" }, children: shapeEntries.length === 0 ? (_jsx("div", { style: { color: TEXT_MUTED }, children: "No shapes" })) : (shapeEntries.map((s) => {
+                    const isSelected = selection.has(s.id);
+                    const isExpanded = expandedId === s.id;
+                    return (
+                    // biome-ignore lint/a11y/noStaticElementInteractions: debug tool
+                    _jsxs("div", { onMouseEnter: () => onHoverShape(s.id), onMouseLeave: () => onHoverShape(null), children: [_jsxs("div", { onClick: () => setExpandedId(isExpanded ? null : s.id), style: {
+                                    padding: "2px 4px",
+                                    borderRadius: 3,
+                                    background: isSelected ? ACCENT_DIM : "transparent",
+                                    cursor: "pointer",
+                                    display: "flex",
+                                    justifyContent: "space-between",
+                                    alignItems: "center",
+                                }, children: [_jsxs("span", { children: [isExpanded ? "▾" : "▸", " ", shortId(s.id), " ", _jsx("span", { style: { color: TEXT_MUTED }, children: s.type })] }), _jsxs("span", { style: { color: TEXT_MUTED, fontSize: 9 }, children: ["(", fmt(s.x), ", ", fmt(s.y), ")"] })] }), isExpanded && (_jsx(ShapeDetail, { shape: s, store: store, selection: selection, onUpdate: updateField, onDelete: deleteShape }))] }, s.id));
+                })) })] }));
+}
+function ShapeDetail({ shape, store, selection, onUpdate, onDelete, }) {
+    const customKeys = Object.keys(shape).filter((k) => !KNOWN_KEYS.has(k));
+    return (_jsxs("div", { style: {
+            padding: "4px 8px",
+            fontSize: 10,
+            lineHeight: "16px",
+            borderLeft: `2px solid ${ACCENT_DIM}`,
+        }, children: [_jsxs("div", { style: { color: TEXT_MUTED }, children: ["id: ", shape.id] }), _jsxs("div", { style: { color: TEXT_MUTED }, children: ["type: ", shape.type] }), _jsxs("div", { children: [_jsx(EditableField, { label: "x", value: shape.x, onCommit: (v) => onUpdate(shape.id, "x", v) }), " ", _jsx(EditableField, { label: "y", value: shape.y, onCommit: (v) => onUpdate(shape.id, "y", v) })] }), _jsxs("div", { children: [_jsx(EditableField, { label: "w", value: shape.width, onCommit: (v) => onUpdate(shape.id, "width", v) }), " ", _jsx(EditableField, { label: "h", value: shape.height, onCommit: (v) => onUpdate(shape.id, "height", v) })] }), shape.rotation !== undefined && (_jsx("div", { children: _jsx(EditableField, { label: "rot", value: shape.rotation, onCommit: (v) => onUpdate(shape.id, "rotation", v) }) })), _jsxs("div", { style: { color: TEXT_MUTED, marginTop: 2 }, children: ["style: fill=", shape.style.fill, " stroke=", shape.style.stroke, " w=", shape.style.strokeWidth, " op=", shape.style.opacity] }), customKeys.length > 0 && (_jsxs("div", { style: { marginTop: 2 }, children: [_jsx("div", { style: { color: TEXT_MUTED }, children: "custom:" }), _jsx("pre", { style: {
+                            margin: 0,
+                            fontSize: 9,
+                            color: "#a0a0a0",
+                            whiteSpace: "pre-wrap",
+                            wordBreak: "break-all",
+                        }, children: JSON.stringify(Object.fromEntries(customKeys.map((k) => [k, shape[k]])), null, 1) })] })), _jsxs("div", { style: { display: "flex", gap: 4, marginTop: 4 }, children: [!selection.has(shape.id) && (_jsx("button", { type: "button", style: MINI_BUTTON_ACCENT, onClick: () => store.setSelection([shape.id]), children: "Select" })), _jsx("button", { type: "button", style: { ...MINI_BUTTON, color: "#f87171" }, onClick: () => onDelete(shape.id), children: "Delete" })] })] }));
+}
+//# sourceMappingURL=shapes-panel.js.map

package/dist/panels/shapes-panel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shapes-panel.js","sourceRoot":"","sources":["../../src/panels/shapes-panel.tsx"],"names":[],"mappings":"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"}

package/dist/plugin.d.ts

@@ -0,0 +1,3 @@
+import type { UsketchPlugin } from "@edv4h/usketch-shared";
+export declare const debugHudPlugin: UsketchPlugin;
+//# sourceMappingURL=plugin.d.ts.map

package/dist/plugin.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.d.ts","sourceRoot":"","sources":["../src/plugin.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAgC,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAkBzF,eAAO,MAAM,cAAc,EAAE,aAmE5B,CAAC"}

package/dist/plugin.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { DebugHud } from "./debug-hud.js";
+import { EventLogger } from "./event-logger.js";
+import { FpsCounter } from "./fps-counter.js";
+import { PointerTracker } from "./pointer-tracker.js";
+// Excluded from event log to avoid noise
+const EXCLUDED_EVENTS = new Set(["canvas:pointermove"]);
+function formatEventLabel(event, data) {
+    if (data == null || typeof data !== "object")
+        return event;
+    const obj = data;
+    if ("id" in obj && typeof obj.id === "string") {
+        return `${event} → ${obj.id}`;
+    }
+    return event;
+}
+export const debugHudPlugin = {
+    id: "debug-hud",
+    name: "Debug HUD",
+    setup(ctx) {
+        const fpsCounter = new FpsCounter();
+        const eventLogger = new EventLogger();
+        const pointerTracker = new PointerTracker();
+        // Start FPS counter
+        fpsCounter.start();
+        // Monkey-patch emit to capture events
+        const originalEmit = ctx.events.emit.bind(ctx.events);
+        ctx.events.emit = (event, data) => {
+            if (!EXCLUDED_EVENTS.has(event)) {
+                const label = formatEventLabel(event, data);
+                eventLogger.push({ event: label, timestamp: Date.now() });
+            }
+            originalEmit(event, data);
+        };
+        // Track pointer coordinates
+        const unsubPointer = ctx.events.on("canvas:pointermove", (data) => {
+            pointerTracker.update(data.worldPoint, data.screenPoint);
+        });
+        // Pick up sync status tracker from window (set by app.tsx)
+        const syncStatus = globalThis.__usketchSyncStatus;
+        // Register the fixed layer — always renders, visibility toggled inside component
+        ctx.layers.register({
+            id: "debug-hud",
+            order: 9999,
+            fixed: true,
+            render: (renderCtx) => (_jsx(DebugHud, { store: ctx.store, fpsCounter: fpsCounter, eventLogger: eventLogger, pointerTracker: pointerTracker, commands: ctx.commands, tools: ctx.tools, layers: ctx.layers, shapes: ctx.shapes, syncStatus: syncStatus, events: ctx.events, ctx: renderCtx })),
+        });
+        // Store teardown in closure — no module-level state
+        this.teardown = () => {
+            fpsCounter.stop();
+            pointerTracker.dispose();
+            ctx.events.emit = originalEmit;
+            unsubPointer();
+            ctx.layers.unregister("debug-hud");
+        };
+    },
+    teardown() {
+        // overwritten by setup()
+    },
+};
+//# sourceMappingURL=plugin.js.map

package/dist/plugin.js.map

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

package/dist/pointer-tracker.d.ts

@@ -0,0 +1,16 @@
+import type { Point } from "@edv4h/usketch-shared";
+export interface PointerState {
+    world: Point;
+    screen: Point;
+}
+export declare class PointerTracker {
+    private state;
+    private listeners;
+    private pending;
+    private timer;
+    update(world: Point, screen: Point): void;
+    subscribe(listener: () => void): () => void;
+    getSnapshot(): PointerState;
+    dispose(): void;
+}
+//# sourceMappingURL=pointer-tracker.d.ts.map

package/dist/pointer-tracker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pointer-tracker.d.ts","sourceRoot":"","sources":["../src/pointer-tracker.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAC;AAEnD,MAAM,WAAW,YAAY;IAC5B,KAAK,EAAE,KAAK,CAAC;IACb,MAAM,EAAE,KAAK,CAAC;CACd;AAID,qBAAa,cAAc;IAC1B,OAAO,CAAC,KAAK,CAAmE;IAChF,OAAO,CAAC,SAAS,CAAyB;IAC1C,OAAO,CAAC,OAAO,CAAS;IACxB,OAAO,CAAC,KAAK,CAA8C;IAE3D,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,GAAG,IAAI;IAczC,SAAS,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI;IAK3C,WAAW,IAAI,YAAY;IAI3B,OAAO,IAAI,IAAI;CAIf"}

package/dist/pointer-tracker.js

@@ -0,0 +1,33 @@
+const THROTTLE_MS = 100;
+export class PointerTracker {
+    state = { world: { x: 0, y: 0 }, screen: { x: 0, y: 0 } };
+    listeners = new Set();
+    pending = false;
+    timer = null;
+    update(world, screen) {
+        this.state = { world, screen };
+        if (!this.pending) {
+            this.pending = true;
+            this.timer = setTimeout(() => {
+                this.pending = false;
+                this.timer = null;
+                for (const listener of this.listeners) {
+                    listener();
+                }
+            }, THROTTLE_MS);
+        }
+    }
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return () => this.listeners.delete(listener);
+    }
+    getSnapshot() {
+        return this.state;
+    }
+    dispose() {
+        if (this.timer)
+            clearTimeout(this.timer);
+        this.listeners.clear();
+    }
+}
+//# sourceMappingURL=pointer-tracker.js.map

package/dist/pointer-tracker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"pointer-tracker.js","sourceRoot":"","sources":["../src/pointer-tracker.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,GAAG,GAAG,CAAC;AAExB,MAAM,OAAO,cAAc;IAClB,KAAK,GAAiB,EAAE,KAAK,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;IACxE,SAAS,GAAG,IAAI,GAAG,EAAc,CAAC;IAClC,OAAO,GAAG,KAAK,CAAC;IAChB,KAAK,GAAyC,IAAI,CAAC;IAE3D,MAAM,CAAC,KAAY,EAAE,MAAa;QACjC,IAAI,CAAC,KAAK,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,IAAI,CAAC,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE;gBAC5B,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;gBACrB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;gBAClB,KAAK,MAAM,QAAQ,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;oBACvC,QAAQ,EAAE,CAAC;gBACZ,CAAC;YACF,CAAC,EAAE,WAAW,CAAC,CAAC;QACjB,CAAC;IACF,CAAC;IAED,SAAS,CAAC,QAAoB;QAC7B,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC7B,OAAO,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC9C,CAAC;IAED,WAAW;QACV,OAAO,IAAI,CAAC,KAAK,CAAC;IACnB,CAAC;IAED,OAAO;QACN,IAAI,IAAI,CAAC,KAAK;YAAE,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACzC,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;IACxB,CAAC;CACD"}

package/dist/styles.d.ts

@@ -0,0 +1,24 @@
+import type React from "react";
+export declare const PANEL_BG = "rgba(0, 0, 0, 0.82)";
+export declare const PANEL_BORDER_RADIUS = 8;
+export declare const PANEL_BLUR = "blur(8px)";
+export declare const FONT_FAMILY = "'SF Mono', 'Fira Code', 'Consolas', monospace";
+export declare const TEXT_COLOR = "#e0e0e0";
+export declare const TEXT_MUTED = "#6b7280";
+export declare const TEXT_LABEL = "#8b8b8b";
+export declare const ACCENT = "rgba(99, 102, 241, 0.8)";
+export declare const ACCENT_DIM = "rgba(99, 102, 241, 0.3)";
+export declare const FPS_GREEN = "#4ade80";
+export declare const FPS_YELLOW = "#fbbf24";
+export declare const FPS_RED = "#f87171";
+export declare const PANEL_BASE: React.CSSProperties;
+export declare const LABEL_STYLE: React.CSSProperties;
+export declare const SECTION_STYLE: React.CSSProperties;
+export declare const SCROLLABLE_STYLE: React.CSSProperties;
+export declare const MINI_BUTTON: React.CSSProperties;
+export declare const MINI_BUTTON_ACCENT: React.CSSProperties;
+export declare const INLINE_INPUT: React.CSSProperties;
+export declare function fpsColor(fps: number): string;
+export declare function fmt(n: number): string;
+export declare function shortId(id: string): string;
+//# sourceMappingURL=styles.d.ts.map

package/dist/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,eAAO,MAAM,QAAQ,wBAAwB,CAAC;AAC9C,eAAO,MAAM,mBAAmB,IAAI,CAAC;AACrC,eAAO,MAAM,UAAU,cAAc,CAAC;AACtC,eAAO,MAAM,WAAW,kDAAkD,CAAC;AAC3E,eAAO,MAAM,UAAU,YAAY,CAAC;AACpC,eAAO,MAAM,UAAU,YAAY,CAAC;AACpC,eAAO,MAAM,UAAU,YAAY,CAAC;AACpC,eAAO,MAAM,MAAM,4BAA4B,CAAC;AAChD,eAAO,MAAM,UAAU,4BAA4B,CAAC;AACpD,eAAO,MAAM,SAAS,YAAY,CAAC;AACnC,eAAO,MAAM,UAAU,YAAY,CAAC;AACpC,eAAO,MAAM,OAAO,YAAY,CAAC;AAEjC,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,aAW9B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,aAI/B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,aAEjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,aAKpC,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,aAS/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,aAGtC,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,aAUhC,CAAC;AAEF,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAI5C;AAED,wBAAgB,GAAG,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAErC;AAED,wBAAgB,OAAO,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAE1C"}

package/dist/styles.js

@@ -0,0 +1,77 @@
+export const PANEL_BG = "rgba(0, 0, 0, 0.82)";
+export const PANEL_BORDER_RADIUS = 8;
+export const PANEL_BLUR = "blur(8px)";
+export const FONT_FAMILY = "'SF Mono', 'Fira Code', 'Consolas', monospace";
+export const TEXT_COLOR = "#e0e0e0";
+export const TEXT_MUTED = "#6b7280";
+export const TEXT_LABEL = "#8b8b8b";
+export const ACCENT = "rgba(99, 102, 241, 0.8)";
+export const ACCENT_DIM = "rgba(99, 102, 241, 0.3)";
+export const FPS_GREEN = "#4ade80";
+export const FPS_YELLOW = "#fbbf24";
+export const FPS_RED = "#f87171";
+export const PANEL_BASE = {
+    background: PANEL_BG,
+    color: TEXT_COLOR,
+    fontFamily: FONT_FAMILY,
+    fontSize: 11,
+    lineHeight: "16px",
+    borderRadius: PANEL_BORDER_RADIUS,
+    backdropFilter: PANEL_BLUR,
+    padding: 10,
+    pointerEvents: "auto",
+    userSelect: "none",
+};
+export const LABEL_STYLE = {
+    color: TEXT_LABEL,
+    fontSize: 10,
+    marginBottom: 2,
+};
+export const SECTION_STYLE = {
+    marginBottom: 6,
+};
+export const SCROLLABLE_STYLE = {
+    maxHeight: 200,
+    overflowY: "auto",
+    fontSize: 10,
+    lineHeight: "14px",
+};
+export const MINI_BUTTON = {
+    border: "none",
+    borderRadius: 4,
+    background: "rgba(255, 255, 255, 0.1)",
+    color: TEXT_COLOR,
+    fontSize: 10,
+    fontFamily: FONT_FAMILY,
+    cursor: "pointer",
+    padding: "2px 6px",
+};
+export const MINI_BUTTON_ACCENT = {
+    ...MINI_BUTTON,
+    background: ACCENT_DIM,
+};
+export const INLINE_INPUT = {
+    background: "rgba(255, 255, 255, 0.08)",
+    border: "1px solid rgba(255, 255, 255, 0.15)",
+    borderRadius: 3,
+    color: TEXT_COLOR,
+    fontFamily: FONT_FAMILY,
+    fontSize: 10,
+    padding: "1px 4px",
+    width: 50,
+    outline: "none",
+};
+export function fpsColor(fps) {
+    if (fps >= 50)
+        return FPS_GREEN;
+    if (fps >= 30)
+        return FPS_YELLOW;
+    return FPS_RED;
+}
+export function fmt(n) {
+    return Number.isInteger(n) ? String(n) : n.toFixed(1);
+}
+export function shortId(id) {
+    return id.length > 8 ? `${id.slice(0, 8)}…` : id;
+}
+//# sourceMappingURL=styles.js.map

package/dist/styles.js.map

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

package/dist/sync-status-types.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Structural types matching SyncStatusTracker from @edv4h/usketch-store.
+ * Defined locally to avoid adding a dependency on the store package.
+ */
+export type SyncState = "loading" | "synced" | "syncing" | "error";
+export interface SyncStatusSnapshot {
+    state: SyncState;
+    shapeCount: number;
+    lastSyncedAt: number | null;
+    error: string | null;
+}
+export interface SyncStatusTrackerLike {
+    getSnapshot(): SyncStatusSnapshot;
+    subscribe(listener: () => void): () => void;
+}
+//# sourceMappingURL=sync-status-types.d.ts.map

package/dist/sync-status-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sync-status-types.d.ts","sourceRoot":"","sources":["../src/sync-status-types.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE,MAAM,WAAW,kBAAkB;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,qBAAqB;IACrC,WAAW,IAAI,kBAAkB,CAAC;IAClC,SAAS,CAAC,QAAQ,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAAC;CAC5C"}

package/dist/sync-status-types.js

@@ -0,0 +1,6 @@
+/**
+ * Structural types matching SyncStatusTracker from @edv4h/usketch-store.
+ * Defined locally to avoid adding a dependency on the store package.
+ */
+export {};
+//# sourceMappingURL=sync-status-types.js.map

package/dist/sync-status-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sync-status-types.js","sourceRoot":"","sources":["../src/sync-status-types.ts"],"names":[],"mappings":"AAAA;;;GAGG"}

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@edv4h/usketch-plugin-debug-hud",
+  "version": "1.0.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "source": "./src/index.ts",
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "dependencies": {
+    "@edv4h/usketch-shared": "1.0.0"
+  },
+  "peerDependencies": {
+    "react": ">=19"
+  },
+  "devDependencies": {
+    "@types/react": "19.2.14",
+    "typescript": "5.9.3",
+    "vitest": "3.2.4"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/EdV4H/usketch.git",
+    "directory": "plugins/usketch-plugin-debug-hud"
+  },
+  "homepage": "https://github.com/EdV4H/usketch#readme",
+  "bugs": {
+    "url": "https://github.com/EdV4H/usketch/issues"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run --passWithNoTests",
+    "clean": "rm -rf dist"
+  }
+}