@fileverse-dev/fortune-react 1.0.2-mod-23 → 1.0.2-mod-20-patch-1

package/dist/index.esm.js

@@ -1,8 +1,7 @@
-import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fixPositionOnFrozenCells, colLocation, getFlowdata, isAllowEdit, handleColumnHeaderMouseDown, handleColSizeHandleMouseDown, handleColFreezeHandleMouseDown, handleContextMenu, selectTitlesMap, selectTitlesRange, fixColumnStyleOverflowInFreeze, rowLocationByIndex, rowLocation, handleRowHeaderMouseDown, handleRowSizeHandleMouseDown, handleRowFreezeHandleMouseDown, fixRowStyleOverflowInFreeze, locale, getStyleByCell, getCellValue, createRangeHightlight, isInlineStringCell, getInlineStringHTML, valueShowEs, escapeHTMLTag, escapeScriptTag, moveToEnd, isShowHidenCR, getrangeseleciton, cancelNormalSelected, moveHighlightCell, israngeseleciton, handleFormulaInput, onSearchDialogMoveStart, replaceAll, replace, searchAll, searchNext, normalizeSelection, scrollToHighlightCell, isLinkValid, getRangetxt, goToLink, replaceHtml, removeHyperlink, onRangeSelectionModalMoveStart, saveHyperlink, createFilterOptions, onImageMoveStart, onImageResizeStart, showComments, setEditingComment, onCommentBoxMoveStart, confirmMessage, getRangeByTxt, getDropdownList, setCellValue, setConditionRules, mergeBorder, setDropcownValue, handleCellAreaMouseDown, handleCellAreaDoubleClick, selectAll, showLinkCard, getCellRowColumn, getCellHyperlink, handleOverlayMouseMove, handleOverlayMouseUp, handleKeydownForZoom, handleOverlayTouchStart, handleOverlayTouchMove, handleOverlayTouchEnd, insertRowCol, drawArrow, onCellsMoveStart, createDropCellRange, updateContextWithSheetData, updateContextWithCanvas, initFreeze, Canvas, handleGlobalWheel, setCaretPosition, getDataArr, updateMoreCell, getRegStr, getOptionValue, getSelectRange, applyLocation, updateItem, update, normalizedCellAttr, updateFormat, handleTextSize, handleHorizontalAlign, handleVerticalAlign, handleScreenShot, showImgChooser, insertImage, editComment, deleteComment, showHideComment, showHideAllComments, newComment, handleSum, autoSelectionFormula, handleMerge, handleBorder, handleFreeze, handleSort, createFilter, clearFilter, toolbarItemSelectedFunc, toolbarItemClickHandler, handleTextColor, handleTextBackground, getInlineStringNoStyle, rangeHightlightselected, updateCell, editSheetName, cancelActiveImgItem, MAX_ZOOM_RATIO, MIN_ZOOM_RATIO, addSheet, indexToColumnChar, sortSelection, getFreezeState, toggleFreeze, jfrefreshgrid, handleCopy, deleteRowCol, hideSelected, showSelected, api, removeActiveImage, deleteSelectedCellText, handleLink, handlePasteByClick, deleteSheet, opToPatch, orderbydatafiler, getFilterColumnValues, getFilterColumnColors, saveFilter, calcSelectionInfo, patchToOp, filterPatch, inverseRowColOptions, ensureSheetIndex, initSheetIndex, handleGlobalKeyDown, handlePaste, groupValuesRefresh } from '@fileverse-dev/fortune-core';
+import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fixPositionOnFrozenCells, colLocation, getFlowdata, isAllowEdit, handleColumnHeaderMouseDown, handleColSizeHandleMouseDown, handleColFreezeHandleMouseDown, handleContextMenu, selectTitlesMap, selectTitlesRange, fixColumnStyleOverflowInFreeze, rowLocationByIndex, rowLocation, handleRowHeaderMouseDown, handleRowSizeHandleMouseDown, handleRowFreezeHandleMouseDown, fixRowStyleOverflowInFreeze, locale, getStyleByCell, getCellValue, createRangeHightlight, isInlineStringCell, getInlineStringHTML, valueShowEs, escapeHTMLTag, escapeScriptTag, moveToEnd, isShowHidenCR, getrangeseleciton, cancelNormalSelected, moveHighlightCell, israngeseleciton, handleFormulaInput, onSearchDialogMoveStart, replaceAll, replace, searchAll, searchNext, normalizeSelection, scrollToHighlightCell, isLinkValid, getRangetxt, goToLink, replaceHtml, removeHyperlink, onRangeSelectionModalMoveStart, saveHyperlink, createFilterOptions, onImageMoveStart, onImageResizeStart, showComments, setEditingComment, onCommentBoxMoveStart, confirmMessage, getRangeByTxt, getDropdownList, setCellValue, setConditionRules, mergeBorder, setDropcownValue, handleCellAreaMouseDown, handleCellAreaDoubleClick, selectAll, showLinkCard, getCellRowColumn, getCellHyperlink, handleOverlayMouseMove, handleOverlayMouseUp, handleKeydownForZoom, handleOverlayTouchStart, handleOverlayTouchMove, handleOverlayTouchEnd, insertRowCol, drawArrow, onCellsMoveStart, createDropCellRange, updateContextWithSheetData, updateContextWithCanvas, initFreeze, Canvas, handleGlobalWheel, setCaretPosition, getDataArr, updateMoreCell, getRegStr, getOptionValue, getSelectRange, applyLocation, updateItem, update, normalizedCellAttr, updateFormat, handleTextSize, handleHorizontalAlign, handleVerticalAlign, handleScreenShot, showImgChooser, insertImage, editComment, deleteComment, showHideComment, showHideAllComments, newComment, handleSum, autoSelectionFormula, handleMerge, handleBorder, handleFreeze, handleSort, createFilter, clearFilter, toolbarItemSelectedFunc, toolbarItemClickHandler, handleTextColor, handleTextBackground, getInlineStringNoStyle, rangeHightlightselected, updateCell, editSheetName, cancelActiveImgItem, MAX_ZOOM_RATIO, MIN_ZOOM_RATIO, addSheet, indexToColumnChar, sortSelection, handleCopy, deleteRowCol, hideSelected, showSelected, api, removeActiveImage, deleteSelectedCellText, jfrefreshgrid, handleLink, handlePasteByClick, deleteSheet, opToPatch, orderbydatafiler, getFilterColumnValues, getFilterColumnColors, saveFilter, calcSelectionInfo, patchToOp, filterPatch, inverseRowColOptions, ensureSheetIndex, initSheetIndex, handleGlobalKeyDown, handlePaste, groupValuesRefresh } from '@fileverse-dev/fortune-core';
 import React, { useContext, useRef, useState, useMemo, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
 import produce, { applyPatches, enablePatches, produceWithPatches } from 'immer';
 import _ from 'lodash';
-import { IconButton, Button as Button$1, TextField, Checkbox, Divider as Divider$2, Table, TableHeader, TableRow, TableHead, TableBody, cn, TableCell } from '@fileverse/ui';
 import regeneratorRuntime from 'regenerator-runtime';
 
 function _arrayLikeToArray(r, a) {
@@ -1229,39 +1228,35 @@ var Dialog = function Dialog(_ref) {
     className: "fortune-dialog",
     style: containerStyle
   }, /*#__PURE__*/React.createElement("div", {
-    className: "flex items-center justify-end border-b color-border-default py-3 px-6"
-  }, /*#__PURE__*/React.createElement(IconButton, {
-    icon: "X",
-    variant: "ghost",
+    className: "fortune-modal-dialog-header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-modal-dialog-icon-close",
     onClick: onCancel,
     tabIndex: 0
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "px-6 pb-6 pt-4 text-body-sm",
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: "close",
+    style: {
+      padding: 7,
+      cursor: "pointer"
+    }
+  }))), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-dialog-box-content",
     style: contentStyle
   }, children), type != null && (/*#__PURE__*/React.createElement("div", {
-    className: "px-6 pb-6 flex flex-row gap-2 justify-end"
-  }, type === "ok" ? (/*#__PURE__*/React.createElement(Button$1, {
-    variant: "default",
-    style: {
-      minWidth: "80px"
-    },
+    className: "fortune-dialog-box-button-container"
+  }, type === "ok" ? (/*#__PURE__*/React.createElement("div", {
+    className: "fortune-message-box-button button-default",
     onClick: onOk,
     tabIndex: 0
-  }, button.confirm)) : (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Button$1, {
-    variant: "secondary",
-    style: {
-      minWidth: "80px"
-    },
-    onClick: onCancel,
-    tabIndex: 0
-  }, button.cancel), /*#__PURE__*/React.createElement(Button$1, {
-    variant: "default",
-    style: {
-      minWidth: "80px"
-    },
+  }, button.confirm)) : (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "fortune-message-box-button button-primary",
     onClick: onOk,
     tabIndex: 0
-  }, button.confirm))))));
+  }, button.confirm), /*#__PURE__*/React.createElement("div", {
+    className: "fortune-message-box-button button-default",
+    onClick: onCancel,
+    tabIndex: 0
+  }, button.cancel))))));
 };
 
 var MessageBox = function MessageBox(_ref) {
@@ -1273,7 +1268,15 @@ var MessageBox = function MessageBox(_ref) {
   return /*#__PURE__*/React.createElement(Dialog, {
     type: type,
     onOk: onOk,
-    onCancel: onCancel
+    onCancel: onCancel,
+    contentStyle: {
+      width: 300,
+      paddingTop: 20,
+      paddingBottom: 30,
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center"
+    }
   }, children);
 };
 
@@ -1347,7 +1350,8 @@ var SearchReplace = function SearchReplace(_ref) {
     setContext = _useContext.setContext,
     refs = _useContext.refs;
   var _locale = locale(context),
-    findAndReplace = _locale.findAndReplace;
+    findAndReplace = _locale.findAndReplace,
+    button = _locale.button;
   var _useState = useState(""),
     _useState2 = _slicedToArray(_useState, 2),
     searchText = _useState2[0],
@@ -1356,27 +1360,28 @@ var SearchReplace = function SearchReplace(_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     replaceText = _useState4[0],
     setReplaceText = _useState4[1];
-  var _useState5 = useState([]),
+  var _useState5 = useState(context.showReplace),
     _useState6 = _slicedToArray(_useState5, 2),
-    searchResult = _useState6[0],
-    setSearchResult = _useState6[1];
-  var _useState7 = useState(),
+    showReplace = _useState6[0],
+    setShowReplace = _useState6[1];
+  var _useState7 = useState([]),
     _useState8 = _slicedToArray(_useState7, 2),
-    selectedCell = _useState8[0],
-    setSelectedCell = _useState8[1];
+    searchResult = _useState8[0],
+    setSearchResult = _useState8[1];
+  var _useState9 = useState(),
+    _useState0 = _slicedToArray(_useState9, 2),
+    selectedCell = _useState0[0],
+    setSelectedCell = _useState0[1];
   var _useAlert = useAlert(),
     showAlert = _useAlert.showAlert;
-  var tableContainerRef = useRef(null);
-  var searchInputRef = useRef(null);
-  var replaceInputRef = useRef(null);
-  var _useState9 = useState({
+  var _useState1 = useState({
       regCheck: false,
       wordCheck: false,
       caseCheck: false
     }),
-    _useState0 = _slicedToArray(_useState9, 2),
-    checkMode = _useState0[0],
-    checkModeReplace = _useState0[1];
+    _useState10 = _slicedToArray(_useState1, 2),
+    checkMode = _useState10[0],
+    checkModeReplace = _useState10[1];
   var closeDialog = useCallback(function () {
     _.set(refs.globalCache, "searchDialog.mouseEnter", false);
     setContext(function (draftCtx) {
@@ -1411,110 +1416,98 @@ var SearchReplace = function SearchReplace(_ref) {
       onSearchDialogMoveStart(refs.globalCache, nativeEvent, getContainer());
       e.stopPropagation();
     }
-  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
-    className: "flex items-center justify-between border-b color-border-default py-3 px-6"
-  }, /*#__PURE__*/React.createElement("h3", {
-    className: "text-heading-sm"
-  }, "Find and replace"), /*#__PURE__*/React.createElement(IconButton, {
-    icon: "X",
-    variant: "ghost",
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "container",
+    onMouseDown: function onMouseDown(e) {
+      return e.stopPropagation();
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "icon-close fortune-modal-dialog-icon-close",
     onClick: closeDialog,
     tabIndex: 0
+  }, /*#__PURE__*/React.createElement(SVGIcon, {
+    name: "close",
+    style: {
+      padding: 7,
+      cursor: "pointer"
+    }
   })), /*#__PURE__*/React.createElement("div", {
-    className: "px-6 pb-6 pt-4"
+    className: "tabBox"
+  }, /*#__PURE__*/React.createElement("span", {
+    id: "searchTab",
+    className: showReplace ? "" : "on",
+    onClick: function onClick() {
+      return setShowReplace(false);
+    },
+    tabIndex: 0
+  }, findAndReplace.find), /*#__PURE__*/React.createElement("span", {
+    id: "replaceTab",
+    className: showReplace ? "on" : "",
+    onClick: function onClick() {
+      return setShowReplace(true);
+    },
+    tabIndex: 0
+  }, findAndReplace.replace)), /*#__PURE__*/React.createElement("div", {
+    className: "ctBox"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-4"
+    className: "row"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-4"
+    className: "inputBox"
   }, /*#__PURE__*/React.createElement("div", {
-    id: "searchInput",
-    className: "flex flex-row gap-2 items-center"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "find-replace-label text-heading-xsm"
-  }, findAndReplace.findTextbox, "\uFF1A"), /*#__PURE__*/React.createElement(TextField, {
-    ref: searchInputRef,
+    className: "textboxs",
+    id: "searchInput"
+  }, findAndReplace.findTextbox, "\uFF1A", /*#__PURE__*/React.createElement("input", {
     className: "formulaInputFocus",
     autoFocus: true,
     spellCheck: "false",
     onKeyDown: function onKeyDown(e) {
       return e.stopPropagation();
     },
-    onMouseDown: function onMouseDown(e) {
-      var _searchInputRef$curre;
-      if (e.target === searchInputRef.current || ((_searchInputRef$curre = searchInputRef.current) === null || _searchInputRef$curre === void 0 ? void 0 : _searchInputRef$curre.contains(e.target))) {
-        e.stopPropagation();
-      }
-    },
     value: searchText,
     onChange: function onChange(e) {
-      if (e.target.value.length === 0) {
-        setSearchResult([]);
-      }
-      setSearchText(e.target.value);
+      return setSearchText(e.target.value);
     }
-  })), /*#__PURE__*/React.createElement("div", {
-    id: "replaceInput",
-    className: "flex flex-row gap-2 items-center"
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "find-replace-label text-heading-xsm"
-  }, findAndReplace.replaceTextbox, "\uFF1A"), /*#__PURE__*/React.createElement(TextField, {
-    ref: replaceInputRef,
+  })), showReplace && (/*#__PURE__*/React.createElement("div", {
+    className: "textboxs",
+    id: "replaceInput"
+  }, findAndReplace.replaceTextbox, "\uFF1A", /*#__PURE__*/React.createElement("input", {
     className: "formulaInputFocus",
     spellCheck: "false",
     onKeyDown: function onKeyDown(e) {
       return e.stopPropagation();
     },
-    onMouseDown: function onMouseDown(e) {
-      var _replaceInputRef$curr;
-      if (e.target === replaceInputRef.current || ((_replaceInputRef$curr = replaceInputRef.current) === null || _replaceInputRef$curr === void 0 ? void 0 : _replaceInputRef$curr.contains(e.target))) {
-        e.stopPropagation();
-      }
-    },
     value: replaceText,
     onChange: function onChange(e) {
       return setReplaceText(e.target.value);
     }
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-row gap-2"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "find-replace-label"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-2 text-body-sm"
+  })))), /*#__PURE__*/React.createElement("div", {
+    className: "checkboxs"
   }, /*#__PURE__*/React.createElement("div", {
-    id: "regCheck",
-    className: "flex flex-row gap-2 items-center"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    className: "border-2",
-    checked: checkMode.regCheck,
-    onCheckedChange: function onCheckedChange(e) {
+    id: "regCheck"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    onChange: function onChange(e) {
       return setCheckMode("regCheck", e.target.checked);
     }
   }), /*#__PURE__*/React.createElement("span", null, findAndReplace.regexTextbox)), /*#__PURE__*/React.createElement("div", {
-    id: "caseCheck",
-    className: "flex flex-row gap-2 items-center"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    className: "border-2",
-    checked: checkMode.caseCheck,
-    onCheckedChange: function onCheckedChange(e) {
-      return setCheckMode("caseCheck", e.target.checked);
-    }
-  }), /*#__PURE__*/React.createElement("span", null, findAndReplace.distinguishTextbox)), /*#__PURE__*/React.createElement("div", {
-    id: "wordCheck",
-    className: "flex flex-row gap-2 items-center"
-  }, /*#__PURE__*/React.createElement(Checkbox, {
-    className: "border-2",
-    checked: checkMode.wordCheck,
-    onCheckedChange: function onCheckedChange(e) {
+    id: "wordCheck"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    onChange: function onChange(e) {
       return setCheckMode("wordCheck", e.target.checked);
     }
-  }), /*#__PURE__*/React.createElement("span", null, findAndReplace.wholeTextbox)))), /*#__PURE__*/React.createElement(Divider$2, {
-    className: "w-full border-t-[1px]"
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-row gap-2 justify-center items-center mb-4"
-  }, /*#__PURE__*/React.createElement(Button$1, {
+  }), /*#__PURE__*/React.createElement("span", null, findAndReplace.wholeTextbox)), /*#__PURE__*/React.createElement("div", {
+    id: "caseCheck"
+  }, /*#__PURE__*/React.createElement("input", {
+    type: "checkbox",
+    onChange: function onChange(e) {
+      return setCheckMode("caseCheck", e.target.checked);
+    }
+  }), /*#__PURE__*/React.createElement("span", null, findAndReplace.distinguishTextbox)))), /*#__PURE__*/React.createElement("div", {
+    className: "btnBox"
+  }, showReplace && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     id: "replaceAllBtn",
-    variant: "secondary",
-    className: "min-w-fit",
+    className: "fortune-message-box-button button-default",
     onClick: function onClick() {
       setContext(function (draftCtx) {
         setSelectedCell(undefined);
@@ -1522,12 +1515,10 @@ var SearchReplace = function SearchReplace(_ref) {
         showAlert(alertMsg);
       });
     },
-    tabIndex: 0,
-    disabled: searchText.length === 0 || replaceText.length === 0
-  }, findAndReplace.allReplaceBtn), /*#__PURE__*/React.createElement(Button$1, {
+    tabIndex: 0
+  }, findAndReplace.allReplaceBtn), /*#__PURE__*/React.createElement("div", {
     id: "replaceBtn",
-    variant: "secondary",
-    className: "min-w-fit",
+    className: "fortune-message-box-button button-default",
     onClick: function onClick() {
       return setContext(function (draftCtx) {
         setSelectedCell(undefined);
@@ -1537,12 +1528,10 @@ var SearchReplace = function SearchReplace(_ref) {
         }
       });
     },
-    tabIndex: 0,
-    disabled: searchText.length === 0 || replaceText.length === 0
-  }, findAndReplace.replaceBtn), /*#__PURE__*/React.createElement(Button$1, {
+    tabIndex: 0
+  }, findAndReplace.replaceBtn))), /*#__PURE__*/React.createElement("div", {
     id: "searchAllBtn",
-    variant: "secondary",
-    className: "min-w-fit",
+    className: "fortune-message-box-button button-default",
     onClick: function onClick() {
       return setContext(function (draftCtx) {
         setSelectedCell(undefined);
@@ -1552,12 +1541,10 @@ var SearchReplace = function SearchReplace(_ref) {
         if (_.isEmpty(res)) showAlert(findAndReplace.noFindTip);
       });
     },
-    tabIndex: 0,
-    disabled: searchText.length === 0
-  }, findAndReplace.allFindBtn), /*#__PURE__*/React.createElement(Button$1, {
+    tabIndex: 0
+  }, findAndReplace.allFindBtn), /*#__PURE__*/React.createElement("div", {
     id: "searchNextBtn",
-    variant: "default",
-    className: "min-w-fit",
+    className: "fortune-message-box-button button-default",
     onClick: function onClick() {
       return setContext(function (draftCtx) {
         setSearchResult([]);
@@ -1565,45 +1552,23 @@ var SearchReplace = function SearchReplace(_ref) {
         if (alertMsg != null) showAlert(alertMsg);
       });
     },
-    tabIndex: 0,
-    disabled: searchText.length === 0
-  }, findAndReplace.findBtn))), searchResult.length > 0 && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Divider$2, {
-    className: "w-full border-t-[1px] mb-4"
-  }), /*#__PURE__*/React.createElement("div", {
-    ref: tableContainerRef,
-    className: "mb-6 table-container max-h-[300px] overflow-y-auto",
-    onMouseDown: function onMouseDown(e) {
-      var _tableContainerRef$cu;
-      if (e.target === tableContainerRef.current || ((_tableContainerRef$cu = tableContainerRef.current) === null || _tableContainerRef$cu === void 0 ? void 0 : _tableContainerRef$cu.contains(e.target))) {
-        var _tableContainerRef$cu2;
-        e.stopPropagation();
-        (_tableContainerRef$cu2 = tableContainerRef.current) === null || _tableContainerRef$cu2 === void 0 ? void 0 : _tableContainerRef$cu2.focus();
-      }
-    },
-    onWheel: function onWheel(e) {
-      e.preventDefault();
-      e.stopPropagation();
-      if (tableContainerRef.current) {
-        tableContainerRef.current.scrollTop += e.deltaY;
-      }
-    },
-    onTouchStart: function onTouchStart(e) {
-      e.stopPropagation();
-    },
-    onTouchMove: function onTouchMove(e) {
-      e.stopPropagation();
-    },
     tabIndex: 0
-  }, /*#__PURE__*/React.createElement(Table, {
+  }, findAndReplace.findBtn))), /*#__PURE__*/React.createElement("div", {
+    className: "close-button fortune-message-box-button button-default",
+    onClick: closeDialog,
+    tabIndex: 0
+  }, button.close), searchResult.length > 0 && (/*#__PURE__*/React.createElement("div", {
     id: "searchAllbox"
-  }, /*#__PURE__*/React.createElement(TableHeader, {
-    className: "color-bg-secondary"
-  }, /*#__PURE__*/React.createElement(TableRow, null, /*#__PURE__*/React.createElement(TableHead, null, findAndReplace.searchTargetSheet), /*#__PURE__*/React.createElement(TableHead, null, findAndReplace.searchTargetCell), /*#__PURE__*/React.createElement(TableHead, null, findAndReplace.searchTargetValue))), /*#__PURE__*/React.createElement(TableBody, null, searchResult.map(function (v) {
-    return /*#__PURE__*/React.createElement(TableRow, {
-      className: cn(_.isEqual(selectedCell, {
+  }, /*#__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", {
+    className: "boxMain"
+  }, searchResult.map(function (v) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "boxItem ".concat(_.isEqual(selectedCell, {
         r: v.r,
         c: v.c
-      }) ? "color-bg-default-selected" : ""),
+      }) ? "on" : ""),
       key: v.cellPosition,
       onClick: function onClick() {
         setContext(function (draftCtx) {
@@ -1619,14 +1584,8 @@ var SearchReplace = function SearchReplace(_ref) {
         });
       },
       tabIndex: 0
-    }, /*#__PURE__*/React.createElement(TableCell, {
-      className: "find-replace-table-cell"
-    }, v.sheetName), /*#__PURE__*/React.createElement(TableCell, {
-      className: "find-replace-table-cell"
-    }, v.cellPosition), /*#__PURE__*/React.createElement(TableCell, {
-      className: "find-replace-table-cell"
-    }, v.value));
-  })))))))));
+    }, /*#__PURE__*/React.createElement("span", null, v.sheetName), /*#__PURE__*/React.createElement("span", null, v.cellPosition), /*#__PURE__*/React.createElement("span", null, v.value));
+  }))))));
 };
 
 var LinkEditCard = function LinkEditCard(_ref) {
@@ -7439,65 +7398,6 @@ var ContextMenu = function ContextMenu() {
         key: "divider-".concat(i)
       });
     }
-    if (name === "freeze-row") {
-      var freezeState = getFreezeState(context);
-      var isFrozen = freezeState.isRowFrozen;
-      var isEntireRowSelected = (selection === null || selection === void 0 ? void 0 : selection.row_select) === true;
-      if (!isEntireRowSelected) return null;
-      return /*#__PURE__*/React.createElement(Menu, {
-        key: "freeze-row",
-        onClick: function onClick() {
-          setContext(function (draftCtx) {
-            if (isFrozen) {
-              toggleFreeze(draftCtx, "unfreeze-row");
-            } else {
-              toggleFreeze(draftCtx, "row");
-            }
-            draftCtx.contextMenu = {};
-          });
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "context-item"
-      }, /*#__PURE__*/React.createElement(SVGIcon, {
-        name: "freeze-flv",
-        width: 18,
-        height: 18,
-        style: {
-          marginTop: "4px",
-          marginRight: "4px"
-        }
-      }), isFrozen ? "Unfreeze row" : "Freeze to current row"));
-    }
-    if (name === "freeze-column") {
-      var _freezeState = getFreezeState(context);
-      var _isFrozen = _freezeState.isColFrozen;
-      var isEntireColumnSelected = (selection === null || selection === void 0 ? void 0 : selection.column_select) === true;
-      if (!isEntireColumnSelected) return null;
-      return /*#__PURE__*/React.createElement(Menu, {
-        key: "freeze-column",
-        onClick: function onClick() {
-          setContext(function (draftCtx) {
-            if (_isFrozen) {
-              toggleFreeze(draftCtx, "unfreeze-column");
-            } else {
-              toggleFreeze(draftCtx, "column");
-              jfrefreshgrid(draftCtx, null, undefined, false);
-            }
-            draftCtx.contextMenu = {};
-          });
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "context-item"
-      }, /*#__PURE__*/React.createElement(SVGIcon, {
-        name: "freeze-flv",
-        width: 18,
-        height: 18,
-        style: {
-          marginTop: "4px",
-          marginRight: "4px"
-        }
-      }), /*#__PURE__*/React.createElement("p", null, _isFrozen ? "Unfreeze column" : "Freeze to current column")));
-    }
     if (name === "comment") {
       return /*#__PURE__*/React.createElement(Menu, {
         key: name,
@@ -9633,20 +9533,6 @@ var SVGDefines = function SVGDefines(_ref) {
     "clip-rule": "evenodd",
     d: "M3.75 1.5C3.15326 1.5 2.58097 1.73705 2.15901 2.15901C1.73705 2.58097 1.5 3.15326 1.5 3.75V15.75C1.5 16.0533 1.68273 16.3268 1.96299 16.4429C2.24324 16.559 2.56583 16.4948 2.78033 16.2803L5.56066 13.5H14.25C14.8467 13.5 15.419 13.2629 15.841 12.841C16.2629 12.419 16.5 11.8467 16.5 11.25V3.75C16.5 3.15326 16.2629 2.58097 15.841 2.15901C15.419 1.73705 14.8467 1.5 14.25 1.5H3.75ZM3.21967 3.21967C3.36032 3.07902 3.55109 3 3.75 3H14.25C14.4489 3 14.6397 3.07902 14.7803 3.21967C14.921 3.36032 15 3.55109 15 3.75V11.25C15 11.4489 14.921 11.6397 14.7803 11.7803C14.6397 11.921 14.4489 12 14.25 12H5.25C5.05109 12 4.86032 12.079 4.71967 12.2197L3 13.9393V3.75C3 3.55109 3.07902 3.36032 3.21967 3.21967Z",
     fill: "#363B3F"
-  }))), /*#__PURE__*/React.createElement("symbol", {
-    id: "freeze-flv",
-    viewBox: "0 0 24 24"
-  }, /*#__PURE__*/React.createElement("svg", {
-    width: "18",
-    height: "16",
-    viewBox: "0 0 18 16",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg"
-  }, /*#__PURE__*/React.createElement("path", {
-    "fill-rule": "evenodd",
-    "clip-rule": "evenodd",
-    d: "M13.4208 1.58557C13.6061 1.21509 13.4559 0.764586 13.0854 0.579344C12.7149 0.394102 12.2644 0.54427 12.0792 0.914754L11.4375 2.19811L11.1708 1.66475C10.9856 1.29427 10.5351 1.1441 10.1646 1.32934C9.79411 1.51459 9.64394 1.96509 9.82918 2.33557L10.599 3.87516L10.0365 5.00016H7.96353L7.40103 3.87516L8.17083 2.33557C8.35607 1.96509 8.2059 1.51459 7.83541 1.32934C7.46493 1.1441 7.01443 1.29427 6.82918 1.66475L6.5625 2.19811L5.92082 0.914754C5.73558 0.54427 5.28508 0.394102 4.91459 0.579344C4.54411 0.764586 4.39394 1.21509 4.57918 1.58557L5.22086 2.86893L4.63417 2.76226C4.22664 2.68817 3.8362 2.95847 3.7621 3.366C3.688 3.77353 3.95831 4.16397 4.36584 4.23807L6.05939 4.54598L6.66148 5.75016L5.91147 7.25016H4.49999L3.6 6.05018C3.35147 5.71881 2.88137 5.65165 2.55 5.90018C2.21863 6.14871 2.15147 6.61881 2.4 6.95018L2.62499 7.25016H1.5C1.08579 7.25016 0.75 7.58595 0.75 8.00016C0.75 8.41438 1.08579 8.75016 1.5 8.75016H2.62501L2.4 9.05018C2.15147 9.38155 2.21863 9.85165 2.55 10.1002C2.88137 10.3487 3.35147 10.2816 3.6 9.95018L4.50001 8.75016H5.91148L6.66148 10.2502L6.05938 11.4544L4.36584 11.7623C3.95831 11.8364 3.688 12.2268 3.7621 12.6344C3.8362 13.0419 4.22664 13.3122 4.63417 13.2381L5.22085 13.1314L4.57918 14.4148C4.39394 14.7852 4.54411 15.2357 4.91459 15.421C5.28508 15.6062 5.73558 15.4561 5.92082 15.0856L6.5625 13.8022L6.82918 14.3356C7.01443 14.7061 7.46493 14.8562 7.83541 14.671C8.2059 14.4858 8.35607 14.0353 8.17083 13.6648L7.40102 12.1252L7.96352 11.0002H10.0365L10.599 12.1252L9.82918 13.6648C9.64394 14.0353 9.79411 14.4858 10.1646 14.671C10.5351 14.8562 10.9856 14.7061 11.1708 14.3356L11.4375 13.8022L12.0792 15.0856C12.2644 15.4561 12.7149 15.6062 13.0854 15.421C13.4559 15.2358 13.6061 14.7853 13.4208 14.4148L12.7791 13.1314L13.3658 13.2381C13.7734 13.3122 14.1638 13.0419 14.2379 12.6344C14.312 12.2268 14.0417 11.8364 13.6342 11.7623L11.9406 11.4544L11.3385 10.2502L12.0885 8.75018H13.5L14.4 9.95018C14.6485 10.2816 15.1186 10.3487 15.45 10.1002C15.7814 9.85165 15.8485 9.38155 15.6 9.05018L15.375 8.75018H16.5C16.9142 8.75018 17.25 8.4144 17.25 8.00018C17.25 7.58597 16.9142 7.25018 16.5 7.25018H15.375L15.6 6.95018C15.8485 6.61881 15.7814 6.14871 15.45 5.90018C15.1186 5.65165 14.6485 5.71881 14.4 6.05018L13.5 7.25018H12.0885L11.3385 5.75016L11.9406 4.54599L13.6342 4.23807C14.0417 4.16397 14.312 3.77353 14.2379 3.366C14.1638 2.95847 13.7734 2.68817 13.3658 2.76226L12.7791 2.86893L13.4208 1.58557ZM7.96353 6.50016L7.21353 8.00016L7.96354 9.50018H10.0365L10.7865 8.00018L10.0365 6.50016H7.96353Z",
-    fill: "#363B3F"
   }))), /*#__PURE__*/React.createElement("symbol", {
     viewBox: "0 0 1024 1024",
     id: "tab"
@@ -9955,7 +9841,7 @@ var MoreItemsContaier = function MoreItemsContaier(_ref) {
   }, children);
 };
 
-function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cellInput, scrollbarX, scrollbarY) {
+function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cellInput, scrollbarX, scrollbarY, globalCache) {
   return {
     applyOp: function applyOp(ops) {
       setContext(function (ctx_) {
@@ -10256,6 +10142,50 @@ function generateAPIs(context, setContext, handleUndo, handleRedo, settings, cel
     },
     celldataToData: function celldataToData(celldata, rowCount, colCount) {
       return api.celldataToData(celldata, rowCount, colCount);
+    },
+    insertFunction: function insertFunction(selectedFuncIndex, filteredFunctionList, callback) {
+      var _context$luckysheet_s2;
+      var last = (_context$luckysheet_s2 = context.luckysheet_select_save) === null || _context$luckysheet_s2 === void 0 ? void 0 : _context$luckysheet_s2[context.luckysheet_select_save.length - 1];
+      var row_index = last === null || last === void 0 ? void 0 : last.row_focus;
+      var col_index = last === null || last === void 0 ? void 0 : last.column_focus;
+      if (!last) {
+        row_index = 0;
+        col_index = 0;
+      } else {
+        if (row_index == null) {
+          var _last$row2 = _slicedToArray(last.row, 1);
+          row_index = _last$row2[0];
+        }
+        if (col_index == null) {
+          var _last$column2 = _slicedToArray(last.column, 1);
+          col_index = _last$column2[0];
+        }
+      }
+      var formulaTxt = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-color\">".concat(filteredFunctionList[selectedFuncIndex].n.toUpperCase(), "</span><span dir=\"auto\" class=\"luckysheet-formula-text-color\">(</span>");
+      var _locale2 = locale(context),
+        functionlist = _locale2.functionlist;
+      setContext(function (ctx) {
+        if (cellInput != null && globalCache != null) {
+          ctx.luckysheetCellUpdate = [row_index, col_index];
+          globalCache.doNotUpdateCell = true;
+          cellInput.innerHTML = formulaTxt;
+          var spans = cellInput.childNodes;
+          if (!_.isEmpty(spans)) {
+            setCaretPosition(ctx, spans[spans.length - 1], 0, 1);
+          }
+          ctx.functionHint = filteredFunctionList[selectedFuncIndex].n.toUpperCase();
+          ctx.functionCandidates = [];
+          if (_.isEmpty(ctx.formulaCache.functionlistMap)) {
+            for (var i = 0; i < functionlist.length; i += 1) {
+              ctx.formulaCache.functionlistMap[functionlist[i].n] = functionlist[i];
+            }
+          }
+          callback === null || callback === void 0 ? void 0 : callback();
+        }
+      });
+    },
+    getLocaleContext: function getLocaleContext() {
+      return locale(context);
     }
   };
 }
@@ -11463,8 +11393,8 @@ var Workbook = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     };
   }, [onPaste]);
   useImperativeHandle(ref, function () {
-    return generateAPIs(context, setContextWithProduce, handleUndo, handleRedo, mergedSettings, cellInput.current, scrollbarX.current, scrollbarY.current);
-  }, [context, setContextWithProduce, handleUndo, handleRedo, mergedSettings]);
+    return generateAPIs(context, setContextWithProduce, handleUndo, handleRedo, mergedSettings, cellInput.current, scrollbarX.current, scrollbarY.current, globalCache.current);
+  }, [context, setContextWithProduce, handleUndo, handleRedo, mergedSettings, globalCache]);
   var i = getSheetIndex(context, context.currentSheetId);
   if (i == null) {
     return null;