Storybook stories for the `ContentLoader` UI component, showcasing all skeleton loading variants and configuration options.
## Key Components
| Export | Description |
|--------|-------------|
| `Card` | Default card-grid skeleton story |
| `Form` | Form fields skeleton story |
| `Detail` | Detail page with sidebar skeleton story |
| `List` | List rows with avatars skeleton story |
| `WithoutTitle` | Card variant without a title skeleton |
| `ManyItems` | Stress test with 8 list items |
| `SingleItem` | Single card skeleton |
| `CustomContainer` | Form skeleton with custom container class |
| `AllVariants` | Side-by-side showcase of all four variants using named loader components |
| `ShortcutComponents` | Demonstrates `CardLoader`, `FormLoader`, `DetailLoader`, `ListLoader` shortcut components |
## Usage Example
```typescript
import {
ContentLoader,
CardLoader,
FormLoader,
DetailLoader,
ListLoader,
} from '@/components/ui/content-loader';
// Generic loader with variant prop
// Shortcut components for common patterns
```
## Controls
| Prop | Type | Range/Options |
|------|------|---------------|
| `variant` | `select` | `card`, `form`, `detail`, `list` |
| `items` | `number` | 1–12 |
| `showTitle` | `boolean` | `true` / `false` |
| `containerClassName` | `string` | Any Tailwind/CSS class string |