@superatomai/application-react 0.0.3 → 0.0.5

package/dist/index.d.cts

@@ -2561,12 +2561,18 @@ type SuperAtomAuthErrorCode =
  | 'network';
 declare class SuperAtomAuthError extends Error {
     readonly code: SuperAtomAuthErrorCode;
+    /**
+     * Why Superatom refused it, verbatim — `expired`, `bad_signature`,
+     * `bad_access_filters`, `inactive`, … Present for `exchange_rejected` only.
+     */
+    readonly reason?: string;
     /** HTTP status from sa-api, when there was a response. */
     readonly status?: number;
     /** True when retrying cannot help — see the module comment. */
     readonly fatal: boolean;
     constructor(code: SuperAtomAuthErrorCode, message: string, options: {
         status?: number;
+        reason?: string;
         fatal: boolean;
         cause?: unknown;
     });
@@ -2585,6 +2591,8 @@ interface SdkSessionOptions {
      * null once a sign-in succeeds.
      */
     onRetrying?: (error: SuperAtomAuthError | null) => void;
+    /** True while an exchange is in flight, false when it finishes either way. */
+    onSigningIn?: (signingIn: boolean) => void;
     /** sa-api base URL. Default: prod. */
     apiUrl?: string;
     debug?: boolean;
@@ -3865,6 +3873,12 @@ interface UseSuperAtomReturn {
     user: SdkUser | null;
     /** The sign-in failure that stopped the SDK, if any (same as passed to `onAuthError`). */
     authError: SuperAtomAuthError | null;
+    /**
+     * A sign-in attempt is in flight — at start, on renewal, and after
+     * `reconnect()`. The chat already shows "Signing in…" by itself; use this only
+     * if you want your own screen for it.
+     */
+    isSigningIn: boolean;
     /** Try signing in and connecting again — e.g. after the user signed in again on your side. */
     reconnect: () => void;
 }
@@ -3882,7 +3896,7 @@ interface ChatInputProps {
     isResponding?: boolean;
     onStop?: () => void;
 }
-declare function ChatInput({ input, setInput, onSend, disabled, placeholder, primaryColor, className, isResponding, onStop, }: ChatInputProps): react_jsx_runtime.JSX.Element;
+declare function ChatInput({ input, setInput, onSend, disabled, placeholder, primaryColor, className, isResponding, onStop, }: ChatInputProps): react_jsx_runtime.JSX.Element | null;
 
 interface MessageListProps {
     messages: ChatMessage[];
@@ -3962,7 +3976,7 @@ interface SidebarProps {
     }>;
     primaryColor?: string;
 }
-declare function Sidebar({ children, className, onItemClick, onNewChat, threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, primaryColor, }: SidebarProps): react_jsx_runtime.JSX.Element;
+declare function Sidebar({ children, className, onItemClick, onNewChat, threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, primaryColor, }: SidebarProps): react_jsx_runtime.JSX.Element | null;
 
 interface NewChatHeroProps {
     /** The chat input to center, e.g. <ChatInput ... /> */

package/dist/index.d.ts

@@ -2561,12 +2561,18 @@ type SuperAtomAuthErrorCode =
  | 'network';
 declare class SuperAtomAuthError extends Error {
     readonly code: SuperAtomAuthErrorCode;
+    /**
+     * Why Superatom refused it, verbatim — `expired`, `bad_signature`,
+     * `bad_access_filters`, `inactive`, … Present for `exchange_rejected` only.
+     */
+    readonly reason?: string;
     /** HTTP status from sa-api, when there was a response. */
     readonly status?: number;
     /** True when retrying cannot help — see the module comment. */
     readonly fatal: boolean;
     constructor(code: SuperAtomAuthErrorCode, message: string, options: {
         status?: number;
+        reason?: string;
         fatal: boolean;
         cause?: unknown;
     });
@@ -2585,6 +2591,8 @@ interface SdkSessionOptions {
      * null once a sign-in succeeds.
      */
     onRetrying?: (error: SuperAtomAuthError | null) => void;
+    /** True while an exchange is in flight, false when it finishes either way. */
+    onSigningIn?: (signingIn: boolean) => void;
     /** sa-api base URL. Default: prod. */
     apiUrl?: string;
     debug?: boolean;
@@ -3865,6 +3873,12 @@ interface UseSuperAtomReturn {
     user: SdkUser | null;
     /** The sign-in failure that stopped the SDK, if any (same as passed to `onAuthError`). */
     authError: SuperAtomAuthError | null;
+    /**
+     * A sign-in attempt is in flight — at start, on renewal, and after
+     * `reconnect()`. The chat already shows "Signing in…" by itself; use this only
+     * if you want your own screen for it.
+     */
+    isSigningIn: boolean;
     /** Try signing in and connecting again — e.g. after the user signed in again on your side. */
     reconnect: () => void;
 }
@@ -3882,7 +3896,7 @@ interface ChatInputProps {
     isResponding?: boolean;
     onStop?: () => void;
 }
-declare function ChatInput({ input, setInput, onSend, disabled, placeholder, primaryColor, className, isResponding, onStop, }: ChatInputProps): react_jsx_runtime.JSX.Element;
+declare function ChatInput({ input, setInput, onSend, disabled, placeholder, primaryColor, className, isResponding, onStop, }: ChatInputProps): react_jsx_runtime.JSX.Element | null;
 
 interface MessageListProps {
     messages: ChatMessage[];
@@ -3962,7 +3976,7 @@ interface SidebarProps {
     }>;
     primaryColor?: string;
 }
-declare function Sidebar({ children, className, onItemClick, onNewChat, threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, primaryColor, }: SidebarProps): react_jsx_runtime.JSX.Element;
+declare function Sidebar({ children, className, onItemClick, onNewChat, threads, activeThreadId, onSelectThread, onDeleteThread, onRenameThread, primaryColor, }: SidebarProps): react_jsx_runtime.JSX.Element | null;
 
 interface NewChatHeroProps {
     /** The chat input to center, e.g. <ChatInput ... /> */

package/dist/index.js

@@ -68142,6 +68142,7 @@ var SuperAtomAuthError = class extends Error {
     super(message);
     this.name = "SuperAtomAuthError";
     this.code = code4;
+    this.reason = options.reason;
     this.status = options.status;
     this.fatal = options.fatal;
     if (options.cause !== void 0) this.cause = options.cause;
@@ -68207,8 +68208,10 @@ var SdkSession = class {
   }
   renew() {
     if (!this.inFlight) {
+      this.opts.onSigningIn?.(true);
       this.inFlight = this.exchange().finally(() => {
         this.inFlight = null;
+        this.opts.onSigningIn?.(false);
       });
     }
     return this.inFlight;
@@ -68243,7 +68246,11 @@ var SdkSession = class {
       const message = typeof body?.error === "string" ? body.error : `Sign-in failed (${res.status})`;
       const fatal = res.status >= 400 && res.status < 500 && res.status !== 429;
       throw this.fail(
-        new SuperAtomAuthError(fatal ? "exchange_rejected" : "exchange_unavailable", message, { status: res.status, fatal })
+        new SuperAtomAuthError(fatal ? "exchange_rejected" : "exchange_unavailable", message, {
+          status: res.status,
+          reason: typeof body?.code === "string" ? body.code : void 0,
+          fatal
+        })
       );
     }
     if (typeof body?.token !== "string" || !body.user?.id) {
@@ -69442,6 +69449,8 @@ function resetRegistration() {
 }
 var current = null;
 var retrying = null;
+var signingIn = false;
+var chatReady = false;
 var listeners = /* @__PURE__ */ new Set();
 function setAuthStatus(error51) {
   if (current === error51) return;
@@ -69454,6 +69463,36 @@ function setRetryingStatus(error51) {
   retrying = error51;
   listeners.forEach((l) => l());
 }
+function setSigningIn(value) {
+  if (signingIn === value) return;
+  signingIn = value;
+  listeners.forEach((l) => l());
+}
+function useSigningIn() {
+  return useSyncExternalStore(
+    (l) => {
+      listeners.add(l);
+      return () => listeners.delete(l);
+    },
+    () => signingIn,
+    () => false
+  );
+}
+function setChatReady(value) {
+  if (chatReady === value) return;
+  chatReady = value;
+  listeners.forEach((l) => l());
+}
+function useStartingUp() {
+  return useSyncExternalStore(
+    (l) => {
+      listeners.add(l);
+      return () => listeners.delete(l);
+    },
+    () => !chatReady,
+    () => false
+  );
+}
 function useRetryingStatus() {
   return useSyncExternalStore(
     (l) => {
@@ -69474,12 +69513,34 @@ function useAuthStatus() {
     () => null
   );
 }
+var SETUP_REASONS = /* @__PURE__ */ new Set([
+  "bad_request",
+  "bad_project_id",
+  "unknown_project",
+  "bad_sub",
+  "bad_email",
+  "bad_roles",
+  "bad_access",
+  "bad_access_values",
+  "bad_access_filters",
+  "access_not_set_up",
+  "lifetime_too_long",
+  "issued_in_future",
+  "email_linked_elsewhere"
+]);
 function authStatusMessage(error51) {
   switch (error51.code) {
     case "get_token_failed":
       return "Your session has ended. Please sign in again to continue.";
     case "exchange_rejected":
-      return error51.status === 403 ? "This account cannot use the chat. Please contact your administrator." : "Your session is no longer valid. Please sign in again to continue.";
+      if (error51.reason === "inactive") return "This account has been deactivated.";
+      if (error51.reason === "sdk_not_enabled" || error51.status === 403) {
+        return "This account cannot use the chat. Please contact your administrator.";
+      }
+      if (error51.reason && SETUP_REASONS.has(error51.reason)) {
+        return `This app\u2019s Superatom sign-in is not set up correctly: ${error51.message}`;
+      }
+      return "Your session is no longer valid. Please sign in again to continue.";
     default:
       return "Could not connect to Superatom. Please try again in a moment.";
   }
@@ -69679,6 +69740,7 @@ function useSuperAtom({
   if (sdkSignIn && token) throw new Error("[SuperAtom] Pass either token or getToken, not both");
   const [user, setUser] = useState(null);
   const [authError, setAuthError] = useState(null);
+  const [isSigningIn, setIsSigningIn] = useState(false);
   const [signInAttempt, setSignInAttempt] = useState(0);
   const directUserId = (() => {
     if (sdkSignIn) return void 0;
@@ -69744,7 +69806,13 @@ function useSuperAtom({
           },
           // Superatom unreachable or down, after a couple of tries: say so in the
           // chat instead of sitting on "Connecting…".
-          onRetrying: (err) => setRetryingStatus(err)
+          onRetrying: (err) => setRetryingStatus(err),
+          // Lets the chat show "Signing in…" instead of an empty chat while a
+          // sign-in — including one after reconnect() — is in flight.
+          onSigningIn: (value) => {
+            setSigningIn(value);
+            setIsSigningIn(value);
+          }
         });
         sessionRef.current = session;
         for (let delay = 1e3; ; delay = Math.min(delay * 2, 3e4)) {
@@ -69871,6 +69939,7 @@ function useSuperAtom({
         if (!cancelled) {
           setupDoneRef.current = true;
           setBundleReady(true);
+          setChatReady(true);
         }
       } catch (err) {
         console.error("[SuperAtom] Setup failed:", err);
@@ -69890,6 +69959,7 @@ function useSuperAtom({
       setAuthStatus(null);
       setupDoneRef.current = false;
       setBundleReady(false);
+      setChatReady(false);
     };
   }, [directUserId, sdkSignIn, projectId, apiUrl, wsUrl, debug, signInAttempt]);
   const reconnect = useCallback(() => {
@@ -70322,8 +70392,9 @@ function useSuperAtom({
       removed.add(msg.id);
     }
     setMessages((prev) => prev.filter((m) => !removed.has(m.id)));
+    refreshThreads();
     return { success: true };
-  }, [resolvedUserId]);
+  }, [resolvedUserId, refreshThreads]);
   useEffect(() => {
     setMessageActions({ deleteMessage });
     return () => setMessageActions({});
@@ -70355,6 +70426,7 @@ function useSuperAtom({
     isNewChat: bundleReady && !isLoadingThread && messages2.length === 0,
     user,
     authError,
+    isSigningIn,
     reconnect
   };
 }
@@ -70452,6 +70524,7 @@ function ChatInput({
   onStop
 }) {
   const authError = useAuthStatus();
+  const startingUp = useStartingUp();
   const isLocked = disabled || !!authError;
   const textareaRef = useRef(null);
   const historyRef = useRef(null);
@@ -70484,15 +70557,35 @@ function ChatInput({
     window.addEventListener("keydown", onKeyDown);
     return () => window.removeEventListener("keydown", onKeyDown);
   }, [showStop, onStop]);
-  useEffect(() => {
+  const resize = useCallback(() => {
     const textarea = textareaRef.current;
     if (!textarea) return;
     textarea.style.height = "auto";
     const newHeight = Math.min(textarea.scrollHeight, 200);
     textarea.style.height = `${newHeight}px`;
-    const shouldBeMultiline = newHeight > 60;
-    if (shouldBeMultiline !== isMultiline) setIsMultiline(shouldBeMultiline);
-  }, [input, isMultiline]);
+    setIsMultiline(newHeight > 60);
+  }, []);
+  useEffect(resize, [input, resize]);
+  useEffect(() => {
+    const frame = requestAnimationFrame(resize);
+    document.fonts?.ready.then(resize).catch(() => {
+    });
+    const textarea = textareaRef.current;
+    if (!textarea || typeof ResizeObserver === "undefined") {
+      return () => cancelAnimationFrame(frame);
+    }
+    let width = textarea.clientWidth;
+    const observer = new ResizeObserver(() => {
+      if (textarea.clientWidth === width) return;
+      width = textarea.clientWidth;
+      resize();
+    });
+    observer.observe(textarea);
+    return () => {
+      cancelAnimationFrame(frame);
+      observer.disconnect();
+    };
+  }, [resize]);
   const setCursorToEnd = (textarea) => {
     setTimeout(() => {
       textarea.setSelectionRange(textarea.value.length, textarea.value.length);
@@ -70514,6 +70607,7 @@ function ChatInput({
   }, [input, isLocked, onSend, getOrCreateHistory]);
   const themeColor = getThemeColor();
   const effectivePlaceholder = authError ? authStatusMessage(authError) : placeholder;
+  if (startingUp) return null;
   return /* @__PURE__ */ jsx("div", { className: `sa-ui shrink-0 bg-base-100 border-t border-base-300 px-4 py-2 ${className}`, children: /* @__PURE__ */ jsx("div", { className: `group ${isMultiline ? "rounded-3xl" : "rounded-full"} bg-base-200 transition-all duration-200 w-full max-w-2xl mx-auto`, children: /* @__PURE__ */ jsx(
     "div",
     {
@@ -70735,7 +70829,7 @@ function MessageBubble({ message, onStop }) {
     setConfirmOpen(false);
     if (!res.success) console.error("[SuperAtom] Could not delete the message:", res.error);
   };
-  const deleteButton = deleteMessage && responseComplete && !isAborted ? /* @__PURE__ */ jsx("div", { className: "flex justify-end mt-2", children: /* @__PURE__ */ jsx(
+  const deleteButton = deleteMessage && responseComplete && !isAborted ? /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity duration-200", children: /* @__PURE__ */ jsx(
     "button",
     {
       onClick: () => setConfirmOpen(true),
@@ -70831,12 +70925,12 @@ function MessageBubble({ message, onStop }) {
         /* @__PURE__ */ jsx("span", { className: "text-sm text-base-content/70", children: "Generating component..." })
       ] })
     ] }) }),
-    hasComponent && /* @__PURE__ */ jsxs("div", { id: `box-${message.id}`, className: "w-full px-4 lg:px-16 xl:px-24 2xl:px-32", children: [
+    hasComponent && /* @__PURE__ */ jsx("div", { id: `box-${message.id}`, className: "w-full px-4 lg:px-16 xl:px-24 2xl:px-32", children: /* @__PURE__ */ jsxs("div", { className: "group relative", children: [
       /* @__PURE__ */ jsx("div", { className: "rounded-xl shadow-sm bg-base-100 border-2 border-base-300 min-h-[85vh] overflow-auto flex items-center justify-center p-5", children: /* @__PURE__ */ jsx(DSLRenderer, { dsl: message.schema.ui, data: message.schema.data ?? {} }) }),
       deleteButton
-    ] }),
-    !isStreaming && !hasComponent && hasText && isTextOnly && !isAborted && /* @__PURE__ */ jsx("div", { className: "flex justify-center w-full px-4", children: /* @__PURE__ */ jsxs("div", { className: "w-full md:w-[60vw]", children: [
-      /* @__PURE__ */ jsx("div", { className: "rounded-xl shadow-sm bg-base-100 border-2 border-base-300 p-4 text-base-content", children: /* @__PURE__ */ jsx(Markdown_default, { content: fullText, isStreaming: false }) }),
+    ] }) }),
+    !isStreaming && !hasComponent && hasText && isTextOnly && !isAborted && /* @__PURE__ */ jsx("div", { className: "flex justify-center w-full px-4", children: /* @__PURE__ */ jsxs("div", { className: "w-full md:w-[60vw] group relative", children: [
+      /* @__PURE__ */ jsx("div", { className: "rounded-xl shadow-sm bg-base-100 border-2 border-base-300 p-4 pb-10 text-base-content", children: /* @__PURE__ */ jsx(Markdown_default, { content: fullText, isStreaming: false }) }),
       deleteButton
     ] }) }),
     /* @__PURE__ */ jsx(
@@ -70949,8 +71043,12 @@ function MessageList({
   }, [messages2]);
   const authError = useAuthStatus();
   const retrying2 = useRetryingStatus();
+  const signingIn2 = useSigningIn();
   return /* @__PURE__ */ jsxs("div", { className: `sa-ui flex-1 relative overflow-hidden ${className}`, children: [
-    /* @__PURE__ */ jsx("main", { ref: containerRef, className: "h-full overflow-y-auto py-6", children: authError ? /* @__PURE__ */ jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-3 px-6 text-center", children: [
+    /* @__PURE__ */ jsx("main", { ref: containerRef, className: "h-full overflow-y-auto py-6", children: signingIn2 && !bundleReady ? /* @__PURE__ */ jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-3 text-base-content/50", children: [
+      /* @__PURE__ */ jsx("span", { className: "loading loading-spinner loading-lg" }),
+      /* @__PURE__ */ jsx("span", { className: "text-sm", children: "Signing in to Superatom\u2026" })
+    ] }) : authError ? /* @__PURE__ */ jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-3 px-6 text-center", children: [
       /* @__PURE__ */ jsx(Icon, { icon: "mdi:lock-alert-outline", width: 28, height: 28, className: "text-base-content/40" }),
       /* @__PURE__ */ jsx("p", { className: "text-sm text-base-content/70 max-w-sm", children: authStatusMessage(authError) })
     ] }) : !bundleReady || isLoadingThread && messages2.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-3 text-base-content/50", children: [
@@ -71401,6 +71499,7 @@ function Sidebar({
       setThreadToDelete(null);
     }
   };
+  const startingUp = useStartingUp();
   const [collapsed, setCollapsed] = useState(() => {
     try {
       return localStorage.getItem(SIDEBAR_COLLAPSED_KEY) === "true";
@@ -71485,6 +71584,7 @@ function Sidebar({
       });
     }
   }
+  if (startingUp) return null;
   return /* @__PURE__ */ jsxs(
     "aside",
     {