@fileverse-dev/fortune-react 1.2.26 → 1.2.28

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 (11) hide show
  1. package/es/components/FxEditor/index.js +98 -9
  2. package/es/components/SheetOverlay/InputBox.js +4 -0
  3. package/es/components/Toolbar/Button.d.ts +1 -0
  4. package/es/components/Toolbar/Button.js +3 -1
  5. package/es/components/Toolbar/index.js +2 -0
  6. package/lib/components/FxEditor/index.js +97 -8
  7. package/lib/components/SheetOverlay/InputBox.js +4 -0
  8. package/lib/components/Toolbar/Button.d.ts +1 -0
  9. package/lib/components/Toolbar/Button.js +3 -1
  10. package/lib/components/Toolbar/index.js +2 -0
  11. package/package.json +2 -2
package/es/components/FxEditor/index.js CHANGED
@@ -9,7 +9,7 @@ import FormulaSearch from "../../components/SheetOverlay/FormulaSearch";
9
9
  import FormulaHint from "../../components/SheetOverlay/FormulaHint";
10
10
  import usePrevious from "../../hooks/usePrevious";
11
11
  import { LucideIcon } from "../../components/SheetOverlay/LucideIcon";
12
- import { countCommasBeforeCursor } from "../../components/SheetOverlay/helper";
12
+ import { countCommasBeforeCursor, isLetterNumberPattern, moveCursorToEnd } from "../../components/SheetOverlay/helper";
13
13
  var FxEditor = function FxEditor() {
14
14
  var _a, _b, _c;
15
15
  var hideFormulaHintLocal = localStorage.getItem("formulaMore") === "true";
@@ -81,6 +81,51 @@ var FxEditor = function FxEditor() {
81
81
  });
82
82
  }
83
83
  }, [context.config, context.luckysheet_select_save, context.luckysheetfile, context.currentSheetId, refs.globalCache, setContext]);
84
+ var getActiveFormula = useCallback(function () {
85
+ return document.querySelector(".luckysheet-formula-search-item-active");
86
+ }, []);
87
+ var insertSelectedFormula = useCallback(function (formulaName) {
88
+ if (/^=[a-zA-Z]+$/.test(refs.fxInput.current.innerText)) {
89
+ var ht = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span><span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>");
90
+ refs.fxInput.current.innerHTML = ht;
91
+ var cellEditor = document.getElementById("luckysheet-rich-text-editor");
92
+ if (cellEditor) {
93
+ cellEditor.innerHTML = ht;
94
+ }
95
+ moveCursorToEnd(refs.fxInput.current);
96
+ setContext(function (draftCtx) {
97
+ draftCtx.functionCandidates = [];
98
+ draftCtx.defaultCandidates = [];
99
+ draftCtx.functionHint = formulaName;
100
+ });
101
+ }
102
+ }, [setContext]);
103
+ var clearSearchItemActiveClass = useCallback(function () {
104
+ var activeFormula = getActiveFormula();
105
+ if (activeFormula) {
106
+ activeFormula.classList.remove("luckysheet-formula-search-item-active");
107
+ }
108
+ }, [getActiveFormula]);
109
+ var getLastInputSpanText = function getLastInputSpanText() {
110
+ var _a, _b;
111
+ var parser = new DOMParser();
112
+ var doc = parser.parseFromString("<div>".concat((_b = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.innerHTML, "</div>"), "text/html");
113
+ var spans = doc.querySelectorAll("span");
114
+ var lastSpan = spans[spans.length - 1];
115
+ return lastSpan === null || lastSpan === void 0 ? void 0 : lastSpan.innerText;
116
+ };
117
+ var selectActiveFormulaOnClick = useCallback(function (e) {
118
+ var _a, _b, _c;
119
+ if (e.target.className.includes("sign-fortune")) return;
120
+ recentText.current = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current.innerText;
121
+ var formulaName = (_c = (_b = getActiveFormula()) === null || _b === void 0 ? void 0 : _b.querySelector(".luckysheet-formula-search-func")) === null || _c === void 0 ? void 0 : _c.textContent;
122
+ var lastSpanText = getLastInputSpanText();
123
+ if (formulaName && !isLetterNumberPattern(lastSpanText)) {
124
+ insertSelectedFormula(formulaName);
125
+ e.preventDefault();
126
+ e.stopPropagation();
127
+ }
128
+ }, [getActiveFormula, insertSelectedFormula]);
84
129
  var onKeyDown = useCallback(function (e) {
85
130
  var _a;
86
131
  if (context.allowEdit === false) {
@@ -94,6 +139,54 @@ var FxEditor = function FxEditor() {
94
139
  if (key === "ArrowLeft" || key === "ArrowRight") {
95
140
  e.stopPropagation();
96
141
  }
142
+ if (e.key === "Enter" && context.luckysheetCellUpdate.length > 0) {
143
+ if (e.altKey || e.metaKey) {
144
+ document.execCommand("insertHTML", false, "\n ");
145
+ document.execCommand("delete", false);
146
+ e.stopPropagation();
147
+ } else {
148
+ var event_1 = e;
149
+ selectActiveFormulaOnClick(event_1);
150
+ }
151
+ return;
152
+ }
153
+ if (e.key === "ArrowUp" && context.luckysheetCellUpdate.length > 0) {
154
+ if (document.getElementById("luckysheet-formula-search-c")) {
155
+ var formulaSearchContainer = document.getElementById("luckysheet-formula-search-c");
156
+ var activeItem = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item-active");
157
+ var previousItem = activeItem ? activeItem.previousElementSibling : null;
158
+ while (previousItem && !previousItem.classList.contains("luckysheet-formula-search-item")) {
159
+ previousItem = previousItem.previousElementSibling;
160
+ }
161
+ if (!previousItem) {
162
+ var items = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelectorAll(".luckysheet-formula-search-item");
163
+ var lastItem = items === null || items === void 0 ? void 0 : items[items.length - 1];
164
+ previousItem = lastItem || null;
165
+ }
166
+ clearSearchItemActiveClass();
167
+ if (previousItem) {
168
+ previousItem.classList.add("luckysheet-formula-search-item-active");
169
+ }
170
+ }
171
+ e.preventDefault();
172
+ } else if (e.key === "ArrowDown" && context.luckysheetCellUpdate.length > 0) {
173
+ if (document.getElementById("luckysheet-formula-search-c")) {
174
+ var formulaSearchContainer = document.getElementById("luckysheet-formula-search-c");
175
+ var activeItem = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item-active");
176
+ var nextItem = activeItem ? activeItem.nextElementSibling : null;
177
+ while (nextItem && !nextItem.classList.contains("luckysheet-formula-search-item")) {
178
+ nextItem = nextItem.nextElementSibling;
179
+ }
180
+ if (!nextItem) {
181
+ nextItem = (formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item")) || null;
182
+ }
183
+ clearSearchItemActiveClass();
184
+ if (nextItem) {
185
+ nextItem.classList.add("luckysheet-formula-search-item-active");
186
+ }
187
+ }
188
+ e.preventDefault();
189
+ }
97
190
  setContext(function (draftCtx) {
98
191
  if (context.luckysheetCellUpdate.length > 0) {
99
192
  switch (key) {
@@ -136,14 +229,6 @@ var FxEditor = function FxEditor() {
136
229
  }
137
230
  });
138
231
  }, [context.allowEdit, context.luckysheetCellUpdate.length, refs.fxInput, setContext]);
139
- var getLastInputSpanText = function getLastInputSpanText() {
140
- var _a, _b;
141
- var parser = new DOMParser();
142
- var doc = parser.parseFromString("<div>".concat((_b = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.innerHTML, "</div>"), "text/html");
143
- var spans = doc.querySelectorAll("span");
144
- var lastSpan = spans[spans.length - 1];
145
- return lastSpan === null || lastSpan === void 0 ? void 0 : lastSpan.innerText;
146
- };
147
232
  var handleHideShowHint = function handleHideShowHint() {
148
233
  var _a, _b, _c, _d;
149
234
  var el = (_a = document.getElementsByClassName("cell-hint")) === null || _a === void 0 ? void 0 : _a[0];
@@ -236,9 +321,13 @@ var FxEditor = function FxEditor() {
236
321
  if (document.getElementById("luckysheet-formula-search-c")) {
237
322
  var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
238
323
  if (!hoveredItem) return;
324
+ clearSearchItemActiveClass();
239
325
  hoveredItem.classList.add("luckysheet-formula-search-item-active");
240
326
  }
241
327
  e.preventDefault();
328
+ },
329
+ onMouseDown: function onMouseDown(e) {
330
+ selectActiveFormulaOnClick(e);
242
331
  }
243
332
  })), /*#__PURE__*/React.createElement("div", {
244
333
  className: "fx-hint"
package/es/components/SheetOverlay/InputBox.js CHANGED
@@ -164,6 +164,10 @@ var InputBox = function InputBox() {
164
164
  if (/^=[a-zA-Z]+$/.test(inputRef.current.innerText)) {
165
165
  var ht = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span><span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>");
166
166
  inputRef.current.innerHTML = ht;
167
+ var fxEditor = document.getElementById("luckysheet-functionbox-cell");
168
+ if (fxEditor) {
169
+ fxEditor.innerHTML = ht;
170
+ }
167
171
  moveCursorToEnd(inputRef.current);
168
172
  setContext(function (draftCtx) {
169
173
  draftCtx.functionCandidates = [];
package/es/components/Toolbar/Button.d.ts CHANGED
@@ -7,6 +7,7 @@ type Props = {
7
7
  selected?: boolean;
8
8
  children?: React.ReactNode;
9
9
  style?: React.CSSProperties;
10
+ id?: string;
10
11
  };
11
12
  declare const Button: React.FC<Props>;
12
13
  export default Button;
package/es/components/Toolbar/Button.js CHANGED
@@ -8,11 +8,13 @@ var Button = function Button(_a) {
8
8
  disabled = _a.disabled,
9
9
  selected = _a.selected,
10
10
  children = _a.children,
11
- style = _a.style;
11
+ style = _a.style,
12
+ id = _a.id;
12
13
  return /*#__PURE__*/React.createElement(Tooltip, {
13
14
  text: tooltip,
14
15
  placement: "bottom"
15
16
  }, /*#__PURE__*/React.createElement("div", {
17
+ id: id,
16
18
  className: "fortune-toolbar-button fortune-toolbar-item",
17
19
  onClick: onClick,
18
20
  tabIndex: 0,
package/es/components/Toolbar/index.js CHANGED
@@ -973,6 +973,7 @@ var Toolbar = function Toolbar(_a) {
973
973
  }
974
974
  if (name === "splitColumn") {
975
975
  return /*#__PURE__*/React.createElement(Button, {
976
+ id: "splitColumn",
976
977
  iconId: name,
977
978
  tooltip: tooltip,
978
979
  key: name,
@@ -997,6 +998,7 @@ var Toolbar = function Toolbar(_a) {
997
998
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(DataVerificationPortal, {
998
999
  visible: showDataValidation
999
1000
  }), /*#__PURE__*/React.createElement(Button, {
1001
+ id: "dataVerification",
1000
1002
  iconId: name,
1001
1003
  tooltip: tooltip,
1002
1004
  key: name,
package/lib/components/FxEditor/index.js CHANGED
@@ -90,6 +90,51 @@ var FxEditor = function FxEditor() {
90
90
  });
91
91
  }
92
92
  }, [context.config, context.luckysheet_select_save, context.luckysheetfile, context.currentSheetId, refs.globalCache, setContext]);
93
+ var getActiveFormula = (0, _react.useCallback)(function () {
94
+ return document.querySelector(".luckysheet-formula-search-item-active");
95
+ }, []);
96
+ var insertSelectedFormula = (0, _react.useCallback)(function (formulaName) {
97
+ if (/^=[a-zA-Z]+$/.test(refs.fxInput.current.innerText)) {
98
+ var ht = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span><span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>");
99
+ refs.fxInput.current.innerHTML = ht;
100
+ var cellEditor = document.getElementById("luckysheet-rich-text-editor");
101
+ if (cellEditor) {
102
+ cellEditor.innerHTML = ht;
103
+ }
104
+ (0, _helper.moveCursorToEnd)(refs.fxInput.current);
105
+ setContext(function (draftCtx) {
106
+ draftCtx.functionCandidates = [];
107
+ draftCtx.defaultCandidates = [];
108
+ draftCtx.functionHint = formulaName;
109
+ });
110
+ }
111
+ }, [setContext]);
112
+ var clearSearchItemActiveClass = (0, _react.useCallback)(function () {
113
+ var activeFormula = getActiveFormula();
114
+ if (activeFormula) {
115
+ activeFormula.classList.remove("luckysheet-formula-search-item-active");
116
+ }
117
+ }, [getActiveFormula]);
118
+ var getLastInputSpanText = function getLastInputSpanText() {
119
+ var _a, _b;
120
+ var parser = new DOMParser();
121
+ var doc = parser.parseFromString("<div>".concat((_b = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.innerHTML, "</div>"), "text/html");
122
+ var spans = doc.querySelectorAll("span");
123
+ var lastSpan = spans[spans.length - 1];
124
+ return lastSpan === null || lastSpan === void 0 ? void 0 : lastSpan.innerText;
125
+ };
126
+ var selectActiveFormulaOnClick = (0, _react.useCallback)(function (e) {
127
+ var _a, _b, _c;
128
+ if (e.target.className.includes("sign-fortune")) return;
129
+ recentText.current = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current.innerText;
130
+ var formulaName = (_c = (_b = getActiveFormula()) === null || _b === void 0 ? void 0 : _b.querySelector(".luckysheet-formula-search-func")) === null || _c === void 0 ? void 0 : _c.textContent;
131
+ var lastSpanText = getLastInputSpanText();
132
+ if (formulaName && !(0, _helper.isLetterNumberPattern)(lastSpanText)) {
133
+ insertSelectedFormula(formulaName);
134
+ e.preventDefault();
135
+ e.stopPropagation();
136
+ }
137
+ }, [getActiveFormula, insertSelectedFormula]);
93
138
  var onKeyDown = (0, _react.useCallback)(function (e) {
94
139
  var _a;
95
140
  if (context.allowEdit === false) {
@@ -103,6 +148,54 @@ var FxEditor = function FxEditor() {
103
148
  if (key === "ArrowLeft" || key === "ArrowRight") {
104
149
  e.stopPropagation();
105
150
  }
151
+ if (e.key === "Enter" && context.luckysheetCellUpdate.length > 0) {
152
+ if (e.altKey || e.metaKey) {
153
+ document.execCommand("insertHTML", false, "\n ");
154
+ document.execCommand("delete", false);
155
+ e.stopPropagation();
156
+ } else {
157
+ var event_1 = e;
158
+ selectActiveFormulaOnClick(event_1);
159
+ }
160
+ return;
161
+ }
162
+ if (e.key === "ArrowUp" && context.luckysheetCellUpdate.length > 0) {
163
+ if (document.getElementById("luckysheet-formula-search-c")) {
164
+ var formulaSearchContainer = document.getElementById("luckysheet-formula-search-c");
165
+ var activeItem = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item-active");
166
+ var previousItem = activeItem ? activeItem.previousElementSibling : null;
167
+ while (previousItem && !previousItem.classList.contains("luckysheet-formula-search-item")) {
168
+ previousItem = previousItem.previousElementSibling;
169
+ }
170
+ if (!previousItem) {
171
+ var items = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelectorAll(".luckysheet-formula-search-item");
172
+ var lastItem = items === null || items === void 0 ? void 0 : items[items.length - 1];
173
+ previousItem = lastItem || null;
174
+ }
175
+ clearSearchItemActiveClass();
176
+ if (previousItem) {
177
+ previousItem.classList.add("luckysheet-formula-search-item-active");
178
+ }
179
+ }
180
+ e.preventDefault();
181
+ } else if (e.key === "ArrowDown" && context.luckysheetCellUpdate.length > 0) {
182
+ if (document.getElementById("luckysheet-formula-search-c")) {
183
+ var formulaSearchContainer = document.getElementById("luckysheet-formula-search-c");
184
+ var activeItem = formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item-active");
185
+ var nextItem = activeItem ? activeItem.nextElementSibling : null;
186
+ while (nextItem && !nextItem.classList.contains("luckysheet-formula-search-item")) {
187
+ nextItem = nextItem.nextElementSibling;
188
+ }
189
+ if (!nextItem) {
190
+ nextItem = (formulaSearchContainer === null || formulaSearchContainer === void 0 ? void 0 : formulaSearchContainer.querySelector(".luckysheet-formula-search-item")) || null;
191
+ }
192
+ clearSearchItemActiveClass();
193
+ if (nextItem) {
194
+ nextItem.classList.add("luckysheet-formula-search-item-active");
195
+ }
196
+ }
197
+ e.preventDefault();
198
+ }
106
199
  setContext(function (draftCtx) {
107
200
  if (context.luckysheetCellUpdate.length > 0) {
108
201
  switch (key) {
@@ -145,14 +238,6 @@ var FxEditor = function FxEditor() {
145
238
  }
146
239
  });
147
240
  }, [context.allowEdit, context.luckysheetCellUpdate.length, refs.fxInput, setContext]);
148
- var getLastInputSpanText = function getLastInputSpanText() {
149
- var _a, _b;
150
- var parser = new DOMParser();
151
- var doc = parser.parseFromString("<div>".concat((_b = (_a = refs.fxInput) === null || _a === void 0 ? void 0 : _a.current) === null || _b === void 0 ? void 0 : _b.innerHTML, "</div>"), "text/html");
152
- var spans = doc.querySelectorAll("span");
153
- var lastSpan = spans[spans.length - 1];
154
- return lastSpan === null || lastSpan === void 0 ? void 0 : lastSpan.innerText;
155
- };
156
241
  var handleHideShowHint = function handleHideShowHint() {
157
242
  var _a, _b, _c, _d;
158
243
  var el = (_a = document.getElementsByClassName("cell-hint")) === null || _a === void 0 ? void 0 : _a[0];
@@ -245,9 +330,13 @@ var FxEditor = function FxEditor() {
245
330
  if (document.getElementById("luckysheet-formula-search-c")) {
246
331
  var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
247
332
  if (!hoveredItem) return;
333
+ clearSearchItemActiveClass();
248
334
  hoveredItem.classList.add("luckysheet-formula-search-item-active");
249
335
  }
250
336
  e.preventDefault();
337
+ },
338
+ onMouseDown: function onMouseDown(e) {
339
+ selectActiveFormulaOnClick(e);
251
340
  }
252
341
  })), /*#__PURE__*/_react.default.createElement("div", {
253
342
  className: "fx-hint"
package/lib/components/SheetOverlay/InputBox.js CHANGED
@@ -173,6 +173,10 @@ var InputBox = function InputBox() {
173
173
  if (/^=[a-zA-Z]+$/.test(inputRef.current.innerText)) {
174
174
  var ht = "<span dir=\"auto\" class=\"luckysheet-formula-text-color\">=</span><span dir=\"auto\" class=\"luckysheet-formula-text-func\">".concat(formulaName, "</span><span dir=\"auto\" class=\"luckysheet-formula-text-lpar\">(</span>");
175
175
  inputRef.current.innerHTML = ht;
176
+ var fxEditor = document.getElementById("luckysheet-functionbox-cell");
177
+ if (fxEditor) {
178
+ fxEditor.innerHTML = ht;
179
+ }
176
180
  (0, _helper.moveCursorToEnd)(inputRef.current);
177
181
  setContext(function (draftCtx) {
178
182
  draftCtx.functionCandidates = [];
package/lib/components/Toolbar/Button.d.ts CHANGED
@@ -7,6 +7,7 @@ type Props = {
7
7
  selected?: boolean;
8
8
  children?: React.ReactNode;
9
9
  style?: React.CSSProperties;
10
+ id?: string;
10
11
  };
11
12
  declare const Button: React.FC<Props>;
12
13
  export default Button;
package/lib/components/Toolbar/Button.js CHANGED
@@ -15,11 +15,13 @@ var Button = function Button(_a) {
15
15
  disabled = _a.disabled,
16
16
  selected = _a.selected,
17
17
  children = _a.children,
18
- style = _a.style;
18
+ style = _a.style,
19
+ id = _a.id;
19
20
  return /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
20
21
  text: tooltip,
21
22
  placement: "bottom"
22
23
  }, /*#__PURE__*/_react.default.createElement("div", {
24
+ id: id,
23
25
  className: "fortune-toolbar-button fortune-toolbar-item",
24
26
  onClick: onClick,
25
27
  tabIndex: 0,
package/lib/components/Toolbar/index.js CHANGED
@@ -982,6 +982,7 @@ var Toolbar = function Toolbar(_a) {
982
982
  }
983
983
  if (name === "splitColumn") {
984
984
  return /*#__PURE__*/_react.default.createElement(_Button.default, {
985
+ id: "splitColumn",
985
986
  iconId: name,
986
987
  tooltip: tooltip,
987
988
  key: name,
@@ -1006,6 +1007,7 @@ var Toolbar = function Toolbar(_a) {
1006
1007
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dataVerificationPortal.default, {
1007
1008
  visible: showDataValidation
1008
1009
  }), /*#__PURE__*/_react.default.createElement(_Button.default, {
1010
+ id: "dataVerification",
1009
1011
  iconId: name,
1010
1012
  tooltip: tooltip,
1011
1013
  key: name,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fileverse-dev/fortune-react",
3
- "version": "1.2.26",
3
+ "version": "1.2.28",
4
4
  "main": "lib/index.js",
5
5
  "types": "lib/index.d.ts",
6
6
  "module": "es/index.js",
@@ -16,7 +16,7 @@
16
16
  "tsc": "tsc"
17
17
  },
18
18
  "dependencies": {
19
- "@fileverse-dev/fortune-core": "1.2.26",
19
+ "@fileverse-dev/fortune-core": "1.2.28",
20
20
  "@fileverse/ui": "^4.1.7-patch-40",
21
21
  "@tippyjs/react": "^4.2.6",
22
22
  "@types/regenerator-runtime": "^0.13.6",