@vkontakte/vkui 8.0.0 → 8.0.2
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.
- package/dist/components/Clickable/useState.js +3 -2
- package/dist/components/Clickable/useState.js.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.d.ts.map +1 -1
- package/dist/components/CustomSelect/CustomSelect.js +2 -2
- package/dist/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopAside.d.ts +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopAside.d.ts.map +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopAside.js +3 -2
- package/dist/components/FormItem/FormItemTop/FormItemTopAside.js.map +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopLabel.d.ts +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopLabel.d.ts.map +1 -1
- package/dist/components/FormItem/FormItemTop/FormItemTopLabel.js +2 -2
- package/dist/components/FormItem/FormItemTop/FormItemTopLabel.js.map +1 -1
- package/dist/components/ImageBase/ImageBase.d.ts +3 -1
- package/dist/components/ImageBase/ImageBase.d.ts.map +1 -1
- package/dist/components/ImageBase/ImageBase.js +9 -5
- package/dist/components/ImageBase/ImageBase.js.map +1 -1
- package/dist/components/Input/Input.d.ts +2 -2
- package/dist/components/Input/Input.d.ts.map +1 -1
- package/dist/components/Input/Input.js +2 -1
- package/dist/components/Input/Input.js.map +1 -1
- package/dist/components/Search/Search.d.ts +2 -2
- package/dist/components/Search/Search.d.ts.map +1 -1
- package/dist/components/Search/Search.js +2 -1
- package/dist/components/Search/Search.js.map +1 -1
- package/dist/components.css +1 -1
- package/dist/components.css.map +1 -1
- package/dist/cssm/components/Clickable/useState.js +3 -2
- package/dist/cssm/components/Clickable/useState.js.map +1 -1
- package/dist/cssm/components/CustomSelect/CustomSelect.js +2 -2
- package/dist/cssm/components/CustomSelect/CustomSelect.js.map +1 -1
- package/dist/cssm/components/FormItem/FormItemTop/FormItemTopAside.js +3 -2
- package/dist/cssm/components/FormItem/FormItemTop/FormItemTopAside.js.map +1 -1
- package/dist/cssm/components/FormItem/FormItemTop/FormItemTopLabel.js +2 -2
- package/dist/cssm/components/FormItem/FormItemTop/FormItemTopLabel.js.map +1 -1
- package/dist/cssm/components/ImageBase/ImageBase.js +9 -5
- package/dist/cssm/components/ImageBase/ImageBase.js.map +1 -1
- package/dist/cssm/components/ImageBase/ImageBase.module.css +11 -3
- package/dist/cssm/components/Input/Input.js +2 -1
- package/dist/cssm/components/Input/Input.js.map +1 -1
- package/dist/cssm/components/Search/Search.js +2 -1
- package/dist/cssm/components/Search/Search.js.map +1 -1
- package/dist/vkui.css +1 -1
- package/dist/vkui.css.map +1 -1
- package/package.json +1 -1
- package/src/components/Clickable/useState.tsx +3 -3
- package/src/components/CustomSelect/CustomSelect.tsx +3 -2
- package/src/components/FormItem/FormItemTop/FormItemTopAside.tsx +3 -2
- package/src/components/FormItem/FormItemTop/FormItemTopLabel.tsx +2 -1
- package/src/components/ImageBase/ImageBase.module.css +11 -3
- package/src/components/ImageBase/ImageBase.module.css.d.ts.map +1 -1
- package/src/components/ImageBase/ImageBase.tsx +8 -2
- package/src/components/Input/Input.tsx +3 -0
- package/src/components/Search/Search.tsx +4 -1
|
@@ -70,12 +70,13 @@ const ACTIVE_DELAY = 70;
|
|
|
70
70
|
pointersUpRef.current = new Set();
|
|
71
71
|
}
|
|
72
72
|
React.useEffect(()=>{
|
|
73
|
-
if (lockState) {
|
|
74
|
-
// Сбрасываем setActivated если обнаруживаем lockState
|
|
73
|
+
if (lockState || !hasActive) {
|
|
74
|
+
// Сбрасываем setActivated если обнаруживаем lockState или !hasActive
|
|
75
75
|
setActivated(false);
|
|
76
76
|
}
|
|
77
77
|
}, [
|
|
78
78
|
lockState,
|
|
79
|
+
hasActive,
|
|
79
80
|
setActivated
|
|
80
81
|
]);
|
|
81
82
|
const onPointerDown = ()=>{
|
|
@@ -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) {\n // Сбрасываем setActivated если обнаруживаем lockState\n setActivated(false);\n }\n }, [lockState, 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":"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"}
|
|
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":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"names":[],"mappings":"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"}
|
|
@@ -70,7 +70,7 @@ const FetchingStatus = ({ fetching = false, options, fetchingInProgressLabel = '
|
|
|
70
70
|
status, before, // CustomSelectDropdownProps
|
|
71
71
|
overscrollBehavior, // SelectProps
|
|
72
72
|
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
|
|
73
|
-
'value': selectValue, defaultValue, onChange, getRef, multiline, placeholder, 'icon': iconProp, selectType
|
|
73
|
+
'value': selectValue, defaultValue, onChange, getRef, multiline, placeholder, 'icon': iconProp, selectType, mode, align, form, // Input props
|
|
74
74
|
minLength, maxLength, pattern, autoFocus, disabled, id, 'readOnly': readOnlyProp, // Select props
|
|
75
75
|
required, name, 'onClick': onSelectClick, 'onFocus': onSelectFocus, 'onBlur': onSelectBlur, // other
|
|
76
76
|
'aria-labelledby': ariaLabelledBy, slotProps, ...restProps } = props;
|
|
@@ -440,7 +440,7 @@ const FetchingStatus = ({ fetching = false, options, fetchingInProgressLabel = '
|
|
|
440
440
|
accessible: accessible,
|
|
441
441
|
before: before,
|
|
442
442
|
after: afterItems,
|
|
443
|
-
selectType: selectType,
|
|
443
|
+
selectType: selectType || mode || 'default',
|
|
444
444
|
align: align,
|
|
445
445
|
status: status,
|
|
446
446
|
multiline: multiline,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getRequiredValueByKey } from '../../helpers/getValueByKey';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn, type FilterFn } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { preventDefault } from '../../lib/utils';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport {\n CustomSelectDropdown,\n type CustomSelectDropdownProps,\n} from '../CustomSelectDropdown/CustomSelectDropdown';\nimport { CustomSelectOption } from '../CustomSelectOption/CustomSelectOption';\nimport type { FormFieldProps } from '../FormField/FormField';\nimport {\n type NativeSelectProps,\n NOT_SELECTED,\n remapFromNativeValueToSelectValue,\n type SelectValue,\n} from '../NativeSelect/NativeSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport type { CustomSelectClearButtonProps } from './CustomSelectClearButton';\nimport {\n CustomSelectInput,\n type CustomSelectInputProps,\n} from './CustomSelectInput/CustomSelectInput';\nimport {\n checkDeprecatedProps,\n checkMixControlledAndUncontrolledState,\n checkOptionsValueType,\n filter,\n findSelectedIndex,\n getOptionByValue,\n} from './helpers';\nimport { useAfterItems } from './hooks/useAfterItems';\nimport { useDropdownOpenedController } from './hooks/useDropdownOpenedController';\nimport { useFocusedOptionController } from './hooks/useFocusedOptionController';\nimport { useInputKeyboardController } from './hooks/useInputKeyboardController';\nimport { useInputValueController } from './hooks/useInputValueController';\nimport { useScrollListController } from './hooks/useScrollListController';\nimport { useSelectedOptionController } from './hooks/useSelectedOptionController';\nimport type {\n CustomSelectOptionInterface,\n CustomSelectRenderOption,\n MousePosition,\n PopupDirection,\n} from './types';\nimport styles from './CustomSelect.module.css';\n\nconst densityClassNames = {\n none: styles.densityNone,\n compact: styles.densityCompact,\n};\n\nfunction defaultRenderOptionFn<T extends CustomSelectOptionInterface>({\n option,\n ...props\n}: CustomSelectRenderOption<T>): React.ReactNode {\n return <CustomSelectOption {...props} />;\n}\n\nfunction isMousePositionChanged(event: React.MouseEvent, prevPosition: MousePosition) {\n return (\n Math.abs(prevPosition.x - event.clientX) >= 1 || Math.abs(prevPosition.y - event.clientY) >= 1\n );\n}\n\nconst FETCH_STATUS_RESET_DELAY = 2000;\n\nconst FetchingStatus = ({\n fetching = false,\n options,\n fetchingInProgressLabel = 'Список опций загружается...',\n fetchingCompletedLabel = `Загружено опций: ${options.length}`,\n}: Pick<\n SelectProps,\n 'fetching' | 'fetchingInProgressLabel' | 'fetchingCompletedLabel' | 'options'\n>) => {\n const [status, setStatus] = React.useState<'fetching' | 'loaded' | 'none'>('none');\n\n const content = getRequiredValueByKey(status, {\n fetching: fetchingInProgressLabel,\n loaded:\n typeof fetchingCompletedLabel === 'function'\n ? fetchingCompletedLabel(options.length)\n : fetchingCompletedLabel,\n none: '',\n });\n\n useIsomorphicLayoutEffect(\n function updateStatus() {\n if (fetching) {\n setStatus('fetching');\n } else {\n if (status === 'fetching') {\n setStatus('loaded');\n setTimeout(() => setStatus('none'), FETCH_STATUS_RESET_DELAY);\n }\n }\n },\n [fetching],\n );\n\n return <VisuallyHidden aria-live=\"polite\">{content}</VisuallyHidden>;\n};\n\nexport type { CustomSelectClearButtonProps };\n\nexport interface SelectProps<\n OptionInterfaceT extends CustomSelectOptionInterface = CustomSelectOptionInterface,\n> extends Omit<NativeSelectProps, 'slotProps'>,\n Omit<FormFieldProps, 'maxHeight'>,\n Pick<CustomSelectDropdownProps, 'overscrollBehavior'>,\n Pick<CustomSelectInputProps, 'minLength' | 'maxLength' | 'pattern' | 'form' | 'readOnly'> {\n /**\n * Свойства, которые можно прокинуть внутрь компонента:\n * - `root`: свойства для прокидывания в корень компонента;\n * - `select`: свойства для прокидывания в нативный `select`;\n * - `input`: свойства для прокидывания в нативный `input`.\n */\n slotProps?: NativeSelectProps['slotProps'] & {\n input?: React.InputHTMLAttributes<HTMLInputElement> &\n HasDataAttribute &\n HasRootRef<HTMLInputElement>;\n };\n /**\n * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ input: { getRootRef: ... } }`.\n *\n * Ref на внутрений компонент input.\n */\n getSelectInputRef?: React.Ref<HTMLInputElement>;\n /**\n * Если `true`, то при нажатии на `CustomSelect` в нём появится текстовое поле для поиска по `options`. По умолчанию поиск\n * производится по `option.label`.\n */\n searchable?: boolean;\n /**\n * Текст, который будет отображен, если приходит пустой `options`.\n */\n emptyText?: string;\n /**\n * Событие изменения текстового поля.\n */\n onInputChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Список опций в списке.\n */\n options: OptionInterfaceT[];\n /**\n * Функция для кастомной фильтрации. По умолчанию поиск производится по `option.label`.\n */\n filterFn?: false | FilterFn<OptionInterfaceT>;\n /**\n * Направление раскрытия выпадающего списка.\n */\n popupDirection?: PopupDirection;\n /**\n * Рендер-проп для кастомного рендера опции.\n * В объекте аргумента приходят [свойства опции](https://vkui.io/components/custom-select#custom-select-option-api).\n *\n * > ⚠️ Важно: свойство опции `disabled` должно выставляться только через проп `options`.\n * > Запрещается выставлять `disabled` проп опциям в обход `options`, иначе `CustomSelect` не будет знать об актуальном состоянии\n * опции.\n */\n renderOption?: (props: CustomSelectRenderOption<OptionInterfaceT>) => React.ReactNode;\n /**\n * Рендер-проп для кастомного рендера содержимого дропдауна.\n * В `defaultDropdownContent` содержится список опций в виде скроллящегося блока.\n */\n renderDropdown?: ({\n defaultDropdownContent,\n }: {\n defaultDropdownContent: React.ReactNode;\n }) => React.ReactNode;\n /**\n * Если `true`, то в дропдауне вместо списка опций рисуется спиннер. При переданных `renderDropdown` и `fetching: true`\n * \"победит\" `renderDropdown`.\n */\n fetching?: boolean;\n /**\n * Обработчик закрытия выпадающего списка.\n */\n onClose?: VoidFunction;\n /**\n * Обработчик открытия выпадающего списка.\n */\n onOpen?: VoidFunction;\n /**\n * Кастомная кнопка для очистки значения.\n * Должна принимать обязательное свойство `onClick`.\n */\n ClearButton?: React.ComponentType<CustomSelectClearButtonProps>;\n /**\n * Если `true`, то справа будет отображаться кнопка для очистки значения.\n */\n allowClearButton?: boolean;\n /**\n * Передает атрибут `data-testid` для кнопки очистки.\n */\n clearButtonTestId?: string;\n /**\n * Отступ от выпадающего списка.\n */\n dropdownOffsetDistance?: number;\n /**\n * Ширина раскрывающегося списка зависит от контента.\n */\n dropdownAutoWidth?: boolean;\n /**\n * Использовать Portal для рендеринга выпадающего списка.\n */\n forceDropdownPortal?: boolean;\n /**\n * Отключает максимальную высоту по умолчанию.\n */\n noMaxHeight?: boolean;\n /**\n * Передает атрибут `data-testid` для элемента, внутри которого отображается текст выбранной опции `CustomSelect` или плейсхолдер.\n */\n labelTextTestId?: string;\n /**\n * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ select: { 'data-testid': ... } }`.\n *\n * Передает атрибут `data-testid` для нативного элемента `select`.\n */\n nativeSelectTestId?: string;\n /**\n * Обработчик события `keyDown` в поле ввода.\n */\n onInputKeyDown?: (e: React.KeyboardEvent, isOpen: boolean) => void;\n /**\n * @deprecated Since 8.0.0. Будет удалено в 9.0.0.\n *\n * Включает режим в котором выбранное значение `CustomSelect` читается скринридерами корректно.\n * В данном режиме введенное в поле ввода значение не сбрасывается при потере фокуса.\n */\n accessible?: boolean /* TODO [>=v9] удалить свойство */;\n /**\n * Текстовая метка для индикации процесса загрузки данных для пользователей скринридерами. По умолчанию: `\"Список опций загружается...\"`.\n */\n fetchingInProgressLabel?: string;\n /**\n * Текстовая метка для индикации завершения процесса загрузки данных для пользователей скринридерами. По умолчанию: `\"Загружено опций: ${options.length}\"`.\n */\n fetchingCompletedLabel?: string | ((optionsCount: number) => string);\n}\n\n/**\n * @see https://vkui.io/components/custom-select\n */\nexport function CustomSelect<OptionInterfaceT extends CustomSelectOptionInterface>(\n props: SelectProps<OptionInterfaceT>,\n): React.ReactNode {\n const {\n // FormFieldProps\n status,\n before,\n\n // CustomSelectDropdownProps\n overscrollBehavior,\n\n // SelectProps\n children,\n getSelectInputRef,\n searchable = false,\n emptyText = 'Ничего не найдено',\n 'onInputChange': onInputChangeProp,\n 'options': options,\n filterFn = defaultFilterFn,\n popupDirection = 'bottom',\n 'renderOption': renderOptionProp = defaultRenderOptionFn,\n renderDropdown,\n fetching,\n onClose,\n onOpen,\n ClearButton,\n allowClearButton = false,\n clearButtonTestId,\n dropdownOffsetDistance = 0,\n dropdownAutoWidth = false,\n forceDropdownPortal,\n noMaxHeight = false,\n labelTextTestId,\n nativeSelectTestId,\n 'onInputKeyDown': onInputKeyDownProp,\n accessible = true,\n fetchingInProgressLabel,\n fetchingCompletedLabel,\n\n // NativeSelectProps\n 'value': selectValue,\n defaultValue,\n onChange,\n getRef,\n multiline,\n placeholder,\n 'icon': iconProp,\n selectType = 'default',\n align,\n form,\n\n // Input props\n minLength,\n maxLength,\n pattern,\n autoFocus,\n disabled,\n id,\n 'readOnly': readOnlyProp,\n\n // Select props\n required,\n name,\n 'onClick': onSelectClick,\n 'onFocus': onSelectFocus,\n 'onBlur': onSelectBlur,\n\n // other\n 'aria-labelledby': ariaLabelledBy,\n\n slotProps,\n ...restProps\n } = props;\n\n if (process.env.NODE_ENV === 'development') {\n checkOptionsValueType(options);\n checkDeprecatedProps(props);\n }\n\n const { density = 'none' } = useAdaptivity();\n\n const {\n onClick: onRootClick,\n onMouseMove: onRootMouseMove,\n onMouseDown: onRootMouseDown,\n getRootRef: rootRef,\n ...rootRest\n } = useMergeProps<\n Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n HasDataAttribute &\n HasRootRef<HTMLDivElement>\n >(restProps, slotProps?.root);\n\n const { getRootRef: getSelectRef, ...selectRest } = useMergeProps(\n {\n getRootRef: getRef,\n required,\n name,\n form,\n onClick: onSelectClick,\n onFocus: onSelectFocus,\n onBlur: onSelectBlur,\n },\n slotProps?.select,\n );\n\n const {\n getRootRef: getInputRef,\n onChange: onChangeInput,\n onFocus: onInputFocus,\n onBlur: onInputBlur,\n onKeyDown: onNativeInputKeyDown,\n onClick: onNativeInputClick,\n readOnly,\n ...inputRest\n } = useMergeProps(\n {\n getRootRef: getSelectInputRef,\n onChange: onInputChangeProp,\n minLength,\n maxLength,\n pattern,\n autoFocus,\n disabled,\n id,\n readOnly: readOnlyProp,\n placeholder,\n },\n slotProps?.input,\n );\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const handleRootRef = useExternRef(containerRef, rootRef);\n const selectElRef = useExternRef(getSelectRef);\n const selectInputRef = useExternRef(getInputRef);\n\n const propsValue = React.useMemo<SelectValue | undefined>(() => {\n if (selectValue === undefined) {\n return undefined;\n }\n return getOptionByValue(options, selectValue)?.value ?? null;\n }, [options, selectValue]);\n\n const [isControlledOutside, setIsControlledOutside] = React.useState(selectValue !== undefined);\n const [popperPlacement, setPopperPlacement] = React.useState<Placement>(popupDirection);\n\n const {\n nativeSelectValue,\n setNativeSelectValue,\n selectedOptionValue,\n setSelectedOptionValue,\n onNativeSelectChange,\n } = useSelectedOptionController({\n value: propsValue,\n defaultValue,\n isControlledOutside,\n allowClearButton,\n onChange,\n });\n\n const selected = React.useMemo(\n () => options.find((option) => option.value === selectedOptionValue),\n [options, selectedOptionValue],\n );\n\n const { inputValue, onInputChange, resetInputValue, resetInputValueBySelectedOption } =\n useInputValueController({\n options,\n accessible,\n selectedValue: selectedOptionValue,\n onInputChange: onChangeInput,\n });\n\n const filteredOptions = React.useMemo(\n () => filter(options, searchable ? inputValue : '', filterFn),\n [filterFn, inputValue, options, searchable],\n );\n\n const { scrollToElement, optionsWrapperRef, scrollBoxRef } = useScrollListController();\n\n const {\n focusedOptionValue,\n setFocusedOptionValue,\n resetFocusedOption,\n focusOptionByIndex,\n focusOption,\n selectFocusedValue,\n } = useFocusedOptionController({\n selectedOptionValue,\n filteredOptions,\n scrollToElement,\n });\n\n const scrollToSelectedOption = () => {\n scrollToElement(findSelectedIndex(filteredOptions, selectedOptionValue), true);\n };\n\n const [opened, open, close, toggleOpened] = useDropdownOpenedController({\n onOpen: callMultiple(selectFocusedValue, onOpen),\n onOpened: scrollToSelectedOption,\n onClose,\n onClosed: accessible ? resetInputValueBySelectedOption : resetInputValue,\n });\n\n React.useEffect(\n function updateOptionsValue() {\n const value =\n propsValue !== undefined\n ? propsValue\n : remapFromNativeValueToSelectValue(nativeSelectValue);\n setSelectedOptionValue(value);\n setFocusedOptionValue(value);\n },\n [propsValue, nativeSelectValue, setFocusedOptionValue, setSelectedOptionValue],\n );\n\n React.useEffect(\n function syncIsControlledState() {\n setIsControlledOutside((oldIsControlled) => {\n const newIsControlled = propsValue !== undefined;\n checkMixControlledAndUncontrolledState(oldIsControlled, newIsControlled);\n return newIsControlled;\n });\n },\n [propsValue],\n );\n\n useIsomorphicLayoutEffect(() => {\n if (\n filteredOptions.some(({ value }) => nativeSelectValue === value) ||\n (allowClearButton && nativeSelectValue === NOT_SELECTED.NATIVE)\n ) {\n const event = new Event('change', { bubbles: true });\n\n selectElRef.current?.dispatchEvent(event);\n }\n }, [nativeSelectValue]);\n\n const openedClassNames = React.useMemo(\n () =>\n (opened &&\n dropdownOffsetDistance === 0 &&\n (popperPlacement.includes('top') ? styles.popUp : styles.popDown)) ||\n undefined,\n [dropdownOffsetDistance, opened, popperPlacement],\n );\n\n const selectOption = React.useCallback(\n (value: Exclude<SelectValue, null>) => {\n setNativeSelectValue(value ?? NOT_SELECTED.NATIVE);\n close();\n\n const shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync =\n isControlledOutside && propsValue !== nativeSelectValue && nativeSelectValue === value;\n\n if (shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync) {\n const event = new Event('change', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }\n },\n [close, setNativeSelectValue, isControlledOutside, propsValue, nativeSelectValue, selectElRef],\n );\n\n const selectFocused = React.useCallback(() => {\n if (focusedOptionValue === null) {\n return;\n }\n\n selectOption(focusedOptionValue);\n }, [focusedOptionValue, selectOption]);\n\n const handleInputKeyDown = useInputKeyboardController({\n opened,\n open,\n close,\n resetFocusedOption,\n selectFocused,\n focusOption,\n scrollBoxRef,\n onInputKeyDown: onInputKeyDownProp,\n });\n\n const onBlur = React.useCallback(() => {\n close();\n const event = new Event('focusout', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }, [close, selectElRef]);\n\n const onFocus = React.useCallback(() => {\n const event = new Event('focusin', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }, [selectElRef]);\n\n const handleOptionClick = React.useCallback(\n (e: React.MouseEvent<HTMLElement>) => {\n const index = Array.prototype.indexOf.call(\n e.currentTarget.parentNode?.children,\n e.currentTarget,\n );\n const option = filteredOptions[index];\n\n if (option && !option.disabled) {\n selectOption(option.value);\n }\n },\n [filteredOptions, selectOption],\n );\n\n const lastMousePositionRef = React.useRef<MousePosition>({ x: 0, y: 0 });\n const focusOptionOnMouseMove = React.useCallback(\n (e: React.MouseEvent<HTMLElement>, index: number) => {\n if (isMousePositionChanged(e, lastMousePositionRef.current)) {\n focusOptionByIndex(index, false);\n }\n },\n [focusOptionByIndex],\n );\n\n const popupAriaId = React.useId();\n const renderOption = React.useCallback(\n (option: OptionInterfaceT, index: number) => {\n const hovered = option.value === focusedOptionValue;\n const selected = option.value === selectedOptionValue;\n\n return (\n <React.Fragment key={`${typeof option.value}-${option.value}`}>\n {renderOptionProp({\n /**\n * Компилятор сходит с ума из-за рефа внутри focusOptionOnMouseMove.\n * Обходной путь прокидывать ref в свойства для рендер пропов.\n */\n ...(false\n ? {\n __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: lastMousePositionRef,\n }\n : {}),\n option,\n hovered,\n children: option.label,\n selected,\n disabled: option.disabled,\n onClick: handleOptionClick,\n onMouseDown: preventDefault,\n // Используем `onMouseMove` вместо `onMouseEnter/onMouseOver`.\n // Потому что если при навигации с клавиатуры курсор наведён на\n // список, то при первом автоматическом скролле списка вызывается событие MouseOver/MouseEnter\n // обработчик которого фокусирует опцию под курсором, хотя при навигация с клавиатуры пользователь мог уйти дальше по списку, это путает.\n // Причём координаты события меняются на пару пикселей по сравнению с прошлым вызовом,\n // а значит нельзя на них опираться, чтобы запретить обработку такого события.\n // C mousemove такой проблемы нет, что позволяет реализовать поведение при наведении с клавиатуры и при наведении мышью идентично `<select>`.\n onMouseMove: (e) => focusOptionOnMouseMove(e, index),\n id: `${popupAriaId}-${option.value}`,\n ...option,\n })}\n </React.Fragment>\n );\n },\n [\n focusedOptionValue,\n selectedOptionValue,\n renderOptionProp,\n handleOptionClick,\n popupAriaId,\n focusOptionOnMouseMove,\n ],\n );\n\n const resolvedContent = React.useMemo(() => {\n const defaultDropdownContent =\n filteredOptions.length > 0 ? (\n <div ref={optionsWrapperRef}>{filteredOptions.map(renderOption)}</div>\n ) : (\n <Footnote className={styles.empty}>{emptyText}</Footnote>\n );\n\n if (typeof renderDropdown === 'function') {\n return renderDropdown({ defaultDropdownContent });\n } else {\n return defaultDropdownContent;\n }\n }, [emptyText, filteredOptions, optionsWrapperRef, renderDropdown, renderOption]);\n\n const afterItems = useAfterItems({\n value: propsValue,\n nativeSelectValue,\n isControlledOutside,\n opened,\n allowClearButton,\n ClearButton,\n onClearButtonClick: () => {\n setNativeSelectValue(NOT_SELECTED.NATIVE);\n resetInputValue();\n selectInputRef.current && selectInputRef.current.focus();\n },\n clearButtonTestId,\n disabled: inputRest.disabled,\n readOnly,\n icon: iconProp,\n });\n\n const { document } = useDOM();\n const passClickAndFocusToInputOnClick = React.useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n // Раньше внешней оберткой CustomSelect был <label>, что позволяло по клику в любую область CustomSelect,\n // даже где нету интерактивного элемента, фокусировать <input> и передавать на него событие клика.\n // Так как мы больше не оборачиваем CustomSelect в <label>, то для обертки CustomSelect мы симулируем работу <label>.\n // передаем фокус и клик по <input>, если пользователь кликнул в зоне обертки.\n // В <label> мы не больше не оборачиваем, потому что это заставляет скринридер\n // дважды произносить текст выбранной опции при фокусе, если CustomSelect связан с внешним <label>.\n // Воспроизводится в некоторых версиях Chrome, при навигации по странице с помощью стрелок.\n // Договорились со специалистом по доступности убрать <label>-обёртки из Select и CustomSelect\n\n if (!selectInputRef.current || !document) {\n return;\n }\n\n const clickTargetIsNotAnInput = e.target !== selectInputRef.current;\n if (clickTargetIsNotAnInput) {\n selectInputRef.current.click();\n\n const inputIsNotFocused = document.activeElement !== selectInputRef.current;\n if (inputIsNotFocused) {\n selectInputRef.current.focus();\n }\n }\n },\n [document, selectInputRef],\n );\n\n const preventInputBlurWhenClickInsideFocusedSelectArea = (\n e: React.MouseEvent<HTMLDivElement>,\n ) => {\n // Так как инпут больше не оборачивается пустым лэйблом, то клик внутри обертки,\n // но вне инпута (например по иконке дропдауна), будет убирать фокус с инпута.\n // Чтобы в такой ситуации отключить blur инпута мы превентим mousedown событие обёртки\n const isInputFocused = document && document.activeElement === selectInputRef.current;\n if (isInputFocused) {\n e.preventDefault();\n }\n };\n\n const ariaActiveDescendantId = focusedOptionValue !== null ? focusedOptionValue : undefined;\n\n const selectInputAriaProps: React.HTMLAttributes<HTMLElement> = {\n 'role': 'combobox',\n 'aria-controls': popupAriaId,\n 'aria-expanded': opened,\n 'aria-activedescendant':\n ariaActiveDescendantId && opened ? `${popupAriaId}-${ariaActiveDescendantId}` : undefined,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-haspopup': 'listbox',\n 'aria-autocomplete': 'none',\n };\n\n const resetOptionFocusOnMouseLeave = React.useCallback(\n (event: React.MouseEvent) => {\n // В Хроме eсли мышка пользователя находится над инпутом селекта,\n // и он с клавиатуры открывает опции, причём одна из опций\n // уже выбрана, то видно, как выбранная опция получает фокус,\n // но потом сразу же его теряет.\n // Связано это с тем, что в этот момент вызывается onMouseLeave, на который у нас\n // завязан сброс состония фокуса у опции. По хорошему фокус должен оставаться.\n // Нам не интересен вызов onMouseLeave если мышка при этом не двигалась.\n if (isMousePositionChanged(event, lastMousePositionRef.current)) {\n resetFocusedOption();\n }\n },\n [resetFocusedOption],\n );\n\n const updateLastMousePosition = (e: React.MouseEvent) => {\n lastMousePositionRef.current = { x: e.clientX, y: e.clientY };\n };\n\n const onClick = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootClick?.(event);\n passClickAndFocusToInputOnClick(event);\n };\n\n const onMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootMouseDown?.(event);\n preventInputBlurWhenClickInsideFocusedSelectArea(event);\n };\n\n const onMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootMouseMove?.(event);\n updateLastMousePosition(event);\n };\n\n const onCustomSelectInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n onFocus();\n onInputFocus?.(event);\n };\n\n const onCustomSelectInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n onBlur();\n onInputBlur?.(event);\n };\n\n return (\n <RootComponent\n baseClassName={classNames(styles.host, density !== 'regular' && densityClassNames[density])}\n getRootRef={handleRootRef}\n onClick={onClick}\n onMouseDown={onMouseDown}\n onMouseMove={onMouseMove}\n {...rootRest}\n >\n <CustomSelectInput\n fetching={fetching}\n searchable={searchable}\n accessible={accessible}\n before={before}\n after={afterItems}\n selectType={selectType}\n align={align}\n status={status}\n multiline={multiline}\n labelTextTestId={labelTextTestId}\n slotProps={{\n root: { className: openedClassNames },\n input: {\n autoComplete: 'off',\n autoCapitalize: 'none',\n autoCorrect: 'off',\n spellCheck: 'false',\n getRootRef: selectInputRef,\n onChange: onInputChange,\n value: inputValue,\n readOnly: readOnly || !searchable,\n placeholder,\n onFocus: onCustomSelectInputFocus,\n onBlur: onCustomSelectInputBlur,\n onKeyDown: !readOnly\n ? callMultiple(handleInputKeyDown, onNativeInputKeyDown)\n : onNativeInputKeyDown,\n onClick: !readOnly\n ? callMultiple(toggleOpened, onNativeInputClick)\n : onNativeInputClick,\n ...selectInputAriaProps,\n ...inputRest,\n },\n }}\n >\n {selected?.label}\n </CustomSelectInput>\n\n <FetchingStatus\n fetching={fetching}\n options={filteredOptions}\n fetchingInProgressLabel={fetchingInProgressLabel}\n fetchingCompletedLabel={fetchingCompletedLabel}\n />\n <RootComponent\n Component=\"select\"\n baseClassName={styles.control}\n tabIndex={-1}\n value={nativeSelectValue}\n aria-hidden\n data-testid={nativeSelectTestId}\n onChange={onNativeSelectChange}\n getRootRef={selectElRef}\n {...selectRest}\n >\n {(allowClearButton || nativeSelectValue === NOT_SELECTED.NATIVE) && (\n <option key={NOT_SELECTED.NATIVE} value={NOT_SELECTED.NATIVE} />\n )}\n {options.map((item) => (\n <option key={`${item.value}`} value={item.value} />\n ))}\n </RootComponent>\n {opened && (\n <CustomSelectDropdown\n targetRef={containerRef}\n placement={popperPlacement}\n scrollBoxRef={scrollBoxRef}\n onPlacementChange={setPopperPlacement}\n onMouseLeave={resetOptionFocusOnMouseLeave}\n fetching={fetching}\n overscrollBehavior={overscrollBehavior}\n offsetDistance={dropdownOffsetDistance}\n autoWidth={dropdownAutoWidth}\n forcePortal={forceDropdownPortal}\n noMaxHeight={noMaxHeight}\n role=\"listbox\"\n id={popupAriaId}\n aria-labelledby={ariaLabelledBy}\n tabIndex={-1}\n >\n {resolvedContent}\n </CustomSelectDropdown>\n )}\n </RootComponent>\n );\n}\n"],"names":["React","classNames","getRequiredValueByKey","useAdaptivity","useExternRef","useMergeProps","callMultiple","useDOM","defaultFilterFn","useIsomorphicLayoutEffect","preventDefault","CustomSelectDropdown","CustomSelectOption","NOT_SELECTED","remapFromNativeValueToSelectValue","RootComponent","Footnote","VisuallyHidden","CustomSelectInput","checkDeprecatedProps","checkMixControlledAndUncontrolledState","checkOptionsValueType","filter","findSelectedIndex","getOptionByValue","useAfterItems","useDropdownOpenedController","useFocusedOptionController","useInputKeyboardController","useInputValueController","useScrollListController","useSelectedOptionController","densityClassNames","none","compact","defaultRenderOptionFn","option","props","isMousePositionChanged","event","prevPosition","Math","abs","x","clientX","y","clientY","FETCH_STATUS_RESET_DELAY","FetchingStatus","fetching","options","fetchingInProgressLabel","fetchingCompletedLabel","length","status","setStatus","useState","content","loaded","updateStatus","setTimeout","aria-live","CustomSelect","before","overscrollBehavior","children","getSelectInputRef","searchable","emptyText","onInputChangeProp","filterFn","popupDirection","renderOptionProp","renderDropdown","onClose","onOpen","ClearButton","allowClearButton","clearButtonTestId","dropdownOffsetDistance","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","labelTextTestId","nativeSelectTestId","onInputKeyDownProp","accessible","selectValue","defaultValue","onChange","getRef","multiline","placeholder","iconProp","selectType","align","form","minLength","maxLength","pattern","autoFocus","disabled","id","readOnlyProp","required","name","onSelectClick","onSelectFocus","onSelectBlur","ariaLabelledBy","slotProps","restProps","process","env","NODE_ENV","density","onClick","onRootClick","onMouseMove","onRootMouseMove","onMouseDown","onRootMouseDown","getRootRef","rootRef","rootRest","root","getSelectRef","selectRest","onFocus","onBlur","select","getInputRef","onChangeInput","onInputFocus","onInputBlur","onKeyDown","onNativeInputKeyDown","onNativeInputClick","readOnly","inputRest","input","containerRef","useRef","handleRootRef","selectElRef","selectInputRef","propsValue","useMemo","undefined","value","isControlledOutside","setIsControlledOutside","popperPlacement","setPopperPlacement","nativeSelectValue","setNativeSelectValue","selectedOptionValue","setSelectedOptionValue","onNativeSelectChange","selected","find","inputValue","onInputChange","resetInputValue","resetInputValueBySelectedOption","selectedValue","filteredOptions","scrollToElement","optionsWrapperRef","scrollBoxRef","focusedOptionValue","setFocusedOptionValue","resetFocusedOption","focusOptionByIndex","focusOption","selectFocusedValue","scrollToSelectedOption","opened","open","close","toggleOpened","onOpened","onClosed","useEffect","updateOptionsValue","syncIsControlledState","oldIsControlled","newIsControlled","some","NATIVE","Event","bubbles","current","dispatchEvent","openedClassNames","includes","selectOption","useCallback","shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync","selectFocused","handleInputKeyDown","onInputKeyDown","handleOptionClick","e","index","Array","prototype","indexOf","call","currentTarget","parentNode","lastMousePositionRef","focusOptionOnMouseMove","popupAriaId","useId","renderOption","hovered","Fragment","__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED","label","resolvedContent","defaultDropdownContent","div","ref","map","className","afterItems","onClearButtonClick","focus","icon","document","passClickAndFocusToInputOnClick","clickTargetIsNotAnInput","target","click","inputIsNotFocused","activeElement","preventInputBlurWhenClickInsideFocusedSelectArea","isInputFocused","ariaActiveDescendantId","selectInputAriaProps","resetOptionFocusOnMouseLeave","updateLastMousePosition","onCustomSelectInputFocus","onCustomSelectInputBlur","baseClassName","after","autoComplete","autoCapitalize","autoCorrect","spellCheck","Component","tabIndex","aria-hidden","data-testid","item","targetRef","placement","onPlacementChange","onMouseLeave","offsetDistance","autoWidth","forcePortal","role","aria-labelledby"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/CustomSelect/CustomSelect.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { getRequiredValueByKey } from '../../helpers/getValueByKey';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useExternRef } from '../../hooks/useExternRef';\nimport { useMergeProps } from '../../hooks/useMergeProps';\nimport { callMultiple } from '../../lib/callMultiple';\nimport { useDOM } from '../../lib/dom';\nimport type { Placement } from '../../lib/floating';\nimport { defaultFilterFn, type FilterFn } from '../../lib/select';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { preventDefault } from '../../lib/utils';\nimport type { HasDataAttribute, HasRootRef } from '../../types';\nimport {\n CustomSelectDropdown,\n type CustomSelectDropdownProps,\n} from '../CustomSelectDropdown/CustomSelectDropdown';\nimport { CustomSelectOption } from '../CustomSelectOption/CustomSelectOption';\nimport type { FormFieldProps } from '../FormField/FormField';\nimport {\n type NativeSelectProps,\n NOT_SELECTED,\n remapFromNativeValueToSelectValue,\n type SelectValue,\n} from '../NativeSelect/NativeSelect';\nimport { RootComponent } from '../RootComponent/RootComponent';\nimport { Footnote } from '../Typography/Footnote/Footnote';\nimport { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden';\nimport type { CustomSelectClearButtonProps } from './CustomSelectClearButton';\nimport {\n CustomSelectInput,\n type CustomSelectInputProps,\n} from './CustomSelectInput/CustomSelectInput';\nimport {\n checkDeprecatedProps,\n checkMixControlledAndUncontrolledState,\n checkOptionsValueType,\n filter,\n findSelectedIndex,\n getOptionByValue,\n} from './helpers';\nimport { useAfterItems } from './hooks/useAfterItems';\nimport { useDropdownOpenedController } from './hooks/useDropdownOpenedController';\nimport { useFocusedOptionController } from './hooks/useFocusedOptionController';\nimport { useInputKeyboardController } from './hooks/useInputKeyboardController';\nimport { useInputValueController } from './hooks/useInputValueController';\nimport { useScrollListController } from './hooks/useScrollListController';\nimport { useSelectedOptionController } from './hooks/useSelectedOptionController';\nimport type {\n CustomSelectOptionInterface,\n CustomSelectRenderOption,\n MousePosition,\n PopupDirection,\n} from './types';\nimport styles from './CustomSelect.module.css';\n\nconst densityClassNames = {\n none: styles.densityNone,\n compact: styles.densityCompact,\n};\n\nfunction defaultRenderOptionFn<T extends CustomSelectOptionInterface>({\n option,\n ...props\n}: CustomSelectRenderOption<T>): React.ReactNode {\n return <CustomSelectOption {...props} />;\n}\n\nfunction isMousePositionChanged(event: React.MouseEvent, prevPosition: MousePosition) {\n return (\n Math.abs(prevPosition.x - event.clientX) >= 1 || Math.abs(prevPosition.y - event.clientY) >= 1\n );\n}\n\nconst FETCH_STATUS_RESET_DELAY = 2000;\n\nconst FetchingStatus = ({\n fetching = false,\n options,\n fetchingInProgressLabel = 'Список опций загружается...',\n fetchingCompletedLabel = `Загружено опций: ${options.length}`,\n}: Pick<\n SelectProps,\n 'fetching' | 'fetchingInProgressLabel' | 'fetchingCompletedLabel' | 'options'\n>) => {\n const [status, setStatus] = React.useState<'fetching' | 'loaded' | 'none'>('none');\n\n const content = getRequiredValueByKey(status, {\n fetching: fetchingInProgressLabel,\n loaded:\n typeof fetchingCompletedLabel === 'function'\n ? fetchingCompletedLabel(options.length)\n : fetchingCompletedLabel,\n none: '',\n });\n\n useIsomorphicLayoutEffect(\n function updateStatus() {\n if (fetching) {\n setStatus('fetching');\n } else {\n if (status === 'fetching') {\n setStatus('loaded');\n setTimeout(() => setStatus('none'), FETCH_STATUS_RESET_DELAY);\n }\n }\n },\n [fetching],\n );\n\n return <VisuallyHidden aria-live=\"polite\">{content}</VisuallyHidden>;\n};\n\nexport type { CustomSelectClearButtonProps };\n\nexport interface SelectProps<\n OptionInterfaceT extends CustomSelectOptionInterface = CustomSelectOptionInterface,\n> extends Omit<NativeSelectProps, 'slotProps'>,\n Omit<FormFieldProps, 'maxHeight'>,\n Pick<CustomSelectDropdownProps, 'overscrollBehavior'>,\n Pick<CustomSelectInputProps, 'minLength' | 'maxLength' | 'pattern' | 'form' | 'readOnly'> {\n /**\n * Свойства, которые можно прокинуть внутрь компонента:\n * - `root`: свойства для прокидывания в корень компонента;\n * - `select`: свойства для прокидывания в нативный `select`;\n * - `input`: свойства для прокидывания в нативный `input`.\n */\n slotProps?: NativeSelectProps['slotProps'] & {\n input?: React.InputHTMLAttributes<HTMLInputElement> &\n HasDataAttribute &\n HasRootRef<HTMLInputElement>;\n };\n /**\n * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ input: { getRootRef: ... } }`.\n *\n * Ref на внутрений компонент input.\n */\n getSelectInputRef?: React.Ref<HTMLInputElement>;\n /**\n * Если `true`, то при нажатии на `CustomSelect` в нём появится текстовое поле для поиска по `options`. По умолчанию поиск\n * производится по `option.label`.\n */\n searchable?: boolean;\n /**\n * Текст, который будет отображен, если приходит пустой `options`.\n */\n emptyText?: string;\n /**\n * Событие изменения текстового поля.\n */\n onInputChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n /**\n * Список опций в списке.\n */\n options: OptionInterfaceT[];\n /**\n * Функция для кастомной фильтрации. По умолчанию поиск производится по `option.label`.\n */\n filterFn?: false | FilterFn<OptionInterfaceT>;\n /**\n * Направление раскрытия выпадающего списка.\n */\n popupDirection?: PopupDirection;\n /**\n * Рендер-проп для кастомного рендера опции.\n * В объекте аргумента приходят [свойства опции](https://vkui.io/components/custom-select#custom-select-option-api).\n *\n * > ⚠️ Важно: свойство опции `disabled` должно выставляться только через проп `options`.\n * > Запрещается выставлять `disabled` проп опциям в обход `options`, иначе `CustomSelect` не будет знать об актуальном состоянии\n * опции.\n */\n renderOption?: (props: CustomSelectRenderOption<OptionInterfaceT>) => React.ReactNode;\n /**\n * Рендер-проп для кастомного рендера содержимого дропдауна.\n * В `defaultDropdownContent` содержится список опций в виде скроллящегося блока.\n */\n renderDropdown?: ({\n defaultDropdownContent,\n }: {\n defaultDropdownContent: React.ReactNode;\n }) => React.ReactNode;\n /**\n * Если `true`, то в дропдауне вместо списка опций рисуется спиннер. При переданных `renderDropdown` и `fetching: true`\n * \"победит\" `renderDropdown`.\n */\n fetching?: boolean;\n /**\n * Обработчик закрытия выпадающего списка.\n */\n onClose?: VoidFunction;\n /**\n * Обработчик открытия выпадающего списка.\n */\n onOpen?: VoidFunction;\n /**\n * Кастомная кнопка для очистки значения.\n * Должна принимать обязательное свойство `onClick`.\n */\n ClearButton?: React.ComponentType<CustomSelectClearButtonProps>;\n /**\n * Если `true`, то справа будет отображаться кнопка для очистки значения.\n */\n allowClearButton?: boolean;\n /**\n * Передает атрибут `data-testid` для кнопки очистки.\n */\n clearButtonTestId?: string;\n /**\n * Отступ от выпадающего списка.\n */\n dropdownOffsetDistance?: number;\n /**\n * Ширина раскрывающегося списка зависит от контента.\n */\n dropdownAutoWidth?: boolean;\n /**\n * Использовать Portal для рендеринга выпадающего списка.\n */\n forceDropdownPortal?: boolean;\n /**\n * Отключает максимальную высоту по умолчанию.\n */\n noMaxHeight?: boolean;\n /**\n * Передает атрибут `data-testid` для элемента, внутри которого отображается текст выбранной опции `CustomSelect` или плейсхолдер.\n */\n labelTextTestId?: string;\n /**\n * @deprecated Since 7.9.0. Вместо этого используйте `slotProps={ select: { 'data-testid': ... } }`.\n *\n * Передает атрибут `data-testid` для нативного элемента `select`.\n */\n nativeSelectTestId?: string;\n /**\n * Обработчик события `keyDown` в поле ввода.\n */\n onInputKeyDown?: (e: React.KeyboardEvent, isOpen: boolean) => void;\n /**\n * @deprecated Since 8.0.0. Будет удалено в 9.0.0.\n *\n * Включает режим в котором выбранное значение `CustomSelect` читается скринридерами корректно.\n * В данном режиме введенное в поле ввода значение не сбрасывается при потере фокуса.\n */\n accessible?: boolean /* TODO [>=v9] удалить свойство */;\n /**\n * Текстовая метка для индикации процесса загрузки данных для пользователей скринридерами. По умолчанию: `\"Список опций загружается...\"`.\n */\n fetchingInProgressLabel?: string;\n /**\n * Текстовая метка для индикации завершения процесса загрузки данных для пользователей скринридерами. По умолчанию: `\"Загружено опций: ${options.length}\"`.\n */\n fetchingCompletedLabel?: string | ((optionsCount: number) => string);\n}\n\n/**\n * @see https://vkui.io/components/custom-select\n */\nexport function CustomSelect<OptionInterfaceT extends CustomSelectOptionInterface>(\n props: SelectProps<OptionInterfaceT>,\n): React.ReactNode {\n const {\n // FormFieldProps\n status,\n before,\n\n // CustomSelectDropdownProps\n overscrollBehavior,\n\n // SelectProps\n children,\n getSelectInputRef,\n searchable = false,\n emptyText = 'Ничего не найдено',\n 'onInputChange': onInputChangeProp,\n 'options': options,\n filterFn = defaultFilterFn,\n popupDirection = 'bottom',\n 'renderOption': renderOptionProp = defaultRenderOptionFn,\n renderDropdown,\n fetching,\n onClose,\n onOpen,\n ClearButton,\n allowClearButton = false,\n clearButtonTestId,\n dropdownOffsetDistance = 0,\n dropdownAutoWidth = false,\n forceDropdownPortal,\n noMaxHeight = false,\n labelTextTestId,\n nativeSelectTestId,\n 'onInputKeyDown': onInputKeyDownProp,\n accessible = true,\n fetchingInProgressLabel,\n fetchingCompletedLabel,\n\n // NativeSelectProps\n 'value': selectValue,\n defaultValue,\n onChange,\n getRef,\n multiline,\n placeholder,\n 'icon': iconProp,\n selectType,\n mode,\n align,\n form,\n\n // Input props\n minLength,\n maxLength,\n pattern,\n autoFocus,\n disabled,\n id,\n 'readOnly': readOnlyProp,\n\n // Select props\n required,\n name,\n 'onClick': onSelectClick,\n 'onFocus': onSelectFocus,\n 'onBlur': onSelectBlur,\n\n // other\n 'aria-labelledby': ariaLabelledBy,\n\n slotProps,\n ...restProps\n } = props;\n\n if (process.env.NODE_ENV === 'development') {\n checkOptionsValueType(options);\n checkDeprecatedProps(props);\n }\n\n const { density = 'none' } = useAdaptivity();\n\n const {\n onClick: onRootClick,\n onMouseMove: onRootMouseMove,\n onMouseDown: onRootMouseDown,\n getRootRef: rootRef,\n ...rootRest\n } = useMergeProps<\n Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> &\n HasDataAttribute &\n HasRootRef<HTMLDivElement>\n >(restProps, slotProps?.root);\n\n const { getRootRef: getSelectRef, ...selectRest } = useMergeProps(\n {\n getRootRef: getRef,\n required,\n name,\n form,\n onClick: onSelectClick,\n onFocus: onSelectFocus,\n onBlur: onSelectBlur,\n },\n slotProps?.select,\n );\n\n const {\n getRootRef: getInputRef,\n onChange: onChangeInput,\n onFocus: onInputFocus,\n onBlur: onInputBlur,\n onKeyDown: onNativeInputKeyDown,\n onClick: onNativeInputClick,\n readOnly,\n ...inputRest\n } = useMergeProps(\n {\n getRootRef: getSelectInputRef,\n onChange: onInputChangeProp,\n minLength,\n maxLength,\n pattern,\n autoFocus,\n disabled,\n id,\n readOnly: readOnlyProp,\n placeholder,\n },\n slotProps?.input,\n );\n\n const containerRef = React.useRef<HTMLDivElement>(null);\n const handleRootRef = useExternRef(containerRef, rootRef);\n const selectElRef = useExternRef(getSelectRef);\n const selectInputRef = useExternRef(getInputRef);\n\n const propsValue = React.useMemo<SelectValue | undefined>(() => {\n if (selectValue === undefined) {\n return undefined;\n }\n return getOptionByValue(options, selectValue)?.value ?? null;\n }, [options, selectValue]);\n\n const [isControlledOutside, setIsControlledOutside] = React.useState(selectValue !== undefined);\n const [popperPlacement, setPopperPlacement] = React.useState<Placement>(popupDirection);\n\n const {\n nativeSelectValue,\n setNativeSelectValue,\n selectedOptionValue,\n setSelectedOptionValue,\n onNativeSelectChange,\n } = useSelectedOptionController({\n value: propsValue,\n defaultValue,\n isControlledOutside,\n allowClearButton,\n onChange,\n });\n\n const selected = React.useMemo(\n () => options.find((option) => option.value === selectedOptionValue),\n [options, selectedOptionValue],\n );\n\n const { inputValue, onInputChange, resetInputValue, resetInputValueBySelectedOption } =\n useInputValueController({\n options,\n accessible,\n selectedValue: selectedOptionValue,\n onInputChange: onChangeInput,\n });\n\n const filteredOptions = React.useMemo(\n () => filter(options, searchable ? inputValue : '', filterFn),\n [filterFn, inputValue, options, searchable],\n );\n\n const { scrollToElement, optionsWrapperRef, scrollBoxRef } = useScrollListController();\n\n const {\n focusedOptionValue,\n setFocusedOptionValue,\n resetFocusedOption,\n focusOptionByIndex,\n focusOption,\n selectFocusedValue,\n } = useFocusedOptionController({\n selectedOptionValue,\n filteredOptions,\n scrollToElement,\n });\n\n const scrollToSelectedOption = () => {\n scrollToElement(findSelectedIndex(filteredOptions, selectedOptionValue), true);\n };\n\n const [opened, open, close, toggleOpened] = useDropdownOpenedController({\n onOpen: callMultiple(selectFocusedValue, onOpen),\n onOpened: scrollToSelectedOption,\n onClose,\n onClosed: accessible ? resetInputValueBySelectedOption : resetInputValue,\n });\n\n React.useEffect(\n function updateOptionsValue() {\n const value =\n propsValue !== undefined\n ? propsValue\n : remapFromNativeValueToSelectValue(nativeSelectValue);\n setSelectedOptionValue(value);\n setFocusedOptionValue(value);\n },\n [propsValue, nativeSelectValue, setFocusedOptionValue, setSelectedOptionValue],\n );\n\n React.useEffect(\n function syncIsControlledState() {\n setIsControlledOutside((oldIsControlled) => {\n const newIsControlled = propsValue !== undefined;\n checkMixControlledAndUncontrolledState(oldIsControlled, newIsControlled);\n return newIsControlled;\n });\n },\n [propsValue],\n );\n\n useIsomorphicLayoutEffect(() => {\n if (\n filteredOptions.some(({ value }) => nativeSelectValue === value) ||\n (allowClearButton && nativeSelectValue === NOT_SELECTED.NATIVE)\n ) {\n const event = new Event('change', { bubbles: true });\n\n selectElRef.current?.dispatchEvent(event);\n }\n }, [nativeSelectValue]);\n\n const openedClassNames = React.useMemo(\n () =>\n (opened &&\n dropdownOffsetDistance === 0 &&\n (popperPlacement.includes('top') ? styles.popUp : styles.popDown)) ||\n undefined,\n [dropdownOffsetDistance, opened, popperPlacement],\n );\n\n const selectOption = React.useCallback(\n (value: Exclude<SelectValue, null>) => {\n setNativeSelectValue(value ?? NOT_SELECTED.NATIVE);\n close();\n\n const shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync =\n isControlledOutside && propsValue !== nativeSelectValue && nativeSelectValue === value;\n\n if (shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync) {\n const event = new Event('change', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }\n },\n [close, setNativeSelectValue, isControlledOutside, propsValue, nativeSelectValue, selectElRef],\n );\n\n const selectFocused = React.useCallback(() => {\n if (focusedOptionValue === null) {\n return;\n }\n\n selectOption(focusedOptionValue);\n }, [focusedOptionValue, selectOption]);\n\n const handleInputKeyDown = useInputKeyboardController({\n opened,\n open,\n close,\n resetFocusedOption,\n selectFocused,\n focusOption,\n scrollBoxRef,\n onInputKeyDown: onInputKeyDownProp,\n });\n\n const onBlur = React.useCallback(() => {\n close();\n const event = new Event('focusout', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }, [close, selectElRef]);\n\n const onFocus = React.useCallback(() => {\n const event = new Event('focusin', { bubbles: true });\n selectElRef.current?.dispatchEvent(event);\n }, [selectElRef]);\n\n const handleOptionClick = React.useCallback(\n (e: React.MouseEvent<HTMLElement>) => {\n const index = Array.prototype.indexOf.call(\n e.currentTarget.parentNode?.children,\n e.currentTarget,\n );\n const option = filteredOptions[index];\n\n if (option && !option.disabled) {\n selectOption(option.value);\n }\n },\n [filteredOptions, selectOption],\n );\n\n const lastMousePositionRef = React.useRef<MousePosition>({ x: 0, y: 0 });\n const focusOptionOnMouseMove = React.useCallback(\n (e: React.MouseEvent<HTMLElement>, index: number) => {\n if (isMousePositionChanged(e, lastMousePositionRef.current)) {\n focusOptionByIndex(index, false);\n }\n },\n [focusOptionByIndex],\n );\n\n const popupAriaId = React.useId();\n const renderOption = React.useCallback(\n (option: OptionInterfaceT, index: number) => {\n const hovered = option.value === focusedOptionValue;\n const selected = option.value === selectedOptionValue;\n\n return (\n <React.Fragment key={`${typeof option.value}-${option.value}`}>\n {renderOptionProp({\n /**\n * Компилятор сходит с ума из-за рефа внутри focusOptionOnMouseMove.\n * Обходной путь прокидывать ref в свойства для рендер пропов.\n */\n ...(false\n ? {\n __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: lastMousePositionRef,\n }\n : {}),\n option,\n hovered,\n children: option.label,\n selected,\n disabled: option.disabled,\n onClick: handleOptionClick,\n onMouseDown: preventDefault,\n // Используем `onMouseMove` вместо `onMouseEnter/onMouseOver`.\n // Потому что если при навигации с клавиатуры курсор наведён на\n // список, то при первом автоматическом скролле списка вызывается событие MouseOver/MouseEnter\n // обработчик которого фокусирует опцию под курсором, хотя при навигация с клавиатуры пользователь мог уйти дальше по списку, это путает.\n // Причём координаты события меняются на пару пикселей по сравнению с прошлым вызовом,\n // а значит нельзя на них опираться, чтобы запретить обработку такого события.\n // C mousemove такой проблемы нет, что позволяет реализовать поведение при наведении с клавиатуры и при наведении мышью идентично `<select>`.\n onMouseMove: (e) => focusOptionOnMouseMove(e, index),\n id: `${popupAriaId}-${option.value}`,\n ...option,\n })}\n </React.Fragment>\n );\n },\n [\n focusedOptionValue,\n selectedOptionValue,\n renderOptionProp,\n handleOptionClick,\n popupAriaId,\n focusOptionOnMouseMove,\n ],\n );\n\n const resolvedContent = React.useMemo(() => {\n const defaultDropdownContent =\n filteredOptions.length > 0 ? (\n <div ref={optionsWrapperRef}>{filteredOptions.map(renderOption)}</div>\n ) : (\n <Footnote className={styles.empty}>{emptyText}</Footnote>\n );\n\n if (typeof renderDropdown === 'function') {\n return renderDropdown({ defaultDropdownContent });\n } else {\n return defaultDropdownContent;\n }\n }, [emptyText, filteredOptions, optionsWrapperRef, renderDropdown, renderOption]);\n\n const afterItems = useAfterItems({\n value: propsValue,\n nativeSelectValue,\n isControlledOutside,\n opened,\n allowClearButton,\n ClearButton,\n onClearButtonClick: () => {\n setNativeSelectValue(NOT_SELECTED.NATIVE);\n resetInputValue();\n selectInputRef.current && selectInputRef.current.focus();\n },\n clearButtonTestId,\n disabled: inputRest.disabled,\n readOnly,\n icon: iconProp,\n });\n\n const { document } = useDOM();\n const passClickAndFocusToInputOnClick = React.useCallback(\n (e: React.MouseEvent<HTMLDivElement>) => {\n // Раньше внешней оберткой CustomSelect был <label>, что позволяло по клику в любую область CustomSelect,\n // даже где нету интерактивного элемента, фокусировать <input> и передавать на него событие клика.\n // Так как мы больше не оборачиваем CustomSelect в <label>, то для обертки CustomSelect мы симулируем работу <label>.\n // передаем фокус и клик по <input>, если пользователь кликнул в зоне обертки.\n // В <label> мы не больше не оборачиваем, потому что это заставляет скринридер\n // дважды произносить текст выбранной опции при фокусе, если CustomSelect связан с внешним <label>.\n // Воспроизводится в некоторых версиях Chrome, при навигации по странице с помощью стрелок.\n // Договорились со специалистом по доступности убрать <label>-обёртки из Select и CustomSelect\n\n if (!selectInputRef.current || !document) {\n return;\n }\n\n const clickTargetIsNotAnInput = e.target !== selectInputRef.current;\n if (clickTargetIsNotAnInput) {\n selectInputRef.current.click();\n\n const inputIsNotFocused = document.activeElement !== selectInputRef.current;\n if (inputIsNotFocused) {\n selectInputRef.current.focus();\n }\n }\n },\n [document, selectInputRef],\n );\n\n const preventInputBlurWhenClickInsideFocusedSelectArea = (\n e: React.MouseEvent<HTMLDivElement>,\n ) => {\n // Так как инпут больше не оборачивается пустым лэйблом, то клик внутри обертки,\n // но вне инпута (например по иконке дропдауна), будет убирать фокус с инпута.\n // Чтобы в такой ситуации отключить blur инпута мы превентим mousedown событие обёртки\n const isInputFocused = document && document.activeElement === selectInputRef.current;\n if (isInputFocused) {\n e.preventDefault();\n }\n };\n\n const ariaActiveDescendantId = focusedOptionValue !== null ? focusedOptionValue : undefined;\n\n const selectInputAriaProps: React.HTMLAttributes<HTMLElement> = {\n 'role': 'combobox',\n 'aria-controls': popupAriaId,\n 'aria-expanded': opened,\n 'aria-activedescendant':\n ariaActiveDescendantId && opened ? `${popupAriaId}-${ariaActiveDescendantId}` : undefined,\n 'aria-labelledby': ariaLabelledBy,\n 'aria-haspopup': 'listbox',\n 'aria-autocomplete': 'none',\n };\n\n const resetOptionFocusOnMouseLeave = React.useCallback(\n (event: React.MouseEvent) => {\n // В Хроме eсли мышка пользователя находится над инпутом селекта,\n // и он с клавиатуры открывает опции, причём одна из опций\n // уже выбрана, то видно, как выбранная опция получает фокус,\n // но потом сразу же его теряет.\n // Связано это с тем, что в этот момент вызывается onMouseLeave, на который у нас\n // завязан сброс состония фокуса у опции. По хорошему фокус должен оставаться.\n // Нам не интересен вызов onMouseLeave если мышка при этом не двигалась.\n if (isMousePositionChanged(event, lastMousePositionRef.current)) {\n resetFocusedOption();\n }\n },\n [resetFocusedOption],\n );\n\n const updateLastMousePosition = (e: React.MouseEvent) => {\n lastMousePositionRef.current = { x: e.clientX, y: e.clientY };\n };\n\n const onClick = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootClick?.(event);\n passClickAndFocusToInputOnClick(event);\n };\n\n const onMouseDown = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootMouseDown?.(event);\n preventInputBlurWhenClickInsideFocusedSelectArea(event);\n };\n\n const onMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n onRootMouseMove?.(event);\n updateLastMousePosition(event);\n };\n\n const onCustomSelectInputFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n onFocus();\n onInputFocus?.(event);\n };\n\n const onCustomSelectInputBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n onBlur();\n onInputBlur?.(event);\n };\n\n return (\n <RootComponent\n baseClassName={classNames(styles.host, density !== 'regular' && densityClassNames[density])}\n getRootRef={handleRootRef}\n onClick={onClick}\n onMouseDown={onMouseDown}\n onMouseMove={onMouseMove}\n {...rootRest}\n >\n <CustomSelectInput\n fetching={fetching}\n searchable={searchable}\n accessible={accessible}\n before={before}\n after={afterItems}\n selectType={selectType || mode || 'default'}\n align={align}\n status={status}\n multiline={multiline}\n labelTextTestId={labelTextTestId}\n slotProps={{\n root: { className: openedClassNames },\n input: {\n autoComplete: 'off',\n autoCapitalize: 'none',\n autoCorrect: 'off',\n spellCheck: 'false',\n getRootRef: selectInputRef,\n onChange: onInputChange,\n value: inputValue,\n readOnly: readOnly || !searchable,\n placeholder,\n onFocus: onCustomSelectInputFocus,\n onBlur: onCustomSelectInputBlur,\n onKeyDown: !readOnly\n ? callMultiple(handleInputKeyDown, onNativeInputKeyDown)\n : onNativeInputKeyDown,\n onClick: !readOnly\n ? callMultiple(toggleOpened, onNativeInputClick)\n : onNativeInputClick,\n ...selectInputAriaProps,\n ...inputRest,\n },\n }}\n >\n {selected?.label}\n </CustomSelectInput>\n\n <FetchingStatus\n fetching={fetching}\n options={filteredOptions}\n fetchingInProgressLabel={fetchingInProgressLabel}\n fetchingCompletedLabel={fetchingCompletedLabel}\n />\n <RootComponent\n Component=\"select\"\n baseClassName={styles.control}\n tabIndex={-1}\n value={nativeSelectValue}\n aria-hidden\n data-testid={nativeSelectTestId}\n onChange={onNativeSelectChange}\n getRootRef={selectElRef}\n {...selectRest}\n >\n {(allowClearButton || nativeSelectValue === NOT_SELECTED.NATIVE) && (\n <option key={NOT_SELECTED.NATIVE} value={NOT_SELECTED.NATIVE} />\n )}\n {options.map((item) => (\n <option key={`${item.value}`} value={item.value} />\n ))}\n </RootComponent>\n {opened && (\n <CustomSelectDropdown\n targetRef={containerRef}\n placement={popperPlacement}\n scrollBoxRef={scrollBoxRef}\n onPlacementChange={setPopperPlacement}\n onMouseLeave={resetOptionFocusOnMouseLeave}\n fetching={fetching}\n overscrollBehavior={overscrollBehavior}\n offsetDistance={dropdownOffsetDistance}\n autoWidth={dropdownAutoWidth}\n forcePortal={forceDropdownPortal}\n noMaxHeight={noMaxHeight}\n role=\"listbox\"\n id={popupAriaId}\n aria-labelledby={ariaLabelledBy}\n tabIndex={-1}\n >\n {resolvedContent}\n </CustomSelectDropdown>\n )}\n </RootComponent>\n );\n}\n"],"names":["React","classNames","getRequiredValueByKey","useAdaptivity","useExternRef","useMergeProps","callMultiple","useDOM","defaultFilterFn","useIsomorphicLayoutEffect","preventDefault","CustomSelectDropdown","CustomSelectOption","NOT_SELECTED","remapFromNativeValueToSelectValue","RootComponent","Footnote","VisuallyHidden","CustomSelectInput","checkDeprecatedProps","checkMixControlledAndUncontrolledState","checkOptionsValueType","filter","findSelectedIndex","getOptionByValue","useAfterItems","useDropdownOpenedController","useFocusedOptionController","useInputKeyboardController","useInputValueController","useScrollListController","useSelectedOptionController","densityClassNames","none","compact","defaultRenderOptionFn","option","props","isMousePositionChanged","event","prevPosition","Math","abs","x","clientX","y","clientY","FETCH_STATUS_RESET_DELAY","FetchingStatus","fetching","options","fetchingInProgressLabel","fetchingCompletedLabel","length","status","setStatus","useState","content","loaded","updateStatus","setTimeout","aria-live","CustomSelect","before","overscrollBehavior","children","getSelectInputRef","searchable","emptyText","onInputChangeProp","filterFn","popupDirection","renderOptionProp","renderDropdown","onClose","onOpen","ClearButton","allowClearButton","clearButtonTestId","dropdownOffsetDistance","dropdownAutoWidth","forceDropdownPortal","noMaxHeight","labelTextTestId","nativeSelectTestId","onInputKeyDownProp","accessible","selectValue","defaultValue","onChange","getRef","multiline","placeholder","iconProp","selectType","mode","align","form","minLength","maxLength","pattern","autoFocus","disabled","id","readOnlyProp","required","name","onSelectClick","onSelectFocus","onSelectBlur","ariaLabelledBy","slotProps","restProps","process","env","NODE_ENV","density","onClick","onRootClick","onMouseMove","onRootMouseMove","onMouseDown","onRootMouseDown","getRootRef","rootRef","rootRest","root","getSelectRef","selectRest","onFocus","onBlur","select","getInputRef","onChangeInput","onInputFocus","onInputBlur","onKeyDown","onNativeInputKeyDown","onNativeInputClick","readOnly","inputRest","input","containerRef","useRef","handleRootRef","selectElRef","selectInputRef","propsValue","useMemo","undefined","value","isControlledOutside","setIsControlledOutside","popperPlacement","setPopperPlacement","nativeSelectValue","setNativeSelectValue","selectedOptionValue","setSelectedOptionValue","onNativeSelectChange","selected","find","inputValue","onInputChange","resetInputValue","resetInputValueBySelectedOption","selectedValue","filteredOptions","scrollToElement","optionsWrapperRef","scrollBoxRef","focusedOptionValue","setFocusedOptionValue","resetFocusedOption","focusOptionByIndex","focusOption","selectFocusedValue","scrollToSelectedOption","opened","open","close","toggleOpened","onOpened","onClosed","useEffect","updateOptionsValue","syncIsControlledState","oldIsControlled","newIsControlled","some","NATIVE","Event","bubbles","current","dispatchEvent","openedClassNames","includes","selectOption","useCallback","shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync","selectFocused","handleInputKeyDown","onInputKeyDown","handleOptionClick","e","index","Array","prototype","indexOf","call","currentTarget","parentNode","lastMousePositionRef","focusOptionOnMouseMove","popupAriaId","useId","renderOption","hovered","Fragment","__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED","label","resolvedContent","defaultDropdownContent","div","ref","map","className","afterItems","onClearButtonClick","focus","icon","document","passClickAndFocusToInputOnClick","clickTargetIsNotAnInput","target","click","inputIsNotFocused","activeElement","preventInputBlurWhenClickInsideFocusedSelectArea","isInputFocused","ariaActiveDescendantId","selectInputAriaProps","resetOptionFocusOnMouseLeave","updateLastMousePosition","onCustomSelectInputFocus","onCustomSelectInputBlur","baseClassName","after","autoComplete","autoCapitalize","autoCorrect","spellCheck","Component","tabIndex","aria-hidden","data-testid","item","targetRef","placement","onPlacementChange","onMouseLeave","offsetDistance","autoWidth","forcePortal","role","aria-labelledby"],"mappings":"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"}
|
|
@@ -8,5 +8,5 @@ export interface FormItemTopAsideProps extends React.AllHTMLAttributes<HTMLEleme
|
|
|
8
8
|
* @since 6.1.0
|
|
9
9
|
*
|
|
10
10
|
*/
|
|
11
|
-
export declare const FormItemTopAside: ({ children, ...restProps }: FormItemTopAsideProps) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
export declare const FormItemTopAside: ({ children, className, ...restProps }: FormItemTopAsideProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
//# sourceMappingURL=FormItemTopAside.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormItemTopAside.d.ts","sourceRoot":"","sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopAside.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"FormItemTopAside.d.ts","sourceRoot":"","sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopAside.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAI/D,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,YAAY;CAAG;AAEnB;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,uCAAuC,qBAAqB,4CAM5F,CAAC"}
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { classNames } from "@vkontakte/vkjs";
|
|
2
3
|
import { Subhead } from "../../Typography/Subhead/Subhead.js";
|
|
3
4
|
/**
|
|
4
5
|
* Отвечает за отрисовку дополнительного контента справа от заголовка поля.
|
|
5
6
|
*
|
|
6
7
|
* @since 6.1.0
|
|
7
8
|
*
|
|
8
|
-
*/ export const FormItemTopAside = ({ children, ...restProps })=>{
|
|
9
|
+
*/ export const FormItemTopAside = ({ children, className, ...restProps })=>{
|
|
9
10
|
return /*#__PURE__*/ _jsx(Subhead, {
|
|
10
|
-
className: "vkuiFormItem__aside",
|
|
11
|
+
className: classNames(className, "vkuiFormItem__aside"),
|
|
11
12
|
...restProps,
|
|
12
13
|
children: children
|
|
13
14
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopAside.tsx"],"sourcesContent":["import type * as React from 'react';\nimport type { HasComponent, HasRootRef } from '../../../types';\nimport { Subhead } from '../../Typography/Subhead/Subhead';\nimport styles from '../FormItem.module.css';\n\nexport interface FormItemTopAsideProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent {}\n\n/**\n * Отвечает за отрисовку дополнительного контента справа от заголовка поля.\n *\n * @since 6.1.0\n *\n */\nexport const FormItemTopAside = ({ children, ...restProps }: FormItemTopAsideProps) => {\n return (\n <Subhead className={styles.aside} {...restProps}>\n {children}\n </Subhead>\n );\n};\n"],"names":["Subhead","FormItemTopAside","children","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopAside.tsx"],"sourcesContent":["import type * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasComponent, HasRootRef } from '../../../types';\nimport { Subhead } from '../../Typography/Subhead/Subhead';\nimport styles from '../FormItem.module.css';\n\nexport interface FormItemTopAsideProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent {}\n\n/**\n * Отвечает за отрисовку дополнительного контента справа от заголовка поля.\n *\n * @since 6.1.0\n *\n */\nexport const FormItemTopAside = ({ children, className, ...restProps }: FormItemTopAsideProps) => {\n return (\n <Subhead className={classNames(className, styles.aside)} {...restProps}>\n {children}\n </Subhead>\n );\n};\n"],"names":["classNames","Subhead","FormItemTopAside","children","className","restProps"],"mappings":";AACA,SAASA,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,OAAO,QAAQ,sCAAmC;AAQ3D;;;;;CAKC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAkC;IAC3F,qBACE,KAACJ;QAAQG,WAAWJ,WAAWI;QAA2B,GAAGC,SAAS;kBACnEF;;AAGP,EAAE"}
|
|
@@ -9,5 +9,5 @@ export interface FormItemTopLabelProps extends React.AllHTMLAttributes<HTMLEleme
|
|
|
9
9
|
* @since 6.1.0
|
|
10
10
|
*
|
|
11
11
|
*/
|
|
12
|
-
export declare const FormItemTopLabel: ({ children, Component: componentProp, htmlFor, ...restProps }: FormItemTopLabelProps) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare const FormItemTopLabel: ({ children, Component: componentProp, htmlFor, className, ...restProps }: FormItemTopLabelProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
13
|
//# sourceMappingURL=FormItemTopLabel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormItemTopLabel.d.ts","sourceRoot":"","sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopLabel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAK/D,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,YAAY;CAAG;AAEnB;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,GAAI
|
|
1
|
+
{"version":3,"file":"FormItemTopLabel.d.ts","sourceRoot":"","sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopLabel.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAK/D,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,UAAU,CAAC,WAAW,CAAC,EACvB,YAAY;CAAG;AAEnB;;;;;;GAMG;AACH,eAAO,MAAM,gBAAgB,GAAI,0EAM9B,qBAAqB,4CAmBvB,CAAC"}
|
|
@@ -10,11 +10,11 @@ import { FormItemContext } from "../context.js";
|
|
|
10
10
|
*
|
|
11
11
|
* @since 6.1.0
|
|
12
12
|
*
|
|
13
|
-
*/ export const FormItemTopLabel = ({ children, Component: componentProp, htmlFor, ...restProps })=>{
|
|
13
|
+
*/ export const FormItemTopLabel = ({ children, Component: componentProp, htmlFor, className, ...restProps })=>{
|
|
14
14
|
const component = componentProp || htmlFor && 'label' || 'span';
|
|
15
15
|
const { required, topMultiline } = React.useContext(FormItemContext);
|
|
16
16
|
return /*#__PURE__*/ _jsxs(Subhead, {
|
|
17
|
-
className: classNames("vkuiFormItem__label", topMultiline && "vkuiFormItem__labelMultiline"),
|
|
17
|
+
className: classNames(className, "vkuiFormItem__label", topMultiline && "vkuiFormItem__labelMultiline"),
|
|
18
18
|
Component: component,
|
|
19
19
|
htmlFor: htmlFor,
|
|
20
20
|
...restProps,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopLabel.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasComponent, HasRootRef } from '../../../types';\nimport { Subhead } from '../../Typography/Subhead/Subhead';\nimport { FormItemContext } from '../context';\nimport styles from '../FormItem.module.css';\n\nexport interface FormItemTopLabelProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent {}\n\n/**\n * Отвечает за отрисовку заголовка поля. По умолчанию компонент представлен тегом `label`, если передано свойство `htmlFor`.\n * Можно переопределить через свойство `Component`.\n *\n * @since 6.1.0\n *\n */\nexport const FormItemTopLabel = ({\n children,\n Component: componentProp,\n htmlFor,\n ...restProps\n}: FormItemTopLabelProps) => {\n const component = componentProp || (htmlFor && 'label') || 'span';\n const { required, topMultiline } = React.useContext(FormItemContext);\n\n return (\n <Subhead\n className={classNames(styles.label, topMultiline && styles.labelMultiline)}\n Component={component}\n htmlFor={htmlFor}\n {...restProps}\n >\n {children}\n {required && (\n <span className={styles.labelRequired} aria-hidden>\n *\n </span>\n )}\n </Subhead>\n );\n};\n"],"names":["React","classNames","Subhead","FormItemContext","FormItemTopLabel","children","Component","componentProp","htmlFor","restProps","component","required","topMultiline","useContext","
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/FormItem/FormItemTop/FormItemTopLabel.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport type { HasComponent, HasRootRef } from '../../../types';\nimport { Subhead } from '../../Typography/Subhead/Subhead';\nimport { FormItemContext } from '../context';\nimport styles from '../FormItem.module.css';\n\nexport interface FormItemTopLabelProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement>,\n HasComponent {}\n\n/**\n * Отвечает за отрисовку заголовка поля. По умолчанию компонент представлен тегом `label`, если передано свойство `htmlFor`.\n * Можно переопределить через свойство `Component`.\n *\n * @since 6.1.0\n *\n */\nexport const FormItemTopLabel = ({\n children,\n Component: componentProp,\n htmlFor,\n className,\n ...restProps\n}: FormItemTopLabelProps) => {\n const component = componentProp || (htmlFor && 'label') || 'span';\n const { required, topMultiline } = React.useContext(FormItemContext);\n\n return (\n <Subhead\n className={classNames(className, styles.label, topMultiline && styles.labelMultiline)}\n Component={component}\n htmlFor={htmlFor}\n {...restProps}\n >\n {children}\n {required && (\n <span className={styles.labelRequired} aria-hidden>\n *\n </span>\n )}\n </Subhead>\n );\n};\n"],"names":["React","classNames","Subhead","FormItemContext","FormItemTopLabel","children","Component","componentProp","htmlFor","className","restProps","component","required","topMultiline","useContext","span","aria-hidden"],"mappings":"AAAA;;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,QAAQ,kBAAkB;AAE7C,SAASC,OAAO,QAAQ,sCAAmC;AAC3D,SAASC,eAAe,QAAQ,gBAAa;AAQ7C;;;;;;CAMC,GACD,OAAO,MAAMC,mBAAmB,CAAC,EAC/BC,QAAQ,EACRC,WAAWC,aAAa,EACxBC,OAAO,EACPC,SAAS,EACT,GAAGC,WACmB;IACtB,MAAMC,YAAYJ,iBAAkBC,WAAW,WAAY;IAC3D,MAAM,EAAEI,QAAQ,EAAEC,YAAY,EAAE,GAAGb,MAAMc,UAAU,CAACX;IAEpD,qBACE,MAACD;QACCO,WAAWR,WAAWQ,kCAAyBI;QAC/CP,WAAWK;QACXH,SAASA;QACR,GAAGE,SAAS;;YAEZL;YACAO,0BACC,KAACG;gBAAKN,SAAS;gBAAwBO,aAAW;0BAAC;;;;AAM3D,EAAE"}
|
|
@@ -68,8 +68,10 @@ export interface ImageBaseProps extends React.ImgHTMLAttributes<HTMLElement>, An
|
|
|
68
68
|
*/
|
|
69
69
|
elementTiming?: string;
|
|
70
70
|
/**
|
|
71
|
-
* Пользовательское значения стиля filter
|
|
71
|
+
* Пользовательское значения стиля filter.
|
|
72
72
|
* Подробнее можно почитать в [документации](https://developer.mozilla.org/ru/docs/Web/CSS/filter).
|
|
73
|
+
*
|
|
74
|
+
* При передаче этого свойства `<img />` будет обёрнут в дополнительный контейнер.
|
|
73
75
|
*/
|
|
74
76
|
filter?: React.CSSProperties['filter'];
|
|
75
77
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageBase.d.ts","sourceRoot":"","sources":["../../../src/components/ImageBase/ImageBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EACV,wBAAwB,EACxB,gBAAgB,EAChB,UAAU,EACV,YAAY,EACb,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAC3F,OAAO,EACL,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,qBAAqB,EACrB,KAAK,0BAA0B,EAChC,MAAM,+CAA+C,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AACnG,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,qBAAqB,EAAE,0BAA0B,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIhG,YAAY,EACV,aAAa,EACb,0BAA0B,EAC1B,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACrB,0BAA0B,EAC1B,qBAAqB,EACrB,uBAAuB,GACxB,CAAC;AAEF,OAAO,EACL,+BAA+B,EAC/B,kCAAkC,EAClC,iCAAiC,GAClC,MAAM,WAAW,CAAC;AAEnB,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAS5B,MAAM,WAAW,cACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,wBAAwB,EACxB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC3C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;;;OAYG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;IAC9D;;;OAGG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAC7C;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACvD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB
|
|
1
|
+
{"version":3,"file":"ImageBase.d.ts","sourceRoot":"","sources":["../../../src/components/ImageBase/ImageBase.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EACV,wBAAwB,EACxB,gBAAgB,EAChB,UAAU,EACV,YAAY,EACb,MAAM,aAAa,CAAC;AAErB,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAC3F,OAAO,EACL,KAAK,uBAAuB,EAC5B,KAAK,qBAAqB,EAC1B,qBAAqB,EACrB,KAAK,0BAA0B,EAChC,MAAM,+CAA+C,CAAC;AACvD,OAAO,EAAE,gBAAgB,EAAE,KAAK,qBAAqB,EAAE,MAAM,qCAAqC,CAAC;AACnG,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,qBAAqB,EAAE,0BAA0B,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIhG,YAAY,EACV,aAAa,EACb,0BAA0B,EAC1B,mBAAmB,EACnB,qBAAqB,EACrB,qBAAqB,EACrB,0BAA0B,EAC1B,qBAAqB,EACrB,uBAAuB,GACxB,CAAC;AAEF,OAAO,EACL,+BAA+B,EAC/B,kCAAkC,EAClC,iCAAiC,GAClC,MAAM,WAAW,CAAC;AAEnB,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAS5B,MAAM,WAAW,cACf,SAAQ,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,EAC1C,wBAAwB,EACxB,UAAU,CAAC,cAAc,CAAC;IAC5B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,YAAY,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC;IAC3C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;;;;OAYG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;IAC9D;;;OAGG;IACH,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC;;;OAGG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC;IAC7C;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACvD;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC;;;OAGG;IACH,SAAS,CAAC,EAAE;QACV,GAAG,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG,UAAU,CAAC,gBAAgB,CAAC,GAAG,gBAAgB,CAAC;KACrF,CAAC;IACF;;OAEG;IACH,MAAM,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACtC;AA8BD;;GAEG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAAC,GAAG;IACjD,KAAK,EAAE,OAAO,cAAc,CAAC;IAC7B,OAAO,EAAE,OAAO,gBAAgB,CAAC;IACjC,YAAY,EAAE,OAAO,qBAAqB,CAAC;CAiM5C,CAAC"}
|
|
@@ -149,6 +149,11 @@ const sizeToNumber = (size)=>{
|
|
|
149
149
|
mouseOverHandlers,
|
|
150
150
|
size
|
|
151
151
|
]);
|
|
152
|
+
const imgSlot = hasSrc && /*#__PURE__*/ _jsx("img", {
|
|
153
|
+
ref: imgRef,
|
|
154
|
+
...imgRest,
|
|
155
|
+
...getFetchPriorityProp(fetchPriority)
|
|
156
|
+
});
|
|
152
157
|
return /*#__PURE__*/ _jsx(ImageBaseContext.Provider, {
|
|
153
158
|
value: contextValue,
|
|
154
159
|
children: /*#__PURE__*/ _jsxs(Clickable, {
|
|
@@ -162,11 +167,10 @@ const sizeToNumber = (size)=>{
|
|
|
162
167
|
onMouseOut: onMouseOut,
|
|
163
168
|
...restProps,
|
|
164
169
|
children: [
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
}),
|
|
170
|
+
filter ? /*#__PURE__*/ _jsx("div", {
|
|
171
|
+
className: "vkuiImageBase__imgWithFilterContainer",
|
|
172
|
+
children: imgSlot
|
|
173
|
+
}) : imgSlot,
|
|
170
174
|
fallbackIcon && /*#__PURE__*/ _jsx("div", {
|
|
171
175
|
className: "vkuiImageBase__fallback",
|
|
172
176
|
children: fallbackIcon
|