mirror of
https://github.com/PerpetualSoftware/pad.git
synced 2026-09-22 10:33:27 +00:00
771d102e89
* feat(web): 2D directional dependency-graph renderer (TASK-1783)
Add ItemGraph.svelte — a reusable, self-contained component that renders a
single item's dependency neighborhood as a 2D layered graph (parents above,
children below) via dagre layout + SVG.
- Lazy-imports @dagrejs/dagre so the layout lib stays out of the main
bundle (confirmed split into its own chunk).
- Fetches via api.graph.getFocused; re-roots on an internal currentFocus so
clicking a non-focus node navigates the chain, clicking the focus node (or
Open ↗) opens it. Depth (1–5) selector + include-done toggle; breadcrumb
back to the original root.
- Edge styling by type (hierarchy tethers, red directional blocks arrows,
faint wiki-link dashes, muted others); collection-colored nodes with
focus highlight + dimmed terminals; pan/zoom + fit-to-content; legend and
a truncation notice.
- Reactivity follows CONVE-1688 (loadToken guard, no read+write of one rune
in an effect) and CONVE-606 (data-load effect split from prop-sync).
Extract the collection palette into a shared $lib/graph/palette.ts and point
the 3D workspace graph at it too, so both views agree on collection colors.
Parent: PLAN-1780.
* fix(web): correct hierarchy layout direction + node border color-mix per Codex review (round 1)
- P1: 'parent'/'implements' edges are child→parent in the API, so feeding
them to dagre as-is put children above parents under rankdir TB. Reverse
those edges for layout ranking only; rendered edges keep true source→target
so 'blocks' arrowheads still point correctly.
- P2: unfocused node border used a JS string literal with an un-interpolated
{n.color}, yielding an invalid CSS color and a dropped stroke. Use a
template literal so the collection tint actually applies.
Parent: PLAN-1780.
71 lines
2.0 KiB
JSON
71 lines
2.0 KiB
JSON
{
|
|
"name": "web",
|
|
"private": true,
|
|
"version": "0.0.1",
|
|
"license": "Apache-2.0",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite dev",
|
|
"build": "vite build",
|
|
"preview": "vite preview",
|
|
"prepare": "svelte-kit sync || echo ''",
|
|
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
|
|
"test:e2e": "playwright test",
|
|
"test:e2e:ui": "playwright test --ui",
|
|
"test:e2e:install": "playwright install --with-deps chromium"
|
|
},
|
|
"devDependencies": {
|
|
"@playwright/test": "^1.59.1",
|
|
"@sveltejs/adapter-auto": "^7.0.1",
|
|
"@sveltejs/adapter-static": "^3.0.10",
|
|
"@sveltejs/kit": "^2.59.1",
|
|
"@sveltejs/vite-plugin-svelte": "^7.1.2",
|
|
"@types/d3-scale": "4.0.9",
|
|
"@types/qrcode": "^1.5.6",
|
|
"marked": "^18.0.3",
|
|
"svelte": "^5.55.5",
|
|
"svelte-check": "^4.4.7",
|
|
"typescript": "^6.0.3",
|
|
"vite": "^8.0.11"
|
|
},
|
|
"overrides": {
|
|
"cookie": "^0.7.2",
|
|
"layercake": {
|
|
"typescript": "$typescript"
|
|
}
|
|
},
|
|
"dependencies": {
|
|
"@dagrejs/dagre": "3.0.0",
|
|
"@tiptap/core": "^3.22.5",
|
|
"@tiptap/extension-bubble-menu": "^3.22.5",
|
|
"@tiptap/extension-code-block-lowlight": "^3.22.5",
|
|
"@tiptap/extension-collaboration": "3.22.5",
|
|
"@tiptap/extension-collaboration-caret": "3.22.5",
|
|
"@tiptap/extension-link": "^3.22.5",
|
|
"@tiptap/extension-placeholder": "^3.22.5",
|
|
"@tiptap/extension-table": "^3.22.5",
|
|
"@tiptap/extension-task-item": "^3.22.5",
|
|
"@tiptap/extension-task-list": "^3.22.5",
|
|
"@tiptap/pm": "^3.20.4",
|
|
"@tiptap/starter-kit": "^3.22.5",
|
|
"@tiptap/suggestion": "^3.22.5",
|
|
"@tiptap/y-tiptap": "^3.0.3",
|
|
"3d-force-graph": "1.80.0",
|
|
"d3-scale": "4.0.2",
|
|
"diff": "^9.0.0",
|
|
"dompurify": "^3.4.2",
|
|
"idb": "^8.0.3",
|
|
"layercake": "10.0.2",
|
|
"lowlight": "^3.3.0",
|
|
"mermaid": "^11.14.0",
|
|
"minisearch": "7.2.0",
|
|
"qrcode": "^1.5.4",
|
|
"svelte-dnd-action": "^0.9.69",
|
|
"three-spritetext": "1.10.0",
|
|
"tiptap-markdown": "^0.9.0",
|
|
"y-protocols": "^1.0.7",
|
|
"yjs": "^13.6.30"
|
|
}
|
|
}
|