@semcore/dropdown-menu 3.1.0 → 3.1.2

package/CHANGELOG.md

@@ -2,6 +2,12 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [3.1.2] - 2022-10-10
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/dropdown` [3.1.1 ~> 3.1.2]).
+
 ## [3.1.0] - 2022-09-07
 
 ### Added
@@ -14,36 +20,6 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 - Version patch update due to children dependencies update (`@semcore/utils` [3.37.0 ~> 3.37.1], `@semcore/dropdown` [3.0.10 ~> 3.0.11]).
 
-## [3.0.11] - 2022-08-18
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.36.0 ~> 3.37.0], `@semcore/dropdown` [3.0.9 ~> 3.0.10]).
-
-## [3.0.10] - 2022-08-11
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.35.1 ~> 3.36.0], `@semcore/dropdown` [3.0.8 ~> 3.0.9]).
-
-## [3.0.9] - 2022-08-01
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.35.0 ~> 3.35.1], `@semcore/dropdown` [3.0.7 ~> 3.0.8]).
-
-## [3.0.8] - 2022-07-22
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.34.0 ~> 3.35.0], `@semcore/dropdown` [3.0.6 ~> 3.0.7]).
-
-## [3.0.7] - 2022-07-18
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/dropdown` [3.0.5 ~> 3.0.6]).
-
 ## [3.0.6] - 2022-07-12
 
 ### Fixed
@@ -56,30 +32,6 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 - Version patch update due to children dependencies update (`@semcore/utils` [3.33.0 ~> 3.34.0], `@semcore/dropdown` [3.0.4 ~> 3.0.5]).
 
-## [3.0.4] - 2022-06-02
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.32.2 ~> 3.33.0], `@semcore/dropdown` [3.0.3 ~> 3.0.4]).
-
-## [3.0.3] - 2022-05-31
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.32.1 ~> 3.32.2], `@semcore/dropdown` [3.0.2 ~> 3.0.3]).
-
-## [3.0.2] - 2022-05-19
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/dropdown` [3.0.1 ~> 3.0.2]).
-
-## [3.0.1] - 2022-05-19
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.32.0 ~> 3.32.1], `@semcore/dropdown` [3.0.0 ~> 3.0.1], `@semcore/flex-box` [4.5.1 ~> 4.5.3]).
-
 ## [3.0.0] - 2022-05-17
 
 ### BREAK
@@ -94,18 +46,6 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 - Version patch update due to children dependencies update (`@semcore/scroll-area` [3.7.0 ~> 3.7.1]).
 
-## [2.3.11] - 2022-04-21
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/scroll-area` [3.6.4 ~> 3.7.0]).
-
-## [2.3.10] - 2022-03-14
-
-### Changed
-
-- Version patch update due to children dependencies update (`@semcore/utils` [3.31.2 ~> 3.31.2], `@semcore/dropdown` [2.3.2 ~> 2.3.3]).
-
 ## [2.3.9] - 2022-03-09
 
 ### Fixed

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright ©, 2022, Semrush Inc. (written by Roman Lysov, Sergey Kobets, Mikhail Karachev, Julia Mnizhek, Elena Krasnopolskaia, Mikhail Sereniti).
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/lib/cjs/DropdownMenu.js

@@ -63,23 +63,23 @@ var style = (
 /*__reshadow_css_start__*/
 _core.sstyled.insert(
 /*__inner_css_start__*/
-".___SDropdownMenuList_1tre5_gg_{max-height:240px;margin:4px 0;padding:0;position:relative;min-height:26px;min-width:32px}.___SDropdownMenuItem_1tre5_gg_{display:flex;align-items:center;position:relative;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal}.___SDropdownMenuItem_1tre5_gg_:hover{background-color:#f4f5f9}.___SDropdownMenuItem_1tre5_gg_:focus{outline:none}.___SDropdownMenuItem_1tre5_gg_.__highlighted_1tre5_gg_{z-index:1;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2) inset}.___SDropdownMenuItem_1tre5_gg_.__selected_1tre5_gg_{background-color:rgba(196,229,254,.7)}.___SDropdownMenuItem_1tre5_gg_.__selected_1tre5_gg_:hover{background-color:#c4e5fe}.___SDropdownMenuItem_1tre5_gg_.__disabled_1tre5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SDropdownMenuItem_1tre5_gg_._size_l_1tre5_gg_{font-size:16px;line-height:1.5;padding:8px 12px;min-height:40px}.___SDropdownMenuItem_1tre5_gg_._size_m_1tre5_gg_{font-size:14px;line-height:1.42;padding:6px 8px;min-height:32px}.___SDropdownMenuItem_1tre5_gg_.__notInteractive_1tre5_gg_{cursor:default}.___SDropdownMenuItem_1tre5_gg_.__notInteractive_1tre5_gg_:hover{background:none}.___SDropdownMenuItem_1tre5_gg_._variant_hint_1tre5_gg_{color:#6c6e79;cursor:default}.___SDropdownMenuItem_1tre5_gg_._variant_hint_1tre5_gg_:hover{background:none}.___SDropdownMenuItem_1tre5_gg_._variant_title_1tre5_gg_{font-weight:700;cursor:default}.___SDropdownMenuItem_1tre5_gg_._variant_title_1tre5_gg_:hover{background:none}.___SDropdownMenuItemAddon_1tre5_gg_{display:inline-flex;margin-left:8px;margin-right:8px}.___SDropdownMenuItemAddon_1tre5_gg_:first-child{margin-left:0}.___SDropdownMenuItemAddon_1tre5_gg_:last-child{margin-right:0}.___SPopper_1tre5_gg_:focus{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}"
+":root {\n\n  /* DEPRECATED START\n     Deprecated variables should never be used in\n     components styles but preserved for backward\n     compatibility if they used in projects\n     like `<Badge bg=\"red\">alpha</Badge>`\n  */\n  /* DEPRECATED END */\n}\n\n.___SDropdownMenuList_12g84_gg_ {\n  max-height: 240px;\n  margin: 4px 0;\n  padding: 0;\n  position: relative;\n  min-height: 26px;\n  min-width: 32px;\n}\n\n.___SDropdownMenuItem_12g84_gg_ {\n  display: flex;\n  align-items: center;\n  position: relative;\n  text-decoration: none;\n  box-sizing: border-box;\n  cursor: pointer;\n  width: 100%;\n  text-align: left;\n  line-height: normal\n}\n\n.___SDropdownMenuItem_12g84_gg_:hover {\n    background-color: #f4f5f9;\n  }\n\n.___SDropdownMenuItem_12g84_gg_:focus {\n    outline: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_.__highlighted_12g84_gg_ {\n  z-index: 1;\n  box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2) inset;\n}\n\n.___SDropdownMenuItem_12g84_gg_.__selected_12g84_gg_ {\n  background-color: rgba(196, 229, 254, 0.7)\n}\n\n.___SDropdownMenuItem_12g84_gg_.__selected_12g84_gg_:hover {\n    background-color: #c4e5fe;\n  }\n\n.___SDropdownMenuItem_12g84_gg_.__disabled_12g84_gg_ {\n  opacity: 0.3;\n  cursor: default;\n  pointer-events: none;\n}\n\n.___SDropdownMenuItem_12g84_gg_._size_l_12g84_gg_ {\n  font-size: 16px;\n  line-height: 1.5;\n  padding: 8px 12px;\n  min-height: 40px;\n}\n\n.___SDropdownMenuItem_12g84_gg_._size_m_12g84_gg_ {\n  font-size: 14px;\n  line-height: 1.42;\n  padding: 6px 8px;\n  min-height: 32px;\n}\n\n.___SDropdownMenuItem_12g84_gg_.__notInteractive_12g84_gg_ {\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_.__notInteractive_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_._variant_hint_12g84_gg_ {\n  color: #6c6e79;\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_._variant_hint_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_._variant_title_12g84_gg_ {\n  font-weight: bold;\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_._variant_title_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItemAddon_12g84_gg_ {\n  display: inline-flex;\n  margin-left: 8px;\n  margin-right: 8px\n}\n\n.___SDropdownMenuItemAddon_12g84_gg_:first-child {\n    margin-left: 0;\n  }\n\n.___SDropdownMenuItemAddon_12g84_gg_:last-child {\n    margin-right: 0;\n  }\n\n.___SPopper_12g84_gg_:focus {\n    box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2);\n  }\n"
 /*__inner_css_end__*/
-, "1tre5_gg_")
+, "12g84_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SDropdownMenuList": "___SDropdownMenuList_1tre5_gg_",
-  "__SDropdownMenuItem": "___SDropdownMenuItem_1tre5_gg_",
-  "_highlighted": "__highlighted_1tre5_gg_",
-  "_selected": "__selected_1tre5_gg_",
-  "_disabled": "__disabled_1tre5_gg_",
-  "_size_l": "_size_l_1tre5_gg_",
-  "_size_m": "_size_m_1tre5_gg_",
-  "_notInteractive": "__notInteractive_1tre5_gg_",
-  "_variant_hint": "_variant_hint_1tre5_gg_",
-  "_variant_title": "_variant_title_1tre5_gg_",
-  "__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_1tre5_gg_",
-  "__SPopper": "___SPopper_1tre5_gg_"
+  "__SDropdownMenuList": "___SDropdownMenuList_12g84_gg_",
+  "__SDropdownMenuItem": "___SDropdownMenuItem_12g84_gg_",
+  "_highlighted": "__highlighted_12g84_gg_",
+  "_selected": "__selected_12g84_gg_",
+  "_disabled": "__disabled_12g84_gg_",
+  "_size_l": "_size_l_12g84_gg_",
+  "_size_m": "_size_m_12g84_gg_",
+  "_notInteractive": "__notInteractive_12g84_gg_",
+  "_variant_hint": "_variant_hint_12g84_gg_",
+  "_variant_title": "_variant_title_12g84_gg_",
+  "__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_12g84_gg_",
+  "__SPopper": "___SPopper_12g84_gg_"
 });
 var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
 var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];

package/lib/cjs/index.d.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=index.d.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps, PropGetterFn, ReturnEl } from '@semcore/core';\nimport Dropdown, { IDropdownContext, IDropdownProps, IDropdownHandlers } from '@semcore/dropdown';\nimport { Box, IBoxProps, IFlexProps } from '@semcore/flex-box';\nimport { IScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\nexport interface IDropdownMenuProps extends IDropdownProps {\n  /**\n   * Size of the menu\n   * @default m\n   */\n  size?: DropdownMenuSize;\n  /**\n   * Index of the element selected by default\n   */\n  defaultHighlightedIndex?: number;\n  /**\n   * Index of the selected item\n   */\n  highlightedIndex?: number;\n  /**\n   * Callback for highlightedIndex change\n   * highlightedIndex -  Index of the selected item\n   */\n  onHighlightedIndexChange?: (highlightedIndex: number) => void;\n}\n\nexport interface IDropdownMenuListProps extends IBoxProps, IScrollAreaProps {\n  /**\n   * Size of the menu\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuMenuProps extends IDropdownMenuListProps {}\n\nexport interface IDropdownMenuItemProps extends IFlexProps {\n  /**\n   * Enables selected state\n   */\n  selected?: boolean;\n  /**\n   * Disables the component\n   */\n  disabled?: boolean;\n  /**\n   * Adds focus styles around\n   */\n  highlighted?: boolean;\n  /**\n   * Makes the element non-interactive\n   */\n  notInteractive?: boolean;\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuItemHintProps extends IFlexProps {\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuItemTitleProps extends IFlexProps {\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuContext extends IDropdownContext {\n  getListProps: PropGetterFn;\n  getItemProps: PropGetterFn;\n  getItemHintProps: PropGetterFn;\n  getItemTitleProps: PropGetterFn;\n}\n\nexport interface IDropdownMenuHandlers extends IDropdownHandlers {\n  highlightedIndex: (index: number) => void;\n}\n\ndeclare const DropdownMenu: (<T>(\n  props: CProps<IDropdownMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n) => ReturnEl) & {\n  Trigger: typeof Dropdown.Trigger;\n  Popper: typeof Dropdown.Popper;\n  List: <T>(\n    props: CProps<IDropdownMenuListProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl;\n  Menu: <T>(\n    props: CProps<IDropdownMenuMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl;\n  Item: (<T>(\n    props: CProps<IDropdownMenuItemProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl) & {\n    Addon: typeof Box;\n  };\n  ItemTitle: <T>(props: IDropdownMenuItemTitleProps & T) => ReturnEl;\n  ItemHint: <T>(props: IDropdownMenuItemHintProps & T) => ReturnEl;\n};\n\nexport default DropdownMenu;\n"],"mappings":""}

package/lib/es6/DropdownMenu.js

@@ -39,23 +39,23 @@ var style = (
 /*__reshadow_css_start__*/
 _sstyled.insert(
 /*__inner_css_start__*/
-".___SDropdownMenuList_1tre5_gg_{max-height:240px;margin:4px 0;padding:0;position:relative;min-height:26px;min-width:32px}.___SDropdownMenuItem_1tre5_gg_{display:flex;align-items:center;position:relative;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal}.___SDropdownMenuItem_1tre5_gg_:hover{background-color:#f4f5f9}.___SDropdownMenuItem_1tre5_gg_:focus{outline:none}.___SDropdownMenuItem_1tre5_gg_.__highlighted_1tre5_gg_{z-index:1;box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2) inset}.___SDropdownMenuItem_1tre5_gg_.__selected_1tre5_gg_{background-color:rgba(196,229,254,.7)}.___SDropdownMenuItem_1tre5_gg_.__selected_1tre5_gg_:hover{background-color:#c4e5fe}.___SDropdownMenuItem_1tre5_gg_.__disabled_1tre5_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SDropdownMenuItem_1tre5_gg_._size_l_1tre5_gg_{font-size:16px;line-height:1.5;padding:8px 12px;min-height:40px}.___SDropdownMenuItem_1tre5_gg_._size_m_1tre5_gg_{font-size:14px;line-height:1.42;padding:6px 8px;min-height:32px}.___SDropdownMenuItem_1tre5_gg_.__notInteractive_1tre5_gg_{cursor:default}.___SDropdownMenuItem_1tre5_gg_.__notInteractive_1tre5_gg_:hover{background:none}.___SDropdownMenuItem_1tre5_gg_._variant_hint_1tre5_gg_{color:#6c6e79;cursor:default}.___SDropdownMenuItem_1tre5_gg_._variant_hint_1tre5_gg_:hover{background:none}.___SDropdownMenuItem_1tre5_gg_._variant_title_1tre5_gg_{font-weight:700;cursor:default}.___SDropdownMenuItem_1tre5_gg_._variant_title_1tre5_gg_:hover{background:none}.___SDropdownMenuItemAddon_1tre5_gg_{display:inline-flex;margin-left:8px;margin-right:8px}.___SDropdownMenuItemAddon_1tre5_gg_:first-child{margin-left:0}.___SDropdownMenuItemAddon_1tre5_gg_:last-child{margin-right:0}.___SPopper_1tre5_gg_:focus{box-shadow:0 0 0 3px rgba(0, 143, 248, 0.2)}"
+":root {\n\n  /* DEPRECATED START\n     Deprecated variables should never be used in\n     components styles but preserved for backward\n     compatibility if they used in projects\n     like `<Badge bg=\"red\">alpha</Badge>`\n  */\n  /* DEPRECATED END */\n}\n\n.___SDropdownMenuList_12g84_gg_ {\n  max-height: 240px;\n  margin: 4px 0;\n  padding: 0;\n  position: relative;\n  min-height: 26px;\n  min-width: 32px;\n}\n\n.___SDropdownMenuItem_12g84_gg_ {\n  display: flex;\n  align-items: center;\n  position: relative;\n  text-decoration: none;\n  box-sizing: border-box;\n  cursor: pointer;\n  width: 100%;\n  text-align: left;\n  line-height: normal\n}\n\n.___SDropdownMenuItem_12g84_gg_:hover {\n    background-color: #f4f5f9;\n  }\n\n.___SDropdownMenuItem_12g84_gg_:focus {\n    outline: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_.__highlighted_12g84_gg_ {\n  z-index: 1;\n  box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2) inset;\n}\n\n.___SDropdownMenuItem_12g84_gg_.__selected_12g84_gg_ {\n  background-color: rgba(196, 229, 254, 0.7)\n}\n\n.___SDropdownMenuItem_12g84_gg_.__selected_12g84_gg_:hover {\n    background-color: #c4e5fe;\n  }\n\n.___SDropdownMenuItem_12g84_gg_.__disabled_12g84_gg_ {\n  opacity: 0.3;\n  cursor: default;\n  pointer-events: none;\n}\n\n.___SDropdownMenuItem_12g84_gg_._size_l_12g84_gg_ {\n  font-size: 16px;\n  line-height: 1.5;\n  padding: 8px 12px;\n  min-height: 40px;\n}\n\n.___SDropdownMenuItem_12g84_gg_._size_m_12g84_gg_ {\n  font-size: 14px;\n  line-height: 1.42;\n  padding: 6px 8px;\n  min-height: 32px;\n}\n\n.___SDropdownMenuItem_12g84_gg_.__notInteractive_12g84_gg_ {\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_.__notInteractive_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_._variant_hint_12g84_gg_ {\n  color: #6c6e79;\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_._variant_hint_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItem_12g84_gg_._variant_title_12g84_gg_ {\n  font-weight: bold;\n  cursor: default\n}\n\n.___SDropdownMenuItem_12g84_gg_._variant_title_12g84_gg_:hover {\n    background: none;\n  }\n\n.___SDropdownMenuItemAddon_12g84_gg_ {\n  display: inline-flex;\n  margin-left: 8px;\n  margin-right: 8px\n}\n\n.___SDropdownMenuItemAddon_12g84_gg_:first-child {\n    margin-left: 0;\n  }\n\n.___SDropdownMenuItemAddon_12g84_gg_:last-child {\n    margin-right: 0;\n  }\n\n.___SPopper_12g84_gg_:focus {\n    box-shadow: 0 0 0 3px rgba(0, 143, 248, 0.2);\n  }\n"
 /*__inner_css_end__*/
-, "1tre5_gg_")
+, "12g84_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SDropdownMenuList": "___SDropdownMenuList_1tre5_gg_",
-  "__SDropdownMenuItem": "___SDropdownMenuItem_1tre5_gg_",
-  "_highlighted": "__highlighted_1tre5_gg_",
-  "_selected": "__selected_1tre5_gg_",
-  "_disabled": "__disabled_1tre5_gg_",
-  "_size_l": "_size_l_1tre5_gg_",
-  "_size_m": "_size_m_1tre5_gg_",
-  "_notInteractive": "__notInteractive_1tre5_gg_",
-  "_variant_hint": "_variant_hint_1tre5_gg_",
-  "_variant_title": "_variant_title_1tre5_gg_",
-  "__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_1tre5_gg_",
-  "__SPopper": "___SPopper_1tre5_gg_"
+  "__SDropdownMenuList": "___SDropdownMenuList_12g84_gg_",
+  "__SDropdownMenuItem": "___SDropdownMenuItem_12g84_gg_",
+  "_highlighted": "__highlighted_12g84_gg_",
+  "_selected": "__selected_12g84_gg_",
+  "_disabled": "__disabled_12g84_gg_",
+  "_size_l": "_size_l_12g84_gg_",
+  "_size_m": "_size_m_12g84_gg_",
+  "_notInteractive": "__notInteractive_12g84_gg_",
+  "_variant_hint": "_variant_hint_12g84_gg_",
+  "_variant_title": "_variant_title_12g84_gg_",
+  "__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_12g84_gg_",
+  "__SPopper": "___SPopper_12g84_gg_"
 });
 var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
 var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];

package/lib/es6/index.d.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=index.d.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { CProps, PropGetterFn, ReturnEl } from '@semcore/core';\nimport Dropdown, { IDropdownContext, IDropdownProps, IDropdownHandlers } from '@semcore/dropdown';\nimport { Box, IBoxProps, IFlexProps } from '@semcore/flex-box';\nimport { IScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\nexport interface IDropdownMenuProps extends IDropdownProps {\n  /**\n   * Size of the menu\n   * @default m\n   */\n  size?: DropdownMenuSize;\n  /**\n   * Index of the element selected by default\n   */\n  defaultHighlightedIndex?: number;\n  /**\n   * Index of the selected item\n   */\n  highlightedIndex?: number;\n  /**\n   * Callback for highlightedIndex change\n   * highlightedIndex -  Index of the selected item\n   */\n  onHighlightedIndexChange?: (highlightedIndex: number) => void;\n}\n\nexport interface IDropdownMenuListProps extends IBoxProps, IScrollAreaProps {\n  /**\n   * Size of the menu\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuMenuProps extends IDropdownMenuListProps {}\n\nexport interface IDropdownMenuItemProps extends IFlexProps {\n  /**\n   * Enables selected state\n   */\n  selected?: boolean;\n  /**\n   * Disables the component\n   */\n  disabled?: boolean;\n  /**\n   * Adds focus styles around\n   */\n  highlighted?: boolean;\n  /**\n   * Makes the element non-interactive\n   */\n  notInteractive?: boolean;\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuItemHintProps extends IFlexProps {\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuItemTitleProps extends IFlexProps {\n  /**\n   * Size of the component\n   * @default m\n   */\n  size?: DropdownMenuSize;\n}\n\nexport interface IDropdownMenuContext extends IDropdownContext {\n  getListProps: PropGetterFn;\n  getItemProps: PropGetterFn;\n  getItemHintProps: PropGetterFn;\n  getItemTitleProps: PropGetterFn;\n}\n\nexport interface IDropdownMenuHandlers extends IDropdownHandlers {\n  highlightedIndex: (index: number) => void;\n}\n\ndeclare const DropdownMenu: (<T>(\n  props: CProps<IDropdownMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n) => ReturnEl) & {\n  Trigger: typeof Dropdown.Trigger;\n  Popper: typeof Dropdown.Popper;\n  List: <T>(\n    props: CProps<IDropdownMenuListProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl;\n  Menu: <T>(\n    props: CProps<IDropdownMenuMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl;\n  Item: (<T>(\n    props: CProps<IDropdownMenuItemProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,\n  ) => ReturnEl) & {\n    Addon: typeof Box;\n  };\n  ItemTitle: <T>(props: IDropdownMenuItemTitleProps & T) => ReturnEl;\n  ItemHint: <T>(props: IDropdownMenuItemHintProps & T) => ReturnEl;\n};\n\nexport default DropdownMenu;\n"],"mappings":""}

package/package.json

@@ -1,17 +1,13 @@
 {
   "name": "@semcore/dropdown-menu",
   "description": "Semrush DropdownMenu Component",
-  "version": "3.1.0",
+  "version": "3.1.2",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
   "sideEffects": false,
   "author": "UI-kit team <ui-kit-team@semrush.com>",
   "license": "MIT",
-  "scripts": {
-    "build": "build --source=js",
-    "test": "jest"
-  },
   "dependencies": {
     "@semcore/dropdown": "^3",
     "@semcore/flex-box": "^4",
@@ -32,8 +28,13 @@
     "directory": "semcore/dropdown-menu"
   },
   "devDependencies": {
+    "@types/react": "16.8 - 17",
     "@guidepup/playwright": "0.6.1",
     "@playwright/test": "1.25.1",
     "@semcore/jest-preset-ui": "1.0.0"
+  },
+  "scripts": {
+    "build": "pnpm semcore-builder --source=js",
+    "test": "jest"
   }
-}
+}

package/lib/cjs/index.d.ts

@@ -1,110 +0,0 @@
-import { CProps, PropGetterFn, ReturnEl } from '@semcore/core';
-import Dropdown, { IDropdownContext, IDropdownProps, IDropdownHandlers } from '@semcore/dropdown';
-import { Box, IBoxProps, IFlexProps } from '@semcore/flex-box';
-import { IScrollAreaProps } from '@semcore/scroll-area';
-
-export type DropdownMenuSize = 'm' | 'l';
-
-export interface IDropdownMenuProps extends IDropdownProps {
-  /**
-   * Size of the menu
-   * @default m
-   */
-  size?: DropdownMenuSize;
-  /**
-   * Index of the element selected by default
-   */
-  defaultHighlightedIndex?: number;
-  /**
-   * Index of the selected item
-   */
-  highlightedIndex?: number;
-  /**
-   * Callback for highlightedIndex change
-   * highlightedIndex -  Index of the selected item
-   */
-  onHighlightedIndexChange?: (highlightedIndex: number) => void;
-}
-
-export interface IDropdownMenuListProps extends IBoxProps, IScrollAreaProps {
-  /**
-   * Size of the menu
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuMenuProps extends IDropdownMenuListProps {}
-
-export interface IDropdownMenuItemProps extends IFlexProps {
-  /**
-   * Enables selected state
-   */
-  selected?: boolean;
-  /**
-   * Disables the component
-   */
-  disabled?: boolean;
-  /**
-   * Adds focus styles around
-   */
-  highlighted?: boolean;
-  /**
-   * Makes the element non-interactive
-   */
-  notInteractive?: boolean;
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuItemHintProps extends IFlexProps {
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuItemTitleProps extends IFlexProps {
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuContext extends IDropdownContext {
-  getListProps: PropGetterFn;
-  getItemProps: PropGetterFn;
-  getItemHintProps: PropGetterFn;
-  getItemTitleProps: PropGetterFn;
-}
-
-export interface IDropdownMenuHandlers extends IDropdownHandlers {
-  highlightedIndex: (index: number) => void;
-}
-
-declare const DropdownMenu: (<T>(
-  props: CProps<IDropdownMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-) => ReturnEl) & {
-  Trigger: typeof Dropdown.Trigger;
-  Popper: typeof Dropdown.Popper;
-  List: <T>(
-    props: CProps<IDropdownMenuListProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl;
-  Menu: <T>(
-    props: CProps<IDropdownMenuMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl;
-  Item: (<T>(
-    props: CProps<IDropdownMenuItemProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl) & {
-    Addon: typeof Box;
-  };
-  ItemTitle: <T>(props: IDropdownMenuItemTitleProps & T) => ReturnEl;
-  ItemHint: <T>(props: IDropdownMenuItemHintProps & T) => ReturnEl;
-};
-
-export default DropdownMenu;

package/lib/es6/index.d.ts

@@ -1,110 +0,0 @@
-import { CProps, PropGetterFn, ReturnEl } from '@semcore/core';
-import Dropdown, { IDropdownContext, IDropdownProps, IDropdownHandlers } from '@semcore/dropdown';
-import { Box, IBoxProps, IFlexProps } from '@semcore/flex-box';
-import { IScrollAreaProps } from '@semcore/scroll-area';
-
-export type DropdownMenuSize = 'm' | 'l';
-
-export interface IDropdownMenuProps extends IDropdownProps {
-  /**
-   * Size of the menu
-   * @default m
-   */
-  size?: DropdownMenuSize;
-  /**
-   * Index of the element selected by default
-   */
-  defaultHighlightedIndex?: number;
-  /**
-   * Index of the selected item
-   */
-  highlightedIndex?: number;
-  /**
-   * Callback for highlightedIndex change
-   * highlightedIndex -  Index of the selected item
-   */
-  onHighlightedIndexChange?: (highlightedIndex: number) => void;
-}
-
-export interface IDropdownMenuListProps extends IBoxProps, IScrollAreaProps {
-  /**
-   * Size of the menu
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuMenuProps extends IDropdownMenuListProps {}
-
-export interface IDropdownMenuItemProps extends IFlexProps {
-  /**
-   * Enables selected state
-   */
-  selected?: boolean;
-  /**
-   * Disables the component
-   */
-  disabled?: boolean;
-  /**
-   * Adds focus styles around
-   */
-  highlighted?: boolean;
-  /**
-   * Makes the element non-interactive
-   */
-  notInteractive?: boolean;
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuItemHintProps extends IFlexProps {
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuItemTitleProps extends IFlexProps {
-  /**
-   * Size of the component
-   * @default m
-   */
-  size?: DropdownMenuSize;
-}
-
-export interface IDropdownMenuContext extends IDropdownContext {
-  getListProps: PropGetterFn;
-  getItemProps: PropGetterFn;
-  getItemHintProps: PropGetterFn;
-  getItemTitleProps: PropGetterFn;
-}
-
-export interface IDropdownMenuHandlers extends IDropdownHandlers {
-  highlightedIndex: (index: number) => void;
-}
-
-declare const DropdownMenu: (<T>(
-  props: CProps<IDropdownMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-) => ReturnEl) & {
-  Trigger: typeof Dropdown.Trigger;
-  Popper: typeof Dropdown.Popper;
-  List: <T>(
-    props: CProps<IDropdownMenuListProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl;
-  Menu: <T>(
-    props: CProps<IDropdownMenuMenuProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl;
-  Item: (<T>(
-    props: CProps<IDropdownMenuItemProps & T, IDropdownMenuContext, IDropdownMenuHandlers>,
-  ) => ReturnEl) & {
-    Addon: typeof Box;
-  };
-  ItemTitle: <T>(props: IDropdownMenuItemTitleProps & T) => ReturnEl;
-  ItemHint: <T>(props: IDropdownMenuItemHintProps & T) => ReturnEl;
-};
-
-export default DropdownMenu;