@wealthx/shadcn 1.1.0 → 1.2.1

package/dist/chunk-4MN6UQHG.mjs

@@ -0,0 +1,443 @@
+import {
+  TaskCheckItem
+} from "./chunk-FMAXJ2SI.mjs";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from "./chunk-EFRENWEJ.mjs";
+import {
+  Badge
+} from "./chunk-WAZD7NFU.mjs";
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger
+} from "./chunk-MARPPFOJ.mjs";
+import {
+  Separator
+} from "./chunk-FH6QVUVZ.mjs";
+import {
+  Button,
+  buttonVariants
+} from "./chunk-2I5S2AMY.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/opportunity-card.tsx
+import {
+  Phone,
+  Mail,
+  User,
+  Users,
+  Calendar,
+  MoreVertical,
+  Clock,
+  ArrowRight,
+  Bot
+} from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var PRIORITY_COLORS = {
+  HIGH: "var(--color-destructive)",
+  MEDIUM: "var(--color-warning)",
+  LOW: "var(--color-success)",
+  NONE: "var(--color-muted-foreground)"
+};
+var PRIORITY_TEXT_COLORS = {
+  HIGH: "var(--color-destructive-text)",
+  MEDIUM: "var(--color-warning-text)",
+  LOW: "var(--color-success-text)",
+  NONE: "var(--color-muted-foreground)"
+};
+function resolvePriority(days, warningDays, priorityDays, priority) {
+  if (days === void 0) return priority;
+  if (priorityDays !== void 0 && days >= priorityDays) return "HIGH";
+  if (warningDays !== void 0 && days >= warningDays) return "MEDIUM";
+  if (warningDays !== void 0 || priorityDays !== void 0) return "LOW";
+  return priority;
+}
+function formatAmount(amount) {
+  return new Intl.NumberFormat("en-AU", {
+    style: "currency",
+    currency: "AUD",
+    maximumFractionDigits: 0
+  }).format(amount);
+}
+function formatDate(iso) {
+  try {
+    return new Date(iso).toLocaleDateString("en-AU", {
+      day: "2-digit",
+      month: "short",
+      year: "numeric"
+    });
+  } catch (e) {
+    return iso;
+  }
+}
+function formatHoldDate(iso) {
+  try {
+    return new Date(iso).toLocaleDateString("en-AU", {
+      day: "2-digit",
+      month: "short"
+    });
+  } catch (e) {
+    return iso;
+  }
+}
+function formatLoanType(type) {
+  return type.split("-").map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+}
+function OpportunityCard({
+  customerName,
+  customerPhone,
+  customerEmail,
+  additionalContacts,
+  loanType,
+  loanPurposeLabel,
+  amount,
+  date,
+  priority,
+  daysSinceColumnChanged,
+  warningDays,
+  priorityDays,
+  onHoldTo,
+  isModifyCompletedLoan,
+  tasks = [],
+  nextTask,
+  onViewDetails,
+  onTaskToggle,
+  onMarkAsDone,
+  onMoveToNextStage,
+  onLaunchAssistant,
+  onChangePriority,
+  onDelete,
+  onPutOnHold,
+  isSubmitting = false,
+  className
+}) {
+  const resolvedPriority = resolvePriority(
+    daysSinceColumnChanged,
+    warningDays,
+    priorityDays,
+    priority
+  );
+  const priorityColor = PRIORITY_COLORS[resolvedPriority];
+  const priorityTextColor = PRIORITY_TEXT_COLORS[resolvedPriority];
+  const completedCount = tasks.filter((t) => t.completed).length;
+  const hasTasks = tasks.length > 0;
+  const hasActions = onMarkAsDone || onMoveToNextStage;
+  const hasMenu = onViewDetails || onChangePriority || onPutOnHold || onDelete;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col gap-2 border border-border bg-background p-4 text-foreground shadow-sm",
+        isSubmitting && "opacity-60",
+        className
+      ),
+      "data-slot": "opportunity-card",
+      children: [
+        onHoldTo && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center gap-1.5 rounded border border-warning/30 bg-warning/10 px-2 py-1 text-xs font-medium",
+            style: { color: "var(--color-warning-text)" },
+            children: [
+              /* @__PURE__ */ jsx(Clock, { className: "size-3 shrink-0" }),
+              "On hold until ",
+              formatHoldDate(onHoldTo)
+            ]
+          }
+        ),
+        isModifyCompletedLoan && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex items-center gap-1.5 rounded border border-info/30 bg-info/10 px-2 py-1 text-xs font-medium",
+            style: { color: "var(--color-info-text)" },
+            children: "Modify completed loan"
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+            (loanPurposeLabel || loanType) && /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "self-start", children: loanPurposeLabel != null ? loanPurposeLabel : formatLoanType(loanType) }),
+            /* @__PURE__ */ jsx("span", { className: "text-base font-bold tabular-nums text-foreground", children: formatAmount(amount) })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 -mr-1 -mt-1", children: [
+            onLaunchAssistant && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: cn(
+                  buttonVariants({ variant: "ghost", size: "icon" }),
+                  "size-7 shrink-0"
+                ),
+                onClick: onLaunchAssistant,
+                "aria-label": "Launch AI Assistant",
+                title: "Launch AI Assistant",
+                children: /* @__PURE__ */ jsx(Bot, { className: "size-4" })
+              }
+            ),
+            hasMenu && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(
+                DropdownMenuTrigger,
+                {
+                  className: cn(
+                    buttonVariants({ variant: "ghost", size: "icon" }),
+                    "size-7 shrink-0"
+                  ),
+                  "aria-label": "Opportunity actions",
+                  children: /* @__PURE__ */ jsx(MoreVertical, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                onViewDetails && /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onViewDetails, children: "View details" }),
+                onChangePriority && /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onChangePriority, children: "Change priority" }),
+                onPutOnHold && /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onPutOnHold, children: "Put on hold" }),
+                onDelete && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                  /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onDelete, variant: "destructive", children: "Delete" })
+                ] })
+              ] })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-semibold text-foreground", children: customerName }),
+            additionalContacts && additionalContacts > 0 ? /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "shrink-0 gap-1", children: [
+              /* @__PURE__ */ jsx(Users, { className: "size-3", "aria-hidden": "true" }),
+              "Joint"
+            ] }) : /* @__PURE__ */ jsxs(Badge, { variant: "secondary", className: "shrink-0 gap-1", children: [
+              /* @__PURE__ */ jsx(User, { className: "size-3", "aria-hidden": "true" }),
+              "Individual"
+            ] })
+          ] }),
+          customerPhone && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(Phone, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+            customerPhone
+          ] }),
+          customerEmail && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(Mail, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+            /* @__PURE__ */ jsx("span", { className: "truncate", children: customerEmail })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+          /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+            /* @__PURE__ */ jsx(Calendar, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+            formatDate(date)
+          ] }),
+          /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5", children: [
+            daysSinceColumnChanged !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                Clock,
+                {
+                  className: "size-3 shrink-0",
+                  style: { color: priorityTextColor },
+                  "aria-hidden": "true"
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: "text-xs font-medium tabular-nums",
+                  style: { color: priorityTextColor },
+                  children: [
+                    daysSinceColumnChanged,
+                    "d"
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                role: "img",
+                className: "inline-block size-2 shrink-0 rounded-full",
+                style: { backgroundColor: priorityColor },
+                "aria-label": `Priority: ${resolvedPriority}`
+              }
+            )
+          ] })
+        ] }),
+        hasTasks && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "flex gap-0.5",
+              role: "progressbar",
+              "aria-valuenow": completedCount,
+              "aria-valuemin": 0,
+              "aria-valuemax": tasks.length,
+              "aria-label": `${completedCount} of ${tasks.length} tasks complete`,
+              children: tasks.map((t, i) => /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "h-[7px] flex-1",
+                    i < completedCount ? "bg-primary" : "bg-muted"
+                  )
+                },
+                t.id
+              ))
+            }
+          ),
+          /* @__PURE__ */ jsx(Accordion, { type: "single", collapsible: true, className: "-mx-4", children: /* @__PURE__ */ jsxs(AccordionItem, { value: "tasks", className: "border-0", children: [
+            /* @__PURE__ */ jsxs(AccordionTrigger, { className: "px-4 py-1.5 text-xs font-normal text-muted-foreground hover:no-underline hover:text-foreground [&>svg]:size-3.5", children: [
+              "Tasks (",
+              completedCount,
+              "/",
+              tasks.length,
+              ")"
+            ] }),
+            /* @__PURE__ */ jsx(AccordionContent, { className: "px-4", children: /* @__PURE__ */ jsx("div", { className: "flex flex-col", children: tasks.map((task) => /* @__PURE__ */ jsx(
+              TaskCheckItem,
+              {
+                title: task.title,
+                completed: task.completed,
+                aiAgentName: task.aiAgentName,
+                onToggle: onTaskToggle ? () => onTaskToggle(task.id) : void 0,
+                disabled: isSubmitting
+              },
+              task.id
+            )) }) })
+          ] }) }),
+          nextTask && /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-1.5 border border-primary/30 bg-primary/5 px-2 py-1.5 text-xs", children: [
+            /* @__PURE__ */ jsx(
+              ArrowRight,
+              {
+                className: "mt-0.5 size-3 shrink-0 text-primary",
+                "aria-hidden": "true"
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "font-medium", children: "Next:" }),
+            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: nextTask })
+          ] })
+        ] }),
+        hasActions && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Separator, {}),
+          (onMoveToNextStage || onMarkAsDone) && /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+            onMoveToNextStage && /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "outline",
+                size: "sm",
+                className: "flex-1 text-caption",
+                onClick: onMoveToNextStage,
+                disabled: isSubmitting,
+                children: "Move to next stage"
+              }
+            ),
+            onMarkAsDone && /* @__PURE__ */ jsx(
+              Button,
+              {
+                variant: "default",
+                size: "sm",
+                className: "flex-1 text-caption",
+                onClick: onMarkAsDone,
+                disabled: isSubmitting,
+                children: "Mark as done"
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+function LeadCard({
+  customerName,
+  customerPhone,
+  customerEmail,
+  onSendLoanApplication,
+  loanApplicationUrl,
+  onDelete,
+  isSubmitting = false,
+  className
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col gap-3 border border-border bg-background p-4 text-foreground shadow-sm",
+        isSubmitting && "opacity-60",
+        className
+      ),
+      "data-slot": "lead-card",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: customerName }),
+            customerPhone && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+              /* @__PURE__ */ jsx(Phone, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+              customerPhone
+            ] }),
+            customerEmail && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 text-xs text-muted-foreground", children: [
+              /* @__PURE__ */ jsx(Mail, { className: "size-3 shrink-0", "aria-hidden": "true" }),
+              /* @__PURE__ */ jsx("span", { className: "truncate", children: customerEmail })
+            ] })
+          ] }),
+          onDelete && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+            /* @__PURE__ */ jsx(
+              DropdownMenuTrigger,
+              {
+                className: cn(
+                  buttonVariants({ variant: "ghost", size: "icon" }),
+                  "-mr-1 -mt-1 size-7 shrink-0"
+                ),
+                "aria-label": "Lead actions",
+                children: /* @__PURE__ */ jsx(MoreVertical, { className: "size-4" })
+              }
+            ),
+            /* @__PURE__ */ jsx(DropdownMenuContent, { align: "end", children: /* @__PURE__ */ jsx(
+              DropdownMenuItem,
+              {
+                onClick: onDelete,
+                className: "text-destructive focus:text-destructive",
+                children: "Delete"
+              }
+            ) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx(Separator, {}),
+        onSendLoanApplication && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              size: "sm",
+              className: "w-full text-caption",
+              onClick: onSendLoanApplication,
+              disabled: isSubmitting,
+              children: "Send Loan Application Request"
+            }
+          ),
+          loanApplicationUrl && /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground", children: [
+            "Or the link below to fill out the loan application directly.",
+            /* @__PURE__ */ jsx("br", {}),
+            /* @__PURE__ */ jsx(
+              "a",
+              {
+                href: `https://${loanApplicationUrl.replace(/^https?:\/\//, "")}`,
+                target: "_blank",
+                rel: "noreferrer",
+                className: "text-primary underline-offset-2 hover:underline",
+                children: loanApplicationUrl
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+export {
+  OpportunityCard,
+  LeadCard
+};

package/dist/chunk-4Y6R4WEC.mjs

@@ -0,0 +1,250 @@
+import {
+  ChartLegendItem,
+  FALLBACK_BG,
+  FALLBACK_PRIMARY,
+  FALLBACK_TICK
+} from "./chunk-FZIXGLMV.mjs";
+import {
+  Empty,
+  EmptyDescription
+} from "./chunk-NQPOYKAQ.mjs";
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle
+} from "./chunk-CLIN5525.mjs";
+import {
+  Spinner
+} from "./chunk-7YAU5CY6.mjs";
+import {
+  useThemeVars
+} from "./chunk-FEZKMUCF.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/cash-balance-line-chart.tsx
+import { useMemo } from "react";
+import {
+  Chart as ChartJS,
+  CategoryScale,
+  LinearScale,
+  LineController,
+  LineElement,
+  PointElement,
+  Tooltip
+} from "chart.js";
+import { Chart } from "react-chartjs-2";
+import { jsx, jsxs } from "react/jsx-runtime";
+ChartJS.register(
+  CategoryScale,
+  LinearScale,
+  LineController,
+  LineElement,
+  PointElement,
+  Tooltip
+);
+function formatAbbrev(value) {
+  const abs = Math.abs(value);
+  const sign = value < 0 ? "-" : "";
+  if (abs >= 1e9)
+    return `${sign}$${(abs / 1e9).toFixed(1)}B`;
+  if (abs >= 1e6) return `${sign}$${(abs / 1e6).toFixed(1)}M`;
+  if (abs >= 1e3) return `${sign}$${(abs / 1e3).toFixed(1)}K`;
+  return `${sign}$${abs.toFixed(0)}`;
+}
+function formatBalanceFull(value) {
+  const abs = Math.abs(value);
+  const sign = value < 0 ? "-" : "";
+  return `${sign}$${abs.toLocaleString(void 0, {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  })}`;
+}
+function formatDateLabel(iso) {
+  const d = new Date(iso);
+  return d.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+}
+function formatDateTooltip(iso) {
+  const d = new Date(iso);
+  return d.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric"
+  });
+}
+function CashBalanceLineChart({
+  chartData,
+  title = "Cash Balance",
+  height = 200,
+  width = "100%",
+  className,
+  isLoading = false,
+  showXAxis = true,
+  showYAxis = true,
+  showBalanceValue = false,
+  showLegend = false,
+  legendPosition = "bottom"
+}) {
+  const themeVars = useThemeVars();
+  const brandPrimary = themeVars["--theme-primary"] || FALLBACK_PRIMARY;
+  const fontFamily = themeVars["--font-sans"] || "Figtree, sans-serif";
+  const hasData = Array.isArray(chartData) && chartData.length > 0;
+  const tickIndices = useMemo(() => {
+    if (!hasData) return /* @__PURE__ */ new Set();
+    const count = chartData.length;
+    const step = Math.max(1, Math.floor(count / 6));
+    const indices = /* @__PURE__ */ new Set();
+    for (let i = 0; i < count; i += step) indices.add(i);
+    indices.add(count - 1);
+    return indices;
+  }, [hasData, chartData]);
+  const data = useMemo(() => {
+    if (!hasData) return { labels: [], datasets: [] };
+    return {
+      labels: chartData.map((p) => p.x),
+      // raw ISO — used for tooltip + tick lookup
+      datasets: [
+        {
+          label: title,
+          data: chartData.map((p) => p.y),
+          fill: false,
+          borderColor: brandPrimary,
+          backgroundColor: "transparent",
+          borderWidth: 2.5,
+          tension: 0.4,
+          pointRadius: 0,
+          pointHoverRadius: 6,
+          pointHoverBackgroundColor: FALLBACK_BG,
+          pointHoverBorderColor: brandPrimary,
+          pointHoverBorderWidth: 3,
+          pointHitRadius: 10
+        }
+      ]
+    };
+  }, [hasData, chartData, brandPrimary, title]);
+  const options = useMemo(
+    () => ({
+      responsive: true,
+      maintainAspectRatio: false,
+      animation: { duration: 1200, easing: "easeOutQuart" },
+      plugins: {
+        legend: { display: false },
+        tooltip: {
+          enabled: true,
+          mode: "index",
+          intersect: false,
+          displayColors: false,
+          padding: 12,
+          cornerRadius: 0,
+          titleFont: { size: 11, weight: "600", family: fontFamily },
+          bodyFont: { size: 13, weight: "700", family: fontFamily },
+          callbacks: {
+            title: (items) => {
+              var _a;
+              const iso = (_a = items[0]) == null ? void 0 : _a.label;
+              return iso ? formatDateTooltip(iso) : "";
+            },
+            label: (ctx) => {
+              const val = ctx.parsed.y;
+              const formatted = Math.abs(val).toLocaleString(void 0, {
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2
+              });
+              return `$ ${formatted}`;
+            }
+          }
+        }
+      },
+      interaction: { mode: "index", intersect: false },
+      scales: {
+        x: {
+          type: "category",
+          display: showXAxis,
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            autoSkip: false,
+            maxRotation: 0,
+            minRotation: 0,
+            color: FALLBACK_TICK,
+            font: { size: 10, family: fontFamily },
+            callback: function(_, index) {
+              if (!tickIndices.has(index) || !chartData) return "";
+              return formatDateLabel(chartData[index].x);
+            }
+          }
+        },
+        y: {
+          display: showYAxis,
+          position: "left",
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            beginAtZero: false,
+            maxTicksLimit: 5,
+            padding: 8,
+            color: FALLBACK_TICK,
+            font: { size: 10, family: fontFamily },
+            callback: (v) => formatAbbrev(Number(v))
+          }
+        }
+      }
+    }),
+    [tickIndices, chartData, showXAxis, showYAxis, fontFamily]
+  );
+  const latestValue = hasData ? chartData[chartData.length - 1].y : null;
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: cn("w-full py-4 sm:py-6 gap-2", className),
+      style: { maxWidth: width, fontFamily },
+      children: [
+        /* @__PURE__ */ jsx(CardHeader, { className: "px-3 sm:px-6", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
+          /* @__PURE__ */ jsx(CardTitle, { className: "text-sm sm:text-base uppercase tracking-wider", children: title }),
+          showBalanceValue && latestValue !== null && /* @__PURE__ */ jsx("p", { className: "text-2xl font-bold tabular-nums leading-tight", children: formatBalanceFull(latestValue) })
+        ] }) }),
+        /* @__PURE__ */ jsx(CardContent, { className: "px-3 sm:px-6", children: isLoading ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "flex items-center justify-center text-muted-foreground",
+            style: { height, width: "100%" },
+            children: /* @__PURE__ */ jsx(Spinner, { size: "lg" })
+          }
+        ) : !hasData ? /* @__PURE__ */ jsx(Empty, { className: "flex-none p-4", style: { height }, children: /* @__PURE__ */ jsx(EmptyDescription, { children: "No data available" }) }) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
+          showLegend && legendPosition === "top" && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-x-4 gap-y-1.5", children: /* @__PURE__ */ jsx(
+            ChartLegendItem,
+            {
+              label: title,
+              color: brandPrimary,
+              lineStyle: "solid"
+            }
+          ) }),
+          /* @__PURE__ */ jsx("div", { style: { height, width: "100%", position: "relative" }, children: /* @__PURE__ */ jsx(
+            Chart,
+            {
+              type: "line",
+              data,
+              options,
+              "aria-label": title
+            },
+            brandPrimary
+          ) }),
+          showLegend && legendPosition === "bottom" && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-x-4 gap-y-1.5", children: /* @__PURE__ */ jsx(
+            ChartLegendItem,
+            {
+              label: title,
+              color: brandPrimary,
+              lineStyle: "solid"
+            }
+          ) })
+        ] }) })
+      ]
+    }
+  );
+}
+
+export {
+  CashBalanceLineChart
+};