stroblmeandClaude Fable 5
0af09eedbe
One shell for both editors. Flows and dashboards each get a searchable
overview under the padded shell, their editors move to the full-bleed
canvas, and the floating chrome is shared: a title bar that only says
what you are looking at, and a bottom dock carrying everything else —
the flow bar's status, settings and Publish moved down there, the
add-flow button moved to the overview.
Dashboards gain the rest of M4's visualization work:
- widgets are picked by clicking them, with the header as the drag
handle so a slider still slides and a switch still flips while
editing; settings moved into the flows' SidePanel
- react-grid-layout for drag and edge-resize, so the stored x/y finally
mean something; a dashboard nobody arranged is shelf-packed once
- a per-dashboard grid size, so a panel can be matched to its screen
- the chart widget, drawn with uPlot: several messages on one axis, fed
from the stored history plus the live socket tail, coloured from the
new --chart-1..5 ramp
- /view/{name}: the URL a wall panel is pointed at — no sidebar, no
footer, no editing, and no editor code, since routes are split
- a widget wired to a payload type it cannot carry, or wired to nothing
at all, carries the same red dot a failing node does; the picker
records the type it bound and WidgetDef refuses a mismatch on save
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01H7LwYgJfpkbLCTeiAf8U4A
77 lines
2.4 KiB
JSON
77 lines
2.4 KiB
JSON
{
|
|
"name": "frontend",
|
|
"private": true,
|
|
"version": "0.0.0",
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "tsc -p tsconfig.build.json && vite build",
|
|
"lint": "biome check --write --unsafe --no-errors-on-unmatched --files-ignore-unknown=true ./",
|
|
"preview": "vite preview",
|
|
"generate-client": "openapi-ts",
|
|
"test": "bunx playwright test",
|
|
"test:ui": "bunx playwright test --ui"
|
|
},
|
|
"dependencies": {
|
|
"@hookform/resolvers": "^5.2.2",
|
|
"@monaco-editor/react": "^4.7.0",
|
|
"@radix-ui/react-avatar": "^1.1.11",
|
|
"@radix-ui/react-checkbox": "^1.3.3",
|
|
"@radix-ui/react-dialog": "^1.1.15",
|
|
"@radix-ui/react-dropdown-menu": "^2.1.16",
|
|
"@radix-ui/react-label": "^2.1.8",
|
|
"@radix-ui/react-popover": "^1.1.23",
|
|
"@radix-ui/react-radio-group": "^1.3.8",
|
|
"@radix-ui/react-scroll-area": "^1.2.10",
|
|
"@radix-ui/react-select": "^2.2.6",
|
|
"@radix-ui/react-separator": "^1.1.8",
|
|
"@radix-ui/react-slot": "^1.2.4",
|
|
"@radix-ui/react-switch": "^1.3.7",
|
|
"@radix-ui/react-tabs": "^1.1.13",
|
|
"@radix-ui/react-tooltip": "^1.2.8",
|
|
"@tailwindcss/vite": "^4.1.18",
|
|
"@tanstack/react-query": "^5.90.12",
|
|
"@tanstack/react-query-devtools": "^5.91.1",
|
|
"@tanstack/react-router": "^1.157.3",
|
|
"@tanstack/react-router-devtools": "^1.156.0",
|
|
"@tanstack/react-table": "^8.21.3",
|
|
"@xyflow/react": "^12.11.3",
|
|
"axios": "1.13.2",
|
|
"class-variance-authority": "^0.7.1",
|
|
"clsx": "^2.1.1",
|
|
"cmdk": "^1.1.1",
|
|
"form-data": "4.0.5",
|
|
"lucide-react": "^0.562.0",
|
|
"monaco-editor": "^0.56.0",
|
|
"motion": "^13.0.0",
|
|
"next-themes": "^0.4.6",
|
|
"radix-ui": "^1.6.7",
|
|
"react": "^19.1.1",
|
|
"react-dom": "^19.2.3",
|
|
"react-error-boundary": "^6.0.0",
|
|
"react-grid-layout": "^2.2.4",
|
|
"react-hook-form": "^7.68.0",
|
|
"react-icons": "^5.5.0",
|
|
"sonner": "^2.0.7",
|
|
"tailwind-merge": "^3.4.0",
|
|
"tailwindcss": "^4.1.17",
|
|
"uplot": "^1.6.32",
|
|
"zod": "^4.3.6"
|
|
},
|
|
"devDependencies": {
|
|
"@biomejs/biome": "^2.3.12",
|
|
"@hey-api/openapi-ts": "0.73.0",
|
|
"@playwright/test": "1.58.0",
|
|
"@tanstack/router-devtools": "^1.142.11",
|
|
"@tanstack/router-plugin": "^1.140.0",
|
|
"@types/node": "^25.0.10",
|
|
"@types/react": "^19.2.7",
|
|
"@types/react-dom": "^19.2.3",
|
|
"@vitejs/plugin-react-swc": "^4.2.2",
|
|
"dotenv": "^17.2.3",
|
|
"tw-animate-css": "^1.4.0",
|
|
"typescript": "^5.9.3",
|
|
"vite": "^7.3.0"
|
|
}
|
|
}
|