Diagram node

Compact typed node for concept graphs, architecture sketches, and agent explainers.

Diagram nodes are primary graph entities. Use role to clarify category and keep labels short.

Playground

Props in the URL.

Controls update query params directly, so every primitive state can be linked, rendered, and screenshotted deterministically.

Loading playground.

States

Every state maps to the same render route through the `state` query param.

Default

Node role atlas.

Selected

Selected node state.

Muted

Subdued background node state.

Props

Name	Type	Default	Description
`title *`	`ReactNode`	-	Primary node label.
`meta`	`ReactNode`	-	Compact secondary label.
`role`	`'boundary' \| 'compute' \| 'data' \| 'decision' \| 'error' \| 'external' \| 'process'`	`process`	Node semantic category.
`selected`	`boolean`	`false`	Selected canvas state.
`muted`	`boolean`	`false`	Background canvas state.