# Tear Button

A ticket you confirm by tearing off its stub.

Tier: Free

## Installation

```bash
npx shadcn add @fetaui/tear-button
```

## Usage

```tsx
import { TearButton } from '@/components/fetaui/tear-button'

export function Example() {
  return <TearButton tone="default" onTear={redeem} />
}
```

## API

| Prop | Type | Default |
|---|---|---|
| title | string | Redeem ticket |
| meta | string | Tear the stub to confirm |
| tornTitle | string | Ticket redeemed |
| tornMeta | string | New stub in a moment |
| tone | default, muted, danger | default |
| icon | ReactNode |  |
| onTear | () => void |  |
| disabled | boolean | false |
| animated | boolean | true |

## When to use

- For redeeming or confirming something once.

## When not to use

- For everyday actions: use Button.

## Accessibility

- The stub is a native button.
- The result is announced as a status.

## Motion

- The stub swings on a 900/42 spring and falls away.
- With reduced motion, the stub fades.