## Notification
A richer, stacking message with a title + description — rendered through antd's notification API.
Tier: composite-antd. Frameworks: HTML (paste-and-run, no build step) · React · Vue 3.
Default to the HTML snippet — a CDN-React runnable page (React + antd loaded from a CDN, no build step) — React/Vue use the same shared-themed DataTable via your bundler.
Surfaces: editor, dashboard, settings.
Props:
- message: string, default —. The bold title line
- description: string, default —. The supporting body text
- type: success | info | warning | error, default —. Status glyph + tone
- placement: topLeft | topRight | bottomLeft | bottomRight, default topRight. Which corner it stacks in
- duration: number, default 4.5. Seconds on screen; 0 keeps it until dismissed
- btn: ReactNode, default —. One optional action (e.g. Undo) rendered in the card
Tokens: colorPrimary, borderRadius, colorText, Notification.width.
Use when: Notification (a message with a title + detail, or one from a background event the user may act on later); Toast (a one-line, past-tense confirmation with nothing to act on); Modal (the user must respond before continuing).