stream-chat-react/dist/types/components/ChatView/ChatView.d.ts

React components to create chat conversations or livestream style chat

import React, { type ComponentType } from 'react';
import { type ButtonProps } from '../Button';
import type { PropsWithChildren } from 'react';
import type { Thread } from 'stream-chat';
export type ChatView = 'channels' | 'threads';
/**
 * ChatView accessibility contract (WAI-ARIA Tabs):
 * 1) Selector container is role="tablist".
 * 2) Each selector button is role="tab", with id + aria-controls=<panel-id>.
 * 3) Each view container is role="tabpanel", with id + aria-labelledby=<tab-id>.
 * 4) Tab activation updates the active panel.
 * 5) Tabs are always tabbable (tabIndex=0), so users can reach both without
 *    arrow-key navigation.
 */
type ChatViewContextValue = {
    activeChatView: ChatView;
    setActiveChatView: (cv: ChatView) => void;
};
export declare const ChatViewContext: React.Context<ChatViewContextValue | undefined>;
export declare const useChatViewContext: () => ChatViewContextValue;
export declare const ChatView: {
    ({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
    Channels: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element | null;
    Threads: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element | null;
    ThreadAdapter: ({ children }: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
    Selector: ({ iconOnly, itemSet, }: ChatViewSelectorProps) => import("react/jsx-runtime").JSX.Element;
};
export type ThreadsViewContextValue = {
    activeThread: Thread | undefined;
    setActiveThread: (cv: ThreadsViewContextValue['activeThread']) => void;
};
export declare const useThreadsViewContext: () => ThreadsViewContextValue;
export declare const useActiveThread: ({ activeThread }: {
    activeThread?: Thread;
}) => void;
export declare const ChatViewSelectorButton: ({ ActiveIcon, children, className, Icon, iconOnly, isActive, text, ...props }: ButtonProps & {
    ActiveIcon?: ComponentType;
    iconOnly?: boolean;
    Icon?: ComponentType;
    isActive?: boolean;
    text?: string;
}) => import("react/jsx-runtime").JSX.Element;
export type ChatViewSelectorItemProps = {
    iconOnly?: boolean;
};
export declare const ChatViewChannelsSelectorButton: ({ iconOnly, }: ChatViewSelectorItemProps) => import("react/jsx-runtime").JSX.Element;
export declare const ChatViewThreadsSelectorButton: ({ iconOnly, }: ChatViewSelectorItemProps) => import("react/jsx-runtime").JSX.Element;
export type ChatViewSelectorItem = {
    Component: React.ComponentType<ChatViewSelectorItemProps>;
    type: string & {};
};
export type ChatViewSelectorEntry = ChatViewSelectorItem;
export type ChatViewSelectorProps = {
    iconOnly?: boolean;
    itemSet?: ChatViewSelectorEntry[];
};
export declare const defaultChatViewSelectorItemSet: ChatViewSelectorEntry[];
export {};
//# sourceMappingURL=ChatView.d.ts.map