# Shadcn Emoji Reactions

> Emoji reaction rating

- Type: example, free and open source (MIT)
- Component: [Rating](https://reui.io/components/rating.md)
- Page: https://reui.io/components/rating/c-rating-8
- Docs (Base UI): https://reui.io/docs/components/base/rating.md
- Docs (Radix UI): https://reui.io/docs/components/radix/rating.md
- MCP: `get_example("c-rating-8")`
- Registry item: https://reui.io/r/styles/base-nova/c-rating-8.json

## Best for

A 5 face scale from Terrible to Amazing on plain buttons, naming the chosen mood under the row

## Agent notes

- Built on plain buttons over the `emojis` list, not `Rating`, and the pick stays in local `selected` state until you send it
- Each button is named by its emoji alone and marks the pick with styling only; give it its `label` text and a pressed state

## Install

```bash
npx shadcn@latest add @reui/c-rating-8
```

## About Shadcn Rating

### When to use

- Read only star scores at 3 sizes, with partial stars for averages such as 3.5 or 4.6
- Star inputs that collect a whole star score in feedback and written review forms
- Review summaries with a count bar per star level, and 5 step emoji scales for quick feedback

### When not to use

- A full product page section of buyer quotes, avatars and a ratings overview: use the [Review blocks](https://reui.io/blocks/ecommerce/review.md)
- A required score that keyboard and screen reader users must be able to set: use [Radio Group](https://reui.io/components/radio-group.md) (`get_component("radio-group")`)
- A score picked in half or finer steps rather than whole stars: use [Slider](https://reui.io/components/slider.md) (`get_component("slider")`)

### Agent notes

- An `editable` `Rating` takes pointer clicks only: each star is a `div` with an `onClick` and no role, tab stop or key handler
- Clicks send whole numbers from 1 to `maxRating` to `onRatingChange`; a decimal `rating` draws a partial star but cannot be picked
- `starClassName` styles the `showValue` number, not the stars; recolor stars from `className` through the `rating-star-filled` slot

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.