@semcore/select 4.0.0-beta.0 → 4.0.0

package/CHANGELOG.md

@@ -8,6 +8,14 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 - Strict, backward incompatible typings.
 
+## [3.11.0] - 2023-07-14
+
+### Fixed
+
+- `InputSearch` clear button keyboard support. 
+
+## [3.10.3] - 2023-06-30
+
 ## [3.10.2] - 2023-06-28
 
 ### Changed

package/lib/cjs/InputSearch.js

@@ -22,12 +22,12 @@ var _context = require("./context");
 var _i18nEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/i18nEnhance"));
 var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
 /*__reshadow-styles__:"./style/input-search.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInputSearch_v5gqa_gg_._size_m_v5gqa_gg_{height:32px}.___SClose_v5gqa_gg_.__hide_v5gqa_gg_{visibility:hidden}.___SOutline_v5gqa_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0}" /*__inner_css_end__*/, "v5gqa_gg_") /*__reshadow_css_end__*/, {
-  "__SInputSearch": "___SInputSearch_v5gqa_gg_",
-  "_size_m": "_size_m_v5gqa_gg_",
-  "__SClose": "___SClose_v5gqa_gg_",
-  "_hide": "__hide_v5gqa_gg_",
-  "__SOutline": "___SOutline_v5gqa_gg_"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SInputSearch_1wjja_gg_._size_m_1wjja_gg_{height:32px}.___SClose_1wjja_gg_.__hide_1wjja_gg_{visibility:hidden}.___SOutline_1wjja_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0}" /*__inner_css_end__*/, "1wjja_gg_") /*__reshadow_css_end__*/, {
+  "__SInputSearch": "___SInputSearch_1wjja_gg_",
+  "_size_m": "_size_m_1wjja_gg_",
+  "__SClose": "___SClose_1wjja_gg_",
+  "_hide": "__hide_1wjja_gg_",
+  "__SOutline": "___SOutline_1wjja_gg_"
 });
 var sizeToIcon = {
   m: [_m["default"], _m2["default"]],
@@ -43,8 +43,16 @@ var InputSearch = /*#__PURE__*/function (_Component) {
       args[_key] = arguments[_key];
     }
     _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "inputRef", /*#__PURE__*/_react["default"].createRef());
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "closeIconRef", /*#__PURE__*/_react["default"].createRef());
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleClear", function (e) {
       _this.handlers.value('', e);
+      setTimeout(function () {
+        if (document.activeElement === document.body || document.activeElement === _this.closeIconRef.current) {
+          var _this$inputRef$curren;
+          (_this$inputRef$curren = _this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.focus();
+        }
+      }, 0);
     });
     return _this;
   }
@@ -76,15 +84,18 @@ var InputSearch = /*#__PURE__*/function (_Component) {
         "size": finalSize,
         "styles": styles
       }), /*#__PURE__*/_react["default"].createElement(_input["default"].Addon, null, /*#__PURE__*/_react["default"].createElement(IconSearch, _ref2.cn("IconSearch", {}))), /*#__PURE__*/_react["default"].createElement(Value, _ref2.cn("Value", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
-        "autoFocus": true
+        "autoFocus": true,
+        "ref": this.inputRef
       }, _ref)))), /*#__PURE__*/_react["default"].createElement(SClose, _ref2.cn("SClose", {
         "role": 'button',
+        "tag": IconClose,
+        "ref": this.closeIconRef,
         "hide": hideClose,
         "aria-hidden": hideClose,
         "interactive": true,
         "aria-label": getI18nText('clearSearch'),
         "onClick": this.handleClear
-      }), /*#__PURE__*/_react["default"].createElement(IconClose, _ref2.cn("IconClose", {}))));
+      })));
     }
   }]);
   return InputSearch;

package/lib/cjs/InputSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputSearch.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_m","_m2","_input","_context","_i18nEnhance","_intergalacticDynamicLocales","style","sstyled","insert","sizeToIcon","m","SearchM","CloseM","l","InputSearch","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","e","handlers","value","_createClass2","key","uncontrolledProps","render","_ref","asProps","_ref2","Value","Input","SInputSearch","SClose","Addon","_this$asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","createElement","cn","_objectSpread2","assignProps","handleClear","Component","i18nEnhance","localizedMessages","defaultValue","i18n","locale","selectContext","_default","createComponent","exports"],"sources":["../../src/InputSearch.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Input from '@semcore/input';\nimport { selectContext } from './context';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nimport style from './style/input-search.shadow.css';\n\nconst sizeToIcon = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages)];\n  static defaultProps = {\n    defaultValue: '',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n\n  static contextType = selectContext;\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 Value = Root;\n    const SInputSearch = Input;\n    const SClose = Input.Addon;\n    const { size, value, styles, getI18nText } = this.asProps;\n    const finalSize = size || this.context.size || 'm';\n    const hideClose = !value;\n    const IconClose = sizeToIcon[finalSize][1];\n    const IconSearch = sizeToIcon[finalSize][0];\n\n    return sstyled(styles)(\n      <SInputSearch size={finalSize} styles={styles}>\n        <Input.Addon>\n          <IconSearch />\n        </Input.Addon>\n        <Value render={Input.Value} autoFocus />\n        <SClose\n          role='button'\n          /* hide through css because the width of the input changes */\n          hide={hideClose}\n          aria-hidden={hideClose}\n          interactive\n          aria-label={getI18nText('clearSearch')}\n          onClick={this.handleClear}\n        >\n          <IconClose />\n        </SClose>\n      </SInputSearch>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"mappings":"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"}
+{"version":3,"file":"InputSearch.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_m","_m2","_input","_context","_i18nEnhance","_intergalacticDynamicLocales","style","sstyled","insert","sizeToIcon","m","SearchM","CloseM","l","InputSearch","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","React","createRef","e","handlers","value","setTimeout","document","activeElement","body","closeIconRef","current","_this$inputRef$curren","inputRef","focus","_createClass2","key","uncontrolledProps","render","_ref","asProps","_ref2","Value","Input","SInputSearch","SClose","Addon","_this$asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","createElement","cn","_objectSpread2","assignProps","handleClear","Component","i18nEnhance","localizedMessages","defaultValue","i18n","locale","selectContext","_default","createComponent","exports"],"sources":["../../src/InputSearch.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Input from '@semcore/input';\nimport { selectContext } from './context';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nimport style from './style/input-search.shadow.css';\n\nconst sizeToIcon = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages)];\n  static defaultProps = {\n    defaultValue: '',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n  inputRef = React.createRef();\n  closeIconRef = React.createRef();\n\n  static contextType = selectContext;\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  handleClear = (e) => {\n    this.handlers.value('', e);\n    setTimeout(() => {\n      if (\n        document.activeElement === document.body ||\n        document.activeElement === this.closeIconRef.current\n      ) {\n        this.inputRef.current?.focus();\n      }\n    }, 0);\n  };\n\n  render() {\n    const Value = Root;\n    const SInputSearch = Input;\n    const SClose = Input.Addon;\n    const { size, value, styles, getI18nText } = this.asProps;\n    const finalSize = size || this.context.size || 'm';\n    const hideClose = !value;\n    const IconClose = sizeToIcon[finalSize][1];\n    const IconSearch = sizeToIcon[finalSize][0];\n\n    return sstyled(styles)(\n      <SInputSearch size={finalSize} styles={styles}>\n        <Input.Addon>\n          <IconSearch />\n        </Input.Addon>\n        <Value render={Input.Value} autoFocus ref={this.inputRef} />\n        <SClose\n          role='button'\n          tag={IconClose}\n          ref={this.closeIconRef}\n          /* hide through css because the width of the input changes */\n          hide={hideClose}\n          aria-hidden={hideClose}\n          interactive\n          aria-label={getI18nText('clearSearch')}\n          onClick={this.handleClear}\n        />\n      </SInputSearch>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"mappings":"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"}

package/lib/cjs/Select.js

@@ -36,13 +36,13 @@ var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynam
 var _useFocusLock = require("@semcore/utils/lib/use/useFocusLock");
 var _excluded = ["Children", "options", "multiselect", "value"];
 /*__reshadow-styles__:"./style/select.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_14ywa_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_14ywa_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_14ywa_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_14ywa_gg_._size_l_14ywa_gg_{width:20px;height:20px}.___SOptionCheckbox_14ywa_gg_._size_l_14ywa_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_14ywa_gg_.__checked_14ywa_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_14ywa_gg_.__theme_14ywa_gg_:before{border-color:var(--theme_14ywa)}.___SOptionCheckbox_14ywa_gg_.__theme_14ywa_gg_.__checked_14ywa_gg_:before{background-color:var(--theme_14ywa);border-color:var(--theme_14ywa)}.___SOptionCheckbox_14ywa_gg_.__selected_14ywa_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_14ywa_gg_.__selected_14ywa_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}" /*__inner_css_end__*/, "14ywa_gg_") /*__reshadow_css_end__*/, {
-  "__SOptionCheckbox": "___SOptionCheckbox_14ywa_gg_",
-  "_size_l": "_size_l_14ywa_gg_",
-  "_checked": "__checked_14ywa_gg_",
-  "_theme": "__theme_14ywa_gg_",
-  "--theme": "--theme_14ywa",
-  "_selected": "__selected_14ywa_gg_"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_yjnpb_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_yjnpb_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_yjnpb_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_yjnpb_gg_._size_l_yjnpb_gg_{width:20px;height:20px}.___SOptionCheckbox_yjnpb_gg_._size_l_yjnpb_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_yjnpb_gg_.__checked_yjnpb_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_yjnpb_gg_.__theme_yjnpb_gg_:before{border-color:var(--theme_yjnpb)}.___SOptionCheckbox_yjnpb_gg_.__theme_yjnpb_gg_.__checked_yjnpb_gg_:before{background-color:var(--theme_yjnpb);border-color:var(--theme_yjnpb)}.___SOptionCheckbox_yjnpb_gg_.__selected_yjnpb_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_yjnpb_gg_.__selected_yjnpb_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}" /*__inner_css_end__*/, "yjnpb_gg_") /*__reshadow_css_end__*/, {
+  "__SOptionCheckbox": "___SOptionCheckbox_yjnpb_gg_",
+  "_size_l": "_size_l_yjnpb_gg_",
+  "_checked": "__checked_yjnpb_gg_",
+  "_theme": "__theme_yjnpb_gg_",
+  "--theme": "--theme_yjnpb",
+  "_selected": "__selected_yjnpb_gg_"
 });
 function isSelectedOption(value, valueOption) {
   return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;

package/lib/cjs/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport DropdownMenu, {\n  DropdownMenuContext,\n  DropdownMenuItemProps,\n  DropdownMenuProps,\n  DropdownMenuHandlers,\n  DropdownMenuTriggerProps,\n} from '@semcore/dropdown-menu';\nimport { ButtonTrigger, BaseTriggerProps, ButtonTriggerProps } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport { InputValueProps } from '@semcore/input';\nimport { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface ISelectInputSearch extends SelectInputSearch, UnknownProperties {}\nexport type SelectInputSearch = InputValueProps & {};\n\nexport type OptionValue = string | number;\nexport type SelectValue = string | number | Array<string | number> | null;\n\nexport type SelectOption = {\n  value: OptionValue;\n  children?: React.ReactNode;\n  label?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface ISelectProps<T extends SelectValue = SelectValue> extends SelectProps<T> {}\nexport type SelectProps<T extends SelectValue = SelectValue> = DropdownMenuProps &\n  BaseTriggerProps & {\n    /**\n     * Multiple select\n     */\n    multiselect?: boolean;\n    /**\n     * Options array\n     */\n    options?: SelectOption[];\n    /**\n     * The value or values array selected by default when using multiselect\n     * @type SelectValue\n     */\n    defaultValue?: T;\n    /**\n     * The selected value or values array when using multiselect\n     * @type SelectValue\n     */\n    value?: T;\n    /**\n     * Callback on value change\n     * @type (value: SelectValue, e: React.SyntheticEvent) => boolean | void\n     */\n    onChange?:\n      | ((value: T, e: React.SyntheticEvent) => boolean | void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /**\n     * Trigger placeholder at not selected value\n     */\n    placeholder?: React.ReactNode;\n    /**\n     * Trigger state\n     */\n    state?: 'normal' | 'valid' | 'invalid';\n    /**\n     * Disables select\n     */\n    disabled?: boolean;\n    /**\n     * Input name\n     */\n    name?: string;\n    locale?: string;\n    /**\n     * If enabled, after opening select popper view will be scrolled to selected option or, if there are multiple selected options, to the first selected option.\n     * @default true\n     */\n    scrollToSelected?: boolean;\n  };\n\n/** @deprecated */\nexport interface ISelectOption extends SelectOption, UnknownProperties {}\n\n/** @deprecated */\nexport interface ISelectOptionProps extends SelectOptionProps, UnknownProperties {}\nexport type SelectOptionProps = DropdownMenuItemProps & {\n  /** Value of the option */\n  value: string | number;\n};\n\n/** @deprecated */\nexport interface ISelectOptionCheckboxProps extends SelectOptionCheckboxProps, UnknownProperties {}\nexport type SelectOptionCheckboxProps = SelectOptionProps & {\n  /** Checkbox theme */\n  theme?: string;\n};\n\ndeclare const InputSearch: Intergalactic.Component<'div', SelectInputSearch>;\n\n/** @deprecated */\nexport interface ISelectContext extends SelectContext, UnknownProperties {}\nexport type SelectContext = DropdownMenuContext & {\n  getOptionProps: PropGetterFn;\n  getOptionCheckboxProps: PropGetterFn;\n  getDividerProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ISelectHandlers extends SelectHandlers, UnknownProperties {}\nexport type SelectHandlers = DropdownMenuHandlers & {\n  value: (index: SelectValue) => void;\n};\n\ntype IntergalacticSelectComponent = (<\n  Value extends SelectValue,\n  Tag extends Intergalactic.InternalTypings.ComponentTag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    SelectProps<Value>,\n    SelectContext,\n    [handlers: SelectHandlers]\n  >,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n  Intergalactic.InternalTypings.ComponentAdditive<'div'>;\n\ndeclare const Select: IntergalacticSelectComponent & {\n  Trigger: Intergalactic.Component<\n    'div',\n    DropdownMenuTriggerProps & ButtonTriggerProps,\n    {},\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof ButtonTrigger.Addon;\n    Text: typeof ButtonTrigger.Text;\n  };\n  Popper: typeof DropdownMenu.Popper;\n  List: typeof DropdownMenu.List;\n  Menu: typeof DropdownMenu.Menu;\n  Option: Intergalactic.Component<\n    'option',\n    SelectOptionProps,\n    SelectContext,\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof DropdownMenu.Item.Addon;\n    Checkbox: Intergalactic.Component<'div', BoxProps & { theme?: string; selected?: boolean }>;\n  };\n  OptionTitle: typeof DropdownMenu.ItemTitle;\n  OptionHint: typeof DropdownMenu.ItemHint;\n  Divider: typeof Divider;\n  InputSearch: typeof InputSearch;\n  Input: typeof InputSearch;\n};\n\nexport { InputSearch };\nexport default Select;\n"],"mappings":""}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport DropdownMenu, {\n  DropdownMenuContext,\n  DropdownMenuItemProps,\n  DropdownMenuProps,\n  DropdownMenuHandlers,\n  DropdownMenuTriggerProps,\n} from '@semcore/dropdown-menu';\nimport { ButtonTrigger, BaseTriggerProps, ButtonTriggerProps } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport { InputValueProps } from '@semcore/input';\nimport { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface ISelectInputSearch extends SelectInputSearch, UnknownProperties {}\nexport type SelectInputSearch = InputValueProps & {};\n\nexport type OptionValue = string | number;\nexport type SelectValue = string | number | Array<string | number> | null;\n\nexport type SelectOption = {\n  value: OptionValue;\n  children?: React.ReactNode;\n  label?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface ISelectProps<T extends SelectValue = SelectValue> extends SelectProps<T> {}\nexport type SelectProps<T extends SelectValue = SelectValue> = DropdownMenuProps &\n  BaseTriggerProps & {\n    /**\n     * Multiple select\n     */\n    multiselect?: boolean;\n    /**\n     * Options array\n     */\n    options?: SelectOption[];\n    /**\n     * The value or values array selected by default when using multiselect\n     * @type SelectValue\n     */\n    defaultValue?: T;\n    /**\n     * The selected value or values array when using multiselect\n     * @type SelectValue\n     */\n    value?: T;\n    /**\n     * Callback on value change\n     * @type (value: SelectValue, e: React.SyntheticEvent) => boolean | void\n     */\n    onChange?:\n      | ((value: T, e: React.SyntheticEvent) => boolean | void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /**\n     * Trigger placeholder at not selected value\n     */\n    placeholder?: React.ReactNode;\n    /**\n     * Trigger state\n     */\n    state?: 'normal' | 'valid' | 'invalid';\n    /**\n     * Disables select\n     */\n    disabled?: boolean;\n    /**\n     * Input name\n     */\n    name?: string;\n    locale?: string;\n    /**\n     * If enabled, after opening select popper view will be scrolled to selected option or, if there are multiple selected options, to the first selected option.\n     * @default true\n     */\n    scrollToSelected?: boolean;\n  };\n\n/** @deprecated */\nexport interface ISelectOption extends SelectOption, UnknownProperties {}\n\n/** @deprecated */\nexport interface ISelectOptionProps extends SelectOptionProps, UnknownProperties {}\nexport type SelectOptionProps = DropdownMenuItemProps & {\n  /** Value of the option */\n  value: string | number;\n};\n\n/** @deprecated */\nexport interface ISelectOptionCheckboxProps extends SelectOptionCheckboxProps, UnknownProperties {}\nexport type SelectOptionCheckboxProps = SelectOptionProps & {\n  /** Checkbox theme */\n  theme?: string;\n};\n\ndeclare const InputSearch: Intergalactic.Component<'div', SelectInputSearch>;\n\n/** @deprecated */\nexport interface ISelectContext extends SelectContext, UnknownProperties {}\nexport type SelectContext = DropdownMenuContext & {\n  getOptionProps: PropGetterFn;\n  getOptionCheckboxProps: PropGetterFn;\n  getDividerProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ISelectHandlers extends SelectHandlers, UnknownProperties {}\nexport type SelectHandlers = DropdownMenuHandlers & {\n  value: (index: SelectValue) => void;\n};\n\ntype IntergalacticSelectComponent = (<\n  Value extends SelectValue,\n  Tag extends Intergalactic.Tag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    SelectProps<Value>,\n    SelectContext,\n    [handlers: SelectHandlers]\n  >,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n  Intergalactic.InternalTypings.ComponentAdditive<'div'>;\n\ndeclare const Select: IntergalacticSelectComponent & {\n  Trigger: Intergalactic.Component<\n    'div',\n    DropdownMenuTriggerProps & ButtonTriggerProps,\n    {},\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof ButtonTrigger.Addon;\n    Text: typeof ButtonTrigger.Text;\n  };\n  Popper: typeof DropdownMenu.Popper;\n  List: typeof DropdownMenu.List;\n  Menu: typeof DropdownMenu.Menu;\n  Option: Intergalactic.Component<\n    'option',\n    SelectOptionProps,\n    SelectContext,\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof DropdownMenu.Item.Addon;\n    Checkbox: Intergalactic.Component<'div', BoxProps & { theme?: string; selected?: boolean }>;\n  };\n  OptionTitle: typeof DropdownMenu.ItemTitle;\n  OptionHint: typeof DropdownMenu.ItemHint;\n  Divider: typeof Divider;\n  InputSearch: typeof InputSearch;\n  Input: typeof InputSearch;\n};\n\nexport { InputSearch };\nexport default Select;\n"],"mappings":""}

package/lib/es6/InputSearch.js

@@ -16,12 +16,12 @@ import { selectContext } from './context';
 import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
 import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
 /*__reshadow-styles__:"./style/input-search.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SInputSearch_v5gqa_gg_._size_m_v5gqa_gg_{height:32px}.___SClose_v5gqa_gg_.__hide_v5gqa_gg_{visibility:hidden}.___SOutline_v5gqa_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0}" /*__inner_css_end__*/, "v5gqa_gg_") /*__reshadow_css_end__*/, {
-  "__SInputSearch": "___SInputSearch_v5gqa_gg_",
-  "_size_m": "_size_m_v5gqa_gg_",
-  "__SClose": "___SClose_v5gqa_gg_",
-  "_hide": "__hide_v5gqa_gg_",
-  "__SOutline": "___SOutline_v5gqa_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SInputSearch_1wjja_gg_._size_m_1wjja_gg_{height:32px}.___SClose_1wjja_gg_.__hide_1wjja_gg_{visibility:hidden}.___SOutline_1wjja_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0}" /*__inner_css_end__*/, "1wjja_gg_") /*__reshadow_css_end__*/, {
+  "__SInputSearch": "___SInputSearch_1wjja_gg_",
+  "_size_m": "_size_m_1wjja_gg_",
+  "__SClose": "___SClose_1wjja_gg_",
+  "_hide": "__hide_1wjja_gg_",
+  "__SOutline": "___SOutline_1wjja_gg_"
 });
 var sizeToIcon = {
   m: [SearchM, CloseM],
@@ -37,8 +37,16 @@ var InputSearch = /*#__PURE__*/function (_Component) {
       args[_key] = arguments[_key];
     }
     _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "inputRef", /*#__PURE__*/React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "closeIconRef", /*#__PURE__*/React.createRef());
     _defineProperty(_assertThisInitialized(_this), "handleClear", function (e) {
       _this.handlers.value('', e);
+      setTimeout(function () {
+        if (document.activeElement === document.body || document.activeElement === _this.closeIconRef.current) {
+          var _this$inputRef$curren;
+          (_this$inputRef$curren = _this.inputRef.current) === null || _this$inputRef$curren === void 0 ? void 0 : _this$inputRef$curren.focus();
+        }
+      }, 0);
     });
     return _this;
   }
@@ -70,15 +78,18 @@ var InputSearch = /*#__PURE__*/function (_Component) {
         "size": finalSize,
         "styles": styles
       }), /*#__PURE__*/React.createElement(Input.Addon, null, /*#__PURE__*/React.createElement(IconSearch, _ref2.cn("IconSearch", {}))), /*#__PURE__*/React.createElement(Value, _ref2.cn("Value", _objectSpread({}, _assignProps({
-        "autoFocus": true
+        "autoFocus": true,
+        "ref": this.inputRef
       }, _ref)))), /*#__PURE__*/React.createElement(SClose, _ref2.cn("SClose", {
         "role": 'button',
+        "tag": IconClose,
+        "ref": this.closeIconRef,
         "hide": hideClose,
         "aria-hidden": hideClose,
         "interactive": true,
         "aria-label": getI18nText('clearSearch'),
         "onClick": this.handleClear
-      }), /*#__PURE__*/React.createElement(IconClose, _ref2.cn("IconClose", {}))));
+      })));
     }
   }]);
   return InputSearch;

package/lib/es6/InputSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputSearch.js","names":["React","createComponent","Component","sstyled","Root","SearchM","CloseM","Input","selectContext","i18nEnhance","localizedMessages","style","_sstyled","insert","sizeToIcon","m","l","InputSearch","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty","_assertThisInitialized","e","handlers","value","_createClass","key","uncontrolledProps","render","_ref","asProps","_ref2","Value","SInputSearch","SClose","Addon","_this$asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","createElement","cn","_objectSpread","_assignProps","handleClear","defaultValue","i18n","locale"],"sources":["../../src/InputSearch.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Input from '@semcore/input';\nimport { selectContext } from './context';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nimport style from './style/input-search.shadow.css';\n\nconst sizeToIcon = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages)];\n  static defaultProps = {\n    defaultValue: '',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n\n  static contextType = selectContext;\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 Value = Root;\n    const SInputSearch = Input;\n    const SClose = Input.Addon;\n    const { size, value, styles, getI18nText } = this.asProps;\n    const finalSize = size || this.context.size || 'm';\n    const hideClose = !value;\n    const IconClose = sizeToIcon[finalSize][1];\n    const IconSearch = sizeToIcon[finalSize][0];\n\n    return sstyled(styles)(\n      <SInputSearch size={finalSize} styles={styles}>\n        <Input.Addon>\n          <IconSearch />\n        </Input.Addon>\n        <Value render={Input.Value} autoFocus />\n        <SClose\n          role='button'\n          /* hide through css because the width of the input changes */\n          hide={hideClose}\n          aria-hidden={hideClose}\n          interactive\n          aria-label={getI18nText('clearSearch')}\n          onClick={this.handleClear}\n        >\n          <IconClose />\n        </SClose>\n      </SInputSearch>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"mappings":";;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,eAAe,IAAIC,SAAS,EAAEC,OAAO,EAAEC,IAAI,QAAQ,eAAe;AACzE,OAAOC,OAAO,MAAM,wBAAwB;AAC5C,OAAOC,MAAM,MAAM,uBAAuB;AAC1C,OAAOC,KAAK,MAAM,gBAAgB;AAClC,SAASC,aAAa,QAAQ,WAAW;AACzC,OAAOC,WAAW,MAAM,yCAAyC;AACjE,SAASC,iBAAiB,QAAQ,gDAAgD;AAAC;AAAA,IAAAC,KAAA,+BAAAC,QAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAInF,IAAMC,UAAU,GAAG;EACjBC,CAAC,EAAE,CAACV,OAAO,EAAEC,MAAM,CAAC;EACpBU,CAAC,EAAE,CAACX,OAAO,EAAEC,MAAM;AACrB,CAAC;AAAC,IAEIW,WAAW,0BAAAC,UAAA;EAAAC,SAAA,CAAAF,WAAA,EAAAC,UAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,WAAA;EAAA,SAAAA,YAAA;IAAA,IAAAK,KAAA;IAAAC,eAAA,OAAAN,WAAA;IAAA,SAAAO,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAJ,IAAA,GAAAK,IAAA,MAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA;MAAAF,IAAA,CAAAE,IAAA,IAAAJ,SAAA,CAAAI,IAAA;IAAA;IAAAP,KAAA,GAAAF,MAAA,CAAAU,IAAA,CAAAC,KAAA,CAAAX,MAAA,SAAAY,MAAA,CAAAL,IAAA;IAAAM,eAAA,CAAAC,sBAAA,CAAAZ,KAAA,kBAmBD,UAACa,CAAC,EAAK;MACnBb,KAAA,CAAKc,QAAQ,CAACC,KAAK,CAAC,EAAE,EAAEF,CAAC,CAAC;IAC5B,CAAC;IAAA,OAAAb,KAAA;EAAA;EAAAgB,YAAA,CAAArB,WAAA;IAAAsB,GAAA;IAAAF,KAAA,EARD,SAAAG,kBAAA,EAAoB;MAClB,OAAO;QACLH,KAAK,EAAE;MACT,CAAC;IACH;EAAC;IAAAE,GAAA;IAAAF,KAAA,EAMD,SAAAI,OAAA,EAAS;MAAA,IAAAC,IAAA,QAAAC,OAAA;QAAAC,KAAA;MACP,IAAMC,KAAK,GAcQtC,KAAK,CAACsC,KAAK;MAb9B,IAAMC,YAAY,GAAGvC,KAAK;MAC1B,IAAMwC,MAAM,GAAGxC,KAAK,CAACyC,KAAK;MAC1B,IAAAC,aAAA,GAA6C,IAAI,CAACN,OAAO;QAAjDO,IAAI,GAAAD,aAAA,CAAJC,IAAI;QAAEb,KAAK,GAAAY,aAAA,CAALZ,KAAK;QAAEc,MAAM,GAAAF,aAAA,CAANE,MAAM;QAAEC,WAAW,GAAAH,aAAA,CAAXG,WAAW;MACxC,IAAMC,SAAS,GAAGH,IAAI,IAAI,IAAI,CAACI,OAAO,CAACJ,IAAI,IAAI,GAAG;MAClD,IAAMK,SAAS,GAAG,CAAClB,KAAK;MACxB,IAAMmB,SAAS,GAAG1C,UAAU,CAACuC,SAAS,CAAC,CAAC,CAAC,CAAC;MAC1C,IAAMI,UAAU,GAAG3C,UAAU,CAACuC,SAAS,CAAC,CAAC,CAAC,CAAC;MAE3C,OAAAT,KAAA,GAAOzC,OAAO,CAACgD,MAAM,CAAC,eACpBnD,KAAA,CAAA0D,aAAA,CAACZ,YAAY,EAAAF,KAAA,CAAAe,EAAA;QAAA,QAAON,SAAS;QAAA,UAAUF;MAAM,iBAC3CnD,KAAA,CAAA0D,aAAA,CAACnD,KAAK,CAACyC,KAAK,qBACVhD,KAAA,CAAA0D,aAAA,CAACD,UAAU,EAAAb,KAAA,CAAAe,EAAA,mBAAG,CACF,eACd3D,KAAA,CAAA0D,aAAA,CAACb,KAAK,EAAAD,KAAA,CAAAe,EAAA,UAAAC,aAAA,KAAAC,YAAA;QAAA;MAAA,GAAAnB,IAAA,IAAkC,eACxC1C,KAAA,CAAA0D,aAAA,CAACX,MAAM,EAAAH,KAAA,CAAAe,EAAA;QAAA,QACA,QAAQ;QAAA,QAEPJ,SAAS;QAAA,eACFA,SAAS;QAAA;QAAA,cAEVH,WAAW,CAAC,aAAa,CAAC;QAAA,WAC7B,IAAI,CAACU;MAAW,iBAEzB9D,KAAA,CAAA0D,aAAA,CAACF,SAAS,EAAAZ,KAAA,CAAAe,EAAA,kBAAG,CACN,CACI;IAEnB;EAAC;EAAA,OAAA1C,WAAA;AAAA,EApDuBf,SAAS;AAAA+B,eAAA,CAA7BhB,WAAW,iBACM,aAAa;AAAAgB,eAAA,CAD9BhB,WAAW,WAGAN,KAAK;AAAAsB,eAAA,CAHhBhB,WAAW,aAIE,CAACR,WAAW,CAACC,iBAAiB,CAAC,CAAC;AAAAuB,eAAA,CAJ7ChB,WAAW,kBAKO;EACpB8C,YAAY,EAAE,EAAE;EAChBC,IAAI,EAAEtD,iBAAiB;EACvBuD,MAAM,EAAE;AACV,CAAC;AAAAhC,eAAA,CATGhB,WAAW,iBAWMT,aAAa;AA4CpC,eAAeP,eAAe,CAACgB,WAAW,CAAC"}
+{"version":3,"file":"InputSearch.js","names":["React","createComponent","Component","sstyled","Root","SearchM","CloseM","Input","selectContext","i18nEnhance","localizedMessages","style","_sstyled","insert","sizeToIcon","m","l","InputSearch","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty","_assertThisInitialized","createRef","e","handlers","value","setTimeout","document","activeElement","body","closeIconRef","current","_this$inputRef$curren","inputRef","focus","_createClass","key","uncontrolledProps","render","_ref","asProps","_ref2","Value","SInputSearch","SClose","Addon","_this$asProps","size","styles","getI18nText","finalSize","context","hideClose","IconClose","IconSearch","createElement","cn","_objectSpread","_assignProps","handleClear","defaultValue","i18n","locale"],"sources":["../../src/InputSearch.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport SearchM from '@semcore/icon/Search/m';\nimport CloseM from '@semcore/icon/Close/m';\nimport Input from '@semcore/input';\nimport { selectContext } from './context';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nimport style from './style/input-search.shadow.css';\n\nconst sizeToIcon = {\n  m: [SearchM, CloseM],\n  l: [SearchM, CloseM],\n};\n\nclass InputSearch extends Component {\n  static displayName = 'InputSearch';\n\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages)];\n  static defaultProps = {\n    defaultValue: '',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n  inputRef = React.createRef();\n  closeIconRef = React.createRef();\n\n  static contextType = selectContext;\n\n  uncontrolledProps() {\n    return {\n      value: null,\n    };\n  }\n\n  handleClear = (e) => {\n    this.handlers.value('', e);\n    setTimeout(() => {\n      if (\n        document.activeElement === document.body ||\n        document.activeElement === this.closeIconRef.current\n      ) {\n        this.inputRef.current?.focus();\n      }\n    }, 0);\n  };\n\n  render() {\n    const Value = Root;\n    const SInputSearch = Input;\n    const SClose = Input.Addon;\n    const { size, value, styles, getI18nText } = this.asProps;\n    const finalSize = size || this.context.size || 'm';\n    const hideClose = !value;\n    const IconClose = sizeToIcon[finalSize][1];\n    const IconSearch = sizeToIcon[finalSize][0];\n\n    return sstyled(styles)(\n      <SInputSearch size={finalSize} styles={styles}>\n        <Input.Addon>\n          <IconSearch />\n        </Input.Addon>\n        <Value render={Input.Value} autoFocus ref={this.inputRef} />\n        <SClose\n          role='button'\n          tag={IconClose}\n          ref={this.closeIconRef}\n          /* hide through css because the width of the input changes */\n          hide={hideClose}\n          aria-hidden={hideClose}\n          interactive\n          aria-label={getI18nText('clearSearch')}\n          onClick={this.handleClear}\n        />\n      </SInputSearch>,\n    );\n  }\n}\n\nexport default createComponent(InputSearch);\n"],"mappings":"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"}

package/lib/es6/Select.js

@@ -33,13 +33,13 @@ import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
 import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
 import { setFocus } from '@semcore/utils/lib/use/useFocusLock';
 /*__reshadow-styles__:"./style/select.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_14ywa_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_14ywa_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_14ywa_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_14ywa_gg_._size_l_14ywa_gg_{width:20px;height:20px}.___SOptionCheckbox_14ywa_gg_._size_l_14ywa_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_14ywa_gg_.__checked_14ywa_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_14ywa_gg_.__theme_14ywa_gg_:before{border-color:var(--theme_14ywa)}.___SOptionCheckbox_14ywa_gg_.__theme_14ywa_gg_.__checked_14ywa_gg_:before{background-color:var(--theme_14ywa);border-color:var(--theme_14ywa)}.___SOptionCheckbox_14ywa_gg_.__selected_14ywa_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_14ywa_gg_.__selected_14ywa_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}" /*__inner_css_end__*/, "14ywa_gg_") /*__reshadow_css_end__*/, {
-  "__SOptionCheckbox": "___SOptionCheckbox_14ywa_gg_",
-  "_size_l": "_size_l_14ywa_gg_",
-  "_checked": "__checked_14ywa_gg_",
-  "_theme": "__theme_14ywa_gg_",
-  "--theme": "--theme_14ywa",
-  "_selected": "__selected_14ywa_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_yjnpb_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_yjnpb_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_yjnpb_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_yjnpb_gg_._size_l_yjnpb_gg_{width:20px;height:20px}.___SOptionCheckbox_yjnpb_gg_._size_l_yjnpb_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_yjnpb_gg_.__checked_yjnpb_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_yjnpb_gg_.__theme_yjnpb_gg_:before{border-color:var(--theme_yjnpb)}.___SOptionCheckbox_yjnpb_gg_.__theme_yjnpb_gg_.__checked_yjnpb_gg_:before{background-color:var(--theme_yjnpb);border-color:var(--theme_yjnpb)}.___SOptionCheckbox_yjnpb_gg_.__selected_yjnpb_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_yjnpb_gg_.__selected_yjnpb_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}" /*__inner_css_end__*/, "yjnpb_gg_") /*__reshadow_css_end__*/, {
+  "__SOptionCheckbox": "___SOptionCheckbox_yjnpb_gg_",
+  "_size_l": "_size_l_yjnpb_gg_",
+  "_checked": "__checked_yjnpb_gg_",
+  "_theme": "__theme_yjnpb_gg_",
+  "--theme": "--theme_yjnpb",
+  "_selected": "__selected_yjnpb_gg_"
 });
 function isSelectedOption(value, valueOption) {
   return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;

package/lib/es6/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport DropdownMenu, {\n  DropdownMenuContext,\n  DropdownMenuItemProps,\n  DropdownMenuProps,\n  DropdownMenuHandlers,\n  DropdownMenuTriggerProps,\n} from '@semcore/dropdown-menu';\nimport { ButtonTrigger, BaseTriggerProps, ButtonTriggerProps } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport { InputValueProps } from '@semcore/input';\nimport { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface ISelectInputSearch extends SelectInputSearch, UnknownProperties {}\nexport type SelectInputSearch = InputValueProps & {};\n\nexport type OptionValue = string | number;\nexport type SelectValue = string | number | Array<string | number> | null;\n\nexport type SelectOption = {\n  value: OptionValue;\n  children?: React.ReactNode;\n  label?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface ISelectProps<T extends SelectValue = SelectValue> extends SelectProps<T> {}\nexport type SelectProps<T extends SelectValue = SelectValue> = DropdownMenuProps &\n  BaseTriggerProps & {\n    /**\n     * Multiple select\n     */\n    multiselect?: boolean;\n    /**\n     * Options array\n     */\n    options?: SelectOption[];\n    /**\n     * The value or values array selected by default when using multiselect\n     * @type SelectValue\n     */\n    defaultValue?: T;\n    /**\n     * The selected value or values array when using multiselect\n     * @type SelectValue\n     */\n    value?: T;\n    /**\n     * Callback on value change\n     * @type (value: SelectValue, e: React.SyntheticEvent) => boolean | void\n     */\n    onChange?:\n      | ((value: T, e: React.SyntheticEvent) => boolean | void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /**\n     * Trigger placeholder at not selected value\n     */\n    placeholder?: React.ReactNode;\n    /**\n     * Trigger state\n     */\n    state?: 'normal' | 'valid' | 'invalid';\n    /**\n     * Disables select\n     */\n    disabled?: boolean;\n    /**\n     * Input name\n     */\n    name?: string;\n    locale?: string;\n    /**\n     * If enabled, after opening select popper view will be scrolled to selected option or, if there are multiple selected options, to the first selected option.\n     * @default true\n     */\n    scrollToSelected?: boolean;\n  };\n\n/** @deprecated */\nexport interface ISelectOption extends SelectOption, UnknownProperties {}\n\n/** @deprecated */\nexport interface ISelectOptionProps extends SelectOptionProps, UnknownProperties {}\nexport type SelectOptionProps = DropdownMenuItemProps & {\n  /** Value of the option */\n  value: string | number;\n};\n\n/** @deprecated */\nexport interface ISelectOptionCheckboxProps extends SelectOptionCheckboxProps, UnknownProperties {}\nexport type SelectOptionCheckboxProps = SelectOptionProps & {\n  /** Checkbox theme */\n  theme?: string;\n};\n\ndeclare const InputSearch: Intergalactic.Component<'div', SelectInputSearch>;\n\n/** @deprecated */\nexport interface ISelectContext extends SelectContext, UnknownProperties {}\nexport type SelectContext = DropdownMenuContext & {\n  getOptionProps: PropGetterFn;\n  getOptionCheckboxProps: PropGetterFn;\n  getDividerProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ISelectHandlers extends SelectHandlers, UnknownProperties {}\nexport type SelectHandlers = DropdownMenuHandlers & {\n  value: (index: SelectValue) => void;\n};\n\ntype IntergalacticSelectComponent = (<\n  Value extends SelectValue,\n  Tag extends Intergalactic.InternalTypings.ComponentTag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    SelectProps<Value>,\n    SelectContext,\n    [handlers: SelectHandlers]\n  >,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n  Intergalactic.InternalTypings.ComponentAdditive<'div'>;\n\ndeclare const Select: IntergalacticSelectComponent & {\n  Trigger: Intergalactic.Component<\n    'div',\n    DropdownMenuTriggerProps & ButtonTriggerProps,\n    {},\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof ButtonTrigger.Addon;\n    Text: typeof ButtonTrigger.Text;\n  };\n  Popper: typeof DropdownMenu.Popper;\n  List: typeof DropdownMenu.List;\n  Menu: typeof DropdownMenu.Menu;\n  Option: Intergalactic.Component<\n    'option',\n    SelectOptionProps,\n    SelectContext,\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof DropdownMenu.Item.Addon;\n    Checkbox: Intergalactic.Component<'div', BoxProps & { theme?: string; selected?: boolean }>;\n  };\n  OptionTitle: typeof DropdownMenu.ItemTitle;\n  OptionHint: typeof DropdownMenu.ItemHint;\n  Divider: typeof Divider;\n  InputSearch: typeof InputSearch;\n  Input: typeof InputSearch;\n};\n\nexport { InputSearch };\nexport default Select;\n"],"mappings":""}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport DropdownMenu, {\n  DropdownMenuContext,\n  DropdownMenuItemProps,\n  DropdownMenuProps,\n  DropdownMenuHandlers,\n  DropdownMenuTriggerProps,\n} from '@semcore/dropdown-menu';\nimport { ButtonTrigger, BaseTriggerProps, ButtonTriggerProps } from '@semcore/base-trigger';\nimport Divider from '@semcore/divider';\nimport { InputValueProps } from '@semcore/input';\nimport { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface ISelectInputSearch extends SelectInputSearch, UnknownProperties {}\nexport type SelectInputSearch = InputValueProps & {};\n\nexport type OptionValue = string | number;\nexport type SelectValue = string | number | Array<string | number> | null;\n\nexport type SelectOption = {\n  value: OptionValue;\n  children?: React.ReactNode;\n  label?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface ISelectProps<T extends SelectValue = SelectValue> extends SelectProps<T> {}\nexport type SelectProps<T extends SelectValue = SelectValue> = DropdownMenuProps &\n  BaseTriggerProps & {\n    /**\n     * Multiple select\n     */\n    multiselect?: boolean;\n    /**\n     * Options array\n     */\n    options?: SelectOption[];\n    /**\n     * The value or values array selected by default when using multiselect\n     * @type SelectValue\n     */\n    defaultValue?: T;\n    /**\n     * The selected value or values array when using multiselect\n     * @type SelectValue\n     */\n    value?: T;\n    /**\n     * Callback on value change\n     * @type (value: SelectValue, e: React.SyntheticEvent) => boolean | void\n     */\n    onChange?:\n      | ((value: T, e: React.SyntheticEvent) => boolean | void)\n      | React.Dispatch<React.SetStateAction<T>>;\n    /**\n     * Trigger placeholder at not selected value\n     */\n    placeholder?: React.ReactNode;\n    /**\n     * Trigger state\n     */\n    state?: 'normal' | 'valid' | 'invalid';\n    /**\n     * Disables select\n     */\n    disabled?: boolean;\n    /**\n     * Input name\n     */\n    name?: string;\n    locale?: string;\n    /**\n     * If enabled, after opening select popper view will be scrolled to selected option or, if there are multiple selected options, to the first selected option.\n     * @default true\n     */\n    scrollToSelected?: boolean;\n  };\n\n/** @deprecated */\nexport interface ISelectOption extends SelectOption, UnknownProperties {}\n\n/** @deprecated */\nexport interface ISelectOptionProps extends SelectOptionProps, UnknownProperties {}\nexport type SelectOptionProps = DropdownMenuItemProps & {\n  /** Value of the option */\n  value: string | number;\n};\n\n/** @deprecated */\nexport interface ISelectOptionCheckboxProps extends SelectOptionCheckboxProps, UnknownProperties {}\nexport type SelectOptionCheckboxProps = SelectOptionProps & {\n  /** Checkbox theme */\n  theme?: string;\n};\n\ndeclare const InputSearch: Intergalactic.Component<'div', SelectInputSearch>;\n\n/** @deprecated */\nexport interface ISelectContext extends SelectContext, UnknownProperties {}\nexport type SelectContext = DropdownMenuContext & {\n  getOptionProps: PropGetterFn;\n  getOptionCheckboxProps: PropGetterFn;\n  getDividerProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ISelectHandlers extends SelectHandlers, UnknownProperties {}\nexport type SelectHandlers = DropdownMenuHandlers & {\n  value: (index: SelectValue) => void;\n};\n\ntype IntergalacticSelectComponent = (<\n  Value extends SelectValue,\n  Tag extends Intergalactic.Tag = 'div',\n>(\n  props: Intergalactic.InternalTypings.ComponentProps<\n    Tag,\n    SelectProps<Value>,\n    SelectContext,\n    [handlers: SelectHandlers]\n  >,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n  Intergalactic.InternalTypings.ComponentAdditive<'div'>;\n\ndeclare const Select: IntergalacticSelectComponent & {\n  Trigger: Intergalactic.Component<\n    'div',\n    DropdownMenuTriggerProps & ButtonTriggerProps,\n    {},\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof ButtonTrigger.Addon;\n    Text: typeof ButtonTrigger.Text;\n  };\n  Popper: typeof DropdownMenu.Popper;\n  List: typeof DropdownMenu.List;\n  Menu: typeof DropdownMenu.Menu;\n  Option: Intergalactic.Component<\n    'option',\n    SelectOptionProps,\n    SelectContext,\n    [handlers: SelectHandlers]\n  > & {\n    Addon: typeof DropdownMenu.Item.Addon;\n    Checkbox: Intergalactic.Component<'div', BoxProps & { theme?: string; selected?: boolean }>;\n  };\n  OptionTitle: typeof DropdownMenu.ItemTitle;\n  OptionHint: typeof DropdownMenu.ItemHint;\n  Divider: typeof Divider;\n  InputSearch: typeof InputSearch;\n  Input: typeof InputSearch;\n};\n\nexport { InputSearch };\nexport default Select;\n"],"mappings":""}

package/lib/types/index.d.ts

@@ -113,7 +113,7 @@ export type SelectHandlers = DropdownMenuHandlers & {
 
 type IntergalacticSelectComponent = (<
   Value extends SelectValue,
-  Tag extends Intergalactic.InternalTypings.ComponentTag = 'div',
+  Tag extends Intergalactic.Tag = 'div',
 >(
   props: Intergalactic.InternalTypings.ComponentProps<
     Tag,

package/package.json

@@ -1,25 +1,25 @@
 {
   "name": "@semcore/select",
   "description": "Semrush Select Component",
-  "version": "4.0.0-beta.0",
+  "version": "4.0.0",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
   "author": "UI-kit team <ui-kit-team@semrush.com>",
   "license": "MIT",
   "dependencies": {
-    "@semcore/base-trigger": "4.0.0-beta.0",
-    "@semcore/checkbox": "^6",
-    "@semcore/divider": "4.0.0-beta.0",
-    "@semcore/dropdown-menu": "4.0.0-beta.0",
-    "@semcore/flex-box": "5.0.0-beta.0",
-    "@semcore/icon": "4.0.0-beta.0",
-    "@semcore/input": "4.0.0-beta.0",
-    "@semcore/utils": "4.0.0-beta.0",
+    "@semcore/base-trigger": "4.0.0",
+    "@semcore/checkbox": "7.0.0",
+    "@semcore/divider": "4.0.0",
+    "@semcore/dropdown-menu": "4.0.0",
+    "@semcore/flex-box": "5.0.0",
+    "@semcore/icon": "4.0.0",
+    "@semcore/input": "4.0.0",
+    "@semcore/utils": "4.0.0",
     "classnames": "2.2.6"
   },
   "peerDependencies": {
-    "@semcore/core": "2.0.0-beta.0",
+    "@semcore/core": "2.0.0",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },
@@ -30,6 +30,7 @@
   },
   "devDependencies": {
     "@types/react": "18.0.21",
+    "@types/classnames": "2.2.6",
     "@guidepup/playwright": "0.6.1",
     "@playwright/test": "1.25.1",
     "@semcore/testing-utils": "1.0.0"