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

package/dist/components/Channel/channelState.d.ts

@@ -1,82 +0,0 @@
-import type { Channel, LocalMessage, MessageResponse, ChannelState as StreamChannelState } from 'stream-chat';
-import type { ChannelState } from '../../context/ChannelStateContext';
-export type ChannelStateReducerAction = {
-    type: 'closeThread';
-} | {
-    type: 'clearHighlightedMessage';
-} | {
-    channel: Channel;
-    type: 'copyMessagesFromChannel';
-    parentId?: string | null;
-} | {
-    channel: Channel;
-    type: 'copyStateFromChannelOnEvent';
-} | {
-    channel: Channel;
-    highlightedMessageId: string;
-    type: 'jumpToMessageFinished';
-} | {
-    channel: Channel;
-    hasMore: boolean;
-    type: 'initStateFromChannel';
-} | {
-    hasMore: boolean;
-    messages: LocalMessage[];
-    type: 'loadMoreFinished';
-} | {
-    hasMoreNewer: boolean;
-    messages: LocalMessage[];
-    type: 'loadMoreNewerFinished';
-} | {
-    threadHasMore: boolean;
-    threadMessages: Array<ReturnType<StreamChannelState['formatMessage']>>;
-    type: 'loadMoreThreadFinished';
-} | {
-    channel: Channel;
-    message: LocalMessage;
-    type: 'openThread';
-} | {
-    error: Error;
-    type: 'setError';
-} | {
-    loadingMore: boolean;
-    type: 'setLoadingMore';
-} | {
-    loadingMoreNewer: boolean;
-    type: 'setLoadingMoreNewer';
-} | {
-    message: LocalMessage;
-    type: 'setThread';
-} | {
-    channel: Channel;
-    type: 'setTyping';
-} | {
-    type: 'startLoadingThread';
-} | {
-    channel: Channel;
-    message: MessageResponse;
-    type: 'updateThreadOnEvent';
-} | {
-    type: 'jumpToLatestMessage';
-};
-export declare const makeChannelReducer: () => (state: ChannelState, action: ChannelStateReducerAction) => ChannelState;
-export declare const initialState: {
-    error: null;
-    hasMore: boolean;
-    hasMoreNewer: boolean;
-    loading: boolean;
-    loadingMore: boolean;
-    members: {};
-    messages: never[];
-    pinnedMessages: never[];
-    read: {};
-    suppressAutoscroll: boolean;
-    thread: null;
-    threadHasMore: boolean;
-    threadLoadingMore: boolean;
-    threadMessages: never[];
-    threadSuppressAutoscroll: boolean;
-    typing: {};
-    watcherCount: number;
-    watchers: {};
-};

package/dist/components/Channel/channelState.js

@@ -1,181 +0,0 @@
-export const makeChannelReducer = () => (state, action) => {
-    switch (action.type) {
-        case 'closeThread': {
-            return {
-                ...state,
-                thread: null,
-                threadLoadingMore: false,
-                threadMessages: [],
-            };
-        }
-        case 'copyMessagesFromChannel': {
-            const { channel, parentId } = action;
-            return {
-                ...state,
-                messages: [...channel.state.messages],
-                pinnedMessages: [...channel.state.pinnedMessages],
-                // copying messages from channel happens with new message - this resets the suppressAutoscroll
-                suppressAutoscroll: false,
-                threadMessages: parentId
-                    ? { ...channel.state.threads }[parentId] || []
-                    : state.threadMessages,
-            };
-        }
-        case 'copyStateFromChannelOnEvent': {
-            const { channel } = action;
-            return {
-                ...state,
-                members: { ...channel.state.members },
-                messages: [...channel.state.messages],
-                pinnedMessages: [...channel.state.pinnedMessages],
-                read: { ...channel.state.read },
-                watcherCount: channel.state.watcher_count,
-                watchers: { ...channel.state.watchers },
-            };
-        }
-        case 'initStateFromChannel': {
-            const { channel, hasMore } = action;
-            return {
-                ...state,
-                hasMore,
-                loading: false,
-                members: { ...channel.state.members },
-                messages: [...channel.state.messages],
-                pinnedMessages: [...channel.state.pinnedMessages],
-                read: { ...channel.state.read },
-                watcherCount: channel.state.watcher_count,
-                watchers: { ...channel.state.watchers },
-            };
-        }
-        case 'jumpToLatestMessage': {
-            return {
-                ...state,
-                hasMoreNewer: false,
-                highlightedMessageId: undefined,
-                loading: false,
-                suppressAutoscroll: false,
-            };
-        }
-        case 'jumpToMessageFinished': {
-            return {
-                ...state,
-                hasMoreNewer: action.channel.state.messagePagination.hasNext,
-                highlightedMessageId: action.highlightedMessageId,
-                messages: action.channel.state.messages,
-            };
-        }
-        case 'clearHighlightedMessage': {
-            return {
-                ...state,
-                highlightedMessageId: undefined,
-            };
-        }
-        case 'loadMoreFinished': {
-            const { hasMore, messages } = action;
-            return {
-                ...state,
-                hasMore,
-                loadingMore: false,
-                messages,
-                suppressAutoscroll: false,
-            };
-        }
-        case 'loadMoreNewerFinished': {
-            const { hasMoreNewer, messages } = action;
-            return {
-                ...state,
-                hasMoreNewer,
-                loadingMoreNewer: false,
-                messages,
-            };
-        }
-        case 'loadMoreThreadFinished': {
-            const { threadHasMore, threadMessages } = action;
-            return {
-                ...state,
-                threadHasMore,
-                threadLoadingMore: false,
-                threadMessages,
-            };
-        }
-        case 'openThread': {
-            const { channel, message } = action;
-            return {
-                ...state,
-                thread: message,
-                threadHasMore: true,
-                threadMessages: message.id
-                    ? { ...channel.state.threads }[message.id] || []
-                    : [],
-                threadSuppressAutoscroll: false,
-            };
-        }
-        case 'setError': {
-            const { error } = action;
-            return { ...state, error };
-        }
-        case 'setLoadingMore': {
-            const { loadingMore } = action;
-            // suppress the autoscroll behavior
-            return { ...state, loadingMore, suppressAutoscroll: loadingMore };
-        }
-        case 'setLoadingMoreNewer': {
-            const { loadingMoreNewer } = action;
-            return { ...state, loadingMoreNewer };
-        }
-        case 'setThread': {
-            const { message } = action;
-            return { ...state, thread: message };
-        }
-        case 'setTyping': {
-            const { channel } = action;
-            return {
-                ...state,
-                typing: { ...channel.state.typing },
-            };
-        }
-        case 'startLoadingThread': {
-            return {
-                ...state,
-                threadLoadingMore: true,
-                threadSuppressAutoscroll: true,
-            };
-        }
-        case 'updateThreadOnEvent': {
-            const { channel, message } = action;
-            if (!state.thread)
-                return state;
-            return {
-                ...state,
-                thread: message?.id === state.thread.id
-                    ? channel.state.formatMessage(message)
-                    : state.thread,
-                threadMessages: state.thread?.id
-                    ? { ...channel.state.threads }[state.thread.id] || []
-                    : [],
-            };
-        }
-        default:
-            return state;
-    }
-};
-export const initialState = {
-    error: null,
-    hasMore: true,
-    hasMoreNewer: false,
-    loading: true,
-    loadingMore: false,
-    members: {},
-    messages: [],
-    pinnedMessages: [],
-    read: {},
-    suppressAutoscroll: false,
-    thread: null,
-    threadHasMore: true,
-    threadLoadingMore: false,
-    threadMessages: [],
-    threadSuppressAutoscroll: false,
-    typing: {},
-    watcherCount: 0,
-    watchers: {},
-};

package/dist/components/Channel/constants.d.ts

@@ -1 +0,0 @@
-export declare const CHANNEL_CONTAINER_ID = "str-chat__channel";

package/dist/components/Channel/constants.js

@@ -1 +0,0 @@
-export const CHANNEL_CONTAINER_ID = 'str-chat__channel';

package/dist/components/Channel/hooks/useChannelContainerClasses.d.ts

@@ -1,9 +0,0 @@
-import type { ChatContextValue } from '../../../context/ChatContext';
-export declare const useImageFlagEmojisOnWindowsClass: () => "" | "str-chat--windows-flags";
-export declare const getChatContainerClass: (customClass?: string) => string;
-export declare const useChannelContainerClasses: ({ customClasses, }: Pick<ChatContextValue, 'customClasses'>) => {
-    channelClass: string;
-    chatClass: string;
-    chatContainerClass: string;
-    windowsEmojiClass: string;
-};

package/dist/components/Channel/hooks/useChannelContainerClasses.js

@@ -1,17 +0,0 @@
-import { useChatContext } from '../../../context/ChatContext';
-export const useImageFlagEmojisOnWindowsClass = () => {
-    const { useImageFlagEmojisOnWindows } = useChatContext('Channel');
-    return useImageFlagEmojisOnWindows && navigator.userAgent.match(/Win/)
-        ? 'str-chat--windows-flags'
-        : '';
-};
-export const getChatContainerClass = (customClass) => customClass ?? 'str-chat__container';
-export const useChannelContainerClasses = ({ customClasses, }) => {
-    const windowsEmojiClass = useImageFlagEmojisOnWindowsClass();
-    return {
-        channelClass: customClasses?.channel ?? 'str-chat__channel',
-        chatClass: customClasses?.chat ?? 'str-chat',
-        chatContainerClass: getChatContainerClass(customClasses?.chatContainer),
-        windowsEmojiClass,
-    };
-};

package/dist/components/Channel/hooks/useCreateChannelStateContext.d.ts

@@ -1,5 +0,0 @@
-import type { ChannelStateContextValue } from '../../../context/ChannelStateContext';
-export declare const useCreateChannelStateContext: (value: Omit<ChannelStateContextValue, 'channelCapabilities'> & {
-    channelCapabilitiesArray: string[];
-    skipMessageDataMemoization?: boolean;
-}) => ChannelStateContextValue;

package/dist/components/Channel/hooks/useCreateChannelStateContext.js

@@ -1,95 +0,0 @@
-import { useMemo } from 'react';
-import { isDate, isDayOrMoment } from '../../../i18n';
-export const useCreateChannelStateContext = (value) => {
-    const { channel, channelCapabilitiesArray = [], channelConfig, channelUnreadUiState, error, giphyVersion, hasMore, hasMoreNewer, highlightedMessageId, imageAttachmentSizeHandler, loading, loadingMore, members, messages = [], mutes, notifications, pinnedMessages, read = {}, shouldGenerateVideoThumbnail, skipMessageDataMemoization, suppressAutoscroll, thread, threadHasMore, threadLoadingMore, threadMessages = [], videoAttachmentSizeHandler, watcher_count, watcherCount, watchers, } = value;
-    const channelId = channel.cid;
-    const lastRead = channel.initialized && channel.lastRead()?.getTime();
-    const membersLength = Object.keys(members || []).length;
-    const notificationsLength = notifications.length;
-    const readUsers = Object.values(read);
-    const readUsersLength = readUsers.length;
-    const readUsersLastReadDateStrings = [];
-    for (const { last_read } of readUsers) {
-        if (!lastRead)
-            continue;
-        readUsersLastReadDateStrings.push(last_read?.toISOString());
-    }
-    const readUsersLastReads = readUsersLastReadDateStrings.join();
-    const threadMessagesLength = threadMessages?.length;
-    const channelCapabilities = {};
-    channelCapabilitiesArray.forEach((capability) => {
-        channelCapabilities[capability] = true;
-    });
-    // FIXME: this is crazy - I could not find out why the messages were not getting updated when only message properties that are not part
-    // of this serialization has been changed. A great example of memoization gone wrong.
-    const memoizedMessageData = skipMessageDataMemoization
-        ? messages
-        : messages
-            .map(({ deleted_at, latest_reactions, pinned, reply_count, status, type, updated_at, user, }) => `${type}${deleted_at}${latest_reactions ? latest_reactions.map(({ type }) => type).join() : ''}${pinned}${reply_count}${status}${updated_at && (isDayOrMoment(updated_at) || isDate(updated_at))
-            ? updated_at.toISOString()
-            : updated_at || ''}${user?.updated_at}`)
-            .join();
-    const memoizedThreadMessageData = threadMessages
-        .map(({ deleted_at, latest_reactions, pinned, status, updated_at, user }) => `${deleted_at}${latest_reactions ? latest_reactions.map(({ type }) => type).join() : ''}${pinned}${status}${updated_at && (isDayOrMoment(updated_at) || isDate(updated_at))
-        ? updated_at.toISOString()
-        : updated_at || ''}${user?.updated_at}`)
-        .join();
-    const channelStateContext = useMemo(() => ({
-        channel,
-        channelCapabilities,
-        channelConfig,
-        channelUnreadUiState,
-        error,
-        giphyVersion,
-        hasMore,
-        hasMoreNewer,
-        highlightedMessageId,
-        imageAttachmentSizeHandler,
-        loading,
-        loadingMore,
-        members,
-        messages,
-        mutes,
-        notifications,
-        pinnedMessages,
-        read,
-        shouldGenerateVideoThumbnail,
-        suppressAutoscroll,
-        thread,
-        threadHasMore,
-        threadLoadingMore,
-        threadMessages,
-        videoAttachmentSizeHandler,
-        watcher_count,
-        watcherCount,
-        watchers,
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [
-        channel.data?.name, // otherwise ChannelHeader will not be updated
-        channelId,
-        channelUnreadUiState,
-        error,
-        hasMore,
-        hasMoreNewer,
-        highlightedMessageId,
-        lastRead,
-        loading,
-        loadingMore,
-        membersLength,
-        memoizedMessageData,
-        memoizedThreadMessageData,
-        notificationsLength,
-        readUsersLength,
-        readUsersLastReads,
-        shouldGenerateVideoThumbnail,
-        skipMessageDataMemoization,
-        suppressAutoscroll,
-        thread,
-        threadHasMore,
-        threadLoadingMore,
-        threadMessagesLength,
-        watcherCount,
-    ]);
-    return channelStateContext;
-};

package/dist/components/Channel/hooks/useCreateTypingContext.d.ts

@@ -1,2 +0,0 @@
-import type { TypingContextValue } from '../../../context/TypingContext';
-export declare const useCreateTypingContext: (value: TypingContextValue) => TypingContextValue;

package/dist/components/Channel/hooks/useCreateTypingContext.js

@@ -1,11 +0,0 @@
-import { useMemo } from 'react';
-export const useCreateTypingContext = (value) => {
-    const { typing } = value;
-    const typingValue = Object.keys(typing || {}).join();
-    const typingContext = useMemo(() => ({
-        typing,
-    }), 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [typingValue]);
-    return typingContext;
-};

package/dist/components/Channel/hooks/useEditMessageHandler.d.ts

@@ -1,4 +0,0 @@
-import type { LocalMessage, MessageResponse, StreamChat, UpdateMessageOptions } from 'stream-chat';
-type UpdateHandler = (cid: string, updatedMessage: LocalMessage | MessageResponse, options?: UpdateMessageOptions) => ReturnType<StreamChat['updateMessage']>;
-export declare const useEditMessageHandler: (doUpdateMessageRequest?: UpdateHandler) => (updatedMessage: LocalMessage | MessageResponse, options?: UpdateMessageOptions) => Promise<import("stream-chat").UpdateMessageAPIResponse>;
-export {};

package/dist/components/Channel/hooks/useEditMessageHandler.js

@@ -1,10 +0,0 @@
-import { useChatContext } from '../../../context/ChatContext';
-export const useEditMessageHandler = (doUpdateMessageRequest) => {
-    const { channel, client } = useChatContext('useEditMessageHandler');
-    return (updatedMessage, options) => {
-        if (doUpdateMessageRequest && channel) {
-            return Promise.resolve(doUpdateMessageRequest(channel.cid, updatedMessage, options));
-        }
-        return client.updateMessage(updatedMessage, undefined, options);
-    };
-};

package/dist/components/Channel/hooks/useIsMounted.d.ts

@@ -1,2 +0,0 @@
-/// <reference types="react" />
-export declare const useIsMounted: () => import("react").RefObject<boolean>;

package/dist/components/Channel/hooks/useIsMounted.js

@@ -1,11 +0,0 @@
-import { useEffect, useRef } from 'react';
-export const useIsMounted = () => {
-    const isMounted = useRef(false);
-    useEffect(() => {
-        isMounted.current = true;
-        return () => {
-            isMounted.current = false;
-        };
-    }, []);
-    return isMounted;
-};

package/dist/components/Channel/hooks/useMentionsHandlers.d.ts

@@ -1,4 +0,0 @@
-import type React from 'react';
-import type { UserResponse } from 'stream-chat';
-export type OnMentionAction = (event: React.BaseSyntheticEvent, user?: UserResponse) => void;
-export declare const useMentionsHandlers: (onMentionsHover?: OnMentionAction, onMentionsClick?: OnMentionAction) => (event: React.BaseSyntheticEvent, mentioned_users: UserResponse[]) => void;

package/dist/components/Channel/hooks/useMentionsHandlers.js

@@ -1,23 +0,0 @@
-import { useCallback } from 'react';
-export const useMentionsHandlers = (onMentionsHover, onMentionsClick) => useCallback((event, mentioned_users) => {
-    if ((!onMentionsHover && !onMentionsClick) ||
-        !(event.target instanceof HTMLElement)) {
-        return;
-    }
-    const target = event.target;
-    const textContent = target.innerHTML.replace('*', '');
-    if (textContent[0] === '@') {
-        const userName = textContent.replace('@', '');
-        const user = mentioned_users?.find(({ id, name }) => name === userName || id === userName);
-        if (onMentionsHover &&
-            typeof onMentionsHover === 'function' &&
-            event.type === 'mouseover') {
-            onMentionsHover(event, user);
-        }
-        if (onMentionsClick &&
-            event.type === 'click' &&
-            typeof onMentionsClick === 'function') {
-            onMentionsClick(event, user);
-        }
-    }
-}, [onMentionsClick, onMentionsHover]);

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

@@ -1,3 +0,0 @@
-export * from './Channel';
-export { useEditMessageHandler as useChannelEditMessageHandler } from './hooks/useEditMessageHandler';
-export { useMentionsHandlers as useChannelMentionsHandler } from './hooks/useMentionsHandlers';

package/dist/components/Channel/index.js

@@ -1,3 +0,0 @@
-export * from './Channel';
-export { useEditMessageHandler as useChannelEditMessageHandler } from './hooks/useEditMessageHandler';
-export { useMentionsHandlers as useChannelMentionsHandler } from './hooks/useMentionsHandlers';

package/dist/components/Channel/utils.d.ts

@@ -1,37 +0,0 @@
-/// <reference types="node" />
-/// <reference types="node" />
-/// <reference types="node" />
-/// <reference types="node" />
-/// <reference types="node" />
-import type { Dispatch, SetStateAction } from 'react';
-import type { ChannelState, MessageResponse, StreamChat } from 'stream-chat';
-import type { ChannelNotifications } from '../../context/ChannelStateContext';
-export declare const makeAddNotifications: (setNotifications: Dispatch<SetStateAction<ChannelNotifications>>, notificationTimeouts: NodeJS.Timeout[]) => (text: string, type: 'success' | 'error') => void;
-/**
- * Utility function for jumpToFirstUnreadMessage
- * @param targetId
- * @param msgSet
- */
-export declare const findInMsgSetById: (targetId: string, msgSet: ReturnType<ChannelState['formatMessage']>[]) => {
-    index: number;
-    target: import("stream-chat").LocalMessage;
-} | {
-    index: number;
-    target?: undefined;
-};
-/**
- * Utility function for jumpToFirstUnreadMessage
- * @param targetDate
- * @param msgSet
- * @param exact
- */
-export declare const findInMsgSetByDate: (targetDate: Date, msgSet: MessageResponse[] | ReturnType<ChannelState['formatMessage']>[], exact?: boolean) => {
-    index: number;
-    target: import("stream-chat").LocalMessage | MessageResponse;
-} | {
-    index: number;
-    target?: undefined;
-};
-export declare const generateMessageId: ({ client }: {
-    client: StreamChat;
-}) => string;

package/dist/components/Channel/utils.js

@@ -1,66 +0,0 @@
-import { nanoid } from 'nanoid';
-export const makeAddNotifications = (setNotifications, notificationTimeouts) => (text, type) => {
-    if (typeof text !== 'string' || (type !== 'success' && type !== 'error')) {
-        return;
-    }
-    const id = nanoid();
-    setNotifications((prevNotifications) => [...prevNotifications, { id, text, type }]);
-    const timeout = setTimeout(() => setNotifications((prevNotifications) => prevNotifications.filter((notification) => notification.id !== id)), 5000);
-    notificationTimeouts.push(timeout);
-};
-/**
- * Utility function for jumpToFirstUnreadMessage
- * @param targetId
- * @param msgSet
- */
-export const findInMsgSetById = (targetId, msgSet) => {
-    for (let i = msgSet.length - 1; i >= 0; i--) {
-        const item = msgSet[i];
-        if (item.id === targetId) {
-            return {
-                index: i,
-                target: item,
-            };
-        }
-    }
-    return {
-        index: -1,
-    };
-};
-/**
- * Utility function for jumpToFirstUnreadMessage
- * @param targetDate
- * @param msgSet
- * @param exact
- */
-export const findInMsgSetByDate = (targetDate, msgSet, exact = false) => {
-    const targetTimestamp = targetDate.getTime();
-    let left = 0;
-    let middle = 0;
-    let right = msgSet.length - 1;
-    while (left <= right) {
-        middle = Math.floor((right + left) / 2);
-        const middleTimestamp = new Date(msgSet[middle].created_at).getTime();
-        const middleLeftTimestamp = msgSet[middle - 1]?.created_at &&
-            new Date(msgSet[middle - 1].created_at).getTime();
-        const middleRightTimestamp = msgSet[middle + 1]?.created_at &&
-            new Date(msgSet[middle + 1].created_at).getTime();
-        if (middleTimestamp === targetTimestamp ||
-            (middleLeftTimestamp &&
-                middleRightTimestamp &&
-                middleLeftTimestamp < targetTimestamp &&
-                targetTimestamp < middleRightTimestamp)) {
-            return { index: middle, target: msgSet[middle] };
-        }
-        if (middleTimestamp < targetTimestamp)
-            left = middle + 1;
-        else
-            right = middle - 1;
-    }
-    if (!exact ||
-        new Date(msgSet[left].created_at).getTime() === targetTimestamp) {
-        return { index: left, target: msgSet[left] };
-    }
-    return { index: -1 };
-};
-export const generateMessageId = ({ client }) => `${client.userID}-${nanoid()}`;

package/dist/components/ChannelHeader/ChannelHeader.d.ts

@@ -1,18 +0,0 @@
-import React from 'react';
-import type { ChannelAvatarProps } from '../Avatar';
-export type ChannelHeaderProps = {
-    /** UI component to display an avatar, defaults to [Avatar](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Avatar/Avatar.tsx) component and accepts the same props as: [ChannelAvatar](https://github.com/GetStream/stream-chat-react/blob/master/src/components/Avatar/ChannelAvatar.tsx) */
-    Avatar?: React.ComponentType<ChannelAvatarProps>;
-    /** Manually set the image to render, defaults to the Channel image */
-    image?: string;
-    /** Show a little indicator that the Channel is live right now */
-    live?: boolean;
-    /** UI component to display menu icon, defaults to [MenuIcon](https://github.com/GetStream/stream-chat-react/blob/master/src/components/ChannelHeader/ChannelHeader.tsx)*/
-    MenuIcon?: React.ComponentType;
-    /** Set title manually */
-    title?: string;
-};
-/**
- * The ChannelHeader component renders some basic information about a Channel.
- */
-export declare const ChannelHeader: (props: ChannelHeaderProps) => React.JSX.Element;

package/dist/components/ChannelHeader/ChannelHeader.js

@@ -1,40 +0,0 @@
-import React from 'react';
-import { MenuIcon as DefaultMenuIcon } from './icons';
-import { Avatar as DefaultAvatar } from '../Avatar';
-import { useChannelPreviewInfo } from '../ChannelPreview/hooks/useChannelPreviewInfo';
-import { useChannelStateContext } from '../../context/ChannelStateContext';
-import { useChatContext } from '../../context/ChatContext';
-import { useTranslationContext } from '../../context/TranslationContext';
-/**
- * The ChannelHeader component renders some basic information about a Channel.
- */
-export const ChannelHeader = (props) => {
-    const { Avatar = DefaultAvatar, image: overrideImage, live, MenuIcon = DefaultMenuIcon, title: overrideTitle, } = props;
-    const { channel, watcher_count } = useChannelStateContext('ChannelHeader');
-    const { openMobileNav } = useChatContext('ChannelHeader');
-    const { t } = useTranslationContext('ChannelHeader');
-    const { displayImage, displayTitle, groupChannelDisplayInfo } = useChannelPreviewInfo({
-        channel,
-        overrideImage,
-        overrideTitle,
-    });
-    const { member_count, subtitle } = channel?.data || {};
-    return (React.createElement("div", { className: 'str-chat__channel-header' },
-        React.createElement("button", { "aria-label": t('aria/Menu'), className: 'str-chat__header-hamburger', onClick: openMobileNav },
-            React.createElement(MenuIcon, null)),
-        React.createElement(Avatar, { className: 'str-chat__avatar--channel-header', groupChannelDisplayInfo: groupChannelDisplayInfo, image: displayImage, name: displayTitle }),
-        React.createElement("div", { className: 'str-chat__channel-header-end' },
-            React.createElement("p", { className: 'str-chat__channel-header-title' },
-                displayTitle,
-                ' ',
-                live && (React.createElement("span", { className: 'str-chat__header-livestream-livelabel' }, t('live')))),
-            subtitle && React.createElement("p", { className: 'str-chat__channel-header-subtitle' }, subtitle),
-            React.createElement("p", { className: 'str-chat__channel-header-info' },
-                !live && !!member_count && member_count > 0 && (React.createElement(React.Fragment, null,
-                    t('{{ memberCount }} members', {
-                        memberCount: member_count,
-                    }),
-                    ",",
-                    ' ')),
-                t('{{ watcherCount }} online', { watcherCount: watcher_count })))));
-};

package/dist/components/ChannelHeader/icons.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare const MenuIcon: ({ title }: {
-    title?: string;
-}) => React.JSX.Element;