<!-- source-hash: 553f8dbdfb9763d4ad797668077fd3a4 -->
A reusable client-side button component that triggers AI enrichment actions, featuring a sparkles icon, loading state, and configurable size/variant options.

## Key Components

### `AIEnrichButtonProps`
| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `onClick` | `() => void` | — | Handler called on button click |
| `disabled` | `boolean` | `false` | Disables the button |
| `loading` | `boolean` | `false` | Shows loading state and swaps label |
| `label` | `string` | `'AI Enrich'` | Default button text |
| `loadingLabel` | `string` | `'Enriching...'` | Text shown during loading |
| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Button size |
| `variant` | `'primary' \| 'secondary' \| 'outline'` | `'outline'` | Visual style |
| `className` | `string` | — | Additional CSS classes |

### `AIEnrichButton`
The exported functional component. Internally maps the `size` and `variant` props to the underlying `Button` component's accepted values, and hides the `SparklesIcon` while loading.

## Usage Example

```typescript
import { AIEnrichButton } from './components/AIEnrichButton'

function TicketForm() {
  const [enriching, setEnriching] = React.useState(false)

  const handleEnrich = async () => {
    setEnriching(true)
    await enrichTicketWithAI()
    setEnriching(false)
  }

  return (
    <AIEnrichButton
      onClick={handleEnrich}
      loading={enriching}
      size="sm"
      variant="primary"
      label="Enrich Ticket"
      loadingLabel="Analyzing..."
    />
  )
}
```

> The button automatically disables itself during loading (`disabled || loading`), preventing duplicate submissions while Mingo AI processes the enrichment request.