@athenaintel/react 0.4.5 → 0.5.0

package/dist/index.cjs

@@ -16435,45 +16435,16 @@ function useParentAuth() {
   const [authToken, setAuthToken] = React.useState(null);
   const readySignalSent = React.useRef(false);
   React.useEffect(() => {
-    const isInIframe = window.parent !== window;
-    if (process.env.NODE_ENV !== "production") {
-      console.log("[AthenaAuth] useParentAuth mounted", {
-        isInIframe,
-        currentOrigin: window.location.origin,
-        currentUrl: window.location.href
-      });
-    }
     const handler = (event) => {
-      var _a2;
-      if (process.env.NODE_ENV !== "production") {
-        console.log("[AthenaAuth] Received PostMessage", {
-          type: (_a2 = event.data) == null ? void 0 : _a2.type,
-          origin: event.origin,
-          isTrusted: isTrustedOrigin(event.origin)
-        });
-      }
-      if (!isTrustedOrigin(event.origin)) {
-        if (process.env.NODE_ENV !== "production") {
-          console.warn("[AthenaAuth] Rejected PostMessage — untrusted origin:", event.origin);
-        }
-        return;
-      }
+      if (!isTrustedOrigin(event.origin)) return;
       if (event.data && typeof event.data === "object" && event.data.type === "athena-auth" && typeof event.data.token === "string") {
-        if (process.env.NODE_ENV !== "production") {
-          console.log("[AthenaAuth] PropelAuth token received via PostMessage, length:", event.data.token.length);
-        }
         setAuthToken(event.data.token);
       }
     };
     window.addEventListener("message", handler);
-    if (!readySignalSent.current && isInIframe) {
-      if (process.env.NODE_ENV !== "production") {
-        console.log("[AthenaAuth] Sending athena-auth-ready signal to parent");
-      }
+    if (!readySignalSent.current && window.parent !== window) {
       window.parent.postMessage({ type: "athena-auth-ready" }, "*");
       readySignalSent.current = true;
-    } else if (!isInIframe && process.env.NODE_ENV !== "production") {
-      console.log("[AthenaAuth] Not in iframe — skipping parent auth (standalone mode)");
     }
     return () => window.removeEventListener("message", handler);
   }, []);
@@ -20798,24 +20769,12 @@ const useAthenaRuntime = (config2) => {
     initialState: { messages: initialMessages ?? [] },
     converter,
     api: apiUrl,
-    headers: async () => {
-      const authHeaders = tokenRef.current ? { Authorization: `Bearer ${tokenRef.current}` } : apiKeyRef.current ? { "X-API-KEY": apiKeyRef.current } : {};
-      if (process.env.NODE_ENV !== "production") {
-        console.log("[AthenaAuth] Request headers", {
-          authMethod: tokenRef.current ? "Bearer token" : apiKeyRef.current ? "X-API-KEY" : "NONE",
-          hasToken: !!tokenRef.current,
-          tokenPrefix: tokenRef.current ? tokenRef.current.substring(0, 20) + "..." : void 0,
-          apiKeyPrefix: apiKeyRef.current ? apiKeyRef.current.substring(0, 10) + "..." : void 0,
-          apiUrl
-        });
-      }
-      return {
-        // Prefer parent-injected PropelAuth token over hardcoded API key
-        ...authHeaders,
-        "Accept-Encoding": "identity",
-        Accept: "text/event-stream"
-      };
-    },
+    headers: async () => ({
+      // Prefer parent-injected PropelAuth token over hardcoded API key
+      ...tokenRef.current ? { Authorization: `Bearer ${tokenRef.current}` } : apiKeyRef.current ? { "X-API-KEY": apiKeyRef.current } : {},
+      "Accept-Encoding": "identity",
+      Accept: "text/event-stream"
+    }),
     onResponse: () => {
       if (process.env.NODE_ENV !== "production") {
         console.log("[AthenaSDK] Stream connected");
@@ -24148,6 +24107,10 @@ function useAthenaConfig() {
   }
   return ctx;
 }
+const ThreadLoadingContext = React.createContext(false);
+function useThreadLoading() {
+  return React.useContext(ThreadLoadingContext);
+}
 const ThreadListContext = React.createContext(null);
 function useThreadListStore() {
   const store = React.useContext(ThreadListContext);
@@ -24225,7 +24188,7 @@ async function archiveThread(backendUrl, auth, threadId) {
 }
 function createThreadListStore(config2) {
   const auth = { apiKey: config2.apiKey, token: config2.token };
-  return create((set2, get2) => ({
+  const store = create((set2, get2) => ({
     threads: [],
     activeThreadId: null,
     isLoading: false,
@@ -24268,7 +24231,181 @@ function createThreadListStore(config2) {
       }
     }
   }));
+  store.getState().fetchThreads();
+  return store;
 }
+const THEME_TO_CSS = {
+  primary: "--primary",
+  primaryForeground: "--primary-foreground",
+  background: "--background",
+  foreground: "--foreground",
+  muted: "--muted",
+  mutedForeground: "--muted-foreground",
+  accent: "--accent",
+  accentForeground: "--accent-foreground",
+  secondary: "--secondary",
+  secondaryForeground: "--secondary-foreground",
+  card: "--card",
+  cardForeground: "--card-foreground",
+  popover: "--popover",
+  popoverForeground: "--popover-foreground",
+  destructive: "--destructive",
+  border: "--border",
+  input: "--input",
+  ring: "--ring",
+  radius: "--radius",
+  // Extended SDK-specific variables
+  sidebarBackground: "--sidebar-background",
+  sidebarBorder: "--sidebar-border",
+  userBubble: "--user-bubble",
+  userBubbleForeground: "--user-bubble-foreground",
+  assistantForeground: "--assistant-foreground",
+  composerBorder: "--composer-border",
+  composerRadius: "--composer-radius"
+};
+function themeToStyleVars(theme) {
+  const vars = {};
+  for (const [key, value] of Object.entries(theme)) {
+    if (value != null && THEME_TO_CSS[key]) {
+      vars[THEME_TO_CSS[key]] = value;
+    }
+  }
+  return vars;
+}
+const themes = {
+  /** Default light theme. Neutral grays with blue accent. */
+  light: {
+    background: "oklch(0.99 0 0)",
+    foreground: "oklch(0.13 0 0)",
+    primary: "oklch(0.55 0.2 250)",
+    primaryForeground: "oklch(1 0 0)",
+    secondary: "oklch(0.96 0.005 250)",
+    secondaryForeground: "oklch(0.13 0 0)",
+    muted: "oklch(0.96 0.005 250)",
+    mutedForeground: "oklch(0.5 0.02 250)",
+    accent: "oklch(0.94 0.01 250)",
+    accentForeground: "oklch(0.13 0 0)",
+    card: "oklch(0.99 0 0)",
+    cardForeground: "oklch(0.13 0 0)",
+    popover: "oklch(0.99 0 0)",
+    popoverForeground: "oklch(0.13 0 0)",
+    destructive: "oklch(0.55 0.22 27)",
+    border: "oklch(0.91 0.005 250)",
+    input: "oklch(0.91 0.005 250)",
+    ring: "oklch(0.55 0.2 250)",
+    radius: "0.625rem"
+  },
+  /** Dark theme. Deep gray background with lighter text. */
+  dark: {
+    background: "oklch(0.15 0 0)",
+    foreground: "oklch(0.95 0 0)",
+    primary: "oklch(0.7 0.15 250)",
+    primaryForeground: "oklch(0.13 0 0)",
+    secondary: "oklch(0.22 0 0)",
+    secondaryForeground: "oklch(0.95 0 0)",
+    muted: "oklch(0.22 0 0)",
+    mutedForeground: "oklch(0.65 0 0)",
+    accent: "oklch(0.25 0 0)",
+    accentForeground: "oklch(0.95 0 0)",
+    card: "oklch(0.18 0 0)",
+    cardForeground: "oklch(0.95 0 0)",
+    popover: "oklch(0.18 0 0)",
+    popoverForeground: "oklch(0.95 0 0)",
+    destructive: "oklch(0.65 0.2 25)",
+    border: "oklch(1 0 0 / 10%)",
+    input: "oklch(1 0 0 / 15%)",
+    ring: "oklch(0.7 0.15 250)",
+    radius: "0.625rem"
+  },
+  /** Midnight theme. Deep navy with soft blue tones. */
+  midnight: {
+    background: "oklch(0.16 0.02 260)",
+    foreground: "oklch(0.92 0.01 250)",
+    primary: "oklch(0.68 0.16 250)",
+    primaryForeground: "oklch(0.98 0 0)",
+    secondary: "oklch(0.22 0.02 260)",
+    secondaryForeground: "oklch(0.92 0.01 250)",
+    muted: "oklch(0.22 0.02 260)",
+    mutedForeground: "oklch(0.6 0.04 250)",
+    accent: "oklch(0.26 0.03 260)",
+    accentForeground: "oklch(0.92 0.01 250)",
+    card: "oklch(0.19 0.02 260)",
+    cardForeground: "oklch(0.92 0.01 250)",
+    popover: "oklch(0.19 0.02 260)",
+    popoverForeground: "oklch(0.92 0.01 250)",
+    destructive: "oklch(0.65 0.2 25)",
+    border: "oklch(0.3 0.03 260)",
+    input: "oklch(0.3 0.03 260)",
+    ring: "oklch(0.68 0.16 250)",
+    radius: "0.625rem"
+  },
+  /** Warm earthy theme. Brown and sand tones. */
+  warm: {
+    background: "oklch(0.98 0.005 80)",
+    foreground: "oklch(0.2 0.02 50)",
+    primary: "oklch(0.55 0.12 50)",
+    primaryForeground: "oklch(0.98 0 0)",
+    secondary: "oklch(0.94 0.01 80)",
+    secondaryForeground: "oklch(0.2 0.02 50)",
+    muted: "oklch(0.95 0.01 80)",
+    mutedForeground: "oklch(0.5 0.03 50)",
+    accent: "oklch(0.92 0.015 80)",
+    accentForeground: "oklch(0.2 0.02 50)",
+    card: "oklch(0.98 0.005 80)",
+    cardForeground: "oklch(0.2 0.02 50)",
+    popover: "oklch(0.98 0.005 80)",
+    popoverForeground: "oklch(0.2 0.02 50)",
+    destructive: "oklch(0.55 0.2 25)",
+    border: "oklch(0.9 0.01 80)",
+    input: "oklch(0.9 0.01 80)",
+    ring: "oklch(0.55 0.12 50)",
+    radius: "0.75rem"
+  },
+  /** Purple creative theme. Vibrant purple accent. */
+  purple: {
+    background: "oklch(0.99 0.003 310)",
+    foreground: "oklch(0.15 0.02 310)",
+    primary: "oklch(0.55 0.22 310)",
+    primaryForeground: "oklch(1 0 0)",
+    secondary: "oklch(0.96 0.01 310)",
+    secondaryForeground: "oklch(0.15 0.02 310)",
+    muted: "oklch(0.96 0.01 310)",
+    mutedForeground: "oklch(0.5 0.04 310)",
+    accent: "oklch(0.94 0.015 310)",
+    accentForeground: "oklch(0.15 0.02 310)",
+    card: "oklch(0.99 0.003 310)",
+    cardForeground: "oklch(0.15 0.02 310)",
+    popover: "oklch(0.99 0.003 310)",
+    popoverForeground: "oklch(0.15 0.02 310)",
+    destructive: "oklch(0.55 0.22 27)",
+    border: "oklch(0.92 0.005 310)",
+    input: "oklch(0.92 0.005 310)",
+    ring: "oklch(0.55 0.22 310)",
+    radius: "0.75rem"
+  },
+  /** Green nature theme. Fresh green tones. */
+  green: {
+    background: "oklch(0.99 0.003 150)",
+    foreground: "oklch(0.15 0.02 150)",
+    primary: "oklch(0.55 0.18 155)",
+    primaryForeground: "oklch(1 0 0)",
+    secondary: "oklch(0.96 0.01 150)",
+    secondaryForeground: "oklch(0.15 0.02 150)",
+    muted: "oklch(0.96 0.01 150)",
+    mutedForeground: "oklch(0.5 0.03 150)",
+    accent: "oklch(0.94 0.015 150)",
+    accentForeground: "oklch(0.15 0.02 150)",
+    card: "oklch(0.99 0.003 150)",
+    cardForeground: "oklch(0.15 0.02 150)",
+    popover: "oklch(0.99 0.003 150)",
+    popoverForeground: "oklch(0.15 0.02 150)",
+    destructive: "oklch(0.55 0.22 27)",
+    border: "oklch(0.92 0.008 150)",
+    input: "oklch(0.92 0.008 150)",
+    ring: "oklch(0.55 0.18 155)",
+    radius: "0.625rem"
+  }
+};
 function AthenaRuntimeInner({
   children,
   apiUrl,
@@ -24287,7 +24424,9 @@ function AthenaRuntimeInner({
   initialMessages
 }) {
   const auiTools = React.useMemo(() => Tools({ toolkit: frontendTools }), [frontendTools]);
-  const aui = useAui({ tools: auiTools });
+  const aui = useAui({
+    tools: auiTools
+  });
   const runtime = useAthenaRuntime({
     apiUrl,
     backendUrl,
@@ -24309,114 +24448,6 @@ function AthenaRuntimeInner({
   );
   return /* @__PURE__ */ jsxRuntime.jsx(AssistantRuntimeProvider, { aui, runtime, children: /* @__PURE__ */ jsxRuntime.jsx(AthenaContext.Provider, { value: athenaConfig, children: /* @__PURE__ */ jsxRuntime.jsx(TooltipProvider, { children }) }) });
 }
-function ThreadStateLoader({
-  children,
-  threadId,
-  backendUrl,
-  apiKey,
-  token,
-  ...runtimeProps
-}) {
-  const [loadedMessages, setLoadedMessages] = React.useState(void 0);
-  const [loadState, setLoadState] = React.useState(threadId ? "loading" : "done");
-  const [showSpinner, setShowSpinner] = React.useState(false);
-  React.useEffect(() => {
-    if (!threadId) {
-      setLoadedMessages(void 0);
-      setLoadState("done");
-      return;
-    }
-    let cancelled = false;
-    setLoadState("loading");
-    setShowSpinner(false);
-    const spinnerTimer = setTimeout(() => {
-      if (!cancelled) setShowSpinner(true);
-    }, 200);
-    getThreadState(backendUrl, { apiKey, token }, threadId).then((state) => {
-      var _a2;
-      if (cancelled) return;
-      if (process.env.NODE_ENV !== "production") {
-        console.log("[AthenaThreads] Loaded thread state", {
-          threadId,
-          messageCount: ((_a2 = state.messages) == null ? void 0 : _a2.length) ?? 0
-        });
-      }
-      setLoadedMessages(state.messages ?? []);
-      setLoadState("done");
-    }).catch((err) => {
-      if (cancelled) return;
-      if (process.env.NODE_ENV !== "production") {
-        console.warn("[AthenaThreads] Failed to load thread state, starting fresh", err);
-      }
-      setLoadedMessages(void 0);
-      setLoadState("done");
-    });
-    return () => {
-      cancelled = true;
-      clearTimeout(spinnerTimer);
-    };
-  }, [threadId, backendUrl, apiKey, token]);
-  if (loadState === "loading") {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        style: {
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          justifyContent: "center",
-          height: "100%",
-          width: "100%",
-          background: "var(--background, #fff)",
-          color: "var(--muted-foreground, #888)",
-          gap: 8,
-          opacity: showSpinner ? 1 : 0,
-          transition: "opacity 0.15s ease-in"
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              style: {
-                width: 20,
-                height: 20,
-                border: "2px solid var(--border, #e5e5e5)",
-                borderTopColor: "var(--primary, #2563eb)",
-                borderRadius: "50%",
-                animation: "aui-spin 0.6s linear infinite"
-              }
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 13 }, children: "Loading conversation…" }),
-          /* @__PURE__ */ jsxRuntime.jsx("style", { children: `@keyframes aui-spin { to { transform: rotate(360deg); } }` })
-        ]
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    AthenaRuntimeInner,
-    {
-      threadId,
-      backendUrl,
-      apiKey,
-      token,
-      initialMessages: loadedMessages,
-      ...runtimeProps,
-      children
-    }
-  );
-}
-function useActiveThreadFromStore(store) {
-  return React.useSyncExternalStore(
-    (cb) => {
-      if (!store) return () => {
-      };
-      return store.subscribe(cb);
-    },
-    () => (store == null ? void 0 : store.getState().activeThreadId) ?? null,
-    () => null
-  );
-}
 function AthenaProvider({
   children,
   apiKey,
@@ -24431,23 +24462,14 @@ function AthenaProvider({
   knowledgeBase,
   systemPrompt,
   threadId: threadIdProp,
-  enableThreadList = false
+  enableThreadList = false,
+  theme
 }) {
   const frontendToolNames = React.useMemo(() => Object.keys(frontendTools), [frontendTools]);
+  const themeStyleVars = React.useMemo(() => theme ? themeToStyleVars(theme) : void 0, [theme]);
   const parentAuthToken = useParentAuth();
   const effectiveToken = tokenProp ?? parentAuthToken;
   const effectiveBackendUrl = backendUrl ?? DEFAULT_BACKEND_URL;
-  React.useEffect(() => {
-    if (process.env.NODE_ENV !== "production") {
-      console.log("[AthenaAuth] AthenaProvider auth state", {
-        hasTokenProp: !!tokenProp,
-        hasParentAuthToken: !!parentAuthToken,
-        hasEffectiveToken: !!effectiveToken,
-        hasApiKey: !!apiKey,
-        authMethod: effectiveToken ? "Bearer token (PropelAuth)" : apiKey ? "X-API-KEY" : "NONE"
-      });
-    }
-  }, [tokenProp, parentAuthToken, effectiveToken, apiKey]);
   const threadListStoreRef = React.useRef(null);
   if (enableThreadList && !threadListStoreRef.current) {
     threadListStoreRef.current = createThreadListStore({
@@ -24456,22 +24478,45 @@ function AthenaProvider({
       token: effectiveToken
     });
   }
-  const activeThreadId = useActiveThreadFromStore(
-    enableThreadList ? threadListStoreRef.current : null
-  );
-  const resolvedThreadId = threadIdProp ?? activeThreadId ?? void 0;
+  const activeThreadId = threadListStoreRef.current ? useStore$1(threadListStoreRef.current, (s) => s.activeThreadId) : null;
+  const [displayedThreadId, setDisplayedThreadId] = React.useState(null);
+  const [loadedMessages, setLoadedMessages] = React.useState(void 0);
+  const [isLoadingThread, setIsLoadingThread] = React.useState(false);
   React.useEffect(() => {
-    if (process.env.NODE_ENV !== "production") {
-      console.log("[AthenaThreads] AthenaProvider render", {
-        activeThreadId,
-        resolvedThreadId,
-        enableThreadList,
-        hasStore: !!threadListStoreRef.current
-      });
+    var _a2;
+    if (!enableThreadList) return;
+    if (activeThreadId === displayedThreadId) return;
+    const threads = ((_a2 = threadListStoreRef.current) == null ? void 0 : _a2.getState().threads) ?? [];
+    const isExistingThread = threads.some((t) => t.thread_id === activeThreadId);
+    if (!isExistingThread) {
+      setLoadedMessages(void 0);
+      setDisplayedThreadId(activeThreadId);
+      setIsLoadingThread(false);
+      return;
     }
-  }, [activeThreadId, resolvedThreadId, enableThreadList]);
-  const inner = /* @__PURE__ */ jsxRuntime.jsx(
-    ThreadStateLoader,
+    let cancelled = false;
+    setIsLoadingThread(true);
+    getThreadState(effectiveBackendUrl, { apiKey, token: effectiveToken }, activeThreadId).then((state) => {
+      if (cancelled) return;
+      setLoadedMessages(state.messages ?? []);
+      setDisplayedThreadId(activeThreadId);
+      setIsLoadingThread(false);
+    }).catch((err) => {
+      if (cancelled) return;
+      if (process.env.NODE_ENV !== "production") {
+        console.error("[AthenaSDK] Failed to load thread state:", err);
+      }
+      setLoadedMessages(void 0);
+      setDisplayedThreadId(activeThreadId);
+      setIsLoadingThread(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [activeThreadId, displayedThreadId, enableThreadList, effectiveBackendUrl, apiKey, effectiveToken]);
+  const resolvedThreadId = threadIdProp ?? displayedThreadId ?? void 0;
+  const runtimeContent = /* @__PURE__ */ jsxRuntime.jsx(ThreadLoadingContext.Provider, { value: isLoadingThread, children: /* @__PURE__ */ jsxRuntime.jsx(
+    AthenaRuntimeInner,
     {
       apiUrl,
       backendUrl: effectiveBackendUrl,
@@ -24486,12 +24531,17 @@ function AthenaProvider({
       knowledgeBase,
       systemPrompt,
       threadId: resolvedThreadId,
+      initialMessages: loadedMessages,
       children
     },
     resolvedThreadId ?? "__new__"
-  );
+  ) });
+  let inner = runtimeContent;
   if (enableThreadList && threadListStoreRef.current) {
-    return /* @__PURE__ */ jsxRuntime.jsx(ThreadListContext.Provider, { value: threadListStoreRef.current, children: inner });
+    inner = /* @__PURE__ */ jsxRuntime.jsx(ThreadListContext.Provider, { value: threadListStoreRef.current, children: inner });
+  }
+  if (themeStyleVars) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "athena-themed", style: themeStyleVars, children: inner });
   }
   return inner;
 }
@@ -62375,6 +62425,7 @@ const AthenaChat = ({
   toolUIs,
   mentionTools
 }) => {
+  const isLoadingThread = useThreadLoading();
   const tools = mentionTools ?? EMPTY_MENTION_TOOLS;
   const mergedToolUIs = React.useMemo(() => ({
     append_markdown_to_athena_document: AppendDocumentToolUI,
@@ -62386,40 +62437,43 @@ const AthenaChat = ({
     () => () => /* @__PURE__ */ jsxRuntime.jsx(AssistantMessage, { toolUIs: mergedToolUIs }),
     [mergedToolUIs]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(
     ThreadPrimitiveRoot,
     {
       className: `aui-root aui-thread-root @container flex h-full flex-col bg-background ${className ?? ""}`,
-      style: { ["--thread-max-width"]: maxWidth },
-      children: /* @__PURE__ */ jsxRuntime.jsxs(
-        ThreadPrimitiveViewport,
-        {
-          turnAnchor: "top",
-          className: "aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll scroll-smooth px-4 pt-4",
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(AuiIf, { condition: (s) => s.thread.isEmpty, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aui-thread-welcome-root mx-auto my-auto flex w-full max-w-(--thread-max-width) grow flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aui-thread-welcome-center flex w-full grow flex-col items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "aui-thread-welcome-message flex size-full flex-col justify-center px-4", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both font-semibold text-2xl duration-200", children: welcomeMessage }),
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both text-muted-foreground text-xl delay-75 duration-200", children: welcomeSubtext })
-            ] }) }) }) }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ThreadPrimitiveMessages,
-              {
-                components: {
-                  UserMessage,
-                  AssistantMessage: AssistantMessageComponent
+      style: { ["--thread-max-width"]: maxWidth, position: "relative" },
+      children: [
+        isLoadingThread && /* @__PURE__ */ jsxRuntime.jsx(ThreadLoadingOverlay, {}),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          ThreadPrimitiveViewport,
+          {
+            turnAnchor: "top",
+            className: "aui-thread-viewport relative flex flex-1 flex-col overflow-x-auto overflow-y-scroll scroll-smooth px-4 pt-4",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(AuiIf, { condition: (s) => s.thread.isEmpty, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aui-thread-welcome-root mx-auto my-auto flex w-full max-w-(--thread-max-width) grow flex-col", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aui-thread-welcome-center flex w-full grow flex-col items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "aui-thread-welcome-message flex size-full flex-col justify-center px-4", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both font-semibold text-2xl duration-200", children: welcomeMessage }),
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "aui-thread-welcome-message-inner fade-in slide-in-from-bottom-1 animate-in fill-mode-both text-muted-foreground text-xl delay-75 duration-200", children: welcomeSubtext })
+              ] }) }) }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ThreadPrimitiveMessages,
+                {
+                  components: {
+                    UserMessage,
+                    AssistantMessage: AssistantMessageComponent
+                  }
                 }
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs(ThreadPrimitiveViewportFooter, { className: "aui-thread-viewport-footer sticky bottom-0 mx-auto mt-auto flex w-full max-w-(--thread-max-width) flex-col gap-4 overflow-visible rounded-t-3xl bg-background pb-4 md:pb-6", children: [
-              /* @__PURE__ */ jsxRuntime.jsx(ThreadScrollToBottom, {}),
-              /* @__PURE__ */ jsxRuntime.jsxs(ComposerPrimitiveRoot, { className: "aui-composer-root relative flex w-full flex-col rounded-2xl border border-input bg-background px-1 pt-2 outline-none transition-shadow focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/20", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(TiptapComposer, { tools }),
-                /* @__PURE__ */ jsxRuntime.jsx(ComposerAction, {})
+              ),
+              /* @__PURE__ */ jsxRuntime.jsxs(ThreadPrimitiveViewportFooter, { className: "aui-thread-viewport-footer sticky bottom-0 mx-auto mt-auto flex w-full max-w-(--thread-max-width) flex-col gap-4 overflow-visible rounded-t-3xl bg-background pb-4 md:pb-6", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(ThreadScrollToBottom, {}),
+                /* @__PURE__ */ jsxRuntime.jsxs(ComposerPrimitiveRoot, { className: "aui-composer-root relative flex w-full flex-col rounded-2xl border border-input bg-background px-1 pt-2 outline-none transition-shadow focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/20", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(TiptapComposer, { tools }),
+                  /* @__PURE__ */ jsxRuntime.jsx(ComposerAction, {})
+                ] })
               ] })
-            ] })
-          ]
-        }
-      )
+            ]
+          }
+        )
+      ]
     }
   );
 };
@@ -62535,6 +62589,53 @@ const UserMessage = () => /* @__PURE__ */ jsxRuntime.jsx(
     children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aui-user-message-content wrap-break-word rounded-2xl bg-muted px-4 py-2.5 text-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(MessagePrimitiveParts, { components: { Text: TiptapText } }) })
   }
 );
+const ThreadLoadingOverlay = () => /* @__PURE__ */ jsxRuntime.jsxs(
+  "div",
+  {
+    className: "aui-thread-loading-overlay",
+    style: {
+      position: "absolute",
+      inset: 0,
+      zIndex: 50,
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      gap: 12,
+      background: "color-mix(in srgb, var(--background, #fff) 80%, transparent)",
+      backdropFilter: "blur(4px)",
+      WebkitBackdropFilter: "blur(4px)",
+      animation: "aui-overlay-in 0.2s ease-out"
+    },
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: {
+            width: 28,
+            height: 28,
+            border: "2.5px solid var(--border, #e5e5e5)",
+            borderTopColor: "var(--primary, #2563eb)",
+            borderRadius: "50%",
+            animation: "aui-spin 0.7s linear infinite"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          style: {
+            fontSize: 13,
+            fontWeight: 500,
+            color: "var(--muted-foreground, #888)"
+          },
+          children: "Loading conversation…"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("style", { children: `@keyframes aui-spin { to { transform: rotate(360deg); } } @keyframes aui-overlay-in { from { opacity: 0; } to { opacity: 1; } }` })
+    ]
+  }
+);
 const embedCache = /* @__PURE__ */ new Map();
 function useAssetEmbed(assetId, options = {
   backendUrl: ""
@@ -62938,6 +63039,74 @@ function useComposerAttachment() {
   }, [aui]);
   return { addFile, addContent, clear };
 }
+const Toolkits = {
+  /** Web search and page browsing. */
+  WEB_SEARCH: "web_search_browse_toolkit",
+  /** SQL query execution. */
+  SQL: "sql_toolkit",
+  /** Athena Code development environment. */
+  ATHENA_CODE: "athena_code_toolkit",
+  /** Document comments and collaboration. */
+  COMMENTS: "comments_toolkit",
+  /** Visual canvas creation. */
+  CANVAS: "canvas_toolkit",
+  /** PostgreSQL database management. */
+  DATABASE: "database_toolkit",
+  /** Asset collections management. */
+  COLLECTIONS: "collections_toolkit",
+  /** Charts, dashboards, and figures. */
+  VISUALIZATIONS: "visualizations_toolkit",
+  /** Custom UI creation. */
+  USER_INTERFACE: "user_interface_toolkit",
+  /** Agent Operating Procedures. */
+  AOP: "aop_toolkit",
+  /** Ephemeral compute environments. */
+  COMPUTER_ASSET: "computer_asset_toolkit",
+  /** Web browser automation. */
+  BROWSER: "browser_toolkit",
+  /** Virtual machine management. */
+  VM: "vm_toolkit",
+  /** Jupyter notebook execution. */
+  NOTEBOOK: "notebook_toolkit",
+  /** Presentation slide editing. */
+  PRESENTATION: "presentation_toolkit",
+  /** PowerPoint presentation creation from templates. */
+  POWERPOINT: "powerpoint_deck_toolkit",
+  /** Workspace file management (Spaces). */
+  DRIVE: "olympus_drive_toolkit",
+  /** Python code execution. */
+  PYTHON: "python_toolkit",
+  /** Multi-account email and calendar (Gmail + Outlook). */
+  EMAIL: "unified_email_toolkit",
+  /** Legacy email and calendar operations. */
+  EMAIL_CALENDAR: "email_calendar_toolkit",
+  /** Spreadsheet operations. */
+  SPREADSHEET: "spreadsheet_toolkit",
+  /** Athena document editing. */
+  DOCUMENT: "document_toolkit",
+  /** Word document backend operations. */
+  WORD_DOCUMENT: "word_document_be_toolkit",
+  /** Go-To-Market management. */
+  GTM: "gtm_toolkit",
+  /** Marketing campaign management. */
+  MARKETING: "marketing_toolkit",
+  /** FDE implementations and workflows. */
+  FDE: "fde_toolkit",
+  /** Code repository search via Greptile. */
+  GREPTILE: "greptile_toolkit",
+  /** SharePoint / Google Drive / workspace file access. */
+  EXTERNAL_DRIVE: "external_drive_toolkit",
+  /** Reusable playbooks and prompts. */
+  PLAYBOOK: "playbook_toolkit",
+  /** Local Chrome browser control via tunnel. */
+  DEVICE_TUNNEL: "device_tunnel_toolkit",
+  /** Project management. */
+  PROJECTS: "projects_toolkit",
+  /** Task Studio script execution. */
+  TASK_STUDIO: "task_studio_toolkit",
+  /** User memory and preferences. */
+  PREFERENCES: "preferences_toolkit"
+};
 exports.AppendDocumentToolUI = AppendDocumentToolUI;
 exports.AssetPanel = AssetPanel;
 exports.AthenaChat = AthenaChat;
@@ -62966,6 +63135,7 @@ exports.ToolFallbackError = ToolFallbackError;
 exports.ToolFallbackResult = ToolFallbackResult;
 exports.ToolFallbackRoot = ToolFallbackRoot;
 exports.ToolFallbackTrigger = ToolFallbackTrigger;
+exports.Toolkits = Toolkits;
 exports.Tooltip = Tooltip;
 exports.TooltipContent = TooltipContent;
 exports.TooltipIconButton = TooltipIconButton;
@@ -62978,6 +63148,8 @@ exports.cn = cn;
 exports.createThreadListStore = createThreadListStore;
 exports.getAssetInfo = getAssetInfo;
 exports.resetAssetAutoOpen = resetAssetAutoOpen;
+exports.themeToStyleVars = themeToStyleVars;
+exports.themes = themes;
 exports.tryParseJson = tryParseJson$1;
 exports.useActiveThreadId = useActiveThreadId;
 exports.useAppendToComposer = useAppendToComposer;
@@ -62989,4 +63161,5 @@ exports.useComposerAttachment = useComposerAttachment;
 exports.useMentionSuggestions = useMentionSuggestions;
 exports.useParentAuth = useParentAuth;
 exports.useThreadList = useThreadList;
+exports.useThreadLoading = useThreadLoading;
 //# sourceMappingURL=index.cjs.map