@riil-frontend/component-topology 10.0.58 → 11.0.0

package/es/core/components/TopoView/topoView.js

@@ -4,6 +4,7 @@ import React, { useState, useEffect, useRef, useCallback } from 'react';
 import PropTypes from 'prop-types';
 import classnames from 'classnames';
 import TopoGraph, { TopoEvent } from '@riil-frontend/component-topology-graph';
+import PortalContainer from '@riil-frontend/component-topology-graph/es/components/PortalContainer';
 import rlog from '@riil-frontend/component-topology-utils/es/rlog'; // 通用
 
 import showMessage from "../../utils/showMessage";
@@ -25,6 +26,7 @@ import PropertyView from "../../editor/components/settings/PropertyView";
 import HistoryManager from "../../models/HistoryManager";
 import editorStyles from "./editor.module.scss";
 import basicIcons from "../../common/icons/basicIcons";
+import HelpIcon from "../../editor/components/BottomFloatTool/HelpIcon";
 
 var Topology = function Topology(props) {
   var _classnames;
@@ -69,6 +71,8 @@ var Topology = function Topology(props) {
       tData = _useState[0],
       setTData = _useState[1];
 
+  var helpIconPortalRef = useRef(); // 编辑模式帮助提示图标Portal
+
   useRouterAdapter(props); // 编辑模式----
 
   var topoEdit = useTopoEdit({
@@ -233,7 +237,11 @@ var Topology = function Topology(props) {
       topo: topo
     }, props), /*#__PURE__*/React.createElement(TopoGraph, _extends({}, graphViewProps, {
       createHtTopoProps: _extends({}, graphViewProps.createHtTopoProps, {
-        editor: _extends({}, ((_graphViewProps$creat = graphViewProps.createHtTopoProps) === null || _graphViewProps$creat === void 0 ? void 0 : _graphViewProps$creat.editor) || {})
+        editor: _extends({}, ((_graphViewProps$creat = graphViewProps.createHtTopoProps) === null || _graphViewProps$creat === void 0 ? void 0 : _graphViewProps$creat.editor) || {}, {
+          createHelpTipIcon: function createHelpTipIcon(view) {
+            view.setContent(helpIconPortalRef.current);
+          }
+        })
       }),
       data: tData,
       defaultEnterEditMode: defaultEnterEditMode,
@@ -281,14 +289,18 @@ var Topology = function Topology(props) {
     topo: topo,
     viewerProps: viewerProps,
     topoContext: topoContext
-  }), isEditMode && /*#__PURE__*/React.createElement(EditorPlugin, {
+  }), isEditMode && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorPlugin, {
     topo: topo,
     topoEdit: topoEdit,
     topoContext: {
       urlParams: urlParams
     },
     editorProps: editorProps
-  }));
+  }), /*#__PURE__*/React.createElement(PortalContainer, {
+    ref: helpIconPortalRef
+  }, /*#__PURE__*/React.createElement(HelpIcon, {
+    topo: topo
+  }))));
 };
 
 Topology.propTypes = {

package/es/core/editor/components/BottomFloatTool/HelpIcon.js

@@ -0,0 +1,8 @@
+import React from 'react';
+
+function HelpIcon(props) {
+  var topo = props.topo;
+  return /*#__PURE__*/React.createElement("div", null, "HelpIcon");
+}
+
+export default HelpIcon;

package/es/core/models/TopoApp.js

@@ -24,7 +24,7 @@ import ElementTagTipConfig from "./tagstips/ElementTagTipConfig";
 import SelectionModel from "./SelectionModel";
 import CiCache from "./cache/CiCache"; // eslint-disable-next-line no-undef
 
-var version = typeof "10.0.58" === 'string' ? "10.0.58" : null;
+var version = typeof "11.0.0" === 'string' ? "11.0.0" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/es/core/utils/showGraphManageStatusUtil.js

@@ -27,6 +27,8 @@ export function showManageStatus(options) {
 
       if (type === 'node') {
         try {
+          element.a('isMonitoring', showUnMoniteStatus); // 用于缩小色块时显示未监控颜色
+
           if (showUnMoniteStatus) {
             topo.getHtTopo().setNodeStyleIcon(element, {
               styleIcon: 'unMoniter',

package/lib/core/components/TopoView/topoView.js

@@ -17,6 +17,8 @@ var _classnames2 = _interopRequireDefault(require("classnames"));
 
 var _componentTopologyGraph = _interopRequireWildcard(require("@riil-frontend/component-topology-graph"));
 
+var _PortalContainer = _interopRequireDefault(require("@riil-frontend/component-topology-graph/es/components/PortalContainer"));
+
 var _rlog = _interopRequireDefault(require("@riil-frontend/component-topology-utils/es/rlog"));
 
 var _showMessage = _interopRequireDefault(require("../../utils/showMessage"));
@@ -53,6 +55,8 @@ var _editorModule = _interopRequireDefault(require("./editor.module.scss"));
 
 var _basicIcons = _interopRequireDefault(require("../../common/icons/basicIcons"));
 
+var _HelpIcon = _interopRequireDefault(require("../../editor/components/BottomFloatTool/HelpIcon"));
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -103,6 +107,8 @@ var Topology = function Topology(props) {
       tData = _useState[0],
       setTData = _useState[1];
 
+  var helpIconPortalRef = (0, _react.useRef)(); // 编辑模式帮助提示图标Portal
+
   (0, _useRouterAdapter["default"])(props); // 编辑模式----
 
   var topoEdit = (0, _useTopoEdit["default"])({
@@ -275,7 +281,11 @@ var Topology = function Topology(props) {
       topo: topo
     }, props), /*#__PURE__*/_react["default"].createElement(_componentTopologyGraph["default"], (0, _extends2["default"])({}, graphViewProps, {
       createHtTopoProps: (0, _extends2["default"])({}, graphViewProps.createHtTopoProps, {
-        editor: (0, _extends2["default"])({}, ((_graphViewProps$creat = graphViewProps.createHtTopoProps) === null || _graphViewProps$creat === void 0 ? void 0 : _graphViewProps$creat.editor) || {})
+        editor: (0, _extends2["default"])({}, ((_graphViewProps$creat = graphViewProps.createHtTopoProps) === null || _graphViewProps$creat === void 0 ? void 0 : _graphViewProps$creat.editor) || {}, {
+          createHelpTipIcon: function createHelpTipIcon(view) {
+            view.setContent(helpIconPortalRef.current);
+          }
+        })
       }),
       data: tData,
       defaultEnterEditMode: defaultEnterEditMode,
@@ -323,14 +333,18 @@ var Topology = function Topology(props) {
     topo: topo,
     viewerProps: viewerProps,
     topoContext: topoContext
-  }), isEditMode && /*#__PURE__*/_react["default"].createElement(_EditorPlugin["default"], {
+  }), isEditMode && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_EditorPlugin["default"], {
     topo: topo,
     topoEdit: topoEdit,
     topoContext: {
       urlParams: urlParams
     },
     editorProps: editorProps
-  }));
+  }), /*#__PURE__*/_react["default"].createElement(_PortalContainer["default"], {
+    ref: helpIconPortalRef
+  }, /*#__PURE__*/_react["default"].createElement(_HelpIcon["default"], {
+    topo: topo
+  }))));
 };
 
 Topology.propTypes = {

package/lib/core/editor/components/BottomFloatTool/HelpIcon.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+function HelpIcon(props) {
+  var topo = props.topo;
+  return /*#__PURE__*/_react["default"].createElement("div", null, "HelpIcon");
+}
+
+var _default = HelpIcon;
+exports["default"] = _default;

package/lib/core/models/TopoApp.js

@@ -56,7 +56,7 @@ var _SelectionModel = _interopRequireDefault(require("./SelectionModel"));
 var _CiCache = _interopRequireDefault(require("./cache/CiCache"));
 
 // eslint-disable-next-line no-undef
-var version = typeof "10.0.58" === 'string' ? "10.0.58" : null;
+var version = typeof "11.0.0" === 'string' ? "11.0.0" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

package/lib/core/utils/showGraphManageStatusUtil.js

@@ -37,6 +37,8 @@ function showManageStatus(options) {
 
       if (type === 'node') {
         try {
+          element.a('isMonitoring', showUnMoniteStatus); // 用于缩小色块时显示未监控颜色
+
           if (showUnMoniteStatus) {
             topo.getHtTopo().setNodeStyleIcon(element, {
               styleIcon: 'unMoniter',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@riil-frontend/component-topology",
-  "version": "10.0.58",
+  "version": "11.0.0",
   "description": "拓扑",
   "scripts": {
     "start": "build-scripts start",
@@ -116,6 +116,6 @@
     "access": "public"
   },
   "license": "MIT",
-  "homepage": "https://unpkg.com/@riil-frontend/component-topology@10.0.58/build/index.html",
+  "homepage": "https://unpkg.com/@riil-frontend/component-topology@11.0.0/build/index.html",
   "gitHead": "2da19ffccbb7ca60a8acf396e39f542c68bb33f5"
 }