feat(ContextMenu): The menu container can toggle display status based…

… on the page status

src/components/ContextMenu/index.js

@@ -3,6 +3,7 @@ import { pick } from '@utils';
 import Editor from '@antv/g6-editor';
 import { CONTEXT_MENU_CONTAINER } from '@common/constants';
 import BaseComponent from '@components/Base';
+import Menu from './menu';
 
 class ContextMenu extends BaseComponent {
   contextMenu = null;
@@ -34,4 +35,10 @@ class ContextMenu extends BaseComponent {
   }
 }
 
+export const NodeMenu = Menu.create('node');
+export const EdgeMenu = Menu.create('edge');
+export const GroupMenu = Menu.create('group');
+export const MultiMenu = Menu.create('multi');
+export const CanvasMenu = Menu.create('canvas');
+
 export default ContextMenu;

src/components/ContextMenu/menu.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import BaseComponent from '@components/Base';
+
+class Menu extends BaseComponent {
+  static create = function (type) {
+    return class TypedMenu extends Menu {
+      constructor(props) {
+        super(props, type);
+      }
+    };
+  }
+
+  constructor(props, type) {
+    super(props);
+
+    this.type = type;
+  }
+
+  render() {
+    const { children } = this.props;
+    const { type } = this;
+
+    return (
+      <div className="menu" data-status={`${type}-selected`}>
+        {children}
+      </div>
+    );
+  }
+}
+
+export default Menu;

src/index.js

@@ -10,7 +10,13 @@ import Register, {
 } from '@components/Register';
 import Command from '@components/Command';
 import Minimap from '@components/Minimap';
-import ContextMenu from '@components/ContextMenu';
+import ContextMenu, {
+  NodeMenu,
+  EdgeMenu,
+  GroupMenu,
+  MultiMenu,
+  CanvasMenu,
+} from '@components/ContextMenu';
 import Toolbar from '@components/Toolbar';
 import ItemPanel, { Item } from '@components/ItemPanel';
 import DetailPanel, {
@@ -35,6 +41,11 @@ export {
   Command,
   Minimap,
   ContextMenu,
+  NodeMenu,
+  EdgeMenu,
+  GroupMenu,
+  MultiMenu,
+  CanvasMenu,
   Toolbar,
   Item,
   ItemPanel,