import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { X } from "lucide-react";
import { cn } from "../lib/utils";
export const ACTIVE_AGENT_PREFIX = "active-agent:";
/**
 * Sidebar content for the agents workspace (mobile only).
 * Renders two groups: "Agents" (Inbox, All Agents, Create New) and "Active Agents" (open agents with close button).
 */
export function AgentsSidebar({ mainNavItems, activeAgents, activeSidebarKey, onNavClick, onCloseAgent, }) {
    return (_jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-auto p-4", children: [_jsx("div", { className: "mb-3 px-2 text-sm font-semibold tracking-wide text-gray-600 uppercase", children: "Agents" }), _jsx("div", { className: "flex flex-col gap-1", children: mainNavItems.map((item) => {
                    const isActive = activeSidebarKey === item.id &&
                        !activeSidebarKey.startsWith(ACTIVE_AGENT_PREFIX);
                    return (_jsx("button", { type: "button", className: cn("flex w-full cursor-pointer items-center gap-3 rounded-lg py-2.5 pl-5 pr-3 text-left text-sm transition-all", "text-gray-700 hover:bg-gray-100 hover:text-gray-900", "focus-visible:ring-2 focus-visible:ring-indigo-500 focus-visible:outline-none", isActive && "bg-theme-secondary-light text-theme-secondary"), onClick: () => onNavClick(item.id), children: _jsx("span", { className: "min-w-0 flex-1 truncate font-medium", children: item.label }) }, item.id));
                }) }), activeAgents.length > 0 && (_jsx(_Fragment, { children: _jsxs("div", { className: "mt-6 border-t border-gray-200 pt-4", children: [_jsx("div", { className: "mb-3 px-2 text-sm font-semibold tracking-wide text-gray-600 uppercase", children: "Active Agents" }), _jsx("div", { className: "flex flex-col gap-1", children: activeAgents.map((a) => {
                                const key = `${ACTIVE_AGENT_PREFIX}${a.id}`;
                                const isActive = activeSidebarKey === key;
                                return (_jsxs("div", { className: cn("group flex items-center gap-2 rounded-lg py-2.5 pl-5 pr-2 text-left text-sm transition-all", "text-gray-700 hover:bg-gray-100 hover:text-gray-900", isActive &&
                                        "bg-theme-secondary-light text-theme-secondary"), children: [_jsx("button", { type: "button", className: "min-w-0 flex-1 truncate text-left font-medium", onClick: () => onNavClick(key), title: a.name || "Untitled", children: a.name || "Untitled" }), _jsx("button", { type: "button", className: "flex h-7 w-7 shrink-0 items-center justify-center rounded-md text-gray-400 transition-colors hover:bg-gray-200 hover:text-gray-700", onClick: (e) => onCloseAgent(a.id, e), "aria-label": `Close ${a.name || "agent"}`, title: "Close", children: _jsx(X, { className: "h-4 w-4", strokeWidth: 2 }) })] }, a.id));
                            }) })] }) }))] }));
}
//# sourceMappingURL=AgentsSidebar.js.map