ReactFlow v12 requires a 'dark' CSS class on the component to activate
dark theme variables. Without it, controls SVGs are invisible (dark on
dark) and the minimap mask uses white (light theme default).
Also fix library views (table, grid, list) to use getTreeEditorPath()
instead of hardcoding /trees/:id/edit, which sent procedural/maintenance
flows to the wrong editor.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* docs: add React Flow migration design for flow editor canvas
Replaces hand-built CSS flexbox canvas with @xyflow/react for zoom/pan,
dagre auto-layout, collapsible minimap, and side-panel editing.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* docs: add React Flow migration implementation plan
12 tasks across 8 phases covering dagre layout, custom nodes,
side panel editor, and full canvas integration.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* chore: install @xyflow/react and @dagrejs/dagre
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add dagre layout utility for React Flow node positioning
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add FlowCanvasNode compact card for React Flow canvas
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add FlowCanvasAnswerNode stub card for React Flow canvas
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add useTreeLayout hook for tree-to-ReactFlow conversion with dagre
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add NodeEditorPanel side panel for React Flow canvas editing
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add FlowCanvas main React Flow component with zoom/pan/minimap
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: wire FlowCanvas and NodeEditorPanel into TreeEditorLayout
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: add panel state management for node editor in TreeEditorPage
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* style: add React Flow dark theme overrides for canvas
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* chore: export new React Flow canvas components from barrel
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix: enable scrolling in node editor panel sidebar
Add min-h-0 to flex containers in the ancestor chain so overflow-y-auto
actually triggers instead of content overflowing off-screen.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix: constrain tree editor page height to prevent panel overflow
Add overflow-hidden to TreeEditorPage root and NodeEditorPanel container
so the flex height chain is properly constrained by the CSS Grid cell,
preventing the node editor sidebar from growing beyond the viewport.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix: resolve lint errors in NodeEditorPanel and useTreeLayout
- Fix unused 'children' destructuring with _children prefix
- Move handleClose declaration above the useEffect that references it
- Use handleClose as proper dependency instead of eslint-disable
- Fix unused _parentId parameter type in useTreeLayout
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* fix: use viewport-based height for node editor panel
Replace h-full with calc(100vh - 105px) to bypass the CSS height chain
that fails to constrain the panel across browsers. The 105px accounts
for the topbar (56px) and editor toolbar (49px).
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* style: fix canvas controls visibility and enhance dot grid background
- Add !important to all React Flow dark theme overrides to ensure they
win over library default styles (fixes white controls rectangle)
- Add SVG fill inheritance for control button icons
- Use slightly lighter canvas background (bg-accent/30) so dot grid
is more visible
- Increase dot size and use muted-foreground color for better contrast
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
* feat: collapse sidebar categories with show more/less toggle
Show only the first 4 categories by default with a "N more" button
to expand the full list. Reduces sidebar clutter when many categories
exist.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---------
Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
