# Shadcn Whiteboard blocks

> Excalidraw whiteboards for shadcn/ui: design reviews with export and versions, and sprint planning with capacity lanes.

- Type: Pro blocks (Application)
- Page: https://web.dev.reui.io/blocks/application/whiteboard
- Blocks: 2
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## When to use

- Design reviews, retros and user flow sketches on a hand drawn canvas inside your product
- Sprint planning on a shared canvas where lanes of cards total their points against capacity
- An Excalidraw editor themed by your shadcn tokens that autosaves and opens or saves board files

## When not to use

- A bordered panel with a header band around dense data, with nothing to draw on: use [Frame](https://web.dev.reui.io/components/frame.md) (`get_component("frame")`)
- An editable graph of connected steps, each with its own settings inspector: use the [Flow blocks](https://web.dev.reui.io/blocks/application/flow.md)
- Sprint work as cards dragged between stage columns, with no drawing canvas: use the [Kanban Board blocks](https://web.dev.reui.io/blocks/application/kanban-board.md)

## Agent notes

- `loadBoard` returns a demo scene and `saveBoard` only waits on a timer; wire both to your storage, as `onSave` hands over the whole scene
- Pin `@excalidraw/excalidraw` to 0.18.1: later releases rename the API and the editor DOM that the `Whiteboard` kit hides and proxies
- Each page.tsx gives the board an `h-svh` wrapper and the board fills its parent; inside an app shell give that parent a height in place of it

## Third-party libraries

- Excalidraw: [API reference](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api), [docs](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/integration), used by 2 of 2 blocks
- Motion v12: [API reference](https://motion.dev/docs/react-motion-component), [docs](https://motion.dev/docs/react), used by 2 of 2 blocks (the docs follow the latest Motion, with no React API break since v12)
- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started), used by 2 of 2 blocks

## Blocks

- [Design Review Board](https://web.dev.reui.io/blocks/application/whiteboard/whiteboard-1.md): Excalidraw Whiteboard for shadcn/ui with Frames, Presence, Templates and Versions. Best for a design review board with restorable saved versions, a shape library fed from the selection and PNG or SVG export with a preview.
- [Sprint Planning Board](https://web.dev.reui.io/blocks/application/whiteboard/whiteboard-2.md): Excalidraw Sprint Planning Board with Capacity Lanes, Presence, Follow Mode and Decision Log. Best for a sprint planning room with planning poker votes on a card, lane point totals against capacity and a plan summary copied as Markdown.

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.
