Function ContextMenu

packages/shell/src/components/context-menu.tsx:6–53

({ children, menus, pluginContext }: {
  menus: IPublicTypeContextMenuAction[];
  children: React.ReactElement[] | React.ReactElement;
  pluginContext: IPublicModelPluginContext;
})

import React, { useCallback } from 'react';

export function ContextMenu({ children, menus, pluginContext }: {
  menus: IPublicTypeContextMenuAction[];
  children: React.ReactElement[] | React.ReactElement;
  pluginContext: IPublicModelPluginContext;
}): React.ReactElement<any, string | React.JSXElementConstructor<any>> {
  const handleContextMenu = useCallback((event: React.MouseEvent) => {
    event.preventDefault();
    event.stopPropagation();

    let destroyFn: Function | undefined;
    const destroy = () => {
      destroyFn?.();
    };
    const children: React.ReactNode[] = parseContextMenuAsReactNode(parseContextMenuProperties(menus, {
      destroy,
      pluginContext,
    }), { pluginContext });

    if (!children?.length) {
      return;
    }

    destroyFn = createContextMenu(children, { event });
  }, [menus]);

  if (!engineConfig.get('enableContextMenu')) {
    return (
      <>{ children }</>
    );
  }

  if (!menus) {
    return (
      <>{ children }</>
    );
  }

  // 克隆 children 并添加 onContextMenu 事件处理器
  const childrenWithContextMenu = React.Children.map(children, (child) =>
    React.cloneElement(
      child,
      { onContextMenu: handleContextMenu },
    ));

  return (
    <>{childrenWithContextMenu}</>
  );
}

ContextMenu.create = (pluginContext: IPublicModelPluginContext, menus: IPublicTypeContextMenuAction[], event: MouseEvent) => {
  event.preventDefault();