@weldsuite/helpdesk-widget-sdk 1.0.2

package/dist/react.esm.js

@@ -0,0 +1,2479 @@
+import { useRef, useEffect, useCallback } from 'react';
+
+/**
+ * Weld SDK - Configuration Types
+ * Type definitions for SDK initialization and configuration
+ */
+/**
+ * Default configuration values
+ */
+const DEFAULT_CONFIG = {
+    api: {
+        baseUrl: 'https://weldsuite-helpdesk-widget.vercel.app',
+        widgetId: '',
+        timeout: 30000,
+        retries: 3,
+    },
+    iframes: {
+        launcher: {
+            url: '/widget?mode=launcher',
+            name: 'weld-launcher-frame',
+            position: { bottom: '24px', right: '24px' },
+            size: '60px',
+        },
+        widget: {
+            url: '/widget?mode=widget',
+            name: 'weld-widget-frame',
+            position: { bottom: '100px', right: '24px' },
+            width: '400px',
+            height: 'min(680px, calc(100vh - 120px))',
+        },
+        backdrop: {
+            enabled: true,
+            closeOnClick: true,
+        },
+    },
+    customization: {
+        primaryColor: '#000000',
+        accentColor: '#3b82f6',
+        backgroundColor: '#ffffff',
+        textColor: '#111827',
+        fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+        fontSize: '14px',
+        borderRadius: '12px',
+    },
+    features: {
+        attachments: true,
+        reactions: true,
+        typing: true,
+        readReceipts: true,
+        offlineMode: false,
+        fileUpload: true,
+        imageUpload: true,
+        voiceMessages: false,
+        videoMessages: false,
+    },
+    mobile: {
+        fullScreen: true,
+        scrollLock: true,
+        keyboardHandling: 'auto',
+        safeAreaInsets: true,
+    },
+    auth: {
+        enabled: true,
+        mode: 'anonymous',
+    },
+    locale: {
+        locale: 'en',
+        dateFormat: 'MMM dd, yyyy',
+        timeFormat: 'HH:mm',
+    },
+    logging: {
+        enabled: true,
+        level: 'warn',
+        prefix: '[Weld]',
+        includeTimestamp: true,
+    },
+    performance: {
+        lazyLoad: true,
+        preload: false,
+        caching: true,
+        prefetch: false,
+    },
+    security: {
+        allowedOrigins: [],
+        validateMessages: true,
+        sanitizeInput: true,
+    },
+};
+/**
+ * Configuration validation
+ */
+function validateConfig(config) {
+    if (!config.widgetId || typeof config.widgetId !== 'string') {
+        throw new Error('WeldConfig: widgetId is required and must be a string');
+    }
+    return true;
+}
+/**
+ * Merge configuration with defaults
+ */
+function resolveConfig(config) {
+    validateConfig(config);
+    return {
+        widgetId: config.widgetId,
+        api: {
+            ...DEFAULT_CONFIG.api,
+            widgetId: config.widgetId,
+            ...config.api,
+        },
+        iframes: {
+            launcher: {
+                ...DEFAULT_CONFIG.iframes.launcher,
+                ...config.iframes?.launcher,
+                position: {
+                    ...DEFAULT_CONFIG.iframes.launcher.position,
+                    ...config.position?.launcher,
+                    ...config.iframes?.launcher?.position,
+                },
+            },
+            widget: {
+                ...DEFAULT_CONFIG.iframes.widget,
+                ...config.iframes?.widget,
+                position: {
+                    ...DEFAULT_CONFIG.iframes.widget.position,
+                    ...config.position?.widget,
+                    ...config.iframes?.widget?.position,
+                },
+            },
+            backdrop: {
+                ...DEFAULT_CONFIG.iframes.backdrop,
+                ...config.iframes?.backdrop,
+            },
+        },
+        customization: {
+            ...DEFAULT_CONFIG.customization,
+            ...config.customization,
+        },
+        features: {
+            ...DEFAULT_CONFIG.features,
+            ...config.features,
+        },
+        mobile: {
+            ...DEFAULT_CONFIG.mobile,
+            ...config.mobile,
+        },
+        auth: {
+            ...DEFAULT_CONFIG.auth,
+            ...config.auth,
+        },
+        locale: {
+            ...DEFAULT_CONFIG.locale,
+            ...config.locale,
+        },
+        logging: {
+            ...DEFAULT_CONFIG.logging,
+            ...config.logging,
+        },
+        performance: {
+            ...DEFAULT_CONFIG.performance,
+            ...config.performance,
+        },
+        security: {
+            ...DEFAULT_CONFIG.security,
+            ...config.security,
+        },
+        // Pass through callbacks
+        onReady: config.onReady,
+        onError: config.onError,
+        onOpen: config.onOpen,
+        onClose: config.onClose,
+        onMessage: config.onMessage,
+        onMinimize: config.onMinimize,
+        onMaximize: config.onMaximize,
+        onDestroy: config.onDestroy,
+    };
+}
+
+/**
+ * Weld SDK - Logger Utility
+ * Centralized logging with configurable levels and formatting
+ */
+/**
+ * Log levels
+ */
+var LogLevel;
+(function (LogLevel) {
+    LogLevel[LogLevel["DEBUG"] = 0] = "DEBUG";
+    LogLevel[LogLevel["INFO"] = 1] = "INFO";
+    LogLevel[LogLevel["WARN"] = 2] = "WARN";
+    LogLevel[LogLevel["ERROR"] = 3] = "ERROR";
+    LogLevel[LogLevel["SILENT"] = 4] = "SILENT";
+})(LogLevel || (LogLevel = {}));
+/**
+ * Logger class
+ */
+class Logger {
+    constructor(config) {
+        this.config = {
+            enabled: true,
+            level: 'warn',
+            prefix: '[Weld]',
+            includeTimestamp: true,
+            ...config,
+        };
+        this.level = this.getLevelFromString(this.config.level);
+    }
+    /**
+     * Convert string level to LogLevel enum
+     */
+    getLevelFromString(level) {
+        switch (level.toLowerCase()) {
+            case 'debug':
+                return LogLevel.DEBUG;
+            case 'info':
+                return LogLevel.INFO;
+            case 'warn':
+                return LogLevel.WARN;
+            case 'error':
+                return LogLevel.ERROR;
+            default:
+                return LogLevel.WARN;
+        }
+    }
+    /**
+     * Check if logging is enabled for level
+     */
+    shouldLog(level) {
+        return (this.config.enabled ?? true) && level >= this.level;
+    }
+    /**
+     * Format log message
+     */
+    format(level, message, _data) {
+        const parts = [];
+        if (this.config.prefix) {
+            parts.push(this.config.prefix);
+        }
+        if (this.config.includeTimestamp) {
+            const timestamp = new Date().toISOString();
+            parts.push(`[${timestamp}]`);
+        }
+        parts.push(`[${level.toUpperCase()}]`);
+        parts.push(message);
+        return parts;
+    }
+    /**
+     * Log debug message
+     */
+    debug(message, data) {
+        if (!this.shouldLog(LogLevel.DEBUG))
+            return;
+        const formatted = this.format('debug', message, data);
+        if (data !== undefined) {
+            console.debug(...formatted, data);
+        }
+        else {
+            console.debug(...formatted);
+        }
+    }
+    /**
+     * Log info message
+     */
+    info(message, data) {
+        if (!this.shouldLog(LogLevel.INFO))
+            return;
+        const formatted = this.format('info', message, data);
+        if (data !== undefined) {
+            console.info(...formatted, data);
+        }
+        else {
+            console.info(...formatted);
+        }
+    }
+    /**
+     * Log warning message
+     */
+    warn(message, data) {
+        if (!this.shouldLog(LogLevel.WARN))
+            return;
+        const formatted = this.format('warn', message, data);
+        if (data !== undefined) {
+            console.warn(...formatted, data);
+        }
+        else {
+            console.warn(...formatted);
+        }
+    }
+    /**
+     * Log error message
+     */
+    error(message, error) {
+        if (!this.shouldLog(LogLevel.ERROR))
+            return;
+        const formatted = this.format('error', message);
+        if (error !== undefined) {
+            if (error instanceof Error) {
+                console.error(...formatted, error.message, error.stack);
+            }
+            else {
+                console.error(...formatted, error);
+            }
+        }
+        else {
+            console.error(...formatted);
+        }
+    }
+    /**
+     * Create child logger with prefix
+     */
+    child(prefix) {
+        return new Logger({
+            ...this.config,
+            prefix: `${this.config.prefix} ${prefix}`,
+        });
+    }
+    /**
+     * Update log level at runtime
+     */
+    setLevel(level) {
+        this.config.level = level;
+        this.level = this.getLevelFromString(level);
+    }
+    /**
+     * Enable/disable logging
+     */
+    setEnabled(enabled) {
+        this.config.enabled = enabled;
+    }
+}
+/**
+ * Default logger instance
+ */
+new Logger({
+    enabled: true,
+    level: 'warn',
+    prefix: '[Weld]',
+    includeTimestamp: true,
+});
+
+/**
+ * Weld SDK - Iframe Manager
+ * Manages creation, lifecycle, and communication with multiple iframes
+ */
+/**
+ * Iframe types
+ */
+var IframeType;
+(function (IframeType) {
+    IframeType["LAUNCHER"] = "launcher";
+    IframeType["WIDGET"] = "widget";
+    IframeType["BACKDROP"] = "backdrop";
+})(IframeType || (IframeType = {}));
+/**
+ * Device detection result
+ */
+function detectDevice() {
+    const width = window.innerWidth;
+    const height = window.innerHeight;
+    const userAgent = navigator.userAgent;
+    const isMobile = width < 768;
+    const isTablet = width >= 768 && width <= 1024;
+    const isDesktop = width > 1024;
+    const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
+    return {
+        type: isMobile ? 'mobile' : isTablet ? 'tablet' : 'desktop',
+        isMobile,
+        isTablet,
+        isDesktop,
+        isTouchDevice,
+        screenWidth: width,
+        screenHeight: height,
+        orientation: width > height ? 'landscape' : 'portrait',
+        userAgent,
+    };
+}
+/**
+ * IframeManager class
+ * Orchestrates multiple iframes for the widget system
+ */
+class IframeManager {
+    constructor(config) {
+        this.iframes = new Map();
+        this.rootContainer = null;
+        this.appContainer = null;
+        this.modalContainer = null;
+        this.styleElement = null;
+        this.config = config;
+        this.logger = new Logger(config.logging);
+        this.deviceInfo = detectDevice();
+        this.logger.info('IframeManager initialized', {
+            device: this.deviceInfo.type,
+            mobile: this.deviceInfo.isMobile,
+        });
+    }
+    /**
+     * Initialize all containers and iframes
+     */
+    async init() {
+        this.logger.debug('Initializing iframe manager');
+        try {
+            // Create root container structure
+            this.createRootContainer();
+            // Inject CSS
+            this.injectCSS();
+            // Create iframes
+            await this.createLauncherIframe();
+            await this.createBackdropIframe();
+            await this.createWidgetIframe();
+            // Setup event listeners
+            this.setupEventListeners();
+            this.logger.info('IframeManager initialized successfully');
+        }
+        catch (error) {
+            this.logger.error('Failed to initialize IframeManager', error);
+            throw error;
+        }
+    }
+    /**
+     * Create root container structure
+     */
+    createRootContainer() {
+        // Check if already exists
+        let existingContainer = document.getElementById('weld-container');
+        if (existingContainer) {
+            this.logger.warn('Weld container already exists, removing old instance');
+            existingContainer.remove();
+        }
+        // Create root container
+        this.rootContainer = document.createElement('div');
+        this.rootContainer.id = 'weld-container';
+        this.rootContainer.className = 'weld-namespace';
+        // Create app container
+        this.appContainer = document.createElement('div');
+        this.appContainer.className = 'weld-app';
+        this.appContainer.setAttribute('aria-live', 'polite');
+        this.appContainer.setAttribute('role', 'complementary');
+        this.appContainer.setAttribute('aria-label', 'Weld Helpdesk Widget');
+        // Create modal container
+        this.modalContainer = document.createElement('div');
+        this.modalContainer.id = 'weld-modal-container';
+        // Assemble structure
+        this.rootContainer.appendChild(this.appContainer);
+        this.rootContainer.appendChild(this.modalContainer);
+        document.body.appendChild(this.rootContainer);
+        this.logger.debug('Root container created');
+    }
+    /**
+     * Inject CSS into the page
+     */
+    injectCSS() {
+        // Remove existing style if present
+        const existingStyle = document.getElementById('weld-styles');
+        if (existingStyle) {
+            existingStyle.remove();
+        }
+        this.styleElement = document.createElement('style');
+        this.styleElement.id = 'weld-styles';
+        this.styleElement.textContent = this.generateCSS();
+        document.head.appendChild(this.styleElement);
+        this.logger.debug('CSS injected');
+    }
+    /**
+     * Generate CSS for containers
+     */
+    generateCSS() {
+        const { customization } = this.config;
+        return `
+      /* Weld Container */
+      #weld-container {
+        --weld-color-primary: ${customization.primaryColor};
+        --weld-color-accent: ${customization.accentColor};
+        --weld-font-family: ${customization.fontFamily};
+        --weld-font-size-base: ${customization.fontSize};
+        --weld-radius-xl: ${customization.borderRadius};
+      }
+
+      /* Import main stylesheet */
+      @import url('/styles/index.css');
+
+      /* Prevent page scroll when mobile widget is open */
+      body.weld-mobile-open {
+        overflow: hidden !important;
+        position: fixed !important;
+        width: 100% !important;
+        height: 100% !important;
+      }
+
+      /* High contrast mode support */
+      @media (prefers-contrast: high) {
+        .weld-namespace {
+          --weld-color-border: currentColor;
+        }
+      }
+    `;
+    }
+    /**
+     * Create launcher iframe
+     */
+    async createLauncherIframe() {
+        const { iframes } = this.config;
+        const { launcher } = iframes;
+        // Create container
+        const container = document.createElement('div');
+        container.className = 'weld-launcher-frame';
+        container.setAttribute('data-state', 'visible');
+        container.style.cssText = `
+      position: fixed;
+      bottom: ${launcher.position.bottom};
+      right: ${launcher.position.right};
+      width: ${launcher.size};
+      height: ${launcher.size};
+      z-index: 2147483003;
+      pointer-events: auto;
+      display: block;
+    `;
+        // Create iframe
+        const iframe = document.createElement('iframe');
+        iframe.name = launcher.name;
+        iframe.title = 'Weld Launcher';
+        iframe.src = this.buildIframeUrl(launcher.url);
+        iframe.style.cssText = `
+      width: 100%;
+      height: 100%;
+      border: none;
+      background: transparent;
+      display: block;
+    `;
+        iframe.setAttribute('allow', 'clipboard-write');
+        iframe.setAttribute('sandbox', 'allow-scripts allow-same-origin allow-forms allow-popups');
+        container.appendChild(iframe);
+        this.appContainer?.appendChild(container);
+        // Store metadata
+        this.iframes.set(IframeType.LAUNCHER, {
+            type: IframeType.LAUNCHER,
+            element: iframe,
+            container,
+            ready: false,
+            visible: true,
+            createdAt: Date.now(),
+        });
+        // Mark as ready when loaded
+        iframe.onload = () => {
+            const metadata = this.iframes.get(IframeType.LAUNCHER);
+            if (metadata) {
+                metadata.ready = true;
+                this.logger.debug('Launcher iframe loaded and ready');
+            }
+        };
+        this.logger.debug('Launcher iframe created');
+    }
+    /**
+     * Create widget iframe
+     */
+    async createWidgetIframe() {
+        const { iframes } = this.config;
+        const { widget } = iframes;
+        // Create container
+        const container = document.createElement('div');
+        container.className = 'weld-widget-frame';
+        container.setAttribute('data-state', 'closed');
+        container.style.cssText = `
+      position: fixed;
+      bottom: ${widget.position.bottom};
+      right: ${widget.position.right};
+      width: ${widget.width};
+      height: ${widget.height};
+      max-width: 100vw;
+      z-index: 2147483001;
+      pointer-events: none;
+      display: none;
+      border-radius: 16px;
+      overflow: hidden;
+      background: transparent;
+    `;
+        // Create iframe
+        const iframe = document.createElement('iframe');
+        iframe.name = widget.name;
+        iframe.title = 'Weld Widget';
+        iframe.src = this.buildIframeUrl(widget.url);
+        iframe.style.cssText = `
+      width: 100%;
+      height: 100%;
+      border: none;
+      background: transparent;
+      display: block;
+      border-radius: 16px;
+    `;
+        iframe.setAttribute('allow', 'clipboard-write; camera; microphone');
+        iframe.setAttribute('sandbox', 'allow-scripts allow-same-origin allow-forms allow-popups allow-downloads');
+        container.appendChild(iframe);
+        this.appContainer?.appendChild(container);
+        // Store metadata
+        this.iframes.set(IframeType.WIDGET, {
+            type: IframeType.WIDGET,
+            element: iframe,
+            container,
+            ready: false,
+            visible: false,
+            createdAt: Date.now(),
+        });
+        // Mark as ready when loaded
+        iframe.onload = () => {
+            const metadata = this.iframes.get(IframeType.WIDGET);
+            if (metadata) {
+                metadata.ready = true;
+                this.logger.debug('Widget iframe loaded and ready');
+            }
+        };
+        this.logger.debug('Widget iframe created');
+    }
+    /**
+     * Create backdrop iframe
+     */
+    async createBackdropIframe() {
+        if (!this.config.iframes.backdrop?.enabled) {
+            this.logger.debug('Backdrop disabled, skipping creation');
+            return;
+        }
+        // Create container
+        const container = document.createElement('div');
+        container.className = 'weld-backdrop-frame';
+        container.setAttribute('data-state', 'hidden');
+        container.style.cssText = `
+      position: fixed;
+      top: 0;
+      left: 0;
+      right: 0;
+      bottom: 0;
+      z-index: 2147483000;
+      background: transparent;
+      pointer-events: none;
+      opacity: 0;
+      transition: opacity 200ms ease;
+    `;
+        this.appContainer?.appendChild(container);
+        // Store metadata (backdrop doesn't have an iframe, just a div)
+        // We'll create a minimal "iframe" reference for consistency
+        const dummyIframe = document.createElement('iframe');
+        dummyIframe.style.display = 'none';
+        this.iframes.set(IframeType.BACKDROP, {
+            type: IframeType.BACKDROP,
+            element: dummyIframe,
+            container,
+            ready: true, // Backdrop is always ready
+            visible: false,
+            createdAt: Date.now(),
+        });
+        this.logger.debug('Backdrop created');
+    }
+    /**
+     * Build iframe URL with parameters
+     */
+    buildIframeUrl(path) {
+        const { widgetId, api } = this.config;
+        const baseUrl = api.baseUrl;
+        // Handle paths that may already have query parameters
+        const url = new URL(path, baseUrl);
+        url.searchParams.set('widgetId', widgetId);
+        url.searchParams.set('device', this.deviceInfo.type);
+        url.searchParams.set('mobile', String(this.deviceInfo.isMobile));
+        url.searchParams.set('parentOrigin', window.location.origin);
+        return url.toString();
+    }
+    /**
+     * Setup event listeners
+     */
+    setupEventListeners() {
+        // Window resize
+        window.addEventListener('resize', this.handleResize.bind(this));
+        // Orientation change
+        window.addEventListener('orientationchange', this.handleOrientationChange.bind(this));
+        this.logger.debug('Event listeners setup');
+    }
+    /**
+     * Handle window resize
+     */
+    handleResize() {
+        this.deviceInfo = detectDevice();
+        this.logger.debug('Window resized', { device: this.deviceInfo.type });
+    }
+    /**
+     * Handle orientation change
+     */
+    handleOrientationChange() {
+        this.deviceInfo = detectDevice();
+        this.logger.debug('Orientation changed', { orientation: this.deviceInfo.orientation });
+    }
+    /**
+     * Get iframe by type
+     */
+    getIframe(type) {
+        return this.iframes.get(type);
+    }
+    /**
+     * Get iframe element
+     */
+    getIframeElement(type) {
+        return this.iframes.get(type)?.element;
+    }
+    /**
+     * Get iframe container
+     */
+    getIframeContainer(type) {
+        return this.iframes.get(type)?.container;
+    }
+    /**
+     * Mark iframe as ready
+     */
+    setIframeReady(type) {
+        const iframe = this.iframes.get(type);
+        if (iframe) {
+            iframe.ready = true;
+            this.logger.debug(`Iframe ${type} marked as ready`);
+        }
+    }
+    /**
+     * Check if all iframes are ready
+     */
+    areAllIframesReady() {
+        for (const [type, iframe] of this.iframes) {
+            if (type !== IframeType.BACKDROP && !iframe.ready) {
+                return false;
+            }
+        }
+        return true;
+    }
+    /**
+     * Show iframe
+     */
+    showIframe(type) {
+        const iframe = this.iframes.get(type);
+        if (!iframe) {
+            console.warn(`[Weld SDK] showIframe: iframe ${type} not found`);
+            return;
+        }
+        console.log(`[Weld SDK] Showing iframe ${type}`, { currentDisplay: iframe.container.style.display });
+        iframe.visible = true;
+        iframe.container.setAttribute('data-state', type === IframeType.BACKDROP ? 'visible' : 'open');
+        iframe.container.style.pointerEvents = 'auto';
+        iframe.container.style.display = 'block';
+        // Handle mobile scroll lock
+        if (this.deviceInfo.isMobile && type === IframeType.WIDGET && this.config.mobile.scrollLock) {
+            document.body.classList.add('weld-mobile-open');
+        }
+        console.log(`[Weld SDK] Iframe ${type} shown`, { newDisplay: iframe.container.style.display });
+    }
+    /**
+     * Hide iframe
+     */
+    hideIframe(type) {
+        const iframe = this.iframes.get(type);
+        if (!iframe) {
+            console.warn(`[Weld SDK] hideIframe: iframe ${type} not found`);
+            return;
+        }
+        console.log(`[Weld SDK] Hiding iframe ${type}`, { currentDisplay: iframe.container.style.display });
+        iframe.visible = false;
+        iframe.container.setAttribute('data-state', type === IframeType.BACKDROP ? 'hidden' : 'closed');
+        iframe.container.style.pointerEvents = 'none';
+        iframe.container.style.display = 'none';
+        // Remove mobile scroll lock
+        if (this.deviceInfo.isMobile && type === IframeType.WIDGET) {
+            document.body.classList.remove('weld-mobile-open');
+        }
+        console.log(`[Weld SDK] Iframe ${type} hidden`, { newDisplay: iframe.container.style.display });
+    }
+    /**
+     * Get device info
+     */
+    getDeviceInfo() {
+        return this.deviceInfo;
+    }
+    /**
+     * Get modal container
+     */
+    getModalContainer() {
+        return this.modalContainer;
+    }
+    /**
+     * Destroy all iframes and cleanup
+     */
+    destroy() {
+        this.logger.debug('Destroying iframe manager');
+        // Remove event listeners
+        window.removeEventListener('resize', this.handleResize.bind(this));
+        window.removeEventListener('orientationchange', this.handleOrientationChange.bind(this));
+        // Remove mobile scroll lock
+        document.body.classList.remove('weld-mobile-open');
+        // Remove root container
+        if (this.rootContainer) {
+            this.rootContainer.remove();
+            this.rootContainer = null;
+        }
+        // Remove style element
+        if (this.styleElement) {
+            this.styleElement.remove();
+            this.styleElement = null;
+        }
+        // Clear iframe references
+        this.iframes.clear();
+        this.logger.info('IframeManager destroyed');
+    }
+}
+
+/**
+ * Weld SDK - Message Types
+ * Type definitions for postMessage communication between parent and iframes
+ */
+/**
+ * Message origins for validation
+ */
+var MessageOrigin;
+(function (MessageOrigin) {
+    MessageOrigin["LAUNCHER"] = "launcher";
+    MessageOrigin["WIDGET"] = "widget";
+    MessageOrigin["PARENT"] = "parent";
+    MessageOrigin["BACKDROP"] = "backdrop";
+})(MessageOrigin || (MessageOrigin = {}));
+/**
+ * Message types for different communication patterns
+ */
+var MessageType;
+(function (MessageType) {
+    // Lifecycle
+    MessageType["READY"] = "weld:ready";
+    MessageType["INIT"] = "weld:init";
+    MessageType["DESTROY"] = "weld:destroy";
+    // State changes
+    MessageType["STATE_UPDATE"] = "weld:state:update";
+    MessageType["STATE_REQUEST"] = "weld:state:request";
+    MessageType["STATE_RESPONSE"] = "weld:state:response";
+    // Widget control
+    MessageType["WIDGET_OPEN"] = "weld:widget:open";
+    MessageType["WIDGET_CLOSE"] = "weld:widget:close";
+    MessageType["WIDGET_TOGGLE"] = "weld:widget:toggle";
+    MessageType["WIDGET_MINIMIZE"] = "weld:widget:minimize";
+    MessageType["WIDGET_MAXIMIZE"] = "weld:widget:maximize";
+    // Launcher control
+    MessageType["LAUNCHER_SHOW"] = "weld:launcher:show";
+    MessageType["LAUNCHER_HIDE"] = "weld:launcher:hide";
+    MessageType["LAUNCHER_UPDATE"] = "weld:launcher:update";
+    // Backdrop control
+    MessageType["BACKDROP_SHOW"] = "weld:backdrop:show";
+    MessageType["BACKDROP_HIDE"] = "weld:backdrop:hide";
+    MessageType["BACKDROP_CLICK"] = "weld:backdrop:click";
+    // User interactions
+    MessageType["MESSAGE_SEND"] = "weld:message:send";
+    MessageType["MESSAGE_RECEIVE"] = "weld:message:receive";
+    MessageType["TYPING_START"] = "weld:typing:start";
+    MessageType["TYPING_STOP"] = "weld:typing:stop";
+    // Badge updates
+    MessageType["BADGE_UPDATE"] = "weld:badge:update";
+    MessageType["BADGE_CLEAR"] = "weld:badge:clear";
+    // Mobile handling
+    MessageType["MOBILE_SCROLL_LOCK"] = "weld:mobile:scroll:lock";
+    MessageType["MOBILE_SCROLL_UNLOCK"] = "weld:mobile:scroll:unlock";
+    // Configuration
+    MessageType["CONFIG_UPDATE"] = "weld:config:update";
+    MessageType["THEME_UPDATE"] = "weld:theme:update";
+    MessageType["LOCALE_UPDATE"] = "weld:locale:update";
+    // Authentication
+    MessageType["AUTH_LOGIN"] = "weld:auth:login";
+    MessageType["AUTH_LOGOUT"] = "weld:auth:logout";
+    MessageType["AUTH_TOKEN_UPDATE"] = "weld:auth:token:update";
+    // Events
+    MessageType["EVENT_TRACK"] = "weld:event:track";
+    MessageType["ERROR_REPORT"] = "weld:error:report";
+    // API responses
+    MessageType["API_SUCCESS"] = "weld:api:success";
+    MessageType["API_ERROR"] = "weld:api:error";
+})(MessageType || (MessageType = {}));
+/**
+ * Type guards
+ */
+function isBaseMessage(message) {
+    return (typeof message === 'object' &&
+        message !== null &&
+        'type' in message &&
+        'origin' in message &&
+        'timestamp' in message &&
+        'id' in message);
+}
+function isPayloadMessage(message) {
+    return isBaseMessage(message) && 'payload' in message;
+}
+/**
+ * Message creator utilities
+ */
+function createMessage(type, origin, payload) {
+    return {
+        type,
+        origin,
+        timestamp: Date.now(),
+        id: `${type}_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
+        payload,
+    };
+}
+
+/**
+ * Weld SDK - Security Utilities
+ * Security validation and origin checking for postMessage communication
+ */
+/**
+ * SecurityManager class
+ */
+class SecurityManager {
+    constructor(config, logger) {
+        this.config = config;
+        this.logger = logger;
+        this.allowedOrigins = new Set(config.allowedOrigins || []);
+        // Always allow same origin
+        this.allowedOrigins.add(window.location.origin);
+    }
+    /**
+     * Validate message origin
+     */
+    isOriginAllowed(origin) {
+        // If no allowed origins specified, only allow same origin
+        if (this.config.allowedOrigins?.length === 0) {
+            return origin === window.location.origin;
+        }
+        // Check if origin is in allowed list
+        if (this.allowedOrigins.has(origin)) {
+            return true;
+        }
+        // Check for wildcard patterns
+        for (const allowed of this.allowedOrigins) {
+            if (this.matchesPattern(origin, allowed)) {
+                return true;
+            }
+        }
+        this.logger.warn('Origin not allowed', { origin });
+        return false;
+    }
+    /**
+     * Match origin against pattern (supports wildcards)
+     */
+    matchesPattern(origin, pattern) {
+        // Exact match
+        if (origin === pattern) {
+            return true;
+        }
+        // Wildcard pattern (e.g., "https://*.example.com")
+        if (pattern.includes('*')) {
+            const regex = new RegExp('^' + pattern.replace(/\./g, '\\.').replace(/\*/g, '.*') + '$');
+            return regex.test(origin);
+        }
+        return false;
+    }
+    /**
+     * Validate postMessage event
+     */
+    validateMessageEvent(event) {
+        // Check origin
+        if (!this.isOriginAllowed(event.origin)) {
+            this.logger.warn('Invalid message origin', { origin: event.origin });
+            return false;
+        }
+        // Check if message has data
+        if (!event.data) {
+            this.logger.warn('Message has no data');
+            return false;
+        }
+        // Check if message is an object
+        if (typeof event.data !== 'object') {
+            this.logger.warn('Message data is not an object');
+            return false;
+        }
+        return true;
+    }
+    /**
+     * Sanitize message data
+     */
+    sanitizeMessageData(data) {
+        if (!this.config.sanitizeInput) {
+            return data;
+        }
+        // Deep clone to avoid modifying original
+        const sanitized = JSON.parse(JSON.stringify(data));
+        // Recursively sanitize strings
+        this.sanitizeObject(sanitized);
+        return sanitized;
+    }
+    /**
+     * Recursively sanitize object properties
+     */
+    sanitizeObject(obj) {
+        if (typeof obj !== 'object' || obj === null) {
+            return;
+        }
+        for (const key in obj) {
+            if (typeof obj[key] === 'string') {
+                obj[key] = this.sanitizeString(obj[key]);
+            }
+            else if (typeof obj[key] === 'object') {
+                this.sanitizeObject(obj[key]);
+            }
+        }
+    }
+    /**
+     * Sanitize string to prevent XSS
+     */
+    sanitizeString(str) {
+        const div = document.createElement('div');
+        div.textContent = str;
+        return div.innerHTML
+            .replace(/javascript:/gi, '')
+            .replace(/on\w+\s*=/gi, '');
+    }
+    /**
+     * Generate secure random ID
+     */
+    generateSecureId() {
+        const array = new Uint8Array(16);
+        crypto.getRandomValues(array);
+        return Array.from(array, (byte) => byte.toString(16).padStart(2, '0')).join('');
+    }
+    /**
+     * Validate iframe source
+     */
+    isValidIframeSource(src) {
+        try {
+            const url = new URL(src, window.location.origin);
+            // Check if URL is from allowed origin
+            if (!this.isOriginAllowed(url.origin)) {
+                this.logger.warn('Invalid iframe source origin', { src });
+                return false;
+            }
+            // Prevent javascript: protocol
+            if (url.protocol === 'javascript:') {
+                this.logger.warn('Javascript protocol not allowed in iframe source');
+                return false;
+            }
+            return true;
+        }
+        catch (error) {
+            this.logger.warn('Invalid iframe source URL', { src, error });
+            return false;
+        }
+    }
+    /**
+     * Create Content Security Policy
+     */
+    createCSP() {
+        const origins = Array.from(this.allowedOrigins).join(' ');
+        return [
+            `default-src 'self' ${origins}`,
+            `script-src 'self' 'unsafe-inline' ${origins}`,
+            `style-src 'self' 'unsafe-inline' ${origins}`,
+            `img-src 'self' data: https: ${origins}`,
+            `font-src 'self' data: ${origins}`,
+            `connect-src 'self' ${origins}`,
+            `frame-src 'self' ${origins}`,
+            `media-src 'self' ${origins}`,
+        ].join('; ');
+    }
+    /**
+     * Add allowed origin
+     */
+    addAllowedOrigin(origin) {
+        this.allowedOrigins.add(origin);
+        this.logger.debug('Added allowed origin', { origin });
+    }
+    /**
+     * Remove allowed origin
+     */
+    removeAllowedOrigin(origin) {
+        this.allowedOrigins.delete(origin);
+        this.logger.debug('Removed allowed origin', { origin });
+    }
+    /**
+     * Get all allowed origins
+     */
+    getAllowedOrigins() {
+        return Array.from(this.allowedOrigins);
+    }
+}
+/**
+ * Rate limiting utility
+ */
+class RateLimiter {
+    constructor(maxRequests = 100, windowMs = 60000) {
+        this.requests = new Map();
+        this.maxRequests = maxRequests;
+        this.windowMs = windowMs;
+    }
+    /**
+     * Check if request is allowed
+     */
+    isAllowed(key) {
+        const now = Date.now();
+        const requests = this.requests.get(key) || [];
+        // Remove old requests outside window
+        const validRequests = requests.filter((time) => now - time < this.windowMs);
+        // Check if limit exceeded
+        if (validRequests.length >= this.maxRequests) {
+            return false;
+        }
+        // Add current request
+        validRequests.push(now);
+        this.requests.set(key, validRequests);
+        return true;
+    }
+    /**
+     * Reset rate limit for key
+     */
+    reset(key) {
+        this.requests.delete(key);
+    }
+    /**
+     * Clear all rate limits
+     */
+    clearAll() {
+        this.requests.clear();
+    }
+}
+
+/**
+ * Weld SDK - Message Broker
+ * Handles secure postMessage communication between parent and iframes
+ */
+/**
+ * MessageBroker class
+ * Central hub for all postMessage communication
+ */
+class MessageBroker {
+    constructor(config, iframeManager, logger) {
+        this.subscriptions = new Map();
+        this.messageQueue = [];
+        this.isReady = false;
+        this.responseHandlers = new Map();
+        this.config = config;
+        this.logger = logger.child('[MessageBroker]');
+        this.iframeManager = iframeManager;
+        this.security = new SecurityManager(config.security, this.logger);
+        this.rateLimiter = new RateLimiter(100, 60000); // 100 messages per minute
+        this.setupMessageListener();
+        this.logger.debug('MessageBroker initialized');
+    }
+    /**
+     * Setup global message listener
+     */
+    setupMessageListener() {
+        window.addEventListener('message', this.handleMessage.bind(this));
+        this.logger.debug('Message listener setup');
+    }
+    /**
+     * Handle incoming postMessage
+     */
+    handleMessage(event) {
+        // Validate message event
+        if (!this.security.validateMessageEvent(event)) {
+            return;
+        }
+        // Validate message structure
+        if (!isBaseMessage(event.data)) {
+            this.logger.warn('Invalid message structure', event.data);
+            return;
+        }
+        const message = event.data;
+        // Rate limiting
+        if (!this.rateLimiter.isAllowed(message.origin)) {
+            this.logger.warn('Rate limit exceeded', { origin: message.origin });
+            return;
+        }
+        // Sanitize message if enabled
+        const sanitized = this.config.security.sanitizeInput
+            ? this.security.sanitizeMessageData(message)
+            : message;
+        this.logger.debug('Message received', {
+            type: sanitized.type,
+            origin: sanitized.origin,
+            id: sanitized.id,
+        });
+        // Check for response handlers
+        if (this.responseHandlers.has(sanitized.id)) {
+            const handler = this.responseHandlers.get(sanitized.id);
+            handler?.(sanitized);
+            this.responseHandlers.delete(sanitized.id);
+            return;
+        }
+        // Dispatch to subscribers
+        this.dispatchMessage(sanitized);
+    }
+    /**
+     * Dispatch message to subscribers
+     */
+    dispatchMessage(message) {
+        const subscriptions = Array.from(this.subscriptions.values());
+        for (const subscription of subscriptions) {
+            // Check if type matches
+            const typeMatches = subscription.type === '*' || subscription.type === message.type;
+            // Check if origin matches (if specified)
+            const originMatches = !subscription.origin || subscription.origin === message.origin;
+            if (typeMatches && originMatches) {
+                try {
+                    if (isPayloadMessage(message)) {
+                        subscription.handler(message.payload, message);
+                    }
+                    else {
+                        subscription.handler(undefined, message);
+                    }
+                }
+                catch (error) {
+                    this.logger.error('Error in message handler', error);
+                }
+            }
+        }
+    }
+    /**
+     * Subscribe to messages
+     */
+    subscribe(type, handler, origin) {
+        const id = this.security.generateSecureId();
+        this.subscriptions.set(id, {
+            id,
+            type,
+            origin,
+            handler,
+        });
+        this.logger.debug('Subscribed to messages', { type, origin, id });
+        return id;
+    }
+    /**
+     * Unsubscribe from messages
+     */
+    unsubscribe(subscriptionId) {
+        if (this.subscriptions.delete(subscriptionId)) {
+            this.logger.debug('Unsubscribed from messages', { id: subscriptionId });
+        }
+    }
+    /**
+     * Send message to iframe
+     */
+    sendToIframe(iframeType, type, payload) {
+        const iframe = this.iframeManager.getIframe(iframeType);
+        if (!iframe) {
+            this.logger.warn('Iframe not found', { iframeType });
+            return;
+        }
+        if (!iframe.ready && type !== 'weld:init') {
+            // Queue message if iframe not ready
+            const message = createMessage(type, MessageOrigin.PARENT, payload);
+            this.messageQueue.push(message);
+            this.logger.debug('Message queued (iframe not ready)', {
+                iframeType,
+                type,
+            });
+            return;
+        }
+        const message = createMessage(type, MessageOrigin.PARENT, payload);
+        this.postMessage(iframe.element, message);
+    }
+    /**
+     * Send message to all iframes
+     */
+    broadcast(type, payload) {
+        const message = createMessage(type, MessageOrigin.PARENT, payload);
+        const launcherIframe = this.iframeManager.getIframe(IframeType.LAUNCHER);
+        const widgetIframe = this.iframeManager.getIframe(IframeType.WIDGET);
+        if (launcherIframe && launcherIframe.ready) {
+            this.postMessage(launcherIframe.element, message);
+        }
+        if (widgetIframe && widgetIframe.ready) {
+            this.postMessage(widgetIframe.element, message);
+        }
+        this.logger.debug('Message broadcast', { type });
+    }
+    /**
+     * Send message and wait for response
+     */
+    async sendAndWaitForResponse(iframeType, type, payload, timeout = 5000) {
+        return new Promise((resolve, reject) => {
+            const message = createMessage(type, MessageOrigin.PARENT, payload);
+            // Setup response handler
+            const timeoutId = setTimeout(() => {
+                this.responseHandlers.delete(message.id);
+                reject(new Error('Message response timeout'));
+            }, timeout);
+            this.responseHandlers.set(message.id, (response) => {
+                clearTimeout(timeoutId);
+                if (isPayloadMessage(response)) {
+                    resolve(response.payload);
+                }
+                else {
+                    resolve(undefined);
+                }
+            });
+            // Send message
+            const iframe = this.iframeManager.getIframe(iframeType);
+            if (!iframe) {
+                reject(new Error('Iframe not found'));
+                return;
+            }
+            this.postMessage(iframe.element, message);
+        });
+    }
+    /**
+     * Post message to iframe
+     */
+    postMessage(iframe, message) {
+        if (!iframe.contentWindow) {
+            this.logger.warn('Iframe contentWindow not available');
+            return;
+        }
+        try {
+            iframe.contentWindow.postMessage(message, '*');
+            this.logger.debug('Message sent', {
+                type: message.type,
+                id: message.id,
+            });
+        }
+        catch (error) {
+            this.logger.error('Failed to post message', error);
+        }
+    }
+    /**
+     * Mark iframe as ready and flush queued messages
+     */
+    setIframeReady(iframeType) {
+        this.iframeManager.setIframeReady(iframeType);
+        // Flush queued messages for this iframe
+        this.flushMessageQueue(iframeType);
+        // Check if all iframes ready
+        if (this.iframeManager.areAllIframesReady()) {
+            this.isReady = true;
+            this.logger.info('All iframes ready');
+        }
+    }
+    /**
+     * Flush queued messages to iframe
+     */
+    flushMessageQueue(iframeType) {
+        const iframe = this.iframeManager.getIframe(iframeType);
+        if (!iframe)
+            return;
+        const queuedMessages = this.messageQueue.splice(0);
+        for (const message of queuedMessages) {
+            this.postMessage(iframe.element, message);
+        }
+        if (queuedMessages.length > 0) {
+            this.logger.debug('Flushed queued messages', {
+                count: queuedMessages.length,
+                iframeType,
+            });
+        }
+    }
+    /**
+     * Check if broker is ready
+     */
+    isMessageBrokerReady() {
+        return this.isReady;
+    }
+    /**
+     * Get queued message count
+     */
+    getQueuedMessageCount() {
+        return this.messageQueue.length;
+    }
+    /**
+     * Clear message queue
+     */
+    clearMessageQueue() {
+        this.messageQueue = [];
+        this.logger.debug('Message queue cleared');
+    }
+    /**
+     * Get active subscription count
+     */
+    getSubscriptionCount() {
+        return this.subscriptions.size;
+    }
+    /**
+     * Destroy broker and cleanup
+     */
+    destroy() {
+        this.logger.debug('Destroying message broker');
+        // Remove event listener
+        window.removeEventListener('message', this.handleMessage.bind(this));
+        // Clear subscriptions
+        this.subscriptions.clear();
+        // Clear message queue
+        this.messageQueue = [];
+        // Clear response handlers
+        this.responseHandlers.clear();
+        // Reset rate limiter
+        this.rateLimiter.clearAll();
+        this.isReady = false;
+        this.logger.info('MessageBroker destroyed');
+    }
+}
+
+/**
+ * Weld SDK - State Types
+ * Type definitions for state management across iframes
+ */
+/**
+ * Widget visibility state
+ */
+var WidgetVisibility;
+(function (WidgetVisibility) {
+    WidgetVisibility["HIDDEN"] = "hidden";
+    WidgetVisibility["VISIBLE"] = "visible";
+    WidgetVisibility["MINIMIZED"] = "minimized";
+})(WidgetVisibility || (WidgetVisibility = {}));
+/**
+ * Widget view types
+ */
+var WidgetView;
+(function (WidgetView) {
+    WidgetView["HOME"] = "home";
+    WidgetView["CONVERSATION"] = "conversation";
+    WidgetView["CONVERSATIONS"] = "conversations";
+    WidgetView["HELP"] = "help";
+    WidgetView["SETTINGS"] = "settings";
+    WidgetView["SEARCH"] = "search";
+})(WidgetView || (WidgetView = {}));
+/**
+ * Connection status
+ */
+var ConnectionStatus;
+(function (ConnectionStatus) {
+    ConnectionStatus["DISCONNECTED"] = "disconnected";
+    ConnectionStatus["CONNECTING"] = "connecting";
+    ConnectionStatus["CONNECTED"] = "connected";
+    ConnectionStatus["RECONNECTING"] = "reconnecting";
+    ConnectionStatus["ERROR"] = "error";
+})(ConnectionStatus || (ConnectionStatus = {}));
+/**
+ * Message status
+ */
+var MessageStatus;
+(function (MessageStatus) {
+    MessageStatus["SENDING"] = "sending";
+    MessageStatus["SENT"] = "sent";
+    MessageStatus["DELIVERED"] = "delivered";
+    MessageStatus["READ"] = "read";
+    MessageStatus["FAILED"] = "failed";
+})(MessageStatus || (MessageStatus = {}));
+/**
+ * Initial state factory
+ */
+function createInitialState() {
+    return {
+        user: {
+            isAuthenticated: false,
+            isAnonymous: true,
+        },
+        conversation: {
+            messages: [],
+            participants: [],
+            unreadCount: 0,
+            isTyping: false,
+            typingUsers: [],
+        },
+        widget: {
+            visibility: WidgetVisibility.HIDDEN,
+            view: WidgetView.HOME,
+            isOpen: false,
+            isMinimized: false,
+            dimensions: {
+                width: '400px',
+                height: 'min(680px, 88vh)',
+            },
+            position: {
+                bottom: '24px',
+                right: '24px',
+            },
+        },
+        launcher: {
+            isVisible: true,
+            badge: {
+                count: 0,
+                show: false,
+            },
+        },
+        backdrop: {
+            isVisible: false,
+            closeOnClick: true,
+            opacity: 0,
+        },
+        mobile: {
+            isFullScreen: false,
+            isScrollLocked: false,
+            keyboardHeight: 0,
+            orientation: 'portrait',
+            safeAreaInsets: {
+                top: 0,
+                right: 0,
+                bottom: 0,
+                left: 0,
+            },
+        },
+        network: {
+            status: ConnectionStatus.DISCONNECTED,
+            retryCount: 0,
+        },
+        ui: {
+            theme: 'auto',
+            locale: 'en',
+            isLoading: false,
+        },
+        initialized: false,
+        lastUpdated: Date.now(),
+    };
+}
+/**
+ * State path utility
+ */
+function getStateValue(state, path) {
+    const keys = path.split('.');
+    let value = state;
+    for (const key of keys) {
+        if (value && typeof value === 'object' && key in value) {
+            value = value[key];
+        }
+        else {
+            return undefined;
+        }
+    }
+    return value;
+}
+/**
+ * State update utility
+ */
+function setStateValue(state, path, value, merge = false) {
+    const keys = path.split('.');
+    const newState = JSON.parse(JSON.stringify(state));
+    let current = newState;
+    for (let i = 0; i < keys.length - 1; i++) {
+        const key = keys[i];
+        if (!(key in current)) {
+            current[key] = {};
+        }
+        current = current[key];
+    }
+    const lastKey = keys[keys.length - 1];
+    if (merge && typeof current[lastKey] === 'object' && typeof value === 'object') {
+        current[lastKey] = { ...current[lastKey], ...value };
+    }
+    else {
+        current[lastKey] = value;
+    }
+    newState.lastUpdated = Date.now();
+    return newState;
+}
+
+/**
+ * Weld SDK - Validation Utilities
+ * Input validation and sanitization functions
+ */
+/**
+ * Validate email format
+ */
+/**
+ * Deep clone object (safe for JSON-serializable objects)
+ */
+function deepClone(obj) {
+    if (obj === null || typeof obj !== 'object') {
+        return obj;
+    }
+    if (obj instanceof Date) {
+        return new Date(obj.getTime());
+    }
+    if (obj instanceof Array) {
+        return obj.map((item) => deepClone(item));
+    }
+    if (obj instanceof Object) {
+        const cloned = {};
+        for (const key in obj) {
+            if (obj.hasOwnProperty(key)) {
+                cloned[key] = deepClone(obj[key]);
+            }
+        }
+        return cloned;
+    }
+    return obj;
+}
+
+/**
+ * Weld SDK - State Coordinator
+ * Manages and synchronizes state across iframes
+ */
+/**
+ * StateCoordinator class
+ * Central state management for multi-iframe architecture
+ */
+class StateCoordinator {
+    constructor(messageBroker, logger) {
+        this.subscriptions = new Map();
+        this.stateHistory = [];
+        this.maxHistorySize = 50;
+        this.messageBroker = messageBroker;
+        this.logger = logger.child('[StateCoordinator]');
+        this.state = createInitialState();
+        this.setupMessageHandlers();
+        this.logger.debug('StateCoordinator initialized');
+    }
+    /**
+     * Setup message handlers for state updates
+     */
+    setupMessageHandlers() {
+        // Listen for state update requests from iframes
+        this.messageBroker.subscribe('weld:state:update', this.handleStateUpdate.bind(this));
+        // Listen for state request messages
+        this.messageBroker.subscribe('weld:state:request', this.handleStateRequest.bind(this));
+        this.logger.debug('Message handlers setup');
+    }
+    /**
+     * Handle state update from iframe
+     */
+    handleStateUpdate(payload) {
+        const { path, value, merge } = payload;
+        if (!path) {
+            this.logger.warn('State update missing path', payload);
+            return;
+        }
+        this.updateState(path, value, merge);
+    }
+    /**
+     * Handle state request from iframe
+     */
+    handleStateRequest(payload) {
+        const { path } = payload;
+        if (path) {
+            const value = getStateValue(this.state, path);
+            this.messageBroker.broadcast('weld:state:response', {
+                path,
+                value,
+            });
+        }
+        else {
+            // Send entire state
+            this.messageBroker.broadcast('weld:state:response', {
+                state: this.state,
+            });
+        }
+    }
+    /**
+     * Get current state
+     */
+    getState() {
+        return deepClone(this.state);
+    }
+    /**
+     * Get state value by path
+     */
+    getValue(path) {
+        return getStateValue(this.state, path);
+    }
+    /**
+     * Update state
+     */
+    updateState(path, value, merge = false) {
+        const oldState = deepClone(this.state);
+        this.state = setStateValue(this.state, path, value, merge);
+        // Create state action
+        const action = {
+            type: 'UPDATE',
+            path,
+            payload: value,
+            merge,
+            timestamp: Date.now(),
+        };
+        // Add to history
+        this.addToHistory(action);
+        // Notify subscribers
+        this.notifySubscribers(path, value, getStateValue(oldState, path));
+        // Broadcast to iframes
+        this.messageBroker.broadcast('weld:state:update', {
+            path,
+            value,
+            merge,
+        });
+        this.logger.debug('State updated', { path, merge });
+    }
+    /**
+     * Batch update multiple state paths
+     */
+    batchUpdate(updates) {
+        const oldState = deepClone(this.state);
+        for (const update of updates) {
+            this.state = setStateValue(this.state, update.path, update.value, update.merge);
+        }
+        // Notify subscribers for each update
+        for (const update of updates) {
+            this.notifySubscribers(update.path, getStateValue(this.state, update.path), getStateValue(oldState, update.path));
+        }
+        // Broadcast all updates
+        this.messageBroker.broadcast('weld:state:update', {
+            batch: updates,
+        });
+        this.logger.debug('Batch state update', { count: updates.length });
+    }
+    /**
+     * Reset state to initial
+     */
+    resetState() {
+        const oldState = this.state;
+        this.state = createInitialState();
+        // Notify all subscribers
+        for (const [_id, subscription] of this.subscriptions) {
+            const oldValue = getStateValue(oldState, subscription.path);
+            const newValue = getStateValue(this.state, subscription.path);
+            subscription.listener(newValue, oldValue);
+        }
+        // Broadcast reset
+        this.messageBroker.broadcast('weld:state:update', {
+            reset: true,
+            state: this.state,
+        });
+        this.logger.debug('State reset');
+    }
+    /**
+     * Subscribe to state changes
+     */
+    subscribe(path, listener, immediate = false) {
+        const id = `sub_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`;
+        this.subscriptions.set(id, {
+            id,
+            path,
+            listener,
+            immediate,
+        });
+        // Call listener immediately if requested
+        if (immediate) {
+            const value = getStateValue(this.state, path);
+            listener(value, value);
+        }
+        this.logger.debug('State subscription added', { id, path });
+        return id;
+    }
+    /**
+     * Unsubscribe from state changes
+     */
+    unsubscribe(subscriptionId) {
+        if (this.subscriptions.delete(subscriptionId)) {
+            this.logger.debug('State subscription removed', { id: subscriptionId });
+        }
+    }
+    /**
+     * Notify subscribers of state change
+     */
+    notifySubscribers(path, newValue, oldValue) {
+        const subscriptions = Array.from(this.subscriptions.values());
+        for (const subscription of subscriptions) {
+            // Exact path match
+            if (subscription.path === path) {
+                try {
+                    subscription.listener(newValue, oldValue);
+                }
+                catch (error) {
+                    this.logger.error('Error in state listener', error);
+                }
+                continue;
+            }
+            // Parent path match (e.g., subscriber to "user" gets notified for "user.name")
+            if (path.startsWith(subscription.path + '.')) {
+                const subValue = getStateValue(this.state, subscription.path);
+                try {
+                    subscription.listener(subValue, oldValue);
+                }
+                catch (error) {
+                    this.logger.error('Error in state listener', error);
+                }
+                continue;
+            }
+            // Child path match (e.g., subscriber to "user.name" gets notified for "user")
+            if (subscription.path.startsWith(path + '.')) {
+                const subValue = getStateValue(this.state, subscription.path);
+                try {
+                    subscription.listener(subValue, undefined);
+                }
+                catch (error) {
+                    this.logger.error('Error in state listener', error);
+                }
+            }
+        }
+    }
+    /**
+     * Add action to history
+     */
+    addToHistory(action) {
+        this.stateHistory.push(action);
+        // Trim history if too large
+        if (this.stateHistory.length > this.maxHistorySize) {
+            this.stateHistory.shift();
+        }
+    }
+    /**
+     * Get state history
+     */
+    getHistory() {
+        return [...this.stateHistory];
+    }
+    /**
+     * Clear state history
+     */
+    clearHistory() {
+        this.stateHistory = [];
+        this.logger.debug('State history cleared');
+    }
+    /**
+     * Get snapshot of state at specific time
+     */
+    getSnapshot(timestamp) {
+        // Find all actions before timestamp
+        const actions = this.stateHistory.filter((a) => a.timestamp <= timestamp);
+        if (actions.length === 0) {
+            return null;
+        }
+        // Replay actions to reconstruct state
+        let state = createInitialState();
+        for (const action of actions) {
+            state = setStateValue(state, action.path, action.payload, action.merge);
+        }
+        return state;
+    }
+    /**
+     * Widget-specific state helpers
+     */
+    openWidget() {
+        this.batchUpdate([
+            { path: 'widget.isOpen', value: true },
+            { path: 'widget.visibility', value: 'visible' },
+            { path: 'launcher.isVisible', value: false },
+            { path: 'backdrop.isVisible', value: true },
+        ]);
+    }
+    closeWidget() {
+        this.batchUpdate([
+            { path: 'widget.isOpen', value: false },
+            { path: 'widget.visibility', value: 'hidden' },
+            { path: 'launcher.isVisible', value: true },
+            { path: 'backdrop.isVisible', value: false },
+        ]);
+    }
+    minimizeWidget() {
+        this.batchUpdate([
+            { path: 'widget.isMinimized', value: true },
+            { path: 'widget.visibility', value: 'minimized' },
+        ]);
+    }
+    maximizeWidget() {
+        this.batchUpdate([
+            { path: 'widget.isMinimized', value: false },
+            { path: 'widget.visibility', value: 'visible' },
+        ]);
+    }
+    setBadgeCount(count) {
+        this.batchUpdate([
+            { path: 'launcher.badge.count', value: count },
+            { path: 'launcher.badge.show', value: count > 0 },
+        ]);
+    }
+    setUserAuth(userId, email, name) {
+        this.batchUpdate([
+            { path: 'user.isAuthenticated', value: true },
+            { path: 'user.isAnonymous', value: false },
+            { path: 'user.id', value: userId },
+            { path: 'user.email', value: email },
+            { path: 'user.name', value: name },
+        ]);
+    }
+    setConnectionStatus(status) {
+        this.updateState('network.status', status);
+    }
+    setLoading(isLoading) {
+        this.updateState('ui.isLoading', isLoading);
+    }
+    setError(code, message, recoverable = true) {
+        this.updateState('ui.error', { code, message, recoverable });
+    }
+    clearError() {
+        this.updateState('ui.error', undefined);
+    }
+    /**
+     * Get active subscription count
+     */
+    getSubscriptionCount() {
+        return this.subscriptions.size;
+    }
+    /**
+     * Validate state integrity
+     */
+    validateState() {
+        try {
+            // Check required properties exist
+            const requiredPaths = [
+                'user',
+                'conversation',
+                'widget',
+                'launcher',
+                'backdrop',
+                'mobile',
+                'network',
+                'ui',
+            ];
+            for (const path of requiredPaths) {
+                if (getStateValue(this.state, path) === undefined) {
+                    this.logger.error('Missing required state path', { path });
+                    return false;
+                }
+            }
+            return true;
+        }
+        catch (error) {
+            this.logger.error('State validation failed', error);
+            return false;
+        }
+    }
+    /**
+     * Export state as JSON
+     */
+    exportState() {
+        return JSON.stringify(this.state, null, 2);
+    }
+    /**
+     * Import state from JSON
+     */
+    importState(json) {
+        try {
+            const imported = JSON.parse(json);
+            this.state = { ...createInitialState(), ...imported };
+            this.messageBroker.broadcast('weld:state:update', {
+                reset: true,
+                state: this.state,
+            });
+            this.logger.info('State imported');
+            return true;
+        }
+        catch (error) {
+            this.logger.error('Failed to import state', error);
+            return false;
+        }
+    }
+    /**
+     * Destroy coordinator and cleanup
+     */
+    destroy() {
+        this.logger.debug('Destroying state coordinator');
+        // Clear subscriptions
+        this.subscriptions.clear();
+        // Clear history
+        this.stateHistory = [];
+        // Reset state
+        this.state = createInitialState();
+        this.logger.info('StateCoordinator destroyed');
+    }
+}
+
+var version = "1.0.2";
+var packageJson = {
+	version: version};
+
+/**
+ * Weld SDK - Main Entry Point
+ * Public API for the Weld helpdesk widget
+ */
+/**
+ * SDK initialization status
+ */
+var SDKStatus;
+(function (SDKStatus) {
+    SDKStatus["UNINITIALIZED"] = "uninitialized";
+    SDKStatus["INITIALIZING"] = "initializing";
+    SDKStatus["READY"] = "ready";
+    SDKStatus["ERROR"] = "error";
+    SDKStatus["DESTROYED"] = "destroyed";
+})(SDKStatus || (SDKStatus = {}));
+/**
+ * WeldSDK class
+ * Main SDK interface for embedding the widget
+ */
+class WeldSDK {
+    constructor(config) {
+        this.status = SDKStatus.UNINITIALIZED;
+        this.readyPromise = null;
+        this.readyResolve = null;
+        // Resolve configuration
+        this.config = resolveConfig(config);
+        // Initialize logger
+        this.logger = new Logger(this.config.logging);
+        this.logger.info('WeldSDK created', {
+            widgetId: this.config.widgetId,
+        });
+        // Create ready promise
+        this.readyPromise = new Promise((resolve) => {
+            this.readyResolve = resolve;
+        });
+        // Initialize managers
+        this.iframeManager = new IframeManager(this.config);
+        this.messageBroker = new MessageBroker(this.config, this.iframeManager, this.logger);
+        this.stateCoordinator = new StateCoordinator(this.messageBroker, this.logger);
+    }
+    /**
+     * Initialize the SDK and render widget
+     */
+    async init() {
+        if (this.status !== SDKStatus.UNINITIALIZED) {
+            this.logger.warn('SDK already initialized');
+            return this.readyPromise;
+        }
+        this.status = SDKStatus.INITIALIZING;
+        this.logger.info('Initializing WeldSDK');
+        try {
+            // Initialize iframe manager
+            await this.iframeManager.init();
+            // Setup ready handlers
+            this.setupReadyHandlers();
+            // Wait for all iframes to be ready
+            await this.waitForIframesReady();
+            // Mark as ready
+            this.status = SDKStatus.READY;
+            this.readyResolve?.();
+            this.logger.info('WeldSDK ready');
+            // Call onReady callback
+            this.config.onReady?.();
+        }
+        catch (error) {
+            this.status = SDKStatus.ERROR;
+            this.logger.error('Failed to initialize WeldSDK', error);
+            this.config.onError?.(error);
+            throw error;
+        }
+        return this.readyPromise;
+    }
+    /**
+     * Setup ready message handlers
+     */
+    setupReadyHandlers() {
+        this.messageBroker.subscribe('weld:ready', (payload) => {
+            const { iframe } = payload;
+            this.logger.debug('Iframe ready', { iframe });
+            // Map iframe name to type
+            const iframeType = this.mapIframeNameToType(iframe);
+            if (iframeType) {
+                this.messageBroker.setIframeReady(iframeType);
+            }
+        });
+        // Listen for launcher click events from the iframe
+        window.addEventListener('message', (event) => {
+            // Log all messages from iframes for debugging
+            if (event.data?.type) {
+                console.log('[Weld SDK] Received message:', event.data.type);
+            }
+            if (event.data?.type === 'launcher:clicked') {
+                // Toggle behavior - if widget is open, close it; if closed, open it
+                const state = this.stateCoordinator.getState();
+                if (state.widget.isOpen) {
+                    console.log('[Weld SDK] Launcher clicked - closing widget (toggle)');
+                    this.close();
+                }
+                else {
+                    console.log('[Weld SDK] Launcher clicked - opening widget');
+                    this.open();
+                }
+            }
+            if (event.data?.type === 'weld:close') {
+                console.log('[Weld SDK] Widget close requested');
+                this.close();
+            }
+        });
+    }
+    /**
+     * Map iframe name to type
+     */
+    mapIframeNameToType(name) {
+        if (name.includes('launcher'))
+            return IframeType.LAUNCHER;
+        if (name.includes('widget'))
+            return IframeType.WIDGET;
+        return null;
+    }
+    /**
+     * Wait for all iframes to be ready
+     */
+    async waitForIframesReady(timeout = 10000) {
+        const startTime = Date.now();
+        return new Promise((resolve, reject) => {
+            const checkReady = () => {
+                if (this.iframeManager.areAllIframesReady()) {
+                    resolve();
+                    return;
+                }
+                if (Date.now() - startTime > timeout) {
+                    reject(new Error('Timeout waiting for iframes to be ready'));
+                    return;
+                }
+                setTimeout(checkReady, 100);
+            };
+            checkReady();
+        });
+    }
+    /**
+     * Wait for SDK to be ready
+     */
+    async ready() {
+        return this.readyPromise;
+    }
+    /**
+     * Check if SDK is ready
+     */
+    isReady() {
+        return this.status === SDKStatus.READY;
+    }
+    /**
+     * Open the widget
+     */
+    open() {
+        this.ensureReady();
+        console.log('[Weld SDK] Opening widget...');
+        this.stateCoordinator.openWidget();
+        this.iframeManager.showIframe(IframeType.WIDGET);
+        this.iframeManager.showIframe(IframeType.BACKDROP);
+        // Keep launcher visible so user can click it to close the widget
+        // Send open message to the widget iframe
+        const widgetIframe = this.iframeManager.getIframe(IframeType.WIDGET);
+        if (widgetIframe?.element?.contentWindow) {
+            widgetIframe.element.contentWindow.postMessage({ type: 'weld:open' }, '*');
+        }
+        // Notify launcher that widget is now open (so it can show X icon)
+        const launcherIframe = this.iframeManager.getIframe(IframeType.LAUNCHER);
+        if (launcherIframe?.element?.contentWindow) {
+            launcherIframe.element.contentWindow.postMessage({ type: 'weld:widget-opened' }, '*');
+        }
+        this.config.onOpen?.();
+    }
+    /**
+     * Close the widget
+     */
+    close() {
+        this.ensureReady();
+        console.log('[Weld SDK] Closing widget...');
+        this.stateCoordinator.closeWidget();
+        this.iframeManager.hideIframe(IframeType.WIDGET);
+        this.iframeManager.hideIframe(IframeType.BACKDROP);
+        // Launcher stays visible
+        // Send close message to the widget iframe
+        const widgetIframe = this.iframeManager.getIframe(IframeType.WIDGET);
+        if (widgetIframe?.element?.contentWindow) {
+            widgetIframe.element.contentWindow.postMessage({ type: 'weld:close' }, '*');
+        }
+        // Notify launcher that widget is now closed (so it can show chat icon)
+        const launcherIframe = this.iframeManager.getIframe(IframeType.LAUNCHER);
+        if (launcherIframe?.element?.contentWindow) {
+            launcherIframe.element.contentWindow.postMessage({ type: 'weld:widget-closed' }, '*');
+        }
+        this.config.onClose?.();
+    }
+    /**
+     * Toggle widget open/close
+     */
+    toggle() {
+        const state = this.stateCoordinator.getState();
+        if (state.widget.isOpen) {
+            this.close();
+        }
+        else {
+            this.open();
+        }
+    }
+    /**
+     * Minimize the widget
+     */
+    minimize() {
+        this.ensureReady();
+        this.logger.debug('Minimizing widget');
+        this.stateCoordinator.minimizeWidget();
+        this.config.onMinimize?.();
+    }
+    /**
+     * Maximize the widget
+     */
+    maximize() {
+        this.ensureReady();
+        this.logger.debug('Maximizing widget');
+        this.stateCoordinator.maximizeWidget();
+        this.config.onMaximize?.();
+    }
+    /**
+     * Show the launcher
+     */
+    showLauncher() {
+        this.ensureReady();
+        this.logger.debug('Showing launcher');
+        this.iframeManager.showIframe(IframeType.LAUNCHER);
+        this.stateCoordinator.updateState('launcher.isVisible', true);
+    }
+    /**
+     * Hide the launcher
+     */
+    hideLauncher() {
+        this.ensureReady();
+        this.logger.debug('Hiding launcher');
+        this.iframeManager.hideIframe(IframeType.LAUNCHER);
+        this.stateCoordinator.updateState('launcher.isVisible', false);
+    }
+    /**
+     * Set badge count
+     */
+    setBadgeCount(count) {
+        this.ensureReady();
+        this.logger.debug('Setting badge count', { count });
+        this.stateCoordinator.setBadgeCount(count);
+    }
+    /**
+     * Clear badge
+     */
+    clearBadge() {
+        this.setBadgeCount(0);
+    }
+    /**
+     * Send a message
+     */
+    sendMessage(text, metadata) {
+        this.ensureReady();
+        this.logger.debug('Sending message', { text });
+        this.messageBroker.sendToIframe(IframeType.WIDGET, 'weld:message:send', {
+            text,
+            metadata,
+            timestamp: Date.now(),
+        });
+    }
+    /**
+     * Identify user
+     */
+    identify(identity) {
+        this.ensureReady();
+        this.logger.debug('Identifying user', { userId: identity.userId });
+        this.stateCoordinator.setUserAuth(identity.userId, identity.email, identity.name);
+        this.messageBroker.broadcast('weld:auth:login', identity);
+    }
+    /**
+     * Logout user
+     */
+    logout() {
+        this.ensureReady();
+        this.logger.debug('Logging out user');
+        this.stateCoordinator.updateState('user', {
+            isAuthenticated: false,
+            isAnonymous: true,
+        });
+        this.messageBroker.broadcast('weld:auth:logout', {});
+    }
+    /**
+     * Update configuration
+     */
+    updateConfig(updates) {
+        this.ensureReady();
+        this.logger.debug('Updating configuration');
+        // Merge config
+        this.config = resolveConfig({ ...this.config, ...updates });
+        // Broadcast config update
+        this.messageBroker.broadcast('weld:config:update', updates);
+    }
+    /**
+     * Update theme
+     */
+    setTheme(theme) {
+        this.ensureReady();
+        this.logger.debug('Setting theme', { theme });
+        this.stateCoordinator.updateState('ui.theme', theme);
+        this.messageBroker.broadcast('weld:theme:update', { mode: theme });
+    }
+    /**
+     * Update locale
+     */
+    setLocale(locale) {
+        this.ensureReady();
+        this.logger.debug('Setting locale', { locale });
+        this.stateCoordinator.updateState('ui.locale', locale);
+        this.messageBroker.broadcast('weld:locale:update', { locale });
+    }
+    /**
+     * Track custom event
+     */
+    track(eventName, properties) {
+        this.ensureReady();
+        this.logger.debug('Tracking event', { eventName });
+        this.messageBroker.broadcast('weld:event:track', {
+            name: eventName,
+            properties,
+            timestamp: Date.now(),
+        });
+    }
+    /**
+     * Get current state
+     */
+    getState() {
+        return this.stateCoordinator.getState();
+    }
+    /**
+     * Subscribe to state changes
+     */
+    onStateChange(path, listener) {
+        this.ensureReady();
+        const subscriptionId = this.stateCoordinator.subscribe(path, listener);
+        // Return unsubscribe function
+        return () => {
+            this.stateCoordinator.unsubscribe(subscriptionId);
+        };
+    }
+    /**
+     * Get device info
+     */
+    getDeviceInfo() {
+        return this.iframeManager.getDeviceInfo();
+    }
+    /**
+     * Get SDK status
+     */
+    getStatus() {
+        return this.status;
+    }
+    /**
+     * Get SDK version
+     */
+    getVersion() {
+        return packageJson.version;
+    }
+    /**
+     * Enable debug mode
+     */
+    enableDebug() {
+        this.logger.setLevel('debug');
+        this.logger.info('Debug mode enabled');
+    }
+    /**
+     * Disable debug mode
+     */
+    disableDebug() {
+        this.logger.setLevel('warn');
+        this.logger.info('Debug mode disabled');
+    }
+    /**
+     * Ensure SDK is ready before operation
+     */
+    ensureReady() {
+        if (this.status !== SDKStatus.READY) {
+            throw new Error('SDK not ready. Call init() first.');
+        }
+    }
+    /**
+     * Destroy SDK and cleanup
+     */
+    destroy() {
+        this.logger.info('Destroying WeldSDK');
+        // Destroy modules
+        this.stateCoordinator.destroy();
+        this.messageBroker.destroy();
+        this.iframeManager.destroy();
+        // Reset status
+        this.status = SDKStatus.DESTROYED;
+        // Call onDestroy callback
+        this.config.onDestroy?.();
+        this.logger.info('WeldSDK destroyed');
+    }
+}
+
+/**
+ * React hook for the Helpdesk Widget
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const widget = useHelpdeskWidget({ widgetId: 'your-widget-id' });
+ *
+ *   return (
+ *     <button onClick={() => widget?.open()}>
+ *       Show Support
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+function useHelpdeskWidget(config) {
+    const widgetRef = useRef(null);
+    const configRef = useRef(config);
+    // Update config ref when config changes
+    useEffect(() => {
+        configRef.current = config;
+    }, [config]);
+    useEffect(() => {
+        // Initialize widget
+        try {
+            widgetRef.current = new WeldSDK(configRef.current);
+            widgetRef.current.init();
+        }
+        catch (error) {
+            console.error('Failed to initialize Helpdesk Widget:', error);
+        }
+        // Cleanup on unmount
+        return () => {
+            if (widgetRef.current) {
+                widgetRef.current.destroy();
+                widgetRef.current = null;
+            }
+        };
+    }, []);
+    return widgetRef.current;
+}
+/**
+ * Hook that provides widget control methods
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const { open, close, toggle } = useHelpdeskWidgetControls({
+ *     widgetId: 'your-widget-id'
+ *   });
+ *
+ *   return (
+ *     <button onClick={open}>Show Support</button>
+ *   );
+ * }
+ * ```
+ */
+function useHelpdeskWidgetControls(config) {
+    const widget = useHelpdeskWidget(config);
+    const open = useCallback(() => {
+        widget?.open();
+    }, [widget]);
+    const close = useCallback(() => {
+        widget?.close();
+    }, [widget]);
+    const toggle = useCallback(() => {
+        widget?.toggle();
+    }, [widget]);
+    const sendMessage = useCallback((message) => {
+        widget?.sendMessage(message);
+    }, [widget]);
+    return {
+        widget,
+        open,
+        close,
+        toggle,
+        sendMessage,
+    };
+}
+
+/**
+ * React component for the Helpdesk Widget
+ *
+ * This component provides a declarative way to add the widget to your app.
+ * The widget loads in an iframe and doesn't render any visible children.
+ *
+ * @example
+ * ```tsx
+ * import { HelpdeskWidgetReact } from '@weldsuite/helpdesk-widget-sdk/react';
+ *
+ * function App() {
+ *   return (
+ *     <div>
+ *       <h1>My App</h1>
+ *       <HelpdeskWidgetReact widgetId="your-widget-id" />
+ *     </div>
+ *   );
+ * }
+ * ```
+ *
+ * @example With event handlers
+ * ```tsx
+ * <HelpdeskWidgetReact
+ *   widgetId="your-widget-id"
+ *   onReady={() => console.log('Widget ready')}
+ *   onOpen={() => console.log('Widget opened')}
+ * />
+ * ```
+ */
+const HelpdeskWidgetReact = (config) => {
+    useHelpdeskWidget(config);
+    // Widget loads in iframe, no visible component needed
+    return null;
+};
+HelpdeskWidgetReact.displayName = 'HelpdeskWidget';
+
+export { DEFAULT_CONFIG, WeldSDK as HelpdeskWidget, HelpdeskWidgetReact, WeldSDK, HelpdeskWidgetReact as default, useHelpdeskWidget, useHelpdeskWidgetControls };
+//# sourceMappingURL=react.esm.js.map