KQ-904 · HAND/RAISE

Hand Raise

A hand, raised. Pressing the control sends the glyph out of the button and into the queue rail on a shared layoutId prefixed by useId, travelling on recoil for ζ0.53's two visible bounces, while a chevron cross-fades into the slot it left and the label becomes Lower. The rail is an ordered list in flow whose height a ResizeObserver measures and glide opens from zero, and your place is frozen at the moment you raise, so later arrivals queue behind you and a hand lowering ahead moves you up.

KQ-904 · HAND/RAISE

2 hands raised

1st in line, Marta Reis
2nd in line, Rui Alvez

Hand down · 2 raised

Install

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

$ pnpm dlx shadcn@latest add @kinetiq/hand-raise

Props

queue: RaisedHand[]; default —; Everyone but you, in raise order, each with an id and a name.
raised / defaultRaised: boolean; default false; Controlled or initial state of your own hand.
onRaisedChange: (raised: boolean) => void; default —; Fires from the button, from Space and from Enter.
onPositionChange: (position: number) => void; default —; Fires with your 1-based place in the queue, or 0 once your hand is down.
youName: string; default "You"; How your own entry is listed in the rail.
youId: string; default "you"; The id your entry carries so a host can reconcile it.
maxVisible: number; default 5; Hands drawn before the rail folds the rest into a count; your own is never folded away.
disabled: boolean; default false; Holds the button; the rail still lists and still reads.
label: string; default "Raise your hand"; Names the group for assistive technology.

Prop	Type	Default	Description
queue	RaisedHand[]	—	Everyone but you, in raise order, each with an id and a name.
raised / defaultRaised	boolean	false	Controlled or initial state of your own hand.
onRaisedChange	(raised: boolean) => void	—	Fires from the button, from Space and from Enter.
onPositionChange	(position: number) => void	—	Fires with your 1-based place in the queue, or 0 once your hand is down.
youName	string	"You"	How your own entry is listed in the rail.
youId	string	"you"	The id your entry carries so a host can reconcile it.
maxVisible	number	5	Hands drawn before the rail folds the rest into a count; your own is never folded away.
disabled	boolean	false	Holds the button; the rail still lists and still reads.
label	string	"Raise your hand"	Names the group for assistive technology.