feat(): Add new <DateRangePicker> component

[sashachabin]

⚠️ Пока активно переделываю тесты. Но уже можно ревьювить механику работы, API. В целом буду очень рад любым советам!

<DateRangePicker>

Привет! Сделал компонент для выбора периода <DateRangePicker>

Документация | Песочница StackBlitz

Основные

• Компонент состоит из двух <DateInput> и одного общего <Calendar> с диапазоном:
  • <DateRangePicker.Start /> — поле «от», настройки как у <DateInput>
  • <DateRangePicker.End /> — поле «до», настройки как у <DateInput>
  • <DateRangePicker.Separator /> — разделитель
• В календаре диапазон рисуется через <Calendar renderDay={...} />. Несмотря на то, что проп используется, его по-прежнему можно указывать. Например, собирать календарь с ценами
• Опциональные периоды. Добавлены кнопки «Без первой даты», «Без второй даты»
• Поддерживаются все пропы <DatePicker />. Например, enableTodayLink, useMobileNativeDatePicker , onMonthChange
• По аналогии с DatePicker добавлен метод для валидации DatePickerRange.validate(value, { ...options})
• Для ref сделаны методы focus('start' | 'end') и blur()
• Тёмная тема
• Мобильная версия

Работа со значениями

Важная особенность компонента — он не только состоит из нескольких частей, но и в нём сразу 2 input. В процессе разработки выработал 2 принципа:

1. Все значения задаются парами (так сделано в самых популярных библиотеках — ant.design и mui):
   • Период задается в формате value={['dd.mm.yyyy', 'dd.mm.yyyy']} (формат настраивается)
   • Пропы optional, warning, error задаются в формате [true, false]
2. Внутри children подразумевается только кастомизация оберток и <DateInput> без работы со значениями

Ссылки

IF-87 — там ссылки на дизайн, референсы и фидбек от разных команд

Чек-лист перед запросом ревью

1. Добавлены тесты на все изменения
   ⌛️ unit-тесты для логики
   ⌛️ скриншоты для верстки и кросс-браузерности
   ⬜ нерелевантно

2. Добавлена (обновлена) документация
   ✅ styleguidist для пропов и примеров использования компонентов
   ✅ jsdoc для утилит и хелперов
   ✅ комментарии для неочевидных мест в коде
   ✅ прочие инструкции (README.md, contributing.md и др.)
   ⬜ нерелевантно

3. Изменения корректно типизированы
   ✅ без использования any (см. PR 2856)
   ⬜ нерелевантно

4. Прочее
   ✅ все тесты и линтеры на CI проходят
   ⌛️ в коде нет лишних изменений — пока есть 2 маленькие правки на стороне Storybook
   ⬜ заголовок PR кратко и доступно отражает суть изменений (он попадет в changelog)

[sashachabin]

@zhzz

Я пока в процессе активного перепиливания юнит-тестов (снёс перед ревью __tests__ из-за большого количества изменений после пробного внедрения). Но уже можно ревьювить механику работы и API. И в целом буду очень рад любым советам!