npm - @vkontakte/vkui - Versions diffs - 7.3.8 → 7.4.1 - Mend

@vkontakte/vkui 7.3.8 → 7.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (357) hide show

package/dist/components/DateInput/DateInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { startOfDay, startOfMinute } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRootRef } from '../../types';\nimport { Calendar, type CalendarProps, type CalendarTestsProps } from '../Calendar/Calendar';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { useDateInputValue } from './hooks';\nimport '../InputLike/InputLike.module.css'; // Reorder css\nimport styles from './DateInput.module.css';\n\nconst sizeYClassNames = {\n none: styles.sizeYNone,\n compact: styles.sizeYCompact,\n};\n\nexport type DateInputPropsTestsProps = {\n /*\n Передает атрибут `data-testid` для поля ввода дня.\n /\n dayFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода месяца.\n /\n monthFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода года.\n /\n yearFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода часа.\n /\n hourFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода минут.\n /\n minuteFieldTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки показа календаря.\n /\n showCalendarButtonTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки очистки даты.\n /\n clearButtonTestId?: string;\n};\n\nexport interface DateInputProps\n extends Omit<\n React.InputHTMLAttributes<HTMLDivElement>,\n 'value' \| 'defaultValue' \| 'onChange' \| 'size'\n >,\n Pick<\n CalendarProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'enableTime'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'defaultValue'\n \| 'doneButtonText'\n \| 'DoneButton'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'changeHoursLabel'\n \| 'changeMinutesLabel'\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'showNeighboringMonth'\n \| 'size'\n \| 'viewDate'\n \| 'onHeaderChange'\n \| 'onNextMonth'\n \| 'onPrevMonth'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'minDateTime'\n \| 'maxDateTime'\n \| 'renderDayContent'\n >,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement>,\n Omit<FormFieldProps, 'maxHeight'>,\n DateInputPropsTestsProps {\n /\n Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n /\n calendarTestsProps?: CalendarTestsProps;\n /\n Расположение календаря относительно поля ввода.\n /\n calendarPlacement?: PlacementWithAuto;\n /\n Автоматически закрывать календарь при изменениях.\n /\n closeOnChange?: boolean;\n /\n `aria-label` для календаря.\n /\n calendarLabel?: string;\n /\n Label для кнопки очистки. Делает доступным для ассистивных технологий.\n /\n clearFieldLabel?: string;\n /\n Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n /\n showCalendarLabel?: string;\n /\n Отключение открытия календаря.\n /\n disableCalendar?: boolean;\n /\n Обработчик изменения состояния открытия календаря.\n /\n onCalendarOpenChanged?: (opened: boolean) => void;\n /\n `aria-label` для поля изменения дня.\n /\n changeDayLabel?: string;\n /\n Обработчик нажатия на кнопку `\"Done\"`. Используется совместно с флагом `enableTime`.\n /\n onApply?: (value?: Date) => void;\n /\n Функция для кастомного форматирования отображаемого значения даты.\n * Позволяет переопределить стандартное отображение даты и вернуть собственное представление.\n /\n renderCustomValue?: (date: Date \| undefined) => React.ReactNode;\n /\n Часовой пояс для отображения даты.\n /\n timezone?: string;\n /\n Включает режим в котором DateInput доступен\n * для ассистивных технологий.\n * В этом режиме:\n * - календарь больше не открывает при фокусе на DateInput;\n * - иконка календаря видна всегда, чтобы пользователи\n * ассистивных технологий могли открыть календарь по клику на иконку;\n * - календарь при открытии получает фокус, клавиатурный\n * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.\n /\n accessible?: boolean / TODO [>=v8] включить по умолчанию /;\n /\n Позволяет отключить захват фокуса при появлении календаря.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n}\n\nconst elementsConfig = (index: number) => {\n let length = 2;\n let min = 1;\n let max = 0;\n\n switch (index) {\n case 0:\n max = 31;\n break;\n case 1:\n max = 12;\n break;\n case 2:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n case 3:\n max = 23;\n break;\n case 4:\n max = 59;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps['value']) => {\n const newValue = ['', '', '', '', ''];\n if (value) {\n newValue[0] = String(value.getDate()).padStart(2, '0');\n newValue[1] = String(value.getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value.getFullYear()).padStart(4, '0');\n newValue[3] = String(value.getHours()).padStart(2, '0');\n newValue[4] = String(value.getMinutes()).padStart(2, '0');\n }\n return newValue;\n};\n\n/\n @see https://vkcom.github.io/VKUI/#/DateInput\n */\nexport const DateInput = ({\n enableTime,\n shouldDisableDate,\n disableFuture,\n disablePast,\n minDateTime,\n maxDateTime,\n 'value': valueProp,\n defaultValue,\n onChange,\n 'calendarPlacement': calendarPlacementProp = 'bottom-start',\n style,\n className,\n doneButtonText,\n DoneButton,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n onClick,\n onFocus,\n accessible,\n calendarLabel = 'Календарь',\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeDayLabel = 'День',\n changeMonthLabel = 'Месяц',\n changeYearLabel = 'Год',\n changeHoursLabel = 'Час',\n changeMinutesLabel = 'Минута',\n clearFieldLabel = 'Очистить поле',\n showCalendarLabel = 'Показать календарь',\n showNeighboringMonth,\n size,\n viewDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n prevMonthIcon,\n nextMonthIcon,\n disableCalendar = false,\n renderDayContent,\n onCalendarOpenChanged,\n calendarTestsProps,\n dayFieldTestId,\n monthFieldTestId,\n yearFieldTestId,\n hourFieldTestId,\n minuteFieldTestId,\n showCalendarButtonTestId,\n clearButtonTestId,\n id,\n onApply,\n renderCustomValue,\n timezone,\n restoreFocus,\n disableFocusTrap,\n 'aria-label': ariaLabel = '',\n ...props\n}: DateInputProps): React.ReactNode => {\n const daysRef = React.useRef<HTMLSpanElement>(null);\n const monthsRef = React.useRef<HTMLSpanElement>(null);\n const yearsRef = React.useRef<HTMLSpanElement>(null);\n const hoursRef = React.useRef<HTMLSpanElement>(null);\n const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n const { value, updateValue, setInternalValue, getLastUpdatedValue, clearValue } =\n useDateInputValue({\n value: valueProp,\n defaultValue,\n onChange,\n timezone,\n });\n\n const maxElement = enableTime ? 4 : 2;\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n for (let i = 0; i <= maxElement; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n return;\n }\n }\n\n let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n let mask = 'dd.MM.yyyy';\n if (enableTime) {\n formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n mask += ' HH:mm';\n }\n\n if (isMatch(formattedValue, mask)) {\n const now = new Date();\n updateValue(\n parse(formattedValue, mask, value ?? (enableTime ? startOfMinute(now) : startOfDay(now))),\n );\n }\n },\n [enableTime, maxElement, updateValue, value],\n );\n\n const refs = React.useMemo(\n () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n closeCalendar,\n toggleCalendar,\n openCalendar,\n handleRestoreFocus,\n } = useDateInput({\n maxElement,\n refs,\n autoFocus,\n disabled,\n elementsConfig,\n onClear: clearValue,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n });\n\n const { sizeY = 'none' } = useAdaptivity();\n\n const handleRootRef = useExternRef(rootRef, getRootRef);\n\n useIsomorphicLayoutEffect(\n function resetValueOnCloseCalendar() {\n if (!open) {\n setInternalValue(getLastUpdatedValue());\n }\n },\n [open, getLastUpdatedValue],\n );\n\n const onCalendarChange = React.useCallback(\n (value?: Date \| undefined) => {\n if (!value) {\n return;\n }\n if (enableTime) {\n setInternalValue(value);\n return;\n }\n updateValue(value);\n if (closeOnChange) {\n removeFocusFromField();\n }\n },\n [enableTime, updateValue, closeOnChange, setInternalValue, removeFocusFromField],\n );\n\n const onDoneButtonClick = React.useCallback(() => {\n if (!value) {\n return;\n }\n const newValue = updateValue(value);\n onApply?.(newValue);\n removeFocusFromField();\n }, [onApply, removeFocusFromField, updateValue, value]);\n\n const customValue = React.useMemo(\n () => !open && renderCustomValue?.(value \|\| undefined),\n [open, renderCustomValue, value],\n );\n\n // при переключении месяцев высота календаря может меняться,\n // чтобы календарь не прыгал при переключении месяцев каждый раз на\n // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n // на ней, пока помещается.\n const [calendarPlacement, setCalendarPlacement] =\n React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n const { locale } = useConfigProvider();\n const currentDateLabel = value\n ? new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(value)\n : null;\n const currentDateLabelId = React.useId();\n const ariaLabelId = React.useId();\n\n const showCalendarOnInputAreaClick = React.useCallback(() => {\n handleFieldEnter();\n if (accessible) {\n openCalendar();\n }\n }, [handleFieldEnter, openCalendar, accessible]);\n\n return (\n <FormField\n style={style}\n className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n getRootRef={handleRootRef}\n role=\"group\"\n aria-labelledby={`${ariaLabelId} ${currentDateLabelId}`}\n after={\n <React.Fragment>\n {!disableCalendar && (accessible \|\| (!accessible && !value)) ? (\n <IconButton\n hoverMode=\"opacity\"\n label={showCalendarLabel}\n onClick={toggleCalendar}\n data-testid={showCalendarButtonTestId}\n >\n <Icon20CalendarOutline />\n </IconButton>\n ) : null}\n {value ? (\n <IconButton\n hoverMode=\"opacity\"\n label={clearFieldLabel}\n onClick={clear}\n data-testid={clearButtonTestId}\n >\n <Icon16Clear />\n </IconButton>\n ) : null}\n </React.Fragment>\n }\n disabled={disabled}\n onClick={onClick}\n {...props}\n >\n <div className={styles.wrapper}>\n {ariaLabel && <VisuallyHidden id={ariaLabelId}>{ariaLabel}</VisuallyHidden>}\n {currentDateLabel && (\n <VisuallyHidden id={currentDateLabelId}>{currentDateLabel}</VisuallyHidden>\n )}\n <VisuallyHidden\n id={id}\n Component=\"input\"\n readOnly\n aria-hidden\n tabIndex={-1}\n name={name}\n value={value ? format(value, enableTime ? \"dd.MM.yyyy'T'HH:mm\" : 'dd.MM.yyyy') : ''}\n onFocus={handleFieldEnter}\n />\n <Text\n className={classNames(styles.input, customValue && styles.hidden)}\n // Инцидент: в PR https://github.com/VKCOM/VKUI/pull/6649 стабильно ломается порядок стилей\n // из-за чего `.Typography--normalize` перебивает стили.\n normalize={false}\n Component=\"span\" // для <span> нормализация не нужна\n onClick={showCalendarOnInputAreaClick}\n >\n <InputLike\n length={2}\n getRootRef={daysRef}\n index={0}\n onKeyDown={handleKeyDown}\n onElementSelect={setFocusedElement}\n value={internalValue[0]}\n label={changeDayLabel}\n data-testid={dayFieldTestId}\n role=\"spinbutton\"\n aria-valuemin={1}\n aria-valuemax={31}\n aria-valuetext={internalValue[0]}\n aria-label={changeDayLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={monthsRef}\n index={1}\n onElementSelect={setFocusedElement}\n onKeyDown={handleKeyDown}\n value={internalValue[1]}\n label={changeMonthLabel}\n data-testid={monthFieldTestId}\n role=\"spinbutton\"\n aria-valuemin={1}\n aria-valuemax={12}\n aria-valuetext={internalValue[1]}\n aria-label={changeMonthLabel}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <InputLike\n length={4}\n getRootRef={yearsRef}\n index={2}\n onElementSelect={setFocusedElement}\n value={internalValue[2]}\n label={changeYearLabel}\n onKeyDown={handleKeyDown}\n data-testid={yearFieldTestId}\n role=\"spinbutton\"\n aria-valuemin={1}\n aria-valuemax={275750}\n aria-valuetext={internalValue[2]}\n aria-label={changeYearLabel}\n />\n {enableTime && (\n <React.Fragment>\n <InputLikeDivider className={styles.inputTimeDivider}> </InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={hoursRef}\n index={3}\n onElementSelect={setFocusedElement}\n value={internalValue[3]}\n label={changeHoursLabel}\n onKeyDown={handleKeyDown}\n data-testid={hourFieldTestId}\n role=\"spinbutton\"\n aria-valuemin={1}\n aria-valuemax={24}\n aria-valuetext={internalValue[3]}\n aria-label={changeHoursLabel}\n />\n <InputLikeDivider>:</InputLikeDivider>\n <InputLike\n length={2}\n getRootRef={minutesRef}\n index={4}\n onElementSelect={setFocusedElement}\n value={internalValue[4]}\n label={changeMinutesLabel}\n onKeyDown={handleKeyDown}\n data-testid={minuteFieldTestId}\n role=\"spinbutton\"\n aria-valuemin={1}\n aria-valuemax={59}\n aria-valuetext={internalValue[4]}\n aria-label={changeMinutesLabel}\n />\n </React.Fragment>\n )}\n </Text>\n {customValue && (\n <Text className={styles.customValue} aria-hidden>\n {customValue}\n </Text>\n )}\n </div>\n {open && !disableCalendar && (\n <Popper\n targetRef={rootRef}\n offsetByMainAxis={8}\n placement={calendarPlacement}\n onPlacementChange={setCalendarPlacement}\n autoUpdateOnTargetResize\n >\n <FocusTrap\n onClose={closeCalendar}\n disabled={disableFocusTrap ?? !accessible}\n restoreFocus={restoreFocus ?? (Boolean(accessible) && handleRestoreFocus)}\n captureEscapeKeyboardEvent={false}\n >\n <Calendar\n aria-label={calendarLabel}\n role=\"dialog\"\n value={value}\n onChange={onCalendarChange}\n enableTime={enableTime}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onDoneButtonClick={onDoneButtonClick}\n getRootRef={calendarRef}\n doneButtonText={doneButtonText}\n DoneButton={DoneButton}\n disablePickers={disablePickers}\n changeHoursLabel={changeHoursLabel}\n changeMinutesLabel={changeMinutesLabel}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n showNeighboringMonth={showNeighboringMonth}\n renderDayContent={renderDayContent}\n size={size}\n viewDate={viewDate}\n onHeaderChange={onHeaderChange}\n onNextMonth={onNextMonth}\n onPrevMonth={onPrevMonth}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n minDateTime={minDateTime}\n maxDateTime={maxDateTime}\n {...calendarTestsProps}\n />\n </FocusTrap>\n </Popper>\n )}\n </FormField>\n );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","startOfDay","startOfMinute","useAdaptivity","useDateInput","useExternRef","format","isMatch","parse","useIsomorphicLayoutEffect","Calendar","useConfigProvider","FocusTrap","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","VisuallyHidden","useDateInputValue","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","minDateTime","maxDateTime","valueProp","defaultValue","onChange","calendarPlacementProp","style","className","doneButtonText","DoneButton","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","accessible","calendarLabel","prevMonthLabel","nextMonthLabel","changeDayLabel","changeMonthLabel","changeYearLabel","changeHoursLabel","changeMinutesLabel","clearFieldLabel","showCalendarLabel","showNeighboringMonth","size","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","renderDayContent","onCalendarOpenChanged","calendarTestsProps","dayFieldTestId","monthFieldTestId","yearFieldTestId","hourFieldTestId","minuteFieldTestId","showCalendarButtonTestId","clearButtonTestId","id","onApply","renderCustomValue","timezone","restoreFocus","disableFocusTrap","ariaLabel","props","daysRef","useRef","monthsRef","yearsRef","hoursRef","minutesRef","updateValue","setInternalValue","getLastUpdatedValue","clearValue","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","now","Date","refs","useMemo","rootRef","calendarRef","open","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","closeCalendar","toggleCalendar","openCalendar","handleRestoreFocus","onClear","sizeY","handleRootRef","resetValueOnCloseCalendar","onCalendarChange","onDoneButtonClick","customValue","undefined","calendarPlacement","setCalendarPlacement","useState","locale","currentDateLabel","Intl","DateTimeFormat","weekday","year","month","day","currentDateLabelId","useId","ariaLabelId","showCalendarOnInputAreaClick","role","aria-labelledby","after","Fragment","hoverMode","label","data-testid","div","Component","readOnly","aria-hidden","tabIndex","normalize","onKeyDown","onElementSelect","aria-valuemin","aria-valuemax","aria-valuetext","aria-label","targetRef","offsetByMainAxis","placement","onPlacementChange","autoUpdateOnTargetResize","onClose","Boolean","captureEscapeKeyboardEvent"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { startOfDay, startOfMinute } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport type { HasRootRef } from '../../types';\nimport { Calendar, type CalendarProps, type CalendarTestsProps } from '../Calendar/Calendar';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { NumberInputLike } from '../NumberInputLike/NumberInputLike';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport { useDateInputValue } from './hooks';\nimport '../InputLike/InputLike.module.css'; // Reorder css\nimport styles from './DateInput.module.css';\n\nconst sizeYClassNames = {\n none: styles.sizeYNone,\n compact: styles.sizeYCompact,\n};\n\nexport type DateInputPropsTestsProps = {\n /*\n Передает атрибут `data-testid` для поля ввода дня.\n /\n dayFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода месяца.\n /\n monthFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода года.\n /\n yearFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода часа.\n /\n hourFieldTestId?: string;\n /\n Передает атрибут `data-testid` для поля ввода минут.\n /\n minuteFieldTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки показа календаря.\n /\n showCalendarButtonTestId?: string;\n /\n Передает атрибут `data-testid` для кнопки очистки даты.\n /\n clearButtonTestId?: string;\n};\n\nexport interface DateInputProps\n extends Omit<\n React.InputHTMLAttributes<HTMLDivElement>,\n 'value' \| 'defaultValue' \| 'onChange' \| 'size'\n >,\n Pick<\n CalendarProps,\n \| 'disablePast'\n \| 'disableFuture'\n \| 'enableTime'\n \| 'shouldDisableDate'\n \| 'onChange'\n \| 'value'\n \| 'defaultValue'\n \| 'doneButtonText'\n \| 'DoneButton'\n \| 'weekStartsOn'\n \| 'disablePickers'\n \| 'changeHoursLabel'\n \| 'changeMinutesLabel'\n \| 'prevMonthLabel'\n \| 'nextMonthLabel'\n \| 'changeMonthLabel'\n \| 'changeYearLabel'\n \| 'showNeighboringMonth'\n \| 'size'\n \| 'viewDate'\n \| 'onHeaderChange'\n \| 'onNextMonth'\n \| 'onPrevMonth'\n \| 'prevMonthIcon'\n \| 'nextMonthIcon'\n \| 'minDateTime'\n \| 'maxDateTime'\n \| 'renderDayContent'\n >,\n Pick<UseFocusTrapProps, 'restoreFocus'>,\n HasRootRef<HTMLDivElement>,\n Omit<FormFieldProps, 'maxHeight'>,\n DateInputPropsTestsProps {\n /\n Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n /\n calendarTestsProps?: CalendarTestsProps;\n /\n Расположение календаря относительно поля ввода.\n /\n calendarPlacement?: PlacementWithAuto;\n /\n Автоматически закрывать календарь при изменениях.\n /\n closeOnChange?: boolean;\n /\n `aria-label` для календаря.\n /\n calendarLabel?: string;\n /\n Label для кнопки очистки. Делает доступным для ассистивных технологий.\n /\n clearFieldLabel?: string;\n /\n Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n /\n showCalendarLabel?: string;\n /\n Отключение открытия календаря.\n /\n disableCalendar?: boolean;\n /\n Обработчик изменения состояния открытия календаря.\n /\n onCalendarOpenChanged?: (opened: boolean) => void;\n /\n `aria-label` для поля изменения дня.\n /\n changeDayLabel?: string;\n /\n Обработчик нажатия на кнопку `\"Done\"`. Используется совместно с флагом `enableTime`.\n /\n onApply?: (value?: Date) => void;\n /\n Функция для кастомного форматирования отображаемого значения даты.\n * Позволяет переопределить стандартное отображение даты и вернуть собственное представление.\n /\n renderCustomValue?: (date: Date \| undefined) => React.ReactNode;\n /\n Часовой пояс для отображения даты.\n /\n timezone?: string;\n /\n Включает режим в котором DateInput доступен\n * для ассистивных технологий.\n * В этом режиме:\n * - календарь больше не открывает при фокусе на DateInput;\n * - иконка календаря видна всегда, чтобы пользователи\n * ассистивных технологий могли открыть календарь по клику на иконку;\n * - календарь при открытии получает фокус, клавиатурный\n * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.\n /\n accessible?: boolean / TODO [>=v8] включить по умолчанию /;\n /\n Позволяет отключить захват фокуса при появлении календаря.\n /\n disableFocusTrap?: UseFocusTrapProps['disabled'];\n}\n\nconst elementsConfig = (index: number) => {\n let length = 2;\n let min = 1;\n let max = 0;\n\n switch (index) {\n case 0:\n max = 31;\n break;\n case 1:\n max = 12;\n break;\n case 2:\n max = 2100;\n min = 1900;\n length = 4;\n break;\n case 3:\n max = 23;\n break;\n case 4:\n max = 59;\n break;\n }\n\n return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarProps['value']) => {\n const newValue = ['', '', '', '', ''];\n if (value) {\n newValue[0] = String(value.getDate()).padStart(2, '0');\n newValue[1] = String(value.getMonth() + 1).padStart(2, '0');\n newValue[2] = String(value.getFullYear()).padStart(4, '0');\n newValue[3] = String(value.getHours()).padStart(2, '0');\n newValue[4] = String(value.getMinutes()).padStart(2, '0');\n }\n return newValue;\n};\n\nconst CALENDAR_MUTATION_OBSERVER_OPTIONS: MutationObserverInit = {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: ['tabindex'],\n};\n\n/\n @see https://vkcom.github.io/VKUI/#/DateInput\n */\nexport const DateInput = ({\n enableTime,\n shouldDisableDate,\n disableFuture,\n disablePast,\n minDateTime,\n maxDateTime,\n 'value': valueProp,\n defaultValue,\n onChange,\n 'calendarPlacement': calendarPlacementProp = 'bottom-start',\n style,\n className,\n doneButtonText,\n DoneButton,\n closeOnChange = true,\n disablePickers,\n getRootRef,\n name,\n autoFocus,\n disabled,\n accessible,\n calendarLabel = 'Календарь',\n prevMonthLabel = 'Предыдущий месяц',\n nextMonthLabel = 'Следующий месяц',\n changeDayLabel = 'День',\n changeMonthLabel = 'Месяц',\n changeYearLabel = 'Год',\n changeHoursLabel = 'Час',\n changeMinutesLabel = 'Минута',\n clearFieldLabel = 'Очистить поле',\n showCalendarLabel = 'Показать календарь',\n showNeighboringMonth,\n size,\n viewDate,\n onHeaderChange,\n onNextMonth,\n onPrevMonth,\n prevMonthIcon,\n nextMonthIcon,\n renderDayContent,\n onCalendarOpenChanged,\n calendarTestsProps,\n dayFieldTestId,\n monthFieldTestId,\n yearFieldTestId,\n hourFieldTestId,\n minuteFieldTestId,\n showCalendarButtonTestId,\n clearButtonTestId,\n id,\n onApply,\n renderCustomValue,\n timezone,\n restoreFocus,\n disableFocusTrap,\n readOnly,\n 'disableCalendar': disableCalendarProp = false,\n 'aria-label': ariaLabel = '',\n ...props\n}: DateInputProps): React.ReactNode => {\n const daysRef = React.useRef<HTMLSpanElement>(null);\n const monthsRef = React.useRef<HTMLSpanElement>(null);\n const yearsRef = React.useRef<HTMLSpanElement>(null);\n const hoursRef = React.useRef<HTMLSpanElement>(null);\n const minutesRef = React.useRef<HTMLSpanElement>(null);\n\n const disableCalendar = readOnly ? true : disableCalendarProp;\n\n const { value, updateValue, setInternalValue, getLastUpdatedValue, clearValue } =\n useDateInputValue({\n value: valueProp,\n defaultValue,\n onChange,\n timezone,\n });\n\n const maxElement = enableTime ? 4 : 2;\n\n const onInternalValueChange = React.useCallback(\n (internalValue: string[]) => {\n for (let i = 0; i <= maxElement; i += 1) {\n if (internalValue[i].length < elementsConfig(i).length) {\n return;\n }\n }\n\n let formattedValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n let mask = 'dd.MM.yyyy';\n if (enableTime) {\n formattedValue += ` ${internalValue[3]}:${internalValue[4]}`;\n mask += ' HH:mm';\n }\n\n if (isMatch(formattedValue, mask)) {\n const now = new Date();\n updateValue(\n parse(formattedValue, mask, value ?? (enableTime ? startOfMinute(now) : startOfDay(now))),\n );\n }\n },\n [enableTime, maxElement, updateValue, value],\n );\n\n const refs = React.useMemo(\n () => [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n [daysRef, monthsRef, yearsRef, hoursRef, minutesRef],\n );\n\n const {\n rootRef,\n calendarRef,\n open,\n internalValue,\n handleKeyDown,\n setFocusedElement,\n handleFieldEnter,\n clear,\n removeFocusFromField,\n closeCalendar,\n toggleCalendar,\n openCalendar,\n handleRestoreFocus,\n } = useDateInput({\n maxElement,\n refs,\n autoFocus,\n disabled: disabled \|\| readOnly,\n elementsConfig,\n onClear: clearValue,\n onInternalValueChange,\n getInternalValue,\n value,\n onCalendarOpenChanged,\n accessible,\n });\n\n const { sizeY = 'none' } = useAdaptivity();\n\n const handleRootRef = useExternRef(rootRef, getRootRef);\n\n useIsomorphicLayoutEffect(\n function resetValueOnCloseCalendar() {\n if (!open) {\n setInternalValue(getLastUpdatedValue());\n }\n },\n [open, getLastUpdatedValue],\n );\n\n const onCalendarChange = React.useCallback(\n (value?: Date \| undefined) => {\n if (!value) {\n return;\n }\n if (enableTime) {\n setInternalValue(value);\n return;\n }\n updateValue(value);\n if (closeOnChange) {\n removeFocusFromField();\n }\n },\n [enableTime, updateValue, closeOnChange, setInternalValue, removeFocusFromField],\n );\n\n const onDoneButtonClick = React.useCallback(() => {\n if (!value) {\n return;\n }\n const newValue = updateValue(value);\n onApply?.(newValue);\n removeFocusFromField();\n }, [onApply, removeFocusFromField, updateValue, value]);\n\n const customValue = React.useMemo(\n () => !open && renderCustomValue?.(value \|\| undefined),\n [open, renderCustomValue, value],\n );\n\n // при переключении месяцев высота календаря может меняться,\n // чтобы календарь не прыгал при переключении месяцев каждый раз на\n // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n // на ней, пока помещается.\n const [calendarPlacement, setCalendarPlacement] =\n React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n const { locale } = useConfigProvider();\n const currentDateLabel = value\n ? new Intl.DateTimeFormat(locale, {\n weekday: 'long',\n year: 'numeric',\n month: 'long',\n day: 'numeric',\n }).format(value)\n : null;\n const currentDateLabelId = React.useId();\n const ariaLabelId = React.useId();\n\n const showCalendarOnInputAreaClick = React.useCallback(() => {\n handleFieldEnter();\n if (accessible) {\n openCalendar();\n }\n }, [handleFieldEnter, openCalendar, accessible]);\n\n return (\n <FormField\n style={style}\n className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n getRootRef={handleRootRef}\n role=\"group\"\n aria-labelledby={`${ariaLabelId} ${currentDateLabelId}`}\n after={\n <React.Fragment>\n {!disableCalendar && (accessible \|\| (!accessible && !value)) ? (\n <IconButton\n hoverMode=\"opacity\"\n label={showCalendarLabel}\n onClick={toggleCalendar}\n data-testid={showCalendarButtonTestId}\n >\n <Icon20CalendarOutline />\n </IconButton>\n ) : null}\n {value && !readOnly ? (\n <IconButton\n hoverMode=\"opacity\"\n label={clearFieldLabel}\n onClick={clear}\n data-testid={clearButtonTestId}\n >\n <Icon16Clear />\n </IconButton>\n ) : null}\n </React.Fragment>\n }\n disabled={disabled}\n {...props}\n >\n <div className={styles.wrapper}>\n {ariaLabel && <VisuallyHidden id={ariaLabelId}>{ariaLabel}</VisuallyHidden>}\n {currentDateLabel && (\n <VisuallyHidden id={currentDateLabelId}>{currentDateLabel}</VisuallyHidden>\n )}\n <VisuallyHidden\n id={id}\n Component=\"input\"\n readOnly\n aria-hidden\n tabIndex={readOnly ? 0 : -1}\n name={name}\n value={value ? format(value, enableTime ? \"dd.MM.yyyy'T'HH:mm\" : 'dd.MM.yyyy') : ''}\n onFocus={handleFieldEnter}\n />\n <Text\n className={classNames(styles.input, customValue && styles.hidden)}\n // Инцидент: в PR https://github.com/VKCOM/VKUI/pull/6649 стабильно ломается порядок стилей\n // из-за чего `.Typography--normalize` перебивает стили.\n normalize={false}\n Component=\"span\" // для <span> нормализация не нужна\n onClick={showCalendarOnInputAreaClick}\n >\n <NumberInputLike\n value={internalValue[0]}\n minValue={1}\n maxValue={31}\n length={2}\n getRootRef={daysRef}\n index={0}\n onKeyDown={handleKeyDown}\n onElementSelect={setFocusedElement}\n label={changeDayLabel}\n readOnly={readOnly}\n data-testid={dayFieldTestId}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[1]}\n minValue={1}\n maxValue={12}\n length={2}\n getRootRef={monthsRef}\n index={1}\n onElementSelect={setFocusedElement}\n onKeyDown={handleKeyDown}\n readOnly={readOnly}\n label={changeMonthLabel}\n data-testid={monthFieldTestId}\n />\n <InputLikeDivider>.</InputLikeDivider>\n <NumberInputLike\n value={internalValue[2]}\n minValue={1}\n maxValue={275750}\n length={4}\n getRootRef={yearsRef}\n index={2}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeYearLabel}\n onKeyDown={handleKeyDown}\n data-testid={yearFieldTestId}\n />\n {enableTime && (\n <React.Fragment>\n <InputLikeDivider className={styles.inputTimeDivider}> </InputLikeDivider>\n <NumberInputLike\n value={internalValue[3]}\n minValue={1}\n maxValue={24}\n length={2}\n getRootRef={hoursRef}\n index={3}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeHoursLabel}\n onKeyDown={handleKeyDown}\n data-testid={hourFieldTestId}\n />\n <InputLikeDivider>:</InputLikeDivider>\n <NumberInputLike\n value={internalValue[4]}\n minValue={1}\n maxValue={59}\n length={2}\n getRootRef={minutesRef}\n index={4}\n onElementSelect={setFocusedElement}\n readOnly={readOnly}\n label={changeMinutesLabel}\n onKeyDown={handleKeyDown}\n data-testid={minuteFieldTestId}\n />\n </React.Fragment>\n )}\n </Text>\n {customValue && (\n <Text className={styles.customValue} aria-hidden>\n {customValue}\n </Text>\n )}\n </div>\n {open && !disableCalendar && (\n <Popper\n targetRef={rootRef}\n offsetByMainAxis={8}\n placement={calendarPlacement}\n onPlacementChange={setCalendarPlacement}\n autoUpdateOnTargetResize\n >\n <FocusTrap\n onClose={closeCalendar}\n disabled={disableFocusTrap ?? !accessible}\n restoreFocus={restoreFocus ?? (Boolean(accessible) && handleRestoreFocus)}\n captureEscapeKeyboardEvent={false}\n mutationObserverOptions={CALENDAR_MUTATION_OBSERVER_OPTIONS}\n >\n <Calendar\n aria-label={calendarLabel}\n role=\"dialog\"\n value={value}\n onChange={onCalendarChange}\n enableTime={enableTime}\n disablePast={disablePast}\n disableFuture={disableFuture}\n shouldDisableDate={shouldDisableDate}\n onDoneButtonClick={onDoneButtonClick}\n getRootRef={calendarRef}\n doneButtonText={doneButtonText}\n DoneButton={DoneButton}\n disablePickers={disablePickers}\n changeHoursLabel={changeHoursLabel}\n changeMinutesLabel={changeMinutesLabel}\n prevMonthLabel={prevMonthLabel}\n nextMonthLabel={nextMonthLabel}\n changeMonthLabel={changeMonthLabel}\n changeYearLabel={changeYearLabel}\n showNeighboringMonth={showNeighboringMonth}\n renderDayContent={renderDayContent}\n size={size}\n viewDate={viewDate}\n onHeaderChange={onHeaderChange}\n onNextMonth={onNextMonth}\n onPrevMonth={onPrevMonth}\n prevMonthIcon={prevMonthIcon}\n nextMonthIcon={nextMonthIcon}\n minDateTime={minDateTime}\n maxDateTime={maxDateTime}\n {...calendarTestsProps}\n />\n </FocusTrap>\n </Popper>\n )}\n </FormField>\n );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","startOfDay","startOfMinute","useAdaptivity","useDateInput","useExternRef","format","isMatch","parse","useIsomorphicLayoutEffect","Calendar","useConfigProvider","FocusTrap","FormField","IconButton","InputLikeDivider","NumberInputLike","Popper","Text","VisuallyHidden","useDateInputValue","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","CALENDAR_MUTATION_OBSERVER_OPTIONS","childList","subtree","attributes","attributeFilter","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","minDateTime","maxDateTime","valueProp","defaultValue","onChange","calendarPlacementProp","style","className","doneButtonText","DoneButton","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","accessible","calendarLabel","prevMonthLabel","nextMonthLabel","changeDayLabel","changeMonthLabel","changeYearLabel","changeHoursLabel","changeMinutesLabel","clearFieldLabel","showCalendarLabel","showNeighboringMonth","size","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","renderDayContent","onCalendarOpenChanged","calendarTestsProps","dayFieldTestId","monthFieldTestId","yearFieldTestId","hourFieldTestId","minuteFieldTestId","showCalendarButtonTestId","clearButtonTestId","id","onApply","renderCustomValue","timezone","restoreFocus","disableFocusTrap","readOnly","disableCalendarProp","ariaLabel","props","daysRef","useRef","monthsRef","yearsRef","hoursRef","minutesRef","disableCalendar","updateValue","setInternalValue","getLastUpdatedValue","clearValue","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","now","Date","refs","useMemo","rootRef","calendarRef","open","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","closeCalendar","toggleCalendar","openCalendar","handleRestoreFocus","onClear","sizeY","handleRootRef","resetValueOnCloseCalendar","onCalendarChange","onDoneButtonClick","customValue","undefined","calendarPlacement","setCalendarPlacement","useState","locale","currentDateLabel","Intl","DateTimeFormat","weekday","year","month","day","currentDateLabelId","useId","ariaLabelId","showCalendarOnInputAreaClick","role","aria-labelledby","after","Fragment","hoverMode","label","onClick","data-testid","div","Component","aria-hidden","tabIndex","onFocus","normalize","minValue","maxValue","onKeyDown","onElementSelect","targetRef","offsetByMainAxis","placement","onPlacementChange","autoUpdateOnTargetResize","onClose","Boolean","captureEscapeKeyboardEvent","mutationObserverOptions","aria-label"],"mappings":"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"}

package/dist/components/DateRangeInput/DateRangeInput.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { type UseFocusTrapProps } from '../../hooks/useFocusTrap';
 import type { PlacementWithAuto } from '../../lib/floating';
 import type { HasRootRef } from '../../types';
 import { type CalendarRangeProps, type CalendarRangeTestsProps } from '../CalendarRange/CalendarRange';
@@ -35,7 +36,7 @@ export type DateRangeInputTestsProps = {
      */
     clearButtonTestId?: string;
 };
-export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>, Pick<CalendarRangeProps, 'disablePast' | 'disableFuture' | 'shouldDisableDate' | 'onChange' | 'value' | 'defaultValue' | 'weekStartsOn' | 'disablePickers' | 'prevMonthLabel' | 'nextMonthLabel' | 'changeMonthLabel' | 'changeYearLabel' | 'changeDayLabel' | 'prevMonthIcon' | 'nextMonthIcon' | 'renderDayContent'>, HasRootRef<HTMLDivElement>, Omit<FormFieldProps, 'maxHeight'>, DateRangeInputTestsProps {
+export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>, Pick<CalendarRangeProps, 'disablePast' | 'disableFuture' | 'shouldDisableDate' | 'onChange' | 'value' | 'defaultValue' | 'weekStartsOn' | 'disablePickers' | 'prevMonthLabel' | 'nextMonthLabel' | 'changeMonthLabel' | 'changeYearLabel' | 'changeDayLabel' | 'prevMonthIcon' | 'nextMonthIcon' | 'renderDayContent'>, Pick<UseFocusTrapProps, 'restoreFocus'>, HasRootRef<HTMLDivElement>, Omit<FormFieldProps, 'maxHeight'>, DateRangeInputTestsProps {
     /**
      * Передает атрибуты `data-testid` для интерактивных элементов в календаре.
      */
@@ -52,6 +53,10 @@ export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTML
      * Обработчик изменения состояния открытия календаря.
      */
     onCalendarOpenChanged?: (opened: boolean) => void;
+    /**
+     * Label для календаря.
+     */
+    calendarLabel?: string;
     /**
      * Label для кнопки очистки. Делает доступным для ассистивных технологий.
      */
@@ -88,10 +93,25 @@ export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTML
      * Отключение открытия календаря.
      */
     disableCalendar?: boolean;
+    /**
+     * Позволяет отключить захват фокуса при появлении календаря.
+     */
+    disableFocusTrap?: UseFocusTrapProps['disabled'];
+    /**
+     * Включает режим в котором DateRangeInput доступен
+     * для ассистивных технологий.
+     * В этом режиме:
+     * - календарь больше не открывает при фокусе на DateRangeInput;
+     * - иконка календаря видна всегда, чтобы пользователи
+     * ассистивных технологий могли открыть календарь по клику на иконку;
+     * - календарь при открытии получает фокус, клавиатурный
+     * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.
+     */
+    accessible?: boolean;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/DateRangeInput
  */
-export declare const DateRangeInput: ({ shouldDisableDate, disableFuture, disablePast, value: valueProp, defaultValue, onChange, calendarPlacement: calendarPlacementProp, style, className, closeOnChange, disablePickers, getRootRef, name, autoFocus, disabled, onClick, onFocus, prevMonthLabel, nextMonthLabel, changeDayLabel, changeMonthLabel, changeYearLabel, changeStartDayLabel, changeStartMonthLabel, changeStartYearLabel, changeEndDayLabel, changeEndMonthLabel, changeEndYearLabel, clearFieldLabel, showCalendarLabel, prevMonthIcon, nextMonthIcon, disableCalendar, onCalendarOpenChanged, renderDayContent, calendarTestsProps, startDateTestsProps, endDateTestsProps, clearButtonTestId, showCalendarButtonTestId, id, ...props }: DateRangeInputProps) => React.ReactNode;
+export declare const DateRangeInput: ({ shouldDisableDate, disableFuture, disablePast, "value": valueProp, defaultValue, onChange, "calendarPlacement": calendarPlacementProp, style, className, closeOnChange, disablePickers, getRootRef, name, autoFocus, disabled, disableFocusTrap, restoreFocus, calendarLabel, prevMonthLabel, nextMonthLabel, changeMonthLabel, changeYearLabel, changeStartDayLabel, changeStartMonthLabel, changeStartYearLabel, changeEndDayLabel, changeEndMonthLabel, changeEndYearLabel, clearFieldLabel, showCalendarLabel, "aria-label": ariaLabel, prevMonthIcon, nextMonthIcon, onCalendarOpenChanged, renderDayContent, calendarTestsProps, startDateTestsProps, endDateTestsProps, clearButtonTestId, showCalendarButtonTestId, id, accessible, readOnly, "disableCalendar": disableCalendarProp, ...props }: DateRangeInputProps) => React.ReactNode;
 export {};
 //# sourceMappingURL=DateRangeInput.d.ts.map

package/dist/components/DateRangeInput/DateRangeInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;~~AAU~~/B,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,uBAAuB,EAE7B,MAAM,gCAAgC,CAAC;~~AACxC~~,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAexE,KAAK,cAAc,GAAG;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,mBAAmB,CAAC,EAAE,cAAc,CAAC;IACrC;;OAEG;IACH,iBAAiB,CAAC,EAAE,cAAc,CAAC;IACnC;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC,EAC5F,IAAI,CACF,kBAAkB,EAChB,aAAa,GACb,eAAe,GACf,mBAAmB,GACnB,UAAU,GACV,OAAO,GACP,cAAc,GACd,cAAc,GACd,gBAAgB,GAChB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,gBAAgB,GAChB,eAAe,GACf,eAAe,GACf,kBAAkB,CACrB,EACD,UAAU,CAAC,cAAc,CAAC,EAC1B,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,EACjC,wBAAwB;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,uBAAuB,CAAC;IAC7C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;~~CAC3B~~;~~AA0CD~~;;GAEG;AACH,eAAO,MAAM,cAAc,GAAI,~~qrBA2C5B~~,mBAAmB,KAAG,KAAK,CAAC,~~SAwP9B~~,CAAC"}
1	+ {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAElE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,uBAAuB,EAE7B,MAAM,gCAAgC,CAAC;AAGxC,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAexE,KAAK,cAAc,GAAG;IACpB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC;;OAEG;IACH,mBAAmB,CAAC,EAAE,cAAc,CAAC;IACrC;;OAEG;IACH,iBAAiB,CAAC,EAAE,cAAc,CAAC;IACnC;;OAEG;IACH,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,cAAc,GAAG,UAAU,CAAC,EAC5F,IAAI,CACF,kBAAkB,EAChB,aAAa,GACb,eAAe,GACf,mBAAmB,GACnB,UAAU,GACV,OAAO,GACP,cAAc,GACd,cAAc,GACd,gBAAgB,GAChB,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,gBAAgB,GAChB,eAAe,GACf,eAAe,GACf,kBAAkB,CACrB,EACD,IAAI,CAAC,iBAAiB,EAAE,cAAc,CAAC,EACvC,UAAU,CAAC,cAAc,CAAC,EAC1B,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,EACjC,wBAAwB;IAC1B;;OAEG;IACH,kBAAkB,CAAC,EAAE,uBAAuB,CAAC;IAC7C;;OAEG;IACH,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;OAEG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;OAEG;IACH,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,gBAAgB,CAAC,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACjD;;;;;;;;;OASG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAiDD;;GAEG;AACH,eAAO,MAAM,cAAc,GAAI,4wBA8C5B,mBAAmB,KAAG,KAAK,CAAC,SA8U9B,CAAC"}

package/dist/components/DateRangeInput/DateRangeInput.js CHANGED Viewed

@@ -2,7 +2,7 @@
 import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
 import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import { Icon16Clear, Icon20CalendarOutline } from "@vkontakte/icons";
 import { classNames } from "@vkontakte/vkjs";
@@ -11,13 +11,14 @@ import { useAdaptivity } from "../../hooks/useAdaptivity.js";
 import { useDateInput } from "../../hooks/useDateInput.js";
 import { useCustomEnsuredControl } from "../../hooks/useEnsuredControl.js";
 import { useExternRef } from "../../hooks/useExternRef.js";
-import { callMultiple } from "../../lib/callMultiple.js";
 import { format, isMatch, parse } from "../../lib/date.js";
 import { CalendarRange } from "../CalendarRange/CalendarRange.js";
+import { useConfigProvider } from "../ConfigProvider/ConfigProviderContext.js";
+import { FocusTrap } from "../FocusTrap/FocusTrap.js";
 import { FormField } from "../FormField/FormField.js";
 import { IconButton } from "../IconButton/IconButton.js";
-import { InputLike } from "../InputLike/InputLike.js";
 import { InputLikeDivider } from "../InputLike/InputLikeDivider.js";
+import { NumberInputLike } from "../NumberInputLike/NumberInputLike.js";
 import { Popper } from "../Popper/Popper.js";
 import { Text } from "../Typography/Text/Text.js";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
@@ -72,17 +73,25 @@ const getInternalValue = (value)=>{
     }
     return newValue;
 };
+const CALENDAR_MUTATION_OBSERVER_OPTIONS = {
+    childList: true,
+    subtree: true,
+    attributes: true,
+    attributeFilter: [
+        'tabindex'
+    ]
+};
 /**
  * @see https://vkcom.github.io/VKUI/#/DateRangeInput
  */ export const DateRangeInput = (_param)=>{
-    var { shouldDisableDate, disableFuture, disablePast, value: valueProp, defaultValue, onChange, calendarPlacement: calendarPlacementProp = 'bottom-start', style, className, closeOnChange = true, disablePickers, getRootRef, name, autoFocus, disabled, onClick, onFocus, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', changeDayLabel = 'Изменить день', changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeStartDayLabel = 'Изменить день начала', changeStartMonthLabel = 'Изменить месяц начала', changeStartYearLabel = 'Изменить год начала', changeEndDayLabel = 'Изменить день окончания', changeEndMonthLabel = 'Изменить месяц окончания', changeEndYearLabel = 'Изменить год окончания', clearFieldLabel = 'Очистить поле', showCalendarLabel = 'Показать календарь', prevMonthIcon, nextMonthIcon, disableCalendar = false, onCalendarOpenChanged, renderDayContent, calendarTestsProps, startDateTestsProps, endDateTestsProps, clearButtonTestId, showCalendarButtonTestId, id } = _param, props = _object_without_properties(_param, [
+    var { shouldDisableDate, disableFuture, disablePast, 'value': valueProp, defaultValue, onChange, 'calendarPlacement': calendarPlacementProp = 'bottom-start', style, className, closeOnChange = true, disablePickers, getRootRef, name, autoFocus, disabled, disableFocusTrap, restoreFocus, calendarLabel = 'Календарь', prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', changeMonthLabel = 'Месяц', changeYearLabel = 'Год', changeStartDayLabel = 'День начала', changeStartMonthLabel = 'Месяц начала', changeStartYearLabel = 'Год начала', changeEndDayLabel = 'День окончания', changeEndMonthLabel = 'Месяц окончания', changeEndYearLabel = 'Год окончания', clearFieldLabel = 'Очистить поле', showCalendarLabel = 'Показать календарь', 'aria-label': ariaLabel = '', prevMonthIcon, nextMonthIcon, onCalendarOpenChanged, renderDayContent, calendarTestsProps, startDateTestsProps, endDateTestsProps, clearButtonTestId, showCalendarButtonTestId, id, accessible, readOnly, 'disableCalendar': disableCalendarProp = false } = _param, props = _object_without_properties(_param, [
         "shouldDisableDate",
         "disableFuture",
         "disablePast",
-        "value",
+        'value',
         "defaultValue",
         "onChange",
-        "calendarPlacement",
+        'calendarPlacement',
         "style",
         "className",
         "closeOnChange",
@@ -91,11 +100,11 @@ const getInternalValue = (value)=>{
         "name",
         "autoFocus",
         "disabled",
-        "onClick",
-        "onFocus",
+        "disableFocusTrap",
+        "restoreFocus",
+        "calendarLabel",
         "prevMonthLabel",
         "nextMonthLabel",
-        "changeDayLabel",
         "changeMonthLabel",
         "changeYearLabel",
         "changeStartDayLabel",
@@ -106,9 +115,9 @@ const getInternalValue = (value)=>{
         "changeEndYearLabel",
         "clearFieldLabel",
         "showCalendarLabel",
+        'aria-label',
         "prevMonthIcon",
         "nextMonthIcon",
-        "disableCalendar",
         "onCalendarOpenChanged",
         "renderDayContent",
         "calendarTestsProps",
@@ -116,7 +125,10 @@ const getInternalValue = (value)=>{
         "endDateTestsProps",
         "clearButtonTestId",
         "showCalendarButtonTestId",
-        "id"
+        "id",
+        "accessible",
+        "readOnly",
+        'disableCalendar'
     ]);
     const daysStartRef = React.useRef(null);
     const monthsStartRef = React.useRef(null);
@@ -124,6 +136,7 @@ const getInternalValue = (value)=>{
     const daysEndRef = React.useRef(null);
     const monthsEndRef = React.useRef(null);
     const yearsEndRef = React.useRef(null);
+    const disableCalendar = readOnly ? true : disableCalendarProp;
     const _onChange = React.useCallback((newValue)=>onChange === null || onChange === void 0 ? void 0 : onChange(newValue || undefined), [
         onChange
     ]);
@@ -189,17 +202,18 @@ const getInternalValue = (value)=>{
     const onClear = React.useCallback(()=>updateValue(undefined), [
         updateValue
     ]);
-    const { rootRef, calendarRef, open, openCalendar, closeCalendar, internalValue, handleKeyDown, setFocusedElement, handleFieldEnter, clear, removeFocusFromField } = useDateInput({
+    const { rootRef, calendarRef, open, openCalendar, closeCalendar, toggleCalendar, internalValue, handleKeyDown, setFocusedElement, handleFieldEnter, clear, removeFocusFromField } = useDateInput({
         maxElement: 5,
         refs,
         autoFocus,
-        disabled,
+        disabled: disabled || readOnly,
         elementsConfig,
         onClear,
         onInternalValueChange,
         getInternalValue,
         value,
-        onCalendarOpenChanged
+        onCalendarOpenChanged,
+        accessible
     });
     const { sizeY = 'none' } = useAdaptivity();
     const handleRootRef = useExternRef(rootRef, getRootRef);
@@ -219,115 +233,187 @@ const getInternalValue = (value)=>{
     // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался
     // на ней, пока помещается.
     const [calendarPlacement, setCalendarPlacement] = React.useState(calendarPlacementProp);
+    const { locale } = useConfigProvider();
+    const currentDateLabel = React.useMemo(()=>{
+        if (!value) {
+            return null;
+        }
+        const [startDate, endDate] = value;
+        if (!startDate || !endDate) {
+            return null;
+        }
+        return [
+            new Intl.DateTimeFormat(locale, {
+                weekday: 'long',
+                year: 'numeric',
+                month: 'long',
+                day: 'numeric'
+            }).format(startDate),
+            new Intl.DateTimeFormat(locale, {
+                weekday: 'long',
+                year: 'numeric',
+                month: 'long',
+                day: 'numeric'
+            }).format(endDate)
+        ].join(' - ');
+    }, [
+        locale,
+        value
+    ]);
+    const currentDateLabelId = React.useId();
+    const ariaLabelId = React.useId();
+    const showCalendarOnInputAreaClick = React.useCallback(()=>{
+        handleFieldEnter();
+        if (accessible) {
+            openCalendar();
+        }
+    }, [
+        handleFieldEnter,
+        openCalendar,
+        accessible
+    ]);
     return /*#__PURE__*/ _jsxs(FormField, _object_spread_props(_object_spread({
         style: style,
         className: classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className),
         getRootRef: handleRootRef,
-        after: value ? /*#__PURE__*/ _jsxs(IconButton, {
-            hoverMode: "opacity",
-            onClick: clear,
-            "data-testid": clearButtonTestId,
-            children: [
-                /*#__PURE__*/ _jsx(VisuallyHidden, {
-                    children: clearFieldLabel
-                }),
-                /*#__PURE__*/ _jsx(Icon16Clear, {})
-            ]
-        }) : /*#__PURE__*/ _jsxs(IconButton, {
-            hoverMode: "opacity",
-            onClick: openCalendar,
-            "data-testid": showCalendarButtonTestId,
+        role: "group",
+        "aria-labelledby": `${ariaLabelId} ${currentDateLabelId}`,
+        after: /*#__PURE__*/ _jsxs(_Fragment, {
             children: [
-                /*#__PURE__*/ _jsx(VisuallyHidden, {
-                    children: showCalendarLabel
-                }),
-                /*#__PURE__*/ _jsx(Icon20CalendarOutline, {})
+                !disableCalendar && (accessible || !accessible && !value) ? /*#__PURE__*/ _jsx(IconButton, {
+                    hoverMode: "opacity",
+                    label: showCalendarLabel,
+                    onClick: toggleCalendar,
+                    "data-testid": showCalendarButtonTestId,
+                    children: /*#__PURE__*/ _jsx(Icon20CalendarOutline, {})
+                }) : null,
+                value && !readOnly ? /*#__PURE__*/ _jsx(IconButton, {
+                    hoverMode: "opacity",
+                    label: clearFieldLabel,
+                    onClick: clear,
+                    "data-testid": clearButtonTestId,
+                    children: /*#__PURE__*/ _jsx(Icon16Clear, {})
+                }) : null
             ]
         }),
-        disabled: disabled,
-        onClick: callMultiple(handleFieldEnter, onClick),
-        onFocus: callMultiple(handleFieldEnter, onFocus)
+        disabled: disabled
     }, props), {
         children: [
             /*#__PURE__*/ _jsxs("div", {
                 className: "vkuiDateInput__wrapper",
                 children: [
+                    ariaLabel && /*#__PURE__*/ _jsx(VisuallyHidden, {
+                        id: ariaLabelId,
+                        children: ariaLabel
+                    }),
+                    currentDateLabel && /*#__PURE__*/ _jsx(VisuallyHidden, {
+                        id: currentDateLabelId,
+                        children: currentDateLabel
+                    }),
                     /*#__PURE__*/ _jsx(VisuallyHidden, {
                         id: id,
                         Component: "input",
+                        readOnly: true,
+                        "aria-hidden": true,
                         name: name,
-                        value: value ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${value[1] ? format(value[1], 'dd.MM.yyyy') : ''}` : ''
+                        tabIndex: readOnly ? 0 : -1,
+                        value: value ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${value[1] ? format(value[1], 'dd.MM.yyyy') : ''}` : '',
+                        onFocus: handleFieldEnter
                     }),
                     /*#__PURE__*/ _jsxs(Text, {
                         className: "vkuiDateInput__input",
-                        onKeyDown: handleKeyDown,
+                        onClick: showCalendarOnInputAreaClick,
                         children: [
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[0],
+                                minValue: 1,
+                                maxValue: 31,
+                                onKeyDown: readOnly ? undefined : handleKeyDown,
                                 length: 2,
                                 getRootRef: daysStartRef,
                                 index: 0,
+                                readOnly: readOnly,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[0],
                                 label: changeStartDayLabel,
                                 "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.day
                             }),
                             /*#__PURE__*/ _jsx(InputLikeDivider, {
                                 children: "."
                             }),
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[1],
+                                minValue: 1,
+                                maxValue: 12,
+                                onKeyDown: handleKeyDown,
                                 length: 2,
                                 getRootRef: monthsStartRef,
                                 index: 1,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[1],
+                                readOnly: readOnly,
                                 label: changeStartMonthLabel,
                                 "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.month
                             }),
                             /*#__PURE__*/ _jsx(InputLikeDivider, {
                                 children: "."
                             }),
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[2],
+                                minValue: 1,
+                                maxValue: 275750,
+                                onKeyDown: handleKeyDown,
                                 length: 4,
                                 getRootRef: yearsStartRef,
                                 index: 2,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[2],
+                                readOnly: readOnly,
                                 label: changeStartYearLabel,
                                 "data-testid": startDateTestsProps === null || startDateTestsProps === void 0 ? void 0 : startDateTestsProps.year
                             }),
                             /*#__PURE__*/ _jsx(InputLikeDivider, {
                                 children: ' — '
                             }),
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[3],
+                                minValue: 1,
+                                maxValue: 31,
+                                onKeyDown: handleKeyDown,
                                 length: 2,
                                 getRootRef: daysEndRef,
                                 index: 3,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[3],
+                                readOnly: readOnly,
                                 label: changeEndDayLabel,
                                 "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.day
                             }),
                             /*#__PURE__*/ _jsx(InputLikeDivider, {
                                 children: "."
                             }),
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[4],
+                                minValue: 1,
+                                maxValue: 12,
+                                onKeyDown: handleKeyDown,
                                 length: 2,
                                 getRootRef: monthsEndRef,
                                 index: 4,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[4],
+                                readOnly: readOnly,
                                 label: changeEndMonthLabel,
                                 "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.month
                             }),
                             /*#__PURE__*/ _jsx(InputLikeDivider, {
                                 children: "."
                             }),
-                            /*#__PURE__*/ _jsx(InputLike, {
+                            /*#__PURE__*/ _jsx(NumberInputLike, {
+                                value: internalValue[5],
+                                minValue: 1,
+                                maxValue: 275750,
+                                onKeyDown: handleKeyDown,
                                 length: 4,
                                 getRootRef: yearsEndRef,
                                 index: 5,
                                 onElementSelect: setFocusedElement,
-                                value: internalValue[5],
+                                readOnly: readOnly,
                                 label: changeEndYearLabel,
                                 "data-testid": endDateTestsProps === null || endDateTestsProps === void 0 ? void 0 : endDateTestsProps.year
                             })
@@ -340,24 +426,31 @@ const getInternalValue = (value)=>{
                 offsetByMainAxis: 8,
                 placement: calendarPlacement,
                 onPlacementChange: setCalendarPlacement,
-                children: /*#__PURE__*/ _jsx(CalendarRange, _object_spread({
-                    value: value,
-                    onChange: onCalendarChange,
-                    disablePast: disablePast,
-                    disableFuture: disableFuture,
-                    shouldDisableDate: shouldDisableDate,
+                children: /*#__PURE__*/ _jsx(FocusTrap, {
                     onClose: closeCalendar,
-                    getRootRef: calendarRef,
-                    disablePickers: disablePickers,
-                    prevMonthLabel: prevMonthLabel,
-                    nextMonthLabel: nextMonthLabel,
-                    changeMonthLabel: changeMonthLabel,
-                    changeYearLabel: changeYearLabel,
-                    changeDayLabel: changeDayLabel,
-                    prevMonthIcon: prevMonthIcon,
-                    nextMonthIcon: nextMonthIcon,
-                    renderDayContent: renderDayContent
-                }, calendarTestsProps))
+                    disabled: disableFocusTrap !== null && disableFocusTrap !== void 0 ? disableFocusTrap : !accessible,
+                    restoreFocus: restoreFocus !== null && restoreFocus !== void 0 ? restoreFocus : Boolean(accessible),
+                    captureEscapeKeyboardEvent: false,
+                    mutationObserverOptions: CALENDAR_MUTATION_OBSERVER_OPTIONS,
+                    children: /*#__PURE__*/ _jsx(CalendarRange, _object_spread({
+                        value: value,
+                        role: "dialog",
+                        onChange: onCalendarChange,
+                        "aria-label": calendarLabel,
+                        disablePast: disablePast,
+                        disableFuture: disableFuture,
+                        shouldDisableDate: shouldDisableDate,
+                        getRootRef: calendarRef,
+                        disablePickers: disablePickers,
+                        prevMonthLabel: prevMonthLabel,
+                        nextMonthLabel: nextMonthLabel,
+                        changeMonthLabel: changeMonthLabel,
+                        changeYearLabel: changeYearLabel,
+                        prevMonthIcon: prevMonthIcon,
+                        nextMonthIcon: nextMonthIcon,
+                        renderDayContent: renderDayContent
+                    }, calendarTestsProps))
+                })
             })
         ]
     }));