Branch
Flip between regenerated versions of a reply.
Branch lets people move between alternative versions of a message (regenerations or edits) with a small “2 / 3” control; the version slides in from the direction you moved.
Preview
Centralize tax in tax(): zero without a tax ID, cent-rounded otherwise. Both the API and PDFs call it; two new tests lock the behavior in.
Installation
pnpm dlx shadcn@latest add https://ui.cuelark.com/r/branch.jsonThe CLI also installs the Cuelark theme tokens, the GSAP motion layer. With the @cuelark namespace configured, use @cuelark/branch.
Builds on: motion
Usage
import { Branch } from "@/components/ui/branch";
<Branch versions={[<p>v1</p>, <p>v2</p>]} />Motion
Versions slide in from the side you navigated toward.
Scale it with --cl-motion (0 off, 1 default, 1.5 expressive) on any ancestor. Reduced-motion preferences always switch it off.
API reference
Branch
| Prop | Type | Default | Description |
|---|---|---|---|
| versions | ReactNode[] | — | Alternatives. |
| defaultIndex · onIndexChange | number | — | Selection. |
Accessibility
- Fully keyboard operable with visible focus.
- Live regions announce streaming updates politely.
FAQ
Also searched as: message branching ui · regenerate response versions · chatgpt version switcher · shadcn ai branch