"use strict";

exports.__esModule = true;
exports.HeaderActionsPopover = HeaderActionsPopover;
var _react = _interopRequireWildcard(require("react"));
var _designSystem = require("@wix/design-system");
var _wixUiIconsCommon = require("@wix/wix-ui-icons-common");
var _react2 = require("@wix/bex-core/react");
var _useCloseOnAncestorScroll = require("../../hooks/useCloseOnAncestorScroll");
var _jsxFileName = "/home/builduser/work/843658b9f44192f0/packages/cairo/dist/cjs/components/FieldActions/HeaderActionsPopover.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function HeaderActionsPopover({
  actions,
  dataHook,
  className
}) {
  const {
    translate: t
  } = (0, _react2.useWixPatternsContainer)();
  const [menuOpen, setMenuOpen] = (0, _react.useState)(false);
  const [popoverKey, setPopoverKey] = (0, _react.useState)(0);
  const wrapperRef = (0, _react.useRef)(null);
  const closePopover = (0, _react.useCallback)(() => {
    setMenuOpen(false);
    setPopoverKey(k => k + 1);
  }, []);
  (0, _useCloseOnAncestorScroll.useCloseOnAncestorScroll)(wrapperRef, closePopover, menuOpen);
  const menuItems = actions.filter(group => group.length > 0).reduce((result, group, index, array) => {
    const items = group.map((action, i) => /*#__PURE__*/_react.default.createElement(_designSystem.PopoverMenu.MenuItem, {
      key: `${index}-${i}`,
      text: action.label,
      onClick: action.disabled || action.loading ? undefined : action.onClick,
      prefixIcon: action.loading ? /*#__PURE__*/_react.default.createElement("span", {
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 43,
          columnNumber: 15
        }
      }, /*#__PURE__*/_react.default.createElement(_designSystem.Loader, {
        size: "tiny",
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 44,
          columnNumber: 17
        }
      })) : action.icon,
      disabled: action.disabled || action.loading,
      disabledDescription: action.loading ? undefined : action.disabledTooltip,
      skin: action.skin,
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 35,
        columnNumber: 9
      }
    }));
    const divider = index < array.length - 1 ? [/*#__PURE__*/_react.default.createElement(_designSystem.PopoverMenu.Divider, {
      key: `divider-${index}`,
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 59,
        columnNumber: 14
      }
    })] : [];
    return [...result, ...items, ...divider];
  }, []);
  if (menuItems.length === 0) {
    return null;
  }
  return (
    /*#__PURE__*/
    // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
    _react.default.createElement("div", {
      ref: wrapperRef,
      className: className,
      "data-menu-open": menuOpen ? 'true' : 'false',
      "data-hook": dataHook,
      onClick: e => e.stopPropagation(),
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 70,
        columnNumber: 5
      }
    }, /*#__PURE__*/_react.default.createElement(_designSystem.Tooltip, {
      content: t('cairo.moreActions'),
      disabled: menuOpen,
      appendTo: "window",
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 77,
        columnNumber: 7
      }
    }, /*#__PURE__*/_react.default.createElement(_designSystem.PopoverMenu, {
      key: popoverKey,
      dataHook: dataHook ? `${dataHook}-menu` : undefined,
      textSize: "small",
      triggerElement: /*#__PURE__*/_react.default.createElement(_designSystem.IconButton, {
        size: "tiny",
        skin: "dark",
        priority: "tertiary",
        ariaLabel: t('cairo.moreActions'),
        dataHook: dataHook ? `${dataHook}-more-button` : undefined,
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 87,
          columnNumber: 13
        }
      }, /*#__PURE__*/_react.default.createElement(_wixUiIconsCommon.MoreSmall, {
        __self: this,
        __source: {
          fileName: _jsxFileName,
          lineNumber: 94,
          columnNumber: 15
        }
      })),
      appendTo: "window",
      placement: "bottom-end",
      onShow: () => setMenuOpen(true),
      onHide: () => setMenuOpen(false),
      __self: this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 82,
        columnNumber: 9
      }
    }, menuItems)))
  );
}
//# sourceMappingURL=HeaderActionsPopover.js.map