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

package/dist/experimental/MessageActions/MessageActions.js

@@ -1,47 +0,0 @@
-import clsx from 'clsx';
-import React, { useState } from 'react';
-import { useChatContext, useMessageContext, useTranslationContext } from '../../context';
-import { ActionsIcon } from '../../components/Message/icons';
-import { DialogAnchor, useDialogIsOpen, useDialogOnNearestManager, } from '../../components/Dialog';
-import { MessageActionsWrapper } from '../../components/MessageActions/MessageActions';
-import { useBaseMessageActionSetFilter, useSplitMessageActionSet } from './hooks';
-import { defaultMessageActionSet } from './defaults';
-// TODO: allow passing down customWrapperClass
-/**
- * A new actions component to replace current `MessageOptions` component.
- * Exports from `stream-chat-react/experimental` __MIGHT__ change - use with caution
- * and follow release notes in case you notice unexpected behavior.
- */
-export const MessageActions = ({ disableBaseMessageActionSetFilter = false, messageActionSet = defaultMessageActionSet, }) => {
-    const { theme } = useChatContext();
-    const { isMyMessage, message } = useMessageContext();
-    const { t } = useTranslationContext();
-    const [actionsBoxButtonElement, setActionsBoxButtonElement] = useState(null);
-    const filteredMessageActionSet = useBaseMessageActionSetFilter(messageActionSet, disableBaseMessageActionSetFilter);
-    const { dropdownActionSet, quickActionSet } = useSplitMessageActionSet(filteredMessageActionSet);
-    const dropdownDialogId = `message-actions--${message.id}`;
-    const reactionSelectorDialogId = `reaction-selector--${message.id}`;
-    const { dialog, dialogManager } = useDialogOnNearestManager({ id: dropdownDialogId });
-    const dropdownDialogIsOpen = useDialogIsOpen(dropdownDialogId, dialogManager?.id);
-    const reactionSelectorDialogIsOpen = useDialogIsOpen(reactionSelectorDialogId, dialogManager?.id);
-    // do not render anything if total action count is zero
-    if (dropdownActionSet.length + quickActionSet.length === 0) {
-        return null;
-    }
-    return (React.createElement("div", { className: clsx(`str-chat__message-${theme}__actions str-chat__message-options`, {
-            'str-chat__message-options--active': dropdownDialogIsOpen || reactionSelectorDialogIsOpen,
-        }) },
-        dropdownActionSet.length > 0 && (React.createElement(MessageActionsWrapper, { inline: false, toggleOpen: dialog?.toggle },
-            React.createElement("button", { "aria-expanded": dropdownDialogIsOpen, "aria-haspopup": 'true', "aria-label": t('aria/Open Message Actions Menu'), className: 'str-chat__message-actions-box-button', "data-testid": 'message-actions-toggle-button', ref: setActionsBoxButtonElement },
-                React.createElement(ActionsIcon, { className: 'str-chat__message-action-icon' })),
-            React.createElement(DialogAnchor, { dialogManagerId: dialogManager?.id, id: dropdownDialogId, placement: isMyMessage() ? 'top-end' : 'top-start', referenceElement: actionsBoxButtonElement, tabIndex: -1, trapFocus: true },
-                React.createElement(DropdownBox, { open: dropdownDialogIsOpen }, dropdownActionSet.map(({ Component: DropdownActionComponent, type }) => (React.createElement(DropdownActionComponent, { key: type }))))))),
-        quickActionSet.map(({ Component: QuickActionComponent, type }) => (React.createElement(QuickActionComponent, { key: type })))));
-};
-const DropdownBox = ({ children, open }) => {
-    const { t } = useTranslationContext();
-    return (React.createElement("div", { className: clsx('str-chat__message-actions-box', {
-            'str-chat__message-actions-box--open': open,
-        }) },
-        React.createElement("div", { "aria-label": t('aria/Message Options'), className: 'str-chat__message-actions-list', role: 'listbox' }, children)));
-};

package/dist/experimental/MessageActions/defaults.d.ts

@@ -1,5 +0,0 @@
-import type { ComponentPropsWithoutRef } from 'react';
-import React from 'react';
-import type { MessageActionSetItem } from './MessageActions';
-export declare const DefaultDropdownActionButton: ({ "aria-selected": ariaSelected, children, className, role, ...rest }: ComponentPropsWithoutRef<'button'>) => React.JSX.Element;
-export declare const defaultMessageActionSet: MessageActionSetItem[];

package/dist/experimental/MessageActions/defaults.js

@@ -1,141 +0,0 @@
-import React from 'react';
-import { isUserMuted, useMessageComposer, useMessageReminder } from '../../components';
-import { ReactionIcon as DefaultReactionIcon, ThreadIcon, } from '../../components/Message/icons';
-import { ReactionSelectorWithButton } from '../../components/Reactions/ReactionSelectorWithButton';
-import { useChatContext, useMessageContext, useTranslationContext } from '../../context';
-import { RemindMeActionButton } from '../../components/MessageActions/RemindMeSubmenu';
-const msgActionsBoxButtonClassName = 'str-chat__message-actions-list-item-button';
-export const DefaultDropdownActionButton = ({ 'aria-selected': ariaSelected = 'false', children, className = msgActionsBoxButtonClassName, role = 'option', ...rest }) => (React.createElement("button", { "aria-selected": ariaSelected, className: className, role: role, ...rest }, children));
-const DefaultMessageActionComponents = {
-    dropdown: {
-        Quote() {
-            const { message } = useMessageContext();
-            const { t } = useTranslationContext();
-            const messageComposer = useMessageComposer();
-            const handleQuote = () => {
-                messageComposer.setQuotedMessage(message);
-                const elements = message.parent_id
-                    ? document.querySelectorAll('.str-chat__thread .str-chat__textarea__textarea')
-                    : document.getElementsByClassName('str-chat__textarea__textarea');
-                const textarea = elements.item(0);
-                if (textarea instanceof HTMLTextAreaElement) {
-                    textarea.focus();
-                }
-            };
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleQuote }, t('Quote')));
-        },
-        Pin() {
-            const { handlePin, message } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handlePin }, !message.pinned ? t('Pin') : t('Unpin')));
-        },
-        MarkUnread() {
-            const { handleMarkUnread } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleMarkUnread }, t('Mark as unread')));
-        },
-        Flag() {
-            const { handleFlag } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleFlag }, t('Flag')));
-        },
-        Mute() {
-            const { handleMute, message } = useMessageContext();
-            const { mutes } = useChatContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleMute }, isUserMuted(message, mutes) ? t('Unmute') : t('Mute')));
-        },
-        Edit() {
-            const { handleEdit } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleEdit }, t('Edit Message')));
-        },
-        Delete() {
-            const { handleDelete } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement(DefaultDropdownActionButton, { onClick: handleDelete }, t('Delete')));
-        },
-        RemindMe() {
-            const { isMyMessage } = useMessageContext();
-            return (React.createElement(RemindMeActionButton, { className: msgActionsBoxButtonClassName, isMine: isMyMessage() }));
-        },
-        SaveForLater() {
-            const { client } = useChatContext();
-            const { message } = useMessageContext();
-            const { t } = useTranslationContext();
-            const reminder = useMessageReminder(message.id);
-            return (React.createElement(DefaultDropdownActionButton, { onClick: () => reminder
-                    ? client.reminders.deleteReminder(reminder.id)
-                    : client.reminders.createReminder({ messageId: message.id }) }, reminder ? t('Remove reminder') : t('Save for later')));
-        },
-    },
-    quick: {
-        React() {
-            return React.createElement(ReactionSelectorWithButton, { ReactionIcon: DefaultReactionIcon });
-        },
-        Reply() {
-            const { handleOpenThread } = useMessageContext();
-            const { t } = useTranslationContext();
-            return (React.createElement("button", { "aria-label": t('aria/Open Thread'), className: 'str-chat__message-reply-in-thread-button', "data-testid": 'thread-action', onClick: handleOpenThread },
-                React.createElement(ThreadIcon, { className: 'str-chat__message-action-icon' })));
-        },
-    },
-};
-export const defaultMessageActionSet = [
-    // { placement: 'dropdown', type: 'block' },
-    {
-        Component: DefaultMessageActionComponents.quick.Reply,
-        placement: 'quick',
-        type: 'reply',
-    },
-    {
-        Component: DefaultMessageActionComponents.quick.React,
-        placement: 'quick',
-        type: 'react',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Delete,
-        placement: 'dropdown',
-        type: 'delete',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Edit,
-        placement: 'dropdown',
-        type: 'edit',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Mute,
-        placement: 'dropdown',
-        type: 'mute',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Flag,
-        placement: 'dropdown',
-        type: 'flag',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Pin,
-        placement: 'dropdown',
-        type: 'pin',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.Quote,
-        placement: 'dropdown',
-        type: 'quote',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.MarkUnread,
-        placement: 'dropdown',
-        type: 'markUnread',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.RemindMe,
-        placement: 'dropdown',
-        type: 'remindMe',
-    },
-    {
-        Component: DefaultMessageActionComponents.dropdown.SaveForLater,
-        placement: 'dropdown',
-        type: 'saveForLater',
-    },
-];

package/dist/experimental/MessageActions/hooks/index.d.ts

@@ -1,2 +0,0 @@
-export * from './useBaseMessageActionSetFilter';
-export * from './useSplitMessageActionSet';

package/dist/experimental/MessageActions/hooks/index.js

@@ -1,2 +0,0 @@
-export * from './useBaseMessageActionSetFilter';
-export * from './useSplitMessageActionSet';

package/dist/experimental/MessageActions/hooks/useBaseMessageActionSetFilter.d.ts

@@ -1,8 +0,0 @@
-import type { MessageActionSetItem } from '../MessageActions';
-/**
- * Base filter hook which covers actions of type `delete`, `edit`,
- * `flag`, `markUnread`, `mute`, `quote`, `react` and `reply`, whether
- * the rendered message is a reply (replies are limited to certain actions) and
- * whether the message has appropriate type and status.
- */
-export declare const useBaseMessageActionSetFilter: (messageActionSet: MessageActionSetItem[], disable?: boolean) => MessageActionSetItem[];

package/dist/experimental/MessageActions/hooks/useBaseMessageActionSetFilter.js

@@ -1,61 +0,0 @@
-import { useMemo } from 'react';
-import { ACTIONS_NOT_WORKING_IN_THREAD, useUserRole } from '../../../components';
-import { useChannelStateContext, useMessageContext } from '../../../context';
-/**
- * Base filter hook which covers actions of type `delete`, `edit`,
- * `flag`, `markUnread`, `mute`, `quote`, `react` and `reply`, whether
- * the rendered message is a reply (replies are limited to certain actions) and
- * whether the message has appropriate type and status.
- */
-export const useBaseMessageActionSetFilter = (messageActionSet, disable = false) => {
-    const { initialMessage: isInitialMessage, message } = useMessageContext();
-    const { channelConfig } = useChannelStateContext();
-    const { canDelete, canEdit, canFlag, canMarkUnread, canMute, canQuote, canReact, canReply, } = useUserRole(message);
-    const isMessageThreadReply = typeof message.parent_id === 'string';
-    return useMemo(() => {
-        if (disable)
-            return messageActionSet;
-        // filter out all actions if any of these are true
-        if (isInitialMessage || // not sure whether this thing even works anymore
-            !message.type ||
-            message.type === 'error' ||
-            message.type === 'system' ||
-            message.type === 'ephemeral' ||
-            message.status === 'failed' ||
-            message.status === 'sending')
-            return [];
-        return messageActionSet.filter(({ type }) => {
-            // filter out actions with types that do not work in thread
-            if (ACTIONS_NOT_WORKING_IN_THREAD.includes(type) && isMessageThreadReply)
-                return false;
-            if ((type === 'delete' && !canDelete) ||
-                (type === 'edit' && !canEdit) ||
-                (type === 'flag' && !canFlag) ||
-                (type === 'markUnread' && !canMarkUnread) ||
-                (type === 'mute' && !canMute) ||
-                (type === 'quote' && !canQuote) ||
-                (type === 'react' && !canReact) ||
-                (type === 'reply' && !canReply) ||
-                (type === 'remindMe' && !channelConfig?.['user_message_reminders']) ||
-                (type === 'saveForLater' && !channelConfig?.['user_message_reminders']))
-                return false;
-            return true;
-        });
-    }, [
-        canDelete,
-        canEdit,
-        canFlag,
-        canMarkUnread,
-        canMute,
-        canQuote,
-        canReact,
-        canReply,
-        channelConfig,
-        isInitialMessage,
-        isMessageThreadReply,
-        message.status,
-        message.type,
-        disable,
-        messageActionSet,
-    ]);
-};

package/dist/experimental/MessageActions/hooks/useSplitMessageActionSet.d.ts

@@ -1,5 +0,0 @@
-import type { MessageActionSetItem } from '../MessageActions';
-export declare const useSplitMessageActionSet: (messageActionSet: MessageActionSetItem[]) => {
-    dropdownActionSet: MessageActionSetItem[];
-    quickActionSet: MessageActionSetItem[];
-};

package/dist/experimental/MessageActions/hooks/useSplitMessageActionSet.js

@@ -1,12 +0,0 @@
-import { useMemo } from 'react';
-export const useSplitMessageActionSet = (messageActionSet) => useMemo(() => {
-    const quickActionSet = [];
-    const dropdownActionSet = [];
-    for (const action of messageActionSet) {
-        if (action.placement === 'quick')
-            quickActionSet.push(action);
-        if (action.placement === 'dropdown')
-            dropdownActionSet.push(action);
-    }
-    return { dropdownActionSet, quickActionSet };
-}, [messageActionSet]);

package/dist/experimental/MessageActions/index.d.ts

@@ -1,3 +0,0 @@
-export * from './MessageActions';
-export * from './defaults';
-export * from './hooks';

package/dist/experimental/MessageActions/index.js

@@ -1,3 +0,0 @@
-export * from './MessageActions';
-export * from './defaults';
-export * from './hooks';

package/dist/experimental/Search/Search.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-export type SearchProps = {
-    directMessagingChannelType?: string;
-    /** Sets the input element into disabled state */
-    disabled?: boolean;
-    /** Clear search state / results on every click outside the search input, defaults to false */
-    exitSearchOnInputBlur?: boolean;
-    /** Custom placeholder text to be displayed in the search input */
-    placeholder?: string;
-};
-export declare const Search: ({ directMessagingChannelType, disabled, exitSearchOnInputBlur, placeholder, }: SearchProps) => React.JSX.Element;

package/dist/experimental/Search/Search.js

@@ -1,25 +0,0 @@
-import clsx from 'clsx';
-import React from 'react';
-import { SearchBar as DefaultSearchBar } from './SearchBar/SearchBar';
-import { SearchResults as DefaultSearchResults } from './SearchResults/SearchResults';
-import { SearchContextProvider } from './SearchContext';
-import { useChatContext, useComponentContext } from '../../context';
-import { useStateStore } from '../../store';
-const searchControllerStateSelector = (nextValue) => ({ isActive: nextValue.isActive });
-export const Search = ({ directMessagingChannelType = 'messaging', disabled, exitSearchOnInputBlur, placeholder, }) => {
-    const { SearchBar = DefaultSearchBar, SearchResults = DefaultSearchResults } = useComponentContext();
-    const { searchController } = useChatContext();
-    const { isActive } = useStateStore(searchController.state, searchControllerStateSelector);
-    return (React.createElement(SearchContextProvider, { value: {
-            directMessagingChannelType,
-            disabled,
-            exitSearchOnInputBlur,
-            placeholder,
-            searchController,
-        } },
-        React.createElement("div", { className: clsx('str-chat__search', {
-                'str-chat__search--active': isActive,
-            }), "data-testid": 'search' },
-            React.createElement(SearchBar, null),
-            React.createElement(SearchResults, null))));
-};

package/dist/experimental/Search/SearchBar/SearchBar.d.ts

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

package/dist/experimental/Search/SearchBar/SearchBar.js

@@ -1,56 +0,0 @@
-import clsx from 'clsx';
-import React, { useEffect, useState } from 'react';
-import { useSearchContext } from '../SearchContext';
-import { useSearchQueriesInProgress } from '../hooks';
-import { useTranslationContext } from '../../../context';
-import { useStateStore } from '../../../store';
-const searchControllerStateSelector = (nextValue) => ({
-    isActive: nextValue.isActive,
-    searchQuery: nextValue.searchQuery,
-});
-export const SearchBar = () => {
-    const { t } = useTranslationContext();
-    const { disabled, exitSearchOnInputBlur, placeholder, searchController } = useSearchContext();
-    const queriesInProgress = useSearchQueriesInProgress(searchController);
-    const [input, setInput] = useState(null);
-    const { isActive, searchQuery } = useStateStore(searchController.state, searchControllerStateSelector);
-    useEffect(() => {
-        if (!input)
-            return;
-        const handleKeyDown = (event) => {
-            if (event.key === 'Escape') {
-                input.blur();
-                searchController.exit();
-            }
-        };
-        document.addEventListener('keydown', handleKeyDown);
-        return () => {
-            document.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [searchController, input]);
-    return (React.createElement("div", { className: 'str-chat__search-bar', "data-testid": 'search-bar' },
-        React.createElement("div", { className: clsx('str-chat__search-input--wrapper', {
-                'str-chat__search-input--wrapper-active': isActive,
-            }) },
-            React.createElement("div", { className: 'str-chat__search-input--icon' }),
-            React.createElement("input", { className: 'str-chat__search-input', "data-testid": 'search-input', disabled: disabled, onBlur: () => {
-                    if (exitSearchOnInputBlur)
-                        searchController.exit();
-                }, onChange: (event) => {
-                    if (event.target.value) {
-                        searchController.search(event.target.value);
-                    }
-                    else if (!event.target.value) {
-                        searchController.clear();
-                    }
-                }, onFocus: searchController.activate, placeholder: placeholder ?? t('Search'), ref: setInput, type: 'text', value: searchQuery }),
-            searchQuery && (React.createElement("button", { className: 'str-chat__search-input--clear-button', "data-testid": 'clear-input-button', disabled: queriesInProgress.length > 0, onClick: () => {
-                    searchController.clear();
-                    input?.focus();
-                } },
-                React.createElement("div", { className: 'str-chat__search-input--clear-button-icon' })))),
-        isActive ? (React.createElement("button", { className: clsx('str-chat__search-bar-button str-chat__search-bar-button--exit-search'), "data-testid": 'search-bar-button', onClick: () => {
-                input?.blur();
-                searchController.exit();
-            } }, t('Cancel'))) : null));
-};

package/dist/experimental/Search/SearchBar/index.d.ts

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

package/dist/experimental/Search/SearchBar/index.js

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

package/dist/experimental/Search/SearchContext.d.ts

@@ -1,23 +0,0 @@
-import React from 'react';
-import type { PropsWithChildren } from 'react';
-import type { SearchController } from 'stream-chat';
-export type SearchContextValue = {
-    /** The type of channel to create on user result select, defaults to `messaging` */
-    directMessagingChannelType: string;
-    /** Instance of the search controller that handles the data management */
-    searchController: SearchController;
-    /** Sets the input element into disabled state */
-    disabled?: boolean;
-    /** Clear search state / results on every click outside the search input, defaults to true */
-    exitSearchOnInputBlur?: boolean;
-    /** Custom placeholder text to be displayed in the search input */
-    placeholder?: string;
-};
-export declare const SearchContext: React.Context<SearchContextValue | undefined>;
-/**
- * Context provider for components rendered within the `Search` component
- */
-export declare const SearchContextProvider: ({ children, value, }: PropsWithChildren<{
-    value: SearchContextValue;
-}>) => React.JSX.Element;
-export declare const useSearchContext: () => SearchContextValue;

package/dist/experimental/Search/SearchContext.js

@@ -1,10 +0,0 @@
-import React, { createContext, useContext } from 'react';
-export const SearchContext = createContext(undefined);
-/**
- * Context provider for components rendered within the `Search` component
- */
-export const SearchContextProvider = ({ children, value, }) => (React.createElement(SearchContext.Provider, { value: value }, children));
-export const useSearchContext = () => {
-    const contextValue = useContext(SearchContext);
-    return contextValue;
-};

package/dist/experimental/Search/SearchResults/SearchResultItem.d.ts

@@ -1,19 +0,0 @@
-import React from 'react';
-import type { ComponentType } from 'react';
-import type { Channel, MessageResponse, User } from 'stream-chat';
-export type ChannelSearchResultItemProps = {
-    item: Channel;
-};
-export declare const ChannelSearchResultItem: ({ item }: ChannelSearchResultItemProps) => React.JSX.Element;
-export type ChannelByMessageSearchResultItemProps = {
-    item: MessageResponse;
-};
-export declare const MessageSearchResultItem: ({ item, }: ChannelByMessageSearchResultItemProps) => React.JSX.Element | undefined;
-export type UserSearchResultItemProps = {
-    item: User;
-};
-export declare const UserSearchResultItem: ({ item }: UserSearchResultItemProps) => React.JSX.Element;
-export type SearchResultItemComponents = Record<string, ComponentType<{
-    item: any;
-}>>;
-export declare const DefaultSearchResultItems: SearchResultItemComponents;

package/dist/experimental/Search/SearchResults/SearchResultItem.js

@@ -1,62 +0,0 @@
-import React, { useCallback, useMemo } from 'react';
-import uniqBy from 'lodash.uniqby';
-import { useSearchContext } from '../SearchContext';
-import { Avatar } from '../../../components/Avatar';
-import { ChannelPreview } from '../../../components/ChannelPreview';
-import { useChannelListContext, useChatContext } from '../../../context';
-import { DEFAULT_JUMP_TO_PAGE_SIZE } from '../../../constants/limits';
-export const ChannelSearchResultItem = ({ item }) => {
-    const { setActiveChannel } = useChatContext();
-    const { setChannels } = useChannelListContext();
-    const onSelect = useCallback(() => {
-        setActiveChannel(item);
-        setChannels?.((channels) => uniqBy([item, ...channels], 'cid'));
-    }, [item, setActiveChannel, setChannels]);
-    return (React.createElement(ChannelPreview, { channel: item, className: 'str-chat__search-result', onSelect: onSelect }));
-};
-export const MessageSearchResultItem = ({ item, }) => {
-    const { channel: activeChannel, client, searchController, setActiveChannel, } = useChatContext();
-    const { setChannels } = useChannelListContext();
-    const channel = useMemo(() => {
-        const { channel: channelData } = item;
-        const type = channelData?.type ?? 'unknown';
-        const id = channelData?.id ?? 'unknown';
-        return client.channel(type, id);
-    }, [client, item]);
-    const onSelect = useCallback(async () => {
-        if (!channel)
-            return;
-        await channel.state.loadMessageIntoState(item.id, undefined, DEFAULT_JUMP_TO_PAGE_SIZE);
-        // FIXME: message focus should be handled by yet non-existent msg list controller in client packaged
-        searchController._internalState.partialNext({ focusedMessage: item });
-        setActiveChannel(channel);
-        setChannels?.((channels) => uniqBy([channel, ...channels], 'cid'));
-    }, [channel, item, searchController, setActiveChannel, setChannels]);
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    const getLatestMessagePreview = useCallback(() => item.text, [item]);
-    if (!channel)
-        return;
-    return (React.createElement(ChannelPreview, { active: channel.cid === activeChannel?.cid &&
-            item.id === searchController._internalState.getLatestValue().focusedMessage?.id, channel: channel, className: 'str-chat__search-result', getLatestMessagePreview: getLatestMessagePreview, onSelect: onSelect }));
-};
-export const UserSearchResultItem = ({ item }) => {
-    const { client, setActiveChannel } = useChatContext();
-    const { setChannels } = useChannelListContext();
-    const { directMessagingChannelType } = useSearchContext();
-    const onClick = useCallback(() => {
-        const newChannel = client.channel(directMessagingChannelType, {
-            members: [client.userID, item.id],
-        });
-        newChannel.watch();
-        setActiveChannel(newChannel);
-        setChannels?.((channels) => uniqBy([newChannel, ...channels], 'cid'));
-    }, [client, item, setActiveChannel, setChannels, directMessagingChannelType]);
-    return (React.createElement("button", { "aria-label": `Select User Channel: ${item.name || ''}`, className: 'str-chat__search-result', "data-testid": 'search-result-user', onClick: onClick, role: 'option' },
-        React.createElement(Avatar, { className: 'str-chat__avatar--channel-preview', image: item.image, name: item.name || item.id, user: item }),
-        React.createElement("div", { className: 'str-chat__search-result--display-name' }, item.name || item.id)));
-};
-export const DefaultSearchResultItems = {
-    channels: ChannelSearchResultItem,
-    messages: MessageSearchResultItem,
-    users: UserSearchResultItem,
-};

package/dist/experimental/Search/SearchResults/SearchResults.d.ts

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

package/dist/experimental/Search/SearchResults/SearchResults.js

@@ -1,21 +0,0 @@
-import React from 'react';
-import { SearchSourceResults as DefaultSourceSearchResults } from './SearchSourceResults';
-import { SearchResultsHeader as DefaultSearchResultsHeader } from './SearchResultsHeader';
-import { SearchResultsPresearch as DefaultSearchResultsPresearch } from './SearchResultsPresearch';
-import { useSearchContext } from '../SearchContext';
-import { useComponentContext, useTranslationContext } from '../../../context';
-import { useStateStore } from '../../../store';
-const searchControllerStateSelector = (nextValue) => ({
-    activeSources: nextValue.sources.filter((s) => s.isActive),
-    isActive: nextValue.isActive,
-    searchQuery: nextValue.searchQuery,
-});
-export const SearchResults = () => {
-    const { t } = useTranslationContext('ResultsContainer');
-    const { SearchResultsHeader = DefaultSearchResultsHeader, SearchResultsPresearch = DefaultSearchResultsPresearch, SearchSourceResults = DefaultSourceSearchResults, } = useComponentContext();
-    const { searchController } = useSearchContext();
-    const { activeSources, isActive, searchQuery } = useStateStore(searchController.state, searchControllerStateSelector);
-    return !isActive ? null : (React.createElement("div", { "aria-label": t('aria/Search results'), className: 'str-chat__search-results' },
-        React.createElement(SearchResultsHeader, null),
-        !searchQuery ? (React.createElement(SearchResultsPresearch, { activeSources: activeSources })) : (activeSources.map((source) => (React.createElement(SearchSourceResults, { key: source.type, searchSource: source }))))));
-};

package/dist/experimental/Search/SearchResults/SearchResultsHeader.d.ts

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

package/dist/experimental/Search/SearchResults/SearchResultsHeader.js

@@ -1,36 +0,0 @@
-import clsx from 'clsx';
-import React, { useMemo } from 'react';
-import { useSearchContext } from '../SearchContext';
-import { useTranslationContext } from '../../../context';
-import { useStateStore } from '../../../store';
-const searchSourceStateSelector = (nextValue) => ({
-    isActive: nextValue.isActive,
-});
-const SearchSourceFilterButton = ({ source }) => {
-    const { t } = useTranslationContext();
-    const { searchController } = useSearchContext();
-    const { isActive } = useStateStore(source.state, searchSourceStateSelector);
-    const label = `search-results-header-filter-source-button-label--${source.type}`;
-    const knownLabels = useMemo(() => ({
-        'search-results-header-filter-source-button-label--channels': t('search-results-header-filter-source-button-label--channels'),
-        'search-results-header-filter-source-button-label--messages': t('search-results-header-filter-source-button-label--messages'),
-        'search-results-header-filter-source-button-label--users': t('search-results-header-filter-source-button-label--users'),
-    }), [t]);
-    return (React.createElement("button", { "aria-label": t('aria/Search results header filter button'), className: clsx('str-chat__search-results-header__filter-source-button', {
-            'str-chat__search-results-header__filter-source-button--active': isActive,
-        }), key: label, onClick: () => {
-            if (source.isActive) {
-                searchController.deactivateSource(source.type);
-            }
-            else {
-                searchController.activateSource(source.type);
-                if (searchController.searchQuery && !source.items?.length)
-                    source.search(searchController.searchQuery);
-            }
-        } }, knownLabels[label] ?? t(label)));
-};
-export const SearchResultsHeader = () => {
-    const { searchController } = useSearchContext();
-    return (React.createElement("div", { className: 'str-chat__search-results-header', "data-testid": 'search-results-header' },
-        React.createElement("div", { className: 'str-chat__search-results-header__filter-source-buttons', "data-testid": 'filter-source-buttons' }, searchController.sources.map((source) => (React.createElement(SearchSourceFilterButton, { key: `search-source-filter-button-${source.type}`, source: source }))))));
-};

package/dist/experimental/Search/SearchResults/SearchResultsPresearch.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-import type { SearchSource } from 'stream-chat';
-export type SearchResultsPresearchProps = {
-    activeSources: SearchSource[];
-};
-export declare const SearchResultsPresearch: () => React.JSX.Element;

package/dist/experimental/Search/SearchResults/SearchResultsPresearch.js

@@ -1,6 +0,0 @@
-import React from 'react';
-import { useTranslationContext } from '../../../context';
-export const SearchResultsPresearch = () => {
-    const { t } = useTranslationContext();
-    return (React.createElement("div", { className: 'str-chat__search-results-presearch' }, t('Start typing to search')));
-};

package/dist/experimental/Search/SearchResults/SearchSourceResultList.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import type { SearchResultItemComponents } from './SearchResultItem';
-export type SearchSourceResultListProps = {
-    loadMoreDebounceMs?: number;
-    loadMoreThresholdPx?: number;
-    SearchResultItems?: SearchResultItemComponents;
-};
-export declare const SearchSourceResultList: ({ loadMoreDebounceMs, loadMoreThresholdPx, SearchResultItems, }: SearchSourceResultListProps) => React.JSX.Element | null;