@uimkit/uikit-react/dist/esm/components/UIMomentList/UIMomentList.js

<img style="width:64px" src="https://mgmt.uimkit.chat/media/img/avatar.png"/>

import { __assign } from 'tslib';
import React__default, { useMemo, useRef, useCallback } from 'react';
import { Virtuoso } from '../../node_modules/.pnpm/react-virtuoso@4.1.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-virtuoso/dist/index.mjs.js';
import { useMomentList } from './hooks/useMomentList.js';
import '../../types/models.js';
import '../../types/events.js';
import { EmptyStateIndicator } from '../EmptyStateIndicator/EmptyStateIndicator.js';
import '../Loading/LoadingErrorIndicator.js';
import { LoadingIndicator } from '../Loading/LoadingIndicator.js';
import '../UIMoment/UIMomentContext.js';
import '../UIMoment/hooks/MomentContext.js';
import { UIMoment } from '../UIMoment/UIMoment.js';
import '../UIMoment/UIMomentDefault.js';

var UIMomentListWithContext = function (props) {
    var propMoment = props.Moment; props.additionalVirtuosoProps; var defaultItemHeight = props.defaultItemHeight, scrollSeekPlaceHolder = props.scrollSeekPlaceHolder, moments = props.moments, loadingMore = props.loadingMore, hasMore = props.hasMore, loadMore = props.loadMore, head = props.head;
    var MomentUIComponent = propMoment || UIMoment;
    var processedMoments = useMemo(function () {
        if (typeof moments === 'undefined') {
            return [];
        }
        return moments;
    }, [moments]);
    var virtuoso = useRef(null);
    var endReached = function () {
        if (hasMore && loadMore) {
            loadMore();
        }
    };
    var virtuosoComponents = useMemo(function () {
        var EmptyPlaceholder = function () { return (React__default.createElement(React__default.Fragment, null, EmptyStateIndicator && (React__default.createElement(EmptyStateIndicator, { listType: 'moment' })))); };
        var Header = function () { return head !== null && head !== void 0 ? head : null; };
        var Footer = function () {
            return loadingMore ? (React__default.createElement("div", { className: 'str-chat__virtual-list__loading' },
                React__default.createElement(LoadingIndicator, { size: 20 }))) : (null);
        };
        return {
            EmptyPlaceholder: EmptyPlaceholder,
            Footer: Footer,
            Header: Header,
        };
    }, [loadingMore, head]);
    var momentRenderer = useCallback(function (moment, index) {
        return (React__default.createElement(MomentUIComponent, { moment: moment }));
    }, []);
    function fractionalItemSize(element) {
        return element.getBoundingClientRect().height;
    }
    return (React__default.createElement("div", { className: "uim-moment-list" },
        React__default.createElement(Virtuoso, __assign({ data: processedMoments, atBottomThreshold: 200, className: "uim-moment-list-scroll", components: virtuosoComponents, computeItemKey: function (index) {
                return processedMoments[index].id;
            }, endReached: endReached, itemContent: function (i, data) { return momentRenderer(data, i); }, itemSize: fractionalItemSize, ref: virtuoso, style: { overflowX: 'hidden' }, totalCount: processedMoments.length }, (scrollSeekPlaceHolder ? { scrollSeek: scrollSeekPlaceHolder } : {}), (defaultItemHeight ? { defaultItemHeight: defaultItemHeight } : {})))));
};
var UIMomentList = function (props) {
    var profile = props.profile;
    var _a = useMomentList(profile === null || profile === void 0 ? void 0 : profile.id), loading = _a.loading, loadMore = _a.loadMore, hasMore = _a.hasMore, moments = _a.moments;
    return (React__default.createElement(UIMomentListWithContext, __assign({ hasMore: hasMore, loadMore: loadMore, loadingMore: loading, moments: moments }, props)));
};

export { UIMomentList };
//# sourceMappingURL=UIMomentList.js.map