Code, diagrams & maps
Rich, interactive content blocks for technical and spatial UIs.
Code
- CodeEditor — a full Monaco editor with syntax highlighting; two-way bindable via bindKey.
- DiffEditor — a side-by-side diff (original vs modified).
Diagrams
- Mermaid — text-defined diagrams: flowchart, sequence, class, gantt, ER.
- FlowCanvas — an interactive node/edge graph with auto-layout — DAGs, lineage, org charts.
- FlowChart — a simpler flowchart from declarative steps.
- ForceGraph — a force-directed graph for relationships/networks.
Maps
- Map — an interactive map with markers and pan/zoom for locations and geodata.
Markdown & embeds
- Markdown — rendered GitHub-flavored markdown (tables, code, lists).
- Html — a raw HTML fallback for content that doesn't map to a brick (used by URL import).
Heavy bricks like the code editor and maps load on demand, so pages that don't use them stay light.