@wealthx/shadcn 1.5.15 → 1.5.16

package/dist/components/ui/pipeline-board.js

@@ -1488,11 +1488,66 @@ function LeadCard({
   );
 }
 
-// src/components/ui/kanban-column.tsx
+// src/components/ui/tooltip.tsx
+var import_tooltip = require("@base-ui/react/tooltip");
 var import_jsx_runtime16 = require("react/jsx-runtime");
-function formatTotalValue(value) {
-  return formatCurrency(value);
+function TooltipProvider(_a) {
+  var _b = _a, {
+    delay = 0
+  } = _b, props = __objRest(_b, [
+    "delay"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    import_tooltip.Tooltip.Provider,
+    __spreadValues({
+      "data-slot": "tooltip-provider",
+      delay
+    }, props)
+  );
+}
+function Tooltip(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_tooltip.Tooltip.Root, __spreadValues({ "data-slot": "tooltip" }, props));
+}
+function TooltipTrigger(_a) {
+  var props = __objRest(_a, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_tooltip.Tooltip.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
+}
+function TooltipContent(_a) {
+  var _b = _a, {
+    className,
+    sideOffset = 8,
+    side,
+    children,
+    style
+  } = _b, props = __objRest(_b, [
+    "className",
+    "sideOffset",
+    "side",
+    "children",
+    "style"
+  ]);
+  const themeVars = useThemeVars();
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_tooltip.Tooltip.Positioner, { sideOffset, side, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+    import_tooltip.Tooltip.Popup,
+    __spreadProps(__spreadValues({
+      className: cn(
+        "relative z-50 w-fit animate-in overflow-visible bg-brand-secondary px-3 py-1.5 text-caption text-balance text-brand-secondary-foreground fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards",
+        className
+      ),
+      "data-slot": "tooltip-content",
+      style: __spreadValues(__spreadValues({}, themeVars), style)
+    }, props), {
+      children: [
+        children,
+        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 rotate-45 bg-brand-secondary data-[side=bottom]:-top-1 data-[side=left]:-right-1 data-[side=right]:-left-1 data-[side=top]:-bottom-1" })
+      ]
+    })
+  ) }) });
 }
+
+// src/components/ui/kanban-column.tsx
+var import_jsx_runtime17 = require("react/jsx-runtime");
 function growthColor(growth) {
   return growth > 0 ? "var(--color-success-text)" : "var(--color-destructive-text)";
 }
@@ -1508,6 +1563,7 @@ function KanbanColumn({
   loaderRef,
   onEditColumn,
   onDeleteColumn,
+  onAddLead,
   onTaskToggle,
   onMarkAsDone,
   onMoveToNextStage,
@@ -1544,7 +1600,7 @@ function KanbanColumn({
     const cardId = e.dataTransfer.getData("text/plain");
     if (cardId) onCardDrop(cardId);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "div",
     {
       className: cn(
@@ -1558,43 +1614,67 @@ function KanbanColumn({
       }),
       "data-slot": "kanban-column",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex flex-col gap-2 border-b border-border bg-background px-3 py-3", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("h2", { className: "text-sm font-semibold text-foreground", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-muted-foreground", children: stage.count }),
-              " ",
-              stage.name
-            ] }),
-            hasMenu && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(DropdownMenu, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-                DropdownMenuTrigger,
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex flex-col gap-2 border-b border-border bg-background px-3 py-3", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("h2", { className: "text-sm font-semibold text-foreground", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                "span",
                 {
-                  className: cn(
-                    buttonVariants({ variant: "ghost", size: "icon" }),
-                    "-mr-1 size-7 shrink-0"
-                  ),
-                  "aria-label": "Column actions",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_lucide_react7.MoreVertical, { className: "size-4" })
+                  className: cn(!stage.countColor && "text-muted-foreground"),
+                  style: stage.countColor ? { color: stage.countColor } : void 0,
+                  children: stage.count
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(DropdownMenuContent, { align: "end", children: [
-                onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DropdownMenuItem, { onClick: onEditColumn, children: "Edit column settings" }),
-                !isDefault && onDeleteColumn && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
-                  onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(DropdownMenuSeparator, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-                    DropdownMenuItem,
-                    {
-                      onClick: onDeleteColumn,
-                      className: "text-destructive focus:text-destructive",
-                      children: "Delete column"
-                    }
-                  )
+              " ",
+              stage.name
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center gap-0.5", children: [
+              onAddLead && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(Tooltip, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                  "button",
+                  {
+                    className: cn(
+                      buttonVariants({ variant: "ghost", size: "icon" }),
+                      "size-7 shrink-0"
+                    ),
+                    onClick: onAddLead,
+                    "aria-label": "Add lead",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react7.Plus, { className: "size-4" })
+                  }
+                ) }),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TooltipContent, { children: "Add lead" })
+              ] }) }),
+              hasMenu && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(DropdownMenu, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                  DropdownMenuTrigger,
+                  {
+                    className: cn(
+                      buttonVariants({ variant: "ghost", size: "icon" }),
+                      "-mr-1 size-7 shrink-0"
+                    ),
+                    "aria-label": "Column actions",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react7.MoreVertical, { className: "size-4" })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(DropdownMenuContent, { align: "end", children: [
+                  onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuItem, { onClick: onEditColumn, children: "Edit column settings" }),
+                  !isDefault && onDeleteColumn && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
+                    onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DropdownMenuSeparator, {}),
+                    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+                      DropdownMenuItem,
+                      {
+                        onClick: onDeleteColumn,
+                        className: "text-destructive focus:text-destructive",
+                        children: "Delete column"
+                      }
+                    )
+                  ] })
                 ] })
               ] })
             ] })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-            stage.growth != null ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+            stage.growth != null ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
               Badge,
               {
                 variant: "outline",
@@ -1604,11 +1684,11 @@ function KanbanColumn({
                   stage.growth
                 ]
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", {}),
-            /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "text-xs font-medium tabular-nums text-muted-foreground", children: formatTotalValue(stage.totalValue) })
+            ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", {}),
+            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "text-sm font-bold tabular-nums text-foreground", children: formatCurrency(stage.totalValue) })
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
           "div",
           {
             className: cn(
@@ -1619,13 +1699,13 @@ function KanbanColumn({
             onDragLeave: handleDragLeave,
             onDrop: handleDrop,
             children: [
-              (isDropTarget || isDragOver) && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "border border-dashed border-primary/40 bg-primary/5 px-3 py-2 text-center text-xs text-primary", children: [
+              (isDropTarget || isDragOver) && /* @__PURE__ */ (0, import_jsx_runtime17.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__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Spinner, { className: "size-5 text-muted-foreground" }) }) : opportunities.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: "text-xs text-muted-foreground", children: "No opportunities in this stage" }) }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+              isLoading ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { className: "size-5 text-muted-foreground" }) }) : opportunities.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-1 items-center justify-center py-8", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "text-xs text-muted-foreground", children: "No opportunities in this stage" }) }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
                 opportunities.map(
-                  (opp) => onSendLoanApplication ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                  (opp) => onSendLoanApplication ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                     LeadCard,
                     {
                       id: opp.id,
@@ -1638,7 +1718,7 @@ function KanbanColumn({
                       isSubmitting: submittingOpportunityId === opp.id
                     },
                     opp.id
-                  ) : /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                     OpportunityCard,
                     __spreadProps(__spreadValues({}, opp), {
                       draggable: !!onCardDrop,
@@ -1659,12 +1739,12 @@ function KanbanColumn({
                     opp.id
                   )
                 ),
-                hasMore && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+                hasMore && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
                   "div",
                   {
                     ref: loaderRef,
                     className: "flex min-h-[50px] items-center justify-center",
-                    children: isLoadingMore && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Spinner, { className: "size-5 text-muted-foreground" })
+                    children: isLoadingMore && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Spinner, { className: "size-5 text-muted-foreground" })
                   }
                 )
               ] })
@@ -1677,7 +1757,7 @@ function KanbanColumn({
 }
 
 // src/components/ui/pipeline-board.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function Toolbar({
   searchValue,
   onSearchChange,
@@ -1686,10 +1766,10 @@ function Toolbar({
   onFilterChange,
   onRefresh
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex flex-wrap items-center gap-3 border-b border-border bg-background px-4 py-3", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "relative w-56 shrink-0", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react8.Search, { className: "absolute left-2.5 top-1/2 size-3.5 -translate-y-1/2 text-muted-foreground" }),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-wrap items-center gap-3 border-b border-border bg-background px-4 py-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "relative w-56 shrink-0", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.Search, { className: "absolute left-2.5 top-1/2 size-3.5 -translate-y-1/2 text-muted-foreground" }),
+      /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         Input,
         {
           placeholder: "Search opportunities\u2026",
@@ -1698,7 +1778,7 @@ function Toolbar({
           className: "h-8 pl-8 text-sm"
         }
       ),
-      searchValue && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      searchValue && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
         Button,
         {
           type: "button",
@@ -1707,11 +1787,11 @@ function Toolbar({
           onClick: () => onSearchChange(""),
           className: "absolute right-2 top-1/2 size-6 -translate-y-1/2 text-muted-foreground hover:text-foreground",
           "aria-label": "Clear search",
-          children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react8.X, { className: "size-3.5" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.X, { className: "size-3.5" })
         }
       )
     ] }),
-    filterOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    filterOptions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       ToggleGroup,
       {
         type: "multiple",
@@ -1724,10 +1804,10 @@ function Toolbar({
           const toggled = (_a = newValues.find((v) => !activeFilters.includes(v))) != null ? _a : activeFilters.find((v) => !newValues.includes(v));
           if (toggled) onFilterChange(toggled);
         },
-        children: filterOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ToggleGroupItem, { value: option, children: option }, option))
+        children: filterOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(ToggleGroupItem, { value: option, children: option }, option))
       }
     ),
-    onRefresh && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    onRefresh && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
       Button,
       {
         type: "button",
@@ -1736,7 +1816,7 @@ function Toolbar({
         onClick: onRefresh,
         className: "ml-auto text-muted-foreground hover:text-foreground",
         "aria-label": "Refresh board",
-        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_lucide_react8.RefreshCw, { className: "size-4" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_lucide_react8.RefreshCw, { className: "size-4" })
       }
     )
   ] });
@@ -1764,13 +1844,44 @@ function PipelineBoard({
   className
 }) {
   const hasToolbar = onSearchChange || filterOptions.length > 0 && onFilterChange;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+  const pinnedCols = columns.filter((c) => c.isPinned);
+  const scrollableCols = columns.filter((c) => !c.isPinned);
+  const renderColumn = (col) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    KanbanColumn,
+    {
+      stage: col.stage,
+      opportunities: col.opportunities,
+      isDragging: col.isDragging,
+      isDropTarget: col.isDropTarget,
+      isDefault: col.isDefault,
+      isLoading: col.isLoading,
+      isLoadingMore: col.isLoadingMore,
+      hasMore: col.hasMore,
+      loaderRef: col.loaderRef,
+      onEditColumn: !col.isPinned && onEditColumn ? () => onEditColumn(col.stage.id) : void 0,
+      onDeleteColumn: onDeleteColumn && !col.isDefault && !col.isPinned ? () => onDeleteColumn(col.stage.id) : void 0,
+      onCardDrop: onMoveCard ? (cardId) => onMoveCard(cardId, col.key) : void 0,
+      onCardClick,
+      onTaskToggle,
+      onMarkAsDone,
+      onMoveToNextStage,
+      onSendLoanApplication: col.onSendLoanApplication,
+      onViewDetails,
+      onChangePriority,
+      onPutOnHold,
+      onDeleteOpportunity,
+      onAddLead: col.onAddLead,
+      submittingOpportunityId
+    },
+    col.key
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
     "div",
     {
       className: cn("flex h-full flex-col bg-muted/20", className),
       "data-slot": "pipeline-board",
       children: [
-        hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+        hasToolbar && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
           Toolbar,
           {
             searchValue,
@@ -1783,36 +1894,12 @@ function PipelineBoard({
             onRefresh
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex flex-1 gap-3 overflow-x-auto p-4", children: [
-          columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            KanbanColumn,
-            {
-              stage: col.stage,
-              opportunities: col.opportunities,
-              isDragging: col.isDragging,
-              isDropTarget: col.isDropTarget,
-              isDefault: col.isDefault,
-              isLoading: col.isLoading,
-              isLoadingMore: col.isLoadingMore,
-              hasMore: col.hasMore,
-              loaderRef: col.loaderRef,
-              onEditColumn: onEditColumn ? () => onEditColumn(col.stage.id) : void 0,
-              onDeleteColumn: onDeleteColumn && !col.isDefault ? () => onDeleteColumn(col.stage.id) : void 0,
-              onCardDrop: onMoveCard ? (cardId) => onMoveCard(cardId, col.key) : void 0,
-              onCardClick,
-              onTaskToggle,
-              onMarkAsDone,
-              onMoveToNextStage,
-              onSendLoanApplication: col.onSendLoanApplication,
-              onViewDetails,
-              onChangePriority,
-              onPutOnHold,
-              onDeleteOpportunity,
-              submittingOpportunityId
-            },
-            col.key
-          )),
-          columns.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("p", { className: "text-sm text-muted-foreground", children: "No columns to display." }) })
+        /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-1 overflow-hidden", children: [
+          pinnedCols.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex shrink-0 gap-3 border-r border-border p-4", children: pinnedCols.map(renderColumn) }),
+          /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-1 gap-3 overflow-x-auto p-4", children: [
+            scrollableCols.map(renderColumn),
+            columns.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("p", { className: "text-sm text-muted-foreground", children: "No columns to display." }) })
+          ] })
         ] })
       ]
     }

package/dist/components/ui/pipeline-board.mjs

@@ -1,13 +1,14 @@
 import {
   PipelineBoard
-} from "../../chunk-ZA44WICP.mjs";
-import "../../chunk-AKWN5ZQG.mjs";
+} from "../../chunk-FGHM34AV.mjs";
+import "../../chunk-A43XIVO6.mjs";
 import "../../chunk-YV7XF32X.mjs";
 import "../../chunk-EXI64H46.mjs";
 import "../../chunk-JPGL36WQ.mjs";
 import "../../chunk-IKXYTCSB.mjs";
 import "../../chunk-JVMXMFBB.mjs";
 import "../../chunk-PNSYFE3K.mjs";
+import "../../chunk-3S6KVFF5.mjs";
 import "../../chunk-H5DTKPJ2.mjs";
 import "../../chunk-2GIYVERS.mjs";
 import "../../chunk-X6RC5UWB.mjs";

package/dist/index.js

@@ -19393,9 +19393,6 @@ function LeadCard({
 
 // src/components/ui/kanban-column.tsx
 var import_jsx_runtime96 = require("react/jsx-runtime");
-function formatTotalValue(value) {
-  return formatCurrency(value);
-}
 function growthColor(growth) {
   return growth > 0 ? "var(--color-success-text)" : "var(--color-destructive-text)";
 }
@@ -19411,6 +19408,7 @@ function KanbanColumn({
   loaderRef,
   onEditColumn,
   onDeleteColumn,
+  onAddLead,
   onTaskToggle,
   onMarkAsDone,
   onMoveToNextStage,
@@ -19464,34 +19462,58 @@ function KanbanColumn({
         /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "flex flex-col gap-2 border-b border-border bg-background px-3 py-3", children: [
           /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
             /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("h2", { className: "text-sm font-semibold text-foreground", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("span", { className: "text-muted-foreground", children: stage.count }),
-              " ",
-              stage.name
-            ] }),
-            hasMenu && /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(DropdownMenu, { children: [
               /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-                DropdownMenuTrigger,
+                "span",
                 {
-                  className: cn(
-                    buttonVariants({ variant: "ghost", size: "icon" }),
-                    "-mr-1 size-7 shrink-0"
-                  ),
-                  "aria-label": "Column actions",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_lucide_react53.MoreVertical, { className: "size-4" })
+                  className: cn(!stage.countColor && "text-muted-foreground"),
+                  style: stage.countColor ? { color: stage.countColor } : void 0,
+                  children: stage.count
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(DropdownMenuContent, { align: "end", children: [
-                onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(DropdownMenuItem, { onClick: onEditColumn, children: "Edit column settings" }),
-                !isDefault && onDeleteColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(import_jsx_runtime96.Fragment, { children: [
-                  onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(DropdownMenuSeparator, {}),
-                  /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
-                    DropdownMenuItem,
-                    {
-                      onClick: onDeleteColumn,
-                      className: "text-destructive focus:text-destructive",
-                      children: "Delete column"
-                    }
-                  )
+              " ",
+              stage.name
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)("div", { className: "flex items-center gap-0.5", children: [
+              onAddLead && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(Tooltip, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+                  "button",
+                  {
+                    className: cn(
+                      buttonVariants({ variant: "ghost", size: "icon" }),
+                      "size-7 shrink-0"
+                    ),
+                    onClick: onAddLead,
+                    "aria-label": "Add lead",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_lucide_react53.Plus, { className: "size-4" })
+                  }
+                ) }),
+                /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(TooltipContent, { children: "Add lead" })
+              ] }) }),
+              hasMenu && /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(DropdownMenu, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+                  DropdownMenuTrigger,
+                  {
+                    className: cn(
+                      buttonVariants({ variant: "ghost", size: "icon" }),
+                      "-mr-1 size-7 shrink-0"
+                    ),
+                    "aria-label": "Column actions",
+                    children: /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(import_lucide_react53.MoreVertical, { className: "size-4" })
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(DropdownMenuContent, { align: "end", children: [
+                  onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(DropdownMenuItem, { onClick: onEditColumn, children: "Edit column settings" }),
+                  !isDefault && onDeleteColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(import_jsx_runtime96.Fragment, { children: [
+                    onEditColumn && /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(DropdownMenuSeparator, {}),
+                    /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+                      DropdownMenuItem,
+                      {
+                        onClick: onDeleteColumn,
+                        className: "text-destructive focus:text-destructive",
+                        children: "Delete column"
+                      }
+                    )
+                  ] })
                 ] })
               ] })
             ] })
@@ -19508,7 +19530,7 @@ function KanbanColumn({
                 ]
               }
             ) : /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("span", {}),
-            /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("span", { className: "text-xs font-medium tabular-nums text-muted-foreground", children: formatTotalValue(stage.totalValue) })
+            /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("span", { className: "text-sm font-bold tabular-nums text-foreground", children: formatCurrency(stage.totalValue) })
           ] })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
@@ -23193,6 +23215,37 @@ function PipelineBoard({
   className
 }) {
   const hasToolbar = onSearchChange || filterOptions.length > 0 && onFilterChange;
+  const pinnedCols = columns.filter((c) => c.isPinned);
+  const scrollableCols = columns.filter((c) => !c.isPinned);
+  const renderColumn = (col) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
+    KanbanColumn,
+    {
+      stage: col.stage,
+      opportunities: col.opportunities,
+      isDragging: col.isDragging,
+      isDropTarget: col.isDropTarget,
+      isDefault: col.isDefault,
+      isLoading: col.isLoading,
+      isLoadingMore: col.isLoadingMore,
+      hasMore: col.hasMore,
+      loaderRef: col.loaderRef,
+      onEditColumn: !col.isPinned && onEditColumn ? () => onEditColumn(col.stage.id) : void 0,
+      onDeleteColumn: onDeleteColumn && !col.isDefault && !col.isPinned ? () => onDeleteColumn(col.stage.id) : void 0,
+      onCardDrop: onMoveCard ? (cardId) => onMoveCard(cardId, col.key) : void 0,
+      onCardClick,
+      onTaskToggle,
+      onMarkAsDone,
+      onMoveToNextStage,
+      onSendLoanApplication: col.onSendLoanApplication,
+      onViewDetails,
+      onChangePriority,
+      onPutOnHold,
+      onDeleteOpportunity,
+      onAddLead: col.onAddLead,
+      submittingOpportunityId
+    },
+    col.key
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)(
     "div",
     {
@@ -23212,36 +23265,12 @@ function PipelineBoard({
             onRefresh
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex flex-1 gap-3 overflow-x-auto p-4", children: [
-          columns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
-            KanbanColumn,
-            {
-              stage: col.stage,
-              opportunities: col.opportunities,
-              isDragging: col.isDragging,
-              isDropTarget: col.isDropTarget,
-              isDefault: col.isDefault,
-              isLoading: col.isLoading,
-              isLoadingMore: col.isLoadingMore,
-              hasMore: col.hasMore,
-              loaderRef: col.loaderRef,
-              onEditColumn: onEditColumn ? () => onEditColumn(col.stage.id) : void 0,
-              onDeleteColumn: onDeleteColumn && !col.isDefault ? () => onDeleteColumn(col.stage.id) : void 0,
-              onCardDrop: onMoveCard ? (cardId) => onMoveCard(cardId, col.key) : void 0,
-              onCardClick,
-              onTaskToggle,
-              onMarkAsDone,
-              onMoveToNextStage,
-              onSendLoanApplication: col.onSendLoanApplication,
-              onViewDetails,
-              onChangePriority,
-              onPutOnHold,
-              onDeleteOpportunity,
-              submittingOpportunityId
-            },
-            col.key
-          )),
-          columns.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "text-sm text-muted-foreground", children: "No columns to display." }) })
+        /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex flex-1 overflow-hidden", children: [
+          pinnedCols.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "flex shrink-0 gap-3 border-r border-border p-4", children: pinnedCols.map(renderColumn) }),
+          /* @__PURE__ */ (0, import_jsx_runtime103.jsxs)("div", { className: "flex flex-1 gap-3 overflow-x-auto p-4", children: [
+            scrollableCols.map(renderColumn),
+            columns.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime103.jsx)("p", { className: "text-sm text-muted-foreground", children: "No columns to display." }) })
+          ] })
         ] })
       ]
     }

package/dist/index.mjs

@@ -71,7 +71,7 @@ import {
 } from "./chunk-KFH36NKF.mjs";
 import {
   PipelineBoard
-} from "./chunk-ZA44WICP.mjs";
+} from "./chunk-FGHM34AV.mjs";
 import {
   PipelineChart
 } from "./chunk-PCULNQWA.mjs";
@@ -117,7 +117,7 @@ import {
 } from "./chunk-PUJ42INK.mjs";
 import {
   KanbanColumn
-} from "./chunk-AKWN5ZQG.mjs";
+} from "./chunk-A43XIVO6.mjs";
 import {
   LeadCard,
   OpportunityCard

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wealthx/shadcn",
-  "version": "1.5.15",
+  "version": "1.5.16",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./src/index.ts",