@developer.notchatbot/webchat
Version:
A beautiful React chatbot widget with single-file bundle
173 lines (172 loc) • 4.55 kB
TypeScript
export interface WebChatPositionConfig {
position?: 'bottom-right' | 'bottom-left';
marginBottom?: number;
marginSide?: number;
showPopup?: boolean;
}
export interface WebChatConfig {
elementId: string;
title?: string;
placeholder?: string;
primaryColor?: string;
avatar?: string;
apiKey?: string;
position?: 'bottom-right' | 'bottom-left';
initialMessage?: string;
closeButtonIcon?: 'default' | 'text' | 'custom';
closeButtonText?: string;
closeButtonCustomIcon?: string;
marginBottom?: number;
marginSide?: number;
showPopup?: boolean;
mobile?: WebChatPositionConfig;
desktop?: WebChatPositionConfig;
}
export interface EmbedChatInputConfig {
backgroundColor?: string;
inputBorder?: string;
inputBorderRadius?: string;
iconColor?: string;
}
export interface EmbedChatConfig {
elementId: string;
title?: string;
placeholder?: string;
primaryColor?: string;
avatar?: string;
apiKey?: string;
initialMessage?: string;
footerText?: string;
width?: string | number;
height?: string | number;
maxWidth?: string | number;
maxHeight?: string | number;
minWidth?: string | number;
minHeight?: string | number;
showHeader?: boolean;
showFooter?: boolean;
borderRadius?: string | number;
border?: string;
boxShadow?: string;
chatTransparent?: boolean;
chatBackground?: string;
textColor?: string;
bubbleUserColor?: string;
input?: EmbedChatInputConfig;
footerColor?: string;
customCSS?: string;
}
export interface EmbedChatProps {
config: EmbedChatConfig;
}
export interface EmbedChatWindowProps {
config: EmbedChatConfig;
messages: Message[];
onSendMessage: (message: string) => void;
isLoading?: boolean;
isAiTyping?: boolean;
}
export interface EmbedChatHeaderProps {
title: string;
primaryColor?: string;
avatar?: string;
}
export interface EmbedChatFooterProps {
footerText?: string;
primaryColor?: string;
footerColor?: string;
}
export interface EmbedChatInstance {
destroy: () => void;
updateConfig: (newConfig: Partial<EmbedChatConfig>) => void;
injectCSS: (css: string) => void;
removeCustomCSS: () => void;
}
export interface Message {
id: string;
text: string;
sender: 'user' | 'bot';
timestamp: Date | string;
conversationId?: string;
type: string;
}
export interface ChatBotProps {
config: WebChatConfig;
}
export interface ChatButtonProps {
isOpen: boolean;
onClick: () => void;
primaryColor?: string;
position?: 'bottom-right' | 'bottom-left';
marginBottom?: number;
marginSide?: number;
hasNewMessages?: boolean;
isMobile?: boolean;
}
export interface ChatWindowProps {
isOpen: boolean;
onClose: () => void;
config: WebChatConfig;
messages: Message[];
onSendMessage: (message: string) => void;
isLoading?: boolean;
isAiTyping?: boolean;
position?: 'bottom-right' | 'bottom-left';
marginBottom?: number;
marginSide?: number;
isMobile?: boolean;
}
export interface ChatHeaderProps {
title: string;
onClose: () => void;
primaryColor?: string;
avatar?: string;
closeButtonIcon?: 'default' | 'text' | 'custom';
closeButtonText?: string;
closeButtonCustomIcon?: string;
}
export interface MessageListProps {
messages: Message[];
isTyping: boolean;
avatar?: string;
textColor?: string;
bubbleUserColor?: string;
}
export interface MessageProps {
message: Message;
avatar?: string;
textColor?: string;
bubbleUserColor?: string;
}
export interface MessageInputProps {
onSendMessage: (message: string) => void;
placeholder?: string;
primaryColor?: string;
disabled?: boolean;
input?: EmbedChatInputConfig;
}
export interface TypingIndicatorProps {
avatar?: string;
}
export interface ChatBubblePopoverProps {
initialMessage?: string;
avatar?: string;
position: 'bottom-left' | 'bottom-right';
marginBottom: number;
marginSide: number;
primaryColor: string;
isMobile: boolean;
isOpen: boolean;
onPopoverClick: () => void;
}
export interface WebChatInstance {
root: any;
destroy: () => void;
getConversationId: () => string | null;
}
export interface WebChatAPI {
initialize: (config?: Partial<WebChatConfig>) => WebChatInstance | null;
}
export interface EmbedChatAPI {
initialize: (config: EmbedChatConfig) => EmbedChatInstance | null;
}