"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _reactstrap = require("reactstrap");
var _constants = require("../../constants");
var _eventBus = _interopRequireDefault(require("../../../utils/event-bus"));
var _eventTypes = require("../../../constants/event-types");
require("./index.css");
const MoreMenu = _ref => {
  let {
    className = 'sf-menu-group-item',
    disabled,
    isRichEditor = true,
    children
  } = _ref;
  const popoverRef = (0, _react.useRef)(null);
  const imagePopoverRef = (0, _react.useRef)(false);
  const validClassName = (0, _classnames.default)(className, {
    'sf-rich-editor': isRichEditor,
    'sf-icon-btn': true,
    'sf-icon-btn-disabled': disabled,
    'sf-icon-btn-hover': !disabled
  });
  const config = _constants.MENUS_CONFIG_MAP[_constants.MORE_OPERATION];
  const toggle = (0, _react.useCallback)(() => {
    if (imagePopoverRef.current) return;
    popoverRef.current.toggle();
  }, []);
  const toggleImagePopover = (0, _react.useCallback)(isPopoverShow => {
    imagePopoverRef.current = isPopoverShow;
  }, []);
  (0, _react.useEffect)(() => {
    const eventBus = _eventBus.default.getInstance();
    const unsubscribe = eventBus.subscribe(_eventTypes.INTERNAL_EVENTS.ON_TOGGLE_IMAGE_POPOVER, toggleImagePopover);
    return () => unsubscribe();

    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("button", {
    className: validClassName,
    type: "button",
    id: config.id
  }, /*#__PURE__*/_react.default.createElement("i", {
    className: config.iconClass
  })), /*#__PURE__*/_react.default.createElement(_reactstrap.UncontrolledPopover, {
    target: config.id,
    className: "sf-editor-menu-popover sf-editor--more-menu-popover",
    trigger: "legacy",
    placement: "bottom-end",
    hideArrow: true,
    fade: false,
    toggle: toggle,
    ref: popoverRef
  }, children));
};
var _default = exports.default = MoreMenu;