@fileverse-dev/fortune-react 1.1.55 → 1.1.57
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.
- package/es/components/SheetOverlay/FormulaHint/dragable-div.d.ts +9 -0
- package/es/components/SheetOverlay/FormulaHint/dragable-div.js +125 -0
- package/es/components/SheetOverlay/FormulaHint/index.css +8 -4
- package/es/components/SheetOverlay/FormulaHint/index.d.ts +1 -1
- package/es/components/SheetOverlay/FormulaHint/index.js +77 -22
- package/es/components/SheetOverlay/FormulaSearch/index.css +13 -3
- package/es/components/SheetOverlay/FormulaSearch/index.js +18 -13
- package/es/components/SheetOverlay/Icon.d.ts +18 -0
- package/es/components/SheetOverlay/Icon.js +383 -0
- package/es/components/SheetOverlay/InputBox.js +83 -25
- package/es/components/SheetOverlay/LucideIcon.d.ts +30 -0
- package/es/components/SheetOverlay/LucideIcon.js +45 -0
- package/es/components/SheetOverlay/index.css +15 -0
- package/lib/components/SheetOverlay/FormulaHint/dragable-div.d.ts +9 -0
- package/lib/components/SheetOverlay/FormulaHint/dragable-div.js +132 -0
- package/lib/components/SheetOverlay/FormulaHint/index.css +8 -4
- package/lib/components/SheetOverlay/FormulaHint/index.d.ts +1 -1
- package/lib/components/SheetOverlay/FormulaHint/index.js +77 -22
- package/lib/components/SheetOverlay/FormulaSearch/index.css +13 -3
- package/lib/components/SheetOverlay/FormulaSearch/index.js +18 -13
- package/lib/components/SheetOverlay/Icon.d.ts +18 -0
- package/lib/components/SheetOverlay/Icon.js +390 -0
- package/lib/components/SheetOverlay/InputBox.js +83 -25
- package/lib/components/SheetOverlay/LucideIcon.d.ts +30 -0
- package/lib/components/SheetOverlay/LucideIcon.js +54 -0
- package/lib/components/SheetOverlay/index.css +15 -0
- package/package.json +2 -2
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
interface DraggableDivProps {
|
|
3
|
+
children?: React.ReactNode;
|
|
4
|
+
className?: string;
|
|
5
|
+
initialTop?: any;
|
|
6
|
+
dragHasMoved?: any;
|
|
7
|
+
}
|
|
8
|
+
export declare const DraggableDiv: ({ children, className, initialTop, dragHasMoved, }: DraggableDivProps) => React.JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
import React, { useEffect, useState, useRef } from "react";
|
|
4
|
+
import { cn } from "@fileverse/ui";
|
|
5
|
+
export var DraggableDiv = function DraggableDiv(_a) {
|
|
6
|
+
var children = _a.children,
|
|
7
|
+
className = _a.className,
|
|
8
|
+
initialTop = _a.initialTop,
|
|
9
|
+
dragHasMoved = _a.dragHasMoved;
|
|
10
|
+
var initialX = 0;
|
|
11
|
+
var initialY = initialTop;
|
|
12
|
+
var _b = useState({
|
|
13
|
+
x: initialX,
|
|
14
|
+
y: initialY
|
|
15
|
+
}),
|
|
16
|
+
position = _b[0],
|
|
17
|
+
setPosition = _b[1];
|
|
18
|
+
var _c = useState(false),
|
|
19
|
+
isDragging = _c[0],
|
|
20
|
+
setIsDragging = _c[1];
|
|
21
|
+
var _d = useState({
|
|
22
|
+
x: 0,
|
|
23
|
+
y: 0
|
|
24
|
+
}),
|
|
25
|
+
dragOffset = _d[0],
|
|
26
|
+
setDragOffset = _d[1];
|
|
27
|
+
var divRef = useRef(null);
|
|
28
|
+
useEffect(function () {
|
|
29
|
+
setPosition({
|
|
30
|
+
x: position.x,
|
|
31
|
+
y: initialTop
|
|
32
|
+
});
|
|
33
|
+
}, [initialTop]);
|
|
34
|
+
var handleMouseDown = function handleMouseDown(e) {
|
|
35
|
+
setIsDragging(true);
|
|
36
|
+
var element = document.getElementById("luckysheet-formula-help-c");
|
|
37
|
+
if (element) {
|
|
38
|
+
element.style.userSelect = "none";
|
|
39
|
+
}
|
|
40
|
+
setDragOffset({
|
|
41
|
+
x: e.clientX - position.x,
|
|
42
|
+
y: e.clientY - position.y
|
|
43
|
+
});
|
|
44
|
+
};
|
|
45
|
+
var handleTouchStart = function handleTouchStart(e) {
|
|
46
|
+
setIsDragging(true);
|
|
47
|
+
var element = document.getElementById("luckysheet-formula-help-c");
|
|
48
|
+
if (element) {
|
|
49
|
+
element.style.userSelect = "none";
|
|
50
|
+
}
|
|
51
|
+
var touch = e.touches[0];
|
|
52
|
+
setDragOffset({
|
|
53
|
+
x: touch.clientX - position.x,
|
|
54
|
+
y: touch.clientY - position.y
|
|
55
|
+
});
|
|
56
|
+
};
|
|
57
|
+
var handleMouseMove = function handleMouseMove(e) {
|
|
58
|
+
if (!isDragging) return;
|
|
59
|
+
e.preventDefault();
|
|
60
|
+
dragHasMoved.current = true;
|
|
61
|
+
setPosition(function () {
|
|
62
|
+
var newX = e.clientX - dragOffset.x;
|
|
63
|
+
var newY = e.clientY - dragOffset.y;
|
|
64
|
+
return {
|
|
65
|
+
x: newX * 1.3,
|
|
66
|
+
y: newY * 1.3
|
|
67
|
+
};
|
|
68
|
+
});
|
|
69
|
+
};
|
|
70
|
+
var handleTouchMove = function handleTouchMove(e) {
|
|
71
|
+
if (!isDragging) return;
|
|
72
|
+
e.preventDefault();
|
|
73
|
+
dragHasMoved.current = true;
|
|
74
|
+
var touch = e.touches[0];
|
|
75
|
+
setPosition(function () {
|
|
76
|
+
var newX = touch.clientX - dragOffset.x;
|
|
77
|
+
var newY = touch.clientY - dragOffset.y;
|
|
78
|
+
return {
|
|
79
|
+
x: newX * 1.3,
|
|
80
|
+
y: newY * 1.3
|
|
81
|
+
};
|
|
82
|
+
});
|
|
83
|
+
};
|
|
84
|
+
var handleMouseUp = function handleMouseUp() {
|
|
85
|
+
setIsDragging(false);
|
|
86
|
+
var element = document.getElementById("luckysheet-formula-help-c");
|
|
87
|
+
if (element) {
|
|
88
|
+
element.style.userSelect = "auto";
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var handleTouchEnd = function handleTouchEnd() {
|
|
92
|
+
setIsDragging(false);
|
|
93
|
+
var element = document.getElementById("luckysheet-formula-help-c");
|
|
94
|
+
if (element) {
|
|
95
|
+
element.style.userSelect = "auto";
|
|
96
|
+
}
|
|
97
|
+
};
|
|
98
|
+
React.useEffect(function () {
|
|
99
|
+
if (isDragging) {
|
|
100
|
+
document.addEventListener("mousemove", handleMouseMove);
|
|
101
|
+
document.addEventListener("mouseup", handleMouseUp);
|
|
102
|
+
document.addEventListener("touchmove", handleTouchMove);
|
|
103
|
+
document.addEventListener("touchend", handleTouchEnd);
|
|
104
|
+
}
|
|
105
|
+
return function () {
|
|
106
|
+
document.removeEventListener("mousemove", handleMouseMove);
|
|
107
|
+
document.removeEventListener("mouseup", handleMouseUp);
|
|
108
|
+
document.removeEventListener("touchmove", handleTouchMove);
|
|
109
|
+
document.removeEventListener("touchend", handleTouchEnd);
|
|
110
|
+
};
|
|
111
|
+
}, [isDragging, handleMouseMove, handleMouseUp, handleTouchMove, handleTouchEnd]);
|
|
112
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
113
|
+
ref: divRef,
|
|
114
|
+
className: cn("absolute select-none touch-none", isDragging ? "cursor-grabbing shadow-2xl z-50" : "cursor-grab shadow-lg", className),
|
|
115
|
+
style: {
|
|
116
|
+
left: "".concat(position.x, "px"),
|
|
117
|
+
top: "".concat(position.y, "px"),
|
|
118
|
+
height: "0px"
|
|
119
|
+
},
|
|
120
|
+
onMouseDown: handleMouseDown,
|
|
121
|
+
onMouseUp: handleMouseUp,
|
|
122
|
+
onTouchStart: handleTouchStart,
|
|
123
|
+
onTouchEnd: handleTouchEnd
|
|
124
|
+
}, children);
|
|
125
|
+
};
|
|
@@ -9,6 +9,12 @@
|
|
|
9
9
|
width: 300px;
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
+
.font-family-mono {
|
|
13
|
+
font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
|
14
|
+
font-weight: 500;
|
|
15
|
+
font-size: 14px;
|
|
16
|
+
}
|
|
17
|
+
|
|
12
18
|
/* .luckysheet-formula-help-c .luckysheet-formula-help-content {
|
|
13
19
|
max-height: 300px;
|
|
14
20
|
overflow-y: scroll;
|
|
@@ -29,25 +35,23 @@
|
|
|
29
35
|
|
|
30
36
|
.luckysheet-formula-help-title,
|
|
31
37
|
.luckysheet-formula-search-item-active {
|
|
32
|
-
padding: 10px !important;
|
|
38
|
+
padding: 4px 10px !important;
|
|
33
39
|
font-size: small;
|
|
34
40
|
/* background: #f8f9fa !important; */
|
|
35
41
|
font-weight: 600;
|
|
36
42
|
border-bottom: 0px !important;
|
|
37
43
|
border-top: 0px !important;
|
|
44
|
+
border-radius: 4px;
|
|
38
45
|
}
|
|
39
46
|
|
|
40
47
|
.luckysheet-formula-help-c,
|
|
41
48
|
.luckysheet-formula-search-c {
|
|
42
49
|
padding: 6px;
|
|
43
50
|
user-select: text;
|
|
44
|
-
border-radius: 10px;
|
|
45
51
|
top: 25px;
|
|
46
52
|
background: #ffff;
|
|
47
53
|
min-width: 300px;
|
|
48
54
|
/* max-width: 450px; */
|
|
49
|
-
border: 1px solid lavender;
|
|
50
|
-
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
|
51
55
|
}
|
|
52
56
|
|
|
53
57
|
#luckysheet-formula-help-c {
|
|
@@ -13,8 +13,12 @@ import { Button, TextField, LucideIcon } from "@fileverse/ui";
|
|
|
13
13
|
import React, { useContext, useEffect, useRef, useState } from "react";
|
|
14
14
|
import WorkbookContext from "../../../context";
|
|
15
15
|
import "./index.css";
|
|
16
|
+
import { DraggableDiv } from "./dragable-div";
|
|
16
17
|
var FormulaHint = function FormulaHint(props) {
|
|
17
18
|
var _a;
|
|
19
|
+
var showFormulaHint = props.showFormulaHint,
|
|
20
|
+
handleShowFormulaHint = props.handleShowFormulaHint;
|
|
21
|
+
var dragHasMoved = useRef(false);
|
|
18
22
|
var context = useContext(WorkbookContext).context;
|
|
19
23
|
var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
|
|
20
24
|
var formulaMore = locale(context).formulaMore;
|
|
@@ -28,7 +32,8 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
28
32
|
var _d = useState(!!localStorage.getItem(fn === null || fn === void 0 ? void 0 : fn.API_KEY)),
|
|
29
33
|
isKeyAdded = _d[0],
|
|
30
34
|
setApiKeyAdded = _d[1];
|
|
31
|
-
var
|
|
35
|
+
var formulaExpand = localStorage.getItem("formula-expand") === "true";
|
|
36
|
+
var _e = useState(formulaExpand),
|
|
32
37
|
showFunctionBody = _e[0],
|
|
33
38
|
setShouldShowFunctionBody = _e[1];
|
|
34
39
|
useEffect(function () {
|
|
@@ -45,6 +50,9 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
45
50
|
var _f = useState(0),
|
|
46
51
|
top = _f[0],
|
|
47
52
|
setTop = _f[1];
|
|
53
|
+
var _g = useState(false),
|
|
54
|
+
showDelayedHint = _g[0],
|
|
55
|
+
setShowDelayedHint = _g[1];
|
|
48
56
|
var calcuatePopUpPlacement = function calcuatePopUpPlacement() {
|
|
49
57
|
var _a, _b, _c;
|
|
50
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;
|
|
@@ -58,7 +66,14 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
58
66
|
};
|
|
59
67
|
useEffect(function () {
|
|
60
68
|
calcuatePopUpPlacement();
|
|
61
|
-
});
|
|
69
|
+
}, []);
|
|
70
|
+
useEffect(function () {
|
|
71
|
+
if (!top) {
|
|
72
|
+
setTimeout(function () {
|
|
73
|
+
setShowDelayedHint(true);
|
|
74
|
+
}, 40);
|
|
75
|
+
}
|
|
76
|
+
}, [top]);
|
|
62
77
|
useEffect(function () {
|
|
63
78
|
var el = document.getElementById("function-details");
|
|
64
79
|
var handleWheel;
|
|
@@ -94,12 +109,44 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
94
109
|
};
|
|
95
110
|
}, []);
|
|
96
111
|
if (!fn) return null;
|
|
97
|
-
return /*#__PURE__*/React.createElement(
|
|
112
|
+
return /*#__PURE__*/React.createElement(DraggableDiv, {
|
|
113
|
+
initialTop: top,
|
|
114
|
+
dragHasMoved: dragHasMoved,
|
|
115
|
+
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", {
|
|
117
|
+
type: "button",
|
|
118
|
+
className: "flex items-center justify-center w-4 h-4 rounded-full",
|
|
119
|
+
style: {
|
|
120
|
+
backgroundColor: "black",
|
|
121
|
+
zIndex: 2000,
|
|
122
|
+
position: "absolute",
|
|
123
|
+
left: "327px",
|
|
124
|
+
top: "-8px"
|
|
125
|
+
},
|
|
126
|
+
onClick: handleShowFormulaHint,
|
|
127
|
+
"aria-label": "Close formula hint"
|
|
128
|
+
}, /*#__PURE__*/React.createElement("svg", {
|
|
129
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
130
|
+
className: " text-white",
|
|
131
|
+
style: {
|
|
132
|
+
width: "12px",
|
|
133
|
+
height: "12px"
|
|
134
|
+
},
|
|
135
|
+
fill: "none",
|
|
136
|
+
viewBox: "0 0 24 24",
|
|
137
|
+
stroke: "currentColor",
|
|
138
|
+
strokeWidth: "3"
|
|
139
|
+
}, /*#__PURE__*/React.createElement("path", {
|
|
140
|
+
strokeLinecap: "round",
|
|
141
|
+
strokeLinejoin: "round",
|
|
142
|
+
d: "M6 18L18 6M6 6l12 12"
|
|
143
|
+
}))), /*#__PURE__*/React.createElement("div", __assign({}, props, {
|
|
98
144
|
ref: hintRef,
|
|
99
145
|
id: "luckysheet-formula-help-c",
|
|
100
146
|
className: "luckysheet-formula-help-c",
|
|
101
147
|
style: {
|
|
102
|
-
top:
|
|
148
|
+
top: "0px",
|
|
149
|
+
left: "0px",
|
|
103
150
|
borderWidth: "1px",
|
|
104
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",
|
|
105
152
|
backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
|
|
@@ -120,9 +167,13 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
120
167
|
"aria-hidden": "true"
|
|
121
168
|
})), /*#__PURE__*/React.createElement("div", {
|
|
122
169
|
onClick: function onClick() {
|
|
123
|
-
|
|
170
|
+
if (!dragHasMoved.current) {
|
|
171
|
+
localStorage.setItem("formula-expand", "".concat(!showFunctionBody));
|
|
172
|
+
setShouldShowFunctionBody(!showFunctionBody);
|
|
173
|
+
}
|
|
174
|
+
dragHasMoved.current = false;
|
|
124
175
|
},
|
|
125
|
-
className: "flex cursor-pointer items-
|
|
176
|
+
className: "flex cursor-pointer items-start justify-between",
|
|
126
177
|
style: {
|
|
127
178
|
backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
|
|
128
179
|
padding: "10px",
|
|
@@ -134,11 +185,11 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
134
185
|
style: {
|
|
135
186
|
fontWeight: 500
|
|
136
187
|
},
|
|
137
|
-
className: "luckysheet-arguments-help-function-name"
|
|
188
|
+
className: "luckysheet-arguments-help-function-name font-family-mono mb-1 mt-2 color-text-default font-family-mono"
|
|
138
189
|
}, fn.n), /*#__PURE__*/React.createElement("code", {
|
|
139
|
-
className: "luckysheet-arguments-paren"
|
|
190
|
+
className: "luckysheet-arguments-paren font-family-mono mb-1 mt-2 color-text-default"
|
|
140
191
|
}, "("), /*#__PURE__*/React.createElement("code", {
|
|
141
|
-
className: "luckysheet-arguments-parameter-holder"
|
|
192
|
+
className: "luckysheet-arguments-parameter-holder font-family-mono mb-1 mt-2 color-text-default"
|
|
142
193
|
}, fn.p.map(function (param, i) {
|
|
143
194
|
var name = param.name;
|
|
144
195
|
if (param.repeat === "y") {
|
|
@@ -148,12 +199,12 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
148
199
|
name = "[".concat(name, "]");
|
|
149
200
|
}
|
|
150
201
|
return /*#__PURE__*/React.createElement("code", {
|
|
151
|
-
className: "luckysheet-arguments-help-parameter",
|
|
202
|
+
className: "luckysheet-arguments-help-parameter font-family-mono mb-1 mt-2 color-text-default",
|
|
152
203
|
dir: "auto",
|
|
153
204
|
key: name
|
|
154
205
|
}, name, i !== fn.p.length - 1 && ", ");
|
|
155
206
|
})), /*#__PURE__*/React.createElement("code", {
|
|
156
|
-
className: "luckysheet-arguments-paren"
|
|
207
|
+
className: "luckysheet-arguments-paren font-family-mono mb-1 mt-2 color-text-default"
|
|
157
208
|
}, ")")), /*#__PURE__*/React.createElement("div", {
|
|
158
209
|
style: {
|
|
159
210
|
display: "flex",
|
|
@@ -199,14 +250,15 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
199
250
|
id: "function-details",
|
|
200
251
|
style: {
|
|
201
252
|
backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
|
|
202
|
-
maxHeight: "
|
|
253
|
+
maxHeight: "284px",
|
|
203
254
|
overflowY: "scroll"
|
|
204
255
|
}
|
|
205
256
|
}, fn.API_KEY && (/*#__PURE__*/React.createElement("div", {
|
|
206
257
|
style: {
|
|
207
258
|
borderLeft: "4px solid ".concat(isKeyAdded ? "#177E23" : "#fb923c"),
|
|
208
259
|
backgroundColor: "white",
|
|
209
|
-
padding: "
|
|
260
|
+
padding: "8px",
|
|
261
|
+
paddingBottom: "2px",
|
|
210
262
|
margin: "4px 4px 0px 4px",
|
|
211
263
|
borderRadius: "4px"
|
|
212
264
|
}
|
|
@@ -245,7 +297,7 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
245
297
|
setApiKeyAdded(false);
|
|
246
298
|
}
|
|
247
299
|
}), /*#__PURE__*/React.createElement("div", {
|
|
248
|
-
className: "flex justify-end mt-2"
|
|
300
|
+
className: "flex justify-end mt-2 mb-2"
|
|
249
301
|
}, /*#__PURE__*/React.createElement(Button, {
|
|
250
302
|
onClick: function onClick() {
|
|
251
303
|
localStorage.setItem(fn.API_KEY, API_KEY);
|
|
@@ -259,16 +311,17 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
259
311
|
backgroundColor: "white",
|
|
260
312
|
padding: "6px",
|
|
261
313
|
margin: "4px 4px 0px 4px",
|
|
262
|
-
borderRadius: "4px"
|
|
314
|
+
borderRadius: "4px",
|
|
315
|
+
marginTop: "-1px"
|
|
263
316
|
}
|
|
264
317
|
}, /*#__PURE__*/React.createElement("div", {
|
|
265
318
|
className: ""
|
|
266
319
|
}, /*#__PURE__*/React.createElement("div", {
|
|
267
320
|
style: {
|
|
268
321
|
lineHeight: "16px",
|
|
269
|
-
fontSize: "
|
|
322
|
+
fontSize: "14px"
|
|
270
323
|
},
|
|
271
|
-
className: "
|
|
324
|
+
className: "font-family-mono mb-1 color-text-default jetbrains-mono"
|
|
272
325
|
}, formulaMore.helpExample), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", {
|
|
273
326
|
style: {
|
|
274
327
|
overflowWrap: "break-word"
|
|
@@ -298,10 +351,10 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
298
351
|
}, /*#__PURE__*/React.createElement("div", {
|
|
299
352
|
style: {
|
|
300
353
|
lineHeight: "16px",
|
|
301
|
-
fontSize: "
|
|
354
|
+
fontSize: "14px",
|
|
302
355
|
padding: "0px"
|
|
303
356
|
},
|
|
304
|
-
className: "
|
|
357
|
+
className: "font-family-mono mb-1 mt-2 color-text-default"
|
|
305
358
|
}, "About"), /*#__PURE__*/React.createElement("span", {
|
|
306
359
|
className: "luckysheet-arguments-help-parameter-content text-helper-text-sm"
|
|
307
360
|
}, fn.d))), /*#__PURE__*/React.createElement("div", {
|
|
@@ -313,7 +366,9 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
313
366
|
return /*#__PURE__*/React.createElement("div", {
|
|
314
367
|
className: "",
|
|
315
368
|
key: param.name
|
|
316
|
-
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code",
|
|
369
|
+
}, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", {
|
|
370
|
+
className: "font-family-mono mb-1 mt-2 color-text-default font-family-mono"
|
|
371
|
+
}, param.name, param.repeat === "y" && (/*#__PURE__*/React.createElement("span", {
|
|
317
372
|
className: "luckysheet-arguments-help-argument-info example-value",
|
|
318
373
|
style: {
|
|
319
374
|
marginTop: "2px"
|
|
@@ -329,7 +384,7 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
329
384
|
marginTop: "2px"
|
|
330
385
|
}
|
|
331
386
|
}, param.detail));
|
|
332
|
-
}))))), /*#__PURE__*/React.createElement("div", {
|
|
387
|
+
}))))), showFunctionBody && (/*#__PURE__*/React.createElement("div", {
|
|
333
388
|
style: {
|
|
334
389
|
backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
|
|
335
390
|
padding: "8px",
|
|
@@ -343,6 +398,6 @@ var FormulaHint = function FormulaHint(props) {
|
|
|
343
398
|
(_a = document.getElementById("function-button")) === null || _a === void 0 ? void 0 : _a.click();
|
|
344
399
|
},
|
|
345
400
|
className: "color-text-link cursor-pointer text-helper-text-sm"
|
|
346
|
-
}, "Learn More")));
|
|
401
|
+
}, "Learn More")))))));
|
|
347
402
|
};
|
|
348
403
|
export default FormulaHint;
|
|
@@ -1,14 +1,24 @@
|
|
|
1
|
-
.luckysheet-formula-search-c {
|
|
1
|
+
.luckysheet-formula-search-c-p {
|
|
2
2
|
position: absolute;
|
|
3
|
-
border: 1px solid rgba(0, 0, 0, 0.2);
|
|
4
3
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
|
|
5
4
|
color: #535353;
|
|
6
5
|
font-size: 12px;
|
|
7
6
|
background: #fff;
|
|
8
7
|
z-index: 1003;
|
|
8
|
+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
|
|
9
|
+
border: 1px solid lavender;
|
|
10
|
+
border-radius: 10px;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.luckysheet-formula-search-c {
|
|
14
|
+
color: #535353;
|
|
15
|
+
font-size: 12px;
|
|
16
|
+
background: #fff;
|
|
9
17
|
width: 300px;
|
|
10
|
-
max-height:
|
|
18
|
+
max-height: 380px;
|
|
11
19
|
overflow-y: auto;
|
|
20
|
+
border-radius: 10px;
|
|
21
|
+
|
|
12
22
|
}
|
|
13
23
|
|
|
14
24
|
.luckysheet-formula-search-c .luckysheet-formula-search-item {
|
|
@@ -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", "
|
|
22
|
+
var authedFunction = ["COINGECKO", "ETHERSCAN", "DEFILLAMA", "GNOSIS", "BASE", "EOA", "PNL", "SAFE", "BLOCKSCOUT", "LENS", "FARCASTER", "Ethereum", "SMARTCONTRACT", "DUNESIM"];
|
|
23
23
|
var filteredDefaultCandidates = context.defaultCandidates.filter(function (item) {
|
|
24
24
|
return !authedFunction.includes(item.n);
|
|
25
25
|
});
|
|
@@ -44,19 +44,22 @@ var FormulaSearch = function FormulaSearch(props) {
|
|
|
44
44
|
var hintAbove = hintHeight > availableBelow;
|
|
45
45
|
var selectionHeight = (firstSelection === null || firstSelection === void 0 ? void 0 : firstSelection.height_move) || 0;
|
|
46
46
|
var divOffset = ((_c = hintRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) || 0;
|
|
47
|
-
|
|
47
|
+
var topV = hintAbove ? selectionHeight - (divOffset + 80) : selectionHeight + 4;
|
|
48
|
+
setTop(topV);
|
|
48
49
|
};
|
|
49
50
|
useEffect(function () {
|
|
50
51
|
calcuatePopUpPlacement();
|
|
51
52
|
});
|
|
52
53
|
if (_.isEmpty(context.functionCandidates) && _.isEmpty(context.defaultCandidates)) return null;
|
|
53
|
-
return /*#__PURE__*/React.createElement("div",
|
|
54
|
-
|
|
55
|
-
id: "luckysheet-formula-search-c",
|
|
56
|
-
className: "luckysheet-formula-search-c",
|
|
54
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
className: "flex flex-col luckysheet-formula-search-c-p",
|
|
57
56
|
style: {
|
|
58
57
|
top: top
|
|
59
58
|
}
|
|
59
|
+
}, /*#__PURE__*/React.createElement("div", __assign({}, props, {
|
|
60
|
+
ref: hintRef,
|
|
61
|
+
id: "luckysheet-formula-search-c",
|
|
62
|
+
className: "luckysheet-formula-search-c"
|
|
60
63
|
}), context.defaultCandidates.length > 0 && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
61
64
|
style: {
|
|
62
65
|
marginBottom: "4px"
|
|
@@ -100,14 +103,14 @@ var FormulaSearch = function FormulaSearch(props) {
|
|
|
100
103
|
height: "16px"
|
|
101
104
|
}
|
|
102
105
|
});
|
|
103
|
-
})))))), context.defaultCandidates.length > 0 ? (/*#__PURE__*/React.createElement(React.Fragment, null, finalDefaultCandidates.map(function (v) {
|
|
106
|
+
})))))), context.defaultCandidates.length > 0 ? (/*#__PURE__*/React.createElement(React.Fragment, null, finalDefaultCandidates.map(function (v, index) {
|
|
104
107
|
return /*#__PURE__*/React.createElement("div", {
|
|
105
108
|
key: v.n,
|
|
106
109
|
"data-func": v.n,
|
|
107
110
|
style: {
|
|
108
111
|
cursor: "pointer"
|
|
109
112
|
},
|
|
110
|
-
className: "luckysheet-formula-search-item"
|
|
113
|
+
className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
|
|
111
114
|
}, /*#__PURE__*/React.createElement("div", {
|
|
112
115
|
style: {
|
|
113
116
|
display: "flex",
|
|
@@ -155,11 +158,11 @@ var FormulaSearch = function FormulaSearch(props) {
|
|
|
155
158
|
})))))), /*#__PURE__*/React.createElement("div", {
|
|
156
159
|
className: "luckysheet-formula-search-detail mt-1 text-helper-text-sm color-text-default"
|
|
157
160
|
}, v.d));
|
|
158
|
-
}))) : (/*#__PURE__*/React.createElement(React.Fragment, null, finalFunctionCandidates.length > 0 && finalFunctionCandidates.map(function (v) {
|
|
161
|
+
}))) : (/*#__PURE__*/React.createElement(React.Fragment, null, finalFunctionCandidates.length > 0 && finalFunctionCandidates.map(function (v, index) {
|
|
159
162
|
return /*#__PURE__*/React.createElement("div", {
|
|
160
163
|
key: v.n,
|
|
161
164
|
"data-func": v.n,
|
|
162
|
-
className: "luckysheet-formula-search-item"
|
|
165
|
+
className: "luckysheet-formula-search-item ".concat(index === 0 ? "luckysheet-formula-search-item-active" : "")
|
|
163
166
|
}, /*#__PURE__*/React.createElement("div", {
|
|
164
167
|
style: {
|
|
165
168
|
display: "flex",
|
|
@@ -244,8 +247,10 @@ var FormulaSearch = function FormulaSearch(props) {
|
|
|
244
247
|
height: "16px"
|
|
245
248
|
}
|
|
246
249
|
});
|
|
247
|
-
})))))))), /*#__PURE__*/React.createElement("
|
|
248
|
-
className: "
|
|
250
|
+
}))))))))), /*#__PURE__*/React.createElement("div", {
|
|
251
|
+
className: "p-2 pt-0"
|
|
252
|
+
}, /*#__PURE__*/React.createElement("hr", {
|
|
253
|
+
className: "color-border-default mb-2"
|
|
249
254
|
}), /*#__PURE__*/React.createElement("div", {
|
|
250
255
|
style: {
|
|
251
256
|
paddingLeft: "10px",
|
|
@@ -256,6 +261,6 @@ var FormulaSearch = function FormulaSearch(props) {
|
|
|
256
261
|
className: "border p-1 color-text-default rounded"
|
|
257
262
|
}, "Tab"), /*#__PURE__*/React.createElement("p", {
|
|
258
263
|
className: "color-text-secondary"
|
|
259
|
-
}, "to insert")));
|
|
264
|
+
}, "to insert"))));
|
|
260
265
|
};
|
|
261
266
|
export default FormulaSearch;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import { LucideIconProps } from "./LucideIcon";
|
|
3
|
+
export declare const LucideIcons: {
|
|
4
|
+
File3d: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
5
|
+
FileWord: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
6
|
+
FilePdf: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
7
|
+
FilePpt: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
8
|
+
FileExcel: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
9
|
+
Section: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
10
|
+
XSocial: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
11
|
+
Farcaster: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
12
|
+
Warpcast: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
13
|
+
DSheetTextDisabled: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
14
|
+
Orb: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
15
|
+
Lens: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
16
|
+
Hey: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
17
|
+
CloudSaved: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
|
|
18
|
+
};
|