import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { AlertCircle, Loader2 } from "lucide-react";
import { Button } from "../../components/ui/button";
/**
 * Notification shown above the taskboard view tabs when a project reaches its
 * cost limit. Mirrors the agent terminal's cost-limit banner: it surfaces the
 * spend vs. limit and offers a one-click "Extend limit" action (owners only)
 * that raises the project budget and resumes paused agent work.
 */
export function ProjectBudgetBanner({ costUsed, costLimit, canExtend, isExtending, onExtend, }) {
    return (_jsxs("div", { role: "status", "aria-live": "polite", className: "border-feedback-orange bg-feedback-orange-light text-feedback-orange mt-[18px] flex flex-col gap-2 rounded border p-3 text-xs sm:flex-row sm:items-center sm:justify-between", "data-testid": "taskboard-budget-banner", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(AlertCircle, { className: "mt-0.5 size-4 shrink-0", strokeWidth: 1.5 }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: "mb-0.5 font-medium", children: "Project budget reached" }), _jsxs("div", { children: ["Spent $", costUsed.toFixed(2), " / $", costLimit.toFixed(2), ". New agent tasks are paused until the limit is raised.", !canExtend ? " Ask the project owner to extend the budget." : ""] })] })] }), canExtend ? (_jsxs(Button, { variant: "outline", size: "sm", onClick: () => void onExtend(), disabled: isExtending, className: "border-feedback-orange text-feedback-orange hover:border-feedback-orange hover:bg-feedback-orange-light hover:text-feedback-orange shrink-0 self-start bg-white sm:self-auto", "data-testid": "taskboard-budget-extend-button", children: [isExtending ? _jsx(Loader2, { className: "size-3.5 animate-spin" }) : null, isExtending ? "Extending…" : "Extend limit"] })) : null] }));
}
//# sourceMappingURL=ProjectBudgetBanner.js.map