KQ-861 · REACT/BURST

React Burst

A row of reaction chips that answers the press. Taking a reaction bursts its drawn mark from 1.32 back to 1 on recoil while a ring the size of the chip drains on the exit ease and the count rolls in one grid cell on snap; withdrawing shrinks the mark on flick with no ring, and a chip that reaches zero leaves while the row re-flows on glide. Arrow keys move across the chips under a roving tabindex, Home and End jump, and Enter or Space toggles the reaction under the cursor.

KQ-861 · REACT/BURST

Marta07:12

Gate B is clear from eight. Two pallets for the Basinworks run and one loose crate that never got a label.

Spark 2 · Agree 1 · Lift 1 · Watching 1 · yours Lift

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/react-burst

Props

reactions: ReactionTally[]; default —; The seeded tallies: id, label, glyph and the other people on each reaction.
mine / defaultMine: string[]; default []; Controlled or initial list of reaction ids you have taken.
onMineChange: (mine: string[]) => void; default —; Fires with the whole next list on every press.
onReact: (id: string, reacted: boolean) => void; default —; Fires with the reaction pressed and whether it is now yours.
maxNames: number; default 3; Names printed before the card reads "and 4 more".
disabled: boolean; default false; Holds every chip while the row stays readable.
label: string; default —; Names the reaction row for assistive technology.

Prop	Type	Default	Description
reactions	ReactionTally[]	—	The seeded tallies: id, label, glyph and the other people on each reaction.
mine / defaultMine	string[]	[]	Controlled or initial list of reaction ids you have taken.
onMineChange	(mine: string[]) => void	—	Fires with the whole next list on every press.
onReact	(id: string, reacted: boolean) => void	—	Fires with the reaction pressed and whether it is now yours.
maxNames	number	3	Names printed before the card reads "and 4 more".
disabled	boolean	false	Holds every chip while the row stays readable.
label	string	—	Names the reaction row for assistive technology.