Компоненты · Элементы

ПоискSearchToggle

Круглая кнопка поиска, которая раскрывается в поле

npx shadcn@latest add @umbra/search-toggle

Кнопка-лупа 56 в ряду действий Page. По нажатию поле 280 px выезжает влево (--t-base, --ease-out), фокус уходит в поле, лупа поворачивается и становится крестиком. Крестик и Escape закрывают и очищают поиск

Когда брать

  • Поиск по списку страницы: встречи, кейсы

Когда не брать

  • Поле формы: Field
  • Поиск главное действие экрана: обычное поле Input на виду

Встречи

7 записей за неделю

Планёрка командыВТ, 10:00 · 32 мин
Интервью с дизайнеромПН, 16:30 · 48 мин
Созвон с подрядчикомПТ, 12:00 · 21 мин
Разбор макетовЧТ, 11:00 · 54 мин
Ретро спринтаСР, 17:00 · 40 мин
Встреча с юристомСР, 12:30 · 25 мин
Обзор метрикВТ, 15:00 · 36 мин

Нельзя

  • Поле шире 280 px и поиск без кнопки закрытия