@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 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: axis === "x" ? refs.scrollbarX : refs.scrollbarY,
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: axis === "x" ? refs.scrollbarX : refs.scrollbarY,
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 () {