Выбор даты

Диапазон двумя полями

Диапазон дат двумя полями, где порядок чинится сам: конец подтягивается за началом, а длительность считается тут же.

Что можно поменять

  • legend — заголовок пары полей
  • defaultFrom и defaultTo — стартовый диапазон
  • min — самая ранняя доступная дата

Ссылка для ИИ-агента: в ней превью, код и инструкция.

Превью

1440pxТема страницы

Использовать с ИИ

  1. 1. Скопируйте ссылку.
  2. 2. Напишите агенту своими словами и вставьте её в предложение.
  3. 3. Агент откроет ссылку и поставит компонент из реестра.
AI
1Выбрали здесь

добавь это на главную первым экраном:

https://vibeui.ru/c/date-003?theme=dark

2Вставили в чат агента
3Получили в проекте

Не знаете, куда вставить? Пошаговый гайд

Показать полную инструкцию

То, что лежит по ссылке в развёрнутом виде. Нужна, если агент не может открыть ссылку — тогда вставьте этот текст целиком.

Загружается…

Для разработчика

Команда установки — в блоке «Исходник компонента» ниже: подписанная ссылка действует сутки.

Технические заметки

Компонент самодостаточен: один файл, ноль зависимостей, палитра в локальных переменных --vibeui-date-003-*. Клиентский: обе даты в состоянии, они связаны. Второму полю ставится min по первому, поэтому системный календарь просто не даёт выбрать дату раньше начала. Если начало сдвинули за уже выбранный конец, конец переносится на следующий день вместо ошибки. Даты сравниваются как строки ISO — при одинаковом формате это корректно и не требует парсинга. legend лежит во float, поэтому у ряда полей стоит clear:both.

Теги

  • date
  • range
  • booking
  • validation
Исходник компонента

Тот же файл, который поставит агент. Нужен, если вы предпочитаете скопировать код руками.

Загружается…