@alfalab/core-components 48.8.0-beta.0 → 48.8.0

package/select/modern/components/arrow/index.css

@@ -41,6 +41,9 @@
     transition: transform 0.15s ease-in-out, opacity 0.2s ease
 } .select__arrow_1ixfi.select__disabled_1ixfi {
         color: var(--select-arrow-disabled-color);
+    } .select__arrow_1ixfi.select__size-40_1ixfi {
+        width: unset;
+        height: unset;
     } .select__open_1ixfi {
     transform: var(--arrow-transform);
 }

package/select/modern/components/arrow/index.js

@@ -2,3 +2,4 @@ export { Arrow } from './Component.js';
 import 'react';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';

package/select/modern/components/base-select/Component.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
 declare const BaseSelect: React.ForwardRefExoticComponent<import("../../typings").BaseSelectProps & import("../../typings").AdditionalMobileProps & import("../../typings").BottomSheetSelectMobileProps & import("../../typings").ModalSelectMobileProps & {
     isBottomSheet?: boolean | undefined;
     view: "desktop" | "mobile";
-    Popover?: React.ForwardRefExoticComponent<import("../../../../popover").PopoverProps<HTMLElement> & React.RefAttributes<HTMLDivElement>> | undefined;
+    Popover?: React.ForwardRefExoticComponent<import("../../../../popover").PopoverProps & React.RefAttributes<HTMLDivElement>> | undefined;
     BottomSheet?: React.ForwardRefExoticComponent<import("../../../../bottom-sheet").BottomSheetProps & React.RefAttributes<HTMLDivElement>> | undefined;
     ModalMobile?: (React.ForwardRefExoticComponent<import("./types/component-types").ModalMobileProps & React.RefAttributes<HTMLDivElement>> & {
         Header: React.FC<import("../../../../modal/shared").ModalHeaderProps>;

package/select/modern/components/base-select/Component.js

@@ -9,11 +9,11 @@ import { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';
 import { defaultAccessor, defaultFilterFn, defaultGroupAccessor, processOptions, isGroup } from '../../utils.js';
 import { NativeSelect } from '../native-select/Component.js';
 import { getListPopoverDesktopProps } from './components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import { s as styles, L as ListPopoverDesktop } from '../../list-popover-desktop-ff5ea655.js';
+import { s as styles, L as ListPopoverDesktop } from '../../list-popover-desktop-6d15956b.js';
 import { getListModalMobileProps } from './components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import { getListBottomSheetMobileProps } from './components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import { ListMobile } from './components/list-mobile/list-mobile.js';
-import { m as mobileStyles } from '../../mobile.module-b50c7468.js';
+import { m as mobileStyles } from '../../mobile.module-13db2bf1.js';
 import './components/list-mobile/list-bottom-sheet-mobile.js';
 import './components/list-mobile/list-modal-mobile.js';
 
@@ -386,7 +386,7 @@ const BaseSelect = forwardRef(
     };
     return (React.createElement("div", { ...(disabled && { 'aria-disabled': true }), "aria-expanded": inputProps['aria-expanded'], "aria-haspopup": 'listbox', role: inputProps.role, className: cn(styles.component, { [styles.block]: block }, className), ref: rootRef, onKeyDown: disabled ? undefined : handleFieldKeyDown, tabIndex: -1, "data-test-id": getDataTestId(dataTestId) },
         nativeSelect && renderNativeSelect(),
-        React.createElement(Field, { selectedMultiple: selectedItems, selected: selectedItems[0], setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, multiple: multiple, open: open, disabled: disabled, size: size, placeholder: placeholder, label: label && React.createElement("span", { ...getLabelProps() }, label), labelView: labelView, Arrow: Arrow && React.createElement(Arrow, { open: open, disabled: disabled }), error: error, hint: hint, valueRenderer: valueRenderer, className: fieldClassName, clear: clear, onClear: handleFieldClear, innerProps: {
+        React.createElement(Field, { selectedMultiple: selectedItems, selected: selectedItems[0], setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, multiple: multiple, open: open, disabled: disabled, size: size, placeholder: placeholder, label: label && React.createElement("span", { ...getLabelProps() }, label), labelView: labelView, Arrow: Arrow && React.createElement(Arrow, { open: open, size: size, disabled: disabled }), error: error, hint: hint, valueRenderer: valueRenderer, className: fieldClassName, clear: clear, onClear: handleFieldClear, innerProps: {
                 onBlur: handleFieldBlur,
                 onFocus: disabled ? undefined : handleFieldFocus,
                 onClick: disabled ? undefined : handleFieldClick,
@@ -400,7 +400,7 @@ const BaseSelect = forwardRef(
                     : undefined,
             }, dataTestId: getDataTestId(dataTestId, 'field'), ...fieldProps }),
         name && !nativeSelect && renderValue(),
-        view === 'desktop' && !nativeSelect && (React.createElement(ListPopoverDesktop, { ...getListPopoverDesktopProps(props), open: open, anchorElement: fieldRef, renderOptionsList: renderOptionsList })),
+        view === 'desktop' && !nativeSelect && (React.createElement(ListPopoverDesktop, { ...getListPopoverDesktopProps(props), open: open, fieldRef: fieldRef, renderOptionsList: renderOptionsList })),
         view === 'mobile' && (React.createElement(ListMobile, { baseProps: isBottomSheet
                 ? getListBottomSheetMobileProps(props)
                 : getListModalMobileProps(props), open: open, menuRef: menuRef, scrollableContainerRef: scrollableContainerRef, flatOptions: flatOptions, renderOptionsList: renderOptionsList, renderSearch: renderSearch, closeMenu: closeMenu, handleEntered: handleEntered }))));

package/select/modern/components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { ComponentProps } from "../../../types/component-types";
 declare const getListPopoverDesktopProps: (props: ComponentProps) => {
-    Popover: import("react").ForwardRefExoticComponent<import("../../../../../../../popover").PopoverProps<HTMLElement> & import("react").RefAttributes<HTMLDivElement>> | undefined;
-    popoverProps: Omit<import("../../../../../../../popover").PopoverProps<HTMLElement>, "className" | "dataTestId" | "anchorElement" | "position" | "preventFlip" | "open" | "zIndex" | "update"> | undefined;
-    popoverPosition: import("@floating-ui/react-dom").Placement;
+    Popover: import("react").ForwardRefExoticComponent<import("../../../../../../../popover").PopoverProps & import("react").RefAttributes<HTMLDivElement>> | undefined;
+    popoverProps: Omit<import("../../../../../../../popover").PopoverProps, "className" | "dataTestId" | "anchorElement" | "position" | "preventFlip" | "open" | "update" | "zIndex"> | undefined;
+    popoverPosition: import("../../../../../../../popover").Position;
     preventFlip: boolean;
     popperClassName: string | undefined;
     updatePopover: import("react").MutableRefObject<(() => void) | undefined> | undefined;

package/select/modern/components/base-select/components/list-desktop/list-popover-desktop.js

@@ -1,3 +1,3 @@
 import 'react';
 import 'classnames';
-export { L as ListPopoverDesktop } from '../../../../list-popover-desktop-ff5ea655.js';
+export { L as ListPopoverDesktop } from '../../../../list-popover-desktop-6d15956b.js';

package/select/modern/components/base-select/components/list-mobile/list-bottom-sheet-mobile.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { getDataTestId } from '../../../../../../shared/modern';
-import { m as mobileStyles } from '../../../../mobile.module-b50c7468.js';
+import { m as mobileStyles } from '../../../../mobile.module-13db2bf1.js';
 
 const ListBottomSheetMobile = (props) => {
     const { BottomSheet, dataTestId, open, label, placeholder, footer, swipeable, showSearch, bottomSheetProps, menuRef, scrollableContainerRef, onScroll, flatOptions, closeMenu, handleEntered, renderSearch, renderOptionsList, } = props;

package/select/modern/components/base-select/components/list-mobile/list-mobile.js

@@ -2,7 +2,7 @@ import React from 'react';
 import { ListBottomSheetMobile } from './list-bottom-sheet-mobile.js';
 import { ListModalMobile } from './list-modal-mobile.js';
 import '../../../../../../shared/modern';
-import '../../../../mobile.module-b50c7468.js';
+import '../../../../mobile.module-13db2bf1.js';
 import 'react-merge-refs';
 import 'classnames';
 

package/select/modern/components/base-select/components/list-mobile/list-modal-mobile.js

@@ -2,7 +2,7 @@ import React from 'react';
 import mergeRefs from 'react-merge-refs';
 import cn from 'classnames';
 import { getDataTestId } from '../../../../../../shared/modern';
-import { m as mobileStyles } from '../../../../mobile.module-b50c7468.js';
+import { m as mobileStyles } from '../../../../mobile.module-13db2bf1.js';
 
 const ListModalMobile = (props) => {
     const { ModalMobile, dataTestId, open, modalProps, modalHeaderProps, modalFooterProps, menuRef, scrollableContainerRef, label, placeholder, onScroll, flatOptions, closeMenu, handleEntered, renderSearch, renderOptionsList, } = props;

package/select/modern/components/base-select/index.js

@@ -10,10 +10,10 @@ import '@alfalab/hooks';
 import '../../utils.js';
 import '../native-select/Component.js';
 import './components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../../list-popover-desktop-ff5ea655.js';
+import '../../list-popover-desktop-6d15956b.js';
 import './components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import './components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import './components/list-mobile/list-mobile.js';
 import './components/list-mobile/list-bottom-sheet-mobile.js';
-import '../../mobile.module-b50c7468.js';
+import '../../mobile.module-13db2bf1.js';
 import './components/list-mobile/list-modal-mobile.js';

package/select/modern/components/clear-button/Component.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import React from 'react';
 import { ClearButtonProps } from "../../typings";
-declare const ClearButton: ({ disabled, onClick, dataTestId }: ClearButtonProps) => React.JSX.Element;
+declare const ClearButton: ({ disabled, onClick, dataTestId, size }: ClearButtonProps) => React.JSX.Element;
 export { ClearButton };

package/select/modern/components/clear-button/Component.js

@@ -1,11 +1,16 @@
 import React from 'react';
+import cn from 'classnames';
 import { Button } from '../../../../button/modern';
 import { CrossCircleMIcon } from '@alfalab/icons-glyph/CrossCircleMIcon';
+import { CrossCircleSIcon } from '@alfalab/icons-glyph/CrossCircleSIcon';
 
-const styles = {"clearIcon":"select__clearIcon_1epxr","clearButton":"select__clearButton_1epxr"};
+const styles = {"clearIcon":"select__clearIcon_1epxr","clearButton":"select__clearButton_1epxr","size-40":"select__size-40_1epxr"};
 require('./index.css');
 
-const ClearButton = ({ disabled, onClick, dataTestId }) => (React.createElement(Button, { type: 'button', view: 'text', disabled: disabled, "aria-label": '\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C', className: styles.clearButton, onClick: onClick, tabIndex: -1, dataTestId: dataTestId },
-    React.createElement(CrossCircleMIcon, { className: styles.clearIcon })));
+const ClearButton = ({ disabled, onClick, dataTestId, size }) => {
+    const IconComponent = size === 40 ? CrossCircleSIcon : CrossCircleMIcon;
+    return (React.createElement(Button, { type: 'button', view: 'text', disabled: disabled, "aria-label": '\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C', className: cn(styles.clearButton, styles[`size-${size}`]), onClick: onClick, tabIndex: -1, dataTestId: dataTestId },
+        React.createElement(IconComponent, { className: styles.clearIcon })));
+};
 
 export { ClearButton };

package/select/modern/components/clear-button/index.css

@@ -55,4 +55,6 @@
     display: var(--input-error-icon-display);
 } .select__clearButton_1epxr + * {
     margin-left: var(--gap-4);
-}
+} .select__clearButton_1epxr.select__size-40_1epxr + * {
+            margin-left: 6px;
+        }

package/select/modern/components/clear-button/index.js

@@ -1,4 +1,6 @@
 export { ClearButton } from './Component.js';
 import 'react';
+import 'classnames';
 import '../../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';

package/select/modern/components/field/Component.js

@@ -6,8 +6,9 @@ import { joinOptions } from '../../utils.js';
 import { ClearButton } from '../clear-button/Component.js';
 import '../../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 
-const styles = {"component":"select__component_kthbq","field":"select__field_kthbq","disabled":"select__disabled_kthbq","arrow":"select__arrow_kthbq","placeholder":"select__placeholder_kthbq","show-placeholder":"select__show-placeholder_kthbq","focused":"select__focused_kthbq","contentWrapper":"select__contentWrapper_kthbq","value":"select__value_kthbq","focusVisible":"select__focusVisible_kthbq"};
+const styles = {"component":"select__component_kthbq","field":"select__field_kthbq","disabled":"select__disabled_kthbq","arrow":"select__arrow_kthbq","placeholder":"select__placeholder_kthbq","show-placeholder":"select__show-placeholder_kthbq","focused":"select__focused_kthbq","contentWrapper":"select__contentWrapper_kthbq","size-40":"select__size-40_kthbq","value":"select__value_kthbq","focusVisible":"select__focusVisible_kthbq"};
 require('./index.css');
 
 const Field = ({ size = 56, open, multiple, error, hint, disabled, label, labelView = 'inner', placeholder, selectedMultiple = [], selected, rightAddons, valueRenderer = joinOptions, setSelectedItems, toggleMenu, Arrow, innerProps, dataTestId, fieldClassName, FormControlComponent, clear, onClear, ...restProps }) => {
@@ -25,15 +26,15 @@ const Field = ({ size = 56, open, multiple, error, hint, disabled, label, labelV
             [styles.focusVisible]: focusVisible,
         }), block: true, size: size, focused: focused || open, disabled: disabled, filled: filled || (!!placeholder && open), label: showLabel && label, labelView: labelView, error: error, hint: hint, rightAddons: (Arrow || rightAddons) && (React.createElement(React.Fragment, null,
             rightAddons,
-            clear && filled ? (React.createElement(ClearButton, { onClick: onClear, disabled: disabled, dataTestId: getDataTestId(dataTestId, 'clear-icon') })) : null,
+            clear && filled ? (React.createElement(ClearButton, { onClick: onClear, disabled: disabled, dataTestId: getDataTestId(dataTestId, 'clear-icon'), size: size })) : null,
             Arrow
                 ? React.cloneElement(Arrow, { className: styles.arrow })
                 : null)), "data-test-id": dataTestId, ...restProps, ...innerProps },
-        React.createElement("div", { className: styles.contentWrapper },
+        React.createElement("div", { className: cn(styles.contentWrapper, styles[`size-${size}`]) },
             showPlaceholder && (React.createElement("span", { className: cn(styles.placeholder, {
                     [styles.focused]: focused || open,
                 }) }, placeholder)),
-            filled && React.createElement("div", { className: styles.value }, value)))) : null));
+            filled && (React.createElement("div", { className: cn(styles.value, styles[`size-${size}`]) }, value))))) : null));
 };
 
 export { Field };

package/select/modern/components/field/index.css

@@ -69,12 +69,20 @@
     white-space: nowrap;
     text-overflow: ellipsis;
     overflow: hidden;
-    width: 100%;
-} .select__value_kthbq {
+    width: 100%
+} .select__contentWrapper_kthbq.select__size-40_kthbq {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+    } .select__value_kthbq {
     overflow: hidden;
     text-overflow: ellipsis;
-    text-align: left;
-} .select__focusVisible_kthbq {
+    text-align: left
+} .select__value_kthbq.select__size-40_kthbq {
+        font-size: 14px;
+        line-height: 18px;
+        font-weight: 400;
+    } .select__focusVisible_kthbq {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
 } @keyframes select__show-placeholder_kthbq {

package/select/modern/components/field/index.js

@@ -7,3 +7,4 @@ import '../../utils.js';
 import '../clear-button/Component.js';
 import '../../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';

package/select/modern/components/index.js

@@ -10,6 +10,7 @@ export { Search } from './search/Component.js';
 import 'react';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
 import 'compute-scroll-into-view';
@@ -19,16 +20,17 @@ import '@alfalab/hooks';
 import '../utils.js';
 import './native-select/Component.js';
 import './base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import './base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import './base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import './base-select/components/list-mobile/list-mobile.js';
 import './base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import './base-select/components/list-mobile/list-modal-mobile.js';
 import './clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../consts.js';
 import './checkmark/Component.js';
 import '../../../badge/modern';

package/select/modern/consts.d.ts

@@ -4,6 +4,7 @@ declare const SIZE_TO_CLASSNAME_MAP: {
     m: string;
     l: string;
     xl: string;
+    40: string;
     48: string;
     56: string;
     64: string;

package/select/modern/consts.js

@@ -4,6 +4,7 @@ const SIZE_TO_CLASSNAME_MAP = {
     m: 'size-56',
     l: 'size-64',
     xl: 'size-72',
+    40: 'size-40',
     48: 'size-48',
     56: 'size-56',
     64: 'size-64',

package/select/modern/desktop/Component.desktop.js

@@ -10,6 +10,7 @@ import { OptionsList } from '../components/options-list/Component.js';
 import { Search } from '../components/search/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
 import 'compute-scroll-into-view';
@@ -19,16 +20,17 @@ import '@alfalab/hooks';
 import '../utils.js';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../consts.js';
 import '../components/checkmark/Component.js';
 import '../../../badge/modern';

package/select/modern/desktop/index.js

@@ -5,6 +5,7 @@ import '../../../popover/modern';
 import '../components/arrow/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import '../components/base-select/Component.js';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
@@ -15,17 +16,18 @@ import '@alfalab/hooks';
 import '../utils.js';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../components/field/Component.js';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../components/optgroup/Component.js';
 import '../consts.js';
 import '../components/option/Component.js';

package/select/modern/index.js

@@ -7,6 +7,7 @@ import '../../popover/modern';
 import './components/arrow/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import './components/base-select/Component.js';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
@@ -17,17 +18,18 @@ import '@alfalab/hooks';
 import './utils.js';
 import './components/native-select/Component.js';
 import './components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import './list-popover-desktop-ff5ea655.js';
+import './list-popover-desktop-6d15956b.js';
 import './components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import './components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import './components/base-select/components/list-mobile/list-mobile.js';
 import './components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import './mobile.module-b50c7468.js';
+import './mobile.module-13db2bf1.js';
 import './components/base-select/components/list-mobile/list-modal-mobile.js';
 import './components/field/Component.js';
 import './components/clear-button/Component.js';
 import '../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import './components/optgroup/Component.js';
 import './consts.js';
 import './components/option/Component.js';
@@ -51,7 +53,7 @@ import '../../base-modal/modern';
 import '../../button/modern/mobile';
 import './components/virtual-options-list/Component.js';
 import 'react-virtual';
-import './hook-1d1901e0.js';
+import './hook-f9dc9773.js';
 import 'react-fast-compare';
 import './presets/useSelectWithApply/options-list-with-apply/footer/Component.js';
 import '../../button/modern/desktop';

package/select/modern/{list-popover-desktop-ff5ea655.d.ts → list-popover-desktop-6d15956b.d.ts}

@@ -1,8 +1,9 @@
-import { FC, ReactNode } from 'react';
-import { PopoverProps } from "../../popover";
+import { FC, ReactNode, RefObject } from 'react';
 import { ListPopoverDesktopRestProps } from "./components/base-select/components/list-desktop/types/types";
-interface ListPopoverDesktopProps extends ListPopoverDesktopRestProps, Pick<PopoverProps, 'open' | 'anchorElement'> {
+type ListPopoverDesktopProps = {
+    open: boolean;
+    fieldRef: RefObject<HTMLInputElement>;
     renderOptionsList: () => ReactNode;
-}
+} & ListPopoverDesktopRestProps;
 declare const ListPopoverDesktop: FC<ListPopoverDesktopProps>;
 export { ListPopoverDesktop };

package/select/modern/{list-popover-desktop-ff5ea655.js → list-popover-desktop-6d15956b.js}

@@ -5,9 +5,9 @@ const styles = {"component":"select__component_k2eyy","popoverInner":"select__po
 require('./components/base-select/index.css');
 
 const ListPopoverDesktop = (props) => {
-    const { Popover, open, popoverProps, anchorElement, popoverPosition = 'bottom-start', preventFlip = true, popperClassName, updatePopover, zIndexPopover, renderOptionsList, } = props;
+    const { Popover, open, popoverProps, fieldRef, popoverPosition = 'bottom-start', preventFlip = true, popperClassName, updatePopover, zIndexPopover, renderOptionsList, } = props;
     if (Popover) {
-        return (React.createElement(Popover, { ...popoverProps, open: open, withTransition: false, anchorElement: anchorElement, position: popoverPosition, preventFlip: preventFlip, popperClassName: cn(styles.popoverInner, popperClassName), update: updatePopover, zIndex: zIndexPopover }, renderOptionsList()));
+        return (React.createElement(Popover, { ...popoverProps, open: open, withTransition: false, anchorElement: fieldRef.current, position: popoverPosition, preventFlip: preventFlip, popperClassName: cn(styles.popoverInner, popperClassName), update: updatePopover, zIndex: zIndexPopover }, renderOptionsList()));
     }
     return null;
 };

package/select/modern/mobile/Component.mobile.js

@@ -11,10 +11,11 @@ import { Option } from '../components/option/Component.js';
 import { OptionsList } from '../components/options-list/Component.js';
 import { Search } from '../components/search/Component.js';
 import { VirtualOptionsList } from '../components/virtual-options-list/Component.js';
-import { u as useSelectWithApply } from '../hook-1d1901e0.js';
+import { u as useSelectWithApply } from '../hook-f9dc9773.js';
 import { Header } from '../presets/useSelectWithApply/options-list-with-apply/header/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
 import 'compute-scroll-into-view';
@@ -24,16 +25,17 @@ import '@alfalab/hooks';
 import '../utils.js';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../../../base-modal/modern';
 import '../../../button/modern/mobile';
 import '../consts.js';

package/select/modern/mobile/Component.modal.mobile.js

@@ -6,6 +6,7 @@ import '../../../modal/modern/mobile';
 import '../components/arrow/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import '../components/base-select/Component.js';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
@@ -16,17 +17,18 @@ import '@alfalab/hooks';
 import '../utils.js';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../components/field/Component.js';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../components/footer/Component.js';
 import '../../../base-modal/modern';
 import '../../../button/modern/mobile';
@@ -47,7 +49,7 @@ import '../../../input/modern';
 import '@alfalab/icons-glyph/MagnifierMIcon';
 import '../components/virtual-options-list/Component.js';
 import 'react-virtual';
-import '../hook-1d1901e0.js';
+import '../hook-f9dc9773.js';
 import 'react-fast-compare';
 import '../presets/useSelectWithApply/options-list-with-apply/footer/Component.js';
 import '../../../button/modern/desktop';

package/select/modern/mobile/index.js

@@ -7,6 +7,7 @@ import '../../../modal/modern/mobile';
 import '../components/arrow/Component.js';
 import 'classnames';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import '../components/base-select/Component.js';
 import 'react-merge-refs';
 import '@juggle/resize-observer';
@@ -17,17 +18,18 @@ import '@alfalab/hooks';
 import '../utils.js';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../components/field/Component.js';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '../components/footer/Component.js';
 import '../../../base-modal/modern';
 import '../../../button/modern/mobile';
@@ -48,7 +50,7 @@ import '../../../input/modern';
 import '@alfalab/icons-glyph/MagnifierMIcon';
 import '../components/virtual-options-list/Component.js';
 import 'react-virtual';
-import '../hook-1d1901e0.js';
+import '../hook-f9dc9773.js';
 import 'react-fast-compare';
 import '../presets/useSelectWithApply/options-list-with-apply/footer/Component.js';
 import '../../../button/modern/desktop';

package/select/modern/presets/index.js

@@ -1,6 +1,6 @@
 export { useSelectWithLoading } from './useSelectWithLoading/hook.js';
 export { useLazyLoading } from './useLazyLoading/hook.js';
-export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-1d1901e0.js';
+export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-f9dc9773.js';
 import 'react';
 import '../../../skeleton/modern';
 import '../components/option/Component.js';

package/select/modern/presets/useSelectWithApply/hook.js

@@ -1,7 +1,7 @@
 import 'react';
 import 'react-fast-compare';
 import '../../../../shared/modern';
-export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../../hook-1d1901e0.js';
+export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../../hook-f9dc9773.js';
 import '../../utils.js';
 import '../../components/options-list/Component.js';
 import 'react-merge-refs';

package/select/modern/presets/useSelectWithApply/options-list-with-apply/Component.js

@@ -1,6 +1,6 @@
 import 'react';
 import '../../../components/options-list/Component.js';
-export { O as OptionsListWithApply } from '../../../hook-1d1901e0.js';
+export { O as OptionsListWithApply } from '../../../hook-f9dc9773.js';
 import './footer/Component.js';
 import './header/Component.js';
 import 'react-merge-refs';

package/select/modern/presets/useSelectWithApply/options-list-with-apply/index.d.ts

@@ -1 +1 @@
-export * from "../../../hook-1d1901e0";
+export * from "../../../hook-f9dc9773";

package/select/modern/presets/useSelectWithApply/options-list-with-apply/index.js

@@ -1,4 +1,4 @@
-export { O as OptionsListWithApply } from '../../../hook-1d1901e0.js';
+export { O as OptionsListWithApply } from '../../../hook-f9dc9773.js';
 import 'react';
 import 'react-fast-compare';
 import '../../../utils.js';

package/select/modern/shared/index.js

@@ -1,6 +1,6 @@
 export { useSelectWithLoading } from '../presets/useSelectWithLoading/hook.js';
 export { useLazyLoading } from '../presets/useLazyLoading/hook.js';
-export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-1d1901e0.js';
+export { S as SELECT_ALL_KEY, u as useSelectWithApply } from '../hook-f9dc9773.js';
 export { defaultAccessor, defaultFilterFn, defaultGroupAccessor, getSelectTestIds, isGroup, isOptionShape, joinOptions, lastIndexOf, processOptions, usePrevious, useVirtualVisibleOptions, useVisibleOptions } from '../utils.js';
 export { Option } from '../components/option/Component.js';
 export { BaseOption } from '../components/base-option/Component.js';
@@ -37,18 +37,20 @@ import '@alfalab/hooks';
 import '../components/clear-button/Component.js';
 import '../../../button/modern';
 import '@alfalab/icons-glyph/CrossCircleMIcon';
+import '@alfalab/icons-glyph/CrossCircleSIcon';
 import '@alfalab/icons-glyph/ChevronDownMIcon';
+import '@alfalab/icons-glyph/ChevronDownSIcon';
 import '@juggle/resize-observer';
 import 'compute-scroll-into-view';
 import 'downshift';
 import '../components/native-select/Component.js';
 import '../components/base-select/components/list-desktop/helpers/get-list-popover-desktop-props.js';
-import '../list-popover-desktop-ff5ea655.js';
+import '../list-popover-desktop-6d15956b.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-modal-mobile-props.js';
 import '../components/base-select/components/list-mobile/helpers/get-list-bottom-sheet-mobile-props.js';
 import '../components/base-select/components/list-mobile/list-mobile.js';
 import '../components/base-select/components/list-mobile/list-bottom-sheet-mobile.js';
-import '../mobile.module-b50c7468.js';
+import '../mobile.module-13db2bf1.js';
 import '../components/base-select/components/list-mobile/list-modal-mobile.js';
 import '../../../base-modal/modern';
 import '../../../button/modern/mobile';