Індикація

Banner

Inline alert / callout. Data-driven: один токен (ramp × stop) → recipe (face/base/border/ink/iconShell). Светлые stop → светлый фон + тёмная обводка, тёмные stop → тёмный фон + светлая обводка. Цвет кнопки и иконки внутри банера выбирается отдельным picker'ом.

import { Banner } from "@residence/glass-ui"

Налаштування · банер · sapphire-100

Перемикач справа обирає, що зараз редагує picker — фон банера чи action-кнопку з іконкою.

01 · Палітра

02 · Hue · Сапфір

03 · Stop · 100

Прев'ю · sapphire-100 (light)

Все 5 вариантов баннера в выбранной паре. Action-кнопка использует свой recipe из второго picker'а.

Default · infotitle + description + action + dismiss

Інформаційне повідомлення

Загальна нотатка для адміністратора про оновлення системи.

Successtitle + description

Платіж зараховано

Оплата 1 245,00 ₴ за лютий — успішно прийнята.

Warningdismiss only

Лічильник не передано

Останній раз показники надавали 56 днів тому.

Erroraction only

Помилка збереження

Сервер повернув 500. Спробуйте знову через хвилину.

Compact · title onlyбез description

Системна нотатка — архівна інформація без статусу.

Recipetoken=sapphire-100 · isDark=false

face   : #C8D8FB → #8FB1F8
base   : #5683F0 → #5683F0
border : #5683F0
ink    : #040A21
icon   : bg=#5683F0  ink=#ffffff