@adsgency_npm/adsgency-ads-ui 0.1.0-alpha.13 → 0.1.0-alpha.15

package/dist/index.cjs

@@ -2596,6 +2596,7 @@ AdsSkeleton.displayName = "AdsSkeleton";
 
 // src/components/AdsInput/index.tsx
 var React29 = __toESM(require("react"), 1);
+var import_lucide_react10 = require("lucide-react");
 
 // src/lib/adsClearButton.tsx
 var React28 = __toESM(require("react"), 1);
@@ -2622,6 +2623,11 @@ var inputSizeClasses = {
   md: "h-9 text-base leading-6",
   lg: "h-10 text-base leading-6"
 };
+var fileTriggerSizeClasses = {
+  sm: "h-8 px-md py-sm",
+  md: "h-9 px-lg py-sm",
+  lg: "h-10 px-xl py-[10px]"
+};
 function assignInputRef(ref, value) {
   if (typeof ref === "function") {
     ref(value);
@@ -2640,6 +2646,17 @@ function getTextInputValue(value) {
   }
   return "";
 }
+function renderFileTriggerIcon(icon) {
+  if (!icon) {
+    return null;
+  }
+  if (React29.isValidElement(icon)) {
+    return React29.cloneElement(icon, {
+      className: cn("!h-4 !w-4 h-4 w-4", icon.props.className)
+    });
+  }
+  return icon;
+}
 function getInputSurfaceClassName({
   className,
   errorText,
@@ -2666,6 +2683,7 @@ var AdsInput = React29.forwardRef(
     descriptionPlacement = "below",
     emptyFileLabel,
     errorText,
+    fileTriggerIcon = /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(import_lucide_react10.Upload, { "aria-hidden": true, className: "h-4 w-4" }),
     fileTriggerLabel,
     helperText,
     id,
@@ -2706,6 +2724,7 @@ var AdsInput = React29.forwardRef(
     });
     const resolvedClearButtonLabel = clearButtonLabel ?? messages.input.clear;
     const resolvedFileTriggerLabel = fileTriggerLabel ?? messages.input.chooseFile;
+    const resolvedFileTriggerIcon = renderFileTriggerIcon(fileTriggerIcon);
     const resolvedEmptyFileLabel = emptyFileLabel ?? messages.input.noFileChosen;
     const handleChange = React29.useCallback(
       (event) => {
@@ -2736,7 +2755,7 @@ var AdsInput = React29.forwardRef(
     const fileNameText = selectedFiles.length > 0 ? selectedFiles.join(", ") : resolvedEmptyFileLabel;
     const helperNode = helperText ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AdsFieldDescription, { id: description.helperId, children: helperText }) : null;
     const errorNode = errorText ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(AdsFieldError, { id: description.errorId, children: errorText }) : null;
-    const inputNode = isFileInput ? /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "relative flex w-full min-w-0 flex-1 items-center", children: [
+    const inputNode = isFileInput ? /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "group relative flex w-full min-w-0 flex-1 items-center focus-within:[&_[data-ads-file-trigger]]:ring-2 focus-within:[&_[data-ads-file-trigger]]:ring-ring focus-within:[&_[data-ads-file-trigger]]:ring-offset-2 focus-within:[&_[data-ads-file-trigger]]:ring-offset-background", children: [
       /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
         Input,
         {
@@ -2762,20 +2781,23 @@ var AdsInput = React29.forwardRef(
         {
           "aria-hidden": "true",
           className: cn(
-            inputSurfaceClassName,
-            adsTextColorClassName.card,
-            "items-center text-sm leading-5",
+            "flex w-full min-w-0 items-center gap-sm text-sm leading-5",
             props.disabled ? "cursor-not-allowed opacity-50" : void 0
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
               "span",
               {
+                "data-ads-file-trigger": "",
                 className: cn(
-                  "shrink-0 pr-sm text-sm font-medium leading-5",
-                  adsTextColorClassName.card
+                  "inline-flex shrink-0 items-center justify-center gap-sm rounded-radius-md border-0 bg-primary text-sm font-medium leading-5 shadow-[0px_1px_2px_rgba(0,0,0,0.1)] transition-colors group-hover:bg-brand-primary-hover",
+                  fileTriggerSizeClasses[size],
+                  adsTextColorClassName.primary
                 ),
-                children: resolvedFileTriggerLabel
+                children: [
+                  resolvedFileTriggerIcon ? /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "inline-flex h-4 w-4 items-center justify-center [&>svg]:!h-4 [&>svg]:!w-4", children: resolvedFileTriggerIcon }) : null,
+                  resolvedFileTriggerLabel
+                ]
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
@@ -3066,7 +3088,7 @@ var React33 = __toESM(require("react"), 1);
 // src/primitives/input-otp.tsx
 var React32 = __toESM(require("react"), 1);
 var import_input_otp = require("input-otp");
-var import_lucide_react10 = require("lucide-react");
+var import_lucide_react11 = require("lucide-react");
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var InputOTP = React32.forwardRef(({ className, containerClassName, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
   import_input_otp.OTPInput,
@@ -3104,7 +3126,7 @@ var InputOTPSlot = React32.forwardRef(({ index, className, ...props }, ref) => {
   );
 });
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React32.forwardRef(({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react10.Dot, {}) }));
+var InputOTPSeparator = React32.forwardRef(({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { ref, role: "separator", ...props, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_lucide_react11.Dot, {}) }));
 InputOTPSeparator.displayName = "InputOTPSeparator";
 
 // src/components/AdsInputOTP/index.tsx
@@ -3232,11 +3254,11 @@ var React37 = __toESM(require("react"), 1);
 
 // src/components/AdsPagination/index.tsx
 var React35 = __toESM(require("react"), 1);
-var import_lucide_react12 = require("lucide-react");
+var import_lucide_react13 = require("lucide-react");
 
 // src/primitives/pagination.tsx
 var React34 = __toESM(require("react"), 1);
-var import_lucide_react11 = require("lucide-react");
+var import_lucide_react12 = require("lucide-react");
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var Pagination = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
   "nav",
@@ -3290,7 +3312,7 @@ var PaginationPrevious = ({
     className: cn("gap-1 pl-2.5", className),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react11.ChevronLeft, { className: "h-4 w-4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react12.ChevronLeft, { className: "h-4 w-4" }),
       /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: "Previous" })
     ]
   }
@@ -3308,7 +3330,7 @@ var PaginationNext = ({
     ...props,
     children: [
       /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: "Next" }),
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react11.ChevronRight, { className: "h-4 w-4" })
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react12.ChevronRight, { className: "h-4 w-4" })
     ]
   }
 );
@@ -3323,7 +3345,7 @@ var PaginationEllipsis = ({
     className: cn("flex h-9 w-9 items-center justify-center", className),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react11.MoreHorizontal, { className: "h-4 w-4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react12.MoreHorizontal, { className: "h-4 w-4" }),
       /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "sr-only", children: "More pages" })
     ]
   }
@@ -3378,7 +3400,7 @@ var AdsPaginationPrevious = React35.forwardRef(({ "aria-label": ariaLabel, child
       ref,
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react12.ChevronLeft, { "aria-hidden": true, className: "h-4 w-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.ChevronLeft, { "aria-hidden": true, className: "h-4 w-4" }),
         /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { children: label })
       ]
     }
@@ -3398,7 +3420,7 @@ var AdsPaginationNext = React35.forwardRef(
         ...props,
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react12.ChevronRight, { "aria-hidden": true, className: "h-4 w-4" })
+          /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.ChevronRight, { "aria-hidden": true, className: "h-4 w-4" })
         ]
       }
     );
@@ -3422,7 +3444,7 @@ function AdsPaginationEllipsis({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react12.MoreHorizontal, { className: "h-4 w-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.MoreHorizontal, { className: "h-4 w-4" }),
         /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "sr-only", children: resolvedLabel })
       ]
     }
@@ -3941,7 +3963,7 @@ function AdsDataPagination({
 
 // src/components/AdsDataTable/index.tsx
 var React42 = __toESM(require("react"), 1);
-var import_lucide_react15 = require("lucide-react");
+var import_lucide_react16 = require("lucide-react");
 
 // src/components/AdsEmpty/index.tsx
 var import_class_variance_authority9 = require("class-variance-authority");
@@ -4048,7 +4070,7 @@ function AdsEmptyFooter({ className, ...props }) {
 
 // src/components/AdsTable/index.tsx
 var React41 = __toESM(require("react"), 1);
-var import_lucide_react14 = require("lucide-react");
+var import_lucide_react15 = require("lucide-react");
 
 // src/components/AdsRadioGroup/index.tsx
 var React39 = __toESM(require("react"), 1);
@@ -4056,7 +4078,7 @@ var React39 = __toESM(require("react"), 1);
 // src/primitives/radio-group.tsx
 var React38 = __toESM(require("react"), 1);
 var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
-var import_lucide_react13 = require("lucide-react");
+var import_lucide_react14 = require("lucide-react");
 var import_jsx_runtime42 = require("react/jsx-runtime");
 var RadioGroup = React38.forwardRef(({ className, ...props }, ref) => {
   return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
@@ -4079,7 +4101,7 @@ var RadioGroupItem = React38.forwardRef(({ className, ...props }, ref) => {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react13.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react14.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
     }
   );
 });
@@ -4483,7 +4505,7 @@ var AdsTableSortHeader = React41.forwardRef(
         variant: "ghost",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "truncate", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "inline-flex h-4 w-4 items-center justify-center text-icon-muted", children: sortOrder === "ascend" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react14.ChevronDown, { className: "h-4 w-4 rotate-180" }) : sortOrder === "descend" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react14.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react14.ChevronDown, { className: "h-4 w-4 opacity-60" }) })
+          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "inline-flex h-4 w-4 items-center justify-center text-icon-muted", children: sortOrder === "ascend" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4 rotate-180" }) : sortOrder === "descend" ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4 opacity-60" }) })
         ]
       }
     ) });
@@ -4547,7 +4569,7 @@ var AdsTableExpandCell = React41.forwardRef(
         size: "sm",
         type: "button",
         variant: "ghost",
-        children: expanded ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react14.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react14.ChevronRight, { className: "h-4 w-4" })
+        children: expanded ? /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronRight, { className: "h-4 w-4" })
       }
     ) }) });
   }
@@ -5163,7 +5185,7 @@ function AdsDataTable({
               variant: "ghost",
               children: [
                 /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "truncate", children: headerTitle }),
-                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "inline-flex h-4 w-4 items-center justify-center text-icon-muted", children: columnSortOrder === "ascend" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4 rotate-180" }) : columnSortOrder === "descend" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react15.ChevronDown, { className: "h-4 w-4 opacity-60" }) })
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "inline-flex h-4 w-4 items-center justify-center text-icon-muted", children: columnSortOrder === "ascend" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react16.ChevronDown, { className: "h-4 w-4 rotate-180" }) : columnSortOrder === "descend" ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react16.ChevronDown, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react16.ChevronDown, { className: "h-4 w-4 opacity-60" }) })
               ]
             }
           ) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("span", { className: "truncate", children: headerTitle }),
@@ -5180,7 +5202,7 @@ function AdsDataTable({
                 size: "sm",
                 type: "button",
                 variant: "ghost",
-                children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react15.Filter, { className: "h-3.5 w-3.5" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react16.Filter, { className: "h-3.5 w-3.5" })
               }
             ) }),
             /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(AdsPopoverContent, { align: "end", className: "w-64", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
@@ -6134,15 +6156,15 @@ AdsTooltipArrow.displayName = "AdsTooltipArrow";
 
 // src/components/AdsToast/index.tsx
 var React58 = __toESM(require("react"), 1);
-var import_lucide_react16 = require("lucide-react");
+var import_lucide_react17 = require("lucide-react");
 var import_sonner = require("sonner");
 var import_jsx_runtime64 = require("react/jsx-runtime");
 var adsToastIconMap = {
-  success: import_lucide_react16.CircleCheck,
-  info: import_lucide_react16.Info,
-  warning: import_lucide_react16.TriangleAlert,
-  error: import_lucide_react16.OctagonX,
-  loading: import_lucide_react16.LoaderCircle
+  success: import_lucide_react17.CircleCheck,
+  info: import_lucide_react17.Info,
+  warning: import_lucide_react17.TriangleAlert,
+  error: import_lucide_react17.OctagonX,
+  loading: import_lucide_react17.LoaderCircle
 };
 function resolveToastIcon(intent, icon) {
   if (icon) {
@@ -6327,7 +6349,7 @@ var AdsToastManager = Object.assign(
 // src/components/AdsDialog/index.tsx
 var React59 = __toESM(require("react"), 1);
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_lucide_react17 = require("lucide-react");
+var import_lucide_react18 = require("lucide-react");
 var import_jsx_runtime65 = require("react/jsx-runtime");
 var overlayClassName2 = "fixed inset-0 z-50 bg-black/80 backdrop-blur-[2px] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0";
 var contentClassName2 = "fixed left-1/2 top-1/2 z-50 flex max-h-[calc(100dvh-2rem)] w-[calc(100%-2rem)] max-w-[423px] -translate-x-1/2 -translate-y-1/2 flex-col gap-lg overflow-hidden rounded-radius-md border border-border bg-card p-xl shadow-[0px_4px_6px_-4px_rgba(0,0,0,0.1),0px_10px_15px_-3px_rgba(0,0,0,0.1)] duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]";
@@ -6453,7 +6475,7 @@ var DialogContent = React59.forwardRef(
                 "aria-label": resolvedCloseLabel,
                 className: cn(closeButtonClassName, adsTextColorClassName.card),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_lucide_react17.X, { "aria-hidden": true, className: "h-4 w-4" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime65.jsx)(import_lucide_react18.X, { "aria-hidden": true, className: "h-4 w-4" }),
                   /* @__PURE__ */ (0, import_jsx_runtime65.jsx)("span", { className: "sr-only", children: resolvedCloseLabel })
                 ]
               }