"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.VirtualList = void 0;
const tslib_1 = require("tslib");
const react_1 = tslib_1.__importStar(require("react"));
const react_virtuoso_1 = require("react-virtuoso");
const scrollbars_1 = require("../scrollbars");
const VirtualList = ({ data, className, template: ItemTemplate, refSetter, onRangeChanged, }) => {
    const virtuoso = (0, react_1.useRef)(null);
    (0, react_1.useEffect)(() => {
        refSetter === null || refSetter === void 0 ? void 0 : refSetter(virtuoso.current);
    }, [virtuoso.current]);
    return (
    // 暂时还无法应用这个 Scrollbars 上下边界样式（阴影效果）
    // 因为 Virtuoso 的 scroll 事件没有传给 Scrollbars
    // 此处用于展示虚拟的滑动条而不是浏览器绘制的滑动条
    react_1.default.createElement(scrollbars_1.Scrollbars, { thumbSize: 0 },
        react_1.default.createElement(react_virtuoso_1.Virtuoso, { rangeChanged: (range) => {
                onRangeChanged === null || onRangeChanged === void 0 ? void 0 : onRangeChanged(range);
            }, overscan: 20, ref: virtuoso, style: { height: '100%' }, className: className, data: data, itemContent: (i, d) => react_1.default.createElement(ItemTemplate, { index: i, data: d }) })));
};
exports.VirtualList = VirtualList;
//# sourceMappingURL=index.js.map