feat: update ActivateRelations asset

packages/gi-assets-basic/src/components/ActivateRelations/ActivateRelations.tsx

@@ -1,8 +1,6 @@
-import { registerBehavior, useBehaviorHook } from '@antv/graphin';
+import { Extensions, registerBehavior, useBehaviorHook } from '@antv/graphin';
 import * as React from 'react';
 
-import ActivateRelationsBehavior from './activate-relations-v2';
-
 interface Props {
   type: string;
   defaultConfig: Record<string, unknown>;
@@ -49,12 +47,12 @@ const defaultConfig = {
 
 export type ActivateRelationsProps = Partial<typeof defaultConfig>;
 //@ts-ignore
-registerBehavior('activate-relations-v2', ActivateRelationsBehavior);
+registerBehavior('activate-relations', Extensions.ActivateRelations);
 
 const ActivateRelations: React.FunctionComponent<ActivateRelationsProps> = props => {
   //@ts-ignore
   useBehaviorHook({
-    type: 'activate-relations-v2',
+    type: 'activate-relations',
     userProps: props,
     defaultConfig,
   });

packages/gi-assets-basic/src/components/Initializer/Component.tsx

@@ -183,7 +183,7 @@ const Initializer: React.FunctionComponent<IProps> = props => {
             return;
           }
           /** 默认是普通模式 */
-          const newData = transform(data, true);
+          const newData = transform(data);
           draft.rawData = { ...data };
           draft.data = newData;
           draft.source = newData;

packages/gi-assets-basic/src/components/index.tsx

@@ -1,4 +1,4 @@
-// import ActivateRelations from './ActivateRelations';
+import ActivateRelations from './ActivateRelations';
 import CanvasSetting from './CanvasSetting';
 import ClearCanvas from './ClearCanvas';
 import ContextMenu from './ContextMenu';
@@ -50,6 +50,7 @@ import ZoomStatus from './ZoomStatus';
 // import CreateCombo from './CreateCombo';
 import ShortcutKeys from './ShortcutKeys';
 export {
+  ActivateRelations,
   CanvasSetting,
   // ContentContainer,
   ChartAnalysis,

packages/gi-sdk/src/index.tsx

@@ -9,7 +9,7 @@ import {
 } from './components/const';
 import GIAComponent from './components/GIAC';
 export { Icon, icons } from '@antv/gi-common-components';
-export { Compatible } from '@antv/graphin';
+export { Compatible, registerBehavior } from '@antv/graphin';
 export { default as CollapseCard } from './components/CollapseCard';
 export type { IGIAC } from './components/const';
 export { default as EngineBanner } from './components/EngineBanner';
@@ -51,6 +51,7 @@ const common = {
 // export { default as Icon } from './components/Icon';
 
 /** export typing */
+
 export { changeLanguage, formatMessage, getCurrentLanguage, LANGUAGE_KEY_NAME } from './process/locale';
 export { COLORS } from './process/schema';
 export type { IEdgeSchema, IGraphData, INodeSchema } from './process/schema';
@@ -78,7 +79,6 @@ export type {
   ServiceObject,
 } from './typing';
 export { extra, template, useContext, utils, version };
-
 declare global {
   interface Window {
     GISDK: {

packages/graphin/src/Graphin.tsx

@@ -34,7 +34,7 @@ const Graphin: React.FunctionComponent<GraphinProps> = forwardRef((props, ref) =
     ...options
   } = props;
 
-  console.log('%c GRAPHIN RENDER....', 'color:rgba(48,86,227,0.8)');
+  console.log('%c GRAPHIN RENDER....', 'color:rgba(48,86,227,0.8)', ExtendGraph);
   const dataRef = useRef(data);
   const layoutRef = useRef(layout);
 

packages/graphin/src/behaviors/registerBehavior.ts

@@ -0,0 +1,15 @@
+import { extend, Graph } from '@antv/g6';
+
+/**
+ *
+ * @param type 交互名称
+ * @param instance 交互实例
+ */
+const registerBehavior = (name, instance) => {
+  extend(Graph, {
+    behaviors: {
+      [name]: instance,
+    },
+  });
+};
+export default registerBehavior;

packages/graphin/src/behaviors/useBehaviorHook.ts

@@ -0,0 +1,44 @@
+import { isEmpty } from 'lodash-es';
+import React from 'react';
+import { GraphinContext } from '../useGraphin';
+
+interface Props {
+  type: string;
+  defaultConfig: Record<string, unknown>;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  userProps: any;
+  mode?: string;
+}
+
+const useBehaviorHook = (params: Props) => {
+  const { type, defaultConfig, userProps, mode = 'default' } = params;
+  const { graph } = React.useContext(GraphinContext);
+  const { disabled, ...otherConfig } = userProps;
+
+  React.useEffect(() => {
+    if (!graph || graph.destroyed || isEmpty(graph)) {
+      return;
+    }
+    /** 保持单例 */
+    graph.removeBehaviors([type], mode);
+
+    if (disabled) {
+      return;
+    }
+    graph.addBehaviors(
+      {
+        type,
+        ...defaultConfig,
+        ...otherConfig,
+      },
+      mode,
+    );
+    return () => {
+      if (!graph.destroyed) {
+        graph.removeBehaviors(type, mode);
+      }
+    };
+  }, []);
+};
+
+export default useBehaviorHook;

packages/graphin/src/index.tsx

@@ -3,7 +3,7 @@ export { default as Compatible } from './compatible';
 export { default as Components } from './components';
 export * as Utils from './utils';
 export type GraphinData = any;
-export type Graph = any;
+
 export type EdgeStyle = any;
 export type IUserNode = any;
 export type Layout = any;
@@ -13,14 +13,15 @@ export type IG6GraphEvent = any;
 export type GraphData = any;
 export type NodeConfig = any;
 
+export { Extensions, Graph, extend } from '@antv/g6';
+
 export { GraphinContext, useGraphin } from './useGraphin';
 export type { GraphinContextType } from './useGraphin';
 
 export const registerNode = () => {};
 //@ts-ignore
 export const registerEdge = () => {};
-//@ts-ignore
-export const registerBehavior = () => {};
+
 //@ts-ignore
 export const registerFontFamily = iconLoader => {
   /**  注册 font icon */
@@ -58,5 +59,7 @@ export const Behaviors = {
   BrushSelect: (props: any) => null,
 };
 
-export const useBehaviorHook = () => {};
+export { default as registerBehavior } from './behaviors/registerBehavior';
+export { default as useBehaviorHook } from './behaviors/useBehaviorHook';
+
 export default Graphin;