@leankylin-sheet/react 4.0.16 → 4.0.18
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/dist/index.esm.js +11 -4
- package/dist/index.js +10 -3
- package/dist/index.umd.js +1183 -3
- package/dist/index.umd.min.js +2 -2
- package/package.json +3 -3
package/dist/index.esm.js
CHANGED
|
@@ -2,7 +2,7 @@ import { defaultContext, defaultSettings, getSheetIndex, colLocationByIndex, fix
|
|
|
2
2
|
import React, { useContext, useRef, useState, useMemo, useCallback, useEffect, useLayoutEffect, useImperativeHandle } from 'react';
|
|
3
3
|
import produce, { applyPatches, enablePatches, produceWithPatches } from 'immer';
|
|
4
4
|
import _ from 'lodash';
|
|
5
|
-
import { useMemoizedFn, useThrottleFn } from 'ahooks';
|
|
5
|
+
import { useInViewport, useMemoizedFn, useThrottleFn } from 'ahooks';
|
|
6
6
|
import { createPortal } from 'react-dom';
|
|
7
7
|
|
|
8
8
|
function _iterableToArrayLimit(r, l) {
|
|
@@ -1336,13 +1336,17 @@ var ScrollBar = function ScrollBar(_ref) {
|
|
|
1336
1336
|
context = _useContext.context,
|
|
1337
1337
|
refs = _useContext.refs,
|
|
1338
1338
|
setContext = _useContext.setContext;
|
|
1339
|
+
var ref = axis === "x" ? refs.scrollbarX : refs.scrollbarY;
|
|
1340
|
+
var _useInViewport = useInViewport(ref),
|
|
1341
|
+
_useInViewport2 = _slicedToArray(_useInViewport, 1),
|
|
1342
|
+
inViewport = _useInViewport2[0];
|
|
1339
1343
|
useEffect(function () {
|
|
1340
1344
|
if (axis === "x") {
|
|
1341
1345
|
refs.scrollbarX.current.scrollLeft = context.scrollLeft;
|
|
1342
1346
|
} else {
|
|
1343
1347
|
refs.scrollbarY.current.scrollTop = context.scrollTop;
|
|
1344
1348
|
}
|
|
1345
|
-
}, [axis === "x" ? context.scrollLeft : context.scrollTop]);
|
|
1349
|
+
}, [axis === "x" ? context.scrollLeft : context.scrollTop, inViewport]);
|
|
1346
1350
|
var getHidden = function getHidden() {
|
|
1347
1351
|
var _refs$scrollbarY$curr;
|
|
1348
1352
|
if (axis === "x") {
|
|
@@ -1352,7 +1356,7 @@ var ScrollBar = function ScrollBar(_ref) {
|
|
|
1352
1356
|
};
|
|
1353
1357
|
var hidden = getHidden();
|
|
1354
1358
|
return /*#__PURE__*/React.createElement("div", {
|
|
1355
|
-
ref:
|
|
1359
|
+
ref: ref,
|
|
1356
1360
|
style: axis === "x" ? {
|
|
1357
1361
|
left: context.rowHeaderWidth,
|
|
1358
1362
|
width: "calc(100% - ".concat(context.rowHeaderWidth, "px)"),
|
|
@@ -3591,6 +3595,9 @@ var SheetOverlay = function SheetOverlay() {
|
|
|
3591
3595
|
setContext = _useContext.setContext,
|
|
3592
3596
|
settings = _useContext.settings,
|
|
3593
3597
|
refs = _useContext.refs;
|
|
3598
|
+
var _useInViewport = useInViewport(refs.cellArea),
|
|
3599
|
+
_useInViewport2 = _slicedToArray(_useInViewport, 1),
|
|
3600
|
+
inViewport = _useInViewport2[0];
|
|
3594
3601
|
var _useDialog = useDialog(),
|
|
3595
3602
|
showDialog = _useDialog.showDialog;
|
|
3596
3603
|
var containerRef = useRef(null);
|
|
@@ -3736,7 +3743,7 @@ var SheetOverlay = function SheetOverlay() {
|
|
|
3736
3743
|
useEffect(function () {
|
|
3737
3744
|
refs.cellArea.current.scrollLeft = context.scrollLeft;
|
|
3738
3745
|
refs.cellArea.current.scrollTop = context.scrollTop;
|
|
3739
|
-
}, [context.scrollLeft, context.scrollTop, refs.cellArea, (_refs$cellArea$curren = refs.cellArea.current) === null || _refs$cellArea$curren === void 0 ? void 0 : _refs$cellArea$curren.scrollLeft, (_refs$cellArea$curren2 = refs.cellArea.current) === null || _refs$cellArea$curren2 === void 0 ? void 0 : _refs$cellArea$curren2.scrollTop]);
|
|
3746
|
+
}, [context.scrollLeft, context.scrollTop, refs.cellArea, (_refs$cellArea$curren = refs.cellArea.current) === null || _refs$cellArea$curren === void 0 ? void 0 : _refs$cellArea$curren.scrollLeft, (_refs$cellArea$curren2 = refs.cellArea.current) === null || _refs$cellArea$curren2 === void 0 ? void 0 : _refs$cellArea$curren2.scrollTop, inViewport]);
|
|
3740
3747
|
useEffect(function () {
|
|
3741
3748
|
document.addEventListener("mousemove", onMouseMove);
|
|
3742
3749
|
return function () {
|
package/dist/index.js
CHANGED
|
@@ -1346,13 +1346,17 @@ var ScrollBar = function ScrollBar(_ref) {
|
|
|
1346
1346
|
context = _useContext.context,
|
|
1347
1347
|
refs = _useContext.refs,
|
|
1348
1348
|
setContext = _useContext.setContext;
|
|
1349
|
+
var ref = axis === "x" ? refs.scrollbarX : refs.scrollbarY;
|
|
1350
|
+
var _useInViewport = ahooks.useInViewport(ref),
|
|
1351
|
+
_useInViewport2 = _slicedToArray(_useInViewport, 1),
|
|
1352
|
+
inViewport = _useInViewport2[0];
|
|
1349
1353
|
React.useEffect(function () {
|
|
1350
1354
|
if (axis === "x") {
|
|
1351
1355
|
refs.scrollbarX.current.scrollLeft = context.scrollLeft;
|
|
1352
1356
|
} else {
|
|
1353
1357
|
refs.scrollbarY.current.scrollTop = context.scrollTop;
|
|
1354
1358
|
}
|
|
1355
|
-
}, [axis === "x" ? context.scrollLeft : context.scrollTop]);
|
|
1359
|
+
}, [axis === "x" ? context.scrollLeft : context.scrollTop, inViewport]);
|
|
1356
1360
|
var getHidden = function getHidden() {
|
|
1357
1361
|
var _refs$scrollbarY$curr;
|
|
1358
1362
|
if (axis === "x") {
|
|
@@ -1362,7 +1366,7 @@ var ScrollBar = function ScrollBar(_ref) {
|
|
|
1362
1366
|
};
|
|
1363
1367
|
var hidden = getHidden();
|
|
1364
1368
|
return /*#__PURE__*/React__default['default'].createElement("div", {
|
|
1365
|
-
ref:
|
|
1369
|
+
ref: ref,
|
|
1366
1370
|
style: axis === "x" ? {
|
|
1367
1371
|
left: context.rowHeaderWidth,
|
|
1368
1372
|
width: "calc(100% - ".concat(context.rowHeaderWidth, "px)"),
|
|
@@ -3601,6 +3605,9 @@ var SheetOverlay = function SheetOverlay() {
|
|
|
3601
3605
|
setContext = _useContext.setContext,
|
|
3602
3606
|
settings = _useContext.settings,
|
|
3603
3607
|
refs = _useContext.refs;
|
|
3608
|
+
var _useInViewport = ahooks.useInViewport(refs.cellArea),
|
|
3609
|
+
_useInViewport2 = _slicedToArray(_useInViewport, 1),
|
|
3610
|
+
inViewport = _useInViewport2[0];
|
|
3604
3611
|
var _useDialog = useDialog(),
|
|
3605
3612
|
showDialog = _useDialog.showDialog;
|
|
3606
3613
|
var containerRef = React.useRef(null);
|
|
@@ -3746,7 +3753,7 @@ var SheetOverlay = function SheetOverlay() {
|
|
|
3746
3753
|
React.useEffect(function () {
|
|
3747
3754
|
refs.cellArea.current.scrollLeft = context.scrollLeft;
|
|
3748
3755
|
refs.cellArea.current.scrollTop = context.scrollTop;
|
|
3749
|
-
}, [context.scrollLeft, context.scrollTop, refs.cellArea, (_refs$cellArea$curren = refs.cellArea.current) === null || _refs$cellArea$curren === void 0 ? void 0 : _refs$cellArea$curren.scrollLeft, (_refs$cellArea$curren2 = refs.cellArea.current) === null || _refs$cellArea$curren2 === void 0 ? void 0 : _refs$cellArea$curren2.scrollTop]);
|
|
3756
|
+
}, [context.scrollLeft, context.scrollTop, refs.cellArea, (_refs$cellArea$curren = refs.cellArea.current) === null || _refs$cellArea$curren === void 0 ? void 0 : _refs$cellArea$curren.scrollLeft, (_refs$cellArea$curren2 = refs.cellArea.current) === null || _refs$cellArea$curren2 === void 0 ? void 0 : _refs$cellArea$curren2.scrollTop, inViewport]);
|
|
3750
3757
|
React.useEffect(function () {
|
|
3751
3758
|
document.addEventListener("mousemove", onMouseMove);
|
|
3752
3759
|
return function () {
|