@riil-frontend/component-topology 10.0.22 → 10.0.24

package/es/components/ColorPanel/components/FontColorRange/index.js

@@ -31,7 +31,9 @@ function FontColorRange(props) {
     onProcess: setValue
   })), /*#__PURE__*/React.createElement("div", {
     className: styles.unit
-  }, value, unit));
+  }, value, /*#__PURE__*/React.createElement("span", {
+    className: styles.unitSpan
+  }, unit)));
 }
 
 export default FontColorRange;

package/es/components/ColorPanel/components/FontColorRange/index.module.scss

@@ -15,6 +15,9 @@
     margin-right: 8px;
     width: 32px;
     text-align: right;
+    color:$color-text1-4;
+  }
+  .unitSpan{
     color:$color-text1-6;
   }
 

package/es/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js

@@ -46,6 +46,13 @@ export default function HtCustomImagePanel(props) {
       }
     };
   }, []);
+  useEffect(function () {
+    var view = viewRef.current;
+
+    if (view && view.setIcons) {
+      view.setIcons(icons);
+    }
+  }, [icons]);
   return /*#__PURE__*/React.createElement("div", {
     ref: divRef,
     className: styles.container

package/es/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js

@@ -63,6 +63,7 @@ export default function ImagePanel(props) {
   var renderImageContent = function renderImageContent() {
     var panels = [{
       key: '资源图片',
+      hidden: searchValue && !resourceIcons.length,
       render: function render() {
         return /*#__PURE__*/React.createElement(CollapsePanel, {
           key: "\u8D44\u6E90\u56FE\u7247",
@@ -74,6 +75,7 @@ export default function ImagePanel(props) {
       }
     }, {
       key: '基础图片',
+      hidden: searchValue && !basicIcons.length,
       render: function render() {
         return /*#__PURE__*/React.createElement(CollapsePanel, {
           key: "\u57FA\u7840\u56FE\u7247",

package/es/core/editor/components/Toolbar/widgets/BoxBackgroundButton/BoxbackgroundSettings.module.scss

@@ -68,7 +68,7 @@
       flex-direction: row;
       .backOpacityLable{
         margin-left: 16px;
-        line-height: 22px;
+        line-height: 24px;
         margin-right: 5px;
         color:$color-text1-6;
       }

package/es/core/models/AttributeMetricDisplay.js

@@ -1,23 +1,22 @@
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _extends from "@babel/runtime/helpers/extends";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
-import topoServer from "@riil-frontend/component-topology-common/es/services/topo";
-import rlog from "@riil-frontend/component-topology-utils/es/rlog";
-import { keyBy } from "lodash";
+import topoServer from '@riil-frontend/component-topology-common/es/services/topo';
+import rlog from '@riil-frontend/component-topology-utils/es/rlog';
+import { keyBy } from 'lodash';
 import { DEFAULT_NODE_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
-import { findItem } from "../../utils/topoData";
 import { queryCisByIds } from "../services";
 import { isMonitoring } from "../utils/manageStatusUtil";
 import AttributeFormatter from "./attributeFormatter";
 import DictCache from "./cache/DictCache";
 
 function isGraphField(item) {
-  return item.type === "graph";
+  return item.type === 'graph';
 }
 
 function filterUnExistedFields(fields, ciTypeMeta) {
   function isFieldExisted(item, ciTypeMeta) {
-    return item.type === "attribute" && ciTypeMeta.attributeMap[item.code] || item.type === "metric" && ciTypeMeta.metricMap[item.code] || item.type !== "attribute" && item.type !== "metric";
+    return item.type === 'attribute' && ciTypeMeta.attributeMap[item.code] || item.type === 'metric' && ciTypeMeta.metricMap[item.code] || item.type !== 'attribute' && item.type !== 'metric';
   }
 
   return fields.filter(function (item) {
@@ -34,7 +33,8 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     var _this$topo$options$ta;
 
     this.topo = topo;
-    var ExtElementTagTipBuilder = (_this$topo$options$ta = this.topo.options.tagTip) === null || _this$topo$options$ta === void 0 ? void 0 : _this$topo$options$ta.ExtElementTagTipBuilder;
+    this.formatter = new AttributeFormatter(this.topo);
+    var ExtElementTagTipBuilder = (_this$topo$options$ta = this.topo.options.tagTip) === null || _this$topo$options$ta === void 0 ? void 0 : _this$topo$options$ta.extElementTagTipBuilder;
 
     if (ExtElementTagTipBuilder) {
       this.extElementTagTipBuilder = new ExtElementTagTipBuilder(this);
@@ -44,7 +44,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   var _proto = AttributeMetricDisplay.prototype;
 
   _proto.getConfig = function getConfig() {
-    var _this$topo$store$getM = this.topo.store.getModelState("displayConfig"),
+    var _this$topo$store$getM = this.topo.store.getModelState('displayConfig'),
         nodeTag = _this$topo$store$getM.nodeTag,
         nodeTip = _this$topo$store$getM.nodeTip,
         linkTag = _this$topo$store$getM.linkTag,
@@ -108,7 +108,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
     return [].concat(links.map(function (link) {
       return _extends({}, link, {
-        type: "edge"
+        type: 'edge'
       });
     }));
   };
@@ -121,14 +121,14 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
 
     var nodeArr = [];
-    nodes.map(function (node) {
-      if (!!node.ciType) {
+    nodes.forEach(function (node) {
+      if (node.ciType) {
         var ciType = node.ciType;
 
         var ciTypeConfig = _this.getNodeCiTypeConfig(ciType);
 
         nodeArr.push({
-          type: "node",
+          type: 'node',
           id: node.id,
           ciType: ciType,
           tags: _this.filterCiFiledConfigItems(node, ciTypeConfig.tags),
@@ -151,7 +151,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
     if (!isMonitoring(data)) {
       list = list.filter(function (item) {
-        return item.type !== "metric";
+        return item.type !== 'metric';
       });
     }
 
@@ -160,7 +160,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   ;
 
   _proto.getModelType = function getModelType(ci) {
-    if (ci.ciType === "network_link") {
+    if (ci.ciType === 'network_link') {
       return ci.attributes.support_templates;
     }
 
@@ -200,9 +200,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     return {
       tags: getItems(linkTagConfig),
       tagLinkArrow: {
-        1: "both",
-        2: "from",
-        3: "to"
+        1: 'both',
+        2: 'from',
+        3: 'to'
       }[linkTagConfig === null || linkTagConfig === void 0 ? void 0 : linkTagConfig.type] || undefined,
       tips: getItems(linkTip || defaultLinkTipConfig)
     };
@@ -262,7 +262,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
         }
       }); // 增加概览需要的指标字段
 
-      var overviewState = _this3.topo.store.getModelState("topoBaseInfoOverview");
+      var overviewState = _this3.topo.store.getModelState('topoBaseInfoOverview');
 
       if (overviewState.id === fields.id) {
         overviewState.metricCodes.forEach(function (code) {
@@ -315,10 +315,10 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
           data = nodeTag.data;
       var items = (isCustom ? data[node.ciType] : data) || [];
       visible = !!items.filter(function (item) {
-        return item.type === "graph";
+        return item.type === 'graph';
       }).length; // ipNode逻辑
 
-      if (isCustom && node.bindType === "ip") {
+      if (isCustom && node.bindType === 'ip') {
         visible = true;
       }
     }
@@ -351,7 +351,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
       var ele = dm.getDataByTag(id); //
 
       if (ele) {
-        ele.a("isShowName", visible);
+        ele.a('isShowName', visible);
       }
     });
   }
@@ -388,7 +388,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
             case 4:
               ciDatas = _context.sent;
-              bizDispatchers = topo.store.getModelDispatchers("topoBizMod");
+              bizDispatchers = topo.store.getModelDispatchers('topoBizMod');
               _context.next = 8;
               return bizDispatchers.setAttrsAndMetrics(ciDatas);
 
@@ -557,7 +557,7 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
 
     var elementTagsAndTips = this.buildTagsTips() // 开锁状态下禁用悬停展示悬浮框
     .map(function (item) {
-      var _topo$store$getModelS = topo.store.getModelState("lock"),
+      var _topo$store$getModelS = topo.store.getModelState('lock'),
           lock = _topo$store$getModelS.lock;
 
       return lock ? item : _extends({}, item, {
@@ -567,9 +567,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     .map(function (item) {
       var tags = item.tags;
 
-      if (item.type === "edge") {
+      if (item.type === 'edge') {
         var allNoValue = tags.data.filter(function (tItem) {
-          return tItem.value === "- ";
+          return tItem.value === '- ';
         }).length === tags.data.length;
 
         if (allNoValue) {
@@ -587,9 +587,9 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
     if (htTopo) {
       var _topo$historyManager, _topo$historyManager2;
 
-      (_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, "加载标注");
+      (_topo$historyManager = topo.historyManager) === null || _topo$historyManager === void 0 ? void 0 : _topo$historyManager.setDisabled(true, '加载标注');
       htTopo.loadTagAndTip(JSON.parse(JSON.stringify(elementTagsAndTips)));
-      (_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, "加载标注");
+      (_topo$historyManager2 = topo.historyManager) === null || _topo$historyManager2 === void 0 ? void 0 : _topo$historyManager2.setDisabled(false, '加载标注');
     }
   }
   /**
@@ -599,7 +599,52 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   ;
 
   _proto.getData = function getData() {
-    return this.topo.store.getModelState("topoBizMod").attrsAndMetrics;
+    return this.topo.store.getModelState('topoBizMod').attrsAndMetrics;
+  };
+
+  _proto.buildElementTagsTips = function buildElementTagsTips(id) {
+    var ciConfigs = this.getResourceTagTipConfig();
+    var ciConfig = ciConfigs.find(function (item) {
+      return item.id === id;
+    });
+    var ciDataItem = this.getData().find(function (item) {
+      return item.id === id;
+    }); // console.log("buildTagsTips-ciDataItem", ciDataItem);
+
+    if (!ciDataItem) {
+      return {
+        id: ciConfig.id,
+        tags: [],
+        tips: []
+      };
+    } // 获取ci数据
+
+
+    var ciData = _extends({}, ciDataItem, {
+      ciType: ciConfig.ciType
+    }); // console.log("AttributeFormatter-----", ciData, ciConfig);
+
+
+    var tags = this.formatter.formatAttrs(ciConfig.tags, ciData) // 展示的所有标注不带对应的名字（包括属性和指标）
+    .map(function (item) {
+      return _extends({}, item, {
+        name: ''
+      });
+    }); // 链路标注箭头
+
+    if (ciConfig.type === 'edge') {
+      tags = {
+        data: tags,
+        linkArrow: ciConfig.tagLinkArrow
+      };
+    }
+
+    return {
+      type: ciConfig.type,
+      id: ciConfig.id,
+      tags: tags,
+      tips: this.formatter.formatAttrs(ciConfig.tips, ciData)
+    };
   }
   /**
    * 构造标注、悬浮框数据
@@ -608,51 +653,18 @@ var AttributeMetricDisplay = /*#__PURE__*/function () {
   ;
 
   _proto.buildTagsTips = function buildTagsTips() {
-    var data = this.getData(); // 获取标注、悬浮框配置
+    var _this6 = this,
+        _this$extElementTagTi;
 
+    // 获取标注、悬浮框配置
     var ciConfigs = this.getResourceTagTipConfig(); // console.log("buildTagsTips---ciConfigs", ciConfigs);
 
-    var formatter = new AttributeFormatter(this.topo);
     var ciTagsAndTips = ciConfigs.map(function (ciConfig) {
-      var ciDataItem = findItem(data, "id", ciConfig.id); // console.log("buildTagsTips-ciDataItem", ciDataItem);
-
-      if (!ciDataItem) {
-        return {
-          id: ciConfig.id,
-          tags: [],
-          tips: []
-        };
-      } // 获取ci数据
-
-
-      var ciData = _extends({}, ciDataItem, {
-        ciType: ciConfig.ciType
-      }); // console.log("AttributeFormatter-----", ciData, ciConfig);
-
-
-      var tags = formatter.formatAttrs(ciConfig.tags, ciData) // 展示的所有标注不带对应的名字（包括属性和指标）
-      .map(function (item) {
-        return _extends({}, item, {
-          name: ''
-        });
-      }); // 链路标注箭头
-
-      if (ciConfig.type === "edge") {
-        tags = {
-          data: tags,
-          linkArrow: ciConfig.tagLinkArrow
-        };
-      }
-
-      return {
-        type: ciConfig.type,
-        id: ciConfig.id,
-        tags: tags,
-        tips: formatter.formatAttrs(ciConfig.tips, ciData)
-      };
+      return _this6.buildElementTagsTips(ciConfig.id);
     }); // console.log("ciTagsAndTips", ciTagsAndTips);
 
-    var elementTagsAndTips = [].concat(ciTagsAndTips, this.extElementTagTipBuilder ? this.extElementTagTipBuilder.getExtElementTagsAndTips() : []); // 刷新标注、浮层
+    var extTagsAndTips = ((_this$extElementTagTi = this.extElementTagTipBuilder) === null || _this$extElementTagTi === void 0 ? void 0 : _this$extElementTagTi.getExtElementTagsAndTips()) || [];
+    var elementTagsAndTips = [].concat(ciTagsAndTips, extTagsAndTips); // 刷新标注、浮层
     // rlog.debug('AttributeMetricDisplay.buildTagsTips', {tagsAndTips: elementTagsAndTips, ciConfigs});
 
     return elementTagsAndTips;

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.22" === 'string' ? "10.0.22" : null;
+var version = typeof "10.0.24" === 'string' ? "10.0.24" : null;
 console.info("\u62D3\u6251\u7248\u672C: " + version);
 /**
  * 拓扑显示和编辑

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

@@ -48,16 +48,9 @@ export function mergeLinksData(links, linkCis, nodes, interfaceCiMap, interfaceD
     });
     var targetNode = nodes.find(function (node) {
       return node.id === attributes["network_link.destination_device_id"];
-    });
-    var target = link.target; // 目的端为ip节点
-
-    if (attributes["destination_type"] === "ip") {
-      target = "ip:" + attributes["network_link.destination_ipv4"];
-    } // 翻译
-
+    }); // 翻译
 
     return _extends({}, link, {
-      target: target,
       attributes: _extends({}, attributes, {
         // 源/目的设备
         "network_link.source_device_id_object": {

package/es/core/viewer/components/plugins/ElementDetailDrawer/hooks/useElementDetailManager.js

@@ -1,4 +1,4 @@
-import React, { useRef } from 'react';
+import React, { useMemo } from 'react';
 import DefaultDetailContent from "../../ResourceDetail/DefaultDetailContent";
 
 function useElementDetailManager(props) {
@@ -160,6 +160,7 @@ function useElementDetailManager(props) {
 
     if (getCustomDetailContent) {
       widget = getCustomDetailContent({
+        topo: topo,
         id: id,
         resourceData: resourceData,
         htElement: htElement
@@ -178,18 +179,30 @@ function useElementDetailManager(props) {
   }
 
   function getDetailContentById(id) {
-    var htElement = topo.getDataModel().getDataByTag(id) || topo.getDataModel().getDataById(id.replace('ht:', ''));
+    var htElement = getHtElement(id);
     return getDetailContent({
       id: id,
       htElement: htElement
     });
   }
 
-  var Content = visible && id ? getDetailContentById(id) : null;
+  function getHtElement(id) {
+    var htElement = topo.getDataModel().getDataByTag(id) || topo.getDataModel().getDataById(id.replace('ht:', ''));
+    return htElement;
+  }
+
+  var htElement = useMemo(function () {
+    return visible ? getHtElement(id) : null;
+  }, [visible, id]);
+  var Content = visible && id ? getDetailContent({
+    id: id,
+    htElement: htElement
+  }) : null;
   var elementDetailManager = {
     visible: visible,
     id: id,
     resourceData: resourceData,
+    htElement: htElement,
     Content: Content,
     init: init,
     destroy: destroy,

package/es/core/viewer/components/plugins/ResourceDetail/DefaultDetailContent.js

@@ -7,7 +7,6 @@ export default function DefaultDetailContent(props) {
   var topo = props.topo,
       id = props.id,
       viewerProps = props.viewerProps,
-      onChangeActive = props.onChangeActive,
       onClose = props.onClose;
 
   var _useUserId = useUserId(),

package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailDrawer.js

@@ -20,6 +20,7 @@ function ResourceDetailDrawer(props) {
   });
   var visible = detailManager.visible,
       id = detailManager.id,
+      htElement = detailManager.htElement,
       resourceData = detailManager.resourceData,
       Content = detailManager.Content;
   useEffect(function () {
@@ -43,11 +44,10 @@ function ResourceDetailDrawer(props) {
     onClose: detailManager.close
   }, visible && /*#__PURE__*/React.createElement(Content, _extends({}, props, {
     topo: topo,
-    visible: visible,
     id: id,
+    htElement: htElement,
     viewerProps: viewerProps,
-    onClose: detailManager.close,
-    onChangeActive: detailManager.open
+    onClose: detailManager.close
   })));
 }
 

package/es/core/viewer/components/plugins/ResourceDetail/ResourceDetailPlugin.js

@@ -11,7 +11,7 @@ function ResourceDetailPlugin(props) {
   var _topo$store$useModelS = topo.store.useModelState('topoMod'),
       graphLoaded = _topo$store$useModelS.graphLoaded;
 
-  if (graphLoaded || hideResourceDetailDrawer) {
+  if (!graphLoaded || hideResourceDetailDrawer) {
     return null;
   }
 

package/es/networkTopo/models/EdgeGroupTagTipBuilder.js

@@ -0,0 +1,49 @@
+import { getEdgeGroups } from "../../utils/htElementUtils";
+import { getEdgeGroupLinkIdConfig } from "../utils/edgeGroupTagUtil";
+
+var EdgeGroupTagTipBuilder = /*#__PURE__*/function () {
+  function EdgeGroupTagTipBuilder(amDisplay) {
+    this.amDisplay = void 0;
+    this.topo = void 0;
+    this.amDisplay = amDisplay;
+    this.topo = amDisplay.topo;
+  }
+
+  var _proto = EdgeGroupTagTipBuilder.prototype;
+
+  _proto.getExtElementTagsAndTips = function getExtElementTagsAndTips() {
+    var _this = this;
+
+    var topo = this.topo;
+    var dm = this.topo.getDataModel();
+    var edgeGroupsTagsTips = getEdgeGroups(dm).map(function (edgeGroup) {
+      var edge = edgeGroup.getEdges().getArray()[0]; // 获取配置的链路
+
+      var linkId = getEdgeGroupLinkIdConfig(edge, topo);
+      var edgeGroupId = [edge.getSource().getId(), edge.getTarget().getId()];
+      var data = {
+        tags: [],
+        tips: []
+      };
+
+      if (linkId) {
+        data = _this.amDisplay.buildElementTagsTips(linkId);
+      }
+
+      return {
+        // edgeGroupId,
+        tags: data.tags,
+        tips: data.tips,
+        type: 'edgeGroup'
+      };
+    }).filter(function (item) {
+      return !!item;
+    });
+    return edgeGroupsTagsTips;
+  };
+
+  return EdgeGroupTagTipBuilder;
+}();
+
+export { EdgeGroupTagTipBuilder as default };
+;

package/es/networkTopo/models/ExtElementTagTipBuilder.js

@@ -0,0 +1,22 @@
+import IpNodeTagsTipsBuilder from "./IpNodeTagsTipsBuilder";
+import EdgeGroupTagTipBuilder from "./EdgeGroupTagTipBuilder";
+
+var ExtElementTagTipBuilder = /*#__PURE__*/function () {
+  function ExtElementTagTipBuilder(amDisplay) {
+    this.amDisplay = void 0;
+    this.topo = void 0;
+    this.amDisplay = amDisplay;
+    this.topo = amDisplay.topo;
+  }
+
+  var _proto = ExtElementTagTipBuilder.prototype;
+
+  _proto.getExtElementTagsAndTips = function getExtElementTagsAndTips() {
+    return [].concat(new IpNodeTagsTipsBuilder(this.amDisplay).getExtElementTagsAndTips(), new EdgeGroupTagTipBuilder(this.amDisplay).getExtElementTagsAndTips());
+  };
+
+  return ExtElementTagTipBuilder;
+}();
+
+export { ExtElementTagTipBuilder as default };
+;

package/es/networkTopo/models/TopoCenter.js

@@ -9,7 +9,7 @@ import createMenuCommands from "../../contextmenu/createMenuCommands";
 import getTopoData from "../getTopoData";
 import customStoreModels from "../store";
 import { DEFAULT_LINK_TAG_COMMON_CONFIG, DEFAULT_TIP_COMMON_CONFIG } from "../../constants/ResourceInfoDisplay";
-import IpNodeTagsTipsBuilder from "./IpNodeTagsTipsBuilder";
+import ExtElementTagTipBuilder from "./ExtElementTagTipBuilder";
 
 var TopoCenter = /*#__PURE__*/function (_TopoApp) {
   _inheritsLoose(TopoCenter, _TopoApp);
@@ -30,7 +30,7 @@ var TopoCenter = /*#__PURE__*/function (_TopoApp) {
         getDefaultLinkTipConfig: function getDefaultLinkTipConfig() {
           return DEFAULT_TIP_COMMON_CONFIG;
         },
-        ExtElementTagTipBuilder: IpNodeTagsTipsBuilder
+        extElementTagTipBuilder: ExtElementTagTipBuilder
       }
     })) || this;
     _this.resourceConfig = null;

package/es/networkTopo/utils/edgeGroupTagUtil.js

@@ -0,0 +1,10 @@
+// 获得连线组标注配置的链路id。无配置时取默认链路
+export function getEdgeGroupLinkIdConfig(edgeGroup, topo) {
+  var _links$;
+
+  // const { } = options
+  var sourceId = edgeGroup.getSource().getTag();
+  var targetId = edgeGroup.getTarget().getTag();
+  var links = topo.dataModel.getEdgesBetweenTwoNodes(sourceId, targetId);
+  return (_links$ = links[0]) === null || _links$ === void 0 ? void 0 : _links$.id;
+}

package/es/utils/htElementUtils.js

@@ -202,6 +202,9 @@ export function getEdgeGroups(dataModel) {
   });
   return edgeGroups;
 }
+export function getEdgeGroupAgents(dataModel) {
+  return getEdges(dataModel).filter(isEdgeGroupAgent);
+}
 export function getEdgeDatas(dataModel) {
   return getEdges(dataModel).map(function (element) {
     var _element$getSource, _element$getTarget;

package/lib/components/ColorPanel/components/FontColorRange/index.js

@@ -44,7 +44,9 @@ function FontColorRange(props) {
     onProcess: setValue
   })), /*#__PURE__*/_react["default"].createElement("div", {
     className: _indexModule["default"].unit
-  }, value, unit));
+  }, value, /*#__PURE__*/_react["default"].createElement("span", {
+    className: _indexModule["default"].unitSpan
+  }, unit)));
 }
 
 var _default = FontColorRange;

package/lib/components/ColorPanel/components/FontColorRange/index.module.scss

@@ -15,6 +15,9 @@
     margin-right: 8px;
     width: 32px;
     text-align: right;
+    color:$color-text1-4;
+  }
+  .unitSpan{
     color:$color-text1-6;
   }
 

package/lib/core/editor/components/Sidebar/views/ImagePanel/HtCustomImagePanel.js

@@ -60,6 +60,13 @@ function HtCustomImagePanel(props) {
       }
     };
   }, []);
+  (0, _react.useEffect)(function () {
+    var view = viewRef.current;
+
+    if (view && view.setIcons) {
+      view.setIcons(icons);
+    }
+  }, [icons]);
   return /*#__PURE__*/_react["default"].createElement("div", {
     ref: divRef,
     className: _HtImagePaletteModule["default"].container

package/lib/core/editor/components/Sidebar/views/ImagePanel/ImagePanel.js

@@ -87,6 +87,7 @@ function ImagePanel(props) {
   var renderImageContent = function renderImageContent() {
     var panels = [{
       key: '资源图片',
+      hidden: searchValue && !resourceIcons.length,
       render: function render() {
         return /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
           key: "\u8D44\u6E90\u56FE\u7247",
@@ -98,6 +99,7 @@ function ImagePanel(props) {
       }
     }, {
       key: '基础图片',
+      hidden: searchValue && !basicIcons.length,
       render: function render() {
         return /*#__PURE__*/_react["default"].createElement(CollapsePanel, {
           key: "\u57FA\u7840\u56FE\u7247",

package/lib/core/editor/components/Toolbar/widgets/BoxBackgroundButton/BoxbackgroundSettings.module.scss

@@ -68,7 +68,7 @@
       flex-direction: row;
       .backOpacityLable{
         margin-left: 16px;
-        line-height: 22px;
+        line-height: 24px;
         margin-right: 5px;
         color:$color-text1-6;
       }