function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
var _excluded = ["circular", "onDragEnd", "onScrollBottom", "onSelect", "role", "onChangeActiveDescendant", "onKeyboardNavigation", "id", "multiple"],
  _excluded2 = ["clickable", "item", "id", "children"],
  _excluded3 = ["hasCheckbox", "children", "selected", "provided"],
  _excluded4 = ["as", "children", "item", "onClick", "selected", "suggested", "disabled", "id", "role", "restoreFocus"],
  _excluded5 = ["selected", "disabled", "error", "indeterminate", "children", "role"],
  _excluded6 = ["className", "i18nScope", "placeholder", "onChange"],
  _excluded7 = ["padding"];
function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { Grip } from '@procore/core-icons/dist';
import { useLabel } from '@react-aria/label';
import { useId } from '@react-aria/utils';
import React, { isValidElement, useEffect, useMemo, useState } from 'react';
import { DragDropContext, Draggable, Droppable as DndDroppable, useMouseSensor, useTouchSensor } from 'react-beautiful-dnd';
import { Checkbox, FakeCheckbox } from '../Checkbox/Checkbox';
import { Typeahead } from '../Typeahead/Typeahead';
import { useI18nContext } from '../_hooks/I18n';
import { useZIndexContext } from '../_hooks/ZIndex';
import { colors } from '../_styles/colors';
import { addSubcomponents } from '../_utils/addSubcomponents';
import { mergeRefs } from '../_utils/mergeRefs';
import { StyledDroppable, StyledFooter, StyledGrip, StyledGroup, StyledHeader, StyledItem, StyledMenu, StyledOptions, StyledSearch, StyledWrapper } from './MenuImperative.styles';
import { createSensors } from './sensors';
var onScrollBottomThreshold = 8;
var NO_ANNOUCEMENT = '';
function noop() {}
function isScrolledToBottom(e) {
  return e.currentTarget instanceof HTMLElement && e.currentTarget.scrollTop >= e.currentTarget.scrollHeight - e.currentTarget.clientHeight - onScrollBottomThreshold;
}

// TODO use the shared mergeRefs utility
export function useMergeRef(externalRef) {
  var ref = React.useRef();
  return [ref, React.useCallback(function (node) {
    ref.current = node;
    if (externalRef) {
      if (typeof externalRef === 'function') {
        externalRef(node);
      } else {
        externalRef.current = node;
      }
    }
  }, [externalRef])];
}
var MenuContext = /*#__PURE__*/React.createContext({
  a11yOptionsProps: {},
  currentlyDroppableIn: [],
  onHoverItem: noop,
  onScrollBottom: noop,
  onSelect: noop,
  role: 'none'
});
export function useMenuContext() {
  var context = React.useContext(MenuContext);
  if (context === null) {
    throw new Error('Cannot find `Menu` context, please wrap your component in `<MenuContext.Provider>`');
  }
  return context;
}
/**
 * Usefully if navigation is controlled by search input or another input.
 *
 * @param ref MenuImperative ref
 * @param enable True by default. Setting to false will change all props
 * to undefined (except id in menuProps), so navigation controlled by menu itself is restored.
 * @param options.menuId provide id otherwise it will be generated
 * @since 11.5.0
 */
export var useMenuImperativeControlNavigation = function useMenuImperativeControlNavigation(ref) {
  var enable = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
  var _id = options.menuId;
  var id = useId(_id);
  var _React$useState = React.useState(),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    activeDescendant = _React$useState2[0],
    setActiveDescendant = _React$useState2[1];
  var _useState = useState(),
    _useState2 = _slicedToArray(_useState, 2),
    onKeyDown = _useState2[0],
    setOnKeyDown = _useState2[1];
  // ref is null on first render
  React.useEffect(function () {
    setOnKeyDown(function () {
      var _ref$current;
      return (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.defaultKeyDownNavigationHandler;
    });
  }, []);
  if (enable) {
    var menuNavigationTriggerProps = {
      'aria-activedescendant': activeDescendant,
      'aria-controls': id,
      onKeyDown: onKeyDown
    };
    var menuProps = {
      onChangeActiveDescendant: setActiveDescendant,
      id: id
    };
    return {
      menuNavigationTriggerProps: menuNavigationTriggerProps,
      menuProps: menuProps
    };
  } else {
    return {
      menuNavigationTriggerProps: {},
      menuProps: {
        id: id
      }
    };
  }
};
function changeAriaActiveDescendantOnOptions() {
  var id = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
  var menuRef = arguments.length > 1 ? arguments[1] : undefined;
  var options = menuRef === null || menuRef === void 0 ? void 0 : menuRef.querySelector('[data-internal="menuimperative-options"]');
  options === null || options === void 0 ? void 0 : options.setAttribute('aria-activedescendant', id);
}

/**

   @since 10.19.0

   @see [Storybook](https://procore.github.io/core/core-react/latest/?path=/story/demos-menu-imperative--demo)

 */
var MenuImperative_ = /*#__PURE__*/React.forwardRef(function Menu(_ref, forwardRef) {
  var _ref$circular = _ref.circular,
    circular = _ref$circular === void 0 ? false : _ref$circular,
    _ref$onDragEnd = _ref.onDragEnd,
    onDragEnd_ = _ref$onDragEnd === void 0 ? noop : _ref$onDragEnd,
    _ref$onScrollBottom = _ref.onScrollBottom,
    onScrollBottom_ = _ref$onScrollBottom === void 0 ? noop : _ref$onScrollBottom,
    _ref$onSelect = _ref.onSelect,
    onSelect_ = _ref$onSelect === void 0 ? noop : _ref$onSelect,
    _ref$role = _ref.role,
    role = _ref$role === void 0 ? 'none' : _ref$role,
    onChangeActiveDescendant = _ref.onChangeActiveDescendant,
    onKeyboardNavigation_ = _ref.onKeyboardNavigation,
    id = _ref.id,
    multiple = _ref.multiple,
    props = _objectWithoutProperties(_ref, _excluded);
  var ref = React.useRef(null);
  var _useState3 = useState([]),
    _useState4 = _slicedToArray(_useState3, 2),
    currentlyDroppableIn = _useState4[0],
    setCurrentlyDroppableIn = _useState4[1];

  // for context, used by Menu.Item
  var onSelect = React.useCallback(function (selection) {
    onSelect_(selection);
  }, [onSelect_]);
  var onChangeHighlight = onChangeActiveDescendant ? onChangeActiveDescendant : changeAriaActiveDescendantOnOptions;
  var _useMemo = useMemo(function () {
      return createSensors(ref, circular, onChangeHighlight);
    }, [circular, onChangeHighlight]),
    handleItemHover = _useMemo.handleItemHover,
    defaultKeyDownNavigationHandler = _useMemo.handleKeyDown,
    highlight = _useMemo.highlight,
    highlighted = _useMemo.highlighted,
    highlightFirst = _useMemo.highlightFirst,
    highlightLast = _useMemo.highlightLast,
    highlightSelected = _useMemo.highlightSelected,
    highlightSuggested = _useMemo.highlightSuggested,
    rehighlightCurrent = _useMemo.rehighlightCurrent,
    prev = _useMemo.prev,
    next = _useMemo.next,
    select = _useMemo.select,
    updateSelectCallback = _useMemo.updateSelectCallback,
    useKeyboardSensor = _useMemo.useKeyboardSensor;
  var commonA11yOptionProps = _defineProperty({
    role: role,
    id: id
  }, 'aria-multiselectable', multiple);
  var a11yOptionsProps = !onChangeActiveDescendant ? _objectSpread(_objectSpread({}, commonA11yOptionProps), {}, {
    onKeyDown: onKeyboardNavigation_ !== null && onKeyboardNavigation_ !== void 0 ? onKeyboardNavigation_ : defaultKeyDownNavigationHandler,
    tabIndex: 0
  }) : _objectSpread(_objectSpread({}, commonA11yOptionProps), {}, {
    onKeyDown: undefined,
    tabIndex: undefined
  });
  updateSelectCallback(onSelect);

  // exposes internal menu API
  React.useImperativeHandle(forwardRef, function () {
    return {
      el: ref.current,
      highlight: highlight,
      highlighted: highlighted,
      highlightFirst: highlightFirst,
      highlightLast: highlightLast,
      highlightSelected: highlightSelected,
      highlightSuggested: highlightSuggested,
      next: next,
      prev: prev,
      select: select,
      defaultKeyDownNavigationHandler: defaultKeyDownNavigationHandler
    };
  });
  useEffect(rehighlightCurrent);
  function onDragStart(start, provided) {
    // TODO Replace with localized instructions
    provided.announce(NO_ANNOUCEMENT);
    var itemInfo = JSON.parse(start.draggableId);
    setCurrentlyDroppableIn(itemInfo.droppableIn);
  }
  function onDragUpdate(_update, provided) {
    // TODO Replace with localized instructions
    provided.announce(NO_ANNOUCEMENT);
  }
  var onDragEnd = React.useCallback(function (result, provided) {
    // TODO Replace with localized instructions
    provided.announce(NO_ANNOUCEMENT);
    setCurrentlyDroppableIn([]);
    if (result.reason === 'DROP' && result.destination) {
      var itemInfo = JSON.parse(result.draggableId);
      onDragEnd_({
        draggableId: itemInfo.draggableId,
        source: result.source,
        destination: result.destination
      });
    }
  }, [onDragEnd_]);

  // for context, used by Menu.Options
  var onScrollBottom = React.useCallback(function (e) {
    if (isScrolledToBottom(e)) {
      onScrollBottom_(e);
    }
  }, [onScrollBottom_]);
  return /*#__PURE__*/React.createElement(MenuContext.Provider, {
    value: {
      a11yOptionsProps: a11yOptionsProps,
      currentlyDroppableIn: currentlyDroppableIn,
      onHoverItem: handleItemHover,
      onScrollBottom: onScrollBottom,
      onSelect: onSelect,
      role: role
    }
  }, /*#__PURE__*/React.createElement(StyledWrapper, {
    ref: ref
  }, /*#__PURE__*/React.createElement(DragDropContext, {
    onDragStart: onDragStart,
    onDragUpdate: onDragUpdate,
    onDragEnd: onDragEnd,
    enableDefaultSensors: false,
    sensors: [useMouseSensor, useTouchSensor, useKeyboardSensor]
  }, /*#__PURE__*/React.createElement(StyledMenu, props))));
});
export var Group = /*#__PURE__*/React.forwardRef(function Group(_ref2, ref) {
  var clickable = _ref2.clickable,
    _ref2$item = _ref2.item,
    item = _ref2$item === void 0 ? 'group' : _ref2$item,
    id = _ref2.id,
    children = _ref2.children,
    props = _objectWithoutProperties(_ref2, _excluded2);
  var _useLabel = useLabel({
      id: id,
      label: children,
      labelElementType: 'span'
    }),
    fieldProps = _useLabel.fieldProps,
    labelProps = _useLabel.labelProps;
  return /*#__PURE__*/React.createElement(StyledGroup, _extends({
    ref: ref,
    onClick: function onClick(e) {
      // TODO: implement selecting groups?
    },
    "data-group": true,
    "data-value": JSON.stringify(item),
    role: "separator"
  }, fieldProps, props), /*#__PURE__*/React.createElement("span", labelProps, children));
});
function findDraggableRecursively(children, draggableId) {
  var nodeChildren = React.Children.toArray(children);
  for (var i = 0; i < nodeChildren.length; i++) {
    var child = nodeChildren[i];
    if ( /*#__PURE__*/isValidElement(child)) {
      if ('draggableId' in child.props) {
        if (child.props.draggableId === draggableId) {
          return child;
        }
      } else {
        var matchingChild = findDraggableRecursively(child.props.children, draggableId);
        if (matchingChild) {
          return matchingChild;
        }
      }
    }
  }
  return null;
}
export function Droppable(_ref3) {
  var id = _ref3.id,
    children = _ref3.children;
  var ctx = useMenuContext();
  var cloneZIndex = useZIndexContext().value;
  function renderItemClone(provided, _snapshot, rubric) {
    var _draggingChild$props;
    var draggableInfo = JSON.parse(rubric.draggableId);
    var draggingChild = findDraggableRecursively(children, draggableInfo.draggableId);
    var cloneProps = (_draggingChild$props = draggingChild === null || draggingChild === void 0 ? void 0 : draggingChild.props) !== null && _draggingChild$props !== void 0 ? _draggingChild$props : {};
    return /*#__PURE__*/React.createElement(ClonedItem, _extends({
      hasCheckbox: (draggingChild === null || draggingChild === void 0 ? void 0 : draggingChild.type) === CheckboxItem,
      provided: provided,
      cloneZIndex: cloneZIndex
    }, cloneProps));
  }
  return /*#__PURE__*/React.createElement(DndDroppable, {
    droppableId: id,
    isDropDisabled: !ctx.currentlyDroppableIn.includes(id),
    renderClone: renderItemClone
  }, function (provided, snapshot) {
    return /*#__PURE__*/React.createElement(StyledDroppable, {
      ref: provided.innerRef,
      "data-droppable": true
    }, children, provided.placeholder);
  });
}

// creates a version of a draggable item that can be positioned correctly within modals
// this should always have the same appearance of an Item or CheckboxItem, but doesn't
// need to handle selection events, which can't be done while the item is being dragged
var ClonedItem = function ClonedItem(_ref4) {
  var _ref4$hasCheckbox = _ref4.hasCheckbox,
    hasCheckbox = _ref4$hasCheckbox === void 0 ? false : _ref4$hasCheckbox,
    _ref4$children = _ref4.children,
    children = _ref4$children === void 0 ? null : _ref4$children,
    _ref4$selected = _ref4.selected,
    selected = _ref4$selected === void 0 ? false : _ref4$selected,
    provided = _ref4.provided,
    props = _objectWithoutProperties(_ref4, _excluded3);
  var itemProps = _objectSpread(_objectSpread({}, props), {}, {
    $selected: selected
  });
  var itemChildren = hasCheckbox ? /*#__PURE__*/React.createElement(Checkbox, {
    indeterminate: props.indeterminate,
    error: props.error,
    checked: selected,
    onChange: noop
  }, children) : children;
  return /*#__PURE__*/React.createElement(StyledItem, _extends({
    ref: provided.innerRef
  }, provided.draggableProps, provided.dragHandleProps, itemProps, {
    $isDraggable: true,
    $isDragging: true,
    style: _objectSpread(_objectSpread(_objectSpread({}, provided.draggableProps.style), props.style), {}, {
      zIndex: props.cloneZIndex
    })
  }), /*#__PURE__*/React.createElement(StyledGrip, null, /*#__PURE__*/React.createElement(Grip, {
    color: colors.gray45
  })), itemChildren);
};
export var Item = /*#__PURE__*/React.forwardRef(function Item(_ref5,
/**
 * TODO: although it is typed just fine from the outside (`<Menu.Item ref>` that is),
 *  an effort is required to type it properly here too
 */
forwardRef) {
  var as = _ref5.as,
    _ref5$children = _ref5.children,
    children = _ref5$children === void 0 ? null : _ref5$children,
    _ref5$item = _ref5.item,
    item = _ref5$item === void 0 ? null : _ref5$item,
    _ref5$onClick = _ref5.onClick,
    onClick_ = _ref5$onClick === void 0 ? noop : _ref5$onClick,
    _ref5$selected = _ref5.selected,
    selected = _ref5$selected === void 0 ? false : _ref5$selected,
    _ref5$suggested = _ref5.suggested,
    suggested = _ref5$suggested === void 0 ? false : _ref5$suggested,
    _ref5$disabled = _ref5.disabled,
    disabled = _ref5$disabled === void 0 ? false : _ref5$disabled,
    _id = _ref5.id,
    role = _ref5.role,
    restoreFocus = _ref5.restoreFocus,
    props = _objectWithoutProperties(_ref5, _excluded4);
  var _useMergeRef = useMergeRef(forwardRef),
    _useMergeRef2 = _slicedToArray(_useMergeRef, 2),
    ref = _useMergeRef2[0],
    setRef = _useMergeRef2[1];
  var id = useId(_id);
  var ctx = useMenuContext();
  var onClick = React.useCallback(function (event) {
    if (disabled) return;
    onClick_(event);
    ctx.onSelect(_objectSpread({
      item: item,
      event: event,
      group: false,
      action: selected ? 'unselected' : 'selected'
    }, restoreFocus === undefined ? {} : {
      restoreFocus: restoreFocus
    }));
  }, [ctx, item, onClick_, disabled, selected]);
  var contextRole;
  var ariaSelected;
  if (ctx.role === 'listbox') {
    contextRole = 'option';
    ariaSelected = selected ? true : undefined;
  } else if (ctx.role === 'menu') {
    contextRole = 'menuitem';
  }
  var itemProps = _objectSpread(_objectSpread({
    'aria-disabled': disabled ? true : undefined,
    'aria-selected': ariaSelected
  }, props), {}, {
    id: id,
    role: role !== null && role !== void 0 ? role : contextRole,
    onClick: onClick,
    onMouseMove: function onMouseMove(e) {
      return ctx.onHoverItem(e.currentTarget);
    },
    'data-group': false,
    'data-value': JSON.stringify(item),
    'data-selected': selected,
    'data-suggested': suggested,
    'data-disabled': disabled,
    'data-restorefocus': restoreFocus,
    $disabled: disabled,
    $selected: selected
  });
  if ('droppableIn' in props && 'draggableId' in props && 'draggableIndex' in props) {
    // encoding id and valid droppables as the draggableId, so we can use them to determine where this item can be dropped
    var droppableInfo = {
      draggableId: props.draggableId,
      droppableIn: Array.isArray(props.droppableIn) ? props.droppableIn : [props.droppableIn]
    };
    return /*#__PURE__*/React.createElement(Draggable, {
      draggableId: JSON.stringify(droppableInfo),
      index: props.draggableIndex,
      isDragDisabled: disabled
    }, function (provided) {
      return /*#__PURE__*/React.createElement(StyledItem, _extends({
        ref: mergeRefs(provided.innerRef, setRef),
        as: as
      }, provided.draggableProps, provided.dragHandleProps, itemProps, {
        $isDraggable: !disabled,
        style: _objectSpread(_objectSpread({}, provided.draggableProps.style), itemProps.style),
        tabIndex: -1
      }), !disabled && /*#__PURE__*/React.createElement(StyledGrip, null, /*#__PURE__*/React.createElement(Grip, {
        color: colors.gray45
      })), children);
    });
  }
  return /*#__PURE__*/React.createElement(StyledItem, _extends({
    ref: setRef,
    as: as
  }, itemProps), children);
});
export var CheckboxItem = /*#__PURE__*/React.forwardRef(function CheckboxItem(_ref6, forwardRef) {
  var _ref6$selected = _ref6.selected,
    selected = _ref6$selected === void 0 ? false : _ref6$selected,
    _ref6$disabled = _ref6.disabled,
    disabled = _ref6$disabled === void 0 ? false : _ref6$disabled,
    _ref6$error = _ref6.error,
    error = _ref6$error === void 0 ? false : _ref6$error,
    _ref6$indeterminate = _ref6.indeterminate,
    indeterminate = _ref6$indeterminate === void 0 ? false : _ref6$indeterminate,
    _ref6$children = _ref6.children,
    children = _ref6$children === void 0 ? null : _ref6$children,
    role = _ref6.role,
    props = _objectWithoutProperties(_ref6, _excluded5);
  var ctx = useMenuContext();
  var contextRole;
  var ariaChecked;
  var ariaSelected;
  if (ctx.role === 'listbox') {
    contextRole = 'option';
    ariaSelected = selected ? true : undefined;
  } else if (ctx.role === 'menu') {
    contextRole = 'menuitemcheckbox';
    if (indeterminate) {
      ariaChecked = 'mixed';
    } else {
      ariaChecked = selected ? 'true' : 'false';
    }
  }
  return /*#__PURE__*/React.createElement(Item, _extends({
    "aria-checked": ariaChecked,
    "aria-disabled": disabled ? true : undefined,
    "aria-selected": ariaSelected
  }, props, {
    role: role !== null && role !== void 0 ? role : contextRole,
    selected: selected,
    disabled: disabled,
    ref: forwardRef
  }), /*#__PURE__*/React.createElement(FakeCheckbox, {
    indeterminate: indeterminate,
    error: error,
    disabled: disabled,
    checked: selected
  }, children));
});
export var Options = /*#__PURE__*/React.forwardRef(function Options(props, ref) {
  var ctx = useMenuContext();
  return /*#__PURE__*/React.createElement(StyledOptions, _extends({}, props, ctx.a11yOptionsProps, {
    "data-internal": "menuimperative-options",
    ref: ref,
    onScroll: ctx.onScrollBottom
  }));
});
export var Search = function Search(_ref7) {
  var className = _ref7.className,
    _ref7$i18nScope = _ref7.i18nScope,
    i18nScope = _ref7$i18nScope === void 0 ? 'core.menu' : _ref7$i18nScope,
    placeholder = _ref7.placeholder,
    _onChange = _ref7.onChange,
    props = _objectWithoutProperties(_ref7, _excluded6);
  var I18n = useI18nContext();
  var _React$useState3 = React.useState(''),
    _React$useState4 = _slicedToArray(_React$useState3, 2),
    value = _React$useState4[0],
    setValue = _React$useState4[1];
  var onChange = React.useCallback(function (value, event) {
    setValue(value);
    _onChange === null || _onChange === void 0 ? void 0 : _onChange(event);
  }, [_onChange]);

  // intentionally changed to type text + searchbox,
  // voiceOver focus goes to clear button when no results in Chrome
  return /*#__PURE__*/React.createElement(StyledSearch, {
    className: className
  }, /*#__PURE__*/React.createElement(Typeahead, _extends({}, props, {
    type: "text",
    role: "searchbox",
    autoFocus: true,
    placeholder: placeholder || I18n.t('search', {
      scope: i18nScope
    }),
    onChange: onChange,
    value: value
  })));
};
export var Header = /*#__PURE__*/React.forwardRef(function Header(_ref8, ref) {
  var props = _extends({}, (_objectDestructuringEmpty(_ref8), _ref8));
  return /*#__PURE__*/React.createElement(StyledHeader, _extends({
    ref: ref
  }, props));
});
export var Footer = /*#__PURE__*/React.forwardRef(function Footer(_ref9, ref) {
  var _ref9$padding = _ref9.padding,
    padding = _ref9$padding === void 0 ? 'md lg' : _ref9$padding,
    props = _objectWithoutProperties(_ref9, _excluded7);
  return /*#__PURE__*/React.createElement(StyledFooter, _extends({
    ref: ref,
    padding: padding
  }, props));
});
MenuImperative_.displayName = 'Menu';
Droppable.displayName = 'Menu.Droppable';
Footer.displayName = 'Menu.Footer';
Group.displayName = 'Menu.Group';
Header.displayName = 'Menu.Header';
Item.displayName = 'Menu.Item';
Options.displayName = 'Menu.Options';
Search.displayName = 'Menu.Search';
export var MenuImperative = addSubcomponents({
  CheckboxItem: CheckboxItem,
  Droppable: Droppable,
  Footer: Footer,
  Group: Group,
  Header: Header,
  Item: Item,
  Options: Options,
  Search: Search
}, MenuImperative_);
//# sourceMappingURL=MenuImperative.js.map