npm - @vkontakte/vkui - Versions diffs - 6.7.0 → 6.7.2 - Mend

@vkontakte/vkui 6.7.0 → 6.7.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.

Files changed (133) hide show

package/dist/cjs/components/AppRoot/AppRoot.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AppRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkB/B,OAAO,KAAK,EACV,aAAa,EACb,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,cAAc,EACf,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,wBAAwB;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,8CAA8C,CAAC,EAAE,OAAO,CAAC;IACzD;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;;;;;;;OAUG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;CACxC;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,2MAYjB,YAAY,KAAG,KAAK,CAAC,~~SAkJvB~~,CAAC"}
1	+ {"version":3,"file":"AppRoot.d.ts","sourceRoot":"","sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkB/B,OAAO,KAAK,EACV,aAAa,EACb,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,cAAc,EACf,MAAM,SAAS,CAAC;AAGjB,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,wBAAwB;IACxB,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;OAEG;IACH,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC;;OAEG;IACH,UAAU,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAC/D;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;;OAKG;IACH,8CAA8C,CAAC,EAAE,OAAO,CAAC;IACzD;;;OAGG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;;;;;;;;;OAUG;IACH,cAAc,CAAC,EAAE,qBAAqB,CAAC;CACxC;AAED;;GAEG;AACH,eAAO,MAAM,OAAO,2MAYjB,YAAY,KAAG,KAAK,CAAC,SAqJvB,CAAC"}

package/dist/cjs/components/AppRoot/AppRoot.js CHANGED Viewed

@@ -128,8 +128,7 @@ const AppRoot = (_param)=>{
     const ScrollController = _react.useMemo(()=>scroll === 'contain' ? _ScrollContext.ElementScrollController : _ScrollContext.GlobalScrollController, [
         scroll
     ]);
-    const content = /*#__PURE__*/ (0, _jsxruntime.jsx)(_AppRootContext.AppRootContext.Provider, {
-        value: {
+    const contextValue = _react.useMemo(()=>({
             appRoot: appRootRef,
             portalRoot: portalRootRef,
             embedded: mode === 'embedded',
@@ -139,7 +138,14 @@ const AppRoot = (_param)=>{
             get keyboardInput () {
                 return isKeyboardInputActiveRef.current;
             }
-        },
+        }), [
+        disablePortal,
+        isKeyboardInputActiveRef,
+        layout,
+        mode
+    ]);
+    const content = /*#__PURE__*/ (0, _jsxruntime.jsx)(_AppRootContext.AppRootContext.Provider, {
+        value: contextValue,
         children: /*#__PURE__*/ (0, _jsxruntime.jsx)(ScrollController, {
             elRef: appRootRef,
             children: children

package/dist/cjs/components/AppRoot/AppRoot.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { getDocumentBody } from '../../lib/dom';\nimport { useTokensClassName } from '../../lib/tokens';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { AppRootContext } from './AppRootContext';\nimport { ElementScrollController, GlobalScrollController } from './ScrollContext';\nimport {\n extractPortalRootByProp,\n getClassNamesByMode,\n getParentElement,\n getUserSelectModeClassName,\n setSafeAreaInsets,\n} from './helpers';\nimport type {\n AppRootLayout,\n AppRootMode,\n AppRootScroll,\n AppRootUserSelectMode,\n SafeAreaInsets,\n} from './types';\nimport styles from './AppRoot.module.css';\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Режим встраивания /\n mode?: AppRootMode;\n /\n - `global` (по умолчанию) — VKUI-приложение скроллится вместе со страницей.\n * - `contain` — VKUI-приложение живет в отдельной зоне и скроллится независимо внутри `AppRoot` (например, в модалке).\n \n Полезно при использовании `mode=\"embedded\"`.\n /\n scroll?: AppRootScroll;\n /\n см. документацию [mdn web docs \| env#values](https://developer.mozilla.org/en-US/docs/Web/CSS/env#values).\n /\n safeAreaInsets?: SafeAreaInsets;\n /\n Кастомный root-элемент портала\n /\n portalRoot?: HTMLElement \| React.RefObject<HTMLElement> \| null;\n /\n Отключает рендер всплывающих компонентов в отдельном контейнере\n /\n disablePortal?: boolean;\n /\n По умолчанию, mode=\"embedded\" переносит систему координат элементов с `position: fixed` на\n * свой контейнер через `transform: translate3d(0, 0, 0)`.\n \n Это поведение можно отключить с помощью этого параметра.\n /\n disableParentTransformForPositionFixedElements?: boolean;\n /\n Глобально задаёт тип оформления макета для компонентов\n * [Panel](https://vkcom.github.io/VKUI/#/Panel) и [Group](https://vkcom.github.io/VKUI/#/Group).\n /\n layout?: AppRootLayout;\n /\n Задаёт режим выбора текста (выделения текста) для всего приложения.\n * По умолчанию, если режим не задан, запрещает выбор текста в приложениях,\n * запущенных в webview (по значению свойства `isWebView` из [ConfigProvider](https://vkcom.github.io/VKUI/#/ConfigProvider)).\n \n - `enabled-with-pointer` – разрешает выбор текста, если устройство ввода типа `pointer` (например, `мышь`), в остальных случаях запрещает;\n * - `disabled` – запрещает выбор текста;\n * - `enabled` – разрешает выбор текста.\n \n @since 6.2.0\n /\n userSelectMode?: AppRootUserSelectMode;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/AppRoot\n /\nexport const AppRoot = ({\n children,\n mode = 'full',\n scroll = 'global',\n portalRoot: portalRootProp = null,\n disablePortal = false,\n disableParentTransformForPositionFixedElements,\n className,\n safeAreaInsets: safeAreaInsetsProp,\n layout,\n userSelectMode,\n ...props\n}: AppRootProps): React.ReactNode => {\n const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n const tokensClassName = useTokensClassName();\n\n const safeAreaInsets = useObjectMemo(safeAreaInsetsProp);\n const isKeyboardInputActiveRef = useKeyboardInputTracker();\n const appRootRef = React.useRef<HTMLDivElement \| null>(null);\n const portalRootRef = React.useRef<HTMLElement \| null>(null);\n\n useIsomorphicLayoutEffect(\n function setupPortalRoot() {\n const portalByProp = portalRootProp ? extractPortalRootByProp(portalRootProp) : null;\n\n if (portalByProp) {\n portalRootRef.current = portalByProp;\n return function cleanup() {\n portalRootRef.current = null;\n };\n }\n\n const documentBody = getDocumentBody(appRootRef.current);\n const portal = documentBody.ownerDocument.createElement('div');\n documentBody.appendChild(portal);\n portalRootRef.current = portal;\n return function cleanup() {\n documentBody.removeChild(portal);\n portalRootRef.current = null;\n };\n },\n [portalRootProp],\n );\n\n useIsomorphicLayoutEffect(\n function setupContainers() {\n if (!appRootRef.current \|\| !portalRootRef.current) {\n return;\n }\n\n const parentElement = getParentElement(appRootRef.current);\n const documentBody = getDocumentBody(appRootRef.current);\n const documentElement = documentBody.ownerDocument.documentElement;\n\n const [baseClassNames, stylesClassNames] = getClassNamesByMode({\n mode,\n layout,\n tokensClassName,\n sizeX,\n sizeY,\n });\n\n / eslint-disable no-restricted-properties /\n switch (mode) {\n case 'full': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames);\n }\n\n documentElement.classList.add(...stylesClassNames, 'vkui');\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, documentElement);\n\n return function cleanup() {\n if (parentElement) {\n parentElement.classList.remove(...baseClassNames);\n }\n\n documentElement.classList.remove(...stylesClassNames, 'vkui');\n unsetSafeAreaInsets();\n };\n }\n case 'embedded': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.setProperty('transform', 'translate3d(0, 0, 0)');\n }\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, parentElement, portalRootRef.current); // prettier-ignore\n return function cleanup() {\n parentElement.classList.remove(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.removeProperty('transform');\n }\n unsetSafeAreaInsets();\n };\n }\n / istanbul ignore next: node.parentElement может быть null, но такой кейс в теории невозможен /\n return;\n }\n / istanbul ignore next: не покрывается за счёт теста на <AppRoot mode=\"partial\" /> /\n case 'partial': {\n return;\n }\n }\n / eslint-enable no-restricted-properties */\n },\n [\n mode,\n layout,\n disableParentTransformForPositionFixedElements,\n tokensClassName,\n sizeX,\n sizeY,\n safeAreaInsets,\n ],\n );\n\n const ScrollController = React.useMemo(\n () => (scroll === 'contain' ? ElementScrollController : GlobalScrollController),\n [scroll],\n );\n\n const content = (\n <AppRootContext.Provider\n value={{\n appRoot: appRootRef,\n portalRoot: portalRootRef,\n embedded: mode === 'embedded',\n mode,\n disablePortal,\n layout,\n get keyboardInput() {\n return isKeyboardInputActiveRef.current;\n },\n }}\n >\n <ScrollController elRef={appRootRef}>{children}</ScrollController>\n </AppRootContext.Provider>\n );\n\n const { isWebView } = useConfigProvider();\n const userSelectModeClassName = getUserSelectModeClassName({\n userSelectMode,\n isWebView,\n hasPointer,\n });\n\n return mode === 'partial' ? (\n content\n ) : (\n <div\n ref={appRootRef}\n className={classNames(styles['AppRoot'], userSelectModeClassName, className)}\n {...props}\n >\n {content}\n </div>\n );\n};\n"],"names":["AppRoot","children","mode","scroll","portalRoot","portalRootProp","disablePortal","disableParentTransformForPositionFixedElements","className","safeAreaInsets","safeAreaInsetsProp","layout","userSelectMode","props","hasPointer","sizeX","sizeY","useAdaptivity","tokensClassName","useTokensClassName","useObjectMemo","isKeyboardInputActiveRef","useKeyboardInputTracker","appRootRef","React","useRef","portalRootRef","useIsomorphicLayoutEffect","setupPortalRoot","portalByProp","extractPortalRootByProp","current","cleanup","documentBody","getDocumentBody","portal","ownerDocument","createElement","appendChild","removeChild","setupContainers","parentElement","getParentElement","documentElement","baseClassNames","stylesClassNames","getClassNamesByMode","classList","add","unsetSafeAreaInsets","setSafeAreaInsets","remove","style","setProperty","removeProperty","ScrollController","useMemo","ElementScrollController","GlobalScrollController","content","AppRootContext","Provider","value","appRoot","embedded","keyboardInput","elRef","isWebView","useConfigProvider","userSelectModeClassName","getUserSelectModeClassName","div","ref","classNames"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../src/components/AppRoot/AppRoot.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivity } from '../../hooks/useAdaptivity';\nimport { useKeyboardInputTracker } from '../../hooks/useKeyboardInputTracker';\nimport { useObjectMemo } from '../../hooks/useObjectMemo';\nimport { getDocumentBody } from '../../lib/dom';\nimport { useTokensClassName } from '../../lib/tokens';\nimport { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';\nimport { useConfigProvider } from '../ConfigProvider/ConfigProviderContext';\nimport { AppRootContext } from './AppRootContext';\nimport { ElementScrollController, GlobalScrollController } from './ScrollContext';\nimport {\n extractPortalRootByProp,\n getClassNamesByMode,\n getParentElement,\n getUserSelectModeClassName,\n setSafeAreaInsets,\n} from './helpers';\nimport type {\n AppRootLayout,\n AppRootMode,\n AppRootScroll,\n AppRootUserSelectMode,\n SafeAreaInsets,\n} from './types';\nimport styles from './AppRoot.module.css';\n\nexport interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Режим встраивания /\n mode?: AppRootMode;\n /\n - `global` (по умолчанию) — VKUI-приложение скроллится вместе со страницей.\n * - `contain` — VKUI-приложение живет в отдельной зоне и скроллится независимо внутри `AppRoot` (например, в модалке).\n \n Полезно при использовании `mode=\"embedded\"`.\n /\n scroll?: AppRootScroll;\n /\n см. документацию [mdn web docs \| env#values](https://developer.mozilla.org/en-US/docs/Web/CSS/env#values).\n /\n safeAreaInsets?: SafeAreaInsets;\n /\n Кастомный root-элемент портала\n /\n portalRoot?: HTMLElement \| React.RefObject<HTMLElement> \| null;\n /\n Отключает рендер всплывающих компонентов в отдельном контейнере\n /\n disablePortal?: boolean;\n /\n По умолчанию, mode=\"embedded\" переносит систему координат элементов с `position: fixed` на\n * свой контейнер через `transform: translate3d(0, 0, 0)`.\n \n Это поведение можно отключить с помощью этого параметра.\n /\n disableParentTransformForPositionFixedElements?: boolean;\n /\n Глобально задаёт тип оформления макета для компонентов\n * [Panel](https://vkcom.github.io/VKUI/#/Panel) и [Group](https://vkcom.github.io/VKUI/#/Group).\n /\n layout?: AppRootLayout;\n /\n Задаёт режим выбора текста (выделения текста) для всего приложения.\n * По умолчанию, если режим не задан, запрещает выбор текста в приложениях,\n * запущенных в webview (по значению свойства `isWebView` из [ConfigProvider](https://vkcom.github.io/VKUI/#/ConfigProvider)).\n \n - `enabled-with-pointer` – разрешает выбор текста, если устройство ввода типа `pointer` (например, `мышь`), в остальных случаях запрещает;\n * - `disabled` – запрещает выбор текста;\n * - `enabled` – разрешает выбор текста.\n \n @since 6.2.0\n /\n userSelectMode?: AppRootUserSelectMode;\n}\n\n/\n @see https://vkcom.github.io/VKUI/#/AppRoot\n /\nexport const AppRoot = ({\n children,\n mode = 'full',\n scroll = 'global',\n portalRoot: portalRootProp = null,\n disablePortal = false,\n disableParentTransformForPositionFixedElements,\n className,\n safeAreaInsets: safeAreaInsetsProp,\n layout,\n userSelectMode,\n ...props\n}: AppRootProps): React.ReactNode => {\n const { hasPointer, sizeX = 'none', sizeY = 'none' } = useAdaptivity();\n const tokensClassName = useTokensClassName();\n\n const safeAreaInsets = useObjectMemo(safeAreaInsetsProp);\n const isKeyboardInputActiveRef = useKeyboardInputTracker();\n const appRootRef = React.useRef<HTMLDivElement \| null>(null);\n const portalRootRef = React.useRef<HTMLElement \| null>(null);\n\n useIsomorphicLayoutEffect(\n function setupPortalRoot() {\n const portalByProp = portalRootProp ? extractPortalRootByProp(portalRootProp) : null;\n\n if (portalByProp) {\n portalRootRef.current = portalByProp;\n return function cleanup() {\n portalRootRef.current = null;\n };\n }\n\n const documentBody = getDocumentBody(appRootRef.current);\n const portal = documentBody.ownerDocument.createElement('div');\n documentBody.appendChild(portal);\n portalRootRef.current = portal;\n return function cleanup() {\n documentBody.removeChild(portal);\n portalRootRef.current = null;\n };\n },\n [portalRootProp],\n );\n\n useIsomorphicLayoutEffect(\n function setupContainers() {\n if (!appRootRef.current \|\| !portalRootRef.current) {\n return;\n }\n\n const parentElement = getParentElement(appRootRef.current);\n const documentBody = getDocumentBody(appRootRef.current);\n const documentElement = documentBody.ownerDocument.documentElement;\n\n const [baseClassNames, stylesClassNames] = getClassNamesByMode({\n mode,\n layout,\n tokensClassName,\n sizeX,\n sizeY,\n });\n\n / eslint-disable no-restricted-properties /\n switch (mode) {\n case 'full': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames);\n }\n\n documentElement.classList.add(...stylesClassNames, 'vkui');\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, documentElement);\n\n return function cleanup() {\n if (parentElement) {\n parentElement.classList.remove(...baseClassNames);\n }\n\n documentElement.classList.remove(...stylesClassNames, 'vkui');\n unsetSafeAreaInsets();\n };\n }\n case 'embedded': {\n if (parentElement) {\n parentElement.classList.add(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.setProperty('transform', 'translate3d(0, 0, 0)');\n }\n const unsetSafeAreaInsets = setSafeAreaInsets(safeAreaInsets, parentElement, portalRootRef.current); // prettier-ignore\n return function cleanup() {\n parentElement.classList.remove(...baseClassNames, ...stylesClassNames);\n if (!disableParentTransformForPositionFixedElements) {\n parentElement.style.removeProperty('transform');\n }\n unsetSafeAreaInsets();\n };\n }\n / istanbul ignore next: node.parentElement может быть null, но такой кейс в теории невозможен /\n return;\n }\n / istanbul ignore next: не покрывается за счёт теста на <AppRoot mode=\"partial\" /> /\n case 'partial': {\n return;\n }\n }\n / eslint-enable no-restricted-properties */\n },\n [\n mode,\n layout,\n disableParentTransformForPositionFixedElements,\n tokensClassName,\n sizeX,\n sizeY,\n safeAreaInsets,\n ],\n );\n\n const ScrollController = React.useMemo(\n () => (scroll === 'contain' ? ElementScrollController : GlobalScrollController),\n [scroll],\n );\n\n const contextValue = React.useMemo(\n () => ({\n appRoot: appRootRef,\n portalRoot: portalRootRef,\n embedded: mode === 'embedded',\n mode,\n disablePortal,\n layout,\n get keyboardInput() {\n return isKeyboardInputActiveRef.current;\n },\n }),\n [disablePortal, isKeyboardInputActiveRef, layout, mode],\n );\n\n const content = (\n <AppRootContext.Provider value={contextValue}>\n <ScrollController elRef={appRootRef}>{children}</ScrollController>\n </AppRootContext.Provider>\n );\n\n const { isWebView } = useConfigProvider();\n const userSelectModeClassName = getUserSelectModeClassName({\n userSelectMode,\n isWebView,\n hasPointer,\n });\n\n return mode === 'partial' ? (\n content\n ) : (\n <div\n ref={appRootRef}\n className={classNames(styles['AppRoot'], userSelectModeClassName, className)}\n {...props}\n >\n {content}\n </div>\n );\n};\n"],"names":["AppRoot","children","mode","scroll","portalRoot","portalRootProp","disablePortal","disableParentTransformForPositionFixedElements","className","safeAreaInsets","safeAreaInsetsProp","layout","userSelectMode","props","hasPointer","sizeX","sizeY","useAdaptivity","tokensClassName","useTokensClassName","useObjectMemo","isKeyboardInputActiveRef","useKeyboardInputTracker","appRootRef","React","useRef","portalRootRef","useIsomorphicLayoutEffect","setupPortalRoot","portalByProp","extractPortalRootByProp","current","cleanup","documentBody","getDocumentBody","portal","ownerDocument","createElement","appendChild","removeChild","setupContainers","parentElement","getParentElement","documentElement","baseClassNames","stylesClassNames","getClassNamesByMode","classList","add","unsetSafeAreaInsets","setSafeAreaInsets","remove","style","setProperty","removeProperty","ScrollController","useMemo","ElementScrollController","GlobalScrollController","contextValue","appRoot","embedded","keyboardInput","content","AppRootContext","Provider","value","elRef","isWebView","useConfigProvider","userSelectModeClassName","getUserSelectModeClassName","div","ref","classNames"],"mappings":"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"}

package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAAE,KAAK,gBAAgB,EAA2B,MAAM,UAAU,CAAC;~~AAc1E~~,eAAO,MAAM,YAAY,4LAiBtB,gBAAgB,KAAG,KAAK,CAAC,~~SAsV3B~~,CAAC"}
1	+ {"version":3,"file":"CarouselBase.d.ts","sourceRoot":"","sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,EAAE,KAAK,gBAAgB,EAA2B,MAAM,UAAU,CAAC;AAmB1E,eAAO,MAAM,YAAY,4LAiBtB,gBAAgB,KAAG,KAAK,CAAC,SAgW3B,CAAC"}

package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.js CHANGED Viewed

@@ -220,11 +220,20 @@ const CarouselBase = (_param)=>{
         align,
         slideWidth
     ]);
+    const calculateMinDeltaXToSlide = ()=>{
+        return slidesManager.current.slides[slideIndex].width * _constants.SLIDE_THRESHOLD;
+    };
     const slideLeft = (event)=>{
+        if (slideIndex > 0) {
+            shiftXCurrentRef.current += calculateMinDeltaXToSlide();
+        }
         onChange === null || onChange === void 0 ? void 0 : onChange((slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length);
         onPrevClick === null || onPrevClick === void 0 ? void 0 : onPrevClick(event);
     };
     const slideRight = (event)=>{
+        if (slideIndex < slidesManager.current.slides.length - 1) {
+            shiftXCurrentRef.current -= calculateMinDeltaXToSlide();
+        }
         onChange === null || onChange === void 0 ? void 0 : onChange((slideIndex + 1) % slidesManager.current.slides.length);
         onNextClick === null || onNextClick === void 0 ? void 0 : onNextClick(event);
     };

package/dist/cjs/components/BaseGallery/CarouselBase/CarouselBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../../hooks/useGlobalEventListener';\nimport { useMutationObserver } from '../../../hooks/useMutationObserver';\nimport { useDOM } from '../../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../../lib/warnOnce';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ScrollArrow } from '../../ScrollArrow/ScrollArrow';\nimport { type CustomTouchEvent, Touch } from '../../Touch/Touch';\nimport { type BaseGalleryProps, type GallerySlidesState } from '../types';\nimport { ANIMATION_DURATION, CONTROL_ELEMENTS_STATE, SLIDES_MANAGER_STATE } from './constants';\nimport { calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport type { ControlElementsState, SlidesManagerState } from './types';\nimport styles from '../BaseGallery.module.css';\n\nconst stylesBullets = {\n dark: styles['BaseGallery__bullets--dark'],\n light: styles['BaseGallery__bullets--light'],\n};\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize = 'l',\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement \| null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> \| null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const { window } = useDOM();\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n\n if (layerRef.current) {\n layerRef.current.style.transform = `translate3d(${shiftX}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n if (shiftX > snaps[0]) {\n shiftXCurrentRef.current = -contentSize + snaps[0];\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n if (shiftX <= -lastPoint) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current \|\| !viewportRef.current) {\n return;\n }\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i] \|\| { offsetLeft: 0, offsetWidth: 0 };\n return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n }) \|\| [];\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development') {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.\"',\n );\n }\n }\n if (align === 'center') {\n const firstSlideShift = (containerWidth - localSlides[0].width) / 2;\n localSlides = localSlides.map((item) => {\n return {\n width: item.width,\n coordX: item.coordX - firstSlideShift,\n };\n });\n }\n\n slidesManager.current = {\n ...slidesManager.current,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible: layerWidth <= containerWidth,\n };\n\n const snaps = localSlides.map((_, index) =>\n calculateIndent(index, slidesManager.current, isCenterWithCustomWidth),\n );\n\n let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += snaps[0];\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n\n setControlElementsState({\n canSlideLeft: !slidesManager.current.isFullyVisible,\n canSlideRight: !slidesManager.current.isFullyVisible,\n isDraggable: !(dragDisabled \|\| slidesManager.current.isFullyVisible),\n });\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n\n useGlobalEventListener(window, 'resize', onResize);\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n /*\n Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n /\n if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n const distance =\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /*\n Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\"\n /\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - slides[slides.length - 1].width;\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - slides[slides.length - 1].width;\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n transformCssStyles(startPoint + progress slides[slides.length - 1].width);\n })();\n });\n });\n /*\n Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n /\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n },\n [slideIndex],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth]);\n\n const slideLeft = (event: React.MouseEvent) => {\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex(\n slidesManager.current.slides,\n slideIndex,\n shiftXCurrentRef.current,\n shiftXDeltaRef.current,\n );\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement \| null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { canSlideLeft, canSlideRight, isDraggable } = controlElementsState;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['BaseGallery'],\n slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n isDraggable && styles['BaseGallery--draggable'],\n )}\n getRootRef={rootRef}\n >\n <Touch\n className={styles['BaseGallery__viewport']}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n getRootRef={viewportRef}\n noSlideClick\n >\n <div className={styles['BaseGallery__layer']} ref={layerRef}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n className={styles['BaseGallery__slide']}\n key={`slide-${i}`}\n ref={(el) => setSlideRef(el, i)}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n\n {bullets && (\n <div\n aria-hidden\n className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n >\n {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n <div\n className={classNames(\n styles['BaseGallery__bullet'],\n index === slideIndex && styles['BaseGallery__bullet--active'],\n )}\n key={index}\n />\n ))}\n </div>\n )}\n\n {showArrows && hasPointer && canSlideLeft && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"left\"\n onClick={slideLeft}\n size={arrowSize}\n />\n )}\n {showArrows && hasPointer && canSlideRight && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"right\"\n onClick={slideRight}\n size={arrowSize}\n />\n )}\n </RootComponent>\n );\n};\n"],"names":["CarouselBase","stylesBullets","dark","light","warn","warnOnce","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","React","useRef","slidesManager","SLIDES_MANAGER_STATE","rootRef","useExternRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","useSlideAnimation","controlElementsState","setControlElementsState","useState","CONTROL_ELEMENTS_STATE","window","useDOM","hasPointer","useAdaptivityHasPointer","isCenterWithCustomWidth","transformCssStyles","shiftX","animation","current","loopPoints","forEach","loopPoint","target","index","slide","style","transform","transition","ANIMATION_DURATION","requestTransform","snaps","contentSize","slides","cancelAnimationFrame","requestAnimationFrame","lastPoint","length","width","coordX","Math","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","containerWidth","viewportOffsetWidth","layerWidth","reduce","val","process","env","NODE_ENV","remainingWidth","firstSlideShift","item","isFullyVisible","_","calculateIndent","getLoopPoints","canSlideLeft","canSlideRight","isDraggable","onResize","useGlobalEventListener","useIsomorphicLayoutEffect","performSlideChange","indent","startPoint","distance","progress","direction","useMutationObserver","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","getTargetIndex","initialShiftX","setSlideRef","slideRef","RootComponent","baseClassName","classNames","Touch","className","onStartX","noSlideClick","div","ref","el","aria-hidden","ScrollArrow","onClick","size"],"mappings":"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"}
1	+ {"version":3,"sources":["../../../../../src/components/BaseGallery/CarouselBase/CarouselBase.tsx"],"sourcesContent":["import * as React from 'react';\nimport { classNames } from '@vkontakte/vkjs';\nimport { useAdaptivityHasPointer } from '../../../hooks/useAdaptivityHasPointer';\nimport { useExternRef } from '../../../hooks/useExternRef';\nimport { useGlobalEventListener } from '../../../hooks/useGlobalEventListener';\nimport { useMutationObserver } from '../../../hooks/useMutationObserver';\nimport { useDOM } from '../../../lib/dom';\nimport { useIsomorphicLayoutEffect } from '../../../lib/useIsomorphicLayoutEffect';\nimport { warnOnce } from '../../../lib/warnOnce';\nimport { RootComponent } from '../../RootComponent/RootComponent';\nimport { ScrollArrow } from '../../ScrollArrow/ScrollArrow';\nimport { type CustomTouchEvent, Touch } from '../../Touch/Touch';\nimport { type BaseGalleryProps, type GallerySlidesState } from '../types';\nimport {\n ANIMATION_DURATION,\n CONTROL_ELEMENTS_STATE,\n SLIDE_THRESHOLD,\n SLIDES_MANAGER_STATE,\n} from './constants';\nimport { calculateIndent, getLoopPoints, getTargetIndex } from './helpers';\nimport { useSlideAnimation } from './hooks';\nimport type { ControlElementsState, SlidesManagerState } from './types';\nimport styles from '../BaseGallery.module.css';\n\nconst stylesBullets = {\n dark: styles['BaseGallery__bullets--dark'],\n light: styles['BaseGallery__bullets--light'],\n};\n\nconst warn = warnOnce('Gallery');\n\nexport const CarouselBase = ({\n bullets = false,\n getRootRef,\n children,\n slideWidth = '100%',\n slideIndex = 0,\n dragDisabled = false,\n onDragStart,\n onDragEnd,\n onChange,\n onPrevClick,\n onNextClick,\n align = 'left',\n showArrows,\n getRef,\n arrowSize = 'l',\n ...restProps\n}: BaseGalleryProps): React.ReactNode => {\n const slidesStore = React.useRef<Record<string, HTMLDivElement \| null>>({});\n const slidesManager = React.useRef<SlidesManagerState>(SLIDES_MANAGER_STATE);\n\n const rootRef = useExternRef(getRootRef);\n const viewportRef = useExternRef(getRef);\n const layerRef = React.useRef<HTMLDivElement>(null);\n const animationFrameRef = React.useRef<ReturnType<typeof requestAnimationFrame> \| null>(null);\n const shiftXCurrentRef = React.useRef<number>(0);\n const shiftXDeltaRef = React.useRef<number>(0);\n const initialized = React.useRef<boolean>(false);\n const { addToAnimationQueue, getAnimateFunction, startAnimation } = useSlideAnimation();\n\n const [controlElementsState, setControlElementsState] =\n React.useState<ControlElementsState>(CONTROL_ELEMENTS_STATE);\n\n const { window } = useDOM();\n const hasPointer = useAdaptivityHasPointer();\n\n const isCenterWithCustomWidth = slideWidth === 'custom' && align === 'center';\n\n const transformCssStyles = (shiftX: number, animation = false) => {\n slidesManager.current.loopPoints.forEach((loopPoint) => {\n const { target, index } = loopPoint;\n const slide = slidesStore.current[index];\n if (slide) {\n slide.style.transform = `translate3d(${target(shiftX)}px, 0, 0)`;\n }\n });\n\n if (layerRef.current) {\n layerRef.current.style.transform = `translate3d(${shiftX}px, 0, 0)`;\n layerRef.current.style.transition = animation\n ? `transform ${ANIMATION_DURATION}ms cubic-bezier(.1, 0, .25, 1)`\n : '';\n }\n };\n\n const requestTransform = (shiftX: number, animation = false) => {\n const { snaps, contentSize, slides } = slidesManager.current;\n\n if (animationFrameRef.current !== null) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n animationFrameRef.current = requestAnimationFrame(() => {\n if (shiftX > snaps[0]) {\n shiftXCurrentRef.current = -contentSize + snaps[0];\n shiftX = shiftXCurrentRef.current + shiftXDeltaRef.current;\n }\n const lastPoint = slides[slides.length - 1].width + slides[slides.length - 1].coordX;\n\n if (shiftX <= -lastPoint) {\n shiftXCurrentRef.current = Math.abs(shiftXDeltaRef.current) + snaps[0];\n }\n transformCssStyles(shiftX, animation);\n });\n };\n\n const initializeSlides = () => {\n if (!rootRef.current \|\| !viewportRef.current) {\n return;\n }\n let localSlides =\n React.Children.map(children, (_item, i): GallerySlidesState => {\n const elem = slidesStore.current[i] \|\| { offsetLeft: 0, offsetWidth: 0 };\n return { coordX: elem.offsetLeft, width: elem.offsetWidth };\n }) \|\| [];\n\n const containerWidth = rootRef.current.offsetWidth;\n const viewportOffsetWidth = viewportRef.current.offsetWidth;\n const layerWidth = localSlides.reduce((val, slide) => slide.width + val, 0);\n\n if (process.env.NODE_ENV === 'development') {\n let remainingWidth = containerWidth;\n let slideIndex = 0;\n\n while (remainingWidth > 0 && slideIndex < localSlides.length) {\n remainingWidth -= localSlides[slideIndex].width;\n slideIndex++;\n }\n if (remainingWidth <= 0 && slideIndex === localSlides.length) {\n warn(\n 'Ширины слайдов недостаточно для корректной работы свойства \"looped\". Пожалуйста, сделайте её больше.\"',\n );\n }\n }\n if (align === 'center') {\n const firstSlideShift = (containerWidth - localSlides[0].width) / 2;\n localSlides = localSlides.map((item) => {\n return {\n width: item.width,\n coordX: item.coordX - firstSlideShift,\n };\n });\n }\n\n slidesManager.current = {\n ...slidesManager.current,\n viewportOffsetWidth,\n slides: localSlides,\n isFullyVisible: layerWidth <= containerWidth,\n };\n\n const snaps = localSlides.map((_, index) =>\n calculateIndent(index, slidesManager.current, isCenterWithCustomWidth),\n );\n\n let contentSize = -snaps[snaps.length - 1] + localSlides[localSlides.length - 1].width;\n if (align === 'center') {\n contentSize += snaps[0];\n }\n\n slidesManager.current.snaps = snaps;\n slidesManager.current.contentSize = contentSize;\n slidesManager.current.loopPoints = getLoopPoints(slidesManager.current, containerWidth);\n\n setControlElementsState({\n canSlideLeft: !slidesManager.current.isFullyVisible,\n canSlideRight: !slidesManager.current.isFullyVisible,\n isDraggable: !(dragDisabled \|\| slidesManager.current.isFullyVisible),\n });\n\n shiftXCurrentRef.current = snaps[slideIndex];\n initialized.current = true;\n\n requestTransform(shiftXCurrentRef.current);\n };\n\n const onResize = () => {\n if (initialized.current) {\n initializeSlides();\n }\n };\n\n useGlobalEventListener(window, 'resize', onResize);\n\n useIsomorphicLayoutEffect(\n function performSlideChange() {\n if (!initialized.current) {\n return;\n }\n const { snaps, slides } = slidesManager.current;\n const indent = snaps[slideIndex];\n let startPoint = shiftXCurrentRef.current;\n\n /*\n Переключаемся с последнего элемента на первый\n * Для корректной анимации мы прокручиваем последний слайд на всю длину (shiftX) \"вперед\"\n * В конце анимации при отрисовке следующего кадра задаем всем слайдам начальные значения\n /\n if (indent === snaps[0] && shiftXCurrentRef.current <= snaps[snaps.length - 1]) {\n const distance =\n Math.abs(snaps[snaps.length - 1]) + slides[slides.length - 1].width + startPoint;\n\n addToAnimationQueue(\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress distance * -1;\n\n transformCssStyles(shiftX);\n\n if (shiftX <= snaps[snaps.length - 1] - slides[slides.length - 1].width) {\n requestAnimationFrame(() => {\n shiftXCurrentRef.current = indent;\n transformCssStyles(snaps[0]);\n });\n }\n }),\n );\n /*\n Переключаемся с первого слайда на последний\n * Для корректной анимации сначала задаем первым видимым слайдам смещение\n * В следующем кадре начинаем анимация прокрутки \"назад\"\n /\n } else if (indent === snaps[snaps.length - 1] && shiftXCurrentRef.current === snaps[0]) {\n startPoint = indent - slides[slides.length - 1].width;\n\n addToAnimationQueue(() => {\n requestAnimationFrame(() => {\n const shiftX = indent - slides[slides.length - 1].width;\n transformCssStyles(shiftX);\n\n getAnimateFunction((progress) => {\n transformCssStyles(startPoint + progress slides[slides.length - 1].width);\n })();\n });\n });\n /*\n Если не обработаны `corner`-кейсы выше, то просто проигрываем анимацию смещения\n /\n } else {\n addToAnimationQueue(() => {\n const distance = Math.abs(indent - startPoint);\n let direction = startPoint <= indent ? 1 : -1;\n\n getAnimateFunction((progress) => {\n const shiftX = startPoint + progress distance * direction;\n transformCssStyles(shiftX);\n })();\n });\n }\n\n startAnimation();\n\n shiftXCurrentRef.current = indent;\n },\n [slideIndex],\n );\n\n useMutationObserver(layerRef, initializeSlides);\n\n useIsomorphicLayoutEffect(initializeSlides, [align, slideWidth]);\n\n const calculateMinDeltaXToSlide = () => {\n return slidesManager.current.slides[slideIndex].width * SLIDE_THRESHOLD;\n };\n\n const slideLeft = (event: React.MouseEvent) => {\n if (slideIndex > 0) {\n shiftXCurrentRef.current += calculateMinDeltaXToSlide();\n }\n onChange?.(\n (slideIndex - 1 + slidesManager.current.slides.length) % slidesManager.current.slides.length,\n );\n onPrevClick?.(event);\n };\n\n const slideRight = (event: React.MouseEvent) => {\n if (slideIndex < slidesManager.current.slides.length - 1) {\n shiftXCurrentRef.current -= calculateMinDeltaXToSlide();\n }\n onChange?.((slideIndex + 1) % slidesManager.current.slides.length);\n onNextClick?.(event);\n };\n\n const onStart = (e: CustomTouchEvent) => {\n e.originalEvent.stopPropagation();\n if (controlElementsState.isDraggable) {\n onDragStart?.(e);\n shiftXCurrentRef.current = slidesManager.current.snaps[slideIndex];\n shiftXDeltaRef.current = 0;\n }\n };\n\n const onMoveX = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n e.originalEvent.preventDefault();\n\n if (e.isSlideX) {\n if (shiftXDeltaRef.current !== e.shiftX) {\n shiftXDeltaRef.current = e.shiftX;\n requestTransform(shiftXCurrentRef.current + shiftXDeltaRef.current);\n }\n }\n }\n };\n\n const onEnd = (e: CustomTouchEvent) => {\n if (controlElementsState.isDraggable) {\n let targetIndex = slideIndex;\n if (e.isSlide) {\n targetIndex = getTargetIndex(\n slidesManager.current.slides,\n slideIndex,\n shiftXCurrentRef.current,\n shiftXDeltaRef.current,\n );\n }\n onDragEnd?.(e, targetIndex);\n\n if (targetIndex !== slideIndex) {\n shiftXCurrentRef.current = shiftXCurrentRef.current + shiftXDeltaRef.current;\n onChange?.(targetIndex);\n } else {\n const initialShiftX = slidesManager.current.snaps[targetIndex];\n requestTransform(initialShiftX, true);\n }\n }\n };\n\n const setSlideRef = (slideRef: HTMLDivElement \| null, slideIndex: number) => {\n slidesStore.current[slideIndex] = slideRef;\n };\n\n const { canSlideLeft, canSlideRight, isDraggable } = controlElementsState;\n\n return (\n <RootComponent\n {...restProps}\n baseClassName={classNames(\n styles['BaseGallery'],\n slideWidth === 'custom' && styles['BaseGallery--custom-width'],\n isDraggable && styles['BaseGallery--draggable'],\n )}\n getRootRef={rootRef}\n >\n <Touch\n className={styles['BaseGallery__viewport']}\n onStartX={onStart}\n onMoveX={onMoveX}\n onEnd={onEnd}\n style={{ width: slideWidth === 'custom' ? '100%' : slideWidth }}\n getRootRef={viewportRef}\n noSlideClick\n >\n <div className={styles['BaseGallery__layer']} ref={layerRef}>\n {React.Children.map(children, (item: React.ReactNode, i: number) => (\n <div\n className={styles['BaseGallery__slide']}\n key={`slide-${i}`}\n ref={(el) => setSlideRef(el, i)}\n >\n {item}\n </div>\n ))}\n </div>\n </Touch>\n\n {bullets && (\n <div\n aria-hidden\n className={classNames(styles['BaseGallery__bullets'], stylesBullets[bullets])}\n >\n {React.Children.map(children, (_item: React.ReactNode, index: number) => (\n <div\n className={classNames(\n styles['BaseGallery__bullet'],\n index === slideIndex && styles['BaseGallery__bullet--active'],\n )}\n key={index}\n />\n ))}\n </div>\n )}\n\n {showArrows && hasPointer && canSlideLeft && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"left\"\n onClick={slideLeft}\n size={arrowSize}\n />\n )}\n {showArrows && hasPointer && canSlideRight && (\n <ScrollArrow\n className={styles['BaseGallery__arrow']}\n direction=\"right\"\n onClick={slideRight}\n size={arrowSize}\n />\n )}\n </RootComponent>\n );\n};\n"],"names":["CarouselBase","stylesBullets","dark","light","warn","warnOnce","bullets","getRootRef","children","slideWidth","slideIndex","dragDisabled","onDragStart","onDragEnd","onChange","onPrevClick","onNextClick","align","showArrows","getRef","arrowSize","restProps","slidesStore","React","useRef","slidesManager","SLIDES_MANAGER_STATE","rootRef","useExternRef","viewportRef","layerRef","animationFrameRef","shiftXCurrentRef","shiftXDeltaRef","initialized","addToAnimationQueue","getAnimateFunction","startAnimation","useSlideAnimation","controlElementsState","setControlElementsState","useState","CONTROL_ELEMENTS_STATE","window","useDOM","hasPointer","useAdaptivityHasPointer","isCenterWithCustomWidth","transformCssStyles","shiftX","animation","current","loopPoints","forEach","loopPoint","target","index","slide","style","transform","transition","ANIMATION_DURATION","requestTransform","snaps","contentSize","slides","cancelAnimationFrame","requestAnimationFrame","lastPoint","length","width","coordX","Math","abs","initializeSlides","localSlides","Children","map","_item","i","elem","offsetLeft","offsetWidth","containerWidth","viewportOffsetWidth","layerWidth","reduce","val","process","env","NODE_ENV","remainingWidth","firstSlideShift","item","isFullyVisible","_","calculateIndent","getLoopPoints","canSlideLeft","canSlideRight","isDraggable","onResize","useGlobalEventListener","useIsomorphicLayoutEffect","performSlideChange","indent","startPoint","distance","progress","direction","useMutationObserver","calculateMinDeltaXToSlide","SLIDE_THRESHOLD","slideLeft","event","slideRight","onStart","e","originalEvent","stopPropagation","onMoveX","preventDefault","isSlideX","onEnd","targetIndex","isSlide","getTargetIndex","initialShiftX","setSlideRef","slideRef","RootComponent","baseClassName","classNames","Touch","className","onStartX","noSlideClick","div","ref","el","aria-hidden","ScrollArrow","onClick","size"],"mappings":"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"}

package/dist/cjs/components/CustomSelect/CustomSelect.d.ts CHANGED Viewed

@@ -2,13 +2,23 @@ import * as React from 'react';
 import { type FilterFn } from '../../lib/select';
 import type { TrackerOptionsProps } from '../CustomScrollView/useTrackerVisibility';
 import { type CustomSelectDropdownProps } from '../CustomSelectDropdown/CustomSelectDropdown';
+import { type CustomSelectOptionProps } from '../CustomSelectOption/CustomSelectOption';
 import type { FormFieldProps } from '../FormField/FormField';
 import type { NativeSelectProps } from '../NativeSelect/NativeSelect';
 import type { SelectType } from '../Select/Select';
 import { type CustomSelectClearButtonProps } from './CustomSelectClearButton';
 import { type CustomSelectInputProps } from './CustomSelectInput';
-import type { CustomSelectOptionInterface, CustomSelectRenderOption } from './types';
-export type { CustomSelectClearButtonProps, CustomSelectOptionInterface, CustomSelectRenderOption };
+type SelectValue = React.SelectHTMLAttributes<HTMLSelectElement>['value'];
+export interface CustomSelectOptionInterface {
+    value: SelectValue;
+    label: React.ReactElement | string;
+    disabled?: boolean;
+    [index: string]: any;
+}
+export interface CustomSelectRenderOption<T extends CustomSelectOptionInterface> extends CustomSelectOptionProps {
+    option: T;
+}
+export type { CustomSelectClearButtonProps };
 export interface SelectProps<OptionInterfaceT extends CustomSelectOptionInterface = CustomSelectOptionInterface> extends NativeSelectProps, Omit<FormFieldProps, 'maxHeight'>, TrackerOptionsProps, Pick<CustomSelectDropdownProps, 'overscrollBehavior' | 'autoHideScrollbar' | 'autoHideScrollbarDelay'>, Pick<CustomSelectInputProps, 'minLength' | 'maxLength' | 'pattern' | 'readOnly'> {
     /**
      * ref на внутрений компонент input

package/dist/cjs/components/CustomSelect/CustomSelect.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/CustomSelect/CustomSelect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;~~AAM~~/B,OAAO,EAAmB,KAAK,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAGlE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0CAA0C,CAAC;AACpF,OAAO,EAEL,KAAK,yBAAyB,EAC/B,MAAM,8CAA8C,CAAC;~~AAEtD~~,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;~~AAEnD~~,OAAO,EAEL,KAAK,4BAA4B,EAClC,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAqB,KAAK,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;~~AAQrF~~,~~OAAO~~,KAAK,~~EAAE~~,2BAA2B,EAAE,~~wBAAwB~~,EAAE,MAAM,~~SAAS,~~CAAC;~~AAiCrF~~,~~YAAY~~,EAAE,~~4BAA4B~~,EAAE,2BAA2B,EAAE,~~wBAAwB~~,EAAE,CAAC;~~AAEpG~~,MAAM,WAAW,WAAW,CAC1B,gBAAgB,SAAS,2BAA2B,GAAG,2BAA2B,CAClF,SAAQ,iBAAiB,EACvB,IAAI,CAAC,cAAc,EAAE,WAAW,CAAC,EACjC,mBAAmB,EACnB,IAAI,CACF,yBAAyB,EACzB,oBAAoB,GAAG,mBAAmB,GAAG,wBAAwB,CACtE,EACD,IAAI,CAAC,sBAAsB,EAAE,WAAW,GAAG,WAAW,GAAG,SAAS,GAAG,UAAU,CAAC;IAClF;;OAEG;IACH,iBAAiB,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAChD;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACjE,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAC9C,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAClC;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,CAAC,gBAAgB,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IACtF;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,EAChB,sBAAsB,GACvB,EAAE;QACD,sBAAsB,EAAE,KAAK,CAAC,SAAS,CAAC;KACzC,KAAK,KAAK,CAAC,SAAS,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;OAEG;IACH,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,4BAA4B,CAAC,CAAC;IAChE;;OAEG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;OAEG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC;;OAEG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAID;;GAEG;AACH,wBAAgB,YAAY,CAAC,gBAAgB,SAAS,2BAA2B,EAC/E,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,GACnC,KAAK,CAAC,SAAS,~~CAosBjB~~"}
1	+ {"version":3,"file":"CustomSelect.d.ts","sourceRoot":"","sources":["../../../../src/components/CustomSelect/CustomSelect.tsx"],"names":[],"mappings":"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"}

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

@@ -17,35 +17,73 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _vkjs = require("@vkontakte/vkjs");
 const _useAdaptivity = require("../../hooks/useAdaptivity");
 const _useExternRef = require("../../hooks/useExternRef");
+const _useFocusWithin = require("../../hooks/useFocusWithin");
 const _dom = require("../../lib/dom");
 const _select = require("../../lib/select");
 const _useIsomorphicLayoutEffect = require("../../lib/useIsomorphicLayoutEffect");
 const _warnOnce = require("../../lib/warnOnce");
 const _CustomSelectDropdown = require("../CustomSelectDropdown/CustomSelectDropdown");
+const _CustomSelectOption = require("../CustomSelectOption/CustomSelectOption");
 const _DropdownIcon = require("../DropdownIcon/DropdownIcon");
 const _Footnote = require("../Typography/Footnote/Footnote");
+const _VisuallyHidden = require("../VisuallyHidden/VisuallyHidden");
 const _CustomSelectClearButton = require("./CustomSelectClearButton");
 const _CustomSelectInput = require("./CustomSelectInput");
-const _helpers = require("./helpers");
 const sizeYClassNames = {
     none: "vkuiCustomSelect--sizeY-none",
     compact: "vkuiCustomSelect--sizeY-compact"
 };
+const findIndexAfter = (options = [], startIndex = -1)=>{
+    if (startIndex >= options.length - 1) {
+        return -1;
+    }
+    return options.findIndex((option, i)=>i > startIndex && !option.disabled);
+};
+const findIndexBefore = (options = [], endIndex = options.length)=>{
+    let result = -1;
+    if (endIndex <= 0) {
+        return result;
+    }
+    for(let i = endIndex - 1; i >= 0; i--){
+        let option = options[i];
+        if (!option.disabled) {
+            result = i;
+            break;
+        }
+    }
+    return result;
+};
 const warn = (0, _warnOnce.warnOnce)('CustomSelect');
 const checkOptionsValueType = (options)=>{
     if (new Set(options.map((item)=>typeof item.value)).size > 1) {
         warn('Некоторые значения ваших опций имеют разные типы. onChange всегда возвращает строковый тип.', 'error');
     }
 };
+function defaultRenderOptionFn(_param) {
+    var { option } = _param, props = _object_without_properties._(_param, [
+        "option"
+    ]);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_CustomSelectOption.CustomSelectOption, _object_spread._({}, props));
+}
 const handleOptionDown = (e)=>{
     e.preventDefault();
 };
+function findSelectedIndex(options = [], value, withClear) {
+    if (withClear && value === '') {
+        return -1;
+    }
+    var _options_findIndex;
+    return (_options_findIndex = options.findIndex((item)=>{
+        value = typeof item.value === 'number' ? Number(value) : value;
+        return item.value === value;
+    })) !== null && _options_findIndex !== void 0 ? _options_findIndex : -1;
+}
 const filter = (options, inputValue, filterFn)=>{
     return typeof filterFn === 'function' ? options.filter((option)=>filterFn(inputValue, option)) : options;
 };
 function CustomSelect(props) {
     const [opened, setOpened] = _react.useState(false);
-    const { before, name, className, getRef, getRootRef, popupDirection = 'bottom', style, onChange, children, 'onInputChange': onInputChangeProp, renderDropdown, onOpen, onClose, fetching, forceDropdownPortal, selectType = 'default', autoHideScrollbar, autoHideScrollbarDelay, searchable = false, 'renderOption': renderOptionProp = _helpers.defaultRenderOptionFn, 'options': optionsProp, emptyText = 'Ничего не найдено', filterFn = _select.defaultFilterFn, 'icon': iconProp, ClearButton = _CustomSelectClearButton.CustomSelectClearButton, allowClearButton = false, dropdownOffsetDistance = 0, dropdownAutoWidth = false, noMaxHeight = false, 'aria-labelledby': ariaLabelledBy, clearButtonTestId, nativeSelectTestId, defaultValue, required, getSelectInputRef, overscrollBehavior } = props, restProps = _object_without_properties._(props, [
+    const { before, name, className, getRef, getRootRef, popupDirection = 'bottom', style, onChange, children, 'onInputChange': onInputChangeProp, renderDropdown, onOpen, onClose, fetching, forceDropdownPortal, selectType = 'default', autoHideScrollbar, autoHideScrollbarDelay, searchable = false, 'renderOption': renderOptionProp = defaultRenderOptionFn, 'options': optionsProp, emptyText = 'Ничего не найдено', filterFn = _select.defaultFilterFn, 'icon': iconProp, ClearButton = _CustomSelectClearButton.CustomSelectClearButton, allowClearButton = false, dropdownOffsetDistance = 0, dropdownAutoWidth = false, noMaxHeight = false, 'aria-labelledby': ariaLabelledBy, clearButtonTestId, nativeSelectTestId, defaultValue, required, getSelectInputRef, overscrollBehavior } = props, restProps = _object_without_properties._(props, [
         "before",
         "name",
         "className",
@@ -92,18 +130,17 @@ function CustomSelect(props) {
     const scrollBoxRef = _react.useRef(null);
     const selectElRef = (0, _useExternRef.useExternRef)(getRef);
     const optionsWrapperRef = _react.useRef(null);
-    const selectInputRef = (0, _useExternRef.useExternRef)(getSelectInputRef);
     const [focusedOptionIndex, setFocusedOptionIndex] = _react.useState(-1);
     const [isControlledOutside, setIsControlledOutside] = _react.useState(props.value !== undefined);
+    const [inputValue, setInputValue] = _react.useState('');
     const [nativeSelectValue, setNativeSelectValue] = _react.useState(()=>{
         var _props_value, _ref;
         return (_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : defaultValue) !== null && _ref !== void 0 ? _ref : allowClearButton ? '' : undefined;
     });
-    const [inputValue, setInputValue] = _react.useState(()=>(0, _helpers.calculateInputValueFromOptions)(optionsProp, nativeSelectValue));
     const [popperPlacement, setPopperPlacement] = _react.useState(popupDirection);
     const [options, setOptions] = _react.useState(optionsProp);
     var _props_value;
-    const [selectedOptionIndex, setSelectedOptionIndex] = _react.useState((0, _helpers.findSelectedIndex)(optionsProp, (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : defaultValue, allowClearButton));
+    const [selectedOptionIndex, setSelectedOptionIndex] = _react.useState(findSelectedIndex(optionsProp, (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : defaultValue, allowClearButton));
     _react.useEffect(()=>{
         setIsControlledOutside(props.value !== undefined);
         setNativeSelectValue((nativeSelectValue)=>{
@@ -217,6 +254,7 @@ function CustomSelect(props) {
    *  Сброс происходит в одном из эффекте `updateOptionsAndSelectedOptionIndex()`.
    */ const close = _react.useCallback(()=>{
         resetKeyboardInput();
+        setInputValue('');
         setOpened(false);
         resetFocusedOption();
         onClose === null || onClose === void 0 ? void 0 : onClose();
@@ -227,8 +265,8 @@ function CustomSelect(props) {
     ]);
     const selectOption = _react.useCallback((index)=>{
         const item = options[index];
-        close();
         setNativeSelectValue(item === null || item === void 0 ? void 0 : item.value);
+        close();
         const shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync = isControlledOutside && props.value !== nativeSelectValue && nativeSelectValue === (item === null || item === void 0 ? void 0 : item.value);
         if (shouldTriggerOnChangeWhenControlledAndInnerValueIsOutOfSync) {
             var _selectElRef_current;
@@ -272,23 +310,18 @@ function CustomSelect(props) {
             bubbles: true
         });
         (_selectElRef_current = selectElRef.current) === null || _selectElRef_current === void 0 ? void 0 : _selectElRef_current.dispatchEvent(event);
-        setInputValue((0, _helpers.calculateInputValueFromOptions)(optionsProp, nativeSelectValue));
     }, [
         close,
-        selectElRef,
-        optionsProp,
-        nativeSelectValue
+        selectElRef
     ]);
     const onFocus = _react.useCallback(()=>{
-        var _selectElRef_current, _selectInputRef_current;
+        var _selectElRef_current;
         const event = new Event('focusin', {
             bubbles: true
         });
         (_selectElRef_current = selectElRef.current) === null || _selectElRef_current === void 0 ? void 0 : _selectElRef_current.dispatchEvent(event);
-        (_selectInputRef_current = selectInputRef.current) === null || _selectInputRef_current === void 0 ? void 0 : _selectInputRef_current.select();
     }, [
-        selectElRef,
-        selectInputRef
+        selectElRef
     ]);
     const onClick = _react.useCallback(()=>{
         if (opened) {
@@ -307,11 +340,11 @@ function CustomSelect(props) {
     const focusOption = _react.useCallback((type)=>{
         let index = focusedOptionIndex;
         if (type === 'next') {
-            const nextIndex = (0, _helpers.findIndexAfter)(options, index);
-            index = nextIndex === -1 ? (0, _helpers.findIndexAfter)(options) : nextIndex; // Следующий за index или первый валидный до index
+            const nextIndex = findIndexAfter(options, index);
+            index = nextIndex === -1 ? findIndexAfter(options) : nextIndex; // Следующий за index или первый валидный до index
         } else if (type === 'prev') {
-            const beforeIndex = (0, _helpers.findIndexBefore)(options, index);
-            index = beforeIndex === -1 ? (0, _helpers.findIndexBefore)(options) : beforeIndex; // Предшествующий index или последний валидный после index
+            const beforeIndex = findIndexBefore(options, index);
+            index = beforeIndex === -1 ? findIndexBefore(options) : beforeIndex; // Предшествующий index или последний валидный после index
         }
         focusOptionByIndex(index);
     }, [
@@ -319,41 +352,24 @@ function CustomSelect(props) {
         focusedOptionIndex,
         options
     ]);
-    _react.useEffect(function filterOptions() {
+    _react.useEffect(function updateOptionsAndSelectedOptionIndex() {
+        var _props_value, _ref;
+        const value = (_ref = (_props_value = props.value) !== null && _props_value !== void 0 ? _props_value : nativeSelectValue) !== null && _ref !== void 0 ? _ref : defaultValue;
         const options = searchable && inputValue !== undefined ? filter(optionsProp, inputValue, filterFn) : optionsProp;
         setOptions(options);
+        setSelectedOptionIndex(findSelectedIndex(options, value, allowClearButton));
     }, [
         filterFn,
         inputValue,
+        nativeSelectValue,
         optionsProp,
-        searchable
-    ]);
-    var _props_value1, _ref;
-    const selectValue = (_ref = (_props_value1 = props.value) !== null && _props_value1 !== void 0 ? _props_value1 : nativeSelectValue) !== null && _ref !== void 0 ? _ref : defaultValue;
-    _react.useEffect(function updateSelectedOptionIndexOnValueChange() {
-        setSelectedOptionIndex((0, _helpers.findSelectedIndex)(options, selectValue, allowClearButton));
-    }, [
-        selectValue,
-        allowClearButton,
-        options
-    ]);
-    const prevSelectValueRef = _react.useRef(selectValue);
-    _react.useEffect(function updateInputValueOnSelectValueChange() {
-        if (prevSelectValueRef.current === selectValue) {
-            return;
-        }
-        setInputValue((0, _helpers.calculateInputValueFromOptions)(optionsProp, selectValue));
-    }, [
-        selectValue,
-        optionsProp
-    ]);
-    _react.useEffect(function updatePrevSelectValue() {
-        prevSelectValueRef.current = selectValue;
-    }, [
-        selectValue
+        defaultValue,
+        props.value,
+        searchable,
+        allowClearButton
     ]);
     const onNativeSelectChange = (e)=>{
-        const newSelectedOptionIndex = (0, _helpers.findSelectedIndex)(options, e.currentTarget.value, allowClearButton);
+        const newSelectedOptionIndex = findSelectedIndex(options, e.currentTarget.value, allowClearButton);
         if (selectedOptionIndex !== newSelectedOptionIndex) {
             if (!isControlledOutside) {
                 setSelectedOptionIndex(newSelectedOptionIndex);
@@ -365,7 +381,7 @@ function CustomSelect(props) {
         onInputChangeProp && onInputChangeProp(e);
         const options = filter(optionsProp, e.target.value, filterFn);
         setOptions(options);
-        setSelectedOptionIndex((0, _helpers.findSelectedIndex)(options, nativeSelectValue, allowClearButton));
+        setSelectedOptionIndex(findSelectedIndex(options, nativeSelectValue, allowClearButton));
         setInputValue(e.target.value);
     }, [
         filterFn,
@@ -515,6 +531,7 @@ function CustomSelect(props) {
         renderDropdown,
         renderOption
     ]);
+    const selectInputRef = (0, _useExternRef.useExternRef)(getSelectInputRef);
     const focusOnInputTimerRef = _react.useRef();
     const focusOnInput = _react.useCallback(()=>{
         clearTimeout(focusOnInputTimerRef.current);
@@ -600,14 +617,11 @@ function CustomSelect(props) {
         selectInputRef
     ]);
     const preventInputBlurWhenClickInsideFocusedSelectArea = (e)=>{
-        var _selectInputRef_current;
         // Так как инпут больше не оборачивается пустым лэйблом, то клик внутри обертки,
         // но вне инпута (например по иконке дропдауна), будет убирать фокус с инпута.
         // Чтобы в такой ситуации отключить blur инпута мы превентим mousedown событие обёртки
         const isInputFocused = document && document.activeElement === selectInputRef.current;
-        const clickTarget = e.target;
-        const inputClicked = (_selectInputRef_current = selectInputRef.current) === null || _selectInputRef_current === void 0 ? void 0 : _selectInputRef_current.contains(clickTarget);
-        if (isInputFocused && !inputClicked) {
+        if (isInputFocused) {
             e.preventDefault();
         }
     };
@@ -616,12 +630,14 @@ function CustomSelect(props) {
     const selectInputAriaProps = {
         'role': 'combobox',
         'aria-controls': popupAriaId,
+        'aria-owns': popupAriaId,
         'aria-expanded': opened,
         'aria-activedescendant': ariaActiveDescendantId && opened ? `${popupAriaId}-${ariaActiveDescendantId}` : undefined,
         'aria-labelledby': ariaLabelledBy,
         'aria-haspopup': 'listbox',
         'aria-autocomplete': 'none'
     };
+    const focusWithin = (0, _useFocusWithin.useFocusWithin)(handleRootRef);
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
         className: (0, _vkjs.classNames)("vkuiCustomSelect", sizeY !== 'regular' && sizeYClassNames[sizeY], className),
         style: style,
@@ -629,6 +645,10 @@ function CustomSelect(props) {
         onClick: passClickAndFocusToInputOnClick,
         onMouseDown: preventInputBlurWhenClickInsideFocusedSelectArea,
         children: [
+            focusWithin && selected && !opened && /*#__PURE__*/ (0, _jsxruntime.jsx)(_VisuallyHidden.VisuallyHidden, {
+                "aria-live": "polite",
+                children: selected.label
+            }),
             /*#__PURE__*/ (0, _jsxruntime.jsx)(_CustomSelectInput.CustomSelectInput, _object_spread_props._(_object_spread._({
                 autoComplete: "off",
                 autoCapitalize: "none",
@@ -639,7 +659,7 @@ function CustomSelect(props) {
                 onFocus: onFocus,
                 onBlur: onBlur,
                 className: openedClassNames,
-                searchable: searchable,
+                readOnly: !searchable,
                 fetching: fetching,
                 value: inputValue,
                 onKeyUp: handleKeyUp,
@@ -649,7 +669,7 @@ function CustomSelect(props) {
                 before: before,
                 after: afterIcons,
                 selectType: selectType,
-                selectedOptionLabel: selected === null || selected === void 0 ? void 0 : selected.label
+                children: selected === null || selected === void 0 ? void 0 : selected.label
             })),
             /*#__PURE__*/ (0, _jsxruntime.jsxs)("select", {
                 ref: selectElRef,