@arbidocs/blocks 0.5.67 → 0.5.68

package/dist/{chunk-3VFQYKB5.cjs → chunk-EPBFVO4F.cjs}

@@ -2204,7 +2204,7 @@ function resolveScrollContainer(current) {
 function stripThinking(content) {
   return content.replace(/<think>[\s\S]*?(<\/think>|$)/g, "");
 }
-function ConnectedMessageList({ messages }) {
+function ConnectedMessageList({ messages, scrollElementRef }) {
   const session = react.useArbiSessionStore();
   const [previewOpen, setPreviewOpen] = React7.useState(false);
   const participantTints = React7.useMemo(
@@ -2235,14 +2235,14 @@ function ConnectedMessageList({ messages }) {
     text: lastMessage?.role === "assistant" ? stripThinking(lastMessage.content ?? "") : "",
     resetKey: currentConversationId
   });
-  const scrollElementRef = React7.useRef(null);
+  const scrollContainerRef = React7.useRef(null);
   const getScrollContainer = React7.useCallback(() => {
-    scrollElementRef.current = resolveScrollContainer(scrollElementRef.current);
-    return scrollElementRef.current;
-  }, []);
+    scrollContainerRef.current = scrollElementRef?.current ?? resolveScrollContainer(scrollContainerRef.current);
+    return scrollContainerRef.current;
+  }, [scrollElementRef]);
   React7.useEffect(() => {
-    scrollElementRef.current = resolveScrollContainer(null);
-  }, []);
+    scrollContainerRef.current = scrollElementRef?.current ?? resolveScrollContainer(null);
+  }, [scrollElementRef]);
   const { items: activityItems } = chunkCMYJEIZB_cjs.useConnectedThreadActivity(currentConversationId);
   const transcript = [
     ...displayMessages.map((message, index) => ({
@@ -2394,15 +2394,21 @@ function ConnectedMessageList({ messages }) {
     /* @__PURE__ */ jsxRuntime.jsx(ConnectedThreadsPreview, { open: previewOpen, onOpenChange: setPreviewOpen })
   ] });
 }
-var MessageAreaComponent = React7.forwardRef(({ messages }, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: "flex w-full flex-1 flex-col pt-4", "data-testid": "message-area", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto w-full", "data-testid": "message-list-bottom-anchor", children: /* @__PURE__ */ jsxRuntime.jsx(ConnectedMessageList, { messages }) }) });
-});
+var MessageAreaComponent = React7.forwardRef(
+  ({ messages, scrollElementRef }, ref) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: "flex w-full flex-1 flex-col pt-4", "data-testid": "message-area", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto w-full", "data-testid": "message-list-bottom-anchor", children: /* @__PURE__ */ jsxRuntime.jsx(ConnectedMessageList, { messages, scrollElementRef }) }) });
+  }
+);
 MessageAreaComponent.displayName = "ConnectedMessageArea";
 var ConnectedMessageArea = React7.memo(MessageAreaComponent, (prevProps, nextProps) => {
-  return prevProps.messages === nextProps.messages;
+  return prevProps.messages === nextProps.messages && prevProps.scrollElementRef === nextProps.scrollElementRef;
 });
 function ConnectedCompactConversation() {
+  const session = react.useArbiSessionStore();
   const containerRef = React7.useRef(null);
+  const scrollRef = React7.useRef(null);
+  const following = React7.useRef(true);
+  const [showLatest, setShowLatest] = React7.useState(false);
   const inputRef = React7.useRef(null);
   const { selectedWorkspaceId, parentMessageId, messageHistory } = react.useConversationData();
   const { isGenerating, handleSendMessage, handleAbortGeneration } = react.useConversationTurn({
@@ -2410,9 +2416,100 @@ function ConnectedCompactConversation() {
     parentMessageId
   });
   const currentConversationId = react.useArbiSessionState((state) => state.conversationId);
+  React7.useEffect(() => {
+    const viewport = scrollRef.current;
+    const content = containerRef.current;
+    if (!viewport || !content) return;
+    const follow = () => {
+      if (following.current) viewport.scrollTop = viewport.scrollHeight;
+    };
+    follow();
+    const observer = new ResizeObserver(follow);
+    observer.observe(content);
+    return () => observer.disconnect();
+  }, [messageHistory.length > 0, currentConversationId]);
+  React7.useEffect(() => {
+    following.current = true;
+    setShowLatest(false);
+  }, [currentConversationId]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col flex-1 min-h-0", "data-testid": "embedded-chat", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex-1 min-h-0", children: messageHistory.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ConnectedMessageArea, { ref: containerRef, messages: messageHistory }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center h-full text-muted-foreground text-sm p-4", children: currentConversationId ? "Loading messages..." : "Start a conversation by typing below." }) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sticky bottom-0 w-full bg-background border-t z-10", children: /* @__PURE__ */ jsxRuntime.jsx(chunkUVZSX6GP_cjs.ComposerContainer, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center justify-between border-b px-3 py-2 text-xs text-muted-foreground", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: isGenerating ? "ARBI is responding\u2026" : "Conversation" }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        ui.Button,
+        {
+          type: "button",
+          size: "sm",
+          variant: "ghost",
+          disabled: isGenerating,
+          onClick: () => {
+            session.clearConversationError(currentConversationId || "new");
+            session.startNewConversation();
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-3.5 w-3.5 mr-1" }),
+            " New chat"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col flex-1 min-h-0 overflow-hidden", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          ref: scrollRef,
+          className: "flex-1 min-h-0 overflow-y-auto overscroll-contain px-3",
+          tabIndex: 0,
+          "aria-label": "Conversation messages",
+          "data-testid": "embedded-transcript",
+          onWheel: (event) => {
+            if (event.deltaY < 0) following.current = false;
+          },
+          onTouchMove: () => {
+            following.current = false;
+          },
+          onKeyDown: (event) => {
+            if (["ArrowUp", "PageUp", "Home"].includes(event.key)) following.current = false;
+          },
+          onScroll: (event) => {
+            const node = event.currentTarget;
+            const atBottom = node.scrollHeight - node.clientHeight - node.scrollTop < 32;
+            following.current = atBottom;
+            setShowLatest(!atBottom);
+          },
+          children: messageHistory.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+            ConnectedMessageArea,
+            {
+              ref: containerRef,
+              messages: messageHistory,
+              scrollElementRef: scrollRef
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3 items-center justify-center h-full text-muted-foreground text-sm p-6 text-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-8 w-8 text-primary", "aria-hidden": "true" }),
+            currentConversationId ? "Loading messages..." : "Start a conversation by typing below."
+          ] })
+        }
+      ),
+      showLatest && /* @__PURE__ */ jsxRuntime.jsxs(
+        ui.Button,
+        {
+          className: "absolute bottom-3 left-1/2 -translate-x-1/2 rounded-full shadow-md",
+          size: "sm",
+          variant: "secondary",
+          onClick: () => {
+            following.current = true;
+            const viewport = scrollRef.current;
+            if (viewport) viewport.scrollTop = viewport.scrollHeight;
+            setShowLatest(false);
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowDown, { className: "h-4 w-4 mr-1" }),
+            " Latest message"
+          ]
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0 w-full bg-background border-t p-2 z-10", children: /* @__PURE__ */ jsxRuntime.jsx(chunkUVZSX6GP_cjs.ComposerContainer, { children: /* @__PURE__ */ jsxRuntime.jsx(
       ConversationComposer2,
       {
         handleSendMessage,
@@ -2457,12 +2554,19 @@ function ConnectedConversationDocumentPicker({
   onSelectionChange
 }) {
   const session = react.useArbiSessionStore();
+  const upload = react.useUploadDocuments();
+  const role = react.useWorkspaceRole();
+  const canUpload = role !== null && role !== "guest";
+  const inputRef = React7.useRef(null);
+  const [expanded, setExpanded] = React7.useState(false);
+  const [uploadError, setUploadError] = React7.useState(null);
+  const [uploadNotice, setUploadNotice] = React7.useState(null);
   const currentConversationId = react.useArbiSessionState((state) => state.conversationId);
   const convKey = currentConversationId || "new";
   const inConversationDocuments = react.useArbiSessionState(
     (state) => state.conversationDocuments[convKey] || EMPTY_DOCS
   );
-  const { data: documentsData } = react.useDocuments();
+  const { data: documentsData, isLoading, error: documentsError } = react.useDocuments();
   const documents = documentsData || [];
   const selectedDocIds = inConversationDocuments.map((d) => d.docId);
   const handleToggle = (docId) => {
@@ -2475,45 +2579,135 @@ function ConnectedConversationDocumentPicker({
       selected ? selectedDocIds.filter((id) => id !== docId) : [...selectedDocIds, docId]
     );
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-3 py-2", "data-testid": "embedded-document-selector", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "text-sm font-medium mb-1 block text-muted-foreground", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "inline h-3 w-3 mr-1" }),
-      "Documents (",
-      selectedDocIds.length,
-      " selected)"
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(ui.ScrollArea, { className: "h-28 border rounded-md p-2", "data-testid": "embedded-documents-list", children: documents.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground text-center py-4", children: "No documents in this workspace." }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: documents.map((doc) => {
-      const docId = doc.external_id;
-      const docTitle = ui.getDocumentTitle(doc, "Untitled");
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: "flex items-center space-x-2",
-          "data-testid": `embedded-document-${docId}`,
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Checkbox,
-              {
-                id: `embedded-doc-${docId}`,
-                checked: selectedDocIds.includes(docId),
-                onCheckedChange: () => handleToggle(docId)
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "label",
-              {
-                htmlFor: `embedded-doc-${docId}`,
-                className: "text-sm cursor-pointer flex-1 truncate",
-                title: docTitle,
-                children: docTitle
-              }
-            )
-          ]
-        },
-        docId
+  async function addFiles(files) {
+    if (!canUpload) return;
+    setUploadError(null);
+    setUploadNotice(null);
+    const original = session.getState();
+    const workspaceId = original.workspaceId;
+    const key = original.conversationId || "new";
+    try {
+      const result = await upload.mutateAsync({ files });
+      const ids = result.doc_ext_ids ?? [];
+      const current = session.getState();
+      if (current.workspaceId !== workspaceId) return;
+      const selected = current.conversationDocuments[key] || EMPTY_DOCS;
+      const merged = [
+        ...selected,
+        ...ids.filter((id) => !selected.some((d) => d.docId === id)).map((docId) => ({ docId, isPinned: false }))
+      ];
+      session.setConversationDocuments(key, merged);
+      onSelectionChange?.(merged.map((d) => d.docId));
+      setExpanded(true);
+      setUploadNotice(
+        ids.length ? `${ids.length} file${ids.length === 1 ? "" : "s"} added to this chat.` : "No new files added. Files may already exist in this workspace."
       );
-    }) }) })
-  ] });
+    } catch (error) {
+      setUploadError(error instanceof Error ? error.message : "Could not upload files. Try again.");
+    }
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: "shrink-0 border-b bg-muted/30 px-3 py-2",
+      "data-testid": "embedded-document-selector",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            ui.Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              className: "min-w-0",
+              "aria-expanded": expanded,
+              "aria-controls": "embedded-documents",
+              onClick: () => setExpanded(!expanded),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileText, { className: "h-4 w-4 mr-2" }),
+                "Files",
+                selectedDocIds.length > 0 ? ` (${selectedDocIds.length} selected)` : "",
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 ml-2" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              ref: inputRef,
+              type: "file",
+              multiple: true,
+              className: "hidden",
+              "aria-label": "Upload files",
+              onChange: (event) => {
+                const files = Array.from(event.target.files ?? []);
+                event.target.value = "";
+                if (files.length) void addFiles(files);
+              }
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            ui.Button,
+            {
+              type: "button",
+              variant: "outline",
+              size: "sm",
+              disabled: upload.isPending || !canUpload,
+              title: !canUpload ? "You do not have permission to upload to this workspace." : void 0,
+              onClick: () => inputRef.current?.click(),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Upload, { className: "h-4 w-4 mr-2" }),
+                upload.isPending ? "Uploading\u2026" : "Upload files"
+              ]
+            }
+          )
+        ] }),
+        uploadError && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "mt-2 text-sm text-destructive", children: uploadError }),
+        uploadNotice && /* @__PURE__ */ jsxRuntime.jsx("p", { role: "status", className: "mt-2 text-xs text-muted-foreground", children: uploadNotice }),
+        expanded && /* @__PURE__ */ jsxRuntime.jsxs("div", { id: "embedded-documents", className: "mt-2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 text-xs text-muted-foreground", children: "Select files to use in this conversation. Uploads are saved in the current workspace." }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "max-h-28 overflow-y-auto rounded-md border p-2",
+              "data-testid": "embedded-documents-list",
+              children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "Loading files\u2026" }) : documentsError ? /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", className: "text-sm text-destructive", children: "Could not load workspace files." }) : documents.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: "No files yet. Upload a file to discuss it with ARBI." }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: documents.map((doc) => {
+                const docId = doc.external_id;
+                const docTitle = ui.getDocumentTitle(doc, "Untitled");
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "div",
+                  {
+                    className: "flex items-center space-x-2",
+                    "data-testid": `embedded-document-${docId}`,
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        ui.Checkbox,
+                        {
+                          id: `embedded-doc-${docId}`,
+                          checked: selectedDocIds.includes(docId),
+                          onCheckedChange: () => handleToggle(docId)
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "label",
+                        {
+                          htmlFor: `embedded-doc-${docId}`,
+                          className: "min-w-0 text-sm cursor-pointer flex-1 truncate",
+                          title: docTitle,
+                          children: docTitle
+                        }
+                      )
+                    ]
+                  },
+                  docId
+                );
+              }) })
+            }
+          )
+        ] })
+      ]
+    }
+  );
 }
 async function backUpOnSignup({
   email,
@@ -3190,27 +3384,33 @@ function EmbeddedChatPanel({
 }) {
   const workspaceId = react.useArbiSessionState((s) => s.workspaceId);
   if (!signedIn)
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", "data-testid": "embedded-panel-login", children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "h-full min-h-0 overflow-y-auto p-4", "data-testid": "embedded-panel-login", children: [
       login,
       footer
     ] });
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: "flex flex-col h-full min-h-0 bg-background text-foreground",
+      className: "flex flex-col h-full min-h-0 min-w-0 overflow-hidden bg-background text-foreground",
       "data-testid": "embedded-panel",
       children: [
-        header,
-        workspaceId && /* @__PURE__ */ jsxRuntime.jsx(ConnectedConversationDocumentPicker, { onSelectionChange: onDocumentSelectionChange }),
-        platformHeader,
-        workspaceId ? /* @__PURE__ */ jsxRuntime.jsx(ConnectedCompactConversation, {}) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "p-4 text-sm text-muted-foreground", children: "Select a workspace to start chatting." }),
-        platformFooter,
-        footer
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: header }),
+        workspaceId && /* @__PURE__ */ jsxRuntime.jsx(
+          ConnectedConversationDocumentPicker,
+          {
+            onSelectionChange: onDocumentSelectionChange
+          },
+          workspaceId
+        ),
+        platformHeader && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: platformHeader }),
+        workspaceId ? /* @__PURE__ */ jsxRuntime.jsx(ConnectedCompactConversation, {}, workspaceId) : /* @__PURE__ */ jsxRuntime.jsx("p", { className: "p-4 text-sm text-muted-foreground", children: "Select a workspace to start chatting." }),
+        platformFooter && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: platformFooter }),
+        footer && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: footer })
       ]
     }
   );
 }
-function EmbeddedWorkspaceHeader() {
+function EmbeddedWorkspaceHeader({ title }) {
   const arbi = react.useArbi();
   const signedIn = react.useArbiSession();
   const workspaceId = react.useArbiSessionState((s) => s.workspaceId);
@@ -3231,7 +3431,11 @@ function EmbeddedWorkspaceHeader() {
       setPending(false);
     }
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "p-3 border-b space-y-2", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "shrink-0 p-3 border-b space-y-3", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 font-semibold text-primary", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageSquare, { className: "h-5 w-5", "aria-hidden": "true" }),
+      title
+    ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm", children: signedIn.user?.email }),
       /* @__PURE__ */ jsxRuntime.jsx(
@@ -3282,7 +3486,7 @@ function ConnectedEmbeddedChat({
     {
       ...props,
       signedIn: session.status === "signed-in",
-      header: /* @__PURE__ */ jsxRuntime.jsx(EmbeddedWorkspaceHeader, {}),
+      header: /* @__PURE__ */ jsxRuntime.jsx(EmbeddedWorkspaceHeader, { title }),
       login: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "font-semibold mb-4", children: title }),
         /* @__PURE__ */ jsxRuntime.jsx(CompactLogin, { ...login })
@@ -3290,7 +3494,7 @@ function ConnectedEmbeddedChat({
     }
   );
 }
-function ArbiChat({ apiUrl, deploymentDomain, ...props }) {
+function ArbiChat({ apiUrl, deploymentDomain, className, ...props }) {
   const host = React7.useMemo(
     () => defaultHost(
       {
@@ -3303,7 +3507,13 @@ function ArbiChat({ apiUrl, deploymentDomain, ...props }) {
     ),
     [apiUrl, deploymentDomain]
   );
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkEFS3XXZS_cjs.ArbiHost, { config: host, children: /* @__PURE__ */ jsxRuntime.jsx(ConnectedEmbeddedChat, { ...props }) }, `${apiUrl}|${deploymentDomain ?? ""}`);
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkEFS3XXZS_cjs.ArbiHost, { config: host, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: className ?? "h-[min(44rem,100dvh)] w-full min-h-0 overflow-hidden rounded-xl border bg-background shadow-sm",
+      children: /* @__PURE__ */ jsxRuntime.jsx(ConnectedEmbeddedChat, { ...props })
+    }
+  ) }, `${apiUrl}|${deploymentDomain ?? ""}`);
 }
 
 exports.AgentSteps = AgentSteps;
@@ -3343,5 +3553,5 @@ exports.useRegisterSubmitState = useRegisterSubmitState;
 exports.useSlashItems = useSlashItems;
 exports.useSsoSignIn = useSsoSignIn;
 exports.useWorkspaceDocTitles = useWorkspaceDocTitles;
-//# sourceMappingURL=chunk-3VFQYKB5.cjs.map
-//# sourceMappingURL=chunk-3VFQYKB5.cjs.map
+//# sourceMappingURL=chunk-EPBFVO4F.cjs.map
+//# sourceMappingURL=chunk-EPBFVO4F.cjs.map