<!-- source-hash: 775503f0a371e047d64f92c3ad355efe -->
A pure-presentation React component that renders a compact, reusable entity card for chat contexts that don't require a bespoke component. Supports optional linking, status badges, key-value facts, and a skeleton loading state.

## Key Components

### `GenericEntityCard`
Main card component. Renders as an `<a>` tag (clickable) or `<span>` (static) depending on whether a URL or `anchorProps` is provided. Displays an `ExternalLink` icon when a URL is present.

### `GenericEntityCardSkeleton`
Animated placeholder component that mirrors the layout of `GenericEntityCard` for use during loading states.

### Interfaces

| Interface | Purpose |
|---|---|
| `GenericEntityCardItem` | Data shape for the card content |
| `GenericEntityCardAnchorProps` | Pre-composed anchor element props (href, target, rel, onClick) |
| `GenericEntityCardProps` | Combined props for the card (item + anchorProps + className) |

### `GenericEntityCardItem` Fields

| Field | Type | Description |
|---|---|---|
| `title` | `string` | Primary heading |
| `preview` | `string \| null` | Truncated body text (2-line clamp) |
| `subtitle` | `string \| null` | Monospace secondary label |
| `badge` | `{ text, scheme? }` | Status badge with color scheme |
| `facts` | `Array<{ label, value }>` | Inline key-value metadata pairs |
| `dateUpdated` | `string \| number \| null` | Formatted UTC timestamp |
| `url` | `string \| null` | Optional navigation target |

## Usage Example

```typescript
import { GenericEntityCard, GenericEntityCardSkeleton } from './generic-entity-card'

// Basic card with URL
<GenericEntityCard
  item={{
    id: 'ticket-42',
    title: 'Printer offline on Floor 2',
    subtitle: 'TKT-0042',
    preview: 'User reports printer is unreachable since 9am.',
    badge: { text: 'Open', scheme: 'warning' },
    facts: [{ label: 'Priority', value: 'High' }],
    dateUpdated: '2024-06-01T10:00:00Z',
    url: 'https://app.example.com/tickets/42',
  }}
/>

// Custom anchor props (e.g. SPA router navigation)
<GenericEntityCard
  item={item}
  anchorProps={{
    href: '/tickets/42',
    onClick: (e) => { e.preventDefault(); router.push('/tickets/42') },
  }}
/>

// Loading state
<GenericEntityCardSkeleton />
```