@vkontakte/vkui 6.0.2 → 6.0.3

package/dist/components/ChipsSelect/ChipsSelect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ChipsSelect/ChipsSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalOnClickOutside } from '../../hooks/useGlobalOnClickOutside';\nimport { Keys } from '../../lib/accessibility';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipsInputBase } from '../ChipsInputBase/ChipsInputBase';\nimport {\n  getNewOptionDataDefault,\n  getOptionLabelDefault,\n  getOptionValueDefault,\n  renderChipDefault,\n} from '../ChipsInputBase/constants';\nimport type { ChipOption, ChipsInputBaseProps } from '../ChipsInputBase/types';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  type CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport type { FormFieldProps } from '../FormField/FormField';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport {\n  DEFAULT_EMPTY_TEXT,\n  DEFAULT_SELECTED_BEHAVIOR,\n  FOCUS_ACTION_NEXT,\n  FOCUS_ACTION_PREV,\n  isCreateNewOptionPreset,\n  isEmptyOptionPreset,\n  isNotServicePreset,\n  renderOptionDefault,\n} from './constants';\nimport type { FocusActionType, OptionPreset } from './types';\nimport { useChipsSelect, type UseChipsSelectProps } from './useChipsSelect';\nimport styles from './ChipsSelect.module.css';\n\nconst stylesDropdownVerticalPlacement = {\n  top: styles['ChipsSelect--pop-up'],\n  bottom: styles['ChipsSelect--pop-down'],\n} as const;\n\nconst findIndexAfter = <O extends ChipOption>(\n  options: Array<OptionPreset<O>> = [],\n  startIndex = -1,\n) => {\n  if (startIndex >= options.length - 1) {\n    return -1;\n  }\n  return options.findIndex(\n    (option, i) => i > startIndex && (!isNotServicePreset(option) || !option.disabled),\n  );\n};\n\nconst findIndexBefore = <O extends ChipOption>(\n  options: Array<OptionPreset<O>> = [],\n  endIndex: number = options.length,\n) => {\n  let result = -1;\n  if (endIndex <= 0) {\n    return result;\n  }\n  for (let i = endIndex - 1; i >= 0; i--) {\n    let option = options[i];\n\n    if (!isNotServicePreset(option) || !option.disabled) {\n      result = i;\n      break;\n    }\n  }\n  return result;\n};\n\nexport interface ChipsSelectProps<O extends ChipOption>\n  extends ChipsInputBaseProps<O>,\n    UseChipsSelectProps<O>,\n    Pick<FormFieldProps, 'status' | 'mode' | 'before'> {\n  placement?: 'top' | 'bottom';\n  /**\n   * Отрисовка Spinner вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  /**\n   * Ширина раскрывающегося списка зависит от контента\n   */\n  dropdownAutoWidth?: boolean;\n  /**\n   * Принудительно использовать портал.\n   */\n  forceDropdownPortal?: boolean;\n  /**\n   * Передача `data-testid`.\n   */\n  dropdownTestId?: string;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Добавляет значение в список на событие `onBlur` (использовать вместе с `creatable`)\n   */\n  addOnBlur?: boolean;\n  /**\n   * Отключает максимальную высоту по умолчанию\n   */\n  noMaxHeight?: boolean;\n\n  renderOption?(props: CustomSelectOptionProps, option: O): React.ReactNode;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?(event: React.MouseEvent | React.KeyboardEvent, option: O): void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>({\n  // FormFieldProps\n  id: labelledbyId,\n  getRootRef,\n  className,\n  status = 'default',\n  icon: dropdownIconProp,\n  onChangeStart,\n\n  // CustomSelectDropdownProps\n  options: optionsProp,\n  placement: placementProp = 'bottom',\n  closeAfterSelect = true,\n  selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n  emptyText = DEFAULT_EMPTY_TEXT,\n  creatable = false,\n  fetching = false,\n  dropdownAutoWidth,\n  forceDropdownPortal,\n  noMaxHeight = false,\n  filterFn = defaultFilterFn,\n  dropdownTestId,\n\n  // ChipsInputProps\n  getRef,\n  value: valueProp,\n  defaultValue,\n  inputValue: inputValueProp,\n  defaultInputValue,\n  disabled,\n  readOnly,\n  getOptionValue = getOptionValueDefault,\n  getOptionLabel = getOptionLabelDefault,\n  getNewOptionData = getNewOptionDataDefault,\n  renderChip = renderChipDefault,\n  renderOption = renderOptionDefault,\n  onChange,\n  onFocus: onFocusProp,\n  onInputChange: onInputChangeProp,\n  onBlur: onBlurProp,\n  onKeyDown: onKeyDownProp,\n  ...restProps\n}: ChipsSelectProps<Option>) => {\n  const {\n    // Связано с ChipsInputProps\n    // option\n    value,\n    addOptionFromInput,\n    addOption,\n    removeOption,\n    // input\n    inputRef: inputRefHook,\n    inputValue,\n    clearInput,\n    onInputChange,\n\n    // Связано с CustomSelectDropdownProps\n    options,\n    opened,\n    setOpened,\n    focusedOption,\n    focusedOptionIndex,\n    setFocusedOption,\n    setFocusedOptionIndex,\n  } = useChipsSelect({\n    // option\n    value: valueProp,\n    defaultValue,\n    onChange,\n    getOptionValue,\n    getOptionLabel,\n    getNewOptionData,\n\n    // input\n    inputValue: inputValueProp,\n    defaultInputValue,\n    onInputChange: onInputChangeProp,\n\n    // dropdown\n    options: optionsProp,\n    emptyText,\n    creatable,\n    filterFn,\n    selectedBehavior,\n\n    // other\n    disabled,\n  });\n\n  // Связано с ChipsInputProps\n  const rootRef = useExternRef(getRootRef);\n  const inputRef = useExternRef(getRef, inputRefHook);\n\n  // Связано с CustomSelectDropdownProps\n  const [dropdownVerticalPlacement, setDropdownVerticalPlacement] = React.useState<\n    Extract<Placement, 'top' | 'bottom'> | undefined\n  >(placementProp);\n  const dropdownId = React.useId();\n  const dropdownCurrentItemId =\n    focusedOptionIndex !== null ? `${dropdownId}-${focusedOptionIndex}` : undefined;\n  const dropdownScrollBoxRef = React.useRef<HTMLDivElement>(null);\n\n  const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (onFocusProp) {\n      onFocusProp(event);\n    }\n\n    if (!readOnly) {\n      setOpened(true);\n      setFocusedOptionIndex(null);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (onBlurProp) {\n      onBlurProp(event);\n    }\n\n    // Не добавляем значение, если его нужно выбрать строго из списка\n    if (!readOnly && !event.defaultPrevented && !creatable) {\n      event.preventDefault();\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = dropdownScrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\n    /* istanbul ignore if: невозможный кейс (в SSR вызова этой функции не будет) */\n    if (!item || !dropdown) {\n      return;\n    }\n\n    const dropdownHeight = dropdown.offsetHeight;\n    const scrollTop = dropdown.scrollTop;\n    const itemTop = item.offsetTop;\n    const itemHeight = item.offsetHeight;\n\n    /* istanbul ignore next: нет представления как воспроизвести */\n    if (center) {\n      dropdown.scrollTop = itemTop - dropdownHeight / 2 + itemHeight / 2;\n    } else if (itemTop + itemHeight > dropdownHeight + scrollTop) {\n      dropdown.scrollTop = itemTop - dropdownHeight + itemHeight;\n    } else if (itemTop < scrollTop) {\n      dropdown.scrollTop = itemTop;\n    }\n  };\n\n  const focusOptionByIndex = (index: number, oldIndex: number | null) => {\n    const length = options.length;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\n      /* istanbul ignore next: нет представления как воспроизвести */\n      return;\n    }\n\n    const option = options[index];\n\n    if (isNotServicePreset(option) && option.disabled) {\n      return;\n    }\n\n    scrollToElement(index);\n    setFocusedOptionIndex(index);\n  };\n\n  const focusOption = (nextIndex: number | null, type: FocusActionType) => {\n    let index = nextIndex === null ? -1 : nextIndex;\n\n    if (type === FOCUS_ACTION_NEXT) {\n      const nextIndex = findIndexAfter(options, index);\n      index = nextIndex === -1 ? findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index\n    } else if (type === FOCUS_ACTION_PREV) {\n      const beforeIndex = findIndexBefore(options, index);\n      index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (onKeyDownProp) {\n      onKeyDownProp(event);\n    }\n\n    if (event.defaultPrevented || readOnly) {\n      return;\n    }\n\n    switch (event.key) {\n      case Keys.ARROW_UP:\n      case Keys.ARROW_DOWN:\n        event.preventDefault();\n\n        if (!opened) {\n          setOpened(true);\n          focusOption(null, FOCUS_ACTION_NEXT);\n        } else {\n          focusOption(\n            focusedOptionIndex,\n            event.key === Keys.ARROW_UP ? FOCUS_ACTION_PREV : FOCUS_ACTION_NEXT,\n          );\n        }\n        break;\n      case Keys.ENTER: {\n        if (!opened) {\n          break;\n        }\n        if (focusedOptionIndex != null) {\n          const foundOption = options[focusedOptionIndex];\n          if (foundOption && isNotServicePreset(foundOption)) {\n            event.preventDefault();\n\n            if (onChangeStart) {\n              onChangeStart(event, foundOption);\n            }\n\n            addOption(foundOption);\n            setFocusedOptionIndex(null);\n            clearInput();\n            if (closeAfterSelect) {\n              setOpened(false);\n            }\n\n            break;\n          }\n        }\n\n        if (!creatable) {\n          event.preventDefault();\n        }\n        break;\n      }\n      case Keys.ESCAPE:\n      case Keys.TAB:\n        if (opened) {\n          setOpened(false);\n        }\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex === null) {\n      setFocusedOption(null);\n    } else {\n      const foundFocusedOptionIndex = options[focusedOptionIndex];\n\n      if (foundFocusedOptionIndex && isNotServicePreset(foundFocusedOptionIndex)) {\n        setFocusedOption(foundFocusedOptionIndex);\n      }\n    }\n  }, [options, focusedOptionIndex, setFocusedOption]);\n\n  const onDropdownPlacementChange = React.useCallback((placement: Placement) => {\n    /* istanbul ignore next:  */\n    if (placement.startsWith('top')) {\n      setDropdownVerticalPlacement('top');\n    } else if (placement.startsWith('bottom')) {\n      setDropdownVerticalPlacement('bottom');\n    }\n  }, []);\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const handleClickOutside = React.useCallback(() => {\n    setOpened(false);\n  }, [setOpened]);\n\n  useGlobalOnClickOutside(\n    handleClickOutside,\n    opened ? rootRef : null,\n    opened ? dropdownScrollBoxRef : null,\n  );\n\n  return (\n    <>\n      <ChipsInputBase\n        {...restProps}\n        disabled={disabled}\n        readOnly={readOnly}\n        // FormFieldProps\n        id={labelledbyId}\n        getRootRef={rootRef}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            dropdownVerticalPlacement &&\n            stylesDropdownVerticalPlacement[dropdownVerticalPlacement],\n          className,\n        )}\n        status={status}\n        after={dropdownIconProp || <DropdownIcon opened={opened} />}\n        // option\n        value={value}\n        onAddChipOption={addOptionFromInput}\n        onRemoveChipOption={removeOption}\n        renderChip={renderChip}\n        // input\n        getRef={inputRef}\n        inputValue={inputValue}\n        onInputChange={onInputChange}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onKeyDown={handleKeyDown}\n        // a11y\n        role=\"combobox\"\n        aria-expanded={opened}\n        aria-autocomplete=\"list\"\n        aria-controls={opened ? dropdownId : undefined}\n        aria-activedescendant={opened ? dropdownCurrentItemId : undefined}\n        aria-haspopup=\"listbox\"\n      />\n      {opened && (\n        <CustomSelectDropdown\n          data-testid={dropdownTestId}\n          targetRef={rootRef}\n          placement={placementProp}\n          scrollBoxRef={dropdownScrollBoxRef}\n          onPlacementChange={onDropdownPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          autoWidth={dropdownAutoWidth}\n          forcePortal={forceDropdownPortal}\n          noMaxHeight={noMaxHeight}\n          // a11y\n          id={dropdownId}\n          role=\"listbox\"\n          aria-labelledby={labelledbyId}\n        >\n          {options.map((option, index) => {\n            const dropdownItemId = `${dropdownId}-${index}`;\n\n            if (isEmptyOptionPreset(option)) {\n              return (\n                <Footnote key=\"empty-text\" className={styles['ChipsSelect__empty']}>\n                  {option.placeholder}\n                </Footnote>\n              );\n            }\n            if (isCreateNewOptionPreset(option)) {\n              return (\n                <CustomSelectOption\n                  key=\"create-new-option\"\n                  id={dropdownItemId}\n                  hovered={focusedOptionIndex === index}\n                  onMouseDown={() => addOptionFromInput(inputValue)}\n                  onMouseEnter={() => setFocusedOptionIndex(index)}\n                >\n                  {option.actionText}\n                </CustomSelectOption>\n              );\n            }\n            return (\n              <React.Fragment key={`${typeof option.value}-${option.label}`}>\n                {renderOption(\n                  {\n                    id: dropdownItemId,\n                    disabled: option.disabled,\n                    hovered: focusedOption\n                      ? getOptionValue(option) === getOptionValue(focusedOption)\n                      : false,\n                    children: option.label,\n                    selected: !!value.find(\n                      (selectedOption: Option) =>\n                        getOptionValue(selectedOption) === getOptionValue(option),\n                    ),\n                    getRootRef(node) {\n                      if (node) {\n                        chipsSelectOptions[index] = node;\n                      }\n                    },\n                    onMouseDown(event: React.MouseEvent<HTMLDivElement>) {\n                      if (option.disabled) {\n                        return;\n                      }\n                      if (onChangeStart) {\n                        onChangeStart(event, option);\n                      }\n\n                      if (!event.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter() {\n                      setFocusedOptionIndex(index);\n                    },\n                  },\n                  option,\n                )}\n              </React.Fragment>\n            );\n          })}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","useExternRef","useGlobalOnClickOutside","Keys","defaultFilterFn","ChipsInputBase","getNewOptionDataDefault","getOptionLabelDefault","getOptionValueDefault","renderChipDefault","CustomSelectDropdown","CustomSelectOption","DropdownIcon","Footnote","DEFAULT_EMPTY_TEXT","DEFAULT_SELECTED_BEHAVIOR","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","isCreateNewOptionPreset","isEmptyOptionPreset","isNotServicePreset","renderOptionDefault","useChipsSelect","stylesDropdownVerticalPlacement","top","bottom","findIndexAfter","options","startIndex","length","findIndex","option","i","disabled","findIndexBefore","endIndex","result","ChipsSelect","id","labelledbyId","getRootRef","className","status","icon","dropdownIconProp","onChangeStart","optionsProp","placement","placementProp","closeAfterSelect","selectedBehavior","emptyText","creatable","fetching","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","filterFn","dropdownTestId","getRef","value","valueProp","defaultValue","inputValue","inputValueProp","defaultInputValue","readOnly","getOptionValue","getOptionLabel","getNewOptionData","renderChip","renderOption","onChange","onFocus","onFocusProp","onInputChange","onInputChangeProp","onBlur","onBlurProp","onKeyDown","onKeyDownProp","restProps","addOptionFromInput","addOption","removeOption","inputRef","inputRefHook","clearInput","opened","setOpened","focusedOption","focusedOptionIndex","setFocusedOption","setFocusedOptionIndex","rootRef","dropdownVerticalPlacement","setDropdownVerticalPlacement","useState","dropdownId","useId","dropdownCurrentItemId","undefined","dropdownScrollBoxRef","useRef","handleFocus","event","handleBlur","defaultPrevented","preventDefault","chipsSelectOptions","current","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","beforeIndex","handleKeyDown","key","ARROW_UP","ARROW_DOWN","ENTER","foundOption","ESCAPE","TAB","useEffect","foundFocusedOptionIndex","onDropdownPlacementChange","useCallback","startsWith","onDropdownMouseLeave","handleClickOutside","after","onAddChipOption","onRemoveChipOption","role","aria-expanded","aria-autocomplete","aria-controls","aria-activedescendant","aria-haspopup","data-testid","targetRef","scrollBoxRef","onPlacementChange","onMouseLeave","autoWidth","forcePortal","aria-labelledby","map","dropdownItemId","placeholder","hovered","onMouseDown","onMouseEnter","actionText","Fragment","label","children","selected","find","selectedOption","node"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ChipsSelect/ChipsSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalOnClickOutside } from '../../hooks/useGlobalOnClickOutside';\nimport { Keys } from '../../lib/accessibility';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipsInputBase } from '../ChipsInputBase/ChipsInputBase';\nimport {\n  getNewOptionDataDefault,\n  getOptionLabelDefault,\n  getOptionValueDefault,\n  renderChipDefault,\n} from '../ChipsInputBase/constants';\nimport type { ChipOption, ChipsInputBaseProps } from '../ChipsInputBase/types';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  type CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport type { FormFieldProps } from '../FormField/FormField';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport {\n  DEFAULT_EMPTY_TEXT,\n  DEFAULT_SELECTED_BEHAVIOR,\n  FOCUS_ACTION_NEXT,\n  FOCUS_ACTION_PREV,\n  isCreateNewOptionPreset,\n  isEmptyOptionPreset,\n  isNotServicePreset,\n  renderOptionDefault,\n} from './constants';\nimport type { FocusActionType, OptionPreset } from './types';\nimport { useChipsSelect, type UseChipsSelectProps } from './useChipsSelect';\nimport styles from './ChipsSelect.module.css';\n\nconst stylesDropdownVerticalPlacement = {\n  top: styles['ChipsSelect--pop-up'],\n  bottom: styles['ChipsSelect--pop-down'],\n} as const;\n\nconst findIndexAfter = <O extends ChipOption>(\n  options: Array<OptionPreset<O>> = [],\n  startIndex = -1,\n) => {\n  if (startIndex >= options.length - 1) {\n    return -1;\n  }\n  return options.findIndex(\n    (option, i) => i > startIndex && (!isNotServicePreset(option) || !option.disabled),\n  );\n};\n\nconst findIndexBefore = <O extends ChipOption>(\n  options: Array<OptionPreset<O>> = [],\n  endIndex: number = options.length,\n) => {\n  let result = -1;\n  if (endIndex <= 0) {\n    return result;\n  }\n  for (let i = endIndex - 1; i >= 0; i--) {\n    let option = options[i];\n\n    if (!isNotServicePreset(option) || !option.disabled) {\n      result = i;\n      break;\n    }\n  }\n  return result;\n};\n\nexport interface ChipsSelectProps<O extends ChipOption>\n  extends ChipsInputBaseProps<O>,\n    UseChipsSelectProps<O>,\n    Pick<FormFieldProps, 'status' | 'mode' | 'before'> {\n  placement?: 'top' | 'bottom';\n  /**\n   * Отрисовка Spinner вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  /**\n   * Ширина раскрывающегося списка зависит от контента\n   */\n  dropdownAutoWidth?: boolean;\n  /**\n   * Принудительно использовать портал.\n   */\n  forceDropdownPortal?: boolean;\n  /**\n   * Передача `data-testid`.\n   */\n  dropdownTestId?: string;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n  /**\n   * Добавляет значение в список на событие `onBlur` (использовать вместе с `creatable`)\n   */\n  addOnBlur?: boolean;\n  /**\n   * Отключает максимальную высоту по умолчанию\n   */\n  noMaxHeight?: boolean;\n\n  renderOption?: (props: CustomSelectOptionProps, option: O) => React.ReactNode;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?: (event: React.MouseEvent | React.KeyboardEvent, option: O) => void;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>({\n  // FormFieldProps\n  id: labelledbyId,\n  getRootRef,\n  className,\n  status = 'default',\n  icon: dropdownIconProp,\n  onChangeStart,\n\n  // CustomSelectDropdownProps\n  options: optionsProp,\n  placement: placementProp = 'bottom',\n  closeAfterSelect = true,\n  selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n  emptyText = DEFAULT_EMPTY_TEXT,\n  creatable = false,\n  fetching = false,\n  dropdownAutoWidth,\n  forceDropdownPortal,\n  noMaxHeight = false,\n  filterFn = defaultFilterFn,\n  dropdownTestId,\n\n  // ChipsInputProps\n  getRef,\n  value: valueProp,\n  defaultValue,\n  inputValue: inputValueProp,\n  defaultInputValue,\n  disabled,\n  readOnly,\n  getOptionValue = getOptionValueDefault,\n  getOptionLabel = getOptionLabelDefault,\n  getNewOptionData = getNewOptionDataDefault,\n  renderChip = renderChipDefault,\n  renderOption = renderOptionDefault,\n  onChange,\n  onFocus: onFocusProp,\n  onInputChange: onInputChangeProp,\n  onBlur: onBlurProp,\n  onKeyDown: onKeyDownProp,\n  ...restProps\n}: ChipsSelectProps<Option>) => {\n  const {\n    // Связано с ChipsInputProps\n    // option\n    value,\n    addOptionFromInput,\n    addOption,\n    removeOption,\n    // input\n    inputRef: inputRefHook,\n    inputValue,\n    clearInput,\n    onInputChange,\n\n    // Связано с CustomSelectDropdownProps\n    options,\n    opened,\n    setOpened,\n    focusedOption,\n    focusedOptionIndex,\n    setFocusedOption,\n    setFocusedOptionIndex,\n  } = useChipsSelect({\n    // option\n    value: valueProp,\n    defaultValue,\n    onChange,\n    getOptionValue,\n    getOptionLabel,\n    getNewOptionData,\n\n    // input\n    inputValue: inputValueProp,\n    defaultInputValue,\n    onInputChange: onInputChangeProp,\n\n    // dropdown\n    options: optionsProp,\n    emptyText,\n    creatable,\n    filterFn,\n    selectedBehavior,\n\n    // other\n    disabled,\n  });\n\n  // Связано с ChipsInputProps\n  const rootRef = useExternRef(getRootRef);\n  const inputRef = useExternRef(getRef, inputRefHook);\n\n  // Связано с CustomSelectDropdownProps\n  const [dropdownVerticalPlacement, setDropdownVerticalPlacement] = React.useState<\n    Extract<Placement, 'top' | 'bottom'> | undefined\n  >(placementProp);\n  const dropdownId = React.useId();\n  const dropdownCurrentItemId =\n    focusedOptionIndex !== null ? `${dropdownId}-${focusedOptionIndex}` : undefined;\n  const dropdownScrollBoxRef = React.useRef<HTMLDivElement>(null);\n\n  const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (onFocusProp) {\n      onFocusProp(event);\n    }\n\n    if (!readOnly) {\n      setOpened(true);\n      setFocusedOptionIndex(null);\n    }\n  };\n\n  const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n    if (onBlurProp) {\n      onBlurProp(event);\n    }\n\n    // Не добавляем значение, если его нужно выбрать строго из списка\n    if (!readOnly && !event.defaultPrevented && !creatable) {\n      event.preventDefault();\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = dropdownScrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\n    /* istanbul ignore if: невозможный кейс (в SSR вызова этой функции не будет) */\n    if (!item || !dropdown) {\n      return;\n    }\n\n    const dropdownHeight = dropdown.offsetHeight;\n    const scrollTop = dropdown.scrollTop;\n    const itemTop = item.offsetTop;\n    const itemHeight = item.offsetHeight;\n\n    /* istanbul ignore next: нет представления как воспроизвести */\n    if (center) {\n      dropdown.scrollTop = itemTop - dropdownHeight / 2 + itemHeight / 2;\n    } else if (itemTop + itemHeight > dropdownHeight + scrollTop) {\n      dropdown.scrollTop = itemTop - dropdownHeight + itemHeight;\n    } else if (itemTop < scrollTop) {\n      dropdown.scrollTop = itemTop;\n    }\n  };\n\n  const focusOptionByIndex = (index: number, oldIndex: number | null) => {\n    const length = options.length;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\n      /* istanbul ignore next: нет представления как воспроизвести */\n      return;\n    }\n\n    const option = options[index];\n\n    if (isNotServicePreset(option) && option.disabled) {\n      return;\n    }\n\n    scrollToElement(index);\n    setFocusedOptionIndex(index);\n  };\n\n  const focusOption = (nextIndex: number | null, type: FocusActionType) => {\n    let index = nextIndex === null ? -1 : nextIndex;\n\n    if (type === FOCUS_ACTION_NEXT) {\n      const nextIndex = findIndexAfter(options, index);\n      index = nextIndex === -1 ? findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index\n    } else if (type === FOCUS_ACTION_PREV) {\n      const beforeIndex = findIndexBefore(options, index);\n      index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (onKeyDownProp) {\n      onKeyDownProp(event);\n    }\n\n    if (event.defaultPrevented || readOnly) {\n      return;\n    }\n\n    switch (event.key) {\n      case Keys.ARROW_UP:\n      case Keys.ARROW_DOWN:\n        event.preventDefault();\n\n        if (!opened) {\n          setOpened(true);\n          focusOption(null, FOCUS_ACTION_NEXT);\n        } else {\n          focusOption(\n            focusedOptionIndex,\n            event.key === Keys.ARROW_UP ? FOCUS_ACTION_PREV : FOCUS_ACTION_NEXT,\n          );\n        }\n        break;\n      case Keys.ENTER: {\n        if (!opened) {\n          break;\n        }\n        if (focusedOptionIndex != null) {\n          const foundOption = options[focusedOptionIndex];\n          if (foundOption && isNotServicePreset(foundOption)) {\n            event.preventDefault();\n\n            if (onChangeStart) {\n              onChangeStart(event, foundOption);\n            }\n\n            addOption(foundOption);\n            setFocusedOptionIndex(null);\n            clearInput();\n            if (closeAfterSelect) {\n              setOpened(false);\n            }\n\n            break;\n          }\n        }\n\n        if (!creatable) {\n          event.preventDefault();\n        }\n        break;\n      }\n      case Keys.ESCAPE:\n      case Keys.TAB:\n        if (opened) {\n          setOpened(false);\n        }\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex === null) {\n      setFocusedOption(null);\n    } else {\n      const foundFocusedOptionIndex = options[focusedOptionIndex];\n\n      if (foundFocusedOptionIndex && isNotServicePreset(foundFocusedOptionIndex)) {\n        setFocusedOption(foundFocusedOptionIndex);\n      }\n    }\n  }, [options, focusedOptionIndex, setFocusedOption]);\n\n  const onDropdownPlacementChange = React.useCallback((placement: Placement) => {\n    /* istanbul ignore next:  */\n    if (placement.startsWith('top')) {\n      setDropdownVerticalPlacement('top');\n    } else if (placement.startsWith('bottom')) {\n      setDropdownVerticalPlacement('bottom');\n    }\n  }, []);\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const handleClickOutside = React.useCallback(() => {\n    setOpened(false);\n  }, [setOpened]);\n\n  useGlobalOnClickOutside(\n    handleClickOutside,\n    opened ? rootRef : null,\n    opened ? dropdownScrollBoxRef : null,\n  );\n\n  return (\n    <>\n      <ChipsInputBase\n        {...restProps}\n        disabled={disabled}\n        readOnly={readOnly}\n        // FormFieldProps\n        id={labelledbyId}\n        getRootRef={rootRef}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            dropdownVerticalPlacement &&\n            stylesDropdownVerticalPlacement[dropdownVerticalPlacement],\n          className,\n        )}\n        status={status}\n        after={dropdownIconProp || <DropdownIcon opened={opened} />}\n        // option\n        value={value}\n        onAddChipOption={addOptionFromInput}\n        onRemoveChipOption={removeOption}\n        renderChip={renderChip}\n        // input\n        getRef={inputRef}\n        inputValue={inputValue}\n        onInputChange={onInputChange}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        onKeyDown={handleKeyDown}\n        // a11y\n        role=\"combobox\"\n        aria-expanded={opened}\n        aria-autocomplete=\"list\"\n        aria-controls={opened ? dropdownId : undefined}\n        aria-activedescendant={opened ? dropdownCurrentItemId : undefined}\n        aria-haspopup=\"listbox\"\n      />\n      {opened && (\n        <CustomSelectDropdown\n          data-testid={dropdownTestId}\n          targetRef={rootRef}\n          placement={placementProp}\n          scrollBoxRef={dropdownScrollBoxRef}\n          onPlacementChange={onDropdownPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          autoWidth={dropdownAutoWidth}\n          forcePortal={forceDropdownPortal}\n          noMaxHeight={noMaxHeight}\n          // a11y\n          id={dropdownId}\n          role=\"listbox\"\n          aria-labelledby={labelledbyId}\n        >\n          {options.map((option, index) => {\n            const dropdownItemId = `${dropdownId}-${index}`;\n\n            if (isEmptyOptionPreset(option)) {\n              return (\n                <Footnote key=\"empty-text\" className={styles['ChipsSelect__empty']}>\n                  {option.placeholder}\n                </Footnote>\n              );\n            }\n            if (isCreateNewOptionPreset(option)) {\n              return (\n                <CustomSelectOption\n                  key=\"create-new-option\"\n                  id={dropdownItemId}\n                  hovered={focusedOptionIndex === index}\n                  onMouseDown={() => addOptionFromInput(inputValue)}\n                  onMouseEnter={() => setFocusedOptionIndex(index)}\n                >\n                  {option.actionText}\n                </CustomSelectOption>\n              );\n            }\n            return (\n              <React.Fragment key={`${typeof option.value}-${option.label}`}>\n                {renderOption(\n                  {\n                    id: dropdownItemId,\n                    disabled: option.disabled,\n                    hovered: focusedOption\n                      ? getOptionValue(option) === getOptionValue(focusedOption)\n                      : false,\n                    children: option.label,\n                    selected: !!value.find(\n                      (selectedOption: Option) =>\n                        getOptionValue(selectedOption) === getOptionValue(option),\n                    ),\n                    getRootRef(node) {\n                      if (node) {\n                        chipsSelectOptions[index] = node;\n                      }\n                    },\n                    onMouseDown(event: React.MouseEvent<HTMLDivElement>) {\n                      if (option.disabled) {\n                        return;\n                      }\n                      if (onChangeStart) {\n                        onChangeStart(event, option);\n                      }\n\n                      if (!event.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter() {\n                      setFocusedOptionIndex(index);\n                    },\n                  },\n                  option,\n                )}\n              </React.Fragment>\n            );\n          })}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","useExternRef","useGlobalOnClickOutside","Keys","defaultFilterFn","ChipsInputBase","getNewOptionDataDefault","getOptionLabelDefault","getOptionValueDefault","renderChipDefault","CustomSelectDropdown","CustomSelectOption","DropdownIcon","Footnote","DEFAULT_EMPTY_TEXT","DEFAULT_SELECTED_BEHAVIOR","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","isCreateNewOptionPreset","isEmptyOptionPreset","isNotServicePreset","renderOptionDefault","useChipsSelect","stylesDropdownVerticalPlacement","top","bottom","findIndexAfter","options","startIndex","length","findIndex","option","i","disabled","findIndexBefore","endIndex","result","ChipsSelect","id","labelledbyId","getRootRef","className","status","icon","dropdownIconProp","onChangeStart","optionsProp","placement","placementProp","closeAfterSelect","selectedBehavior","emptyText","creatable","fetching","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","filterFn","dropdownTestId","getRef","value","valueProp","defaultValue","inputValue","inputValueProp","defaultInputValue","readOnly","getOptionValue","getOptionLabel","getNewOptionData","renderChip","renderOption","onChange","onFocus","onFocusProp","onInputChange","onInputChangeProp","onBlur","onBlurProp","onKeyDown","onKeyDownProp","restProps","addOptionFromInput","addOption","removeOption","inputRef","inputRefHook","clearInput","opened","setOpened","focusedOption","focusedOptionIndex","setFocusedOption","setFocusedOptionIndex","rootRef","dropdownVerticalPlacement","setDropdownVerticalPlacement","useState","dropdownId","useId","dropdownCurrentItemId","undefined","dropdownScrollBoxRef","useRef","handleFocus","event","handleBlur","defaultPrevented","preventDefault","chipsSelectOptions","current","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","beforeIndex","handleKeyDown","key","ARROW_UP","ARROW_DOWN","ENTER","foundOption","ESCAPE","TAB","useEffect","foundFocusedOptionIndex","onDropdownPlacementChange","useCallback","startsWith","onDropdownMouseLeave","handleClickOutside","after","onAddChipOption","onRemoveChipOption","role","aria-expanded","aria-autocomplete","aria-controls","aria-activedescendant","aria-haspopup","data-testid","targetRef","scrollBoxRef","onPlacementChange","onMouseLeave","autoWidth","forcePortal","aria-labelledby","map","dropdownItemId","placeholder","hovered","onMouseDown","onMouseEnter","actionText","Fragment","label","children","selected","find","selectedOption","node"],"mappings":"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"}

package/dist/components/ChipsSelect/useChipsSelect.d.ts

@@ -24,7 +24,10 @@ export interface UseChipsSelectProps<O extends ChipOption = ChipOption> extends
     filterFn?: false | FilterFn<O>;
 }
 export declare const useChipsSelect: <O extends ChipOption>({ disabled, value: valueProp, defaultValue, onChange, getOptionLabel, getOptionValue, getNewOptionData, inputValue: inputValueProp, defaultInputValue, onInputChange: onInputChangeProp, creatable, emptyText, filterFn, selectedBehavior, options: optionsProp, }: UseChipsSelectProps<O>) => {
-    value: O[];
+    value: (O & {
+        label: import("../ChipsInputBase/types").ChipOptionLabel;
+        value: import("../ChipsInputBase/types").ChipOptionValue;
+    })[];
     inputValue: string;
     onInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
     options: OptionPreset<O>[];

package/dist/components/ChipsSelect/useChipsSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useChipsSelect.d.ts","sourceRoot":"","sources":["../../../src/components/ChipsSelect/useChipsSelect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAmB,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAElE,OAAO,EAGL,KAAK,kBAAkB,EACxB,MAAM,6BAA6B,CAAC;AAQrC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,CACpE,SAAQ,kBAAkB,CAAC,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;IACd;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACxC,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,cAAc;;;2BA+Df,MAAM,WAAW,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;CAqE9C,CAAC"}
+{"version":3,"file":"useChipsSelect.d.ts","sourceRoot":"","sources":["../../../src/components/ChipsSelect/useChipsSelect.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAmB,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAElE,OAAO,EAGL,KAAK,kBAAkB,EACxB,MAAM,6BAA6B,CAAC;AAQrC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAE1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,UAAU,GAAG,UAAU,CACpE,SAAQ,kBAAkB,CAAC,CAAC,CAAC;IAC7B,OAAO,CAAC,EAAE,CAAC,EAAE,CAAC;IACd;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACxC,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;CAChC;AAED,eAAO,MAAM,cAAc;;;;;;2BA+Df,MAAM,WAAW,CAAC,gBAAgB,CAAC;;;;;;;;;;;;;CAqE9C,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"Clickable.d.ts","sourceRoot":"","sources":["../../../src/components/Clickable/Clickable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,qBAAqB,EAEtB,MAAM,sCAAsC,CAAC;AAE9C,OAAO,EAAiB,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEnF,OAAO,EAGL,UAAU,EAEX,MAAM,YAAY,CAAC;AAGpB,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,WAAW,CAC7C,SAAQ,kBAAkB,CAAC,CAAC,CAAC,EAC3B,qBAAqB,EACrB,UAAU;CAAG;AAuFjB;;GAEG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,OAAO,CAQnE;AAiCD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,SAAS,mHAqBrB,CAAC"}
+{"version":3,"file":"Clickable.d.ts","sourceRoot":"","sources":["../../../src/components/Clickable/Clickable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EACL,qBAAqB,EAEtB,MAAM,sCAAsC,CAAC;AAE9C,OAAO,EAAiB,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAEnF,OAAO,EAGL,UAAU,EAEX,MAAM,YAAY,CAAC;AAGpB,MAAM,WAAW,cAAc,CAAC,CAAC,GAAG,WAAW,CAC7C,SAAQ,kBAAkB,CAAC,CAAC,CAAC,EAC3B,qBAAqB,EACrB,UAAU;CAAG;AAuFjB;;GAEG;AACH,wBAAgB,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,CAAC,CAAC,CAAC,GAAG,OAAO,CAQnE;AA2CD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,SAAS,mHAyBrB,CAAC"}

package/dist/components/Clickable/Clickable.js

@@ -116,6 +116,15 @@ import { ClickableLockStateContext, DEFAULT_ACTIVE_EFFECT_DELAY, useState } from
     }
     return {};
 }
+const getUserAgentResetClassName = (Component)=>{
+    if (Component === 'a') {
+        return "vkuiClickable__resetLinkStyle";
+    }
+    if (Component === 'button') {
+        return "vkuiClickable__resetButtonStyle";
+    }
+    return;
+};
 /**
  * Базовый кликабельный корневой компонент.
  *
@@ -134,7 +143,7 @@ import { ClickableLockStateContext, DEFAULT_ACTIVE_EFFECT_DELAY, useState } from
     ]);
     const commonProps = component(restProps);
     const isClickable = checkClickable(restProps);
-    const baseClassName = classNames(baseClassNameProp, "vkuiClickable__host");
+    const baseClassName = classNames(baseClassNameProp, getUserAgentResetClassName(commonProps.Component), "vkuiClickable__host");
     if (isClickable) {
         return /*#__PURE__*/ React.createElement(RealClickable, _object_spread({
             baseClassName: baseClassName,

package/dist/components/Clickable/Clickable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport {\n  FocusVisibleModeProps,\n  useFocusVisibleClassName,\n} from '../../hooks/useFocusVisibleClassName';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { RootComponent, RootComponentProps } from '../RootComponent/RootComponent';\nimport { useKeyboard } from './useKeyboard';\nimport {\n  ClickableLockStateContext,\n  DEFAULT_ACTIVE_EFFECT_DELAY,\n  StateProps,\n  useState,\n} from './useState';\nimport styles from './Clickable.module.css';\n\nexport interface ClickableProps<T = HTMLElement>\n  extends RootComponentProps<T>,\n    FocusVisibleModeProps,\n    StateProps {}\n\n/**\n * Некликабельный компонент. Отключаем возможность нажимать на компонент.\n */\nconst NonClickable = <T,>({\n  href,\n  onClick,\n  onClickCapture,\n  activeClassName,\n  hoverClassName,\n  hasActive,\n  hasHover,\n  hovered,\n  activated,\n  activeEffectDelay,\n  ...restProps\n}: ClickableProps<T>) => <RootComponent {...restProps} />;\n\n/**\n * Кликабельный компонент. Добавляем кучу обвесов\n */\nconst RealClickable = <T,>({\n  baseClassName,\n  children,\n  focusVisibleMode = 'inside',\n  activeClassName,\n  hoverClassName,\n  activeEffectDelay = DEFAULT_ACTIVE_EFFECT_DELAY,\n  hasHover = true,\n  hasActive = true,\n  hovered,\n  activated,\n  onPointerEnter,\n  onPointerLeave,\n  onPointerDown,\n  onPointerCancel,\n  onPointerUp,\n  onBlur,\n  onFocus,\n  onKeyDown,\n  ...restProps\n}: ClickableProps<T>) => {\n  const { focusVisible, ...focusEvents } = useFocusVisible();\n  const focusVisibleClassNames = useFocusVisibleClassName({ focusVisible, mode: focusVisibleMode });\n\n  const { stateClassName, setLockBubblingImmediate, ...stateEvents } = useState({\n    activeClassName,\n    hoverClassName,\n    activeEffectDelay,\n    hasHover,\n    hasActive,\n    hovered,\n    activated,\n  });\n\n  const keyboardHandlers = useKeyboard();\n\n  const handlers = mergeCalls(focusEvents, stateEvents, keyboardHandlers, {\n    onPointerEnter,\n    onPointerLeave,\n    onPointerDown,\n    onPointerCancel,\n    onPointerUp,\n    onBlur,\n    onFocus,\n    onKeyDown,\n  });\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        baseClassName,\n        styles['Clickable__realClickable'],\n        focusVisibleClassNames,\n        stateClassName,\n      )}\n      {...handlers}\n      {...restProps}\n    >\n      <ClickableLockStateContext.Provider value={setLockBubblingImmediate}>\n        {children}\n      </ClickableLockStateContext.Provider>\n    </RootComponent>\n  );\n};\n\n/**\n * Проверяем, является ли компонент кликабельным\n */\nexport function checkClickable<T>(props: ClickableProps<T>): boolean {\n  return (\n    (props.href !== undefined ||\n      props.onClick !== undefined ||\n      props.onClickCapture !== undefined ||\n      props.Component === 'label') &&\n    !props.disabled\n  );\n}\n\n/**\n * Определяет правильный компонент и его свойства\n *\n * - если передан Component, используем его\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n */\nfunction component<T>({\n  Component,\n  onClick,\n  onClickCapture,\n  href,\n  disabled,\n}: RootComponentProps<T>): RootComponentProps<T> {\n  if (Component !== undefined) {\n    return { Component };\n  } else if (href !== undefined) {\n    return { 'Component': 'a', 'aria-disabled': disabled };\n  } else if (onClick !== undefined || onClickCapture !== undefined) {\n    return {\n      'Component': 'div',\n      'role': 'button',\n      'tabIndex': disabled ? undefined : 0,\n      'aria-disabled': disabled,\n    };\n  }\n\n  return {};\n}\n\n/**\n * Базовый кликабельный корневой компонент.\n *\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n *\n * Отвечает за:\n *\n * - стейты наведения и нажатия\n * - a11y компонентов\n */\nexport const Clickable = <T,>({\n  focusVisibleMode = 'inside',\n  baseClassName: baseClassNameProp,\n  ...restProps\n}: ClickableProps<T>) => {\n  const commonProps = component(restProps);\n  const isClickable = checkClickable(restProps);\n  const baseClassName = classNames(baseClassNameProp, styles['Clickable__host']);\n\n  if (isClickable) {\n    return (\n      <RealClickable\n        baseClassName={baseClassName}\n        focusVisibleMode={focusVisibleMode}\n        {...commonProps}\n        {...restProps}\n      />\n    );\n  }\n\n  return <NonClickable baseClassName={baseClassName} {...commonProps} {...restProps} />;\n};\n"],"names":["React","classNames","useFocusVisible","useFocusVisibleClassName","mergeCalls","RootComponent","useKeyboard","ClickableLockStateContext","DEFAULT_ACTIVE_EFFECT_DELAY","useState","NonClickable","href","onClick","onClickCapture","activeClassName","hoverClassName","hasActive","hasHover","hovered","activated","activeEffectDelay","restProps","RealClickable","baseClassName","children","focusVisibleMode","onPointerEnter","onPointerLeave","onPointerDown","onPointerCancel","onPointerUp","onBlur","onFocus","onKeyDown","focusVisible","focusEvents","focusVisibleClassNames","mode","stateClassName","setLockBubblingImmediate","stateEvents","keyboardHandlers","handlers","Provider","value","checkClickable","props","undefined","Component","disabled","component","Clickable","baseClassNameProp","commonProps","isClickable"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,eAAe,QAAQ,8BAA8B;AAC9D,SAEEC,wBAAwB,QACnB,uCAAuC;AAC9C,SAASC,UAAU,QAAQ,uBAAuB;AAClD,SAASC,aAAa,QAA4B,iCAAiC;AACnF,SAASC,WAAW,QAAQ,gBAAgB;AAC5C,SACEC,yBAAyB,EACzBC,2BAA2B,EAE3BC,QAAQ,QACH,aAAa;AAQpB;;CAEC,GACD,MAAMC,eAAe;QAAK,EACxBC,IAAI,EACJC,OAAO,EACPC,cAAc,EACdC,eAAe,EACfC,cAAc,EACdC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTC,iBAAiB,EAEC,WADfC;QAVHV;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;yBAEuB,oBAACf,eAAkBgB;;AAE5C;;CAEC,GACD,MAAMC,gBAAgB;QAAK,EACzBC,aAAa,EACbC,QAAQ,EACRC,mBAAmB,QAAQ,EAC3BX,eAAe,EACfC,cAAc,EACdK,oBAAoBZ,2BAA2B,EAC/CS,WAAW,IAAI,EACfD,YAAY,IAAI,EAChBE,OAAO,EACPC,SAAS,EACTO,cAAc,EACdC,cAAc,EACdC,aAAa,EACbC,eAAe,EACfC,WAAW,EACXC,MAAM,EACNC,OAAO,EACPC,SAAS,EAES,WADfZ;QAlBHE;QACAC;QACAC;QACAX;QACAC;QACAK;QACAH;QACAD;QACAE;QACAC;QACAO;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAyC/B,mBAAAA,mBAAnC,EAAEgC,YAAY,EAAkB,GAAGhC,kBAAhBiC,yCAAgBjC;QAAjCgC;;IACR,MAAME,yBAAyBjC,yBAAyB;QAAE+B;QAAcG,MAAMZ;IAAiB;IAE/F,MAAqEhB,YAAAA,SAAS;QAC5EK;QACAC;QACAK;QACAH;QACAD;QACAE;QACAC;IACF,IARM,EAAEmB,cAAc,EAAEC,wBAAwB,EAAkB,GAAG9B,WAAhB+B,yCAAgB/B;QAA7D6B;QAAgBC;;IAUxB,MAAME,mBAAmBnC;IAEzB,MAAMoC,WAAWtC,WAAW+B,aAAaK,aAAaC,kBAAkB;QACtEf;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,qBACE,oBAAC5B;QACCkB,eAAetB,WACbsB,+CAEAa,wBACAE;OAEEI,UACArB,0BAEJ,oBAACd,0BAA0BoC,QAAQ;QAACC,OAAOL;OACxCf;AAIT;AAEA;;CAEC,GACD,OAAO,SAASqB,eAAkBC,KAAwB;IACxD,OACE,AAACA,CAAAA,MAAMnC,IAAI,KAAKoC,aACdD,MAAMlC,OAAO,KAAKmC,aAClBD,MAAMjC,cAAc,KAAKkC,aACzBD,MAAME,SAAS,KAAK,OAAM,KAC5B,CAACF,MAAMG,QAAQ;AAEnB;AAEA;;;;;;;CAOC,GACD,SAASC,UAAa,EACpBF,SAAS,EACTpC,OAAO,EACPC,cAAc,EACdF,IAAI,EACJsC,QAAQ,EACc;IACtB,IAAID,cAAcD,WAAW;QAC3B,OAAO;YAAEC;QAAU;IACrB,OAAO,IAAIrC,SAASoC,WAAW;QAC7B,OAAO;YAAE,aAAa;YAAK,iBAAiBE;QAAS;IACvD,OAAO,IAAIrC,YAAYmC,aAAalC,mBAAmBkC,WAAW;QAChE,OAAO;YACL,aAAa;YACb,QAAQ;YACR,YAAYE,WAAWF,YAAY;YACnC,iBAAiBE;QACnB;IACF;IAEA,OAAO,CAAC;AACV;AAEA;;;;;;;;;;;CAWC,GACD,OAAO,MAAME,YAAY;QAAK,EAC5B1B,mBAAmB,QAAQ,EAC3BF,eAAe6B,iBAAiB,EAEd,WADf/B;QAFHI;QACAF;;IAGA,MAAM8B,cAAcH,UAAU7B;IAC9B,MAAMiC,cAAcT,eAAexB;IACnC,MAAME,gBAAgBtB,WAAWmD;IAEjC,IAAIE,aAAa;QACf,qBACE,oBAAChC;YACCC,eAAeA;YACfE,kBAAkBA;WACd4B,aACAhC;IAGV;IAEA,qBAAO,oBAACX;QAAaa,eAAeA;OAAmB8B,aAAiBhC;AAC1E,EAAE"}
+{"version":3,"sources":["../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport {\n  FocusVisibleModeProps,\n  useFocusVisibleClassName,\n} from '../../hooks/useFocusVisibleClassName';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { RootComponent, RootComponentProps } from '../RootComponent/RootComponent';\nimport { useKeyboard } from './useKeyboard';\nimport {\n  ClickableLockStateContext,\n  DEFAULT_ACTIVE_EFFECT_DELAY,\n  StateProps,\n  useState,\n} from './useState';\nimport styles from './Clickable.module.css';\n\nexport interface ClickableProps<T = HTMLElement>\n  extends RootComponentProps<T>,\n    FocusVisibleModeProps,\n    StateProps {}\n\n/**\n * Некликабельный компонент. Отключаем возможность нажимать на компонент.\n */\nconst NonClickable = <T,>({\n  href,\n  onClick,\n  onClickCapture,\n  activeClassName,\n  hoverClassName,\n  hasActive,\n  hasHover,\n  hovered,\n  activated,\n  activeEffectDelay,\n  ...restProps\n}: ClickableProps<T>) => <RootComponent {...restProps} />;\n\n/**\n * Кликабельный компонент. Добавляем кучу обвесов\n */\nconst RealClickable = <T,>({\n  baseClassName,\n  children,\n  focusVisibleMode = 'inside',\n  activeClassName,\n  hoverClassName,\n  activeEffectDelay = DEFAULT_ACTIVE_EFFECT_DELAY,\n  hasHover = true,\n  hasActive = true,\n  hovered,\n  activated,\n  onPointerEnter,\n  onPointerLeave,\n  onPointerDown,\n  onPointerCancel,\n  onPointerUp,\n  onBlur,\n  onFocus,\n  onKeyDown,\n  ...restProps\n}: ClickableProps<T>) => {\n  const { focusVisible, ...focusEvents } = useFocusVisible();\n  const focusVisibleClassNames = useFocusVisibleClassName({ focusVisible, mode: focusVisibleMode });\n\n  const { stateClassName, setLockBubblingImmediate, ...stateEvents } = useState({\n    activeClassName,\n    hoverClassName,\n    activeEffectDelay,\n    hasHover,\n    hasActive,\n    hovered,\n    activated,\n  });\n\n  const keyboardHandlers = useKeyboard();\n\n  const handlers = mergeCalls(focusEvents, stateEvents, keyboardHandlers, {\n    onPointerEnter,\n    onPointerLeave,\n    onPointerDown,\n    onPointerCancel,\n    onPointerUp,\n    onBlur,\n    onFocus,\n    onKeyDown,\n  });\n\n  return (\n    <RootComponent\n      baseClassName={classNames(\n        baseClassName,\n        styles['Clickable__realClickable'],\n        focusVisibleClassNames,\n        stateClassName,\n      )}\n      {...handlers}\n      {...restProps}\n    >\n      <ClickableLockStateContext.Provider value={setLockBubblingImmediate}>\n        {children}\n      </ClickableLockStateContext.Provider>\n    </RootComponent>\n  );\n};\n\n/**\n * Проверяем, является ли компонент кликабельным\n */\nexport function checkClickable<T>(props: ClickableProps<T>): boolean {\n  return (\n    (props.href !== undefined ||\n      props.onClick !== undefined ||\n      props.onClickCapture !== undefined ||\n      props.Component === 'label') &&\n    !props.disabled\n  );\n}\n\n/**\n * Определяет правильный компонент и его свойства\n *\n * - если передан Component, используем его\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n */\nfunction component<T>({\n  Component,\n  onClick,\n  onClickCapture,\n  href,\n  disabled,\n}: RootComponentProps<T>): RootComponentProps<T> {\n  if (Component !== undefined) {\n    return { Component };\n  } else if (href !== undefined) {\n    return { 'Component': 'a', 'aria-disabled': disabled };\n  } else if (onClick !== undefined || onClickCapture !== undefined) {\n    return {\n      'Component': 'div',\n      'role': 'button',\n      'tabIndex': disabled ? undefined : 0,\n      'aria-disabled': disabled,\n    };\n  }\n\n  return {};\n}\n\nconst getUserAgentResetClassName = (Component?: React.ElementType) => {\n  if (Component === 'a') {\n    return styles.Clickable__resetLinkStyle;\n  }\n  if (Component === 'button') {\n    return styles.Clickable__resetButtonStyle;\n  }\n  return;\n};\n\n/**\n * Базовый кликабельный корневой компонент.\n *\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n *\n * Отвечает за:\n *\n * - стейты наведения и нажатия\n * - a11y компонентов\n */\nexport const Clickable = <T,>({\n  focusVisibleMode = 'inside',\n  baseClassName: baseClassNameProp,\n  ...restProps\n}: ClickableProps<T>) => {\n  const commonProps = component(restProps);\n  const isClickable = checkClickable(restProps);\n  const baseClassName = classNames(\n    baseClassNameProp,\n    getUserAgentResetClassName(commonProps.Component),\n    styles['Clickable__host'],\n  );\n\n  if (isClickable) {\n    return (\n      <RealClickable\n        baseClassName={baseClassName}\n        focusVisibleMode={focusVisibleMode}\n        {...commonProps}\n        {...restProps}\n      />\n    );\n  }\n\n  return <NonClickable baseClassName={baseClassName} {...commonProps} {...restProps} />;\n};\n"],"names":["React","classNames","useFocusVisible","useFocusVisibleClassName","mergeCalls","RootComponent","useKeyboard","ClickableLockStateContext","DEFAULT_ACTIVE_EFFECT_DELAY","useState","NonClickable","href","onClick","onClickCapture","activeClassName","hoverClassName","hasActive","hasHover","hovered","activated","activeEffectDelay","restProps","RealClickable","baseClassName","children","focusVisibleMode","onPointerEnter","onPointerLeave","onPointerDown","onPointerCancel","onPointerUp","onBlur","onFocus","onKeyDown","focusVisible","focusEvents","focusVisibleClassNames","mode","stateClassName","setLockBubblingImmediate","stateEvents","keyboardHandlers","handlers","Provider","value","checkClickable","props","undefined","Component","disabled","component","getUserAgentResetClassName","Clickable","baseClassNameProp","commonProps","isClickable"],"mappings":"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"}

package/dist/components/CustomScrollView/CustomScrollView.d.ts

@@ -5,7 +5,7 @@ export interface CustomScrollViewProps extends React.AllHTMLAttributes<HTMLDivEl
     windowResize?: boolean;
     boxRef?: React.Ref<HTMLDivElement>;
     className?: HTMLDivElement['className'];
-    onScroll?(event: React.UIEvent<HTMLDivElement>): void;
+    onScroll?: (event: React.UIEvent<HTMLDivElement>) => void;
     children: React.ReactNode;
 }
 export declare const CustomScrollView: ({ className, children, boxRef: externalBoxRef, windowResize, autoHideScrollbar, autoHideScrollbarDelay, onScroll, getRootRef, ...restProps }: CustomScrollViewProps) => React.JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"CustomScrollView.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAwB,MAAM,wBAAwB,CAAC;AAenF,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,EAC7C,UAAU,CAAC,cAAc,CAAC,EAC1B,mBAAmB;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,QAAQ,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC;IACtD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,iJAU1B,qBAAqB,sBA8KvB,CAAC"}
+{"version":3,"file":"CustomScrollView.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,mBAAmB,EAAwB,MAAM,wBAAwB,CAAC;AAenF,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAAC,EAC7C,UAAU,CAAC,cAAc,CAAC,EAC1B,mBAAmB;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,cAAc,CAAC,WAAW,CAAC,CAAC;IACxC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC1D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,gBAAgB,iJAU1B,qBAAqB,sBA8KvB,CAAC"}

package/dist/components/CustomScrollView/CustomScrollView.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { stopPropagation } from '../../lib/utils';\nimport type { HasRootRef } from '../../types';\nimport { TrackerOptionsProps, useTrackerVisibility } from './useTrackerVisibility';\nimport styles from './CustomScrollView.module.css';\n\nfunction hasPointerClassName(hasPointer: boolean | undefined) {\n  switch (hasPointer) {\n    case true:\n      return styles['CustomScrollView--hasPointer-true'];\n    case false:\n      return styles['CustomScrollView--hasPointer-false'];\n    case undefined:\n    default:\n      return styles['CustomScrollView--hasPointer-none'];\n  }\n}\n\nexport interface CustomScrollViewProps\n  extends React.AllHTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    TrackerOptionsProps {\n  windowResize?: boolean;\n  boxRef?: React.Ref<HTMLDivElement>;\n  className?: HTMLDivElement['className'];\n  onScroll?(event: React.UIEvent<HTMLDivElement>): void;\n  children: React.ReactNode;\n}\n\nexport const CustomScrollView = ({\n  className,\n  children,\n  boxRef: externalBoxRef,\n  windowResize,\n  autoHideScrollbar = false,\n  autoHideScrollbarDelay,\n  onScroll,\n  getRootRef,\n  ...restProps\n}: CustomScrollViewProps) => {\n  const { document, window } = useDOM();\n  const { hasPointer } = useAdaptivity();\n\n  const ratio = React.useRef(NaN);\n  const lastTrackerTop = React.useRef(0);\n  const clientHeight = React.useRef(0);\n  const trackerHeight = React.useRef(0);\n  const scrollHeight = React.useRef(0);\n  const transformProp = React.useRef('');\n  const startY = React.useRef(0);\n  const trackerTop = React.useRef(0);\n\n  const boxRef = useExternRef(externalBoxRef);\n\n  const barY = React.useRef<HTMLDivElement>(null);\n  const trackerY = React.useRef<HTMLDivElement>(null);\n\n  const setTrackerPosition = (scrollTop: number) => {\n    lastTrackerTop.current = scrollTop;\n    if (trackerY.current !== null) {\n      (trackerY.current.style as any)[transformProp.current] = `translate(0, ${scrollTop}px)`;\n    }\n  };\n\n  const setTrackerPositionFromScroll = (scrollTop: number) => {\n    const progress = scrollTop / (scrollHeight.current - clientHeight.current);\n    setTrackerPosition((clientHeight.current - trackerHeight.current) * progress);\n  };\n\n  const resize = () => {\n    if (!boxRef.current || !barY.current || !trackerY.current) {\n      return;\n    }\n    const localClientHeight = boxRef.current.clientHeight;\n    const localScrollHeight = boxRef.current.scrollHeight;\n    const localRatio = localClientHeight / localScrollHeight;\n    const localTrackerHeight = Math.max(localClientHeight * localRatio, 40);\n\n    ratio.current = localRatio;\n    clientHeight.current = localClientHeight;\n    scrollHeight.current = localScrollHeight;\n    trackerHeight.current = localTrackerHeight;\n\n    if (localRatio >= 1) {\n      barY.current.style.display = 'none';\n    } else {\n      barY.current.style.display = '';\n      trackerY.current.style.height = `${localTrackerHeight}px`;\n      setTrackerPositionFromScroll(boxRef.current.scrollTop);\n    }\n  };\n\n  const resizeHandler = useEventListener('resize', resize);\n\n  useIsomorphicLayoutEffect(() => {\n    if (windowResize && window) {\n      resizeHandler.add(window);\n    }\n  }, [windowResize, window]);\n\n  useIsomorphicLayoutEffect(() => {\n    let style = trackerY.current?.style;\n    let prop = '';\n    if (style !== undefined) {\n      if ('transform' in style) {\n        prop = 'transform';\n      } else if ('webkitTransform' in style) {\n        prop = 'webkitTransform';\n      }\n    }\n    transformProp.current = prop;\n  }, []);\n\n  useIsomorphicLayoutEffect(resize);\n\n  const setScrollPositionFromTracker = (trackerTop: number) => {\n    const progress = trackerTop / (clientHeight.current - trackerHeight.current);\n    if (boxRef.current !== null) {\n      boxRef.current.scrollTop = (scrollHeight.current - clientHeight.current) * progress;\n    }\n  };\n\n  const onMove = (e: MouseEvent) => {\n    e.preventDefault();\n    const diff = e.clientY - startY.current;\n    const position = Math.min(\n      Math.max(trackerTop.current + diff, 0),\n      clientHeight.current - trackerHeight.current,\n    );\n\n    setScrollPositionFromTracker(position);\n  };\n\n  const {\n    trackerVisible,\n    onTargetScroll,\n    onTrackerDragStart,\n    onTrackerDragStop,\n    onTrackerMouseEnter,\n    onTrackerMouseLeave,\n  } = useTrackerVisibility(autoHideScrollbar, autoHideScrollbarDelay);\n\n  const onUp = (e: MouseEvent) => {\n    e.preventDefault();\n\n    if (autoHideScrollbar) {\n      onTrackerDragStop();\n    }\n\n    unsubscribe();\n  };\n\n  const scroll = (event: React.UIEvent<HTMLDivElement>) => {\n    if (ratio.current >= 1 || !boxRef.current) {\n      return;\n    }\n\n    if (autoHideScrollbar) {\n      onTargetScroll();\n    }\n\n    setTrackerPositionFromScroll(boxRef.current.scrollTop);\n    onScroll?.(event);\n  };\n\n  const listeners = [useEventListener('mousemove', onMove), useEventListener('mouseup', onUp)];\n\n  function subscribe(el: Document | undefined) {\n    if (el) {\n      listeners.forEach((l) => l.add(el));\n    }\n  }\n\n  function unsubscribe() {\n    listeners.forEach((l) => l.remove());\n  }\n\n  const onDragStart = (e: React.MouseEvent) => {\n    e.preventDefault();\n    startY.current = e.clientY;\n    trackerTop.current = lastTrackerTop.current;\n\n    if (autoHideScrollbar) {\n      onTrackerDragStart();\n    }\n\n    subscribe(document);\n  };\n\n  return (\n    <div\n      className={classNames(className, styles['CustomScrollView'], hasPointerClassName(hasPointer))}\n      ref={getRootRef}\n      {...restProps}\n    >\n      <div className={styles['CustomScrollView__box']} tabIndex={-1} ref={boxRef} onScroll={scroll}>\n        {children}\n      </div>\n\n      <div className={styles['CustomScrollView__barY']} ref={barY} onClick={stopPropagation}>\n        <div\n          className={classNames(\n            styles['CustomScrollView__trackerY'],\n            !trackerVisible && styles['CustomScrollView__trackerY--hidden'],\n          )}\n          onMouseEnter={autoHideScrollbar ? onTrackerMouseEnter : undefined}\n          onMouseLeave={autoHideScrollbar ? onTrackerMouseLeave : undefined}\n          ref={trackerY}\n          onMouseDown={onDragStart}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useEventListener","useExternRef","useDOM","useIsomorphicLayoutEffect","stopPropagation","useTrackerVisibility","hasPointerClassName","hasPointer","undefined","CustomScrollView","className","children","boxRef","externalBoxRef","windowResize","autoHideScrollbar","autoHideScrollbarDelay","onScroll","getRootRef","restProps","document","window","ratio","useRef","NaN","lastTrackerTop","clientHeight","trackerHeight","scrollHeight","transformProp","startY","trackerTop","barY","trackerY","setTrackerPosition","scrollTop","current","style","setTrackerPositionFromScroll","progress","resize","localClientHeight","localScrollHeight","localRatio","localTrackerHeight","Math","max","display","height","resizeHandler","add","prop","setScrollPositionFromTracker","onMove","e","preventDefault","diff","clientY","position","min","trackerVisible","onTargetScroll","onTrackerDragStart","onTrackerDragStop","onTrackerMouseEnter","onTrackerMouseLeave","onUp","unsubscribe","scroll","event","listeners","subscribe","el","forEach","l","remove","onDragStart","div","ref","tabIndex","onClick","onMouseEnter","onMouseLeave","onMouseDown"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/CustomScrollView/CustomScrollView.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { stopPropagation } from '../../lib/utils';\nimport type { HasRootRef } from '../../types';\nimport { TrackerOptionsProps, useTrackerVisibility } from './useTrackerVisibility';\nimport styles from './CustomScrollView.module.css';\n\nfunction hasPointerClassName(hasPointer: boolean | undefined) {\n  switch (hasPointer) {\n    case true:\n      return styles['CustomScrollView--hasPointer-true'];\n    case false:\n      return styles['CustomScrollView--hasPointer-false'];\n    case undefined:\n    default:\n      return styles['CustomScrollView--hasPointer-none'];\n  }\n}\n\nexport interface CustomScrollViewProps\n  extends React.AllHTMLAttributes<HTMLDivElement>,\n    HasRootRef<HTMLDivElement>,\n    TrackerOptionsProps {\n  windowResize?: boolean;\n  boxRef?: React.Ref<HTMLDivElement>;\n  className?: HTMLDivElement['className'];\n  onScroll?: (event: React.UIEvent<HTMLDivElement>) => void;\n  children: React.ReactNode;\n}\n\nexport const CustomScrollView = ({\n  className,\n  children,\n  boxRef: externalBoxRef,\n  windowResize,\n  autoHideScrollbar = false,\n  autoHideScrollbarDelay,\n  onScroll,\n  getRootRef,\n  ...restProps\n}: CustomScrollViewProps) => {\n  const { document, window } = useDOM();\n  const { hasPointer } = useAdaptivity();\n\n  const ratio = React.useRef(NaN);\n  const lastTrackerTop = React.useRef(0);\n  const clientHeight = React.useRef(0);\n  const trackerHeight = React.useRef(0);\n  const scrollHeight = React.useRef(0);\n  const transformProp = React.useRef('');\n  const startY = React.useRef(0);\n  const trackerTop = React.useRef(0);\n\n  const boxRef = useExternRef(externalBoxRef);\n\n  const barY = React.useRef<HTMLDivElement>(null);\n  const trackerY = React.useRef<HTMLDivElement>(null);\n\n  const setTrackerPosition = (scrollTop: number) => {\n    lastTrackerTop.current = scrollTop;\n    if (trackerY.current !== null) {\n      (trackerY.current.style as any)[transformProp.current] = `translate(0, ${scrollTop}px)`;\n    }\n  };\n\n  const setTrackerPositionFromScroll = (scrollTop: number) => {\n    const progress = scrollTop / (scrollHeight.current - clientHeight.current);\n    setTrackerPosition((clientHeight.current - trackerHeight.current) * progress);\n  };\n\n  const resize = () => {\n    if (!boxRef.current || !barY.current || !trackerY.current) {\n      return;\n    }\n    const localClientHeight = boxRef.current.clientHeight;\n    const localScrollHeight = boxRef.current.scrollHeight;\n    const localRatio = localClientHeight / localScrollHeight;\n    const localTrackerHeight = Math.max(localClientHeight * localRatio, 40);\n\n    ratio.current = localRatio;\n    clientHeight.current = localClientHeight;\n    scrollHeight.current = localScrollHeight;\n    trackerHeight.current = localTrackerHeight;\n\n    if (localRatio >= 1) {\n      barY.current.style.display = 'none';\n    } else {\n      barY.current.style.display = '';\n      trackerY.current.style.height = `${localTrackerHeight}px`;\n      setTrackerPositionFromScroll(boxRef.current.scrollTop);\n    }\n  };\n\n  const resizeHandler = useEventListener('resize', resize);\n\n  useIsomorphicLayoutEffect(() => {\n    if (windowResize && window) {\n      resizeHandler.add(window);\n    }\n  }, [windowResize, window]);\n\n  useIsomorphicLayoutEffect(() => {\n    let style = trackerY.current?.style;\n    let prop = '';\n    if (style !== undefined) {\n      if ('transform' in style) {\n        prop = 'transform';\n      } else if ('webkitTransform' in style) {\n        prop = 'webkitTransform';\n      }\n    }\n    transformProp.current = prop;\n  }, []);\n\n  useIsomorphicLayoutEffect(resize);\n\n  const setScrollPositionFromTracker = (trackerTop: number) => {\n    const progress = trackerTop / (clientHeight.current - trackerHeight.current);\n    if (boxRef.current !== null) {\n      boxRef.current.scrollTop = (scrollHeight.current - clientHeight.current) * progress;\n    }\n  };\n\n  const onMove = (e: MouseEvent) => {\n    e.preventDefault();\n    const diff = e.clientY - startY.current;\n    const position = Math.min(\n      Math.max(trackerTop.current + diff, 0),\n      clientHeight.current - trackerHeight.current,\n    );\n\n    setScrollPositionFromTracker(position);\n  };\n\n  const {\n    trackerVisible,\n    onTargetScroll,\n    onTrackerDragStart,\n    onTrackerDragStop,\n    onTrackerMouseEnter,\n    onTrackerMouseLeave,\n  } = useTrackerVisibility(autoHideScrollbar, autoHideScrollbarDelay);\n\n  const onUp = (e: MouseEvent) => {\n    e.preventDefault();\n\n    if (autoHideScrollbar) {\n      onTrackerDragStop();\n    }\n\n    unsubscribe();\n  };\n\n  const scroll = (event: React.UIEvent<HTMLDivElement>) => {\n    if (ratio.current >= 1 || !boxRef.current) {\n      return;\n    }\n\n    if (autoHideScrollbar) {\n      onTargetScroll();\n    }\n\n    setTrackerPositionFromScroll(boxRef.current.scrollTop);\n    onScroll?.(event);\n  };\n\n  const listeners = [useEventListener('mousemove', onMove), useEventListener('mouseup', onUp)];\n\n  function subscribe(el: Document | undefined) {\n    if (el) {\n      listeners.forEach((l) => l.add(el));\n    }\n  }\n\n  function unsubscribe() {\n    listeners.forEach((l) => l.remove());\n  }\n\n  const onDragStart = (e: React.MouseEvent) => {\n    e.preventDefault();\n    startY.current = e.clientY;\n    trackerTop.current = lastTrackerTop.current;\n\n    if (autoHideScrollbar) {\n      onTrackerDragStart();\n    }\n\n    subscribe(document);\n  };\n\n  return (\n    <div\n      className={classNames(className, styles['CustomScrollView'], hasPointerClassName(hasPointer))}\n      ref={getRootRef}\n      {...restProps}\n    >\n      <div className={styles['CustomScrollView__box']} tabIndex={-1} ref={boxRef} onScroll={scroll}>\n        {children}\n      </div>\n\n      <div className={styles['CustomScrollView__barY']} ref={barY} onClick={stopPropagation}>\n        <div\n          className={classNames(\n            styles['CustomScrollView__trackerY'],\n            !trackerVisible && styles['CustomScrollView__trackerY--hidden'],\n          )}\n          onMouseEnter={autoHideScrollbar ? onTrackerMouseEnter : undefined}\n          onMouseLeave={autoHideScrollbar ? onTrackerMouseLeave : undefined}\n          ref={trackerY}\n          onMouseDown={onDragStart}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["React","classNames","useAdaptivity","useEventListener","useExternRef","useDOM","useIsomorphicLayoutEffect","stopPropagation","useTrackerVisibility","hasPointerClassName","hasPointer","undefined","CustomScrollView","className","children","boxRef","externalBoxRef","windowResize","autoHideScrollbar","autoHideScrollbarDelay","onScroll","getRootRef","restProps","document","window","ratio","useRef","NaN","lastTrackerTop","clientHeight","trackerHeight","scrollHeight","transformProp","startY","trackerTop","barY","trackerY","setTrackerPosition","scrollTop","current","style","setTrackerPositionFromScroll","progress","resize","localClientHeight","localScrollHeight","localRatio","localTrackerHeight","Math","max","display","height","resizeHandler","add","prop","setScrollPositionFromTracker","onMove","e","preventDefault","diff","clientY","position","min","trackerVisible","onTargetScroll","onTrackerDragStart","onTrackerDragStop","onTrackerMouseEnter","onTrackerMouseLeave","onUp","unsubscribe","scroll","event","listeners","subscribe","el","forEach","l","remove","onDragStart","div","ref","tabIndex","onClick","onMouseEnter","onMouseLeave","onMouseDown"],"mappings":"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"}

package/dist/components/CustomScrollView/useTrackerVisibility.d.ts

@@ -23,22 +23,22 @@ export interface TrackerVisibilityProps {
     /**
      * Функция для обработки события у блока со скроллом
      */
-    onTargetScroll(this: void): void;
+    onTargetScroll: (this: void) => void;
     /**
      * Функция для обработки начала drag event ползунка
      */
-    onTrackerDragStart(this: void): void;
+    onTrackerDragStart: (this: void) => void;
     /**
      * Функция для обработки окончания drag event ползунка
      */
-    onTrackerDragStop(this: void): void;
+    onTrackerDragStop: (this: void) => void;
     /**
      * Функция для обработки mouseLeave event ползунка
      */
-    onTrackerMouseEnter(this: void): void;
+    onTrackerMouseEnter: (this: void) => void;
     /**
      * Функция для обработки mouseEnter event ползунка
      */
-    onTrackerMouseLeave(this: void): void;
+    onTrackerMouseLeave: (this: void) => void;
 }
 //# sourceMappingURL=useTrackerVisibility.d.ts.map

package/dist/components/CustomScrollView/useTrackerVisibility.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useTrackerVisibility.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/useTrackerVisibility.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,oEAG9B,sBA0DF,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,cAAc,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IACjC;;OAEG;IACH,kBAAkB,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IACrC;;OAEG;IACH,iBAAiB,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IACpC;;OAEG;IACH,mBAAmB,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IACtC;;OAEG;IACH,mBAAmB,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;CACvC"}
+{"version":3,"file":"useTrackerVisibility.d.ts","sourceRoot":"","sources":["../../../src/components/CustomScrollView/useTrackerVisibility.ts"],"names":[],"mappings":"AAGA;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,oEAG9B,sBA0DF,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACjC;AAED,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,cAAc,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,cAAc,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACrC;;OAEG;IACH,kBAAkB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACzC;;OAEG;IACH,iBAAiB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,mBAAmB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC1C;;OAEG;IACH,mBAAmB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;CAC3C"}

package/dist/components/CustomScrollView/useTrackerVisibility.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CustomScrollView/useTrackerVisibility.ts"],"sourcesContent":["import * as React from 'react';\nimport { useTimeout } from '../../hooks/useTimeout';\n\n/**\n * Хук, который позволяет управлять видимостью ползунка скроллбара.\n * @param autoHideScrollbar - скрывать ли ползунок скроллбара\n * @param autoHideScrollbarDelay - через какое кол-во миллисекунд ползунок скроллбара скрывается\n * @returns Объект, содержащий параметры, которые позволяют управлять видимостью ползунка\n */\nexport const useTrackerVisibility = (\n  autoHideScrollbar = false,\n  autoHideScrollbarDelay = 500,\n): TrackerVisibilityProps => {\n  const [trackerVisible, setTrackerVisible] = React.useState(!autoHideScrollbar);\n  const isMouseOver = React.useRef(false);\n  const isTrackerDragging = React.useRef(false);\n\n  const { set: setVisibilityTimeout, clear: clearVisibilityTimeout } = useTimeout(\n    () => setTrackerVisible(false),\n    autoHideScrollbarDelay,\n  );\n\n  const onTrackerDragStart = React.useCallback(() => {\n    clearVisibilityTimeout();\n    setTrackerVisible(true);\n    isTrackerDragging.current = true;\n  }, [clearVisibilityTimeout]);\n\n  const onTrackerDragStop = React.useCallback(() => {\n    isTrackerDragging.current = false;\n    if (!isMouseOver.current) {\n      setVisibilityTimeout();\n    }\n  }, [setVisibilityTimeout, isMouseOver]);\n\n  /**\n   * Позволяет \"запланировать\" скрытие ползунка через delay миллисекунд. Если тайм-аут не успевает сработать, то каждый\n   * последующий вызов функции откладывает скрытие ползунка на delay миллисекунд\n   */\n  const queueTrackerVisibility = React.useCallback(() => {\n    if (isTrackerDragging.current) {\n      return;\n    }\n    setTrackerVisible(true);\n    setVisibilityTimeout();\n  }, [setVisibilityTimeout]);\n\n  const onTrackerMouseEnter = React.useCallback(() => {\n    clearVisibilityTimeout();\n    isMouseOver.current = true;\n    setTrackerVisible(true);\n  }, [clearVisibilityTimeout]);\n\n  const onTrackerMouseLeave = React.useCallback(() => {\n    queueTrackerVisibility();\n    isMouseOver.current = false;\n  }, [queueTrackerVisibility]);\n\n  const onTargetScroll = React.useCallback(() => {\n    queueTrackerVisibility();\n  }, [queueTrackerVisibility]);\n\n  return {\n    trackerVisible,\n    onTrackerDragStart,\n    onTrackerDragStop,\n    onTrackerMouseEnter,\n    onTrackerMouseLeave,\n    onTargetScroll,\n  };\n};\n\nexport interface TrackerOptionsProps {\n  /**\n   * Скрывать ли ползунок скроллбара\n   */\n  autoHideScrollbar?: boolean;\n  /**\n   * Через какое кол-во миллисекунд ползунок скроллбара скрывается\n   */\n  autoHideScrollbarDelay?: number;\n}\n\nexport interface TrackerVisibilityProps {\n  /**\n   * Отвечает за видимость ползунка\n   */\n  trackerVisible: boolean;\n  /**\n   * Функция для обработки события у блока со скроллом\n   */\n  onTargetScroll(this: void): void;\n  /**\n   * Функция для обработки начала drag event ползунка\n   */\n  onTrackerDragStart(this: void): void;\n  /**\n   * Функция для обработки окончания drag event ползунка\n   */\n  onTrackerDragStop(this: void): void;\n  /**\n   * Функция для обработки mouseLeave event ползунка\n   */\n  onTrackerMouseEnter(this: void): void;\n  /**\n   * Функция для обработки mouseEnter event ползунка\n   */\n  onTrackerMouseLeave(this: void): void;\n}\n"],"names":["React","useTimeout","useTrackerVisibility","autoHideScrollbar","autoHideScrollbarDelay","trackerVisible","setTrackerVisible","useState","isMouseOver","useRef","isTrackerDragging","set","setVisibilityTimeout","clear","clearVisibilityTimeout","onTrackerDragStart","useCallback","current","onTrackerDragStop","queueTrackerVisibility","onTrackerMouseEnter","onTrackerMouseLeave","onTargetScroll"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,yBAAyB;AAEpD;;;;;CAKC,GACD,OAAO,MAAMC,uBAAuB,CAClCC,oBAAoB,KAAK,EACzBC,yBAAyB,GAAG;IAE5B,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGN,MAAMO,QAAQ,CAAC,CAACJ;IAC5D,MAAMK,cAAcR,MAAMS,MAAM,CAAC;IACjC,MAAMC,oBAAoBV,MAAMS,MAAM,CAAC;IAEvC,MAAM,EAAEE,KAAKC,oBAAoB,EAAEC,OAAOC,sBAAsB,EAAE,GAAGb,WACnE,IAAMK,kBAAkB,QACxBF;IAGF,MAAMW,qBAAqBf,MAAMgB,WAAW,CAAC;QAC3CF;QACAR,kBAAkB;QAClBI,kBAAkBO,OAAO,GAAG;IAC9B,GAAG;QAACH;KAAuB;IAE3B,MAAMI,oBAAoBlB,MAAMgB,WAAW,CAAC;QAC1CN,kBAAkBO,OAAO,GAAG;QAC5B,IAAI,CAACT,YAAYS,OAAO,EAAE;YACxBL;QACF;IACF,GAAG;QAACA;QAAsBJ;KAAY;IAEtC;;;GAGC,GACD,MAAMW,yBAAyBnB,MAAMgB,WAAW,CAAC;QAC/C,IAAIN,kBAAkBO,OAAO,EAAE;YAC7B;QACF;QACAX,kBAAkB;QAClBM;IACF,GAAG;QAACA;KAAqB;IAEzB,MAAMQ,sBAAsBpB,MAAMgB,WAAW,CAAC;QAC5CF;QACAN,YAAYS,OAAO,GAAG;QACtBX,kBAAkB;IACpB,GAAG;QAACQ;KAAuB;IAE3B,MAAMO,sBAAsBrB,MAAMgB,WAAW,CAAC;QAC5CG;QACAX,YAAYS,OAAO,GAAG;IACxB,GAAG;QAACE;KAAuB;IAE3B,MAAMG,iBAAiBtB,MAAMgB,WAAW,CAAC;QACvCG;IACF,GAAG;QAACA;KAAuB;IAE3B,OAAO;QACLd;QACAU;QACAG;QACAE;QACAC;QACAC;IACF;AACF,EAAE"}
+{"version":3,"sources":["../../../src/components/CustomScrollView/useTrackerVisibility.ts"],"sourcesContent":["import * as React from 'react';\nimport { useTimeout } from '../../hooks/useTimeout';\n\n/**\n * Хук, который позволяет управлять видимостью ползунка скроллбара.\n * @param autoHideScrollbar - скрывать ли ползунок скроллбара\n * @param autoHideScrollbarDelay - через какое кол-во миллисекунд ползунок скроллбара скрывается\n * @returns Объект, содержащий параметры, которые позволяют управлять видимостью ползунка\n */\nexport const useTrackerVisibility = (\n  autoHideScrollbar = false,\n  autoHideScrollbarDelay = 500,\n): TrackerVisibilityProps => {\n  const [trackerVisible, setTrackerVisible] = React.useState(!autoHideScrollbar);\n  const isMouseOver = React.useRef(false);\n  const isTrackerDragging = React.useRef(false);\n\n  const { set: setVisibilityTimeout, clear: clearVisibilityTimeout } = useTimeout(\n    () => setTrackerVisible(false),\n    autoHideScrollbarDelay,\n  );\n\n  const onTrackerDragStart = React.useCallback(() => {\n    clearVisibilityTimeout();\n    setTrackerVisible(true);\n    isTrackerDragging.current = true;\n  }, [clearVisibilityTimeout]);\n\n  const onTrackerDragStop = React.useCallback(() => {\n    isTrackerDragging.current = false;\n    if (!isMouseOver.current) {\n      setVisibilityTimeout();\n    }\n  }, [setVisibilityTimeout, isMouseOver]);\n\n  /**\n   * Позволяет \"запланировать\" скрытие ползунка через delay миллисекунд. Если тайм-аут не успевает сработать, то каждый\n   * последующий вызов функции откладывает скрытие ползунка на delay миллисекунд\n   */\n  const queueTrackerVisibility = React.useCallback(() => {\n    if (isTrackerDragging.current) {\n      return;\n    }\n    setTrackerVisible(true);\n    setVisibilityTimeout();\n  }, [setVisibilityTimeout]);\n\n  const onTrackerMouseEnter = React.useCallback(() => {\n    clearVisibilityTimeout();\n    isMouseOver.current = true;\n    setTrackerVisible(true);\n  }, [clearVisibilityTimeout]);\n\n  const onTrackerMouseLeave = React.useCallback(() => {\n    queueTrackerVisibility();\n    isMouseOver.current = false;\n  }, [queueTrackerVisibility]);\n\n  const onTargetScroll = React.useCallback(() => {\n    queueTrackerVisibility();\n  }, [queueTrackerVisibility]);\n\n  return {\n    trackerVisible,\n    onTrackerDragStart,\n    onTrackerDragStop,\n    onTrackerMouseEnter,\n    onTrackerMouseLeave,\n    onTargetScroll,\n  };\n};\n\nexport interface TrackerOptionsProps {\n  /**\n   * Скрывать ли ползунок скроллбара\n   */\n  autoHideScrollbar?: boolean;\n  /**\n   * Через какое кол-во миллисекунд ползунок скроллбара скрывается\n   */\n  autoHideScrollbarDelay?: number;\n}\n\nexport interface TrackerVisibilityProps {\n  /**\n   * Отвечает за видимость ползунка\n   */\n  trackerVisible: boolean;\n  /**\n   * Функция для обработки события у блока со скроллом\n   */\n  onTargetScroll: (this: void) => void;\n  /**\n   * Функция для обработки начала drag event ползунка\n   */\n  onTrackerDragStart: (this: void) => void;\n  /**\n   * Функция для обработки окончания drag event ползунка\n   */\n  onTrackerDragStop: (this: void) => void;\n  /**\n   * Функция для обработки mouseLeave event ползунка\n   */\n  onTrackerMouseEnter: (this: void) => void;\n  /**\n   * Функция для обработки mouseEnter event ползунка\n   */\n  onTrackerMouseLeave: (this: void) => void;\n}\n"],"names":["React","useTimeout","useTrackerVisibility","autoHideScrollbar","autoHideScrollbarDelay","trackerVisible","setTrackerVisible","useState","isMouseOver","useRef","isTrackerDragging","set","setVisibilityTimeout","clear","clearVisibilityTimeout","onTrackerDragStart","useCallback","current","onTrackerDragStop","queueTrackerVisibility","onTrackerMouseEnter","onTrackerMouseLeave","onTargetScroll"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,yBAAyB;AAEpD;;;;;CAKC,GACD,OAAO,MAAMC,uBAAuB,CAClCC,oBAAoB,KAAK,EACzBC,yBAAyB,GAAG;IAE5B,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGN,MAAMO,QAAQ,CAAC,CAACJ;IAC5D,MAAMK,cAAcR,MAAMS,MAAM,CAAC;IACjC,MAAMC,oBAAoBV,MAAMS,MAAM,CAAC;IAEvC,MAAM,EAAEE,KAAKC,oBAAoB,EAAEC,OAAOC,sBAAsB,EAAE,GAAGb,WACnE,IAAMK,kBAAkB,QACxBF;IAGF,MAAMW,qBAAqBf,MAAMgB,WAAW,CAAC;QAC3CF;QACAR,kBAAkB;QAClBI,kBAAkBO,OAAO,GAAG;IAC9B,GAAG;QAACH;KAAuB;IAE3B,MAAMI,oBAAoBlB,MAAMgB,WAAW,CAAC;QAC1CN,kBAAkBO,OAAO,GAAG;QAC5B,IAAI,CAACT,YAAYS,OAAO,EAAE;YACxBL;QACF;IACF,GAAG;QAACA;QAAsBJ;KAAY;IAEtC;;;GAGC,GACD,MAAMW,yBAAyBnB,MAAMgB,WAAW,CAAC;QAC/C,IAAIN,kBAAkBO,OAAO,EAAE;YAC7B;QACF;QACAX,kBAAkB;QAClBM;IACF,GAAG;QAACA;KAAqB;IAEzB,MAAMQ,sBAAsBpB,MAAMgB,WAAW,CAAC;QAC5CF;QACAN,YAAYS,OAAO,GAAG;QACtBX,kBAAkB;IACpB,GAAG;QAACQ;KAAuB;IAE3B,MAAMO,sBAAsBrB,MAAMgB,WAAW,CAAC;QAC5CG;QACAX,YAAYS,OAAO,GAAG;IACxB,GAAG;QAACE;KAAuB;IAE3B,MAAMG,iBAAiBtB,MAAMgB,WAAW,CAAC;QACvCG;IACF,GAAG;QAACA;KAAuB;IAE3B,OAAO;QACLd;QACAU;QACAG;QACAE;QACAC;QACAC;IACF;AACF,EAAE"}

package/dist/components/CustomSelect/CustomSelectClearButton.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { HasDataAttribute } from '../../types';
 export interface CustomSelectClearButtonProps extends HasDataAttribute {
     className?: string;
-    onClick(): void;
+    onClick: () => void;
     disabled?: boolean;
 }
 export declare const CustomSelectClearButton: ({ className, onClick, ...restProps }: CustomSelectClearButtonProps) => React.JSX.Element;

package/dist/components/CustomSelect/CustomSelectClearButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CustomSelectClearButton.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelect/CustomSelectClearButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,4BAA6B,SAAQ,gBAAgB;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,IAAI,IAAI,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,uBAAuB,yCAIjC,4BAA4B,sBAoB9B,CAAC"}
+{"version":3,"file":"CustomSelectClearButton.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelect/CustomSelectClearButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAG/C,MAAM,WAAW,4BAA6B,SAAQ,gBAAgB;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,uBAAuB,yCAIjC,4BAA4B,sBAoB9B,CAAC"}

package/dist/components/CustomSelect/CustomSelectClearButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CustomSelect/CustomSelectClearButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Cancel } from '@vkontakte/icons';\nimport { stopPropagation } from '../../lib/utils';\nimport { HasDataAttribute } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport interface CustomSelectClearButtonProps extends HasDataAttribute {\n  className?: string;\n  onClick(): void;\n  disabled?: boolean;\n}\n\nexport const CustomSelectClearButton = ({\n  className,\n  onClick,\n  ...restProps\n}: CustomSelectClearButtonProps) => {\n  return (\n    <IconButton\n      Component=\"button\"\n      label=\"Очистить поле\"\n      onKeyDown={stopPropagation}\n      type=\"button\"\n      activeMode=\"opacity\"\n      hoverMode=\"opacity\"\n      {...restProps}\n      className={className}\n      onClick={(e) => {\n        stopPropagation(e);\n        e.preventDefault();\n        onClick();\n      }}\n    >\n      <Icon16Cancel />\n    </IconButton>\n  );\n};\n"],"names":["React","Icon16Cancel","stopPropagation","IconButton","CustomSelectClearButton","className","onClick","restProps","Component","label","onKeyDown","type","activeMode","hoverMode","e","preventDefault"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,eAAe,QAAQ,kBAAkB;AAElD,SAASC,UAAU,QAAQ,2BAA2B;AAQtD,OAAO,MAAMC,0BAA0B;QAAC,EACtCC,SAAS,EACTC,OAAO,EAEsB,WAD1BC;QAFHF;QACAC;;IAGA,qBACE,oBAACH;QACCK,WAAU;QACVC,OAAM;QACNC,WAAWR;QACXS,MAAK;QACLC,YAAW;QACXC,WAAU;OACNN;QACJF,WAAWA;QACXC,SAAS,CAACQ;YACRZ,gBAAgBY;YAChBA,EAAEC,cAAc;YAChBT;QACF;sBAEA,oBAACL;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/CustomSelect/CustomSelectClearButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Icon16Cancel } from '@vkontakte/icons';\nimport { stopPropagation } from '../../lib/utils';\nimport { HasDataAttribute } from '../../types';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport interface CustomSelectClearButtonProps extends HasDataAttribute {\n  className?: string;\n  onClick: () => void;\n  disabled?: boolean;\n}\n\nexport const CustomSelectClearButton = ({\n  className,\n  onClick,\n  ...restProps\n}: CustomSelectClearButtonProps) => {\n  return (\n    <IconButton\n      Component=\"button\"\n      label=\"Очистить поле\"\n      onKeyDown={stopPropagation}\n      type=\"button\"\n      activeMode=\"opacity\"\n      hoverMode=\"opacity\"\n      {...restProps}\n      className={className}\n      onClick={(e) => {\n        stopPropagation(e);\n        e.preventDefault();\n        onClick();\n      }}\n    >\n      <Icon16Cancel />\n    </IconButton>\n  );\n};\n"],"names":["React","Icon16Cancel","stopPropagation","IconButton","CustomSelectClearButton","className","onClick","restProps","Component","label","onKeyDown","type","activeMode","hoverMode","e","preventDefault"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,mBAAmB;AAChD,SAASC,eAAe,QAAQ,kBAAkB;AAElD,SAASC,UAAU,QAAQ,2BAA2B;AAQtD,OAAO,MAAMC,0BAA0B;QAAC,EACtCC,SAAS,EACTC,OAAO,EAEsB,WAD1BC;QAFHF;QACAC;;IAGA,qBACE,oBAACH;QACCK,WAAU;QACVC,OAAM;QACNC,WAAWR;QACXS,MAAK;QACLC,YAAW;QACXC,WAAU;OACNN;QACJF,WAAWA;QACXC,SAAS,CAACQ;YACRZ,gBAAgBY;YAChBA,EAAEC,cAAc;YAChBT;QACF;sBAEA,oBAACL;AAGP,EAAE"}

package/dist/components/CustomSelectDropdown/CustomSelectDropdown.d.ts

@@ -13,7 +13,7 @@ export interface CustomSelectDropdownProps extends HTMLAttributesWithRootRef<HTM
      */
     autoWidth?: boolean;
     forcePortal?: boolean;
-    onPlacementChange?(placement: Placement): void;
+    onPlacementChange?: (placement: Placement) => void;
     /**
      * Отключает максимальную высоту по умолчанию
      */

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

@@ -1 +1 @@
-{"version":3,"file":"CustomSelectDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelectDropdown/CustomSelectDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAK/E,MAAM,WAAW,yBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,mBAAmB;IACrB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,CAAC,SAAS,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/C;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAID,eAAO,MAAM,oBAAoB,oOAe9B,yBAAyB,sBAoD3B,CAAC"}
+{"version":3,"file":"CustomSelectDropdown.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelectDropdown/CustomSelectDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAExD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AAK/E,MAAM,WAAW,yBACf,SAAQ,yBAAyB,CAAC,cAAc,CAAC,EAC/C,mBAAmB;IACrB,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,SAAS,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAID,eAAO,MAAM,oBAAoB,oOAe9B,yBAAyB,sBAoD3B,CAAC"}

package/dist/components/CustomSelectDropdown/CustomSelectDropdown.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/CustomSelectDropdown/CustomSelectDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { Placement } from '../../lib/floating';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CustomScrollView } from '../CustomScrollView/CustomScrollView';\nimport { TrackerOptionsProps } from '../CustomScrollView/useTrackerVisibility';\nimport { Popper } from '../Popper/Popper';\nimport { Spinner } from '../Spinner/Spinner';\nimport styles from './CustomSelectDropdown.module.css';\n\nexport interface CustomSelectDropdownProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    TrackerOptionsProps {\n  targetRef: React.RefObject<HTMLElement>;\n  placement?: Placement;\n  scrollBoxRef?: React.Ref<HTMLDivElement>;\n  fetching?: boolean;\n  offsetDistance?: number;\n  /**\n   * Ширина раскрывающегося списка зависит от контента\n   */\n  autoWidth?: boolean;\n  forcePortal?: boolean;\n  onPlacementChange?(placement: Placement): void;\n  /**\n   * Отключает максимальную высоту по умолчанию\n   */\n  noMaxHeight?: boolean;\n}\n\nconst calcIsTop = (placement: Placement) => placement.startsWith('top');\n\nexport const CustomSelectDropdown = ({\n  children,\n  targetRef,\n  scrollBoxRef,\n  placement = 'bottom',\n  fetching,\n  onPlacementChange: parentOnPlacementChange,\n  offsetDistance = 0,\n  autoWidth = false,\n  forcePortal = true,\n  autoHideScrollbar,\n  autoHideScrollbarDelay,\n  className,\n  noMaxHeight = false,\n  ...restProps\n}: CustomSelectDropdownProps) => {\n  const [isTop, setIsTop] = React.useState(() => calcIsTop(placement));\n\n  const onPlacementChange = React.useCallback(\n    (placement: Placement) => {\n      setIsTop(calcIsTop(placement));\n      if (parentOnPlacementChange) {\n        parentOnPlacementChange(placement);\n      }\n    },\n    [parentOnPlacementChange],\n  );\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetByMainAxis={offsetDistance}\n      sameWidth={!autoWidth}\n      onPlacementChange={onPlacementChange}\n      placement={placement}\n      className={classNames(\n        styles['CustomSelectDropdown'],\n        'vkuiInternalCustomSelectDropdown',\n        offsetDistance === 0 &&\n          (isTop ? styles['CustomSelectDropdown--top'] : styles['CustomSelectDropdown--bottom']),\n        autoWidth &&\n          classNames(\n            styles['CustomSelectDropdown--wide'],\n            'vkuiInternalCustomSelectDropdown--wide',\n          ),\n        className,\n      )}\n      usePortal={forcePortal}\n      autoUpdateOnTargetResize\n      {...restProps}\n    >\n      <CustomScrollView\n        boxRef={scrollBoxRef}\n        className={noMaxHeight ? undefined : styles['CustomSelectDropdown__in--withMaxHeight']}\n        autoHideScrollbar={autoHideScrollbar}\n        autoHideScrollbarDelay={autoHideScrollbarDelay}\n      >\n        {fetching ? (\n          <div className={styles['CustomSelectDropdown__fetching']}>\n            <Spinner size=\"small\" />\n          </div>\n        ) : (\n          children\n        )}\n      </CustomScrollView>\n    </Popper>\n  );\n};\n"],"names":["React","classNames","CustomScrollView","Popper","Spinner","calcIsTop","placement","startsWith","CustomSelectDropdown","children","targetRef","scrollBoxRef","fetching","onPlacementChange","parentOnPlacementChange","offsetDistance","autoWidth","forcePortal","autoHideScrollbar","autoHideScrollbarDelay","className","noMaxHeight","restProps","isTop","setIsTop","useState","useCallback","offsetByMainAxis","sameWidth","usePortal","autoUpdateOnTargetResize","boxRef","undefined","div","size"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,gBAAgB,QAAQ,uCAAuC;AAExE,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,OAAO,QAAQ,qBAAqB;AAuB7C,MAAMC,YAAY,CAACC,YAAyBA,UAAUC,UAAU,CAAC;AAEjE,OAAO,MAAMC,uBAAuB;QAAC,EACnCC,QAAQ,EACRC,SAAS,EACTC,YAAY,EACZL,YAAY,QAAQ,EACpBM,QAAQ,EACRC,mBAAmBC,uBAAuB,EAC1CC,iBAAiB,CAAC,EAClBC,YAAY,KAAK,EACjBC,cAAc,IAAI,EAClBC,iBAAiB,EACjBC,sBAAsB,EACtBC,SAAS,EACTC,cAAc,KAAK,EAEO,WADvBC;QAbHb;QACAC;QACAC;QACAL;QACAM;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,OAAOC,SAAS,GAAGxB,MAAMyB,QAAQ,CAAC,IAAMpB,UAAUC;IAEzD,MAAMO,oBAAoBb,MAAM0B,WAAW,CACzC,CAACpB;QACCkB,SAASnB,UAAUC;QACnB,IAAIQ,yBAAyB;YAC3BA,wBAAwBR;QAC1B;IACF,GACA;QAACQ;KAAwB;IAG3B,qBACE,oBAACX;QACCO,WAAWA;QACXiB,kBAAkBZ;QAClBa,WAAW,CAACZ;QACZH,mBAAmBA;QACnBP,WAAWA;QACXc,WAAWnB,uCAET,oCACAc,mBAAmB,KAChBQ,CAAAA,4EAAmF,GACtFP,aACEf,6CAEE,2CAEJmB;QAEFS,WAAWZ;QACXa,0BAAAA;OACIR,0BAEJ,oBAACpB;QACC6B,QAAQpB;QACRS,WAAWC,cAAcW;QACzBd,mBAAmBA;QACnBC,wBAAwBA;OAEvBP,yBACC,oBAACqB;QAAIb,SAAS;qBACZ,oBAAChB;QAAQ8B,MAAK;UAGhBzB;AAKV,EAAE"}
+{"version":3,"sources":["../../../src/components/CustomSelectDropdown/CustomSelectDropdown.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { Placement } from '../../lib/floating';\nimport { HTMLAttributesWithRootRef } from '../../types';\nimport { CustomScrollView } from '../CustomScrollView/CustomScrollView';\nimport { TrackerOptionsProps } from '../CustomScrollView/useTrackerVisibility';\nimport { Popper } from '../Popper/Popper';\nimport { Spinner } from '../Spinner/Spinner';\nimport styles from './CustomSelectDropdown.module.css';\n\nexport interface CustomSelectDropdownProps\n  extends HTMLAttributesWithRootRef<HTMLDivElement>,\n    TrackerOptionsProps {\n  targetRef: React.RefObject<HTMLElement>;\n  placement?: Placement;\n  scrollBoxRef?: React.Ref<HTMLDivElement>;\n  fetching?: boolean;\n  offsetDistance?: number;\n  /**\n   * Ширина раскрывающегося списка зависит от контента\n   */\n  autoWidth?: boolean;\n  forcePortal?: boolean;\n  onPlacementChange?: (placement: Placement) => void;\n  /**\n   * Отключает максимальную высоту по умолчанию\n   */\n  noMaxHeight?: boolean;\n}\n\nconst calcIsTop = (placement: Placement) => placement.startsWith('top');\n\nexport const CustomSelectDropdown = ({\n  children,\n  targetRef,\n  scrollBoxRef,\n  placement = 'bottom',\n  fetching,\n  onPlacementChange: parentOnPlacementChange,\n  offsetDistance = 0,\n  autoWidth = false,\n  forcePortal = true,\n  autoHideScrollbar,\n  autoHideScrollbarDelay,\n  className,\n  noMaxHeight = false,\n  ...restProps\n}: CustomSelectDropdownProps) => {\n  const [isTop, setIsTop] = React.useState(() => calcIsTop(placement));\n\n  const onPlacementChange = React.useCallback(\n    (placement: Placement) => {\n      setIsTop(calcIsTop(placement));\n      if (parentOnPlacementChange) {\n        parentOnPlacementChange(placement);\n      }\n    },\n    [parentOnPlacementChange],\n  );\n\n  return (\n    <Popper\n      targetRef={targetRef}\n      offsetByMainAxis={offsetDistance}\n      sameWidth={!autoWidth}\n      onPlacementChange={onPlacementChange}\n      placement={placement}\n      className={classNames(\n        styles['CustomSelectDropdown'],\n        'vkuiInternalCustomSelectDropdown',\n        offsetDistance === 0 &&\n          (isTop ? styles['CustomSelectDropdown--top'] : styles['CustomSelectDropdown--bottom']),\n        autoWidth &&\n          classNames(\n            styles['CustomSelectDropdown--wide'],\n            'vkuiInternalCustomSelectDropdown--wide',\n          ),\n        className,\n      )}\n      usePortal={forcePortal}\n      autoUpdateOnTargetResize\n      {...restProps}\n    >\n      <CustomScrollView\n        boxRef={scrollBoxRef}\n        className={noMaxHeight ? undefined : styles['CustomSelectDropdown__in--withMaxHeight']}\n        autoHideScrollbar={autoHideScrollbar}\n        autoHideScrollbarDelay={autoHideScrollbarDelay}\n      >\n        {fetching ? (\n          <div className={styles['CustomSelectDropdown__fetching']}>\n            <Spinner size=\"small\" />\n          </div>\n        ) : (\n          children\n        )}\n      </CustomScrollView>\n    </Popper>\n  );\n};\n"],"names":["React","classNames","CustomScrollView","Popper","Spinner","calcIsTop","placement","startsWith","CustomSelectDropdown","children","targetRef","scrollBoxRef","fetching","onPlacementChange","parentOnPlacementChange","offsetDistance","autoWidth","forcePortal","autoHideScrollbar","autoHideScrollbarDelay","className","noMaxHeight","restProps","isTop","setIsTop","useState","useCallback","offsetByMainAxis","sameWidth","usePortal","autoUpdateOnTargetResize","boxRef","undefined","div","size"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAG7C,SAASC,gBAAgB,QAAQ,uCAAuC;AAExE,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,OAAO,QAAQ,qBAAqB;AAuB7C,MAAMC,YAAY,CAACC,YAAyBA,UAAUC,UAAU,CAAC;AAEjE,OAAO,MAAMC,uBAAuB;QAAC,EACnCC,QAAQ,EACRC,SAAS,EACTC,YAAY,EACZL,YAAY,QAAQ,EACpBM,QAAQ,EACRC,mBAAmBC,uBAAuB,EAC1CC,iBAAiB,CAAC,EAClBC,YAAY,KAAK,EACjBC,cAAc,IAAI,EAClBC,iBAAiB,EACjBC,sBAAsB,EACtBC,SAAS,EACTC,cAAc,KAAK,EAEO,WADvBC;QAbHb;QACAC;QACAC;QACAL;QACAM;QACAC;QACAE;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAM,CAACE,OAAOC,SAAS,GAAGxB,MAAMyB,QAAQ,CAAC,IAAMpB,UAAUC;IAEzD,MAAMO,oBAAoBb,MAAM0B,WAAW,CACzC,CAACpB;QACCkB,SAASnB,UAAUC;QACnB,IAAIQ,yBAAyB;YAC3BA,wBAAwBR;QAC1B;IACF,GACA;QAACQ;KAAwB;IAG3B,qBACE,oBAACX;QACCO,WAAWA;QACXiB,kBAAkBZ;QAClBa,WAAW,CAACZ;QACZH,mBAAmBA;QACnBP,WAAWA;QACXc,WAAWnB,uCAET,oCACAc,mBAAmB,KAChBQ,CAAAA,4EAAmF,GACtFP,aACEf,6CAEE,2CAEJmB;QAEFS,WAAWZ;QACXa,0BAAAA;OACIR,0BAEJ,oBAACpB;QACC6B,QAAQpB;QACRS,WAAWC,cAAcW;QACzBd,mBAAmBA;QACnBC,wBAAwBA;OAEvBP,yBACC,oBAACqB;QAAIb,SAAS;qBACZ,oBAAChB;QAAQ8B,MAAK;UAGhBzB;AAKV,EAAE"}

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

@@ -4,7 +4,7 @@ export interface FocusTrapProps<T extends HTMLElement = HTMLElement> extends Rea
     autoFocus?: boolean;
     restoreFocus?: boolean | (() => boolean);
     timeout?: number;
-    onClose?(): void;
+    onClose?: () => void;
 }
 /**
  * @see https://vkcom.github.io/VKUI/#/FocusTrap

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":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIvD,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CACjE,SAAQ,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAChC,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,GAAG,CAAC,MAAM,OAAO,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,IAAI,IAAI,CAAC;CAClB;AAED;;GAEG;AACH,eAAO,MAAM,SAAS,6KAmJrB,CAAC"}
+{"version":3,"file":"FocusTrap.d.ts","sourceRoot":"","sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIvD,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,WAAW,GAAG,WAAW,CACjE,SAAQ,KAAK,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAChC,UAAU,CAAC,CAAC,CAAC,EACb,YAAY;IACd,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,GAAG,CAAC,MAAM,OAAO,CAAC,CAAC;IACzC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;GAEG;AACH,eAAO,MAAM,SAAS,6KAmJrB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { FOCUSABLE_ELEMENTS_LIST, Keys, pressedKey } from '../../lib/accessibility';\nimport {\n  contains,\n  getActiveElementByAnotherElement,\n  getWindow,\n  isHTMLElement,\n} from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\n\nconst FOCUSABLE_ELEMENTS: string = FOCUSABLE_ELEMENTS_LIST.join();\nexport interface FocusTrapProps<T extends HTMLElement = HTMLElement>\n  extends React.AllHTMLAttributes<T>,\n    HasRootRef<T>,\n    HasComponent {\n  autoFocus?: boolean;\n  restoreFocus?: boolean | (() => boolean);\n  timeout?: number;\n  onClose?(): void;\n}\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  timeout = 0,\n  getRootRef,\n  children,\n  ...restProps\n}: FocusTrapProps<T>) => {\n  const ref = useExternRef<T>(getRootRef);\n\n  const { keyboardInput } = React.useContext(AppRootContext);\n  const focusableNodesRef = React.useRef<HTMLElement[]>([]);\n\n  useIsomorphicLayoutEffect(\n    function collectFocusableNodesRef() {\n      if (!ref.current) {\n        return;\n      }\n\n      const nodes: HTMLElement[] = [];\n      // eslint-disable-next-line no-restricted-properties\n      ref.current.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS).forEach((focusableEl) => {\n        const { display, visibility } = getComputedStyle(focusableEl);\n        if (display !== 'none' && visibility !== 'hidden') {\n          nodes.push(focusableEl);\n        }\n      });\n\n      if (nodes.length === 0) {\n        // Чтобы фокус был хотя бы на родителе\n        nodes.push(ref.current);\n      }\n\n      focusableNodesRef.current = nodes;\n    },\n    [children],\n  );\n\n  useIsomorphicLayoutEffect(\n    function tryToAutoFocusToFirstNode() {\n      if (!ref.current || !autoFocus || !keyboardInput) {\n        return;\n      }\n      const autoFocusToFirstNode = () => {\n        if (!ref.current || !focusableNodesRef.current.length) {\n          return;\n        }\n        const activeElement = getActiveElementByAnotherElement(ref.current);\n        if (!contains(ref.current, activeElement)) {\n          focusableNodesRef.current[0].focus();\n        }\n      };\n      const timeoutId = setTimeout(autoFocusToFirstNode, timeout);\n      return () => {\n        clearTimeout(timeoutId);\n      };\n    },\n    [autoFocus, timeout, keyboardInput],\n  );\n\n  useIsomorphicLayoutEffect(\n    function tryToRestoreFocusOnUnmount() {\n      if (!ref.current || !restoreFocus) {\n        return;\n      }\n\n      const restoreFocusTo = getActiveElementByAnotherElement(ref.current);\n\n      return () => {\n        const shouldRestoreFocus =\n          typeof restoreFocus === 'function' ? restoreFocus() : restoreFocus;\n\n        if (!shouldRestoreFocus || !isHTMLElement(restoreFocusTo)) {\n          return;\n        }\n\n        setTimeout(() => {\n          if (restoreFocusTo) {\n            restoreFocusTo.focus();\n          }\n        }, timeout);\n      };\n    },\n    [restoreFocus, timeout],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (!ref.current) {\n      return;\n    }\n\n    const onDocumentKeydown = (event: KeyboardEvent) => {\n      const pressedKeyResult = pressedKey(event);\n\n      switch (pressedKeyResult) {\n        case Keys.TAB: {\n          if (!focusableNodesRef.current.length) {\n            return false;\n          }\n\n          const lastIdx = focusableNodesRef.current.length - 1;\n          const targetIdx = focusableNodesRef.current.findIndex((node) => node === event.target);\n\n          const shouldFocusFirstNode =\n            targetIdx === -1 || (targetIdx === lastIdx && !event.shiftKey);\n\n          if (shouldFocusFirstNode || (targetIdx === 0 && event.shiftKey)) {\n            event.preventDefault();\n\n            const node = focusableNodesRef.current[shouldFocusFirstNode ? 0 : lastIdx];\n\n            if (node !== getActiveElementByAnotherElement(node)) {\n              node.focus();\n            }\n\n            return false;\n          }\n\n          break;\n        }\n        case Keys.ESCAPE: {\n          if (onClose) {\n            event.preventDefault();\n            onClose();\n          }\n        }\n      }\n\n      return true;\n    };\n\n    const doc = getWindow(ref.current).document;\n    doc.addEventListener('keydown', onDocumentKeydown, {\n      capture: true,\n    });\n    return () => {\n      doc.removeEventListener('keydown', onDocumentKeydown, true);\n    };\n  }, [onClose, ref]);\n\n  return (\n    <Component tabIndex={-1} ref={ref} {...restProps}>\n      {children}\n    </Component>\n  );\n};\n"],"names":["React","useExternRef","FOCUSABLE_ELEMENTS_LIST","Keys","pressedKey","contains","getActiveElementByAnotherElement","getWindow","isHTMLElement","useIsomorphicLayoutEffect","AppRootContext","FOCUSABLE_ELEMENTS","join","FocusTrap","Component","onClose","autoFocus","restoreFocus","timeout","getRootRef","children","restProps","ref","keyboardInput","useContext","focusableNodesRef","useRef","collectFocusableNodesRef","current","nodes","querySelectorAll","forEach","focusableEl","display","visibility","getComputedStyle","push","length","tryToAutoFocusToFirstNode","autoFocusToFirstNode","activeElement","focus","timeoutId","setTimeout","clearTimeout","tryToRestoreFocusOnUnmount","restoreFocusTo","shouldRestoreFocus","onDocumentKeydown","event","pressedKeyResult","TAB","lastIdx","targetIdx","findIndex","node","target","shouldFocusFirstNode","shiftKey","preventDefault","ESCAPE","doc","document","addEventListener","capture","removeEventListener","tabIndex"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/FocusTrap/FocusTrap.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { FOCUSABLE_ELEMENTS_LIST, Keys, pressedKey } from '../../lib/accessibility';\nimport {\n  contains,\n  getActiveElementByAnotherElement,\n  getWindow,\n  isHTMLElement,\n} from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { HasComponent, HasRootRef } from '../../types';\nimport { AppRootContext } from '../AppRoot/AppRootContext';\n\nconst FOCUSABLE_ELEMENTS: string = FOCUSABLE_ELEMENTS_LIST.join();\nexport interface FocusTrapProps<T extends HTMLElement = HTMLElement>\n  extends React.AllHTMLAttributes<T>,\n    HasRootRef<T>,\n    HasComponent {\n  autoFocus?: boolean;\n  restoreFocus?: boolean | (() => boolean);\n  timeout?: number;\n  onClose?: () => void;\n}\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  timeout = 0,\n  getRootRef,\n  children,\n  ...restProps\n}: FocusTrapProps<T>) => {\n  const ref = useExternRef<T>(getRootRef);\n\n  const { keyboardInput } = React.useContext(AppRootContext);\n  const focusableNodesRef = React.useRef<HTMLElement[]>([]);\n\n  useIsomorphicLayoutEffect(\n    function collectFocusableNodesRef() {\n      if (!ref.current) {\n        return;\n      }\n\n      const nodes: HTMLElement[] = [];\n      // eslint-disable-next-line no-restricted-properties\n      ref.current.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS).forEach((focusableEl) => {\n        const { display, visibility } = getComputedStyle(focusableEl);\n        if (display !== 'none' && visibility !== 'hidden') {\n          nodes.push(focusableEl);\n        }\n      });\n\n      if (nodes.length === 0) {\n        // Чтобы фокус был хотя бы на родителе\n        nodes.push(ref.current);\n      }\n\n      focusableNodesRef.current = nodes;\n    },\n    [children],\n  );\n\n  useIsomorphicLayoutEffect(\n    function tryToAutoFocusToFirstNode() {\n      if (!ref.current || !autoFocus || !keyboardInput) {\n        return;\n      }\n      const autoFocusToFirstNode = () => {\n        if (!ref.current || !focusableNodesRef.current.length) {\n          return;\n        }\n        const activeElement = getActiveElementByAnotherElement(ref.current);\n        if (!contains(ref.current, activeElement)) {\n          focusableNodesRef.current[0].focus();\n        }\n      };\n      const timeoutId = setTimeout(autoFocusToFirstNode, timeout);\n      return () => {\n        clearTimeout(timeoutId);\n      };\n    },\n    [autoFocus, timeout, keyboardInput],\n  );\n\n  useIsomorphicLayoutEffect(\n    function tryToRestoreFocusOnUnmount() {\n      if (!ref.current || !restoreFocus) {\n        return;\n      }\n\n      const restoreFocusTo = getActiveElementByAnotherElement(ref.current);\n\n      return () => {\n        const shouldRestoreFocus =\n          typeof restoreFocus === 'function' ? restoreFocus() : restoreFocus;\n\n        if (!shouldRestoreFocus || !isHTMLElement(restoreFocusTo)) {\n          return;\n        }\n\n        setTimeout(() => {\n          if (restoreFocusTo) {\n            restoreFocusTo.focus();\n          }\n        }, timeout);\n      };\n    },\n    [restoreFocus, timeout],\n  );\n\n  useIsomorphicLayoutEffect(() => {\n    if (!ref.current) {\n      return;\n    }\n\n    const onDocumentKeydown = (event: KeyboardEvent) => {\n      const pressedKeyResult = pressedKey(event);\n\n      switch (pressedKeyResult) {\n        case Keys.TAB: {\n          if (!focusableNodesRef.current.length) {\n            return false;\n          }\n\n          const lastIdx = focusableNodesRef.current.length - 1;\n          const targetIdx = focusableNodesRef.current.findIndex((node) => node === event.target);\n\n          const shouldFocusFirstNode =\n            targetIdx === -1 || (targetIdx === lastIdx && !event.shiftKey);\n\n          if (shouldFocusFirstNode || (targetIdx === 0 && event.shiftKey)) {\n            event.preventDefault();\n\n            const node = focusableNodesRef.current[shouldFocusFirstNode ? 0 : lastIdx];\n\n            if (node !== getActiveElementByAnotherElement(node)) {\n              node.focus();\n            }\n\n            return false;\n          }\n\n          break;\n        }\n        case Keys.ESCAPE: {\n          if (onClose) {\n            event.preventDefault();\n            onClose();\n          }\n        }\n      }\n\n      return true;\n    };\n\n    const doc = getWindow(ref.current).document;\n    doc.addEventListener('keydown', onDocumentKeydown, {\n      capture: true,\n    });\n    return () => {\n      doc.removeEventListener('keydown', onDocumentKeydown, true);\n    };\n  }, [onClose, ref]);\n\n  return (\n    <Component tabIndex={-1} ref={ref} {...restProps}>\n      {children}\n    </Component>\n  );\n};\n"],"names":["React","useExternRef","FOCUSABLE_ELEMENTS_LIST","Keys","pressedKey","contains","getActiveElementByAnotherElement","getWindow","isHTMLElement","useIsomorphicLayoutEffect","AppRootContext","FOCUSABLE_ELEMENTS","join","FocusTrap","Component","onClose","autoFocus","restoreFocus","timeout","getRootRef","children","restProps","ref","keyboardInput","useContext","focusableNodesRef","useRef","collectFocusableNodesRef","current","nodes","querySelectorAll","forEach","focusableEl","display","visibility","getComputedStyle","push","length","tryToAutoFocusToFirstNode","autoFocusToFirstNode","activeElement","focus","timeoutId","setTimeout","clearTimeout","tryToRestoreFocusOnUnmount","restoreFocusTo","shouldRestoreFocus","onDocumentKeydown","event","pressedKeyResult","TAB","lastIdx","targetIdx","findIndex","node","target","shouldFocusFirstNode","shiftKey","preventDefault","ESCAPE","doc","document","addEventListener","capture","removeEventListener","tabIndex"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,uBAAuB,EAAEC,IAAI,EAAEC,UAAU,QAAQ,0BAA0B;AACpF,SACEC,QAAQ,EACRC,gCAAgC,EAChCC,SAAS,EACTC,aAAa,QACR,gBAAgB;AACvB,SAASC,yBAAyB,QAAQ,sCAAsC;AAEhF,SAASC,cAAc,QAAQ,4BAA4B;AAE3D,MAAMC,qBAA6BT,wBAAwBU,IAAI;AAW/D;;CAEC,GACD,OAAO,MAAMC,YAAY;QAAsC,EAC7DC,YAAY,KAAK,EACjBC,OAAO,EACPC,YAAY,IAAI,EAChBC,eAAe,IAAI,EACnBC,UAAU,CAAC,EACXC,UAAU,EACVC,QAAQ,EAEU,WADfC;QAPHP;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,MAAME,MAAMrB,aAAgBkB;IAE5B,MAAM,EAAEI,aAAa,EAAE,GAAGvB,MAAMwB,UAAU,CAACd;IAC3C,MAAMe,oBAAoBzB,MAAM0B,MAAM,CAAgB,EAAE;IAExDjB,0BACE,SAASkB;QACP,IAAI,CAACL,IAAIM,OAAO,EAAE;YAChB;QACF;QAEA,MAAMC,QAAuB,EAAE;QAC/B,oDAAoD;QACpDP,IAAIM,OAAO,CAACE,gBAAgB,CAAcnB,oBAAoBoB,OAAO,CAAC,CAACC;YACrE,MAAM,EAAEC,OAAO,EAAEC,UAAU,EAAE,GAAGC,iBAAiBH;YACjD,IAAIC,YAAY,UAAUC,eAAe,UAAU;gBACjDL,MAAMO,IAAI,CAACJ;YACb;QACF;QAEA,IAAIH,MAAMQ,MAAM,KAAK,GAAG;YACtB,sCAAsC;YACtCR,MAAMO,IAAI,CAACd,IAAIM,OAAO;QACxB;QAEAH,kBAAkBG,OAAO,GAAGC;IAC9B,GACA;QAACT;KAAS;IAGZX,0BACE,SAAS6B;QACP,IAAI,CAAChB,IAAIM,OAAO,IAAI,CAACZ,aAAa,CAACO,eAAe;YAChD;QACF;QACA,MAAMgB,uBAAuB;YAC3B,IAAI,CAACjB,IAAIM,OAAO,IAAI,CAACH,kBAAkBG,OAAO,CAACS,MAAM,EAAE;gBACrD;YACF;YACA,MAAMG,gBAAgBlC,iCAAiCgB,IAAIM,OAAO;YAClE,IAAI,CAACvB,SAASiB,IAAIM,OAAO,EAAEY,gBAAgB;gBACzCf,kBAAkBG,OAAO,CAAC,EAAE,CAACa,KAAK;YACpC;QACF;QACA,MAAMC,YAAYC,WAAWJ,sBAAsBrB;QACnD,OAAO;YACL0B,aAAaF;QACf;IACF,GACA;QAAC1B;QAAWE;QAASK;KAAc;IAGrCd,0BACE,SAASoC;QACP,IAAI,CAACvB,IAAIM,OAAO,IAAI,CAACX,cAAc;YACjC;QACF;QAEA,MAAM6B,iBAAiBxC,iCAAiCgB,IAAIM,OAAO;QAEnE,OAAO;YACL,MAAMmB,qBACJ,OAAO9B,iBAAiB,aAAaA,iBAAiBA;YAExD,IAAI,CAAC8B,sBAAsB,CAACvC,cAAcsC,iBAAiB;gBACzD;YACF;YAEAH,WAAW;gBACT,IAAIG,gBAAgB;oBAClBA,eAAeL,KAAK;gBACtB;YACF,GAAGvB;QACL;IACF,GACA;QAACD;QAAcC;KAAQ;IAGzBT,0BAA0B;QACxB,IAAI,CAACa,IAAIM,OAAO,EAAE;YAChB;QACF;QAEA,MAAMoB,oBAAoB,CAACC;YACzB,MAAMC,mBAAmB9C,WAAW6C;YAEpC,OAAQC;gBACN,KAAK/C,KAAKgD,GAAG;oBAAE;wBACb,IAAI,CAAC1B,kBAAkBG,OAAO,CAACS,MAAM,EAAE;4BACrC,OAAO;wBACT;wBAEA,MAAMe,UAAU3B,kBAAkBG,OAAO,CAACS,MAAM,GAAG;wBACnD,MAAMgB,YAAY5B,kBAAkBG,OAAO,CAAC0B,SAAS,CAAC,CAACC,OAASA,SAASN,MAAMO,MAAM;wBAErF,MAAMC,uBACJJ,cAAc,CAAC,KAAMA,cAAcD,WAAW,CAACH,MAAMS,QAAQ;wBAE/D,IAAID,wBAAyBJ,cAAc,KAAKJ,MAAMS,QAAQ,EAAG;4BAC/DT,MAAMU,cAAc;4BAEpB,MAAMJ,OAAO9B,kBAAkBG,OAAO,CAAC6B,uBAAuB,IAAIL,QAAQ;4BAE1E,IAAIG,SAASjD,iCAAiCiD,OAAO;gCACnDA,KAAKd,KAAK;4BACZ;4BAEA,OAAO;wBACT;wBAEA;oBACF;gBACA,KAAKtC,KAAKyD,MAAM;oBAAE;wBAChB,IAAI7C,SAAS;4BACXkC,MAAMU,cAAc;4BACpB5C;wBACF;oBACF;YACF;YAEA,OAAO;QACT;QAEA,MAAM8C,MAAMtD,UAAUe,IAAIM,OAAO,EAAEkC,QAAQ;QAC3CD,IAAIE,gBAAgB,CAAC,WAAWf,mBAAmB;YACjDgB,SAAS;QACX;QACA,OAAO;YACLH,IAAII,mBAAmB,CAAC,WAAWjB,mBAAmB;QACxD;IACF,GAAG;QAACjC;QAASO;KAAI;IAEjB,qBACE,oBAACR;QAAUoD,UAAU,CAAC;QAAG5C,KAAKA;OAASD,YACpCD;AAGP,EAAE"}

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

@@ -5,7 +5,7 @@ export interface InputLikeProps extends RootComponentProps<HTMLSpanElement> {
     index: number;
     value?: string;
     label?: string;
-    onElementSelect?(index: number): void;
+    onElementSelect?: (index: number) => void;
 }
 export declare const InputLike: {
     ({ value, length, index, onElementSelect, onClick, onFocus, label, ...restProps }: InputLikeProps): React.JSX.Element;

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":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,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,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACvC;AAgBD,eAAO,MAAM,SAAS;uFASnB,cAAc;;CA4BhB,CAAC"}
+{"version":3,"file":"InputLike.d.ts","sourceRoot":"","sources":["../../../src/components/InputLike/InputLike.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,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;uFASnB,cAAc;;CA4BhB,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * 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['InputLike__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['InputLike--full'] : undefined}\n      tabIndex={0}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\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['InputLike__last_character']}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </RootComponent>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","key","className","InputLike","value","onElementSelect","onClick","onFocus","label","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice","displayName"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,eAAe,QAAQ,kBAAkB;AAClD,SAASC,aAAa,QAAiC,iCAAiC;AACxF,SAASC,cAAc,QAAQ,mCAAmC;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,oBAACC;YAAKC,KAAKH;YAAOI,SAAS;WACxBV;IAGP;IACA,OAAOK;AACT;AAEA,OAAO,MAAMM,YAAY;QAAC,EACxBC,KAAK,EACLR,MAAM,EACNE,KAAK,EACLO,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,KAAK,EAEU,WADZC;QAPHL;QACAR;QACAE;QACAO;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBvB,MAAMwB,WAAW,CAC3C,CAACC;QACCvB,gBAAgBuB;QAChBP,4BAAAA,sCAAAA,gBAAkBP;IACpB,GACA;QAACA;QAAOO;KAAgB;QAmBKD;IAhB/B,qBACE,oBAACd;QACCuB,WAAU;QACVC,eAAeV,CAAAA,kBAAAA,4BAAAA,MAAOR,MAAM,MAAKA,iCAAqCmB;QACtEC,UAAU;QACVV,SAASlB,aAAakB,SAASI;QAC/BH,SAASnB,aAAaC,iBAAiBkB;OACnCE,YAEHD,uBAAS,oBAACjB,sBAAgBiB,QAC1BJ,kBAAAA,4BAAAA,MAAOa,KAAK,CAAC,GAAGrB,SAAS,IACzBQ,CAAAA,kBAAAA,4BAAAA,MAAOa,KAAK,CAACrB,SAAS,qBACrB,oBAACI;QAAKC,KAAKH;QAAOI,SAAS;OACxBE,MAAMa,KAAK,CAACrB,SAAS,KAGzBD,gBAAgBC,SAAUQ,CAAAA,CAAAA,gBAAAA,kBAAAA,4BAAAA,MAAOR,MAAM,cAAbQ,2BAAAA,gBAAiB,CAAA;AAGlD,EAAE;AAEFD,UAAUe,WAAW,GAAG"}
+{"version":3,"sources":["../../../src/components/InputLike/InputLike.tsx"],"sourcesContent":["import * 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['InputLike__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['InputLike--full'] : undefined}\n      tabIndex={0}\n      onClick={callMultiple(onClick, handleElementSelect)}\n      onFocus={callMultiple(stopPropagation, onFocus)}\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['InputLike__last_character']}>\n          {value.slice(length - 1)}\n        </span>\n      )}\n      {getMaskElements(length - (value?.length ?? 0))}\n    </RootComponent>\n  );\n};\n\nInputLike.displayName = 'InputLike';\n"],"names":["React","callMultiple","stopPropagation","RootComponent","VisuallyHidden","MASK_SYMBOL","String","fromCharCode","getMaskElements","length","result","index","push","span","key","className","InputLike","value","onElementSelect","onClick","onFocus","label","restProps","handleElementSelect","useCallback","event","Component","baseClassName","undefined","tabIndex","slice","displayName"],"mappings":";;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,yBAAyB;AACtD,SAASC,eAAe,QAAQ,kBAAkB;AAClD,SAASC,aAAa,QAAiC,iCAAiC;AACxF,SAASC,cAAc,QAAQ,mCAAmC;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,oBAACC;YAAKC,KAAKH;YAAOI,SAAS;WACxBV;IAGP;IACA,OAAOK;AACT;AAEA,OAAO,MAAMM,YAAY;QAAC,EACxBC,KAAK,EACLR,MAAM,EACNE,KAAK,EACLO,eAAe,EACfC,OAAO,EACPC,OAAO,EACPC,KAAK,EAEU,WADZC;QAPHL;QACAR;QACAE;QACAO;QACAC;QACAC;QACAC;;IAGA,MAAME,sBAAsBvB,MAAMwB,WAAW,CAC3C,CAACC;QACCvB,gBAAgBuB;QAChBP,4BAAAA,sCAAAA,gBAAkBP;IACpB,GACA;QAACA;QAAOO;KAAgB;QAmBKD;IAhB/B,qBACE,oBAACd;QACCuB,WAAU;QACVC,eAAeV,CAAAA,kBAAAA,4BAAAA,MAAOR,MAAM,MAAKA,iCAAqCmB;QACtEC,UAAU;QACVV,SAASlB,aAAakB,SAASI;QAC/BH,SAASnB,aAAaC,iBAAiBkB;OACnCE,YAEHD,uBAAS,oBAACjB,sBAAgBiB,QAC1BJ,kBAAAA,4BAAAA,MAAOa,KAAK,CAAC,GAAGrB,SAAS,IACzBQ,CAAAA,kBAAAA,4BAAAA,MAAOa,KAAK,CAACrB,SAAS,qBACrB,oBAACI;QAAKC,KAAKH;QAAOI,SAAS;OACxBE,MAAMa,KAAK,CAACrB,SAAS,KAGzBD,gBAAgBC,SAAUQ,CAAAA,CAAAA,gBAAAA,kBAAAA,4BAAAA,MAAOR,MAAM,cAAbQ,2BAAAA,gBAAiB,CAAA;AAGlD,EAAE;AAEFD,UAAUe,WAAW,GAAG"}

package/dist/components/ModalRoot/ModalRootContext.d.ts

@@ -6,7 +6,7 @@ type ModalRefs = {
 };
 export interface ModalRootContextInterface {
     updateModalHeight: VoidFunction;
-    registerModal(data: ModalRegistryEntry): void;
+    registerModal: (data: ModalRegistryEntry) => void;
     onClose?: VoidFunction;
     isInsideModal: boolean;
 }