@vkontakte/vkui 5.4.3 → 5.5.1

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, noop } from '@vkontakte/vkjs';\nimport { useChipsSelect } from '../../hooks/useChipsSelect';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipOption, ChipValue, RenderChip } from '../Chip/Chip';\nimport { ChipsInputProps } from '../ChipsInput/ChipsInput';\nimport { ChipsInputBase, chipsInputDefaultProps } from '../ChipsInputBase/ChipsInputBase';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './ChipsSelect.module.css';\n\nexport interface ChipsSelectProps<Option extends ChipOption>\n  extends Omit<ChipsInputProps<Option>, 'after'> {\n  popupDirection?: 'top' | 'bottom';\n  options?: Option[];\n  filterFn?:\n    | false\n    | ((\n        value?: string,\n        option?: Option,\n        getOptionLabel?: Pick<ChipsInputProps<Option>, 'getOptionLabel'>['getOptionLabel'],\n      ) => boolean);\n  /**\n   * Возможность создавать чипы которых нет в списке (по enter или с помощью пункта в меню, см creatableText)\n   */\n  creatable?: boolean;\n  /**\n   * Отрисовка лоадера вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  renderOption?: (props: CustomSelectOptionProps) => React.ReactNode;\n  /**\n   * Показывать или скрывать уже выбранные опции\n   */\n  showSelected?: boolean;\n  /**\n   * Текст для пункта создающего чипы при клике, так же отвечает за то будет ли показан этот пункт (показывается после того как в списке не отсанется опций)\n   */\n  creatableText?: string;\n  /**\n   * Текст который показывается если список опций пуст\n   */\n  emptyText?: string;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?: (e: React.MouseEvent | React.KeyboardEvent, option: Option) => void;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  fixDropdownWidth?: boolean;\n  forceDropdownPortal?: boolean;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n}\n\ntype FocusActionType = 'next' | 'prev';\n\nconst FOCUS_ACTION_NEXT: FocusActionType = 'next';\nconst FOCUS_ACTION_PREV: FocusActionType = 'prev';\n\nconst chipsSelectDefaultProps: ChipsSelectProps<any> = {\n  ...chipsInputDefaultProps,\n  emptyText: 'Ничего не найдено',\n  creatableText: 'Создать значение',\n  onChangeStart: noop,\n  creatable: false,\n  fetching: false,\n  showSelected: true,\n  closeAfterSelect: true,\n  options: [],\n  filterFn: defaultFilterFn,\n  renderOption(props) {\n    return <CustomSelectOption {...props} />;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>(props: ChipsSelectProps<Option>) => {\n  const propsWithDefault = { ...chipsSelectDefaultProps, ...props };\n  const {\n    style,\n    onFocus,\n    onKeyDown,\n    className,\n    fetching,\n    renderOption,\n    emptyText,\n    getRef,\n    getRootRef,\n    disabled,\n    placeholder,\n    tabIndex,\n    getOptionValue,\n    getOptionLabel,\n    showSelected,\n    getNewOptionData,\n    renderChip,\n    popupDirection,\n    creatable,\n    filterFn,\n    inputValue,\n    creatableText,\n    closeAfterSelect,\n    onChangeStart,\n    before,\n    icon,\n    options,\n    fixDropdownWidth,\n    forceDropdownPortal,\n    ...restProps\n  } = propsWithDefault;\n\n  const { document } = useDOM();\n\n  const [popperPlacement, setPopperPlacement] = React.useState<Placement | undefined>(undefined);\n\n  const scrollBoxRef = React.useRef<HTMLDivElement>(null);\n  const rootRef = useExternRef(getRef);\n  const {\n    fieldValue,\n    selectedOptions = [],\n    opened,\n    setOpened,\n    addOptionFromInput,\n    filteredOptions,\n    addOption,\n    handleInputChange,\n    clearInput,\n    focusedOption,\n    setFocusedOption,\n    focusedOptionIndex,\n    setFocusedOptionIndex,\n  } = useChipsSelect(propsWithDefault);\n\n  const showCreatable = Boolean(\n    creatable && creatableText && !filteredOptions.length && fieldValue,\n  );\n\n  const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setOpened(true);\n    setFocusedOptionIndex(null);\n    onFocus!(e);\n  };\n\n  const handleClickOutside = (e: MouseEvent) => {\n    if (e.target !== rootRef.current && !rootRef.current?.contains(e.target as Node)) {\n      setOpened(false);\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = scrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\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    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 } = filteredOptions;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\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      index = index + 1;\n    } else if (type === FOCUS_ACTION_PREV) {\n      index = index - 1;\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown!(e);\n\n    if (e.key === 'ArrowUp' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_PREV);\n      }\n    }\n\n    if (e.key === 'ArrowDown' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_NEXT);\n      }\n    }\n\n    if (e.key === 'Enter' && !e.defaultPrevented && opened && focusedOptionIndex != null) {\n      const option = filteredOptions[focusedOptionIndex];\n\n      if (option) {\n        onChangeStart!(e, option);\n\n        if (!e.defaultPrevented) {\n          addOption(option);\n          setFocusedOptionIndex(null);\n          clearInput();\n          closeAfterSelect && setOpened(false);\n          e.preventDefault();\n        }\n      } else if (!creatable) {\n        e.preventDefault();\n      }\n    }\n\n    if (['Escape', 'Tab'].includes(e.key) && !e.defaultPrevented && opened) {\n      setOpened(false);\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex != null && filteredOptions[focusedOptionIndex]) {\n      setFocusedOption(filteredOptions[focusedOptionIndex]);\n    } else if (focusedOptionIndex === null || focusedOptionIndex === 0) {\n      setFocusedOption(null);\n    }\n  }, [focusedOptionIndex, filteredOptions, setFocusedOption]);\n\n  useGlobalEventListener(document, 'click', handleClickOutside);\n\n  const renderChipWrapper = (renderChipProps: RenderChip<Option> | undefined) => {\n    if (renderChipProps === undefined) {\n      return null;\n    }\n    const onRemoveWrapper = (e: React.MouseEvent | undefined, value: ChipValue | undefined) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      renderChipProps.onRemove?.(e, value);\n    };\n\n    return renderChip!({\n      ...renderChipProps,\n      onRemove: onRemoveWrapper,\n    });\n  };\n\n  const isPopperDirectionTop = popperPlacement?.includes('top');\n\n  const onPlacementChange = React.useCallback(\n    (placement?: Placement) => {\n      setPopperPlacement(placement);\n    },\n    [setPopperPlacement],\n  );\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const toggleOpened = () => {\n    setOpened((prevOpened) => !prevOpened);\n  };\n\n  return (\n    <>\n      <FormField\n        getRootRef={rootRef}\n        style={style}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            (isPopperDirectionTop\n              ? styles['ChipsSelect--pop-up']\n              : styles['ChipsSelect--pop-down']),\n          className,\n        )}\n        disabled={disabled}\n        role=\"application\"\n        aria-disabled={disabled}\n        aria-readonly={restProps.readOnly}\n        after={\n          <IconButton\n            className={styles['ChipsSelect__dropdown']}\n            activeMode=\"\"\n            hoverMode=\"\"\n            // TODO: add label customization\n            aria-label={opened ? 'Скрыть' : 'Развернуть'}\n            onClick={toggleOpened}\n          >\n            {icon ?? <DropdownIcon className={styles['ChipsSelect__icon']} opened={opened} />}\n          </IconButton>\n        }\n        before={before}\n      >\n        <ChipsInputBase\n          {...restProps}\n          tabIndex={tabIndex}\n          value={selectedOptions}\n          inputValue={fieldValue}\n          getNewOptionData={getNewOptionData}\n          getOptionLabel={getOptionLabel}\n          getOptionValue={getOptionValue}\n          renderChip={renderChipWrapper}\n          onFocus={handleFocus}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          getRef={getRef}\n          disabled={disabled}\n          onInputChange={handleInputChange}\n        />\n      </FormField>\n      {opened && (\n        <CustomSelectDropdown\n          targetRef={rootRef}\n          placement={popupDirection}\n          scrollBoxRef={scrollBoxRef}\n          onPlacementChange={onPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          sameWidth={fixDropdownWidth}\n          forcePortal={forceDropdownPortal}\n        >\n          {showCreatable && (\n            <CustomSelectOption\n              hovered={focusedOptionIndex === 0}\n              onMouseDown={addOptionFromInput}\n              onMouseEnter={() => setFocusedOptionIndex(0)}\n            >\n              {creatableText}\n            </CustomSelectOption>\n          )}\n          {!filteredOptions?.length && !showCreatable && emptyText ? (\n            <Footnote className={styles['ChipsSelect__empty']}>{emptyText}</Footnote>\n          ) : (\n            filteredOptions.map((option: Option, index: number) => {\n              const label = getOptionLabel!(option);\n              const hovered =\n                focusedOption && getOptionValue!(option) === getOptionValue!(focusedOption);\n              const selected = selectedOptions.find((selectedOption: Option) => {\n                return getOptionValue!(selectedOption) === getOptionValue!(option);\n              });\n              const value = getOptionValue!(option);\n\n              return (\n                <React.Fragment key={`${typeof value}-${value}`}>\n                  {renderOption!({\n                    option,\n                    hovered: Boolean(hovered),\n                    children: label,\n                    selected: !!selected,\n                    getRootRef: (e) => {\n                      if (e) {\n                        return (chipsSelectOptions[index] = e);\n                      }\n                      return undefined;\n                    },\n                    onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n                      onChangeStart?.(e, option);\n\n                      if (!e.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter: () => setFocusedOptionIndex(index),\n                  })}\n                </React.Fragment>\n              );\n            })\n          )}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","noop","useChipsSelect","useExternRef","useGlobalEventListener","useDOM","defaultFilterFn","ChipsInputBase","chipsInputDefaultProps","CustomSelectDropdown","CustomSelectOption","DropdownIcon","FormField","IconButton","Footnote","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","chipsSelectDefaultProps","emptyText","creatableText","onChangeStart","creatable","fetching","showSelected","closeAfterSelect","options","filterFn","renderOption","props","ChipsSelect","propsWithDefault","style","onFocus","onKeyDown","className","getRef","getRootRef","disabled","placeholder","tabIndex","getOptionValue","getOptionLabel","getNewOptionData","renderChip","popupDirection","inputValue","before","icon","fixDropdownWidth","forceDropdownPortal","restProps","document","useState","undefined","popperPlacement","setPopperPlacement","scrollBoxRef","useRef","rootRef","fieldValue","selectedOptions","opened","setOpened","addOptionFromInput","filteredOptions","addOption","handleInputChange","clearInput","focusedOption","setFocusedOption","focusedOptionIndex","setFocusedOptionIndex","showCreatable","Boolean","length","handleFocus","e","handleClickOutside","target","current","contains","chipsSelectOptions","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","handleKeyDown","key","defaultPrevented","preventDefault","option","includes","useEffect","renderChipWrapper","renderChipProps","onRemoveWrapper","value","stopPropagation","onRemove","isPopperDirectionTop","onPlacementChange","useCallback","placement","onDropdownMouseLeave","toggleOpened","prevOpened","role","aria-disabled","aria-readonly","readOnly","after","activeMode","hoverMode","aria-label","onClick","onInputChange","targetRef","onMouseLeave","sameWidth","forcePortal","hovered","onMouseDown","onMouseEnter","map","label","selected","find","selectedOption","Fragment","children"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/ChipsSelect/ChipsSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useChipsSelect } from '../../hooks/useChipsSelect';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../hooks/useGlobalEventListener';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn } from '../../lib/select';\nimport { ChipOption, ChipValue, RenderChip } from '../Chip/Chip';\nimport { ChipsInputProps } from '../ChipsInput/ChipsInput';\nimport { ChipsInputBase, chipsInputDefaultProps } from '../ChipsInputBase/ChipsInputBase';\nimport { CustomSelectDropdown } from '../CustomSelectDropdown/CustomSelectDropdown';\nimport {\n  CustomSelectOption,\n  CustomSelectOptionProps,\n} from '../CustomSelectOption/CustomSelectOption';\nimport { DropdownIcon } from '../DropdownIcon/DropdownIcon';\nimport { FormField } from '../FormField/FormField';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport styles from './ChipsSelect.module.css';\n\nexport interface ChipsSelectProps<Option extends ChipOption>\n  extends Omit<ChipsInputProps<Option>, 'after'> {\n  popupDirection?: 'top' | 'bottom';\n  options?: Option[];\n  filterFn?:\n    | false\n    | ((\n        value?: string,\n        option?: Option,\n        getOptionLabel?: Pick<ChipsInputProps<Option>, 'getOptionLabel'>['getOptionLabel'],\n      ) => boolean);\n  /**\n   * Возможность создавать чипы которых нет в списке (по enter или с помощью пункта в меню, см creatableText)\n   */\n  creatable?: boolean;\n  /**\n   * Отрисовка лоадера вместо списка опций в выпадающем списке\n   */\n  fetching?: boolean;\n  renderOption?: (props: CustomSelectOptionProps) => React.ReactNode;\n  /**\n   * Показывать или скрывать уже выбранные опции\n   */\n  showSelected?: boolean;\n  /**\n   * Текст для пункта создающего чипы при клике, так же отвечает за то будет ли показан этот пункт (показывается после того как в списке не отсанется опций)\n   */\n  creatableText?: string;\n  /**\n   * Текст который показывается если список опций пуст\n   */\n  emptyText?: string;\n  /**\n   * Событие срабатывающее перед onChange\n   */\n  onChangeStart?: (e: React.MouseEvent | React.KeyboardEvent, option: Option) => void;\n  /**\n   * Закрытие выпадающего списка после выбора элемента\n   */\n  closeAfterSelect?: boolean;\n  fixDropdownWidth?: boolean;\n  forceDropdownPortal?: boolean;\n  /**\n   * Иконка раскрывающегося списка\n   */\n  icon?: React.ReactNode;\n}\n\ntype FocusActionType = 'next' | 'prev';\n\nconst FOCUS_ACTION_NEXT: FocusActionType = 'next';\nconst FOCUS_ACTION_PREV: FocusActionType = 'prev';\n\nconst chipsSelectDefaultProps: ChipsSelectProps<any> = {\n  ...chipsInputDefaultProps,\n  emptyText: 'Ничего не найдено',\n  creatableText: 'Создать значение',\n  onChangeStart: noop,\n  creatable: false,\n  fetching: false,\n  showSelected: true,\n  closeAfterSelect: true,\n  options: [],\n  filterFn: defaultFilterFn,\n  renderOption(props) {\n    return <CustomSelectOption {...props} />;\n  },\n};\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ChipsSelect\n */\nexport const ChipsSelect = <Option extends ChipOption>(props: ChipsSelectProps<Option>) => {\n  const propsWithDefault = { ...chipsSelectDefaultProps, ...props };\n  const {\n    style,\n    onFocus,\n    onKeyDown,\n    className,\n    fetching,\n    renderOption,\n    emptyText,\n    getRef,\n    getRootRef,\n    disabled,\n    placeholder,\n    tabIndex,\n    getOptionValue,\n    getOptionLabel,\n    showSelected,\n    getNewOptionData,\n    renderChip,\n    popupDirection,\n    creatable,\n    filterFn,\n    inputValue,\n    creatableText,\n    closeAfterSelect,\n    onChangeStart,\n    before,\n    icon,\n    options,\n    fixDropdownWidth,\n    forceDropdownPortal,\n    ...restProps\n  } = propsWithDefault;\n\n  const { document } = useDOM();\n\n  const [popperPlacement, setPopperPlacement] = React.useState<Placement | undefined>(undefined);\n\n  const scrollBoxRef = React.useRef<HTMLDivElement>(null);\n  const rootRef = useExternRef(getRef);\n  const {\n    fieldValue,\n    selectedOptions = [],\n    opened,\n    setOpened,\n    addOptionFromInput,\n    filteredOptions,\n    addOption,\n    handleInputChange,\n    clearInput,\n    focusedOption,\n    setFocusedOption,\n    focusedOptionIndex,\n    setFocusedOptionIndex,\n  } = useChipsSelect(propsWithDefault);\n\n  const showCreatable = Boolean(\n    creatable && creatableText && !filteredOptions.length && fieldValue,\n  );\n\n  const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n    setOpened(true);\n    setFocusedOptionIndex(null);\n    onFocus!(e);\n  };\n\n  const handleClickOutside = (e: MouseEvent) => {\n    if (e.target !== rootRef.current && !rootRef.current?.contains(e.target as Node)) {\n      setOpened(false);\n    }\n  };\n\n  const chipsSelectOptions = React.useRef<HTMLElement[]>([]).current;\n\n  const scrollToElement = (index: number, center = false) => {\n    const dropdown = scrollBoxRef.current;\n    const item = chipsSelectOptions[index];\n\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    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 } = filteredOptions;\n\n    if (index < 0) {\n      index = length - 1;\n    } else if (index >= length) {\n      index = 0;\n    }\n\n    if (index === oldIndex) {\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      index = index + 1;\n    } else if (type === FOCUS_ACTION_PREV) {\n      index = index - 1;\n    }\n\n    focusOptionByIndex(index, focusedOptionIndex);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    onKeyDown!(e);\n\n    if (e.key === 'ArrowUp' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_PREV);\n      }\n    }\n\n    if (e.key === 'ArrowDown' && !e.defaultPrevented) {\n      e.preventDefault();\n\n      if (!opened) {\n        setOpened(true);\n        setFocusedOptionIndex(0);\n      } else {\n        focusOption(focusedOptionIndex, FOCUS_ACTION_NEXT);\n      }\n    }\n\n    if (e.key === 'Enter' && !e.defaultPrevented && opened && focusedOptionIndex != null) {\n      const option = filteredOptions[focusedOptionIndex];\n\n      if (option) {\n        onChangeStart!(e, option);\n\n        if (!e.defaultPrevented) {\n          addOption(option);\n          setFocusedOptionIndex(null);\n          clearInput();\n          closeAfterSelect && setOpened(false);\n          e.preventDefault();\n        }\n      } else if (!creatable) {\n        e.preventDefault();\n      }\n    }\n\n    if (['Escape', 'Tab'].includes(e.key) && !e.defaultPrevented && opened) {\n      setOpened(false);\n    }\n  };\n\n  React.useEffect(() => {\n    if (focusedOptionIndex != null && filteredOptions[focusedOptionIndex]) {\n      setFocusedOption(filteredOptions[focusedOptionIndex]);\n    } else if (focusedOptionIndex === null || focusedOptionIndex === 0) {\n      setFocusedOption(null);\n    }\n  }, [focusedOptionIndex, filteredOptions, setFocusedOption]);\n\n  useGlobalEventListener(document, 'click', handleClickOutside);\n\n  const renderChipWrapper = (renderChipProps: RenderChip<Option> | undefined) => {\n    if (renderChipProps === undefined) {\n      return null;\n    }\n    const onRemoveWrapper = (e: React.MouseEvent | undefined, value: ChipValue | undefined) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      renderChipProps.onRemove?.(e, value);\n    };\n\n    return renderChip!({\n      ...renderChipProps,\n      onRemove: onRemoveWrapper,\n    });\n  };\n\n  const isPopperDirectionTop = popperPlacement?.includes('top');\n\n  const onPlacementChange = React.useCallback(\n    (placement?: Placement) => {\n      setPopperPlacement(placement);\n    },\n    [setPopperPlacement],\n  );\n\n  const onDropdownMouseLeave = React.useCallback(() => {\n    setFocusedOptionIndex(null);\n  }, [setFocusedOptionIndex]);\n\n  const toggleOpened = () => {\n    setOpened((prevOpened) => !prevOpened);\n  };\n\n  return (\n    <>\n      <FormField\n        getRootRef={rootRef}\n        style={style}\n        className={classNames(\n          styles['ChipsSelect'],\n          opened &&\n            (isPopperDirectionTop\n              ? styles['ChipsSelect--pop-up']\n              : styles['ChipsSelect--pop-down']),\n          className,\n        )}\n        disabled={disabled}\n        role=\"application\"\n        aria-disabled={disabled}\n        aria-readonly={restProps.readOnly}\n        after={\n          <IconButton\n            className={styles['ChipsSelect__dropdown']}\n            activeMode=\"\"\n            hoverMode=\"\"\n            // TODO: add label customization\n            aria-label={opened ? 'Скрыть' : 'Развернуть'}\n            onClick={toggleOpened}\n          >\n            {icon ?? <DropdownIcon className={styles['ChipsSelect__icon']} opened={opened} />}\n          </IconButton>\n        }\n        before={before}\n      >\n        <ChipsInputBase\n          {...restProps}\n          tabIndex={tabIndex}\n          value={selectedOptions}\n          inputValue={fieldValue}\n          getNewOptionData={getNewOptionData}\n          getOptionLabel={getOptionLabel}\n          getOptionValue={getOptionValue}\n          renderChip={renderChipWrapper}\n          onFocus={handleFocus}\n          onKeyDown={handleKeyDown}\n          placeholder={placeholder}\n          getRef={getRef}\n          disabled={disabled}\n          onInputChange={handleInputChange}\n        />\n      </FormField>\n      {opened && (\n        <CustomSelectDropdown\n          targetRef={rootRef}\n          placement={popupDirection}\n          scrollBoxRef={scrollBoxRef}\n          onPlacementChange={onPlacementChange}\n          onMouseLeave={onDropdownMouseLeave}\n          fetching={fetching}\n          sameWidth={fixDropdownWidth}\n          forcePortal={forceDropdownPortal}\n        >\n          {showCreatable && (\n            <CustomSelectOption\n              hovered={focusedOptionIndex === 0}\n              onMouseDown={addOptionFromInput}\n              onMouseEnter={() => setFocusedOptionIndex(0)}\n            >\n              {creatableText}\n            </CustomSelectOption>\n          )}\n          {!filteredOptions?.length && !showCreatable && emptyText ? (\n            <Footnote className={styles['ChipsSelect__empty']}>{emptyText}</Footnote>\n          ) : (\n            filteredOptions.map((option: Option, index: number) => {\n              const label = getOptionLabel!(option);\n              const hovered =\n                focusedOption && getOptionValue!(option) === getOptionValue!(focusedOption);\n              const selected = selectedOptions.find((selectedOption: Option) => {\n                return getOptionValue!(selectedOption) === getOptionValue!(option);\n              });\n              const value = getOptionValue!(option);\n\n              return (\n                <React.Fragment key={`${typeof value}-${value}`}>\n                  {renderOption!({\n                    option,\n                    hovered: Boolean(hovered),\n                    children: label,\n                    selected: !!selected,\n                    getRootRef: (e) => {\n                      if (e) {\n                        return (chipsSelectOptions[index] = e);\n                      }\n                      return undefined;\n                    },\n                    onMouseDown: (e: React.MouseEvent<HTMLDivElement>) => {\n                      onChangeStart?.(e, option);\n\n                      if (!e.defaultPrevented) {\n                        closeAfterSelect && setOpened(false);\n                        addOption(option);\n                        clearInput();\n                      }\n                    },\n                    onMouseEnter: () => setFocusedOptionIndex(index),\n                  })}\n                </React.Fragment>\n              );\n            })\n          )}\n        </CustomSelectDropdown>\n      )}\n    </>\n  );\n};\n"],"names":["React","classNames","noop","useChipsSelect","useExternRef","useGlobalEventListener","useDOM","defaultFilterFn","ChipsInputBase","chipsInputDefaultProps","CustomSelectDropdown","CustomSelectOption","DropdownIcon","FormField","IconButton","Footnote","FOCUS_ACTION_NEXT","FOCUS_ACTION_PREV","chipsSelectDefaultProps","emptyText","creatableText","onChangeStart","creatable","fetching","showSelected","closeAfterSelect","options","filterFn","renderOption","props","ChipsSelect","propsWithDefault","style","onFocus","onKeyDown","className","getRef","getRootRef","disabled","placeholder","tabIndex","getOptionValue","getOptionLabel","getNewOptionData","renderChip","popupDirection","inputValue","before","icon","fixDropdownWidth","forceDropdownPortal","restProps","document","useState","undefined","popperPlacement","setPopperPlacement","scrollBoxRef","useRef","rootRef","fieldValue","selectedOptions","opened","setOpened","addOptionFromInput","filteredOptions","addOption","handleInputChange","clearInput","focusedOption","setFocusedOption","focusedOptionIndex","setFocusedOptionIndex","showCreatable","Boolean","length","handleFocus","e","handleClickOutside","target","current","contains","chipsSelectOptions","scrollToElement","index","center","dropdown","item","dropdownHeight","offsetHeight","scrollTop","itemTop","offsetTop","itemHeight","focusOptionByIndex","oldIndex","focusOption","nextIndex","type","handleKeyDown","key","defaultPrevented","preventDefault","option","includes","useEffect","renderChipWrapper","renderChipProps","onRemoveWrapper","value","stopPropagation","onRemove","isPopperDirectionTop","onPlacementChange","useCallback","placement","onDropdownMouseLeave","toggleOpened","prevOpened","role","aria-disabled","aria-readonly","readOnly","after","activeMode","hoverMode","aria-label","onClick","onInputChange","targetRef","onMouseLeave","sameWidth","forcePortal","hovered","onMouseDown","onMouseEnter","map","label","selected","find","selectedOption","Fragment","children"],"mappings":"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"}

package/dist/components/ConfigProvider/ConfigProvider.d.ts

@@ -7,4 +7,4 @@ export interface ConfigProviderProps extends Partial<ConfigProviderContextInterf
 /**
  * @see https://vkcom.github.io/VKUI/#/ConfigProvider
  */
-export declare const ConfigProvider: (props: ConfigProviderProps) => JSX.Element;
+export declare const ConfigProvider: (props: ConfigProviderProps) => React.JSX.Element;

package/dist/components/ConfigProvider/ConfigProvider.js

@@ -1,4 +1,4 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
 import * as React from "react";
 import { noop } from "@vkontakte/vkjs";
 import { generateVKUITokensClassName } from "../../helpers/generateVKUITokensClassName";

package/dist/components/ConfigProvider/ConfigProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { generateVKUITokensClassName } from '../../helpers/generateVKUITokensClassName';\nimport { useAutoDetectAppearance } from '../../hooks/useAutoDetectAppearance';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { useDOM } from '../../lib/dom';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n  ConfigProviderContext,\n  ConfigProviderContextInterface,\n  useConfigProvider,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderProps extends Partial<ConfigProviderContextInterface> {\n  onDetectAppearanceByBridge?: () => void;\n  children: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ConfigProvider\n */\nexport const ConfigProvider = (props: ConfigProviderProps) => {\n  const parentConfig = useConfigProvider();\n\n  const {\n    children,\n    webviewType,\n    isWebView,\n    transitionMotionEnabled,\n    platform,\n    locale,\n    appearance: appearanceProp,\n    onDetectAppearanceByBridge = noop,\n  } = {\n    ...parentConfig,\n    ...props,\n  };\n\n  const appearance = useAutoDetectAppearance(appearanceProp, onDetectAppearanceByBridge);\n\n  const { document } = useDOM();\n\n  useIsomorphicLayoutEffect(() => {\n    const VKUITokensClassName = generateVKUITokensClassName(platform, appearance);\n\n    // eslint-disable-next-line no-restricted-properties\n    document!.body.classList.add(VKUITokensClassName);\n\n    return () => {\n      // eslint-disable-next-line no-restricted-properties\n      document!.body.classList.remove(VKUITokensClassName);\n    };\n  }, [platform, appearance]);\n\n  const configContext = useObjectMemo({\n    webviewType,\n    isWebView,\n    transitionMotionEnabled,\n    platform,\n    locale,\n    appearance,\n  });\n\n  return (\n    <ConfigProviderContext.Provider value={configContext}>\n      <TokensClassProvider platform={platform} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderContext.Provider>\n  );\n};\n"],"names":["React","noop","generateVKUITokensClassName","useAutoDetectAppearance","useObjectMemo","useDOM","TokensClassProvider","useIsomorphicLayoutEffect","ConfigProviderContext","useConfigProvider","ConfigProvider","props","parentConfig","children","webviewType","isWebView","transitionMotionEnabled","platform","locale","appearance","appearanceProp","onDetectAppearanceByBridge","document","VKUITokensClassName","body","classList","add","remove","configContext","Provider","value"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,2BAA2B,QAAQ,4CAA4C;AACxF,SAASC,uBAAuB,QAAQ,sCAAsC;AAC9E,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,yBAAyB,QAAQ,sCAAsC;AAChF,SACEC,qBAAqB,EAErBC,iBAAiB,QACZ,0BAA0B;AAOjC;;CAEC,GACD,OAAO,IAAMC,iBAAiB,SAACC,OAA+B;IAC5D,IAAMC,eAAeH;IAErB,IASI,mBAAA,mBACCG,cACAD,QAVHE,WAQE,iBARFA,UACAC,cAOE,iBAPFA,aACAC,YAME,iBANFA,WACAC,0BAKE,iBALFA,yBACAC,WAIE,iBAJFA,UACAC,SAGE,iBAHFA,QACAC,AAAYC,iBAEV,iBAFFD,wDAEE,iBADFE,4BAAAA,oFAA6BpB;IAM/B,IAAMkB,aAAahB,wBAAwBiB,gBAAgBC;IAE3D,IAAM,AAAEC,WAAajB,SAAbiB;IAERf,0BAA0B,WAAM;QAC9B,IAAMgB,sBAAsBrB,4BAA4Be,UAAUE;QAElE,oDAAoD;QACpDG,SAAUE,IAAI,CAACC,SAAS,CAACC,GAAG,CAACH;QAE7B,OAAO,WAAM;YACX,oDAAoD;YACpDD,SAAUE,IAAI,CAACC,SAAS,CAACE,MAAM,CAACJ;QAClC;IACF,GAAG;QAACN;QAAUE;KAAW;IAEzB,IAAMS,gBAAgBxB,cAAc;QAClCU,aAAAA;QACAC,WAAAA;QACAC,yBAAAA;QACAC,UAAAA;QACAC,QAAAA;QACAC,YAAAA;IACF;IAEA,qBACE,oBAACX,sBAAsBqB,QAAQ;QAACC,OAAOF;qBACrC,oBAACtB;QAAoBW,UAAUA;QAAUE,YAAYA;OAClDN;AAIT,EAAE"}
+{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { noop } from '@vkontakte/vkjs';\nimport { generateVKUITokensClassName } from '../../helpers/generateVKUITokensClassName';\nimport { useAutoDetectAppearance } from '../../hooks/useAutoDetectAppearance';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { useDOM } from '../../lib/dom';\nimport { TokensClassProvider } from '../../lib/tokensClassProvider';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n  ConfigProviderContext,\n  ConfigProviderContextInterface,\n  useConfigProvider,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderProps extends Partial<ConfigProviderContextInterface> {\n  onDetectAppearanceByBridge?: () => void;\n  children: React.ReactNode;\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ConfigProvider\n */\nexport const ConfigProvider = (props: ConfigProviderProps) => {\n  const parentConfig = useConfigProvider();\n\n  const {\n    children,\n    webviewType,\n    isWebView,\n    transitionMotionEnabled,\n    platform,\n    locale,\n    appearance: appearanceProp,\n    onDetectAppearanceByBridge = noop,\n  } = {\n    ...parentConfig,\n    ...props,\n  };\n\n  const appearance = useAutoDetectAppearance(appearanceProp, onDetectAppearanceByBridge);\n\n  const { document } = useDOM();\n\n  useIsomorphicLayoutEffect(() => {\n    const VKUITokensClassName = generateVKUITokensClassName(platform, appearance);\n\n    // eslint-disable-next-line no-restricted-properties\n    document!.body.classList.add(VKUITokensClassName);\n\n    return () => {\n      // eslint-disable-next-line no-restricted-properties\n      document!.body.classList.remove(VKUITokensClassName);\n    };\n  }, [platform, appearance]);\n\n  const configContext = useObjectMemo({\n    webviewType,\n    isWebView,\n    transitionMotionEnabled,\n    platform,\n    locale,\n    appearance,\n  });\n\n  return (\n    <ConfigProviderContext.Provider value={configContext}>\n      <TokensClassProvider platform={platform} appearance={appearance}>\n        {children}\n      </TokensClassProvider>\n    </ConfigProviderContext.Provider>\n  );\n};\n"],"names":["React","noop","generateVKUITokensClassName","useAutoDetectAppearance","useObjectMemo","useDOM","TokensClassProvider","useIsomorphicLayoutEffect","ConfigProviderContext","useConfigProvider","ConfigProvider","props","parentConfig","children","webviewType","isWebView","transitionMotionEnabled","platform","locale","appearance","appearanceProp","onDetectAppearanceByBridge","document","VKUITokensClassName","body","classList","add","remove","configContext","Provider","value"],"mappings":";AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,2BAA2B,QAAQ,4CAA4C;AACxF,SAASC,uBAAuB,QAAQ,sCAAsC;AAC9E,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SAASC,MAAM,QAAQ,gBAAgB;AACvC,SAASC,mBAAmB,QAAQ,gCAAgC;AACpE,SAASC,yBAAyB,QAAQ,sCAAsC;AAChF,SACEC,qBAAqB,EAErBC,iBAAiB,QACZ,0BAA0B;AAOjC;;CAEC,GACD,OAAO,IAAMC,iBAAiB,SAACC;IAC7B,IAAMC,eAAeH;IAErB,IASI,mBAAA,mBACCG,cACAD,QAVHE,WAQE,iBARFA,UACAC,cAOE,iBAPFA,aACAC,YAME,iBANFA,WACAC,0BAKE,iBALFA,yBACAC,WAIE,iBAJFA,UACAC,SAGE,iBAHFA,QACAC,AAAYC,iBAEV,iBAFFD,wDAEE,iBADFE,4BAAAA,oFAA6BpB;IAM/B,IAAMkB,aAAahB,wBAAwBiB,gBAAgBC;IAE3D,IAAM,AAAEC,WAAajB,SAAbiB;IAERf,0BAA0B;QACxB,IAAMgB,sBAAsBrB,4BAA4Be,UAAUE;QAElE,oDAAoD;QACpDG,SAAUE,KAAKC,UAAUC,IAAIH;QAE7B,OAAO;YACL,oDAAoD;YACpDD,SAAUE,KAAKC,UAAUE,OAAOJ;QAClC;IACF,GAAG;QAACN;QAAUE;KAAW;IAEzB,IAAMS,gBAAgBxB,cAAc;QAClCU,aAAAA;QACAC,WAAAA;QACAC,yBAAAA;QACAC,UAAAA;QACAC,QAAAA;QACAC,YAAAA;IACF;IAEA,qBACE,oBAACX,sBAAsBqB;QAASC,OAAOF;qBACrC,oBAACtB;QAAoBW,UAAUA;QAAUE,YAAYA;OAClDN;AAIT,EAAE"}

package/dist/components/ConfigProvider/ConfigProviderContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProviderContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, { AppearanceType } from '@vkontakte/vk-bridge';\nimport { platform, PlatformType } from '../../lib/platform';\n\nexport enum WebviewType {\n  VKAPPS = 'vkapps',\n  INTERNAL = 'internal',\n}\n\nexport interface ConfigProviderContextInterface {\n  /**\n   * Подсказывает приложению, обёрнутому в `ConfigProvider`, где открыто приложение: внутри webview или в мобильном браузере\n   */\n  isWebView: boolean;\n  /**\n   * Тип вебвью.<br>\n   * В случае `WebviewType.VKAPPS` интерфейс будет адаптирован для отображения в вебвью Mini Apps (системные контролы в правой части шапки)\n   */\n  webviewType: WebviewType.INTERNAL | WebviewType.VKAPPS;\n  /**\n   * Тип цветовой схемы – `light` или `dark`\n   */\n  appearance: AppearanceType | undefined;\n  /**\n   * Включена ли анимация переходов между экранами в `Root` и `View`\n   */\n  transitionMotionEnabled: boolean;\n  /**\n   * Платформа\n   */\n  platform: PlatformType;\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  locale: string;\n}\n\nexport const ConfigProviderContext = React.createContext<ConfigProviderContextInterface>({\n  webviewType: WebviewType.VKAPPS,\n  isWebView: vkBridge.isWebView(),\n  transitionMotionEnabled: true,\n  platform: platform(),\n  appearance: undefined, // undefined обозначает что тема должна определиться автоматически\n  locale: 'ru',\n});\n\nexport const useConfigProvider = () => React.useContext(ConfigProviderContext);\n"],"names":["React","vkBridge","platform","WebviewType","VKAPPS","INTERNAL","ConfigProviderContext","createContext","webviewType","isWebView","transitionMotionEnabled","appearance","undefined","locale","useConfigProvider","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAAkC,uBAAuB;AAChE,SAASC,QAAQ,QAAsB,qBAAqB;WAErD;UAAKC,WAAW;IAAXA,YACVC,YAAS;IADCD,YAEVE,cAAW;GAFDF,gBAAAA;AAiCZ,OAAO,IAAMG,sCAAwBN,MAAMO,aAAa,CAAiC;IACvFC,aAAaL,YAAYC,MAAM;IAC/BK,WAAWR,SAASQ,SAAS;IAC7BC,yBAAyB,IAAI;IAC7BR,UAAUA;IACVS,YAAYC;IACZC,QAAQ;AACV,GAAG;AAEH,OAAO,IAAMC,oBAAoB;WAAMd,MAAMe,UAAU,CAACT;EAAuB"}
+{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProviderContext.tsx"],"sourcesContent":["import * as React from 'react';\nimport vkBridge, { AppearanceType } from '@vkontakte/vk-bridge';\nimport { platform, PlatformType } from '../../lib/platform';\n\nexport enum WebviewType {\n  VKAPPS = 'vkapps',\n  INTERNAL = 'internal',\n}\n\nexport interface ConfigProviderContextInterface {\n  /**\n   * Подсказывает приложению, обёрнутому в `ConfigProvider`, где открыто приложение: внутри webview или в мобильном браузере\n   */\n  isWebView: boolean;\n  /**\n   * Тип вебвью.<br>\n   * В случае `WebviewType.VKAPPS` интерфейс будет адаптирован для отображения в вебвью Mini Apps (системные контролы в правой части шапки)\n   */\n  webviewType: WebviewType.INTERNAL | WebviewType.VKAPPS;\n  /**\n   * Тип цветовой схемы – `light` или `dark`\n   */\n  appearance: AppearanceType | undefined;\n  /**\n   * Включена ли анимация переходов между экранами в `Root` и `View`\n   */\n  transitionMotionEnabled: boolean;\n  /**\n   * Платформа\n   */\n  platform: PlatformType;\n  /**\n   * Строка с языковой меткой BCP 47\n   */\n  locale: string;\n}\n\nexport const ConfigProviderContext = React.createContext<ConfigProviderContextInterface>({\n  webviewType: WebviewType.VKAPPS,\n  isWebView: vkBridge.isWebView(),\n  transitionMotionEnabled: true,\n  platform: platform(),\n  appearance: undefined, // undefined обозначает что тема должна определиться автоматически\n  locale: 'ru',\n});\n\nexport const useConfigProvider = () => React.useContext(ConfigProviderContext);\n"],"names":["React","vkBridge","platform","WebviewType","VKAPPS","INTERNAL","ConfigProviderContext","createContext","webviewType","isWebView","transitionMotionEnabled","appearance","undefined","locale","useConfigProvider","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,OAAOC,cAAkC,uBAAuB;AAChE,SAASC,QAAQ,QAAsB,qBAAqB;WAErD;UAAKC,WAAW;IAAXA,YACVC,YAAS;IADCD,YAEVE,cAAW;GAFDF,gBAAAA;AAiCZ,OAAO,IAAMG,sCAAwBN,MAAMO,cAA8C;IACvFC,aAAaL,YAAYC;IACzBK,WAAWR,SAASQ;IACpBC,yBAAyB;IACzBR,UAAUA;IACVS,YAAYC;IACZC,QAAQ;AACV,GAAG;AAEH,OAAO,IAAMC,oBAAoB;WAAMd,MAAMe,WAAWT;EAAuB"}

package/dist/components/ConfigProvider/ConfigProviderOverride.d.ts

@@ -6,4 +6,4 @@ export interface ConfigProviderOverrideProps extends Partial<ConfigProviderConte
 /**
  * Компонент предназначен для перебивания одного из значений контекста
  */
-export declare function ConfigProviderOverride({ children, ...contextValue }: ConfigProviderOverrideProps): JSX.Element;
+export declare function ConfigProviderOverride({ children, ...contextValue }: ConfigProviderOverrideProps): React.JSX.Element;

package/dist/components/ConfigProvider/ConfigProviderOverride.js

@@ -1,5 +1,5 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import React from "react";
 import { useObjectMemo } from "../../hooks/useObjectMemo";
 import { ConfigProviderContext, useConfigProvider } from "./ConfigProviderContext";

package/dist/components/ConfigProvider/ConfigProviderOverride.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProviderOverride.tsx"],"sourcesContent":["import React from 'react';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport {\n  ConfigProviderContext,\n  ConfigProviderContextInterface,\n  useConfigProvider,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderOverrideProps extends Partial<ConfigProviderContextInterface> {\n  children: React.ReactNode;\n}\n\n/**\n * Компонент предназначен для перебивания одного из значений контекста\n */\nexport function ConfigProviderOverride({ children, ...contextValue }: ConfigProviderOverrideProps) {\n  const parentConfig = useConfigProvider();\n\n  const configContext = useObjectMemo({\n    ...parentConfig,\n    ...contextValue,\n  });\n\n  return (\n    <ConfigProviderContext.Provider value={configContext}>\n      {children}\n    </ConfigProviderContext.Provider>\n  );\n}\n"],"names":["React","useObjectMemo","ConfigProviderContext","useConfigProvider","ConfigProviderOverride","children","contextValue","parentConfig","configContext","Provider","value"],"mappings":";;AAAA,OAAOA,WAAW,QAAQ;AAC1B,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SACEC,qBAAqB,EAErBC,iBAAiB,QACZ,0BAA0B;AAMjC;;CAEC,GACD,OAAO,SAASC,uBAAuB,QAA4D;QAA1DC,WAAF,OAAEA,UAAaC,0CAAf;QAAED;;IACvC,IAAME,eAAeJ;IAErB,IAAMK,gBAAgBP,cAAc,mBAC/BM,cACAD;IAGL,qBACE,oBAACJ,sBAAsBO,QAAQ;QAACC,OAAOF;OACpCH;AAGP,CAAC"}
+{"version":3,"sources":["../../../src/components/ConfigProvider/ConfigProviderOverride.tsx"],"sourcesContent":["import React from 'react';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport {\n  ConfigProviderContext,\n  ConfigProviderContextInterface,\n  useConfigProvider,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderOverrideProps extends Partial<ConfigProviderContextInterface> {\n  children: React.ReactNode;\n}\n\n/**\n * Компонент предназначен для перебивания одного из значений контекста\n */\nexport function ConfigProviderOverride({ children, ...contextValue }: ConfigProviderOverrideProps) {\n  const parentConfig = useConfigProvider();\n\n  const configContext = useObjectMemo({\n    ...parentConfig,\n    ...contextValue,\n  });\n\n  return (\n    <ConfigProviderContext.Provider value={configContext}>\n      {children}\n    </ConfigProviderContext.Provider>\n  );\n}\n"],"names":["React","useObjectMemo","ConfigProviderContext","useConfigProvider","ConfigProviderOverride","children","contextValue","parentConfig","configContext","Provider","value"],"mappings":";;AAAA,OAAOA,WAAW,QAAQ;AAC1B,SAASC,aAAa,QAAQ,4BAA4B;AAC1D,SACEC,qBAAqB,EAErBC,iBAAiB,QACZ,0BAA0B;AAMjC;;CAEC,GACD,OAAO,SAASC,uBAAuB;QAAEC,WAAF,OAAEA,UAAaC,0CAAf;QAAED;;IACvC,IAAME,eAAeJ;IAErB,IAAMK,gBAAgBP,cAAc,mBAC/BM,cACAD;IAGL,qBACE,oBAACJ,sBAAsBO;QAASC,OAAOF;OACpCH;AAGP"}

package/dist/components/ContentCard/ContentCard.d.ts

@@ -28,4 +28,4 @@ export interface ContentCardProps extends HasRootRef<HTMLDivElement>, Omit<Tappa
 /**
  * @see https://vkcom.github.io/VKUI/#/ContentCard
  */
-export declare const ContentCard: ({ subtitle, header, text, caption, className, mode, style, getRootRef, getRef, maxHeight, src, srcSet, alt, width, height, crossOrigin, decoding, loading, referrerPolicy, sizes, useMap, hasHover, hasActive, ...restProps }: ContentCardProps) => JSX.Element;
+export declare const ContentCard: ({ subtitle, header, text, caption, className, mode, style, getRootRef, getRef, maxHeight, src, srcSet, alt, width, height, crossOrigin, decoding, loading, referrerPolicy, sizes, useMap, hasHover, hasActive, ...restProps }: ContentCardProps) => React.JSX.Element;

package/dist/components/ContentCard/ContentCard.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames, hasReactNode } from "@vkontakte/vkjs";
 import { Card } from "../Card/Card";

package/dist/components/ContentCard/ContentCard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ContentCard/ContentCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Card, CardProps } from '../Card/Card';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './ContentCard.module.css';\n\nexport interface ContentCardProps\n  extends HasRootRef<HTMLDivElement>,\n    Omit<TappableProps, 'getRootRef' | 'crossOrigin'>,\n    Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof React.HTMLAttributes<HTMLImageElement>>,\n    HasRef<HTMLImageElement> {\n  /**\n   Текст над заголовком\n   */\n  subtitle?: React.ReactNode;\n  /**\n   Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   Текст\n   */\n  text?: React.ReactNode;\n  /**\n   Нижний текст\n   */\n  caption?: React.ReactNode;\n  /**\n    Максимальная высота изображения\n   */\n  maxHeight?: number;\n  mode?: CardProps['mode'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ContentCard\n */\nexport const ContentCard = ({\n  subtitle,\n  header,\n  text,\n  caption,\n  // card props\n  className,\n  mode = 'shadow',\n  style,\n  getRootRef,\n  // img props\n  getRef,\n  maxHeight,\n  src,\n  srcSet,\n  alt = '',\n  width,\n  height,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  useMap,\n  hasHover = false,\n  hasActive = false,\n  ...restProps\n}: ContentCardProps) => {\n  return (\n    <Card\n      mode={mode}\n      getRootRef={getRootRef}\n      style={style}\n      className={classNames(restProps.disabled && styles['ContentCard--disabled'], className)}\n    >\n      <Tappable\n        {...restProps}\n        disabled={restProps.disabled || (!restProps.onClick && !restProps.href)}\n        hasHover={hasHover}\n        hasActive={hasActive}\n        className={styles['ContentCard__tappable']}\n      >\n        {(src || srcSet) && (\n          <img\n            ref={getRef}\n            className={styles['ContentCard__img']}\n            src={src}\n            srcSet={srcSet}\n            alt={alt}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            sizes={sizes}\n            useMap={useMap}\n            height={height}\n            style={{ maxHeight }}\n            width=\"100%\"\n          />\n        )}\n        <div className={styles['ContentCard__body']}>\n          {hasReactNode(subtitle) && (\n            <Caption\n              className={classNames(styles['ContentCard__text'], styles['ContentCard__subtitle'])}\n              weight=\"1\"\n              level=\"3\"\n              caps\n            >\n              {subtitle}\n            </Caption>\n          )}\n          {hasReactNode(header) && (\n            <Headline className={styles['ContentCard__text']} weight=\"2\" level=\"1\">\n              {header}\n            </Headline>\n          )}\n          {hasReactNode(text) && <Text className={styles['ContentCard__text']}>{text}</Text>}\n          {hasReactNode(caption) && (\n            <Footnote\n              className={classNames(styles['ContentCard__text'], styles['ContentCard__caption'])}\n            >\n              {caption}\n            </Footnote>\n          )}\n        </div>\n      </Tappable>\n    </Card>\n  );\n};\n"],"names":["React","classNames","hasReactNode","Card","Tappable","Caption","Footnote","Headline","Text","ContentCard","subtitle","header","text","caption","className","mode","style","getRootRef","getRef","maxHeight","src","srcSet","alt","width","height","crossOrigin","decoding","loading","referrerPolicy","sizes","useMap","hasHover","hasActive","restProps","disabled","onClick","href","img","ref","div","weight","level","caps"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,IAAI,QAAmB,eAAe;AAC/C,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,IAAI,QAAQ,0BAA0B;AA+B/C;;CAEC,GACD,OAAO,IAAMC,cAAc,iBA2BH;QA1BtBC,kBAAAA,UACAC,gBAAAA,QACAC,cAAAA,MACAC,iBAAAA,SACA,aAAa;IACbC,mBAAAA,gCACAC,MAAAA,gCAAO,wBACPC,eAAAA,OACAC,oBAAAA,YACA,YAAY;IACZC,gBAAAA,QACAC,mBAAAA,WACAC,aAAAA,KACAC,gBAAAA,4BACAC,KAAAA,8BAAM,iBACNC,eAAAA,OACAC,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,UACAC,iBAAAA,SACAC,wBAAAA,gBACAC,eAAAA,OACAC,gBAAAA,iCACAC,UAAAA,wCAAW,KAAK,8CAChBC,WAAAA,0CAAY,KAAK,qBACdC;QAzBHvB;QACAC;QACAC;QACAC;QAEAC;QACAC;QACAC;QACAC;QAEAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,oBAAC7B;QACCY,MAAMA;QACNE,YAAYA;QACZD,OAAOA;QACPF,WAAWb,WAAWgC,UAAUC,QAAQ,iCAAqCpB;qBAE7E,oBAACV,kDACK6B;QACJC,UAAUD,UAAUC,QAAQ,IAAK,CAACD,UAAUE,OAAO,IAAI,CAACF,UAAUG,IAAI;QACtEL,UAAUA;QACVC,WAAWA;QACXlB,SAAS;QAER,AAACM,CAAAA,OAAOC,MAAK,mBACZ,oBAACgB;QACCC,KAAKpB;QACLJ,SAAS;QACTM,KAAKA;QACLC,QAAQA;QACRC,KAAKA;QACLG,aAAaA;QACbC,UAAUA;QACVC,SAASA;QACTC,gBAAgBA;QAChBC,OAAOA;QACPC,QAAQA;QACRN,QAAQA;QACRR,OAAO;YAAEG,WAAAA;QAAU;QACnBI,OAAM;sBAGV,oBAACgB;QAAIzB,SAAS;OACXZ,aAAaQ,2BACZ,oBAACL;QACCS,WAAWb;QACXuC,QAAO;QACPC,OAAM;QACNC,MAAAA,IAAI;OAEHhC,WAGJR,aAAaS,yBACZ,oBAACJ;QAASO,SAAS;QAA+B0B,QAAO;QAAIC,OAAM;OAChE9B,SAGJT,aAAaU,uBAAS,oBAACJ;QAAKM,SAAS;OAAgCF,OACrEV,aAAaW,0BACZ,oBAACP;QACCQ,WAAWb;OAEVY;AAOf,EAAE"}
+{"version":3,"sources":["../../../src/components/ContentCard/ContentCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { HasRef, HasRootRef } from '../../types';\nimport { Card, CardProps } from '../Card/Card';\nimport { Tappable, TappableProps } from '../Tappable/Tappable';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { Headline } from '../Typography/Headline/Headline';\nimport { Text } from '../Typography/Text/Text';\nimport styles from './ContentCard.module.css';\n\nexport interface ContentCardProps\n  extends HasRootRef<HTMLDivElement>,\n    Omit<TappableProps, 'getRootRef' | 'crossOrigin'>,\n    Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof React.HTMLAttributes<HTMLImageElement>>,\n    HasRef<HTMLImageElement> {\n  /**\n   Текст над заголовком\n   */\n  subtitle?: React.ReactNode;\n  /**\n   Заголовок\n   */\n  header?: React.ReactNode;\n  /**\n   Текст\n   */\n  text?: React.ReactNode;\n  /**\n   Нижний текст\n   */\n  caption?: React.ReactNode;\n  /**\n    Максимальная высота изображения\n   */\n  maxHeight?: number;\n  mode?: CardProps['mode'];\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/ContentCard\n */\nexport const ContentCard = ({\n  subtitle,\n  header,\n  text,\n  caption,\n  // card props\n  className,\n  mode = 'shadow',\n  style,\n  getRootRef,\n  // img props\n  getRef,\n  maxHeight,\n  src,\n  srcSet,\n  alt = '',\n  width,\n  height,\n  crossOrigin,\n  decoding,\n  loading,\n  referrerPolicy,\n  sizes,\n  useMap,\n  hasHover = false,\n  hasActive = false,\n  ...restProps\n}: ContentCardProps) => {\n  return (\n    <Card\n      mode={mode}\n      getRootRef={getRootRef}\n      style={style}\n      className={classNames(restProps.disabled && styles['ContentCard--disabled'], className)}\n    >\n      <Tappable\n        {...restProps}\n        disabled={restProps.disabled || (!restProps.onClick && !restProps.href)}\n        hasHover={hasHover}\n        hasActive={hasActive}\n        className={styles['ContentCard__tappable']}\n      >\n        {(src || srcSet) && (\n          <img\n            ref={getRef}\n            className={styles['ContentCard__img']}\n            src={src}\n            srcSet={srcSet}\n            alt={alt}\n            crossOrigin={crossOrigin}\n            decoding={decoding}\n            loading={loading}\n            referrerPolicy={referrerPolicy}\n            sizes={sizes}\n            useMap={useMap}\n            height={height}\n            style={{ maxHeight }}\n            width=\"100%\"\n          />\n        )}\n        <div className={styles['ContentCard__body']}>\n          {hasReactNode(subtitle) && (\n            <Caption\n              className={classNames(styles['ContentCard__text'], styles['ContentCard__subtitle'])}\n              weight=\"1\"\n              level=\"3\"\n              caps\n            >\n              {subtitle}\n            </Caption>\n          )}\n          {hasReactNode(header) && (\n            <Headline className={styles['ContentCard__text']} weight=\"2\" level=\"1\">\n              {header}\n            </Headline>\n          )}\n          {hasReactNode(text) && <Text className={styles['ContentCard__text']}>{text}</Text>}\n          {hasReactNode(caption) && (\n            <Footnote\n              className={classNames(styles['ContentCard__text'], styles['ContentCard__caption'])}\n            >\n              {caption}\n            </Footnote>\n          )}\n        </div>\n      </Tappable>\n    </Card>\n  );\n};\n"],"names":["React","classNames","hasReactNode","Card","Tappable","Caption","Footnote","Headline","Text","ContentCard","subtitle","header","text","caption","className","mode","style","getRootRef","getRef","maxHeight","src","srcSet","alt","width","height","crossOrigin","decoding","loading","referrerPolicy","sizes","useMap","hasHover","hasActive","restProps","disabled","onClick","href","img","ref","div","weight","level","caps"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAE3D,SAASC,IAAI,QAAmB,eAAe;AAC/C,SAASC,QAAQ,QAAuB,uBAAuB;AAC/D,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,QAAQ,QAAQ,kCAAkC;AAC3D,SAASC,IAAI,QAAQ,0BAA0B;AA+B/C;;CAEC,GACD,OAAO,IAAMC,cAAc;QACzBC,kBAAAA,UACAC,gBAAAA,QACAC,cAAAA,MACAC,iBAAAA,SACA,aAAa;IACbC,mBAAAA,gCACAC,MAAAA,gCAAO,wBACPC,eAAAA,OACAC,oBAAAA,YACA,YAAY;IACZC,gBAAAA,QACAC,mBAAAA,WACAC,aAAAA,KACAC,gBAAAA,4BACAC,KAAAA,8BAAM,iBACNC,eAAAA,OACAC,gBAAAA,QACAC,qBAAAA,aACAC,kBAAAA,UACAC,iBAAAA,SACAC,wBAAAA,gBACAC,eAAAA,OACAC,gBAAAA,iCACAC,UAAAA,wCAAW,mDACXC,WAAAA,0CAAY,0BACTC;QAzBHvB;QACAC;QACAC;QACAC;QAEAC;QACAC;QACAC;QACAC;QAEAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;;IAGA,qBACE,oBAAC7B;QACCY,MAAMA;QACNE,YAAYA;QACZD,OAAOA;QACPF,WAAWb,WAAWgC,UAAUC,yCAA6CpB;qBAE7E,oBAACV,kDACK6B;QACJC,UAAUD,UAAUC,YAAa,CAACD,UAAUE,WAAW,CAACF,UAAUG;QAClEL,UAAUA;QACVC,WAAWA;QACXlB,SAAS;QAER,AAACM,CAAAA,OAAOC,MAAK,mBACZ,oBAACgB;QACCC,KAAKpB;QACLJ,SAAS;QACTM,KAAKA;QACLC,QAAQA;QACRC,KAAKA;QACLG,aAAaA;QACbC,UAAUA;QACVC,SAASA;QACTC,gBAAgBA;QAChBC,OAAOA;QACPC,QAAQA;QACRN,QAAQA;QACRR,OAAO;YAAEG,WAAAA;QAAU;QACnBI,OAAM;sBAGV,oBAACgB;QAAIzB,SAAS;OACXZ,aAAaQ,2BACZ,oBAACL;QACCS,WAAWb;QACXuC,QAAO;QACPC,OAAM;QACNC,MAAAA;OAEChC,WAGJR,aAAaS,yBACZ,oBAACJ;QAASO,SAAS;QAA+B0B,QAAO;QAAIC,OAAM;OAChE9B,SAGJT,aAAaU,uBAAS,oBAACJ;QAAKM,SAAS;OAAgCF,OACrEV,aAAaW,0BACZ,oBAACP;QACCQ,WAAWb;OAEVY;AAOf,EAAE"}

package/dist/components/Counter/Counter.d.ts

@@ -11,4 +11,4 @@ export interface CounterProps extends React.HTMLAttributes<HTMLSpanElement> {
 /**
  * @see https://vkcom.github.io/VKUI/#/Counter
  */
-export declare const Counter: ({ mode, size, children, className, ...restProps }: CounterProps) => JSX.Element | null;
+export declare const Counter: ({ mode, size, children, className, ...restProps }: CounterProps) => React.JSX.Element | null;

package/dist/components/Counter/Counter.js

@@ -1,6 +1,6 @@
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { Caption } from "../Typography/Caption/Caption";

package/dist/components/Counter/Counter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Counter.module.css';\n\nconst modeClassNames = {\n  secondary: styles['Counter--mode-secondary'],\n  primary: styles['Counter--mode-primary'],\n  prominent: styles['Counter--mode-prominent'],\n  contrast: styles['Counter--mode-contrast'],\n  inherit: styles['Counter--mode-inherit'],\n};\n\nconst sizeClassNames = {\n  s: styles['Counter--size-s'],\n  m: styles['Counter--size-m'],\n};\n\nexport interface CounterProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Тип счетчика.  В режиме `inherit` если компонент находится в кнопке, то\n   * цвета зависят от кнопки. Если компонент находится вне кнопки, применяется\n   * режим `secondary`\n   */\n  mode?: 'secondary' | 'primary' | 'prominent' | 'contrast' | 'inherit';\n  size?: 's' | 'm';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Counter\n */\nexport const Counter = ({\n  mode = 'inherit',\n  size = 'm',\n  children,\n  className,\n  ...restProps\n}: CounterProps) => {\n  if (React.Children.count(children) === 0) {\n    return null;\n  }\n\n  const CounterTypography = size === 's' ? Caption : Headline;\n  const counterLevel = size === 's' ? '1' : '2';\n\n  return (\n    <CounterTypography\n      {...restProps}\n      Component=\"span\"\n      className={classNames(\n        'vkuiInternalCounter',\n        styles['Counter'],\n        modeClassNames[mode],\n        sizeClassNames[size],\n        className,\n      )}\n      level={counterLevel}\n    >\n      {children}\n    </CounterTypography>\n  );\n};\n"],"names":["React","classNames","Caption","Headline","modeClassNames","secondary","primary","prominent","contrast","inherit","sizeClassNames","s","m","Counter","mode","size","children","className","restProps","Children","count","CounterTypography","counterLevel","Component","level"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAG3D,IAAMC,iBAAiB;IACrBC,SAAS;IACTC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACRC,OAAO;AACT;AAEA,IAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAYA;;CAEC,GACD,OAAO,IAAMC,UAAU,iBAMH;6BALlBC,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,mBACPC,kBAAAA,UACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIjB,MAAMmB,QAAQ,CAACC,KAAK,CAACJ,cAAc,GAAG;QACxC,OAAO,IAAI;IACb,CAAC;IAED,IAAMK,oBAAoBN,SAAS,MAAMb,UAAUC,QAAQ;IAC3D,IAAMmB,eAAeP,SAAS,MAAM,MAAM,GAAG;IAE7C,qBACE,oBAACM,2DACKH;QACJK,WAAU;QACVN,WAAWhB,WACT,sCAEAG,cAAc,CAACU,KAAK,EACpBJ,cAAc,CAACK,KAAK,EACpBE;QAEFO,OAAOF;QAENN;AAGP,EAAE"}
+{"version":3,"sources":["../../../src/components/Counter/Counter.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Counter.module.css';\n\nconst modeClassNames = {\n  secondary: styles['Counter--mode-secondary'],\n  primary: styles['Counter--mode-primary'],\n  prominent: styles['Counter--mode-prominent'],\n  contrast: styles['Counter--mode-contrast'],\n  inherit: styles['Counter--mode-inherit'],\n};\n\nconst sizeClassNames = {\n  s: styles['Counter--size-s'],\n  m: styles['Counter--size-m'],\n};\n\nexport interface CounterProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Тип счетчика.  В режиме `inherit` если компонент находится в кнопке, то\n   * цвета зависят от кнопки. Если компонент находится вне кнопки, применяется\n   * режим `secondary`\n   */\n  mode?: 'secondary' | 'primary' | 'prominent' | 'contrast' | 'inherit';\n  size?: 's' | 'm';\n}\n\n/**\n * @see https://vkcom.github.io/VKUI/#/Counter\n */\nexport const Counter = ({\n  mode = 'inherit',\n  size = 'm',\n  children,\n  className,\n  ...restProps\n}: CounterProps) => {\n  if (React.Children.count(children) === 0) {\n    return null;\n  }\n\n  const CounterTypography = size === 's' ? Caption : Headline;\n  const counterLevel = size === 's' ? '1' : '2';\n\n  return (\n    <CounterTypography\n      {...restProps}\n      Component=\"span\"\n      className={classNames(\n        'vkuiInternalCounter',\n        styles['Counter'],\n        modeClassNames[mode],\n        sizeClassNames[size],\n        className,\n      )}\n      level={counterLevel}\n    >\n      {children}\n    </CounterTypography>\n  );\n};\n"],"names":["React","classNames","Caption","Headline","modeClassNames","secondary","primary","prominent","contrast","inherit","sizeClassNames","s","m","Counter","mode","size","children","className","restProps","Children","count","CounterTypography","counterLevel","Component","level"],"mappings":";;;AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,OAAO,QAAQ,gCAAgC;AACxD,SAASC,QAAQ,QAAQ,kCAAkC;AAG3D,IAAMC,iBAAiB;IACrBC,SAAS;IACTC,OAAO;IACPC,SAAS;IACTC,QAAQ;IACRC,OAAO;AACT;AAEA,IAAMC,iBAAiB;IACrBC,CAAC;IACDC,CAAC;AACH;AAYA;;CAEC,GACD,OAAO,IAAMC,UAAU;6BACrBC,MAAAA,gCAAO,8CACPC,MAAAA,gCAAO,mBACPC,kBAAAA,UACAC,mBAAAA,WACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAIjB,MAAMmB,SAASC,MAAMJ,cAAc,GAAG;QACxC,OAAO;IACT;IAEA,IAAMK,oBAAoBN,SAAS,MAAMb,UAAUC;IACnD,IAAMmB,eAAeP,SAAS,MAAM,MAAM;IAE1C,qBACE,oBAACM,2DACKH;QACJK,WAAU;QACVN,WAAWhB,WACT,sCAEAG,cAAc,CAACU,KAAK,EACpBJ,cAAc,CAACK,KAAK,EACpBE;QAEFO,OAAOF;QAENN;AAGP,EAAE"}

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

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

package/dist/components/CustomScrollView/CustomScrollView.js

@@ -7,7 +7,7 @@ import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
 import { stopPropagation } from "../../lib/utils";
 import { useTrackerVisibility } from "./useTrackerVisibility";
 export var CustomScrollView = function(param) {
-    var className = param.className, children = param.children, externalBoxRef = param.boxRef, windowResize = param.windowResize, _param_autoHideScrollbar = param.autoHideScrollbar, autoHideScrollbar = _param_autoHideScrollbar === void 0 ? false : _param_autoHideScrollbar, autoHideScrollbarDelay = param.autoHideScrollbarDelay;
+    var className = param.className, children = param.children, externalBoxRef = param.boxRef, windowResize = param.windowResize, _param_autoHideScrollbar = param.autoHideScrollbar, autoHideScrollbar = _param_autoHideScrollbar === void 0 ? false : _param_autoHideScrollbar, autoHideScrollbarDelay = param.autoHideScrollbarDelay, onScroll = param.onScroll;
     var subscribe = function subscribe(el) {
         if (el) {
             listeners.forEach(function(l) {
@@ -105,7 +105,7 @@ export var CustomScrollView = function(param) {
         }
         unsubscribe();
     };
-    var scroll = function() {
+    var scroll = function(event) {
         if (ratio.current >= 1 || !boxRef.current) {
             return;
         }
@@ -113,6 +113,7 @@ export var CustomScrollView = function(param) {
             onTargetScroll();
         }
         setTrackerPositionFromScroll(boxRef.current.scrollTop);
+        onScroll === null || onScroll === void 0 ? void 0 : onScroll(event);
     };
     var listeners = [
         useEventListener("mousemove", onMove),

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 { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { DOMProps, useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { stopPropagation } from '../../lib/utils';\nimport { TrackerOptionsProps, useTrackerVisibility } from './useTrackerVisibility';\nimport styles from './CustomScrollView.module.css';\n\nexport interface CustomScrollViewProps extends DOMProps, TrackerOptionsProps {\n  windowResize?: boolean;\n  boxRef?: React.Ref<HTMLDivElement>;\n  className?: HTMLDivElement['className'];\n  children: React.ReactNode;\n}\n\nexport const CustomScrollView = ({\n  className,\n  children,\n  boxRef: externalBoxRef,\n  windowResize,\n  autoHideScrollbar = false,\n  autoHideScrollbarDelay,\n}: CustomScrollViewProps) => {\n  const { document, window } = useDOM();\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 = () => {\n    if (ratio.current >= 1 || !boxRef.current) {\n      return;\n    }\n\n    if (autoHideScrollbar) {\n      onTargetScroll();\n    }\n\n    setTrackerPositionFromScroll(boxRef.current.scrollTop);\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 className={classNames(styles['CustomScrollView'], className)}>\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","useEventListener","useExternRef","useDOM","useIsomorphicLayoutEffect","stopPropagation","useTrackerVisibility","CustomScrollView","className","children","boxRef","externalBoxRef","windowResize","autoHideScrollbar","autoHideScrollbarDelay","subscribe","el","listeners","forEach","l","add","unsubscribe","remove","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","prop","undefined","setScrollPositionFromTracker","onMove","e","preventDefault","diff","clientY","position","min","trackerVisible","onTargetScroll","onTrackerDragStart","onTrackerDragStop","onTrackerMouseEnter","onTrackerMouseLeave","onUp","scroll","onDragStart","div","tabIndex","ref","onScroll","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 { useEventListener } from '../../hooks/useEventListener';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { DOMProps, useDOM } from '../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { stopPropagation } from '../../lib/utils';\nimport { TrackerOptionsProps, useTrackerVisibility } from './useTrackerVisibility';\nimport styles from './CustomScrollView.module.css';\n\nexport interface CustomScrollViewProps extends DOMProps, 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}: CustomScrollViewProps) => {\n  const { document, window } = useDOM();\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 className={classNames(styles['CustomScrollView'], className)}>\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","useEventListener","useExternRef","useDOM","useIsomorphicLayoutEffect","stopPropagation","useTrackerVisibility","CustomScrollView","className","children","boxRef","externalBoxRef","windowResize","autoHideScrollbar","autoHideScrollbarDelay","onScroll","subscribe","el","listeners","forEach","l","add","unsubscribe","remove","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","prop","undefined","setScrollPositionFromTracker","onMove","e","preventDefault","diff","clientY","position","min","trackerVisible","onTargetScroll","onTrackerDragStart","onTrackerDragStop","onTrackerMouseEnter","onTrackerMouseLeave","onUp","scroll","event","onDragStart","div","tabIndex","ref","onClick","onMouseEnter","onMouseLeave","onMouseDown"],"mappings":"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"}

package/dist/components/CustomScrollView/useTrackerVisibility.js

@@ -1,4 +1,4 @@
-import _sliced_to_array from "@swc/helpers/src/_sliced_to_array.mjs";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
 import * as React from "react";
 import { useTimeout } from "../../hooks/useTimeout";
 /**

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","useState","trackerVisible","setTrackerVisible","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,IAAMC,uBAAuB,WAGP;QAF3BC,qFAAoB,KAAK,EACzBC,0FAAyB;IAEzB,IAA4CJ,mCAAAA,MAAMK,QAAQ,CAAC,CAACF,wBAArDG,iBAAqCN,oBAArBO,oBAAqBP;IAC5C,IAAMQ,cAAcR,MAAMS,MAAM,CAAC,KAAK;IACtC,IAAMC,oBAAoBV,MAAMS,MAAM,CAAC,KAAK;IAE5C,IAAqER,cAAAA,WACnE;eAAMM,kBAAkB,KAAK;OAC7BH,yBAFMO,AAAKC,uBAAwDX,YAA7DU,KAA2BE,AAAOC,yBAA2Bb,YAAlCY;IAKnC,IAAME,qBAAqBf,MAAMgB,WAAW,CAAC,WAAM;QACjDF;QACAP,kBAAkB,IAAI;QACtBG,kBAAkBO,OAAO,GAAG,IAAI;IAClC,GAAG;QAACH;KAAuB;IAE3B,IAAMI,oBAAoBlB,MAAMgB,WAAW,CAAC,WAAM;QAChDN,kBAAkBO,OAAO,GAAG,KAAK;QACjC,IAAI,CAACT,YAAYS,OAAO,EAAE;YACxBL;QACF,CAAC;IACH,GAAG;QAACA;QAAsBJ;KAAY;IAEtC;;;GAGC,GACD,IAAMW,yBAAyBnB,MAAMgB,WAAW,CAAC,WAAM;QACrD,IAAIN,kBAAkBO,OAAO,EAAE;YAC7B;QACF,CAAC;QACDV,kBAAkB,IAAI;QACtBK;IACF,GAAG;QAACA;KAAqB;IAEzB,IAAMQ,sBAAsBpB,MAAMgB,WAAW,CAAC,WAAM;QAClDF;QACAN,YAAYS,OAAO,GAAG,IAAI;QAC1BV,kBAAkB,IAAI;IACxB,GAAG;QAACO;KAAuB;IAE3B,IAAMO,sBAAsBrB,MAAMgB,WAAW,CAAC,WAAM;QAClDG;QACAX,YAAYS,OAAO,GAAG,KAAK;IAC7B,GAAG;QAACE;KAAuB;IAE3B,IAAMG,iBAAiBtB,MAAMgB,WAAW,CAAC,WAAM;QAC7CG;IACF,GAAG;QAACA;KAAuB;IAE3B,OAAO;QACLb,gBAAAA;QACAS,oBAAAA;QACAG,mBAAAA;QACAE,qBAAAA;QACAC,qBAAAA;QACAC,gBAAAA;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","useState","trackerVisible","setTrackerVisible","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,IAAMC,uBAAuB;QAClCC,qFAAoB,OACpBC,0FAAyB;IAEzB,IAA4CJ,mCAAAA,MAAMK,SAAS,CAACF,wBAArDG,iBAAqCN,oBAArBO,oBAAqBP;IAC5C,IAAMQ,cAAcR,MAAMS,OAAO;IACjC,IAAMC,oBAAoBV,MAAMS,OAAO;IAEvC,IAAqER,cAAAA,WACnE;eAAMM,kBAAkB;OACxBH,yBAFMO,AAAKC,uBAAwDX,YAA7DU,KAA2BE,AAAOC,yBAA2Bb,YAAlCY;IAKnC,IAAME,qBAAqBf,MAAMgB,YAAY;QAC3CF;QACAP,kBAAkB;QAClBG,kBAAkBO,UAAU;IAC9B,GAAG;QAACH;KAAuB;IAE3B,IAAMI,oBAAoBlB,MAAMgB,YAAY;QAC1CN,kBAAkBO,UAAU;QAC5B,IAAI,CAACT,YAAYS,SAAS;YACxBL;QACF;IACF,GAAG;QAACA;QAAsBJ;KAAY;IAEtC;;;GAGC,GACD,IAAMW,yBAAyBnB,MAAMgB,YAAY;QAC/C,IAAIN,kBAAkBO,SAAS;YAC7B;QACF;QACAV,kBAAkB;QAClBK;IACF,GAAG;QAACA;KAAqB;IAEzB,IAAMQ,sBAAsBpB,MAAMgB,YAAY;QAC5CF;QACAN,YAAYS,UAAU;QACtBV,kBAAkB;IACpB,GAAG;QAACO;KAAuB;IAE3B,IAAMO,sBAAsBrB,MAAMgB,YAAY;QAC5CG;QACAX,YAAYS,UAAU;IACxB,GAAG;QAACE;KAAuB;IAE3B,IAAMG,iBAAiBtB,MAAMgB,YAAY;QACvCG;IACF,GAAG;QAACA;KAAuB;IAE3B,OAAO;QACLb,gBAAAA;QACAS,oBAAAA;QACAG,mBAAAA;QACAE,qBAAAA;QACAC,qBAAAA;QACAC,gBAAAA;IACF;AACF,EAAE"}

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

@@ -36,6 +36,10 @@ export interface SelectProps extends NativeSelectProps, FormFieldProps, TrackerO
     /**
      * Рендер-проп для кастомного рендера опции.
      * В объекте аргумента приходят [свойства опции](https://vkcom.github.io/VKUI/#/CustomSelectOption?id=props)
+     *
+     * > ⚠️  Важно: cвойство опции `disabled` должно выставляться только через проп `options`.
+     * > Запрещается выставлять `disabled` проп опциям в обход `options`, иначе селект не будет знать об актуальном состоянии
+     * опции.
      */
     renderOption?: (props: CustomSelectOptionProps) => React.ReactNode;
     /**
@@ -73,5 +77,5 @@ export interface SelectProps extends NativeSelectProps, FormFieldProps, TrackerO
 /**
  * @see https://vkcom.github.io/VKUI/#/CustomSelect
  */
-export declare function CustomSelect(props: SelectProps): JSX.Element;
+export declare function CustomSelect(props: SelectProps): React.JSX.Element;
 export {};

package/dist/components/CustomSelect/CustomSelect.js

@@ -1,9 +1,9 @@
-import _define_property from "@swc/helpers/src/_define_property.mjs";
-import _object_spread from "@swc/helpers/src/_object_spread.mjs";
-import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
-import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
-import _sliced_to_array from "@swc/helpers/src/_sliced_to_array.mjs";
-import _type_of from "@swc/helpers/src/_type_of.mjs";
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
+import { _ as _type_of } from "@swc/helpers/_/_type_of";
 import * as React from "react";
 import { classNames } from "@vkontakte/vkjs";
 import { useAdaptivity } from "../../hooks/useAdaptivity";