@wealthx/shadcn 1.1.0 → 1.2.0

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
+};

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
+};