@caffeinebounce/ui 0.62.2

package/dist/chunk-7DHKQODW.mjs

@@ -0,0 +1,2932 @@
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from './chunk-6BUBNZPG.mjs';
+import { Button } from './chunk-VBD4Q5LL.mjs';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubTrigger, DropdownMenuSubContent } from './chunk-OFQLWSUR.mjs';
+import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from './chunk-YKZEKJMZ.mjs';
+import { Input } from './chunk-STEP6C4C.mjs';
+import { cn } from './chunk-IMKLN273.mjs';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { MoreHorizontal, Trash2, Check, X, Plus, GripVertical, ChevronDown, ChevronRight, Filter, ArrowDown, ArrowUp, ListOrdered, WrapText, EyeOff, ChevronsDownUp, ChevronsUpDown, Text, List, CheckSquare, Calendar, Hash, BookOpen, Info, DollarSign, TrendingUp, CheckCircle2, AlertTriangle } from 'lucide-react';
+import * as React3 from 'react';
+import { flexRender, useReactTable, getExpandedRowModel, getCoreRowModel } from '@tanstack/react-table';
+
+var Popover = PopoverPrimitive.Root;
+var PopoverTrigger = PopoverPrimitive.Trigger;
+var PopoverAnchor = PopoverPrimitive.Anchor;
+function PopoverContent({
+  className,
+  align = "center",
+  sideOffset = 4,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(
+    PopoverPrimitive.Content,
+    {
+      align,
+      sideOffset,
+      className: cn(
+        "bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 rounded-box border p-4 shadow-md outline-none",
+        className
+      ),
+      ...props
+    }
+  ) });
+}
+function Table({ className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx(
+    "table",
+    {
+      "data-slot": "table",
+      className: cn("w-full caption-bottom text-sm", className),
+      ...props
+    }
+  ) });
+}
+function TableHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "thead",
+    {
+      "data-slot": "table-header",
+      className: cn("[&_tr]:border-b", className),
+      ...props
+    }
+  );
+}
+function TableBody({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tbody",
+    {
+      "data-slot": "table-body",
+      className: cn("[&_tr:last-child]:border-0", className),
+      ...props
+    }
+  );
+}
+function TableFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tfoot",
+    {
+      "data-slot": "table-footer",
+      className: cn(
+        "bg-muted/50 border-t font-medium [&>tr]:last:border-b-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableRow({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tr",
+    {
+      "data-slot": "table-row",
+      className: cn(
+        "hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableHead({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "th",
+    {
+      "data-slot": "table-head",
+      className: cn(
+        "text-muted-foreground h-10 px-2 text-left align-middle font-medium [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCell({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "td",
+    {
+      "data-slot": "table-cell",
+      className: cn(
+        "p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCaption({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "caption",
+    {
+      "data-slot": "table-caption",
+      className: cn("text-muted-foreground mt-4 text-sm", className),
+      ...props
+    }
+  );
+}
+var colorMap = {
+  green: "#22c55e",
+  red: "#ef4444",
+  blue: "#3b82f6",
+  yellow: "#eab308",
+  orange: "#f97316",
+  purple: "#a855f7",
+  pink: "#ec4899",
+  gray: "#6b7280",
+  slate: "#64748b"
+};
+function getColorValue(color) {
+  if (!color) return void 0;
+  return colorMap[color.toLowerCase()] ?? color;
+}
+function TextLikeFilterBody({
+  type,
+  placeholder,
+  value,
+  onValueChange,
+  onApply,
+  onClear
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: "px-2 py-2", children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        type: type === "number" ? "number" : void 0,
+        placeholder,
+        value,
+        onChange: (e) => onValueChange(e.target.value),
+        onKeyDown: (e) => {
+          if (e.key === "Enter") {
+            e.preventDefault();
+            onApply();
+          }
+        },
+        className: "h-8 text-xs",
+        autoFocus: true
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mt-2 gap-2", children: [
+      value && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "sm",
+          className: "h-7 text-xs px-2 text-muted-foreground hover:text-foreground",
+          onClick: onClear,
+          children: "Clear"
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          size: "sm",
+          className: "h-7 text-xs px-3 ml-auto",
+          onClick: onApply,
+          children: "Apply"
+        }
+      )
+    ] })
+  ] });
+}
+function DataTableColumnFilterContent({
+  title,
+  value,
+  onChange,
+  onClear,
+  onDelete,
+  filterType = "text",
+  filterOptions,
+  placeholder,
+  showDeleteMenu = true
+}) {
+  const [localValue, setLocalValue] = React3.useState(value ?? "");
+  const [operator, setOperator] = React3.useState("is");
+  React3.useEffect(() => setLocalValue(value ?? ""), [value]);
+  const handleApply = () => onChange(localValue || void 0);
+  const handleClear = () => {
+    setLocalValue("");
+    onClear?.();
+    onChange(void 0);
+  };
+  const selectedValues = React3.useMemo(() => {
+    if (!localValue) return /* @__PURE__ */ new Set();
+    return new Set(localValue.split(",").filter(Boolean));
+  }, [localValue]);
+  const toggleOption = (optionValue) => {
+    const newSelected = new Set(selectedValues);
+    if (newSelected.has(optionValue)) {
+      newSelected.delete(optionValue);
+    } else {
+      newSelected.add(optionValue);
+    }
+    const newValue = Array.from(newSelected).join(",");
+    setLocalValue(newValue);
+    onChange(newValue || void 0);
+  };
+  const hasValue = Boolean(localValue);
+  return /* @__PURE__ */ jsxs("div", { className: "w-52", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 px-3 py-2 border-b border-border", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-foreground", children: title }),
+      /* @__PURE__ */ jsxs(
+        Select,
+        {
+          value: operator,
+          onValueChange: (v) => setOperator(v),
+          children: [
+            /* @__PURE__ */ jsx(SelectTrigger, { className: "!h-auto !min-h-0 !py-0.5 w-auto gap-1 border-0 shadow-none bg-muted/50 px-1.5 text-xs text-muted-foreground hover:text-foreground hover:bg-muted rounded focus:ring-0 focus:ring-offset-0 focus-visible:ring-0", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+            /* @__PURE__ */ jsxs(SelectContent, { children: [
+              /* @__PURE__ */ jsx(SelectItem, { value: "is", className: "text-xs", children: "is" }),
+              /* @__PURE__ */ jsx(SelectItem, { value: "is_not", className: "text-xs", children: "is not" }),
+              filterType === "text" && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx(SelectItem, { value: "contains", className: "text-xs", children: "contains" }),
+                /* @__PURE__ */ jsx(SelectItem, { value: "does_not_contain", className: "text-xs", children: "does not contain" })
+              ] }),
+              /* @__PURE__ */ jsx(SelectItem, { value: "is_empty", className: "text-xs", children: "is empty" }),
+              /* @__PURE__ */ jsx(SelectItem, { value: "is_not_empty", className: "text-xs", children: "is not empty" })
+            ] })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "flex-1" }),
+      showDeleteMenu && hasValue && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { variant: "ghost-icon", size: "icon-sm", className: "size-5", children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-3.5" }) }) }),
+        /* @__PURE__ */ jsx(DropdownMenuContent, { align: "start", side: "right", sideOffset: 4, children: /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: onDelete ?? handleClear,
+            className: "text-xs gap-2",
+            children: [
+              /* @__PURE__ */ jsx(Trash2, { className: "size-3.5" }),
+              "Delete filter"
+            ]
+          }
+        ) })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "p-1", children: [
+      filterType === "text" && /* @__PURE__ */ jsx(
+        TextLikeFilterBody,
+        {
+          placeholder: placeholder ?? `Search ${title.toLowerCase()}...`,
+          value: localValue,
+          onValueChange: setLocalValue,
+          onApply: handleApply,
+          onClear: handleClear
+        }
+      ),
+      filterType === "number" && /* @__PURE__ */ jsx(
+        TextLikeFilterBody,
+        {
+          type: "number",
+          placeholder: placeholder ?? `Enter ${title.toLowerCase()}...`,
+          value: localValue,
+          onValueChange: setLocalValue,
+          onApply: handleApply,
+          onClear: handleClear
+        }
+      ),
+      filterType === "select" && filterOptions && /* @__PURE__ */ jsx("div", { className: "max-h-64 overflow-y-auto px-1", children: filterOptions.map((option) => {
+        const isSelected = selectedValues.has(option.value);
+        const colorValue = getColorValue(option.color);
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: cn(
+              "flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-xs transition-colors",
+              "hover:bg-muted",
+              isSelected && "bg-muted/50"
+            ),
+            onClick: () => toggleOption(option.value),
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex size-3.5 shrink-0 items-center justify-center rounded-sm border self-center",
+                    isSelected ? "border-primary bg-primary text-primary-foreground" : "border-muted-foreground/30"
+                  ),
+                  children: isSelected && /* @__PURE__ */ jsx(Check, { className: "size-2.5" })
+                }
+              ),
+              option.badge ? /* @__PURE__ */ jsx("span", { className: "shrink-0 flex items-center", children: option.badge }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                (colorValue || option.icon) && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: option.icon ? option.icon : /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: "inline-block size-2 rounded-full",
+                    style: { backgroundColor: colorValue }
+                  }
+                ) }),
+                /* @__PURE__ */ jsx("span", { className: "truncate", children: option.label })
+              ] })
+            ]
+          },
+          option.value
+        );
+      }) }),
+      filterType === "boolean" && /* @__PURE__ */ jsx("div", { className: "px-1", children: (filterOptions ?? [
+        { label: "Yes", value: "true", color: "green" },
+        { label: "No", value: "false", color: "red" }
+      ]).map((opt) => {
+        const isSelected = selectedValues.has(opt.value);
+        const colorValue = opt.color ? getColorValue(opt.color) : void 0;
+        let iconElement = null;
+        if (opt.icon) {
+          if (React3.isValidElement(opt.icon)) {
+            iconElement = opt.icon;
+          } else {
+            const Icon = opt.icon;
+            iconElement = /* @__PURE__ */ jsx(Icon, { className: "size-3" });
+          }
+        }
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: cn(
+              "flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-xs transition-colors",
+              "hover:bg-muted",
+              isSelected && "bg-muted/50"
+            ),
+            onClick: () => toggleOption(opt.value),
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex size-3.5 shrink-0 items-center justify-center rounded-sm border self-center",
+                    isSelected ? "border-primary bg-primary text-primary-foreground" : "border-muted-foreground/30"
+                  ),
+                  children: isSelected && /* @__PURE__ */ jsx(Check, { className: "size-2.5" })
+                }
+              ),
+              opt.badge ? /* @__PURE__ */ jsx("span", { className: "flex items-center", children: opt.badge }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                colorValue && /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: "inline-block size-2 rounded-full",
+                    style: { backgroundColor: colorValue }
+                  }
+                ),
+                iconElement && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground [&>svg]:size-3", children: iconElement }),
+                /* @__PURE__ */ jsx("span", { children: opt.label })
+              ] })
+            ]
+          },
+          opt.value
+        );
+      }) })
+    ] }),
+    (filterType === "select" || filterType === "boolean") && selectedValues.size > 0 && /* @__PURE__ */ jsx("div", { className: "border-t border-border px-1 py-1", children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        className: "flex w-full items-center rounded-md px-2 py-1.5 text-xs text-muted-foreground hover:bg-muted hover:text-foreground",
+        onClick: handleClear,
+        children: "Clear filter"
+      }
+    ) })
+  ] });
+}
+function DataTableColumnFilter({
+  column,
+  title,
+  filterType = "text",
+  filterOptions,
+  placeholder,
+  children,
+  onFilterChange
+}) {
+  const [open, setOpen] = React3.useState(false);
+  const current = column.getFilterValue();
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children }),
+    /* @__PURE__ */ jsx(PopoverContent, { align: "start", className: "w-56 p-0", sideOffset: 4, children: /* @__PURE__ */ jsx(
+      DataTableColumnFilterContent,
+      {
+        title,
+        value: current,
+        onChange: (v) => {
+          column.setFilterValue(v);
+          onFilterChange?.(column.id, v);
+        },
+        onClear: () => column.setFilterValue(void 0),
+        filterType,
+        filterOptions,
+        placeholder,
+        showDeleteMenu: false
+      }
+    ) })
+  ] });
+}
+function DataTableFilterBadges({
+  filters,
+  onRemoveFilter,
+  onChangeFilter,
+  onClearAll,
+  onAddFilter,
+  className,
+  ...props
+}) {
+  if (filters.length === 0 && !onAddFilter) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("flex flex-wrap items-center gap-1.5", className),
+      ...props,
+      children: [
+        filters.map((filter) => /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+          /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+            "button",
+            {
+              type: "button",
+              className: cn(
+                "inline-flex items-center gap-1 rounded border border-sky-200 dark:border-sky-800 bg-sky-50 dark:bg-sky-950/30 px-1.5 py-0.5",
+                "text-xs hover:bg-sky-100 dark:hover:bg-sky-900/40 transition-colors cursor-pointer"
+              ),
+              children: [
+                filter.icon && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground shrink-0 [&>svg]:size-3", children: React3.isValidElement(filter.icon) ? filter.icon : (() => {
+                  const Icon = filter.icon;
+                  return /* @__PURE__ */ jsx(Icon, { className: "size-3" });
+                })() }),
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: filter.label }),
+                /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/50", children: "\xB7" }),
+                filter.valueBadge ? /* @__PURE__ */ jsx("span", { className: "inline-flex items-center", children: filter.valueBadge }) : /* @__PURE__ */ jsx("span", { className: "font-medium truncate max-w-28", children: filter.value }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onPointerDown: (e) => {
+                      e.stopPropagation();
+                      e.preventDefault();
+                    },
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      e.preventDefault();
+                      onRemoveFilter(filter.id);
+                    },
+                    className: "ml-0.5 rounded-sm p-0.5 hover:bg-sky-200/50 dark:hover:bg-sky-800/50 -mr-0.5",
+                    "aria-label": `Remove ${filter.label} filter`,
+                    children: /* @__PURE__ */ jsx(X, { className: "size-3 text-muted-foreground" })
+                  }
+                )
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsx(DropdownMenuContent, { sideOffset: 4, align: "start", className: "p-0", children: /* @__PURE__ */ jsx(
+            DataTableColumnFilterContent,
+            {
+              title: filter.label,
+              value: filter.rawValue ?? filter.value,
+              onChange: (v) => onChangeFilter?.(filter.id, v),
+              onClear: () => onRemoveFilter(filter.id),
+              onDelete: () => onRemoveFilter(filter.id),
+              filterType: filter.filterType,
+              filterOptions: filter.filterOptions,
+              placeholder: filter.filterPlaceholder,
+              showDeleteMenu: true
+            }
+          ) })
+        ] }, filter.id)),
+        onAddFilter && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: onAddFilter,
+            className: cn(
+              "inline-flex items-center gap-1 rounded px-1.5 py-0.5",
+              "text-xs text-muted-foreground hover:text-foreground hover:bg-accent/50 transition-colors"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(Plus, { className: "size-3" }),
+              /* @__PURE__ */ jsx("span", { children: "Filter" })
+            ]
+          }
+        ),
+        onClearAll && filters.length > 0 && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClearAll,
+            className: "text-xs text-muted-foreground hover:text-foreground ml-0.5",
+            children: "Clear"
+          }
+        )
+      ]
+    }
+  );
+}
+var DataTableContext = React3.createContext(null);
+function useDataTableContext() {
+  return React3.useContext(DataTableContext);
+}
+function TreeExpandCycleButton({
+  table,
+  density
+}) {
+  const depthRef = React3.useRef(-1);
+  const maxDepth = React3.useMemo(() => {
+    let max = 0;
+    const walk = (rows) => {
+      for (const row of rows) {
+        if (row.depth > max) max = row.depth;
+        if (row.subRows?.length) walk(row.subRows);
+      }
+    };
+    walk(
+      table.getPreExpandedRowModel?.()?.rows ?? table.getCoreRowModel().rows
+    );
+    return max;
+  }, [table]);
+  const handleClick = React3.useCallback(() => {
+    const nextDepth = depthRef.current + 1;
+    if (nextDepth > maxDepth) {
+      table.toggleAllRowsExpanded(false);
+      depthRef.current = -1;
+      return;
+    }
+    const newExpanded = {};
+    const allRows = table.getPreExpandedRowModel?.()?.rows ?? table.getCoreRowModel().rows;
+    const walk = (rows) => {
+      for (const row of rows) {
+        if (row.depth <= nextDepth && row.getCanExpand()) {
+          newExpanded[row.id] = true;
+        }
+        if (row.subRows?.length) walk(row.subRows);
+      }
+    };
+    walk(allRows);
+    table.setExpanded(newExpanded);
+    depthRef.current = nextDepth;
+  }, [table, maxDepth]);
+  const isAllExpanded = table.getIsAllRowsExpanded();
+  const isSomeExpanded = table.getIsSomeRowsExpanded();
+  const iconSize = density === "compact" ? "size-3.5" : "size-4";
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      className: cn(
+        "inline-flex items-center justify-center shrink-0 text-muted-foreground hover:text-foreground rounded hover:bg-accent transition-colors",
+        density === "compact" ? "size-5 ml-0.5" : "size-6 ml-1"
+      ),
+      "aria-label": isAllExpanded ? "Collapse all rows" : "Expand next level",
+      title: isAllExpanded ? "Collapse all" : isSomeExpanded ? "Expand next level" : "Expand all",
+      children: isAllExpanded ? /* @__PURE__ */ jsx(ChevronsDownUp, { className: iconSize }) : isSomeExpanded ? /* @__PURE__ */ jsx(ChevronsUpDown, { className: iconSize }) : /* @__PURE__ */ jsx(ChevronsUpDown, { className: iconSize })
+    }
+  );
+}
+function DataTable({
+  table,
+  columns,
+  actionBar,
+  floatingBar,
+  filters,
+  onRemoveFilter,
+  onChangeFilter,
+  onClearAllFilters,
+  onAddFilter,
+  density = "comfy",
+  fontSize = "sm",
+  enableColumnResizing = false,
+  rowSelectionStyle = "hover",
+  enableRowDrag = true,
+  onRowDragEnd,
+  enableColumnDrag = false,
+  columnOrder: externalColumnOrder,
+  onColumnOrderChange,
+  columnWrapping: externalColumnWrapping,
+  onColumnWrappingChange,
+  onRowClick,
+  summary,
+  enableTreeView = false,
+  treeIndentPx = 20,
+  getRowClassName: getRowClassName2,
+  stickyColumns = 0,
+  stickyColumnIds: explicitStickyColumnIds,
+  className,
+  children,
+  ...props
+}) {
+  const cellPadding = density === "compact" ? "px-1.5 py-0.5" : "px-2 py-1";
+  const headerHeight = density === "compact" ? "h-7" : "h-8";
+  const fontSizeClass = {
+    xs: "text-[10px]",
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  }[fontSize];
+  const checkboxSize = {
+    xs: "size-3.5",
+    sm: "size-4",
+    md: "size-4.5",
+    lg: "size-5"
+  }[fontSize];
+  const checkmarkSize = {
+    xs: "size-2",
+    sm: "size-2.5",
+    md: "size-3",
+    lg: "size-3.5"
+  }[fontSize];
+  const [columnSizing, setColumnSizing] = React3.useState({});
+  const [resizingColumn, setResizingColumn] = React3.useState(
+    null
+  );
+  const [hoveredRowId, setHoveredRowId] = React3.useState(null);
+  const defaultColumnOrder = React3.useMemo(
+    () => columns.map(
+      (col) => col.id ? col.id : "accessorKey" in col ? String(col.accessorKey) : ""
+    ),
+    [columns]
+  );
+  const [internalColumnOrder, setInternalColumnOrder] = React3.useState(defaultColumnOrder);
+  const columnOrder = externalColumnOrder ?? internalColumnOrder;
+  const setColumnOrder = onColumnOrderChange ?? setInternalColumnOrder;
+  const renderedLeafColumns = React3.useMemo(() => {
+    let leafColumns = table.getVisibleLeafColumns();
+    if (rowSelectionStyle === "hover" || enableRowDrag) {
+      leafColumns = leafColumns.filter((column) => column.id !== "select");
+    }
+    if (enableColumnDrag) {
+      leafColumns = [...leafColumns].sort((a, b) => {
+        const aIndex = columnOrder.indexOf(a.id);
+        const bIndex = columnOrder.indexOf(b.id);
+        if (aIndex === -1) return 1;
+        if (bIndex === -1) return -1;
+        return aIndex - bIndex;
+      });
+    }
+    return leafColumns;
+  }, [table, rowSelectionStyle, enableRowDrag, enableColumnDrag, columnOrder]);
+  const renderedLeafIndexById = React3.useMemo(() => {
+    const indexById = /* @__PURE__ */ new Map();
+    renderedLeafColumns.forEach((column, index) => {
+      indexById.set(column.id, index);
+    });
+    return indexById;
+  }, [renderedLeafColumns]);
+  const stickyLeafColumns = React3.useMemo(() => {
+    if (explicitStickyColumnIds && explicitStickyColumnIds.length > 0) {
+      const stickyIdSet = new Set(explicitStickyColumnIds);
+      return renderedLeafColumns.filter((column) => stickyIdSet.has(column.id));
+    }
+    if (!stickyColumns || stickyColumns <= 0) return [];
+    return renderedLeafColumns.slice(0, stickyColumns);
+  }, [renderedLeafColumns, stickyColumns, explicitStickyColumnIds]);
+  const stickyColumnIds = React3.useMemo(
+    () => new Set(stickyLeafColumns.map((column) => column.id)),
+    [stickyLeafColumns]
+  );
+  const stickyColumnLefts = React3.useMemo(() => {
+    const lefts = /* @__PURE__ */ new Map();
+    let runningLeft = 0;
+    for (const column of stickyLeafColumns) {
+      lefts.set(column.id, runningLeft);
+      runningLeft += column.getSize();
+    }
+    return lefts;
+  }, [stickyLeafColumns]);
+  const renderedTableWidth = React3.useMemo(() => {
+    return renderedLeafColumns.reduce((total, column) => {
+      const resizedWidth = columnSizing[column.id];
+      const baseWidth = resizedWidth ?? column.getSize();
+      const minWidth = column.columnDef.minSize ?? 0;
+      const maxWidth = column.columnDef.maxSize;
+      const clamped = Math.max(
+        minWidth,
+        maxWidth !== void 0 ? Math.min(baseWidth, maxWidth) : baseWidth
+      );
+      return total + clamped;
+    }, 0);
+  }, [renderedLeafColumns, columnSizing]);
+  const [internalColumnWrapping, setInternalColumnWrapping] = React3.useState({});
+  const columnWrapping = externalColumnWrapping ?? internalColumnWrapping;
+  const setColumnWrapping = onColumnWrappingChange ?? setInternalColumnWrapping;
+  const [draggedColumnId, setDraggedColumnId] = React3.useState(
+    null
+  );
+  const [dragOverColumnId, setDragOverColumnId] = React3.useState(
+    null
+  );
+  const [dragOverColumnPosition, setDragOverColumnPosition] = React3.useState(null);
+  const handleColumnDragStart = React3.useCallback(
+    (e, columnId) => {
+      setDraggedColumnId(columnId);
+      e.dataTransfer.effectAllowed = "move";
+      e.dataTransfer.setData("text/plain", columnId);
+      requestAnimationFrame(() => {
+        e.target.closest("th")?.classList.add("opacity-50");
+      });
+    },
+    []
+  );
+  const handleColumnDragOver = React3.useCallback(
+    (e, columnId) => {
+      e.preventDefault();
+      e.dataTransfer.dropEffect = "move";
+      if (draggedColumnId !== null && draggedColumnId !== columnId) {
+        const rect = e.currentTarget.getBoundingClientRect();
+        const midX = rect.left + rect.width / 2;
+        const position = e.clientX < midX ? "left" : "right";
+        setDragOverColumnId(columnId);
+        setDragOverColumnPosition(position);
+      }
+    },
+    [draggedColumnId]
+  );
+  const handleColumnDragLeave = React3.useCallback(() => {
+    setDragOverColumnId(null);
+    setDragOverColumnPosition(null);
+  }, []);
+  const handleColumnDrop = React3.useCallback(
+    (e, targetColumnId) => {
+      e.preventDefault();
+      if (draggedColumnId && draggedColumnId !== targetColumnId) {
+        const currentOrder = [...columnOrder];
+        const fromIndex = currentOrder.indexOf(draggedColumnId);
+        let toIndex = currentOrder.indexOf(targetColumnId);
+        if (fromIndex !== -1 && toIndex !== -1) {
+          currentOrder.splice(fromIndex, 1);
+          toIndex = currentOrder.indexOf(targetColumnId);
+          if (dragOverColumnPosition === "right") {
+            toIndex += 1;
+          }
+          currentOrder.splice(toIndex, 0, draggedColumnId);
+          setColumnOrder(currentOrder);
+        }
+      }
+      setDraggedColumnId(null);
+      setDragOverColumnId(null);
+      setDragOverColumnPosition(null);
+    },
+    [draggedColumnId, columnOrder, dragOverColumnPosition, setColumnOrder]
+  );
+  const handleColumnDragEnd = React3.useCallback((e) => {
+    e.target.closest("th")?.classList.remove("opacity-50");
+    setDraggedColumnId(null);
+    setDragOverColumnId(null);
+    setDragOverColumnPosition(null);
+  }, []);
+  const toggleColumnWrapping = React3.useCallback(
+    (columnId) => {
+      setColumnWrapping({
+        ...columnWrapping,
+        [columnId]: !columnWrapping[columnId]
+      });
+    },
+    [columnWrapping, setColumnWrapping]
+  );
+  const [draggedRowIndex, setDraggedRowIndex] = React3.useState(
+    null
+  );
+  const [dragOverRowIndex, setDragOverRowIndex] = React3.useState(
+    null
+  );
+  const [dragOverPosition, setDragOverPosition] = React3.useState(null);
+  const handleRowDragStart = React3.useCallback(
+    (e, rowIndex) => {
+      setDraggedRowIndex(rowIndex);
+      e.dataTransfer.effectAllowed = "move";
+      e.dataTransfer.setData("text/plain", String(rowIndex));
+      requestAnimationFrame(() => {
+        e.target.closest("tr")?.classList.add("opacity-50");
+      });
+    },
+    []
+  );
+  const handleRowDragOver = React3.useCallback(
+    (e, rowIndex) => {
+      e.preventDefault();
+      e.dataTransfer.dropEffect = "move";
+      if (draggedRowIndex !== null && draggedRowIndex !== rowIndex) {
+        const rect = e.currentTarget.getBoundingClientRect();
+        const midY = rect.top + rect.height / 2;
+        const position = e.clientY < midY ? "above" : "below";
+        setDragOverRowIndex(rowIndex);
+        setDragOverPosition(position);
+      }
+    },
+    [draggedRowIndex]
+  );
+  const handleRowDragLeave = React3.useCallback(() => {
+    setDragOverRowIndex(null);
+    setDragOverPosition(null);
+  }, []);
+  const handleRowDrop = React3.useCallback(
+    (e, toIndex) => {
+      e.preventDefault();
+      const fromIndex = draggedRowIndex;
+      if (fromIndex !== null && fromIndex !== toIndex && onRowDragEnd) {
+        let targetIndex = toIndex;
+        if (dragOverPosition === "below") {
+          targetIndex = toIndex + 1;
+        }
+        if (fromIndex < targetIndex) {
+          targetIndex -= 1;
+        }
+        if (fromIndex !== targetIndex) {
+          onRowDragEnd(fromIndex, targetIndex);
+        }
+      }
+      setDraggedRowIndex(null);
+      setDragOverRowIndex(null);
+      setDragOverPosition(null);
+    },
+    [draggedRowIndex, dragOverPosition, onRowDragEnd]
+  );
+  const handleRowDragEnd = React3.useCallback((e) => {
+    e.target.closest("tr")?.classList.remove("opacity-50");
+    setDraggedRowIndex(null);
+    setDragOverRowIndex(null);
+    setDragOverPosition(null);
+  }, []);
+  const handleResizeStart = React3.useCallback(
+    (columnId, startX, startWidth) => {
+      setResizingColumn(columnId);
+      const handleMouseMove = (e) => {
+        const delta = e.clientX - startX;
+        const newWidth = Math.max(20, startWidth + delta);
+        setColumnSizing((prev) => ({ ...prev, [columnId]: newWidth }));
+      };
+      const handleMouseUp = () => {
+        setResizingColumn(null);
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+        document.body.style.cursor = "";
+        document.body.style.userSelect = "";
+      };
+      document.body.style.cursor = "col-resize";
+      document.body.style.userSelect = "none";
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+    },
+    []
+  );
+  const contextValue = React3.useMemo(
+    () => ({
+      columnWrapping,
+      toggleColumnWrapping,
+      enableColumnDrag: enableColumnDrag ?? false,
+      onColumnDragStart: handleColumnDragStart,
+      onColumnDragEnd: handleColumnDragEnd,
+      fontSize,
+      fontSizeClass,
+      density
+    }),
+    [
+      columnWrapping,
+      toggleColumnWrapping,
+      enableColumnDrag,
+      handleColumnDragStart,
+      handleColumnDragEnd,
+      fontSize,
+      fontSizeClass,
+      density
+    ]
+  );
+  return /* @__PURE__ */ jsx(DataTableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "flex w-full max-w-full min-w-0 flex-col gap-2.5",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        filters && filters.length > 0 || onAddFilter ? /* @__PURE__ */ jsx("div", { className: "px-1", children: /* @__PURE__ */ jsx(
+          DataTableFilterBadges,
+          {
+            filters: filters ?? [],
+            onRemoveFilter: (id) => onRemoveFilter?.(id),
+            onChangeFilter: (id, value) => onChangeFilter?.(id, value),
+            onClearAll: onClearAllFilters,
+            onAddFilter
+          }
+        ) }) : null,
+        /* @__PURE__ */ jsx("div", { className: cn("mx-1", fontSizeClass), children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "overflow-x-auto rounded-t-md [&::-webkit-scrollbar-track]:bg-transparent",
+              summary ? "border-t" : "border rounded-b-md"
+            ),
+            children: /* @__PURE__ */ jsxs(
+              "table",
+              {
+                className: cn(
+                  "caption-bottom border-separate border-spacing-0",
+                  fontSizeClass
+                ),
+                style: {
+                  width: `max(100%, ${renderedTableWidth}px)`,
+                  tableLayout: "fixed"
+                },
+                children: [
+                  /* @__PURE__ */ jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => {
+                    const renderableHeaders = headerGroup.headers.filter(
+                      (h) => !((rowSelectionStyle === "hover" || enableRowDrag) && h.id === "select")
+                    );
+                    const orderedHeaders = enableColumnDrag ? [...renderableHeaders].sort((a, b) => {
+                      const aIndex = columnOrder.indexOf(a.id);
+                      const bIndex = columnOrder.indexOf(b.id);
+                      if (aIndex === -1) return 1;
+                      if (bIndex === -1) return -1;
+                      return aIndex - bIndex;
+                    }) : renderableHeaders;
+                    return /* @__PURE__ */ jsxs(
+                      TableRow,
+                      {
+                        className: "hover:bg-transparent",
+                        children: [
+                          (rowSelectionStyle === "hover" || enableRowDrag) && /* @__PURE__ */ jsx(
+                            TableHead,
+                            {
+                              className: cn(
+                                "p-0 border-r-0 whitespace-nowrap border-l border-b border-border group/header-gutter",
+                                headerHeight
+                              ),
+                              style: { width: "1%" },
+                              children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-0.5 px-1 h-full", children: [
+                                enableRowDrag && /* @__PURE__ */ jsx(
+                                  "div",
+                                  {
+                                    className: cn(
+                                      "shrink-0",
+                                      density === "compact" ? "size-5" : "size-6"
+                                    ),
+                                    "aria-hidden": "true"
+                                  }
+                                ),
+                                /* @__PURE__ */ jsxs(
+                                  "button",
+                                  {
+                                    type: "button",
+                                    onClick: () => table.toggleAllPageRowsSelected(
+                                      !table.getIsAllPageRowsSelected()
+                                    ),
+                                    className: cn(
+                                      "flex items-center justify-center rounded border transition-all",
+                                      checkboxSize,
+                                      table.getIsAllPageRowsSelected() ? "bg-primary border-primary text-primary-foreground opacity-100" : table.getIsSomePageRowsSelected() ? "bg-primary/50 border-primary text-primary-foreground opacity-100" : "border-border hover:border-primary/50 hover:bg-accent opacity-0 group-hover/header-gutter:opacity-100"
+                                    ),
+                                    "aria-label": table.getIsAllPageRowsSelected() ? "Deselect all rows" : "Select all rows",
+                                    children: [
+                                      table.getIsAllPageRowsSelected() && /* @__PURE__ */ jsx(
+                                        "svg",
+                                        {
+                                          className: checkmarkSize,
+                                          viewBox: "0 0 12 12",
+                                          fill: "none",
+                                          "aria-hidden": "true",
+                                          children: /* @__PURE__ */ jsx(
+                                            "path",
+                                            {
+                                              d: "M2.5 6L5 8.5L9.5 3.5",
+                                              stroke: "currentColor",
+                                              strokeWidth: "2",
+                                              strokeLinecap: "round",
+                                              strokeLinejoin: "round"
+                                            }
+                                          )
+                                        }
+                                      ),
+                                      table.getIsSomePageRowsSelected() && !table.getIsAllPageRowsSelected() && /* @__PURE__ */ jsx(
+                                        "svg",
+                                        {
+                                          className: checkmarkSize,
+                                          viewBox: "0 0 12 12",
+                                          fill: "none",
+                                          "aria-hidden": "true",
+                                          children: /* @__PURE__ */ jsx(
+                                            "path",
+                                            {
+                                              d: "M2.5 6H9.5",
+                                              stroke: "currentColor",
+                                              strokeWidth: "2",
+                                              strokeLinecap: "round"
+                                            }
+                                          )
+                                        }
+                                      )
+                                    ]
+                                  }
+                                )
+                              ] })
+                            }
+                          ),
+                          orderedHeaders.map((header, headerIndex) => {
+                            const isLastColumn = headerIndex === orderedHeaders.length - 1;
+                            const hasGutter = rowSelectionStyle === "hover" || enableRowDrag;
+                            const isFirstColumn = headerIndex === 0 && !hasGutter;
+                            const headerLeafColumnIds = header.getLeafHeaders().map((leafHeader) => leafHeader.column.id).filter(
+                              (columnId) => renderedLeafIndexById.has(columnId)
+                            );
+                            const stickyHeaderLeafIds = headerLeafColumnIds.filter(
+                              (columnId) => stickyColumnIds.has(columnId)
+                            );
+                            const isStickyColumn = headerLeafColumnIds.length > 0 && stickyHeaderLeafIds.length === headerLeafColumnIds.length;
+                            const stickyHeaderColumnId = isStickyColumn ? stickyHeaderLeafIds.sort(
+                              (a, b) => (renderedLeafIndexById.get(a) ?? 0) - (renderedLeafIndexById.get(b) ?? 0)
+                            )[0] : void 0;
+                            const stickyLeft = stickyHeaderColumnId ? stickyColumnLefts.get(stickyHeaderColumnId) ?? 0 : 0;
+                            const headerDef = header.column.columnDef.header;
+                            const isSimpleHeader = typeof headerDef === "string";
+                            const colDef = header.column.columnDef;
+                            const isFixedWidth = colDef.size && colDef.minSize === colDef.size && colDef.maxSize === colDef.size;
+                            const isActionsColumn = header.id === "actions" || header.id === "select";
+                            const resizedWidth = isFixedWidth ? void 0 : columnSizing[header.id];
+                            const canDragColumn = enableColumnDrag && !isFixedWidth && !isActionsColumn;
+                            const isDragOverLeft = dragOverColumnId === header.id && dragOverColumnPosition === "left";
+                            const isDragOverRight = dragOverColumnId === header.id && dragOverColumnPosition === "right";
+                            const firstLeafIndex = Math.min(
+                              ...headerLeafColumnIds.map(
+                                (columnId) => renderedLeafIndexById.get(columnId) ?? 0
+                              )
+                            );
+                            const isFirstNonStickyAfterSticky = !isStickyColumn && firstLeafIndex > 0 && stickyColumnIds.has(
+                              renderedLeafColumns[firstLeafIndex - 1]?.id ?? ""
+                            );
+                            return /* @__PURE__ */ jsxs(
+                              TableHead,
+                              {
+                                "data-sticky-column": isStickyColumn ? "true" : void 0,
+                                colSpan: header.colSpan,
+                                onDragOver: canDragColumn ? (e) => handleColumnDragOver(e, header.id) : void 0,
+                                onDragLeave: canDragColumn ? handleColumnDragLeave : void 0,
+                                onDrop: canDragColumn ? (e) => handleColumnDrop(e, header.id) : void 0,
+                                className: cn(
+                                  isSimpleHeader ? "px-2" : "p-0",
+                                  // Add padding for simple headers, let component headers handle their own
+                                  headerHeight,
+                                  "relative",
+                                  "overflow-hidden text-ellipsis border-b border-border",
+                                  !columnWrapping[header.id] && "whitespace-nowrap",
+                                  columnWrapping[header.id] && "whitespace-normal",
+                                  isFirstColumn && "border-l border-border",
+                                  !isStickyColumn && "border-r border-border",
+                                  isStickyColumn && "border-r border-border",
+                                  isFirstNonStickyAfterSticky && "border-l border-border",
+                                  isDragOverLeft && "border-l-2 border-l-primary",
+                                  isDragOverRight && "border-r-2 border-r-primary"
+                                ),
+                                style: {
+                                  ...isActionsColumn ? { width: "1%" } : {
+                                    width: resizedWidth ?? header.getSize(),
+                                    minWidth: header.column.columnDef.minSize,
+                                    maxWidth: header.column.columnDef.maxSize
+                                  },
+                                  ...isStickyColumn ? {
+                                    position: "sticky",
+                                    left: stickyLeft,
+                                    zIndex: 60,
+                                    background: "hsl(var(--background) / 1)",
+                                    backgroundColor: "hsl(var(--background) / 1)",
+                                    opacity: 1,
+                                    backgroundClip: "padding-box",
+                                    boxShadow: "inset -1px 0 0 hsl(var(--border)), inset 0 -1px 0 hsl(var(--border))",
+                                    isolation: "isolate",
+                                    contain: "paint",
+                                    backfaceVisibility: "hidden",
+                                    mixBlendMode: "normal",
+                                    backdropFilter: "none",
+                                    WebkitBackdropFilter: "none",
+                                    transform: "translateZ(0)",
+                                    WebkitTransform: "translateZ(0)"
+                                  } : {}
+                                },
+                                children: [
+                                  isStickyColumn && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-x-0 top-0 bottom-px z-0 bg-background" }),
+                                  header.isPlaceholder ? null : /* @__PURE__ */ jsxs(
+                                    "div",
+                                    {
+                                      className: cn(
+                                        "relative z-10",
+                                        enableTreeView && headerIndex === 0 && "flex items-center"
+                                      ),
+                                      children: [
+                                        enableTreeView && headerIndex === 0 && /* @__PURE__ */ jsx(
+                                          TreeExpandCycleButton,
+                                          {
+                                            table,
+                                            density
+                                          }
+                                        ),
+                                        isSimpleHeader ? /* @__PURE__ */ jsx(
+                                          "span",
+                                          {
+                                            className: cn("font-medium", fontSizeClass),
+                                            children: headerDef
+                                          }
+                                        ) : flexRender(
+                                          header.column.columnDef.header,
+                                          header.getContext()
+                                        )
+                                      ]
+                                    }
+                                  ),
+                                  enableColumnResizing && !isLastColumn && !isFixedWidth && // biome-ignore lint/a11y/noStaticElementInteractions: Column resize uses mouse drag interaction only
+                                  /* @__PURE__ */ jsx(
+                                    "div",
+                                    {
+                                      onMouseDown: (e) => {
+                                        e.preventDefault();
+                                        e.stopPropagation();
+                                        const th = e.currentTarget.parentElement;
+                                        if (th) {
+                                          handleResizeStart(
+                                            header.id,
+                                            e.clientX,
+                                            th.offsetWidth
+                                          );
+                                        }
+                                      },
+                                      className: cn(
+                                        "absolute -right-1 top-0 z-10 h-full w-3 cursor-col-resize select-none",
+                                        "before:absolute before:right-1 before:top-0 before:h-full before:w-px before:bg-transparent before:transition-colors",
+                                        "hover:before:bg-primary/50",
+                                        resizingColumn === header.id && "before:bg-primary"
+                                      )
+                                    }
+                                  )
+                                ]
+                              },
+                              header.id
+                            );
+                          })
+                        ]
+                      },
+                      headerGroup.id
+                    );
+                  }) }),
+                  /* @__PURE__ */ jsx(
+                    TableBody,
+                    {
+                      className: summary ? "[&_tr:last-child]:border-b" : void 0,
+                      children: table.getRowModel().rows?.length ? table.getRowModel().rows.map((row, rowIndex) => {
+                        const isHovered = hoveredRowId === row.id;
+                        const isSelected = row.getIsSelected();
+                        const showRowControls = isHovered || isSelected;
+                        const isDragOverAbove = dragOverRowIndex === rowIndex && dragOverPosition === "above";
+                        const isDragOverBelow = dragOverRowIndex === rowIndex && dragOverPosition === "below";
+                        return /* @__PURE__ */ jsxs(
+                          TableRow,
+                          {
+                            "data-state": isSelected && "selected",
+                            "data-hovered": isHovered,
+                            onMouseEnter: () => setHoveredRowId(row.id),
+                            onMouseLeave: () => setHoveredRowId(null),
+                            onClick: () => onRowClick?.(row),
+                            onDragOver: enableRowDrag ? (e) => handleRowDragOver(e, rowIndex) : void 0,
+                            onDragLeave: enableRowDrag ? handleRowDragLeave : void 0,
+                            onDrop: enableRowDrag ? (e) => handleRowDrop(e, rowIndex) : void 0,
+                            className: cn(
+                              "group/row",
+                              onRowClick && "cursor-pointer hover:bg-muted/50",
+                              getRowClassName2?.(row),
+                              // Add bottom border to last row when summary exists
+                              summary && rowIndex === table.getRowModel().rows.length - 1 && "border-b"
+                            ),
+                            children: [
+                              (rowSelectionStyle === "hover" || enableRowDrag) && /* @__PURE__ */ jsx(
+                                TableCell,
+                                {
+                                  className: cn(
+                                    "p-0 border-r-0 whitespace-nowrap border-l border-border",
+                                    // All rows get bottom border except last row without summary
+                                    rowIndex !== table.getRowModel().rows.length - 1 && "border-b border-border",
+                                    // Last row only gets border-b when summary exists, plus rounding
+                                    summary && rowIndex === table.getRowModel().rows.length - 1 && "border-b border-border rounded-bl-md overflow-hidden",
+                                    // Drag-over indicator
+                                    isDragOverAbove && "border-t-2 border-t-primary",
+                                    isDragOverBelow && "border-b-2 border-b-primary"
+                                  ),
+                                  style: { width: "1%" },
+                                  children: /* @__PURE__ */ jsxs(
+                                    "div",
+                                    {
+                                      className: cn(
+                                        "flex items-center justify-end gap-0.5 px-1 h-full transition-opacity",
+                                        showRowControls ? "opacity-100" : "opacity-0"
+                                      ),
+                                      children: [
+                                        enableRowDrag && /* @__PURE__ */ jsx(
+                                          "div",
+                                          {
+                                            draggable: true,
+                                            onDragStart: (e) => handleRowDragStart(e, rowIndex),
+                                            onDragEnd: handleRowDragEnd,
+                                            className: cn(
+                                              "flex items-center justify-center text-muted-foreground/50 hover:text-muted-foreground cursor-grab active:cursor-grabbing rounded hover:bg-accent",
+                                              density === "compact" ? "size-5" : "size-6"
+                                            ),
+                                            "aria-hidden": "true",
+                                            children: /* @__PURE__ */ jsx(
+                                              GripVertical,
+                                              {
+                                                className: density === "compact" ? "size-3" : "size-4"
+                                              }
+                                            )
+                                          }
+                                        ),
+                                        /* @__PURE__ */ jsx(
+                                          "button",
+                                          {
+                                            type: "button",
+                                            onClick: () => row.toggleSelected(!row.getIsSelected()),
+                                            className: cn(
+                                              "flex items-center justify-center rounded border transition-colors",
+                                              checkboxSize,
+                                              isSelected ? "bg-primary border-primary text-primary-foreground" : "border-border hover:border-primary/50 hover:bg-accent"
+                                            ),
+                                            "aria-label": isSelected ? "Deselect row" : "Select row",
+                                            children: isSelected && /* @__PURE__ */ jsx(
+                                              "svg",
+                                              {
+                                                className: checkmarkSize,
+                                                viewBox: "0 0 12 12",
+                                                fill: "none",
+                                                "aria-hidden": "true",
+                                                children: /* @__PURE__ */ jsx(
+                                                  "path",
+                                                  {
+                                                    d: "M2.5 6L5 8.5L9.5 3.5",
+                                                    stroke: "currentColor",
+                                                    strokeWidth: "2",
+                                                    strokeLinecap: "round",
+                                                    strokeLinejoin: "round"
+                                                  }
+                                                )
+                                              }
+                                            )
+                                          }
+                                        )
+                                      ]
+                                    }
+                                  )
+                                }
+                              ),
+                              row.getVisibleCells().map((cell) => {
+                                if ((rowSelectionStyle === "hover" || enableRowDrag) && cell.column.id === "select") {
+                                  return null;
+                                }
+                                return cell;
+                              }).filter(
+                                (cell) => cell !== null
+                              ).sort((a, b) => {
+                                if (!enableColumnDrag) return 0;
+                                const aIndex = columnOrder.indexOf(a.column.id);
+                                const bIndex = columnOrder.indexOf(b.column.id);
+                                if (aIndex === -1) return 1;
+                                if (bIndex === -1) return -1;
+                                return aIndex - bIndex;
+                              }).map((cell, cellIndex, sortedCells) => {
+                                const isLastColumn = cellIndex === sortedCells.length - 1;
+                                const hasGutter = rowSelectionStyle === "hover" || enableRowDrag;
+                                const isFirstColumn = cellIndex === 0 && !hasGutter;
+                                const isStickyCell = stickyColumnIds.has(
+                                  cell.column.id
+                                );
+                                const stickyLeft = stickyColumnLefts.get(cell.column.id) ?? 0;
+                                const isFirstNonStickyAfterSticky = !isStickyCell && cellIndex > 0 && stickyColumnIds.has(
+                                  sortedCells[cellIndex - 1]?.column.id ?? ""
+                                );
+                                const colDef = cell.column.columnDef;
+                                const isFixedWidth = colDef.size && colDef.minSize === colDef.size && colDef.maxSize === colDef.size;
+                                const isActionsColumn = cell.column.id === "actions" || cell.column.id === "select";
+                                const resizedWidth = isFixedWidth ? void 0 : columnSizing[cell.column.id];
+                                const isWrapped = columnWrapping[cell.column.id];
+                                const colMeta = cell.column.columnDef.meta;
+                                const colAlign = colMeta?.align ?? "left";
+                                const allowHorizontalScroll = colMeta?.allowHorizontalScroll === true;
+                                const alignClass = colAlign === "right" ? "text-right" : colAlign === "center" ? "text-center" : "";
+                                const isFirstDataCell = cellIndex === 0;
+                                const showTreeUI = enableTreeView && isFirstDataCell;
+                                const treeIndent = showTreeUI ? row.depth * treeIndentPx : 0;
+                                const canExpand = showTreeUI && row.getCanExpand();
+                                return /* @__PURE__ */ jsxs(
+                                  TableCell,
+                                  {
+                                    "data-sticky-column": isStickyCell ? "true" : void 0,
+                                    className: cn(
+                                      cellPadding,
+                                      isStickyCell && "relative",
+                                      !isWrapped && "overflow-hidden text-ellipsis whitespace-nowrap",
+                                      isWrapped && "whitespace-normal break-words",
+                                      !isLastColumn && !isStickyCell && "border-r border-border",
+                                      isStickyCell && "border-r border-border",
+                                      isFirstColumn && "border-l border-border",
+                                      isFirstNonStickyAfterSticky && "border-l border-border",
+                                      isLastColumn && "border-r border-border",
+                                      isActionsColumn && "whitespace-nowrap",
+                                      // All rows get bottom border except last row without summary
+                                      rowIndex !== table.getRowModel().rows.length - 1 && "border-b border-border",
+                                      // Last row only gets border-b when summary exists, plus rounding on corners
+                                      summary && rowIndex === table.getRowModel().rows.length - 1 && "border-b border-border",
+                                      summary && rowIndex === table.getRowModel().rows.length - 1 && isLastColumn && "rounded-br-md overflow-hidden",
+                                      summary && rowIndex === table.getRowModel().rows.length - 1 && isFirstColumn && "rounded-bl-md overflow-hidden"
+                                    ),
+                                    style: {
+                                      width: resizedWidth || cell.column.getSize(),
+                                      minWidth: cell.column.columnDef.minSize,
+                                      maxWidth: cell.column.columnDef.maxSize,
+                                      ...isStickyCell ? {
+                                        position: "sticky",
+                                        left: stickyLeft,
+                                        zIndex: 50,
+                                        background: "hsl(var(--background) / 1)",
+                                        backgroundColor: "hsl(var(--background) / 1)",
+                                        opacity: 1,
+                                        backgroundClip: "padding-box",
+                                        boxShadow: "inset 0 0 0 9999px hsl(var(--background)), inset -1px 0 0 hsl(var(--border))",
+                                        borderBottom: "1px solid hsl(var(--border))",
+                                        isolation: "isolate",
+                                        contain: "paint",
+                                        backfaceVisibility: "hidden",
+                                        mixBlendMode: "normal",
+                                        backdropFilter: "none",
+                                        WebkitBackdropFilter: "none",
+                                        transform: "translateZ(0)",
+                                        WebkitTransform: "translateZ(0)"
+                                      } : {}
+                                    },
+                                    children: [
+                                      isStickyCell && /* @__PURE__ */ jsx("div", { className: "pointer-events-none absolute inset-0 z-0 border-b border-border bg-background" }),
+                                      showTreeUI ? /* @__PURE__ */ jsxs(
+                                        "div",
+                                        {
+                                          className: "relative z-10 flex items-center gap-1",
+                                          style: { paddingLeft: `${treeIndent}px` },
+                                          children: [
+                                            canExpand ? /* @__PURE__ */ jsx(
+                                              "button",
+                                              {
+                                                type: "button",
+                                                onClick: (e) => {
+                                                  e.stopPropagation();
+                                                  row.toggleExpanded();
+                                                },
+                                                className: "shrink-0 text-muted-foreground hover:text-foreground",
+                                                "aria-label": row.getIsExpanded() ? "Collapse" : "Expand",
+                                                children: row.getIsExpanded() ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-4" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-4" })
+                                              }
+                                            ) : /* @__PURE__ */ jsx(
+                                              "span",
+                                              {
+                                                className: "inline-block shrink-0 size-4",
+                                                "aria-hidden": "true"
+                                              }
+                                            ),
+                                            /* @__PURE__ */ jsx(
+                                              "div",
+                                              {
+                                                className: cn(
+                                                  "min-w-0",
+                                                  !isWrapped && !allowHorizontalScroll && "truncate",
+                                                  allowHorizontalScroll && "overflow-x-auto whitespace-nowrap [&::-webkit-scrollbar]:hidden"
+                                                ),
+                                                style: allowHorizontalScroll ? {
+                                                  scrollbarWidth: "none",
+                                                  msOverflowStyle: "none"
+                                                } : void 0,
+                                                children: flexRender(
+                                                  cell.column.columnDef.cell,
+                                                  cell.getContext()
+                                                )
+                                              }
+                                            )
+                                          ]
+                                        }
+                                      ) : /* @__PURE__ */ jsx(
+                                        "div",
+                                        {
+                                          className: cn(
+                                            "relative z-10",
+                                            !isWrapped && !allowHorizontalScroll && "truncate",
+                                            allowHorizontalScroll && "overflow-x-auto whitespace-nowrap [&::-webkit-scrollbar]:hidden",
+                                            alignClass
+                                          ),
+                                          style: allowHorizontalScroll ? {
+                                            scrollbarWidth: "none",
+                                            msOverflowStyle: "none"
+                                          } : void 0,
+                                          children: flexRender(
+                                            cell.column.columnDef.cell,
+                                            cell.getContext()
+                                          )
+                                        }
+                                      )
+                                    ]
+                                  },
+                                  cell.id
+                                );
+                              })
+                            ]
+                          },
+                          row.id
+                        );
+                      }) : /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(
+                        TableCell,
+                        {
+                          colSpan: columns.length + (rowSelectionStyle === "hover" || enableRowDrag ? 1 : 0),
+                          className: "h-24",
+                          children: /* @__PURE__ */ jsx("div", { className: "sticky left-0 w-fit px-4 text-muted-foreground", children: "No results." })
+                        }
+                      ) })
+                    }
+                  ),
+                  summary && /* @__PURE__ */ jsx("tfoot", { children: summary })
+                ]
+              }
+            )
+          }
+        ) }),
+        actionBar && table.getFilteredSelectedRowModel().rows.length > 0 && actionBar,
+        floatingBar && table.getFilteredSelectedRowModel().rows.length > 0 && floatingBar
+      ]
+    }
+  ) });
+}
+var defaultColumnIcons = {
+  text: Text,
+  number: Hash,
+  date: Calendar,
+  boolean: CheckSquare,
+  enum: List,
+  custom: Text
+};
+function getColumnIcon(column, propIcon, propColumnType) {
+  const meta = column.columnDef.meta;
+  if (propIcon) return propIcon;
+  if (meta?.icon) return meta.icon;
+  const columnType = propColumnType ?? meta?.columnType;
+  if (columnType) return defaultColumnIcons[columnType];
+  return void 0;
+}
+function DataTableColumnHeader({
+  column,
+  title,
+  className,
+  columnType,
+  icon,
+  filterable,
+  filterType,
+  filterOptions,
+  onFilterChange,
+  isWrapped: isWrappedProp,
+  onToggleWrap: onToggleWrapProp,
+  customMenuItems
+}) {
+  const meta = column.columnDef.meta;
+  const dataTableContext = useDataTableContext();
+  const isWrapped = isWrappedProp ?? dataTableContext?.columnWrapping[column.id] ?? false;
+  const onToggleWrap = onToggleWrapProp ?? (() => dataTableContext?.toggleColumnWrapping(column.id));
+  const canSort = column.getCanSort();
+  const canHide = column.getCanHide();
+  const isSorted = column.getIsSorted();
+  const isFiltered = column.getIsFiltered();
+  const Icon = getColumnIcon(column, icon, columnType);
+  const showFilter = filterable ?? meta?.filterable ?? false;
+  const resolvedFilterType = filterType ?? meta?.filterType ?? "text";
+  const resolvedFilterOptions = filterOptions ?? meta?.filterOptions;
+  const filterPlaceholder = meta?.filterPlaceholder;
+  const [isOpen, setIsOpen] = React3.useState(false);
+  const mouseDownPosRef = React3.useRef(null);
+  const didDragRef = React3.useRef(false);
+  const canDrag = dataTableContext?.enableColumnDrag ?? false;
+  const handleMouseDown = (e) => {
+    mouseDownPosRef.current = { x: e.clientX, y: e.clientY };
+    didDragRef.current = false;
+  };
+  const handleDragStart = (e) => {
+    didDragRef.current = true;
+    mouseDownPosRef.current = null;
+    dataTableContext?.onColumnDragStart(e, column.id);
+  };
+  const handleDragEnd = (e) => {
+    dataTableContext?.onColumnDragEnd(e);
+  };
+  const handleClick = (e) => {
+    if (!didDragRef.current && mouseDownPosRef.current) {
+      const dx = Math.abs(e.clientX - mouseDownPosRef.current.x);
+      const dy = Math.abs(e.clientY - mouseDownPosRef.current.y);
+      if (dx < 5 && dy < 5) {
+        setIsOpen(true);
+      }
+    }
+    mouseDownPosRef.current = null;
+    didDragRef.current = false;
+  };
+  const colAlign = meta?.align ?? "left";
+  const justifyClass = colAlign === "right" ? "justify-end" : colAlign === "center" ? "justify-center" : "";
+  if (!canSort && !canHide && !showFilter) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: cn(
+          "flex items-center gap-1.5 px-2 h-full",
+          justifyClass,
+          canDrag && "cursor-grab",
+          className
+        ),
+        draggable: canDrag,
+        onDragStart: canDrag ? handleDragStart : void 0,
+        onDragEnd: canDrag ? handleDragEnd : void 0,
+        "aria-hidden": canDrag ? "true" : void 0,
+        children: [
+          Icon && /* @__PURE__ */ jsx(Icon, { className: "size-4 text-muted-foreground" }),
+          /* @__PURE__ */ jsx("span", { className: "font-medium", children: title })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("flex h-full items-center w-full", className), children: /* @__PURE__ */ jsxs(DropdownMenu, { open: isOpen, onOpenChange: setIsOpen, modal: false, children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx("div", { className: "w-full h-full", style: { pointerEvents: "none" }, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        draggable: canDrag,
+        onMouseDown: handleMouseDown,
+        onDragStart: canDrag ? handleDragStart : void 0,
+        onDragEnd: canDrag ? handleDragEnd : void 0,
+        onClick: handleClick,
+        style: { pointerEvents: "auto" },
+        className: cn(
+          "relative flex items-center gap-1.5 w-full h-full px-2",
+          justifyClass || "text-left",
+          "before:absolute before:-inset-[99px] before:-z-10 before:pointer-events-none before:transition-colors hover:before:bg-accent/50",
+          isOpen && "before:bg-accent",
+          "focus:outline-none focus-visible:ring-1 focus-visible:ring-ring",
+          canDrag ? "cursor-grab" : "cursor-pointer"
+        ),
+        children: [
+          Icon && /* @__PURE__ */ jsx(Icon, { className: "size-3.5 text-muted-foreground shrink-0" }),
+          /* @__PURE__ */ jsx("span", { className: "font-medium", children: title }),
+          isFiltered && /* @__PURE__ */ jsx(Filter, { className: "size-3 text-primary shrink-0" }),
+          isSorted === "desc" && /* @__PURE__ */ jsx(ArrowDown, { className: "size-3.5 text-muted-foreground shrink-0" }),
+          isSorted === "asc" && /* @__PURE__ */ jsx(ArrowUp, { className: "size-3.5 text-muted-foreground shrink-0" })
+        ]
+      }
+    ) }) }),
+    /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "start", className: "w-36", children: [
+      customMenuItems && /* @__PURE__ */ jsxs(Fragment, { children: [
+        customMenuItems,
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      showFilter && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsxs(DropdownMenuSub, { children: [
+          /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "text-xs", children: [
+            /* @__PURE__ */ jsx(Filter, { className: "mr-2 size-3.5 text-muted-foreground" }),
+            "Filter",
+            isFiltered && /* @__PURE__ */ jsx("span", { className: "ml-auto text-[10px] text-muted-foreground", children: "Active" })
+          ] }),
+          /* @__PURE__ */ jsx(DropdownMenuSubContent, { alignOffset: -5, sideOffset: 5, children: /* @__PURE__ */ jsx(
+            DataTableColumnFilterContent,
+            {
+              title,
+              value: column.getFilterValue(),
+              onChange: (v) => {
+                column.setFilterValue(v);
+                onFilterChange?.(column.id, v);
+              },
+              onClear: () => column.setFilterValue(void 0),
+              filterType: resolvedFilterType,
+              filterOptions: resolvedFilterOptions,
+              placeholder: filterPlaceholder,
+              showDeleteMenu: false
+            }
+          ) })
+        ] }),
+        isFiltered && /* @__PURE__ */ jsx(
+          DropdownMenuItem,
+          {
+            onClick: () => column.setFilterValue(void 0),
+            className: "text-xs",
+            children: "Clear filter"
+          }
+        ),
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {})
+      ] }),
+      canSort && /* @__PURE__ */ jsxs(DropdownMenuSub, { children: [
+        /* @__PURE__ */ jsxs(DropdownMenuSubTrigger, { className: "text-xs", children: [
+          /* @__PURE__ */ jsx(ListOrdered, { className: "mr-2 size-3.5 text-muted-foreground" }),
+          "Sort"
+        ] }),
+        /* @__PURE__ */ jsxs(DropdownMenuSubContent, { alignOffset: -5, sideOffset: 5, children: [
+          /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => column.toggleSorting(false),
+              className: cn("text-xs", isSorted === "asc" && "bg-accent"),
+              children: [
+                /* @__PURE__ */ jsx(ArrowUp, { className: "mr-2 size-3.5 text-muted-foreground" }),
+                "Ascending"
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            DropdownMenuItem,
+            {
+              onClick: () => column.toggleSorting(true),
+              className: cn("text-xs", isSorted === "desc" && "bg-accent"),
+              children: [
+                /* @__PURE__ */ jsx(ArrowDown, { className: "mr-2 size-3.5 text-muted-foreground" }),
+                "Descending"
+              ]
+            }
+          ),
+          isSorted && /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+            /* @__PURE__ */ jsx(
+              DropdownMenuItem,
+              {
+                onClick: () => column.clearSorting(),
+                className: "text-xs",
+                children: "Clear sort"
+              }
+            )
+          ] })
+        ] })
+      ] }),
+      (dataTableContext || onToggleWrapProp) && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsxs(DropdownMenuItem, { onClick: onToggleWrap, className: "text-xs", children: [
+          /* @__PURE__ */ jsx(WrapText, { className: "mr-2 size-3.5 text-muted-foreground" }),
+          isWrapped ? "Disable wrap" : "Wrap text"
+        ] })
+      ] }),
+      canHide && /* @__PURE__ */ jsxs(Fragment, { children: [
+        (canSort || dataTableContext || onToggleWrapProp) && /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
+        /* @__PURE__ */ jsxs(
+          DropdownMenuItem,
+          {
+            onClick: () => column.toggleVisibility(false),
+            className: "text-xs",
+            children: [
+              /* @__PURE__ */ jsx(EyeOff, { className: "mr-2 size-3.5 text-muted-foreground" }),
+              "Hide"
+            ]
+          }
+        )
+      ] })
+    ] })
+  ] }) });
+}
+var FinanceDisplayContext = React3.createContext({
+  decimals: 0,
+  displayUnits: "actuals",
+  currencySignDisplay: "all"
+});
+var FinanceDecimalsContext = React3.createContext(0);
+function FinanceDisplayProvider({
+  decimals,
+  displayUnits = "actuals",
+  currencySignDisplay = "all",
+  children
+}) {
+  const value = React3.useMemo(
+    () => ({ decimals, displayUnits, currencySignDisplay }),
+    [decimals, displayUnits, currencySignDisplay]
+  );
+  return /* @__PURE__ */ jsx(FinanceDisplayContext.Provider, { value, children: /* @__PURE__ */ jsx(FinanceDecimalsContext.Provider, { value: decimals, children }) });
+}
+function FinanceDecimalsProvider({
+  decimals,
+  children
+}) {
+  return /* @__PURE__ */ jsx(FinanceDisplayProvider, { decimals, children });
+}
+function useFinanceDecimals() {
+  return React3.useContext(FinanceDecimalsContext);
+}
+function useFinanceDisplay() {
+  return React3.useContext(FinanceDisplayContext);
+}
+function getUnitDivisor(units) {
+  switch (units) {
+    case "thousands":
+      return 1e3;
+    case "millions":
+      return 1e6;
+    default:
+      return 1;
+  }
+}
+function getUnitLabel(units) {
+  switch (units) {
+    case "thousands":
+      return "in thousands";
+    case "millions":
+      return "in millions";
+    default:
+      return null;
+  }
+}
+function getUnitSuffix(units) {
+  switch (units) {
+    case "thousands":
+      return "(000s)";
+    case "millions":
+      return "(M)";
+    default:
+      return null;
+  }
+}
+function useFinanceDecimalsSetting(storageKey = "finance-decimal-places", defaultValue = 0) {
+  const [decimals, setDecimalsState] = React3.useState(() => {
+    if (typeof window === "undefined") return defaultValue;
+    const stored = localStorage.getItem(storageKey);
+    return stored !== null ? Number(stored) : defaultValue;
+  });
+  const setDecimals = React3.useCallback(
+    (v) => {
+      setDecimalsState(v);
+      if (typeof window !== "undefined") {
+        localStorage.setItem(storageKey, String(v));
+      }
+    },
+    [storageKey]
+  );
+  return [decimals, setDecimals];
+}
+var formatterCache = /* @__PURE__ */ new Map();
+function getFormatter(locale, currencyCode, decimals) {
+  const key = `${locale}:${currencyCode}:${decimals}`;
+  let fmt = formatterCache.get(key);
+  if (!fmt) {
+    fmt = new Intl.NumberFormat(locale, {
+      style: "currency",
+      currency: currencyCode,
+      minimumFractionDigits: decimals,
+      maximumFractionDigits: decimals
+    });
+    formatterCache.set(key, fmt);
+  }
+  return fmt;
+}
+function formatCurrencyValue(value, options) {
+  const raw = value ?? 0;
+  const divisor = getUnitDivisor(options?.displayUnits ?? "actuals");
+  const v = divisor === 1 ? raw : raw / divisor;
+  const isZero = raw === 0;
+  const isNegative = v < 0;
+  const curr = options?.currency ?? "USD";
+  const locale = options?.locale ?? "en-US";
+  const dashZero = options?.dashZero ?? false;
+  const decimals = options?.decimals ?? 2;
+  const showSign = options?.showCurrencySign ?? true;
+  if (isZero && dashZero) {
+    return { text: "\u2014", isNegative: false, isZero: true };
+  }
+  const absV = Math.abs(v);
+  let formatted;
+  if (showSign) {
+    const fmt = getFormatter(locale, curr, decimals);
+    formatted = fmt.format(absV);
+  } else {
+    formatted = absV.toLocaleString(locale, {
+      minimumFractionDigits: decimals,
+      maximumFractionDigits: decimals
+    });
+  }
+  if (isNegative) {
+    return { text: `(${formatted})`, isNegative: true, isZero: false };
+  }
+  return { text: formatted, isNegative: false, isZero };
+}
+function DataTableCurrencyCell({
+  value,
+  currency: currencyCode = "USD",
+  locale = "en-US",
+  dashZero = false,
+  decimals,
+  className,
+  /** Whether this cell is in a summary/total row */
+  isSummaryRow
+}) {
+  const ctx = useFinanceDisplay();
+  const resolvedDecimals = decimals ?? ctx.decimals;
+  const showCurrencySign = ctx.currencySignDisplay === "all" || ctx.currencySignDisplay === "summary" && isSummaryRow;
+  const { text, isNegative, isZero } = formatCurrencyValue(value, {
+    currency: currencyCode,
+    locale,
+    dashZero,
+    decimals: resolvedDecimals,
+    displayUnits: ctx.displayUnits,
+    showCurrencySign
+  });
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "font-mono tabular-nums",
+        isNegative && "text-red-600 dark:text-red-400",
+        isZero && dashZero && "text-muted-foreground",
+        className
+      ),
+      children: text
+    }
+  );
+}
+
+// src/blocks/data-table/financialStatementRowImportance.ts
+var DEFAULT_ROW_IMPORTANCE_CONFIG = {
+  "income-statement": {
+    emphasis: ["Total Revenue", "Total Expenses", "Operating Income"],
+    keySummary: ["Net Income"]
+  },
+  "balance-sheet": {
+    emphasis: ["Total Liabilities", "Total Equity"],
+    keySummary: ["Total Assets", "Total Liabilities & Equity"]
+  },
+  "cash-flow": {
+    emphasis: [
+      "Total Operating Activities",
+      "Total Investing Activities",
+      "Total Financing Activities",
+      "Net Cash from Operating Activities",
+      "Net Cash from Investing Activities",
+      "Net Cash from Financing Activities"
+    ],
+    keySummary: [
+      "Net Change in Cash",
+      "Ending Cash",
+      "Total Cash & Cash Equivalents"
+    ]
+  },
+  "working-capital": {
+    emphasis: ["Total Current Assets", "Total Current Liabilities"],
+    keySummary: ["NWC", "Net Working Capital"]
+  }
+};
+function normalizeLabel(value) {
+  return value.trim().toLowerCase().replace(/\s+/g, " ");
+}
+function createFinancialStatementRowImportanceResolver(kind, overrides) {
+  const base = DEFAULT_ROW_IMPORTANCE_CONFIG[kind];
+  const emphasis = new Set(
+    (overrides?.emphasis ?? base?.emphasis ?? []).map(normalizeLabel)
+  );
+  const keySummary = new Set(
+    (overrides?.keySummary ?? base?.keySummary ?? []).map(normalizeLabel)
+  );
+  return (row) => {
+    const label = normalizeLabel(row.name);
+    if (keySummary.has(label)) return "key-summary";
+    if (emphasis.has(label)) return "emphasis";
+    return "normal";
+  };
+}
+function getFinancialStatementRowImportanceClassName(importance) {
+  switch (importance) {
+    case "emphasis":
+      return "bg-muted/25 border-t border-border/50 font-medium";
+    case "key-summary":
+      return "bg-muted/45 border-t-2 border-border/70 font-semibold";
+    default:
+      return void 0;
+  }
+}
+var TOLERANCE = 0.01;
+function RecCheck({ computed, raw }) {
+  const diff = Math.abs(computed - raw);
+  const matches = diff <= TOLERANCE;
+  const icon = matches ? /* @__PURE__ */ jsx(CheckCircle2, { className: "size-3.5 text-white fill-emerald-500" }) : /* @__PURE__ */ jsx(AlertTriangle, { className: "size-3.5 text-white fill-amber-500" });
+  return /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { children: icon }) }),
+    /* @__PURE__ */ jsx(TooltipContent, { side: "left", className: "text-[11px] max-w-none p-2", children: matches ? /* @__PURE__ */ jsx("span", { className: "text-emerald-400", children: "\u2713 Balanced \u2014 computed total matches source data" }) : /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+      /* @__PURE__ */ jsx("div", { className: "text-amber-400 font-medium", children: "\u26A0 Variance detected" }),
+      /* @__PURE__ */ jsx("table", { className: "text-[11px]", children: /* @__PURE__ */ jsxs("tbody", { children: [
+        /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx("td", { className: "pr-3 text-muted-foreground", children: "Computed:" }),
+          /* @__PURE__ */ jsx("td", { className: "font-mono tabular-nums text-right", children: formatCurrencyValue(computed, { decimals: 2 }).text })
+        ] }),
+        /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx("td", { className: "pr-3 text-muted-foreground", children: "Source:" }),
+          /* @__PURE__ */ jsx("td", { className: "font-mono tabular-nums text-right", children: formatCurrencyValue(raw, { decimals: 2 }).text })
+        ] }),
+        /* @__PURE__ */ jsxs("tr", { className: "border-t border-border/40", children: [
+          /* @__PURE__ */ jsx("td", { className: "pr-3 text-muted-foreground pt-0.5", children: "Variance:" }),
+          /* @__PURE__ */ jsx("td", { className: "font-mono tabular-nums text-right pt-0.5 text-amber-400", children: formatCurrencyValue(computed - raw, { decimals: 2 }).text })
+        ] })
+      ] }) })
+    ] }) })
+  ] }) });
+}
+function splitMetricFormula(formula) {
+  const lines = formula.split("\n").map((line) => line.trim()).filter(Boolean);
+  return {
+    equationLine: lines[0] ?? formula,
+    detailLines: lines.slice(1)
+  };
+}
+function MetricEquationTooltip({
+  title,
+  formula
+}) {
+  const { equationLine } = splitMetricFormula(formula);
+  const [lhs, rhs] = equationLine.split("=").map((part) => part.trim());
+  if (!rhs) {
+    return /* @__PURE__ */ jsx("p", { className: "text-xs leading-relaxed", children: formula });
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-[11px] font-medium text-muted-foreground/90", children: title }),
+    /* @__PURE__ */ jsx("div", { className: "rounded-md border border-slate-500/15 bg-gradient-to-r from-slate-500/[0.05] via-sky-500/[0.04] to-emerald-500/[0.05] px-2.5 py-1.5", children: /* @__PURE__ */ jsxs("p", { className: "text-xs font-mono tracking-tight leading-relaxed text-foreground/85", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-semibold text-sky-700/85 dark:text-sky-200/85", children: lhs }),
+      /* @__PURE__ */ jsx("span", { className: "px-1 text-muted-foreground/80", children: "=" }),
+      /* @__PURE__ */ jsx("span", { className: "text-emerald-700/85 dark:text-emerald-200/85", children: rhs })
+    ] }) })
+  ] });
+}
+function toPeriodKey(date, unit) {
+  const [y, m] = date.split("-").map(Number);
+  if (unit === "year") return String(y);
+  if (unit === "quarter") {
+    const q = Math.floor((m - 1) / 3) + 1;
+    return `${y}-Q${q}`;
+  }
+  return `${y}-${String(m).padStart(2, "0")}`;
+}
+function resolvePeriodColumns(periods, timeUnit, periodOrder, periodColumnOrder = "oldest-first") {
+  const basePeriods = periodColumnOrder === "newest-first" ? [...periods].reverse() : periods;
+  if (!periodOrder || periodOrder.length === 0) return basePeriods;
+  const normalizedOrder = periodOrder.map((pk) => toPeriodKey(pk, timeUnit));
+  const periodSet = new Set(basePeriods);
+  const prioritized = Array.from(new Set(normalizedOrder)).filter(
+    (pk) => periodSet.has(pk)
+  );
+  const remainder = basePeriods.filter((pk) => !prioritized.includes(pk));
+  return [...prioritized, ...remainder];
+}
+function calculateDesktopFinancialColumnSizing({
+  periods,
+  rows,
+  showRowTotals,
+  showVariance
+}) {
+  const MIN_ACCOUNT = 260;
+  const MIN_DATA = 88;
+  const MIN_TOTAL = 96;
+  const VARIANCE_COL = showVariance ? 80 : 0;
+  const TARGET_TABLE_WIDTH = 1180;
+  let maxNumericChars = 1;
+  for (const row of rows) {
+    for (const pk of periods) {
+      maxNumericChars = Math.max(
+        maxNumericChars,
+        Math.round(Math.abs(row.periodAmounts[pk] ?? 0)).toLocaleString().length
+      );
+    }
+    maxNumericChars = Math.max(
+      maxNumericChars,
+      Math.round(Math.abs(row.total ?? 0)).toLocaleString().length
+    );
+  }
+  let dataSize = Math.min(156, Math.max(104, maxNumericChars * 9 + 26));
+  let totalSize = Math.max(MIN_TOTAL, dataSize + 8);
+  let accountSize = Math.max(340, 620 - periods.length * 26);
+  let tableWidth = accountSize + periods.length * dataSize + (showRowTotals ? totalSize : 0) + VARIANCE_COL;
+  if (tableWidth > TARGET_TABLE_WIDTH) {
+    const reducibleAccount = accountSize - MIN_ACCOUNT;
+    const needed = tableWidth - TARGET_TABLE_WIDTH;
+    const reduceAccount = Math.min(reducibleAccount, needed);
+    accountSize -= reduceAccount;
+    tableWidth -= reduceAccount;
+  }
+  if (tableWidth > TARGET_TABLE_WIDTH && periods.length > 0) {
+    const reducibleDataPerCol = Math.max(0, dataSize - MIN_DATA);
+    const totalReducible = reducibleDataPerCol * periods.length;
+    const needed = tableWidth - TARGET_TABLE_WIDTH;
+    const reduceTotal = Math.min(totalReducible, needed);
+    const perCol = Math.floor(reduceTotal / periods.length);
+    dataSize = Math.max(MIN_DATA, dataSize - perCol);
+    if (showRowTotals) {
+      totalSize = Math.max(MIN_TOTAL, totalSize - Math.ceil(perCol * 0.9));
+    }
+  }
+  return {
+    accountSize,
+    accountMinSize: MIN_ACCOUNT,
+    dataSize,
+    dataMinSize: MIN_DATA,
+    totalSize
+  };
+}
+function toPeriodLabel(key, unit) {
+  if (unit === "year") return key;
+  if (unit === "quarter") return key.replace("-", " ");
+  const [year, month] = key.split("-");
+  const date = new Date(Number(year), Number(month) - 1);
+  return date.toLocaleDateString("en-US", { month: "short", year: "2-digit" });
+}
+function sumChildPeriods(children) {
+  const periodAmounts = {};
+  let total = 0;
+  for (const child of children) {
+    total += child.total;
+    for (const [pk, amt] of Object.entries(child.periodAmounts)) {
+      periodAmounts[pk] = (periodAmounts[pk] || 0) + amt;
+    }
+  }
+  return { periodAmounts, total };
+}
+function buildAccountTree(accounts, sign) {
+  const byNumber = /* @__PURE__ */ new Map();
+  for (const a of accounts) {
+    if (a.number) byNumber.set(a.number, a);
+  }
+  const nameToNumber = /* @__PURE__ */ new Map();
+  for (const a of accounts) {
+    if (a.number && a.name) nameToNumber.set(a.name, a.number);
+  }
+  const synthetics = [];
+  for (const a of accounts) {
+    if (a.isSubAccount && a.parentNumber && a.parentNumber !== a.number && !byNumber.has(a.parentNumber)) {
+      const parentName = a.parentName ?? a.name;
+      const synthetic = {
+        id: `synthetic-${a.parentNumber}`,
+        name: parentName,
+        secondaryLabel: null,
+        number: a.parentNumber,
+        type: a.type,
+        subType: a.subType,
+        isSubAccount: false,
+        parentNumber: null,
+        parentName: null,
+        periods: {},
+        total: 0
+      };
+      byNumber.set(a.parentNumber, synthetic);
+      nameToNumber.set(parentName, a.parentNumber);
+      synthetics.push(synthetic);
+    }
+  }
+  for (const s of synthetics) {
+    const lastColon = s.name.lastIndexOf(":");
+    if (lastColon > 0) {
+      const grandparentPath = s.name.substring(0, lastColon);
+      const gpNumber = nameToNumber.get(grandparentPath);
+      if (gpNumber && gpNumber !== s.number) {
+        s.isSubAccount = true;
+        s.parentNumber = gpNumber;
+        s.parentName = grandparentPath;
+      }
+    }
+  }
+  for (const s of synthetics) {
+    accounts.push(s);
+  }
+  const roots = [];
+  const childrenOf = /* @__PURE__ */ new Map();
+  for (const a of accounts) {
+    if (a.isSubAccount && a.parentNumber && a.parentNumber !== a.number && byNumber.has(a.parentNumber)) {
+      const existing = childrenOf.get(a.parentNumber) || [];
+      existing.push(a);
+      childrenOf.set(a.parentNumber, existing);
+    } else {
+      roots.push(a);
+    }
+  }
+  function buildRow(acct, depth) {
+    const kids = childrenOf.get(acct.number ?? "") || [];
+    const childRows = kids.sort((a, b) => (a.number ?? "").localeCompare(b.number ?? "")).map((k) => buildRow(k, depth + 1));
+    const periodAmounts = {};
+    let total = 0;
+    if (childRows.length > 0) {
+      const childSums = sumChildPeriods(childRows);
+      total = acct.total * sign + childSums.total;
+      for (const pk of Object.keys({
+        ...acct.periods,
+        ...childSums.periodAmounts
+      })) {
+        periodAmounts[pk] = (acct.periods[pk] || 0) * sign + (childSums.periodAmounts[pk] || 0);
+      }
+    } else {
+      total = acct.total * sign;
+      for (const [pk, amt] of Object.entries(acct.periods)) {
+        periodAmounts[pk] = amt * sign;
+      }
+    }
+    return {
+      _type: childRows.length > 0 ? "account-group" : "account",
+      id: acct.id,
+      name: acct.name.includes(":") ? acct.name.substring(acct.name.lastIndexOf(":") + 1) : acct.name,
+      accountNumber: acct.number,
+      secondaryLabel: acct.secondaryLabel,
+      accountType: acct.type,
+      accountSubType: acct.subType,
+      periodAmounts,
+      total,
+      children: childRows,
+      depth
+    };
+  }
+  return roots.sort((a, b) => (a.number ?? "").localeCompare(b.number ?? "")).map((r) => buildRow(r, 0));
+}
+function applySubtotalRules(accountTree, rules, sectionId) {
+  const sortedRules = [...rules].sort((a, b) => a.order - b.order);
+  const compiled = sortedRules.map((r) => ({
+    rule: r,
+    regex: new RegExp(r.pattern)
+  }));
+  const groups = /* @__PURE__ */ new Map();
+  const unmatched = [];
+  for (const r of sortedRules) {
+    groups.set(r.label, []);
+  }
+  function matchRow(row) {
+    for (const { rule, regex } of compiled) {
+      if (row.accountNumber && regex.test(row.accountNumber)) {
+        return rule.label;
+      }
+    }
+    return null;
+  }
+  let anyMatched = false;
+  for (const row of accountTree) {
+    const groupLabel = matchRow(row);
+    if (groupLabel) {
+      groups.get(groupLabel).push(row);
+      anyMatched = true;
+    } else {
+      unmatched.push(row);
+    }
+  }
+  if (!anyMatched) {
+    return accountTree;
+  }
+  const result = [];
+  for (const rule of sortedRules) {
+    const groupRows = groups.get(rule.label) ?? [];
+    if (groupRows.length === 0) continue;
+    const sums = sumChildPeriods(groupRows);
+    result.push({
+      _type: "subtotal-group",
+      id: `subtotal-${sectionId}-${rule.label.toLowerCase().replace(/\s+/g, "-")}`,
+      name: rule.label,
+      accountNumber: null,
+      periodAmounts: sums.periodAmounts,
+      total: sums.total,
+      children: groupRows,
+      depth: 0
+    });
+  }
+  if (unmatched.length > 0) {
+    const sums = sumChildPeriods(unmatched);
+    result.push({
+      _type: "subtotal-group",
+      id: `subtotal-${sectionId}-other`,
+      name: "Other",
+      accountNumber: null,
+      periodAmounts: sums.periodAmounts,
+      total: sums.total,
+      children: unmatched,
+      depth: 0
+    });
+  }
+  return result;
+}
+function filterZeroRows(rows) {
+  return rows.reduce((acc, row) => {
+    if (row._type === "section-header" || row._type === "section-total" || row._type === "grand-total") {
+      if (row.children.length > 0) {
+        acc.push({ ...row, children: filterZeroRows(row.children) });
+      } else {
+        acc.push(row);
+      }
+      return acc;
+    }
+    if (row.children.length > 0) {
+      const filteredChildren = filterZeroRows(row.children);
+      if (filteredChildren.length === 0) {
+        const parentIsZero = row.total === 0 && Object.values(row.periodAmounts).every((v) => v === 0);
+        if (parentIsZero) return acc;
+        acc.push({ ...row, children: [] });
+        return acc;
+      }
+      if (row._type === "subtotal-group") {
+        const sums = sumChildPeriods(filteredChildren);
+        acc.push({
+          ...row,
+          children: filteredChildren,
+          periodAmounts: sums.periodAmounts,
+          total: sums.total
+        });
+      } else {
+        acc.push({ ...row, children: filteredChildren });
+      }
+      return acc;
+    }
+    const isZero = row.total === 0 && Object.values(row.periodAmounts).every((v) => v === 0);
+    if (!isZero) {
+      acc.push(row);
+    }
+    return acc;
+  }, []);
+}
+function buildFinancialStatementData(data, config, timeUnit, subtotalRules, options) {
+  const periodSet = /* @__PURE__ */ new Set();
+  for (const entry of data) {
+    periodSet.add(toPeriodKey(entry.period_first_day, timeUnit));
+  }
+  const periods = [...periodSet].sort();
+  const sectionTotals = /* @__PURE__ */ new Map();
+  const sectionRawTotals = /* @__PURE__ */ new Map();
+  const rows = [];
+  for (const section of config.sections) {
+    const classSet = new Set(section.accountClasses);
+    const sign = section.sign ?? 1;
+    const accountMap = /* @__PURE__ */ new Map();
+    for (const entry of data) {
+      if (!classSet.has(entry.account_class)) continue;
+      const pk = toPeriodKey(entry.period_first_day, timeUnit);
+      if (!accountMap.has(entry.account_id)) {
+        accountMap.set(entry.account_id, {
+          id: entry.account_id,
+          name: entry.account_name,
+          secondaryLabel: entry.account_secondary_label ?? null,
+          number: entry.account_number,
+          type: entry.account_type ?? "",
+          subType: entry.account_sub_type ?? null,
+          isSubAccount: entry.is_sub_account ?? false,
+          parentNumber: entry.parent_account_number ?? null,
+          parentName: entry.parent_account_name ?? null,
+          periods: {},
+          total: 0
+        });
+      }
+      const acct = accountMap.get(entry.account_id);
+      acct.periods[pk] = (acct.periods[pk] || 0) + entry.amount;
+      acct.total += entry.amount;
+    }
+    const rawPeriods = {};
+    let rawTotal = 0;
+    for (const entry of data) {
+      if (!classSet.has(entry.account_class)) continue;
+      const pk = toPeriodKey(entry.period_first_day, timeUnit);
+      const val = entry.amount * sign;
+      rawPeriods[pk] = (rawPeriods[pk] || 0) + val;
+      rawTotal += val;
+    }
+    sectionRawTotals.set(section.id, {
+      periodAmounts: rawPeriods,
+      total: rawTotal
+    });
+    const accountList = [...accountMap.values()];
+    const accountTree = buildAccountTree(accountList, sign);
+    if (accountTree.length === 0 && !options?.preserveEmptySections) continue;
+    const useSubtotals = subtotalRules?.enabled && subtotalRules.rules.length > 0;
+    const sectionChildren = useSubtotals ? applySubtotalRules(accountTree, subtotalRules.rules, section.id) : accountTree;
+    const sectionSums = sumChildPeriods(accountTree);
+    sectionTotals.set(section.id, sectionSums);
+    if (section.standalone) {
+      const normalizeDepth = (items) => items.map((item) => ({
+        ...item,
+        depth: Math.max(0, item.depth - 1),
+        children: normalizeDepth(item.children)
+      }));
+      rows.push(...normalizeDepth(sectionChildren));
+      continue;
+    }
+    const sectionHeader = {
+      _type: "section-header",
+      id: `section-${section.id}`,
+      name: section.label,
+      accountNumber: null,
+      periodAmounts: {},
+      total: 0,
+      children: sectionChildren,
+      depth: 0
+    };
+    rows.push(sectionHeader);
+    const rawSums = sectionRawTotals.get(section.id);
+    rows.push({
+      _type: "section-total",
+      id: `total-${section.id}`,
+      name: `Total ${section.label}`,
+      accountNumber: null,
+      periodAmounts: sectionSums.periodAmounts,
+      total: sectionSums.total,
+      children: [],
+      depth: 0,
+      _rawPeriodAmounts: rawSums?.periodAmounts,
+      _rawTotal: rawSums?.total
+    });
+  }
+  for (const total of config.totals) {
+    const totalPeriods = {};
+    let totalAmount = 0;
+    const rawTotalPeriods = {};
+    let rawTotalAmount = 0;
+    for (const ref of total.formula) {
+      const subtract = ref.startsWith("-");
+      const sectionId = subtract ? ref.slice(1) : ref;
+      const sums = sectionTotals.get(sectionId);
+      const rawSums = sectionRawTotals.get(sectionId);
+      if (!sums) continue;
+      const mult = subtract ? -1 : 1;
+      totalAmount += sums.total * mult;
+      rawTotalAmount += (rawSums?.total ?? 0) * mult;
+      for (const pk of periods) {
+        totalPeriods[pk] = (totalPeriods[pk] || 0) + (sums.periodAmounts[pk] || 0) * mult;
+        rawTotalPeriods[pk] = (rawTotalPeriods[pk] || 0) + (rawSums?.periodAmounts[pk] || 0) * mult;
+      }
+    }
+    rows.push({
+      _type: "grand-total",
+      id: `grand-total-${total.label.toLowerCase().replace(/\s+/g, "-")}`,
+      name: total.label,
+      accountNumber: null,
+      periodAmounts: totalPeriods,
+      total: totalAmount,
+      children: [],
+      depth: 0,
+      _rawPeriodAmounts: rawTotalPeriods,
+      _rawTotal: rawTotalAmount
+    });
+  }
+  return { rows, periods };
+}
+function buildColumns(periods, unit, rows, showAccountNumbers, renderAmountCell, showRowTotals = true, showVariance, currentPeriodCount, isMobile = false, mobileCompareEnabled = false, periodLabelsOverride, accountColumnLabel = "Account", accountColumnMenuItems) {
+  const desktopSizing = calculateDesktopFinancialColumnSizing({
+    periods,
+    rows,
+    showRowTotals,
+    showVariance: Boolean(showVariance)
+  });
+  const compactMobileAccount = isMobile && periods.length <= 1;
+  const cols = [
+    {
+      id: "account",
+      accessorKey: "name",
+      header: ({ column }) => /* @__PURE__ */ jsx(
+        DataTableColumnHeader,
+        {
+          column,
+          title: accountColumnLabel,
+          customMenuItems: accountColumnMenuItems
+        }
+      ),
+      meta: {
+        displayName: accountColumnLabel,
+        icon: BookOpen,
+        allowHorizontalScroll: isMobile && mobileCompareEnabled
+      },
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r._type === "section-header") {
+          return /* @__PURE__ */ jsx("span", { className: "text-xs font-semibold uppercase tracking-wider text-muted-foreground", children: r.name });
+        }
+        if (r._type === "subtotal-group") {
+          return /* @__PURE__ */ jsx("span", { className: "font-semibold", children: r.name });
+        }
+        if (r._type === "section-total" || r._type === "subtotal-total") {
+          return /* @__PURE__ */ jsx("span", { className: "font-semibold", children: r.name });
+        }
+        if (r._type === "grand-total") {
+          return /* @__PURE__ */ jsx("span", { className: "font-bold", children: r.name });
+        }
+        if (r._type === "account-group") {
+          return /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
+            showAccountNumbers && r.accountNumber && /* @__PURE__ */ jsx("span", { className: "font-mono text-muted-foreground mr-1.5 text-xs", children: r.accountNumber }),
+            r.name,
+            !isMobile && r.secondaryLabel && /* @__PURE__ */ jsx("span", { className: "ml-1.5 text-[11px] font-normal text-muted-foreground", children: r.secondaryLabel })
+          ] });
+        }
+        const isPlaceholder = r.accountSubType === "placeholder";
+        return /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: isPlaceholder ? "italic text-muted-foreground" : "",
+              children: [
+                showAccountNumbers && r.accountNumber && /* @__PURE__ */ jsx("span", { className: "font-mono text-muted-foreground mr-1.5 text-xs", children: r.accountNumber }),
+                r.name,
+                !isMobile && r.secondaryLabel && /* @__PURE__ */ jsx("span", { className: "ml-1.5 text-[11px] font-normal text-muted-foreground", children: r.secondaryLabel })
+              ]
+            }
+          ),
+          r.accountType === "metric" && r.accountSubType && /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+            /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                className: "text-muted-foreground/70 hover:text-foreground transition-colors",
+                "aria-label": `${r.name} metric details`,
+                children: /* @__PURE__ */ jsx(Info, { className: "h-3.5 w-3.5" })
+              }
+            ) }),
+            /* @__PURE__ */ jsx(TooltipContent, { side: "top", className: "max-w-[340px] text-xs", children: /* @__PURE__ */ jsx(
+              MetricEquationTooltip,
+              {
+                title: r.name,
+                formula: r.accountSubType
+              }
+            ) })
+          ] }) })
+        ] });
+      },
+      enableSorting: false,
+      // Mobile: shrink account column based on how many period columns need to fit.
+      // 2 periods → moderate shrink, 3+ periods → aggressive shrink
+      size: isMobile ? mobileCompareEnabled || compactMobileAccount ? 180 : periods.length >= 3 ? 120 : periods.length >= 2 ? 160 : 260 : desktopSizing.accountSize,
+      minSize: isMobile ? mobileCompareEnabled || compactMobileAccount ? 120 : periods.length >= 2 ? 80 : 200 : desktopSizing.accountMinSize,
+      maxSize: isMobile && !(mobileCompareEnabled || compactMobileAccount) ? periods.length >= 3 ? 160 : periods.length >= 2 ? 200 : 320 : void 0
+    }
+  ];
+  for (const pk of periods) {
+    const label = periodLabelsOverride?.[pk] ?? toPeriodLabel(pk, unit);
+    cols.push({
+      id: `period-${pk}`,
+      accessorFn: (row) => row.periodAmounts[pk] ?? 0,
+      header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, { column, title: label }),
+      meta: {
+        displayName: label,
+        icon: Calendar,
+        align: "right"
+      },
+      cell: ({ row }) => {
+        const r = row.original;
+        const val = r.periodAmounts[pk] ?? 0;
+        if (r._type === "section-header") return null;
+        const isTotalRow = r._type === "section-total" || r._type === "grand-total";
+        const bold = r._type === "grand-total" ? "font-bold" : r._type === "section-total" || r._type === "subtotal-total" || r._type === "account-group" || r._type === "subtotal-group" ? "font-semibold" : "";
+        if (renderAmountCell) {
+          const cellNode = renderAmountCell(r, pk, val);
+          return /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                bold,
+                "inline-flex cursor-help border-b border-dotted border-muted-foreground/35 leading-none hover:border-muted-foreground/60"
+              ),
+              children: cellNode
+            }
+          );
+        }
+        const rawVal = isTotalRow ? r._rawPeriodAmounts?.[pk] : void 0;
+        if (isTotalRow && rawVal !== void 0) {
+          return /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: cn(
+                bold,
+                "flex items-center justify-end gap-1.5 group/rec w-full h-full"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-0 group-hover/rec:opacity-100 transition-opacity flex-shrink-0 leading-[0]", children: /* @__PURE__ */ jsx(RecCheck, { computed: val, raw: rawVal }) }),
+                /* @__PURE__ */ jsx("span", { className: "leading-none", children: /* @__PURE__ */ jsx(
+                  DataTableCurrencyCell,
+                  {
+                    value: val,
+                    dashZero: true,
+                    isSummaryRow: r._type === "section-total" || r._type === "grand-total" || r._type === "subtotal-total"
+                  }
+                ) })
+              ]
+            }
+          );
+        }
+        return /* @__PURE__ */ jsx("span", { className: bold, children: /* @__PURE__ */ jsx(
+          DataTableCurrencyCell,
+          {
+            value: val,
+            dashZero: true,
+            isSummaryRow: r._type === "section-total" || r._type === "grand-total" || r._type === "subtotal-total"
+          }
+        ) });
+      },
+      enableSorting: false,
+      // Mobile compare mode: data columns stay readable but can shrink/grow dynamically.
+      size: isMobile ? mobileCompareEnabled ? 96 : 110 : desktopSizing.dataSize,
+      minSize: isMobile ? mobileCompareEnabled ? 82 : 80 : desktopSizing.dataMinSize,
+      maxSize: isMobile && mobileCompareEnabled ? 112 : void 0
+    });
+  }
+  if (showRowTotals) {
+    cols.push({
+      id: "total",
+      accessorFn: (row) => row.total,
+      header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, { column, title: "Total" }),
+      meta: {
+        displayName: "Total",
+        icon: DollarSign,
+        align: "right"
+      },
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r._type === "section-header") return null;
+        const isTotalRow = r._type === "section-total" || r._type === "grand-total";
+        const bold = r._type === "grand-total" ? "font-bold" : r._type === "section-total" || r._type === "subtotal-total" || r._type === "account-group" || r._type === "subtotal-group" ? "font-semibold" : "";
+        if (renderAmountCell) {
+          const cellNode = renderAmountCell(r, null, r.total);
+          return /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn(
+                bold,
+                "inline-flex cursor-help border-b border-dotted border-muted-foreground/35 leading-none hover:border-muted-foreground/60"
+              ),
+              children: cellNode
+            }
+          );
+        }
+        if (isTotalRow && r._rawTotal !== void 0) {
+          return /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: cn(
+                bold,
+                "flex items-center justify-end gap-1.5 group/rec w-full h-full"
+              ),
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "opacity-0 group-hover/rec:opacity-100 transition-opacity flex-shrink-0 leading-[0]", children: /* @__PURE__ */ jsx(RecCheck, { computed: r.total, raw: r._rawTotal }) }),
+                /* @__PURE__ */ jsx("span", { className: "leading-none", children: /* @__PURE__ */ jsx(
+                  DataTableCurrencyCell,
+                  {
+                    value: r.total,
+                    dashZero: true,
+                    isSummaryRow: r._type === "section-total" || r._type === "grand-total" || r._type === "subtotal-total"
+                  }
+                ) })
+              ]
+            }
+          );
+        }
+        return /* @__PURE__ */ jsx("span", { className: bold, children: /* @__PURE__ */ jsx(
+          DataTableCurrencyCell,
+          {
+            value: r.total,
+            dashZero: true,
+            isSummaryRow: r._type === "section-total" || r._type === "grand-total" || r._type === "subtotal-total"
+          }
+        ) });
+      },
+      enableSorting: false,
+      size: isMobile ? 130 : desktopSizing.totalSize,
+      minSize: isMobile ? 100 : 96
+    });
+  }
+  if (showVariance && currentPeriodCount && currentPeriodCount > 0) {
+    const priorPeriods = periods.slice(0, periods.length - currentPeriodCount);
+    const currentPeriods = periods.slice(periods.length - currentPeriodCount);
+    cols.push({
+      id: "variance",
+      accessorFn: (row) => {
+        const currentSum = currentPeriods.reduce(
+          (s, pk) => s + (row.periodAmounts[pk] ?? 0),
+          0
+        );
+        const priorSum = priorPeriods.reduce(
+          (s, pk) => s + (row.periodAmounts[pk] ?? 0),
+          0
+        );
+        if (priorSum === 0) return currentSum === 0 ? 0 : Infinity;
+        return (currentSum - priorSum) / Math.abs(priorSum) * 100;
+      },
+      header: ({ column }) => /* @__PURE__ */ jsx(DataTableColumnHeader, { column, title: "\u0394%" }),
+      meta: {
+        displayName: "Variance %",
+        icon: TrendingUp,
+        align: "right"
+      },
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r._type === "section-header") return null;
+        const currentSum = currentPeriods.reduce(
+          (s, pk) => s + (r.periodAmounts[pk] ?? 0),
+          0
+        );
+        const priorSum = priorPeriods.reduce(
+          (s, pk) => s + (r.periodAmounts[pk] ?? 0),
+          0
+        );
+        if (priorSum === 0 && currentSum === 0)
+          return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2013" });
+        if (priorSum === 0)
+          return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "n/a" });
+        const pct = (currentSum - priorSum) / Math.abs(priorSum) * 100;
+        const isPositive = pct > 0;
+        const isNegative = pct < 0;
+        const bold = r._type === "grand-total" ? "font-bold" : r._type === "section-total" || r._type === "subtotal-total" ? "font-semibold" : "";
+        return /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(
+              bold,
+              "tabular-nums text-xs",
+              isPositive && "text-emerald-500",
+              isNegative && "text-red-500",
+              !isPositive && !isNegative && "text-muted-foreground"
+            ),
+            children: [
+              isPositive ? "+" : "",
+              pct.toFixed(1),
+              "%"
+            ]
+          }
+        );
+      },
+      enableSorting: false,
+      size: 80,
+      minSize: 60
+    });
+  }
+  return cols;
+}
+function getRowClassName(row, rowImportanceResolver) {
+  const structuralClass = (() => {
+    switch (row.original._type) {
+      case "section-header":
+        return "bg-muted/30 border-b-0";
+      case "subtotal-group":
+        return "bg-muted/20";
+      case "section-total":
+      case "subtotal-total":
+        return "bg-muted/40 border-t border-border font-semibold";
+      case "grand-total":
+        return "bg-muted/60 border-t-2 border-double border-border";
+      default:
+        return void 0;
+    }
+  })();
+  const importanceClass = rowImportanceResolver ? getFinancialStatementRowImportanceClassName(
+    rowImportanceResolver(row.original)
+  ) : void 0;
+  return cn(structuralClass, importanceClass);
+}
+function FinancialStatementTable({
+  data,
+  timeUnit,
+  config,
+  showAccountNumbers = true,
+  treeIndentPx = 20,
+  subtotalRules,
+  hideZeroRows = false,
+  preserveEmptySections = false,
+  showRowTotals = true,
+  showVariance = false,
+  currentPeriodCount,
+  toolbar,
+  renderAmountCell,
+  isMobile = false,
+  mobileCompareEnabled = false,
+  periodOrder,
+  periodColumnOrder = "oldest-first",
+  periodLabels,
+  accountColumnLabel,
+  accountColumnMenuItems,
+  className,
+  rowImportanceResolver
+}) {
+  const [expanded, setExpanded] = React3.useState({});
+  const [columnVisibility, setColumnVisibility] = React3.useState({});
+  const [viewportLayout, setViewportLayout] = React3.useState("unknown");
+  const { rows: rawRows, periods } = React3.useMemo(
+    () => buildFinancialStatementData(data, config, timeUnit, subtotalRules, {
+      preserveEmptySections
+    }),
+    [data, config, timeUnit, subtotalRules, preserveEmptySections]
+  );
+  const rows = React3.useMemo(
+    () => hideZeroRows ? filterZeroRows(rawRows) : rawRows,
+    [rawRows, hideZeroRows]
+  );
+  const orderedPeriods = React3.useMemo(
+    () => resolvePeriodColumns(periods, timeUnit, periodOrder, periodColumnOrder),
+    [periods, timeUnit, periodOrder, periodColumnOrder]
+  );
+  const effectiveShowRowTotals = isMobile && mobileCompareEnabled ? false : showRowTotals;
+  const columns = React3.useMemo(
+    () => buildColumns(
+      orderedPeriods,
+      timeUnit,
+      rows,
+      showAccountNumbers,
+      renderAmountCell,
+      effectiveShowRowTotals,
+      showVariance,
+      currentPeriodCount,
+      isMobile,
+      mobileCompareEnabled,
+      periodLabels,
+      accountColumnLabel,
+      accountColumnMenuItems
+    ),
+    [
+      orderedPeriods,
+      timeUnit,
+      rows,
+      showAccountNumbers,
+      renderAmountCell,
+      effectiveShowRowTotals,
+      showVariance,
+      currentPeriodCount,
+      isMobile,
+      mobileCompareEnabled,
+      periodLabels,
+      accountColumnLabel,
+      accountColumnMenuItems
+    ]
+  );
+  React3.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const updateViewportLayout = () => {
+      setViewportLayout(
+        window.innerWidth > window.innerHeight ? "landscape" : "portrait"
+      );
+    };
+    updateViewportLayout();
+    window.addEventListener("resize", updateViewportLayout);
+    window.addEventListener("orientationchange", updateViewportLayout);
+    return () => {
+      window.removeEventListener("resize", updateViewportLayout);
+      window.removeEventListener("orientationchange", updateViewportLayout);
+    };
+  }, []);
+  React3.useEffect(() => {
+    if (rows.length === 0) return;
+    const toExpand = {};
+    for (const row of rows) {
+      if (row._type === "section-header") {
+        toExpand[row.id] = true;
+        for (const child of row.children) {
+          if (child._type === "account-group" || child._type === "subtotal-group") {
+            toExpand[child.id] = true;
+            if (child._type === "subtotal-group") {
+              for (const grandchild of child.children) {
+                if (grandchild._type === "account-group") {
+                  toExpand[grandchild.id] = true;
+                }
+              }
+            }
+          }
+        }
+      }
+    }
+    setExpanded(toExpand);
+  }, [rows]);
+  const table = useReactTable({
+    data: rows,
+    columns,
+    getRowId: (row) => row.id,
+    getCoreRowModel: getCoreRowModel(),
+    getSubRows: (row) => row.children.length > 0 ? row.children : void 0,
+    getExpandedRowModel: getExpandedRowModel(),
+    state: { expanded, columnVisibility },
+    onExpandedChange: setExpanded,
+    onColumnVisibilityChange: setColumnVisibility
+  });
+  return /* @__PURE__ */ jsxs("div", { className, children: [
+    toolbar && /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end gap-1 pb-1", children: toolbar }),
+    /* @__PURE__ */ jsx(
+      DataTable,
+      {
+        table,
+        columns,
+        enableTreeView: true,
+        treeIndentPx,
+        getRowClassName: ((row) => getRowClassName(row, rowImportanceResolver)),
+        enableColumnResizing: true,
+        enableRowDrag: false,
+        rowSelectionStyle: "none",
+        density: "compact",
+        fontSize: "sm",
+        stickyColumnIds: ["account"]
+      },
+      `fs-${isMobile ? "m" : "d"}-${mobileCompareEnabled ? "cmp" : "std"}-${viewportLayout}`
+    )
+  ] });
+}
+function flattenStatementForExport(data, config, timeUnit, subtotalRules, hideZeroRows) {
+  let { rows: tree, periods } = buildFinancialStatementData(
+    data,
+    config,
+    timeUnit,
+    subtotalRules
+  );
+  if (hideZeroRows) tree = filterZeroRows(tree);
+  const flat = [];
+  function walk(rows, indent) {
+    for (const row of rows) {
+      const prefix = "  ".repeat(indent);
+      const exportRow = {
+        type: row._type,
+        account: `${prefix}${row.accountNumber ? `${row.accountNumber} ` : ""}${row.name}`,
+        accountNumber: row.accountNumber ?? ""
+      };
+      for (const pk of periods) {
+        exportRow[pk] = row.periodAmounts[pk] ?? 0;
+      }
+      exportRow.total = row.total;
+      if (row._type !== "section-header" || row.children.length === 0) {
+        flat.push(exportRow);
+      } else {
+        flat.push(exportRow);
+      }
+      if (row.children.length > 0) {
+        walk(row.children, indent + 1);
+      }
+    }
+  }
+  walk(tree, 0);
+  return { rows: flat, periodKeys: periods };
+}
+var INCOME_STATEMENT_CONFIG = {
+  sections: [
+    { id: "revenue", label: "Revenue", accountClasses: ["Revenue"] },
+    { id: "expenses", label: "Expenses", accountClasses: ["Expense"] }
+  ],
+  totals: [{ label: "Net Income", formula: ["revenue", "-expenses"] }]
+};
+var BALANCE_SHEET_CONFIG = {
+  sections: [
+    { id: "assets", label: "Assets", accountClasses: ["Asset"] },
+    { id: "liabilities", label: "Liabilities", accountClasses: ["Liability"] },
+    { id: "equity", label: "Equity", accountClasses: ["Equity"] }
+  ],
+  totals: [
+    {
+      label: "Total Liabilities & Equity",
+      formula: ["liabilities", "equity"]
+    }
+  ]
+};
+
+// src/hooks/spreadsheetWorkbook.ts
+function escapeXml(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&apos;");
+}
+function styleId(style) {
+  if (!style) return void 0;
+  const map = {
+    header: "Header",
+    text: "Text",
+    number: "Number",
+    currency: "Currency",
+    percent: "Percent",
+    totalLabel: "TotalLabel",
+    totalNumber: "TotalNumber"
+  };
+  return map[style];
+}
+function excelColumnName(columnIndex) {
+  let n = columnIndex + 1;
+  let result = "";
+  while (n > 0) {
+    const rem = (n - 1) % 26;
+    result = String.fromCharCode(65 + rem) + result;
+    n = Math.floor((n - 1) / 26);
+  }
+  return result;
+}
+function buildSpreadsheetWorkbookXml({
+  worksheetName,
+  rows
+}) {
+  const xmlRows = rows.map(
+    (row) => `<Row>${row.map((cell) => {
+      const inferredType = cell.type ?? (typeof cell.value === "number" || cell.formula ? "Number" : "String");
+      const rawValue = cell.value ?? "";
+      const value = inferredType === "Number" ? Number(rawValue || 0) : escapeXml(String(rawValue));
+      const style = styleId(cell.style);
+      const styleAttr = style ? ` ss:StyleID="${style}"` : "";
+      const formulaAttr = cell.formula ? ` ss:Formula="=${escapeXml(cell.formula)}"` : "";
+      return `<Cell${styleAttr}${formulaAttr}><Data ss:Type="${inferredType}">${value}</Data></Cell>`;
+    }).join("")}</Row>`
+  ).join("\n");
+  return `<?xml version="1.0" encoding="UTF-8"?>
+<?mso-application progid="Excel.Sheet"?>
+<Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet" xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">
+<Styles>
+  <Style ss:ID="Header"><Font ss:Bold="1"/><Interior ss:Color="#F3F4F6" ss:Pattern="Solid"/></Style>
+  <Style ss:ID="Text"><NumberFormat ss:Format="@"/></Style>
+  <Style ss:ID="Number"><NumberFormat ss:Format="#,##0.00"/></Style>
+  <Style ss:ID="Currency"><NumberFormat ss:Format="$#,##0.00;[Red]($#,##0.00)"/></Style>
+  <Style ss:ID="Percent"><NumberFormat ss:Format="0.00%"/></Style>
+  <Style ss:ID="TotalLabel"><Font ss:Bold="1"/><Interior ss:Color="#F9FAFB" ss:Pattern="Solid"/></Style>
+  <Style ss:ID="TotalNumber"><Font ss:Bold="1"/><NumberFormat ss:Format="$#,##0.00;[Red]($#,##0.00)"/><Interior ss:Color="#F9FAFB" ss:Pattern="Solid"/></Style>
+</Styles>
+<Worksheet ss:Name="${escapeXml(worksheetName)}"><Table>
+${xmlRows}
+</Table></Worksheet></Workbook>`;
+}
+function downloadExcelXml(xml, filename) {
+  const blob = new Blob([xml], {
+    type: "application/vnd.ms-excel;charset=utf-8;"
+  });
+  const url = URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = `${filename}.xls`;
+  link.click();
+  URL.revokeObjectURL(url);
+}
+
+export { BALANCE_SHEET_CONFIG, DataTable, DataTableColumnFilter, DataTableColumnFilterContent, DataTableColumnHeader, DataTableContext, DataTableCurrencyCell, DataTableFilterBadges, FinanceDecimalsProvider, FinanceDisplayProvider, FinancialStatementTable, INCOME_STATEMENT_CONFIG, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, buildFinancialStatementData, buildSpreadsheetWorkbookXml, calculateDesktopFinancialColumnSizing, createFinancialStatementRowImportanceResolver, downloadExcelXml, excelColumnName, flattenStatementForExport, formatCurrencyValue, getFinancialStatementRowImportanceClassName, getUnitDivisor, getUnitLabel, getUnitSuffix, resolvePeriodColumns, useDataTableContext, useFinanceDecimals, useFinanceDecimalsSetting, useFinanceDisplay };