@fileverse-dev/fortune-react 1.1.5 → 1.1.6
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.
|
@@ -1,12 +1,40 @@
|
|
|
1
1
|
import _ from "lodash";
|
|
2
2
|
import React, { useCallback, useContext, useEffect, useRef, useState } from "react";
|
|
3
|
+
import { Popover, PopoverTrigger, PopoverContent, LucideIcon, Button } from '@fileverse/ui';
|
|
3
4
|
import { useMediaQuery } from "usehooks-ts";
|
|
4
|
-
import { updateCell, addSheet } from "@fileverse-dev/fortune-core";
|
|
5
|
+
import { updateCell, addSheet, calcSelectionInfo } from "@fileverse-dev/fortune-core";
|
|
5
6
|
import WorkbookContext from "../../context";
|
|
6
7
|
import SVGIcon from "../SVGIcon";
|
|
7
8
|
import "./index.css";
|
|
8
9
|
import SheetItem from "./SheetItem";
|
|
9
10
|
import ZoomControl from "../ZoomControl";
|
|
11
|
+
var STATS = [{
|
|
12
|
+
label: "Average",
|
|
13
|
+
value: 'average'
|
|
14
|
+
}, {
|
|
15
|
+
label: "Count",
|
|
16
|
+
value: 'count'
|
|
17
|
+
}, {
|
|
18
|
+
label: "Max",
|
|
19
|
+
value: 'max'
|
|
20
|
+
}, {
|
|
21
|
+
label: "Min",
|
|
22
|
+
value: 'min'
|
|
23
|
+
}, {
|
|
24
|
+
label: "Number of Cells",
|
|
25
|
+
value: 'numberC'
|
|
26
|
+
}, {
|
|
27
|
+
label: "Sum",
|
|
28
|
+
value: 'sum'
|
|
29
|
+
}];
|
|
30
|
+
var STATS_LABELS = {
|
|
31
|
+
average: "Average",
|
|
32
|
+
count: "Count",
|
|
33
|
+
max: "Max",
|
|
34
|
+
min: "Min",
|
|
35
|
+
numberC: "Number of Cells",
|
|
36
|
+
sum: "Sum"
|
|
37
|
+
};
|
|
10
38
|
var SheetTab = function SheetTab() {
|
|
11
39
|
var isMobile = useMediaQuery("(max-width: 780px)", {
|
|
12
40
|
defaultValue: true
|
|
@@ -25,6 +53,19 @@ var SheetTab = function SheetTab() {
|
|
|
25
53
|
var _c = useState(true),
|
|
26
54
|
isShowBoundary = _c[0],
|
|
27
55
|
setIsShowBoundary = _c[1];
|
|
56
|
+
var _d = useState({
|
|
57
|
+
numberC: 0,
|
|
58
|
+
count: 0,
|
|
59
|
+
sum: 0,
|
|
60
|
+
max: 0,
|
|
61
|
+
min: 0,
|
|
62
|
+
average: ""
|
|
63
|
+
}),
|
|
64
|
+
calInfo = _d[0],
|
|
65
|
+
setCalInfo = _d[1];
|
|
66
|
+
var _e = useState('sum'),
|
|
67
|
+
selectedStat = _e[0],
|
|
68
|
+
setSelectedStat = _e[1];
|
|
28
69
|
var scrollDelta = 150;
|
|
29
70
|
var scrollBy = useCallback(function (amount) {
|
|
30
71
|
var _a;
|
|
@@ -38,6 +79,16 @@ var SheetTab = function SheetTab() {
|
|
|
38
79
|
behavior: "smooth"
|
|
39
80
|
});
|
|
40
81
|
}, []);
|
|
82
|
+
useEffect(function () {
|
|
83
|
+
var selection = context.luckysheet_select_save;
|
|
84
|
+
if (selection) {
|
|
85
|
+
var re = calcSelectionInfo(context, 'en');
|
|
86
|
+
setCalInfo(re);
|
|
87
|
+
}
|
|
88
|
+
}, [context.luckysheet_select_save]);
|
|
89
|
+
useEffect(function () {
|
|
90
|
+
console.log(calInfo, "calInfo");
|
|
91
|
+
}, [calInfo]);
|
|
41
92
|
useEffect(function () {
|
|
42
93
|
var tabCurrent = tabContainerRef.current;
|
|
43
94
|
if (!tabCurrent) return;
|
|
@@ -57,9 +108,9 @@ var SheetTab = function SheetTab() {
|
|
|
57
108
|
setIsShowScrollBtn(tabCurrent.scrollWidth > tabCurrent.clientWidth);
|
|
58
109
|
});
|
|
59
110
|
}, [refs.cellInput, setContext, settings]);
|
|
60
|
-
var
|
|
61
|
-
showDisclaimer =
|
|
62
|
-
setShowDisclaimer =
|
|
111
|
+
var _f = useState(true),
|
|
112
|
+
showDisclaimer = _f[0],
|
|
113
|
+
setShowDisclaimer = _f[1];
|
|
63
114
|
var handleCloseDisclaimer = function handleCloseDisclaimer() {
|
|
64
115
|
setShowDisclaimer(false);
|
|
65
116
|
var cornerPlus = document.getElementById("corner-plus");
|
|
@@ -186,6 +237,40 @@ var SheetTab = function SheetTab() {
|
|
|
186
237
|
height: 12
|
|
187
238
|
})))), /*#__PURE__*/React.createElement("div", {
|
|
188
239
|
className: "fortune-sheet-area-right"
|
|
189
|
-
}, /*#__PURE__*/React.createElement(
|
|
240
|
+
}, /*#__PURE__*/React.createElement(Popover, null, /*#__PURE__*/React.createElement(PopoverTrigger, {
|
|
241
|
+
className: "hover:bg-gray-100"
|
|
242
|
+
}, /*#__PURE__*/React.createElement(Button, {
|
|
243
|
+
variant: "ghost",
|
|
244
|
+
className: "w-full h-8 rounded p-2 m-1 text-left flex items-center justify-center transition mr-2"
|
|
245
|
+
}, calInfo.count > 0 && /*#__PURE__*/React.createElement("p", {
|
|
246
|
+
className: "text-body-sm"
|
|
247
|
+
}, STATS_LABELS[selectedStat], ": ", calInfo[selectedStat]))), /*#__PURE__*/React.createElement(PopoverContent, {
|
|
248
|
+
align: "end",
|
|
249
|
+
alignOffset: 0,
|
|
250
|
+
className: "w-72 export-content color-border-default shadow-elevation-3",
|
|
251
|
+
elevation: 2,
|
|
252
|
+
side: "bottom",
|
|
253
|
+
sideOffset: 4
|
|
254
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
255
|
+
className: "p-2 color-text-default color-border-default"
|
|
256
|
+
}, /*#__PURE__*/React.createElement("h1", {
|
|
257
|
+
className: "text-helper-text-sm color-text-secondary pl-2 mb-2"
|
|
258
|
+
}, "Sort By"), STATS.map(function (option) {
|
|
259
|
+
return /*#__PURE__*/React.createElement(Button, {
|
|
260
|
+
variant: "ghost",
|
|
261
|
+
key: option.value,
|
|
262
|
+
className: "w-full h-8 rounded p-2 m-1 text-left flex items-center justify-between transition ".concat(selectedStat === option.value && 'bg-[#F8F9FA]'),
|
|
263
|
+
onClick: function onClick() {
|
|
264
|
+
return setSelectedStat(option.value);
|
|
265
|
+
}
|
|
266
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
267
|
+
className: "flex gap-2 items-center"
|
|
268
|
+
}, selectedStat === option.value && (/*#__PURE__*/React.createElement(LucideIcon, {
|
|
269
|
+
name: "Check",
|
|
270
|
+
size: "sm"
|
|
271
|
+
})), /*#__PURE__*/React.createElement("p", {
|
|
272
|
+
className: "text-body-sm"
|
|
273
|
+
}, option.label, ": ", calInfo[option.value])));
|
|
274
|
+
})))), /*#__PURE__*/React.createElement(ZoomControl, null))));
|
|
190
275
|
};
|
|
191
276
|
export default SheetTab;
|
|
@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _lodash = _interopRequireDefault(require("lodash"));
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _ui = require("@fileverse/ui");
|
|
10
11
|
var _usehooksTs = require("usehooks-ts");
|
|
11
12
|
var _fortuneCore = require("@fileverse-dev/fortune-core");
|
|
12
13
|
var _context = _interopRequireDefault(require("../../context"));
|
|
@@ -16,6 +17,33 @@ var _SheetItem = _interopRequireDefault(require("./SheetItem"));
|
|
|
16
17
|
var _ZoomControl = _interopRequireDefault(require("../ZoomControl"));
|
|
17
18
|
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); }
|
|
18
19
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
20
|
+
var STATS = [{
|
|
21
|
+
label: "Average",
|
|
22
|
+
value: 'average'
|
|
23
|
+
}, {
|
|
24
|
+
label: "Count",
|
|
25
|
+
value: 'count'
|
|
26
|
+
}, {
|
|
27
|
+
label: "Max",
|
|
28
|
+
value: 'max'
|
|
29
|
+
}, {
|
|
30
|
+
label: "Min",
|
|
31
|
+
value: 'min'
|
|
32
|
+
}, {
|
|
33
|
+
label: "Number of Cells",
|
|
34
|
+
value: 'numberC'
|
|
35
|
+
}, {
|
|
36
|
+
label: "Sum",
|
|
37
|
+
value: 'sum'
|
|
38
|
+
}];
|
|
39
|
+
var STATS_LABELS = {
|
|
40
|
+
average: "Average",
|
|
41
|
+
count: "Count",
|
|
42
|
+
max: "Max",
|
|
43
|
+
min: "Min",
|
|
44
|
+
numberC: "Number of Cells",
|
|
45
|
+
sum: "Sum"
|
|
46
|
+
};
|
|
19
47
|
var SheetTab = function SheetTab() {
|
|
20
48
|
var isMobile = (0, _usehooksTs.useMediaQuery)("(max-width: 780px)", {
|
|
21
49
|
defaultValue: true
|
|
@@ -34,6 +62,19 @@ var SheetTab = function SheetTab() {
|
|
|
34
62
|
var _c = (0, _react.useState)(true),
|
|
35
63
|
isShowBoundary = _c[0],
|
|
36
64
|
setIsShowBoundary = _c[1];
|
|
65
|
+
var _d = (0, _react.useState)({
|
|
66
|
+
numberC: 0,
|
|
67
|
+
count: 0,
|
|
68
|
+
sum: 0,
|
|
69
|
+
max: 0,
|
|
70
|
+
min: 0,
|
|
71
|
+
average: ""
|
|
72
|
+
}),
|
|
73
|
+
calInfo = _d[0],
|
|
74
|
+
setCalInfo = _d[1];
|
|
75
|
+
var _e = (0, _react.useState)('sum'),
|
|
76
|
+
selectedStat = _e[0],
|
|
77
|
+
setSelectedStat = _e[1];
|
|
37
78
|
var scrollDelta = 150;
|
|
38
79
|
var scrollBy = (0, _react.useCallback)(function (amount) {
|
|
39
80
|
var _a;
|
|
@@ -47,6 +88,16 @@ var SheetTab = function SheetTab() {
|
|
|
47
88
|
behavior: "smooth"
|
|
48
89
|
});
|
|
49
90
|
}, []);
|
|
91
|
+
(0, _react.useEffect)(function () {
|
|
92
|
+
var selection = context.luckysheet_select_save;
|
|
93
|
+
if (selection) {
|
|
94
|
+
var re = (0, _fortuneCore.calcSelectionInfo)(context, 'en');
|
|
95
|
+
setCalInfo(re);
|
|
96
|
+
}
|
|
97
|
+
}, [context.luckysheet_select_save]);
|
|
98
|
+
(0, _react.useEffect)(function () {
|
|
99
|
+
console.log(calInfo, "calInfo");
|
|
100
|
+
}, [calInfo]);
|
|
50
101
|
(0, _react.useEffect)(function () {
|
|
51
102
|
var tabCurrent = tabContainerRef.current;
|
|
52
103
|
if (!tabCurrent) return;
|
|
@@ -66,9 +117,9 @@ var SheetTab = function SheetTab() {
|
|
|
66
117
|
setIsShowScrollBtn(tabCurrent.scrollWidth > tabCurrent.clientWidth);
|
|
67
118
|
});
|
|
68
119
|
}, [refs.cellInput, setContext, settings]);
|
|
69
|
-
var
|
|
70
|
-
showDisclaimer =
|
|
71
|
-
setShowDisclaimer =
|
|
120
|
+
var _f = (0, _react.useState)(true),
|
|
121
|
+
showDisclaimer = _f[0],
|
|
122
|
+
setShowDisclaimer = _f[1];
|
|
72
123
|
var handleCloseDisclaimer = function handleCloseDisclaimer() {
|
|
73
124
|
setShowDisclaimer(false);
|
|
74
125
|
var cornerPlus = document.getElementById("corner-plus");
|
|
@@ -195,6 +246,40 @@ var SheetTab = function SheetTab() {
|
|
|
195
246
|
height: 12
|
|
196
247
|
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
197
248
|
className: "fortune-sheet-area-right"
|
|
198
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
249
|
+
}, /*#__PURE__*/_react.default.createElement(_ui.Popover, null, /*#__PURE__*/_react.default.createElement(_ui.PopoverTrigger, {
|
|
250
|
+
className: "hover:bg-gray-100"
|
|
251
|
+
}, /*#__PURE__*/_react.default.createElement(_ui.Button, {
|
|
252
|
+
variant: "ghost",
|
|
253
|
+
className: "w-full h-8 rounded p-2 m-1 text-left flex items-center justify-center transition mr-2"
|
|
254
|
+
}, calInfo.count > 0 && /*#__PURE__*/_react.default.createElement("p", {
|
|
255
|
+
className: "text-body-sm"
|
|
256
|
+
}, STATS_LABELS[selectedStat], ": ", calInfo[selectedStat]))), /*#__PURE__*/_react.default.createElement(_ui.PopoverContent, {
|
|
257
|
+
align: "end",
|
|
258
|
+
alignOffset: 0,
|
|
259
|
+
className: "w-72 export-content color-border-default shadow-elevation-3",
|
|
260
|
+
elevation: 2,
|
|
261
|
+
side: "bottom",
|
|
262
|
+
sideOffset: 4
|
|
263
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
264
|
+
className: "p-2 color-text-default color-border-default"
|
|
265
|
+
}, /*#__PURE__*/_react.default.createElement("h1", {
|
|
266
|
+
className: "text-helper-text-sm color-text-secondary pl-2 mb-2"
|
|
267
|
+
}, "Sort By"), STATS.map(function (option) {
|
|
268
|
+
return /*#__PURE__*/_react.default.createElement(_ui.Button, {
|
|
269
|
+
variant: "ghost",
|
|
270
|
+
key: option.value,
|
|
271
|
+
className: "w-full h-8 rounded p-2 m-1 text-left flex items-center justify-between transition ".concat(selectedStat === option.value && 'bg-[#F8F9FA]'),
|
|
272
|
+
onClick: function onClick() {
|
|
273
|
+
return setSelectedStat(option.value);
|
|
274
|
+
}
|
|
275
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
276
|
+
className: "flex gap-2 items-center"
|
|
277
|
+
}, selectedStat === option.value && (/*#__PURE__*/_react.default.createElement(_ui.LucideIcon, {
|
|
278
|
+
name: "Check",
|
|
279
|
+
size: "sm"
|
|
280
|
+
})), /*#__PURE__*/_react.default.createElement("p", {
|
|
281
|
+
className: "text-body-sm"
|
|
282
|
+
}, option.label, ": ", calInfo[option.value])));
|
|
283
|
+
})))), /*#__PURE__*/_react.default.createElement(_ZoomControl.default, null))));
|
|
199
284
|
};
|
|
200
285
|
var _default = exports.default = SheetTab;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fileverse-dev/fortune-react",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.6",
|
|
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.
|
|
19
|
+
"@fileverse-dev/fortune-core": "1.1.6",
|
|
20
20
|
"@fileverse/ui": "^4.1.7-patch-21",
|
|
21
21
|
"@tippyjs/react": "^4.2.6",
|
|
22
22
|
"@types/regenerator-runtime": "^0.13.6",
|