@wealthx/shadcn 1.2.2 → 1.3.0

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

@@ -180,10 +180,10 @@ var buttonVariants = (0, import_class_variance_authority.cva)(
         default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
         secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
         destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
-        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground focus-visible:ring-border/50 dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
         "outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
         "outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:ring-brand-secondary/30",
-        ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs dark:hover:bg-accent/50",
+        ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs focus-visible:ring-border/50 dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline"
       },
       size: {
@@ -272,38 +272,65 @@ function DialogOverlay(_a) {
     }, props)
   );
 }
+var DIALOG_MAX_WIDTHS = {
+  sm: "24rem",
+  md: "28rem",
+  lg: "32rem",
+  xl: "36rem",
+  "2xl": "42rem",
+  "3xl": "48rem",
+  "4xl": "56rem",
+  full: "100%"
+};
+var DIALOG_AUTO_MIN_WIDTH = "20rem";
 function DialogContent(_a) {
   var _b = _a, {
     className,
     children,
     showCloseButton = true,
-    style
+    style,
+    container,
+    align = "center",
+    size = "lg",
+    minWidth
   } = _b, props = __objRest(_b, [
     "className",
     "children",
     "showCloseButton",
-    "style"
+    "style",
+    "container",
+    "align",
+    "size",
+    "minWidth"
   ]);
   const themeVars = useThemeVars();
-  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(DialogPortal, { children: [
+  const isAuto = size === "auto";
+  const sizeStyle = isAuto ? { minWidth: minWidth != null ? minWidth : DIALOG_AUTO_MIN_WIDTH } : { maxWidth: DIALOG_MAX_WIDTHS[size] };
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(DialogPortal, { container: container != null ? container : void 0, children: [
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DialogOverlay, { style: themeVars }),
     /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
       import_dialog.Dialog.Popup,
       __spreadProps(__spreadValues({
         className: cn(
-          // WealthX: removed rounded-lg (sharp corners), shadow-lg (flat panels), foreground/50 scrim via DialogOverlay
-          "fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 duration-200 outline-none data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 sm:max-w-lg",
+          // WealthX: removed rounded-lg (sharp corners), shadow-lg (flat panels)
+          // max-w-[calc(100%-2rem)] acts as a viewport-edge guard on all sizes.
+          // Fixed max-width is applied via inline style (sizeStyle) to avoid
+          // Tailwind v4 class-scanning gaps with dynamic class lookups.
+          "fixed left-[50%] z-50 grid max-w-[calc(100%-2rem)] translate-x-[-50%] gap-4 border bg-background p-6 duration-200 outline-none data-ending-style:animate-out data-ending-style:fade-out-0 data-ending-style:zoom-out-95 data-ending-style:fill-mode-forwards data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95",
+          // "auto" → hug content (with min-width floor); fixed sizes → fill to max-width
+          isAuto ? "w-auto" : "w-full",
+          align === "center" ? "top-[50%] translate-y-[-50%]" : "top-4 translate-y-0",
           className
         ),
         "data-slot": "dialog-content",
-        style: __spreadValues(__spreadValues({}, themeVars), style)
+        style: __spreadValues(__spreadValues(__spreadValues({}, themeVars), sizeStyle), style)
       }, props), {
         children: [
           children,
           showCloseButton ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
             import_dialog.Dialog.Close,
             {
-              className: "absolute top-4 right-4 transition-colors hover:bg-foreground/5 focus:outline-hidden focus:ring-2 focus:ring-border focus:ring-offset-0 disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+              className: "absolute top-4 right-4 inline-flex size-7 items-center justify-center transition-colors hover:bg-foreground/5 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-border focus-visible:ring-offset-0 disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
               "data-slot": "dialog-close",
               children: [
                 /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react2.XIcon, {}),
@@ -356,6 +383,7 @@ function DialogFooter(_a) {
           import_dialog.Dialog.Close,
           {
             className: cn(buttonVariants({ variant: "outline" })),
+            type: "button",
             children: "Close"
           }
         ) : null
@@ -644,11 +672,30 @@ var React5 = __toESM(require("react"));
 var import_date_fns = require("date-fns");
 var import_lucide_react5 = require("lucide-react");
 
+// src/components/ui/input.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function Input(_a) {
+  var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    "input",
+    __spreadValues({
+      className: cn(
+        "h-9 w-full min-w-0 border border-input bg-transparent px-3 py-1 text-body-medium font-sans shadow-xs transition-[color,box-shadow] outline-none selection:bg-primary selection:text-primary-foreground file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-label-medium file:text-foreground placeholder:font-normal placeholder:text-muted-foreground disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 dark:bg-input/30",
+        "focus-visible:border-primary focus-visible:ring-[3px] focus-visible:ring-primary/20",
+        "aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
+        className
+      ),
+      "data-slot": "input",
+      type
+    }, props)
+  );
+}
+
 // src/components/ui/calendar.tsx
 var React4 = __toESM(require("react"));
 var import_lucide_react4 = require("lucide-react");
 var import_react_day_picker = require("react-day-picker");
-var import_jsx_runtime7 = require("react/jsx-runtime");
+var import_jsx_runtime8 = require("react/jsx-runtime");
 function CalendarRoot(_a) {
   var _b = _a, {
     className,
@@ -657,7 +704,7 @@ function CalendarRoot(_a) {
     "className",
     "rootRef"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "div",
     __spreadValues({
       className: cn(className),
@@ -675,12 +722,12 @@ function CalendarChevron(_a) {
     "orientation"
   ]);
   if (orientation === "left") {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react4.ChevronLeftIcon, __spreadValues({ className: cn("size-4", className) }, props));
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.ChevronLeftIcon, __spreadValues({ className: cn("size-4", className) }, props));
   }
   if (orientation === "right") {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react4.ChevronRightIcon, __spreadValues({ className: cn("size-4", className) }, props));
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.ChevronRightIcon, __spreadValues({ className: cn("size-4", className) }, props));
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_lucide_react4.ChevronDownIcon, __spreadValues({ className: cn("size-4", className) }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react4.ChevronDownIcon, __spreadValues({ className: cn("size-4", className) }, props));
 }
 function CalendarWeekNumber(_a) {
   var _b = _a, {
@@ -688,7 +735,7 @@ function CalendarWeekNumber(_a) {
   } = _b, props = __objRest(_b, [
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("td", __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) }));
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("td", __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) }));
 }
 function Calendar(_a) {
   var _b = _a, {
@@ -709,7 +756,7 @@ function Calendar(_a) {
     "components"
   ]);
   const defaultClassNames = (0, import_react_day_picker.getDefaultClassNames)();
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     import_react_day_picker.DayPicker,
     __spreadValues({
       captionLayout,
@@ -824,7 +871,7 @@ function CalendarDayButton(_a) {
     if (modifiers.focused) (_a2 = ref.current) == null ? void 0 : _a2.focus();
   }, [modifiers.focused]);
   const selectedSingle = modifiers.selected && !modifiers.range_start && !modifiers.range_end ? !modifiers.range_middle : null;
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     Button,
     __spreadValues({
       className: cn(
@@ -846,14 +893,14 @@ function CalendarDayButton(_a) {
 
 // src/components/ui/popover.tsx
 var import_popover = require("@base-ui/react/popover");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_jsx_runtime9 = require("react/jsx-runtime");
 function Popover(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_popover.Popover.Root, __spreadValues({ "data-slot": "popover" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_popover.Popover.Root, __spreadValues({ "data-slot": "popover" }, props));
 }
 function PopoverTrigger(_a) {
   var props = __objRest(_a, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_popover.Popover.Trigger, __spreadValues({ "data-slot": "popover-trigger" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_popover.Popover.Trigger, __spreadValues({ "data-slot": "popover-trigger" }, props));
 }
 function PopoverContent(_a) {
   var _b = _a, {
@@ -868,13 +915,13 @@ function PopoverContent(_a) {
     "style"
   ]);
   const themeVars = useThemeVars();
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_popover.Popover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_popover.Popover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
     import_popover.Popover.Positioner,
     {
       className: "z-[200]",
       align,
       sideOffset,
-      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
         import_popover.Popover.Popup,
         __spreadValues({
           className: cn(
@@ -890,7 +937,7 @@ function PopoverContent(_a) {
 }
 
 // src/components/ui/date-picker.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function DatePicker({
   value,
   onChange,
@@ -925,15 +972,17 @@ function DatePicker({
   } else if (value) {
     displayValue = (0, import_date_fns.format)(value, "dd/MM/yyyy");
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(Popover, { onOpenChange: disabled ? void 0 : setOpen, open, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(Popover, { onOpenChange: disabled ? void 0 : setOpen, open, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
       PopoverTrigger,
       {
-        render: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        render: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
           Button,
           {
             className: cn(
               "w-full justify-start rounded-none font-normal data-[empty=true]:text-muted-foreground",
+              // Show open/focus state when the popover is expanded
+              "aria-expanded:border-ring aria-expanded:ring-2 aria-expanded:ring-ring/20",
               className
             ),
             "data-empty": !value,
@@ -943,18 +992,18 @@ function DatePicker({
           }
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_lucide_react5.CalendarIcon, {}),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_lucide_react5.CalendarIcon, {}),
           value ? displayValue : placeholder
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
       PopoverContent,
       {
         align: "start",
         className: "w-auto rounded-none p-0 shadow-sm",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
             Calendar,
             __spreadProps(__spreadValues({
               captionLayout: "dropdown",
@@ -968,12 +1017,12 @@ function DatePicker({
               )
             })
           ),
-          showTimePicker ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "border-t border-border px-3 pb-3 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("label", { className: "mb-1.5 block text-xs font-medium text-muted-foreground", children: [
+          showTimePicker ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "border-t border-border px-3 pb-3 pt-2", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("label", { className: "mb-1.5 block text-xs font-medium text-muted-foreground", children: [
             "Time",
-            /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-              "input",
+            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              Input,
               {
-                className: "mt-1.5 h-8 w-full rounded-none border border-input bg-transparent px-2 text-sm font-sans outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50",
+                className: "mt-1.5 h-8",
                 onChange: handleTimeChange,
                 type: "time",
                 value: timeValue
@@ -987,7 +1036,7 @@ function DatePicker({
 }
 
 // src/components/ui/pipeline-dialogs.tsx
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_jsx_runtime11 = require("react/jsx-runtime");
 function DeleteOpportunityDialog({
   open,
   loading = false,
@@ -995,18 +1044,18 @@ function DeleteOpportunityDialog({
   onConfirm,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
     DialogContent,
     {
       showCloseButton: !loading,
       className: cn("max-w-sm", className),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogHeader, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogTitle, { children: "Want to delete this card?" }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogDescription, { children: "Doing so will also remove all associated loan applications and tasks. This action cannot be undone." })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogHeader, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogTitle, { children: "Want to delete this card?" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogDescription, { children: "Doing so will also remove all associated loan applications and tasks. This action cannot be undone." })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogFooter, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogFooter, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
             Button,
             {
               variant: "outline",
@@ -1015,7 +1064,7 @@ function DeleteOpportunityDialog({
               children: "Cancel"
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Button, { variant: "destructive", onClick: onConfirm, disabled: loading, children: loading ? "Deleting\u2026" : "Delete" })
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { variant: "destructive", onClick: onConfirm, disabled: loading, children: loading ? "Deleting\u2026" : "Delete" })
         ] })
       ]
     }
@@ -1036,18 +1085,18 @@ function ChangePriorityDialog({
   onSelectionChange,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogContent, { className: cn("max-w-sm", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogTitle, { children: "Change priority" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogContent, { className: cn("max-w-sm", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogTitle, { children: "Change priority" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
       Select,
       {
         value,
         onValueChange: (v) => onSelectionChange(v),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SelectTrigger, { className: "w-full", children: (() => {
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SelectTrigger, { className: "w-full", children: (() => {
             const opt = PRIORITY_OPTIONS.find((o) => o.value === value);
-            return opt ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+            return opt ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
                 "span",
                 {
                   className: "inline-block size-2 shrink-0 rounded-full",
@@ -1058,8 +1107,8 @@ function ChangePriorityDialog({
               opt.label
             ] }) : null;
           })() }),
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SelectContent, { children: PRIORITY_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(SelectItem, { value: opt.value, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("span", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SelectContent, { children: PRIORITY_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(SelectItem, { value: opt.value, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("span", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
               "span",
               {
                 className: "inline-block size-2 shrink-0 rounded-full",
@@ -1072,8 +1121,8 @@ function ChangePriorityDialog({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogFooter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         Button,
         {
           variant: "outline",
@@ -1082,7 +1131,7 @@ function ChangePriorityDialog({
           children: "Cancel"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Button, { onClick: onSave, disabled: loading, children: loading ? "Saving\u2026" : "Save" })
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { onClick: onSave, disabled: loading, children: loading ? "Saving\u2026" : "Save" })
     ] })
   ] }) });
 }
@@ -1117,10 +1166,10 @@ function PutOnHoldDialog({
       setCustomDate(void 0);
     }
   }, [open]);
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogContent, { className: cn("max-w-sm", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogTitle, { children: "Hold and Hide Until Later Date" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col gap-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Dialog, { open, onOpenChange: loading ? void 0 : onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogContent, { className: cn("max-w-sm", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogTitle, { children: "Hold and Hide Until Later Date" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "flex flex-col gap-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         ToggleGroup,
         {
           type: "single",
@@ -1131,7 +1180,7 @@ function PutOnHoldDialog({
             if (v.length) setDuration(v[0]);
           },
           className: "w-full",
-          children: HOLD_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          children: HOLD_OPTIONS.map((opt) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
             ToggleGroupItem,
             {
               value: opt.value,
@@ -1142,7 +1191,7 @@ function PutOnHoldDialog({
           ))
         }
       ),
-      duration === "custom" ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      duration === "custom" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         DatePicker,
         {
           value: customDate,
@@ -1150,19 +1199,19 @@ function PutOnHoldDialog({
           placeholder: "Pick a date",
           calendarProps: { disabled: { before: today } }
         }
-      ) : resolvedDate && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex h-9 items-center border border-input bg-muted/30 px-3 text-sm text-muted-foreground", children: [
+      ) : resolvedDate && /* @__PURE__ */ (0, import_jsx_runtime11.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__ */ (0, import_jsx_runtime10.jsx)("span", { className: "ml-1 font-medium text-foreground", children: (0, import_date_fns2.format)(resolvedDate, "dd MMM yyyy") })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "ml-1 font-medium text-foreground", children: (0, import_date_fns2.format)(resolvedDate, "dd MMM yyyy") })
       ] }),
-      duration === "custom" && customDate && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("p", { className: "text-sm text-muted-foreground", children: [
+      duration === "custom" && customDate && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("p", { className: "text-sm text-muted-foreground", children: [
         "Hold until:",
         " ",
-        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "font-medium text-foreground", children: (0, import_date_fns2.format)(customDate, "dd MMM yyyy") })
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "font-medium text-foreground", children: (0, import_date_fns2.format)(customDate, "dd MMM yyyy") })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(DialogFooter, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(DialogFooter, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
         Button,
         {
           variant: "outline",
@@ -1171,7 +1220,7 @@ function PutOnHoldDialog({
           children: "Cancel"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Button, { onClick: handleSave, disabled: loading || !isValid, children: loading ? "Saving\u2026" : "Save" })
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Button, { onClick: handleSave, disabled: loading || !isValid, children: loading ? "Saving\u2026" : "Save" })
     ] })
   ] }) });
 }

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

@@ -2,15 +2,16 @@ import {
   ChangePriorityDialog,
   DeleteOpportunityDialog,
   PutOnHoldDialog
-} from "../../chunk-VGSESELX.mjs";
+} from "../../chunk-5FQIKDKP.mjs";
+import "../../chunk-DUJTAXMH.mjs";
+import "../../chunk-3GF7OVTP.mjs";
 import "../../chunk-EI5F6FMT.mjs";
 import "../../chunk-BDYZCBRT.mjs";
-import "../../chunk-5MEWU56Z.mjs";
-import "../../chunk-P6AM5V7O.mjs";
-import "../../chunk-3GF7OVTP.mjs";
+import "../../chunk-OODBHKG7.mjs";
 import "../../chunk-7PYJD5JI.mjs";
-import "../../chunk-XIRTEFKH.mjs";
-import "../../chunk-2I5S2AMY.mjs";
+import "../../chunk-GYMYRIZP.mjs";
+import "../../chunk-6DZEXFNB.mjs";
+import "../../chunk-XREGSKX3.mjs";
 import "../../chunk-DBHJ5KC3.mjs";
 import "../../chunk-FEZKMUCF.mjs";
 import "../../chunk-QOJ2DQD6.mjs";

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

@@ -159,12 +159,12 @@ var badgeVariants = (0, import_class_variance_authority.cva)(
   {
     variants: {
       variant: {
-        default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-        secondary: "bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
-        destructive: "bg-destructive text-destructive-foreground focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90",
-        success: "bg-success text-success-foreground [a&]:hover:bg-success/90",
-        warning: "bg-warning text-warning-foreground [a&]:hover:bg-warning/90",
-        info: "bg-info text-info-foreground [a&]:hover:bg-info/90",
+        default: "border-primary/40 bg-primary/10 text-foreground [a&]:hover:bg-primary/15",
+        secondary: "border-border bg-muted text-muted-foreground [a&]:hover:bg-muted/80",
+        destructive: "border-destructive/40 bg-destructive/10 text-destructive-text focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/15",
+        success: "border-success/40 bg-success/10 text-success-text [a&]:hover:bg-success/15",
+        warning: "border-warning/40 bg-warning/10 text-warning-text [a&]:hover:bg-warning/15",
+        info: "border-info/40 bg-info/10 text-info-text [a&]:hover:bg-info/15",
         outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
         ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
         link: "text-primary underline-offset-4 [a&]:hover:underline"

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

@@ -1,7 +1,7 @@
 import {
   TaskCheckItem
-} from "../../chunk-FMAXJ2SI.mjs";
-import "../../chunk-WAZD7NFU.mjs";
+} from "../../chunk-MBON7YRJ.mjs";
+import "../../chunk-BKNFWEH2.mjs";
 import "../../chunk-RGVKLTLH.mjs";
 import "../../chunk-DBHJ5KC3.mjs";
 import "../../chunk-VLQZANBF.mjs";

package/dist/components/ui/property-cashflow-doughnut-chart.js

@@ -134,7 +134,7 @@ function CardHeader(_a) {
     "div",
     __spreadValues({
       className: cn(
-        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
+        "@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-center gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6",
         className
       ),
       "data-slot": "card-header"
@@ -285,10 +285,10 @@ var buttonVariants = (0, import_class_variance_authority2.cva)(
         default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
         secondary: "bg-brand-secondary text-brand-secondary-foreground shadow-xs hover:bg-brand-secondary/80 focus-visible:ring-brand-secondary/30",
         destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40",
-        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        outline: "border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground focus-visible:ring-border/50 dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
         "outline-primary": "border border-primary text-foreground bg-transparent shadow-xs hover:bg-primary/5 focus-visible:ring-primary/50",
         "outline-secondary": "border border-brand-secondary text-brand-secondary bg-transparent shadow-xs hover:bg-brand-secondary/10 focus-visible:ring-brand-secondary/30",
-        ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs dark:hover:bg-accent/50",
+        ghost: "hover:bg-accent hover:text-accent-foreground hover:shadow-xs focus-visible:ring-border/50 dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline"
       },
       size: {
@@ -349,11 +349,8 @@ var Button = (0, import_react2.forwardRef)(function Button2(_a, ref) {
   );
 });
 
-// src/components/ui/chart-shared.tsx
-var import_jsx_runtime6 = require("react/jsx-runtime");
-var FALLBACK_PRIMARY = "#33FF99";
-var FALLBACK_SECONDARY = "#162029";
-function formatAbbrev(value) {
+// src/lib/format-currency.ts
+function formatCurrencyAbbrev(value) {
   const abs = Math.abs(value);
   const sign = value < 0 ? "-" : "";
   if (abs >= 1e9)
@@ -362,6 +359,11 @@ function formatAbbrev(value) {
   if (abs >= 1e3) return `${sign}$${(abs / 1e3).toFixed(0)}K`;
   return `${sign}$${abs.toFixed(0)}`;
 }
+
+// src/components/ui/chart-shared.tsx
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var FALLBACK_PRIMARY = "#33FF99";
+var FALLBACK_SECONDARY = "#162029";
 function DoughnutLegendRow({
   label,
   color,
@@ -385,7 +387,7 @@ function DoughnutLegendRow({
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] text-muted-foreground leading-none truncate", children: label })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "flex items-center gap-2 shrink-0", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] font-medium leading-none", children: formatAbbrev(value) }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] font-medium leading-none", children: formatCurrencyAbbrev(value) }),
       /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "text-[11px] text-muted-foreground leading-none w-10 text-right", children: percent })
     ] })
   ] });
@@ -444,7 +446,7 @@ function PropertyCashflowDoughnutChart({
             label: (ctx) => {
               const val = ctx.raw;
               const pct = total > 0 ? `${(val / total * 100).toFixed(1)}%` : "0%";
-              return ` ${ctx.label}: ${formatAbbrev(val)} (${pct})`;
+              return ` ${ctx.label}: ${formatCurrencyAbbrev(val)} (${pct})`;
             }
           }
         }
@@ -461,7 +463,7 @@ function PropertyCashflowDoughnutChart({
       className: cn("w-full py-4 sm:py-6 gap-2", className),
       style: { maxWidth: width, fontFamily },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardHeader, { className: "px-3 sm:px-6", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardTitle, { className: "text-sm sm:text-base", children: title }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardHeader, { className: "px-3 sm:px-6", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardTitle, { className: "text-xs font-semibold uppercase tracking-wide", children: title }) }),
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardContent, { className: "px-3 sm:px-6", children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Skeleton, { style: { height, width: "100%" } }) : !hasData ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Empty, { className: "flex-none p-4", style: { height }, children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(EmptyDescription, { children: "No data available" }) }) : /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex flex-col gap-4", children: [
           /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { height, width: "100%", position: "relative" }, children: [
             /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
@@ -486,7 +488,7 @@ function PropertyCashflowDoughnutChart({
                   pointerEvents: "none"
                 },
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "text-base font-semibold leading-tight", children: formatAbbrev(Math.abs(netCashflow)) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "text-base font-semibold leading-tight", children: formatCurrencyAbbrev(Math.abs(netCashflow)) }),
                   /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "text-[11px] text-muted-foreground leading-none mt-1", children: netLabel })
                 ]
               }

package/dist/components/ui/property-cashflow-doughnut-chart.mjs

@@ -1,11 +1,12 @@
 import {
   PropertyCashflowDoughnutChart
-} from "../../chunk-VPBN3WOO.mjs";
+} from "../../chunk-DGHAXJBN.mjs";
 import "../../chunk-D6ID6M4V.mjs";
-import "../../chunk-FZIXGLMV.mjs";
+import "../../chunk-M3FV7LOK.mjs";
+import "../../chunk-MN5NYQCL.mjs";
 import "../../chunk-NQPOYKAQ.mjs";
-import "../../chunk-CLIN5525.mjs";
-import "../../chunk-2I5S2AMY.mjs";
+import "../../chunk-C7CQJNMR.mjs";
+import "../../chunk-XREGSKX3.mjs";
 import "../../chunk-DBHJ5KC3.mjs";
 import "../../chunk-FEZKMUCF.mjs";
 import "../../chunk-QOJ2DQD6.mjs";