Components
Toast
vue-sonner with the cds card: neutral / warning / danger, 6s minimum, (×N) dedupe, stacked 14px / .04, exit scale .85.
Toast
Host: bottom-right 16px, 360 wide, 3 visible, 16px gap when expanded. Enter 200ms from below, exit fade + scale .85. Escape inside a toast dismisses it; hover pauses the timer and expands the stack.
Variants, light and dark
Every type is the neutral card: surface-popover (#fff | #303030) + panel-md shadow, text primary, title w435. Only the 20px icon carries colour: Info secondary, Warning #fbb315, Danger #dc3c3d.
light
Toast neutral title
Description line
Toast warning title
Description line
Toast danger title
Description line
Session ID copied to clipboard (×3)
dark
Toast neutral title
Description line
Toast warning title
Description line
Toast danger title
Description line