intergalactic 15.109.0-prerelease.1 → 15.110.0-prerelease.0

package/dropdown-menu/lib/es6/DropdownMenuOld.js

@@ -1,683 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectSpread from "@babel/runtime/helpers/objectSpread2";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _createSuper from "@babel/runtime/helpers/createSuper";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import { sstyled as _sstyled } from 'intergalactic/utils/lib/core/index';
-import { assignProps as _assignProps10 } from 'intergalactic/core';
-import { assignProps as _assignProps9 } from 'intergalactic/core';
-import { assignProps as _assignProps8 } from 'intergalactic/core';
-import { assignProps as _assignProps7 } from 'intergalactic/core';
-import { assignProps as _assignProps6 } from 'intergalactic/core';
-import { assignProps as _assignProps5 } from 'intergalactic/core';
-import { assignProps as _assignProps4 } from 'intergalactic/core';
-import { assignProps as _assignProps3 } from 'intergalactic/core';
-import { assignProps as _assignProps2 } from 'intergalactic/core';
-import { assignProps as _assignProps } from 'intergalactic/core';
-var _excluded = ["className"];
-import React from 'react';
-import cn from 'classnames';
-import createComponent, { Component, sstyled, Root } from 'intergalactic/core';
-import Dropdown from 'intergalactic/dropdown';
-import { Flex, useBox } from 'intergalactic/flex-box';
-import ScrollAreaComponent, { hideScrollBarsFromScreenReadersContext } from 'intergalactic/scroll-area';
-import uniqueIDEnhancement from 'intergalactic/utils/lib/uniqueID';
-import i18nEnhance from 'intergalactic/utils/lib/enhances/i18nEnhance';
-import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
-import { useFocusLock } from 'intergalactic/utils/lib/use/useFocusLock';
-import { hasParent } from 'intergalactic/utils/lib/hasParent';
-/*__reshadow-styles__:"./style/dropdown-menu-old.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SDropdownMenuItem_l0ig1_gg_,.___SDropdownMenuList_l0ig1_gg_{position:relative;color:var(--intergalactic-text-primary, #191b23)}.___SDropdownMenuList_l0ig1_gg_{max-height:240px;padding:var(--intergalactic-spacing-1x, 4px)0;min-height:26px;min-width:32px;box-sizing:content-box;z-index:0}.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_:after,.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_:before{width:16px;height:100%;border-radius:var(--intergalactic-control-rounded, 6px)}.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_._position_median_l0ig1_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n        linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_._position_median_l0ig1_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n        linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_._position_start_l0ig1_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n        linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowHorizontal_l0ig1_gg_._position_end_l0ig1_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n        linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_:after,.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_:before{width:100%;height:16px;border-radius:var(--intergalactic-control-rounded, 6px)}.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_._position_median_l0ig1_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n        linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_._position_median_l0ig1_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n        linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_._position_start_l0ig1_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n        linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuList_l0ig1_gg_ .___SShadowVertical_l0ig1_gg_._position_end_l0ig1_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n        linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n      )}.___SDropdownMenuItem_l0ig1_gg_{display:flex;align-items:center;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal}@media (hover:hover){.___SDropdownMenuItem_l0ig1_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownMenuItem_l0ig1_gg_:focus{outline:0}.___SDropdownMenuItem_l0ig1_gg_.__selected_l0ig1_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7));box-shadow:2px 0 0 0 var(--intergalactic-control-primary-info, #008ff8) inset}@media (hover:hover){.___SDropdownMenuItem_l0ig1_gg_.__selected_l0ig1_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownMenuItem_l0ig1_gg_.__highlighted_l0ig1_gg_:not(:focus-within){z-index:1;box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5)) inset}.___SDropdownMenuItem_l0ig1_gg_.__disabled_l0ig1_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownMenuItem_l0ig1_gg_._size_l_l0ig1_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);padding:var(--intergalactic-spacing-2x, 8px) var(--intergalactic-spacing-3x, 12px);min-height:40px}.___SDropdownMenuItem_l0ig1_gg_._size_m_l0ig1_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);padding:calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px)) var(--intergalactic-spacing-2x, 8px);min-height:32px}.___SDropdownMenuItem_l0ig1_gg_.__notInteractive_l0ig1_gg_{cursor:default}@media (hover:hover){.___SDropdownMenuItem_l0ig1_gg_.__notInteractive_l0ig1_gg_:hover{background:0 0}}.___SDropdownMenuItem_l0ig1_gg_._variant_hint_l0ig1_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownMenuItem_l0ig1_gg_._variant_hint_l0ig1_gg_:hover{background:0 0}}.___SDropdownMenuItem_l0ig1_gg_._variant_title_l0ig1_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownMenuItem_l0ig1_gg_._variant_title_l0ig1_gg_:hover{background:0 0}}.___SDropdownMenuItem_l0ig1_gg_.__visible_l0ig1_gg_{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}.___SDropdownMenuItem_l0ig1_gg_.__nesting-trigger_l0ig1_gg_{justify-content:space-between}.___SDropdownMenuItemAddon_l0ig1_gg_{display:inline-flex;margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-2x, 8px)}.___SDropdownMenuItemAddon_l0ig1_gg_:first-child{margin-left:0}.___SDropdownMenuItemAddon_l0ig1_gg_:last-child{margin-right:0}.___SDropdownMenuNesting_l0ig1_gg_,.___SDropdownMenuNesting_l0ig1_gg_._size_l_l0ig1_gg_,.___SDropdownMenuNesting_l0ig1_gg_._size_m_l0ig1_gg_{padding:0}.___SDropdownMenuNesting_l0ig1_gg_.__highlighted_l0ig1_gg_{z-index:1;box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5)) inset}.___SDropdownNestingItem_l0ig1_gg_._size_l_l0ig1_gg_,.___SDropdownNestingItem_l0ig1_gg_._size_m_l0ig1_gg_{padding-right:0}.___SDropdownNestingItem_l0ig1_gg_ .___SDropdownMenuItem_l0ig1_gg_{width:auto;padding-top:0;padding-bottom:0;padding-left:0;min-height:auto}" /*__inner_css_end__*/, "l0ig1_gg_") /*__reshadow_css_end__*/, {
-  "__SDropdownMenuItem": "___SDropdownMenuItem_l0ig1_gg_",
-  "_highlighted": "__highlighted_l0ig1_gg_",
-  "_disabled": "__disabled_l0ig1_gg_",
-  "_size_l": "_size_l_l0ig1_gg_",
-  "_size_m": "_size_m_l0ig1_gg_",
-  "_visible": "__visible_l0ig1_gg_",
-  "_nesting-trigger": "__nesting-trigger_l0ig1_gg_",
-  "__SDropdownMenuNesting": "___SDropdownMenuNesting_l0ig1_gg_",
-  "__SDropdownNestingItem": "___SDropdownNestingItem_l0ig1_gg_",
-  "__SDropdownMenuList": "___SDropdownMenuList_l0ig1_gg_",
-  "__SShadowHorizontal": "___SShadowHorizontal_l0ig1_gg_",
-  "_position_median": "_position_median_l0ig1_gg_",
-  "_position_start": "_position_start_l0ig1_gg_",
-  "_position_end": "_position_end_l0ig1_gg_",
-  "__SShadowVertical": "___SShadowVertical_l0ig1_gg_",
-  "_selected": "__selected_l0ig1_gg_",
-  "_notInteractive": "__notInteractive_l0ig1_gg_",
-  "_variant_hint": "_variant_hint_l0ig1_gg_",
-  "_variant_title": "_variant_title_l0ig1_gg_",
-  "__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_l0ig1_gg_"
-});
-import { setFocus } from 'intergalactic/utils/lib/focus-lock/setFocus';
-import { isFocusInside } from 'intergalactic/utils/lib/focus-lock/isFocusInside';
-import { getFocusableIn } from 'intergalactic/utils/lib/focus-lock/getFocusableIn';
-import keyboardFocusEnhance from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
-var ListBoxContextProvider = function ListBoxContextProvider(_ref18) {
-  var children = _ref18.children;
-  return /*#__PURE__*/React.createElement(hideScrollBarsFromScreenReadersContext.Provider, {
-    value: true
-  }, children);
-};
-var DropdownMenuRoot = /*#__PURE__*/function (_Component) {
-  _inherits(DropdownMenuRoot, _Component);
-  var _super = _createSuper(DropdownMenuRoot);
-  function DropdownMenuRoot() {
-    var _this;
-    _classCallCheck(this, DropdownMenuRoot);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      focusLockItemIndex: null,
-      keyboardFocused: false
-    });
-    _defineProperty(_assertThisInitialized(_this), "popperRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_assertThisInitialized(_this), "triggerRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_assertThisInitialized(_this), "itemProps", []);
-    _defineProperty(_assertThisInitialized(_this), "itemRefs", []);
-    _defineProperty(_assertThisInitialized(_this), "highlightedItemRef", /*#__PURE__*/React.createRef());
-    _defineProperty(_assertThisInitialized(_this), "ignoreTriggerKeyboardFocusUntil", 0);
-    _defineProperty(_assertThisInitialized(_this), "prevHighlightedIndex", null);
-    _defineProperty(_assertThisInitialized(_this), "focusTrigger", function () {
-      var trigger = _this.triggerRef.current;
-      if (!trigger) return;
-      if (isFocusInside(trigger)) return;
-      setFocus(trigger);
-    });
-    _defineProperty(_assertThisInitialized(_this), "bindHandlerKeyDown", function (place) {
-      return function (e) {
-        var amount = e.shiftKey ? 5 : 1;
-        var targetTagName = e.target.tagName;
-        var _this$asProps = _this.asProps,
-          visible = _this$asProps.visible,
-          highlightedIndex = _this$asProps.highlightedIndex,
-          placement = _this$asProps.placement;
-        if (e.key === ' ' && ['INPUT', 'TEXTAREA'].includes(targetTagName)) return;
-        if (e.key === 'Enter' && targetTagName === 'TEXTAREA') return;
-        if (place === 'popper' && (e.key === ' ' || e.key === 'Enter') && (targetTagName === 'BUTTON' || targetTagName === 'A')) return;
-        if (visible && e.key === 'Tab') {
-          var item = highlightedIndex !== null && _this.itemRefs[highlightedIndex];
-          if (item && getFocusableIn(item).length !== 0) {
-            _this.setState({
-              focusLockItemIndex: highlightedIndex
-            });
-          } else {
-            _this.handlers.highlightedIndex(null);
-          }
-          return;
-        }
-        if (e.key === 'Escape' && _this.state.focusLockItemIndex !== null) {
-          _this.setState({
-            focusLockItemIndex: null
-          });
-          return false;
-        }
-        var verticalPlacement = !placement || placement.startsWith('top') || placement.startsWith('bottom');
-        if (['ArrowDown', 'ArrowUp'].includes(e.key) && verticalPlacement) {
-          e.preventDefault();
-          _this.handlers.visible(true);
-        }
-        if (['ArrowLeft', 'ArrowRight'].includes(e.key) && !verticalPlacement) {
-          var show = e.key === 'ArrowRight' && placement.startsWith('right') || e.key === 'ArrowLeft' && placement.startsWith('left');
-          var hide = e.key === 'ArrowLeft' && placement.startsWith('right') || e.key === 'ArrowRight' && placement.startsWith('left');
-          var visibleChanged = visible && hide || !visible && show;
-          if (show) {
-            _this.handlers.visible(true);
-          } else if (hide) {
-            _this.handlers.visible(false);
-          }
-          if (visibleChanged) {
-            e.preventDefault();
-            e.stopPropagation();
-            return;
-          }
-        }
-        if (e.key.startsWith('Arrow') && !_this.state.keyboardFocused) {
-          _this.setState({
-            keyboardFocused: true
-          });
-        }
-        if (['ArrowLeft', 'ArrowRight'].includes(e.key)) {
-          var _item = highlightedIndex !== null && _this.itemRefs[highlightedIndex];
-          var focusable = getFocusableIn(_item);
-          if (focusable.length > 0 && _item) {
-            var focusedIndex = focusable.indexOf(document.activeElement);
-            if (e.key === 'ArrowRight') {
-              if (focusedIndex === -1) {
-                _this.setState({
-                  focusLockItemIndex: highlightedIndex
-                });
-              }
-              var nextFocused = focusable[focusedIndex + 1];
-              if (nextFocused) {
-                e.preventDefault();
-                e.stopPropagation();
-                nextFocused.focus();
-              }
-            } else if (e.key === 'ArrowLeft') {
-              if (focusedIndex === 0) {
-                _this.setState({
-                  focusLockItemIndex: null
-                });
-              }
-              var prevFocused = focusable[focusedIndex - 1];
-              if (prevFocused) {
-                e.preventDefault();
-                e.stopPropagation();
-                prevFocused.focus();
-              }
-            }
-          }
-        }
-        switch (e.key) {
-          case 'ArrowDown':
-            {
-              if (visible) {
-                _this.moveHighlightedIndex(amount, e);
-                if (isFocusInside(_this.popperRef.current)) {
-                  _this.focusTrigger();
-                }
-                e.preventDefault();
-                e.stopPropagation();
-              }
-              break;
-            }
-          case 'ArrowUp':
-            {
-              if (visible) {
-                _this.moveHighlightedIndex(-amount, e);
-                if (isFocusInside(_this.popperRef.current)) {
-                  _this.focusTrigger();
-                }
-                e.preventDefault();
-                e.stopPropagation();
-              }
-              break;
-            }
-          case ' ':
-          case 'Enter':
-            if (_this.highlightedItemRef.current && highlightedIndex !== null) {
-              e.stopPropagation();
-              e.preventDefault();
-              _this.highlightedItemRef.current.click();
-            } else {
-              if (place === 'trigger') {
-                _this.handlers.visible(false);
-                e.preventDefault();
-              }
-            }
-            break;
-        }
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleTriggerKeyboardFocus", function () {
-      if (_this.ignoreTriggerKeyboardFocusUntil > Date.now()) return false;
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleTriggerKeyboardFocusedStateChange", function (keyboardFocused) {
-      _this.setState({
-        keyboardFocused: keyboardFocused
-      });
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleItemFocusOut", function (event) {
-      if (event.relatedTarget === _this.popperRef.current) return;
-      var focused = event.relatedTarget;
-      if (hasParent(focused, _this.popperRef.current)) {
-        _this.handlers.highlightedIndex(null);
-        _this.setState({
-          focusLockItemIndex: null
-        });
-        focused.focus();
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleNestingClick", function (event) {
-      var _focusable$;
-      var itemIndex = _this.itemRefs.indexOf(event.currentTarget);
-      if (itemIndex === -1) return;
-      var focusable = getFocusableIn(event.currentTarget);
-      (_focusable$ = focusable[0]) === null || _focusable$ === void 0 ? void 0 : _focusable$.focus();
-      if (focusable[0] && _this.state.focusLockItemIndex === null) {
-        _this.setState({
-          focusLockItemIndex: null
-        });
-        event.preventDefault();
-        event.stopPropagation();
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleNestingKeyDown", function (event) {
-      if (event.key === ' ') {
-        _this.handleNestingClick(event);
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "getNestingProps", function () {
-      var size = _this.asProps.size;
-      return {
-        size: size,
-        onClick: _this.handleNestingClick,
-        onKeyDown: _this.handleNestingKeyDown
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleNestedVisibleChange", function (lastUserInteraction) {
-      if (_this.asProps.visible && _this.asProps.highlightedIndex === null && lastUserInteraction === 'keyboard') {
-        _this.handlers.highlightedIndex(0);
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "getNestingTriggerProps", function () {
-      var _this$asProps2 = _this.asProps,
-        size = _this$asProps2.size,
-        visible = _this$asProps2.visible;
-      return {
-        size: size,
-        visible: visible,
-        onNestedVisibleChange: _this.handleNestedVisibleChange
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "getNestingItemProps", function () {
-      return _this.getNestingTriggerProps();
-    });
-    _defineProperty(_assertThisInitialized(_this), "scrollToNode", function (node) {
-      if (node) {
-        _this.highlightedItemRef.current = node;
-      }
-      setTimeout(function () {
-        if (node !== null && node !== void 0 && node.scrollIntoView) {
-          if (_this.asProps.highlightedIndex !== _this.prevHighlightedIndex) {
-            _this.prevHighlightedIndex = _this.asProps.highlightedIndex;
-            node.scrollIntoView({
-              block: 'nearest',
-              inline: 'nearest'
-            });
-          }
-        }
-      }, 0);
-    });
-    return _this;
-  }
-  _createClass(DropdownMenuRoot, [{
-    key: "uncontrolledProps",
-    value: function uncontrolledProps() {
-      return {
-        highlightedIndex: null,
-        visible: null
-      };
-    }
-  }, {
-    key: "getTriggerProps",
-    value: function getTriggerProps() {
-      var _this$asProps3 = this.asProps,
-        size = _this$asProps3.size,
-        uid = _this$asProps3.uid,
-        disablePortal = _this$asProps3.disablePortal,
-        visible = _this$asProps3.visible,
-        getI18nText = _this$asProps3.getI18nText,
-        highlightedIndex = _this$asProps3.highlightedIndex;
-      return {
-        size: size,
-        id: "igc-".concat(uid, "-trigger"),
-        'aria-controls': "igc-".concat(uid, "-popper"),
-        focusHint: visible && !disablePortal ? getI18nText('triggerHint') : undefined,
-        'aria-expanded': visible ? 'true' : 'false',
-        'aria-activedescendant': visible && highlightedIndex !== null ? "igc-".concat(uid, "-option-").concat(highlightedIndex) : undefined,
-        onKeyDown: this.bindHandlerKeyDown('trigger'),
-        ref: this.triggerRef,
-        onKeyboardFocus: this.handleTriggerKeyboardFocus,
-        onKeyboardFocusedStateChange: this.handleTriggerKeyboardFocusedStateChange
-      };
-    }
-  }, {
-    key: "getListProps",
-    value: function getListProps() {
-      var _this$asProps4 = this.asProps,
-        size = _this$asProps4.size,
-        uid = _this$asProps4.uid;
-      return {
-        size: size,
-        uid: uid,
-        index: this.asProps.highlightedIndex
-      };
-    }
-  }, {
-    key: "getPopperProps",
-    value: function getPopperProps() {
-      var _this$asProps5 = this.asProps,
-        uid = _this$asProps5.uid,
-        disablePortal = _this$asProps5.disablePortal,
-        ignorePortalsStacking = _this$asProps5.ignorePortalsStacking,
-        interaction = _this$asProps5.interaction,
-        highlightedIndex = _this$asProps5.highlightedIndex;
-      return {
-        ref: this.popperRef,
-        tabIndex: 0,
-        onKeyDown: this.bindHandlerKeyDown('popper'),
-        id: "igc-".concat(uid, "-popper"),
-        disablePortal: disablePortal,
-        ignorePortalsStacking: ignorePortalsStacking,
-        focusMaster: interaction === 'click',
-        hideFocus: highlightedIndex !== null,
-        'use:role': null,
-        'use:autoFocus': false
-      };
-    }
-  }, {
-    key: "getItemProps",
-    value: function getItemProps(props, index) {
-      var _this2 = this;
-      var _this$asProps6 = this.asProps,
-        size = _this$asProps6.size,
-        highlightedIndex = _this$asProps6.highlightedIndex,
-        uid = _this$asProps6.uid;
-      var highlighted = index === highlightedIndex;
-      var ref = function ref(node) {
-        _this2.itemRefs[index] = node;
-      };
-      this.itemProps[index] = props;
-      if (highlighted) {
-        ref = function ref(node) {
-          _this2.itemRefs[index] = node;
-          _this2.scrollToNode(node);
-        };
-      }
-      return {
-        id: "igc-".concat(uid, "-option-").concat(index),
-        size: size,
-        highlighted: highlighted,
-        focusLock: this.state.focusLockItemIndex === index,
-        triggerRef: this.triggerRef,
-        ref: ref,
-        index: index,
-        handleFocusOut: this.handleItemFocusOut,
-        triggerKeyboardFocused: this.state.keyboardFocused
-      };
-    }
-  }, {
-    key: "getItemHintProps",
-    value: function getItemHintProps() {
-      var size = this.asProps.size;
-      return {
-        size: size
-      };
-    }
-  }, {
-    key: "getItemTitleProps",
-    value: function getItemTitleProps() {
-      var size = this.asProps.size;
-      return {
-        size: size
-      };
-    }
-  }, {
-    key: "moveHighlightedIndex",
-    value: function moveHighlightedIndex(amount, e) {
-      var _this$itemProps$newIn;
-      var highlightedIndex = this.asProps.highlightedIndex;
-      var itemsLastIndex = this.itemProps.length - 1;
-      var selectedIndex = this.itemProps.findIndex(function (item) {
-        return item.selected;
-      });
-      if (itemsLastIndex < 0) return;
-      if (highlightedIndex == null) {
-        if (selectedIndex !== -1) {
-          highlightedIndex = selectedIndex;
-        } else if (this.highlightedItemRef.current) {
-          highlightedIndex = this.prevHighlightedIndex;
-        } else {
-          highlightedIndex = amount < 0 ? 0 : itemsLastIndex;
-        }
-      }
-      var newIndex = highlightedIndex + amount;
-      if (newIndex < 0) {
-        newIndex = amount + itemsLastIndex + 1;
-      } else if (newIndex > itemsLastIndex) {
-        newIndex = newIndex - itemsLastIndex - 1;
-      }
-      if ((_this$itemProps$newIn = this.itemProps[newIndex]) !== null && _this$itemProps$newIn !== void 0 && _this$itemProps$newIn.disabled) {
-        this.moveHighlightedIndex(amount < 0 ? amount - 1 : amount + 1, e);
-      } else if (!this.itemProps[newIndex]) {
-        this.handlers.highlightedIndex(0, e);
-      } else {
-        this.handlers.highlightedIndex(newIndex, e);
-      }
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate(prevProps) {
-      var _this3 = this;
-      var visibilityChanged = this.asProps.visible !== prevProps.visible;
-      if (visibilityChanged && prevProps.visible !== undefined) {
-        if (!this.asProps.visible) {
-          this.handlers.highlightedIndex(null);
-          this.highlightedItemRef.current = null;
-          this.ignoreTriggerKeyboardFocusUntil = Date.now() + 100;
-          if (document.activeElement === document.body || isFocusInside(this.popperRef.current)) {
-            setFocus(this.triggerRef.current);
-          }
-        }
-      }
-      if (visibilityChanged && this.asProps.visible) {
-        setTimeout(function () {
-          var selectedItemIndex = _this3.itemProps.findIndex(function (item) {
-            return item.selected;
-          });
-          if (selectedItemIndex === -1 || _this3.asProps.highlightedIndex !== null) return;
-          _this3.handlers.highlightedIndex(selectedItemIndex);
-        }, 0);
-      }
-      if ((this.state.focusLockItemIndex !== this.asProps.highlightedIndex || !this.asProps.visible) && this.state.focusLockItemIndex !== null) {
-        setTimeout(function () {
-          _this3.setState({
-            focusLockItemIndex: null
-          });
-        }, 0);
-      }
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps;
-      var Children = this.asProps.Children;
-      this.itemProps = [];
-      return /*#__PURE__*/React.createElement(Dropdown, _assignProps({}, _ref), /*#__PURE__*/React.createElement(Children, null));
-    }
-  }]);
-  return DropdownMenuRoot;
-}(Component);
-_defineProperty(DropdownMenuRoot, "displayName", 'DropdownMenu');
-_defineProperty(DropdownMenuRoot, "style", style);
-_defineProperty(DropdownMenuRoot, "enhance", [uniqueIDEnhancement(), i18nEnhance(localizedMessages)]);
-_defineProperty(DropdownMenuRoot, "defaultProps", {
-  size: 'm',
-  defaultVisible: false,
-  defaultHighlightedIndex: null,
-  i18n: localizedMessages,
-  locale: 'en',
-  interaction: 'click'
-});
-function List(props) {
-  var _ref2 = arguments[0],
-    _ref11;
-  var SDropdownMenuList = ScrollAreaComponent;
-  var uid = props.uid;
-  return _ref11 = sstyled(props.styles), /*#__PURE__*/React.createElement(ListBoxContextProvider, _ref11.cn("ListBoxContextProvider", {}), /*#__PURE__*/React.createElement(SDropdownMenuList, _ref11.cn("SDropdownMenuList", _objectSpread({}, _assignProps2({
-    "tabIndex": null,
-    "role": 'menu',
-    "aria-labelledby": "igc-".concat(uid, "-trigger"),
-    "shadow": true
-  }, _ref2)))));
-}
-function Menu(props) {
-  var _ref3 = arguments[0];
-  var visible = props.visible,
-    disablePortal = props.disablePortal,
-    ignorePortalsStacking = props.ignorePortalsStacking,
-    disableEnforceFocus = props.disableEnforceFocus,
-    interaction = props.interaction,
-    autoFocus = props.autoFocus,
-    animationsDisabled = props.animationsDisabled;
-  var popperProps = {
-    visible: visible,
-    disablePortal: disablePortal,
-    ignorePortalsStacking: ignorePortalsStacking,
-    disableEnforceFocus: disableEnforceFocus,
-    interaction: interaction,
-    autoFocus: autoFocus,
-    animationsDisabled: animationsDisabled
-  };
-  return /*#__PURE__*/React.createElement(ListBoxContextProvider, null, /*#__PURE__*/React.createElement(DropdownMenu.Popper, popperProps, /*#__PURE__*/React.createElement(DropdownMenu.List, _assignProps3({}, _ref3))));
-}
-function Item(_ref19) {
-  var _ref4 = arguments[0],
-    _ref12;
-  var styles = _ref19.styles,
-    label = _ref19.label,
-    triggerRef = _ref19.triggerRef,
-    focusLock = _ref19.focusLock,
-    disabled = _ref19.disabled,
-    highlighted = _ref19.highlighted,
-    handleFocusOut = _ref19.handleFocusOut,
-    triggerKeyboardFocused = _ref19.triggerKeyboardFocused;
-  var SDropdownMenuItem = Flex;
-  var ref = React.useRef();
-  useFocusLock(ref, false, triggerRef, !focusLock || disabled, true, handleFocusOut);
-  return _ref12 = sstyled(styles), /*#__PURE__*/React.createElement(SDropdownMenuItem, _ref12.cn("SDropdownMenuItem", _objectSpread({}, _assignProps4({
-    "ref": ref,
-    "role": 'menuitem',
-    "tabIndex": -1,
-    "id": label,
-    "use:highlighted": !disabled && highlighted && triggerKeyboardFocused
-  }, _ref4))));
-}
-var NestingContext = /*#__PURE__*/React.createContext(null);
-function Nesting(_ref20) {
-  var _ref5 = arguments[0],
-    _ref13;
-  var styles = _ref20.styles,
-    disabled = _ref20.disabled;
-  var SDropdownMenuNesting = DropdownMenu.Item;
-  var contextValue = React.useMemo(function () {
-    return {
-      disabled: disabled
-    };
-  }, [disabled]);
-  return /*#__PURE__*/React.createElement(NestingContext.Provider, {
-    value: contextValue
-  }, (_ref13 = sstyled(styles), /*#__PURE__*/React.createElement(SDropdownMenuNesting, _ref13.cn("SDropdownMenuNesting", _objectSpread({}, _assignProps5({
-    "aria-haspopup": 'true'
-  }, _ref5))))));
-}
-function NestingTrigger(props) {
-  var _ref6 = arguments[0],
-    _ref14;
-  var styles = props.styles,
-    visible = props.visible,
-    onNestedVisibleChange = props.onNestedVisibleChange;
-  var SDropdownMenuItem = Flex;
-  var nestingContext = React.useContext(NestingContext);
-  var disabled = props.disabled || (nestingContext === null || nestingContext === void 0 ? void 0 : nestingContext.disabled);
-  var lastUserInteractionRef = React.useRef(undefined);
-  React.useEffect(function () {
-    onNestedVisibleChange(lastUserInteractionRef.current);
-  }, [visible]);
-  var handleMouseEvent = React.useCallback(function () {
-    lastUserInteractionRef.current = 'mouse';
-  }, []);
-  var handleKeyboardEvent = React.useCallback(function () {
-    lastUserInteractionRef.current = 'keyboard';
-  }, []);
-  React.useEffect(function () {
-    document.addEventListener('mouseover', handleMouseEvent, {
-      capture: true
-    });
-    document.addEventListener('keydown', handleKeyboardEvent, {
-      capture: true
-    });
-    return function () {
-      document.removeEventListener('mouseover', handleMouseEvent, {
-        capture: true
-      });
-      document.removeEventListener('keydown', handleKeyboardEvent, {
-        capture: true
-      });
-    };
-  }, []);
-  return /*#__PURE__*/React.createElement(NestingContext.Provider, {
-    value: null
-  }, (_ref14 = sstyled(styles), /*#__PURE__*/React.createElement(SDropdownMenuItem, _ref14.cn("SDropdownMenuItem", _objectSpread({}, _assignProps6({
-    "nesting-trigger": true,
-    "use:tabIndex": !disabled ? 0 : undefined
-  }, _ref6))))));
-}
-function NestingItem(props) {
-  var _ref7 = arguments[0],
-    _ref15;
-  var styles = props.styles;
-  var SDropdownNestingItem = NestingTrigger;
-  return _ref15 = sstyled(styles), /*#__PURE__*/React.createElement(SDropdownNestingItem, _ref15.cn("SDropdownNestingItem", _objectSpread({}, _assignProps7({
-    "use:tabIndex": -1
-  }, _ref7))));
-}
-function Addon(props) {
-  var _useBox = useBox(props, props.forwardRef),
-    _useBox2 = _slicedToArray(_useBox, 2),
-    SDropdownMenuItemAddon = _useBox2[0],
-    _useBox2$ = _useBox2[1],
-    className = _useBox2$.className,
-    other = _objectWithoutProperties(_useBox2$, _excluded);
-  var styles = sstyled(props.styles);
-  return /*#__PURE__*/React.createElement(SDropdownMenuItemAddon, _extends({
-    className: cn(styles.cn('SDropdownMenuItemAddon', props).className, className) || undefined
-  }, other));
-}
-function Hint(props) {
-  var _ref8 = arguments[0],
-    _ref16;
-  var SDropdownMenuItem = Flex;
-  return _ref16 = sstyled(props.styles), /*#__PURE__*/React.createElement(SDropdownMenuItem, _ref16.cn("SDropdownMenuItem", _objectSpread({}, _assignProps8({
-    "variant": 'hint'
-  }, _ref8))));
-}
-function Title(props) {
-  var _ref9 = arguments[0],
-    _ref17;
-  var SDropdownMenuItem = Flex;
-  return _ref17 = sstyled(props.styles), /*#__PURE__*/React.createElement(SDropdownMenuItem, _ref17.cn("SDropdownMenuItem", _objectSpread({}, _assignProps9({
-    "variant": 'title'
-  }, _ref9))));
-}
-function Trigger(_ref21) {
-  var _ref10 = arguments[0];
-  var keyboardFocused = _ref21.keyboardFocused,
-    onKeyboardFocusedStateChange = _ref21.onKeyboardFocusedStateChange;
-  React.useEffect(function () {
-    onKeyboardFocusedStateChange(keyboardFocused);
-  }, [keyboardFocused, onKeyboardFocusedStateChange]);
-  return /*#__PURE__*/React.createElement(Dropdown.Trigger, _assignProps10({
-    "aria-haspopup": 'true'
-  }, _ref10));
-}
-Trigger.enhance = [keyboardFocusEnhance(false)];
-var DropdownMenu = createComponent(DropdownMenuRoot, {
-  Trigger: Trigger,
-  Popper: Dropdown.Popper,
-  List: List,
-  Menu: Menu,
-  Item: [Item, {
-    Addon: Addon
-  }],
-  Nesting: [Nesting, {
-    Trigger: NestingTrigger,
-    Addon: Addon,
-    Item: NestingItem
-  }],
-  ItemTitle: Title,
-  ItemHint: Hint
-}, {
-  parent: [Dropdown]
-});
-export default DropdownMenu;
-//# sourceMappingURL=DropdownMenuOld.js.map