component
Chips
Poker chips colored by size in big blinds, a chip stack with its amount, and the pot.
A chip's color steps up with its size in big blinds. ChipStack has a pill variant for the replayer and a table variant for bets in front of a seat.
2.5bb12bb7bb
Installation
$ npx shadcn@latest add https://www.pokerstudy.ai/r/chips.jsonGenerative UI
A model can draw this with json-render. Install generative UI and spread its definitions into your catalog. The model reads the description and the schema below, and answers with a spec like the example.
ChipStack
A chip colored by its size in big blinds, with the amount beside it. Use for bets and stacks.
12bb
Props
Generated from the component source with react-docgen-typescript.
Chip
| Prop | Type | Default | Description |
|---|---|---|---|
| color | string | – | – |
| size | number | 24 | – |
| value * | number | – | – |
ChipStack
| Prop | Type | Default | Description |
|---|---|---|---|
| amount * | number | – | – |
| className | string | "" | – |
| color | string | – | Face color. The table variant defaults to a red chip. |
| label | string | – | Amount text; omit to render the chip only. |
| size | number | 24 | – |
| variant | "pill" | "table" | pill | `table` is a red chip with the amount beside it. `pill` is the replayer chip. |
PotChips
| Prop | Type | Default | Description |
|---|---|---|---|
| amount * | number | – | – |
| size | number | 24 | – |