strategy-panel 1.0.1 → 1.0.2

package/lib/packages/graph-canvas/graph-model/node/common-node/node-element.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _reactSvg = require("react-svg");
+
+var _ = require("../../..");
+
+var _useObservableState3 = require("../../../../hooks/useObservableState");
+
+require("./node-element.less");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var NodeElement = function NodeElement(props) {
+  var node = props.node,
+      experimentId = props.experimentId;
+  var data = (node === null || node === void 0 ? void 0 : node.getData()) || {};
+  var name = data.name,
+      imgUrl = data.imgUrl,
+      id = data.id,
+      nodeData = data.nodeData;
+  var expGraph = (0, _.useExperimentGraph)(experimentId);
+
+  var _useObservableState = (0, _useObservableState3.useObservableState)(function () {
+    return expGraph.activeNodeInstance$;
+  }),
+      _useObservableState2 = _slicedToArray(_useObservableState, 1),
+      activeNodeInstance = _useObservableState2[0];
+
+  var nodeId = activeNodeInstance && activeNodeInstance.id;
+  var nodeFormData = typeof nodeData === 'string' ? JSON.parse(nodeData) : nodeData;
+  console.log('NodeElement', data);
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('node-element', {
+      selected: !!nodeId && nodeId === id
+    })
+  }, /*#__PURE__*/_react.default.createElement(_reactSvg.ReactSVG, {
+    src: imgUrl,
+    beforeInjection: function beforeInjection(svg) {
+      svg.setAttribute('viewBox', '0 0 30 30');
+    },
+    className: "icon"
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "name"
+  }, (nodeFormData === null || nodeFormData === void 0 ? void 0 : nodeFormData.realName) || name));
+};
+
+var _default = NodeElement;
+exports.default = _default;

package/lib/packages/graph-canvas/graph-model/node/common-node/node-element.less

@@ -0,0 +1,48 @@
+@import "../style.less";
+
+.node-element {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  width: 180px;
+  height: 43px;
+  overflow: hidden;
+  background-color: fade(@node-element-primary-color, 20%);
+  border: 1px solid @node-element-primary-color;
+  border-radius: 4px;
+
+  &.selected,
+  &:hover {
+    background-color: @node-element-primary-color;
+    .icon {
+      svg path {
+        fill: #fff;
+      }
+    }
+    .name {
+      color: #ffffff;
+    }
+  }
+  .icon {
+    width: 20px !important;
+    height: 20px !important;
+    margin-right: 12px !important;
+    svg {
+      width: 20px;
+      height: 20px;
+      path {
+        fill: @node-element-primary-color;
+      }
+    }
+  }
+
+  .name {
+    overflow-x: hidden;
+    color: @node-element-primary-color;
+    //font-size: 12px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    vertical-align: middle;
+  }
+}

package/{es/common/graph-common/node-element/logical-element.d.ts → lib/packages/graph-canvas/graph-model/node/condition-node/condition-element.d.ts}

@@ -1,9 +1,9 @@
-import React from 'react';
-import type { Node } from '@antv/x6';
-import './logical-element.less';
-interface Props {
-    node?: Node;
-    experimentId: string;
-}
-declare const ConditionElement: React.FC<Props>;
-export default ConditionElement;
+import React from 'react';
+import type { Node } from '@antv/x6';
+import './condition-element.less';
+interface Props {
+    node?: Node;
+    experimentId: string;
+}
+declare const ConditionElement: React.FC<Props>;
+export default ConditionElement;

package/lib/packages/graph-canvas/graph-model/node/condition-node/condition-element.js

@@ -0,0 +1,81 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _reactSvg = require("react-svg");
+
+var _ = require("../../..");
+
+var _useObservableState3 = require("../../../../hooks/useObservableState");
+
+var _rhombus = _interopRequireDefault(require("./images/rhombus.svg"));
+
+require("./condition-element.less");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var ConditionElement = function ConditionElement(props) {
+  var node = props.node,
+      experimentId = props.experimentId;
+  var data = (node === null || node === void 0 ? void 0 : node.getData()) || {};
+  var name = data.name,
+      id = data.id,
+      imgUrl = data.imgUrl,
+      nodeData = data.nodeData;
+  var expGraph = (0, _.useExperimentGraph)(experimentId);
+
+  var _useObservableState = (0, _useObservableState3.useObservableState)(function () {
+    return expGraph.activeNodeInstance$;
+  }),
+      _useObservableState2 = _slicedToArray(_useObservableState, 1),
+      activeNodeInstance = _useObservableState2[0];
+
+  var nodeId = activeNodeInstance && activeNodeInstance.id;
+  var nodeFormData = typeof nodeData === 'string' ? JSON.parse(nodeData) : nodeData;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)('node-rhombus-element', {
+      selected: !!nodeId && nodeId === id
+    })
+  }, /*#__PURE__*/_react.default.createElement(_reactSvg.ReactSVG, {
+    src: _rhombus.default,
+    className: (0, _classnames.default)('node-rhombus-element-bg'),
+    beforeInjection: function beforeInjection(svg) {
+      svg.setAttribute('width', '259px');
+      svg.setAttribute('height', '110px'); // svg.setAttribute('viewBox', '0 0 120 800');
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "rhombus-inner"
+  }, /*#__PURE__*/_react.default.createElement(_reactSvg.ReactSVG, {
+    src: imgUrl,
+    className: "icon",
+    beforeInjection: function beforeInjection(svg) {
+      svg.setAttribute('width', '10px');
+      svg.setAttribute('height', '10px');
+      svg.setAttribute('viewBox', '0 0 30 30');
+    }
+  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: "name"
+  }, (nodeFormData === null || nodeFormData === void 0 ? void 0 : nodeFormData.realName) || name)));
+};
+
+var _default = ConditionElement;
+exports.default = _default;

package/lib/packages/graph-canvas/graph-model/node/condition-node/condition-element.less

@@ -0,0 +1,76 @@
+@import "../style.less";
+
+.node-rhombus-element {
+  display: flex;
+  flex-direction: row;
+  box-sizing: border-box;
+  width: @condition-element-width;
+  height: @condition-element-height;
+  overflow: hidden;
+  //
+  //background-color: fade(@node-element-primary-color, 20%);
+  //border: 1px solid @node-element-primary-color;
+
+  & .node-rhombus-element-bg{
+    position: absolute;
+    z-index: -1;
+    div{
+      width: @condition-element-width;
+      height: @condition-element-height;
+      svg path {
+        width: @condition-element-width;
+        height: @condition-element-height;
+        fill: fade(@node-element-primary-color, 20%);
+        stroke: @node-element-primary-color
+      }
+    }
+  }
+
+
+  & .rhombus-inner{
+    display: flex;
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &.selected,
+  &:hover {
+    .node-rhombus-element-bg{
+      div svg path {
+        fill: @node-element-primary-color;
+      }
+    }
+    .icon {
+      div svg path {
+        fill: #fff !important;
+      }
+    }
+    .name {
+      color: #ffffff;
+    }
+  }
+
+  .icon {
+    width: 20px;
+    height: 20px;
+    margin-right: 12px !important;
+    svg {
+      width: 20px;
+      height: 20px;
+      path {
+        fill: @node-element-primary-color !important;
+      }
+    }
+  }
+
+  .name {
+    overflow-x: hidden;
+    color: @node-element-primary-color;
+    //font-size: 12px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    vertical-align: middle;
+    max-width: @condition-element-name-max-width;
+  }
+}

package/lib/packages/graph-canvas/graph-model/node/condition-node/images/rhombus.svg

@@ -0,0 +1,3 @@
+<svg width="100%" height="100%" preserveAspectRatio="none" viewBox="0 0 167 90" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path vector-effect="non-scaling-stroke" d="M2.10786 45L83.5 1.13597L164.892 45L83.5 88.864L2.10786 45Z" fill="#FFECC7" stroke="#FFB200" stroke-width="1"/>
+</svg>

package/{es/common/graph-common/shape/nodes/LogicalNode.d.ts → lib/packages/graph-canvas/graph-model/node/condition-node/index.d.ts}

@@ -1,5 +1,5 @@
-import BaseNode from './BaseNode';
-export default class ConditionJudgment extends BaseNode {
-    getInPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
-    getOutPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
-}
+import BaseNode from "../../../../graph-model/node";
+export default class ConditionJudgment extends BaseNode {
+    getInPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+    getOutPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+}

package/lib/packages/graph-canvas/graph-model/node/condition-node/index.js

@@ -0,0 +1,143 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _x = require("@antv/x6");
+
+var _node = _interopRequireDefault(require("../../../../graph-model/node"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var CONDITION_WIDTH = 260;
+var CONDITION_HEIGHT = 107;
+
+var ConditionJudgment = /*#__PURE__*/function (_BaseNode) {
+  _inherits(ConditionJudgment, _BaseNode);
+
+  var _super = _createSuper(ConditionJudgment);
+
+  function ConditionJudgment() {
+    _classCallCheck(this, ConditionJudgment);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(ConditionJudgment, [{
+    key: "getInPorts",
+    value: function getInPorts() {
+      return this.getPortsByGroup('in');
+    }
+  }, {
+    key: "getOutPorts",
+    value: function getOutPorts() {
+      return this.getPortsByGroup('out');
+    }
+  }]);
+
+  return ConditionJudgment;
+}(_node.default);
+
+exports.default = ConditionJudgment;
+ConditionJudgment.config({
+  width: CONDITION_WIDTH,
+  height: CONDITION_HEIGHT,
+  shape: 'condition-judgement-element',
+  ports: {
+    groups: {
+      in: {
+        position: {
+          name: 'top'
+        },
+        zIndex: 2
+      },
+      out: {
+        position: {
+          name: 'bottom'
+        },
+        zIndex: 2
+      },
+      outLeft: {
+        position: {
+          name: 'left'
+        },
+        zIndex: 2
+      },
+      outRight: {
+        position: {
+          name: 'right'
+        },
+        zIndex: 2
+      }
+    }
+  },
+  attrs: {
+    body: {
+      magnet: false,
+      fill: 'none',
+      stroke: 'none',
+      refWidth: '100%',
+      refHeight: '100%',
+      zIndex: 1
+    }
+  },
+  portMarkup: [{
+    tagName: 'foreignObject',
+    selector: 'fo',
+    attrs: {
+      width: 8,
+      height: 8,
+      x: -4,
+      y: -4,
+      zIndex: 10,
+      // magnet决定是否可交互
+      magnet: 'true'
+    },
+    children: [{
+      ns: _x.Dom.ns.xhtml,
+      tagName: 'body',
+      selector: 'foBody',
+      attrs: {
+        xmlns: _x.Dom.ns.xhtml
+      },
+      style: {
+        width: '100%',
+        height: '100%'
+      },
+      children: [{
+        tagName: 'span',
+        selector: 'content',
+        style: {
+          width: '100%',
+          height: '100%'
+        }
+      }]
+    }]
+  }]
+});
+
+_x.Graph.registerNode('condition-judgement-element', ConditionJudgment);

package/lib/packages/graph-canvas/graph-model/node/index.d.ts

@@ -0,0 +1,5 @@
+import ApplicationNode from './application-node';
+import CommonNode from './common-node';
+import ConditionJudgment from './condition-node';
+import LogicalNode from './logical-node';
+export { ApplicationNode, ConditionJudgment, CommonNode, LogicalNode };

package/lib/packages/graph-canvas/graph-model/node/index.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ApplicationNode", {
+  enumerable: true,
+  get: function get() {
+    return _applicationNode.default;
+  }
+});
+Object.defineProperty(exports, "CommonNode", {
+  enumerable: true,
+  get: function get() {
+    return _commonNode.default;
+  }
+});
+Object.defineProperty(exports, "ConditionJudgment", {
+  enumerable: true,
+  get: function get() {
+    return _conditionNode.default;
+  }
+});
+Object.defineProperty(exports, "LogicalNode", {
+  enumerable: true,
+  get: function get() {
+    return _logicalNode.default;
+  }
+});
+
+var _applicationNode = _interopRequireDefault(require("./application-node"));
+
+var _commonNode = _interopRequireDefault(require("./common-node"));
+
+var _conditionNode = _interopRequireDefault(require("./condition-node"));
+
+var _logicalNode = _interopRequireDefault(require("./logical-node"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/packages/graph-canvas/graph-model/node/logical-node/images/AND.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28px" height="28px" viewBox="0 0 28 28" version="1.1">
+  <title>运算符</title>
+  <g id="全局样式" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="Icons" transform="translate(-506.000000, -1299.000000)" fill="#5B5B5B">
+      <g id="运算符" transform="translate(506.000000, 1299.000000)">
+        <path d="M28,0 L28,28 L0,28 L0,0 L28,0 Z M24.5,5.25 L3.5,5.25 L3.5,24.5 L24.5,24.5 L24.5,5.25 Z M10.1323,7 L12.3103,7.166 L12.1203,8.905 L20.9723,8.905 L20.9723,11.006 L11.8893,11.006 L11.7213,12.522 L20.5243,12.522 L20.5243,12.772 C20.5243,17.563 20.2523,20.279 19.6943,21.075 C19.1143,21.87 17.9543,22.254 16.1463,22.254 C15.6637286,22.254 15.0812388,22.2341633 14.4095362,22.1944898 L14.0663,22.173 L13.8913,22.162 L13.2913,20.126 L13.6533,20.154 C14.7513,20.239 15.4763,20.282 15.8103,20.282 C17.0173,20.282 17.7373,20.036 17.9493,19.552 C18.1196226,19.1707097 18.3199139,18.0533111 18.3417219,14.9110259 L18.3433,14.59 L9.2903,14.59 L10.1323,7 Z M17.612,16.2333 L17.612,18.3343 L7,18.3343 L7,16.2333 L17.612,16.2333 Z M12.25,1.75 L10.5,1.75 L10.5,3.5 L12.25,3.5 L12.25,1.75 Z M8.75,1.75 L7,1.75 L7,3.5 L8.75,3.5 L8.75,1.75 Z M5.25,1.75 L3.5,1.75 L3.5,3.5 L5.25,3.5 L5.25,1.75 Z" id="形状结合"></path>
+      </g>
+    </g>
+  </g>
+</svg>

package/lib/packages/graph-canvas/graph-model/node/logical-node/images/OR.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28px" height="28px" viewBox="0 0 28 28" version="1.1">
+  <title>运算符-或</title>
+  <g id="全局样式" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="Icons" transform="translate(-664.000000, -1299.000000)" fill="#5B5B5B" fill-rule="nonzero">
+      <g id="运算符-或" transform="translate(664.000000, 1299.000000)">
+        <path d="M28,0 L28,28 L0,28 L0,0 L28,0 Z M24.5,5.25 L3.5,5.25 L3.5,24.5 L24.5,24.5 L24.5,5.25 Z M16.143,7 L16.143,8.872 L17.211,8.872 C17.047,8.567 16.863,8.263 16.662,7.965 L16.662,7.965 L16.443,7.641 L18.687,7.278 L18.771,7.438 C19.004,7.886 19.224,8.368 19.424,8.872 L19.424,8.872 L20.975,8.872 L20.975,11.004 L16.165,11.004 C16.204,12.679 16.335,14.151 16.555,15.382 C16.577,15.495 16.598,15.603 16.618,15.707 C17.229,14.528 17.764,13.174 18.214,11.674 L18.214,11.674 L18.301,11.382 L20.225,12.407 L20.164,12.604 C19.453,14.882 18.556,16.853 17.496,18.465 L17.496,18.465 L17.714,18.877 C18.281,19.775 18.651,19.912 18.821,19.912 C18.825,19.889 19.067,19.63 19.309,17.682 L19.309,17.682 L19.359,17.282 L21.259,18.543 L21.226,18.707 C20.747,21.092 20.023,22.252 19.013,22.252 C18.079,22.24 17.195,21.684 16.381,20.6 C16.283,20.47 16.194,20.346 16.114,20.226 C15.354,21.059 14.485,21.776 13.527,22.36 L13.527,22.36 L13.319,22.486 L12.118,20.622 L12.343,20.49 C12.858,20.187 13.348,19.832 13.811,19.426 L13.811,19.426 L13.752,19.443 C11.562,20.051 9.207,20.57 6.75,20.984 L6.75,20.984 L6.521,21.023 L6,18.858 L6.28,18.826 C8.696,18.545 11.132,18.06 13.522,17.387 L13.522,17.387 L6.859,17.387 L6.859,11.752 L13.567,11.752 L13.567,17.375 C13.583,17.37 13.6,17.366 13.617,17.361 L13.617,17.361 L13.935,17.27 L13.935,19.316 C14.339,18.95 14.722,18.545 15.08,18.102 C14.884,17.59 14.715,17.009 14.577,16.376 C14.217,14.821 14.012,13.013 13.967,11.004 L13.967,11.004 L6.123,11.004 L6.123,8.872 L13.963,8.872 L13.963,7 L16.143,7 Z M11.419,13.788 L9.023,13.788 L9.023,15.384 L11.419,15.384 L11.419,13.788 Z M12.25,1.75 L10.5,1.75 L10.5,3.5 L12.25,3.5 L12.25,1.75 Z M8.75,1.75 L7,1.75 L7,3.5 L8.75,3.5 L8.75,1.75 Z M5.25,1.75 L3.5,1.75 L3.5,3.5 L5.25,3.5 L5.25,1.75 Z" id="形状结合"></path>
+      </g>
+    </g>
+  </g>
+</svg>

package/lib/packages/graph-canvas/graph-model/node/logical-node/images/XOR.svg

@@ -0,0 +1,11 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28px" height="28px" viewBox="0 0 28 28" version="1.1">
+  <title>运算符-异</title>
+  <g id="全局样式" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <g id="Icons" transform="translate(-664.000000, -1343.000000)" fill="#5B5B5B" fill-rule="nonzero">
+      <g id="运算符-异" transform="translate(664.000000, 1343.000000)">
+        <path d="M28,0 L28,28 L0,28 L0,0 L28,0 Z M24.5,5.25 L3.5,5.25 L3.5,24.5 L24.5,24.5 L24.5,5.25 Z M18.868,8 L18.868,12.627 L9.748,12.627 L9.748,13.082 C9.748,13.424 9.876,13.551 10.218,13.551 L10.218,13.551 L18.506,13.551 C18.698,13.533 18.735,13.459 18.747,13.434 C18.763,13.403 18.828,13.244 18.914,12.416 L18.914,12.416 L18.946,12.106 L20.94,12.764 L20.914,12.968 C20.814,13.755 20.704,14.289 20.578,14.599 C20.349,15.195 19.828,15.518 19.03,15.555 L19.03,15.555 L17.444,15.555 L17.444,17.023 L21.252,17.023 L21.252,19.044 L17.444,19.044 L17.444,22.755 L15.28,22.755 L15.28,19.044 L11.786,19.044 C11.265,20.875 10.04,22.14 8.141,22.806 L8.141,22.806 L7.947,22.874 L6.811,20.939 L7.131,20.855 C8.381,20.53 9.196,19.935 9.611,19.044 L9.611,19.044 L6,19.044 L6,17.023 L9.939,17.023 L9.955,15.555 L9.546,15.555 C7.938,15.555 7.6,14.567 7.6,13.738 L7.6,13.738 L7.6,8 L18.868,8 Z M15.28,15.555 L12.116,15.555 L12.116,15.769 C12.116,16.18 12.109,16.598 12.094,17.023 L12.094,17.023 L15.28,17.023 L15.28,15.555 Z M16.752,10.003 L9.748,10.003 L9.748,10.655 L16.752,10.655 L16.752,10.003 Z M12.25,1.75 L10.5,1.75 L10.5,3.5 L12.25,3.5 L12.25,1.75 Z M8.75,1.75 L7,1.75 L7,3.5 L8.75,3.5 L8.75,1.75 Z M5.25,1.75 L3.5,1.75 L3.5,3.5 L5.25,3.5 L5.25,1.75 Z" id="形状结合"></path>
+      </g>
+    </g>
+  </g>
+</svg>

package/lib/packages/graph-canvas/graph-model/node/logical-node/images/locking.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24.744" height="31.16" viewBox="0 0 24.744 31.16">
+  <path fill="#595959" d="M46.413,18.491V16.044a5.769,5.769,0,0,0-1.6-4.286,5.734,5.734,0,0,0-4.189-1.57,5.251,5.251,0,0,0-3.955,1.6,5.925,5.925,0,0,0-1.505,4.255v2.446H33.975V15.118a5.507,5.507,0,0,1,.493-2.34,6.22,6.22,0,0,1,1.4-1.949,6.7,6.7,0,0,1,2.141-1.338A7.431,7.431,0,0,1,40.755,9a6.645,6.645,0,0,1,2.5.487,7.207,7.207,0,0,1,2.167,1.356,6.658,6.658,0,0,1,1.488,1.974,5.076,5.076,0,0,1,.524,2.3v3.373Z" transform="translate(-28.35 -7.51)"></path>
+  <path fill="#595959" d="M33.245,0a8.872,8.872,0,0,0-3.291.6A8.147,8.147,0,0,0,27.34,2.233,7.665,7.665,0,0,0,25.6,4.648a7.026,7.026,0,0,0-.628,2.961v4.863h4.168V8.534a4.48,4.48,0,0,1,1.092-3.225,3.8,3.8,0,0,1,2.878-1.141,4.282,4.282,0,0,1,3.143,1.141,4.325,4.325,0,0,1,1.158,3.225v3.936h4V7.608a6.6,6.6,0,0,0-.678-2.961,8.107,8.107,0,0,0-1.819-2.415A8.656,8.656,0,0,0,36.3.6a8.087,8.087,0,0,0-3.06-.6" transform="translate(-20.84)"></path>
+  <path fill="#595959" d="M21.764,90.293v9.458a1.457,1.457,0,0,1-.1.554,1.351,1.351,0,0,1-.266.429,1,1,0,0,1-.332.231,1.048,1.048,0,0,1-.427.074H3.937a.962.962,0,0,1-.388-.064.936.936,0,0,1-.3-.2.913.913,0,0,1-.186-.307,1.315,1.315,0,0,1-.081-.481V90.293H21.764m.8-2.98H2.15a2.047,2.047,0,0,0-1.522.645A2.128,2.128,0,0,0,0,89.5V99.982a4.273,4.273,0,0,0,.281,1.555,3.846,3.846,0,0,0,3.655,2.481H20.642a3.945,3.945,0,0,0,2.928-1.24,4.311,4.311,0,0,0,.86-1.356,4.412,4.412,0,0,0,.314-1.67V89.5a2.2,2.2,0,0,0-2.183-2.183" transform="translate(0 -72.858)"></path>
+</svg>

package/lib/packages/graph-canvas/graph-model/node/logical-node/images/unlock.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="33" height="33" viewBox="0 0 33 33">
+  <g transform="translate(-1.496 -1.733)">
+    <path fill="#595959" d="M30.765,26.483V35.9a1.557,1.557,0,0,1-.1.582,1,1,0,0,1-.579.612,1.028,1.028,0,0,1-.419.072h-16.7a1.118,1.118,0,0,1-.431-.068.878.878,0,0,1-.293-.194.756.756,0,0,1-.166-.266,1.3,1.3,0,0,1-.08-.473V26.483H30.765M33.822,9a8.852,8.852,0,0,0-3.284.594,8.126,8.126,0,0,0-2.608,1.634A7.593,7.593,0,0,0,26.2,13.655a7.123,7.123,0,0,0-.627,2.971v4.951h4.159V17.55a4.529,4.529,0,0,1,1.089-3.235A3.763,3.763,0,0,1,33.69,13.16a4.294,4.294,0,0,1,3.152,1.155,4.337,4.337,0,0,1,1.172,3.235v3.961h3.994V16.626a6.551,6.551,0,0,0-.693-2.971,8.251,8.251,0,0,0-1.832-2.426,8.633,8.633,0,0,0-2.608-1.634A8.069,8.069,0,0,0,33.822,9M31.578,23.492H11.146A2.17,2.17,0,0,0,9,25.67v10.5a4.269,4.269,0,0,0,.281,1.551,3.741,3.741,0,0,0,.809,1.271,3.853,3.853,0,0,0,1.254.858,4.039,4.039,0,0,0,1.617.314h16.7a3.98,3.98,0,0,0,1.634-.33,3.987,3.987,0,0,0,2.145-2.244,4.535,4.535,0,0,0,.313-1.683V25.67a2.142,2.142,0,0,0-2.179-2.179" transform="translate(-7.504 -7.268)"></path>
+  </g>
+</svg>

package/lib/packages/graph-canvas/graph-model/node/logical-node/index.d.ts

@@ -0,0 +1,6 @@
+import BaseNode from "../../../../graph-model/node";
+export declare const LOGICAL_EDG = 50;
+export default class LogicalNode extends BaseNode {
+    getInPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+    getOutPorts(): import("@antv/x6/lib/model/port").PortManager.PortMetadata[];
+}