# Aurora Core React Example

Canonical buildable reference implementation for **Aurora Core v5.4.0**.

This example shows how to use Aurora Core with minimal abstraction:

- Import the exported CSS (`aurora.css`)
- Use semantic class names directly
- Wrap accessible, typed component APIs around the canonical CSS classes
- Keep the source CSS in charge of the visual language while React owns state and ARIA

## Components (9)

| Component | File | Description |
|-----------|------|-------------|
| `AuroraButton` | `src/components/AuroraButton.tsx` | 7 variants, loading/disabled states, icon slot |
| `AuroraBadge` | `src/components/AuroraBadge.tsx` | Tone-based status badges with dot indicators |
| `AuroraToggle` | `src/components/AuroraToggle.tsx` | Controlled toggle with purple-to-blue track (never gold) |
| `AuroraSlider` | `src/components/AuroraSlider.tsx` | Range slider with tinted tracks and flash feedback |
| `AuroraProgressBar` | `src/components/AuroraProgressBar.tsx` | Tinted-track progress bar with 6 tones |
| `AuroraCard` | `src/components/AuroraCard.tsx` | Glass card with 3 optical depth tiers (8/20/32 px blur) |
| `AuroraTextInput` | `src/components/AuroraTextInput.tsx` | Text input with gold focus ring, error state, glass surface |
| `AuroraAlert` | `src/components/AuroraAlert.tsx` | Inline alert with 5 tones (gold glows, amber does not) |
| `AuroraTabs` | `src/components/AuroraTabs.tsx` | Accessible tab bar with arrow-key navigation and ARIA roles |

## Quick Start

```bash
npm install
npm run dev
```

## Verification

```bash
npm install
npm run typecheck
npm run build
```

## Design Rules Enforced

1. **Gold emits light** -- hero actions and alerts use glow
2. **Amber does not glow** -- matte warning only
3. **Depth is optical** -- `backdrop-filter: blur()` at 8/20/32 px tiers, never `box-shadow`
4. **Toggles use purple-to-blue** -- never gold
5. **Tinted tracks** -- progress bars and sliders inherit faint fill color
6. **No hardcoded colors** -- all styling via CSS variables
7. **No legacy warm-gold** -- `#D4A560` is banned