@uimkit/uikit-react
Version:
<img style="width:64px" src="https://mgmt.uimkit.chat/media/img/avatar.png"/>
70 lines (63 loc) • 4.16 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var tslib = require('tslib');
var React = require('react');
var index = require('../../node_modules/.pnpm/react-virtuoso@4.1.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-virtuoso/dist/index.mjs.js');
var useMomentList = require('./hooks/useMomentList.js');
require('../../types/models.js');
require('../../types/events.js');
var EmptyStateIndicator = require('../EmptyStateIndicator/EmptyStateIndicator.js');
require('../Loading/LoadingErrorIndicator.js');
var LoadingIndicator = require('../Loading/LoadingIndicator.js');
require('../UIMoment/UIMomentContext.js');
require('../UIMoment/hooks/MomentContext.js');
var UIMoment = require('../UIMoment/UIMoment.js');
require('../UIMoment/UIMomentDefault.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
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.UIMoment;
var processedMoments = React.useMemo(function () {
if (typeof moments === 'undefined') {
return [];
}
return moments;
}, [moments]);
var virtuoso = React.useRef(null);
var endReached = function () {
if (hasMore && loadMore) {
loadMore();
}
};
var virtuosoComponents = React.useMemo(function () {
var EmptyPlaceholder = function () { return (React__default["default"].createElement(React__default["default"].Fragment, null, EmptyStateIndicator.EmptyStateIndicator && (React__default["default"].createElement(EmptyStateIndicator.EmptyStateIndicator, { listType: 'moment' })))); };
var Header = function () { return head !== null && head !== void 0 ? head : null; };
var Footer = function () {
return loadingMore ? (React__default["default"].createElement("div", { className: 'str-chat__virtual-list__loading' },
React__default["default"].createElement(LoadingIndicator.LoadingIndicator, { size: 20 }))) : (null);
};
return {
EmptyPlaceholder: EmptyPlaceholder,
Footer: Footer,
Header: Header,
};
}, [loadingMore, head]);
var momentRenderer = React.useCallback(function (moment, index) {
return (React__default["default"].createElement(MomentUIComponent, { moment: moment }));
}, []);
function fractionalItemSize(element) {
return element.getBoundingClientRect().height;
}
return (React__default["default"].createElement("div", { className: "uim-moment-list" },
React__default["default"].createElement(index.Virtuoso, tslib.__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.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["default"].createElement(UIMomentListWithContext, tslib.__assign({ hasMore: hasMore, loadMore: loadMore, loadingMore: loading, moments: moments }, props)));
};
exports.UIMomentList = UIMomentList;
//# sourceMappingURL=UIMomentList.js.map