# TUI Lookbook (https://jackin.tailrocks.com/reference/tui/lookbook/)



The TUI lookbook is the contributor-facing catalog for shared `jackin-tui`
components. Each preview is generated by the `tui-lookbook` binary in
<RepoFile path="crates/jackin-tui-lookbook/src/main.rs">crates/jackin-tui-lookbook/src/main.rs</RepoFile> from the component
stories in <RepoFile path="crates/jackin-tui-lookbook/src/stories.rs">crates/jackin-tui-lookbook/src/stories.rs</RepoFile> using
Ratatui's `TestBackend`, then committed under `docs/public/tui-lookbook/`.
Generated previews render on a black terminal background so the docs match the
normal terminal experience instead of a browser default page colour.

Open the same stories in a real terminal:

```bash
cargo run -p jackin-tui-lookbook -- --terminal
```

Regenerate the previews after changing a shared component:

```bash
cargo run -p jackin-tui-lookbook -- docs/public/tui-lookbook
```

Verify the committed previews without rewriting them:

```bash
cargo run -p jackin-tui-lookbook -- --check docs/public/tui-lookbook
```

## Stories [#stories]

* [BrandHeader](/reference/tui/lookbook/brand-header/)
* [Panel](/reference/tui/lookbook/panel/)
* [ButtonStrip](/reference/tui/lookbook/button-strip/)
* [TabStrip](/reference/tui/lookbook/tab-strip/)
* [ConfirmDialog](/reference/tui/lookbook/confirm-dialog/)
* [ErrorDialog](/reference/tui/lookbook/error-dialog/)
* [SaveDiscardDialog](/reference/tui/lookbook/save-discard-dialog/)
* [StatusPopup](/reference/tui/lookbook/status-popup/)
* [FilterInput](/reference/tui/lookbook/filter-input/)
* [HintBar](/reference/tui/lookbook/hint-bar/)
* [SelectList](/reference/tui/lookbook/select-list/)
* [ScrollablePanel](/reference/tui/lookbook/scrollable-panel/)
* [StatusFooter](/reference/tui/lookbook/status-footer/)
* [TextInput](/reference/tui/lookbook/text-input/)
* [Toast](/reference/tui/lookbook/toast/)

## Coverage rule [#coverage-rule]

Every new shared `jackin-tui` component must ship with both lookbook surfaces:
a docs preview page backed by generated SVG, and a terminal story visible through
`tui-lookbook --terminal`. A component without both previews is not catalogued.