@sunspirytus/xflow-extension 1.0.52

package/lib/canvas-dag-extension/style/index.less

@@ -0,0 +1,133 @@
+.dag-extension-container {
+  @keyframes xflow-processing-line {
+    to {
+      stroke-dashoffset: -1000;
+    }
+  }
+  .x6-edge {
+    // 系统状态
+    stroke-width: 1px;
+    &.success {
+      path:nth-child(2) {
+        stroke: #d5d5d5 !important;
+      }
+      path:nth-child(3) {
+        fill: #d5d5d5 !important;
+        stroke: #d5d5d5 !important;
+      }
+    }
+    &.error {
+      stroke-width: 2px;
+      path:nth-child(2) {
+        stroke: rgba(245, 34, 45, 0.45) !important;
+        stroke-width: 2px;
+      }
+    }
+    &.processing {
+      path:nth-child(2) {
+        animation: ~'xflow-processing-line 30s infinite linear';
+        stroke: rgba(57, 202, 116, 0.8);
+        stroke-width: 2px;
+        stroke-dasharray: 8px, 2px;
+      }
+    }
+    // 交互状态
+    &.x6-edge-selected {
+      path:nth-child(2) {
+        stroke: #1890ff;
+        stroke-width: 2px;
+      }
+    }
+    &:hover {
+      path:nth-child(2) {
+        stroke: #1890ff;
+        stroke-width: 2px;
+      }
+    }
+    &.hoverHighlight {
+      path:nth-child(2) {
+        stroke: #1890ff;
+        stroke-width: 2px;
+      }
+    }
+  }
+  // 连线状态
+  .x6-port {
+    .xflow-port-group {
+      // 默认状态
+      .xflow-port-arrow {
+        display: none;
+      }
+      // 可用状态
+      &.available {
+        .xflow-port {
+          stroke: rgba(57, 202, 116, 0.6);
+          r: 8;
+          stroke-width: 8px;
+        }
+      }
+      // 已连接箭头
+      &.connected {
+        .xflow-port-arrow {
+          display: block;
+        }
+        .xflow-port {
+          display: none;
+        }
+      }
+      // 吸附状态
+      &.adsorbed {
+        .xflow-port {
+          stroke: rgba(57, 202, 116, 0.85);
+          r: 10;
+          stroke-width: 10px;
+        }
+      }
+    }
+  }
+}
+
+.layout-top-bottom {
+  // 连线状态
+  .x6-port {
+    .xflow-port-group {
+      // 默认状态
+      .xflow-port-arrow {
+        display: none;
+      }
+
+      // 已连接箭头
+      &.connected {
+        .xflow-port-arrow {
+          display: block;
+        }
+        .xflow-port {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
+.layout-left-right {
+  // 连线状态
+  .x6-port {
+    .xflow-port-group {
+      // 默认状态
+      .xflow-port-arrow {
+        display: none;
+      }
+
+      // 已连接箭头
+      &.connected {
+        .xflow-port-arrow {
+          display: block;
+          transform: ~'translate(0, 5px) rotate(270deg) !important';
+        }
+        .xflow-port {
+          display: none;
+        }
+      }
+    }
+  }
+}

package/lib/canvas-dag-extension/x6-extension/edge.d.ts

@@ -0,0 +1,3 @@
+import { EDGE_PATH_TYPE } from '../constants';
+declare let XFlowEdge: import("@antv/x6").Edge.Definition;
+export { EDGE_PATH_TYPE, XFlowEdge };

package/lib/canvas-dag-extension/x6-extension/edge.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.XFlowEdge = exports.EDGE_PATH_TYPE = void 0;
+var x6_1 = require("@antv/x6");
+var constants_1 = require("../constants");
+Object.defineProperty(exports, "EDGE_PATH_TYPE", { enumerable: true, get: function () { return constants_1.EDGE_PATH_TYPE; } });
+if (!x6_1.Registry.Connector.registry.exist(constants_1.EDGE_PATH_TYPE.VERTICAL_NODE)) {
+    x6_1.Graph.registerConnector(constants_1.EDGE_PATH_TYPE.VERTICAL_NODE, function (s, e) {
+        var offset = 16;
+        var deltaY = Math.abs(e.y - s.y);
+        var control = Math.floor((deltaY / 3) * 2);
+        var v1 = { x: s.x, y: s.y + offset + control };
+        var v2 = { x: e.x, y: e.y - offset - control };
+        return x6_1.Path.normalize("M ".concat(s.x, " ").concat(s.y, "\n         L ").concat(s.x, " ").concat(s.y + offset, "\n         C ").concat(v1.x, " ").concat(v1.y, " ").concat(v2.x, " ").concat(v2.y, " ").concat(e.x, " ").concat(e.y - offset, "\n         L ").concat(e.x, " ").concat(e.y, "\n        "));
+    }, true);
+}
+if (!x6_1.Registry.Connector.registry.exist(constants_1.EDGE_PATH_TYPE.VERTICAL_GROUP)) {
+    x6_1.Graph.registerConnector(constants_1.EDGE_PATH_TYPE.VERTICAL_GROUP, function (s, t) {
+        var offset = 4;
+        var control = Math.abs(t.y - s.y);
+        var v1 = { x: s.x, y: s.y + offset + control };
+        var v2 = { x: t.x, y: t.y - offset - control };
+        return x6_1.Path.normalize("M ".concat(s.x, " ").concat(s.y, "\n       L ").concat(s.x, " ").concat(s.y + offset, "\n       C ").concat(v1.x, " ").concat(v1.y, " ").concat(v2.x, " ").concat(v2.y, " ").concat(t.x, " ").concat(t.y - offset, "\n       L ").concat(t.x, " ").concat(t.y, "\n      "));
+    }, true);
+}
+// TODO: fix this vertical function
+if (!x6_1.Registry.Connector.registry.exist(constants_1.EDGE_PATH_TYPE.HORIRONTAL_NODE)) {
+    x6_1.Graph.registerConnector(constants_1.EDGE_PATH_TYPE.HORIRONTAL_NODE, function (s, e) {
+        var offset = 4;
+        // const control = 80;
+        var deltaY = Math.abs(e.y - s.y);
+        var control = Math.floor((deltaY / 3) * 2);
+        var v1 = { x: s.x, y: s.y + offset + control };
+        var v2 = { x: e.x, y: e.y - offset - control };
+        return x6_1.Path.normalize("M ".concat(s.x, " ").concat(s.y, "\n         L ").concat(s.x, " ").concat(s.y + offset, "\n         C ").concat(v1.x, " ").concat(v1.y, " ").concat(v2.x, " ").concat(v2.y, " ").concat(e.x, " ").concat(e.y - offset, "\n         L ").concat(e.x, " ").concat(e.y, "\n        "));
+    }, true);
+}
+var XFlowEdge = x6_1.Shape.Edge.registry.get(constants_1.XFLOW_SHAPE.EDGE);
+exports.XFlowEdge = XFlowEdge;
+if (!x6_1.Shape.Edge.registry.exist(constants_1.XFLOW_SHAPE.EDGE)) {
+    exports.XFlowEdge = XFlowEdge = x6_1.Shape.Edge.registry.register(constants_1.XFLOW_SHAPE.EDGE, x6_1.Shape.Edge.define({
+        zIndex: 1,
+        highlight: false,
+        shape: constants_1.XFLOW_SHAPE.EDGE,
+        // https://x6.antv.vision/zh/docs/api/registry/node-anchor
+        // source: {
+        //   anchor: {
+        //     name: 'bottom',
+        //   },
+        // },
+        // target: {
+        //   anchor: {
+        //     name: 'center',
+        //   },
+        // },
+    }), true);
+}
+//# sourceMappingURL=edge.js.map

package/lib/canvas-dag-extension/x6-extension/edge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"edge.js","sourceRoot":"","sources":["../../../src/canvas-dag-extension/x6-extension/edge.ts"],"names":[],"mappings":"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"}

package/lib/canvas-dag-extension/x6-extension/node.d.ts

@@ -0,0 +1,5 @@
+import { Node } from '@antv/x6';
+import { NsGraph } from '@sunspirytus/xflow-core';
+declare let XFlowNode: Node.Definition;
+declare const AnchorGroup: typeof NsGraph.AnchorGroup;
+export { XFlowNode, AnchorGroup };

package/lib/canvas-dag-extension/x6-extension/node.js

@@ -0,0 +1,104 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AnchorGroup = exports.XFlowNode = void 0;
+/* eslint-disable @typescript-eslint/lines-between-class-members */
+var x6_react_shape_1 = require("@antv/x6-react-shape");
+var x6_1 = require("@antv/x6");
+var constants_1 = require("../constants");
+var xflow_core_1 = require("@sunspirytus/xflow-core");
+var XFlowNode;
+exports.XFlowNode = XFlowNode;
+var AnchorGroup = xflow_core_1.NsGraph.AnchorGroup;
+exports.AnchorGroup = AnchorGroup;
+if (x6_1.Node.registry.exist(constants_1.XFLOW_NODE_SHAPE)) {
+    exports.XFlowNode = XFlowNode = x6_1.Node.registry.get(constants_1.XFLOW_NODE_SHAPE);
+}
+else {
+    exports.XFlowNode = XFlowNode = x6_react_shape_1.ReactShape.define({
+        width: constants_1.NODE_DEFAULT_WIDTH,
+        height: constants_1.NODE_DEFAULT_HEIGHT,
+        shape: constants_1.XFLOW_NODE_SHAPE,
+        // X6_NODE_PORTAL_NODE_VIEW
+        view: xflow_core_1.XFlowConstants.X6_NODE_PORTAL_NODE_VIEW,
+        ports: {
+            groups: {
+                top: {
+                    zIndex: 2,
+                    position: {
+                        name: AnchorGroup.TOP,
+                    },
+                },
+                bottom: {
+                    zIndex: 2,
+                    position: {
+                        name: AnchorGroup.BOTTOM,
+                    },
+                },
+                right: {
+                    zIndex: 2,
+                    position: {
+                        name: AnchorGroup.RIGHT,
+                    },
+                },
+                left: {
+                    zIndex: 2,
+                    position: {
+                        name: AnchorGroup.LEFT,
+                    },
+                },
+            },
+        },
+        attrs: {
+            body: {
+                magnet: false,
+                fill: 'none',
+                stroke: 'none',
+                refWidth: '100%',
+                refHeight: '100%',
+                zIndex: 1,
+            },
+        },
+        portMarkup: [
+            {
+                tagName: 'g',
+                selector: 'xflow-port-group',
+                className: 'xflow-port-group',
+                attrs: {
+                    width: 8,
+                    height: 8,
+                    x: -4,
+                    y: -4,
+                    zIndex: 10,
+                    // magnet决定是否可交互
+                    magnet: 'true',
+                },
+                children: [
+                    {
+                        tagName: 'circle',
+                        selector: 'xflow-port',
+                        className: 'xflow-port',
+                        attrs: {
+                            r: 4,
+                            fill: '#fff',
+                            stroke: '#d9d9d9',
+                            zIndex: 12,
+                        },
+                    },
+                    {
+                        tagName: 'polygon',
+                        selector: 'xflow-port-arrow',
+                        className: 'xflow-port-arrow',
+                        attrs: {
+                            points: '0,0 8,0 4,4 ',
+                            fill: '#d9d9d9',
+                            stroke: '#d9d9d9',
+                            zIndex: 13,
+                            transform: 'translate(-4,0)',
+                        },
+                    },
+                ],
+            },
+        ],
+    });
+}
+//# sourceMappingURL=node.js.map

package/lib/canvas-dag-extension/x6-extension/node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"node.js","sourceRoot":"","sources":["../../../src/canvas-dag-extension/x6-extension/node.ts"],"names":[],"mappings":";;;AAAA,mEAAmE;AACnE,uDAAiD;AACjD,+BAA+B;AAE/B,0CAAwF;AACxF,sDAAiE;AAEjE,IAAI,SAA0B,CAAA;AA+FrB,8BAAS;AA7FV,IAAA,WAAW,GAAK,oBAAO,YAAZ,CAAY;AA6FX,kCAAW;AA3F/B,IAAI,SAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,4BAAgB,CAAC,EAAE;IACzC,oBAAA,SAAS,GAAG,SAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,4BAAgB,CAAC,CAAA;CAChD;KAAM;IACL,oBAAA,SAAS,GAAG,2BAAU,CAAC,MAAM,CAAC;QAC5B,KAAK,EAAE,8BAAkB;QACzB,MAAM,EAAE,+BAAmB;QAC3B,KAAK,EAAE,4BAAgB;QACvB,2BAA2B;QAC3B,IAAI,EAAE,2BAAc,CAAC,wBAAwB;QAC7C,KAAK,EAAE;YACL,MAAM,EAAE;gBACN,GAAG,EAAE;oBACH,MAAM,EAAE,CAAC;oBACT,QAAQ,EAAE;wBACR,IAAI,EAAE,WAAW,CAAC,GAAG;qBACtB;iBACF;gBACD,MAAM,EAAE;oBACN,MAAM,EAAE,CAAC;oBACT,QAAQ,EAAE;wBACR,IAAI,EAAE,WAAW,CAAC,MAAM;qBACzB;iBACF;gBACD,KAAK,EAAE;oBACL,MAAM,EAAE,CAAC;oBACT,QAAQ,EAAE;wBACR,IAAI,EAAE,WAAW,CAAC,KAAK;qBACxB;iBACF;gBACD,IAAI,EAAE;oBACJ,MAAM,EAAE,CAAC;oBACT,QAAQ,EAAE;wBACR,IAAI,EAAE,WAAW,CAAC,IAAI;qBACvB;iBACF;aACF;SACF;QACD,KAAK,EAAE;YACL,IAAI,EAAE;gBACJ,MAAM,EAAE,KAAK;gBACb,IAAI,EAAE,MAAM;gBACZ,MAAM,EAAE,MAAM;gBACd,QAAQ,EAAE,MAAM;gBAChB,SAAS,EAAE,MAAM;gBACjB,MAAM,EAAE,CAAC;aACV;SACF;QACD,UAAU,EAAE;YACV;gBACE,OAAO,EAAE,GAAG;gBACZ,QAAQ,EAAE,kBAAkB;gBAC5B,SAAS,EAAE,kBAAkB;gBAC7B,KAAK,EAAE;oBACL,KAAK,EAAE,CAAC;oBACR,MAAM,EAAE,CAAC;oBACT,CAAC,EAAE,CAAC,CAAC;oBACL,CAAC,EAAE,CAAC,CAAC;oBACL,MAAM,EAAE,EAAE;oBACV,gBAAgB;oBAChB,MAAM,EAAE,MAAM;iBACf;gBACD,QAAQ,EAAE;oBACR;wBACE,OAAO,EAAE,QAAQ;wBACjB,QAAQ,EAAE,YAAY;wBACtB,SAAS,EAAE,YAAY;wBACvB,KAAK,EAAE;4BACL,CAAC,EAAE,CAAC;4BACJ,IAAI,EAAE,MAAM;4BACZ,MAAM,EAAE,SAAS;4BACjB,MAAM,EAAE,EAAE;yBACX;qBACF;oBACD;wBACE,OAAO,EAAE,SAAS;wBAClB,QAAQ,EAAE,kBAAkB;wBAC5B,SAAS,EAAE,kBAAkB;wBAC7B,KAAK,EAAE;4BACL,MAAM,EAAE,cAAc;4BACtB,IAAI,EAAE,SAAS;4BACf,MAAM,EAAE,SAAS;4BACjB,MAAM,EAAE,EAAE;4BACV,SAAS,EAAE,iBAAiB;yBAC7B;qBACF;iBACF;aACF;SACF;KACF,CAAC,CAAA;CACH"}

package/lib/canvas-flow-extension/components/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const FlowGraphExtension: React.FC;

package/lib/canvas-flow-extension/components/index.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FlowGraphExtension = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var xflow_core_1 = require("@sunspirytus/xflow-core");
+var module_1 = require("../module");
+var FlowGraphExtension = function () {
+    /** 获取扩展Registry */
+    var extensionRegistry = (0, xflow_core_1.useExtensionRegistry)();
+    var config = react_1.default.useMemo(function () { return ({
+        CONFIG_TYPE: 'DAG_EXTENSION',
+        getConfig: function () { return tslib_1.__awaiter(void 0, void 0, void 0, function () { return tslib_1.__generator(this, function (_a) {
+            return [2 /*return*/];
+        }); }); },
+    }); }, []);
+    react_1.default.useEffect(function () {
+        /** 注册 extension 到 Registry */
+        var disposable = extensionRegistry.addExtension({
+            config: config,
+            createModule: module_1.createFlowExtensionModule,
+        });
+        /** 添加 classname */
+        extensionRegistry.addContainerClassNames('flow-extension-container');
+        return function () {
+            disposable.dispose();
+        };
+    }, [config, extensionRegistry]);
+    return null;
+};
+exports.FlowGraphExtension = FlowGraphExtension;
+//# sourceMappingURL=index.js.map

package/lib/canvas-flow-extension/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/canvas-flow-extension/components/index.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AAEzB,sDAA8D;AAC9D,oCAAqD;AAE9C,IAAM,kBAAkB,GAAa;IAC1C,mBAAmB;IACnB,IAAM,iBAAiB,GAAG,IAAA,iCAAoB,GAAE,CAAA;IAChD,IAAM,MAAM,GAAG,eAAK,CAAC,OAAO,CAC1B,cAAM,OAAA,CAAC;QACL,WAAW,EAAE,eAAe;QAC5B,SAAS,EAAE;;iBAAc;KAC1B,CAAC,EAHI,CAGJ,EACF,EAAE,CACH,CAAA;IAED,eAAK,CAAC,SAAS,CAAC;QACd,8BAA8B;QAC9B,IAAM,UAAU,GAAG,iBAAiB,CAAC,YAAY,CAAC;YAChD,MAAM,EAAE,MAAM;YACd,YAAY,EAAE,kCAAyB;SACxC,CAAC,CAAA;QACF,mBAAmB;QACnB,iBAAiB,CAAC,sBAAsB,CAAC,0BAA0B,CAAC,CAAA;QAEpE,OAAO;YACL,UAAU,CAAC,OAAO,EAAE,CAAA;QACtB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC,CAAA;IAE/B,OAAO,IAAI,CAAA;AACb,CAAC,CAAA;AA1BY,QAAA,kBAAkB,sBA0B9B"}

package/lib/canvas-flow-extension/constants.d.ts

@@ -0,0 +1,3 @@
+export declare const XFLOW_NODE_SHAPE = "XFLOW_FLOW_NODE_SHAPE";
+export declare const NODE_DEFAULT_WIDTH = 150;
+export declare const NODE_DEFAULT_HEIGHT = 60;

package/lib/canvas-flow-extension/constants.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NODE_DEFAULT_HEIGHT = exports.NODE_DEFAULT_WIDTH = exports.XFLOW_NODE_SHAPE = void 0;
+exports.XFLOW_NODE_SHAPE = 'XFLOW_FLOW_NODE_SHAPE';
+exports.NODE_DEFAULT_WIDTH = 150;
+exports.NODE_DEFAULT_HEIGHT = 60;
+//# sourceMappingURL=constants.js.map

package/lib/canvas-flow-extension/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../src/canvas-flow-extension/constants.ts"],"names":[],"mappings":";;;AAAa,QAAA,gBAAgB,GAAG,uBAAuB,CAAA;AAE1C,QAAA,kBAAkB,GAAG,GAAG,CAAA;AAExB,QAAA,mBAAmB,GAAG,EAAE,CAAA"}

package/lib/canvas-flow-extension/contributions/flow.d.ts

@@ -0,0 +1,14 @@
+import type { Graph } from '@antv/x6';
+import type { ICmdHooks } from '@sunspirytus/xflow-core';
+import { DisposableCollection, Disposable } from '@sunspirytus/xflow-core';
+import { IHookContribution } from '@sunspirytus/xflow-core';
+export declare const flowOptions: Graph.Options;
+/**
+ * 内置的hook contribution
+ * 处理 config上的runtime的注册项
+ */
+export declare class FlowHooksContribution implements IHookContribution<ICmdHooks> {
+    toDispose: DisposableCollection;
+    registerHookHub: () => Promise<Disposable>;
+    registerHook: (hooks: ICmdHooks) => Promise<Disposable>;
+}

package/lib/canvas-flow-extension/contributions/flow.js

@@ -0,0 +1,175 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FlowHooksContribution = exports.flowOptions = void 0;
+var tslib_1 = require("tslib");
+var xflow_core_1 = require("@sunspirytus/xflow-core");
+var xflow_core_2 = require("@sunspirytus/xflow-core");
+var node_1 = require("../x6-extension/node");
+var x6_1 = require("@antv/x6");
+exports.flowOptions = {
+    grid: true,
+    mousewheel: {
+        enabled: true,
+        zoomAtMousePosition: true,
+        modifiers: 'ctrl',
+        minScale: 0.5,
+        maxScale: 3,
+    },
+    connecting: {
+        router: 'manhattan',
+        connector: {
+            name: 'rounded',
+            args: {
+                radius: 8,
+            },
+        },
+        anchor: 'center',
+        connectionPoint: 'anchor',
+        allowBlank: false,
+        snap: {
+            radius: 20,
+        },
+        createEdge: function () {
+            return new x6_1.Shape.Edge({
+                attrs: {
+                    line: {
+                        stroke: '#A2B1C3',
+                        strokeWidth: 2,
+                        targetMarker: {
+                            name: 'block',
+                            width: 12,
+                            height: 8,
+                        },
+                    },
+                },
+                zIndex: 0,
+            });
+        },
+        validateConnection: function (_a) {
+            var targetMagnet = _a.targetMagnet;
+            return !!targetMagnet;
+        },
+    },
+    highlighting: {
+        magnetAdsorbed: {
+            name: 'stroke',
+            args: {
+                attrs: {
+                    fill: '#5F95FF',
+                    stroke: '#5F95FF',
+                },
+            },
+        },
+    },
+    resizing: true,
+    rotating: true,
+    selecting: {
+        enabled: true,
+        rubberband: true,
+        showNodeSelectionBox: true,
+        modifiers: 'shift',
+    },
+    snapline: true,
+    keyboard: true,
+    clipboard: true,
+};
+/**
+ * 内置的hook contribution
+ * 处理 config上的runtime的注册项
+ */
+var FlowHooksContribution = /** @class */ (function () {
+    function FlowHooksContribution() {
+        var _this = this;
+        this.toDispose = new xflow_core_1.DisposableCollection();
+        this.registerHookHub = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            return tslib_1.__generator(this, function (_a) {
+                return [2 /*return*/, xflow_core_1.Disposable.create(function () { })];
+            });
+        }); };
+        this.registerHook = function (hooks) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+            var toDispose, disposables;
+            var _this = this;
+            return tslib_1.__generator(this, function (_a) {
+                toDispose = new xflow_core_1.DisposableCollection();
+                disposables = [
+                    hooks.addNode.registerHook({
+                        name: 'flow-add-node',
+                        handler: function (args) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                            var cellFactory;
+                            var _this = this;
+                            return tslib_1.__generator(this, function (_a) {
+                                cellFactory = function (nodeConfig) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                                    var node;
+                                    return tslib_1.__generator(this, function (_a) {
+                                        node = new node_1.XFlowNode(tslib_1.__assign({}, nodeConfig));
+                                        return [2 /*return*/, node];
+                                    });
+                                }); };
+                                args.cellFactory = cellFactory;
+                                return [2 /*return*/];
+                            });
+                        }); },
+                    }),
+                    hooks.addEdge.registerHook({
+                        name: 'flow-add-edge',
+                        handler: function (args) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                            var cellFactory;
+                            var _this = this;
+                            return tslib_1.__generator(this, function (_a) {
+                                cellFactory = function (edgeConfig) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                                    var cell;
+                                    return tslib_1.__generator(this, function (_a) {
+                                        delete edgeConfig.id;
+                                        cell = new x6_1.Shape.Edge({
+                                            source: {
+                                                cell: edgeConfig.source,
+                                                port: edgeConfig.sourcePortId,
+                                            },
+                                            target: {
+                                                cell: edgeConfig.target,
+                                                port: edgeConfig.targetPortId,
+                                            },
+                                            attrs: {
+                                                line: {
+                                                    stroke: '#A2B1C3',
+                                                    strokeWidth: 2,
+                                                    targetMarker: {
+                                                        name: 'block',
+                                                        width: 12,
+                                                        height: 8,
+                                                    },
+                                                },
+                                            },
+                                            zIndex: -1,
+                                            data: tslib_1.__assign({}, edgeConfig),
+                                        });
+                                        return [2 /*return*/, cell];
+                                    });
+                                }); };
+                                args.cellFactory = cellFactory;
+                                return [2 /*return*/];
+                            });
+                        }); },
+                    }),
+                    hooks.graphOptions.registerHook({
+                        name: 'assign options ',
+                        handler: function (args) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
+                            return tslib_1.__generator(this, function (_a) {
+                                Object.assign(args, exports.flowOptions);
+                                return [2 /*return*/];
+                            });
+                        }); },
+                    }),
+                ];
+                toDispose.pushAll(disposables);
+                return [2 /*return*/, xflow_core_1.Disposable.create(function () { })];
+            });
+        }); };
+    }
+    FlowHooksContribution = tslib_1.__decorate([
+        xflow_core_1.ManaSyringe.singleton({ contrib: xflow_core_2.IHookContribution })
+    ], FlowHooksContribution);
+    return FlowHooksContribution;
+}());
+exports.FlowHooksContribution = FlowHooksContribution;
+//# sourceMappingURL=flow.js.map

package/lib/canvas-flow-extension/contributions/flow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"flow.js","sourceRoot":"","sources":["../../../src/canvas-flow-extension/contributions/flow.tsx"],"names":[],"mappings":";;;;AAEA,sDAAuF;AACvF,sDAA2D;AAC3D,6CAAgD;AAChD,+BAAgC;AAEnB,QAAA,WAAW,GAAkB;IACxC,IAAI,EAAE,IAAI;IACV,UAAU,EAAE;QACV,OAAO,EAAE,IAAI;QACb,mBAAmB,EAAE,IAAI;QACzB,SAAS,EAAE,MAAM;QACjB,QAAQ,EAAE,GAAG;QACb,QAAQ,EAAE,CAAC;KACZ;IACD,UAAU,EAAE;QACV,MAAM,EAAE,WAAW;QACnB,SAAS,EAAE;YACT,IAAI,EAAE,SAAS;YACf,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC;aACV;SACF;QACD,MAAM,EAAE,QAAQ;QAChB,eAAe,EAAE,QAAQ;QACzB,UAAU,EAAE,KAAK;QACjB,IAAI,EAAE;YACJ,MAAM,EAAE,EAAE;SACX;QACD,UAAU;YACR,OAAO,IAAI,UAAK,CAAC,IAAI,CAAC;gBACpB,KAAK,EAAE;oBACL,IAAI,EAAE;wBACJ,MAAM,EAAE,SAAS;wBACjB,WAAW,EAAE,CAAC;wBACd,YAAY,EAAE;4BACZ,IAAI,EAAE,OAAO;4BACb,KAAK,EAAE,EAAE;4BACT,MAAM,EAAE,CAAC;yBACV;qBACF;iBACF;gBACD,MAAM,EAAE,CAAC;aACV,CAAC,CAAA;QACJ,CAAC;QACD,kBAAkB,YAAC,EAAgB;gBAAd,YAAY,kBAAA;YAC/B,OAAO,CAAC,CAAC,YAAY,CAAA;QACvB,CAAC;KACF;IACD,YAAY,EAAE;QACZ,cAAc,EAAE;YACd,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE;gBACJ,KAAK,EAAE;oBACL,IAAI,EAAE,SAAS;oBACf,MAAM,EAAE,SAAS;iBAClB;aACF;SACF;KACF;IACD,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE;QACT,OAAO,EAAE,IAAI;QACb,UAAU,EAAE,IAAI;QAChB,oBAAoB,EAAE,IAAI;QAC1B,SAAS,EAAE,OAAO;KACnB;IACD,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;IACd,SAAS,EAAE,IAAI;CAChB,CAAA;AAED;;;GAGG;AAEH;IAAA;QAAA,iBAiEC;QAhEC,cAAS,GAAG,IAAI,iCAAoB,EAAE,CAAA;QAEtC,oBAAe,GAAG;;gBAChB,sBAAO,uBAAU,CAAC,MAAM,CAAC,cAAO,CAAC,CAAC,EAAA;;aACnC,CAAA;QAED,iBAAY,GAAG,UAAO,KAAgB;;;;gBAC9B,SAAS,GAAG,IAAI,iCAAoB,EAAE,CAAA;gBACtC,WAAW,GAAG;oBAClB,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC;wBACzB,IAAI,EAAE,eAAe;wBACrB,OAAO,EAAE,UAAM,IAAI;;;;gCACX,WAAW,GAA2C,UAAM,UAAU;;;wCACpE,IAAI,GAAG,IAAI,gBAAS,sBACrB,UAAU,EACb,CAAA;wCACF,sBAAO,IAAI,EAAA;;qCACZ,CAAA;gCACD,IAAI,CAAC,WAAW,GAAG,WAAW,CAAA;;;6BAC/B;qBACF,CAAC;oBACF,KAAK,CAAC,OAAO,CAAC,YAAY,CAAC;wBACzB,IAAI,EAAE,eAAe;wBACrB,OAAO,EAAE,UAAM,IAAI;;;;gCACX,WAAW,GAA2C,UAAM,UAAU;;;wCAC1E,OAAQ,UAAkB,CAAC,EAAE,CAAA;wCACvB,IAAI,GAAG,IAAI,UAAK,CAAC,IAAI,CAAC;4CAC1B,MAAM,EAAE;gDACN,IAAI,EAAE,UAAU,CAAC,MAAM;gDACvB,IAAI,EAAE,UAAU,CAAC,YAAY;6CAC9B;4CACD,MAAM,EAAE;gDACN,IAAI,EAAE,UAAU,CAAC,MAAM;gDACvB,IAAI,EAAE,UAAU,CAAC,YAAY;6CAC9B;4CACD,KAAK,EAAE;gDACL,IAAI,EAAE;oDACJ,MAAM,EAAE,SAAS;oDACjB,WAAW,EAAE,CAAC;oDACd,YAAY,EAAE;wDACZ,IAAI,EAAE,OAAO;wDACb,KAAK,EAAE,EAAE;wDACT,MAAM,EAAE,CAAC;qDACV;iDACF;6CACF;4CACD,MAAM,EAAE,CAAC,CAAC;4CACV,IAAI,uBAAO,UAAU,CAAE;yCACxB,CAAC,CAAA;wCACF,sBAAO,IAAI,EAAA;;qCACZ,CAAA;gCACD,IAAI,CAAC,WAAW,GAAG,WAAW,CAAA;;;6BAC/B;qBACF,CAAC;oBACF,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC;wBAC9B,IAAI,EAAE,iBAAiB;wBACvB,OAAO,EAAE,UAAM,IAAI;;gCACjB,MAAM,CAAC,MAAM,CAAC,IAAI,EAAE,mBAAW,CAAC,CAAA;;;6BACjC;qBACF,CAAC;iBACH,CAAA;gBACD,SAAS,CAAC,OAAO,CAAC,WAAW,CAAC,CAAA;gBAC9B,sBAAO,uBAAU,CAAC,MAAM,CAAC,cAAO,CAAC,CAAC,EAAA;;aACnC,CAAA;IACH,CAAC;IAjEY,qBAAqB;QADjC,wBAAW,CAAC,SAAS,CAAC,EAAE,OAAO,EAAE,8BAAiB,EAAE,CAAC;OACzC,qBAAqB,CAiEjC;IAAD,4BAAC;CAAA,AAjED,IAiEC;AAjEY,sDAAqB"}

package/lib/canvas-flow-extension/index.d.ts

@@ -0,0 +1 @@
+export { FlowGraphExtension } from './components';

package/lib/canvas-flow-extension/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FlowGraphExtension = void 0;
+var components_1 = require("./components");
+Object.defineProperty(exports, "FlowGraphExtension", { enumerable: true, get: function () { return components_1.FlowGraphExtension; } });
+//# sourceMappingURL=index.js.map

package/lib/canvas-flow-extension/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/canvas-flow-extension/index.tsx"],"names":[],"mappings":";;;AAAA,2CAAiD;AAAxC,gHAAA,kBAAkB,OAAA"}

package/lib/canvas-flow-extension/module.d.ts

@@ -0,0 +1,7 @@
+import 'reflect-metadata';
+/** Application 扩展依赖 */
+import { ManaSyringe } from '@sunspirytus/xflow-core';
+export * from './x6-extension/node';
+/** 依赖扩展模块，必须要加载 */
+declare const createFlowExtensionModule: () => ManaSyringe.SyringeModule;
+export { createFlowExtensionModule };

package/lib/canvas-flow-extension/module.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createFlowExtensionModule = void 0;
+var tslib_1 = require("tslib");
+require("reflect-metadata");
+/** Application 扩展依赖 */
+var xflow_core_1 = require("@sunspirytus/xflow-core");
+var flow_1 = require("./contributions/flow");
+tslib_1.__exportStar(require("./x6-extension/node"), exports);
+/** 依赖扩展模块，必须要加载 */
+var createFlowExtensionModule = function () {
+    return xflow_core_1.ManaSyringe.Module(function (register) {
+        /** 扩展 runtime hook */
+        register(flow_1.FlowHooksContribution);
+    });
+};
+exports.createFlowExtensionModule = createFlowExtensionModule;
+//# sourceMappingURL=module.js.map

package/lib/canvas-flow-extension/module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.js","sourceRoot":"","sources":["../../src/canvas-flow-extension/module.ts"],"names":[],"mappings":";;;;AAAA,4BAAyB;AACzB,uBAAuB;AACvB,sDAAqD;AACrD,6CAA4D;AAE5D,8DAAmC;AAEnC,mBAAmB;AACnB,IAAM,yBAAyB,GAAG;IAChC,OAAO,wBAAW,CAAC,MAAM,CAAC,UAAA,QAAQ;QAChC,sBAAsB;QACtB,QAAQ,CAAC,4BAAqB,CAAC,CAAA;IACjC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAA;AAEQ,8DAAyB"}