es-grid-template/lib/grid-component/ContextMenu.js

es-grid-template

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.findItemByKey = exports.default = void 0;
var React = _interopRequireWildcard(require("react"));
var _antd = require("antd");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
// import type { MenuProps } from "antd";

const findItemByKey = (array, key, value) => {
  for (let i = 0; i < array.length; i++) {
    const item = array[i];
    if (item[key] === value) {
      return item;
    }
    if (item.children && item.children.length > 0) {
      const foundInChildren = findItemByKey(item.children, key, value);
      if (foundInChildren) {
        return foundInChildren;
      }
    }
  }
  return null;
};
exports.findItemByKey = findItemByKey;
const ContextMenu = props => {
  const {
    menuRef,
    open,
    setOpen,
    pos,
    contextMenuClick,
    contextMenuItems,
    rowData
  } = props;

  // const addPopupOffset = (items: MenuProps["items"]) : any => {
  //   return items?.map(item =>
  //     item && "children" in item
  //       ? {
  //     ...item,
  //         // popupOffset: [0, 30],
  //         children: addPopupOffset(item.children) }
  //       : item
  //   );
  // };

  // const newItems = React.useMemo(() => {
  //   return addPopupOffset(items)
  // }, [items])

  return (
    /*#__PURE__*/
    // <div>
    //   {open && (
    //     <div
    //       ref={menuRef}
    //       style={{
    //         position: "absolute",
    //         top: pos.y,
    //         left: pos.x,
    //         zIndex: 1000,
    //         background: "white",
    //         border: "1px solid #ddd",
    //         boxShadow: "2px 2px 5px rgba(0,0,0,0.2)",
    //       }}
    //       // onClick={() => setOpen(false)}
    //     >
    //       <Menu
    //         items={contextMenuItems}
    //         style={{ minWidth: 200, maxWidth: 400, maxHeight: pos.viewportHeight  - 20 , width: 200 }}
    //         rootClassName={'popup-context-menu'}
    //
    //         onClick={(e) => {
    //           contextMenuClick?.({
    //             rowInfo: {
    //               rowData
    //             },
    //             event: e.domEvent,
    //             item: {
    //               ...findItemByKey(contextMenuItems as any[], 'key', e.key ),
    //               id: e.key
    //             }
    //           })
    //         }} >
    //       </Menu>
    //     </div>
    //   )}
    // </div>
    React.createElement(_antd.Dropdown, {
      placement: 'topRight',
      open: open,
      overlayClassName: 'be-popup-container',
      overlayStyle: {
        left: `${pos.x}px`,
        top: `${pos.y}px`
      },
      dropdownRender: () => {
        return /*#__PURE__*/React.createElement("div", {
          ref: menuRef
        }, /*#__PURE__*/React.createElement(_antd.Menu, {
          items: contextMenuItems,
          style: {
            minWidth: 200,
            maxHeight: pos.viewportHeight - 20,
            width: 'fit-content'
          },
          rootClassName: 'popup-context-menu'
          // rootClassName={'be-popup-container'}
          ,

          onClick: e => {
            setOpen(false);
            contextMenuClick?.({
              rowInfo: {
                rowData
              },
              event: e.domEvent,
              item: {
                ...findItemByKey(contextMenuItems, 'key', e.key),
                id: e.key
              }
            });

            // if (!open) {
            //   document.addEventListener(`click`, function onClickOutside() {
            //     setOpen(false);
            //     document.removeEventListener(`click`, onClickOutside);
            //   });
            // }
          }
        }));
      }
    }, /*#__PURE__*/React.createElement(React.Fragment, null))
  );
};
var _default = exports.default = ContextMenu;