# Support thread and suggested reply

A support conversation with the case rail (customer, order, SLA) and the AI suggested reply: confidence, sources, Insert into reply, and states for loading, low confidence and failed.

- **Group:** Data display · **family:** `data-display` · **shadcn:** Textarea, Avatar, Badge
- **Build:** Composed: `Textarea`, `Avatar`, `Badge`, `Button`.
- **In apps/admin today:** Badge exists.
- **Client component:** yes. 

## Content rules

- Support status: Waiting on us, Resolved.

## Do

- Show sources for AI text.

## Don't

- Auto-send suggested replies.

## Accessibility

- **Keyboard:** ⌘/Ctrl + Enter sends.
- **ARIA:** Messages `role="log"`; suggestion is a region labelled "Suggested reply".
- **Focus:** Insert moves focus into the composer.

## Tokens

`--s-1` `--text-micro` `--muted-foreground` `--s-2` `--border` `--s-4` `--s-5` `--text-small` `--foreground` `--w-semibold` `--text-20` `--font-voice` `--font-stretch-title` `--s-3` `--r-card` `--muted` `--text-body` `--lh-body` `--accent` `--ring` `--info` `--card` `--e-1` `--locked` `--warning` `--destructive` `--success` `--w-medium` `--background` `--input` `--motion-hover` `--motion-focus` `--focus-ring`

## Files

`thread.html` live specimen · `thread.css` kit rules · `thread.d.ts` props · full page: `docs/components/thread/` (phone: `m/`).
