## Roadmap Votes (S—384)

A public roadmap: ideas under review, planned, in progress and shipped, with upvotes, sorting, and a suggestion box.

- URL: https://sundaeui.dev/components/roadmap-votes
- Category: UI components · Art direction: Refined
- Access: Free (no account needed)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/roadmap-votes.json`
- Tags: voting, changelog, product, feature-requests, feedback, roadmap

Each tab lists items with a vote button and count. Sort by top or newest. Shipped items show when they went out instead of a vote.
Suggestions land in Under review with your vote already counted, and the tab count updates.

### Usage

```tsx
import { RoadmapVotes } from '@/components/sundae/roadmap-votes'

<RoadmapVotes />
```

### Props

- `items` (`{ id: string; title: string; stage: string; votes: number; age: number }[]`, required): Roadmap items.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Product sites, community portals, in-app feedback.

### When not to use

- Private internal planning.

### Accessibility

- Stages are tabs with counts; votes are toggle buttons with the count in the label.
- New suggestions are announced.
- Reduced motion removes the movement and keeps every state change.