@fileverse-dev/fortune-react 1.2.96-maitra-feb6-patch-1 → 1.2.96-scroll-1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/es/components/NotationBoxes/index.js +2 -2
  2. package/es/components/Sheet/use-smooth-scroll.js +91 -0
  3. package/es/components/SheetOverlay/InputBox.js +2 -0
  4. package/es/components/Toolbar/index.js +2 -2
  5. package/lib/components/NotationBoxes/index.js +2 -2
  6. package/lib/components/Sheet/use-smooth-scroll.js +91 -0
  7. package/lib/components/SheetOverlay/InputBox.js +2 -0
  8. package/lib/components/Toolbar/index.js +2 -2
  9. package/package.json +2 -2
package/es/components/NotationBoxes/index.js CHANGED
@@ -74,7 +74,7 @@ var NotationBoxes = function NotationBoxes() {
74
74
  position: "absolute",
75
75
  left: size.left,
76
76
  top: size.top,
77
- zIndex: 400,
77
+ zIndex: 100,
78
78
  pointerEvents: "none"
79
79
  }
80
80
  }), /*#__PURE__*/React.createElement("div", {
@@ -83,7 +83,7 @@ var NotationBoxes = function NotationBoxes() {
83
83
  position: "absolute",
84
84
  left: left,
85
85
  top: top,
86
- zIndex: isEditing ? 500 : 400,
86
+ zIndex: isEditing ? 200 : 100,
87
87
  boxShadow: "0 1px 1px #0000002e,0 4px 8px #0000001a"
88
88
  },
89
89
  onMouseDown: function onMouseDown(e) {
package/es/components/Sheet/use-smooth-scroll.js CHANGED
@@ -62,6 +62,90 @@ export var useSmoothScroll = function useSmoothScroll(scrollContainerRef) {
62
62
  }
63
63
  };
64
64
  }
65
+ function handleMouseDragScroll(containerEl, scrollHandler, getPixelScale) {
66
+ if (context.luckysheetCellUpdate.length > 0) {
67
+ stopAutoScroll();
68
+ return;
69
+ }
70
+ var isDragging = false;
71
+ var startY = 0;
72
+ var lastY = 0;
73
+ var velocityY = 0;
74
+ var autoScrollAnimationId = 0;
75
+ var lastMoveTime = 0;
76
+ var VELOCITY_SMOOTHING = 0.3;
77
+ var MIN_DRAG_THRESHOLD = 5;
78
+ var ACCELERATION_FACTOR = 1.02;
79
+ var MAX_VELOCITY = 50;
80
+ function stopAutoScroll() {
81
+ if (autoScrollAnimationId) {
82
+ cancelAnimationFrame(autoScrollAnimationId);
83
+ autoScrollAnimationId = 0;
84
+ }
85
+ velocityY = 0;
86
+ }
87
+ function autoScroll() {
88
+ if (!isDragging) {
89
+ stopAutoScroll();
90
+ return;
91
+ }
92
+ if (Math.abs(velocityY) > 0.1) {
93
+ velocityY *= ACCELERATION_FACTOR;
94
+ velocityY = Math.max(-MAX_VELOCITY, Math.min(MAX_VELOCITY, velocityY));
95
+ }
96
+ var scale = getPixelScale();
97
+ scrollHandler(0, velocityY * scale);
98
+ autoScrollAnimationId = requestAnimationFrame(autoScroll);
99
+ }
100
+ function onMouseDown(e) {
101
+ if (e.button !== 0) return;
102
+ var target = e.target;
103
+ if (target.tagName === 'INPUT' || target.tagName === 'BUTTON' || target.tagName === 'SELECT' || target.tagName === 'TEXTAREA' || target.closest('button') || target.closest('input')) {
104
+ return;
105
+ }
106
+ isDragging = true;
107
+ startY = e.clientY;
108
+ lastY = e.clientY;
109
+ lastMoveTime = performance.now();
110
+ velocityY = 0;
111
+ containerEl.style.cursor = 'grabbing';
112
+ e.preventDefault();
113
+ }
114
+ function onMouseMove(e) {
115
+ if (!isDragging) return;
116
+ var currentTime = performance.now();
117
+ var deltaTime = Math.max(1, currentTime - lastMoveTime);
118
+ var deltaY = e.clientY - lastY;
119
+ var totalMovedY = Math.abs(e.clientY - startY);
120
+ if (totalMovedY > MIN_DRAG_THRESHOLD) {
121
+ if (Math.abs(deltaY) > 0.1) {
122
+ var instantVelocityY = deltaY / deltaTime * 16;
123
+ velocityY = velocityY * (1 - VELOCITY_SMOOTHING) + instantVelocityY * VELOCITY_SMOOTHING;
124
+ }
125
+ if (!autoScrollAnimationId) {
126
+ autoScrollAnimationId = requestAnimationFrame(autoScroll);
127
+ }
128
+ }
129
+ lastY = e.clientY;
130
+ lastMoveTime = currentTime;
131
+ e.preventDefault();
132
+ }
133
+ function onMouseUp(e) {
134
+ if (!isDragging) return;
135
+ isDragging = false;
136
+ stopAutoScroll();
137
+ containerEl.style.cursor = '';
138
+ }
139
+ containerEl.addEventListener("mousedown", onMouseDown);
140
+ window.addEventListener("mousemove", onMouseMove);
141
+ window.addEventListener("mouseup", onMouseUp);
142
+ return function () {
143
+ stopAutoScroll();
144
+ containerEl.removeEventListener("mousedown", onMouseDown);
145
+ window.removeEventListener("mousemove", onMouseMove);
146
+ window.removeEventListener("mouseup", onMouseUp);
147
+ };
148
+ }
65
149
  function handleMobileScroll(containerEl, scrollHandler, getPixelScale) {
66
150
  var isScrolling = false;
67
151
  var gestureStartClientX = 0;
@@ -210,9 +294,16 @@ export var useSmoothScroll = function useSmoothScroll(scrollContainerRef) {
210
294
  var unmountMobileScrollHandler = handleMobileScroll(scrollContainerEl, scrollHandler, function () {
211
295
  return (window.devicePixelRatio || 1) * context.zoomRatio;
212
296
  });
297
+ var unmountMouseDragHandler;
298
+ if (context.luckysheetCellUpdate.length === 0) {
299
+ unmountMouseDragHandler = handleMouseDragScroll(scrollContainerEl, scrollHandler, function () {
300
+ return (window.devicePixelRatio || 1) * context.zoomRatio;
301
+ });
302
+ }
213
303
  return function () {
214
304
  unmountScrollHandler();
215
305
  unmountMobileScrollHandler();
306
+ unmountMouseDragHandler === null || unmountMouseDragHandler === void 0 ? void 0 : unmountMouseDragHandler();
216
307
  };
217
308
  }
218
309
  useEffect(function () {
package/es/components/SheetOverlay/InputBox.js CHANGED
@@ -156,7 +156,9 @@ var InputBox = function InputBox() {
156
156
  delete refs.globalCache.doNotFocus;
157
157
  }
158
158
  }, [context.luckysheetCellUpdate, context.luckysheetfile, context.currentSheetId, firstSelection]);
159
+ var previousLuckyCellUpdate = usePrevious(context.luckysheetCellUpdate);
159
160
  useEffect(function () {
161
+ console.log("inputbox luckysheetCellUpdate changed", previousLuckyCellUpdate, context.luckysheetCellUpdate);
160
162
  if (_.isEmpty(context.luckysheetCellUpdate)) {
161
163
  if (inputRef.current) {
162
164
  inputRef.current.innerHTML = "";
package/es/components/Toolbar/index.js CHANGED
@@ -475,7 +475,7 @@ var Toolbar = function Toolbar(_a) {
475
475
  var _j = useState(false),
476
476
  showDuneModal = _j[0],
477
477
  setShowDuneModal = _j[1];
478
- var _k = useState(window.innerWidth >= 1480),
478
+ var _k = useState(window.innerWidth >= 1280),
479
479
  isDesktop = _k[0],
480
480
  setIsDesktop = _k[1];
481
481
  var _l = useDialog(),
@@ -543,7 +543,7 @@ var Toolbar = function Toolbar(_a) {
543
543
  }, []);
544
544
  useEffect(function () {
545
545
  var handleResize = function handleResize() {
546
- setIsDesktop(window.innerWidth >= 1480);
546
+ setIsDesktop(window.innerWidth >= 1280);
547
547
  };
548
548
  window.addEventListener("resize", handleResize);
549
549
  return function () {
package/lib/components/NotationBoxes/index.js CHANGED
@@ -83,7 +83,7 @@ var NotationBoxes = function NotationBoxes() {
83
83
  position: "absolute",
84
84
  left: size.left,
85
85
  top: size.top,
86
- zIndex: 400,
86
+ zIndex: 100,
87
87
  pointerEvents: "none"
88
88
  }
89
89
  }), /*#__PURE__*/_react.default.createElement("div", {
@@ -92,7 +92,7 @@ var NotationBoxes = function NotationBoxes() {
92
92
  position: "absolute",
93
93
  left: left,
94
94
  top: top,
95
- zIndex: isEditing ? 500 : 400,
95
+ zIndex: isEditing ? 200 : 100,
96
96
  boxShadow: "0 1px 1px #0000002e,0 4px 8px #0000001a"
97
97
  },
98
98
  onMouseDown: function onMouseDown(e) {
package/lib/components/Sheet/use-smooth-scroll.js CHANGED
@@ -69,6 +69,90 @@ var useSmoothScroll = exports.useSmoothScroll = function useSmoothScroll(scrollC
69
69
  }
70
70
  };
71
71
  }
72
+ function handleMouseDragScroll(containerEl, scrollHandler, getPixelScale) {
73
+ if (context.luckysheetCellUpdate.length > 0) {
74
+ stopAutoScroll();
75
+ return;
76
+ }
77
+ var isDragging = false;
78
+ var startY = 0;
79
+ var lastY = 0;
80
+ var velocityY = 0;
81
+ var autoScrollAnimationId = 0;
82
+ var lastMoveTime = 0;
83
+ var VELOCITY_SMOOTHING = 0.3;
84
+ var MIN_DRAG_THRESHOLD = 5;
85
+ var ACCELERATION_FACTOR = 1.02;
86
+ var MAX_VELOCITY = 50;
87
+ function stopAutoScroll() {
88
+ if (autoScrollAnimationId) {
89
+ cancelAnimationFrame(autoScrollAnimationId);
90
+ autoScrollAnimationId = 0;
91
+ }
92
+ velocityY = 0;
93
+ }
94
+ function autoScroll() {
95
+ if (!isDragging) {
96
+ stopAutoScroll();
97
+ return;
98
+ }
99
+ if (Math.abs(velocityY) > 0.1) {
100
+ velocityY *= ACCELERATION_FACTOR;
101
+ velocityY = Math.max(-MAX_VELOCITY, Math.min(MAX_VELOCITY, velocityY));
102
+ }
103
+ var scale = getPixelScale();
104
+ scrollHandler(0, velocityY * scale);
105
+ autoScrollAnimationId = requestAnimationFrame(autoScroll);
106
+ }
107
+ function onMouseDown(e) {
108
+ if (e.button !== 0) return;
109
+ var target = e.target;
110
+ if (target.tagName === 'INPUT' || target.tagName === 'BUTTON' || target.tagName === 'SELECT' || target.tagName === 'TEXTAREA' || target.closest('button') || target.closest('input')) {
111
+ return;
112
+ }
113
+ isDragging = true;
114
+ startY = e.clientY;
115
+ lastY = e.clientY;
116
+ lastMoveTime = performance.now();
117
+ velocityY = 0;
118
+ containerEl.style.cursor = 'grabbing';
119
+ e.preventDefault();
120
+ }
121
+ function onMouseMove(e) {
122
+ if (!isDragging) return;
123
+ var currentTime = performance.now();
124
+ var deltaTime = Math.max(1, currentTime - lastMoveTime);
125
+ var deltaY = e.clientY - lastY;
126
+ var totalMovedY = Math.abs(e.clientY - startY);
127
+ if (totalMovedY > MIN_DRAG_THRESHOLD) {
128
+ if (Math.abs(deltaY) > 0.1) {
129
+ var instantVelocityY = deltaY / deltaTime * 16;
130
+ velocityY = velocityY * (1 - VELOCITY_SMOOTHING) + instantVelocityY * VELOCITY_SMOOTHING;
131
+ }
132
+ if (!autoScrollAnimationId) {
133
+ autoScrollAnimationId = requestAnimationFrame(autoScroll);
134
+ }
135
+ }
136
+ lastY = e.clientY;
137
+ lastMoveTime = currentTime;
138
+ e.preventDefault();
139
+ }
140
+ function onMouseUp(e) {
141
+ if (!isDragging) return;
142
+ isDragging = false;
143
+ stopAutoScroll();
144
+ containerEl.style.cursor = '';
145
+ }
146
+ containerEl.addEventListener("mousedown", onMouseDown);
147
+ window.addEventListener("mousemove", onMouseMove);
148
+ window.addEventListener("mouseup", onMouseUp);
149
+ return function () {
150
+ stopAutoScroll();
151
+ containerEl.removeEventListener("mousedown", onMouseDown);
152
+ window.removeEventListener("mousemove", onMouseMove);
153
+ window.removeEventListener("mouseup", onMouseUp);
154
+ };
155
+ }
72
156
  function handleMobileScroll(containerEl, scrollHandler, getPixelScale) {
73
157
  var isScrolling = false;
74
158
  var gestureStartClientX = 0;
@@ -217,9 +301,16 @@ var useSmoothScroll = exports.useSmoothScroll = function useSmoothScroll(scrollC
217
301
  var unmountMobileScrollHandler = handleMobileScroll(scrollContainerEl, scrollHandler, function () {
218
302
  return (window.devicePixelRatio || 1) * context.zoomRatio;
219
303
  });
304
+ var unmountMouseDragHandler;
305
+ if (context.luckysheetCellUpdate.length === 0) {
306
+ unmountMouseDragHandler = handleMouseDragScroll(scrollContainerEl, scrollHandler, function () {
307
+ return (window.devicePixelRatio || 1) * context.zoomRatio;
308
+ });
309
+ }
220
310
  return function () {
221
311
  unmountScrollHandler();
222
312
  unmountMobileScrollHandler();
313
+ unmountMouseDragHandler === null || unmountMouseDragHandler === void 0 ? void 0 : unmountMouseDragHandler();
223
314
  };
224
315
  }
225
316
  (0, _react.useEffect)(function () {
package/lib/components/SheetOverlay/InputBox.js CHANGED
@@ -165,7 +165,9 @@ var InputBox = function InputBox() {
165
165
  delete refs.globalCache.doNotFocus;
166
166
  }
167
167
  }, [context.luckysheetCellUpdate, context.luckysheetfile, context.currentSheetId, firstSelection]);
168
+ var previousLuckyCellUpdate = (0, _usePrevious.default)(context.luckysheetCellUpdate);
168
169
  (0, _react.useEffect)(function () {
170
+ console.log("inputbox luckysheetCellUpdate changed", previousLuckyCellUpdate, context.luckysheetCellUpdate);
169
171
  if (_lodash.default.isEmpty(context.luckysheetCellUpdate)) {
170
172
  if (inputRef.current) {
171
173
  inputRef.current.innerHTML = "";
package/lib/components/Toolbar/index.js CHANGED
@@ -484,7 +484,7 @@ var Toolbar = function Toolbar(_a) {
484
484
  var _j = (0, _react.useState)(false),
485
485
  showDuneModal = _j[0],
486
486
  setShowDuneModal = _j[1];
487
- var _k = (0, _react.useState)(window.innerWidth >= 1480),
487
+ var _k = (0, _react.useState)(window.innerWidth >= 1280),
488
488
  isDesktop = _k[0],
489
489
  setIsDesktop = _k[1];
490
490
  var _l = (0, _useDialog.useDialog)(),
@@ -552,7 +552,7 @@ var Toolbar = function Toolbar(_a) {
552
552
  }, []);
553
553
  (0, _react.useEffect)(function () {
554
554
  var handleResize = function handleResize() {
555
- setIsDesktop(window.innerWidth >= 1480);
555
+ setIsDesktop(window.innerWidth >= 1280);
556
556
  };
557
557
  window.addEventListener("resize", handleResize);
558
558
  return function () {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fileverse-dev/fortune-react",
3
- "version": "1.2.96-maitra-feb6-patch-1",
3
+ "version": "1.2.96-scroll-1",
4
4
  "main": "lib/index.js",
5
5
  "types": "lib/index.d.ts",
6
6
  "module": "es/index.js",
@@ -16,7 +16,7 @@
16
16
  "tsc": "tsc"
17
17
  },
18
18
  "dependencies": {
19
- "@fileverse-dev/fortune-core": "1.2.96-maitra-feb6-patch-1",
19
+ "@fileverse-dev/fortune-core": "1.2.96-scroll",
20
20
  "@fileverse/ui": "5.0.0",
21
21
  "@tippyjs/react": "^4.2.6",
22
22
  "@types/regenerator-runtime": "^0.13.6",