mcp-chat-ui 1.0.0

package/dist/ChatUI.js

@@ -0,0 +1,1781 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = ChatUI;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// ChatUI.tsx — Azure Speech (STT/TTS) + document overlay + modern chat UI (HTTP chat, no WS/streaming)
+const react_1 = require("react");
+const sdkUtilities_1 = require("./sdkUtilities");
+const Composer_1 = __importDefault(require("./components/Composer"));
+const DocumentViewer_1 = __importDefault(require("./components/DocumentViewer"));
+const InitPanel_1 = __importDefault(require("./components/InitPanel"));
+const MessageList_1 = __importDefault(require("./components/MessageList"));
+const TakeActionModal_1 = __importDefault(require("./components/TakeActionModal"));
+const TaskCardsModal_1 = __importDefault(require("./components/TaskCardsModal"));
+const ToolResultOverlay_1 = __importDefault(require("./components/ToolResultOverlay"));
+const TopBar_1 = __importDefault(require("./components/TopBar"));
+const api_1 = require("./helpers/api");
+const taskAttributes_1 = require("./helpers/taskAttributes");
+const generateGuid_1 = require("./utils/generateGuid");
+const localStorage_1 = require("./utils/localStorage");
+const storageKeys_1 = require("./utils/storageKeys");
+const textDirection_1 = require("./utils/textDirection");
+const chatDefaults_1 = require("./constants/chatDefaults");
+const textButtonTheme = "bg-[#252525] text-white hover:bg-white hover:text-[#252525] hover:shadow-[0_0_0_1px_rgba(71,72,72,0.12)] disabled:pointer-events-none disabled:opacity-50";
+const normalizeAuthToken = (value) => {
+    const trimmed = (value !== null && value !== void 0 ? value : "").trim();
+    if (!trimmed)
+        return "";
+    return /^bearer\s+/i.test(trimmed) ? trimmed : `Bearer ${trimmed}`;
+};
+const formatText = (template, values) => template.replace(/\{(\w+)\}/g, (_, key) => {
+    const value = values[key];
+    return value === undefined ? "" : String(value);
+});
+function normalizeTheme(theme) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9;
+    return {
+        appBackground: (_a = theme.appBackground) !== null && _a !== void 0 ? _a : theme.background,
+        panelBackground: (_b = theme.panelBackground) !== null && _b !== void 0 ? _b : theme.surface,
+        panelBackgroundMuted: (_c = theme.panelBackgroundMuted) !== null && _c !== void 0 ? _c : theme.surfaceMuted,
+        panelBackgroundSubtle: (_d = theme.panelBackgroundSubtle) !== null && _d !== void 0 ? _d : theme.surfaceSubtle,
+        brand: (_e = theme.brand) !== null && _e !== void 0 ? _e : theme.primary,
+        brandHover: (_f = theme.brandHover) !== null && _f !== void 0 ? _f : theme.primaryHover,
+        brandAlpha30: (_g = theme.brandAlpha30) !== null && _g !== void 0 ? _g : theme.primary30,
+        brandAlpha40: (_h = theme.brandAlpha40) !== null && _h !== void 0 ? _h : theme.primary40,
+        brandAlpha50: (_j = theme.brandAlpha50) !== null && _j !== void 0 ? _j : theme.primary50,
+        textMain: (_k = theme.textMain) !== null && _k !== void 0 ? _k : theme.textPrimary,
+        textEmphasis: (_l = theme.textEmphasis) !== null && _l !== void 0 ? _l : theme.textStrong,
+        textSupporting: (_m = theme.textSupporting) !== null && _m !== void 0 ? _m : theme.textSecondary,
+        textMuted: (_o = theme.textMuted) !== null && _o !== void 0 ? _o : theme.textMuted,
+        textSubtle: (_p = theme.textSubtle) !== null && _p !== void 0 ? _p : theme.textSubtle,
+        textDisabled: (_q = theme.textDisabled) !== null && _q !== void 0 ? _q : theme.textFaint,
+        textOnBrand: (_r = theme.textOnBrand) !== null && _r !== void 0 ? _r : theme.textInverse,
+        userMessageBackground: theme.userMessageBackground,
+        userMessageText: theme.userMessageText,
+        neutralLightest: (_t = theme.neutralLightest) !== null && _t !== void 0 ? _t : theme.neutral50,
+        neutralLighter: (_u = theme.neutralLighter) !== null && _u !== void 0 ? _u : theme.neutral100,
+        neutralMedium: (_v = theme.neutralMedium) !== null && _v !== void 0 ? _v : theme.neutral400,
+        neutralDark: (_w = theme.neutralDark) !== null && _w !== void 0 ? _w : theme.neutral800,
+        neutralDarker: (_x = theme.neutralDarker) !== null && _x !== void 0 ? _x : theme.neutral900,
+        neutralDarker80: (_y = theme.neutralDarker80) !== null && _y !== void 0 ? _y : theme.neutral900_80,
+        borderDefault: (_z = theme.borderDefault) !== null && _z !== void 0 ? _z : theme.border,
+        accentBackground: (_0 = theme.accentBackground) !== null && _0 !== void 0 ? _0 : theme.accentBg,
+        accentText: (_1 = theme.accentText) !== null && _1 !== void 0 ? _1 : theme.accentText,
+        warningBackground: (_2 = theme.warningBackground) !== null && _2 !== void 0 ? _2 : theme.warningBg,
+        warningText: (_3 = theme.warningText) !== null && _3 !== void 0 ? _3 : theme.warningText,
+        errorBackground: (_4 = theme.errorBackground) !== null && _4 !== void 0 ? _4 : theme.errorBg,
+        errorText: (_5 = theme.errorText) !== null && _5 !== void 0 ? _5 : theme.errorText,
+        focusRing: (_6 = theme.focusRing) !== null && _6 !== void 0 ? _6 : theme.ring,
+        focusRingStrong: (_7 = theme.focusRingStrong) !== null && _7 !== void 0 ? _7 : theme.ringStrong,
+        outlineShadow: (_8 = theme.outlineShadow) !== null && _8 !== void 0 ? _8 : theme.shadowOutline,
+        elevatedShadow: (_9 = theme.elevatedShadow) !== null && _9 !== void 0 ? _9 : theme.shadowElevated,
+        selectOptionHover: theme.selectOptionHover,
+        cardSelectedBackground: theme.cardSelectedBackground,
+    };
+}
+function ChatUI(props) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+    const sdkConfig = (0, sdkUtilities_1.GetConfig)();
+    const theme = (0, react_1.useMemo)(() => {
+        var _a;
+        return normalizeTheme(Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_THEME), ((_a = props.theme) !== null && _a !== void 0 ? _a : {})));
+    }, [props.theme]);
+    const fonts = (0, react_1.useMemo)(() => (Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_FONTS), props.fonts)), [props.fonts]);
+    const ttsVoiceMap = (0, react_1.useMemo)(() => {
+        var _a;
+        return (Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TTS_VOICE_MAP), ((_a = props.ttsVoiceMap) !== null && _a !== void 0 ? _a : {})));
+    }, [props.ttsVoiceMap]);
+    const text = (0, react_1.useMemo)(() => {
+        var _a;
+        const propText = (_a = props.text) !== null && _a !== void 0 ? _a : {};
+        return Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT), { topBar: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.topBar), propText.topBar), emptyState: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.emptyState), propText.emptyState), composer: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.composer), propText.composer), voiceOverlay: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.voiceOverlay), propText.voiceOverlay), messageItem: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.messageItem), propText.messageItem), taskCards: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.taskCards), propText.taskCards), documentViewer: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.documentViewer), propText.documentViewer), takeAction: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.takeAction), propText.takeAction), toolResult: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.toolResult), propText.toolResult), alerts: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.alerts), propText.alerts), errors: Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TEXT.errors), propText.errors) });
+    }, [props.text]);
+    const taskCardSize = (0, react_1.useMemo)(() => {
+        var _a;
+        return (Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_TASK_CARD_SIZE), ((_a = props.taskCardSize) !== null && _a !== void 0 ? _a : {})));
+    }, [props.taskCardSize]);
+    const initPresets = (0, react_1.useMemo)(() => {
+        var _a;
+        return (Object.assign(Object.assign({}, chatDefaults_1.DEFAULT_INIT_PRESETS), ((_a = props.initPresets) !== null && _a !== void 0 ? _a : {})));
+    }, [props.initPresets]);
+    const themeVars = (0, react_1.useMemo)(() => ({
+        "--chat-background": theme.appBackground,
+        "--chat-surface": theme.panelBackground,
+        "--chat-surface-muted": theme.panelBackgroundMuted,
+        "--chat-surface-subtle": theme.panelBackgroundSubtle,
+        "--chat-primary": theme.brand,
+        "--chat-primary-hover": theme.brandHover,
+        "--chat-primary-30": theme.brandAlpha30,
+        "--chat-primary-40": theme.brandAlpha40,
+        "--chat-primary-50": theme.brandAlpha50,
+        "--chat-text-primary": theme.textMain,
+        "--chat-text-strong": theme.textEmphasis,
+        "--chat-text-secondary": theme.textSupporting,
+        "--chat-text-muted": theme.textMuted,
+        "--chat-text-subtle": theme.textSubtle,
+        "--chat-text-faint": theme.textDisabled,
+        "--chat-text-inverse": theme.textOnBrand,
+        "--chat-user-message-bg": theme.userMessageBackground,
+        "--chat-user-message-text": theme.userMessageText,
+        "--chat-neutral-50": theme.neutralLightest,
+        "--chat-neutral-100": theme.neutralLighter,
+        "--chat-neutral-400": theme.neutralMedium,
+        "--chat-neutral-800": theme.neutralDark,
+        "--chat-neutral-900": theme.neutralDarker,
+        "--chat-neutral-900-80": theme.neutralDarker80,
+        "--chat-border": theme.borderDefault,
+        "--chat-accent-bg": theme.accentBackground,
+        "--chat-accent-text": theme.accentText,
+        "--chat-warning-bg": theme.warningBackground,
+        "--chat-warning-text": theme.warningText,
+        "--chat-error-bg": theme.errorBackground,
+        "--chat-error-text": theme.errorText,
+        "--chat-ring": theme.focusRing,
+        "--chat-ring-strong": theme.focusRingStrong,
+        "--chat-shadow-outline": theme.outlineShadow,
+        "--chat-shadow-elevated": theme.elevatedShadow,
+        "--chat-select-option-hover": theme.selectOptionHover,
+        "--chat-card-selected-bg": theme.cardSelectedBackground,
+        "--chat-font-base": fonts.base || "inherit",
+        "--chat-font-heading": fonts.heading || fonts.base || "inherit",
+        "--chat-font-mono": fonts.mono || chatDefaults_1.DEFAULT_FONTS.mono,
+    }), [theme, fonts]);
+    const normalizeServiceBaseUrl = (value) => (value !== null && value !== void 0 ? value : "").trim().replace(/\/+$/, "");
+    const [isDab, setIsDab] = (0, react_1.useState)(() => { var _a; return (_a = sdkConfig.isDab) !== null && _a !== void 0 ? _a : false; });
+    const defaultDomain = isDab ? chatDefaults_1.DEFAULT_DOMAIN : "";
+    const [domain, setDomain] = (0, react_1.useState)(() => defaultDomain);
+    const [serviceBaseUrl, setServiceBaseUrl] = (0, react_1.useState)(() => {
+        var _a;
+        return normalizeServiceBaseUrl((_a = sdkConfig.baseUrl) !== null && _a !== void 0 ? _a : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.serviceBaseUrl, chatDefaults_1.DEFAULT_SERVICE_BASE_URL));
+    });
+    (0, react_1.useEffect)(() => {
+        if (serviceBaseUrl) {
+            localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.serviceBaseUrl, serviceBaseUrl);
+        }
+        else {
+            localStorage_1.ls.remove(storageKeys_1.STORAGE_KEYS.serviceBaseUrl);
+        }
+    }, [serviceBaseUrl]);
+    const [apiSubscriptionKey, setApiSubscriptionKey] = (0, react_1.useState)(() => {
+        var _a;
+        return (_a = sdkConfig.apiSubscriptionKey) !== null && _a !== void 0 ? _a : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.apiSubscriptionKey, chatDefaults_1.DEFAULT_API_SUBSCRIPTION_KEY);
+    });
+    (0, react_1.useEffect)(() => {
+        if (apiSubscriptionKey) {
+            localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.apiSubscriptionKey, apiSubscriptionKey);
+        }
+        else {
+            localStorage_1.ls.remove(storageKeys_1.STORAGE_KEYS.apiSubscriptionKey);
+        }
+    }, [apiSubscriptionKey]);
+    const [loginSubscriptionKey, setLoginSubscriptionKey] = (0, react_1.useState)(() => { var _a; return (_a = sdkConfig.loginSubscriptionKey) !== null && _a !== void 0 ? _a : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.loginSubscriptionKey, ""); });
+    (0, react_1.useEffect)(() => {
+        if (loginSubscriptionKey) {
+            localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.loginSubscriptionKey, loginSubscriptionKey);
+        }
+        else {
+            localStorage_1.ls.remove(storageKeys_1.STORAGE_KEYS.loginSubscriptionKey);
+        }
+    }, [loginSubscriptionKey]);
+    const requestStepBaseUrl = serviceBaseUrl
+        ? `${serviceBaseUrl}/RequestStep`
+        : "";
+    const transactionCatalogBaseUrl = serviceBaseUrl
+        ? `${serviceBaseUrl}/TransactionCatalog`
+        : "";
+    const storageBaseUrl = serviceBaseUrl ? `${serviceBaseUrl}/Storage` : "";
+    const signatureBaseUrl = serviceBaseUrl ? `${serviceBaseUrl}/Signature` : "";
+    const initEndpoint = serviceBaseUrl
+        ? `${serviceBaseUrl}/Transactionauthentication/api/CorrespondenceAuthentication/Login`
+        : "";
+    const initClientType = chatDefaults_1.DEFAULT_INIT_CLIENT_TYPE;
+    const speechRegion = (_a = props.speechRegion) !== null && _a !== void 0 ? _a : chatDefaults_1.DEFAULT_SPEECH_REGION;
+    const speechKey = (_b = props.speechKey) !== null && _b !== void 0 ? _b : chatDefaults_1.DEFAULT_SPEECH_KEY;
+    const initializeChatOnLoad = (_c = sdkConfig.initializeChat) !== null && _c !== void 0 ? _c : false;
+    const initPanelEnabled = (_d = sdkConfig.showInitPanel) !== null && _d !== void 0 ? _d : true;
+    // Connection / auth
+    const apiBase = chatDefaults_1.DEFAULT_API_BASE;
+    const apiKey = chatDefaults_1.DEFAULT_API_KEY;
+    const [authToken, setAuthToken] = (0, react_1.useState)(() => { var _a; return normalizeAuthToken((_a = sdkConfig.token) !== null && _a !== void 0 ? _a : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.authToken, "")); });
+    const [sessionId, setSessionId] = (0, react_1.useState)(() => localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.sessionId, (0, generateGuid_1.generateGuid)()));
+    const [initCompleted, setInitCompleted] = (0, react_1.useState)(() => localStorage_1.ls.get((0, storageKeys_1.getInitCompletedKey)(sessionId), false));
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.authToken, authToken), [authToken]);
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.sessionId, sessionId), [sessionId]);
+    (0, react_1.useEffect)(() => {
+        setInitCompleted(localStorage_1.ls.get((0, storageKeys_1.getInitCompletedKey)(sessionId), false));
+    }, [sessionId]);
+    // context window selection (used for initializeChat and WS messages)
+    const [contextWindow, setContextWindow] = (0, react_1.useState)(() => {
+        var _a;
+        return (_a = sdkConfig.contextWindow) !== null && _a !== void 0 ? _a : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.contextWindow, chatDefaults_1.DEFAULT_CONTEXT_WINDOW);
+    });
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.contextWindow, contextWindow), [contextWindow]);
+    // Real-time speech language (for transcription)
+    const [speechLang, setSpeechLang] = (0, react_1.useState)(() => {
+        var _a, _b;
+        return (_b = (_a = props.speechLanguage) !== null && _a !== void 0 ? _a : props.speechLang) !== null && _b !== void 0 ? _b : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.speechLang, chatDefaults_1.DEFAULT_SPEECH_LANG);
+    });
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.speechLang, speechLang), [speechLang]);
+    const [inputLocale, setInputLocale] = (0, react_1.useState)(() => typeof navigator !== "undefined" && navigator.language
+        ? navigator.language
+        : "en-US");
+    const [keyboardDirection, setKeyboardDirection] = (0, react_1.useState)(null);
+    (0, react_1.useEffect)(() => {
+        if (typeof window === "undefined")
+            return;
+        const handleLanguageChange = () => setInputLocale(navigator.language || "en-US");
+        window.addEventListener("languagechange", handleLanguageChange);
+        return () => window.removeEventListener("languagechange", handleLanguageChange);
+    }, []);
+    // TTS language (separate from transcription)
+    const [ttsLang, setTtsLang] = (0, react_1.useState)(() => {
+        var _a, _b;
+        return (_b = (_a = props.ttsLanguage) !== null && _a !== void 0 ? _a : props.ttsLang) !== null && _b !== void 0 ? _b : localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.ttsLang, chatDefaults_1.DEFAULT_TTS_LANG);
+    });
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.ttsLang, ttsLang), [ttsLang]);
+    // favicon
+    (0, react_1.useEffect)(() => {
+        const svg = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64">` +
+            `<circle cx="32" cy="32" r="28" fill="#252525"/></svg>`;
+        const url = `data:image/svg+xml;utf8,${encodeURIComponent(svg)}`;
+        let link = document.querySelector("link[rel='icon']");
+        if (!link) {
+            link = document.createElement("link");
+            link.rel = "icon";
+            document.head.appendChild(link);
+        }
+        link.href = url;
+    }, []);
+    // chat state
+    const [messages, setMessages] = (0, react_1.useState)(() => localStorage_1.ls.get((0, storageKeys_1.getMessagesKey)(sessionId), []));
+    const [lastToolResult, setLastToolResult] = (0, react_1.useState)(null);
+    const [showToolOverlay, setShowToolOverlay] = (0, react_1.useState)(false);
+    const [input, setInput] = (0, react_1.useState)("");
+    const [pending, setPending] = (0, react_1.useState)(false);
+    const [selectedFiles, setSelectedFiles] = (0, react_1.useState)([]);
+    // init panel
+    const resolvedInitUsername = localStorage_1.ls.get(storageKeys_1.STORAGE_KEYS.initUsername, "");
+    const resolvedInitServiceId = (_e = props.initServiceId) !== null && _e !== void 0 ? _e : "";
+    const resolvedInitRequestStepId = (_f = props.initRequestStepId) !== null && _f !== void 0 ? _f : "";
+    const [showInitPanel, setShowInitPanel] = (0, react_1.useState)(false);
+    const [initPreset, setInitPreset] = (0, react_1.useState)((_g = props.initialInitPreset) !== null && _g !== void 0 ? _g : "custom");
+    const [initUsername, setInitUsername] = (0, react_1.useState)(resolvedInitUsername);
+    const [initPassword, setInitPassword] = (0, react_1.useState)("");
+    const [initLoading, setInitLoading] = (0, react_1.useState)(false);
+    // Init panel extra fields per new API
+    const [initContextWindow, setInitContextWindow] = (0, react_1.useState)(contextWindow);
+    const [initServiceId, setInitServiceId] = (0, react_1.useState)(resolvedInitServiceId === undefined || resolvedInitServiceId === null
+        ? ""
+        : String(resolvedInitServiceId));
+    const [initRequestStepId, setInitRequestStepId] = (0, react_1.useState)(resolvedInitRequestStepId === undefined || resolvedInitRequestStepId === null
+        ? ""
+        : String(resolvedInitRequestStepId));
+    // Initializing message was removed from the backend (kept only for chat + speech features).
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.initUsername, initUsername), [initUsername]);
+    (0, react_1.useEffect)(() => localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.domain, domain), [domain]);
+    (0, react_1.useEffect)(() => {
+        setDomain(isDab ? chatDefaults_1.DEFAULT_DOMAIN : "");
+    }, [isDab]);
+    (0, react_1.useEffect)(() => {
+        if (props.initServiceId !== undefined) {
+            setInitServiceId(String(props.initServiceId));
+        }
+    }, [props.initServiceId]);
+    (0, react_1.useEffect)(() => {
+        if (props.initRequestStepId !== undefined) {
+            setInitRequestStepId(String(props.initRequestStepId));
+        }
+    }, [props.initRequestStepId]);
+    (0, react_1.useEffect)(() => {
+        if (!initPanelEnabled && showInitPanel) {
+            setShowInitPanel(false);
+        }
+    }, [initPanelEnabled, showInitPanel]);
+    const applyInitPreset = (preset) => {
+        setInitPreset(preset);
+        if (preset === "custom") {
+            setInitUsername("");
+            setInitPassword("");
+            return;
+        }
+        const presetValues = initPresets[preset];
+        if (presetValues === null || presetValues === void 0 ? void 0 : presetValues.username) {
+            setInitUsername(presetValues.username);
+        }
+        if (presetValues === null || presetValues === void 0 ? void 0 : presetValues.password) {
+            setInitPassword(presetValues.password);
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        if (!props.initialInitPreset)
+            return;
+        applyInitPreset(props.initialInitPreset);
+    }, [props.initialInitPreset, initPresets]);
+    // doc viewer
+    const [overlayUrl, setOverlayUrl] = (0, react_1.useState)(null);
+    const [viewerUrl, setViewerUrl] = (0, react_1.useState)(null);
+    const [gdocUrl, setGdocUrl] = (0, react_1.useState)(null);
+    const [blobUrl, setBlobUrl] = (0, react_1.useState)(null);
+    const [viewerLoading, setViewerLoading] = (0, react_1.useState)(false);
+    const [viewerError, setViewerError] = (0, react_1.useState)(null);
+    const [viewerKey, setViewerKey] = (0, react_1.useState)(0);
+    const [viewerBlob, setViewerBlob] = (0, react_1.useState)(null);
+    const [viewerFilename, setViewerFilename] = (0, react_1.useState)(text.documentViewer.iframeTitle);
+    const gdocFallbackTimer = (0, react_1.useRef)(undefined);
+    // AvailableTasksCards popup
+    const [taskCardModalOpen, setTaskCardModalOpen] = (0, react_1.useState)(false);
+    const [activeTaskCard, setActiveTaskCard] = (0, react_1.useState)(null);
+    const [selectedTaskCard, setSelectedTaskCard] = (0, react_1.useState)(null);
+    const [takeActionOpen, setTakeActionOpen] = (0, react_1.useState)(false);
+    const [takeActionStep, setTakeActionStep] = (0, react_1.useState)(1);
+    const [takeActionChoice, setTakeActionChoice] = (0, react_1.useState)("");
+    const [takeActionComments, setTakeActionComments] = (0, react_1.useState)("");
+    const [takeActionAttributes, setTakeActionAttributes] = (0, react_1.useState)([]);
+    const [takeActionSubmitting, setTakeActionSubmitting] = (0, react_1.useState)(false);
+    const [takeActionError, setTakeActionError] = (0, react_1.useState)(null);
+    const [takeActionProceedOpen, setTakeActionProceedOpen] = (0, react_1.useState)(false);
+    const [takeActionProceedData, setTakeActionProceedData] = (0, react_1.useState)(null);
+    const [userSignatures, setUserSignatures] = (0, react_1.useState)([]);
+    const openTaskCardModal = (card) => {
+        setActiveTaskCard(card);
+        setTaskCardModalOpen(true);
+    };
+    const closeTaskCardModal = () => {
+        setTaskCardModalOpen(false);
+        setActiveTaskCard(null);
+    };
+    const resetTakeActionState = () => {
+        setTakeActionStep(1);
+        setTakeActionChoice("");
+        setTakeActionComments("");
+        setTakeActionAttributes([]);
+        setTakeActionError(null);
+    };
+    const openTakeActionModal = (card) => {
+        var _a;
+        setActiveTaskCard(card);
+        const attrs = Array.isArray(card.RequestAttributeList)
+            ? card.RequestAttributeList.map((attr) => (Object.assign(Object.assign({}, attr), { Value: attr.Value === undefined || attr.Value === null ? "" : attr.Value })))
+            : [];
+        const signatureAliasFromCard = (_a = card.MetaData) === null || _a === void 0 ? void 0 : _a.SignatureAttributeAlias;
+        const mergedAttrs = attrs.map((attr) => {
+            if (signatureAliasFromCard &&
+                attr.Alias === signatureAliasFromCard &&
+                (!Array.isArray(attr.Options) || attr.Options.length === 0)) {
+                return Object.assign(Object.assign({}, attr), { Options: userSignatures });
+            }
+            return attr;
+        });
+        setTakeActionAttributes(mergedAttrs);
+        setTakeActionOpen(true);
+        setTakeActionStep(1);
+        setTakeActionChoice("");
+        setTakeActionComments("");
+        setTakeActionError(null);
+        setTakeActionProceedOpen(false);
+        setTakeActionProceedData(null);
+    };
+    const closeTakeActionModal = (keepProceedState = false) => {
+        setTakeActionOpen(false);
+        resetTakeActionState();
+        if (!keepProceedState) {
+            setTakeActionProceedOpen(false);
+            setTakeActionProceedData(null);
+        }
+    };
+    const handleTakeActionBack = () => {
+        if (takeActionStep === 2) {
+            setTakeActionStep(1);
+            return;
+        }
+        closeTakeActionModal();
+        if (activeTaskCard) {
+            setTaskCardModalOpen(true);
+        }
+    };
+    const toggleTaskCardSelection = (card) => {
+        const currentId = selectedTaskCard === null || selectedTaskCard === void 0 ? void 0 : selectedTaskCard.RequestId;
+        if (currentId !== undefined && String(currentId) === String(card.RequestId)) {
+            setSelectedTaskCard(null);
+            return;
+        }
+        setSelectedTaskCard(card);
+    };
+    const removeTaskCardFromMessages = (requestStepId) => {
+        setMessages((prev) => prev.map((m) => {
+            if (!m.availableTasksCards || m.availableTasksCards.length === 0)
+                return m;
+            const filtered = m.availableTasksCards.filter((card) => {
+                var _a;
+                const cardStepId = (_a = card.RequestStepId) !== null && _a !== void 0 ? _a : card.RequestId;
+                return String(cardStepId) !== String(requestStepId);
+            });
+            if (filtered.length === m.availableTasksCards.length)
+                return m;
+            if (filtered.length === 0) {
+                const { availableTasksCards } = m, rest = __rest(m, ["availableTasksCards"]);
+                return rest;
+            }
+            return Object.assign(Object.assign({}, m), { availableTasksCards: filtered });
+        }));
+        setSelectedTaskCard((prev) => {
+            var _a;
+            if (!prev)
+                return prev;
+            const prevId = (_a = prev.RequestStepId) !== null && _a !== void 0 ? _a : prev.RequestId;
+            return String(prevId) === String(requestStepId) ? null : prev;
+        });
+        setActiveTaskCard((prev) => {
+            var _a;
+            if (!prev)
+                return prev;
+            const prevId = (_a = prev.RequestStepId) !== null && _a !== void 0 ? _a : prev.RequestId;
+            return String(prevId) === String(requestStepId) ? null : prev;
+        });
+    };
+    // Note: We no longer pin an "initializing" banner. Cards are attached to assistant messages as returned.
+    // voice (transcription)
+    const [voiceMode, setVoiceMode] = (0, react_1.useState)(false);
+    const [voiceError, setVoiceError] = (0, react_1.useState)(null);
+    const [voiceUploading, setVoiceUploading] = (0, react_1.useState)(false); // kept as "busy" flag for UX
+    const mediaStreamRef = (0, react_1.useRef)(null);
+    const audioCtxRef = (0, react_1.useRef)(null);
+    const analyserRef = (0, react_1.useRef)(null);
+    const rafRef = (0, react_1.useRef)(null);
+    const [waveData, setWaveData] = (0, react_1.useState)(() => Array(40).fill(4));
+    // Azure Speech SDK
+    const sdkRef = (0, react_1.useRef)(null);
+    const recognizerRef = (0, react_1.useRef)(null);
+    // Speech text refs for composing input
+    const speechBaseInputRef = (0, react_1.useRef)(null);
+    const speechFinalRef = (0, react_1.useRef)(""); // final recognized segments
+    const speechLiveRef = (0, react_1.useRef)(""); // current partial
+    // We'll use inputRef to always have the latest input string (mainly if you extend logic later)
+    const inputRef = (0, react_1.useRef)("");
+    const autoInitAttemptedRef = (0, react_1.useRef)(false);
+    const autoInitConfigKey = (0, react_1.useMemo)(() => [
+        initializeChatOnLoad ? "1" : "0",
+        initUsername,
+        initPassword,
+        domain,
+        initContextWindow,
+        initServiceId,
+        initRequestStepId,
+    ].join("|"), [
+        initializeChatOnLoad,
+        initUsername,
+        initPassword,
+        domain,
+        initContextWindow,
+        initServiceId,
+        initRequestStepId,
+    ]);
+    // TTS state
+    const ttsSynthRef = (0, react_1.useRef)(null);
+    const [speakingMessageIndex, setSpeakingMessageIndex] = (0, react_1.useState)(null);
+    // refs
+    const fileInputRef = (0, react_1.useRef)(null);
+    const listEndRef = (0, react_1.useRef)(null);
+    const composerRef = (0, react_1.useRef)(null);
+    // persist messages
+    (0, react_1.useEffect)(() => {
+        localStorage_1.ls.set((0, storageKeys_1.getMessagesKey)(sessionId), messages);
+    }, [messages, sessionId]);
+    // keep inputRef in sync
+    (0, react_1.useEffect)(() => {
+        inputRef.current = input;
+    }, [input]);
+    (0, react_1.useEffect)(() => {
+        autoInitAttemptedRef.current = false;
+    }, [autoInitConfigKey]);
+    (0, react_1.useEffect)(() => {
+        const shouldAutoInit = initializeChatOnLoad;
+        if (!shouldAutoInit || initLoading || initCompleted)
+            return;
+        if (!authToken && (!initUsername.trim() || !initPassword))
+            return;
+        if (autoInitAttemptedRef.current)
+            return;
+        autoInitAttemptedRef.current = true;
+        void initializeSession({ runInitializeChatClients: true });
+    }, [
+        initializeChatOnLoad,
+        authToken,
+        initLoading,
+        initCompleted,
+        initUsername,
+        initPassword,
+        autoInitConfigKey,
+    ]);
+    // auto scroll
+    (0, react_1.useEffect)(() => {
+        var _a;
+        (_a = listEndRef.current) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ behavior: "smooth" });
+    }, [messages, pending]);
+    const chatIsRtl = (0, textDirection_1.isRtlLocale)(speechLang);
+    const localeDirection = (0, textDirection_1.isRtlLocale)(inputLocale) ? "rtl" : "ltr";
+    const inputDirection = (0, react_1.useMemo)(() => { var _a, _b; return (_b = (_a = (0, textDirection_1.getTextDirection)(input)) !== null && _a !== void 0 ? _a : keyboardDirection) !== null && _b !== void 0 ? _b : localeDirection; }, [input, keyboardDirection, localeDirection]);
+    const inputIsRtl = inputDirection === "rtl";
+    // hydrate from server
+    (0, react_1.useEffect)(() => {
+        if (!apiBase || !apiKey || !sessionId)
+            return;
+        const controller = new AbortController();
+        let cancelled = false;
+        (() => __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            try {
+                const res = yield fetch(new URL(`/api/getSessionConversation`, apiBase).toString(), {
+                    method: "POST",
+                    signal: controller.signal,
+                    headers: Object.assign({ "Content-Type": "application/json", "api-key": apiKey }, (authToken ? { Authorization: authToken } : {})),
+                    body: JSON.stringify({
+                        Domain: domain.trim(),
+                        SessionId: sessionId,
+                    }),
+                });
+                if (!res.ok) {
+                    if (res.status === 401) {
+                        return;
+                    }
+                    throw new Error(`${res.status} ${res.statusText}`);
+                }
+                const raw = yield res.json();
+                if (cancelled)
+                    return;
+                const serverConvoRaw = Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SessionConversation)
+                    ? raw.SessionConversation
+                    : Array.isArray(raw)
+                        ? raw
+                        : [];
+                const serverConvo = (serverConvoRaw || []).map((m) => {
+                    var _a, _b;
+                    const cards = Array.isArray(m === null || m === void 0 ? void 0 : m.SelectedTasksCards)
+                        ? m.SelectedTasksCards
+                        : Array.isArray(m === null || m === void 0 ? void 0 : m.SelectedTaskCards)
+                            ? m.SelectedTaskCards
+                            : Array.isArray(m === null || m === void 0 ? void 0 : m.AvailableTasksCards)
+                                ? m.AvailableTasksCards
+                                : Array.isArray(m === null || m === void 0 ? void 0 : m.Cards)
+                                    ? m.Cards
+                                    : Array.isArray(m === null || m === void 0 ? void 0 : m.AvailableTasks)
+                                        ? m.AvailableTasks
+                                        : [];
+                    return Object.assign({ role: m.role, content: (_a = m.content) !== null && _a !== void 0 ? _a : "", ts: (_b = m.ts) !== null && _b !== void 0 ? _b : Date.now() }, (cards.length ? { availableTasksCards: cards } : {}));
+                });
+                if (Array.isArray((_a = raw === null || raw === void 0 ? void 0 : raw.Profile) === null || _a === void 0 ? void 0 : _a.UserSignatures)) {
+                    setUserSignatures(raw.Profile.UserSignatures);
+                }
+                const topCards = Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTasksCards)
+                    ? raw.SelectedTasksCards
+                    : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTaskCards)
+                        ? raw.SelectedTaskCards
+                        : [];
+                if (topCards.length && serverConvo.length) {
+                    for (let i = serverConvo.length - 1; i >= 0; i--) {
+                        if (serverConvo[i].role === "Assistant") {
+                            serverConvo[i] = Object.assign(Object.assign({}, serverConvo[i]), { availableTasksCards: topCards });
+                            break;
+                        }
+                    }
+                }
+                setMessages(serverConvo);
+            }
+            catch (err) {
+                if ((err === null || err === void 0 ? void 0 : err.name) === "AbortError")
+                    return;
+                setMessages((prev) => prev.length
+                    ? prev
+                    : [
+                        {
+                            role: "Assistant",
+                            content: text.alerts.fetchHistoryFailed,
+                            ts: Date.now(),
+                        },
+                    ]);
+            }
+        }))();
+        return () => {
+            cancelled = true;
+            controller.abort();
+        };
+    }, [apiBase, apiKey, authToken, sessionId, domain]);
+    const canSend = (0, react_1.useMemo)(() => (!!input.trim() || selectedFiles.length > 0 || !!selectedTaskCard) &&
+        !!sessionId &&
+        !!apiBase &&
+        !!apiKey &&
+        !pending, [input, selectedFiles, sessionId, apiBase, apiKey, pending]);
+    function autosizeTextarea(el) {
+        if (!el)
+            return;
+        el.style.height = "0px";
+        el.style.height = Math.min(el.scrollHeight, 320) + "px";
+    }
+    (0, react_1.useEffect)(() => {
+        autosizeTextarea(composerRef.current);
+    }, [input]);
+    const signatureAlias = (_j = (_h = activeTaskCard === null || activeTaskCard === void 0 ? void 0 : activeTaskCard.MetaData) === null || _h === void 0 ? void 0 : _h.SignatureAttributeAlias) !== null && _j !== void 0 ? _j : null;
+    const visibleTakeActionAttributes = (0, react_1.useMemo)(() => {
+        return takeActionAttributes
+            .filter((attr) => attr.IsProviderVisible)
+            .slice()
+            .sort((a, b) => a.SequenceNo - b.SequenceNo);
+    }, [takeActionAttributes]);
+    const updateTakeActionAttributeValue = (attr, nextValue) => {
+        setTakeActionAttributes((prev) => prev.map((item) => {
+            const same = (item.Alias && item.Alias === attr.Alias) ||
+                (item.Name && item.Name === attr.Name) ||
+                item.AttributeTypeId === attr.AttributeTypeId;
+            if (!same)
+                return item;
+            return Object.assign(Object.assign({}, item), { Value: nextValue });
+        }));
+    };
+    const requestHeaders = (0, react_1.useMemo)(() => (0, api_1.buildRequestHeaders)({ authToken, apiSubscriptionKey }), [authToken, apiSubscriptionKey]);
+    function stopVisualizer() {
+        if (rafRef.current) {
+            cancelAnimationFrame(rafRef.current);
+            rafRef.current = null;
+        }
+        if (audioCtxRef.current) {
+            audioCtxRef.current.close().catch(() => { });
+            audioCtxRef.current = null;
+        }
+        analyserRef.current = null;
+        setWaveData(Array(40).fill(4));
+    }
+    function teardownSpeechRecognition() {
+        try {
+            if (recognizerRef.current) {
+                recognizerRef.current.stopContinuousRecognitionAsync(() => {
+                    recognizerRef.current.close();
+                    recognizerRef.current = null;
+                }, () => {
+                    try {
+                        recognizerRef.current.close();
+                    }
+                    catch (_a) { }
+                    recognizerRef.current = null;
+                });
+            }
+        }
+        catch (_a) { }
+        if (mediaStreamRef.current) {
+            mediaStreamRef.current.getTracks().forEach((t) => t.stop());
+            mediaStreamRef.current = null;
+        }
+        stopVisualizer();
+    }
+    // Compose input from base + speechFinal + speechLive
+    function updateInputFromSpeech() {
+        var _a;
+        const base = ((_a = speechBaseInputRef.current) !== null && _a !== void 0 ? _a : "").trimEnd();
+        const seg = `${speechFinalRef.current} ${speechLiveRef.current}`.trim();
+        const combined = base ? (seg ? `${base} ${seg}` : base) : seg;
+        setInput(combined);
+        requestAnimationFrame(() => autosizeTextarea(composerRef.current));
+    }
+    function startSpeechRecognition() {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            setVoiceError(null);
+            setVoiceUploading(false);
+            // store base input (so cancel restores it)
+            speechBaseInputRef.current = input;
+            speechFinalRef.current = "";
+            speechLiveRef.current = "";
+            // 1) mic + visualizer
+            try {
+                const stream = yield navigator.mediaDevices.getUserMedia({
+                    audio: true,
+                });
+                mediaStreamRef.current = stream;
+                const AC = window.AudioContext || window.webkitAudioContext;
+                const audioCtx = new AC();
+                yield audioCtx.resume();
+                const source = audioCtx.createMediaStreamSource(stream);
+                const analyser = audioCtx.createAnalyser();
+                analyser.fftSize = 256;
+                analyser.smoothingTimeConstant = 0.6;
+                source.connect(analyser);
+                audioCtxRef.current = audioCtx;
+                analyserRef.current = analyser;
+                const bufferLength = analyser.frequencyBinCount;
+                const dataArray = new Uint8Array(bufferLength);
+                const tick = () => {
+                    if (!analyserRef.current)
+                        return;
+                    analyserRef.current.getByteTimeDomainData(dataArray);
+                    let sum = 0;
+                    for (let i = 0; i < dataArray.length; i++) {
+                        const v = dataArray[i] - 128;
+                        sum += Math.abs(v);
+                    }
+                    const avg = sum / dataArray.length;
+                    const normalized = Math.min(1, avg / 30);
+                    const base = 4;
+                    const max = 26;
+                    const bars = Array.from({ length: 40 }, (_, i) => {
+                        const factor = 0.75 + (i % 5) * 0.05;
+                        return base + normalized * max * factor;
+                    });
+                    setWaveData(bars);
+                    rafRef.current = requestAnimationFrame(tick);
+                };
+                tick();
+            }
+            catch (err) {
+                setVoiceError((_a = err === null || err === void 0 ? void 0 : err.message) !== null && _a !== void 0 ? _a : text.errors.microphoneAccess);
+            }
+            // 2) Speech SDK continuous recognition
+            try {
+                if (!sdkRef.current) {
+                    sdkRef.current = yield Promise.resolve().then(() => __importStar(require("microsoft-cognitiveservices-speech-sdk")));
+                }
+                const sdk = sdkRef.current;
+                const config = sdk.SpeechConfig.fromSubscription(speechKey, speechRegion);
+                // language from init panel (English(US) / Arabic(JO))
+                config.speechRecognitionLanguage = speechLang; // "en-US" or "ar-JO"
+                const audioCfg = sdk.AudioConfig.fromDefaultMicrophoneInput();
+                const recognizer = new sdk.SpeechRecognizer(config, audioCfg);
+                recognizerRef.current = recognizer;
+                recognizer.recognizing = (_s, e) => {
+                    var _a;
+                    speechLiveRef.current = ((_a = e === null || e === void 0 ? void 0 : e.result) === null || _a === void 0 ? void 0 : _a.text) || "";
+                    updateInputFromSpeech();
+                };
+                recognizer.recognized = (_s, e) => {
+                    var _a;
+                    const t = (_a = e === null || e === void 0 ? void 0 : e.result) === null || _a === void 0 ? void 0 : _a.text;
+                    if (t) {
+                        speechFinalRef.current = speechFinalRef.current
+                            ? `${speechFinalRef.current} ${t}`
+                            : t;
+                        speechLiveRef.current = "";
+                        updateInputFromSpeech();
+                    }
+                };
+                recognizer.canceled = (_s, e) => {
+                    if (e === null || e === void 0 ? void 0 : e.errorDetails) {
+                        setVoiceError(e.errorDetails);
+                    }
+                };
+                recognizer.sessionStopped = () => {
+                    // no-op; we'll clean up explicitly
+                };
+                yield new Promise((resolve, reject) => {
+                    recognizer.startContinuousRecognitionAsync(resolve, reject);
+                });
+                setVoiceMode(true);
+            }
+            catch (err) {
+                setVoiceError((_b = err === null || err === void 0 ? void 0 : err.message) !== null && _b !== void 0 ? _b : text.errors.transcriptionStart);
+                stopVisualizer();
+                if (mediaStreamRef.current) {
+                    mediaStreamRef.current.getTracks().forEach((t) => t.stop());
+                    mediaStreamRef.current = null;
+                }
+                try {
+                    if (recognizerRef.current) {
+                        recognizerRef.current.stopContinuousRecognitionAsync(() => { }, () => { });
+                        recognizerRef.current.close();
+                        recognizerRef.current = null;
+                    }
+                }
+                catch (_c) { }
+            }
+        });
+    }
+    function cancelVoice() {
+        var _a;
+        // restore base (value before starting speech)
+        const base = (_a = speechBaseInputRef.current) !== null && _a !== void 0 ? _a : "";
+        setInput(base);
+        requestAnimationFrame(() => autosizeTextarea(composerRef.current));
+        speechBaseInputRef.current = null;
+        speechFinalRef.current = "";
+        speechLiveRef.current = "";
+        teardownSpeechRecognition();
+        setVoiceMode(false);
+    }
+    function confirmVoice() {
+        // Keep whatever is currently in input (base + speech text)
+        speechBaseInputRef.current = null;
+        speechFinalRef.current = "";
+        speechLiveRef.current = "";
+        teardownSpeechRecognition();
+        setVoiceMode(false);
+    }
+    // TTS stop
+    function stopSpeaking() {
+        if (ttsSynthRef.current) {
+            const inst = ttsSynthRef.current;
+            // If it's a synthesizer
+            if (inst.stopSpeakingAsync) {
+                try {
+                    inst.stopSpeakingAsync(() => { }, () => { });
+                }
+                catch (_a) { }
+                try {
+                    inst.close();
+                }
+                catch (_b) { }
+            }
+            // If it's an HTMLAudioElement
+            if (inst instanceof HTMLAudioElement) {
+                try {
+                    inst.pause();
+                }
+                catch (_c) { }
+                try {
+                    inst.currentTime = 0;
+                }
+                catch (_d) { }
+            }
+        }
+        ttsSynthRef.current = null;
+        setSpeakingMessageIndex(null);
+    }
+    // TTS: speak assistant message content using Alloy MultilingualNeuralHD
+    function speakMessage(text, index) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            // 1) Clean markdown & special characters
+            const cleaned = text
+                .replace(/\*\*/g, " ")
+                .replace(/\*/g, " ")
+                .replace(/#/g, " ")
+                .replace(/\//g, " ")
+                .replace(/_/g, " ")
+                .replace(/`/g, " ")
+                .replace(/\|/g, " ")
+                .replace(/~/g, " ")
+                .replace(/>/g, " ")
+                .replace(/</g, " ")
+                .replace(/\r/g, "")
+                .replace(/\n+/g, "\n")
+                .trim();
+            if (!cleaned)
+                return;
+            const finalText = cleaned.replace(/\n/g, "\n");
+            // Stop anything already speaking
+            stopSpeaking();
+            try {
+                if (!sdkRef.current) {
+                    sdkRef.current = yield Promise.resolve().then(() => __importStar(require("microsoft-cognitiveservices-speech-sdk")));
+                }
+                const sdk = sdkRef.current;
+                const speechConfig = sdk.SpeechConfig.fromSubscription(speechKey, speechRegion);
+                const voiceName = (_a = ttsVoiceMap[ttsLang]) !== null && _a !== void 0 ? _a : "en-US-RyanMultilingualNeural";
+                speechConfig.speechSynthesisVoiceName = voiceName;
+                // ❗ We do NOT use AudioConfig.fromDefaultSpeakerOutput()
+                const audioConfig = null;
+                const synthesizer = new sdk.SpeechSynthesizer(speechConfig, audioConfig);
+                ttsSynthRef.current = synthesizer;
+                setSpeakingMessageIndex(index); // show “X”
+                synthesizer.speakTextAsync(finalText, (result) => {
+                    if (result.reason === sdk.ResultReason.SynthesizingAudioCompleted) {
+                        // Convert binary data to audio blob
+                        const audioBuffer = result.audioData;
+                        const blob = new Blob([audioBuffer], { type: "audio/wav" });
+                        // Create HTMLAudioElement
+                        const audio = new Audio();
+                        audio.src = URL.createObjectURL(blob);
+                        // Save player so stopSpeaking() works
+                        ttsSynthRef.current = audio;
+                        // Handle ending of playback
+                        audio.onended = () => {
+                            setSpeakingMessageIndex(null);
+                            ttsSynthRef.current = null;
+                        };
+                        // Start playback
+                        audio.play().catch((err) => {
+                            console.error("Audio play failed:", err);
+                            setSpeakingMessageIndex(null);
+                        });
+                    }
+                }, (err) => {
+                    console.error("TTS synthesis error:", err);
+                    try {
+                        synthesizer.close();
+                    }
+                    catch (_a) { }
+                    ttsSynthRef.current = null;
+                    setSpeakingMessageIndex(null);
+                });
+            }
+            catch (err) {
+                console.error("TTS start error:", err);
+                ttsSynthRef.current = null;
+                setSpeakingMessageIndex(null);
+            }
+        });
+    }
+    // cleanup on unmount
+    (0, react_1.useEffect)(() => {
+        return () => {
+            teardownSpeechRecognition();
+            stopSpeaking();
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // send message via HTTP (no streaming)
+    function sendMessage() {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            if (!sessionId)
+                return;
+            if (!initCompleted) {
+                if (initPanelEnabled) {
+                    setShowInitPanel(true);
+                }
+                alert(text.alerts.initRequired);
+                return;
+            }
+            const promptText = input.trim();
+            const hasText = !!promptText;
+            const hasFiles = selectedFiles.length > 0;
+            const hasSelectedCard = !!selectedTaskCard;
+            if (!hasText && !hasFiles && !hasSelectedCard)
+                return;
+            const filesToUpload = selectedFiles;
+            const attachmentsForMessage = filesToUpload.map((f) => ({
+                name: f.name,
+            }));
+            const selectionLine = hasSelectedCard
+                ? formatText(text.composer.selectionLineTemplate, {
+                    id: String((_a = selectedTaskCard === null || selectedTaskCard === void 0 ? void 0 : selectedTaskCard.RequestId) !== null && _a !== void 0 ? _a : ""),
+                })
+                : "";
+            const userContent = selectionLine
+                ? promptText
+                    ? `${selectionLine}\n${promptText}`
+                    : selectionLine
+                : promptText;
+            const userMsg = {
+                role: "User",
+                content: userContent,
+                attachments: attachmentsForMessage.length ? attachmentsForMessage : undefined,
+                ts: Date.now(),
+            };
+            setMessages((prev) => [...(prev || []), userMsg]);
+            // clear composer + files
+            setInput("");
+            setSelectedFiles([]);
+            if (fileInputRef.current)
+                fileInputRef.current.value = "";
+            requestAnimationFrame(() => autosizeTextarea(composerRef.current));
+            setPending(true);
+            try {
+                // 1) attachments upload (if any)
+                if (filesToUpload.length > 0) {
+                    const fd = new FormData();
+                    const sessionDomain = domain.trim();
+                    fd.append("Domain", sessionDomain);
+                    fd.append("SessionId", sessionId);
+                    for (const f of filesToUpload)
+                        fd.append("files", f);
+                    const uploadUrl = new URL("/api/uploadChatAttachments", apiBase);
+                    const sasRes = yield fetch(uploadUrl.toString(), {
+                        method: "POST",
+                        headers: Object.assign({ "api-key": apiKey }, (authToken ? { Authorization: authToken } : {})),
+                        body: fd,
+                    });
+                    if (!sasRes.ok) {
+                        let details = "";
+                        try {
+                            details = yield sasRes.text();
+                        }
+                        catch (_c) { }
+                        throw new Error(formatText(text.errors.sasRequestFailedTemplate, {
+                            status: sasRes.status,
+                            statusText: sasRes.statusText,
+                            details: details ? ` - ${details}` : "",
+                        }));
+                    }
+                    const sasJson = yield sasRes.json();
+                    const sasList = Array.isArray(sasJson)
+                        ? sasJson
+                        : Array.isArray(sasJson === null || sasJson === void 0 ? void 0 : sasJson.Attachments)
+                            ? sasJson.Attachments
+                            : [];
+                    if (!Array.isArray(sasList) || sasList.length === 0) {
+                        throw new Error(text.errors.noSasEntries);
+                    }
+                    for (let i = 0; i < filesToUpload.length; i++) {
+                        const file = filesToUpload[i];
+                        const entry = sasList[i] || sasList[0];
+                        if (!(entry === null || entry === void 0 ? void 0 : entry.AttachmentName) || !(entry === null || entry === void 0 ? void 0 : entry.AttachmentSAS)) {
+                            throw new Error(text.errors.invalidSasEntry);
+                        }
+                        yield (0, api_1.uploadFileWithSAS)(entry.AttachmentSAS, entry.AttachmentName, file);
+                    }
+                }
+                // 2) HTTP chat call (backend returns assistant response + list of cards)
+                const sessionDomain = domain.trim();
+                const payload = {
+                    Domain: sessionDomain,
+                    ContextWindow: contextWindow,
+                    SessionId: sessionId,
+                    UserMessage: userContent,
+                };
+                if ((selectedTaskCard === null || selectedTaskCard === void 0 ? void 0 : selectedTaskCard.RequestId) !== undefined && (selectedTaskCard === null || selectedTaskCard === void 0 ? void 0 : selectedTaskCard.RequestId) !== null) {
+                    payload.RequestId = selectedTaskCard.RequestId;
+                }
+                if (initServiceId && initServiceId.trim() !== "") {
+                    const n = Number(initServiceId);
+                    if (!Number.isNaN(n))
+                        payload.ServiceId = n;
+                }
+                if (initRequestStepId && initRequestStepId.trim() !== "") {
+                    const n = Number(initRequestStepId);
+                    if (!Number.isNaN(n))
+                        payload.RequestStepId = n;
+                }
+                const chatRes = yield fetch(new URL("/api/chat", apiBase).toString(), {
+                    method: "POST",
+                    headers: Object.assign({ "Content-Type": "application/json", "api-key": apiKey }, (authToken ? { Authorization: authToken } : {})),
+                    credentials: "include",
+                    body: JSON.stringify(payload),
+                });
+                if (!chatRes.ok) {
+                    let msg = "";
+                    try {
+                        msg = yield chatRes.text();
+                    }
+                    catch (_d) { }
+                    throw new Error(formatText(text.errors.chatFailedTemplate, {
+                        status: chatRes.status,
+                        statusText: chatRes.statusText,
+                        details: msg ? ` - ${msg}` : "",
+                    }));
+                }
+                let raw = {};
+                let rawText = null;
+                try {
+                    raw = yield chatRes.json();
+                }
+                catch (_e) {
+                    try {
+                        rawText = yield chatRes.text();
+                    }
+                    catch (_f) { }
+                }
+                const assistantText = (typeof (raw === null || raw === void 0 ? void 0 : raw.AIMessage) === "string" && raw.AIMessage) ||
+                    (typeof (raw === null || raw === void 0 ? void 0 : raw.AssistantMessage) === "string" && raw.AssistantMessage) ||
+                    (typeof (raw === null || raw === void 0 ? void 0 : raw.assistantMessage) === "string" && raw.assistantMessage) ||
+                    (typeof rawText === "string" && rawText) ||
+                    "";
+                const cards = Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTasksCards)
+                    ? raw.SelectedTasksCards
+                    : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTaskCards)
+                        ? raw.SelectedTaskCards
+                        : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.Cards)
+                            ? raw.Cards
+                            : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.AvailableTasksCards)
+                                ? raw.AvailableTasksCards
+                                : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.AvailableTasks)
+                                    ? raw.AvailableTasks
+                                    : [];
+                const signatures = Array.isArray((_b = raw === null || raw === void 0 ? void 0 : raw.Profile) === null || _b === void 0 ? void 0 : _b.UserSignatures)
+                    ? raw.Profile.UserSignatures
+                    : [];
+                setUserSignatures(signatures);
+                if (typeof (raw === null || raw === void 0 ? void 0 : raw.ToolResult) !== "undefined" && (raw === null || raw === void 0 ? void 0 : raw.ToolResult) !== null) {
+                    setLastToolResult(raw.ToolResult);
+                }
+                // If backend returns the full conversation, prefer it (prevents drift)
+                if (Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SessionConversation)) {
+                    const serverConvo = raw.SessionConversation.map((m) => {
+                        var _a, _b;
+                        const mCards = Array.isArray(m === null || m === void 0 ? void 0 : m.AvailableTasksCards)
+                            ? m.AvailableTasksCards
+                            : Array.isArray(m === null || m === void 0 ? void 0 : m.Cards)
+                                ? m.Cards
+                                : Array.isArray(m === null || m === void 0 ? void 0 : m.AvailableTasks)
+                                    ? m.AvailableTasks
+                                    : [];
+                        return Object.assign({ role: m.role, content: (_a = m.content) !== null && _a !== void 0 ? _a : "", ts: (_b = m.ts) !== null && _b !== void 0 ? _b : Date.now() }, (mCards.length ? { availableTasksCards: mCards } : {}));
+                    });
+                    if (cards.length && serverConvo.length) {
+                        for (let i = serverConvo.length - 1; i >= 0; i--) {
+                            if (serverConvo[i].role === "Assistant") {
+                                serverConvo[i] = Object.assign(Object.assign({}, serverConvo[i]), { availableTasksCards: cards });
+                                break;
+                            }
+                        }
+                    }
+                    setMessages(serverConvo);
+                }
+                else {
+                    const assistantMsg = Object.assign({ role: "Assistant", content: assistantText !== null && assistantText !== void 0 ? assistantText : "", ts: Date.now() }, (cards.length ? { availableTasksCards: cards } : {}));
+                    setMessages((prev) => [...(prev || []), assistantMsg]);
+                }
+            }
+            catch (err) {
+                setMessages((prev) => {
+                    var _a;
+                    return [
+                        ...prev,
+                        {
+                            role: "Assistant",
+                            content: formatText(text.errors.assistantMessageTemplate, {
+                                error: (_a = err === null || err === void 0 ? void 0 : err.message) !== null && _a !== void 0 ? _a : String(err),
+                            }),
+                            ts: Date.now(),
+                        },
+                    ];
+                });
+            }
+            finally {
+                setPending(false);
+            }
+        });
+    }
+    function handleUpload(files) {
+        if (!files || files.length === 0)
+            return;
+        setSelectedFiles((prev) => [...prev, ...Array.from(files)]);
+    }
+    function clearSelected(i) {
+        if (typeof i === "number") {
+            setSelectedFiles((xs) => xs.filter((_, idx) => idx !== i));
+        }
+        else {
+            setSelectedFiles([]);
+        }
+        if (fileInputRef.current)
+            fileInputRef.current.value = "";
+    }
+    function submitTakeAction() {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a;
+            if (!activeTaskCard)
+                return;
+            if (!authToken) {
+                setTakeActionError(text.errors.takeActionAuthRequired);
+                return;
+            }
+            const requestStepIdRaw = activeTaskCard.RequestStepId !== undefined &&
+                activeTaskCard.RequestStepId !== null
+                ? activeTaskCard.RequestStepId
+                : activeTaskCard.RequestId;
+            const requestStepId = Number(requestStepIdRaw);
+            if (Number.isNaN(requestStepId)) {
+                setTakeActionError(text.errors.takeActionMissingRequestStep);
+                return;
+            }
+            setTakeActionSubmitting(true);
+            setTakeActionError(null);
+            try {
+                yield (0, api_1.postJson)(`${requestStepBaseUrl}/api/DarAlBerProvider/CheckoutRequestStepList`, { RequestStepID: [requestStepId] }, requestHeaders);
+                const meta = activeTaskCard.MetaData || {};
+                const isSignDocument = !!meta.IsSignDocument;
+                let documentId = null;
+                let updatedAttributes = [...takeActionAttributes];
+                let documentUrl = "";
+                if (meta.DocumentTemplate) {
+                    const attrsForGeneration = updatedAttributes
+                        .map((attr) => {
+                        if ((0, taskAttributes_1.isDocumentAttribute)(attr, meta.DocumentAttributeName)) {
+                            return Object.assign(Object.assign({}, attr), { Value: "" });
+                        }
+                        return attr;
+                    })
+                        .filter((attr) => !(0, taskAttributes_1.isDocumentAttribute)(attr, meta.DocumentAttributeName));
+                    const genPayload = {
+                        RequestStepId: requestStepId,
+                        templateAttributeAlias: meta.DocumentTemplate,
+                        ClientRequestAttributes: (0, taskAttributes_1.buildAttributePayload)(attrsForGeneration),
+                        IsGeneratedWord: isSignDocument,
+                    };
+                    const genRes = yield (0, api_1.postJson)(`${transactionCatalogBaseUrl}/api/TransactionCommon/GenerateStepDocument`, genPayload, requestHeaders);
+                    documentId = (_a = genRes === null || genRes === void 0 ? void 0 : genRes.Result) !== null && _a !== void 0 ? _a : null;
+                    if (documentId !== null && documentId !== undefined) {
+                        updatedAttributes = (0, taskAttributes_1.applyDocumentIdToAttributes)(updatedAttributes, meta.DocumentAttributeName || null, documentId);
+                    }
+                }
+                if (documentId !== null && documentId !== undefined) {
+                    const signatureIdRaw = (0, taskAttributes_1.getAttributeValueByAlias)(takeActionAttributes, signatureAlias);
+                    const signatureId = Number(signatureIdRaw);
+                    if (isSignDocument) {
+                        if (Number.isNaN(signatureId)) {
+                            throw new Error(text.errors.takeActionMissingSignature);
+                        }
+                        yield (0, api_1.postJson)(`${signatureBaseUrl}/api/SignDocument`, {
+                            documentPath: String(documentId),
+                            alias: signatureAlias || "",
+                            interactorSignatureId: signatureId,
+                        }, requestHeaders);
+                    }
+                    documentUrl = yield (0, api_1.getDocumentUrl)(storageBaseUrl, documentId, requestHeaders);
+                }
+                if (!documentUrl) {
+                    throw new Error(text.errors.takeActionNoDocument);
+                }
+                setTakeActionProceedData({
+                    requestStepId,
+                    status: takeActionChoice === "Approve" ? 1 : 0,
+                    attributes: updatedAttributes,
+                    comment: takeActionComments || "",
+                });
+                setTakeActionProceedOpen(true);
+                yield openOverlay(documentUrl);
+                closeTakeActionModal(true);
+            }
+            catch (err) {
+                setTakeActionError((err === null || err === void 0 ? void 0 : err.message) || String(err));
+            }
+            finally {
+                setTakeActionSubmitting(false);
+            }
+        });
+    }
+    function proceedTakeAction() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!takeActionProceedData)
+                return;
+            setTakeActionSubmitting(true);
+            try {
+                const processPayload = {
+                    RequestStepIdList: [takeActionProceedData.requestStepId],
+                    Status: takeActionProceedData.status,
+                    RequestStepAttributeDtos: (0, taskAttributes_1.buildAttributePayload)(takeActionProceedData.attributes),
+                    ProviderComment: takeActionProceedData.comment || null,
+                };
+                yield (0, api_1.postJson)(`${requestStepBaseUrl}/api/DarAlBerProvider/ProcessCheckedOutRequestStepList`, processPayload, requestHeaders);
+                removeTaskCardFromMessages(takeActionProceedData.requestStepId);
+                setTakeActionProceedOpen(false);
+                setTakeActionProceedData(null);
+                closeOverlay();
+            }
+            catch (err) {
+                setTakeActionError((err === null || err === void 0 ? void 0 : err.message) || String(err));
+            }
+            finally {
+                setTakeActionSubmitting(false);
+            }
+        });
+    }
+    function clearChat() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (!sessionId)
+                return;
+            const ok = window.confirm(text.alerts.clearConfirm);
+            if (!ok)
+                return;
+            const sessionDomain = domain.trim();
+            try {
+                const res = yield fetch(new URL(`/api/clearChat`, apiBase).toString(), {
+                    method: "POST",
+                    headers: Object.assign({ "Content-Type": "application/json", "api-key": apiKey }, (authToken ? { Authorization: authToken } : {})),
+                    body: JSON.stringify({ Domain: sessionDomain, SessionId: sessionId }),
+                });
+                if (!res.ok)
+                    throw new Error(`${res.status} ${res.statusText}`);
+                let raw = {};
+                try {
+                    raw = yield res.json();
+                }
+                catch (_a) { }
+                const returnedConvoRaw = Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SessionConversation)
+                    ? raw.SessionConversation
+                    : [];
+                const returnedConvo = returnedConvoRaw.map((m) => {
+                    var _a, _b;
+                    return ({
+                        role: m.role,
+                        content: (_a = m.content) !== null && _a !== void 0 ? _a : "",
+                        ts: (_b = m.ts) !== null && _b !== void 0 ? _b : Date.now(),
+                    });
+                });
+                const topCards = Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTasksCards)
+                    ? raw.SelectedTasksCards
+                    : Array.isArray(raw === null || raw === void 0 ? void 0 : raw.SelectedTaskCards)
+                        ? raw.SelectedTaskCards
+                        : [];
+                if (topCards.length && returnedConvo.length) {
+                    for (let i = returnedConvo.length - 1; i >= 0; i--) {
+                        if (returnedConvo[i].role === "Assistant") {
+                            returnedConvo[i] = Object.assign(Object.assign({}, returnedConvo[i]), { availableTasksCards: topCards });
+                            break;
+                        }
+                    }
+                }
+                setMessages(returnedConvo);
+            }
+            catch (err) {
+                setMessages((prev) => {
+                    var _a;
+                    return [
+                        ...(prev || []),
+                        {
+                            role: "Assistant",
+                            content: formatText(text.alerts.clearFailedTemplate, {
+                                error: (_a = err === null || err === void 0 ? void 0 : err.message) !== null && _a !== void 0 ? _a : String(err),
+                            }),
+                            ts: Date.now(),
+                        },
+                    ];
+                });
+            }
+        });
+    }
+    function onKeyDown(e) {
+        var _a;
+        if (e.key === "Enter" && !e.shiftKey) {
+            e.preventDefault();
+            sendMessage();
+        }
+        if (e.key === "/" && (e.ctrlKey || e.metaKey)) {
+            e.preventDefault();
+            (_a = composerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }
+    function detectKeyboardDirection() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (typeof navigator === "undefined")
+                return;
+            const keyboard = navigator.keyboard;
+            if (!(keyboard === null || keyboard === void 0 ? void 0 : keyboard.getLayoutMap))
+                return;
+            try {
+                const map = yield keyboard.getLayoutMap();
+                for (const value of map.values()) {
+                    if (typeof value === "string" && (0, textDirection_1.getTextDirection)(value) === "rtl") {
+                        setKeyboardDirection("rtl");
+                        return;
+                    }
+                }
+                setKeyboardDirection("ltr");
+            }
+            catch (_a) { }
+        });
+    }
+    // doc viewer helpers
+    function guessExtensionFromType(type) {
+        if (!type)
+            return "";
+        const t = type.toLowerCase();
+        if (t.includes("pdf"))
+            return ".pdf";
+        if (t.includes("json"))
+            return ".json";
+        if (t.includes("xml"))
+            return ".xml";
+        if (t.includes("csv"))
+            return ".csv";
+        if (t.includes("png"))
+            return ".png";
+        if (t.includes("jpeg") || t.includes("jpg"))
+            return ".jpg";
+        if (t.includes("webp"))
+            return ".webp";
+        if (t.includes("plain"))
+            return ".txt";
+        return "";
+    }
+    function deriveFilenameFromUrl(url) {
+        try {
+            const u = new URL(url);
+            const path = u.pathname.split("/").filter(Boolean);
+            const last = path[path.length - 1] || text.documentViewer.iframeTitle;
+            return decodeURIComponent(last);
+        }
+        catch (_a) {
+            const m = url.split("?")[0].split("/").filter(Boolean);
+            return decodeURIComponent(m[m.length - 1] || text.documentViewer.iframeTitle);
+        }
+    }
+    function parseContentDispositionFilename(cd) {
+        if (!cd)
+            return null;
+        const star = /filename\*\s*=\s*([^']*)'[^']*'([^;]+)/i.exec(cd);
+        if (star && star[2]) {
+            return decodeURIComponent(star[2].trim().replace(/^"(.*)"$/, "$1"));
+        }
+        const reg = /filename\s*=\s*("?)([^";]+)\1/i.exec(cd);
+        if (reg && reg[2])
+            return reg[2].trim();
+        return null;
+    }
+    function buildGoogleViewerUrl(rawHref) {
+        let normalized = rawHref.trim();
+        try {
+            if (/%[0-9a-f]{2}/i.test(normalized)) {
+                normalized = decodeURIComponent(normalized);
+            }
+        }
+        catch (_a) { }
+        const nonce = Date.now();
+        return `https://docs.google.com/viewer?url=${encodeURIComponent(normalized)}&embedded=true&r=${nonce}`;
+    }
+    const openOverlay = (href) => __awaiter(this, void 0, void 0, function* () {
+        if (blobUrl) {
+            URL.revokeObjectURL(blobUrl);
+            setBlobUrl(null);
+        }
+        setOverlayUrl(href);
+        setViewerError(null);
+        setViewerBlob(null);
+        setViewerLoading(true);
+        setViewerFilename(text.documentViewer.iframeTitle);
+        const gv = buildGoogleViewerUrl(href);
+        setGdocUrl(gv);
+        setViewerUrl(gv);
+        setViewerKey((k) => k + 1);
+        try {
+            const resp = yield fetch(href, { mode: "cors" });
+            const ok = resp.ok;
+            const type = resp.headers.get("content-type") || "";
+            const cd = resp.headers.get("content-disposition");
+            const cdName = parseContentDispositionFilename(cd);
+            let blob = null;
+            if (ok) {
+                try {
+                    blob = yield resp.blob();
+                }
+                catch (_a) { }
+            }
+            let name = cdName || deriveFilenameFromUrl(href) || text.documentViewer.iframeTitle;
+            if (!/\.[a-z0-9]{2,6}$/i.test(name)) {
+                const ext = guessExtensionFromType(type);
+                if (ext)
+                    name += ext;
+            }
+            setViewerFilename(name);
+            const cdIsAttachment = (cd || "").toLowerCase().includes("attachment");
+            const looksPdf = type.toLowerCase().includes("pdf");
+            if (blob && (looksPdf || cdIsAttachment)) {
+                const u = URL.createObjectURL(blob);
+                setViewerBlob(blob);
+                setBlobUrl(u);
+                if (typeof window !== "undefined") {
+                    gdocFallbackTimer.current = window.setTimeout(() => {
+                        setViewerUrl((cur) => (cur === gv && u ? u : cur));
+                    }, 2200);
+                }
+            }
+        }
+        catch (_b) { }
+    });
+    const closeOverlay = () => {
+        if (gdocFallbackTimer.current) {
+            clearTimeout(gdocFallbackTimer.current);
+            gdocFallbackTimer.current = undefined;
+        }
+        setOverlayUrl(null);
+        setViewerUrl(null);
+        setGdocUrl(null);
+        setViewerError(null);
+        setViewerLoading(false);
+        setViewerBlob(null);
+        if (blobUrl)
+            URL.revokeObjectURL(blobUrl);
+        setBlobUrl(null);
+        setViewerFilename(text.documentViewer.iframeTitle);
+        setViewerKey((k) => k + 1);
+        if (takeActionProceedOpen) {
+            setTakeActionProceedOpen(false);
+            setTakeActionProceedData(null);
+        }
+    };
+    const downloadCurrent = () => {
+        try {
+            if (viewerBlob) {
+                const dlUrl = URL.createObjectURL(viewerBlob);
+                const a = document.createElement("a");
+                a.href = dlUrl;
+                a.download = viewerFilename || text.documentViewer.iframeTitle;
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+                URL.revokeObjectURL(dlUrl);
+            }
+            else if (overlayUrl) {
+                const a = document.createElement("a");
+                a.href = overlayUrl;
+                a.target = "_blank";
+                a.rel = "noopener";
+                a.download = viewerFilename || text.documentViewer.iframeTitle;
+                document.body.appendChild(a);
+                a.click();
+                a.remove();
+            }
+        }
+        catch (e) {
+            console.warn("Download failed:", e);
+        }
+    };
+    // Initialize session (login), initializeChatClients, and optionally initializeChat
+    function initializeChatWithParams(tokenOverride) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            try {
+                const result = yield (0, sdkUtilities_1.InitializeChatSession)({
+                    initServiceId: initServiceId || undefined,
+                    initRequestStepId: initRequestStepId || undefined,
+                    contextWindow: initContextWindow || contextWindow,
+                    domain,
+                    token: tokenOverride !== null && tokenOverride !== void 0 ? tokenOverride : authToken,
+                });
+                if (result.initialized) {
+                    if (result.sessionId && result.sessionId !== sessionId) {
+                        setSessionId(result.sessionId);
+                    }
+                    setInitCompleted(true);
+                    localStorage_1.ls.set((0, storageKeys_1.getInitCompletedKey)(result.sessionId), true);
+                }
+            }
+            catch (err) {
+                const msg = ((_a = err === null || err === void 0 ? void 0 : err.message) === null || _a === void 0 ? void 0 : _a.includes("Failed to fetch")) || ((_b = err === null || err === void 0 ? void 0 : err.message) === null || _b === void 0 ? void 0 : _b.includes("Network"))
+                    ? text.alerts.initChatNetworkError
+                    : (err === null || err === void 0 ? void 0 : err.message) || String(err);
+                alert(formatText(text.alerts.initChatErrorTemplate, { error: msg }));
+            }
+        });
+    }
+    function initializeChatClients(authHeader) {
+        return __awaiter(this, void 0, void 0, function* () {
+            try {
+                const apiBase = chatDefaults_1.DEFAULT_API_BASE;
+                const initClientsRes = yield fetch(new URL("/api/initializeChatClients", apiBase).toString(), {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        "api-key": apiKey,
+                        Authorization: authHeader,
+                    },
+                    body: JSON.stringify({ Domain: domain.trim() }),
+                });
+                if (!initClientsRes.ok) {
+                    let msg = "";
+                    try {
+                        msg = yield initClientsRes.text();
+                    }
+                    catch (_a) { }
+                    console.warn(`initializeChatClients: ${initClientsRes.status} ${initClientsRes.statusText} ${msg}`);
+                }
+            }
+            catch (err) {
+                console.warn("initializeChatClients network error:", err);
+            }
+        });
+    }
+    function initializeSession(options) {
+        return __awaiter(this, void 0, void 0, function* () {
+            var _a, _b;
+            if (initLoading)
+                return;
+            const requestDomain = domain.trim();
+            const authFromState = authToken === null || authToken === void 0 ? void 0 : authToken.trim();
+            const hasCredentials = !!initUsername.trim() && !!initPassword;
+            const shouldUseLogin = hasCredentials && !authFromState;
+            if (!serviceBaseUrl) {
+                alert(text.alerts.initMissingBaseUrl);
+                return;
+            }
+            if (!apiSubscriptionKey) {
+                alert(text.alerts.initMissingSubscriptionKey);
+                return;
+            }
+            const resolvedLoginSubscriptionKey = loginSubscriptionKey || apiSubscriptionKey;
+            if (!hasCredentials && !authFromState) {
+                alert(text.alerts.initMissingCredentials);
+                return;
+            }
+            if (shouldUseLogin) {
+                const username = initUsername.trim();
+                const password = initPassword;
+                if (!username || !password) {
+                    alert(text.alerts.initMissingCredentials);
+                    return;
+                }
+                if (!initEndpoint) {
+                    alert(text.alerts.initMissingEndpoint);
+                    return;
+                }
+            }
+            setInitLoading(true);
+            try {
+                let authHeader = authFromState;
+                if (shouldUseLogin) {
+                    const res = yield fetch(initEndpoint, {
+                        method: "POST",
+                        headers: {
+                            "Content-Type": "application/json",
+                            "ocp-apim-subscription-key": resolvedLoginSubscriptionKey,
+                        },
+                        body: JSON.stringify({
+                            domainName: requestDomain,
+                            clientType: initClientType,
+                            username: initUsername.trim(),
+                            password: initPassword,
+                        }),
+                    });
+                    let payload = {};
+                    try {
+                        payload = yield res.json();
+                    }
+                    catch (_c) { }
+                    if (!res.ok) {
+                        alert(text.alerts.initFailed);
+                        return;
+                    }
+                    const access = (_a = payload === null || payload === void 0 ? void 0 : payload.Result) === null || _a === void 0 ? void 0 : _a.Token;
+                    if (!access) {
+                        alert(text.alerts.initNoToken);
+                        return;
+                    }
+                    authHeader = `Bearer ${access}`.trim();
+                    setAuthToken(normalizeAuthToken(authHeader));
+                    localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.authToken, authHeader);
+                    localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.initUsername, initUsername.trim());
+                }
+                setContextWindow(initContextWindow || "ComposeRequest");
+                if (options === null || options === void 0 ? void 0 : options.runInitializeChatClients) {
+                    yield initializeChatClients(authHeader);
+                }
+                if (options === null || options === void 0 ? void 0 : options.runInitializeChat) {
+                    yield initializeChatWithParams(authHeader);
+                }
+                setShowInitPanel(false);
+                setInitPassword("");
+            }
+            catch (err) {
+                const msg = ((_b = err === null || err === void 0 ? void 0 : err.message) === null || _b === void 0 ? void 0 : _b.includes("Failed to fetch"))
+                    ? text.alerts.initNetworkError
+                    : (err === null || err === void 0 ? void 0 : err.message) || String(err);
+                alert(formatText(text.alerts.initErrorTemplate, { error: msg }));
+            }
+            finally {
+                setInitLoading(false);
+            }
+        });
+    }
+    function doLogout() {
+        return __awaiter(this, void 0, void 0, function* () {
+            // Server-side cleanup (only on logout)
+            const prevSessionId = sessionId;
+            try {
+                yield (0, sdkUtilities_1.FinalizeSession)({
+                    domain,
+                    token: authToken,
+                });
+            }
+            catch (_a) { }
+            // Local reset
+            setMessages([]);
+            setAuthToken("");
+            setInitPassword("");
+            setInitUsername("");
+            setInitPreset("custom");
+            if (prevSessionId) {
+                localStorage_1.ls.remove((0, storageKeys_1.getMessagesKey)(prevSessionId));
+                localStorage_1.ls.remove((0, storageKeys_1.getInitCompletedKey)(prevSessionId));
+            }
+            const newSessionId = (0, generateGuid_1.generateGuid)();
+            setSessionId(newSessionId);
+            localStorage_1.ls.set(storageKeys_1.STORAGE_KEYS.sessionId, newSessionId);
+            setInitCompleted(false);
+            localStorage_1.ls.set((0, storageKeys_1.getInitCompletedKey)(newSessionId), false);
+        });
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "chatui-root flex h-screen w-full flex-col", style: themeVars, children: [(0, jsx_runtime_1.jsx)("style", { children: chatDefaults_1.CHATUI_THEME_CSS }), (0, jsx_runtime_1.jsx)(TopBar_1.default, { sessionId: sessionId, authToken: authToken, onClearChat: clearChat, onLogout: doLogout, onInitOpen: () => {
+                    if (initPanelEnabled) {
+                        setShowInitPanel(true);
+                    }
+                }, textButtonTheme: textButtonTheme, showInitButton: initPanelEnabled, text: text.topBar }), initPanelEnabled && ((0, jsx_runtime_1.jsx)(InitPanel_1.default, { show: showInitPanel, onClose: () => setShowInitPanel(false), requiredConfig: {
+                    baseUrl: serviceBaseUrl,
+                    apiSubscriptionKey,
+                    loginSubscriptionKey,
+                    token: authToken,
+                    isDab,
+                    setBaseUrl: (value) => setServiceBaseUrl(normalizeServiceBaseUrl(value)),
+                    setApiSubscriptionKey,
+                    setLoginSubscriptionKey,
+                    setToken: (value) => setAuthToken(normalizeAuthToken(value)),
+                    setIsDab,
+                }, initPreset: initPreset, setInitPreset: applyInitPreset, initUsername: initUsername, setInitUsername: setInitUsername, initPassword: initPassword, setInitPassword: setInitPassword, domain: domain, setDomain: setDomain, initContextWindow: initContextWindow, setInitContextWindow: setInitContextWindow, initServiceId: initServiceId, setInitServiceId: setInitServiceId, initRequestStepId: initRequestStepId, setInitRequestStepId: setInitRequestStepId, sessionId: sessionId, setSessionId: setSessionId, speechLang: speechLang, setSpeechLang: setSpeechLang, ttsLang: ttsLang, setTtsLang: setTtsLang, initLoading: initLoading, onInitialize: () => __awaiter(this, void 0, void 0, function* () {
+                    setContextWindow(initContextWindow || contextWindow);
+                    yield initializeSession({
+                        runInitializeChatClients: true,
+                        runInitializeChat: true,
+                    });
+                }), textButtonTheme: textButtonTheme })), (0, jsx_runtime_1.jsx)(ToolResultOverlay_1.default, { show: showToolOverlay, onClose: () => setShowToolOverlay(false), lastToolResult: lastToolResult, text: text.toolResult }), (0, jsx_runtime_1.jsx)(TaskCardsModal_1.default, { open: taskCardModalOpen, card: activeTaskCard, onClose: closeTaskCardModal, onTakeAction: (card) => {
+                    closeTaskCardModal();
+                    openTakeActionModal(card);
+                }, onShowDocument: (url) => {
+                    closeTaskCardModal();
+                    openOverlay(url);
+                }, textButtonTheme: textButtonTheme, text: text.taskCards }), (0, jsx_runtime_1.jsx)(TakeActionModal_1.default, { open: takeActionOpen, activeTaskCard: activeTaskCard, takeActionStep: takeActionStep, takeActionChoice: takeActionChoice, takeActionComments: takeActionComments, takeActionSubmitting: takeActionSubmitting, takeActionError: takeActionError, visibleAttributes: visibleTakeActionAttributes, signatureAlias: signatureAlias, userSignatures: userSignatures, onBack: handleTakeActionBack, onClose: () => closeTakeActionModal(), onChoiceChange: setTakeActionChoice, onCommentsChange: setTakeActionComments, onStepChange: setTakeActionStep, onSubmit: submitTakeAction, onUpdateAttribute: updateTakeActionAttributeValue, getSignatureLabel: taskAttributes_1.getSignatureLabel, textButtonTheme: textButtonTheme, text: text.takeAction }), (0, jsx_runtime_1.jsx)(DocumentViewer_1.default, { overlayUrl: overlayUrl, viewerLoading: viewerLoading, viewerUrl: viewerUrl, viewerKey: viewerKey, viewerFilename: viewerFilename, gdocUrl: gdocUrl, blobUrl: blobUrl, viewerError: viewerError, onClose: closeOverlay, onDownload: downloadCurrent, onIframeLoad: () => setViewerLoading(false), onUseGoogleViewer: () => {
+                    setViewerLoading(true);
+                    setViewerUrl(gdocUrl);
+                    setViewerKey((k) => k + 1);
+                }, onUseDirectViewer: () => {
+                    setViewerLoading(true);
+                    setViewerUrl(blobUrl);
+                    setViewerKey((k) => k + 1);
+                }, takeActionProceedOpen: takeActionProceedOpen, takeActionSubmitting: takeActionSubmitting, takeActionError: takeActionError, onProceedTakeAction: proceedTakeAction, textButtonTheme: textButtonTheme, text: text.documentViewer }), (0, jsx_runtime_1.jsx)(MessageList_1.default, { messages: messages, pending: pending, openOverlay: openOverlay, onOpenTaskCard: openTaskCardModal, onSelectTaskCard: toggleTaskCardSelection, selectedTaskCardId: selectedTaskCard === null || selectedTaskCard === void 0 ? void 0 : selectedTaskCard.RequestId, isRtl: chatIsRtl, speakingMessageIndex: speakingMessageIndex, onSpeak: speakMessage, onStopSpeak: stopSpeaking, textButtonTheme: textButtonTheme, listEndRef: listEndRef, text: text.emptyState, messageItemText: text.messageItem, taskCardSize: taskCardSize }), (0, jsx_runtime_1.jsx)(Composer_1.default, { fileInputRef: fileInputRef, composerRef: composerRef, selectedTaskCard: selectedTaskCard, selectedFiles: selectedFiles, onClearSelected: clearSelected, onUpload: handleUpload, input: input, onInputChange: (value) => {
+                    setInput(value);
+                    if (composerRef.current) {
+                        autosizeTextarea(composerRef.current);
+                    }
+                }, onInputKeyDown: onKeyDown, onInputFocus: detectKeyboardDirection, inputIsRtl: inputIsRtl, inputLocale: inputLocale, authToken: authToken, sessionId: sessionId, pending: pending, voiceMode: voiceMode, voiceUploading: voiceUploading, waveData: waveData, onToggleVoice: () => (voiceMode ? cancelVoice() : startSpeechRecognition()), onSendMessage: sendMessage, voiceError: voiceError, canSend: canSend, onCancelVoice: cancelVoice, onConfirmVoice: confirmVoice, onAttachClick: () => { var _a; return (_a = fileInputRef.current) === null || _a === void 0 ? void 0 : _a.click(); }, onClearSelectedTask: () => setSelectedTaskCard(null), text: text.composer, voiceOverlayText: text.voiceOverlay })] }));
+}