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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (31) hide show
  1. package/es/components/ContextMenu/index.js +1 -1
  2. package/es/components/FxEditor/index.js +296 -55
  3. package/es/components/SheetOverlay/FormulaHint/index.js +46 -25
  4. package/es/components/SheetOverlay/FormulaSearch/index.d.ts +3 -1
  5. package/es/components/SheetOverlay/FormulaSearch/index.js +58 -29
  6. package/es/components/SheetOverlay/InputBox.js +164 -69
  7. package/es/components/SheetOverlay/helper.d.ts +2 -0
  8. package/es/components/SheetOverlay/helper.js +43 -0
  9. package/es/components/SheetOverlay/index.css +4 -4
  10. package/es/components/SheetOverlay/index.js +9 -2
  11. package/es/components/Workbook/index.js +2 -2
  12. package/es/hooks/useFormulaEditorHistory.d.ts +24 -0
  13. package/es/hooks/useFormulaEditorHistory.js +119 -0
  14. package/es/hooks/useRerenderOnFormulaCaret.d.ts +2 -0
  15. package/es/hooks/useRerenderOnFormulaCaret.js +28 -0
  16. package/lib/components/ContextMenu/index.js +1 -1
  17. package/lib/components/FxEditor/index.js +294 -53
  18. package/lib/components/SheetOverlay/FormulaHint/index.js +45 -24
  19. package/lib/components/SheetOverlay/FormulaSearch/index.d.ts +3 -1
  20. package/lib/components/SheetOverlay/FormulaSearch/index.js +57 -28
  21. package/lib/components/SheetOverlay/InputBox.js +162 -67
  22. package/lib/components/SheetOverlay/helper.d.ts +2 -0
  23. package/lib/components/SheetOverlay/helper.js +45 -0
  24. package/lib/components/SheetOverlay/index.css +4 -4
  25. package/lib/components/SheetOverlay/index.js +8 -1
  26. package/lib/components/Workbook/index.js +2 -2
  27. package/lib/hooks/useFormulaEditorHistory.d.ts +24 -0
  28. package/lib/hooks/useFormulaEditorHistory.js +126 -0
  29. package/lib/hooks/useRerenderOnFormulaCaret.d.ts +2 -0
  30. package/lib/hooks/useRerenderOnFormulaCaret.js +34 -0
  31. package/package.json +2 -2
@@ -336,9 +336,9 @@
336
336
  overflow: hidden;
337
337
  white-space: pre-wrap;
338
338
  outline: none;
339
- -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
340
- -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
341
- box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
339
+ /* -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 40%);
340
+ -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); */
341
+ /* box-shadow: 0 2px 5px rgb(0 0 0 / 40%); */
342
342
  word-wrap: break-word;
343
343
  background-color: rgb(255, 255, 255);
344
344
  font-size: 13px;
@@ -356,7 +356,7 @@
356
356
  }
357
357
 
358
358
  .luckysheet-formula-text-color {
359
- color: black;
359
+ color: darkred;
360
360
  }
361
361
 
362
362
  .luckysheet-formula-text-string {
@@ -10,7 +10,7 @@ var __assign = this && this.__assign || function () {
10
10
  };
11
11
  import React, { useContext, useCallback, useRef, useEffect, useLayoutEffect, useMemo } from "react";
12
12
  import "./index.css";
13
- import { locale, drawArrow, handleCellAreaDoubleClick, handleCellAreaMouseDown, handleContextMenu, handleOverlayMouseMove, handleOverlayMouseUp, selectAll, handleOverlayTouchEnd, handleOverlayTouchStart, createDropCellRange, getCellRowColumn, getCellHyperlink, showLinkCard, isAllowEdit, onCellsMoveStart, insertRowCol, getSheetIndex, fixRowStyleOverflowInFreeze, fixColumnStyleOverflowInFreeze, handleKeydownForZoom } from "@fileverse-dev/fortune-core";
13
+ import { locale, drawArrow, handleCellAreaDoubleClick, handleCellAreaMouseDown, handleContextMenu, handleOverlayMouseMove, handleOverlayMouseUp, selectAll, handleOverlayTouchEnd, handleOverlayTouchStart, createDropCellRange, getCellRowColumn, getCellHyperlink, showLinkCard, isAllowEdit, israngeseleciton, onCellsMoveStart, insertRowCol, getSheetIndex, fixRowStyleOverflowInFreeze, fixColumnStyleOverflowInFreeze, handleKeydownForZoom } from "@fileverse-dev/fortune-core";
14
14
  import _ from "lodash";
15
15
  import WorkbookContext from "../../context";
16
16
  import ColumnHeader from "./ColumnHeader";
@@ -49,6 +49,7 @@ var SheetOverlay = function SheetOverlay() {
49
49
  setContext(function (draftCtx) {
50
50
  var _a;
51
51
  handleCellAreaMouseDown(draftCtx, refs.globalCache, nativeEvent, refs.cellInput.current, refs.cellArea.current, refs.fxInput.current, refs.canvas.current.getContext("2d"));
52
+ var keepFormulaBarFocused = draftCtx.luckysheetCellUpdate.length > 0 && draftCtx.formulaCache.formulaEditorOwner === "fx" && (draftCtx.formulaCache.rangestart || draftCtx.formulaCache.rangedrag_column_start || draftCtx.formulaCache.rangedrag_row_start || israngeseleciton(draftCtx));
52
53
  if (!_.isEmpty((_a = draftCtx.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]) && refs.cellInput.current) {
53
54
  if (!isAllowEdit(draftCtx)) {
54
55
  setTimeout(function () {
@@ -60,7 +61,13 @@ var SheetOverlay = function SheetOverlay() {
60
61
  } else {
61
62
  setTimeout(function () {
62
63
  var _a;
63
- (_a = refs.cellInput.current) === null || _a === void 0 ? void 0 : _a.focus();
64
+ if (keepFormulaBarFocused && refs.fxInput.current) {
65
+ refs.fxInput.current.focus({
66
+ preventScroll: true
67
+ });
68
+ } else {
69
+ (_a = refs.cellInput.current) === null || _a === void 0 ? void 0 : _a.focus();
70
+ }
64
71
  });
65
72
  }
66
73
  }
@@ -878,7 +878,7 @@ var Workbook = /*#__PURE__*/React.forwardRef(function (_a, ref) {
878
878
  });
879
879
  }
880
880
  var nativeEvent = e.nativeEvent;
881
- if ((e.ctrlKey || e.metaKey) && e.code === "KeyZ") {
881
+ if ((e.ctrlKey || e.metaKey) && e.code === "KeyZ" && context.luckysheetCellUpdate.length === 0) {
882
882
  if (e.shiftKey) {
883
883
  handleRedo();
884
884
  } else {
@@ -887,7 +887,7 @@ var Workbook = /*#__PURE__*/React.forwardRef(function (_a, ref) {
887
887
  e.stopPropagation();
888
888
  return;
889
889
  }
890
- if ((e.ctrlKey || e.metaKey) && e.code === "KeyY") {
890
+ if ((e.ctrlKey || e.metaKey) && e.code === "KeyY" && context.luckysheetCellUpdate.length === 0) {
891
891
  handleRedo();
892
892
  e.stopPropagation();
893
893
  e.preventDefault();
@@ -0,0 +1,24 @@
1
+ import { type RefObject } from "react";
2
+ import { type Context } from "@fileverse-dev/fortune-core";
3
+ import type { SetContextOptions } from "../context";
4
+ export type FormulaHistoryEntry = {
5
+ text: string;
6
+ caret: number;
7
+ spanValues: string[];
8
+ };
9
+ export type FormulaEditorHistoryPrimary = "cell" | "fx";
10
+ type SetContext = (recipe: (ctx: Context) => void, options?: SetContextOptions) => void;
11
+ export declare function useFormulaEditorHistory(primaryRef: RefObject<HTMLDivElement | null>, cellInputRef: RefObject<HTMLDivElement | null>, fxInputRef: RefObject<HTMLDivElement | null>, setContext: SetContext, primary: FormulaEditorHistoryPrimary): {
12
+ formulaHistoryRef: RefObject<{
13
+ active: boolean;
14
+ entries: FormulaHistoryEntry[];
15
+ index: number;
16
+ }>;
17
+ preTextRef: RefObject<string>;
18
+ preFormulaSpanValuesRef: RefObject<string[] | null>;
19
+ resetFormulaHistory: () => void;
20
+ handleFormulaHistoryUndoRedo: (isRedo: boolean) => boolean;
21
+ capturePreFormulaState: () => void;
22
+ appendFormulaHistoryFromPrimaryEditor: (getCaret: () => number) => void;
23
+ };
24
+ export {};
@@ -0,0 +1,119 @@
1
+ import { useCallback, useRef } from "react";
2
+ import _ from "lodash";
3
+ import { escapeScriptTag, functionHTMLGenerate, escapeHTMLTag, handleFormulaInput } from "@fileverse-dev/fortune-core";
4
+ import { setCursorPosition } from "../components/SheetOverlay/helper";
5
+ var MAX_FORMULA_HISTORY = 100;
6
+ export function useFormulaEditorHistory(primaryRef, cellInputRef, fxInputRef, setContext, primary) {
7
+ var preTextRef = useRef("");
8
+ var preFormulaSpanValuesRef = useRef(null);
9
+ var formulaHistoryRef = useRef({
10
+ active: false,
11
+ entries: [],
12
+ index: -1
13
+ });
14
+ var resetFormulaHistory = useCallback(function () {
15
+ formulaHistoryRef.current = {
16
+ active: false,
17
+ entries: [],
18
+ index: -1
19
+ };
20
+ preFormulaSpanValuesRef.current = null;
21
+ }, []);
22
+ var pushFormulaHistoryEntry = useCallback(function (entry) {
23
+ var history = formulaHistoryRef.current;
24
+ var current = history.entries[history.index];
25
+ if (current && current.spanValues.length > 0 && entry.spanValues.length > 0 && _.isEqual(current.spanValues, entry.spanValues)) {
26
+ return;
27
+ }
28
+ if (current && current.spanValues.length === 0 && entry.spanValues.length === 0 && current.text === entry.text && current.caret === entry.caret) {
29
+ return;
30
+ }
31
+ var nextEntries = history.entries.slice(0, history.index + 1);
32
+ nextEntries.push(entry);
33
+ if (nextEntries.length > MAX_FORMULA_HISTORY) {
34
+ nextEntries.shift();
35
+ }
36
+ history.entries = nextEntries;
37
+ history.index = nextEntries.length - 1;
38
+ history.active = true;
39
+ }, []);
40
+ var applyFormulaHistoryEntry = useCallback(function (entry) {
41
+ var primaryEl = primaryRef.current;
42
+ if (!primaryEl) return;
43
+ var safeText = escapeScriptTag(entry.text || "");
44
+ var html = safeText.startsWith("=") ? functionHTMLGenerate(safeText) : escapeHTMLTag(safeText);
45
+ var cell = cellInputRef.current;
46
+ var fx = fxInputRef.current;
47
+ primaryEl.innerHTML = html;
48
+ if (primary === "cell") {
49
+ if (fx) fx.innerHTML = html;
50
+ } else if (cell) {
51
+ cell.innerHTML = html;
52
+ }
53
+ setCursorPosition(primaryEl, Math.min(entry.caret, entry.text.length));
54
+ setContext(function (draftCtx) {
55
+ if (primary === "cell") {
56
+ if (!cellInputRef.current) return;
57
+ handleFormulaInput(draftCtx, fxInputRef.current, cellInputRef.current, 0);
58
+ } else {
59
+ if (!fxInputRef.current) return;
60
+ handleFormulaInput(draftCtx, cellInputRef.current, fxInputRef.current, 0);
61
+ }
62
+ });
63
+ }, [cellInputRef, fxInputRef, primary, primaryRef, setContext]);
64
+ var handleFormulaHistoryUndoRedo = useCallback(function (isRedo) {
65
+ var history = formulaHistoryRef.current;
66
+ if (!history.active || history.entries.length === 0) return false;
67
+ var nextIndex = isRedo ? history.index + 1 : history.index - 1;
68
+ if (nextIndex < 0 || nextIndex >= history.entries.length) return true;
69
+ history.index = nextIndex;
70
+ applyFormulaHistoryEntry(history.entries[nextIndex]);
71
+ return true;
72
+ }, [applyFormulaHistoryEntry]);
73
+ var capturePreFormulaState = useCallback(function () {
74
+ var el = primaryRef.current;
75
+ if (!el) return;
76
+ preTextRef.current = el.innerText;
77
+ preFormulaSpanValuesRef.current = Array.from(el.querySelectorAll("span.fortune-formula-functionrange-cell")).map(function (node) {
78
+ var _a;
79
+ return (_a = node.textContent) !== null && _a !== void 0 ? _a : "";
80
+ });
81
+ }, [primaryRef]);
82
+ var appendFormulaHistoryFromPrimaryEditor = useCallback(function (getCaret) {
83
+ var _a, _b;
84
+ var el = primaryRef.current;
85
+ if (!el) return;
86
+ var currentText = el.innerText || "";
87
+ if (currentText.startsWith("=")) {
88
+ var caret = getCaret();
89
+ var spanValues = Array.from(el.querySelectorAll("span.fortune-formula-functionrange-cell")).map(function (node) {
90
+ var _a;
91
+ return (_a = node.textContent) !== null && _a !== void 0 ? _a : "";
92
+ });
93
+ if (!formulaHistoryRef.current.active) {
94
+ var seedText = preTextRef.current || "";
95
+ pushFormulaHistoryEntry({
96
+ text: seedText,
97
+ caret: Math.min(caret, seedText.length),
98
+ spanValues: (_b = (_a = preFormulaSpanValuesRef.current) !== null && _a !== void 0 ? _a : spanValues) !== null && _b !== void 0 ? _b : []
99
+ });
100
+ }
101
+ pushFormulaHistoryEntry({
102
+ text: currentText,
103
+ caret: caret,
104
+ spanValues: spanValues
105
+ });
106
+ } else if (formulaHistoryRef.current.active) {
107
+ resetFormulaHistory();
108
+ }
109
+ }, [primaryRef, pushFormulaHistoryEntry, resetFormulaHistory]);
110
+ return {
111
+ formulaHistoryRef: formulaHistoryRef,
112
+ preTextRef: preTextRef,
113
+ preFormulaSpanValuesRef: preFormulaSpanValuesRef,
114
+ resetFormulaHistory: resetFormulaHistory,
115
+ handleFormulaHistoryUndoRedo: handleFormulaHistoryUndoRedo,
116
+ capturePreFormulaState: capturePreFormulaState,
117
+ appendFormulaHistoryFromPrimaryEditor: appendFormulaHistoryFromPrimaryEditor
118
+ };
119
+ }
@@ -0,0 +1,2 @@
1
+ import { type RefObject } from "react";
2
+ export declare function useRerenderOnFormulaCaret(editorRef: RefObject<HTMLDivElement | null>, editSessionActive: boolean): void;
@@ -0,0 +1,28 @@
1
+ import { useEffect, useState } from "react";
2
+ export function useRerenderOnFormulaCaret(editorRef, editSessionActive) {
3
+ var _a = useState(0),
4
+ bump = _a[1];
5
+ useEffect(function () {
6
+ if (!editSessionActive) {
7
+ return function () {};
8
+ }
9
+ var onSelectionChange = function onSelectionChange() {
10
+ var _a, _b;
11
+ var el = editorRef.current;
12
+ if (!el) return;
13
+ var text = (_b = (_a = el.innerText) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : "";
14
+ if (!text.startsWith("=")) return;
15
+ var sel = window.getSelection();
16
+ if (!(sel === null || sel === void 0 ? void 0 : sel.rangeCount) || !el.contains(sel.getRangeAt(0).startContainer)) {
17
+ return;
18
+ }
19
+ bump(function (n) {
20
+ return n + 1;
21
+ });
22
+ };
23
+ document.addEventListener("selectionchange", onSelectionChange);
24
+ return function () {
25
+ document.removeEventListener("selectionchange", onSelectionChange);
26
+ };
27
+ }, [editSessionActive, editorRef]);
28
+ }
@@ -21,7 +21,7 @@ require("./index.css");
21
21
  var _Menu = _interopRequireDefault(require("./Menu"));
22
22
  require("tippy.js/dist/tippy.css");
23
23
  var _SVGIcon = _interopRequireDefault(require("../SVGIcon"));
24
- var _LucideIcon = require("../../components/SheetOverlay/LucideIcon");
24
+ var _LucideIcon = require("../SheetOverlay/LucideIcon");
25
25
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
26
26
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
27
27
  var __awaiter = void 0 && (void 0).__awaiter || function (thisArg, _arguments, P, generator) {