@iloveagents/foundry-web-ui 0.11.1 → 0.12.0

package/dist/components/ag-ui-runtime-provider.js

@@ -4,6 +4,7 @@ import { AssistantRuntimeProvider, useLocalRuntime } from "@assistant-ui/react";
 import { TooltipProvider } from "../ui/tooltip.js";
 import { AGUIAdapterSDK } from "../lib/ag-ui-adapter.js";
 import { FileAttachmentAdapter } from "../lib/attachment-adapter.js";
+import { useAttachmentAdapterStore } from "../lib/attachment-registry.js";
 import { ShowDocumentToolUI } from "./show-document-tool-ui.js";
 import { ClientToolExecutor } from "./client-tool-executor.js";
 const AGUIAdapterContext = createContext(null);
@@ -33,7 +34,10 @@ function AGUIRuntimeInner({ children, fetchFn, threadId, urlMatch, historyAdapte
     // Only pass options if at least one is set, mirroring the prior
     // single-arg semantics for the "fresh chat, no overrides" case.
     fetchFn || threadId ? { fetchFn, threadId } : undefined), [fetchFn, threadId]);
-    const attachmentAdapter = useMemo(() => new FileAttachmentAdapter(), []);
+    // Hosts may register a custom adapter (see ``registerAttachmentAdapter``);
+    // the shell's inline-base64 adapter is the default.
+    const registeredAdapter = useAttachmentAdapterStore((s) => s.adapter);
+    const attachmentAdapter = useMemo(() => registeredAdapter ?? new FileAttachmentAdapter(), [registeredAdapter]);
     // Build the history adapter ONCE per inner mount, after the AG-UI
     // adapter exists so we know its thread id. The keyed-remount in the
     // outer wrapper ensures threadId changes trigger a fresh adapter +

package/dist/components/assistant-chat.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState, useRef, useCallback } from "react";
+import { useState, useRef, useCallback, useEffect } from "react";
 import { ThreadPrimitive, ComposerPrimitive, MessagePrimitive, ActionBarPrimitive, BranchPickerPrimitive, useAui, useAuiState, useThreadViewport, } from "@assistant-ui/react";
 import { ArrowUp, Copy, Check, RefreshCw, PencilIcon, ChevronLeft, ChevronRight, ChevronDown, Square, Bot, Paperclip, Minimize2, PanelRightClose, PanelRightOpen, } from "lucide-react";
 import { cn } from "@iloveagents/foundry-web-primitives";
@@ -53,8 +53,22 @@ const ScrollToBottomButton = () => {
 };
 const DropZone = ({ children }) => {
     const [isDragging, setIsDragging] = useState(false);
+    const [dropError, setDropError] = useState(null);
+    const dropErrorTimer = useRef(null);
     const dragCounter = useRef(0);
     const aui = useAui();
+    const showDropError = useCallback((message) => {
+        setDropError(message);
+        if (dropErrorTimer.current)
+            clearTimeout(dropErrorTimer.current);
+        dropErrorTimer.current = setTimeout(() => setDropError(null), 4000);
+    }, []);
+    useEffect(() => {
+        return () => {
+            if (dropErrorTimer.current)
+                clearTimeout(dropErrorTimer.current);
+        };
+    }, []);
     const handleDragEnter = useCallback((e) => {
         e.preventDefault();
         dragCounter.current++;
@@ -75,11 +89,25 @@ const DropZone = ({ children }) => {
         dragCounter.current = 0;
         setIsDragging(false);
         const files = Array.from(e.dataTransfer.files);
+        // Drops bypass the file picker's ``accept`` filter, so the adapter's
+        // add() is the real gate here — surface its rejections instead of
+        // leaving an unhandled promise rejection and a silently missing chip.
+        const rejected = [];
         for (const file of files) {
-            await aui.composer.addAttachment(file);
+            try {
+                await aui.composer.addAttachment(file);
+            }
+            catch (err) {
+                rejected.push(`${file.name}: ${err instanceof Error ? err.message : "unsupported file type"}`);
+            }
+        }
+        if (rejected.length > 0) {
+            showDropError(rejected.length === 1
+                ? `Couldn't attach ${rejected[0]}`
+                : `Couldn't attach ${rejected.length} files (${rejected.join("; ")})`);
         }
-    }, [aui]);
-    return (_jsxs("div", { className: "relative flex flex-col flex-1 overflow-hidden", onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, children: [children, isDragging && (_jsx("div", { className: cn("absolute inset-0 z-50 flex items-center justify-center pointer-events-none", "bg-background/80 backdrop-blur-sm", "border-2 border-dashed border-primary rounded-xl"), children: _jsx("p", { className: "text-lg text-primary font-medium", children: "Drop files here" }) }))] }));
+    }, [aui, showDropError]);
+    return (_jsxs("div", { className: "relative flex flex-col flex-1 overflow-hidden", onDragEnter: handleDragEnter, onDragLeave: handleDragLeave, onDragOver: handleDragOver, onDrop: handleDrop, children: [children, isDragging && (_jsx("div", { className: cn("absolute inset-0 z-50 flex items-center justify-center pointer-events-none", "bg-background/80 backdrop-blur-sm", "border-2 border-dashed border-primary rounded-xl"), children: _jsx("p", { className: "text-lg text-primary font-medium", children: "Drop files here" }) })), dropError && (_jsx("div", { role: "alert", className: cn("absolute bottom-4 left-1/2 -translate-x-1/2 z-50 max-w-[90%]", "rounded-md border border-destructive/50 bg-background px-3 py-2", "text-sm text-destructive shadow-md pointer-events-none truncate"), children: dropError }))] }));
 };
 /**
  * Reusable chat content — used by ChatPage and ChatBubble.

package/dist/index.d.ts

@@ -65,7 +65,8 @@ export type { NavItem, NavItemAction, NavItemDnd, NavGroup, NavGroupCreateAction
 export { usePageTools } from "./lib/use-page-tools.js";
 export { useNewConversation } from "./lib/use-new-conversation.js";
 export { AGUIAdapterSDK } from "./lib/ag-ui-adapter.js";
-export { FileAttachmentAdapter } from "./lib/attachment-adapter.js";
+export { FileAttachmentAdapter, resolveMimeType } from "./lib/attachment-adapter.js";
+export { registerAttachmentAdapter, useAttachmentAdapterStore, } from "./lib/attachment-registry.js";
 export { ReasoningPart, ReasoningMessagePartComponent } from "./components/reasoning-part.js";
 export { ReasoningEffortPicker } from "./components/reasoning-effort-picker.js";
 export { AuthProvider } from "./lib/auth-provider.js";

package/dist/index.js

@@ -73,7 +73,8 @@ export { usePageTools } from "./lib/use-page-tools.js";
 export { useNewConversation } from "./lib/use-new-conversation.js";
 // --- Adapters ---
 export { AGUIAdapterSDK } from "./lib/ag-ui-adapter.js";
-export { FileAttachmentAdapter } from "./lib/attachment-adapter.js";
+export { FileAttachmentAdapter, resolveMimeType } from "./lib/attachment-adapter.js";
+export { registerAttachmentAdapter, useAttachmentAdapterStore, } from "./lib/attachment-registry.js";
 export { ReasoningPart, ReasoningMessagePartComponent } from "./components/reasoning-part.js";
 export { ReasoningEffortPicker } from "./components/reasoning-effort-picker.js";
 // --- Auth ---

package/dist/lib/attachment-adapter.d.ts

@@ -20,6 +20,10 @@
  * lastspace's `_elide_inline_media` for the pattern.
  */
 import type { AttachmentAdapter, PendingAttachment, CompleteAttachment, Attachment } from "@assistant-ui/react";
+/** Resolve a file's MIME type, falling back to extension inference when
+ * the browser reports an empty ``file.type`` (common for Office files).
+ * Exported for host attachment adapters that need the same resolution. */
+export declare function resolveMimeType(file: File): string;
 export interface FileAttachmentAdapterOptions {
     /**
      * How non-image documents (PDF, DOCX) are sent.

package/dist/lib/attachment-adapter.js

@@ -20,17 +20,22 @@
  * lastspace's `_elide_inline_media` for the pattern.
  */
 const MAX_FILE_SIZE = 20 * 1024 * 1024; // 20 MB
-/** Infer MIME type from extension when browser reports empty file.type (common for .docx) */
+/** Infer MIME type from extension when browser reports empty file.type (common for Office files) */
 const EXTENSION_MIME = {
     ".pdf": "application/pdf",
     ".docx": "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+    ".xlsx": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+    ".pptx": "application/vnd.openxmlformats-officedocument.presentationml.presentation",
     ".png": "image/png",
     ".jpg": "image/jpeg",
     ".jpeg": "image/jpeg",
     ".gif": "image/gif",
     ".webp": "image/webp",
 };
-function resolveMimeType(file) {
+/** Resolve a file's MIME type, falling back to extension inference when
+ * the browser reports an empty ``file.type`` (common for Office files).
+ * Exported for host attachment adapters that need the same resolution. */
+export function resolveMimeType(file) {
     if (file.type)
         return file.type;
     const ext = file.name.slice(file.name.lastIndexOf(".")).toLowerCase();

package/dist/lib/attachment-registry.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Attachment adapter registry — host-injectable composer attachment handling.
+ *
+ * The shell's AG-UI runtime builds its attachment adapter internally
+ * (``FileAttachmentAdapter``), which reads files client-side and inlines
+ * them as base64 message parts. Hosts sometimes need a different
+ * strategy — e.g. uploading Office documents into a backend workspace
+ * and handing the agent a reference instead of bytes. Threading an
+ * adapter through every chat mount would couple the shell to feature
+ * modules, so this is a tiny registry instead — the exact pattern of
+ * ``registerChatSlots``: a module calls :func:`registerAttachmentAdapter`
+ * once (import time or ``useInit``) and the runtime provider picks it up
+ * on its next mount.
+ *
+ * Compose, don't replace: hosts typically wrap their special-case
+ * adapter together with the default in assistant-ui's
+ * ``CompositeAttachmentAdapter`` so images/PDF keep the stock inline
+ * behavior while selected types get the custom path. The composite also
+ * closes the drag-and-drop loophole — its ``add()`` rejects files no
+ * member adapter accepts, whereas drops bypass the file picker's
+ * ``accept`` filter.
+ */
+import type { AttachmentAdapter } from "@assistant-ui/react";
+interface AttachmentAdapterState {
+    adapter: AttachmentAdapter | null;
+}
+export declare const useAttachmentAdapterStore: import("zustand").UseBoundStore<import("zustand").StoreApi<AttachmentAdapterState>>;
+/**
+ * Register the composer attachment adapter. ``null`` restores the
+ * shell's default (``FileAttachmentAdapter``). Later calls overwrite
+ * earlier ones — last registration wins.
+ */
+export declare function registerAttachmentAdapter(adapter: AttachmentAdapter | null): void;
+export {};

package/dist/lib/attachment-registry.js

@@ -0,0 +1,34 @@
+/**
+ * Attachment adapter registry — host-injectable composer attachment handling.
+ *
+ * The shell's AG-UI runtime builds its attachment adapter internally
+ * (``FileAttachmentAdapter``), which reads files client-side and inlines
+ * them as base64 message parts. Hosts sometimes need a different
+ * strategy — e.g. uploading Office documents into a backend workspace
+ * and handing the agent a reference instead of bytes. Threading an
+ * adapter through every chat mount would couple the shell to feature
+ * modules, so this is a tiny registry instead — the exact pattern of
+ * ``registerChatSlots``: a module calls :func:`registerAttachmentAdapter`
+ * once (import time or ``useInit``) and the runtime provider picks it up
+ * on its next mount.
+ *
+ * Compose, don't replace: hosts typically wrap their special-case
+ * adapter together with the default in assistant-ui's
+ * ``CompositeAttachmentAdapter`` so images/PDF keep the stock inline
+ * behavior while selected types get the custom path. The composite also
+ * closes the drag-and-drop loophole — its ``add()`` rejects files no
+ * member adapter accepts, whereas drops bypass the file picker's
+ * ``accept`` filter.
+ */
+import { create } from "zustand";
+export const useAttachmentAdapterStore = create(() => ({
+    adapter: null,
+}));
+/**
+ * Register the composer attachment adapter. ``null`` restores the
+ * shell's default (``FileAttachmentAdapter``). Later calls overwrite
+ * earlier ones — last registration wins.
+ */
+export function registerAttachmentAdapter(adapter) {
+    useAttachmentAdapterStore.setState({ adapter });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@iloveagents/foundry-web-ui",
-  "version": "0.11.1",
+  "version": "0.12.0",
   "license": "MIT",
   "description": "React agent UI core for Foundry UI — chat, composer, AG-UI adapter for assistant-ui, tool cards, panels, sidebar, theme runtime, and UI stores.",
   "keywords": [
@@ -70,8 +70,8 @@
     "tailwind-merge": "^3.5.0",
     "react-markdown": "^10.0.0",
     "remark-gfm": "^4.0.0",
-    "@iloveagents/foundry-agent": "^0.11.1",
-    "@iloveagents/foundry-web-primitives": "^0.11.1"
+    "@iloveagents/foundry-agent": "^0.12.0",
+    "@iloveagents/foundry-web-primitives": "^0.12.0"
   },
   "devDependencies": {
     "@ag-ui/client": "^0.0.52",