Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA reaction button that opens a ring of emoji on click or long press, toggles your reaction, and shows each reaction's count with who reacted. Use this when a message or post takes quick reactions.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it on messages, comments and posts where reacting should be one gesture on a phone (long press) and one click on a desktop, without a full emoji picker.
Do not use it when people can use any emoji. Use an emoji picker with search.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
reactions | { id, emoji, label }[] | 6 reactions | What the ring offers. |
counts | Record<string, number> | - | How many people chose each reaction. |
value | string[] | - | Reactions you chose (controlled). |
defaultValue | string[] | [] | Initial reactions. |
onValueChange | (ids: string[]) => void | - | Runs when you toggle a reaction. |
longPressMs | number | 450 | Touch hold time that opens the ring. |
menu of menuitemcheckbox items with aria-checked; labels are words (Celebrate), the emoji is aria-hidden.Celebrate, 3 reactions, you reacted that toggle the reaction too.longPressMs opens the ring; a short tap on React opens it as well, so touch does not depend on timing.The pattern ships with a Testing Library test (radial-quick-reactions.test.tsx) that covers opening, toggling by keyboard, the totals and long press.