@alfalab/core-components 47.12.0 → 47.12.1-beta.1

package/select/components/field/Component.js

@@ -6,18 +6,19 @@ var cn = require('classnames');
 var coreComponentsShared = require('../../../shared');
 var hooks = require('@alfalab/hooks');
 var utils = require('../../utils.js');
+var components_clearButton_Component = require('../clear-button/Component.js');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"select__component_1aouc","field":"select__field_1aouc","disabled":"select__disabled_1aouc","arrow":"select__arrow_1aouc","placeholder":"select__placeholder_1aouc","show-placeholder":"select__show-placeholder_1aouc","focused":"select__focused_1aouc","contentWrapper":"select__contentWrapper_1aouc","value":"select__value_1aouc","focusVisible":"select__focusVisible_1aouc"};
+var styles = {"component":"select__component_1b4z0","field":"select__field_1b4z0","disabled":"select__disabled_1b4z0","arrow":"select__arrow_1b4z0","placeholder":"select__placeholder_1b4z0","show-placeholder":"select__show-placeholder_1b4z0","focused":"select__focused_1b4z0","contentWrapper":"select__contentWrapper_1b4z0","value":"select__value_1b4z0","focusVisible":"select__focusVisible_1b4z0"};
 require('./index.css');
 
 var Field = function (_a) {
     var _b, _c;
-    var _d = _a.size, size = _d === void 0 ? 56 : _d, open = _a.open; _a.multiple; var error = _a.error, hint = _a.hint, disabled = _a.disabled, label = _a.label, _e = _a.labelView, labelView = _e === void 0 ? 'inner' : _e, placeholder = _a.placeholder, _f = _a.selectedMultiple, selectedMultiple = _f === void 0 ? [] : _f, selected = _a.selected, rightAddons = _a.rightAddons, _g = _a.valueRenderer, valueRenderer = _g === void 0 ? utils.joinOptions : _g; _a.setSelectedItems; _a.toggleMenu; var Arrow = _a.Arrow, innerProps = _a.innerProps, dataTestId = _a.dataTestId, fieldClassName = _a.fieldClassName, FormControlComponent = _a.FormControlComponent, restProps = tslib.__rest(_a, ["size", "open", "multiple", "error", "hint", "disabled", "label", "labelView", "placeholder", "selectedMultiple", "selected", "rightAddons", "valueRenderer", "setSelectedItems", "toggleMenu", "Arrow", "innerProps", "dataTestId", "fieldClassName", "FormControlComponent"]);
+    var _d = _a.size, size = _d === void 0 ? 56 : _d, open = _a.open; _a.multiple; var error = _a.error, hint = _a.hint, disabled = _a.disabled, label = _a.label, _e = _a.labelView, labelView = _e === void 0 ? 'inner' : _e, placeholder = _a.placeholder, _f = _a.selectedMultiple, selectedMultiple = _f === void 0 ? [] : _f, selected = _a.selected, rightAddons = _a.rightAddons, _g = _a.valueRenderer, valueRenderer = _g === void 0 ? utils.joinOptions : _g; _a.setSelectedItems; _a.toggleMenu; var Arrow = _a.Arrow, innerProps = _a.innerProps, dataTestId = _a.dataTestId, fieldClassName = _a.fieldClassName, FormControlComponent = _a.FormControlComponent, clear = _a.clear, onClear = _a.onClear, restProps = tslib.__rest(_a, ["size", "open", "multiple", "error", "hint", "disabled", "label", "labelView", "placeholder", "selectedMultiple", "selected", "rightAddons", "valueRenderer", "setSelectedItems", "toggleMenu", "Arrow", "innerProps", "dataTestId", "fieldClassName", "FormControlComponent", "clear", "onClear"]);
     var _h = React.useState(false), focused = _h[0], setFocused = _h[1];
     var wrapperRef = React.useRef(null);
     var focusVisible = hooks.useFocus(wrapperRef, 'keyboard')[0];
@@ -32,6 +33,7 @@ var Field = function (_a) {
             _b[styles.focusVisible] = focusVisible,
             _b)), 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__default.default.createElement(React__default.default.Fragment, null,
             rightAddons,
+            clear && filled ? (React__default.default.createElement(components_clearButton_Component.ClearButton, { onClick: onClear, disabled: disabled, dataTestId: coreComponentsShared.getDataTestId(dataTestId, 'clear-icon') })) : null,
             Arrow
                 ? React__default.default.cloneElement(Arrow, { className: styles.arrow })
                 : null)), "data-test-id": dataTestId }, restProps, innerProps),

package/select/components/field/index.css

@@ -1,4 +1,4 @@
-/* hash: 3cl4v */
+/* hash: crpgo */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-status-info: #2288fa;
@@ -46,22 +46,22 @@
     /* checkmark */
 
     /* optgroup */
-} .select__component_1aouc {
+} .select__component_1b4z0 {
     width: 100%;
     outline: none;
-} .select__field_1aouc:not(.select__disabled_1aouc) {
+} .select__field_1b4z0:not(.select__disabled_1b4z0) {
     cursor: pointer
-} .select__field_1aouc:not(.select__disabled_1aouc):hover .select__arrow_1aouc {
+} .select__field_1b4z0:not(.select__disabled_1b4z0):hover .select__arrow_1b4z0 {
             opacity: var(--select-arrow-hover-opacity);
-        } .select__disabled_1aouc {
+        } .select__disabled_1b4z0 {
     cursor: var(--disabled-cursor);
-} .select__placeholder_1aouc {
+} .select__placeholder_1b4z0 {
     color: var(--input-placeholder-color);
     transition: color 0.2s ease;
-    animation: select__show-placeholder_1aouc 0.2s ease
-} .select__placeholder_1aouc.select__focused_1aouc {
+    animation: select__show-placeholder_1b4z0 0.2s ease
+} .select__placeholder_1b4z0.select__focused_1b4z0 {
         color: var(--input-focus-placeholder-color);
-    } .select__contentWrapper_1aouc {
+    } .select__contentWrapper_1b4z0 {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -70,14 +70,14 @@
     text-overflow: ellipsis;
     overflow: hidden;
     width: 100%;
-} .select__value_1aouc {
+} .select__value_1b4z0 {
     overflow: hidden;
     text-overflow: ellipsis;
     text-align: left;
-} .select__focusVisible_1aouc {
+} .select__focusVisible_1b4z0 {
     outline: 2px solid var(--focus-color);
     outline-offset: 2px;
-} @keyframes select__show-placeholder_1aouc {
+} @keyframes select__show-placeholder_1b4z0 {
     from {
         opacity: 0;
     }

package/select/components/footer/Component.js

@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"footer":"select__footer_10sht","button":"select__button_10sht","highlighted":"select__highlighted_10sht"};
+var styles = {"footer":"select__footer_hg2tt","button":"select__button_hg2tt","highlighted":"select__highlighted_hg2tt"};
 require('./index.css');
 
 var Footer = function (_a) {

package/select/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: 6oj7n */
+/* hash: h5enl */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -30,17 +30,17 @@
     /* checkmark */
 
     /* optgroup */
-} .select__footer_10sht {
+} .select__footer_hg2tt {
     display: flex;
     box-sizing: border-box;
     width: 100%;
     padding: var(--gap-m) var(--gap-m);
     background-color: var(--color-light-modal-bg-primary)
-} .select__footer_10sht .select__button_10sht:first-of-type {
+} .select__footer_hg2tt .select__button_hg2tt:first-of-type {
         margin-right: var(--gap-m);
-    } .select__button_10sht {
+    } .select__button_hg2tt {
     width: 50%;
-} .select__highlighted_10sht {
+} .select__highlighted_hg2tt {
     border-top: 1px solid var(--color-light-neutral-300);
     background-color: var(--color-light-modal-bg-primary);
 }

package/select/components/optgroup/Component.js

@@ -9,7 +9,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"optgroup":"select__optgroup_1sdkg","label":"select__label_1sdkg","size-64":"select__size-64_1sdkg","size-72":"select__size-72_1sdkg"};
+var styles = {"optgroup":"select__optgroup_bdqqh","label":"select__label_bdqqh","size-64":"select__size-64_bdqqh","size-72":"select__size-72_bdqqh"};
 require('./index.css');
 
 var Optgroup = function (_a) {

package/select/components/optgroup/index.css

@@ -1,4 +1,4 @@
-/* hash: 1s9d9 */
+/* hash: titsl */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -39,7 +39,7 @@
     --select-optgroup-right-padding: var(--gap-s);
     --select-optgroup-l-left-padding: var(--gap-m);
     --select-optgroup-l-right-padding: var(--gap-m);
-} .select__optgroup_1sdkg {
+} .select__optgroup_bdqqh {
     position: relative;
     display: flex;
     align-items: center;
@@ -48,9 +48,9 @@
     box-sizing: border-box;
     background: var(--select-optgroup-background);
     min-height: 40px
-} .select__optgroup_1sdkg + *[role='option']:before {
+} .select__optgroup_bdqqh + *[role='option']:before {
         display: none;
-    } .select__label_1sdkg {
+    } .select__label_bdqqh {
     font-size: 12px;
     line-height: 16px;
     font-weight: 500;
@@ -59,8 +59,8 @@
 
     display: block;
     color: var(--select-optgroup-color);
-} .select__size-64_1sdkg,
-.select__size-72_1sdkg {
+} .select__size-64_bdqqh,
+.select__size-72_bdqqh {
     padding-left: var(--select-optgroup-l-left-padding);
     padding-right: var(--select-optgroup-l-right-padding);
 }

package/select/components/option/Component.js

@@ -12,7 +12,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"option":"select__option_1d5dw","disabled":"select__disabled_1d5dw","size-48":"select__size-48_1d5dw","size-56":"select__size-56_1d5dw","size-64":"select__size-64_1d5dw","size-72":"select__size-72_1d5dw","selected":"select__selected_1d5dw","highlighted":"select__highlighted_1d5dw","content":"select__content_1d5dw","textContent":"select__textContent_1d5dw"};
+var styles = {"option":"select__option_v43kj","disabled":"select__disabled_v43kj","size-48":"select__size-48_v43kj","size-56":"select__size-56_v43kj","size-64":"select__size-64_v43kj","size-72":"select__size-72_v43kj","selected":"select__selected_v43kj","highlighted":"select__highlighted_v43kj","content":"select__content_v43kj","textContent":"select__textContent_v43kj"};
 require('./index.css');
 
 var Option = function (_a) {

package/select/components/option/index.css

@@ -1,4 +1,4 @@
-/* hash: 11nv8 */
+/* hash: cz0if */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-modal-bg-primary: #fff;
@@ -57,7 +57,7 @@
     /* checkmark */
 
     /* optgroup */
-} .select__option_1d5dw {
+} .select__option_v43kj {
     font-size: 16px;
     line-height: 20px;
     font-weight: 400;
@@ -72,10 +72,10 @@
     box-sizing: border-box;
     position: relative;
     cursor: pointer
-} .select__option_1d5dw:not(.select__disabled_1d5dw):active {
+} .select__option_v43kj:not(.select__disabled_v43kj):active {
         background: var(--select-option-active-background);
         color: var(--select-option-active-color);
-    } .select__option_1d5dw:before {
+    } .select__option_v43kj:before {
         content: '';
         position: absolute;
         left: var(--select-option-left-padding);
@@ -85,43 +85,43 @@
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
         transition: opacity 0.2s ease;
-    } .select__option_1d5dw:first-child:before {
+    } .select__option_v43kj:first-child:before {
         display: none;
-    } .select__size-48_1d5dw {
+    } .select__size-48_v43kj {
     min-height: var(--size-s-height);
-} .select__size-56_1d5dw {
+} .select__size-56_v43kj {
     min-height: var(--size-m-height);
-} .select__size-64_1d5dw {
+} .select__size-64_v43kj {
     min-height: var(--size-l-height);
-} .select__size-72_1d5dw {
+} .select__size-72_v43kj {
     min-height: var(--size-xl-height);
-} .select__size-64_1d5dw,
-.select__size-72_1d5dw {
+} .select__size-64_v43kj,
+.select__size-72_v43kj {
     padding-left: var(--select-option-l-left-padding);
     padding-right: var(--select-option-l-right-padding)
-} .select__size-64_1d5dw:before, .select__size-72_1d5dw:before {
+} .select__size-64_v43kj:before, .select__size-72_v43kj:before {
         left: var(--select-option-l-left-padding);
         right: var(--select-option-l-right-padding);
-    } .select__selected_1d5dw {
+    } .select__selected_v43kj {
     background: var(--select-option-selected-background);
     color: var(--select-option-selected-color);
     cursor: default;
-} .select__highlighted_1d5dw {
+} .select__highlighted_v43kj {
     background: var(--select-option-hover-background);
     color: var(--select-option-hover-color)
-} .select__highlighted_1d5dw:before,
-    .select__highlighted_1d5dw + .select__option_1d5dw:before {
+} .select__highlighted_v43kj:before,
+    .select__highlighted_v43kj + .select__option_v43kj:before {
         opacity: 0;
-    } .select__disabled_1d5dw {
+    } .select__disabled_v43kj {
     cursor: var(--disabled-cursor);
     background: var(--select-option-disabled-background);
     color: var(--select-option-disabled-color);
-} .select__content_1d5dw {
+} .select__content_v43kj {
     overflow: hidden;
     flex: 1;
     text-overflow: ellipsis;
     white-space: nowrap;
-} .select__textContent_1d5dw {
+} .select__textContent_v43kj {
     padding-top: var(--gap-s);
     padding-bottom: var(--gap-s);
 }

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

@@ -17,7 +17,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"optionsList":"select__optionsList_trwiv","optionsListHeader":"select__optionsListHeader_trwiv","headerHighlighted":"select__headerHighlighted_trwiv","optionsListFooter":"select__optionsListFooter_trwiv","withBorder":"select__withBorder_trwiv","scrollable":"select__scrollable_trwiv","emptyPlaceholder":"select__emptyPlaceholder_trwiv","size-64":"select__size-64_trwiv","size-72":"select__size-72_trwiv"};
+var styles = {"optionsList":"select__optionsList_1d4bi","optionsListHeader":"select__optionsListHeader_1d4bi","headerHighlighted":"select__headerHighlighted_1d4bi","optionsListFooter":"select__optionsListFooter_1d4bi","withBorder":"select__withBorder_1d4bi","scrollable":"select__scrollable_1d4bi","emptyPlaceholder":"select__emptyPlaceholder_1d4bi","size-64":"select__size-64_1d4bi","size-72":"select__size-72_1d4bi"};
 require('./index.css');
 
 var createCounter = function () {

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

@@ -1,4 +1,4 @@
-/* hash: 13wy5 */
+/* hash: a4tde */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-neutral-300: #e7e8eb;
@@ -33,32 +33,32 @@
     /* checkmark */
 
     /* optgroup */
-} .select__optionsList_trwiv {
+} .select__optionsList_1d4bi {
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: relative;
-} .select__optionsListHeader_trwiv {
+} .select__optionsListHeader_1d4bi {
     box-sizing: border-box;
     border-bottom: 1px solid transparent;
     transition: border-color 0.2s ease
-} .select__optionsListHeader_trwiv.select__headerHighlighted_trwiv {
+} .select__optionsListHeader_1d4bi.select__headerHighlighted_1d4bi {
         border-bottom-color: var(--color-light-neutral-300);
-    } .select__optionsListFooter_trwiv {
+    } .select__optionsListFooter_1d4bi {
     position: sticky;
     bottom: 0;
     box-sizing: border-box;
     border-top: 1px solid transparent;
     transition: border-color 0.2s ease
-} .select__optionsListFooter_trwiv.select__withBorder_trwiv {
+} .select__optionsListFooter_1d4bi.select__withBorder_1d4bi {
         border-top-color: var(--color-light-neutral-300);
-    } .select__scrollable_trwiv {
+    } .select__scrollable_1d4bi {
     overflow: auto;
     width: 100%;
-} .select__emptyPlaceholder_trwiv {
+} .select__emptyPlaceholder_1d4bi {
     padding: var(--gap-m) var(--gap-s);
     color: var(--select-options-list-empty-placeholder-color);
-} .select__size-64_trwiv .select__emptyPlaceholder_trwiv,
-.select__size-72_trwiv .select__emptyPlaceholder_trwiv {
+} .select__size-64_1d4bi .select__emptyPlaceholder_1d4bi,
+.select__size-72_1d4bi .select__emptyPlaceholder_1d4bi {
     padding: var(--gap-xl) var(--gap-m);
 }

package/select/components/search/Component.js

@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"component":"select__component_1p97u"};
+var styles = {"component":"select__component_1ppci"};
 require('./index.css');
 
 var Search = React.forwardRef(function (_a, ref) {

package/select/components/search/index.css

@@ -1,4 +1,4 @@
-/* hash: 1cian */
+/* hash: 17vd7 */
 :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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* 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 */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -27,6 +27,6 @@
     /* checkmark */
 
     /* optgroup */
-} .select__component_1p97u.select__component_1p97u {
+} .select__component_1ppci.select__component_1ppci {
     width: auto;
 }

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

@@ -18,7 +18,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
 var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
 
-var styles = {"virtualOptionsList":"select__virtualOptionsList_1fxun","virtualOptionsListHeader":"select__virtualOptionsListHeader_1fxun","virtualOptionsListFooter":"select__virtualOptionsListFooter_1fxun","withBorder":"select__withBorder_1fxun","scrollable":"select__scrollable_1fxun","inner":"select__inner_1fxun","virtualRow":"select__virtualRow_1fxun","highlighted":"select__highlighted_1fxun","emptyPlaceholder":"select__emptyPlaceholder_1fxun","size-64":"select__size-64_1fxun","size-72":"select__size-72_1fxun"};
+var styles = {"virtualOptionsList":"select__virtualOptionsList_1gsun","virtualOptionsListHeader":"select__virtualOptionsListHeader_1gsun","virtualOptionsListFooter":"select__virtualOptionsListFooter_1gsun","withBorder":"select__withBorder_1gsun","scrollable":"select__scrollable_1gsun","inner":"select__inner_1gsun","virtualRow":"select__virtualRow_1gsun","highlighted":"select__highlighted_1gsun","emptyPlaceholder":"select__emptyPlaceholder_1gsun","size-64":"select__size-64_1gsun","size-72":"select__size-72_1gsun"};
 require('./index.css');
 
 var VirtualOptionsList = React.forwardRef(function (_a, ref) {

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

@@ -1,4 +1,4 @@
-/* hash: 1ouhz */
+/* hash: 1xbpa */
 :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 */ /* 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 */ /* deprecated */ /* deprecated */
 } /* deprecated */ :root {
     --color-light-neutral-300: #e7e8eb;
@@ -39,35 +39,35 @@
     /* checkmark */
 
     /* optgroup */
-} .select__virtualOptionsList_1fxun {
+} .select__virtualOptionsList_1gsun {
     width: 100%;
     outline: none;
     box-sizing: border-box;
     position: sticky;
     justify-content: space-between;
-} .select__virtualOptionsListHeader_1fxun {
+} .select__virtualOptionsListHeader_1gsun {
     box-sizing: border-box;
     border-bottom: 1px solid var(--color-light-neutral-300);
-} .select__virtualOptionsListFooter_1fxun {
+} .select__virtualOptionsListFooter_1gsun {
     position: sticky;
     bottom: 0;
     box-sizing: border-box;
     border-top: 1px solid transparent
-} .select__virtualOptionsListFooter_1fxun.select__withBorder_1fxun {
+} .select__virtualOptionsListFooter_1gsun.select__withBorder_1gsun {
         border-top: 1px solid var(--color-light-neutral-300);
-    } .select__scrollable_1fxun {
+    } .select__scrollable_1gsun {
     position: relative;
     overflow: auto;
     width: 100%;
-} .select__inner_1fxun {
+} .select__inner_1gsun {
     position: relative;
     width: 100%;
-} .select__virtualRow_1fxun {
+} .select__virtualRow_1gsun {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%
-} .select__virtualRow_1fxun:before {
+} .select__virtualRow_1gsun:before {
         content: '';
         position: absolute;
         z-index: 1;
@@ -77,16 +77,16 @@
         height: 1px;
         background: var(--select-option-divider-background);
         display: var(--select-option-divider-display);
-    } .select__virtualRow_1fxun:first-child:before {
+    } .select__virtualRow_1gsun:first-child:before {
         display: none;
-    } .select__highlighted_1fxun:before,
-    .select__highlighted_1fxun + .select__virtualRow_1fxun:before {
+    } .select__highlighted_1gsun:before,
+    .select__highlighted_1gsun + .select__virtualRow_1gsun:before {
         display: none;
-    } .select__emptyPlaceholder_1fxun {
+    } .select__emptyPlaceholder_1gsun {
     padding: var(--gap-m) var(--gap-s);
     color: var(--select-options-list-empty-placeholder-color);
     flex: 1;
-} .select__size-64_1fxun .select__emptyPlaceholder_1fxun,
-.select__size-72_1fxun .select__emptyPlaceholder_1fxun {
+} .select__size-64_1gsun .select__emptyPlaceholder_1gsun,
+.select__size-72_1gsun .select__emptyPlaceholder_1gsun {
     padding: var(--gap-xl) var(--gap-m);
 }

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

@@ -35,7 +35,7 @@ var BaseSelect = React.forwardRef(
 function (props, ref) {
     var _a;
     var _b, _c;
-    var dataTestId = props.dataTestId, className = props.className, fieldClassName = props.fieldClassName, optionGroupClassName = props.optionGroupClassName, optionsListClassName = props.optionsListClassName, optionClassName = props.optionClassName, options = props.options, _d = props.autocomplete, autocomplete = _d === void 0 ? false : _d, _e = props.multiple, multiple = _e === void 0 ? false : _e, _f = props.allowUnselect, allowUnselect = _f === void 0 ? false : _f, _g = props.disabled, disabled = _g === void 0 ? false : _g, _h = props.closeOnSelect, closeOnSelect = _h === void 0 ? !multiple : _h, _j = props.circularNavigation, circularNavigation = _j === void 0 ? false : _j, _k = props.nativeSelect, nativeSelect = _k === void 0 ? false : _k, _l = props.defaultOpen, defaultOpen = _l === void 0 ? false : _l, openProp = props.open, _m = props.optionsListWidth, optionsListWidth = _m === void 0 ? 'content' : _m, name = props.name, id = props.id, selected = props.selected, _o = props.size, size = _o === void 0 ? 48 : _o, _p = props.optionsSize, optionsSize = _p === void 0 ? size : _p, error = props.error, hint = props.hint, block = props.block, label = props.label, labelView = props.labelView, placeholder = props.placeholder, _q = props.fieldProps, fieldProps = _q === void 0 ? {} : _q, _r = props.optionsListProps, optionsListProps = _r === void 0 ? {} : _r, _s = props.optionProps, optionProps = _s === void 0 ? {} : _s, _t = props.groupOptionProps, groupOptionProps = _t === void 0 ? {} : _t, _u = props.searchProps, searchProps = _u === void 0 ? {} : _u, _v = props.showSearch, showSearch = _v === void 0 ? false : _v, valueRenderer = props.valueRenderer, onChange = props.onChange, onOpen = props.onOpen, onFocus = props.onFocus, onBlur = props.onBlur, onScroll = props.onScroll, Arrow = props.Arrow, _w = props.Field, Field = _w === void 0 ? function () { return null; } : _w, _x = props.OptionsList, OptionsList = _x === void 0 ? function () { return null; } : _x, _y = props.Optgroup, Optgroup = _y === void 0 ? function () { return null; } : _y, _z = props.Option, Option = _z === void 0 ? function () { return null; } : _z, _0 = props.Search, Search = _0 === void 0 ? function () { return null; } : _0, _1 = props.showEmptyOptionsList, showEmptyOptionsList = _1 === void 0 ? false : _1, visibleOptions = props.visibleOptions, view = props.view, _2 = props.isBottomSheet, isBottomSheet = _2 === void 0 ? true : _2, modalProps = props.modalProps, bottomSheetProps = props.bottomSheetProps, limitDynamicOptionGroupSize = props.limitDynamicOptionGroupSize;
+    var dataTestId = props.dataTestId, className = props.className, fieldClassName = props.fieldClassName, optionGroupClassName = props.optionGroupClassName, optionsListClassName = props.optionsListClassName, optionClassName = props.optionClassName, options = props.options, _d = props.autocomplete, autocomplete = _d === void 0 ? false : _d, _e = props.multiple, multiple = _e === void 0 ? false : _e, _f = props.allowUnselect, allowUnselect = _f === void 0 ? false : _f, _g = props.disabled, disabled = _g === void 0 ? false : _g, _h = props.closeOnSelect, closeOnSelect = _h === void 0 ? !multiple : _h, _j = props.circularNavigation, circularNavigation = _j === void 0 ? false : _j, _k = props.nativeSelect, nativeSelect = _k === void 0 ? false : _k, _l = props.defaultOpen, defaultOpen = _l === void 0 ? false : _l, openProp = props.open, _m = props.optionsListWidth, optionsListWidth = _m === void 0 ? 'content' : _m, name = props.name, id = props.id, selected = props.selected, _o = props.size, size = _o === void 0 ? 48 : _o, _p = props.optionsSize, optionsSize = _p === void 0 ? size : _p, error = props.error, hint = props.hint, block = props.block, label = props.label, labelView = props.labelView, placeholder = props.placeholder, _q = props.fieldProps, fieldProps = _q === void 0 ? {} : _q, _r = props.optionsListProps, optionsListProps = _r === void 0 ? {} : _r, _s = props.optionProps, optionProps = _s === void 0 ? {} : _s, _t = props.groupOptionProps, groupOptionProps = _t === void 0 ? {} : _t, _u = props.searchProps, searchProps = _u === void 0 ? {} : _u, _v = props.showSearch, showSearch = _v === void 0 ? false : _v, valueRenderer = props.valueRenderer, onChange = props.onChange, onOpen = props.onOpen, onFocus = props.onFocus, onBlur = props.onBlur, onScroll = props.onScroll, onClear = props.onClear, clear = props.clear, Arrow = props.Arrow, _w = props.Field, Field = _w === void 0 ? function () { return null; } : _w, _x = props.OptionsList, OptionsList = _x === void 0 ? function () { return null; } : _x, _y = props.Optgroup, Optgroup = _y === void 0 ? function () { return null; } : _y, _z = props.Option, Option = _z === void 0 ? function () { return null; } : _z, _0 = props.Search, Search = _0 === void 0 ? function () { return null; } : _0, _1 = props.showEmptyOptionsList, showEmptyOptionsList = _1 === void 0 ? false : _1, visibleOptions = props.visibleOptions, view = props.view, _2 = props.isBottomSheet, isBottomSheet = _2 === void 0 ? true : _2, modalProps = props.modalProps, bottomSheetProps = props.bottomSheetProps, limitDynamicOptionGroupSize = props.limitDynamicOptionGroupSize;
     var shouldSearchBlurRef = React.useRef(true);
     var rootRef = React.useRef(null);
     var fieldRef = React.useRef(null);
@@ -342,6 +342,10 @@ function (props, ref) {
             : (selectedItems[0] || {}).key;
         return (React__default.default.createElement(components_nativeSelect_Component.NativeSelect, tslib.__assign({}, menuProps, { className: styles__default.default.nativeSelect, disabled: disabled, multiple: multiple, name: name, value: value, onChange: handleNativeSelectChange, options: filteredOptions })));
     };
+    var handleFieldClear = function (event) {
+        setSelectedItems([]);
+        onClear === null || onClear === void 0 ? void 0 : onClear(event);
+    };
     var renderSearch = function () {
         var _a;
         var _b, _c;
@@ -400,7 +404,7 @@ function (props, ref) {
     };
     return (React__default.default.createElement("div", tslib.__assign({}, (disabled && { 'aria-disabled': true }), { "aria-expanded": inputProps['aria-expanded'], "aria-haspopup": 'listbox', role: inputProps.role, className: cn__default.default(styles__default.default.component, (_a = {}, _a[styles__default.default.block] = block, _a), className), ref: rootRef, onKeyDown: disabled ? undefined : handleFieldKeyDown, tabIndex: -1, "data-test-id": coreComponentsShared.getDataTestId(dataTestId) }),
         nativeSelect && renderNativeSelect(),
-        React__default.default.createElement(Field, tslib.__assign({ selectedMultiple: selectedItems, selected: selectedItems[0], setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, multiple: multiple, open: open, disabled: disabled, size: size, placeholder: placeholder, label: label && React__default.default.createElement("span", tslib.__assign({}, getLabelProps()), label), labelView: labelView, Arrow: Arrow && React__default.default.createElement(Arrow, { open: open }), error: error, hint: hint, valueRenderer: valueRenderer, className: fieldClassName, innerProps: {
+        React__default.default.createElement(Field, tslib.__assign({ selectedMultiple: selectedItems, selected: selectedItems[0], setSelectedItems: setSelectedItems, toggleMenu: toggleMenu, multiple: multiple, open: open, disabled: disabled, size: size, placeholder: placeholder, label: label && React__default.default.createElement("span", tslib.__assign({}, getLabelProps()), label), labelView: labelView, Arrow: Arrow && React__default.default.createElement(Arrow, { open: open }), error: error, hint: hint, valueRenderer: valueRenderer, className: fieldClassName, clear: clear, onClear: handleFieldClear, innerProps: {
                 onBlur: handleFieldBlur,
                 onFocus: disabled ? undefined : handleFieldFocus,
                 onClick: disabled ? undefined : handleFieldClick,

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

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

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

@@ -0,0 +1,19 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var coreComponentsButton = require('../../../../button/cssm');
+var CrossCircleMIcon = require('@alfalab/icons-glyph/CrossCircleMIcon');
+var styles = require('./index.module.css');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
+
+var ClearButton = function (_a) {
+    var disabled = _a.disabled, onClick = _a.onClick, dataTestId = _a.dataTestId;
+    return (React__default.default.createElement(coreComponentsButton.Button, { type: 'button', view: 'text', disabled: disabled, "aria-label": '\u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C', className: styles__default.default.clearButton, onClick: onClick, tabIndex: -1, dataTestId: dataTestId },
+        React__default.default.createElement(CrossCircleMIcon.CrossCircleMIcon, { className: styles__default.default.clearIcon })));
+};
+
+exports.ClearButton = ClearButton;

package/select/cssm/components/clear-button/index.d.ts

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

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

@@ -0,0 +1,7 @@
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var components_clearButton_Component = require('./Component.js');
+
+
+
+exports.ClearButton = components_clearButton_Component.ClearButton;