ronds-metadata 1.1.4 → 1.1.7

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

@@ -0,0 +1,6 @@
+import '../index.less';
+interface NodeElementProps {
+    node?: Node;
+}
+declare const NodeElement: (props: NodeElementProps) => JSX.Element;
+export default NodeElement;

package/es/comps/DynamicPorts/comps/NodeElement.js

@@ -0,0 +1,26 @@
+import React from "react";
+
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-24 08:50:16
+ * @LastEditTime: 2022-05-24 11:58:52
+ */
+import { GlobalOutlined } from '@ant-design/icons';
+import "../index.css";
+
+var NodeElement = function NodeElement(props) {
+  var node = props.node;
+  var data = (node === null || node === void 0 ? void 0 : node.getData()) || {};
+  var name = data.name;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "node-element"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: 'icon'
+  }, /*#__PURE__*/React.createElement(GlobalOutlined, null)), /*#__PURE__*/React.createElement("div", {
+    className: "notation"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "name"
+  }, name))));
+};
+
+export default NodeElement;

package/es/comps/DynamicPorts/comps/shape/connector.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,19 @@
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-24 10:53:37
+ * @LastEditTime: 2022-05-24 10:53:41
+ */
+import { Graph } from '@antv/x6';
+Graph.registerConnector('pai', function (s, t) {
+  var offset = 4;
+  var control = 80;
+  var v1 = {
+    x: s.x,
+    y: s.y + offset + control
+  };
+  var v2 = {
+    x: t.x,
+    y: t.y - offset - control
+  };
+  return "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);

package/es/comps/DynamicPorts/comps/shape/edge.css

@@ -0,0 +1,4 @@
+.x6-edge-selected path[stroke-width='1'],
+.x6-edge:hover path[stroke-width='1'] {
+  stroke-width: 3px;
+}

package/es/comps/DynamicPorts/comps/shape/edge.d.ts

@@ -0,0 +1,10 @@
+import { Shape } from '@antv/x6';
+import './edge.less';
+export declare class BaseEdge extends Shape.Edge {
+    isGroupEdge(): boolean;
+}
+export declare class DPEdge extends BaseEdge {
+}
+export declare class DPGroupEdge extends DPEdge {
+    isGroupEdge(): boolean;
+}

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

@@ -0,0 +1,91 @@
+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";
+
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-24 09:18:34
+ * @LastEditTime: 2022-05-24 10:43:18
+ */
+import { Shape, Edge } from '@antv/x6';
+import "./edge.css";
+export var BaseEdge = /*#__PURE__*/function (_Shape$Edge) {
+  _inherits(BaseEdge, _Shape$Edge);
+
+  var _super = _createSuper(BaseEdge);
+
+  function BaseEdge() {
+    _classCallCheck(this, BaseEdge);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(BaseEdge, [{
+    key: "isGroupEdge",
+    value: // eslint-disable-next-line class-methods-use-this
+    function isGroupEdge() {
+      return false;
+    }
+  }]);
+
+  return BaseEdge;
+}(Shape.Edge);
+export var DPEdge = /*#__PURE__*/function (_BaseEdge) {
+  _inherits(DPEdge, _BaseEdge);
+
+  var _super2 = _createSuper(DPEdge);
+
+  function DPEdge() {
+    _classCallCheck(this, DPEdge);
+
+    return _super2.apply(this, arguments);
+  }
+
+  return DPEdge;
+}(BaseEdge);
+DPEdge.config({
+  shape: 'DPEdge',
+  connector: {
+    name: 'pai'
+  },
+  zIndex: 2,
+  attrs: {
+    line: {
+      stroke: '#808080',
+      strokeWidth: 1,
+      targetMarker: {
+        stroke: 'none',
+        fill: 'none'
+      }
+    }
+  }
+});
+export var DPGroupEdge = /*#__PURE__*/function (_DPEdge) {
+  _inherits(DPGroupEdge, _DPEdge);
+
+  var _super3 = _createSuper(DPGroupEdge);
+
+  function DPGroupEdge() {
+    _classCallCheck(this, DPGroupEdge);
+
+    return _super3.apply(this, arguments);
+  }
+
+  _createClass(DPGroupEdge, [{
+    key: "isGroupEdge",
+    value: // eslint-disable-next-line class-methods-use-this
+    function isGroupEdge() {
+      return true;
+    }
+  }]);
+
+  return DPGroupEdge;
+}(DPEdge);
+DPGroupEdge.config({
+  shape: 'DPGroupEdge'
+});
+Edge.registry.register({
+  DPEdge: DPEdge,
+  DPGroupEdge: DPGroupEdge
+});

package/es/comps/DynamicPorts/comps/shape/node.d.ts

@@ -0,0 +1,11 @@
+import { ReactShape } from '@antv/x6-react-shape';
+export declare class BaseNode extends ReactShape {
+    isGroup(): boolean;
+}
+export declare class DPNode extends BaseNode {
+    getInPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+    getOutPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+}
+export declare class DPGroupNode extends BaseNode {
+    isGroup(): boolean;
+}

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: 'div',
+        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_ALGO_COMPONENT = "ALGO_COMPONENT";
+export declare const DRAGGABLE_MODEL = "MODEL";

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

@@ -0,0 +1,19 @@
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-24 08:48:57
+ * @LastEditTime: 2022-05-24 08:49:24
+ */
+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_ALGO_COMPONENT = 'ALGO_COMPONENT';
+export var DRAGGABLE_MODEL = 'MODEL';

package/es/comps/DynamicPorts/index.css

@@ -0,0 +1,159 @@
+.node-element {
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  width: 180px;
+  height: 32px;
+  overflow: hidden;
+  background-color: #fff;
+  border-radius: 4px;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.08);
+}
+.node-element.selected,
+.node-element:hover {
+  background-color: rgba(243, 249, 255, 0.92);
+  border: 1px solid #1890ff;
+  box-shadow: 0 0 3px 3px rgba(64, 169, 255, 0.2);
+}
+.node-element.selected .icon,
+.node-element:hover .icon {
+  width: 32px;
+  height: 30px;
+  margin: 0 1px 0 -1px;
+}
+.node-element > * {
+  flex-grow: 1;
+}
+.node-element .icon {
+  display: inline-flex;
+  flex-grow: 0;
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+  background-color: rgba(229, 238, 255, 0.85);
+  border-radius: 4px 0 0 4px;
+}
+.node-element .notation {
+  display: inline-flex;
+  align-items: center;
+  width: calc(100% - 32px);
+  padding: 0 8px;
+  user-select: none;
+}
+.node-element .notation > * {
+  flex-grow: 1;
+}
+.node-element .notation .name {
+  overflow-x: hidden;
+  color: rgba(0, 0, 0, 0.65);
+  font-size: 12px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  vertical-align: middle;
+}
+.node-element .notation .statusIcon {
+  display: inline-flex;
+  flex-grow: 0;
+  align-items: center;
+  font-size: 14px;
+  transform: translateZ(0);
+}
+.x6-node [magnet='true'] {
+  cursor: crosshair;
+  transition: none;
+}
+.x6-node [magnet='true']:hover {
+  opacity: 1;
+}
+.x6-node [magnet='true'][port-group='in'] {
+  cursor: move;
+  stroke: none;
+}
+.x6-port-body > span {
+  display: block;
+}
+.dp-port {
+  width: 100%;
+  height: 100%;
+  border: 1px solid #808080;
+  border-radius: 100%;
+  background: #fff;
+  display: block;
+}
+.dp-port.connected {
+  width: 0;
+  height: 0;
+  margin-top: 3px;
+  margin-left: -1px;
+  border-width: 5px 4px 0;
+  border-style: solid;
+  border-color: #808080 transparent transparent;
+  border-radius: 0;
+  background-color: transparent;
+}
+.x6-port-body.available {
+  overflow: visible;
+}
+.x6-port-body.available body {
+  overflow: visible;
+}
+.x6-port-body.available span {
+  overflow: visible;
+  display: block;
+}
+.x6-port-body.available body > span::before {
+  content: ' ';
+  float: left;
+  width: 20px;
+  height: 20px;
+  margin-top: -6px;
+  margin-left: -6px;
+  border-radius: 50%;
+  background-color: rgba(57, 202, 116, 0.6);
+  box-sizing: border-box;
+}
+.x6-port-body.available body > span::after {
+  content: ' ';
+  float: left;
+  clear: both;
+  width: 10px;
+  height: 10px;
+  margin-top: -15px;
+  margin-left: -1px;
+  border-radius: 50%;
+  background-color: #fff;
+  border: 1px solid #39ca74;
+  z-index: 10;
+  box-sizing: border-box;
+}
+.x6-port-body.adsorbed {
+  overflow: visible;
+}
+.x6-port-body.adsorbed body {
+  overflow: visible;
+}
+.x6-port-body.adsorbed body > span::before {
+  content: ' ';
+  float: left;
+  width: 28px;
+  height: 28px;
+  margin-top: -9px;
+  margin-left: -10px;
+  border-radius: 50%;
+  background-color: rgba(57, 202, 116, 0.6);
+  box-sizing: border-box;
+}
+.x6-port-body.adsorbed body > span::after {
+  content: ' ';
+  float: left;
+  clear: both;
+  width: 10px;
+  height: 10px;
+  margin-top: -19px;
+  border-radius: 50%;
+  background-color: #fff;
+  border: 1px solid #39ca74;
+  z-index: 10;
+  box-sizing: border-box;
+}

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

@@ -0,0 +1,4 @@
+import './index.less';
+import './comps/shape/connector';
+declare const DynamicPorts: () => JSX.Element;
+export default DynamicPorts;

package/es/comps/DynamicPorts/index.js

@@ -0,0 +1,187 @@
+import "antd/es/tooltip/style";
+import _Tooltip from "antd/es/tooltip";
+
+/*
+ * @Author: wangxian
+ * @Date: 2022-05-16 18:53:31
+ * @LastEditTime: 2022-05-24 12:09:46
+ */
+import { Graph, Markup } from '@antv/x6';
+import React from 'react';
+import NodeElement from './comps/NodeElement';
+import { DPGroupEdge } from './comps/shape/edge';
+import { DPNode } from './comps/shape/node';
+import ReactDOM from 'react-dom';
+import "./index.css";
+import './comps/shape/connector';
+
+var DynamicPorts = function DynamicPorts() {
+  var divRef = React.useRef(null);
+  React.useEffect(function () {
+    if (divRef.current !== null) {
+      var graph = new Graph({
+        container: divRef.current,
+        grid: true,
+        onPortRendered: function onPortRendered(args) {
+          var port = args.port;
+          var contentSelectors = args.contentSelectors;
+          var container = contentSelectors && contentSelectors.content;
+          var placement = port.group === 'in' ? 'top' : 'bottom';
+
+          if (container) {
+            ReactDOM.render( /*#__PURE__*/React.createElement(_Tooltip, {
+              title: port.description,
+              placement: placement
+            }, /*#__PURE__*/React.createElement("div", {
+              className: "dp-port".concat(port.connected ? '.connected' : '')
+            })), container);
+          }
+        }
+      });
+      graph.addNode(new DPNode({
+        id: '1',
+        x: 40,
+        y: 35,
+        ports: {
+          items: [{
+            group: 'in',
+            id: 'in11'
+          }, {
+            group: 'in',
+            id: 'in22'
+          }, {
+            group: 'out',
+            id: 'out11'
+          }, {
+            group: 'out',
+            id: 'out22'
+          }]
+        },
+        data: {
+          id: '1',
+          name: '算法'
+        },
+        shape: 'rz-rect-port',
+        component: /*#__PURE__*/React.createElement(NodeElement, null)
+      }));
+      graph.addNode(new DPNode({
+        id: '2',
+        x: 300,
+        y: 35,
+        ports: {
+          items: [{
+            group: 'in',
+            id: 'in1',
+            connected: true
+          }, {
+            group: 'in',
+            id: 'in2'
+          }, {
+            group: 'out',
+            id: 'out1'
+          }, {
+            group: 'out',
+            id: 'out2'
+          }]
+        },
+        data: {
+          id: '2',
+          name: 'Kafka数据源'
+        },
+        shape: 'rz-rect-port',
+        component: /*#__PURE__*/React.createElement(NodeElement, null)
+      }));
+      graph.addEdge(new DPGroupEdge({
+        sourceAnchor: 'bottom',
+        source: {
+          cell: '1',
+          port: 'out11',
+          anchor: {
+            name: 'bottom'
+          }
+        },
+        target: {
+          cell: '2',
+          port: 'in1',
+          anchor: {
+            name: 'center'
+          }
+        },
+        zIndex: 1
+      }));
+    }
+  }, []);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: '100%',
+      height: '100%'
+    },
+    ref: divRef
+  }));
+};
+
+export default DynamicPorts;
+var testNode = {
+  x: 40,
+  y: 35,
+  width: 160,
+  height: 30,
+  label: 'Hello',
+  attrs: {
+    body: {
+      strokeWidth: 1,
+      stroke: '#108ee9',
+      fill: '#fff',
+      rx: 5,
+      ry: 5
+    }
+  },
+  portMarkup: [Markup.getForeignObjectMarkup()],
+  ports: {
+    items: [{
+      group: 'in',
+      id: 'in1'
+    }, {
+      group: 'in',
+      id: 'in2'
+    }, {
+      group: 'out',
+      id: 'out1'
+    }, {
+      group: 'out',
+      id: 'out2'
+    }],
+    groups: {
+      in: {
+        position: {
+          name: 'top'
+        },
+        attrs: {
+          fo: {
+            width: 10,
+            height: 10,
+            x: -5,
+            y: -5,
+            magnet: 'true'
+          }
+        },
+        zIndex: 1
+      },
+      out: {
+        position: {
+          name: 'bottom'
+        },
+        attrs: {
+          fo: {
+            width: 10,
+            height: 10,
+            x: -5,
+            y: -5,
+            magnet: 'true'
+          }
+        },
+        zIndex: 1
+      }
+    }
+  }
+};

package/es/comps/MetadataEdit/components/MetaPropsEdit.js

@@ -36,11 +36,13 @@ var MetaPropsEdit = function MetaPropsEdit(props) {
   var metaType = useMetaType(metadataTag, refresh);
 
   var onTypeChange = function onTypeChange(idx) {
-    var _properties = form.getFieldValue('properties');
+    var _properties$idx, _properties$idx2;
+
+    var _properties = form.getFieldValue('properties') || [];
 
     var __properties = {
-      id: _properties[idx].id,
-      type: _properties[idx].type
+      id: (_properties$idx = _properties[idx]) === null || _properties$idx === void 0 ? void 0 : _properties$idx.id,
+      type: (_properties$idx2 = _properties[idx]) === null || _properties$idx2 === void 0 ? void 0 : _properties$idx2.type
     };
     _properties[idx] = __properties;
     form.setFieldsValue({

package/es/comps/MetadataForm/DataCell/Ref.js

@@ -117,37 +117,74 @@ function Index(props) {
       initEnumValue: initEnumValue
     };
   }, [field]);
+  var getSchemaByRefId = React.useCallback( /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(server, __TYPE__) {
+      var _schema, res, provider, FormCls, formCls, _fields;
+
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              _schema = []; // 如果有内部类，优先在内部类里面找
+
+              if (__TYPE__.length > 0) {
+                _schema = __TYPE__.filter(function (it) {
+                  return it.id === refId;
+                });
+              } // 内部类找不到 从接口里面拿
+
+
+              if (!(_schema.length === 0)) {
+                _context2.next = 7;
+                break;
+              }
+
+              _context2.next = 5;
+              return server.GetMetadataDetailById(refId);
+
+            case 5:
+              res = _context2.sent;
+
+              if (res === null || res === void 0 ? void 0 : res.schema) {
+                _schema = JSON.parse(res === null || res === void 0 ? void 0 : res.schema);
+              }
+
+            case 7:
+              provider = new JsonMetadataProvider();
+
+              if (_schema.length > 0) {
+                provider.add_types(_schema);
+                FormCls = provider.get_type(_schema[0].id);
+                formCls = new FormCls();
+                _fields = formCls.__type__.__fields__;
+                refFieldsRef.current = _fields;
+                setRefFields(_objectSpread({}, _fields));
+                setSchema(_toConsumableArray(_schema));
+              }
+
+            case 9:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    return function (_x, _x2) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), [refId]);
   React.useEffect(function () {
     if (refId) {
       var server = new MetadataService();
-      server.GetMetadataDetailById(refId).then(function (res) {
-        var provider = new JsonMetadataProvider();
-
-        if (res === null || res === void 0 ? void 0 : res.schema) {
-          var mySchema = JSON.parse(res.schema);
-          provider.add_types(mySchema);
-          var FormCls = provider.get_type(mySchema[0].id);
-          var formCls = new FormCls();
-          var _fields = formCls.__type__.__fields__;
-          refFieldsRef.current = _fields;
-          setRefFields(_objectSpread({}, _fields));
-          setSchema(_toConsumableArray(mySchema));
-          return function () {
-            provider = null;
-          };
-        }
-
-        return function () {
-          provider = null;
-        };
-      });
+      getSchemaByRefId(server, formContext.__TYPE__);
       return function () {
         server = null;
       };
     }
 
     return function () {};
-  }, [refId]);
+  }, [getSchemaByRefId, formContext.__TYPE__]);
   React.useEffect(function () {
     if (refId) {
       var arr = refId.split(':');

package/es/comps/MetadataForm/DataCell/Select.js

@@ -14,14 +14,14 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 /*
  * @Author:wangxian
  * @Date: 2021-09-18 14:15:04
- * @LastEditTime: 2022-05-23 11:14:04
+ * @LastEditTime: 2022-05-23 16:51:06
  */
 import React from 'react';
 import { MetadataFormContext, MetadataRefContext } from '../interface';
 import { useGetExtraInfo } from '../hooks';
 import { MetadataService } from '../../../framework/metadata/MetadataService';
-import { deepClone } from '@/utils';
-import { useAsyncMemo } from '@/framework/hooks/use-async-memo';
+import { deepClone } from '../../../utils';
+import { useAsyncMemo } from '../../../framework/hooks/use-async-memo';
 
 function Index(props) {
   var _extraInfo$http3, _extraInfo$http4;
@@ -40,15 +40,7 @@ function Index(props) {
   var formRefContext = React.useContext(MetadataRefContext);
   var extraInfo = useGetExtraInfo(formRefContext ? formRefContext.fields : formContext.fields, id, formContext.form, props.type);
 
-  var _React$useState = React.useState([{
-    value: 'zhejiang',
-    label: 'Zhejiang',
-    isLeaf: false
-  }, {
-    value: 'jiangsu',
-    label: 'Jiangsu',
-    isLeaf: false
-  }]),
+  var _React$useState = React.useState([]),
       _React$useState2 = _slicedToArray(_React$useState, 2),
       cascaderOption = _React$useState2[0],
       setCascaderOption = _React$useState2[1];
@@ -69,7 +61,7 @@ function Index(props) {
           switch (_context.prev = _context.next) {
             case 0:
               server = new MetadataService();
-              _url = pid ? http.url.replace('{pid}', pid) : http.url;
+              _url = pid || pid === '' ? http.url.replace('{pid}', pid) : http.url;
               _context.next = 4;
               return server.GetEnumDataByUrl(_url);
 
@@ -83,14 +75,6 @@ function Index(props) {
 
               return _context.abrupt("return", res.map(function (it) {
                 if (http === null || http === void 0 ? void 0 : http.isCascader) {
-                  if (pid === 'child_1') {
-                    return {
-                      value: it[(http === null || http === void 0 ? void 0 : http.key) || 'id'],
-                      label: it[(http === null || http === void 0 ? void 0 : http.value) || 'name'],
-                      isLeaf: it['isLeaf'] ? it['isLeaf'] : true
-                    };
-                  }
-
                   return {
                     value: it[(http === null || http === void 0 ? void 0 : http.key) || 'id'],
                     label: it[(http === null || http === void 0 ? void 0 : http.value) || 'name'],
@@ -164,7 +148,7 @@ function Index(props) {
             }
 
             _context2.next = 3;
-            return getEnumDataByUrl(deepClone(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.http));
+            return getEnumDataByUrl(deepClone(extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.http), '');
 
           case 3:
             res = _context2.sent;
@@ -225,7 +209,8 @@ function Index(props) {
       return /*#__PURE__*/React.createElement(_Cascader, {
         multiple: extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.isMutiple,
         options: cascaderOption,
-        loadData: loadData
+        loadData: loadData,
+        maxTagCount: 10
       });
     } else {
       var _extraInfo$disabled;
@@ -235,7 +220,7 @@ function Index(props) {
         onSelect: onSelect,
         disabled: (_extraInfo$disabled = extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.disabled) !== null && _extraInfo$disabled !== void 0 ? _extraInfo$disabled : disabled,
         placeholder: extraInfo === null || extraInfo === void 0 ? void 0 : extraInfo.placeholder,
-        options: httpOptions || options,
+        options: httpOptions && httpOptions.length > 0 ? httpOptions : options,
         getPopupContainer: function getPopupContainer(triggerNode) {
           return triggerNode.parentNode;
         },

package/es/framework/graph/index.d.ts

@@ -0,0 +1 @@
+

package/es/index.d.ts

@@ -7,6 +7,7 @@ export { default as JsonView } from './comps/JsonView';
 export { default as JsonEdit } from './comps/JsonEdit';
 export { default as MdEditor } from './comps/MdEdit';
 export { default as Editable } from './comps/Editable';
+export { default as DynamicPorts } from './comps/DynamicPorts';
 export * from './framework/metadata/index';
 export { default as http, addInterceptor } from './framework/http/index';
 export { default as useMemoSubject } from './framework/rxjs-hooks/useMemoSubject';

package/es/index.js

@@ -1,7 +1,7 @@
 /*
  * @Author:wangxian
  * @Date: 2021-09-18 14:15:04
- * @LastEditTime: 2022-05-11 09:02:18
+ * @LastEditTime: 2022-05-23 16:32:32
  */
 import "./theme.css";
 export { default as MetadataEdit } from './comps/MetadataEdit';
@@ -12,6 +12,7 @@ export { default as JsonView } from './comps/JsonView';
 export { default as JsonEdit } from './comps/JsonEdit';
 export { default as MdEditor } from './comps/MdEdit';
 export { default as Editable } from './comps/Editable';
+export { default as DynamicPorts } from './comps/DynamicPorts';
 export * from './framework/metadata/index';
 export { default as http, addInterceptor } from './framework/http/index';
 export { default as useMemoSubject } from './framework/rxjs-hooks/useMemoSubject';

package/package.json

@@ -1,7 +1,7 @@
 {
   "public": true,
   "name": "ronds-metadata",
-  "version": "1.1.4",
+  "version": "1.1.7",
   "scripts": {
     "start": "dumi dev",
     "docs:build": "dumi build",
@@ -31,6 +31,8 @@
     "/es"
   ],
   "dependencies": {
+    "@antv/x6": "^1.32.2",
+    "@antv/x6-react-shape": "^1.6.0",
     "@babel/helper-create-regexp-features-plugin": "^7.12.13",
     "@babel/runtime": "^7.11.2",
     "@popperjs/core": "^2.4.4",

package/es/comps/RzGraph/index.d.ts

@@ -1,2 +0,0 @@
-declare const RzGraph: () => JSX.Element;
-export default RzGraph;

package/es/comps/RzGraph/index.js

@@ -1,7 +0,0 @@
-import React from "react";
-
-var RzGraph = function RzGraph() {
-  return /*#__PURE__*/React.createElement(React.Fragment, null);
-};
-
-export default RzGraph;