# Slide To Confirm

Drag the thumb across to confirm. Past 90% or a fast flick, it commits.

Tier: Free

## Installation

```bash
npx shadcn add @fetaui/slide-to-confirm
```

## Usage

```tsx
import { SlideToConfirm } from '@/components/fetaui/slide-to-confirm'

export function Example() {
  return <SlideToConfirm label="Slide to pay $24.00" onConfirm={pay} />
}
```

## API

| Prop | Type | Default |
|---|---|---|
| label | string | Slide to pay $24.00 |
| doneLabel | string | Paid |
| onConfirm | () => Promise<void> | void |  |
| disabled | boolean | false |
| animated | boolean | true |

## When to use

- For a payment or other deliberate confirmation.

## When not to use

- For everyday actions: use Button.

## Accessibility

- The thumb is a slider with a live value.
- The result is announced through aria-live.

## Motion

- The thumb follows the pointer 1:1 and the ink trails it.
- It snaps to the end on a 520/42 spring, then the ink turns emerald.
- With reduced motion, progress still shows and there is no spring.