# Slide to Confirm

Trilho que só confirma quando você arrasta o polegar até o fim, e volta com mola se soltar antes.

- Nome no registry: `slide-to-confirm`
- Tipo: componente
- Dependências npm: lucide-react, motion, react
- Demo: https://ui.visantlabs.com/c/slide-to-confirm
- Categorias: controles, confirmacao, arrasto, pagamento, gesto

## Quando usar

- Use quando: Confirmar pagamento, envio ou check-in no celular arrastando até o fim, sem toque acidental
- Evite quando: Apagar com desfazer: confirm-morph; ação destrutiva no desktop, hold-to-confirm

## Instalar

```bash
npx shadcn@latest add @visant/slide-to-confirm
```

## Usar

```tsx
<SlideToConfirm
  confirmedLabel="Pago"
  label="Deslize pra pagar"
/>
```

## API

### SlideToConfirm

- `confirmed?: boolean` — Controla o estado confirmado. Volte pra `false` pra rearmar o trilho.
- `confirmedLabel?: string = "Confirmado"` — Rótulo depois de confirmado.
- `disabled?: boolean = false`
- `doneTone?: "success" | "tone" = "success"` — Cor do trilho depois de confirmado. `success` (padrão) pinta polegar e rastro de aprovação, lido do token `--success` com verde de reserva; `tone` mantém a cor de antes.
- `label?: string = "Deslize pra confirmar"` — Instrução no trilho, como "Deslize pra pagar".
- `onConfirm?: () => void` — Roda uma vez quando o polegar chega ao fim.
- `threshold?: number = 0.85` — Fração do curso (0 a 1) a partir da qual soltar completa sozinho.
- `tone?: "brand" | "neutral" | "danger" = "neutral"` — Cor do polegar e do rastro: `brand`, `neutral` ou `danger` pra destruir.