feat(ui): multi-graph mosaic dashboard with persistent layout#64
Merged
Conversation
Replace single-canvas-with-view-toggle home page with a recursive
binary split-tree mosaic that hosts 1–4 DependencyGraph panes.
Each pane has its own view selector, reset, add and close controls
in a draggable header; layout (open panes + sizes in %) persists to
localStorage under forgeplan-web:layout:v1.
Drag semantics:
- Pane header onto another pane's center → swap views (sizes kept).
- Pane header onto another pane's edge → move (remove source +
insert at target's edge).
- Splitter pointer/keyboard drag → resize, clamped [10..90]%.
Layout model lives under template/src/widgets/mosaic/ (FSD widget):
- model/{types,tree}.ts pure tree ops with vitest coverage (20 tests).
- lib/{drag,persist}.ts module-level drag payload (workaround for the
spec-mandated empty getData during dragover) + 5 quadrant tests.
- ui/{MosaicCanvas,MosaicNodeView,PaneFrame,Splitter,DropOverlay}.svelte
recursive render via 3-track CSS Grid (a% 0px b% with overlay
splitter) — no JS layout math at render time.
A11y: splitters expose role=separator with arrow-key resize, pane
headers are toolbar with tabindex=-1, drag fallback writes text/plain
so the operation initialises in browsers that require non-empty data.
Refs: PRD-016, RFC-015, EVID-020
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
5 tasks
5 tasks
explosivebit
added a commit
that referenced
this pull request
May 6, 2026
… light theme (#65) ## Summary Bundles three feature streams from develop into v0.1.12: - **F18 Time-travel slider — SINGLE mode** (PR #63) — `/api/snapshot?at=ISO`, `/api/timeline-events`, `widgets/timeline/`, canvas snapshot hydration. PRD-008 / RFC-007 / EVID-020 active. - **`init --experimental` flag** (PR #60) — opt-in to esbuild single-file bundle, ~9× smaller `dist/`. PRD-014 / RFC-013 / EVID-018 active. Closes the verification ask in #59. - **Multi-graph mosaic dashboard** (PR #64) — split-pane layout with persistent layout, addresses #61. - **Version display footer** (PR #57) — `getForgeplanVersion()` + `compareSemver`. PRD-012 / RFC-011 / EVID-016 active. - **Shared UI primitives + npm update notification** (PR #58) — modal manager + update checker. PRD-013 / RFC-012 / EVID-017 active. - **Light theme** (PR #62) — dual-token CSS + `data-theme` attribute. PRD-015 / RFC-014 / EVID-019 active. COMPARE mode for time-travel (Alt-drag two scrubbers + diff overlay) intentionally deferred — endpoint returns 501 with TODO marker. ## Why Five feature PRs accumulated on develop since v0.1.11 (May 6). Cutting them as a single minor-patch release rather than gating on the v0.2.0 milestone (full proactive-surfacer arc) keeps the cadence steady and ships the bundle-size win + multi-graph layout to users now. ## Test plan - [x] `npm run check` — 0 errors / 0 warnings across 486 files - [x] `npx vitest run` — 14 files / 127 tests pass - [x] PR #63 CI matrix (3 OS, node 22) — green before merge - [ ] release/v0.1.12 CI matrix — pending on this PR - [ ] Manual smoke after tag → GitHub Release fires `release.yml` workflow ## Refs PRDs activated since v0.1.11: PRD-008, PRD-012, PRD-013, PRD-014, PRD-015. RFCs activated: RFC-007, RFC-011, RFC-012, RFC-013, RFC-014. Evidence: EVID-016 / EVID-017 / EVID-018 / EVID-019 / EVID-020. 🤖 Generated with [Claude Code](https://claude.com/claude-code)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Replace single-canvas-with-view-toggle home page with a recursive binary split-tree mosaic that hosts 1–4 DependencyGraph panes. Each pane has its own view selector, reset, add and close controls in a draggable header; layout (open panes + sizes in %) persists to localStorage under forgeplan-web:layout:v1.
Drag semantics:
insert at target's edge).
Layout model lives under template/src/widgets/mosaic/ (FSD widget):
A11y: splitters expose role=separator with arrow-key resize, pane headers are toolbar with tabindex=-1, drag fallback writes text/plain so the operation initialises in browsers that require non-empty data.
Refs: PRD-016, RFC-015, EVID-020