@wealthx/shadcn 1.1.0 → 1.2.1

package/dist/chunk-TS2ZX2VS.mjs

@@ -0,0 +1,270 @@
+import {
+  Skeleton
+} from "./chunk-D6ID6M4V.mjs";
+import {
+  ChartLegendItem,
+  FALLBACK_BG,
+  FALLBACK_FOREGROUND,
+  FALLBACK_PRIMARY,
+  FALLBACK_TICK,
+  formatAbbrev
+} from "./chunk-FZIXGLMV.mjs";
+import {
+  Empty,
+  EmptyDescription
+} from "./chunk-NQPOYKAQ.mjs";
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle
+} from "./chunk-CLIN5525.mjs";
+import {
+  useThemeVars
+} from "./chunk-FEZKMUCF.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/borrowing-capacity-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 { Fragment, jsx, jsxs } from "react/jsx-runtime";
+ChartJS.register(
+  CategoryScale,
+  LinearScale,
+  LineController,
+  LineElement,
+  PointElement,
+  Tooltip
+);
+var SERIES_LABELS = {
+  "current-expenses": "Based on Current Expenses",
+  "optimised-estimate": "Optimised Estimate",
+  "desired-loan-amount": "Desired Loan Amount"
+};
+var SERIES_LINE_STYLE = {
+  "current-expenses": "solid",
+  "optimised-estimate": "dashed",
+  "desired-loan-amount": "dashed"
+};
+var SERIES_BORDER_WIDTH = {
+  "current-expenses": 2,
+  "optimised-estimate": 1.5,
+  "desired-loan-amount": 2
+};
+var SERIES_RENDER_ORDER = [
+  "desired-loan-amount",
+  "optimised-estimate",
+  "current-expenses"
+];
+var SERIES_LEGEND_ORDER = [
+  "current-expenses",
+  "optimised-estimate",
+  "desired-loan-amount"
+];
+var DASH_PATTERN = [6, 4];
+function formatCurrencyFull(dollars) {
+  return new Intl.NumberFormat("en-AU", {
+    style: "currency",
+    currency: "AUD",
+    maximumFractionDigits: 0
+  }).format(dollars);
+}
+function formatDateLabel(iso) {
+  const d = /* @__PURE__ */ new Date(`${iso.slice(0, 7)}-01T00:00:00`);
+  return d.toLocaleDateString("en-US", { month: "short", year: "2-digit" });
+}
+function formatDateTooltip(iso) {
+  const d = /* @__PURE__ */ new Date(`${iso.slice(0, 7)}-01T00:00:00`);
+  return d.toLocaleDateString("en-US", { month: "short", year: "numeric" });
+}
+function BorrowingCapacityLineChart({
+  series,
+  title = "Borrowing Capacity",
+  kpiValue,
+  height = 280,
+  width = "100%",
+  className,
+  isLoading = false,
+  showXAxis = true,
+  showYAxis = true,
+  showLegend = true,
+  legendPosition = "bottom"
+}) {
+  const themeVars = useThemeVars();
+  const brandPrimary = themeVars["--theme-primary"] || FALLBACK_PRIMARY;
+  const fontFamily = themeVars["--font-sans"] || "Figtree, sans-serif";
+  const seriesColor = useMemo(
+    () => ({
+      "current-expenses": FALLBACK_FOREGROUND,
+      "optimised-estimate": FALLBACK_TICK,
+      // desired-loan-amount tracks tenant brand; no alpha conversion needed at 1.0
+      "desired-loan-amount": brandPrimary
+    }),
+    [brandPrimary]
+  );
+  const orderedSeries = useMemo(() => {
+    if (!(series == null ? void 0 : series.length)) return [];
+    return SERIES_RENDER_ORDER.map(
+      (t) => series.find((s) => s.type === t)
+    ).filter((s) => !!s && s.data.length > 0);
+  }, [series]);
+  const hasData = orderedSeries.length > 0;
+  const labels = useMemo(() => {
+    var _a;
+    if (!orderedSeries.length) return [];
+    const primary = (_a = orderedSeries.find((s) => s.type === "current-expenses")) != null ? _a : orderedSeries[0];
+    return primary.data.map((p) => p.date);
+  }, [orderedSeries]);
+  const chartData = useMemo(() => {
+    if (!orderedSeries.length) return { labels: [], datasets: [] };
+    return {
+      labels,
+      datasets: orderedSeries.map((s) => {
+        const color = seriesColor[s.type];
+        const isDashed = SERIES_LINE_STYLE[s.type] === "dashed";
+        return {
+          label: SERIES_LABELS[s.type],
+          data: s.data.map((p) => p.amountCents / 100),
+          borderColor: color,
+          backgroundColor: "transparent",
+          borderWidth: SERIES_BORDER_WIDTH[s.type],
+          borderDash: isDashed ? DASH_PATTERN : [],
+          tension: s.type === "current-expenses" ? 0.4 : 0,
+          pointRadius: 0,
+          pointHoverRadius: s.type === "desired-loan-amount" ? 0 : 5,
+          pointHoverBackgroundColor: FALLBACK_BG,
+          pointHoverBorderColor: color,
+          pointHoverBorderWidth: 2,
+          pointHitRadius: 12
+        };
+      })
+    };
+  }, [labels, orderedSeries, seriesColor]);
+  const options = useMemo(
+    () => ({
+      responsive: true,
+      maintainAspectRatio: false,
+      animation: { duration: 800, easing: "easeOutQuart" },
+      plugins: {
+        legend: { display: false },
+        tooltip: {
+          enabled: true,
+          mode: "index",
+          intersect: false,
+          filter: (item) => item.dataset.label !== SERIES_LABELS["desired-loan-amount"],
+          displayColors: true,
+          boxWidth: 10,
+          boxHeight: 2,
+          padding: 12,
+          cornerRadius: 0,
+          titleFont: { size: 11, weight: 600, family: fontFamily },
+          bodyFont: { size: 12, weight: 500, family: fontFamily },
+          callbacks: {
+            title: (items) => {
+              var _a;
+              const iso = (_a = items[0]) == null ? void 0 : _a.label;
+              return iso ? formatDateTooltip(iso) : "";
+            },
+            label: (ctx) => {
+              var _a;
+              const dollars = (_a = ctx.parsed.y) != null ? _a : 0;
+              return ` ${ctx.dataset.label}: ${formatCurrencyFull(dollars)}`;
+            }
+          }
+        }
+      },
+      interaction: { mode: "index", intersect: false },
+      scales: {
+        x: {
+          type: "category",
+          display: showXAxis,
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            autoSkip: true,
+            maxTicksLimit: 7,
+            maxRotation: 0,
+            minRotation: 0,
+            color: FALLBACK_TICK,
+            font: { size: 10, family: fontFamily },
+            callback: function(_, index) {
+              const iso = labels[index];
+              return iso ? formatDateLabel(iso) : "";
+            }
+          }
+        },
+        y: {
+          display: showYAxis,
+          position: "left",
+          grid: { display: false },
+          border: { display: false },
+          ticks: {
+            maxTicksLimit: 6,
+            padding: 8,
+            color: FALLBACK_TICK,
+            font: { size: 10, family: fontFamily },
+            callback: (v) => formatAbbrev(Number(v))
+          }
+        }
+      }
+    }),
+    [showXAxis, showYAxis, labels, fontFamily]
+  );
+  const legendEl = useMemo(() => {
+    if (!showLegend || !hasData) return null;
+    const items = SERIES_LEGEND_ORDER.map(
+      (t) => orderedSeries.find((s) => s.type === t)
+    ).filter((s) => !!s);
+    return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-x-4 gap-y-1.5", children: items.map((s) => /* @__PURE__ */ jsx(
+      ChartLegendItem,
+      {
+        label: SERIES_LABELS[s.type],
+        color: seriesColor[s.type],
+        lineStyle: SERIES_LINE_STYLE[s.type]
+      },
+      s.type
+    )) });
+  }, [showLegend, hasData, orderedSeries, seriesColor]);
+  const legendWrapper = legendEl ? /* @__PURE__ */ jsx("div", { className: legendPosition === "top" ? "mb-3" : "mt-3", children: legendEl }) : 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 items-start justify-between gap-4", children: [
+          /* @__PURE__ */ jsx(CardTitle, { className: "text-sm sm:text-base uppercase tracking-wider", children: title }),
+          kpiValue != null && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-xl font-bold tabular-nums", children: formatCurrencyFull(kpiValue / 100) })
+        ] }) }),
+        /* @__PURE__ */ jsx(CardContent, { className: "px-3 sm:px-6", children: isLoading ? /* @__PURE__ */ jsx(Skeleton, { style: { height, width: "100%" } }) : !hasData ? /* @__PURE__ */ jsx(Empty, { className: "flex-none p-4", style: { height }, children: /* @__PURE__ */ jsx(EmptyDescription, { children: "No borrowing capacity data available" }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          legendPosition === "top" && legendWrapper,
+          /* @__PURE__ */ jsx("div", { style: { height, width: "100%", position: "relative" }, children: /* @__PURE__ */ jsx(
+            Chart,
+            {
+              type: "line",
+              data: chartData,
+              options,
+              "aria-label": title
+            }
+          ) }),
+          legendPosition === "bottom" && legendWrapper
+        ] }) })
+      ]
+    }
+  );
+}
+
+export {
+  BorrowingCapacityLineChart
+};

package/dist/chunk-UFYSFDER.mjs

@@ -0,0 +1,42 @@
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+
+// src/components/ui/pipeline-alerts.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var PRIORITY_ROWS = [
+  { key: "high", label: "High", dotColor: "var(--color-destructive)" },
+  { key: "medium", label: "Medium", dotColor: "var(--color-warning)" },
+  { key: "low", label: "Low", dotColor: "var(--color-primary)" }
+];
+function PipelineAlerts({ counts, className }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex flex-col gap-2 border border-border bg-background px-4 py-3",
+        className
+      ),
+      "data-slot": "pipeline-alerts",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-foreground", children: "Pipeline Alerts" }),
+        /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1.5", children: PRIORITY_ROWS.map(({ key, label, dotColor }) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "size-2 shrink-0 rounded-full",
+              style: { backgroundColor: dotColor },
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "flex-1 text-xs text-muted-foreground", children: label }),
+          /* @__PURE__ */ jsx("span", { className: "min-w-[1.5rem] text-right text-xs font-medium tabular-nums text-foreground", children: counts[key] })
+        ] }, key)) })
+      ]
+    }
+  );
+}
+
+export {
+  PipelineAlerts
+};

package/dist/chunk-VACKZOMY.mjs

@@ -0,0 +1,190 @@
+import {
+  LeadCard,
+  OpportunityCard
+} from "./chunk-4MN6UQHG.mjs";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from "./chunk-EFRENWEJ.mjs";
+import {
+  Badge
+} from "./chunk-WAZD7NFU.mjs";
+import {
+  Spinner
+} from "./chunk-7YAU5CY6.mjs";
+import {
+  buttonVariants
+} from "./chunk-2I5S2AMY.mjs";
+import {
+  useThemeVars
+} from "./chunk-FEZKMUCF.mjs";
+import {
+  cn
+} from "./chunk-VLQZANBF.mjs";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-FWCSY2DS.mjs";
+
+// src/components/ui/kanban-column.tsx
+import { MoreVertical } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function formatTotalValue(value) {
+  return new Intl.NumberFormat("en-AU", {
+    style: "currency",
+    currency: "AUD",
+    maximumFractionDigits: 0
+  }).format(value);
+}
+function growthColor(growth) {
+  return growth > 0 ? "var(--color-success-text)" : "var(--color-destructive-text)";
+}
+function KanbanColumn({
+  stage,
+  opportunities,
+  isDragging = false,
+  isDropTarget = false,
+  isDefault = false,
+  isLoading = false,
+  isLoadingMore = false,
+  hasMore = false,
+  loaderRef,
+  onEditColumn,
+  onDeleteColumn,
+  onTaskToggle,
+  onMarkAsDone,
+  onMoveToNextStage,
+  onSendLoanApplication,
+  onViewDetails,
+  onChangePriority,
+  onLaunchAssistant,
+  onPutOnHold,
+  onDeleteOpportunity,
+  submittingOpportunityId,
+  className
+}) {
+  var _a;
+  const themeVars = useThemeVars();
+  const accentColor = (_a = stage.accentColor) != null ? _a : "var(--color-border)";
+  const hasMenu = onEditColumn || !isDefault && onDeleteColumn;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex w-[292px] shrink-0 flex-col bg-muted/40",
+        isDragging && "opacity-50",
+        isDropTarget && "ring-2 ring-primary ring-inset",
+        className
+      ),
+      style: __spreadProps(__spreadValues({}, themeVars), {
+        borderTop: `2px solid ${accentColor}`
+      }),
+      "data-slot": "kanban-column",
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 border-b border-border bg-background px-3 py-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs("h2", { className: "text-sm font-semibold text-foreground", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: stage.count }),
+              " ",
+              stage.name
+            ] }),
+            hasMenu && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(
+                DropdownMenuTrigger,
+                {
+                  className: cn(
+                    buttonVariants({ variant: "ghost", size: "icon" }),
+                    "-mr-1 size-7 shrink-0"
+                  ),
+                  "aria-label": "Column actions",
+                  children: /* @__PURE__ */ jsx(MoreVertical, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                onEditColumn && /* @__PURE__ */ jsx(DropdownMenuItem, { onClick: onEditColumn, children: "Edit column settings" }),
+                !isDefault && onDeleteColumn && /* @__PURE__ */ jsxs(Fragment, { children: [
+                  onEditColumn && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                  /* @__PURE__ */ jsx(
+                    DropdownMenuItem,
+                    {
+                      onClick: onDeleteColumn,
+                      className: "text-destructive focus:text-destructive",
+                      children: "Delete column"
+                    }
+                  )
+                ] })
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+            stage.growth != null ? /* @__PURE__ */ jsxs(
+              Badge,
+              {
+                variant: "outline",
+                style: { color: growthColor(stage.growth) },
+                children: [
+                  stage.growth > 0 ? "+" : "",
+                  stage.growth
+                ]
+              }
+            ) : /* @__PURE__ */ jsx("span", {}),
+            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium tabular-nums text-muted-foreground", children: formatTotalValue(stage.totalValue) })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-2 overflow-y-auto p-2", children: [
+          isDropTarget && /* @__PURE__ */ jsxs("div", { className: "border border-dashed border-primary/40 bg-primary/5 px-3 py-2 text-center text-xs text-primary", children: [
+            "Drop here \u2192 ",
+            stage.name
+          ] }),
+          isLoading ? /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ jsx(Spinner, { className: "size-5 text-muted-foreground" }) }) : opportunities.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: "No opportunities in this stage" }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            opportunities.map(
+              (opp) => onSendLoanApplication ? /* @__PURE__ */ jsx(
+                LeadCard,
+                {
+                  id: opp.id,
+                  customerName: opp.customerName,
+                  customerPhone: opp.customerPhone,
+                  customerEmail: opp.customerEmail,
+                  loanApplicationUrl: opp.loanApplicationUrl,
+                  onSendLoanApplication: () => onSendLoanApplication(opp.id),
+                  onDelete: onDeleteOpportunity ? () => onDeleteOpportunity(opp.id) : void 0,
+                  isSubmitting: submittingOpportunityId === opp.id
+                },
+                opp.id
+              ) : /* @__PURE__ */ jsx(
+                OpportunityCard,
+                __spreadProps(__spreadValues({}, opp), {
+                  onTaskToggle: onTaskToggle ? (taskId) => onTaskToggle(opp.id, taskId) : void 0,
+                  onMarkAsDone: onMarkAsDone ? () => onMarkAsDone(opp.id) : void 0,
+                  onMoveToNextStage: onMoveToNextStage ? () => onMoveToNextStage(opp.id) : void 0,
+                  onViewDetails: onViewDetails ? () => onViewDetails(opp.id) : void 0,
+                  onChangePriority: onChangePriority ? () => onChangePriority(opp.id) : void 0,
+                  onLaunchAssistant: onLaunchAssistant ? () => onLaunchAssistant(opp.id) : void 0,
+                  onPutOnHold: onPutOnHold ? () => onPutOnHold(opp.id) : void 0,
+                  onDelete: onDeleteOpportunity ? () => onDeleteOpportunity(opp.id) : void 0,
+                  isSubmitting: submittingOpportunityId === opp.id
+                }),
+                opp.id
+              )
+            ),
+            hasMore && /* @__PURE__ */ jsx(
+              "div",
+              {
+                ref: loaderRef,
+                className: "flex min-h-[50px] items-center justify-center",
+                children: isLoadingMore && /* @__PURE__ */ jsx(Spinner, { className: "size-5 text-muted-foreground" })
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+export {
+  KanbanColumn
+};

package/dist/chunk-VLQZANBF.mjs

@@ -0,0 +1,42 @@
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { extendTailwindMerge } from "tailwind-merge";
+var twMerge = extendTailwindMerge({
+  extend: {
+    classGroups: {
+      "font-size": [
+        {
+          text: [
+            "display-large",
+            "display-medium",
+            "display-small",
+            "h1",
+            "h2",
+            "h3",
+            "h4",
+            "h5",
+            "h6",
+            "body-large",
+            "body-medium",
+            "body-small",
+            "label-large",
+            "label-medium",
+            "label-small",
+            "button",
+            "button-xs",
+            "caption",
+            "overline",
+            "code"
+          ]
+        }
+      ]
+    }
+  }
+});
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+export {
+  cn
+};