@semcore/dropdown-menu 2.3.8 → 2.3.11

package/CHANGELOG.md

@@ -2,6 +2,24 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
+## [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
+
+- Fixed enter space in input trigger for `DropdownMenu.Trigger`.
+
 ## [2.3.8] - 2022-02-24
 
 ### Added

package/lib/cjs/DropdownMenu.js

@@ -84,6 +84,7 @@ _core.sstyled.insert(
   "__SPopper": "___SPopper_1sdvk_gg_"
 });
 var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
+var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
 
 var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
   (0, _inherits2["default"])(DropdownMenuRoot, _Component);
@@ -105,6 +106,7 @@ var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "prevHighlightedIndex", null);
     (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handlerKeyDown", function (e) {
       var amount = e.shiftKey ? 5 : 1;
+      if (e.key === ' ' && INTERACTION_TAGS.includes(e.target.tagName)) return;
       if (!KEYS.includes(e.key)) return;
       e.preventDefault();
 
@@ -277,8 +279,7 @@ var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _ref = this ? this.asProps : arguments[0];
-
+      var _ref = this.asProps;
       var _this$asProps3 = this.asProps,
           Children = _this$asProps3.Children,
           optionCount = _this$asProps3.optionCount,
@@ -313,7 +314,7 @@ var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
 });
 
 function List(props) {
-  var _ref2 = this ? this.asProps : arguments[0],
+  var _ref2 = arguments[0],
       _ref6;
 
   var SDropdownMenuList = _flexBox.Box;
@@ -324,8 +325,7 @@ function List(props) {
 }
 
 function Menu() {
-  var _ref3 = this ? this.asProps : arguments[0];
-
+  var _ref3 = arguments[0];
   return /*#__PURE__*/_react["default"].createElement(DropdownMenu.Popper, null, /*#__PURE__*/_react["default"].createElement(DropdownMenu.List, (0, _core.assignProps)({}, _ref3)));
 }
 
@@ -362,7 +362,7 @@ function Addon(props) {
 }
 
 function Hint(props) {
-  var _ref4 = this ? this.asProps : arguments[0],
+  var _ref4 = arguments[0],
       _ref7;
 
   var SDropdownMenuItem = _flexBox.Flex;
@@ -372,7 +372,7 @@ function Hint(props) {
 }
 
 function Title(props) {
-  var _ref5 = this ? this.asProps : arguments[0],
+  var _ref5 = arguments[0],
       _ref8;
 
   var SDropdownMenuItem = _flexBox.Flex;

package/lib/cjs/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/DropdownMenu.js"],"names":["KEYS","DropdownMenuRoot","e","amount","shiftKey","includes","key","preventDefault","handlers","visible","moveHighlightedIndex","_highlightedItem","click","props","index","asProps","onSelect","multiselect","result","node","scrollIntoView","highlightedIndex","prevHighlightedIndex","block","inline","size","onKeyDown","handlerKeyDown","tabIndex","highlighted","extraProps","undefined","onClick","bindHandlerFallbackSelect","_items","push","ref","scrollToNode","itemsLastIndex","length","selectedIndex","findIndex","item","selected","newIndex","disabled","Children","optionCount","triggerType","other","logger","warn","DropdownMenu","displayName","interaction","Dropdown","Component","style","defaultVisible","defaultHighlightedIndex","List","SDropdownMenuList","Box","styles","ScrollAreaComponent","Menu","Item","forwardRef","SDropdownMenuItem","className","cn","Addon","SDropdownMenuItemAddon","Hint","Flex","Title","Trigger","Popper","ItemTitle","ItemHint","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Dropdown from '@semcore/dropdown';\nimport { Box, Flex, useBox, useFlex } from '@semcore/flex-box';\nimport ScrollAreaComponent from '@semcore/scroll-area';\nimport logger from '@semcore/utils/lib/logger';\n\nimport style from './style/dropdown-menu.shadow.css';\n\nconst KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];\n\nclass DropdownMenuRoot extends Component {\n  static displayName = 'DropdownMenu';\n  static style = style;\n\n  static defaultProps = {\n    size: 'm',\n    defaultVisible: false,\n    defaultHighlightedIndex: null,\n  };\n\n  _items = [];\n\n  _highlightedItem = null;\n\n  prevHighlightedIndex = null;\n\n  uncontrolledProps() {\n    return {\n      highlightedIndex: null,\n      visible: null,\n    };\n  }\n\n  handlerKeyDown = (e) => {\n    const amount = e.shiftKey ? 5 : 1;\n\n    if (!KEYS.includes(e.key)) return;\n\n    e.preventDefault();\n\n    this.handlers.visible(true);\n\n    switch (e.key) {\n      case 'ArrowDown':\n        this.moveHighlightedIndex(amount, e);\n        break;\n      case 'ArrowUp':\n        this.moveHighlightedIndex(-amount, e);\n        break;\n      case ' ':\n      case 'Enter':\n        if (this._highlightedItem) this._highlightedItem.click();\n        break;\n    }\n  };\n\n  bindHandlerFallbackSelect = (props, index) => () => {\n    const { onSelect, multiselect } = this.asProps;\n    const result = onSelect({\n      index,\n      ...props,\n    });\n\n    if (!multiselect && result !== false) {\n      this.handlers.visible(false);\n    }\n  };\n\n  getTriggerProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getListProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getPopperProps() {\n    return {\n      tabIndex: 0,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getItemProps(props, index) {\n    const { size, highlightedIndex, onSelect } = this.asProps;\n    const highlighted = index === highlightedIndex;\n    const extraProps = {};\n\n    if (onSelect !== undefined) {\n      extraProps.onClick = this.bindHandlerFallbackSelect(props, index);\n    }\n\n    this._items.push(props);\n    if (highlighted) {\n      extraProps.ref = this.scrollToNode;\n    }\n\n    return {\n      size,\n      highlighted,\n      ...extraProps,\n    };\n  }\n\n  getItemHintProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getItemTitleProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  scrollToNode = (node) => {\n    this._highlightedItem = node;\n    if (node && node.scrollIntoView) {\n      if (this.asProps.highlightedIndex !== this.prevHighlightedIndex) {\n        this.prevHighlightedIndex = this.asProps.highlightedIndex;\n        node.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    }\n  };\n\n  moveHighlightedIndex(amount, e) {\n    let { highlightedIndex } = this.asProps;\n    const itemsLastIndex = this._items.length - 1;\n    const selectedIndex = this._items.findIndex((item) => item.selected);\n\n    if (itemsLastIndex < 0) return;\n\n    if (highlightedIndex == null) {\n      if (selectedIndex !== -1) {\n        highlightedIndex = selectedIndex;\n      } else {\n        highlightedIndex = amount < 0 ? 0 : itemsLastIndex;\n      }\n    }\n\n    let newIndex = highlightedIndex + amount;\n    if (newIndex < 0) {\n      newIndex = amount + itemsLastIndex + 1;\n    } else if (newIndex > itemsLastIndex) {\n      newIndex = newIndex - itemsLastIndex - 1;\n    }\n\n    if (this._items[newIndex] && this._items[newIndex].disabled) {\n      this.moveHighlightedIndex(amount < 0 ? amount - 1 : amount + 1, e);\n    } else {\n      this.handlers.highlightedIndex(newIndex, e);\n    }\n  }\n\n  componentDidUpdate() {\n    const { visible } = this.asProps;\n\n    if (!visible) {\n      this.handlers.highlightedIndex(null);\n    }\n  }\n\n  render() {\n    const { Children, optionCount, triggerType, onSelect, ...other } = this.asProps;\n    const props = {};\n\n    this._items = [];\n\n    logger.warn(\n      onSelect !== undefined,\n      \"Property 'onSelect' is deprecated, subscribe to the 'onClick' of the needed 'Item'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      optionCount !== undefined,\n      \"The 'optionCount' property is deprecated and is now automatically determined from the number of Item\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      triggerType !== undefined,\n      \"The 'triggerType' property is deprecated, use 'interaction=\\\"focus\\\"'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    if (triggerType === 'input') {\n      props.interaction = 'focus';\n    }\n\n    return (\n      <Root render={Dropdown} {...props}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction List(props) {\n  const SDropdownMenuList = Root;\n  return sstyled(props.styles)(\n    <SDropdownMenuList render={Box} tag={ScrollAreaComponent} role=\"menu\" />,\n  );\n}\n\nfunction Menu() {\n  return (\n    <DropdownMenu.Popper>\n      <Root render={DropdownMenu.List} />\n    </DropdownMenu.Popper>\n  );\n}\n\nfunction Item(props) {\n  const [SDropdownMenuItem, { className, ...other }] = useFlex(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItem\n      role=\"menuitem\"\n      tabIndex={-1}\n      className={\n        cn(\n          styles.cn('SDropdownMenuItem', {\n            ...props,\n            highlighted: !props.disabled && props.highlighted,\n          }).className,\n          className,\n        ) || undefined\n      }\n      {...other}\n    />\n  );\n}\n\nfunction Addon(props) {\n  const [SDropdownMenuItemAddon, { className, ...other }] = useBox(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItemAddon\n      className={cn(styles.cn('SDropdownMenuItemAddon', props).className, className) || undefined}\n      {...other}\n    />\n  );\n}\n\nfunction Hint(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"hint\" />);\n}\n\nfunction Title(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"title\" />);\n}\n\nconst DropdownMenu = createComponent(\n  DropdownMenuRoot,\n  {\n    Trigger: Dropdown.Trigger,\n    Popper: Dropdown.Popper,\n    List,\n    Menu,\n    Item: [Item, { Addon }],\n    ItemTitle: Title,\n    ItemHint: Hint,\n  },\n  {\n    parent: [Dropdown],\n  },\n);\n\nexport default DropdownMenu;\n"],"file":"DropdownMenu.js"}
+{"version":3,"sources":["../../src/DropdownMenu.jsx"],"names":["KEYS","INTERACTION_TAGS","DropdownMenuRoot","e","amount","shiftKey","key","includes","target","tagName","preventDefault","handlers","visible","moveHighlightedIndex","_highlightedItem","click","props","index","asProps","onSelect","multiselect","result","node","scrollIntoView","highlightedIndex","prevHighlightedIndex","block","inline","size","onKeyDown","handlerKeyDown","tabIndex","highlighted","extraProps","undefined","onClick","bindHandlerFallbackSelect","_items","push","ref","scrollToNode","itemsLastIndex","length","selectedIndex","findIndex","item","selected","newIndex","disabled","Children","optionCount","triggerType","other","logger","warn","DropdownMenu","displayName","interaction","Dropdown","Component","style","defaultVisible","defaultHighlightedIndex","List","SDropdownMenuList","Box","styles","ScrollAreaComponent","Menu","Item","forwardRef","SDropdownMenuItem","className","cn","Addon","SDropdownMenuItemAddon","Hint","Flex","Title","Trigger","Popper","ItemTitle","ItemHint","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Dropdown from '@semcore/dropdown';\nimport { Box, Flex, useBox, useFlex } from '@semcore/flex-box';\nimport ScrollAreaComponent from '@semcore/scroll-area';\nimport logger from '@semcore/utils/lib/logger';\n\nimport style from './style/dropdown-menu.shadow.css';\n\nconst KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];\nconst INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];\n\nclass DropdownMenuRoot extends Component {\n  static displayName = 'DropdownMenu';\n  static style = style;\n\n  static defaultProps = {\n    size: 'm',\n    defaultVisible: false,\n    defaultHighlightedIndex: null,\n  };\n\n  _items = [];\n\n  _highlightedItem = null;\n\n  prevHighlightedIndex = null;\n\n  uncontrolledProps() {\n    return {\n      highlightedIndex: null,\n      visible: null,\n    };\n  }\n\n  handlerKeyDown = (e) => {\n    const amount = e.shiftKey ? 5 : 1;\n\n    if (e.key === ' ' && INTERACTION_TAGS.includes(e.target.tagName)) return;\n    if (!KEYS.includes(e.key)) return;\n\n    e.preventDefault();\n\n    this.handlers.visible(true);\n\n    switch (e.key) {\n      case 'ArrowDown':\n        this.moveHighlightedIndex(amount, e);\n        break;\n      case 'ArrowUp':\n        this.moveHighlightedIndex(-amount, e);\n        break;\n      case ' ':\n      case 'Enter':\n        if (this._highlightedItem) this._highlightedItem.click();\n        break;\n    }\n  };\n\n  bindHandlerFallbackSelect = (props, index) => () => {\n    const { onSelect, multiselect } = this.asProps;\n    const result = onSelect({\n      index,\n      ...props,\n    });\n\n    if (!multiselect && result !== false) {\n      this.handlers.visible(false);\n    }\n  };\n\n  getTriggerProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getListProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getPopperProps() {\n    return {\n      tabIndex: 0,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getItemProps(props, index) {\n    const { size, highlightedIndex, onSelect } = this.asProps;\n    const highlighted = index === highlightedIndex;\n    const extraProps = {};\n\n    if (onSelect !== undefined) {\n      extraProps.onClick = this.bindHandlerFallbackSelect(props, index);\n    }\n\n    this._items.push(props);\n    if (highlighted) {\n      extraProps.ref = this.scrollToNode;\n    }\n\n    return {\n      size,\n      highlighted,\n      ...extraProps,\n    };\n  }\n\n  getItemHintProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getItemTitleProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  scrollToNode = (node) => {\n    this._highlightedItem = node;\n    if (node && node.scrollIntoView) {\n      if (this.asProps.highlightedIndex !== this.prevHighlightedIndex) {\n        this.prevHighlightedIndex = this.asProps.highlightedIndex;\n        node.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    }\n  };\n\n  moveHighlightedIndex(amount, e) {\n    let { highlightedIndex } = this.asProps;\n    const itemsLastIndex = this._items.length - 1;\n    const selectedIndex = this._items.findIndex((item) => item.selected);\n\n    if (itemsLastIndex < 0) return;\n\n    if (highlightedIndex == null) {\n      if (selectedIndex !== -1) {\n        highlightedIndex = selectedIndex;\n      } else {\n        highlightedIndex = amount < 0 ? 0 : itemsLastIndex;\n      }\n    }\n\n    let newIndex = highlightedIndex + amount;\n    if (newIndex < 0) {\n      newIndex = amount + itemsLastIndex + 1;\n    } else if (newIndex > itemsLastIndex) {\n      newIndex = newIndex - itemsLastIndex - 1;\n    }\n\n    if (this._items[newIndex] && this._items[newIndex].disabled) {\n      this.moveHighlightedIndex(amount < 0 ? amount - 1 : amount + 1, e);\n    } else {\n      this.handlers.highlightedIndex(newIndex, e);\n    }\n  }\n\n  componentDidUpdate() {\n    const { visible } = this.asProps;\n\n    if (!visible) {\n      this.handlers.highlightedIndex(null);\n    }\n  }\n\n  render() {\n    const { Children, optionCount, triggerType, onSelect, ...other } = this.asProps;\n    const props = {};\n\n    this._items = [];\n\n    logger.warn(\n      onSelect !== undefined,\n      \"Property 'onSelect' is deprecated, subscribe to the 'onClick' of the needed 'Item'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      optionCount !== undefined,\n      \"The 'optionCount' property is deprecated and is now automatically determined from the number of Item\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      triggerType !== undefined,\n      \"The 'triggerType' property is deprecated, use 'interaction=\\\"focus\\\"'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    if (triggerType === 'input') {\n      props.interaction = 'focus';\n    }\n\n    return (\n      <Root render={Dropdown} {...props}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction List(props) {\n  const SDropdownMenuList = Root;\n  return sstyled(props.styles)(\n    <SDropdownMenuList render={Box} tag={ScrollAreaComponent} role=\"menu\" />,\n  );\n}\n\nfunction Menu() {\n  return (\n    <DropdownMenu.Popper>\n      <Root render={DropdownMenu.List} />\n    </DropdownMenu.Popper>\n  );\n}\n\nfunction Item(props) {\n  const [SDropdownMenuItem, { className, ...other }] = useFlex(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItem\n      role=\"menuitem\"\n      tabIndex={-1}\n      className={\n        cn(\n          styles.cn('SDropdownMenuItem', {\n            ...props,\n            highlighted: !props.disabled && props.highlighted,\n          }).className,\n          className,\n        ) || undefined\n      }\n      {...other}\n    />\n  );\n}\n\nfunction Addon(props) {\n  const [SDropdownMenuItemAddon, { className, ...other }] = useBox(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItemAddon\n      className={cn(styles.cn('SDropdownMenuItemAddon', props).className, className) || undefined}\n      {...other}\n    />\n  );\n}\n\nfunction Hint(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"hint\" />);\n}\n\nfunction Title(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"title\" />);\n}\n\nconst DropdownMenu = createComponent(\n  DropdownMenuRoot,\n  {\n    Trigger: Dropdown.Trigger,\n    Popper: Dropdown.Popper,\n    List,\n    Menu,\n    Item: [Item, { Addon }],\n    ItemTitle: Title,\n    ItemHint: Hint,\n  },\n  {\n    parent: [Dropdown],\n  },\n);\n\nexport default DropdownMenu;\n"],"file":"DropdownMenu.js"}

package/lib/cjs/index.d.ts

@@ -0,0 +1,121 @@
+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' | 'xl';
+
+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;
+  /** @deprecated v2.0.0 */
+  optionCount?: number;
+  /** Trigger type selection
+   * @deprecated v2.0.0 */
+  triggerType?: 'button' | 'input';
+  /** Handler in option selection
+   * @deprecated v2.0.0 */
+  onSelect?: (item: any) => void;
+  /** Multiple choice of options
+   * @deprecated v2.0.0 {@link ISelectProps.multiselect} */
+  multiselect?: boolean;
+}
+
+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/cjs/index.js

@@ -1,11 +1,10 @@
 "use strict";
 
-var _typeof = require("@babel/runtime/helpers/typeof");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-var _exportNames = {};
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
@@ -13,21 +12,5 @@ Object.defineProperty(exports, "default", {
   }
 });
 
-var _DropdownMenu = _interopRequireWildcard(require("./DropdownMenu"));
-
-Object.keys(_DropdownMenu).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _DropdownMenu[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _DropdownMenu[key];
-    }
-  });
-});
-
-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); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _DropdownMenu = _interopRequireDefault(require("./DropdownMenu"));
 //# sourceMappingURL=index.js.map

package/lib/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export { default } from './DropdownMenu';\nexport * from './DropdownMenu';\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default } from './DropdownMenu';\n"],"file":"index.js"}

package/lib/es6/DropdownMenu.js

@@ -59,6 +59,7 @@ _sstyled.insert(
   "__SPopper": "___SPopper_1sdvk_gg_"
 });
 var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
+var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
 
 var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
   _inherits(DropdownMenuRoot, _Component);
@@ -84,6 +85,7 @@ var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
 
     _defineProperty(_assertThisInitialized(_this), "handlerKeyDown", function (e) {
       var amount = e.shiftKey ? 5 : 1;
+      if (e.key === ' ' && INTERACTION_TAGS.includes(e.target.tagName)) return;
       if (!KEYS.includes(e.key)) return;
       e.preventDefault();
 
@@ -259,7 +261,7 @@ var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "render",
     value: function render() {
-      var _ref = this ? this.asProps : arguments[0];
+      var _ref = this.asProps;
 
       var _this$asProps3 = this.asProps,
           Children = _this$asProps3.Children,
@@ -296,7 +298,7 @@ _defineProperty(DropdownMenuRoot, "defaultProps", {
 });
 
 function List(props) {
-  var _ref2 = this ? this.asProps : arguments[0],
+  var _ref2 = arguments[0],
       _ref6;
 
   var SDropdownMenuList = Box;
@@ -307,8 +309,7 @@ function List(props) {
 }
 
 function Menu() {
-  var _ref3 = this ? this.asProps : arguments[0];
-
+  var _ref3 = arguments[0];
   return /*#__PURE__*/React.createElement(DropdownMenu.Popper, null, /*#__PURE__*/React.createElement(DropdownMenu.List, _assignProps3({}, _ref3)));
 }
 
@@ -345,7 +346,7 @@ function Addon(props) {
 }
 
 function Hint(props) {
-  var _ref4 = this ? this.asProps : arguments[0],
+  var _ref4 = arguments[0],
       _ref7;
 
   var SDropdownMenuItem = Flex;
@@ -355,7 +356,7 @@ function Hint(props) {
 }
 
 function Title(props) {
-  var _ref5 = this ? this.asProps : arguments[0],
+  var _ref5 = arguments[0],
       _ref8;
 
   var SDropdownMenuItem = Flex;

package/lib/es6/DropdownMenu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/DropdownMenu.js"],"names":["React","cn","createComponent","Component","sstyled","Root","Dropdown","Box","Flex","useBox","useFlex","ScrollAreaComponent","logger","KEYS","DropdownMenuRoot","e","amount","shiftKey","includes","key","preventDefault","handlers","visible","moveHighlightedIndex","_highlightedItem","click","props","index","asProps","onSelect","multiselect","result","node","scrollIntoView","highlightedIndex","prevHighlightedIndex","block","inline","size","onKeyDown","handlerKeyDown","tabIndex","highlighted","extraProps","undefined","onClick","bindHandlerFallbackSelect","_items","push","ref","scrollToNode","itemsLastIndex","length","selectedIndex","findIndex","item","selected","newIndex","disabled","Children","optionCount","triggerType","other","warn","DropdownMenu","displayName","interaction","style","defaultVisible","defaultHighlightedIndex","List","SDropdownMenuList","styles","Menu","Item","forwardRef","SDropdownMenuItem","className","Addon","SDropdownMenuItemAddon","Hint","Title","Trigger","Popper","ItemTitle","ItemHint","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Dropdown from '@semcore/dropdown';\nimport { Box, Flex, useBox, useFlex } from '@semcore/flex-box';\nimport ScrollAreaComponent from '@semcore/scroll-area';\nimport logger from '@semcore/utils/lib/logger';\n\nimport style from './style/dropdown-menu.shadow.css';\n\nconst KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];\n\nclass DropdownMenuRoot extends Component {\n  static displayName = 'DropdownMenu';\n  static style = style;\n\n  static defaultProps = {\n    size: 'm',\n    defaultVisible: false,\n    defaultHighlightedIndex: null,\n  };\n\n  _items = [];\n\n  _highlightedItem = null;\n\n  prevHighlightedIndex = null;\n\n  uncontrolledProps() {\n    return {\n      highlightedIndex: null,\n      visible: null,\n    };\n  }\n\n  handlerKeyDown = (e) => {\n    const amount = e.shiftKey ? 5 : 1;\n\n    if (!KEYS.includes(e.key)) return;\n\n    e.preventDefault();\n\n    this.handlers.visible(true);\n\n    switch (e.key) {\n      case 'ArrowDown':\n        this.moveHighlightedIndex(amount, e);\n        break;\n      case 'ArrowUp':\n        this.moveHighlightedIndex(-amount, e);\n        break;\n      case ' ':\n      case 'Enter':\n        if (this._highlightedItem) this._highlightedItem.click();\n        break;\n    }\n  };\n\n  bindHandlerFallbackSelect = (props, index) => () => {\n    const { onSelect, multiselect } = this.asProps;\n    const result = onSelect({\n      index,\n      ...props,\n    });\n\n    if (!multiselect && result !== false) {\n      this.handlers.visible(false);\n    }\n  };\n\n  getTriggerProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getListProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getPopperProps() {\n    return {\n      tabIndex: 0,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getItemProps(props, index) {\n    const { size, highlightedIndex, onSelect } = this.asProps;\n    const highlighted = index === highlightedIndex;\n    const extraProps = {};\n\n    if (onSelect !== undefined) {\n      extraProps.onClick = this.bindHandlerFallbackSelect(props, index);\n    }\n\n    this._items.push(props);\n    if (highlighted) {\n      extraProps.ref = this.scrollToNode;\n    }\n\n    return {\n      size,\n      highlighted,\n      ...extraProps,\n    };\n  }\n\n  getItemHintProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getItemTitleProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  scrollToNode = (node) => {\n    this._highlightedItem = node;\n    if (node && node.scrollIntoView) {\n      if (this.asProps.highlightedIndex !== this.prevHighlightedIndex) {\n        this.prevHighlightedIndex = this.asProps.highlightedIndex;\n        node.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    }\n  };\n\n  moveHighlightedIndex(amount, e) {\n    let { highlightedIndex } = this.asProps;\n    const itemsLastIndex = this._items.length - 1;\n    const selectedIndex = this._items.findIndex((item) => item.selected);\n\n    if (itemsLastIndex < 0) return;\n\n    if (highlightedIndex == null) {\n      if (selectedIndex !== -1) {\n        highlightedIndex = selectedIndex;\n      } else {\n        highlightedIndex = amount < 0 ? 0 : itemsLastIndex;\n      }\n    }\n\n    let newIndex = highlightedIndex + amount;\n    if (newIndex < 0) {\n      newIndex = amount + itemsLastIndex + 1;\n    } else if (newIndex > itemsLastIndex) {\n      newIndex = newIndex - itemsLastIndex - 1;\n    }\n\n    if (this._items[newIndex] && this._items[newIndex].disabled) {\n      this.moveHighlightedIndex(amount < 0 ? amount - 1 : amount + 1, e);\n    } else {\n      this.handlers.highlightedIndex(newIndex, e);\n    }\n  }\n\n  componentDidUpdate() {\n    const { visible } = this.asProps;\n\n    if (!visible) {\n      this.handlers.highlightedIndex(null);\n    }\n  }\n\n  render() {\n    const { Children, optionCount, triggerType, onSelect, ...other } = this.asProps;\n    const props = {};\n\n    this._items = [];\n\n    logger.warn(\n      onSelect !== undefined,\n      \"Property 'onSelect' is deprecated, subscribe to the 'onClick' of the needed 'Item'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      optionCount !== undefined,\n      \"The 'optionCount' property is deprecated and is now automatically determined from the number of Item\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      triggerType !== undefined,\n      \"The 'triggerType' property is deprecated, use 'interaction=\\\"focus\\\"'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    if (triggerType === 'input') {\n      props.interaction = 'focus';\n    }\n\n    return (\n      <Root render={Dropdown} {...props}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction List(props) {\n  const SDropdownMenuList = Root;\n  return sstyled(props.styles)(\n    <SDropdownMenuList render={Box} tag={ScrollAreaComponent} role=\"menu\" />,\n  );\n}\n\nfunction Menu() {\n  return (\n    <DropdownMenu.Popper>\n      <Root render={DropdownMenu.List} />\n    </DropdownMenu.Popper>\n  );\n}\n\nfunction Item(props) {\n  const [SDropdownMenuItem, { className, ...other }] = useFlex(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItem\n      role=\"menuitem\"\n      tabIndex={-1}\n      className={\n        cn(\n          styles.cn('SDropdownMenuItem', {\n            ...props,\n            highlighted: !props.disabled && props.highlighted,\n          }).className,\n          className,\n        ) || undefined\n      }\n      {...other}\n    />\n  );\n}\n\nfunction Addon(props) {\n  const [SDropdownMenuItemAddon, { className, ...other }] = useBox(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItemAddon\n      className={cn(styles.cn('SDropdownMenuItemAddon', props).className, className) || undefined}\n      {...other}\n    />\n  );\n}\n\nfunction Hint(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"hint\" />);\n}\n\nfunction Title(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"title\" />);\n}\n\nconst DropdownMenu = createComponent(\n  DropdownMenuRoot,\n  {\n    Trigger: Dropdown.Trigger,\n    Popper: Dropdown.Popper,\n    List,\n    Menu,\n    Item: [Item, { Addon }],\n    ItemTitle: Title,\n    ItemHint: Hint,\n  },\n  {\n    parent: [Dropdown],\n  },\n);\n\nexport default DropdownMenu;\n"],"file":"DropdownMenu.js"}
+{"version":3,"sources":["../../src/DropdownMenu.jsx"],"names":["React","cn","createComponent","Component","sstyled","Root","Dropdown","Box","Flex","useBox","useFlex","ScrollAreaComponent","logger","KEYS","INTERACTION_TAGS","DropdownMenuRoot","e","amount","shiftKey","key","includes","target","tagName","preventDefault","handlers","visible","moveHighlightedIndex","_highlightedItem","click","props","index","asProps","onSelect","multiselect","result","node","scrollIntoView","highlightedIndex","prevHighlightedIndex","block","inline","size","onKeyDown","handlerKeyDown","tabIndex","highlighted","extraProps","undefined","onClick","bindHandlerFallbackSelect","_items","push","ref","scrollToNode","itemsLastIndex","length","selectedIndex","findIndex","item","selected","newIndex","disabled","Children","optionCount","triggerType","other","warn","DropdownMenu","displayName","interaction","style","defaultVisible","defaultHighlightedIndex","List","SDropdownMenuList","styles","Menu","Item","forwardRef","SDropdownMenuItem","className","Addon","SDropdownMenuItemAddon","Hint","Title","Trigger","Popper","ItemTitle","ItemHint","parent"],"mappings":"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","sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Dropdown from '@semcore/dropdown';\nimport { Box, Flex, useBox, useFlex } from '@semcore/flex-box';\nimport ScrollAreaComponent from '@semcore/scroll-area';\nimport logger from '@semcore/utils/lib/logger';\n\nimport style from './style/dropdown-menu.shadow.css';\n\nconst KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];\nconst INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];\n\nclass DropdownMenuRoot extends Component {\n  static displayName = 'DropdownMenu';\n  static style = style;\n\n  static defaultProps = {\n    size: 'm',\n    defaultVisible: false,\n    defaultHighlightedIndex: null,\n  };\n\n  _items = [];\n\n  _highlightedItem = null;\n\n  prevHighlightedIndex = null;\n\n  uncontrolledProps() {\n    return {\n      highlightedIndex: null,\n      visible: null,\n    };\n  }\n\n  handlerKeyDown = (e) => {\n    const amount = e.shiftKey ? 5 : 1;\n\n    if (e.key === ' ' && INTERACTION_TAGS.includes(e.target.tagName)) return;\n    if (!KEYS.includes(e.key)) return;\n\n    e.preventDefault();\n\n    this.handlers.visible(true);\n\n    switch (e.key) {\n      case 'ArrowDown':\n        this.moveHighlightedIndex(amount, e);\n        break;\n      case 'ArrowUp':\n        this.moveHighlightedIndex(-amount, e);\n        break;\n      case ' ':\n      case 'Enter':\n        if (this._highlightedItem) this._highlightedItem.click();\n        break;\n    }\n  };\n\n  bindHandlerFallbackSelect = (props, index) => () => {\n    const { onSelect, multiselect } = this.asProps;\n    const result = onSelect({\n      index,\n      ...props,\n    });\n\n    if (!multiselect && result !== false) {\n      this.handlers.visible(false);\n    }\n  };\n\n  getTriggerProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getListProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getPopperProps() {\n    return {\n      tabIndex: 0,\n      onKeyDown: this.handlerKeyDown,\n    };\n  }\n\n  getItemProps(props, index) {\n    const { size, highlightedIndex, onSelect } = this.asProps;\n    const highlighted = index === highlightedIndex;\n    const extraProps = {};\n\n    if (onSelect !== undefined) {\n      extraProps.onClick = this.bindHandlerFallbackSelect(props, index);\n    }\n\n    this._items.push(props);\n    if (highlighted) {\n      extraProps.ref = this.scrollToNode;\n    }\n\n    return {\n      size,\n      highlighted,\n      ...extraProps,\n    };\n  }\n\n  getItemHintProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  getItemTitleProps() {\n    const { size } = this.asProps;\n    return {\n      size,\n    };\n  }\n\n  scrollToNode = (node) => {\n    this._highlightedItem = node;\n    if (node && node.scrollIntoView) {\n      if (this.asProps.highlightedIndex !== this.prevHighlightedIndex) {\n        this.prevHighlightedIndex = this.asProps.highlightedIndex;\n        node.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      }\n    }\n  };\n\n  moveHighlightedIndex(amount, e) {\n    let { highlightedIndex } = this.asProps;\n    const itemsLastIndex = this._items.length - 1;\n    const selectedIndex = this._items.findIndex((item) => item.selected);\n\n    if (itemsLastIndex < 0) return;\n\n    if (highlightedIndex == null) {\n      if (selectedIndex !== -1) {\n        highlightedIndex = selectedIndex;\n      } else {\n        highlightedIndex = amount < 0 ? 0 : itemsLastIndex;\n      }\n    }\n\n    let newIndex = highlightedIndex + amount;\n    if (newIndex < 0) {\n      newIndex = amount + itemsLastIndex + 1;\n    } else if (newIndex > itemsLastIndex) {\n      newIndex = newIndex - itemsLastIndex - 1;\n    }\n\n    if (this._items[newIndex] && this._items[newIndex].disabled) {\n      this.moveHighlightedIndex(amount < 0 ? amount - 1 : amount + 1, e);\n    } else {\n      this.handlers.highlightedIndex(newIndex, e);\n    }\n  }\n\n  componentDidUpdate() {\n    const { visible } = this.asProps;\n\n    if (!visible) {\n      this.handlers.highlightedIndex(null);\n    }\n  }\n\n  render() {\n    const { Children, optionCount, triggerType, onSelect, ...other } = this.asProps;\n    const props = {};\n\n    this._items = [];\n\n    logger.warn(\n      onSelect !== undefined,\n      \"Property 'onSelect' is deprecated, subscribe to the 'onClick' of the needed 'Item'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      optionCount !== undefined,\n      \"The 'optionCount' property is deprecated and is now automatically determined from the number of Item\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    logger.warn(\n      triggerType !== undefined,\n      \"The 'triggerType' property is deprecated, use 'interaction=\\\"focus\\\"'\",\n      other['data-ui-name'] || DropdownMenu.displayName,\n    );\n    if (triggerType === 'input') {\n      props.interaction = 'focus';\n    }\n\n    return (\n      <Root render={Dropdown} {...props}>\n        <Children />\n      </Root>\n    );\n  }\n}\n\nfunction List(props) {\n  const SDropdownMenuList = Root;\n  return sstyled(props.styles)(\n    <SDropdownMenuList render={Box} tag={ScrollAreaComponent} role=\"menu\" />,\n  );\n}\n\nfunction Menu() {\n  return (\n    <DropdownMenu.Popper>\n      <Root render={DropdownMenu.List} />\n    </DropdownMenu.Popper>\n  );\n}\n\nfunction Item(props) {\n  const [SDropdownMenuItem, { className, ...other }] = useFlex(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItem\n      role=\"menuitem\"\n      tabIndex={-1}\n      className={\n        cn(\n          styles.cn('SDropdownMenuItem', {\n            ...props,\n            highlighted: !props.disabled && props.highlighted,\n          }).className,\n          className,\n        ) || undefined\n      }\n      {...other}\n    />\n  );\n}\n\nfunction Addon(props) {\n  const [SDropdownMenuItemAddon, { className, ...other }] = useBox(props, props.forwardRef);\n  const styles = sstyled(props.styles);\n  return (\n    <SDropdownMenuItemAddon\n      className={cn(styles.cn('SDropdownMenuItemAddon', props).className, className) || undefined}\n      {...other}\n    />\n  );\n}\n\nfunction Hint(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"hint\" />);\n}\n\nfunction Title(props) {\n  const SDropdownMenuItem = Root;\n  return sstyled(props.styles)(<SDropdownMenuItem render={Flex} variant=\"title\" />);\n}\n\nconst DropdownMenu = createComponent(\n  DropdownMenuRoot,\n  {\n    Trigger: Dropdown.Trigger,\n    Popper: Dropdown.Popper,\n    List,\n    Menu,\n    Item: [Item, { Addon }],\n    ItemTitle: Title,\n    ItemHint: Hint,\n  },\n  {\n    parent: [Dropdown],\n  },\n);\n\nexport default DropdownMenu;\n"],"file":"DropdownMenu.js"}

package/lib/es6/index.d.ts

@@ -0,0 +1,121 @@
+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' | 'xl';
+
+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;
+  /** @deprecated v2.0.0 */
+  optionCount?: number;
+  /** Trigger type selection
+   * @deprecated v2.0.0 */
+  triggerType?: 'button' | 'input';
+  /** Handler in option selection
+   * @deprecated v2.0.0 */
+  onSelect?: (item: any) => void;
+  /** Multiple choice of options
+   * @deprecated v2.0.0 {@link ISelectProps.multiselect} */
+  multiselect?: boolean;
+}
+
+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.js

@@ -1,3 +1,2 @@
 export { default } from './DropdownMenu';
-export * from './DropdownMenu';
 //# sourceMappingURL=index.js.map

package/lib/es6/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,gBAAxB;AACA,cAAc,gBAAd","sourcesContent":["export { default } from './DropdownMenu';\nexport * from './DropdownMenu';\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,gBAAxB","sourcesContent":["export { default } from './DropdownMenu';\n"],"file":"index.js"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/dropdown-menu",
   "description": "SEMRush DropdownMenu Component",
-  "version": "2.3.8",
+  "version": "2.3.11",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -16,7 +16,8 @@
     "@semcore/utils": "^3.15",
     "@semcore/dropdown": "^2",
     "@semcore/flex-box": "^4",
-    "@semcore/scroll-area": "^3"
+    "@semcore/scroll-area": "^3",
+    "classnames": "2.2.6"
   },
   "peerDependencies": {
     "@semcore/core": "^1.11",
@@ -29,5 +30,8 @@
     "type": "git",
     "url": "https://github.com/semrush/intergalactic.git",
     "directory": "semcore/dropdown-menu"
+  },
+  "devDependencies": {
+    "@semcore/jest-preset-ui": "1.0.0"
   }
 }

package/src/{DropdownMenu.js → DropdownMenu.jsx}

@@ -9,6 +9,7 @@ import logger from '@semcore/utils/lib/logger';
 import style from './style/dropdown-menu.shadow.css';
 
 const KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
+const INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
 
 class DropdownMenuRoot extends Component {
   static displayName = 'DropdownMenu';
@@ -36,6 +37,7 @@ class DropdownMenuRoot extends Component {
   handlerKeyDown = (e) => {
     const amount = e.shiftKey ? 5 : 1;
 
+    if (e.key === ' ' && INTERACTION_TAGS.includes(e.target.tagName)) return;
     if (!KEYS.includes(e.key)) return;
 
     e.preventDefault();

package/src/index.js

@@ -1,2 +1 @@
 export { default } from './DropdownMenu';
-export * from './DropdownMenu';