## Vote Arrows (S—089)

Up / down vote control where the score rolls in the vote’s direction and the chosen arrow fills.

- URL: https://sundaeui.dev/components/vote-arrows
- 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/vote-arrows.json`
- Tags: vote, social, counter, forum, upvote, score

Upvote and the arrow fills and nudges upward while the score rolls up; downvote mirrors it. Clicking your current vote again removes it.
Works vertically for forums and horizontally for compact rows.

### Usage

```tsx
import { VoteArrows } from '@/components/sundae/vote-arrows'

<VoteArrows />
```

### Props

- `score` (`number`, required): Score before the user’s vote.
- `vote / defaultVote` (`-1 | 0 | 1`, default `0`): The user’s vote.
- `onVote` (`(v: -1 | 0 | 1) => void`): Called on change.
- `orientation` (`'vertical' | 'horizontal'`, default `'vertical'`): Layout.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Forums, Q&A, feature-request boards, comment threads.

### When not to use

- Simple likes: use a single toggle.

### Accessibility

- Two toggle buttons with aria-pressed; the score is announced politely.
- Reduced motion removes the movement and keeps every state change.