@vkontakte/vkui 7.0.1 → 7.1.0

package/dist/components/DateInput/DateInput.js

@@ -12,6 +12,7 @@ import { useDateInput } from "../../hooks/useDateInput.js";
 import { useExternRef } from "../../hooks/useExternRef.js";
 import { callMultiple } from "../../lib/callMultiple.js";
 import { format, isMatch, parse } from "../../lib/date.js";
+import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect.js";
 import { Calendar } from "../Calendar/Calendar.js";
 import { FormField } from "../FormField/FormField.js";
 import { IconButton } from "../IconButton/IconButton.js";
@@ -19,6 +20,7 @@ import { InputLike } from "../InputLike/InputLike.js";
 import { InputLikeDivider } from "../InputLike/InputLikeDivider.js";
 import { Popper } from "../Popper/Popper.js";
 import { Text } from "../Typography/Text/Text.js";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.js";
 const sizeYClassNames = {
     none: "vkuiDateInput__sizeYNone",
     compact: "vkuiDateInput__sizeYCompact"
@@ -72,7 +74,7 @@ const getInternalValue = (value)=>{
 /**
  * @see https://vkcom.github.io/VKUI/#/DateInput
  */ export const DateInput = (_param)=>{
-    var { enableTime, shouldDisableDate, disableFuture, disablePast, minDateTime, maxDateTime, value, onChange, calendarPlacement = 'bottom-start', style, className, doneButtonText, closeOnChange = true, disablePickers, getRootRef, name, autoFocus, disabled, onClick, onFocus, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', showNeighboringMonth, size, changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeDayLabel = 'Изменить день', changeHoursLabel = 'Изменить час', changeMinutesLabel = 'Изменить минуту', clearFieldLabel = 'Очистить поле', showCalendarLabel = 'Показать календарь', viewDate, onHeaderChange, onNextMonth, onPrevMonth, prevMonthIcon, nextMonthIcon, disableCalendar = false, renderDayContent, onCalendarOpenChanged, calendarTestsProps, dayFieldTestId, monthFieldTestId, yearFieldTestId, hourFieldTestId, minuteFieldTestId } = _param, props = _object_without_properties(_param, [
+    var { enableTime, shouldDisableDate, disableFuture, disablePast, minDateTime, maxDateTime, value: valueProp, onChange, calendarPlacement = 'bottom-start', style, className, doneButtonText, DoneButton, closeOnChange = true, disablePickers, getRootRef, name, autoFocus, disabled, onClick, onFocus, prevMonthLabel = 'Предыдущий месяц', nextMonthLabel = 'Следующий месяц', showNeighboringMonth, size, changeMonthLabel = 'Изменить месяц', changeYearLabel = 'Изменить год', changeDayLabel = 'Изменить день', changeHoursLabel = 'Изменить час', changeMinutesLabel = 'Изменить минуту', clearFieldLabel = 'Очистить поле', showCalendarLabel = 'Показать календарь', viewDate, onHeaderChange, onNextMonth, onPrevMonth, prevMonthIcon, nextMonthIcon, disableCalendar = false, renderDayContent, onCalendarOpenChanged, calendarTestsProps, dayFieldTestId, monthFieldTestId, yearFieldTestId, hourFieldTestId, minuteFieldTestId, id, onApply } = _param, props = _object_without_properties(_param, [
         "enableTime",
         "shouldDisableDate",
         "disableFuture",
@@ -85,6 +87,7 @@ const getInternalValue = (value)=>{
         "style",
         "className",
         "doneButtonText",
+        "DoneButton",
         "closeOnChange",
         "disablePickers",
         "getRootRef",
@@ -118,14 +121,22 @@ const getInternalValue = (value)=>{
         "monthFieldTestId",
         "yearFieldTestId",
         "hourFieldTestId",
-        "minuteFieldTestId"
+        "minuteFieldTestId",
+        "id",
+        "onApply"
     ]);
     const daysRef = React.useRef(null);
     const monthsRef = React.useRef(null);
     const yearsRef = React.useRef(null);
     const hoursRef = React.useRef(null);
     const minutesRef = React.useRef(null);
+    const [value, setValue] = React.useState(valueProp);
     const maxElement = enableTime ? 4 : 2;
+    useIsomorphicLayoutEffect(function updateLocalValue() {
+        setValue(valueProp);
+    }, [
+        valueProp
+    ]);
     const onInternalValueChange = React.useCallback((internalValue)=>{
         for(let i = 0; i <= maxElement; i += 1){
             if (internalValue[i].length < elementsConfig(i).length) {
@@ -175,9 +186,21 @@ const getInternalValue = (value)=>{
     });
     const { sizeY = 'none' } = useAdaptivity();
     const handleRootRef = useExternRef(rootRef, getRootRef);
+    useIsomorphicLayoutEffect(function resetValueOnCloseCalendar() {
+        if (!open) {
+            setValue(valueProp);
+        }
+    }, [
+        open,
+        valueProp
+    ]);
     const onCalendarChange = React.useCallback((value)=>{
+        if (enableTime) {
+            setValue(value);
+            return;
+        }
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
-        if (closeOnChange && !enableTime) {
+        if (closeOnChange) {
             removeFocusFromField();
         }
     }, [
@@ -186,6 +209,16 @@ const getInternalValue = (value)=>{
         closeOnChange,
         enableTime
     ]);
+    const onDoneButtonClick = React.useCallback(()=>{
+        onApply === null || onApply === void 0 ? void 0 : onApply(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+        removeFocusFromField();
+    }, [
+        onApply,
+        onChange,
+        removeFocusFromField,
+        value
+    ]);
     return /*#__PURE__*/ _jsxs(FormField, _object_spread_props(_object_spread({
         style: style,
         className: classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className),
@@ -206,8 +239,9 @@ const getInternalValue = (value)=>{
         onFocus: callMultiple(handleFieldEnter, onFocus)
     }, props), {
         children: [
-            /*#__PURE__*/ _jsx("input", {
-                type: "hidden",
+            /*#__PURE__*/ _jsx(VisuallyHidden, {
+                id: id,
+                Component: "input",
                 name: name,
                 value: value ? format(value, enableTime ? "dd.MM.yyyy'T'HH:mm" : 'dd.MM.yyyy') : ''
             }),
@@ -296,9 +330,10 @@ const getInternalValue = (value)=>{
                     disablePast: disablePast,
                     disableFuture: disableFuture,
                     shouldDisableDate: shouldDisableDate,
-                    onDoneButtonClick: removeFocusFromField,
+                    onDoneButtonClick: onDoneButtonClick,
                     getRootRef: calendarRef,
                     doneButtonText: doneButtonText,
+                    DoneButton: DoneButton,
                     disablePickers: disablePickers,
                     changeHoursLabel: changeHoursLabel,
                     changeMinutesLabel: changeMinutesLabel,

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

@@ -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 { callMultiple } from '../../lib/callMultiple';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport { Calendar, type CalendarProps, type CalendarTestsProps } from '../Calendar/Calendar';\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 '../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  dayFieldTestId?: string;\n  monthFieldTestId?: string;\n  yearFieldTestId?: string;\n  hourFieldTestId?: string;\n  minuteFieldTestId?: string;\n};\n\nexport interface DateInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange' | 'size'>,\n    Pick<\n      CalendarProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'enableTime'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'doneButtonText'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'changeHoursLabel'\n      | 'changeMinutesLabel'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'showNeighboringMonth'\n      | 'size'\n      | 'viewDate'\n      | 'onHeaderChange'\n      | 'onNextMonth'\n      | 'onPrevMonth'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'minDateTime'\n      | 'maxDateTime'\n      | 'renderDayContent'\n    >,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateInputPropsTestsProps {\n  calendarTestsProps?: CalendarTestsProps;\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  clearFieldLabel?: string;\n  showCalendarLabel?: string;\n  disableCalendar?: boolean;\n  onCalendarOpenChanged?: (opened: boolean) => void;\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,\n  onChange,\n  calendarPlacement = 'bottom-start',\n  style,\n  className,\n  doneButtonText,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  showNeighboringMonth,\n  size,\n  changeMonthLabel = 'Изменить месяц',\n  changeYearLabel = 'Изменить год',\n  changeDayLabel = 'Изменить день',\n  changeHoursLabel = 'Изменить час',\n  changeMinutesLabel = 'Изменить минуту',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\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  ...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 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        onChange?.(\n          parse(formattedValue, mask, value ?? (enableTime ? startOfMinute(now) : startOfDay(now))),\n        );\n      }\n    },\n    [enableTime, maxElement, onChange, 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    openCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (value?: Date | undefined) => {\n      onChange?.(value);\n      if (closeOnChange && !enableTime) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, removeFocusFromField, closeOnChange, enableTime],\n  );\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" label={clearFieldLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" label={showCalendarLabel} onClick={openCalendar}>\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <input\n        type=\"hidden\"\n        name={name}\n        value={value ? format(value, enableTime ? \"dd.MM.yyyy'T'HH:mm\" : 'dd.MM.yyyy') : ''}\n      />\n      <Text\n        className={styles.input}\n        onKeyDown={handleKeyDown}\n        // Инцидент: в PR https://github.com/VKCOM/VKUI/pull/6649 стабильно ломается порядок стилей\n        // из-за чего `.Typography--normalize` перебивает стили.\n        normalize={false}\n        Component=\"span\" // для <span> нормализация не нужна\n      >\n        <InputLike\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          label={changeDayLabel}\n          data-testid={dayFieldTestId}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          label={changeMonthLabel}\n          data-testid={monthFieldTestId}\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          data-testid={yearFieldTestId}\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              data-testid={hourFieldTestId}\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              data-testid={minuteFieldTestId}\n            />\n          </React.Fragment>\n        )}\n      </Text>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetByMainAxis={8}\n          placement={calendarPlacement}\n          autoUpdateOnTargetResize\n        >\n          <Calendar\n            value={value}\n            onChange={onCalendarChange}\n            enableTime={enableTime}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onDoneButtonClick={removeFocusFromField}\n            getRootRef={calendarRef}\n            doneButtonText={doneButtonText}\n            disablePickers={disablePickers}\n            changeHoursLabel={changeHoursLabel}\n            changeMinutesLabel={changeMinutesLabel}\n            prevMonthLabel={prevMonthLabel}\n            nextMonthLabel={nextMonthLabel}\n            changeMonthLabel={changeMonthLabel}\n            changeYearLabel={changeYearLabel}\n            changeDayLabel={changeDayLabel}\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        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","startOfDay","startOfMinute","useAdaptivity","useDateInput","useExternRef","callMultiple","format","isMatch","parse","Calendar","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","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","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthLabel","nextMonthLabel","showNeighboringMonth","size","changeMonthLabel","changeYearLabel","changeDayLabel","changeHoursLabel","changeMinutesLabel","clearFieldLabel","showCalendarLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","renderDayContent","onCalendarOpenChanged","calendarTestsProps","dayFieldTestId","monthFieldTestId","yearFieldTestId","hourFieldTestId","minuteFieldTestId","props","daysRef","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","now","Date","refs","useMemo","rootRef","calendarRef","open","openCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","handleRootRef","onCalendarChange","after","hoverMode","label","input","type","onKeyDown","normalize","Component","onElementSelect","data-testid","Fragment","targetRef","offsetByMainAxis","placement","autoUpdateOnTargetResize","onDoneButtonClick"],"mappings":"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"}
+{"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 { callMultiple } from '../../lib/callMultiple';\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 { 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 '../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\nexport interface DateInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange' | 'size'>,\n    Pick<\n      CalendarProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'enableTime'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'doneButtonText'\n      | 'DoneButton'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'changeHoursLabel'\n      | 'changeMinutesLabel'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'showNeighboringMonth'\n      | 'size'\n      | 'viewDate'\n      | 'onHeaderChange'\n      | 'onNextMonth'\n      | 'onPrevMonth'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'minDateTime'\n      | 'maxDateTime'\n      | 'renderDayContent'\n    >,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateInputPropsTestsProps {\n  /**\n   * Передает атрибуты `data-testid` для интерактивных элементов в календаре\n   */\n  calendarTestsProps?: CalendarTestsProps;\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  clearFieldLabel?: string;\n  showCalendarLabel?: string;\n  disableCalendar?: boolean;\n  onCalendarOpenChanged?: (opened: boolean) => void;\n  /**\n   * Колбэк срабатывающий при нажатии на кнопку \"Done\". Используется совместно с флагом `enableTime`.\n   */\n  onApply?: (value?: Date) => void;\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  onChange,\n  calendarPlacement = '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  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  showNeighboringMonth,\n  size,\n  changeMonthLabel = 'Изменить месяц',\n  changeYearLabel = 'Изменить год',\n  changeDayLabel = 'Изменить день',\n  changeHoursLabel = 'Изменить час',\n  changeMinutesLabel = 'Изменить минуту',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\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  id,\n  onApply,\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  const [value, setValue] = React.useState<Date | undefined>(valueProp);\n\n  const maxElement = enableTime ? 4 : 2;\n\n  useIsomorphicLayoutEffect(\n    function updateLocalValue() {\n      setValue(valueProp);\n    },\n    [valueProp],\n  );\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        onChange?.(\n          parse(formattedValue, mask, value ?? (enableTime ? startOfMinute(now) : startOfDay(now))),\n        );\n      }\n    },\n    [enableTime, maxElement, onChange, 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    openCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  useIsomorphicLayoutEffect(\n    function resetValueOnCloseCalendar() {\n      if (!open) {\n        setValue(valueProp);\n      }\n    },\n    [open, valueProp],\n  );\n\n  const onCalendarChange = React.useCallback(\n    (value?: Date | undefined) => {\n      if (enableTime) {\n        setValue(value);\n        return;\n      }\n      onChange?.(value);\n      if (closeOnChange) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, removeFocusFromField, closeOnChange, enableTime],\n  );\n\n  const onDoneButtonClick = React.useCallback(() => {\n    onApply?.(value);\n    onChange?.(value);\n    removeFocusFromField();\n  }, [onApply, onChange, removeFocusFromField, value]);\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" label={clearFieldLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" label={showCalendarLabel} onClick={openCalendar}>\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <VisuallyHidden\n        id={id}\n        Component=\"input\"\n        name={name}\n        value={value ? format(value, enableTime ? \"dd.MM.yyyy'T'HH:mm\" : 'dd.MM.yyyy') : ''}\n      />\n      <Text\n        className={styles.input}\n        onKeyDown={handleKeyDown}\n        // Инцидент: в PR https://github.com/VKCOM/VKUI/pull/6649 стабильно ломается порядок стилей\n        // из-за чего `.Typography--normalize` перебивает стили.\n        normalize={false}\n        Component=\"span\" // для <span> нормализация не нужна\n      >\n        <InputLike\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          label={changeDayLabel}\n          data-testid={dayFieldTestId}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          label={changeMonthLabel}\n          data-testid={monthFieldTestId}\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          data-testid={yearFieldTestId}\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              data-testid={hourFieldTestId}\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              data-testid={minuteFieldTestId}\n            />\n          </React.Fragment>\n        )}\n      </Text>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetByMainAxis={8}\n          placement={calendarPlacement}\n          autoUpdateOnTargetResize\n        >\n          <Calendar\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            changeDayLabel={changeDayLabel}\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        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","startOfDay","startOfMinute","useAdaptivity","useDateInput","useExternRef","callMultiple","format","isMatch","parse","useIsomorphicLayoutEffect","Calendar","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","VisuallyHidden","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","onChange","calendarPlacement","style","className","doneButtonText","DoneButton","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthLabel","nextMonthLabel","showNeighboringMonth","size","changeMonthLabel","changeYearLabel","changeDayLabel","changeHoursLabel","changeMinutesLabel","clearFieldLabel","showCalendarLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","renderDayContent","onCalendarOpenChanged","calendarTestsProps","dayFieldTestId","monthFieldTestId","yearFieldTestId","hourFieldTestId","minuteFieldTestId","id","onApply","props","daysRef","useRef","monthsRef","yearsRef","hoursRef","minutesRef","setValue","useState","maxElement","updateLocalValue","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","now","Date","refs","useMemo","rootRef","calendarRef","open","openCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","sizeY","handleRootRef","resetValueOnCloseCalendar","onCalendarChange","onDoneButtonClick","after","hoverMode","label","Component","onKeyDown","normalize","onElementSelect","data-testid","Fragment","targetRef","offsetByMainAxis","placement","autoUpdateOnTargetResize"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,WAAW,EAAEC,qBAAqB,QAAQ,mBAAmB;AACtE,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,EAAEC,aAAa,QAAQ,WAAW;AACrD,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,MAAM,EAAEC,OAAO,EAAEC,KAAK,QAAQ,oBAAiB;AAExD,SAASC,yBAAyB,QAAQ,yCAAsC;AAEhF,SAASC,QAAQ,QAAqD,0BAAuB;AAC7F,SAASC,SAAS,QAA6B,4BAAyB;AACxE,SAASC,UAAU,QAAQ,8BAA2B;AACtD,SAASC,SAAS,QAAQ,4BAAyB;AACnD,SAASC,gBAAgB,QAAQ,mCAAgC;AACjE,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,IAAI,QAAQ,6BAA0B;AAC/C,SAASC,cAAc,QAAQ,sCAAmC;AAIlE,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AA6EA,MAAMC,iBAAiB,CAACC;IACtB,IAAIC,SAAS;IACb,IAAIC,MAAM;IACV,IAAIC,MAAM;IAEV,OAAQH;QACN,KAAK;YACHG,MAAM;YACN;QACF,KAAK;YACHA,MAAM;YACN;QACF,KAAK;YACHA,MAAM;YACND,MAAM;YACND,SAAS;YACT;QACF,KAAK;YACHE,MAAM;YACN;QACF,KAAK;YACHA,MAAM;YACN;IACJ;IAEA,OAAO;QAAEF;QAAQC;QAAKC;IAAI;AAC5B;AAEA,MAAMC,mBAAmB,CAACC;IACxB,MAAMC,WAAW;QAAC;QAAI;QAAI;QAAI;QAAI;KAAG;IACrC,IAAID,OAAO;QACTC,QAAQ,CAAC,EAAE,GAAGC,OAAOF,MAAMG,OAAO,IAAIC,QAAQ,CAAC,GAAG;QAClDH,QAAQ,CAAC,EAAE,GAAGC,OAAOF,MAAMK,QAAQ,KAAK,GAAGD,QAAQ,CAAC,GAAG;QACvDH,QAAQ,CAAC,EAAE,GAAGC,OAAOF,MAAMM,WAAW,IAAIF,QAAQ,CAAC,GAAG;QACtDH,QAAQ,CAAC,EAAE,GAAGC,OAAOF,MAAMO,QAAQ,IAAIH,QAAQ,CAAC,GAAG;QACnDH,QAAQ,CAAC,EAAE,GAAGC,OAAOF,MAAMQ,UAAU,IAAIJ,QAAQ,CAAC,GAAG;IACvD;IACA,OAAOH;AACT;AAEA;;CAEC,GACD,OAAO,MAAMQ,YAAY;QAAC,EACxBC,UAAU,EACVC,iBAAiB,EACjBC,aAAa,EACbC,WAAW,EACXC,WAAW,EACXC,WAAW,EACXf,OAAOgB,SAAS,EAChBC,QAAQ,EACRC,oBAAoB,cAAc,EAClCC,KAAK,EACLC,SAAS,EACTC,cAAc,EACdC,UAAU,EACVC,gBAAgB,IAAI,EACpBC,cAAc,EACdC,UAAU,EACVC,IAAI,EACJC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,OAAO,EACPC,iBAAiB,kBAAkB,EACnCC,iBAAiB,iBAAiB,EAClCC,oBAAoB,EACpBC,IAAI,EACJC,mBAAmB,gBAAgB,EACnCC,kBAAkB,cAAc,EAChCC,iBAAiB,eAAe,EAChCC,mBAAmB,cAAc,EACjCC,qBAAqB,iBAAiB,EACtCC,kBAAkB,eAAe,EACjCC,oBAAoB,oBAAoB,EACxCC,QAAQ,EACRC,cAAc,EACdC,WAAW,EACXC,WAAW,EACXC,aAAa,EACbC,aAAa,EACbC,kBAAkB,KAAK,EACvBC,gBAAgB,EAChBC,qBAAqB,EACrBC,kBAAkB,EAClBC,cAAc,EACdC,gBAAgB,EAChBC,eAAe,EACfC,eAAe,EACfC,iBAAiB,EACjBC,EAAE,EACFC,OAAO,EAEQ,WADZC;QAjDHjD;QACAC;QACAC;QACAC;QACAC;QACAC;QACAf;QACAiB;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,UAAU3F,MAAM4F,MAAM,CAAkB;IAC9C,MAAMC,YAAY7F,MAAM4F,MAAM,CAAkB;IAChD,MAAME,WAAW9F,MAAM4F,MAAM,CAAkB;IAC/C,MAAMG,WAAW/F,MAAM4F,MAAM,CAAkB;IAC/C,MAAMI,aAAahG,MAAM4F,MAAM,CAAkB;IACjD,MAAM,CAAC7D,OAAOkE,SAAS,GAAGjG,MAAMkG,QAAQ,CAAmBnD;IAE3D,MAAMoD,aAAa1D,aAAa,IAAI;IAEpC5B,0BACE,SAASuF;QACPH,SAASlD;IACX,GACA;QAACA;KAAU;IAGb,MAAMsD,wBAAwBrG,MAAMsG,WAAW,CAC7C,CAACC;QACC,IAAK,IAAIC,IAAI,GAAGA,KAAKL,YAAYK,KAAK,EAAG;YACvC,IAAID,aAAa,CAACC,EAAE,CAAC7E,MAAM,GAAGF,eAAe+E,GAAG7E,MAAM,EAAE;gBACtD;YACF;QACF;QAEA,IAAI8E,iBAAiB,GAAGF,aAAa,CAAC,EAAE,CAAC,CAAC,EAAEA,aAAa,CAAC,EAAE,CAAC,CAAC,EAAEA,aAAa,CAAC,EAAE,EAAE;QAClF,IAAIG,OAAO;QACX,IAAIjE,YAAY;YACdgE,kBAAkB,CAAC,CAAC,EAAEF,aAAa,CAAC,EAAE,CAAC,CAAC,EAAEA,aAAa,CAAC,EAAE,EAAE;YAC5DG,QAAQ;QACV;QAEA,IAAI/F,QAAQ8F,gBAAgBC,OAAO;YACjC,MAAMC,MAAM,IAAIC;YAChB5D,qBAAAA,+BAAAA,SACEpC,MAAM6F,gBAAgBC,MAAM3E,kBAAAA,mBAAAA,QAAUU,aAAapC,cAAcsG,OAAOvG,WAAWuG;QAEvF;IACF,GACA;QAAClE;QAAY0D;QAAYnD;QAAUjB;KAAM;IAG3C,MAAM8E,OAAO7G,MAAM8G,OAAO,CACxB,IAAM;YAACnB;YAASE;YAAWC;YAAUC;YAAUC;SAAW,EAC1D;QAACL;QAASE;QAAWC;QAAUC;QAAUC;KAAW;IAGtD,MAAM,EACJe,OAAO,EACPC,WAAW,EACXC,IAAI,EACJC,YAAY,EACZX,aAAa,EACbY,aAAa,EACbC,iBAAiB,EACjBC,gBAAgB,EAChBC,KAAK,EACLC,oBAAoB,EACrB,GAAGhH,aAAa;QACf4F;QACAU;QACAnD;QACAC;QACAlC;QACAuB;QACAqD;QACAvE;QACAC;QACAkD;IACF;IAEA,MAAM,EAAEuC,QAAQ,MAAM,EAAE,GAAGlH;IAE3B,MAAMmH,gBAAgBjH,aAAauG,SAASvD;IAE5C3C,0BACE,SAAS6G;QACP,IAAI,CAACT,MAAM;YACThB,SAASlD;QACX;IACF,GACA;QAACkE;QAAMlE;KAAU;IAGnB,MAAM4E,mBAAmB3H,MAAMsG,WAAW,CACxC,CAACvE;QACC,IAAIU,YAAY;YACdwD,SAASlE;YACT;QACF;QACAiB,qBAAAA,+BAAAA,SAAWjB;QACX,IAAIuB,eAAe;YACjBiE;QACF;IACF,GACA;QAACvE;QAAUuE;QAAsBjE;QAAeb;KAAW;IAG7D,MAAMmF,oBAAoB5H,MAAMsG,WAAW,CAAC;QAC1Cb,oBAAAA,8BAAAA,QAAU1D;QACViB,qBAAAA,+BAAAA,SAAWjB;QACXwF;IACF,GAAG;QAAC9B;QAASzC;QAAUuE;QAAsBxF;KAAM;IAEnD,qBACE,MAAChB;QACCmC,OAAOA;QACPC,WAAWhD,WAAWqH,UAAU,aAAalG,eAAe,CAACkG,MAAM,EAAErE;QACrEK,YAAYiE;QACZI,OACE9F,sBACE,KAACf;YAAW8G,WAAU;YAAUC,OAAOxD;YAAiBX,SAAS0D;sBAC/D,cAAA,KAACrH;2BAGH,KAACe;YAAW8G,WAAU;YAAUC,OAAOvD;YAAmBZ,SAASsD;sBACjE,cAAA,KAAChH;;QAIPyD,UAAUA;QACVC,SAASnD,aAAa4G,kBAAkBzD;QACxCC,SAASpD,aAAa4G,kBAAkBxD;OACpC6B;;0BAEJ,KAACrE;gBACCmE,IAAIA;gBACJwC,WAAU;gBACVvE,MAAMA;gBACN1B,OAAOA,QAAQrB,OAAOqB,OAAOU,aAAa,uBAAuB,gBAAgB;;0BAEnF,MAACrB;gBACC+B,SAAS;gBACT8E,WAAWd;gBACX,2FAA2F;gBAC3F,wDAAwD;gBACxDe,WAAW;gBACXF,WAAU,OAAO,mCAAmC;;;kCAEpD,KAAC/G;wBACCU,QAAQ;wBACR6B,YAAYmC;wBACZjE,OAAO;wBACPyG,iBAAiBf;wBACjBrF,OAAOwE,aAAa,CAAC,EAAE;wBACvBwB,OAAO3D;wBACPgE,eAAajD;;kCAEf,KAACjE;kCAAiB;;kCAClB,KAACD;wBACCU,QAAQ;wBACR6B,YAAYqC;wBACZnE,OAAO;wBACPyG,iBAAiBf;wBACjBrF,OAAOwE,aAAa,CAAC,EAAE;wBACvBwB,OAAO7D;wBACPkE,eAAahD;;kCAEf,KAAClE;kCAAiB;;kCAClB,KAACD;wBACCU,QAAQ;wBACR6B,YAAYsC;wBACZpE,OAAO;wBACPyG,iBAAiBf;wBACjBrF,OAAOwE,aAAa,CAAC,EAAE;wBACvBwB,OAAO5D;wBACPiE,eAAa/C;;oBAEd5C,4BACC,MAACzC,MAAMqI,QAAQ;;0CACb,KAACnH;gCAAiBiC,SAAS;0CAA2B;;0CACtD,KAAClC;gCACCU,QAAQ;gCACR6B,YAAYuC;gCACZrE,OAAO;gCACPyG,iBAAiBf;gCACjBrF,OAAOwE,aAAa,CAAC,EAAE;gCACvBwB,OAAO1D;gCACP+D,eAAa9C;;0CAEf,KAACpE;0CAAiB;;0CAClB,KAACD;gCACCU,QAAQ;gCACR6B,YAAYwC;gCACZtE,OAAO;gCACPyG,iBAAiBf;gCACjBrF,OAAOwE,aAAa,CAAC,EAAE;gCACvBwB,OAAOzD;gCACP8D,eAAa7C;;;;;;YAKpB0B,QAAQ,CAAClC,iCACR,KAAC5D;gBACCmH,WAAWvB;gBACXwB,kBAAkB;gBAClBC,WAAWvF;gBACXwF,wBAAwB;0BAExB,cAAA,KAAC3H;oBACCiB,OAAOA;oBACPiB,UAAU2E;oBACVlF,YAAYA;oBACZG,aAAaA;oBACbD,eAAeA;oBACfD,mBAAmBA;oBACnBkF,mBAAmBA;oBACnBpE,YAAYwD;oBACZ5D,gBAAgBA;oBAChBC,YAAYA;oBACZE,gBAAgBA;oBAChBc,kBAAkBA;oBAClBC,oBAAoBA;oBACpBR,gBAAgBA;oBAChBC,gBAAgBA;oBAChBG,kBAAkBA;oBAClBC,iBAAiBA;oBACjBC,gBAAgBA;oBAChBJ,sBAAsBA;oBACtBgB,kBAAkBA;oBAClBf,MAAMA;oBACNQ,UAAUA;oBACVC,gBAAgBA;oBAChBC,aAAaA;oBACbC,aAAaA;oBACbC,eAAeA;oBACfC,eAAeA;oBACfjC,aAAaA;oBACbC,aAAaA;mBACToC;;;;AAMhB,EAAE"}

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

@@ -4,15 +4,33 @@ import type { HasRootRef } from '../../types';
 import { type CalendarRangeProps, type CalendarRangeTestsProps } from '../CalendarRange/CalendarRange';
 import { type FormFieldProps } from '../FormField/FormField';
 type DateTestsProps = {
+    /**
+     * Передает атрибут `data-testid` для поля ввода дня
+     */
     day?: string;
+    /**
+     * Передает атрибут `data-testid` для поля ввода месяца
+     */
     month?: string;
+    /**
+     * Передает атрибут `data-testid` для поля ввода года
+     */
     year?: string;
 };
 export type DateRangeInputTestsProps = {
+    /**
+     * Передает атрибуты `data-testid` для полей ввода начальной даты
+     */
     startDateTestsProps?: DateTestsProps;
+    /**
+     * Передает атрибуты `data-testid` для полей ввода конечной даты
+     */
     endDateTestsProps?: DateTestsProps;
 };
 export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange'>, Pick<CalendarRangeProps, 'disablePast' | 'disableFuture' | 'shouldDisableDate' | 'onChange' | 'value' | 'weekStartsOn' | 'disablePickers' | 'prevMonthLabel' | 'nextMonthLabel' | 'changeMonthLabel' | 'changeYearLabel' | 'changeDayLabel' | 'prevMonthIcon' | 'nextMonthIcon' | 'renderDayContent'>, HasRootRef<HTMLDivElement>, Omit<FormFieldProps, 'maxHeight'>, DateRangeInputTestsProps {
+    /**
+     * Передает атрибуты `data-testid` для интерактивных элементов в календаре
+     */
     calendarTestsProps?: CalendarRangeTestsProps;
     calendarPlacement?: PlacementWithAuto;
     closeOnChange?: boolean;
@@ -30,6 +48,6 @@ export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTML
 /**
  * @see https://vkcom.github.io/VKUI/#/DateRangeInput
  */
-export declare const DateRangeInput: ({ shouldDisableDate, disableFuture, disablePast, value, onChange, calendarPlacement, 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, ...props }: DateRangeInputProps) => React.ReactNode;
+export declare const DateRangeInput: ({ shouldDisableDate, disableFuture, disablePast, value, onChange, calendarPlacement, 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, id, ...props }: DateRangeInputProps) => React.ReactNode;
 export {};
 //# sourceMappingURL=DateRangeInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/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,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG;IACrC,mBAAmB,CAAC,EAAE,cAAc,CAAC;IACrC,iBAAiB,CAAC,EAAE,cAAc,CAAC;CACpC,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,EAC3E,IAAI,CACF,kBAAkB,EAChB,aAAa,GACb,eAAe,GACf,mBAAmB,GACnB,UAAU,GACV,OAAO,GACP,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,kBAAkB,CAAC,EAAE,uBAAuB,CAAC;IAC7C,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA0CD;;GAEG;AACH,eAAO,MAAM,cAAc,ulBAuCxB,mBAAmB,KAAG,KAAK,CAAC,SAwN9B,CAAC"}
+{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/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;CACpC,CAAC;AAEF,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,cAAc,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,EAC3E,IAAI,CACF,kBAAkB,EAChB,aAAa,GACb,eAAe,GACf,mBAAmB,GACnB,UAAU,GACV,OAAO,GACP,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,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,qBAAqB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAClD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AA0CD;;GAEG;AACH,eAAO,MAAM,cAAc,2lBAwCxB,mBAAmB,KAAG,KAAK,CAAC,SAyN9B,CAAC"}

package/dist/components/DateRangeInput/DateRangeInput.js

@@ -74,7 +74,7 @@ const getInternalValue = (value)=>{
 /**
  * @see https://vkcom.github.io/VKUI/#/DateRangeInput
  */ export const DateRangeInput = (_param)=>{
-    var { shouldDisableDate, disableFuture, disablePast, value, onChange, calendarPlacement = '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 } = _param, props = _object_without_properties(_param, [
+    var { shouldDisableDate, disableFuture, disablePast, value, onChange, calendarPlacement = '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, id } = _param, props = _object_without_properties(_param, [
         "shouldDisableDate",
         "disableFuture",
         "disablePast",
@@ -111,7 +111,8 @@ const getInternalValue = (value)=>{
         "renderDayContent",
         "calendarTestsProps",
         "startDateTestsProps",
-        "endDateTestsProps"
+        "endDateTestsProps",
+        "id"
     ]);
     const daysStartRef = React.useRef(null);
     const monthsStartRef = React.useRef(null);
@@ -226,8 +227,9 @@ const getInternalValue = (value)=>{
         onFocus: callMultiple(handleFieldEnter, onFocus)
     }, props), {
         children: [
-            /*#__PURE__*/ _jsx("input", {
-                type: "hidden",
+            /*#__PURE__*/ _jsx(VisuallyHidden, {
+                id: id,
+                Component: "input",
                 name: name,
                 value: value ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${value[1] ? format(value[1], 'dd.MM.yyyy') : ''}` : ''
             }),

package/dist/components/DateRangeInput/DateRangeInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isAfter } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n  CalendarRange,\n  type CalendarRangeProps,\n  type CalendarRangeTestsProps,\n  type DateRangeType,\n} from '../CalendarRange/CalendarRange';\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 styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n  day?: string;\n  month?: string;\n  year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n  startDateTestsProps?: DateTestsProps;\n  endDateTestsProps?: DateTestsProps;\n};\n\nexport interface DateRangeInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange'>,\n    Pick<\n      CalendarRangeProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'renderDayContent'\n    >,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateRangeInputTestsProps {\n  calendarTestsProps?: CalendarRangeTestsProps;\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  onCalendarOpenChanged?: (opened: boolean) => void;\n  clearFieldLabel?: string;\n  showCalendarLabel?: string;\n  changeStartDayLabel?: string;\n  changeStartMonthLabel?: string;\n  changeStartYearLabel?: string;\n  changeEndDayLabel?: string;\n  changeEndMonthLabel?: string;\n  changeEndYearLabel?: string;\n  disableCalendar?: boolean;\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    case 3:\n      max = 31;\n      break;\n    case 1:\n    case 4:\n      max = 12;\n      break;\n    case 2:\n    case 5:\n      max = 2100;\n      min = 1900;\n      length = 4;\n      break;\n  }\n\n  return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n  const newValue = ['', '', '', '', '', ''];\n  if (value?.[0]) {\n    newValue[0] = String(value[0].getDate()).padStart(2, '0');\n    newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n    newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n  }\n  if (value?.[1]) {\n    newValue[3] = String(value[1].getDate()).padStart(2, '0');\n    newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n    newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n  }\n  return newValue;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DateRangeInput\n */\nexport const DateRangeInput = ({\n  shouldDisableDate,\n  disableFuture,\n  disablePast,\n  value,\n  onChange,\n  calendarPlacement = 'bottom-start',\n  style,\n  className,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  changeDayLabel = 'Изменить день',\n  changeMonthLabel = 'Изменить месяц',\n  changeYearLabel = 'Изменить год',\n  changeStartDayLabel = 'Изменить день начала',\n  changeStartMonthLabel = 'Изменить месяц начала',\n  changeStartYearLabel = 'Изменить год начала',\n  changeEndDayLabel = 'Изменить день окончания',\n  changeEndMonthLabel = 'Изменить месяц окончания',\n  changeEndYearLabel = 'Изменить год окончания',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  onCalendarOpenChanged,\n  renderDayContent,\n  calendarTestsProps,\n  startDateTestsProps,\n  endDateTestsProps,\n  ...props\n}: DateRangeInputProps): React.ReactNode => {\n  const daysStartRef = React.useRef<HTMLSpanElement>(null);\n  const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n  const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n  const daysEndRef = React.useRef<HTMLSpanElement>(null);\n  const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n  const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n  const onInternalValueChange = React.useCallback(\n    (internalValue: string[]) => {\n      let isStartValid = true;\n      let isEndValid = true;\n      for (let i = 0; i <= 2; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          isStartValid = false;\n        }\n      }\n      for (let i = 3; i <= 5; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          isEndValid = false;\n        }\n      }\n      const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n      const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n      const mask = 'dd.MM.yyyy';\n\n      if (!isMatch(formattedStartValue, mask)) {\n        isStartValid = false;\n      }\n      if (!isMatch(formattedEndValue, mask)) {\n        isEndValid = false;\n      }\n\n      if (!isStartValid && !isEndValid) {\n        return;\n      }\n\n      const valueExists = Array.isArray(value);\n      const now = new Date();\n      const start = isStartValid\n        ? parse(formattedStartValue, mask, (valueExists && value?.[0]) || now)\n        : null;\n      const end = isEndValid\n        ? parse(formattedEndValue, mask, (valueExists && value?.[1]) || now)\n        : null;\n      if (start && end && isAfter(end, start)) {\n        onChange?.([start, end]);\n      }\n    },\n    [onChange, value],\n  );\n\n  const refs = React.useMemo(\n    () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n    [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n  );\n\n  const {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar,\n    closeCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement: 5,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (newValue: DateRangeType | undefined) => {\n      onChange?.(newValue);\n      if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, closeOnChange, value, removeFocusFromField],\n  );\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" onClick={clear}>\n            <VisuallyHidden>{clearFieldLabel}</VisuallyHidden>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" onClick={openCalendar}>\n            <VisuallyHidden>{showCalendarLabel}</VisuallyHidden>\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <input\n        type=\"hidden\"\n        name={name}\n        value={\n          value\n            ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${\n                value[1] ? format(value[1], 'dd.MM.yyyy') : ''\n              }`\n            : ''\n        }\n      />\n      <Text className={dateInputStyles.input} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysStartRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          label={changeStartDayLabel}\n          data-testid={startDateTestsProps?.day}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsStartRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          label={changeStartMonthLabel}\n          data-testid={startDateTestsProps?.month}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsStartRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          label={changeStartYearLabel}\n          data-testid={startDateTestsProps?.year}\n        />\n        <InputLikeDivider>{' — '}</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={daysEndRef}\n          index={3}\n          onElementSelect={setFocusedElement}\n          value={internalValue[3]}\n          label={changeEndDayLabel}\n          data-testid={endDateTestsProps?.day}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsEndRef}\n          index={4}\n          onElementSelect={setFocusedElement}\n          value={internalValue[4]}\n          label={changeEndMonthLabel}\n          data-testid={endDateTestsProps?.month}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsEndRef}\n          index={5}\n          onElementSelect={setFocusedElement}\n          value={internalValue[5]}\n          label={changeEndYearLabel}\n          data-testid={endDateTestsProps?.year}\n        />\n      </Text>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetByMainAxis={8} placement={calendarPlacement}>\n          <CalendarRange\n            value={value}\n            onChange={onCalendarChange}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            disablePickers={disablePickers}\n            prevMonthLabel={prevMonthLabel}\n            nextMonthLabel={nextMonthLabel}\n            changeMonthLabel={changeMonthLabel}\n            changeYearLabel={changeYearLabel}\n            changeDayLabel={changeDayLabel}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n            renderDayContent={renderDayContent}\n            {...calendarTestsProps}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","isAfter","useAdaptivity","useDateInput","useExternRef","callMultiple","format","isMatch","parse","CalendarRange","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","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","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","after","hoverMode","input","type","onKeyDown","onElementSelect","label","data-testid","day","month","year","targetRef","offsetByMainAxis","placement","onClose"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isAfter } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n  CalendarRange,\n  type CalendarRangeProps,\n  type CalendarRangeTestsProps,\n  type DateRangeType,\n} from '../CalendarRange/CalendarRange';\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 styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n  /**\n   * Передает атрибут `data-testid` для поля ввода дня\n   */\n  day?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода месяца\n   */\n  month?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода года\n   */\n  year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n  /**\n   * Передает атрибуты `data-testid` для полей ввода начальной даты\n   */\n  startDateTestsProps?: DateTestsProps;\n  /**\n   * Передает атрибуты `data-testid` для полей ввода конечной даты\n   */\n  endDateTestsProps?: DateTestsProps;\n};\n\nexport interface DateRangeInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange'>,\n    Pick<\n      CalendarRangeProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'renderDayContent'\n    >,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateRangeInputTestsProps {\n  /**\n   * Передает атрибуты `data-testid` для интерактивных элементов в календаре\n   */\n  calendarTestsProps?: CalendarRangeTestsProps;\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  onCalendarOpenChanged?: (opened: boolean) => void;\n  clearFieldLabel?: string;\n  showCalendarLabel?: string;\n  changeStartDayLabel?: string;\n  changeStartMonthLabel?: string;\n  changeStartYearLabel?: string;\n  changeEndDayLabel?: string;\n  changeEndMonthLabel?: string;\n  changeEndYearLabel?: string;\n  disableCalendar?: boolean;\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    case 3:\n      max = 31;\n      break;\n    case 1:\n    case 4:\n      max = 12;\n      break;\n    case 2:\n    case 5:\n      max = 2100;\n      min = 1900;\n      length = 4;\n      break;\n  }\n\n  return { length, min, max };\n};\n\nconst getInternalValue = (value: CalendarRangeProps['value']) => {\n  const newValue = ['', '', '', '', '', ''];\n  if (value?.[0]) {\n    newValue[0] = String(value[0].getDate()).padStart(2, '0');\n    newValue[1] = String(value[0].getMonth() + 1).padStart(2, '0');\n    newValue[2] = String(value[0].getFullYear()).padStart(4, '0');\n  }\n  if (value?.[1]) {\n    newValue[3] = String(value[1].getDate()).padStart(2, '0');\n    newValue[4] = String(value[1].getMonth() + 1).padStart(2, '0');\n    newValue[5] = String(value[1].getFullYear()).padStart(4, '0');\n  }\n  return newValue;\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DateRangeInput\n */\nexport const DateRangeInput = ({\n  shouldDisableDate,\n  disableFuture,\n  disablePast,\n  value,\n  onChange,\n  calendarPlacement = 'bottom-start',\n  style,\n  className,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  changeDayLabel = 'Изменить день',\n  changeMonthLabel = 'Изменить месяц',\n  changeYearLabel = 'Изменить год',\n  changeStartDayLabel = 'Изменить день начала',\n  changeStartMonthLabel = 'Изменить месяц начала',\n  changeStartYearLabel = 'Изменить год начала',\n  changeEndDayLabel = 'Изменить день окончания',\n  changeEndMonthLabel = 'Изменить месяц окончания',\n  changeEndYearLabel = 'Изменить год окончания',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  onCalendarOpenChanged,\n  renderDayContent,\n  calendarTestsProps,\n  startDateTestsProps,\n  endDateTestsProps,\n  id,\n  ...props\n}: DateRangeInputProps): React.ReactNode => {\n  const daysStartRef = React.useRef<HTMLSpanElement>(null);\n  const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n  const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n  const daysEndRef = React.useRef<HTMLSpanElement>(null);\n  const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n  const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n  const onInternalValueChange = React.useCallback(\n    (internalValue: string[]) => {\n      let isStartValid = true;\n      let isEndValid = true;\n      for (let i = 0; i <= 2; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          isStartValid = false;\n        }\n      }\n      for (let i = 3; i <= 5; i += 1) {\n        if (internalValue[i].length < elementsConfig(i).length) {\n          isEndValid = false;\n        }\n      }\n      const formattedStartValue = `${internalValue[0]}.${internalValue[1]}.${internalValue[2]}`;\n      const formattedEndValue = `${internalValue[3]}.${internalValue[4]}.${internalValue[5]}`;\n      const mask = 'dd.MM.yyyy';\n\n      if (!isMatch(formattedStartValue, mask)) {\n        isStartValid = false;\n      }\n      if (!isMatch(formattedEndValue, mask)) {\n        isEndValid = false;\n      }\n\n      if (!isStartValid && !isEndValid) {\n        return;\n      }\n\n      const valueExists = Array.isArray(value);\n      const now = new Date();\n      const start = isStartValid\n        ? parse(formattedStartValue, mask, (valueExists && value?.[0]) || now)\n        : null;\n      const end = isEndValid\n        ? parse(formattedEndValue, mask, (valueExists && value?.[1]) || now)\n        : null;\n      if (start && end && isAfter(end, start)) {\n        onChange?.([start, end]);\n      }\n    },\n    [onChange, value],\n  );\n\n  const refs = React.useMemo(\n    () => [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n    [daysStartRef, monthsStartRef, yearsStartRef, daysEndRef, monthsEndRef, yearsEndRef],\n  );\n\n  const {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar,\n    closeCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement: 5,\n    refs,\n    autoFocus,\n    disabled,\n    elementsConfig,\n    onChange,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (newValue: DateRangeType | undefined) => {\n      onChange?.(newValue);\n      if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n        removeFocusFromField();\n      }\n    },\n    [onChange, closeOnChange, value, removeFocusFromField],\n  );\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" onClick={clear}>\n            <VisuallyHidden>{clearFieldLabel}</VisuallyHidden>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" onClick={openCalendar}>\n            <VisuallyHidden>{showCalendarLabel}</VisuallyHidden>\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <VisuallyHidden\n        id={id}\n        Component=\"input\"\n        name={name}\n        value={\n          value\n            ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${\n                value[1] ? format(value[1], 'dd.MM.yyyy') : ''\n              }`\n            : ''\n        }\n      />\n      <Text className={dateInputStyles.input} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysStartRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          label={changeStartDayLabel}\n          data-testid={startDateTestsProps?.day}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsStartRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          label={changeStartMonthLabel}\n          data-testid={startDateTestsProps?.month}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsStartRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          label={changeStartYearLabel}\n          data-testid={startDateTestsProps?.year}\n        />\n        <InputLikeDivider>{' — '}</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={daysEndRef}\n          index={3}\n          onElementSelect={setFocusedElement}\n          value={internalValue[3]}\n          label={changeEndDayLabel}\n          data-testid={endDateTestsProps?.day}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsEndRef}\n          index={4}\n          onElementSelect={setFocusedElement}\n          value={internalValue[4]}\n          label={changeEndMonthLabel}\n          data-testid={endDateTestsProps?.month}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsEndRef}\n          index={5}\n          onElementSelect={setFocusedElement}\n          value={internalValue[5]}\n          label={changeEndYearLabel}\n          data-testid={endDateTestsProps?.year}\n        />\n      </Text>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetByMainAxis={8} placement={calendarPlacement}>\n          <CalendarRange\n            value={value}\n            onChange={onCalendarChange}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            disablePickers={disablePickers}\n            prevMonthLabel={prevMonthLabel}\n            nextMonthLabel={nextMonthLabel}\n            changeMonthLabel={changeMonthLabel}\n            changeYearLabel={changeYearLabel}\n            changeDayLabel={changeDayLabel}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n            renderDayContent={renderDayContent}\n            {...calendarTestsProps}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","isAfter","useAdaptivity","useDateInput","useExternRef","callMultiple","format","isMatch","parse","CalendarRange","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","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","id","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","after","hoverMode","Component","onKeyDown","onElementSelect","label","data-testid","day","month","year","targetRef","offsetByMainAxis","placement","onClose"],"mappings":"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"}

package/dist/components/Epic/Epic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Epic.d.ts","sourceRoot":"","sources":["../../../src/components/Epic/Epic.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAK7D,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAC1E,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,oDAKd,SAAS,KAAG,KAAK,CAAC,SAuBpB,CAAC"}
+{"version":3,"file":"Epic.d.ts","sourceRoot":"","sources":["../../../src/components/Epic/Epic.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAK7D,MAAM,WAAW,SAAU,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAC1E,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,KAAK,CAAC,YAAY,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;CAC7D;AAID;;GAEG;AACH,eAAO,MAAM,IAAI,oDAKd,SAAS,KAAG,KAAK,CAAC,SAyBpB,CAAC"}

package/dist/components/Epic/Epic.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Epic/Epic.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getNavId } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollSaver } from './ScrollSaver';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  tabbar?: React.ReactNode;\n  activeStory: string;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nconst warn = warnOnce('Epic');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = ({\n  activeStory,\n  tabbar,\n  children,\n  ...restProps\n}: EpicProps): React.ReactNode => {\n  const scroll = React.useRef<{ [key: string]: number }>({}).current;\n\n  const story =\n    (React.Children.toArray(children).find(\n      (story) => React.isValidElement(story) && getNavId(story.props, warn) === activeStory,\n    ) as React.ReactElement | undefined) ?? null;\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(styles.host, tabbar && 'vkuiInternalEpic--hasTabbar')}\n    >\n      <ScrollSaver\n        key={activeStory}\n        initialScroll={scroll[activeStory] || 0}\n        saveScroll={(value) => (scroll[activeStory] = value)}\n      >\n        {story}\n      </ScrollSaver>\n      {tabbar}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","getNavId","warnOnce","RootComponent","ScrollSaver","warn","Epic","activeStory","tabbar","children","restProps","scroll","useRef","current","story","Children","toArray","find","isValidElement","props","baseClassName","initialScroll","saveScroll","value"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAQ,wBAAqB;AAC9C,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,WAAW,QAAQ,mBAAgB;AAS5C,MAAMC,OAAOH,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMI,OAAO;QAAC,EACnBC,WAAW,EACXC,MAAM,EACNC,QAAQ,EAEE,WADPC;QAHHH;QACAC;QACAC;;IAGA,MAAME,SAASZ,MAAMa,MAAM,CAA4B,CAAC,GAAGC,OAAO;QAG/Dd;IADH,MAAMe,QACJ,CAACf,+BAAAA,MAAMgB,QAAQ,CAACC,OAAO,CAACP,UAAUQ,IAAI,CACpC,CAACH,sBAAUf,MAAMmB,cAAc,CAACJ,UAAUb,SAASa,MAAMK,KAAK,EAAEd,UAAUE,0BAD3ER,0CAAAA,+BAEuC;IAE1C,qBACE,MAACI,uDACKO;QACJU,eAAepB,6BAAwBQ,UAAU;;0BAEjD,KAACJ;gBAECiB,eAAeV,MAAM,CAACJ,YAAY,IAAI;gBACtCe,YAAY,CAACC,QAAWZ,MAAM,CAACJ,YAAY,GAAGgB;0BAE7CT;eAJIP;YAMNC;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Epic/Epic.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getNavId, type NavIdProps } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { ScrollSaver } from './ScrollSaver';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  tabbar?: React.ReactNode;\n  activeStory: string;\n  children: React.ReactElement | Iterable<React.ReactElement>;\n}\n\nconst warn = warnOnce('Epic');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = ({\n  activeStory,\n  tabbar,\n  children,\n  ...restProps\n}: EpicProps): React.ReactNode => {\n  const scroll = React.useRef<{ [key: string]: number }>({}).current;\n\n  const story =\n    (React.Children.toArray(children).find(\n      (story) =>\n        React.isValidElement(story) &&\n        getNavId((story as React.ReactElement<NavIdProps>).props, warn) === activeStory,\n    ) as Array<React.ReactElement<NavIdProps>> | undefined) ?? null;\n\n  return (\n    <RootComponent\n      {...restProps}\n      baseClassName={classNames(styles.host, tabbar && 'vkuiInternalEpic--hasTabbar')}\n    >\n      <ScrollSaver\n        key={activeStory}\n        initialScroll={scroll[activeStory] || 0}\n        saveScroll={(value) => (scroll[activeStory] = value)}\n      >\n        {story}\n      </ScrollSaver>\n      {tabbar}\n    </RootComponent>\n  );\n};\n"],"names":["React","classNames","getNavId","warnOnce","RootComponent","ScrollSaver","warn","Epic","activeStory","tabbar","children","restProps","scroll","useRef","current","story","Children","toArray","find","isValidElement","props","baseClassName","initialScroll","saveScroll","value"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAyB,wBAAqB;AAC/D,SAASC,QAAQ,QAAQ,wBAAqB;AAE9C,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,WAAW,QAAQ,mBAAgB;AAS5C,MAAMC,OAAOH,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMI,OAAO;QAAC,EACnBC,WAAW,EACXC,MAAM,EACNC,QAAQ,EAEE,WADPC;QAHHH;QACAC;QACAC;;IAGA,MAAME,SAASZ,MAAMa,MAAM,CAA4B,CAAC,GAAGC,OAAO;QAG/Dd;IADH,MAAMe,QACJ,CAACf,+BAAAA,MAAMgB,QAAQ,CAACC,OAAO,CAACP,UAAUQ,IAAI,CACpC,CAACH,sBACCf,MAAMmB,cAAc,CAACJ,UACrBb,SAAS,AAACa,MAAyCK,KAAK,EAAEd,UAAUE,0BAHvER,0CAAAA,+BAI0D;IAE7D,qBACE,MAACI,uDACKO;QACJU,eAAepB,6BAAwBQ,UAAU;;0BAEjD,KAACJ;gBAECiB,eAAeV,MAAM,CAACJ,YAAY,IAAI;gBACtCe,YAAY,CAACC,QAAWZ,MAAM,CAACJ,YAAY,GAAGgB;0BAE7CT;eAJIP;YAMNC;;;AAGP,EAAE"}

package/dist/components/FixedLayout/FixedLayout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FixedLayout.d.ts","sourceRoot":"","sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,YAAY,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAU3E,MAAM,WAAW,gBAAiB,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,YAAY;IAC/F,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,UAAU,GAAG,IAAI,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,+FASrB,gBAAgB,KAAG,KAAK,CAAC,SA6D3B,CAAC"}
+{"version":3,"file":"FixedLayout.d.ts","sourceRoot":"","sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,YAAY,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAU3E,MAAM,WAAW,gBAAiB,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAAE,YAAY;IAC/F,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,EAAE,UAAU,GAAG,IAAI,CAAC;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,eAAO,MAAM,WAAW,+FASrB,gBAAgB,KAAG,KAAK,CAAC,SA6D3B,CAAC"}

package/dist/components/FixedLayout/FixedLayout.js

@@ -6,7 +6,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback } from "react";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
-import { useGlobalEventListener } from "../../hooks/useGlobalEventListener.js";
 import { usePlatform } from "../../hooks/usePlatform.js";
 import { useResizeObserver } from "../../hooks/useResizeObserver.js";
 import { useDOM } from "../../lib/dom.js";
@@ -62,7 +61,7 @@ const stylesVertical = {
         ref,
         useParentWidth
     ]);
-    useGlobalEventListener(window, 'resize', doResize);
+    useResizeObserver(window, doResize);
     useResizeObserver(useParentWidth ? parentRef : colRef, doResize);
     return /*#__PURE__*/ _jsx(OnboardingTooltipContainer, _object_spread_props(_object_spread({}, restProps), {
         fixed: true,

package/dist/components/FixedLayout/FixedLayout.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { setRef } from '../../lib/utils';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './FixedLayout.module.css';\n\nconst stylesVertical = {\n  top: styles.verticalTop,\n  bottom: classNames(styles.verticalBottom, 'vkuiInternalFixedLayout--vertical-bottom'),\n};\n\nexport interface FixedLayoutProps extends HTMLAttributesWithRootRef<HTMLDivElement>, HasComponent {\n  vertical?: 'top' | 'bottom';\n  /**\n   * Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n   * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n   */\n  filled?: boolean;\n  /**\n   * Всегда соответствовать ширине родителя.\n   * Ширина пересчитывается по событию `window` `resize`.\n   */\n  useParentWidth?: boolean;\n}\n\nexport interface FixedLayoutState {\n  position: 'absolute' | null;\n  top: number;\n  bottom: number;\n  width: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FixedLayout\n */\nexport const FixedLayout = ({\n  children,\n  style,\n  vertical,\n  getRootRef,\n  filled,\n  className,\n  useParentWidth,\n  ...restProps\n}: FixedLayoutProps): React.ReactNode => {\n  const platform = usePlatform();\n  const ref = React.useRef<HTMLElement | null>(null);\n  const [width, setWidth] = React.useState<string | undefined>(undefined);\n  const { window } = useDOM();\n  const { colRef } = React.useContext(SplitColContext);\n  const parentRef = React.useRef<HTMLElement | null>(null);\n\n  const handleRootRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (!node) {\n        return;\n      }\n\n      setRef(node, getRootRef);\n      setRef(node, ref);\n      setRef(node.parentElement, parentRef);\n    },\n    [getRootRef],\n  );\n\n  const doResize = () => {\n    if (useParentWidth && parentRef.current) {\n      const parentWidth = parentRef.current.getBoundingClientRect().width;\n      setWidth(parentWidth ? `${parentWidth}px` : undefined);\n    } else if (colRef?.current) {\n      const computedStyle = getComputedStyle(colRef.current);\n\n      setWidth(\n        `${\n          colRef.current.clientWidth -\n          parseFloat(computedStyle.paddingLeft || '0') -\n          parseFloat(computedStyle.paddingRight || '0')\n        }px`,\n      );\n    } else {\n      setWidth(undefined);\n    }\n  };\n  React.useEffect(doResize, [colRef, platform, ref, useParentWidth]);\n\n  useGlobalEventListener(window, 'resize', doResize);\n  useResizeObserver(useParentWidth ? parentRef : colRef, doResize);\n\n  return (\n    <OnboardingTooltipContainer\n      {...restProps}\n      fixed\n      ref={handleRootRef}\n      className={classNames(\n        styles.host,\n        platform === 'ios' && 'vkuiInternalFixedLayout--ios',\n        filled && styles.filled,\n        vertical && stylesVertical[vertical],\n        className,\n      )}\n      style={{ width, ...style }}\n    >\n      {children}\n    </OnboardingTooltipContainer>\n  );\n};\n"],"names":["useCallback","React","classNames","useGlobalEventListener","usePlatform","useResizeObserver","useDOM","setRef","OnboardingTooltipContainer","SplitColContext","stylesVertical","top","bottom","FixedLayout","children","style","vertical","getRootRef","filled","className","useParentWidth","restProps","platform","ref","useRef","width","setWidth","useState","undefined","window","colRef","useContext","parentRef","handleRootRef","node","parentElement","doResize","current","parentWidth","getBoundingClientRect","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","fixed"],"mappings":"AAAA;;;;;AAEA,SAASA,WAAW,QAAQ,QAAQ;AACpC,YAAYC,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,sBAAsB,QAAQ,wCAAqC;AAC5E,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,MAAM,QAAQ,qBAAkB;AAEzC,SAASC,0BAA0B,QAAQ,qDAAkD;AAC7F,SAASC,eAAe,QAAQ,iCAA8B;AAG9D,MAAMC,iBAAiB;IACrBC,GAAG;IACHC,QAAQV,8CAAkC;AAC5C;AAuBA;;CAEC,GACD,OAAO,MAAMW,cAAc;QAAC,EAC1BC,QAAQ,EACRC,KAAK,EACLC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,cAAc,EAEG,WADdC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWlB;IACjB,MAAMmB,MAAMtB,MAAMuB,MAAM,CAAqB;IAC7C,MAAM,CAACC,OAAOC,SAAS,GAAGzB,MAAM0B,QAAQ,CAAqBC;IAC7D,MAAM,EAAEC,MAAM,EAAE,GAAGvB;IACnB,MAAM,EAAEwB,MAAM,EAAE,GAAG7B,MAAM8B,UAAU,CAACtB;IACpC,MAAMuB,YAAY/B,MAAMuB,MAAM,CAAqB;IAEnD,MAAMS,gBAAgBjC,YACpB,CAACkC;QACC,IAAI,CAACA,MAAM;YACT;QACF;QAEA3B,OAAO2B,MAAMjB;QACbV,OAAO2B,MAAMX;QACbhB,OAAO2B,KAAKC,aAAa,EAAEH;IAC7B,GACA;QAACf;KAAW;IAGd,MAAMmB,WAAW;QACf,IAAIhB,kBAAkBY,UAAUK,OAAO,EAAE;YACvC,MAAMC,cAAcN,UAAUK,OAAO,CAACE,qBAAqB,GAAGd,KAAK;YACnEC,SAASY,cAAc,GAAGA,YAAY,EAAE,CAAC,GAAGV;QAC9C,OAAO,IAAIE,mBAAAA,6BAAAA,OAAQO,OAAO,EAAE;YAC1B,MAAMG,gBAAgBC,iBAAiBX,OAAOO,OAAO;YAErDX,SACE,GACEI,OAAOO,OAAO,CAACK,WAAW,GAC1BC,WAAWH,cAAcI,WAAW,IAAI,OACxCD,WAAWH,cAAcK,YAAY,IAAI,KAC1C,EAAE,CAAC;QAER,OAAO;YACLnB,SAASE;QACX;IACF;IACA3B,MAAM6C,SAAS,CAACV,UAAU;QAACN;QAAQR;QAAUC;QAAKH;KAAe;IAEjEjB,uBAAuB0B,QAAQ,UAAUO;IACzC/B,kBAAkBe,iBAAiBY,YAAYF,QAAQM;IAEvD,qBACE,KAAC5B,oEACKa;QACJ0B,KAAK;QACLxB,KAAKU;QACLd,WAAWjB,oCAEToB,aAAa,SAAS,gCACtBJ,qCACAF,YAAYN,cAAc,CAACM,SAAS,EACpCG;QAEFJ,OAAO;YAAEU;WAAUV;kBAElBD;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["'use client';\n\nimport { useCallback } from 'react';\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useResizeObserver } from '../../hooks/useResizeObserver';\nimport { useDOM } from '../../lib/dom';\nimport { setRef } from '../../lib/utils';\nimport type { HasComponent, HTMLAttributesWithRootRef } from '../../types';\nimport { OnboardingTooltipContainer } from '../OnboardingTooltip/OnboardingTooltipContainer';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport styles from './FixedLayout.module.css';\n\nconst stylesVertical = {\n  top: styles.verticalTop,\n  bottom: classNames(styles.verticalBottom, 'vkuiInternalFixedLayout--vertical-bottom'),\n};\n\nexport interface FixedLayoutProps extends HTMLAttributesWithRootRef<HTMLDivElement>, HasComponent {\n  vertical?: 'top' | 'bottom';\n  /**\n   * Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n   * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n   */\n  filled?: boolean;\n  /**\n   * Всегда соответствовать ширине родителя.\n   * Ширина пересчитывается по событию `window` `resize`.\n   */\n  useParentWidth?: boolean;\n}\n\nexport interface FixedLayoutState {\n  position: 'absolute' | null;\n  top: number;\n  bottom: number;\n  width: string;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FixedLayout\n */\nexport const FixedLayout = ({\n  children,\n  style,\n  vertical,\n  getRootRef,\n  filled,\n  className,\n  useParentWidth,\n  ...restProps\n}: FixedLayoutProps): React.ReactNode => {\n  const platform = usePlatform();\n  const ref = React.useRef<HTMLElement | null>(null);\n  const [width, setWidth] = React.useState<string | undefined>(undefined);\n  const { window } = useDOM();\n  const { colRef } = React.useContext(SplitColContext);\n  const parentRef = React.useRef<HTMLElement | null>(null);\n\n  const handleRootRef = useCallback(\n    (node: HTMLElement | null) => {\n      if (!node) {\n        return;\n      }\n\n      setRef(node, getRootRef);\n      setRef(node, ref);\n      setRef(node.parentElement, parentRef);\n    },\n    [getRootRef],\n  );\n\n  const doResize = () => {\n    if (useParentWidth && parentRef.current) {\n      const parentWidth = parentRef.current.getBoundingClientRect().width;\n      setWidth(parentWidth ? `${parentWidth}px` : undefined);\n    } else if (colRef?.current) {\n      const computedStyle = getComputedStyle(colRef.current);\n\n      setWidth(\n        `${\n          colRef.current.clientWidth -\n          parseFloat(computedStyle.paddingLeft || '0') -\n          parseFloat(computedStyle.paddingRight || '0')\n        }px`,\n      );\n    } else {\n      setWidth(undefined);\n    }\n  };\n  React.useEffect(doResize, [colRef, platform, ref, useParentWidth]);\n\n  useResizeObserver(window, doResize);\n  useResizeObserver(useParentWidth ? parentRef : colRef, doResize);\n\n  return (\n    <OnboardingTooltipContainer\n      {...restProps}\n      fixed\n      ref={handleRootRef}\n      className={classNames(\n        styles.host,\n        platform === 'ios' && 'vkuiInternalFixedLayout--ios',\n        filled && styles.filled,\n        vertical && stylesVertical[vertical],\n        className,\n      )}\n      style={{ width, ...style }}\n    >\n      {children}\n    </OnboardingTooltipContainer>\n  );\n};\n"],"names":["useCallback","React","classNames","usePlatform","useResizeObserver","useDOM","setRef","OnboardingTooltipContainer","SplitColContext","stylesVertical","top","bottom","FixedLayout","children","style","vertical","getRootRef","filled","className","useParentWidth","restProps","platform","ref","useRef","width","setWidth","useState","undefined","window","colRef","useContext","parentRef","handleRootRef","node","parentElement","doResize","current","parentWidth","getBoundingClientRect","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","fixed"],"mappings":"AAAA;;;;;AAEA,SAASA,WAAW,QAAQ,QAAQ;AACpC,YAAYC,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,MAAM,QAAQ,mBAAgB;AACvC,SAASC,MAAM,QAAQ,qBAAkB;AAEzC,SAASC,0BAA0B,QAAQ,qDAAkD;AAC7F,SAASC,eAAe,QAAQ,iCAA8B;AAG9D,MAAMC,iBAAiB;IACrBC,GAAG;IACHC,QAAQT,8CAAkC;AAC5C;AAuBA;;CAEC,GACD,OAAO,MAAMU,cAAc;QAAC,EAC1BC,QAAQ,EACRC,KAAK,EACLC,QAAQ,EACRC,UAAU,EACVC,MAAM,EACNC,SAAS,EACTC,cAAc,EAEG,WADdC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,WAAWlB;IACjB,MAAMmB,MAAMrB,MAAMsB,MAAM,CAAqB;IAC7C,MAAM,CAACC,OAAOC,SAAS,GAAGxB,MAAMyB,QAAQ,CAAqBC;IAC7D,MAAM,EAAEC,MAAM,EAAE,GAAGvB;IACnB,MAAM,EAAEwB,MAAM,EAAE,GAAG5B,MAAM6B,UAAU,CAACtB;IACpC,MAAMuB,YAAY9B,MAAMsB,MAAM,CAAqB;IAEnD,MAAMS,gBAAgBhC,YACpB,CAACiC;QACC,IAAI,CAACA,MAAM;YACT;QACF;QAEA3B,OAAO2B,MAAMjB;QACbV,OAAO2B,MAAMX;QACbhB,OAAO2B,KAAKC,aAAa,EAAEH;IAC7B,GACA;QAACf;KAAW;IAGd,MAAMmB,WAAW;QACf,IAAIhB,kBAAkBY,UAAUK,OAAO,EAAE;YACvC,MAAMC,cAAcN,UAAUK,OAAO,CAACE,qBAAqB,GAAGd,KAAK;YACnEC,SAASY,cAAc,GAAGA,YAAY,EAAE,CAAC,GAAGV;QAC9C,OAAO,IAAIE,mBAAAA,6BAAAA,OAAQO,OAAO,EAAE;YAC1B,MAAMG,gBAAgBC,iBAAiBX,OAAOO,OAAO;YAErDX,SACE,GACEI,OAAOO,OAAO,CAACK,WAAW,GAC1BC,WAAWH,cAAcI,WAAW,IAAI,OACxCD,WAAWH,cAAcK,YAAY,IAAI,KAC1C,EAAE,CAAC;QAER,OAAO;YACLnB,SAASE;QACX;IACF;IACA1B,MAAM4C,SAAS,CAACV,UAAU;QAACN;QAAQR;QAAUC;QAAKH;KAAe;IAEjEf,kBAAkBwB,QAAQO;IAC1B/B,kBAAkBe,iBAAiBY,YAAYF,QAAQM;IAEvD,qBACE,KAAC5B,oEACKa;QACJ0B,KAAK;QACLxB,KAAKU;QACLd,WAAWhB,oCAETmB,aAAa,SAAS,gCACtBJ,qCACAF,YAAYN,cAAc,CAACM,SAAS,EACpCG;QAEFJ,OAAO;YAAEU;WAAUV;kBAElBD;;AAGP,EAAE"}

package/dist/components/Gallery/Gallery.d.ts

@@ -1,12 +1,11 @@
 import * as React from 'react';
-import type { BaseGalleryProps } from '../BaseGallery/types';
+import type { BaseGalleryProps } from '../CarouselBase/types';
 export interface GalleryProps extends BaseGalleryProps {
     initialSlideIndex?: number;
     timeout?: number;
-    looped?: boolean;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/Gallery
  */
-export declare const Gallery: ({ initialSlideIndex, children, timeout, onChange, bullets, looped, onDragStart, onDragEnd, ...props }: GalleryProps) => React.ReactNode;
+export declare const Gallery: ({ initialSlideIndex, children, timeout, onChange, bullets, onDragStart, onDragEnd, ...props }: GalleryProps) => React.ReactNode;
 //# sourceMappingURL=Gallery.d.ts.map

package/dist/components/Gallery/Gallery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Gallery.d.ts","sourceRoot":"","sources":["../../../src/components/Gallery/Gallery.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAG7D,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,0GAUjB,YAAY,KAAG,KAAK,CAAC,SA0DvB,CAAC"}
+{"version":3,"file":"Gallery.d.ts","sourceRoot":"","sources":["../../../src/components/Gallery/Gallery.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAG9D,MAAM,WAAW,YAAa,SAAQ,gBAAgB;IACpD,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,kGASjB,YAAY,KAAG,KAAK,CAAC,SAwDvB,CAAC"}

package/dist/components/Gallery/Gallery.js

@@ -7,19 +7,17 @@ import * as React from "react";
 import { clamp } from "../../helpers/math.js";
 import { useIsClient } from "../../hooks/useIsClient.js";
 import { callMultiple } from "../../lib/callMultiple.js";
-import { BaseGallery } from "../BaseGallery/BaseGallery.js";
-import { CarouselBase } from "../BaseGallery/CarouselBase/CarouselBase.js";
+import { CarouselBase } from "../CarouselBase/CarouselBase.js";
 import { useAutoPlay } from "./hooks.js";
 /**
  * @see https://vkcom.github.io/VKUI/#/Gallery
  */ export const Gallery = (_param)=>{
-    var { initialSlideIndex = 0, children, timeout = 0, onChange, bullets, looped, onDragStart, onDragEnd } = _param, props = _object_without_properties(_param, [
+    var { initialSlideIndex = 0, children, timeout = 0, onChange, bullets, onDragStart, onDragEnd } = _param, props = _object_without_properties(_param, [
         "initialSlideIndex",
         "children",
         "timeout",
         "onChange",
         "bullets",
-        "looped",
         "onDragStart",
         "onDragEnd"
     ]);
@@ -65,8 +63,7 @@ import { useAutoPlay } from "./hooks.js";
     if (!isClient) {
         return null;
     }
-    const Component = looped ? CarouselBase : BaseGallery;
-    return /*#__PURE__*/ _jsx(Component, _object_spread_props(_object_spread({
+    return /*#__PURE__*/ _jsx(CarouselBase, _object_spread_props(_object_spread({
         dragDisabled: isControlled && !onChange
     }, props), {
         onDragStart: callMultiple(onDragStart, autoPlayControls.pause),

package/dist/components/Gallery/Gallery.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { BaseGallery } from '../BaseGallery/BaseGallery';\nimport { CarouselBase } from '../BaseGallery/CarouselBase/CarouselBase';\nimport type { BaseGalleryProps } from '../BaseGallery/types';\nimport { useAutoPlay } from './hooks';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n  // Отвечает за зацикливание слайдов\n  looped?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  looped,\n  onDragStart,\n  onDragEnd,\n  ...props\n}: GalleryProps): React.ReactNode => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? (props.slideIndex ?? 0) : localSlideIndex;\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n  const isClient = useIsClient();\n\n  const handleChange: GalleryProps['onChange'] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex],\n  );\n\n  const autoPlayControls = useAutoPlay({\n    timeout,\n    slideIndex,\n    onNext: () => handleChange((slideIndex + 1) % childCount),\n  });\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  if (!isClient) {\n    return null;\n  }\n\n  const Component = looped ? CarouselBase : BaseGallery;\n\n  return (\n    <Component\n      dragDisabled={isControlled && !onChange}\n      {...props}\n      onDragStart={callMultiple(onDragStart, autoPlayControls.pause)}\n      onDragEnd={callMultiple(onDragEnd, autoPlayControls.resume)}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </Component>\n  );\n};\n"],"names":["React","clamp","useIsClient","callMultiple","BaseGallery","CarouselBase","useAutoPlay","Gallery","initialSlideIndex","children","timeout","onChange","bullets","looped","onDragStart","onDragEnd","props","localSlideIndex","setSlideIndex","useState","isControlled","slideIndex","slides","useMemo","Children","toArray","filter","item","Boolean","childCount","length","isClient","handleChange","useCallback","current","autoPlayControls","onNext","safeSlideIndex","useEffect","Component","dragDisabled","pause","resume"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,wBAAqB;AAC3C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,WAAW,QAAQ,gCAA6B;AACzD,SAASC,YAAY,QAAQ,8CAA2C;AAExE,SAASC,WAAW,QAAQ,aAAU;AAStC;;CAEC,GACD,OAAO,MAAMC,UAAU;QAAC,EACtBC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,UAAU,CAAC,EACXC,QAAQ,EACRC,OAAO,EACPC,MAAM,EACNC,WAAW,EACXC,SAAS,EAEI,WADVC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiBC,cAAc,GAAGlB,MAAMmB,QAAQ,CAACX;IACxD,MAAMY,eAAe,OAAOJ,MAAMK,UAAU,KAAK;QACdL;IAAnC,MAAMK,aAAaD,eAAgBJ,CAAAA,oBAAAA,MAAMK,UAAU,cAAhBL,+BAAAA,oBAAoB,IAAKC;IAC5D,MAAMK,SAAStB,MAAMuB,OAAO,CAC1B,IAAMvB,MAAMwB,QAAQ,CAACC,OAAO,CAAChB,UAAUiB,MAAM,CAAC,CAACC,OAASC,QAAQD,QAChE;QAAClB;KAAS;IAEZ,MAAMoB,aAAaP,OAAOQ,MAAM;IAChC,MAAMC,WAAW7B;IAEjB,MAAM8B,eAAyChC,MAAMiC,WAAW,CAC9D,CAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBF,cAAcgB;QAC/BvB,YAAYA,SAASuB;IACvB,GACA;QAACd;QAAcT;QAAUU;KAAW;IAGtC,MAAMc,mBAAmB7B,YAAY;QACnCI;QACAW;QACAe,QAAQ,IAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKQ;IAChD;IAEA,6BAA6B;IAC7B,gEAAgE;IAChE,MAAMQ,iBAAiBR,aAAa,IAAI5B,MAAMoB,YAAY,GAAGQ,aAAa,KAAKR;IAC/E,mCAAmC;IACnCrB,MAAMsC,SAAS,CAAC;QACd,IAAI3B,YAAY0B,mBAAmBhB,YAAY;YAC7CV,SAAS0B;QACX;QACAnB,cAAcmB;IAChB,GAAG;QAAC1B;QAAU0B;QAAgBhB;KAAW;IAEzC,IAAI,CAACU,UAAU;QACb,OAAO;IACT;IAEA,MAAMQ,YAAY1B,SAASR,eAAeD;IAE1C,qBACE,KAACmC;QACCC,cAAcpB,gBAAgB,CAACT;OAC3BK;QACJF,aAAaX,aAAaW,aAAaqB,iBAAiBM,KAAK;QAC7D1B,WAAWZ,aAAaY,WAAWoB,iBAAiBO,MAAM;QAC1D9B,SAASiB,aAAa,KAAKjB;QAC3BS,YAAYgB;QACZ1B,UAAUqB;kBAETV;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Gallery/Gallery.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { clamp } from '../../helpers/math';\nimport { useIsClient } from '../../hooks/useIsClient';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { CarouselBase } from '../CarouselBase/CarouselBase';\nimport type { BaseGalleryProps } from '../CarouselBase/types';\nimport { useAutoPlay } from './hooks';\n\nexport interface GalleryProps extends BaseGalleryProps {\n  initialSlideIndex?: number;\n  timeout?: number;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Gallery\n */\nexport const Gallery = ({\n  initialSlideIndex = 0,\n  children,\n  timeout = 0,\n  onChange,\n  bullets,\n  onDragStart,\n  onDragEnd,\n  ...props\n}: GalleryProps): React.ReactNode => {\n  const [localSlideIndex, setSlideIndex] = React.useState(initialSlideIndex);\n  const isControlled = typeof props.slideIndex === 'number';\n  const slideIndex = isControlled ? (props.slideIndex ?? 0) : localSlideIndex;\n  const slides = React.useMemo(\n    () => React.Children.toArray(children).filter((item) => Boolean(item)),\n    [children],\n  );\n  const childCount = slides.length;\n  const isClient = useIsClient();\n\n  const handleChange: GalleryProps['onChange'] = React.useCallback(\n    (current: number) => {\n      if (current === slideIndex) {\n        return;\n      }\n      !isControlled && setSlideIndex(current);\n      onChange && onChange(current);\n    },\n    [isControlled, onChange, slideIndex],\n  );\n\n  const autoPlayControls = useAutoPlay({\n    timeout,\n    slideIndex,\n    onNext: () => handleChange((slideIndex + 1) % childCount),\n  });\n\n  // prevent invalid slideIndex\n  // any slide index is invalid with no slides, just keep it as is\n  const safeSlideIndex = childCount > 0 ? clamp(slideIndex, 0, childCount - 1) : slideIndex;\n  // notify parent in controlled mode\n  React.useEffect(() => {\n    if (onChange && safeSlideIndex !== slideIndex) {\n      onChange(safeSlideIndex);\n    }\n    setSlideIndex(safeSlideIndex);\n  }, [onChange, safeSlideIndex, slideIndex]);\n\n  if (!isClient) {\n    return null;\n  }\n\n  return (\n    <CarouselBase\n      dragDisabled={isControlled && !onChange}\n      {...props}\n      onDragStart={callMultiple(onDragStart, autoPlayControls.pause)}\n      onDragEnd={callMultiple(onDragEnd, autoPlayControls.resume)}\n      bullets={childCount > 0 && bullets}\n      slideIndex={safeSlideIndex}\n      onChange={handleChange}\n    >\n      {slides}\n    </CarouselBase>\n  );\n};\n"],"names":["React","clamp","useIsClient","callMultiple","CarouselBase","useAutoPlay","Gallery","initialSlideIndex","children","timeout","onChange","bullets","onDragStart","onDragEnd","props","localSlideIndex","setSlideIndex","useState","isControlled","slideIndex","slides","useMemo","Children","toArray","filter","item","Boolean","childCount","length","isClient","handleChange","useCallback","current","autoPlayControls","onNext","safeSlideIndex","useEffect","dragDisabled","pause","resume"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,QAAQ,wBAAqB;AAC3C,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,YAAY,QAAQ,kCAA+B;AAE5D,SAASC,WAAW,QAAQ,aAAU;AAOtC;;CAEC,GACD,OAAO,MAAMC,UAAU;QAAC,EACtBC,oBAAoB,CAAC,EACrBC,QAAQ,EACRC,UAAU,CAAC,EACXC,QAAQ,EACRC,OAAO,EACPC,WAAW,EACXC,SAAS,EAEI,WADVC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,iBAAiBC,cAAc,GAAGhB,MAAMiB,QAAQ,CAACV;IACxD,MAAMW,eAAe,OAAOJ,MAAMK,UAAU,KAAK;QACdL;IAAnC,MAAMK,aAAaD,eAAgBJ,CAAAA,oBAAAA,MAAMK,UAAU,cAAhBL,+BAAAA,oBAAoB,IAAKC;IAC5D,MAAMK,SAASpB,MAAMqB,OAAO,CAC1B,IAAMrB,MAAMsB,QAAQ,CAACC,OAAO,CAACf,UAAUgB,MAAM,CAAC,CAACC,OAASC,QAAQD,QAChE;QAACjB;KAAS;IAEZ,MAAMmB,aAAaP,OAAOQ,MAAM;IAChC,MAAMC,WAAW3B;IAEjB,MAAM4B,eAAyC9B,MAAM+B,WAAW,CAC9D,CAACC;QACC,IAAIA,YAAYb,YAAY;YAC1B;QACF;QACA,CAACD,gBAAgBF,cAAcgB;QAC/BtB,YAAYA,SAASsB;IACvB,GACA;QAACd;QAAcR;QAAUS;KAAW;IAGtC,MAAMc,mBAAmB5B,YAAY;QACnCI;QACAU;QACAe,QAAQ,IAAMJ,aAAa,AAACX,CAAAA,aAAa,CAAA,IAAKQ;IAChD;IAEA,6BAA6B;IAC7B,gEAAgE;IAChE,MAAMQ,iBAAiBR,aAAa,IAAI1B,MAAMkB,YAAY,GAAGQ,aAAa,KAAKR;IAC/E,mCAAmC;IACnCnB,MAAMoC,SAAS,CAAC;QACd,IAAI1B,YAAYyB,mBAAmBhB,YAAY;YAC7CT,SAASyB;QACX;QACAnB,cAAcmB;IAChB,GAAG;QAACzB;QAAUyB;QAAgBhB;KAAW;IAEzC,IAAI,CAACU,UAAU;QACb,OAAO;IACT;IAEA,qBACE,KAACzB;QACCiC,cAAcnB,gBAAgB,CAACR;OAC3BI;QACJF,aAAaT,aAAaS,aAAaqB,iBAAiBK,KAAK;QAC7DzB,WAAWV,aAAaU,WAAWoB,iBAAiBM,MAAM;QAC1D5B,SAASgB,aAAa,KAAKhB;QAC3BQ,YAAYgB;QACZzB,UAAUoB;kBAETV;;AAGP,EAAE"}