@heroui/agent 0.2.0-beta.7 → 0.2.0-beta.8

package/dist/{chunk-V5S5FRGV.js → chunk-CMZDZGUZ.js}

@@ -1,25 +1,32 @@
 import {
-  ComposerControlTooltip,
+  AGENT_MODEL_OPTIONS,
+  AgentLoadingState,
+  DEFAULT_AGENT_PICKER_MODEL_ID,
+  EmbedSessionManager,
   PanelShell,
-  PoweredByHero,
-  clearAgentComposerDraftsForProject,
+  ShellConversation,
+  containsComposerFocus,
+  createSubmittedAgentShellHandoff,
   isHeroUIAgentAttachmentContentType,
-  readAgentShellHandoff,
   readSidebarWidth,
-  resizeComposerTextarea,
   resolveOptions,
-  scheduleIdleTask,
+  setFocus,
+  writeAgentShellAttachments,
   writeAgentShellHandoff
-} from "./chunk-OQGXZY5L.js";
+} from "./chunk-W7SCMB3O.js";
+import {
+  renderInlineMarkdown
+} from "./chunk-Q7LGTVBL.js";
 
 // src/embed/provider.tsx
 import {
   useCallback,
   useEffect as useEffect2,
+  useEffectEvent,
   useLayoutEffect,
   useMemo,
   useRef as useRef2,
-  useState as useState2,
+  useState,
   useSyncExternalStore
 } from "react";
 import { createRoot } from "react-dom/client";
@@ -288,17 +295,33 @@ function parseAgentRemoteConfig(value) {
 function cacheKey(agentId) {
   return `heroui-agent:config:${agentId}`;
 }
-function readCachedRemoteConfig(agentId) {
+var REMOTE_CONFIG_CACHE_VERSION = 1;
+function readCachedRemoteConfigSnapshot(agentId) {
   try {
     const raw = window.localStorage.getItem(cacheKey(agentId));
-    return raw ? parseAgentRemoteConfig(JSON.parse(raw)) : null;
+    if (!raw) return null;
+    const value = JSON.parse(raw);
+    if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+      const envelope = value;
+      if (envelope.cacheVersion === REMOTE_CONFIG_CACHE_VERSION && typeof envelope.cachedAt === "number" && Number.isFinite(envelope.cachedAt)) {
+        const config = parseAgentRemoteConfig(envelope.config);
+        return config ? { cachedAt: envelope.cachedAt, config, legacy: false } : null;
+      }
+    }
+    const legacyConfig = parseAgentRemoteConfig(value);
+    return legacyConfig ? { cachedAt: 0, config: legacyConfig, legacy: true } : null;
   } catch {
     return null;
   }
 }
-function writeCachedRemoteConfig(agentId, config) {
+function writeCachedRemoteConfig(agentId, config, cachedAt = Date.now()) {
   try {
-    window.localStorage.setItem(cacheKey(agentId), JSON.stringify(config));
+    const envelope = {
+      cacheVersion: REMOTE_CONFIG_CACHE_VERSION,
+      cachedAt,
+      config
+    };
+    window.localStorage.setItem(cacheKey(agentId), JSON.stringify(envelope));
   } catch {
   }
 }
@@ -327,126 +350,125 @@ async function fetchRemoteConfig(apiBaseUrl, agentId, options = {}) {
   }
 }
 
-// src/embed/shell-conversation.tsx
-import { useEffect, useRef, useState } from "react";
+// src/embed/shell-composer-presentation.tsx
+import { ChevronDown, Microphone, Plus, ShieldCheck } from "@gravity-ui/icons";
+import { useEffect, useRef } from "react";
 import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
-function ShellConversation({
-  agentId,
-  greeting,
+var PERMISSION_LABELS = {
+  ask: "Ask for approval",
+  auto: "Approve for me",
+  full: "Full access"
+};
+function createShellComposerPresentation({
+  onFileDialogActiveChange,
   onIntent,
-  placeholder,
-  suggestedPrompts
+  options
 }) {
-  const [input, setInput] = useState(() => readAgentShellHandoff(agentId)?.prompt ?? "");
-  const [submitted, setSubmitted] = useState(false);
-  const textareaRef = useRef(null);
-  useEffect(() => {
-    if (submitted) return;
-    writeAgentShellHandoff(agentId, { prompt: input, submitted: false });
-  }, [input, agentId, submitted]);
-  const submit = (prompt) => {
-    const trimmed = prompt.trim();
-    if (!trimmed) return;
-    setSubmitted(true);
-    setInput(trimmed);
-    writeAgentShellHandoff(agentId, { prompt: trimmed, submitted: true });
-    onIntent();
+  return {
+    end: /* @__PURE__ */ jsx3(ShellComposerControls, { options }),
+    footer: options.composerDisclaimer ? /* @__PURE__ */ jsx3("p", { className: "ha-footnote", children: renderInlineMarkdown(options.composerDisclaimer) }) : null,
+    start: options.composerAttachmentContentTypes.length > 0 ? /* @__PURE__ */ jsx3(
+      ShellAttachmentControl,
+      {
+        accept: options.composerAttachmentAccept,
+        agentId: options.agentId,
+        onFileDialogActiveChange,
+        onIntent
+      }
+    ) : null
   };
+}
+function ShellAttachmentControl({
+  accept,
+  agentId,
+  onFileDialogActiveChange,
+  onIntent
+}) {
+  const inputRef = useRef(null);
+  useEffect(() => {
+    const input = inputRef.current;
+    let focusTimer;
+    const release = () => onFileDialogActiveChange(false);
+    const releaseAfterFocus = () => {
+      focusTimer = window.setTimeout(release, 0);
+    };
+    input?.addEventListener("cancel", release);
+    window.addEventListener("focus", releaseAfterFocus);
+    return () => {
+      input?.removeEventListener("cancel", release);
+      window.removeEventListener("focus", releaseAfterFocus);
+      window.clearTimeout(focusTimer);
+    };
+  }, [onFileDialogActiveChange]);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx3("div", { className: "ha-conversation", children: /* @__PURE__ */ jsxs("div", { "aria-live": "polite", className: "ha-messages", role: "log", children: [
-      /* @__PURE__ */ jsxs("div", { className: "ha-empty", children: [
-        /* @__PURE__ */ jsx3("h2", { children: greeting }),
-        /* @__PURE__ */ jsx3("p", { children: "Live answers with charts, metrics, and tables." })
-      ] }),
-      submitted ? /* @__PURE__ */ jsx3("div", { className: "ha-message", "data-role": "user", children: /* @__PURE__ */ jsx3("div", { className: "ha-message-body", children: input }) }) : null
-    ] }) }),
-    /* @__PURE__ */ jsxs(
-      "form",
+    /* @__PURE__ */ jsx3(
+      "input",
+      {
+        ref: inputRef,
+        multiple: true,
+        accept,
+        "aria-label": "Choose files to attach",
+        className: "ha-file-input",
+        type: "file",
+        onChange: (event) => {
+          writeAgentShellAttachments(agentId, Array.from(event.currentTarget.files ?? []));
+          event.currentTarget.value = "";
+          onFileDialogActiveChange(false);
+          onIntent();
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx3(
+      "button",
       {
-        className: "ha-composer-wrap",
-        onSubmit: (event) => {
-          event.preventDefault();
-          submit(input);
+        "aria-label": "Attach files",
+        className: "ha-attach",
+        type: "button",
+        onClick: () => {
+          onFileDialogActiveChange(true);
+          inputRef.current?.click();
         },
-        children: [
-          !submitted && suggestedPrompts.length > 0 ? /* @__PURE__ */ jsx3("div", { "aria-label": "Suggested prompts", className: "ha-suggestions", role: "group", children: suggestedPrompts.map((prompt) => /* @__PURE__ */ jsxs(
-            "button",
-            {
-              className: "ha-suggestion",
-              type: "button",
-              onClick: () => submit(prompt),
-              children: [
-                /* @__PURE__ */ jsx3("span", { children: prompt }),
-                /* @__PURE__ */ jsx3(ArrowUpRightGlyph, {})
-              ]
-            },
-            prompt
-          )) }) : null,
-          /* @__PURE__ */ jsxs("div", { className: "@container ha-composer", children: [
-            /* @__PURE__ */ jsx3(
-              "textarea",
-              {
-                ref: textareaRef,
-                "aria-label": "Message the assistant",
-                placeholder,
-                rows: 1,
-                value: input,
-                onFocus: onIntent,
-                onChange: (event) => {
-                  setInput(event.currentTarget.value);
-                  resizeComposerTextarea(event.currentTarget);
-                  onIntent();
-                },
-                onKeyDown: (event) => {
-                  if (event.key !== "Enter" || event.shiftKey) return;
-                  event.preventDefault();
-                  submit(input);
-                }
-              }
-            ),
-            /* @__PURE__ */ jsxs(
-              "button",
-              {
-                "aria-label": "Send message",
-                className: "ha-send",
-                "data-shortcut": "\u21B5",
-                "data-tooltip": "Send message",
-                disabled: !input.trim() || submitted,
-                type: "submit",
-                children: [
-                  /* @__PURE__ */ jsx3(ArrowUpGlyph, {}),
-                  /* @__PURE__ */ jsx3(ComposerControlTooltip, { shortcut: "\u21B5", children: "Send message" })
-                ]
-              }
-            )
-          ] }),
-          /* @__PURE__ */ jsx3(PoweredByHero, {})
-        ]
+        children: /* @__PURE__ */ jsx3(Plus, { "aria-hidden": "true" })
       }
     )
   ] });
 }
-function ArrowUpGlyph() {
-  return /* @__PURE__ */ jsx3("svg", { "aria-hidden": "true", fill: "none", height: "18", viewBox: "0 0 18 18", width: "18", children: /* @__PURE__ */ jsx3(
-    "path",
-    {
-      d: "M9 14.5V3.5m0 0L4.5 8M9 3.5 13.5 8",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: "1.6"
-    }
-  ) });
+function ShellComposerControls({ options }) {
+  const modelId = options.composerDefaultModel ?? DEFAULT_AGENT_PICKER_MODEL_ID;
+  const modelLabel = AGENT_MODEL_OPTIONS.find((option) => option.id === modelId)?.label ?? modelId;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    options.permissionShowPicker && options.tools.length > 0 ? /* @__PURE__ */ jsx3(
+      ShellPicker,
+      {
+        icon: /* @__PURE__ */ jsx3(ShieldCheck, { "aria-hidden": "true", className: "aui-permission-picker__trigger-icon" }),
+        kind: "permission",
+        label: PERMISSION_LABELS[options.permissionDefaultMode],
+        tone: options.permissionDefaultMode === "full" ? "warning" : void 0
+      }
+    ) : null,
+    options.composerModelPicker ? /* @__PURE__ */ jsx3(ShellPicker, { kind: "model", label: modelLabel }) : null,
+    options.composerDictation ? /* @__PURE__ */ jsx3("button", { disabled: true, "aria-label": "Dictate message", className: "ha-dictation", type: "button", children: /* @__PURE__ */ jsx3(Microphone, { "aria-hidden": "true" }) }) : null
+  ] });
 }
-function ArrowUpRightGlyph() {
-  return /* @__PURE__ */ jsx3("svg", { "aria-hidden": "true", fill: "none", height: "16", viewBox: "0 0 16 16", width: "16", children: /* @__PURE__ */ jsx3(
-    "path",
+function ShellPicker({
+  icon,
+  kind,
+  label,
+  tone
+}) {
+  const name = `aui-${kind}-picker`;
+  return /* @__PURE__ */ jsx3("div", { className: `${name} ha-${kind}-picker`, "data-tone": tone, children: /* @__PURE__ */ jsxs(
+    "button",
     {
-      d: "M5 11 11 5m0 0H6m5 0v5",
-      stroke: "currentColor",
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: "1.5"
+      disabled: true,
+      "aria-label": kind === "model" ? "AI model" : "Tool permissions",
+      className: `${name}__trigger ha-shell-picker-trigger`,
+      type: "button",
+      children: [
+        icon,
+        /* @__PURE__ */ jsx3("span", { className: `${name}__value`, children: label }),
+        /* @__PURE__ */ jsx3(ChevronDown, { "aria-hidden": "true", className: `${name}__indicator` })
+      ]
     }
   ) });
 }
@@ -507,8 +529,8 @@ function loadAgentWebfont(font) {
 
 // src/embed/provider.tsx
 import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
-var REMOTE_CONFIG_PAINT_BUDGET_MS = 600;
-var RUNTIME_PREFETCH_IDLE_TIMEOUT_MS = 1200;
+var REMOTE_CONFIG_RESOLUTION_TIMEOUT_MS = 600;
+var REMOTE_CONFIG_PRESENTATION_MAX_AGE_MS = 5 * 6e4;
 var OPEN_STATE_STORAGE_PREFIX = "heroui-agent:open:";
 function openStateStorageKey(agentId) {
   return `${OPEN_STATE_STORAGE_PREFIX}${agentId}`;
@@ -532,13 +554,24 @@ var embedRuntimePromise;
 function loadEmbedRuntime() {
   embedRuntimePromise ??= import(
     /* webpackPrefetch: true */
-    "./embed-runtime-UF7XJIFA.js"
+    "./embed-runtime-VVAGDPYY.js"
   ).then(
     (module) => module.default
   );
   return embedRuntimePromise;
 }
 var controllers = /* @__PURE__ */ new Map();
+var controllerListeners = /* @__PURE__ */ new Set();
+function getController(agentId) {
+  return agentId ? controllers.get(agentId) : [...controllers.values()][controllers.size - 1];
+}
+function notifyControllerListeners() {
+  for (const listener of controllerListeners) listener();
+}
+function subscribeToControllers(listener) {
+  controllerListeners.add(listener);
+  return () => controllerListeners.delete(listener);
+}
 function subscribeToColorScheme(onChange) {
   const media = window.matchMedia?.("(prefers-color-scheme: dark)");
   media?.addEventListener?.("change", onChange);
@@ -547,68 +580,98 @@ function subscribeToColorScheme(onChange) {
 function prefersDarkColorScheme() {
   return window.matchMedia?.("(prefers-color-scheme: dark)").matches === true;
 }
-function dispatch(agentId, method) {
-  const controller = agentId ? controllers.get(agentId) : [...controllers.values()][controllers.size - 1];
+function dispatch(agentId, method, ...args) {
+  const controller = getController(agentId);
   if (!controller) {
     console.warn("HeroUI Agent is not mounted yet. Add <HeroUIAgent /> to your layout.");
     return;
   }
-  controller[method]();
+  const action = controller[method];
+  action(...args);
 }
 function useRemoteConfig(agentId, apiBaseUrl, enabled) {
-  const [state, setState] = useState2(() => {
-    if (!enabled || typeof window === "undefined") return { config: null, resolved: false };
-    const cached = readCachedRemoteConfig(agentId);
-    return { config: cached, resolved: Boolean(cached) };
+  const [cachedSnapshot] = useState(() => {
+    if (!enabled || typeof window === "undefined") return null;
+    return readCachedRemoteConfigSnapshot(agentId);
+  });
+  const [state, setState] = useState(() => {
+    if (!enabled) return { config: null, presentationReady: true };
+    const cacheAge = cachedSnapshot ? Date.now() - cachedSnapshot.cachedAt : Number.POSITIVE_INFINITY;
+    const fresh = cachedSnapshot !== null && !cachedSnapshot.legacy && cacheAge >= 0 && cacheAge <= REMOTE_CONFIG_PRESENTATION_MAX_AGE_MS;
+    return {
+      config: fresh ? cachedSnapshot.config : null,
+      presentationReady: fresh
+    };
   });
   useEffect2(() => {
     if (!enabled) return;
-    const cached = readCachedRemoteConfig(agentId);
     const controller = new AbortController();
-    const budget = window.setTimeout(
-      () => setState((current) => ({ ...current, resolved: true })),
-      REMOTE_CONFIG_PAINT_BUDGET_MS
-    );
+    let active = true;
+    const settle = (config) => {
+      setState(
+        (current) => current.presentationReady ? current : { config, presentationReady: true }
+      );
+    };
+    const budget = window.setTimeout(() => {
+      if (!active) return;
+      controller.abort();
+      settle(cachedSnapshot?.config ?? null);
+    }, REMOTE_CONFIG_RESOLUTION_TIMEOUT_MS);
     void fetchRemoteConfig(apiBaseUrl, agentId, {
-      ...cached?.revision ? { revision: cached.revision } : {},
+      ...cachedSnapshot?.config.revision ? { revision: cachedSnapshot.config.revision } : {},
       signal: controller.signal
     }).then((result) => {
-      if (controller.signal.aborted) return;
+      if (!active || controller.signal.aborted) return;
       if (result.status === "ok") {
-        setState({ config: result.config, resolved: true });
         writeCachedRemoteConfig(agentId, result.config);
+        settle(result.config);
+        return;
+      }
+      if (result.status === "not-modified") {
+        if (cachedSnapshot) writeCachedRemoteConfig(agentId, cachedSnapshot.config);
+        settle(cachedSnapshot?.config ?? null);
+        return;
       }
       if (result.status === "missing") {
-        setState({ config: null, resolved: true });
         clearCachedRemoteConfig(agentId);
+        settle(null);
+        return;
       }
+      settle(cachedSnapshot?.config ?? null);
     }).finally(() => {
-      if (controller.signal.aborted) return;
+      if (!active || controller.signal.aborted) return;
       window.clearTimeout(budget);
-      setState((current) => ({ ...current, resolved: true }));
     });
     return () => {
+      active = false;
       controller.abort();
       window.clearTimeout(budget);
     };
-  }, [apiBaseUrl, enabled, agentId]);
-  return enabled ? state : { config: null, resolved: true };
+  }, [apiBaseUrl, cachedSnapshot, enabled, agentId]);
+  return enabled ? state : { config: null, presentationReady: true };
 }
 function useAgent(agentId) {
+  const getReadySnapshot = useCallback(() => getController(agentId)?.ready ?? false, [agentId]);
+  const ready = useSyncExternalStore(subscribeToControllers, getReadySnapshot, () => false);
   return useMemo(
     () => ({
       hide: () => dispatch(agentId, "hide"),
-      newConversation: () => dispatch(agentId, "newConversation"),
+      newConversation: (prompt) => dispatch(agentId, "newConversation", prompt),
       preload: () => dispatch(agentId, "preload"),
+      ready,
       refreshAuth: () => dispatch(agentId, "refreshAuth"),
       show: () => dispatch(agentId, "show"),
       shutdown: () => dispatch(agentId, "shutdown"),
       toggle: () => dispatch(agentId, "toggle")
     }),
-    [agentId]
+    [agentId, ready]
   );
 }
 function HeroUIAgent(props) {
+  const remoteSourceKey = `${props.agentId}\0${props._api?.baseUrl ?? ""}\0${props.remoteConfig !== false}`;
+  return /* @__PURE__ */ jsx4(HeroUIAgentMount, { ...props }, remoteSourceKey);
+}
+function HeroUIAgentMount(props) {
   const {
     _api,
     agentId,
@@ -620,6 +683,7 @@ function HeroUIAgent(props) {
     getAuthToken,
     markdown,
     onFeedback,
+    onReady,
     permissions,
     preload: preloadEnabled,
     remoteConfig: remoteConfigEnabled = true,
@@ -632,7 +696,7 @@ function HeroUIAgent(props) {
   } = props;
   const markdownPlugins = markdown?.plugins;
   const apiBaseUrl = (_api?.baseUrl ?? "https://api.heroui.com").replace(/\/$/, "");
-  const { config: remoteConfig, resolved: remoteConfigResolved } = useRemoteConfig(
+  const { config: remoteConfig, presentationReady: remoteConfigPresentationReady } = useRemoteConfig(
     agentId,
     apiBaseUrl,
     remoteConfigEnabled
@@ -668,26 +732,34 @@ function HeroUIAgent(props) {
       tools
     });
   }, [context, getAuthToken, markdownPlugins, onFeedback, agentId, serializedConfig, tools]);
+  const tokenManager = useMemo(
+    () => new EmbedSessionManager(agentId, getAuthToken),
+    [agentId, getAuthToken]
+  );
   const hostFont = hostSuppliesFont(props);
   const remoteWebfont = remoteConfig?.webfont;
   useEffect2(() => {
     if (hostFont) return;
     return loadAgentWebfont(remoteWebfont);
   }, [hostFont, remoteWebfont]);
-  const [restoredOpenState] = useState2(() => reopenOnRefresh === true && readOpenState(agentId));
-  const [isOpen, setIsOpen] = useState2(restoredOpenState);
-  const [conversationEpoch, setConversationEpoch] = useState2(1);
-  const [identityEpoch, setIdentityEpoch] = useState2(1);
-  const [identityReset, setIdentityReset] = useState2(false);
-  const [requestedConversationId, setRequestedConversationId] = useState2(
+  const [restoredOpenState] = useState(() => reopenOnRefresh === true && readOpenState(agentId));
+  const [openRequested, setOpenRequested] = useState(restoredOpenState);
+  const [conversationEpoch, setConversationEpoch] = useState(1);
+  const [identityEpoch, setIdentityEpoch] = useState(1);
+  const [identityReset, setIdentityReset] = useState(false);
+  const [requestedConversationId, setRequestedConversationId] = useState(
     restoredOpenState || options.startNewConversationOnOpen ? null : void 0
   );
-  const [portalRoot, setPortalRoot] = useState2(null);
-  const [EmbedRuntime, setEmbedRuntime] = useState2(null);
+  const [portalRoot, setPortalRoot] = useState(null);
+  const [EmbedRuntime, setEmbedRuntime] = useState(null);
+  const [hasCompletedInitialLoad, setHasCompletedInitialLoad] = useState(false);
+  const [hasUnreadMessages, setHasUnreadMessages] = useState(false);
+  const [runtimeReadyEpoch, setRuntimeReadyEpoch] = useState(null);
   const conversationEpochRef = useRef2(1);
   const launcherRef = useRef2(null);
+  const restoreLauncherFocusRef = useRef2(false);
   const portalRootRef = useRef2(null);
-  const readyEpochRef = useRef2(null);
+  const reportedReadyEpochRef = useRef2(null);
   const shouldOpenRef = useRef2(restoredOpenState);
   const hostRef = useRef2(null);
   const embedReactRootRef = useRef2(null);
@@ -698,20 +770,39 @@ function HeroUIAgent(props) {
     () => false
   );
   const designThemeClass = options.designTheme === "base" ? null : `${options.designTheme}-${options.colorScheme === "system" ? prefersDark ? "dark" : "light" : options.colorScheme}`;
-  const [shouldLoadRuntime, setShouldLoadRuntime] = useState2(restoredOpenState);
+  const ready = remoteConfigPresentationReady && runtimeReadyEpoch === conversationEpoch && EmbedRuntime !== null;
+  const isOpen = remoteConfigPresentationReady && openRequested;
+  const [shouldLoadRuntime, setShouldLoadRuntime] = useState(restoredOpenState || options.preload);
   const requestRuntime = useCallback(() => setShouldLoadRuntime(true), []);
-  const [preloadRequested, setPreloadRequested] = useState2(false);
-  const shouldWarmSession = options.preload || preloadRequested;
+  const [composerControlsRevealed, setComposerControlsRevealed] = useState(false);
+  const [composerFileDialogActive, setComposerFileDialogActive] = useState(false);
+  const revealComposerControls = useCallback(() => setComposerControlsRevealed(true), []);
   useEffect2(() => {
-    if (options.reopenOnRefresh) writeOpenState(options.agentId, isOpen);
-    else writeOpenState(options.agentId, false);
-  }, [isOpen, options.agentId, options.reopenOnRefresh]);
+    if (!composerControlsRevealed || !portalRoot) return;
+    const reconcileComposerFocus = () => {
+      queueMicrotask(() => {
+        const composer2 = portalRoot.querySelector(".ha-composer:not([hidden] *)");
+        if (composer2 && containsComposerFocus(composer2, document.activeElement)) return;
+        setComposerControlsRevealed(false);
+      });
+    };
+    portalRoot.addEventListener("focusout", reconcileComposerFocus);
+    return () => portalRoot.removeEventListener("focusout", reconcileComposerFocus);
+  }, [composerControlsRevealed, portalRoot]);
   useEffect2(() => {
-    if (!options.preload || shouldLoadRuntime) return;
-    return scheduleIdleTask(requestRuntime, RUNTIME_PREFETCH_IDLE_TIMEOUT_MS);
-  }, [options.preload, requestRuntime, shouldLoadRuntime]);
+    if (!shouldLoadRuntime) return;
+    void tokenManager.get().catch(() => void 0);
+  }, [shouldLoadRuntime, tokenManager]);
+  useEffect2(() => {
+    if (options.reopenOnRefresh) writeOpenState(options.agentId, openRequested);
+    else writeOpenState(options.agentId, false);
+  }, [openRequested, options.agentId, options.reopenOnRefresh]);
   useEffect2(() => {
     if (!shouldLoadRuntime) return;
+    if (!remoteConfigPresentationReady) {
+      void loadEmbedRuntime().catch(() => void 0);
+      return;
+    }
     let active = true;
     void loadEmbedRuntime().then((runtime) => {
       if (active) setEmbedRuntime(() => runtime);
@@ -719,7 +810,7 @@ function HeroUIAgent(props) {
     return () => {
       active = false;
     };
-  }, [shouldLoadRuntime]);
+  }, [remoteConfigPresentationReady, shouldLoadRuntime]);
   useEffect2(() => {
     if (!isOpen || options.viewMode !== "sidebar") return;
     if (window.innerWidth < 640) return;
@@ -755,6 +846,7 @@ function HeroUIAgent(props) {
     });
     return () => {
       active = false;
+      setFocus(options.agentId, false);
       const reactRoot = embedReactRootRef.current;
       portalRootRef.current = null;
       hostRef.current = null;
@@ -802,6 +894,7 @@ function HeroUIAgent(props) {
     designThemeClass,
     isOpen,
     options.colorScheme,
+    options.agentId,
     options.launcherOffset,
     options.launcherPosition,
     options.panelStyle,
@@ -809,43 +902,64 @@ function HeroUIAgent(props) {
     options.viewMode,
     portalRoot
   ]);
-  const prepareNextConversation = useCallback((conversationId) => {
-    readyEpochRef.current = null;
-    setRequestedConversationId(conversationId);
-    setConversationEpoch((epoch) => {
-      const nextEpoch = epoch + 1;
+  const prepareNextConversation = useCallback(
+    (conversationId) => {
+      setFocus(options.agentId, false);
+      setComposerFileDialogActive(false);
+      setRuntimeReadyEpoch(null);
+      setRequestedConversationId(conversationId);
+      const nextEpoch = conversationEpochRef.current + 1;
       conversationEpochRef.current = nextEpoch;
-      return nextEpoch;
-    });
-  }, []);
+      setConversationEpoch(nextEpoch);
+    },
+    [options.agentId]
+  );
   const handleRuntimeReady = useCallback((readyEpoch) => {
     if (conversationEpochRef.current !== readyEpoch) return;
-    readyEpochRef.current = readyEpoch;
-    if (shouldOpenRef.current) setIsOpen(true);
+    setHasCompletedInitialLoad(true);
+    setRuntimeReadyEpoch(readyEpoch);
   }, []);
+  const emitReady = useEffectEvent(() => onReady?.());
+  useEffect2(() => {
+    if (!ready || reportedReadyEpochRef.current === conversationEpoch) return;
+    reportedReadyEpochRef.current = conversationEpoch;
+    emitReady();
+  }, [conversationEpoch, ready]);
   const hide = useCallback(() => {
     shouldOpenRef.current = false;
-    setIsOpen(false);
+    restoreLauncherFocusRef.current = true;
+    setOpenRequested(false);
+    setComposerControlsRevealed(false);
     prepareNextConversation(options.startNewConversationOnOpen ? null : void 0);
-    requestAnimationFrame(() => launcherRef.current?.focus());
   }, [options.startNewConversationOnOpen, prepareNextConversation]);
+  useEffect2(() => {
+    if (isOpen || !ready || !restoreLauncherFocusRef.current) return;
+    restoreLauncherFocusRef.current = false;
+    requestAnimationFrame(() => launcherRef.current?.focus());
+  }, [isOpen, ready]);
   const show = useCallback(() => {
     shouldOpenRef.current = true;
-    requestRuntime();
-    setIsOpen(true);
-  }, [requestRuntime]);
-  const preload = useCallback(() => {
-    setPreloadRequested(true);
+    setOpenRequested(true);
     requestRuntime();
   }, [requestRuntime]);
-  const newConversation = useCallback(() => {
-    shouldOpenRef.current = true;
-    requestRuntime();
-    prepareNextConversation(null);
-  }, [prepareNextConversation, requestRuntime]);
+  const preload = requestRuntime;
+  const newConversation = useCallback(
+    (prompt) => {
+      const submission = prompt ? createSubmittedAgentShellHandoff(prompt) : null;
+      if (submission) writeAgentShellHandoff(options.agentId, submission);
+      shouldOpenRef.current = true;
+      setOpenRequested(true);
+      setComposerControlsRevealed(false);
+      requestRuntime();
+      prepareNextConversation(null);
+    },
+    [options.agentId, prepareNextConversation, requestRuntime]
+  );
   const selectConversation = useCallback(
     (conversationId) => {
       shouldOpenRef.current = true;
+      setOpenRequested(true);
+      setComposerControlsRevealed(false);
       requestRuntime();
       prepareNextConversation(conversationId);
     },
@@ -856,6 +970,7 @@ function HeroUIAgent(props) {
     else show();
   }, [hide, isOpen, show]);
   const refreshAuth = useCallback(() => {
+    setHasUnreadMessages(false);
     setIdentityReset(false);
     setIdentityEpoch((epoch) => epoch + 1);
   }, []);
@@ -863,21 +978,24 @@ function HeroUIAgent(props) {
     const prefixes = [
       `heroui-agent:anonymous:${options.agentId}`,
       `heroui-agent:conversation:${options.agentId}:`,
-      `heroui-agent:history:${options.agentId}:`,
-      `heroui-agent:session:${options.agentId}:`
+      `heroui-agent:history:${options.agentId}:`
     ];
     for (let index = localStorage.length - 1; index >= 0; index -= 1) {
       const key = localStorage.key(index);
       if (key && prefixes.some((prefix) => key.startsWith(prefix))) localStorage.removeItem(key);
     }
     shouldOpenRef.current = false;
-    setIsOpen(false);
+    setHasUnreadMessages(false);
+    setOpenRequested(false);
+    setComposerControlsRevealed(false);
     writeOpenState(options.agentId, false);
     setIdentityReset(true);
     setIdentityEpoch((epoch) => epoch + 1);
     prepareNextConversation();
     window.setTimeout(() => {
-      void clearAgentComposerDraftsForProject(options.agentId);
+      void import("./composer-draft-DTQAEO5K.js").then(
+        ({ clearAgentComposerDraftsForProject }) => clearAgentComposerDraftsForProject(options.agentId)
+      ).catch(() => void 0);
     }, 0);
   }, [options.agentId, prepareNextConversation]);
   useEffect2(() => {
@@ -885,53 +1003,68 @@ function HeroUIAgent(props) {
       hide,
       newConversation,
       preload,
+      ready,
       refreshAuth,
       show,
       shutdown,
       toggle
     };
     controllers.set(options.agentId, controller);
+    notifyControllerListeners();
     return () => {
       if (controllers.get(options.agentId) === controller) {
         controllers.delete(options.agentId);
+        notifyControllerListeners();
       }
     };
-  }, [hide, newConversation, options.agentId, preload, refreshAuth, show, shutdown, toggle]);
+  }, [hide, newConversation, options.agentId, preload, ready, refreshAuth, show, shutdown, toggle]);
   useLayoutEffect(() => {
     const reactRoot = embedReactRootRef.current;
     if (!portalRoot || !reactRoot) return;
+    const shellComposer = createShellComposerPresentation({
+      onFileDialogActiveChange: setComposerFileDialogActive,
+      onIntent: requestRuntime,
+      options
+    });
     reactRoot.render(
       /* @__PURE__ */ jsxs2(Fragment2, { children: [
-        options.showLauncher && remoteConfigResolved && !isOpen ? /* @__PURE__ */ jsx4(
+        remoteConfigPresentationReady && options.showLauncher && !isOpen ? /* @__PURE__ */ jsxs2(
           "button",
           {
             ref: launcherRef,
             "aria-expanded": false,
             "aria-haspopup": "dialog",
-            "aria-label": "Open data assistant",
             className: "ha-launcher",
             style: options.launcherStyle,
             type: "button",
+            "aria-label": hasUnreadMessages ? "Open data assistant, unread messages" : "Open data assistant",
             onClick: show,
-            onFocus: options.preload ? requestRuntime : void 0,
-            onPointerEnter: options.preload ? requestRuntime : void 0,
-            children: /* @__PURE__ */ jsx4(LauncherIcon, { icon: options.launcherIcon })
+            children: [
+              /* @__PURE__ */ jsx4(LauncherIcon, { icon: options.launcherIcon }),
+              hasUnreadMessages ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", className: "ha-launcher__unread" }) : null
+            ]
           }
         ) : null,
-        EmbedRuntime ? /* @__PURE__ */ jsx4(
+        EmbedRuntime && !composerFileDialogActive ? /* @__PURE__ */ jsx4(
           EmbedRuntime,
           {
+            composerControlsRevealed,
             conversationEpoch,
             identityEpoch,
             identityReset,
             open: isOpen,
             options,
             requestedConversationId,
-            warmSession: shouldWarmSession,
+            shellComposerEndSlot: shellComposer.end,
+            shellComposerFooterSlot: shellComposer.footer,
+            showReadyLoader: !hasCompletedInitialLoad && requestedConversationId !== null,
+            tokenManager,
             onClose: hide,
+            onComposerControlsReveal: revealComposerControls,
             onNewConversation: newConversation,
             onReady: handleRuntimeReady,
-            onSelectConversation: selectConversation
+            onSelectConversation: selectConversation,
+            onUnreadChange: setHasUnreadMessages
           }
         ) : /* @__PURE__ */ jsx4(
           PanelShell,
@@ -939,28 +1072,41 @@ function HeroUIAgent(props) {
             agentId: options.agentId,
             defaultExpanded: options.panelExpanded,
             expandable: options.panelExpandable,
+            historySlot: /* @__PURE__ */ jsx4(Fragment2, {}),
             modal: options.viewMode !== "sidebar",
             name: "Data assistant",
             open: isOpen,
             onClose: hide,
-            children: /* @__PURE__ */ jsx4(
+            children: requestedConversationId === null ? /* @__PURE__ */ jsx4(
               ShellConversation,
               {
+                composerConnecting: true,
                 agentId: options.agentId,
+                composerControlsAvailable: options.composerControlsAvailable,
+                composerControlsRevealed,
+                composerEndSlot: shellComposer.end,
+                composerFooterSlot: shellComposer.footer,
+                composerStartSlot: shellComposer.start,
                 greeting: options.greeting,
                 placeholder: options.composerPlaceholder,
                 suggestedPrompts: options.suggestedPrompts ?? [],
+                onComposerControlsReveal: revealComposerControls,
                 onIntent: requestRuntime
-              }
-            )
+              },
+              `shell-${conversationEpoch}`
+            ) : /* @__PURE__ */ jsx4(AgentLoadingState, {})
           }
         )
       ] })
     );
   }, [
     EmbedRuntime,
+    composerControlsRevealed,
+    composerFileDialogActive,
     conversationEpoch,
     handleRuntimeReady,
+    hasUnreadMessages,
+    hasCompletedInitialLoad,
     hide,
     identityEpoch,
     identityReset,
@@ -968,12 +1114,14 @@ function HeroUIAgent(props) {
     newConversation,
     options,
     portalRoot,
-    remoteConfigResolved,
-    requestRuntime,
+    ready,
+    remoteConfigPresentationReady,
     requestedConversationId,
+    requestRuntime,
+    revealComposerControls,
     selectConversation,
-    shouldWarmSession,
-    show
+    show,
+    tokenManager
   ]);
   return null;
 }