@wealthx/shadcn 1.1.0 → 1.2.1

package/dist/chunk-SPJ5KXW7.mjs

@@ -0,0 +1,199 @@
+import {
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger
+} from "./chunk-JHJHG4GO.mjs";
+import {
+  Sheet,
+  SheetContent
+} from "./chunk-462HMNO4.mjs";
+import {
+  Spinner
+} from "./chunk-7YAU5CY6.mjs";
+import {
+  Button
+} from "./chunk-2I5S2AMY.mjs";
+
+// src/components/ui/financial-drawers.tsx
+import { X } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function SummaryReportDrawer({
+  open,
+  onOpenChange,
+  contactName = "Contact",
+  hasJointView = false,
+  viewMode = "individual",
+  onViewModeChange,
+  jointSubTab = "joint",
+  onJointSubTabChange,
+  jointMainUserName = "User A",
+  jointCoApplicantName = "User B",
+  onCreateJointView,
+  onRemoveJointView,
+  actionButtons,
+  alerts,
+  isLoading = false,
+  children
+}) {
+  return /* @__PURE__ */ jsx(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsx(
+    SheetContent,
+    {
+      side: "right",
+      showCloseButton: false,
+      className: "w-[min(1080px,90vw)] max-w-none p-0",
+      children: /* @__PURE__ */ jsxs("div", { className: "flex max-h-[100dvh] min-h-0 flex-1 flex-col overflow-hidden px-8 py-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "shrink-0 space-y-4", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2", children: hasJointView ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex gap-1", children: [
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      variant: viewMode === "individual" ? "default" : "outline",
+                      size: "sm",
+                      onClick: () => onViewModeChange == null ? void 0 : onViewModeChange("individual"),
+                      children: "Individual View"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    Button,
+                    {
+                      variant: viewMode === "joint" ? "default" : "outline",
+                      size: "sm",
+                      onClick: () => onViewModeChange == null ? void 0 : onViewModeChange("joint"),
+                      children: "Joint View"
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outline",
+                    size: "sm",
+                    onClick: onRemoveJointView,
+                    children: "Remove Joint View"
+                  }
+                )
+              ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsxs("span", { className: "text-label-medium text-foreground", children: [
+                  contactName,
+                  " View"
+                ] }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    variant: "outline",
+                    size: "sm",
+                    onClick: onCreateJointView,
+                    children: "Create Joint View"
+                  }
+                )
+              ] }) }),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  variant: "ghost",
+                  size: "icon-sm",
+                  onClick: () => onOpenChange(false),
+                  "aria-label": "Close drawer",
+                  children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+                }
+              )
+            ] }),
+            hasJointView && viewMode === "joint" && /* @__PURE__ */ jsx(
+              Tabs,
+              {
+                value: jointSubTab,
+                onValueChange: (v) => onJointSubTabChange == null ? void 0 : onJointSubTabChange(v),
+                children: /* @__PURE__ */ jsxs(TabsList, { children: [
+                  /* @__PURE__ */ jsx(TabsTrigger, { value: "joint", children: "Joint View" }),
+                  /* @__PURE__ */ jsxs(TabsTrigger, { value: "userA", children: [
+                    jointMainUserName,
+                    " View"
+                  ] }),
+                  /* @__PURE__ */ jsxs(TabsTrigger, { value: "userB", children: [
+                    jointCoApplicantName,
+                    " View"
+                  ] })
+                ] })
+              }
+            )
+          ] }),
+          !isLoading && actionButtons && /* @__PURE__ */ jsx("div", { children: actionButtons }),
+          !isLoading && alerts && /* @__PURE__ */ jsx("div", { children: alerts })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-y-auto overflow-x-hidden overscroll-contain [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "flex h-full min-h-[200px] items-center justify-center py-12", children: /* @__PURE__ */ jsx(Spinner, { size: "xl", className: "text-primary" }) }) : children })
+      ] })
+    }
+  ) });
+}
+var OPPORTUNITY_TABS = [
+  { value: "summary", label: "Summary" },
+  { value: "tasks", label: "Tasks" },
+  { value: "bankStatement", label: "Reports & Statements" },
+  { value: "policyAI", label: "Policy AI" },
+  { value: "runServicing", label: "Run Servicing" },
+  { value: "emailAndNotes", label: "Email & Notes" },
+  { value: "syncLoanApp", label: "Sync Loan App" }
+];
+function OpportunityDetailsDrawer({
+  open,
+  onOpenChange,
+  defaultTab = "summary",
+  tabs
+}) {
+  return /* @__PURE__ */ jsx(Sheet, { open, onOpenChange, children: /* @__PURE__ */ jsx(
+    SheetContent,
+    {
+      side: "right",
+      showCloseButton: false,
+      className: "w-[min(1048px,100vw)] max-w-none p-0",
+      children: /* @__PURE__ */ jsxs(Tabs, { defaultValue: defaultTab, className: "h-full gap-0", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex shrink-0 items-end border-b border-border", children: [
+          /* @__PURE__ */ jsx(
+            TabsList,
+            {
+              variant: "line",
+              className: "flex-1 group-data-[orientation=horizontal]/tabs:h-auto justify-start rounded-none bg-transparent p-0",
+              children: OPPORTUNITY_TABS.map((tab) => /* @__PURE__ */ jsx(
+                TabsTrigger,
+                {
+                  value: tab.value,
+                  className: "flex-none h-auto py-3 px-4 text-sm",
+                  children: tab.label
+                },
+                tab.value
+              ))
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "flex shrink-0 self-center items-center pr-3", children: /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon-sm",
+              onClick: () => onOpenChange(false),
+              "aria-label": "Close drawer",
+              children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-y-auto overscroll-contain [-ms-overflow-style:none] [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: OPPORTUNITY_TABS.map((tab) => /* @__PURE__ */ jsx(
+          TabsContent,
+          {
+            value: tab.value,
+            className: "mt-0 flex-none p-5 outline-none",
+            children: tabs == null ? void 0 : tabs[tab.value]
+          },
+          tab.value
+        )) })
+      ] })
+    }
+  ) });
+}
+
+export {
+  SummaryReportDrawer,
+  OpportunityDetailsDrawer
+};

package/dist/chunk-SWGT756Z.mjs

@@ -0,0 +1,210 @@
+import {
+  Skeleton
+} from "./chunk-D6ID6M4V.mjs";
+import {
+  ChartLegendItem,
+  ChartPeriodButton,
+  FALLBACK_TICK,
+  SEVERITY_COLORS,
+  formatCount,
+  formatMonthLabel,
+  formatTooltipDate
+} from "./chunk-FZIXGLMV.mjs";
+import {
+  Empty,
+  EmptyDescription
+} from "./chunk-NQPOYKAQ.mjs";
+import {
+  Card,
+  CardAction,
+  CardContent,
+  CardHeader,
+  CardTitle
+} from "./chunk-CLIN5525.mjs";
+import {
+  useThemeVars
+} from "./chunk-FEZKMUCF.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/backoffice-alert-history-chart.tsx
+import { useMemo, useState } from "react";
+import {
+  Chart as ChartJS,
+  CategoryScale,
+  LinearScale,
+  BarController,
+  BarElement,
+  Tooltip
+} from "chart.js";
+import { Chart } from "react-chartjs-2";
+import { jsx, jsxs } from "react/jsx-runtime";
+ChartJS.register(CategoryScale, LinearScale, BarController, BarElement, Tooltip);
+var ALERT_PERIODS = [3, 6, 12];
+var SLICE_COUNT = { 3: 3, 6: 6, 12: 12 };
+function ChartLegend() {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-x-3 gap-y-1.5 pb-2", children: [
+    /* @__PURE__ */ jsx(ChartLegendItem, { label: "High", color: SEVERITY_COLORS.high }),
+    /* @__PURE__ */ jsx(ChartLegendItem, { label: "Medium", color: SEVERITY_COLORS.medium }),
+    /* @__PURE__ */ jsx(ChartLegendItem, { label: "Low", color: SEVERITY_COLORS.low })
+  ] });
+}
+function BackofficeAlertHistoryChart({
+  chartData,
+  title = "Alert History",
+  showLegend = true,
+  legendPosition = "top",
+  showXAxis = true,
+  showYAxis = false,
+  defaultPeriod = 6,
+  height = 200,
+  width = "100%",
+  className,
+  isLoading = false
+}) {
+  const [period, setPeriod] = useState(defaultPeriod);
+  const themeVars = useThemeVars();
+  const fontFamily = themeVars["--font-sans"] || "Figtree, sans-serif";
+  const sliced = useMemo(() => {
+    if (!(chartData == null ? void 0 : chartData.length)) return null;
+    const count = Math.min(SLICE_COUNT[period], chartData.length);
+    return chartData.slice(chartData.length - count);
+  }, [chartData, period]);
+  const labels = useMemo(
+    () => {
+      var _a;
+      return (_a = sliced == null ? void 0 : sliced.map((p) => formatMonthLabel(p.date))) != null ? _a : [];
+    },
+    [sliced]
+  );
+  const data = useMemo(() => {
+    if (!sliced) return { labels: [], datasets: [] };
+    return {
+      labels,
+      datasets: [
+        {
+          label: "High",
+          data: sliced.map((p) => p.high),
+          backgroundColor: SEVERITY_COLORS.high,
+          borderWidth: 0,
+          stack: "alerts"
+        },
+        {
+          label: "Medium",
+          data: sliced.map((p) => p.medium),
+          backgroundColor: SEVERITY_COLORS.medium,
+          borderWidth: 0,
+          stack: "alerts"
+        },
+        {
+          label: "Low",
+          data: sliced.map((p) => p.low),
+          backgroundColor: SEVERITY_COLORS.low,
+          borderWidth: 0,
+          stack: "alerts"
+        }
+      ]
+    };
+  }, [sliced, labels]);
+  const options = useMemo(
+    () => ({
+      responsive: true,
+      maintainAspectRatio: false,
+      animation: { duration: 600, easing: "easeOutQuart" },
+      layout: { padding: 0 },
+      plugins: {
+        legend: { display: false },
+        tooltip: {
+          mode: "index",
+          intersect: false,
+          padding: 12,
+          cornerRadius: 0,
+          titleFont: { size: 11, weight: 600 },
+          bodyFont: { size: 12, weight: 500 },
+          callbacks: {
+            title: (tooltipItems) => {
+              var _a, _b, _c, _d;
+              const idx = (_a = tooltipItems[0]) == null ? void 0 : _a.dataIndex;
+              if (idx != null && ((_b = sliced == null ? void 0 : sliced[idx]) == null ? void 0 : _b.date)) {
+                return formatTooltipDate(sliced[idx].date, "monthly");
+              }
+              return (_d = (_c = tooltipItems[0]) == null ? void 0 : _c.label) != null ? _d : "";
+            },
+            label: (ctx) => {
+              const val = ctx.raw;
+              if (val === 0) return;
+              return ` ${ctx.dataset.label}: ${formatCount(val)}`;
+            }
+          }
+        }
+      },
+      scales: {
+        x: {
+          stacked: true,
+          display: showXAxis,
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            maxRotation: 0,
+            minRotation: 0,
+            color: FALLBACK_TICK,
+            font: { size: 10 }
+          }
+        },
+        y: {
+          stacked: true,
+          display: showYAxis,
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            padding: 8,
+            maxTicksLimit: 5,
+            color: FALLBACK_TICK,
+            font: { size: 10 },
+            callback: (v) => formatCount(Number(v))
+          }
+        }
+      }
+    }),
+    [showXAxis, showYAxis, sliced]
+  );
+  return /* @__PURE__ */ jsxs(
+    Card,
+    {
+      className: cn("w-full py-4 sm:py-6 gap-2", className),
+      style: { maxWidth: width, fontFamily },
+      children: [
+        /* @__PURE__ */ jsxs(CardHeader, { className: "px-3 sm:px-6", children: [
+          /* @__PURE__ */ jsx(CardTitle, { className: "text-sm sm:text-base", children: title }),
+          /* @__PURE__ */ jsx(CardAction, { children: /* @__PURE__ */ jsx("div", { className: "flex gap-0.5 sm:gap-1", children: ALERT_PERIODS.map((p) => /* @__PURE__ */ jsx(
+            ChartPeriodButton,
+            {
+              period: p,
+              active: period === p,
+              onClick: () => setPeriod(p)
+            },
+            p
+          )) }) })
+        ] }),
+        /* @__PURE__ */ jsx(CardContent, { className: "px-3 sm:px-6", children: isLoading ? /* @__PURE__ */ jsx(Skeleton, { style: { height, width: "100%" } }) : !sliced ? /* @__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(ChartLegend, {}),
+          /* @__PURE__ */ jsx("div", { style: { height, width: "100%", position: "relative" }, children: /* @__PURE__ */ jsx(
+            Chart,
+            {
+              type: "bar",
+              data,
+              options,
+              "aria-label": title
+            }
+          ) }),
+          showLegend && legendPosition === "bottom" && /* @__PURE__ */ jsx(ChartLegend, {})
+        ] }) })
+      ]
+    }
+  );
+}
+
+export {
+  BackofficeAlertHistoryChart
+};

package/dist/chunk-SYOD63OZ.mjs

@@ -0,0 +1,225 @@
+import {
+  ToggleGroup,
+  ToggleGroupItem
+} from "./chunk-PMB3A7V3.mjs";
+import {
+  DatePicker
+} from "./chunk-KUDCQ4FI.mjs";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger
+} from "./chunk-7PYJD5JI.mjs";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from "./chunk-XIRTEFKH.mjs";
+import {
+  Button
+} from "./chunk-2I5S2AMY.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/pipeline-dialogs.tsx
+import * as React from "react";
+import { addDays, startOfDay, format } from "date-fns";
+import { jsx, jsxs } from "react/jsx-runtime";
+function DeleteOpportunityDialog({
+  open,
+  loading = false,
+  onOpenChange,
+  onConfirm,
+  className
+}) {
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ jsxs(
+    DialogContent,
+    {
+      showCloseButton: !loading,
+      className: cn("max-w-sm", className),
+      children: [
+        /* @__PURE__ */ jsxs(DialogHeader, { children: [
+          /* @__PURE__ */ jsx(DialogTitle, { children: "Want to delete this card?" }),
+          /* @__PURE__ */ jsx(DialogDescription, { children: "Doing so will also remove all associated loan applications and tasks. This action cannot be undone." })
+        ] }),
+        /* @__PURE__ */ jsxs(DialogFooter, { children: [
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "outline",
+              onClick: () => onOpenChange(false),
+              disabled: loading,
+              children: "Cancel"
+            }
+          ),
+          /* @__PURE__ */ jsx(Button, { variant: "destructive", onClick: onConfirm, disabled: loading, children: loading ? "Deleting\u2026" : "Delete" })
+        ] })
+      ]
+    }
+  ) });
+}
+var PRIORITY_OPTIONS = [
+  { value: "auto", label: "Auto", color: "var(--color-muted-foreground)" },
+  { value: "low", label: "Low", color: "var(--color-success)" },
+  { value: "medium", label: "Medium", color: "var(--color-warning)" },
+  { value: "high", label: "High", color: "var(--color-destructive)" }
+];
+function ChangePriorityDialog({
+  open,
+  value,
+  loading = false,
+  onOpenChange,
+  onSave,
+  onSelectionChange,
+  className
+}) {
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: cn("max-w-sm", className), children: [
+    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Change priority" }) }),
+    /* @__PURE__ */ jsxs(
+      Select,
+      {
+        value,
+        onValueChange: (v) => onSelectionChange(v),
+        children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { className: "w-full", children: (() => {
+            const opt = PRIORITY_OPTIONS.find((o) => o.value === value);
+            return opt ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: "inline-block size-2 shrink-0 rounded-full",
+                  style: { backgroundColor: opt.color },
+                  "aria-hidden": "true"
+                }
+              ),
+              opt.label
+            ] }) : null;
+          })() }),
+          /* @__PURE__ */ jsx(SelectContent, { children: PRIORITY_OPTIONS.map((opt) => /* @__PURE__ */ jsx(SelectItem, { value: opt.value, children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx(
+              "span",
+              {
+                className: "inline-block size-2 shrink-0 rounded-full",
+                style: { backgroundColor: opt.color },
+                "aria-hidden": "true"
+              }
+            ),
+            opt.label
+          ] }) }, opt.value)) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => onOpenChange(false),
+          disabled: loading,
+          children: "Cancel"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { onClick: onSave, disabled: loading, children: loading ? "Saving\u2026" : "Save" })
+    ] })
+  ] }) });
+}
+var HOLD_OPTIONS = [
+  { value: "90", label: "90 Days" },
+  { value: "180", label: "180 Days" },
+  { value: "360", label: "360 Days" },
+  { value: "custom", label: "Custom" }
+];
+function PutOnHoldDialog({
+  open,
+  loading = false,
+  onOpenChange,
+  onSave,
+  className
+}) {
+  const [duration, setDuration] = React.useState("90");
+  const [customDate, setCustomDate] = React.useState();
+  const today = React.useMemo(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const resolvedDate = React.useMemo(() => {
+    if (duration === "custom") return customDate;
+    return addDays(today, parseInt(duration, 10));
+  }, [duration, customDate, today]);
+  const isValid = resolvedDate !== void 0 && resolvedDate >= today;
+  function handleSave() {
+    if (!resolvedDate) return;
+    onSave(format(resolvedDate, "yyyy-MM-dd"));
+  }
+  React.useEffect(() => {
+    if (open) {
+      setDuration("90");
+      setCustomDate(void 0);
+    }
+  }, [open]);
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { className: cn("max-w-sm", className), children: [
+    /* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: "Hold and Hide Until Later Date" }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4", children: [
+      /* @__PURE__ */ jsx(
+        ToggleGroup,
+        {
+          type: "single",
+          variant: "outline",
+          size: "sm",
+          value: [duration],
+          onValueChange: (v) => {
+            if (v.length) setDuration(v[0]);
+          },
+          className: "w-full",
+          children: HOLD_OPTIONS.map((opt) => /* @__PURE__ */ jsx(
+            ToggleGroupItem,
+            {
+              value: opt.value,
+              className: "flex-1",
+              children: opt.label
+            },
+            opt.value
+          ))
+        }
+      ),
+      duration === "custom" ? /* @__PURE__ */ jsx(
+        DatePicker,
+        {
+          value: customDate,
+          onChange: setCustomDate,
+          placeholder: "Pick a date",
+          calendarProps: { disabled: { before: today } }
+        }
+      ) : resolvedDate && /* @__PURE__ */ jsxs("div", { className: "flex h-9 items-center border border-input bg-muted/30 px-3 text-sm text-muted-foreground", children: [
+        "Hold until:",
+        " ",
+        /* @__PURE__ */ jsx("span", { className: "ml-1 font-medium text-foreground", children: format(resolvedDate, "dd MMM yyyy") })
+      ] }),
+      duration === "custom" && customDate && /* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground", children: [
+        "Hold until:",
+        " ",
+        /* @__PURE__ */ jsx("span", { className: "font-medium text-foreground", children: format(customDate, "dd MMM yyyy") })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: () => onOpenChange(false),
+          disabled: loading,
+          children: "Cancel"
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { onClick: handleSave, disabled: loading || !isValid, children: loading ? "Saving\u2026" : "Save" })
+    ] })
+  ] }) });
+}
+
+export {
+  DeleteOpportunityDialog,
+  ChangePriorityDialog,
+  PutOnHoldDialog
+};