@vkontakte/vkui 7.3.8 → 7.4.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isAfter } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n  CalendarRange,\n  type CalendarRangeProps,\n  type CalendarRangeTestsProps,\n  type DateRangeType,\n} from '../CalendarRange/CalendarRange';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLike } from '../InputLike/InputLike';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n  /**\n   * Передает атрибут `data-testid` для поля ввода дня.\n   */\n  day?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода месяца.\n   */\n  month?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода года.\n   */\n  year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n  /**\n   * Передает атрибуты `data-testid` для полей ввода начальной даты.\n   */\n  startDateTestsProps?: DateTestsProps;\n  /**\n   * Передает атрибуты `data-testid` для полей ввода конечной даты.\n   */\n  endDateTestsProps?: DateTestsProps;\n  /**\n   * Передает атрибут `data-testid` для кнопки показа календаря.\n   */\n  showCalendarButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для кнопки очистки даты.\n   */\n  clearButtonTestId?: string;\n};\n\nexport interface DateRangeInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>,\n    Pick<\n      CalendarRangeProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'defaultValue'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'renderDayContent'\n    >,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateRangeInputTestsProps {\n  /**\n   * Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n   */\n  calendarTestsProps?: CalendarRangeTestsProps;\n  /**\n   * Расположение календаря относительно поля ввода.\n   */\n  calendarPlacement?: PlacementWithAuto;\n  /**\n   * Автоматически закрывать календарь при изменениях.\n   */\n  closeOnChange?: boolean;\n  /**\n   * Обработчик изменения состояния открытия календаря.\n   */\n  onCalendarOpenChanged?: (opened: boolean) => void;\n  /**\n   * Label для кнопки очистки. Делает доступным для ассистивных технологий.\n   */\n  clearFieldLabel?: string;\n  /**\n   * Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n   */\n  showCalendarLabel?: string;\n  /**\n   * Label для ввода дня начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartDayLabel?: string;\n  /**\n   * Label для ввода месяца начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartMonthLabel?: string;\n  /**\n   * Label для ввода года начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartYearLabel?: string;\n  /**\n   * Label для ввода дня конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndDayLabel?: string;\n  /**\n   * Label для ввода месяца конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndMonthLabel?: string;\n  /**\n   * Label для ввода года конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndYearLabel?: string;\n  /**\n   * Отключение открытия календаря.\n   */\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: valueProp,\n  defaultValue,\n  onChange,\n  calendarPlacement: calendarPlacementProp = 'bottom-start',\n  style,\n  className,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  onClick,\n  onFocus,\n  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  changeDayLabel = 'Изменить день',\n  changeMonthLabel = 'Изменить месяц',\n  changeYearLabel = 'Изменить год',\n  changeStartDayLabel = 'Изменить день начала',\n  changeStartMonthLabel = 'Изменить месяц начала',\n  changeStartYearLabel = 'Изменить год начала',\n  changeEndDayLabel = 'Изменить день окончания',\n  changeEndMonthLabel = 'Изменить месяц окончания',\n  changeEndYearLabel = 'Изменить год окончания',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\n  prevMonthIcon,\n  nextMonthIcon,\n  disableCalendar = false,\n  onCalendarOpenChanged,\n  renderDayContent,\n  calendarTestsProps,\n  startDateTestsProps,\n  endDateTestsProps,\n  clearButtonTestId,\n  showCalendarButtonTestId,\n  id,\n  ...props\n}: DateRangeInputProps): React.ReactNode => {\n  const daysStartRef = React.useRef<HTMLSpanElement>(null);\n  const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n  const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n  const daysEndRef = React.useRef<HTMLSpanElement>(null);\n  const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n  const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n  const _onChange = React.useCallback(\n    (newValue: DateRangeType | null | undefined) => onChange?.(newValue || undefined),\n    [onChange],\n  );\n\n  const [value, updateValue] = useCustomEnsuredControl<DateRangeType | null | undefined>({\n    value: valueProp,\n    defaultValue,\n    onChange: _onChange,\n  });\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        updateValue([start, end]);\n      }\n    },\n    [updateValue, 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 onClear = React.useCallback(() => updateValue(undefined), [updateValue]);\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    onClear,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (newValue: DateRangeType | undefined) => {\n      updateValue(newValue);\n      if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n        removeFocusFromField();\n      }\n    },\n    [updateValue, closeOnChange, value, removeFocusFromField],\n  );\n\n  // при переключении месяцев высота календаря может меняться,\n  // чтобы календарь не прыгал при переключении месяцев каждый раз на\n  // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n  // на ней, пока помещается.\n  const [calendarPlacement, setCalendarPlacement] =\n    React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      after={\n        value ? (\n          <IconButton hoverMode=\"opacity\" onClick={clear} data-testid={clearButtonTestId}>\n            <VisuallyHidden>{clearFieldLabel}</VisuallyHidden>\n            <Icon16Clear />\n          </IconButton>\n        ) : (\n          <IconButton\n            hoverMode=\"opacity\"\n            onClick={openCalendar}\n            data-testid={showCalendarButtonTestId}\n          >\n            <VisuallyHidden>{showCalendarLabel}</VisuallyHidden>\n            <Icon20CalendarOutline />\n          </IconButton>\n        )\n      }\n      disabled={disabled}\n      onClick={callMultiple(handleFieldEnter, onClick)}\n      onFocus={callMultiple(handleFieldEnter, onFocus)}\n      {...props}\n    >\n      <div className={dateInputStyles.wrapper}>\n        <VisuallyHidden\n          id={id}\n          Component=\"input\"\n          name={name}\n          value={\n            value\n              ? `${value[0] ? format(value[0], 'dd.MM.yyyy') : ''} - ${\n                  value[1] ? format(value[1], 'dd.MM.yyyy') : ''\n                }`\n              : ''\n          }\n        />\n        <Text className={dateInputStyles.input} onKeyDown={handleKeyDown}>\n          <InputLike\n            length={2}\n            getRootRef={daysStartRef}\n            index={0}\n            onElementSelect={setFocusedElement}\n            value={internalValue[0]}\n            label={changeStartDayLabel}\n            data-testid={startDateTestsProps?.day}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <InputLike\n            length={2}\n            getRootRef={monthsStartRef}\n            index={1}\n            onElementSelect={setFocusedElement}\n            value={internalValue[1]}\n            label={changeStartMonthLabel}\n            data-testid={startDateTestsProps?.month}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <InputLike\n            length={4}\n            getRootRef={yearsStartRef}\n            index={2}\n            onElementSelect={setFocusedElement}\n            value={internalValue[2]}\n            label={changeStartYearLabel}\n            data-testid={startDateTestsProps?.year}\n          />\n          <InputLikeDivider>{' — '}</InputLikeDivider>\n          <InputLike\n            length={2}\n            getRootRef={daysEndRef}\n            index={3}\n            onElementSelect={setFocusedElement}\n            value={internalValue[3]}\n            label={changeEndDayLabel}\n            data-testid={endDateTestsProps?.day}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <InputLike\n            length={2}\n            getRootRef={monthsEndRef}\n            index={4}\n            onElementSelect={setFocusedElement}\n            value={internalValue[4]}\n            label={changeEndMonthLabel}\n            data-testid={endDateTestsProps?.month}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <InputLike\n            length={4}\n            getRootRef={yearsEndRef}\n            index={5}\n            onElementSelect={setFocusedElement}\n            value={internalValue[5]}\n            label={changeEndYearLabel}\n            data-testid={endDateTestsProps?.year}\n          />\n        </Text>\n      </div>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetByMainAxis={8}\n          placement={calendarPlacement}\n          onPlacementChange={setCalendarPlacement}\n        >\n          <CalendarRange\n            value={value}\n            onChange={onCalendarChange}\n            disablePast={disablePast}\n            disableFuture={disableFuture}\n            shouldDisableDate={shouldDisableDate}\n            onClose={closeCalendar}\n            getRootRef={calendarRef}\n            disablePickers={disablePickers}\n            prevMonthLabel={prevMonthLabel}\n            nextMonthLabel={nextMonthLabel}\n            changeMonthLabel={changeMonthLabel}\n            changeYearLabel={changeYearLabel}\n            changeDayLabel={changeDayLabel}\n            prevMonthIcon={prevMonthIcon}\n            nextMonthIcon={nextMonthIcon}\n            renderDayContent={renderDayContent}\n            {...calendarTestsProps}\n          />\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","isAfter","useAdaptivity","useDateInput","useCustomEnsuredControl","useExternRef","callMultiple","format","isMatch","parse","CalendarRange","FormField","IconButton","InputLike","InputLikeDivider","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","DateRangeInput","shouldDisableDate","disableFuture","disablePast","valueProp","defaultValue","onChange","calendarPlacement","calendarPlacementProp","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","onClick","onFocus","prevMonthLabel","nextMonthLabel","changeDayLabel","changeMonthLabel","changeYearLabel","changeStartDayLabel","changeStartMonthLabel","changeStartYearLabel","changeEndDayLabel","changeEndMonthLabel","changeEndYearLabel","clearFieldLabel","showCalendarLabel","prevMonthIcon","nextMonthIcon","disableCalendar","onCalendarOpenChanged","renderDayContent","calendarTestsProps","startDateTestsProps","endDateTestsProps","clearButtonTestId","showCalendarButtonTestId","id","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","_onChange","useCallback","undefined","updateValue","onInternalValueChange","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","onClear","rootRef","calendarRef","open","openCalendar","closeCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","setCalendarPlacement","useState","after","hoverMode","data-testid","div","Component","onKeyDown","onElementSelect","label","day","month","year","targetRef","offsetByMainAxis","placement","onPlacementChange","onClose"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DateRangeInput/DateRangeInput.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Icon16Clear, Icon20CalendarOutline } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport { isAfter } from 'date-fns';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useDateInput } from '../../hooks/useDateInput';\nimport { useCustomEnsuredControl } from '../../hooks/useEnsuredControl';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { format, isMatch, parse } from '../../lib/date';\nimport type { PlacementWithAuto } from '../../lib/floating';\nimport type { HasRootRef } from '../../types';\nimport {\n  CalendarRange,\n  type CalendarRangeProps,\n  type CalendarRangeTestsProps,\n  type DateRangeType,\n} from '../CalendarRange/CalendarRange';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { FocusTrap } from '../FocusTrap/FocusTrap';\nimport { FormField, type FormFieldProps } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { InputLikeDivider } from '../InputLike/InputLikeDivider';\nimport { NumberInputLike } from '../NumberInputLike/NumberInputLike';\nimport { Popper } from '../Popper/Popper';\nimport { Text } from '../Typography/Text/Text';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './DateRangeInput.module.css';\nimport dateInputStyles from '../DateInput/DateInput.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n};\n\ntype DateTestsProps = {\n  /**\n   * Передает атрибут `data-testid` для поля ввода дня.\n   */\n  day?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода месяца.\n   */\n  month?: string;\n  /**\n   * Передает атрибут `data-testid` для поля ввода года.\n   */\n  year?: string;\n};\n\nexport type DateRangeInputTestsProps = {\n  /**\n   * Передает атрибуты `data-testid` для полей ввода начальной даты.\n   */\n  startDateTestsProps?: DateTestsProps;\n  /**\n   * Передает атрибуты `data-testid` для полей ввода конечной даты.\n   */\n  endDateTestsProps?: DateTestsProps;\n  /**\n   * Передает атрибут `data-testid` для кнопки показа календаря.\n   */\n  showCalendarButtonTestId?: string;\n  /**\n   * Передает атрибут `data-testid` для кнопки очистки даты.\n   */\n  clearButtonTestId?: string;\n};\n\nexport interface DateRangeInputProps\n  extends Omit<React.InputHTMLAttributes<HTMLDivElement>, 'value' | 'defaultValue' | 'onChange'>,\n    Pick<\n      CalendarRangeProps,\n      | 'disablePast'\n      | 'disableFuture'\n      | 'shouldDisableDate'\n      | 'onChange'\n      | 'value'\n      | 'defaultValue'\n      | 'weekStartsOn'\n      | 'disablePickers'\n      | 'prevMonthLabel'\n      | 'nextMonthLabel'\n      | 'changeMonthLabel'\n      | 'changeYearLabel'\n      | 'changeDayLabel'\n      | 'prevMonthIcon'\n      | 'nextMonthIcon'\n      | 'renderDayContent'\n    >,\n    Pick<UseFocusTrapProps, 'restoreFocus'>,\n    HasRootRef<HTMLDivElement>,\n    Omit<FormFieldProps, 'maxHeight'>,\n    DateRangeInputTestsProps {\n  /**\n   * Передает атрибуты `data-testid` для интерактивных элементов в календаре.\n   */\n  calendarTestsProps?: CalendarRangeTestsProps;\n  /**\n   * Расположение календаря относительно поля ввода.\n   */\n  calendarPlacement?: PlacementWithAuto;\n  /**\n   * Автоматически закрывать календарь при изменениях.\n   */\n  closeOnChange?: boolean;\n  /**\n   * Обработчик изменения состояния открытия календаря.\n   */\n  onCalendarOpenChanged?: (opened: boolean) => void;\n  /**\n   * Label для календаря.\n   */\n  calendarLabel?: string;\n  /**\n   * Label для кнопки очистки. Делает доступным для ассистивных технологий.\n   */\n  clearFieldLabel?: string;\n  /**\n   * Label для кнопки открытия календаря. Делает доступным для ассистивных технологий.\n   */\n  showCalendarLabel?: string;\n  /**\n   * Label для ввода дня начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartDayLabel?: string;\n  /**\n   * Label для ввода месяца начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartMonthLabel?: string;\n  /**\n   * Label для ввода года начальной даты. Делает доступным для ассистивных технологий.\n   */\n  changeStartYearLabel?: string;\n  /**\n   * Label для ввода дня конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndDayLabel?: string;\n  /**\n   * Label для ввода месяца конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndMonthLabel?: string;\n  /**\n   * Label для ввода года конечной даты. Делает доступным для ассистивных технологий.\n   */\n  changeEndYearLabel?: string;\n  /**\n   * Отключение открытия календаря.\n   */\n  disableCalendar?: boolean;\n  /**\n   * Позволяет отключить захват фокуса при появлении календаря.\n   */\n  disableFocusTrap?: UseFocusTrapProps['disabled'];\n  /**\n   * Включает режим в котором DateRangeInput доступен\n   * для ассистивных технологий.\n   * В этом режиме:\n   * - календарь больше не открывает при фокусе на DateRangeInput;\n   * - иконка календаря видна всегда, чтобы пользователи\n   * ассистивных технологий могли открыть календарь по клику на иконку;\n   * - календарь при открытии получает фокус, клавиатурный\n   * фокус зациклен и не выходит за пределы календаря пока календарь не закрыт.\n   */\n  accessible?: boolean; // TODO [>=8]: включить по умолчанию.\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\nconst CALENDAR_MUTATION_OBSERVER_OPTIONS: MutationObserverInit = {\n  childList: true,\n  subtree: true,\n  attributes: true,\n  attributeFilter: ['tabindex'],\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/DateRangeInput\n */\nexport const DateRangeInput = ({\n  shouldDisableDate,\n  disableFuture,\n  disablePast,\n  'value': valueProp,\n  defaultValue,\n  onChange,\n  'calendarPlacement': calendarPlacementProp = 'bottom-start',\n  style,\n  className,\n  closeOnChange = true,\n  disablePickers,\n  getRootRef,\n  name,\n  autoFocus,\n  disabled,\n  disableFocusTrap,\n  restoreFocus,\n  calendarLabel = 'Календарь',\n  prevMonthLabel = 'Предыдущий месяц',\n  nextMonthLabel = 'Следующий месяц',\n  changeMonthLabel = 'Месяц',\n  changeYearLabel = 'Год',\n  changeStartDayLabel = 'День начала',\n  changeStartMonthLabel = 'Месяц начала',\n  changeStartYearLabel = 'Год начала',\n  changeEndDayLabel = 'День окончания',\n  changeEndMonthLabel = 'Месяц окончания',\n  changeEndYearLabel = 'Год окончания',\n  clearFieldLabel = 'Очистить поле',\n  showCalendarLabel = 'Показать календарь',\n  'aria-label': ariaLabel = '',\n  prevMonthIcon,\n  nextMonthIcon,\n  onCalendarOpenChanged,\n  renderDayContent,\n  calendarTestsProps,\n  startDateTestsProps,\n  endDateTestsProps,\n  clearButtonTestId,\n  showCalendarButtonTestId,\n  id,\n  accessible,\n  readOnly,\n  'disableCalendar': disableCalendarProp = false,\n  ...props\n}: DateRangeInputProps): React.ReactNode => {\n  const daysStartRef = React.useRef<HTMLSpanElement>(null);\n  const monthsStartRef = React.useRef<HTMLSpanElement>(null);\n  const yearsStartRef = React.useRef<HTMLSpanElement>(null);\n  const daysEndRef = React.useRef<HTMLSpanElement>(null);\n  const monthsEndRef = React.useRef<HTMLSpanElement>(null);\n  const yearsEndRef = React.useRef<HTMLSpanElement>(null);\n\n  const disableCalendar = readOnly ? true : disableCalendarProp;\n\n  const _onChange = React.useCallback(\n    (newValue: DateRangeType | null | undefined) => onChange?.(newValue || undefined),\n    [onChange],\n  );\n\n  const [value, updateValue] = useCustomEnsuredControl<DateRangeType | null | undefined>({\n    value: valueProp,\n    defaultValue,\n    onChange: _onChange,\n  });\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        updateValue([start, end]);\n      }\n    },\n    [updateValue, 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 onClear = React.useCallback(() => updateValue(undefined), [updateValue]);\n\n  const {\n    rootRef,\n    calendarRef,\n    open,\n    openCalendar,\n    closeCalendar,\n    toggleCalendar,\n    internalValue,\n    handleKeyDown,\n    setFocusedElement,\n    handleFieldEnter,\n    clear,\n    removeFocusFromField,\n  } = useDateInput({\n    maxElement: 5,\n    refs,\n    autoFocus,\n    disabled: disabled || readOnly,\n    elementsConfig,\n    onClear,\n    onInternalValueChange,\n    getInternalValue,\n    value,\n    onCalendarOpenChanged,\n    accessible,\n  });\n\n  const { sizeY = 'none' } = useAdaptivity();\n\n  const handleRootRef = useExternRef(rootRef, getRootRef);\n\n  const onCalendarChange = React.useCallback(\n    (newValue: DateRangeType | undefined) => {\n      updateValue(newValue);\n      if (closeOnChange && newValue?.[1] && newValue[1] !== value?.[1]) {\n        removeFocusFromField();\n      }\n    },\n    [updateValue, closeOnChange, value, removeFocusFromField],\n  );\n\n  // при переключении месяцев высота календаря может меняться,\n  // чтобы календарь не прыгал при переключении месяцев каждый раз на\n  // лучшую позицию мы запоминаем последнюю удачную, чтобы календарь оставался\n  // на ней, пока помещается.\n  const [calendarPlacement, setCalendarPlacement] =\n    React.useState<PlacementWithAuto>(calendarPlacementProp);\n\n  const { locale } = useConfigProvider();\n  const currentDateLabel = React.useMemo(() => {\n    if (!value) {\n      return null;\n    }\n    const [startDate, endDate] = value;\n    if (!startDate || !endDate) {\n      return null;\n    }\n    return [\n      new Intl.DateTimeFormat(locale, {\n        weekday: 'long',\n        year: 'numeric',\n        month: 'long',\n        day: 'numeric',\n      }).format(startDate),\n      new Intl.DateTimeFormat(locale, {\n        weekday: 'long',\n        year: 'numeric',\n        month: 'long',\n        day: 'numeric',\n      }).format(endDate),\n    ].join(' - ');\n  }, [locale, value]);\n\n  const currentDateLabelId = React.useId();\n  const ariaLabelId = React.useId();\n\n  const showCalendarOnInputAreaClick = React.useCallback(() => {\n    handleFieldEnter();\n    if (accessible) {\n      openCalendar();\n    }\n  }, [handleFieldEnter, openCalendar, accessible]);\n\n  return (\n    <FormField\n      style={style}\n      className={classNames(sizeY !== 'regular' && sizeYClassNames[sizeY], className)}\n      getRootRef={handleRootRef}\n      role=\"group\"\n      aria-labelledby={`${ariaLabelId} ${currentDateLabelId}`}\n      after={\n        <>\n          {!disableCalendar && (accessible || (!accessible && !value)) ? (\n            <IconButton\n              hoverMode=\"opacity\"\n              label={showCalendarLabel}\n              onClick={toggleCalendar}\n              data-testid={showCalendarButtonTestId}\n            >\n              <Icon20CalendarOutline />\n            </IconButton>\n          ) : null}\n          {value && !readOnly ? (\n            <IconButton\n              hoverMode=\"opacity\"\n              label={clearFieldLabel}\n              onClick={clear}\n              data-testid={clearButtonTestId}\n            >\n              <Icon16Clear />\n            </IconButton>\n          ) : null}\n        </>\n      }\n      disabled={disabled}\n      {...props}\n    >\n      <div className={dateInputStyles.wrapper}>\n        {ariaLabel && <VisuallyHidden id={ariaLabelId}>{ariaLabel}</VisuallyHidden>}\n        {currentDateLabel && (\n          <VisuallyHidden id={currentDateLabelId}>{currentDateLabel}</VisuallyHidden>\n        )}\n        <VisuallyHidden\n          id={id}\n          Component=\"input\"\n          readOnly\n          aria-hidden\n          name={name}\n          tabIndex={readOnly ? 0 : -1}\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          onFocus={handleFieldEnter}\n        />\n        <Text className={dateInputStyles.input} onClick={showCalendarOnInputAreaClick}>\n          <NumberInputLike\n            value={internalValue[0]}\n            minValue={1}\n            maxValue={31}\n            onKeyDown={readOnly ? undefined : handleKeyDown}\n            length={2}\n            getRootRef={daysStartRef}\n            index={0}\n            readOnly={readOnly}\n            onElementSelect={setFocusedElement}\n            label={changeStartDayLabel}\n            data-testid={startDateTestsProps?.day}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <NumberInputLike\n            value={internalValue[1]}\n            minValue={1}\n            maxValue={12}\n            onKeyDown={handleKeyDown}\n            length={2}\n            getRootRef={monthsStartRef}\n            index={1}\n            onElementSelect={setFocusedElement}\n            readOnly={readOnly}\n            label={changeStartMonthLabel}\n            data-testid={startDateTestsProps?.month}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <NumberInputLike\n            value={internalValue[2]}\n            minValue={1}\n            maxValue={275750}\n            onKeyDown={handleKeyDown}\n            length={4}\n            getRootRef={yearsStartRef}\n            index={2}\n            onElementSelect={setFocusedElement}\n            readOnly={readOnly}\n            label={changeStartYearLabel}\n            data-testid={startDateTestsProps?.year}\n          />\n          <InputLikeDivider>{' — '}</InputLikeDivider>\n          <NumberInputLike\n            value={internalValue[3]}\n            minValue={1}\n            maxValue={31}\n            onKeyDown={handleKeyDown}\n            length={2}\n            getRootRef={daysEndRef}\n            index={3}\n            onElementSelect={setFocusedElement}\n            readOnly={readOnly}\n            label={changeEndDayLabel}\n            data-testid={endDateTestsProps?.day}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <NumberInputLike\n            value={internalValue[4]}\n            minValue={1}\n            maxValue={12}\n            onKeyDown={handleKeyDown}\n            length={2}\n            getRootRef={monthsEndRef}\n            index={4}\n            onElementSelect={setFocusedElement}\n            readOnly={readOnly}\n            label={changeEndMonthLabel}\n            data-testid={endDateTestsProps?.month}\n          />\n          <InputLikeDivider>.</InputLikeDivider>\n          <NumberInputLike\n            value={internalValue[5]}\n            minValue={1}\n            maxValue={275750}\n            onKeyDown={handleKeyDown}\n            length={4}\n            getRootRef={yearsEndRef}\n            index={5}\n            onElementSelect={setFocusedElement}\n            readOnly={readOnly}\n            label={changeEndYearLabel}\n            data-testid={endDateTestsProps?.year}\n          />\n        </Text>\n      </div>\n      {open && !disableCalendar && (\n        <Popper\n          targetRef={rootRef}\n          offsetByMainAxis={8}\n          placement={calendarPlacement}\n          onPlacementChange={setCalendarPlacement}\n        >\n          <FocusTrap\n            onClose={closeCalendar}\n            disabled={disableFocusTrap ?? !accessible}\n            restoreFocus={restoreFocus ?? Boolean(accessible)}\n            captureEscapeKeyboardEvent={false}\n            mutationObserverOptions={CALENDAR_MUTATION_OBSERVER_OPTIONS}\n          >\n            <CalendarRange\n              value={value}\n              role=\"dialog\"\n              onChange={onCalendarChange}\n              aria-label={calendarLabel}\n              disablePast={disablePast}\n              disableFuture={disableFuture}\n              shouldDisableDate={shouldDisableDate}\n              getRootRef={calendarRef}\n              disablePickers={disablePickers}\n              prevMonthLabel={prevMonthLabel}\n              nextMonthLabel={nextMonthLabel}\n              changeMonthLabel={changeMonthLabel}\n              changeYearLabel={changeYearLabel}\n              prevMonthIcon={prevMonthIcon}\n              nextMonthIcon={nextMonthIcon}\n              renderDayContent={renderDayContent}\n              {...calendarTestsProps}\n            />\n          </FocusTrap>\n        </Popper>\n      )}\n    </FormField>\n  );\n};\n"],"names":["React","Icon16Clear","Icon20CalendarOutline","classNames","isAfter","useAdaptivity","useDateInput","useCustomEnsuredControl","useExternRef","format","isMatch","parse","CalendarRange","useConfigProvider","FocusTrap","FormField","IconButton","InputLikeDivider","NumberInputLike","Popper","Text","VisuallyHidden","sizeYClassNames","none","compact","elementsConfig","index","length","min","max","getInternalValue","value","newValue","String","getDate","padStart","getMonth","getFullYear","CALENDAR_MUTATION_OBSERVER_OPTIONS","childList","subtree","attributes","attributeFilter","DateRangeInput","shouldDisableDate","disableFuture","disablePast","valueProp","defaultValue","onChange","calendarPlacementProp","style","className","closeOnChange","disablePickers","getRootRef","name","autoFocus","disabled","disableFocusTrap","restoreFocus","calendarLabel","prevMonthLabel","nextMonthLabel","changeMonthLabel","changeYearLabel","changeStartDayLabel","changeStartMonthLabel","changeStartYearLabel","changeEndDayLabel","changeEndMonthLabel","changeEndYearLabel","clearFieldLabel","showCalendarLabel","ariaLabel","prevMonthIcon","nextMonthIcon","onCalendarOpenChanged","renderDayContent","calendarTestsProps","startDateTestsProps","endDateTestsProps","clearButtonTestId","showCalendarButtonTestId","id","accessible","readOnly","disableCalendarProp","props","daysStartRef","useRef","monthsStartRef","yearsStartRef","daysEndRef","monthsEndRef","yearsEndRef","disableCalendar","_onChange","useCallback","undefined","updateValue","onInternalValueChange","internalValue","isStartValid","isEndValid","i","formattedStartValue","formattedEndValue","mask","valueExists","Array","isArray","now","Date","start","end","refs","useMemo","onClear","rootRef","calendarRef","open","openCalendar","closeCalendar","toggleCalendar","handleKeyDown","setFocusedElement","handleFieldEnter","clear","removeFocusFromField","maxElement","sizeY","handleRootRef","onCalendarChange","calendarPlacement","setCalendarPlacement","useState","locale","currentDateLabel","startDate","endDate","Intl","DateTimeFormat","weekday","year","month","day","join","currentDateLabelId","useId","ariaLabelId","showCalendarOnInputAreaClick","role","aria-labelledby","after","hoverMode","label","onClick","data-testid","div","Component","aria-hidden","tabIndex","onFocus","minValue","maxValue","onKeyDown","onElementSelect","targetRef","offsetByMainAxis","placement","onPlacementChange","onClose","Boolean","captureEscapeKeyboardEvent","mutationObserverOptions","aria-label"],"mappings":"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"}

package/dist/components/FocusTrap/FocusTrap.d.ts

@@ -6,5 +6,5 @@ export interface FocusTrapProps<T extends HTMLElement = HTMLElement> extends Use
 /**
  * @see https://vkcom.github.io/VKUI/#/FocusTrap
  */
-export declare const FocusTrap: <T extends HTMLElement = HTMLElement>({ Component, onClose, autoFocus, restoreFocus, disabled, mount, timeout, getRootRef, children, captureEscapeKeyboardEvent, ...restProps }: FocusTrapProps<T>) => React.ReactNode;
+export declare const FocusTrap: <T extends HTMLElement = HTMLElement>({ Component, onClose, autoFocus, restoreFocus, disabled, mount, timeout, getRootRef, children, captureEscapeKeyboardEvent, mutationObserverOptions, ...restProps }: FocusTrapProps<T>) => React.ReactNode;
 //# sourceMappingURL=FocusTrap.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"FocusTrap.d.ts","sourceRoot":"","sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAChF,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CACjE,SAAQ,iBAAiB,EACvB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,MAAM,iBAAiB,CAAC,EACnD,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;CAAG;AAEnB;;GAEG;AACH,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,2IAY5D,cAAc,CAAC,CAAC,CAAC,KAAG,KAAK,CAAC,SAkB5B,CAAC"}
+{"version":3,"file":"FocusTrap.d.ts","sourceRoot":"","sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAEhF,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAE5D,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CACjE,SAAQ,iBAAiB,EACvB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,MAAM,iBAAiB,CAAC,EACnD,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;CAAG;AAEnB;;GAEG;AACH,eAAO,MAAM,SAAS,GAAI,CAAC,SAAS,WAAW,GAAG,WAAW,EAAE,oKAa5D,cAAc,CAAC,CAAC,CAAC,KAAG,KAAK,CAAC,SAmB5B,CAAC"}

package/dist/components/FocusTrap/FocusTrap.js

@@ -5,10 +5,11 @@ import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useExternRef } from "../../hooks/useExternRef.js";
 import { useFocusTrap } from "../../hooks/useFocusTrap.js";
+import { DEFAULT_MUTATION_OBSERVER_OPTIONS } from "../../hooks/useMutationObserver.js";
 /**
  * @see https://vkcom.github.io/VKUI/#/FocusTrap
  */ export const FocusTrap = (_param)=>{
-    var { Component = 'div', onClose, autoFocus = true, restoreFocus = true, disabled = false, mount = true, timeout = 0, getRootRef, children, captureEscapeKeyboardEvent = true } = _param, restProps = _object_without_properties(_param, [
+    var { Component = 'div', onClose, autoFocus = true, restoreFocus = true, disabled = false, mount = true, timeout = 0, getRootRef, children, captureEscapeKeyboardEvent = true, mutationObserverOptions = DEFAULT_MUTATION_OBSERVER_OPTIONS } = _param, restProps = _object_without_properties(_param, [
         "Component",
         "onClose",
         "autoFocus",
@@ -18,7 +19,8 @@ import { useFocusTrap } from "../../hooks/useFocusTrap.js";
         "timeout",
         "getRootRef",
         "children",
-        "captureEscapeKeyboardEvent"
+        "captureEscapeKeyboardEvent",
+        "mutationObserverOptions"
     ]);
     const ref = useExternRef(getRootRef);
     useFocusTrap(ref, {
@@ -28,7 +30,8 @@ import { useFocusTrap } from "../../hooks/useFocusTrap.js";
         mount,
         timeout,
         onClose,
-        captureEscapeKeyboardEvent
+        captureEscapeKeyboardEvent,
+        mutationObserverOptions
     });
     return /*#__PURE__*/ _jsx(Component, _object_spread_props(_object_spread({
         tabIndex: -1,

package/dist/components/FocusTrap/FocusTrap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"sourcesContent":["'use client';\n\nimport { type AllHTMLAttributes } from 'react';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap, type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport type { HasComponent, HasRootRef } from '../../types';\n\nexport interface FocusTrapProps<T extends HTMLElement = HTMLElement>\n  extends UseFocusTrapProps,\n    Omit<AllHTMLAttributes<T>, keyof UseFocusTrapProps>,\n    HasRootRef<T>,\n    HasComponent {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FocusTrap\n */\nexport const FocusTrap = <T extends HTMLElement = HTMLElement>({\n  Component = 'div',\n  onClose,\n  autoFocus = true,\n  restoreFocus = true,\n  disabled = false,\n  mount = true,\n  timeout = 0,\n  getRootRef,\n  children,\n  captureEscapeKeyboardEvent = true,\n  ...restProps\n}: FocusTrapProps<T>): React.ReactNode => {\n  const ref = useExternRef<T>(getRootRef);\n\n  useFocusTrap(ref, {\n    autoFocus,\n    restoreFocus,\n    disabled,\n    mount,\n    timeout,\n    onClose,\n    captureEscapeKeyboardEvent,\n  });\n\n  return (\n    <Component tabIndex={-1} ref={ref} {...restProps}>\n      {children}\n    </Component>\n  );\n};\n"],"names":["useExternRef","useFocusTrap","FocusTrap","Component","onClose","autoFocus","restoreFocus","disabled","mount","timeout","getRootRef","children","captureEscapeKeyboardEvent","restProps","ref","tabIndex"],"mappings":"AAAA;;;;;AAGA,SAASA,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAgC,8BAA2B;AAShF;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAsC,EAC7DC,YAAY,KAAK,EACjBC,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,WAAW,KAAK,EAChBC,QAAQ,IAAI,EACZC,UAAU,CAAC,EACXC,UAAU,EACVC,QAAQ,EACRC,6BAA6B,IAAI,EAEf,WADfC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,MAAMd,aAAgBU;IAE5BT,aAAaa,KAAK;QAChBT;QACAC;QACAC;QACAC;QACAC;QACAL;QACAQ;IACF;IAEA,qBACE,KAACT;QAAUY,UAAU,CAAC;QAAGD,KAAKA;OAASD;kBACpCF;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"sourcesContent":["'use client';\n\nimport { type AllHTMLAttributes } from 'react';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useFocusTrap, type UseFocusTrapProps } from '../../hooks/useFocusTrap';\nimport { DEFAULT_MUTATION_OBSERVER_OPTIONS } from '../../hooks/useMutationObserver';\nimport type { HasComponent, HasRootRef } from '../../types';\n\nexport interface FocusTrapProps<T extends HTMLElement = HTMLElement>\n  extends UseFocusTrapProps,\n    Omit<AllHTMLAttributes<T>, keyof UseFocusTrapProps>,\n    HasRootRef<T>,\n    HasComponent {}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/FocusTrap\n */\nexport const FocusTrap = <T extends HTMLElement = HTMLElement>({\n  Component = 'div',\n  onClose,\n  autoFocus = true,\n  restoreFocus = true,\n  disabled = false,\n  mount = true,\n  timeout = 0,\n  getRootRef,\n  children,\n  captureEscapeKeyboardEvent = true,\n  mutationObserverOptions = DEFAULT_MUTATION_OBSERVER_OPTIONS,\n  ...restProps\n}: FocusTrapProps<T>): React.ReactNode => {\n  const ref = useExternRef<T>(getRootRef);\n\n  useFocusTrap(ref, {\n    autoFocus,\n    restoreFocus,\n    disabled,\n    mount,\n    timeout,\n    onClose,\n    captureEscapeKeyboardEvent,\n    mutationObserverOptions,\n  });\n\n  return (\n    <Component tabIndex={-1} ref={ref} {...restProps}>\n      {children}\n    </Component>\n  );\n};\n"],"names":["useExternRef","useFocusTrap","DEFAULT_MUTATION_OBSERVER_OPTIONS","FocusTrap","Component","onClose","autoFocus","restoreFocus","disabled","mount","timeout","getRootRef","children","captureEscapeKeyboardEvent","mutationObserverOptions","restProps","ref","tabIndex"],"mappings":"AAAA;;;;;AAGA,SAASA,YAAY,QAAQ,8BAA2B;AACxD,SAASC,YAAY,QAAgC,8BAA2B;AAChF,SAASC,iCAAiC,QAAQ,qCAAkC;AASpF;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAsC,EAC7DC,YAAY,KAAK,EACjBC,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,WAAW,KAAK,EAChBC,QAAQ,IAAI,EACZC,UAAU,CAAC,EACXC,UAAU,EACVC,QAAQ,EACRC,6BAA6B,IAAI,EACjCC,0BAA0BZ,iCAAiC,EAEzC,WADfa;QAXHX;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,MAAMhB,aAAgBW;IAE5BV,aAAae,KAAK;QAChBV;QACAC;QACAC;QACAC;QACAC;QACAL;QACAQ;QACAC;IACF;IAEA,qBACE,KAACV;QAAUa,UAAU,CAAC;QAAGD,KAAKA;OAASD;kBACpCH;;AAGP,EAAE"}

package/dist/components/HorizontalCell/HorizontalCell.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import type { HasRef, HasRootRef, LiteralUnion } from '../../types';
-import { type TappableProps } from '../Tappable/Tappable';
+import { type TappableOmitProps } from '../Tappable/Tappable';
 export declare const CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH = "--vkui_internal--cell_width";
 type HorizontalCellSizes = 's' | 'm' | 'l' | 'xl' | 'auto';
-export interface HorizontalCellProps extends Omit<TappableProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>, HasRootRef<HTMLDivElement>, HasRef<HTMLDivElement> {
+export interface HorizontalCellProps extends Omit<TappableOmitProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>, HasRootRef<HTMLDivElement>, HasRef<HTMLDivElement> {
     /**
      * Ширина компонента.
      *

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

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCell.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAuB,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEzF,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAMpE,eAAO,MAAM,+BAA+B,gCAAgC,CAAC;AAe7E,KAAK,mBAAmB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,MAAM,CAAC;AAE3D,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,aAAa,EAAE,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,kBAAkB,CAAC,EAC/E,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,cAAc,CAAC;IACxB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;IACjD;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACpC;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,GAAI,8IAc5B,mBAAmB,KAAG,KAAK,CAAC,SAuC9B,CAAC"}
+{"version":3,"file":"HorizontalCell.d.ts","sourceRoot":"","sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAuB,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEzF,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAMxE,eAAO,MAAM,+BAA+B,gCAAgC,CAAC;AAe7E,KAAK,mBAAmB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,MAAM,CAAC;AAE3D,MAAM,WAAW,mBACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,kBAAkB,CAAC,EACnF,UAAU,CAAC,cAAc,CAAC,EAC1B,MAAM,CAAC,cAAc,CAAC;IACxB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;IACjD;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;OAEG;IACH,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;IACvC;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACpC;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,GAAI,8IAc5B,mBAAmB,KAAG,KAAK,CAAC,SAuC9B,CAAC"}

package/dist/components/HorizontalCell/HorizontalCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './HorizontalCell.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH = '--vkui_internal--cell_width';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXL,\n  auto: styles.sizeAuto,\n};\n\nconst textAlignClassNames = {\n  center: styles.textAlignCenter,\n  end: styles.textAlignEnd,\n};\n\ntype HorizontalCellSizes = 's' | 'm' | 'l' | 'xl' | 'auto';\n\nexport interface HorizontalCellProps\n  extends Omit<TappableProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Ширина компонента.\n   *\n   * Значения `'s' | 'm' | 'l' | 'xl'` определяются дизайн-системой.\n   * Значение `auto` позволяет задать динамическую ширину, определяемую контентом.\n   * Пользовательскую ширину можно задать через числовое значение.\n   */\n  size?: LiteralUnion<HorizontalCellSizes, number>;\n  /**\n   * Заголовок.\n   */\n  title?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Задает выравнивание типографики. По умолчанию `center` для `size=s`, иначе `start`.\n   */\n  textAlign?: 'start' | 'center' | 'end';\n  /**\n   * Отключает формирование отступов у крайних элементов.\n   *\n   * Актуально для использования в многострочных списках.\n   */\n  noPadding?: boolean;\n  /**\n   * Позволяет передать типографический компонент, используемый для `title`.\n   * По умолчанию `Caption` для `size=s`, иначе `Subhead`.\n   */\n  TitleComponent?: React.ElementType;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  title,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  textAlign = size === 's' ? 'center' : 'start',\n  noPadding = false,\n  TitleComponent = size === 's' ? Caption : Subhead,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  const hasTypography =\n    hasReactNode(title) || hasReactNode(subtitle) || hasReactNode(extraSubtitle);\n\n  const customProperties: CSSCustomProperties | undefined =\n    typeof size === 'number' ? { [CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH]: `${size}px` } : undefined;\n\n  return (\n    <div\n      ref={getRootRef}\n      style={mergeStyle(customProperties, style)}\n      className={classNames(\n        styles.host,\n        typeof size === 'string' && stylesSize[size],\n        size !== 'auto' && styles.sized,\n        typeof size === 'number' && styles.customSize,\n        noPadding && styles.noPadding,\n        className,\n      )}\n    >\n      <Tappable className={styles.body} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && <div className={styles.image}>{children}</div>}\n        {hasTypography && (\n          <div\n            className={classNames(\n              styles.content,\n              textAlign !== 'start' && textAlignClassNames[textAlign],\n            )}\n          >\n            {hasReactNode(title) && <TitleComponent>{title}</TitleComponent>}\n            {hasReactNode(subtitle) && <Footnote className={styles.subtitle}>{subtitle}</Footnote>}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles.subtitle}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","mergeStyle","Avatar","Tappable","Caption","Footnote","Subhead","CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH","stylesSize","s","m","l","xl","auto","textAlignClassNames","center","end","HorizontalCell","className","title","style","subtitle","size","children","getRootRef","getRef","extraSubtitle","textAlign","noPadding","TitleComponent","restProps","hasTypography","customProperties","undefined","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,QAAQ,QAA4B,0BAAuB;AACpE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,OAAO,QAAQ,mCAAgC;AAGxD,OAAO,MAAMC,kCAAkC,8BAA8B;AAE7E,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;IACFC,IAAI;AACN;AAEA,MAAMC,sBAAsB;IAC1BC,MAAM;IACNC,GAAG;AACL;AA6CA;;CAEC,GACD,OAAO,MAAMC,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,OAAO,GAAG,EACVC,yBAAW,KAACrB;QAAOoB,MAAM;MAAM,EAC/BE,UAAU,EACVC,MAAM,EACNC,aAAa,EACbC,YAAYL,SAAS,MAAM,WAAW,OAAO,EAC7CM,YAAY,KAAK,EACjBC,iBAAiBP,SAAS,MAAMlB,UAAUE,OAAO,EAE7B,WADjBwB;QAZHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,gBACJ/B,aAAamB,UAAUnB,aAAaqB,aAAarB,aAAa0B;IAEhE,MAAMM,mBACJ,OAAOV,SAAS,WAAW;QAAE,CAACf,gCAAgC,EAAE,GAAGe,KAAK,EAAE,CAAC;IAAC,IAAIW;IAElF,qBACE,KAACC;QACCC,KAAKX;QACLJ,OAAOnB,WAAW+B,kBAAkBZ;QACpCF,WAAWnB,uCAET,OAAOuB,SAAS,YAAYd,UAAU,CAACc,KAAK,EAC5CA,SAAS,uCACT,OAAOA,SAAS,8CAChBM,8CACAV;kBAGF,cAAA,MAACf;YAASe,SAAS;YAAeM,YAAYC;WAAYK;;gBACvD9B,aAAauB,2BAAa,KAACW;oBAAIhB,SAAS;8BAAiBK;;gBACzDQ,+BACC,MAACG;oBACChB,WAAWnB,0CAET4B,cAAc,WAAWb,mBAAmB,CAACa,UAAU;;wBAGxD3B,aAAamB,wBAAU,KAACU;sCAAgBV;;wBACxCnB,aAAaqB,2BAAa,KAAChB;4BAASa,SAAS;sCAAoBG;;wBACjErB,aAAa0B,gCACZ,KAACrB;4BAASa,SAAS;sCAAoBQ;;;;;;;AAOrD,EAAE"}
+{"version":3,"sources":["../../../src/components/HorizontalCell/HorizontalCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HasRef, HasRootRef, LiteralUnion } from '../../types';\nimport { Avatar } from '../Avatar/Avatar';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Subhead } from '../Typography/Subhead/Subhead';\nimport styles from './HorizontalCell.module.css';\n\nexport const CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH = '--vkui_internal--cell_width';\n\nconst stylesSize = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n  l: styles.sizeL,\n  xl: styles.sizeXL,\n  auto: styles.sizeAuto,\n};\n\nconst textAlignClassNames = {\n  center: styles.textAlignCenter,\n  end: styles.textAlignEnd,\n};\n\ntype HorizontalCellSizes = 's' | 'm' | 'l' | 'xl' | 'auto';\n\nexport interface HorizontalCellProps\n  extends Omit<TappableOmitProps, 'size' | 'getRootRef' | 'title' | 'borderRadiusMode'>,\n    HasRootRef<HTMLDivElement>,\n    HasRef<HTMLDivElement> {\n  /**\n   * Ширина компонента.\n   *\n   * Значения `'s' | 'm' | 'l' | 'xl'` определяются дизайн-системой.\n   * Значение `auto` позволяет задать динамическую ширину, определяемую контентом.\n   * Пользовательскую ширину можно задать через числовое значение.\n   */\n  size?: LiteralUnion<HorizontalCellSizes, number>;\n  /**\n   * Заголовок.\n   */\n  title?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children`.\n   */\n  subtitle?: React.ReactNode;\n  /**\n   * Дополнительная строка текста под `children` и `subtitle`.\n   */\n  extraSubtitle?: React.ReactNode;\n  /**\n   * Задает выравнивание типографики. По умолчанию `center` для `size=s`, иначе `start`.\n   */\n  textAlign?: 'start' | 'center' | 'end';\n  /**\n   * Отключает формирование отступов у крайних элементов.\n   *\n   * Актуально для использования в многострочных списках.\n   */\n  noPadding?: boolean;\n  /**\n   * Позволяет передать типографический компонент, используемый для `title`.\n   * По умолчанию `Caption` для `size=s`, иначе `Subhead`.\n   */\n  TitleComponent?: React.ElementType;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/HorizontalCell\n */\nexport const HorizontalCell = ({\n  className,\n  title,\n  style,\n  subtitle,\n  size = 's',\n  children = <Avatar size={56} />,\n  getRootRef,\n  getRef,\n  extraSubtitle,\n  textAlign = size === 's' ? 'center' : 'start',\n  noPadding = false,\n  TitleComponent = size === 's' ? Caption : Subhead,\n  ...restProps\n}: HorizontalCellProps): React.ReactNode => {\n  const hasTypography =\n    hasReactNode(title) || hasReactNode(subtitle) || hasReactNode(extraSubtitle);\n\n  const customProperties: CSSCustomProperties | undefined =\n    typeof size === 'number' ? { [CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH]: `${size}px` } : undefined;\n\n  return (\n    <div\n      ref={getRootRef}\n      style={mergeStyle(customProperties, style)}\n      className={classNames(\n        styles.host,\n        typeof size === 'string' && stylesSize[size],\n        size !== 'auto' && styles.sized,\n        typeof size === 'number' && styles.customSize,\n        noPadding && styles.noPadding,\n        className,\n      )}\n    >\n      <Tappable className={styles.body} getRootRef={getRef} {...restProps}>\n        {hasReactNode(children) && <div className={styles.image}>{children}</div>}\n        {hasTypography && (\n          <div\n            className={classNames(\n              styles.content,\n              textAlign !== 'start' && textAlignClassNames[textAlign],\n            )}\n          >\n            {hasReactNode(title) && <TitleComponent>{title}</TitleComponent>}\n            {hasReactNode(subtitle) && <Footnote className={styles.subtitle}>{subtitle}</Footnote>}\n            {hasReactNode(extraSubtitle) && (\n              <Footnote className={styles.subtitle}>{extraSubtitle}</Footnote>\n            )}\n          </div>\n        )}\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["React","classNames","hasReactNode","mergeStyle","Avatar","Tappable","Caption","Footnote","Subhead","CUSTOM_CSS_TOKEN_FOR_CELL_WIDTH","stylesSize","s","m","l","xl","auto","textAlignClassNames","center","end","HorizontalCell","className","title","style","subtitle","size","children","getRootRef","getRef","extraSubtitle","textAlign","noPadding","TitleComponent","restProps","hasTypography","customProperties","undefined","div","ref"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,MAAM,QAAQ,sBAAmB;AAC1C,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,OAAO,QAAQ,mCAAgC;AAGxD,OAAO,MAAMC,kCAAkC,8BAA8B;AAE7E,MAAMC,aAAa;IACjBC,CAAC;IACDC,CAAC;IACDC,CAAC;IACDC,EAAE;IACFC,IAAI;AACN;AAEA,MAAMC,sBAAsB;IAC1BC,MAAM;IACNC,GAAG;AACL;AA6CA;;CAEC,GACD,OAAO,MAAMC,iBAAiB;QAAC,EAC7BC,SAAS,EACTC,KAAK,EACLC,KAAK,EACLC,QAAQ,EACRC,OAAO,GAAG,EACVC,yBAAW,KAACrB;QAAOoB,MAAM;MAAM,EAC/BE,UAAU,EACVC,MAAM,EACNC,aAAa,EACbC,YAAYL,SAAS,MAAM,WAAW,OAAO,EAC7CM,YAAY,KAAK,EACjBC,iBAAiBP,SAAS,MAAMlB,UAAUE,OAAO,EAE7B,WADjBwB;QAZHZ;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,gBACJ/B,aAAamB,UAAUnB,aAAaqB,aAAarB,aAAa0B;IAEhE,MAAMM,mBACJ,OAAOV,SAAS,WAAW;QAAE,CAACf,gCAAgC,EAAE,GAAGe,KAAK,EAAE,CAAC;IAAC,IAAIW;IAElF,qBACE,KAACC;QACCC,KAAKX;QACLJ,OAAOnB,WAAW+B,kBAAkBZ;QACpCF,WAAWnB,uCAET,OAAOuB,SAAS,YAAYd,UAAU,CAACc,KAAK,EAC5CA,SAAS,uCACT,OAAOA,SAAS,8CAChBM,8CACAV;kBAGF,cAAA,MAACf;YAASe,SAAS;YAAeM,YAAYC;WAAYK;;gBACvD9B,aAAauB,2BAAa,KAACW;oBAAIhB,SAAS;8BAAiBK;;gBACzDQ,+BACC,MAACG;oBACChB,WAAWnB,0CAET4B,cAAc,WAAWb,mBAAmB,CAACa,UAAU;;wBAGxD3B,aAAamB,wBAAU,KAACU;sCAAgBV;;wBACxCnB,aAAaqB,2BAAa,KAAChB;4BAASa,SAAS;sCAAoBG;;wBACjErB,aAAa0B,gCACZ,KAACrB;4BAASa,SAAS;sCAAoBQ;;;;;;;AAOrD,EAAE"}

package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.d.ts

@@ -1,8 +1,8 @@
 import type { HasRef, HasRootRef, LiteralUnion } from '../../../types';
 import type { ImageBaseSize } from '../../ImageBase/ImageBase';
-import { type TappableProps } from '../../Tappable/Tappable';
+import { type TappableOmitProps } from '../../Tappable/Tappable';
 import { type SubheadProps } from '../../Typography/Subhead/Subhead';
-export interface HorizontalCellShowMoreProps extends Omit<TappableProps, 'getRootRef' | 'size' | 'borderRadiusMode'>, HasRef<HTMLElement>, HasRootRef<HTMLDivElement> {
+export interface HorizontalCellShowMoreProps extends Omit<TappableOmitProps, 'getRootRef' | 'size' | 'borderRadiusMode'>, HasRef<HTMLElement>, HasRootRef<HTMLDivElement> {
     /**
      * Задаёт высоту компонента. Должeн соответствовать размеру картинок
      * внутри соседних `HorizontalCell` компонентов.

package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACvE,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAQ9E,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,aAAa,EAAE,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAC,EACrE,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;;OAIG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,sBAAsB,GAAI,0FAUpC,2BAA2B,KAAG,KAAK,CAAC,SA4BtC,CAAC"}
+{"version":3,"file":"HorizontalCellShowMore.d.ts","sourceRoot":"","sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACvE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAQ9E,MAAM,WAAW,2BACf,SAAQ,IAAI,CAAC,iBAAiB,EAAE,YAAY,GAAG,MAAM,GAAG,kBAAkB,CAAC,EACzE,MAAM,CAAC,WAAW,CAAC,EACnB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC7C;;;;OAIG;IACH,IAAI,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;IACjB;;;SAGK;IACL,QAAQ,CAAC,EAAE,YAAY,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,sBAAsB,GAAI,0FAUpC,2BAA2B,KAAG,KAAK,CAAC,SA4BtC,CAAC"}

package/dist/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, type TappableProps } from '../../Tappable/Tappable';\nimport { Subhead, type SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableProps, 'getRootRef' | 'size' | 'borderRadiusMode'>,\n    HasRef<HTMLElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт высоту компонента. Должeн соответствовать размеру картинок\n   * внутри соседних `HorizontalCell` компонентов.\n   *\n   * Используйте размеры, заданные дизайн-системой (смотри типы).\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   *\n   * Игнорируется, если `size='s'`.\n   */\n  height?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Задаёт размер компонента.\n   *\n   * Значение `s` применяется для `<HorizontalCell size=\"s\"`, в остальных случаях рекомендуется `m`.\n   */\n  size?: 's' | 'm';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все`, для `size='m'` - `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Выравнивание по центру относительно родителя.\n   */\n  centered?: boolean;\n}\n\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles.host,\n        centered && styles.centered,\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles.body}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle className={styles.icon} />\n\n        <Subhead className={styles.text} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","HorizontalCellShowMore","className","style","getRef","getRootRef","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAA4B,6BAA0B;AACvE,SAASC,OAAO,QAA2B,sCAAmC;AAG9E,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAkCA,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCR,OAAOA;QACPD,WAAWP,+CAETc,oDACAX,cAAc,CAACS,KAAK,EACpBL;QAEFU,KAAKP;kBAEL,cAAA,MAACT;YACCO,OAAOI,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CJ,SAAS;YACTG,YAAYD;YACZU,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAChB;oBAAyBQ,SAAS;;8BAEnC,KAACL;oBAAQK,SAAS;oBAAec,QAAO;8BACrCR;;;;;AAKX,EAAE"}
+{"version":3,"sources":["../../../../src/components/HorizontalScroll/HorizontalCellShowMore/HorizontalCellShowMore.tsx"],"sourcesContent":["import { Icon28ChevronRightCircle } from '@vkontakte/icons';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRef, HasRootRef, LiteralUnion } from '../../../types';\nimport type { ImageBaseSize } from '../../ImageBase/ImageBase';\nimport { Tappable, type TappableOmitProps } from '../../Tappable/Tappable';\nimport { Subhead, type SubheadProps } from '../../Typography/Subhead/Subhead';\nimport styles from './HorizontalCellShowMore.module.css';\n\nconst sizeClassNames = {\n  s: styles.sizeS,\n  m: styles.sizeM,\n};\n\nexport interface HorizontalCellShowMoreProps\n  extends Omit<TappableOmitProps, 'getRootRef' | 'size' | 'borderRadiusMode'>,\n    HasRef<HTMLElement>,\n    HasRootRef<HTMLDivElement> {\n  /**\n   * Задаёт высоту компонента. Должeн соответствовать размеру картинок\n   * внутри соседних `HorizontalCell` компонентов.\n   *\n   * Используйте размеры, заданные дизайн-системой (смотри типы).\n   *\n   * > ⚠️ Использование кастомного размера – это пограничный кейс.\n   *\n   * Игнорируется, если `size='s'`.\n   */\n  height?: LiteralUnion<ImageBaseSize, number>;\n  /**\n   * Задаёт размер компонента.\n   *\n   * Значение `s` применяется для `<HorizontalCell size=\"s\"`, в остальных случаях рекомендуется `m`.\n   */\n  size?: 's' | 'm';\n  /**\n   * Предназначен для отрисовки текста.\n   * По умолчанию для `size='s'` содержит текст `Все`, для `size='m'` - `Показать все`.\n   * */\n  children?: SubheadProps['children'];\n  /**\n   * Выравнивание по центру относительно родителя.\n   */\n  centered?: boolean;\n}\n\nexport const HorizontalCellShowMore = ({\n  className,\n  style,\n  getRef,\n  getRootRef,\n  height,\n  size = 's',\n  children = size === 's' ? 'Все' : 'Показать все',\n  centered = false,\n  ...restProps\n}: HorizontalCellShowMoreProps): React.ReactNode => {\n  return (\n    <div\n      style={style}\n      className={classNames(\n        styles.host,\n        centered && styles.centered,\n        sizeClassNames[size],\n        className,\n      )}\n      ref={getRootRef}\n    >\n      <Tappable\n        style={size === 's' ? undefined : { height }}\n        className={styles.body}\n        getRootRef={getRef}\n        activeMode=\"opacity\"\n        hoverMode=\"opacity\"\n        {...restProps}\n      >\n        <Icon28ChevronRightCircle className={styles.icon} />\n\n        <Subhead className={styles.text} weight=\"2\">\n          {children}\n        </Subhead>\n      </Tappable>\n    </div>\n  );\n};\n"],"names":["Icon28ChevronRightCircle","classNames","Tappable","Subhead","sizeClassNames","s","m","HorizontalCellShowMore","className","style","getRef","getRootRef","height","size","children","centered","restProps","div","ref","undefined","activeMode","hoverMode","weight"],"mappings":";;;;AAAA,SAASA,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,QAAQ,QAAgC,6BAA0B;AAC3E,SAASC,OAAO,QAA2B,sCAAmC;AAG9E,MAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAkCA,OAAO,MAAMC,yBAAyB;QAAC,EACrCC,SAAS,EACTC,KAAK,EACLC,MAAM,EACNC,UAAU,EACVC,MAAM,EACNC,OAAO,GAAG,EACVC,WAAWD,SAAS,MAAM,QAAQ,cAAc,EAChDE,WAAW,KAAK,EAEY,WADzBC;QARHR;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,KAACE;QACCR,OAAOA;QACPD,WAAWP,+CAETc,oDACAX,cAAc,CAACS,KAAK,EACpBL;QAEFU,KAAKP;kBAEL,cAAA,MAACT;YACCO,OAAOI,SAAS,MAAMM,YAAY;gBAAEP;YAAO;YAC3CJ,SAAS;YACTG,YAAYD;YACZU,YAAW;YACXC,WAAU;WACNL;;8BAEJ,KAAChB;oBAAyBQ,SAAS;;8BAEnC,KAACL;oBAAQK,SAAS;oBAAec,QAAO;8BACrCR;;;;;AAKX,EAAE"}

package/dist/components/IconButton/IconButton.d.ts

@@ -1,5 +1,5 @@
-import { type TappableProps } from '../Tappable/Tappable';
-export interface IconButtonProps extends TappableProps {
+import { type TappableOmitProps } from '../Tappable/Tappable';
+export interface IconButtonProps extends TappableOmitProps {
     /**
      * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AASpE,MAAM,WAAW,eAAgB,SAAQ,aAAa;IACpD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAID;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,mCAAmC,eAAe,KAAG,KAAK,CAAC,SAgCrF,CAAC"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../src/components/IconButton/IconButton.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AASxE,MAAM,WAAW,eAAgB,SAAQ,iBAAiB;IACxD;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAID;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,mCAAmC,eAAe,KAAG,KAAK,CAAC,SAgCrF,CAAC"}

package/dist/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasAccessibleName } from '../../lib/accessibility';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n} as const;\n\nexport interface IconButtonProps extends TappableProps {\n  /**\n   * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий.\n   */\n  label?: string;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({ label, children, ...restProps }: IconButtonProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    /* istanbul ignore next: проверка в dev mode, тест на hasAccessibleName() есть в lib/accessibility.test.tsx */\n    const isAccessible = hasAccessibleName({\n      children: [children, label],\n      ...restProps,\n    });\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        platform === 'ios' && styles.ios,\n      )}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["classNames","useAdaptivity","usePlatform","hasAccessibleName","COMMON_WARNINGS","warnOnce","Tappable","VisuallyHidden","sizeYClassNames","none","compact","warn","IconButton","label","children","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component","baseClassName"],"mappings":"AAAA;;;;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,iBAAiB,QAAQ,6BAA0B;AAC5D,SAASC,eAAe,EAAEC,QAAQ,QAAQ,wBAAqB;AAC/D,SAASC,QAAQ,QAA4B,0BAAuB;AACpE,SAASC,cAAc,QAAQ,sCAAmC;AAGlE,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AASA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,aAAa;QAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAiC,WAA5BC;QAApBF;QAAOC;;IAClC,MAAME,WAAWd;IACjB,MAAM,EAAEe,QAAQ,MAAM,EAAE,GAAGhB;IAE3B,IAAIiB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,4GAA4G,GAC5G,MAAMC,eAAelB,kBAAkB;YACrCW,UAAU;gBAACA;gBAAUD;aAAM;WACxBE;QAGL,IAAI,CAACM,cAAc;YACjBV,KAAKP,gBAAgBkB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,cAAc,EAAE;QAC3E;IACF;IAEA,qBACE,MAACjB;QACCkB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM;OAC9BR;QACJY,eAAe3B,mCAEbiB,UAAU,aAAaT,eAAe,CAACS,MAAM,EAC7CD,aAAa;;YAGdH,uBAAS,KAACN;0BAAgBM;;YAC1BC;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["'use client';\n\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { usePlatform } from '../../hooks/usePlatform';\nimport { hasAccessibleName } from '../../lib/accessibility';\nimport { COMMON_WARNINGS, warnOnce } from '../../lib/warnOnce';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './IconButton.module.css';\n\nconst sizeYClassNames = {\n  none: styles.sizeYNone,\n  compact: styles.sizeYCompact,\n} as const;\n\nexport interface IconButtonProps extends TappableOmitProps {\n  /**\n   * Текст кнопки-иконки. Делает ее доступной для ассистивных технологий.\n   */\n  label?: string;\n}\n\nconst warn = warnOnce('IconButton');\n\n/**\n * @see https://vkcom.github.io/VKUI/#/IconButton\n */\nexport const IconButton = ({ label, children, ...restProps }: IconButtonProps): React.ReactNode => {\n  const platform = usePlatform();\n  const { sizeY = 'none' } = useAdaptivity();\n\n  if (process.env.NODE_ENV === 'development') {\n    /* istanbul ignore next: проверка в dev mode, тест на hasAccessibleName() есть в lib/accessibility.test.tsx */\n    const isAccessible = hasAccessibleName({\n      children: [children, label],\n      ...restProps,\n    });\n\n    if (!isAccessible) {\n      warn(COMMON_WARNINGS.a11y[restProps.href ? 'link-name' : 'button-name'], 'error');\n    }\n  }\n\n  return (\n    <Tappable\n      activeEffectDelay={200}\n      activeMode=\"background\"\n      Component={restProps.href ? 'a' : 'button'}\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        sizeY !== 'regular' && sizeYClassNames[sizeY],\n        platform === 'ios' && styles.ios,\n      )}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["classNames","useAdaptivity","usePlatform","hasAccessibleName","COMMON_WARNINGS","warnOnce","Tappable","VisuallyHidden","sizeYClassNames","none","compact","warn","IconButton","label","children","restProps","platform","sizeY","process","env","NODE_ENV","isAccessible","a11y","href","activeEffectDelay","activeMode","Component","baseClassName"],"mappings":"AAAA;;;;;AAEA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,WAAW,QAAQ,6BAA0B;AACtD,SAASC,iBAAiB,QAAQ,6BAA0B;AAC5D,SAASC,eAAe,EAAEC,QAAQ,QAAQ,wBAAqB;AAC/D,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAGlE,MAAMC,kBAAkB;IACtBC,IAAI;IACJC,OAAO;AACT;AASA,MAAMC,OAAON,SAAS;AAEtB;;CAEC,GACD,OAAO,MAAMO,aAAa;QAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAiC,WAA5BC;QAApBF;QAAOC;;IAClC,MAAME,WAAWd;IACjB,MAAM,EAAEe,QAAQ,MAAM,EAAE,GAAGhB;IAE3B,IAAIiB,QAAQC,GAAG,CAACC,QAAQ,KAAK,eAAe;QAC1C,4GAA4G,GAC5G,MAAMC,eAAelB,kBAAkB;YACrCW,UAAU;gBAACA;gBAAUD;aAAM;WACxBE;QAGL,IAAI,CAACM,cAAc;YACjBV,KAAKP,gBAAgBkB,IAAI,CAACP,UAAUQ,IAAI,GAAG,cAAc,cAAc,EAAE;QAC3E;IACF;IAEA,qBACE,MAACjB;QACCkB,mBAAmB;QACnBC,YAAW;QACXC,WAAWX,UAAUQ,IAAI,GAAG,MAAM;OAC9BR;QACJY,eAAe3B,mCAEbiB,UAAU,aAAaT,eAAe,CAACS,MAAM,EAC7CD,aAAa;;YAGdH,uBAAS,KAACN;0BAAgBM;;YAC1BC;;;AAGP,EAAE"}

package/dist/components/InputLike/InputLike.d.ts

@@ -6,5 +6,5 @@ export interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {
     label?: string;
     onElementSelect?: (index: number) => void;
 }
-export declare const InputLike: ({ value, length, index, onElementSelect, onClick, onFocus, label, ...restProps }: InputLikeProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InputLike: ({ value, length, index, onElementSelect, onFocus, label, readOnly, onKeyDown, ...restProps }: InputLikeProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=InputLike.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"InputLike.d.ts","sourceRoot":"","sources":["../../../src/components/InputLike/InputLike.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAIxF,MAAM,WAAW,cAAe,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IACzE,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAgBD,eAAO,MAAM,SAAS,GAAI,kFASvB,cAAc,4CA4BhB,CAAC"}
+{"version":3,"file":"InputLike.d.ts","sourceRoot":"","sources":["../../../src/components/InputLike/InputLike.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAiB,KAAK,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAIxF,MAAM,WAAW,cAAe,SAAQ,kBAAkB,CAAC,eAAe,CAAC;IACzE,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAgBD,eAAO,MAAM,SAAS,GAAI,8FAUvB,cAAc,4CA4BhB,CAAC"}

package/dist/components/InputLike/InputLike.js

@@ -20,14 +20,15 @@ function getMaskElements(length) {
     return result;
 }
 export const InputLike = (_param)=>{
-    var { value, length, index, onElementSelect, onClick, onFocus, label } = _param, restProps = _object_without_properties(_param, [
+    var { value, length, index, onElementSelect, onFocus, label, readOnly, onKeyDown } = _param, restProps = _object_without_properties(_param, [
         "value",
         "length",
         "index",
         "onElementSelect",
-        "onClick",
         "onFocus",
-        "label"
+        "label",
+        "readOnly",
+        "onKeyDown"
     ]);
     const handleElementSelect = React.useCallback((event)=>{
         stopPropagation(event);
@@ -40,9 +41,9 @@ export const InputLike = (_param)=>{
     return /*#__PURE__*/ _jsxs(RootComponent, _object_spread_props(_object_spread({
         Component: "span",
         baseClassName: (value === null || value === void 0 ? void 0 : value.length) === length ? "vkuiInputLike__host" : undefined,
-        tabIndex: 0,
-        onClick: onClick,
-        onFocus: callMultiple(onFocus, handleElementSelect)
+        tabIndex: readOnly ? -1 : 0,
+        onFocus: callMultiple(onFocus, handleElementSelect),
+        onKeyDown: readOnly ? undefined : onKeyDown
     }, restProps), {
         children: [
             label && /*#__PURE__*/ _jsx(VisuallyHidden, {

package/dist/components/InputLike/InputLike.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { RootComponent, type RootComponentProps } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  label?: string;\n  onElementSelect?: (index: number) => void;\n}\n\nconst MASK_SYMBOL = String.fromCharCode(0x2007);\n\nfunction getMaskElements(length: number) {\n  const result = [];\n  for (let index = 0; index < length; index += 1) {\n    result.push(\n      <span key={index} className={styles.mask}>\n        {MASK_SYMBOL}\n      </span>,\n    );\n  }\n  return result;\n}\n\nexport const InputLike = ({\n  value,\n  length,\n  index,\n  onElementSelect,\n  onClick,\n  onFocus,\n  label,\n  ...restProps\n}: InputLikeProps) => {\n  const handleElementSelect = React.useCallback(\n    (event: React.MouseEvent<HTMLSpanElement>) => {\n      stopPropagation(event);\n      onElementSelect?.(index);\n    },\n    [index, onElementSelect],\n  );\n\n  return (\n    <RootComponent\n      Component=\"span\"\n      baseClassName={value?.length === length ? styles.host : undefined}\n      tabIndex={0}\n      onClick={onClick}\n      onFocus={callMultiple(onFocus, handleElementSelect)}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {value?.slice(0, length - 1)}\n      {value?.slice(length - 1) && (\n        <span key={index} className={styles.lastCharacter}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </RootComponent>\n  );\n};\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","className","InputLike","value","onElementSelect","onClick","onFocus","label","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice"],"mappings":"AAAA;;;;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,aAAa,QAAiC,oCAAiC;AACxF,SAASC,cAAc,QAAQ,sCAAmC;AAWlE,MAAMC,cAAcC,OAAOC,YAAY,CAAC;AAExC,SAASC,gBAAgBC,MAAc;IACrC,MAAMC,SAAS,EAAE;IACjB,IAAK,IAAIC,QAAQ,GAAGA,QAAQF,QAAQE,SAAS,EAAG;QAC9CD,OAAOE,IAAI,eACT,KAACC;YAAiBC,SAAS;sBACxBT;WADQM;IAIf;IACA,OAAOD;AACT;AAEA,OAAO,MAAMK,YAAY;QAAC,EACxBC,KAAK,EACLP,MAAM,EACNE,KAAK,EACLM,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,KAAK,EAEU,WADZC;QAPHL;QACAP;QACAE;QACAM;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBtB,MAAMuB,WAAW,CAC3C,CAACC;QACCtB,gBAAgBsB;QAChBP,4BAAAA,sCAAAA,gBAAkBN;IACpB,GACA;QAACA;QAAOM;KAAgB;QAmBKD;IAhB/B,qBACE,MAACb;QACCsB,WAAU;QACVC,eAAeV,CAAAA,kBAAAA,4BAAAA,MAAOP,MAAM,MAAKA,iCAAuBkB;QACxDC,UAAU;QACVV,SAASA;QACTC,SAASlB,aAAakB,SAASG;OAC3BD;;YAEHD,uBAAS,KAAChB;0BAAgBgB;;YAC1BJ,kBAAAA,4BAAAA,MAAOa,KAAK,CAAC,GAAGpB,SAAS;YACzBO,CAAAA,kBAAAA,4BAAAA,MAAOa,KAAK,CAACpB,SAAS,qBACrB,KAACI;gBAAiBC,SAAS;0BACxBE,MAAMa,KAAK,CAACpB,SAAS;eADbE;YAIZH,gBAAgBC,SAAUO,CAAAA,CAAAA,gBAAAA,kBAAAA,4BAAAA,MAAOP,MAAM,cAAbO,2BAAAA,gBAAiB,CAAA;;;AAGlD,EAAE"}
+{"version":3,"sources":["../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["'use client';\n/* eslint-disable jsdoc/require-jsdoc */\n\nimport * as React from 'react';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { stopPropagation } from '../../lib/utils';\nimport { RootComponent, type RootComponentProps } from '../RootComponent/RootComponent';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './InputLike.module.css';\n\nexport interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {\n  length: number;\n  index: number;\n  value?: string;\n  label?: string;\n  onElementSelect?: (index: number) => void;\n}\n\nconst MASK_SYMBOL = String.fromCharCode(0x2007);\n\nfunction getMaskElements(length: number) {\n  const result = [];\n  for (let index = 0; index < length; index += 1) {\n    result.push(\n      <span key={index} className={styles.mask}>\n        {MASK_SYMBOL}\n      </span>,\n    );\n  }\n  return result;\n}\n\nexport const InputLike = ({\n  value,\n  length,\n  index,\n  onElementSelect,\n  onFocus,\n  label,\n  readOnly,\n  onKeyDown,\n  ...restProps\n}: InputLikeProps) => {\n  const handleElementSelect = React.useCallback(\n    (event: React.MouseEvent<HTMLSpanElement>) => {\n      stopPropagation(event);\n      onElementSelect?.(index);\n    },\n    [index, onElementSelect],\n  );\n\n  return (\n    <RootComponent\n      Component=\"span\"\n      baseClassName={value?.length === length ? styles.host : undefined}\n      tabIndex={readOnly ? -1 : 0}\n      onFocus={callMultiple(onFocus, handleElementSelect)}\n      onKeyDown={readOnly ? undefined : onKeyDown}\n      {...restProps}\n    >\n      {label && <VisuallyHidden>{label}</VisuallyHidden>}\n      {value?.slice(0, length - 1)}\n      {value?.slice(length - 1) && (\n        <span key={index} className={styles.lastCharacter}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </RootComponent>\n  );\n};\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","className","InputLike","value","onElementSelect","onFocus","label","readOnly","onKeyDown","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice"],"mappings":"AAAA;;;;;AACA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,4BAAyB;AACtD,SAASC,eAAe,QAAQ,qBAAkB;AAClD,SAASC,aAAa,QAAiC,oCAAiC;AACxF,SAASC,cAAc,QAAQ,sCAAmC;AAWlE,MAAMC,cAAcC,OAAOC,YAAY,CAAC;AAExC,SAASC,gBAAgBC,MAAc;IACrC,MAAMC,SAAS,EAAE;IACjB,IAAK,IAAIC,QAAQ,GAAGA,QAAQF,QAAQE,SAAS,EAAG;QAC9CD,OAAOE,IAAI,eACT,KAACC;YAAiBC,SAAS;sBACxBT;WADQM;IAIf;IACA,OAAOD;AACT;AAEA,OAAO,MAAMK,YAAY;QAAC,EACxBC,KAAK,EACLP,MAAM,EACNE,KAAK,EACLM,eAAe,EACfC,OAAO,EACPC,KAAK,EACLC,QAAQ,EACRC,SAAS,EAEM,WADZC;QARHN;QACAP;QACAE;QACAM;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBvB,MAAMwB,WAAW,CAC3C,CAACC;QACCvB,gBAAgBuB;QAChBR,4BAAAA,sCAAAA,gBAAkBN;IACpB,GACA;QAACA;QAAOM;KAAgB;QAmBKD;IAhB/B,qBACE,MAACb;QACCuB,WAAU;QACVC,eAAeX,CAAAA,kBAAAA,4BAAAA,MAAOP,MAAM,MAAKA,iCAAuBmB;QACxDC,UAAUT,WAAW,CAAC,IAAI;QAC1BF,SAASjB,aAAaiB,SAASK;QAC/BF,WAAWD,WAAWQ,YAAYP;OAC9BC;;YAEHH,uBAAS,KAACf;0BAAgBe;;YAC1BH,kBAAAA,4BAAAA,MAAOc,KAAK,CAAC,GAAGrB,SAAS;YACzBO,CAAAA,kBAAAA,4BAAAA,MAAOc,KAAK,CAACrB,SAAS,qBACrB,KAACI;gBAAiBC,SAAS;0BACxBE,MAAMc,KAAK,CAACrB,SAAS;eADbE;YAIZH,gBAAgBC,SAAUO,CAAAA,CAAAA,gBAAAA,kBAAAA,4BAAAA,MAAOP,MAAM,cAAbO,2BAAAA,gBAAiB,CAAA;;;AAGlD,EAAE"}

package/dist/components/Link/Link.d.ts

@@ -1,6 +1,6 @@
 import type { ReactElement } from 'react';
-import { type TappableProps } from '../Tappable/Tappable';
-export interface LinkProps extends TappableProps {
+import { type TappableOmitProps } from '../Tappable/Tappable';
+export interface LinkProps extends TappableOmitProps {
     /**
      * Иконка слева.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAGpE,MAAM,WAAW,SAAU,SAAQ,aAAa;IAC9C;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,GAAI,2FAOlB,SAAS,KAAG,KAAK,CAAC,SAqBpB,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/components/Link/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAGxE,MAAM,WAAW,SAAU,SAAQ,iBAAiB;IAClD;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,IAAI,GAAI,2FAOlB,SAAS,KAAG,KAAK,CAAC,SAsBpB,CAAC"}

package/dist/components/Link/Link.js

@@ -25,7 +25,8 @@ import { Tappable } from "../Tappable/Tappable.js";
     return /*#__PURE__*/ _jsxs(Tappable, _object_spread_props(_object_spread({
         activeMode: "opacity",
         hoverMode: "vkuiLink__hover",
-        focusVisibleMode: "outside"
+        focusVisibleMode: "outside",
+        DefaultComponent: "span"
     }, restProps), {
         baseClassName: classNames("vkuiLink__host", hasVisited && "vkuiLink__hasVisited", !noUnderline && "vkuiLink__withUnderline"),
         children: [

package/dist/components/Link/Link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableProps {\n  /**\n   * Иконка слева.\n   */\n  before?: ReactElement;\n  /**\n   * Иконка справа.\n   */\n  after?: ReactElement;\n  /**\n   * Выключает появления нижнего подчеркивания при наведении.\n   */\n  noUnderline?: boolean;\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет.\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({\n  before: beforeProp,\n  after: afterProp,\n  noUnderline,\n  hasVisited,\n  children,\n  ...restProps\n}: LinkProps): React.ReactNode => {\n  const before = beforeProp ? <span className={styles.before}>{beforeProp}</span> : null;\n  const after = afterProp ? <span className={styles.after}>{afterProp}</span> : null;\n\n  return (\n    <Tappable\n      activeMode=\"opacity\"\n      hoverMode={styles.hover}\n      focusVisibleMode=\"outside\"\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        hasVisited && styles.hasVisited,\n        !noUnderline && styles.withUnderline,\n      )}\n    >\n      {before}\n      {children}\n      {after}\n    </Tappable>\n  );\n};\n"],"names":["classNames","Tappable","Link","before","beforeProp","after","afterProp","noUnderline","hasVisited","children","restProps","span","className","activeMode","hoverMode","focusVisibleMode","baseClassName"],"mappings":";;;;AACA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAA4B,0BAAuB;AAsBpE;;CAEC,GACD,OAAO,MAAMC,OAAO;QAAC,EACnBC,QAAQC,UAAU,EAClBC,OAAOC,SAAS,EAChBC,WAAW,EACXC,UAAU,EACVC,QAAQ,EAEE,WADPC;QALHP;QACAE;QACAE;QACAC;QACAC;;IAGA,MAAMN,SAASC,2BAAa,KAACO;QAAKC,SAAS;kBAAkBR;SAAqB;IAClF,MAAMC,QAAQC,0BAAY,KAACK;QAAKC,SAAS;kBAAiBN;SAAoB;IAE9E,qBACE,MAACL;QACCY,YAAW;QACXC,SAAS;QACTC,kBAAiB;OACbL;QACJM,eAAehB,6BAEbQ,sCACA,CAACD;;YAGFJ;YACAM;YACAJ;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Link/Link.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport styles from './Link.module.css';\n\nexport interface LinkProps extends TappableOmitProps {\n  /**\n   * Иконка слева.\n   */\n  before?: ReactElement;\n  /**\n   * Иконка справа.\n   */\n  after?: ReactElement;\n  /**\n   * Выключает появления нижнего подчеркивания при наведении.\n   */\n  noUnderline?: boolean;\n  /**\n   * Включает состояние `visited`, которое позволяет пользователю понять посещал ли он ссылку или нет.\n   */\n  hasVisited?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Link\n */\nexport const Link = ({\n  before: beforeProp,\n  after: afterProp,\n  noUnderline,\n  hasVisited,\n  children,\n  ...restProps\n}: LinkProps): React.ReactNode => {\n  const before = beforeProp ? <span className={styles.before}>{beforeProp}</span> : null;\n  const after = afterProp ? <span className={styles.after}>{afterProp}</span> : null;\n\n  return (\n    <Tappable\n      activeMode=\"opacity\"\n      hoverMode={styles.hover}\n      focusVisibleMode=\"outside\"\n      DefaultComponent=\"span\"\n      {...restProps}\n      baseClassName={classNames(\n        styles.host,\n        hasVisited && styles.hasVisited,\n        !noUnderline && styles.withUnderline,\n      )}\n    >\n      {before}\n      {children}\n      {after}\n    </Tappable>\n  );\n};\n"],"names":["classNames","Tappable","Link","before","beforeProp","after","afterProp","noUnderline","hasVisited","children","restProps","span","className","activeMode","hoverMode","focusVisibleMode","DefaultComponent","baseClassName"],"mappings":";;;;AACA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,QAAQ,QAAgC,0BAAuB;AAsBxE;;CAEC,GACD,OAAO,MAAMC,OAAO;QAAC,EACnBC,QAAQC,UAAU,EAClBC,OAAOC,SAAS,EAChBC,WAAW,EACXC,UAAU,EACVC,QAAQ,EAEE,WADPC;QALHP;QACAE;QACAE;QACAC;QACAC;;IAGA,MAAMN,SAASC,2BAAa,KAACO;QAAKC,SAAS;kBAAkBR;SAAqB;IAClF,MAAMC,QAAQC,0BAAY,KAACK;QAAKC,SAAS;kBAAiBN;SAAoB;IAE9E,qBACE,MAACL;QACCY,YAAW;QACXC,SAAS;QACTC,kBAAiB;QACjBC,kBAAiB;OACbN;QACJO,eAAejB,6BAEbQ,sCACA,CAACD;;YAGFJ;YACAM;YACAJ;;;AAGP,EAAE"}

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

@@ -1 +1 @@
-{"version":3,"file":"MiniInfoCell.d.ts","sourceRoot":"","sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAkB7D,MAAM,WAAW,iBAAkB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAClF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE1C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEvC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,oEAQ1B,iBAAiB,KAAG,KAAK,CAAC,SA6B5B,CAAC"}
+{"version":3,"file":"MiniInfoCell.d.ts","sourceRoot":"","sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAiB7D,MAAM,WAAW,iBAAkB,SAAQ,yBAAyB,CAAC,cAAc,CAAC;IAClF;;;OAGG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEzB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAExB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,CAAC;IAE1C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,CAAC;IAEvC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;GAEG;AACH,eAAO,MAAM,YAAY,GAAI,oEAQ1B,iBAAiB,KAAG,KAAK,CAAC,SAyB5B,CAAC"}

package/dist/components/MiniInfoCell/MiniInfoCell.js

@@ -5,7 +5,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Icon16Chevron } from "@vkontakte/icons";
 import { classNames, hasReactNode } from "@vkontakte/vkjs";
-import { RootComponent } from "../RootComponent/RootComponent.js";
 import { Tappable } from "../Tappable/Tappable.js";
 import { Paragraph } from "../Typography/Paragraph/Paragraph.js";
 const stylesMode = {
@@ -53,13 +52,7 @@ const stylesTextWrap = {
             })
         ]
     });
-    return restProps.onClick ? /*#__PURE__*/ _jsx(Tappable, _object_spread_props(_object_spread({
-        Component: "div",
-        role: "button"
-    }, restProps), {
-        baseClassName: cellClasses,
-        children: cellContent
-    })) : /*#__PURE__*/ _jsx(RootComponent, _object_spread_props(_object_spread({}, restProps), {
+    return /*#__PURE__*/ _jsx(Tappable, _object_spread_props(_object_spread({}, restProps), {
         baseClassName: cellClasses,
         children: cellContent
     }));

package/dist/components/MiniInfoCell/MiniInfoCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nconst stylesMode = {\n  add: styles.modeAdd,\n  accent: styles.modeAccent,\n  more: styles.modeMore,\n};\n\nconst stylesTextWrap = {\n  nowrap: styles.textWrapNowrap,\n  full: styles.textWrapFull,\n  short: styles.textWrapShort,\n};\n\nexport interface MiniInfoCellProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`.\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью. В дизайне это свойство `multiline`.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при нажатии на ячейку.\n   */\n  chevron?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/MiniInfoCell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  chevron = false,\n  ...restProps\n}: MiniInfoCellProps): React.ReactNode => {\n  const cellClasses = classNames(\n    styles.host,\n    stylesTextWrap[textWrap],\n    mode !== 'base' && stylesMode[mode],\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      {hasReactNode(before) && <span className={styles.before}>{before}</span>}\n      <div className={styles.middle}>\n        <Paragraph className={styles.content} weight={mode === 'more' ? '2' : undefined}>\n          {children}\n        </Paragraph>\n        {chevron && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles.after}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return restProps.onClick ? (\n    <Tappable Component=\"div\" role=\"button\" {...restProps} baseClassName={cellClasses}>\n      {cellContent}\n    </Tappable>\n  ) : (\n    <RootComponent {...restProps} baseClassName={cellClasses}>\n      {cellContent}\n    </RootComponent>\n  );\n};\n"],"names":["React","Icon16Chevron","classNames","hasReactNode","RootComponent","Tappable","Paragraph","stylesMode","add","accent","more","stylesTextWrap","nowrap","full","short","MiniInfoCell","before","after","children","mode","textWrap","chevron","restProps","cellClasses","cellContent","Fragment","span","className","div","weight","undefined","onClick","Component","role","baseClassName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,aAAa,QAAQ,oCAAiC;AAC/D,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,SAAS,QAAQ,uCAAoC;AAG9D,MAAMC,aAAa;IACjBC,GAAG;IACHC,MAAM;IACNC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBC,MAAM;IACNC,IAAI;IACJC,KAAK;AACP;AAwCA;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,OAAO,MAAM,EACbC,WAAW,QAAQ,EACnBC,UAAU,KAAK,EAEG,WADfC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcrB,qCAElBS,cAAc,CAACS,SAAS,EACxBD,SAAS,UAAUZ,UAAU,CAACY,KAAK;IAGrC,MAAMK,4BACJ,MAACxB,MAAMyB,QAAQ;;YACZtB,aAAaa,yBAAW,KAACU;gBAAKC,SAAS;0BAAkBX;;0BAC1D,MAACY;gBAAID,SAAS;;kCACZ,KAACrB;wBAAUqB,SAAS;wBAAkBE,QAAQV,SAAS,SAAS,MAAMW;kCACnEZ;;oBAEFG,yBAAW,KAACpB;;;YAEdE,aAAac,wBAAU,KAACS;gBAAKC,SAAS;0BAAiBV;;;;IAI5D,OAAOK,UAAUS,OAAO,iBACtB,KAAC1B;QAAS2B,WAAU;QAAMC,MAAK;OAAaX;QAAWY,eAAeX;kBACnEC;wBAGH,KAACpB,uDAAkBkB;QAAWY,eAAeX;kBAC1CC;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/MiniInfoCell/MiniInfoCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Chevron } from '@vkontakte/icons';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { Paragraph } from '../Typography/Paragraph/Paragraph';\nimport styles from './MiniInfoCell.module.css';\n\nconst stylesMode = {\n  add: styles.modeAdd,\n  accent: styles.modeAccent,\n  more: styles.modeMore,\n};\n\nconst stylesTextWrap = {\n  nowrap: styles.textWrapNowrap,\n  full: styles.textWrapFull,\n  short: styles.textWrapShort,\n};\n\nexport interface MiniInfoCellProps extends HTMLAttributesWithRootRef<HTMLDivElement> {\n  /**\n   * Иконка слева.<br />\n   * Рекомендуется использовать иконки размера 20.\n   */\n  before?: React.ReactNode;\n\n  /**\n   * Содержимое справа.<br />\n   * `<UsersStack size=\"s\" />` или `<Avatar size={24} />`.\n   */\n  after?: React.ReactNode;\n\n  /**\n   * Тип ячейки:\n   *\n   * - `base` – базовая ячейка с серой иконкой и серым текстом.<br />\n   * В компонент можно передать `Link`, чтобы визуально сделать часть текста ссылкой.\n   * - `add` – тип ячейки, который показывает, что взаимодействие с ней должно вызывать действие добавления чего-то.\n   * - `more` – взаимодействие с такой ячейкой должно открывать какую-то подробную информацию.\n   */\n  mode?: 'base' | 'accent' | 'add' | 'more';\n\n  /**\n   * Тип отображения текста:\n   *\n   * - `nowrap` – в одну строку, текст не переносится и обрезается.\n   * - `short` – максимально отображается 3 строки, остальное обрезается.\n   * - `full` – текст отображается полностью. В дизайне это свойство `multiline`.\n   */\n  textWrap?: 'nowrap' | 'short' | 'full';\n\n  /**\n   * Передавать `true`, если предполагается переход при нажатии на ячейку.\n   */\n  chevron?: boolean;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/MiniInfoCell\n */\nexport const MiniInfoCell = ({\n  before,\n  after,\n  children,\n  mode = 'base',\n  textWrap = 'nowrap',\n  chevron = false,\n  ...restProps\n}: MiniInfoCellProps): React.ReactNode => {\n  const cellClasses = classNames(\n    styles.host,\n    stylesTextWrap[textWrap],\n    mode !== 'base' && stylesMode[mode],\n  );\n\n  const cellContent = (\n    <React.Fragment>\n      {hasReactNode(before) && <span className={styles.before}>{before}</span>}\n      <div className={styles.middle}>\n        <Paragraph className={styles.content} weight={mode === 'more' ? '2' : undefined}>\n          {children}\n        </Paragraph>\n        {chevron && <Icon16Chevron />}\n      </div>\n      {hasReactNode(after) && <span className={styles.after}>{after}</span>}\n    </React.Fragment>\n  );\n\n  return (\n    <Tappable {...restProps} baseClassName={cellClasses}>\n      {cellContent}\n    </Tappable>\n  );\n};\n"],"names":["React","Icon16Chevron","classNames","hasReactNode","Tappable","Paragraph","stylesMode","add","accent","more","stylesTextWrap","nowrap","full","short","MiniInfoCell","before","after","children","mode","textWrap","chevron","restProps","cellClasses","cellContent","Fragment","span","className","div","weight","undefined","baseClassName"],"mappings":";;;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,SAAS,QAAQ,uCAAoC;AAG9D,MAAMC,aAAa;IACjBC,GAAG;IACHC,MAAM;IACNC,IAAI;AACN;AAEA,MAAMC,iBAAiB;IACrBC,MAAM;IACNC,IAAI;IACJC,KAAK;AACP;AAwCA;;CAEC,GACD,OAAO,MAAMC,eAAe;QAAC,EAC3BC,MAAM,EACNC,KAAK,EACLC,QAAQ,EACRC,OAAO,MAAM,EACbC,WAAW,QAAQ,EACnBC,UAAU,KAAK,EAEG,WADfC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,cAAcpB,qCAElBQ,cAAc,CAACS,SAAS,EACxBD,SAAS,UAAUZ,UAAU,CAACY,KAAK;IAGrC,MAAMK,4BACJ,MAACvB,MAAMwB,QAAQ;;YACZrB,aAAaY,yBAAW,KAACU;gBAAKC,SAAS;0BAAkBX;;0BAC1D,MAACY;gBAAID,SAAS;;kCACZ,KAACrB;wBAAUqB,SAAS;wBAAkBE,QAAQV,SAAS,SAAS,MAAMW;kCACnEZ;;oBAEFG,yBAAW,KAACnB;;;YAEdE,aAAaa,wBAAU,KAACS;gBAAKC,SAAS;0BAAiBV;;;;IAI5D,qBACE,KAACZ,kDAAaiB;QAAWS,eAAeR;kBACrCC;;AAGP,EAAE"}

package/dist/components/ModalOutsideButton/ModalOutsideButton.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { type TappableProps } from '../Tappable/Tappable';
-export interface ModalOutsideButtonProps extends TappableProps {
+import { type TappableOmitProps } from '../Tappable/Tappable';
+export interface ModalOutsideButtonProps extends TappableOmitProps {
     /**
      * Текст для скринридера.
      */

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

@@ -1 +1 @@
-{"version":3,"file":"ModalOutsideButton.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAIpE,MAAM,WAAW,uBAAwB,SAAQ,aAAa;IAC5D;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,GAAI,qDAIhC,uBAAuB,4CAYzB,CAAC"}
+{"version":3,"file":"ModalOutsideButton.d.ts","sourceRoot":"","sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAY,KAAK,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAIxE,MAAM,WAAW,uBAAwB,SAAQ,iBAAiB;IAChE;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED;;GAEG;AACH,eAAO,MAAM,kBAAkB,GAAI,qDAIhC,uBAAuB,4CAYzB,CAAC"}

package/dist/components/ModalOutsideButton/ModalOutsideButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Tappable, type TappableProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalOutsideButton.module.css';\n\nexport interface ModalOutsideButtonProps extends TappableProps {\n  /**\n   * Текст для скринридера.\n   */\n  'aria-label'?: string;\n  /**\n   * Рекомендуется использовать иконки размером `20px`.\n   */\n  'children': React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalOutsideButton\n */\nexport const ModalOutsideButton = ({\n  children,\n  'aria-label': ariaLabel,\n  ...restProps\n}: ModalOutsideButtonProps) => {\n  return (\n    <Tappable\n      baseClassName={styles.host}\n      activeMode={styles.active}\n      hoverMode={styles.hover}\n      {...restProps}\n    >\n      {ariaLabel && <VisuallyHidden>{ariaLabel}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","Tappable","VisuallyHidden","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","activeMode","hoverMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAA4B,0BAAuB;AACpE,SAASC,cAAc,QAAQ,sCAAmC;AAclE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EAEC,WADrBC;QAFHF;QACA;;IAGA,qBACE,MAACH;QACCM,aAAa;QACbC,UAAU;QACVC,SAAS;OACLH;;YAEHD,2BAAa,KAACH;0BAAgBG;;YAC9BD;;;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/ModalOutsideButton/ModalOutsideButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Tappable, type TappableOmitProps } from '../Tappable/Tappable';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport styles from './ModalOutsideButton.module.css';\n\nexport interface ModalOutsideButtonProps extends TappableOmitProps {\n  /**\n   * Текст для скринридера.\n   */\n  'aria-label'?: string;\n  /**\n   * Рекомендуется использовать иконки размером `20px`.\n   */\n  'children': React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ModalOutsideButton\n */\nexport const ModalOutsideButton = ({\n  children,\n  'aria-label': ariaLabel,\n  ...restProps\n}: ModalOutsideButtonProps) => {\n  return (\n    <Tappable\n      baseClassName={styles.host}\n      activeMode={styles.active}\n      hoverMode={styles.hover}\n      {...restProps}\n    >\n      {ariaLabel && <VisuallyHidden>{ariaLabel}</VisuallyHidden>}\n      {children}\n    </Tappable>\n  );\n};\n"],"names":["React","Tappable","VisuallyHidden","ModalOutsideButton","children","ariaLabel","restProps","baseClassName","activeMode","hoverMode"],"mappings":"AAAA;;;;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,cAAc,QAAQ,sCAAmC;AAclE;;CAEC,GACD,OAAO,MAAMC,qBAAqB;QAAC,EACjCC,QAAQ,EACR,cAAcC,SAAS,EAEC,WADrBC;QAFHF;QACA;;IAGA,qBACE,MAACH;QACCM,aAAa;QACbC,UAAU;QACVC,SAAS;OACLH;;YAEHD,2BAAa,KAACH;0BAAgBG;;YAC9BD;;;AAGP,EAAE"}

package/dist/components/NumberInputLike/NumberInputLike.d.ts

@@ -0,0 +1,8 @@
+import { type InputLikeProps } from '../InputLike/InputLike';
+export interface NumberInputLikeProps extends Omit<InputLikeProps, 'value'> {
+    value?: number | string;
+    maxValue?: number;
+    minValue?: number;
+}
+export declare const NumberInputLike: React.FC<NumberInputLikeProps>;
+//# sourceMappingURL=NumberInputLike.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInputLike.d.ts","sourceRoot":"","sources":["../../../src/components/NumberInputLike/NumberInputLike.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAGxE,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAAC,cAAc,EAAE,OAAO,CAAC;IACzE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAeD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA+B1D,CAAC"}