@rxflow/group-bloodline 0.0.1-alpha.0

package/cjs/nodes/Service/MultipleVersionService.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MultipleVersionRender = void 0;
+var _base = require("@rxflow/base");
+var _ = require("../..");
+require("../../style/index.less");
+var _classcat = _interopRequireDefault(require("classcat"));
+var _react = _interopRequireDefault(require("react"));
+var _Connector = require("../../components/Connector");
+var _Version = require("../../components/Version");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-05 16:23
+ * @desc: 多版本节点
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const prefixCls = 'rxflow-group-bloodline';
+const MultipleVersionRender = props => {
+  const {
+    origin,
+    siblings,
+    isRoot,
+    depth
+  } = props;
+  const {
+    name,
+    versions,
+    hit
+  } = origin;
+  const getProps = (0, _base.useGetProps)();
+  const PropertyPopover = getProps().PropertyPopover;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classcat.default)([`${prefixCls}-service`, {
+      [`${prefixCls}-hit`]: hit
+    }]),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${prefixCls}-node_name`,
+      children: name
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${prefixCls}-versions`,
+      children: versions.map((version, index) => {
+        return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: `${prefixCls}-version-box`,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Connector.Connector, {
+            depth: depth,
+            isRoot: isRoot,
+            version: version,
+            source: origin,
+            siblings: siblings,
+            direction: _.BloodlineDirection.upstream
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.Popover, {
+            rootClassName: `${prefixCls}-popover`,
+            placement: 'right',
+            content: /*#__PURE__*/(0, _jsxRuntime.jsx)(PropertyPopover, {
+              origin: origin,
+              version: version,
+              isRoot: isRoot
+            }),
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Version.Version, {
+                ...version
+              })
+            })
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Connector.Connector, {
+            depth: depth,
+            isRoot: isRoot,
+            version: version,
+            source: origin,
+            siblings: siblings,
+            direction: _.BloodlineDirection.downstream
+          })]
+        }, index);
+      })
+    })]
+  });
+};
+exports.MultipleVersionRender = MultipleVersionRender;

package/cjs/nodes/Service/SingleVersionService.d.ts

@@ -0,0 +1,6 @@
+import { InnerNodeData, MultipleVersionsNodeData } from "../..";
+import '../../style/index.less';
+export declare const SingleVersionNodeRender: (props: MultipleVersionsNodeData & InnerNodeData & {
+    measure?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SingleVersionService.d.ts.map

package/cjs/nodes/Service/SingleVersionService.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SingleVersionService.d.ts","sourceRoot":"","sources":["SingleVersionService.tsx"],"names":[],"mappings":"AAQA,OAAO,EAA2B,aAAa,EAAE,wBAAwB,EAAC,cAAgC;AAE1G,OAAO,wBAAwB,CAAC;AAQhC,eAAO,MAAM,uBAAuB,UAAW,wBAAwB,GAAG,aAAa,GAAG;IACxF,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,4CAwCA,CAAA"}

package/cjs/nodes/Service/SingleVersionService.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SingleVersionNodeRender = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _base = require("@rxflow/base");
+require("../../style/index.less");
+var _Version = require("../../components/Version");
+var _Connector = require("../../components/Connector");
+var _ = require("../..");
+var _classcat = _interopRequireDefault(require("classcat"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-05 14:58
+ * @desc: 单版本节点
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const prefixCls = 'rxflow-group-bloodline';
+const SingleVersionNodeRender = props => {
+  const {
+    origin,
+    siblings,
+    isRoot,
+    depth
+  } = props;
+  const {
+    name,
+    hit
+  } = origin;
+  const getProps = (0, _base.useGetProps)();
+  const PropertyPopover = getProps().PropertyPopover;
+  const version = origin.versions?.[0];
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classcat.default)([`${prefixCls}-service`, {
+      [`${prefixCls}-hit`]: hit
+    }]),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Connector.Connector, {
+      depth: depth,
+      isRoot: isRoot,
+      version: version,
+      source: origin,
+      siblings: siblings,
+      direction: _.BloodlineDirection.upstream
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.Popover, {
+      rootClassName: `${prefixCls}-popover`,
+      placement: 'right',
+      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(PropertyPopover, {
+        origin: origin,
+        version: version,
+        isRoot: isRoot
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${prefixCls}-node_name`,
+          children: name
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Version.Version, {
+          ...version
+        })]
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Connector.Connector, {
+      depth: depth,
+      isRoot: isRoot,
+      version: version,
+      source: origin,
+      siblings: siblings,
+      direction: _.BloodlineDirection.downstream
+    })]
+  });
+};
+exports.SingleVersionNodeRender = SingleVersionNodeRender;

package/cjs/nodes/Service/index.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-05 21:56
+ * @desc: ServiceNode
+ *
+ * 支持单版本和多版本
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+import React from "react";
+import { Node, NodeProps } from "@xyflow/react";
+import { InnerNodeData, ServiceNodeData } from "../..";
+export declare const ServiceRender: (props: ServiceNodeData & InnerNodeData & {
+    measure?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const Service: React.MemoExoticComponent<(props: NodeProps<Node<ServiceNodeData & InnerNodeData>>) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=index.d.ts.map

package/cjs/nodes/Service/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,IAAI,EAAE,SAAS,EAAC,MAAM,eAAe,CAAC;AAC9C,OAAO,EAA6B,aAAa,EAAE,eAAe,EAAC,cAAgC;AAMnG,eAAO,MAAM,aAAa,UAAW,eAAe,GAAG,aAAa,GAAG;IACrE,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,4CAwBA,CAAA;AAGD,eAAO,MAAM,OAAO,oCAAsB,UAAU,KAAK,eAAe,GAAG,aAAa,CAAC,CAAC,6CAaxE,CAAC"}

package/cjs/nodes/Service/index.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ServiceRender = exports.Service = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _shadowNodeData = require("../../utils/shadowNodeData");
+var _SingleVersionService = require("./SingleVersionService");
+var _MultipleVersionService = require("./MultipleVersionService");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-05 21:56
+ * @desc: ServiceNode
+ *
+ * 支持单版本和多版本
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const ServiceRender = props => {
+  const {
+    origin,
+    measure,
+    siblings,
+    direction,
+    isRoot,
+    depth
+  } = props;
+  if (origin.versions?.length > 1) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_MultipleVersionService.MultipleVersionRender, {
+      depth: depth,
+      isRoot: isRoot,
+      direction: direction,
+      measure: measure,
+      origin: origin,
+      siblings: siblings
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_SingleVersionService.SingleVersionNodeRender, {
+    depth: depth,
+    isRoot: isRoot,
+    direction: direction,
+    measure: measure,
+    origin: origin,
+    siblings: siblings
+  });
+};
+exports.ServiceRender = ServiceRender;
+const Service = exports.Service = /*#__PURE__*/_react.default.memo(props => {
+  const {
+    data
+  } = props;
+  const {
+    origin,
+    siblings,
+    direction,
+    isRoot,
+    depth
+  } = data;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ServiceRender, {
+    depth: depth,
+    direction: direction,
+    isRoot: isRoot,
+    measure: true,
+    origin: origin,
+    siblings: siblings
+  });
+}, _shadowNodeData.shadowNodeData);

package/cjs/nodes/ServiceGroup/index.d.ts

@@ -0,0 +1,6 @@
+import { GroupNodeData, InnerNodeData } from "../..";
+import '../../style/index.less';
+import { Node, NodeProps } from "@xyflow/react";
+import React from "react";
+export declare const ServiceGroup: React.MemoExoticComponent<(props: NodeProps<Node<GroupNodeData & InnerNodeData>>) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=index.d.ts.map

package/cjs/nodes/ServiceGroup/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAC,aAAa,EAA4B,aAAa,EAAC,cAAgC;AAE/F,OAAO,wBAAwB,CAAC;AAChC,OAAO,EAAC,IAAI,EAAE,SAAS,EAAmC,MAAM,eAAe,CAAC;AAKhF,OAAO,KAA2B,MAAM,OAAO,CAAC;AAQhD,eAAO,MAAM,YAAY,oCAAsB,UAAU,KAAK,aAAa,GAAG,aAAa,CAAC,CAAC,6CAwJ3E,CAAC"}

package/cjs/nodes/ServiceGroup/index.js

@@ -0,0 +1,192 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ServiceGroup = void 0;
+var _ArrowsAltOutlined = _interopRequireDefault(require("@ant-design/icons/ArrowsAltOutlined"));
+var _base = require("@rxflow/base");
+require("../../style/index.less");
+var _react = require("@xyflow/react");
+var _ahooks = require("ahooks");
+var _antd = require("antd");
+var _classcat = _interopRequireDefault(require("classcat"));
+var _lodash = require("lodash");
+var _react2 = _interopRequireWildcard(require("react"));
+var _constants = require("../../constants");
+var _keys = require("../../utils/keys");
+var _shadowNodeData = require("../../utils/shadowNodeData");
+var _Service = require("../Service");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-05 16:36
+ * @desc: $Desc$
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const prefixCls = 'rxflow-group-bloodline';
+const ServiceGroup = exports.ServiceGroup = /*#__PURE__*/_react2.default.memo(props => {
+  const {
+    data,
+    id
+  } = props;
+  const {
+    origin,
+    siblings,
+    direction,
+    isRoot,
+    depth
+  } = data;
+  const {
+    name,
+    count
+  } = origin;
+  const getProps = (0, _base.useGetProps)();
+  const update = (0, _ahooks.useUpdate)();
+  const triggerLayout = (0, _base.useForceUpdate)();
+  const {
+    expanded = false,
+    loading = false,
+    list = [],
+    current = 1,
+    total = 0
+  } = origin.state || {};
+  const updateNodeInternals = (0, _react.useUpdateNodeInternals)(); // 重新解析handles
+
+  const {
+    run
+  } = (0, _ahooks.useRequest)(async params => {
+    (0, _lodash.set)(origin, ['state', 'loading'], true);
+    update();
+    const {
+      current,
+      pageSize
+    } = params;
+    const getChildren = getProps().getChildren;
+    try {
+      const {
+        total,
+        list
+      } = await getChildren?.(origin, pageSize, current, direction);
+      (0, _lodash.set)(origin, ['state', 'loading'], false);
+      (0, _lodash.set)(origin, ['state', 'current'], current);
+      (0, _lodash.set)(origin, ['state', 'total'], total);
+      (0, _lodash.set)(origin, ['state', 'list'], list);
+      triggerLayout();
+    } catch (e) {
+      (0, _lodash.set)(origin, ['state', 'loading'], false);
+      update();
+    }
+  }, {
+    manual: true
+  });
+  const onExpand = (0, _ahooks.useMemoizedFn)(() => {
+    (0, _lodash.set)(origin, ['state', 'expanded'], true);
+    update();
+    if (!origin.state?.list) {
+      run({
+        current: 1,
+        pageSize: _constants.groupPageSize
+      });
+    }
+  });
+  const onCollapse = (0, _ahooks.useMemoizedFn)(() => {
+    (0, _lodash.set)(origin, ['state', 'expanded'], false);
+    update();
+  });
+  const onPaginationChange = (0, _ahooks.useMemoizedFn)((current, pageSize) => {
+    run({
+      current,
+      pageSize
+    });
+  });
+  (0, _react2.useEffect)(() => {
+    updateNodeInternals(id);
+  }, [list]);
+  const groupInfo = (0, _react2.useMemo)(() => {
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: `${prefixCls}-group_title`,
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.Tooltip, {
+          title: name,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+            children: name
+          })
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${prefixCls}-group_count`,
+        children: [count || 0, "\u4E2A"]
+      })]
+    });
+  }, [name, count]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classcat.default)([`${prefixCls}-group`, {
+      [`${prefixCls}-expanded`]: expanded
+    }]),
+    onClick: expanded ? undefined : onExpand,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_base.HiddenHandle, {
+      type: 'target',
+      position: _react.Position.Left,
+      id: (0, _keys.getConnectorId)(_constants.BloodlineDirection.upstream, id)
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.HiddenHandle, {
+      type: "source",
+      position: _react.Position.Right,
+      id: (0, _keys.getConnectorId)(_constants.BloodlineDirection.downstream, id)
+    }), expanded ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      className: `${prefixCls}-expanded-content`,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${prefixCls}-title_bar`,
+        children: [groupInfo, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: `${prefixCls}-group_icon`,
+          onClick: onCollapse,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowsAltOutlined.default, {})
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: `${prefixCls}-group_content`,
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Spin, {
+          size: 'small',
+          spinning: loading,
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: `${prefixCls}--group_items`,
+            children: list?.map(node => {
+              const {
+                type,
+                id
+              } = node;
+              switch (type) {
+                case _constants.BloodlineNodeType.Service:
+                  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Service.ServiceRender, {
+                    depth: depth,
+                    isRoot: isRoot,
+                    direction: direction,
+                    origin: node,
+                    siblings: siblings
+                  }, id);
+                default:
+                  return null;
+              }
+            })
+          })
+        }), total > _constants.groupPageSize ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Pagination, {
+          current: current,
+          pageSize: _constants.groupPageSize,
+          onChange: onPaginationChange,
+          total: total,
+          showSizeChanger: false,
+          showQuickJumper: false,
+          showLessItems: true,
+          size: 'small',
+          rootClassName: `${prefixCls}-pagination`
+        }) : null]
+      })]
+    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: `${prefixCls}-group_base`,
+      children: groupInfo
+    })]
+  });
+}, _shadowNodeData.shadowNodeData);

package/cjs/nodes/index.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-03 12:22
+ * @desc: 节点类型定义
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+import { INodeDefinition } from "@rxflow/base";
+export declare const nodeTypes: INodeDefinition<any>[];
+//# sourceMappingURL=index.d.ts.map

package/cjs/nodes/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAC,eAAe,EAAC,MAAM,cAAc,CAAC;AAM7C,eAAO,MAAM,SAAS,EAAE,eAAe,CAAC,GAAG,CAAC,EAyB3C,CAAC"}

package/cjs/nodes/index.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.nodeTypes = void 0;
+var _DepthToolNode = _interopRequireDefault(require("./DepthToolNode"));
+var _ServiceGroup = require("./ServiceGroup");
+var _constants = require("../constants");
+var _Service = require("./Service");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-03 12:22
+ * @desc: 节点类型定义
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const nodeTypes = exports.nodeTypes = [{
+  type: _constants.BloodlineNodeType.Toolbar,
+  // 是不是可以不配置，直接在节点中引入了
+  component: _DepthToolNode.default,
+  defaultSize: {
+    width: 400,
+    height: 24
+  }
+}, {
+  type: _constants.BloodlineNodeType.Service,
+  component: _Service.Service,
+  defaultSize: {
+    width: 238,
+    // 宽度为238
+    height: 64 // 高度默认为64。如果有子版本号，高度会变化
+  }
+}, {
+  type: _constants.BloodlineNodeType.ServiceGroup,
+  component: _ServiceGroup.ServiceGroup,
+  defaultSize: {
+    width: 265,
+    height: 78
+  }
+}];