Dialogue Box

dialogue-box

WorldReadycomponent

A conversation panel with speaker, portrait, body text, and response choices.

npx shadcn@latest add @gamecn/dialogue-box

Live Preview

Rendered with the component style selected in the top-right selector.

Frame

Scale100%

The beacon went dark before the second bell. If you cross now, keep your signal close.

Examples

Basic setup, game-state usage, and customization paths.

Install Dialogue Box and render it with the default GameCN treatment.

npx shadcn@latest add @gamecn/dialogue-box

import { DialogueBox } from '@/components/ui/dialogue-box'

Use Dialogue Box with richer game-state data such as variants, empty states, compact density, or critical states.

<DialogueBox
  className="max-w-md"
/>

Swap artwork, tune tokens, and wire the installed copy to your live game state.

<DialogueBox
  iconSrc="/game-assets/dialogue-box.png"
/>