Diagrams

Generated from mcp/patterns.registry.json — do not edit by hand; change the registry and run bun run patterns:build.

Index card — the docs below are the canonical explanation; deep-tier pattern pages additionally carry invariants and emulation notes.

Category: Data Viz · Tier: light · Risk: low — frontend only

@xyflow/svelte-based flow and state diagram components with custom node types for interactive node-edge visualizations.

When to use: Use when building an interactive flowchart or state-machine diagram that needs draggable, connectable nodes.

Docs

• docs/stack/capabilities/viz.md (GitHub · GitLab)

Code

• src/lib/components/viz/diagram/ (GitHub · GitLab)

Proof

• /showcases/viz/diagrams

Machine-readable record: viz-diagrams in mcp/patterns.registry.json.