@onesaz/ui 0.3.20 → 0.3.22

package/dist/index.d.ts

@@ -205,6 +205,19 @@ interface IconButtonProps extends Omit<ButtonProps, 'size'> {
     'aria-label': string;
 }
 declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+interface ButtonGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Variant applied to all child buttons (can be overridden per button) */
+    variant?: ButtonProps['variant'];
+    /** Size applied to all child buttons (can be overridden per button) */
+    size?: ButtonProps['size'];
+    /** Layout direction */
+    orientation?: 'horizontal' | 'vertical';
+    /** Disable all child buttons */
+    disabled?: boolean;
+    /** Stretch group to fill container width */
+    fullWidth?: boolean;
+}
+declare const ButtonGroup: React.ForwardRefExoticComponent<ButtonGroupProps & React.RefAttributes<HTMLDivElement>>;
 
 interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
     /** Input size variant */
@@ -1839,4 +1852,4 @@ declare const RailPanelItem: React.ForwardRefExoticComponent<RailPanelItemProps
 
 declare const Playground: () => react_jsx_runtime.JSX.Element;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, AreaChart, type AreaChartProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, BarChart, type BarChartProps, Box, type BoxProps, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, type CircularProgressProps, type ColumnGroupModel, type ColumnVisibilityModel, Combobox, type ComboboxMultipleProps, type ComboboxOption, type ComboboxProps, type ComboboxSingleProps, DataGrid, type DataGridProps, DataGrid as DataGridV0, DialogNamespace as Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, type DonutChartProps, Drawer, DrawerBody, type DrawerBodyProps, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, FormControl, type FormControlProps, FormGroup, type FormGroupProps, FormHelperText, type FormHelperTextProps, FormLabel, type FormLabelProps, Grid, type GridColDef, type GridProps, type GridRenderCellParams, type GridRenderHeaderParams, type GridRowSelectionModel, type GridSpanParams, type GridValueFormatterParams, type GridValueGetterParams, H1, H2, H3, H4, H5, H6, HStack, IconButton, type IconButtonProps, IconRail, IconRailContent, type IconRailContentProps, IconRailFooter, type IconRailFooterProps, IconRailHeader, type IconRailHeaderProps, IconRailItem, type IconRailItemProps, type IconRailProps, Input, InputAdornment, type InputAdornmentProps, type InputProps, Label, type LabelProps, LineChart, type LineChartProps, LinearProgress, type LinearProgressProps, List, ListDivider, type ListDividerProps, ListItem, ListItemAvatar, type ListItemAvatarProps, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, MultiProgressDonut, type MultiProgressDonutProps, NativeSelect, NativeSelectOption, type NativeSelectOptionProps, type NativeSelectProps, PackedBubbleChart, type PackedBubbleChartProps, type PackedBubbleDataItem, PaginationNamespace as Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, type PaginationLinkProps, type PaginationModel, PaginationNext, PaginationPrevious, type PaginationProps, PieChart, type PieChartProps, type PinnedColumnsModel, type PinnedRowsModel, Playground, Progress, ProgressCard, type ProgressCardProps, ProgressDonut, type ProgressDonutProps, type ProgressProps, RadarChart, type RadarChartProps, Radio, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, type RadioProps, RailPanel, RailPanelGroup, type RailPanelGroupProps, RailPanelItem, type RailPanelItemProps, type RailPanelProps, RangeSlider, type RangeSliderProps, ScatterChart, type ScatterChartProps, SelectNamespace as Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarGroup, type SidebarGroupProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarRail, type SidebarRailProps, SidebarSubMenu, type SidebarSubMenuProps, SidebarToggle, type SidebarToggleProps, Skeleton, SkeletonAvatar, type SkeletonAvatarProps, SkeletonCard, type SkeletonCardProps, type SkeletonProps, SkeletonTableRow, type SkeletonTableRowProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stack, type StackProps, Switch, type SwitchProps, TableNamespace as Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeContext, type ThemeContextValue, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipArrow, TooltipContent, type TooltipContentProps, TooltipPortal, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, TopBar, TopBarBrand, type TopBarBrandProps, TopBarDivider, type TopBarDividerProps, TopBarNav, TopBarNavItem, type TopBarNavItemProps, type TopBarNavProps, type TopBarProps, TopBarSection, type TopBarSectionProps, Typography, type TypographyProps, UnderlineTabsContent, UnderlineTabsList, UnderlineTabsTrigger, type UnderlineTabsTriggerProps, VStack, VerticalTabs, VerticalTabsContent, VerticalTabsGroupLabel, type VerticalTabsGroupLabelProps, VerticalTabsList, VerticalTabsTrigger, type VerticalTabsTriggerProps, VirtualList, type VirtualListProps, cn, useFormControl, useSidebar, useSidebarRail, useTheme };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, AreaChart, type AreaChartProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, BarChart, type BarChartProps, Box, type BoxProps, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, BreadcrumbPage, type BreadcrumbPageProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Caption, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, type CheckboxProps, Chip, type ChipProps, CircularProgress, type CircularProgressProps, type ColumnGroupModel, type ColumnVisibilityModel, Combobox, type ComboboxMultipleProps, type ComboboxOption, type ComboboxProps, type ComboboxSingleProps, DataGrid, type DataGridProps, DataGrid as DataGridV0, DialogNamespace as Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DonutChart, type DonutChartProps, Drawer, DrawerBody, type DrawerBodyProps, DrawerClose, DrawerContent, type DrawerContentProps, DrawerDescription, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, FormControl, type FormControlProps, FormGroup, type FormGroupProps, FormHelperText, type FormHelperTextProps, FormLabel, type FormLabelProps, Grid, type GridColDef, type GridProps, type GridRenderCellParams, type GridRenderHeaderParams, type GridRowSelectionModel, type GridSpanParams, type GridValueFormatterParams, type GridValueGetterParams, H1, H2, H3, H4, H5, H6, HStack, IconButton, type IconButtonProps, IconRail, IconRailContent, type IconRailContentProps, IconRailFooter, type IconRailFooterProps, IconRailHeader, type IconRailHeaderProps, IconRailItem, type IconRailItemProps, type IconRailProps, Input, InputAdornment, type InputAdornmentProps, type InputProps, Label, type LabelProps, LineChart, type LineChartProps, LinearProgress, type LinearProgressProps, List, ListDivider, type ListDividerProps, ListItem, ListItemAvatar, type ListItemAvatarProps, ListItemButton, type ListItemButtonProps, ListItemIcon, type ListItemIconProps, type ListItemProps, ListItemText, type ListItemTextProps, type ListProps, ListSubheader, type ListSubheaderProps, MultiProgressDonut, type MultiProgressDonutProps, NativeSelect, NativeSelectOption, type NativeSelectOptionProps, type NativeSelectProps, PackedBubbleChart, type PackedBubbleChartProps, type PackedBubbleDataItem, PaginationNamespace as Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, type PaginationLinkProps, type PaginationModel, PaginationNext, PaginationPrevious, type PaginationProps, PieChart, type PieChartProps, type PinnedColumnsModel, type PinnedRowsModel, Playground, Progress, ProgressCard, type ProgressCardProps, ProgressDonut, type ProgressDonutProps, type ProgressProps, RadarChart, type RadarChartProps, Radio, RadioGroup, RadioGroupItem, type RadioGroupItemProps, type RadioGroupProps, type RadioProps, RailPanel, RailPanelGroup, type RailPanelGroupProps, RailPanelItem, type RailPanelItemProps, type RailPanelProps, RangeSlider, type RangeSliderProps, ScatterChart, type ScatterChartProps, SelectNamespace as Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, type SeparatorProps, Sheet, SheetBody, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Sidebar, SidebarContent, type SidebarContentProps, SidebarFooter, type SidebarFooterProps, SidebarGroup, type SidebarGroupProps, SidebarHeader, type SidebarHeaderProps, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarRail, type SidebarRailProps, SidebarSubMenu, type SidebarSubMenuProps, SidebarToggle, type SidebarToggleProps, Skeleton, SkeletonAvatar, type SkeletonAvatarProps, SkeletonCard, type SkeletonCardProps, type SkeletonProps, SkeletonTableRow, type SkeletonTableRowProps, SkeletonText, type SkeletonTextProps, Slider, type SliderProps, Spinner, type SpinnerProps, Stack, type StackProps, Switch, type SwitchProps, TableNamespace as Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextField, type TextFieldProps, Textarea, type TextareaProps, ThemeContext, type ThemeContextValue, ThemeProvider, type ThemeProviderProps, Tooltip, TooltipArrow, TooltipContent, type TooltipContentProps, TooltipPortal, type TooltipProps, TooltipProvider, TooltipRoot, TooltipTrigger, TopBar, TopBarBrand, type TopBarBrandProps, TopBarDivider, type TopBarDividerProps, TopBarNav, TopBarNavItem, type TopBarNavItemProps, type TopBarNavProps, type TopBarProps, TopBarSection, type TopBarSectionProps, Typography, type TypographyProps, UnderlineTabsContent, UnderlineTabsList, UnderlineTabsTrigger, type UnderlineTabsTriggerProps, VStack, VerticalTabs, VerticalTabsContent, VerticalTabsGroupLabel, type VerticalTabsGroupLabelProps, VerticalTabsList, VerticalTabsTrigger, type VerticalTabsTriggerProps, VirtualList, type VirtualListProps, cn, useFormControl, useSidebar, useSidebarRail, useTheme };

package/dist/index.js

@@ -865,28 +865,35 @@ Caption.displayName = "Caption";
 // src/components/button.tsx
 import * as React6 from "react";
 import { jsx as jsx6 } from "react/jsx-runtime";
+var ButtonGroupContext = React6.createContext({});
+var useButtonGroup = () => React6.useContext(ButtonGroupContext);
 var Button = React6.forwardRef(
-  ({ className, variant = "default", size = "default", fullWidth = false, ...props }, ref) => {
+  ({ className, variant, size, fullWidth = false, disabled, ...props }, ref) => {
+    const groupCtx = useButtonGroup();
+    const resolvedVariant = variant ?? groupCtx.variant ?? "default";
+    const resolvedSize = size ?? groupCtx.size ?? "default";
+    const resolvedDisabled = disabled ?? groupCtx.disabled;
     return /* @__PURE__ */ jsx6(
       "button",
       {
+        disabled: resolvedDisabled,
         className: cn(
           "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors cursor-pointer",
           "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
           "disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed",
           {
-            "bg-accent text-accent-foreground hover:bg-accent-hover": variant === "default",
-            "bg-destructive text-destructive-foreground hover:bg-destructive/90": variant === "destructive",
-            "border border-input bg-background hover:bg-muted hover:text-foreground": variant === "outline",
-            "bg-muted text-foreground hover:bg-muted/80": variant === "secondary",
-            "hover:bg-muted hover:text-foreground": variant === "ghost",
-            "text-accent underline-offset-4 hover:underline": variant === "link"
+            "bg-accent text-accent-foreground hover:bg-accent-hover": resolvedVariant === "default",
+            "bg-destructive text-destructive-foreground hover:bg-destructive/90": resolvedVariant === "destructive",
+            "border border-input bg-background hover:bg-muted hover:text-foreground": resolvedVariant === "outline",
+            "bg-muted text-foreground hover:bg-muted/80": resolvedVariant === "secondary",
+            "hover:bg-muted hover:text-foreground": resolvedVariant === "ghost",
+            "text-accent underline-offset-4 hover:underline": resolvedVariant === "link"
           },
           {
-            "h-10 px-4 py-2": size === "default",
-            "h-9 rounded-md px-3": size === "sm",
-            "h-11 rounded-md px-8": size === "lg",
-            "h-10 w-10": size === "icon"
+            "h-10 px-4 py-2": resolvedSize === "default",
+            "h-9 rounded-md px-3": resolvedSize === "sm",
+            "h-11 rounded-md px-8": resolvedSize === "lg",
+            "h-10 w-10": resolvedSize === "icon"
           },
           fullWidth && "w-full",
           className
@@ -932,6 +939,54 @@ var IconButton = React6.forwardRef(
   }
 );
 IconButton.displayName = "IconButton";
+var ButtonGroup = React6.forwardRef(
+  ({
+    className,
+    variant,
+    size,
+    orientation = "horizontal",
+    disabled,
+    fullWidth = false,
+    children,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsx6(ButtonGroupContext.Provider, { value: { variant, size, disabled }, children: /* @__PURE__ */ jsx6(
+      "div",
+      {
+        ref,
+        role: "group",
+        className: cn(
+          "inline-flex",
+          orientation === "vertical" && "flex-col",
+          fullWidth && "flex w-full",
+          // Horizontal: collapse inner borders and strip inner radius
+          orientation === "horizontal" && [
+            "[&>*:not(:first-child)]:rounded-l-none",
+            "[&>*:not(:last-child)]:rounded-r-none",
+            "[&>*:not(:first-child)]:-ml-px",
+            // Bring hovered/focused button's border to front
+            "[&>*]:relative",
+            "[&>*:hover]:z-10",
+            "[&>*:focus-visible]:z-10"
+          ],
+          // Vertical: collapse inner borders and strip inner radius
+          orientation === "vertical" && [
+            "[&>*:not(:first-child)]:rounded-t-none",
+            "[&>*:not(:last-child)]:rounded-b-none",
+            "[&>*:not(:first-child)]:-mt-px",
+            "[&>*]:relative",
+            "[&>*:hover]:z-10",
+            "[&>*:focus-visible]:z-10"
+          ],
+          className
+        ),
+        ...props,
+        children
+      }
+    ) });
+  }
+);
+ButtonGroup.displayName = "ButtonGroup";
 
 // src/components/input.tsx
 import * as React7 from "react";
@@ -2222,7 +2277,7 @@ var DialogContent = React24.forwardRef(({ className, children, hideCloseButton =
     {
       ref,
       className: cn(
-        "fixed z-50 grid w-full gap-4 p-6 shadow-lg",
+        "fixed z-50 flex flex-col w-full gap-4 p-6 shadow-lg",
         "bg-popover border border-border text-popover-foreground",
         "rounded-lg",
         "data-[state=open]:animate-zoom-in data-[state=closed]:animate-zoom-out",
@@ -2230,8 +2285,8 @@ var DialogContent = React24.forwardRef(({ className, children, hideCloseButton =
         size === "sm" && "left-1/2 top-1/2 max-w-sm -translate-x-1/2 -translate-y-1/2",
         size === "md" && "left-1/2 top-1/2 max-w-md -translate-x-1/2 -translate-y-1/2",
         size === "lg" && "left-1/2 top-1/2 max-w-lg -translate-x-1/2 -translate-y-1/2",
-        size === "xl" && "left-1/2 top-1/2 max-w-xl -translate-x-1/2 -translate-y-1/2",
-        size === "2xl" && "left-1/2 top-1/2 max-w-2xl -translate-x-1/2 -translate-y-1/2",
+        size === "xl" && "left-1/2 top-[5vh] max-w-xl max-h-[90vh] -translate-x-1/2",
+        size === "2xl" && "left-1/2 top-[5vh] max-w-2xl max-h-[90vh] -translate-x-1/2",
         size === "full" && "inset-0 h-full w-full max-w-full rounded-none",
         className
       ),
@@ -5503,6 +5558,12 @@ function DataGrid({
     return computeRowSpanMap(table.getRowModel().rows, columns);
   }, [table.getRowModel().rows, columns]);
   const hasColSpan = React36.useMemo(() => columns.some((col) => col.colSpan), [columns]);
+  const totalColumnsWidth = React36.useMemo(() => {
+    return table.getVisibleLeafColumns().reduce((sum, column) => {
+      const colWidth = columnWidths.get(column.id);
+      return sum + (colWidth?.width || column.getSize());
+    }, 0);
+  }, [table.getVisibleLeafColumns(), columnWidths]);
   const containerStyle = {
     ...sx
   };
@@ -5515,7 +5576,7 @@ function DataGrid({
     "div",
     {
       className: cn(
-        "rounded-lg border border-border bg-background overflow-hidden flex flex-col text-xs",
+        "rounded-lg border border-border bg-background flex flex-col text-xs",
         className
       ),
       style: containerStyle,
@@ -5539,167 +5600,174 @@ function DataGrid({
             moreOptions
           }
         ),
-        /* @__PURE__ */ jsxs22(
+        /* @__PURE__ */ jsx36("div", { className: "flex-1 flex flex-col min-h-0 overflow-hidden", children: /* @__PURE__ */ jsxs22(
           "div",
           {
             ref: tableContainerRef,
             className: "relative flex-1 overflow-auto",
             children: [
               loading && /* @__PURE__ */ jsx36("div", { className: "absolute inset-0 bg-background/80 flex items-center justify-center z-10", children: /* @__PURE__ */ jsx36(Spinner, { size: "lg" }) }),
-              /* @__PURE__ */ jsxs22("table", { className: "w-full border-separate border-spacing-0 table-fixed", children: [
-                /* @__PURE__ */ jsx36("colgroup", { children: table.getVisibleLeafColumns().map((column) => {
-                  const colWidth = columnWidths.get(column.id);
-                  return /* @__PURE__ */ jsx36(
-                    "col",
-                    {
-                      style: {
-                        width: colWidth?.width || column.getSize(),
-                        minWidth: colWidth?.minWidth || column.columnDef.minSize,
-                        maxWidth: colWidth?.maxWidth || column.columnDef.maxSize
+              /* @__PURE__ */ jsxs22(
+                "table",
+                {
+                  className: "border-separate border-spacing-0 table-fixed",
+                  style: { width: totalColumnsWidth, minWidth: "100%" },
+                  children: [
+                    /* @__PURE__ */ jsx36("colgroup", { children: table.getVisibleLeafColumns().map((column) => {
+                      const colWidth = columnWidths.get(column.id);
+                      return /* @__PURE__ */ jsx36(
+                        "col",
+                        {
+                          style: {
+                            width: colWidth?.width || column.getSize(),
+                            minWidth: colWidth?.minWidth || column.columnDef.minSize,
+                            maxWidth: colWidth?.maxWidth || column.columnDef.maxSize
+                          }
+                        },
+                        column.id
+                      );
+                    }) }),
+                    /* @__PURE__ */ jsxs22("thead", { className: "sticky top-0 z-[3] bg-muted", children: [
+                      columnGroupingModel && columnGroupingModel.length > 0 && /* @__PURE__ */ jsx36(
+                        ColumnGroupHeader,
+                        {
+                          columnGroupingModel,
+                          columns,
+                          columnWidths,
+                          showColumnVerticalBorder,
+                          rowHeight,
+                          columnVisibility,
+                          checkboxSelection,
+                          pinnedColumnOffsets
+                        }
+                      ),
+                      table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx36("tr", { className: "bg-muted", children: headerGroup.headers.map((header) => {
+                        const meta = header.column.columnDef.meta;
+                        const align = meta?.headerAlign || meta?.align || "left";
+                        const colWidth = columnWidths.get(header.column.id);
+                        const effectiveWidth = colWidth?.width || header.getSize();
+                        const pinnedInfo = pinnedColumnOffsets?.get(header.column.id);
+                        return /* @__PURE__ */ jsxs22(
+                          "th",
+                          {
+                            className: cn(
+                              "px-4 text-left text-xs font-medium text-muted-foreground border-b border-border bg-muted overflow-hidden relative",
+                              showColumnVerticalBorder && "border-r last:border-r-0",
+                              header.column.getCanSort() && "cursor-pointer select-none hover:bg-muted/80",
+                              // Add cursor class when resizing
+                              header.column.getIsResizing() && "cursor-col-resize",
+                              // Pinned column styling
+                              pinnedInfo && "sticky z-[4]",
+                              pinnedInfo?.side === "left" && "border-r border-border",
+                              pinnedInfo?.side === "right" && "border-l border-border"
+                            ),
+                            style: {
+                              height: rowHeight,
+                              width: effectiveWidth,
+                              minWidth: colWidth?.minWidth || header.column.columnDef.minSize,
+                              maxWidth: colWidth?.maxWidth || header.column.columnDef.maxSize,
+                              textAlign: align,
+                              ...pinnedInfo ? {
+                                position: "sticky",
+                                [pinnedInfo.side]: pinnedInfo.offset
+                              } : {}
+                            },
+                            onClick: header.column.getToggleSortingHandler(),
+                            children: [
+                              /* @__PURE__ */ jsxs22("div", { className: cn(
+                                "flex items-center gap-1 truncate",
+                                align === "center" && "justify-center",
+                                align === "right" && "justify-end"
+                              ), children: [
+                                header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()),
+                                header.column.getCanSort() && /* @__PURE__ */ jsx36(SortIcon, { direction: header.column.getIsSorted() })
+                              ] }),
+                              resizableColumns && header.column.id !== "__select__" && /* @__PURE__ */ jsx36(
+                                ColumnResizeHandle,
+                                {
+                                  header,
+                                  isResizing: header.column.getIsResizing()
+                                }
+                              )
+                            ]
+                          },
+                          header.id
+                        );
+                      }) }, headerGroup.id))
+                    ] }),
+                    pinnedTopTable && pinnedTopTable.length > 0 && /* @__PURE__ */ jsx36(
+                      PinnedRowsRenderer,
+                      {
+                        pinnedData: pinnedTopTable,
+                        columns,
+                        tanstackColumns,
+                        getRowId,
+                        rowHeight,
+                        showCellVerticalBorder,
+                        getRowClassName,
+                        globalWrapText: wrapText,
+                        columnWidths,
+                        pinnedColumnOffsets,
+                        columnVisibility,
+                        position: "top"
                       }
-                    },
-                    column.id
-                  );
-                }) }),
-                /* @__PURE__ */ jsxs22("thead", { className: "sticky top-0 z-[3] bg-muted", children: [
-                  columnGroupingModel && columnGroupingModel.length > 0 && /* @__PURE__ */ jsx36(
-                    ColumnGroupHeader,
-                    {
-                      columnGroupingModel,
-                      columns,
-                      columnWidths,
-                      showColumnVerticalBorder,
-                      rowHeight,
-                      columnVisibility,
-                      checkboxSelection,
-                      pinnedColumnOffsets
-                    }
-                  ),
-                  table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx36("tr", { className: "bg-muted", children: headerGroup.headers.map((header) => {
-                    const meta = header.column.columnDef.meta;
-                    const align = meta?.headerAlign || meta?.align || "left";
-                    const colWidth = columnWidths.get(header.column.id);
-                    const effectiveWidth = colWidth?.width || header.getSize();
-                    const pinnedInfo = pinnedColumnOffsets?.get(header.column.id);
-                    return /* @__PURE__ */ jsxs22(
-                      "th",
+                    ),
+                    effectiveVirtualized ? /* @__PURE__ */ jsx36(
+                      VirtualizedTableBody,
                       {
-                        className: cn(
-                          "px-4 text-left text-xs font-medium text-muted-foreground border-b border-border bg-muted overflow-hidden relative",
-                          showColumnVerticalBorder && "border-r last:border-r-0",
-                          header.column.getCanSort() && "cursor-pointer select-none hover:bg-muted/80",
-                          // Add cursor class when resizing
-                          header.column.getIsResizing() && "cursor-col-resize",
-                          // Pinned column styling
-                          pinnedInfo && "sticky z-[4]",
-                          pinnedInfo?.side === "left" && "border-r border-border",
-                          pinnedInfo?.side === "right" && "border-l border-border"
-                        ),
-                        style: {
-                          height: rowHeight,
-                          width: effectiveWidth,
-                          minWidth: colWidth?.minWidth || header.column.columnDef.minSize,
-                          maxWidth: colWidth?.maxWidth || header.column.columnDef.maxSize,
-                          textAlign: align,
-                          ...pinnedInfo ? {
-                            position: "sticky",
-                            [pinnedInfo.side]: pinnedInfo.offset
-                          } : {}
-                        },
-                        onClick: header.column.getToggleSortingHandler(),
-                        children: [
-                          /* @__PURE__ */ jsxs22("div", { className: cn(
-                            "flex items-center gap-1 truncate",
-                            align === "center" && "justify-center",
-                            align === "right" && "justify-end"
-                          ), children: [
-                            header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()),
-                            header.column.getCanSort() && /* @__PURE__ */ jsx36(SortIcon, { direction: header.column.getIsSorted() })
-                          ] }),
-                          resizableColumns && header.column.id !== "__select__" && /* @__PURE__ */ jsx36(
-                            ColumnResizeHandle,
-                            {
-                              header,
-                              isResizing: header.column.getIsResizing()
-                            }
-                          )
-                        ]
-                      },
-                      header.id
-                    );
-                  }) }, headerGroup.id))
-                ] }),
-                pinnedTopTable && pinnedTopTable.length > 0 && /* @__PURE__ */ jsx36(
-                  PinnedRowsRenderer,
-                  {
-                    pinnedData: pinnedTopTable,
-                    columns,
-                    tanstackColumns,
-                    getRowId,
-                    rowHeight,
-                    showCellVerticalBorder,
-                    getRowClassName,
-                    globalWrapText: wrapText,
-                    columnWidths,
-                    pinnedColumnOffsets,
-                    columnVisibility,
-                    position: "top"
-                  }
-                ),
-                effectiveVirtualized ? /* @__PURE__ */ jsx36(
-                  VirtualizedTableBody,
-                  {
-                    table,
-                    rowHeight,
-                    showCellVerticalBorder,
-                    checkboxSelection,
-                    disableRowSelectionOnClick,
-                    getRowClassName,
-                    overscan,
-                    parentRef: tableContainerRef,
-                    globalWrapText: wrapText,
-                    columnWidths,
-                    pinnedColumnOffsets,
-                    rowSpanMap,
-                    gridColumns: hasColSpan ? columns : void 0
-                  }
-                ) : /* @__PURE__ */ jsx36(
-                  StandardTableBody,
-                  {
-                    table,
-                    rowHeight,
-                    showCellVerticalBorder,
-                    checkboxSelection,
-                    disableRowSelectionOnClick,
-                    getRowClassName,
-                    globalWrapText: wrapText,
-                    columnWidths,
-                    pinnedColumnOffsets,
-                    rowSpanMap,
-                    gridColumns: hasColSpan ? columns : void 0
-                  }
-                ),
-                pinnedBottomTable && pinnedBottomTable.length > 0 && /* @__PURE__ */ jsx36(
-                  PinnedRowsRenderer,
-                  {
-                    pinnedData: pinnedBottomTable,
-                    columns,
-                    tanstackColumns,
-                    getRowId,
-                    rowHeight,
-                    showCellVerticalBorder,
-                    getRowClassName,
-                    globalWrapText: wrapText,
-                    columnWidths,
-                    pinnedColumnOffsets,
-                    columnVisibility,
-                    position: "bottom"
-                  }
-                )
-              ] })
+                        table,
+                        rowHeight,
+                        showCellVerticalBorder,
+                        checkboxSelection,
+                        disableRowSelectionOnClick,
+                        getRowClassName,
+                        overscan,
+                        parentRef: tableContainerRef,
+                        globalWrapText: wrapText,
+                        columnWidths,
+                        pinnedColumnOffsets,
+                        rowSpanMap,
+                        gridColumns: hasColSpan ? columns : void 0
+                      }
+                    ) : /* @__PURE__ */ jsx36(
+                      StandardTableBody,
+                      {
+                        table,
+                        rowHeight,
+                        showCellVerticalBorder,
+                        checkboxSelection,
+                        disableRowSelectionOnClick,
+                        getRowClassName,
+                        globalWrapText: wrapText,
+                        columnWidths,
+                        pinnedColumnOffsets,
+                        rowSpanMap,
+                        gridColumns: hasColSpan ? columns : void 0
+                      }
+                    ),
+                    pinnedBottomTable && pinnedBottomTable.length > 0 && /* @__PURE__ */ jsx36(
+                      PinnedRowsRenderer,
+                      {
+                        pinnedData: pinnedBottomTable,
+                        columns,
+                        tanstackColumns,
+                        getRowId,
+                        rowHeight,
+                        showCellVerticalBorder,
+                        getRowClassName,
+                        globalWrapText: wrapText,
+                        columnWidths,
+                        pinnedColumnOffsets,
+                        columnVisibility,
+                        position: "bottom"
+                      }
+                    )
+                  ]
+                }
+              )
             ]
           }
-        ),
+        ) }),
         !effectiveVirtualized && !hideFooter && !hideFooterPagination && /* @__PURE__ */ jsx36(
           DataGridPagination,
           {
@@ -8670,6 +8738,7 @@ export {
   BreadcrumbSeparator,
   Breadcrumbs,
   Button,
+  ButtonGroup,
   Caption,
   Card,
   CardContent,