impact-nova 0.1.13 → 1.0.0

package/dist/components/ui/ag-grid-react/headers/column-menu/column-settings-menu.js

@@ -1,7 +1,7 @@
 import { jsxs as t, jsx as e, Fragment as j } from "react/jsx-runtime";
 import "react";
 import { Settings as F, Checkmark as d, Search as T } from "../../../../../icons/index.js";
-import { DropdownMenu as L, DropdownMenuTrigger as _, DropdownMenuContent as E, DropdownMenuLabel as z, DropdownMenuSeparator as k, DropdownMenuSub as m, DropdownMenuSubTrigger as p, DropdownMenuSubContent as f, DropdownMenuItem as s } from "../../../dropdown-menu.js";
+import { DropdownMenu as L, DropdownMenuTrigger as _, DropdownMenuContent as E, DropdownMenuLabel as k, DropdownMenuSeparator as z, DropdownMenuSub as m, DropdownMenuSubTrigger as p, DropdownMenuSubContent as f, DropdownMenuItem as s } from "../../../dropdown-menu.js";
 const H = ({
   isOpen: O,
   onClose: i,
@@ -29,7 +29,7 @@ const H = ({
   }, A = () => {
     const n = l?.headerComponentParams;
     n?.onAdvanceSearchClick ? n.onAdvanceSearchClick(o) : r.getGridOption("context"), i();
-  }, c = v?.getBoundingClientRect(), N = l?.headerComponentParams, b = N?.isSearchable, y = N?.advanceSearchEnabled;
+  }, c = v?.getBoundingClientRect(), b = l?.headerComponentParams, y = b?.isSearchable, N = b?.advanceSearchEnabled;
   return /* @__PURE__ */ t(L, { open: O, onOpenChange: (n) => !n && i(), children: [
     c && /* @__PURE__ */ e(_, { asChild: !0, children: /* @__PURE__ */ e(
       "div",
@@ -51,24 +51,24 @@ const H = ({
         align: "end",
         side: "bottom",
         sideOffset: 5,
-        className: "w-[200px] p-2 rounded-[8px] border-none !shadow-[0px_0px_2px_0px_rgba(0,0,0,0.25)] z-[110]",
+        className: "w-[200px] p-2 rounded-[8px] border-none !shadow-[0px_0px_2px_0px_rgba(0,0,0,0.25)]",
         onCloseAutoFocus: (n) => n.preventDefault(),
         children: /* @__PURE__ */ t("div", { className: "flex flex-col gap-0.5", children: [
-          /* @__PURE__ */ t(z, { className: "flex items-center gap-2 text-[#60697D]", children: [
-            /* @__PURE__ */ e(F, { size: 12 }),
+          /* @__PURE__ */ t(k, { className: "flex items-center gap-2 text-[#60697D]", children: [
+            /* @__PURE__ */ e(F, { size: "xs" }),
             " Column Settings"
           ] }),
-          /* @__PURE__ */ e(k, {}),
+          /* @__PURE__ */ e(z, {}),
           M && /* @__PURE__ */ t(m, { children: [
             /* @__PURE__ */ e(p, { inset: !0, children: "Sort" }),
-            /* @__PURE__ */ t(f, { className: "z-[120]", sideOffset: 10, alignOffset: -5, children: [
+            /* @__PURE__ */ t(f, { sideOffset: 10, alignOffset: -5, children: [
               /* @__PURE__ */ e(s, { onClick: () => h("asc"), children: /* @__PURE__ */ t("span", { className: "flex items-center w-full justify-between", children: [
                 /* @__PURE__ */ e("span", { children: g ? "Sort Smallest to Largest" : w ? "Sort Oldest to Newest" : "Sort A to Z" }),
-                C === "asc" && /* @__PURE__ */ e(d, { size: 14, className: "ml-2 text-[#60697D]" })
+                C === "asc" && /* @__PURE__ */ e(d, { size: "sm", className: "ml-2 text-[#60697D]" })
               ] }) }),
               /* @__PURE__ */ e(s, { onClick: () => h("desc"), children: /* @__PURE__ */ t("span", { className: "flex items-center w-full justify-between", children: [
                 /* @__PURE__ */ e("span", { children: g ? "Sort Largest to Smallest" : w ? "Sort Newest to Oldest" : "Sort Z to A" }),
-                C === "desc" && /* @__PURE__ */ e(d, { size: 14, className: "ml-2 text-[#60697D]" })
+                C === "desc" && /* @__PURE__ */ e(d, { size: "sm", className: "ml-2 text-[#60697D]" })
               ] }) }),
               /* @__PURE__ */ e(s, { onClick: () => h(null), children: /* @__PURE__ */ e("span", { children: "Reset" }) })
             ] })
@@ -78,11 +78,11 @@ const H = ({
             /* @__PURE__ */ t(f, { className: "z-[120]", sideOffset: 10, alignOffset: -5, children: [
               /* @__PURE__ */ e(s, { onClick: () => u("left"), children: /* @__PURE__ */ t("span", { className: "flex items-center w-full justify-between", children: [
                 /* @__PURE__ */ e("span", { children: "Pin Left" }),
-                S === "left" && /* @__PURE__ */ e(d, { size: 14, className: "ml-2 text-[#60697D]" })
+                S === "left" && /* @__PURE__ */ e(d, { size: "sm", className: "ml-2 text-[#60697D]" })
               ] }) }),
               /* @__PURE__ */ e(s, { onClick: () => u("right"), children: /* @__PURE__ */ t("span", { className: "flex items-center w-full justify-between", children: [
                 /* @__PURE__ */ e("span", { children: "Pin Right" }),
-                S === "right" && /* @__PURE__ */ e(d, { size: 14, className: "ml-2 text-[#60697D]" })
+                S === "right" && /* @__PURE__ */ e(d, { size: "sm", className: "ml-2 text-[#60697D]" })
               ] }) }),
               /* @__PURE__ */ e(s, { onClick: () => u(null), children: /* @__PURE__ */ e("span", { children: "No Pin" }) })
             ] })
@@ -94,14 +94,14 @@ const H = ({
               /* @__PURE__ */ e(s, { onClick: () => D(!0), children: "Autosize All Columns" })
             ] })
           ] }),
-          (b || y) && /* @__PURE__ */ t(j, { children: [
-            /* @__PURE__ */ e(k, {}),
-            /* @__PURE__ */ t(z, { className: "flex items-center gap-2 text-[#60697D]", children: [
-              /* @__PURE__ */ e(T, { size: 12 }),
+          (y || N) && /* @__PURE__ */ t(j, { children: [
+            /* @__PURE__ */ e(z, {}),
+            /* @__PURE__ */ t(k, { className: "flex items-center gap-2 text-[#60697D]", children: [
+              /* @__PURE__ */ e(T, { size: "xs" }),
               " Search Options"
             ] }),
-            b && /* @__PURE__ */ e(s, { inset: !0, onClick: P, children: "Search" }),
-            y && /* @__PURE__ */ e(s, { inset: !0, onClick: A, children: "Advance Search" })
+            y && /* @__PURE__ */ e(s, { inset: !0, onClick: P, children: "Search" }),
+            N && /* @__PURE__ */ e(s, { inset: !0, onClick: A, children: "Advance Search" })
           ] })
         ] })
       }

package/dist/components/ui/ag-grid-react/headers/header-search-input.js

@@ -234,7 +234,7 @@ const je = {
     S(le()), K && K();
   }, Ne = () => ge ? /* @__PURE__ */ s("svg", { className: "cursor-pointer text-[#7a8294] hover:text-[#3649C6] shrink-0", fill: "currentColor", focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", width: "18", height: "18", onClick: (e) => {
     e.stopPropagation(), R.current && R.current.blur(), V ? V(A) : J ? J(o) : U && U.openAdvancedFilter(o);
-  }, children: /* @__PURE__ */ s("path", { d: "M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z" }) }) : null, Ae = () => /* @__PURE__ */ s("button", { onClick: G, className: "cursor-pointer shrink-0 text-[#4259ee] hover:text-[#0f1c76]", children: /* @__PURE__ */ s(me, { size: 12 }) }), D = a.filter === "agMultiColumnFilter", x = b(a);
+  }, children: /* @__PURE__ */ s("path", { d: "M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z" }) }) : null, Ae = () => /* @__PURE__ */ s("button", { onClick: G, className: "cursor-pointer shrink-0 text-[#4259ee] hover:text-[#0f1c76]", children: /* @__PURE__ */ s(me, { size: "xs" }) }), D = a.filter === "agMultiColumnFilter", x = b(a);
   let y = "text";
   D ? y = x.set !== -1 ? "set" : x.date !== -1 ? "date" : "text" : H ? y = "set" : g && (y = "date");
   const Se = D ? x.text !== -1 || x.number !== -1 : !g && !H, oe = D ? x.set !== -1 : H, se = D ? x.date !== -1 : g, Ie = c.getFilterModel()[o], ie = D && Ie?.filterModels?.some((e, t) => {
@@ -291,13 +291,13 @@ const je = {
         onBlur: () => f(!1),
         suffix: k && /* @__PURE__ */ s("button", { onClick: (e) => {
           e.stopPropagation(), Ce();
-        }, className: "cursor-pointer text-[#7a8294] hover:text-[#3649C6]", children: /* @__PURE__ */ s(me, { size: 10 }) })
+        }, className: "cursor-pointer text-[#7a8294] hover:text-[#3649C6]", children: /* @__PURE__ */ s(me, { size: "xs" }) })
       }
     ),
     /* @__PURE__ */ F("div", { className: "flex items-center gap-1.5 shrink-0", children: [
       D && /* @__PURE__ */ F(qe, { children: [
         /* @__PURE__ */ s(Ee, { asChild: !0, children: /* @__PURE__ */ F("div", { className: "relative group p-1 hover:bg-[#dbe0fb] rounded-md transition-colors cursor-pointer", children: [
-          /* @__PURE__ */ s(we, { size: 16, className: ze("text-[#60697D] group-hover:text-[#3649C6]", ie && "text-[#3649C6]") }),
+          /* @__PURE__ */ s(we, { size: "md", className: ze("text-[#60697D] group-hover:text-[#3649C6]", ie && "text-[#3649C6]") }),
           ie && /* @__PURE__ */ s("span", { className: "absolute top-0.5 right-0.5 w-2 h-2 rounded-full bg-[#4259ee] border border-white shadow-sm" })
         ] }) }),
         /* @__PURE__ */ F(Be, { align: "end", className: "w-[300px]", children: [

package/dist/components/ui/alert-dialog.js

@@ -1,39 +1,40 @@
 import { jsx as l, jsxs as n } from "react/jsx-runtime";
 import * as i from "react";
-import * as t from "@radix-ui/react-alert-dialog";
+import * as e from "@radix-ui/react-alert-dialog";
 import { cn as s } from "../../lib/utils.js";
-import { buttonVariants as r } from "./button-variants.js";
-const w = t.Root, b = t.Trigger, m = t.Portal, d = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ l(
-  t.Overlay,
+import { buttonVariants as d } from "./button-variants.js";
+const w = e.Root, b = e.Trigger, m = e.Portal, r = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ l(
+  e.Overlay,
   {
     className: s(
       "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       a
     ),
-    ...e,
+    ...t,
     ref: o
   }
 ));
-d.displayName = t.Overlay.displayName;
-const c = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ n(m, { children: [
-  /* @__PURE__ */ l(d, {}),
+r.displayName = e.Overlay.displayName;
+const c = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ n(m, { children: [
+  /* @__PURE__ */ l(r, {}),
   /* @__PURE__ */ l(
-    t.Content,
+    e.Content,
     {
       ref: o,
       "aria-describedby": void 0,
+      "data-component": "alert-dialog-content",
       className: s(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg 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%] sm:rounded-lg",
         a
       ),
-      ...e
+      ...t
     }
   )
 ] }));
-c.displayName = t.Content.displayName;
-const f = ({
+c.displayName = e.Content.displayName;
+const p = ({
   className: a,
-  ...e
+  ...t
 }) => /* @__PURE__ */ l(
   "div",
   {
@@ -41,13 +42,13 @@ const f = ({
       "flex flex-col space-y-2 text-center sm:text-left",
       a
     ),
-    ...e
+    ...t
   }
 );
-f.displayName = "AlertDialogHeader";
-const p = ({
+p.displayName = "AlertDialogHeader";
+const f = ({
   className: a,
-  ...e
+  ...t
 }) => /* @__PURE__ */ l(
   "div",
   {
@@ -55,59 +56,63 @@ const p = ({
       "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
       a
     ),
-    ...e
+    ...t
   }
 );
-p.displayName = "AlertDialogFooter";
-const g = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ l(
-  t.Title,
+f.displayName = "AlertDialogFooter";
+const g = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ l(
+  e.Title,
   {
     ref: o,
+    "data-component": "alert-dialog-title",
     className: s("text-lg font-semibold", a),
-    ...e
+    ...t
   }
 ));
-g.displayName = t.Title.displayName;
-const N = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ l(
-  t.Description,
+g.displayName = e.Title.displayName;
+const N = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ l(
+  e.Description,
   {
     ref: o,
+    "data-component": "alert-dialog-description",
     className: s("text-sm text-muted-foreground", a),
-    ...e
+    ...t
   }
 ));
-N.displayName = t.Description.displayName;
-const y = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ l(
-  t.Action,
+N.displayName = e.Description.displayName;
+const y = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ l(
+  e.Action,
   {
     ref: o,
-    className: s(r(), a),
-    ...e
+    "data-component": "alert-dialog-action",
+    className: s(d(), a),
+    ...t
   }
 ));
-y.displayName = t.Action.displayName;
-const x = i.forwardRef(({ className: a, ...e }, o) => /* @__PURE__ */ l(
-  t.Cancel,
+y.displayName = e.Action.displayName;
+const x = i.forwardRef(({ className: a, ...t }, o) => /* @__PURE__ */ l(
+  e.Cancel,
   {
     ref: o,
+    "data-component": "alert-dialog-cancel",
     className: s(
-      r({ variant: "outline" }),
+      d({ variant: "outline" }),
       "mt-2 sm:mt-0",
       a
     ),
-    ...e
+    ...t
   }
 ));
-x.displayName = t.Cancel.displayName;
+x.displayName = e.Cancel.displayName;
 export {
   w as AlertDialog,
   y as AlertDialogAction,
   x as AlertDialogCancel,
   c as AlertDialogContent,
   N as AlertDialogDescription,
-  p as AlertDialogFooter,
-  f as AlertDialogHeader,
-  d as AlertDialogOverlay,
+  f as AlertDialogFooter,
+  p as AlertDialogHeader,
+  r as AlertDialogOverlay,
   m as AlertDialogPortal,
   g as AlertDialogTitle,
   b as AlertDialogTrigger

package/dist/components/ui/alert.d.ts

@@ -3,9 +3,26 @@ import * as React from "react";
 declare const alertVariants: (props?: {
     variant?: "default" | "info" | "warning" | "error" | "success";
 } & import('class-variance-authority/types').ClassProp) => string;
-declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: {
-    variant?: "default" | "info" | "warning" | "error" | "success";
-} & import('class-variance-authority/types').ClassProp) => string> & React.RefAttributes<HTMLDivElement>>;
+export interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+    asChild?: boolean;
+}
+declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
 declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
 declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
-export { Alert, AlertTitle, AlertDescription, alertVariants };
+export interface AlertIconProps {
+    /** The alert variant — determines which icon to render */
+    variant?: "default" | "info" | "success" | "warning" | "error";
+    className?: string;
+}
+/**
+ * Renders the appropriate icon for the given Alert variant.
+ *
+ * @example
+ * <AlertIcon variant="success" className="h-4 w-4" />
+ * <AlertIcon variant="error" />
+ */
+declare const AlertIcon: {
+    ({ variant, className }: AlertIconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Alert, AlertTitle, AlertDescription, AlertIcon, alertVariants };

package/dist/components/ui/alert.js

@@ -1,8 +1,10 @@
 import { jsx as a } from "react/jsx-runtime";
-import * as o from "react";
-import { cva as l } from "class-variance-authority";
+import * as n from "react";
+import { Slot as c } from "@radix-ui/react-slot";
+import { cva as d } from "class-variance-authority";
 import { cn as s } from "../../lib/utils.js";
-const n = l(
+import { XCircle as f, AlertTriangle as g, CheckCircle as m, Info as o } from "lucide-react";
+const p = d(
   "relative w-full rounded-lg border px-4 py-3 text-sm flex gap-3 items-start",
   {
     variants: {
@@ -18,37 +20,55 @@ const n = l(
       variant: "default"
     }
   }
-), d = o.forwardRef(({ className: r, variant: e, ...t }, i) => /* @__PURE__ */ a(
-  "div",
-  {
-    ref: i,
-    role: "alert",
-    className: s(n({ variant: e }), r),
-    ...t
-  }
-));
-d.displayName = "Alert";
-const g = o.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ a(
+), b = n.forwardRef(
+  ({ className: e, variant: r, asChild: t = !1, ...l }, i) => /* @__PURE__ */ a(
+    t ? c : "div",
+    {
+      ref: i,
+      role: "alert",
+      "data-component": "alert",
+      "data-variant": r ?? "default",
+      className: s(p({ variant: r }), e),
+      ...l
+    }
+  )
+);
+b.displayName = "Alert";
+const u = n.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ a(
   "h5",
   {
     ref: t,
-    className: s("font-semibold leading-[21px] tracking-tight text-foreground", r),
-    ...e
+    "data-component": "alert-title",
+    className: s("font-semibold leading-[21px] tracking-tight text-foreground", e),
+    ...r
   }
 ));
-g.displayName = "AlertTitle";
-const c = o.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ a(
+u.displayName = "AlertTitle";
+const x = n.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ a(
   "div",
   {
     ref: t,
-    className: s("text-[12px] leading-[18px] text-secondary-foreground", r),
-    ...e
+    "data-component": "alert-description",
+    className: s("text-[12px] leading-[18px] text-secondary-foreground", e),
+    ...r
   }
 ));
-c.displayName = "AlertDescription";
+x.displayName = "AlertDescription";
+const v = {
+  default: o,
+  info: o,
+  success: m,
+  warning: g,
+  error: f
+}, w = ({ variant: e = "info", className: r = "h-4 w-4 shrink-0 mt-1" }) => {
+  const t = v[e] || o;
+  return /* @__PURE__ */ a(t, { className: r });
+};
+w.displayName = "AlertIcon";
 export {
-  d as Alert,
-  c as AlertDescription,
-  g as AlertTitle,
-  n as alertVariants
+  b as Alert,
+  x as AlertDescription,
+  w as AlertIcon,
+  u as AlertTitle,
+  p as alertVariants
 };

package/dist/components/ui/avatar.js

@@ -1,9 +1,9 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as s } from "react/jsx-runtime";
 import * as l from "react";
 import * as a from "@radix-ui/react-avatar";
-import { cva as f } from "class-variance-authority";
-import { cn as m } from "../../lib/utils.js";
-const c = f(
+import { cva as c } from "class-variance-authority";
+import { cn as o } from "../../lib/utils.js";
+const f = c(
   "relative flex shrink-0 overflow-hidden",
   {
     variants: {
@@ -22,33 +22,36 @@ const c = f(
       shape: "square"
     }
   }
-), d = l.forwardRef(({ className: e, size: s, shape: t, ...o }, i) => /* @__PURE__ */ r(
+), d = l.forwardRef(({ className: e, size: t, shape: r, ...m }, i) => /* @__PURE__ */ s(
   a.Root,
   {
     ref: i,
-    className: m(c({ size: s, shape: t, className: e })),
-    ...o
+    className: o(f({ size: t, shape: r, className: e })),
+    "data-component": "avatar",
+    ...m
   }
 ));
 d.displayName = a.Root.displayName;
-const n = l.forwardRef(({ className: e, ...s }, t) => /* @__PURE__ */ r(
+const n = l.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ s(
   a.Image,
   {
-    ref: t,
-    className: m("aspect-square h-full w-full", e),
-    ...s
+    ref: r,
+    className: o("aspect-square h-full w-full", e),
+    "data-component": "avatar-image",
+    ...t
   }
 ));
 n.displayName = a.Image.displayName;
-const p = l.forwardRef(({ className: e, ...s }, t) => /* @__PURE__ */ r(
+const p = l.forwardRef(({ className: e, ...t }, r) => /* @__PURE__ */ s(
   a.Fallback,
   {
-    ref: t,
-    className: m(
+    ref: r,
+    className: o(
       "flex h-full w-full items-center justify-center bg-success text-white font-bold",
       e
     ),
-    ...s
+    "data-component": "avatar-fallback",
+    ...t
   }
 ));
 p.displayName = a.Fallback.displayName;
@@ -56,5 +59,5 @@ export {
   d as Avatar,
   p as AvatarFallback,
   n as AvatarImage,
-  c as avatarVariants
+  f as avatarVariants
 };

package/dist/components/ui/badge.js

@@ -46,7 +46,14 @@ const i = n(
   }
 );
 function d({ className: r, variant: t, color: a, ...e }) {
-  return /* @__PURE__ */ s("div", { className: o(i({ variant: t, color: a }), r), ...e });
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: o(i({ variant: t, color: a }), r),
+      "data-component": "badge",
+      ...e
+    }
+  );
 }
 export {
   d as Badge,

package/dist/components/ui/breadcrumb.js

@@ -60,6 +60,7 @@ const w = o.forwardRef(({ className: e, ...r }, t) => /* @__PURE__ */ a(
     role: "link",
     "aria-disabled": "true",
     "aria-current": "page",
+    "data-current": "page",
     className: s("font-extrabold text-[#1f2b4d]", e),
     ...r
   }

package/dist/components/ui/button-group.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'class-variance-authority';
 import * as React from "react";
 declare const buttonGroupVariants: (props?: {
     orientation?: "horizontal" | "vertical";
-    spacing?: "none" | "sm" | "md" | "lg";
+    spacing?: "sm" | "md" | "lg" | "none";
 } & import('class-variance-authority/types').ClassProp) => string;
 export interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof buttonGroupVariants> {
     value?: string;

package/dist/components/ui/button-group.js

@@ -1,5 +1,5 @@
-import { jsxs as s, jsx as o } from "react/jsx-runtime";
-import * as a from "react";
+import { jsxs as s, jsx as a } from "react/jsx-runtime";
+import * as o from "react";
 import { cva as k } from "class-variance-authority";
 import { cn as t } from "../../lib/utils.js";
 import { Info as G } from "../../icons/index.js";
@@ -23,55 +23,50 @@ const V = k(
       spacing: "none"
     }
   }
-), j = a.forwardRef(
-  ({ className: f, orientation: d = "horizontal", spacing: x = "none", value: v, onValueChange: l, isDisabled: c, children: b, label: p, helperText: m, isError: r, required: g, ...h }, N) => /* @__PURE__ */ s("div", { className: t("grid gap-1.5", f), children: [
-    p && /* @__PURE__ */ s(
+), j = o.forwardRef(
+  ({ className: x, orientation: n = "horizontal", spacing: l = "none", value: v, onValueChange: c, isDisabled: p, children: b, label: m, helperText: u, isError: r, required: g, ...h }, N) => /* @__PURE__ */ s("div", { className: t("grid gap-1.5", x), children: [
+    m && /* @__PURE__ */ s(
       "label",
       {
         className: t(
           "text-xs font-medium leading-[18px] text-[#60697d]",
           // Exact legacy color
-          c && "opacity-70",
+          p && "opacity-70",
           r && "text-destructive"
         ),
         children: [
-          p,
+          m,
           " ",
-          g && /* @__PURE__ */ o("span", { className: "text-destructive", children: "*" })
+          g && /* @__PURE__ */ a("span", { className: "text-destructive", children: "*" })
         ]
       }
     ),
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ a(
       "div",
       {
         ref: N,
         className: t(
-          V({ orientation: d, spacing: x }),
+          V({ orientation: n, spacing: l }),
           ""
-          // Remove className from here to avoid double application if it was meant for the wrapper, 
-          // but usually className on the component means the outer container. 
-          // However, for backward compatibility, if className had width styles, they might break.
-          // But since we wrapped it, let's keep className on the wrapper? 
-          // Actually, usually standard in this library seems to be className on the root. 
-          // So I will apply className to the wrapper (done above) and NOT here.
-          // Wait, existing usage might expect className on the flex container.
-          // Let's inspect Input/RadioGroup. They apply className to the wrapper/grid.
-          // So applying className to the wrapper is consistent.
         ),
         role: "group",
+        "data-component": "button-group",
+        "data-orientation": n,
+        "data-spacing": l,
         ...h,
-        children: a.Children.map(b, (n) => {
-          if (a.isValidElement(n)) {
-            const e = n, i = e.props.value || e.props.children?.toString(), u = v === i, z = d === "horizontal";
-            return a.cloneElement(e, {
-              disabled: e.props.disabled || c,
+        children: o.Children.map(b, (i) => {
+          if (o.isValidElement(i)) {
+            const e = i, d = e.props.value || e.props.children?.toString(), f = v === d, z = n === "horizontal";
+            return o.cloneElement(e, {
+              disabled: e.props.disabled || p,
               variant: e.props.variant || "tertiary",
+              "data-button-group": "item",
               className: t(
                 "relative transition-all hover:bg-transparent hover:border-tertiary-border",
                 z ? "rounded-none first:rounded-l-md last:rounded-r-md -ml-[1px] first:ml-0" : "rounded-none first:rounded-t-md last:rounded-b-md -mt-[1px] first:mt-0",
-                u ? "z-10 bg-[#eceefd] border-[#4259ee] text-[#4259ee] hover:bg-[#eceefd] hover:border-[#4259ee] hover:text-[#4259ee]" : "text-[#0000008a]",
+                f ? "z-10 bg-[#eceefd] border-[#4259ee] text-[#4259ee] hover:bg-[#eceefd] hover:border-[#4259ee] hover:text-[#4259ee]" : "text-[#0000008a]",
                 "disabled:bg-[#f8f9fb] disabled:text-[#b4bac7] disabled:opacity-100",
-                r && !u && "border-destructive text-destructive z-10",
+                r && !f && "border-destructive text-destructive z-10",
                 // rudimentary error style for buttons
                 // If active and error? Maybe keep active color but allow border to be red? 
                 // For now let's just stick to the text label error. Button error styles are complex.
@@ -79,17 +74,17 @@ const V = k(
                 e.props.className
               ),
               onClick: (y) => {
-                e.props.onClick?.(y), i && l && l(i);
+                e.props.onClick?.(y), d && c && c(d);
               }
             });
           }
-          return n;
+          return i;
         })
       }
     ),
-    m && /* @__PURE__ */ s("div", { className: t("flex items-center gap-1", r && "text-destructive"), children: [
-      !r && /* @__PURE__ */ o(G, { size: 10, className: "shrink-0 text-muted-foreground" }),
-      /* @__PURE__ */ o(
+    u && /* @__PURE__ */ s("div", { className: t("flex items-center gap-1", r && "text-destructive"), children: [
+      !r && /* @__PURE__ */ a(G, { size: 10, className: "shrink-0 text-muted-foreground" }),
+      /* @__PURE__ */ a(
         "p",
         {
           className: t(
@@ -97,7 +92,7 @@ const V = k(
             // Exact legacy color
             r && "text-destructive"
           ),
-          children: m
+          children: u
         }
       )
     ] })

package/dist/components/ui/button-variants.d.ts

@@ -1,4 +1,4 @@
 export declare const buttonVariants: (props?: {
     variant?: "default" | "link" | "secondary" | "tertiary" | "destructive" | "outline" | "ghost";
-    size?: "default" | "icon" | "sm" | "md" | "lg";
+    size?: "sm" | "md" | "lg" | "default" | "icon";
 } & import('class-variance-authority/types').ClassProp) => string;

package/dist/components/ui/button.d.ts

@@ -2,7 +2,18 @@ import { VariantProps } from 'class-variance-authority';
 import { buttonVariants } from './button-variants';
 import * as React from "react";
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    /**
+     * Renders the button as a child element using Radix's Slot pattern.
+     * Use this when you want to pass a custom element (e.g. `<a>`) but
+     * keep button styling and behavior.
+     * @example <Button asChild><a href="/home">Home</a></Button>
+     */
     asChild?: boolean;
+    /**
+     * Side of the tooltip for icon-only buttons.
+     * Only applies when `size="icon"` and `aria-label` is set.
+     * @default "top"
+     */
     tooltipSide?: "top" | "bottom" | "left" | "right";
 }
 declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;