stream-chat-react 13.14.1 → 14.0.0-beta.1

package/dist/components/Gallery/BaseImage.js

@@ -1,18 +0,0 @@
-import React, { forwardRef, useEffect, useState } from 'react';
-import clsx from 'clsx';
-import { DownloadButton } from '../Attachment';
-export const BaseImage = forwardRef(function BaseImage({ ...props }, ref) {
-    const { className: propsClassName, onError: propsOnError } = props;
-    const [error, setError] = useState(false);
-    useEffect(() => () => {
-        setError(false);
-    }, [props.src]);
-    return (React.createElement(React.Fragment, null,
-        React.createElement("img", { "data-testid": 'str-chat__base-image', ...props, className: clsx(propsClassName, 'str-chat__base-image', {
-                'str-chat__base-image--load-failed': error,
-            }), onError: (e) => {
-                setError(true);
-                propsOnError?.(e);
-            }, ref: ref }),
-        error && React.createElement(DownloadButton, { assetUrl: props.src })));
-});

package/dist/components/Gallery/Gallery.d.ts

@@ -1,17 +0,0 @@
-import type { CSSProperties, MutableRefObject } from 'react';
-import React from 'react';
-import type { Attachment } from 'stream-chat';
-export type GalleryProps = {
-    images: (({
-        image_url?: string | undefined;
-        thumb_url?: string | undefined;
-    } | Attachment) & {
-        previewUrl?: string;
-        style?: CSSProperties;
-    })[];
-    innerRefs?: MutableRefObject<(HTMLElement | null)[]>;
-};
-/**
- * Displays images in a simple responsive grid with a light box to view the images.
- */
-export declare const Gallery: (props: GalleryProps) => React.JSX.Element;

package/dist/components/Gallery/Gallery.js

@@ -1,57 +0,0 @@
-import React, { useState } from 'react';
-import { sanitizeUrl } from '@braintree/sanitize-url';
-import clsx from 'clsx';
-import { BaseImage as DefaultBaseImage } from './BaseImage';
-import { Modal as DefaultModal } from '../Modal';
-import { ModalGallery as DefaultModalGallery } from './ModalGallery';
-import { useComponentContext } from '../../context/ComponentContext';
-import { useTranslationContext } from '../../context/TranslationContext';
-const UnMemoizedGallery = (props) => {
-    const { images, innerRefs } = props;
-    const [index, setIndex] = useState(0);
-    const [modalOpen, setModalOpen] = useState(false);
-    const { BaseImage = DefaultBaseImage, Modal = DefaultModal, ModalGallery = DefaultModalGallery, } = useComponentContext('Gallery');
-    const { t } = useTranslationContext('Gallery');
-    const imageFallbackTitle = t('User uploaded content');
-    const countImagesDisplayedInPreview = 4;
-    const lastImageIndexInPreview = countImagesDisplayedInPreview - 1;
-    const toggleModal = (selectedIndex) => {
-        if (modalOpen) {
-            setModalOpen(false);
-        }
-        else {
-            setIndex(selectedIndex);
-            setModalOpen(true);
-        }
-    };
-    const renderImages = images.slice(0, countImagesDisplayedInPreview).map((image, i) => i === lastImageIndexInPreview && images.length > countImagesDisplayedInPreview ? (React.createElement("button", { className: 'str-chat__gallery-placeholder', "data-testid": 'gallery-image-last', key: `gallery-image-${i}`, onClick: () => toggleModal(i), style: {
-            backgroundImage: `url(${images[lastImageIndexInPreview].previewUrl ||
-                images[lastImageIndexInPreview].image_url ||
-                images[lastImageIndexInPreview].thumb_url})`,
-            ...image.style,
-        }, ...(innerRefs?.current && {
-            ref: (r) => {
-                innerRefs.current[i] = r;
-            },
-        }) },
-        React.createElement("p", null, t('{{ imageCount }} more', {
-            imageCount: images.length - countImagesDisplayedInPreview,
-        })))) : (React.createElement("button", { className: 'str-chat__gallery-image', "data-testid": 'gallery-image', key: `gallery-image-${i}`, onClick: () => toggleModal(i) },
-        React.createElement(BaseImage, { alt: image?.fallback || imageFallbackTitle, src: sanitizeUrl(image.previewUrl || image.image_url || image.thumb_url), style: image.style, title: image?.fallback || imageFallbackTitle, ...(innerRefs?.current && {
-                ref: (r) => {
-                    innerRefs.current[i] = r;
-                },
-            }) }))));
-    const className = clsx('str-chat__gallery', {
-        'str-chat__gallery--square': images.length > lastImageIndexInPreview,
-        'str-chat__gallery-two-rows': images.length > 2,
-    });
-    return (React.createElement("div", { className: className },
-        renderImages,
-        React.createElement(Modal, { className: 'str-chat__gallery-modal', onClose: () => setModalOpen((modalOpen) => !modalOpen), open: modalOpen },
-            React.createElement(ModalGallery, { images: images, index: index }))));
-};
-/**
- * Displays images in a simple responsive grid with a light box to view the images.
- */
-export const Gallery = React.memo(UnMemoizedGallery);

package/dist/components/Gallery/Image.d.ts

@@ -1,21 +0,0 @@
-import type { CSSProperties, MutableRefObject } from 'react';
-import React from 'react';
-import type { Attachment } from 'stream-chat';
-import type { Dimensions } from '../../types/types';
-export type ImageProps = {
-    dimensions?: Dimensions;
-    innerRef?: MutableRefObject<HTMLImageElement | null>;
-    previewUrl?: string;
-    style?: CSSProperties;
-} & ({
-    /** The text fallback for the image */
-    fallback?: string;
-    /** The full size image url */
-    image_url?: string;
-    /** The thumb url */
-    thumb_url?: string;
-} | Attachment);
-/**
- * A simple component that displays an image.
- */
-export declare const ImageComponent: (props: ImageProps) => React.JSX.Element;

package/dist/components/Gallery/Image.js

@@ -1,26 +0,0 @@
-import { useCallback } from 'react';
-import React, { useState } from 'react';
-import { sanitizeUrl } from '@braintree/sanitize-url';
-import { BaseImage as DefaultBaseImage } from './BaseImage';
-import { Modal as DefaultModal } from '../Modal';
-import { ModalGallery as DefaultModalGallery } from './ModalGallery';
-import { useComponentContext } from '../../context';
-/**
- * A simple component that displays an image.
- */
-export const ImageComponent = (props) => {
-    const { dimensions = {}, fallback, image_url, innerRef, previewUrl, style, thumb_url, } = props;
-    const [modalIsOpen, setModalIsOpen] = useState(false);
-    const { BaseImage = DefaultBaseImage, Modal = DefaultModal, ModalGallery = DefaultModalGallery, } = useComponentContext('ImageComponent');
-    const imageSrc = sanitizeUrl(previewUrl || image_url || thumb_url);
-    const closeModal = useCallback(() => {
-        setModalIsOpen(false);
-    }, []);
-    const openModal = useCallback(() => {
-        setModalIsOpen(true);
-    }, []);
-    return (React.createElement(React.Fragment, null,
-        React.createElement(BaseImage, { alt: fallback, className: 'str-chat__message-attachment--img', "data-testid": 'image-test', onClick: openModal, src: imageSrc, style: style, tabIndex: 0, title: fallback, ...dimensions, ...(innerRef && { ref: innerRef }) }),
-        React.createElement(Modal, { className: 'str-chat__image-modal', onClose: closeModal, open: modalIsOpen },
-            React.createElement(ModalGallery, { images: [props], index: 0 }))));
-};

package/dist/components/Gallery/ModalGallery.d.ts

@@ -1,9 +0,0 @@
-import React from 'react';
-import type { Attachment } from 'stream-chat';
-export type ModalGalleryProps = {
-    /** The images for the Carousel component */
-    images: Attachment[];
-    /** The index for the component */
-    index?: number;
-};
-export declare const ModalGallery: (props: ModalGalleryProps) => React.JSX.Element;

package/dist/components/Gallery/ModalGallery.js

@@ -1,25 +0,0 @@
-import React, { useMemo } from 'react';
-import ImageGallery from 'react-image-gallery';
-import { BaseImage } from './BaseImage';
-import { useTranslationContext } from '../../context';
-const onError = (e) => {
-    // Prevent having alt attribute on img as the img takes the height of the alt text
-    // instead of the CSS / element width & height when the CSS mask (fallback) is applied.
-    e.target.alt = '';
-};
-const renderItem = ({ original, originalAlt }) => (React.createElement(BaseImage, { alt: originalAlt, className: 'image-gallery-image', onError: onError, src: original }));
-export const ModalGallery = (props) => {
-    const { images, index } = props;
-    const { t } = useTranslationContext('ModalGallery');
-    const formattedArray = useMemo(() => images.map((image) => {
-        const imageSrc = image.image_url || image.thumb_url || '';
-        return {
-            original: imageSrc,
-            originalAlt: t('User uploaded content'),
-            source: imageSrc,
-        };
-    }), [images, t]);
-    return (
-    // @ts-expect-error ignore the TS error as react-image-gallery was on @types/react@18 while stream-chat-react being upgraded to React 19 (https://github.com/xiaolin/react-image-gallery/issues/809)
-    React.createElement(ImageGallery, { items: formattedArray, renderItem: renderItem, showIndex: true, showPlayButton: false, showThumbnails: false, startIndex: index }));
-};

package/dist/components/Gallery/index.d.ts

@@ -1,4 +0,0 @@
-export * from './BaseImage';
-export * from './Gallery';
-export * from './Image';
-export * from './ModalGallery';

package/dist/components/Gallery/index.js

@@ -1,4 +0,0 @@
-export * from './BaseImage';
-export * from './Gallery';
-export * from './Image';
-export * from './ModalGallery';

package/dist/components/InfiniteScrollPaginator/InfiniteScroll.d.ts

@@ -1,45 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-import type { PaginatorProps } from '../../types/types';
-export type InfiniteScrollProps = PaginatorProps & {
-    className?: string;
-    element?: React.ElementType;
-    /**
-     * @desc Flag signalling whether more pages with older items can be loaded
-     * @deprecated Use hasPreviousPage prop instead. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
-     */
-    hasMore?: boolean;
-    /**
-     * @desc Flag signalling whether more pages with newer items can be loaded
-     * @deprecated Use hasNextPage prop instead. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
-     */
-    hasMoreNewer?: boolean;
-    /** Element to be rendered at the top of the thread message list. By default, Message and ThreadStart components */
-    head?: React.ReactNode;
-    initialLoad?: boolean;
-    isLoading?: boolean;
-    listenToScroll?: (offset: number, reverseOffset: number, threshold: number) => void;
-    loader?: React.ReactNode;
-    /**
-     * @desc Function that loads previous page with older items
-     * @deprecated Use loadPreviousPage prop instead. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
-     */
-    loadMore?: () => void;
-    /**
-     * @desc Function that loads next page with newer items
-     * @deprecated Use loadNextPage prop instead. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
-     */
-    loadMoreNewer?: () => void;
-    useCapture?: boolean;
-};
-/**
- * This component serves a single purpose - load more items on scroll inside the MessageList component
- * It is not a general purpose infinite scroll controller, because:
- * 1. It is re-rendered whenever queryInProgress, hasNext, hasPrev changes. This can lead to scrollListener to have stale data.
- * 2. It pretends to invoke scrollListener on resize event even though this event is emitted only on window resize. It should
- * rather use ResizeObserver. But then again, it ResizeObserver would invoke a stale version of scrollListener.
- *
- * In general, the infinite scroll controller should not aim for checking the loading state and whether there is more data to load.
- * That should be controlled by the loading function.
- */
-export declare const InfiniteScroll: (props: PropsWithChildren<InfiniteScrollProps>) => React.JSX.Element;

package/dist/components/InfiniteScrollPaginator/InfiniteScroll.js

@@ -1,99 +0,0 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { deprecationAndReplacementWarning } from '../../utils/deprecationWarning';
-import { DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD } from '../../constants/limits';
-/**
- * Prevents Chrome hangups
- * See: https://stackoverflow.com/questions/47524205/random-high-content-download-time-in-chrome/47684257#47684257
- */
-const mousewheelListener = (event) => {
-    if (event instanceof WheelEvent && event.deltaY === 1) {
-        event.preventDefault();
-    }
-};
-/**
- * This component serves a single purpose - load more items on scroll inside the MessageList component
- * It is not a general purpose infinite scroll controller, because:
- * 1. It is re-rendered whenever queryInProgress, hasNext, hasPrev changes. This can lead to scrollListener to have stale data.
- * 2. It pretends to invoke scrollListener on resize event even though this event is emitted only on window resize. It should
- * rather use ResizeObserver. But then again, it ResizeObserver would invoke a stale version of scrollListener.
- *
- * In general, the infinite scroll controller should not aim for checking the loading state and whether there is more data to load.
- * That should be controlled by the loading function.
- */
-export const InfiniteScroll = (props) => {
-    const { children, element: Component = 'div', hasMore, hasMoreNewer, hasNextPage, hasPreviousPage, head, initialLoad = true, isLoading, listenToScroll, loader, loadMore, loadMoreNewer, loadNextPage, loadPreviousPage, threshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, useCapture = false, ...elementProps } = props;
-    const loadNextPageFn = loadNextPage || loadMoreNewer;
-    const loadPreviousPageFn = loadPreviousPage || loadMore;
-    const hasNextPageFlag = hasNextPage || hasMoreNewer;
-    const hasPreviousPageFlag = hasPreviousPage || hasMore;
-    const [scrollComponent, setScrollComponent] = useState(null);
-    const previousOffset = useRef(undefined);
-    const previousReverseOffset = useRef(undefined);
-    const scrollListenerRef = useRef(undefined);
-    scrollListenerRef.current = () => {
-        const element = scrollComponent;
-        if (!element || element.offsetParent === null) {
-            return;
-        }
-        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-        const parentElement = element.parentElement;
-        const offset = element.scrollHeight - parentElement.scrollTop - parentElement.clientHeight;
-        const reverseOffset = parentElement.scrollTop;
-        if (listenToScroll) {
-            listenToScroll(offset, reverseOffset, threshold);
-        }
-        if (isLoading)
-            return;
-        if (previousOffset.current === offset &&
-            previousReverseOffset.current === reverseOffset)
-            return;
-        previousOffset.current = offset;
-        previousReverseOffset.current = reverseOffset;
-        // FIXME: this triggers loadMore call when a user types messages in thread and the scroll container expands
-        if (reverseOffset < Number(threshold) &&
-            typeof loadPreviousPageFn === 'function' &&
-            hasPreviousPageFlag) {
-            loadPreviousPageFn();
-        }
-        if (offset < Number(threshold) &&
-            typeof loadNextPageFn === 'function' &&
-            hasNextPageFlag) {
-            loadNextPageFn();
-        }
-    };
-    useEffect(() => {
-        deprecationAndReplacementWarning([
-            [{ hasMoreNewer }, { hasNextPage }],
-            [{ loadMoreNewer }, { loadNextPage }],
-            [{ hasMore }, { hasPreviousPage }],
-            [{ loadMore }, { loadPreviousPage }],
-        ], 'InfiniteScroll');
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    useEffect(() => {
-        const scrollElement = scrollComponent?.parentNode;
-        if (!scrollElement)
-            return;
-        const scrollListener = () => scrollListenerRef.current?.();
-        scrollElement.addEventListener('scroll', scrollListener, useCapture);
-        scrollElement.addEventListener('resize', scrollListener, useCapture);
-        scrollListener();
-        return () => {
-            scrollElement.removeEventListener('scroll', scrollListener, useCapture);
-            scrollElement.removeEventListener('resize', scrollListener, useCapture);
-        };
-    }, [initialLoad, scrollComponent, useCapture]);
-    useEffect(() => {
-        const scrollElement = scrollComponent?.parentNode;
-        if (!scrollElement)
-            return;
-        scrollElement.addEventListener('wheel', mousewheelListener, { passive: false });
-        return () => {
-            scrollElement.removeEventListener('wheel', mousewheelListener, useCapture);
-        };
-    }, [scrollComponent, useCapture]);
-    return (React.createElement(Component, { ...elementProps, ref: setScrollComponent },
-        head,
-        loader,
-        children));
-};

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.d.ts

@@ -1,12 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-export type InfiniteScrollPaginatorProps = React.ComponentProps<'div'> & {
-    listenToScroll?: (distanceFromBottom: number, distanceFromTop: number, threshold: number) => void;
-    loadNextDebounceMs?: number;
-    loadNextOnScrollToBottom?: () => void;
-    loadNextOnScrollToTop?: () => void;
-    /** Offset from when to start the loadNextPage call */
-    threshold?: number;
-    useCapture?: boolean;
-};
-export declare const InfiniteScrollPaginator: (props: PropsWithChildren<InfiniteScrollPaginatorProps>) => React.JSX.Element;

package/dist/components/InfiniteScrollPaginator/InfiniteScrollPaginator.js

@@ -1,74 +0,0 @@
-import clsx from 'clsx';
-import debounce from 'lodash.debounce';
-import React, { useEffect, useMemo, useRef } from 'react';
-import { DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD } from '../../constants/limits';
-/**
- * Prevents Chrome hangups
- * See: https://stackoverflow.com/questions/47524205/random-high-content-download-time-in-chrome/47684257#47684257
- */
-const mousewheelListener = (event) => {
-    if (event instanceof WheelEvent && event.deltaY === 1) {
-        event.preventDefault();
-    }
-};
-export const InfiniteScrollPaginator = (props) => {
-    const { children, className, listenToScroll, loadNextDebounceMs = 500, loadNextOnScrollToBottom, loadNextOnScrollToTop, threshold = DEFAULT_LOAD_PAGE_SCROLL_THRESHOLD, useCapture = false, ...componentProps } = props;
-    const rootRef = useRef(null);
-    const childRef = useRef(null);
-    const scrollListener = useMemo(() => debounce(() => {
-        const root = rootRef.current;
-        const child = childRef.current;
-        if (!root || root.offsetParent === null || !child) {
-            return;
-        }
-        const distanceFromBottom = child.scrollHeight - root.scrollTop - root.clientHeight;
-        const distanceFromTop = root.scrollTop;
-        if (listenToScroll) {
-            listenToScroll(distanceFromBottom, distanceFromTop, threshold);
-        }
-        if (distanceFromTop < Number(threshold)) {
-            loadNextOnScrollToTop?.();
-        }
-        if (distanceFromBottom < Number(threshold)) {
-            loadNextOnScrollToBottom?.();
-        }
-    }, loadNextDebounceMs), [
-        listenToScroll,
-        loadNextDebounceMs,
-        loadNextOnScrollToBottom,
-        loadNextOnScrollToTop,
-        threshold,
-    ]);
-    useEffect(() => {
-        const scrollElement = rootRef.current;
-        if (!scrollElement)
-            return;
-        scrollElement.addEventListener('scroll', scrollListener, useCapture);
-        return () => {
-            scrollElement.removeEventListener('scroll', scrollListener, useCapture);
-        };
-    }, [scrollListener, useCapture]);
-    useEffect(() => {
-        const root = rootRef.current;
-        if (!root || typeof ResizeObserver === 'undefined' || !scrollListener)
-            return;
-        const observer = new ResizeObserver(scrollListener);
-        observer.observe(root);
-        return () => {
-            observer.disconnect();
-        };
-    }, [scrollListener]);
-    useEffect(() => {
-        const root = rootRef.current;
-        if (root) {
-            root.addEventListener('wheel', mousewheelListener, { passive: false });
-        }
-        return () => {
-            if (root) {
-                root.removeEventListener('wheel', mousewheelListener, useCapture);
-            }
-        };
-    }, [useCapture]);
-    return (React.createElement("div", { ...componentProps, className: clsx('str-chat__infinite-scroll-paginator', className), ref: rootRef },
-        React.createElement("div", { className: 'str-chat__infinite-scroll-paginator__content', ref: childRef }, children)));
-};

package/dist/components/InfiniteScrollPaginator/hooks/useCursorPaginator.d.ts

@@ -1,18 +0,0 @@
-import { StateStore } from 'stream-chat';
-export type CursorPaginatorState<T> = {
-    hasNextPage: boolean;
-    items: T[];
-    latestPageItems: T[];
-    loading: boolean;
-    error?: Error;
-    next?: string | null;
-};
-export type CursorPaginatorStateStore<T> = StateStore<CursorPaginatorState<T>>;
-export type PaginationFn<T> = (next?: string) => Promise<{
-    items: T[];
-    next?: string;
-}>;
-export declare const useCursorPaginator: <T>(paginationFn: PaginationFn<T>, loadFirstPage?: boolean) => {
-    cursorPaginatorState: StateStore<CursorPaginatorState<T>>;
-    loadMore: () => Promise<void>;
-};

package/dist/components/InfiniteScrollPaginator/hooks/useCursorPaginator.js

@@ -1,41 +0,0 @@
-import uniqBy from 'lodash.uniqby';
-import { useCallback, useEffect, useMemo } from 'react';
-import { StateStore } from 'stream-chat';
-export const useCursorPaginator = (paginationFn, loadFirstPage) => {
-    const cursorPaginatorState = useMemo(() => new StateStore({
-        hasNextPage: true,
-        items: [],
-        latestPageItems: [],
-        loading: false,
-    }), []);
-    const loadMore = useCallback(async () => {
-        const { loading, next: currentNext } = cursorPaginatorState.getLatestValue();
-        if (currentNext === null || loading)
-            return;
-        cursorPaginatorState.partialNext({ loading: true });
-        try {
-            const { items, next } = await paginationFn(currentNext);
-            cursorPaginatorState.next((prev) => ({
-                ...prev,
-                hasNextPage: !!next,
-                items: uniqBy(prev.items.concat(items), 'id'),
-                latestPageItems: items,
-                next: next || null,
-            }));
-        }
-        catch (error) {
-            cursorPaginatorState.partialNext({ error: error });
-        }
-        cursorPaginatorState.partialNext({ loading: false });
-    }, [cursorPaginatorState, paginationFn]);
-    useEffect(() => {
-        const { items } = cursorPaginatorState.getLatestValue();
-        if (!loadFirstPage || items.length)
-            return;
-        loadMore();
-    }, [cursorPaginatorState, loadFirstPage, loadMore]);
-    return {
-        cursorPaginatorState,
-        loadMore,
-    };
-};

package/dist/components/InfiniteScrollPaginator/index.d.ts

@@ -1 +0,0 @@
-export * from './InfiniteScroll';

package/dist/components/InfiniteScrollPaginator/index.js

@@ -1 +0,0 @@
-export * from './InfiniteScroll';

package/dist/components/LoadMore/LoadMoreButton.d.ts

@@ -1,14 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-export type LoadMoreButtonProps = {
-    /** onClick handler load more button. Pagination logic should be executed in this handler. */
-    onClick: React.MouseEventHandler<HTMLButtonElement>;
-    /** indicates whether a loading request is in progress */
-    isLoading?: boolean;
-    /**
-     * @desc If true, LoadingIndicator is displayed instead of button
-     * @deprecated Use loading prop instead of refreshing. Planned for removal: https://github.com/GetStream/stream-chat-react/issues/1804
-     */
-    refreshing?: boolean;
-};
-export declare const LoadMoreButton: ({ children, isLoading, onClick, refreshing, }: PropsWithChildren<LoadMoreButtonProps>) => React.JSX.Element;

package/dist/components/LoadMore/LoadMoreButton.js

@@ -1,16 +0,0 @@
-import React, { useEffect } from 'react';
-import { LoadingIndicator } from '../Loading';
-import { deprecationAndReplacementWarning } from '../../utils/deprecationWarning';
-import { useTranslationContext } from '../../context';
-const UnMemoizedLoadMoreButton = ({ children, isLoading, onClick, refreshing, }) => {
-    const { t } = useTranslationContext('UnMemoizedLoadMoreButton');
-    const childrenOrDefaultString = children ?? t('Load more');
-    const loading = typeof isLoading !== 'undefined' ? isLoading : refreshing;
-    useEffect(() => {
-        deprecationAndReplacementWarning([[{ refreshing }, { isLoading }]], 'LoadMoreButton');
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    return (React.createElement("div", { className: 'str-chat__load-more-button' },
-        React.createElement("button", { "aria-label": t('aria/Load More Channels'), className: 'str-chat__load-more-button__button str-chat__cta-button', "data-testid": 'load-more-button', disabled: loading, onClick: onClick }, loading ? React.createElement(LoadingIndicator, null) : childrenOrDefaultString)));
-};
-export const LoadMoreButton = React.memo(UnMemoizedLoadMoreButton);

package/dist/components/LoadMore/LoadMorePaginator.d.ts

@@ -1,12 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import React from 'react';
-import type { LoadMoreButtonProps } from './LoadMoreButton';
-import type { PaginatorProps } from '../../types/types';
-export type LoadMorePaginatorProps = PaginatorProps & {
-    /** A UI button component that handles pagination logic */
-    LoadMoreButton?: React.ComponentType<LoadMoreButtonProps>;
-    /** indicates if the `LoadMoreButton` should be displayed at the top of the list of channels instead of the bottom of the list (the default) */
-    reverse?: boolean;
-};
-export declare const UnMemoizedLoadMorePaginator: (props: PropsWithChildren<LoadMorePaginatorProps>) => React.JSX.Element;
-export declare const LoadMorePaginator: (props: PropsWithChildren<LoadMorePaginatorProps>) => React.JSX.Element;

package/dist/components/LoadMore/LoadMorePaginator.js

@@ -1,16 +0,0 @@
-import React, { useEffect } from 'react';
-import { LoadMoreButton as DefaultLoadMoreButton } from './LoadMoreButton';
-import { deprecationAndReplacementWarning } from '../../utils/deprecationWarning';
-export const UnMemoizedLoadMorePaginator = (props) => {
-    const { children, hasNextPage, isLoading, LoadMoreButton = DefaultLoadMoreButton, loadNextPage, refreshing, reverse, } = props;
-    const loadingState = typeof isLoading !== 'undefined' ? isLoading : refreshing;
-    useEffect(() => {
-        deprecationAndReplacementWarning([[{ refreshing }, { isLoading }]], 'LoadMorePaginator');
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, []);
-    return (React.createElement(React.Fragment, null,
-        !reverse && children,
-        hasNextPage && React.createElement(LoadMoreButton, { isLoading: loadingState, onClick: loadNextPage }),
-        reverse && children));
-};
-export const LoadMorePaginator = React.memo(UnMemoizedLoadMorePaginator);

package/dist/components/LoadMore/index.d.ts

@@ -1,2 +0,0 @@
-export * from './LoadMoreButton';
-export * from './LoadMorePaginator';

package/dist/components/LoadMore/index.js

@@ -1,2 +0,0 @@
-export * from './LoadMoreButton';
-export * from './LoadMorePaginator';

package/dist/components/Loading/LoadingChannel.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const LoadingChannel: () => React.JSX.Element;

package/dist/components/Loading/LoadingChannel.js

@@ -1,20 +0,0 @@
-import React from 'react';
-const LoadingMessage = () => (React.createElement("div", { className: 'str-chat__loading-channel-message' },
-    React.createElement("div", { className: 'str-chat__loading-channel-message-avatar' }),
-    React.createElement("div", { className: 'str-chat__loading-channel-message-end' },
-        React.createElement("div", { className: 'str-chat__loading-channel-message-sender' }),
-        React.createElement("div", { className: 'str-chat__loading-channel-message-last-row' },
-            React.createElement("div", { className: 'str-chat__loading-channel-message-text' }),
-            React.createElement("div", { className: 'str-chat__loading-channel-message-date' })))));
-const LoadingMessageInput = () => (React.createElement("div", { className: 'str-chat__loading-channel-message-input-row' },
-    React.createElement("div", { className: 'str-chat__loading-channel-message-input' }),
-    React.createElement("div", { className: 'str-chat__loading-channel-message-send' })));
-const LoadingChannelHeader = () => (React.createElement("div", { className: 'str-chat__loading-channel-header' },
-    React.createElement("div", { className: 'str-chat__loading-channel-header-avatar' }),
-    React.createElement("div", { className: 'str-chat__loading-channel-header-end' },
-        React.createElement("div", { className: 'str-chat__loading-channel-header-name' }),
-        React.createElement("div", { className: 'str-chat__loading-channel-header-info' }))));
-export const LoadingChannel = () => (React.createElement("div", { className: 'str-chat__loading-channel' },
-    React.createElement(LoadingChannelHeader, null),
-    React.createElement("div", { className: 'str-chat__loading-channel-message-list' }, Array.from(Array(3)).map((_, i) => (React.createElement(LoadingMessage, { key: `loading-message-${i}` })))),
-    React.createElement(LoadingMessageInput, null)));

package/dist/components/Loading/LoadingChannels.d.ts

@@ -1,5 +0,0 @@
-import React from 'react';
-/**
- * Loading indicator for the ChannelList
- */
-export declare const LoadingChannels: React.MemoExoticComponent<() => React.JSX.Element>;

package/dist/components/Loading/LoadingChannels.js

@@ -1,14 +0,0 @@
-import React from 'react';
-const LoadingItems = () => (React.createElement("div", { className: 'str-chat__loading-channels-item str-chat__channel-preview-loading' },
-    React.createElement("div", { className: 'str-chat__loading-channels-avatar' }),
-    React.createElement("div", { className: 'str-chat__loading-channels-meta str-chat__channel-preview-end-loading' },
-        React.createElement("div", { className: 'str-chat__loading-channels-username' }),
-        React.createElement("div", { className: 'str-chat__loading-channels-status' }))));
-const UnMemoizedLoadingChannels = () => (React.createElement("div", { className: 'str-chat__loading-channels' },
-    React.createElement(LoadingItems, null),
-    React.createElement(LoadingItems, null),
-    React.createElement(LoadingItems, null)));
-/**
- * Loading indicator for the ChannelList
- */
-export const LoadingChannels = React.memo(UnMemoizedLoadingChannels);

package/dist/components/Loading/LoadingErrorIndicator.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-export type LoadingErrorIndicatorProps = {
-    /** Error object */
-    error?: Error | null;
-};
-export declare const LoadingErrorIndicator: ({ error }: LoadingErrorIndicatorProps) => React.JSX.Element | null;

package/dist/components/Loading/LoadingErrorIndicator.js

@@ -1,12 +0,0 @@
-import React from 'react';
-import { useTranslationContext } from '../../context/TranslationContext';
-/**
- * UI component for error indicator in a Channel
- */
-const UnMemoizedLoadingErrorIndicator = ({ error }) => {
-    const { t } = useTranslationContext('LoadingErrorIndicator');
-    if (!error)
-        return null;
-    return React.createElement("div", null, t('Error: {{ errorMessage }}', { errorMessage: error.message }));
-};
-export const LoadingErrorIndicator = React.memo(UnMemoizedLoadingErrorIndicator, (prevProps, nextProps) => prevProps.error?.message === nextProps.error?.message);