@ringcentral/juno 2.40.1 → 2.41.0

package/components/Virtuoso/react-virtuoso/List.js

@@ -1,393 +0,0 @@
-"use strict";
-var _a;
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-/* eslint-disable no-console */
-var React = tslib_1.__importStar(require("react"));
-var react_1 = require("react");
-var react_urx_1 = require("@virtuoso.dev/react-urx");
-var urx_1 = require("@virtuoso.dev/urx");
-var useChangedChildSizes_1 = tslib_1.__importDefault(require("./hooks/useChangedChildSizes"));
-var useIsomorphicLayoutEffect_1 = tslib_1.__importDefault(require("./hooks/useIsomorphicLayoutEffect"));
-var useScrollTop_1 = tslib_1.__importDefault(require("./hooks/useScrollTop"));
-var useSize_1 = tslib_1.__importDefault(require("./hooks/useSize"));
-var useWindowViewportRect_1 = tslib_1.__importDefault(require("./hooks/useWindowViewportRect"));
-var listSystem_1 = require("./listSystem");
-var conditionalFlushSync_1 = tslib_1.__importDefault(require("./utils/conditionalFlushSync"));
-var correctItemSize_1 = require("./utils/correctItemSize");
-var positionStickyCssValue_1 = require("./utils/positionStickyCssValue");
-function identity(value) {
-    return value;
-}
-exports.identity = identity;
-var listComponentPropsSystem = urx_1.system(function () {
-    var itemContent = urx_1.statefulStream(function (index) { return "Item " + index; });
-    var context = urx_1.statefulStream(null);
-    var groupContent = urx_1.statefulStream(function (index) { return "Group " + index; });
-    var components = urx_1.statefulStream({});
-    var computeItemKey = urx_1.statefulStream(identity);
-    var headerFooterTag = urx_1.statefulStream('div');
-    var scrollerRef = urx_1.statefulStream(urx_1.noop);
-    var distinctProp = function (propName, defaultValue) {
-        if (defaultValue === void 0) { defaultValue = null; }
-        return urx_1.statefulStreamFromEmitter(urx_1.pipe(components, urx_1.map(function (components) { return components[propName]; }), urx_1.distinctUntilChanged()), defaultValue);
-    };
-    return {
-        context: context,
-        itemContent: itemContent,
-        groupContent: groupContent,
-        components: components,
-        computeItemKey: computeItemKey,
-        headerFooterTag: headerFooterTag,
-        scrollerRef: scrollerRef,
-        FooterComponent: distinctProp('Footer'),
-        HeaderComponent: distinctProp('Header'),
-        TopItemListComponent: distinctProp('TopItemList'),
-        ListComponent: distinctProp('List', 'div'),
-        ItemComponent: distinctProp('Item', 'div'),
-        GroupComponent: distinctProp('Group', 'div'),
-        ScrollerComponent: distinctProp('Scroller', 'div'),
-        EmptyPlaceholder: distinctProp('EmptyPlaceholder'),
-        ScrollSeekPlaceholder: distinctProp('ScrollSeekPlaceholder'),
-    };
-});
-function addDeprecatedAlias(prop, message) {
-    var alias = urx_1.stream();
-    urx_1.subscribe(alias, function () {
-        return console.warn("react-virtuoso: You are using a deprecated property. " + message, 'color: red;', 'color: inherit;', 'color: blue;');
-    });
-    urx_1.connect(alias, prop);
-    return alias;
-}
-exports.addDeprecatedAlias = addDeprecatedAlias;
-var combinedSystem = urx_1.system(function (_a) {
-    var _b = tslib_1.__read(_a, 2), listSystem = _b[0], propsSystem = _b[1];
-    var deprecatedProps = {
-        item: addDeprecatedAlias(propsSystem.itemContent, 'Rename the %citem%c prop to %citemContent.'),
-        group: addDeprecatedAlias(propsSystem.groupContent, 'Rename the %cgroup%c prop to %cgroupContent.'),
-        topItems: addDeprecatedAlias(listSystem.topItemCount, 'Rename the %ctopItems%c prop to %ctopItemCount.'),
-        itemHeight: addDeprecatedAlias(listSystem.fixedItemHeight, 'Rename the %citemHeight%c prop to %cfixedItemHeight.'),
-        scrollingStateChange: addDeprecatedAlias(listSystem.isScrolling, 'Rename the %cscrollingStateChange%c prop to %cisScrolling.'),
-        adjustForPrependedItems: urx_1.stream(),
-        maxHeightCacheSize: urx_1.stream(),
-        footer: urx_1.stream(),
-        header: urx_1.stream(),
-        HeaderContainer: urx_1.stream(),
-        FooterContainer: urx_1.stream(),
-        ItemContainer: urx_1.stream(),
-        ScrollContainer: urx_1.stream(),
-        GroupContainer: urx_1.stream(),
-        ListContainer: urx_1.stream(),
-        emptyComponent: urx_1.stream(),
-        scrollSeek: urx_1.stream(),
-    };
-    urx_1.subscribe(deprecatedProps.adjustForPrependedItems, function () {
-        console.warn("react-virtuoso: adjustForPrependedItems is no longer supported. Use the firstItemIndex property instead - https://virtuoso.dev/prepend-items.", 'color: red;', 'color: inherit;', 'color: blue;');
-    });
-    urx_1.subscribe(deprecatedProps.maxHeightCacheSize, function () {
-        console.warn("react-virtuoso: maxHeightCacheSize is no longer necessary. Setting it has no effect - remove it from your code.");
-    });
-    urx_1.subscribe(deprecatedProps.HeaderContainer, function () {
-        console.warn("react-virtuoso: HeaderContainer is deprecated. Use headerFooterTag if you want to change the wrapper of the header component and pass components.Header to change its contents.");
-    });
-    urx_1.subscribe(deprecatedProps.FooterContainer, function () {
-        console.warn("react-virtuoso: FooterContainer is deprecated. Use headerFooterTag if you want to change the wrapper of the footer component and pass components.Footer to change its contents.");
-    });
-    function deprecateComponentProp(stream, componentName, propName) {
-        urx_1.connect(urx_1.pipe(stream, urx_1.withLatestFrom(propsSystem.components), urx_1.map(function (_a) {
-            var _b;
-            var _c = tslib_1.__read(_a, 2), comp = _c[0], components = _c[1];
-            console.warn("react-virtuoso: " + propName + " property is deprecated. Pass components." + componentName + " instead.");
-            // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-            return tslib_1.__assign(tslib_1.__assign({}, components), (_b = {}, _b[componentName] = comp, _b));
-        })), propsSystem.components);
-    }
-    urx_1.subscribe(deprecatedProps.scrollSeek, function (_a) {
-        var placeholder = _a.placeholder, config = tslib_1.__rest(_a, ["placeholder"]);
-        console.warn("react-virtuoso: scrollSeek property is deprecated. Pass scrollSeekConfiguration and specify the placeholder in components.ScrollSeekPlaceholder instead.");
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-        urx_1.publish(propsSystem.components, tslib_1.__assign(tslib_1.__assign({}, urx_1.getValue(propsSystem.components)), { ScrollSeekPlaceholder: placeholder }));
-        urx_1.publish(listSystem.scrollSeekConfiguration, config);
-    });
-    deprecateComponentProp(deprecatedProps.footer, 'Footer', 'footer');
-    deprecateComponentProp(deprecatedProps.header, 'Header', 'header');
-    deprecateComponentProp(deprecatedProps.ItemContainer, 'Item', 'ItemContainer');
-    deprecateComponentProp(deprecatedProps.ListContainer, 'List', 'ListContainer');
-    deprecateComponentProp(deprecatedProps.ScrollContainer, 'Scroller', 'ScrollContainer');
-    deprecateComponentProp(deprecatedProps.emptyComponent, 'EmptyPlaceholder', 'emptyComponent');
-    deprecateComponentProp(deprecatedProps.GroupContainer, 'Group', 'GroupContainer');
-    return tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, listSystem), propsSystem), deprecatedProps);
-}, urx_1.tup(listSystem_1.listSystem, listComponentPropsSystem));
-var DefaultScrollSeekPlaceholder = function (_a) {
-    var height = _a.height;
-    return (React.createElement("div", { style: { height: height } }));
-};
-var GROUP_STYLE = {
-    position: positionStickyCssValue_1.positionStickyCssValue(),
-    zIndex: 1,
-    overflowAnchor: 'none',
-};
-var ITEM_STYLE = { overflowAnchor: 'none' };
-exports.Items = React.memo(function VirtuosoItems(_a) {
-    var _b = _a.showTopList, showTopList = _b === void 0 ? false : _b;
-    var listState = exports.useEmitterValue('listState');
-    var _c = tslib_1.__read(React.useState(0), 2), deviation = _c[0], setDeviation = _c[1];
-    var react18ConcurrentRendering = exports.useEmitterValue('react18ConcurrentRendering');
-    exports.useEmitter('deviation', function (value) {
-        if (deviation !== value) {
-            conditionalFlushSync_1.default(react18ConcurrentRendering)(function () {
-                return setDeviation(value);
-            });
-        }
-    });
-    var sizeRanges = exports.usePublisher('sizeRanges');
-    var useWindowScroll = exports.useEmitterValue('useWindowScroll');
-    var customScrollParent = exports.useEmitterValue('customScrollParent');
-    var windowScrollContainerStateCallback = exports.usePublisher('windowScrollContainerState');
-    var _scrollContainerStateCallback = exports.usePublisher('scrollContainerState');
-    var scrollContainerStateCallback = customScrollParent || useWindowScroll
-        ? windowScrollContainerStateCallback
-        : _scrollContainerStateCallback;
-    var itemContent = exports.useEmitterValue('itemContent');
-    var context = exports.useEmitterValue('context');
-    var groupContent = exports.useEmitterValue('groupContent');
-    var trackItemSizes = exports.useEmitterValue('trackItemSizes');
-    var itemSize = exports.useEmitterValue('itemSize');
-    var log = exports.useEmitterValue('log');
-    var ref = useChangedChildSizes_1.default(sizeRanges, itemSize, trackItemSizes, showTopList ? urx_1.noop : scrollContainerStateCallback, log, customScrollParent);
-    var EmptyPlaceholder = exports.useEmitterValue('EmptyPlaceholder');
-    var ScrollSeekPlaceholder = exports.useEmitterValue('ScrollSeekPlaceholder') || DefaultScrollSeekPlaceholder;
-    var ListComponent = exports.useEmitterValue('ListComponent');
-    var ItemComponent = exports.useEmitterValue('ItemComponent');
-    var GroupComponent = exports.useEmitterValue('GroupComponent');
-    var computeItemKey = exports.useEmitterValue('computeItemKey');
-    var isSeeking = exports.useEmitterValue('isSeeking');
-    var hasGroups = exports.useEmitterValue('groupIndices').length > 0;
-    var paddingTopAddition = exports.useEmitterValue('paddingTopAddition');
-    var firstItemIndex = exports.useEmitterValue('firstItemIndex');
-    var statefulTotalCount = exports.useEmitterValue('statefulTotalCount');
-    var containerStyle = showTopList
-        ? {}
-        : {
-            boxSizing: 'border-box',
-            paddingTop: listState.offsetTop + paddingTopAddition,
-            paddingBottom: listState.offsetBottom,
-            marginTop: deviation,
-        };
-    if (!showTopList && statefulTotalCount === 0 && EmptyPlaceholder) {
-        return react_1.createElement(EmptyPlaceholder, contextPropIfNotDomElement(EmptyPlaceholder, context));
-    }
-    return react_1.createElement(ListComponent, tslib_1.__assign(tslib_1.__assign({}, contextPropIfNotDomElement(ListComponent, context)), { ref: ref, style: containerStyle, 'data-test-id': showTopList
-            ? 'virtuoso-top-item-list'
-            : 'virtuoso-item-list' }), (showTopList ? listState.topItems : listState.items).map(function (item) {
-        var index = item.originalIndex;
-        var key = computeItemKey(index + firstItemIndex, item.data, context);
-        if (isSeeking) {
-            return react_1.createElement(ScrollSeekPlaceholder, tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({}, contextPropIfNotDomElement(ScrollSeekPlaceholder, context)), { key: key, index: item.index, height: item.size, type: item.type || 'item' }), (item.type === 'group' ? {} : { groupIndex: item.groupIndex })));
-        }
-        if (item.type === 'group') {
-            return react_1.createElement(GroupComponent, tslib_1.__assign(tslib_1.__assign({}, contextPropIfNotDomElement(GroupComponent, context)), { key: key, 'data-index': index, 'data-known-size': item.size, 'data-item-index': item.index, style: GROUP_STYLE }), groupContent(item.index));
-        }
-        return react_1.createElement(ItemComponent, tslib_1.__assign(tslib_1.__assign({}, contextPropIfNotDomElement(ItemComponent, context)), { key: key, 'data-index': index, 'data-known-size': item.size, 'data-item-index': item.index, 'data-item-group-index': item.groupIndex, style: ITEM_STYLE }), hasGroups
-            ? itemContent(item.index, item.groupIndex, item.data, context)
-            : itemContent(item.index, item.data, context));
-    }));
-});
-exports.scrollerStyle = {
-    height: '100%',
-    outline: 'none',
-    overflowY: 'auto',
-    position: 'relative',
-    WebkitOverflowScrolling: 'touch',
-};
-exports.viewportStyle = {
-    width: '100%',
-    height: '100%',
-    position: 'absolute',
-    top: 0,
-};
-var topItemListStyle = {
-    width: '100%',
-    position: positionStickyCssValue_1.positionStickyCssValue(),
-    top: 0,
-};
-function contextPropIfNotDomElement(element, context) {
-    if (typeof element === 'string') {
-        return undefined;
-    }
-    return { context: context };
-}
-exports.contextPropIfNotDomElement = contextPropIfNotDomElement;
-var Header = React.memo(function VirtuosoHeader() {
-    var Header = exports.useEmitterValue('HeaderComponent');
-    var headerHeight = exports.usePublisher('headerHeight');
-    var headerFooterTag = exports.useEmitterValue('headerFooterTag');
-    var ref = useSize_1.default(function (el) { return headerHeight(correctItemSize_1.correctItemSize(el, 'height')); });
-    var context = exports.useEmitterValue('context');
-    return Header
-        ? react_1.createElement(headerFooterTag, { ref: ref }, react_1.createElement(Header, contextPropIfNotDomElement(Header, context)))
-        : null;
-});
-var Footer = React.memo(function VirtuosoFooter() {
-    var Footer = exports.useEmitterValue('FooterComponent');
-    var footerHeight = exports.usePublisher('footerHeight');
-    var headerFooterTag = exports.useEmitterValue('headerFooterTag');
-    var ref = useSize_1.default(function (el) { return footerHeight(correctItemSize_1.correctItemSize(el, 'height')); });
-    var context = exports.useEmitterValue('context');
-    return Footer
-        ? react_1.createElement(headerFooterTag, { ref: ref }, react_1.createElement(Footer, contextPropIfNotDomElement(Footer, context)))
-        : null;
-});
-function buildScroller(_a) {
-    var usePublisher = _a.usePublisher, useEmitter = _a.useEmitter, useEmitterValue = _a.useEmitterValue;
-    var Scroller = React.memo(function VirtuosoScroller(_a) {
-        var style = _a.style, children = _a.children, props = tslib_1.__rest(_a, ["style", "children"]);
-        var scrollContainerStateCallback = usePublisher('scrollContainerState');
-        var ScrollerComponent = useEmitterValue('ScrollerComponent');
-        var smoothScrollTargetReached = usePublisher('smoothScrollTargetReached');
-        var scrollerRefCallback = useEmitterValue('scrollerRef');
-        var context = useEmitterValue('context');
-        var _b = useScrollTop_1.default(scrollContainerStateCallback, smoothScrollTargetReached, ScrollerComponent, scrollerRefCallback), scrollerRef = _b.scrollerRef, scrollByCallback = _b.scrollByCallback, scrollToCallback = _b.scrollToCallback;
-        useEmitter('scrollTo', scrollToCallback);
-        useEmitter('scrollBy', scrollByCallback);
-        return react_1.createElement(ScrollerComponent, tslib_1.__assign(tslib_1.__assign({ ref: scrollerRef, style: tslib_1.__assign(tslib_1.__assign({}, exports.scrollerStyle), style), 'data-test-id': 'virtuoso-scroller', 'data-virtuoso-scroller': true, tabIndex: 0 }, props), contextPropIfNotDomElement(ScrollerComponent, context)), children);
-    });
-    return Scroller;
-}
-exports.buildScroller = buildScroller;
-function buildWindowScroller(_a) {
-    var usePublisher = _a.usePublisher, useEmitter = _a.useEmitter, useEmitterValue = _a.useEmitterValue;
-    var Scroller = React.memo(function VirtuosoWindowScroller(_a) {
-        var style = _a.style, children = _a.children, props = tslib_1.__rest(_a, ["style", "children"]);
-        var scrollContainerStateCallback = usePublisher('windowScrollContainerState');
-        var ScrollerComponent = useEmitterValue('ScrollerComponent');
-        var smoothScrollTargetReached = usePublisher('smoothScrollTargetReached');
-        var totalListHeight = useEmitterValue('totalListHeight');
-        var deviation = useEmitterValue('deviation');
-        var customScrollParent = useEmitterValue('customScrollParent');
-        var context = useEmitterValue('context');
-        var _b = useScrollTop_1.default(scrollContainerStateCallback, smoothScrollTargetReached, ScrollerComponent, urx_1.noop, customScrollParent), scrollerRef = _b.scrollerRef, scrollByCallback = _b.scrollByCallback, scrollToCallback = _b.scrollToCallback;
-        useIsomorphicLayoutEffect_1.default(function () {
-            scrollerRef.current = customScrollParent ? customScrollParent : window;
-            return function () {
-                scrollerRef.current = null;
-            };
-        }, [scrollerRef, customScrollParent]);
-        useEmitter('windowScrollTo', scrollToCallback);
-        useEmitter('scrollBy', scrollByCallback);
-        return react_1.createElement(ScrollerComponent, tslib_1.__assign(tslib_1.__assign({ style: tslib_1.__assign(tslib_1.__assign({ position: 'relative' }, style), (totalListHeight !== 0
-                ? { height: totalListHeight + deviation }
-                : {})), 'data-virtuoso-scroller': true }, props), contextPropIfNotDomElement(ScrollerComponent, context)), children);
-    });
-    return Scroller;
-}
-exports.buildWindowScroller = buildWindowScroller;
-var Viewport = function (_a) {
-    var children = _a.children;
-    var viewportHeight = exports.usePublisher('viewportHeight');
-    var viewportRef = useSize_1.default(urx_1.compose(viewportHeight, function (el) { return correctItemSize_1.correctItemSize(el, 'height'); }));
-    return (React.createElement("div", { style: exports.viewportStyle, ref: viewportRef, "data-viewport-type": "element" }, children));
-};
-var WindowViewport = function (_a) {
-    var children = _a.children;
-    var windowViewportRect = exports.usePublisher('windowViewportRect');
-    var customScrollParent = exports.useEmitterValue('customScrollParent');
-    var viewportRef = useWindowViewportRect_1.default(windowViewportRect, customScrollParent);
-    return (React.createElement("div", { ref: viewportRef, style: exports.viewportStyle, "data-viewport-type": "window" }, children));
-};
-var TopItemListContainer = function (_a) {
-    var children = _a.children;
-    var TopItemList = exports.useEmitterValue('TopItemListComponent');
-    var headerHeight = exports.useEmitterValue('headerHeight');
-    var style = tslib_1.__assign(tslib_1.__assign({}, topItemListStyle), { marginTop: headerHeight + "px" });
-    var context = exports.useEmitterValue('context');
-    return react_1.createElement(TopItemList || 'div', { style: style, context: context }, children);
-};
-var ListRoot = React.memo(function VirtuosoRoot(props) {
-    var useWindowScroll = exports.useEmitterValue('useWindowScroll');
-    var showTopList = exports.useEmitterValue('topItemsIndexes').length > 0;
-    var customScrollParent = exports.useEmitterValue('customScrollParent');
-    var TheScroller = customScrollParent || useWindowScroll ? WindowScroller : Scroller;
-    var TheViewport = customScrollParent || useWindowScroll ? WindowViewport : Viewport;
-    return (React.createElement(TheScroller, tslib_1.__assign({}, props),
-        React.createElement(TheViewport, null,
-            React.createElement(Header, null),
-            React.createElement(exports.Items, null),
-            React.createElement(Footer, null)),
-        showTopList && (React.createElement(TopItemListContainer, null,
-            React.createElement(exports.Items, { showTopList: true })))));
-});
-exports.List = (_a = react_urx_1.systemToComponent(combinedSystem, {
-    required: {},
-    optional: {
-        context: 'context',
-        followOutput: 'followOutput',
-        firstItemIndex: 'firstItemIndex',
-        itemContent: 'itemContent',
-        groupContent: 'groupContent',
-        overscan: 'overscan',
-        increaseViewportBy: 'increaseViewportBy',
-        totalCount: 'totalCount',
-        topItemCount: 'topItemCount',
-        initialTopMostItemIndex: 'initialTopMostItemIndex',
-        components: 'components',
-        groupCounts: 'groupCounts',
-        atBottomThreshold: 'atBottomThreshold',
-        computeItemKey: 'computeItemKey',
-        defaultItemHeight: 'defaultItemHeight',
-        fixedItemHeight: 'fixedItemHeight',
-        itemSize: 'itemSize',
-        scrollSeekConfiguration: 'scrollSeekConfiguration',
-        headerFooterTag: 'headerFooterTag',
-        data: 'data',
-        initialItemCount: 'initialItemCount',
-        initialScrollTop: 'initialScrollTop',
-        alignToBottom: 'alignToBottom',
-        useWindowScroll: 'useWindowScroll',
-        customScrollParent: 'customScrollParent',
-        scrollerRef: 'scrollerRef',
-        logLevel: 'logLevel',
-        react18ConcurrentRendering: 'react18ConcurrentRendering',
-        // deprecated
-        item: 'item',
-        group: 'group',
-        topItems: 'topItems',
-        itemHeight: 'itemHeight',
-        scrollingStateChange: 'scrollingStateChange',
-        maxHeightCacheSize: 'maxHeightCacheSize',
-        footer: 'footer',
-        header: 'header',
-        ItemContainer: 'ItemContainer',
-        ScrollContainer: 'ScrollContainer',
-        ListContainer: 'ListContainer',
-        GroupContainer: 'GroupContainer',
-        emptyComponent: 'emptyComponent',
-        HeaderContainer: 'HeaderContainer',
-        FooterContainer: 'FooterContainer',
-        scrollSeek: 'scrollSeek',
-    },
-    methods: {
-        scrollToIndex: 'scrollToIndex',
-        scrollIntoView: 'scrollIntoView',
-        scrollTo: 'scrollTo',
-        scrollBy: 'scrollBy',
-        adjustForPrependedItems: 'adjustForPrependedItems',
-    },
-    events: {
-        isScrolling: 'isScrolling',
-        endReached: 'endReached',
-        startReached: 'startReached',
-        rangeChanged: 'rangeChanged',
-        atBottomStateChange: 'atBottomStateChange',
-        atTopStateChange: 'atTopStateChange',
-        totalListHeightChanged: 'totalListHeightChanged',
-        itemsRendered: 'itemsRendered',
-        groupIndices: 'groupIndices',
-    },
-}, ListRoot), _a.Component), exports.usePublisher = _a.usePublisher, exports.useEmitterValue = _a.useEmitterValue, exports.useEmitter = _a.useEmitter;
-var Scroller = buildScroller({ usePublisher: exports.usePublisher, useEmitterValue: exports.useEmitterValue, useEmitter: exports.useEmitter });
-var WindowScroller = buildWindowScroller({
-    usePublisher: exports.usePublisher,
-    useEmitterValue: exports.useEmitterValue,
-    useEmitter: exports.useEmitter,
-});