@vkontakte/vkui 5.1.2 → 5.2.1

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

@@ -1 +1 @@
-{"version":3,"file":"DateInput.js","names":["elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","isMatch","parse","Date","refs","useMemo","useDateInput","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","onCalendarChange","classNames","getSizeYClassName","multiRef","callMultiple","format"],"sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { format, isMatch, parse } from '../../lib/date';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { Popper, Placement } from '../Popper/Popper';\nimport { multiRef } from '../../lib/utils';\nimport { IconButton } from '../IconButton/IconButton';\nimport { classNames } from '@vkontakte/vkjs';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { HasRootRef } from '../../types';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './DateInput.module.css';\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      | 'changeHoursAriaLabel'\n      | 'changeMinutesAriaLabel'\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'changeDayAriaLabel'\n      | 'showNeighboringMonth'\n      | 'size'\n      | 'viewDate'\n      | 'onHeaderChange'\n      | 'onNextMonth'\n      | 'onPrevMonth'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: Placement;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: 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      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  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  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  showNeighboringMonth,\n  size,\n  changeMonthAriaLabel = 'Изменить месяц',\n  changeYearAriaLabel = 'Изменить год',\n  changeDayAriaLabel = 'Изменить день',\n  changeHoursAriaLabel = 'Изменить час',\n  changeMinutesAriaLabel = 'Изменить минуту',\n  clearFieldAriaLabel = 'Очистить поле',\n  showCalendarAriaLabel = 'Показать календарь',\n  viewDate,\n  onHeaderChange,\n  onNextMonth,\n  onPrevMonth,\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateInputProps) => {\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        onChange?.(parse(formattedValue, mask, value ?? new Date()));\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    closeCalendar,\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  });\n\n  const { sizeY } = useAdaptivity();\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(\n        styles['DateInput'],\n        getSizeYClassName(styles['DateInput'], sizeY),\n        className,\n      )}\n      getRootRef={multiRef(rootRef, getRootRef)}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} 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.YYYYTHH:mm' : 'DD.MM.YYYY') : ''}\n      />\n      <span className={styles['DateInput__input']} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeYearAriaLabel}\n        />\n        {enableTime && (\n          <React.Fragment>\n            <InputLikeDivider className={styles['DateInput__input--time-divider']}>\n              {' '}\n            </InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={hoursRef}\n              index={3}\n              onElementSelect={setFocusedElement}\n              value={internalValue[3]}\n              aria-label={changeHoursAriaLabel}\n            />\n            <InputLikeDivider>:</InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={minutesRef}\n              index={4}\n              onElementSelect={setFocusedElement}\n              value={internalValue[4]}\n              aria-label={changeMinutesAriaLabel}\n            />\n          </React.Fragment>\n        )}\n      </span>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetDistance={8} placement={calendarPlacement}>\n          <Calendar\n            value={value}\n            onChange={onCalendarChange}\n            enableTime={enableTime}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            doneButtonText={doneButtonText}\n            disablePickers={disablePickers}\n            changeHoursAriaLabel={changeHoursAriaLabel}\n            changeMinutesAriaLabel={changeMinutesAriaLabel}\n            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            showNeighboringMonth={showNeighboringMonth}\n            size={size}\n            viewDate={viewDate}\n            onHeaderChange={onHeaderChange}\n            onNextMonth={onNextMonth}\n            onPrevMonth={onPrevMonth}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"DateInput.js","names":["sizeYClassNames","none","SizeType","COMPACT","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","getHours","getMinutes","DateInput","enableTime","shouldDisableDate","disableFuture","disablePast","onChange","calendarPlacement","style","className","doneButtonText","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthAriaLabel","nextMonthAriaLabel","showNeighboringMonth","size","changeMonthAriaLabel","changeYearAriaLabel","changeDayAriaLabel","changeHoursAriaLabel","changeMinutesAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","viewDate","onHeaderChange","onNextMonth","onPrevMonth","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysRef","React","useRef","monthsRef","yearsRef","hoursRef","minutesRef","maxElement","onInternalValueChange","useCallback","internalValue","i","formattedValue","mask","isMatch","parse","Date","refs","useMemo","useDateInput","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","handleRootRef","useExternRef","onCalendarChange","classNames","REGULAR","callMultiple","format"],"sources":["../../../../src/components/DateInput/DateInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { HasRootRef } from '../../types';\nimport { Calendar, CalendarProps } from '../Calendar/Calendar';\nimport { FormField, 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 '../InputLike/InputLikeDivider.module.css'; // Reorder css\nimport styles from './DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles['DateInput--sizeY-none'],\n  [SizeType.COMPACT]: styles['DateInput--sizeY-compact'],\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      | 'changeHoursAriaLabel'\n      | 'changeMinutesAriaLabel'\n      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'changeDayAriaLabel'\n      | 'showNeighboringMonth'\n      | 'size'\n      | 'viewDate'\n      | 'onHeaderChange'\n      | 'onNextMonth'\n      | 'onPrevMonth'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: 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      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  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  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  showNeighboringMonth,\n  size,\n  changeMonthAriaLabel = 'Изменить месяц',\n  changeYearAriaLabel = 'Изменить год',\n  changeDayAriaLabel = 'Изменить день',\n  changeHoursAriaLabel = 'Изменить час',\n  changeMinutesAriaLabel = 'Изменить минуту',\n  clearFieldAriaLabel = 'Очистить поле',\n  showCalendarAriaLabel = 'Показать календарь',\n  viewDate,\n  onHeaderChange,\n  onNextMonth,\n  onPrevMonth,\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateInputProps) => {\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        onChange?.(parse(formattedValue, mask, value ?? new Date()));\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    closeCalendar,\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  });\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(\n        styles['DateInput'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} 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.YYYYTHH:mm' : 'DD.MM.YYYY') : ''}\n      />\n      <span className={styles['DateInput__input']} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeYearAriaLabel}\n        />\n        {enableTime && (\n          <React.Fragment>\n            <InputLikeDivider className={styles['DateInput__input--time-divider']}>\n              {' '}\n            </InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={hoursRef}\n              index={3}\n              onElementSelect={setFocusedElement}\n              value={internalValue[3]}\n              aria-label={changeHoursAriaLabel}\n            />\n            <InputLikeDivider>:</InputLikeDivider>\n            <InputLike\n              length={2}\n              getRootRef={minutesRef}\n              index={4}\n              onElementSelect={setFocusedElement}\n              value={internalValue[4]}\n              aria-label={changeMinutesAriaLabel}\n            />\n          </React.Fragment>\n        )}\n      </span>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetDistance={8} placement={calendarPlacement}>\n          <Calendar\n            value={value}\n            onChange={onCalendarChange}\n            enableTime={enableTime}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            doneButtonText={doneButtonText}\n            disablePickers={disablePickers}\n            changeHoursAriaLabel={changeHoursAriaLabel}\n            changeMinutesAriaLabel={changeMinutesAriaLabel}\n            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            showNeighboringMonth={showNeighboringMonth}\n            size={size}\n            viewDate={viewDate}\n            onHeaderChange={onHeaderChange}\n            onNextMonth={onNextMonth}\n            onPrevMonth={onPrevMonth}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}

package/dist/cjs/components/DatePicker/DatePicker.js

@@ -13,10 +13,10 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _Input = require("../Input/Input");
+var _range = require("../../helpers/range");
 var _useAdaptivityHasPointer = require("../../hooks/useAdaptivityHasPointer");
 var _CustomSelect = require("../CustomSelect/CustomSelect");
-var _range = require("../../helpers/range");
+var _Input = require("../Input/Input");
 var _excluded = ["name", "min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "monthNames", "day", "month", "year", "onDateChange", "disabled", "className"],
   _excluded2 = ["min", "max", "dayPlaceholder", "monthPlaceholder", "yearPlaceholder", "popupDirection", "defaultValue", "day", "month", "year", "onDateChange"],
   _excluded3 = ["defaultValue"];

package/dist/cjs/components/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","names":["DefaultMonths","convertToInputFormat","day","month","year","leadingZero","parseInputDate","date","splited","split","Number","getMonthMaxDay","Date","getDate","DatePickerCustom","name","min","max","dayPlaceholder","monthPlaceholder","yearPlaceholder","popupDirection","defaultValue","monthNames","onDateChange","disabled","className","restProps","onSelectChange","e","target","value","dayOptions","range","map","label","String","monthOptions","index","yearOptions","classNames","DatePickerNative","defProps","onStringChange","React","useCallback","currentTarget","DatePicker","props","hasPointer","useAdaptivityHasPointer","useState","setValue","update","Cmp"],"sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, leadingZero } from '@vkontakte/vkjs';\nimport { Input } from '../Input/Input';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { range } from '../../helpers/range';\nimport styles from './DatePicker.module.css';\n\nconst DefaultMonths: string[] = [\n  'Января',\n  'Февраля',\n  'Марта',\n  'Апреля',\n  'Мая',\n  'Июня',\n  'Июля',\n  'Августа',\n  'Сентября',\n  'Октября',\n  'Ноября',\n  'Декабря',\n];\n\nexport type DatePickerDateFormat = {\n  day: number;\n  month: number;\n  year: number;\n};\n\nexport interface DatePickerProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'min' | 'max'> {\n  min?: DatePickerDateFormat;\n  max?: DatePickerDateFormat;\n  name?: string;\n  defaultValue?: DatePickerDateFormat;\n  popupDirection?: 'top' | 'bottom';\n  monthNames?: string[];\n  dayPlaceholder?: string;\n  monthPlaceholder?: string;\n  yearPlaceholder?: string;\n  onDateChange?: (value: DatePickerDateFormat) => void;\n  disabled?: boolean;\n}\n\n// Переводим state к формату гг-мм-дд\nfunction convertToInputFormat({ day = 0, month = 0, year = 0 }: Partial<DatePickerDateFormat>) {\n  return `${year}-${leadingZero(month)}-${leadingZero(day)}`;\n}\n\n// Переводим дату формата гг-мм-дд к объекту\nfunction parseInputDate(date: string): DatePickerDateFormat {\n  const splited = date.split('-');\n\n  return {\n    day: Number(splited[2]),\n    month: Number(splited[1]),\n    year: Number(splited[0]),\n  };\n}\n\nfunction getMonthMaxDay(month?: number, year?: number) {\n  return month ? new Date(year || 2016, month, 0).getDate() : 31;\n}\n\nconst DatePickerCustom = ({\n  name,\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  monthNames,\n  day = 0,\n  month = 0,\n  year = 0,\n  onDateChange,\n  disabled,\n  className,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const onSelectChange: React.ChangeEventHandler<HTMLSelectElement> = (e) => {\n    onDateChange?.({\n      day,\n      month,\n      year,\n      [e.target.name]: Number(e.target.value),\n    });\n  };\n  const dayOptions = range(1, getMonthMaxDay(month, year)).map((value) => ({\n    label: String(value),\n    value,\n  }));\n  const monthOptions = (monthNames || DefaultMonths).map((name, index) => ({\n    label: name,\n    value: index + 1,\n  }));\n  const yearOptions = range(max.year, min.year).map((value) => ({\n    label: String(value),\n    value: value,\n  }));\n  return (\n    <div className={classNames(styles['DatePicker'], className)} {...restProps}>\n      <div className={styles['DatePicker__container']}>\n        <div className={styles['DatePicker__day']}>\n          <CustomSelect\n            name=\"day\"\n            value={day}\n            options={dayOptions}\n            placeholder={dayPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles['DatePicker__month']}>\n          <CustomSelect\n            className={styles['DatePicker__monthSelect']}\n            name=\"month\"\n            value={month}\n            options={monthOptions}\n            placeholder={monthPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles['DatePicker__year']}>\n          <CustomSelect\n            name=\"year\"\n            value={year}\n            options={yearOptions}\n            placeholder={yearPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n      </div>\n      <input type=\"hidden\" name={name} value={convertToInputFormat({ day, month, year })} />\n    </div>\n  );\n};\n\nconst DatePickerNative = ({\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  day,\n  month,\n  year,\n  onDateChange,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const defProps =\n    day && month && year ? { defaultValue: convertToInputFormat({ day, month, year }) } : {};\n  const onStringChange: React.ChangeEventHandler<HTMLInputElement> = React.useCallback(\n    (e) => {\n      onDateChange?.(parseInputDate(e.currentTarget.value));\n    },\n    [onDateChange],\n  );\n  return (\n    <Input\n      {...restProps}\n      type=\"date\"\n      onChange={onStringChange}\n      min={convertToInputFormat(min)}\n      max={convertToInputFormat(max)}\n      {...defProps}\n    />\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DatePicker\n */\nexport const DatePicker = ({ defaultValue, ...props }: DatePickerProps) => {\n  const hasPointer = useAdaptivityHasPointer();\n  const [value, setValue] = React.useState<Partial<DatePickerDateFormat>>(() => ({\n    day: defaultValue?.day || 0,\n    month: defaultValue?.month || 0,\n    year: defaultValue?.year || 0,\n  }));\n\n  const onDateChange = React.useCallback(\n    (update: DatePickerDateFormat) => {\n      setValue(update);\n      props.onDateChange && props.onDateChange({ ...update });\n    },\n    [props],\n  );\n\n  const Cmp = hasPointer ? DatePickerCustom : DatePickerNative;\n  return <Cmp {...props} {...value} onDateChange={onDateChange} />;\n};\n"],"mappings":"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"}
+{"version":3,"file":"DatePicker.js","names":["DefaultMonths","convertToInputFormat","day","month","year","leadingZero","parseInputDate","date","splited","split","Number","getMonthMaxDay","Date","getDate","DatePickerCustom","name","min","max","dayPlaceholder","monthPlaceholder","yearPlaceholder","popupDirection","defaultValue","monthNames","onDateChange","disabled","className","restProps","onSelectChange","e","target","value","dayOptions","range","map","label","String","monthOptions","index","yearOptions","classNames","DatePickerNative","defProps","onStringChange","React","useCallback","currentTarget","DatePicker","props","hasPointer","useAdaptivityHasPointer","useState","setValue","update","Cmp"],"sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, leadingZero } from '@vkontakte/vkjs';\nimport { range } from '../../helpers/range';\nimport { useAdaptivityHasPointer } from '../../hooks/useAdaptivityHasPointer';\nimport { CustomSelect } from '../CustomSelect/CustomSelect';\nimport { Input } from '../Input/Input';\nimport styles from './DatePicker.module.css';\n\nconst DefaultMonths: string[] = [\n  'Января',\n  'Февраля',\n  'Марта',\n  'Апреля',\n  'Мая',\n  'Июня',\n  'Июля',\n  'Августа',\n  'Сентября',\n  'Октября',\n  'Ноября',\n  'Декабря',\n];\n\nexport type DatePickerDateFormat = {\n  day: number;\n  month: number;\n  year: number;\n};\n\nexport interface DatePickerProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'min' | 'max'> {\n  min?: DatePickerDateFormat;\n  max?: DatePickerDateFormat;\n  name?: string;\n  defaultValue?: DatePickerDateFormat;\n  popupDirection?: 'top' | 'bottom';\n  monthNames?: string[];\n  dayPlaceholder?: string;\n  monthPlaceholder?: string;\n  yearPlaceholder?: string;\n  onDateChange?: (value: DatePickerDateFormat) => void;\n  disabled?: boolean;\n}\n\n// Переводим state к формату гг-мм-дд\nfunction convertToInputFormat({ day = 0, month = 0, year = 0 }: Partial<DatePickerDateFormat>) {\n  return `${year}-${leadingZero(month)}-${leadingZero(day)}`;\n}\n\n// Переводим дату формата гг-мм-дд к объекту\nfunction parseInputDate(date: string): DatePickerDateFormat {\n  const splited = date.split('-');\n\n  return {\n    day: Number(splited[2]),\n    month: Number(splited[1]),\n    year: Number(splited[0]),\n  };\n}\n\nfunction getMonthMaxDay(month?: number, year?: number) {\n  return month ? new Date(year || 2016, month, 0).getDate() : 31;\n}\n\nconst DatePickerCustom = ({\n  name,\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  monthNames,\n  day = 0,\n  month = 0,\n  year = 0,\n  onDateChange,\n  disabled,\n  className,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const onSelectChange: React.ChangeEventHandler<HTMLSelectElement> = (e) => {\n    onDateChange?.({\n      day,\n      month,\n      year,\n      [e.target.name]: Number(e.target.value),\n    });\n  };\n  const dayOptions = range(1, getMonthMaxDay(month, year)).map((value) => ({\n    label: String(value),\n    value,\n  }));\n  const monthOptions = (monthNames || DefaultMonths).map((name, index) => ({\n    label: name,\n    value: index + 1,\n  }));\n  const yearOptions = range(max.year, min.year).map((value) => ({\n    label: String(value),\n    value: value,\n  }));\n  return (\n    <div className={classNames(styles['DatePicker'], className)} {...restProps}>\n      <div className={styles['DatePicker__container']}>\n        <div className={styles['DatePicker__day']}>\n          <CustomSelect\n            name=\"day\"\n            value={day}\n            options={dayOptions}\n            placeholder={dayPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles['DatePicker__month']}>\n          <CustomSelect\n            className={styles['DatePicker__monthSelect']}\n            name=\"month\"\n            value={month}\n            options={monthOptions}\n            placeholder={monthPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n        <div className={styles['DatePicker__year']}>\n          <CustomSelect\n            name=\"year\"\n            value={year}\n            options={yearOptions}\n            placeholder={yearPlaceholder}\n            popupDirection={popupDirection}\n            onChange={onSelectChange}\n            disabled={disabled}\n          />\n        </div>\n      </div>\n      <input type=\"hidden\" name={name} value={convertToInputFormat({ day, month, year })} />\n    </div>\n  );\n};\n\nconst DatePickerNative = ({\n  min = { day: 0, month: 0, year: 0 },\n  max = { day: 31, month: 12, year: 2100 },\n  dayPlaceholder,\n  monthPlaceholder,\n  yearPlaceholder,\n  popupDirection,\n  defaultValue,\n  day,\n  month,\n  year,\n  onDateChange,\n  ...restProps\n}: DatePickerProps & Partial<DatePickerDateFormat>) => {\n  const defProps =\n    day && month && year ? { defaultValue: convertToInputFormat({ day, month, year }) } : {};\n  const onStringChange: React.ChangeEventHandler<HTMLInputElement> = React.useCallback(\n    (e) => {\n      onDateChange?.(parseInputDate(e.currentTarget.value));\n    },\n    [onDateChange],\n  );\n  return (\n    <Input\n      {...restProps}\n      type=\"date\"\n      onChange={onStringChange}\n      min={convertToInputFormat(min)}\n      max={convertToInputFormat(max)}\n      {...defProps}\n    />\n  );\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DatePicker\n */\nexport const DatePicker = ({ defaultValue, ...props }: DatePickerProps) => {\n  const hasPointer = useAdaptivityHasPointer();\n  const [value, setValue] = React.useState<Partial<DatePickerDateFormat>>(() => ({\n    day: defaultValue?.day || 0,\n    month: defaultValue?.month || 0,\n    year: defaultValue?.year || 0,\n  }));\n\n  const onDateChange = React.useCallback(\n    (update: DatePickerDateFormat) => {\n      setValue(update);\n      props.onDateChange && props.onDateChange({ ...update });\n    },\n    [props],\n  );\n\n  const Cmp = hasPointer ? DatePickerCustom : DatePickerNative;\n  return <Cmp {...props} {...value} onDateChange={onDateChange} />;\n};\n"],"mappings":"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"}

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

@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { CalendarRangeProps } from '../CalendarRange/CalendarRange';
-import { Placement } from '../Popper/Popper';
+import type { PlacementWithAuto } from '../../lib/floating';
 import { HasRootRef } from '../../types';
+import { CalendarRangeProps } from '../CalendarRange/CalendarRange';
 import { FormFieldProps } from '../FormField/FormField';
 export interface DateRangeInputProps extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'onChange'>, Pick<CalendarRangeProps, 'disablePast' | 'disableFuture' | 'shouldDisableDate' | 'onChange' | 'value' | 'weekStartsOn' | 'disablePickers' | 'prevMonthAriaLabel' | 'nextMonthAriaLabel' | 'changeMonthAriaLabel' | 'changeYearAriaLabel' | 'changeDayAriaLabel' | 'prevMonthIcon' | 'nextMonthIcon'>, HasRootRef<HTMLDivElement>, FormFieldProps {
-    calendarPlacement?: Placement;
+    calendarPlacement?: PlacementWithAuto;
     closeOnChange?: boolean;
     clearFieldAriaLabel?: string;
     showCalendarAriaLabel?: string;

package/dist/cjs/components/DateRangeInput/DateRangeInput.js

@@ -8,22 +8,26 @@ Object.defineProperty(exports, "__esModule", {
 exports.DateRangeInput = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var React = _interopRequireWildcard(require("react"));
-var _date = require("../../lib/date");
 var _icons = require("@vkontakte/icons");
-var _CalendarRange = require("../CalendarRange/CalendarRange");
-var _Popper = require("../Popper/Popper");
-var _IconButton = require("../IconButton/IconButton");
-var _useDateInput2 = require("../../hooks/useDateInput");
-var _useAdaptivity2 = require("../../hooks/useAdaptivity");
 var _vkjs = require("@vkontakte/vkjs");
-var _utils = require("../../lib/utils");
+var _useAdaptivity2 = require("../../hooks/useAdaptivity");
+var _useDateInput2 = require("../../hooks/useDateInput");
+var _useExternRef = require("../../hooks/useExternRef");
+var _adaptivity = require("../../lib/adaptivity");
+var _callMultiple = require("../../lib/callMultiple");
+var _date = require("../../lib/date");
+var _CalendarRange = require("../CalendarRange/CalendarRange");
 var _FormField = require("../FormField/FormField");
+var _IconButton = require("../IconButton/IconButton");
 var _InputLike = require("../InputLike/InputLike");
 var _InputLikeDivider = require("../InputLike/InputLikeDivider");
-var _callMultiple = require("../../lib/callMultiple");
-var _getSizeYClassName = require("../../helpers/getSizeYClassName");
+var _Popper = require("../Popper/Popper");
 var _excluded = ["shouldDisableDate", "disableFuture", "disablePast", "value", "onChange", "calendarPlacement", "style", "className", "closeOnChange", "disablePickers", "getRootRef", "name", "autoFocus", "disabled", "onClick", "onFocus", "prevMonthAriaLabel", "nextMonthAriaLabel", "changeDayAriaLabel", "changeMonthAriaLabel", "changeYearAriaLabel", "changeStartDayAriaLabel", "changeStartMonthAriaLabel", "changeStartYearAriaLabel", "changeEndDayAriaLabel", "changeEndMonthAriaLabel", "changeEndYearAriaLabel", "clearFieldAriaLabel", "showCalendarAriaLabel", "prevMonthIcon", "nextMonthIcon", "disableCalendar"];
+var sizeYClassNames = (0, _defineProperty2.default)({
+  none: "vkuiDateRangeInput--sizeY-none"
+}, _adaptivity.SizeType.COMPACT, "vkuiDateRangeInput--sizeY-compact");
 var elementsConfig = function elementsConfig(index) {
   var length = 2;
   var min = 1;
@@ -178,7 +182,9 @@ var DateRangeInput = function DateRangeInput(_ref) {
     clear = _useDateInput.clear,
     removeFocusFromField = _useDateInput.removeFocusFromField;
   var _useAdaptivity = (0, _useAdaptivity2.useAdaptivity)(),
-    sizeY = _useAdaptivity.sizeY;
+    _useAdaptivity$sizeY = _useAdaptivity.sizeY,
+    sizeY = _useAdaptivity$sizeY === void 0 ? 'none' : _useAdaptivity$sizeY;
+  var handleRootRef = (0, _useExternRef.useExternRef)(rootRef, getRootRef);
   var onCalendarChange = React.useCallback(function (newValue) {
     onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
     if (closeOnChange && newValue !== null && newValue !== void 0 && newValue[1] && newValue[1] !== (value === null || value === void 0 ? void 0 : value[1])) {
@@ -187,8 +193,8 @@ var DateRangeInput = function DateRangeInput(_ref) {
   }, [onChange, closeOnChange, value, removeFocusFromField]);
   return /*#__PURE__*/React.createElement(_FormField.FormField, (0, _extends2.default)({
     style: style,
-    className: (0, _vkjs.classNames)("vkuiDateRangeInput", (0, _getSizeYClassName.getSizeYClassName)("vkuiDateRangeInput", sizeY), className),
-    getRootRef: (0, _utils.multiRef)(rootRef, getRootRef),
+    className: (0, _vkjs.classNames)("vkuiDateRangeInput", sizeY !== _adaptivity.SizeType.REGULAR && sizeYClassNames[sizeY], className),
+    getRootRef: handleRootRef,
     after: value ? /*#__PURE__*/React.createElement(_IconButton.IconButton, {
       hoverMode: "opacity",
       "aria-label": clearFieldAriaLabel,

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

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.js","names":["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","prevMonthAriaLabel","nextMonthAriaLabel","changeDayAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeStartDayAriaLabel","changeStartMonthAriaLabel","changeStartYearAriaLabel","changeEndDayAriaLabel","changeEndMonthAriaLabel","changeEndYearAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysStartRef","React","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","isMatch","valueExists","Array","isArray","now","Date","start","parse","end","isAfter","refs","useMemo","useDateInput","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","onCalendarChange","classNames","getSizeYClassName","multiRef","callMultiple","format"],"sources":["../../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { format, isMatch, parse, isAfter } from '../../lib/date';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { CalendarRange, CalendarRangeProps } from '../CalendarRange/CalendarRange';\nimport { Popper, Placement } from '../Popper/Popper';\nimport { IconButton } from '../IconButton/IconButton';\nimport { HasRootRef } from '../../types';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { classNames } from '@vkontakte/vkjs';\nimport { multiRef } from '../../lib/utils';\nimport { FormField, FormFieldProps } from '../FormField/FormField';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { getSizeYClassName } from '../../helpers/getSizeYClassName';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\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      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'changeDayAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: Placement;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: string;\n  changeStartDayAriaLabel?: string;\n  changeStartMonthAriaLabel?: string;\n  changeStartYearAriaLabel?: string;\n  changeEndDayAriaLabel?: string;\n  changeEndMonthAriaLabel?: string;\n  changeEndYearAriaLabel?: 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  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeDayAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeStartDayAriaLabel = 'Изменить день начала',\n  changeStartMonthAriaLabel = 'Изменить месяц начала',\n  changeStartYearAriaLabel = 'Изменить год начала',\n  changeEndDayAriaLabel = 'Изменить день окончания',\n  changeEndMonthAriaLabel = 'Изменить месяц окончания',\n  changeEndYearAriaLabel = 'Изменить год окончания',\n  clearFieldAriaLabel = 'Очистить поле',\n  showCalendarAriaLabel = 'Показать календарь',\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateRangeInputProps) => {\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  });\n\n  const { sizeY } = useAdaptivity();\n\n  const onCalendarChange = React.useCallback(\n    (newValue?: Array<Date | null> | 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(\n        styles['DateRangeInput'],\n        getSizeYClassName(styles['DateRangeInput'], sizeY),\n        className,\n      )}\n      getRootRef={multiRef(rootRef, getRootRef)}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} 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={\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      <span className={dateInputStyles['DateInput__input']} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysStartRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeStartDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsStartRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeStartMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsStartRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeStartYearAriaLabel}\n        />\n        <InputLikeDivider>{' — '}</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={daysEndRef}\n          index={3}\n          onElementSelect={setFocusedElement}\n          value={internalValue[3]}\n          aria-label={changeEndDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsEndRef}\n          index={4}\n          onElementSelect={setFocusedElement}\n          value={internalValue[4]}\n          aria-label={changeEndMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsEndRef}\n          index={5}\n          onElementSelect={setFocusedElement}\n          value={internalValue[5]}\n          aria-label={changeEndYearAriaLabel}\n        />\n      </span>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetDistance={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            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"DateRangeInput.js","names":["sizeYClassNames","none","SizeType","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","prevMonthAriaLabel","nextMonthAriaLabel","changeDayAriaLabel","changeMonthAriaLabel","changeYearAriaLabel","changeStartDayAriaLabel","changeStartMonthAriaLabel","changeStartYearAriaLabel","changeEndDayAriaLabel","changeEndMonthAriaLabel","changeEndYearAriaLabel","clearFieldAriaLabel","showCalendarAriaLabel","prevMonthIcon","nextMonthIcon","disableCalendar","props","daysStartRef","React","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","onInternalValueChange","useCallback","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","isMatch","valueExists","Array","isArray","now","Date","start","parse","end","isAfter","refs","useMemo","useDateInput","maxElement","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","useAdaptivity","sizeY","handleRootRef","useExternRef","onCalendarChange","classNames","REGULAR","callMultiple","format"],"sources":["../../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { SizeType } from '../../lib/adaptivity';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isAfter, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport { HasRootRef } from '../../types';\nimport { CalendarRange, CalendarRangeProps } from '../CalendarRange/CalendarRange';\nimport { FormField, 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 styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles['DateRangeInput--sizeY-none'],\n  [SizeType.COMPACT]: styles['DateRangeInput--sizeY-compact'],\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      | 'prevMonthAriaLabel'\n      | 'nextMonthAriaLabel'\n      | 'changeMonthAriaLabel'\n      | 'changeYearAriaLabel'\n      | 'changeDayAriaLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n    >,\n    HasRootRef<HTMLDivElement>,\n    FormFieldProps {\n  calendarPlacement?: PlacementWithAuto;\n  closeOnChange?: boolean;\n  clearFieldAriaLabel?: string;\n  showCalendarAriaLabel?: string;\n  changeStartDayAriaLabel?: string;\n  changeStartMonthAriaLabel?: string;\n  changeStartYearAriaLabel?: string;\n  changeEndDayAriaLabel?: string;\n  changeEndMonthAriaLabel?: string;\n  changeEndYearAriaLabel?: 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  prevMonthAriaLabel,\n  nextMonthAriaLabel,\n  changeDayAriaLabel,\n  changeMonthAriaLabel,\n  changeYearAriaLabel,\n  changeStartDayAriaLabel = 'Изменить день начала',\n  changeStartMonthAriaLabel = 'Изменить месяц начала',\n  changeStartYearAriaLabel = 'Изменить год начала',\n  changeEndDayAriaLabel = 'Изменить день окончания',\n  changeEndMonthAriaLabel = 'Изменить месяц окончания',\n  changeEndYearAriaLabel = 'Изменить год окончания',\n  clearFieldAriaLabel = 'Очистить поле',\n  showCalendarAriaLabel = 'Показать календарь',\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  ...props\n}: DateRangeInputProps) => {\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  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (newValue?: Array<Date | null> | 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(\n        styles['DateRangeInput'],\n        sizeY !== SizeType.REGULAR && sizeYClassNames[sizeY],\n        className,\n      )}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" aria-label={clearFieldAriaLabel} onClick={clear}>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton hoverMode=\"opacity\" aria-label={showCalendarAriaLabel} 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={\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      <span className={dateInputStyles['DateInput__input']} onKeyDown={handleKeyDown}>\n        <InputLike\n          length={2}\n          getRootRef={daysStartRef}\n          index={0}\n          onElementSelect={setFocusedElement}\n          value={internalValue[0]}\n          aria-label={changeStartDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsStartRef}\n          index={1}\n          onElementSelect={setFocusedElement}\n          value={internalValue[1]}\n          aria-label={changeStartMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsStartRef}\n          index={2}\n          onElementSelect={setFocusedElement}\n          value={internalValue[2]}\n          aria-label={changeStartYearAriaLabel}\n        />\n        <InputLikeDivider>{' — '}</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={daysEndRef}\n          index={3}\n          onElementSelect={setFocusedElement}\n          value={internalValue[3]}\n          aria-label={changeEndDayAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={2}\n          getRootRef={monthsEndRef}\n          index={4}\n          onElementSelect={setFocusedElement}\n          value={internalValue[4]}\n          aria-label={changeEndMonthAriaLabel}\n        />\n        <InputLikeDivider>.</InputLikeDivider>\n        <InputLike\n          length={4}\n          getRootRef={yearsEndRef}\n          index={5}\n          onElementSelect={setFocusedElement}\n          value={internalValue[5]}\n          aria-label={changeEndYearAriaLabel}\n        />\n      </span>\n      {open && !disableCalendar && (\n        <Popper targetRef={rootRef} offsetDistance={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            prevMonthAriaLabel={prevMonthAriaLabel}\n            nextMonthAriaLabel={nextMonthAriaLabel}\n            changeMonthAriaLabel={changeMonthAriaLabel}\n            changeYearAriaLabel={changeYearAriaLabel}\n            changeDayAriaLabel={changeDayAriaLabel}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"mappings":"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"}

package/dist/cjs/components/DropdownIcon/DropdownIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownIcon.js","names":["DropdownIcon","opened","className","restProps","useAdaptivityConditionalRender","sizeY","IconCompact","Icon20ChevronUp","Icon20Dropdown","IconRegular","Icon24ChevronUp","Icon24ChevronDown","compact","classNames","regular"],"sources":["../../../../src/components/DropdownIcon/DropdownIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20Dropdown,\n  Icon24ChevronDown,\n  Icon24ChevronUp,\n  Icon20ChevronUp,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport styles from './DropdownIcon.module.css';\n\nexport interface DropdownIconProps extends React.HTMLAttributes<SVGSVGElement> {\n  opened?: boolean;\n}\n\nexport const DropdownIcon = ({ opened = false, className, ...restProps }: DropdownIconProps) => {\n  const { sizeY } = useAdaptivityConditionalRender();\n  const IconCompact = opened ? Icon20ChevronUp : Icon20Dropdown;\n  const IconRegular = opened ? Icon24ChevronUp : Icon24ChevronDown;\n\n  return (\n    <React.Fragment>\n      {sizeY.compact && (\n        <IconCompact\n          className={classNames(styles['DropdownIcon'], sizeY.compact.className, className)}\n          {...restProps}\n        />\n      )}\n      {sizeY.regular && (\n        <IconRegular\n          className={classNames(styles['DropdownIcon'], sizeY.regular.className, className)}\n          {...restProps}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAMA;AACA;AAA4F;AAOrF,IAAMA,YAAY,GAAG,SAAfA,YAAY,OAAuE;EAAA,uBAAjEC,MAAM;IAANA,MAAM,4BAAG,KAAK;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACpE,4BAAkB,IAAAC,8DAA8B,GAAE;IAA1CC,KAAK,yBAALA,KAAK;EACb,IAAMC,WAAW,GAAGL,MAAM,GAAGM,sBAAe,GAAGC,qBAAc;EAC7D,IAAMC,WAAW,GAAGR,MAAM,GAAGS,sBAAe,GAAGC,wBAAiB;EAEhE,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZN,KAAK,CAACO,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAE,IAAAC,gBAAU,sBAAyBR,KAAK,CAACO,OAAO,CAACV,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,EACAE,KAAK,CAACS,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAE,IAAAD,gBAAU,sBAAyBR,KAAK,CAACS,OAAO,CAACZ,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,CACc;AAErB,CAAC;AAAC"}
+{"version":3,"file":"DropdownIcon.js","names":["DropdownIcon","opened","className","restProps","useAdaptivityConditionalRender","sizeY","IconCompact","Icon20ChevronUp","Icon20Dropdown","IconRegular","Icon24ChevronUp","Icon24ChevronDown","compact","classNames","regular"],"sources":["../../../../src/components/DropdownIcon/DropdownIcon.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Icon20ChevronUp,\n  Icon20Dropdown,\n  Icon24ChevronDown,\n  Icon24ChevronUp,\n} from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityConditionalRender } from '../../hooks/useAdaptivityConditionalRender';\nimport styles from './DropdownIcon.module.css';\n\nexport interface DropdownIconProps extends React.HTMLAttributes<SVGSVGElement> {\n  opened?: boolean;\n}\n\nexport const DropdownIcon = ({ opened = false, className, ...restProps }: DropdownIconProps) => {\n  const { sizeY } = useAdaptivityConditionalRender();\n  const IconCompact = opened ? Icon20ChevronUp : Icon20Dropdown;\n  const IconRegular = opened ? Icon24ChevronUp : Icon24ChevronDown;\n\n  return (\n    <React.Fragment>\n      {sizeY.compact && (\n        <IconCompact\n          className={classNames(styles['DropdownIcon'], sizeY.compact.className, className)}\n          {...restProps}\n        />\n      )}\n      {sizeY.regular && (\n        <IconRegular\n          className={classNames(styles['DropdownIcon'], sizeY.regular.className, className)}\n          {...restProps}\n        />\n      )}\n    </React.Fragment>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AAMA;AACA;AAA4F;AAOrF,IAAMA,YAAY,GAAG,SAAfA,YAAY,OAAuE;EAAA,uBAAjEC,MAAM;IAANA,MAAM,4BAAG,KAAK;IAAEC,SAAS,QAATA,SAAS;IAAKC,SAAS;EACpE,4BAAkB,IAAAC,8DAA8B,GAAE;IAA1CC,KAAK,yBAALA,KAAK;EACb,IAAMC,WAAW,GAAGL,MAAM,GAAGM,sBAAe,GAAGC,qBAAc;EAC7D,IAAMC,WAAW,GAAGR,MAAM,GAAGS,sBAAe,GAAGC,wBAAiB;EAEhE,oBACE,oBAAC,KAAK,CAAC,QAAQ,QACZN,KAAK,CAACO,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAE,IAAAC,gBAAU,sBAAyBR,KAAK,CAACO,OAAO,CAACV,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,EACAE,KAAK,CAACS,OAAO,iBACZ,oBAAC,WAAW;IACV,SAAS,EAAE,IAAAD,gBAAU,sBAAyBR,KAAK,CAACS,OAAO,CAACZ,SAAS,EAAEA,SAAS;EAAE,GAC9EC,SAAS,EAEhB,CACc;AAErB,CAAC;AAAC"}

package/dist/cjs/components/Epic/Epic.js

@@ -10,9 +10,9 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
 var _vkjs = require("@vkontakte/vkjs");
-var _ScrollSaver = require("./ScrollSaver");
 var _getNavId = require("../../lib/getNavId");
 var _warnOnce = require("../../lib/warnOnce");
+var _ScrollSaver = require("./ScrollSaver");
 var _excluded = ["activeStory", "tabbar", "children", "className"];
 var warn = (0, _warnOnce.warnOnce)('Epic');
 

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

@@ -1 +1 @@
-{"version":3,"file":"Epic.js","names":["warn","warnOnce","Epic","props","scroll","React","useRef","current","activeStory","tabbar","children","className","restProps","story","Children","toArray","find","isValidElement","getNavId","classNames","value"],"sources":["../../../../src/components/Epic/Epic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { ScrollSaver } from './ScrollSaver';\nimport { getNavId } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends React.HTMLAttributes<HTMLDivElement> {\n  tabbar?: React.ReactNode;\n  activeStory: string;\n}\n\nconst warn = warnOnce('Epic');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = (props: EpicProps) => {\n  const scroll = React.useRef<{ [key: string]: number }>({}).current;\n  const { activeStory, tabbar, children, className, ...restProps } = props;\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    <div\n      {...restProps}\n      className={classNames(styles['Epic'], tabbar && styles['Epic--hasTabbar'], className)}\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    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAA8C;AAQ9C,IAAMA,IAAI,GAAG,IAAAC,kBAAQ,EAAC,MAAM,CAAC;;AAE7B;AACA;AACA;AACO,IAAMC,IAAI,GAAG,SAAPA,IAAI,CAAIC,KAAgB,EAAK;EAAA;EACxC,IAAMC,MAAM,GAAGC,KAAK,CAACC,MAAM,CAA4B,CAAC,CAAC,CAAC,CAACC,OAAO;EAClE,IAAQC,WAAW,GAAgDL,KAAK,CAAhEK,WAAW;IAAEC,MAAM,GAAwCN,KAAK,CAAnDM,MAAM;IAAEC,QAAQ,GAA8BP,KAAK,CAA3CO,QAAQ;IAAEC,SAAS,GAAmBR,KAAK,CAAjCQ,SAAS;IAAKC,SAAS,0CAAKT,KAAK;EAExE,IAAMU,KAAK,WACRR,KAAK,CAACS,QAAQ,CAACC,OAAO,CAACL,QAAQ,CAAC,CAACM,IAAI,CACpC,UAACH,KAAK;IAAA,OAAK,aAAAR,KAAK,CAACY,cAAc,CAACJ,KAAK,CAAC,IAAI,IAAAK,kBAAQ,EAACL,KAAK,CAACV,KAAK,EAAEH,IAAI,CAAC,KAAKQ,WAAW;EAAA,EACtF,uCAAuC,IAAI;EAE9C,oBACE,sDACMI,SAAS;IACb,SAAS,EAAE,IAAAO,gBAAU,cAAiBV,MAAM,yBAA6B,EAAEE,SAAS;EAAE,iBAEtF,oBAAC,wBAAW;IACV,GAAG,EAAEH,WAAY;IACjB,aAAa,EAAEJ,MAAM,CAACI,WAAW,CAAC,IAAI,CAAE;IACxC,UAAU,EAAE,oBAACY,KAAK;MAAA,OAAMhB,MAAM,CAACI,WAAW,CAAC,GAAGY,KAAK;IAAA;EAAE,GAEpDP,KAAK,CACM,EACbJ,MAAM,CACH;AAEV,CAAC;AAAC"}
+{"version":3,"file":"Epic.js","names":["warn","warnOnce","Epic","props","scroll","React","useRef","current","activeStory","tabbar","children","className","restProps","story","Children","toArray","find","isValidElement","getNavId","classNames","value"],"sources":["../../../../src/components/Epic/Epic.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getNavId } from '../../lib/getNavId';\nimport { warnOnce } from '../../lib/warnOnce';\nimport { ScrollSaver } from './ScrollSaver';\nimport styles from './Epic.module.css';\n\nexport interface EpicProps extends React.HTMLAttributes<HTMLDivElement> {\n  tabbar?: React.ReactNode;\n  activeStory: string;\n}\n\nconst warn = warnOnce('Epic');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Epic\n */\nexport const Epic = (props: EpicProps) => {\n  const scroll = React.useRef<{ [key: string]: number }>({}).current;\n  const { activeStory, tabbar, children, className, ...restProps } = props;\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    <div\n      {...restProps}\n      className={classNames(styles['Epic'], tabbar && styles['Epic--hasTabbar'], className)}\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    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AAA4C;AAQ5C,IAAMA,IAAI,GAAG,IAAAC,kBAAQ,EAAC,MAAM,CAAC;;AAE7B;AACA;AACA;AACO,IAAMC,IAAI,GAAG,SAAPA,IAAI,CAAIC,KAAgB,EAAK;EAAA;EACxC,IAAMC,MAAM,GAAGC,KAAK,CAACC,MAAM,CAA4B,CAAC,CAAC,CAAC,CAACC,OAAO;EAClE,IAAQC,WAAW,GAAgDL,KAAK,CAAhEK,WAAW;IAAEC,MAAM,GAAwCN,KAAK,CAAnDM,MAAM;IAAEC,QAAQ,GAA8BP,KAAK,CAA3CO,QAAQ;IAAEC,SAAS,GAAmBR,KAAK,CAAjCQ,SAAS;IAAKC,SAAS,0CAAKT,KAAK;EAExE,IAAMU,KAAK,WACRR,KAAK,CAACS,QAAQ,CAACC,OAAO,CAACL,QAAQ,CAAC,CAACM,IAAI,CACpC,UAACH,KAAK;IAAA,OAAK,aAAAR,KAAK,CAACY,cAAc,CAACJ,KAAK,CAAC,IAAI,IAAAK,kBAAQ,EAACL,KAAK,CAACV,KAAK,EAAEH,IAAI,CAAC,KAAKQ,WAAW;EAAA,EACtF,uCAAuC,IAAI;EAE9C,oBACE,sDACMI,SAAS;IACb,SAAS,EAAE,IAAAO,gBAAU,cAAiBV,MAAM,yBAA6B,EAAEE,SAAS;EAAE,iBAEtF,oBAAC,wBAAW;IACV,GAAG,EAAEH,WAAY;IACjB,aAAa,EAAEJ,MAAM,CAACI,WAAW,CAAC,IAAI,CAAE;IACxC,UAAU,EAAE,oBAACY,KAAK;MAAA,OAAMhB,MAAM,CAACI,WAAW,CAAC,GAAGY,KAAK;IAAA;EAAE,GAEpDP,KAAK,CACM,EACbJ,MAAM,CACH;AAEV,CAAC;AAAC"}

package/dist/cjs/components/Epic/ScrollSaver.js

@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.ScrollSaver = void 0;
 var React = _interopRequireWildcard(require("react"));
-var _ScrollContext = require("../AppRoot/ScrollContext");
 var _useIsomorphicLayoutEffect = require("../../lib/useIsomorphicLayoutEffect");
+var _ScrollContext = require("../AppRoot/ScrollContext");
 /**
  * @see https://vkcom.github.io/VKUI/#/ScrollSaver
  */

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

@@ -1 +1 @@
-{"version":3,"file":"ScrollSaver.js","names":["ScrollSaver","children","initialScroll","saveScroll","React","useContext","ScrollContext","getScroll","scrollTo","useIsomorphicLayoutEffect","y"],"sources":["../../../../src/components/Epic/ScrollSaver.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\n\nexport interface ScrollSaverProps {\n  initialScroll?: number;\n  saveScroll: (this: void, scroll: number) => any;\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ScrollSaver\n */\nexport const ScrollSaver = ({ children, initialScroll, saveScroll }: ScrollSaverProps) => {\n  const { getScroll, scrollTo } = React.useContext(ScrollContext);\n  useIsomorphicLayoutEffect(() => {\n    if (typeof initialScroll === 'number') {\n      scrollTo(0, initialScroll);\n    }\n    return () => saveScroll(getScroll().y);\n  }, []);\n  return <React.Fragment>{children}</React.Fragment>;\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAQA;AACA;AACA;AACO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAAkE;EAAA,IAA5DC,QAAQ,QAARA,QAAQ;IAAEC,aAAa,QAAbA,aAAa;IAAEC,UAAU,QAAVA,UAAU;EAC/D,wBAAgCC,KAAK,CAACC,UAAU,CAACC,4BAAa,CAAC;IAAvDC,SAAS,qBAATA,SAAS;IAAEC,QAAQ,qBAARA,QAAQ;EAC3B,IAAAC,oDAAyB,EAAC,YAAM;IAC9B,IAAI,OAAOP,aAAa,KAAK,QAAQ,EAAE;MACrCM,QAAQ,CAAC,CAAC,EAAEN,aAAa,CAAC;IAC5B;IACA,OAAO;MAAA,OAAMC,UAAU,CAACI,SAAS,EAAE,CAACG,CAAC,CAAC;IAAA;EACxC,CAAC,EAAE,EAAE,CAAC;EACN,oBAAO,oBAAC,KAAK,CAAC,QAAQ,QAAET,QAAQ,CAAkB;AACpD,CAAC;AAAC"}
+{"version":3,"file":"ScrollSaver.js","names":["ScrollSaver","children","initialScroll","saveScroll","React","useContext","ScrollContext","getScroll","scrollTo","useIsomorphicLayoutEffect","y"],"sources":["../../../../src/components/Epic/ScrollSaver.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { ScrollContext } from '../AppRoot/ScrollContext';\n\nexport interface ScrollSaverProps {\n  initialScroll?: number;\n  saveScroll: (this: void, scroll: number) => any;\n  children?: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ScrollSaver\n */\nexport const ScrollSaver = ({ children, initialScroll, saveScroll }: ScrollSaverProps) => {\n  const { getScroll, scrollTo } = React.useContext(ScrollContext);\n  useIsomorphicLayoutEffect(() => {\n    if (typeof initialScroll === 'number') {\n      scrollTo(0, initialScroll);\n    }\n    return () => saveScroll(getScroll().y);\n  }, []);\n  return <React.Fragment>{children}</React.Fragment>;\n};\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAQA;AACA;AACA;AACO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAAkE;EAAA,IAA5DC,QAAQ,QAARA,QAAQ;IAAEC,aAAa,QAAbA,aAAa;IAAEC,UAAU,QAAVA,UAAU;EAC/D,wBAAgCC,KAAK,CAACC,UAAU,CAACC,4BAAa,CAAC;IAAvDC,SAAS,qBAATA,SAAS;IAAEC,QAAQ,qBAARA,QAAQ;EAC3B,IAAAC,oDAAyB,EAAC,YAAM;IAC9B,IAAI,OAAOP,aAAa,KAAK,QAAQ,EAAE;MACrCM,QAAQ,CAAC,CAAC,EAAEN,aAAa,CAAC;IAC5B;IACA,OAAO;MAAA,OAAMC,UAAU,CAACI,SAAS,EAAE,CAACG,CAAC,CAAC;IAAA;EACxC,CAAC,EAAE,EAAE,CAAC;EACN,oBAAO,oBAAC,KAAK,CAAC,QAAQ,QAAET,QAAQ,CAAkB;AACpD,CAAC;AAAC"}

package/dist/cjs/components/File/File.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { VKUIButtonProps } from '../Button/Button';
 import { HasRef, HasRootRef } from '../../types';
+import { VKUIButtonProps } from '../Button/Button';
 export interface FileProps extends Omit<VKUIButtonProps, 'type'>, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>, HasRef<HTMLInputElement>, HasRootRef<HTMLElement> {
 }
 /**

package/dist/cjs/components/File/File.js

@@ -9,11 +9,11 @@ exports.File = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
+var _vkjs = require("@vkontakte/vkjs");
 var _getPlatformClassName = require("../../helpers/getPlatformClassName");
-var _Button = require("../Button/Button");
 var _usePlatform = require("../../hooks/usePlatform");
+var _Button = require("../Button/Button");
 var _VisuallyHiddenInput = require("../VisuallyHiddenInput/VisuallyHiddenInput");
-var _vkjs = require("@vkontakte/vkjs");
 var _excluded = ["children", "align", "size", "mode", "stretched", "before", "after", "loading", "className", "style", "getRef", "getRootRef", "appearance"];
 /**
  * @see https://vkcom.github.io/VKUI/#/File

package/dist/cjs/components/File/File.js.map

@@ -1 +1 @@
-{"version":3,"file":"File.js","names":["File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","platform","usePlatform","classNames","getPlatformClassName","disabled"],"sources":["../../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { Button, VKUIButtonProps } from '../Button/Button';\nimport { HasRef, HasRootRef } from '../../types';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport { classNames } from '@vkontakte/vkjs';\nimport styles from './File.module.css';\n\nexport interface FileProps\n  extends Omit<VKUIButtonProps, 'type'>,\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n  children = 'Выберите файл',\n  align = 'left',\n  size,\n  mode,\n  stretched,\n  before,\n  after,\n  loading,\n  className,\n  style,\n  getRef,\n  getRootRef,\n  appearance,\n  ...restProps\n}: FileProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Button\n      Component=\"label\"\n      align={align}\n      className={classNames(\n        styles['File'],\n        getPlatformClassName(styles['File'], platform),\n        className,\n      )}\n      stretched={stretched}\n      mode={mode}\n      appearance={appearance}\n      size={size}\n      before={before}\n      after={after}\n      loading={loading}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        className={styles['File__input']}\n        type=\"file\"\n        getRef={getRef}\n      />\n      {children}\n    </Button>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AAA6C;AAS7C;AACA;AACA;AACO,IAAMA,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,cAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEd,KAAM;IACb,SAAS,EAAE,IAAAe,gBAAU,cAEnB,IAAAC,0CAAoB,cAAiBH,QAAQ,CAAC,EAC9CN,SAAS,CACT;IACF,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACK;EAAS,gBAE7B,oBAAC,wCAAmB,6BACdL,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC;AAAC"}
+{"version":3,"file":"File.js","names":["File","children","align","size","mode","stretched","before","after","loading","className","style","getRef","getRootRef","appearance","restProps","platform","usePlatform","classNames","getPlatformClassName","disabled"],"sources":["../../../../src/components/File/File.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getPlatformClassName } from '../../helpers/getPlatformClassName';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Button, VKUIButtonProps } from '../Button/Button';\nimport { VisuallyHiddenInput } from '../VisuallyHiddenInput/VisuallyHiddenInput';\nimport styles from './File.module.css';\n\nexport interface FileProps\n  extends Omit<VKUIButtonProps, 'type'>,\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'size'>,\n    HasRef<HTMLInputElement>,\n    HasRootRef<HTMLElement> {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/File\n */\nexport const File = ({\n  children = 'Выберите файл',\n  align = 'left',\n  size,\n  mode,\n  stretched,\n  before,\n  after,\n  loading,\n  className,\n  style,\n  getRef,\n  getRootRef,\n  appearance,\n  ...restProps\n}: FileProps) => {\n  const platform = usePlatform();\n\n  return (\n    <Button\n      Component=\"label\"\n      align={align}\n      className={classNames(\n        styles['File'],\n        getPlatformClassName(styles['File'], platform),\n        className,\n      )}\n      stretched={stretched}\n      mode={mode}\n      appearance={appearance}\n      size={size}\n      before={before}\n      after={after}\n      loading={loading}\n      style={style}\n      getRootRef={getRootRef}\n      disabled={restProps.disabled}\n    >\n      <VisuallyHiddenInput\n        {...restProps}\n        className={styles['File__input']}\n        type=\"file\"\n        getRef={getRef}\n      />\n      {children}\n    </Button>\n  );\n};\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAiF;AASjF;AACA;AACA;AACO,IAAMA,IAAI,GAAG,SAAPA,IAAI,OAeA;EAAA,yBAdfC,QAAQ;IAARA,QAAQ,8BAAG,eAAe;IAAA,kBAC1BC,KAAK;IAALA,KAAK,2BAAG,MAAM;IACdC,IAAI,QAAJA,IAAI;IACJC,IAAI,QAAJA,IAAI;IACJC,SAAS,QAATA,SAAS;IACTC,MAAM,QAANA,MAAM;IACNC,KAAK,QAALA,KAAK;IACLC,OAAO,QAAPA,OAAO;IACPC,SAAS,QAATA,SAAS;IACTC,KAAK,QAALA,KAAK;IACLC,MAAM,QAANA,MAAM;IACNC,UAAU,QAAVA,UAAU;IACVC,UAAU,QAAVA,UAAU;IACPC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAE9B,oBACE,oBAAC,cAAM;IACL,SAAS,EAAC,OAAO;IACjB,KAAK,EAAEd,KAAM;IACb,SAAS,EAAE,IAAAe,gBAAU,cAEnB,IAAAC,0CAAoB,cAAiBH,QAAQ,CAAC,EAC9CN,SAAS,CACT;IACF,SAAS,EAAEJ,SAAU;IACrB,IAAI,EAAED,IAAK;IACX,UAAU,EAAES,UAAW;IACvB,IAAI,EAAEV,IAAK;IACX,MAAM,EAAEG,MAAO;IACf,KAAK,EAAEC,KAAM;IACb,OAAO,EAAEC,OAAQ;IACjB,KAAK,EAAEE,KAAM;IACb,UAAU,EAAEE,UAAW;IACvB,QAAQ,EAAEE,SAAS,CAACK;EAAS,gBAE7B,oBAAC,wCAAmB,6BACdL,SAAS;IACb,SAAS,mBAAwB;IACjC,IAAI,EAAC,MAAM;IACX,MAAM,EAAEH;EAAO,GACf,EACDV,QAAQ,CACF;AAEb,CAAC;AAAC"}

package/dist/cjs/components/FixedLayout/FixedLayout.js

@@ -11,14 +11,14 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/obje
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var React = _interopRequireWildcard(require("react"));
-var _platform = require("../../lib/platform");
 var _vkjs = require("@vkontakte/vkjs");
-var _SplitCol = require("../SplitCol/SplitCol");
-var _TooltipContainer = require("../Tooltip/TooltipContainer");
-var _dom = require("../../lib/dom");
+var _useExternRef = require("../../hooks/useExternRef");
 var _useGlobalEventListener = require("../../hooks/useGlobalEventListener");
 var _usePlatform = require("../../hooks/usePlatform");
-var _useExternRef = require("../../hooks/useExternRef");
+var _dom = require("../../lib/dom");
+var _platform = require("../../lib/platform");
+var _SplitColContext = require("../SplitCol/SplitColContext");
+var _TooltipContainer = require("../Tooltip/TooltipContainer");
 var _excluded = ["children", "style", "vertical", "getRootRef", "getRef", "filled", "className"];
 /**
  * @see https://vkcom.github.io/VKUI/#/FixedLayout
@@ -40,7 +40,7 @@ var FixedLayout = function FixedLayout(_ref) {
     setWidth = _React$useState2[1];
   var _useDOM = (0, _dom.useDOM)(),
     window = _useDOM.window;
-  var _React$useContext = React.useContext(_SplitCol.SplitColContext),
+  var _React$useContext = React.useContext(_SplitColContext.SplitColContext),
     colRef = _React$useContext.colRef;
   var doResize = function doResize() {
     if (colRef !== null && colRef !== void 0 && colRef.current) {

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

@@ -1 +1 @@
-{"version":3,"file":"FixedLayout.js","names":["FixedLayout","children","style","vertical","getRootRef","getRef","filled","className","restProps","platform","usePlatform","ref","useExternRef","React","useState","undefined","width","setWidth","useDOM","window","useContext","SplitColContext","colRef","doResize","current","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","useGlobalEventListener","classNames","Platform","IOS","styles"],"sources":["../../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Platform } from '../../lib/platform';\nimport { classNames } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef } from '../../types';\nimport { SplitColContext } from '../SplitCol/SplitCol';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\nimport { useDOM } from '../../lib/dom';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport styles from './FixedLayout.module.css';\n\nexport interface FixedLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  vertical?: 'top' | 'bottom';\n  /**\n   * Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n   * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n   */\n  filled?: 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  getRef,\n  filled,\n  className,\n  ...restProps\n}: FixedLayoutProps) => {\n  const platform = usePlatform();\n  const ref = useExternRef(getRootRef, getRef); // TODO: v6 удалить getRef\n  const [width, setWidth] = React.useState<string | undefined>(undefined);\n  const { window } = useDOM();\n  const { colRef } = React.useContext(SplitColContext);\n  const doResize = () => {\n    if (colRef?.current) {\n      const computedStyle = getComputedStyle(colRef.current);\n\n      setWidth(\n        `${\n          colRef.current.clientWidth -\n          parseFloat(computedStyle.paddingLeft) -\n          parseFloat(computedStyle.paddingRight)\n        }px`,\n      );\n    } else {\n      setWidth(undefined);\n    }\n  };\n  React.useEffect(doResize, [colRef, platform]);\n  useGlobalEventListener(window, 'resize', doResize);\n\n  return (\n    <TooltipContainer\n      {...restProps}\n      fixed\n      ref={ref}\n      className={classNames(\n        styles['FixedLayout'],\n        platform === Platform.IOS && styles['FixedLayout--ios'],\n        filled && styles['FixedLayout--filled'],\n        vertical && styles[`FixedLayout--vertical-${vertical}`],\n        className,\n      )}\n      style={{ ...style, width }}\n    >\n      {children}\n    </TooltipContainer>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAAwD;AAsBxD;AACA;AACA;AACO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMC,GAAG,GAAG,IAAAC,0BAAY,EAACR,UAAU,EAAEC,MAAM,CAAC,CAAC,CAAC;EAC9C,sBAA0BQ,KAAK,CAACC,QAAQ,CAAqBC,SAAS,CAAC;IAAA;IAAhEC,KAAK;IAAEC,QAAQ;EACtB,cAAmB,IAAAC,WAAM,GAAE;IAAnBC,MAAM,WAANA,MAAM;EACd,wBAAmBN,KAAK,CAACO,UAAU,CAACC,yBAAe,CAAC;IAA5CC,MAAM,qBAANA,MAAM;EACd,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,GAAS;IACrB,IAAID,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEE,OAAO,EAAE;MACnB,IAAMC,aAAa,GAAGC,gBAAgB,CAACJ,MAAM,CAACE,OAAO,CAAC;MAEtDP,QAAQ,WAEJK,MAAM,CAACE,OAAO,CAACG,WAAW,GAC1BC,UAAU,CAACH,aAAa,CAACI,WAAW,CAAC,GACrCD,UAAU,CAACH,aAAa,CAACK,YAAY,CAAC,QAEzC;IACH,CAAC,MAAM;MACLb,QAAQ,CAACF,SAAS,CAAC;IACrB;EACF,CAAC;EACDF,KAAK,CAACkB,SAAS,CAACR,QAAQ,EAAE,CAACD,MAAM,EAAEb,QAAQ,CAAC,CAAC;EAC7C,IAAAuB,8CAAsB,EAACb,MAAM,EAAE,QAAQ,EAAEI,QAAQ,CAAC;EAElD,oBACE,oBAAC,kCAAgB,6BACXf,SAAS;IACb,KAAK;IACL,GAAG,EAAEG,GAAI;IACT,SAAS,EAAE,IAAAsB,gBAAU,qBAEnBxB,QAAQ,KAAKyB,kBAAQ,CAACC,GAAG,0BAA8B,EACvD7B,MAAM,6BAAiC,EACvCH,QAAQ,IAAIiC,MAAM,iCAA0BjC,QAAQ,EAAG,EACvDI,SAAS,CACT;IACF,KAAK,8DAAOL,KAAK;MAAEc,KAAK,EAALA;IAAK;EAAG,IAE1Bf,QAAQ,CACQ;AAEvB,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA"}
+{"version":3,"file":"FixedLayout.js","names":["FixedLayout","children","style","vertical","getRootRef","getRef","filled","className","restProps","platform","usePlatform","ref","useExternRef","React","useState","undefined","width","setWidth","useDOM","window","useContext","SplitColContext","colRef","doResize","current","computedStyle","getComputedStyle","clientWidth","parseFloat","paddingLeft","paddingRight","useEffect","useGlobalEventListener","classNames","Platform","IOS","styles"],"sources":["../../../../src/components/FixedLayout/FixedLayout.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { useDOM } from '../../lib/dom';\nimport { Platform } from '../../lib/platform';\nimport { HasRef, HasRootRef } from '../../types';\nimport { SplitColContext } from '../SplitCol/SplitColContext';\nimport { TooltipContainer } from '../Tooltip/TooltipContainer';\nimport styles from './FixedLayout.module.css';\n\nexport interface FixedLayoutProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  vertical?: 'top' | 'bottom';\n  /**\n   * Это свойство определяет, будет ли фон компонента окрашен в цвет фона контента.\n   * Это часто необходимо для фиксированных кнопок в нижней части экрана.\n   */\n  filled?: 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  getRef,\n  filled,\n  className,\n  ...restProps\n}: FixedLayoutProps) => {\n  const platform = usePlatform();\n  const ref = useExternRef(getRootRef, getRef); // TODO: v6 удалить getRef\n  const [width, setWidth] = React.useState<string | undefined>(undefined);\n  const { window } = useDOM();\n  const { colRef } = React.useContext(SplitColContext);\n  const doResize = () => {\n    if (colRef?.current) {\n      const computedStyle = getComputedStyle(colRef.current);\n\n      setWidth(\n        `${\n          colRef.current.clientWidth -\n          parseFloat(computedStyle.paddingLeft) -\n          parseFloat(computedStyle.paddingRight)\n        }px`,\n      );\n    } else {\n      setWidth(undefined);\n    }\n  };\n  React.useEffect(doResize, [colRef, platform]);\n  useGlobalEventListener(window, 'resize', doResize);\n\n  return (\n    <TooltipContainer\n      {...restProps}\n      fixed\n      ref={ref}\n      className={classNames(\n        styles['FixedLayout'],\n        platform === Platform.IOS && styles['FixedLayout--ios'],\n        filled && styles['FixedLayout--filled'],\n        vertical && styles[`FixedLayout--vertical-${vertical}`],\n        className,\n      )}\n      style={{ ...style, width }}\n    >\n      {children}\n    </TooltipContainer>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AAA+D;AAsB/D;AACA;AACA;AACO,IAAMA,WAAW,GAAG,SAAdA,WAAW,OASA;EAAA,IARtBC,QAAQ,QAARA,QAAQ;IACRC,KAAK,QAALA,KAAK;IACLC,QAAQ,QAARA,QAAQ;IACRC,UAAU,QAAVA,UAAU;IACVC,MAAM,QAANA,MAAM;IACNC,MAAM,QAANA,MAAM;IACNC,SAAS,QAATA,SAAS;IACNC,SAAS;EAEZ,IAAMC,QAAQ,GAAG,IAAAC,wBAAW,GAAE;EAC9B,IAAMC,GAAG,GAAG,IAAAC,0BAAY,EAACR,UAAU,EAAEC,MAAM,CAAC,CAAC,CAAC;EAC9C,sBAA0BQ,KAAK,CAACC,QAAQ,CAAqBC,SAAS,CAAC;IAAA;IAAhEC,KAAK;IAAEC,QAAQ;EACtB,cAAmB,IAAAC,WAAM,GAAE;IAAnBC,MAAM,WAANA,MAAM;EACd,wBAAmBN,KAAK,CAACO,UAAU,CAACC,gCAAe,CAAC;IAA5CC,MAAM,qBAANA,MAAM;EACd,IAAMC,QAAQ,GAAG,SAAXA,QAAQ,GAAS;IACrB,IAAID,MAAM,aAANA,MAAM,eAANA,MAAM,CAAEE,OAAO,EAAE;MACnB,IAAMC,aAAa,GAAGC,gBAAgB,CAACJ,MAAM,CAACE,OAAO,CAAC;MAEtDP,QAAQ,WAEJK,MAAM,CAACE,OAAO,CAACG,WAAW,GAC1BC,UAAU,CAACH,aAAa,CAACI,WAAW,CAAC,GACrCD,UAAU,CAACH,aAAa,CAACK,YAAY,CAAC,QAEzC;IACH,CAAC,MAAM;MACLb,QAAQ,CAACF,SAAS,CAAC;IACrB;EACF,CAAC;EACDF,KAAK,CAACkB,SAAS,CAACR,QAAQ,EAAE,CAACD,MAAM,EAAEb,QAAQ,CAAC,CAAC;EAC7C,IAAAuB,8CAAsB,EAACb,MAAM,EAAE,QAAQ,EAAEI,QAAQ,CAAC;EAElD,oBACE,oBAAC,kCAAgB,6BACXf,SAAS;IACb,KAAK;IACL,GAAG,EAAEG,GAAI;IACT,SAAS,EAAE,IAAAsB,gBAAU,qBAEnBxB,QAAQ,KAAKyB,kBAAQ,CAACC,GAAG,0BAA8B,EACvD7B,MAAM,6BAAiC,EACvCH,QAAQ,IAAIiC,MAAM,iCAA0BjC,QAAQ,EAAG,EACvDI,SAAS,CACT;IACF,KAAK,8DAAOL,KAAK;MAAEc,KAAK,EAALA;IAAK;EAAG,IAE1Bf,QAAQ,CACQ;AAEvB,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA"}