@semcore/select 2.7.11 → 3.0.1

package/CHANGELOG.md

@@ -2,6 +2,28 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [3.0.1] - 2022-05-18
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/base-trigger` [3.0.0 ~> 3.0.1], `@semcore/icon` [2.24.0 ~> 2.25.0], `@semcore/input` [3.0.0 ~> 3.0.1]).
+
+## [3.0.0] - 2022-05-17
+
+### BREAK
+
+- Remove support to used `Select.InputSearch`
+- Remove support properties `selectedOptions, defaultSelectedOptions` for `Select`
+- Remove support `Select.OptionCheckbox`
+- `Select.Option.Checkbox` used only two sizes `l, m`
+- Updated styles according to the library redesign policy.
+
+## [2.7.12] - 2022-05-16
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/base-trigger` [2.6.4 ~> 2.6.5], `@semcore/icon` [2.21.0 ~> 2.24.0]).
+
 ## [2.7.11] - 2022-04-28
 
 ### Changed

package/lib/cjs/InputSearch.js

@@ -33,16 +33,10 @@ var _flexBox = require("@semcore/flex-box");
 
 var _input = _interopRequireDefault(require("@semcore/input"));
 
-var _divider = _interopRequireDefault(require("@semcore/divider"));
-
 var _m = _interopRequireDefault(require("@semcore/icon/Search/m"));
 
 var _m2 = _interopRequireDefault(require("@semcore/icon/Close/m"));
 
-var _l = _interopRequireDefault(require("@semcore/icon/Search/l"));
-
-var _l2 = _interopRequireDefault(require("@semcore/icon/Close/l"));
-
 var _Select = _interopRequireDefault(require("./Select"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -58,20 +52,19 @@ var style = (
 /*__reshadow_css_start__*/
 _core.sstyled.insert(
 /*__inner_css_start__*/
-".___SInputSearch_13jdl_gg_._size_m_13jdl_gg_{padding:8px}.___SInputSearch_13jdl_gg_._size_l_13jdl_gg_{padding:10px 8px}.___SInputSearch_13jdl_gg_._size_xl_13jdl_gg_{padding:12px 12px}"
+".___SInputSearch_qj5zn_gg_.__size_qj5zn_gg_{padding:0}.___SInputSearch_qj5zn_gg_>[data-ui-name=Input]:first-child>[data-ui-name=InputSearch]~div{top:-1px;left:-1px;width:100%;border-radius:6px 6px 0 0}.___SInputSearch_qj5zn_gg_._size_m_qj5zn_gg_>[data-ui-name=Input]:first-child{height:32px}.___SInputSearch_qj5zn_gg_ [data-ui-name=\"Input.Addon\"]:last-of-type{visibility:hidden}.___SInputSearch_qj5zn_gg_.__filled_qj5zn_gg_ [data-ui-name=\"Input.Addon\"]:last-of-type{visibility:visible}"
 /*__inner_css_end__*/
-, "1wjnxbk_gg_")
+, "16lophm_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SInputSearch": "___SInputSearch_13jdl_gg_",
-  "_size_m": "_size_m_13jdl_gg_",
-  "_size_l": "_size_l_13jdl_gg_",
-  "_size_xl": "_size_xl_13jdl_gg_"
+  "__SInputSearch": "___SInputSearch_qj5zn_gg_",
+  "_size": "__size_qj5zn_gg_",
+  "_size_m": "_size_m_qj5zn_gg_",
+  "_filled": "__filled_qj5zn_gg_"
 });
 var MAP_SIZE_TO_ICON = {
   m: [_m["default"], _m2["default"]],
-  l: [_m["default"], _m2["default"]],
-  xl: [_l["default"], _l2["default"]]
+  l: [_m["default"], _m2["default"]]
 };
 
 var InputSearch = /*#__PURE__*/function (_Component) {
@@ -114,8 +107,9 @@ var InputSearch = /*#__PURE__*/function (_Component) {
           forwardRef = _this$asProps.forwardRef,
           styles = _this$asProps.styles;
       var finalSize = size || this.context.size;
-      return _ref = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(SInputSearch, _ref.cn("SInputSearch", {
-        "size": finalSize
+      return _ref = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SInputSearch, _ref.cn("SInputSearch", {
+        "size": finalSize,
+        "use:filled": value
       }), /*#__PURE__*/_react["default"].createElement(_input["default"], _ref.cn("Input", {
         "size": finalSize
       }), /*#__PURE__*/_react["default"].createElement(_input["default"].Addon, {
@@ -127,11 +121,8 @@ var InputSearch = /*#__PURE__*/function (_Component) {
         tag: MAP_SIZE_TO_ICON[finalSize][1],
         role: "button",
         interactive: true,
-        style: {
-          visibility: value ? 'visible' : 'hidden'
-        },
         onClick: this.handleClear
-      }))), /*#__PURE__*/_react["default"].createElement(_divider["default"], _ref.cn("Divider", {})));
+      })));
     }
   }]);
   return InputSearch;

package/lib/cjs/InputSearch.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/InputSearch.jsx"],"names":["MAP_SIZE_TO_ICON","m","SearchM","CloseM","l","xl","SearchL","CloseL","InputSearch","e","handlers","value","SInputSearch","Box","asProps","size","forwardRef","styles","finalSize","context","visibility","handleClear","Component","style","defaultValue","Select","CONTEXT_COMPONENT"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAMA,gBAAgB,GAAG;AACvBC,EAAAA,CAAC,EAAE,CAACC,aAAD,EAAUC,cAAV,CADoB;AAEvBC,EAAAA,CAAC,EAAE,CAACF,aAAD,EAAUC,cAAV,CAFoB;AAGvBE,EAAAA,EAAE,EAAE,CAACC,aAAD,EAAUC,cAAV;AAHmB,CAAzB;;IAMMC,W;;;;;;;;;;;;;;;oGAiBU,UAACC,CAAD,EAAO;AACnB,YAAKC,QAAL,CAAcC,KAAd,CAAoB,EAApB,EAAwBF,CAAxB;AACD,K;;;;;;WARD,6BAAoB;AAClB,aAAO;AACLE,QAAAA,KAAK,EAAE;AADF,OAAP;AAGD;;;WAMD,kBAAS;AAAA;;AACP,UAAMC,YAAY,GAAGC,YAArB;AACA,0BAA4C,KAAKC,OAAjD;AAAA,UAAQC,IAAR,iBAAQA,IAAR;AAAA,UAAcJ,KAAd,iBAAcA,KAAd;AAAA,UAAqBK,UAArB,iBAAqBA,UAArB;AAAA,UAAiCC,MAAjC,iBAAiCA,MAAjC;AACA,UAAMC,SAAS,GAAGH,IAAI,IAAI,KAAKI,OAAL,CAAaJ,IAAvC;AAEA,oBAAO,mBAAQE,MAAR,CAAP,eACE,+EACE,gCAAC,YAAD;AAAA,gBAAoBC;AAApB,uBACE,gCAAC,iBAAD;AAAA,gBAAaA;AAAb,uBACE,gCAAC,iBAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAElB,gBAAgB,CAACkB,SAAD,CAAhB,CAA4B,CAA5B;AAAlB,QADF,eAEE,gCAAC,iBAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAEF,UAAlB;AAA8B,QAAA,SAAS;AAAvC,SAA4C,KAAKF,OAAjD,EAFF,eAGE,gCAAC,iBAAD,CAAO,KAAP;AACE,QAAA,GAAG,EAAEd,gBAAgB,CAACkB,SAAD,CAAhB,CAA4B,CAA5B,CADP;AAEE,QAAA,IAAI,EAAC,QAFP;AAGE,QAAA,WAAW,MAHb;AAIE,QAAA,KAAK,EAAE;AAAEE,UAAAA,UAAU,EAAET,KAAK,GAAG,SAAH,GAAe;AAAlC,SAJT;AAKE,QAAA,OAAO,EAAE,KAAKU;AALhB,QAHF,CADF,CADF,eAcE,gCAAC,mBAAD,yBAdF,CADF;AAkBD;;;EA5CuBC,e;;iCAApBd,W,iBACiB,a;iCADjBA,W,WAGWe,K;iCAHXf,W,kBAKkB;AACpBgB,EAAAA,YAAY,EAAE;AADM,C;iCALlBhB,W,iBASiBiB,mBAAOC,uBAAP,C;;eAsCR,sBAAgBlB,WAAhB,C","sourcesContent":["import React from 'react';\nimport createComponent, { Component, CONTEXT_COMPONENT, sstyled } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport Input from '@semcore/input';\nimport Divider from '@semcore/divider';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport SearchL from '@semcore/icon/Search/l';\nimport CloseL from '@semcore/icon/Close/l';\nimport Select from './Select';\n\nimport style from './style/input-search.shadow.css';\n\nconst MAP_SIZE_TO_ICON = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n  xl: [SearchL, CloseL],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n\n  static defaultProps = {\n    defaultValue: '',\n  };\n\n  static contextType = Select[CONTEXT_COMPONENT];\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  handleClear = (e) => {\n    this.handlers.value('', e);\n  };\n\n  render() {\n    const SInputSearch = Box;\n    const { size, value, forwardRef, styles } = this.asProps;\n    const finalSize = size || this.context.size;\n\n    return sstyled(styles)(\n      <>\n        <SInputSearch size={finalSize}>\n          <Input size={finalSize}>\n            <Input.Addon tag={MAP_SIZE_TO_ICON[finalSize][0]} />\n            <Input.Value ref={forwardRef} autoFocus {...this.asProps} />\n            <Input.Addon\n              tag={MAP_SIZE_TO_ICON[finalSize][1]}\n              role=\"button\"\n              interactive\n              style={{ visibility: value ? 'visible' : 'hidden' }}\n              onClick={this.handleClear}\n            />\n          </Input>\n        </SInputSearch>\n        <Divider />\n      </>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"file":"InputSearch.js"}
+{"version":3,"sources":["../../src/InputSearch.jsx"],"names":["MAP_SIZE_TO_ICON","m","SearchM","CloseM","l","InputSearch","e","handlers","value","SInputSearch","Box","asProps","size","forwardRef","styles","finalSize","context","handleClear","Component","style","defaultValue","Select","CONTEXT_COMPONENT"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AACA;;AADA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,IAAMA,gBAAgB,GAAG;AACvBC,EAAAA,CAAC,EAAE,CAACC,aAAD,EAAUC,cAAV,CADoB;AAEvBC,EAAAA,CAAC,EAAE,CAACF,aAAD,EAAUC,cAAV;AAFoB,CAAzB;;IAKME,W;;;;;;;;;;;;;;;oGAiBU,UAACC,CAAD,EAAO;AACnB,YAAKC,QAAL,CAAcC,KAAd,CAAoB,EAApB,EAAwBF,CAAxB;AACD,K;;;;;;WARD,6BAAoB;AAClB,aAAO;AACLE,QAAAA,KAAK,EAAE;AADF,OAAP;AAGD;;;WAMD,kBAAS;AAAA;;AACP,UAAMC,YAAY,GAAGC,YAArB;AACA,0BAA4C,KAAKC,OAAjD;AAAA,UAAQC,IAAR,iBAAQA,IAAR;AAAA,UAAcJ,KAAd,iBAAcA,KAAd;AAAA,UAAqBK,UAArB,iBAAqBA,UAArB;AAAA,UAAiCC,MAAjC,iBAAiCA,MAAjC;AACA,UAAMC,SAAS,GAAGH,IAAI,IAAI,KAAKI,OAAL,CAAaJ,IAAvC;AAEA,oBAAO,mBAAQE,MAAR,CAAP,eACE,gCAAC,YAAD;AAAA,gBAAoBC,SAApB;AAAA,sBAA2CP;AAA3C,uBACE,gCAAC,iBAAD;AAAA,gBAAaO;AAAb,uBACE,gCAAC,iBAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAEf,gBAAgB,CAACe,SAAD,CAAhB,CAA4B,CAA5B;AAAlB,QADF,eAEE,gCAAC,iBAAD,CAAO,KAAP;AAAa,QAAA,GAAG,EAAEF,UAAlB;AAA8B,QAAA,SAAS;AAAvC,SAA4C,KAAKF,OAAjD,EAFF,eAGE,gCAAC,iBAAD,CAAO,KAAP;AACE,QAAA,GAAG,EAAEX,gBAAgB,CAACe,SAAD,CAAhB,CAA4B,CAA5B,CADP;AAEE,QAAA,IAAI,EAAC,QAFP;AAGE,QAAA,WAAW,MAHb;AAIE,QAAA,OAAO,EAAE,KAAKE;AAJhB,QAHF,CADF,CADF;AAcD;;;EAxCuBC,e;;iCAApBb,W,iBACiB,a;iCADjBA,W,WAGWc,K;iCAHXd,W,kBAKkB;AACpBe,EAAAA,YAAY,EAAE;AADM,C;iCALlBf,W,iBASiBgB,mBAAOC,uBAAP,C;;eAkCR,sBAAgBjB,WAAhB,C","sourcesContent":["import React from 'react';\nimport createComponent, { Component, CONTEXT_COMPONENT, sstyled } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport Input from '@semcore/input';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Select from './Select';\n\nimport style from './style/input-search.shadow.css';\n\nconst MAP_SIZE_TO_ICON = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n\n  static defaultProps = {\n    defaultValue: '',\n  };\n\n  static contextType = Select[CONTEXT_COMPONENT];\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  handleClear = (e) => {\n    this.handlers.value('', e);\n  };\n\n  render() {\n    const SInputSearch = Box;\n    const { size, value, forwardRef, styles } = this.asProps;\n    const finalSize = size || this.context.size;\n\n    return sstyled(styles)(\n      <SInputSearch size={finalSize} use:filled={value}>\n        <Input size={finalSize}>\n          <Input.Addon tag={MAP_SIZE_TO_ICON[finalSize][0]} />\n          <Input.Value ref={forwardRef} autoFocus {...this.asProps} />\n          <Input.Addon\n            tag={MAP_SIZE_TO_ICON[finalSize][1]}\n            role=\"button\"\n            interactive\n            onClick={this.handleClear}\n          />\n        </Input>\n      </SInputSearch>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"file":"InputSearch.js"}

package/lib/cjs/Select.js

@@ -72,19 +72,17 @@ var style = (
 /*__reshadow_css_start__*/
 _core.sstyled.insert(
 /*__inner_css_start__*/
-".___SOptionCheckbox_13dcz_gg_{margin-right:8px;margin-bottom:auto;position:relative;flex-shrink:0}.___SOptionCheckbox_13dcz_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff;border:1px solid;border-radius:2px;border-color:#a6b0b3}.___SOptionCheckbox_13dcz_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 2px;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4IDYiIGZpbGw9IiNmZmYiPjxwYXRoIGQ9Ik03Ljg4NC43ODJMNy4yMDUuMTA3YS40LjQgMCAwMC0uNTU5IDBMMy4wNzMgMy42NjMgMS4zNTMgMS45NWEuNC40IDAgMDAtLjU1OCAwbC0uNjc5LjY3NUEuMzg0LjM4NCAwIDAwMCAyLjg5N2EuNC40IDAgMDAuMTE1LjI4NGwyLjY3OSAyLjY2NWEuNC40IDAgMDAuNTU5IDBsNC41MzEtNC41MDhBLjQuNCAwIDAwOCAxLjA1M2EuMzgyLjM4MiAwIDAwLS4xMTYtLjI3MXoiLz48L3N2Zz4=\");background-repeat:no-repeat;background-position:50%}.___SOptionCheckbox_13dcz_gg_._size_xl_13dcz_gg_{margin-top:2px;width:20px;height:20px}.___SOptionCheckbox_13dcz_gg_._size_l_13dcz_gg_{margin-top:1px;width:16px;height:16px}.___SOptionCheckbox_13dcz_gg_._size_m_13dcz_gg_{margin-top:2px;width:12px;height:12px}.___SOptionCheckbox_13dcz_gg_.__checked_13dcz_gg_:before{background-color:#2b94e1;border-color:#2b94e1}.___SOptionCheckbox_13dcz_gg_.__theme_13dcz_gg_:before{border-color:var(--theme_12l5bjj)}.___SOptionCheckbox_13dcz_gg_.__theme_13dcz_gg_.__checked_13dcz_gg_:before{background-color:var(--theme_12l5bjj);border-color:var(--theme_12l5bjj)}.___SOptionCheckbox_13dcz_gg_.__selected_13dcz_gg_{background-color:rgba(43,148,225,.2)}.___SOptionCheckbox_13dcz_gg_.__selected_13dcz_gg_ :hover{background-color:rgba(43,148,225,.2)}"
+".___SOptionCheckbox_1sdhb_gg_{margin-top:2px;margin-right:8px;margin-bottom:auto;position:relative;flex-shrink:0}.___SOptionCheckbox_1sdhb_gg_:before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:#fff;border:1px solid;border-radius:4px;border-color:#c4c7cf}.___SOptionCheckbox_1sdhb_gg_{width:16px;height:16px}.___SOptionCheckbox_1sdhb_gg_:after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 2px;background-repeat:no-repeat;background-position:50%;background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOC4yNSAxTDQgNS4yNSAxLjc1IDMiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=\")}.___SOptionCheckbox_1sdhb_gg_._size_l_1sdhb_gg_{width:20px;height:20px}.___SOptionCheckbox_1sdhb_gg_._size_l_1sdhb_gg_:after{background-image:url(\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMTEgMS41TDQuNzUgNy43NSAxIDQiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=\")}.___SOptionCheckbox_1sdhb_gg_.__checked_1sdhb_gg_:before{background-color:#008ff8;border-color:#008ff8}.___SOptionCheckbox_1sdhb_gg_.__theme_1sdhb_gg_:before{border-color:var(--theme_1lo3q1n)}.___SOptionCheckbox_1sdhb_gg_.__theme_1sdhb_gg_.__checked_1sdhb_gg_:before{background-color:var(--theme_1lo3q1n);border-color:var(--theme_1lo3q1n)}.___SOptionCheckbox_1sdhb_gg_.__selected_1sdhb_gg_{background-color:rgba(196,229,254,.7)}.___SOptionCheckbox_1sdhb_gg_.__selected_1sdhb_gg_:hover{background-color:rgba(196,229,254,.7)}"
 /*__inner_css_end__*/
-, "12l5bjj_gg_")
+, "1lo3q1n_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SOptionCheckbox": "___SOptionCheckbox_13dcz_gg_",
-  "_size_xl": "_size_xl_13dcz_gg_",
-  "_size_l": "_size_l_13dcz_gg_",
-  "_size_m": "_size_m_13dcz_gg_",
-  "_checked": "__checked_13dcz_gg_",
-  "_theme": "__theme_13dcz_gg_",
-  "--theme": "--theme_12l5bjj",
-  "_selected": "__selected_13dcz_gg_"
+  "__SOptionCheckbox": "___SOptionCheckbox_1sdhb_gg_",
+  "_size_l": "_size_l_1sdhb_gg_",
+  "_checked": "__checked_1sdhb_gg_",
+  "_theme": "__theme_1sdhb_gg_",
+  "--theme": "--theme_1lo3q1n",
+  "_selected": "__selected_1sdhb_gg_"
 });
 
 function isSelectedOption(value, valueOption) {
@@ -138,37 +136,11 @@ var RootSelect = /*#__PURE__*/function (_Component) {
         if (!multiselect) _this.handlers.visible(false);
       };
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "bindHandlerOptionFallbackClick", function (props) {
-      return function (e) {
-        var _this$asProps2 = _this.asProps,
-            selectedOptions = _this$asProps2.selectedOptions,
-            multiselect = _this$asProps2.multiselect;
-        var optionProps = [props];
-
-        if (multiselect) {
-          if (isSelectedOption(_this.fallbackDeprecatedValue(selectedOptions), props.value)) {
-            optionProps = selectedOptions.filter(function (o) {
-              return o.value !== props.value;
-            });
-          } else {
-            optionProps = selectedOptions.concat(props);
-          }
-        }
-
-        _this.handlers.value(optionProps, e);
-
-        if (!multiselect) _this.handlers.visible(false);
-      };
-    });
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handlerClear", function (e) {
       var value = _this.asProps.value;
-      var emptyValue = getEmptyValue(Array.isArray(_this.fallbackDeprecatedValue(value)));
+      var emptyValue = getEmptyValue(Array.isArray(value));
 
-      if (_this.isFallback()) {
-        _this.handlers.value(Array.isArray(emptyValue) ? emptyValue : [], e);
-      } else {
-        _this.handlers.value(emptyValue, e);
-      }
+      _this.handlers.value(emptyValue, e);
 
       _this.handlers.visible(false);
     });
@@ -180,48 +152,25 @@ var RootSelect = /*#__PURE__*/function (_Component) {
     value: function uncontrolledProps() {
       return {
         visible: null,
-        value: null,
-        selectedOptions: null
+        value: null
       };
     }
-  }, {
-    key: "isFallback",
-    value: function isFallback() {
-      var _this$props = this.props,
-          selectedOptions = _this$props.selectedOptions,
-          defaultSelectedOptions = _this$props.defaultSelectedOptions;
-      return selectedOptions !== undefined || defaultSelectedOptions.length !== 0;
-    }
-  }, {
-    key: "fallbackDeprecatedValue",
-    value: function fallbackDeprecatedValue(value) {
-      return this.isFallback() ? this.asProps.selectedOptions.map(function (o) {
-        return o.value;
-      }) : value;
-    }
-  }, {
-    key: "fallbackDeprecatedLabel",
-    value: function fallbackDeprecatedLabel(value) {
-      return this.isFallback() ? this.asProps.selectedOptions.map(function (o) {
-        return o.label || o.value;
-      }) : value;
-    }
   }, {
     key: "getTriggerProps",
     value: function getTriggerProps() {
-      var _this$asProps3 = this.asProps,
-          size = _this$asProps3.size,
-          disabled = _this$asProps3.disabled,
-          visible = _this$asProps3.visible,
-          state = _this$asProps3.state,
-          placeholder = _this$asProps3.placeholder,
-          value = _this$asProps3.value,
-          options = _this$asProps3.options,
-          forwardRef = _this$asProps3.forwardRef,
-          name = _this$asProps3.name,
-          multiselect = _this$asProps3.multiselect;
+      var _this$asProps2 = this.asProps,
+          size = _this$asProps2.size,
+          disabled = _this$asProps2.disabled,
+          visible = _this$asProps2.visible,
+          state = _this$asProps2.state,
+          placeholder = _this$asProps2.placeholder,
+          value = _this$asProps2.value,
+          options = _this$asProps2.options,
+          forwardRef = _this$asProps2.forwardRef,
+          name = _this$asProps2.name,
+          multiselect = _this$asProps2.multiselect;
       return {
-        empty: isEmptyValue(this.fallbackDeprecatedValue(value)),
+        empty: isEmptyValue(value),
         size: size,
         value: value,
         name: name,
@@ -232,14 +181,14 @@ var RootSelect = /*#__PURE__*/function (_Component) {
         disabled: disabled,
         active: visible,
         onClear: this.handlerClear,
-        children: this.renderChildrenTrigger(this.fallbackDeprecatedValue(value), options)
+        children: this.renderChildrenTrigger(value, options)
       };
     }
   }, {
     key: "getOptionProps",
     value: function getOptionProps(props) {
       var value = this.asProps.value;
-      var selected = isSelectedOption(this.fallbackDeprecatedValue(value), props.value);
+      var selected = isSelectedOption(value, props.value);
       var other = {};
       this._optionSelected = selected;
 
@@ -250,7 +199,7 @@ var RootSelect = /*#__PURE__*/function (_Component) {
 
       return _objectSpread({
         selected: selected,
-        onClick: this.isFallback() ? this.bindHandlerOptionFallbackClick(props) : this.bindHandlerOptionClick(props.value)
+        onClick: this.bindHandlerOptionClick(props.value)
       }, other);
     }
   }, {
@@ -277,7 +226,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
     key: "renderChildrenTrigger",
     value: function renderChildrenTrigger(value, options) {
       if (options) {
-        value = this.fallbackDeprecatedValue(value);
         return [].concat(value).reduce(function (acc, value) {
           var selectedOption = options.find(function (o) {
             return isSelectedOption(value, o.value);
@@ -289,7 +237,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
         }, []);
       }
 
-      value = this.fallbackDeprecatedLabel(value);
       return Array.isArray(value) ? value.reduce(function (acc, value) {
         if (acc.length) acc.push(', ');
         acc.push(value);
@@ -337,27 +284,21 @@ var RootSelect = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var _ref2 = this.asProps;
-      var _this$asProps4 = this.asProps,
-          Children = _this$asProps4.Children,
-          options = _this$asProps4.options,
-          multiselect = _this$asProps4.multiselect,
-          other = (0, _objectWithoutProperties2["default"])(_this$asProps4, _excluded);
+      var _this$asProps3 = this.asProps,
+          Children = _this$asProps3.Children,
+          options = _this$asProps3.options,
+          multiselect = _this$asProps3.multiselect,
+          other = (0, _objectWithoutProperties2["default"])(_this$asProps3, _excluded);
       var advanceMode = (0, _findComponent["default"])(Children, [Select.Trigger.displayName, Select.Popper.displayName]);
 
-      _logger["default"].warn( // @ts-ignore
-      this.isFallback(), "'selectedOptions'/'defaultSelectedOptions' changed to 'value/defaultValue' and take only values, not objects.", other['data-ui-name'] || Select.displayName);
-
       _logger["default"].warn(options && advanceMode, "Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'", other['data-ui-name'] || Select.displayName);
 
       if (options) {
         var _ref = arguments[0];
-
-        var _Component2 = multiselect ? Select.OptionCheckbox : Select.Option;
-
         return /*#__PURE__*/_react["default"].createElement(_dropdownMenu["default"], (0, _core.assignProps)({}, _ref), /*#__PURE__*/_react["default"].createElement(Select.Trigger, other), /*#__PURE__*/_react["default"].createElement(Select.Menu, null, options.map(function (option, i) {
-          return /*#__PURE__*/_react["default"].createElement(_Component2, (0, _extends2["default"])({
+          return /*#__PURE__*/_react["default"].createElement(Select.Option, (0, _extends2["default"])({
             key: i
-          }, option));
+          }, option), multiselect && /*#__PURE__*/_react["default"].createElement(Select.Option.Checkbox, null), option.children);
         })));
       }
 
@@ -374,7 +315,6 @@ var RootSelect = /*#__PURE__*/function (_Component) {
     placeholder: props.multiselect ? 'Select options' : 'Select option',
     size: 'm',
     defaultValue: getEmptyValue(props.multiselect),
-    defaultSelectedOptions: [],
     defaultVisible: false
   };
 });
@@ -423,24 +363,8 @@ function Checkbox(props) {
   }));
 }
 
-function OptionCheckbox(props) {
-  var selected = props.selected,
-      size = props.size,
-      theme = props.theme,
-      children = props.children;
-  return /*#__PURE__*/_react["default"].createElement(_dropdownMenu["default"].Item, props, /*#__PURE__*/_react["default"].createElement(Checkbox, {
-    selected: selected,
-    size: size,
-    theme: theme,
-    styles: props.styles
-  }), children);
-}
-
-var InputSearchWrapper = function InputSearchWrapper(props) {
+var InputSearchWrapper = function InputSearchWrapper() {
   var _ref4 = arguments[0];
-
-  _logger["default"].warn(true, "'<".concat(props['data-ui-name'], "/>' is deprecated, use the named import 'import { InputSearch }'"), props['data-ui-name'] || Select.InputSearch.displayName);
-
   return /*#__PURE__*/_react["default"].createElement(_InputSearch["default"], (0, _core.assignProps)({}, _ref4));
 };
 
@@ -458,9 +382,6 @@ var Select = (0, _core["default"])(RootSelect, {
   }],
   OptionTitle: _dropdownMenu["default"].ItemTitle,
   OptionHint: _dropdownMenu["default"].ItemHint,
-  OptionCheckbox: [OptionCheckbox, {
-    Addon: _dropdownMenu["default"].Item.Addon
-  }],
   Divider: _divider["default"],
   InputSearch: InputSearchWrapper,
   Input: InputSearchWrapper

package/lib/cjs/Select.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Select.jsx"],"names":["isSelectedOption","value","valueOption","Array","isArray","includes","isEmptyValue","length","getEmptyValue","multiselect","RootSelect","React","createRef","optionValue","e","newValue","asProps","filter","v","concat","handlers","visible","props","selectedOptions","optionProps","fallbackDeprecatedValue","o","emptyValue","isFallback","defaultSelectedOptions","undefined","map","label","size","disabled","state","placeholder","options","forwardRef","name","empty","$hiddenRef","active","onClear","handlerClear","children","renderChildrenTrigger","selected","other","_optionSelected","isScrolledToFirstOption","ref","firstSelectedOptionRef","onClick","bindHandlerOptionFallbackClick","bindHandlerOptionClick","hasOption","getOptionProps","my","reduce","acc","selectedOption","find","push","fallbackDeprecatedLabel","setTimeout","current","scrollIntoView","block","inline","scrollToSelectedOption","prevProps","prevState","Children","advanceMode","Select","Trigger","displayName","Popper","logger","warn","Component","OptionCheckbox","Option","DropdownMenu","option","i","style","defaultValue","defaultVisible","tag","Tag","ButtonTrigger","Text","Addon","Checkbox","SOptionCheckbox","componentProps","theme","styles","cn","checked","className","InputSearchWrapper","InputSearch","List","Menu","Item","OptionTitle","ItemTitle","OptionHint","ItemHint","Divider","Input","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport DropdownMenu from '@semcore/dropdown-menu';\nimport { ButtonTrigger } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport logger from '@semcore/utils/lib/logger';\nimport resolveColor from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport InputSearch from './InputSearch';\nimport { useBox } from '@semcore/flex-box';\n\nimport style from './style/select.shadow.css';\n\nfunction isSelectedOption(value, valueOption) {\n  return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;\n}\n\nfunction isEmptyValue(value) {\n  return Array.isArray(value) ? value.length === 0 : value === null;\n}\n\nfunction getEmptyValue(multiselect) {\n  return multiselect ? [] : null;\n}\n\nclass RootSelect extends Component {\n  static displayName = 'Select';\n\n  static style = style;\n\n  static defaultProps = (props) => ({\n    placeholder: props.multiselect ? 'Select options' : 'Select option',\n    size: 'm',\n    defaultValue: getEmptyValue(props.multiselect),\n    defaultSelectedOptions: [],\n    defaultVisible: false,\n  });\n\n  firstSelectedOptionRef = React.createRef();\n\n  isScrolledToFirstOption = false;\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n      value: null,\n      selectedOptions: null,\n    };\n  }\n\n  isFallback() {\n    const { selectedOptions, defaultSelectedOptions } = this.props;\n    return selectedOptions !== undefined || defaultSelectedOptions.length !== 0;\n  }\n\n  fallbackDeprecatedValue(value) {\n    return this.isFallback() ? this.asProps.selectedOptions.map((o) => o.value) : value;\n  }\n\n  fallbackDeprecatedLabel(value) {\n    return this.isFallback() ? this.asProps.selectedOptions.map((o) => o.label || o.value) : value;\n  }\n\n  getTriggerProps() {\n    const {\n      size,\n      disabled,\n      visible,\n      state,\n      placeholder,\n      value,\n      options,\n      forwardRef,\n      name,\n      multiselect,\n    } = this.asProps;\n\n    return {\n      empty: isEmptyValue(this.fallbackDeprecatedValue(value)),\n      size,\n      value,\n      name,\n      $hiddenRef: forwardRef,\n      multiselect,\n      state,\n      placeholder,\n      disabled,\n      active: visible,\n      onClear: this.handlerClear,\n      children: this.renderChildrenTrigger(this.fallbackDeprecatedValue(value), options),\n    };\n  }\n\n  getOptionProps(props) {\n    const { value } = this.asProps;\n    const selected = isSelectedOption(this.fallbackDeprecatedValue(value), props.value);\n    const other = {};\n    this._optionSelected = selected;\n\n    if (selected && !this.isScrolledToFirstOption) {\n      other.ref = this.firstSelectedOptionRef;\n      this.isScrolledToFirstOption = true;\n    }\n\n    return {\n      selected,\n      onClick: this.isFallback()\n        ? this.bindHandlerOptionFallbackClick(props)\n        : this.bindHandlerOptionClick(props.value),\n      ...other,\n    };\n  }\n\n  getOptionCheckboxProps(props) {\n    const { size } = this.asProps;\n    const hasOption = props.value === undefined;\n    const optionProps = hasOption ? {} : this.getOptionProps(props);\n    const selected = this._optionSelected;\n    this._optionSelected = null;\n    return {\n      ...optionProps,\n      size,\n      selected,\n    };\n  }\n\n  getDividerProps() {\n    return { my: 1 };\n  }\n\n  renderChildrenTrigger(value, options) {\n    if (options) {\n      value = this.fallbackDeprecatedValue(value);\n      return [].concat(value).reduce((acc, value) => {\n        const selectedOption = options.find((o) => isSelectedOption(value, o.value));\n        if (!selectedOption) return acc;\n        if (acc.length) acc.push(', ');\n        acc.push(selectedOption.label || selectedOption.value);\n        return acc;\n      }, []);\n    }\n    value = this.fallbackDeprecatedLabel(value);\n    return Array.isArray(value)\n      ? value.reduce((acc, value) => {\n          if (acc.length) acc.push(', ');\n          acc.push(value);\n          return acc;\n        }, [])\n      : value;\n  }\n\n  bindHandlerOptionClick = (optionValue) => (e) => {\n    let newValue = optionValue;\n    const { value, multiselect } = this.asProps;\n    if (Array.isArray(value)) {\n      if (value.includes(optionValue)) {\n        newValue = value.filter((v) => v !== optionValue);\n      } else {\n        newValue = value.concat(optionValue);\n      }\n    }\n    this.handlers.value(newValue, e);\n    if (!multiselect) this.handlers.visible(false);\n  };\n\n  bindHandlerOptionFallbackClick = (props) => (e) => {\n    const { selectedOptions, multiselect } = this.asProps;\n    let optionProps = [props];\n    if (multiselect) {\n      if (isSelectedOption(this.fallbackDeprecatedValue(selectedOptions), props.value)) {\n        optionProps = selectedOptions.filter((o) => o.value !== props.value);\n      } else {\n        optionProps = selectedOptions.concat(props);\n      }\n    }\n    this.handlers.value(optionProps, e);\n    if (!multiselect) this.handlers.visible(false);\n  };\n\n  handlerClear = (e) => {\n    const { value } = this.asProps;\n    const emptyValue = getEmptyValue(Array.isArray(this.fallbackDeprecatedValue(value)));\n    if (this.isFallback()) {\n      this.handlers.value(Array.isArray(emptyValue) ? emptyValue : [], e);\n    } else {\n      this.handlers.value(emptyValue, e);\n    }\n    this.handlers.visible(false);\n  };\n\n  scrollToSelectedOption() {\n    setTimeout(() => {\n      this.firstSelectedOptionRef.current?.scrollIntoView({\n        block: 'nearest',\n        inline: 'nearest',\n      });\n    }, 0);\n  }\n\n  componentDidMount() {\n    const { visible } = this.asProps;\n    if (visible) {\n      this.scrollToSelectedOption();\n    }\n  }\n\n  componentDidUpdate(prevProps, prevState) {\n    const { visible } = this.asProps;\n    //  TODO: вынести в хелпер\n    // Если открыли\n    if (visible) {\n      this.isScrolledToFirstOption = false;\n\n      // Если uncontroll\n      if (prevProps.visible === undefined) {\n        if (prevState.visible !== visible) this.scrollToSelectedOption();\n      } else {\n        if (prevProps.visible !== visible) this.scrollToSelectedOption();\n      }\n    }\n  }\n\n  render() {\n    const { Children, options, multiselect, ...other } = this.asProps;\n    const advanceMode = findComponent(Children, [\n      Select.Trigger.displayName,\n      Select.Popper.displayName,\n    ]);\n\n    logger.warn(\n      // @ts-ignore\n      this.isFallback(),\n      \"'selectedOptions'/'defaultSelectedOptions' changed to 'value/defaultValue' and take only values, not objects.\",\n      other['data-ui-name'] || Select.displayName,\n    );\n\n    logger.warn(\n      options && advanceMode,\n      \"Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'\",\n      other['data-ui-name'] || Select.displayName,\n    );\n\n    if (options) {\n      const Component = multiselect ? Select.OptionCheckbox : Select.Option;\n      return (\n        <Root render={DropdownMenu}>\n          <Select.Trigger {...other} />\n          <Select.Menu>\n            {options.map((option, i) => {\n              return <Component key={i} {...option} />;\n            })}\n          </Select.Menu>\n        </Root>\n      );\n    }\n\n    return (\n      <Root render={DropdownMenu}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction Trigger({ Children, name, value, $hiddenRef, tag: Tag = ButtonTrigger }) {\n  return (\n    <Root render={DropdownMenu.Trigger} tag={Tag} placeholder=\"Select option\">\n      {addonTextChildren(\n        Children,\n        Tag.Text || ButtonTrigger.Text,\n        Tag.Addon || ButtonTrigger.Addon,\n      )}\n      {name && <input type=\"hidden\" defaultValue={value} name={name} ref={$hiddenRef} />}\n    </Root>\n  );\n}\n\nfunction Checkbox(props) {\n  const [SOptionCheckbox, componentProps] = useBox(props, props.forwardRef);\n  const { size, theme, selected } = props;\n  const styles = sstyled(props.styles);\n\n  const { className, style } = styles.cn('SOptionCheckbox', {\n    size,\n    'use:theme': resolveColor(theme),\n    checked: selected,\n  });\n\n  return (\n    <SOptionCheckbox\n      {...componentProps}\n      className={cn(className, componentProps.className) || undefined}\n      style={{ ...style, ...componentProps.style }}\n    />\n  );\n}\n\nfunction OptionCheckbox(props) {\n  const { selected, size, theme, children } = props;\n\n  return (\n    <DropdownMenu.Item {...props}>\n      <Checkbox selected={selected} size={size} theme={theme} styles={props.styles} />\n      {children}\n    </DropdownMenu.Item>\n  );\n}\n\nconst InputSearchWrapper = function (props) {\n  logger.warn(\n    true,\n    `\\'<${props['data-ui-name']}/>\\' is deprecated, use the named import \\'import { InputSearch }\\'`,\n    props['data-ui-name'] || Select.InputSearch.displayName,\n  );\n  return <Root render={InputSearch} />;\n};\n\nconst Select = createComponent(\n  RootSelect,\n  {\n    Trigger: [\n      Trigger,\n      {\n        Addon: ButtonTrigger.Addon,\n        Text: ButtonTrigger.Text,\n      },\n    ],\n    Popper: DropdownMenu.Popper,\n    List: DropdownMenu.List,\n    Menu: DropdownMenu.Menu,\n    Option: [\n      DropdownMenu.Item,\n      {\n        Addon: DropdownMenu.Item.Addon,\n        Checkbox,\n      },\n    ],\n    OptionTitle: DropdownMenu.ItemTitle,\n    OptionHint: DropdownMenu.ItemHint,\n    OptionCheckbox: [\n      OptionCheckbox,\n      {\n        Addon: DropdownMenu.Item.Addon,\n      },\n    ],\n    Divider,\n    InputSearch: InputSearchWrapper,\n    Input: InputSearchWrapper,\n  },\n  { parent: DropdownMenu },\n);\n\nexport default Select;\n"],"file":"Select.js"}
+{"version":3,"sources":["../../src/Select.jsx"],"names":["isSelectedOption","value","valueOption","Array","isArray","includes","isEmptyValue","length","getEmptyValue","multiselect","RootSelect","React","createRef","optionValue","e","newValue","asProps","filter","v","concat","handlers","visible","emptyValue","size","disabled","state","placeholder","options","forwardRef","name","empty","$hiddenRef","active","onClear","handlerClear","children","renderChildrenTrigger","props","selected","other","_optionSelected","isScrolledToFirstOption","ref","firstSelectedOptionRef","onClick","bindHandlerOptionClick","hasOption","undefined","optionProps","getOptionProps","my","reduce","acc","selectedOption","find","o","push","label","setTimeout","current","scrollIntoView","block","inline","scrollToSelectedOption","prevProps","prevState","Children","advanceMode","Select","Trigger","displayName","Popper","logger","warn","DropdownMenu","map","option","i","Component","style","defaultValue","defaultVisible","tag","Tag","ButtonTrigger","Text","Addon","Checkbox","SOptionCheckbox","componentProps","theme","styles","cn","checked","className","InputSearchWrapper","InputSearch","List","Menu","Option","Item","OptionTitle","ItemTitle","OptionHint","ItemHint","Divider","Input","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, Root, sstyled } from '@semcore/core';\nimport DropdownMenu from '@semcore/dropdown-menu';\nimport { ButtonTrigger } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport logger from '@semcore/utils/lib/logger';\nimport resolveColor from '@semcore/utils/lib/color';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport InputSearch from './InputSearch';\nimport { useBox } from '@semcore/flex-box';\n\nimport style from './style/select.shadow.css';\n\nfunction isSelectedOption(value, valueOption) {\n  return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;\n}\n\nfunction isEmptyValue(value) {\n  return Array.isArray(value) ? value.length === 0 : value === null;\n}\n\nfunction getEmptyValue(multiselect) {\n  return multiselect ? [] : null;\n}\n\nclass RootSelect extends Component {\n  static displayName = 'Select';\n\n  static style = style;\n\n  static defaultProps = (props) => ({\n    placeholder: props.multiselect ? 'Select options' : 'Select option',\n    size: 'm',\n    defaultValue: getEmptyValue(props.multiselect),\n    defaultVisible: false,\n  });\n\n  firstSelectedOptionRef = React.createRef();\n\n  isScrolledToFirstOption = false;\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n      value: null,\n    };\n  }\n\n  getTriggerProps() {\n    const {\n      size,\n      disabled,\n      visible,\n      state,\n      placeholder,\n      value,\n      options,\n      forwardRef,\n      name,\n      multiselect,\n    } = this.asProps;\n\n    return {\n      empty: isEmptyValue(value),\n      size,\n      value,\n      name,\n      $hiddenRef: forwardRef,\n      multiselect,\n      state,\n      placeholder,\n      disabled,\n      active: visible,\n      onClear: this.handlerClear,\n      children: this.renderChildrenTrigger(value, options),\n    };\n  }\n\n  getOptionProps(props) {\n    const { value } = this.asProps;\n    const selected = isSelectedOption(value, props.value);\n    const other = {};\n    this._optionSelected = selected;\n\n    if (selected && !this.isScrolledToFirstOption) {\n      other.ref = this.firstSelectedOptionRef;\n      this.isScrolledToFirstOption = true;\n    }\n\n    return {\n      selected,\n      onClick: this.bindHandlerOptionClick(props.value),\n      ...other,\n    };\n  }\n\n  getOptionCheckboxProps(props) {\n    const { size } = this.asProps;\n    const hasOption = props.value === undefined;\n    const optionProps = hasOption ? {} : this.getOptionProps(props);\n    const selected = this._optionSelected;\n    this._optionSelected = null;\n    return {\n      ...optionProps,\n      size,\n      selected,\n    };\n  }\n\n  getDividerProps() {\n    return { my: 1 };\n  }\n\n  renderChildrenTrigger(value, options) {\n    if (options) {\n      return [].concat(value).reduce((acc, value) => {\n        const selectedOption = options.find((o) => isSelectedOption(value, o.value));\n        if (!selectedOption) return acc;\n        if (acc.length) acc.push(', ');\n        acc.push(selectedOption.label || selectedOption.value);\n        return acc;\n      }, []);\n    }\n    return Array.isArray(value)\n      ? value.reduce((acc, value) => {\n          if (acc.length) acc.push(', ');\n          acc.push(value);\n          return acc;\n        }, [])\n      : value;\n  }\n\n  bindHandlerOptionClick = (optionValue) => (e) => {\n    let newValue = optionValue;\n    const { value, multiselect } = this.asProps;\n    if (Array.isArray(value)) {\n      if (value.includes(optionValue)) {\n        newValue = value.filter((v) => v !== optionValue);\n      } else {\n        newValue = value.concat(optionValue);\n      }\n    }\n    this.handlers.value(newValue, e);\n    if (!multiselect) this.handlers.visible(false);\n  };\n\n  handlerClear = (e) => {\n    const { value } = this.asProps;\n    const emptyValue = getEmptyValue(Array.isArray(value));\n    this.handlers.value(emptyValue, e);\n    this.handlers.visible(false);\n  };\n\n  scrollToSelectedOption() {\n    setTimeout(() => {\n      this.firstSelectedOptionRef.current?.scrollIntoView({\n        block: 'nearest',\n        inline: 'nearest',\n      });\n    }, 0);\n  }\n\n  componentDidMount() {\n    const { visible } = this.asProps;\n    if (visible) {\n      this.scrollToSelectedOption();\n    }\n  }\n\n  componentDidUpdate(prevProps, prevState) {\n    const { visible } = this.asProps;\n    //  TODO: вынести в хелпер\n    // Если открыли\n    if (visible) {\n      this.isScrolledToFirstOption = false;\n\n      // Если uncontroll\n      if (prevProps.visible === undefined) {\n        if (prevState.visible !== visible) this.scrollToSelectedOption();\n      } else {\n        if (prevProps.visible !== visible) this.scrollToSelectedOption();\n      }\n    }\n  }\n\n  render() {\n    const { Children, options, multiselect, ...other } = this.asProps;\n    const advanceMode = findComponent(Children, [\n      Select.Trigger.displayName,\n      Select.Popper.displayName,\n    ]);\n\n    logger.warn(\n      options && advanceMode,\n      \"Don't use at the same time 'options' property and '<Select.Trigger/>/<Select.Popper/>'\",\n      other['data-ui-name'] || Select.displayName,\n    );\n\n    if (options) {\n      return (\n        <Root render={DropdownMenu}>\n          <Select.Trigger {...other} />\n          <Select.Menu>\n            {options.map((option, i) => {\n              return (\n                <Select.Option key={i} {...option}>\n                  {multiselect && <Select.Option.Checkbox />}\n                  {option.children}\n                </Select.Option>\n              );\n            })}\n          </Select.Menu>\n        </Root>\n      );\n    }\n\n    return (\n      <Root render={DropdownMenu}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction Trigger({ Children, name, value, $hiddenRef, tag: Tag = ButtonTrigger }) {\n  return (\n    <Root render={DropdownMenu.Trigger} tag={Tag} placeholder=\"Select option\">\n      {addonTextChildren(\n        Children,\n        Tag.Text || ButtonTrigger.Text,\n        Tag.Addon || ButtonTrigger.Addon,\n      )}\n      {name && <input type=\"hidden\" defaultValue={value} name={name} ref={$hiddenRef} />}\n    </Root>\n  );\n}\n\nfunction Checkbox(props) {\n  const [SOptionCheckbox, componentProps] = useBox(props, props.forwardRef);\n  const { size, theme, selected } = props;\n  const styles = sstyled(props.styles);\n\n  const { className, style } = styles.cn('SOptionCheckbox', {\n    size,\n    'use:theme': resolveColor(theme),\n    checked: selected,\n  });\n\n  return (\n    <SOptionCheckbox\n      {...componentProps}\n      className={cn(className, componentProps.className) || undefined}\n      style={{ ...style, ...componentProps.style }}\n    />\n  );\n}\n\nconst InputSearchWrapper = function () {\n  return <Root render={InputSearch} />;\n};\n\nconst Select = createComponent(\n  RootSelect,\n  {\n    Trigger: [\n      Trigger,\n      {\n        Addon: ButtonTrigger.Addon,\n        Text: ButtonTrigger.Text,\n      },\n    ],\n    Popper: DropdownMenu.Popper,\n    List: DropdownMenu.List,\n    Menu: DropdownMenu.Menu,\n    Option: [\n      DropdownMenu.Item,\n      {\n        Addon: DropdownMenu.Item.Addon,\n        Checkbox,\n      },\n    ],\n    OptionTitle: DropdownMenu.ItemTitle,\n    OptionHint: DropdownMenu.ItemHint,\n    Divider,\n    InputSearch: InputSearchWrapper,\n    Input: InputSearchWrapper,\n  },\n  { parent: DropdownMenu },\n);\n\nexport default Select;\n"],"file":"Select.js"}

package/lib/cjs/index.d.ts

@@ -64,17 +64,6 @@ export interface ISelectProps<T extends SelectValue = SelectValue>
    * Input name
    */
   name?: string;
-
-  /**
-   * The list of options selected by default
-   * @deprecated v2.0.0 {@link ISelectProps.defaultValue}
-   */
-  defaultSelectedOptions?: ISelectOption[];
-  /**
-   * List of the selected options
-   * @deprecated v2.0.0 {@link ISelectProps.value}
-   */
-  selectedOptions?: ISelectOption[];
 }
 
 export interface ISelectOption {
@@ -130,11 +119,6 @@ declare const Select: (<T, V extends SelectValue = SelectValue>(
   };
   OptionTitle: typeof DropdownMenu.ItemTitle;
   OptionHint: typeof DropdownMenu.ItemHint;
-  OptionCheckbox: (<T>(
-    props: CProps<ISelectOptionCheckboxProps & T, ISelectContext, ISelectHandlers>,
-  ) => ReturnEl) & {
-    Addon: typeof DropdownMenu.Item.Addon;
-  };
   Divider: typeof Divider;
   InputSearch: typeof InputSearch;
   Input: typeof InputSearch;

package/lib/cjs/style/input-search.shadow.css

@@ -1,11 +1,24 @@
-SInputSearch[size='m'] {
-  padding: 8px;
+@import '@semcore/utils/style/var.css';
+
+SInputSearch[size] {
+  padding: 0;
+}
+
+SInputSearch > [data-ui-name='Input']:first-child > [data-ui-name='InputSearch'] ~ div {
+  top: -1px;
+  left: -1px;
+  width: 100%;
+  border-radius: var(--rounded-m) var(--rounded-m) 0 0;
+}
+
+SInputSearch[size='m'] > [data-ui-name='Input']:first-child {
+  height: 32px;
 }
 
-SInputSearch[size='l'] {
-  padding: 10px 8px;
+SInputSearch [data-ui-name='Input.Addon']:last-of-type {
+  visibility: hidden;
 }
 
-SInputSearch[size='xl'] {
-  padding: 12px 12px;
+SInputSearch[filled] [data-ui-name='Input.Addon']:last-of-type {
+  visibility: visible;
 }

package/lib/cjs/style/select.shadow.css

@@ -1,6 +1,7 @@
 @import '@semcore/utils/style/var.css';
 
 SOptionCheckbox {
+  margin-top: 2px;
   margin-right: 8px;
   margin-bottom: auto;
   position: relative;
@@ -15,10 +16,13 @@ SOptionCheckbox {
     bottom: 0;
     background: #fff;
     border: 1px solid;
-    border-radius: 2px;
-    border-color: var(--stone);
+    border-radius: var(--rounded-s);
+    border-color: var(--gray-200);
   }
 
+  width: 16px;
+  height: 16px;
+
   &::after {
     content: '';
     position: absolute;
@@ -27,33 +31,23 @@ SOptionCheckbox {
     right: 0;
     bottom: 0;
     margin: 0 2px;
-    background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA4IDYiIGZpbGw9IiNmZmYiPgogICAgPHBhdGggZD0iTTc3Ny44ODQsNTkzLjc4MmwtMC42NzktLjY3NWEwLjQsMC40LDAsMCwwLS41NTksMGwtMy41NzMsMy41NTYtMS43Mi0xLjcxM2EwLjQsMC40LDAsMCwwLS41NTgsMGwtMC42NzkuNjc1YTAuMzg0LDAuMzg0LDAsMCwwLS4xMTYuMjcyLDAuNCwwLjQsMCwwLDAsLjExNS4yODRsMi42NzksMi42NjVhMC40LDAuNCwwLDAsMCwuNTU5LDBsNC41MzEtNC41MDhhMC40LDAuNCwwLDAsMCwuMTE2LTAuMjg1QTAuMzgyLDAuMzgyLDAsMCwwLDc3Ny44ODQsNTkzLjc4MloiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC03NzAgLTU5MykiLz4KPC9zdmc+Cgo=');
     background-repeat: no-repeat;
     background-position: center center;
+    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==');
   }
 }
 
-SOptionCheckbox[size='xl'] {
-  margin-top: 2px;
+SOptionCheckbox[size='l'] {
   width: 20px;
   height: 20px;
-}
-
-SOptionCheckbox[size='l'] {
-  margin-top: 1px;
-  width: 16px;
-  height: 16px;
-}
-
-SOptionCheckbox[size='m'] {
-  margin-top: 2px;
-  width: 12px;
-  height: 12px;
+  &::after {
+    background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==');
+  }
 }
 
 SOptionCheckbox[checked]:before {
-  background-color: var(--light-blue);
-  border-color: var(--light-blue);
+  background-color: var(--blue-400);
+  border-color: var(--blue-400);
 }
 
 SOptionCheckbox[theme]:before {
@@ -66,9 +60,9 @@ SOptionCheckbox[theme][checked]:before {
 }
 
 SOptionCheckbox[selected] {
-  background-color: color-mod(var(--light-blue) a(20%));
+  background-color: color-mod(var(--blue-100) a(70%));
 
-  & :hover {
-    background-color: color-mod(var(--light-blue) a(20%));
+  &:hover {
+    background-color: color-mod(var(--blue-100) a(70%));
   }
 }