@humain/ui 2.1.63 → 2.1.65

package/dist/index191.js

@@ -1,280 +1,799 @@
-"use client";
 import { cn } from "./index2.js";
-import { Kbd } from "./index106.js";
-import { Check, ChevronRight } from "lucide-react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { Menu as Menu$1 } from "@base-ui/react/menu";
-//#region src/components/organisms/menus/DropdownMenu/DropdownMenu.tsx
-function DropdownMenuRoot({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Root, {
-		"data-slot": "dropdown-menu-root",
-		...props
-	});
+import { Pagination } from "./index135.js";
+import { Checkbox } from "./index161.js";
+import { Table as TableNamespace, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./index178.js";
+import { Tooltip as TooltipCompound } from "./index188.js";
+import { dataTableTouchTargetClassName } from "./index189.js";
+import { DataTableActionsCell, DataTableAvatarCell, DataTableBadgesCell, DataTableCell, DataTableCellRoot, DataTableProgressCell, DataTableRatingCell, DataTableSparklineCell, DataTableSwitchCell, DataTableTextCell, DataTableTrendCell } from "./index190.js";
+import { cva } from "class-variance-authority";
+import { ArrowDown, ArrowUp, ChevronRight, ChevronsUpDown, CircleHelp } from "lucide-react";
+import * as React from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { flexRender, getCoreRowModel, getExpandedRowModel, getFilteredRowModel, getGroupedRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from "@tanstack/react-table";
+import { useVirtualizer } from "@tanstack/react-virtual";
+//#region src/components/organisms/content/DataTable/DataTable.tsx
+var responsiveColumnBreakpointClasses = {
+	sm: "@sm:table-cell",
+	md: "@md:table-cell",
+	lg: "@lg:table-cell"
+};
+var responsiveColumnVisibilitySlots = [
+	"base",
+	"sm",
+	"md",
+	"lg"
+];
+var responsiveColumnVisibilityRanks = {
+	base: 0,
+	sm: 1,
+	md: 2,
+	lg: 3
+};
+var dataTableVariants = cva("w-full", {
+	variants: {
+		/** Visual style for row separation */
+		dividers: {
+			/** Border line between rows */
+			line: "",
+			/** Alternating row background fills */
+			alternating: ""
+		},
+		/** Table density */
+		density: {
+			default: "",
+			compact: ""
+		}
+	},
+	defaultVariants: {
+		dividers: "line",
+		density: "default"
+	}
+});
+var dataTableContainerVariants = cva("bg-card", {
+	variants: {
+		/** Border radius configuration */
+		rounded: {
+			/** Rounded on all corners (default) */
+			all: "rounded-xl",
+			/** No rounding on any corner */
+			none: "rounded-none",
+			/** Only top corners rounded */
+			top: "rounded-t-xl rounded-b-none",
+			/** Only bottom corners rounded (for embedding in cards with headers) */
+			bottom: "rounded-t-none rounded-b-xl"
+		},
+		/** Whether to show the outer border */
+		bordered: {
+			true: "border border-border shadow-xs",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		rounded: "all",
+		bordered: true
+	}
+});
+var dataTableRowVariants = cva("transition-colors duration-150 ease-out motion-reduce:transition-none", {
+	variants: {
+		dividers: {
+			line: "border-b border-border-subtle",
+			alternating: "border-0"
+		},
+		density: {
+			default: "",
+			compact: ""
+		},
+		isEven: {
+			true: "",
+			false: ""
+		},
+		isSelected: {
+			true: "bg-muted dark:bg-accent shadow-[inset_3px_0_0_0_var(--color-primary)] rtl:shadow-[inset_-3px_0_0_0_var(--color-primary)]",
+			false: ""
+		}
+	},
+	compoundVariants: [{
+		dividers: "alternating",
+		isEven: true,
+		isSelected: false,
+		className: "bg-muted"
+	}, {
+		dividers: "alternating",
+		isEven: false,
+		isSelected: false,
+		className: "bg-background dark:bg-card"
+	}],
+	defaultVariants: {
+		dividers: "line",
+		density: "default",
+		isEven: false,
+		isSelected: false
+	}
+});
+var dataTableCellVariants = cva("align-middle", {
+	variants: { density: {
+		default: "h-[72px] ps-4 pe-4 py-3 @md:ps-6 @md:pe-6 @md:py-3",
+		compact: "h-14 ps-4 pe-4 py-2"
+	} },
+	defaultVariants: { density: "default" }
+});
+var dataTableHeaderCellVariants = cva("text-sm font-medium text-muted-foreground", {
+	variants: { density: {
+		default: "h-11 ps-6 pe-6 py-3",
+		compact: "h-11 ps-4 pe-4 py-2"
+	} },
+	defaultVariants: { density: "default" }
+});
+function getStickyCellClass({ stickyFirstColumn, stickyLastColumn, isFirstColumn, isLastColumn, isSelected }) {
+	if (!(stickyFirstColumn && isFirstColumn || stickyLastColumn && isLastColumn)) return;
+	return cn("sticky z-20", stickyFirstColumn && isFirstColumn && "start-0", stickyLastColumn && isLastColumn && "end-0", isSelected ? "bg-muted dark:bg-accent" : "bg-background dark:bg-card");
 }
-DropdownMenuRoot.displayName = "DropdownMenu.Root";
-function DropdownMenuPortal({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Portal, {
-		"data-slot": "dropdown-menu-portal",
-		...props
-	});
+function getResponsiveColumnPriority(priority) {
+	switch (priority) {
+		case "always":
+		case "desktop":
+		case "mobile": return priority;
+		default: return;
+	}
 }
-DropdownMenuPortal.displayName = "DropdownMenu.Portal";
-function DropdownMenuTrigger({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Trigger, {
-		"data-slot": "dropdown-menu-trigger",
-		...props
-	});
+function getResponsiveColumnHideBelow(hideBelow) {
+	switch (hideBelow) {
+		case "sm":
+		case "md":
+		case "lg": return hideBelow;
+		default: return;
+	}
 }
-DropdownMenuTrigger.displayName = "DropdownMenu.Trigger";
-function DropdownMenuGroup({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Group, {
-		"data-slot": "dropdown-menu-group",
-		...props
-	});
+function isColumnVisibleInResponsiveSlot(responsive, enabled, slot) {
+	if (!enabled || !responsive) return true;
+	const priority = getResponsiveColumnPriority(responsive.priority);
+	if (priority === "always") return true;
+	if (priority === "mobile") return slot === "base" || slot === "sm";
+	const hideBelow = getResponsiveColumnHideBelow(responsive.hideBelow) ?? "md";
+	return responsiveColumnVisibilityRanks[slot] >= responsiveColumnVisibilityRanks[hideBelow];
 }
-DropdownMenuGroup.displayName = "DropdownMenu.Group";
-function DropdownMenuSub({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.SubmenuRoot, {
-		"data-slot": "dropdown-menu-sub",
-		...props
-	});
+function withResponsiveSlotVariant(slot, className) {
+	if (slot === "base") return className;
+	return className.split(" ").map((token) => `@${slot}:${token}`).join(" ");
 }
-DropdownMenuSub.displayName = "DropdownMenu.Sub";
-function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
-	return /* @__PURE__ */ jsxs(Menu$1.SubmenuTrigger, {
-		"data-slot": "dropdown-menu-sub-trigger",
-		"data-inset": inset,
-		className: cn("focus:bg-accent focus:text-accent-foreground data-open:bg-accent data-open:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-2 rounded-sm px-2 py-2 text-sm [&_svg:not([class*='size-'])]:size-4 group/dd-sub flex cursor-default items-center outline-hidden select-none data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-[color,background-color,transform] duration-150 active:scale-[0.99]", className),
-		...props,
-		children: [children, /* @__PURE__ */ jsx(ChevronRight, { className: "ms-auto rtl:rotate-180 transition-transform duration-150 group-data-open/dd-sub:translate-x-0.5" })]
-	});
+function getResponsiveStickyStateClass({ backgroundClass, side, slots, zIndexClass }) {
+	if (!slots.length) return;
+	const stickySlots = new Set(slots);
+	const classes = [];
+	let wasSticky = false;
+	for (const slot of responsiveColumnVisibilitySlots) {
+		const isSticky = stickySlots.has(slot);
+		if (isSticky && !wasSticky) classes.push(withResponsiveSlotVariant(slot, cn("sticky", zIndexClass, `${side}-0`, backgroundClass)));
+		else if (!isSticky && wasSticky) classes.push(withResponsiveSlotVariant(slot, "static z-auto start-auto end-auto"));
+		wasSticky = isSticky;
+	}
+	return cn(classes);
 }
-DropdownMenuSubTrigger.displayName = "DropdownMenu.SubTrigger";
-function DropdownMenuRadioGroup({ ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.RadioGroup, {
-		"data-slot": "dropdown-menu-radio-group",
-		...props
-	});
+function addResponsiveStickySlot(slotMap, item, getId, slot, slotKey) {
+	if (!item) return;
+	const itemId = getId(item);
+	const itemSlots = slotMap.get(itemId) ?? {
+		firstSlots: [],
+		lastSlots: []
+	};
+	itemSlots[slotKey].push(slot);
+	slotMap.set(itemId, itemSlots);
 }
-DropdownMenuRadioGroup.displayName = "DropdownMenu.RadioGroup";
-function DropdownMenuRadioItem({ className, children, ...props }) {
-	return /* @__PURE__ */ jsxs(Menu$1.RadioItem, {
-		"data-slot": "dropdown-menu-radio-item",
-		className: cn("focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-sm py-2 pe-8 ps-2 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150", className),
-		...props,
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "pointer-events-none absolute end-2 flex items-center justify-center",
-			"data-slot": "dropdown-menu-radio-item-indicator",
-			children: /* @__PURE__ */ jsx(Menu$1.RadioItemIndicator, {
-				className: "animate-in zoom-in-75 duration-150 motion-reduce:animate-none",
-				children: /* @__PURE__ */ jsx(Check, {})
-			})
-		}), children]
-	});
+function getResponsiveStickySlotsById({ enabled, getId, getResponsive, items, stickyFirstColumn, stickyLastColumn }) {
+	const slotMap = /* @__PURE__ */ new Map();
+	if (!enabled || !(stickyFirstColumn || stickyLastColumn)) return slotMap;
+	for (const slot of responsiveColumnVisibilitySlots) {
+		const visibleItems = items.filter((item) => isColumnVisibleInResponsiveSlot(getResponsive(item), enabled, slot));
+		if (stickyFirstColumn) addResponsiveStickySlot(slotMap, visibleItems[0], getId, slot, "firstSlots");
+		if (stickyLastColumn) addResponsiveStickySlot(slotMap, visibleItems.at(-1), getId, slot, "lastSlots");
+	}
+	return slotMap;
 }
-DropdownMenuRadioItem.displayName = "DropdownMenu.RadioItem";
-function DropdownMenuCheckboxItem({ className, children, checked, ...props }) {
-	return /* @__PURE__ */ jsxs(Menu$1.CheckboxItem, {
-		"data-slot": "dropdown-menu-checkbox-item",
-		className: cn("focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground gap-2 rounded-sm py-2 pe-8 ps-2 text-sm [&_svg:not([class*='size-'])]:size-4 relative flex cursor-default items-center outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 transition-colors duration-150", className),
-		checked,
-		...props,
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "pointer-events-none absolute end-2 flex items-center justify-center",
-			"data-slot": "dropdown-menu-checkbox-item-indicator",
-			children: /* @__PURE__ */ jsx(Menu$1.CheckboxItemIndicator, {
-				className: "animate-in zoom-in-75 duration-150 motion-reduce:animate-none",
-				children: /* @__PURE__ */ jsx(Check, {})
-			})
-		}), children]
-	});
+function getResponsiveStickyClass({ backgroundClass, firstSlots, lastSlots, zIndexClass = "z-20" }) {
+	return cn(getResponsiveStickyStateClass({
+		backgroundClass,
+		side: "start",
+		slots: firstSlots,
+		zIndexClass
+	}), getResponsiveStickyStateClass({
+		backgroundClass,
+		side: "end",
+		slots: lastSlots,
+		zIndexClass
+	}));
 }
-DropdownMenuCheckboxItem.displayName = "DropdownMenu.CheckboxItem";
-function DropdownMenuShortcut({ className, ...props }) {
-	return /* @__PURE__ */ jsx("span", {
-		"data-slot": "dropdown-menu-shortcut",
-		className: cn("text-muted-foreground group-focus/dropdown-menu-item:text-accent-foreground ms-auto text-xs tracking-widest", className),
-		...props
-	});
+function getHeaderCellWidth(size) {
+	if (size === 150) return;
+	return size;
 }
-DropdownMenuShortcut.displayName = "DropdownMenu.Shortcut";
-var popupWidthClasses = {
-	auto: "",
-	sm: "w-48",
-	md: "w-56",
-	lg: "w-64"
-};
-function DropdownMenuPopup({ align = "start", alignOffset = 0, side = "bottom", sideOffset = 4, width = "auto", className, ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Portal, { children: /* @__PURE__ */ jsx(Menu$1.Positioner, {
-		className: "isolate z-50 outline-none",
-		align,
-		alignOffset,
-		side,
-		sideOffset,
-		children: /* @__PURE__ */ jsx(Menu$1.Popup, {
-			"data-slot": "dropdown-menu-popup",
-			className: cn("data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", "border border-border bg-popover text-popover-foreground min-w-32 rounded-lg p-1 shadow-sm z-50 max-h-(--available-height) w-(--anchor-width) origin-(--transform-origin) overflow-x-hidden overflow-y-auto outline-none data-closed:overflow-hidden", "duration-200 motion-reduce:animate-none", popupWidthClasses[width], className),
-			...props
-		})
-	}) });
+function getAriaSort(sortState) {
+	if (sortState === "asc") return "ascending";
+	if (sortState === "desc") return "descending";
 }
-DropdownMenuPopup.displayName = "DropdownMenu.Popup";
-function DropdownMenuSubPopup({ align = "start", alignOffset = -3, side = "right", sideOffset = 0, className, ...props }) {
-	return /* @__PURE__ */ jsx(DropdownMenuPopup, {
-		"data-slot": "dropdown-menu-sub-popup",
-		className: cn("min-w-[96px] w-auto", className),
-		align,
-		alignOffset,
-		side,
-		sideOffset,
-		...props
-	});
+function getResponsiveColumnClass(responsive, enabled) {
+	if (!enabled || !responsive) return;
+	const priority = getResponsiveColumnPriority(responsive.priority);
+	if (priority === "always") return;
+	if (priority === "mobile") return "@md:hidden";
+	return `hidden ${responsiveColumnBreakpointClasses[getResponsiveColumnHideBelow(responsive.hideBelow) ?? "md"]}`;
+}
+function getVirtualRowStyle(start, headerOffset) {
+	return {
+		display: "table",
+		position: "absolute",
+		top: 0,
+		insetInlineStart: 0,
+		width: "100%",
+		transform: `translateY(${start + headerOffset}px)`
+	};
 }
-DropdownMenuSubPopup.displayName = "DropdownMenu.SubPopup";
-function DropdownMenuHeader({ className, avatar, title, subtitle, children, ...props }) {
-	if (children) return /* @__PURE__ */ jsx("div", {
-		"data-slot": "dropdown-menu-header",
-		className: cn("border-b border-border px-4 py-3", className),
-		...props,
-		children
+var selectionCheckboxClassName = "translate-y-[2px] before:-inset-[14px] before:rounded-md";
+function createSelectColumn() {
+	return {
+		id: "select",
+		header: ({ table }) => /* @__PURE__ */ jsx(Checkbox, {
+			checked: table.getIsAllPageRowsSelected(),
+			indeterminate: table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected(),
+			onCheckedChange: (value) => table.toggleAllPageRowsSelected(!!value),
+			"aria-label": "Select all",
+			className: selectionCheckboxClassName
+		}),
+		cell: ({ row }) => /* @__PURE__ */ jsx(Checkbox, {
+			checked: row.getIsSelected(),
+			onCheckedChange: (value) => row.toggleSelected(!!value),
+			"aria-label": "Select row",
+			className: selectionCheckboxClassName
+		}),
+		enableSorting: false,
+		enableHiding: false,
+		size: 64,
+		meta: {
+			headerClassName: "w-16 min-w-16",
+			cellClassName: "w-16 min-w-16"
+		}
+	};
+}
+function HeaderTooltip({ content }) {
+	if (!content) return null;
+	return /* @__PURE__ */ jsx(TooltipCompound, {
+		trigger: /* @__PURE__ */ jsx("button", {
+			type: "button",
+			className: cn(dataTableTouchTargetClassName, "rounded-sm text-muted-foreground hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none"),
+			"aria-label": "Column information",
+			children: /* @__PURE__ */ jsx(CircleHelp, { className: "size-3.5 shrink-0" })
+		}),
+		content
 	});
-	return /* @__PURE__ */ jsx("div", {
-		"data-slot": "dropdown-menu-header",
-		className: cn("border-b border-border px-4 py-3", className),
-		...props,
-		children: /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-3",
-			children: [avatar, /* @__PURE__ */ jsxs("div", {
-				className: "flex flex-col min-w-0",
-				children: [title && /* @__PURE__ */ jsx("span", {
-					className: "text-sm font-semibold text-foreground truncate",
-					children: title
-				}), subtitle && /* @__PURE__ */ jsx("span", {
-					className: "text-sm text-muted-foreground truncate",
-					children: subtitle
-				})]
+}
+function SortableHeader({ children, column, className }) {
+	const sorted = column.getIsSorted();
+	const canSort = column.getCanSort();
+	const tooltipContent = column.columnDef?.meta?.headerTooltip;
+	if (!canSort) {
+		if (!tooltipContent) return /* @__PURE__ */ jsx("span", {
+			className,
+			children
+		});
+		return /* @__PURE__ */ jsxs("span", {
+			className: cn("inline-flex items-center gap-1", className),
+			children: [/* @__PURE__ */ jsx("span", { children }), /* @__PURE__ */ jsx(HeaderTooltip, { content: tooltipContent })]
+		});
+	}
+	return /* @__PURE__ */ jsxs("span", {
+		className: cn("inline-flex items-center gap-1", className),
+		children: [/* @__PURE__ */ jsxs("button", {
+			type: "button",
+			onClick: () => column.toggleSorting(sorted === "asc"),
+			className: cn(dataTableTouchTargetClassName, "flex items-center gap-1 text-start hover:text-foreground transition-colors duration-150 ease-out motion-reduce:transition-none -ms-1 ps-1 -me-1 pe-1 -my-0.5 py-0.5 rounded focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.97] motion-reduce:active:scale-100"),
+			children: [children, /* @__PURE__ */ jsxs("span", {
+				className: "relative size-4",
+				children: [
+					/* @__PURE__ */ jsx(ArrowUp, { className: cn("absolute inset-0 size-4 text-text-quaternary transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", sorted === "asc" ? "opacity-100 translate-y-0" : "opacity-0 -translate-y-1") }),
+					/* @__PURE__ */ jsx(ArrowDown, { className: cn("absolute inset-0 size-4 text-text-quaternary transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", sorted === "desc" ? "opacity-100 translate-y-0" : "opacity-0 translate-y-1") }),
+					/* @__PURE__ */ jsx(ChevronsUpDown, { className: cn("absolute inset-0 size-4 transition-opacity duration-200 ease-out motion-reduce:transition-none", sorted ? "opacity-0" : "opacity-100 text-muted-foreground") })
+				]
 			})]
-		})
+		}), /* @__PURE__ */ jsx(HeaderTooltip, { content: tooltipContent })]
 	});
 }
-DropdownMenuHeader.displayName = "DropdownMenu.Header";
-/**
-* Enhanced DropdownMenuLabel
-*/
-function DropdownMenuLabel({ className, inset, ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.GroupLabel, {
-		"data-slot": "dropdown-menu-label",
-		"data-inset": inset,
-		className: cn("px-4 py-2 text-xs font-medium text-text-quaternary uppercase tracking-wider", "data-[inset]:ps-8", className),
-		...props
-	});
+function DataTableGroupHeader({ row, visibleColumnCount, customHeader }) {
+	return /* @__PURE__ */ jsx(Fragment, { children: customHeader(row, visibleColumnCount) });
 }
-DropdownMenuLabel.displayName = "DropdownMenu.Label";
-function DropdownMenuItem({ className, icon, shortcut, destructive = false, render, inset, variant = "default", children, ...props }) {
-	const isDestructive = destructive || variant === "destructive";
-	return /* @__PURE__ */ jsxs(Menu$1.Item, {
-		"data-slot": "dropdown-menu-item",
-		"data-inset": inset,
-		"data-variant": isDestructive ? "destructive" : variant,
-		className: cn("group/dropdown-menu-item relative flex items-center gap-2 mx-1.5 px-2.5 py-2 rounded-md cursor-pointer outline-none", "text-sm font-semibold text-secondary-foreground", "focus:bg-muted focus:text-secondary-foreground", "data-[disabled]:pointer-events-none data-[disabled]:opacity-50", "data-[inset]:ps-8", "[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", "transition-[color,background-color,transform] duration-150 active:scale-[0.99]", isDestructive && "text-destructive focus:text-destructive focus:bg-destructive/10", className),
-		render,
-		...props,
-		children: [
-			icon && /* @__PURE__ */ jsx("span", {
-				className: cn("size-4 shrink-0 transition-colors duration-150", isDestructive ? "text-destructive" : "text-text-quaternary group-focus/dropdown-menu-item:text-secondary-foreground"),
-				children: icon
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "flex-1",
-				children
-			}),
-			shortcut && /* @__PURE__ */ jsx(DropdownMenuShortcutBadge, {
-				className: "transition-colors duration-150 group-focus/dropdown-menu-item:bg-primary/10 group-focus/dropdown-menu-item:text-primary",
-				children: shortcut
-			})
-		]
-	});
+function DataTableControls({ table, customControls }) {
+	return /* @__PURE__ */ jsx(Fragment, { children: customControls(table) });
 }
-DropdownMenuItem.displayName = "DropdownMenu.Item";
-/**
-* Enhanced DropdownMenuSeparator
-*/
-function DropdownMenuSeparator({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Menu$1.Separator, {
-		"data-slot": "dropdown-menu-separator",
-		className: cn("my-1 h-px bg-surface-2", className),
-		...props
+function useDataTable({ columns, data, enableRowSelection = false, enableMultiRowSelection = true, rowSelection: controlledRowSelection, onRowSelectionChange, initialRowSelection = {}, showSelectAll = true, enableSorting = true, sortingMode = "client", sorting: controlledSorting, onSortingChange, initialSorting = [], enablePagination = false, paginationMode = "client", pagination: controlledPagination, onPaginationChange, pageCount: controlledPageCount, rowCount, pageSize = 10, initialPageIndex = 0, enableColumnFilters = false, filteringMode = "client", columnFilters: controlledColumnFilters, onColumnFiltersChange, initialColumnFilters = [], enableColumnVisibility = false, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, initialColumnVisibility = {}, enableGrouping = false, groupingMode = "client", grouping: controlledGrouping, onGroupingChange, initialGrouping = [], groupedColumnMode = false, expanded: controlledExpanded, onExpandedChange, initialExpanded = {}, getRowId, getSubRows }) {
+	const defaultPaginationState = React.useMemo(() => ({
+		pageIndex: initialPageIndex,
+		pageSize
+	}), [initialPageIndex, pageSize]);
+	const [internalRowSelection, setInternalRowSelection] = React.useState(initialRowSelection);
+	const [internalSorting, setInternalSorting] = React.useState(initialSorting);
+	const [internalColumnFilters, setInternalColumnFilters] = React.useState(initialColumnFilters);
+	const [internalColumnVisibility, setInternalColumnVisibility] = React.useState(initialColumnVisibility);
+	const [internalPagination, setInternalPagination] = React.useState(defaultPaginationState);
+	const [internalGrouping, setInternalGrouping] = React.useState(initialGrouping);
+	const [internalExpanded, setInternalExpanded] = React.useState(initialExpanded);
+	const rowSelection = controlledRowSelection ?? internalRowSelection;
+	const sorting = controlledSorting ?? internalSorting;
+	const columnFilters = controlledColumnFilters ?? internalColumnFilters;
+	const columnVisibility = controlledColumnVisibility ?? internalColumnVisibility;
+	const pagination = controlledPagination ?? internalPagination;
+	const grouping = controlledGrouping ?? internalGrouping;
+	const expanded = controlledExpanded ?? internalExpanded;
+	const handleRowSelectionChange = React.useCallback((updater) => {
+		if (controlledRowSelection === void 0) setInternalRowSelection(updater);
+		onRowSelectionChange?.(updater);
+	}, [controlledRowSelection, onRowSelectionChange]);
+	const handleSortingChange = React.useCallback((updater) => {
+		if (controlledSorting === void 0) setInternalSorting(updater);
+		onSortingChange?.(updater);
+	}, [controlledSorting, onSortingChange]);
+	const handleColumnFiltersChange = React.useCallback((updater) => {
+		if (controlledColumnFilters === void 0) setInternalColumnFilters(updater);
+		onColumnFiltersChange?.(updater);
+	}, [controlledColumnFilters, onColumnFiltersChange]);
+	const handleColumnVisibilityChange = React.useCallback((updater) => {
+		if (controlledColumnVisibility === void 0) setInternalColumnVisibility(updater);
+		onColumnVisibilityChange?.(updater);
+	}, [controlledColumnVisibility, onColumnVisibilityChange]);
+	const handlePaginationChange = React.useCallback((updater) => {
+		if (controlledPagination === void 0) setInternalPagination(updater);
+		onPaginationChange?.(updater);
+	}, [controlledPagination, onPaginationChange]);
+	const handleGroupingChange = React.useCallback((updater) => {
+		if (controlledGrouping === void 0) setInternalGrouping(updater);
+		onGroupingChange?.(updater);
+	}, [controlledGrouping, onGroupingChange]);
+	const handleExpandedChange = React.useCallback((updater) => {
+		if (controlledExpanded === void 0) setInternalExpanded(updater);
+		onExpandedChange?.(updater);
+	}, [controlledExpanded, onExpandedChange]);
+	const tableColumns = React.useMemo(() => {
+		if (enableRowSelection && showSelectAll) return [createSelectColumn(), ...columns];
+		return columns;
+	}, [
+		columns,
+		enableRowSelection,
+		showSelectAll
+	]);
+	const manualPagination = paginationMode === "server";
+	const manualSorting = sortingMode === "server";
+	const manualFiltering = filteringMode === "server";
+	const manualGrouping = groupingMode === "server";
+	const pageCount = React.useMemo(() => {
+		if (controlledPageCount !== void 0) return controlledPageCount;
+		if (rowCount !== void 0 && pagination.pageSize > 0) return Math.ceil(rowCount / pagination.pageSize);
+	}, [
+		controlledPageCount,
+		rowCount,
+		pagination.pageSize
+	]);
+	const table = useReactTable({
+		data,
+		columns: tableColumns,
+		state: {
+			rowSelection,
+			sorting,
+			columnFilters,
+			columnVisibility,
+			pagination,
+			grouping,
+			expanded
+		},
+		enableRowSelection,
+		enableMultiRowSelection,
+		onRowSelectionChange: handleRowSelectionChange,
+		enableSorting,
+		manualSorting,
+		onSortingChange: handleSortingChange,
+		manualPagination,
+		pageCount,
+		onPaginationChange: handlePaginationChange,
+		enableColumnFilters,
+		manualFiltering,
+		onColumnFiltersChange: handleColumnFiltersChange,
+		enableHiding: enableColumnVisibility,
+		onColumnVisibilityChange: handleColumnVisibilityChange,
+		enableGrouping,
+		manualGrouping,
+		groupedColumnMode: groupedColumnMode || void 0,
+		onGroupingChange: handleGroupingChange,
+		onExpandedChange: handleExpandedChange,
+		paginateExpandedRows: false,
+		getSubRows: groupingMode === "server" ? getSubRows : void 0,
+		getCoreRowModel: getCoreRowModel(),
+		getSortedRowModel: enableSorting && sortingMode === "client" ? getSortedRowModel() : void 0,
+		getFilteredRowModel: enableColumnFilters && filteringMode === "client" ? getFilteredRowModel() : void 0,
+		getPaginationRowModel: enablePagination && paginationMode === "client" ? getPaginationRowModel() : void 0,
+		getGroupedRowModel: enableGrouping && groupingMode === "client" ? getGroupedRowModel() : void 0,
+		getExpandedRowModel: enableGrouping ? getExpandedRowModel() : void 0,
+		getRowId
 	});
+	return {
+		table,
+		totalPages: table.getPageCount(),
+		currentPage: pagination.pageIndex + 1,
+		showPagination: enablePagination && paginationMode !== "none" && table.getPageCount() > 1
+	};
 }
-DropdownMenuSeparator.displayName = "DropdownMenu.Separator";
-/**
-* Container for menu items with proper padding
-*/
-function DropdownMenuItems({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx("div", {
-		"data-slot": "dropdown-menu-items",
-		className: cn("py-1", className),
-		...props,
-		children
+function DataTable({ columns, data, children, enableRowSelection = false, enableMultiRowSelection = true, rowSelection: controlledRowSelection, onRowSelectionChange, initialRowSelection = {}, enableSorting = true, sortingMode = "client", sorting: controlledSorting, onSortingChange, initialSorting = [], enablePagination = false, paginationMode = "client", pagination: controlledPagination, onPaginationChange, pageCount: controlledPageCount, rowCount, pageSize = 10, initialPageIndex = 0, enableColumnFilters = false, filteringMode = "client", columnFilters: controlledColumnFilters, onColumnFiltersChange, initialColumnFilters = [], enableColumnVisibility = false, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, initialColumnVisibility = {}, enableGrouping = false, groupingMode = "client", grouping: controlledGrouping, onGroupingChange, initialGrouping = [], groupedColumnMode = false, expanded: controlledExpanded, onExpandedChange, initialExpanded = {}, getSubRows, paginationType = "page-default", paginationShape = "square", paginationSize = "md", paginationShowPageNumbers = true, paginationLabel, getRowId, onRowClick, emptyState, className, caption, dividers = "line", density = "default", showSelectAll = true, responsiveColumns = false, renderControls, classNames, renderBody, renderRow, renderGroupHeader, maxHeight, stickyHeader = false, stickyFirstColumn = false, stickyLastColumn = false, loading: isLoading = false, loadingState, error, errorState, i18n, virtualization, showSelectionCount = false, rounded = "all", bordered = true }) {
+	const { table, totalPages, currentPage, showPagination } = useDataTable({
+		columns,
+		data,
+		enableRowSelection,
+		enableMultiRowSelection,
+		rowSelection: controlledRowSelection,
+		onRowSelectionChange,
+		initialRowSelection,
+		showSelectAll,
+		enableSorting,
+		sortingMode,
+		sorting: controlledSorting,
+		onSortingChange,
+		initialSorting,
+		enablePagination,
+		paginationMode,
+		pagination: controlledPagination,
+		onPaginationChange,
+		pageCount: controlledPageCount,
+		rowCount,
+		pageSize,
+		initialPageIndex,
+		enableColumnFilters,
+		filteringMode,
+		columnFilters: controlledColumnFilters,
+		onColumnFiltersChange,
+		initialColumnFilters,
+		enableColumnVisibility,
+		columnVisibility: controlledColumnVisibility,
+		onColumnVisibilityChange,
+		initialColumnVisibility,
+		enableGrouping,
+		groupingMode,
+		grouping: controlledGrouping,
+		onGroupingChange,
+		initialGrouping,
+		groupedColumnMode,
+		expanded: controlledExpanded,
+		onExpandedChange,
+		initialExpanded,
+		getSubRows,
+		getRowId
 	});
-}
-DropdownMenuItems.displayName = "DropdownMenu.Items";
-/**
-* Styled shortcut badge that matches Figma design (uses Kbd wrapper)
-*/
-function DropdownMenuShortcutBadge({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx(Kbd, {
-		variant: "outline",
-		size: "xs",
-		className,
-		...props,
-		children
+	const tableContainerRef = React.useRef(null);
+	const rows = table.getRowModel().rows;
+	const isVirtualizationEnabled = virtualization?.enabled ?? false;
+	const headerOffset = stickyHeader && isVirtualizationEnabled ? 40 : 0;
+	const isGroupRow = React.useCallback((row) => {
+		if (row.getIsGrouped()) return true;
+		if (groupingMode === "server" && row.subRows.length > 0) return true;
+		return false;
+	}, [groupingMode]);
+	const rowVirtualizer = useVirtualizer({
+		enabled: isVirtualizationEnabled,
+		count: isVirtualizationEnabled ? rows.length : 0,
+		getScrollElement: () => tableContainerRef.current,
+		estimateSize: (index) => {
+			const row = rows[index];
+			if (row && isGroupRow(row)) return virtualization?.estimatedGroupHeaderHeight ?? 48;
+			return virtualization?.estimatedRowHeight ?? 50;
+		},
+		overscan: virtualization?.overscan ?? 5
 	});
-}
-DropdownMenuShortcutBadge.displayName = "DropdownMenu.ShortcutBadge";
-/**
-* Simplified DropdownMenu component with explicit trigger prop.
-* Prevents nested button hydration errors by using base-ui's render prop.
-*
-* @example
-* <SimpleDropdownMenu trigger={<Button>Menu</Button>}>
-*   <DropdownMenu.Popup>
-*     <DropdownMenu.Items>
-*       <DropdownMenu.Item>Option 1</DropdownMenu.Item>
-*     </DropdownMenu.Items>
-*   </DropdownMenu.Popup>
-* </SimpleDropdownMenu>
-*/
-function SimpleDropdownMenu({ trigger, open, onOpenChange, children }) {
-	return /* @__PURE__ */ jsxs(DropdownMenuRoot, {
-		open,
-		onOpenChange,
-		children: [/* @__PURE__ */ jsx(DropdownMenuTrigger, { render: trigger }), children]
+	const handleRowKeyDown = React.useCallback((row, e) => {
+		if (e.key === "Enter" || e.key === " ") {
+			e.preventDefault();
+			onRowClick?.(row);
+		}
+	}, [onRowClick]);
+	const renderCellContent = React.useCallback((cell, row) => {
+		const isGroupedCell = cell.getIsGrouped();
+		const isAggregatedCell = cell.getIsAggregated();
+		const isPlaceholderCell = cell.getIsPlaceholder();
+		if (isGroupedCell) {
+			const actionLabel = row.getIsExpanded() ? "Collapse" : "Expand";
+			const groupLabel = String(cell.getValue() ?? "");
+			return /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				onClick: row.getToggleExpandedHandler(),
+				className: "flex items-center gap-1.5 text-start font-medium group/expand rounded -ms-1 ps-1 -me-1 pe-1 -my-0.5 py-0.5 hover:text-foreground transition-colors duration-150 ease-out motion-reduce:transition-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none active:scale-[0.98] motion-reduce:active:scale-100",
+				"aria-label": `${actionLabel} ${groupLabel} group`,
+				"aria-expanded": row.getIsExpanded(),
+				children: [
+					/* @__PURE__ */ jsx(ChevronRight, { className: cn("h-4 w-4 flex-shrink-0 transition-transform duration-200 ease-out motion-reduce:transition-none", row.getIsExpanded() && "rotate-90") }),
+					/* @__PURE__ */ jsx("span", { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }),
+					/* @__PURE__ */ jsxs("span", {
+						className: "text-text-quaternary tabular-nums",
+						children: [
+							"(",
+							row.subRows.length,
+							")"
+						]
+					})
+				]
+			});
+		}
+		if (isAggregatedCell) return flexRender(cell.column.columnDef.aggregatedCell ?? cell.column.columnDef.cell, cell.getContext());
+		if (isPlaceholderCell) return null;
+		return flexRender(cell.column.columnDef.cell, cell.getContext());
+	}, []);
+	const hasChildren = React.Children.count(children) > 0;
+	const hasFooter = showPagination || showSelectionCount;
+	const shouldRenderComposite = hasChildren || hasFooter;
+	const selectedRowCount = table.getFilteredSelectedRowModel().rows.length;
+	const filteredRowCount = table.getFilteredRowModel().rows.length;
+	const selectionTotalRowCount = rowCount ?? filteredRowCount;
+	const footerLabel = showSelectionCount ? i18n?.selectionCount?.(selectedRowCount, selectionTotalRowCount) ?? `${selectedRowCount} of ${selectionTotalRowCount} Row(s) Selected.` : null;
+	let statusContent;
+	if (isLoading) statusContent = loadingState || i18n?.loading || "Loading...";
+	else if (error) statusContent = errorState || error.message;
+	else statusContent = emptyState || i18n?.noResults || "No results.";
+	const statusAriaLive = isLoading || error ? "polite" : void 0;
+	function renderVirtualizedBody() {
+		return /* @__PURE__ */ jsx(TableBody, {
+			style: {
+				display: "block",
+				position: "relative",
+				height: `${rowVirtualizer.getTotalSize() + headerOffset}px`
+			},
+			children: rowVirtualizer.getVirtualItems().map((virtualRow) => {
+				const row = rows[virtualRow.index];
+				const rowIsGroup = isGroupRow(row);
+				const visibleCells = row.getVisibleCells();
+				const visibleColumnCount = visibleCells.length;
+				const responsiveStickySlotsById = getResponsiveStickySlotsById({
+					enabled: responsiveColumns,
+					getId: (item) => item.column.id,
+					getResponsive: (item) => item.column.columnDef.meta?.responsive,
+					items: visibleCells,
+					stickyFirstColumn,
+					stickyLastColumn
+				});
+				if (rowIsGroup && renderGroupHeader) return /* @__PURE__ */ jsx(TableRow, {
+					"data-state": row.getIsSelected() && "selected",
+					ref: (node) => rowVirtualizer.measureElement(node),
+					"data-index": virtualRow.index,
+					className: cn(dataTableRowVariants({
+						dividers,
+						density,
+						isEven: virtualRow.index % 2 === 1,
+						isSelected: row.getIsSelected()
+					}), "bg-muted", classNames?.row),
+					style: getVirtualRowStyle(virtualRow.start, headerOffset),
+					children: /* @__PURE__ */ jsx(DataTableGroupHeader, {
+						row,
+						visibleColumnCount,
+						customHeader: renderGroupHeader
+					})
+				}, row.id);
+				return /* @__PURE__ */ jsx(TableRow, {
+					"data-state": row.getIsSelected() && "selected",
+					"aria-selected": row.getIsSelected() ? "true" : void 0,
+					tabIndex: onRowClick ? 0 : void 0,
+					onClick: onRowClick ? () => onRowClick(row) : void 0,
+					onKeyDown: onRowClick ? (e) => handleRowKeyDown(row, e) : void 0,
+					ref: (node) => rowVirtualizer.measureElement(node),
+					"data-index": virtualRow.index,
+					className: cn(dataTableRowVariants({
+						dividers,
+						density,
+						isEven: virtualRow.index % 2 === 1,
+						isSelected: row.getIsSelected()
+					}), rowIsGroup && "bg-muted", onRowClick && "cursor-pointer hover:bg-muted focus-visible:bg-muted focus-visible:outline-none active:bg-accent/50 motion-reduce:active:bg-muted", classNames?.row),
+					style: getVirtualRowStyle(virtualRow.start, headerOffset),
+					children: visibleCells.map((cell, cellIndex) => {
+						const isFirstColumn = cellIndex === 0;
+						const isLastColumn = cellIndex === visibleColumnCount - 1;
+						const responsiveStickySlots = responsiveStickySlotsById.get(cell.column.id);
+						const stickyClass = responsiveColumns ? getResponsiveStickyClass({
+							backgroundClass: row.getIsSelected() ? "bg-muted dark:bg-accent" : "bg-background dark:bg-card",
+							firstSlots: responsiveStickySlots?.firstSlots ?? [],
+							lastSlots: responsiveStickySlots?.lastSlots ?? []
+						}) : getStickyCellClass({
+							stickyFirstColumn,
+							stickyLastColumn,
+							isFirstColumn,
+							isLastColumn,
+							isSelected: row.getIsSelected()
+						});
+						return /* @__PURE__ */ jsx(TableCell, {
+							className: cn(dataTableCellVariants({ density }), classNames?.cell, cell.column.columnDef.meta?.cellClassName, getResponsiveColumnClass(cell.column.columnDef.meta?.responsive, responsiveColumns), stickyClass),
+							children: rowIsGroup ? renderCellContent(cell, row) : flexRender(cell.column.columnDef.cell, cell.getContext())
+						}, cell.id);
+					})
+				}, row.id);
+			})
+		});
+	}
+	function renderStandardBody() {
+		let bodyContent;
+		if (!rows.length) bodyContent = /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, {
+			colSpan: table.getAllColumns().length,
+			className: cn(dataTableCellVariants({ density }), "h-24 text-center text-muted-foreground"),
+			"aria-live": statusAriaLive,
+			children: statusContent
+		}) });
+		else if (renderRow) bodyContent = rows.map((row) => renderRow(row));
+		else bodyContent = rows.map((row, index) => {
+			const rowIsGroup = isGroupRow(row);
+			const visibleCells = row.getVisibleCells();
+			const visibleColumnCount = visibleCells.length;
+			const responsiveStickySlotsById = getResponsiveStickySlotsById({
+				enabled: responsiveColumns,
+				getId: (item) => item.column.id,
+				getResponsive: (item) => item.column.columnDef.meta?.responsive,
+				items: visibleCells,
+				stickyFirstColumn,
+				stickyLastColumn
+			});
+			if (rowIsGroup && renderGroupHeader) return /* @__PURE__ */ jsx(TableRow, {
+				"data-state": row.getIsSelected() && "selected",
+				className: cn(dataTableRowVariants({
+					dividers,
+					density,
+					isEven: index % 2 === 1,
+					isSelected: row.getIsSelected()
+				}), "bg-muted", classNames?.row),
+				children: /* @__PURE__ */ jsx(DataTableGroupHeader, {
+					row,
+					visibleColumnCount,
+					customHeader: renderGroupHeader
+				})
+			}, row.id);
+			return /* @__PURE__ */ jsx(TableRow, {
+				"data-state": row.getIsSelected() && "selected",
+				"aria-selected": row.getIsSelected() ? "true" : void 0,
+				tabIndex: onRowClick ? 0 : void 0,
+				onClick: onRowClick ? () => onRowClick(row) : void 0,
+				onKeyDown: onRowClick ? (e) => handleRowKeyDown(row, e) : void 0,
+				className: cn(dataTableRowVariants({
+					dividers,
+					density,
+					isEven: index % 2 === 1,
+					isSelected: row.getIsSelected()
+				}), rowIsGroup && "bg-muted", onRowClick && "cursor-pointer hover:bg-muted focus-visible:bg-muted focus-visible:outline-none active:bg-accent/50 motion-reduce:active:bg-muted", classNames?.row),
+				children: visibleCells.map((cell, cellIndex) => {
+					const isFirstColumn = cellIndex === 0;
+					const isLastColumn = cellIndex === visibleColumnCount - 1;
+					const responsiveStickySlots = responsiveStickySlotsById.get(cell.column.id);
+					const stickyClass = responsiveColumns ? getResponsiveStickyClass({
+						backgroundClass: row.getIsSelected() ? "bg-muted dark:bg-accent" : "bg-background dark:bg-card",
+						firstSlots: responsiveStickySlots?.firstSlots ?? [],
+						lastSlots: responsiveStickySlots?.lastSlots ?? []
+					}) : getStickyCellClass({
+						stickyFirstColumn,
+						stickyLastColumn,
+						isFirstColumn,
+						isLastColumn,
+						isSelected: row.getIsSelected()
+					});
+					return /* @__PURE__ */ jsx(TableCell, {
+						className: cn(dataTableCellVariants({ density }), classNames?.cell, cell.column.columnDef.meta?.cellClassName, getResponsiveColumnClass(cell.column.columnDef.meta?.responsive, responsiveColumns), stickyClass),
+						children: rowIsGroup ? renderCellContent(cell, row) : flexRender(cell.column.columnDef.cell, cell.getContext())
+					}, cell.id);
+				})
+			}, row.id);
+		});
+		return /* @__PURE__ */ jsx(TableBody, { children: bodyContent });
+	}
+	let tableBody;
+	if (renderBody) tableBody = renderBody(table);
+	else if (isVirtualizationEnabled && rows.length > 0) tableBody = renderVirtualizedBody();
+	else tableBody = renderStandardBody();
+	const tableContainer = /* @__PURE__ */ jsx("div", {
+		ref: tableContainerRef,
+		className: cn(dataTableContainerVariants({
+			rounded: shouldRenderComposite ? "none" : rounded,
+			bordered: shouldRenderComposite ? false : bordered
+		}), maxHeight ? "overflow-auto" : "overflow-x-auto"),
+		style: maxHeight ? { maxHeight } : void 0,
+		children: /* @__PURE__ */ jsxs(TableNamespace, {
+			disableOverflow: !!(maxHeight || stickyHeader || stickyFirstColumn || stickyLastColumn),
+			className: cn(dataTableVariants({
+				dividers,
+				density
+			}), classNames?.table),
+			children: [
+				caption && /* @__PURE__ */ jsx("caption", {
+					className: "sr-only",
+					children: caption
+				}),
+				/* @__PURE__ */ jsx(TableHeader, {
+					className: cn(stickyHeader && "sticky top-0 z-10"),
+					children: table.getHeaderGroups().map((headerGroup) => {
+						const responsiveStickySlotsById = getResponsiveStickySlotsById({
+							enabled: responsiveColumns,
+							getId: (item) => item.column.id,
+							getResponsive: (item) => item.column.columnDef.meta?.responsive,
+							items: headerGroup.headers,
+							stickyFirstColumn,
+							stickyLastColumn
+						});
+						return /* @__PURE__ */ jsx(TableRow, {
+							className: cn("border-b border-border bg-muted hover:bg-muted", classNames?.headerRow),
+							children: headerGroup.headers.map((header, headerIndex) => {
+								const isFirstColumn = headerIndex === 0;
+								const isLastColumn = headerIndex === headerGroup.headers.length - 1;
+								const isSticky = stickyFirstColumn && isFirstColumn || stickyLastColumn && isLastColumn;
+								const responsiveStickySlots = responsiveStickySlotsById.get(header.column.id);
+								const responsiveHeaderStickyClass = responsiveColumns ? getResponsiveStickyClass({
+									backgroundClass: "bg-muted",
+									firstSlots: responsiveStickySlots?.firstSlots ?? [],
+									lastSlots: responsiveStickySlots?.lastSlots ?? [],
+									zIndexClass: stickyHeader ? "z-30" : "z-20"
+								}) : void 0;
+								const ariaSort = getAriaSort(header.column.getIsSorted());
+								const headerDefinition = header.column.columnDef.header;
+								const isTextHeader = typeof headerDefinition === "string";
+								let headerContent = null;
+								if (!header.isPlaceholder && isTextHeader) headerContent = /* @__PURE__ */ jsx(SortableHeader, {
+									column: header.column,
+									children: headerDefinition
+								});
+								else if (!header.isPlaceholder) headerContent = flexRender(headerDefinition, header.getContext());
+								return /* @__PURE__ */ jsx(TableHead, {
+									scope: "col",
+									style: { width: getHeaderCellWidth(header.getSize()) },
+									className: cn(dataTableHeaderCellVariants({ density }), "text-start", classNames?.headerCell, header.column.columnDef.meta?.headerClassName, getResponsiveColumnClass(header.column.columnDef.meta?.responsive, responsiveColumns), responsiveColumns ? responsiveHeaderStickyClass : [
+										stickyFirstColumn && isFirstColumn && "sticky start-0 z-20 bg-muted",
+										stickyLastColumn && isLastColumn && "sticky end-0 z-20 bg-muted",
+										stickyHeader && isSticky && "z-30"
+									]),
+									"aria-sort": ariaSort,
+									children: headerContent
+								}, header.id);
+							})
+						}, headerGroup.id);
+					})
+				}),
+				tableBody
+			]
+		})
+	});
+	const tableFooter = hasFooter ? /* @__PURE__ */ jsxs("div", {
+		"data-slot": "data-table-footer",
+		className: cn("flex min-h-[68px] items-center gap-4 border-t border-border-subtle px-6 py-0", footerLabel ? "justify-between" : "justify-end"),
+		children: [footerLabel && /* @__PURE__ */ jsx("span", {
+			className: "text-sm text-muted-foreground",
+			children: footerLabel
+		}), showPagination && /* @__PURE__ */ jsx(Pagination, {
+			type: paginationType,
+			shape: paginationShape,
+			size: paginationSize,
+			currentPage,
+			totalPages,
+			onPageChange: (page) => table.setPageIndex(page - 1),
+			showPageNumbers: paginationShowPageNumbers,
+			"aria-label": paginationLabel,
+			className: footerLabel ? "w-auto justify-end" : void 0
+		})]
+	}) : null;
+	return /* @__PURE__ */ jsxs("div", {
+		"data-slot": "data-table",
+		className: cn("@container", className),
+		children: [renderControls && /* @__PURE__ */ jsx("div", {
+			className: "mb-4",
+			children: /* @__PURE__ */ jsx(DataTableControls, {
+				table,
+				customControls: renderControls
+			})
+		}), shouldRenderComposite ? /* @__PURE__ */ jsxs("div", {
+			"data-slot": "data-table-composite",
+			className: cn(dataTableContainerVariants({
+				rounded,
+				bordered
+			}), "overflow-hidden"),
+			children: [
+				children,
+				tableContainer,
+				tableFooter
+			]
+		}) : tableContainer]
 	});
 }
-SimpleDropdownMenu.displayName = "DropdownMenu.Simple";
-var DropdownMenu = Object.assign(DropdownMenuRoot, {
-	Root: DropdownMenuRoot,
-	Portal: DropdownMenuPortal,
-	Trigger: DropdownMenuTrigger,
-	Popup: DropdownMenuPopup,
-	Group: DropdownMenuGroup,
-	Label: DropdownMenuLabel,
-	Item: DropdownMenuItem,
-	CheckboxItem: DropdownMenuCheckboxItem,
-	RadioGroup: DropdownMenuRadioGroup,
-	RadioItem: DropdownMenuRadioItem,
-	Separator: DropdownMenuSeparator,
-	Shortcut: DropdownMenuShortcut,
-	ShortcutBadge: DropdownMenuShortcutBadge,
-	Sub: DropdownMenuSub,
-	SubTrigger: DropdownMenuSubTrigger,
-	SubPopup: DropdownMenuSubPopup,
-	Header: DropdownMenuHeader,
-	Items: DropdownMenuItems,
-	Simple: SimpleDropdownMenu
-});
+DataTable.displayName = "DataTable";
 //#endregion
-export { DropdownMenu };
+export { DataTable, DataTableActionsCell, DataTableAvatarCell, DataTableBadgesCell, DataTableCell, DataTableCellRoot, DataTableProgressCell, DataTableRatingCell, DataTableSparklineCell, DataTableSwitchCell, DataTableTextCell, DataTableTrendCell, SortableHeader, createSelectColumn, dataTableCellVariants, dataTableContainerVariants, dataTableHeaderCellVariants, dataTableRowVariants, dataTableVariants, useDataTable };
 
 //# sourceMappingURL=index191.js.map