@alfalab/core-components-select 13.2.16 → 13.2.18

package/components/virtual-options-list/index.css

@@ -1,7 +1,8 @@
-/* hash: 1a8h7 */
+/* hash: 8q429 */
 :root {
 } /* deprecated */ :root {
     --color-light-border-primary: #dbdee1;
+    --color-light-border-secondary: #e7e9eb;
     --color-light-text-secondary: rgba(11, 31, 53, 0.7); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -34,23 +35,31 @@
     /* checkmark */
 
     /* optgroup */
-} .select__virtualOptionsList_1v5vm {
+} .select__virtualOptionsList_cbwl3 {
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: relative;
-} .select__scrollable_1v5vm {
+} .select__virtualOptionsListHeader_cbwl3 {
+    box-sizing: border-box;
+    border-bottom: 1px solid var(--color-light-border-secondary);
+} .select__virtualOptionsListFooter_cbwl3 {
+    box-sizing: border-box;
+    border-top: 1px solid transparent
+} .select__virtualOptionsListFooter_cbwl3.select__withBorder_cbwl3 {
+        border-top: 1px solid var(--color-light-border-secondary);
+    } .select__scrollable_cbwl3 {
     overflow: auto;
     width: 100%;
-} .select__inner_1v5vm {
+} .select__inner_cbwl3 {
     position: relative;
     width: 100%;
-} .select__virtualRow_1v5vm {
+} .select__virtualRow_cbwl3 {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%
-} .select__virtualRow_1v5vm:before {
+} .select__virtualRow_cbwl3:before {
         content: '';
         position: absolute;
         z-index: 1;
@@ -60,15 +69,15 @@
         height: 1px;
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
-    } .select__virtualRow_1v5vm:first-child:before {
+    } .select__virtualRow_cbwl3:first-child:before {
         display: none;
-    } .select__highlighted_1v5vm:before,
-    .select__highlighted_1v5vm + .select__virtualRow_1v5vm:before {
+    } .select__highlighted_cbwl3:before,
+    .select__highlighted_cbwl3 + .select__virtualRow_cbwl3:before {
         display: none;
-    } .select__emptyPlaceholder_1v5vm {
+    } .select__emptyPlaceholder_cbwl3 {
     padding: var(--gap-m) var(--gap-s);
     color: var(--select-options-list-empty-placeholder-color);
-} .select__l_1v5vm .select__emptyPlaceholder_1v5vm,
-.select__xl_1v5vm .select__emptyPlaceholder_1v5vm {
+} .select__l_cbwl3 .select__emptyPlaceholder_cbwl3,
+.select__xl_cbwl3 .select__emptyPlaceholder_cbwl3 {
     padding: var(--gap-xl) var(--gap-m);
 }

package/cssm/{Component-aaa9f3a7.js → Component-31b4153d.js}

@@ -243,7 +243,8 @@ var BaseSelect = React.forwardRef(function (_a, ref) {
             }, dataTestId: getDataTestId(dataTestId, 'field') }, fieldProps)),
         name && !nativeSelect && renderValue(),
         !nativeSelect && (React__default.default.createElement(coreComponentsPopover.Popover, { open: open, withTransition: false, anchorElement: fieldRef.current, position: popoverPosition, preventFlip: preventFlip, popperClassName: cn__default.default(styles__default.default.popoverInner, popperClassName), update: updatePopover, zIndex: zIndexPopover }, needRenderOptionsList && (React__default.default.createElement("div", tslib.__assign({}, menuProps, { className: cn__default.default(optionsListClassName, styles__default.default.optionsList) }),
-            React__default.default.createElement(OptionsList, tslib.__assign({}, optionsListProps, { optionsListWidth: optionsListWidth, flatOptions: flatOptions, highlightedIndex: highlightedIndex, open: open, size: size, options: options, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, visibleOptions: visibleOptions, onScroll: onScroll, dataTestId: getDataTestId(dataTestId, 'options-list') }))))))));
+            React__default.default.createElement(OptionsList, tslib.__assign({}, optionsListProps, { optionsListWidth: optionsListWidth, flatOptions: flatOptions, highlightedIndex: highlightedIndex, open: open, size: size, options: options, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, visibleOptions: visibleOptions, onScroll: onScroll, dataTestId: getDataTestId(dataTestId, 'options-list') })),
+            React__default.default.createElement("div", { className: styles__default.default.optionsListBorder })))))));
 });
 
 exports.BaseSelect = BaseSelect;

package/cssm/{Component-e9709f88.js → Component-afba64fc.js}

@@ -9,7 +9,7 @@ var downshift = require('downshift');
 var coreComponentsBottomSheet = require('@alfalab/core-components-bottom-sheet/cssm');
 var mobile = require('@alfalab/core-components-modal/cssm/mobile');
 require('./Component.js');
-var components_baseSelect_Component = require('./Component-aaa9f3a7.js');
+var components_baseSelect_Component = require('./Component-31b4153d.js');
 var components_field_Component = require('./components/field/Component.js');
 var components_optgroup_Component = require('./components/optgroup/Component.js');
 var components_option_Component = require('./components/option/Component.js');
@@ -55,8 +55,7 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 var styles__default$1 = /*#__PURE__*/_interopDefaultCompat(styles$1);
 
 var OptionsListWithApply = React.forwardRef(function (_a, ref) {
-    var _b;
-    var toggleMenu = _a.toggleMenu, _c = _a.OptionsList, OptionsList = _c === void 0 ? components_optionsList_Component.OptionsList : _c, defaultGetOptionProps = _a.getOptionProps, _d = _a.showClear, showClear = _d === void 0 ? true : _d, _e = _a.selectedDraft, selectedDraft = _e === void 0 ? [] : _e, _f = _a.flatOptions, flatOptions = _f === void 0 ? [] : _f, _g = _a.onApply, onApply = _g === void 0 ? function () { return null; } : _g, _h = _a.onClear, onClear = _h === void 0 ? function () { return null; } : _h, _j = _a.onClose, onClose = _j === void 0 ? function () { return null; } : _j, _k = _a.visibleOptions, visibleOptions = _k === void 0 ? 5 : _k, restProps = tslib.__rest(_a, ["toggleMenu", "OptionsList", "getOptionProps", "showClear", "selectedDraft", "flatOptions", "onApply", "onClear", "onClose", "visibleOptions"]);
+    var toggleMenu = _a.toggleMenu, _b = _a.OptionsList, OptionsList = _b === void 0 ? components_optionsList_Component.OptionsList : _b, defaultGetOptionProps = _a.getOptionProps, _c = _a.showClear, showClear = _c === void 0 ? true : _c, _d = _a.selectedDraft, selectedDraft = _d === void 0 ? [] : _d, _e = _a.flatOptions, flatOptions = _e === void 0 ? [] : _e, _f = _a.onApply, onApply = _f === void 0 ? function () { return null; } : _f, _g = _a.onClear, onClear = _g === void 0 ? function () { return null; } : _g, _h = _a.onClose, onClose = _h === void 0 ? function () { return null; } : _h, _j = _a.visibleOptions, visibleOptions = _j === void 0 ? 5 : _j, restProps = tslib.__rest(_a, ["toggleMenu", "OptionsList", "getOptionProps", "showClear", "selectedDraft", "flatOptions", "onApply", "onClear", "onClose", "visibleOptions"]);
     var footerRef = React.useRef(null);
     var getOptionProps = React.useCallback(function (option, index) {
         var optionProps = defaultGetOptionProps(option, index);
@@ -90,9 +89,7 @@ var OptionsListWithApply = React.forwardRef(function (_a, ref) {
     }, []);
     return (React__default.default.createElement(OptionsList, tslib.__assign({}, restProps, { ref: ref, visibleOptions: visibleOptions, toggleMenu: toggleMenu, flatOptions: flatOptions, getOptionProps: getOptionProps, onApply: handleApply, onClear: handleClear, footer: React__default.default.createElement("div", { 
             // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-            tabIndex: 0, className: cn__default.default(styles__default.default.footer, (_b = {},
-                _b[styles__default.default.withBorder] = visibleOptions && flatOptions.length > visibleOptions,
-                _b)), ref: footerRef },
+            tabIndex: 0, className: styles__default.default.footer, ref: footerRef },
             React__default.default.createElement(coreComponentsButton.Button, { size: 'xxs', view: 'primary', onClick: handleApply }, "\u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C"),
             showClear && (React__default.default.createElement(coreComponentsButton.Button, { size: 'xxs', view: 'secondary', onClick: handleClear }, "\u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C"))) })));
 });

package/cssm/Component.js

@@ -3,7 +3,7 @@
 var tslib = require('tslib');
 var React = require('react');
 var components_arrow_Component = require('./components/arrow/Component.js');
-var components_baseSelect_Component = require('./Component-aaa9f3a7.js');
+var components_baseSelect_Component = require('./Component-31b4153d.js');
 var components_field_Component = require('./components/field/Component.js');
 var components_optgroup_Component = require('./components/optgroup/Component.js');
 var components_option_Component = require('./components/option/Component.js');

package/cssm/Component.responsive.js

@@ -7,8 +7,8 @@ var Component = require('./Component.js');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('./components/arrow/index.module.css');
-require('./Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-e9709f88.js');
+require('./Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-afba64fc.js');
 require('@alfalab/core-components-form-control/cssm');
 require('./components/field/index.module.css');
 require('./components/optgroup/index.module.css');

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

@@ -8,7 +8,7 @@ require('classnames');
 require('downshift');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');
-var components_baseSelect_Component = require('../../Component-aaa9f3a7.js');
+var components_baseSelect_Component = require('../../Component-31b4153d.js');
 require('../../utils.js');
 require('../native-select/Component.js');
 require('./index.module.css');

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

@@ -1 +1 @@
-export * from "../../Component-aaa9f3a7";
+export * from "../../Component-31b4153d";

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var components_baseSelect_Component = require('../../Component-aaa9f3a7.js');
+var components_baseSelect_Component = require('../../Component-31b4153d.js');
 require('tslib');
 require('react');
 require('react-merge-refs');

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

@@ -1,6 +1,7 @@
 :root {
 } /* deprecated */ :root {
-    --color-light-bg-primary: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --color-light-bg-primary: #fff;
+    --color-light-border-secondary: #e7e9eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
 } :root {
@@ -46,6 +47,7 @@
     border-radius: 0;
     position: relative;
 } .optionsList {
+    position: relative;
     padding-top: var(--select-options-list-top-padding);
     padding-bottom: var(--select-options-list-bottom-padding);
     box-shadow: var(--select-options-list-box-shadow);
@@ -53,6 +55,15 @@
     background: var(--select-option-background);
     overflow: hidden;
     will-change: transform;
+} .optionsListBorder {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    box-shadow: inset 0 0 0 1px var(--color-light-border-secondary);
+    border-radius: inherit;
+    pointer-events: none;
 } .nativeSelect {
     opacity: 0;
     overflow: hidden;

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

@@ -9,8 +9,8 @@ require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
 require('../arrow/Component.js');
-require('../../Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+require('../../Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('../field/Component.js');
 require('../optgroup/Component.js');
 require('../option/Component.js');

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

@@ -1 +1 @@
-export * from "../../Component-e9709f88";
+export * from "../../Component-afba64fc";

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('tslib');
 require('react');
 require('../arrow/Component.js');
@@ -12,7 +12,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
-require('../../Component-aaa9f3a7.js');
+require('../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/components/index.js

@@ -1,8 +1,8 @@
 'use strict';
 
 var components_arrow_Component = require('./arrow/Component.js');
-var components_baseSelect_Component = require('../Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-e9709f88.js');
+var components_baseSelect_Component = require('../Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-afba64fc.js');
 var components_field_Component = require('./field/Component.js');
 var components_optgroup_Component = require('./optgroup/Component.js');
 var components_option_Component = require('./option/Component.js');

package/cssm/components/options-list/Component.js

@@ -24,7 +24,8 @@ var createCounter = function () {
     return function () { return count++; };
 };
 var OptionsList = React.forwardRef(function (_a, ref) {
-    var _b = _a.size, size = _b === void 0 ? 's' : _b, className = _a.className, optionGroupClassName = _a.optionGroupClassName, Option = _a.Option, getOptionProps = _a.getOptionProps, _c = _a.options, options = _c === void 0 ? [] : _c, _d = _a.Optgroup, Optgroup = _d === void 0 ? components_optgroup_Component.Optgroup : _d, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _e = _a.visibleOptions, visibleOptions = _e === void 0 ? 5 : _e, onScroll = _a.onScroll, open = _a.open, header = _a.header, footer = _a.footer, optionsListWidth = _a.optionsListWidth, nativeScrollbarProp = _a.nativeScrollbar;
+    var _b;
+    var _c = _a.size, size = _c === void 0 ? 's' : _c, className = _a.className, optionGroupClassName = _a.optionGroupClassName, Option = _a.Option, getOptionProps = _a.getOptionProps, _d = _a.options, options = _d === void 0 ? [] : _d, _e = _a.Optgroup, Optgroup = _e === void 0 ? components_optgroup_Component.Optgroup : _e, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _f = _a.visibleOptions, visibleOptions = _f === void 0 ? 5 : _f, onScroll = _a.onScroll, open = _a.open, header = _a.header, footer = _a.footer, optionsListWidth = _a.optionsListWidth, nativeScrollbarProp = _a.nativeScrollbar, _g = _a.flatOptions, flatOptions = _g === void 0 ? [] : _g;
     var nativeScrollbar = hooks.useMedia([[true, '(max-width: 1023px)']], false)[0];
     nativeScrollbar = Boolean(nativeScrollbarProp !== null && nativeScrollbarProp !== void 0 ? nativeScrollbarProp : nativeScrollbar);
     var renderOption = function (option, index) { return (React__default.default.createElement(Option, tslib.__assign({ key: option.key }, getOptionProps(option, index)))); };
@@ -51,9 +52,11 @@ var OptionsList = React.forwardRef(function (_a, ref) {
     };
     var renderWithNativeScrollbar = function () { return (React__default.default.createElement("div", { className: styles__default.default.scrollable, ref: mergeRefs__default.default([listRef, ref]), onScroll: onScroll }, renderListItems())); };
     return (React__default.default.createElement("div", tslib.__assign({}, (nativeScrollbar && { 'data-test-id': dataTestId }), { className: cn__default.default(styles__default.default.optionsList, styles__default.default[size], className) }),
-        header,
+        header && React__default.default.createElement("div", { className: styles__default.default.optionsListHeader }, header),
         nativeScrollbar ? renderWithNativeScrollbar() : renderWithCustomScrollbar(),
-        footer));
+        footer && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.optionsListFooter, (_b = {},
+                _b[styles__default.default.withBorder] = visibleOptions && flatOptions.length > visibleOptions,
+                _b)) }, footer))));
 });
 
 exports.OptionsList = OptionsList;

package/cssm/components/options-list/index.module.css

@@ -1,5 +1,6 @@
 :root {
 } /* deprecated */ :root {
+    --color-light-border-secondary: #e7e9eb;
     --color-light-text-secondary: rgba(11, 31, 53, 0.7); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -32,7 +33,15 @@
     width: 100%;
     outline: none;
     box-sizing: border-box;
-} .scrollable {
+} .optionsListHeader {
+    box-sizing: border-box;
+    border-bottom: 1px solid var(--color-light-border-secondary);
+} .optionsListFooter {
+    box-sizing: border-box;
+    border-top: 1px solid transparent
+} .optionsListFooter.withBorder {
+        border-top: 1px solid var(--color-light-border-secondary);
+    } .scrollable {
     overflow: auto;
     width: 100%;
 } .emptyPlaceholder {

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

@@ -3,7 +3,7 @@
 require('tslib');
 require('react');
 require('../arrow/Component.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('../field/Component.js');
 require('../optgroup/Component.js');
 require('../option/Component.js');
@@ -15,7 +15,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
-require('../../Component-aaa9f3a7.js');
+require('../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/components/select-mobile/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-e9709f88";
+export * from "../../Component-afba64fc";

package/cssm/components/select-mobile/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('tslib');
 require('react');
 require('../arrow/Component.js');
@@ -12,7 +12,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
-require('../../Component-aaa9f3a7.js');
+require('../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/components/select-modal-mobile/Component.js

@@ -3,7 +3,7 @@
 require('tslib');
 require('react');
 require('../arrow/Component.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('../field/Component.js');
 require('../optgroup/Component.js');
 require('../option/Component.js');
@@ -15,7 +15,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
-require('../../Component-aaa9f3a7.js');
+require('../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/components/select-modal-mobile/index.d.ts

@@ -1 +1 @@
-export * from "../../Component-e9709f88";
+export * from "../../Component-afba64fc";

package/cssm/components/select-modal-mobile/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('tslib');
 require('react');
 require('../arrow/Component.js');
@@ -12,7 +12,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../Component.js');
-require('../../Component-aaa9f3a7.js');
+require('../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/components/virtual-options-list/Component.js

@@ -20,11 +20,12 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
 /* eslint-disable react-hooks/exhaustive-deps */
 // eslint-disable-next-line @typescript-eslint/no-redeclare
 var VirtualOptionsList = function (_a) {
-    var _b = _a.size, size = _b === void 0 ? 's' : _b, _c = _a.flatOptions, flatOptions = _c === void 0 ? [] : _c, _d = _a.highlightedIndex, highlightedIndex = _d === void 0 ? -1 : _d, className = _a.className, getOptionProps = _a.getOptionProps, Option = _a.Option, open = _a.open, _e = _a.options, options = _e === void 0 ? [] : _e, _f = _a.overscan, overscan = _f === void 0 ? 10 : _f, _g = _a.Optgroup, Optgroup = _g === void 0 ? components_optgroup_Component.Optgroup : _g, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _h = _a.visibleOptions, visibleOptions = _h === void 0 ? 5 : _h, onScroll = _a.onScroll, header = _a.header, footer = _a.footer, nativeScrollbarProp = _a.nativeScrollbar;
+    var _b;
+    var _c = _a.size, size = _c === void 0 ? 's' : _c, _d = _a.flatOptions, flatOptions = _d === void 0 ? [] : _d, _e = _a.highlightedIndex, highlightedIndex = _e === void 0 ? -1 : _e, className = _a.className, getOptionProps = _a.getOptionProps, Option = _a.Option, open = _a.open, _f = _a.options, options = _f === void 0 ? [] : _f, _g = _a.overscan, overscan = _g === void 0 ? 10 : _g, _h = _a.Optgroup, Optgroup = _h === void 0 ? components_optgroup_Component.Optgroup : _h, dataTestId = _a.dataTestId, emptyPlaceholder = _a.emptyPlaceholder, _j = _a.visibleOptions, visibleOptions = _j === void 0 ? 5 : _j, onScroll = _a.onScroll, header = _a.header, footer = _a.footer, nativeScrollbarProp = _a.nativeScrollbar;
     var listRef = React.useRef(null);
     var parentRef = React.useRef(null);
     var scrollbarRef = React.useRef(null);
-    var _j = React.useState(0), visibleOptionsInvalidateKey = _j[0], setVisibleOptionsInvalidateKey = _j[1];
+    var _k = React.useState(0), visibleOptionsInvalidateKey = _k[0], setVisibleOptionsInvalidateKey = _k[1];
     var prevHighlightedIndex = utils.usePrevious(highlightedIndex) || -1;
     var rowVirtualizer = reactVirtual.useVirtual({
         size: flatOptions.length,
@@ -113,10 +114,12 @@ var VirtualOptionsList = function (_a) {
     var renderWithNativeScrollbar = function () { return (React__default.default.createElement("div", { className: styles__default.default.scrollable, ref: parentRef, onScroll: onScroll },
         React__default.default.createElement("div", tslib.__assign({}, contentNodeProps), renderList()))); };
     return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.virtualOptionsList, styles__default.default[size], className), "data-test-id": dataTestId },
-        header,
+        header && React__default.default.createElement("div", { className: styles__default.default.virtualOptionsListHeader }, header),
         nativeScrollbar ? renderWithNativeScrollbar() : renderWithCustomScrollbar(),
         emptyPlaceholder && options.length === 0 && (React__default.default.createElement("div", { className: styles__default.default.emptyPlaceholder }, emptyPlaceholder)),
-        footer));
+        footer && (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.virtualOptionsListFooter, (_b = {},
+                _b[styles__default.default.withBorder] = visibleOptions && flatOptions.length > visibleOptions,
+                _b)) }, footer))));
 };
 
 exports.VirtualOptionsList = VirtualOptionsList;

package/cssm/components/virtual-options-list/index.module.css

@@ -1,6 +1,7 @@
 :root {
 } /* deprecated */ :root {
     --color-light-border-primary: #dbdee1;
+    --color-light-border-secondary: #e7e9eb;
     --color-light-text-secondary: rgba(11, 31, 53, 0.7); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
@@ -38,7 +39,15 @@
     outline: none;
     box-sizing: border-box;
     position: relative;
-} .scrollable {
+} .virtualOptionsListHeader {
+    box-sizing: border-box;
+    border-bottom: 1px solid var(--color-light-border-secondary);
+} .virtualOptionsListFooter {
+    box-sizing: border-box;
+    border-top: 1px solid transparent
+} .virtualOptionsListFooter.withBorder {
+        border-top: 1px solid var(--color-light-border-secondary);
+    } .scrollable {
     overflow: auto;
     width: 100%;
 } .inner {

package/cssm/index-3885b0d7.d.ts

@@ -1,3 +1,3 @@
 declare const isClient: () => boolean;
 export { isClient };
-export * from "./Component-aaa9f3a7";
+export * from "./Component-31b4153d";

package/cssm/index.js

@@ -2,8 +2,8 @@
 
 var Component = require('./Component.js');
 var components_arrow_Component = require('./components/arrow/Component.js');
-var components_baseSelect_Component = require('./Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-e9709f88.js');
+var components_baseSelect_Component = require('./Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('./Component-afba64fc.js');
 var components_field_Component = require('./components/field/Component.js');
 var components_optgroup_Component = require('./components/optgroup/Component.js');
 var components_option_Component = require('./components/option/Component.js');

package/cssm/presets/index.js

@@ -2,7 +2,7 @@
 
 var presets_useSelectWithLoading_hook = require('./useSelectWithLoading/hook.js');
 var presets_useLazyLoading_hook = require('./useLazyLoading/hook.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../Component-afba64fc.js');
 require('tslib');
 require('react');
 require('@alfalab/core-components-skeleton/cssm');
@@ -28,7 +28,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../Component.js');
-require('../Component-aaa9f3a7.js');
+require('../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/presets/useSelectWithApply/hook.js

@@ -6,8 +6,8 @@ require('../../Component.js');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('../../components/arrow/index.module.css');
-require('../../Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-e9709f88.js');
+require('../../Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../Component-afba64fc.js');
 require('@alfalab/core-components-form-control/cssm');
 require('@alfalab/hooks');
 require('../../utils.js');

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

@@ -2,12 +2,12 @@
 
 require('tslib');
 require('react');
-require('classnames');
 require('@alfalab/core-components-button/cssm');
+require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('../../../components/arrow/index.module.css');
-require('../../../Component-aaa9f3a7.js');
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-e9709f88.js');
+require('../../../Component-31b4153d.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-afba64fc.js');
 require('@alfalab/core-components-form-control/cssm');
 require('@alfalab/hooks');
 require('../../../components/field/index.module.css');

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

@@ -1 +1 @@
-export * from "../../../Component-e9709f88";
+export * from "../../../Component-afba64fc";

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-e9709f88.js');
+var presets_useSelectWithApply_optionsListWithApply_Component = require('../../../Component-afba64fc.js');
 require('tslib');
 require('react');
 require('../../../components/arrow/Component.js');
@@ -12,7 +12,7 @@ require('downshift');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('../../../Component.js');
-require('../../../Component-aaa9f3a7.js');
+require('../../../Component-31b4153d.js');
 require('@juggle/resize-observer');
 require('@alfalab/core-components-popover/cssm');
 require('@alfalab/hooks');

package/cssm/presets/useSelectWithApply/options-list-with-apply/index.module.css

@@ -1,7 +1,6 @@
 :root {
 } /* deprecated */ :root {
-    --color-light-bg-primary: #fff;
-    --color-light-border-secondary: #e7e9eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
+    --color-light-bg-primary: #fff; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
 } :root {
 } :root {
@@ -32,6 +31,4 @@
     outline: none
 } .footer > * + * {
         margin-left: var(--gap-xs);
-    } .withBorder {
-    box-shadow: inset 0 1px 0 var(--color-light-border-secondary);
-}
+    }

package/cssm/responsive.js

@@ -9,7 +9,7 @@ require('./components/arrow/Component.js');
 require('classnames');
 require('@alfalab/icons-glyph/ChevronDownMIcon');
 require('./components/arrow/index.module.css');
-require('./Component-aaa9f3a7.js');
+require('./Component-31b4153d.js');
 require('react-merge-refs');
 require('@juggle/resize-observer');
 require('downshift');
@@ -35,7 +35,7 @@ require('./components/option/index.module.css');
 require('./components/options-list/Component.js');
 require('@alfalab/core-components-scrollbar/cssm');
 require('./components/options-list/index.module.css');
-require('./Component-e9709f88.js');
+require('./Component-afba64fc.js');
 require('@alfalab/core-components-bottom-sheet/cssm');
 require('@alfalab/core-components-modal/cssm/mobile');
 require('react-virtual');

package/esm/{Component-be3db19b.js → Component-657977aa.js}

@@ -14,7 +14,7 @@ var getDataTestId = function (dataTestId, element) {
     return dataTestId ? "".concat(dataTestId).concat(elementPart) : undefined;
 };
 
-var styles = {"component":"select__component_jibdp","popoverInner":"select__popoverInner_jibdp","optionsList":"select__optionsList_jibdp","nativeSelect":"select__nativeSelect_jibdp","block":"select__block_jibdp"};
+var styles = {"component":"select__component_q4r9v","popoverInner":"select__popoverInner_q4r9v","optionsList":"select__optionsList_q4r9v","optionsListBorder":"select__optionsListBorder_q4r9v","nativeSelect":"select__nativeSelect_q4r9v","block":"select__block_q4r9v"};
 require('./components/base-select/index.css')
 
 var BaseSelect = forwardRef(function (_a, ref) {
@@ -236,7 +236,8 @@ var BaseSelect = forwardRef(function (_a, ref) {
             }, dataTestId: getDataTestId(dataTestId, 'field') }, fieldProps)),
         name && !nativeSelect && renderValue(),
         !nativeSelect && (React.createElement(Popover, { open: open, withTransition: false, anchorElement: fieldRef.current, position: popoverPosition, preventFlip: preventFlip, popperClassName: cn(styles.popoverInner, popperClassName), update: updatePopover, zIndex: zIndexPopover }, needRenderOptionsList && (React.createElement("div", __assign({}, menuProps, { className: cn(optionsListClassName, styles.optionsList) }),
-            React.createElement(OptionsList, __assign({}, optionsListProps, { optionsListWidth: optionsListWidth, flatOptions: flatOptions, highlightedIndex: highlightedIndex, open: open, size: size, options: options, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, visibleOptions: visibleOptions, onScroll: onScroll, dataTestId: getDataTestId(dataTestId, 'options-list') }))))))));
+            React.createElement(OptionsList, __assign({}, optionsListProps, { optionsListWidth: optionsListWidth, flatOptions: flatOptions, highlightedIndex: highlightedIndex, open: open, size: size, options: options, Optgroup: Optgroup, Option: Option, selectedItems: selectedItems, setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, getOptionProps: getOptionProps, visibleOptions: visibleOptions, onScroll: onScroll, dataTestId: getDataTestId(dataTestId, 'options-list') })),
+            React.createElement("div", { className: styles.optionsListBorder })))))));
 });
 
 export { BaseSelect as B, getDataTestId as g };