@fileverse-dev/fortune-react 1.3.13-create-3 → 1.3.13-create-4

package/es/hooks/useFormulaEditorHistory.js

@@ -1,47 +1,77 @@
 import { useCallback, useRef } from "react";
-import _ from "lodash";
-import { escapeScriptTag, functionHTMLGenerate, escapeHTMLTag, handleFormulaInput } from "@fileverse-dev/fortune-core";
-import { setCursorPosition } from "../components/SheetOverlay/helper";
+import { escapeScriptTag } from "@fileverse-dev/fortune-core";
+import { getCursorPosition, getSelectionOffsets, setSelectionOffsets, setCursorPosition } from "../components/SheetOverlay/helper";
 var MAX_FORMULA_HISTORY = 100;
-export function useFormulaEditorHistory(primaryRef, cellInputRef, fxInputRef, setContext, primary) {
+function normalizeEditorHtmlSnapshot(html) {
+  var stripped = (html !== null && html !== void 0 ? html : "").replace(/\u200B/g, "").trim();
+  if (stripped === "" || stripped === "<br>" || stripped === "<div><br></div>" || stripped === "<div></div>") {
+    return "";
+  }
+  return html !== null && html !== void 0 ? html : "";
+}
+function historyForLog(entries, index) {
+  return entries.map(function (e, i) {
+    var _a, _b;
+    return {
+      i: i,
+      active: i === index,
+      len: ((_a = e.html) !== null && _a !== void 0 ? _a : "").length,
+      preview: ((_b = e.html) !== null && _b !== void 0 ? _b : "").replace(/\s+/g, " ").slice(0, 24)
+    };
+  });
+}
+export function useFormulaEditorHistory(primaryRef, cellInputRef, fxInputRef, _setContext, primary) {
   var preTextRef = useRef("");
-  var preFormulaSpanValuesRef = useRef(null);
+  var preHtmlRef = useRef("");
+  var preCaretRef = useRef(0);
+  var startedFromEmptyRef = useRef(true);
   var formulaHistoryRef = useRef({
     active: false,
     entries: [],
     index: -1
   });
+  var isApplyingHistoryRef = useRef(false);
   var resetFormulaHistory = useCallback(function () {
     formulaHistoryRef.current = {
       active: false,
       entries: [],
       index: -1
     };
-    preFormulaSpanValuesRef.current = null;
+    preHtmlRef.current = "";
+    preCaretRef.current = 0;
+    startedFromEmptyRef.current = true;
   }, []);
   var pushFormulaHistoryEntry = useCallback(function (entry) {
     var history = formulaHistoryRef.current;
     var current = history.entries[history.index];
-    if (current && current.spanValues.length > 0 && entry.spanValues.length > 0 && _.isEqual(current.spanValues, entry.spanValues)) {
-      return;
-    }
-    if (current && current.spanValues.length === 0 && entry.spanValues.length === 0 && current.text === entry.text && current.caret === entry.caret) {
+    if (current && current.html === entry.html) {
+      console.log("[Hist:pushSkipDuplicate]", {
+        currentHtmlLen: current.html.length,
+        entryHtmlLen: entry.html.length,
+        index: history.index
+      });
       return;
     }
     var nextEntries = history.entries.slice(0, history.index + 1);
     nextEntries.push(entry);
-    if (nextEntries.length > MAX_FORMULA_HISTORY) {
-      nextEntries.shift();
-    }
+    if (nextEntries.length > MAX_FORMULA_HISTORY) nextEntries.shift();
     history.entries = nextEntries;
     history.index = nextEntries.length - 1;
     history.active = true;
+    console.log("[Hist:push]", {
+      htmlLen: entry.html.length,
+      caret: entry.caret,
+      entriesLen: history.entries.length,
+      index: history.index,
+      entries: historyForLog(history.entries, history.index)
+    });
   }, []);
-  var applyFormulaHistoryEntry = useCallback(function (entry) {
+  var applyFormulaHistoryEntry = useCallback(function (entry, preserveSelection) {
+    var _a, _b, _c, _d, _e;
     var primaryEl = primaryRef.current;
     if (!primaryEl) return;
-    var safeText = escapeScriptTag(entry.text || "");
-    var html = safeText.startsWith("=") ? functionHTMLGenerate(safeText) : escapeHTMLTag(safeText);
+    isApplyingHistoryRef.current = true;
+    var html = escapeScriptTag((_a = entry.html) !== null && _a !== void 0 ? _a : "");
     var cell = cellInputRef.current;
     var fx = fxInputRef.current;
     primaryEl.innerHTML = html;
@@ -50,70 +80,142 @@ export function useFormulaEditorHistory(primaryRef, cellInputRef, fxInputRef, se
     } else if (cell) {
       cell.innerHTML = html;
     }
-    setCursorPosition(primaryEl, Math.min(entry.caret, entry.text.length));
-    setContext(function (draftCtx) {
-      if (primary === "cell") {
-        if (!cellInputRef.current) return;
-        handleFormulaInput(draftCtx, fxInputRef.current, cellInputRef.current, 0);
-      } else {
-        if (!fxInputRef.current) return;
-        handleFormulaInput(draftCtx, cellInputRef.current, fxInputRef.current, 0);
-      }
+    var textLen = (_c = (_b = primaryEl.innerText) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 0;
+    if (preserveSelection && preserveSelection.end > preserveSelection.start && textLen > 0) {
+      var start = Math.max(0, Math.min(preserveSelection.start, textLen));
+      var end = Math.max(start, Math.min(preserveSelection.end, textLen));
+      setSelectionOffsets(primaryEl, start, end);
+    } else {
+      setCursorPosition(primaryEl, Math.max(0, textLen));
+    }
+    console.log("[Hist:apply]", {
+      entryHtmlLen: ((_d = entry.html) !== null && _d !== void 0 ? _d : "").length,
+      afterHtmlLen: ((_e = primaryEl.innerHTML) !== null && _e !== void 0 ? _e : "").length,
+      afterTextLen: textLen
+    });
+    requestAnimationFrame(function () {
+      requestAnimationFrame(function () {
+        setTimeout(function () {
+          isApplyingHistoryRef.current = false;
+        }, 120);
+      });
     });
-  }, [cellInputRef, fxInputRef, primary, primaryRef, setContext]);
+  }, [cellInputRef, fxInputRef, primary, primaryRef]);
   var handleFormulaHistoryUndoRedo = useCallback(function (isRedo) {
+    var _a, _b, _c, _d;
     var history = formulaHistoryRef.current;
     if (!history.active || history.entries.length === 0) return false;
     var nextIndex = isRedo ? history.index + 1 : history.index - 1;
-    if (nextIndex < 0 || nextIndex >= history.entries.length) return true;
+    if (nextIndex < 0 || nextIndex >= history.entries.length) {
+      console.log("[Hist:undoRedoBoundary]", {
+        isRedo: isRedo,
+        index: history.index,
+        entriesLen: history.entries.length,
+        nextIndex: nextIndex,
+        startedFromEmpty: startedFromEmptyRef.current,
+        liveHtmlLen: normalizeEditorHtmlSnapshot((_b = (_a = primaryRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML) !== null && _b !== void 0 ? _b : "").length,
+        entries: historyForLog(history.entries, history.index)
+      });
+      if (!isRedo && nextIndex < 0 && startedFromEmptyRef.current) {
+        var liveHtml = normalizeEditorHtmlSnapshot((_d = (_c = primaryRef.current) === null || _c === void 0 ? void 0 : _c.innerHTML) !== null && _d !== void 0 ? _d : "");
+        if (liveHtml !== "") {
+          history.entries[0] = {
+            html: "",
+            caret: 0
+          };
+          history.index = 0;
+          var currentSelection_1 = primaryRef.current ? getSelectionOffsets(primaryRef.current) : undefined;
+          applyFormulaHistoryEntry(history.entries[0], currentSelection_1);
+          console.log("[Hist:undoRedoForcedEmpty]", {
+            entriesLen: history.entries.length,
+            index: history.index,
+            entries: historyForLog(history.entries, history.index)
+          });
+          return true;
+        }
+      }
+      return false;
+    }
     history.index = nextIndex;
-    applyFormulaHistoryEntry(history.entries[nextIndex]);
+    var entry = history.entries[nextIndex];
+    var currentSelection = primaryRef.current ? getSelectionOffsets(primaryRef.current) : undefined;
+    applyFormulaHistoryEntry(entry, currentSelection);
+    console.log("[Hist:undoRedoApplied]", {
+      isRedo: isRedo,
+      nextIndex: nextIndex,
+      entriesLen: history.entries.length,
+      entryHtmlLen: entry.html.length,
+      entries: historyForLog(history.entries, history.index)
+    });
     return true;
-  }, [applyFormulaHistoryEntry]);
-  var capturePreFormulaState = useCallback(function () {
+  }, [applyFormulaHistoryEntry, primaryRef]);
+  var capturePreEditorHistoryState = useCallback(function () {
+    var _a, _b, _c;
     var el = primaryRef.current;
     if (!el) return;
     preTextRef.current = el.innerText;
-    preFormulaSpanValuesRef.current = Array.from(el.querySelectorAll("span.fortune-formula-functionrange-cell")).map(function (node) {
-      var _a;
-      return (_a = node.textContent) !== null && _a !== void 0 ? _a : "";
+    preHtmlRef.current = el.innerHTML;
+    preCaretRef.current = getCursorPosition(el);
+    if (!formulaHistoryRef.current.active) {
+      startedFromEmptyRef.current = normalizeEditorHtmlSnapshot((_a = preHtmlRef.current) !== null && _a !== void 0 ? _a : "") === "";
+    }
+    console.log("[Hist:capturePre]", {
+      preHtmlLen: ((_b = preHtmlRef.current) !== null && _b !== void 0 ? _b : "").length,
+      preTextLen: ((_c = preTextRef.current) !== null && _c !== void 0 ? _c : "").length,
+      preCaret: preCaretRef.current,
+      startedFromEmpty: startedFromEmptyRef.current,
+      historyActive: formulaHistoryRef.current.active,
+      entriesLen: formulaHistoryRef.current.entries.length,
+      index: formulaHistoryRef.current.index
     });
   }, [primaryRef]);
-  var appendFormulaHistoryFromPrimaryEditor = useCallback(function (getCaret) {
+  var appendEditorHistoryFromPrimaryEditor = useCallback(function (getCaret) {
     var _a, _b;
+    if (isApplyingHistoryRef.current) return;
     var el = primaryRef.current;
     if (!el) return;
-    var currentText = el.innerText || "";
-    if (currentText.startsWith("=")) {
-      var caret = getCaret();
-      var spanValues = Array.from(el.querySelectorAll("span.fortune-formula-functionrange-cell")).map(function (node) {
-        var _a;
-        return (_a = node.textContent) !== null && _a !== void 0 ? _a : "";
-      });
-      if (!formulaHistoryRef.current.active) {
-        var seedText = preTextRef.current || "";
-        pushFormulaHistoryEntry({
-          text: seedText,
-          caret: Math.min(caret, seedText.length),
-          spanValues: (_b = (_a = preFormulaSpanValuesRef.current) !== null && _a !== void 0 ? _a : spanValues) !== null && _b !== void 0 ? _b : []
-        });
-      }
+    var preHtmlSnapshot = normalizeEditorHtmlSnapshot((_a = preHtmlRef.current) !== null && _a !== void 0 ? _a : "");
+    var snapshotHtml = normalizeEditorHtmlSnapshot((_b = el.innerHTML) !== null && _b !== void 0 ? _b : "");
+    var caret = getCaret();
+    var history = formulaHistoryRef.current;
+    var wasInactive = !history.active || history.entries.length === 0;
+    console.log("[Hist:appendStart]", {
+      preHtmlLen: preHtmlSnapshot.length,
+      currentHtmlLen: snapshotHtml.length,
+      caret: caret,
+      wasInactive: wasInactive,
+      historyActive: history.active,
+      entriesLen: history.entries.length,
+      index: history.index,
+      entries: historyForLog(history.entries, history.index)
+    });
+    if (wasInactive) {
+      startedFromEmptyRef.current = preHtmlSnapshot === "";
+      var seedHtml = preHtmlSnapshot === snapshotHtml ? "" : preHtmlSnapshot !== null && preHtmlSnapshot !== void 0 ? preHtmlSnapshot : "";
       pushFormulaHistoryEntry({
-        text: currentText,
-        caret: caret,
-        spanValues: spanValues
+        html: seedHtml,
+        caret: preCaretRef.current
+      });
+    } else {
+      console.log("[Hist:seedSkippedAlreadyActive]", {
+        index: history.index,
+        entriesLen: history.entries.length,
+        entries: historyForLog(history.entries, history.index)
       });
-    } else if (formulaHistoryRef.current.active) {
-      resetFormulaHistory();
     }
-  }, [primaryRef, pushFormulaHistoryEntry, resetFormulaHistory]);
+    pushFormulaHistoryEntry({
+      html: snapshotHtml,
+      caret: caret
+    });
+  }, [primaryRef, pushFormulaHistoryEntry]);
   return {
     formulaHistoryRef: formulaHistoryRef,
     preTextRef: preTextRef,
-    preFormulaSpanValuesRef: preFormulaSpanValuesRef,
     resetFormulaHistory: resetFormulaHistory,
     handleFormulaHistoryUndoRedo: handleFormulaHistoryUndoRedo,
-    capturePreFormulaState: capturePreFormulaState,
-    appendFormulaHistoryFromPrimaryEditor: appendFormulaHistoryFromPrimaryEditor
+    capturePreEditorHistoryState: capturePreEditorHistoryState,
+    appendEditorHistoryFromPrimaryEditor: appendEditorHistoryFromPrimaryEditor,
+    capturePreFormulaState: capturePreEditorHistoryState,
+    appendFormulaHistoryFromPrimaryEditor: appendEditorHistoryFromPrimaryEditor
   };
 }

package/lib/components/FxEditor/index.js

@@ -41,12 +41,11 @@ var FxEditor = function FxEditor() {
     refs = _g.refs;
   var lastKeyDownEventRef = (0, _react.useRef)(null);
   var _h = (0, _useFormulaEditorHistory.useFormulaEditorHistory)(refs.fxInput, refs.cellInput, refs.fxInput, setContext, "fx"),
-    formulaHistoryRef = _h.formulaHistoryRef,
     preTextRef = _h.preTextRef,
     resetFormulaHistory = _h.resetFormulaHistory,
     handleFormulaHistoryUndoRedo = _h.handleFormulaHistoryUndoRedo,
-    capturePreFormulaState = _h.capturePreFormulaState,
-    appendFormulaHistoryFromPrimaryEditor = _h.appendFormulaHistoryFromPrimaryEditor;
+    capturePreEditorHistoryState = _h.capturePreEditorHistoryState,
+    appendEditorHistoryFromPrimaryEditor = _h.appendEditorHistoryFromPrimaryEditor;
   var inputContainerRef = (0, _react.useRef)(null);
   var _j = (0, _react.useState)(false),
     isHidenRC = _j[0],
@@ -288,7 +287,20 @@ var FxEditor = function FxEditor() {
     var currentCommaCount = (0, _helper.countCommasBeforeCursor)((_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current);
     setCommaCount(currentCommaCount);
     lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
-    capturePreFormulaState();
+    if (!(0, _helper.isEditorUndoRedoKeyEvent)(e.nativeEvent)) {
+      capturePreEditorHistoryState();
+    }
+    var isPotentialContentKey = !e.metaKey && !e.ctrlKey && !e.altKey && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete" || e.key === "Enter" || e.key === "Tab");
+    if (isPotentialContentKey) {
+      requestAnimationFrame(function () {
+        requestAnimationFrame(function () {
+          if ((0, _fortuneCore.getFormulaEditorOwner)(context) !== "fx") return;
+          appendEditorHistoryFromPrimaryEditor(function () {
+            return (0, _helper.getCursorPosition)(refs.fxInput.current);
+          });
+        });
+      });
+    }
     recentText.current = refs.fxInput.current.innerText;
     var key = e.key;
     var currentInputText = ((_c = (_b = refs.fxInput.current) === null || _b === void 0 ? void 0 : _b.innerText) === null || _c === void 0 ? void 0 : _c.trim()) || "";
@@ -340,14 +352,20 @@ var FxEditor = function FxEditor() {
     }
     if ((e.metaKey || e.ctrlKey) && context.luckysheetCellUpdate.length > 0) {
       if (e.code === "KeyZ" || e.code === "KeyY") {
-        var shouldUseFormulaHistory = currentInputText.startsWith("=") || formulaHistoryRef.current.active;
-        if (shouldUseFormulaHistory) {
-          var handledByFormulaHistory = handleFormulaHistoryUndoRedo(e.code === "KeyY" || e.code === "KeyZ" && e.shiftKey);
-          if (handledByFormulaHistory) {
-            e.preventDefault();
-          }
-        }
+        var isRedo_1 = e.code === "KeyY" || e.code === "KeyZ" && e.shiftKey;
+        e.preventDefault();
         e.stopPropagation();
+        var _attempt_ = function attempt_1(triesLeft) {
+          var handled = handleFormulaHistoryUndoRedo(isRedo_1);
+          if (handled) return;
+          if (triesLeft <= 0) return;
+          requestAnimationFrame(function () {
+            requestAnimationFrame(function () {
+              return _attempt_(triesLeft - 1);
+            });
+          });
+        };
+        _attempt_(2);
         return;
       }
     }
@@ -440,7 +458,7 @@ var FxEditor = function FxEditor() {
         }
       }
     });
-  }, [capturePreFormulaState, context.allowEdit, context.luckysheetCellUpdate, handleFormulaHistoryUndoRedo, refs.cellInput, refs.fxInput, setContext]);
+  }, [capturePreEditorHistoryState, context.allowEdit, context.luckysheetCellUpdate, handleFormulaHistoryUndoRedo, refs.cellInput, refs.fxInput, setContext]);
   var handleHideShowHint = function handleHideShowHint() {
     var _a, _b, _c, _d;
     var el = (_a = document.getElementsByClassName("cell-hint")) === null || _a === void 0 ? void 0 : _a[0];
@@ -497,17 +515,23 @@ var FxEditor = function FxEditor() {
       }
       return;
     }
+    if ((0, _helper.isEditorUndoRedoKeyEvent)(e)) {
+      return;
+    }
     var kcode = e.keyCode;
     if (!kcode) return;
-    appendFormulaHistoryFromPrimaryEditor(function () {
-      return (0, _helper.getCursorPosition)(refs.fxInput.current);
-    });
     if (!(kcode >= 112 && kcode <= 123 || kcode <= 46 || kcode === 144 || kcode === 108 || e.ctrlKey || e.altKey || e.shiftKey && (kcode === 37 || kcode === 38 || kcode === 39 || kcode === 40)) || kcode === 8 || kcode === 32 || kcode === 46 || e.ctrlKey && kcode === 86) {
       setContext(function (draftCtx) {
         (0, _fortuneCore.handleFormulaInput)(draftCtx, refs.cellInput.current, refs.fxInput.current, kcode, recentText.current);
       });
     }
-  }, [appendFormulaHistoryFromPrimaryEditor, context.isFlvReadOnly, context.luckysheetCellUpdate, refs.cellInput, refs.fxInput, setContext]);
+    requestAnimationFrame(function () {
+      if ((0, _fortuneCore.getFormulaEditorOwner)(context) !== "fx") return;
+      appendEditorHistoryFromPrimaryEditor(function () {
+        return (0, _helper.getCursorPosition)(refs.fxInput.current);
+      });
+    });
+  }, [appendEditorHistoryFromPrimaryEditor, context.isFlvReadOnly, context.luckysheetCellUpdate, refs.cellInput, refs.fxInput, setContext]);
   (0, _useRerenderOnFormulaCaret.useRerenderOnFormulaCaret)(refs.fxInput, context.luckysheetCellUpdate.length > 0);
   var getFunctionNameFromInput = (0, _react.useCallback)(function () {
     var _a, _b, _c, _d;

package/lib/components/SheetOverlay/ContentEditable.js

@@ -50,10 +50,11 @@ var ContentEditable = function ContentEditable(_a) {
     if (root.current != null) {
       html = root.current.innerHTML;
     }
-    if (onChange && html !== lastHtml.current) {
-      onChange(html || "", isBlur);
+    var htmlStr = html || "";
+    if (onChange && htmlStr !== lastHtml.current) {
+      onChange(htmlStr, isBlur);
     }
-    lastHtml.current = html || "";
+    lastHtml.current = htmlStr;
   }, [root, onChange]);
   var innerRef = props.innerRef,
     _onBlur = props.onBlur;

package/lib/components/SheetOverlay/InputBox.js

@@ -87,12 +87,11 @@ var InputBox = function InputBox() {
   var skipNextAnchorSelectionSyncRef = (0, _react.useRef)(false);
   var lastHandledMouseDragSignatureRef = (0, _react.useRef)("");
   var _2 = (0, _useFormulaEditorHistory.useFormulaEditorHistory)(inputRef, refs.cellInput, refs.fxInput, setContext, "cell"),
-    formulaHistoryRef = _2.formulaHistoryRef,
     preTextRef = _2.preTextRef,
     resetFormulaHistory = _2.resetFormulaHistory,
     handleFormulaHistoryUndoRedo = _2.handleFormulaHistoryUndoRedo,
-    capturePreFormulaState = _2.capturePreFormulaState,
-    appendFormulaHistoryFromPrimaryEditor = _2.appendFormulaHistoryFromPrimaryEditor;
+    capturePreEditorHistoryState = _2.capturePreEditorHistoryState,
+    appendEditorHistoryFromPrimaryEditor = _2.appendEditorHistoryFromPrimaryEditor;
   var ZWSP = "\u200B";
   var inputBoxInnerRef = (0, _react.useRef)(null);
   var _3 = (0, _react.useState)([]),
@@ -414,12 +413,25 @@ var InputBox = function InputBox() {
     });
   }, [formulaMouseDragSignature, context.formulaCache.func_selectedrange, refs.cellInput, setContext]);
   var onKeyDown = (0, _react.useCallback)(function (e) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
     setContext(function (draftCtx) {
       (0, _fortuneCore.setFormulaEditorOwner)(draftCtx, "cell");
     });
     lastKeyDownEventRef.current = new KeyboardEvent(e.type, e.nativeEvent);
-    capturePreFormulaState();
+    if (!(0, _helper.isEditorUndoRedoKeyEvent)(e.nativeEvent)) {
+      capturePreEditorHistoryState();
+    }
+    var isPotentialContentKey = !e.metaKey && !e.ctrlKey && !e.altKey && (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete" || e.key === "Enter" || e.key === "Tab");
+    if (isPotentialContentKey) {
+      requestAnimationFrame(function () {
+        requestAnimationFrame(function () {
+          if ((0, _fortuneCore.getFormulaEditorOwner)(context) !== "cell") return;
+          appendEditorHistoryFromPrimaryEditor(function () {
+            return (0, _helper.getCursorPosition)(inputRef.current);
+          });
+        });
+      });
+    }
     var currentInputText = ((_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.innerText) === null || _b === void 0 ? void 0 : _b.trim()) || "";
     if ((e.key === "=" || currentInputText.startsWith("=")) && context.luckysheetCellUpdate.length === 2 && formulaAnchorCellRef.current == null) {
       setContext(function (draftCtx) {
@@ -436,9 +448,9 @@ var InputBox = function InputBox() {
       setContext(function (draftCtx) {
         draftCtx.formulaCache.rangeSelectionActive = null;
       });
-      var _d = formulaAnchorCellRef.current,
-        anchorRow_1 = _d[0],
-        anchorCol_1 = _d[1];
+      var _m = formulaAnchorCellRef.current,
+        anchorRow_1 = _m[0],
+        anchorCol_1 = _m[1];
       skipNextAnchorSelectionSyncRef.current = true;
       setTimeout(function () {
         setContext(function (draftCtx) {
@@ -464,39 +476,93 @@ var InputBox = function InputBox() {
     }
     if ((e.metaKey || e.ctrlKey) && context.luckysheetCellUpdate.length > 0) {
       if (e.code === "KeyZ" || e.code === "KeyY") {
-        var shouldUseFormulaHistory = currentInputText.startsWith("=") || formulaHistoryRef.current.active;
-        if (shouldUseFormulaHistory) {
-          var handledByFormulaHistory = handleFormulaHistoryUndoRedo(e.code === "KeyY" || e.code === "KeyZ" && e.shiftKey);
-          if (handledByFormulaHistory) {
-            e.preventDefault();
-          }
-        }
+        var isRedo_1 = e.code === "KeyY" || e.code === "KeyZ" && e.shiftKey;
+        e.preventDefault();
         e.stopPropagation();
+        var _attempt_ = function attempt_1(triesLeft) {
+          var handled = handleFormulaHistoryUndoRedo(isRedo_1);
+          if (handled) return;
+          if (triesLeft <= 0) return;
+          requestAnimationFrame(function () {
+            requestAnimationFrame(function () {
+              return _attempt_(triesLeft - 1);
+            });
+          });
+        };
+        _attempt_(2);
         return;
       }
       if (e.code === "KeyB") {
+        var beforeHtml_1 = (_d = (_c = inputRef.current) === null || _c === void 0 ? void 0 : _c.innerHTML) !== null && _d !== void 0 ? _d : "";
         (0, _fortuneCore.handleBold)(context, inputRef.current);
-        appendFormulaHistoryFromPrimaryEditor(function () {
-          return (0, _helper.getCursorPosition)(inputRef.current);
-        });
+        var _pushFormattingSnapshot_ = function pushFormattingSnapshot_1(triesLeft) {
+          requestAnimationFrame(function () {
+            var _a, _b;
+            var afterHtml = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML) !== null && _b !== void 0 ? _b : "";
+            if (afterHtml !== beforeHtml_1 || triesLeft <= 0) {
+              appendEditorHistoryFromPrimaryEditor(function () {
+                return (0, _helper.getCursorPosition)(inputRef.current);
+              });
+              return;
+            }
+            _pushFormattingSnapshot_(triesLeft - 1);
+          });
+        };
+        _pushFormattingSnapshot_(2);
         stopPropagation(e);
       } else if (e.code === "KeyI") {
+        var beforeHtml_2 = (_f = (_e = inputRef.current) === null || _e === void 0 ? void 0 : _e.innerHTML) !== null && _f !== void 0 ? _f : "";
         (0, _fortuneCore.handleItalic)(context, inputRef.current);
-        appendFormulaHistoryFromPrimaryEditor(function () {
-          return (0, _helper.getCursorPosition)(inputRef.current);
-        });
+        var _pushFormattingSnapshot_2 = function pushFormattingSnapshot_2(triesLeft) {
+          requestAnimationFrame(function () {
+            var _a, _b;
+            var afterHtml = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML) !== null && _b !== void 0 ? _b : "";
+            if (afterHtml !== beforeHtml_2 || triesLeft <= 0) {
+              appendEditorHistoryFromPrimaryEditor(function () {
+                return (0, _helper.getCursorPosition)(inputRef.current);
+              });
+              return;
+            }
+            _pushFormattingSnapshot_2(triesLeft - 1);
+          });
+        };
+        _pushFormattingSnapshot_2(2);
         stopPropagation(e);
       } else if (e.code === "KeyU") {
+        var beforeHtml_3 = (_h = (_g = inputRef.current) === null || _g === void 0 ? void 0 : _g.innerHTML) !== null && _h !== void 0 ? _h : "";
         (0, _fortuneCore.handleUnderline)(context, inputRef.current);
-        appendFormulaHistoryFromPrimaryEditor(function () {
-          return (0, _helper.getCursorPosition)(inputRef.current);
-        });
+        var _pushFormattingSnapshot_3 = function pushFormattingSnapshot_3(triesLeft) {
+          requestAnimationFrame(function () {
+            var _a, _b;
+            var afterHtml = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML) !== null && _b !== void 0 ? _b : "";
+            if (afterHtml !== beforeHtml_3 || triesLeft <= 0) {
+              appendEditorHistoryFromPrimaryEditor(function () {
+                return (0, _helper.getCursorPosition)(inputRef.current);
+              });
+              return;
+            }
+            _pushFormattingSnapshot_3(triesLeft - 1);
+          });
+        };
+        _pushFormattingSnapshot_3(2);
         stopPropagation(e);
       } else if (e.code === "KeyS") {
+        var beforeHtml_4 = (_k = (_j = inputRef.current) === null || _j === void 0 ? void 0 : _j.innerHTML) !== null && _k !== void 0 ? _k : "";
         (0, _fortuneCore.handleStrikeThrough)(context, inputRef.current);
-        appendFormulaHistoryFromPrimaryEditor(function () {
-          return (0, _helper.getCursorPosition)(inputRef.current);
-        });
+        var _pushFormattingSnapshot_4 = function pushFormattingSnapshot_4(triesLeft) {
+          requestAnimationFrame(function () {
+            var _a, _b;
+            var afterHtml = (_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.innerHTML) !== null && _b !== void 0 ? _b : "";
+            if (afterHtml !== beforeHtml_4 || triesLeft <= 0) {
+              appendEditorHistoryFromPrimaryEditor(function () {
+                return (0, _helper.getCursorPosition)(inputRef.current);
+              });
+              return;
+            }
+            _pushFormattingSnapshot_4(triesLeft - 1);
+          });
+        };
+        _pushFormattingSnapshot_4(2);
         stopPropagation(e);
       }
     }
@@ -506,7 +572,7 @@ var InputBox = function InputBox() {
     }
     var allowListNavigation = true;
     var isArrowKey = e.key === "ArrowUp" || e.key === "ArrowDown" || e.key === "ArrowLeft" || e.key === "ArrowRight";
-    var isInPlaceEditMode = ((_c = refs.globalCache) === null || _c === void 0 ? void 0 : _c.enteredEditByTyping) !== true;
+    var isInPlaceEditMode = ((_l = refs.globalCache) === null || _l === void 0 ? void 0 : _l.enteredEditByTyping) !== true;
     if (e.key === "Delete" || e.key === "Backspace") {
       var anchor = formulaAnchorCellRef.current;
       if (anchor != null) {
@@ -595,7 +661,7 @@ var InputBox = function InputBox() {
       }
       e.preventDefault();
     }
-  }, [capturePreFormulaState, clearSearchItemActiveClass, context.luckysheetCellUpdate.length, handleFormulaHistoryUndoRedo, selectActiveFormula, setContext, firstSelection, refs.cellInput]);
+  }, [capturePreEditorHistoryState, clearSearchItemActiveClass, context.luckysheetCellUpdate.length, handleFormulaHistoryUndoRedo, selectActiveFormula, setContext, firstSelection, refs.cellInput]);
   var handleHideShowHint = function handleHideShowHint() {
     var _a, _b, _c, _d;
     var searchElFx = (_a = document.getElementsByClassName("fx-search")) === null || _a === void 0 ? void 0 : _a[0];
@@ -637,11 +703,11 @@ var InputBox = function InputBox() {
       }
       return;
     }
+    if ((0, _helper.isEditorUndoRedoKeyEvent)(e)) {
+      return;
+    }
     var kcode = e.keyCode;
     if (!kcode) return;
-    appendFormulaHistoryFromPrimaryEditor(function () {
-      return (0, _helper.getCursorPosition)(inputRef.current);
-    });
     if (!(kcode >= 112 && kcode <= 123 || kcode <= 46 || kcode === 144 || kcode === 108 || e.ctrlKey || e.altKey || e.shiftKey && (kcode === 37 || kcode === 38 || kcode === 39 || kcode === 40)) || kcode === 8 || kcode === 32 || kcode === 46 || e.ctrlKey && kcode === 86) {
       setContext(function (draftCtx) {
         var _a, _b;
@@ -656,7 +722,13 @@ var InputBox = function InputBox() {
         }
       });
     }
-  }, [refs.cellInput, refs.fxInput, setContext, appendFormulaHistoryFromPrimaryEditor]);
+    requestAnimationFrame(function () {
+      if ((0, _fortuneCore.getFormulaEditorOwner)(context) !== "cell") return;
+      appendEditorHistoryFromPrimaryEditor(function () {
+        return (0, _helper.getCursorPosition)(inputRef.current);
+      });
+    });
+  }, [refs.cellInput, refs.fxInput, setContext, appendEditorHistoryFromPrimaryEditor]);
   var onPaste = (0, _react.useCallback)(function (e) {
     var plainText = e.clipboardData.getData("text/plain");
     e.preventDefault();

package/lib/components/SheetOverlay/helper.d.ts

@@ -1,6 +1,13 @@
 export declare function moveCursorToEnd(editableDiv: HTMLDivElement): void;
 export declare function getCursorPosition(editableDiv: HTMLDivElement): number;
+export declare function getSelectionOffsets(editableDiv: HTMLDivElement): {
+    start: number;
+    end: number;
+};
+export declare function isEditorUndoRedoKeyEvent(e: KeyboardEvent): boolean;
+export declare function shouldUseCustomEditorHistory(editorInnerTextTrimmed: string, historyActive: boolean): boolean;
 export declare function setCursorPosition(editableDiv: HTMLDivElement, targetOffset: number): void;
+export declare function setSelectionOffsets(editableDiv: HTMLDivElement, startOffset: number, endOffset: number): void;
 export declare function buildFormulaSuggestionText(editableDiv: HTMLDivElement, formulaName: string): {
     text: string;
     caretOffset: number;