@promptbook/components 0.112.0-61 → 0.112.0-63

package/umd/index.umd.js

@@ -30,7 +30,7 @@
      * @generated
      * @see https://github.com/webgptorg/promptbook
      */
-    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-61';
+    const PROMPTBOOK_ENGINE_VERSION = '0.112.0-63';
     /**
      * TODO: string_promptbook_version should be constrained to the all versions of Promptbook engine
      * Note: [💞] Ignore a discrepancy between file name and entity name
@@ -10888,6 +10888,18 @@
     }
     // Note: [💞] Ignore a discrepancy between file name and entity name
 
+    /**
+     * Name of the tool used by agents to search configured `KNOWLEDGE` sources.
+     *
+     * @public exported from `@promptbook/core`
+     */
+    const KNOWLEDGE_SEARCH_TOOL_NAME = 'knowledge_search';
+    /**
+     * Title of the system-message section generated for `KNOWLEDGE` commitments.
+     *
+     * @private constant of `KnowledgeCommitmentDefinition`
+     */
+    const KNOWLEDGE_SEARCH_SYSTEM_SECTION_TITLE = 'Knowledge Search';
     /**
      * KNOWLEDGE commitment definition
      *
@@ -11009,9 +11021,17 @@
                 knowledgeInfoEntries.push(`Knowledge Source Inline: ${inlineSource.filename} (derived from inline content and processed for retrieval during chat)`);
             }
             if (knowledgeInfoEntries.length === 0) {
-                return nextRequirements;
+                return addKnowledgeSearchToolAndSystemSection(nextRequirements);
             }
-            return this.appendToSystemMessage(nextRequirements, knowledgeInfoEntries.join('\n'), '\n\n');
+            return addKnowledgeSearchToolAndSystemSection(nextRequirements);
+        }
+        /**
+         * Gets human-readable titles for tool functions provided by this commitment.
+         */
+        getToolTitles() {
+            return {
+                [KNOWLEDGE_SEARCH_TOOL_NAME]: 'Knowledge search',
+            };
         }
     }
     /**
@@ -11025,6 +11045,128 @@
         const significantText = contentWithoutUrls.replace(/[\s.,!?;:'"`()[\]{}<>/-]+/g, '');
         return significantText.length > 0;
     }
+    /**
+     * Adds the shared `knowledge_search` tool definition and the consolidated system-message section.
+     *
+     * @param requirements - Requirements after one `KNOWLEDGE` commitment was applied.
+     * @returns Requirements with the knowledge search instructions and tool definition.
+     *
+     * @private internal utility of `KnowledgeCommitmentDefinition`
+     */
+    function addKnowledgeSearchToolAndSystemSection(requirements) {
+        const nextRequirements = addKnowledgeSearchTool(requirements);
+        const section = createKnowledgeSearchSystemSection(nextRequirements);
+        const sectionHeader = `## ${KNOWLEDGE_SEARCH_SYSTEM_SECTION_TITLE}`;
+        if (nextRequirements.systemMessage.includes(sectionHeader)) {
+            return {
+                ...nextRequirements,
+                systemMessage: nextRequirements.systemMessage.replace(new RegExp(`## ${KNOWLEDGE_SEARCH_SYSTEM_SECTION_TITLE.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}[\\s\\S]*?(?=\\n\\n##|$)`), section),
+            };
+        }
+        return {
+            ...nextRequirements,
+            systemMessage: nextRequirements.systemMessage.trim()
+                ? `${nextRequirements.systemMessage}\n\n${section}`
+                : section,
+        };
+    }
+    /**
+     * Adds the `knowledge_search` model tool when it is not already present.
+     *
+     * @param requirements - Current model requirements.
+     * @returns Requirements with the tool definition available to the model.
+     *
+     * @private internal utility of `KnowledgeCommitmentDefinition`
+     */
+    function addKnowledgeSearchTool(requirements) {
+        const existingTools = requirements.tools || [];
+        if (existingTools.some((tool) => tool.name === KNOWLEDGE_SEARCH_TOOL_NAME)) {
+            return requirements;
+        }
+        return {
+            ...requirements,
+            tools: [
+                ...existingTools,
+                {
+                    name: KNOWLEDGE_SEARCH_TOOL_NAME,
+                    description: spacetrim.spaceTrim(`
+                    Search the agent's configured knowledge sources and return relevant excerpts with citation ids.
+                    Use this before answering questions that may depend on the agent's KNOWLEDGE commitments.
+                `),
+                    parameters: {
+                        type: 'object',
+                        properties: {
+                            query: {
+                                type: 'string',
+                                description: 'The natural-language search query for the knowledge base.',
+                            },
+                            limit: {
+                                type: 'integer',
+                                description: 'Maximum number of matching source excerpts to return.',
+                            },
+                        },
+                        required: ['query'],
+                    },
+                },
+            ],
+        };
+    }
+    /**
+     * Creates the model-facing system-message section for knowledge search.
+     *
+     * @param requirements - Current model requirements.
+     * @returns Markdown system-message section.
+     *
+     * @private internal utility of `KnowledgeCommitmentDefinition`
+     */
+    function createKnowledgeSearchSystemSection(requirements) {
+        const sourceEntries = createKnowledgeSourceSystemEntries(requirements);
+        const sourceList = sourceEntries.length > 0 ? sourceEntries.map((entry) => `-   ${entry}`).join('\n') : '-   None';
+        return spacetrim.spaceTrim(`
+        ## ${KNOWLEDGE_SEARCH_SYSTEM_SECTION_TITLE}
+
+        -   Use \`${KNOWLEDGE_SEARCH_TOOL_NAME}\` to search the configured knowledge sources before answering questions that depend on this agent's knowledge base.
+        -   Base source-backed factual answers on the returned excerpts.
+        -   When you use a returned excerpt, include its citation marker in the answer body, for example \`[0:0]\`.
+        -   If the search returns no relevant information, say that the knowledge base did not contain the answer instead of inventing it.
+
+        Configured knowledge sources:
+        ${sourceList}
+    `);
+    }
+    /**
+     * Builds a stable list of configured knowledge sources for system-message diagnostics.
+     *
+     * @param requirements - Current model requirements.
+     * @returns Human-readable source entries.
+     *
+     * @private internal utility of `KnowledgeCommitmentDefinition`
+     */
+    function createKnowledgeSourceSystemEntries(requirements) {
+        var _a;
+        const entries = [];
+        const seenEntries = new Set();
+        for (const source of requirements.knowledgeSources || []) {
+            const entry = `Source URL: ${source} (processed for retrieval during chat)`;
+            if (seenEntries.has(entry)) {
+                continue;
+            }
+            seenEntries.add(entry);
+            entries.push(entry);
+        }
+        const inlineSources = (((_a = requirements._metadata) === null || _a === void 0 ? void 0 : _a.inlineKnowledgeSources) || [])
+            .map((source) => source.filename)
+            .filter(Boolean);
+        for (const filename of inlineSources) {
+            const entry = `Knowledge Source Inline: ${filename} (Inline source: processed for retrieval during chat)`;
+            if (seenEntries.has(entry)) {
+                continue;
+            }
+            seenEntries.add(entry);
+            entries.push(entry);
+        }
+        return entries;
+    }
 
     /**
      * LANGUAGE commitment definition
@@ -15627,7 +15769,7 @@
         const runtimeContext = (readToolRuntimeContextFromToolArgs(args) ||
             {});
         const configuredCalendars = normalizeConfiguredCalendars$1((_a = runtimeContext.calendars) === null || _a === void 0 ? void 0 : _a.connections);
-        const calendarArgument = normalizeOptionalText$1(args.calendarUrl);
+        const calendarArgument = normalizeOptionalText$2(args.calendarUrl);
         let calendarReference = null;
         if (calendarArgument) {
             calendarReference = parseGoogleCalendarReference(calendarArgument);
@@ -15647,7 +15789,7 @@
         if (!calendarReference) {
             throw new Error('Calendar is required but was not resolved.');
         }
-        const accessToken = normalizeOptionalText$1((_b = runtimeContext.calendars) === null || _b === void 0 ? void 0 : _b.googleAccessToken) || '';
+        const accessToken = normalizeOptionalText$2((_b = runtimeContext.calendars) === null || _b === void 0 ? void 0 : _b.googleAccessToken) || '';
         if (!accessToken) {
             throw new CalendarWalletCredentialRequiredError({
                 calendarReference,
@@ -15680,7 +15822,7 @@
                 continue;
             }
             const calendar = rawCalendar;
-            const rawUrl = normalizeOptionalText$1(calendar.url);
+            const rawUrl = normalizeOptionalText$2(calendar.url);
             if (!rawUrl) {
                 continue;
             }
@@ -15731,7 +15873,7 @@
      *
      * @private function of resolveUseCalendarToolRuntimeOrWalletCredentialResult
      */
-    function normalizeOptionalText$1(value) {
+    function normalizeOptionalText$2(value) {
         if (typeof value !== 'string') {
             return undefined;
         }
@@ -15763,13 +15905,13 @@
             async [UseCalendarToolNames.listEvents](args) {
                 return withUseCalendarRuntime(args, async ({ calendarReference, accessToken }) => {
                     const query = {};
-                    if (normalizeOptionalText(args.timeMin)) {
+                    if (normalizeOptionalText$1(args.timeMin)) {
                         query.timeMin = args.timeMin.trim();
                     }
-                    if (normalizeOptionalText(args.timeMax)) {
+                    if (normalizeOptionalText$1(args.timeMax)) {
                         query.timeMax = args.timeMax.trim();
                     }
-                    if (normalizeOptionalText(args.query)) {
+                    if (normalizeOptionalText$1(args.query)) {
                         query.q = args.query.trim();
                     }
                     if (typeof args.maxResults === 'number' && Number.isFinite(args.maxResults) && args.maxResults > 0) {
@@ -15781,7 +15923,7 @@
                     if (args.orderBy === 'startTime' || args.orderBy === 'updated') {
                         query.orderBy = args.orderBy;
                     }
-                    if (normalizeOptionalText(args.timeZone)) {
+                    if (normalizeOptionalText$1(args.timeZone)) {
                         query.timeZone = args.timeZone.trim();
                     }
                     const payload = await callGoogleCalendarApi(accessToken, {
@@ -15819,11 +15961,11 @@
                 return withUseCalendarRuntime(args, async ({ calendarReference, accessToken }) => {
                     const requestBody = createGoogleCalendarEventPayload({
                         summary: normalizeRequiredText(args.summary, 'summary'),
-                        description: normalizeOptionalText(args.description),
-                        location: normalizeOptionalText(args.location),
+                        description: normalizeOptionalText$1(args.description),
+                        location: normalizeOptionalText$1(args.location),
                         start: normalizeRequiredText(args.start, 'start'),
                         end: normalizeRequiredText(args.end, 'end'),
-                        timeZone: normalizeOptionalText(args.timeZone),
+                        timeZone: normalizeOptionalText$1(args.timeZone),
                         attendees: normalizeAttendees(args.attendees),
                         reminderMinutes: normalizeReminderMinutes(args.reminderMinutes),
                     });
@@ -15845,12 +15987,12 @@
                 return withUseCalendarRuntime(args, async ({ calendarReference, accessToken }) => {
                     const eventId = normalizeRequiredText(args.eventId, 'eventId');
                     const requestBody = createGoogleCalendarEventPayload({
-                        summary: normalizeOptionalText(args.summary),
-                        description: normalizeOptionalText(args.description),
-                        location: normalizeOptionalText(args.location),
-                        start: normalizeOptionalText(args.start),
-                        end: normalizeOptionalText(args.end),
-                        timeZone: normalizeOptionalText(args.timeZone),
+                        summary: normalizeOptionalText$1(args.summary),
+                        description: normalizeOptionalText$1(args.description),
+                        location: normalizeOptionalText$1(args.location),
+                        start: normalizeOptionalText$1(args.start),
+                        end: normalizeOptionalText$1(args.end),
+                        timeZone: normalizeOptionalText$1(args.timeZone),
                         attendees: normalizeAttendees(args.attendees),
                         reminderMinutes: normalizeReminderMinutes(args.reminderMinutes),
                     });
@@ -15897,7 +16039,7 @@
                         path: `/calendars/${encodeGoogleCalendarId(calendarReference.calendarId)}/events/${encodeURIComponent(eventId)}`,
                     });
                     const existingAttendees = ((existingEvent === null || existingEvent === void 0 ? void 0 : existingEvent.attendees) || [])
-                        .map((attendee) => normalizeOptionalText(attendee.email))
+                        .map((attendee) => normalizeOptionalText$1(attendee.email))
                         .filter((email) => Boolean(email));
                     const mergedAttendees = [...new Set([...existingAttendees, ...guests])];
                     const payload = await callGoogleCalendarApi(accessToken, {
@@ -15945,7 +16087,7 @@
      * @private function of createUseCalendarToolFunctions
      */
     function normalizeRequiredText(value, fieldName) {
-        const normalizedValue = normalizeOptionalText(value);
+        const normalizedValue = normalizeOptionalText$1(value);
         if (!normalizedValue) {
             throw new Error(`Tool "${fieldName}" requires non-empty value.`);
         }
@@ -15956,7 +16098,7 @@
      *
      * @private function of createUseCalendarToolFunctions
      */
-    function normalizeOptionalText(value) {
+    function normalizeOptionalText$1(value) {
         if (typeof value !== 'string') {
             return undefined;
         }
@@ -20642,6 +20784,580 @@
     }
     // Note: [💞] Ignore a discrepancy between file name and entity name
 
+    /**
+     * Names of tools used by the WALLET commitment.
+     *
+     * @private constant of WalletCommitmentDefinition
+     */
+    const WalletToolNames = {
+        retrieve: 'retrieve_wallet_records',
+        store: 'store_wallet_record',
+        update: 'update_wallet_record',
+        delete: 'delete_wallet_record',
+        request: 'request_wallet_record',
+    };
+
+    /**
+     * Creates WALLET system-message instructions.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function createWalletSystemMessage(extraInstructions) {
+        return spacetrim.spaceTrim((block) => `
+            Wallet:
+            - Use "${WalletToolNames.retrieve}" before authenticated operations.
+            - Use "${WalletToolNames.store}" and "${WalletToolNames.update}" to maintain credentials.
+            - Use "${WalletToolNames.delete}" to remove invalid credentials.
+            - Use "${WalletToolNames.request}" to request missing credentials via UI popup.
+            - Scope records by user (\`isUserScoped\`) and/or by agent (\`isGlobal=false\`) as needed.
+            - Never expose raw credentials in chat responses.
+            ${block(extraInstructions)}
+        `);
+    }
+
+    /**
+     * Resolves disabled message for wallet runtime context.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function resolveWalletDisabledMessage(runtimeContext) {
+        if (runtimeContext.isPrivateMode) {
+            return 'Wallet is disabled because private mode is active.';
+        }
+        if (runtimeContext.isTeamConversation) {
+            return 'Wallet is disabled for TEAM conversations.';
+        }
+        if (!runtimeContext.enabled) {
+            return 'Wallet is disabled for unauthenticated users.';
+        }
+        return null;
+    }
+    /**
+     * Resolves runtime adapter for wallet tools or returns disabled payload when unavailable.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function getWalletToolRuntimeAdapterOrDisabledResult(action, runtimeContext) {
+        const disabledMessage = resolveWalletDisabledMessage(runtimeContext);
+        if (disabledMessage) {
+            return {
+                adapter: null,
+                disabledResult: {
+                    action,
+                    status: 'disabled',
+                    records: action === 'retrieve' ? [] : undefined,
+                    message: disabledMessage,
+                },
+            };
+        }
+        {
+            return {
+                adapter: null,
+                disabledResult: {
+                    action,
+                    status: 'disabled',
+                    records: action === 'retrieve' ? [] : undefined,
+                    message: 'Wallet runtime is not available in this environment.',
+                },
+            };
+        }
+    }
+
+    /**
+     * Parses store/update wallet payload.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletPayload(args) {
+        const recordType = parseWalletRecordType(args.recordType);
+        return {
+            recordType,
+            service: parseWalletService(args.service),
+            key: parseWalletKey(args.key),
+            isUserScoped: args.isUserScoped === true,
+            isGlobal: args.isGlobal === true,
+            ...parseWalletSecrets({
+                recordType,
+                username: args.username,
+                password: args.password,
+                secret: args.secret,
+                cookies: args.cookies,
+            }),
+        };
+    }
+    /**
+     * Parses text argument and returns trimmed text when available.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function normalizeOptionalText(value) {
+        if (typeof value !== 'string') {
+            return undefined;
+        }
+        const trimmed = value.trim();
+        return trimmed || undefined;
+    }
+    /**
+     * Parses wallet service argument.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletService(value) {
+        return (normalizeOptionalText(value) || 'generic').toLowerCase();
+    }
+    /**
+     * Parses wallet key argument.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletKey(value) {
+        return normalizeOptionalText(value) || 'default';
+    }
+    /**
+     * Parses one wallet record id argument.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletId(value) {
+        const walletId = normalizeOptionalText(value);
+        if (!walletId) {
+            throw new Error('Wallet id is required.');
+        }
+        return walletId;
+    }
+    /**
+     * Parses wallet record type.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletRecordType(value, fallback) {
+        var _a;
+        const normalizedType = (_a = normalizeOptionalText(value)) === null || _a === void 0 ? void 0 : _a.toUpperCase();
+        if (normalizedType === 'USERNAME_PASSWORD') {
+            return 'USERNAME_PASSWORD';
+        }
+        if (normalizedType === 'SESSION_COOKIE') {
+            return 'SESSION_COOKIE';
+        }
+        if (normalizedType === 'ACCESS_TOKEN') {
+            return 'ACCESS_TOKEN';
+        }
+        if (fallback) {
+            return fallback;
+        }
+        throw new Error('Unsupported wallet recordType. Expected one of: USERNAME_PASSWORD, SESSION_COOKIE, ACCESS_TOKEN.');
+    }
+    /**
+     * Parses wallet secret fields according to record type.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function parseWalletSecrets(args) {
+        const username = normalizeOptionalText(args.username);
+        const password = normalizeOptionalText(args.password);
+        const secret = normalizeOptionalText(args.secret);
+        const cookies = normalizeOptionalText(args.cookies);
+        if (args.recordType === 'USERNAME_PASSWORD') {
+            if (!username || !password) {
+                throw new Error('Both username and password are required for USERNAME_PASSWORD.');
+            }
+            return { username, password };
+        }
+        if (args.recordType === 'SESSION_COOKIE') {
+            if (!cookies) {
+                throw new Error('Cookies are required for SESSION_COOKIE.');
+            }
+            return { cookies };
+        }
+        if (!secret) {
+            throw new Error('Secret is required for ACCESS_TOKEN.');
+        }
+        return { secret };
+    }
+    /**
+     * Collection of WALLET tool argument parsers.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    const parseWalletToolArgs = {
+        /**
+         * Parses retrieve arguments.
+         */
+        retrieve(args) {
+            const limit = typeof args.limit === 'number' && Number.isFinite(args.limit) ? Math.floor(args.limit) : undefined;
+            return {
+                query: normalizeOptionalText(args.query),
+                recordType: normalizeOptionalText(args.recordType) ? parseWalletRecordType(args.recordType) : undefined,
+                service: normalizeOptionalText(args.service) ? parseWalletService(args.service) : undefined,
+                key: normalizeOptionalText(args.key) ? parseWalletKey(args.key) : undefined,
+                limit: limit && limit > 0 ? Math.min(limit, 20) : undefined,
+            };
+        },
+        /**
+         * Parses store payload.
+         */
+        store(args) {
+            return parseWalletPayload(args);
+        },
+        /**
+         * Parses update payload.
+         */
+        update(args) {
+            const walletId = parseWalletId(args.walletId);
+            const record = parseWalletPayload(args);
+            return {
+                ...record,
+                walletId,
+            };
+        },
+        /**
+         * Parses delete payload.
+         */
+        delete(args) {
+            return { walletId: parseWalletId(args.walletId) };
+        },
+        /**
+         * Parses request payload for user wallet input prompt.
+         */
+        request(args) {
+            return {
+                recordType: parseWalletRecordType(args.recordType, 'ACCESS_TOKEN'),
+                service: parseWalletService(args.service),
+                key: parseWalletKey(args.key),
+                message: normalizeOptionalText(args.message),
+                isUserScoped: args.isUserScoped === true,
+                isGlobal: args.isGlobal === true,
+            };
+        },
+    };
+
+    /**
+     * Resolves runtime context from hidden tool arguments.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function resolveWalletRuntimeContext(args) {
+        const runtimeContext = readToolRuntimeContextFromToolArgs(args);
+        const memoryContext = runtimeContext === null || runtimeContext === void 0 ? void 0 : runtimeContext.memory;
+        return {
+            enabled: (memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.enabled) === true,
+            userId: memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.userId,
+            username: memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.username,
+            agentId: memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.agentId,
+            agentName: memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.agentName,
+            isTeamConversation: (memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.isTeamConversation) === true,
+            isPrivateMode: (memoryContext === null || memoryContext === void 0 ? void 0 : memoryContext.isPrivateMode) === true,
+        };
+    }
+
+    /**
+     * Creates runtime wallet tool function implementations.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function createWalletToolFunctions() {
+        return {
+            async [WalletToolNames.retrieve](args) {
+                const runtimeContext = resolveWalletRuntimeContext(args);
+                const { adapter, disabledResult } = getWalletToolRuntimeAdapterOrDisabledResult('retrieve', runtimeContext);
+                if (!adapter || disabledResult) {
+                    return JSON.stringify(disabledResult);
+                }
+                try {
+                    const parsedArgs = parseWalletToolArgs.retrieve(args);
+                    const records = await adapter.retrieveWalletRecords(parsedArgs, runtimeContext);
+                    return JSON.stringify({
+                        action: 'retrieve',
+                        status: 'ok',
+                        query: parsedArgs.query,
+                        records,
+                    });
+                }
+                catch (error) {
+                    return JSON.stringify({
+                        action: 'retrieve',
+                        status: 'error',
+                        records: [],
+                        message: error instanceof Error ? error.message : String(error),
+                    });
+                }
+            },
+            async [WalletToolNames.store](args) {
+                const runtimeContext = resolveWalletRuntimeContext(args);
+                const { adapter, disabledResult } = getWalletToolRuntimeAdapterOrDisabledResult('store', runtimeContext);
+                if (!adapter || disabledResult) {
+                    return JSON.stringify(disabledResult);
+                }
+                try {
+                    const parsedArgs = parseWalletToolArgs.store(args);
+                    const record = await adapter.storeWalletRecord(parsedArgs, runtimeContext);
+                    return JSON.stringify({
+                        action: 'store',
+                        status: 'stored',
+                        record,
+                    });
+                }
+                catch (error) {
+                    return JSON.stringify({
+                        action: 'store',
+                        status: 'error',
+                        message: error instanceof Error ? error.message : String(error),
+                    });
+                }
+            },
+            async [WalletToolNames.update](args) {
+                const runtimeContext = resolveWalletRuntimeContext(args);
+                const { adapter, disabledResult } = getWalletToolRuntimeAdapterOrDisabledResult('update', runtimeContext);
+                if (!adapter || disabledResult) {
+                    return JSON.stringify(disabledResult);
+                }
+                try {
+                    const parsedArgs = parseWalletToolArgs.update(args);
+                    const record = await adapter.updateWalletRecord(parsedArgs, runtimeContext);
+                    return JSON.stringify({
+                        action: 'update',
+                        status: 'updated',
+                        record,
+                    });
+                }
+                catch (error) {
+                    return JSON.stringify({
+                        action: 'update',
+                        status: 'error',
+                        message: error instanceof Error ? error.message : String(error),
+                    });
+                }
+            },
+            async [WalletToolNames.delete](args) {
+                const runtimeContext = resolveWalletRuntimeContext(args);
+                const { adapter, disabledResult } = getWalletToolRuntimeAdapterOrDisabledResult('delete', runtimeContext);
+                if (!adapter || disabledResult) {
+                    return JSON.stringify(disabledResult);
+                }
+                try {
+                    const parsedArgs = parseWalletToolArgs.delete(args);
+                    const deleted = await adapter.deleteWalletRecord(parsedArgs, runtimeContext);
+                    return JSON.stringify({
+                        action: 'delete',
+                        status: 'deleted',
+                        walletId: deleted.id,
+                    });
+                }
+                catch (error) {
+                    return JSON.stringify({
+                        action: 'delete',
+                        status: 'error',
+                        message: error instanceof Error ? error.message : String(error),
+                    });
+                }
+            },
+            async [WalletToolNames.request](args) {
+                const runtimeContext = resolveWalletRuntimeContext(args);
+                const disabledMessage = resolveWalletDisabledMessage(runtimeContext);
+                if (disabledMessage) {
+                    return JSON.stringify({
+                        action: 'request',
+                        status: 'disabled',
+                        message: disabledMessage,
+                    });
+                }
+                const request = parseWalletToolArgs.request(args);
+                return JSON.stringify({
+                    action: 'request',
+                    status: 'requested',
+                    request,
+                    message: request.message ||
+                        `Request user to provide ${request.recordType} credentials for service "${request.service}".`,
+                });
+            },
+        };
+    }
+
+    /**
+     * Creates tool definitions required by WALLET commitment.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function createWalletTools(existingTools) {
+        const tools = [...(existingTools || [])];
+        addWalletToolIfMissing(tools, {
+            name: WalletToolNames.retrieve,
+            description: 'Retrieve wallet records relevant to the current task.',
+            parameters: {
+                type: 'object',
+                properties: {
+                    query: { type: 'string', description: 'Optional text query used to filter wallet records.' },
+                    recordType: {
+                        type: 'string',
+                        description: 'Optional record type filter (USERNAME_PASSWORD, SESSION_COOKIE, ACCESS_TOKEN).',
+                    },
+                    service: { type: 'string', description: 'Optional service filter, for example github.' },
+                    key: { type: 'string', description: 'Optional wallet key filter.' },
+                    limit: { type: 'integer', description: 'Optional maximum number of records (default 5, max 20).' },
+                },
+                required: [],
+            },
+        });
+        addWalletToolIfMissing(tools, {
+            name: WalletToolNames.store,
+            description: 'Store one wallet record.',
+            parameters: {
+                type: 'object',
+                properties: {
+                    recordType: {
+                        type: 'string',
+                        description: 'Record type: USERNAME_PASSWORD, SESSION_COOKIE, ACCESS_TOKEN.',
+                    },
+                    service: { type: 'string', description: 'Service identifier, for example github.' },
+                    key: { type: 'string', description: 'Logical credential key.' },
+                    username: { type: 'string', description: 'Username for USERNAME_PASSWORD.' },
+                    password: { type: 'string', description: 'Password for USERNAME_PASSWORD.' },
+                    secret: { type: 'string', description: 'Token/API key for ACCESS_TOKEN.' },
+                    cookies: { type: 'string', description: 'Cookie header/json for SESSION_COOKIE.' },
+                    isUserScoped: { type: 'boolean', description: 'Set true to scope this record to current user.' },
+                    isGlobal: { type: 'boolean', description: 'Set true to make this record global.' },
+                },
+                required: ['recordType', 'service'],
+            },
+        });
+        addWalletToolIfMissing(tools, {
+            name: WalletToolNames.update,
+            description: 'Update one existing wallet record.',
+            parameters: {
+                type: 'object',
+                properties: {
+                    walletId: { type: 'string', description: 'Wallet record id to update.' },
+                    recordType: {
+                        type: 'string',
+                        description: 'Record type: USERNAME_PASSWORD, SESSION_COOKIE, ACCESS_TOKEN.',
+                    },
+                    service: { type: 'string', description: 'Service identifier, for example github.' },
+                    key: { type: 'string', description: 'Logical credential key.' },
+                    username: { type: 'string', description: 'Username for USERNAME_PASSWORD.' },
+                    password: { type: 'string', description: 'Password for USERNAME_PASSWORD.' },
+                    secret: { type: 'string', description: 'Token/API key for ACCESS_TOKEN.' },
+                    cookies: { type: 'string', description: 'Cookie header/json for SESSION_COOKIE.' },
+                    isUserScoped: { type: 'boolean', description: 'Set true to scope this record to current user.' },
+                    isGlobal: { type: 'boolean', description: 'Set true to make this record global.' },
+                },
+                required: ['walletId', 'recordType', 'service'],
+            },
+        });
+        addWalletToolIfMissing(tools, {
+            name: WalletToolNames.delete,
+            description: 'Delete one wallet record.',
+            parameters: {
+                type: 'object',
+                properties: {
+                    walletId: { type: 'string', description: 'Wallet record id to delete.' },
+                },
+                required: ['walletId'],
+            },
+        });
+        addWalletToolIfMissing(tools, {
+            name: WalletToolNames.request,
+            description: 'Request missing credential from user via popup.',
+            parameters: {
+                type: 'object',
+                properties: {
+                    recordType: {
+                        type: 'string',
+                        description: 'Requested record type: USERNAME_PASSWORD, SESSION_COOKIE, ACCESS_TOKEN.',
+                    },
+                    service: { type: 'string', description: 'Service identifier.' },
+                    key: { type: 'string', description: 'Logical credential key.' },
+                    message: { type: 'string', description: 'Optional UI message for user.' },
+                    isUserScoped: {
+                        type: 'boolean',
+                        description: 'Set true when record should be scoped to current user.',
+                    },
+                    isGlobal: { type: 'boolean', description: 'Set true when record should be global.' },
+                },
+                required: [],
+            },
+        });
+        return tools;
+    }
+    /**
+     * Registers one wallet tool when missing in current tool list.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function addWalletToolIfMissing(tools, tool) {
+        if (!tools.some((existingTool) => existingTool.name === tool.name)) {
+            tools.push(tool);
+        }
+    }
+
+    /**
+     * Gets markdown documentation for WALLET commitment.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function getWalletCommitmentDocumentation(type) {
+        return spacetrim.spaceTrim(`
+        # ${type}
+
+        Enables private credential storage for tokens, usernames/passwords, and session cookies.
+    `);
+    }
+
+    /**
+     * Gets human-readable titles for WALLET tool functions.
+     *
+     * @private function of WalletCommitmentDefinition
+     */
+    function getWalletToolTitles() {
+        return {
+            [WalletToolNames.retrieve]: 'Wallet',
+            [WalletToolNames.store]: 'Store wallet record',
+            [WalletToolNames.update]: 'Update wallet record',
+            [WalletToolNames.delete]: 'Delete wallet record',
+            [WalletToolNames.request]: 'Request wallet record',
+        };
+    }
+
+    /**
+     * WALLET commitment definition.
+     *
+     * @private [🪔] Maybe export the commitments through some package
+     */
+    class WalletCommitmentDefinition extends BaseCommitmentDefinition {
+        constructor(type = 'WALLET') {
+            super(type);
+        }
+        get requiresContent() {
+            return false;
+        }
+        get description() {
+            return 'Enable persistent private credential storage (tokens, logins, cookies) scoped per agent or globally.';
+        }
+        get icon() {
+            return '👛';
+        }
+        get documentation() {
+            return getWalletCommitmentDocumentation(this.type);
+        }
+        applyToAgentModelRequirements(requirements, content) {
+            const extraInstructions = formatOptionalInstructionBlock('Wallet instructions', content);
+            return this.appendToSystemMessage({
+                ...requirements,
+                tools: createWalletTools(requirements.tools),
+                _metadata: {
+                    ...requirements._metadata,
+                    useWallet: content || true,
+                },
+            }, createWalletSystemMessage(extraInstructions));
+        }
+        getToolTitles() {
+            return getWalletToolTitles();
+        }
+        getToolFunctions() {
+            return createWalletToolFunctions();
+        }
+    }
+    // Note: [💞] Ignore a discrepancy between file name and entity name
+
     /**
      * `WRITING RULES` commitment definition.
      *
@@ -20916,6 +21632,8 @@
         new MessageSuffixCommitmentDefinition(),
         new MessageCommitmentDefinition('MESSAGE'),
         new MessageCommitmentDefinition('MESSAGES'),
+        new WalletCommitmentDefinition('WALLET'),
+        new WalletCommitmentDefinition('WALLETS'),
         new ScenarioCommitmentDefinition('SCENARIO'),
         new ScenarioCommitmentDefinition('SCENARIOS'),
         new DeleteCommitmentDefinition('DELETE'),
@@ -21585,7 +22303,6 @@
         if (isVoidPseudoAgentReference(reference)) {
             label = VOID_PSEUDO_AGENT_REFERENCE; // <- {Void} label
             iconName = 'ShieldAlert';
-            return null; // <- Note: Do not show `{Void}` in capabilities, it's only used for internal logic
         }
         return {
             type: 'inheritance',
@@ -23796,11 +24513,11 @@
      */
     const IMPORTANT_COMMITMENT_TYPE_SORT_ORDER = new Map([
         ['GOAL', 0],
-        ['GOALS', 1],
-        ['RULE', 2],
-        ['RULES', 3],
-        ['KNOWLEDGE', 4],
-        ['TEAM', 5],
+        ['RULE', 1],
+        ['KNOWLEDGE', 2],
+        ['TEAM', 3],
+        ['GOALS', 4],
+        ['RULES', 5],
     ]);
     /**
      * Sort rank used when unfinished, low-level, and deprecated commitments should be grouped last.
@@ -24315,6 +25032,16 @@
         const commitmentDefinitions = getAllCommitmentDefinitions();
         const commitmentTypes = [...new Set(commitmentDefinitions.map(({ type }) => type))];
         const commitmentDefinitionByType = new Map(commitmentDefinitions.map((definition) => [definition.type, definition]));
+        const completionCommitmentTypes = [...commitmentTypes].sort((leftType, rightType) => {
+            const leftDefinition = commitmentDefinitionByType.get(leftType);
+            const rightDefinition = commitmentDefinitionByType.get(rightType);
+            const leftRank = (leftDefinition === null || leftDefinition === void 0 ? void 0 : leftDefinition.isUnfinished) ? 1 : 0;
+            const rightRank = (rightDefinition === null || rightDefinition === void 0 ? void 0 : rightDefinition.isUnfinished) ? 1 : 0;
+            if (leftRank !== rightRank) {
+                return leftRank - rightRank;
+            }
+            return commitmentTypes.indexOf(leftType) - commitmentTypes.indexOf(rightType);
+        });
         const noteLikeCommitmentTypeSet = new Set([...TODO_COMMITMENT_TYPES, ...NOTE_COMMITMENT_TYPES]);
         const noteLikeCommitmentStates = createNoteLikeCommitmentStates(commitmentTypes);
         const executableCommitmentTypes = commitmentTypes.filter((type) => !noteLikeCommitmentTypeSet.has(type.toUpperCase()));
@@ -24371,7 +25098,7 @@
                     startColumn: word.startColumn,
                     endColumn: word.endColumn,
                 };
-                const suggestions = commitmentTypes.map((type, index) => {
+                const suggestions = completionCommitmentTypes.map((type, index) => {
                     var _a;
                     const definition = commitmentDefinitionByType.get(type);
                     const notice = definition ? getCommitmentNoticeMetadata(definition) : null;
@@ -25077,22 +25804,13 @@
         };
     }
     /**
-     * Handles file uploads and placeholder rendering inside `BookEditorMonaco`.
+     * Internal upload item state shared by Monaco upload helpers.
      *
      * @private function of BookEditorMonaco
      */
-    function useBookEditorMonacoUploads({ editor, monaco, onFileUpload }) {
+    function useBookEditorMonacoUploadItemsState() {
         const [uploadItems, setUploadItemsState] = react.useState([]);
         const uploadItemsRef = react.useRef([]);
-        const uploadFilesRef = react.useRef(new Map());
-        const uploadDecorationIdsRef = react.useRef(new Map());
-        const uploadControllersRef = react.useRef(new Map());
-        const uploadQueueTimerRef = react.useRef(null);
-        const editorUpdateTimerRef = react.useRef(null);
-        const progressUpdateTimerRef = react.useRef(null);
-        const pendingReplacementsRef = react.useRef([]);
-        const pendingProgressUpdatesRef = react.useRef(new Map());
-        const processUploadQueueRef = react.useRef(() => undefined);
         const setUploadItems = react.useCallback((updater) => {
             const next = updater(uploadItemsRef.current);
             uploadItemsRef.current = next;
@@ -25101,6 +25819,31 @@
         const updateUploadItem = react.useCallback((uploadId, createNextUploadItem) => {
             setUploadItems((currentUploadItems) => replaceUploadItemById(currentUploadItems, uploadId, createNextUploadItem));
         }, [setUploadItems]);
+        const uploadStats = react.useMemo(() => createUploadStats(uploadItems), [uploadItems]);
+        const activeUploadItems = react.useMemo(() => uploadItems.filter((uploadItem) => uploadItem.status !== 'completed'), [uploadItems]);
+        return {
+            uploadItems,
+            uploadItemsRef,
+            setUploadItems,
+            updateUploadItem,
+            uploadStats,
+            activeUploadItems,
+        };
+    }
+    /**
+     * Debounces upload progress updates before they hit React state.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function useBookEditorMonacoUploadProgressQueue({ setUploadItems }) {
+        const progressUpdateTimerRef = react.useRef(null);
+        const pendingProgressUpdatesRef = react.useRef(new Map());
+        const flushProgressUpdates = react.useCallback(() => {
+            progressUpdateTimerRef.current = null;
+            const progressUpdates = pendingProgressUpdatesRef.current;
+            pendingProgressUpdatesRef.current = new Map();
+            setUploadItems((currentUploadItems) => applyProgressUpdates(currentUploadItems, progressUpdates));
+        }, [setUploadItems]);
         const queueProgressUpdate = react.useCallback((uploadId, progress, loadedBytes, totalBytes) => {
             pendingProgressUpdatesRef.current.set(uploadId, {
                 progress,
@@ -25111,12 +25854,27 @@
                 return;
             }
             progressUpdateTimerRef.current = window.setTimeout(() => {
-                progressUpdateTimerRef.current = null;
-                const progressUpdates = pendingProgressUpdatesRef.current;
-                pendingProgressUpdatesRef.current = new Map();
-                setUploadItems((currentUploadItems) => applyProgressUpdates(currentUploadItems, progressUpdates));
+                flushProgressUpdates();
             }, BookEditorMonacoConstants.UPLOAD_PROGRESS_DEBOUNCE_MS);
-        }, [setUploadItems]);
+        }, [flushProgressUpdates]);
+        const clearProgressQueue = react.useCallback(() => {
+            clearScheduledTimer(progressUpdateTimerRef.current);
+            progressUpdateTimerRef.current = null;
+            pendingProgressUpdatesRef.current = new Map();
+        }, []);
+        return {
+            queueProgressUpdate,
+            clearProgressQueue,
+        };
+    }
+    /**
+     * Manages Monaco placeholder insertion and later replacement with uploaded URLs.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function useBookEditorMonacoUploadEditorSync({ editor, uploadFilesRef, uploadDecorationIdsRef, }) {
+        const editorUpdateTimerRef = react.useRef(null);
+        const pendingReplacementsRef = react.useRef([]);
         const flushEditorReplacements = react.useCallback(() => {
             if (!editor) {
                 return;
@@ -25150,23 +25908,20 @@
                 editor.deltaDecorations(decorationsToRemove, []);
             }
         }, [editor]);
+        const registerUploadPlaceholderResources = react.useCallback((placeholders, decorationIds) => {
+            placeholders.forEach((placeholder, index) => {
+                uploadFilesRef.current.set(placeholder.id, placeholder.file);
+                const decorationId = decorationIds[index];
+                if (decorationId) {
+                    uploadDecorationIdsRef.current.set(placeholder.id, decorationId);
+                }
+            });
+        }, []);
         const queueEditorReplacement = react.useCallback((uploadId, replacementText) => {
-            const decorationId = uploadDecorationIdsRef.current.get(uploadId);
-            if (!decorationId) {
+            const hasQueuedReplacement = queueEditorReplacementItem(uploadId, replacementText, uploadDecorationIdsRef, pendingReplacementsRef);
+            if (!hasQueuedReplacement) {
                 return;
             }
-            const pendingIndex = pendingReplacementsRef.current.findIndex((item) => item.uploadId === uploadId);
-            const nextReplacement = {
-                uploadId,
-                decorationId,
-                replacementText,
-            };
-            if (pendingIndex >= 0) {
-                pendingReplacementsRef.current[pendingIndex] = nextReplacement;
-            }
-            else {
-                pendingReplacementsRef.current.push(nextReplacement);
-            }
             if (editorUpdateTimerRef.current !== null) {
                 return;
             }
@@ -25174,16 +25929,81 @@
                 editorUpdateTimerRef.current = null;
                 flushEditorReplacements();
             }, BookEditorMonacoConstants.UPLOAD_EDIT_DEBOUNCE_MS);
-        }, [flushEditorReplacements]);
-        const registerUploadPlaceholderResources = react.useCallback((placeholders, decorationIds) => {
-            placeholders.forEach((placeholder, index) => {
-                uploadFilesRef.current.set(placeholder.id, placeholder.file);
-                const decorationId = decorationIds[index];
-                if (decorationId) {
-                    uploadDecorationIdsRef.current.set(placeholder.id, decorationId);
-                }
-            });
+        }, [flushEditorReplacements, uploadDecorationIdsRef]);
+        const clearEditorSync = react.useCallback(() => {
+            clearScheduledTimer(editorUpdateTimerRef.current);
+            editorUpdateTimerRef.current = null;
+            pendingReplacementsRef.current = [];
         }, []);
+        return {
+            registerUploadPlaceholderResources,
+            queueEditorReplacement,
+            clearEditorSync,
+        };
+    }
+    /**
+     * Enqueues replacement text for one upload placeholder.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function queueEditorReplacementItem(uploadId, replacementText, uploadDecorationIdsRef, pendingReplacementsRef) {
+        const decorationId = uploadDecorationIdsRef.current.get(uploadId);
+        if (!decorationId) {
+            return false;
+        }
+        const pendingIndex = pendingReplacementsRef.current.findIndex((item) => item.uploadId === uploadId);
+        const nextReplacement = {
+            uploadId,
+            decorationId,
+            replacementText,
+        };
+        if (pendingIndex >= 0) {
+            pendingReplacementsRef.current[pendingIndex] = nextReplacement;
+        }
+        else {
+            pendingReplacementsRef.current.push(nextReplacement);
+        }
+        return true;
+    }
+    /**
+     * Inserts Monaco placeholders and queues matching upload items.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function enqueueFilesForUpload({ editor, monaco, registerUploadPlaceholderResources, setUploadItems, }) {
+        return (files) => {
+            if (!editor || !monaco) {
+                return false;
+            }
+            const model = editor.getModel();
+            if (!model) {
+                return false;
+            }
+            const placeholders = createUploadPlaceholderEntries(files);
+            const insertPlan = createUploadPlaceholderInsertPlan(model, monaco, placeholders);
+            editor.executeEdits('upload-placeholders', [
+                {
+                    range: new monaco.Range(insertPlan.insertLine, insertPlan.insertColumn, insertPlan.insertLine, insertPlan.insertColumn),
+                    text: insertPlan.textToInsert,
+                    forceMoveMarkers: true,
+                },
+            ]);
+            const placeholderDecorations = createUploadPlaceholderDecorations(model, monaco, placeholders, insertPlan.insertStartOffset, insertPlan.prefixLength);
+            const decorationIds = editor.deltaDecorations([], placeholderDecorations);
+            registerUploadPlaceholderResources(placeholders, decorationIds);
+            setUploadItems((currentUploadItems) => [...currentUploadItems, ...createQueuedUploadItems(placeholders)]);
+            return true;
+        };
+    }
+    /**
+     * Manages upload concurrency, retries, pausing and completion side effects.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function useBookEditorMonacoUploadQueue({ onFileUpload, uploadItemsRef, uploadFilesRef, queueProgressUpdate, queueEditorReplacement, setUploadItems, updateUploadItem, }) {
+        const uploadControllersRef = react.useRef(new Map());
+        const uploadQueueTimerRef = react.useRef(null);
+        const processUploadQueueRef = react.useRef(() => undefined);
         const queueUploadProcessing = react.useCallback(() => {
             if (uploadQueueTimerRef.current !== null) {
                 return;
@@ -25296,6 +26116,8 @@
             onFileUpload,
             queueProgressUpdate,
             queueUploadProcessing,
+            uploadFilesRef,
+            uploadItemsRef,
         ]);
         const processUploadQueue = react.useCallback(() => {
             if (!onFileUpload) {
@@ -25308,34 +26130,45 @@
             queuedUploadIds.forEach((queuedUploadId) => {
                 void startUpload(queuedUploadId);
             });
-        }, [onFileUpload, startUpload]);
+        }, [onFileUpload, startUpload, uploadItemsRef]);
         processUploadQueueRef.current = processUploadQueue;
         const pauseUpload = react.useCallback((uploadId) => {
+            var _a;
             pauseQueuedUpload(uploadId);
-            const controller = uploadControllersRef.current.get(uploadId);
-            controller === null || controller === void 0 ? void 0 : controller.abort();
+            (_a = uploadControllersRef.current.get(uploadId)) === null || _a === void 0 ? void 0 : _a.abort();
         }, [pauseQueuedUpload]);
         const resumeUpload = react.useCallback((uploadId) => {
             resetUploadForRetry(uploadId);
             queueUploadProcessing();
         }, [queueUploadProcessing, resetUploadForRetry]);
-        react.useEffect(() => {
-            return () => {
-                clearScheduledTimer(uploadQueueTimerRef.current);
-                clearScheduledTimer(editorUpdateTimerRef.current);
-                clearScheduledTimer(progressUpdateTimerRef.current);
-                for (const controller of uploadControllersRef.current.values()) {
-                    controller.abort();
-                }
-                uploadControllersRef.current.clear();
-            };
+        const clearUploadQueue = react.useCallback(() => {
+            clearScheduledTimer(uploadQueueTimerRef.current);
+            uploadQueueTimerRef.current = null;
+            for (const controller of uploadControllersRef.current.values()) {
+                controller.abort();
+            }
+            uploadControllersRef.current.clear();
         }, []);
+        react.useEffect(() => clearUploadQueue, [clearUploadQueue]);
+        return {
+            pauseUpload,
+            resumeUpload,
+            queueUploadProcessing,
+            clearUploadQueue,
+        };
+    }
+    /**
+     * Clears upload UI state shortly after all uploads finish.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function useCompletedUploadsAutoClear({ uploadItems, uploadFilesRef, uploadDecorationIdsRef, setUploadItems, }) {
         react.useEffect(() => {
             if (uploadItems.length === 0) {
                 return;
             }
-            const hasActive = uploadItems.some((item) => item.status !== 'completed');
-            if (hasActive) {
+            const hasActiveUploads = uploadItems.some((item) => item.status !== 'completed');
+            if (hasActiveUploads) {
                 return;
             }
             const timer = window.setTimeout(() => {
@@ -25346,45 +26179,61 @@
             return () => {
                 clearTimeout(timer);
             };
-        }, [setUploadItems, uploadItems]);
-        const enqueueFilesForUpload = react.useCallback((files) => {
-            if (!editor || !monaco) {
-                return false;
-            }
-            const model = editor.getModel();
-            if (!model) {
-                return false;
-            }
-            const placeholders = createUploadPlaceholderEntries(files);
-            const insertPlan = createUploadPlaceholderInsertPlan(model, monaco, placeholders);
-            editor.executeEdits('upload-placeholders', [
-                {
-                    range: new monaco.Range(insertPlan.insertLine, insertPlan.insertColumn, insertPlan.insertLine, insertPlan.insertColumn),
-                    text: insertPlan.textToInsert,
-                    forceMoveMarkers: true,
-                },
-            ]);
-            const placeholderDecorations = createUploadPlaceholderDecorations(model, monaco, placeholders, insertPlan.insertStartOffset, insertPlan.prefixLength);
-            const decorationIds = editor.deltaDecorations([], placeholderDecorations);
-            registerUploadPlaceholderResources(placeholders, decorationIds);
-            setUploadItems((currentUploadItems) => [...currentUploadItems, ...createQueuedUploadItems(placeholders)]);
-            return true;
-        }, [editor, monaco, registerUploadPlaceholderResources, setUploadItems]);
+        }, [setUploadItems, uploadDecorationIdsRef, uploadFilesRef, uploadItems]);
+    }
+    /**
+     * Handles file uploads and placeholder rendering inside `BookEditorMonaco`.
+     *
+     * @private function of BookEditorMonaco
+     */
+    function useBookEditorMonacoUploads({ editor, monaco, onFileUpload }) {
+        const uploadFilesRef = react.useRef(new Map());
+        const uploadDecorationIdsRef = react.useRef(new Map());
+        const { uploadItems, uploadItemsRef, setUploadItems, updateUploadItem, uploadStats, activeUploadItems } = useBookEditorMonacoUploadItemsState();
+        const { queueProgressUpdate, clearProgressQueue } = useBookEditorMonacoUploadProgressQueue({ setUploadItems });
+        const { registerUploadPlaceholderResources, queueEditorReplacement, clearEditorSync } = useBookEditorMonacoUploadEditorSync({
+            editor,
+            uploadFilesRef,
+            uploadDecorationIdsRef,
+        });
+        const enqueueFiles = react.useMemo(() => enqueueFilesForUpload({
+            editor,
+            monaco,
+            registerUploadPlaceholderResources,
+            setUploadItems,
+        }), [editor, monaco, registerUploadPlaceholderResources, setUploadItems]);
+        const { pauseUpload, resumeUpload, queueUploadProcessing, clearUploadQueue } = useBookEditorMonacoUploadQueue({
+            onFileUpload,
+            uploadItemsRef,
+            uploadFilesRef,
+            queueProgressUpdate,
+            queueEditorReplacement,
+            setUploadItems,
+            updateUploadItem,
+        });
+        useCompletedUploadsAutoClear({
+            uploadItems,
+            uploadFilesRef,
+            uploadDecorationIdsRef,
+            setUploadItems,
+        });
+        react.useEffect(() => {
+            return () => {
+                clearEditorSync();
+                clearProgressQueue();
+                clearUploadQueue();
+            };
+        }, [clearEditorSync, clearProgressQueue, clearUploadQueue]);
         const handleFiles = react.useCallback(async (files) => {
-            if (!onFileUpload) {
+            if (!onFileUpload || files.length === 0) {
                 return;
             }
-            if (files.length === 0) {
-                return;
-            }
-            const hasQueuedUploads = enqueueFilesForUpload(files);
+            const hasQueuedUploads = enqueueFiles(files);
             if (!hasQueuedUploads) {
                 return;
             }
             queueUploadProcessing();
-        }, [enqueueFilesForUpload, onFileUpload, queueUploadProcessing]);
-        const uploadStats = react.useMemo(() => createUploadStats(uploadItems), [uploadItems]);
-        const activeUploadItems = react.useMemo(() => uploadItems.filter((uploadItem) => uploadItem.status !== 'completed'), [uploadItems]);
+        }, [enqueueFiles, onFileUpload, queueUploadProcessing]);
         return {
             activeUploadItems,
             uploadItems,
@@ -28360,7 +29209,7 @@
      *
      * @private function of `useChatInputAreaComposer`
      */
-    function resolveTextareaSelection(textareaElement, messageContent, selectionStart, selectionEnd) {
+    function resolveTextareaSelection$1(textareaElement, messageContent, selectionStart, selectionEnd) {
         var _a, _b;
         const resolvedSelectionStart = (_a = selectionStart !== null && selectionStart !== void 0 ? selectionStart : textareaElement.selectionStart) !== null && _a !== void 0 ? _a : messageContent.length;
         const resolvedSelectionEnd = (_b = selectionEnd !== null && selectionEnd !== void 0 ? selectionEnd : textareaElement.selectionEnd) !== null && _b !== void 0 ? _b : resolvedSelectionStart;
@@ -28418,13 +29267,21 @@
             areAttachmentSnapshotsEqual(snapshot.attachmentIds, uploadedFiles.map((uploadedFile) => uploadedFile.id)) &&
             getReplyingToMessageId(replyingToMessage) === snapshot.replyingToMessageId);
     }
+    /**
+     * Returns true when the composer contains text or attachments that can be sent.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function hasSendableComposerContent(messageContent, attachmentCount) {
+        return spacetrim.spaceTrim(messageContent) !== '' || attachmentCount > 0;
+    }
     /**
      * Returns true when the deferred Enter snapshot still contains something sendable.
      *
      * @private function of `useChatInputAreaComposer`
      */
     function hasPendingEnterIntentContent(snapshot) {
-        return spacetrim.spaceTrim(snapshot.value) !== '' || snapshot.attachmentIds.length > 0;
+        return hasSendableComposerContent(snapshot.value, snapshot.attachmentIds.length);
     }
     /**
      * Builds the attachment payload expected by `onMessage`.
@@ -28467,16 +29324,36 @@
         handleInsertNewline(snapshot.selectionStart, snapshot.selectionEnd);
     }
     /**
-     * Manages textarea state, send/newline behavior, and deferred Enter resolution for `<ChatInputArea/>`.
+     * Returns the required `onMessage` callback or throws when the composer is misconfigured.
      *
-     * @private function of `<ChatInputArea/>`
+     * @private function of `useChatInputAreaComposer`
      */
-    function useChatInputAreaComposer(props) {
-        const { onMessage, onChange, defaultMessage, enterBehavior, resolveEnterBehavior, isFocusedOnLoad, isMobile, uploadedFiles, uploadedFilesRef, clearUploadedFiles, replyingToMessage, onCancelReply, soundSystem, } = props;
-        const textareaRef = react.useRef(null);
+    function getRequiredOnMessage(onMessage) {
+        if (!onMessage) {
+            throw new Error(`Can not find onMessage callback`);
+        }
+        return onMessage;
+    }
+    /**
+     * Returns the active composer textarea or throws when the DOM node is missing.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function getRequiredTextareaElement(textareaRef) {
+        const textareaElement = textareaRef.current;
+        if (!textareaElement) {
+            throw new Error(`Can not find textarea`);
+        }
+        return textareaElement;
+    }
+    /**
+     * Manages controlled message text state and change propagation for the composer.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function useChatInputAreaMessageContentState({ defaultMessage, onChange }) {
         const [messageContent, setMessageContent] = react.useState(defaultMessage || '');
         const messageContentRef = react.useRef(messageContent);
-        const isResolvingEnterBehaviorRef = react.useRef(false);
         const applyMessageContent = react.useCallback((nextContent) => {
             messageContentRef.current = nextContent;
             setMessageContent(nextContent);
@@ -28487,6 +29364,22 @@
             messageContentRef.current = nextDefaultMessage;
             setMessageContent(nextDefaultMessage);
         }, [defaultMessage]);
+        const handleTextInputChange = react.useCallback((event) => {
+            applyMessageContent(event.target.value);
+        }, [applyMessageContent]);
+        return {
+            messageContent,
+            messageContentRef,
+            applyMessageContent,
+            handleTextInputChange,
+        };
+    }
+    /**
+     * Applies initial-focus behavior for the composer textarea.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function useChatInputAreaComposerFocus({ textareaRef, isFocusedOnLoad, isMobile, }) {
         react.useEffect(( /* Focus textarea on page load */) => {
             if (!textareaRef.current) {
                 return;
@@ -28495,16 +29388,20 @@
             if (shouldFocus) {
                 textareaRef.current.focus();
             }
-        }, [isFocusedOnLoad, isMobile]);
-        const handleTextInputChange = react.useCallback((event) => {
-            applyMessageContent(event.target.value);
-        }, [applyMessageContent]);
-        const handleInsertNewline = react.useCallback((selectionStart, selectionEnd) => {
+        }, [isFocusedOnLoad, isMobile, textareaRef]);
+    }
+    /**
+     * Creates the newline insertion action used by the composer Enter handling.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function useChatInputAreaNewlineHandler({ textareaRef, messageContentRef, applyMessageContent, }) {
+        return react.useCallback((selectionStart, selectionEnd) => {
             const textareaElement = textareaRef.current;
             if (!textareaElement) {
                 return;
             }
-            const resolvedSelection = resolveTextareaSelection(textareaElement, messageContentRef.current, selectionStart, selectionEnd);
+            const resolvedSelection = resolveTextareaSelection$1(textareaElement, messageContentRef.current, selectionStart, selectionEnd);
             const insertion = insertTextAtSelection({
                 currentValue: messageContentRef.current,
                 insertedText: '\n',
@@ -28513,20 +29410,22 @@
             });
             applyMessageContent(insertion.nextValue);
             focusTextareaCaret(textareaElement, insertion.caret);
-        }, [applyMessageContent]);
-        const handleSend = react.useCallback(async () => {
-            if (!onMessage) {
-                throw new Error(`Can not find onMessage callback`);
-            }
-            const textareaElement = textareaRef.current;
-            if (!textareaElement) {
-                throw new Error(`Can not find textarea`);
-            }
+        }, [applyMessageContent, messageContentRef, textareaRef]);
+    }
+    /**
+     * Creates the send action while keeping focus restoration and attachments in sync.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function useChatInputAreaSendAction({ onMessage, textareaRef, uploadedFiles, clearUploadedFiles, messageContentRef, applyMessageContent, replyingToMessage, onCancelReply, soundSystem, }) {
+        return react.useCallback(async () => {
+            const onMessageCallback = getRequiredOnMessage(onMessage);
+            const textareaElement = getRequiredTextareaElement(textareaRef);
             const wasTextareaFocused = document.activeElement === textareaElement;
             try {
                 const attachments = createMessageAttachments(uploadedFiles);
                 const contentToSend = messageContentRef.current;
-                if (spacetrim.spaceTrim(contentToSend) === '' && attachments.length === 0) {
+                if (!hasSendableComposerContent(contentToSend, attachments.length)) {
                     throw new Error(`You need to write some text or upload a file`);
                 }
                 if (soundSystem) {
@@ -28537,7 +29436,7 @@
                 if (wasTextareaFocused) {
                     textareaElement.focus();
                 }
-                await onMessage(contentToSend, attachments, replyingToMessage || null);
+                await onMessageCallback(contentToSend, attachments, replyingToMessage || null);
                 onCancelReply === null || onCancelReply === void 0 ? void 0 : onCancelReply();
             }
             catch (error) {
@@ -28550,12 +29449,22 @@
         }, [
             applyMessageContent,
             clearUploadedFiles,
+            messageContentRef,
             onCancelReply,
             onMessage,
             replyingToMessage,
             soundSystem,
+            textareaRef,
             uploadedFiles,
         ]);
+    }
+    /**
+     * Creates the keyboard handler that coordinates reply cancel, send, newline, and deferred Enter behavior.
+     *
+     * @private function of `useChatInputAreaComposer`
+     */
+    function useChatInputAreaEnterKeyHandler({ textareaRef, enterBehavior, resolveEnterBehavior, messageContentRef, uploadedFilesRef, replyingToMessage, onCancelReply, handleInsertNewline, handleSend, }) {
+        const isResolvingEnterBehaviorRef = react.useRef(false);
         const handleImmediateEnterAction = react.useCallback((isCtrlPressed) => {
             const resolvedAction = resolveChatEnterAction(enterBehavior || 'SEND', isCtrlPressed);
             if (resolvedAction === 'SEND') {
@@ -28590,30 +29499,78 @@
             }).finally(() => {
                 isResolvingEnterBehaviorRef.current = false;
             });
-        }, [handleInsertNewline, handleSend, replyingToMessage, uploadedFilesRef]);
-        const handleComposerKeyDown = react.useCallback((event) => {
-            if (event.key === 'Escape' && replyingToMessage && onCancelReply) {
-                event.preventDefault();
-                onCancelReply();
-                return;
+        }, [handleInsertNewline, handleSend, messageContentRef, replyingToMessage, textareaRef, uploadedFilesRef]);
+        const handleReplyCancelShortcut = react.useCallback((event) => {
+            if (event.key !== 'Escape' || !replyingToMessage || !onCancelReply) {
+                return false;
             }
+            event.preventDefault();
+            onCancelReply();
+            return true;
+        }, [onCancelReply, replyingToMessage]);
+        const handleComposerEnterKeyDown = react.useCallback((event) => {
             if (!isComposerEnterAction(event)) {
-                return;
+                return false;
             }
             event.preventDefault();
             if (shouldResolveDeferredEnterBehavior(enterBehavior, event.ctrlKey, resolveEnterBehavior)) {
                 handleDeferredEnterAction(resolveEnterBehavior);
-                return;
+                return true;
             }
             handleImmediateEnterAction(event.ctrlKey);
-        }, [
-            enterBehavior,
-            handleDeferredEnterAction,
-            handleImmediateEnterAction,
-            onCancelReply,
+            return true;
+        }, [enterBehavior, handleDeferredEnterAction, handleImmediateEnterAction, resolveEnterBehavior]);
+        return react.useCallback((event) => {
+            if (handleReplyCancelShortcut(event)) {
+                return;
+            }
+            handleComposerEnterKeyDown(event);
+        }, [handleComposerEnterKeyDown, handleReplyCancelShortcut]);
+    }
+    /**
+     * Manages textarea state, send/newline behavior, and deferred Enter resolution for `<ChatInputArea/>`.
+     *
+     * @private function of `<ChatInputArea/>`
+     */
+    function useChatInputAreaComposer(props) {
+        const { onMessage, onChange, defaultMessage, enterBehavior, resolveEnterBehavior, isFocusedOnLoad, isMobile, uploadedFiles, uploadedFilesRef, clearUploadedFiles, replyingToMessage, onCancelReply, soundSystem, } = props;
+        const textareaRef = react.useRef(null);
+        const { messageContent, messageContentRef, applyMessageContent, handleTextInputChange } = useChatInputAreaMessageContentState({
+            defaultMessage,
+            onChange,
+        });
+        useChatInputAreaComposerFocus({
+            textareaRef,
+            isFocusedOnLoad,
+            isMobile,
+        });
+        const handleInsertNewline = useChatInputAreaNewlineHandler({
+            textareaRef,
+            messageContentRef,
+            applyMessageContent,
+        });
+        const handleSend = useChatInputAreaSendAction({
+            onMessage,
+            textareaRef,
+            uploadedFiles,
+            clearUploadedFiles,
+            messageContentRef,
+            applyMessageContent,
             replyingToMessage,
+            onCancelReply,
+            soundSystem,
+        });
+        const handleComposerKeyDown = useChatInputAreaEnterKeyHandler({
+            textareaRef,
+            enterBehavior,
             resolveEnterBehavior,
-        ]);
+            messageContentRef,
+            uploadedFilesRef,
+            replyingToMessage,
+            onCancelReply,
+            handleInsertNewline,
+            handleSend,
+        });
         return {
             textareaRef,
             messageContent,
@@ -29129,33 +30086,122 @@
         return `${Date.now()}-${Math.random().toString(36).slice(2)}`;
     }
     /**
-     * Manages speech-recognition state, transcript refinement, and correction UI.
+     * Resolves the current textarea selection with a stable fallback to the message length.
      *
-     * @private function of `<ChatInputArea/>`
+     * @private function of `useChatInputAreaDictation`
      */
-    function useChatInputAreaDictation({ speechRecognition, speechRecognitionLanguage, textareaRef, messageContentRef, applyMessageContent, }) {
-        const pendingStopFallbackRef = react.useRef(null);
-        const replaceSelectionOnNextFinalRef = react.useRef(false);
-        const [dictationUiState, setDictationUiState] = react.useState('idle');
-        const [dictationInterimText, setDictationInterimText] = react.useState('');
-        const [dictationError, setDictationError] = react.useState(null);
-        const [dictationLastFinalChunk, setDictationLastFinalChunk] = react.useState('');
-        const [dictationEditableChunk, setDictationEditableChunk] = react.useState('');
-        const [dictationChunks, setDictationChunks] = react.useState([]);
-        const [isDictationPanelExpanded, setIsDictationPanelExpanded] = react.useState(false);
-        const { dictationSettings, setDictationSettings, dictationDictionary, setDictationDictionary } = useChatInputAreaDictationPersistence();
-        const { speechRecognitionUiDescriptor, resolvedSpeechRecognitionLanguage, isBrowserSpeechFallbackSupported, microphoneSettingsUrl, } = useChatInputAreaDictationSupport({
-            dictationUiState,
-            speechRecognitionLanguage,
-        });
-        const clearPendingStopFallback = react.useCallback(() => {
-            if (!pendingStopFallbackRef.current) {
-                return;
-            }
-            clearTimeout(pendingStopFallbackRef.current);
-            pendingStopFallbackRef.current = null;
-        }, []);
-        const focusTextareaSelection = react.useCallback((selectionStart, selectionEnd) => {
+    function resolveTextareaSelection(textareaElement, fallbackLength) {
+        var _a, _b;
+        const selectionStart = (_a = textareaElement.selectionStart) !== null && _a !== void 0 ? _a : fallbackLength;
+        const selectionEnd = (_b = textareaElement.selectionEnd) !== null && _b !== void 0 ? _b : selectionStart;
+        return {
+            selectionStart,
+            selectionEnd,
+        };
+    }
+    /**
+     * Creates the persisted metadata entry for one finalized dictated chunk.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function createFinalizedDictationChunk(params) {
+        const { beforeValue, finalText, start } = params;
+        return {
+            id: createDictationChunkId(),
+            beforeValue,
+            finalText,
+            start,
+        };
+    }
+    /**
+     * Clears the pending stop fallback timeout when one exists.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function clearPendingStopFallbackTimeout(pendingStopFallbackRef) {
+        if (!pendingStopFallbackRef.current) {
+            return;
+        }
+        clearTimeout(pendingStopFallbackRef.current);
+        pendingStopFallbackRef.current = null;
+    }
+    /**
+     * Captures whether the next finalized chunk should replace the current selection.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function captureSelectionReplacementIntent(textareaRef, replaceSelectionOnNextFinalRef) {
+        const textarea = textareaRef.current;
+        if (!textarea) {
+            return;
+        }
+        const { selectionStart, selectionEnd } = resolveTextareaSelection(textarea, 0);
+        replaceSelectionOnNextFinalRef.current = selectionStart !== selectionEnd;
+    }
+    /**
+     * Produces the corrected chunk value only when a real correction should be applied.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function resolveCorrectedDictationChunk(dictationEditableChunk, dictationLastFinalChunk) {
+        const correctedChunk = normalizeDictationWhitespace(dictationEditableChunk);
+        if (!correctedChunk || !dictationLastFinalChunk || correctedChunk === dictationLastFinalChunk) {
+            return null;
+        }
+        return correctedChunk;
+    }
+    /**
+     * Replaces the last tracked chunk text inside the tracked chunk list.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function replaceLastDictationChunk(previousChunks, correctedChunk) {
+        if (previousChunks.length === 0) {
+            return previousChunks;
+        }
+        const nextChunks = [...previousChunks];
+        const lastChunk = nextChunks[nextChunks.length - 1];
+        if (!lastChunk) {
+            return previousChunks;
+        }
+        nextChunks[nextChunks.length - 1] = {
+            ...lastChunk,
+            finalText: correctedChunk,
+        };
+        return nextChunks;
+    }
+    /**
+     * Opens browser microphone settings in a new tab when a settings URL is available.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function openBrowserSettings(microphoneSettingsUrl) {
+        if (!microphoneSettingsUrl) {
+            return;
+        }
+        window.open(microphoneSettingsUrl, '_blank', 'noopener,noreferrer');
+    }
+    /**
+     * Resolves whether the dictation panel should be visible for the current state snapshot.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function resolveShouldShowDictationPanel(params) {
+        const { speechRecognition, isDictationPanelExpanded, dictationUiState, dictationInterimText, dictationError, dictationLastFinalChunk, } = params;
+        return Boolean(speechRecognition &&
+            (isDictationPanelExpanded ||
+                dictationUiState !== 'idle' ||
+                Boolean(dictationInterimText) ||
+                Boolean(dictationError) ||
+                Boolean(dictationLastFinalChunk)));
+    }
+    /**
+     * Focuses the textarea and restores a given selection range after programmatic edits.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useTextareaSelectionFocus(textareaRef) {
+        return react.useCallback((selectionStart, selectionEnd) => {
             requestAnimationFrame(() => {
                 const textarea = textareaRef.current;
                 if (!textarea) {
@@ -29165,8 +30211,15 @@
                 textarea.setSelectionRange(selectionStart, selectionEnd);
             });
         }, [textareaRef]);
-        const handleDictationFinalResult = react.useCallback((rawText) => {
-            var _a, _b;
+    }
+    /**
+     * Builds the final-result handler that refines text, inserts it, and exposes it for correction.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useChatInputAreaDictationFinalResultHandler({ textareaRef, messageContentRef, applyMessageContent, dictationSettings, dictationDictionary, replaceSelectionOnNextFinalRef, focusTextareaSelection, state, }) {
+        const { setDictationUiState, setDictationInterimText, setDictationError, setDictationLastFinalChunk, setDictationEditableChunk, setDictationChunks, setIsDictationPanelExpanded, } = state;
+        return react.useCallback((rawText) => {
             const textarea = textareaRef.current;
             if (!textarea) {
                 return;
@@ -29176,8 +30229,7 @@
             if (!refinedText) {
                 return;
             }
-            const selectionStart = (_a = textarea.selectionStart) !== null && _a !== void 0 ? _a : previousMessageContent.length;
-            const selectionEnd = (_b = textarea.selectionEnd) !== null && _b !== void 0 ? _b : selectionStart;
+            const { selectionStart, selectionEnd } = resolveTextareaSelection(textarea, previousMessageContent.length);
             const insertion = insertDictationChunk({
                 currentValue: previousMessageContent,
                 dictatedText: refinedText,
@@ -29192,12 +30244,11 @@
             applyMessageContent(insertion.nextValue);
             setDictationChunks((previousChunks) => [
                 ...previousChunks,
-                {
-                    id: createDictationChunkId(),
+                createFinalizedDictationChunk({
                     beforeValue: previousMessageContent,
                     finalText: refinedText,
                     start: insertion.start,
-                },
+                }),
             ]);
             setDictationLastFinalChunk(refinedText);
             setDictationEditableChunk(refinedText);
@@ -29209,9 +30260,25 @@
             dictationSettings,
             focusTextareaSelection,
             messageContentRef,
+            replaceSelectionOnNextFinalRef,
+            setDictationChunks,
+            setDictationEditableChunk,
+            setDictationError,
+            setDictationInterimText,
+            setDictationLastFinalChunk,
+            setDictationUiState,
+            setIsDictationPanelExpanded,
             textareaRef,
         ]);
-        const handleSpeechRecognitionEvent = react.useCallback((event) => {
+    }
+    /**
+     * Builds the event handler that translates speech-recognition events into dictation UI updates.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useChatInputAreaDictationSpeechRecognitionEventHandler({ clearPendingStopFallback, handleDictationFinalResult, state, }) {
+        const { setDictationUiState, setDictationInterimText, setDictationError, setIsDictationPanelExpanded } = state;
+        return react.useCallback((event) => {
             switch (event.type) {
                 case 'START':
                     clearPendingStopFallback();
@@ -29245,7 +30312,21 @@
                     setDictationInterimText('');
                     return;
             }
-        }, [clearPendingStopFallback, handleDictationFinalResult]);
+        }, [
+            clearPendingStopFallback,
+            handleDictationFinalResult,
+            setDictationError,
+            setDictationInterimText,
+            setDictationUiState,
+            setIsDictationPanelExpanded,
+        ]);
+    }
+    /**
+     * Wires the speech-recognition subscription and shutdown cleanup for dictation.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useChatInputAreaDictationSpeechRecognitionLifecycle({ speechRecognition, clearPendingStopFallback, handleSpeechRecognitionEvent, }) {
         react.useEffect(() => {
             if (!speechRecognition) {
                 return;
@@ -29262,26 +30343,37 @@
                 speechRecognition === null || speechRecognition === void 0 ? void 0 : speechRecognition.$stop();
             };
         }, [clearPendingStopFallback, speechRecognition]);
+    }
+    /**
+     * Builds start/stop/toggle handlers for the speech-recognition session.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useChatInputAreaDictationVoiceInputControls({ speechRecognition, textareaRef, resolvedSpeechRecognitionLanguage, whisperMode, pendingStopFallbackRef, replaceSelectionOnNextFinalRef, clearPendingStopFallback, state, }) {
+        const { dictationUiState, setDictationUiState, setDictationInterimText, setDictationError } = state;
         const startVoiceInput = react.useCallback(() => {
-            var _a, _b;
             if (!speechRecognition) {
                 return;
             }
-            const textarea = textareaRef.current;
-            if (textarea) {
-                const selectionStart = (_a = textarea.selectionStart) !== null && _a !== void 0 ? _a : 0;
-                const selectionEnd = (_b = textarea.selectionEnd) !== null && _b !== void 0 ? _b : selectionStart;
-                replaceSelectionOnNextFinalRef.current = selectionStart !== selectionEnd;
-            }
+            captureSelectionReplacementIntent(textareaRef, replaceSelectionOnNextFinalRef);
             setDictationError(null);
             setDictationInterimText('');
             setDictationUiState('listening');
             speechRecognition.$start({
                 language: resolvedSpeechRecognitionLanguage,
                 interimResults: true,
-                whisperMode: dictationSettings.whisperMode,
+                whisperMode,
             });
-        }, [dictationSettings.whisperMode, resolvedSpeechRecognitionLanguage, speechRecognition, textareaRef]);
+        }, [
+            replaceSelectionOnNextFinalRef,
+            resolvedSpeechRecognitionLanguage,
+            setDictationError,
+            setDictationInterimText,
+            setDictationUiState,
+            speechRecognition,
+            textareaRef,
+            whisperMode,
+        ]);
         const stopVoiceInput = react.useCallback(() => {
             if (!speechRecognition) {
                 return;
@@ -29293,7 +30385,13 @@
                 setDictationUiState('idle');
                 setDictationInterimText('');
             }, STOP_LISTENING_FALLBACK_TIMEOUT_MS);
-        }, [clearPendingStopFallback, speechRecognition]);
+        }, [
+            clearPendingStopFallback,
+            pendingStopFallbackRef,
+            setDictationInterimText,
+            setDictationUiState,
+            speechRecognition,
+        ]);
         const handleToggleVoiceInput = react.useCallback(() => {
             if (!speechRecognition) {
                 return;
@@ -29304,6 +30402,22 @@
             }
             startVoiceInput();
         }, [dictationUiState, speechRecognition, startVoiceInput, stopVoiceInput]);
+        const handleRetryPermissionRequest = react.useCallback(() => {
+            setDictationError(null);
+            setDictationUiState('idle');
+            handleToggleVoiceInput();
+        }, [handleToggleVoiceInput, setDictationError, setDictationUiState]);
+        return {
+            handleToggleVoiceInput,
+            handleRetryPermissionRequest,
+        };
+    }
+    /**
+     * Builds the correction and backtrack handlers for the latest finalized chunk.
+     *
+     * @private function of `useChatInputAreaDictation`
+     */
+    function useChatInputAreaDictationCorrectionHandlers({ dictationChunks, dictationLastFinalChunk, dictationEditableChunk, dictationDictionary, messageContentRef, applyMessageContent, focusTextareaSelection, setDictationChunks, setDictationLastFinalChunk, setDictationEditableChunk, setDictationDictionary, }) {
         const handleBacktrackLastChunk = react.useCallback(() => {
             var _a;
             const previousChunks = [...dictationChunks];
@@ -29317,50 +30431,123 @@
             setDictationLastFinalChunk(previousFinalChunk);
             setDictationEditableChunk(previousFinalChunk);
             focusTextareaSelection(lastChunk.start, lastChunk.start);
-        }, [applyMessageContent, dictationChunks, focusTextareaSelection]);
+        }, [
+            applyMessageContent,
+            dictationChunks,
+            focusTextareaSelection,
+            setDictationChunks,
+            setDictationEditableChunk,
+            setDictationLastFinalChunk,
+        ]);
         const handleApplyCorrection = react.useCallback(() => {
-            const correctedChunk = normalizeDictationWhitespace(dictationEditableChunk);
-            const previousChunk = dictationLastFinalChunk;
-            if (!correctedChunk || !previousChunk || correctedChunk === previousChunk) {
+            const correctedChunk = resolveCorrectedDictationChunk(dictationEditableChunk, dictationLastFinalChunk);
+            if (!correctedChunk) {
                 return;
             }
-            const nextMessageContent = replaceLastOccurrence(messageContentRef.current, previousChunk, correctedChunk);
+            const nextMessageContent = replaceLastOccurrence(messageContentRef.current, dictationLastFinalChunk, correctedChunk);
             applyMessageContent(nextMessageContent);
             setDictationLastFinalChunk(correctedChunk);
-            setDictationChunks((previousChunks) => {
-                if (previousChunks.length === 0) {
-                    return previousChunks;
-                }
-                const nextChunks = [...previousChunks];
-                const lastChunk = nextChunks[nextChunks.length - 1];
-                if (!lastChunk) {
-                    return previousChunks;
-                }
-                nextChunks[nextChunks.length - 1] = {
-                    ...lastChunk,
-                    finalText: correctedChunk,
-                };
-                return nextChunks;
-            });
-            setDictationDictionary(learnDictationDictionary(previousChunk, correctedChunk, dictationDictionary));
+            setDictationChunks((previousChunks) => replaceLastDictationChunk(previousChunks, correctedChunk));
+            setDictationDictionary(learnDictationDictionary(dictationLastFinalChunk, correctedChunk, dictationDictionary));
         }, [
             applyMessageContent,
             dictationDictionary,
             dictationEditableChunk,
             dictationLastFinalChunk,
             messageContentRef,
+            setDictationChunks,
             setDictationDictionary,
+            setDictationLastFinalChunk,
         ]);
-        const handleRetryPermissionRequest = react.useCallback(() => {
-            setDictationError(null);
-            setDictationUiState('idle');
-            handleToggleVoiceInput();
-        }, [handleToggleVoiceInput]);
+        return {
+            handleBacktrackLastChunk,
+            handleApplyCorrection,
+        };
+    }
+    /**
+     * Manages speech-recognition state, transcript refinement, and correction UI.
+     *
+     * @private function of `<ChatInputArea/>`
+     */
+    function useChatInputAreaDictation({ speechRecognition, speechRecognitionLanguage, textareaRef, messageContentRef, applyMessageContent, }) {
+        const pendingStopFallbackRef = react.useRef(null);
+        const replaceSelectionOnNextFinalRef = react.useRef(false);
+        const [dictationUiState, setDictationUiState] = react.useState('idle');
+        const [dictationInterimText, setDictationInterimText] = react.useState('');
+        const [dictationError, setDictationError] = react.useState(null);
+        const [dictationLastFinalChunk, setDictationLastFinalChunk] = react.useState('');
+        const [dictationEditableChunk, setDictationEditableChunk] = react.useState('');
+        const [dictationChunks, setDictationChunks] = react.useState([]);
+        const [isDictationPanelExpanded, setIsDictationPanelExpanded] = react.useState(false);
+        const { dictationSettings, setDictationSettings, dictationDictionary, setDictationDictionary } = useChatInputAreaDictationPersistence();
+        const { speechRecognitionUiDescriptor, resolvedSpeechRecognitionLanguage, isBrowserSpeechFallbackSupported, microphoneSettingsUrl, } = useChatInputAreaDictationSupport({
+            dictationUiState,
+            speechRecognitionLanguage,
+        });
+        const dictationState = {
+            dictationUiState,
+            setDictationUiState,
+            setDictationInterimText,
+            setDictationError,
+            setDictationLastFinalChunk,
+            setDictationEditableChunk,
+            setDictationChunks,
+            setIsDictationPanelExpanded,
+        };
+        const clearPendingStopFallback = react.useCallback(() => {
+            clearPendingStopFallbackTimeout(pendingStopFallbackRef);
+        }, []);
+        const focusTextareaSelection = useTextareaSelectionFocus(textareaRef);
+        const handleDictationFinalResult = useChatInputAreaDictationFinalResultHandler({
+            textareaRef,
+            messageContentRef,
+            applyMessageContent,
+            dictationSettings,
+            dictationDictionary,
+            replaceSelectionOnNextFinalRef,
+            focusTextareaSelection,
+            state: dictationState,
+        });
+        const handleSpeechRecognitionEvent = useChatInputAreaDictationSpeechRecognitionEventHandler({
+            clearPendingStopFallback,
+            handleDictationFinalResult,
+            state: dictationState,
+        });
+        useChatInputAreaDictationSpeechRecognitionLifecycle({
+            speechRecognition,
+            clearPendingStopFallback,
+            handleSpeechRecognitionEvent,
+        });
+        const { handleToggleVoiceInput, handleRetryPermissionRequest } = useChatInputAreaDictationVoiceInputControls({
+            speechRecognition,
+            textareaRef,
+            resolvedSpeechRecognitionLanguage,
+            whisperMode: dictationSettings.whisperMode,
+            pendingStopFallbackRef,
+            replaceSelectionOnNextFinalRef,
+            clearPendingStopFallback,
+            state: {
+                dictationUiState,
+                setDictationUiState,
+                setDictationInterimText,
+                setDictationError,
+            },
+        });
+        const { handleBacktrackLastChunk, handleApplyCorrection } = useChatInputAreaDictationCorrectionHandlers({
+            dictationChunks,
+            dictationLastFinalChunk,
+            dictationEditableChunk,
+            dictationDictionary,
+            messageContentRef,
+            applyMessageContent,
+            focusTextareaSelection,
+            setDictationChunks,
+            setDictationLastFinalChunk,
+            setDictationEditableChunk,
+            setDictationDictionary,
+        });
         const handleOpenBrowserSettings = react.useCallback(() => {
-            if (!microphoneSettingsUrl) {
-                return;
-            }
-            window.open(microphoneSettingsUrl, '_blank', 'noopener,noreferrer');
+            openBrowserSettings(microphoneSettingsUrl);
         }, [microphoneSettingsUrl]);
         const toggleDictationPanel = react.useCallback(() => {
             setIsDictationPanelExpanded((value) => !value);
@@ -29374,12 +30561,14 @@
                 [settingName]: checked,
             }));
         }, [setDictationSettings]);
-        const shouldShowDictationPanel = Boolean(speechRecognition &&
-            (isDictationPanelExpanded ||
-                dictationUiState !== 'idle' ||
-                Boolean(dictationInterimText) ||
-                Boolean(dictationError) ||
-                Boolean(dictationLastFinalChunk)));
+        const shouldShowDictationPanel = resolveShouldShowDictationPanel({
+            speechRecognition,
+            isDictationPanelExpanded,
+            dictationUiState,
+            dictationInterimText,
+            dictationError,
+            dictationLastFinalChunk,
+        });
         return {
             speechRecognitionUiDescriptor,
             shouldShowDictationPanel,
@@ -29404,13 +30593,206 @@
         };
     }
 
+    /**
+     * Creates the shared color styles used by the composer.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function createChatInputAreaColorModel(participants, buttonColor) {
+        var _a;
+        const myColor = ((_a = participants.find((participant) => participant.isMe)) === null || _a === void 0 ? void 0 : _a.color) || USER_CHAT_COLOR;
+        const inputBgColor = Color.from(myColor).then(lighten(0.4)).then(grayscale(0.7));
+        const inputTextColor = inputBgColor.then(textColor);
+        return {
+            inputContainerStyle: {
+                '--chat-placeholder-color': '#fff',
+                '--input-bg-color': inputBgColor.toHex(),
+                '--input-text-color': inputTextColor.toHex(),
+                '--brand-color': buttonColor.toHex(),
+            },
+            primaryButtonStyle: {
+                backgroundColor: buttonColor.toHex(),
+                color: buttonColor.then(textColor).toHex(),
+            },
+        };
+    }
+    /**
+     * Builds the reply preview view model when the composer is replying to a message.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function createChatInputAreaReplyPreviewModel(params) {
+        const { replyingToMessage, participants, chatUiTranslations, onCancelReply } = params;
+        if (!replyingToMessage) {
+            return null;
+        }
+        const previewText = resolveChatMessageReplyPreviewText(replyingToMessage, {
+            maxLength: 180,
+            emptyLabel: 'Original message',
+        });
+        const senderLabel = resolveChatMessageReplySenderLabel({
+            sender: replyingToMessage.sender,
+            participants,
+        });
+        if (!previewText || !senderLabel) {
+            return null;
+        }
+        return {
+            label: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.replyingToLabel) || 'Replying to',
+            senderLabel,
+            previewText,
+            dismissLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.cancelReplyLabel) || 'Cancel reply',
+            onDismiss: onCancelReply || undefined,
+        };
+    }
+    /**
+     * Adds drag-and-drop handlers only when uploads are enabled.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function createChatInputAreaRootProps(params) {
+        const { onFileUpload, handleDrop, handleDragOver, handleDragLeave } = params;
+        if (!onFileUpload) {
+            return {};
+        }
+        return {
+            onDrop: handleDrop,
+            onDragOver: handleDragOver,
+            onDragLeave: handleDragLeave,
+        };
+    }
+    /**
+     * Formats uploaded file sizes for the preview chips.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function formatUploadedFileSizeInKilobytes(fileSizeInBytes) {
+        return `${(fileSizeInBytes / 1024).toFixed(1)} KB`;
+    }
+    /**
+     * Renders the optional reply preview section.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaReplyPreviewSection({ replyPreview }) {
+        if (!replyPreview) {
+            return null;
+        }
+        return (jsxRuntime.jsx(ChatReplyPreview, { label: replyPreview.label, senderLabel: replyPreview.senderLabel, previewText: replyPreview.previewText, className: styles$5.replyComposerPreview, dismissLabel: replyPreview.dismissLabel, onDismiss: replyPreview.onDismiss }));
+    }
+    /**
+     * Renders uploaded file previews above the composer.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaUploadedFilesSection(props) {
+        const { uploadedFiles, removeUploadedFile } = props;
+        if (uploadedFiles.length === 0) {
+            return null;
+        }
+        return (jsxRuntime.jsx("div", { className: styles$5.filePreviewContainer, children: uploadedFiles.map((uploadedFile) => (jsxRuntime.jsxs("div", { className: styles$5.filePreview, children: [jsxRuntime.jsx("div", { className: styles$5.fileIcon, children: "\uD83D\uDCCE" }), jsxRuntime.jsxs("div", { className: styles$5.fileInfo, children: [jsxRuntime.jsx("div", { className: styles$5.fileName, children: uploadedFile.file.name }), jsxRuntime.jsx("div", { className: styles$5.fileSize, children: formatUploadedFileSizeInKilobytes(uploadedFile.file.size) })] }), jsxRuntime.jsx("button", { className: styles$5.removeFileButton, onClick: () => removeUploadedFile(uploadedFile.id), title: "Remove file", children: jsxRuntime.jsx(CloseIcon, {}) })] }, uploadedFile.id))) }));
+    }
+    /**
+     * Renders the hidden file input and attachment trigger when uploads are enabled.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaAttachmentButton(props) {
+        const { onFileUpload, fileInputRef, handleFileInputChange, onButtonClick, openFilePicker, isUploading, primaryButtonStyle, } = props;
+        if (!onFileUpload) {
+            return null;
+        }
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", multiple: true, style: { display: 'none' }, onChange: handleFileInputChange }), jsxRuntime.jsx("button", { type: "button", style: primaryButtonStyle, className: classNames(styles$5.attachmentButton, chatCssClassNames.inputAttachmentButton), onClick: onButtonClick(openFilePicker), disabled: isUploading, title: "Attach file", children: jsxRuntime.jsx(AttachmentIcon, { size: 20 }) })] }));
+    }
+    /**
+     * Creates the voice button colors from the current dictation state.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function createVoiceButtonStyle(params) {
+        const { buttonColor, speechRecognitionUiDescriptor } = params;
+        if (speechRecognitionUiDescriptor.isButtonActive) {
+            return {
+                backgroundColor: Color.from('#ff4444').toHex(),
+                color: Color.from('#ffffff').toHex(),
+            };
+        }
+        return {
+            backgroundColor: buttonColor.toHex(),
+            color: buttonColor.then(textColor).toHex(),
+        };
+    }
+    /**
+     * Renders the voice input trigger when speech recognition is available.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaVoiceButton(props) {
+        const { speechRecognition, isVoiceCalling, buttonColor, speechRecognitionUiDescriptor, onButtonClick, handleToggleVoiceInput, } = props;
+        if (!speechRecognition) {
+            return null;
+        }
+        return (jsxRuntime.jsx("button", { "data-button-type": "voice", disabled: speechRecognitionUiDescriptor.isButtonDisabled, style: createVoiceButtonStyle({
+                buttonColor,
+                speechRecognitionUiDescriptor,
+            }), className: classNames(styles$5.voiceButton, chatCssClassNames.inputVoiceButton, (isVoiceCalling || speechRecognitionUiDescriptor.isButtonActive) && styles$5.voiceButtonActive), onClick: onButtonClick((event) => {
+                event.preventDefault();
+                handleToggleVoiceInput();
+            }), title: speechRecognitionUiDescriptor.buttonTitle, "aria-label": speechRecognitionUiDescriptor.buttonTitle, children: jsxRuntime.jsx(MicIcon, { size: 25 }) }));
+    }
+    /**
+     * Renders the composer send button.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaSendButton(props) {
+        const { primaryButtonStyle, onButtonClick, handleSend } = props;
+        return (jsxRuntime.jsx("button", { "data-button-type": "call-to-action", className: chatCssClassNames.inputSendButton, style: primaryButtonStyle, onClick: onButtonClick((event) => {
+                event.preventDefault();
+                /* not await */ handleSend();
+            }), children: jsxRuntime.jsx(SendIcon, { size: 25 }) }));
+    }
+    /**
+     * Renders the optional dictation panel below the composer.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaDictationPanelSection(props) {
+        const { speechRecognition } = props;
+        if (!speechRecognition) {
+            return null;
+        }
+        return (jsxRuntime.jsx(ChatInputAreaDictationPanel, { bubbleText: props.speechRecognitionUiDescriptor.bubbleText, bubbleTone: props.speechRecognitionUiDescriptor.bubbleTone, shouldShowPanel: props.shouldShowDictationPanel, isExpanded: props.isDictationPanelExpanded, interimText: props.dictationInterimText, error: props.dictationError, lastFinalChunk: props.dictationLastFinalChunk, editableChunk: props.dictationEditableChunk, canBacktrack: props.canBacktrack, dictationSettings: props.dictationSettings, isBrowserSpeechFallbackSupported: props.isBrowserSpeechFallbackSupported, canOpenBrowserSettings: props.canOpenBrowserSettings, onToggleExpanded: props.toggleDictationPanel, onExpand: props.expandDictationPanel, onEditableChunkChange: props.setDictationEditableChunk, onRetryPermissionRequest: props.handleRetryPermissionRequest, onOpenBrowserSettings: props.handleOpenBrowserSettings, onApplyCorrection: props.handleApplyCorrection, onBacktrackLastChunk: props.handleBacktrackLastChunk, onDictationSettingChange: props.handleDictationSettingChange }));
+    }
+    /**
+     * Renders the temporary upload progress indicator.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaUploadProgress({ isUploading }) {
+        if (!isUploading) {
+            return null;
+        }
+        return (jsxRuntime.jsxs("div", { className: styles$5.uploadProgress, children: [jsxRuntime.jsx("div", { className: styles$5.uploadProgressBar, children: jsxRuntime.jsx("div", { className: styles$5.uploadProgressFill }) }), jsxRuntime.jsx("span", { children: "Uploading files..." })] }));
+    }
+    /**
+     * Renders the drag-and-drop overlay when uploads are enabled and active.
+     *
+     * @private component of `<ChatInputArea/>`
+     */
+    function ChatInputAreaDragOverlay(props) {
+        const { isDragOver, onFileUpload } = props;
+        if (!isDragOver || !onFileUpload) {
+            return null;
+        }
+        return (jsxRuntime.jsx("div", { className: styles$5.dragOverlay, children: jsxRuntime.jsxs("div", { className: styles$5.dragOverlayContent, children: [jsxRuntime.jsx(AttachmentIcon, { size: 48 }), jsxRuntime.jsx("span", { children: "Drop files here to upload" })] }) }));
+    }
     /**
      * Renders the chat input area with text, file upload, and voice controls.
      *
      * @private component of `<Chat/>`
      */
     function ChatInputArea(props) {
-        var _a;
         const { onMessage, onChange, onFileUpload, speechRecognition, speechRecognitionLanguage, defaultMessage, replyingToMessage, onCancelReply, enterBehavior, resolveEnterBehavior, placeholderMessageContent, isFocusedOnLoad, isMobile, isVoiceCalling, participants, buttonColor, soundSystem, onButtonClick, chatInputClassName, chatUiTranslations, } = props;
         const { fileInputRef, uploadedFiles, uploadedFilesRef, isDragOver, isUploading, handleDrop, handleDragOver, handleDragLeave, handlePaste, handleFileInputChange, removeUploadedFile, clearUploadedFiles, openFilePicker, } = useChatInputAreaAttachments({
             onFileUpload,
@@ -29440,52 +30822,20 @@
         if (!onMessage) {
             return null;
         }
-        const myColor = ((_a = participants.find((participant) => participant.isMe)) === null || _a === void 0 ? void 0 : _a.color) || USER_CHAT_COLOR;
-        const inputBgColor = Color.from(myColor).then(lighten(0.4)).then(grayscale(0.7));
-        const inputTextColor = inputBgColor.then(textColor);
-        const replyPreviewLabel = (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.replyingToLabel) || 'Replying to';
-        const cancelReplyLabel = (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.cancelReplyLabel) || 'Cancel reply';
-        const replyPreviewText = replyingToMessage
-            ? resolveChatMessageReplyPreviewText(replyingToMessage, { maxLength: 180, emptyLabel: 'Original message' })
-            : null;
-        const replySenderLabel = replyingToMessage
-            ? resolveChatMessageReplySenderLabel({
-                sender: replyingToMessage.sender,
-                participants,
-            })
-            : null;
-        return (jsxRuntime.jsxs("div", { className: classNames(styles$5.chatInput, chatInputClassName, isDragOver && styles$5.dragOver), ...(onFileUpload
-                ? {
-                    onDrop: handleDrop,
-                    onDragOver: handleDragOver,
-                    onDragLeave: handleDragLeave,
-                }
-                : {}), children: [replyingToMessage && replyPreviewText && replySenderLabel && (jsxRuntime.jsx(ChatReplyPreview, { label: replyPreviewLabel, senderLabel: replySenderLabel, previewText: replyPreviewText, className: styles$5.replyComposerPreview, dismissLabel: cancelReplyLabel, onDismiss: onCancelReply || undefined })), uploadedFiles.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.filePreviewContainer, children: uploadedFiles.map((uploadedFile) => (jsxRuntime.jsxs("div", { className: styles$5.filePreview, children: [jsxRuntime.jsx("div", { className: styles$5.fileIcon, children: "\uD83D\uDCCE" }), jsxRuntime.jsxs("div", { className: styles$5.fileInfo, children: [jsxRuntime.jsx("div", { className: styles$5.fileName, children: uploadedFile.file.name }), jsxRuntime.jsxs("div", { className: styles$5.fileSize, children: [(uploadedFile.file.size / 1024).toFixed(1), " KB"] })] }), jsxRuntime.jsx("button", { className: styles$5.removeFileButton, onClick: () => removeUploadedFile(uploadedFile.id), title: "Remove file", children: jsxRuntime.jsx(CloseIcon, {}) })] }, uploadedFile.id))) })), jsxRuntime.jsxs("div", { className: classNames(styles$5.inputContainer, chatCssClassNames.inputContainer), style: {
-                        '--chat-placeholder-color': '#fff',
-                        '--input-bg-color': inputBgColor.toHex(),
-                        '--input-text-color': inputTextColor.toHex(),
-                        '--brand-color': buttonColor.toHex(),
-                    }, children: [jsxRuntime.jsx("textarea", { ref: textareaRef, className: chatCssClassNames.inputTextarea, onPaste: handlePaste, value: messageContent, placeholder: placeholderMessageContent || 'Write a message...', onChange: handleTextInputChange, onKeyDown: handleComposerKeyDown }), onFileUpload && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { ref: fileInputRef, type: "file", multiple: true, style: { display: 'none' }, onChange: handleFileInputChange }), jsxRuntime.jsx("button", { type: "button", style: {
-                                        backgroundColor: buttonColor.toHex(),
-                                        color: buttonColor.then(textColor).toHex(),
-                                    }, className: classNames(styles$5.attachmentButton, chatCssClassNames.inputAttachmentButton), onClick: onButtonClick(openFilePicker), disabled: isUploading, title: "Attach file", children: jsxRuntime.jsx(AttachmentIcon, { size: 20 }) })] })), speechRecognition && (jsxRuntime.jsx("button", { "data-button-type": "voice", disabled: speechRecognitionUiDescriptor.isButtonDisabled, style: {
-                                backgroundColor: speechRecognitionUiDescriptor.isButtonActive
-                                    ? Color.from('#ff4444').toHex()
-                                    : buttonColor.toHex(),
-                                color: speechRecognitionUiDescriptor.isButtonActive
-                                    ? Color.from('#ffffff').toHex()
-                                    : buttonColor.then(textColor).toHex(),
-                            }, className: classNames(styles$5.voiceButton, chatCssClassNames.inputVoiceButton, (isVoiceCalling || speechRecognitionUiDescriptor.isButtonActive) &&
-                                styles$5.voiceButtonActive), onClick: onButtonClick((event) => {
-                                event.preventDefault();
-                                handleToggleVoiceInput();
-                            }), title: speechRecognitionUiDescriptor.buttonTitle, "aria-label": speechRecognitionUiDescriptor.buttonTitle, children: jsxRuntime.jsx(MicIcon, { size: 25 }) })), jsxRuntime.jsx("button", { "data-button-type": "call-to-action", className: chatCssClassNames.inputSendButton, style: {
-                                backgroundColor: buttonColor.toHex(),
-                                color: buttonColor.then(textColor).toHex(),
-                            }, onClick: onButtonClick((event) => {
-                                event.preventDefault();
-                                /* not await */ handleSend();
-                            }), children: jsxRuntime.jsx(SendIcon, { size: 25 }) })] }), speechRecognition && (jsxRuntime.jsx(ChatInputAreaDictationPanel, { bubbleText: speechRecognitionUiDescriptor.bubbleText, bubbleTone: speechRecognitionUiDescriptor.bubbleTone, shouldShowPanel: shouldShowDictationPanel, isExpanded: isDictationPanelExpanded, interimText: dictationInterimText, error: dictationError, lastFinalChunk: dictationLastFinalChunk, editableChunk: dictationEditableChunk, canBacktrack: canBacktrack, dictationSettings: dictationSettings, isBrowserSpeechFallbackSupported: isBrowserSpeechFallbackSupported, canOpenBrowserSettings: canOpenBrowserSettings, onToggleExpanded: toggleDictationPanel, onExpand: expandDictationPanel, onEditableChunkChange: setDictationEditableChunk, onRetryPermissionRequest: handleRetryPermissionRequest, onOpenBrowserSettings: handleOpenBrowserSettings, onApplyCorrection: handleApplyCorrection, onBacktrackLastChunk: handleBacktrackLastChunk, onDictationSettingChange: handleDictationSettingChange })), isUploading && (jsxRuntime.jsxs("div", { className: styles$5.uploadProgress, children: [jsxRuntime.jsx("div", { className: styles$5.uploadProgressBar, children: jsxRuntime.jsx("div", { className: styles$5.uploadProgressFill }) }), jsxRuntime.jsx("span", { children: "Uploading files..." })] })), isDragOver && onFileUpload && (jsxRuntime.jsx("div", { className: styles$5.dragOverlay, children: jsxRuntime.jsxs("div", { className: styles$5.dragOverlayContent, children: [jsxRuntime.jsx(AttachmentIcon, { size: 48 }), jsxRuntime.jsx("span", { children: "Drop files here to upload" })] }) }))] }));
+        const { inputContainerStyle, primaryButtonStyle } = createChatInputAreaColorModel(participants, buttonColor);
+        const replyPreview = createChatInputAreaReplyPreviewModel({
+            replyingToMessage,
+            participants,
+            chatUiTranslations,
+            onCancelReply,
+        });
+        const rootProps = createChatInputAreaRootProps({
+            onFileUpload,
+            handleDrop,
+            handleDragOver,
+            handleDragLeave,
+        });
+        return (jsxRuntime.jsxs("div", { className: classNames(styles$5.chatInput, chatInputClassName, isDragOver && styles$5.dragOver), ...rootProps, children: [jsxRuntime.jsx(ChatInputAreaReplyPreviewSection, { replyPreview: replyPreview }), jsxRuntime.jsx(ChatInputAreaUploadedFilesSection, { uploadedFiles: uploadedFiles, removeUploadedFile: removeUploadedFile }), jsxRuntime.jsxs("div", { className: classNames(styles$5.inputContainer, chatCssClassNames.inputContainer), style: inputContainerStyle, children: [jsxRuntime.jsx("textarea", { ref: textareaRef, className: chatCssClassNames.inputTextarea, onPaste: handlePaste, value: messageContent, placeholder: placeholderMessageContent || 'Write a message...', onChange: handleTextInputChange, onKeyDown: handleComposerKeyDown }), jsxRuntime.jsx(ChatInputAreaAttachmentButton, { onFileUpload: onFileUpload, fileInputRef: fileInputRef, handleFileInputChange: handleFileInputChange, onButtonClick: onButtonClick, openFilePicker: openFilePicker, isUploading: isUploading, primaryButtonStyle: primaryButtonStyle }), jsxRuntime.jsx(ChatInputAreaVoiceButton, { speechRecognition: speechRecognition, isVoiceCalling: isVoiceCalling, buttonColor: buttonColor, speechRecognitionUiDescriptor: speechRecognitionUiDescriptor, onButtonClick: onButtonClick, handleToggleVoiceInput: handleToggleVoiceInput }), jsxRuntime.jsx(ChatInputAreaSendButton, { primaryButtonStyle: primaryButtonStyle, onButtonClick: onButtonClick, handleSend: handleSend })] }), jsxRuntime.jsx(ChatInputAreaDictationPanelSection, { speechRecognition: speechRecognition, speechRecognitionUiDescriptor: speechRecognitionUiDescriptor, shouldShowDictationPanel: shouldShowDictationPanel, isDictationPanelExpanded: isDictationPanelExpanded, dictationInterimText: dictationInterimText, dictationError: dictationError, dictationLastFinalChunk: dictationLastFinalChunk, dictationEditableChunk: dictationEditableChunk, canBacktrack: canBacktrack, dictationSettings: dictationSettings, isBrowserSpeechFallbackSupported: isBrowserSpeechFallbackSupported, canOpenBrowserSettings: canOpenBrowserSettings, toggleDictationPanel: toggleDictationPanel, expandDictationPanel: expandDictationPanel, setDictationEditableChunk: setDictationEditableChunk, handleRetryPermissionRequest: handleRetryPermissionRequest, handleOpenBrowserSettings: handleOpenBrowserSettings, handleApplyCorrection: handleApplyCorrection, handleBacktrackLastChunk: handleBacktrackLastChunk, handleDictationSettingChange: handleDictationSettingChange }), jsxRuntime.jsx(ChatInputAreaUploadProgress, { isUploading: isUploading }), jsxRuntime.jsx(ChatInputAreaDragOverlay, { isDragOver: isDragOver, onFileUpload: onFileUpload })] }));
     }
 
     // Note: [💞] Ignore a discrepancy between file name and entity name
@@ -36448,6 +37798,12 @@
         ['GOAL', 'GOAL'],
         ['GOALS', 'GOAL'],
     ]);
+    /**
+     * Legacy commitments that should be parsed for compatibility but ignored by the model-requirements pipeline.
+     *
+     * @private internal constant of `filterCommitmentsForAgentModelRequirements`
+     */
+    const IGNORED_COMMITMENT_TYPES = new Set(['WALLET', 'WALLETS']);
     /**
      * Applies the commitment filtering rules used before commitment definitions are executed.
      *
@@ -36496,6 +37852,9 @@
     function filterDeletedCommitments(commitments) {
         const filteredCommitments = [];
         for (const commitment of commitments) {
+            if (isIgnoredCommitmentType(commitment.type)) {
+                continue;
+            }
             if (!isDeleteCommitmentType(commitment.type)) {
                 filteredCommitments.push(commitment);
                 continue;
@@ -36526,6 +37885,17 @@
     function isDeleteCommitmentType(commitmentType) {
         return DELETE_COMMITMENT_TYPES.has(commitmentType);
     }
+    /**
+     * Checks whether a parsed commitment is intentionally ignored by the current model compiler.
+     *
+     * @param commitmentType - Commitment type to check.
+     * @returns `true` when the commitment should not affect model requirements.
+     *
+     * @private internal utility of `filterDeletedCommitments`
+     */
+    function isIgnoredCommitmentType(commitmentType) {
+        return IGNORED_COMMITMENT_TYPES.has(commitmentType);
+    }
     /**
      * Extracts normalized parameter names used for DELETE-like invalidation matching.
      *
@@ -41223,8 +42593,8 @@
          * Prepares an AgentKit agent with optional knowledge sources and tool definitions.
          */
         async prepareAgentKitAgent(options) {
-            var _a, _b, _c;
-            const { name, instructions, knowledgeSources, tools, nativeAgentKitTools, vectorStoreId: cachedVectorStoreId, storeAsPrepared, } = options;
+            var _a, _b;
+            const { name, instructions, knowledgeSources, tools, vectorStoreId: cachedVectorStoreId, storeAsPrepared, } = options;
             await this.ensureAgentKitDefaults();
             if (this.options.isVerbose) {
                 console.info('[🤰]', 'Preparing OpenAI AgentKit agent', {
@@ -41232,11 +42602,10 @@
                     instructionsLength: instructions.length,
                     knowledgeSourcesCount: (_a = knowledgeSources === null || knowledgeSources === void 0 ? void 0 : knowledgeSources.length) !== null && _a !== void 0 ? _a : 0,
                     toolsCount: (_b = tools === null || tools === void 0 ? void 0 : tools.length) !== null && _b !== void 0 ? _b : 0,
-                    nativeAgentKitToolsCount: (_c = nativeAgentKitTools === null || nativeAgentKitTools === void 0 ? void 0 : nativeAgentKitTools.length) !== null && _c !== void 0 ? _c : 0,
                 });
             }
             let vectorStoreId = cachedVectorStoreId;
-            if (!vectorStoreId && knowledgeSources && knowledgeSources.length > 0) {
+            if (this.isNativeKnowledgeSearchEnabled && !vectorStoreId && knowledgeSources && knowledgeSources.length > 0) {
                 const vectorStoreResult = await this.createVectorStoreWithKnowledgeSources({
                     client: await this.getClient(),
                     name,
@@ -41245,13 +42614,19 @@
                 });
                 vectorStoreId = vectorStoreResult.vectorStoreId;
             }
-            else if (vectorStoreId && this.options.isVerbose) {
+            else if (this.isNativeKnowledgeSearchEnabled && vectorStoreId && this.options.isVerbose) {
                 console.info('[🤰]', 'Using cached vector store for AgentKit agent', {
                     name,
                     vectorStoreId,
                 });
             }
-            const agentKitTools = this.buildAgentKitTools({ tools, nativeAgentKitTools, vectorStoreId });
+            if (!this.isNativeKnowledgeSearchEnabled) {
+                vectorStoreId = undefined;
+            }
+            const agentKitTools = this.buildAgentKitTools({
+                tools,
+                vectorStoreId,
+            });
             const openAiAgentKitAgent = new agents.Agent({
                 name,
                 model: this.agentKitModelName,
@@ -41270,7 +42645,7 @@
                     name,
                     model: this.agentKitModelName,
                     toolCount: agentKitTools.length,
-                    hasVectorStore: Boolean(vectorStoreId),
+                    hasVectorStore: this.isNativeKnowledgeSearchEnabled && Boolean(vectorStoreId),
                 });
             }
             return preparedAgent;
@@ -41290,14 +42665,11 @@
          * Builds the tool list for AgentKit, including hosted file search when applicable.
          */
         buildAgentKitTools(options) {
-            const { tools, nativeAgentKitTools, vectorStoreId } = options;
+            const { tools, vectorStoreId } = options;
             const agentKitTools = [];
             if (vectorStoreId) {
                 agentKitTools.push(agents.fileSearchTool(vectorStoreId));
             }
-            if (nativeAgentKitTools && nativeAgentKitTools.length > 0) {
-                agentKitTools.push(...nativeAgentKitTools);
-            }
             if (tools && tools.length > 0) {
                 let scriptTools = null;
                 for (const toolDefinition of tools) {
@@ -41772,6 +43144,12 @@
         get agentKitOptions() {
             return this.options;
         }
+        /**
+         * Returns true when hosted OpenAI vector-store search should back `knowledgeSources`.
+         */
+        get isNativeKnowledgeSearchEnabled() {
+            return this.agentKitOptions.isNativeKnowledgeSearchEnabled !== false;
+        }
         /**
          * Discriminant for type guards.
          */
@@ -47499,6 +48877,7 @@
         request_wallet_record: { title: 'Requesting wallet', emoji: '👛' },
         web_search: { title: 'Searching the web', emoji: '🔎' },
         deep_search: { title: 'Deep research', emoji: '🔬' },
+        knowledge_search: { title: 'Searching knowledge', emoji: '📚' },
         useSearchEngine: { title: 'Searching the web', emoji: '🔎' },
         search: { title: 'Searching the web', emoji: '🔎' },
         useBrowser: { title: 'Browsing the web', emoji: '🌐' },
@@ -48374,6 +49753,13 @@
             content: sanitizedContentWithoutButtons,
             citations: message.citations,
         }), [message.citations, sanitizedContentWithoutButtons]);
+        const structuredSourceCitations = react.useMemo(() => {
+            const footnoteSourceKeys = new Set(citationFootnoteRenderModel.footnotes.map((footnote) => footnote.citation.source.trim().toLowerCase()));
+            return (message.sources || []).filter((source) => {
+                const sourceKey = source.source.trim().toLowerCase();
+                return sourceKey && !footnoteSourceKeys.has(sourceKey);
+            });
+        }, [citationFootnoteRenderModel.footnotes, message.sources]);
         const contentSegments = react.useMemo(() => splitMessageContentIntoSegments(citationFootnoteRenderModel.content), [citationFootnoteRenderModel.content]);
         const hasMapSegment = react.useMemo(() => contentSegments.some((segment) => segment.type === 'map'), [contentSegments]);
         const [localHoveredRating, setLocalHoveredRating] = react.useState(0);
@@ -48645,7 +50031,7 @@
                                 '--message-bg-color': isAgentArticleMode ? articleModeBackgroundColor : color.toHex(),
                                 '--message-text-color': isAgentArticleMode ? articleModeTextColor : colorOfText.toHex(),
                                 '--chat-message-swipe-offset': swipeTranslation,
-                            }, onPointerDown: handleReplyPointerDown, onPointerMove: handleReplyPointerMove, onPointerUp: handleReplyPointerEnd, onPointerCancel: resetReplySwipe, children: [isReplyActionEnabled && (jsxRuntime.jsx("div", { className: classNames(styles$5.replySwipeIndicator, isMe && styles$5.replySwipeIndicatorRight, isReplySwipeArmed && styles$5.replySwipeIndicatorActive), "aria-hidden": "true", children: jsxRuntime.jsx(lucideReact.Reply, { className: styles$5.replySwipeIndicatorIcon }) })), !shouldRenderArticleActionsBar && renderMessageReadAndCopyControls(), message.isVoiceCall && (jsxRuntime.jsx("div", { className: styles$5.voiceCallIndicator, children: jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsxRuntime.jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }) })), replyingToMessage && replyPreviewText && replySenderLabel && (jsxRuntime.jsx(ChatReplyPreview, { label: replyPreviewLabel, senderLabel: replySenderLabel, previewText: replyPreviewText, className: styles$5.replyBubblePreview })), jsxRuntime.jsx("div", { ref: contentWithoutButtonsRef, children: jsxRuntime.jsx(ChatMessageRichContent, { content: message.content, contentSegments: contentSegments, streamingFeaturePlaceholderKind: streamingFeaturePlaceholderKind, onCreateAgent: onCreateAgent, mode: mode }) }), message.attachments && message.attachments.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.attachments, children: message.attachments.map((attachment, index) => (jsxRuntime.jsxs("a", { href: attachment.url, target: "_blank", rel: "noopener noreferrer", className: styles$5.attachment, title: attachment.name, children: [jsxRuntime.jsx("span", { className: styles$5.attachmentIcon, children: "\uD83D\uDCCE" }), jsxRuntime.jsx("span", { className: styles$5.attachmentName, children: attachment.name })] }, index))) })), jsxRuntime.jsx(ChatMessageToolCallChips, { chips: toolCallChips, onToolCallClick: onToolCallClick }), citationFootnoteRenderModel.footnotes.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.citationFootnotes, children: citationFootnoteRenderModel.footnotes.map((footnote) => (jsxRuntime.jsxs("div", { className: styles$5.citationFootnoteItem, children: [jsxRuntime.jsx("span", { className: styles$5.citationFootnoteNumber, children: footnote.number }), jsxRuntime.jsx(SourceChip, { citation: footnote.citation, onClick: onCitationClick, isCitationIdVisible: false })] }, `citation-footnote-${footnote.number}-${footnote.citation.source}`))) })), transitiveCitations.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.sourceCitations, children: transitiveCitations.map((citation, index) => (jsxRuntime.jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}`, onClick: onCitationClick }, `team-source-${citation.source}-${index}`))) })), shouldShowButtons && (jsxRuntime.jsx("div", { className: styles$5.messageButtons, children: renderableButtons.map(({ button, buttonIndex }) => (jsxRuntime.jsx("button", { type: "button", className: classNames(styles$5.messageButton, button.type === 'action' && styles$5.actionMessageButton), onClick: (event) => {
+                            }, onPointerDown: handleReplyPointerDown, onPointerMove: handleReplyPointerMove, onPointerUp: handleReplyPointerEnd, onPointerCancel: resetReplySwipe, children: [isReplyActionEnabled && (jsxRuntime.jsx("div", { className: classNames(styles$5.replySwipeIndicator, isMe && styles$5.replySwipeIndicatorRight, isReplySwipeArmed && styles$5.replySwipeIndicatorActive), "aria-hidden": "true", children: jsxRuntime.jsx(lucideReact.Reply, { className: styles$5.replySwipeIndicatorIcon }) })), !shouldRenderArticleActionsBar && renderMessageReadAndCopyControls(), message.isVoiceCall && (jsxRuntime.jsx("div", { className: styles$5.voiceCallIndicator, children: jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: jsxRuntime.jsx("path", { d: "M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z" }) }) })), replyingToMessage && replyPreviewText && replySenderLabel && (jsxRuntime.jsx(ChatReplyPreview, { label: replyPreviewLabel, senderLabel: replySenderLabel, previewText: replyPreviewText, className: styles$5.replyBubblePreview })), jsxRuntime.jsx("div", { ref: contentWithoutButtonsRef, children: jsxRuntime.jsx(ChatMessageRichContent, { content: message.content, contentSegments: contentSegments, streamingFeaturePlaceholderKind: streamingFeaturePlaceholderKind, onCreateAgent: onCreateAgent, mode: mode }) }), message.attachments && message.attachments.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.attachments, children: message.attachments.map((attachment, index) => (jsxRuntime.jsxs("a", { href: attachment.url, target: "_blank", rel: "noopener noreferrer", className: styles$5.attachment, title: attachment.name, children: [jsxRuntime.jsx("span", { className: styles$5.attachmentIcon, children: "\uD83D\uDCCE" }), jsxRuntime.jsx("span", { className: styles$5.attachmentName, children: attachment.name })] }, index))) })), jsxRuntime.jsx(ChatMessageToolCallChips, { chips: toolCallChips, onToolCallClick: onToolCallClick }), citationFootnoteRenderModel.footnotes.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.citationFootnotes, children: citationFootnoteRenderModel.footnotes.map((footnote) => (jsxRuntime.jsxs("div", { className: styles$5.citationFootnoteItem, children: [jsxRuntime.jsx("span", { className: styles$5.citationFootnoteNumber, children: footnote.number }), jsxRuntime.jsx(SourceChip, { citation: footnote.citation, onClick: onCitationClick, isCitationIdVisible: false })] }, `citation-footnote-${footnote.number}-${footnote.citation.source}`))) })), structuredSourceCitations.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.sourceCitations, children: structuredSourceCitations.map((citation, index) => (jsxRuntime.jsx(SourceChip, { citation: citation, onClick: onCitationClick, isCitationIdVisible: false }, `message-source-${citation.source}-${citation.id}-${index}`))) })), transitiveCitations.length > 0 && (jsxRuntime.jsx("div", { className: styles$5.sourceCitations, children: transitiveCitations.map((citation, index) => (jsxRuntime.jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}`, onClick: onCitationClick }, `team-source-${citation.source}-${index}`))) })), shouldShowButtons && (jsxRuntime.jsx("div", { className: styles$5.messageButtons, children: renderableButtons.map(({ button, buttonIndex }) => (jsxRuntime.jsx("button", { type: "button", className: classNames(styles$5.messageButton, button.type === 'action' && styles$5.actionMessageButton), onClick: (event) => {
                                             event.stopPropagation();
                                             if (button.type === 'message') {
                                                 const quickMessageHandler = onQuickMessageButton || onMessage;
@@ -48697,6 +50083,9 @@
         if (prev.message.citations !== next.message.citations) {
             return false;
         }
+        if (prev.message.sources !== next.message.sources) {
+            return false;
+        }
         if (JSON.stringify(prev.message.attachments) !== JSON.stringify(next.message.attachments)) {
             return false;
         }
@@ -48811,68 +50200,201 @@
         return message.clientMessageId || message.id || message.content;
     }
 
+    /**
+     * Supported star values rendered by the rating UI.
+     *
+     * @private component of `<ChatRatingModal/>`
+     */
+    const STAR_RATINGS = [1, 2, 3, 4, 5];
+    /**
+     * Resolves the key used to persist message rating state.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveChatRatingMessageKey(message) {
+        return message.id || message.content /* <-[??] */;
+    }
+    /**
+     * Returns whether the modal should render the report-issue flow.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function isReportIssueFeedbackMode(feedbackMode) {
+        return feedbackMode === 'report_issue';
+    }
+    /**
+     * Finds the previous user question from postprocessed messages when it directly precedes the selected response.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveUserQuestionFromPostprocessedMessages(postprocessedMessages, selectedMessage) {
+        const selectedMessageIndex = postprocessedMessages.findIndex((message) => message.id === selectedMessage.id);
+        if (selectedMessageIndex <= 0) {
+            return null;
+        }
+        const previousMessage = postprocessedMessages[selectedMessageIndex - 1];
+        if ((previousMessage === null || previousMessage === void 0 ? void 0 : previousMessage.sender) !== 'USER') {
+            return null;
+        }
+        return previousMessage.content;
+    }
+    /**
+     * Finds the nearest earlier user question in the original message list.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveUserQuestionFromMessages(messages, selectedMessage) {
+        const selectedMessageIndex = messages.findIndex((message) => message.id === selectedMessage.id);
+        for (let index = selectedMessageIndex - 1; index >= 0; index--) {
+            const currentMessage = messages[index];
+            if ((currentMessage === null || currentMessage === void 0 ? void 0 : currentMessage.sender) === 'USER') {
+                return currentMessage.content;
+            }
+        }
+        return null;
+    }
+    /**
+     * Resolves the user question shown above the feedback fields.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveChatRatingUserQuestion(params) {
+        const { postprocessedMessages, messages, selectedMessage } = params;
+        return (resolveUserQuestionFromPostprocessedMessages(postprocessedMessages, selectedMessage) ||
+            resolveUserQuestionFromMessages(messages, selectedMessage) ||
+            '');
+    }
+    /**
+     * Builds the localized text rendered by the modal.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function createChatRatingModalCopy(params) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        const { feedbackMode, feedbackTranslations } = params;
+        const isReportIssueMode = isReportIssueFeedbackMode(feedbackMode);
+        return {
+            title: isReportIssueMode
+                ? (_a = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueModalTitle) !== null && _a !== void 0 ? _a : 'Report issue'
+                : (_b = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.rateResponseModalTitle) !== null && _b !== void 0 ? _b : 'Rate this response',
+            userQuestionLabel: (_c = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.userQuestionLabel) !== null && _c !== void 0 ? _c : 'Your question:',
+            expectedAnswerLabel: isReportIssueMode
+                ? (_d = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueExpectedAnswerLabel) !== null && _d !== void 0 ? _d : 'What should the answer include?'
+                : (_e = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerLabel) !== null && _e !== void 0 ? _e : 'Expected answer:',
+            expectedAnswerPlaceholder: (_f = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerPlaceholder) !== null && _f !== void 0 ? _f : 'Expected answer (optional)',
+            noteLabel: isReportIssueMode
+                ? (_g = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsLabel) !== null && _g !== void 0 ? _g : 'Issue details:'
+                : (_h = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.noteLabel) !== null && _h !== void 0 ? _h : 'Note:',
+            notePlaceholder: isReportIssueMode
+                ? (_j = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsPlaceholder) !== null && _j !== void 0 ? _j : 'Describe what went wrong (optional)'
+                : (_k = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.notePlaceholder) !== null && _k !== void 0 ? _k : 'Add a note (optional)',
+            cancelLabel: (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.cancelLabel) || 'Cancel',
+            submitLabel: isReportIssueMode
+                ? (_l = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSubmitLabel) !== null && _l !== void 0 ? _l : 'Report issue'
+                : (_m = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.submitLabel) !== null && _m !== void 0 ? _m : 'Submit',
+        };
+    }
+    /**
+     * Resolves the active rating, preferring hover preview over persisted value.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveSelectedChatRating(params) {
+        const { hoveredRating, messageRatings, selectedMessage } = params;
+        return hoveredRating || messageRatings.get(resolveChatRatingMessageKey(selectedMessage)) || 0;
+    }
+    /**
+     * Resolves the color for one star in the rating picker.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveChatRatingStarColor(star, selectedRating, mode) {
+        if (star <= selectedRating) {
+            return '#FFD700';
+        }
+        return mode === 'LIGHT' ? '#ccc' : '#555';
+    }
+    /**
+     * Returns the placeholder used in the expected-answer field.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function resolveExpectedAnswerPlaceholder(selectedMessage, modalCopy) {
+        return selectedMessage.content || modalCopy.expectedAnswerPlaceholder;
+    }
+    /**
+     * Closes the modal when the mobile backdrop itself is clicked.
+     *
+     * @private function of `<ChatRatingModal/>`
+     */
+    function createChatRatingBackdropClickHandler(params) {
+        const { isMobile, onClose } = params;
+        return (event) => {
+            if (event.target === event.currentTarget && isMobile) {
+                onClose();
+            }
+        };
+    }
+    /**
+     * Renders the optional star selector for the rating flow.
+     *
+     * @private component of `<ChatRatingModal/>`
+     */
+    function ChatRatingModalStarsSection(props) {
+        const { feedbackMode, hoveredRating, messageRatings, mode, selectedMessage, setHoveredRating, setMessageRatings } = props;
+        if (isReportIssueFeedbackMode(feedbackMode)) {
+            return null;
+        }
+        const selectedRating = resolveSelectedChatRating({
+            hoveredRating,
+            messageRatings,
+            selectedMessage,
+        });
+        return (jsxRuntime.jsx("div", { className: styles$5.stars, children: STAR_RATINGS.map((star) => (jsxRuntime.jsx("span", { onClick: () => setMessageRatings((previousRatings) => {
+                    const nextRatings = new Map(previousRatings);
+                    nextRatings.set(resolveChatRatingMessageKey(selectedMessage), star);
+                    return nextRatings;
+                }), onMouseEnter: () => setHoveredRating(star), onMouseLeave: () => setHoveredRating(0), className: classNames(styles$5.ratingModalStar), style: {
+                    color: resolveChatRatingStarColor(star, selectedRating, mode),
+                }, children: "\u2B50" }, star))) }));
+    }
+    /**
+     * Renders the footer action buttons for the rating modal.
+     *
+     * @private component of `<ChatRatingModal/>`
+     */
+    function ChatRatingModalActions(props) {
+        const { cancelLabel, onClose, submitLabel, submitRating } = props;
+        return (jsxRuntime.jsxs("div", { className: styles$5.ratingActions, children: [jsxRuntime.jsx("button", { onClick: onClose, children: cancelLabel }), jsxRuntime.jsx("button", { onClick: submitRating, children: submitLabel })] }));
+    }
     /**
      * Modal that captures per-message rating feedback.
      *
      * @private component of `<Chat/>`
      */
     function ChatRatingModal(props) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         const { isOpen, selectedMessage, postprocessedMessages, messages, hoveredRating, messageRatings, textRating, feedbackMode, feedbackTranslations, mode, isMobile, onClose, setHoveredRating, setMessageRatings, setSelectedMessage, setTextRating, submitRating, } = props;
         if (!isOpen || !selectedMessage) {
             return null;
         }
-        const isReportIssueMode = feedbackMode === 'report_issue';
-        const userQuestion = (() => {
-            var _a, _b;
-            const idx = postprocessedMessages.findIndex((message) => message.id === selectedMessage.id);
-            if (idx > 0) {
-                const prev = postprocessedMessages[idx - 1];
-                if ((prev === null || prev === void 0 ? void 0 : prev.sender) === 'USER') {
-                    return prev.content;
-                }
-            }
-            for (let i = messages.findIndex((message) => message.id === selectedMessage.id) - 1; i >= 0; i--) {
-                if (((_a = messages[i]) === null || _a === void 0 ? void 0 : _a.sender) === 'USER') {
-                    return ((_b = messages[i]) === null || _b === void 0 ? void 0 : _b.content) || '';
-                }
-            }
-            return '';
-        })();
-        return (jsxRuntime.jsx("div", { className: styles$5.ratingModal, "data-chat-modal": "rating", "data-chat-theme": mode.toLowerCase(), onClick: (event) => {
-                if (event.target === event.currentTarget && isMobile) {
-                    onClose();
-                }
-            }, children: jsxRuntime.jsxs("div", { className: styles$5.ratingModalContent, children: [jsxRuntime.jsx("h3", { children: isReportIssueMode
-                            ? (_a = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueModalTitle) !== null && _a !== void 0 ? _a : 'Report issue'
-                            : (_b = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.rateResponseModalTitle) !== null && _b !== void 0 ? _b : 'Rate this response' }), !isReportIssueMode && (jsxRuntime.jsx("div", { className: styles$5.stars, children: [1, 2, 3, 4, 5].map((star) => (jsxRuntime.jsx("span", { onClick: () => setMessageRatings((previousRatings) => {
-                                const nextRatings = new Map(previousRatings);
-                                nextRatings.set(selectedMessage.id || selectedMessage.content /* <-[??] */, star);
-                                return nextRatings;
-                            }), onMouseEnter: () => setHoveredRating(star), onMouseLeave: () => setHoveredRating(0), className: classNames(styles$5.ratingModalStar), style: {
-                                color: star <=
-                                    (hoveredRating ||
-                                        messageRatings.get(selectedMessage.id || selectedMessage.content /* <-[??] */) ||
-                                        0)
-                                    ? '#FFD700'
-                                    : mode === 'LIGHT'
-                                        ? '#ccc'
-                                        : '#555',
-                            }, children: "\u2B50" }, star))) })), (_c = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.userQuestionLabel) !== null && _c !== void 0 ? _c : 'Your question:', jsxRuntime.jsx("textarea", { readOnly: true, value: userQuestion, className: styles$5.ratingInput }), isReportIssueMode
-                        ? (_d = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueExpectedAnswerLabel) !== null && _d !== void 0 ? _d : 'What should the answer include?'
-                        : (_e = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerLabel) !== null && _e !== void 0 ? _e : 'Expected answer:', jsxRuntime.jsx("textarea", { placeholder: selectedMessage.content ||
-                            (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.expectedAnswerPlaceholder) ||
-                            'Expected answer (optional)', defaultValue: selectedMessage.expectedAnswer || selectedMessage.content, onChange: (event) => {
+        const modalCopy = createChatRatingModalCopy({
+            feedbackMode,
+            feedbackTranslations,
+        });
+        const userQuestion = resolveChatRatingUserQuestion({
+            postprocessedMessages,
+            messages,
+            selectedMessage,
+        });
+        const handleBackdropClick = createChatRatingBackdropClickHandler({
+            isMobile,
+            onClose,
+        });
+        return (jsxRuntime.jsx("div", { className: styles$5.ratingModal, "data-chat-modal": "rating", "data-chat-theme": mode.toLowerCase(), onClick: handleBackdropClick, children: jsxRuntime.jsxs("div", { className: styles$5.ratingModalContent, children: [jsxRuntime.jsx("h3", { children: modalCopy.title }), jsxRuntime.jsx(ChatRatingModalStarsSection, { feedbackMode: feedbackMode, hoveredRating: hoveredRating, messageRatings: messageRatings, mode: mode, selectedMessage: selectedMessage, setHoveredRating: setHoveredRating, setMessageRatings: setMessageRatings }), modalCopy.userQuestionLabel, jsxRuntime.jsx("textarea", { readOnly: true, value: userQuestion, className: styles$5.ratingInput }), modalCopy.expectedAnswerLabel, jsxRuntime.jsx("textarea", { placeholder: resolveExpectedAnswerPlaceholder(selectedMessage, modalCopy), defaultValue: selectedMessage.expectedAnswer || selectedMessage.content, onChange: (event) => {
                             if (selectedMessage) {
                                 setSelectedMessage({ ...selectedMessage, expectedAnswer: event.target.value });
                             }
-                        }, className: styles$5.ratingInput }), isReportIssueMode
-                        ? (_f = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsLabel) !== null && _f !== void 0 ? _f : 'Issue details:'
-                        : (_g = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.noteLabel) !== null && _g !== void 0 ? _g : 'Note:', jsxRuntime.jsx("textarea", { placeholder: isReportIssueMode
-                            ? (_h = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueDetailsPlaceholder) !== null && _h !== void 0 ? _h : 'Describe what went wrong (optional)'
-                            : (_j = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.notePlaceholder) !== null && _j !== void 0 ? _j : 'Add a note (optional)', defaultValue: textRating, onChange: (event) => setTextRating(event.target.value), className: styles$5.ratingInput }), jsxRuntime.jsxs("div", { className: styles$5.ratingActions, children: [jsxRuntime.jsx("button", { onClick: onClose, children: (feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.cancelLabel) || 'Cancel' }), jsxRuntime.jsx("button", { onClick: submitRating, children: isReportIssueMode
-                                    ? (_k = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.reportIssueSubmitLabel) !== null && _k !== void 0 ? _k : 'Report issue'
-                                    : (_l = feedbackTranslations === null || feedbackTranslations === void 0 ? void 0 : feedbackTranslations.submitLabel) !== null && _l !== void 0 ? _l : 'Submit' })] })] }) }));
+                        }, className: styles$5.ratingInput }), modalCopy.noteLabel, jsxRuntime.jsx("textarea", { placeholder: modalCopy.notePlaceholder, defaultValue: textRating, onChange: (event) => setTextRating(event.target.value), className: styles$5.ratingInput }), jsxRuntime.jsx(ChatRatingModalActions, { cancelLabel: modalCopy.cancelLabel, onClose: onClose, submitLabel: modalCopy.submitLabel, submitRating: submitRating })] }) }));
     }
 
     /**
@@ -49978,7 +51500,7 @@
         const { results, rawText } = extractSearchResults(resultRaw);
         const hasResults = results.length > 0;
         const hasRawText = !hasResults && !!rawText && rawText.trim().length > 0;
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$5.searchModalHeader, children: [jsxRuntime.jsx("span", { className: styles$5.searchModalIcon, children: "\uD83D\uDD0E" }), jsxRuntime.jsx("h3", { className: styles$5.searchModalQuery, children: args.query || args.searchText || 'Search Results' })] }), jsxRuntime.jsx("div", { className: styles$5.searchModalContent, children: hasResults ? (jsxRuntime.jsx("div", { className: styles$5.searchResultsList, children: results.map((item, index) => (jsxRuntime.jsxs("div", { className: styles$5.searchResultItem, children: [jsxRuntime.jsx("div", { className: styles$5.searchResultUrl, children: item.url && (jsxRuntime.jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.url })) }), jsxRuntime.jsx("h4", { className: styles$5.searchResultTitle, children: item.url ? (jsxRuntime.jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.title || 'Untitled' })) : (item.title || 'Untitled') }), jsxRuntime.jsx("p", { className: styles$5.searchResultSnippet, children: item.snippet || item.content || '' })] }, index))) })) : hasRawText ? (jsxRuntime.jsx(MarkdownContent, { className: styles$5.searchResultsRaw, content: rawText })) : toolCallState !== 'COMPLETE' ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [renderToolCallProgressPlaceholder({
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$5.searchModalHeader, children: [jsxRuntime.jsx("span", { className: styles$5.searchModalIcon, children: "\uD83D\uDD0E" }), jsxRuntime.jsx("h3", { className: styles$5.searchModalQuery, children: args.query || args.searchText || 'Search Results' })] }), jsxRuntime.jsx("div", { className: styles$5.searchModalContent, children: hasResults ? (jsxRuntime.jsx("div", { className: styles$5.searchResultsList, children: results.map((item, index) => (jsxRuntime.jsxs("div", { className: styles$5.searchResultItem, children: [jsxRuntime.jsx("div", { className: styles$5.searchResultUrl, children: item.url && (jsxRuntime.jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.url })) }), jsxRuntime.jsx("h4", { className: styles$5.searchResultTitle, children: item.url ? (jsxRuntime.jsx("a", { href: item.url, target: "_blank", rel: "noreferrer", children: item.title || item.source || 'Untitled' })) : (item.title || item.source || 'Untitled') }), jsxRuntime.jsx("p", { className: styles$5.searchResultSnippet, children: item.snippet || item.content || item.excerpt || '' })] }, index))) })) : hasRawText ? (jsxRuntime.jsx(MarkdownContent, { className: styles$5.searchResultsRaw, content: rawText })) : toolCallState !== 'COMPLETE' ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [renderToolCallProgressPlaceholder({
                                 title: 'Search results pending',
                                 message: resolveToolCallProgressMessage(toolCall),
                             }), jsxRuntime.jsxs("div", { className: styles$5.toolCallDetailsCard, children: [jsxRuntime.jsxs("div", { className: styles$5.toolCallDetailsCardRow, children: [jsxRuntime.jsx("strong", { children: "Query" }), jsxRuntime.jsx("span", { children: String(args.query || args.searchText || 'Search query is being prepared.') })] }), args.location && (jsxRuntime.jsxs("div", { className: styles$5.toolCallDetailsCardRow, children: [jsxRuntime.jsx("strong", { children: "Location" }), jsxRuntime.jsx("span", { children: String(args.location) })] })), args.engine && (jsxRuntime.jsxs("div", { className: styles$5.toolCallDetailsCardRow, children: [jsxRuntime.jsx("strong", { children: "Engine" }), jsxRuntime.jsx("span", { children: String(args.engine) })] }))] })] })) : (jsxRuntime.jsx("div", { className: styles$5.noResults, children: resultRaw ? 'No search results found.' : 'Search results are not available.' })) })] }));
@@ -50183,6 +51705,18 @@
      * @private function of ChatToolCallModal
      */
     function renderTimeoutToolCallDetails(options) {
+        const viewModel = createTimeoutToolCallDetailsViewModel(options);
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$5.searchModalHeader, children: [jsxRuntime.jsx("span", { className: styles$5.searchModalIcon, children: "\u23F1\uFE0F" }), jsxRuntime.jsx("h3", { className: styles$5.searchModalQuery, children: viewModel.title })] }), jsxRuntime.jsxs("div", { className: styles$5.searchModalContent, children: [renderTimeoutToolCallClock(viewModel), renderTimeoutToolCallSummary(viewModel), renderTimeoutToolCallActions(viewModel)] })] }));
+    }
+    /**
+     * Prepares the values rendered by the timeout detail view.
+     *
+     * @param options - Raw timeout tool call data.
+     * @returns Derived timeout detail view model.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function createTimeoutToolCallDetailsViewModel(options) {
         const { toolCallName, args, resultRaw, toolCallDate, onRequestAdvancedView, locale, chatUiTranslations } = options;
         const timeoutPresentation = resolveTimeoutToolCallPresentation({
             toolCallName,
@@ -50191,40 +51725,120 @@
             currentDate: new Date(),
             locale,
         });
-        const clockDate = (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.dueAtDate) || toolCallDate;
-        const isValidClockDate = !!clockDate && !Number.isNaN(clockDate.getTime());
-        const title = (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.action) === 'cancel'
-            ? timeoutPresentation.status === 'cancelled'
-                ? (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelledTitle) || 'Timeout cancelled'
-                : (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutUpdateTitle) || 'Timeout update'
-            : (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutTitle) || 'Timeout scheduled';
-        const primarySentence = timeoutPresentation
-            ? buildTimeoutToolPrimarySentence(timeoutPresentation, chatUiTranslations)
-            : (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutLoadingMessage) || 'Timeout details are still loading.';
-        const scheduleSentence = timeoutPresentation
-            ? buildTimeoutToolScheduleSentence(timeoutPresentation, chatUiTranslations)
-            : null;
-        const cancelCommand = (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.timeoutId) && timeoutPresentation.action !== 'cancel'
-            ? createCancelTimeoutQuickActionCommand(timeoutPresentation.timeoutId)
-            : null;
-        const snoozeCommand = createSnoozeTimeoutQuickActionCommand((timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.message) || undefined);
-        const timezoneLine = (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.localTimezone)
-            ? `${(chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutTimezoneLabel) || 'Timezone:'} ${timeoutPresentation.localTimezone}`
-            : null;
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$5.searchModalHeader, children: [jsxRuntime.jsx("span", { className: styles$5.searchModalIcon, children: "\u23F1\uFE0F" }), jsxRuntime.jsx("h3", { className: styles$5.searchModalQuery, children: title })] }), jsxRuntime.jsxs("div", { className: styles$5.searchModalContent, children: [isValidClockDate && clockDate ? (renderToolCallClockPanel({
-                            date: clockDate,
-                            relativeLabel: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.relativeDueLabel) || null,
-                            timezoneLabel: timezoneLine,
-                            locale,
-                        })) : (jsxRuntime.jsx("p", { className: styles$5.toolCallEmpty, children: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutUnavailableMessage) || 'Scheduled time is unavailable.' })), jsxRuntime.jsxs("div", { className: styles$5.timeoutToolSummary, children: [jsxRuntime.jsx("p", { className: styles$5.timeoutToolPrimarySentence, children: primarySentence }), scheduleSentence && jsxRuntime.jsx("p", { className: styles$5.timeoutToolSecondarySentence, children: scheduleSentence }), (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.localDueDateLabel) && (jsxRuntime.jsxs("p", { className: styles$5.timeoutToolSecondarySentence, children: [(chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutDateLabel) || 'Date:', ' ', timeoutPresentation.localDueDateLabel] })), (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.message) && (jsxRuntime.jsxs("p", { className: styles$5.timeoutToolSecondarySentence, children: [(chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutMessageLabel) || 'Message:', ' ', timeoutPresentation.message] }))] }), jsxRuntime.jsxs("div", { className: styles$5.timeoutToolActionRow, role: "group", "aria-label": (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutActionGroupLabel) || 'Timeout quick actions', children: [jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: () => {
-                                        if (!cancelCommand) {
-                                            return;
-                                        }
-                                        copyTimeoutQuickActionCommand(cancelCommand);
-                                    }, disabled: !cancelCommand, "aria-label": (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelAriaLabel) || 'Cancel timeout', children: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelButton) || 'Cancel' }), jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: () => {
-                                        copyTimeoutQuickActionCommand(snoozeCommand);
-                                    }, "aria-label": (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutSnoozeAriaLabel) || 'Snooze timeout', children: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutSnoozeButton) || 'Snooze' }), onRequestAdvancedView && (jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: onRequestAdvancedView, "aria-label": (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutViewAdvancedAriaLabel) ||
-                                        'View advanced timeout details', children: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutViewAdvancedButton) || 'View advanced' }))] })] })] }));
+        const labels = resolveTimeoutToolCallDetailLabels(chatUiTranslations);
+        return {
+            labels,
+            locale,
+            onRequestAdvancedView,
+            title: resolveTimeoutToolCallTitle(timeoutPresentation, labels),
+            clockDate: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.dueAtDate) || toolCallDate,
+            primarySentence: timeoutPresentation
+                ? buildTimeoutToolPrimarySentence(timeoutPresentation, chatUiTranslations)
+                : labels.loadingMessage,
+            scheduleSentence: timeoutPresentation
+                ? buildTimeoutToolScheduleSentence(timeoutPresentation, chatUiTranslations)
+                : null,
+            relativeDueLabel: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.relativeDueLabel) || null,
+            timezoneLine: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.localTimezone)
+                ? `${labels.timezoneLabel} ${timeoutPresentation.localTimezone}`
+                : null,
+            localDueDateLabel: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.localDueDateLabel) || null,
+            message: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.message) || null,
+            cancelCommand: (timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.timeoutId) && timeoutPresentation.action !== 'cancel'
+                ? createCancelTimeoutQuickActionCommand(timeoutPresentation.timeoutId)
+                : null,
+            snoozeCommand: createSnoozeTimeoutQuickActionCommand((timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.message) || undefined),
+        };
+    }
+    /**
+     * Resolves the timeout detail title for the current presentation state.
+     *
+     * @param timeoutPresentation - Friendly timeout presentation data.
+     * @param labels - Localized labels with fallbacks.
+     * @returns One timeout modal title.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function resolveTimeoutToolCallTitle(timeoutPresentation, labels) {
+        if ((timeoutPresentation === null || timeoutPresentation === void 0 ? void 0 : timeoutPresentation.action) !== 'cancel') {
+            return labels.titleScheduled;
+        }
+        return timeoutPresentation.status === 'cancelled' ? labels.titleCancelled : labels.titleUpdated;
+    }
+    /**
+     * Resolves timeout-detail translations with stable fallback strings.
+     *
+     * @param chatUiTranslations - Optional translation overrides.
+     * @returns Complete timeout detail labels.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function resolveTimeoutToolCallDetailLabels(chatUiTranslations) {
+        return {
+            titleScheduled: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutTitle) || 'Timeout scheduled',
+            titleCancelled: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelledTitle) || 'Timeout cancelled',
+            titleUpdated: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutUpdateTitle) || 'Timeout update',
+            loadingMessage: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutLoadingMessage) || 'Timeout details are still loading.',
+            unavailableMessage: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutUnavailableMessage) || 'Scheduled time is unavailable.',
+            dateLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutDateLabel) || 'Date:',
+            messageLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutMessageLabel) || 'Message:',
+            timezoneLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutTimezoneLabel) || 'Timezone:',
+            actionGroupLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutActionGroupLabel) || 'Timeout quick actions',
+            cancelAriaLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelAriaLabel) || 'Cancel timeout',
+            cancelButton: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutCancelButton) || 'Cancel',
+            snoozeAriaLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutSnoozeAriaLabel) || 'Snooze timeout',
+            snoozeButton: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutSnoozeButton) || 'Snooze',
+            viewAdvancedAriaLabel: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutViewAdvancedAriaLabel) || 'View advanced timeout details',
+            viewAdvancedButton: (chatUiTranslations === null || chatUiTranslations === void 0 ? void 0 : chatUiTranslations.toolCallTimeoutViewAdvancedButton) || 'View advanced',
+        };
+    }
+    /**
+     * Renders the timeout clock panel or its unavailable fallback.
+     *
+     * @param viewModel - Prepared timeout detail state.
+     * @returns Clock section element.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function renderTimeoutToolCallClock(viewModel) {
+        if (viewModel.clockDate && !Number.isNaN(viewModel.clockDate.getTime())) {
+            return renderToolCallClockPanel({
+                date: viewModel.clockDate,
+                relativeLabel: viewModel.relativeDueLabel,
+                timezoneLabel: viewModel.timezoneLine,
+                locale: viewModel.locale,
+            });
+        }
+        return jsxRuntime.jsx("p", { className: styles$5.toolCallEmpty, children: viewModel.labels.unavailableMessage });
+    }
+    /**
+     * Renders the timeout summary sentences and optional metadata lines.
+     *
+     * @param viewModel - Prepared timeout detail state.
+     * @returns Summary section element.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function renderTimeoutToolCallSummary(viewModel) {
+        return (jsxRuntime.jsxs("div", { className: styles$5.timeoutToolSummary, children: [jsxRuntime.jsx("p", { className: styles$5.timeoutToolPrimarySentence, children: viewModel.primarySentence }), viewModel.scheduleSentence && (jsxRuntime.jsx("p", { className: styles$5.timeoutToolSecondarySentence, children: viewModel.scheduleSentence })), viewModel.localDueDateLabel && (jsxRuntime.jsxs("p", { className: styles$5.timeoutToolSecondarySentence, children: [viewModel.labels.dateLabel, " ", viewModel.localDueDateLabel] })), viewModel.message && (jsxRuntime.jsxs("p", { className: styles$5.timeoutToolSecondarySentence, children: [viewModel.labels.messageLabel, " ", viewModel.message] }))] }));
+    }
+    /**
+     * Renders timeout quick-action buttons.
+     *
+     * @param viewModel - Prepared timeout detail state.
+     * @returns Quick actions element.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function renderTimeoutToolCallActions(viewModel) {
+        return (jsxRuntime.jsxs("div", { className: styles$5.timeoutToolActionRow, role: "group", "aria-label": viewModel.labels.actionGroupLabel, children: [jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: () => {
+                        if (!viewModel.cancelCommand) {
+                            return;
+                        }
+                        copyTimeoutQuickActionCommand(viewModel.cancelCommand);
+                    }, disabled: !viewModel.cancelCommand, "aria-label": viewModel.labels.cancelAriaLabel, children: viewModel.labels.cancelButton }), jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: () => {
+                        copyTimeoutQuickActionCommand(viewModel.snoozeCommand);
+                    }, "aria-label": viewModel.labels.snoozeAriaLabel, children: viewModel.labels.snoozeButton }), viewModel.onRequestAdvancedView && (jsxRuntime.jsx("button", { type: "button", className: styles$5.timeoutToolActionButton, onClick: viewModel.onRequestAdvancedView, "aria-label": viewModel.labels.viewAdvancedAriaLabel, children: viewModel.labels.viewAdvancedButton }))] }));
     }
     /**
      * Copies one quick action command to clipboard when supported.
@@ -50466,6 +52080,7 @@
     function isSearchToolCallName(toolName) {
         return (toolName === 'web_search' ||
             toolName === 'deep_search' ||
+            toolName === 'knowledge_search' ||
             toolName === 'useSearchEngine' ||
             toolName === 'search');
     }
@@ -50812,6 +52427,279 @@
      */
     const PlayIcon = ({ size = 16 }) => (jsxRuntime.jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "currentColor", role: "img", "aria-label": "Play", children: jsxRuntime.jsx("path", { d: "M8 5v14l11-7L8 5z" }) }));
 
+    /**
+     * Resolves one delay value, including random ranges.
+     *
+     * @private function of `MockedChat`
+     */
+    function getDelay(val, fallback) {
+        if (Array.isArray(val) && val.length === 2) {
+            const [min, max] = val;
+            return Math.floor(Math.random() * (max - min + 1)) + min;
+        }
+        if (typeof val === 'number') {
+            return val;
+        }
+        return fallback;
+    }
+    /**
+     * Normalizes message offsets into a monotonic deterministic timeline.
+     *
+     * @private function of `MockedChat`
+     */
+    function normalizeMessageOffsets(messageOffsetsMs, originalMessages) {
+        if (!messageOffsetsMs || messageOffsetsMs.length === 0) {
+            return null;
+        }
+        let previousOffset = 0;
+        return originalMessages.map((_message, messageIndex) => {
+            const rawOffset = messageOffsetsMs[messageIndex];
+            const nextOffset = Number.isFinite(rawOffset) ? Math.max(0, Math.floor(rawOffset || 0)) : previousOffset;
+            previousOffset = Math.max(previousOffset, nextOffset);
+            return previousOffset;
+        });
+    }
+    /**
+     * Resolves the deterministic wait before one message when fixed offsets are supplied.
+     *
+     * @private function of `MockedChat`
+     */
+    function resolveOffsetDelayBeforeMessage(normalizedMessageOffsetsMs, messageIndex) {
+        if (!normalizedMessageOffsetsMs) {
+            return 0;
+        }
+        const currentOffset = normalizedMessageOffsetsMs[messageIndex] || 0;
+        const previousOffset = messageIndex > 0 ? normalizedMessageOffsetsMs[messageIndex - 1] || 0 : 0;
+        return Math.max(0, currentOffset - previousOffset);
+    }
+    /**
+     * Creates the message shape rendered while the mocked transcript is being simulated.
+     *
+     * @private function of `MockedChat`
+     */
+    function createDisplayedMockedChatMessage(originalMessage, content, isComplete) {
+        return {
+            id: originalMessage.id,
+            createdAt: originalMessage.createdAt,
+            sender: originalMessage.sender,
+            content,
+            isComplete,
+            expectedAnswer: originalMessage.expectedAnswer,
+            isVoiceCall: originalMessage.isVoiceCall,
+        };
+    }
+    /**
+     * Appends one new rendered message to the mocked transcript.
+     *
+     * @private function of `MockedChat`
+     */
+    function appendDisplayedMessage(setDisplayedMessages, nextMessage) {
+        setDisplayedMessages((previousMessages) => [...previousMessages, nextMessage]);
+    }
+    /**
+     * Replaces the most recently rendered message in the mocked transcript.
+     *
+     * @private function of `MockedChat`
+     */
+    function replaceLastDisplayedMessage(setDisplayedMessages, nextMessage) {
+        setDisplayedMessages((previousMessages) => {
+            const nextMessages = [...previousMessages];
+            nextMessages[nextMessages.length - 1] = nextMessage;
+            return nextMessages;
+        });
+    }
+    /**
+     * Resets all simulation-owned UI state before one playback run starts.
+     *
+     * @private function of `MockedChat`
+     */
+    function resetSimulationState(params) {
+        const { setDisplayedMessages, setLocalAppendedMessages, setIsSimulationComplete } = params;
+        setDisplayedMessages([]);
+        setLocalAppendedMessages([]);
+        setIsSimulationComplete(false);
+    }
+    /**
+     * Finalizes the playback run and notifies the caller.
+     *
+     * @private function of `MockedChat`
+     */
+    function completeSimulation(params) {
+        var _a;
+        const { setIsSimulationComplete, onSimulationCompleteRef } = params;
+        setIsSimulationComplete(true);
+        (_a = onSimulationCompleteRef.current) === null || _a === void 0 ? void 0 : _a.call(onSimulationCompleteRef);
+    }
+    /**
+     * Waits for one delay and reports whether the current playback was cancelled.
+     *
+     * @private function of `MockedChat`
+     */
+    async function waitForDelay(delayMs, isCancelledRef) {
+        if (delayMs > 0) {
+            await waitasecond.forTime(delayMs);
+        }
+        return isCancelledRef();
+    }
+    /**
+     * Waits for a paused simulation to resume when a pause has been requested.
+     *
+     * @private function of `MockedChat`
+     */
+    async function waitForPauseIfRequested(params) {
+        const { pauseRequestedRef, waitIfPaused, isCancelledRef } = params;
+        if (!pauseRequestedRef.current) {
+            return false;
+        }
+        await waitIfPaused(isCancelledRef);
+        return isCancelledRef();
+    }
+    /**
+     * Resolves the first wait before the simulated transcript starts rendering.
+     *
+     * @private function of `MockedChat`
+     */
+    function resolveInitialSimulationDelay(params) {
+        const { delays, normalizedMessageOffsetsMs, firstMessageIndex } = params;
+        if (normalizedMessageOffsetsMs) {
+            return resolveOffsetDelayBeforeMessage(normalizedMessageOffsetsMs, firstMessageIndex);
+        }
+        return getDelay(delays.beforeFirstMessage, 1000);
+    }
+    /**
+     * Returns true when the next inter-message wait should use a longer pause.
+     *
+     * @private function of `MockedChat`
+     */
+    function shouldUseLongPause(params) {
+        const { delays, originalMessages, messageIndex } = params;
+        return (!!delays.longPauseChance &&
+            Math.random() < delays.longPauseChance &&
+            messageIndex > 0 &&
+            originalMessages[messageIndex].sender !== originalMessages[messageIndex - 1].sender);
+    }
+    /**
+     * Resolves the wait between two rendered messages.
+     *
+     * @private function of `MockedChat`
+     */
+    function resolveInterMessageDelay(params) {
+        const { delays, originalMessages, normalizedMessageOffsetsMs, messageIndex } = params;
+        if (normalizedMessageOffsetsMs) {
+            return resolveOffsetDelayBeforeMessage(normalizedMessageOffsetsMs, messageIndex);
+        }
+        if (shouldUseLongPause({
+            delays,
+            originalMessages,
+            messageIndex,
+        })) {
+            return getDelay(delays.longPauseDuration, 2000);
+        }
+        return getDelay(delays.thinkingBetweenMessages, 2000);
+    }
+    /**
+     * Types out one message word by word and marks it complete when finished.
+     *
+     * @private function of `MockedChat`
+     */
+    async function typeMockedChatMessage(params) {
+        const { currentMessage, delays, normalizedMessageOffsetsMs, setDisplayedMessages, isCancelledRef } = params;
+        const incompleteMessage = createDisplayedMockedChatMessage(currentMessage, '', false);
+        appendDisplayedMessage(setDisplayedMessages, incompleteMessage);
+        const words = currentMessage.content.split(' ');
+        let currentContent = '';
+        for (let wordIndex = 0; wordIndex < words.length; wordIndex++) {
+            if (isCancelledRef()) {
+                return true;
+            }
+            const word = words[wordIndex];
+            currentContent += (wordIndex > 0 ? ' ' : '') + word;
+            replaceLastDisplayedMessage(setDisplayedMessages, createDisplayedMockedChatMessage(currentMessage, currentContent, false));
+            const wordDelayMs = getDelay(delays.waitAfterWord, 100) + getDelay(delays.extraWordDelay, 50);
+            if (await waitForDelay(wordDelayMs, isCancelledRef)) {
+                return true;
+            }
+        }
+        replaceLastDisplayedMessage(setDisplayedMessages, createDisplayedMockedChatMessage(currentMessage, currentMessage.content, true));
+        if (!normalizedMessageOffsetsMs && (await waitForDelay(200, isCancelledRef))) {
+            return true;
+        }
+        return false;
+    }
+    /**
+     * Runs one full mocked-chat playback cycle.
+     *
+     * @private function of `MockedChat`
+     */
+    async function simulateMockedChatPlayback(props) {
+        const { delays, originalMessages, normalizedMessageOffsetsMs, pauseRequestedRef, waitIfPaused, setDisplayedMessages, setLocalAppendedMessages, setIsSimulationComplete, onSimulationCompleteRef, isCancelledRef, } = props;
+        resetSimulationState({
+            setDisplayedMessages,
+            setLocalAppendedMessages,
+            setIsSimulationComplete,
+        });
+        if (originalMessages.length === 0) {
+            completeSimulation({
+                setIsSimulationComplete,
+                onSimulationCompleteRef,
+            });
+            return;
+        }
+        const showIntermediateMessages = delays.showIntermediateMessages || 0;
+        if (showIntermediateMessages > 0) {
+            setDisplayedMessages(originalMessages.slice(0, showIntermediateMessages));
+        }
+        if (await waitForDelay(resolveInitialSimulationDelay({
+            delays,
+            normalizedMessageOffsetsMs,
+            firstMessageIndex: showIntermediateMessages,
+        }), isCancelledRef)) {
+            return;
+        }
+        for (let messageIndex = showIntermediateMessages; messageIndex < originalMessages.length; messageIndex++) {
+            if (await waitForPauseIfRequested({
+                pauseRequestedRef,
+                waitIfPaused,
+                isCancelledRef,
+            })) {
+                return;
+            }
+            const currentMessage = originalMessages[messageIndex];
+            if (!currentMessage) {
+                continue;
+            }
+            if (messageIndex > showIntermediateMessages) {
+                if (await waitForDelay(resolveInterMessageDelay({
+                    delays,
+                    originalMessages,
+                    normalizedMessageOffsetsMs,
+                    messageIndex,
+                }), isCancelledRef)) {
+                    return;
+                }
+                if (await waitForPauseIfRequested({
+                    pauseRequestedRef,
+                    waitIfPaused,
+                    isCancelledRef,
+                })) {
+                    return;
+                }
+            }
+            if (await typeMockedChatMessage({
+                currentMessage,
+                delays,
+                normalizedMessageOffsetsMs,
+                setDisplayedMessages,
+                isCancelledRef,
+            })) {
+                return;
+            }
+        }
+        completeSimulation({
+            setIsSimulationComplete,
+            onSimulationCompleteRef,
+        });
+    }
     /**
      * MockedChat component that shows the same chat as Chat but emulates ongoing discussion
      * with realistic typing delays and thinking pauses.
@@ -50820,16 +52708,6 @@
      */
     function MockedChat(props) {
         const { delayConfig, messages: originalMessages, isResettable = true, isPausable = true, messageOffsetsMs, appendMessagesLocallyOnSend = false, onSimulationComplete, isSaveButtonEnabled = true, ...chatProps } = props;
-        // Helper to get random delay from config
-        function getDelay(val, fallback) {
-            if (Array.isArray(val) && val.length === 2) {
-                const [min, max] = val;
-                return Math.floor(Math.random() * (max - min + 1)) + min;
-            }
-            if (typeof val === 'number')
-                return val;
-            return fallback;
-        }
         const delays = {
             ...MOCKED_CHAT_DELAY_CONFIGS.NORMAL_FLOW,
             ...delayConfig,
@@ -50837,18 +52715,7 @@
         const [displayedMessages, setDisplayedMessages] = react.useState([]);
         const [localAppendedMessages, setLocalAppendedMessages] = react.useState([]);
         const [isSimulationComplete, setIsSimulationComplete] = react.useState(false);
-        const normalizedMessageOffsetsMs = react.useMemo(() => {
-            if (!messageOffsetsMs || messageOffsetsMs.length === 0) {
-                return null;
-            }
-            let previousOffset = 0;
-            return originalMessages.map((_message, messageIndex) => {
-                const rawOffset = messageOffsetsMs[messageIndex];
-                const nextOffset = Number.isFinite(rawOffset) ? Math.max(0, Math.floor(rawOffset || 0)) : previousOffset;
-                previousOffset = Math.max(previousOffset, nextOffset);
-                return previousOffset;
-            });
-        }, [messageOffsetsMs, originalMessages]);
+        const normalizedMessageOffsetsMs = react.useMemo(() => normalizeMessageOffsets(messageOffsetsMs, originalMessages), [messageOffsetsMs, originalMessages]);
         // Playback state machine
         // RUNNING -> (user clicks Pause) -> PAUSING (finish current message) -> PAUSED
         // PAUSED -> (user clicks Resume) -> RUNNING
@@ -50869,193 +52736,48 @@
                 setIsSimulationComplete(false);
                 setResetNonce((nonce) => nonce + 1);
             };
-        }, [resetNonce, isResettable]);
+        }, [isResettable]);
         // Helper: Wait while paused (entered only between messages, never mid-typing)
         const waitIfPaused = async (isCancelledRef) => {
-            if (!pauseRequestedRef.current)
+            if (!pauseRequestedRef.current) {
                 return;
+            }
             setPlaybackState('PAUSED');
             // Busy wait with small sleeps until resume
             while (pauseRequestedRef.current) {
-                if (isCancelledRef())
+                if (isCancelledRef()) {
                     return;
+                }
                 await waitasecond.forTime(100);
             }
-            // Resumed
             setPlaybackState('RUNNING');
         };
         const requestPause = () => {
             if (playbackState === 'RUNNING') {
                 pauseRequestedRef.current = true;
-                // Will flip to PAUSING when current message completes
                 setPlaybackState('PAUSING');
             }
         };
         const resume = () => {
             pauseRequestedRef.current = false;
             if (playbackState !== 'RUNNING') {
-                // Actual state will become RUNNING after loop exits waitIfPaused
                 setPlaybackState('RUNNING');
             }
         };
-        /**
-         * Resolves deterministic waiting time before one message when fixed offsets are supplied.
-         */
-        const resolveOffsetDelayBeforeMessage = react.useCallback((messageIndex) => {
-            if (!normalizedMessageOffsetsMs) {
-                return 0;
-            }
-            const currentOffset = normalizedMessageOffsetsMs[messageIndex] || 0;
-            const previousOffset = messageIndex > 0 ? normalizedMessageOffsetsMs[messageIndex - 1] || 0 : 0;
-            return Math.max(0, currentOffset - previousOffset);
-        }, [normalizedMessageOffsetsMs]);
         react.useEffect(() => {
             let isCancelled = false;
-            const simulateChat = async () => {
-                var _a, _b;
-                // Reset state
-                setDisplayedMessages([]);
-                setLocalAppendedMessages([]);
-                setIsSimulationComplete(false);
-                if (originalMessages.length === 0) {
-                    setIsSimulationComplete(true);
-                    (_a = onSimulationCompleteRef.current) === null || _a === void 0 ? void 0 : _a.call(onSimulationCompleteRef);
-                    return;
-                }
-                // Show intermediate messages immediately
-                const showIntermediateMessages = delays.showIntermediateMessages || 0;
-                if (showIntermediateMessages > 0) {
-                    setDisplayedMessages(originalMessages.slice(0, showIntermediateMessages));
-                }
-                // Wait before first rendered message.
-                const firstMessageIndex = showIntermediateMessages;
-                const initialDelay = normalizedMessageOffsetsMs
-                    ? resolveOffsetDelayBeforeMessage(firstMessageIndex)
-                    : getDelay(delays.beforeFirstMessage, 1000);
-                if (initialDelay > 0) {
-                    await waitasecond.forTime(initialDelay);
-                }
-                if (isCancelled)
-                    return;
-                for (let i = showIntermediateMessages; i < originalMessages.length; i++) {
-                    // If a pause was requested earlier, we only pause between messages
-                    if (pauseRequestedRef.current) {
-                        await waitIfPaused(() => isCancelled);
-                        if (isCancelled)
-                            return;
-                    }
-                    if (isCancelled)
-                        return;
-                    const currentMessage = originalMessages[i];
-                    if (!currentMessage)
-                        continue;
-                    // Add delay between rendered messages.
-                    if (i > showIntermediateMessages) {
-                        if (normalizedMessageOffsetsMs) {
-                            const deterministicDelay = resolveOffsetDelayBeforeMessage(i);
-                            if (deterministicDelay > 0) {
-                                await waitasecond.forTime(deterministicDelay);
-                                if (isCancelled)
-                                    return;
-                            }
-                        }
-                        else {
-                            // Sometimes do a longer pause (agent switch or random)
-                            let didLongPause = false;
-                            if (delays.longPauseChance &&
-                                Math.random() < delays.longPauseChance &&
-                                i > 0 &&
-                                originalMessages[i].sender !== originalMessages[i - 1].sender) {
-                                await waitasecond.forTime(getDelay(delays.longPauseDuration, 2000));
-                                didLongPause = true;
-                                if (isCancelled)
-                                    return;
-                            }
-                            // Otherwise normal thinking delay
-                            if (!didLongPause) {
-                                await waitasecond.forTime(getDelay(delays.thinkingBetweenMessages, 2000));
-                                if (isCancelled)
-                                    return;
-                            }
-                        }
-                        // Pause check (still between messages)
-                        if (pauseRequestedRef.current) {
-                            await waitIfPaused(() => isCancelled);
-                            if (isCancelled)
-                                return;
-                        }
-                    }
-                    // Show incomplete message first (for typing effect)
-                    const incompleteMessage = {
-                        // channel: 'PROMPTBOOK_CHAT',
-                        id: currentMessage.id,
-                        createdAt: currentMessage.createdAt,
-                        sender: currentMessage.sender,
-                        content: '',
-                        isComplete: false,
-                        expectedAnswer: currentMessage.expectedAnswer,
-                        isVoiceCall: currentMessage.isVoiceCall,
-                    };
-                    setDisplayedMessages((prev) => [...prev, incompleteMessage]);
-                    // Split message content into words
-                    const words = currentMessage.content.split(' ');
-                    let currentContent = '';
-                    // Type each word with delay (randomized)
-                    for (let wordIndex = 0; wordIndex < words.length; wordIndex++) {
-                        if (isCancelled)
-                            return;
-                        const word = words[wordIndex];
-                        currentContent += (wordIndex > 0 ? ' ' : '') + word;
-                        // Update the message with current content
-                        const updatingMessage = {
-                            // channel: 'PROMPTBOOK_CHAT',
-                            id: currentMessage.id,
-                            createdAt: currentMessage.createdAt,
-                            sender: currentMessage.sender,
-                            content: currentContent,
-                            isComplete: false,
-                            expectedAnswer: currentMessage.expectedAnswer,
-                            isVoiceCall: currentMessage.isVoiceCall,
-                        };
-                        setDisplayedMessages((prev) => {
-                            const newMessages = [...prev];
-                            newMessages[newMessages.length - 1] = updatingMessage;
-                            return newMessages;
-                        });
-                        // Wait after word with extra delay (randomized)
-                        await waitasecond.forTime(getDelay(delays.waitAfterWord, 100) + getDelay(delays.extraWordDelay, 50));
-                        if (isCancelled)
-                            return;
-                    }
-                    // Mark message as complete
-                    const completeMessage = {
-                        // channel: 'PROMPTBOOK_CHAT',
-                        id: currentMessage.id,
-                        createdAt: currentMessage.createdAt,
-                        sender: currentMessage.sender,
-                        content: currentMessage.content,
-                        isComplete: true,
-                        expectedAnswer: currentMessage.expectedAnswer,
-                        isVoiceCall: currentMessage.isVoiceCall,
-                    };
-                    setDisplayedMessages((prev) => {
-                        const newMessages = [...prev];
-                        newMessages[newMessages.length - 1] = completeMessage;
-                        return newMessages;
-                    });
-                    if (!normalizedMessageOffsetsMs) {
-                        // Small pause after completing the message
-                        await waitasecond.forTime(200);
-                        if (isCancelled)
-                            return;
-                    }
-                    // Transition PAUSING -> PAUSED (after finishing current message)
-                    if (pauseRequestedRef.current && playbackState === 'PAUSING') ;
-                }
-                setIsSimulationComplete(true);
-                (_b = onSimulationCompleteRef.current) === null || _b === void 0 ? void 0 : _b.call(onSimulationCompleteRef);
-            };
-            simulateChat().catch((error) => {
+            simulateMockedChatPlayback({
+                delays,
+                originalMessages,
+                normalizedMessageOffsetsMs,
+                pauseRequestedRef,
+                waitIfPaused,
+                setDisplayedMessages,
+                setLocalAppendedMessages,
+                setIsSimulationComplete,
+                onSimulationCompleteRef,
+                isCancelledRef: () => isCancelled,
+            }).catch((error) => {
                 var _a;
                 if (!isCancelled) {
                     console.error('Error in MockedChat simulation:', error);
@@ -51075,7 +52797,6 @@
             delays.thinkingBetweenMessages,
             delays.waitAfterWord,
             delays.extraWordDelay,
-            resolveOffsetDelayBeforeMessage,
             resetNonce,
         ]);
         const renderedMessages = react.useMemo(() => [...displayedMessages, ...localAppendedMessages], [displayedMessages, localAppendedMessages]);
@@ -51123,103 +52844,273 @@
     }
 
     /**
-     * Renders TEAM conversation details, nested actions, and citations.
+     * Default label used when the agent name is unavailable.
      *
-     * @param options - TEAM modal rendering options.
+     * @private function of ChatToolCallModal
+     */
+    const DEFAULT_AGENT_LABEL = 'Agent';
+    /**
+     * Default label used when the teammate name is unavailable.
      *
      * @private function of ChatToolCallModal
      */
-    function TeamToolCallModalContent(options) {
-        var _a, _b, _c, _d, _e, _f;
-        const { teamResult, toolCallDate, teamToolCallSummary, selectedTeamToolCall, onSelectTeamToolCall, onClearSelectedTeamToolCall, teamProfiles, toolTitles, agentParticipant, buttonColor, } = options;
-        const teammateUrl = ((_a = teamResult.teammate) === null || _a === void 0 ? void 0 : _a.url) || '';
-        const baseTime = toolCallDate ? toolCallDate.getTime() : Date.now();
-        const teamToolCalls = teamToolCallSummary.toolCalls;
-        const teamCitations = teamToolCallSummary.citations;
-        const hasTeamToolCalls = teamToolCalls.length > 0;
-        const hasTeamCitations = teamCitations.length > 0;
-        const messages = (teamResult.conversation || [])
-            .filter((entry) => entry && entry.content)
-            .map((entry, index) => ({
+    const DEFAULT_TEAMMATE_LABEL = 'Teammate';
+    /**
+     * Default header color used when the agent does not define one.
+     *
+     * @private function of ChatToolCallModal
+     */
+    const DEFAULT_AGENT_HEADER_COLOR = '#64748b';
+    /**
+     * Default teammate accent color used across the TEAM modal.
+     *
+     * @private function of ChatToolCallModal
+     */
+    const DEFAULT_TEAMMATE_COLOR = '#0ea5e9';
+    /**
+     * Returns whether one TEAM conversation entry has renderable content.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function hasTeamConversationContent(entry) {
+        return Boolean(entry && entry.content);
+    }
+    /**
+     * Resolves which side of the TEAM conversation one entry belongs to.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function resolveTeamConversationSender(entry) {
+        return entry.sender === 'TEAMMATE' || entry.role === 'TEAMMATE' ? 'TEAMMATE' : 'AGENT';
+    }
+    /**
+     * Creates one conversation message for the TEAM preview chat.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function createTeamConversationMessage(entry, index, baseTime) {
+        return {
             id: `team-${index}`,
             createdAt: new Date(baseTime + index * 1000).toISOString(),
-            sender: entry.sender === 'TEAMMATE' || entry.role === 'TEAMMATE' ? 'TEAMMATE' : 'AGENT',
-            content: entry.content || '',
+            sender: resolveTeamConversationSender(entry),
+            content: entry.content,
             isComplete: true,
-        }));
-        if (messages.length === 0) {
-            if (teamResult.request) {
-                messages.push({
-                    id: 'team-request',
-                    createdAt: new Date(baseTime).toISOString(),
-                    sender: 'AGENT',
-                    content: teamResult.request,
-                    isComplete: true,
-                });
-            }
-            if (teamResult.response) {
-                messages.push({
-                    id: 'team-response',
-                    createdAt: new Date(baseTime + 1000).toISOString(),
-                    sender: 'TEAMMATE',
-                    content: teamResult.response,
-                    isComplete: true,
-                });
-            }
+        };
+    }
+    /**
+     * Appends the request/response fallback pair when no structured conversation is available.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function appendFallbackConversationMessages(messages, teamResult, baseTime) {
+        if (messages.length > 0) {
+            return;
+        }
+        if (teamResult.request) {
+            messages.push({
+                id: 'team-request',
+                createdAt: new Date(baseTime).toISOString(),
+                sender: 'AGENT',
+                content: teamResult.request,
+                isComplete: true,
+            });
+        }
+        if (teamResult.response) {
+            messages.push({
+                id: 'team-response',
+                createdAt: new Date(baseTime + 1000).toISOString(),
+                sender: 'TEAMMATE',
+                content: teamResult.response,
+                isComplete: true,
+            });
         }
-        const agentName = ((_c = (_b = teamResult.conversation) === null || _b === void 0 ? void 0 : _b.find((entry) => entry.sender === 'AGENT' || entry.role === 'AGENT')) === null || _c === void 0 ? void 0 : _c.name) || 'Agent';
-        const teammateConversationName = ((_e = (_d = teamResult.conversation) === null || _d === void 0 ? void 0 : _d.find((entry) => entry.sender === 'TEAMMATE' || entry.role === 'TEAMMATE')) === null || _e === void 0 ? void 0 : _e.name) || '';
+    }
+    /**
+     * Builds the conversation transcript shown in the TEAM modal.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function createTeamConversationMessages(teamResult, baseTime) {
+        const messages = (teamResult.conversation || [])
+            .filter(hasTeamConversationContent)
+            .map((entry, index) => createTeamConversationMessage(entry, index, baseTime));
+        appendFallbackConversationMessages(messages, teamResult, baseTime);
+        return messages;
+    }
+    /**
+     * Finds the first conversation name used by a specific sender.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function resolveConversationName(teamResult, sender, fallbackName) {
+        var _a, _b;
+        return (((_b = (_a = teamResult.conversation) === null || _a === void 0 ? void 0 : _a.find((entry) => resolveTeamConversationSender(entry) === sender)) === null || _b === void 0 ? void 0 : _b.name) || fallbackName);
+    }
+    /**
+     * Resolves the public teammate link when it points to a real agent.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function resolveTeammateLink(teammateUrl) {
+        return teammateUrl && teammateUrl !== 'VOID' && !isPseudoAgentUrl(teammateUrl) ? teammateUrl : undefined;
+    }
+    /**
+     * Builds the TEAM modal header data and chat participants.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function createTeamConversationViewModel({ agentParticipant, teamProfiles, teamResult, }) {
+        var _a, _b;
+        const teammateUrl = ((_a = teamResult.teammate) === null || _a === void 0 ? void 0 : _a.url) || '';
         const teammateProfile = teammateUrl ? teamProfiles[teammateUrl] : undefined;
         const teammateFallbackProfile = teammateUrl
             ? resolveAgentProfileFallback({
                 url: teammateUrl,
-                label: (_f = teamResult.teammate) === null || _f === void 0 ? void 0 : _f.label,
+                label: (_b = teamResult.teammate) === null || _b === void 0 ? void 0 : _b.label,
             })
-            : { label: 'Teammate', imageUrl: null };
+            : { label: DEFAULT_TEAMMATE_LABEL, imageUrl: null };
+        const agentName = resolveConversationName(teamResult, 'AGENT', DEFAULT_AGENT_LABEL);
+        const teammateConversationName = resolveConversationName(teamResult, 'TEAMMATE', '');
         const resolvedAgentLabel = resolvePreferredAgentLabel([agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.fullname, agentName], agentName);
-        const resolvedAgentAvatar = (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarSrc) || null;
-        const resolvedAgentAvatarDefinition = agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarDefinition;
-        const resolvedAgentAvatarVisualId = agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarVisualId;
-        const resolvedAgentHeaderColor = (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.color)
-            ? Color.fromSafe(agentParticipant.color).toHex()
-            : '#64748b';
         const resolvedTeammateLabel = resolvePreferredAgentLabel([teammateConversationName, teammateProfile === null || teammateProfile === void 0 ? void 0 : teammateProfile.label, teammateFallbackProfile.label], teammateFallbackProfile.label);
-        const resolvedTeammateAvatar = (teammateProfile === null || teammateProfile === void 0 ? void 0 : teammateProfile.imageUrl) || teammateFallbackProfile.imageUrl || null;
-        const teammateLink = teammateUrl && teammateUrl !== 'VOID' && !isPseudoAgentUrl(teammateUrl) ? teammateUrl : undefined;
-        const participants = [
-            {
-                name: 'AGENT',
-                fullname: resolvedAgentLabel,
-                color: (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.color) || '#64748b',
-                avatarSrc: resolvedAgentAvatar || undefined,
-                avatarDefinition: resolvedAgentAvatarDefinition,
-                avatarVisualId: resolvedAgentAvatarVisualId,
-                isMe: true,
-            },
-            {
-                name: 'TEAMMATE',
-                fullname: resolvedTeammateLabel,
-                color: '#0ea5e9',
-                avatarSrc: resolvedTeammateAvatar || undefined,
-            },
-        ];
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: classNames(styles$5.searchModalHeader, styles$5.teamModalHeader), children: jsxRuntime.jsxs("div", { className: styles$5.teamHeaderParticipants, children: [jsxRuntime.jsx(TeamHeaderProfile, { label: resolvedAgentLabel, avatarSrc: resolvedAgentAvatar, avatarDefinition: resolvedAgentAvatarDefinition, avatarVisualId: resolvedAgentAvatarVisualId, fallbackColor: resolvedAgentHeaderColor }), jsxRuntime.jsx("span", { className: styles$5.teamHeaderDivider, children: "talking with" }), jsxRuntime.jsx(TeamHeaderProfile, { label: resolvedTeammateLabel, avatarSrc: resolvedTeammateAvatar, fallbackColor: "#0ea5e9", href: teammateLink })] }) }), jsxRuntime.jsxs("div", { className: styles$5.searchModalContent, children: [messages.length > 0 ? (jsxRuntime.jsx("div", { className: styles$5.teamChatContainer, children: jsxRuntime.jsx(MockedChat, { title: `Chat between ${resolvedAgentLabel} and ${resolvedTeammateLabel}`, messages: messages, participants: participants, isResettable: false, isPausable: false, isSaveButtonEnabled: false, isCopyButtonEnabled: false, layout: "STANDALONE", delayConfig: {
-                                    // Note+TODO: For some strange reason, <MockedChat/> is not running and stays static on the initial frame, so doing this hack to force it to show the entire chat at once. Need to investigate why the animation is not running as expected and then just use `delayConfig={FAST_FLOW}`
-                                    ...FAST_FLOW,
-                                    beforeFirstMessage: 0,
-                                    showIntermediateMessages: messages.length,
-                                }, visualMode: "BUBBLE_MODE" }) })) : (jsxRuntime.jsx("div", { className: styles$5.noResults, children: "No teammate conversation available." })), (hasTeamToolCalls || hasTeamCitations) && (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallSection, children: [hasTeamToolCalls && (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsxRuntime.jsx("div", { className: styles$5.teamToolCallHeading, children: "Actions" }), jsxRuntime.jsx("div", { className: styles$5.teamToolCallChips, children: teamToolCalls.map((toolCallEntry, index) => {
-                                                const chipletInfo = getToolCallChipletInfo(toolCallEntry.toolCall, undefined, toolTitles);
-                                                const chipletText = buildToolCallChipText(chipletInfo);
-                                                return (jsxRuntime.jsxs("button", { className: styles$5.completedToolCall, onClick: () => {
-                                                        onSelectTeamToolCall(toolCallEntry);
-                                                    }, children: [jsxRuntime.jsx("span", { children: chipletText }), jsxRuntime.jsxs("span", { className: styles$5.toolCallOrigin, children: ["by ", toolCallEntry.origin.label] })] }, `team-tool-${index}`));
-                                            }) })] })), hasTeamCitations && (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsxRuntime.jsx("div", { className: styles$5.teamToolCallHeading, children: "Sources" }), jsxRuntime.jsx("div", { className: styles$5.teamToolCallChips, children: teamCitations.map((citation, index) => (jsxRuntime.jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}` }, `team-source-${citation.source}-${index}`))) })] })), selectedTeamToolCall && (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallDetails, children: [jsxRuntime.jsxs("div", { className: styles$5.teamToolCallDetailsHeader, children: [jsxRuntime.jsxs("span", { className: styles$5.teamToolCallDetailsTitle, children: ["Action details", jsxRuntime.jsxs("span", { className: styles$5.toolCallOrigin, children: ["by ", selectedTeamToolCall.origin.label] })] }), jsxRuntime.jsx("button", { type: "button", className: styles$5.teamToolCallDetailsClear, onClick: onClearSelectedTeamToolCall, children: "Clear" })] }), renderToolCallDetails({
-                                            toolCall: selectedTeamToolCall.toolCall,
-                                            toolTitles,
-                                            agentParticipant,
-                                            buttonColor,
-                                        })] }))] }))] })] }));
+        const agentHeader = {
+            label: resolvedAgentLabel,
+            avatarSrc: (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarSrc) || null,
+            avatarDefinition: agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarDefinition,
+            avatarVisualId: agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.avatarVisualId,
+            fallbackColor: (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.color)
+                ? Color.fromSafe(agentParticipant.color).toHex()
+                : DEFAULT_AGENT_HEADER_COLOR,
+        };
+        const teammateHeader = {
+            label: resolvedTeammateLabel,
+            avatarSrc: (teammateProfile === null || teammateProfile === void 0 ? void 0 : teammateProfile.imageUrl) || teammateFallbackProfile.imageUrl || null,
+            fallbackColor: DEFAULT_TEAMMATE_COLOR,
+            href: resolveTeammateLink(teammateUrl),
+        };
+        return {
+            agentHeader,
+            teammateHeader,
+            participants: [
+                {
+                    name: 'AGENT',
+                    fullname: agentHeader.label,
+                    color: (agentParticipant === null || agentParticipant === void 0 ? void 0 : agentParticipant.color) || DEFAULT_AGENT_HEADER_COLOR,
+                    avatarSrc: agentHeader.avatarSrc || undefined,
+                    avatarDefinition: agentHeader.avatarDefinition,
+                    avatarVisualId: agentHeader.avatarVisualId,
+                    isMe: true,
+                },
+                {
+                    name: 'TEAMMATE',
+                    fullname: teammateHeader.label,
+                    color: DEFAULT_TEAMMATE_COLOR,
+                    avatarSrc: teammateHeader.avatarSrc || undefined,
+                },
+            ],
+        };
+    }
+    /**
+     * Renders the TEAM conversation header profiles.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamConversationHeader(props) {
+        const { agentHeader, teammateHeader } = props;
+        return (jsxRuntime.jsx("div", { className: classNames(styles$5.searchModalHeader, styles$5.teamModalHeader), children: jsxRuntime.jsxs("div", { className: styles$5.teamHeaderParticipants, children: [jsxRuntime.jsx(TeamHeaderProfile, { label: agentHeader.label, avatarSrc: agentHeader.avatarSrc, avatarDefinition: agentHeader.avatarDefinition, avatarVisualId: agentHeader.avatarVisualId, fallbackColor: agentHeader.fallbackColor }), jsxRuntime.jsx("span", { className: styles$5.teamHeaderDivider, children: "talking with" }), jsxRuntime.jsx(TeamHeaderProfile, { label: teammateHeader.label, avatarSrc: teammateHeader.avatarSrc, fallbackColor: teammateHeader.fallbackColor, href: teammateHeader.href })] }) }));
+    }
+    /**
+     * Renders the TEAM conversation transcript or the empty-state fallback.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamConversationSection(props) {
+        const { agentLabel, teammateLabel, messages, participants } = props;
+        if (messages.length === 0) {
+            return jsxRuntime.jsx("div", { className: styles$5.noResults, children: "No teammate conversation available." });
+        }
+        return (jsxRuntime.jsx("div", { className: styles$5.teamChatContainer, children: jsxRuntime.jsx(MockedChat, { title: `Chat between ${agentLabel} and ${teammateLabel}`, messages: messages, participants: participants, isResettable: false, isPausable: false, isSaveButtonEnabled: false, isCopyButtonEnabled: false, layout: "STANDALONE", delayConfig: {
+                    // Note+TODO: For some strange reason, <MockedChat/> is not running and stays static on the initial frame, so doing this hack to force it to show the entire chat at once. Need to investigate why the animation is not running as expected and then just use `delayConfig={FAST_FLOW}`
+                    ...FAST_FLOW,
+                    beforeFirstMessage: 0,
+                    showIntermediateMessages: messages.length,
+                }, visualMode: "BUBBLE_MODE" }) }));
+    }
+    /**
+     * Renders action chips for teammate-executed tool calls.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamToolCallActionsGroup(props) {
+        const { onSelectTeamToolCall, teamToolCalls, toolTitles } = props;
+        if (teamToolCalls.length === 0) {
+            return null;
+        }
+        return (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsxRuntime.jsx("div", { className: styles$5.teamToolCallHeading, children: "Actions" }), jsxRuntime.jsx("div", { className: styles$5.teamToolCallChips, children: teamToolCalls.map((toolCallEntry, index) => {
+                        const chipletInfo = getToolCallChipletInfo(toolCallEntry.toolCall, undefined, toolTitles);
+                        const chipletText = buildToolCallChipText(chipletInfo);
+                        return (jsxRuntime.jsxs("button", { className: styles$5.completedToolCall, onClick: () => {
+                                onSelectTeamToolCall(toolCallEntry);
+                            }, children: [jsxRuntime.jsx("span", { children: chipletText }), jsxRuntime.jsxs("span", { className: styles$5.toolCallOrigin, children: ["by ", toolCallEntry.origin.label] })] }, `team-tool-${index}`));
+                    }) })] }));
+    }
+    /**
+     * Renders citations surfaced from the teammate exchange.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamToolCallSourcesGroup(props) {
+        const { teamCitations } = props;
+        if (teamCitations.length === 0) {
+            return null;
+        }
+        return (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallGroup, children: [jsxRuntime.jsx("div", { className: styles$5.teamToolCallHeading, children: "Sources" }), jsxRuntime.jsx("div", { className: styles$5.teamToolCallChips, children: teamCitations.map((citation, index) => (jsxRuntime.jsx(SourceChip, { citation: citation, suffix: `by ${citation.origin.label}` }, `team-source-${citation.source}-${index}`))) })] }));
+    }
+    /**
+     * Renders the nested action details for the selected teammate tool call.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamToolCallDetailsPanel(props) {
+        const { agentParticipant, buttonColor, onClearSelectedTeamToolCall, selectedTeamToolCall, toolTitles } = props;
+        if (!selectedTeamToolCall) {
+            return null;
+        }
+        return (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallDetails, children: [jsxRuntime.jsxs("div", { className: styles$5.teamToolCallDetailsHeader, children: [jsxRuntime.jsxs("span", { className: styles$5.teamToolCallDetailsTitle, children: ["Action details", jsxRuntime.jsxs("span", { className: styles$5.toolCallOrigin, children: ["by ", selectedTeamToolCall.origin.label] })] }), jsxRuntime.jsx("button", { type: "button", className: styles$5.teamToolCallDetailsClear, onClick: onClearSelectedTeamToolCall, children: "Clear" })] }), renderToolCallDetails({
+                    toolCall: selectedTeamToolCall.toolCall,
+                    toolTitles,
+                    agentParticipant,
+                    buttonColor,
+                })] }));
+    }
+    /**
+     * Renders the nested tool-call and citation summary below the TEAM transcript.
+     *
+     * @private component of ChatToolCallModal
+     */
+    function TeamToolCallSummarySection(props) {
+        const { agentParticipant, buttonColor, onClearSelectedTeamToolCall, onSelectTeamToolCall, selectedTeamToolCall, teamToolCallSummary, toolTitles, } = props;
+        const hasSummaryContent = teamToolCallSummary.toolCalls.length > 0 || teamToolCallSummary.citations.length > 0;
+        if (!hasSummaryContent) {
+            return null;
+        }
+        return (jsxRuntime.jsxs("div", { className: styles$5.teamToolCallSection, children: [jsxRuntime.jsx(TeamToolCallActionsGroup, { teamToolCalls: teamToolCallSummary.toolCalls, onSelectTeamToolCall: onSelectTeamToolCall, toolTitles: toolTitles }), jsxRuntime.jsx(TeamToolCallSourcesGroup, { teamCitations: teamToolCallSummary.citations }), jsxRuntime.jsx(TeamToolCallDetailsPanel, { selectedTeamToolCall: selectedTeamToolCall, onClearSelectedTeamToolCall: onClearSelectedTeamToolCall, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor })] }));
+    }
+    /**
+     * Renders TEAM conversation details, nested actions, and citations.
+     *
+     * @private function of ChatToolCallModal
+     */
+    function TeamToolCallModalContent(options) {
+        const { teamResult, toolCallDate, teamToolCallSummary, selectedTeamToolCall, onSelectTeamToolCall, onClearSelectedTeamToolCall, teamProfiles, toolTitles, agentParticipant, buttonColor, } = options;
+        const baseTime = toolCallDate ? toolCallDate.getTime() : Date.now();
+        const messages = createTeamConversationMessages(teamResult, baseTime);
+        const { agentHeader, teammateHeader, participants } = createTeamConversationViewModel({
+            teamResult,
+            teamProfiles,
+            agentParticipant,
+        });
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(TeamConversationHeader, { agentHeader: agentHeader, teammateHeader: teammateHeader }), jsxRuntime.jsxs("div", { className: styles$5.searchModalContent, children: [jsxRuntime.jsx(TeamConversationSection, { agentLabel: agentHeader.label, teammateLabel: teammateHeader.label, messages: messages, participants: participants }), jsxRuntime.jsx(TeamToolCallSummarySection, { teamToolCallSummary: teamToolCallSummary, selectedTeamToolCall: selectedTeamToolCall, onSelectTeamToolCall: onSelectTeamToolCall, onClearSelectedTeamToolCall: onClearSelectedTeamToolCall, toolTitles: toolTitles, agentParticipant: agentParticipant, buttonColor: buttonColor })] })] }));
     }
 
     /**
@@ -51671,8 +53562,314 @@
 
     /**
      * Debounce window for synchronizing `isAutoScrolling` with the latest scroll position.
+     *
+     * @private function of `useChatAutoScroll`
      */
     const SCROLL_EVENT_DEBOUNCE_MS = 50;
+    /**
+     * Faster follow-up used while the latest assistant message is still streaming.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    const STREAMING_SCROLL_CHECK_DELAY_MS = 10;
+    /**
+     * Viewport width treated as mobile for chat scrolling behavior.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    const MOBILE_BREAKPOINT_PX = 768;
+    /**
+     * Mobile-device user agent matcher used by the chat viewport detection.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    const MOBILE_DEVICE_USER_AGENT_PATTERN = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i;
+    /**
+     * Detects whether the current viewport should use the mobile scrolling path.
+     *
+     * @returns `true` when the viewport or device matches the mobile heuristics.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function isMobileChatViewport() {
+        return window.innerWidth <= MOBILE_BREAKPOINT_PX || MOBILE_DEVICE_USER_AGENT_PATTERN.test(navigator.userAgent);
+    }
+    /**
+     * Tracks whether the chat should currently use mobile scrolling behavior.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function useMobileChatViewport() {
+        const [isMobile, setIsMobile] = react.useState(false);
+        react.useEffect(() => {
+            const handleViewportChange = () => {
+                setIsMobile(isMobileChatViewport());
+            };
+            handleViewportChange();
+            window.addEventListener('resize', handleViewportChange);
+            return () => window.removeEventListener('resize', handleViewportChange);
+        }, []);
+        return isMobile;
+    }
+    /**
+     * Checks whether the messages container is effectively scrolled to the bottom.
+     *
+     * @param element - Scrollable chat messages container.
+     * @param bottomThreshold - Distance from the bottom still considered "at bottom".
+     * @returns `true` when the container is within the threshold from the bottom.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function isChatScrolledToBottom(element, bottomThreshold) {
+        const { scrollTop, scrollHeight, clientHeight } = element;
+        return scrollTop + clientHeight >= scrollHeight - bottomThreshold;
+    }
+    /**
+     * Clears a scheduled timeout when one is currently active.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function clearScheduledTimeout(timeoutRef) {
+        if (timeoutRef.current) {
+            clearTimeout(timeoutRef.current);
+            timeoutRef.current = null;
+        }
+    }
+    /**
+     * Performs the concrete scroll-to-bottom operation for the current platform.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function performScrollToBottom({ behavior, chatMessagesElement, isMobile, smoothScroll, }) {
+        if (isMobile) {
+            chatMessagesElement.scrollTo({
+                top: chatMessagesElement.scrollHeight,
+                behavior: smoothScroll ? behavior : 'auto',
+            });
+            return;
+        }
+        if (smoothScroll && behavior === 'smooth') {
+            chatMessagesElement.style.scrollBehavior = 'smooth';
+            chatMessagesElement.scrollTop = chatMessagesElement.scrollHeight;
+            chatMessagesElement.style.scrollBehavior = 'auto';
+            return;
+        }
+        chatMessagesElement.scrollTop = chatMessagesElement.scrollHeight;
+    }
+    /**
+     * Detects whether the user currently has a non-collapsed selection inside the chat container.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function hasExpandedSelectionInChat(chatMessagesElement) {
+        const selection = window.getSelection();
+        if (!selection || selection.rangeCount === 0 || selection.isCollapsed) {
+            return false;
+        }
+        const range = selection.getRangeAt(0);
+        return chatMessagesElement.contains(range.startContainer) || chatMessagesElement.contains(range.endContainer);
+    }
+    /**
+     * Computes the scroll metrics needed to decide whether new content should trigger auto-scroll.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function getMessagesChangeMetrics({ bottomThreshold, chatMessagesElement, previousScrollHeight, }) {
+        const currentScrollHeight = chatMessagesElement.scrollHeight;
+        return {
+            currentScrollHeight,
+            hasNewContent: currentScrollHeight > previousScrollHeight,
+            wasAtBottomBeforeNewContent: chatMessagesElement.scrollTop + chatMessagesElement.clientHeight >= previousScrollHeight - bottomThreshold,
+        };
+    }
+    /**
+     * Evaluates whether new content should keep the chat pinned to the latest message.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function shouldAutoScrollForMessagesChange({ hasManualScroll, hasNewContent, hasSelectionInChat, isAutoScrolling, wasAtBottomBeforeNewContent, }) {
+        return hasNewContent && isAutoScrolling && wasAtBottomBeforeNewContent && !hasSelectionInChat && !hasManualScroll;
+    }
+    /**
+     * Evaluates whether the latest DOM update should schedule a follow-up scroll.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function evaluateMessagesChangeAutoScroll({ bottomThreshold, chatMessagesElement, hasManualScroll, isAutoScrolling, previousScrollHeight, }) {
+        const metrics = getMessagesChangeMetrics({
+            bottomThreshold,
+            chatMessagesElement,
+            previousScrollHeight,
+        });
+        return {
+            currentScrollHeight: metrics.currentScrollHeight,
+            shouldScheduleScroll: shouldAutoScrollForMessagesChange({
+                hasManualScroll,
+                hasNewContent: metrics.hasNewContent,
+                hasSelectionInChat: hasExpandedSelectionInChat(chatMessagesElement),
+                isAutoScrolling,
+                wasAtBottomBeforeNewContent: metrics.wasAtBottomBeforeNewContent,
+            }),
+        };
+    }
+    /**
+     * Chooses the follow-up delay for the next automatic scroll attempt.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function getMessagesChangeDelay(isStreaming, scrollCheckDelay) {
+        return isStreaming ? STREAMING_SCROLL_CHECK_DELAY_MS : scrollCheckDelay;
+    }
+    /**
+     * Chooses the scroll behavior for the next automatic scroll attempt.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function getMessagesChangeScrollBehavior(isStreaming) {
+        return isStreaming ? 'auto' : 'smooth';
+    }
+    /**
+     * Updates the manual-scroll and auto-scroll flags from the latest direct scroll event.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function updateAutoScrollStateFromScroll({ hasManualScrollRef, isAtBottom, isAutoScrolling, setIsAutoScrolling, }) {
+        hasManualScrollRef.current = !isAtBottom;
+        if (!isAtBottom && isAutoScrolling) {
+            setIsAutoScrolling(false);
+        }
+    }
+    /**
+     * Schedules the debounced reconciliation that keeps `isAutoScrolling` in sync with the viewport.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function scheduleAutoScrollStateSync({ element, scrollTimeoutRef, syncAutoScrollState, }) {
+        clearScheduledTimeout(scrollTimeoutRef);
+        scrollTimeoutRef.current = setTimeout(() => {
+            syncAutoScrollState(element);
+        }, SCROLL_EVENT_DEBOUNCE_MS);
+    }
+    /**
+     * Schedules the delayed scroll that follows a new message or streaming chunk.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function scheduleMessagesChangeAutoScroll({ hasManualScrollRef, isStreaming, messagesChangeTimeoutRef, scrollCheckDelay, scrollToBottom, }) {
+        clearScheduledTimeout(messagesChangeTimeoutRef);
+        messagesChangeTimeoutRef.current = setTimeout(() => {
+            if (hasManualScrollRef.current) {
+                return;
+            }
+            scrollToBottom(getMessagesChangeScrollBehavior(isStreaming));
+        }, getMessagesChangeDelay(isStreaming, scrollCheckDelay));
+    }
+    /**
+     * Initializes the chat container reference and restores the pinned-to-bottom state when needed.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function initializeChatMessagesElement({ element, isAutoScrolling, lastScrollHeightRef, scrollToBottom, }) {
+        lastScrollHeightRef.current = element.scrollHeight;
+        if (!isAutoScrolling) {
+            return;
+        }
+        requestAnimationFrame(() => {
+            scrollToBottom('auto');
+        });
+    }
+    /**
+     * Creates the debounced scroll handler that reacts to direct user scrolling.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function useChatScrollHandler({ checkIfAtBottom, hasManualScrollRef, isAutoScrolling, scrollTimeoutRef, setIsAutoScrolling, }) {
+        const syncAutoScrollState = react.useCallback((element) => {
+            const isAtBottom = checkIfAtBottom(element);
+            setIsAutoScrolling((currentValue) => (currentValue === isAtBottom ? currentValue : isAtBottom));
+        }, [checkIfAtBottom, setIsAutoScrolling]);
+        return react.useCallback((event) => {
+            const element = event.currentTarget;
+            const isAtBottom = checkIfAtBottom(element);
+            updateAutoScrollStateFromScroll({
+                hasManualScrollRef,
+                isAtBottom,
+                isAutoScrolling,
+                setIsAutoScrolling,
+            });
+            scheduleAutoScrollStateSync({
+                element,
+                scrollTimeoutRef,
+                syncAutoScrollState,
+            });
+        }, [
+            checkIfAtBottom,
+            hasManualScrollRef,
+            isAutoScrolling,
+            scrollTimeoutRef,
+            setIsAutoScrolling,
+            syncAutoScrollState,
+        ]);
+    }
+    /**
+     * Creates the message-change handler that decides whether the chat should follow new content.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function useChatMessagesChangeHandler({ bottomThreshold, chatMessagesRef, hasManualScrollRef, isAutoScrolling, lastScrollHeightRef, messagesChangeTimeoutRef, scrollCheckDelay, scrollToBottom, }) {
+        return react.useCallback((isStreaming = false) => {
+            const chatMessagesElement = chatMessagesRef.current;
+            if (!chatMessagesElement) {
+                return;
+            }
+            const autoScrollDecision = evaluateMessagesChangeAutoScroll({
+                bottomThreshold,
+                chatMessagesElement,
+                hasManualScroll: hasManualScrollRef.current,
+                isAutoScrolling,
+                previousScrollHeight: lastScrollHeightRef.current,
+            });
+            lastScrollHeightRef.current = autoScrollDecision.currentScrollHeight;
+            if (!autoScrollDecision.shouldScheduleScroll) {
+                return;
+            }
+            scheduleMessagesChangeAutoScroll({
+                hasManualScrollRef,
+                isStreaming,
+                messagesChangeTimeoutRef,
+                scrollCheckDelay,
+                scrollToBottom,
+            });
+        }, [
+            bottomThreshold,
+            chatMessagesRef,
+            hasManualScrollRef,
+            isAutoScrolling,
+            lastScrollHeightRef,
+            messagesChangeTimeoutRef,
+            scrollCheckDelay,
+            scrollToBottom,
+        ]);
+    }
+    /**
+     * Creates the ref callback that captures the chat container and initializes its scroll state.
+     *
+     * @private function of `useChatAutoScroll`
+     */
+    function useChatMessagesRefCallback({ chatMessagesRef, isAutoScrolling, lastScrollHeightRef, scrollToBottom, }) {
+        return react.useCallback((element) => {
+            chatMessagesRef.current = element;
+            if (!element) {
+                return;
+            }
+            initializeChatMessagesElement({
+                element,
+                isAutoScrolling,
+                lastScrollHeightRef,
+                scrollToBottom,
+            });
+        }, [chatMessagesRef, isAutoScrolling, lastScrollHeightRef, scrollToBottom]);
+    }
     /**
      * Hook for managing auto-scroll behavior in chat components
      *
@@ -51686,153 +53883,61 @@
      */
     function useChatAutoScroll(config = {}) {
         const { bottomThreshold = 100, smoothScroll = true, scrollCheckDelay = 100 } = config;
+        const isMobile = useMobileChatViewport();
         const [isAutoScrolling, setIsAutoScrolling] = react.useState(true);
-        const [isMobile, setIsMobile] = react.useState(false);
         const chatMessagesRef = react.useRef(null);
         const scrollTimeoutRef = react.useRef(null);
         const lastScrollHeightRef = react.useRef(0);
-        // Tracks whether the user moved away from the bottom so we can suspend auto-scroll.
         const hasManualScrollRef = react.useRef(false);
-        // Detect mobile device
-        react.useEffect(() => {
-            const checkMobile = () => {
-                const isMobileDevice = window.innerWidth <= 768 ||
-                    /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
-                setIsMobile(isMobileDevice);
-            };
-            checkMobile();
-            window.addEventListener('resize', checkMobile);
-            return () => window.removeEventListener('resize', checkMobile);
-        }, []);
-        // Check if user is at the bottom of the chat
-        const checkIfAtBottom = react.useCallback((element) => {
-            const { scrollTop, scrollHeight, clientHeight } = element;
-            return scrollTop + clientHeight >= scrollHeight - bottomThreshold;
-        }, [bottomThreshold]);
-        // Scroll to bottom function
+        const messagesChangeTimeoutRef = react.useRef(null);
+        const checkIfAtBottom = react.useCallback((element) => isChatScrolledToBottom(element, bottomThreshold), [bottomThreshold]);
         const scrollToBottom = react.useCallback((behavior = 'smooth') => {
             const chatMessagesElement = chatMessagesRef.current;
-            if (!chatMessagesElement)
+            if (!chatMessagesElement) {
                 return;
-            if (isMobile) {
-                // Mobile-optimized scrolling
-                chatMessagesElement.scrollTo({
-                    top: chatMessagesElement.scrollHeight,
-                    behavior: smoothScroll ? behavior : 'auto',
-                });
-            }
-            else {
-                // Desktop scrolling
-                if (smoothScroll && behavior === 'smooth') {
-                    chatMessagesElement.style.scrollBehavior = 'smooth';
-                    chatMessagesElement.scrollTop = chatMessagesElement.scrollHeight;
-                    chatMessagesElement.style.scrollBehavior = 'auto';
-                }
-                else {
-                    chatMessagesElement.scrollTop = chatMessagesElement.scrollHeight;
-                }
             }
+            performScrollToBottom({
+                behavior,
+                chatMessagesElement,
+                isMobile,
+                smoothScroll,
+            });
             hasManualScrollRef.current = false;
         }, [isMobile, smoothScroll]);
-        // Handle scroll events
-        const handleScroll = react.useCallback((event) => {
-            const element = event.target;
-            if (!element)
-                return;
-            const atBottom = checkIfAtBottom(element);
-            hasManualScrollRef.current = !atBottom;
-            // User scroll should take precedence over app-driven scroll intent.
-            if (!atBottom && isAutoScrolling) {
-                setIsAutoScrolling(false);
-            }
-            // Clear any pending scroll timeout
-            if (scrollTimeoutRef.current) {
-                clearTimeout(scrollTimeoutRef.current);
-            }
-            // Debounce scroll position check to avoid too frequent updates
-            scrollTimeoutRef.current = setTimeout(() => {
-                const isAtBottom = checkIfAtBottom(element);
-                setIsAutoScrolling((currentState) => (currentState === isAtBottom ? currentState : isAtBottom));
-            }, SCROLL_EVENT_DEBOUNCE_MS);
-        }, [checkIfAtBottom, isAutoScrolling]);
-        const messagesChangeTimeoutRef = react.useRef(null);
-        // Auto-scroll when messages change (if user is at bottom)
-        const handleMessagesChange = react.useCallback((isStreaming = false) => {
-            const chatMessagesElement = chatMessagesRef.current;
-            if (!chatMessagesElement)
-                return;
-            // Check if this is a new message (scroll height increased)
-            const previousScrollHeight = lastScrollHeightRef.current;
-            const currentScrollHeight = chatMessagesElement.scrollHeight;
-            const hasNewContent = currentScrollHeight > previousScrollHeight;
-            const wasAtBottomBeforeNewContent = chatMessagesElement.scrollTop + chatMessagesElement.clientHeight >=
-                previousScrollHeight - bottomThreshold;
-            lastScrollHeightRef.current = currentScrollHeight;
-            if (!hasNewContent)
-                return;
-            // Only auto-scroll if user does NOT have a selection inside chat container
-            const selection = window.getSelection();
-            let hasSelectionInChat = false;
-            if (selection && selection.rangeCount > 0) {
-                const range = selection.getRangeAt(0);
-                if (chatMessagesElement.contains(range.startContainer) ||
-                    chatMessagesElement.contains(range.endContainer)) {
-                    if (!selection.isCollapsed) {
-                        hasSelectionInChat = true;
-                    }
-                }
-            }
-            if (isAutoScrolling && wasAtBottomBeforeNewContent && !hasSelectionInChat && !hasManualScrollRef.current) {
-                if (messagesChangeTimeoutRef.current) {
-                    clearTimeout(messagesChangeTimeoutRef.current);
-                }
-                // Delay scroll slightly to ensure DOM has updated
-                messagesChangeTimeoutRef.current = setTimeout(() => {
-                    if (hasManualScrollRef.current) {
-                        return;
-                    }
-                    scrollToBottom(isStreaming ? 'auto' : 'smooth');
-                }, isStreaming ? 10 : scrollCheckDelay);
-            }
-        }, [bottomThreshold, isAutoScrolling, scrollToBottom, scrollCheckDelay]);
-        // Ref callback for chat messages container
-        const chatMessagesRefCallback = react.useCallback((element) => {
-            chatMessagesRef.current = element;
-            if (element) {
-                // Update last scroll height
-                lastScrollHeightRef.current = element.scrollHeight;
-                // If auto-scrolling is enabled, scroll to bottom
-                if (isAutoScrolling) {
-                    // Use requestAnimationFrame for smoother initial scroll
-                    requestAnimationFrame(() => {
-                        scrollToBottom('auto');
-                    });
-                }
-            }
-        }, [isAutoScrolling, scrollToBottom]);
-        // Manual scroll to bottom (for button click)
-        const handleScrollToBottomClick = react.useCallback(() => {
-            setIsAutoScrolling(true);
-            scrollToBottom('smooth');
-        }, [scrollToBottom]);
-        // Force auto-scroll back on (useful for programmatic control)
-        const enableAutoScroll = react.useCallback(() => {
+        const handleScroll = useChatScrollHandler({
+            checkIfAtBottom,
+            hasManualScrollRef,
+            isAutoScrolling,
+            scrollTimeoutRef,
+            setIsAutoScrolling,
+        });
+        const handleMessagesChange = useChatMessagesChangeHandler({
+            bottomThreshold,
+            chatMessagesRef,
+            hasManualScrollRef,
+            isAutoScrolling,
+            lastScrollHeightRef,
+            messagesChangeTimeoutRef,
+            scrollCheckDelay,
+            scrollToBottom,
+        });
+        const chatMessagesRefCallback = useChatMessagesRefCallback({
+            chatMessagesRef,
+            isAutoScrolling,
+            lastScrollHeightRef,
+            scrollToBottom,
+        });
+        const activateAutoScroll = react.useCallback(() => {
             setIsAutoScrolling(true);
             scrollToBottom('smooth');
         }, [scrollToBottom]);
-        // Disable auto-scroll (useful for programmatic control)
         const disableAutoScroll = react.useCallback(() => {
             setIsAutoScrolling(false);
         }, []);
-        // Cleanup timeout on unmount
         react.useEffect(() => {
             return () => {
-                if (scrollTimeoutRef.current) {
-                    clearTimeout(scrollTimeoutRef.current);
-                }
-                if (messagesChangeTimeoutRef.current) {
-                    clearTimeout(messagesChangeTimeoutRef.current);
-                }
+                clearScheduledTimeout(scrollTimeoutRef);
+                clearScheduledTimeout(messagesChangeTimeoutRef);
             };
         }, []);
         return {
@@ -51840,8 +53945,8 @@
             chatMessagesRef: chatMessagesRefCallback,
             handleScroll,
             handleMessagesChange,
-            scrollToBottom: handleScrollToBottomClick,
-            enableAutoScroll,
+            scrollToBottom: activateAutoScroll,
+            enableAutoScroll: activateAutoScroll,
             disableAutoScroll,
             isMobile,
         };