@alfalab/core-components 36.0.0 → 36.1.1

package/select/{Component-21b7a86d.js → Component-7546861a.js}

@@ -1,4 +1,4 @@
-var tslib_es6 = require('./tslib.es6-e8cb2975.js');
+var tslib_es6 = require('./tslib.es6-adf850c3.js');
 var React = require('react');
 var cn = require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
@@ -6,11 +6,15 @@ var components_arrow_Component = require('./components/arrow/Component.js');
 var mergeRefs = require('react-merge-refs');
 var downshift = require('downshift');
 require('@alfalab/hooks');
-var components_baseSelect_Component = require('./Component-ed89ed0b.js');
+var components_baseSelect_Component = require('./Component-ecfd1f2b.js');
 var utils = require('./utils.js');
 require('../form-control');
 var components_field_Component = require('./components/field/Component.js');
 var components_optgroup_Component = require('./components/optgroup/Component.js');
+require('@alfalab/core-components/badge');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+var components_baseSelectMobile_checkmark_Component = require('./components/base-select-mobile/checkmark/Component.js');
 require('../checkbox');
 var components_option_Component = require('./components/option/Component.js');
 require('../scrollbar');
@@ -19,11 +23,12 @@ require('./Component.js');
 var coreComponentsBottomSheet = require('../bottom-sheet');
 var mobile = require('../modal/mobile');
 var coreComponentsButton = require('../button');
-var components_baseSelectMobile_checkmark_Component = require('./components/base-select-mobile/checkmark/Component.js');
+var components_baseCheckmark_Component = require('./components/base-checkmark/Component.js');
 var components_baseSelectMobile_optionsList_Component = require('./components/base-select-mobile/options-list/Component.js');
 require('react-virtual');
+var components_baseOption_Component = require('./components/base-option/Component.js');
 require('../skeleton');
-require('./intersection-observer-6dcf1728.js');
+require('./intersection-observer-0340401e.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -96,7 +101,7 @@ function useSelectWithApply(_a) {
     };
 }
 
-var styles = {"footer":"select__footer_izxok","withBorder":"select__withBorder_izxok"};
+var styles = {"footer":"select__footer_crag3","withBorder":"select__withBorder_crag3"};
 require('./presets/useSelectWithApply/options-list-with-apply/index.css');
 
 var OptionsListWithApply = React.forwardRef(function (_a, ref) {
@@ -142,7 +147,7 @@ var OptionsListWithApply = React.forwardRef(function (_a, ref) {
             showClear && (React__default['default'].createElement(coreComponentsButton.Button, { size: 'xxs', view: 'secondary', onClick: handleClear }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C"))) })));
 });
 
-var styles$1 = {"component":"select__component_1pk0l","popoverInner":"select__popoverInner_1pk0l","sheet":"select__sheet_1pk0l","sheetContent":"select__sheetContent_1pk0l","sheetContainer":"select__sheetContainer_1pk0l","block":"select__block_1pk0l","option":"select__option_1pk0l","optionGroup":"select__optionGroup_1pk0l"};
+var styles$1 = {"component":"select__component_16wu7","popoverInner":"select__popoverInner_16wu7","sheet":"select__sheet_16wu7","sheetContent":"select__sheetContent_16wu7","sheetContainer":"select__sheetContainer_16wu7","block":"select__block_16wu7","option":"select__option_16wu7","optionGroup":"select__optionGroup_16wu7"};
 require('./components/base-select-mobile/index.css');
 
 var BaseSelectMobile = React.forwardRef(function (_a, ref) {
@@ -285,14 +290,19 @@ var BaseSelectMobile = React.forwardRef(function (_a, ref) {
             openMenu();
         }
     };
-    var getOptionProps = function (option, index) { return (tslib_es6.__assign(tslib_es6.__assign({}, optionProps), { className: cn__default['default'](styles$1.option, optionClassName), innerProps: getItemProps({
-            index: index,
-            item: option,
-            disabled: option.disabled,
-            onMouseDown: function (event) { return event.preventDefault(); },
-        }), multiple: multiple, index: index, option: option, size: optionsSize, disabled: option.disabled, highlighted: index === highlightedIndex, selected: selectedItems.includes(option), dataTestId: components_baseSelect_Component.getDataTestId(dataTestId, 'option'), 
-        // eslint-disable-next-line react/no-unstable-nested-components
-        Checkmark: function () { return React__default['default'].createElement(components_baseSelectMobile_checkmark_Component.Checkmark, { selected: selectedItems.includes(option) }); } })); };
+    var getOptionProps = function (option, index) {
+        var selectedItem = selectedItems.includes(option);
+        return tslib_es6.__assign(tslib_es6.__assign({}, optionProps), { mobile: true, className: cn__default['default'](styles$1.option, optionClassName), innerProps: getItemProps({
+                index: index,
+                item: option,
+                disabled: option.disabled,
+                onMouseDown: function (event) { return event.preventDefault(); },
+            }), multiple: multiple, index: index, option: option, size: optionsSize, disabled: option.disabled, highlighted: index === highlightedIndex, selected: selectedItem, dataTestId: components_baseSelect_Component.getDataTestId(dataTestId, 'option'), 
+            // eslint-disable-next-line react/no-unstable-nested-components
+            Checkmark: function () {
+                return Option === components_baseOption_Component.BaseOption ? (React__default['default'].createElement(components_baseCheckmark_Component.BaseCheckmark, { selected: selectedItem, multiple: multiple })) : (React__default['default'].createElement(components_baseSelectMobile_checkmark_Component.Checkmark, { selected: selectedItem }));
+            } });
+    };
     React.useEffect(function () {
         if (defaultOpen)
             openMenu();
@@ -334,10 +344,10 @@ var BaseSelectMobile = React.forwardRef(function (_a, ref) {
             }, dataTestId: components_baseSelect_Component.getDataTestId(dataTestId, 'field') }, fieldProps)),
         name && renderValue(),
         isBottomSheet ? (React__default['default'].createElement(coreComponentsBottomSheet.BottomSheet, tslib_es6.__assign({ open: open, onClose: handleClose, className: styles$1.sheet, contentClassName: styles$1.sheetContent, containerClassName: styles$1.sheetContainer, title: placeholder, actionButton: footer, stickyHeader: true, hasCloser: true, swipeable: swipeable }, bottomSheetProps),
-            React__default['default'].createElement("div", tslib_es6.__assign({}, menuProps, { className: cn__default['default'](optionsListClassName, styles$1.optionsList) }),
+            React__default['default'].createElement("div", tslib_es6.__assign({}, menuProps, { className: optionsListClassName }),
                 React__default['default'].createElement(OptionsListWithApply, tslib_es6.__assign({}, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: components_baseSelectMobile_optionsList_Component.OptionsList, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: components_baseSelect_Component.getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn__default['default'](styles$1.optionGroup, optionGroupClassName), showFooter: multiple, onApply: handleApply, onClear: handleClear }))))) : (React__default['default'].createElement(mobile.ModalMobile, { open: open, onClose: handleClose, contentClassName: styles$1.sheetContent, hasCloser: true },
-            React__default['default'].createElement(mobile.ModalMobile.Header, { hasCloser: true, title: placeholder, sticky: true, className: styles$1.sticky }),
-            React__default['default'].createElement("div", tslib_es6.__assign({}, menuProps, { className: cn__default['default'](optionsListClassName, styles$1.optionsList) }),
+            React__default['default'].createElement(mobile.ModalMobile.Header, { hasCloser: true, title: placeholder, sticky: true }),
+            React__default['default'].createElement("div", tslib_es6.__assign({}, menuProps, { className: optionsListClassName }),
                 React__default['default'].createElement(OptionsListWithApply, tslib_es6.__assign({}, optionsListProps, { flatOptions: flatOptions, highlightedIndex: highlightedIndex, size: size, options: options, OptionsList: components_baseSelectMobile_optionsList_Component.OptionsList, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, dataTestId: components_baseSelect_Component.getDataTestId(dataTestId, 'options-list'), optionGroupClassName: cn__default['default'](styles$1.optionGroup, optionGroupClassName), showFooter: multiple, onApply: handleApply, onClear: handleClear })))))));
 });
 

package/select/{Component-ed89ed0b.js → Component-ecfd1f2b.js}

@@ -1,4 +1,4 @@
-var tslib_es6 = require('./tslib.es6-e8cb2975.js');
+var tslib_es6 = require('./tslib.es6-adf850c3.js');
 var React = require('react');
 var cn = require('classnames');
 var mergeRefs = require('react-merge-refs');
@@ -20,7 +20,7 @@ var getDataTestId = function (dataTestId, element) {
     return dataTestId ? "" + dataTestId + elementPart : undefined;
 };
 
-var styles = {"component":"select__component_kmgc8","popoverInner":"select__popoverInner_kmgc8","optionsList":"select__optionsList_kmgc8","nativeSelect":"select__nativeSelect_kmgc8","block":"select__block_kmgc8"};
+var styles = {"component":"select__component_u7ia8","popoverInner":"select__popoverInner_u7ia8","optionsList":"select__optionsList_u7ia8","nativeSelect":"select__nativeSelect_u7ia8","block":"select__block_u7ia8"};
 require('./components/base-select/index.css');
 
 var BaseSelect = React.forwardRef(function (_a, ref) {

package/select/Component.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-e8cb2975.js');
+var tslib_es6 = require('./tslib.es6-adf850c3.js');
 var React = require('react');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
@@ -10,12 +10,16 @@ require('@juggle/resize-observer');
 require('downshift');
 require('../popover');
 require('@alfalab/hooks');
-var components_baseSelect_Component = require('./Component-ed89ed0b.js');
+var components_baseSelect_Component = require('./Component-ecfd1f2b.js');
 require('./utils.js');
 require('./components/native-select/Component.js');
 require('../form-control');
 var components_field_Component = require('./components/field/Component.js');
 var components_optgroup_Component = require('./components/optgroup/Component.js');
+require('@alfalab/core-components/badge');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('./components/base-select-mobile/checkmark/Component.js');
 require('../checkbox');
 require('./components/checkmark/Component.js');
 var components_option_Component = require('./components/option/Component.js');

package/select/components/arrow/Component.js

@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"arrow":"select__arrow_1w4em","open":"select__open_1w4em"};
+var styles = {"arrow":"select__arrow_1lcti","open":"select__open_1lcti"};
 require('./index.css');
 
 var Arrow = function (_a) {

package/select/components/arrow/index.css

@@ -1,4 +1,4 @@
-/* hash: 1g38u */
+/* hash: 15r8t */
 :root {
     --color-light-graphic-primary: #0b1f35;
 }
@@ -24,7 +24,7 @@
 
     /* optgroup */
 }
-.select__arrow_1w4em {
+.select__arrow_1lcti {
     display: block;
     width: 24px;
     height: 24px;
@@ -32,6 +32,6 @@
 
     transition: transform 0.15s ease-in-out, opacity 0.2s ease;
 }
-.select__open_1w4em {
+.select__open_1lcti {
     transform: var(--arrow-transform);
 }

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

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { CheckmarkProps } from "../../typings";
+declare const BaseCheckmark: ({ selected, disabled, className, multiple, }: CheckmarkProps) => JSX.Element;
+export { BaseCheckmark };

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

@@ -0,0 +1,27 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var cn = require('classnames');
+var CheckmarkMIcon = require('@alfalab/icons-glyph/CheckmarkMIcon');
+var coreComponentsCheckbox = require('../../../checkbox');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+var styles = {"checkmark":"select__checkmark_678c4","single":"select__single_678c4","selected":"select__selected_678c4"};
+require('./index.css');
+
+var BaseCheckmark = function (_a) {
+    var _b;
+    var selected = _a.selected, _c = _a.disabled, disabled = _c === void 0 ? false : _c, className = _a.className, multiple = _a.multiple;
+    var checkmarkClassNames = cn__default['default'](styles.checkmark, className, (_b = {},
+        _b[styles.multiple] = multiple,
+        _b[styles.single] = !multiple,
+        _b[styles.selected] = selected,
+        _b));
+    return multiple ? (React__default['default'].createElement(coreComponentsCheckbox.Checkbox, { checked: selected, disabled: disabled, className: checkmarkClassNames, size: 'm', onClick: function (event) { return event.stopPropagation(); } })) : (React__default['default'].createElement(CheckmarkMIcon.CheckmarkMIcon, { className: checkmarkClassNames }));
+};
+
+exports.BaseCheckmark = BaseCheckmark;

package/select/components/base-checkmark/index.css

@@ -0,0 +1,32 @@
+/* hash: 141zh */
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+
+    /* options list */
+
+    /* option */
+
+    /* checkmark */
+
+    /* optgroup */
+}
+.select__checkmark_678c4 {
+    flex-shrink: 0;
+    box-sizing: border-box;
+}
+.select__single_678c4 {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    opacity: 0
+}
+.select__single_678c4.select__selected_678c4 {
+        opacity: 1;
+    }

package/select/components/base-checkmark/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

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

@@ -0,0 +1,11 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('react');
+require('classnames');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('../../../checkbox');
+var components_baseCheckmark_Component = require('./Component.js');
+
+
+
+exports.BaseCheckmark = components_baseCheckmark_Component.BaseCheckmark;

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

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { OptionProps } from "../../typings";
+declare const BaseOption: FC<OptionProps>;
+export { BaseOption };

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

@@ -0,0 +1,44 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib_es6 = require('../../tslib.es6-adf850c3.js');
+var React = require('react');
+var cn = require('classnames');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('../../../checkbox');
+var components_baseCheckmark_Component = require('../base-checkmark/Component.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
+
+var styles = {"option":"select__option_8wful","disabled":"select__disabled_8wful","checkmarkBefore":"select__checkmarkBefore_8wful","checkmarkAfter":"select__checkmarkAfter_8wful","textContent":"select__textContent_8wful","mobileTextContent":"select__mobileTextContent_8wful","selected":"select__selected_8wful","highlighted":"select__highlighted_8wful","content":"select__content_8wful"};
+require('./index.css');
+
+var BaseOption = function (_a) {
+    var _b;
+    var className = _a.className, option = _a.option, children = _a.children, selected = _a.selected, highlighted = _a.highlighted, disabled = _a.disabled, multiple = _a.multiple, _c = _a.Checkmark, Checkmark = _c === void 0 ? components_baseCheckmark_Component.BaseCheckmark : _c, _d = _a.checkmarkPosition, checkmarkPosition = _d === void 0 ? multiple ? 'before' : 'after' : _d, innerProps = _a.innerProps, dataTestId = _a.dataTestId, _e = _a.mobile, mobile = _e === void 0 ? false : _e;
+    var content = children || option.content || option.key;
+    var _f = option.showCheckMark, showCheckMark = _f === void 0 ? true : _f;
+    var isTextContent = !React.isValidElement(content);
+    var renderCheckmark = function () {
+        if (Checkmark && showCheckMark) {
+            return React__default['default'].createElement(Checkmark, { disabled: disabled, selected: selected, multiple: multiple });
+        }
+        return null;
+    };
+    return (React__default['default'].createElement("div", tslib_es6.__assign({}, innerProps, { className: cn__default['default'](styles.option, className, (_b = {},
+            _b[styles.highlighted] = highlighted,
+            _b[styles.selected] = selected,
+            _b[styles.disabled] = disabled,
+            _b[styles.textContent] = isTextContent && !mobile,
+            _b[styles.mobileTextContent] = isTextContent && mobile,
+            _b[styles.checkmarkAfter] = !isTextContent && checkmarkPosition === 'after',
+            _b[styles.checkmarkBefore] = !isTextContent && checkmarkPosition === 'before',
+            _b)), "data-test-id": dataTestId }),
+        checkmarkPosition === 'before' && renderCheckmark(),
+        React__default['default'].createElement("div", { className: cn__default['default'](styles.content) }, content),
+        checkmarkPosition === 'after' && renderCheckmark()));
+};
+
+exports.BaseOption = BaseOption;

package/select/components/base-option/index.css

@@ -0,0 +1,95 @@
+/* hash: 13s72 */
+:root {
+    --color-light-bg-primary: #fff;
+    --color-light-bg-secondary: #f3f4f5;
+    --color-light-bg-tertiary: #e7e9eb;
+    --color-light-text-primary: #0b1f35;
+    --color-light-text-secondary: rgba(11, 31, 53, 0.7);
+}
+:root {
+
+    /* Hard */
+
+    /* Up */
+
+    /* Hard up */
+}
+:root {
+    --gap-s: 12px;
+    --gap-m: 16px;
+}
+:root {
+    --disabled-cursor: not-allowed;
+    --size-s-height: 48px;
+}
+:root {
+
+    /* options list */
+
+    /* option */
+    --select-option-background: var(--color-light-bg-primary);
+    --select-option-selected-background: var(--color-light-bg-primary);
+    --select-option-hover-background: var(--color-light-bg-secondary);
+    --select-option-active-background: var(--color-light-bg-tertiary);
+    --select-option-disabled-background: var(--color-light-bg-primary);
+    --select-option-color: var(--color-light-text-primary);
+    --select-option-selected-color: var(--color-light-text-primary);
+    --select-option-hover-color: var(--color-light-text-primary);
+    --select-option-active-color: var(--color-light-text-primary);
+    --select-option-disabled-color: var(--color-light-text-secondary);
+
+    /* checkmark */
+
+    /* optgroup */
+}
+.select__option_8wful {
+    font-size: 16px;
+    line-height: 20px;
+    font-weight: 400;
+
+    display: flex;
+    align-items: center;
+    grid-gap: var(--gap-s);
+    grid-gap: var(--gap-s);
+    gap: var(--gap-s);
+    transition: background-color 0.2s ease;
+    background: var(--select-option-background);
+    color: var(--select-option-color);
+    box-sizing: border-box;
+    position: relative;
+    cursor: pointer;
+    min-height: var(--size-s-height)
+}
+.select__option_8wful:not(.select__disabled_8wful):active {
+        background: var(--select-option-active-background);
+        color: var(--select-option-active-color);
+    }
+.select__option_8wful.select__checkmarkBefore_8wful {
+        padding: 0 0 0 var(--gap-s);
+    }
+.select__option_8wful.select__checkmarkAfter_8wful {
+        padding: 0 var(--gap-s) 0 0;
+    }
+.select__option_8wful.select__textContent_8wful {
+        padding: var(--gap-s);
+    }
+.select__option_8wful.select__mobileTextContent_8wful {
+        padding: var(--gap-m);
+    }
+.select__selected_8wful {
+    background: var(--select-option-selected-background);
+    color: var(--select-option-selected-color);
+    cursor: default;
+}
+.select__highlighted_8wful {
+    background: var(--select-option-hover-background);
+    color: var(--select-option-hover-color);
+}
+.select__disabled_8wful {
+    cursor: var(--disabled-cursor);
+    background: var(--select-option-disabled-background);
+    color: var(--select-option-disabled-color);
+}
+.select__content_8wful {
+    flex: 1;
+}

package/select/components/base-option/index.d.ts

@@ -0,0 +1 @@
+export * from "./Component";

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

@@ -0,0 +1,13 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../tslib.es6-adf850c3.js');
+require('react');
+require('classnames');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('../../../checkbox');
+require('../base-checkmark/Component.js');
+var components_baseOption_Component = require('./Component.js');
+
+
+
+exports.BaseOption = components_baseOption_Component.BaseOption;

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-e8cb2975.js');
+require('../../tslib.es6-adf850c3.js');
 require('react');
 require('classnames');
 require('react-merge-refs');
@@ -8,7 +8,7 @@ require('@juggle/resize-observer');
 require('downshift');
 require('../../../popover');
 require('@alfalab/hooks');
-var components_baseSelect_Component = require('../../Component-ed89ed0b.js');
+var components_baseSelect_Component = require('../../Component-ecfd1f2b.js');
 require('../../utils.js');
 require('../native-select/Component.js');
 

package/select/components/base-select/index.css

@@ -1,4 +1,4 @@
-/* hash: 1ifm5 */
+/* hash: 1wg4f */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -34,12 +34,12 @@
 
     /* optgroup */
 }
-.select__component_kmgc8 {
+.select__component_u7ia8 {
     width: max-content;
     position: relative;
     outline: 0;
 }
-.select__popoverInner_kmgc8 {
+.select__popoverInner_u7ia8 {
     padding-top: var(--select-options-list-offset);
     padding-bottom: var(--select-options-list-offset);
     box-shadow: none;
@@ -48,7 +48,7 @@
     border-radius: 0;
     position: relative;
 }
-.select__optionsList_kmgc8 {
+.select__optionsList_u7ia8 {
     padding-top: var(--select-options-list-top-padding);
     padding-bottom: var(--select-options-list-bottom-padding);
     box-shadow: var(--select-options-list-box-shadow);
@@ -57,7 +57,7 @@
     overflow: hidden;
     will-change: transform;
 }
-.select__nativeSelect_kmgc8 {
+.select__nativeSelect_u7ia8 {
     opacity: 0;
     overflow: hidden;
     position: absolute;
@@ -71,12 +71,12 @@
     cursor: pointer;
     z-index: 1;
 }
-.select__block_kmgc8 {
+.select__block_u7ia8 {
     width: 100%;
 }
 /* width: max-content; fix for IE */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
-    .select__component_kmgc8 {
+    .select__component_u7ia8 {
         float: left;
         clear: left;
     }

package/select/components/base-select/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-ed89ed0b";
+export * from "../../Component-ecfd1f2b";

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-e8cb2975.js');
+require('../../tslib.es6-adf850c3.js');
 require('react');
 require('classnames');
 require('react-merge-refs');
@@ -8,7 +8,7 @@ require('@juggle/resize-observer');
 require('downshift');
 require('../../../popover');
 require('@alfalab/hooks');
-var components_baseSelect_Component = require('../../Component-ed89ed0b.js');
+var components_baseSelect_Component = require('../../Component-ecfd1f2b.js');
 require('../../utils.js');
 require('../native-select/Component.js');
 

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

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('../../tslib.es6-e8cb2975.js');
+require('../../tslib.es6-adf850c3.js');
 require('react');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
@@ -10,12 +10,16 @@ require('@juggle/resize-observer');
 require('downshift');
 require('../../../popover');
 require('@alfalab/hooks');
-require('../../Component-ed89ed0b.js');
+require('../../Component-ecfd1f2b.js');
 require('../../utils.js');
 require('../native-select/Component.js');
 require('../../../form-control');
 require('../field/Component.js');
 require('../optgroup/Component.js');
+require('@alfalab/core-components/badge');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
+require('./checkmark/Component.js');
 require('../../../checkbox');
 require('../checkmark/Component.js');
 require('../option/Component.js');
@@ -25,13 +29,14 @@ require('../../Component.js');
 require('../../../bottom-sheet');
 require('../../../modal/mobile');
 require('../../../button');
-var presets_useSelectWithApply_hook = require('../../Component-21b7a86d.js');
-require('./checkmark/Component.js');
+var presets_useSelectWithApply_hook = require('../../Component-7546861a.js');
+require('../base-checkmark/Component.js');
 require('../../../base-modal');
 require('./options-list/Component.js');
 require('react-virtual');
+require('../base-option/Component.js');
 require('../../../skeleton');
-require('../../intersection-observer-6dcf1728.js');
+require('../../intersection-observer-0340401e.js');
 
 
 

package/select/components/base-select-mobile/checkmark/Component.js

@@ -2,21 +2,26 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
 var cn = require('classnames');
+var badge = require('@alfalab/core-components/badge');
+var CheckmarkCircleMIcon = require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+var CheckmarkMIcon = require('@alfalab/icons-glyph/CheckmarkMIcon');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"checkmark":"select__checkmark_1c472","selected":"select__selected_1c472"};
+var styles = {"checkmark":"select__checkmark_11cly","selected":"select__selected_11cly","displayIcon":"select__displayIcon_11cly","displayBadge":"select__displayBadge_11cly"};
 require('./index.css');
 
 var Checkmark = function (_a) {
     var _b;
     var selected = _a.selected, className = _a.className;
-    return (React__default['default'].createElement("span", { className: cn__default['default'](styles.checkmark, className, (_b = {},
+    return (React__default['default'].createElement("div", { className: cn__default['default'](styles.checkmark, className, (_b = {},
             _b[styles.selected] = selected,
-            _b)) }));
+            _b)) },
+        React__default['default'].createElement(CheckmarkMIcon.CheckmarkMIcon, { className: styles.displayIcon }),
+        React__default['default'].createElement(badge.Badge, { className: styles.displayBadge, view: 'icon', size: 'm', iconColor: 'positive', content: React__default['default'].createElement(CheckmarkCircleMIcon.CheckmarkCircleMIcon, null) })));
 };
 
 exports.Checkmark = Checkmark;

package/select/components/base-select-mobile/checkmark/index.css

@@ -1,4 +1,4 @@
-/* hash: tdnuh */
+/* hash: 14nbl */
 :root {
 
     /* Hard */
@@ -14,24 +14,29 @@
     /* option */
 
     /* checkmark */
-    --select-mobile-checkmark-background: url('https://alfabank.servicecdn.ru/icons/glyph_checkmark_m.svg');
+    --select-mobile-checkmark-display-icon: block;
+    --select-mobile-checkmark-display-badge: none;
 
     /* optgroup */
 }
-.select__checkmark_1c472 {
+.select__checkmark_11cly {
     flex-shrink: 0;
     display: flex;
     align-items: center;
     justify-content: center;
-    background: var(--select-mobile-checkmark-background);
-    background-size: cover;
     width: 24px;
     height: 24px;
     opacity: 0
 }
-.select__checkmark_1c472:first-child {
+.select__checkmark_11cly:first-child {
         display: none;
     }
-.select__checkmark_1c472.select__selected_1c472 {
+.select__checkmark_11cly.select__selected_11cly {
         opacity: 1;
     }
+.select__displayIcon_11cly {
+    display: var(--select-mobile-checkmark-display-icon);
+}
+.select__displayBadge_11cly {
+    display: var(--select-mobile-checkmark-display-badge);
+}

package/select/components/base-select-mobile/checkmark/index.js

@@ -2,6 +2,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 require('react');
 require('classnames');
+require('@alfalab/core-components/badge');
+require('@alfalab/icons-glyph/CheckmarkCircleMIcon');
+require('@alfalab/icons-glyph/CheckmarkMIcon');
 var components_baseSelectMobile_checkmark_Component = require('./Component.js');