Reactions is the row under a post, a comment or a message: a chip per reaction in use with how many people left it, and an add button that opens every option above it. Pressing a chip adds the viewer's reaction or takes it back. Each reaction moves in its own way (a heart beats, a thumbs-up nods, a laugh shakes, fire flickers), and a pick sends a few copies flying out of the chip. It takes the same props as the web Reactions, so the two apps can share their reaction code.
counts includes the viewer's own reaction, as value has it. A pick moves the numbers at once, before the server answers; when new counts arrive they take over, and the viewer is never counted twice.
multiple lets a person leave several reactions, as in chat; value is then a list. size="s" fits under a message bubble, and effect="float" lifts one larger copy away instead of the burst.
Give an option src to use an image instead of an emoji, such as an uploaded animated WebP or GIF, and motion to choose its gesture ("none" when the image already moves). Store the value, not the image, so a reaction's picture can change later. A counted value that options no longer lists still shows. To draw a reaction any other way, such as with Lottie or expo-image, pass renderGlyph.
Animated GIF and WebP play in React Native's Image on iOS. On Android, Expo builds play animated GIF; animated WebP needs expo.webp.animated=true in android/gradle.properties, or expo-image through renderGlyph.
One reaction on its own, with its gesture. It plays each time it is pressed (trigger="hover", core's name for it), every few seconds (loop), or when playKey changes (manual).
The gestures are beat, nod, shake, pop, droop, flicker, spin, wave and bounce, the same keyframes as on the web, played with the native driver. With reduce motion turned on in the device settings nothing moves, and the reactions still change at once.
- There is no hover: a Reaction with trigger="hover" plays when pressed, and a chip plays when tapped.
- The picker opens in a Modal above the add button, like DropdownWrapper.
- The count rises into place instead of rolling digit by digit.