# @blinksgg/canvas — TODO ## Known Gaps _(None currently)_ ## v3.x Roadmap - ~~React Compiler integration~~ ✅ (v3.0.0) - **v3.1 — Remaining Phase 1 cleanup** — remove `useMemo`/`useCallback` from `Minimap.tsx`, `db/provider.tsx`, `useSplitGesture.ts` (see `plan-react19-canvas-optimization.md`) - **v3.2 — Ref cleanup callbacks** — adopt React 19 ref cleanup in `Viewport.tsx` - **v3.3 — Dev Overlay** — floating debug panel with graph stats, event log, perf metrics - **v3.4 — Multi-user Cursors** — realtime cursor presence for collaborative editing ## Open Issues _(None currently)_ ## Completed in v3.0.0 - **React Compiler** — integrated `babel-plugin-react-compiler` + `@vitejs/plugin-react` - **Removed all manual memoization** — 6 `useCallback` + 3 `useMemo` across 5 files - **Peer deps** — `react`/`react-dom` `^19.0.0` → `^19.2.0` - **Version** — 1.0.0 → 3.0.0 ## Completed in v2.5.0 - **First React hook integration tests** — `renderHook` from `@testing-library/react` - **4 new test suites** — `animated-layout` (9), `useActionExecutor-hook` (6), `usePlugin-hook` (5), `useLayout-hook` (4) - **Exported `easeInOutCubic`** from `useAnimatedLayout.ts` for independent testing ## Completed in v2.4.0 - **4 new test suites** — `drag-state-machine` (11), `action-types-enums` (9), `event-types-enums` (10), `gesture-rules-types` (6) ## Completed in v2.3.0 - **5 new test suites** — `actions-node`, `actions-viewport`, `modifier-helpers`, `pointer-bindings-v2`, `plugin-types` (34 tests) ## Completed in v2.2.0 - **Split `built-in-actions.ts`** (342L → 44L barrel) into `actions-node.ts` + `actions-viewport.ts` - **6 new test suites** — keyboard-bindings, gesture-classification, viewport-commands, serialization-commands, store-atoms, command-executor (38 tests) ## Completed in v2.1.0 - **2 new test suites** — `command-line-store` (11), `storage-adapter` (10) ## Completed in v2.0.0 - **Renamed `gesturesV2` → `gestures`** — clean namespace - **Removed deprecated re-exports** — `action-executor`, `settings-store` test suites added ## Completed in v1.2.0 - **Plugin system** — unified `CanvasPlugin` manifest with dependency resolution, conflict detection, atomic registration/rollback, and lifecycle hooks - **4 new files** — `plugin-types.ts`, `plugin-registry.ts`, `edge-path-registry.ts`, `usePlugin.ts` - **Canvas auto-routing** — `renderNode` now optional; node type registry resolves components by `node_type` - **`unregisterNodeType()`** — per-type removal for clean plugin teardown - **2 new test suites** — `plugin-registry` (28 tests), `edge-path-registry` (8 tests) ## Completed in v1.1.0 - **Split `useRegisterInputActions.ts`** (528L → 259L) — extracted `input-action-helpers.ts` with pure store helpers for navigation, selection, mutation, and escape logic - **Split `useCanvasGestures.ts`** (667L → 518L) — extracted `useGuardContext.ts` and `useInertia.ts` for guard context and inertia management - **2 new test suites** — `input-action-helpers` (28 tests), `useInertia` (5 tests) - **8 bug fixes** — WeakMap cache isolation, mutation queue clearing, balanced startMutation counts, config threading, localStorage namespacing, and more ## Completed in v1.0.0 - **API Stability audit** — all 219+ atoms verified for `{noun}{Verb}Atom` naming; `docs/api-stability.md` classifying all 8 entry points - **Migration guide** — `docs/migration-v1.md` covering breaking changes from v0.x → v1.0 - **Peer dep cleanup** — `peerDependenciesMeta` marking d3-force, @blocknote/*, @tanstack/react-query as optional - **Hook test coverage** — 3 new test suites for useNodeDrag, useNodeResize, useForceLayout atoms - **Version bump** — package.json, index.ts, CHANGELOG.md, README.md all at 1.0.0 ## Completed in v0.36.0 - **Split `contexts.ts`** (614L → 100L) into `keyboard-contexts.ts` + `pointer-contexts.ts` - **3 new test suites** — gesture-specificity, gesture-mapper, gesture-dispatcher (~30 tests) ## Completed in v0.35.0 - **3 new test suites** — gesture-inertia, timed-state, gesture-normalize (+26 tests) - Covers VelocitySampler, PanInertia, ZoomInertia, timed state machine, modifier extraction ## Completed in v0.34.0 - **Split `useNodeDrag.ts`** — extracted drag types into `hooks/drag-types.ts` - **2 new test suites** — gesture-rules-defaults, keyboard-shortcuts (+13 tests) ## Completed in v0.33.0 - **Split `settings-store.ts`** — extracted presets + utility into `settings-presets.ts` - **1 new test suite** — settings-presets (+9 tests) ## Completed in v0.32.0 - **Split `history-store.ts`** — extracted pure delta functions into `history-actions.ts` - **2 new test suites** — history-actions, group-store-utils (+21 tests) ## Completed in v0.31.0 - **Split `commands/store.ts`** into state atoms + action atoms - **3 new test suites** — commands-registry, commands-executor, commands-store (+31 tests, 670 total) ## Completed in v0.30.0 - **Split `gesture-rules.ts`** into types + defaults + resolver - **3 new test suites** — sync-store, gesture-rule-store, gesture-configs (+32 tests, 639 total) ## Completed in v0.29.0 - **Split `action-registry.ts`** into registry + built-in-actions - **4 new test suites** — graph-mutations-edges, graph-mutations-advanced, debug, component-registry (+32 tests, 607 total) ## Completed in v0.28.0 - **Split `graph-mutations.ts`** into 3 modules (node, edge, advanced) - **4 new test suites** — layout, hit-test, action-executor, mutation-queue (+33 tests, 575 total) ## Completed in v0.27.0 - **4 new test suites** — settings-store, edge-path-calculators, snap-store, locked-node-store (+53 tests, 542 total) - **`history-types.ts`** — modularized history type definitions ## Completed in v0.26.0 - **Minimap edges** — draw edge lines between node centers - **Fuzzy search** — multi-token, edge labels/types, EdgeRenderer integration - **Smart alignment guides** — node-to-node snapping with AlignmentGuides component - **Clipboard cut** — now deletes nodes with undo support (489 tests, 36 files) ## Completed in v0.25.0 - **8 new test suites** — graph-mutations, graph-derived, graph-position, action-registry, interaction-store, reduced-motion, external-keyboard, toast (474 total across 35 files) - **Split TouchActionButton** — 559 → 3 files (icons, RadialMenu, index) ## Completed in v0.24.0 - **`prefers-reduced-motion`** — atom + CSS + 3 JS consumers (inertia, layout, edge fade) - **Undo/redo in FAB** — primary actions with UndoIcon/RedoIcon - **Safe-area margins** — ViewportControls + TouchActionButton - **Cursor hiding** — `@media (pointer: coarse)` + `data-canvas-root` - **External keyboard detection** — hides FAB when modifier keys available ## Completed in v0.23.0 - **Slimmed barrel** — `core/index.ts` 458 → 85 lines (`export *` for all modules) - **Removed deprecated** — `findPortAtPosition`, `resolveGestureIntent`, `isBackgroundGesture` ## Completed in v0.22.0 - **Split `graph-store.ts`** — 914 → 68 lines, 3 new modules (`graph-position`, `graph-derived`, `graph-mutations`) ## Completed in v0.21.0 - **Unified logging** — 33 `console.*` → `createDebug` with `.warn()/.error()` sub-loggers ## Completed in v0.20.0 - **`atomFamily` migration** — `jotai/utils` → `jotai-family` (jotai v3 ready) - **Dead `CanvasConfig` type removed** — stale Supabase fields - **`hitTestNode` / `hitTestPort`** — testable hit-test utilities replacing DOM coupling ## Completed in v0.17.0 - **EdgePreviewLine** — animated SVG bezier preview during drag - **Drag-from-port** — click port to start edge creation - **Port snap visual** — glow + scale on compatible ports during drag - **`canConnect` validation** — callback to reject invalid connections ## Completed in v0.16.0 - **Deprecated export removal** — `resolveGestureIntent`, legacy gesture configs, `useSupabaseClient`, Supabase provider props - **README refresh** — Gesture System v2, Performance, updated architecture - **TODO cleanup** — removed shipped items, added real roadmap ## Completed in v0.15.0 - **Spatial grid index** — `SpatialGrid` for O(visible) node culling in virtualization - **Edge structural equality** — `_edgeCache` prevents re-renders when data hasn't changed - **`uiNodesAtom` structural equality** — previous array reuse when entries match - **Performance instrumentation** — `canvasMark`/`canvasWrap` with opt-in `setPerfEnabled` - **Gestures subpath export** — `@blinksgg/canvas/gestures` for code splitting - **17 new tests** — spatial-index (12), perf (5) ## Completed in v0.14.0 - **Gesture System v2** — unified pointer + keyboard input pipeline with 4-layer architecture - **Specificity-scored binding resolution** — patterns scored by type, key, subjectKind, modifier, source, button - **Built-in mapping contexts** — palm rejection, active interaction, search, keyboard navigate/manipulate, default - **Held keys + custom modifiers** — `HeldKeysState`, `Modifiers.custom` for non-keyboard flags - **Phase-aware action handlers** — `PhaseHandler` with onStart/onMove/onEnd/onInstant/onCancel - **5 new test suites** — specificity, mapper, timed-state, palm-rejection, inertia ## Completed in v0.13.0 - **Undo/redo for structural operations** — split, merge, nest, group, ungroup all push history snapshots - **Undo/redo toast** — `CanvasToast` shows operation label on Ctrl+Z/Y - **Tree layout** — `useTreeLayout` hook + `treeLayout`/`horizontalLayout` commands - **Grid layout** — `useGridLayout` hook + `gridLayout` command - **Animated layout transitions** — `useAnimatedLayout` shared hook with cubic easing - **Zoom inertia** — momentum after pinch-to-zoom lifts - **Snap-to-100% zoom** — detent at 1.0x zoom - **Simultaneous pan during pinch** — fluid two-finger gestures - **Tap pulse on controls** — `canvas-tap-pulse` CSS animation - **19 new tests** — 404 total ## Completed in v0.12.0 - **Drag-to-nest** — drag a node over another to nest; `dropTargetNodeIdAtom`, `nestNodesOnDropAtom`, drop-target highlight CSS - **Two-finger split** — diverging fingers split a node into two copies with duplicated edges; `splitNodeAtom`, `useSplitGesture` - **Merge nodes** — `Ctrl+M` merges selected nodes; edges re-routed, internal edges discarded; `mergeNodesAtom`, `mergeNodesCommand` - **`split-node` gesture intent** — pinch-on-node now maps to split instead of zoom - **18 new tests** — 385 total ## Completed in v0.11.0 - **Nested group drag** — `getNodeDescendants` helper + `useNodeDrag` expands initialPositions to include all descendants - **Edge creation/deletion animations** — `departingEdgesAtom` + `removeEdgeWithAnimationAtom` for fade-out; CSS fade-in for new edges - **Edge label editing** — `editingEdgeLabelAtom` + `updateEdgeLabelAtom` + `EdgeLabelEditor` component with inline HTML input - **`edgeFamilyAtom` reactivity fix** — now depends on `graphUpdateVersionAtom` for non-position attribute changes - **14 new tests** — 367 total ## Completed in v0.10.0 - **Edge re-routing** — `collapsedEdgeRemapAtom` maps collapsed children to outermost collapsed ancestor; edges re-route to group node - **Group auto-resize** — `autoResizeGroupAtom` recomputes group bounding box on drag end - **Search keyboard shortcuts** — Ctrl+F, Enter/Shift+Enter, Ctrl+G, Escape - **Edge search dimming** — edges dim with 150ms transition when neither endpoint matches - **Search highlight pulse** — amber box-shadow animation on highlighted result - **`CanvasAnimations`** component — CSS keyframe injection - **11 new tests** — 353 total ## Completed in v0.9.0 - **Abstract persistence** — `CanvasStorageAdapter` interface, `SupabaseStorageAdapter`, `InMemoryStorageAdapter`, `storageAdapterAtom` - **Node grouping** — `parentId` on nodes, `GroupNode` component, collapse/expand, group commands - **Search & filter** — `searchQueryAtom`, `searchResultsAtom`, node dimming, search commands - **Component tests** — 39 React component tests (Canvas, Node, Viewport, Minimap, SelectionOverlay, GroupNode) - **89 new tests** — 342 total ## Completed in v0.8.0 - **Minimap** — ``-based overview with draggable viewport rectangle - **Lasso selection** — pencil freeform selection with point-in-polygon test - **Rect selection** — Shift+drag rectangle selection with AABB intersection - **Zoom animations** — `animateZoomToNodeAtom`, `animateFitToBoundsAtom` with cubic easing - **`useZoomTransition`** — rAF-based animation hook - **39 new tests** — selection-path-store + zoom-transition ## Completed in v0.7.0 - **Arrow key navigation** — spatial navigation between nodes with Tab cycling and focus ring - **Edge re-render optimization** — O(connected edges) per drag frame instead of O(all edges) - **Test coverage** — 47 → 214 tests covering all core stores + headless API - **Headless API** — `createCanvasAPI(store)` for full programmatic control without React - **Doc consolidation** — PRINCIPLES.md + single README.md + TODO.md