tdesign-react/cjs/tree/hooks/useTreeVirtualScroll.js

TDesign Component for React

/**
 * tdesign v1.13.2
 * (c) 2025 tdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var hooks_useVirtualScroll = require('../../hooks/useVirtualScroll.js');
var hooks_useEventCallback = require('../../hooks/useEventCallback.js');
require('../../_chunks/dep-e17e2d31.js');
require('../../_chunks/dep-b7d577ac.js');
require('../../hooks/useResizeObserver.js');
require('../../hooks/useLayoutEffect.js');
require('../../_chunks/dep-3f65dfe7.js');
require('../../_chunks/dep-3e2d2665.js');
require('../../_chunks/dep-f0379c5f.js');
require('../../_chunks/dep-6d4d8660.js');
require('../../_chunks/dep-028b759d.js');
require('../../_chunks/dep-ddacd27a.js');
require('../../hooks/useLatest.js');
require('../../_util/noop.js');

function useTreeVirtualScroll(_ref) {
  var treeRef = _ref.treeRef,
    scroll = _ref.scroll,
    _ref$data = _ref.data,
    data = _ref$data === void 0 ? [] : _ref$data,
    onScroll = _ref.onScroll;
  var scrollThreshold = (scroll === null || scroll === void 0 ? void 0 : scroll.threshold) || 100;
  var scrollType = scroll === null || scroll === void 0 ? void 0 : scroll.type;
  var isVirtual = React.useMemo(function () {
    return scrollType === "virtual" && (data === null || data === void 0 ? void 0 : data.length) > scrollThreshold;
  }, [scrollType, scrollThreshold, data]);
  var scrollParams = React.useMemo(function () {
    return {
      type: "virtual",
      isFixedRowHeight: (scroll === null || scroll === void 0 ? void 0 : scroll.isFixedRowHeight) || false,
      rowHeight: (scroll === null || scroll === void 0 ? void 0 : scroll.rowHeight) || 34,
      bufferSize: (scroll === null || scroll === void 0 ? void 0 : scroll.bufferSize) || 20,
      threshold: scrollThreshold
    };
  }, [scroll, scrollThreshold]);
  var _useVirtualScroll = hooks_useVirtualScroll["default"](treeRef, {
      data: data || [],
      scroll: scrollParams
    }),
    _useVirtualScroll$vis = _useVirtualScroll.visibleData,
    visibleData = _useVirtualScroll$vis === void 0 ? null : _useVirtualScroll$vis,
    _useVirtualScroll$han = _useVirtualScroll.handleScroll,
    handleVirtualScroll = _useVirtualScroll$han === void 0 ? null : _useVirtualScroll$han,
    _useVirtualScroll$scr = _useVirtualScroll.scrollHeight,
    scrollHeight = _useVirtualScroll$scr === void 0 ? null : _useVirtualScroll$scr,
    _useVirtualScroll$tra = _useVirtualScroll.translateY,
    translateY = _useVirtualScroll$tra === void 0 ? null : _useVirtualScroll$tra,
    _useVirtualScroll$han2 = _useVirtualScroll.handleRowMounted,
    handleRowMounted = _useVirtualScroll$han2 === void 0 ? null : _useVirtualScroll$han2,
    scrollToElement = _useVirtualScroll.scrollToElement;
  var lastScrollY = -1;
  var onInnerVirtualScroll = hooks_useEventCallback["default"](function (e) {
    onScroll === null || onScroll === void 0 || onScroll({
      e: e
    });
    if (!isVirtual) {
      return;
    }
    var target = e.target;
    var top = target.scrollTop;
    if (lastScrollY !== top) {
      handleVirtualScroll();
    } else {
      lastScrollY = -1;
    }
    lastScrollY = top;
  });
  React.useEffect(function () {
    var _treeList$addEventLis;
    var treeList = treeRef === null || treeRef === void 0 ? void 0 : treeRef.current;
    treeList === null || treeList === void 0 || (_treeList$addEventLis = treeList.addEventListener) === null || _treeList$addEventLis === void 0 || _treeList$addEventLis.call(treeList, "scroll", onInnerVirtualScroll);
    return function () {
      var _treeList$removeEvent;
      treeList === null || treeList === void 0 || (_treeList$removeEvent = treeList.removeEventListener) === null || _treeList$removeEvent === void 0 || _treeList$removeEvent.call(treeList, "scroll", onInnerVirtualScroll);
    };
  }, [treeRef, onInnerVirtualScroll]);
  var cursorStyle = {
    position: "absolute",
    width: "1px",
    height: "1px",
    transition: "transform 0.2s",
    transform: "translate(0, ".concat(scrollHeight, "px)"),
    MsTransform: "translate(0, ".concat(scrollHeight, "px)"),
    MozTransform: "translate(0, ".concat(scrollHeight, "px)"),
    WebkitTransform: "translate(0, ".concat(scrollHeight, "px)")
  };
  var treeNodeStyle = {
    transform: "translate(0, ".concat(translateY, "px)"),
    MsTransform: "translate(0, ".concat(translateY, "px)"),
    MozTransform: "translate(0, ".concat(translateY, "px)"),
    WebkitTransform: "translate(0, ".concat(translateY, "px)")
  };
  return {
    scrollHeight: scrollHeight,
    translateY: translateY,
    visibleData: visibleData,
    handleRowMounted: handleRowMounted,
    isVirtual: isVirtual,
    cursorStyle: cursorStyle,
    treeNodeStyle: treeNodeStyle,
    scrollToElement: scrollToElement
  };
}

exports["default"] = useTreeVirtualScroll;
//# sourceMappingURL=useTreeVirtualScroll.js.map