<!-- source-hash: 69f5a0ba80b7e510b67573e50f546e85 -->
A pure-presentational thumbs-up / thumbs-down vote button used within `RoadmapCard`'s default variant. Renders an icon with an optional vote count; all interaction logic is delegated to the parent via `onClick`.

## Key Components

| Export | Type | Description |
|--------|------|-------------|
| `RoadmapVoteButtonProps` | `interface` | Prop contract for the button |
| `RoadmapVoteButton` | `function` | Styled outline button with thumb icon and count |

### Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `voteType` | `'up' \| 'down'` | — | Selects `ThumbsUpIcon` or `ThumbsDownIcon` |
| `count` | `number` | — | Vote tally displayed next to the icon |
| `isActive` | `boolean` | — | Applies active background when the user has voted |
| `onClick` | `() => void` | — | Click handler supplied by parent (e.g. `useRoadmapVoting`) |
| `disabled` | `boolean` | `false` | Disables interaction and applies reduced opacity |
| `showCount` | `boolean` | `true` | Toggles count label visibility |
| `color` | `string` | — | Forwarded to the icon as a fill/stroke color |
| `className` | `string` | — | Additional CSS classes merged via `cn()` |

## Usage Example

```typescript
import { RoadmapVoteButton } from './roadmap-vote-button'

function RoadmapCard() {
  const { upvotes, hasVotedUp, handleVote } = useRoadmapVoting(itemId)

  return (
    <div className="flex gap-2">
      <RoadmapVoteButton
        voteType="up"
        count={upvotes}
        isActive={hasVotedUp}
        onClick={() => handleVote('up')}
        color="#FFC008"
      />
      <RoadmapVoteButton
        voteType="down"
        count={0}
        isActive={false}
        onClick={() => handleVote('down')}
        showCount={false}
        disabled
      />
    </div>
  )
}
```