Status

Components that communicate system feedback, async state, and high-priority interruptions. All patterns are planned for a future release — state tokens for errors, warnings, and success already exist in the token system.

Alert coming soon

Inline status messages consuming --color-error, --color-warning, and --color-success semantic tokens. --alert-* Tier-3 tokens (background, border, text, icon-color per variant) for independent retheme. Four variants: info, success, warning, error — dismissible and non-dismissible.

Loading states coming soon

Two patterns for async and in-progress feedback. Spinner — a rotating ring consuming --color-accent and --duration-* motion tokens. Skeleton — a shimmer placeholder using a CSS gradient animation. Both respect prefers-reduced-motion: spinner stops, skeleton renders as a static tinted block.

--modal-* tokens (background, backdrop, border-radius, shadow) and .modal, .modal-backdrop, .modal-header, .modal-body, .modal-footer classes with size variants (sm, md, lg). CSS owns appearance; JavaScript is responsible for focus trap, aria-modal="true", role="dialog", and Escape key handling.