@fileverse-dev/fortune-react 1.3.11-input-ref → 1.3.11-input-ref-2

package/lib/components/SheetOverlay/index.css

@@ -336,9 +336,9 @@
   overflow: hidden;
   white-space: pre-wrap;
   outline: none;
-  -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
-  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
-  box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
+  /* -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
+  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); */
+  /* box-shadow: 0 2px 5px rgb(0 0 0 / 40%); */
   word-wrap: break-word;
   background-color: rgb(255, 255, 255);
   font-size: 13px;
@@ -356,7 +356,7 @@
 }
 
 .luckysheet-formula-text-color {
-  color: black;
+  color: darkred;
 }
 
 .luckysheet-formula-text-string {

package/lib/components/SheetOverlay/index.js

@@ -58,6 +58,7 @@ var SheetOverlay = function SheetOverlay() {
       setContext(function (draftCtx) {
         var _a;
         (0, _fortuneCore.handleCellAreaMouseDown)(draftCtx, refs.globalCache, nativeEvent, refs.cellInput.current, refs.cellArea.current, refs.fxInput.current, refs.canvas.current.getContext("2d"));
+        var keepFormulaBarFocused = draftCtx.luckysheetCellUpdate.length > 0 && draftCtx.formulaCache.formulaEditorOwner === "fx" && (draftCtx.formulaCache.rangestart || draftCtx.formulaCache.rangedrag_column_start || draftCtx.formulaCache.rangedrag_row_start || (0, _fortuneCore.israngeseleciton)(draftCtx));
         if (!_lodash.default.isEmpty((_a = draftCtx.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]) && refs.cellInput.current) {
           if (!(0, _fortuneCore.isAllowEdit)(draftCtx)) {
             setTimeout(function () {
@@ -69,7 +70,13 @@ var SheetOverlay = function SheetOverlay() {
           } else {
             setTimeout(function () {
               var _a;
-              (_a = refs.cellInput.current) === null || _a === void 0 ? void 0 : _a.focus();
+              if (keepFormulaBarFocused && refs.fxInput.current) {
+                refs.fxInput.current.focus({
+                  preventScroll: true
+                });
+              } else {
+                (_a = refs.cellInput.current) === null || _a === void 0 ? void 0 : _a.focus();
+              }
             });
           }
         }

package/lib/components/Workbook/index.js

@@ -887,7 +887,7 @@ var Workbook = /*#__PURE__*/_react.default.forwardRef(function (_a, ref) {
       });
     }
     var nativeEvent = e.nativeEvent;
-    if ((e.ctrlKey || e.metaKey) && e.code === "KeyZ") {
+    if ((e.ctrlKey || e.metaKey) && e.code === "KeyZ" && context.luckysheetCellUpdate.length === 0) {
       if (e.shiftKey) {
         handleRedo();
       } else {
@@ -896,7 +896,7 @@ var Workbook = /*#__PURE__*/_react.default.forwardRef(function (_a, ref) {
       e.stopPropagation();
       return;
     }
-    if ((e.ctrlKey || e.metaKey) && e.code === "KeyY") {
+    if ((e.ctrlKey || e.metaKey) && e.code === "KeyY" && context.luckysheetCellUpdate.length === 0) {
       handleRedo();
       e.stopPropagation();
       e.preventDefault();

package/lib/hooks/useFormulaEditorHistory.d.ts

@@ -0,0 +1,24 @@
+import { type RefObject } from "react";
+import { type Context } from "@fileverse-dev/fortune-core";
+import type { SetContextOptions } from "../context";
+export type FormulaHistoryEntry = {
+    text: string;
+    caret: number;
+    spanValues: string[];
+};
+export type FormulaEditorHistoryPrimary = "cell" | "fx";
+type SetContext = (recipe: (ctx: Context) => void, options?: SetContextOptions) => void;
+export declare function useFormulaEditorHistory(primaryRef: RefObject<HTMLDivElement | null>, cellInputRef: RefObject<HTMLDivElement | null>, fxInputRef: RefObject<HTMLDivElement | null>, setContext: SetContext, primary: FormulaEditorHistoryPrimary): {
+    formulaHistoryRef: RefObject<{
+        active: boolean;
+        entries: FormulaHistoryEntry[];
+        index: number;
+    }>;
+    preTextRef: RefObject<string>;
+    preFormulaSpanValuesRef: RefObject<string[] | null>;
+    resetFormulaHistory: () => void;
+    handleFormulaHistoryUndoRedo: (isRedo: boolean) => boolean;
+    capturePreFormulaState: () => void;
+    appendFormulaHistoryFromPrimaryEditor: (getCaret: () => number) => void;
+};
+export {};

package/lib/hooks/useFormulaEditorHistory.js

@@ -0,0 +1,126 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFormulaEditorHistory = useFormulaEditorHistory;
+var _react = require("react");
+var _lodash = _interopRequireDefault(require("lodash"));
+var _fortuneCore = require("@fileverse-dev/fortune-core");
+var _helper = require("../components/SheetOverlay/helper");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var MAX_FORMULA_HISTORY = 100;
+function useFormulaEditorHistory(primaryRef, cellInputRef, fxInputRef, setContext, primary) {
+  var preTextRef = (0, _react.useRef)("");
+  var preFormulaSpanValuesRef = (0, _react.useRef)(null);
+  var formulaHistoryRef = (0, _react.useRef)({
+    active: false,
+    entries: [],
+    index: -1
+  });
+  var resetFormulaHistory = (0, _react.useCallback)(function () {
+    formulaHistoryRef.current = {
+      active: false,
+      entries: [],
+      index: -1
+    };
+    preFormulaSpanValuesRef.current = null;
+  }, []);
+  var pushFormulaHistoryEntry = (0, _react.useCallback)(function (entry) {
+    var history = formulaHistoryRef.current;
+    var current = history.entries[history.index];
+    if (current && current.spanValues.length > 0 && entry.spanValues.length > 0 && _lodash.default.isEqual(current.spanValues, entry.spanValues)) {
+      return;
+    }
+    if (current && current.spanValues.length === 0 && entry.spanValues.length === 0 && current.text === entry.text && current.caret === entry.caret) {
+      return;
+    }
+    var nextEntries = history.entries.slice(0, history.index + 1);
+    nextEntries.push(entry);
+    if (nextEntries.length > MAX_FORMULA_HISTORY) {
+      nextEntries.shift();
+    }
+    history.entries = nextEntries;
+    history.index = nextEntries.length - 1;
+    history.active = true;
+  }, []);
+  var applyFormulaHistoryEntry = (0, _react.useCallback)(function (entry) {
+    var primaryEl = primaryRef.current;
+    if (!primaryEl) return;
+    var safeText = (0, _fortuneCore.escapeScriptTag)(entry.text || "");
+    var html = safeText.startsWith("=") ? (0, _fortuneCore.functionHTMLGenerate)(safeText) : (0, _fortuneCore.escapeHTMLTag)(safeText);
+    var cell = cellInputRef.current;
+    var fx = fxInputRef.current;
+    primaryEl.innerHTML = html;
+    if (primary === "cell") {
+      if (fx) fx.innerHTML = html;
+    } else if (cell) {
+      cell.innerHTML = html;
+    }
+    (0, _helper.setCursorPosition)(primaryEl, Math.min(entry.caret, entry.text.length));
+    setContext(function (draftCtx) {
+      if (primary === "cell") {
+        if (!cellInputRef.current) return;
+        (0, _fortuneCore.handleFormulaInput)(draftCtx, fxInputRef.current, cellInputRef.current, 0);
+      } else {
+        if (!fxInputRef.current) return;
+        (0, _fortuneCore.handleFormulaInput)(draftCtx, cellInputRef.current, fxInputRef.current, 0);
+      }
+    });
+  }, [cellInputRef, fxInputRef, primary, primaryRef, setContext]);
+  var handleFormulaHistoryUndoRedo = (0, _react.useCallback)(function (isRedo) {
+    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;
+    history.index = nextIndex;
+    applyFormulaHistoryEntry(history.entries[nextIndex]);
+    return true;
+  }, [applyFormulaHistoryEntry]);
+  var capturePreFormulaState = (0, _react.useCallback)(function () {
+    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 : "";
+    });
+  }, [primaryRef]);
+  var appendFormulaHistoryFromPrimaryEditor = (0, _react.useCallback)(function (getCaret) {
+    var _a, _b;
+    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 : []
+        });
+      }
+      pushFormulaHistoryEntry({
+        text: currentText,
+        caret: caret,
+        spanValues: spanValues
+      });
+    } else if (formulaHistoryRef.current.active) {
+      resetFormulaHistory();
+    }
+  }, [primaryRef, pushFormulaHistoryEntry, resetFormulaHistory]);
+  return {
+    formulaHistoryRef: formulaHistoryRef,
+    preTextRef: preTextRef,
+    preFormulaSpanValuesRef: preFormulaSpanValuesRef,
+    resetFormulaHistory: resetFormulaHistory,
+    handleFormulaHistoryUndoRedo: handleFormulaHistoryUndoRedo,
+    capturePreFormulaState: capturePreFormulaState,
+    appendFormulaHistoryFromPrimaryEditor: appendFormulaHistoryFromPrimaryEditor
+  };
+}

package/lib/hooks/useRerenderOnFormulaCaret.d.ts

@@ -0,0 +1,2 @@
+import { type RefObject } from "react";
+export declare function useRerenderOnFormulaCaret(editorRef: RefObject<HTMLDivElement | null>, editSessionActive: boolean): void;

package/lib/hooks/useRerenderOnFormulaCaret.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useRerenderOnFormulaCaret = useRerenderOnFormulaCaret;
+var _react = require("react");
+function useRerenderOnFormulaCaret(editorRef, editSessionActive) {
+  var _a = (0, _react.useState)(0),
+    bump = _a[1];
+  (0, _react.useEffect)(function () {
+    if (!editSessionActive) {
+      return function () {};
+    }
+    var onSelectionChange = function onSelectionChange() {
+      var _a, _b;
+      var el = editorRef.current;
+      if (!el) return;
+      var text = (_b = (_a = el.innerText) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : "";
+      if (!text.startsWith("=")) return;
+      var sel = window.getSelection();
+      if (!(sel === null || sel === void 0 ? void 0 : sel.rangeCount) || !el.contains(sel.getRangeAt(0).startContainer)) {
+        return;
+      }
+      bump(function (n) {
+        return n + 1;
+      });
+    };
+    document.addEventListener("selectionchange", onSelectionChange);
+    return function () {
+      document.removeEventListener("selectionchange", onSelectionChange);
+    };
+  }, [editSessionActive, editorRef]);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fileverse-dev/fortune-react",
-  "version": "1.3.11-input-ref",
+  "version": "1.3.11-input-ref-2",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "module": "es/index.js",
@@ -16,7 +16,7 @@
     "tsc": "tsc"
   },
   "dependencies": {
-    "@fileverse-dev/fortune-core": "1.3.11-input-ref",
+    "@fileverse-dev/fortune-core": "1.3.11-input-ref-2",
     "@fileverse/ui": "5.0.0",
     "@tippyjs/react": "^4.2.6",
     "@types/regenerator-runtime": "^0.13.6",