npm - @vkontakte/vkui - Versions diffs - 8.0.1 → 8.1.0 - Mend

@vkontakte/vkui 8.0.1 → 8.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1368) hide show

package/dist/cssm/components/ChipsSelect/ChipsSelect.js.map CHANGED Viewed

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

package/dist/cssm/components/ChipsSelect/useChipsSelect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ChipsSelect/useChipsSelect.ts"],"sourcesContent":["import * as React from 'react';\nimport { isEqual } from '@vkontakte/vkjs';\nimport type { SimulateReactInputTargetState } from '../../lib/react';\nimport { defaultFilterFn, type FilterFn, type SortFn } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n transformValue,\n useChipsInput,\n type UseChipsInputProps,\n} from '../ChipsInput/useChipsInput';\nimport {\n DEFAULT_INPUT_VALUE,\n DEFAULT_VALUE,\n getNewOptionDataDefault,\n getOptionLabelDefault,\n getOptionValueDefault,\n} from '../ChipsInputBase/constants';\nimport type { ChipOption, ChipOptionLabel, ChipOptionValue } from '../ChipsInputBase/types';\nimport { DEFAULT_EMPTY_TEXT, DEFAULT_SELECTED_BEHAVIOR, isNotServicePreset } from './constants';\nimport type { OptionPreset } from './types';\n\nexport interface UseChipsSelectProps<O extends ChipOption = ChipOption>\n extends UseChipsInputProps<O> {\n /*\n Список опций в выпадающем списке.\n /\n options?: O[];\n /\n Возможность создавать чипы которых нет в списке:\n * - `true` – добавление по кнопке Enter;\n * - `<текст>` – помимо возможности добавления через Enter, в пункте меню появится кнопка с текстом.\n * Текст для пункта, создающего чипы при нажатии, также отвечает за то, будет ли показан этот пункт\n * (показывается после того как в списке не останется опций).\n /\n creatable?: boolean \| string;\n /\n Текст, который показывается если список опций пуст.\n /\n emptyText?: string;\n /\n Показывать или скрывать уже выбранные опции.\n /\n selectedBehavior?: 'hide' \| 'highlight';\n /\n Функция для фильтрации опций в списке.\n /\n filterFn?: false \| FilterFn<O>;\n /\n Функция для сортировки опций в списке.\n /\n sortFn?: false \| SortFn<O>;\n /\n Будет вызвано в момент скрытия выпадающего списка.\n /\n onClose?: VoidFunction;\n /\n Будет вызвано в момент открытия выпадающего списка.\n */\n onOpen?: VoidFunction;\n}\n\nexport const useChipsSelect = <O extends ChipOption>({\n // common\n disabled,\n delimiter,\n\n // option\n value: valueProp,\n defaultValue,\n onChange,\n getOptionLabel = getOptionLabelDefault,\n getOptionValue = getOptionValueDefault,\n getNewOptionData = getNewOptionDataDefault,\n\n // input\n inputValue: inputValueProp,\n defaultInputValue = DEFAULT_INPUT_VALUE,\n onInputChange: onInputChangeProp,\n\n // dropdown\n creatable = false,\n emptyText = DEFAULT_EMPTY_TEXT,\n filterFn = defaultFilterFn,\n sortFn = false,\n selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n options: optionsProp = DEFAULT_VALUE,\n onClose,\n onOpen,\n}: UseChipsSelectProps<O>): {\n // options\n value: Array<\n O & {\n label: ChipOptionLabel;\n value: ChipOptionValue;\n }\n >;\n // input\n inputValue: string;\n onInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n // dropdown states\n options: Array<OptionPreset<O>>;\n opened: boolean;\n setOpened: (isOpened: boolean) => void;\n focusedOption: O \| null;\n focusedOptionIndex: number \| null;\n setFocusedOption: React.Dispatch<React.SetStateAction<O \| null>>;\n setFocusedOptionIndex: React.Dispatch<React.SetStateAction<number \| null>>;\n addOption: (newValue: string \| O) => void;\n addOptionFromInput: (inputValue: string) => void;\n removeOption: (newValue: ChipOptionValue \| O) => void;\n clearOptions: () => void;\n inputRef: React.RefObject<(HTMLInputElement & SimulateReactInputTargetState) \| null>;\n clearInput: () => void;\n} => {\n const { value, inputValue, onInputChange, ...restChipsInputProps } = useChipsInput({\n // option\n value: valueProp,\n defaultValue,\n onChange,\n getOptionValue,\n getOptionLabel,\n getNewOptionData,\n\n // input\n inputValue: inputValueProp,\n defaultInputValue,\n onInputChange: onInputChangeProp,\n\n // other\n disabled,\n delimiter,\n });\n\n // dropdown\n const [opened, setOpened] = React.useState(false);\n const [options, setOptions] = React.useState<Array<OptionPreset<O>>>(() =>\n opened\n ? transformOptions({\n value,\n getOptionValue,\n getOptionLabel,\n inputValue,\n emptyText,\n creatable,\n filterFn,\n sortFn,\n options: optionsProp,\n selectedBehavior,\n })\n : [],\n );\n const [focusedOptionIndex, setFocusedOptionIndex] = React.useState<number \| null>(0);\n const [focusedOption, setFocusedOption] = React.useState<O \| null>(null);\n\n const handleOpened = React.useCallback(\n (isOpened: boolean) => {\n isOpened ? onOpen?.() : onClose?.();\n setOpened(isOpened);\n },\n [onOpen, onClose],\n );\n\n const handleInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n onInputChange(event, !!creatable);\n\n if (!opened) {\n handleOpened(true);\n setFocusedOptionIndex(0);\n }\n },\n [onInputChange, creatable, opened, handleOpened],\n );\n\n useIsomorphicLayoutEffect(\n function handleDropdownOpen() {\n if (!opened) {\n return;\n }\n\n setOptions((prevOptions) => {\n const nextOptions = transformOptions({\n value,\n getOptionValue,\n getOptionLabel,\n inputValue,\n emptyText,\n creatable,\n filterFn,\n sortFn,\n options: optionsProp,\n selectedBehavior,\n });\n\n if (isEqual(prevOptions, nextOptions)) {\n return prevOptions;\n }\n\n return nextOptions;\n });\n },\n [\n opened,\n value,\n getOptionLabel,\n getOptionValue,\n inputValue,\n optionsProp,\n creatable,\n selectedBehavior,\n filterFn,\n sortFn,\n ],\n );\n\n return {\n ...restChipsInputProps,\n\n // options\n value,\n\n // input\n inputValue,\n onInputChange: handleInputChange,\n\n // dropdown states\n options,\n opened,\n setOpened: handleOpened,\n focusedOption,\n focusedOptionIndex,\n setFocusedOption,\n setFocusedOptionIndex,\n };\n};\n\nfunction transformOptions<O extends ChipOption>({\n value,\n getOptionValue = getOptionValueDefault,\n getOptionLabel = getOptionLabelDefault,\n inputValue = DEFAULT_INPUT_VALUE,\n emptyText = DEFAULT_EMPTY_TEXT,\n creatable = false,\n sortFn = false,\n filterFn = defaultFilterFn,\n options: optionsProp = DEFAULT_VALUE,\n selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n}: Required<Pick<UseChipsSelectProps<O>, 'value'>> &\n Pick<\n UseChipsSelectProps<O>,\n \| 'getOptionValue'\n \| 'getOptionLabel'\n \| 'inputValue'\n \| 'emptyText'\n \| 'creatable'\n \| 'filterFn'\n \| 'sortFn'\n \| 'options'\n \| 'selectedBehavior'\n >) {\n const filteredOptionsProp = filterFn\n ? optionsProp.filter((option) => filterFn(inputValue, option, getOptionLabel))\n : optionsProp;\n\n if (filteredOptionsProp.length === 0) {\n if (inputValue !== DEFAULT_INPUT_VALUE && typeof creatable === 'string') {\n return [{ actionText: creatable }];\n }\n return [{ placeholder: emptyText }];\n }\n\n if (sortFn) {\n filteredOptionsProp.sort((optionA, optionB) => sortFn(optionA, optionB, inputValue));\n }\n\n const parsedOptions = transformValue(filteredOptionsProp, getOptionValue, getOptionLabel);\n\n if (selectedBehavior === 'hide') {\n const selected = value.map((item) => item.value);\n return parsedOptions.filter((item) =>\n isNotServicePreset(item) ? !selected.includes(item.value) : false,\n );\n }\n return parsedOptions;\n}\n"],"names":["React","isEqual","defaultFilterFn","useIsomorphicLayoutEffect","transformValue","useChipsInput","DEFAULT_INPUT_VALUE","DEFAULT_VALUE","getNewOptionDataDefault","getOptionLabelDefault","getOptionValueDefault","DEFAULT_EMPTY_TEXT","DEFAULT_SELECTED_BEHAVIOR","isNotServicePreset","useChipsSelect","disabled","delimiter","value","valueProp","defaultValue","onChange","getOptionLabel","getOptionValue","getNewOptionData","inputValue","inputValueProp","defaultInputValue","onInputChange","onInputChangeProp","creatable","emptyText","filterFn","sortFn","selectedBehavior","options","optionsProp","onClose","onOpen","restChipsInputProps","opened","setOpened","useState","setOptions","transformOptions","focusedOptionIndex","setFocusedOptionIndex","focusedOption","setFocusedOption","handleOpened","useCallback","isOpened","handleInputChange","event","handleDropdownOpen","prevOptions","nextOptions","filteredOptionsProp","filter","option","length","actionText","placeholder","sort","optionA","optionB","parsedOptions","selected","map","item","includes"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/ChipsSelect/useChipsSelect.ts"],"sourcesContent":["import * as React from 'react';\nimport { isEqual } from '@vkontakte/vkjs';\nimport type { SimulateReactInputTargetState } from '../../lib/react';\nimport { defaultFilterFn, type FilterFn, type SortFn } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport {\n transformValue,\n useChipsInput,\n type UseChipsInputProps,\n} from '../ChipsInput/useChipsInput';\nimport {\n DEFAULT_INPUT_VALUE,\n DEFAULT_VALUE,\n getNewOptionDataDefault,\n getOptionLabelDefault,\n getOptionValueDefault,\n} from '../ChipsInputBase/constants';\nimport type { ChipOption, ChipOptionLabel, ChipOptionValue } from '../ChipsInputBase/types';\nimport { DEFAULT_EMPTY_TEXT, DEFAULT_SELECTED_BEHAVIOR, isNotServicePreset } from './constants';\nimport type { OptionPreset } from './types';\n\nexport interface UseChipsSelectProps<O extends ChipOption = ChipOption>\n extends UseChipsInputProps<O> {\n /*\n Список опций в выпадающем списке.\n /\n options?: O[] \| undefined;\n /\n Возможность создавать чипы которых нет в списке:\n * - `true` – добавление по кнопке Enter;\n * - `<текст>` – помимо возможности добавления через Enter, в пункте меню появится кнопка с текстом.\n * Текст для пункта, создающего чипы при нажатии, также отвечает за то, будет ли показан этот пункт\n * (показывается после того как в списке не останется опций).\n /\n creatable?: boolean \| string \| undefined;\n /\n Текст, который показывается если список опций пуст.\n /\n emptyText?: string \| undefined;\n /\n Показывать или скрывать уже выбранные опции.\n /\n selectedBehavior?: 'hide' \| 'highlight' \| undefined;\n /\n Функция для фильтрации опций в списке.\n /\n filterFn?: false \| FilterFn<O> \| undefined;\n /\n Функция для сортировки опций в списке.\n /\n sortFn?: false \| SortFn<O> \| undefined;\n /\n Будет вызвано в момент скрытия выпадающего списка.\n /\n onClose?: VoidFunction \| undefined;\n /\n Будет вызвано в момент открытия выпадающего списка.\n */\n onOpen?: VoidFunction \| undefined;\n}\n\nexport const useChipsSelect = <O extends ChipOption>({\n // common\n disabled,\n delimiter,\n\n // option\n value: valueProp,\n defaultValue,\n onChange,\n getOptionLabel = getOptionLabelDefault,\n getOptionValue = getOptionValueDefault,\n getNewOptionData = getNewOptionDataDefault,\n\n // input\n inputValue: inputValueProp,\n defaultInputValue = DEFAULT_INPUT_VALUE,\n onInputChange: onInputChangeProp,\n\n // dropdown\n creatable = false,\n emptyText = DEFAULT_EMPTY_TEXT,\n filterFn = defaultFilterFn,\n sortFn = false,\n selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n options: optionsProp = DEFAULT_VALUE,\n onClose,\n onOpen,\n}: UseChipsSelectProps<O>): {\n // options\n value: Array<\n O & {\n label: ChipOptionLabel;\n value: ChipOptionValue;\n }\n >;\n // input\n inputValue: string;\n onInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;\n // dropdown states\n options: Array<OptionPreset<O>>;\n opened: boolean;\n setOpened: (isOpened: boolean) => void;\n focusedOption: O \| null;\n focusedOptionIndex: number \| null;\n setFocusedOption: React.Dispatch<React.SetStateAction<O \| null>>;\n setFocusedOptionIndex: React.Dispatch<React.SetStateAction<number \| null>>;\n addOption: (newValue: string \| O) => void;\n addOptionFromInput: (inputValue: string) => void;\n removeOption: (newValue: ChipOptionValue \| O) => void;\n clearOptions: () => void;\n inputRef: React.RefObject<(HTMLInputElement & SimulateReactInputTargetState) \| null>;\n clearInput: () => void;\n} => {\n const { value, inputValue, onInputChange, ...restChipsInputProps } = useChipsInput({\n // option\n value: valueProp,\n defaultValue,\n onChange,\n getOptionValue,\n getOptionLabel,\n getNewOptionData,\n\n // input\n inputValue: inputValueProp,\n defaultInputValue,\n onInputChange: onInputChangeProp,\n\n // other\n disabled,\n delimiter,\n });\n\n // dropdown\n const [opened, setOpened] = React.useState(false);\n const [options, setOptions] = React.useState<Array<OptionPreset<O>>>(() =>\n opened\n ? transformOptions({\n value,\n getOptionValue,\n getOptionLabel,\n inputValue,\n emptyText,\n creatable,\n filterFn,\n sortFn,\n options: optionsProp,\n selectedBehavior,\n })\n : [],\n );\n const [focusedOptionIndex, setFocusedOptionIndex] = React.useState<number \| null>(0);\n const [focusedOption, setFocusedOption] = React.useState<O \| null>(null);\n\n const handleOpened = React.useCallback(\n (isOpened: boolean) => {\n isOpened ? onOpen?.() : onClose?.();\n setOpened(isOpened);\n },\n [onOpen, onClose],\n );\n\n const handleInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n onInputChange(event, !!creatable);\n\n if (!opened) {\n handleOpened(true);\n setFocusedOptionIndex(0);\n }\n },\n [onInputChange, creatable, opened, handleOpened],\n );\n\n useIsomorphicLayoutEffect(\n function handleDropdownOpen() {\n if (!opened) {\n return;\n }\n\n setOptions((prevOptions) => {\n const nextOptions = transformOptions({\n value,\n getOptionValue,\n getOptionLabel,\n inputValue,\n emptyText,\n creatable,\n filterFn,\n sortFn,\n options: optionsProp,\n selectedBehavior,\n });\n\n if (isEqual(prevOptions, nextOptions)) {\n return prevOptions;\n }\n\n return nextOptions;\n });\n },\n [\n opened,\n value,\n getOptionLabel,\n getOptionValue,\n inputValue,\n optionsProp,\n creatable,\n selectedBehavior,\n filterFn,\n sortFn,\n ],\n );\n\n return {\n ...restChipsInputProps,\n\n // options\n value,\n\n // input\n inputValue,\n onInputChange: handleInputChange,\n\n // dropdown states\n options,\n opened,\n setOpened: handleOpened,\n focusedOption,\n focusedOptionIndex,\n setFocusedOption,\n setFocusedOptionIndex,\n };\n};\n\nfunction transformOptions<O extends ChipOption>({\n value,\n getOptionValue = getOptionValueDefault,\n getOptionLabel = getOptionLabelDefault,\n inputValue = DEFAULT_INPUT_VALUE,\n emptyText = DEFAULT_EMPTY_TEXT,\n creatable = false,\n sortFn = false,\n filterFn = defaultFilterFn,\n options: optionsProp = DEFAULT_VALUE,\n selectedBehavior = DEFAULT_SELECTED_BEHAVIOR,\n}: {\n value: O[];\n} & Pick<\n UseChipsSelectProps<O>,\n \| 'getOptionValue'\n \| 'getOptionLabel'\n \| 'inputValue'\n \| 'emptyText'\n \| 'creatable'\n \| 'filterFn'\n \| 'sortFn'\n \| 'options'\n \| 'selectedBehavior'\n>) {\n const filteredOptionsProp = filterFn\n ? optionsProp.filter((option) => filterFn(inputValue, option, getOptionLabel))\n : optionsProp;\n\n if (filteredOptionsProp.length === 0) {\n if (inputValue !== DEFAULT_INPUT_VALUE && typeof creatable === 'string') {\n return [{ actionText: creatable }];\n }\n return [{ placeholder: emptyText }];\n }\n\n if (sortFn) {\n filteredOptionsProp.sort((optionA, optionB) => sortFn(optionA, optionB, inputValue));\n }\n\n const parsedOptions = transformValue(filteredOptionsProp, getOptionValue, getOptionLabel);\n\n if (selectedBehavior === 'hide') {\n const selected = value.map((item) => item.value);\n return parsedOptions.filter((item) =>\n isNotServicePreset(item) ? !selected.includes(item.value) : false,\n );\n }\n return parsedOptions;\n}\n"],"names":["React","isEqual","defaultFilterFn","useIsomorphicLayoutEffect","transformValue","useChipsInput","DEFAULT_INPUT_VALUE","DEFAULT_VALUE","getNewOptionDataDefault","getOptionLabelDefault","getOptionValueDefault","DEFAULT_EMPTY_TEXT","DEFAULT_SELECTED_BEHAVIOR","isNotServicePreset","useChipsSelect","disabled","delimiter","value","valueProp","defaultValue","onChange","getOptionLabel","getOptionValue","getNewOptionData","inputValue","inputValueProp","defaultInputValue","onInputChange","onInputChangeProp","creatable","emptyText","filterFn","sortFn","selectedBehavior","options","optionsProp","onClose","onOpen","restChipsInputProps","opened","setOpened","useState","setOptions","transformOptions","focusedOptionIndex","setFocusedOptionIndex","focusedOption","setFocusedOption","handleOpened","useCallback","isOpened","handleInputChange","event","handleDropdownOpen","prevOptions","nextOptions","filteredOptionsProp","filter","option","length","actionText","placeholder","sort","optionA","optionB","parsedOptions","selected","map","item","includes"],"mappings":"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"}

package/dist/cssm/components/Clickable/Clickable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport type { FocusVisibleModeProps } from '../../hooks/useFocusVisibleClassName';\nimport { useFocusVisibleClassName } from '../../hooks/useFocusVisibleClassName';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { clickByKeyboardHandler } from '../../lib/utils';\nimport {\n RootComponent,\n type RootComponentExtendProps,\n type RootComponentProps,\n} from '../RootComponent/RootComponent';\nimport type { StateProps } from './useState';\nimport { ClickableLockStateContext, DEFAULT_ACTIVE_EFFECT_DELAY, useState } from './useState';\nimport styles from './Clickable.module.css';\n\nfunction nonClickableProps<T>({\n href,\n onClick,\n onClickCapture,\n activeClassName,\n hoverClassName,\n hasActive,\n hasHover,\n hovered,\n unlockParentHover,\n activated,\n activeEffectDelay,\n focusVisibleMode,\n DefaultComponent,\n Component,\n ...restProps\n}: ClickableProps<T>) {\n return {\n Component: Component \|\| DefaultComponent,\n ...restProps,\n lockStateContextValue: {\n lockHoverStateBubbling: undefined,\n lockActiveStateBubbling: undefined,\n },\n };\n}\n\nfunction useClickableProps<T>({\n baseClassName,\n focusVisibleMode = 'inside',\n activeClassName,\n hoverClassName,\n activeEffectDelay = DEFAULT_ACTIVE_EFFECT_DELAY,\n hasHover = true,\n hasActive = true,\n hovered,\n activated,\n hasHoverWithChildren,\n unlockParentHover,\n onPointerEnter,\n onPointerLeave,\n onPointerDown,\n onPointerCancel,\n onPointerUp,\n onBlur,\n onFocus,\n onKeyDown,\n DefaultComponent,\n ...restProps\n}: ClickableProps<T>) {\n const { focusVisible, ...focusEvents } = useFocusVisible();\n const focusVisibleClassNames = useFocusVisibleClassName({ focusVisible, mode: focusVisibleMode });\n\n const {\n stateClassName,\n setLockHoverBubblingImmediate,\n setLockActiveBubblingImmediate,\n ...stateEvents\n } = useState({\n activeClassName,\n hoverClassName,\n activeEffectDelay,\n hasHover,\n hasActive,\n hovered,\n activated,\n unlockParentHover,\n });\n\n const handlers = mergeCalls(\n focusEvents,\n stateEvents,\n { onKeyDown: clickByKeyboardHandler },\n {\n onPointerEnter,\n onPointerLeave,\n onPointerDown,\n onPointerCancel,\n onPointerUp,\n onBlur,\n onFocus,\n onKeyDown,\n },\n );\n\n const lockStateContextValue = React.useMemo(\n () => ({\n lockHoverStateBubbling: hasHoverWithChildren ? noop : setLockHoverBubblingImmediate,\n lockActiveStateBubbling: setLockActiveBubblingImmediate,\n }),\n [setLockHoverBubblingImmediate, setLockActiveBubblingImmediate, hasHoverWithChildren],\n );\n\n return {\n baseClassName: classNames(\n baseClassName,\n styles.realClickable,\n focusVisibleClassNames,\n stateClassName,\n ),\n ...handlers,\n ...restProps,\n lockStateContextValue,\n };\n}\n\nfunction useProps<T>(props: ClickableProps<T>): RootComponentProps<T> &\n RootComponentExtendProps & {\n lockStateContextValue: {\n lockHoverStateBubbling: undefined \| ((...args: any[]) => void);\n lockActiveStateBubbling: undefined \| ((...args: any[]) => void);\n };\n } {\n const commonProps = component(props);\n const isClickable = checkClickable(props);\n\n const {\n baseClassName,\n disabled, // Игнорируем disabled из пропсов, т.к. он обрабатывается в commonProps\n Component,\n ...restProps\n } = props;\n\n const nextProps = {\n baseClassName: classNames(baseClassName, styles.host),\n ...commonProps,\n ...restProps,\n };\n\n const clickableProps = useClickableProps(nextProps);\n\n return isClickable ? clickableProps : nonClickableProps(nextProps);\n}\n\nexport interface ClickableProps<T = HTMLElement>\n extends RootComponentProps<T>,\n RootComponentExtendProps,\n FocusVisibleModeProps,\n StateProps {\n /*\n Компонент который будет при передаче `onClick`. По умолчанию `\"div\"`.\n /\n DefaultComponent?: React.ElementType;\n}\n\n/\n Проверяем, является ли компонент кликабельным.\n /\nexport function checkClickable<T>(props: ClickableProps<T>): boolean {\n return (\n (props.href !== undefined \|\|\n props.onClick !== undefined \|\|\n props.onClickCapture !== undefined \|\|\n props.Component === 'a' \|\|\n props.Component === 'button' \|\|\n props.Component === 'label' \|\|\n props.Component === 'input') &&\n !props.disabled\n );\n}\n\n/\n Определяет правильный компонент и его свойства.\n \n - если передан Component, используем его\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n /\nfunction component<T>({\n Component,\n DefaultComponent = 'div',\n onClick,\n onClickCapture,\n href,\n disabled,\n}: ClickableProps<T>): RootComponentProps<T> {\n if (Component !== undefined) {\n return { Component, disabled };\n } else if (href !== undefined) {\n return {\n Component: 'a',\n\n /\n Если ссылка отключена, добавляем атрибуты для доступности.\n \n - Тег `a` не поддерживает атрибут disabled, поэтому используем `aria-disabled`\n * - Тег `a` без `href` не является ссылкой, поэтому добавляем `role=\"link\"`.\n \n @see см. https://w3c.github.io/html-aria/#example-communicate-a-disabled-link-with-aria.\n \n /\n ...(disabled && {\n 'aria-disabled': true,\n 'role': 'link',\n }),\n };\n } else if (onClick !== undefined \|\| onClickCapture !== undefined) {\n return {\n Component: DefaultComponent,\n role: 'button',\n ...(disabled ? { 'aria-disabled': true } : { tabIndex: 0 }),\n };\n }\n\n return {};\n}\n\n/*\n Базовый кликабельный корневой компонент.\n \n - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n \n Отвечает за:\n \n - стейты наведения и нажатия\n * - a11y компонентов.\n */\nexport const Clickable = <T,>(props: ClickableProps<T>): React.ReactNode => {\n const { lockStateContextValue, children, ...restProps } = useProps(props);\n\n return (\n <RootComponent {...restProps}>\n <ClickableLockStateContext.Provider value={lockStateContextValue}>\n {children}\n </ClickableLockStateContext.Provider>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useFocusVisible","useFocusVisibleClassName","mergeCalls","clickByKeyboardHandler","RootComponent","ClickableLockStateContext","DEFAULT_ACTIVE_EFFECT_DELAY","useState","styles","nonClickableProps","href","onClick","onClickCapture","activeClassName","hoverClassName","hasActive","hasHover","hovered","unlockParentHover","activated","activeEffectDelay","focusVisibleMode","DefaultComponent","Component","restProps","lockStateContextValue","lockHoverStateBubbling","undefined","lockActiveStateBubbling","useClickableProps","baseClassName","hasHoverWithChildren","onPointerEnter","onPointerLeave","onPointerDown","onPointerCancel","onPointerUp","onBlur","onFocus","onKeyDown","focusVisible","focusEvents","focusVisibleClassNames","mode","stateClassName","setLockHoverBubblingImmediate","setLockActiveBubblingImmediate","stateEvents","handlers","useMemo","realClickable","useProps","props","commonProps","component","isClickable","checkClickable","disabled","nextProps","host","clickableProps","role","tabIndex","Clickable","children","Provider","value"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,eAAe,QAAQ,iCAA8B;AAE9D,SAASC,wBAAwB,QAAQ,0CAAuC;AAChF,SAASC,UAAU,QAAQ,0BAAuB;AAClD,SAASC,sBAAsB,QAAQ,qBAAkB;AACzD,SACEC,aAAa,QAGR,oCAAiC;AAExC,SAASC,yBAAyB,EAAEC,2BAA2B,EAAEC,QAAQ,QAAQ,gBAAa;AAC9F,OAAOC,YAAY,yBAAyB;AAE5C,SAASC,kBAAqB,EAC5BC,IAAI,EACJC,OAAO,EACPC,cAAc,EACdC,eAAe,EACfC,cAAc,EACdC,SAAS,EACTC,QAAQ,EACRC,OAAO,EACPC,iBAAiB,EACjBC,SAAS,EACTC,iBAAiB,EACjBC,gBAAgB,EAChBC,gBAAgB,EAChBC,SAAS,EACT,GAAGC,WACe;IAClB,OAAO;QACLD,WAAWA,aAAaD;QACxB,GAAGE,SAAS;QACZC,uBAAuB;YACrBC,wBAAwBC;YACxBC,yBAAyBD;QAC3B;IACF;AACF;AAEA,SAASE,kBAAqB,EAC5BC,aAAa,EACbT,mBAAmB,QAAQ,EAC3BR,eAAe,EACfC,cAAc,EACdM,oBAAoBd,2BAA2B,EAC/CU,WAAW,IAAI,EACfD,YAAY,IAAI,EAChBE,OAAO,EACPE,SAAS,EACTY,oBAAoB,EACpBb,iBAAiB,EACjBc,cAAc,EACdC,cAAc,EACdC,aAAa,EACbC,eAAe,EACfC,WAAW,EACXC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTjB,gBAAgB,EAChB,GAAGE,WACe;IAClB,MAAM,EAAEgB,YAAY,EAAE,GAAGC,aAAa,GAAGzC;IACzC,MAAM0C,yBAAyBzC,yBAAyB;QAAEuC;QAAcG,MAAMtB;IAAiB;IAE/F,MAAM,EACJuB,cAAc,EACdC,6BAA6B,EAC7BC,8BAA8B,EAC9B,GAAGC,aACJ,GAAGxC,SAAS;QACXM;QACAC;QACAM;QACAJ;QACAD;QACAE;QACAE;QACAD;IACF;IAEA,MAAM8B,WAAW9C,WACfuC,aACAM,aACA;QAAER,WAAWpC;IAAuB,GACpC;QACE6B;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAGF,MAAMd,wBAAwB5B,MAAMoD,OAAO,CACzC,IAAO,CAAA;YACLvB,wBAAwBK,uBAAuBhC,OAAO8C;YACtDjB,yBAAyBkB;QAC3B,CAAA,GACA;QAACD;QAA+BC;QAAgCf;KAAqB;IAGvF,OAAO;QACLD,eAAehC,WACbgC,eACAtB,OAAO0C,aAAa,EACpBR,wBACAE;QAEF,GAAGI,QAAQ;QACX,GAAGxB,SAAS;QACZC;IACF;AACF;AAEA,SAAS0B,SAAYC,KAAwB;IAO3C,MAAMC,cAAcC,UAAUF;IAC9B,MAAMG,cAAcC,eAAeJ;IAEnC,MAAM,EACJtB,aAAa,EACb2B,QAAQ,EACRlC,SAAS,EACT,GAAGC,WACJ,GAAG4B;IAEJ,MAAMM,YAAY;QAChB5B,eAAehC,WAAWgC,eAAetB,OAAOmD,IAAI;QACpD,GAAGN,WAAW;QACd,GAAG7B,SAAS;IACd;IAEA,MAAMoC,iBAAiB/B,kBAAkB6B;IAEzC,OAAOH,cAAcK,iBAAiBnD,kBAAkBiD;AAC1D;AAaA;;CAEC,GACD,OAAO,SAASF,eAAkBJ,KAAwB;IACxD,OACE,AAACA,CAAAA,MAAM1C,IAAI,KAAKiB,aACdyB,MAAMzC,OAAO,KAAKgB,aAClByB,MAAMxC,cAAc,KAAKe,aACzByB,MAAM7B,SAAS,KAAK,OACpB6B,MAAM7B,SAAS,KAAK,YACpB6B,MAAM7B,SAAS,KAAK,WACpB6B,MAAM7B,SAAS,KAAK,OAAM,KAC5B,CAAC6B,MAAMK,QAAQ;AAEnB;AAEA;;;;;;;CAOC,GACD,SAASH,UAAa,EACpB/B,SAAS,EACTD,mBAAmB,KAAK,EACxBX,OAAO,EACPC,cAAc,EACdF,IAAI,EACJ+C,QAAQ,EACU;IAClB,IAAIlC,cAAcI,WAAW;QAC3B,OAAO;YAAEJ;YAAWkC;QAAS;IAC/B,OAAO,IAAI/C,SAASiB,WAAW;QAC7B,OAAO;YACLJ,WAAW;YAEX;;;;;;;;OAQC,GACD,GAAIkC,YAAY;gBACd,iBAAiB;gBACjB,QAAQ;YACV,CAAC;QACH;IACF,OAAO,IAAI9C,YAAYgB,aAAaf,mBAAmBe,WAAW;QAChE,OAAO;YACLJ,WAAWD;YACXuC,MAAM;YACN,GAAIJ,WAAW;gBAAE,iBAAiB;YAAK,IAAI;gBAAEK,UAAU;YAAE,CAAC;QAC5D;IACF;IAEA,OAAO,CAAC;AACV;AAEA;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,YAAY,CAAKX;IAC5B,MAAM,EAAE3B,qBAAqB,EAAEuC,QAAQ,EAAE,GAAGxC,WAAW,GAAG2B,SAASC;IAEnE,qBACE,KAAChD;QAAe,GAAGoB,SAAS;kBAC1B,cAAA,KAACnB,0BAA0B4D,QAAQ;YAACC,OAAOzC;sBACxCuC;;;AAIT,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/Clickable/Clickable.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { useFocusVisible } from '../../hooks/useFocusVisible';\nimport type { FocusVisibleModeProps } from '../../hooks/useFocusVisibleClassName';\nimport { useFocusVisibleClassName } from '../../hooks/useFocusVisibleClassName';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { clickByKeyboardHandler } from '../../lib/utils';\nimport {\n RootComponent,\n type RootComponentExtendProps,\n type RootComponentProps,\n} from '../RootComponent/RootComponent';\nimport type { StateProps } from './useState';\nimport { ClickableLockStateContext, DEFAULT_ACTIVE_EFFECT_DELAY, useState } from './useState';\nimport styles from './Clickable.module.css';\n\nfunction nonClickableProps<T>({\n href,\n onClick,\n onClickCapture,\n activeClassName,\n hoverClassName,\n hasActive,\n hasHover,\n hovered,\n unlockParentHover,\n activated,\n activeEffectDelay,\n focusVisibleMode,\n DefaultComponent,\n Component,\n ...restProps\n}: ClickableProps<T>) {\n return {\n Component: Component \|\| DefaultComponent,\n ...restProps,\n lockStateContextValue: {\n lockHoverStateBubbling: undefined,\n lockActiveStateBubbling: undefined,\n },\n };\n}\n\nfunction useClickableProps<T>({\n baseClassName,\n focusVisibleMode = 'inside',\n activeClassName,\n hoverClassName,\n activeEffectDelay = DEFAULT_ACTIVE_EFFECT_DELAY,\n hasHover = true,\n hasActive = true,\n hovered,\n activated,\n hasHoverWithChildren,\n unlockParentHover,\n onPointerEnter,\n onPointerLeave,\n onPointerDown,\n onPointerCancel,\n onPointerUp,\n onBlur,\n onFocus,\n onKeyDown,\n DefaultComponent,\n ...restProps\n}: ClickableProps<T>) {\n const { focusVisible, ...focusEvents } = useFocusVisible();\n const focusVisibleClassNames = useFocusVisibleClassName({ focusVisible, mode: focusVisibleMode });\n\n const {\n stateClassName,\n setLockHoverBubblingImmediate,\n setLockActiveBubblingImmediate,\n ...stateEvents\n } = useState({\n activeClassName,\n hoverClassName,\n activeEffectDelay,\n hasHover,\n hasActive,\n hovered,\n activated,\n unlockParentHover,\n });\n\n const handlers = mergeCalls(\n focusEvents,\n stateEvents,\n { onKeyDown: clickByKeyboardHandler },\n {\n onPointerEnter,\n onPointerLeave,\n onPointerDown,\n onPointerCancel,\n onPointerUp,\n onBlur,\n onFocus,\n onKeyDown,\n },\n );\n\n const lockStateContextValue = React.useMemo(\n () => ({\n lockHoverStateBubbling: hasHoverWithChildren ? noop : setLockHoverBubblingImmediate,\n lockActiveStateBubbling: setLockActiveBubblingImmediate,\n }),\n [setLockHoverBubblingImmediate, setLockActiveBubblingImmediate, hasHoverWithChildren],\n );\n\n return {\n baseClassName: classNames(\n baseClassName,\n styles.realClickable,\n focusVisibleClassNames,\n stateClassName,\n ),\n ...handlers,\n ...restProps,\n lockStateContextValue,\n };\n}\n\nfunction useProps<T>(props: ClickableProps<T>): RootComponentProps<T> &\n RootComponentExtendProps & {\n lockStateContextValue: {\n lockHoverStateBubbling: undefined \| ((...args: any[]) => void);\n lockActiveStateBubbling: undefined \| ((...args: any[]) => void);\n };\n } {\n const commonProps = component(props);\n const isClickable = checkClickable(props);\n\n const {\n baseClassName,\n disabled, // Игнорируем disabled из пропсов, т.к. он обрабатывается в commonProps\n Component,\n ...restProps\n } = props;\n\n const nextProps = {\n baseClassName: classNames(baseClassName, styles.host),\n ...commonProps,\n ...restProps,\n };\n\n const clickableProps = useClickableProps(nextProps);\n\n return isClickable ? clickableProps : nonClickableProps(nextProps);\n}\n\nexport interface ClickableProps<T = HTMLElement>\n extends RootComponentProps<T>,\n RootComponentExtendProps,\n FocusVisibleModeProps,\n StateProps {\n /*\n Компонент который будет при передаче `onClick`. По умолчанию `\"div\"`.\n /\n DefaultComponent?: React.ElementType \| undefined;\n}\n\n/\n Проверяем, является ли компонент кликабельным.\n /\nexport function checkClickable<T>(props: ClickableProps<T>): boolean {\n return (\n (props.href !== undefined \|\|\n props.onClick !== undefined \|\|\n props.onClickCapture !== undefined \|\|\n props.Component === 'a' \|\|\n props.Component === 'button' \|\|\n props.Component === 'label' \|\|\n props.Component === 'input') &&\n !props.disabled\n );\n}\n\n/\n Определяет правильный компонент и его свойства.\n \n - если передан Component, используем его\n * - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n /\nfunction component<T>({\n Component,\n DefaultComponent = 'div',\n onClick,\n onClickCapture,\n href,\n disabled,\n}: ClickableProps<T>): RootComponentProps<T> {\n if (Component !== undefined) {\n return { Component, disabled };\n } else if (href !== undefined) {\n return {\n Component: 'a',\n\n /\n Если ссылка отключена, добавляем атрибуты для доступности.\n \n - Тег `a` не поддерживает атрибут disabled, поэтому используем `aria-disabled`\n * - Тег `a` без `href` не является ссылкой, поэтому добавляем `role=\"link\"`.\n \n @see см. https://w3c.github.io/html-aria/#example-communicate-a-disabled-link-with-aria.\n \n /\n ...(disabled && {\n 'aria-disabled': true,\n 'role': 'link',\n }),\n };\n } else if (onClick !== undefined \|\| onClickCapture !== undefined) {\n return {\n Component: DefaultComponent,\n role: 'button',\n ...(disabled ? { 'aria-disabled': true } : { tabIndex: 0 }),\n };\n }\n\n return {};\n}\n\n/*\n Базовый кликабельный корневой компонент.\n \n - при передаче `href` превратится в `a`,\n * - при передаче `onClick` превратится в `div` c `role=\"button\"` и `tabIndex=\"0\"`.\n * - иначе используется `div`.\n \n Отвечает за:\n \n - стейты наведения и нажатия\n * - a11y компонентов.\n */\nexport const Clickable = <T,>(props: ClickableProps<T>): React.ReactNode => {\n const { lockStateContextValue, children, ...restProps } = useProps(props);\n\n return (\n <RootComponent {...restProps}>\n <ClickableLockStateContext.Provider value={lockStateContextValue}>\n {children}\n </ClickableLockStateContext.Provider>\n </RootComponent>\n );\n};\n"],"names":["React","classNames","noop","useFocusVisible","useFocusVisibleClassName","mergeCalls","clickByKeyboardHandler","RootComponent","ClickableLockStateContext","DEFAULT_ACTIVE_EFFECT_DELAY","useState","styles","nonClickableProps","href","onClick","onClickCapture","activeClassName","hoverClassName","hasActive","hasHover","hovered","unlockParentHover","activated","activeEffectDelay","focusVisibleMode","DefaultComponent","Component","restProps","lockStateContextValue","lockHoverStateBubbling","undefined","lockActiveStateBubbling","useClickableProps","baseClassName","hasHoverWithChildren","onPointerEnter","onPointerLeave","onPointerDown","onPointerCancel","onPointerUp","onBlur","onFocus","onKeyDown","focusVisible","focusEvents","focusVisibleClassNames","mode","stateClassName","setLockHoverBubblingImmediate","setLockActiveBubblingImmediate","stateEvents","handlers","useMemo","realClickable","useProps","props","commonProps","component","isClickable","checkClickable","disabled","nextProps","host","clickableProps","role","tabIndex","Clickable","children","Provider","value"],"mappings":"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"}

package/dist/cssm/components/Clickable/useState.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Clickable/useState.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc /\n\nimport as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { useStateWithDelay } from './useStateWithDelay';\n\nexport interface StateProps {\n /*\n Указывает, должен ли компонент реагировать на `hover`-состояние.\n /\n hasHover?: boolean;\n /\n Позволяет управлять `hovered`-состоянием извне.\n /\n hovered?: boolean;\n /\n Позволяет управлять `activated`-состоянием извне.\n /\n activated?: boolean;\n /\n Указывает, должен ли компонент реагировать на `active`-состояние.\n /\n hasActive?: boolean;\n\n /\n Позволяет родительскому компоненту\n * иметь `hovered`-cостояние при наведении\n * на любой дочерний элемент.\n * По умолчанию состояние hovered у родителя сбрасывается.\n \n Присваивается родителькому компоненту.\n \n @example\n * <Tappable hasHoverWithChildren>\n * <IconButton />\n * <IconButton />\n * <IconButton />\n * </Tappable>\n /\n hasHoverWithChildren?: boolean;\n\n /\n Позволяет родительскому компоненту показывать hovered-состояние при наведении\n * на текущий дочерний компонент.\n \n Присваивается дочернему компоненту.\n \n @example\n * <Tappable>\n * <IconButton unlockParentHover />\n * <IconButton unlockParentHover />\n * <IconButton />\n * </Tappable>\n /\n unlockParentHover?: boolean;\n\n /\n Длительность показа `active`-состояния.\n /\n activeEffectDelay?: number;\n\n /\n Стиль подсветки `active`-состояния.\n /\n activeClassName?: string;\n\n /\n Стиль подсветки `hover`-состояния.\n /\n hoverClassName?: string;\n}\n\nexport const DEFAULT_ACTIVE_EFFECT_DELAY = 600;\n\nconst ACTIVE_DELAY = 70;\n\ninterface UseHoverProps extends Pick<StateProps, 'hovered' \| 'hasHover'> {\n /\n Блокирование активации состояний.\n /\n lockState?: boolean;\n setParentStateLock?: (v: boolean) => void;\n}\n\n/\n Управляет наведением на компонент, игнорирует тач события.\n /\nexport function useHover({\n hovered,\n hasHover = true,\n lockState = false,\n setParentStateLock = noop,\n}: UseHoverProps = {}) {\n const [hoveredStateLocal, setHoveredStateLocal] = React.useState(false);\n\n const prevIsHoveredRef = React.useRef<boolean \| undefined>(undefined);\n\n React.useEffect(() => {\n if (!hasHover) {\n setHoveredStateLocal(false);\n prevIsHoveredRef.current = false;\n setParentStateLock(false);\n }\n }, [hasHover, setParentStateLock]);\n\n const handleHover = React.useCallback(\n (isHover: boolean) => {\n setHoveredStateLocal(isHover);\n\n const isHovered =\n hovered ??\n calculateStateValue({\n hasState: hasHover,\n isLocked: lockState,\n stateValueLocal: isHover,\n });\n\n // проверка сделана чтобы реже вызывать обновление состояния\n // контекста родителя\n if (isHovered !== prevIsHoveredRef.current) {\n prevIsHoveredRef.current = isHovered;\n setParentStateLock(isHovered);\n }\n },\n [setParentStateLock, hasHover, hovered, lockState],\n );\n\n const onPointerEnter: React.PointerEventHandler<any> = (e) => {\n if (e.pointerType === 'touch') {\n return;\n }\n\n handleHover(true);\n };\n\n const onPointerLeave = () => {\n handleHover(false);\n };\n\n const isHovered =\n hovered ??\n calculateStateValue({\n hasState: hasHover,\n isLocked: lockState,\n stateValueLocal: hoveredStateLocal,\n });\n\n return {\n isHovered,\n onPointerEnter: hasHover ? onPointerEnter : noop,\n onPointerLeave: hasHover ? onPointerLeave : noop,\n };\n}\n\ninterface UseActiveProps extends Pick<StateProps, 'activated' \| 'activeEffectDelay' \| 'hasActive'> {\n /\n Блокирование активации состояний.\n /\n lockState: boolean;\n setParentStateLock: (v: boolean) => void;\n}\n\n/\n Управляет активацией компонента.\n /\nfunction useActive({\n activated,\n activeEffectDelay,\n hasActive = true,\n lockState,\n setParentStateLock,\n}: UseActiveProps) {\n // передаём setParentStateLock, чтобы функция вызывалась вместе с установкой стейта,\n // если установка отложена c помощью delay, то и вызов будет отложен\n const [activatedState, setActivated] = useStateWithDelay<boolean>(false, 0, setParentStateLock);\n\n // Список нажатий которые не требуется отменять\n const pointersUpRef = React.useRef<Set<number>>(null);\n if (pointersUpRef.current === null) {\n pointersUpRef.current = new Set<number>();\n }\n\n React.useEffect(() => {\n if (lockState \|\| !hasActive) {\n // Сбрасываем setActivated если обнаруживаем lockState или !hasActive\n setActivated(false);\n }\n }, [lockState, hasActive, setActivated]);\n\n const onPointerDown = () => {\n if (lockState) {\n return;\n }\n\n setActivated(true, ACTIVE_DELAY);\n // намеренно выставляем lock, так как setActivated вызов отложен\n // а у отложенного setActivated setParentStateLock тоже вызовется отложено\n // родитель сейчас тоже обработает это же событие PointerDown\n // если мы не залочим activatedState у родителя сейчас, то родитель выставит active состояние\n setParentStateLock(true);\n };\n\n const onPointerCancel: React.PointerEventHandler = (e) => {\n if (pointersUpRef.current!.has(e.pointerId)) {\n pointersUpRef.current!.delete(e.pointerId);\n return;\n }\n\n setActivated(false);\n };\n\n const onPointerUp: React.PointerEventHandler = (e) => {\n pointersUpRef.current!.add(e.pointerId);\n\n if (lockState) {\n return;\n }\n\n setActivated(true);\n setActivated(false, activeEffectDelay);\n };\n\n const isActivated =\n activated ??\n calculateStateValue({\n hasState: hasActive,\n isLocked: lockState,\n stateValueLocal: activatedState,\n });\n\n return {\n isActivated,\n onPointerLeave: hasActive ? onPointerCancel : noop,\n onPointerDown: hasActive ? onPointerDown : noop,\n onPointerCancel: hasActive ? onPointerCancel : noop,\n onPointerUp: hasActive ? onPointerUp : noop,\n };\n}\n\ninterface ClickableLockStateContextInterface {\n lockHoverStateBubbling?: (v: boolean) => void;\n lockActiveStateBubbling?: (v: boolean) => void;\n}\n\nexport const ClickableLockStateContext: React.Context<ClickableLockStateContextInterface> =\n React.createContext<ClickableLockStateContextInterface>({\n lockHoverStateBubbling: undefined,\n lockActiveStateBubbling: undefined,\n });\n\n/\n Блокирует стейт на всплытие.\n /\nfunction useLockState(\n setParentStateLockBubbling: (v: boolean) => void,\n): readonly [boolean, (v: boolean) => void, (...args: any[]) => void] {\n const [lockState, setLockState] = React.useState(false);\n\n const setStateLockBubblingImmediate = React.useCallback(\n (isLock: boolean) => {\n setLockState(isLock);\n setParentStateLockBubbling(isLock);\n },\n [setParentStateLockBubbling],\n );\n\n return [lockState, setParentStateLockBubbling, setStateLockBubblingImmediate] as const;\n}\n\n/\n Управляет состоянием компонента.\n */\nexport function useState({\n hovered,\n hasHover,\n activated,\n hasActive,\n activeEffectDelay,\n unlockParentHover,\n hoverClassName,\n activeClassName,\n}: StateProps): {\n stateClassName: string;\n setLockHoverBubblingImmediate: (...args: any[]) => void;\n setLockActiveBubblingImmediate: (...args: any[]) => void;\n} {\n const { lockHoverStateBubbling = noop, lockActiveStateBubbling = noop } =\n React.useContext(ClickableLockStateContext);\n\n const [lockHoverState, setParentStateLockHoverBubbling, setLockHoverBubblingImmediate] =\n useLockState(unlockParentHover ? noop : lockHoverStateBubbling);\n const [lockActiveState, setParentStateLockActiveBubbling, setLockActiveBubblingImmediate] =\n useLockState(lockActiveStateBubbling);\n\n const { isHovered, ...hoverEvent } = useHover({\n hasHover,\n hovered,\n lockState: lockHoverState,\n setParentStateLock: setParentStateLockHoverBubbling,\n });\n\n const { isActivated, ...activeEvent } = useActive({\n activated,\n hasActive,\n activeEffectDelay,\n lockState: lockActiveState,\n setParentStateLock: setParentStateLockActiveBubbling,\n });\n\n const stateClassName = classNames(isHovered && hoverClassName, isActivated && activeClassName);\n const handlers = mergeCalls(hoverEvent, activeEvent);\n\n return {\n stateClassName,\n setLockHoverBubblingImmediate,\n setLockActiveBubblingImmediate,\n ...handlers,\n };\n}\n\n// Общая функция для определения конечного состояния active/hovered\nfunction calculateStateValue({\n hasState,\n isLocked,\n stateValueLocal,\n}: {\n hasState: boolean;\n isLocked: boolean;\n stateValueLocal: boolean;\n}): boolean {\n return hasState && !isLocked && stateValueLocal;\n}\n"],"names":["React","classNames","noop","mergeCalls","useStateWithDelay","DEFAULT_ACTIVE_EFFECT_DELAY","ACTIVE_DELAY","useHover","hovered","hasHover","lockState","setParentStateLock","hoveredStateLocal","setHoveredStateLocal","useState","prevIsHoveredRef","useRef","undefined","useEffect","current","handleHover","useCallback","isHover","isHovered","calculateStateValue","hasState","isLocked","stateValueLocal","onPointerEnter","e","pointerType","onPointerLeave","useActive","activated","activeEffectDelay","hasActive","activatedState","setActivated","pointersUpRef","Set","onPointerDown","onPointerCancel","has","pointerId","delete","onPointerUp","add","isActivated","ClickableLockStateContext","createContext","lockHoverStateBubbling","lockActiveStateBubbling","useLockState","setParentStateLockBubbling","setLockState","setStateLockBubblingImmediate","isLock","unlockParentHover","hoverClassName","activeClassName","useContext","lockHoverState","setParentStateLockHoverBubbling","setLockHoverBubblingImmediate","lockActiveState","setParentStateLockActiveBubbling","setLockActiveBubblingImmediate","hoverEvent","activeEvent","stateClassName","handlers"],"mappings":"AAAA,sCAAsC,GAEtC,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,IAAI,QAAQ,kBAAkB;AACnD,SAASC,UAAU,QAAQ,0BAAuB;AAClD,SAASC,iBAAiB,QAAQ,yBAAsB;AAoExD,OAAO,MAAMC,8BAA8B,IAAI;AAE/C,MAAMC,eAAe;AAUrB;;CAEC,GACD,OAAO,SAASC,SAAS,EACvBC,OAAO,EACPC,WAAW,IAAI,EACfC,YAAY,KAAK,EACjBC,qBAAqBT,IAAI,EACX,GAAG,CAAC,CAAC;IACnB,MAAM,CAACU,mBAAmBC,qBAAqB,GAAGb,MAAMc,QAAQ,CAAC;IAEjE,MAAMC,mBAAmBf,MAAMgB,MAAM,CAAsBC;IAE3DjB,MAAMkB,SAAS,CAAC;QACd,IAAI,CAACT,UAAU;YACbI,qBAAqB;YACrBE,iBAAiBI,OAAO,GAAG;YAC3BR,mBAAmB;QACrB;IACF,GAAG;QAACF;QAAUE;KAAmB;IAEjC,MAAMS,cAAcpB,MAAMqB,WAAW,CACnC,CAACC;QACCT,qBAAqBS;QAErB,MAAMC,YACJf,WACAgB,oBAAoB;YAClBC,UAAUhB;YACViB,UAAUhB;YACViB,iBAAiBL;QACnB;QAEF,4DAA4D;QAC5D,qBAAqB;QACrB,IAAIC,cAAcR,iBAAiBI,OAAO,EAAE;YAC1CJ,iBAAiBI,OAAO,GAAGI;YAC3BZ,mBAAmBY;QACrB;IACF,GACA;QAACZ;QAAoBF;QAAUD;QAASE;KAAU;IAGpD,MAAMkB,iBAAiD,CAACC;QACtD,IAAIA,EAAEC,WAAW,KAAK,SAAS;YAC7B;QACF;QAEAV,YAAY;IACd;IAEA,MAAMW,iBAAiB;QACrBX,YAAY;IACd;IAEA,MAAMG,YACJf,WACAgB,oBAAoB;QAClBC,UAAUhB;QACViB,UAAUhB;QACViB,iBAAiBf;IACnB;IAEF,OAAO;QACLW;QACAK,gBAAgBnB,WAAWmB,iBAAiB1B;QAC5C6B,gBAAgBtB,WAAWsB,iBAAiB7B;IAC9C;AACF;AAUA;;CAEC,GACD,SAAS8B,UAAU,EACjBC,SAAS,EACTC,iBAAiB,EACjBC,YAAY,IAAI,EAChBzB,SAAS,EACTC,kBAAkB,EACH;IACf,oFAAoF;IACpF,oEAAoE;IACpE,MAAM,CAACyB,gBAAgBC,aAAa,GAAGjC,kBAA2B,OAAO,GAAGO;IAE5E,+CAA+C;IAC/C,MAAM2B,gBAAgBtC,MAAMgB,MAAM,CAAc;IAChD,IAAIsB,cAAcnB,OAAO,KAAK,MAAM;QAClCmB,cAAcnB,OAAO,GAAG,IAAIoB;IAC9B;IAEAvC,MAAMkB,SAAS,CAAC;QACd,IAAIR,aAAa,CAACyB,WAAW;YAC3B,qEAAqE;YACrEE,aAAa;QACf;IACF,GAAG;QAAC3B;QAAWyB;QAAWE;KAAa;IAEvC,MAAMG,gBAAgB;QACpB,IAAI9B,WAAW;YACb;QACF;QAEA2B,aAAa,MAAM/B;QACnB,gEAAgE;QAChE,0EAA0E;QAC1E,6DAA6D;QAC7D,6FAA6F;QAC7FK,mBAAmB;IACrB;IAEA,MAAM8B,kBAA6C,CAACZ;QAClD,IAAIS,cAAcnB,OAAO,CAAEuB,GAAG,CAACb,EAAEc,SAAS,GAAG;YAC3CL,cAAcnB,OAAO,CAAEyB,MAAM,CAACf,EAAEc,SAAS;YACzC;QACF;QAEAN,aAAa;IACf;IAEA,MAAMQ,cAAyC,CAAChB;QAC9CS,cAAcnB,OAAO,CAAE2B,GAAG,CAACjB,EAAEc,SAAS;QAEtC,IAAIjC,WAAW;YACb;QACF;QAEA2B,aAAa;QACbA,aAAa,OAAOH;IACtB;IAEA,MAAMa,cACJd,aACAT,oBAAoB;QAClBC,UAAUU;QACVT,UAAUhB;QACViB,iBAAiBS;IACnB;IAEF,OAAO;QACLW;QACAhB,gBAAgBI,YAAYM,kBAAkBvC;QAC9CsC,eAAeL,YAAYK,gBAAgBtC;QAC3CuC,iBAAiBN,YAAYM,kBAAkBvC;QAC/C2C,aAAaV,YAAYU,cAAc3C;IACzC;AACF;AAOA,OAAO,MAAM8C,0CACXhD,MAAMiD,aAAa,CAAqC;IACtDC,wBAAwBjC;IACxBkC,yBAAyBlC;AAC3B,GAAG;AAEL;;CAEC,GACD,SAASmC,aACPC,0BAAgD;IAEhD,MAAM,CAAC3C,WAAW4C,aAAa,GAAGtD,MAAMc,QAAQ,CAAC;IAEjD,MAAMyC,gCAAgCvD,MAAMqB,WAAW,CACrD,CAACmC;QACCF,aAAaE;QACbH,2BAA2BG;IAC7B,GACA;QAACH;KAA2B;IAG9B,OAAO;QAAC3C;QAAW2C;QAA4BE;KAA8B;AAC/E;AAEA;;CAEC,GACD,OAAO,SAASzC,SAAS,EACvBN,OAAO,EACPC,QAAQ,EACRwB,SAAS,EACTE,SAAS,EACTD,iBAAiB,EACjBuB,iBAAiB,EACjBC,cAAc,EACdC,eAAe,EACJ;IAKX,MAAM,EAAET,yBAAyBhD,IAAI,EAAEiD,0BAA0BjD,IAAI,EAAE,GACrEF,MAAM4D,UAAU,CAACZ;IAEnB,MAAM,CAACa,gBAAgBC,iCAAiCC,8BAA8B,GACpFX,aAAaK,oBAAoBvD,OAAOgD;IAC1C,MAAM,CAACc,iBAAiBC,kCAAkCC,+BAA+B,GACvFd,aAAaD;IAEf,MAAM,EAAE5B,SAAS,EAAE,GAAG4C,YAAY,GAAG5D,SAAS;QAC5CE;QACAD;QACAE,WAAWmD;QACXlD,oBAAoBmD;IACtB;IAEA,MAAM,EAAEf,WAAW,EAAE,GAAGqB,aAAa,GAAGpC,UAAU;QAChDC;QACAE;QACAD;QACAxB,WAAWsD;QACXrD,oBAAoBsD;IACtB;IAEA,MAAMI,iBAAiBpE,WAAWsB,aAAamC,gBAAgBX,eAAeY;IAC9E,MAAMW,WAAWnE,WAAWgE,YAAYC;IAExC,OAAO;QACLC;QACAN;QACAG;QACA,GAAGI,QAAQ;IACb;AACF;AAEA,mEAAmE;AACnE,SAAS9C,oBAAoB,EAC3BC,QAAQ,EACRC,QAAQ,EACRC,eAAe,EAKhB;IACC,OAAOF,YAAY,CAACC,YAAYC;AAClC"}
1	+ {"version":3,"sources":["../../../../src/components/Clickable/useState.tsx"],"sourcesContent":["/* eslint-disable jsdoc/require-jsdoc /\n\nimport as React from 'react';\nimport { classNames, noop } from '@vkontakte/vkjs';\nimport { mergeCalls } from '../../lib/mergeCalls';\nimport { useStateWithDelay } from './useStateWithDelay';\n\nexport interface StateProps {\n /*\n Указывает, должен ли компонент реагировать на `hover`-состояние.\n /\n hasHover?: boolean \| undefined;\n /\n Позволяет управлять `hovered`-состоянием извне.\n /\n hovered?: boolean \| undefined;\n /\n Позволяет управлять `activated`-состоянием извне.\n /\n activated?: boolean \| undefined;\n /\n Указывает, должен ли компонент реагировать на `active`-состояние.\n /\n hasActive?: boolean \| undefined;\n\n /\n Позволяет родительскому компоненту\n * иметь `hovered`-cостояние при наведении\n * на любой дочерний элемент.\n * По умолчанию состояние hovered у родителя сбрасывается.\n \n Присваивается родителькому компоненту.\n \n @example\n * <Tappable hasHoverWithChildren>\n * <IconButton />\n * <IconButton />\n * <IconButton />\n * </Tappable>\n /\n hasHoverWithChildren?: boolean \| undefined;\n\n /\n Позволяет родительскому компоненту показывать hovered-состояние при наведении\n * на текущий дочерний компонент.\n \n Присваивается дочернему компоненту.\n \n @example\n * <Tappable>\n * <IconButton unlockParentHover />\n * <IconButton unlockParentHover />\n * <IconButton />\n * </Tappable>\n /\n unlockParentHover?: boolean \| undefined;\n\n /\n Длительность показа `active`-состояния.\n /\n activeEffectDelay?: number \| undefined;\n\n /\n Стиль подсветки `active`-состояния.\n /\n activeClassName?: string \| undefined;\n\n /\n Стиль подсветки `hover`-состояния.\n /\n hoverClassName?: string \| undefined;\n}\n\nexport const DEFAULT_ACTIVE_EFFECT_DELAY = 600;\n\nconst ACTIVE_DELAY = 70;\n\ninterface UseHoverProps extends Pick<StateProps, 'hovered' \| 'hasHover'> {\n /\n Блокирование активации состояний.\n /\n lockState?: boolean \| undefined;\n setParentStateLock?: ((v: boolean) => void) \| undefined;\n}\n\n/\n Управляет наведением на компонент, игнорирует тач события.\n /\nexport function useHover({\n hovered,\n hasHover = true,\n lockState = false,\n setParentStateLock = noop,\n}: UseHoverProps = {}) {\n const [hoveredStateLocal, setHoveredStateLocal] = React.useState(false);\n\n const prevIsHoveredRef = React.useRef<boolean \| undefined>(undefined);\n\n React.useEffect(() => {\n if (!hasHover) {\n setHoveredStateLocal(false);\n prevIsHoveredRef.current = false;\n setParentStateLock(false);\n }\n }, [hasHover, setParentStateLock]);\n\n const handleHover = React.useCallback(\n (isHover: boolean) => {\n setHoveredStateLocal(isHover);\n\n const isHovered =\n hovered ??\n calculateStateValue({\n hasState: hasHover,\n isLocked: lockState,\n stateValueLocal: isHover,\n });\n\n // проверка сделана чтобы реже вызывать обновление состояния\n // контекста родителя\n if (isHovered !== prevIsHoveredRef.current) {\n prevIsHoveredRef.current = isHovered;\n setParentStateLock(isHovered);\n }\n },\n [setParentStateLock, hasHover, hovered, lockState],\n );\n\n const onPointerEnter: React.PointerEventHandler<any> = (e) => {\n if (e.pointerType === 'touch') {\n return;\n }\n\n handleHover(true);\n };\n\n const onPointerLeave = () => {\n handleHover(false);\n };\n\n const isHovered =\n hovered ??\n calculateStateValue({\n hasState: hasHover,\n isLocked: lockState,\n stateValueLocal: hoveredStateLocal,\n });\n\n return {\n isHovered,\n onPointerEnter: hasHover ? onPointerEnter : noop,\n onPointerLeave: hasHover ? onPointerLeave : noop,\n };\n}\n\ninterface UseActiveProps extends Pick<StateProps, 'activated' \| 'activeEffectDelay' \| 'hasActive'> {\n /\n Блокирование активации состояний.\n /\n lockState: boolean;\n setParentStateLock: (v: boolean) => void;\n}\n\n/\n Управляет активацией компонента.\n /\nfunction useActive({\n activated,\n activeEffectDelay,\n hasActive = true,\n lockState,\n setParentStateLock,\n}: UseActiveProps) {\n // передаём setParentStateLock, чтобы функция вызывалась вместе с установкой стейта,\n // если установка отложена c помощью delay, то и вызов будет отложен\n const [activatedState, setActivated] = useStateWithDelay<boolean>(false, 0, setParentStateLock);\n\n // Список нажатий которые не требуется отменять\n const pointersUpRef = React.useRef<Set<number>>(null);\n if (pointersUpRef.current === null) {\n pointersUpRef.current = new Set<number>();\n }\n\n React.useEffect(() => {\n if (lockState \|\| !hasActive) {\n // Сбрасываем setActivated если обнаруживаем lockState или !hasActive\n setActivated(false);\n }\n }, [lockState, hasActive, setActivated]);\n\n const onPointerDown = () => {\n if (lockState) {\n return;\n }\n\n setActivated(true, ACTIVE_DELAY);\n // намеренно выставляем lock, так как setActivated вызов отложен\n // а у отложенного setActivated setParentStateLock тоже вызовется отложено\n // родитель сейчас тоже обработает это же событие PointerDown\n // если мы не залочим activatedState у родителя сейчас, то родитель выставит active состояние\n setParentStateLock(true);\n };\n\n const onPointerCancel: React.PointerEventHandler = (e) => {\n if (pointersUpRef.current!.has(e.pointerId)) {\n pointersUpRef.current!.delete(e.pointerId);\n return;\n }\n\n setActivated(false);\n };\n\n const onPointerUp: React.PointerEventHandler = (e) => {\n pointersUpRef.current!.add(e.pointerId);\n\n if (lockState) {\n return;\n }\n\n setActivated(true);\n setActivated(false, activeEffectDelay);\n };\n\n const isActivated =\n activated ??\n calculateStateValue({\n hasState: hasActive,\n isLocked: lockState,\n stateValueLocal: activatedState,\n });\n\n return {\n isActivated,\n onPointerLeave: hasActive ? onPointerCancel : noop,\n onPointerDown: hasActive ? onPointerDown : noop,\n onPointerCancel: hasActive ? onPointerCancel : noop,\n onPointerUp: hasActive ? onPointerUp : noop,\n };\n}\n\ninterface ClickableLockStateContextInterface {\n lockHoverStateBubbling?: ((v: boolean) => void) \| undefined;\n lockActiveStateBubbling?: ((v: boolean) => void) \| undefined;\n}\n\nexport const ClickableLockStateContext: React.Context<ClickableLockStateContextInterface> =\n React.createContext<ClickableLockStateContextInterface>({\n lockHoverStateBubbling: undefined,\n lockActiveStateBubbling: undefined,\n });\n\n/\n Блокирует стейт на всплытие.\n /\nfunction useLockState(\n setParentStateLockBubbling: (v: boolean) => void,\n): readonly [boolean, (v: boolean) => void, (...args: any[]) => void] {\n const [lockState, setLockState] = React.useState(false);\n\n const setStateLockBubblingImmediate = React.useCallback(\n (isLock: boolean) => {\n setLockState(isLock);\n setParentStateLockBubbling(isLock);\n },\n [setParentStateLockBubbling],\n );\n\n return [lockState, setParentStateLockBubbling, setStateLockBubblingImmediate] as const;\n}\n\n/\n Управляет состоянием компонента.\n */\nexport function useState({\n hovered,\n hasHover,\n activated,\n hasActive,\n activeEffectDelay,\n unlockParentHover,\n hoverClassName,\n activeClassName,\n}: StateProps): {\n stateClassName: string;\n setLockHoverBubblingImmediate: (...args: any[]) => void;\n setLockActiveBubblingImmediate: (...args: any[]) => void;\n} {\n const { lockHoverStateBubbling = noop, lockActiveStateBubbling = noop } =\n React.useContext(ClickableLockStateContext);\n\n const [lockHoverState, setParentStateLockHoverBubbling, setLockHoverBubblingImmediate] =\n useLockState(unlockParentHover ? noop : lockHoverStateBubbling);\n const [lockActiveState, setParentStateLockActiveBubbling, setLockActiveBubblingImmediate] =\n useLockState(lockActiveStateBubbling);\n\n const { isHovered, ...hoverEvent } = useHover({\n hasHover,\n hovered,\n lockState: lockHoverState,\n setParentStateLock: setParentStateLockHoverBubbling,\n });\n\n const { isActivated, ...activeEvent } = useActive({\n activated,\n hasActive,\n activeEffectDelay,\n lockState: lockActiveState,\n setParentStateLock: setParentStateLockActiveBubbling,\n });\n\n const stateClassName = classNames(isHovered && hoverClassName, isActivated && activeClassName);\n const handlers = mergeCalls(hoverEvent, activeEvent);\n\n return {\n stateClassName,\n setLockHoverBubblingImmediate,\n setLockActiveBubblingImmediate,\n ...handlers,\n };\n}\n\n// Общая функция для определения конечного состояния active/hovered\nfunction calculateStateValue({\n hasState,\n isLocked,\n stateValueLocal,\n}: {\n hasState: boolean;\n isLocked: boolean;\n stateValueLocal: boolean;\n}): boolean {\n return hasState && !isLocked && stateValueLocal;\n}\n"],"names":["React","classNames","noop","mergeCalls","useStateWithDelay","DEFAULT_ACTIVE_EFFECT_DELAY","ACTIVE_DELAY","useHover","hovered","hasHover","lockState","setParentStateLock","hoveredStateLocal","setHoveredStateLocal","useState","prevIsHoveredRef","useRef","undefined","useEffect","current","handleHover","useCallback","isHover","isHovered","calculateStateValue","hasState","isLocked","stateValueLocal","onPointerEnter","e","pointerType","onPointerLeave","useActive","activated","activeEffectDelay","hasActive","activatedState","setActivated","pointersUpRef","Set","onPointerDown","onPointerCancel","has","pointerId","delete","onPointerUp","add","isActivated","ClickableLockStateContext","createContext","lockHoverStateBubbling","lockActiveStateBubbling","useLockState","setParentStateLockBubbling","setLockState","setStateLockBubblingImmediate","isLock","unlockParentHover","hoverClassName","activeClassName","useContext","lockHoverState","setParentStateLockHoverBubbling","setLockHoverBubblingImmediate","lockActiveState","setParentStateLockActiveBubbling","setLockActiveBubblingImmediate","hoverEvent","activeEvent","stateClassName","handlers"],"mappings":"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"}

package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ConfigProvider/ConfigProvider.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { IconAppearanceProvider } from '@vkontakte/icons';\nimport { useAutoDetectColorScheme } from '../../hooks/useAutoDetectColorScheme';\nimport { useAutoDetectDirection } from '../../hooks/useAutoDetectDirection';\nimport { TokensClassProvider } from '../../lib/tokens/TokensClassProvider';\nimport { excludeKeysWithUndefined } from '../../lib/utils';\nimport {\n ConfigProviderContext,\n type ConfigProviderContextInterface,\n useConfigProvider,\n useConfigProviderContextMemo,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderProps extends ~~Partial~~<ConfigProviderContextInterface> {\n /*\n Содержимое.\n /\n children: React.ReactNode;\n}\n\n/\n @see https://vkui.io/components/config-provider\n */\nexport const ConfigProvider = (propsRaw: ConfigProviderProps): React.ReactNode => {\n const props = excludeKeysWithUndefined(propsRaw);\n const parentConfig = useConfigProvider();\n\n const mergeProps = {\n ...parentConfig,\n ...props,\n };\n\n const colorScheme = useAutoDetectColorScheme(mergeProps.colorScheme);\n const direction = useAutoDetectDirection(mergeProps.direction);\n\n const configContext = useConfigProviderContextMemo({\n ...mergeProps,\n colorScheme,\n direction,\n });\n\n return (\n <ConfigProviderContext.Provider value={configContext}>\n <IconAppearanceProvider value={colorScheme}>\n <TokensClassProvider>{mergeProps.children}</TokensClassProvider>\n </IconAppearanceProvider>\n </ConfigProviderContext.Provider>\n );\n};\n"],"names":["IconAppearanceProvider","useAutoDetectColorScheme","useAutoDetectDirection","TokensClassProvider","excludeKeysWithUndefined","ConfigProviderContext","useConfigProvider","useConfigProviderContextMemo","ConfigProvider","propsRaw","props","parentConfig","mergeProps","colorScheme","direction","configContext","Provider","value","children"],"mappings":"AAAA;;AAGA,SAASA,sBAAsB,QAAQ,mBAAmB;AAC1D,SAASC,wBAAwB,QAAQ,0CAAuC;AAChF,SAASC,sBAAsB,QAAQ,wCAAqC;AAC5E,SAASC,mBAAmB,QAAQ,0CAAuC;AAC3E,SAASC,wBAAwB,QAAQ,qBAAkB;~~AAC3D~~,SACEC,qBAAqB,EAErBC,iBAAiB,EACjBC,4BAA4B,QACvB,6BAA0B;AASjC;;CAEC,GACD,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAMC,QAAQN,yBAAyBK;IACvC,MAAME,eAAeL;IAErB,MAAMM,aAAa;QACjB,GAAGD,YAAY;QACf,GAAGD,KAAK;IACV;IAEA,MAAMG,cAAcZ,yBAAyBW,WAAWC,WAAW;IACnE,MAAMC,YAAYZ,uBAAuBU,WAAWE,SAAS;IAE7D,MAAMC,gBAAgBR,6BAA6B;QACjD,GAAGK,UAAU;QACbC;QACAC;IACF;IAEA,qBACE,KAACT,sBAAsBW,QAAQ;QAACC,OAAOF;kBACrC,cAAA,KAACf;YAAuBiB,OAAOJ;sBAC7B,cAAA,KAACV;0BAAqBS,WAAWM,QAAQ;;;;AAIjD,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/ConfigProvider/ConfigProvider.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { IconAppearanceProvider } from '@vkontakte/icons';\nimport { useAutoDetectColorScheme } from '../../hooks/useAutoDetectColorScheme';\nimport { useAutoDetectDirection } from '../../hooks/useAutoDetectDirection';\nimport { TokensClassProvider } from '../../lib/tokens/TokensClassProvider';\nimport { excludeKeysWithUndefined } from '../../lib/utils';\nimport type { PartialWithUndefined } from '../../types';\nimport {\n ConfigProviderContext,\n type ConfigProviderContextInterface,\n useConfigProvider,\n useConfigProviderContextMemo,\n} from './ConfigProviderContext';\n\nexport interface ConfigProviderProps extends PartialWithUndefined<ConfigProviderContextInterface> {\n /*\n Содержимое.\n /\n children: React.ReactNode;\n}\n\n/\n @see https://vkui.io/components/config-provider\n */\nexport const ConfigProvider = (propsRaw: ConfigProviderProps): React.ReactNode => {\n const props = excludeKeysWithUndefined(propsRaw);\n const parentConfig = useConfigProvider();\n\n const mergeProps = {\n ...parentConfig,\n ...props,\n };\n\n const colorScheme = useAutoDetectColorScheme(mergeProps.colorScheme);\n const direction = useAutoDetectDirection(mergeProps.direction);\n\n const configContext = useConfigProviderContextMemo({\n ...mergeProps,\n colorScheme,\n direction,\n });\n\n return (\n <ConfigProviderContext.Provider value={configContext}>\n <IconAppearanceProvider value={colorScheme}>\n <TokensClassProvider>{mergeProps.children}</TokensClassProvider>\n </IconAppearanceProvider>\n </ConfigProviderContext.Provider>\n );\n};\n"],"names":["IconAppearanceProvider","useAutoDetectColorScheme","useAutoDetectDirection","TokensClassProvider","excludeKeysWithUndefined","ConfigProviderContext","useConfigProvider","useConfigProviderContextMemo","ConfigProvider","propsRaw","props","parentConfig","mergeProps","colorScheme","direction","configContext","Provider","value","children"],"mappings":"AAAA;;AAGA,SAASA,sBAAsB,QAAQ,mBAAmB;AAC1D,SAASC,wBAAwB,QAAQ,0CAAuC;AAChF,SAASC,sBAAsB,QAAQ,wCAAqC;AAC5E,SAASC,mBAAmB,QAAQ,0CAAuC;AAC3E,SAASC,wBAAwB,QAAQ,qBAAkB;AAE3D,SACEC,qBAAqB,EAErBC,iBAAiB,EACjBC,4BAA4B,QACvB,6BAA0B;AASjC;;CAEC,GACD,OAAO,MAAMC,iBAAiB,CAACC;IAC7B,MAAMC,QAAQN,yBAAyBK;IACvC,MAAME,eAAeL;IAErB,MAAMM,aAAa;QACjB,GAAGD,YAAY;QACf,GAAGD,KAAK;IACV;IAEA,MAAMG,cAAcZ,yBAAyBW,WAAWC,WAAW;IACnE,MAAMC,YAAYZ,uBAAuBU,WAAWE,SAAS;IAE7D,MAAMC,gBAAgBR,6BAA6B;QACjD,GAAGK,UAAU;QACbC;QACAC;IACF;IAEA,qBACE,KAACT,sBAAsBW,QAAQ;QAACC,OAAOF;kBACrC,cAAA,KAACf;YAAuBiB,OAAOJ;sBAC7B,cAAA,KAACV;0BAAqBS,WAAWM,QAAQ;;;;AAIjD,EAAE"}

package/dist/cssm/components/ContentBadge/ContentBadge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ContentBadge/ContentBadge.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { captionClassNames } from '../Typography/Caption/Caption';\nimport { footnoteClassNames } from '../Typography/Footnote/Footnote';\nimport { type TypographyProps, weightClassNames } from '../Typography/Typography';\nimport { ContentBadgeContext } from './ContentBadgeContext';\nimport { ContentBadgeIconSlot } from './ContentBadgeIconSlot';\nimport type { ContentBadgeModeType, ContentBadgeSizeType } from './types';\nimport styles from './ContentBadge.module.css';\n\nconst appearanceClassNames = {\n 'accent': {\n primary: styles.primaryAccent,\n secondary: styles.secondaryAccent,\n outline: styles.outlineAccent,\n },\n 'neutral': {\n primary: styles.primaryNeutral,\n secondary: styles.secondaryNeutral,\n outline: styles.outlineNeutral,\n },\n 'accent-green': {\n primary: styles.primaryAccentGreen,\n secondary: styles.secondaryAccentGreen,\n outline: styles.outlineAccentGreen,\n },\n 'accent-red': {\n primary: styles.primaryAccentRed,\n secondary: styles.secondaryAccentRed,\n outline: styles.outlineAccentRed,\n },\n 'overlay': {\n primary: styles.primaryOverlay,\n secondary: styles.secondaryOverlay,\n outline: styles.outlineOverlay,\n },\n};\n\nconst sizeClassNames = {\n s: styles.sizeS,\n m: styles.sizeM,\n l: styles.sizeL,\n};\n\nexport interface ContentBadgeProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n Pick<TypographyProps, 'weight'> {\n /*\n Вид отображения.\n /\n mode?: ContentBadgeModeType;\n /\n Цвет оформления.\n /\n appearance?: 'accent' \| 'neutral' \| 'accent-green' \| 'accent-red' \| 'overlay';\n /\n Включает приближение значения закругления к форме круга.\n \n > Note: игнорируется при size=\"s\".\n /\n capsule?: boolean;\n /\n Определяет отступы и размер текста.\n \n Соответствие размеров иконок в слоте `<ContentBadge.SlotIcon />`:\n \n - size=\"s\" – ⚠️ не поддерживает иконки;\n * - size=\"m\" – при одиночной иконке `16x16`, в остальных случаях `12x12`;\n * - size=\"l\" – при одиночной иконке `20x20`, в остальных случаях `16x16`.\n /\n size?: ContentBadgeSizeType;\n}\n\n/\n Компонент, который позволяет добавить текстовые или иконочные бейджи. Как правило, используются\n * поверх других элементов или рядом с ними.\n \n Используйте `ContentBadge.SlotIcon` для размещения иконок внутри `ContentBadge`.\n \n @since 6.1.0\n * @see https://vkui.io/components/content-badge\n /\nexport const ContentBadge: React.FC<ContentBadgeProps> & {\n IconSlot: typeof ContentBadgeIconSlot;\n /\n @deprecated Since 7.3.4. Используйте `IconSlot`.\n */\n SlotIcon: typeof ContentBadgeIconSlot;\n} = ({\n appearance = 'accent',\n mode = 'primary',\n capsule,\n size = 'm',\n weight = '2',\n children,\n ...restProps\n}: ContentBadgeProps) => {\n const { density = 'none' } = useAdaptivity();\n const typographyClassNames =\n size === 'l' ? footnoteClassNames(density) : captionClassNames(density);\n\n return (\n <Tappable\n baseClassName={classNames(\n styles.host,\n size !== 's' && capsule && styles.capsule,\n mode === 'outline' && styles.modeOutline,\n appearanceClassNames[appearance][mode],\n sizeClassNames[size],\n typographyClassNames,\n weightClassNames(weight),\n )}\n DefaultComponent=\"span\"\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n {...restProps}\n >\n <ContentBadgeContext.Provider\n value={{ isSingleChild: React.Children.count(children) === 1, size }}\n >\n {children}\n </ContentBadgeContext.Provider>\n </Tappable>\n );\n};\n\nContentBadge.IconSlot = ContentBadgeIconSlot;\nContentBadge.SlotIcon = ContentBadgeIconSlot;\n\nif (process.env.NODE_ENV !== 'production') {\n defineComponentDisplayNames(ContentBadge.IconSlot, 'ContentBadge.IconSlot');\n defineComponentDisplayNames(ContentBadge.SlotIcon, 'ContentBadge.SlotIcon');\n}\n"],"names":["React","classNames","useAdaptivity","defineComponentDisplayNames","Tappable","captionClassNames","footnoteClassNames","weightClassNames","ContentBadgeContext","ContentBadgeIconSlot","styles","appearanceClassNames","primary","primaryAccent","secondary","secondaryAccent","outline","outlineAccent","primaryNeutral","secondaryNeutral","outlineNeutral","primaryAccentGreen","secondaryAccentGreen","outlineAccentGreen","primaryAccentRed","secondaryAccentRed","outlineAccentRed","primaryOverlay","secondaryOverlay","outlineOverlay","sizeClassNames","s","sizeS","m","sizeM","l","sizeL","ContentBadge","appearance","mode","capsule","size","weight","children","restProps","density","typographyClassNames","baseClassName","host","modeOutline","DefaultComponent","hoverMode","activeMode","Provider","value","isSingleChild","Children","count","IconSlot","SlotIcon","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,kBAAkB,QAAQ,qCAAkC;AACrE,SAA+BC,gBAAgB,QAAQ,8BAA2B;AAClF,SAASC,mBAAmB,QAAQ,2BAAwB;AAC5D,SAASC,oBAAoB,QAAQ,4BAAyB;AAE9D,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,uBAAuB;IAC3B,UAAU;QACRC,SAASF,OAAOG,aAAa;QAC7BC,WAAWJ,OAAOK,eAAe;QACjCC,SAASN,OAAOO,aAAa;IAC/B;IACA,WAAW;QACTL,SAASF,OAAOQ,cAAc;QAC9BJ,WAAWJ,OAAOS,gBAAgB;QAClCH,SAASN,OAAOU,cAAc;IAChC;IACA,gBAAgB;QACdR,SAASF,OAAOW,kBAAkB;QAClCP,WAAWJ,OAAOY,oBAAoB;QACtCN,SAASN,OAAOa,kBAAkB;IACpC;IACA,cAAc;QACZX,SAASF,OAAOc,gBAAgB;QAChCV,WAAWJ,OAAOe,kBAAkB;QACpCT,SAASN,OAAOgB,gBAAgB;IAClC;IACA,WAAW;QACTd,SAASF,OAAOiB,cAAc;QAC9Bb,WAAWJ,OAAOkB,gBAAgB;QAClCZ,SAASN,OAAOmB,cAAc;IAChC;AACF;AAEA,MAAMC,iBAAiB;IACrBC,GAAGrB,OAAOsB,KAAK;IACfC,GAAGvB,OAAOwB,KAAK;IACfC,GAAGzB,OAAO0B,KAAK;AACjB;AA+BA;;;;;;;;CAQC,GACD,OAAO,MAAMC,eAMT,CAAC,EACHC,aAAa,QAAQ,EACrBC,OAAO,SAAS,EAChBC,OAAO,EACPC,OAAO,GAAG,EACVC,SAAS,GAAG,EACZC,QAAQ,EACR,GAAGC,WACe;IAClB,MAAM,EAAEC,UAAU,MAAM,EAAE,GAAG3C;IAC7B,MAAM4C,uBACJL,SAAS,MAAMnC,mBAAmBuC,WAAWxC,kBAAkBwC;IAEjE,qBACE,KAACzC;QACC2C,eAAe9C,WACbS,OAAOsC,IAAI,EACXP,SAAS,OAAOD,WAAW9B,OAAO8B,OAAO,EACzCD,SAAS,aAAa7B,OAAOuC,WAAW,EACxCtC,oBAAoB,CAAC2B,WAAW,CAACC,KAAK,EACtCT,cAAc,CAACW,KAAK,EACpBK,sBACAvC,iBAAiBmC;QAEnBQ,kBAAiB;QACjBC,WAAU;QACVC,YAAW;QACV,GAAGR,SAAS;kBAEb,cAAA,KAACpC,oBAAoB6C,QAAQ;YAC3BC,OAAO;gBAAEC,eAAevD,MAAMwD,QAAQ,CAACC,KAAK,CAACd,cAAc;gBAAGF;YAAK;sBAElEE;;;AAIT,EAAE;AAEFN,aAAaqB,QAAQ,GAAGjD;AACxB4B,aAAasB,QAAQ,GAAGlD;AAExB,IAAImD,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC3D,4BAA4BkC,aAAaqB,QAAQ,EAAE;IACnDvD,4BAA4BkC,aAAasB,QAAQ,EAAE;AACrD"}
1	+ {"version":3,"sources":["../../../../src/components/ContentBadge/ContentBadge.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';\nimport type { HTMLAttributesWithRootRef } from '../../types';\nimport { Tappable } from '../Tappable/Tappable';\nimport { captionClassNames } from '../Typography/Caption/Caption';\nimport { footnoteClassNames } from '../Typography/Footnote/Footnote';\nimport { type TypographyProps, weightClassNames } from '../Typography/Typography';\nimport { ContentBadgeContext } from './ContentBadgeContext';\nimport { ContentBadgeIconSlot } from './ContentBadgeIconSlot';\nimport type { ContentBadgeModeType, ContentBadgeSizeType } from './types';\nimport styles from './ContentBadge.module.css';\n\nconst appearanceClassNames = {\n 'accent': {\n primary: styles.primaryAccent,\n secondary: styles.secondaryAccent,\n outline: styles.outlineAccent,\n },\n 'neutral': {\n primary: styles.primaryNeutral,\n secondary: styles.secondaryNeutral,\n outline: styles.outlineNeutral,\n },\n 'accent-green': {\n primary: styles.primaryAccentGreen,\n secondary: styles.secondaryAccentGreen,\n outline: styles.outlineAccentGreen,\n },\n 'accent-red': {\n primary: styles.primaryAccentRed,\n secondary: styles.secondaryAccentRed,\n outline: styles.outlineAccentRed,\n },\n 'overlay': {\n primary: styles.primaryOverlay,\n secondary: styles.secondaryOverlay,\n outline: styles.outlineOverlay,\n },\n};\n\nconst sizeClassNames = {\n s: styles.sizeS,\n m: styles.sizeM,\n l: styles.sizeL,\n};\n\nexport interface ContentBadgeProps\n extends HTMLAttributesWithRootRef<HTMLDivElement>,\n Pick<TypographyProps, 'weight'> {\n /*\n Вид отображения.\n /\n mode?: ContentBadgeModeType \| undefined;\n /\n Цвет оформления.\n /\n appearance?: 'accent' \| 'neutral' \| 'accent-green' \| 'accent-red' \| 'overlay' \| undefined;\n /\n Включает приближение значения закругления к форме круга.\n \n > Note: игнорируется при size=\"s\".\n /\n capsule?: boolean \| undefined;\n /\n Определяет отступы и размер текста.\n \n Соответствие размеров иконок в слоте `<ContentBadge.SlotIcon />`:\n \n - size=\"s\" – ⚠️ не поддерживает иконки;\n * - size=\"m\" – при одиночной иконке `16x16`, в остальных случаях `12x12`;\n * - size=\"l\" – при одиночной иконке `20x20`, в остальных случаях `16x16`.\n /\n size?: ContentBadgeSizeType \| undefined;\n}\n\n/\n Компонент, который позволяет добавить текстовые или иконочные бейджи. Как правило, используются\n * поверх других элементов или рядом с ними.\n \n Используйте `ContentBadge.SlotIcon` для размещения иконок внутри `ContentBadge`.\n \n @since 6.1.0\n * @see https://vkui.io/components/content-badge\n /\nexport const ContentBadge: React.FC<ContentBadgeProps> & {\n IconSlot: typeof ContentBadgeIconSlot;\n /\n @deprecated Since 7.3.4. Используйте `IconSlot`.\n */\n SlotIcon: typeof ContentBadgeIconSlot;\n} = ({\n appearance = 'accent',\n mode = 'primary',\n capsule,\n size = 'm',\n weight = '2',\n children,\n ...restProps\n}: ContentBadgeProps) => {\n const { density = 'none' } = useAdaptivity();\n const typographyClassNames =\n size === 'l' ? footnoteClassNames(density) : captionClassNames(density);\n\n return (\n <Tappable\n baseClassName={classNames(\n styles.host,\n size !== 's' && capsule && styles.capsule,\n mode === 'outline' && styles.modeOutline,\n appearanceClassNames[appearance][mode],\n sizeClassNames[size],\n typographyClassNames,\n weightClassNames(weight),\n )}\n DefaultComponent=\"span\"\n hoverMode=\"opacity\"\n activeMode=\"opacity\"\n {...restProps}\n >\n <ContentBadgeContext.Provider\n value={{ isSingleChild: React.Children.count(children) === 1, size }}\n >\n {children}\n </ContentBadgeContext.Provider>\n </Tappable>\n );\n};\n\nContentBadge.IconSlot = ContentBadgeIconSlot;\nContentBadge.SlotIcon = ContentBadgeIconSlot;\n\nif (process.env.NODE_ENV !== 'production') {\n defineComponentDisplayNames(ContentBadge.IconSlot, 'ContentBadge.IconSlot');\n defineComponentDisplayNames(ContentBadge.SlotIcon, 'ContentBadge.SlotIcon');\n}\n"],"names":["React","classNames","useAdaptivity","defineComponentDisplayNames","Tappable","captionClassNames","footnoteClassNames","weightClassNames","ContentBadgeContext","ContentBadgeIconSlot","styles","appearanceClassNames","primary","primaryAccent","secondary","secondaryAccent","outline","outlineAccent","primaryNeutral","secondaryNeutral","outlineNeutral","primaryAccentGreen","secondaryAccentGreen","outlineAccentGreen","primaryAccentRed","secondaryAccentRed","outlineAccentRed","primaryOverlay","secondaryOverlay","outlineOverlay","sizeClassNames","s","sizeS","m","sizeM","l","sizeL","ContentBadge","appearance","mode","capsule","size","weight","children","restProps","density","typographyClassNames","baseClassName","host","modeOutline","DefaultComponent","hoverMode","activeMode","Provider","value","isSingleChild","Children","count","IconSlot","SlotIcon","process","env","NODE_ENV"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,aAAa,QAAQ,+BAA4B;AAC1D,SAASC,2BAA2B,QAAQ,iDAA8C;AAE1F,SAASC,QAAQ,QAAQ,0BAAuB;AAChD,SAASC,iBAAiB,QAAQ,mCAAgC;AAClE,SAASC,kBAAkB,QAAQ,qCAAkC;AACrE,SAA+BC,gBAAgB,QAAQ,8BAA2B;AAClF,SAASC,mBAAmB,QAAQ,2BAAwB;AAC5D,SAASC,oBAAoB,QAAQ,4BAAyB;AAE9D,OAAOC,YAAY,4BAA4B;AAE/C,MAAMC,uBAAuB;IAC3B,UAAU;QACRC,SAASF,OAAOG,aAAa;QAC7BC,WAAWJ,OAAOK,eAAe;QACjCC,SAASN,OAAOO,aAAa;IAC/B;IACA,WAAW;QACTL,SAASF,OAAOQ,cAAc;QAC9BJ,WAAWJ,OAAOS,gBAAgB;QAClCH,SAASN,OAAOU,cAAc;IAChC;IACA,gBAAgB;QACdR,SAASF,OAAOW,kBAAkB;QAClCP,WAAWJ,OAAOY,oBAAoB;QACtCN,SAASN,OAAOa,kBAAkB;IACpC;IACA,cAAc;QACZX,SAASF,OAAOc,gBAAgB;QAChCV,WAAWJ,OAAOe,kBAAkB;QACpCT,SAASN,OAAOgB,gBAAgB;IAClC;IACA,WAAW;QACTd,SAASF,OAAOiB,cAAc;QAC9Bb,WAAWJ,OAAOkB,gBAAgB;QAClCZ,SAASN,OAAOmB,cAAc;IAChC;AACF;AAEA,MAAMC,iBAAiB;IACrBC,GAAGrB,OAAOsB,KAAK;IACfC,GAAGvB,OAAOwB,KAAK;IACfC,GAAGzB,OAAO0B,KAAK;AACjB;AA+BA;;;;;;;;CAQC,GACD,OAAO,MAAMC,eAMT,CAAC,EACHC,aAAa,QAAQ,EACrBC,OAAO,SAAS,EAChBC,OAAO,EACPC,OAAO,GAAG,EACVC,SAAS,GAAG,EACZC,QAAQ,EACR,GAAGC,WACe;IAClB,MAAM,EAAEC,UAAU,MAAM,EAAE,GAAG3C;IAC7B,MAAM4C,uBACJL,SAAS,MAAMnC,mBAAmBuC,WAAWxC,kBAAkBwC;IAEjE,qBACE,KAACzC;QACC2C,eAAe9C,WACbS,OAAOsC,IAAI,EACXP,SAAS,OAAOD,WAAW9B,OAAO8B,OAAO,EACzCD,SAAS,aAAa7B,OAAOuC,WAAW,EACxCtC,oBAAoB,CAAC2B,WAAW,CAACC,KAAK,EACtCT,cAAc,CAACW,KAAK,EACpBK,sBACAvC,iBAAiBmC;QAEnBQ,kBAAiB;QACjBC,WAAU;QACVC,YAAW;QACV,GAAGR,SAAS;kBAEb,cAAA,KAACpC,oBAAoB6C,QAAQ;YAC3BC,OAAO;gBAAEC,eAAevD,MAAMwD,QAAQ,CAACC,KAAK,CAACd,cAAc;gBAAGF;YAAK;sBAElEE;;;AAIT,EAAE;AAEFN,aAAaqB,QAAQ,GAAGjD;AACxB4B,aAAasB,QAAQ,GAAGlD;AAExB,IAAImD,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;IACzC3D,4BAA4BkC,aAAaqB,QAAQ,EAAE;IACnDvD,4BAA4BkC,aAAasB,QAAQ,EAAE;AACrD"}

package/dist/cssm/components/ContentCard/ContentCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/ContentCard/ContentCard.tsx"],"sourcesContent":["import type * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { getFetchPriorityProp } from '../../lib/utils';\nimport type { HasComponent, HasRef, HasRootRef } from '../../types';\nimport { Card, type CardProps } from '../Card/Card';\nimport { Tappable, type TappableOmitProps } 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 HasComponent,\n Omit<TappableOmitProps, 'getRootRef' \| 'crossOrigin' \| 'title' \| 'src'>,\n Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof React.HTMLAttributes<HTMLImageElement>>,\n HasRef<HTMLImageElement> {\n /*\n Текст над заголовком.\n /\n overTitle?: React.ReactNode;\n /*\n Заголовок.\n /\n title?: React.ReactNode;\n /*\n Позволяет поменять тег используемый для заголовка.\n /\n titleComponent?: React.ElementType;\n /*\n Текст.\n /\n description?: React.ReactNode;\n /*\n Нижний текст.\n /\n caption?: React.ReactNode;\n /*\n Максимальная высота изображения.\n /\n maxHeight?: number;\n /*\n Внешний вид карточки.\n /\n mode?: CardProps['mode'];\n /\n Пользовательское значения стиля `object-fit` для картинки\n * Подробнее можно почитать в [документации](https://developer.mozilla.org/ru/docs/Web/CSS/object-fit).\n /\n imageObjectFit?: React.CSSProperties['objectFit'];\n}\n\n/\n @see https://vkui.io/components/content-card\n */\nexport const ContentCard = ({\n overTitle,\n title,\n titleComponent = 'span',\n description,\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 = '100%',\n height,\n crossOrigin,\n decoding,\n loading,\n referrerPolicy,\n sizes,\n useMap,\n fetchPriority,\n imageObjectFit,\n hasHover = false,\n hasActive = false,\n Component = 'li',\n ...restProps\n}: ContentCardProps): React.ReactNode => {\n return (\n <Card\n mode={mode}\n getRootRef={getRootRef}\n Component={Component}\n style={style}\n className={classNames(restProps.disabled && styles.disabled, className)}\n >\n <Tappable\n hasHover={hasHover}\n hasActive={hasActive}\n {...restProps}\n baseClassName={styles.tappable}\n >\n {(src \|\| srcSet) && (\n <img\n // safari и firefox нужно чтобы атрибут `loading` был до `src`\n //\n // https://mihaly4.ru/image-loading-lazy-bug\n loading={loading}\n ref={getRef}\n className={styles.img}\n src={src}\n srcSet={srcSet}\n alt={alt}\n crossOrigin={crossOrigin}\n decoding={decoding}\n referrerPolicy={referrerPolicy}\n sizes={sizes}\n useMap={useMap}\n {...getFetchPriorityProp(fetchPriority)}\n height={height}\n width={width}\n style={{ maxHeight, objectFit: imageObjectFit }}\n />\n )}\n <div className={styles.body}>\n {hasReactNode(overTitle) && (\n <Caption\n className={classNames(styles.text, styles.overTitle)}\n weight=\"1\"\n level=\"3\"\n caps\n >\n {overTitle}\n </Caption>\n )}\n {hasReactNode(title) && (\n <Headline className={styles.text} weight=\"2\" level=\"1\" Component={titleComponent}>\n {title}\n </Headline>\n )}\n {hasReactNode(description) && <Text className={styles.text}>{description}</Text>}\n {hasReactNode(caption) && (\n <Footnote className={classNames(styles.text, styles.caption)}>{caption}</Footnote>\n )}\n </div>\n </Tappable>\n </Card>\n );\n};\n"],"names":["classNames","hasReactNode","getFetchPriorityProp","Card","Tappable","Caption","Footnote","Headline","Text","styles","ContentCard","overTitle","title","titleComponent","description","caption","className","mode","style","getRootRef","getRef","maxHeight","src","srcSet","alt","width","height","crossOrigin","decoding","loading","referrerPolicy","sizes","useMap","fetchPriority","imageObjectFit","hasHover","hasActive","Component","restProps","disabled","baseClassName","tappable","img","ref","objectFit","div","body","text","weight","level","caps"],"mappings":";AACA,SAASA,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,oBAAoB,QAAQ,qBAAkB;AAEvD,SAASC,IAAI,QAAwB,kBAAe;AACpD,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,IAAI,QAAQ,6BAA0B;AAC/C,OAAOC,YAAY,2BAA2B;AA2C9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,KAAK,EACLC,iBAAiB,MAAM,EACvBC,WAAW,EACXC,OAAO,EACP,aAAa;AACbC,SAAS,EACTC,OAAO,QAAQ,EACfC,KAAK,EACLC,UAAU,EACV,YAAY;AACZC,MAAM,EACNC,SAAS,EACTC,GAAG,EACHC,MAAM,EACNC,MAAM,EAAE,EACRC,QAAQ,MAAM,EACdC,MAAM,EACNC,WAAW,EACXC,QAAQ,EACRC,OAAO,EACPC,cAAc,EACdC,KAAK,EACLC,MAAM,EACNC,aAAa,EACbC,cAAc,EACdC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjBC,YAAY,IAAI,EAChB,GAAGC,WACc;IACjB,qBACE,KAACnC;QACCc,MAAMA;QACNE,YAAYA;QACZkB,WAAWA;QACXnB,OAAOA;QACPF,WAAWhB,WAAWsC,UAAUC,QAAQ,IAAI9B,OAAO8B,QAAQ,EAAEvB;kBAE7D,cAAA,MAACZ;YACC+B,UAAUA;YACVC,WAAWA;YACV,GAAGE,SAAS;YACbE,eAAe/B,OAAOgC,QAAQ;;gBAE5BnB,CAAAA,OAAOC,MAAK,mBACZ,KAACmB;oBACC,8DAA8D;oBAC9D,EAAE;oBACF,4CAA4C;oBAC5Cb,SAASA;oBACTc,KAAKvB;oBACLJ,WAAWP,OAAOiC,GAAG;oBACrBpB,KAAKA;oBACLC,QAAQA;oBACRC,KAAKA;oBACLG,aAAaA;oBACbC,UAAUA;oBACVE,gBAAgBA;oBAChBC,OAAOA;oBACPC,QAAQA;oBACP,GAAG9B,qBAAqB+B,cAAc;oBACvCP,QAAQA;oBACRD,OAAOA;oBACPP,OAAO;wBAAEG;wBAAWuB,WAAWV;oBAAe;;8BAGlD,MAACW;oBAAI7B,WAAWP,OAAOqC,IAAI;;wBACxB7C,aAAaU,4BACZ,KAACN;4BACCW,WAAWhB,WAAWS,OAAOsC,IAAI,EAAEtC,OAAOE,SAAS;4BACnDqC,QAAO;4BACPC,OAAM;4BACNC,IAAI;sCAEHvC;;wBAGJV,aAAaW,wBACZ,KAACL;4BAASS,WAAWP,OAAOsC,IAAI;4BAAEC,QAAO;4BAAIC,OAAM;4BAAIZ,WAAWxB;sCAC/DD;;wBAGJX,aAAaa,8BAAgB,KAACN;4BAAKQ,WAAWP,OAAOsC,IAAI;sCAAGjC;;wBAC5Db,aAAac,0BACZ,KAACT;4BAASU,WAAWhB,WAAWS,OAAOsC,IAAI,EAAEtC,OAAOM,OAAO;sCAAIA;;;;;;;AAM3E,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/ContentCard/ContentCard.tsx"],"sourcesContent":["import type * as React from 'react';\nimport { classNames, hasReactNode } from '@vkontakte/vkjs';\nimport { getFetchPriorityProp } from '../../lib/utils';\nimport type { HasComponent, HasRef, HasRootRef } from '../../types';\nimport { Card, type CardProps } from '../Card/Card';\nimport { Tappable, type TappableOmitProps } 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 HasComponent,\n Omit<TappableOmitProps, 'getRootRef' \| 'crossOrigin' \| 'title' \| 'src'>,\n Omit<React.ImgHTMLAttributes<HTMLImageElement>, keyof React.HTMLAttributes<HTMLImageElement>>,\n HasRef<HTMLImageElement> {\n /*\n Текст над заголовком.\n /\n overTitle?: React.ReactNode \| undefined;\n /*\n Заголовок.\n /\n title?: React.ReactNode \| undefined;\n /*\n Позволяет поменять тег используемый для заголовка.\n /\n titleComponent?: React.ElementType \| undefined;\n /*\n Текст.\n /\n description?: React.ReactNode \| undefined;\n /*\n Нижний текст.\n /\n caption?: React.ReactNode \| undefined;\n /*\n Максимальная высота изображения.\n /\n maxHeight?: number \| undefined;\n /*\n Внешний вид карточки.\n /\n mode?: CardProps['mode'] \| undefined;\n /\n Пользовательское значения стиля `object-fit` для картинки\n * Подробнее можно почитать в [документации](https://developer.mozilla.org/ru/docs/Web/CSS/object-fit).\n /\n imageObjectFit?: React.CSSProperties['objectFit'] \| undefined;\n}\n\n/\n @see https://vkui.io/components/content-card\n */\nexport const ContentCard = ({\n overTitle,\n title,\n titleComponent = 'span',\n description,\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 = '100%',\n height,\n crossOrigin,\n decoding,\n loading,\n referrerPolicy,\n sizes,\n useMap,\n fetchPriority,\n imageObjectFit,\n hasHover = false,\n hasActive = false,\n Component = 'li',\n ...restProps\n}: ContentCardProps): React.ReactNode => {\n return (\n <Card\n mode={mode}\n getRootRef={getRootRef}\n Component={Component}\n style={style}\n className={classNames(restProps.disabled && styles.disabled, className)}\n >\n <Tappable\n hasHover={hasHover}\n hasActive={hasActive}\n {...restProps}\n baseClassName={styles.tappable}\n >\n {(src \|\| srcSet) && (\n <img\n // safari и firefox нужно чтобы атрибут `loading` был до `src`\n //\n // https://mihaly4.ru/image-loading-lazy-bug\n loading={loading}\n ref={getRef}\n className={styles.img}\n src={src}\n srcSet={srcSet}\n alt={alt}\n crossOrigin={crossOrigin}\n decoding={decoding}\n referrerPolicy={referrerPolicy}\n sizes={sizes}\n useMap={useMap}\n {...getFetchPriorityProp(fetchPriority)}\n height={height}\n width={width}\n style={{ maxHeight, objectFit: imageObjectFit }}\n />\n )}\n <div className={styles.body}>\n {hasReactNode(overTitle) && (\n <Caption\n className={classNames(styles.text, styles.overTitle)}\n weight=\"1\"\n level=\"3\"\n caps\n >\n {overTitle}\n </Caption>\n )}\n {hasReactNode(title) && (\n <Headline className={styles.text} weight=\"2\" level=\"1\" Component={titleComponent}>\n {title}\n </Headline>\n )}\n {hasReactNode(description) && <Text className={styles.text}>{description}</Text>}\n {hasReactNode(caption) && (\n <Footnote className={classNames(styles.text, styles.caption)}>{caption}</Footnote>\n )}\n </div>\n </Tappable>\n </Card>\n );\n};\n"],"names":["classNames","hasReactNode","getFetchPriorityProp","Card","Tappable","Caption","Footnote","Headline","Text","styles","ContentCard","overTitle","title","titleComponent","description","caption","className","mode","style","getRootRef","getRef","maxHeight","src","srcSet","alt","width","height","crossOrigin","decoding","loading","referrerPolicy","sizes","useMap","fetchPriority","imageObjectFit","hasHover","hasActive","Component","restProps","disabled","baseClassName","tappable","img","ref","objectFit","div","body","text","weight","level","caps"],"mappings":";AACA,SAASA,UAAU,EAAEC,YAAY,QAAQ,kBAAkB;AAC3D,SAASC,oBAAoB,QAAQ,qBAAkB;AAEvD,SAASC,IAAI,QAAwB,kBAAe;AACpD,SAASC,QAAQ,QAAgC,0BAAuB;AACxE,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,SAASC,IAAI,QAAQ,6BAA0B;AAC/C,OAAOC,YAAY,2BAA2B;AA2C9C;;CAEC,GACD,OAAO,MAAMC,cAAc,CAAC,EAC1BC,SAAS,EACTC,KAAK,EACLC,iBAAiB,MAAM,EACvBC,WAAW,EACXC,OAAO,EACP,aAAa;AACbC,SAAS,EACTC,OAAO,QAAQ,EACfC,KAAK,EACLC,UAAU,EACV,YAAY;AACZC,MAAM,EACNC,SAAS,EACTC,GAAG,EACHC,MAAM,EACNC,MAAM,EAAE,EACRC,QAAQ,MAAM,EACdC,MAAM,EACNC,WAAW,EACXC,QAAQ,EACRC,OAAO,EACPC,cAAc,EACdC,KAAK,EACLC,MAAM,EACNC,aAAa,EACbC,cAAc,EACdC,WAAW,KAAK,EAChBC,YAAY,KAAK,EACjBC,YAAY,IAAI,EAChB,GAAGC,WACc;IACjB,qBACE,KAACnC;QACCc,MAAMA;QACNE,YAAYA;QACZkB,WAAWA;QACXnB,OAAOA;QACPF,WAAWhB,WAAWsC,UAAUC,QAAQ,IAAI9B,OAAO8B,QAAQ,EAAEvB;kBAE7D,cAAA,MAACZ;YACC+B,UAAUA;YACVC,WAAWA;YACV,GAAGE,SAAS;YACbE,eAAe/B,OAAOgC,QAAQ;;gBAE5BnB,CAAAA,OAAOC,MAAK,mBACZ,KAACmB;oBACC,8DAA8D;oBAC9D,EAAE;oBACF,4CAA4C;oBAC5Cb,SAASA;oBACTc,KAAKvB;oBACLJ,WAAWP,OAAOiC,GAAG;oBACrBpB,KAAKA;oBACLC,QAAQA;oBACRC,KAAKA;oBACLG,aAAaA;oBACbC,UAAUA;oBACVE,gBAAgBA;oBAChBC,OAAOA;oBACPC,QAAQA;oBACP,GAAG9B,qBAAqB+B,cAAc;oBACvCP,QAAQA;oBACRD,OAAOA;oBACPP,OAAO;wBAAEG;wBAAWuB,WAAWV;oBAAe;;8BAGlD,MAACW;oBAAI7B,WAAWP,OAAOqC,IAAI;;wBACxB7C,aAAaU,4BACZ,KAACN;4BACCW,WAAWhB,WAAWS,OAAOsC,IAAI,EAAEtC,OAAOE,SAAS;4BACnDqC,QAAO;4BACPC,OAAM;4BACNC,IAAI;sCAEHvC;;wBAGJV,aAAaW,wBACZ,KAACL;4BAASS,WAAWP,OAAOsC,IAAI;4BAAEC,QAAO;4BAAIC,OAAM;4BAAIZ,WAAWxB;sCAC/DD;;wBAGJX,aAAaa,8BAAgB,KAACN;4BAAKQ,WAAWP,OAAOsC,IAAI;sCAAGjC;;wBAC5Db,aAAac,0BACZ,KAACT;4BAASU,WAAWhB,WAAWS,OAAOsC,IAAI,EAAEtC,OAAOM,OAAO;sCAAIA;;;;;;;AAM3E,EAAE"}

package/dist/cssm/components/Counter/Counter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Counter.module.css';\n\nconst modeClassNames = {\n primary: styles.modePrimary,\n contrast: styles.modeContrast,\n tertiary: styles.modeTertiary,\n inherit: styles.modeInherit,\n};\n\nconst appearanceClassNames: Record<string, string> = {\n 'custom': styles.appearanceCustom,\n 'accent': styles.appearanceAccent,\n 'neutral': styles.appearanceNeutral,\n 'accent-green': styles.appearanceAccentGreen,\n 'accent-red': styles.appearanceAccentRed,\n};\n\nconst sizeClassNames = {\n s: styles.sizeS,\n m: styles.sizeM,\n};\n\nexport interface CounterProps extends HTMLAttributesWithRootRef<HTMLSpanElement> {\n /*\n Режим отображения счетчика.\n /\n mode?: 'primary' \| 'contrast' \| 'tertiary' \| 'inherit';\n\n /\n Внешний вид счетчика.\n /\n appearance?: 'accent' \| 'neutral' \| 'accent-green' \| 'accent-red' \| 'custom';\n\n /\n Пользовательский цвет (работает только при appearance=\"custom\")\n * - При mode=\"primary\" - изменяет фон\n * - При mode=\"contrast\" - изменяет цвет текста\n * - При mode=\"tertiary\" - изменяет цвет текста\n * - При mode=\"inherit\" - не работает.\n /\n color?: string;\n /\n Размер счетчика.\n /\n size?: 's' \| 'm';\n}\n\n/\n @see https://vkui.io/components/counter\n */\nexport const Counter = ({\n mode = 'inherit',\n appearance: appearanceProp,\n color,\n size = 'm',\n children,\n className,\n style: styleProp,\n ...restProps\n}: CounterProps): React.ReactNode => {\n const appearance = React.useMemo<CounterProps['appearance']>(() => {\n if (mode === 'inherit') {\n return undefined;\n }\n if (appearanceProp) {\n return appearanceProp;\n }\n return 'accent';\n }, [appearanceProp, mode]);\n\n const style: (React.CSSProperties & CSSCustomProperties<string \| undefined>) \| undefined =\n React.useMemo(() => {\n if (mode === 'inherit' \|\| appearance !== 'custom' \|\| !color) {\n return undefined;\n }\n switch (mode) {\n case 'primary':\n return {\n '--vkui_internal--counter_background': color,\n };\n case 'contrast':\n case 'tertiary':\n return {\n '--vkui_internal--counter_foreground': color,\n };\n }\n }, [appearance, color, mode]);\n\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 style={mergeStyle(style, styleProp)}\n Component=\"span\"\n className={classNames(\n 'vkuiInternalCounter',\n styles.host,\n modeClassNames[mode],\n !!appearance && appearanceClassNames[appearance],\n sizeClassNames[size],\n className,\n )}\n level={counterLevel}\n >\n {children}\n </CounterTypography>\n );\n};\n"],"names":["React","classNames","mergeStyle","Caption","Headline","styles","modeClassNames","primary","modePrimary","contrast","modeContrast","tertiary","modeTertiary","inherit","modeInherit","appearanceClassNames","appearanceCustom","appearanceAccent","appearanceNeutral","appearanceAccentGreen","appearanceAccentRed","sizeClassNames","s","sizeS","m","sizeM","Counter","mode","appearance","appearanceProp","color","size","children","className","style","styleProp","restProps","useMemo","undefined","Children","count","CounterTypography","counterLevel","Component","host","level"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,OAAOC,YAAY,uBAAuB;AAE1C,MAAMC,iBAAiB;IACrBC,SAASF,OAAOG,WAAW;IAC3BC,UAAUJ,OAAOK,YAAY;IAC7BC,UAAUN,OAAOO,YAAY;IAC7BC,SAASR,OAAOS,WAAW;AAC7B;AAEA,MAAMC,uBAA+C;IACnD,UAAUV,OAAOW,gBAAgB;IACjC,UAAUX,OAAOY,gBAAgB;IACjC,WAAWZ,OAAOa,iBAAiB;IACnC,gBAAgBb,OAAOc,qBAAqB;IAC5C,cAAcd,OAAOe,mBAAmB;AAC1C;AAEA,MAAMC,iBAAiB;IACrBC,GAAGjB,OAAOkB,KAAK;IACfC,GAAGnB,OAAOoB,KAAK;AACjB;AA2BA;;CAEC,GACD,OAAO,MAAMC,UAAU,CAAC,EACtBC,OAAO,SAAS,EAChBC,YAAYC,cAAc,EAC1BC,KAAK,EACLC,OAAO,GAAG,EACVC,QAAQ,EACRC,SAAS,EACTC,OAAOC,SAAS,EAChB,GAAGC,WACU;IACb,MAAMR,aAAa5B,MAAMqC,OAAO,CAA6B;QAC3D,IAAIV,SAAS,WAAW;YACtB,OAAOW;QACT;QACA,IAAIT,gBAAgB;YAClB,OAAOA;QACT;QACA,OAAO;IACT,GAAG;QAACA;QAAgBF;KAAK;IAEzB,MAAMO,QACJlC,MAAMqC,OAAO,CAAC;QACZ,IAAIV,SAAS,aAAaC,eAAe,YAAY,CAACE,OAAO;YAC3D,OAAOQ;QACT;QACA,OAAQX;YACN,KAAK;gBACH,OAAO;oBACL,uCAAuCG;gBACzC;YACF,KAAK;YACL,KAAK;gBACH,OAAO;oBACL,uCAAuCA;gBACzC;QACJ;IACF,GAAG;QAACF;QAAYE;QAAOH;KAAK;IAE9B,IAAI3B,MAAMuC,QAAQ,CAACC,KAAK,CAACR,cAAc,GAAG;QACxC,OAAO;IACT;IAEA,MAAMS,oBAAoBV,SAAS,MAAM5B,UAAUC;IACnD,MAAMsC,eAAeX,SAAS,MAAM,MAAM;IAE1C,qBACE,KAACU;QACE,GAAGL,SAAS;QACbF,OAAOhC,WAAWgC,OAAOC;QACzBQ,WAAU;QACVV,WAAWhC,WACT,uBACAI,OAAOuC,IAAI,EACXtC,cAAc,CAACqB,KAAK,EACpB,CAAC,CAACC,cAAcb,oBAAoB,CAACa,WAAW,EAChDP,cAAc,CAACU,KAAK,EACpBE;QAEFY,OAAOH;kBAENV;;AAGP,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/Counter/Counter.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { mergeStyle } from '../../helpers/mergeStyle';\nimport type { CSSCustomProperties, HTMLAttributesWithRootRef } from '../../types';\nimport { Caption } from '../Typography/Caption/Caption';\nimport { Headline } from '../Typography/Headline/Headline';\nimport styles from './Counter.module.css';\n\nconst modeClassNames = {\n primary: styles.modePrimary,\n contrast: styles.modeContrast,\n tertiary: styles.modeTertiary,\n inherit: styles.modeInherit,\n};\n\nconst appearanceClassNames: Record<string, string> = {\n 'custom': styles.appearanceCustom,\n 'accent': styles.appearanceAccent,\n 'neutral': styles.appearanceNeutral,\n 'accent-green': styles.appearanceAccentGreen,\n 'accent-red': styles.appearanceAccentRed,\n};\n\nconst sizeClassNames = {\n s: styles.sizeS,\n m: styles.sizeM,\n};\n\nexport interface CounterProps extends HTMLAttributesWithRootRef<HTMLSpanElement> {\n /*\n Режим отображения счетчика.\n /\n mode?: 'primary' \| 'contrast' \| 'tertiary' \| 'inherit' \| undefined;\n\n /\n Внешний вид счетчика.\n /\n appearance?: 'accent' \| 'neutral' \| 'accent-green' \| 'accent-red' \| 'custom' \| undefined;\n\n /\n Пользовательский цвет (работает только при appearance=\"custom\")\n * - При mode=\"primary\" - изменяет фон\n * - При mode=\"contrast\" - изменяет цвет текста\n * - При mode=\"tertiary\" - изменяет цвет текста\n * - При mode=\"inherit\" - не работает.\n /\n color?: string \| undefined;\n /\n Размер счетчика.\n /\n size?: 's' \| 'm' \| undefined;\n}\n\n/\n @see https://vkui.io/components/counter\n */\nexport const Counter = ({\n mode = 'inherit',\n appearance: appearanceProp,\n color,\n size = 'm',\n children,\n className,\n style: styleProp,\n ...restProps\n}: CounterProps): React.ReactNode => {\n const appearance = React.useMemo<CounterProps['appearance']>(() => {\n if (mode === 'inherit') {\n return undefined;\n }\n if (appearanceProp) {\n return appearanceProp;\n }\n return 'accent';\n }, [appearanceProp, mode]);\n\n const style: (React.CSSProperties & CSSCustomProperties<string \| undefined>) \| undefined =\n React.useMemo(() => {\n if (mode === 'inherit' \|\| appearance !== 'custom' \|\| !color) {\n return undefined;\n }\n switch (mode) {\n case 'primary':\n return {\n '--vkui_internal--counter_background': color,\n };\n case 'contrast':\n case 'tertiary':\n return {\n '--vkui_internal--counter_foreground': color,\n };\n }\n }, [appearance, color, mode]);\n\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 style={mergeStyle(style, styleProp)}\n Component=\"span\"\n className={classNames(\n 'vkuiInternalCounter',\n styles.host,\n modeClassNames[mode],\n !!appearance && appearanceClassNames[appearance],\n sizeClassNames[size],\n className,\n )}\n level={counterLevel}\n >\n {children}\n </CounterTypography>\n );\n};\n"],"names":["React","classNames","mergeStyle","Caption","Headline","styles","modeClassNames","primary","modePrimary","contrast","modeContrast","tertiary","modeTertiary","inherit","modeInherit","appearanceClassNames","appearanceCustom","appearanceAccent","appearanceNeutral","appearanceAccentGreen","appearanceAccentRed","sizeClassNames","s","sizeS","m","sizeM","Counter","mode","appearance","appearanceProp","color","size","children","className","style","styleProp","restProps","useMemo","undefined","Children","count","CounterTypography","counterLevel","Component","host","level"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAQ,8BAA2B;AAEtD,SAASC,OAAO,QAAQ,mCAAgC;AACxD,SAASC,QAAQ,QAAQ,qCAAkC;AAC3D,OAAOC,YAAY,uBAAuB;AAE1C,MAAMC,iBAAiB;IACrBC,SAASF,OAAOG,WAAW;IAC3BC,UAAUJ,OAAOK,YAAY;IAC7BC,UAAUN,OAAOO,YAAY;IAC7BC,SAASR,OAAOS,WAAW;AAC7B;AAEA,MAAMC,uBAA+C;IACnD,UAAUV,OAAOW,gBAAgB;IACjC,UAAUX,OAAOY,gBAAgB;IACjC,WAAWZ,OAAOa,iBAAiB;IACnC,gBAAgBb,OAAOc,qBAAqB;IAC5C,cAAcd,OAAOe,mBAAmB;AAC1C;AAEA,MAAMC,iBAAiB;IACrBC,GAAGjB,OAAOkB,KAAK;IACfC,GAAGnB,OAAOoB,KAAK;AACjB;AA2BA;;CAEC,GACD,OAAO,MAAMC,UAAU,CAAC,EACtBC,OAAO,SAAS,EAChBC,YAAYC,cAAc,EAC1BC,KAAK,EACLC,OAAO,GAAG,EACVC,QAAQ,EACRC,SAAS,EACTC,OAAOC,SAAS,EAChB,GAAGC,WACU;IACb,MAAMR,aAAa5B,MAAMqC,OAAO,CAA6B;QAC3D,IAAIV,SAAS,WAAW;YACtB,OAAOW;QACT;QACA,IAAIT,gBAAgB;YAClB,OAAOA;QACT;QACA,OAAO;IACT,GAAG;QAACA;QAAgBF;KAAK;IAEzB,MAAMO,QACJlC,MAAMqC,OAAO,CAAC;QACZ,IAAIV,SAAS,aAAaC,eAAe,YAAY,CAACE,OAAO;YAC3D,OAAOQ;QACT;QACA,OAAQX;YACN,KAAK;gBACH,OAAO;oBACL,uCAAuCG;gBACzC;YACF,KAAK;YACL,KAAK;gBACH,OAAO;oBACL,uCAAuCA;gBACzC;QACJ;IACF,GAAG;QAACF;QAAYE;QAAOH;KAAK;IAE9B,IAAI3B,MAAMuC,QAAQ,CAACC,KAAK,CAACR,cAAc,GAAG;QACxC,OAAO;IACT;IAEA,MAAMS,oBAAoBV,SAAS,MAAM5B,UAAUC;IACnD,MAAMsC,eAAeX,SAAS,MAAM,MAAM;IAE1C,qBACE,KAACU;QACE,GAAGL,SAAS;QACbF,OAAOhC,WAAWgC,OAAOC;QACzBQ,WAAU;QACVV,WAAWhC,WACT,uBACAI,OAAOuC,IAAI,EACXtC,cAAc,CAACqB,KAAK,EACpB,CAAC,CAACC,cAAcb,oBAAoB,CAACa,WAAW,EAChDP,cAAc,CAACU,KAAK,EACpBE;QAEFY,OAAOH;kBAENV;;AAGP,EAAE"}

package/dist/cssm/components/CustomScrollView/CustomScrollView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/CustomScrollView/CustomScrollView.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRootRef } from '../../types';\nimport styles from './CustomScrollView.module.css';\n\nconst overscrollBehaviorClassNames = {\n auto: undefined,\n contain: styles.overscrollBehaviorContain,\n none: styles.overscrollBehaviorNone,\n};\n\nconst scrollBehaviorClassNames = {\n auto: undefined,\n smooth: styles.scrollBehaviorSmooth,\n};\n\nexport interface CustomScrollViewProps\n extends React.AllHTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n /*\n `className` для компонента.\n /\n className?: HTMLDivElement['className'];\n /\n Обработчик события `scroll`.\n /\n onScroll?: (event: React.UIEvent<HTMLDivElement>) => void;\n /\n Содержимое.\n /\n children: React.ReactNode;\n /\n Поведение overscroll, подробнее можно почитать в [документации](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior).\n /\n overscrollBehavior?: 'auto' \| 'contain' \| 'none';\n /\n Поведение scroll-behavior, подробнее можно почитать в [документации](https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior).\n /\n scrollBehavior?: 'auto' \| 'smooth';\n /\n Включение отображения горизонтального скролла.\n /\n enableHorizontalScroll?: boolean;\n /\n Скрытие скроллбара.\n \n > В версии ниже Firefox 64 будет виден скролл.\n /\n scrollbarHidden?: boolean;\n}\n\n/\n @see https://vkui.io/components/custom-scroll-view\n */\nexport const CustomScrollView = ({\n className,\n children,\n enableHorizontalScroll = false,\n onScroll,\n getRootRef,\n overscrollBehavior = 'auto',\n scrollBehavior = 'auto',\n scrollbarHidden = false,\n ...restProps\n}: CustomScrollViewProps): React.ReactNode => {\n return (\n <div\n className={classNames(\n className,\n styles.host,\n enableHorizontalScroll && styles.horizontalScrollEnabled,\n overscrollBehaviorClassNames[overscrollBehavior],\n scrollBehaviorClassNames[scrollBehavior],\n scrollbarHidden && styles.scrollbarHidden,\n )}\n ref={getRootRef}\n onScroll={onScroll}\n {...restProps}\n >\n {children}\n </div>\n );\n};\n"],"names":["classNames","styles","overscrollBehaviorClassNames","auto","undefined","contain","overscrollBehaviorContain","none","overscrollBehaviorNone","scrollBehaviorClassNames","smooth","scrollBehaviorSmooth","CustomScrollView","className","children","enableHorizontalScroll","onScroll","getRootRef","overscrollBehavior","scrollBehavior","scrollbarHidden","restProps","div","host","horizontalScrollEnabled","ref"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,OAAOC,YAAY,gCAAgC;AAEnD,MAAMC,+BAA+B;IACnCC,MAAMC;IACNC,SAASJ,OAAOK,yBAAyB;IACzCC,MAAMN,OAAOO,sBAAsB;AACrC;AAEA,MAAMC,2BAA2B;IAC/BN,MAAMC;IACNM,QAAQT,OAAOU,oBAAoB;AACrC;AAqCA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,SAAS,EACTC,QAAQ,EACRC,yBAAyB,KAAK,EAC9BC,QAAQ,EACRC,UAAU,EACVC,qBAAqB,MAAM,EAC3BC,iBAAiB,MAAM,EACvBC,kBAAkB,KAAK,EACvB,GAAGC,WACmB;IACtB,qBACE,KAACC;QACCT,WAAWb,WACTa,WACAZ,OAAOsB,IAAI,EACXR,0BAA0Bd,OAAOuB,uBAAuB,EACxDtB,4BAA4B,CAACgB,mBAAmB,EAChDT,wBAAwB,CAACU,eAAe,EACxCC,mBAAmBnB,OAAOmB,eAAe;QAE3CK,KAAKR;QACLD,UAAUA;QACT,GAAGK,SAAS;kBAEZP;;AAGP,EAAE"}
1	+ {"version":3,"sources":["../../../../src/components/CustomScrollView/CustomScrollView.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasRootRef } from '../../types';\nimport styles from './CustomScrollView.module.css';\n\nconst overscrollBehaviorClassNames = {\n auto: undefined,\n contain: styles.overscrollBehaviorContain,\n none: styles.overscrollBehaviorNone,\n};\n\nconst scrollBehaviorClassNames = {\n auto: undefined,\n smooth: styles.scrollBehaviorSmooth,\n};\n\nexport interface CustomScrollViewProps\n extends React.AllHTMLAttributes<HTMLDivElement>,\n HasRootRef<HTMLDivElement> {\n /*\n `className` для компонента.\n /\n className?: HTMLDivElement['className'] \| undefined;\n /\n Обработчик события `scroll`.\n /\n onScroll?: ((event: React.UIEvent<HTMLDivElement>) => void) \| undefined;\n /\n Содержимое.\n /\n children: React.ReactNode;\n /\n Поведение overscroll, подробнее можно почитать в [документации](https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior).\n /\n overscrollBehavior?: 'auto' \| 'contain' \| 'none' \| undefined;\n /\n Поведение scroll-behavior, подробнее можно почитать в [документации](https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-behavior).\n /\n scrollBehavior?: 'auto' \| 'smooth' \| undefined;\n /\n Включение отображения горизонтального скролла.\n /\n enableHorizontalScroll?: boolean \| undefined;\n /\n Скрытие скроллбара.\n \n > В версии ниже Firefox 64 будет виден скролл.\n /\n scrollbarHidden?: boolean \| undefined;\n}\n\n/\n @see https://vkui.io/components/custom-scroll-view\n */\nexport const CustomScrollView = ({\n className,\n children,\n enableHorizontalScroll = false,\n onScroll,\n getRootRef,\n overscrollBehavior = 'auto',\n scrollBehavior = 'auto',\n scrollbarHidden = false,\n ...restProps\n}: CustomScrollViewProps): React.ReactNode => {\n return (\n <div\n className={classNames(\n className,\n styles.host,\n enableHorizontalScroll && styles.horizontalScrollEnabled,\n overscrollBehaviorClassNames[overscrollBehavior],\n scrollBehaviorClassNames[scrollBehavior],\n scrollbarHidden && styles.scrollbarHidden,\n )}\n ref={getRootRef}\n onScroll={onScroll}\n {...restProps}\n >\n {children}\n </div>\n );\n};\n"],"names":["classNames","styles","overscrollBehaviorClassNames","auto","undefined","contain","overscrollBehaviorContain","none","overscrollBehaviorNone","scrollBehaviorClassNames","smooth","scrollBehaviorSmooth","CustomScrollView","className","children","enableHorizontalScroll","onScroll","getRootRef","overscrollBehavior","scrollBehavior","scrollbarHidden","restProps","div","host","horizontalScrollEnabled","ref"],"mappings":"AAAA;;AAGA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,OAAOC,YAAY,gCAAgC;AAEnD,MAAMC,+BAA+B;IACnCC,MAAMC;IACNC,SAASJ,OAAOK,yBAAyB;IACzCC,MAAMN,OAAOO,sBAAsB;AACrC;AAEA,MAAMC,2BAA2B;IAC/BN,MAAMC;IACNM,QAAQT,OAAOU,oBAAoB;AACrC;AAqCA;;CAEC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,SAAS,EACTC,QAAQ,EACRC,yBAAyB,KAAK,EAC9BC,QAAQ,EACRC,UAAU,EACVC,qBAAqB,MAAM,EAC3BC,iBAAiB,MAAM,EACvBC,kBAAkB,KAAK,EACvB,GAAGC,WACmB;IACtB,qBACE,KAACC;QACCT,WAAWb,WACTa,WACAZ,OAAOsB,IAAI,EACXR,0BAA0Bd,OAAOuB,uBAAuB,EACxDtB,4BAA4B,CAACgB,mBAAmB,EAChDT,wBAAwB,CAACU,eAAe,EACxCC,mBAAmBnB,OAAOmB,eAAe;QAE3CK,KAAKR;QACLD,UAAUA;QACT,GAAGK,SAAS;kBAEZP;;AAGP,EAAE"}

package/dist/cssm/components/CustomSelect/CustomSelect.js CHANGED Viewed

@@ -71,7 +71,7 @@ const FetchingStatus = ({ fetching = false, options, fetchingInProgressLabel = '
     status, before, // CustomSelectDropdownProps
     overscrollBehavior, // SelectProps
     children, getSelectInputRef, searchable = false, emptyText = 'Ничего не найдено', 'onInputChange': onInputChangeProp, 'options': options, filterFn = defaultFilterFn, popupDirection = 'bottom', 'renderOption': renderOptionProp = defaultRenderOptionFn, renderDropdown, fetching, onClose, onOpen, ClearButton, allowClearButton = false, clearButtonTestId, dropdownOffsetDistance = 0, dropdownAutoWidth = false, forceDropdownPortal, noMaxHeight = false, labelTextTestId, nativeSelectTestId, 'onInputKeyDown': onInputKeyDownProp, accessible = true, fetchingInProgressLabel, fetchingCompletedLabel, // NativeSelectProps
-    'value': selectValue, defaultValue, onChange, getRef, multiline, placeholder, 'icon': iconProp, selectType = 'default', align, form, // Input props
+    'value': selectValue, defaultValue, onChange, getRef, multiline, placeholder, 'icon': iconProp, selectType, mode, align, form, // Input props
     minLength, maxLength, pattern, autoFocus, disabled, id, 'readOnly': readOnlyProp, // Select props
     required, name, 'onClick': onSelectClick, 'onFocus': onSelectFocus, 'onBlur': onSelectBlur, // other
     'aria-labelledby': ariaLabelledBy, slotProps, ...restProps } = props;
@@ -441,7 +441,7 @@ const FetchingStatus = ({ fetching = false, options, fetchingInProgressLabel = '
                 accessible: accessible,
                 before: before,
                 after: afterItems,
-                selectType: selectType,
+                selectType: selectType || mode || 'default',
                 align: align,
                 status: status,
                 multiline: multiline,