@parhelia/core 0.1.12907 → 0.1.12909

package/dist/editor/ai/terminal/components/AgentCostDisplay.js

@@ -0,0 +1,116 @@
+"use client";
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
+import { Popover, PopoverContent, PopoverTrigger, } from "../../../../components/ui/popover";
+import { useParheliaSettings } from "../../../hooks/useParheliaSettings";
+export function AgentCostDisplay({ className = "", response, totalTokens, costLimit, }) {
+    const [showCostPopover, setShowCostPopover] = useState(false);
+    const costPopoverRef = useRef(null);
+    const parheliaSettings = useParheliaSettings();
+    const currency = parheliaSettings?.currency || "USD";
+    const limit = costLimit != null ? Number(costLimit) : null;
+    // Handle click outside for cost popover
+    useEffect(() => {
+        function handleClickOutside(event) {
+            if (costPopoverRef.current &&
+                !costPopoverRef.current.contains(event.target)) {
+                setShowCostPopover(false);
+            }
+        }
+        if (showCostPopover) {
+            document.addEventListener("click", handleClickOutside);
+            return () => {
+                document.removeEventListener("click", handleClickOutside);
+            };
+        }
+    }, [showCostPopover]);
+    // Calculate estimated cost based on typical pricing (rough estimates)
+    // Claude 3.5 Sonnet pricing: ~$3/MTok input, ~$15/MTok output
+    const calculateEstimatedCost = (inputTokens, outputTokens, cachedTokens, cacheWriteTokens = 0) => {
+        // Cached tokens are a subset of input tokens, not additional tokens
+        const freshInputTokens = inputTokens - cachedTokens;
+        const inputCost = (freshInputTokens / 1000000) * 3; // $3 per million tokens
+        const outputCost = (outputTokens / 1000000) * 15; // $15 per million tokens
+        const cachedCost = (cachedTokens / 1000000) * 0.3; // Cached tokens are typically much cheaper
+        const cacheWriteCost = (cacheWriteTokens / 1000000) * 3.75; // Cache write tokens cost more
+        return {
+            inputCost,
+            outputCost,
+            cachedCost,
+            cacheWriteCost,
+            totalCost: inputCost + outputCost + cachedCost + cacheWriteCost,
+        };
+    };
+    // Use actual cost data if available, otherwise calculate estimates
+    const currentCost = response
+        ? response.totalCost !== undefined
+            ? {
+                inputCost: response.inputCost ?? 0,
+                outputCost: response.outputCost ?? 0,
+                cachedCost: response.cachedCost ?? 0,
+                cacheWriteCost: response.cacheWriteCost ?? 0,
+                totalCost: response.totalCost,
+            }
+            : calculateEstimatedCost(response.numInputTokens, response.numOutputTokens, response.numCachedTokens, response.numCacheWriteTokens ?? 0)
+        : null;
+    const displayTotalCost = totalTokens?.totalCost ?? currentCost?.totalCost ?? 0;
+    // Dev-mode invariant: visible rows should sum to the displayed total within rounding tolerance.
+    // Warn (don't throw) so a regression like "header 0.63 vs rows 0.12" surfaces in the console
+    // before the user notices it in the UI.
+    useEffect(() => {
+        if (process.env.NODE_ENV === "production")
+            return;
+        if (!totalTokens)
+            return;
+        const rowsSum = (totalTokens.inputCost ?? 0) +
+            (totalTokens.outputCost ?? 0) +
+            (totalTokens.cachedCost ?? 0) +
+            (totalTokens.cacheWriteCost ?? 0) +
+            (totalTokens.inputAudioCost ?? 0) +
+            (totalTokens.outputAudioCost ?? 0) +
+            (totalTokens.outputImageCost ?? 0) +
+            (totalTokens.imageCost ?? 0) +
+            (totalTokens.markupCost ?? 0);
+        const drift = Math.abs(rowsSum - (totalTokens.totalCost ?? 0));
+        if (drift > 0.005) {
+            console.warn("[AgentCostDisplay] Row-sum invariant broken: rows sum to %f but total is %f (drift %f). " +
+                "Server emitted inconsistent cost fields — see CostSnapshot.Apply on the backend.", rowsSum, totalTokens.totalCost, drift);
+        }
+    }, [totalTokens]);
+    const hasTokenData = response &&
+        (response.numInputTokens > 0 ||
+            response.numOutputTokens > 0 ||
+            response.numCachedTokens > 0);
+    const hasTotalData = totalTokens &&
+        (totalTokens.input > 0 || totalTokens.output > 0 || totalTokens.cached > 0);
+    const hasCostData = (response && response.totalCost && response.totalCost > 0) ||
+        (totalTokens && totalTokens.totalCost && totalTokens.totalCost > 0);
+    if (!hasTokenData && !hasTotalData && !hasCostData && !(limit && limit > 0)) {
+        return null;
+    }
+    // Calculate percentage of limit used
+    const percentUsed = limit && limit > 0 ? Math.min((displayTotalCost / limit) * 100, 100) : null;
+    // Determine color based on usage
+    const getColorClass = () => {
+        if (!percentUsed)
+            return "text-neutral-grey-50";
+        if (percentUsed >= 100)
+            return "text-feedback-red";
+        if (percentUsed >= 80)
+            return "text-component-shared";
+        if (percentUsed >= 60)
+            return "text-feedback-orange";
+        return "text-neutral-grey-50";
+    };
+    return (_jsx("div", { className: `relative ${className}`, ref: costPopoverRef, "data-testid": "agent-cost-display", children: _jsxs(Popover, { open: showCostPopover, onOpenChange: setShowCostPopover, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("div", { className: `hover:text-neutral-grey-50 cursor-pointer text-right text-[10px] ${getColorClass()}`, "data-testid": "agent-cost-display-trigger", children: ["Total cost:", " ", _jsxs("span", { className: "font-medium", children: [displayTotalCost.toFixed(2), " ", currency] }), limit && limit > 0 && ` / ${limit.toFixed(2)} ${currency}`] }) }), _jsx(PopoverContent, { className: "w-80 p-4", align: "end", side: "bottom", "data-testid": "agent-cost-display-popover", children: _jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "border-b pb-2", children: _jsxs("h4", { className: "flex items-center justify-between text-sm font-medium", children: [_jsx("div", { children: "Cost Breakdown" }), _jsxs("span", { className: "text-sm font-medium", children: [displayTotalCost.toFixed(2), " ", currency, limit && limit > 0 && (_jsxs("span", { className: "text-neutral-grey-50 ml-1 text-xs", children: ["/ ", limit.toFixed(2), " ", currency] }))] })] }) }), limit && limit > 0 && (_jsxs("div", { className: "bg-neutral-grey-5 rounded-md p-3", children: [_jsxs("div", { className: "mb-2 flex items-center justify-between text-xs", children: [_jsx("span", { className: "text-neutral-grey-100 font-medium", children: "Cost Limit Usage" }), _jsxs("span", { className: `font-medium ${getColorClass()}`, children: [percentUsed?.toFixed(1), "%"] })] }), _jsx("div", { className: "bg-neutral-grey-10 h-2 w-full overflow-hidden rounded-full", children: _jsx("div", { className: `h-full transition-all ${percentUsed && percentUsed >= 100
+                                                ? "bg-feedback-red"
+                                                : percentUsed && percentUsed >= 80
+                                                    ? "bg-component-shared"
+                                                    : percentUsed && percentUsed >= 60
+                                                        ? "bg-feedback-orange"
+                                                        : "bg-highlight-100"}`, style: { width: `${Math.min(percentUsed || 0, 100)}%` } }) }), percentUsed != null && percentUsed >= 90 && (_jsx("p", { className: "text-neutral-grey-50 mt-2 text-xs", children: percentUsed >= 100
+                                            ? "Cost limit reached. Execution will stop on next API call."
+                                            : "Approaching cost limit. Consider extending if needed." }))] })), _jsx("div", { className: "space-y-3", children: (hasTotalData || hasTokenData) && (_jsx(_Fragment, { children: _jsx("div", { className: "space-y-2", children: hasTotalData ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Input tokens:" }), _jsxs("span", { className: "text-xs", children: [totalTokens.input.toLocaleString(), " (", totalTokens.inputCost.toFixed(2), " ", currency, ")"] })] }), (totalTokens.inputAudio ?? 0) > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Input audio tokens:" }), _jsxs("span", { className: "text-xs", children: [(totalTokens.inputAudio ?? 0).toLocaleString(), " (", (totalTokens.inputAudioCost ?? 0).toFixed(2), " ", currency, ")"] })] })), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Output tokens:" }), _jsxs("span", { className: "text-xs", children: [totalTokens.output.toLocaleString(), " (", totalTokens.outputCost.toFixed(2), " ", currency, ")"] })] }), (totalTokens.reasoning ?? 0) > 0 && (_jsxs("div", { className: "flex items-center justify-between pl-3", "data-testid": "reasoning-tokens-row", title: "Reasoning tokens are a subset of output tokens \u2014 already counted in the Output cost above.", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs italic", children: "\u21B3 of which reasoning:" }), _jsx("span", { className: "text-neutral-grey-50 text-xs italic", children: (totalTokens.reasoning ?? 0).toLocaleString() })] })), (totalTokens.outputImage ?? 0) > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Output image tokens:" }), _jsxs("span", { className: "text-xs", children: [(totalTokens.outputImage ?? 0).toLocaleString(), " ", "(", (totalTokens.outputImageCost ?? 0).toFixed(2), " ", currency, ")"] })] })), (totalTokens.outputAudio ?? 0) > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Output audio tokens:" }), _jsxs("span", { className: "text-xs", children: [(totalTokens.outputAudio ?? 0).toLocaleString(), " ", "(", (totalTokens.outputAudioCost ?? 0).toFixed(2), " ", currency, ")"] })] })), totalTokens.cached > 0 && (_jsxs("div", { className: "flex items-center justify-between", "data-testid": "cached-tokens-row", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Cached tokens:" }), _jsxs("span", { className: "text-xs", "data-testid": "cached-tokens-value", children: [totalTokens.cached.toLocaleString(), " (", totalTokens.cachedCost.toFixed(2), " ", currency, ")"] })] })), totalTokens.cacheWrite > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Cache write tokens:" }), _jsxs("span", { className: "text-xs", children: [totalTokens.cacheWrite.toLocaleString(), " (", (totalTokens.cacheWriteCost ?? 0).toFixed(2), " ", currency, ")"] })] })), totalTokens.imageCost > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Image generation:" }), _jsxs("span", { className: "text-xs", children: [totalTokens.imageCost.toFixed(2), " ", currency] })] })), (totalTokens.markupCost ?? 0) > 0 && (_jsxs("div", { className: "mt-1 flex items-center justify-between border-t border-dashed pt-2", "data-testid": "provider-markup-row", title: "Billed by the provider (e.g. OpenRouter) on top of upstream model cost.", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Provider markup:" }), _jsxs("span", { className: "text-xs", children: [(totalTokens.markupCost ?? 0).toFixed(2), " ", currency] })] }))] })) : (_jsx(_Fragment, { children: response && currentCost && (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Input tokens:" }), _jsxs("span", { className: "text-xs", children: [response.numInputTokens.toLocaleString(), "(", currentCost.inputCost.toFixed(2), " ", currency, ")"] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Output tokens:" }), _jsxs("span", { className: "text-xs", children: [response.numOutputTokens.toLocaleString(), "(", currentCost.outputCost.toFixed(2), " ", currency, ")"] })] }), response.numCachedTokens > 0 && (_jsxs("div", { className: "flex items-center justify-between", "data-testid": "cached-tokens-row", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Cached tokens:" }), _jsxs("span", { className: "text-xs", "data-testid": "cached-tokens-value", children: [response.numCachedTokens.toLocaleString(), "(", currentCost.cachedCost.toFixed(2), " ", currency, ")"] })] })), response.numCacheWriteTokens &&
+                                                        response.numCacheWriteTokens > 0 && (_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-neutral-grey-50 text-xs", children: "Cache write tokens:" }), _jsxs("span", { className: "text-xs", children: [response.numCacheWriteTokens.toLocaleString(), "(", currentCost.cacheWriteCost.toFixed(2), " ", currency, ")"] })] })), _jsx("div", { className: "text-neutral-grey-50 mt-2 text-xs", children: "* Estimated costs based on typical Claude 3.5 pricing" })] })) })) }) })) })] }) })] }) }));
+}
+//# sourceMappingURL=AgentCostDisplay.js.map

package/dist/editor/ai/terminal/components/AgentCostDisplay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentCostDisplay.js","sourceRoot":"","sources":["../../../../../src/editor/ai/terminal/components/AgentCostDisplay.tsx"],"names":[],"mappings":"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"}

package/dist/editor/ai/terminal/components/AgentDocumentList.d.ts

@@ -0,0 +1,32 @@
+import React from "react";
+import { type AgentMessageAttachment } from "../../../services/agentService";
+export interface AgentDocumentListHandle {
+    uploadFiles: (files: FileList | File[]) => Promise<void>;
+    /** Open the media library picker and stage the chosen item as an attachment. */
+    browseMedia: () => Promise<void>;
+    getStagedAttachments: () => AgentMessageAttachment[];
+    clearStagedAttachments: () => void;
+}
+interface AgentDocumentListProps {
+    agentId: string;
+    maxFileSizeMB?: number;
+    enabled?: boolean;
+    profileId?: string;
+    headerless?: boolean;
+    onCountChange?: (count: number) => void;
+    /**
+     * When true, the component only loads documents (to feed `onCountChange`)
+     * and renders nothing. Use for offscreen mounts that drive a count badge
+     * without producing visible duplicates of the docs UI.
+     */
+    loadOnly?: boolean;
+    headerActionsContainer?: HTMLElement | null;
+    /** Compact inline rendering for the prompt composer attachment strip. */
+    composerInline?: boolean;
+    /** Called when the component wants its containing popover to close
+     *  (e.g. before opening the media library picker so it doesn't sit
+     *  behind the popover). */
+    onRequestClose?: () => void;
+}
+export declare const AgentDocumentList: React.ForwardRefExoticComponent<AgentDocumentListProps & React.RefAttributes<AgentDocumentListHandle>>;
+export {};

package/dist/editor/ai/terminal/components/AgentDocumentList.js

@@ -0,0 +1,404 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useEffect, useCallback, useImperativeHandle, forwardRef, } from "react";
+import { createPortal } from "react-dom";
+import { FileText, Loader2, ChevronDown, ChevronUp, Eye, Image as ImageIcon, Download, Upload, } from "lucide-react";
+import { DeleteIcon } from "../../../../components/ui/delete-icon";
+import { AGENT_DOCUMENT_UPLOADED_EVENT, AGENT_DOCUMENTS_CHANGED_EVENT, getAgentDocuments, deleteDocument, uploadDocument, downloadDocument, } from "../../../services/agentService";
+import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, } from "../../../../components/ui/dialog";
+import { useEditContext } from "../../../client/editContext";
+export const AgentDocumentList = forwardRef(({ agentId, maxFileSizeMB = 10, enabled = true, profileId, headerless, onCountChange, loadOnly, headerActionsContainer, composerInline, onRequestClose, }, ref) => {
+    const [documents, setDocuments] = useState([]);
+    const [stagedDocuments, setStagedDocuments] = useState([]);
+    // Start with loading=true to prevent early return before we've loaded documents
+    const [loading, setLoading] = useState(true);
+    const [uploading, setUploading] = useState(false);
+    const [browsingMedia, setBrowsingMedia] = useState(false);
+    const [isDragOver, setIsDragOver] = useState(false);
+    const [error, setError] = useState(null);
+    const [isExpanded, setIsExpanded] = useState(false);
+    const [viewingDocument, setViewingDocument] = useState(null);
+    const editContext = useEditContext();
+    const mergeDocument = useCallback((documentToMerge) => {
+        setDocuments((prev) => {
+            const existingIndex = prev.findIndex((doc) => doc.id === documentToMerge.id);
+            if (existingIndex === -1) {
+                return [documentToMerge, ...prev];
+            }
+            const next = [...prev];
+            next[existingIndex] = documentToMerge;
+            return next;
+        });
+    }, []);
+    const mergeStagedDocument = useCallback((documentToMerge) => {
+        setStagedDocuments((prev) => {
+            const existingIndex = prev.findIndex((doc) => doc.id === documentToMerge.id);
+            if (existingIndex === -1) {
+                return [...prev, documentToMerge];
+            }
+            const next = [...prev];
+            next[existingIndex] = documentToMerge;
+            return next;
+        });
+    }, []);
+    const loadDocuments = useCallback(async () => {
+        if (!agentId) {
+            return;
+        }
+        try {
+            setLoading(true);
+            const result = await getAgentDocuments(agentId);
+            if (result.success && result.documents) {
+                setDocuments(result.documents);
+            }
+        }
+        catch (err) {
+            console.error("Failed to load documents", err);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [agentId]);
+    // Always load documents on mount and when agentId changes
+    useEffect(() => {
+        if (agentId) {
+            loadDocuments();
+        }
+        else {
+            // No agentId, clear loading state
+            setLoading(false);
+        }
+    }, [agentId, loadDocuments]);
+    useEffect(() => {
+        setStagedDocuments([]);
+    }, [agentId, profileId]);
+    useEffect(() => {
+        onCountChange?.(documents.length);
+    }, [documents.length, onCountChange]);
+    useEffect(() => {
+        const handleDocumentUploaded = (event) => {
+            const detail = event
+                .detail;
+            if (!detail || detail.agentId !== agentId) {
+                return;
+            }
+            mergeDocument(detail.document);
+            setIsExpanded(true);
+            setError(null);
+        };
+        window.addEventListener(AGENT_DOCUMENT_UPLOADED_EVENT, handleDocumentUploaded);
+        return () => {
+            window.removeEventListener(AGENT_DOCUMENT_UPLOADED_EVENT, handleDocumentUploaded);
+        };
+    }, [agentId, mergeDocument]);
+    useEffect(() => {
+        const handleDocumentsChanged = (event) => {
+            const detail = event
+                .detail;
+            if (!detail || detail.agentId !== agentId) {
+                return;
+            }
+            setIsExpanded(true);
+            setError(null);
+            void loadDocuments();
+        };
+        window.addEventListener(AGENT_DOCUMENTS_CHANGED_EVENT, handleDocumentsChanged);
+        return () => {
+            window.removeEventListener(AGENT_DOCUMENTS_CHANGED_EVENT, handleDocumentsChanged);
+        };
+    }, [agentId, loadDocuments]);
+    const handleDelete = async (documentId) => {
+        try {
+            const result = await deleteDocument(documentId);
+            if (result.success) {
+                setDocuments((prev) => prev.filter((d) => d.id !== documentId));
+                setStagedDocuments((prev) => prev.filter((d) => d.id !== documentId));
+            }
+            else {
+                setError(result.error || "Failed to delete document");
+            }
+        }
+        catch (err) {
+            console.error("Failed to delete document", err);
+            setError("Failed to delete document");
+        }
+    };
+    const handleFileUpload = useCallback(async (files) => {
+        if (!files || files.length === 0)
+            return;
+        // Convert to array for easier processing
+        const fileList = Array.from(files);
+        const maxSizeBytes = maxFileSizeMB * 1024 * 1024;
+        // Auto-expand and clear error when starting upload
+        setIsExpanded(true);
+        setError(null);
+        setUploading(true);
+        try {
+            for (const file of fileList) {
+                if (file.size > maxSizeBytes) {
+                    setError(`File "${file.name}" exceeds maximum allowed size of ${maxFileSizeMB} MB`);
+                    continue;
+                }
+                const result = await uploadDocument(agentId, file, profileId);
+                if (result.success && result.document) {
+                    mergeDocument(result.document);
+                    mergeStagedDocument(result.document);
+                }
+                else {
+                    setError(result.error || `Failed to upload "${file.name}"`);
+                }
+            }
+        }
+        catch (err) {
+            console.error("Failed to upload document", err);
+            setError(err.message || "Failed to upload document");
+        }
+        finally {
+            setUploading(false);
+        }
+    }, [agentId, maxFileSizeMB, mergeDocument, mergeStagedDocument, profileId]);
+    const handleDragOver = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        if (!isDragOver)
+            setIsDragOver(true);
+    };
+    const handleDragLeave = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragOver(false);
+    };
+    const handleDrop = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragOver(false);
+        // Only handle file drops, not component/item drops
+        if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
+            handleFileUpload(e.dataTransfer.files);
+        }
+    };
+    const handlePaste = (e) => {
+        if (!enabled)
+            return;
+        const items = e.clipboardData?.items;
+        if (!items)
+            return;
+        const files = [];
+        for (let i = 0; i < items.length; i++) {
+            const item = items[i];
+            if (!item)
+                continue;
+            if (item.type.indexOf("image") !== -1 || item.kind === "file") {
+                const file = item.getAsFile();
+                if (file) {
+                    // If it's a pasted image, it might not have a useful name
+                    if (file.name === "image.png" &&
+                        item.type.indexOf("image") !== -1) {
+                        // Generate a better name for pasted images
+                        const timestamp = new Date().toISOString().replace(/[:.]/g, "-");
+                        const extension = item.type.split("/")[1] || "png";
+                        const newFile = new File([file], `pasted-image-${timestamp}.${extension}`, { type: file.type });
+                        files.push(newFile);
+                    }
+                    else {
+                        files.push(file);
+                    }
+                }
+            }
+        }
+        if (files.length > 0) {
+            handleFileUpload(files);
+        }
+    };
+    const handleBrowseMedia = useCallback(async () => {
+        if (!editContext?.selectMedia)
+            return;
+        // Close the containing popover so the media library modal isn't
+        // hidden behind it (z-order conflict).
+        onRequestClose?.();
+        setBrowsingMedia(true);
+        setError(null);
+        try {
+            // Open media selector - returns media item ID/path
+            const mediaId = await editContext.selectMedia({
+                selectedIdPath: "",
+                mode: "images",
+            });
+            if (!mediaId) {
+                // User cancelled
+                setBrowsingMedia(false);
+                return;
+            }
+            // Auto-expand when adding media
+            setIsExpanded(true);
+            // Fetch media URL from server
+            const urlResponse = await fetch(`/parhelia/agent/GetMediaUrl?itemId=${encodeURIComponent(mediaId)}`);
+            if (!urlResponse.ok)
+                throw new Error("Failed to get media URL");
+            const { url, alt } = await urlResponse.json();
+            // Fetch the actual image blob
+            const imageResponse = await fetch(url);
+            if (!imageResponse.ok)
+                throw new Error("Failed to fetch image");
+            const blob = await imageResponse.blob();
+            // Create a File object with appropriate name
+            // Extract filename from mediaId path (e.g., "/sitecore/media library/images/photo" -> "photo")
+            const pathParts = mediaId.split("/");
+            const rawName = pathParts[pathParts.length - 1] || "media-image";
+            // Clean the name for use as filename
+            const cleanName = rawName.replace(/[^a-zA-Z0-9_-]/g, "_");
+            const extension = blob.type.split("/")[1] || "jpg";
+            const file = new File([blob], `${cleanName}.${extension}`, {
+                type: blob.type,
+            });
+            // Upload to agent document store
+            await handleFileUpload([file]);
+        }
+        catch (err) {
+            console.error("Failed to add media library image", err);
+            setError("Failed to add image from media library");
+        }
+        finally {
+            setBrowsingMedia(false);
+        }
+    }, [editContext, onRequestClose, handleFileUpload]);
+    useImperativeHandle(ref, () => ({
+        uploadFiles: handleFileUpload,
+        browseMedia: handleBrowseMedia,
+        getStagedAttachments: () => stagedDocuments.map(agentDocumentToMessageAttachment),
+        clearStagedAttachments: () => setStagedDocuments([]),
+    }), [handleFileUpload, handleBrowseMedia, stagedDocuments]);
+    const formatFileSize = (bytes) => {
+        if (bytes < 1024)
+            return `${bytes} B`;
+        if (bytes < 1024 * 1024)
+            return `${(bytes / 1024).toFixed(1)} KB`;
+        return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+    };
+    const isImageFile = (fileName, contentType) => {
+        if (!fileName)
+            return false;
+        const extension = fileName.toLowerCase().split(".").pop();
+        const imageExtensions = ["png", "jpg", "jpeg", "gif", "webp"];
+        if (imageExtensions.includes(extension || ""))
+            return true;
+        if (contentType?.toLowerCase().startsWith("image/"))
+            return true;
+        return false;
+    };
+    // Offscreen mount that just feeds the count badge.
+    if (loadOnly) {
+        return null;
+    }
+    // The composer owns the surrounding drop zone; only paint staged state here.
+    const visibleDocuments = composerInline ? stagedDocuments : documents;
+    if (composerInline &&
+        visibleDocuments.length === 0 &&
+        !uploading &&
+        !error) {
+        return null;
+    }
+    // Show section if we have documents OR if upload is enabled.
+    // Hide during the initial load too — otherwise the tray flashes in and out
+    // when switching to an agent that has no documents and disabled uploads.
+    if (!enabled && visibleDocuments.length === 0) {
+        return null;
+    }
+    const fileBrowseInput = enabled ? (_jsxs("label", { className: "text-highlight-100 badge-pad-sm hover:bg-neutral-grey-5 inline-flex cursor-pointer items-center gap-1 rounded text-[10px]", title: "Upload documents", children: [_jsx(Upload, { className: "h-3 w-3", strokeWidth: 1.5 }), "browse", _jsx("input", { type: "file", className: "hidden", onChange: (e) => {
+                    handleFileUpload(e.target.files);
+                    e.target.value = "";
+                }, accept: ".txt,.md,.pdf,.docx,.xlsx,.pptx,.csv,.json,.xml,.cs,.js,.ts,.tsx,.jsx,.py,.java,.cpp,.c,.h,.hpp,.cshtml,.razor,.vb,.php,.rb,.go,.rs,.swift,.kt,.scala,.sql,.sh,.ps1,.bat,.yaml,.yml,.png,.jpg,.jpeg,.gif,.webp" })] })) : null;
+    const mediaLibraryButton = enabled && editContext?.selectMedia ? (_jsxs("button", { type: "button", onClick: handleBrowseMedia, disabled: browsingMedia, className: "text-highlight-100 badge-pad-sm hover:bg-neutral-grey-5 inline-flex items-center gap-1 rounded text-[10px] disabled:cursor-wait disabled:opacity-50", title: "Pick from media library", children: [browsingMedia ? (_jsx(Loader2, { className: "h-3 w-3 animate-spin", strokeWidth: 1.5 })) : (_jsx(ImageIcon, { className: "h-3 w-3", strokeWidth: 1.5 })), "media library"] })) : null;
+    const headerActionsContent = fileBrowseInput || mediaLibraryButton ? (_jsxs("div", { className: "flex items-center gap-1", children: [fileBrowseInput, mediaLibraryButton] })) : null;
+    const useHeaderPortal = headerless && headerActionsContainer;
+    const bodyContent = (_jsxs("div", { className: `${composerInline ? "px-3 pt-0 pb-3" : `px-4 ${headerless ? "pt-3" : ""} pb-3`} ${enabled && !composerInline
+            ? `border-2 border-dashed ${isDragOver
+                ? "bg-highlight-10 border-highlight-100"
+                : "border-transparent"}`
+            : ""}`, onDragOver: enabled ? handleDragOver : undefined, onDragEnter: enabled ? handleDragOver : undefined, onDragLeave: enabled ? handleDragLeave : undefined, onDrop: enabled ? handleDrop : undefined, children: [useHeaderPortal && headerActionsContent
+                ? createPortal(headerActionsContent, headerActionsContainer)
+                : null, headerless &&
+                !composerInline &&
+                !useHeaderPortal &&
+                headerActionsContent && (_jsx("div", { className: "mb-2 flex items-center justify-end", children: headerActionsContent })), error && (_jsx("div", { className: "text-feedback-red bg-feedback-red-light mb-2 rounded p-2 text-xs", children: error })), uploading && (_jsxs("div", { className: "bg-neutral-grey-5 text-neutral-grey-50 mb-2 flex items-center gap-2 rounded p-2 text-xs", children: [_jsx(Loader2, { className: "text-neutral-grey-50 h-3 w-3 animate-spin", strokeWidth: 1 }), _jsx("span", { children: "Uploading document..." })] })), visibleDocuments.length > 0 && (_jsx("div", { className: `${composerInline ? "pr-1 pb-8" : "mb-2"} flex max-h-[40vh] flex-wrap gap-2 overflow-y-auto`, "data-testid": "agent-composer-documents", children: visibleDocuments.map((doc) => {
+                    const fileSize = doc.fileSize ?? 0;
+                    const isImage = isImageFile(doc.fileName, doc.contentType);
+                    return (_jsx(DocumentThumbnail, { document: doc, fileSize: fileSize, isImage: isImage, onViewText: () => doc.extractedText && setViewingDocument(doc), onDelete: () => handleDelete(doc.id), onDownload: () => {
+                            downloadDocument(doc.id)
+                                .then((blob) => {
+                                const url = URL.createObjectURL(blob);
+                                const a = document.createElement("a");
+                                a.href = url;
+                                a.download = doc.fileName;
+                                document.body.appendChild(a);
+                                a.click();
+                                document.body.removeChild(a);
+                                URL.revokeObjectURL(url);
+                            })
+                                .catch((err) => {
+                                console.error("Failed to download document", err);
+                            });
+                        }, formatFileSize: formatFileSize }, doc.id));
+                }) })), enabled && headerless && !composerInline && (_jsxs("div", { className: "text-neutral-grey-50 mt-2 text-xs", children: ["Drag & drop documents and images here", maxFileSizeMB ? ` (max ${maxFileSizeMB} MB)` : ""] })), enabled && !headerless && (_jsxs("div", { className: "text-neutral-grey-50 mt-2 text-xs", children: ["Drag & drop documents and images here or", " ", _jsxs("label", { className: "text-highlight-100 cursor-pointer hover:underline", children: ["browse", _jsx("input", { type: "file", className: "hidden", onChange: (e) => {
+                                    handleFileUpload(e.target.files);
+                                    e.target.value = "";
+                                }, accept: ".txt,.md,.pdf,.docx,.xlsx,.pptx,.csv,.json,.xml,.cs,.js,.ts,.tsx,.jsx,.py,.java,.cpp,.c,.h,.hpp,.cshtml,.razor,.vb,.php,.rb,.go,.rs,.swift,.kt,.scala,.sql,.sh,.ps1,.bat,.yaml,.yml,.png,.jpg,.jpeg,.gif,.webp" })] }), editContext?.selectMedia && (_jsxs(_Fragment, { children: [" or ", _jsx("button", { onClick: handleBrowseMedia, disabled: browsingMedia, className: "text-highlight-100 cursor-pointer hover:underline disabled:cursor-wait disabled:opacity-50", type: "button", children: browsingMedia ? (_jsxs("span", { className: "inline-flex items-center gap-1", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin", strokeWidth: 1 }), "loading..."] })) : ("media library") })] })), maxFileSizeMB && ` (max ${maxFileSizeMB} MB)`] })), !enabled && documents.length === 0 && !loading && (_jsx("div", { className: "text-neutral-grey-50 py-2 text-center text-xs", children: "Document upload is disabled for this profile." }))] }));
+    const dialog = (_jsx(Dialog, { open: !!viewingDocument, onOpenChange: (open) => !open && setViewingDocument(null), children: _jsxs(DialogContent, { className: "flex max-h-[80vh] max-w-4xl flex-col", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Extracted Text" }), _jsx(DialogDescription, { children: viewingDocument?.fileName })] }), _jsx("div", { className: "mt-4 flex-1 overflow-y-auto", children: viewingDocument?.extractedText ? (_jsx("pre", { className: "text-neutral-grey-100 bg-neutral-grey-5 max-h-[60vh] overflow-y-auto rounded border p-4 text-xs whitespace-pre-wrap", children: viewingDocument.extractedText })) : (_jsx("div", { className: "text-neutral-grey-50 py-8 text-center text-sm", children: "No extracted text available for this document." })) })] }) }));
+    if (headerless) {
+        return (_jsxs("div", { className: composerInline ? "bg-neutral-grey-5" : "bg-neutral-grey-5", onPaste: handlePaste, children: [bodyContent, dialog] }));
+    }
+    return (_jsxs("div", { className: "border-border-default bg-neutral-grey-5 border-t", onPaste: handlePaste, children: [_jsxs("button", { onClick: () => setIsExpanded(!isExpanded), onDragOver: enabled ? handleDragOver : undefined, onDragEnter: enabled ? handleDragOver : undefined, onDragLeave: enabled ? handleDragLeave : undefined, onDrop: enabled
+                    ? (e) => {
+                        handleDrop(e);
+                        if (!isExpanded) {
+                            setIsExpanded(true);
+                        }
+                    }
+                    : undefined, className: `flex w-full cursor-pointer items-center justify-between px-4 py-2 text-left transition-colors ${isDragOver && !isExpanded
+                    ? "bg-highlight-10 border-highlight-100 border-2 border-dashed"
+                    : "hover:bg-neutral-grey-5"}`, children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(FileText, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 }), _jsx("span", { className: "text-neutral-grey-100 text-xs font-normal", children: isDragOver && !isExpanded ? "Drop file to upload" : "Documents" }), loading && (_jsx(Loader2, { className: "text-neutral-grey-50 h-3 w-3 animate-spin" })), documents.length > 0 && (_jsxs("span", { className: "text-neutral-grey-50 text-xs", children: ["(", documents.length, ")"] }))] }), isExpanded ? (_jsx(ChevronUp, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 })) : (_jsx(ChevronDown, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 }))] }), isExpanded && bodyContent, dialog] }));
+});
+AgentDocumentList.displayName = "AgentDocumentList";
+function agentDocumentToMessageAttachment(document) {
+    return {
+        id: document.id,
+        agentId: document.agentId,
+        fileName: document.fileName,
+        fileSize: document.fileSize,
+        contentType: document.contentType,
+        uploadedBy: document.uploadedBy,
+        uploadedDate: document.uploadedDate,
+    };
+}
+function DocumentThumbnail({ document, fileSize, isImage, onViewText, onDelete, onDownload, formatFileSize, }) {
+    const [thumbnailUrl, setThumbnailUrl] = useState(null);
+    const [loadingThumbnail, setLoadingThumbnail] = useState(false);
+    const [thumbnailError, setThumbnailError] = useState(false);
+    useEffect(() => {
+        if (!isImage || thumbnailUrl || loadingThumbnail || thumbnailError)
+            return;
+        const loadThumbnail = async () => {
+            try {
+                setLoadingThumbnail(true);
+                const blob = await downloadDocument(document.id);
+                const url = URL.createObjectURL(blob);
+                setThumbnailUrl(url);
+            }
+            catch (err) {
+                console.error("Failed to load thumbnail", err);
+                setThumbnailError(true);
+            }
+            finally {
+                setLoadingThumbnail(false);
+            }
+        };
+        loadThumbnail();
+        // Cleanup object URL on unmount
+        return () => {
+            if (thumbnailUrl) {
+                URL.revokeObjectURL(thumbnailUrl);
+            }
+        };
+    }, [isImage, document.id, thumbnailUrl, loadingThumbnail, thumbnailError]);
+    return (_jsxs("span", { className: "border-border-default text-neutral-grey-100 inline-grid max-w-full grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-x-2 rounded-md border bg-white px-2 py-1.5 text-[12px] shadow-sm", children: [isImage && thumbnailUrl ? (_jsx("img", { src: thumbnailUrl, alt: document.fileName, className: "border-border-default row-span-2 h-8 w-8 flex-shrink-0 rounded border object-cover", onError: () => setThumbnailError(true) })) : isImage && loadingThumbnail ? (_jsx(Loader2, { className: "text-neutral-grey-50 row-span-2 h-8 w-8 flex-shrink-0 animate-spin", strokeWidth: 1 })) : isImage ? (_jsx(ImageIcon, { className: "text-neutral-grey-50 row-span-2 h-8 w-8 flex-shrink-0", strokeWidth: 1 })) : (_jsx(FileText, { className: "text-neutral-grey-50 bg-neutral-grey-5 row-span-2 h-8 w-8 flex-shrink-0 rounded border p-1.5", strokeWidth: 1 })), _jsx("span", { className: "max-w-[260px] truncate leading-tight font-medium", title: `${document.fileName} (${formatFileSize(fileSize)})`, children: document.fileName }), _jsx("span", { className: "text-neutral-grey-50 col-start-2 text-[11px] leading-tight", children: isImage ? "Image" : formatFileSize(fileSize) }), _jsxs("span", { className: "row-span-2 flex items-center gap-0.5", children: [document.extractedText && (_jsx("button", { onClick: onViewText, className: "hover:bg-highlight-10 text-highlight-100 rounded p-1", "aria-label": "View extracted text", title: "View extracted text", children: _jsx(Eye, { className: "h-3.5 w-3.5", strokeWidth: 1 }) })), _jsx("button", { onClick: onDownload, className: "hover:bg-neutral-grey-10 rounded p-1", "aria-label": "Download document", title: "Download document", children: _jsx(Download, { className: "h-3.5 w-3.5", strokeWidth: 1 }) }), _jsx("button", { onClick: onDelete, className: "hover:bg-neutral-grey-10 rounded p-1", "aria-label": "Delete document", title: "Delete document", children: _jsx(DeleteIcon, { size: "sm" }) })] })] }));
+}
+//# sourceMappingURL=AgentDocumentList.js.map