@12-apps/ui 6.11.0 → 6.11.1

package/dist/data-display/Table.js

@@ -1,904 +1,13 @@
-import "../chunk-PZ5AY32C.js";
-
-// src/components/data-display/Table/Table.tsx
-import MoreVertIcon from "@mui/icons-material/MoreVert";
+import "../chunk-WG2WFANT.js";
 import {
-  Box as Box3,
-  FormControlLabel,
-  IconButton,
-  Menu,
-  MenuItem,
-  Skeleton,
-  Switch,
-  Table as MuiTable,
-  TableBody as TableBody3,
-  TableCell as TableCell3,
-  TableContainer,
-  TableRow as TableRow3
-} from "@mui/material";
-import { styled } from "@mui/material";
-import React2 from "react";
-
-// src/components/data-display/Table/Table.helpers.ts
-var TABLE_DEFAULTS = {
-  variant: "default",
-  stripeColor: "neutral",
-  glow: false,
-  pulse: false,
-  hoverable: false,
-  loading: false,
-  density: "normal",
-  stickyHeader: false,
-  selectable: false,
-  selectedRows: [],
-  sortable: false,
-  virtualScrolling: false,
-  rowHeight: 52,
-  overscan: 5,
-  responsive: false,
-  showColumnToggle: true
-};
-var definedProps = (props) => Object.fromEntries(
-  Object.entries(props).filter(([, value]) => value !== void 0)
-);
-
-// src/components/data-display/Table/Table.hooks.ts
-import { useMediaQuery, useTheme } from "@mui/material";
-import { useCallback, useEffect, useMemo, useState } from "react";
-var useVirtualScrolling = (data, rowHeight, containerHeight, overscan = 5) => {
-  const [scrollTop, setScrollTop] = useState(0);
-  const visibleItems = useMemo(() => {
-    const visibleHeight = containerHeight;
-    const startIndex = Math.floor(scrollTop / rowHeight);
-    const endIndex = Math.min(
-      data.length,
-      Math.ceil((scrollTop + visibleHeight) / rowHeight)
-    );
-    const start = Math.max(0, startIndex - overscan);
-    const end = Math.min(data.length, endIndex + overscan);
-    return {
-      startIndex: start,
-      endIndex: end,
-      items: data.slice(start, end),
-      totalHeight: data.length * rowHeight,
-      offsetY: start * rowHeight
-    };
-  }, [data, rowHeight, containerHeight, scrollTop, overscan]);
-  const handleScroll = useCallback((e) => {
-    setScrollTop(e.currentTarget.scrollTop);
-  }, []);
-  return { visibleItems, handleScroll };
-};
-var useResponsive = (columns, columnPriorities) => {
-  const theme = useTheme();
-  const isMobile = useMediaQuery(theme.breakpoints.down("md"));
-  const isTablet = useMediaQuery(theme.breakpoints.down("lg"));
-  const [hiddenColumns, setHiddenColumns] = useState([]);
-  const [columnMenuAnchor, setColumnMenuAnchor] = useState(null);
-  useEffect(() => {
-    if (!columnPriorities) return;
-    let columnsToHide = [];
-    if (isMobile) {
-      columnsToHide = columnPriorities.map((priority, index) => ({ priority, index })).sort((a, b) => b.priority - a.priority).slice(0, Math.floor(columns.length / 2)).map((item) => item.index);
-    } else if (isTablet) {
-      columnsToHide = columnPriorities.map((priority, index) => ({ priority, index })).sort((a, b) => b.priority - a.priority).slice(0, Math.floor(columns.length / 3)).map((item) => item.index);
-    }
-    setHiddenColumns(columnsToHide);
-  }, [isMobile, isTablet, columnPriorities, columns.length]);
-  const visibleColumns = columns.filter((_, index) => !hiddenColumns.includes(index));
-  return {
-    visibleColumns,
-    hiddenColumns,
-    isMobile,
-    columnMenuAnchor,
-    setColumnMenuAnchor,
-    setHiddenColumns
-  };
-};
-var useTableSelection = ({
-  columns,
-  data,
-  responsive,
-  columnPriorities,
-  selectedRows,
-  rowKeyExtractor,
-  onSelectionChange
-}) => {
-  const {
-    visibleColumns,
-    hiddenColumns,
-    isMobile,
-    columnMenuAnchor,
-    setColumnMenuAnchor,
-    setHiddenColumns
-  } = useResponsive(
-    columns || [],
-    responsive ? columnPriorities : void 0
-  );
-  const handleSelectionChange = useCallback((rowKey, selected) => {
-    if (!onSelectionChange) return;
-    let newSelection;
-    if (selected) {
-      newSelection = [...selectedRows, rowKey];
-    } else {
-      newSelection = selectedRows.filter((key) => key !== rowKey);
-    }
-    onSelectionChange(newSelection);
-  }, [selectedRows, onSelectionChange]);
-  const handleSelectAll = useCallback((selected) => {
-    if (!onSelectionChange || !data) return;
-    if (selected) {
-      const allKeys = data.map(
-        (rowData, index) => rowKeyExtractor ? rowKeyExtractor(rowData, index) : rowData.id || index
-      );
-      onSelectionChange(allKeys);
-    } else {
-      onSelectionChange([]);
-    }
-  }, [data, onSelectionChange, rowKeyExtractor]);
-  return {
-    visibleColumns,
-    hiddenColumns,
-    isMobile,
-    columnMenuAnchor,
-    setColumnMenuAnchor,
-    setHiddenColumns,
-    handleSelectionChange,
-    handleSelectAll
-  };
-};
-
-// src/components/data-display/Table/TableParts.tsx
-import {
-  Box,
-  Checkbox,
-  TableBody,
-  TableCell,
-  TableHead,
-  TableRow,
-  TableSortLabel
-} from "@mui/material";
-import React, { useCallback as useCallback3 } from "react";
-
-// src/components/data-display/Table/TableParts.hooks.tsx
-import { useCallback as useCallback2 } from "react";
-import { jsx } from "react/jsx-runtime";
-var useRowKey = (rowKeyExtractor) => useCallback2(
-  (rowData, index) => rowKeyExtractor ? rowKeyExtractor(rowData, index) : rowData.id || index,
-  [rowKeyExtractor]
-);
-var useRowSelection = ({
-  selectedRows,
-  onSelectionChange
-}) => useCallback2(
-  (event, rowKey) => {
-    event.stopPropagation();
-    if (!onSelectionChange) return;
-    onSelectionChange(rowKey, !selectedRows.includes(rowKey));
-  },
-  [onSelectionChange, selectedRows]
-);
-var useTableRowRenderer = ({
-  columns,
-  selectedRows,
-  onRowClick,
-  onRowFocus,
-  onRowBlur,
-  onSelectionChange,
-  rowKeyExtractor,
-  selectable,
-  renderRow,
-  renderCell,
-  virtualScrolling,
-  rowHeight
-}) => {
-  const getRowKey = useRowKey(rowKeyExtractor);
-  const isRowSelected = useCallback2(
-    (rowKey) => selectedRows.includes(rowKey),
-    [selectedRows]
-  );
-  const handleRowSelection = useRowSelection({ selectedRows, onSelectionChange });
-  const renderTableRow = useCallback2(
-    (rowData, index, offsetY = 0) => {
-      const rowKey = getRowKey(rowData, index);
-      const selected = isRowSelected(rowKey);
-      if (renderRow) return renderRow(rowData, index, selected);
-      return /* @__PURE__ */ jsx(
-        TableDataRow,
-        {
-          rowData,
-          rowKey,
-          index,
-          offsetY,
-          columns,
-          selected,
-          selectable,
-          rowHeight,
-          onRowClick,
-          onRowFocus,
-          onRowBlur,
-          onSelect: handleRowSelection,
-          virtualScrolling,
-          renderCell
-        },
-        rowKey
-      );
-    },
-    [
-      columns,
-      getRowKey,
-      isRowSelected,
-      handleRowSelection,
-      onRowClick,
-      onRowFocus,
-      onRowBlur,
-      renderRow,
-      renderCell,
-      rowHeight,
-      selectable,
-      virtualScrolling
-    ]
-  );
-  return renderTableRow;
-};
-
-// src/components/data-display/Table/TableParts.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var ariaSortFor = (canSort, isSorted, direction) => {
-  if (!canSort || !isSorted) return void 0;
-  return direction === "asc" ? "ascending" : "descending";
-};
-var HeaderCell = ({ column, sortable, sortConfig, onSort }) => {
-  const canSort = Boolean(sortable) && column.sortable !== false;
-  const isSorted = sortConfig?.key === column.key;
-  return /* @__PURE__ */ jsx2(
-    TableCell,
-    {
-      align: column.align || "left",
-      style: { minWidth: column.minWidth, width: column.width },
-      "aria-sort": ariaSortFor(canSort, isSorted, sortConfig?.direction),
-      children: canSort ? /* @__PURE__ */ jsx2(
-        TableSortLabel,
-        {
-          active: isSorted,
-          direction: isSorted ? sortConfig?.direction : "asc",
-          onClick: () => onSort(column.key),
-          "data-testid": "sort-indicator",
-          "aria-label": `Sort by ${column.label}`,
-          children: column.label
-        }
-      ) : column.label
-    }
-  );
-};
-var EnhancedTableHeader = React.memo(({
-  columns,
-  data,
-  sortable,
-  sortConfig,
-  onSortChange,
-  selectable,
-  selectedRows = [],
-  onSelectAll
-}) => {
-  const handleSort = useCallback3(
-    (columnKey) => {
-      if (!sortable || !onSortChange) return;
-      const direction = sortConfig?.key === columnKey && sortConfig.direction === "asc" ? "desc" : "asc";
-      onSortChange(columnKey, direction);
-    },
-    [sortable, onSortChange, sortConfig]
-  );
-  const handleSelectAll = useCallback3(
-    (event) => {
-      if (!onSelectAll) return;
-      onSelectAll(event.target.checked);
-    },
-    [onSelectAll]
-  );
-  return /* @__PURE__ */ jsx2(TableHead, { children: /* @__PURE__ */ jsxs(TableRow, { children: [
-    selectable && /* @__PURE__ */ jsx2(TableCell, { padding: "checkbox", children: /* @__PURE__ */ jsx2(
-      Checkbox,
-      {
-        indeterminate: selectedRows.length > 0 && selectedRows.length < data.length,
-        checked: selectedRows.length === data.length && data.length > 0,
-        onChange: handleSelectAll,
-        inputProps: { "aria-label": "select all" }
-      }
-    ) }),
-    columns.map((column) => /* @__PURE__ */ jsx2(
-      HeaderCell,
-      {
-        column,
-        sortable,
-        sortConfig,
-        onSort: handleSort
-      },
-      column.key
-    ))
-  ] }) });
-});
-EnhancedTableHeader.displayName = "EnhancedTableHeader";
-var TableDataRow = ({
-  rowData,
-  rowKey,
-  index,
-  offsetY,
-  columns,
-  selected,
-  selectable,
-  rowHeight,
-  onRowClick,
-  onRowFocus,
-  onRowBlur,
-  onSelect,
-  virtualScrolling,
-  renderCell
-}) => /* @__PURE__ */ jsxs(
-  TableRow,
-  {
-    selected,
-    className: selected ? "selected" : "",
-    onClick: (event) => onRowClick?.(event, rowData),
-    onFocus: (event) => onRowFocus?.(event, rowData),
-    onBlur: (event) => onRowBlur?.(event, rowData),
-    style: virtualScrolling ? {
-      transform: `translateY(${offsetY}px)`,
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      height: rowHeight
-    } : void 0,
-    children: [
-      selectable && /* @__PURE__ */ jsx2(TableCell, { padding: "checkbox", children: /* @__PURE__ */ jsx2(
-        Checkbox,
-        {
-          checked: selected,
-          onChange: (event) => onSelect(event, rowKey),
-          onClick: (event) => event.stopPropagation(),
-          inputProps: { "aria-label": `select row ${index + 1}` }
-        }
-      ) }),
-      columns.map((column) => {
-        const value = rowData[column.key];
-        return /* @__PURE__ */ jsx2(TableCell, { align: column.align || "left", children: renderCell ? renderCell(value, column, rowData, index) : column.render ? column.render(value, rowData) : value }, column.key);
-      })
-    ]
-  },
-  String(rowKey)
-);
-var VirtualisedBody = ({ visibleItems, rowHeight, containerHeight, onScroll, renderTableRow }) => /* @__PURE__ */ jsx2(
-  Box,
-  {
-    onScroll,
-    style: {
-      height: containerHeight,
-      overflow: "auto",
-      position: "relative"
-    },
-    children: /* @__PURE__ */ jsx2(
-      TableBody,
-      {
-        style: {
-          height: visibleItems.totalHeight,
-          position: "relative"
-        },
-        children: visibleItems.items.map(
-          (rowData, index) => renderTableRow(rowData, visibleItems.startIndex + index, visibleItems.offsetY + index * rowHeight)
-        )
-      }
-    )
-  }
-);
-var PlainBody = ({ data, renderTableRow }) => /* @__PURE__ */ jsx2(TableBody, { children: data.map((rowData, index) => renderTableRow(rowData, index)) });
-var EnhancedTableBody = React.memo(({
-  data,
-  columns,
-  selectedRows = [],
-  onRowClick,
-  onRowFocus,
-  onRowBlur,
-  onSelectionChange,
-  rowKeyExtractor,
-  selectable,
-  renderRow,
-  renderCell,
-  virtualScrolling,
-  containerHeight,
-  rowHeight,
-  overscan = 5
-}) => {
-  const renderTableRow = useTableRowRenderer({
-    columns,
-    selectedRows,
-    onRowClick,
-    onRowFocus,
-    onRowBlur,
-    onSelectionChange,
-    rowKeyExtractor,
-    selectable,
-    renderRow,
-    renderCell,
-    virtualScrolling,
-    rowHeight
-  });
-  const { visibleItems, handleScroll } = useVirtualScrolling(
-    data,
-    rowHeight || 40,
-    typeof containerHeight === "number" ? containerHeight : 400,
-    overscan
-  );
-  if (virtualScrolling && containerHeight && rowHeight) {
-    return /* @__PURE__ */ jsx2(
-      VirtualisedBody,
-      {
-        visibleItems,
-        rowHeight,
-        containerHeight,
-        onScroll: handleScroll,
-        renderTableRow
-      }
-    );
-  }
-  return /* @__PURE__ */ jsx2(PlainBody, { data, renderTableRow });
-});
-EnhancedTableBody.displayName = "EnhancedTableBody";
-
-// src/components/data-display/Table/TableStates.tsx
-import { Box as Box2, TableBody as TableBody2, TableCell as TableCell2, TableRow as TableRow2 } from "@mui/material";
-import { jsx as jsx3 } from "react/jsx-runtime";
-var NoDataPlaceholder = ({ emptyText }) => /* @__PURE__ */ jsx3(Box2, { py: 4, color: "text.secondary", children: emptyText });
-var EmptyRow = ({
-  colSpan,
-  children
-}) => /* @__PURE__ */ jsx3(TableBody2, { children: /* @__PURE__ */ jsx3(TableRow2, { children: /* @__PURE__ */ jsx3(TableCell2, { colSpan, align: "center", children }) }) });
-
-// src/components/data-display/Table/Table.styles.ts
-import { alpha, keyframes } from "@mui/material";
-var pulseAnimation = keyframes`
-  0% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 1;
-  }
-  70% {
-    box-shadow: 0 0 0 10px currentColor;
-    opacity: 0;
-  }
-  100% {
-    box-shadow: 0 0 0 0 currentColor;
-    opacity: 0;
-  }
-`;
-var getDensityConfig = (density = "normal") => {
-  const configs = {
-    compact: {
-      rowHeight: 36,
-      cellPadding: "6px 12px",
-      fontSize: "0.8125rem",
-      headerPadding: "8px 12px"
-    },
-    normal: {
-      rowHeight: 52,
-      cellPadding: "12px 16px",
-      fontSize: "0.875rem",
-      headerPadding: "16px 16px"
-    },
-    comfortable: {
-      rowHeight: 68,
-      cellPadding: "18px 24px",
-      fontSize: "0.875rem",
-      headerPadding: "20px 24px"
-    }
-  };
-  return configs[density];
-};
-var getStripeColorFromTheme = (theme, stripeColor = "neutral") => {
-  const colorMap = {
-    primary: theme.palette.primary.main,
-    secondary: theme.palette.secondary.main,
-    info: theme.palette.info.main,
-    success: theme.palette.success.main,
-    warning: theme.palette.warning.main,
-    danger: theme.palette.error.main,
-    neutral: theme.palette.action.hover
-  };
-  return colorMap[stripeColor];
-};
-var stripeRowColor = (theme, stripeColor = "neutral") => {
-  const color = getStripeColorFromTheme(theme, stripeColor);
-  return stripeColor === "neutral" ? color : alpha(color, 0.15);
-};
-var TABLE_VARIANTS = {
-  default: ({ theme }) => ({
-    backgroundColor: theme.palette.background.paper,
-    "& .MuiTableHead-root": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.1)
-    }
-  }),
-  striped: ({ theme, stripeColor }) => ({
-    backgroundColor: theme.palette.background.paper,
-    "& .MuiTableBody-root .MuiTableRow-root:nth-of-type(even)": {
-      backgroundColor: stripeRowColor(theme, stripeColor)
-    }
-  }),
-  glass: ({ theme }) => ({
-    backgroundColor: alpha(theme.palette.background.paper, 0.1),
-    backdropFilter: "blur(20px)",
-    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`
-  }),
-  minimal: ({ theme }) => ({
-    backgroundColor: "transparent",
-    "& .MuiTableCell-root": {
-      borderBottom: `1px solid ${alpha(theme.palette.divider, 0.1)}`
-    }
-  }),
-  gradient: ({ theme }) => ({
-    background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.05)}, ${alpha(theme.palette.secondary.main, 0.05)})`,
-    border: `1px solid ${alpha(theme.palette.divider, 0.2)}`,
-    "& .MuiTableHead-root": {
-      background: `linear-gradient(135deg, ${alpha(theme.palette.primary.main, 0.15)}, ${alpha(theme.palette.secondary.main, 0.15)})`
-    },
-    "& .MuiTableCell-root": {
-      borderBottom: `1px solid ${alpha(theme.palette.divider, 0.15)}`
-    }
-  })
-};
-var tableVariantStyles = (args, customVariant) => customVariant ? TABLE_VARIANTS[customVariant]?.(args) ?? {} : {};
-var stickyHeaderStyles = (theme, densityConfig) => ({
-  "& .MuiTableHead-root": {
-    position: "sticky",
-    top: 0,
-    zIndex: 100,
-    backgroundColor: theme.palette.background.paper,
-    "& .MuiTableCell-root": {
-      borderBottom: `2px solid ${theme.palette.divider}`,
-      fontWeight: 600,
-      padding: densityConfig.headerPadding
-    }
-  }
-});
-var hoverableRowStyles = (theme) => ({
-  "& .MuiTableBody-root .MuiTableRow-root:hover": {
-    backgroundColor: alpha(theme.palette.primary.main, 0.08),
-    cursor: "pointer",
-    transition: "background-color 0.15s ease-in-out"
-  }
-});
-var emphasisStyles = (theme, glow, pulse) => {
-  if (glow && pulse) return {
-    position: "relative",
-    boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,
-    filter: "brightness(1.05)",
-    "&::after": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      borderRadius: "inherit",
-      backgroundColor: theme.palette.primary.main,
-      opacity: 0.1,
-      animation: `${pulseAnimation} 2s infinite`,
-      pointerEvents: "none",
-      zIndex: -1
-    }
-  };
-  if (glow) return {
-    boxShadow: `0 0 20px 5px ${alpha(theme.palette.primary.main, 0.3)} !important`,
-    filter: "brightness(1.05)"
-  };
-  if (pulse) return {
-    position: "relative",
-    "&::after": {
-      content: '""',
-      position: "absolute",
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      borderRadius: "inherit",
-      backgroundColor: theme.palette.primary.main,
-      opacity: 0.1,
-      animation: `${pulseAnimation} 2s infinite`,
-      pointerEvents: "none",
-      zIndex: -1
-    }
-  };
-  return {};
-};
-var tableStyles = ({
-  theme,
-  customVariant,
-  glow,
-  pulse,
-  hoverable,
-  density,
-  stickyHeader,
-  stripeColor = "neutral"
-}) => {
-  const densityConfig = getDensityConfig(density);
-  return {
-    borderRadius: theme.spacing(1),
-    overflow: "hidden",
-    transition: "all 0.3s ease",
-    position: "relative",
-    // Density styles
-    "& .MuiTableCell-root": {
-      padding: densityConfig.cellPadding,
-      fontSize: densityConfig.fontSize,
-      height: densityConfig.rowHeight
-    },
-    // Sticky header
-    ...tableVariantStyles({ theme, densityConfig, stripeColor }, customVariant),
-    ...stickyHeader ? stickyHeaderStyles(theme, densityConfig) : {},
-    ...hoverable ? hoverableRowStyles(theme) : {},
-    ...emphasisStyles(theme, glow, pulse),
-    // Variant styles
-    // Hoverable rows
-    // Selection styles
-    "& .MuiTableRow-root.selected": {
-      backgroundColor: alpha(theme.palette.primary.main, 0.12),
-      "&:hover": {
-        backgroundColor: alpha(theme.palette.primary.main, 0.16)
-      }
-    }
-    // Glow effect
-    // Pulse animation
-    // Both glow and pulse
-  };
-};
-
-// src/components/data-display/Table/Table.tsx
-import { Fragment, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
-var StyledTableContainer = styled(TableContainer, {
-  shouldForwardProp: (prop) => !["virtualScrolling", "containerHeight"].includes(prop)
-})(({ virtualScrolling, containerHeight }) => ({
-  ...virtualScrolling && {
-    height: containerHeight || 400,
-    overflow: "auto"
-  }
-}));
-var StyledTable = styled(MuiTable, {
-  shouldForwardProp: (prop) => !["customVariant", "glow", "pulse", "hoverable", "density", "stickyHeader", "stripeColor"].includes(prop)
-})(({ theme, customVariant, glow, pulse, hoverable, density, stickyHeader, stripeColor = "neutral" }) => {
-  return tableStyles({
-    theme,
-    customVariant,
-    glow,
-    pulse,
-    hoverable,
-    density,
-    stickyHeader,
-    stripeColor
-  });
-});
-var TableShell = ({
-  innerRef,
-  variant,
-  stripeColor,
-  glow,
-  pulse,
-  hoverable,
-  density,
-  stickyHeader,
-  header,
-  rest,
-  children
-}) => /* @__PURE__ */ jsx4(StyledTableContainer, { children: /* @__PURE__ */ jsxs2(
-  StyledTable,
-  {
-    ref: innerRef,
-    customVariant: variant,
-    stripeColor,
-    glow,
-    pulse,
-    hoverable,
-    density,
-    stickyHeader,
-    ...rest,
-    children: [
-      header,
-      children
-    ]
-  }
-) });
-var SKELETON_ROW_COUNT = 5;
-var LoadingSkeletonRows = ({ columns }) => /* @__PURE__ */ jsx4(Fragment, { children: Array.from({ length: SKELETON_ROW_COUNT }, (_, index) => /* @__PURE__ */ jsx4(TableRow3, { children: columns?.map((column) => /* @__PURE__ */ jsx4(TableCell3, { children: /* @__PURE__ */ jsx4(Skeleton, { height: 20 }) }, column.key)) }, index)) });
-var ColumnToggleMenu = ({ columns, hiddenColumns, anchor, setAnchor, setHiddenColumns }) => /* @__PURE__ */ jsxs2(Box3, { position: "absolute", top: 8, right: 8, children: [
-  /* @__PURE__ */ jsx4(IconButton, { onClick: (event) => setAnchor(event.currentTarget), size: "small", children: /* @__PURE__ */ jsx4(MoreVertIcon, {}) }),
-  /* @__PURE__ */ jsx4(Menu, { anchorEl: anchor, open: Boolean(anchor), onClose: () => setAnchor(null), children: columns.map((column, index) => /* @__PURE__ */ jsx4(MenuItem, { children: /* @__PURE__ */ jsx4(
-    FormControlLabel,
-    {
-      control: /* @__PURE__ */ jsx4(
-        Switch,
-        {
-          checked: !hiddenColumns.includes(index),
-          onChange: (event) => setHiddenColumns(
-            event.target.checked ? hiddenColumns.filter((i) => i !== index) : [...hiddenColumns, index]
-          ),
-          size: "small"
-        }
-      ),
-      label: column.label
-    }
-  ) }, column.key)) })
-] });
-var columnsFor = (resolved, selection) => (resolved.responsive ? selection.visibleColumns : resolved.columns) ?? [];
-var showsColumnToggle = (resolved, selection) => Boolean(
-  resolved.responsive && selection.isMobile && resolved.showColumnToggle && selection.hiddenColumns.length > 0
-);
-var AdvancedTable = ({ resolved: p, selection, innerRef, rest }) => {
-  const finalColumns = columnsFor(p, selection);
-  const showToggle = showsColumnToggle(p, selection);
-  return /* @__PURE__ */ jsxs2(Box3, { position: "relative", children: [
-    /* @__PURE__ */ jsx4(
-      StyledTableContainer,
-      {
-        virtualScrolling: p.virtualScrolling,
-        containerHeight: p.containerHeight,
-        children: /* @__PURE__ */ jsxs2(
-          StyledTable,
-          {
-            ref: innerRef,
-            customVariant: p.variant,
-            stripeColor: p.stripeColor,
-            glow: p.glow,
-            pulse: p.pulse,
-            hoverable: p.hoverable,
-            density: p.density,
-            stickyHeader: p.stickyHeader,
-            ...rest,
-            children: [
-              /* @__PURE__ */ jsx4(
-                EnhancedTableHeader,
-                {
-                  columns: finalColumns,
-                  data: p.data ?? [],
-                  sortable: p.sortable,
-                  sortConfig: p.sortConfig,
-                  onSortChange: p.onSortChange,
-                  selectable: p.selectable,
-                  selectedRows: p.selectedRows,
-                  onSelectAll: selection.handleSelectAll,
-                  density: p.density,
-                  stickyHeader: p.stickyHeader
-                }
-              ),
-              /* @__PURE__ */ jsx4(
-                EnhancedTableBody,
-                {
-                  data: p.data ?? [],
-                  columns: finalColumns,
-                  selectedRows: p.selectedRows,
-                  onRowClick: p.onRowClick,
-                  onRowFocus: p.onRowFocus,
-                  onRowBlur: p.onRowBlur,
-                  onSelectionChange: selection.handleSelectionChange,
-                  rowKeyExtractor: p.rowKeyExtractor,
-                  density: p.density,
-                  selectable: p.selectable,
-                  hoverable: p.hoverable,
-                  renderRow: p.renderRow,
-                  renderCell: p.renderCell,
-                  virtualScrolling: p.virtualScrolling,
-                  containerHeight: typeof p.containerHeight === "number" ? p.containerHeight : void 0,
-                  rowHeight: p.rowHeight,
-                  overscan: p.overscan
-                }
-              )
-            ]
-          }
-        )
-      }
-    ),
-    showToggle && /* @__PURE__ */ jsx4(
-      ColumnToggleMenu,
-      {
-        columns: p.columns ?? [],
-        hiddenColumns: selection.hiddenColumns,
-        anchor: selection.columnMenuAnchor,
-        setAnchor: selection.setColumnMenuAnchor,
-        setHiddenColumns: selection.setHiddenColumns
-      }
-    )
-  ] });
-};
-var buildShell = ({
-  resolved,
-  selection,
-  innerRef,
-  rest,
-  finalColumns
-}) => ({
-  innerRef,
-  variant: resolved.variant,
-  stripeColor: resolved.stripeColor,
-  glow: resolved.glow,
-  pulse: resolved.pulse,
-  hoverable: resolved.hoverable,
-  density: resolved.density,
-  stickyHeader: resolved.stickyHeader,
-  header: resolved.columns ? /* @__PURE__ */ jsx4(
-    EnhancedTableHeader,
-    {
-      columns: finalColumns ?? [],
-      data: [],
-      sortable: resolved.sortable,
-      sortConfig: resolved.sortConfig,
-      onSortChange: resolved.onSortChange,
-      selectable: resolved.selectable,
-      selectedRows: resolved.selectedRows,
-      onSelectAll: selection.handleSelectAll,
-      density: resolved.density,
-      stickyHeader: resolved.stickyHeader
-    }
-  ) : null,
-  rest
-});
-var TableLoadingState = ({ shell, loadingComponent, columns }) => /* @__PURE__ */ jsx4(TableShell, { ...shell, children: /* @__PURE__ */ jsx4(TableBody3, { "data-testid": "table-loading", children: loadingComponent || /* @__PURE__ */ jsx4(LoadingSkeletonRows, { columns }) }) });
-var TableEmptyState = ({ shell, emptyStateComponent, emptyText, colSpan }) => /* @__PURE__ */ jsx4(TableShell, { ...shell, children: /* @__PURE__ */ jsx4(EmptyRow, { colSpan, children: emptyStateComponent || /* @__PURE__ */ jsx4(NoDataPlaceholder, { emptyText }) }) });
-var Table = React2.forwardRef(
-  (tableProps, ref) => {
-    const resolved = { ...TABLE_DEFAULTS, ...definedProps(tableProps) };
-    const {
-      columns,
-      data,
-      responsive,
-      loading,
-      loadingComponent,
-      emptyStateComponent,
-      emptyText,
-      children,
-      ...props
-    } = resolved;
-    const selection = useTableSelection({
-      columns,
-      data,
-      responsive,
-      columnPriorities: resolved.columnPriorities,
-      selectedRows: resolved.selectedRows ?? [],
-      rowKeyExtractor: resolved.rowKeyExtractor,
-      onSelectionChange: resolved.onSelectionChange
-    });
-    const rest = props;
-    const renderer = { resolved, selection, innerRef: ref, rest };
-    const finalColumns = responsive ? selection.visibleColumns : columns;
-    const shell = buildShell({ ...renderer, finalColumns });
-    if (loading) {
-      return /* @__PURE__ */ jsx4(TableLoadingState, { shell, loadingComponent, columns });
-    }
-    if (data && data.length === 0) {
-      return /* @__PURE__ */ jsx4(
-        TableEmptyState,
-        {
-          shell,
-          emptyStateComponent,
-          emptyText,
-          colSpan: finalColumns?.length || 1
-        }
-      );
-    }
-    if (columns && data) return /* @__PURE__ */ jsx4(AdvancedTable, { ...renderer });
-    return /* @__PURE__ */ jsx4(
-      StyledTable,
-      {
-        ref,
-        customVariant: resolved.variant,
-        stripeColor: resolved.stripeColor,
-        glow: resolved.glow,
-        pulse: resolved.pulse,
-        hoverable: resolved.hoverable,
-        density: resolved.density,
-        stickyHeader: resolved.stickyHeader,
-        ...rest,
-        children
-      }
-    );
-  }
-);
-Table.displayName = "Table";
+  Table
+} from "../chunk-YWFTXJI3.js";
+import "../chunk-MTFCPPZ5.js";
+import "../chunk-FJQ6YFDQ.js";
+import "../chunk-Q72ZRUOB.js";
+import "../chunk-4HD5I7QO.js";
+import "../chunk-UUXNFPCP.js";
+import "../chunk-PZ5AY32C.js";
 export {
   Table
 };