@leankylin-sheet/react 5.2.37 → 5.2.39

package/dist/index.css

@@ -1271,14 +1271,26 @@ html::-webkit-scrollbar-button {
   position: absolute;
   padding: 24px 28px;
   z-index: 1002;
-  min-width: 520px;
+  width: 720px;
+  height: 560px;
   max-height: calc(100vh - 60px);
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
   overflow-y: auto;
   font-family:
     -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
     Arial, sans-serif;
 }
 
+/* 内容容器：占满弹框，结果列表占剩余空间 */
+#leankylin-search-replace .container {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+}
+
 /* 关闭按钮 */
 #leankylin-search-replace .icon-close {
   width: 28px;
@@ -1353,7 +1365,7 @@ html::-webkit-scrollbar-button {
   padding: 0;
   border: none;
   font-size: 13px;
-  min-width: 460px;
+  min-width: 640px;
 }
 
 #leankylin-search-replace .ctBox .row {
@@ -1580,9 +1592,10 @@ html::-webkit-scrollbar-button {
   border-color: #aaa;
 }
 
-/* 搜索结果列表 */
+/* 搜索结果列表：占满剩余空间，内部滚动 */
 #leankylin-search-replace #searchAllbox {
-  height: 210px;
+  flex: 1;
+  min-height: 120px;
   border: 1px solid #e8e8e8;
   border-radius: 6px;
   margin-top: 14px;
@@ -1616,20 +1629,29 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(1) {
-  width: 25%;
+  width: 12%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(2) {
-  width: 25%;
+  width: 9%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(3) {
-  width: 50%;
+  width: 24%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(4) {
+  width: 30%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(5) {
+  width: 25%;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem {
-  height: 32px;
-  line-height: 32px;
+  display: flex;
+  align-items: center;
+  min-height: 32px;
   border-bottom: 1px solid #f0f0f0;
   padding: 0 10px;
   box-sizing: border-box;
@@ -1652,21 +1674,27 @@ html::-webkit-scrollbar-button {
   color: #fff;
 }
 
+#leankylin-search-replace #searchAllbox .boxMain .boxItem.on span {
+  color: #fff;
+}
+
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span {
+  flex: 0 0 auto;
   display: block;
   text-align: center;
-  float: left;
+  box-sizing: border-box;
+  padding: 6px 4px;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(1) {
-  width: 25%;
+  flex-basis: 12%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(2) {
-  width: 25%;
+  flex-basis: 9%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1675,7 +1703,23 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(3) {
-  width: 50%;
+  flex-basis: 24%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(4) {
+  flex-basis: 30%;
+  white-space: normal;
+  word-break: break-all;
+  line-height: 1.4;
+  font-family: "SF Mono", "Fira Code", Menlo, monospace;
+  font-size: 12px;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(5) {
+  flex-basis: 25%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

package/dist/index.esm.css

@@ -1271,14 +1271,26 @@ html::-webkit-scrollbar-button {
   position: absolute;
   padding: 24px 28px;
   z-index: 1002;
-  min-width: 520px;
+  width: 720px;
+  height: 560px;
   max-height: calc(100vh - 60px);
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
   overflow-y: auto;
   font-family:
     -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
     Arial, sans-serif;
 }
 
+/* 内容容器：占满弹框，结果列表占剩余空间 */
+#leankylin-search-replace .container {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+}
+
 /* 关闭按钮 */
 #leankylin-search-replace .icon-close {
   width: 28px;
@@ -1353,7 +1365,7 @@ html::-webkit-scrollbar-button {
   padding: 0;
   border: none;
   font-size: 13px;
-  min-width: 460px;
+  min-width: 640px;
 }
 
 #leankylin-search-replace .ctBox .row {
@@ -1580,9 +1592,10 @@ html::-webkit-scrollbar-button {
   border-color: #aaa;
 }
 
-/* 搜索结果列表 */
+/* 搜索结果列表：占满剩余空间，内部滚动 */
 #leankylin-search-replace #searchAllbox {
-  height: 210px;
+  flex: 1;
+  min-height: 120px;
   border: 1px solid #e8e8e8;
   border-radius: 6px;
   margin-top: 14px;
@@ -1616,20 +1629,29 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(1) {
-  width: 25%;
+  width: 12%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(2) {
-  width: 25%;
+  width: 9%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(3) {
-  width: 50%;
+  width: 24%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(4) {
+  width: 30%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(5) {
+  width: 25%;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem {
-  height: 32px;
-  line-height: 32px;
+  display: flex;
+  align-items: center;
+  min-height: 32px;
   border-bottom: 1px solid #f0f0f0;
   padding: 0 10px;
   box-sizing: border-box;
@@ -1652,21 +1674,27 @@ html::-webkit-scrollbar-button {
   color: #fff;
 }
 
+#leankylin-search-replace #searchAllbox .boxMain .boxItem.on span {
+  color: #fff;
+}
+
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span {
+  flex: 0 0 auto;
   display: block;
   text-align: center;
-  float: left;
+  box-sizing: border-box;
+  padding: 6px 4px;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(1) {
-  width: 25%;
+  flex-basis: 12%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(2) {
-  width: 25%;
+  flex-basis: 9%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1675,7 +1703,23 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(3) {
-  width: 50%;
+  flex-basis: 24%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(4) {
+  flex-basis: 30%;
+  white-space: normal;
+  word-break: break-all;
+  line-height: 1.4;
+  font-family: "SF Mono", "Fira Code", Menlo, monospace;
+  font-size: 12px;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(5) {
+  flex-basis: 25%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

package/dist/index.esm.js

@@ -1165,6 +1165,7 @@ var InputBox = function InputBox() {
   var row_index = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.row_focus;
   var col_index = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.column_focus;
   var preText = useRef("");
+  var prevCellRef = useRef();
   useLayoutEffect(function () {
     if (!context.allowEdit) {
       setContext(function (ctx) {
@@ -1181,11 +1182,18 @@ var InputBox = function InputBox() {
         delete refs.globalCache.doNotUpdateCell;
         return;
       }
-      if (_.isEqual(prevCellUpdate, context.luckysheetCellUpdate) && prevSheetId === context.currentSheetId) {
-        return;
-      }
       var flowdata = getFlowdata(context);
       var cell = flowdata === null || flowdata === void 0 ? void 0 : (_flowdata$row_index = flowdata[row_index]) === null || _flowdata$row_index === void 0 ? void 0 : _flowdata$row_index[col_index];
+      var selectionChanged = !_.isEqual(prevCellUpdate, context.luckysheetCellUpdate) || prevSheetId !== context.currentSheetId;
+      var cellChanged = !prevCellRef.current || prevCellRef.current.r !== row_index || prevCellRef.current.c !== col_index || prevCellRef.current.cell !== cell;
+      if (!selectionChanged && !cellChanged) {
+        return;
+      }
+      prevCellRef.current = {
+        r: row_index,
+        c: col_index,
+        cell: cell
+      };
       var value = "";
       if (cell && !refs.globalCache.overwriteCell) {
         if (isInlineStringCell(cell)) {
@@ -1564,15 +1572,17 @@ var SearchReplace = function SearchReplace() {
       _.set(draft, mode, value);
     }));
   }, []);
-  var getInitialPosition = useCallback(function (container) {
-    var rect = container.getBoundingClientRect();
-    var estimatedHeight = 520;
-    var dialogWidth = 500;
-    var top = Math.max(40, Math.min((rect.height - estimatedHeight) / 2, rect.height - estimatedHeight - 20));
-    return {
-      left: Math.max(20, (rect.width - dialogWidth) / 2),
-      top: Number.isFinite(top) && top > 0 ? top : 40
-    };
+  var dialogRef = useRef(null);
+  useLayoutEffect(function () {
+    var box = dialogRef.current;
+    if (!box) return;
+    var viewportWidth = window.innerWidth;
+    var viewportHeight = window.innerHeight;
+    var dialogWidth = box.offsetWidth;
+    var estimatedHeight = 560;
+    var top = Math.max(40, Math.min((viewportHeight - estimatedHeight) / 2, viewportHeight - estimatedHeight - 20));
+    box.style.left = "".concat(Math.max(20, (viewportWidth - dialogWidth) / 2), "px");
+    box.style.top = "".concat(Number.isFinite(top) && top > 0 ? top : 40, "px");
   }, []);
   var body = document.body;
   return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
@@ -1581,7 +1591,7 @@ var SearchReplace = function SearchReplace() {
     },
     id: "leankylin-search-replace",
     className: "leankylin-search-replace leankylin-dialog",
-    style: getInitialPosition(body),
+    ref: dialogRef,
     onMouseEnter: function onMouseEnter() {
       _.set(refs.globalCache, "searchDialog.mouseEnter", true);
     },
@@ -1758,7 +1768,7 @@ var SearchReplace = function SearchReplace() {
     }
   }, /*#__PURE__*/React.createElement("div", {
     className: "boxTitle"
-  }, /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetSheet), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetCell), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetValue)), /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetSheet), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetCell), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetValue), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetFormula), /*#__PURE__*/React.createElement("span", null, findAndReplace.searchTargetDisplayValue)), /*#__PURE__*/React.createElement("div", {
     className: "boxMain"
   }, searchResult.map(function (v) {
     return /*#__PURE__*/React.createElement("div", {
@@ -1783,7 +1793,7 @@ var SearchReplace = function SearchReplace() {
           c: v.c
         });
       }
-    }, /*#__PURE__*/React.createElement("span", null, v.sheetName), /*#__PURE__*/React.createElement("span", null, v.cellPosition), /*#__PURE__*/React.createElement("span", null, v.value));
+    }, /*#__PURE__*/React.createElement("span", null, v.sheetName), /*#__PURE__*/React.createElement("span", null, v.cellPosition), /*#__PURE__*/React.createElement("span", null, v.value), /*#__PURE__*/React.createElement("span", null, v.formula), /*#__PURE__*/React.createElement("span", null, v.displayValue));
   })))))), body);
 };
 
@@ -10566,17 +10576,7 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
       var isrefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       setContext(function (draftCtx) {
         api.updateFunctionGroup(draftCtx);
-        if (sheetId) {
-          api.calculateSheetFromula(draftCtx, sheetId, isrefresh);
-        } else {
-          if (isrefresh) {
-            api.calculateSheetFromula(draftCtx, '', isrefresh);
-          } else {
-            _.forEach(draftCtx.luckysheetfile, function (sheet_obj) {
-              api.calculateSheetFromula(draftCtx, sheet_obj.id, isrefresh);
-            });
-          }
-        }
+        api.calculateSheetFromula(draftCtx, sheetId, isrefresh);
       });
     },
     calculateSheetByCells: function calculateSheetByCells(cells) {

package/dist/index.js

@@ -1175,6 +1175,7 @@ var InputBox = function InputBox() {
   var row_index = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.row_focus;
   var col_index = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.column_focus;
   var preText = React.useRef("");
+  var prevCellRef = React.useRef();
   React.useLayoutEffect(function () {
     if (!context.allowEdit) {
       setContext(function (ctx) {
@@ -1191,11 +1192,18 @@ var InputBox = function InputBox() {
         delete refs.globalCache.doNotUpdateCell;
         return;
       }
-      if (___default['default'].isEqual(prevCellUpdate, context.luckysheetCellUpdate) && prevSheetId === context.currentSheetId) {
-        return;
-      }
       var flowdata = core.getFlowdata(context);
       var cell = flowdata === null || flowdata === void 0 ? void 0 : (_flowdata$row_index = flowdata[row_index]) === null || _flowdata$row_index === void 0 ? void 0 : _flowdata$row_index[col_index];
+      var selectionChanged = !___default['default'].isEqual(prevCellUpdate, context.luckysheetCellUpdate) || prevSheetId !== context.currentSheetId;
+      var cellChanged = !prevCellRef.current || prevCellRef.current.r !== row_index || prevCellRef.current.c !== col_index || prevCellRef.current.cell !== cell;
+      if (!selectionChanged && !cellChanged) {
+        return;
+      }
+      prevCellRef.current = {
+        r: row_index,
+        c: col_index,
+        cell: cell
+      };
       var value = "";
       if (cell && !refs.globalCache.overwriteCell) {
         if (core.isInlineStringCell(cell)) {
@@ -1574,15 +1582,17 @@ var SearchReplace = function SearchReplace() {
       ___default['default'].set(draft, mode, value);
     }));
   }, []);
-  var getInitialPosition = React.useCallback(function (container) {
-    var rect = container.getBoundingClientRect();
-    var estimatedHeight = 520;
-    var dialogWidth = 500;
-    var top = Math.max(40, Math.min((rect.height - estimatedHeight) / 2, rect.height - estimatedHeight - 20));
-    return {
-      left: Math.max(20, (rect.width - dialogWidth) / 2),
-      top: Number.isFinite(top) && top > 0 ? top : 40
-    };
+  var dialogRef = React.useRef(null);
+  React.useLayoutEffect(function () {
+    var box = dialogRef.current;
+    if (!box) return;
+    var viewportWidth = window.innerWidth;
+    var viewportHeight = window.innerHeight;
+    var dialogWidth = box.offsetWidth;
+    var estimatedHeight = 560;
+    var top = Math.max(40, Math.min((viewportHeight - estimatedHeight) / 2, viewportHeight - estimatedHeight - 20));
+    box.style.left = "".concat(Math.max(20, (viewportWidth - dialogWidth) / 2), "px");
+    box.style.top = "".concat(Number.isFinite(top) && top > 0 ? top : 40, "px");
   }, []);
   var body = document.body;
   return /*#__PURE__*/reactDom.createPortal( /*#__PURE__*/React__default['default'].createElement("div", {
@@ -1591,7 +1601,7 @@ var SearchReplace = function SearchReplace() {
     },
     id: "leankylin-search-replace",
     className: "leankylin-search-replace leankylin-dialog",
-    style: getInitialPosition(body),
+    ref: dialogRef,
     onMouseEnter: function onMouseEnter() {
       ___default['default'].set(refs.globalCache, "searchDialog.mouseEnter", true);
     },
@@ -1768,7 +1778,7 @@ var SearchReplace = function SearchReplace() {
     }
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     className: "boxTitle"
-  }, /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetSheet), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetCell), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetValue)), /*#__PURE__*/React__default['default'].createElement("div", {
+  }, /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetSheet), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetCell), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetValue), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetFormula), /*#__PURE__*/React__default['default'].createElement("span", null, findAndReplace.searchTargetDisplayValue)), /*#__PURE__*/React__default['default'].createElement("div", {
     className: "boxMain"
   }, searchResult.map(function (v) {
     return /*#__PURE__*/React__default['default'].createElement("div", {
@@ -1793,7 +1803,7 @@ var SearchReplace = function SearchReplace() {
           c: v.c
         });
       }
-    }, /*#__PURE__*/React__default['default'].createElement("span", null, v.sheetName), /*#__PURE__*/React__default['default'].createElement("span", null, v.cellPosition), /*#__PURE__*/React__default['default'].createElement("span", null, v.value));
+    }, /*#__PURE__*/React__default['default'].createElement("span", null, v.sheetName), /*#__PURE__*/React__default['default'].createElement("span", null, v.cellPosition), /*#__PURE__*/React__default['default'].createElement("span", null, v.value), /*#__PURE__*/React__default['default'].createElement("span", null, v.formula), /*#__PURE__*/React__default['default'].createElement("span", null, v.displayValue));
   })))))), body);
 };
 
@@ -10576,17 +10586,7 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
       var isrefresh = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
       setContext(function (draftCtx) {
         core.api.updateFunctionGroup(draftCtx);
-        if (sheetId) {
-          core.api.calculateSheetFromula(draftCtx, sheetId, isrefresh);
-        } else {
-          if (isrefresh) {
-            core.api.calculateSheetFromula(draftCtx, '', isrefresh);
-          } else {
-            ___default['default'].forEach(draftCtx.luckysheetfile, function (sheet_obj) {
-              core.api.calculateSheetFromula(draftCtx, sheet_obj.id, isrefresh);
-            });
-          }
-        }
+        core.api.calculateSheetFromula(draftCtx, sheetId, isrefresh);
       });
     },
     calculateSheetByCells: function calculateSheetByCells(cells) {

package/dist/index.umd.css

@@ -1271,14 +1271,26 @@ html::-webkit-scrollbar-button {
   position: absolute;
   padding: 24px 28px;
   z-index: 1002;
-  min-width: 520px;
+  width: 720px;
+  height: 560px;
   max-height: calc(100vh - 60px);
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
   overflow-y: auto;
   font-family:
     -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
     Arial, sans-serif;
 }
 
+/* 内容容器：占满弹框，结果列表占剩余空间 */
+#leankylin-search-replace .container {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+}
+
 /* 关闭按钮 */
 #leankylin-search-replace .icon-close {
   width: 28px;
@@ -1353,7 +1365,7 @@ html::-webkit-scrollbar-button {
   padding: 0;
   border: none;
   font-size: 13px;
-  min-width: 460px;
+  min-width: 640px;
 }
 
 #leankylin-search-replace .ctBox .row {
@@ -1580,9 +1592,10 @@ html::-webkit-scrollbar-button {
   border-color: #aaa;
 }
 
-/* 搜索结果列表 */
+/* 搜索结果列表：占满剩余空间，内部滚动 */
 #leankylin-search-replace #searchAllbox {
-  height: 210px;
+  flex: 1;
+  min-height: 120px;
   border: 1px solid #e8e8e8;
   border-radius: 6px;
   margin-top: 14px;
@@ -1616,20 +1629,29 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(1) {
-  width: 25%;
+  width: 12%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(2) {
-  width: 25%;
+  width: 9%;
 }
 
 #leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(3) {
-  width: 50%;
+  width: 24%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(4) {
+  width: 30%;
+}
+
+#leankylin-search-replace #searchAllbox .boxTitle span:nth-of-type(5) {
+  width: 25%;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem {
-  height: 32px;
-  line-height: 32px;
+  display: flex;
+  align-items: center;
+  min-height: 32px;
   border-bottom: 1px solid #f0f0f0;
   padding: 0 10px;
   box-sizing: border-box;
@@ -1652,21 +1674,27 @@ html::-webkit-scrollbar-button {
   color: #fff;
 }
 
+#leankylin-search-replace #searchAllbox .boxMain .boxItem.on span {
+  color: #fff;
+}
+
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span {
+  flex: 0 0 auto;
   display: block;
   text-align: center;
-  float: left;
+  box-sizing: border-box;
+  padding: 6px 4px;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(1) {
-  width: 25%;
+  flex-basis: 12%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(2) {
-  width: 25%;
+  flex-basis: 9%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -1675,7 +1703,23 @@ html::-webkit-scrollbar-button {
 }
 
 #leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(3) {
-  width: 50%;
+  flex-basis: 24%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(4) {
+  flex-basis: 30%;
+  white-space: normal;
+  word-break: break-all;
+  line-height: 1.4;
+  font-family: "SF Mono", "Fira Code", Menlo, monospace;
+  font-size: 12px;
+}
+
+#leankylin-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(5) {
+  flex-basis: 25%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;