@fileverse-dev/fortune-react 1.1.66 → 1.1.67

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.
@@ -36,12 +36,11 @@ export var useSmoothScroll = function useSmoothScroll(scrollContainerRef) {
36
36
  }
37
37
  function handleWheelEvent(event) {
38
38
  var _a, _b;
39
- event.preventDefault();
40
39
  setContext(function (ctx) {
41
40
  removeEditingComment(ctx, refs.globalCache);
42
41
  });
43
42
  var functionDetailsElement = document.getElementById("function-details");
44
- var formulaSearchElement = document.getElementById("luckysheet-formula-search-c");
43
+ var formulaSearchElement = document.getElementById("luckysheet-formula-search-c-p");
45
44
  var isPointerOverFunctionDetails = functionDetailsElement === null || functionDetailsElement === void 0 ? void 0 : functionDetailsElement.matches(":hover");
46
45
  var isPointerOverFormulaSearch = formulaSearchElement === null || formulaSearchElement === void 0 ? void 0 : formulaSearchElement.matches(":hover");
47
46
  var isPointerInSearchDialog = !!((_b = (_a = refs === null || refs === void 0 ? void 0 : refs.globalCache) === null || _a === void 0 ? void 0 : _a.searchDialog) === null || _b === void 0 ? void 0 : _b.mouseEnter);
@@ -49,6 +48,7 @@ export var useSmoothScroll = function useSmoothScroll(scrollContainerRef) {
49
48
  if (functionDetailsElement && isPointerOverFunctionDetails || formulaSearchElement && isPointerOverFormulaSearch || isPointerInSearchDialog || hasFilterContextMenuOpen) {
50
49
  return;
51
50
  }
51
+ event.preventDefault();
52
52
  var scaleFactor = getPixelScale();
53
53
  scrollHandler(event.deltaX * scaleFactor, event.deltaY * scaleFactor);
54
54
  }
@@ -84,7 +84,7 @@ export var DraggableDiv = function DraggableDiv(_a) {
84
84
  if (newX + initialWindowPos.x - 35 < 0) {
85
85
  newX = current.x;
86
86
  }
87
- if (newY + initialWindowPos.y - 60 < 0) {
87
+ if (newY + initialWindowPos.y - 120 < 0) {
88
88
  newY = current.y;
89
89
  }
90
90
  return {
@@ -113,7 +113,7 @@ export var DraggableDiv = function DraggableDiv(_a) {
113
113
  if (newX + initialWindowPos.x - 10 < 0) {
114
114
  newX = current.x;
115
115
  }
116
- if (newY + initialWindowPos.y - 25 < 0) {
116
+ if (newY + initialWindowPos.y - 40 < 0) {
117
117
  newY = current.y;
118
118
  }
119
119
  return {
@@ -10,9 +10,9 @@
10
10
  }
11
11
 
12
12
  .font-family-mono {
13
- font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
13
+ font-family: 'JetBrains Mono', monospace;
14
14
  font-weight: 500;
15
- font-size: 14px;
15
+ font-size: 12px;
16
16
  }
17
17
 
18
18
  /* .luckysheet-formula-help-c .luckysheet-formula-help-content {
@@ -9,7 +9,7 @@ var __assign = this && this.__assign || function () {
9
9
  return __assign.apply(this, arguments);
10
10
  };
11
11
  import { locale } from "@fileverse-dev/fortune-core";
12
- import { Button, TextField, LucideIcon } from "@fileverse/ui";
12
+ import { Button, TextField, LucideIcon, Tooltip } from "@fileverse/ui";
13
13
  import React, { useContext, useEffect, useRef, useState } from "react";
14
14
  import WorkbookContext from "../../../context";
15
15
  import "./index.css";
@@ -54,14 +54,15 @@ var FormulaHint = function FormulaHint(props) {
54
54
  showDelayedHint = _g[0],
55
55
  setShowDelayedHint = _g[1];
56
56
  var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
57
- var _a, _b, _c;
57
+ var _a, _b, _c, _d;
58
58
  if (!((_a = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) === null || _a === void 0 ? void 0 : _a.toString()) || !((_b = firstSelection.height_move) === null || _b === void 0 ? void 0 : _b.toString()) || !hintRef.current) return;
59
59
  var hintHeight = 360;
60
- var inputBottom = firstSelection.top + firstSelection.height_move;
60
+ var inputBoxTop = parseInt(((_c = document.getElementById("luckysheet-input-box")) === null || _c === void 0 ? void 0 : _c.style.top) || "0", 10) - 85;
61
+ var inputBottom = inputBoxTop + firstSelection.height_move;
61
62
  var availableBelow = window.innerHeight - inputBottom;
62
63
  var hintAbove = hintHeight > availableBelow;
63
64
  var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
64
- var divOffset = ((_c = hintRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0;
65
+ var divOffset = ((_d = hintRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 0;
65
66
  setTop(hintAbove ? selectionHeight - (divOffset + 30) : selectionHeight + 4);
66
67
  };
67
68
  useEffect(function () {
@@ -74,46 +75,22 @@ var FormulaHint = function FormulaHint(props) {
74
75
  }, 40);
75
76
  }
76
77
  }, [top]);
77
- useEffect(function () {
78
- var el = document.getElementById("function-details");
79
- var handleWheel;
80
- if (el) {
81
- var scrollLockTimeout_1 = null;
82
- var cache_1 = {
83
- verticalScrollLock: false,
84
- horizontalScrollLock: false
85
- };
86
- handleWheel = function handleWheel(e) {
87
- e.preventDefault();
88
- var step = 40;
89
- var ratio = 1;
90
- if (e.deltaY !== 0 && !cache_1.verticalScrollLock) {
91
- cache_1.horizontalScrollLock = true;
92
- el.scrollTop += (e.deltaY > 0 ? 1 : -1) * step * ratio;
93
- } else if (e.deltaX !== 0 && !cache_1.horizontalScrollLock) {
94
- cache_1.verticalScrollLock = true;
95
- el.scrollLeft += (e.deltaX > 0 ? 1 : -1) * step * ratio;
96
- }
97
- clearTimeout(scrollLockTimeout_1);
98
- scrollLockTimeout_1 = setTimeout(function () {
99
- cache_1.verticalScrollLock = false;
100
- cache_1.horizontalScrollLock = false;
101
- }, 50);
102
- };
103
- el.addEventListener("wheel", handleWheel, {
104
- passive: false
105
- });
106
- }
107
- return function () {
108
- if (el && handleWheel) el.removeEventListener("wheel", handleWheel);
109
- };
110
- }, []);
111
78
  if (!fn) return null;
112
79
  return /*#__PURE__*/React.createElement(DraggableDiv, {
113
80
  initialTop: top,
114
81
  dragHasMoved: dragHasMoved,
115
82
  className: "bg-secondary text-secondary-foreground p-4 rounded-lg flex items-center justify-center ".concat(showDelayedHint ? "opacity-100" : "opacity-0")
116
- }, showFormulaHint && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
83
+ }, showFormulaHint && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Tooltip, {
84
+ text: "Hide formula suggestions (F10)",
85
+ placement: "top",
86
+ defaultOpen: true,
87
+ style: {
88
+ position: "absolute",
89
+ left: "210px",
90
+ top: "-40px",
91
+ width: "200px"
92
+ }
93
+ }, /*#__PURE__*/React.createElement("button", {
117
94
  type: "button",
118
95
  className: "flex items-center justify-center w-4 h-4 rounded-full",
119
96
  style: {
@@ -121,26 +98,28 @@ var FormulaHint = function FormulaHint(props) {
121
98
  zIndex: 2000,
122
99
  position: "absolute",
123
100
  left: "327px",
124
- top: "-8px"
101
+ top: "-8px",
102
+ padding: "2.4px",
103
+ color: "white"
125
104
  },
126
105
  onClick: handleShowFormulaHint,
127
106
  "aria-label": "Close formula hint"
128
107
  }, /*#__PURE__*/React.createElement("svg", {
129
108
  xmlns: "http://www.w3.org/2000/svg",
130
- className: " text-white",
131
- style: {
132
- width: "12px",
133
- height: "12px"
134
- },
135
- fill: "none",
109
+ width: "20",
110
+ height: "20",
136
111
  viewBox: "0 0 24 24",
112
+ fill: "none",
137
113
  stroke: "currentColor",
138
- strokeWidth: "3"
139
- }, /*#__PURE__*/React.createElement("path", {
114
+ strokeWidth: "2",
140
115
  strokeLinecap: "round",
141
116
  strokeLinejoin: "round",
142
- d: "M6 18L18 6M6 6l12 12"
143
- }))), /*#__PURE__*/React.createElement("div", __assign({}, props, {
117
+ className: "lucide lucide-x-icon lucide-x color-white"
118
+ }, /*#__PURE__*/React.createElement("path", {
119
+ d: "M18 6 6 18"
120
+ }), /*#__PURE__*/React.createElement("path", {
121
+ d: "m6 6 12 12"
122
+ })))), /*#__PURE__*/React.createElement("div", __assign({}, props, {
144
123
  ref: hintRef,
145
124
  id: "luckysheet-formula-help-c",
146
125
  className: "luckysheet-formula-help-c",
@@ -148,7 +127,7 @@ var FormulaHint = function FormulaHint(props) {
148
127
  top: "0px",
149
128
  left: "0px",
150
129
  borderWidth: "1px",
151
- borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "#F8F9FA",
130
+ borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "rgba(0, 0, 0, 0.2)",
152
131
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
153
132
  width: "340px",
154
133
  padding: "0px"
@@ -330,9 +309,10 @@ var FormulaHint = function FormulaHint(props) {
330
309
  }, /*#__PURE__*/React.createElement("div", {
331
310
  style: {
332
311
  lineHeight: "16px",
333
- fontSize: "14px"
312
+ fontSize: "12px",
313
+ fontFamily: "Helvetica Neue"
334
314
  },
335
- className: "font-family-mono mb-1 color-text-default jetbrains-mono"
315
+ className: "font-family-mono mb-1 color-text-secondary"
336
316
  }, formulaMore.helpExample), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", {
337
317
  style: {
338
318
  overflowWrap: "break-word"
@@ -362,10 +342,11 @@ var FormulaHint = function FormulaHint(props) {
362
342
  }, /*#__PURE__*/React.createElement("div", {
363
343
  style: {
364
344
  lineHeight: "16px",
365
- fontSize: "14px",
366
- padding: "0px"
345
+ fontSize: "12px",
346
+ padding: "0px",
347
+ fontFamily: "Helvetica Neue"
367
348
  },
368
- className: "font-family-mono mb-1 mt-2 color-text-default"
349
+ className: "font-family-mono mb-1 mt-2 color-text-secondary"
369
350
  }, "About"), /*#__PURE__*/React.createElement("span", {
370
351
  className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
371
352
  }, fn.d))), /*#__PURE__*/React.createElement("div", {
@@ -15,7 +15,7 @@
15
15
  font-size: 12px;
16
16
  background: #fff;
17
17
  width: 300px;
18
- max-height: 380px;
18
+ max-height: 325px;
19
19
  overflow-y: auto;
20
20
  border-radius: 10px;
21
21
 
@@ -19,7 +19,7 @@ var FormulaSearch = function FormulaSearch(props) {
19
19
  var _b = useContext(WorkbookContext),
20
20
  context = _b.context,
21
21
  isAuthorized = _b.settings.isAuthorized;
22
- var authedFunction = ["COINGECKO", "ETHERSCAN", "DEFILLAMA", "GNOSIS", "BASE", "EOA", "PNL", "SAFE", "BLOCKSCOUT", "LENS", "FARCASTER", "Ethereum", "SMARTCONTRACT", "DUNESIM"];
22
+ var authedFunction = ["Ethereum", "SMARTCONTRACT", "DUNESIM"];
23
23
  var filteredDefaultCandidates = context.defaultCandidates.filter(function (item) {
24
24
  return !authedFunction.includes(item.n);
25
25
  });
@@ -36,14 +36,15 @@ var FormulaSearch = function FormulaSearch(props) {
36
36
  top = _c[0],
37
37
  setTop = _c[1];
38
38
  var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
39
- var _a, _b, _c;
39
+ var _a, _b, _c, _d;
40
40
  if (!((_a = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) === null || _a === void 0 ? void 0 : _a.toString()) || !((_b = firstSelection.height_move) === null || _b === void 0 ? void 0 : _b.toString()) || !hintRef.current) return;
41
41
  var hintHeight = 360;
42
- var inputBottom = firstSelection.top + firstSelection.height_move;
42
+ var inputBoxTop = parseInt(((_c = document.getElementById("luckysheet-input-box")) === null || _c === void 0 ? void 0 : _c.style.top) || "0", 10) - 85;
43
+ var inputBottom = inputBoxTop + firstSelection.height_move;
43
44
  var availableBelow = window.innerHeight - inputBottom;
44
45
  var hintAbove = hintHeight > availableBelow;
45
46
  var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
46
- var divOffset = ((_c = hintRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0;
47
+ var divOffset = ((_d = hintRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 0;
47
48
  var topV = hintAbove ? selectionHeight - (divOffset + 80) : selectionHeight + 4;
48
49
  setTop(topV);
49
50
  };
@@ -52,7 +53,8 @@ var FormulaSearch = function FormulaSearch(props) {
52
53
  });
53
54
  if (_.isEmpty(context.functionCandidates) && _.isEmpty(context.defaultCandidates)) return null;
54
55
  return /*#__PURE__*/React.createElement("div", {
55
- className: "flex flex-col luckysheet-formula-search-c-p",
56
+ className: "flex flex-col luckysheet-formula-search-c-p custom-scroll",
57
+ id: "luckysheet-formula-search-c-p",
56
58
  style: {
57
59
  top: top
58
60
  }
@@ -11,6 +11,7 @@ var __assign = this && this.__assign || function () {
11
11
  import { cancelNormalSelected, getCellValue, getInlineStringHTML, getStyleByCell, isInlineStringCell, moveToEnd, getFlowdata, handleFormulaInput, moveHighlightCell, escapeScriptTag, valueShowEs, createRangeHightlight, isShowHidenCR, israngeseleciton, escapeHTMLTag, isAllowEdit, getrangeseleciton, indexToColumnChar } from "@fileverse-dev/fortune-core";
12
12
  import React, { useContext, useEffect, useMemo, useRef, useCallback, useLayoutEffect, useState } from "react";
13
13
  import _ from "lodash";
14
+ import { Tooltip } from "@fileverse/ui";
14
15
  import WorkbookContext from "../../context";
15
16
  import ContentEditable from "./ContentEditable";
16
17
  import FormulaSearch from "./FormulaSearch";
@@ -445,6 +446,18 @@ var InputBox = function InputBox() {
445
446
  setFirstSelectionActiveCell((_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]);
446
447
  }
447
448
  }, [isInputBoxActive]);
449
+ useEffect(function () {
450
+ var handleKeyDown = function handleKeyDown(event) {
451
+ if (event.key === "F10") {
452
+ event.preventDefault();
453
+ handleShowFormulaHint();
454
+ }
455
+ };
456
+ window.addEventListener("keydown", handleKeyDown);
457
+ return function () {
458
+ window.removeEventListener("keydown", handleKeyDown);
459
+ };
460
+ }, [showFormulaHint]);
448
461
  var wraperGetCell = function wraperGetCell() {
449
462
  var cell = getCellAddress();
450
463
  placeRef.current = cell;
@@ -456,6 +469,7 @@ var InputBox = function InputBox() {
456
469
  var fn = context.formulaCache.functionlistMap[context.functionHint];
457
470
  return /*#__PURE__*/React.createElement("div", {
458
471
  className: "luckysheet-input-box",
472
+ id: "luckysheet-input-box",
459
473
  style: getInputBoxPosition(),
460
474
  onMouseDown: function onMouseDown(e) {
461
475
  return e.stopPropagation();
@@ -507,20 +521,18 @@ var InputBox = function InputBox() {
507
521
  })), showFormulaHint && fn && ((_h = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _h === void 0 ? void 0 : _h.innerText.includes("(")) && (/*#__PURE__*/React.createElement(FormulaHint, {
508
522
  handleShowFormulaHint: handleShowFormulaHint,
509
523
  showFormulaHint: showFormulaHint
510
- })), !showFormulaHint && fn && (/*#__PURE__*/React.createElement("div", {
511
- className: "luckysheet-hin absolute",
524
+ })), !showFormulaHint && fn && (/*#__PURE__*/React.createElement(Tooltip, {
525
+ text: "Turn on formula suggestions (F10)",
526
+ placement: "top",
527
+ defaultOpen: true,
512
528
  style: {
513
- top: "1px",
514
- left: "-18px",
515
- display: "block",
516
- width: "17px",
517
- height: "17px",
518
- zIndex: 2000,
519
- backgroundColor: "#efc703",
520
- borderBottomLeftRadius: "4px",
521
- borderTopLeftRadius: "4px",
522
- cursor: "pointer"
523
- },
529
+ position: "absolute",
530
+ top: "-50px",
531
+ left: "-130px",
532
+ width: "210px"
533
+ }
534
+ }, /*#__PURE__*/React.createElement("div", {
535
+ className: "luckysheet-hin absolute show-more-btn",
524
536
  onClick: function onClick() {
525
537
  handleShowFormulaHint();
526
538
  }
@@ -533,6 +545,6 @@ var InputBox = function InputBox() {
533
545
  margin: "auto",
534
546
  marginTop: "1px"
535
547
  }
536
- }))))));
548
+ })))))));
537
549
  };
538
550
  export default InputBox;
@@ -576,9 +576,7 @@
576
576
  top: 0;
577
577
  }
578
578
 
579
- .luckysheet-postil-show-active
580
- .luckysheet-postil-dialog-move
581
- .luckysheet-postil-dialog-move-item {
579
+ .luckysheet-postil-show-active .luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item {
582
580
  border-color: #0188fb;
583
581
  }
584
582
 
@@ -966,3 +964,50 @@
966
964
  pointer-events: none;
967
965
  user-select: none;
968
966
  }
967
+
968
+ .show-more-btn {
969
+ top: 1px;
970
+ left: -18px;
971
+ display: block;
972
+ width: 17px;
973
+ height: 17px;
974
+ z-index: 2000;
975
+ background-color: #efc703;
976
+ border-bottom-left-radius: 4px;
977
+ border-top-left-radius: 4px;
978
+ cursor: pointer;
979
+ }
980
+
981
+ /** scroll bar**/
982
+
983
+ * {
984
+ scrollbar-width: auto;
985
+ /* Firefox: normal thickness */
986
+ scrollbar-color: #888 transparent;
987
+ /* thumb | track */
988
+ }
989
+
990
+ /* Chrome, Edge, Safari */
991
+ *::-webkit-scrollbar {
992
+ width: 14px;
993
+ /* thicker scrollbar (like macOS) */
994
+ height: 14px;
995
+ }
996
+
997
+ *::-webkit-scrollbar-track {
998
+ background: transparent;
999
+ /* no track */
1000
+ }
1001
+
1002
+ *::-webkit-scrollbar-thumb {
1003
+ background: #888;
1004
+ /* scrollbar thumb color */
1005
+ border-radius: 7px;
1006
+ /* rounded edges like mac */
1007
+ }
1008
+
1009
+ *::-webkit-scrollbar-thumb:hover {
1010
+ background: #555;
1011
+ /* darker on hover */
1012
+ /* scrollbar */
1013
+ }
@@ -43,12 +43,11 @@ var useSmoothScroll = exports.useSmoothScroll = function useSmoothScroll(scrollC
43
43
  }
44
44
  function handleWheelEvent(event) {
45
45
  var _a, _b;
46
- event.preventDefault();
47
46
  setContext(function (ctx) {
48
47
  (0, _fortuneCore.removeEditingComment)(ctx, refs.globalCache);
49
48
  });
50
49
  var functionDetailsElement = document.getElementById("function-details");
51
- var formulaSearchElement = document.getElementById("luckysheet-formula-search-c");
50
+ var formulaSearchElement = document.getElementById("luckysheet-formula-search-c-p");
52
51
  var isPointerOverFunctionDetails = functionDetailsElement === null || functionDetailsElement === void 0 ? void 0 : functionDetailsElement.matches(":hover");
53
52
  var isPointerOverFormulaSearch = formulaSearchElement === null || formulaSearchElement === void 0 ? void 0 : formulaSearchElement.matches(":hover");
54
53
  var isPointerInSearchDialog = !!((_b = (_a = refs === null || refs === void 0 ? void 0 : refs.globalCache) === null || _a === void 0 ? void 0 : _a.searchDialog) === null || _b === void 0 ? void 0 : _b.mouseEnter);
@@ -56,6 +55,7 @@ var useSmoothScroll = exports.useSmoothScroll = function useSmoothScroll(scrollC
56
55
  if (functionDetailsElement && isPointerOverFunctionDetails || formulaSearchElement && isPointerOverFormulaSearch || isPointerInSearchDialog || hasFilterContextMenuOpen) {
57
56
  return;
58
57
  }
58
+ event.preventDefault();
59
59
  var scaleFactor = getPixelScale();
60
60
  scrollHandler(event.deltaX * scaleFactor, event.deltaY * scaleFactor);
61
61
  }
@@ -91,7 +91,7 @@ var DraggableDiv = exports.DraggableDiv = function DraggableDiv(_a) {
91
91
  if (newX + initialWindowPos.x - 35 < 0) {
92
92
  newX = current.x;
93
93
  }
94
- if (newY + initialWindowPos.y - 60 < 0) {
94
+ if (newY + initialWindowPos.y - 120 < 0) {
95
95
  newY = current.y;
96
96
  }
97
97
  return {
@@ -120,7 +120,7 @@ var DraggableDiv = exports.DraggableDiv = function DraggableDiv(_a) {
120
120
  if (newX + initialWindowPos.x - 10 < 0) {
121
121
  newX = current.x;
122
122
  }
123
- if (newY + initialWindowPos.y - 25 < 0) {
123
+ if (newY + initialWindowPos.y - 40 < 0) {
124
124
  newY = current.y;
125
125
  }
126
126
  return {
@@ -10,9 +10,9 @@
10
10
  }
11
11
 
12
12
  .font-family-mono {
13
- font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
13
+ font-family: 'JetBrains Mono', monospace;
14
14
  font-weight: 500;
15
- font-size: 14px;
15
+ font-size: 12px;
16
16
  }
17
17
 
18
18
  /* .luckysheet-formula-help-c .luckysheet-formula-help-content {
@@ -63,14 +63,15 @@ var FormulaHint = function FormulaHint(props) {
63
63
  showDelayedHint = _g[0],
64
64
  setShowDelayedHint = _g[1];
65
65
  var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
66
- var _a, _b, _c;
66
+ var _a, _b, _c, _d;
67
67
  if (!((_a = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) === null || _a === void 0 ? void 0 : _a.toString()) || !((_b = firstSelection.height_move) === null || _b === void 0 ? void 0 : _b.toString()) || !hintRef.current) return;
68
68
  var hintHeight = 360;
69
- var inputBottom = firstSelection.top + firstSelection.height_move;
69
+ var inputBoxTop = parseInt(((_c = document.getElementById("luckysheet-input-box")) === null || _c === void 0 ? void 0 : _c.style.top) || "0", 10) - 85;
70
+ var inputBottom = inputBoxTop + firstSelection.height_move;
70
71
  var availableBelow = window.innerHeight - inputBottom;
71
72
  var hintAbove = hintHeight > availableBelow;
72
73
  var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
73
- var divOffset = ((_c = hintRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0;
74
+ var divOffset = ((_d = hintRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 0;
74
75
  setTop(hintAbove ? selectionHeight - (divOffset + 30) : selectionHeight + 4);
75
76
  };
76
77
  (0, _react.useEffect)(function () {
@@ -83,46 +84,22 @@ var FormulaHint = function FormulaHint(props) {
83
84
  }, 40);
84
85
  }
85
86
  }, [top]);
86
- (0, _react.useEffect)(function () {
87
- var el = document.getElementById("function-details");
88
- var handleWheel;
89
- if (el) {
90
- var scrollLockTimeout_1 = null;
91
- var cache_1 = {
92
- verticalScrollLock: false,
93
- horizontalScrollLock: false
94
- };
95
- handleWheel = function handleWheel(e) {
96
- e.preventDefault();
97
- var step = 40;
98
- var ratio = 1;
99
- if (e.deltaY !== 0 && !cache_1.verticalScrollLock) {
100
- cache_1.horizontalScrollLock = true;
101
- el.scrollTop += (e.deltaY > 0 ? 1 : -1) * step * ratio;
102
- } else if (e.deltaX !== 0 && !cache_1.horizontalScrollLock) {
103
- cache_1.verticalScrollLock = true;
104
- el.scrollLeft += (e.deltaX > 0 ? 1 : -1) * step * ratio;
105
- }
106
- clearTimeout(scrollLockTimeout_1);
107
- scrollLockTimeout_1 = setTimeout(function () {
108
- cache_1.verticalScrollLock = false;
109
- cache_1.horizontalScrollLock = false;
110
- }, 50);
111
- };
112
- el.addEventListener("wheel", handleWheel, {
113
- passive: false
114
- });
115
- }
116
- return function () {
117
- if (el && handleWheel) el.removeEventListener("wheel", handleWheel);
118
- };
119
- }, []);
120
87
  if (!fn) return null;
121
88
  return /*#__PURE__*/_react.default.createElement(_dragableDiv.DraggableDiv, {
122
89
  initialTop: top,
123
90
  dragHasMoved: dragHasMoved,
124
91
  className: "bg-secondary text-secondary-foreground p-4 rounded-lg flex items-center justify-center ".concat(showDelayedHint ? "opacity-100" : "opacity-0")
125
- }, showFormulaHint && (/*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("button", {
92
+ }, showFormulaHint && (/*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
93
+ text: "Hide formula suggestions (F10)",
94
+ placement: "top",
95
+ defaultOpen: true,
96
+ style: {
97
+ position: "absolute",
98
+ left: "210px",
99
+ top: "-40px",
100
+ width: "200px"
101
+ }
102
+ }, /*#__PURE__*/_react.default.createElement("button", {
126
103
  type: "button",
127
104
  className: "flex items-center justify-center w-4 h-4 rounded-full",
128
105
  style: {
@@ -130,26 +107,28 @@ var FormulaHint = function FormulaHint(props) {
130
107
  zIndex: 2000,
131
108
  position: "absolute",
132
109
  left: "327px",
133
- top: "-8px"
110
+ top: "-8px",
111
+ padding: "2.4px",
112
+ color: "white"
134
113
  },
135
114
  onClick: handleShowFormulaHint,
136
115
  "aria-label": "Close formula hint"
137
116
  }, /*#__PURE__*/_react.default.createElement("svg", {
138
117
  xmlns: "http://www.w3.org/2000/svg",
139
- className: " text-white",
140
- style: {
141
- width: "12px",
142
- height: "12px"
143
- },
144
- fill: "none",
118
+ width: "20",
119
+ height: "20",
145
120
  viewBox: "0 0 24 24",
121
+ fill: "none",
146
122
  stroke: "currentColor",
147
- strokeWidth: "3"
148
- }, /*#__PURE__*/_react.default.createElement("path", {
123
+ strokeWidth: "2",
149
124
  strokeLinecap: "round",
150
125
  strokeLinejoin: "round",
151
- d: "M6 18L18 6M6 6l12 12"
152
- }))), /*#__PURE__*/_react.default.createElement("div", __assign({}, props, {
126
+ className: "lucide lucide-x-icon lucide-x color-white"
127
+ }, /*#__PURE__*/_react.default.createElement("path", {
128
+ d: "M18 6 6 18"
129
+ }), /*#__PURE__*/_react.default.createElement("path", {
130
+ d: "m6 6 12 12"
131
+ })))), /*#__PURE__*/_react.default.createElement("div", __assign({}, props, {
153
132
  ref: hintRef,
154
133
  id: "luckysheet-formula-help-c",
155
134
  className: "luckysheet-formula-help-c",
@@ -157,7 +136,7 @@ var FormulaHint = function FormulaHint(props) {
157
136
  top: "0px",
158
137
  left: "0px",
159
138
  borderWidth: "1px",
160
- borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "#F8F9FA",
139
+ borderColor: (fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR) ? fn === null || fn === void 0 ? void 0 : fn.BRAND_SECONDARY_COLOR : "rgba(0, 0, 0, 0.2)",
161
140
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
162
141
  width: "340px",
163
142
  padding: "0px"
@@ -339,9 +318,10 @@ var FormulaHint = function FormulaHint(props) {
339
318
  }, /*#__PURE__*/_react.default.createElement("div", {
340
319
  style: {
341
320
  lineHeight: "16px",
342
- fontSize: "14px"
321
+ fontSize: "12px",
322
+ fontFamily: "Helvetica Neue"
343
323
  },
344
- className: "font-family-mono mb-1 color-text-default jetbrains-mono"
324
+ className: "font-family-mono mb-1 color-text-secondary"
345
325
  }, formulaMore.helpExample), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("code", {
346
326
  style: {
347
327
  overflowWrap: "break-word"
@@ -371,10 +351,11 @@ var FormulaHint = function FormulaHint(props) {
371
351
  }, /*#__PURE__*/_react.default.createElement("div", {
372
352
  style: {
373
353
  lineHeight: "16px",
374
- fontSize: "14px",
375
- padding: "0px"
354
+ fontSize: "12px",
355
+ padding: "0px",
356
+ fontFamily: "Helvetica Neue"
376
357
  },
377
- className: "font-family-mono mb-1 mt-2 color-text-default"
358
+ className: "font-family-mono mb-1 mt-2 color-text-secondary"
378
359
  }, "About"), /*#__PURE__*/_react.default.createElement("span", {
379
360
  className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
380
361
  }, fn.d))), /*#__PURE__*/_react.default.createElement("div", {
@@ -15,7 +15,7 @@
15
15
  font-size: 12px;
16
16
  background: #fff;
17
17
  width: 300px;
18
- max-height: 380px;
18
+ max-height: 325px;
19
19
  overflow-y: auto;
20
20
  border-radius: 10px;
21
21
 
@@ -28,7 +28,7 @@ var FormulaSearch = function FormulaSearch(props) {
28
28
  var _b = (0, _react.useContext)(_context.default),
29
29
  context = _b.context,
30
30
  isAuthorized = _b.settings.isAuthorized;
31
- var authedFunction = ["COINGECKO", "ETHERSCAN", "DEFILLAMA", "GNOSIS", "BASE", "EOA", "PNL", "SAFE", "BLOCKSCOUT", "LENS", "FARCASTER", "Ethereum", "SMARTCONTRACT", "DUNESIM"];
31
+ var authedFunction = ["Ethereum", "SMARTCONTRACT", "DUNESIM"];
32
32
  var filteredDefaultCandidates = context.defaultCandidates.filter(function (item) {
33
33
  return !authedFunction.includes(item.n);
34
34
  });
@@ -45,14 +45,15 @@ var FormulaSearch = function FormulaSearch(props) {
45
45
  top = _c[0],
46
46
  setTop = _c[1];
47
47
  var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
48
- var _a, _b, _c;
48
+ var _a, _b, _c, _d;
49
49
  if (!((_a = firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.top) === null || _a === void 0 ? void 0 : _a.toString()) || !((_b = firstSelection.height_move) === null || _b === void 0 ? void 0 : _b.toString()) || !hintRef.current) return;
50
50
  var hintHeight = 360;
51
- var inputBottom = firstSelection.top + firstSelection.height_move;
51
+ var inputBoxTop = parseInt(((_c = document.getElementById("luckysheet-input-box")) === null || _c === void 0 ? void 0 : _c.style.top) || "0", 10) - 85;
52
+ var inputBottom = inputBoxTop + firstSelection.height_move;
52
53
  var availableBelow = window.innerHeight - inputBottom;
53
54
  var hintAbove = hintHeight > availableBelow;
54
55
  var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
55
- var divOffset = ((_c = hintRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0;
56
+ var divOffset = ((_d = hintRef.current) === null || _d === void 0 ? void 0 : _d.offsetHeight) || 0;
56
57
  var topV = hintAbove ? selectionHeight - (divOffset + 80) : selectionHeight + 4;
57
58
  setTop(topV);
58
59
  };
@@ -61,7 +62,8 @@ var FormulaSearch = function FormulaSearch(props) {
61
62
  });
62
63
  if (_lodash.default.isEmpty(context.functionCandidates) && _lodash.default.isEmpty(context.defaultCandidates)) return null;
63
64
  return /*#__PURE__*/_react.default.createElement("div", {
64
- className: "flex flex-col luckysheet-formula-search-c-p",
65
+ className: "flex flex-col luckysheet-formula-search-c-p custom-scroll",
66
+ id: "luckysheet-formula-search-c-p",
65
67
  style: {
66
68
  top: top
67
69
  }
@@ -8,6 +8,7 @@ exports.default = void 0;
8
8
  var _fortuneCore = require("@fileverse-dev/fortune-core");
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _lodash = _interopRequireDefault(require("lodash"));
11
+ var _ui = require("@fileverse/ui");
11
12
  var _context = _interopRequireDefault(require("../../context"));
12
13
  var _ContentEditable = _interopRequireDefault(require("./ContentEditable"));
13
14
  var _FormulaSearch = _interopRequireDefault(require("./FormulaSearch"));
@@ -454,6 +455,18 @@ var InputBox = function InputBox() {
454
455
  setFirstSelectionActiveCell((_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0]);
455
456
  }
456
457
  }, [isInputBoxActive]);
458
+ (0, _react.useEffect)(function () {
459
+ var handleKeyDown = function handleKeyDown(event) {
460
+ if (event.key === "F10") {
461
+ event.preventDefault();
462
+ handleShowFormulaHint();
463
+ }
464
+ };
465
+ window.addEventListener("keydown", handleKeyDown);
466
+ return function () {
467
+ window.removeEventListener("keydown", handleKeyDown);
468
+ };
469
+ }, [showFormulaHint]);
457
470
  var wraperGetCell = function wraperGetCell() {
458
471
  var cell = getCellAddress();
459
472
  placeRef.current = cell;
@@ -465,6 +478,7 @@ var InputBox = function InputBox() {
465
478
  var fn = context.formulaCache.functionlistMap[context.functionHint];
466
479
  return /*#__PURE__*/_react.default.createElement("div", {
467
480
  className: "luckysheet-input-box",
481
+ id: "luckysheet-input-box",
468
482
  style: getInputBoxPosition(),
469
483
  onMouseDown: function onMouseDown(e) {
470
484
  return e.stopPropagation();
@@ -516,20 +530,18 @@ var InputBox = function InputBox() {
516
530
  })), showFormulaHint && fn && ((_h = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _h === void 0 ? void 0 : _h.innerText.includes("(")) && (/*#__PURE__*/_react.default.createElement(_FormulaHint.default, {
517
531
  handleShowFormulaHint: handleShowFormulaHint,
518
532
  showFormulaHint: showFormulaHint
519
- })), !showFormulaHint && fn && (/*#__PURE__*/_react.default.createElement("div", {
520
- className: "luckysheet-hin absolute",
533
+ })), !showFormulaHint && fn && (/*#__PURE__*/_react.default.createElement(_ui.Tooltip, {
534
+ text: "Turn on formula suggestions (F10)",
535
+ placement: "top",
536
+ defaultOpen: true,
521
537
  style: {
522
- top: "1px",
523
- left: "-18px",
524
- display: "block",
525
- width: "17px",
526
- height: "17px",
527
- zIndex: 2000,
528
- backgroundColor: "#efc703",
529
- borderBottomLeftRadius: "4px",
530
- borderTopLeftRadius: "4px",
531
- cursor: "pointer"
532
- },
538
+ position: "absolute",
539
+ top: "-50px",
540
+ left: "-130px",
541
+ width: "210px"
542
+ }
543
+ }, /*#__PURE__*/_react.default.createElement("div", {
544
+ className: "luckysheet-hin absolute show-more-btn",
533
545
  onClick: function onClick() {
534
546
  handleShowFormulaHint();
535
547
  }
@@ -542,6 +554,6 @@ var InputBox = function InputBox() {
542
554
  margin: "auto",
543
555
  marginTop: "1px"
544
556
  }
545
- }))))));
557
+ })))))));
546
558
  };
547
559
  var _default = exports.default = InputBox;
@@ -576,9 +576,7 @@
576
576
  top: 0;
577
577
  }
578
578
 
579
- .luckysheet-postil-show-active
580
- .luckysheet-postil-dialog-move
581
- .luckysheet-postil-dialog-move-item {
579
+ .luckysheet-postil-show-active .luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item {
582
580
  border-color: #0188fb;
583
581
  }
584
582
 
@@ -966,3 +964,50 @@
966
964
  pointer-events: none;
967
965
  user-select: none;
968
966
  }
967
+
968
+ .show-more-btn {
969
+ top: 1px;
970
+ left: -18px;
971
+ display: block;
972
+ width: 17px;
973
+ height: 17px;
974
+ z-index: 2000;
975
+ background-color: #efc703;
976
+ border-bottom-left-radius: 4px;
977
+ border-top-left-radius: 4px;
978
+ cursor: pointer;
979
+ }
980
+
981
+ /** scroll bar**/
982
+
983
+ * {
984
+ scrollbar-width: auto;
985
+ /* Firefox: normal thickness */
986
+ scrollbar-color: #888 transparent;
987
+ /* thumb | track */
988
+ }
989
+
990
+ /* Chrome, Edge, Safari */
991
+ *::-webkit-scrollbar {
992
+ width: 14px;
993
+ /* thicker scrollbar (like macOS) */
994
+ height: 14px;
995
+ }
996
+
997
+ *::-webkit-scrollbar-track {
998
+ background: transparent;
999
+ /* no track */
1000
+ }
1001
+
1002
+ *::-webkit-scrollbar-thumb {
1003
+ background: #888;
1004
+ /* scrollbar thumb color */
1005
+ border-radius: 7px;
1006
+ /* rounded edges like mac */
1007
+ }
1008
+
1009
+ *::-webkit-scrollbar-thumb:hover {
1010
+ background: #555;
1011
+ /* darker on hover */
1012
+ /* scrollbar */
1013
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fileverse-dev/fortune-react",
3
- "version": "1.1.66",
3
+ "version": "1.1.67",
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.1.66",
19
+ "@fileverse-dev/fortune-core": "1.1.67",
20
20
  "@fileverse/ui": "^4.1.7-patch-21",
21
21
  "@tippyjs/react": "^4.2.6",
22
22
  "@types/regenerator-runtime": "^0.13.6",