@etus/ui 0.4.0-beta.1 → 0.4.0-beta.3

package/dist/chunk-75QBUI2P.js

@@ -0,0 +1,4497 @@
+import { FilterBuilder, isFilterGroup, isFilterCondition } from './chunk-DZALMUQD.js';
+import { Table, TableRow, TableHeader, TableHead, TableBody, TableCell, TableFooter } from './chunk-65YSTUD2.js';
+import { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuSeparator, ContextMenuItem } from './chunk-4Y72SPNL.js';
+import { Checkbox } from './chunk-XETKCF73.js';
+import { SkeletonLoader } from './chunk-QHKOBGLW.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuCheckboxItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuItem } from './chunk-FSMHI7DW.js';
+import { useMediaQuery } from './chunk-Y555RCRZ.js';
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-WBE6VQOO.js';
+import { TextInput } from './chunk-PWCMCMDN.js';
+import { Popover, PopoverTrigger, PopoverContent } from './chunk-AFCSDND5.js';
+import { Button } from './chunk-RPV77BCQ.js';
+import { Badge } from './chunk-KOTCWE7V.js';
+import { cn } from './chunk-HRNDJU7D.js';
+import * as React14 from 'react';
+import { cva } from 'class-variance-authority';
+import { useReactTable, getFacetedUniqueValues, getFacetedRowModel, getExpandedRowModel, getPaginationRowModel, getGroupedRowModel, getFilteredRowModel, getSortedRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
+import { Star, Check, X, Search, Columns3, GripHorizontal, StretchHorizontal, AlignJustify, Download, FileText, FileSpreadsheet, Printer, ChevronUp, ChevronDown, ChevronRight, GripVertical, Plus, ChevronsLeft, ChevronLeft, ChevronsRight, ArrowUp, ArrowDown, ArrowUpDown, Group, MoreVertical, PinIcon, PinOff, Ruler, RotateCcw, EyeOff, ChevronsUpDown } from 'lucide-react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useSensors, useSensor, PointerSensor, DndContext, closestCenter } from '@dnd-kit/core';
+import { arrayMove, SortableContext, horizontalListSortingStrategy, useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
+import { useVirtualizer } from '@tanstack/react-virtual';
+
+var dataTableVariants = cva(
+  // Base styles (always applied)
+  "space-y-4",
+  {
+    variants: {
+      density: {
+        compact: "[&_td]:py-[var(--datatable-row-padding-y-compact)] [&_th]:py-[var(--datatable-header-padding-y-compact)]",
+        default: "[&_td]:py-[var(--datatable-row-padding-y-default)] [&_th]:py-[var(--datatable-header-padding-y-default)]",
+        comfortable: "[&_td]:py-[var(--datatable-row-padding-y-comfortable)] [&_th]:py-[var(--datatable-header-padding-y-comfortable)]"
+      }
+    },
+    defaultVariants: {
+      density: "default"
+    }
+  }
+);
+var dataTableRowVariants = cva(
+  // Base styles (always applied)
+  "transition-colors",
+  {
+    variants: {
+      state: {
+        default: "",
+        selected: "bg-[color:var(--datatable-row-bg-selected)]",
+        highlighted: "bg-[color:var(--datatable-row-bg-highlighted)]/5"
+      },
+      interactive: {
+        true: "cursor-pointer hover:bg-[color:var(--datatable-row-bg-hover)]/50",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      state: "default",
+      interactive: false
+    }
+  }
+);
+var dataTableHeaderVariants = cva(
+  // Base styles (always applied)
+  "text-muted-foreground",
+  {
+    variants: {
+      sortable: {
+        true: "cursor-pointer select-none hover:text-foreground",
+        false: ""
+      },
+      sorted: {
+        asc: "text-foreground",
+        desc: "text-foreground",
+        none: ""
+      }
+    },
+    defaultVariants: {
+      sortable: false,
+      sorted: "none"
+    }
+  }
+);
+var dataTableResizeHandleVariants = cva(
+  // Base styles (always applied)
+  [
+    "absolute right-0 top-0 h-full w-1 cursor-col-resize select-none touch-none",
+    "bg-transparent hover:bg-[color:var(--border-default)]",
+    "transition-colors duration-150"
+  ],
+  {
+    variants: {
+      isResizing: {
+        true: "bg-[color:var(--primary)] w-0.5",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      isResizing: false
+    }
+  }
+);
+
+// src/components/data-display/DataTable/DataTable.types.ts
+function isEditableColumnMeta(meta) {
+  return meta !== null && typeof meta === "object" && "editable" in meta;
+}
+function isSpanColumnMeta(meta) {
+  return meta !== null && typeof meta === "object" && ("colSpan" in meta || "rowSpan" in meta);
+}
+function highlightText(text, query) {
+  if (!query || !text) return text;
+  const escapedQuery = query.replaceAll(/[.*+?^${}()|[\]\\]/g, "\\$&");
+  const regex = new RegExp(`(${escapedQuery})`, "gi");
+  const parts = text.split(regex);
+  if (parts.length === 1) return text;
+  return parts.map(
+    (part, index) => regex.test(part) ? /* @__PURE__ */ jsx("mark", { className: "bg-yellow-200 text-inherit dark:bg-yellow-800", children: part }, `hl-${String(index)}`) : part
+  );
+}
+function DataTableCellInner({
+  cancelEdit,
+  cell,
+  cellClassName,
+  colIndex,
+  colSpan,
+  editTrigger,
+  editValue,
+  editError,
+  editingCell,
+  enableColumnPinning,
+  enableEditing,
+  enableKeyboardNavigation,
+  enableSearchHighlight,
+  focusedCell,
+  globalFilter,
+  getPinnedAttribute,
+  getPinnedStyles,
+  handleCellFocus,
+  row,
+  rowSpan,
+  setEditInputRef,
+  setEditValue,
+  startEdit,
+  submitEdit
+}) {
+  const rowIndex = row.index;
+  const isFocused = enableKeyboardNavigation && focusedCell !== null && focusedCell.row === rowIndex && focusedCell.col === colIndex;
+  const isEditing = editingCell !== null && editingCell.rowId === row.id && editingCell.columnId === cell.column.id;
+  const meta = isEditableColumnMeta(cell.column.columnDef.meta) ? cell.column.columnDef.meta : void 0;
+  const isEditable = enableEditing && meta?.editable;
+  const cellValue = cell.getValue();
+  const handleEditTrigger = () => {
+    if (isEditable) {
+      startEdit(row.id, cell.column.id, cellValue, cell.column);
+    }
+  };
+  const renderEditInput = () => {
+    const editType = meta?.editType ?? "text";
+    const editOptions = meta?.editOptions ?? [];
+    const handleKeyDown = (e) => {
+      if (e.key === "Enter") {
+        e.preventDefault();
+        void submitEdit(row, cell.column, cellValue);
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        cancelEdit(row, cell.column, cellValue);
+      }
+    };
+    if (editType === "select") {
+      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            ref: setEditInputRef,
+            "aria-label": "Edit cell",
+            className: "h-8 w-full rounded-md border border-input bg-background px-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+            value: String(editValue),
+            onBlur: () => {
+              void submitEdit(row, cell.column, cellValue);
+            },
+            onChange: (e) => {
+              setEditValue(e.target.value);
+            },
+            onKeyDown: handleKeyDown,
+            children: editOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option, children: option }, option))
+          }
+        ),
+        editError && /* @__PURE__ */ jsx("span", { className: "text-xs text-[color:var(--input-border-error)]", children: editError })
+      ] });
+    }
+    if (editType === "checkbox") {
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: setEditInputRef,
+            "aria-label": "Edit cell",
+            checked: Boolean(editValue),
+            className: "size-4 rounded border border-input",
+            type: "checkbox",
+            onChange: (e) => {
+              setEditValue(e.target.checked);
+              void submitEdit(row, cell.column, cellValue);
+            },
+            onKeyDown: handleKeyDown
+          }
+        ),
+        editError && /* @__PURE__ */ jsx("span", { className: "text-xs text-[color:var(--input-border-error)]", children: editError })
+      ] });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref: setEditInputRef,
+          "aria-label": "Edit cell",
+          className: "h-8 w-full rounded-md border border-input bg-background px-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+          type: editType === "number" ? "number" : editType === "date" ? "date" : "text",
+          value: editType === "number" ? editValue : typeof editValue === "string" || typeof editValue === "number" ? String(editValue) : "",
+          onBlur: () => {
+            void submitEdit(row, cell.column, cellValue);
+          },
+          onChange: (e) => {
+            setEditValue(editType === "number" ? e.target.valueAsNumber : e.target.value);
+          },
+          onKeyDown: handleKeyDown
+        }
+      ),
+      editError && /* @__PURE__ */ jsx("span", { className: "text-xs text-[color:var(--input-border-error)]", children: editError })
+    ] });
+  };
+  return /* @__PURE__ */ jsx(
+    TableCell,
+    {
+      className: cn(
+        enableColumnPinning && cell.column.getIsPinned() && "sticky",
+        isEditable && "cursor-pointer",
+        cellClassName?.(cell.column.id, row)
+      ),
+      colSpan,
+      "data-col": enableKeyboardNavigation ? colIndex : void 0,
+      "data-column-id": cell.column.id,
+      "data-pinned": getPinnedAttribute(cell.column),
+      "data-row": enableKeyboardNavigation ? rowIndex : void 0,
+      role: enableKeyboardNavigation ? "gridcell" : void 0,
+      rowSpan,
+      style: getPinnedStyles(cell.column),
+      tabIndex: enableKeyboardNavigation ? isFocused ? 0 : -1 : void 0,
+      onClick: editTrigger === "click" && isEditable && !isEditing ? (e) => {
+        e.stopPropagation();
+        handleEditTrigger();
+      } : void 0,
+      onDoubleClick: editTrigger === "dblclick" && isEditable && !isEditing ? (e) => {
+        e.stopPropagation();
+        handleEditTrigger();
+      } : void 0,
+      onFocus: enableKeyboardNavigation ? () => {
+        handleCellFocus(rowIndex, colIndex);
+      } : void 0,
+      children: isEditing ? renderEditInput() : enableSearchHighlight && globalFilter && !cell.column.columnDef.cell && (typeof cellValue === "string" || typeof cellValue === "number") ? highlightText(String(cellValue), globalFilter) : flexRender(cell.column.columnDef.cell, cell.getContext())
+    },
+    cell.id
+  );
+}
+var DataTableCell = DataTableCellInner;
+function DataTableBodyInner({
+  cancelEdit,
+  cellClassName,
+  columnVirtualizer,
+  contextMenuItems,
+  dragHandleProps,
+  editTrigger,
+  editValue,
+  editError,
+  editingCell,
+  enableColumnPinning,
+  enableEditing,
+  enableGrouping,
+  enableKeyboardNavigation,
+  enableRowAnimation,
+  enableRowColumnSpanning,
+  enableRowReordering,
+  enableSearchHighlight,
+  enableStriping,
+  enableVirtualization,
+  containerRef,
+  focusedCell,
+  globalFilter,
+  getPinnedAttribute,
+  getPinnedStyles,
+  handleCellFocus,
+  hasFooter,
+  onRowClick,
+  renderSubComponent,
+  rowClassName,
+  rowVirtualizer,
+  setEditInputRef,
+  setEditValue,
+  startEdit,
+  submitEdit,
+  table,
+  tableColumns
+}) {
+  const rows = table.getRowModel().rows;
+  const virtualItems = rowVirtualizer?.getVirtualItems();
+  const isVirtual = enableVirtualization && rowVirtualizer && virtualItems;
+  const ROW_ANIMATION_DURATION = 300;
+  const rowPositionsRef = React14.useRef(/* @__PURE__ */ new Map());
+  const isFirstRenderRef = React14.useRef(true);
+  React14.useLayoutEffect(() => {
+    if (!enableRowAnimation) return;
+    const container = containerRef?.current;
+    const tbody = container ? container.querySelector("tbody") : document.querySelector('[data-slot="data-table"] tbody');
+    if (!tbody) return;
+    const trs = tbody.querySelectorAll("tr[data-row-id]");
+    if (isFirstRenderRef.current) {
+      isFirstRenderRef.current = false;
+      for (const tr of trs) {
+        const rowId = tr.dataset["rowId"];
+        if (rowId) rowPositionsRef.current.set(rowId, tr.getBoundingClientRect().top);
+      }
+      return;
+    }
+    const cleanupFns = [];
+    for (const tr of trs) {
+      const rowId = tr.dataset["rowId"];
+      if (!rowId) continue;
+      const previousTop = rowPositionsRef.current.get(rowId);
+      if (previousTop === void 0) continue;
+      const currentTop = tr.getBoundingClientRect().top;
+      const delta = previousTop - currentTop;
+      if (Math.abs(delta) < 1) continue;
+      tr.style.transform = `translateY(${String(delta)}px)`;
+      tr.style.transition = "none";
+      tr.offsetHeight;
+      tr.style.transition = `transform ${String(ROW_ANIMATION_DURATION)}ms ease-out`;
+      tr.style.transform = "";
+      const onEnd = () => {
+        tr.style.transition = "";
+        tr.style.transform = "";
+        tr.removeEventListener("transitionend", onEnd);
+      };
+      tr.addEventListener("transitionend", onEnd);
+      cleanupFns.push(() => {
+        tr.removeEventListener("transitionend", onEnd);
+      });
+    }
+    const newPositions = /* @__PURE__ */ new Map();
+    for (const tr of trs) {
+      const rowId = tr.dataset["rowId"];
+      if (rowId) newPositions.set(rowId, tr.getBoundingClientRect().top);
+    }
+    rowPositionsRef.current = newPositions;
+    return () => {
+      for (const fn of cleanupFns) fn();
+    };
+  }, [rows, enableRowAnimation, containerRef]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      TableBody,
+      {
+        style: isVirtual ? {
+          height: `${String(rowVirtualizer.getTotalSize())}px`,
+          position: "relative"
+        } : void 0,
+        children: rows.length ? (
+          // eslint-disable-next-line sonarjs/cognitive-complexity -- row rendering with grouping, virtualization, and context menu
+          (isVirtual ? virtualItems : rows).map((itemOrRow) => {
+            const row = isVirtual ? rows[itemOrRow.index] : itemOrRow;
+            const virtualRow = isVirtual ? itemOrRow : null;
+            const virtualRowStyle = virtualRow ? {
+              position: "absolute",
+              top: 0,
+              left: 0,
+              width: "100%",
+              height: `${String(virtualRow.size)}px`,
+              transform: `translateY(${String(virtualRow.start)}px)`
+            } : void 0;
+            if (enableGrouping && row.getIsGrouped()) {
+              return /* @__PURE__ */ jsxs(React14.Fragment, { children: [
+                /* @__PURE__ */ jsx(
+                  TableRow,
+                  {
+                    ref: virtualRow && rowVirtualizer ? rowVirtualizer.measureElement : void 0,
+                    className: cn(
+                      "bg-muted/30 font-medium",
+                      typeof rowClassName === "function" ? rowClassName(row) : rowClassName
+                    ),
+                    "data-index": virtualRow?.index,
+                    style: virtualRowStyle,
+                    children: row.getVisibleCells().map((cell) => {
+                      const isGroupedCell = cell.getIsGrouped();
+                      const isAggregated = cell.getIsAggregated();
+                      const isPlaceholder = cell.getIsPlaceholder();
+                      return /* @__PURE__ */ jsx(
+                        TableCell,
+                        {
+                          className: cn(
+                            enableColumnPinning && cell.column.getIsPinned() && "sticky",
+                            cellClassName?.(cell.column.id, row)
+                          ),
+                          "data-column-id": cell.column.id,
+                          "data-pinned": getPinnedAttribute(cell.column),
+                          style: getPinnedStyles(cell.column),
+                          children: isGroupedCell ? /* @__PURE__ */ jsxs(
+                            "button",
+                            {
+                              className: "flex items-center gap-1.5 text-left",
+                              type: "button",
+                              onClick: (e) => {
+                                e.stopPropagation();
+                                row.toggleExpanded();
+                              },
+                              children: [
+                                row.getIsExpanded() ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-4 shrink-0" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-4 shrink-0" }),
+                                /* @__PURE__ */ jsx("span", { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }),
+                                /* @__PURE__ */ jsxs("span", { className: "ml-1 text-xs text-muted-foreground", children: [
+                                  "(",
+                                  row.subRows.length,
+                                  ")"
+                                ] })
+                              ]
+                            }
+                          ) : isAggregated ? flexRender(
+                            cell.column.columnDef.aggregatedCell ?? cell.column.columnDef.cell,
+                            cell.getContext()
+                          ) : isPlaceholder ? null : flexRender(cell.column.columnDef.cell, cell.getContext())
+                        },
+                        cell.id
+                      );
+                    })
+                  }
+                ),
+                row.getIsExpanded() && row.subRows.map((subRow) => {
+                  const subTableRow = /* @__PURE__ */ jsx(
+                    TableRow,
+                    {
+                      className: cn(
+                        dataTableRowVariants({
+                          state: subRow.getIsSelected() ? "selected" : "default",
+                          interactive: !!onRowClick
+                        }),
+                        enableStriping && subRow.index % 2 === 1 && "bg-muted/50",
+                        typeof rowClassName === "function" ? rowClassName(subRow) : rowClassName
+                      ),
+                      "data-state": subRow.getIsSelected() ? "selected" : void 0,
+                      onClick: onRowClick ? () => {
+                        onRowClick(subRow.original);
+                      } : void 0,
+                      children: subRow.getVisibleCells().map((cell, colIndex) => /* @__PURE__ */ jsx(
+                        DataTableCell,
+                        {
+                          cancelEdit,
+                          cell,
+                          cellClassName,
+                          colIndex,
+                          editError,
+                          editingCell,
+                          editTrigger,
+                          editValue,
+                          enableColumnPinning,
+                          enableEditing,
+                          enableKeyboardNavigation,
+                          enableSearchHighlight,
+                          focusedCell,
+                          getPinnedAttribute,
+                          getPinnedStyles,
+                          globalFilter,
+                          handleCellFocus,
+                          row: subRow,
+                          setEditInputRef,
+                          setEditValue,
+                          startEdit,
+                          submitEdit
+                        },
+                        cell.id
+                      ))
+                    },
+                    subRow.id
+                  );
+                  return /* @__PURE__ */ jsx(React14.Fragment, { children: contextMenuItems && contextMenuItems.length > 0 ? /* @__PURE__ */ jsxs(ContextMenu, { children: [
+                    /* @__PURE__ */ jsx(ContextMenuTrigger, { asChild: true, children: subTableRow }),
+                    /* @__PURE__ */ jsx(ContextMenuContent, { className: "w-48", children: contextMenuItems.map((item) => /* @__PURE__ */ jsxs(React14.Fragment, { children: [
+                      item.separator && /* @__PURE__ */ jsx(ContextMenuSeparator, {}),
+                      /* @__PURE__ */ jsxs(
+                        ContextMenuItem,
+                        {
+                          className: item.variant === "destructive" ? "text-destructive" : void 0,
+                          onClick: () => {
+                            item.onClick(subRow.original);
+                          },
+                          children: [
+                            item.icon && /* @__PURE__ */ jsx("span", { className: "mr-2", children: item.icon }),
+                            item.label
+                          ]
+                        }
+                      )
+                    ] }, item.label)) })
+                  ] }) : subTableRow }, subRow.id);
+                })
+              ] }, virtualRow ? virtualRow.key : row.id);
+            }
+            const tableRow = /* @__PURE__ */ jsxs(
+              TableRow,
+              {
+                ref: virtualRow && rowVirtualizer ? rowVirtualizer.measureElement : void 0,
+                className: cn(
+                  dataTableRowVariants({
+                    state: row.getIsSelected() ? "selected" : "default",
+                    interactive: !!onRowClick
+                  }),
+                  enableStriping && row.index % 2 === 1 && "bg-muted/50",
+                  typeof rowClassName === "function" ? rowClassName(row) : rowClassName,
+                  enableRowReordering && "group/row"
+                ),
+                "data-index": virtualRow?.index,
+                "data-row-id": enableRowAnimation ? row.id : void 0,
+                "data-state": row.getIsSelected() ? "selected" : void 0,
+                style: virtualRowStyle,
+                onClick: onRowClick ? () => {
+                  onRowClick(row.original);
+                } : void 0,
+                ...enableRowReordering ? dragHandleProps?.(row.index) : void 0,
+                children: [
+                  enableRowReordering && /* @__PURE__ */ jsx(TableCell, { className: "w-8 px-1", children: /* @__PURE__ */ jsx(GripVertical, { className: "text-muted-foreground size-4 cursor-grab opacity-0 transition-opacity group-hover/row:opacity-100" }) }),
+                  (() => {
+                    const visibleCells = row.getVisibleCells();
+                    const virtualColItems = columnVirtualizer?.getVirtualItems();
+                    const cellItems = virtualColItems ? virtualColItems.filter((virtualCol) => visibleCells[virtualCol.index] != null).map((virtualCol) => ({
+                      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- filtered above
+                      cell: visibleCells[virtualCol.index],
+                      colIndex: virtualCol.index
+                    })) : visibleCells.map((cell, index) => ({ cell, colIndex: index }));
+                    return cellItems.map(({ cell, colIndex }) => {
+                      let colSpan;
+                      let rowSpan;
+                      if (enableRowColumnSpanning) {
+                        const spanMeta = isSpanColumnMeta(cell.column.columnDef.meta) ? cell.column.columnDef.meta : void 0;
+                        if (spanMeta) {
+                          colSpan = spanMeta.colSpan?.(row);
+                          rowSpan = spanMeta.rowSpan?.(row);
+                          if (colSpan === 0 || rowSpan === 0) return null;
+                        }
+                      }
+                      return /* @__PURE__ */ jsx(
+                        DataTableCell,
+                        {
+                          cancelEdit,
+                          cell,
+                          cellClassName,
+                          colIndex,
+                          colSpan,
+                          editError,
+                          editingCell,
+                          editTrigger,
+                          editValue,
+                          enableColumnPinning,
+                          enableEditing,
+                          enableKeyboardNavigation,
+                          enableSearchHighlight,
+                          focusedCell,
+                          getPinnedAttribute,
+                          getPinnedStyles,
+                          globalFilter,
+                          handleCellFocus,
+                          row,
+                          rowSpan,
+                          setEditInputRef,
+                          setEditValue,
+                          startEdit,
+                          submitEdit
+                        },
+                        cell.id
+                      );
+                    });
+                  })()
+                ]
+              }
+            );
+            return /* @__PURE__ */ jsxs(React14.Fragment, { children: [
+              contextMenuItems && contextMenuItems.length > 0 ? /* @__PURE__ */ jsxs(ContextMenu, { children: [
+                /* @__PURE__ */ jsx(ContextMenuTrigger, { asChild: true, children: tableRow }),
+                /* @__PURE__ */ jsx(ContextMenuContent, { className: "w-48", children: contextMenuItems.map((item) => /* @__PURE__ */ jsxs(React14.Fragment, { children: [
+                  item.separator && /* @__PURE__ */ jsx(ContextMenuSeparator, {}),
+                  /* @__PURE__ */ jsxs(
+                    ContextMenuItem,
+                    {
+                      className: item.variant === "destructive" ? "text-destructive" : void 0,
+                      onClick: () => {
+                        item.onClick(row.original);
+                      },
+                      children: [
+                        item.icon && /* @__PURE__ */ jsx("span", { className: "mr-2", children: item.icon }),
+                        item.label
+                      ]
+                    }
+                  )
+                ] }, item.label)) })
+              ] }) : tableRow,
+              row.getIsExpanded() && renderSubComponent && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colSpan: row.getVisibleCells().length, children: renderSubComponent({ row }) }) })
+            ] }, virtualRow ? virtualRow.key : row.id);
+          })
+        ) : /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(
+          TableCell,
+          {
+            className: "h-24 text-center",
+            colSpan: tableColumns.length,
+            children: "No results."
+          }
+        ) })
+      }
+    ),
+    hasFooter && /* @__PURE__ */ jsx(TableFooter, { children: table.getFooterGroups().map((footerGroup) => /* @__PURE__ */ jsx(TableRow, { children: footerGroup.headers.map((header) => /* @__PURE__ */ jsx(TableCell, { children: header.isPlaceholder ? null : flexRender(
+      header.column.columnDef.footer,
+      header.getContext()
+    ) }, header.id)) }, footerGroup.id)) })
+  ] });
+}
+var DataTableBody = DataTableBodyInner;
+function DataTableBulkActionsInner({
+  actions,
+  table
+}) {
+  const selectedRows = table.getFilteredSelectedRowModel().flatRows;
+  if (selectedRows.length === 0) return null;
+  const selectedData = selectedRows.map((row) => row.original);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-2 rounded-lg border bg-muted/50 px-4 py-2",
+      "data-slot": "data-table-bulk-actions",
+      children: [
+        /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium", children: [
+          selectedRows.length,
+          " selected"
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "ml-2 flex items-center gap-2", children: actions.map((action) => /* @__PURE__ */ jsxs(
+          Button,
+          {
+            size: "sm",
+            variant: action.variant ?? "outline",
+            onClick: () => {
+              action.onClick(selectedData);
+            },
+            children: [
+              action.icon,
+              action.label
+            ]
+          },
+          action.label
+        )) })
+      ]
+    }
+  );
+}
+var DataTableBulkActions = DataTableBulkActionsInner;
+var UTILITY_COLUMN_IDS = /* @__PURE__ */ new Set(["select", "_row_number"]);
+function DataTableCardViewInner({
+  onRowClick,
+  rowClassName,
+  table
+}) {
+  const rows = table.getRowModel().rows;
+  if (rows.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex flex-col items-center justify-center py-12 text-center",
+        "data-slot": "data-table-card-view-empty",
+        children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: "No results." })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: "space-y-3", "data-slot": "data-table-card-view", children: rows.map((row) => {
+    const visibleCells = row.getVisibleCells().filter(
+      (cell) => !UTILITY_COLUMN_IDS.has(cell.column.id)
+    );
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "rounded-lg border p-4",
+          "bg-[color:var(--surface-default)]",
+          onRowClick && "cursor-pointer hover:bg-[color:var(--surface-hover)]",
+          typeof rowClassName === "function" ? rowClassName(row) : rowClassName
+        ),
+        role: onRowClick ? "button" : void 0,
+        tabIndex: onRowClick ? 0 : void 0,
+        onClick: onRowClick ? () => {
+          onRowClick(row.original);
+        } : void 0,
+        onKeyDown: onRowClick ? (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            onRowClick(row.original);
+          }
+        } : void 0,
+        children: /* @__PURE__ */ jsx("div", { className: "space-y-2", children: visibleCells.map((cell) => {
+          const headerDef = cell.column.columnDef.header;
+          const label = typeof headerDef === "string" ? headerDef : cell.column.id;
+          return /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex items-start justify-between gap-4",
+              "data-column-id": cell.column.id,
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground text-sm font-medium shrink-0", children: label }),
+                /* @__PURE__ */ jsx("span", { className: "text-sm text-right", children: flexRender(cell.column.columnDef.cell, cell.getContext()) })
+              ]
+            },
+            cell.id
+          );
+        }) })
+      },
+      row.id
+    );
+  }) });
+}
+var DataTableCardView = DataTableCardViewInner;
+var SKELETON_KEYS = ["skeleton-row-1", "skeleton-row-2", "skeleton-row-3", "skeleton-row-4", "skeleton-row-5"];
+function DataTableEmptyState({
+  className,
+  emptyState,
+  error,
+  errorState,
+  loading,
+  loadingComponent
+}) {
+  if (loading) {
+    return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), "data-slot": "data-table", children: loadingComponent ?? /* @__PURE__ */ jsx("div", { className: "space-y-2", "data-slot": "data-table-loading", children: SKELETON_KEYS.map((key) => /* @__PURE__ */ jsx(SkeletonLoader, { className: "h-12 w-full" }, key)) }) });
+  }
+  if (error) {
+    return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), "data-slot": "data-table", children: errorState ?? /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex flex-col items-center justify-center py-12 text-center",
+        "data-slot": "data-table-error",
+        children: /* @__PURE__ */ jsx("p", { className: "text-destructive text-sm", children: "An error occurred while loading data" })
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), "data-slot": "data-table", children: emptyState ?? /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "flex flex-col items-center justify-center py-12 text-center",
+      "data-slot": "data-table-empty",
+      children: /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-sm", children: "No data available" })
+    }
+  ) });
+}
+function getCellSelector(row, col) {
+  return '[data-row="' + String(row) + '"][data-col="' + String(col) + '"]';
+}
+function DataTableFillHandle({
+  onFill,
+  position,
+  tableRef
+}) {
+  const isDraggingRef = React14.useRef(false);
+  const dragStartRef = React14.useRef(null);
+  const currentTargetRef = React14.useRef(null);
+  const getCellElement = React14.useCallback(
+    (row, col) => {
+      if (!tableRef.current) return null;
+      return tableRef.current.querySelector(getCellSelector(row, col));
+    },
+    [tableRef]
+  );
+  const clearFillTargets = React14.useCallback(() => {
+    if (!tableRef.current) return;
+    const targeted = tableRef.current.querySelectorAll(
+      "[data-fill-target='true']"
+    );
+    for (const el of targeted) {
+      el.removeAttribute("data-fill-target");
+    }
+  }, [tableRef]);
+  const markFillTargets = React14.useCallback(
+    (source, target) => {
+      clearFillTargets();
+      const rowDiff = target.row - source.row;
+      const colDiff = target.col - source.col;
+      if (Math.abs(rowDiff) >= Math.abs(colDiff)) {
+        const startRow = Math.min(source.row + 1, target.row);
+        const endRow = Math.max(source.row + 1, target.row);
+        for (let r = startRow; r <= endRow; r++) {
+          const cell = getCellElement(r, source.col);
+          if (cell) {
+            cell.setAttribute("data-fill-target", "true");
+          }
+        }
+      } else {
+        const startCol = Math.min(source.col + 1, target.col);
+        const endCol = Math.max(source.col + 1, target.col);
+        for (let c = startCol; c <= endCol; c++) {
+          const cell = getCellElement(source.row, c);
+          if (cell) {
+            cell.setAttribute("data-fill-target", "true");
+          }
+        }
+      }
+    },
+    [clearFillTargets, getCellElement]
+  );
+  const handleMouseUp = React14.useCallback(() => {
+    if (!isDraggingRef.current || !dragStartRef.current || !currentTargetRef.current) {
+      isDraggingRef.current = false;
+      clearFillTargets();
+      return;
+    }
+    const source = dragStartRef.current;
+    const target = currentTargetRef.current;
+    const rowDiff = target.row - source.row;
+    const colDiff = target.col - source.col;
+    if (rowDiff !== 0 || colDiff !== 0) {
+      if (Math.abs(rowDiff) >= Math.abs(colDiff)) {
+        const startRow = Math.min(source.row + 1, target.row);
+        const endRow = Math.max(source.row + 1, target.row);
+        onFill({
+          direction: "down",
+          sourceCell: { col: source.col, row: source.row },
+          targetRange: {
+            endCol: source.col,
+            endRow,
+            startCol: source.col,
+            startRow
+          }
+        });
+      } else {
+        const startCol = Math.min(source.col + 1, target.col);
+        const endCol = Math.max(source.col + 1, target.col);
+        onFill({
+          direction: "right",
+          sourceCell: { col: source.col, row: source.row },
+          targetRange: {
+            endCol,
+            endRow: source.row,
+            startCol,
+            startRow: source.row
+          }
+        });
+      }
+    }
+    isDraggingRef.current = false;
+    dragStartRef.current = null;
+    currentTargetRef.current = null;
+    clearFillTargets();
+  }, [clearFillTargets, onFill]);
+  const handleMouseMove = React14.useCallback(
+    (e) => {
+      if (!isDraggingRef.current || !dragStartRef.current || !tableRef.current) return;
+      const target = document.elementFromPoint(e.clientX, e.clientY);
+      if (!target) return;
+      const cell = target.closest("[data-row][data-col]");
+      if (!cell) return;
+      const row = Number(cell.dataset["row"]);
+      const col = Number(cell.dataset["col"]);
+      if (Number.isNaN(row) || Number.isNaN(col)) return;
+      currentTargetRef.current = { col, row };
+      markFillTargets(dragStartRef.current, { col, row });
+    },
+    [markFillTargets, tableRef]
+  );
+  const handleMouseDown = React14.useCallback(
+    (e) => {
+      if (!position) return;
+      e.preventDefault();
+      e.stopPropagation();
+      isDraggingRef.current = true;
+      dragStartRef.current = { col: position.col, row: position.row };
+      currentTargetRef.current = { col: position.col, row: position.row };
+    },
+    [position]
+  );
+  React14.useEffect(() => {
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("mouseup", handleMouseUp);
+    return () => {
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, [handleMouseMove, handleMouseUp]);
+  const [handleStyle, setHandleStyle] = React14.useState({});
+  React14.useEffect(() => {
+    if (!position) {
+      setHandleStyle({});
+      return;
+    }
+    const table = tableRef.current;
+    if (!table) {
+      setHandleStyle({});
+      return;
+    }
+    const cell = table.querySelector(
+      getCellSelector(position.row, position.col)
+    );
+    if (!cell) {
+      setHandleStyle({});
+      return;
+    }
+    const tableRect = table.getBoundingClientRect();
+    const cellRect = cell.getBoundingClientRect();
+    setHandleStyle({
+      left: cellRect.right - tableRect.left - 3,
+      top: cellRect.bottom - tableRect.top - 3
+    });
+  }, [position, tableRef]);
+  if (!position) return null;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "absolute z-10 size-1.5 cursor-crosshair rounded-sm bg-primary"
+      ),
+      "data-slot": "data-table-fill-handle",
+      role: "presentation",
+      style: handleStyle,
+      onMouseDown: handleMouseDown
+    }
+  );
+}
+function DataTableFilterChipsInner({
+  table
+}) {
+  const columnFilters = table.getState().columnFilters;
+  const globalFilter = table.getState().globalFilter;
+  const hasFilters = columnFilters.length > 0 || globalFilter && globalFilter.length > 0;
+  if (!hasFilters) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex flex-wrap items-center gap-2",
+      "data-slot": "data-table-filter-chips",
+      children: [
+        globalFilter && globalFilter.length > 0 && /* @__PURE__ */ jsxs(Badge, { className: "gap-1 pr-1", color: "muted", type: "pill-color", children: [
+          "Search: ",
+          globalFilter,
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-label": "Clear search filter",
+              className: "ml-1 rounded-full p-0.5 hover:bg-muted",
+              type: "button",
+              onClick: () => {
+                table.setGlobalFilter("");
+              },
+              children: /* @__PURE__ */ jsx(X, { className: "size-3" })
+            }
+          )
+        ] }),
+        columnFilters.map((filter) => {
+          const column = table.getColumn(filter.id);
+          const headerLabel = column && typeof column.columnDef.header === "string" ? column.columnDef.header : filter.id;
+          return /* @__PURE__ */ jsxs(Badge, { className: "gap-1 pr-1", color: "muted", type: "pill-color", children: [
+            headerLabel,
+            ": ",
+            String(filter.value),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                "aria-label": `Clear ${headerLabel} filter`,
+                className: "ml-1 rounded-full p-0.5 hover:bg-muted",
+                type: "button",
+                onClick: () => {
+                  column?.setFilterValue(void 0);
+                },
+                children: /* @__PURE__ */ jsx(X, { className: "size-3" })
+              }
+            )
+          ] }, filter.id);
+        }),
+        columnFilters.length + (globalFilter ? 1 : 0) >= 2 && /* @__PURE__ */ jsx(
+          Button,
+          {
+            className: "h-6 px-2 text-xs",
+            size: "sm",
+            variant: "ghost",
+            onClick: () => {
+              table.resetColumnFilters();
+              table.setGlobalFilter("");
+            },
+            children: "Clear all"
+          }
+        )
+      ]
+    }
+  );
+}
+var DataTableFilterChips = DataTableFilterChipsInner;
+var FIND_MATCH_ATTR = "data-find-match";
+var FIND_CURRENT_ATTR = "data-find-current";
+function getCellTextContent(cell) {
+  const text = cell.textContent;
+  if (typeof text === "string") {
+    return text.toLowerCase();
+  }
+  return "";
+}
+function findMatchesInTable(tableEl, normalizedQuery) {
+  const result = [];
+  const rows = tableEl.querySelectorAll("tbody tr");
+  rows.forEach((row, rowIndex) => {
+    const cells = row.querySelectorAll("td");
+    cells.forEach((cell) => {
+      if (cell instanceof HTMLTableCellElement) {
+        const text = getCellTextContent(cell);
+        if (text.includes(normalizedQuery)) {
+          result.push({ cell, rowIndex });
+        }
+      }
+    });
+  });
+  return result;
+}
+function DataTableFindBar({ onClose, open, tableRef }) {
+  const [currentIndex, setCurrentIndex] = React14.useState(0);
+  const [matches, setMatches] = React14.useState([]);
+  const [query, setQuery] = React14.useState("");
+  const inputRef = React14.useRef(null);
+  React14.useEffect(() => {
+    if (!open) {
+      setQuery("");
+      setCurrentIndex(0);
+      setMatches([]);
+      return;
+    }
+    const timer = setTimeout(() => {
+      inputRef.current?.focus();
+    }, 0);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [open]);
+  React14.useEffect(() => {
+    const table = tableRef.current;
+    if (!table || !query.trim()) {
+      setMatches([]);
+      return;
+    }
+    const normalizedQuery = query.trim().toLowerCase();
+    const found = findMatchesInTable(table, normalizedQuery);
+    setMatches(found);
+  }, [query, tableRef]);
+  const safeIndex = matches.length > 0 ? Math.min(currentIndex, matches.length - 1) : 0;
+  React14.useEffect(() => {
+    const table = tableRef.current;
+    if (!table) return;
+    const previousMatches = table.querySelectorAll(`[${FIND_MATCH_ATTR}]`);
+    previousMatches.forEach((el) => {
+      el.removeAttribute(FIND_MATCH_ATTR);
+      el.removeAttribute(FIND_CURRENT_ATTR);
+    });
+    matches.forEach((match, index) => {
+      match.cell.setAttribute(FIND_MATCH_ATTR, "true");
+      if (index === safeIndex) {
+        match.cell.setAttribute(FIND_CURRENT_ATTR, "true");
+      }
+    });
+    const currentMatch = matches[safeIndex];
+    if (currentMatch) {
+      currentMatch.cell.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+    }
+  }, [matches, safeIndex, tableRef]);
+  React14.useEffect(() => {
+    if (open) return;
+    const table = tableRef.current;
+    if (!table) return;
+    const marked = table.querySelectorAll(`[${FIND_MATCH_ATTR}]`);
+    marked.forEach((el) => {
+      el.removeAttribute(FIND_MATCH_ATTR);
+      el.removeAttribute(FIND_CURRENT_ATTR);
+    });
+  }, [open, tableRef]);
+  const handlePrev = React14.useCallback(() => {
+    if (matches.length === 0) return;
+    setCurrentIndex(
+      (prev) => prev <= 0 ? matches.length - 1 : prev - 1
+    );
+  }, [matches.length]);
+  const handleNext = React14.useCallback(() => {
+    if (matches.length === 0) return;
+    setCurrentIndex(
+      (prev) => prev >= matches.length - 1 ? 0 : prev + 1
+    );
+  }, [matches.length]);
+  const handleClose = React14.useCallback(() => {
+    setQuery("");
+    setCurrentIndex(0);
+    setMatches([]);
+    onClose();
+  }, [onClose]);
+  const handleKeyDown = React14.useCallback(
+    (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        handleClose();
+      } else if (e.key === "Enter") {
+        e.preventDefault();
+        if (e.shiftKey) {
+          handlePrev();
+        } else {
+          handleNext();
+        }
+      }
+    },
+    [handleClose, handleNext, handlePrev]
+  );
+  if (!open) {
+    return null;
+  }
+  const displayIndex = matches.length > 0 ? safeIndex + 1 : 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex items-center gap-2 border-b px-4 py-2",
+        "bg-background text-foreground"
+      ),
+      "data-slot": "data-table-find-bar",
+      children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            ref: inputRef,
+            className: cn(
+              "h-8 flex-1 rounded-md border bg-transparent px-3 text-sm",
+              "placeholder:text-muted-foreground",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            ),
+            "aria-label": "Find in table",
+            placeholder: "Find in table...",
+            type: "text",
+            value: query,
+            onChange: (e) => {
+              setQuery(e.target.value);
+              setCurrentIndex(0);
+            },
+            onKeyDown: handleKeyDown
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "min-w-16 text-center text-xs text-muted-foreground", children: query.trim() ? `${String(displayIndex)} of ${String(matches.length)}` : "" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            "aria-label": "Previous match",
+            disabled: matches.length === 0,
+            icon: /* @__PURE__ */ jsx(ChevronUp, { className: "size-4" }),
+            size: "icon-sm",
+            variant: "ghost",
+            onClick: handlePrev
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            "aria-label": "Next match",
+            disabled: matches.length === 0,
+            icon: /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" }),
+            size: "icon-sm",
+            variant: "ghost",
+            onClick: handleNext
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            "aria-label": "Close find bar",
+            icon: /* @__PURE__ */ jsx(X, { className: "size-4" }),
+            size: "icon-sm",
+            variant: "ghost",
+            onClick: handleClose
+          }
+        )
+      ]
+    }
+  );
+}
+function autoSizeColumn(table, columnId, containerEl) {
+  const tableEl = document.querySelector(`[data-slot="data-table"] table`);
+  if (!tableEl) return;
+  const cells = tableEl.querySelectorAll(
+    `[data-column-id="${columnId}"]`
+  );
+  let maxWidth = 0;
+  cells.forEach((cell) => {
+    maxWidth = Math.max(maxWidth, cell.scrollWidth + 2);
+  });
+  const headers = tableEl.querySelectorAll("th");
+  headers.forEach((th) => {
+    const headerContent = th.textContent.trim();
+    const colDef = table.getColumn(columnId)?.columnDef;
+    if (colDef && typeof colDef.header === "string" && colDef.header === headerContent) {
+      maxWidth = Math.max(maxWidth, th.scrollWidth + 2);
+    }
+  });
+  if (maxWidth > 0) {
+    const min = table.getColumn(columnId)?.columnDef.minSize ?? 20;
+    const max = table.getColumn(columnId)?.columnDef.maxSize ?? 1e3;
+    const clampedWidth = Math.min(Math.max(maxWidth, min), max);
+    table.setColumnSizing((prev) => ({
+      ...prev,
+      [columnId]: clampedWidth
+    }));
+  }
+}
+function DataTableColumnMenuInner({
+  column,
+  enableColumnFilters,
+  enableColumnPinning,
+  enableColumnResizing,
+  enableColumnVisibility,
+  enableGrouping,
+  enableSorting,
+  table
+}) {
+  const canSort = enableSorting && column.getCanSort();
+  const sorted = column.getIsSorted();
+  const isPinned = column.getIsPinned();
+  const canHide = enableColumnVisibility && column.getCanHide();
+  const canFilter = enableColumnFilters && column.getCanFilter();
+  const canResize = enableColumnResizing && column.getCanResize();
+  const canGroup = enableGrouping && column.getCanGroup();
+  const isGrouped = column.getIsGrouped();
+  const hasAnyAction = canSort || enableColumnPinning || canResize || canHide || canFilter || canGroup;
+  if (!hasAnyAction) return null;
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        "aria-label": `Column menu for ${column.id}`,
+        className: "size-6 opacity-0 transition-opacity group-hover/header:opacity-100 data-[state=open]:opacity-100",
+        size: "icon-sm",
+        type: "button",
+        variant: "ghost",
+        onClick: (e) => {
+          e.stopPropagation();
+        },
+        children: /* @__PURE__ */ jsx(MoreVertical, { className: "size-3.5" })
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", className: "w-48", children: [
+      canSort && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Sort" }),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.toggleSorting(false);
+            },
+            children: [
+              /* @__PURE__ */ jsx(ArrowUp, { className: "mr-2 size-4" }),
+              "Sort ascending"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.toggleSorting(true);
+            },
+            children: [
+              /* @__PURE__ */ jsx(ArrowDown, { className: "mr-2 size-4" }),
+              "Sort descending"
+            ]
+          }
+        ),
+        sorted && /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.clearSorting();
+            },
+            children: [
+              /* @__PURE__ */ jsx(ArrowUpDown, { className: "mr-2 size-4" }),
+              "Clear sort"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      enableColumnPinning && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Pin" }),
+        isPinned !== "left" && /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.pin("left");
+            },
+            children: [
+              /* @__PURE__ */ jsx(PinIcon, { className: "mr-2 size-4" }),
+              "Pin to left"
+            ]
+          }
+        ),
+        isPinned !== "right" && /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.pin("right");
+            },
+            children: [
+              /* @__PURE__ */ jsx(PinIcon, { className: "mr-2 size-4 rotate-90" }),
+              "Pin to right"
+            ]
+          }
+        ),
+        isPinned && /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.pin(false);
+            },
+            children: [
+              /* @__PURE__ */ jsx(PinOff, { className: "mr-2 size-4" }),
+              "Unpin"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      canResize && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Size" }),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              autoSizeColumn(table, column.id);
+            },
+            children: [
+              /* @__PURE__ */ jsx(Ruler, { className: "mr-2 size-4" }),
+              "Auto-size column"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.resetSize();
+            },
+            children: [
+              /* @__PURE__ */ jsx(RotateCcw, { className: "mr-2 size-4" }),
+              "Reset column size"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      canFilter && /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs(
+        DropdownMenuItem,
+        {
+          onClick: () => {
+            const filterInput = document.querySelector(
+              `input[aria-label="Filter ${typeof column.columnDef.header === "string" ? column.columnDef.header : column.id}"]`
+            );
+            filterInput?.focus();
+          },
+          children: [
+            /* @__PURE__ */ jsx(GripHorizontal, { className: "mr-2 size-4" }),
+            "Filter this column"
+          ]
+        }
+      ) }),
+      canGroup && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => {
+              column.getToggleGroupingHandler()();
+            },
+            children: [
+              /* @__PURE__ */ jsx(Group, { className: "mr-2 size-4" }),
+              isGrouped ? "Remove grouping" : "Group by this column"
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      canHide && /* @__PURE__ */ jsxs(
+        DropdownMenuItem,
+        {
+          onClick: () => {
+            column.toggleVisibility(false);
+          },
+          children: [
+            /* @__PURE__ */ jsx(EyeOff, { className: "mr-2 size-4" }),
+            "Hide column"
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+var DataTableColumnMenu = DataTableColumnMenuInner;
+function FacetedFilter({ column }) {
+  const facetedValues = column.getFacetedUniqueValues();
+  const filterValue = column.getFilterValue() ?? [];
+  const [open, setOpen] = React14.useState(false);
+  const sortedEntries = React14.useMemo(() => {
+    return [...facetedValues.entries()].sort(
+      (a, b) => String(a[0]).localeCompare(String(b[0]))
+    );
+  }, [facetedValues]);
+  const handleToggle = (value) => {
+    const next = filterValue.includes(value) ? filterValue.filter((v) => v !== value) : [...filterValue, value];
+    column.setFilterValue(next.length > 0 ? next : void 0);
+  };
+  const columnLabel = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: cn(
+          "flex h-7 w-full items-center justify-between rounded-md border px-2 text-xs",
+          "border-[color:var(--border-default)] bg-transparent",
+          "hover:bg-[color:var(--surface-hover)]",
+          filterValue.length > 0 && "text-foreground"
+        ),
+        "aria-label": `Filter ${columnLabel}`,
+        type: "button",
+        children: [
+          /* @__PURE__ */ jsx("span", { className: "truncate", children: filterValue.length > 0 ? `${String(filterValue.length)} selected` : "All" }),
+          /* @__PURE__ */ jsx(ChevronsUpDown, { className: "ml-1 size-3 shrink-0 opacity-50" })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsxs(PopoverContent, { align: "start", className: "w-52 p-2", children: [
+      /* @__PURE__ */ jsx("div", { className: "max-h-48 overflow-y-auto", children: sortedEntries.map(([value, count]) => {
+        const stringValue = String(value);
+        const isChecked = filterValue.includes(stringValue);
+        return /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: "flex cursor-pointer items-center gap-2 rounded px-2 py-1 text-xs hover:bg-[color:var(--surface-hover)]",
+            children: [
+              /* @__PURE__ */ jsx(
+                Checkbox,
+                {
+                  checked: isChecked,
+                  size: "sm",
+                  onCheckedChange: () => {
+                    handleToggle(stringValue);
+                  }
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: stringValue }),
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground tabular-nums", children: count })
+            ]
+          },
+          stringValue
+        );
+      }) }),
+      filterValue.length > 0 && /* @__PURE__ */ jsx(
+        "button",
+        {
+          className: "mt-1 w-full rounded px-2 py-1 text-center text-xs text-muted-foreground hover:bg-[color:var(--surface-hover)]",
+          type: "button",
+          onClick: () => {
+            column.setFilterValue(void 0);
+          },
+          children: "Clear"
+        }
+      )
+    ] })
+  ] });
+}
+function RangeFilter({ column }) {
+  const filterValue = column.getFilterValue() ?? [void 0, void 0];
+  const columnLabel = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        "aria-label": `${columnLabel} min`,
+        className: "h-7 text-xs",
+        placeholder: "Min",
+        type: "number",
+        value: filterValue[0] != null ? String(filterValue[0]) : "",
+        onChange: (e) => {
+          const val = e.target.value;
+          column.setFilterValue((prev) => [
+            val ? Number(val) : void 0,
+            prev?.[1]
+          ]);
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      TextInput,
+      {
+        "aria-label": `${columnLabel} max`,
+        className: "h-7 text-xs",
+        placeholder: "Max",
+        type: "number",
+        value: filterValue[1] != null ? String(filterValue[1]) : "",
+        onChange: (e) => {
+          const val = e.target.value;
+          column.setFilterValue((prev) => [
+            prev?.[0],
+            val ? Number(val) : void 0
+          ]);
+        }
+      }
+    )
+  ] });
+}
+function SelectFilter({ column }) {
+  const meta = column.columnDef.meta;
+  const options = meta?.filterOptions ?? [];
+  const filterValue = column.getFilterValue() ?? "";
+  const columnLabel = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+  return /* @__PURE__ */ jsxs(
+    "select",
+    {
+      className: cn(
+        "h-7 w-full rounded-md border px-2 text-xs",
+        "border-[color:var(--border-default)] bg-transparent",
+        "focus:outline-none focus:ring-1 focus:ring-[color:var(--ring)]"
+      ),
+      "aria-label": `Filter ${columnLabel}`,
+      value: filterValue,
+      onChange: (e) => {
+        column.setFilterValue(e.target.value || void 0);
+      },
+      children: [
+        /* @__PURE__ */ jsx("option", { value: "", children: "All" }),
+        options.map((opt) => /* @__PURE__ */ jsx("option", { value: opt, children: opt }, opt))
+      ]
+    }
+  );
+}
+function DefaultColumnFilter({ column }) {
+  const meta = column.columnDef.meta;
+  const variant = meta?.filterVariant ?? "text";
+  const columnLabel = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
+  switch (variant) {
+    case "faceted":
+      return /* @__PURE__ */ jsx(FacetedFilter, { column });
+    case "range":
+      return /* @__PURE__ */ jsx(RangeFilter, { column });
+    case "select":
+      return /* @__PURE__ */ jsx(SelectFilter, { column });
+    case "text":
+    default:
+      return /* @__PURE__ */ jsx(
+        TextInput,
+        {
+          "aria-label": `Filter ${columnLabel}`,
+          className: "h-7 text-xs",
+          placeholder: "Filter...",
+          value: column.getFilterValue() ?? "",
+          onChange: (e) => {
+            column.setFilterValue(e.target.value || void 0);
+          }
+        }
+      );
+  }
+}
+function DataTableHeaderInner({
+  columnVirtualizer,
+  enableColumnFilters,
+  enableColumnMenu,
+  enableColumnOrdering,
+  enableColumnPinning,
+  enableColumnResizing,
+  enableColumnVisibility,
+  enableGrouping,
+  enableSorting,
+  enableStickyHeader,
+  getPinnedAttribute,
+  getPinnedStyles,
+  renderColumnFilter,
+  table
+}) {
+  const sortedColumnCount = table.getState().sorting.length;
+  const hasFilterableColumns = enableColumnFilters && table.getAllLeafColumns().some((col) => col.getCanFilter());
+  const sensors = useSensors(
+    useSensor(PointerSensor, {
+      activationConstraint: {
+        distance: 8
+      }
+    })
+  );
+  const handleDragEnd = React14.useCallback(
+    (event) => {
+      const { active, over } = event;
+      if (!over || active.id === over.id) return;
+      const currentOrder = table.getState().columnOrder.length > 0 ? table.getState().columnOrder : table.getAllLeafColumns().map((col) => col.id);
+      const oldIndex = currentOrder.indexOf(String(active.id));
+      const newIndex = currentOrder.indexOf(String(over.id));
+      if (oldIndex === -1 || newIndex === -1) return;
+      const newOrder = arrayMove(currentOrder, oldIndex, newIndex);
+      table.setColumnOrder(newOrder);
+    },
+    [table]
+  );
+  const columnIds = React14.useMemo(() => {
+    return table.getAllLeafColumns().map((col) => col.id);
+  }, [table]);
+  const headerContent = table.getHeaderGroups().map((headerGroup) => {
+    const virtualColItems = columnVirtualizer?.getVirtualItems();
+    const headersToRender = virtualColItems ? virtualColItems.filter((virtualCol) => headerGroup.headers[virtualCol.index] != null).map((virtualCol) => headerGroup.headers[virtualCol.index]) : headerGroup.headers;
+    return /* @__PURE__ */ jsx(TableRow, { children: headersToRender.map((header) => enableColumnOrdering ? /* @__PURE__ */ jsx(
+      SortableHeaderCell,
+      {
+        enableColumnFilters,
+        enableColumnMenu,
+        enableColumnPinning,
+        enableColumnResizing,
+        enableColumnVisibility,
+        enableGrouping,
+        enableSorting,
+        enableStickyHeader,
+        getPinnedAttribute,
+        getPinnedStyles,
+        header,
+        showSortPriority: sortedColumnCount >= 2,
+        table
+      },
+      header.id
+    ) : /* @__PURE__ */ jsx(
+      DataTableHeaderCell,
+      {
+        enableColumnFilters,
+        enableColumnMenu,
+        enableColumnPinning,
+        enableColumnResizing,
+        enableColumnVisibility,
+        enableGrouping,
+        enableSorting,
+        enableStickyHeader,
+        getPinnedAttribute,
+        getPinnedStyles,
+        header,
+        showSortPriority: sortedColumnCount >= 2,
+        table
+      },
+      header.id
+    )) }, headerGroup.id);
+  });
+  return /* @__PURE__ */ jsxs(TableHeader, { children: [
+    enableColumnOrdering ? /* @__PURE__ */ jsx(
+      DndContext,
+      {
+        collisionDetection: closestCenter,
+        sensors,
+        onDragEnd: handleDragEnd,
+        children: /* @__PURE__ */ jsx(
+          SortableContext,
+          {
+            items: columnIds,
+            strategy: horizontalListSortingStrategy,
+            children: headerContent
+          }
+        )
+      }
+    ) : headerContent,
+    hasFilterableColumns && /* @__PURE__ */ jsx(TableRow, { children: (() => {
+      const allLeafColumns = table.getAllLeafColumns();
+      const virtualColItems = columnVirtualizer?.getVirtualItems();
+      const columnsToRender = virtualColItems ? virtualColItems.filter((virtualCol) => allLeafColumns[virtualCol.index] != null).map((virtualCol) => allLeafColumns[virtualCol.index]) : allLeafColumns;
+      return columnsToRender.map((column) => /* @__PURE__ */ jsx(TableHead, { className: "px-2 py-1.5", children: column.getCanFilter() ? renderColumnFilter ? renderColumnFilter({ column, table }) : /* @__PURE__ */ jsx(DefaultColumnFilter, { column, table }) : null }, column.id));
+    })() })
+  ] });
+}
+function SortableHeaderCell(props) {
+  const { header } = props;
+  const {
+    attributes,
+    isDragging,
+    listeners,
+    setNodeRef,
+    transform,
+    transition
+  } = useSortable({
+    id: header.column.id
+  });
+  const style = {
+    transform: CSS.Translate.toString(transform),
+    transition,
+    opacity: isDragging ? 0.5 : 1,
+    position: "relative",
+    zIndex: isDragging ? 2 : void 0,
+    cursor: "grab"
+  };
+  return /* @__PURE__ */ jsx(
+    DataTableHeaderCell,
+    {
+      ...props,
+      dragAttributes: attributes,
+      dragListeners: listeners,
+      dragStyle: style,
+      setDragNodeRef: setNodeRef
+    }
+  );
+}
+function DataTableHeaderCell({
+  dragAttributes,
+  dragListeners,
+  dragStyle,
+  enableColumnFilters,
+  enableColumnMenu,
+  enableColumnPinning,
+  enableColumnResizing,
+  enableColumnVisibility,
+  enableGrouping,
+  enableSorting,
+  enableStickyHeader,
+  getPinnedAttribute,
+  getPinnedStyles,
+  header,
+  setDragNodeRef,
+  showSortPriority,
+  table
+}) {
+  const canSort = header.column.getCanSort();
+  const sorted = header.column.getIsSorted();
+  const sortIndex = header.column.getSortIndex();
+  return /* @__PURE__ */ jsxs(
+    TableHead,
+    {
+      ref: setDragNodeRef,
+      "aria-sort": sorted ? sorted === "asc" ? "ascending" : "descending" : void 0,
+      className: cn(
+        "group/header",
+        dataTableHeaderVariants({
+          sortable: canSort,
+          sorted: sorted ? sorted : "none"
+        }),
+        enableStickyHeader && "sticky top-0 z-10 bg-[color:var(--surface-default)]",
+        enableColumnResizing && "relative",
+        enableColumnPinning && header.column.getIsPinned() && "sticky",
+        dragListeners && "cursor-grab"
+      ),
+      style: {
+        width: enableColumnResizing ? header.getSize() : void 0,
+        ...getPinnedStyles(header.column),
+        ...dragStyle
+      },
+      colSpan: header.colSpan > 1 ? header.colSpan : void 0,
+      "data-pinned": getPinnedAttribute(header.column),
+      onClick: canSort ? header.column.getToggleSortingHandler() : void 0,
+      ...dragAttributes,
+      ...dragListeners,
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex flex-1 items-center gap-2", children: [
+            header.isPlaceholder ? null : flexRender(
+              header.column.columnDef.header,
+              header.getContext()
+            ),
+            canSort && /* @__PURE__ */ jsxs("span", { className: "relative text-muted-foreground", children: [
+              sorted === "asc" ? /* @__PURE__ */ jsx(ArrowUp, { className: "size-4" }) : sorted === "desc" ? /* @__PURE__ */ jsx(ArrowDown, { className: "size-4" }) : /* @__PURE__ */ jsx(ArrowUpDown, { className: "size-4" }),
+              showSortPriority && sorted && sortIndex >= 0 && /* @__PURE__ */ jsx("span", { className: "absolute -right-1.5 -top-1.5 flex size-4 items-center justify-center rounded-full bg-[color:var(--primary)] text-xs font-bold leading-none text-[color:var(--primary-foreground)]", children: sortIndex + 1 })
+            ] })
+          ] }),
+          enableGrouping && !header.isPlaceholder && header.column.getCanGroup() && /* @__PURE__ */ jsx(
+            "button",
+            {
+              "aria-label": header.column.getIsGrouped() ? `Remove grouping by ${header.column.id}` : `Group by ${header.column.id}`,
+              className: cn(
+                "size-5 shrink-0 rounded p-0.5 transition-colors",
+                header.column.getIsGrouped() ? "text-[color:var(--primary)] hover:text-[color:var(--primary)]/80" : "text-muted-foreground opacity-0 hover:text-foreground group-hover/header:opacity-100"
+              ),
+              type: "button",
+              onClick: (e) => {
+                e.stopPropagation();
+                header.column.getToggleGroupingHandler()();
+              },
+              children: /* @__PURE__ */ jsx(Group, { className: "size-3.5" })
+            }
+          ),
+          enableColumnMenu && !header.isPlaceholder && /* @__PURE__ */ jsx(
+            DataTableColumnMenu,
+            {
+              column: header.column,
+              enableColumnFilters,
+              enableColumnPinning,
+              enableColumnResizing,
+              enableColumnVisibility,
+              enableGrouping,
+              enableSorting,
+              table
+            }
+          )
+        ] }),
+        enableColumnResizing && !header.isPlaceholder && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: dataTableResizeHandleVariants({
+              isResizing: header.column.getIsResizing()
+            }),
+            "aria-label": `Resize ${header.column.id} column`,
+            "aria-orientation": "vertical",
+            "aria-valuemax": header.column.columnDef.maxSize ?? 1e3,
+            "aria-valuemin": header.column.columnDef.minSize ?? 20,
+            "aria-valuenow": header.column.getSize(),
+            role: "separator",
+            tabIndex: 0,
+            onDoubleClick: () => {
+              header.column.resetSize();
+            },
+            onKeyDown: (e) => {
+              const step = e.shiftKey ? 20 : 4;
+              const columnId = header.column.id;
+              const currentSize = header.column.getSize();
+              if (e.key === "ArrowRight") {
+                e.preventDefault();
+                const max = header.column.columnDef.maxSize ?? 1e3;
+                table.setColumnSizing((prev) => ({
+                  ...prev,
+                  [columnId]: Math.min(currentSize + step, max)
+                }));
+              } else if (e.key === "ArrowLeft") {
+                e.preventDefault();
+                const min = header.column.columnDef.minSize ?? 20;
+                table.setColumnSizing((prev) => ({
+                  ...prev,
+                  [columnId]: Math.max(currentSize - step, min)
+                }));
+              }
+            },
+            onMouseDown: header.getResizeHandler(),
+            onTouchStart: header.getResizeHandler()
+          }
+        )
+      ]
+    }
+  );
+}
+var DataTableHeader = DataTableHeaderInner;
+function DataTablePaginationInner({
+  enableRowSelection,
+  onPaginationChange,
+  pageSizeOptions,
+  pagination,
+  setInternalPagination,
+  table
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex w-full flex-col gap-4 px-[var(--datatable-pagination-padding-x)] py-4 sm:flex-row sm:items-center sm:justify-between",
+      "data-slot": "data-table-pagination",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "flex-1 text-[color:var(--datatable-pagination-info-color)] text-[length:var(--datatable-pagination-info-size)]", children: enableRowSelection && table.getFilteredSelectedRowModel().rows.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          table.getFilteredSelectedRowModel().rows.length,
+          " of",
+          " ",
+          table.getFilteredRowModel().rows.length,
+          " row(s) selected."
+        ] }) : /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "\xA0" }) }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between sm:justify-end gap-x-6 gap-y-4 lg:gap-8", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx("p", { className: "text-[color:var(--datatable-pagination-info-color)] text-[length:var(--datatable-pagination-info-size)] font-medium", children: "Rows per page" }),
+            /* @__PURE__ */ jsxs(
+              Select,
+              {
+                value: String(pagination.pageSize),
+                onValueChange: (value) => {
+                  const newSize = Number(value);
+                  if (onPaginationChange) {
+                    onPaginationChange({
+                      pageIndex: 0,
+                      pageSize: newSize
+                    });
+                  } else {
+                    setInternalPagination({
+                      pageIndex: 0,
+                      pageSize: newSize
+                    });
+                  }
+                },
+                children: [
+                  /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Rows per page", className: "h-8 w-20 bg-background", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: String(pagination.pageSize) }) }),
+                  /* @__PURE__ */ jsx(SelectContent, { side: "top", children: pageSizeOptions.map((size) => /* @__PURE__ */ jsx(SelectItem, { value: String(size), children: size }, size)) })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-4 lg:gap-8", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex w-24 items-center justify-center text-[color:var(--datatable-pagination-info-color)] text-[length:var(--datatable-pagination-info-size)] font-medium", children: [
+              "Page ",
+              pagination.pageIndex + 1,
+              " of ",
+              table.getPageCount() || 1
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center space-x-2", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": "Go to first page",
+                  className: "hidden sm:flex",
+                  disabled: !table.getCanPreviousPage(),
+                  size: "icon-sm",
+                  variant: "outline",
+                  onClick: () => {
+                    table.setPageIndex(0);
+                  },
+                  children: /* @__PURE__ */ jsx(ChevronsLeft, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": "Go to previous page",
+                  disabled: !table.getCanPreviousPage(),
+                  size: "icon-sm",
+                  variant: "outline",
+                  onClick: () => {
+                    table.previousPage();
+                  },
+                  children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": "Go to next page",
+                  disabled: !table.getCanNextPage(),
+                  size: "icon-sm",
+                  variant: "outline",
+                  onClick: () => {
+                    table.nextPage();
+                  },
+                  children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4" })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  "aria-label": "Go to last page",
+                  className: "hidden sm:flex",
+                  disabled: !table.getCanNextPage(),
+                  size: "icon-sm",
+                  variant: "outline",
+                  onClick: () => {
+                    table.setPageIndex(table.getPageCount() - 1);
+                  },
+                  children: /* @__PURE__ */ jsx(ChevronsRight, { className: "size-4" })
+                }
+              )
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+var DataTablePagination = DataTablePaginationInner;
+function DataTableSidePanelInner({
+  children,
+  onClose,
+  open,
+  overlay = false,
+  title = "Tools",
+  width = 320
+}) {
+  const panelRef = React14.useRef(null);
+  const resolvedWidth = typeof width === "number" ? `${String(width)}px` : width;
+  React14.useEffect(() => {
+    if (!open) return;
+    function handleKeyDown(e) {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        onClose();
+      }
+    }
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [open, onClose]);
+  React14.useEffect(() => {
+    if (!open) return;
+    if (!panelRef.current) return;
+    const timer = setTimeout(() => {
+      panelRef.current?.focus();
+    }, 0);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [open]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    overlay && /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "fixed inset-0 z-40 bg-black/50 transition-opacity duration-300",
+          open ? "opacity-100" : "pointer-events-none opacity-0"
+        ),
+        "aria-hidden": "true",
+        "data-slot": "data-table-side-panel-overlay",
+        onClick: onClose
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: panelRef,
+        className: cn(
+          "absolute inset-y-0 right-0 z-50 flex flex-col",
+          "border-l bg-background shadow-lg",
+          "transition-transform duration-300 ease-in-out",
+          open ? "translate-x-0" : "translate-x-full"
+        ),
+        "aria-label": title,
+        "data-slot": "data-table-side-panel",
+        "data-state": open ? "open" : "closed",
+        role: "complementary",
+        style: { width: resolvedWidth },
+        tabIndex: -1,
+        children: [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex items-center justify-between border-b px-4 py-3",
+              "data-slot": "data-table-side-panel-header",
+              children: [
+                /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold", children: title }),
+                /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    "aria-label": "Close panel",
+                    icon: /* @__PURE__ */ jsx(X, { className: "size-4" }),
+                    size: "icon-sm",
+                    variant: "ghost",
+                    onClick: onClose
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: "flex-1 overflow-y-auto p-4",
+              "data-slot": "data-table-side-panel-content",
+              children
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+var DataTableSidePanel = DataTableSidePanelInner;
+function DataTableStatusBarInner({
+  enableRowSelection,
+  items,
+  table
+}) {
+  const totalRows = table.getCoreRowModel().rows.length;
+  const filteredRows = table.getFilteredRowModel().rows.length;
+  const selectedRows = enableRowSelection ? table.getFilteredSelectedRowModel().rows.length : 0;
+  const isFiltered = filteredRows < totalRows;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-4 border-t px-4 py-2 text-xs text-muted-foreground",
+      "data-slot": "data-table-status-bar",
+      children: [
+        /* @__PURE__ */ jsx("span", { children: isFiltered ? `${String(filteredRows)} of ${String(totalRows)} rows` : `${String(totalRows)} rows` }),
+        enableRowSelection && selectedRows > 0 && /* @__PURE__ */ jsxs("span", { children: [
+          selectedRows,
+          " selected"
+        ] }),
+        items?.map((item) => /* @__PURE__ */ jsxs("span", { children: [
+          item.label,
+          ": ",
+          item.value(table)
+        ] }, item.id))
+      ]
+    }
+  );
+}
+var DataTableStatusBar = DataTableStatusBarInner;
+function DataTableToolbar({
+  advancedFilterColumns,
+  columns,
+  currentAdvancedFilter,
+  debouncedFilterUpdate,
+  density = "default",
+  enableAdvancedFilter,
+  enableColumnVisibility,
+  enableDensityToggle,
+  enableExport,
+  enableFiltering,
+  enablePrint,
+  enableSearch,
+  exportFormats,
+  filterPresets,
+  onAdvancedFilterChange,
+  onDeleteFilterPreset,
+  onDensityChange,
+  onExport,
+  onPrint,
+  onSaveFilterPreset,
+  searchDisplayValue,
+  searchPlaceholder,
+  setSearchDisplayValue
+}) {
+  const hideableColumns = enableColumnVisibility && columns ? columns.filter((col) => col.getCanHide()) : [];
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    enableFiltering && enableSearch || enableExport || enableColumnVisibility || enableDensityToggle || enablePrint ? /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center justify-between gap-[var(--datatable-toolbar-gap)]",
+        "data-slot": "data-table-toolbar",
+        children: [
+          enableFiltering && enableSearch ? /* @__PURE__ */ jsxs("div", { className: "relative max-w-sm flex-1", children: [
+            /* @__PURE__ */ jsx(Search, { className: "text-[color:var(--datatable-toolbar-search-icon-color)] absolute top-[var(--datatable-toolbar-search-icon-top)] left-[var(--datatable-toolbar-search-icon-left)] size-[var(--datatable-toolbar-search-icon-size)] -translate-y-1/2" }),
+            /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                "aria-label": "Search table",
+                className: "pl-[var(--datatable-toolbar-search-input-padding-left)]",
+                placeholder: searchPlaceholder,
+                value: searchDisplayValue,
+                onChange: (e) => {
+                  const value = e.target.value;
+                  setSearchDisplayValue(value);
+                  debouncedFilterUpdate(value);
+                }
+              }
+            )
+          ] }) : /* @__PURE__ */ jsx("div", { className: "flex-1" }),
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+            enableColumnVisibility && hideableColumns.length > 0 && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  "aria-label": "Toggle columns",
+                  size: "sm",
+                  variant: "outline",
+                  children: [
+                    /* @__PURE__ */ jsx(Columns3, { className: "mr-2 size-4" }),
+                    "Columns"
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Toggle columns" }),
+                /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                hideableColumns.map((column) => /* @__PURE__ */ jsx(
+                  DropdownMenuCheckboxItem,
+                  {
+                    checked: column.getIsVisible(),
+                    onCheckedChange: (value) => {
+                      column.toggleVisibility(value);
+                    },
+                    children: typeof column.columnDef.header === "string" ? column.columnDef.header : column.id
+                  },
+                  column.id
+                ))
+              ] })
+            ] }),
+            enableDensityToggle && onDensityChange && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  "aria-label": "Change density",
+                  size: "sm",
+                  variant: "outline",
+                  children: [
+                    density === "compact" ? /* @__PURE__ */ jsx(GripHorizontal, { className: "mr-2 size-4" }) : density === "comfortable" ? /* @__PURE__ */ jsx(StretchHorizontal, { className: "mr-2 size-4" }) : /* @__PURE__ */ jsx(AlignJustify, { className: "mr-2 size-4" }),
+                    "Density"
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Row density" }),
+                /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                /* @__PURE__ */ jsxs(
+                  DropdownMenuRadioGroup,
+                  {
+                    value: density,
+                    onValueChange: (value) => {
+                      onDensityChange(value);
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxs(DropdownMenuRadioItem, { value: "compact", children: [
+                        /* @__PURE__ */ jsx(GripHorizontal, { className: "mr-2 size-4" }),
+                        "Compact"
+                      ] }),
+                      /* @__PURE__ */ jsxs(DropdownMenuRadioItem, { value: "default", children: [
+                        /* @__PURE__ */ jsx(AlignJustify, { className: "mr-2 size-4" }),
+                        "Default"
+                      ] }),
+                      /* @__PURE__ */ jsxs(DropdownMenuRadioItem, { value: "comfortable", children: [
+                        /* @__PURE__ */ jsx(StretchHorizontal, { className: "mr-2 size-4" }),
+                        "Comfortable"
+                      ] })
+                    ]
+                  }
+                )
+              ] })
+            ] }),
+            enableExport && exportFormats.length === 1 && /* @__PURE__ */ jsxs(
+              Button,
+              {
+                "aria-label": "Export",
+                size: "sm",
+                variant: "outline",
+                onClick: () => {
+                  const format = exportFormats[0];
+                  if (format) void onExport(format);
+                },
+                children: [
+                  /* @__PURE__ */ jsx(Download, { className: "mr-2 size-4" }),
+                  "Export"
+                ]
+              }
+            ),
+            enableExport && exportFormats.length > 1 && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  "aria-label": "Export",
+                  size: "sm",
+                  variant: "outline",
+                  children: [
+                    /* @__PURE__ */ jsx(Download, { className: "mr-2 size-4" }),
+                    "Export"
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                /* @__PURE__ */ jsx(DropdownMenuLabel, { children: "Export as" }),
+                /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+                exportFormats.map((format) => /* @__PURE__ */ jsxs(
+                  DropdownMenuItem,
+                  {
+                    onClick: () => {
+                      void onExport(format);
+                    },
+                    children: [
+                      format === "csv" ? /* @__PURE__ */ jsx(FileText, { className: "mr-2 size-4" }) : /* @__PURE__ */ jsx(FileSpreadsheet, { className: "mr-2 size-4" }),
+                      format === "csv" ? "CSV (.csv)" : "Excel (.xlsx)"
+                    ]
+                  },
+                  format
+                ))
+              ] })
+            ] }),
+            enablePrint && onPrint && /* @__PURE__ */ jsxs(
+              Button,
+              {
+                "aria-label": "Print",
+                size: "sm",
+                variant: "outline",
+                onClick: onPrint,
+                children: [
+                  /* @__PURE__ */ jsx(Printer, { className: "mr-2 size-4" }),
+                  "Print"
+                ]
+              }
+            )
+          ] })
+        ]
+      }
+    ) : null,
+    enableAdvancedFilter && advancedFilterColumns.length > 0 && /* @__PURE__ */ jsx(
+      FilterBuilder,
+      {
+        columns: advancedFilterColumns,
+        filter: currentAdvancedFilter,
+        presets: filterPresets,
+        onDeletePreset: onDeleteFilterPreset,
+        onFilterChange: onAdvancedFilterChange,
+        onSavePreset: onSaveFilterPreset
+      }
+    )
+  ] });
+}
+function renderCellInput(accessorKey, editType, editOptions, cellValue, onChangeValue) {
+  if (editType === "select") {
+    return /* @__PURE__ */ jsxs(
+      "select",
+      {
+        "aria-label": `New ${accessorKey}`,
+        className: "h-8 w-full rounded-md border border-input bg-background px-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        value: typeof cellValue === "string" ? cellValue : "",
+        onChange: (e) => {
+          onChangeValue(accessorKey, e.target.value);
+        },
+        children: [
+          /* @__PURE__ */ jsx("option", { value: "", children: "\u2014" }),
+          editOptions.map((option) => /* @__PURE__ */ jsx("option", { value: option, children: option }, option))
+        ]
+      }
+    );
+  }
+  if (editType === "checkbox") {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        "aria-label": `New ${accessorKey}`,
+        checked: Boolean(cellValue),
+        className: "size-4 rounded border border-input",
+        type: "checkbox",
+        onChange: (e) => {
+          onChangeValue(accessorKey, e.target.checked);
+        }
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "input",
+    {
+      value: editType === "number" ? cellValue ?? "" : typeof cellValue === "string" ? cellValue : "",
+      "aria-label": `New ${accessorKey}`,
+      className: "h-8 w-full rounded-md border border-input bg-background px-2 text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+      type: editType === "number" ? "number" : editType === "date" ? "date" : "text",
+      onChange: (e) => {
+        onChangeValue(
+          accessorKey,
+          editType === "number" ? e.target.valueAsNumber : e.target.value
+        );
+      }
+    }
+  );
+}
+function DataTableTrailingRowInner({
+  columns,
+  onAdd
+}) {
+  const [editing, setEditing] = React14.useState(false);
+  const [values, setValues] = React14.useState({});
+  const handleCancel = React14.useCallback(() => {
+    setEditing(false);
+    setValues({});
+  }, []);
+  const handleSave = React14.useCallback(() => {
+    onAdd(values);
+    setEditing(false);
+    setValues({});
+  }, [onAdd, values]);
+  const handleKeyDown = React14.useCallback(
+    (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        handleCancel();
+      }
+    },
+    [handleCancel]
+  );
+  const handleChangeValue = React14.useCallback(
+    (key, value) => {
+      setValues((prev) => ({ ...prev, [key]: value }));
+    },
+    []
+  );
+  if (!editing) {
+    return /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx("td", { colSpan: columns.length, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: "flex w-full items-center gap-2 px-4 py-2 text-sm text-muted-foreground hover:bg-muted/50 hover:text-foreground transition-colors",
+        type: "button",
+        onClick: () => {
+          setEditing(true);
+        },
+        children: [
+          /* @__PURE__ */ jsx(Plus, { className: "size-4" }),
+          "Add row"
+        ]
+      }
+    ) }) });
+  }
+  return /* @__PURE__ */ jsxs("tr", { onKeyDown: handleKeyDown, children: [
+    columns.map((col) => {
+      const accessorKey = "accessorKey" in col ? String(col.accessorKey) : col.id ?? "";
+      const meta = col.meta;
+      const editable = meta?.editable ?? false;
+      const editType = meta?.editType ?? "text";
+      const editOptions = meta?.editOptions ?? [];
+      if (!editable || !accessorKey) {
+        return /* @__PURE__ */ jsx("td", {}, accessorKey || col.id);
+      }
+      return /* @__PURE__ */ jsx("td", { className: "px-2 py-1", children: renderCellInput(accessorKey, editType, editOptions, values[accessorKey], handleChangeValue) }, accessorKey);
+    }),
+    /* @__PURE__ */ jsx("td", { className: "px-2 py-1", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          "aria-label": "Save new row",
+          size: "icon",
+          variant: "ghost",
+          onClick: handleSave,
+          children: /* @__PURE__ */ jsx(Check, { className: "size-4" })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          "aria-label": "Cancel new row",
+          size: "icon",
+          variant: "ghost",
+          onClick: handleCancel,
+          children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+        }
+      )
+    ] }) })
+  ] });
+}
+var DataTableTrailingRow = DataTableTrailingRowInner;
+
+// src/components/data-display/DataTable/DataTable.export.ts
+function escapeCSV(value) {
+  let sanitized = value;
+  if (/^[=+\-@\t\r]/.test(sanitized)) {
+    sanitized = "'" + sanitized;
+  }
+  if (sanitized.includes(",") || sanitized.includes('"') || sanitized.includes("\n")) {
+    return `"${sanitized.replaceAll('"', '""')}"`;
+  }
+  return sanitized;
+}
+function tableToCSV(table, options = {}) {
+  const {
+    includeHeaders = true,
+    onlyVisibleColumns = true,
+    onlyFilteredRows = false
+  } = options;
+  const columns = onlyVisibleColumns ? table.getVisibleLeafColumns() : table.getAllLeafColumns();
+  const exportColumns = columns.filter((col) => col.id !== "select" && col.id !== "_row_number");
+  const rows = onlyFilteredRows ? table.getFilteredRowModel().rows : table.getCoreRowModel().rows;
+  const lines = [];
+  if (includeHeaders) {
+    const headerLine = exportColumns.map((col) => {
+      const header = col.columnDef.header;
+      return typeof header === "string" ? escapeCSV(header) : escapeCSV(col.id);
+    }).join(",");
+    lines.push(headerLine);
+  }
+  rows.forEach((row) => {
+    const rowLine = exportColumns.map((col) => escapeCSV(String(row.getValue(col.id) ?? ""))).join(",");
+    lines.push(rowLine);
+  });
+  return lines.join("\n");
+}
+function downloadFile(content, filename, mimeType) {
+  const blob = new Blob([content], { type: mimeType });
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  document.body.appendChild(link);
+  link.click();
+  document.body.removeChild(link);
+  URL.revokeObjectURL(url);
+}
+function exportToCSV(table, filename = "export", options = {}) {
+  const csv = tableToCSV(table, options);
+  downloadFile(csv, `${filename}.csv`, "text/csv;charset=utf-8;");
+}
+async function exportToPDF(table, filename = "export", options = {}) {
+  const {
+    includeHeaders = true,
+    onlyVisibleColumns = true,
+    onlyFilteredRows = false
+  } = options;
+  try {
+    const { default: jsPDF } = await import('./jspdf.node.min-CTWP225M.js');
+    await import('./jspdf.plugin.autotable-AAE7PZKA.js');
+    const columns = onlyVisibleColumns ? table.getVisibleLeafColumns() : table.getAllLeafColumns();
+    const exportColumns = columns.filter((col) => col.id !== "select" && col.id !== "_row_number");
+    const rows = onlyFilteredRows ? table.getFilteredRowModel().rows : table.getCoreRowModel().rows;
+    const headers = exportColumns.map((col) => {
+      const header = col.columnDef.header;
+      return typeof header === "string" ? header : col.id;
+    });
+    const body = rows.map(
+      (row) => exportColumns.map((col) => String(row.getValue(col.id) ?? ""))
+    );
+    const doc = new jsPDF({ orientation: "landscape" });
+    const docWithAutoTable = doc;
+    docWithAutoTable.autoTable({
+      head: includeHeaders ? [headers] : void 0,
+      body
+    });
+    doc.save(`${filename}.pdf`);
+  } catch (error) {
+    console.error("Failed to load jspdf libraries for PDF export:", error);
+    throw error;
+  }
+}
+async function exportToExcel(table, filename = "export", options = {}) {
+  const {
+    includeHeaders = true,
+    onlyVisibleColumns = true,
+    onlyFilteredRows = false
+  } = options;
+  try {
+    const XLSX = await import('./xlsx-PWHBQ6NK.js');
+    const columns = onlyVisibleColumns ? table.getVisibleLeafColumns() : table.getAllLeafColumns();
+    const exportColumns = columns.filter((col) => col.id !== "select" && col.id !== "_row_number");
+    const rows = onlyFilteredRows ? table.getFilteredRowModel().rows : table.getCoreRowModel().rows;
+    const headers = exportColumns.map((col) => {
+      const header = col.columnDef.header;
+      return typeof header === "string" ? header : col.id;
+    });
+    const data = rows.map((row) => {
+      const rowData = {};
+      exportColumns.forEach((col, index) => {
+        const key = headers[index] ?? col.id;
+        rowData[key] = row.getValue(col.id);
+      });
+      return rowData;
+    });
+    const ws = XLSX.utils.json_to_sheet(data, {
+      header: includeHeaders ? headers : void 0,
+      skipHeader: !includeHeaders
+    });
+    const wb = XLSX.utils.book_new();
+    XLSX.utils.book_append_sheet(wb, ws, "Data");
+    XLSX.writeFile(wb, `${filename}.xlsx`);
+  } catch (error) {
+    console.error("Failed to load xlsx library for Excel export:", error);
+    throw error;
+  }
+}
+
+// src/components/data-display/DataTable/filterGroupToColumnFilters.ts
+function toStr(val) {
+  if (val == null) return "";
+  if (typeof val === "string") return val;
+  if (typeof val === "number" || typeof val === "boolean") return val.toString();
+  return JSON.stringify(val);
+}
+function evaluateCondition(condition, cellValue) {
+  const value = toStr(cellValue).toLowerCase();
+  const filterValue = toStr(condition.value).toLowerCase();
+  switch (condition.operator) {
+    case "contains":
+      return value.includes(filterValue);
+    case "notContains":
+      return !value.includes(filterValue);
+    case "equals":
+      return value === filterValue;
+    case "notEquals":
+      return value !== filterValue;
+    case "startsWith":
+      return value.startsWith(filterValue);
+    case "endsWith":
+      return value.endsWith(filterValue);
+    case "isEmpty":
+      return value === "";
+    case "isNotEmpty":
+      return value !== "";
+    case "gt":
+      return Number(cellValue) > Number(condition.value);
+    case "gte":
+      return Number(cellValue) >= Number(condition.value);
+    case "lt":
+      return Number(cellValue) < Number(condition.value);
+    case "lte":
+      return Number(cellValue) <= Number(condition.value);
+    case "between":
+      return Number(cellValue) >= Number(condition.value) && Number(cellValue) <= Number(condition.value2);
+    case "before":
+      return new Date(String(cellValue)) < new Date(String(condition.value));
+    case "after":
+      return new Date(String(cellValue)) > new Date(String(condition.value));
+    case "dateBetween":
+      return new Date(String(cellValue)) >= new Date(String(condition.value)) && new Date(String(cellValue)) <= new Date(String(condition.value2));
+    case "in":
+      return filterValue.split(",").map((v) => v.trim()).includes(value);
+    case "notIn":
+      return !filterValue.split(",").map((v) => v.trim()).includes(value);
+    default:
+      return true;
+  }
+}
+function evaluateFilterGroup(group, getColumnValue) {
+  if (group.conditions.length === 0) return true;
+  const results = group.conditions.map((item) => {
+    if (isFilterGroup(item)) {
+      return evaluateFilterGroup(item, getColumnValue);
+    }
+    if (isFilterCondition(item)) {
+      if (!item.column) return true;
+      const cellValue = getColumnValue(item.column);
+      return evaluateCondition(item, cellValue);
+    }
+    return true;
+  });
+  return group.logic === "AND" ? results.every(Boolean) : results.some(Boolean);
+}
+function useDataTableKeyboard({
+  enableEditing,
+  enableKeyboardNavigation,
+  enableRowSelection,
+  keyboardShortcuts,
+  onCellFocus,
+  startEdit,
+  table,
+  tableRef
+}) {
+  const [focusedCell, setFocusedCell] = React14.useState(
+    enableKeyboardNavigation ? { row: 0, col: 0 } : null
+  );
+  const computeNewPosition = React14.useCallback(
+    (key, ctrlKey, currentRow, currentCol, totalRows, totalCols) => {
+      const handlers = {
+        ArrowDown: () => ({
+          row: currentRow < totalRows - 1 ? currentRow + 1 : currentRow,
+          col: currentCol,
+          handled: currentRow < totalRows - 1
+        }),
+        ArrowLeft: () => ({
+          row: currentRow,
+          col: currentCol > 0 ? currentCol - 1 : currentCol,
+          handled: currentCol > 0
+        }),
+        ArrowRight: () => ({
+          row: currentRow,
+          col: currentCol < totalCols - 1 ? currentCol + 1 : currentCol,
+          handled: currentCol < totalCols - 1
+        }),
+        ArrowUp: () => ({
+          row: currentRow > 0 ? currentRow - 1 : currentRow,
+          col: currentCol,
+          handled: currentRow > 0
+        }),
+        End: () => ({
+          row: ctrlKey ? totalRows - 1 : currentRow,
+          col: totalCols - 1,
+          handled: true
+        }),
+        Home: () => ({
+          row: ctrlKey ? 0 : currentRow,
+          col: 0,
+          handled: true
+        }),
+        PageDown: () => ({
+          row: Math.min(currentRow + 10, totalRows - 1),
+          col: currentCol,
+          handled: true
+        }),
+        PageUp: () => ({
+          row: Math.max(currentRow - 10, 0),
+          col: currentCol,
+          handled: true
+        })
+      };
+      const handler = handlers[key];
+      return handler ? handler() : { row: currentRow, col: currentCol, handled: false };
+    },
+    []
+  );
+  const tryKeyboardEdit = React14.useCallback(
+    (rows, visibleColumns) => {
+      if (!enableEditing || !focusedCell) return false;
+      const row = rows[focusedCell.row];
+      const column = visibleColumns[focusedCell.col];
+      if (!row || !column) return false;
+      const meta = isEditableColumnMeta(column.columnDef.meta) ? column.columnDef.meta : void 0;
+      if (!meta?.editable) return false;
+      startEdit(row.id, column.id, row.getValue(column.id), column);
+      return true;
+    },
+    [enableEditing, focusedCell, startEdit]
+  );
+  const moveFocus = React14.useCallback(
+    (newRow, newCol, visibleColumns) => {
+      if (!focusedCell || newRow === focusedCell.row && newCol === focusedCell.col) return;
+      setFocusedCell({ row: newRow, col: newCol });
+      const cellSelector = `[data-row="${String(newRow)}"][data-col="${String(newCol)}"]`;
+      const cell = tableRef.current?.querySelector(cellSelector);
+      cell?.focus();
+      if (onCellFocus) {
+        const column = visibleColumns[newCol];
+        if (column) onCellFocus(newRow, column.id);
+      }
+    },
+    [focusedCell, onCellFocus, tableRef]
+  );
+  const handleKeyDown = React14.useCallback(
+    (event) => {
+      if (!enableKeyboardNavigation || !focusedCell) return;
+      const rows = table.getRowModel().rows;
+      const visibleColumns = table.getVisibleLeafColumns();
+      if ((event.key === "Enter" || event.key === "F2") && tryKeyboardEdit(rows, visibleColumns)) {
+        event.preventDefault();
+        return;
+      }
+      const selectKey = keyboardShortcuts.select ?? " ";
+      if (event.key === selectKey && enableRowSelection) {
+        const row = rows[focusedCell.row];
+        if (row) {
+          event.preventDefault();
+          row.toggleSelected();
+        }
+        return;
+      }
+      const { row: newRow, col: newCol, handled } = computeNewPosition(
+        event.key,
+        event.ctrlKey || event.metaKey,
+        focusedCell.row,
+        focusedCell.col,
+        rows.length,
+        visibleColumns.length
+      );
+      if (handled) {
+        event.preventDefault();
+        moveFocus(newRow, newCol, visibleColumns);
+      }
+    },
+    [enableKeyboardNavigation, focusedCell, table, enableRowSelection, tryKeyboardEdit, moveFocus, computeNewPosition, keyboardShortcuts]
+  );
+  const handleCellFocus = React14.useCallback(
+    (rowIndex, colIndex) => {
+      if (!enableKeyboardNavigation) return;
+      setFocusedCell({ row: rowIndex, col: colIndex });
+    },
+    [enableKeyboardNavigation]
+  );
+  return {
+    focusedCell,
+    handleCellFocus,
+    handleKeyDown
+  };
+}
+
+// src/components/data-display/DataTable/useDataTable.ts
+var DEBOUNCE_MS = 150;
+function loadPersistedState(key, storage) {
+  if (!key) return null;
+  const store = storage ?? (typeof window !== "undefined" ? window.localStorage : null);
+  if (!store) return null;
+  try {
+    const raw = store.getItem(`datatable-${key}`);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (parsed.v !== 1) return null;
+    return parsed;
+  } catch {
+    return null;
+  }
+}
+function useDebouncedCallback(callback, delay) {
+  const timerRef = React14.useRef(null);
+  React14.useEffect(() => {
+    return () => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+    };
+  }, []);
+  return React14.useCallback(
+    (value) => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+      timerRef.current = setTimeout(() => {
+        callback(value);
+      }, delay);
+    },
+    [callback, delay]
+  );
+}
+function useDataTable(props, selectionColumn, rowNumberColumn = null) {
+  const {
+    advancedFilter,
+    columnFilters: controlledColumnFilters,
+    columnOrder: controlledColumnOrder,
+    columnPinning: controlledColumnPinning,
+    columnResizeMode = "onChange",
+    columnSizing: controlledColumnSizing,
+    columnVisibility: controlledColumnVisibility,
+    columns,
+    data,
+    enableAdvancedFilter = false,
+    enableClipboard = false,
+    enableColumnAutoSize = false,
+    enableColumnFilters = false,
+    enableColumnOrdering = false,
+    enableColumnPinning = false,
+    enableColumnResizing = false,
+    enableColumnVirtualization = false,
+    enableEditing = false,
+    enableFiltering = true,
+    enableGrouping = false,
+    enableKeyboardNavigation = false,
+    enableMultiSort = false,
+    enableVirtualization = false,
+    enableRowPinning = false,
+    enableRowSelection = false,
+    enableSorting = true,
+    enableTreeData = false,
+    expanded: controlledExpanded,
+    exportFilename = "export",
+    getRowCanExpand,
+    getSubRows,
+    globalFilter: controlledGlobalFilter,
+    grouping: controlledGrouping,
+    initialColumnFilters,
+    initialColumnPinning,
+    initialGlobalFilter,
+    initialPagination,
+    initialSorting,
+    keyboardShortcuts = {},
+    manualFiltering = false,
+    manualPagination = false,
+    manualSorting = false,
+    maxMultiSortColCount,
+    onAdvancedFilterChange,
+    onCellEdit,
+    onCellEditCancel,
+    onCellFocus,
+    onColumnFiltersChange,
+    onColumnOrderChange,
+    onColumnPinningChange,
+    onColumnSizingChange,
+    onColumnVisibilityChange,
+    onExpandedChange,
+    onExport,
+    onGlobalFilterChange,
+    onGroupingChange,
+    onPaginationChange,
+    onRowPinningChange,
+    onRowSelectionChange,
+    onSelectionChange,
+    onSortingChange,
+    pageCount,
+    pageSize = 10,
+    persistenceKey,
+    persistenceStorage,
+    pagination: controlledPagination,
+    rowPinning: controlledRowPinning,
+    rowSelection: controlledRowSelection,
+    showFooter = false,
+    sorting: controlledSorting,
+    treeExpandDepth = 1
+  } = props;
+  const [persisted] = React14.useState(() => loadPersistedState(persistenceKey, persistenceStorage));
+  const [internalSorting, setInternalSorting] = React14.useState(
+    initialSorting ?? persisted?.sorting ?? []
+  );
+  const [internalGlobalFilter, setInternalGlobalFilter] = React14.useState(
+    initialGlobalFilter ?? ""
+  );
+  const [internalColumnFilters, setInternalColumnFilters] = React14.useState(initialColumnFilters ?? persisted?.columnFilters ?? []);
+  const [internalColumnOrder, setInternalColumnOrder] = React14.useState(persisted?.columnOrder ?? []);
+  const [internalColumnVisibility, setInternalColumnVisibility] = React14.useState(persisted?.columnVisibility ?? {});
+  const [internalPagination, setInternalPagination] = React14.useState({
+    pageIndex: initialPagination?.pageIndex ?? 0,
+    pageSize: initialPagination?.pageSize ?? persisted?.pagination?.pageSize ?? pageSize
+  });
+  const [internalRowSelection, setInternalRowSelection] = React14.useState({});
+  const [internalExpanded, setInternalExpanded] = React14.useState(enableTreeData && treeExpandDepth > 0 ? true : {});
+  const [internalGrouping, setInternalGrouping] = React14.useState([]);
+  const [internalColumnSizing, setInternalColumnSizing] = React14.useState(persisted?.columnSizing ?? {});
+  const [internalColumnPinning, setInternalColumnPinning] = React14.useState(initialColumnPinning ?? persisted?.columnPinning ?? {});
+  const [internalRowPinning, setInternalRowPinning] = React14.useState({ top: [], bottom: [] });
+  const [internalAdvancedFilter, setInternalAdvancedFilter] = React14.useState({
+    id: "root",
+    logic: "AND",
+    conditions: []
+  });
+  const tableRef = React14.useRef(null);
+  const previousSelectionRef = React14.useRef(null);
+  const [editingCell, setEditingCell] = React14.useState(null);
+  const [editValue, setEditValue] = React14.useState("");
+  const [editError, setEditError] = React14.useState(null);
+  const editInputRef = React14.useRef(null);
+  const [searchDisplayValue, setSearchDisplayValue] = React14.useState(controlledGlobalFilter ?? initialGlobalFilter ?? "");
+  const filterUpdateFn = React14.useCallback(
+    (value) => {
+      if (onGlobalFilterChange) {
+        onGlobalFilterChange(value);
+      } else {
+        setInternalGlobalFilter(value);
+      }
+    },
+    [onGlobalFilterChange]
+  );
+  const debouncedFilterUpdate = useDebouncedCallback(filterUpdateFn, DEBOUNCE_MS);
+  const sorting = controlledSorting ?? internalSorting;
+  const globalFilter = controlledGlobalFilter ?? internalGlobalFilter;
+  const columnFilters = controlledColumnFilters ?? internalColumnFilters;
+  const columnOrder = controlledColumnOrder ?? internalColumnOrder;
+  const columnVisibility = controlledColumnVisibility ?? internalColumnVisibility;
+  const pagination = controlledPagination ?? internalPagination;
+  const rowSelection = controlledRowSelection ?? internalRowSelection;
+  const expanded = controlledExpanded ?? internalExpanded;
+  const grouping = controlledGrouping ?? internalGrouping;
+  const columnSizing = controlledColumnSizing ?? internalColumnSizing;
+  const columnPinning = controlledColumnPinning ?? internalColumnPinning;
+  const rowPinning = controlledRowPinning ?? internalRowPinning;
+  const currentAdvancedFilter = advancedFilter ?? internalAdvancedFilter;
+  const handleAdvancedFilterChange = React14.useCallback(
+    (filter) => {
+      if (onAdvancedFilterChange) {
+        onAdvancedFilterChange(filter);
+      } else {
+        setInternalAdvancedFilter(filter);
+      }
+    },
+    [onAdvancedFilterChange]
+  );
+  const handleRowSelectionChange = React14.useCallback(
+    (updaterOrValue) => {
+      const newValue = typeof updaterOrValue === "function" ? updaterOrValue(rowSelection) : updaterOrValue;
+      if (onRowSelectionChange) {
+        onRowSelectionChange(newValue);
+      } else {
+        setInternalRowSelection(newValue);
+      }
+    },
+    [rowSelection, onRowSelectionChange]
+  );
+  const startEdit = React14.useCallback(
+    (rowId, columnId, currentValue, column) => {
+      if (!enableEditing) return;
+      const meta = isEditableColumnMeta(column.columnDef.meta) ? column.columnDef.meta : void 0;
+      if (!meta?.editable) return;
+      setEditingCell({ rowId, columnId });
+      setEditValue(currentValue);
+      setEditError(null);
+    },
+    [enableEditing]
+  );
+  const cancelEdit = React14.useCallback(
+    (row, column, oldValue) => {
+      if (onCellEditCancel && editingCell) {
+        onCellEditCancel({ row, column, oldValue });
+      }
+      setEditingCell(null);
+      setEditValue("");
+      setEditError(null);
+    },
+    [editingCell, onCellEditCancel]
+  );
+  const submitEdit = React14.useCallback(
+    async (row, column, oldValue) => {
+      const meta = isEditableColumnMeta(column.columnDef.meta) ? column.columnDef.meta : void 0;
+      if (meta?.validate) {
+        const validationError = meta.validate(editValue, row);
+        if (validationError) {
+          setEditError(validationError);
+          return;
+        }
+      }
+      if (onCellEdit) {
+        const params = { row, column, value: editValue, oldValue };
+        try {
+          const result = await Promise.resolve(onCellEdit(params));
+          if (!result) return;
+        } catch {
+          return;
+        }
+      }
+      setEditingCell(null);
+      setEditValue("");
+      setEditError(null);
+    },
+    [editValue, onCellEdit]
+  );
+  const setEditInputRef = React14.useCallback((node) => {
+    editInputRef.current = node;
+    if (node) {
+      node.focus();
+      if (node instanceof HTMLInputElement) {
+        node.select();
+      }
+    }
+  }, []);
+  const tableColumns = React14.useMemo(() => {
+    const result = [];
+    if (rowNumberColumn) result.push(rowNumberColumn);
+    if (enableRowSelection && selectionColumn) result.push(selectionColumn);
+    result.push(...columns);
+    return result;
+  }, [columns, enableRowSelection, rowNumberColumn, selectionColumn]);
+  const filteredData = React14.useMemo(() => {
+    if (!enableAdvancedFilter || currentAdvancedFilter.conditions.length === 0) return data;
+    return data.filter((row) => {
+      return evaluateFilterGroup(currentAdvancedFilter, (columnId) => {
+        return row[columnId];
+      });
+    });
+  }, [data, enableAdvancedFilter, currentAdvancedFilter]);
+  const table = useReactTable({
+    data: filteredData,
+    columns: tableColumns,
+    state: {
+      sorting,
+      globalFilter,
+      grouping,
+      columnFilters,
+      columnOrder: enableColumnOrdering ? columnOrder : void 0,
+      columnVisibility,
+      columnPinning,
+      rowPinning,
+      pagination,
+      rowSelection,
+      expanded,
+      columnSizing
+    },
+    enableGrouping,
+    enableRowPinning,
+    enableRowSelection,
+    enableSorting,
+    enableMultiSort,
+    maxMultiSortColCount,
+    enableFilters: enableFiltering || enableColumnFilters,
+    enableGlobalFilter: enableFiltering,
+    enableColumnFilters,
+    enableColumnResizing,
+    enableColumnPinning,
+    columnResizeMode,
+    manualPagination,
+    manualSorting,
+    manualFiltering,
+    pageCount: manualPagination ? pageCount : void 0,
+    getRowCanExpand,
+    getSubRows: enableTreeData ? getSubRows : void 0,
+    getCoreRowModel: getCoreRowModel(),
+    getSortedRowModel: manualSorting ? void 0 : getSortedRowModel(),
+    getFilteredRowModel: manualFiltering ? void 0 : getFilteredRowModel(),
+    getGroupedRowModel: enableGrouping ? getGroupedRowModel() : void 0,
+    getPaginationRowModel: manualPagination || enableVirtualization ? void 0 : getPaginationRowModel(),
+    getExpandedRowModel: getExpandedRowModel(),
+    getFacetedRowModel: getFacetedRowModel(),
+    getFacetedUniqueValues: getFacetedUniqueValues(),
+    onSortingChange: onSortingChange ?? setInternalSorting,
+    onGlobalFilterChange: onGlobalFilterChange ?? setInternalGlobalFilter,
+    onGroupingChange: onGroupingChange ?? setInternalGrouping,
+    onColumnFiltersChange: onColumnFiltersChange ?? setInternalColumnFilters,
+    onColumnOrderChange: enableColumnOrdering ? onColumnOrderChange ?? setInternalColumnOrder : void 0,
+    onColumnVisibilityChange: onColumnVisibilityChange ?? setInternalColumnVisibility,
+    onPaginationChange: onPaginationChange ?? setInternalPagination,
+    onRowSelectionChange: handleRowSelectionChange,
+    onExpandedChange: onExpandedChange ?? setInternalExpanded,
+    onColumnSizingChange: onColumnSizingChange ?? setInternalColumnSizing,
+    onColumnPinningChange: onColumnPinningChange ?? setInternalColumnPinning,
+    onRowPinningChange: onRowPinningChange ?? setInternalRowPinning
+  });
+  const handleExport = React14.useCallback(
+    async (format = "csv") => {
+      const filename = typeof exportFilename === "function" ? exportFilename() : exportFilename;
+      const options = { filename };
+      if (onExport) {
+        onExport(format, data, options);
+        return;
+      }
+      if (format === "excel") {
+        await exportToExcel(table, filename);
+      } else if (format === "pdf") {
+        await exportToPDF(table, filename);
+      } else {
+        exportToCSV(table, filename);
+      }
+    },
+    [data, exportFilename, onExport, table]
+  );
+  React14.useEffect(() => {
+    if (!onSelectionChange) return;
+    const previousSelection = previousSelectionRef.current;
+    previousSelectionRef.current = rowSelection;
+    if (previousSelection === null && Object.keys(rowSelection).length === 0) return;
+    if (previousSelection) {
+      const prevKeys = Object.keys(previousSelection);
+      const currKeys = Object.keys(rowSelection);
+      if (prevKeys.length === currKeys.length && prevKeys.every((key) => key in rowSelection)) {
+        return;
+      }
+    }
+    const selectedRows = table.getSelectedRowModel().flatRows.map((row) => row.original);
+    onSelectionChange(selectedRows);
+  }, [onSelectionChange, rowSelection, table]);
+  const { focusedCell, handleCellFocus, handleKeyDown } = useDataTableKeyboard({
+    enableEditing,
+    enableKeyboardNavigation,
+    enableRowSelection,
+    keyboardShortcuts,
+    onCellFocus,
+    startEdit,
+    table,
+    tableRef
+  });
+  const hasFooter = showFooter && tableColumns.some(
+    (col) => "footer" in col && col.footer !== void 0
+  );
+  const getPinnedStyles = React14.useCallback(
+    (column) => {
+      if (!enableColumnPinning) return {};
+      const isPinned = column.getIsPinned();
+      if (!isPinned) return {};
+      const isLeftPinned = isPinned === "left";
+      const isRightPinned = isPinned === "right";
+      return {
+        position: "sticky",
+        left: isLeftPinned ? `${String(column.getStart("left"))}px` : void 0,
+        right: isRightPinned ? `${String(column.getAfter("right"))}px` : void 0,
+        backgroundColor: "var(--surface-default)",
+        zIndex: 1
+      };
+    },
+    [enableColumnPinning]
+  );
+  const getPinnedAttribute = React14.useCallback(
+    (column) => {
+      if (!enableColumnPinning) return void 0;
+      const isPinned = column.getIsPinned();
+      return isPinned ? isPinned : void 0;
+    },
+    [enableColumnPinning]
+  );
+  const persistTimerRef = React14.useRef(null);
+  React14.useEffect(() => {
+    if (!persistenceKey) return;
+    if (persistTimerRef.current) clearTimeout(persistTimerRef.current);
+    persistTimerRef.current = setTimeout(() => {
+      const storage = persistenceStorage ?? (typeof window !== "undefined" ? window.localStorage : null);
+      if (!storage) return;
+      try {
+        const state = {
+          v: 1,
+          sorting,
+          columnOrder: enableColumnOrdering ? columnOrder : void 0,
+          columnVisibility,
+          columnSizing,
+          columnPinning,
+          pagination: { pageSize: pagination.pageSize },
+          columnFilters
+        };
+        storage.setItem(`datatable-${persistenceKey}`, JSON.stringify(state));
+      } catch {
+      }
+    }, 500);
+    return () => {
+      if (persistTimerRef.current) clearTimeout(persistTimerRef.current);
+    };
+  }, [persistenceKey, persistenceStorage, sorting, columnOrder, enableColumnOrdering, columnVisibility, columnSizing, columnPinning, pagination.pageSize, columnFilters]);
+  const autoSizeRunRef = React14.useRef(false);
+  React14.useEffect(() => {
+    if (!enableColumnAutoSize || autoSizeRunRef.current) return;
+    const timer = setTimeout(() => {
+      const tableEl = tableRef.current;
+      if (!tableEl) return;
+      const allColumns = table.getAllLeafColumns();
+      const newSizing = {};
+      for (const col of allColumns) {
+        const cells = tableEl.querySelectorAll(`[data-column-id="${col.id}"]`);
+        let maxWidth = 0;
+        cells.forEach((cell) => {
+          maxWidth = Math.max(maxWidth, cell.scrollWidth + 2);
+        });
+        if (maxWidth > 0) {
+          const min = col.columnDef.minSize ?? 20;
+          const max = col.columnDef.maxSize ?? 1e3;
+          newSizing[col.id] = Math.min(Math.max(maxWidth, min), max);
+        }
+      }
+      if (Object.keys(newSizing).length > 0) {
+        table.setColumnSizing((prev) => ({ ...prev, ...newSizing }));
+      }
+      autoSizeRunRef.current = true;
+    }, 0);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [enableColumnAutoSize, table, tableRef]);
+  const handleCopy = React14.useCallback(
+    (event) => {
+      if (!enableClipboard) return;
+      const selectedRows = table.getSelectedRowModel().flatRows;
+      if (selectedRows.length > 0) {
+        event.preventDefault();
+        const visibleColumns = table.getVisibleLeafColumns();
+        const headers = visibleColumns.filter((col) => col.id !== "select" && col.id !== "_row_number").map((col) => typeof col.columnDef.header === "string" ? col.columnDef.header : col.id);
+        const rows = selectedRows.map(
+          (row) => visibleColumns.filter((col) => col.id !== "select" && col.id !== "_row_number").map((col) => {
+            const value = row.getValue(col.id);
+            if (value == null) return "";
+            if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") return String(value);
+            return "";
+          })
+        );
+        const tsv = [headers.join("	"), ...rows.map((r) => r.join("	"))].join("\n");
+        event.clipboardData.setData("text/plain", tsv);
+      }
+    },
+    [enableClipboard, table]
+  );
+  const scrollContainerRef = React14.useRef(null);
+  const rowVirtualizer = useVirtualizer({
+    count: props.enableVirtualization ? table.getRowModel().rows.length : 0,
+    enabled: props.enableVirtualization ?? false,
+    estimateSize: () => props.estimateRowHeight ?? 35,
+    getScrollElement: () => scrollContainerRef.current,
+    overscan: props.overscan ?? 5
+  });
+  const visibleLeafColumns = table.getVisibleLeafColumns();
+  const columnVirtualizer = useVirtualizer({
+    count: enableColumnVirtualization ? visibleLeafColumns.length : 0,
+    enabled: enableColumnVirtualization,
+    estimateSize: (index) => visibleLeafColumns[index]?.getSize() ?? 150,
+    getScrollElement: () => scrollContainerRef.current,
+    horizontal: true,
+    overscan: props.overscan ?? 3
+  });
+  return {
+    cancelEdit,
+    columnVirtualizer: enableColumnVirtualization ? columnVirtualizer : void 0,
+    currentAdvancedFilter,
+    debouncedFilterUpdate,
+    editError,
+    editingCell,
+    editValue,
+    focusedCell,
+    getPinnedAttribute,
+    getPinnedStyles,
+    handleAdvancedFilterChange,
+    handleCellFocus,
+    handleCopy,
+    handleExport,
+    handleKeyDown,
+    hasFooter,
+    pagination,
+    rowVirtualizer: props.enableVirtualization ? rowVirtualizer : void 0,
+    scrollContainerRef,
+    searchDisplayValue,
+    setEditInputRef,
+    setEditValue,
+    setInternalPagination,
+    setSearchDisplayValue,
+    startEdit,
+    submitEdit,
+    table,
+    tableColumns,
+    tableRef
+  };
+}
+function buildEditKey(rowIndex, columnId) {
+  return `${String(rowIndex)}:${columnId}`;
+}
+function useDataTableBatchEditing({
+  enabled,
+  selectedCells,
+  table
+}) {
+  const [pendingEdits, setPendingEdits] = React14.useState(
+    () => /* @__PURE__ */ new Map()
+  );
+  const applyBatchEdit = React14.useCallback(
+    (columnId, value) => {
+      if (!enabled) return;
+      const column = table.getColumn(columnId);
+      if (!column) return;
+      const meta = column.columnDef.meta;
+      if (!meta?.editable) return;
+      const visibleColumns = table.getVisibleLeafColumns();
+      const columnIndex = visibleColumns.findIndex((c) => c.id === columnId);
+      if (columnIndex === -1) return;
+      const matchingCells = selectedCells.filter(
+        (cell) => cell.col === columnIndex
+      );
+      if (matchingCells.length === 0) return;
+      setPendingEdits((prev) => {
+        const next = new Map(prev);
+        for (const cell of matchingCells) {
+          next.set(buildEditKey(cell.row, columnId), value);
+        }
+        return next;
+      });
+    },
+    [enabled, selectedCells, table]
+  );
+  const clearBatchEdit = React14.useCallback(() => {
+    setPendingEdits(/* @__PURE__ */ new Map());
+  }, []);
+  return {
+    applyBatchEdit,
+    clearBatchEdit,
+    pendingEdits
+  };
+}
+function normalizeRange(range) {
+  return {
+    endCol: Math.max(range.startCol, range.endCol),
+    endRow: Math.max(range.startRow, range.endRow),
+    startCol: Math.min(range.startCol, range.endCol),
+    startRow: Math.min(range.startRow, range.endRow)
+  };
+}
+function expandRange(range) {
+  const normalized = normalizeRange(range);
+  const cells = [];
+  for (let row = normalized.startRow; row <= normalized.endRow; row++) {
+    for (let col = normalized.startCol; col <= normalized.endCol; col++) {
+      cells.push({ colIndex: col, rowIndex: row });
+    }
+  }
+  return cells;
+}
+function useDataTableCellSelection({
+  colCount,
+  enabled,
+  onSelectionChange,
+  rowCount
+}) {
+  const [state, setState] = React14.useState({
+    colCount,
+    range: null,
+    rowCount
+  });
+  const isDraggingRef = React14.useRef(false);
+  const anchorRef = React14.useRef(null);
+  const selection = state.rowCount === rowCount && state.colCount === colCount ? state.range : null;
+  const updateSelection = React14.useCallback(
+    (range) => {
+      setState({ colCount, range, rowCount });
+    },
+    [colCount, rowCount]
+  );
+  const notifySelectionChange = React14.useCallback(
+    (range) => {
+      if (!onSelectionChange) return;
+      const cells = range ? expandRange(range) : [];
+      onSelectionChange(cells);
+    },
+    [onSelectionChange]
+  );
+  const clearSelection = React14.useCallback(() => {
+    updateSelection(null);
+    anchorRef.current = null;
+    notifySelectionChange(null);
+  }, [updateSelection, notifySelectionChange]);
+  const getSelectedCells = React14.useCallback(() => {
+    if (!selection) return [];
+    return expandRange(selection);
+  }, [selection]);
+  const isSelected = React14.useCallback(
+    (rowIndex, colIndex) => {
+      if (!selection) return false;
+      const normalized = normalizeRange(selection);
+      return rowIndex >= normalized.startRow && rowIndex <= normalized.endRow && colIndex >= normalized.startCol && colIndex <= normalized.endCol;
+    },
+    [selection]
+  );
+  const handleMouseDown = React14.useCallback(
+    (rowIndex, colIndex, event) => {
+      if (!enabled) return;
+      if (event.shiftKey && anchorRef.current) {
+        const newRange = {
+          endCol: colIndex,
+          endRow: rowIndex,
+          startCol: anchorRef.current.col,
+          startRow: anchorRef.current.row
+        };
+        updateSelection(newRange);
+        notifySelectionChange(newRange);
+      } else {
+        anchorRef.current = { col: colIndex, row: rowIndex };
+        const newRange = {
+          endCol: colIndex,
+          endRow: rowIndex,
+          startCol: colIndex,
+          startRow: rowIndex
+        };
+        updateSelection(newRange);
+        isDraggingRef.current = true;
+        notifySelectionChange(newRange);
+      }
+    },
+    [enabled, updateSelection, notifySelectionChange]
+  );
+  const handleMouseMove = React14.useCallback(
+    (rowIndex, colIndex) => {
+      if (!enabled || !isDraggingRef.current || !anchorRef.current) return;
+      const newRange = {
+        endCol: colIndex,
+        endRow: rowIndex,
+        startCol: anchorRef.current.col,
+        startRow: anchorRef.current.row
+      };
+      updateSelection(newRange);
+      notifySelectionChange(newRange);
+    },
+    [enabled, updateSelection, notifySelectionChange]
+  );
+  const handleMouseUp = React14.useCallback(() => {
+    isDraggingRef.current = false;
+  }, []);
+  React14.useEffect(() => {
+    if (!enabled) return;
+    const handleKeyDown = (event) => {
+      const isCtrlOrMeta = event.ctrlKey || event.metaKey;
+      if (isCtrlOrMeta && event.key === "a" && rowCount > 0 && colCount > 0) {
+        event.preventDefault();
+        const allRange = {
+          endCol: colCount - 1,
+          endRow: rowCount - 1,
+          startCol: 0,
+          startRow: 0
+        };
+        anchorRef.current = { col: 0, row: 0 };
+        updateSelection(allRange);
+        notifySelectionChange(allRange);
+      }
+    };
+    const handleGlobalMouseUp = () => {
+      isDraggingRef.current = false;
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    window.addEventListener("mouseup", handleGlobalMouseUp);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+      window.removeEventListener("mouseup", handleGlobalMouseUp);
+    };
+  }, [enabled, rowCount, colCount, updateSelection, notifySelectionChange]);
+  return {
+    clearSelection,
+    getSelectedCells,
+    handleMouseDown,
+    handleMouseMove,
+    handleMouseUp,
+    isSelected,
+    selection
+  };
+}
+var DEFAULT_MAX_SIZE = 50;
+function useDataTableHistory({
+  containerRef,
+  maxSize = DEFAULT_MAX_SIZE,
+  onApply
+} = {}) {
+  const [undoStack, setUndoStack] = React14.useState([]);
+  const [redoStack, setRedoStack] = React14.useState([]);
+  const pushEdit = React14.useCallback(
+    (entry) => {
+      setUndoStack((prev) => {
+        const next = [...prev, entry];
+        if (next.length > maxSize) {
+          return next.slice(next.length - maxSize);
+        }
+        return next;
+      });
+      setRedoStack([]);
+    },
+    [maxSize]
+  );
+  const undoStackRef = React14.useRef(undoStack);
+  const redoStackRef = React14.useRef(redoStack);
+  const onApplyRef = React14.useRef(onApply);
+  React14.useEffect(() => {
+    undoStackRef.current = undoStack;
+  }, [undoStack]);
+  React14.useEffect(() => {
+    redoStackRef.current = redoStack;
+  }, [redoStack]);
+  React14.useEffect(() => {
+    onApplyRef.current = onApply;
+  }, [onApply]);
+  const undo = React14.useCallback(() => {
+    const entry = undoStackRef.current.at(-1);
+    if (!entry) return;
+    setUndoStack((prev) => prev.slice(0, -1));
+    setRedoStack((prev) => [...prev, entry]);
+    onApplyRef.current?.(entry, "undo");
+  }, []);
+  const redo = React14.useCallback(() => {
+    const entry = redoStackRef.current.at(-1);
+    if (!entry) return;
+    setRedoStack((prev) => prev.slice(0, -1));
+    setUndoStack((prev) => [...prev, entry]);
+    onApplyRef.current?.(entry, "redo");
+  }, []);
+  const clear = React14.useCallback(() => {
+    setUndoStack([]);
+    setRedoStack([]);
+  }, []);
+  React14.useEffect(() => {
+    if (!onApplyRef.current) return;
+    function handleKeyDown(event) {
+      if (containerRef?.current && !containerRef.current.contains(document.activeElement)) {
+        return;
+      }
+      const isCtrlOrMeta = event.ctrlKey || event.metaKey;
+      if (!isCtrlOrMeta) return;
+      if ((event.key === "z" || event.key === "Z") && event.shiftKey) {
+        event.preventDefault();
+        redo();
+        return;
+      }
+      if (event.key === "y" || event.key === "Y") {
+        event.preventDefault();
+        redo();
+        return;
+      }
+      if (event.key === "z" && !event.shiftKey) {
+        event.preventDefault();
+        undo();
+      }
+    }
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [containerRef, onApply, redo, undo]);
+  return {
+    canRedo: redoStack.length > 0,
+    canUndo: undoStack.length > 0,
+    clear,
+    pushEdit,
+    redo,
+    undo
+  };
+}
+function useDataTableInfiniteScroll({
+  enabled,
+  hasNextPage,
+  isFetching,
+  onLoadMore,
+  rootMargin = "200px"
+}) {
+  const observerRef = React14.useRef(null);
+  const sentinelNodeRef = React14.useRef(null);
+  const onLoadMoreRef = React14.useRef(onLoadMore);
+  React14.useEffect(() => {
+    onLoadMoreRef.current = onLoadMore;
+  }, [onLoadMore]);
+  const disconnectObserver = React14.useCallback(() => {
+    if (observerRef.current) {
+      observerRef.current.disconnect();
+      observerRef.current = null;
+    }
+  }, []);
+  React14.useEffect(() => {
+    if (!enabled || !hasNextPage || isFetching) {
+      disconnectObserver();
+      return;
+    }
+    const observer = new IntersectionObserver(
+      (entries) => {
+        const entry = entries[0];
+        if (entry?.isIntersecting) {
+          onLoadMoreRef.current();
+        }
+      },
+      { rootMargin }
+    );
+    observerRef.current = observer;
+    if (sentinelNodeRef.current) {
+      observer.observe(sentinelNodeRef.current);
+    }
+    return () => {
+      observer.disconnect();
+    };
+  }, [disconnectObserver, enabled, hasNextPage, isFetching, rootMargin]);
+  const sentinelRef = React14.useCallback(
+    (node) => {
+      if (sentinelNodeRef.current && observerRef.current) {
+        observerRef.current.unobserve(sentinelNodeRef.current);
+      }
+      sentinelNodeRef.current = node;
+      if (node && observerRef.current) {
+        observerRef.current.observe(node);
+      }
+    },
+    []
+  );
+  return {
+    isLoading: isFetching,
+    sentinelRef
+  };
+}
+function parseClipboardText(text) {
+  const lines = text.replaceAll(/\r\n?/g, "\n").trimEnd().split("\n");
+  const delimiter = lines.some((line) => line.includes("	")) ? "	" : ",";
+  return lines.map((line) => line.split(delimiter));
+}
+function mapRowToCells(parsedRow, targetRowIndex, startCol, visibleColumns) {
+  const cells = [];
+  let editableColOffset = 0;
+  for (const value of parsedRow) {
+    let targetColIndex = startCol + editableColOffset;
+    while (targetColIndex < visibleColumns.length) {
+      const col = visibleColumns[targetColIndex];
+      if (!col) break;
+      const meta2 = col.columnDef.meta;
+      if (meta2?.editable) break;
+      targetColIndex++;
+      editableColOffset++;
+    }
+    const column = visibleColumns[targetColIndex];
+    if (!column) continue;
+    const meta = column.columnDef.meta;
+    if (!meta?.editable) continue;
+    cells.push({ columnId: column.id, rowIndex: targetRowIndex, value });
+    editableColOffset++;
+  }
+  return cells;
+}
+function useDataTablePaste({
+  enabled,
+  focusedCell,
+  onPaste,
+  table
+}) {
+  const handlePaste = React14.useCallback(
+    (event) => {
+      if (!enabled || !focusedCell || !onPaste) return;
+      const text = event.clipboardData.getData("text/plain");
+      if (!text) return;
+      event.preventDefault();
+      const parsed = parseClipboardText(text);
+      const rows = table.getRowModel().rows;
+      const visibleColumns = table.getVisibleLeafColumns();
+      const cells = [];
+      for (const [rowOffset, parsedRow] of parsed.entries()) {
+        const targetRowIndex = focusedCell.row + rowOffset;
+        const targetRow = rows[targetRowIndex];
+        if (!targetRow) continue;
+        const rowCells = mapRowToCells(parsedRow, targetRowIndex, focusedCell.col, visibleColumns);
+        cells.push(...rowCells);
+      }
+      if (cells.length > 0) {
+        onPaste({ cells });
+      }
+    },
+    [enabled, focusedCell, onPaste, table]
+  );
+  return {
+    handlePaste
+  };
+}
+function useDataTableRowEditing({
+  enabled,
+  onRowEdit,
+  onRowEditCancel
+}) {
+  const [editingRowId, setEditingRowId] = React14.useState(null);
+  const [rowEditValues, setRowEditValues] = React14.useState({});
+  const [oldValues, setOldValues] = React14.useState({});
+  const editingRowRef = React14.useRef(null);
+  const isRowEditing = React14.useCallback(
+    (rowId) => editingRowId === rowId,
+    [editingRowId]
+  );
+  const startRowEdit = React14.useCallback(
+    (row) => {
+      if (!enabled) return;
+      const initialValues = {};
+      const currentOldValues = {};
+      for (const cell of row.getAllCells()) {
+        const meta = cell.column.columnDef.meta;
+        if (meta?.editable) {
+          const value = row.getValue(cell.column.id);
+          initialValues[cell.column.id] = value;
+          currentOldValues[cell.column.id] = value;
+        }
+      }
+      editingRowRef.current = row;
+      setEditingRowId(row.id);
+      setRowEditValues(initialValues);
+      setOldValues(currentOldValues);
+    },
+    [enabled]
+  );
+  const cancelRowEdit = React14.useCallback(() => {
+    if (editingRowId === null) return;
+    const row = editingRowRef.current;
+    editingRowRef.current = null;
+    setEditingRowId(null);
+    setRowEditValues({});
+    setOldValues({});
+    if (row && onRowEditCancel) {
+      onRowEditCancel({ row });
+    }
+  }, [editingRowId, onRowEditCancel]);
+  const setRowEditValue = React14.useCallback(
+    (columnId, value) => {
+      setRowEditValues((prev) => ({ ...prev, [columnId]: value }));
+    },
+    []
+  );
+  const submitRowEdit = React14.useCallback(
+    async (row) => {
+      if (!enabled || editingRowId === null) return;
+      if (onRowEdit) {
+        const accepted = await onRowEdit({
+          oldValues,
+          row,
+          values: rowEditValues
+        });
+        if (!accepted) {
+          return;
+        }
+      }
+      editingRowRef.current = null;
+      setEditingRowId(null);
+      setRowEditValues({});
+      setOldValues({});
+    },
+    [enabled, editingRowId, oldValues, onRowEdit, rowEditValues]
+  );
+  return {
+    cancelRowEdit,
+    editingRowId,
+    isRowEditing,
+    rowEditValues,
+    setRowEditValue,
+    startRowEdit,
+    submitRowEdit
+  };
+}
+function cleanupDataAttributes(element) {
+  const dragging = element.closest("table")?.querySelectorAll("[data-dragging]");
+  const dragOver = element.closest("table")?.querySelectorAll("[data-drag-over]");
+  dragging?.forEach((el) => {
+    el.removeAttribute("data-dragging");
+  });
+  dragOver?.forEach((el) => {
+    el.removeAttribute("data-drag-over");
+  });
+}
+function useDataTableRowReordering({
+  enabled,
+  onRowReorder
+}) {
+  const [draggedIndex, setDraggedIndex] = React14.useState(null);
+  const [targetIndex, setTargetIndex] = React14.useState(null);
+  const isDragging = draggedIndex !== null;
+  const handleDragStart = React14.useCallback(
+    (rowIndex, event) => {
+      if (!enabled) return;
+      setDraggedIndex(rowIndex);
+      event.dataTransfer.effectAllowed = "move";
+      event.currentTarget.setAttribute("data-dragging", "true");
+    },
+    [enabled]
+  );
+  const handleDragOver = React14.useCallback(
+    (rowIndex, event) => {
+      if (!enabled || draggedIndex === null) return;
+      event.preventDefault();
+      event.dataTransfer.dropEffect = "move";
+      if (targetIndex !== null && targetIndex !== rowIndex) {
+        const table = event.currentTarget.closest("table");
+        const previousTarget = table?.querySelector("[data-drag-over]");
+        previousTarget?.removeAttribute("data-drag-over");
+      }
+      setTargetIndex(rowIndex);
+      event.currentTarget.setAttribute("data-drag-over", "true");
+    },
+    [enabled, draggedIndex, targetIndex]
+  );
+  const handleDrop = React14.useCallback(
+    (rowIndex, event) => {
+      if (!enabled || draggedIndex === null) return;
+      event.preventDefault();
+      cleanupDataAttributes(event.currentTarget);
+      if (draggedIndex !== rowIndex && onRowReorder) {
+        onRowReorder({ fromIndex: draggedIndex, toIndex: rowIndex });
+      }
+      setDraggedIndex(null);
+      setTargetIndex(null);
+    },
+    [enabled, draggedIndex, onRowReorder]
+  );
+  const handleDragEnd = React14.useCallback(
+    (_rowIndex, event) => {
+      cleanupDataAttributes(event.currentTarget);
+      setDraggedIndex(null);
+      setTargetIndex(null);
+    },
+    []
+  );
+  const dragHandleProps = React14.useCallback(
+    (rowIndex) => ({
+      draggable: enabled,
+      onDragEnd: (event) => {
+        handleDragEnd(rowIndex, event);
+      },
+      onDragOver: (event) => {
+        handleDragOver(rowIndex, event);
+      },
+      onDragStart: (event) => {
+        handleDragStart(rowIndex, event);
+      },
+      onDrop: (event) => {
+        handleDrop(rowIndex, event);
+      }
+    }),
+    [enabled, handleDragEnd, handleDragOver, handleDragStart, handleDrop]
+  );
+  return {
+    dragHandleProps,
+    isDragging
+  };
+}
+var DEFAULT_PAGE_INDEX = 0;
+var DEFAULT_PAGE_SIZE = 10;
+var DEFAULT_PREFIX = "dt_";
+var PARAM_FILTER = "filter";
+var PARAM_PAGE = "page";
+var PARAM_PAGE_SIZE = "pageSize";
+var PARAM_SEARCH = "search";
+var PARAM_SORT = "sort";
+function parseSortingParam(raw) {
+  if (!raw) return [];
+  return raw.split(",").reduce((acc, segment) => {
+    const lastDot = segment.lastIndexOf(".");
+    if (lastDot === -1) return acc;
+    const id = segment.slice(0, lastDot);
+    const direction = segment.slice(lastDot + 1);
+    if (id && (direction === "asc" || direction === "desc")) {
+      acc.push({ desc: direction === "desc", id });
+    }
+    return acc;
+  }, []);
+}
+function parsePaginationParams(pageRaw, pageSizeRaw) {
+  const pageIndex = pageRaw ? Math.max(0, Number.parseInt(pageRaw, 10) - 1) : DEFAULT_PAGE_INDEX;
+  const pageSize = pageSizeRaw ? Math.max(1, Number.parseInt(pageSizeRaw, 10)) : DEFAULT_PAGE_SIZE;
+  return {
+    pageIndex: Number.isNaN(pageIndex) ? DEFAULT_PAGE_INDEX : pageIndex,
+    pageSize: Number.isNaN(pageSize) ? DEFAULT_PAGE_SIZE : pageSize
+  };
+}
+function parseColumnFiltersParam(raw) {
+  if (!raw) return [];
+  try {
+    const parsed = JSON.parse(raw);
+    if (!Array.isArray(parsed)) return [];
+    return parsed.reduce((acc, item) => {
+      if (item !== null && typeof item === "object" && "id" in item && "value" in item && typeof item.id === "string") {
+        acc.push({ id: item.id, value: item.value });
+      }
+      return acc;
+    }, []);
+  } catch {
+    return [];
+  }
+}
+function serializeSorting(sorting) {
+  return sorting.map((s) => `${s.id}.${s.desc ? "desc" : "asc"}`).join(",");
+}
+function serializeColumnFilters(filters) {
+  if (filters.length === 0) return "";
+  return JSON.stringify(filters.map((f) => ({ id: f.id, value: f.value })));
+}
+function readStateFromUrl(prefix) {
+  const params = new URLSearchParams(window.location.search);
+  return {
+    columnFilters: parseColumnFiltersParam(params.get(`${prefix}${PARAM_FILTER}`)),
+    globalFilter: params.get(`${prefix}${PARAM_SEARCH}`) ?? "",
+    pagination: parsePaginationParams(
+      params.get(`${prefix}${PARAM_PAGE}`),
+      params.get(`${prefix}${PARAM_PAGE_SIZE}`)
+    ),
+    sorting: parseSortingParam(params.get(`${prefix}${PARAM_SORT}`))
+  };
+}
+function writeStateToUrl(prefix, state) {
+  const params = new URLSearchParams(window.location.search);
+  setOrDelete(params, `${prefix}${PARAM_SORT}`, serializeSorting(state.sorting));
+  setOrDelete(params, `${prefix}${PARAM_SEARCH}`, state.globalFilter);
+  setOrDelete(params, `${prefix}${PARAM_FILTER}`, serializeColumnFilters(state.columnFilters));
+  const pageValue = state.pagination.pageIndex > DEFAULT_PAGE_INDEX ? String(state.pagination.pageIndex + 1) : "";
+  setOrDelete(params, `${prefix}${PARAM_PAGE}`, pageValue);
+  const pageSizeValue = state.pagination.pageSize !== DEFAULT_PAGE_SIZE ? String(state.pagination.pageSize) : "";
+  setOrDelete(params, `${prefix}${PARAM_PAGE_SIZE}`, pageSizeValue);
+  const search = params.toString();
+  const newUrl = `${window.location.pathname}${search ? `?${search}` : ""}`;
+  window.history.replaceState(null, "", newUrl);
+}
+function setOrDelete(params, key, value) {
+  if (value) {
+    params.set(key, value);
+  } else {
+    params.delete(key);
+  }
+}
+function useDataTableUrlState({
+  enabled,
+  prefix = DEFAULT_PREFIX
+}) {
+  const initial = React14.useMemo(() => {
+    if (!enabled || typeof window === "undefined") {
+      return {
+        columnFilters: [],
+        globalFilter: "",
+        pagination: { pageIndex: DEFAULT_PAGE_INDEX, pageSize: DEFAULT_PAGE_SIZE },
+        sorting: []
+      };
+    }
+    return readStateFromUrl(prefix);
+  }, [enabled, prefix]);
+  const updateUrl = React14.useCallback(
+    (state) => {
+      if (!enabled || typeof window === "undefined") return;
+      writeStateToUrl(prefix, state);
+    },
+    [enabled, prefix]
+  );
+  return {
+    initialColumnFilters: initial.columnFilters,
+    initialGlobalFilter: initial.globalFilter,
+    initialPagination: initial.pagination,
+    initialSorting: initial.sorting,
+    updateUrl
+  };
+}
+function DataTable(props) {
+  const {
+    advancedFilterColumns = [],
+    bulkActions,
+    cellClassName,
+    className,
+    contextMenuItems,
+    data,
+    density: controlledDensity,
+    editTrigger = "dblclick",
+    emptyState,
+    enableAdvancedFilter = false,
+    enableBatchEditing = false,
+    enableCellSelection = false,
+    enableClipboard = false,
+    enableColumnFilters = false,
+    enableColumnMenu = false,
+    enableColumnOrdering = false,
+    enableColumnPinning = false,
+    enableColumnResizing = false,
+    enableColumnVirtualization = false,
+    enableColumnVisibility = false,
+    enableDensityToggle = false,
+    enableEditing = false,
+    enableExport = false,
+    enableFillHandle = false,
+    enableFilterChips = false,
+    enableFiltering = true,
+    enableFind = false,
+    enableGrouping = false,
+    enableInfiniteScroll = false,
+    enableKeyboardNavigation = false,
+    enablePagination = true,
+    enablePaste = false,
+    enablePrint = false,
+    enableResponsive = false,
+    enableRowAnimation = false,
+    enableRowColumnSpanning = false,
+    enableRowEditing = false,
+    enableRowNumbers = false,
+    enableRowSelection = false,
+    enableSearch = true,
+    enableSearchHighlight = false,
+    enableSidePanel = false,
+    enableStatusBar = false,
+    enableStickyHeader = false,
+    enableStriping = false,
+    enableTrailingRow = false,
+    enableUndoRedo = false,
+    enableUrlState = false,
+    enableVirtualization = false,
+    error = false,
+    errorState,
+    exportFormats = ["csv"],
+    filterPresets,
+    hasNextPage = false,
+    isFetching = false,
+    loading = false,
+    loadingComponent,
+    maxHeight,
+    onAddRow,
+    onCellFill,
+    onCellSelectionChange,
+    onDeleteFilterPreset,
+    onDensityChange,
+    onLoadMore,
+    onPaginationChange,
+    onPaste,
+    onRowClick,
+    onRowEdit,
+    onRowEditCancel,
+    onRowReorder,
+    onSaveFilterPreset,
+    onSidePanelOpenChange,
+    onUndoRedo,
+    pageSizeOptions = [10, 20, 50],
+    renderColumnFilter,
+    renderSubComponent,
+    responsiveBreakpoint = 768,
+    rowClassName,
+    searchPlaceholder = "Search...",
+    sidePanelContent,
+    sidePanelOpen: controlledSidePanelOpen,
+    statusBarItems,
+    urlStatePrefix
+  } = props;
+  const [internalDensity, setInternalDensity] = React14.useState("default");
+  const density = controlledDensity ?? internalDensity;
+  const handleDensityChange = React14.useCallback(
+    (newDensity) => {
+      if (onDensityChange) {
+        onDensityChange(newDensity);
+      } else {
+        setInternalDensity(newDensity);
+      }
+    },
+    [onDensityChange]
+  );
+  const [findBarOpen, setFindBarOpen] = React14.useState(false);
+  const [internalSidePanelOpen, setInternalSidePanelOpen] = React14.useState(false);
+  const sidePanelOpen = controlledSidePanelOpen ?? internalSidePanelOpen;
+  const setSidePanelOpen = React14.useCallback(
+    (open) => {
+      if (onSidePanelOpenChange) {
+        onSidePanelOpenChange(open);
+      } else {
+        setInternalSidePanelOpen(open);
+      }
+    },
+    [onSidePanelOpenChange]
+  );
+  const containerRef = React14.useRef(null);
+  const isBelowBreakpoint = useMediaQuery(`(max-width: ${String(responsiveBreakpoint)}px)`);
+  const showCardView = enableResponsive && isBelowBreakpoint;
+  const selectionColumn = React14.useMemo(() => {
+    if (!enableRowSelection) return null;
+    return {
+      id: "select",
+      header: ({ table: table2 }) => /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          checked: table2.getIsAllPageRowsSelected() || table2.getIsSomePageRowsSelected() && "indeterminate",
+          "aria-label": "Select all",
+          onCheckedChange: (value) => {
+            table2.toggleAllPageRowsSelected(!!value);
+          }
+        }
+      ),
+      cell: ({ row }) => /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          "aria-label": "Select row",
+          checked: row.getIsSelected(),
+          onCheckedChange: (value) => {
+            row.toggleSelected(!!value);
+          }
+        }
+      ),
+      enableSorting: false,
+      enableHiding: false
+    };
+  }, [enableRowSelection]);
+  const rowNumberColumn = React14.useMemo(() => {
+    if (!enableRowNumbers) return null;
+    return {
+      id: "_row_number",
+      header: "#",
+      cell: ({ row }) => /* @__PURE__ */ jsx("span", { className: "text-muted-foreground tabular-nums text-right block text-xs", children: row.index + 1 }),
+      size: 50,
+      enableSorting: false,
+      enableHiding: false,
+      enableResizing: false,
+      enableColumnFilter: false,
+      enableGlobalFilter: false
+    };
+  }, [enableRowNumbers]);
+  const urlState = useDataTableUrlState({
+    enabled: enableUrlState,
+    prefix: urlStatePrefix
+  });
+  const mergedProps = React14.useMemo(() => {
+    if (!enableUrlState) return props;
+    return {
+      ...props,
+      initialColumnFilters: props.initialColumnFilters ?? (urlState.initialColumnFilters.length > 0 ? urlState.initialColumnFilters : void 0),
+      initialGlobalFilter: props.initialGlobalFilter ?? (urlState.initialGlobalFilter || void 0),
+      initialPagination: props.initialPagination ?? (urlState.initialPagination.pageIndex > 0 || urlState.initialPagination.pageSize !== 10 ? urlState.initialPagination : void 0),
+      initialSorting: props.initialSorting ?? (urlState.initialSorting.length > 0 ? urlState.initialSorting : void 0)
+    };
+  }, [enableUrlState]);
+  const {
+    cancelEdit,
+    columnVirtualizer,
+    currentAdvancedFilter,
+    debouncedFilterUpdate,
+    editError,
+    editingCell,
+    editValue,
+    focusedCell,
+    getPinnedAttribute,
+    getPinnedStyles,
+    handleAdvancedFilterChange,
+    handleCellFocus,
+    handleCopy,
+    handleExport,
+    handleKeyDown,
+    hasFooter,
+    pagination,
+    rowVirtualizer,
+    scrollContainerRef,
+    searchDisplayValue,
+    setEditInputRef,
+    setEditValue,
+    setInternalPagination,
+    setSearchDisplayValue,
+    startEdit,
+    submitEdit,
+    table,
+    tableColumns,
+    tableRef
+  } = useDataTable(mergedProps, selectionColumn, rowNumberColumn);
+  const historyOnApply = React14.useCallback(
+    (entry, direction) => {
+      if (!onUndoRedo) return;
+      const value = direction === "undo" ? entry.oldValue : entry.newValue;
+      onUndoRedo({ columnId: entry.columnId, rowId: entry.rowId, value }, direction);
+    },
+    [onUndoRedo]
+  );
+  useDataTableHistory({
+    containerRef,
+    onApply: enableUndoRedo ? historyOnApply : void 0
+  });
+  const cellSelection = useDataTableCellSelection({
+    colCount: table.getVisibleLeafColumns().length,
+    enabled: enableCellSelection,
+    onSelectionChange: onCellSelectionChange,
+    rowCount: table.getRowModel().rows.length
+  });
+  const noop = React14.useCallback(() => {
+  }, []);
+  const infiniteScroll = useDataTableInfiniteScroll({
+    enabled: enableInfiniteScroll,
+    hasNextPage,
+    isFetching,
+    onLoadMore: onLoadMore ?? noop
+  });
+  const { handlePaste } = useDataTablePaste({
+    enabled: enablePaste,
+    focusedCell,
+    onPaste,
+    table
+  });
+  useDataTableRowEditing({
+    enabled: enableRowEditing,
+    onRowEdit,
+    onRowEditCancel
+  });
+  useDataTableBatchEditing({
+    enabled: enableBatchEditing,
+    selectedCells: cellSelection.getSelectedCells().map((c) => ({ col: c.colIndex, row: c.rowIndex })),
+    table
+  });
+  const rowReordering = useDataTableRowReordering({
+    enabled: props.enableRowReordering ?? false,
+    onRowReorder: onRowReorder ? (params) => {
+      onRowReorder(params.fromIndex, params.toIndex);
+    } : void 0
+  });
+  const tableState = table.getState();
+  const currentSorting = tableState.sorting;
+  const currentPagination = tableState.pagination;
+  const currentColumnFilters = tableState.columnFilters;
+  const currentGlobalFilter = tableState.globalFilter;
+  const urlUpdateUrl = urlState.updateUrl;
+  React14.useEffect(() => {
+    if (!enableUrlState) return;
+    urlUpdateUrl({
+      columnFilters: currentColumnFilters,
+      globalFilter: currentGlobalFilter,
+      pagination: currentPagination,
+      sorting: currentSorting
+    });
+  }, [enableUrlState, urlUpdateUrl, currentSorting, currentPagination, currentColumnFilters, currentGlobalFilter]);
+  const handlePrint = React14.useCallback(() => {
+    window.print();
+  }, []);
+  React14.useEffect(() => {
+    if (!enableFind) return;
+    function handleFindKeyDown(e) {
+      const isCtrlOrMeta = e.ctrlKey || e.metaKey;
+      if (isCtrlOrMeta && e.key === "f" && containerRef.current?.contains(document.activeElement)) {
+        e.preventDefault();
+        setFindBarOpen(true);
+      }
+    }
+    document.addEventListener("keydown", handleFindKeyDown);
+    return () => {
+      document.removeEventListener("keydown", handleFindKeyDown);
+    };
+  }, [enableFind]);
+  const handleFindBarClose = React14.useCallback(() => {
+    setFindBarOpen(false);
+  }, []);
+  if (loading || error || data.length === 0) {
+    return /* @__PURE__ */ jsx(
+      DataTableEmptyState,
+      {
+        className,
+        emptyState,
+        error,
+        errorState,
+        loading,
+        loadingComponent
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: containerRef,
+      className: cn(dataTableVariants({ density }), "relative", className),
+      "data-slot": "data-table",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(
+          DataTableToolbar,
+          {
+            advancedFilterColumns,
+            columns: enableColumnVisibility ? table.getAllLeafColumns() : void 0,
+            currentAdvancedFilter,
+            debouncedFilterUpdate,
+            density,
+            enableAdvancedFilter,
+            enableColumnVisibility,
+            enableDensityToggle,
+            enableExport,
+            enableFiltering,
+            enablePrint,
+            enableSearch,
+            exportFormats,
+            filterPresets,
+            searchDisplayValue,
+            searchPlaceholder,
+            setSearchDisplayValue,
+            onAdvancedFilterChange: handleAdvancedFilterChange,
+            onDeleteFilterPreset,
+            onDensityChange: handleDensityChange,
+            onExport: handleExport,
+            onPrint: handlePrint,
+            onSaveFilterPreset
+          }
+        ) }),
+        enableFind && /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(
+          DataTableFindBar,
+          {
+            open: findBarOpen,
+            tableRef,
+            onClose: handleFindBarClose
+          }
+        ) }),
+        enableFilterChips && /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(DataTableFilterChips, { table }) }),
+        bulkActions && bulkActions.length > 0 && enableRowSelection && /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(
+          DataTableBulkActions,
+          {
+            actions: bulkActions,
+            table
+          }
+        ) }),
+        showCardView ? /* @__PURE__ */ jsx(
+          DataTableCardView,
+          {
+            rowClassName,
+            table,
+            onRowClick
+          }
+        ) : (
+          /* Table View */
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              ref: enableVirtualization || enableColumnVirtualization ? scrollContainerRef : void 0,
+              style: (enableVirtualization || enableColumnVirtualization || enableStickyHeader) && maxHeight ? {
+                maxHeight: typeof maxHeight === "number" ? `${String(maxHeight)}px` : maxHeight,
+                overflow: "auto"
+              } : void 0,
+              className: "rounded-md border print:border-none print:w-full print:max-h-none print:overflow-visible",
+              "data-slot": "data-table-container",
+              children: [
+                /* @__PURE__ */ jsxs(
+                  Table,
+                  {
+                    ref: tableRef,
+                    "aria-colcount": enableKeyboardNavigation ? table.getVisibleLeafColumns().length : void 0,
+                    "aria-rowcount": enableKeyboardNavigation ? table.getRowModel().rows.length + 1 : void 0,
+                    role: enableKeyboardNavigation ? "grid" : void 0,
+                    onCopy: enableClipboard ? handleCopy : void 0,
+                    onKeyDown: enableKeyboardNavigation ? handleKeyDown : void 0,
+                    onPaste: enablePaste ? handlePaste : void 0,
+                    children: [
+                      /* @__PURE__ */ jsx(
+                        DataTableHeader,
+                        {
+                          columnVirtualizer: enableColumnVirtualization ? columnVirtualizer : void 0,
+                          enableColumnFilters,
+                          enableColumnMenu,
+                          enableColumnOrdering,
+                          enableColumnPinning,
+                          enableColumnResizing,
+                          enableColumnVisibility,
+                          enableGrouping,
+                          enableSorting: props.enableSorting ?? true,
+                          enableStickyHeader,
+                          getPinnedAttribute,
+                          getPinnedStyles,
+                          renderColumnFilter,
+                          table
+                        }
+                      ),
+                      /* @__PURE__ */ jsx(
+                        DataTableBody,
+                        {
+                          cancelEdit,
+                          cellClassName,
+                          columnVirtualizer: enableColumnVirtualization ? columnVirtualizer : void 0,
+                          containerRef,
+                          contextMenuItems,
+                          dragHandleProps: rowReordering.dragHandleProps,
+                          editError,
+                          editingCell,
+                          editTrigger,
+                          editValue,
+                          enableColumnPinning,
+                          enableEditing,
+                          enableGrouping,
+                          enableKeyboardNavigation,
+                          enableRowAnimation: enableRowAnimation && !enableVirtualization,
+                          enableRowColumnSpanning,
+                          enableRowReordering: props.enableRowReordering ?? false,
+                          enableRowSelection,
+                          enableSearchHighlight,
+                          enableStriping,
+                          enableVirtualization,
+                          focusedCell,
+                          getPinnedAttribute,
+                          getPinnedStyles,
+                          globalFilter: enableSearchHighlight ? table.getState().globalFilter : void 0,
+                          handleCellFocus,
+                          hasFooter,
+                          renderSubComponent,
+                          rowClassName,
+                          rowVirtualizer: enableVirtualization ? rowVirtualizer : void 0,
+                          setEditInputRef,
+                          setEditValue,
+                          startEdit,
+                          submitEdit,
+                          table,
+                          tableColumns,
+                          onRowClick
+                        }
+                      ),
+                      enableTrailingRow && onAddRow && /* @__PURE__ */ jsx("tfoot", { children: /* @__PURE__ */ jsx(
+                        DataTableTrailingRow,
+                        {
+                          columns: tableColumns,
+                          onAdd: onAddRow
+                        }
+                      ) })
+                    ]
+                  }
+                ),
+                enableFillHandle && onCellFill && focusedCell && /* @__PURE__ */ jsx(
+                  DataTableFillHandle,
+                  {
+                    position: focusedCell,
+                    tableRef,
+                    onFill: onCellFill
+                  }
+                ),
+                enableInfiniteScroll && /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    ref: infiniteScroll.sentinelRef,
+                    "aria-hidden": "true",
+                    style: { height: 1 }
+                  }
+                )
+              ]
+            }
+          )
+        ),
+        enablePagination && !enableVirtualization && !showCardView && /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(
+          DataTablePagination,
+          {
+            enableRowSelection,
+            pageSizeOptions,
+            pagination,
+            setInternalPagination,
+            table,
+            onPaginationChange
+          }
+        ) }),
+        enableStatusBar && /* @__PURE__ */ jsx("div", { className: "print:hidden", children: /* @__PURE__ */ jsx(
+          DataTableStatusBar,
+          {
+            enableRowSelection,
+            items: statusBarItems,
+            table
+          }
+        ) }),
+        enableSidePanel && /* @__PURE__ */ jsx(
+          DataTableSidePanel,
+          {
+            open: sidePanelOpen,
+            onClose: () => {
+              setSidePanelOpen(false);
+            },
+            children: sidePanelContent
+          }
+        ),
+        /* @__PURE__ */ jsxs("div", { "aria-atomic": "true", "aria-live": "polite", className: "sr-only", children: [
+          table.getFilteredRowModel().rows.length,
+          " rows",
+          enableRowSelection && table.getFilteredSelectedRowModel().rows.length > 0 ? `, ${String(table.getFilteredSelectedRowModel().rows.length)} selected` : ""
+        ] })
+      ]
+    }
+  );
+}
+function DataTableProgressCell({
+  className,
+  max = 100,
+  value
+}) {
+  const percent = Math.min(100, Math.max(0, value / max * 100));
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-2", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "h-2 w-full rounded-full bg-muted", children: /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "h-full rounded-full bg-primary transition-all",
+        style: { width: `${String(percent)}%` }
+      }
+    ) }),
+    /* @__PURE__ */ jsxs("span", { className: "w-8 text-right text-xs tabular-nums text-muted-foreground", children: [
+      Math.round(percent),
+      "%"
+    ] })
+  ] });
+}
+function DataTableRatingCell({
+  className,
+  max = 5,
+  value
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex items-center gap-0.5", className), children: Array.from({ length: max }, (_, i) => /* @__PURE__ */ jsx(
+    Star,
+    {
+      className: cn(
+        "size-3.5",
+        i < value ? "fill-yellow-400 text-yellow-400" : "text-muted-foreground/30"
+      )
+    },
+    i
+  )) });
+}
+function DataTableCurrencyCell({
+  className,
+  currency = "USD",
+  locale = "en-US",
+  value
+}) {
+  const formatted = new Intl.NumberFormat(locale, {
+    style: "currency",
+    currency
+  }).format(value);
+  return /* @__PURE__ */ jsx("span", { className: cn("tabular-nums", className), children: formatted });
+}
+function DataTableBooleanCell({
+  className,
+  value
+}) {
+  return value ? /* @__PURE__ */ jsx(Check, { className: cn("size-4 text-green-600", className) }) : /* @__PURE__ */ jsx(X, { className: cn("size-4 text-muted-foreground", className) });
+}
+function DataTableDateCell({
+  className,
+  format = "date",
+  now,
+  value
+}) {
+  const date = value instanceof Date ? value : new Date(value);
+  const [mountTime] = React14.useState(() => Date.now());
+  const referenceTime = now ?? mountTime;
+  let formatted;
+  if (format === "relative") {
+    const rtf = new Intl.RelativeTimeFormat("en", { numeric: "auto" });
+    const diffMs = date.getTime() - referenceTime;
+    const diffDays = Math.round(diffMs / (1e3 * 60 * 60 * 24));
+    if (Math.abs(diffDays) < 1) {
+      const diffHours = Math.round(diffMs / (1e3 * 60 * 60));
+      formatted = rtf.format(diffHours, "hour");
+    } else {
+      formatted = rtf.format(diffDays, "day");
+    }
+  } else {
+    const options = format === "datetime" ? { dateStyle: "medium", timeStyle: "short" } : format === "time" ? { timeStyle: "short" } : { dateStyle: "medium" };
+    formatted = new Intl.DateTimeFormat("en-US", options).format(date);
+  }
+  return /* @__PURE__ */ jsx("span", { className: cn("text-sm", className), children: formatted });
+}
+
+export { DataTable, DataTableBooleanCell, DataTableCurrencyCell, DataTableDateCell, DataTableProgressCell, DataTableRatingCell, downloadFile, exportToCSV, exportToExcel, exportToPDF, tableToCSV };
+//# sourceMappingURL=chunk-75QBUI2P.js.map
+//# sourceMappingURL=chunk-75QBUI2P.js.map