@snf/qa-bot-core 0.1.0

package/dist/types/components/BotController.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { BotControllerHandle } from '../config';
+interface BotControllerProps {
+    embedded: boolean;
+    currentOpen?: boolean;
+}
+/**
+ * BotController Component
+ *
+ * Handles the integration between react-chatbotify hooks and the imperative API.
+ * This component must be rendered inside ChatBotProvider to access the hooks.
+ */
+declare const BotController: React.ForwardRefExoticComponent<BotControllerProps & React.RefAttributes<BotControllerHandle>>;
+export default BotController;

package/dist/types/components/NewChatButton.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const NewChatButton: React.FC;
+export default NewChatButton;

package/dist/types/components/QABot.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { type QABotProps, type BotControllerHandle } from '../config';
+/**
+ * Q&A Bot Component - A pre-configured react-chatbotify wrapper with business logic
+ */
+declare const QABot: React.ForwardRefExoticComponent<QABotProps & React.RefAttributes<BotControllerHandle>>;
+export default QABot;

package/dist/types/components/icons/BaseIcon.d.ts

@@ -0,0 +1,9 @@
+export default BaseIcon;
+declare function BaseIcon({ width, height, color, children, ...props }: {
+    [x: string]: any;
+    width?: number;
+    height?: number;
+    color?: string;
+    children: any;
+}): React.JSX.Element;
+import React from 'react';

package/dist/types/components/icons/RefreshIcon.d.ts

@@ -0,0 +1,3 @@
+export default RefreshIcon;
+declare function RefreshIcon(props: any): React.JSX.Element;
+import React from 'react';

package/dist/types/config/constants.d.ts

@@ -0,0 +1,66 @@
+/**
+ * QA Bot Core - Runtime Constants and Usage Examples
+ *
+ * This file contains runtime constants and documentation that was previously
+ * in the large api-reference.js file. TypeScript interfaces are now in types.ts.
+ */
+import { CONSTANTS } from './types';
+export { CONSTANTS };
+/**
+ * ===========================================
+ * USAGE EXAMPLES & PATTERNS
+ * ===========================================
+ */
+export declare const USAGE_EXAMPLES: {
+    readonly SIMPLE: {
+        readonly name: "Level 1: Simple Usage";
+        readonly description: "Just business logic props - everything else uses sensible defaults";
+        readonly code: "\n<QABot\n  apiKey=\"your-key\"\n  endpoints={{ qa: 'https://your-api.com/chat' }}\n/>";
+        readonly requiredProps: readonly ["apiKey", "endpoints"];
+        readonly optionalProps: readonly ["userEmail", "welcomeMessage"];
+    };
+    readonly COMPLEX: {
+        readonly name: "Level 2: Complex Usage";
+        readonly description: "Business logic props + full react-chatbotify settings control";
+        readonly code: "\n<QABot\n  apiKey=\"your-key\"\n  endpoints={{ qa: 'https://your-api.com/chat' }}\n  welcomeMessage=\"Custom welcome!\"\n  settings={{\n    general: { primaryColor: '#brand-color' },\n    header: { title: 'Support Bot' }\n  }}\n/>";
+        readonly props: readonly ["...businessProps", "settings", "plugins", "...reactChatbotifyProps"];
+    };
+    readonly WRAPPER: {
+        readonly name: "Level 3: Wrapper Pattern";
+        readonly description: "Create organizational bots with pre-configured defaults";
+        readonly code: "\nfunction MyOrgBot({ settings = {}, ...props }: WrapperProps) {\n  return (\n    <QABot\n      endpoints={{ qa: 'https://org.com/api' }}\n      settings={{\n        general: { primaryColor: '#org-blue' },\n        ...settings\n      }}\n      {...props}\n    />\n  );\n}";
+    };
+};
+/**
+ * ===========================================
+ * CUSTOM FLOWS EXAMPLES
+ * ===========================================
+ */
+export declare const FLOW_EXAMPLES: {
+    readonly description: "Examples of custom conversation flows";
+    readonly simple: "\nconst customFlows = {\n  start: {\n    message: \"How can I help you?\",\n    options: [\"Ask Question\", \"Create Ticket\"],\n    paths: [\"qa_loop\", \"ticket_flow\"]\n  },\n\n  ticket_flow: {\n    message: \"Please describe your issue:\",\n    function: async (params) => {\n      const ticket = await createTicket(params.userInput);\n      return `Ticket #${ticket.id} created!`;\n    }\n  }\n};";
+    readonly advanced: "\nconst advancedFlows = {\n  start: {\n    message: \"Welcome! What would you like to do?\",\n    options: [\"General Q&A\", \"Create Support Ticket\", \"Report Security Issue\"],\n    paths: [\"qa_loop\", \"ticket_flow\", \"security_flow\"]\n  },\n\n  security_flow: {\n    message: \"Security reports are taken seriously. Please describe the issue:\",\n    function: async (params) => {\n      await createSecurityReport({\n        description: params.userInput,\n        userEmail: params.userEmail,\n        timestamp: new Date(),\n        sessionId: params.sessionId\n      });\n      return \"Thank you for the security report. Our team has been notified.\";\n    }\n  }\n};";
+};
+/**
+ * ===========================================
+ * MIGRATION GUIDE
+ * ===========================================
+ */
+export declare const MIGRATION_FROM_CONFIG_SYSTEM: {
+    readonly description: "How to migrate from the old config-based system to the new prop-based system";
+    readonly mappings: {
+        readonly 'config.core.auth.apiKey': "apiKey prop";
+        readonly 'config.core.endpoints.qa': "endpoints.qa prop";
+        readonly 'config.core.endpoints.rating': "endpoints.rating prop";
+        readonly 'config.user.email': "userEmail prop";
+        readonly 'config.user.name': "userName prop";
+        readonly 'config.user.loginUrl': "loginUrl prop";
+        readonly 'config.flows.welcomeMessage': "welcomeMessage prop";
+        readonly 'config.flows.customFlows': "customFlows prop";
+        readonly 'config.general.*': "settings.general.*";
+        readonly 'config.header.*': "settings.header.*";
+        readonly 'config.chatInput.*': "settings.chatInput.*";
+    };
+    readonly before: "\n// Old config-based system\n<QABot\n  config={{\n    core: {\n      auth: { apiKey: 'key' },\n      endpoints: { qa: '/api' }\n    },\n    flows: { welcomeMessage: 'Hi!' },\n    general: { primaryColor: '#blue' }\n  }}\n  embedded={true}  // Prop override confusion\n/>";
+    readonly after: "\n// New prop-based system\n<QABot\n  apiKey=\"key\"\n  endpoints={{ qa: '/api' }}\n  welcomeMessage=\"Hi!\"\n  settings={{\n    general: {\n      primaryColor: '#blue',\n      embedded: true\n    }\n  }}\n/>";
+};

package/dist/types/config/defaults.d.ts

@@ -0,0 +1,118 @@
+/**
+ * Default react-chatbotify settings for QA Bot Core
+ *
+ * These are sensible defaults that provide a good out-of-the-box experience.
+ * Users can override any of these by passing their own settings object.
+ */
+import React from 'react';
+import type { CustomFlows } from './types';
+export interface ReactChatbotifySettings {
+    general?: {
+        primaryColor?: string;
+        secondaryColor?: string;
+        fontFamily?: string;
+        embedded?: boolean;
+        showHeader?: boolean;
+        showFooter?: boolean;
+    };
+    device?: {
+        desktopEnabled?: boolean;
+        mobileEnabled?: boolean;
+        applyMobileOptimizations?: boolean;
+    };
+    chatHistory?: {
+        disabled?: boolean;
+    };
+    chatButton?: {
+        icon?: string;
+    };
+    audio?: {
+        disabled?: boolean;
+    };
+    emoji?: {
+        disabled?: boolean;
+    };
+    fileAttachment?: {
+        disabled?: boolean;
+    };
+    notification?: {
+        disabled?: boolean;
+    };
+    footer?: {
+        text?: React.ReactElement;
+        buttons?: React.ReactElement[];
+    };
+    event?: {
+        rcbToggleChatWindow?: boolean;
+    };
+    tooltip?: {
+        mode?: 'CLOSE' | 'ALWAYS' | 'NEVER';
+        text?: string;
+    };
+    header?: {
+        title?: string | React.ReactElement;
+        showAvatar?: boolean;
+        avatar?: string;
+        buttons?: any[];
+    };
+    chatInput?: {
+        disabled?: boolean;
+        enabledPlaceholderText?: string;
+        disabledPlaceholderText?: string;
+        characterLimit?: number;
+        showCharacterCount?: boolean;
+        allowNewline?: boolean;
+        sendButtonStyle?: any;
+        sendButtonAriaLabel?: string;
+        ariaLabel?: string;
+        ariaDescribedBy?: string;
+    };
+    chatWindow?: {
+        defaultOpen?: boolean;
+        showScrollbar?: boolean;
+    };
+    botBubble?: {
+        simulateStream?: boolean;
+        streamSpeed?: number;
+        showAvatar?: boolean;
+        allowNewline?: boolean;
+        dangerouslySetInnerHTML?: boolean;
+        renderHtml?: boolean;
+        ariaLabel?: string;
+        role?: string;
+    };
+    userBubble?: {
+        showAvatar?: boolean;
+    };
+}
+export declare const defaultReactChatbotifySettings: ReactChatbotifySettings;
+/**
+ * Default welcome message for Q&A flows
+ */
+export declare const defaultWelcomeMessage: string;
+/**
+ * Default business configuration structure
+ * Used internally for flow generation and business logic
+ */
+export interface BusinessConfig {
+    core: {
+        endpoints: {
+            qa?: string;
+            rating?: string;
+        };
+        auth: {
+            apiKey?: string;
+        };
+    };
+    user: {
+        email?: string;
+        name?: string;
+        loginUrl?: string;
+    };
+    flows: {
+        welcomeMessage: string;
+        customFlows?: CustomFlows;
+    };
+}
+export type { FlowStep, FlowParams } from './types';
+export declare const defaultBusinessConfig: BusinessConfig;

package/dist/types/config/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * QA Bot Core - Configuration Exports
+ *
+ * Central export point for all configuration, types, and constants.
+ * This replaces the old complex api-reference.js system.
+ */
+export type { QABotProps, QABotBusinessProps, EndpointsConfig, BrandingConfig, MessagesConfig, ReactChatbotifyFlow, ReactChatbotifyPlugin, ReactChatbotifyStyles, SimpleUsageProps, ThemeColors, BotControllerHandle, TooltipMode, FlowPath } from './types';
+export type { ReactChatbotifySettings, BusinessConfig } from './defaults';
+export type { CustomFlows, FlowStep, FlowParams } from './types';
+export { defaultReactChatbotifySettings, defaultWelcomeMessage, defaultBusinessConfig } from './defaults';
+export { CONSTANTS } from './types';

package/dist/types/config/types.d.ts

@@ -0,0 +1,150 @@
+/**
+ * QA Bot Core - TypeScript Type Definitions
+ *
+ * SINGLE SOURCE OF TRUTH for all TypeScript interfaces and types.
+ * This replaces the old api-reference.js with proper type definitions.
+ */
+export interface CustomFlows {
+    [stepName: string]: FlowStep;
+}
+export interface FlowStep {
+    message: string;
+    options?: string[];
+    path?: string | ((input: string) => string | Promise<string>);
+    paths?: string[];
+    function?: (params: FlowParams) => string | Promise<string>;
+}
+export interface FlowParams {
+    userInput: string;
+    sessionId: string;
+    injectMessage: (message: string) => void;
+}
+/**
+ * ===========================================
+ * SIMPLE CONFIGURATION (For out-of-the-box users)
+ * ===========================================
+ */
+export interface BrandingConfig {
+    /** Logo/avatar URL for the chatbot header */
+    logo?: string;
+    /** Primary color for buttons, highlights (e.g., "#007bff") */
+    primaryColor?: string;
+    /** Secondary color for hover states (e.g., "#0056b3") */
+    secondaryColor?: string;
+    /** Primary font family for the chat interface */
+    primaryFont?: string;
+    /** Secondary font family for special text (code, etc.) */
+    secondaryFont?: string;
+    /** Name displayed in the chat header */
+    botName?: string;
+}
+export interface MessagesConfig {
+    /** Initial greeting message from the bot */
+    welcome?: string;
+    /** Placeholder text in the input field */
+    placeholder?: string;
+    /** Error message when something goes wrong */
+    error?: string;
+    /** Message shown when chat is disabled */
+    disabled?: string;
+}
+/**
+ * ===========================================
+ * BUSINESS LOGIC PROPS (QA Bot Core Specific)
+ * ===========================================
+ */
+export interface EndpointsConfig {
+    /** Q&A endpoint URL (e.g., "https://your-api.com/chat") */
+    qa: string;
+    /** Optional rating/feedback endpoint URL */
+    rating?: string;
+}
+export interface QABotBusinessProps {
+    /** API key for authenticating with your Q&A service */
+    apiKey?: string;
+    /** API endpoints for Q&A and rating services */
+    endpoints?: EndpointsConfig;
+    /** URL to redirect users for login/authentication */
+    loginUrl?: string;
+    /** Initial greeting message from the bot */
+    welcomeMessage?: string;
+    /** Custom conversation flow definitions */
+    customFlows?: CustomFlows;
+    /** Simple branding configuration */
+    branding?: BrandingConfig;
+    /** Simple message customization */
+    messages?: MessagesConfig;
+}
+/**
+ * ===========================================
+ * REACT-CHATBOTIFY INTEGRATION
+ * ===========================================
+ */
+export interface ReactChatbotifyFlow {
+    [stepName: string]: any;
+}
+export type ReactChatbotifyPlugin = (...args: unknown[]) => {
+    name: string;
+    settings?: any;
+    styles?: any;
+};
+export interface ReactChatbotifyStyles {
+    [key: string]: any;
+}
+/**
+ * ===========================================
+ * COMPLETE QABOT PROPS
+ * ===========================================
+ */
+export interface QABotProps extends QABotBusinessProps {
+}
+/**
+ * ===========================================
+ * USAGE TYPES (SIMPLIFIED)
+ * ===========================================
+ */
+export interface SimpleUsageProps {
+    apiKey: string;
+    endpoints: EndpointsConfig;
+    welcomeMessage?: string;
+}
+/**
+ * ===========================================
+ * INTERNAL TYPES
+ * ===========================================
+ */
+export interface ThemeColors {
+    primaryColor?: string;
+    secondaryColor?: string;
+    fontFamily?: string;
+}
+export interface BotControllerHandle {
+    addMessage: (message: string) => void;
+    openChat: () => void;
+    closeChat: () => void;
+    toggleChat: () => void;
+    setBotEnabled: (enabled: boolean) => void;
+}
+/**
+ * ===========================================
+ * CONSTANTS & ENUMS
+ * ===========================================
+ */
+export declare const CONSTANTS: {
+    readonly DEFAULT_WELCOME_MESSAGE: "Hello! What can I help you with?";
+    readonly DEFAULT_PRIMARY_COLOR: "#1a5b6e";
+    readonly DEFAULT_SECONDARY_COLOR: "#107180";
+    readonly DEFAULT_FONT_FAMILY: "Arial, sans-serif";
+    readonly DEFAULT_AVATAR: "/default-chat-icon.svg";
+    readonly DEFAULT_CHARACTER_LIMIT: 1000;
+    readonly DEFAULT_STREAM_SPEED: 10;
+    readonly TOOLTIP_MODES: readonly ["CLOSE", "ALWAYS", "NEVER"];
+    readonly FLOW_PATHS: {
+        readonly QA_LOOP: "qa_loop";
+        readonly QA_START: "qa_start";
+        readonly RATING: "rating";
+        readonly START: "start";
+    };
+};
+export type TooltipMode = typeof CONSTANTS.TOOLTIP_MODES[number];
+export type FlowPath = typeof CONSTANTS.FLOW_PATHS[keyof typeof CONSTANTS.FLOW_PATHS];

package/dist/types/config.d.ts

@@ -0,0 +1,47 @@
+import type { Settings } from 'react-chatbotify';
+export interface QABotProps {
+    apiKey: string;
+    qaEndpoint: string;
+    welcomeMessage: string;
+    ratingEndpoint?: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    botName?: string;
+    logo?: string;
+    placeholder?: string;
+    errorMessage?: string;
+    embedded?: boolean;
+    footerText?: string;
+    footerLink?: string;
+    tooltipText?: string;
+}
+/**
+ * Default values for overridable props
+ */
+export declare const defaultValues: {
+    primaryColor: string;
+    secondaryColor: string;
+    fontFamily: string;
+    botName: string;
+    avatar: string;
+    placeholder: string;
+    errorMessage: string;
+    embedded: boolean;
+    tooltipText: string;
+};
+/**
+ * Fixed react-chatbotify settings
+ */
+export declare const fixedReactChatbotifySettings: Settings;
+export interface ThemeColors {
+    primaryColor?: string;
+    secondaryColor?: string;
+    fontFamily?: string;
+}
+export interface BotControllerHandle {
+    addMessage: (message: string) => void;
+    openChat: () => void;
+    closeChat: () => void;
+    toggleChat: () => void;
+    setBotEnabled: (enabled: boolean) => void;
+}

package/dist/types/hooks/useChatBotSettings.d.ts

@@ -0,0 +1,13 @@
+import type { Settings } from 'react-chatbotify';
+import type { ThemeColors } from '../config';
+interface UseChatBotSettingsProps {
+    settings: Settings;
+    themeColors: ThemeColors;
+    footerText?: string;
+    footerLink?: string;
+}
+/**
+ * Custom hook to apply theme colors and accessibility enhancements
+ */
+declare const useChatBotSettings: ({ settings, themeColors, footerText, footerLink }: UseChatBotSettingsProps) => void;
+export default useChatBotSettings;

package/dist/types/hooks/useFocusableSendButton.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Hook to make the send button focusable and keyboard accessible
+ */
+declare const useFocusableSendButton: () => void;
+export default useFocusableSendButton;

package/dist/types/hooks/useKeyboardNavigation.d.ts

@@ -0,0 +1,6 @@
+export default useKeyboardNavigation;
+/**
+ * Custom hook for keyboard navigation in chatbot options
+ * Provides arrow key navigation, Enter/Space selection, and accessibility features
+ */
+declare function useKeyboardNavigation(): any;

package/dist/types/hooks/useThemeColors.d.ts

@@ -0,0 +1,12 @@
+import { RefObject } from 'react';
+import type { ThemeColors } from '../config';
+interface ThemeConfig {
+    primaryColor?: string;
+    secondaryColor?: string;
+    fontFamily?: string;
+}
+/**
+ * Custom hook to get theme colors from CSS variables
+ */
+declare const useThemeColors: (containerRef: RefObject<HTMLDivElement>, themeConfig?: ThemeConfig) => ThemeColors;
+export default useThemeColors;

package/dist/types/lib.d.ts

@@ -0,0 +1,44 @@
+import QABot from './components/QABot';
+import './styles/index.css';
+export { QABot };
+export type { QABotProps, BotControllerHandle } from './config';
+/**
+ * ===========================================
+ * PROGRAMMATIC API TYPES
+ * ===========================================
+ */
+interface QABotConfig {
+    target: HTMLElement;
+    apiKey: string;
+    qaEndpoint: string;
+    ratingEndpoint?: string;
+    defaultOpen?: boolean;
+    embedded?: boolean;
+    enabled?: boolean;
+    welcomeMessage: string;
+    primaryColor?: string;
+    secondaryColor?: string;
+    botName?: string;
+    logo?: string;
+    placeholder?: string;
+    errorMessage?: string;
+    footerText?: string;
+    footerLink?: string;
+    tooltipText?: string;
+}
+interface QABotInstance {
+    addMessage: (message: string) => void;
+    setBotEnabled: (status: boolean) => void;
+    openChat: () => void;
+    closeChat: () => void;
+    toggleChat: () => void;
+    destroy: () => void;
+}
+/**
+ * JavaScript API function - creates a QA Bot instance programmatically
+ *
+ * @param config Configuration object for the bot
+ * @returns QABot instance with control methods
+ */
+export declare function qaBot(config: QABotConfig): QABotInstance | undefined;
+export default qaBot;

package/dist/types/standalone.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Standalone build entry point for QA Bot Core
+ *
+ * This creates a standalone UMD bundle that includes React (via Preact).
+ * Used when loading the bot via script tag in vanilla HTML/JS environments.
+ */
+import qaBot from './lib';
+export default qaBot;

package/dist/types/utils/create-bot-flow.d.ts

@@ -0,0 +1,12 @@
+import type { BusinessConfig, CustomFlows, ReactChatbotifyFlow } from '../config';
+interface CreateBotFlowParams {
+    config: BusinessConfig;
+    customFlows?: CustomFlows;
+    sessionId: string;
+}
+/**
+ * Creates the bot conversation flow
+ * Supports both basic Q&A and custom flows via plugins
+ */
+export declare function createBotFlow({ config, customFlows, sessionId }: CreateBotFlowParams): ReactChatbotifyFlow;
+export {};

package/dist/types/utils/deep-merge.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Deep merge utility for nested configuration objects
+ * Handles proper merging of nested objects while preserving arrays and other types
+ */
+export declare function deepMerge(target: any, source: any): any;
+/**
+ * Merge multiple objects with deep merging
+ * Objects are merged left-to-right (later objects have higher priority)
+ */
+export declare function deepMergeAll(...objects: any[]): any;

package/dist/types/utils/flow-merger.d.ts

@@ -0,0 +1,14 @@
+import type { Flow } from 'react-chatbotify';
+import type { CustomFlows } from '../config';
+/**
+ * Merges custom flows with the base Q&A flow
+ * Custom flows can:
+ * - Override existing flow steps
+ * - Add new flow paths
+ * - Integrate with Q&A loop via 'qa_loop' path
+ */
+export declare function mergeFlows(baseFlow: Flow, customFlows?: CustomFlows): Flow;
+/**
+ * Creates a flow that integrates custom flows with Q&A
+ */
+export declare function createIntegratedFlow(qaFlow: Flow, customFlows?: CustomFlows, welcomeMessage?: string): Flow;

package/dist/types/utils/flows/qa-flow.d.ts

@@ -0,0 +1,25 @@
+/**
+ * Creates the basic Q&A conversation flow
+ * Handles questions, responses, and optional ratings
+ *
+ * @param {Object} params Configuration
+ * @param {string} params.endpoint Q&A API endpoint (required)
+ * @param {string} params.ratingEndpoint Rating API endpoint (optional)
+ * @param {string} params.apiKey API key for authentication (optional)
+ * @param {string} params.sessionId Session ID for tracking
+ * @returns {Object} Q&A flow configuration
+ */
+export declare const createQAFlow: ({ endpoint, ratingEndpoint, apiKey, sessionId }: {
+    endpoint: any;
+    ratingEndpoint: any;
+    apiKey: any;
+    sessionId: any;
+}) => {
+    qa_loop: {
+        message: (chatState: any) => Promise<"Thanks for the feedback! Feel free to ask another question." | "I apologize, but I'm having trouble processing your question. Please try again later.">;
+        options: (chatState: any) => string[];
+        renderMarkdown: string[];
+        chatDisabled: boolean;
+        path: string;
+    };
+};

package/dist/types/utils/getProcessedText.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Processes text to convert bare URLs into markdown hyperlinks while preserving existing links
+ */
+export declare const getProcessedText: (text: string) => string;

package/dist/types/utils/session-utils.d.ts

@@ -0,0 +1,2 @@
+export declare const generateSessionId: () => string;
+export declare const getOrCreateSessionId: () => string;

package/dist/types/utils/validation-utils.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Email validation utility functions
+ */
+/**
+ * Validates email format using a comprehensive regex pattern
+ */
+export declare const isValidEmail: (email: string) => boolean;
+interface ValidationResult {
+    success: boolean;
+    promptContent?: string;
+    promptDuration?: number;
+    promptType?: string;
+    highlightTextArea?: boolean;
+}
+/**
+ * Creates email validation for chat bot flows
+ */
+export declare const validateEmail: (email: string) => ValidationResult;
+export {};