feat(optimize): Diagram Doctor panel to declutter tangled flowcharts
Add an Optimize side panel that analyses the active flowchart and applies one-click, reversible source rewrites to make dense graphs readable. - optimize.ts: pure, label-aware flowchart parser + metrics, a 0-100 readability score, and transforms — ELK layered layout, node/rank spacing + curved edges, de-emphasising cross-cutting hub edges (event bus / audit / cost-style fan-ins), duplicate-edge removal, direction toggle, and a non-destructive focus variant. - mermaid.ts: register @mermaid-js/layout-elk so `layout: elk` renders. - OptimizePanel.svelte + Toolbar toggle; panels are mutually exclusive. - Preview: render the focus variant when a node is spotlighted, with a clear-focus pill. - store/Editor: applySource() bumps a revision so programmatic rewrites re-sync CodeMirror and stay undoable with the editor's history.
This commit is contained in:
@@ -128,10 +128,12 @@
|
||||
return () => view?.destroy();
|
||||
});
|
||||
|
||||
// When a different diagram is loaded, replace the whole document. Depend only
|
||||
// on activeId; read content untracked so typing doesn't reset the editor.
|
||||
// Replace the whole document when a different diagram is loaded (activeId) or
|
||||
// when content is swapped programmatically (revision, e.g. an applied
|
||||
// optimization). Read content untracked so plain typing never resets it.
|
||||
$effect(() => {
|
||||
void store.activeId; // re-run only when the selected diagram changes
|
||||
void store.activeId; // re-run when the selected diagram changes…
|
||||
void store.revision; // …or when an optimization rewrites the source.
|
||||
if (!view) return;
|
||||
untrack(() => {
|
||||
const incoming = store.content;
|
||||
|
||||
Reference in New Issue
Block a user