@riil-frontend/component-topology 2.11.0 → 2.12.3

package/es/utils/htElementUtils.js

@@ -39,6 +39,11 @@ export function getGroups(dataModel) {
     return getGroupData(element);
   });
 }
+export function getGroupElementByTag(dataModel, tag) {
+  return dataModel.getDataByTag(tag) || dataModel.getDatas().toArray().filter(function (item) {
+    return item.a('tag') === tag;
+  })[0];
+}
 export function getGroupData(element) {
   if (!element) {
     return null;
@@ -58,13 +63,14 @@ export function getGroupData(element) {
 export function getNodes(dataModel) {
   return getElements(dataModel).filter(function (element) {
     return element.getClassName() === 'ht.Node';
-  }).map(function (element) {
-    var parentGroup = getGroupData(element.getParent());
-    return _extends({}, element.getAttrObject(), {
-      tag: element.getId(),
-      image: element.getImage(),
-      groupTag: parentGroup ? parentGroup.id : undefined
-    });
+  }).map(getNodeData);
+}
+export function getNodeData(element) {
+  var parentGroup = getGroupData(element.getParent());
+  return _extends({}, element.getAttrObject(), {
+    tag: element.getId(),
+    image: element.getImage(),
+    groupTag: parentGroup ? parentGroup.id : undefined
   });
 }
 export function getEdges(dataModel) {
@@ -84,4 +90,7 @@ export function getGroupNodes(dataModel, groupIdOrTag) {
   return getNodes(dataModel).filter(function (element) {
     return element.groupId === groupIdOrTag || element.groupTag === groupIdOrTag;
   });
+}
+export function getGroupChildrenData(group) {
+  return group.getChildren().getArray().map(getNodeData);
 }

package/lib/components/LayoutDirectionSelect/LayoutDirectionSelect.js

@@ -49,7 +49,7 @@ function LayoutDirectionSelect(props) {
       onSelect: onSelect
     });
   });
-  return /*#__PURE__*/_react["default"].createElement(_TagImageSelect["default"], {
+  return /*#__PURE__*/_react["default"].createElement(_TagImageSelect["default"], (0, _extends2["default"])({
     dataSource: layoutOptions,
     boxProps: {
       spacing: 12
@@ -58,7 +58,7 @@ function LayoutDirectionSelect(props) {
       className: _LayoutDirectionSelectModule["default"].layoutSelectItem
     },
     ItemComponent: _Item["default"]
-  });
+  }, props));
 }
 
 ;

package/lib/components/MultiResourceDrawer/index.js

@@ -46,9 +46,10 @@ var MultiResourceDrawer = function MultiResourceDrawer(props) {
                 };
               }
 
-              onSave(result);
+              _context.next = 4;
+              return onSave(result);
 
-            case 3:
+            case 4:
             case "end":
               return _context.stop();
           }

package/lib/components/ResourceSelectDrawer/ResourceSelectDrawer.js

@@ -86,6 +86,7 @@ function ResourceSelectDrawer(props) {
     buttons: ['确定', '取消']
   }, visible && /*#__PURE__*/_react["default"].createElement(_ResourceSelectList["default"], {
     ref: resourceSelectRef,
+    selectionMode: selectionMode,
     excludeIds: excludeIds
   }));
 }

package/lib/components/ResourceSelectDrawer/ResourceSelectList.js

@@ -22,7 +22,12 @@ function ResourceSelectList(props, ref) {
     ref: ref,
     limitTypes: _ResourceTypeLimit.RESOURCE_LIMIT_TYPES,
     defaultCondition: excludeIds.length ? "!id('" + excludeIds.join("','") + "')" : undefined,
-    request: (0, _componentTopologyCommon.getRequest)()
+    request: (0, _componentTopologyCommon.getRequest)(),
+    tableProps: selectionMode ? {
+      rowSelection: {
+        mode: selectionMode
+      }
+    } : undefined
   });
 }
 

package/lib/components/SingleResourceDrawer/SelectDrawer.js

@@ -0,0 +1,68 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+
+var _message = _interopRequireDefault(require("@alifd/next/lib/message"));
+
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ResourceSelectDrawer = _interopRequireDefault(require("../ResourceSelectDrawer"));
+
+var SingleSelectDrawer = function SingleSelectDrawer(props) {
+  var visible = props.visible,
+      totalSelection = props.totalSelection,
+      onSave = props.onSave,
+      onClose = props.onClose;
+
+  var onDrawerSave = /*#__PURE__*/function () {
+    var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(selected) {
+      return _regenerator["default"].wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (selected.length) {
+                _context.next = 3;
+                break;
+              }
+
+              _message["default"].error('请选择一项资源。');
+
+              return _context.abrupt("return", false);
+
+            case 3:
+              _context.next = 5;
+              return onSave(selected[0]);
+
+            case 5:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function onDrawerSave(_x) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  return /*#__PURE__*/_react["default"].createElement(_ResourceSelectDrawer["default"], {
+    visible: visible,
+    excludeIds: totalSelection,
+    selectionMode: "single",
+    onOk: onDrawerSave,
+    onClose: onClose
+  });
+};
+
+var _default = SingleSelectDrawer;
+exports["default"] = _default;

package/lib/components/SingleResourceDrawer/index.js

@@ -21,7 +21,7 @@ var SingleResourceDrawer = function SingleResourceDrawer(props) {
   var store = props.store,
       visible = props.visible,
       loading = props.loading,
-      selectedKeys = props.selectedKeys,
+      selectedKey = props.selectedKey,
       totalSelection = props.totalSelection,
       onSave = props.onSave,
       onClose = props.onClose;
@@ -36,7 +36,7 @@ var SingleResourceDrawer = function SingleResourceDrawer(props) {
       return;
     }
 
-    var intercept = onSave(data);
+    var intercept = onSave(data[0]);
 
     if (!intercept) {
       onClose();
@@ -44,7 +44,7 @@ var SingleResourceDrawer = function SingleResourceDrawer(props) {
   };
 
   var initialData = {
-    selected: selectedKeys,
+    selected: [selectedKey],
     total: totalSelection
   };
   return /*#__PURE__*/_react["default"].createElement(_Drawer["default"], {

package/lib/core/common/icons/defaultIcons.js

@@ -7,6 +7,13 @@ exports["default"] = exports.DEFAULT_NODE_ICONS = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
+var _ciTypeIcons = require("@riil-frontend/component-topology-graph/es/icons/ciTypeIcons");
+
+/**
+ * 默认节点图标
+ *
+ * @type {(*|{url: *})[]}
+ */
 var DEFAULT_NODE_ICONS = [{
   id: 'ciType/network.switch',
   name: '交换机',
@@ -69,7 +76,8 @@ exports.DEFAULT_NODE_ICONS = DEFAULT_NODE_ICONS;
 DEFAULT_NODE_ICONS.forEach(function (icon) {
   ht.Default.setImage(icon.id, icon.jsonUrl || icon.url);
 });
-var _default = {
+
+var _default = (0, _extends2["default"])({}, (0, _ciTypeIcons.getIconMap)(), {
   'editor.icon.cloud.small': {
     url: '/ht/image/topo/s/云_64.png',
     json: '/ht/image/topo/s/云_64.json'
@@ -136,5 +144,6 @@ var _default = {
   'editor.icon.library.small': '/ht/image/topo/s/库_48.json',
   'editor.icon.balanc.small': '/ht/image/topo/s/负载均衡_48.json',
   'editor.icon.calendar.small': '/ht/image/topo/s/日历_48.json'
-};
+});
+
 exports["default"] = _default;

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

@@ -56,7 +56,10 @@ var TopoView = function TopoView(props) {
       nodeDeleteable = props.nodeDeleteable,
       onNodeDelete = props.onNodeDelete,
       onLineDelete = props.onLineDelete,
-      onLoaded = props.onLoaded;
+      onReady = props.onReady,
+      onDestroy = props.onDestroy,
+      onLoaded = props.onLoaded,
+      buildLoadOptions = props.buildLoadOptions;
   var topoApp = engine || topo;
   var store = topoApp.store;
 
@@ -80,7 +83,12 @@ var TopoView = function TopoView(props) {
       topoData = topoState.topoData,
       urlParams = topoState.urlParams;
   var isEditMode = viewState === 'edit';
-  var topoShowType = topoData === null || topoData === void 0 ? void 0 : (_topoData$config = topoData.config) === null || _topoData$config === void 0 ? void 0 : _topoData$config.showType; // rlog.debug('TopoView---income', topoId, viewState);
+  var topoShowType = topoData === null || topoData === void 0 ? void 0 : (_topoData$config = topoData.config) === null || _topoData$config === void 0 ? void 0 : _topoData$config.showType;
+
+  var _useState = (0, _react.useState)(buildLoadOptions ? buildLoadOptions(topoData) : topoData),
+      tData = _useState[0],
+      setTData = _useState[1]; // rlog.debug('TopoView---income', topoId, viewState);
+
 
   var resAndMetrics = bizState.resAndMetrics;
   var topoEditApi = (0, _useTopoEdit["default"])({
@@ -108,11 +116,6 @@ var TopoView = function TopoView(props) {
       onDeleteElement = topoEditApi.onDeleteElement,
       onSaveTopo = topoEditApi.onSaveTopo,
       onTopoRelatedImage = topoEditApi.onTopoRelatedImage;
-
-  var _useState = (0, _react.useState)(topoData),
-      tData = _useState[0],
-      setTData = _useState[1];
-
   var containerLinkTopo = (0, _useContainerLinkTopo["default"])({
     topoApp: topoApp
   });
@@ -135,7 +138,7 @@ var TopoView = function TopoView(props) {
   (0, _react.useEffect)(function () {
     _rlog["default"].debug('TopoView.useEffect topoData', topoData);
 
-    setTData(topoData);
+    setTData(buildLoadOptions ? buildLoadOptions(topoData) : topoData);
 
     if (topoData) {
       // TODO 移到模型中
@@ -143,13 +146,17 @@ var TopoView = function TopoView(props) {
         currentTopo: topoData.config
       });
     }
-  }, [topoData, resAndMetrics]);
+  }, [topoData]);
   var onCreatedTopo = (0, _react.useCallback)(function (topoClient) {
     topoApp.view.onCreatedView(topoClient);
 
     _rlog["default"].info('TopoView.onCreatedTopo');
 
     initSelection();
+
+    if (onReady) {
+      onReady();
+    }
   }, []);
   var handleLoaded = (0, _react.useCallback)(function () {
     if (topoApp.alarms) {
@@ -255,7 +262,7 @@ var TopoView = function TopoView(props) {
     enableRelateResource: ((_topoApp$options$edit = topoApp.options.editor) === null || _topoApp$options$edit === void 0 ? void 0 : _topoApp$options$edit.enableRelateResource) !== false,
     onCreate: onCreatedTopo,
     onLoaded: handleLoaded,
-    onDestroy: function onDestroy() {},
+    onDestroy: onDestroy,
     onEvent: onEvent,
     style: {
       width: '100%',
@@ -272,7 +279,7 @@ var TopoView = function TopoView(props) {
     visible: showSingleResDrawer,
     loading: topoLoading,
     store: store,
-    selectedKeys: initialSingleRes,
+    selectedKey: initialSingleRes,
     totalSelection: resSelections,
     onSave: onSaveSingleRes,
     onClose: onCloseSigleResDrawer

package/lib/core/editor/components/settings/Settings.js

@@ -11,21 +11,11 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _SettingsForm = _interopRequireDefault(require("./SettingsForm"));
-
-var _LayerSettingsForm = _interopRequireDefault(require("./layer/LayerSettingsForm"));
-
 var _SettingsModule = _interopRequireDefault(require("./Settings.module.scss"));
 
 var _htElementDataUtil = require("../../../../utils/htElementDataUtil");
 
-var _TextPropertyView = _interopRequireDefault(require("./text/TextPropertyView"));
-
-var _NodePropertyView = _interopRequireDefault(require("./node/NodePropertyView"));
-
-var _ViewPropertyView = _interopRequireDefault(require("./view/ViewPropertyView"));
-
-var _LinkPropertyView = _interopRequireDefault(require("./link/LinkPropertyView"));
+var _propertyViews = _interopRequireDefault(require("./propertyViews"));
 
 var _useSettingRuntimeState = _interopRequireDefault(require("./useSettingRuntimeState"));
 
@@ -64,26 +54,7 @@ function Settings(props) {
   }).join(',');
   (0, _react.useEffect)(function () {// const selectionModel = topo.getSelectionModel();
     // console.info('selection change', selection)
-  }, [selection]);
-  var propertyPanelMap = {
-    view: _SettingsForm["default"],
-    node: _NodePropertyView["default"],
-    layer: _LayerSettingsForm["default"],
-    text: _TextPropertyView["default"]
-  };
-
-  if (localStorage.getItem('topo.debug') === 'true') {
-    Object.assign(propertyPanelMap, {
-      line: _LinkPropertyView["default"],
-      view: _ViewPropertyView["default"]
-    });
-  } else {
-    if (!selectionSize) {
-      // 未选择元素
-      return null;
-    }
-  } // TODO 待优化
-
+  }, [selection]); // TODO 待优化
 
   var updateElementProperty = function updateElementProperty(name, value) {
     // const element = topo.getDataModel().getDataById(selection[0].id);
@@ -107,9 +78,9 @@ function Settings(props) {
   };
 
   var elementType = getElementType(selection);
-  var Component = propertyPanelMap[elementType];
+  var PropertyView = _propertyViews["default"][elementType];
 
-  if (!Component) {
+  if (!PropertyView) {
     return null;
   }
 
@@ -124,7 +95,7 @@ function Settings(props) {
     className: _SettingsModule["default"].settingsPanel
   }, /*#__PURE__*/_react["default"].createElement("div", {
     className: _SettingsModule["default"].settings
-  }, /*#__PURE__*/_react["default"].createElement(Component, {
+  }, /*#__PURE__*/_react["default"].createElement(PropertyView, {
     type: elementType,
     topo: topo,
     topoEditApi: topoEditApi,

package/lib/core/editor/components/settings/{group → common}/GroupNodeList/ResourceSelectButton.js

@@ -13,19 +13,17 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _ResourceSelectDrawer = _interopRequireDefault(require("../../../../../../components/ResourceSelect/ResourceSelectDrawer"));
 
+var _componentTopologyGraph = require("@riil-frontend/component-topology-graph");
+
 function ResourceSelectButton(props) {
   var topo = props.topo,
-      layer = props.layer,
-      resourceSelectComponent = props.resourceSelectComponent,
-      onAdd = props.onAdd;
+      group = props.group,
+      topoEditApi = props.topoEditApi;
 
   var _useState = (0, _react.useState)(false),
       isSelectResource = _useState[0],
       setIsSelectResource = _useState[1];
 
-  var ResourceSelectComponent = resourceSelectComponent || _ResourceSelectDrawer["default"]; // const ResourceSelectComponent = ResourceSelectDrawer;
-  // TODO
-
   return /*#__PURE__*/_react["default"].createElement("div", {
     onClick: function onClick(e) {
       return e.stopPropagation();
@@ -35,15 +33,16 @@ function ResourceSelectButton(props) {
     type: "primary",
     onClick: function onClick(e) {
       e.stopPropagation();
-      setIsSelectResource(true);
+      topoEditApi.onBindData({
+        type: _componentTopologyGraph.TopoEvent.DATA_TYPE_RESOURCE_COMBO,
+        data: {
+          dtype: 'container',
+          id: group.tag,
+          tag: group.attr.tag
+        }
+      });
     }
-  }, "\u9009\u62E9"), /*#__PURE__*/_react["default"].createElement(ResourceSelectComponent, {
-    layer: layer,
-    visible: isSelectResource,
-    setVisible: setIsSelectResource,
-    topo: topo,
-    existedIds: []
-  }));
+  }, "\u6DFB\u52A0\u8D44\u6E90"));
 }
 
 ;

package/lib/core/editor/components/settings/group/DataTab/GroupNodeList.js

@@ -0,0 +1,33 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+exports.__esModule = true;
+exports["default"] = GroupNodeList;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _ResourceList = _interopRequireDefault(require("../../common/GroupNodeList/ResourceList"));
+
+var _htElementUtils = require("../../../../../../utils/htElementUtils");
+
+var _icon = require("../../common/GroupNodeList/icon");
+
+function GroupNodeList(props) {
+  var topo = props.topo,
+      group = props.group;
+  var nodes = (0, _htElementUtils.getGroupChildrenData)(topo.getDataModel().getDataById(group.id));
+  var data = nodes.map(function (node) {
+    return {
+      title: node.name,
+      img: (0, _icon.getIconById)(node.image, topo)
+    };
+  });
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_ResourceList["default"], {
+    data: data
+  }));
+}
+
+;

package/lib/core/editor/components/settings/group/DataTab/RelateData.js

@@ -0,0 +1,57 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = GroupRelateData;
+
+var _collapse = _interopRequireDefault(require("@alifd/next/lib/collapse"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ResourceSelectButton = _interopRequireDefault(require("../../common/GroupNodeList/ResourceSelectButton"));
+
+var _GroupNodeList = _interopRequireDefault(require("./GroupNodeList"));
+
+var CollapsePanel = _collapse["default"].Panel;
+
+function GroupRelateData(props) {
+  var topo = props.topo,
+      topoEditApi = props.topoEditApi,
+      values = props.values,
+      editorProps = props.editorProps;
+
+  var createResourcePanel = function createResourcePanel() {
+    return /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
+      key: "\u5173\u8054\u8D44\u6E90",
+      title: /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          display: 'flex',
+          paddingRight: 12
+        }
+      }, /*#__PURE__*/_react["default"].createElement("div", {
+        style: {
+          flex: 1
+        }
+      }, "\u5173\u8054\u8D44\u6E90"), /*#__PURE__*/_react["default"].createElement(_ResourceSelectButton["default"], {
+        topo: topo,
+        topoEditApi: topoEditApi,
+        group: values,
+        onAdd: function onAdd() {
+          /*TODO 刷新列表 refreshList*/
+        },
+        resourceSelectComponent: editorProps === null || editorProps === void 0 ? void 0 : editorProps.groupResourceSelectComponent
+      }))
+    }, /*#__PURE__*/_react["default"].createElement(_GroupNodeList["default"], {
+      topo: topo,
+      group: values
+    }));
+  };
+
+  return /*#__PURE__*/_react["default"].createElement(_collapse["default"], {
+    defaultExpandedKeys: ['关联资源'],
+    style: {
+      border: 'none'
+    }
+  }, createResourcePanel());
+}

package/lib/core/editor/components/settings/group/GroupPropertyView.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = GroupPropertyView;
+
+var _tab = _interopRequireDefault(require("@alifd/next/lib/tab"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _TabView = _interopRequireDefault(require("../common/tab/TabView"));
+
+var _GroupPropertyViewModule = _interopRequireDefault(require("./GroupPropertyView.module.scss"));
+
+var _useGroup = _interopRequireDefault(require("./hooks/useGroup"));
+
+var _Setting = _interopRequireDefault(require("./SettingTab/Setting"));
+
+var _RelateData = _interopRequireDefault(require("./DataTab/RelateData"));
+
+function GroupPropertyView(props) {
+  var topo = props.topo,
+      topoEditApi = props.topoEditApi,
+      values = props.values,
+      onChange = props.onChange,
+      settingRuntimeState = props.settingRuntimeState,
+      editorProps = props.editorProps;
+  var group = (0, _useGroup["default"])({
+    topo: topo,
+    id: values.id
+  });
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: _GroupPropertyViewModule["default"].GroupPropertyView
+  }, /*#__PURE__*/_react["default"].createElement(_TabView["default"], null, /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
+    title: "\u6570\u636E",
+    key: "1"
+  }, /*#__PURE__*/_react["default"].createElement(_RelateData["default"], {
+    group: group,
+    topo: topo,
+    topoEditApi: topoEditApi,
+    values: values,
+    onChange: onChange,
+    settingRuntimeState: settingRuntimeState,
+    editorProps: editorProps
+  })), /*#__PURE__*/_react["default"].createElement(_tab["default"].Item, {
+    title: "\u8BBE\u7F6E",
+    key: "2"
+  }, /*#__PURE__*/_react["default"].createElement(_Setting["default"], {
+    group: group,
+    topo: topo,
+    topoEditApi: topoEditApi,
+    values: values,
+    onChange: onChange,
+    settingRuntimeState: settingRuntimeState,
+    editorProps: editorProps
+  }))));
+}

package/lib/core/editor/components/settings/group/GroupPropertyView.module.scss

@@ -0,0 +1,3 @@
+.GroupPropertyView {
+
+}

package/lib/core/editor/components/settings/group/SettingTab/GroupExpandSetting.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+exports.__esModule = true;
+exports["default"] = GroupExpandSetting;
+
+var _radio = _interopRequireDefault(require("@alifd/next/lib/radio"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var list = [{
+  value: true,
+  label: '展开'
+}, {
+  value: false,
+  label: '收起'
+}];
+/**
+ * 区域展开折叠
+ *
+ * @param props
+ * @return {*}
+ * @constructor
+ */
+
+function GroupExpandSetting(props) {
+  var expanded = props.expanded,
+      setExpanded = props.setExpanded;
+  return /*#__PURE__*/_react["default"].createElement(_radio["default"].Group, {
+    dataSource: list,
+    value: expanded,
+    onChange: setExpanded
+  });
+}
+
+;

package/lib/core/editor/components/settings/group/SettingTab/NodeIconSelect.js

@@ -0,0 +1,45 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+exports.__esModule = true;
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _icon = require("../../common/GroupNodeList/icon");
+
+var _componentTopoIconSelect = _interopRequireDefault(require("@riil-frontend/component-topo-icon-select"));
+
+function NodeIconSelect(props, ref) {
+  var value = props.value,
+      onChange = props.onChange,
+      topo = props.topo;
+  var iconGroups = (0, _icon.getIconGroups)(topo, 'node');
+  var newId = value;
+  var a = iconGroups[0].icons.filter(function (item) {
+    return newId.indexOf(item.oldId) !== -1;
+  });
+
+  if (a.length) {
+    newId = a[0].id;
+  }
+
+  (0, _react.useImperativeHandle)(ref, function () {
+    return {};
+  });
+  return /*#__PURE__*/_react["default"].createElement(_componentTopoIconSelect["default"], {
+    value: newId,
+    iconList: iconGroups,
+    onChange: onChange,
+    style: {
+      width: '100%'
+    }
+  });
+}
+
+var _default = /*#__PURE__*/(0, _react.forwardRef)(NodeIconSelect);
+
+exports["default"] = _default;