@fileverse-dev/fortune-react 1.1.56 → 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.
@@ -2,10 +2,8 @@ import React from "react";
2
2
  interface DraggableDivProps {
3
3
  children?: React.ReactNode;
4
4
  className?: string;
5
- initialX?: number;
6
- initialY?: number;
7
- initialPos?: any;
5
+ initialTop?: any;
8
6
  dragHasMoved?: any;
9
7
  }
10
- export declare function DraggableDiv({ children, className, initialPos, dragHasMoved }: DraggableDivProps): React.JSX.Element;
8
+ export declare const DraggableDiv: ({ children, className, initialTop, dragHasMoved, }: DraggableDivProps) => React.JSX.Element;
11
9
  export {};
@@ -1,15 +1,14 @@
1
1
  "use client";
2
2
 
3
- import React, { useEffect } from "react";
4
- import { useState, useRef } from "react";
3
+ import React, { useEffect, useState, useRef } from "react";
5
4
  import { cn } from "@fileverse/ui";
6
- export function DraggableDiv(_a) {
5
+ export var DraggableDiv = function DraggableDiv(_a) {
7
6
  var children = _a.children,
8
7
  className = _a.className,
9
- initialPos = _a.initialPos,
8
+ initialTop = _a.initialTop,
10
9
  dragHasMoved = _a.dragHasMoved;
11
- var initialX = 0,
12
- initialY = initialPos;
10
+ var initialX = 0;
11
+ var initialY = initialTop;
13
12
  var _b = useState({
14
13
  x: initialX,
15
14
  y: initialY
@@ -29,25 +28,37 @@ export function DraggableDiv(_a) {
29
28
  useEffect(function () {
30
29
  setPosition({
31
30
  x: position.x,
32
- y: initialPos
31
+ y: initialTop
33
32
  });
34
- }, [initialPos]);
33
+ }, [initialTop]);
35
34
  var handleMouseDown = function handleMouseDown(e) {
36
35
  setIsDragging(true);
37
- var element = document.getElementById('luckysheet-formula-help-c');
36
+ var element = document.getElementById("luckysheet-formula-help-c");
38
37
  if (element) {
39
- element.style.userSelect = 'none';
38
+ element.style.userSelect = "none";
40
39
  }
41
40
  setDragOffset({
42
41
  x: e.clientX - position.x,
43
42
  y: e.clientY - position.y
44
43
  });
45
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
+ };
46
57
  var handleMouseMove = function handleMouseMove(e) {
47
58
  if (!isDragging) return;
48
59
  e.preventDefault();
49
60
  dragHasMoved.current = true;
50
- setPosition(function (currentPosition) {
61
+ setPosition(function () {
51
62
  var newX = e.clientX - dragOffset.x;
52
63
  var newY = e.clientY - dragOffset.y;
53
64
  return {
@@ -56,23 +67,48 @@ export function DraggableDiv(_a) {
56
67
  };
57
68
  });
58
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
+ };
59
84
  var handleMouseUp = function handleMouseUp() {
60
85
  setIsDragging(false);
61
- var element = document.getElementById('luckysheet-formula-help-c');
86
+ var element = document.getElementById("luckysheet-formula-help-c");
62
87
  if (element) {
63
- element.style.userSelect = 'auto';
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";
64
96
  }
65
97
  };
66
98
  React.useEffect(function () {
67
99
  if (isDragging) {
68
100
  document.addEventListener("mousemove", handleMouseMove);
69
101
  document.addEventListener("mouseup", handleMouseUp);
70
- return function () {
71
- document.removeEventListener("mousemove", handleMouseMove);
72
- document.removeEventListener("mouseup", handleMouseUp);
73
- };
102
+ document.addEventListener("touchmove", handleTouchMove);
103
+ document.addEventListener("touchend", handleTouchEnd);
74
104
  }
75
- }, [isDragging, handleMouseMove, handleMouseUp]);
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]);
76
112
  return /*#__PURE__*/React.createElement("div", {
77
113
  ref: divRef,
78
114
  className: cn("absolute select-none touch-none", isDragging ? "cursor-grabbing shadow-2xl z-50" : "cursor-grab shadow-lg", className),
@@ -82,6 +118,8 @@ export function DraggableDiv(_a) {
82
118
  height: "0px"
83
119
  },
84
120
  onMouseDown: handleMouseDown,
85
- onMouseUp: handleMouseUp
121
+ onMouseUp: handleMouseUp,
122
+ onTouchStart: handleTouchStart,
123
+ onTouchEnd: handleTouchEnd
86
124
  }, children);
87
- }
125
+ };
@@ -16,6 +16,8 @@ import "./index.css";
16
16
  import { DraggableDiv } from "./dragable-div";
17
17
  var FormulaHint = function FormulaHint(props) {
18
18
  var _a;
19
+ var showFormulaHint = props.showFormulaHint,
20
+ handleShowFormulaHint = props.handleShowFormulaHint;
19
21
  var dragHasMoved = useRef(false);
20
22
  var context = useContext(WorkbookContext).context;
21
23
  var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
@@ -108,12 +110,11 @@ var FormulaHint = function FormulaHint(props) {
108
110
  }, []);
109
111
  if (!fn) return null;
110
112
  return /*#__PURE__*/React.createElement(DraggableDiv, {
111
- initialX: 50,
112
- initialY: 50,
113
- initialPos: top,
113
+ initialTop: top,
114
114
  dragHasMoved: dragHasMoved,
115
115
  className: "bg-secondary text-secondary-foreground p-4 rounded-lg flex items-center justify-center ".concat(showDelayedHint ? "opacity-100" : "opacity-0")
116
- }, props.showFormulaHint && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
116
+ }, showFormulaHint && (/*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
117
+ type: "button",
117
118
  className: "flex items-center justify-center w-4 h-4 rounded-full",
118
119
  style: {
119
120
  backgroundColor: "black",
@@ -122,7 +123,8 @@ var FormulaHint = function FormulaHint(props) {
122
123
  left: "327px",
123
124
  top: "-8px"
124
125
  },
125
- onClick: props.handleShowFormulaHint
126
+ onClick: handleShowFormulaHint,
127
+ "aria-label": "Close formula hint"
126
128
  }, /*#__PURE__*/React.createElement("svg", {
127
129
  xmlns: "http://www.w3.org/2000/svg",
128
130
  className: " text-white",
@@ -133,18 +135,18 @@ var FormulaHint = function FormulaHint(props) {
133
135
  fill: "none",
134
136
  viewBox: "0 0 24 24",
135
137
  stroke: "currentColor",
136
- "stroke-width": "3"
138
+ strokeWidth: "3"
137
139
  }, /*#__PURE__*/React.createElement("path", {
138
- "stroke-linecap": "round",
139
- "stroke-linejoin": "round",
140
+ strokeLinecap: "round",
141
+ strokeLinejoin: "round",
140
142
  d: "M6 18L18 6M6 6l12 12"
141
143
  }))), /*#__PURE__*/React.createElement("div", __assign({}, props, {
142
144
  ref: hintRef,
143
145
  id: "luckysheet-formula-help-c",
144
146
  className: "luckysheet-formula-help-c",
145
147
  style: {
146
- top: '0px',
147
- left: '0px',
148
+ top: "0px",
149
+ left: "0px",
148
150
  borderWidth: "1px",
149
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",
150
152
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
@@ -164,9 +166,9 @@ var FormulaHint = function FormulaHint(props) {
164
166
  className: "fa fa-angle-up",
165
167
  "aria-hidden": "true"
166
168
  })), /*#__PURE__*/React.createElement("div", {
167
- onClick: function onClick(e) {
169
+ onClick: function onClick() {
168
170
  if (!dragHasMoved.current) {
169
- localStorage.setItem('formula-expand', "".concat(!showFunctionBody));
171
+ localStorage.setItem("formula-expand", "".concat(!showFunctionBody));
170
172
  setShouldShowFunctionBody(!showFunctionBody);
171
173
  }
172
174
  dragHasMoved.current = false;
@@ -382,7 +384,7 @@ var FormulaHint = function FormulaHint(props) {
382
384
  marginTop: "2px"
383
385
  }
384
386
  }, param.detail));
385
- }))))), showFunctionBody && /*#__PURE__*/React.createElement("div", {
387
+ }))))), showFunctionBody && (/*#__PURE__*/React.createElement("div", {
386
388
  style: {
387
389
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
388
390
  padding: "8px",
@@ -396,6 +398,6 @@ var FormulaHint = function FormulaHint(props) {
396
398
  (_a = document.getElementById("function-button")) === null || _a === void 0 ? void 0 : _a.click();
397
399
  },
398
400
  className: "color-text-link cursor-pointer text-helper-text-sm"
399
- }, "Learn More"))))));
401
+ }, "Learn More")))))));
400
402
  };
401
403
  export default FormulaHint;
@@ -1,5 +1,5 @@
1
- import React from 'react';
2
- import { LucideIconProps } from './LucideIcon';
1
+ import React from "react";
2
+ import { LucideIconProps } from "./LucideIcon";
3
3
  export declare const LucideIcons: {
4
4
  File3d: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
5
5
  FileWord: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
@@ -16,7 +16,7 @@ var __rest = this && this.__rest || function (s, e) {
16
16
  }
17
17
  return t;
18
18
  };
19
- import React from 'react';
19
+ import React from "react";
20
20
  export var LucideIcons = {
21
21
  File3d: function File3d(_a) {
22
22
  var width = _a.width,
@@ -288,19 +288,19 @@ export var LucideIcons = {
288
288
  xmlns: "http://www.w3.org/2000/svg"
289
289
  }), /*#__PURE__*/React.createElement("path", {
290
290
  d: "M3.85005 5.6489C3.85005 5.14849 3.97654 4.84173 4.1361 4.67838C4.27776 4.53334 4.53891 4.40657 5.05457 4.47689C5.37378 4.52042 5.66784 4.29693 5.71137 3.97772C5.75489 3.65851 5.53141 3.36445 5.2122 3.32092C4.44452 3.21624 3.77233 3.38113 3.3015 3.86318C2.84855 4.32691 2.68338 4.98265 2.68338 5.6489V5.76556H1.63338C1.31122 5.76556 1.05005 6.02673 1.05005 6.34889C1.05005 6.67106 1.31122 6.93223 1.63338 6.93223H2.68338V8.0989C2.68338 8.55024 2.58164 8.78404 2.46408 8.90814C2.35232 9.0261 2.12709 9.1489 1.63338 9.1489C1.31122 9.1489 1.05005 9.41007 1.05005 9.73224C1.05005 10.0544 1.31122 10.3156 1.63338 10.3156C2.30635 10.3156 2.89778 10.1467 3.31102 9.71051C3.71846 9.28043 3.85005 8.69757 3.85005 8.0989V6.93223H4.95838C5.28055 6.93223 5.54172 6.67106 5.54172 6.34889C5.54172 6.02673 5.28055 5.76556 4.95838 5.76556H3.85005V5.6489Z",
291
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
291
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
292
292
  stroke: "transparent"
293
293
  }), /*#__PURE__*/React.createElement("path", {
294
294
  d: "M11.0718 5.86947C11.2427 6.04033 11.2427 6.31734 11.0718 6.48819L10.0687 7.49133L11.0718 8.49447C11.2427 8.66533 11.2427 8.94234 11.0718 9.11319C10.901 9.28405 10.6239 9.28405 10.4531 9.11319L9.44995 8.11005L8.44681 9.11319C8.27596 9.28405 7.99895 9.28405 7.82809 9.11319C7.65724 8.94234 7.65724 8.66533 7.82809 8.49447L8.83123 7.49133L7.82809 6.48819C7.65724 6.31734 7.65724 6.04033 7.82809 5.86947C7.99895 5.69862 8.27596 5.69862 8.44681 5.86947L9.44995 6.87261L10.4531 5.86947C10.6239 5.69862 10.901 5.69862 11.0718 5.86947Z",
295
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
295
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
296
296
  stroke: "transparent"
297
297
  }), /*#__PURE__*/React.createElement("path", {
298
298
  d: "M5.81055 7.49158C5.81055 6.7884 5.9531 6.09264 6.22822 5.47362L6.33691 5.24598C6.60497 4.72507 6.96821 4.27881 7.40674 3.94989C7.6232 3.78754 7.92999 3.83124 8.09238 4.04764C8.25473 4.2641 8.21103 4.57089 7.99463 4.73328C7.68835 4.963 7.41663 5.28939 7.2085 5.69373L7.12373 5.87215C6.90738 6.35898 6.79082 6.91786 6.79082 7.49158C6.79082 8.06531 6.90738 8.62419 7.12373 9.11102L7.2085 9.28944C7.38687 9.63597 7.61198 9.92509 7.86543 10.1453L7.99463 10.2499L8.06777 10.3169C8.21893 10.4874 8.23444 10.7461 8.09238 10.9355C7.95023 11.125 7.69755 11.1821 7.4915 11.0846L7.40674 11.0333L7.22354 10.8856C6.86643 10.5756 6.56672 10.1838 6.33691 9.73719L6.22822 9.50955C5.9531 8.89053 5.81055 8.19477 5.81055 7.49158Z",
299
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
299
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
300
300
  stroke: "transparent"
301
301
  }), /*#__PURE__*/React.createElement("path", {
302
302
  d: "M13.0894 7.49096C13.0894 8.19414 12.9468 8.88991 12.6717 9.50893L12.563 9.73657C12.2949 10.2575 11.9317 10.7037 11.4932 11.0327C11.2767 11.195 10.9699 11.1513 10.8075 10.9349C10.6452 10.7184 10.6889 10.4117 10.9053 10.2493C11.2116 10.0195 11.4833 9.69316 11.6914 9.28881L11.7762 9.11039C11.9925 8.62356 12.1091 8.06469 12.1091 7.49096C12.1091 6.91723 11.9925 6.35836 11.7762 5.87153L11.6914 5.69311C11.513 5.34658 11.2879 5.05745 11.0345 4.83725L10.9053 4.73266L10.8321 4.66567C10.681 4.49514 10.6655 4.23642 10.8075 4.04701C10.9497 3.85759 11.2024 3.80043 11.4084 3.89799L11.4932 3.94926L11.6764 4.09692C12.0335 4.40694 12.3332 4.79877 12.563 5.24535L12.6717 5.47299C12.9468 6.09201 13.0894 6.78778 13.0894 7.49096Z",
303
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
303
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
304
304
  stroke: "transparent"
305
305
  }));
306
306
  },
@@ -338,7 +338,7 @@ var InputBox = function InputBox() {
338
338
  }, [clearSearchItemActiveClass, context.luckysheetCellUpdate.length, selectActiveFormula, setContext, firstSelection]);
339
339
  var onChange = useCallback(function (__, isBlur) {
340
340
  var _a;
341
- if ((_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.innerText.includes('=')) {
341
+ if ((_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.innerText.includes("=")) {
342
342
  setShowSearchHint(true);
343
343
  } else {
344
344
  setShowSearchHint(false);
@@ -491,7 +491,7 @@ var InputBox = function InputBox() {
491
491
  onKeyDown: onKeyDown,
492
492
  onPaste: onPaste,
493
493
  allowEdit: edit ? !isHidenRC : edit
494
- })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/React.createElement(React.Fragment, null, showSearchHint && /*#__PURE__*/React.createElement(FormulaSearch, {
494
+ })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/React.createElement(React.Fragment, null, showSearchHint && (/*#__PURE__*/React.createElement(FormulaSearch, {
495
495
  onMouseMove: function onMouseMove(e) {
496
496
  if (document.getElementById("luckysheet-formula-search-c")) {
497
497
  var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
@@ -504,10 +504,10 @@ var InputBox = function InputBox() {
504
504
  onMouseDown: function onMouseDown(e) {
505
505
  selectActiveFormulaOnClick(e);
506
506
  }
507
- }), 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, {
507
+ })), 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
508
  handleShowFormulaHint: handleShowFormulaHint,
509
509
  showFormulaHint: showFormulaHint
510
- }), !showFormulaHint && fn && (/*#__PURE__*/React.createElement("div", {
510
+ })), !showFormulaHint && fn && (/*#__PURE__*/React.createElement("div", {
511
511
  className: "luckysheet-hin absolute",
512
512
  style: {
513
513
  top: "1px",
@@ -528,8 +528,8 @@ var InputBox = function InputBox() {
528
528
  name: "DSheetTextDisabled",
529
529
  fill: "black",
530
530
  style: {
531
- width: '14px',
532
- height: '14px',
531
+ width: "14px",
532
+ height: "14px",
533
533
  margin: "auto",
534
534
  marginTop: "1px"
535
535
  }
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React from "react";
2
2
  export declare const UltimateIcons: {
3
3
  File3d: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
4
4
  FileWord: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
@@ -15,7 +15,7 @@ export declare const UltimateIcons: {
15
15
  Hey: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
16
16
  CloudSaved: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
17
17
  };
18
- export type ButtonSize = 'sm' | 'md' | 'lg';
18
+ export type ButtonSize = "sm" | "md" | "lg";
19
19
  interface SvgProps extends React.SVGProps<SVGSVGElement> {
20
20
  fill?: string;
21
21
  stroke?: string;
@@ -16,10 +16,10 @@ var __rest = this && this.__rest || function (s, e) {
16
16
  }
17
17
  return t;
18
18
  };
19
- import cn from 'classnames';
20
- import React, { forwardRef } from 'react';
21
- import { LucideIcons } from './Icon';
22
- export var UltimateIcons = Object.assign({}, LucideIcons);
19
+ import cn from "classnames";
20
+ import React, { forwardRef } from "react";
21
+ import { LucideIcons } from "./Icon";
22
+ export var UltimateIcons = __assign({}, LucideIcons);
23
23
  export var LucideIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
24
24
  var name = _a.name,
25
25
  className = _a.className,
@@ -28,7 +28,7 @@ export var LucideIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
28
28
  fill = _a.fill,
29
29
  stroke = _a.stroke,
30
30
  props = __rest(_a, ["name", "className", "strokeWidth", "size", "fill", "stroke"]);
31
- var buttonSize = size === 'sm' ? 'w-6 h-6' : size === 'lg' ? 'w-10 h-10' : 'w-8 h-8';
31
+ var buttonSize = size === "sm" ? "w-6 h-6" : size === "lg" ? "w-10 h-10" : "w-8 h-8";
32
32
  var IconComponent = UltimateIcons[name];
33
33
  if (!IconComponent) {
34
34
  return null;
@@ -38,8 +38,8 @@ export var LucideIcon = /*#__PURE__*/forwardRef(function (_a, ref) {
38
38
  ref: ref,
39
39
  className: cn(buttonSize, className),
40
40
  strokeWidth: strokeWidth || 2,
41
- fill: fill || 'none',
42
- stroke: stroke || 'currentColor'
41
+ fill: fill || "none",
42
+ stroke: stroke || "currentColor"
43
43
  }, props));
44
44
  });
45
- LucideIcon.displayName = 'LucideIcon';
45
+ LucideIcon.displayName = "LucideIcon";
@@ -2,10 +2,8 @@ import React from "react";
2
2
  interface DraggableDivProps {
3
3
  children?: React.ReactNode;
4
4
  className?: string;
5
- initialX?: number;
6
- initialY?: number;
7
- initialPos?: any;
5
+ initialTop?: any;
8
6
  dragHasMoved?: any;
9
7
  }
10
- export declare function DraggableDiv({ children, className, initialPos, dragHasMoved }: DraggableDivProps): React.JSX.Element;
8
+ export declare const DraggableDiv: ({ children, className, initialTop, dragHasMoved, }: DraggableDivProps) => React.JSX.Element;
11
9
  export {};
@@ -5,17 +5,17 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.DraggableDiv = DraggableDiv;
8
+ exports.DraggableDiv = void 0;
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _ui = require("@fileverse/ui");
11
11
  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); }
12
- function DraggableDiv(_a) {
12
+ var DraggableDiv = exports.DraggableDiv = function DraggableDiv(_a) {
13
13
  var children = _a.children,
14
14
  className = _a.className,
15
- initialPos = _a.initialPos,
15
+ initialTop = _a.initialTop,
16
16
  dragHasMoved = _a.dragHasMoved;
17
- var initialX = 0,
18
- initialY = initialPos;
17
+ var initialX = 0;
18
+ var initialY = initialTop;
19
19
  var _b = (0, _react.useState)({
20
20
  x: initialX,
21
21
  y: initialY
@@ -35,25 +35,37 @@ function DraggableDiv(_a) {
35
35
  (0, _react.useEffect)(function () {
36
36
  setPosition({
37
37
  x: position.x,
38
- y: initialPos
38
+ y: initialTop
39
39
  });
40
- }, [initialPos]);
40
+ }, [initialTop]);
41
41
  var handleMouseDown = function handleMouseDown(e) {
42
42
  setIsDragging(true);
43
- var element = document.getElementById('luckysheet-formula-help-c');
43
+ var element = document.getElementById("luckysheet-formula-help-c");
44
44
  if (element) {
45
- element.style.userSelect = 'none';
45
+ element.style.userSelect = "none";
46
46
  }
47
47
  setDragOffset({
48
48
  x: e.clientX - position.x,
49
49
  y: e.clientY - position.y
50
50
  });
51
51
  };
52
+ var handleTouchStart = function handleTouchStart(e) {
53
+ setIsDragging(true);
54
+ var element = document.getElementById("luckysheet-formula-help-c");
55
+ if (element) {
56
+ element.style.userSelect = "none";
57
+ }
58
+ var touch = e.touches[0];
59
+ setDragOffset({
60
+ x: touch.clientX - position.x,
61
+ y: touch.clientY - position.y
62
+ });
63
+ };
52
64
  var handleMouseMove = function handleMouseMove(e) {
53
65
  if (!isDragging) return;
54
66
  e.preventDefault();
55
67
  dragHasMoved.current = true;
56
- setPosition(function (currentPosition) {
68
+ setPosition(function () {
57
69
  var newX = e.clientX - dragOffset.x;
58
70
  var newY = e.clientY - dragOffset.y;
59
71
  return {
@@ -62,23 +74,48 @@ function DraggableDiv(_a) {
62
74
  };
63
75
  });
64
76
  };
77
+ var handleTouchMove = function handleTouchMove(e) {
78
+ if (!isDragging) return;
79
+ e.preventDefault();
80
+ dragHasMoved.current = true;
81
+ var touch = e.touches[0];
82
+ setPosition(function () {
83
+ var newX = touch.clientX - dragOffset.x;
84
+ var newY = touch.clientY - dragOffset.y;
85
+ return {
86
+ x: newX * 1.3,
87
+ y: newY * 1.3
88
+ };
89
+ });
90
+ };
65
91
  var handleMouseUp = function handleMouseUp() {
66
92
  setIsDragging(false);
67
- var element = document.getElementById('luckysheet-formula-help-c');
93
+ var element = document.getElementById("luckysheet-formula-help-c");
68
94
  if (element) {
69
- element.style.userSelect = 'auto';
95
+ element.style.userSelect = "auto";
96
+ }
97
+ };
98
+ var handleTouchEnd = function handleTouchEnd() {
99
+ setIsDragging(false);
100
+ var element = document.getElementById("luckysheet-formula-help-c");
101
+ if (element) {
102
+ element.style.userSelect = "auto";
70
103
  }
71
104
  };
72
105
  _react.default.useEffect(function () {
73
106
  if (isDragging) {
74
107
  document.addEventListener("mousemove", handleMouseMove);
75
108
  document.addEventListener("mouseup", handleMouseUp);
76
- return function () {
77
- document.removeEventListener("mousemove", handleMouseMove);
78
- document.removeEventListener("mouseup", handleMouseUp);
79
- };
109
+ document.addEventListener("touchmove", handleTouchMove);
110
+ document.addEventListener("touchend", handleTouchEnd);
80
111
  }
81
- }, [isDragging, handleMouseMove, handleMouseUp]);
112
+ return function () {
113
+ document.removeEventListener("mousemove", handleMouseMove);
114
+ document.removeEventListener("mouseup", handleMouseUp);
115
+ document.removeEventListener("touchmove", handleTouchMove);
116
+ document.removeEventListener("touchend", handleTouchEnd);
117
+ };
118
+ }, [isDragging, handleMouseMove, handleMouseUp, handleTouchMove, handleTouchEnd]);
82
119
  return /*#__PURE__*/_react.default.createElement("div", {
83
120
  ref: divRef,
84
121
  className: (0, _ui.cn)("absolute select-none touch-none", isDragging ? "cursor-grabbing shadow-2xl z-50" : "cursor-grab shadow-lg", className),
@@ -88,6 +125,8 @@ function DraggableDiv(_a) {
88
125
  height: "0px"
89
126
  },
90
127
  onMouseDown: handleMouseDown,
91
- onMouseUp: handleMouseUp
128
+ onMouseUp: handleMouseUp,
129
+ onTouchStart: handleTouchStart,
130
+ onTouchEnd: handleTouchEnd
92
131
  }, children);
93
- }
132
+ };
@@ -25,6 +25,8 @@ var __assign = void 0 && (void 0).__assign || function () {
25
25
  };
26
26
  var FormulaHint = function FormulaHint(props) {
27
27
  var _a;
28
+ var showFormulaHint = props.showFormulaHint,
29
+ handleShowFormulaHint = props.handleShowFormulaHint;
28
30
  var dragHasMoved = (0, _react.useRef)(false);
29
31
  var context = (0, _react.useContext)(_context.default).context;
30
32
  var firstSelection = (_a = context.luckysheet_select_save) === null || _a === void 0 ? void 0 : _a[0];
@@ -117,12 +119,11 @@ var FormulaHint = function FormulaHint(props) {
117
119
  }, []);
118
120
  if (!fn) return null;
119
121
  return /*#__PURE__*/_react.default.createElement(_dragableDiv.DraggableDiv, {
120
- initialX: 50,
121
- initialY: 50,
122
- initialPos: top,
122
+ initialTop: top,
123
123
  dragHasMoved: dragHasMoved,
124
124
  className: "bg-secondary text-secondary-foreground p-4 rounded-lg flex items-center justify-center ".concat(showDelayedHint ? "opacity-100" : "opacity-0")
125
- }, props.showFormulaHint && (/*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("button", {
125
+ }, showFormulaHint && (/*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("button", {
126
+ type: "button",
126
127
  className: "flex items-center justify-center w-4 h-4 rounded-full",
127
128
  style: {
128
129
  backgroundColor: "black",
@@ -131,7 +132,8 @@ var FormulaHint = function FormulaHint(props) {
131
132
  left: "327px",
132
133
  top: "-8px"
133
134
  },
134
- onClick: props.handleShowFormulaHint
135
+ onClick: handleShowFormulaHint,
136
+ "aria-label": "Close formula hint"
135
137
  }, /*#__PURE__*/_react.default.createElement("svg", {
136
138
  xmlns: "http://www.w3.org/2000/svg",
137
139
  className: " text-white",
@@ -142,18 +144,18 @@ var FormulaHint = function FormulaHint(props) {
142
144
  fill: "none",
143
145
  viewBox: "0 0 24 24",
144
146
  stroke: "currentColor",
145
- "stroke-width": "3"
147
+ strokeWidth: "3"
146
148
  }, /*#__PURE__*/_react.default.createElement("path", {
147
- "stroke-linecap": "round",
148
- "stroke-linejoin": "round",
149
+ strokeLinecap: "round",
150
+ strokeLinejoin: "round",
149
151
  d: "M6 18L18 6M6 6l12 12"
150
152
  }))), /*#__PURE__*/_react.default.createElement("div", __assign({}, props, {
151
153
  ref: hintRef,
152
154
  id: "luckysheet-formula-help-c",
153
155
  className: "luckysheet-formula-help-c",
154
156
  style: {
155
- top: '0px',
156
- left: '0px',
157
+ top: "0px",
158
+ left: "0px",
157
159
  borderWidth: "1px",
158
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",
159
161
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
@@ -173,9 +175,9 @@ var FormulaHint = function FormulaHint(props) {
173
175
  className: "fa fa-angle-up",
174
176
  "aria-hidden": "true"
175
177
  })), /*#__PURE__*/_react.default.createElement("div", {
176
- onClick: function onClick(e) {
178
+ onClick: function onClick() {
177
179
  if (!dragHasMoved.current) {
178
- localStorage.setItem('formula-expand', "".concat(!showFunctionBody));
180
+ localStorage.setItem("formula-expand", "".concat(!showFunctionBody));
179
181
  setShouldShowFunctionBody(!showFunctionBody);
180
182
  }
181
183
  dragHasMoved.current = false;
@@ -391,7 +393,7 @@ var FormulaHint = function FormulaHint(props) {
391
393
  marginTop: "2px"
392
394
  }
393
395
  }, param.detail));
394
- }))))), showFunctionBody && /*#__PURE__*/_react.default.createElement("div", {
396
+ }))))), showFunctionBody && (/*#__PURE__*/_react.default.createElement("div", {
395
397
  style: {
396
398
  backgroundColor: "".concat(fn.BRAND_COLOR ? fn.BRAND_COLOR : "#F8F9FA"),
397
399
  padding: "8px",
@@ -405,6 +407,6 @@ var FormulaHint = function FormulaHint(props) {
405
407
  (_a = document.getElementById("function-button")) === null || _a === void 0 ? void 0 : _a.click();
406
408
  },
407
409
  className: "color-text-link cursor-pointer text-helper-text-sm"
408
- }, "Learn More"))))));
410
+ }, "Learn More")))))));
409
411
  };
410
412
  var _default = exports.default = FormulaHint;
@@ -1,5 +1,5 @@
1
- import React from 'react';
2
- import { LucideIconProps } from './LucideIcon';
1
+ import React from "react";
2
+ import { LucideIconProps } from "./LucideIcon";
3
3
  export declare const LucideIcons: {
4
4
  File3d: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
5
5
  FileWord: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
@@ -295,19 +295,19 @@ var LucideIcons = exports.LucideIcons = {
295
295
  xmlns: "http://www.w3.org/2000/svg"
296
296
  }), /*#__PURE__*/_react.default.createElement("path", {
297
297
  d: "M3.85005 5.6489C3.85005 5.14849 3.97654 4.84173 4.1361 4.67838C4.27776 4.53334 4.53891 4.40657 5.05457 4.47689C5.37378 4.52042 5.66784 4.29693 5.71137 3.97772C5.75489 3.65851 5.53141 3.36445 5.2122 3.32092C4.44452 3.21624 3.77233 3.38113 3.3015 3.86318C2.84855 4.32691 2.68338 4.98265 2.68338 5.6489V5.76556H1.63338C1.31122 5.76556 1.05005 6.02673 1.05005 6.34889C1.05005 6.67106 1.31122 6.93223 1.63338 6.93223H2.68338V8.0989C2.68338 8.55024 2.58164 8.78404 2.46408 8.90814C2.35232 9.0261 2.12709 9.1489 1.63338 9.1489C1.31122 9.1489 1.05005 9.41007 1.05005 9.73224C1.05005 10.0544 1.31122 10.3156 1.63338 10.3156C2.30635 10.3156 2.89778 10.1467 3.31102 9.71051C3.71846 9.28043 3.85005 8.69757 3.85005 8.0989V6.93223H4.95838C5.28055 6.93223 5.54172 6.67106 5.54172 6.34889C5.54172 6.02673 5.28055 5.76556 4.95838 5.76556H3.85005V5.6489Z",
298
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
298
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
299
299
  stroke: "transparent"
300
300
  }), /*#__PURE__*/_react.default.createElement("path", {
301
301
  d: "M11.0718 5.86947C11.2427 6.04033 11.2427 6.31734 11.0718 6.48819L10.0687 7.49133L11.0718 8.49447C11.2427 8.66533 11.2427 8.94234 11.0718 9.11319C10.901 9.28405 10.6239 9.28405 10.4531 9.11319L9.44995 8.11005L8.44681 9.11319C8.27596 9.28405 7.99895 9.28405 7.82809 9.11319C7.65724 8.94234 7.65724 8.66533 7.82809 8.49447L8.83123 7.49133L7.82809 6.48819C7.65724 6.31734 7.65724 6.04033 7.82809 5.86947C7.99895 5.69862 8.27596 5.69862 8.44681 5.86947L9.44995 6.87261L10.4531 5.86947C10.6239 5.69862 10.901 5.69862 11.0718 5.86947Z",
302
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
302
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
303
303
  stroke: "transparent"
304
304
  }), /*#__PURE__*/_react.default.createElement("path", {
305
305
  d: "M5.81055 7.49158C5.81055 6.7884 5.9531 6.09264 6.22822 5.47362L6.33691 5.24598C6.60497 4.72507 6.96821 4.27881 7.40674 3.94989C7.6232 3.78754 7.92999 3.83124 8.09238 4.04764C8.25473 4.2641 8.21103 4.57089 7.99463 4.73328C7.68835 4.963 7.41663 5.28939 7.2085 5.69373L7.12373 5.87215C6.90738 6.35898 6.79082 6.91786 6.79082 7.49158C6.79082 8.06531 6.90738 8.62419 7.12373 9.11102L7.2085 9.28944C7.38687 9.63597 7.61198 9.92509 7.86543 10.1453L7.99463 10.2499L8.06777 10.3169C8.21893 10.4874 8.23444 10.7461 8.09238 10.9355C7.95023 11.125 7.69755 11.1821 7.4915 11.0846L7.40674 11.0333L7.22354 10.8856C6.86643 10.5756 6.56672 10.1838 6.33691 9.73719L6.22822 9.50955C5.9531 8.89053 5.81055 8.19477 5.81055 7.49158Z",
306
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
306
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
307
307
  stroke: "transparent"
308
308
  }), /*#__PURE__*/_react.default.createElement("path", {
309
309
  d: "M13.0894 7.49096C13.0894 8.19414 12.9468 8.88991 12.6717 9.50893L12.563 9.73657C12.2949 10.2575 11.9317 10.7037 11.4932 11.0327C11.2767 11.195 10.9699 11.1513 10.8075 10.9349C10.6452 10.7184 10.6889 10.4117 10.9053 10.2493C11.2116 10.0195 11.4833 9.69316 11.6914 9.28881L11.7762 9.11039C11.9925 8.62356 12.1091 8.06469 12.1091 7.49096C12.1091 6.91723 11.9925 6.35836 11.7762 5.87153L11.6914 5.69311C11.513 5.34658 11.2879 5.05745 11.0345 4.83725L10.9053 4.73266L10.8321 4.66567C10.681 4.49514 10.6655 4.23642 10.8075 4.04701C10.9497 3.85759 11.2024 3.80043 11.4084 3.89799L11.4932 3.94926L11.6764 4.09692C12.0335 4.40694 12.3332 4.79877 12.563 5.24535L12.6717 5.47299C12.9468 6.09201 13.0894 6.78778 13.0894 7.49096Z",
310
- fill: (props === null || props === void 0 ? void 0 : props.fill) || '#77818A',
310
+ fill: (props === null || props === void 0 ? void 0 : props.fill) || "#77818A",
311
311
  stroke: "transparent"
312
312
  }));
313
313
  },
@@ -347,7 +347,7 @@ var InputBox = function InputBox() {
347
347
  }, [clearSearchItemActiveClass, context.luckysheetCellUpdate.length, selectActiveFormula, setContext, firstSelection]);
348
348
  var onChange = (0, _react.useCallback)(function (__, isBlur) {
349
349
  var _a;
350
- if ((_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.innerText.includes('=')) {
350
+ if ((_a = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _a === void 0 ? void 0 : _a.innerText.includes("=")) {
351
351
  setShowSearchHint(true);
352
352
  } else {
353
353
  setShowSearchHint(false);
@@ -500,7 +500,7 @@ var InputBox = function InputBox() {
500
500
  onKeyDown: onKeyDown,
501
501
  onPaste: onPaste,
502
502
  allowEdit: edit ? !isHidenRC : edit
503
- })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showSearchHint && /*#__PURE__*/_react.default.createElement(_FormulaSearch.default, {
503
+ })), (context.functionCandidates.length > 0 || context.functionHint || context.defaultCandidates.length > 0) && (/*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showSearchHint && (/*#__PURE__*/_react.default.createElement(_FormulaSearch.default, {
504
504
  onMouseMove: function onMouseMove(e) {
505
505
  if (document.getElementById("luckysheet-formula-search-c")) {
506
506
  var hoveredItem = e.target.closest(".luckysheet-formula-search-item");
@@ -513,10 +513,10 @@ var InputBox = function InputBox() {
513
513
  onMouseDown: function onMouseDown(e) {
514
514
  selectActiveFormulaOnClick(e);
515
515
  }
516
- }), 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, {
516
+ })), 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
517
  handleShowFormulaHint: handleShowFormulaHint,
518
518
  showFormulaHint: showFormulaHint
519
- }), !showFormulaHint && fn && (/*#__PURE__*/_react.default.createElement("div", {
519
+ })), !showFormulaHint && fn && (/*#__PURE__*/_react.default.createElement("div", {
520
520
  className: "luckysheet-hin absolute",
521
521
  style: {
522
522
  top: "1px",
@@ -537,8 +537,8 @@ var InputBox = function InputBox() {
537
537
  name: "DSheetTextDisabled",
538
538
  fill: "black",
539
539
  style: {
540
- width: '14px',
541
- height: '14px',
540
+ width: "14px",
541
+ height: "14px",
542
542
  margin: "auto",
543
543
  marginTop: "1px"
544
544
  }
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React from "react";
2
2
  export declare const UltimateIcons: {
3
3
  File3d: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
4
4
  FileWord: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
@@ -15,7 +15,7 @@ export declare const UltimateIcons: {
15
15
  Hey: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
16
16
  CloudSaved: ({ width, height, ...props }: LucideIconProps) => React.JSX.Element;
17
17
  };
18
- export type ButtonSize = 'sm' | 'md' | 'lg';
18
+ export type ButtonSize = "sm" | "md" | "lg";
19
19
  interface SvgProps extends React.SVGProps<SVGSVGElement> {
20
20
  fill?: string;
21
21
  stroke?: string;
@@ -28,7 +28,7 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
28
28
  }
29
29
  return t;
30
30
  };
31
- var UltimateIcons = exports.UltimateIcons = Object.assign({}, _Icon.LucideIcons);
31
+ var UltimateIcons = exports.UltimateIcons = __assign({}, _Icon.LucideIcons);
32
32
  var LucideIcon = exports.LucideIcon = /*#__PURE__*/(0, _react.forwardRef)(function (_a, ref) {
33
33
  var name = _a.name,
34
34
  className = _a.className,
@@ -37,7 +37,7 @@ var LucideIcon = exports.LucideIcon = /*#__PURE__*/(0, _react.forwardRef)(functi
37
37
  fill = _a.fill,
38
38
  stroke = _a.stroke,
39
39
  props = __rest(_a, ["name", "className", "strokeWidth", "size", "fill", "stroke"]);
40
- var buttonSize = size === 'sm' ? 'w-6 h-6' : size === 'lg' ? 'w-10 h-10' : 'w-8 h-8';
40
+ var buttonSize = size === "sm" ? "w-6 h-6" : size === "lg" ? "w-10 h-10" : "w-8 h-8";
41
41
  var IconComponent = UltimateIcons[name];
42
42
  if (!IconComponent) {
43
43
  return null;
@@ -47,8 +47,8 @@ var LucideIcon = exports.LucideIcon = /*#__PURE__*/(0, _react.forwardRef)(functi
47
47
  ref: ref,
48
48
  className: (0, _classnames.default)(buttonSize, className),
49
49
  strokeWidth: strokeWidth || 2,
50
- fill: fill || 'none',
51
- stroke: stroke || 'currentColor'
50
+ fill: fill || "none",
51
+ stroke: stroke || "currentColor"
52
52
  }, props));
53
53
  });
54
- LucideIcon.displayName = 'LucideIcon';
54
+ LucideIcon.displayName = "LucideIcon";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fileverse-dev/fortune-react",
3
- "version": "1.1.56",
3
+ "version": "1.1.57",
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.56",
19
+ "@fileverse-dev/fortune-core": "1.1.57",
20
20
  "@fileverse/ui": "^4.1.7-patch-21",
21
21
  "@tippyjs/react": "^4.2.6",
22
22
  "@types/regenerator-runtime": "^0.13.6",