@botpress/webchat 3.2.2 → 3.2.6

package/.turbo/turbo-build.log

@@ -1,21 +1,21 @@
 
-> @botpress/webchat@3.2.2 build /home/runner/work/genisys/genisys/packages/webchat-components
+> @botpress/webchat@3.2.6 build /home/runner/work/genisys/genisys/packages/webchat-components
 > vite build
 
 vite v5.4.8 building for production...
 transforming...
-✓ 3180 modules transformed.
+✓ 3182 modules transformed.
 rendering chunks...
 
 [vite:dts] Start generate declaration files...
 computing gzip size...
-dist/style.css   47.36 kB │ gzip:   8.71 kB
-dist/index.js   772.87 kB │ gzip: 212.53 kB
+dist/style.css   47.46 kB │ gzip:   8.72 kB
+dist/index.js   783.42 kB │ gzip: 218.64 kB
 [vite:dts] Start rollup declaration files...
 Analysis will use the bundled TypeScript version 5.4.2
 *** The target project appears to use TypeScript 5.6.2 which is newer than the bundled compiler engine; consider upgrading API Extractor.
-[vite:dts] Declaration files built in 23216ms.
+[vite:dts] Declaration files built in 19084ms.
 
-dist/style.css       47.36 kB │ gzip:   8.71 kB
-dist/index.umd.cjs  517.24 kB │ gzip: 173.70 kB
-✓ built in 31.52s
+dist/style.css       47.46 kB │ gzip:   8.72 kB
+dist/index.umd.cjs  526.62 kB │ gzip: 179.50 kB
+✓ built in 25.16s

package/dist/index.d.ts

@@ -4,8 +4,10 @@ import { Client } from '@botpress/webchat-client';
 import { ComponentProps } from 'react';
 import { ComponentPropsWithRef } from 'react';
 import { LatestWebchatConfig as Configuration } from '@bpinternal/shared';
+import { Context } from 'react';
 import { CSSProperties } from 'react';
 import * as Dialog from '@radix-ui/react-dialog';
+import { Dispatch } from 'react';
 import { EventEmitter } from '@bpinternal/shared';
 import type { FC } from 'react';
 import { ForwardRefExoticComponent } from 'react';
@@ -22,6 +24,7 @@ import { Ref } from 'react';
 import { RefAttributes } from 'react';
 import { RefObject } from 'react';
 import { RotateCcw } from 'lucide-react';
+import { SetStateAction } from 'react';
 import { StoreApi } from 'zustand';
 import { UseBoundStore } from 'zustand';
 import { User } from '@botpress/webchat-client';
@@ -95,6 +98,8 @@ declare type BlockProps<T extends GenericBlock['type']> = {
 
 export declare const BOT_IS_BLOCKED = "This bot has temporarily paused.\nPlease check back later.";
 
+declare type BoundChatSoundStore = ReturnType<typeof createChatSoundStore>;
+
 declare type BoundWebchatClientStore = ReturnType<typeof createWebchatClientStore>;
 
 export declare type BubbleBlock = {
@@ -128,7 +133,19 @@ 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, storageKey, ...props }: Props) => JSX_3.Element;
+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, ...props }: Props) => JSX_3.Element;
+
+declare type ChatSoundStore = {
+    soundOn: boolean;
+    setSoundEnabled: (enabled: boolean) => void;
+    toggleSound: () => void;
+};
+
+declare class ChatSoundStores {
+    private static _instances;
+    private constructor();
+    static getInstance(name?: string): BoundChatSoundStore;
+}
 
 export declare type ColumnBlock = {
     type: 'column';
@@ -165,10 +182,26 @@ export declare const CONFIG_ACCESS_DENIED = "Access denied to configuration file
 export { Configuration }
 
 export declare const Container: {
-    ({ children, className, connected, uploadFile, allowFileUpload, storageKey, ...props }: Props_4): JSX_3.Element;
+    ({ children, className, uploadFile, allowFileUpload, storageKey, ...props }: Props_4): JSX_3.Element;
     displayName: string;
 };
 
+declare const createChatSoundStore: (storeName: string) => UseBoundStore<Omit<Omit<StoreApi<ChatSoundStore>, "setState"> & {
+    setState<A extends string | {
+        type: string;
+    }>(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>>;
+    };
+}>;
+
 declare const createWebchatClientStore: (storeName: string, storageLocation?: StorageLocation) => UseBoundStore<Omit<Omit<StoreApi<WebchatClientStore>, "setState"> & {
     setState<A extends string | {
         type: string;
@@ -250,11 +283,13 @@ 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 getUseWebchatClientStore: typeof WebchatClientStores.getInstance;
 
 export declare const handleIntegrationError: (thrown: unknown) => WebchatError;
 
-export declare const Header: ({ defaultOpen, closeWindow, configuration, restartConversation, disabled, ...props }: HeaderProps) => JSX_3.Element;
+export declare const Header: ({ defaultOpen, closeWindow, configuration, restartConversation, disabled, soundOn, toggleSound, ...props }: HeaderProps) => JSX_3.Element;
 
 declare type HeaderProps = {
     defaultOpen?: boolean;
@@ -263,7 +298,11 @@ declare type HeaderProps = {
     onOpenChange?(open: boolean): void;
     restartConversation?: () => void;
     closeWindow?: () => void;
-    configuration: Pick<Configuration, 'email' | 'phone' | 'privacyPolicy' | 'website' | 'termsOfService' | 'botAvatar' | 'botDescription' | 'botName'>;
+    clientId?: string;
+    soundOn?: boolean;
+    toggleSound?: () => void;
+    triggerNetworkError?: (errorType?: 'network' | 'timeout' | 'server', delay?: number) => Promise<never>;
+    configuration: Pick<Configuration, 'email' | 'phone' | 'privacyPolicy' | 'website' | 'termsOfService' | 'botAvatar' | 'botDescription' | 'botName' | 'soundEnabled'>;
 };
 
 export declare type ImageBlock = {
@@ -318,6 +357,7 @@ export declare const Message: MemoExoticComponent<ForwardRefExoticComponent<{
     addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
     isReadOnly?: boolean;
     isLastDeliveredMessage?: boolean;
+    showAvatar?: boolean;
 } & BlockMessage<GenericBlock> & {
     direction: "incoming" | "outgoing" | "system";
     sender: {
@@ -326,7 +366,14 @@ export declare const Message: MemoExoticComponent<ForwardRefExoticComponent<{
     };
 } & RefAttributes<HTMLDivElement>>>;
 
-export declare const MessageList: MemoExoticComponent<({ className, messages, isTyping, headerMessage, renderers, botAvatar, botDescription, botName, sendMessage, addMessageFeedback, showMarquee, ...props }: ComponentProps<"ul"> & MessageListProps) => JSX_3.Element>;
+export declare const MessageContext: Context<MessageContextVaue | null>;
+
+declare type MessageContextVaue = {
+    isLoading: string[];
+    setIsLoading: Dispatch<SetStateAction<string[]>>;
+};
+
+export declare const MessageList: MemoExoticComponent<({ className, messages, isTyping, headerMessage, renderers, botAvatar, botDescription, botName, sendMessage, addMessageFeedback, showMarquee, showDateSystemMessage, showMessageStatus, showIncomingMessageAvatar, showOutgoingMessageAvatar, ...props }: ComponentProps<"ul"> & MessageListProps) => JSX_3.Element>;
 
 declare type MessageListProps = {
     messages?: RichBlockMessage[];
@@ -339,6 +386,10 @@ declare type MessageListProps = {
     sendMessage?: (payload: IntegrationMessage['payload']) => void;
     addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
     showMarquee?: boolean;
+    showDateSystemMessage?: boolean;
+    showMessageStatus?: boolean;
+    showIncomingMessageAvatar?: boolean;
+    showOutgoingMessageAvatar?: boolean;
 };
 
 export declare const MISSING_API_URL = "The API url is required to initialize the webchat.";
@@ -371,6 +422,21 @@ declare function ModalContent({ children, title, description, confirmButton, onC
     children: ReactNode;
 }): JSX_3.Element;
 
+export declare const ModalContext: Context<ModalContextValue>;
+
+declare type ModalContextValue = {
+    open?: boolean;
+    showModal?: (props: {
+        title: string;
+        description: string;
+        confirmButton: string;
+        onConfirm: () => void;
+        cancelButton: string;
+        content?: ReactNode;
+    }) => void;
+    hideModal?: () => void;
+};
+
 export declare type ModalProps = {
     title: string | null;
     content: ReactNode | null;
@@ -414,7 +480,10 @@ export declare type Props = {
         type: FileType;
     }>;
     addMessageFeedback?: (messageId: string, feedback: Feedback) => void;
+    triggerNetworkError?: (errorType?: 'network' | 'timeout' | 'server', delay?: number) => Promise<never>;
     error?: WebchatError;
+    soundOn?: boolean;
+    toggleSound?: () => void;
     storageKey?: string;
 };
 
@@ -423,10 +492,13 @@ declare type Props_2 = {
     user?: UserCredentials;
     conversationId?: string;
     clientId: string;
+    botId?: string;
     apiUrl?: string;
     sseTimeout?: number;
     storageKey?: string;
     storageLocation?: StorageLocation;
+    playSound?: () => void;
+    soundEnabled?: boolean;
 };
 
 declare type Props_3 = ComponentProps<'div'> & {
@@ -466,6 +538,8 @@ declare type Props_6 = {
     user?: UserCredentials;
     conversationId?: string;
     configuration?: Configuration;
+    soundOn?: boolean;
+    toggleSound?: () => void;
 } & Pick<ComponentProps<typeof Chat>, 'allowFileUpload' | 'renderers'> & ComponentProps<'div'>;
 
 declare type Props_7 = Partial<LatestWebchatTheme>;
@@ -512,6 +586,10 @@ declare type ScopedClient = {
     updateUser: (user: UserProfile) => Promise<User>;
 };
 
+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';
@@ -525,7 +603,7 @@ export declare type StyleOptions = {
  * StylesheetProvider component that manages theme styles and font loading
  * Handles both default fonts and custom Google Fonts
  */
-export declare const StylesheetProvider: ({ color, fontFamily, radius, themeMode, variant, headerVariant }: Props_7) => JSX_3.Element;
+export declare const StylesheetProvider: ({ color, fontFamily, radius, themeMode, variant, headerVariant, additionalStylesheetUrl, }: Props_7) => JSX_3.Element;
 
 export declare type TextBlock = {
     type: 'text';
@@ -546,14 +624,18 @@ export declare type UseImageSizeResult = [Dimensions | null, {
     error: string | null;
 }];
 
+export declare function useMessageContext(): MessageContextVaue;
+
+export declare function useModalContext(): ModalContextValue;
+
 declare type UserProfile = Omit<User, 'id' | 'createdAt' | 'updatedAt'>;
 
 declare type UserResponse = Awaited<ReturnType<Client['getUser']>>['user'];
 
-export declare function useWebchat({ apiUrl, clientId, storageKey, storageLocation, adminKey, ...props }: Props_2): UseWebchatReturn;
+export declare function useWebchat({ apiUrl, clientId, storageKey, storageLocation, adminKey, soundEnabled, ...props }: Props_2): UseWebchatReturn;
 
 declare type UseWebchatReturn = {
-    clientState: 'connected' | 'disconnected' | 'error';
+    clientState: 'connected';
     on: EventEmitter<Events>['on'];
     client: ScopedClient;
     messages: BlockMessage[];
@@ -562,10 +644,12 @@ declare type UseWebchatReturn = {
     isFetchingMessages: boolean;
     user?: UserCredentials;
     isTyping: boolean;
-    error?: WebchatError;
     participants: User[];
+    soundOn: boolean;
+    toggleSound: () => void;
+    error?: WebchatError;
 } | {
-    clientState: 'connecting' | 'error';
+    clientState: 'connecting' | 'error' | 'disconnected';
     on: EventEmitter<Events>['on'];
     client: undefined;
     messages: BlockMessage[];
@@ -574,8 +658,10 @@ declare type UseWebchatReturn = {
     isFetchingMessages: boolean;
     user: undefined;
     isTyping: undefined;
-    error?: WebchatError;
     participants: User[];
+    soundOn: boolean;
+    toggleSound: () => void;
+    error?: WebchatError;
 };
 
 export declare const useWebchatStore: UseBoundStore<Omit<StoreApi<WebchatStore>, "setState"> & {
@@ -600,9 +686,6 @@ export declare const webchatClasses: {
             readonly overlay: {
                 readonly className: "bpDropzoneOverlay";
             };
-            readonly container: {
-                readonly className: "bpDropzoneContainer";
-            };
         };
     };
     readonly loader: {
@@ -696,6 +779,9 @@ export declare const webchatClasses: {
                     readonly className: "bpHeaderContentAvatarFallback";
                 };
             };
+            readonly toggleSound: {
+                readonly className: "bpHeaderSoundToggleButton";
+            };
             readonly actions: {
                 readonly container: {
                     readonly className: "bpReset bpHeaderContentActionsContainer";
@@ -1035,7 +1121,12 @@ export declare const webchatClasses: {
             readonly className: "bpErrorId";
         };
         readonly header: {
-            readonly className: "bpErrorHeader";
+            readonly container: {
+                readonly className: "bpErrorHeader";
+            };
+            readonly actions: {
+                readonly className: "bpErrorHeaderActions";
+            };
         };
         readonly content: {
             readonly className: "bpErrorContent";
@@ -1058,6 +1149,29 @@ export declare const webchatClasses: {
             readonly className: "bpTypingIndicatorLoader";
         };
     };
+    readonly proactiveBubble: {
+        readonly container: {
+            readonly className: "bpProactiveBubbleContainer";
+        };
+        readonly content: {
+            readonly className: "bpProactiveBubbleContent";
+        };
+        readonly layout: {
+            readonly className: "bpProactiveBubbleLayout";
+        };
+        readonly icon: {
+            readonly className: "bpProactiveBubbleIcon";
+        };
+        readonly message: {
+            readonly className: "bpProactiveBubbleMessage";
+        };
+        readonly closeButton: {
+            readonly className: "bpProactiveBubbleCloseButton";
+        };
+        readonly arrow: {
+            readonly className: "bpProactiveBubbleArrow";
+        };
+    };
 };
 
 declare type WebchatClientStore = {