@riil-frontend/component-topology 2.9.0 → 2.10.0-alpha-5

package/es/components/LayoutDirectionSelect/Item.module.scss

@@ -4,6 +4,5 @@
 
 .text {
   font-size: 12px;
-  margin-top: 15px;
-  padding-bottom: 18px;
+  margin-top: 14px;
 }

package/es/components/LayoutDirectionSelect/LayoutDirectionSelect.js

@@ -35,7 +35,7 @@ export default function LayoutDirectionSelect(props) {
     });
   });
   return /*#__PURE__*/React.createElement(TagImageSelect, {
-    data: layoutOptions,
+    dataSource: layoutOptions,
     boxProps: {
       spacing: 12
     },

package/es/components/LayoutDirectionSelect/LayoutDirectionSelect.module.scss

@@ -1,4 +1,5 @@
 .layoutSelectItem {
   width: 120px;
   height: 136px !important;
+  padding-top: 16px;
 }

package/es/components/TagImageSelect/index.js

@@ -1,25 +1,22 @@
 import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
+var _excluded = ["dataSource", "size", "boxProps", "tagProps", "itemProps", "ItemComponent"];
 import React from 'react';
 import TemplateButton from "../TemplateButton";
 import TagSelect from "../TagSelect";
 
 var TagImageSelect = function TagImageSelect(props) {
-  var _data$filter$;
-
-  var _props$data = props.data,
-      data = _props$data === void 0 ? [] : _props$data,
+  var dataSource = props.dataSource,
       size = props.size,
       boxProps = props.boxProps,
       tagProps = props.tagProps,
       itemProps = props.itemProps,
-      ItemComponent = props.ItemComponent;
-  var value = (_data$filter$ = data.filter(function (item) {
-    return item.selected;
-  })[0]) === null || _data$filter$ === void 0 ? void 0 : _data$filter$.id;
+      ItemComponent = props.ItemComponent,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+
   var Item = ItemComponent || TemplateButton;
-  return /*#__PURE__*/React.createElement(TagSelect, {
-    defaultValue: value,
-    dataSource: data.map(function (item) {
+  return /*#__PURE__*/React.createElement(TagSelect, _extends({}, otherProps, {
+    dataSource: dataSource.map(function (item) {
       return {
         key: item.id,
         content: /*#__PURE__*/React.createElement(Item, _extends({
@@ -31,7 +28,7 @@ var TagImageSelect = function TagImageSelect(props) {
     }),
     boxProps: boxProps,
     tagProps: tagProps
-  });
+  }));
 };
 
 export default TagImageSelect;

package/es/components/TemplateButton/Icon.js

@@ -4,13 +4,14 @@ import Icons from "./assets";
 var Icon = function Icon(props) {
   var _props$alt = props.alt,
       alt = _props$alt === void 0 ? '' : _props$alt,
+      img = props.img,
       type = props.type,
       className = props.className,
       rotate = props.rotate;
   var style = rotate ? {
     transform: "rotate(" + rotate + "deg)"
   } : null;
-  var src = Icons[type];
+  var src = img || Icons[type];
   return /*#__PURE__*/React.createElement("img", {
     className: className,
     style: style,

package/es/components/TemplateButton/assets/index.js

@@ -1,12 +1,8 @@
-import IconTplBlank from "./topo_tpl_blank.svg";
-import IconTplRegion from "./topo_tpl_region.svg"; // import IconTplLayeredRing from './topo_tpl_layered_ring.svg';
-
+// import IconTplLayeredRing from './topo_tpl_layered_ring.svg';
 import IconLayoutCircular from "./topo_layout_circular.svg";
 import IconLayoutHierarchical from "./topo_layout_hierarchical.svg";
 import IconLayoutToward from "./topo_layout_toward.svg";
 export default {
-  'tpl_blank': IconTplBlank,
-  'tpl_region': IconTplRegion,
   // 'tpl_layered_ring': IconTplLayeredRing,
   'layout_circular': IconLayoutCircular,
   'layout_hierarchical': IconLayoutHierarchical,

package/es/components/TemplateButton/index.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
-var _excluded = ["className", "children", "icon", "id", "selected", "onSelect", "iconClassName", "textClassName"];
+var _excluded = ["className", "children", "icon", "img", "iconClassName", "textClassName"];
 import React from 'react';
 import classnames from 'classnames';
 import Icon from "./Icon";
@@ -10,29 +10,22 @@ var TemplateButton = function TemplateButton(props) {
   var className = props.className,
       children = props.children,
       icon = props.icon,
-      id = props.id,
-      selected = props.selected,
-      _props$onSelect = props.onSelect,
-      onSelect = _props$onSelect === void 0 ? function () {} : _props$onSelect,
+      img = props.img,
       iconClassName = props.iconClassName,
       textClassName = props.textClassName,
       rest = _objectWithoutPropertiesLoose(props, _excluded);
 
-  var handleClick = function handleClick() {
-    return onSelect(id);
-  };
-
   return /*#__PURE__*/React.createElement("div", {
-    className: classnames(styles.card, className),
-    onClick: handleClick
+    className: classnames(styles.card, className)
   }, /*#__PURE__*/React.createElement("div", {
     className: styles.iconWrapper
   }, /*#__PURE__*/React.createElement(Icon, _extends({
     className: classnames(styles.icon, iconClassName),
+    img: img,
     type: icon
   }, rest))), /*#__PURE__*/React.createElement("div", {
     className: classnames(styles.text, textClassName)
-  }, children));
+  }, /*#__PURE__*/React.createElement("span", null, children)));
 };
 
 export default TemplateButton;

package/es/components/TemplateButton/index.module.scss

@@ -10,7 +10,6 @@
 
 .iconWrapper {
   display: flex;
-  flex: 1;
   justify-content: center;
   align-items: center;
 }
@@ -20,9 +19,10 @@
 }
 
 .text {
+  height: 20px;
+  line-height: 20px;
   font-size: 18px;
-  margin-top: 16px;
-  padding-bottom: 24px;
+  margin-top: 14px;
   color: $color-text1-3;
   outline: none;
 }

package/es/core/models/cache/CiTyeCache.js

@@ -30,7 +30,7 @@ var CiTyeCache = /*#__PURE__*/function () {
             case 5:
               _context.prev = 5;
               _context.t0 = _context["catch"](0);
-              console.error('查询Ci模型异常');
+              console.error('查询Ci模型异常', _context.t0);
 
             case 8:
               return _context.abrupt("return", this.cache);

package/es/core/models/utils/linkUtils.js

@@ -7,8 +7,8 @@ export function mergeLinksData(links, relationDetails) {
   return links.map(function (link) {
     var relation = findItem(relationDetails, 'id', link.id);
     return _extends({}, link, {
-      ciType: relation.typeCode,
-      name: relation.attributes.name,
+      ciType: relation === null || relation === void 0 ? void 0 : relation.typeCode,
+      name: relation === null || relation === void 0 ? void 0 : relation.attributes.name,
       detail: relation
     });
   });

package/es/core/viewer/components/titlebar/ViewerTools.js

@@ -6,10 +6,14 @@ import _extends from "@babel/runtime/helpers/extends";
 import React, { useState, useEffect, useRef, useCallback } from 'react';
 import styles from "../../../components/titlebar/TitleBar.module.scss";
 import EditButton from "./widgets/EditButton";
+import useSetDefaultTopo from "./useSetDefaultTopo";
 export default function ViewerTools(props) {
   var topo = props.topo,
       _props$showEditButton = props.showEditButton,
       showEditButton = _props$showEditButton === void 0 ? true : _props$showEditButton;
+  var setDefaultTopo = useSetDefaultTopo({
+    topo: topo
+  });
   return /*#__PURE__*/React.createElement("div", null, showEditButton && /*#__PURE__*/React.createElement(EditButton, _extends({
     topo: topo
   }, props)), /*#__PURE__*/React.createElement(_Dropdown, {
@@ -19,7 +23,7 @@ export default function ViewerTools(props) {
       type: "ellipsis-vertical"
     })),
     triggerType: "click"
-  }, /*#__PURE__*/React.createElement(_Menu, null, /*#__PURE__*/React.createElement(_Menu.Item, {
+  }, /*#__PURE__*/React.createElement(_Menu, null, setDefaultTopo.renderMenuItem(), /*#__PURE__*/React.createElement(_Menu.Item, {
     onClick: function onClick() {
       topo.exportImage();
     }

package/es/core/viewer/components/titlebar/useSetDefaultTopo.js

@@ -0,0 +1,30 @@
+import _Menu from "@alifd/next/lib/menu";
+import React from 'react';
+import { findNodeById } from "../../../../utils/tree";
+export default function useSetDefaultTopo(props) {
+  var _findNodeById;
+
+  var topo = props.topo;
+  var store = topo.store;
+  var functionAuthState = store.useModelState('functionAuth');
+  var topoModState = store.useModelState('topoMod');
+
+  var _store$useModel = store.useModel('topoTreeMod'),
+      topoTreeState = _store$useModel[0],
+      topoTreeDispatchers = _store$useModel[1];
+
+  var isDefault = (_findNodeById = findNodeById(topoTreeState.treeData, topoModState.topoId)) === null || _findNodeById === void 0 ? void 0 : _findNodeById.showDefault;
+  var showButton = !!functionAuthState.permissions.manageNavTree && !isDefault;
+
+  var setDefault = function setDefault() {
+    topoTreeDispatchers.setDefTopoOnTree(topoModState.topoId);
+  };
+
+  return {
+    renderMenuItem: function renderMenuItem() {
+      return showButton && /*#__PURE__*/React.createElement(_Menu.Item, {
+        onClick: setDefault
+      }, "\u8BBE\u4E3A\u9ED8\u8BA4\u62D3\u6251");
+    }
+  };
+}

package/es/models/topoCreateMod.js

@@ -54,6 +54,7 @@ var regionTplState = {
 };
 
 var initialState = _extends({
+  viewGroup: undefined,
   topo: [],
   // 拓扑结构（点线）
   elements: {
@@ -268,7 +269,7 @@ export default function (topoApp) {
           var _this = this;
 
           return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-            var data, groupTopo, resources, groups;
+            var data, isViewGroup, parseGroup, viewGroup, resources, groups;
             return _regeneratorRuntime.wrap(function _callee$(_context) {
               while (1) {
                 switch (_context.prev = _context.next) {
@@ -287,15 +288,13 @@ export default function (topoApp) {
                     return _context.abrupt("return");
 
                   case 5:
-                    // 视图
-                    groupTopo = data.findIndex(function (item) {
+                    isViewGroup = function isViewGroup(item) {
                       var _item$topoGroup;
 
                       return ((_item$topoGroup = item.topoGroup) === null || _item$topoGroup === void 0 ? void 0 : _item$topoGroup.parentId) === TOPO_PARENT_ID;
-                    });
-                    resources = conditionToRes(groupTopo >= 0 ? data[groupTopo].condition : {}); // 容器
+                    };
 
-                    groups = removeFromArray(data, groupTopo).map(function (item) {
+                    parseGroup = function parseGroup(item) {
                       var _item$topoGroup2 = item.topoGroup,
                           topoGroup = _item$topoGroup2 === void 0 ? {} : _item$topoGroup2,
                           condition = item.condition;
@@ -315,14 +314,23 @@ export default function (topoApp) {
                         expanded: groupStyles.expanded || false,
                         resources: conditionToRes(condition)
                       };
-                    });
+                    }; // 视图
+
+
+                    viewGroup = data.filter(isViewGroup).map(parseGroup)[0];
+                    resources = viewGroup ? viewGroup.resources : {}; // 容器
+
+                    groups = data.filter(function (item) {
+                      return !isViewGroup(item);
+                    }).map(parseGroup);
 
                     _this.update({
+                      viewGroup: viewGroup,
                       resources: resources,
                       groups: groups
                     });
 
-                  case 9:
+                  case 11:
                   case "end":
                     return _context.stop();
                 }
@@ -437,7 +445,8 @@ export default function (topoApp) {
         },
         saveTopo: function saveTopo(data, state) {
           return _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4() {
-            var topoId, template, layout, global, resources, groups, serialize, layoutId, conditions, groupInfo;
+            var topoId, template, layout, global, resources, groups, serialize, layoutId, _state$topoCreateMod$, groupInfo, viewGroupId, conditions;
+
             return _regeneratorRuntime.wrap(function _callee4$(_context4) {
               while (1) {
                 switch (_context4.prev = _context4.next) {
@@ -477,21 +486,38 @@ export default function (topoApp) {
 
                   case 11:
                     if (!(resources || groups)) {
-                      _context4.next = 16;
+                      _context4.next = 19;
                       break;
                     }
 
+                    groupInfo = [];
+
+                    if (isAvailableArray(groups)) {
+                      groupInfo = groups.map(function (group) {
+                        return _extends({}, group, {
+                          layout: getLayoutId(group.layout),
+                          resources: resToConditions(group.resources, true)
+                        });
+                      });
+                    } // 视图
+
+
+                    viewGroupId = (_state$topoCreateMod$ = state.topoCreateMod.viewGroup) === null || _state$topoCreateMod$ === void 0 ? void 0 : _state$topoCreateMod$.id;
                     conditions = resToConditions(resources, true);
-                    groupInfo = isAvailableArray(groups) && groups.map(function (group) {
-                      return _extends({}, group, {
-                        layout: getLayoutId(group.layout),
-                        resources: resToConditions(group.resources, true)
+
+                    if (conditions) {
+                      groupInfo.push({
+                        id: viewGroupId,
+                        parentId: TOPO_PARENT_ID,
+                        order: 100,
+                        resources: conditions
                       });
-                    });
-                    _context4.next = 16;
-                    return topoService.bindResourceToTopo(topoId, conditions, groupInfo);
+                    }
 
-                  case 16:
+                    _context4.next = 19;
+                    return topoService.bindResourceToTopo(topoId, null, groupInfo);
+
+                  case 19:
                   case "end":
                     return _context4.stop();
                 }

package/es/models/topoMod.js

@@ -21,6 +21,7 @@ export default function (topoApp) {
       topoLoadError: false,
       viewState: 'view',
       // view, create, 2种模式
+      id: undefined,
       topoId: '',
       topoName: '',
       topoData: null,
@@ -35,9 +36,9 @@ export default function (topoApp) {
       topoAlarmIsOpen: false,
       // 拓扑通道是否打开
       alarmData: null,
-      // 概览抽屉中告警列表相关数据
+      // 概览抽屉中告警列表相关数据 TODO 抽取
       currentCiInfo: null,
-      // 概览抽屉当前CI元数据
+      // 概览抽屉当前CI元数据 TODO 抽取
       resAndMetrics: {
         res: [],
         metrics: [],

package/es/utils/tree.js

@@ -93,6 +93,11 @@ export function findNodeById(tree, id) {
 
 export function findParentIdsById(tree, id) {
   var node = findNodeById(tree, id);
+
+  if (!node) {
+    return [];
+  }
+
   var parentId = "" + node.parentId;
 
   if (parentId === '-1') {

package/lib/components/LayoutDirectionSelect/Item.module.scss

@@ -4,6 +4,5 @@
 
 .text {
   font-size: 12px;
-  margin-top: 15px;
-  padding-bottom: 18px;
+  margin-top: 14px;
 }

package/lib/components/LayoutDirectionSelect/LayoutDirectionSelect.js

@@ -50,7 +50,7 @@ function LayoutDirectionSelect(props) {
     });
   });
   return /*#__PURE__*/_react["default"].createElement(_TagImageSelect["default"], {
-    data: layoutOptions,
+    dataSource: layoutOptions,
     boxProps: {
       spacing: 12
     },

package/lib/components/LayoutDirectionSelect/LayoutDirectionSelect.module.scss

@@ -1,4 +1,5 @@
 .layoutSelectItem {
   width: 120px;
   height: 136px !important;
+  padding-top: 16px;
 }

package/lib/components/TagImageSelect/index.js

@@ -7,29 +7,27 @@ exports["default"] = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+
 var _react = _interopRequireDefault(require("react"));
 
 var _TemplateButton = _interopRequireDefault(require("../TemplateButton"));
 
 var _TagSelect = _interopRequireDefault(require("../TagSelect"));
 
-var TagImageSelect = function TagImageSelect(props) {
-  var _data$filter$;
+var _excluded = ["dataSource", "size", "boxProps", "tagProps", "itemProps", "ItemComponent"];
 
-  var _props$data = props.data,
-      data = _props$data === void 0 ? [] : _props$data,
+var TagImageSelect = function TagImageSelect(props) {
+  var dataSource = props.dataSource,
       size = props.size,
       boxProps = props.boxProps,
       tagProps = props.tagProps,
       itemProps = props.itemProps,
-      ItemComponent = props.ItemComponent;
-  var value = (_data$filter$ = data.filter(function (item) {
-    return item.selected;
-  })[0]) === null || _data$filter$ === void 0 ? void 0 : _data$filter$.id;
+      ItemComponent = props.ItemComponent,
+      otherProps = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
   var Item = ItemComponent || _TemplateButton["default"];
-  return /*#__PURE__*/_react["default"].createElement(_TagSelect["default"], {
-    defaultValue: value,
-    dataSource: data.map(function (item) {
+  return /*#__PURE__*/_react["default"].createElement(_TagSelect["default"], (0, _extends2["default"])({}, otherProps, {
+    dataSource: dataSource.map(function (item) {
       return {
         key: item.id,
         content: /*#__PURE__*/_react["default"].createElement(Item, (0, _extends2["default"])({
@@ -41,7 +39,7 @@ var TagImageSelect = function TagImageSelect(props) {
     }),
     boxProps: boxProps,
     tagProps: tagProps
-  });
+  }));
 };
 
 var _default = TagImageSelect;

package/lib/components/TemplateButton/Icon.js

@@ -12,13 +12,14 @@ var _assets = _interopRequireDefault(require("./assets"));
 var Icon = function Icon(props) {
   var _props$alt = props.alt,
       alt = _props$alt === void 0 ? '' : _props$alt,
+      img = props.img,
       type = props.type,
       className = props.className,
       rotate = props.rotate;
   var style = rotate ? {
     transform: "rotate(" + rotate + "deg)"
   } : null;
-  var src = _assets["default"][type];
+  var src = img || _assets["default"][type];
   return /*#__PURE__*/_react["default"].createElement("img", {
     className: className,
     style: style,

package/lib/components/TemplateButton/assets/index.js

@@ -5,10 +5,6 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 exports.__esModule = true;
 exports["default"] = void 0;
 
-var _topo_tpl_blank = _interopRequireDefault(require("./topo_tpl_blank.svg"));
-
-var _topo_tpl_region = _interopRequireDefault(require("./topo_tpl_region.svg"));
-
 var _topo_layout_circular = _interopRequireDefault(require("./topo_layout_circular.svg"));
 
 var _topo_layout_hierarchical = _interopRequireDefault(require("./topo_layout_hierarchical.svg"));
@@ -17,8 +13,6 @@ var _topo_layout_toward = _interopRequireDefault(require("./topo_layout_toward.s
 
 // import IconTplLayeredRing from './topo_tpl_layered_ring.svg';
 var _default = {
-  'tpl_blank': _topo_tpl_blank["default"],
-  'tpl_region': _topo_tpl_region["default"],
   // 'tpl_layered_ring': IconTplLayeredRing,
   'layout_circular': _topo_layout_circular["default"],
   'layout_hierarchical': _topo_layout_hierarchical["default"],

package/lib/components/TemplateButton/index.js

@@ -17,35 +17,27 @@ var _Icon = _interopRequireDefault(require("./Icon"));
 
 var _indexModule = _interopRequireDefault(require("./index.module.scss"));
 
-var _excluded = ["className", "children", "icon", "id", "selected", "onSelect", "iconClassName", "textClassName"];
+var _excluded = ["className", "children", "icon", "img", "iconClassName", "textClassName"];
 
 var TemplateButton = function TemplateButton(props) {
   var className = props.className,
       children = props.children,
       icon = props.icon,
-      id = props.id,
-      selected = props.selected,
-      _props$onSelect = props.onSelect,
-      onSelect = _props$onSelect === void 0 ? function () {} : _props$onSelect,
+      img = props.img,
       iconClassName = props.iconClassName,
       textClassName = props.textClassName,
       rest = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
-
-  var handleClick = function handleClick() {
-    return onSelect(id);
-  };
-
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _classnames["default"])(_indexModule["default"].card, className),
-    onClick: handleClick
+    className: (0, _classnames["default"])(_indexModule["default"].card, className)
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].iconWrapper
   }, /*#__PURE__*/_react["default"].createElement(_Icon["default"], (0, _extends2["default"])({
     className: (0, _classnames["default"])(_indexModule["default"].icon, iconClassName),
+    img: img,
     type: icon
   }, rest))), /*#__PURE__*/_react["default"].createElement("div", {
     className: (0, _classnames["default"])(_indexModule["default"].text, textClassName)
-  }, children));
+  }, /*#__PURE__*/_react["default"].createElement("span", null, children)));
 };
 
 var _default = TemplateButton;

package/lib/components/TemplateButton/index.module.scss

@@ -10,7 +10,6 @@
 
 .iconWrapper {
   display: flex;
-  flex: 1;
   justify-content: center;
   align-items: center;
 }
@@ -20,9 +19,10 @@
 }
 
 .text {
+  height: 20px;
+  line-height: 20px;
   font-size: 18px;
-  margin-top: 16px;
-  padding-bottom: 24px;
+  margin-top: 14px;
   color: $color-text1-3;
   outline: none;
 }

package/lib/core/models/cache/CiTyeCache.js

@@ -40,7 +40,7 @@ var CiTyeCache = /*#__PURE__*/function () {
             case 5:
               _context.prev = 5;
               _context.t0 = _context["catch"](0);
-              console.error('查询Ci模型异常');
+              console.error('查询Ci模型异常', _context.t0);
 
             case 8:
               return _context.abrupt("return", this.cache);

package/lib/core/models/utils/linkUtils.js

@@ -21,8 +21,8 @@ function mergeLinksData(links, relationDetails) {
   return links.map(function (link) {
     var relation = (0, _topoData.findItem)(relationDetails, 'id', link.id);
     return (0, _extends2["default"])({}, link, {
-      ciType: relation.typeCode,
-      name: relation.attributes.name,
+      ciType: relation === null || relation === void 0 ? void 0 : relation.typeCode,
+      name: relation === null || relation === void 0 ? void 0 : relation.attributes.name,
       detail: relation
     });
   });

package/lib/core/viewer/components/titlebar/ViewerTools.js

@@ -23,10 +23,15 @@ var _TitleBarModule = _interopRequireDefault(require("../../../components/titleb
 
 var _EditButton = _interopRequireDefault(require("./widgets/EditButton"));
 
+var _useSetDefaultTopo = _interopRequireDefault(require("./useSetDefaultTopo"));
+
 function ViewerTools(props) {
   var topo = props.topo,
       _props$showEditButton = props.showEditButton,
       showEditButton = _props$showEditButton === void 0 ? true : _props$showEditButton;
+  var setDefaultTopo = (0, _useSetDefaultTopo["default"])({
+    topo: topo
+  });
   return /*#__PURE__*/_react["default"].createElement("div", null, showEditButton && /*#__PURE__*/_react["default"].createElement(_EditButton["default"], (0, _extends2["default"])({
     topo: topo
   }, props)), /*#__PURE__*/_react["default"].createElement(_dropdown["default"], {
@@ -36,7 +41,7 @@ function ViewerTools(props) {
       type: "ellipsis-vertical"
     })),
     triggerType: "click"
-  }, /*#__PURE__*/_react["default"].createElement(_menu["default"], null, /*#__PURE__*/_react["default"].createElement(_menu["default"].Item, {
+  }, /*#__PURE__*/_react["default"].createElement(_menu["default"], null, setDefaultTopo.renderMenuItem(), /*#__PURE__*/_react["default"].createElement(_menu["default"].Item, {
     onClick: function onClick() {
       topo.exportImage();
     }