@botpress/webchat 4.2.2 → 4.4.0

package/dist/index.d.ts

@@ -1,31 +1,39 @@
 import { AddMessageFeedbackBody } from '@botpress/webchat-client';
-import { ClassAttributes } from 'react';
+import { ClassAttributes } from '../../../node_modules/@types/react';
 import { Client } from '@botpress/webchat-client';
-import { ComponentProps } from 'react';
-import { ComponentPropsWithRef } from 'react';
+import { ComponentProps } from '../../../node_modules/@types/react';
+import { ComponentProps as ComponentProps_2 } from '../../node_modules/@types/react';
+import { ComponentPropsWithRef } from '../../node_modules/@types/react';
 import { LatestWebchatConfig as Configuration } from '@bpinternal/shared';
-import { Context } from 'react';
-import { CSSProperties } from 'react';
+import { Context } from '../../node_modules/@types/react';
+import { createEventEmitter } from '@bpinternal/shared';
+import { CSSProperties } from '../../node_modules/@types/react';
 import * as Dialog from '@radix-ui/react-dialog';
-import { Dispatch } from 'react';
+import { Dispatch } from '../../node_modules/@types/react';
 import { EventEmitter } from '@bpinternal/shared';
-import type { FC } from 'react';
-import { ForwardRefExoticComponent } from 'react';
-import { HTMLAttributes } from 'react';
+import { FC } from '../../node_modules/@types/react';
+import { ForwardRefExoticComponent } from '../../node_modules/@types/react';
+import { ForwardRefExoticComponent as ForwardRefExoticComponent_2 } from '../../../node_modules/@types/react';
+import { ForwardRefExoticComponent as ForwardRefExoticComponent_3 } from 'react';
+import { HTMLAttributes } from '../../../node_modules/@types/react';
 import { IntegrationError } from '@botpress/webchat-client';
-import { JSX } from 'react';
+import { JSX } from '../../node_modules/@types/react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { LatestWebchatTheme } from '@bpinternal/shared';
-import { MemoExoticComponent } from 'react';
+import { ListConversationsResponse } from '@botpress/webchat-client';
+import { MemoExoticComponent } from '../../../node_modules/@types/react';
 import { Message as Message_2 } from '@botpress/webchat-client';
-import { NamedExoticComponent } from 'react';
+import { NamedExoticComponent } from '../../../node_modules/@types/react';
 import { PersistOptions } from 'zustand/middleware';
-import { ReactNode } from 'react';
-import { Ref } from 'react';
-import { RefAttributes } from 'react';
-import { RefObject } from 'react';
+import { ReactNode } from '../../../node_modules/@types/react';
+import { ReactNode as ReactNode_2 } from '../../node_modules/@types/react';
+import { Ref } from '../../../node_modules/@types/react';
+import { RefAttributes } from '../../node_modules/@types/react';
+import { RefAttributes as RefAttributes_2 } from '../../../node_modules/@types/react';
+import { RefAttributes as RefAttributes_3 } from 'react';
+import { RefObject } from '../../node_modules/@types/react';
 import { RotateCcw } from 'lucide-react';
-import { SetStateAction } from 'react';
+import { SetStateAction } from '../../node_modules/@types/react';
 import { StoreApi } from 'zustand';
 import { UseBoundStore } from 'zustand';
 import { User } from '@botpress/webchat-client';
@@ -134,7 +142,7 @@ export declare type CarouselBlock = {
     blocks: GenericBlock[];
 };
 
-export declare const Chat: ({ connected, configuration, isTyping, messages, user, isLoading, renderers, isReadOnly, disableComposer, allowFileUpload, error, participants, closeWindow, sendMessage, uploadFile, addMessageFeedback, restartConversation, clientId, storageKey, soundOn, toggleSound, disableSendButton, ...props }: Props) => JSX_2.Element;
+export declare const Chat: ({ connected, configuration, isTyping, messages, user, isLoading, renderers, isReadOnly, disableComposer, error, participants, closeWindow, sendMessage, uploadFile, addMessageFeedback, listConversations, restartConversation, clientId, storageKey, soundOn, toggleSound, disableSendButton, conversationId, ...props }: Props) => JSX_2.Element;
 
 declare type ChatSoundStore = {
     soundOn: boolean;
@@ -142,11 +150,9 @@ declare type ChatSoundStore = {
     toggleSound: () => void;
 };
 
-declare class ChatSoundStores {
-    private static _instances;
-    private constructor();
-    static getInstance(name?: string): BoundChatSoundStore;
-}
+export declare type ClientStates = 'connecting' | 'connected' | 'error' | 'disconnected';
+
+declare type ClientStates_2 = 'connecting' | 'connected' | 'error' | 'disconnected';
 
 export declare type ColumnBlock = {
     type: 'column';
@@ -172,51 +178,88 @@ export declare type CommonBlockProps = Pick<RichBlockMessage, 'direction' | 'sen
     addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
 };
 
+declare type CommonWebchatProps = {
+    on: EventEmitter<Events>['on'];
+    messages: BlockMessage[];
+    newConversation: (conversationId?: string) => void;
+    participants: User[];
+    soundOn: boolean;
+    toggleSound: () => void;
+    disableSendButton: boolean;
+    error?: WebchatError;
+};
+
 export declare type ComposableIntegrationMessagePayload = Extract<IntegrationMessage['payload'], ToPayloadType<ComposableIntegrationMessageTypes>>;
 
 declare type ComposableIntegrationMessageTypes = 'audio' | 'bloc' | 'file' | 'image' | 'location' | 'markdown' | 'text' | 'video';
 
-export declare const Composer: NamedExoticComponent<Omit<Props_3, "ref"> & RefAttributes<HTMLDivElement>>;
+export declare const Composer: NamedExoticComponent<Omit<Props_3, "ref"> & RefAttributes_2<HTMLDivElement>>;
 
 export declare const CONFIG_ACCESS_DENIED = "Access denied to configuration file. Please check your credentials or your configuration URL and try again.";
 
 export { Configuration }
 
 export declare const Container: {
-    ({ children, className, uploadFile, allowFileUpload, storageKey, connected: _, ...props }: Props_4): JSX_2.Element;
+    ({ children, className, uploadFile, allowFileUpload, storageKey, conversationId, ...props }: Props_4): JSX_2.Element;
     displayName: string;
 };
 
+export declare const ConversationHistory: {
+    ({ className, onConversationClick, onNewConversation, onClose, currentConversationId, isLoading, conversations, botAvatar, botName, ...props }: ComponentProps<"div"> & ConversationHistoryProps): JSX_2.Element;
+    displayName: string;
+};
+
+declare type ConversationHistoryProps = {
+    onConversationClick?: (conversationId: string) => void;
+    onNewConversation?: () => void;
+    onClose?: () => void;
+    currentConversationId?: string;
+    isLoading?: boolean;
+    conversations: Conversations;
+    botAvatar?: string;
+    botName?: string;
+};
+
+declare type Conversations = ConversationWithLastMessage[];
+
+declare type ConversationWithLastMessage = ListConversationsResponse['conversations'][number] & {
+    lastMessage: NonNullable<ListConversationsResponse['conversations'][number]['lastMessage']> & {
+        author: {
+            type: 'bot' | 'user';
+        };
+    };
+};
+
 declare const createChatSoundStore: (storeName: string) => UseBoundStore<Omit<Omit<StoreApi<ChatSoundStore>, "setState"> & {
-    setState<A extends string | {
-        type: unknown;
-    }>(partial: ChatSoundStore | Partial<ChatSoundStore> | ((state: ChatSoundStore) => ChatSoundStore | Partial<ChatSoundStore>), replace?: boolean | undefined, action?: A | undefined): void;
+setState<A extends string | {
+type: unknown;
+}>(partial: ChatSoundStore | Partial<ChatSoundStore> | ((state: ChatSoundStore) => ChatSoundStore | Partial<ChatSoundStore>), replace?: boolean | undefined, action?: A | undefined): void;
 }, "persist"> & {
-    persist: {
-        setOptions: (options: Partial<PersistOptions<ChatSoundStore, ChatSoundStore>>) => void;
-        clearStorage: () => void;
-        rehydrate: () => Promise<void> | void;
-        hasHydrated: () => boolean;
-        onHydrate: (fn: (state: ChatSoundStore) => void) => () => void;
-        onFinishHydration: (fn: (state: ChatSoundStore) => void) => () => void;
-        getOptions: () => Partial<PersistOptions<ChatSoundStore, ChatSoundStore>>;
-    };
+persist: {
+setOptions: (options: Partial<PersistOptions<ChatSoundStore, ChatSoundStore>>) => void;
+clearStorage: () => void;
+rehydrate: () => Promise<void> | void;
+hasHydrated: () => boolean;
+onHydrate: (fn: (state: ChatSoundStore) => void) => () => void;
+onFinishHydration: (fn: (state: ChatSoundStore) => void) => () => void;
+getOptions: () => Partial<PersistOptions<ChatSoundStore, ChatSoundStore>>;
+};
 }>;
 
 declare const createWebchatClientStore: (storeName: string, storageLocation?: StorageLocation) => UseBoundStore<Omit<Omit<StoreApi<WebchatClientStore>, "setState"> & {
-    setState<A extends string | {
-        type: unknown;
-    }>(partial: WebchatClientStore | Partial<WebchatClientStore> | ((state: WebchatClientStore) => WebchatClientStore | Partial<WebchatClientStore>), replace?: boolean | undefined, action?: A | undefined): void;
+setState<A extends string | {
+type: unknown;
+}>(partial: WebchatClientStore | Partial<WebchatClientStore> | ((state: WebchatClientStore) => WebchatClientStore | Partial<WebchatClientStore>), replace?: boolean | undefined, action?: A | undefined): void;
 }, "persist"> & {
-    persist: {
-        setOptions: (options: Partial<PersistOptions<WebchatClientStore, unknown>>) => void;
-        clearStorage: () => void;
-        rehydrate: () => Promise<void> | void;
-        hasHydrated: () => boolean;
-        onHydrate: (fn: (state: WebchatClientStore) => void) => () => void;
-        onFinishHydration: (fn: (state: WebchatClientStore) => void) => () => void;
-        getOptions: () => Partial<PersistOptions<WebchatClientStore, unknown>>;
-    };
+persist: {
+setOptions: (options: Partial<PersistOptions<WebchatClientStore, unknown>>) => void;
+clearStorage: () => void;
+rehydrate: () => Promise<void> | void;
+hasHydrated: () => boolean;
+onHydrate: (fn: (state: WebchatClientStore) => void) => () => void;
+onFinishHydration: (fn: (state: WebchatClientStore) => void) => () => void;
+getOptions: () => Partial<PersistOptions<WebchatClientStore, unknown>>;
+};
 }>;
 
 export declare type CustomBlock = {
@@ -262,9 +305,9 @@ declare type Events_2 = {
     [key: string]: string;
 };
 
-export declare const Fab: ForwardRefExoticComponent<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
-    imgUrl?: string;
-}, "ref"> & RefAttributes<HTMLDivElement>>;
+export declare const Fab: ForwardRefExoticComponent_2<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+imgUrl?: string;
+}, "ref"> & RefAttributes_2<HTMLDivElement>>;
 
 export declare type Feedback = AddMessageFeedbackBody;
 
@@ -284,16 +327,17 @@ export declare function generateThemeStylesheet(theme: LatestWebchatTheme): stri
 
 export declare type GenericBlock = AudioBlock | BubbleBlock | ButtonBlock | CarouselBlock | ColumnBlock | DropdownBlock | FileBlock | ImageBlock | LocationBlock | RowBlock | TextBlock | VideoBlock | CustomBlock;
 
-export declare const getUseChatSoundStore: typeof ChatSoundStores.getInstance;
+export declare const getUseChatSoundStore: (name?: string) => BoundChatSoundStore;
 
-export declare const getUseWebchatClientStore: typeof WebchatClientStores.getInstance;
+export declare const getUseWebchatClientStore: (name?: string, storageLocation?: StorageLocation) => BoundWebchatClientStore;
 
-export declare const Header: ({ defaultOpen, closeWindow, configuration, restartConversation, disabled, soundOn, toggleSound, clientId, ...props }: HeaderProps) => JSX_2.Element;
+export declare const Header: ({ defaultOpen, closeWindow, configuration, restartConversation, showConversationHistory, disabled, soundOn, toggleSound, clientId, ...props }: HeaderProps) => JSX_2.Element;
 
 declare type HeaderProps = {
     defaultOpen?: boolean;
     open?: boolean;
     disabled?: boolean;
+    showConversationHistory?: () => void;
     onOpenChange?(open: boolean): void;
     restartConversation?: () => void;
     closeWindow?: () => void;
@@ -320,7 +364,7 @@ export declare type InputModalProps<T> = {
     Content?: ({ setValue }: {
         value: T | undefined;
         setValue: (value: T) => void;
-    }) => ReactNode;
+    }) => ReactNode_2;
 };
 
 export declare type IntegrationMessage = Message_2;
@@ -364,21 +408,21 @@ export declare type LocationBlock = {
 
 export declare const mapToWebchatError: (thrown: unknown) => WebchatError;
 
-export declare const Message: NamedExoticComponent<{
-    children?: ReactNode;
-    renderers?: Partial<Renderers>;
-    sendMessage?: (payload: IntegrationMessage["payload"]) => void;
-    addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
-    isReadOnly?: boolean;
-    isLastDeliveredMessage?: boolean;
-    showAvatar?: boolean;
+export declare const Message: NamedExoticComponent<    {
+children?: ReactNode;
+renderers?: Partial<Renderers>;
+sendMessage?: (payload: IntegrationMessage["payload"]) => void;
+addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
+isReadOnly?: boolean;
+isLastDeliveredMessage?: boolean;
+showAvatar?: boolean;
 } & BlockMessage<GenericBlock> & {
-    direction: "incoming" | "outgoing" | "system";
-    sender: {
-        name: string;
-        avatar?: string;
-    };
-} & RefAttributes<HTMLDivElement>>;
+direction: "incoming" | "outgoing" | "system";
+sender: {
+name: string;
+avatar?: string;
+};
+} & RefAttributes_2<HTMLDivElement>>;
 
 export declare const MessageContext: Context<MessageContextVaue | null>;
 
@@ -406,12 +450,12 @@ declare type MessageListProps = {
     showOutgoingMessageAvatar?: boolean;
 };
 
-export declare const MessagePreview: ForwardRefExoticComponent<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
-    avatarUrl?: string;
-    botName?: string;
-    description?: string;
-    onClose?: () => void;
-}, "ref"> & RefAttributes<HTMLDivElement>>;
+export declare const MessagePreview: ForwardRefExoticComponent_2<Omit<ClassAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement> & {
+avatarUrl?: string;
+botName?: string;
+description?: string;
+onClose?: () => void;
+}, "ref"> & RefAttributes_2<HTMLDivElement>>;
 
 export declare const MISSING_API_URL = "The API url is required to initialize the webchat.";
 
@@ -428,8 +472,8 @@ export declare function Modal({ open, onOpenChange, children, }: {
 }): JSX_2.Element;
 
 export declare namespace Modal {
-    var Button: ForwardRefExoticComponent<Dialog.DialogTriggerProps & RefAttributes<HTMLButtonElement>>;
-    var Close: ForwardRefExoticComponent<Dialog.DialogCloseProps & RefAttributes<HTMLButtonElement>>;
+    var Button: ForwardRefExoticComponent_3<Dialog.DialogTriggerProps & RefAttributes_3<HTMLButtonElement>>;
+    var Close: ForwardRefExoticComponent_3<Dialog.DialogCloseProps & RefAttributes_3<HTMLButtonElement>>;
     var Content: typeof ModalContent;
 }
 
@@ -450,7 +494,7 @@ declare type ModalContextValue = {
 };
 
 export declare const ModalProvider: ({ children }: {
-    children: ReactNode;
+    children: ReactNode_2;
 }) => JSX_2.Element;
 
 export declare const NETWORK_ERROR = "Please check your internet connection and refresh the page.";
@@ -472,27 +516,20 @@ export declare type Props = {
     isReadOnly?: boolean;
     isLoading?: boolean;
     isTyping?: boolean;
-    lastTypingHeartbeat?: Date | null;
-    allowFileUpload?: boolean;
     clientId?: string;
     closeWindow?: () => void;
-    restartConversation?: () => void;
-    user?: {
-        id: string;
-    } & Record<string, unknown>;
-    sendMessage?: (payload: IntegrationMessage['payload']) => Promise<void>;
-    uploadFile?: (file: File) => Promise<{
-        fileUrl: string;
-        name: string;
-        type: FileType;
-    }>;
-    addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
-    triggerNetworkError?: (errorType?: 'network' | 'timeout' | 'server', delay?: number) => Promise<never>;
+    restartConversation?: (conversationid?: string) => void;
+    user?: UserCredentials;
+    sendMessage?: ScopedClient['sendMessage'];
+    uploadFile?: ScopedClient['uploadFile'];
+    addMessageFeedback?: ScopedClient['addMessageFeedback'];
+    listConversations?: ScopedClient['listConversations'];
     error?: WebchatError;
     soundOn?: boolean;
     toggleSound?: () => void;
-    disableSendButton?: boolean;
     storageKey?: string;
+    disableSendButton?: boolean;
+    conversationId?: string;
 };
 
 declare type Props_2 = {
@@ -505,6 +542,7 @@ declare type Props_2 = {
     storageKey?: string;
     storageLocation?: StorageLocation;
     soundEnabled?: boolean;
+    clientHeaders?: Record<string, string>;
 };
 
 declare type Props_3 = ComponentProps<'div'> & {
@@ -514,29 +552,23 @@ declare type Props_3 = ComponentProps<'div'> & {
     allowFileUpload?: boolean;
     disableSendButton?: boolean;
     connected?: boolean;
-    sendMessage?: (payload: IntegrationMessage['payload']) => void;
-    uploadFile?: (file: File) => Promise<{
-        fileUrl: string;
-        name: string;
-        type: FileType;
-    }>;
+    sendMessage?: ScopedClient['sendMessage'];
+    uploadFile?: ScopedClient['uploadFile'];
     storageKey?: string;
+    conversationId?: string;
 } & Pick<Configuration, 'composerPlaceholder' | 'footer'>;
 
 declare type Props_4 = ComponentProps<'div'> & {
     connected?: boolean;
-    uploadFile?: (file: File) => Promise<{
-        fileUrl: string;
-        name: string;
-        type: FileType;
-    }>;
+    uploadFile?: ScopedClient['uploadFile'];
     allowFileUpload?: boolean;
     storageKey?: string;
+    conversationId?: string;
 };
 
 declare type Props_5 = {
     restartConversation: () => void;
-} & ComponentProps<typeof RotateCcw>;
+} & ComponentProps_2<typeof RotateCcw>;
 
 declare type Props_6 = {
     clientId: string;
@@ -547,7 +579,10 @@ declare type Props_6 = {
     configuration?: Configuration;
     soundOn?: boolean;
     toggleSound?: () => void;
-} & Pick<ComponentProps<typeof Chat>, 'allowFileUpload' | 'renderers'> & ComponentProps<'div'>;
+    /** @deprecated This prop is no longer used, pass the allowFileUpload via the configuration object */
+    allowFileUpload?: boolean;
+    renderers?: Partial<Renderers>;
+} & ComponentProps_2<'div'>;
 
 declare type Props_7 = Partial<LatestWebchatTheme>;
 
@@ -582,7 +617,7 @@ export declare type RowOf<T extends GenericBlock> = Omit<RowBlock, 'blocks'> & {
     blocks: T[];
 };
 
-declare type ScopedClient = {
+export declare type ScopedClient = {
     sendMessage: (payload: IntegrationMessage['payload']) => Promise<void>;
     sendEvent: (event: Record<string, any>, options?: {
         bindConversation?: boolean;
@@ -592,19 +627,25 @@ declare type ScopedClient = {
         fileUrl: string;
         name: string;
         type: FileType;
+        fileId: string;
     }>;
     addMessageFeedback: (messageId: string, feedback: Feedback) => Promise<void>;
     getUser: () => Promise<UserResponse>;
     updateUser: (user: UserProfile) => Promise<User>;
+    listConversations: () => ReturnType<Client['listConversations']>;
 };
 
+export declare const _setDebugEnabled: (enabled: boolean) => void;
+
+export declare const _setTrackFn: (fn: typeof _trackFn) => void;
+
 export declare const SOUND_EFFECTS: {
     readonly chatMessageNotification: string;
 };
 
 export declare const SSE_DISCONNECTED_ERROR = "You've been disconnected from the conversation.\nPlease refresh the page.";
 
-declare type StorageLocation = 'sessionStorage' | 'localStorage';
+export declare type StorageLocation = 'sessionStorage' | 'localStorage';
 
 export declare type StyleOptions = {
     className?: string;
@@ -628,8 +669,57 @@ declare type ToPayloadType<T extends IntegrationMessageTypes> = {
     };
 }[T];
 
+declare let _trackFn: ((event: string, properties?: Record<string, unknown>) => void) | null;
+
 export declare const TypingIndicator: MemoExoticComponent<({ ...props }: ComponentProps<"div">) => JSX_2.Element>;
 
+export declare function useActiveConversation(): UseActiveConversationReturn;
+
+declare type UseActiveConversationReturn = {
+    conversationId?: string;
+    messages: BlockMessage[];
+    participants: User[];
+    sendMessage: (payload: IntegrationMessage['payload']) => Promise<void>;
+    saveMessageFeedback: (messageId: string, feedback: Feedback) => Promise<void>;
+    sendEvent: (event: Record<string, unknown>, options?: {
+        bindConversation?: boolean;
+        bindUser?: boolean;
+    }) => Promise<void>;
+    uploadFile: (file: File) => Promise<{
+        fileUrl: string;
+        name: string;
+        type: FileType;
+        fileId: string;
+    }>;
+    status: ClientStates;
+    on: ReturnType<typeof createEventEmitter<Events>>['on'];
+    error?: WebchatError;
+    isTyping: boolean;
+    isAwaitingResponse: boolean;
+};
+
+export declare function useConversationList({ userCredentials, listConversations, clientId, }: UseConversationListParams): UseConversationListReturn;
+
+declare type UseConversationListParams = {
+    userCredentials?: UserCredentials;
+    listConversations?: Client['listConversations'];
+    clientId?: string;
+};
+
+declare type UseConversationListReturn = {
+    conversations: Conversations;
+    isLoading: boolean;
+    error?: WebchatError;
+    refresh: () => Promise<Conversations | undefined>;
+};
+
+export declare function useConversations(): UseConversationsReturn;
+
+declare type UseConversationsReturn = {
+    listConversations?: () => Promise<ListConversationsResponse>;
+    openConversation: (conversationId?: string) => void;
+};
+
 export declare type UseImageSizeResult = [Dimensions | null, {
     loading: boolean;
     error: string | null;
@@ -639,46 +729,61 @@ export declare function useMessageContext(): MessageContextVaue;
 
 export declare function useModalContext(): ModalContextValue;
 
-declare type UserProfile = Omit<User, 'id' | 'createdAt' | 'updatedAt'>;
+export { User }
+
+export declare type UserProfile = Omit<User, 'id' | 'createdAt' | 'updatedAt'>;
+
+export declare type UserResponse = Awaited<ReturnType<Client['getUser']>>['user'];
+
+export declare const useUser: () => UseUserReturn;
+
+declare type UseUserReturn = {
+    getUser?: () => Promise<UserResponse>;
+    updateUser?: (user: UserProfile) => Promise<User>;
+    userCredentials?: UserCredentials;
+};
 
-declare type UserResponse = Awaited<ReturnType<Client['getUser']>>['user'];
+/**
+ * @deprecated This hook is deprecated. Use WebchatProvider with useActiveConversation, useConversations, and useUser instead.
+ *
+ * Migration guide:
+ * ```typescript
+ * // Old:
+ * const { messages, sendMessage, client } = useWebchat({ clientId, ... })
+ *
+ * // New:
+ * <WebchatProvider clientId={clientId} ...>
+ *   const { messages, sendMessage } = useActiveConversation()
+ *   const { listConversations, openConversation } = useConversations()
+ *   const { getUser, updateUser } = useUser()
+ * </WebchatProvider>
+ * ```
+ */
+export declare function useWebchat({ apiUrl, clientId, storageKey, storageLocation, adminSecret, soundEnabled, clientHeaders, ...props }: Props_2): UseWebchatReturn;
 
-export declare function useWebchat({ apiUrl, clientId, storageKey, storageLocation, adminSecret, soundEnabled, ...props }: Props_2): UseWebchatReturn;
+export declare function useWebchatContext(): WebchatContextValue;
 
-declare type UseWebchatReturn = {
+/**
+ * @deprecated Use WebchatProvider with useActiveConversation, useConversations, and useUser instead
+ */
+declare type UseWebchatReturn = (CommonWebchatProps & {
     clientState: 'connected';
-    on: EventEmitter<Events>['on'];
     client: ScopedClient;
-    messages: BlockMessage[];
     conversationId: string;
-    newConversation: () => Promise<void>;
     user?: UserCredentials;
     isTyping: boolean;
-    participants: User[];
-    soundOn: boolean;
-    toggleSound: () => void;
-    disableSendButton: boolean;
-    error?: WebchatError;
-} | {
+}) | (CommonWebchatProps & {
     clientState: 'connecting' | 'error' | 'disconnected';
-    on: EventEmitter<Events>['on'];
     client: undefined;
-    messages: BlockMessage[];
     conversationId: undefined;
-    newConversation: () => Promise<void>;
     user: undefined;
     isTyping: undefined;
-    participants: User[];
-    soundOn: boolean;
-    toggleSound: () => void;
-    disableSendButton: boolean;
-    error?: WebchatError;
-};
+});
 
 export declare const useWebchatStore: UseBoundStore<Omit<StoreApi<WebchatStore>, "setState"> & {
-    setState<A extends string | {
-        type: unknown;
-    }>(partial: WebchatStore | Partial<WebchatStore> | ((state: WebchatStore) => WebchatStore | Partial<WebchatStore>), replace?: boolean | undefined, action?: A | undefined): void;
+setState<A extends string | {
+type: unknown;
+}>(partial: WebchatStore | Partial<WebchatStore> | ((state: WebchatStore) => WebchatStore | Partial<WebchatStore>), replace?: boolean | undefined, action?: A | undefined): void;
 }>;
 
 declare type ValueOf<T> = T[keyof T];
@@ -688,7 +793,7 @@ export declare type VideoBlock = {
     url: string;
 };
 
-export declare const Webchat: ({ clientId, storageKey, configuration, allowFileUpload, apiUrl, user, conversationId, ...props }: Props_6) => JSX_2.Element;
+export declare const Webchat: ({ clientId, storageKey, configuration, apiUrl, user: userCredentials, conversationId, ...props }: Props_6) => JSX_2.Element;
 
 export declare const webchatClasses: {
     readonly container: {
@@ -798,6 +903,9 @@ export declare const webchatClasses: {
             readonly container: {
                 readonly className: "bpReset bpHeaderContentContainer";
             };
+            readonly conversationHistory: {
+                readonly className: "bpHeaderConversationHistoryButton";
+            };
             readonly title: {
                 readonly className: "bpHeaderContentTitle";
             };
@@ -1214,12 +1322,69 @@ export declare const webchatClasses: {
             readonly className: "bpProactiveBubbleArrow";
         };
     };
+    readonly conversationHistory: {
+        readonly container: {
+            readonly className: "bpReset bpConversationHistoryContainer bpFont";
+        };
+        readonly header: {
+            readonly className: "bpConversationHistoryHeader";
+        };
+        readonly closeButton: {
+            readonly className: "bpConversationHistoryCloseButton";
+        };
+        readonly scrollContainer: {
+            readonly className: "bpConversationHistoryScrollContainer";
+        };
+        readonly loaderContainer: {
+            readonly className: "bpConversationHistoryLoaderContainer";
+        };
+        readonly conversation: {
+            readonly container: {
+                readonly className: "bpConversationHistoryConversationContainer";
+            };
+            readonly chevron: {
+                readonly className: "bpConversationHistoryConversationChevron";
+            };
+            readonly userAvatar: {
+                readonly className: {
+                    readonly className: "bpConversationHistoryConversationUserAvatarFallback";
+                };
+            };
+            readonly avatar: {
+                readonly container: {
+                    readonly className: "bpReset bpConversationHistoryConversationAvatarContainer";
+                };
+                readonly image: {
+                    readonly className: "bpConversationHistoryConversationAvatarImage";
+                };
+                readonly fallback: {
+                    readonly className: "bpConversationHistoryConversationAvatarFallback";
+                };
+            };
+            readonly content: {
+                readonly className: "bpConversationHistoryConversationContent";
+            };
+            readonly name: {
+                readonly className: "bpConversationHistoryConversationName";
+            };
+            readonly timestamp: {
+                readonly className: "bpConversationHistoryConversationTimestamp";
+            };
+        };
+        readonly newConversation: {
+            readonly button: {
+                readonly className: "bpConversationHistoryNewConversationButton";
+            };
+            readonly icon: {
+                readonly className: "bpConversationHistoryNewConversationButtonIcon";
+            };
+        };
+    };
 };
 
 declare type WebchatClientActions = {
     setUser: (userId?: UserCredentials) => void;
-    setConversationId: (conversationId: string) => void;
-    clearConversationId: () => void;
+    setConversationId: (conversationId?: string) => void;
     clearAll: () => void;
 };
 
@@ -1230,11 +1395,23 @@ export declare type WebchatClientState = {
 
 declare type WebchatClientStore = WebchatClientState & WebchatClientActions;
 
-declare class WebchatClientStores {
-    private static _instances;
-    private constructor();
-    static getInstance(name?: string, storageLocation?: StorageLocation): BoundWebchatClientStore;
-}
+export declare type WebchatContextValue = {
+    client: Client | undefined;
+    userCredentials: UserCredentials | undefined;
+    conversationId: string | undefined;
+    openConversation: (params: {
+        conversationId?: string;
+        userToken?: string;
+    }) => Promise<void>;
+    clientState: ClientStates_2;
+    setClientState: (state: ClientStates_2) => void;
+    error: WebchatError | undefined;
+    setError: (error?: WebchatError) => void;
+    isTyping: boolean;
+    isAwaitingResponse: boolean;
+    setAwaitingResponse: (state: boolean, timeout?: number) => void;
+    emitter: ReturnType<typeof createEventEmitter<Events>>;
+};
 
 export declare type WebchatError = ({
     type: 'configuration';
@@ -1268,6 +1445,20 @@ export declare type WebchatEvents = {
     participantRemoved: string;
 };
 
+export declare function WebchatProvider({ clientId, apiUrl, storageKey, storageLocation, adminSecret, clientHeaders, children, ...props }: WebchatProviderProps): JSX_2.Element;
+
+declare type WebchatProviderProps = {
+    clientId: string;
+    apiUrl?: string;
+    userCredentials?: UserCredentials;
+    conversationId?: string;
+    adminSecret?: string;
+    storageKey?: string;
+    storageLocation?: StorageLocation;
+    clientHeaders?: Record<string, string>;
+    children: ReactNode_2;
+};
+
 declare type WebchatStore = {
     messageContainerRef: RefObject<HTMLDivElement | null>;
     setMessageContainerRef: (ref: RefObject<HTMLDivElement | null>) => void;