"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 _constants = require("../../../constants");
var _elementTypes = require("../../../constants/element-types");
var _helper = require("../helper");
var _tableSizeSelector = _interopRequireDefault(require("./table-size-selector"));
var _dropdownMenuItem = _interopRequireDefault(require("../../../commons/dropdown-menu-item"));
require("./style.css");
const menuConfig = _constants.MENUS_CONFIG_MAP[_elementTypes.TABLE];
const TableMenu = _ref => {
  let {
    editor,
    readonly,
    toggle
  } = _ref;
  const [isOpenTableSizeSelector, setIsOpenTableSizeSelector] = (0, _react.useState)(false);
  // eslint-disable-next-line react-hooks/exhaustive-deps
  const disabled = (0, _react.useMemo)(() => (0, _helper.isDisabled)(editor, readonly), [editor.selection, readonly]);
  const tablePopoverRef = (0, _react.useRef)(null);
  const handleMouseEnter = () => setIsOpenTableSizeSelector(true);
  const handleMouseLeave = () => setIsOpenTableSizeSelector(false);
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "table-menu-container",
    onMouseEnter: handleMouseEnter,
    onMouseLeave: handleMouseLeave
  }, /*#__PURE__*/_react.default.createElement(_dropdownMenuItem.default, {
    disabled: disabled,
    menuConfig: menuConfig,
    className: "pr-2"
  }, !disabled && /*#__PURE__*/_react.default.createElement("i", {
    className: "mdfont md-arrow-right sf-dropdown-item-right-icon"
  })), !disabled && isOpenTableSizeSelector && /*#__PURE__*/_react.default.createElement(_tableSizeSelector.default, {
    ref: tablePopoverRef,
    editor: editor,
    onHideSelector: toggle
  }));
};
var _default = exports.default = TableMenu;