ronds-metadata 1.1.6 → 1.1.9

package/es/comps/DynamicPorts/comps/shape/node.js

@@ -0,0 +1,190 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import { Dom, Node } from '@antv/x6';
+import { ReactShape } from '@antv/x6-react-shape';
+import { NODE_WIDTH, NODE_HEIGHT } from '../../constant';
+export var BaseNode = /*#__PURE__*/function (_ReactShape) {
+  _inherits(BaseNode, _ReactShape);
+
+  var _super = _createSuper(BaseNode);
+
+  function BaseNode() {
+    _classCallCheck(this, BaseNode);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(BaseNode, [{
+    key: "isGroup",
+    value: // eslint-disable-next-line class-methods-use-this
+    function isGroup() {
+      return false;
+    }
+  }]);
+
+  return BaseNode;
+}(ReactShape);
+export var DPNode = /*#__PURE__*/function (_BaseNode) {
+  _inherits(DPNode, _BaseNode);
+
+  var _super2 = _createSuper(DPNode);
+
+  function DPNode() {
+    _classCallCheck(this, DPNode);
+
+    return _super2.apply(this, arguments);
+  }
+
+  _createClass(DPNode, [{
+    key: "getInPorts",
+    value: function getInPorts() {
+      return this.getPortsByGroup('in');
+    }
+  }, {
+    key: "getOutPorts",
+    value: function getOutPorts() {
+      return this.getPortsByGroup('out');
+    }
+  }]);
+
+  return DPNode;
+}(BaseNode);
+Node.registry.register('rz-rect-port', DPNode);
+DPNode.config({
+  width: NODE_WIDTH,
+  height: NODE_HEIGHT,
+  shape: 'rz-rect-port',
+  ports: {
+    groups: {
+      in: {
+        position: {
+          name: 'top'
+        },
+        zIndex: 2
+      },
+      out: {
+        position: {
+          name: 'bottom'
+        },
+        zIndex: 2
+      }
+    }
+  },
+  attrs: {
+    body: {
+      magnet: false,
+      fill: 'none',
+      stroke: 'none',
+      refWidth: '100%',
+      refHeight: '100%',
+      zIndex: 1
+    }
+  },
+  portMarkup: [{
+    tagName: 'foreignObject',
+    selector: 'fo',
+    attrs: {
+      width: 6,
+      height: 6,
+      x: -3,
+      y: -3,
+      zIndex: 10,
+      // magnet决定是否可交互
+      magnet: 'true'
+    },
+    children: [{
+      ns: Dom.ns.xhtml,
+      tagName: 'body',
+      selector: 'foBody',
+      attrs: {
+        xmlns: Dom.ns.xhtml
+      },
+      style: {
+        width: '100%',
+        height: '100%'
+      },
+      children: [{
+        tagName: 'span',
+        selector: 'content',
+        style: {
+          width: '100%',
+          height: '100%'
+        }
+      }]
+    }]
+  }]
+});
+export var DPGroupNode = /*#__PURE__*/function (_BaseNode2) {
+  _inherits(DPGroupNode, _BaseNode2);
+
+  var _super3 = _createSuper(DPGroupNode);
+
+  function DPGroupNode() {
+    _classCallCheck(this, DPGroupNode);
+
+    return _super3.apply(this, arguments);
+  }
+
+  _createClass(DPGroupNode, [{
+    key: "isGroup",
+    value: // eslint-disable-next-line class-methods-use-this
+    function isGroup() {
+      return true;
+    }
+  }]);
+
+  return DPGroupNode;
+}(BaseNode);
+DPGroupNode.config({
+  ports: {
+    groups: {
+      in: {
+        position: {
+          name: 'top'
+        },
+        zIndex: 2
+      },
+      out: {
+        position: {
+          name: 'bottom'
+        },
+        zIndex: 2
+      }
+    }
+  },
+  portMarkup: [{
+    tagName: 'foreignObject',
+    selector: 'fo',
+    attrs: {
+      width: 6,
+      height: 6,
+      x: -3,
+      y: -3,
+      zIndex: 10,
+      // magnet决定是否可交互
+      magnet: 'true'
+    },
+    children: [{
+      ns: Dom.ns.xhtml,
+      tagName: 'body',
+      selector: 'foBody',
+      attrs: {
+        xmlns: Dom.ns.xhtml
+      },
+      style: {
+        width: '100%',
+        height: '100%'
+      },
+      children: [{
+        tagName: 'span',
+        selector: 'content',
+        style: {
+          width: '100%',
+          height: '100%'
+        }
+      }]
+    }]
+  }]
+});

package/es/comps/DynamicPorts/constant/index.d.ts

@@ -0,0 +1,7 @@
+export declare const GROUP_HORIZONTAL__PADDING = 24;
+export declare const GROUP_VERTICAL__PADDING = 40;
+export declare const NODE_WIDTH = 180;
+export declare const NODE_HEIGHT = 32;
+export declare const RERENDER_EVENT = "RERENDER_EVENT";
+export declare const DRAGGABLE_COMPONENT = "DRAGGABLE_COMPONENT";
+export declare const DRAGGABLE_MODEL = "DRAGGABLE_MODEL";

package/es/comps/DynamicPorts/constant/index.js

@@ -0,0 +1,19 @@
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-24 08:48:57
+ * @LastEditTime: 2022-05-25 11:37:48
+ */
+export var GROUP_HORIZONTAL__PADDING = 24; // 分组横向 padding
+
+export var GROUP_VERTICAL__PADDING = 40; // 分组纵向 padding
+
+export var NODE_WIDTH = 180;
+export var NODE_HEIGHT = 32; // 触发画布重新渲染事件
+
+export var RERENDER_EVENT = 'RERENDER_EVENT';
+/*
+ * 以下是拖拽相关
+ */
+
+export var DRAGGABLE_COMPONENT = 'DRAGGABLE_COMPONENT';
+export var DRAGGABLE_MODEL = 'DRAGGABLE_MODEL';

package/es/comps/DynamicPorts/graph.d.ts

@@ -0,0 +1,62 @@
+import { BehaviorSubject } from 'rxjs/internal/BehaviorSubject';
+import { Subscription } from 'rxjs/internal/Subscription';
+import { ConnectionRemovedArgs, ContextMenuInfo, GraphCore } from '../../framework/graph';
+import { BaseEdge, DPEdge } from './comps/shape/edge';
+import { BaseNode, DPNode } from './comps/shape/node';
+import { NDPGraph } from './interface';
+import { formatGraphData } from './utils';
+declare type NodeMeta = ReturnType<typeof formatGraphData>['nodes'][number];
+declare type EdgeMeta = ReturnType<typeof formatGraphData>['edges'][number];
+interface IFactory$ {
+    /**
+     * 实验图加载状态
+     */
+    loading: BehaviorSubject<boolean>;
+    /**
+     * 图数据流
+     */
+    dpGraph: BehaviorSubject<NDPGraph.GraphData>;
+    /**
+     * 选中的节点
+     */
+    selectedNodes: BehaviorSubject<NDPGraph.Node[]>;
+    /**
+     * 右击菜单
+     */
+    contextMenuInfo: BehaviorSubject<ContextMenuInfo>;
+}
+declare class DPGraph extends GraphCore<BaseNode, BaseEdge> {
+    factory$: IFactory$;
+    dpGraphSub?: Subscription;
+    constructor(graphData?: NDPGraph.GraphData);
+    initialize(graphData: NDPGraph.GraphData): Promise<void>;
+    loadDPGraph(graphData: any): Promise<void>;
+    isGraphReady(): boolean;
+    renderGraph: (wrapper: HTMLElement, container: HTMLElement) => void;
+    renderNode(nodeMeta: NodeMeta): BaseNode | undefined;
+    renderEdge(edgeMeta: EdgeMeta): BaseEdge | undefined;
+    addDragNode(data: NDPGraph.Node): void;
+    updateDPGraph(nodes?: NDPGraph.Node[], edges?: NDPGraph.Edge[]): Promise<void>;
+    delDPGraphElement(nodes?: string[], edges?: NDPGraph.Edge[]): Promise<void>;
+    zoomGraph: (factor: number) => void;
+    zoomGraphToFit: () => void;
+    zoomGraphRealSize: () => void;
+    onConnectNode(args: any): Promise<{
+        success: boolean;
+    }>;
+    onSelectNodes(nodes: BaseNode[]): void;
+    onConnectionRemoved(args: ConnectionRemovedArgs): void;
+    onDeleteNodes: (ids: string[] | string) => void;
+    onDeleteEdges: (edges: BaseEdge | BaseEdge[]) => void;
+    onDeleteNodeOrEdge(args: {
+        nodes: DPNode[];
+        edges: DPEdge[];
+    }): void;
+    onContextMenu(data: ContextMenuInfo): any;
+    clearContextMenuInfo: () => void;
+    dispose(): void;
+}
+export declare let gDPGraph: DPGraph;
+export declare const useDPGraph: (graphData: NDPGraph.GraphData) => DPGraph;
+export declare const useUnmountDPGraph: () => void;
+export {};