@runtypelabs/persona 3.10.1 → 3.12.0

package/dist/install.global.js

@@ -1,2 +1,2 @@
-"use strict";var SiteAgentInstaller=(()=>{var w=Object.defineProperty;var P=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var W=Object.prototype.hasOwnProperty;var T=(s,i,d,t)=>{if(i&&typeof i=="object"||typeof i=="function")for(let a of j(i))!W.call(s,a)&&a!==d&&w(s,a,{get:()=>i[a],enumerable:!(t=P(i,a))||t.enumerable});return s};var _=s=>T(w({},"__esModule",{value:!0}),s);var F={};(function(){"use strict";if(window.__siteAgentInstallerLoaded)return;window.__siteAgentInstallerLoaded=!0;let i=(()=>{let n=document.currentScript;if(!n)return{};let e={},o=n.getAttribute("data-config");if(o)try{let c=JSON.parse(o);if(c.config){let{__proto__:E,constructor:M,prototype:$,...v}=c;Object.assign(e,v)}else e.config=c}catch(c){console.error("Failed to parse data-config JSON:",c)}let r=n.getAttribute("data-runtype-token");r&&(e.clientToken=r);let l=n.getAttribute("data-flow-id");l&&(e.flowId=l);let f=n.getAttribute("data-api-url");f&&(e.apiUrl=f);let p=n.getAttribute("data-preview-param");return p&&(e.previewQueryParam=p),e})(),t={...window.siteAgentConfig||{},...i};if(!(()=>{if(!t.previewQueryParam)return!0;let e=new URLSearchParams(window.location.search).get(t.previewQueryParam);return e!==null&&e!==""&&e.toLowerCase()!=="false"&&e!=="0"})())return;let m=t.version||"latest",A=t.cdn||"jsdelivr",C=t.autoInit!==!1,h=()=>{if(t.cssUrl&&t.jsUrl)return{cssUrl:t.cssUrl,jsUrl:t.jsUrl};let e=`/npm/@runtypelabs/persona@${m}/dist`;return A==="unpkg"?{cssUrl:`https://unpkg.com${e}/widget.css`,jsUrl:`https://unpkg.com${e}/index.global.js`}:{cssUrl:`https://cdn.jsdelivr.net${e}/widget.css`,jsUrl:`https://cdn.jsdelivr.net${e}/index.global.js`}},{cssUrl:g,jsUrl:u}=h(),y=()=>!!document.head.querySelector("link[data-persona]")||!!document.head.querySelector('link[href*="widget.css"]'),k=()=>!!window.AgentWidget,S=n=>{let e=!1,o=()=>{e||(e=!0,n())},r=()=>{typeof requestIdleCallback!="undefined"?requestIdleCallback(()=>{requestAnimationFrame(()=>{requestAnimationFrame(o)})},{timeout:3e3}):setTimeout(o,300)};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",r):r()},U=()=>new Promise((n,e)=>{if(y()){n();return}let o=document.createElement("link");o.rel="stylesheet",o.href=g,o.setAttribute("data-persona","true"),o.onload=()=>n(),o.onerror=()=>e(new Error(`Failed to load CSS from ${g}`)),document.head.appendChild(o)}),b=()=>new Promise((n,e)=>{if(k()){n();return}let o=document.createElement("script");o.src=u,o.async=!0,o.onload=()=>n(),o.onerror=()=>e(new Error(`Failed to load JS from ${u}`)),document.head.appendChild(o)}),I=()=>{var r;if(!window.AgentWidget||!window.AgentWidget.initAgentWidget){console.warn("AgentWidget not available. Make sure the script loaded successfully.");return}let n=t.target||"body",e={...t.config};if(t.apiUrl&&!e.apiUrl&&(e.apiUrl=t.apiUrl),t.clientToken&&!e.clientToken&&(e.clientToken=t.clientToken),t.flowId&&!e.flowId&&(e.flowId=t.flowId),!(!(e.apiUrl||e.clientToken)&&Object.keys(e).length===0)){!e.postprocessMessage&&window.AgentWidget.markdownPostprocessor&&(e.postprocessMessage=({text:l})=>window.AgentWidget.markdownPostprocessor(l));try{window.AgentWidget.initAgentWidget({target:n,config:e,useShadowDom:(r=t.useShadowDom)!=null?r:!1})}catch(l){console.error("Failed to initialize AgentWidget:",l)}}};S(async()=>{try{await U(),await b(),C&&(t.config||t.apiUrl||t.clientToken)&&setTimeout(I,0)}catch(n){console.error("Failed to install AgentWidget:",n)}})})();return _(F);})();
+"use strict";var SiteAgentInstaller=(()=>{var m=Object.defineProperty;var j=Object.getOwnPropertyDescriptor;var W=Object.getOwnPropertyNames;var T=Object.prototype.hasOwnProperty;var _=(s,i,g,t)=>{if(i&&typeof i=="object"||typeof i=="function")for(let a of W(i))!T.call(s,a)&&a!==g&&m(s,a,{get:()=>i[a],enumerable:!(t=j(i,a))||t.enumerable});return s};var F=s=>_(m({},"__esModule",{value:!0}),s);var L={};(function(){"use strict";if(window.__siteAgentInstallerLoaded)return;window.__siteAgentInstallerLoaded=!0;let i=(()=>{let n=document.currentScript;if(!n)return{};let e={},o=n.getAttribute("data-config");if(o)try{let c=o.replace(/[\r\n]+\s*/g,""),d=JSON.parse(c);if(d.config){let{__proto__:M,constructor:$,prototype:J,...P}=d;Object.assign(e,P)}else e.config=d}catch(c){console.error("Failed to parse data-config JSON:",c)}let r=n.getAttribute("data-runtype-token");r&&(e.clientToken=r);let l=n.getAttribute("data-flow-id");l&&(e.flowId=l);let p=n.getAttribute("data-api-url");p&&(e.apiUrl=p);let w=n.getAttribute("data-preview-param");return w&&(e.previewQueryParam=w),e})(),t={...window.siteAgentConfig||{},...i};if(!(()=>{if(!t.previewQueryParam)return!0;let e=new URLSearchParams(window.location.search).get(t.previewQueryParam);return e!==null&&e!==""&&e.toLowerCase()!=="false"&&e!=="0"})())return;let A=t.version||"latest",C=t.cdn||"jsdelivr",h=t.autoInit!==!1,y=()=>{if(t.cssUrl&&t.jsUrl)return{cssUrl:t.cssUrl,jsUrl:t.jsUrl};let e=`/npm/@runtypelabs/persona@${A}/dist`;return C==="unpkg"?{cssUrl:`https://unpkg.com${e}/widget.css`,jsUrl:`https://unpkg.com${e}/index.global.js`}:{cssUrl:`https://cdn.jsdelivr.net${e}/widget.css`,jsUrl:`https://cdn.jsdelivr.net${e}/index.global.js`}},{cssUrl:u,jsUrl:f}=y(),k=()=>!!document.head.querySelector("link[data-persona]")||!!document.head.querySelector('link[href*="widget.css"]'),S=()=>!!window.AgentWidget,U=n=>{let e=!1,o=()=>{e||(e=!0,n())},r=()=>{typeof requestIdleCallback!="undefined"?requestIdleCallback(()=>{requestAnimationFrame(()=>{requestAnimationFrame(o)})},{timeout:3e3}):setTimeout(o,300)};document.readyState==="loading"?document.addEventListener("DOMContentLoaded",r):r()},b=()=>new Promise((n,e)=>{if(k()){n();return}let o=document.createElement("link");o.rel="stylesheet",o.href=u,o.setAttribute("data-persona","true"),o.onload=()=>n(),o.onerror=()=>e(new Error(`Failed to load CSS from ${u}`)),document.head.appendChild(o)}),I=()=>new Promise((n,e)=>{if(S()){n();return}let o=document.createElement("script");o.src=f,o.async=!0,o.onload=()=>n(),o.onerror=()=>e(new Error(`Failed to load JS from ${f}`)),document.head.appendChild(o)}),v=()=>{var r;if(!window.AgentWidget||!window.AgentWidget.initAgentWidget){console.warn("AgentWidget not available. Make sure the script loaded successfully.");return}let n=t.target||"body",e={...t.config};if(t.apiUrl&&!e.apiUrl&&(e.apiUrl=t.apiUrl),t.clientToken&&!e.clientToken&&(e.clientToken=t.clientToken),t.flowId&&!e.flowId&&(e.flowId=t.flowId),!(!(e.apiUrl||e.clientToken)&&Object.keys(e).length===0)){!e.postprocessMessage&&window.AgentWidget.markdownPostprocessor&&(e.postprocessMessage=({text:l})=>window.AgentWidget.markdownPostprocessor(l));try{window.AgentWidget.initAgentWidget({target:n,config:e,useShadowDom:(r=t.useShadowDom)!=null?r:!1})}catch(l){console.error("Failed to initialize AgentWidget:",l)}}};U(async()=>{try{await b(),await I(),h&&(t.config||t.apiUrl||t.clientToken)&&setTimeout(v,0)}catch(n){console.error("Failed to install AgentWidget:",n)}})})();return F(L);})();
 //# sourceMappingURL=install.global.js.map

package/dist/install.global.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/install.ts"],"sourcesContent":["/**\n * Standalone installer script for easy script tag installation\n * This script automatically loads CSS and JS, then initializes the widget\n * if configuration is provided via window.siteAgentConfig\n */\n\nexport {};\n\ninterface SiteAgentInstallConfig {\n  version?: string;\n  cdn?: \"unpkg\" | \"jsdelivr\";\n  cssUrl?: string;\n  jsUrl?: string;\n  target?: string | HTMLElement;\n  config?: any;\n  autoInit?: boolean;\n  // Client token mode options (can also be set via data attributes)\n  clientToken?: string;\n  flowId?: string;\n  apiUrl?: string;\n  // Optional query param key that gates widget installation in preview mode\n  previewQueryParam?: string;\n  // Shadow DOM option (defaults to false for better CSS compatibility)\n  useShadowDom?: boolean;\n}\n\ndeclare global {\n  interface Window {\n    siteAgentConfig?: SiteAgentInstallConfig;\n    AgentWidget?: any;\n  }\n}\n\n(function() {\n  \"use strict\";\n\n  // Prevent double installation\n  if ((window as any).__siteAgentInstallerLoaded) {\n    return;\n  }\n  (window as any).__siteAgentInstallerLoaded = true;\n\n  /**\n   * Read configuration from data attributes on the current script tag.\n   * Supports: data-config (JSON), data-runtype-token, data-flow-id, data-api-url\n   */\n  const getConfigFromScript = (): Partial<SiteAgentInstallConfig> => {\n    // Try to get the current script element\n    const script = document.currentScript as HTMLScriptElement | null;\n    if (!script) return {};\n\n    const scriptConfig: Partial<SiteAgentInstallConfig> = {};\n\n    // Full config from data-config attribute (JSON string)\n    const configJson = script.getAttribute('data-config');\n    if (configJson) {\n      try {\n        const parsedConfig = JSON.parse(configJson);\n        // If it has nested 'config' property, use it; otherwise treat as widget config\n        if (parsedConfig.config) {\n          // eslint-disable-next-line @typescript-eslint/no-unused-vars\n          const { __proto__: _a, constructor: _b, prototype: _c, ...safeConfig } = parsedConfig;\n          Object.assign(scriptConfig, safeConfig);\n        } else {\n          // Treat the entire object as widget config\n          scriptConfig.config = parsedConfig;\n        }\n      } catch (e) {\n        console.error(\"Failed to parse data-config JSON:\", e);\n      }\n    }\n\n    // Client token from data attribute (primary method for client token mode)\n    const token = script.getAttribute('data-runtype-token');\n    if (token) {\n      scriptConfig.clientToken = token;\n    }\n\n    // Optional flow ID\n    const flowId = script.getAttribute('data-flow-id');\n    if (flowId) {\n      scriptConfig.flowId = flowId;\n    }\n\n    // Optional API URL override\n    const apiUrl = script.getAttribute('data-api-url');\n    if (apiUrl) {\n      scriptConfig.apiUrl = apiUrl;\n    }\n\n    // Optional preview query param gate\n    const previewQueryParam = script.getAttribute('data-preview-param');\n    if (previewQueryParam) {\n      scriptConfig.previewQueryParam = previewQueryParam;\n    }\n\n    return scriptConfig;\n  };\n\n  // Get config from script attributes (must be called synchronously during script execution)\n  const scriptConfig = getConfigFromScript();\n\n  // Merge script attributes with window config (script attributes take precedence)\n  const windowConfig: SiteAgentInstallConfig = window.siteAgentConfig || {};\n  const config: SiteAgentInstallConfig = { ...windowConfig, ...scriptConfig };\n\n  const isPreviewModeEnabled = (): boolean => {\n    if (!config.previewQueryParam) {\n      return true;\n    }\n\n    const params = new URLSearchParams(window.location.search);\n    const value = params.get(config.previewQueryParam);\n    return value !== null && value !== \"\" && value.toLowerCase() !== \"false\" && value !== \"0\";\n  };\n\n  if (!isPreviewModeEnabled()) {\n    return;\n  }\n  \n  const version = config.version || \"latest\";\n  const cdn = config.cdn || \"jsdelivr\";\n  const autoInit = config.autoInit !== false; // Default to true\n\n  // Determine CDN base URL\n  const getCdnBase = () => {\n    if (config.cssUrl && config.jsUrl) {\n      return { cssUrl: config.cssUrl, jsUrl: config.jsUrl };\n    }\n    \n    const packageName = \"@runtypelabs/persona\";\n    const basePath = `/npm/${packageName}@${version}/dist`;\n    \n    if (cdn === \"unpkg\") {\n      return {\n        cssUrl: `https://unpkg.com${basePath}/widget.css`,\n        jsUrl: `https://unpkg.com${basePath}/index.global.js`\n      };\n    } else {\n      return {\n        cssUrl: `https://cdn.jsdelivr.net${basePath}/widget.css`,\n        jsUrl: `https://cdn.jsdelivr.net${basePath}/index.global.js`\n      };\n    }\n  };\n\n  const { cssUrl, jsUrl } = getCdnBase();\n\n  // Check if CSS is already loaded\n  const isCssLoaded = () => {\n    return !!document.head.querySelector('link[data-persona]') ||\n           !!document.head.querySelector(`link[href*=\"widget.css\"]`);\n  };\n\n  // Check if JS is already loaded\n  const isJsLoaded = () => {\n    return !!(window as any).AgentWidget;\n  };\n\n  /**\n   * Wait for framework hydration to complete (Next.js, Nuxt, etc.)\n   * This prevents the framework from removing dynamically added CSS during reconciliation.\n   * Uses requestIdleCallback + double requestAnimationFrame for reliable detection.\n   */\n  const waitForHydration = (callback: () => void): void => {\n    let executed = false;\n    \n    const execute = () => {\n      if (executed) return;\n      executed = true;\n      callback();\n    };\n\n    const afterDom = () => {\n      // Strategy 1: Use requestIdleCallback if available (best for detecting idle after hydration)\n      if (typeof requestIdleCallback !== 'undefined') {\n        requestIdleCallback(() => {\n          // Double requestAnimationFrame ensures at least one full paint cycle completed\n          requestAnimationFrame(() => {\n            requestAnimationFrame(execute);\n          });\n        }, { timeout: 3000 }); // Max wait 3 seconds, then proceed anyway\n      } else {\n        // Strategy 2: Fallback for Safari (no requestIdleCallback)\n        // 300ms is typically enough for hydration on most pages\n        setTimeout(execute, 300);\n      }\n    };\n\n    if (document.readyState === 'loading') {\n      document.addEventListener('DOMContentLoaded', afterDom);\n    } else {\n      // DOM already ready, but still wait for potential hydration\n      afterDom();\n    }\n  };\n\n  // Load CSS\n  const loadCSS = (): Promise<void> => {\n    return new Promise((resolve, reject) => {\n      if (isCssLoaded()) {\n        resolve();\n        return;\n      }\n\n      const link = document.createElement(\"link\");\n      link.rel = \"stylesheet\";\n      link.href = cssUrl;\n      link.setAttribute(\"data-persona\", \"true\");\n      \n      link.onload = () => resolve();\n      link.onerror = () => reject(new Error(`Failed to load CSS from ${cssUrl}`));\n      document.head.appendChild(link);\n    });\n  };\n\n  // Load JS\n  const loadJS = (): Promise<void> => {\n    return new Promise((resolve, reject) => {\n      if (isJsLoaded()) {\n        resolve();\n        return;\n      }\n\n      const script = document.createElement(\"script\");\n      script.src = jsUrl;\n      script.async = true;\n      script.onload = () => resolve();\n      script.onerror = () => reject(new Error(`Failed to load JS from ${jsUrl}`));\n      document.head.appendChild(script);\n    });\n  };\n\n  // Initialize widget\n  const initWidget = () => {\n    if (!window.AgentWidget || !window.AgentWidget.initAgentWidget) {\n      console.warn(\"AgentWidget not available. Make sure the script loaded successfully.\");\n      return;\n    }\n\n    const target = config.target || \"body\";\n    // Merge top-level config options into widget config\n    const widgetConfig = { ...config.config };\n    \n    // Merge apiUrl from top-level config into widget config if present\n    if (config.apiUrl && !widgetConfig.apiUrl) {\n      widgetConfig.apiUrl = config.apiUrl;\n    }\n    \n    // Merge clientToken from top-level config into widget config if present\n    if (config.clientToken && !widgetConfig.clientToken) {\n      widgetConfig.clientToken = config.clientToken;\n    }\n    \n    // Merge flowId from top-level config into widget config if present\n    if (config.flowId && !widgetConfig.flowId) {\n      widgetConfig.flowId = config.flowId;\n    }\n\n    // Only initialize if we have either apiUrl OR clientToken (or other config)\n    const hasApiConfig = widgetConfig.apiUrl || widgetConfig.clientToken;\n    if (!hasApiConfig && Object.keys(widgetConfig).length === 0) {\n      return;\n    }\n\n    // Auto-apply markdown postprocessor if not explicitly set and available\n    if (!widgetConfig.postprocessMessage && window.AgentWidget.markdownPostprocessor) {\n      widgetConfig.postprocessMessage = ({ text }: { text: string }) => \n        window.AgentWidget.markdownPostprocessor(text);\n    }\n\n    try {\n      window.AgentWidget.initAgentWidget({\n        target,\n        config: widgetConfig,\n        // Explicitly disable shadow DOM for better CSS compatibility with host page\n        useShadowDom: config.useShadowDom ?? false\n      });\n    } catch (error) {\n      console.error(\"Failed to initialize AgentWidget:\", error);\n    }\n  };\n\n  // Main installation flow (called after hydration completes)\n  const install = async () => {\n    try {\n      await loadCSS();\n      await loadJS();\n      \n      // Auto-init if we have config OR apiUrl OR clientToken\n      const shouldAutoInit = autoInit && (\n        config.config || \n        config.apiUrl || \n        config.clientToken\n      );\n      \n      if (shouldAutoInit) {\n        // Wait a tick to ensure AgentWidget is fully initialized\n        setTimeout(initWidget, 0);\n      }\n    } catch (error) {\n      console.error(\"Failed to install AgentWidget:\", error);\n    }\n  };\n\n  // Start installation after hydration completes\n  // This prevents Next.js/Nuxt/etc. from removing dynamically added CSS\n  waitForHydration(install);\n})();\n\n"],"mappings":"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","names":["install_exports","scriptConfig","script","configJson","parsedConfig","_a","_b","_c","safeConfig","e","token","flowId","apiUrl","previewQueryParam","config","value","version","cdn","autoInit","getCdnBase","basePath","cssUrl","jsUrl","isCssLoaded","isJsLoaded","waitForHydration","callback","executed","execute","afterDom","loadCSS","resolve","reject","link","loadJS","initWidget","target","widgetConfig","text","error"]}
+{"version":3,"sources":["../src/install.ts"],"sourcesContent":["/**\n * Standalone installer script for easy script tag installation\n * This script automatically loads CSS and JS, then initializes the widget\n * if configuration is provided via window.siteAgentConfig\n */\n\nexport {};\n\ninterface SiteAgentInstallConfig {\n  version?: string;\n  cdn?: \"unpkg\" | \"jsdelivr\";\n  cssUrl?: string;\n  jsUrl?: string;\n  target?: string | HTMLElement;\n  config?: any;\n  autoInit?: boolean;\n  // Client token mode options (can also be set via data attributes)\n  clientToken?: string;\n  flowId?: string;\n  apiUrl?: string;\n  // Optional query param key that gates widget installation in preview mode\n  previewQueryParam?: string;\n  // Shadow DOM option (defaults to false for better CSS compatibility)\n  useShadowDom?: boolean;\n}\n\ndeclare global {\n  interface Window {\n    siteAgentConfig?: SiteAgentInstallConfig;\n    AgentWidget?: any;\n  }\n}\n\n(function() {\n  \"use strict\";\n\n  // Prevent double installation\n  if ((window as any).__siteAgentInstallerLoaded) {\n    return;\n  }\n  (window as any).__siteAgentInstallerLoaded = true;\n\n  /**\n   * Read configuration from data attributes on the current script tag.\n   * Supports: data-config (JSON), data-runtype-token, data-flow-id, data-api-url\n   */\n  const getConfigFromScript = (): Partial<SiteAgentInstallConfig> => {\n    // Try to get the current script element\n    const script = document.currentScript as HTMLScriptElement | null;\n    if (!script) return {};\n\n    const scriptConfig: Partial<SiteAgentInstallConfig> = {};\n\n    // Full config from data-config attribute (JSON string)\n    const configJson = script.getAttribute('data-config');\n    if (configJson) {\n      try {\n        // HTML attributes preserve literal newlines/tabs which are invalid\n        // control characters inside JSON string literals — strip them.\n        const normalizedJson = configJson.replace(/[\\r\\n]+\\s*/g, '');\n        const parsedConfig = JSON.parse(normalizedJson);\n        // If it has nested 'config' property, use it; otherwise treat as widget config\n        if (parsedConfig.config) {\n          // eslint-disable-next-line @typescript-eslint/no-unused-vars\n          const { __proto__: _a, constructor: _b, prototype: _c, ...safeConfig } = parsedConfig;\n          Object.assign(scriptConfig, safeConfig);\n        } else {\n          // Treat the entire object as widget config\n          scriptConfig.config = parsedConfig;\n        }\n      } catch (e) {\n        console.error(\"Failed to parse data-config JSON:\", e);\n      }\n    }\n\n    // Client token from data attribute (primary method for client token mode)\n    const token = script.getAttribute('data-runtype-token');\n    if (token) {\n      scriptConfig.clientToken = token;\n    }\n\n    // Optional flow ID\n    const flowId = script.getAttribute('data-flow-id');\n    if (flowId) {\n      scriptConfig.flowId = flowId;\n    }\n\n    // Optional API URL override\n    const apiUrl = script.getAttribute('data-api-url');\n    if (apiUrl) {\n      scriptConfig.apiUrl = apiUrl;\n    }\n\n    // Optional preview query param gate\n    const previewQueryParam = script.getAttribute('data-preview-param');\n    if (previewQueryParam) {\n      scriptConfig.previewQueryParam = previewQueryParam;\n    }\n\n    return scriptConfig;\n  };\n\n  // Get config from script attributes (must be called synchronously during script execution)\n  const scriptConfig = getConfigFromScript();\n\n  // Merge script attributes with window config (script attributes take precedence)\n  const windowConfig: SiteAgentInstallConfig = window.siteAgentConfig || {};\n  const config: SiteAgentInstallConfig = { ...windowConfig, ...scriptConfig };\n\n  const isPreviewModeEnabled = (): boolean => {\n    if (!config.previewQueryParam) {\n      return true;\n    }\n\n    const params = new URLSearchParams(window.location.search);\n    const value = params.get(config.previewQueryParam);\n    return value !== null && value !== \"\" && value.toLowerCase() !== \"false\" && value !== \"0\";\n  };\n\n  if (!isPreviewModeEnabled()) {\n    return;\n  }\n  \n  const version = config.version || \"latest\";\n  const cdn = config.cdn || \"jsdelivr\";\n  const autoInit = config.autoInit !== false; // Default to true\n\n  // Determine CDN base URL\n  const getCdnBase = () => {\n    if (config.cssUrl && config.jsUrl) {\n      return { cssUrl: config.cssUrl, jsUrl: config.jsUrl };\n    }\n    \n    const packageName = \"@runtypelabs/persona\";\n    const basePath = `/npm/${packageName}@${version}/dist`;\n    \n    if (cdn === \"unpkg\") {\n      return {\n        cssUrl: `https://unpkg.com${basePath}/widget.css`,\n        jsUrl: `https://unpkg.com${basePath}/index.global.js`\n      };\n    } else {\n      return {\n        cssUrl: `https://cdn.jsdelivr.net${basePath}/widget.css`,\n        jsUrl: `https://cdn.jsdelivr.net${basePath}/index.global.js`\n      };\n    }\n  };\n\n  const { cssUrl, jsUrl } = getCdnBase();\n\n  // Check if CSS is already loaded\n  const isCssLoaded = () => {\n    return !!document.head.querySelector('link[data-persona]') ||\n           !!document.head.querySelector(`link[href*=\"widget.css\"]`);\n  };\n\n  // Check if JS is already loaded\n  const isJsLoaded = () => {\n    return !!(window as any).AgentWidget;\n  };\n\n  /**\n   * Wait for framework hydration to complete (Next.js, Nuxt, etc.)\n   * This prevents the framework from removing dynamically added CSS during reconciliation.\n   * Uses requestIdleCallback + double requestAnimationFrame for reliable detection.\n   */\n  const waitForHydration = (callback: () => void): void => {\n    let executed = false;\n    \n    const execute = () => {\n      if (executed) return;\n      executed = true;\n      callback();\n    };\n\n    const afterDom = () => {\n      // Strategy 1: Use requestIdleCallback if available (best for detecting idle after hydration)\n      if (typeof requestIdleCallback !== 'undefined') {\n        requestIdleCallback(() => {\n          // Double requestAnimationFrame ensures at least one full paint cycle completed\n          requestAnimationFrame(() => {\n            requestAnimationFrame(execute);\n          });\n        }, { timeout: 3000 }); // Max wait 3 seconds, then proceed anyway\n      } else {\n        // Strategy 2: Fallback for Safari (no requestIdleCallback)\n        // 300ms is typically enough for hydration on most pages\n        setTimeout(execute, 300);\n      }\n    };\n\n    if (document.readyState === 'loading') {\n      document.addEventListener('DOMContentLoaded', afterDom);\n    } else {\n      // DOM already ready, but still wait for potential hydration\n      afterDom();\n    }\n  };\n\n  // Load CSS\n  const loadCSS = (): Promise<void> => {\n    return new Promise((resolve, reject) => {\n      if (isCssLoaded()) {\n        resolve();\n        return;\n      }\n\n      const link = document.createElement(\"link\");\n      link.rel = \"stylesheet\";\n      link.href = cssUrl;\n      link.setAttribute(\"data-persona\", \"true\");\n      \n      link.onload = () => resolve();\n      link.onerror = () => reject(new Error(`Failed to load CSS from ${cssUrl}`));\n      document.head.appendChild(link);\n    });\n  };\n\n  // Load JS\n  const loadJS = (): Promise<void> => {\n    return new Promise((resolve, reject) => {\n      if (isJsLoaded()) {\n        resolve();\n        return;\n      }\n\n      const script = document.createElement(\"script\");\n      script.src = jsUrl;\n      script.async = true;\n      script.onload = () => resolve();\n      script.onerror = () => reject(new Error(`Failed to load JS from ${jsUrl}`));\n      document.head.appendChild(script);\n    });\n  };\n\n  // Initialize widget\n  const initWidget = () => {\n    if (!window.AgentWidget || !window.AgentWidget.initAgentWidget) {\n      console.warn(\"AgentWidget not available. Make sure the script loaded successfully.\");\n      return;\n    }\n\n    const target = config.target || \"body\";\n    // Merge top-level config options into widget config\n    const widgetConfig = { ...config.config };\n    \n    // Merge apiUrl from top-level config into widget config if present\n    if (config.apiUrl && !widgetConfig.apiUrl) {\n      widgetConfig.apiUrl = config.apiUrl;\n    }\n    \n    // Merge clientToken from top-level config into widget config if present\n    if (config.clientToken && !widgetConfig.clientToken) {\n      widgetConfig.clientToken = config.clientToken;\n    }\n    \n    // Merge flowId from top-level config into widget config if present\n    if (config.flowId && !widgetConfig.flowId) {\n      widgetConfig.flowId = config.flowId;\n    }\n\n    // Only initialize if we have either apiUrl OR clientToken (or other config)\n    const hasApiConfig = widgetConfig.apiUrl || widgetConfig.clientToken;\n    if (!hasApiConfig && Object.keys(widgetConfig).length === 0) {\n      return;\n    }\n\n    // Auto-apply markdown postprocessor if not explicitly set and available\n    if (!widgetConfig.postprocessMessage && window.AgentWidget.markdownPostprocessor) {\n      widgetConfig.postprocessMessage = ({ text }: { text: string }) => \n        window.AgentWidget.markdownPostprocessor(text);\n    }\n\n    try {\n      window.AgentWidget.initAgentWidget({\n        target,\n        config: widgetConfig,\n        // Explicitly disable shadow DOM for better CSS compatibility with host page\n        useShadowDom: config.useShadowDom ?? false\n      });\n    } catch (error) {\n      console.error(\"Failed to initialize AgentWidget:\", error);\n    }\n  };\n\n  // Main installation flow (called after hydration completes)\n  const install = async () => {\n    try {\n      await loadCSS();\n      await loadJS();\n      \n      // Auto-init if we have config OR apiUrl OR clientToken\n      const shouldAutoInit = autoInit && (\n        config.config || \n        config.apiUrl || \n        config.clientToken\n      );\n      \n      if (shouldAutoInit) {\n        // Wait a tick to ensure AgentWidget is fully initialized\n        setTimeout(initWidget, 0);\n      }\n    } catch (error) {\n      console.error(\"Failed to install AgentWidget:\", error);\n    }\n  };\n\n  // Start installation after hydration completes\n  // This prevents Next.js/Nuxt/etc. from removing dynamically added CSS\n  waitForHydration(install);\n})();\n\n"],"mappings":"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","names":["install_exports","scriptConfig","script","configJson","normalizedJson","parsedConfig","_a","_b","_c","safeConfig","e","token","flowId","apiUrl","previewQueryParam","config","value","version","cdn","autoInit","getCdnBase","basePath","cssUrl","jsUrl","isCssLoaded","isJsLoaded","waitForHydration","callback","executed","execute","afterDom","loadCSS","resolve","reject","link","loadJS","initWidget","target","widgetConfig","text","error"]}

package/dist/theme-editor.cjs

@@ -233,12 +233,14 @@ var DEFAULT_WIDGET_CONFIG = {
       activePreview: false,
       grouped: false,
       previewMaxLines: 3,
-      expandable: true
+      expandable: true,
+      loadingAnimation: "none"
     },
     reasoningDisplay: {
       activePreview: false,
       previewMaxLines: 3,
-      expandable: true
+      expandable: true,
+      loadingAnimation: "none"
     }
   },
   suggestionChips: [
@@ -3345,6 +3347,70 @@ var describeToolTitle = (tool) => {
   }
   return "Using tool...";
 };
+var formatElapsedMs = (ms) => {
+  const seconds = ms / 1e3;
+  if (seconds < 0.1) return "<0.1s";
+  if (seconds >= 10) return `${Math.round(seconds)}s`;
+  return `${seconds.toFixed(1).replace(/\.0$/, "")}s`;
+};
+var computeToolElapsed = (tool) => {
+  var _a, _b, _c;
+  const durationMs = typeof tool.duration === "number" ? tool.duration : typeof tool.durationMs === "number" ? tool.durationMs : Math.max(
+    0,
+    ((_a = tool.completedAt) != null ? _a : Date.now()) - ((_c = (_b = tool.startedAt) != null ? _b : tool.completedAt) != null ? _c : Date.now())
+  );
+  return formatElapsedMs(durationMs);
+};
+var computeReasoningElapsed = (reasoning) => {
+  var _a, _b, _c;
+  const durationMs = reasoning.durationMs !== void 0 ? reasoning.durationMs : Math.max(
+    0,
+    ((_a = reasoning.completedAt) != null ? _a : Date.now()) - ((_c = (_b = reasoning.startedAt) != null ? _b : reasoning.completedAt) != null ? _c : Date.now())
+  );
+  return formatElapsedMs(durationMs);
+};
+var resolveToolHeaderText = (tool, template, fallback) => {
+  var _a;
+  if (!template) return fallback;
+  const toolName = ((_a = tool.name) == null ? void 0 : _a.trim()) || "tool";
+  const duration = computeToolElapsed(tool);
+  return template.replace(/\{toolName\}/g, toolName).replace(/\{duration\}/g, duration);
+};
+var parseFormattedTemplate = (template, toolName) => {
+  const resolved = template.replace(/\{toolName\}/g, toolName);
+  const segments = [];
+  const regex = /\*\*(.+?)\*\*|\*(.+?)\*|~(.+?)~/g;
+  let lastIndex = 0;
+  let match;
+  while ((match = regex.exec(resolved)) !== null) {
+    if (match.index > lastIndex) {
+      pushSegments(segments, resolved.slice(lastIndex, match.index), []);
+    }
+    if (match[1] !== void 0) {
+      pushSegments(segments, match[1], ["bold"]);
+    } else if (match[2] !== void 0) {
+      pushSegments(segments, match[2], ["italic"]);
+    } else if (match[3] !== void 0) {
+      pushSegments(segments, match[3], ["dim"]);
+    }
+    lastIndex = match.index + match[0].length;
+  }
+  if (lastIndex < resolved.length) {
+    pushSegments(segments, resolved.slice(lastIndex), []);
+  }
+  return segments;
+};
+var pushSegments = (segments, text, styles) => {
+  const parts = text.split("{duration}");
+  for (let i = 0; i < parts.length; i++) {
+    if (parts[i]) {
+      segments.push({ text: parts[i], styles });
+    }
+    if (i < parts.length - 1) {
+      segments.push({ text: "{duration}", styles, isDuration: true });
+    }
+  }
+};
 var createRegexJsonParserInternal = () => {
   let extractedText = null;
   let processedLength = 0;
@@ -7962,10 +8028,24 @@ var morphMessages = (container, newContent, options = {}) => {
   import_idiomorph.Idiomorph.morph(container, newContent.innerHTML, {
     morphStyle: "innerHTML",
     callbacks: {
-      beforeNodeMorphed(oldNode, _newNode) {
+      beforeNodeMorphed(oldNode, newNode) {
+        var _a, _b;
         if (!(oldNode instanceof HTMLElement)) return;
         if (preserveTypingAnimation) {
-          if (oldNode.classList.contains("persona-animate-typing") || oldNode.hasAttribute("data-preserve-animation")) {
+          if (oldNode.classList.contains("persona-animate-typing")) {
+            return false;
+          }
+          if (oldNode.hasAttribute("data-preserve-animation")) {
+            if (newNode instanceof HTMLElement && !newNode.hasAttribute("data-preserve-animation")) {
+              return;
+            }
+            if (newNode instanceof HTMLElement && newNode.hasAttribute("data-preserve-animation")) {
+              const oldText = (_a = oldNode.textContent) != null ? _a : "";
+              const newText = (_b = newNode.textContent) != null ? _b : "";
+              if (oldText !== newText) {
+                return;
+              }
+            }
             return false;
           }
         }
@@ -7976,7 +8056,7 @@ var morphMessages = (container, newContent, options = {}) => {
 
 // src/utils/message-fingerprint.ts
 function computeMessageFingerprint(message, configVersion) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C;
   return [
     message.id,
     message.role,
@@ -7988,11 +8068,12 @@ function computeMessageFingerprint(message, configVersion) {
     (_i = (_h = message.llmContent) == null ? void 0 : _h.length) != null ? _i : 0,
     (_k = (_j = message.approval) == null ? void 0 : _j.status) != null ? _k : "",
     (_m = (_l = message.toolCall) == null ? void 0 : _l.status) != null ? _m : "",
-    (_p = (_o = (_n = message.toolCall) == null ? void 0 : _n.chunks) == null ? void 0 : _o.length) != null ? _p : 0,
-    (_t = (_s = (_r = (_q = message.toolCall) == null ? void 0 : _q.chunks) == null ? void 0 : _r[message.toolCall.chunks.length - 1]) == null ? void 0 : _s.slice(-32)) != null ? _t : "",
-    typeof ((_u = message.toolCall) == null ? void 0 : _u.args) === "string" ? message.toolCall.args.length : ((_v = message.toolCall) == null ? void 0 : _v.args) ? JSON.stringify(message.toolCall.args).length : 0,
-    (_y = (_x = (_w = message.reasoning) == null ? void 0 : _w.chunks) == null ? void 0 : _x.length) != null ? _y : 0,
-    (_A = (_z = message.contentParts) == null ? void 0 : _z.length) != null ? _A : 0,
+    (_o = (_n = message.toolCall) == null ? void 0 : _n.name) != null ? _o : "",
+    (_r = (_q = (_p = message.toolCall) == null ? void 0 : _p.chunks) == null ? void 0 : _q.length) != null ? _r : 0,
+    (_v = (_u = (_t = (_s = message.toolCall) == null ? void 0 : _s.chunks) == null ? void 0 : _t[message.toolCall.chunks.length - 1]) == null ? void 0 : _u.slice(-32)) != null ? _v : "",
+    typeof ((_w = message.toolCall) == null ? void 0 : _w.args) === "string" ? message.toolCall.args.length : ((_x = message.toolCall) == null ? void 0 : _x.args) ? JSON.stringify(message.toolCall.args).length : 0,
+    (_A = (_z = (_y = message.reasoning) == null ? void 0 : _y.chunks) == null ? void 0 : _z.length) != null ? _A : 0,
+    (_C = (_B = message.contentParts) == null ? void 0 : _B.length) != null ? _C : 0,
     configVersion
   ].join("\0");
 }
@@ -10114,7 +10195,7 @@ var updateReasoningBubbleUI = (messageId, bubble) => {
   }
 };
 var createReasoningBubble = (message, config) => {
-  var _a, _b, _c, _d, _e, _f, _g;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
   const reasoning = message.reasoning;
   const bubble = createElement(
     "div",
@@ -10157,13 +10238,23 @@ var createReasoningBubble = (message, config) => {
   const headerContent = createElement("div", "persona-flex persona-flex-col persona-text-left");
   const title = createElement("span", "persona-text-xs persona-text-persona-primary");
   const defaultSummary = "Thinking...";
-  const customSummary = (_e = (_d = config == null ? void 0 : config.reasoning) == null ? void 0 : _d.renderCollapsedSummary) == null ? void 0 : _e.call(_d, {
+  const reasoningConfig = (_d = config == null ? void 0 : config.reasoning) != null ? _d : {};
+  const startedAt = String((_e = reasoning.startedAt) != null ? _e : Date.now());
+  const createElapsedSpan = () => {
+    const span = createElement("span", "");
+    span.setAttribute("data-tool-elapsed", startedAt);
+    span.textContent = computeReasoningElapsed(reasoning);
+    return span;
+  };
+  const customSummary = (_f = reasoningConfig.renderCollapsedSummary) == null ? void 0 : _f.call(reasoningConfig, {
     message,
     reasoning,
     defaultSummary,
     previewText,
     isActive,
-    config: config != null ? config : {}
+    config: config != null ? config : {},
+    elapsed: computeReasoningElapsed(reasoning),
+    createElapsedElement: createElapsedSpan
   });
   if (typeof customSummary === "string" && customSummary.trim()) {
     title.textContent = customSummary;
@@ -10177,10 +10268,101 @@ var createReasoningBubble = (message, config) => {
   const status = createElement("span", "persona-text-xs persona-text-persona-primary");
   status.textContent = describeReasonStatus(reasoning);
   headerContent.appendChild(status);
-  if (reasoning.status === "complete") {
-    title.style.display = "none";
-  } else {
+  const loadingAnimation = (_g = reasoningDisplayConfig.loadingAnimation) != null ? _g : "none";
+  const activeTemplate = reasoningConfig.activeTextTemplate;
+  const completeTemplate = reasoningConfig.completeTextTemplate;
+  const currentTemplate = isActive ? activeTemplate : completeTemplate;
+  const skipCustomElement = customSummary instanceof HTMLElement;
+  const appendCharSpans = (container, text2, startIndex) => {
+    let idx = startIndex;
+    for (const char of text2) {
+      const span = createElement("span", "persona-tool-char");
+      span.style.setProperty("--char-index", String(idx));
+      span.textContent = char === " " ? "\xA0" : char;
+      container.appendChild(span);
+      idx++;
+    }
+    return idx;
+  };
+  const renderFormattedTitle = (template, animated) => {
+    title.textContent = "";
+    const segments = parseFormattedTemplate(template, "");
+    let charIndex = 0;
+    for (const seg of segments) {
+      const parent = seg.styles.length > 0 ? (() => {
+        const w = createElement("span", seg.styles.map((s) => `persona-tool-text-${s}`).join(" "));
+        title.appendChild(w);
+        return w;
+      })() : title;
+      if (seg.isDuration && isActive) {
+        parent.appendChild(createElapsedSpan());
+      } else {
+        const text2 = seg.isDuration ? computeReasoningElapsed(reasoning) : seg.text;
+        if (animated) {
+          charIndex = appendCharSpans(parent, text2, charIndex);
+        } else {
+          parent.appendChild(document.createTextNode(text2));
+        }
+      }
+    }
+  };
+  if (!skipCustomElement && currentTemplate) {
+    status.style.display = "none";
+    title.style.display = "";
+    if (isActive && loadingAnimation !== "none") {
+      const animDuration = (_h = reasoningConfig.loadingAnimationDuration) != null ? _h : 2e3;
+      title.setAttribute("data-preserve-animation", "true");
+      if (loadingAnimation === "pulse") {
+        title.classList.add("persona-tool-loading-pulse");
+        title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+        renderFormattedTitle(currentTemplate, false);
+      } else {
+        title.classList.add(`persona-tool-loading-${loadingAnimation}`);
+        title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+        if (loadingAnimation === "shimmer-color") {
+          if (reasoningConfig.loadingAnimationColor) {
+            title.style.setProperty("--persona-tool-anim-color", reasoningConfig.loadingAnimationColor);
+          }
+          if (reasoningConfig.loadingAnimationSecondaryColor) {
+            title.style.setProperty("--persona-tool-anim-secondary-color", reasoningConfig.loadingAnimationSecondaryColor);
+          }
+        }
+        renderFormattedTitle(currentTemplate, true);
+      }
+    } else {
+      renderFormattedTitle(currentTemplate, false);
+    }
+  } else if (!skipCustomElement && isActive && loadingAnimation !== "none") {
     title.style.display = "";
+    const animDuration = (_i = reasoningConfig.loadingAnimationDuration) != null ? _i : 2e3;
+    title.setAttribute("data-preserve-animation", "true");
+    if (loadingAnimation === "pulse") {
+      title.classList.add("persona-tool-loading-pulse");
+      title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+    } else {
+      title.classList.add(`persona-tool-loading-${loadingAnimation}`);
+      title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+      if (loadingAnimation === "shimmer-color") {
+        if (reasoningConfig.loadingAnimationColor) {
+          title.style.setProperty("--persona-tool-anim-color", reasoningConfig.loadingAnimationColor);
+        }
+        if (reasoningConfig.loadingAnimationSecondaryColor) {
+          title.style.setProperty("--persona-tool-anim-secondary-color", reasoningConfig.loadingAnimationSecondaryColor);
+        }
+      }
+      const text2 = title.textContent || defaultSummary;
+      title.textContent = "";
+      appendCharSpans(title, text2, 0);
+    }
+    if (reasoning.status === "complete") {
+      title.style.display = "none";
+    }
+  } else if (!skipCustomElement) {
+    if (reasoning.status === "complete") {
+      title.style.display = "none";
+    } else {
+      title.style.display = "";
+    }
   }
   let toggleIcon = null;
   if (expandable) {
@@ -10206,7 +10388,7 @@ var createReasoningBubble = (message, config) => {
   collapsedPreview.style.display = "none";
   collapsedPreview.style.whiteSpace = "pre-wrap";
   if (!expanded && isActive && reasoningDisplayConfig.activePreview && previewText) {
-    const renderedPreview = (_g = (_f = config == null ? void 0 : config.reasoning) == null ? void 0 : _f.renderCollapsedPreview) == null ? void 0 : _g.call(_f, {
+    const renderedPreview = (_k = (_j = config == null ? void 0 : config.reasoning) == null ? void 0 : _j.renderCollapsedPreview) == null ? void 0 : _k.call(_j, {
       message,
       reasoning,
       defaultPreview: previewText,
@@ -10282,7 +10464,7 @@ var getToolPreviewText = (message, maxLines) => {
   return argsText.split(/\r?\n/).map((line) => line.trim()).filter(Boolean).slice(0, maxLines).join("\n");
 };
 var getToolSummaryText = (message, config) => {
-  var _a, _b, _c, _d;
+  var _a, _b, _c, _d, _e;
   const tool = message.toolCall;
   const toolDisplayConfig = (_a = config == null ? void 0 : config.features) == null ? void 0 : _a.toolCallDisplay;
   const collapsedMode = (_b = toolDisplayConfig == null ? void 0 : toolDisplayConfig.collapsedMode) != null ? _b : "tool-call";
@@ -10292,12 +10474,18 @@ var getToolSummaryText = (message, config) => {
     return { summary: defaultSummary, previewText, isActive: false };
   }
   const isActive = tool.status !== "complete";
+  const toolCallConfig = (_d = config == null ? void 0 : config.toolCall) != null ? _d : {};
   let summary = defaultSummary;
   if (collapsedMode === "tool-name") {
-    summary = ((_d = tool.name) == null ? void 0 : _d.trim()) || defaultSummary;
+    summary = ((_e = tool.name) == null ? void 0 : _e.trim()) || defaultSummary;
   } else if (collapsedMode === "tool-preview" && previewText) {
     summary = previewText;
   }
+  if (isActive && toolCallConfig.activeTextTemplate) {
+    summary = resolveToolHeaderText(tool, toolCallConfig.activeTextTemplate, summary);
+  } else if (!isActive && toolCallConfig.completeTextTemplate) {
+    summary = resolveToolHeaderText(tool, toolCallConfig.completeTextTemplate, summary);
+  }
   return { summary, previewText, isActive };
 };
 var updateToolBubbleUI = (messageId, bubble, config) => {
@@ -10327,7 +10515,7 @@ var updateToolBubbleUI = (messageId, bubble, config) => {
   }
 };
 var createToolBubble = (message, config) => {
-  var _a, _b, _c, _d, _e, _f;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
   const tool = message.toolCall;
   const toolCallConfig = (_a = config == null ? void 0 : config.toolCall) != null ? _a : {};
   const bubble = createElement(
@@ -10395,14 +10583,23 @@ var createToolBubble = (message, config) => {
   if (toolCallConfig.headerTextColor) {
     title.style.color = toolCallConfig.headerTextColor;
   }
-  const customSummary = (_e = toolCallConfig.renderCollapsedSummary) == null ? void 0 : _e.call(toolCallConfig, {
+  const startedAt = String((_d = tool.startedAt) != null ? _d : Date.now());
+  const createElapsedSpan = () => {
+    const span = createElement("span", "");
+    span.setAttribute("data-tool-elapsed", startedAt);
+    span.textContent = computeToolElapsed(tool);
+    return span;
+  };
+  const customSummary = (_f = toolCallConfig.renderCollapsedSummary) == null ? void 0 : _f.call(toolCallConfig, {
     message,
     toolCall: tool,
     defaultSummary: summary,
     previewText,
-    collapsedMode: (_d = toolDisplayConfig.collapsedMode) != null ? _d : "tool-call",
+    collapsedMode: (_e = toolDisplayConfig.collapsedMode) != null ? _e : "tool-call",
     isActive,
-    config: config != null ? config : {}
+    config: config != null ? config : {},
+    elapsed: computeToolElapsed(tool),
+    createElapsedElement: createElapsedSpan
   });
   if (typeof customSummary === "string" && customSummary.trim()) {
     title.textContent = customSummary;
@@ -10413,6 +10610,79 @@ var createToolBubble = (message, config) => {
     title.textContent = summary;
     headerContent.appendChild(title);
   }
+  const loadingAnimation = (_g = toolDisplayConfig.loadingAnimation) != null ? _g : "none";
+  const activeTemplate = toolCallConfig.activeTextTemplate;
+  const completeTemplate = toolCallConfig.completeTextTemplate;
+  const currentTemplate = isActive ? activeTemplate : completeTemplate;
+  const skipCustomElement = customSummary instanceof HTMLElement;
+  const appendCharSpans = (container, text, startIndex) => {
+    let idx = startIndex;
+    for (const char of text) {
+      const span = createElement("span", "persona-tool-char");
+      span.style.setProperty("--char-index", String(idx));
+      span.textContent = char === " " ? "\xA0" : char;
+      container.appendChild(span);
+      idx++;
+    }
+    return idx;
+  };
+  const renderFormattedTitle = (template, animated) => {
+    var _a2;
+    title.textContent = "";
+    const toolName = ((_a2 = tool.name) == null ? void 0 : _a2.trim()) || "tool";
+    const segments = parseFormattedTemplate(template, toolName);
+    let charIndex = 0;
+    for (const seg of segments) {
+      const parent = seg.styles.length > 0 ? (() => {
+        const w = createElement("span", seg.styles.map((s) => `persona-tool-text-${s}`).join(" "));
+        title.appendChild(w);
+        return w;
+      })() : title;
+      if (seg.isDuration && isActive) {
+        parent.appendChild(createElapsedSpan());
+      } else {
+        const text = seg.isDuration ? computeToolElapsed(tool) : seg.text;
+        if (animated) {
+          charIndex = appendCharSpans(parent, text, charIndex);
+        } else {
+          parent.appendChild(document.createTextNode(text));
+        }
+      }
+    }
+  };
+  if (!skipCustomElement) {
+    if (isActive && loadingAnimation !== "none") {
+      const animDuration = (_h = toolCallConfig.loadingAnimationDuration) != null ? _h : 2e3;
+      title.setAttribute("data-preserve-animation", "true");
+      if (loadingAnimation === "pulse") {
+        title.classList.add("persona-tool-loading-pulse");
+        title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+        if (currentTemplate) {
+          renderFormattedTitle(currentTemplate, false);
+        }
+      } else {
+        title.classList.add(`persona-tool-loading-${loadingAnimation}`);
+        title.style.setProperty("--persona-tool-anim-duration", `${animDuration}ms`);
+        if (loadingAnimation === "shimmer-color") {
+          if (toolCallConfig.loadingAnimationColor) {
+            title.style.setProperty("--persona-tool-anim-color", toolCallConfig.loadingAnimationColor);
+          }
+          if (toolCallConfig.loadingAnimationSecondaryColor) {
+            title.style.setProperty("--persona-tool-anim-secondary-color", toolCallConfig.loadingAnimationSecondaryColor);
+          }
+        }
+        if (currentTemplate) {
+          renderFormattedTitle(currentTemplate, true);
+        } else {
+          const text = title.textContent || summary;
+          title.textContent = "";
+          appendCharSpans(title, text, 0);
+        }
+      }
+    } else if (currentTemplate) {
+      renderFormattedTitle(currentTemplate, false);
+    }
+  }
   let toggleIcon = null;
   if (expandable) {
     toggleIcon = createElement("div", "persona-flex persona-items-center");
@@ -10437,7 +10707,7 @@ var createToolBubble = (message, config) => {
   collapsedPreview.style.display = "none";
   collapsedPreview.style.whiteSpace = "pre-wrap";
   if (!expanded && isActive && toolDisplayConfig.activePreview && previewText) {
-    const renderedPreview = (_f = toolCallConfig.renderCollapsedPreview) == null ? void 0 : _f.call(toolCallConfig, {
+    const renderedPreview = (_i = toolCallConfig.renderCollapsedPreview) == null ? void 0 : _i.call(toolCallConfig, {
       message,
       toolCall: tool,
       defaultPreview: previewText,
@@ -14830,8 +15100,9 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
   let scrollRAF = null;
   let isAutoScrolling = false;
   let hasPendingAutoScroll = false;
-  const USER_SCROLL_THRESHOLD = 1;
-  const BOTTOM_THRESHOLD = 8;
+  const USER_SCROLL_THRESHOLD = 4;
+  const BOTTOM_THRESHOLD = 24;
+  const AUTO_SCROLL_SNAP_THRESHOLD = 80;
   const messageState = /* @__PURE__ */ new Map();
   const voiceState = {
     active: false,
@@ -14972,6 +15243,14 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       lastScrollTop = element.scrollTop;
       return;
     }
+    if (Math.abs(distance) >= AUTO_SCROLL_SNAP_THRESHOLD) {
+      cancelSmoothScroll();
+      isAutoScrolling = true;
+      element.scrollTop = target;
+      lastScrollTop = element.scrollTop;
+      isAutoScrolling = false;
+      return;
+    }
     cancelSmoothScroll();
     const startTime = performance.now();
     isAutoScrolling = true;
@@ -15580,9 +15859,28 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       }
     };
   }
+  let toolElapsedTimerId = null;
+  const ensureToolElapsedTimer = () => {
+    if (toolElapsedTimerId != null) return;
+    toolElapsedTimerId = setInterval(() => {
+      const spans = messagesWrapper.querySelectorAll("[data-tool-elapsed]");
+      if (spans.length === 0) {
+        clearInterval(toolElapsedTimerId);
+        toolElapsedTimerId = null;
+        return;
+      }
+      const now = Date.now();
+      spans.forEach((span) => {
+        const startedAt = Number(span.getAttribute("data-tool-elapsed"));
+        if (!startedAt) return;
+        span.textContent = formatElapsedMs(now - startedAt);
+      });
+    }, 100);
+  };
   session = new AgentWidgetSession(config, {
     onMessagesChanged(messages) {
       renderMessagesWithPlugins(messagesWrapper, messages, postprocess);
+      ensureToolElapsedTimer();
       if (session) {
         const hasUserMessage = messages.some((msg) => msg.role === "user");
         if (hasUserMessage) {
@@ -17745,6 +18043,10 @@ var createAgentExperience = (mount, initialConfig, runtimeOptions) => {
       return session.submitNPSFeedback(rating, comment);
     },
     destroy() {
+      if (toolElapsedTimerId != null) {
+        clearInterval(toolElapsedTimerId);
+        toolElapsedTimerId = null;
+      }
       destroyCallbacks.forEach((cb) => cb());
       wrapper.remove();
       launcherButtonInstance == null ? void 0 : launcherButtonInstance.destroy();