'use strict';

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var Tippy = require('@tippyjs/react');
var classnames = require('classnames');
var Down = require('@bigbinary/neeto-icons/Down');
var ramda = require('ramda');
var Button = require('./Button.js');
var useId = require('./useId-DXHUzdxd.js');
var reactRouterDom = require('react-router-dom');
require('@bigbinary/neeto-hotkeys');
require('./overlayManager.js');
var index = require('./index-CNZKW5X0.js');
require('qs');
var jsxRuntime = require('react/jsx-runtime');
var neetoCist = require('@bigbinary/neeto-cist');
var Tooltip = require('./Tooltip.js');
require('./Spinner.js');
require('tippy.js');
require('@babel/runtime/helpers/classCallCheck');
require('@babel/runtime/helpers/createClass');
require('./index-BgzkP01c.js');
require('@babel/runtime/helpers/toConsumableArray');
require('dayjs');
require('dayjs/plugin/localeData');
require('dayjs/plugin/utc');
require('dayjs/plugin/weekday');
require('dayjs/plugin/weekOfYear');
require('i18next');
require('./usePrefersReducedMotion-D2Ck84HM.js');
require('./en-B1i-pQJm.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
var Tippy__default = /*#__PURE__*/_interopDefault(Tippy);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);
var Down__default = /*#__PURE__*/_interopDefault(Down);

function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Divider = function Divider(props) {
  return /*#__PURE__*/jsxRuntime.jsx("li", _objectSpread$4({
    "aria-orientation": "horizontal",
    className: "neeto-ui-dropdown__popup-divider",
    role: "separator"
  }, props));
};

var _excluded$3 = ["children", "className"];
function ownKeys$3(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$3(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$3(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$3(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var itemClassName = "neeto-ui-dropdown__popup-menu-item-btn";
var Menu = function Menu(_ref) {
  var children = _ref.children,
    className = _ref.className,
    otherProps = _objectWithoutProperties__default.default(_ref, _excluded$3);
  var activeIndexRef = React.useRef(-1);
  var menuRef = React.useRef(null);
  var onKeyDown = function onKeyDown(event) {
    var _event$key;
    var menu = menuRef.current;
    var key = (_event$key = event.key) === null || _event$key === void 0 ? void 0 : _event$key.toLowerCase();
    var activeIndex = activeIndexRef.current;
    var eventHandled = false;
    var items = menu.getElementsByClassName(itemClassName);
    var itemsCount = items.length;
    if (itemsCount === 0) return;
    if (key === "arrowdown") {
      activeIndex = activeIndex >= itemsCount - 1 ? 0 : activeIndex + 1;
      items[activeIndex].focus();
      eventHandled = true;
    } else if (key === "arrowup") {
      activeIndex = activeIndex <= 0 ? itemsCount - 1 : activeIndex - 1;
      items[activeIndex].focus();
      eventHandled = true;
    } else if (key === "enter" && activeIndex >= 0) {
      var _items$activeIndex;
      (_items$activeIndex = items[activeIndex]) === null || _items$activeIndex === void 0 ? void 0 : _items$activeIndex.click();
      eventHandled = true;
    }
    if (!eventHandled) return;
    activeIndexRef.current = activeIndex;
    event.preventDefault();
    event.stopPropagation();
  };
  React.useEffect(function () {
    var menu = menuRef.current;
    if (menu) menu.focus();
  }, [menuRef]);
  return /*#__PURE__*/jsxRuntime.jsx("ul", _objectSpread$3(_objectSpread$3({
    onKeyDown: onKeyDown,
    className: classnames__default.default("neeto-ui-dropdown__popup-menu", className),
    ref: menuRef,
    tabIndex: 0
  }, otherProps), {}, {
    children: children
  }));
};

var _excluded$2 = ["children", "className", "tooltipProps"];
function ownKeys$2(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$2(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$2(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$2(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var MenuItem = function MenuItem(_ref) {
  var children = _ref.children,
    className = _ref.className,
    tooltipProps = _ref.tooltipProps,
    otherProps = _objectWithoutProperties__default.default(_ref, _excluded$2);
  var renderMenuItem = function renderMenuItem() {
    return /*#__PURE__*/jsxRuntime.jsx("li", _objectSpread$2(_objectSpread$2({
      className: classnames__default.default("neeto-ui-dropdown__popup-menu-item", className),
      role: "menuitem"
    }, otherProps), {}, {
      children: children
    }));
  };
  if (neetoCist.isPresent(tooltipProps)) {
    return /*#__PURE__*/jsxRuntime.jsx(Tooltip, _objectSpread$2(_objectSpread$2({}, tooltipProps), {}, {
      children: renderMenuItem()
    }));
  }
  return renderMenuItem();
};

var _excluded$1 = ["children", "className", "isActive", "isDisabled", "style", "prefix", "suffix", "type", "to", "href", "tooltipProps"];
function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var ITEM_BTN_STYLES = {
  "default": "default",
  danger: "danger"
};
var BUTTON_TYPES = {
  button: "button"};
var MenuItemButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
  var children = _ref.children,
    className = _ref.className,
    isActive = _ref.isActive,
    isDisabled = _ref.isDisabled,
    _ref$style = _ref.style,
    style = _ref$style === void 0 ? ITEM_BTN_STYLES["default"] : _ref$style,
    prefix = _ref.prefix,
    suffix = _ref.suffix,
    _ref$type = _ref.type,
    type = _ref$type === void 0 ? BUTTON_TYPES.button : _ref$type,
    _ref$to = _ref.to,
    to = _ref$to === void 0 ? "" : _ref$to,
    _ref$href = _ref.href,
    href = _ref$href === void 0 ? "" : _ref$href,
    tooltipProps = _ref.tooltipProps,
    otherProps = _objectWithoutProperties__default.default(_ref, _excluded$1);
  var Parent, elementSpecificProps;
  if (to) {
    Parent = reactRouterDom.Link;
    elementSpecificProps = {
      to: to
    };
  } else if (href) {
    Parent = "a";
    elementSpecificProps = {
      href: href
    };
  } else {
    Parent = "button";
    elementSpecificProps = {
      type: type
    };
  }
  return /*#__PURE__*/jsxRuntime.jsx(MenuItem, {
    tooltipProps: tooltipProps,
    children: /*#__PURE__*/jsxRuntime.jsxs(Parent, _objectSpread$1(_objectSpread$1({
      disabled: isDisabled,
      className: classnames__default.default("neeto-ui-dropdown__popup-menu-item-btn", className, {
        "neeto-ui-dropdown__popup-menu-item-btn--active": isActive,
        "neeto-ui-dropdown__popup-menu-item-btn--disabled": isDisabled,
        "neeto-ui-dropdown__popup-menu-item-btn--style-danger": style === ITEM_BTN_STYLES.danger
      })
    }, _objectSpread$1(_objectSpread$1({
      ref: ref
    }, otherProps), elementSpecificProps)), {}, {
      children: [prefix && /*#__PURE__*/jsxRuntime.jsx("div", {
        className: "neeto-ui-dropdown__popup-menu-item-btn__prefix",
        children: prefix
      }), children, suffix && /*#__PURE__*/jsxRuntime.jsx("div", {
        className: "neeto-ui-dropdown__popup-menu-item-btn__suffix",
        children: suffix
      })]
    }))
  });
});
MenuItemButton.displayName = "MenuItemButton";

MenuItem.Button = MenuItemButton;

var getDropdownPlacement = function getDropdownPlacement(placement) {
  if (typeof placement !== "string") return placement;
  if (index.getContentDir() !== "rtl") return placement;
  if (placement.endsWith("-start")) return placement.replace(/-start$/, "-end");
  if (placement.endsWith("-end")) return placement.replace(/-end$/, "-start");
  return placement;
};

var _excluded = ["style", "size"],
  _excluded2 = ["icon", "label", "isOpen", "onClose", "dropdownProps", "position", "placement", "children", "className", "buttonStyle", "buttonSize", "buttonProps", "customTarget", "disabled", "closeOnEsc", "closeOnSelect", "closeOnOutsideClick", "dropdownModifiers", "trigger", "strategy", "onClick"],
  _excluded3 = ["classNames", "className"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var BTN_STYLES = {
  primary: "primary"};
var BTN_SIZES = {
  medium: "medium"};
var STRATEGY = {
  absolute: "absolute"};
var PLACEMENT = {
  bottomEnd: "bottom-end"};
var TRIGGERS = {
  click: "click",
  hover: "mouseenter focus",
  all: "mouseenter focus click",
  manual: "manual"
};
var hideOnEsc = {
  name: "hideOnEsc",
  defaultValue: true,
  fn: function fn(_ref) {
    var hide = _ref.hide,
      hideOnEsc = _ref.props.hideOnEsc;
    function onKeyDown(event) {
      var _event$key;
      if (((_event$key = event.key) === null || _event$key === void 0 ? void 0 : _event$key.toLowerCase()) === "escape" && hideOnEsc) hide();
    }
    return {
      onShow: function onShow() {
        document.addEventListener("keydown", onKeyDown);
      },
      onHide: function onHide() {
        document.removeEventListener("keydown", onKeyDown);
      }
    };
  }
};
var plugins = [hideOnEsc];
var Dropdown = function Dropdown(_ref2) {
  var icon = _ref2.icon,
    label = _ref2.label,
    isOpen = _ref2.isOpen,
    _ref2$onClose = _ref2.onClose,
    onClose = _ref2$onClose === void 0 ? index.noop : _ref2$onClose,
    _ref2$dropdownProps = _ref2.dropdownProps,
    dropdownProps = _ref2$dropdownProps === void 0 ? {} : _ref2$dropdownProps,
    _ref2$position = _ref2.position,
    position = _ref2$position === void 0 ? PLACEMENT.bottomEnd : _ref2$position,
    _ref2$placement = _ref2.placement,
    placement = _ref2$placement === void 0 ? position : _ref2$placement,
    children = _ref2.children,
    className = _ref2.className,
    _ref2$buttonStyle = _ref2.buttonStyle,
    buttonStyle = _ref2$buttonStyle === void 0 ? BTN_STYLES.primary : _ref2$buttonStyle,
    _ref2$buttonSize = _ref2.buttonSize,
    buttonSize = _ref2$buttonSize === void 0 ? BTN_SIZES.medium : _ref2$buttonSize,
    _ref2$buttonProps = _ref2.buttonProps,
    _ref2$buttonProps2 = _ref2$buttonProps === void 0 ? {} : _ref2$buttonProps,
    style = _ref2$buttonProps2.style,
    size = _ref2$buttonProps2.size,
    buttonProps = _objectWithoutProperties__default.default(_ref2$buttonProps2, _excluded),
    customTarget = _ref2.customTarget,
    _ref2$disabled = _ref2.disabled,
    disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
    _ref2$closeOnEsc = _ref2.closeOnEsc,
    closeOnEsc = _ref2$closeOnEsc === void 0 ? true : _ref2$closeOnEsc,
    _ref2$closeOnSelect = _ref2.closeOnSelect,
    closeOnSelect = _ref2$closeOnSelect === void 0 ? true : _ref2$closeOnSelect,
    _ref2$closeOnOutsideC = _ref2.closeOnOutsideClick,
    closeOnOutsideClick = _ref2$closeOnOutsideC === void 0 ? true : _ref2$closeOnOutsideC,
    _ref2$dropdownModifie = _ref2.dropdownModifiers,
    dropdownModifiers = _ref2$dropdownModifie === void 0 ? [] : _ref2$dropdownModifie,
    _ref2$trigger = _ref2.trigger,
    trigger = _ref2$trigger === void 0 ? TRIGGERS.click : _ref2$trigger,
    _ref2$strategy = _ref2.strategy,
    strategy = _ref2$strategy === void 0 ? STRATEGY.absolute : _ref2$strategy,
    onClick = _ref2.onClick,
    otherProps = _objectWithoutProperties__default.default(_ref2, _excluded2);
  var _useState = React.useState(null),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    instance = _useState2[0],
    setInstance = _useState2[1];
  var _useState3 = React.useState(false),
    _useState4 = _slicedToArray__default.default(_useState3, 2),
    mounted = _useState4[0],
    setMounted = _useState4[1];
  var _useState5 = React.useState(false),
    _useState6 = _slicedToArray__default.default(_useState5, 2),
    isExpanded = _useState6[0],
    setIsExpanded = _useState6[1];
  var menuId = useId.useId();
  var isControlled = !ramda.isNil(isOpen);
  var controlledProps = isControlled ? {
    visible: isOpen
  } : {
    onClickOutside: function onClickOutside() {
      return closeOnOutsideClick;
    }
  };
  var dropdownClassnames = dropdownProps.classNames,
    dropdownClassName = dropdownProps.className,
    otherDropdownProps = _objectWithoutProperties__default.default(dropdownProps, _excluded3);
  var close = function close() {
    return instance.hide();
  };
  return /*#__PURE__*/jsxRuntime.jsx(Tippy__default.default, _objectSpread(_objectSpread({
    interactive: true,
    animation: false,
    aria: {
      content: null,
      expanded: false
    },
    arrow: false,
    duration: 0
    // hideOnClick determines whether the dropdown should be hidden when the user clicks outside of the dropdown.
    // https://atomiks.github.io/tippyjs/v6/all-props/#hideonclick
    ,
    hideOnClick: isControlled ? undefined : closeOnOutsideClick || "toggle",
    hideOnEsc: closeOnEsc,
    maxWidth: "none",
    offset: 0,
    placement: getDropdownPlacement(placement),
    popperOptions: {
      strategy: strategy,
      modifiers: dropdownModifiers
    },
    theme: "light",
    trigger: isControlled ? undefined : TRIGGERS[trigger],
    className: classnames__default.default("neeto-ui-dropdown", _defineProperty__default.default({}, className, className)),
    content: mounted ? /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
      "data-testid": "".concat(index.hyphenize(label), "-dropdown-container"),
      id: menuId,
      role: "menu",
      className: classnames__default.default("neeto-ui-dropdown__popup", _defineProperty__default.default(_defineProperty__default.default({}, dropdownClassName, dropdownClassName), dropdownClassnames, dropdownClassnames)),
      onClick: closeOnSelect ? close : index.noop
    }, otherDropdownProps), {}, {
      children: children
    })) : null,
    onCreate: function onCreate(instance) {
      return instance && setInstance(instance);
    },
    onMount: function onMount() {
      return setMounted(true);
    },
    onShow: function onShow() {
      return setIsExpanded(true);
    },
    onHidden: function onHidden() {
      onClose();
      setMounted(false);
      setIsExpanded(false);
    }
  }, _objectSpread(_objectSpread({
    disabled: disabled,
    plugins: plugins
  }, otherProps), controlledProps)), {}, {
    children: customTarget ? /*#__PURE__*/jsxRuntime.jsx("span", {
      onClick: onClick,
      className: classnames__default.default({
        "neeto-ui-cursor-not-allowed": disabled
      }),
      children: typeof customTarget === "function" ? customTarget() : customTarget
    }) : /*#__PURE__*/jsxRuntime.jsx(Button, _objectSpread({
      label: label,
      onClick: onClick,
      "aria-controls": menuId,
      "aria-expanded": isControlled ? isOpen : isExpanded,
      "aria-haspopup": "true",
      "data-testid": "".concat(index.hyphenize(label), "-dropdown-icon"),
      disabled: disabled || (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.disabled),
      icon: icon || Down__default.default,
      iconPosition: "right",
      size: size !== null && size !== void 0 ? size : buttonSize,
      style: style !== null && style !== void 0 ? style : buttonStyle
    }, buttonProps))
  }));
};
Dropdown.Menu = Menu;
Dropdown.MenuItem = MenuItem;
Dropdown.Divider = Divider;

module.exports = Dropdown;
//# sourceMappingURL=Dropdown.js.map
