refactor(desktop): migrate toast presentation onto the design system
D12 of the desktop design-system stack: the window's toasts (toast.tsx) move onto @luke/ui's barrel Button, IconButton and Text and the --luke-* tokens. Presentation only: stacking, holds, pausing, the two live regions, Escape, withdrawal and the modal pass-through are untouched. No compat imports were involved.
- A toast's action (Undo, View, Back, ā¦) is an outline
Button(approved by the orchestrator). - Its dismiss is a quiet
IconButtonnamed "Dismiss", standing inline at the card's end in a.toast-dismisscontainer that shows it under the pointer or focus (approved). It stays a focusable button in the tab order. - Words are
Textin the section role (13/18, 600); the second line is captionText(12/16) in the muted tone. - The card's first row is a control tall (30px) and its glyph the control's icon (15px); the stack and card read
--luke-*tokens. - Removed, now unused:
.toast-action,.toast-action:hover,.toast-dismiss:hover,.toast-dismiss svg, the card's--toast-glyph, and the words' and detail's own type rules.
Visible changes
- Action: a 30px outline button at 8px radius with label type (was a 24px solid-ink button at 6px, 12px/600).
- Dismiss Ć: a 30px quiet icon button at the card's end, after the action (was a 20px round bordered badge hung off the card's top-left corner). It still only shows under the pointer or focus, but its room is kept at rest, so an action toast's words wrap about 38px narrower and a long line reaches its two-line cut sooner.
- First row 30px (was 24px), so a card is 6px taller; glyph 15px (was 16px).
- Second line is 12/16 (was 12.5/16).
Screenshots
Rendered on Linux in headless Chrome at 1280Ć840 from a throwaway harness (not committed) that draws the toast stack's markup with the built desktop stylesheet of each branch: a done toast with no action, a failed toast with a second line and View, and an ask with View whose Dismiss holds focus (so its Ć shows). Synthetic data. The Linux font has no 500 weight, so the action's label draws as regular here.
| Light | Dark | |
|---|---|---|
| Before (D11 base) |  |  |
| After |  |  |
Tests
toast.test.ts: new jsdom test. An action toast carries a button named Dismiss that takes focus; a press sends the toast away, and so does Escape from it.agent-end-toast.test.ts,failed-runs.test.tsand#testing/toast'snewestToastActionfind the action as the toast's button (by its words, or as its first button) instead of the removed.toast-actionclass.pnpm check:affectedexits 0.
Not verified on a Mac
The toasts in the running app (over a plan's call bar or an agent's composer, the enter/leave motion and the stack's glide), SF Pro's 500 weight, native window controls, drag regions, zoom, pane motion and call surfaces.
š¤ Generated with Claude Code