Форми

Input

Текстове поле — «дірка в папері»: inset-тінь зверху + підсвітка знизу. Picker керує тільки фокусним акцентом — заливкою + кольором тіні при focus. Idle / disabled / invalid залишаються нейтральними (slate / rose) бо це семантика, не брендинг.

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

Налаштування · тіло · blue-100

Перемикач справа обирає, що зараз редагує picker — idle-стан поля чи focus-акцент.

01 · Палітра
02 · Hue · blue
03 · Stop · 100

Прев'ю · sapphire-500

Інпути в різних розмірах і станах. Натисни на будь-який щоб побачити focus-акцент.

Sizesxs / sm / md / lg / xl
Icons / addonsleftIcon / prefix / suffix
.00
Statesdefault / readonly / disabled / loading / invalid
Recipebody=blue-100 · focus=sapphire-500
idle.bg      : #DBEAFE
idle.shadow  : rgba(96,165,250,0.55)
focus.bg     : #C8D8FB
focus.shadow : rgba(21,56,166,0.65)
invalid.bg   : rose-50/80  (semantic error, not branded)
readonly.bg  : slate-50    (semantic, not branded)