@leankylin-sheet/react 3.1.45 → 3.1.47

package/dist/index.esm.js

@@ -723,6 +723,11 @@ var ContentEditable = function ContentEditable(_ref) {
       var _settings$onClickCont;
       e.stopPropagation();
       (_settings$onClickCont = settings.onClickContentEditable) === null || _settings$onClickCont === void 0 ? void 0 : _settings$onClickCont.call(settings, e);
+    },
+    onMouseEnter: function onMouseEnter(e) {
+      var _settings$onClickCont2;
+      e.stopPropagation();
+      (_settings$onClickCont2 = settings.onClickContentEditable) === null || _settings$onClickCont2 === void 0 ? void 0 : _settings$onClickCont2.call(settings, e);
     }
   }, _.omit(props, "innerRef", "onChange", "html", "onBlur", "autoFocus", "allowEdit", "initialContent")), {}, {
     ref: function ref(e) {
@@ -920,6 +925,7 @@ var FormulaSearch = function FormulaSearch(props) {
     _useState2 = _slicedToArray(_useState, 2),
     n = _useState2[0],
     setN = _useState2[1];
+  var wrapperRf = useRef(null);
   var nRef = useRef(n);
   nRef.current = n;
   useEffect(function () {
@@ -940,6 +946,16 @@ var FormulaSearch = function FormulaSearch(props) {
     refs.cellInput.current.innerHTML = functionHTMLGenerate(newText);
     moveCursorToPosition(refs.cellInput.current, offsetIndex - replaceTextLength + fnName.length);
   };
+  var viewActive = function viewActive() {
+    var _wrapperRf$current;
+    var aItem = (_wrapperRf$current = wrapperRf.current) === null || _wrapperRf$current === void 0 ? void 0 : _wrapperRf$current.querySelector(".luckysheet-formula-search-item-active");
+    if (aItem) {
+      aItem === null || aItem === void 0 ? void 0 : aItem.scrollIntoView({
+        block: "nearest",
+        behavior: "smooth"
+      });
+    }
+  };
   useEffect(function () {
     var _refs$cellInput$curre2;
     var onChange = function onChange(e) {
@@ -956,6 +972,9 @@ var FormulaSearch = function FormulaSearch(props) {
           }), 0);
           return (_fListRef$current3 = fListRef.current[(currentIndex + 1) % fListRef.current.length]) === null || _fListRef$current3 === void 0 ? void 0 : _fListRef$current3.n;
         });
+        setTimeout(function () {
+          viewActive();
+        }, 200);
       } else if (e.key === "ArrowUp") {
         e.preventDefault();
         setN(function (_n) {
@@ -965,6 +984,9 @@ var FormulaSearch = function FormulaSearch(props) {
           }), 0);
           return (_fListRef$current5 = fListRef.current[(currentIndex - 1) % fListRef.current.length]) === null || _fListRef$current5 === void 0 ? void 0 : _fListRef$current5.n;
         });
+        setTimeout(function () {
+          viewActive();
+        }, 200);
       } else if (e.key === "Enter") {
         e.preventDefault();
         e.stopPropagation();
@@ -986,6 +1008,7 @@ var FormulaSearch = function FormulaSearch(props) {
   return /*#__PURE__*/React.createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
     id: "luckysheet-formula-search-c",
     className: "luckysheet-formula-search-c",
+    ref: wrapperRf,
     onWheel: function onWheel(e) {
       e.preventDefault();
       e.stopPropagation();

package/dist/index.js

@@ -733,6 +733,11 @@ var ContentEditable = function ContentEditable(_ref) {
       var _settings$onClickCont;
       e.stopPropagation();
       (_settings$onClickCont = settings.onClickContentEditable) === null || _settings$onClickCont === void 0 ? void 0 : _settings$onClickCont.call(settings, e);
+    },
+    onMouseEnter: function onMouseEnter(e) {
+      var _settings$onClickCont2;
+      e.stopPropagation();
+      (_settings$onClickCont2 = settings.onClickContentEditable) === null || _settings$onClickCont2 === void 0 ? void 0 : _settings$onClickCont2.call(settings, e);
     }
   }, ___default['default'].omit(props, "innerRef", "onChange", "html", "onBlur", "autoFocus", "allowEdit", "initialContent")), {}, {
     ref: function ref(e) {
@@ -930,6 +935,7 @@ var FormulaSearch = function FormulaSearch(props) {
     _useState2 = _slicedToArray(_useState, 2),
     n = _useState2[0],
     setN = _useState2[1];
+  var wrapperRf = React.useRef(null);
   var nRef = React.useRef(n);
   nRef.current = n;
   React.useEffect(function () {
@@ -950,6 +956,16 @@ var FormulaSearch = function FormulaSearch(props) {
     refs.cellInput.current.innerHTML = core.functionHTMLGenerate(newText);
     moveCursorToPosition(refs.cellInput.current, offsetIndex - replaceTextLength + fnName.length);
   };
+  var viewActive = function viewActive() {
+    var _wrapperRf$current;
+    var aItem = (_wrapperRf$current = wrapperRf.current) === null || _wrapperRf$current === void 0 ? void 0 : _wrapperRf$current.querySelector(".luckysheet-formula-search-item-active");
+    if (aItem) {
+      aItem === null || aItem === void 0 ? void 0 : aItem.scrollIntoView({
+        block: "nearest",
+        behavior: "smooth"
+      });
+    }
+  };
   React.useEffect(function () {
     var _refs$cellInput$curre2;
     var onChange = function onChange(e) {
@@ -966,6 +982,9 @@ var FormulaSearch = function FormulaSearch(props) {
           }), 0);
           return (_fListRef$current3 = fListRef.current[(currentIndex + 1) % fListRef.current.length]) === null || _fListRef$current3 === void 0 ? void 0 : _fListRef$current3.n;
         });
+        setTimeout(function () {
+          viewActive();
+        }, 200);
       } else if (e.key === "ArrowUp") {
         e.preventDefault();
         setN(function (_n) {
@@ -975,6 +994,9 @@ var FormulaSearch = function FormulaSearch(props) {
           }), 0);
           return (_fListRef$current5 = fListRef.current[(currentIndex - 1) % fListRef.current.length]) === null || _fListRef$current5 === void 0 ? void 0 : _fListRef$current5.n;
         });
+        setTimeout(function () {
+          viewActive();
+        }, 200);
       } else if (e.key === "Enter") {
         e.preventDefault();
         e.stopPropagation();
@@ -996,6 +1018,7 @@ var FormulaSearch = function FormulaSearch(props) {
   return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
     id: "luckysheet-formula-search-c",
     className: "luckysheet-formula-search-c",
+    ref: wrapperRf,
     onWheel: function onWheel(e) {
       e.preventDefault();
       e.stopPropagation();

package/dist/index.umd.js

@@ -34073,7 +34073,9 @@
             return 5;
         }
       },
-      rules: [/^(?:\s+)/, /^(?:"(\\["]|[^"])*")/, /^(?:'(\\[']|[^'])*'[^'!])/, /^(?:[A-Za-z]{1,}[A-Za-z_0-9\.]+(?=[(]))/, /^(?:#[A-Z0-9\/]+(!|\?)?)/, ABSOLUTE_CELL, MIXED_CELL_COL, MIXED_CELL_ROW, RELATIVE_CELL, /^(?:[A-Za-z\.]+(?=[(]))/, /^(?:[A-Za-z]{1,}[A-Za-z_0-9]+)/, /^(?:[A-Za-z_]+)/, /^(?:[0-9]+)/, /^(?:\[(.*)?\])/, /^(?:&)/, /^(?: )/, /^(?:[.])/, /^(?::)/, /^(?:;)/, /^(?:,)/, /^(?:\*)/, /^(?:\/)/, /^(?:-)/, /^(?:\+)/, /^(?:\^)/, /^(?:\()/, /^(?:\))/, /^(?:>)/, /^(?:<)/, /^(?:NOT\b)/, /^(?:")/, /^(?:')/, /^(?:!)/, /^(?:=)/, /^(?:%)/, /^(?:[#])/, /^(?:$)/],
+      rules: [/^(?:\s+)/, /^(?:"(\\["]|[^"])*")/, /^(?:'(\\[']|[^'])*'[^'!])/, /^(?:[A-Za-z]{1,}[A-Za-z_0-9\.]+(?=[(]))/, /^(?:#[A-Z0-9\/]+(!|\?)?)/, ABSOLUTE_CELL, MIXED_CELL_COL, MIXED_CELL_ROW, RELATIVE_CELL, /^(?:[A-Za-z\.]+(?=[(]))/, /^(?:[A-Za-z]{1,}[A-Za-z_0-9]+)/,
+      // /^(?:[A-Za-z_]+)/,
+      /^(?:\{\{[^{}}]+\}\})/, /^(?:[0-9]+)/, /^(?:\[(.*)?\])/, /^(?:&)/, /^(?: )/, /^(?:[.])/, /^(?::)/, /^(?:;)/, /^(?:,)/, /^(?:\*)/, /^(?:\/)/, /^(?:-)/, /^(?:\+)/, /^(?:\^)/, /^(?:\()/, /^(?:\))/, /^(?:>)/, /^(?:<)/, /^(?:NOT\b)/, /^(?:")/, /^(?:')/, /^(?:!)/, /^(?:=)/, /^(?:%)/, /^(?:[#])/, /^(?:$)/],
       conditions: {
         INITIAL: {
           rules: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36],
@@ -34305,7 +34307,11 @@
         this.variables[name] = value;
         return this;
       }
-
+    }, {
+      key: "replaceVariables",
+      value: function replaceVariables(variables) {
+        this.variables = variables;
+      }
       /**
        * Get variable name.
        *
@@ -71127,22 +71133,15 @@
     var f = [];
     var s = [];
     var t = [];
-    var result_i = 0;
     for (var _i17 = 0; _i17 < functionlist.length; _i17 += 1) {
       var item = functionlist[_i17];
       var n = item.n;
       if (n === searchtxt) {
         f.unshift(item);
-        result_i += 1;
       } else if (lodash.startsWith(n, searchtxt)) {
         s.unshift(item);
-        result_i += 1;
       } else if (n.indexOf(searchtxt) > -1) {
         t.unshift(item);
-        result_i += 1;
-      }
-      if (result_i >= 10) {
-        break;
       }
     }
     var list = [].concat(f, s, t);
@@ -71240,7 +71239,7 @@
   function rangeHightlightselected(ctx, $editor) {
     var currSelection = getrangeseleciton();
     if (!currSelection) return;
-    var currText = lodash.trim(currSelection.textContent || "");
+    var currText = lodash.trimStart(currSelection.textContent || "");
     if (currText === null || currText === void 0 ? void 0 : currText.match(/^[a-zA-Z_]+$/)) {
       searchFunction(ctx, currText.toUpperCase());
       ctx.functionHint = null;
@@ -71358,7 +71357,7 @@
         } else if (matchConfig.dquote > 0) {
           function_str += "".concat(str, "</span>");
         } else if (str.indexOf("</span>") === -1 && str.length > 0) {
-          var regx = /{.*?}/;
+          var regx = /{{.*?}}/;
           if (regx.test(lodash.trim(str))) {
             var arraytxt = regx.exec(str)[0];
             var arraystart = str.search(regx);
@@ -71366,7 +71365,7 @@
             if (arraystart > 0) {
               alltxt += "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">".concat(str.substr(0, arraystart), "</span>");
             }
-            alltxt += "<span dir=\"auto\" style=\"color:#959a05\" class=\"luckysheet-formula-text-array\">".concat(arraytxt, "</span>");
+            alltxt += "<span dir=\"auto\" style=\"color:#3b82f4\" class=\"luckysheet-formula-text-var\">".concat(arraytxt, "</span>");
             if (arraystart + arraytxt.length < str.length) {
               alltxt += "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">".concat(str.substr(arraystart + arraytxt.length, str.length), "</span>");
             }
@@ -71404,7 +71403,9 @@
     var value1txt = preText !== null && preText !== void 0 ? preText : $editor.innerText;
     var value = $editor.innerText;
     value = escapeScriptTag(value);
-    if (value.length > 0 && value.substring(0, 1) === "=" && (kcode !== 229 || value.length === 1)) {
+    var hasF = value.length > 0 && value.substring(0, 1) === "=" && (kcode !== 229 || value.length === 1);
+    var lastHasF = lodash.startsWith(value1txt, "=") && !lodash.startsWith(value, "=");
+    if (hasF) {
       if (!refreshRangeSelect) rangeIndexes = getRangeIndexes($editor);
       value = functionHTMLGenerate(value);
       if (!refreshRangeSelect && functionHTMLIndex < rangeIndexes.length) refreshRangeSelect = true;
@@ -71429,19 +71430,10 @@
       $editor.innerHTML = value;
       if ($copyTo) $copyTo.innerHTML = value;
       functionRange(ctx, $editor, value, value1);
-      if (refreshRangeSelect) {
-        cancelFunctionrangeSelected(ctx);
-        if (kcode !== 46) {
-          createRangeHightlight(ctx, value);
-        }
-        ctx.formulaCache.rangestart = false;
-        ctx.formulaCache.rangedrag_column_start = false;
-        ctx.formulaCache.rangedrag_row_start = false;
-        rangeHightlightselected(ctx, $editor);
-      }
-    } else if (lodash.startsWith(value1txt, "=") && !lodash.startsWith(value, "=")) {
+    } else if (lastHasF) {
       if ($copyTo) $copyTo.innerHTML = value;
       $editor.innerHTML = escapeHTMLTag(value);
+      ctx.formulaCache.functionRangeIndex = [0, 1];
     } else if (!lodash.startsWith(value1txt, "=")) {
       if (!$copyTo) return;
       if ($copyTo.id === "luckysheet-rich-text-editor") {
@@ -71452,6 +71444,18 @@
         $copyTo.innerHTML = escapeHTMLTag(value);
       }
     }
+    if (hasF || lastHasF) {
+      if (refreshRangeSelect) {
+        cancelFunctionrangeSelected(ctx);
+        if (kcode !== 46) {
+          createRangeHightlight(ctx, value);
+        }
+        ctx.formulaCache.rangestart = false;
+        ctx.formulaCache.rangedrag_column_start = false;
+        ctx.formulaCache.rangedrag_row_start = false;
+        rangeHightlightselected(ctx, $editor);
+      }
+    }
   }
   function isfreezonFuc(txt) {
     var row = txt.replace(/[^0-9]/g, "");
@@ -90167,6 +90171,19 @@
       }
     }
   }
+  function setCellValues(ctx, data, cellInput) {
+    var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
+    if (data == null) {
+      throw INVALID_PARAMS;
+    }
+    for (var j = 0; j < data.length; j += 1) {
+      var _data$j = data[j],
+        r = _data$j.r,
+        c = _data$j.c,
+        v = _data$j.v;
+      setCellValue$1(ctx, r, c, v, cellInput, options);
+    }
+  }
   function setCellFormatByRange(ctx, attr, value, range) {
     var options = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
     if (lodash.isPlainObject(range)) {
@@ -90291,6 +90308,7 @@
     getHtmlByRange: getHtmlByRange,
     setSelection: setSelection,
     setCellValuesByRange: setCellValuesByRange,
+    setCellValues: setCellValues,
     setCellFormatByRange: setCellFormatByRange,
     mergeCells: mergeCells$1,
     cancelMerge: cancelMerge,
@@ -90311,8 +90329,12 @@
   });
 
   var defaultSettings = {
+    toolbarRightRender: undefined,
+    onClickContentEditable: undefined,
+    renderCustomColor: undefined,
     renderFormulaHint: undefined,
     renderFormulaSearch: undefined,
+    renderEditorSelector: undefined,
     copyRich: false,
     renderCalcInfo: undefined,
     renderFreezeCol: undefined,
@@ -92602,14 +92624,32 @@
     };
   };
   var getCellMcBorder = function getCellMcBorder(ctx, domStyle, row_index, col_index, mc) {
-    var keys = [["border-left", "borderLeftWidth", "borderLeftColor", "borderLeftStyle"], ["border-top", "borderTopWidth", "borderTopColor", "borderTopStyle"], ["border-right", "borderRightWidth", "borderRightColor", "borderRightStyle"], ["border-bottom", "borderBottomWidth", "borderBottomColor", "borderBottomStyle"]];
+    var keys = [["border-left", "borderLeftWidth", "borderLeftColor", "borderLeftStyle", function (curIndex, rs) {
+      return [curIndex, curIndex + rs - 1];
+    }, function (curIndex) {
+      return [curIndex, curIndex];
+    }], ["border-top", "borderTopWidth", "borderTopColor", "borderTopStyle", function (curIndex) {
+      return [curIndex, curIndex];
+    }, function (curIndex, cs) {
+      return [curIndex, curIndex + cs - 1];
+    }], ["border-right", "borderRightWidth", "borderRightColor", "borderRightStyle", function (curIndex, rs) {
+      return [curIndex, curIndex + rs - 1];
+    }, function (curIndex, cs) {
+      return [curIndex + cs - 1, curIndex + cs - 1];
+    }], ["border-bottom", "borderBottomWidth", "borderBottomColor", "borderBottomStyle", function (curIndex, cs) {
+      return [curIndex + cs - 1, curIndex + cs - 1];
+    }, function (curIndex, cs) {
+      return [curIndex, curIndex + cs - 1];
+    }]];
     var result = [];
     for (var index = 0; index < keys.length; index += 1) {
-      var _keys$index2 = _slicedToArray$2(keys[index], 4),
+      var _keys$index2 = _slicedToArray$2(keys[index], 6),
         p = _keys$index2[0],
         w = _keys$index2[1],
         c = _keys$index2[2],
-        s = _keys$index2[3];
+        s = _keys$index2[3],
+        getRow = _keys$index2[4],
+        getColumn = _keys$index2[5];
       if (parseFloat(domStyle[w]) > 0 && domStyle[s] !== "inset") {
         var _getQKBorder = getQKBorder(domStyle[w], domStyle[s], domStyle[c]),
           _getQKBorder2 = _slicedToArray$2(_getQKBorder, 2),
@@ -92621,8 +92661,8 @@
           color: color,
           style: style,
           range: normalizeSelection(ctx, [{
-            row: [row_index, row_index + mc.rs - 1],
-            column: [col_index, col_index + mc.cs - 1]
+            row: getRow(row_index, mc.rs),
+            column: getColumn(col_index, mc.cs)
           }])
         });
       }
@@ -92669,13 +92709,17 @@
     }
     var result = [];
     var borderInfo = [];
+    var startOffColIndexMap = {};
     for (var index = 0; index < (rows === null || rows === void 0 ? void 0 : rows.length); index += 1) {
       var row = rows[index];
+      var isFirstNoRs = false;
       var cells = row.querySelectorAll("td");
       if (!result[index]) {
         result[index] = [];
       }
+      var offsetColIndex = 0;
       for (var cIndex = 0; cIndex < cells.length; cIndex += 1) {
+        var _colIndex = startCol + offsetColIndex + (startOffColIndexMap[index] || 0);
         var cell = cells[cIndex];
         var m = cell === null || cell === void 0 ? void 0 : cell.textContent;
         var v = cell.getAttribute("x:num");
@@ -92690,13 +92734,46 @@
           if (colspan > 1 || rowspan > 1) {
             mainCell.mc = {
               rs: rowspan,
-              cs: colspan
+              cs: colspan,
+              r: index + startRow,
+              c: _colIndex
             };
-            borderInfo.push.apply(borderInfo, _toConsumableArray$2(getCellMcBorder(ctx, style, index + startRow, cIndex + startCol, mainCell.mc)));
+            borderInfo.push.apply(borderInfo, _toConsumableArray$2(getCellMcBorder(ctx, style, index + startRow, _colIndex, mainCell.mc)));
           } else {
-            borderInfo.push(getCellBorder(style, index + startRow, cIndex + startCol));
+            isFirstNoRs = true;
+            borderInfo.push(getCellBorder(style, index + startRow, _colIndex));
           }
           result[index].push(mainCell);
+          if (rowspan > 1) {
+            for (var rs_index = 1; rs_index < rowspan; rs_index += 1) {
+              if (!result[index + rs_index]) {
+                result[index + rs_index] = [];
+              }
+              result[index + rs_index].push({
+                mc: {
+                  r: index + startRow,
+                  c: _colIndex
+                }
+              });
+              if (!isFirstNoRs) {
+                if (!startOffColIndexMap[index + rs_index]) {
+                  startOffColIndexMap[index + rs_index] = 0;
+                }
+                startOffColIndexMap[index + rs_index] += colspan || 1;
+              }
+            }
+          }
+          if (colspan > 1) {
+            for (var cs_index = 1; cs_index < colspan; cs_index += 1) {
+              result[index].push({
+                mc: {
+                  r: index + startRow,
+                  c: _colIndex
+                }
+              });
+            }
+          }
+          offsetColIndex += colspan || 1;
         } else {
           result[index].push({
             m: m,
@@ -92710,57 +92787,6 @@
       borderInfo: borderInfo
     };
   }
-  function expandMergedCells(mergedCells, startRow, startCol) {
-    if (!mergedCells || mergedCells.length === 0) {
-      return [];
-    }
-    var totalRows = mergedCells === null || mergedCells === void 0 ? void 0 : mergedCells.length;
-    var totalCols = 0;
-    for (var j = 0; j < mergedCells[0].length; j += 1) {
-      var _mergedCells$0$j, _mergedCells$0$j$mc;
-      totalCols += ((_mergedCells$0$j = mergedCells[0][j]) === null || _mergedCells$0$j === void 0 ? void 0 : (_mergedCells$0$j$mc = _mergedCells$0$j.mc) === null || _mergedCells$0$j$mc === void 0 ? void 0 : _mergedCells$0$j$mc.cs) || 1;
-    }
-    var result = Array.from({
-      length: totalRows
-    }, function () {
-      return new Array(totalCols);
-    });
-    var currentRow = 0;
-    for (var i = 0; i < mergedCells.length; i += 1) {
-      var currentCol = 0;
-      var rowHeight = 0;
-      for (var _j7 = 0; _j7 < mergedCells[i].length; _j7 += 1) {
-        var _cell$mc2, _cell$mc3;
-        var cell = mergedCells[i][_j7];
-        var rs = (cell === null || cell === void 0 ? void 0 : (_cell$mc2 = cell.mc) === null || _cell$mc2 === void 0 ? void 0 : _cell$mc2.rs) || 1;
-        var cs = (cell === null || cell === void 0 ? void 0 : (_cell$mc3 = cell.mc) === null || _cell$mc3 === void 0 ? void 0 : _cell$mc3.cs) || 1;
-        rowHeight = Math.max(rowHeight, rs);
-        for (var r = 0; r < rs; r += 1) {
-          for (var c = 0; c < cs; c += 1) {
-            var mcR = currentRow + startRow;
-            var mcC = currentCol + startCol;
-            if (r === 0 && c === 0) {
-              result[currentRow + r][currentCol + c] = _objectSpread2$1({}, cell);
-              if (result[currentRow + r][currentCol + c].mc) {
-                result[currentRow + r][currentCol + c].mc.r = mcR;
-                result[currentRow + r][currentCol + c].mc.c = mcC;
-              }
-            } else {
-              result[currentRow + r][currentCol + c] = {
-                mc: {
-                  r: mcR,
-                  c: mcC
-                }
-              };
-            }
-          }
-        }
-        currentCol += cs;
-      }
-      currentRow += rowHeight;
-    }
-    return result;
-  }
   function handlePasteByLeanklin(_x2, _x3, _x4) {
     return _handlePasteByLeanklin.apply(this, arguments);
   }
@@ -92796,7 +92822,7 @@
             }
             index = getSheetIndex(ctx, ctx.currentSheetId);
             ctx.luckysheetfile[index].config = ctx.config;
-            data = expandMergedCells(copyData, rows[0], columns[0]);
+            data = copyData;
             copyOne = data.length === 1 && data[0].length === 1 && !((_data$0$ = data[0][0]) === null || _data$0$ === void 0 ? void 0 : _data$0$.mc);
             pasteData = copyOne ? [] : data;
             if (copyOne) {
@@ -94045,6 +94071,11 @@
         var _settings$onClickCont;
         e.stopPropagation();
         (_settings$onClickCont = settings.onClickContentEditable) === null || _settings$onClickCont === void 0 ? void 0 : _settings$onClickCont.call(settings, e);
+      },
+      onMouseEnter: function onMouseEnter(e) {
+        var _settings$onClickCont2;
+        e.stopPropagation();
+        (_settings$onClickCont2 = settings.onClickContentEditable) === null || _settings$onClickCont2 === void 0 ? void 0 : _settings$onClickCont2.call(settings, e);
       }
     }, lodash.omit(props, "innerRef", "onChange", "html", "onBlur", "autoFocus", "allowEdit", "initialContent")), {}, {
       ref: function ref(e) {
@@ -94242,6 +94273,7 @@
       _useState2 = _slicedToArray(_useState, 2),
       n = _useState2[0],
       setN = _useState2[1];
+    var wrapperRf = React.useRef(null);
     var nRef = React.useRef(n);
     nRef.current = n;
     React.useEffect(function () {
@@ -94262,6 +94294,16 @@
       refs.cellInput.current.innerHTML = functionHTMLGenerate(newText);
       moveCursorToPosition(refs.cellInput.current, offsetIndex - replaceTextLength + fnName.length);
     };
+    var viewActive = function viewActive() {
+      var _wrapperRf$current;
+      var aItem = (_wrapperRf$current = wrapperRf.current) === null || _wrapperRf$current === void 0 ? void 0 : _wrapperRf$current.querySelector(".luckysheet-formula-search-item-active");
+      if (aItem) {
+        aItem === null || aItem === void 0 ? void 0 : aItem.scrollIntoView({
+          block: "nearest",
+          behavior: "smooth"
+        });
+      }
+    };
     React.useEffect(function () {
       var _refs$cellInput$curre2;
       var onChange = function onChange(e) {
@@ -94278,6 +94320,9 @@
             }), 0);
             return (_fListRef$current3 = fListRef.current[(currentIndex + 1) % fListRef.current.length]) === null || _fListRef$current3 === void 0 ? void 0 : _fListRef$current3.n;
           });
+          setTimeout(function () {
+            viewActive();
+          }, 200);
         } else if (e.key === "ArrowUp") {
           e.preventDefault();
           setN(function (_n) {
@@ -94287,6 +94332,9 @@
             }), 0);
             return (_fListRef$current5 = fListRef.current[(currentIndex - 1) % fListRef.current.length]) === null || _fListRef$current5 === void 0 ? void 0 : _fListRef$current5.n;
           });
+          setTimeout(function () {
+            viewActive();
+          }, 200);
         } else if (e.key === "Enter") {
           e.preventDefault();
           e.stopPropagation();
@@ -94308,6 +94356,7 @@
     return /*#__PURE__*/React__default['default'].createElement("div", _objectSpread2(_objectSpread2({}, props), {}, {
       id: "luckysheet-formula-search-c",
       className: "luckysheet-formula-search-c",
+      ref: wrapperRf,
       onWheel: function onWheel(e) {
         e.preventDefault();
         e.stopPropagation();