# Activity Heatmap

Um quadrado por dia mostra o ritmo de meses de trabalho, com bolha que desliza entre os dias e teclado de calendário.

- Nome no registry: `activity-heatmap`
- Tipo: componente
- Dependências npm: motion
- Demo: https://ui.visantlabs.com/c/activity-heatmap
- Categorias: conteudo, dados, calendario, heatmap, ritmo, grafico

## Quando usar

- Use quando: Mostrar ritmo diário de atividade ao longo de meses, como entregas ou hábitos, em perfil ou dashboard
- Evite quando: Mistura de categorias no tempo: streamgraph; um valor só de cota, gauge

## Instalar

```bash
npx shadcn@latest add @visant/activity-heatmap
```

## Usar

```tsx
<ActivityHeatmap
  label="Entregas nos últimos seis meses"
  period="seis meses"
/>
```

## API

### ActivityHeatmap

- `days: ActivityDay[]` — Um item por dia, do mais antigo ao mais novo. Dia faltando conta zero.
- `label: string` — Nome acessível da grade, como "Entregas em 2026".
- `period: string` — Fecha o resumo: "1.284 entregas em {period}".
- `actions?: any` — Controles ao lado do resumo, como um seletor de período.
- `cellSize?: number = 12` — Lado do quadrado, em px.
- `locale?: string = "pt-BR"`
- `onSelectDate?: (date: string) => void` — Clique, Enter ou Espaço num dia.
- `selectedDate?: string = "null"` — Dia marcado com o anel de seleção.
- `thresholds?: [number, number, number]` — Teto dos níveis 1 a 3; acima do último é nível 4. Default: quartos do dia mais cheio.
- `unit?: { one: string; other: string; } = { one: "registro", other: "registros" }` — Substantivo da contagem, no singular e no plural.
- `weekStartsOn?: "0" | "1" = 0` — 0 = semana começa no domingo; 1 = na segunda.