@tidbcloud/uikit 2.0.0-beta.3

package/dist/node_modules/.pnpm/mantine-react-table@0.9.5_@emotion_react@11.11.0_@mantine_core@5.10.4_@mantine_dates@5.10.4_@_wgj3awrrave5mmlv3z2e7ky62q/node_modules/mantine-react-table/dist/esm/mantine-react-table.esm.js

@@ -0,0 +1,2644 @@
+import React__default, { useMemo, Fragment, useState, useEffect, memo, useRef, useCallback, useLayoutEffect } from "react";
+import { useReactTable } from "../../../../../@tanstack_react-table@8.7.9_react-dom@18.2.0_react@18.2.0/node_modules/@tanstack/react-table/build/lib/index.js";
+import { rankItem, compareItems, rankings } from "../../../../../@tanstack_match-sorter-utils@8.7.6/node_modules/@tanstack/match-sorter-utils/build/lib/index.js";
+import { IconArrowAutofitContent, IconArrowDown, IconArrowsSort, IconBoxMultiple, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconChevronsDown, IconCircleOff, IconCircleX, IconClearAll, IconColumns, IconDeviceFloppy, IconDots, IconDotsVertical, IconEdit, IconEyeOff, IconFilter, IconFilterOff, IconGripHorizontal, IconMaximize, IconMinimize, IconPinned, IconPinnedOff, IconSearch, IconSortAscending, IconSortDescending, IconTallymark1, IconTallymark2, IconTallymark3, IconTallymark4, IconTallymarks, IconX } from "@tabler/icons-react";
+import { useVirtualizer } from "../../../../../@tanstack_react-virtual@3.0.0-beta.47_react@18.2.0/node_modules/@tanstack/react-virtual/build/lib/index.js";
+import highlightWords from "../../../../../highlight-words@1.2.1/node_modules/highlight-words/dist/highlight-words.js";
+import { aggregationFns, filterFns, sortingFns, getCoreRowModel, getExpandedRowModel, getFacetedRowModel, getFilteredRowModel, getGroupedRowModel, getPaginationRowModel, getSortedRowModel } from "../../../../../@tanstack_table-core@8.7.9/node_modules/@tanstack/table-core/build/lib/index.js";
+import { Tooltip } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Tooltip/Tooltip.js";
+import { ActionIcon } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/ActionIcon/ActionIcon.js";
+import { Menu } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Menu/Menu.js";
+import { Flex } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Flex/Flex.js";
+import { useDebouncedValue } from "../../../../../@mantine_hooks@5.10.4_react@18.2.0/node_modules/@mantine/hooks/esm/use-debounced-value/use-debounced-value.js";
+import { Collapse } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Collapse/Collapse.js";
+import { TextInput } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/TextInput/TextInput.js";
+import { Progress } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Progress/Progress.js";
+import { Select } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Select/Select.js";
+import { Text } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Text/Text.js";
+import { Chip } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Chip/Chip.js";
+import { Alert } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Alert/Alert.js";
+import { Box } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Box/Box.js";
+import { Transition } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Transition/Transition.js";
+import { useMediaQuery } from "../../../../../@mantine_hooks@5.10.4_react@18.2.0/node_modules/@mantine/hooks/esm/use-media-query/use-media-query.js";
+import { CopyButton } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/CopyButton/CopyButton.js";
+import { UnstyledButton } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/UnstyledButton/UnstyledButton.js";
+import { Button } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Button/Button.js";
+import { Divider } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Divider/Divider.js";
+import { Skeleton } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Skeleton/Skeleton.js";
+import { Modal } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Modal/Modal.js";
+import { Radio } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Radio/Radio.js";
+import { Checkbox } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Checkbox/Checkbox.js";
+import { Switch } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Switch/Switch.js";
+import { Paper } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Paper/Paper.js";
+import { Stack } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Stack/Stack.js";
+import { defaultRangeExtractor } from "../../../../../@tanstack_virtual-core@3.0.0-beta.47/node_modules/@tanstack/virtual-core/build/lib/index.js";
+import { Table } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/Table/Table.js";
+import { MultiSelect } from "../../../../../@mantine_core@5.10.4_patch_hash_k3wzpm5n4esvq7igbvcsgyfoja_@emotion_react@11.11.0_@mantine_ho_pge4mijgvpte4ejkiygju76xvm/node_modules/@mantine/core/esm/MultiSelect/MultiSelect.js";
+import { packSx } from "../../../../../@mantine_utils@5.10.4_react@18.2.0/node_modules/@mantine/utils/esm/pack-sx/pack-sx.js";
+import { useMantineTheme } from "../../../../../@mantine_styles@5.10.4_@emotion_react@11.11.0_react-dom@18.2.0_react@18.2.0/node_modules/@mantine/styles/esm/theme/MantineProvider.js";
+function __rest(s, e) {
+  var t = {};
+  for (var p in s)
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+      t[p] = s[p];
+  if (s != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+      if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+        t[p[i]] = s[p[i]];
+    }
+  return t;
+}
+const MRT_AggregationFns = Object.assign({}, aggregationFns);
+const getColumnId = (columnDef) => {
+  var _a, _b, _c, _d;
+  return (_d = (_a = columnDef.id) !== null && _a !== void 0 ? _a : (_c = (_b = columnDef.accessorKey) === null || _b === void 0 ? void 0 : _b.toString) === null || _c === void 0 ? void 0 : _c.call(_b)) !== null && _d !== void 0 ? _d : columnDef.header;
+};
+const getAllLeafColumnDefs = (columns) => {
+  const allLeafColumnDefs = [];
+  const getLeafColumns = (cols) => {
+    cols.forEach((col) => {
+      if (col.columns) {
+        getLeafColumns(col.columns);
+      } else {
+        allLeafColumnDefs.push(col);
+      }
+    });
+  };
+  getLeafColumns(columns);
+  return allLeafColumnDefs;
+};
+const prepareColumns = ({ aggregationFns: aggregationFns2, columnDefs, columnFilterFns, defaultDisplayColumn, filterFns: filterFns2, sortingFns: sortingFns2 }) => columnDefs.map((columnDef) => {
+  var _a, _b;
+  if (!columnDef.id)
+    columnDef.id = getColumnId(columnDef);
+  if (process.env.NODE_ENV !== "production" && !columnDef.id) {
+    console.error("Column definitions must have a valid `accessorKey` or `id` property");
+  }
+  if (!columnDef.columnDefType)
+    columnDef.columnDefType = "data";
+  if ((_a = columnDef.columns) === null || _a === void 0 ? void 0 : _a.length) {
+    columnDef.columnDefType = "group";
+    columnDef.columns = prepareColumns({
+      aggregationFns: aggregationFns2,
+      columnDefs: columnDef.columns,
+      columnFilterFns,
+      defaultDisplayColumn,
+      filterFns: filterFns2,
+      sortingFns: sortingFns2
+    });
+  } else if (columnDef.columnDefType === "data") {
+    if (Array.isArray(columnDef.aggregationFn)) {
+      const aggFns = columnDef.aggregationFn;
+      columnDef.aggregationFn = (columnId, leafRows, childRows) => aggFns.map((fn) => {
+        var _a2;
+        return (_a2 = aggregationFns2[fn]) === null || _a2 === void 0 ? void 0 : _a2.call(aggregationFns2, columnId, leafRows, childRows);
+      });
+    }
+    if (Object.keys(filterFns2).includes(columnFilterFns[columnDef.id])) {
+      columnDef.filterFn = (_b = filterFns2[columnFilterFns[columnDef.id]]) !== null && _b !== void 0 ? _b : filterFns2.fuzzy;
+      columnDef._filterFn = columnFilterFns[columnDef.id];
+    }
+    if (Object.keys(sortingFns2).includes(columnDef.sortingFn)) {
+      columnDef.sortingFn = sortingFns2[columnDef.sortingFn];
+    }
+  } else if (columnDef.columnDefType === "display") {
+    columnDef = Object.assign(Object.assign({}, defaultDisplayColumn), columnDef);
+  }
+  return columnDef;
+});
+const reorderColumn = (draggedColumn, targetColumn, columnOrder) => {
+  if (draggedColumn.getCanPin()) {
+    draggedColumn.pin(targetColumn.getIsPinned());
+  }
+  columnOrder.splice(columnOrder.indexOf(targetColumn.id), 0, columnOrder.splice(columnOrder.indexOf(draggedColumn.id), 1)[0]);
+  return [...columnOrder];
+};
+const showExpandColumn = (props, grouping) => !!(props.enableExpanding || props.enableGrouping && (grouping === void 0 || (grouping === null || grouping === void 0 ? void 0 : grouping.length)) || props.renderDetailPanel);
+const getLeadingDisplayColumnIds = (props) => {
+  var _a;
+  return [
+    (props.enableRowDragging || props.enableRowOrdering) && "mrt-row-drag",
+    props.positionActionsColumn === "first" && (props.enableRowActions || props.enableEditing && ["row", "modal"].includes((_a = props.editingMode) !== null && _a !== void 0 ? _a : "")) && "mrt-row-actions",
+    props.positionExpandColumn === "first" && showExpandColumn(props) && "mrt-row-expand",
+    props.enableRowSelection && "mrt-row-select",
+    props.enableRowNumbers && "mrt-row-numbers"
+  ].filter(Boolean);
+};
+const getTrailingDisplayColumnIds = (props) => {
+  var _a;
+  return [
+    props.positionActionsColumn === "last" && (props.enableRowActions || props.enableEditing && ["row", "modal"].includes((_a = props.editingMode) !== null && _a !== void 0 ? _a : "")) && "mrt-row-actions",
+    props.positionExpandColumn === "last" && showExpandColumn(props) && "mrt-row-expand"
+  ];
+};
+const getDefaultColumnOrderIds = (props) => [
+  ...getLeadingDisplayColumnIds(props),
+  ...getAllLeafColumnDefs(props.columns).map((columnDef) => getColumnId(columnDef)),
+  ...getTrailingDisplayColumnIds(props)
+].filter(Boolean);
+const getDefaultColumnFilterFn = (columnDef) => {
+  if (columnDef.filterVariant === "multi-select")
+    return "arrIncludesSome";
+  if (columnDef.filterVariant === "range")
+    return "betweenInclusive";
+  if (columnDef.filterVariant === "select" || columnDef.filterVariant === "checkbox")
+    return "equals";
+  return "fuzzy";
+};
+const getIsFirstColumn = (column, table) => {
+  return table.getVisibleLeafColumns()[0].id === column.id;
+};
+const getIsLastColumn = (column, table) => {
+  const columns = table.getVisibleLeafColumns();
+  return columns[columns.length - 1].id === column.id;
+};
+const getIsLastLeftPinnedColumn = (table, column) => {
+  return column.getIsPinned() === "left" && table.getLeftLeafHeaders().length - 1 === column.getPinnedIndex();
+};
+const getIsFirstRightPinnedColumn = (column) => {
+  return column.getIsPinned() === "right" && column.getPinnedIndex() === 0;
+};
+const getTotalRight = (table, column) => {
+  return (table.getRightLeafHeaders().length - 1 - column.getPinnedIndex()) * 200;
+};
+const getCommonCellStyles = ({ column, header, table, tableCellProps, theme }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+  return Object.assign(Object.assign({ backgroundColor: column.getIsPinned() && column.columnDef.columnDefType !== "group" ? theme.fn.rgba(theme.colorScheme === "dark" ? theme.fn.darken(theme.colors.dark[7], 0.02) : theme.white, 0.97) : "inherit", backgroundClip: "padding-box", boxShadow: getIsLastLeftPinnedColumn(table, column) ? `-4px 0 8px -6px ${theme.fn.rgba(theme.black, 0.2)} inset` : getIsFirstRightPinnedColumn(column) ? `4px 0 8px -6px ${theme.fn.rgba(theme.black, 0.2)} inset` : void 0, display: table.options.layoutMode === "grid" ? "flex" : "table-cell", flex: table.options.layoutMode === "grid" ? `var(--${header ? "header" : "col"}-${parseCSSVarId((_a = header === null || header === void 0 ? void 0 : header.id) !== null && _a !== void 0 ? _a : column.id)}-size) 0 auto` : void 0, left: column.getIsPinned() === "left" ? `${column.getStart("left")}px` : void 0, ml: table.options.enableColumnVirtualization && column.getIsPinned() === "left" && column.getPinnedIndex() === 0 ? `-${column.getSize() * ((_c = (_b = table.getState().columnPinning.left) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : 1)}px` : void 0, mr: table.options.enableColumnVirtualization && column.getIsPinned() === "right" && column.getPinnedIndex() === table.getVisibleLeafColumns().length - 1 ? `-${column.getSize() * ((_e = (_d = table.getState().columnPinning.right) === null || _d === void 0 ? void 0 : _d.length) !== null && _e !== void 0 ? _e : 1) * 1.2}px` : void 0, opacity: ((_f = table.getState().draggingColumn) === null || _f === void 0 ? void 0 : _f.id) === column.id || ((_g = table.getState().hoveredColumn) === null || _g === void 0 ? void 0 : _g.id) === column.id ? 0.5 : 1, position: column.getIsPinned() && column.columnDef.columnDefType !== "group" ? "sticky" : void 0, right: column.getIsPinned() === "right" ? `${getTotalRight(table, column)}px` : void 0, transition: table.options.enableColumnVirtualization ? "none" : `padding 100ms ease-in-out` }, (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx) instanceof Function ? tableCellProps.sx(theme) : tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx), { minWidth: `max(calc(var(--${header ? "header" : "col"}-${parseCSSVarId((_h = header === null || header === void 0 ? void 0 : header.id) !== null && _h !== void 0 ? _h : column.id)}-size) * 1px), ${(_j = column.columnDef.minSize) !== null && _j !== void 0 ? _j : 30}px)`, width: `calc(var(--${header ? "header" : "col"}-${parseCSSVarId((_k = header === null || header === void 0 ? void 0 : header.id) !== null && _k !== void 0 ? _k : column.id)}-size) * 1px)` });
+};
+const MRT_DefaultColumn = {
+  filterVariant: "text",
+  minSize: 40,
+  maxSize: 1e3,
+  size: 180
+};
+const MRT_DefaultDisplayColumn = {
+  columnDefType: "display",
+  enableClickToCopy: false,
+  enableColumnActions: false,
+  enableColumnDragging: false,
+  enableColumnFilter: false,
+  enableColumnOrdering: false,
+  enableEditing: false,
+  enableGlobalFilter: false,
+  enableGrouping: false,
+  enableHiding: false,
+  enableResizing: false,
+  enableSorting: false
+};
+const getPrimaryShade = (theme) => {
+  var _a, _b, _c, _d, _e;
+  return (_e = theme.colorScheme === "dark" ? (
+    // @ts-ignore
+    (_b = (_a = theme.primaryShade) === null || _a === void 0 ? void 0 : _a.dark) !== null && _b !== void 0 ? _b : theme.primaryShade
+  ) : (
+    // @ts-ignore
+    (_d = (_c = theme.primaryShade) === null || _c === void 0 ? void 0 : _c.light) !== null && _d !== void 0 ? _d : theme.primaryShade
+  )) !== null && _e !== void 0 ? _e : 7;
+};
+const getPrimaryColor = (theme, shade) => theme.colors[theme.primaryColor][shade !== null && shade !== void 0 ? shade : getPrimaryShade(theme)];
+const parseCSSVarId = (id) => id.replace(/[^a-zA-Z0-9]/g, "_");
+const fuzzy$1 = (row, columnId, filterValue, addMeta) => {
+  const itemRank = rankItem(row.getValue(columnId), filterValue, {
+    threshold: rankings.MATCHES
+  });
+  addMeta(itemRank);
+  return itemRank.passed;
+};
+fuzzy$1.autoRemove = (val) => !val;
+const contains = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim().includes(filterValue.toString().toLowerCase().trim());
+contains.autoRemove = (val) => !val;
+const startsWith = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim().startsWith(filterValue.toString().toLowerCase().trim());
+startsWith.autoRemove = (val) => !val;
+const endsWith = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim().endsWith(filterValue.toString().toLowerCase().trim());
+endsWith.autoRemove = (val) => !val;
+const equals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() === filterValue.toString().toLowerCase().trim();
+equals.autoRemove = (val) => !val;
+const notEquals = (row, id, filterValue) => row.getValue(id).toString().toLowerCase().trim() !== filterValue.toString().toLowerCase().trim();
+notEquals.autoRemove = (val) => !val;
+const greaterThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id)) ? +row.getValue(id) > +filterValue : row.getValue(id).toString().toLowerCase().trim() > filterValue.toString().toLowerCase().trim();
+greaterThan.autoRemove = (val) => !val;
+const greaterThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || greaterThan(row, id, filterValue);
+greaterThanOrEqualTo.autoRemove = (val) => !val;
+const lessThan = (row, id, filterValue) => !isNaN(+filterValue) && !isNaN(+row.getValue(id)) ? +row.getValue(id) < +filterValue : row.getValue(id).toString().toLowerCase().trim() < filterValue.toString().toLowerCase().trim();
+lessThan.autoRemove = (val) => !val;
+const lessThanOrEqualTo = (row, id, filterValue) => equals(row, id, filterValue) || lessThan(row, id, filterValue);
+lessThanOrEqualTo.autoRemove = (val) => !val;
+const between = (row, id, filterValues) => (["", void 0].includes(filterValues[0]) || greaterThan(row, id, filterValues[0])) && (!isNaN(+filterValues[0]) && !isNaN(+filterValues[1]) && +filterValues[0] > +filterValues[1] || ["", void 0].includes(filterValues[1]) || lessThan(row, id, filterValues[1]));
+between.autoRemove = (val) => !val;
+const betweenInclusive = (row, id, filterValues) => (["", void 0].includes(filterValues[0]) || greaterThanOrEqualTo(row, id, filterValues[0])) && (!isNaN(+filterValues[0]) && !isNaN(+filterValues[1]) && +filterValues[0] > +filterValues[1] || ["", void 0].includes(filterValues[1]) || lessThanOrEqualTo(row, id, filterValues[1]));
+betweenInclusive.autoRemove = (val) => !val;
+const empty = (row, id, _filterValue) => !row.getValue(id).toString().trim();
+empty.autoRemove = (val) => !val;
+const notEmpty = (row, id, _filterValue) => !!row.getValue(id).toString().trim();
+notEmpty.autoRemove = (val) => !val;
+const MRT_FilterFns = Object.assign(Object.assign({}, filterFns), {
+  between,
+  betweenInclusive,
+  contains,
+  empty,
+  endsWith,
+  equals,
+  fuzzy: fuzzy$1,
+  greaterThan,
+  greaterThanOrEqualTo,
+  lessThan,
+  lessThanOrEqualTo,
+  notEmpty,
+  notEquals,
+  startsWith
+});
+const MRT_Default_Icons = {
+  IconArrowAutofitContent,
+  IconArrowDown,
+  IconArrowsSort,
+  IconBoxMultiple,
+  IconChevronDown,
+  IconChevronLeft,
+  IconChevronRight,
+  IconChevronUp,
+  IconChevronsDown,
+  IconCircleOff,
+  IconCircleX,
+  IconClearAll,
+  IconColumns,
+  IconDeviceFloppy,
+  IconDots,
+  IconDotsVertical,
+  IconEdit,
+  IconEyeOff,
+  IconFilter,
+  IconFilterOff,
+  IconGripHorizontal,
+  IconMaximize,
+  IconMinimize,
+  IconPinned,
+  IconPinnedOff,
+  IconSearch,
+  IconSortAscending,
+  IconSortDescending,
+  IconTallymark1,
+  IconTallymark2,
+  IconTallymark3,
+  IconTallymark4,
+  IconTallymarks,
+  IconX
+};
+const fuzzy = (rowA, rowB, columnId) => {
+  let dir = 0;
+  if (rowA.columnFiltersMeta[columnId]) {
+    dir = compareItems(rowA.columnFiltersMeta[columnId], rowB.columnFiltersMeta[columnId]);
+  }
+  return dir === 0 ? sortingFns.alphanumeric(rowA, rowB, columnId) : dir;
+};
+const MRT_SortingFns = Object.assign(Object.assign({}, sortingFns), { fuzzy });
+const rankGlobalFuzzy = (rowA, rowB) => Math.max(...Object.values(rowB.columnFiltersMeta).map((v) => v.rank)) - Math.max(...Object.values(rowA.columnFiltersMeta).map((v) => v.rank));
+const MRT_ExpandAllButton = ({ table }) => {
+  var _a, _b;
+  const { getIsAllRowsExpanded, getIsSomeRowsExpanded, getCanSomeRowsExpand, getState, options: { icons: { IconChevronsDown: IconChevronsDown2 }, localization, mantineExpandAllButtonProps, renderDetailPanel }, toggleAllRowsExpanded } = table;
+  const { density, isLoading } = getState();
+  const actionIconProps = mantineExpandAllButtonProps instanceof Function ? mantineExpandAllButtonProps({ table }) : mantineExpandAllButtonProps;
+  const isAllRowsExpanded = getIsAllRowsExpanded();
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, openDelay: 1e3, label: ((_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.title) !== null && _a !== void 0 ? _a : isAllRowsExpanded) ? localization.collapseAll : localization.expandAll },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": localization.expandAll, disabled: isLoading || !renderDetailPanel && !getCanSomeRowsExpand(), onClick: () => toggleAllRowsExpanded(!isAllRowsExpanded) }, actionIconProps, { sx: (theme) => Object.assign({ marginLeft: density === "xl" ? "-6px" : density === "lg" ? "-3px" : density === "md" ? "0" : density === "sm" ? "3px" : "6px", "&:disabled": {
+      backgroundColor: "transparent",
+      border: "none"
+    } }, (actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx) instanceof Function ? actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx(theme) : actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx), title: void 0 }), (_b = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.children) !== null && _b !== void 0 ? _b : React__default.createElement(IconChevronsDown2, { style: {
+      transform: `rotate(${isAllRowsExpanded ? -180 : getIsSomeRowsExpanded() ? -90 : 0}deg)`,
+      transition: "transform 100ms"
+    } }))
+  );
+};
+const MRT_ExpandButton = ({ row, table }) => {
+  var _a, _b;
+  const { options: { icons: { IconChevronDown: IconChevronDown2 }, localization, mantineExpandButtonProps, renderDetailPanel } } = table;
+  const actionIconProps = mantineExpandButtonProps instanceof Function ? mantineExpandButtonProps({ table, row }) : mantineExpandButtonProps;
+  const canExpand = row.getCanExpand();
+  const isExpanded = row.getIsExpanded();
+  const handleToggleExpand = (event) => {
+    var _a2;
+    event.stopPropagation();
+    row.toggleExpanded();
+    (_a2 = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onClick) === null || _a2 === void 0 ? void 0 : _a2.call(actionIconProps, event);
+  };
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, disabled: !canExpand && !renderDetailPanel, openDelay: 1e3, label: ((_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.title) !== null && _a !== void 0 ? _a : isExpanded) ? localization.collapse : localization.expand },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": localization.expand, disabled: !canExpand && !renderDetailPanel }, actionIconProps, { onClick: handleToggleExpand, sx: (theme) => Object.assign({ "&:disabled": {
+      backgroundColor: "transparent",
+      border: "none"
+    } }, (actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx) instanceof Function ? actionIconProps.sx(theme) : actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx), title: void 0 }), (_b = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.children) !== null && _b !== void 0 ? _b : React__default.createElement(IconChevronDown2, { style: {
+      transform: `rotate(${!canExpand && !renderDetailPanel ? -90 : isExpanded ? -180 : 0}deg)`,
+      transition: "transform 100ms"
+    } }))
+  );
+};
+const MRT_RowActionMenu = ({ handleEdit, row, table }) => {
+  const { options: { icons: { IconEdit: IconEdit2, IconDots: IconDots2 }, enableEditing, localization, renderRowActionMenuItems } } = table;
+  return React__default.createElement(
+    Menu,
+    { closeOnItemClick: true },
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, openDelay: 1e3, label: localization.rowActions },
+      React__default.createElement(
+        Menu.Target,
+        null,
+        React__default.createElement(
+          ActionIcon,
+          { "aria-label": localization.rowActions, size: "sm" },
+          React__default.createElement(IconDots2, null)
+        )
+      )
+    ),
+    React__default.createElement(
+      Menu.Dropdown,
+      null,
+      enableEditing && React__default.createElement(Menu.Item, { icon: React__default.createElement(IconEdit2, null), onClick: handleEdit }, localization.edit),
+      renderRowActionMenuItems === null || renderRowActionMenuItems === void 0 ? void 0 : renderRowActionMenuItems({
+        row,
+        table
+      })
+    )
+  );
+};
+const MRT_EditActionButtons = ({ row, table, variant = "icon" }) => {
+  const { getState, options: { icons: { IconCircleX: IconCircleX2, IconDeviceFloppy: IconDeviceFloppy2 }, localization, onEditingRowSave, onEditingRowCancel }, refs: { editInputRefs }, setEditingRow } = table;
+  const { editingRow } = getState();
+  const handleCancel = () => {
+    onEditingRowCancel === null || onEditingRowCancel === void 0 ? void 0 : onEditingRowCancel({ row, table });
+    setEditingRow(null);
+  };
+  const handleSave = () => {
+    var _a, _b;
+    (_a = Object.values(editInputRefs === null || editInputRefs === void 0 ? void 0 : editInputRefs.current)) === null || _a === void 0 ? void 0 : _a.forEach((input) => {
+      if (input.value !== void 0 && Object.hasOwn(editingRow === null || editingRow === void 0 ? void 0 : editingRow._valuesCache, input.name)) {
+        editingRow._valuesCache[input.name] = input.value;
+      }
+    });
+    onEditingRowSave === null || onEditingRowSave === void 0 ? void 0 : onEditingRowSave({
+      exitEditingMode: () => setEditingRow(null),
+      row: editingRow !== null && editingRow !== void 0 ? editingRow : row,
+      table,
+      values: (_b = editingRow === null || editingRow === void 0 ? void 0 : editingRow._valuesCache) !== null && _b !== void 0 ? _b : Object.assign({}, row.original)
+    });
+  };
+  return React__default.createElement(Box, { onClick: (e) => e.stopPropagation(), sx: { display: "flex", gap: "12px" } }, variant === "icon" ? React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, label: localization.cancel },
+      React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.cancel, onClick: handleCancel },
+        React__default.createElement(IconCircleX2, null)
+      )
+    ),
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, label: localization.save },
+      React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.save, color: "blue", onClick: handleSave },
+        React__default.createElement(IconDeviceFloppy2, null)
+      )
+    )
+  ) : React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(Button, { onClick: handleCancel, variant: "subtle" }, localization.cancel),
+    React__default.createElement(Button, { onClick: handleSave, variant: "filled" }, localization.save)
+  ));
+};
+const MRT_ToggleRowActionMenuButton = ({ cell, row, table }) => {
+  const { getState, options: { editingMode, enableEditing, icons: { IconEdit: IconEdit2 }, localization, renderRowActionMenuItems, renderRowActions }, setEditingRow } = table;
+  const { editingRow } = getState();
+  const handleStartEditMode = (event) => {
+    event.stopPropagation();
+    setEditingRow(Object.assign({}, row));
+  };
+  return React__default.createElement(React__default.Fragment, null, renderRowActions ? React__default.createElement(React__default.Fragment, null, renderRowActions({ cell, row, table })) : row.id === (editingRow === null || editingRow === void 0 ? void 0 : editingRow.id) && editingMode === "row" ? React__default.createElement(MRT_EditActionButtons, { row, table }) : !renderRowActionMenuItems && (enableEditing instanceof Function ? enableEditing(row) : enableEditing) ? React__default.createElement(
+    Tooltip,
+    { withinPortal: true, position: "right", withArrow: true, label: localization.edit },
+    React__default.createElement(
+      ActionIcon,
+      { "aria-label": localization.edit, onClick: handleStartEditMode },
+      React__default.createElement(IconEdit2, null)
+    )
+  ) : renderRowActionMenuItems ? React__default.createElement(MRT_RowActionMenu, { handleEdit: handleStartEditMode, row, table }) : null);
+};
+const MRT_SelectCheckbox = ({ row, selectAll, table }) => {
+  var _a;
+  const { getState, options: { localization, enableMultiRowSelection, mantineSelectCheckboxProps, mantineSelectAllCheckboxProps, selectAllMode } } = table;
+  const { density, isLoading } = getState();
+  const checkboxProps = !row ? mantineSelectAllCheckboxProps instanceof Function ? mantineSelectAllCheckboxProps({ table }) : mantineSelectAllCheckboxProps : mantineSelectCheckboxProps instanceof Function ? mantineSelectCheckboxProps({ row, table }) : mantineSelectCheckboxProps;
+  const allRowsSelected = selectAll ? selectAllMode === "page" ? table.getIsAllPageRowsSelected() : table.getIsAllRowsSelected() : void 0;
+  const commonProps = Object.assign(Object.assign({ "aria-label": selectAll ? localization.toggleSelectAll : localization.toggleSelectRow, checked: selectAll ? allRowsSelected : row === null || row === void 0 ? void 0 : row.getIsSelected(), disabled: isLoading || row && !row.getCanSelect(), onChange: row ? row.getToggleSelectedHandler() : selectAllMode === "all" ? table.getToggleAllRowsSelectedHandler() : table.getToggleAllPageRowsSelectedHandler(), size: density === "xs" ? "sm" : "md" }, checkboxProps), { onClick: (e) => {
+    var _a2;
+    e.stopPropagation();
+    (_a2 = checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.onClick) === null || _a2 === void 0 ? void 0 : _a2.call(checkboxProps, e);
+  }, title: void 0 });
+  return React__default.createElement(Tooltip, { withinPortal: true, withArrow: true, openDelay: 1e3, label: (_a = checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.title) !== null && _a !== void 0 ? _a : selectAll ? localization.toggleSelectAll : localization.toggleSelectRow }, enableMultiRowSelection === false ? React__default.createElement(Radio, Object.assign({}, commonProps)) : React__default.createElement(Checkbox, Object.assign({ indeterminate: selectAll ? table.getIsSomeRowsSelected() && !allRowsSelected : row === null || row === void 0 ? void 0 : row.getIsSomeSelected() }, commonProps)));
+};
+const mrtFilterOptions = (localization) => [
+  {
+    option: "fuzzy",
+    symbol: "≈",
+    label: localization.filterFuzzy,
+    divider: false
+  },
+  {
+    option: "contains",
+    symbol: "*",
+    label: localization.filterContains,
+    divider: false
+  },
+  {
+    option: "startsWith",
+    symbol: "a",
+    label: localization.filterStartsWith,
+    divider: false
+  },
+  {
+    option: "endsWith",
+    symbol: "z",
+    label: localization.filterEndsWith,
+    divider: true
+  },
+  {
+    option: "equals",
+    symbol: "=",
+    label: localization.filterEquals,
+    divider: false
+  },
+  {
+    option: "notEquals",
+    symbol: "≠",
+    label: localization.filterNotEquals,
+    divider: true
+  },
+  {
+    option: "between",
+    symbol: "⇿",
+    label: localization.filterBetween,
+    divider: false
+  },
+  {
+    option: "betweenInclusive",
+    symbol: "⬌",
+    label: localization.filterBetweenInclusive,
+    divider: true
+  },
+  {
+    option: "greaterThan",
+    symbol: ">",
+    label: localization.filterGreaterThan,
+    divider: false
+  },
+  {
+    option: "greaterThanOrEqualTo",
+    symbol: "≥",
+    label: localization.filterGreaterThanOrEqualTo,
+    divider: false
+  },
+  {
+    option: "lessThan",
+    symbol: "<",
+    label: localization.filterLessThan,
+    divider: false
+  },
+  {
+    option: "lessThanOrEqualTo",
+    symbol: "≤",
+    label: localization.filterLessThanOrEqualTo,
+    divider: true
+  },
+  {
+    option: "empty",
+    symbol: "∅",
+    label: localization.filterEmpty,
+    divider: false
+  },
+  {
+    option: "notEmpty",
+    symbol: "!∅",
+    label: localization.filterNotEmpty,
+    divider: false
+  }
+];
+const MRT_FilterOptionMenu = ({ header, onSelect, table }) => {
+  var _a, _b, _c, _d;
+  const { getState, options: { columnFilterModeOptions, globalFilterModeOptions, localization, renderColumnFilterModeMenuItems, renderGlobalFilterModeMenuItems }, setColumnFilterFns, setGlobalFilterFn } = table;
+  const { globalFilterFn } = getState();
+  const { column } = header !== null && header !== void 0 ? header : {};
+  const { columnDef } = column !== null && column !== void 0 ? column : {};
+  const currentFilterValue = column === null || column === void 0 ? void 0 : column.getFilterValue();
+  const allowedColumnFilterOptions = (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _a !== void 0 ? _a : columnFilterModeOptions;
+  const internalFilterOptions = useMemo(() => mrtFilterOptions(localization).filter((filterOption2) => columnDef ? allowedColumnFilterOptions === void 0 || (allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.includes(filterOption2.option)) : (!globalFilterModeOptions || globalFilterModeOptions.includes(filterOption2.option)) && ["fuzzy", "contains", "startsWith"].includes(filterOption2.option)), []);
+  const handleSelectFilterMode = (option) => {
+    if (header && column) {
+      setColumnFilterFns((prev) => Object.assign(Object.assign({}, prev), { [header.id]: option }));
+      if (["empty", "notEmpty"].includes(option)) {
+        if (currentFilterValue !== " ") {
+          column.setFilterValue(" ");
+        }
+      } else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === "multi-select" || ["arrIncludesSome", "arrIncludesAll", "arrIncludes"].includes(option)) {
+        if (currentFilterValue instanceof String || (currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.length)) {
+          column.setFilterValue([]);
+        }
+      } else if ((columnDef === null || columnDef === void 0 ? void 0 : columnDef.filterVariant) === "range" || ["between", "betweenInclusive", "inNumberRange"].includes(option)) {
+        if (!(currentFilterValue === null || currentFilterValue === void 0 ? void 0 : currentFilterValue.every((v) => v === ""))) {
+          column.setFilterValue(["", ""]);
+        }
+      } else {
+        if (!["", void 0].includes(currentFilterValue)) {
+          column.setFilterValue("");
+        }
+      }
+    } else {
+      setGlobalFilterFn(option);
+    }
+    onSelect === null || onSelect === void 0 ? void 0 : onSelect();
+  };
+  const filterOption = !!header && columnDef ? columnDef._filterFn : globalFilterFn;
+  return React__default.createElement(Menu.Dropdown, null, (_d = header && column && columnDef ? (_c = (_b = columnDef.renderColumnFilterModeMenuItems) === null || _b === void 0 ? void 0 : _b.call(columnDef, {
+    column,
+    internalFilterOptions,
+    onSelectFilterMode: handleSelectFilterMode,
+    table
+  })) !== null && _c !== void 0 ? _c : renderColumnFilterModeMenuItems === null || renderColumnFilterModeMenuItems === void 0 ? void 0 : renderColumnFilterModeMenuItems({
+    column,
+    internalFilterOptions,
+    onSelectFilterMode: handleSelectFilterMode,
+    table
+  }) : renderGlobalFilterModeMenuItems === null || renderGlobalFilterModeMenuItems === void 0 ? void 0 : renderGlobalFilterModeMenuItems({
+    internalFilterOptions,
+    onSelectFilterMode: handleSelectFilterMode,
+    table
+  })) !== null && _d !== void 0 ? _d : internalFilterOptions.map(({ option, label, divider, symbol }, index) => React__default.createElement(
+    Fragment,
+    { key: index },
+    React__default.createElement(
+      Menu.Item,
+      { onClick: () => handleSelectFilterMode(option), color: option === filterOption ? "blue" : void 0, sx: {
+        "& > .mantine-Menu-itemLabel": {
+          display: "flex",
+          flexWrap: "nowrap",
+          gap: "1ch"
+        }
+      }, value: option },
+      React__default.createElement(Flex, { sx: {
+        fontSize: "20px",
+        transform: "translateY(-2px)",
+        width: "2ch"
+      } }, symbol),
+      React__default.createElement(Flex, { align: "center" }, label)
+    ),
+    divider && React__default.createElement(Menu.Divider, null)
+  )));
+};
+const MRT_GlobalFilterTextInput = ({ table }) => {
+  var _a;
+  const { getState, setGlobalFilter, options: { enableGlobalFilterModes, icons: { IconSearch: IconSearch2, IconX: IconX2 }, localization, manualFiltering, mantineSearchTextInputProps }, refs: { searchInputRef } } = table;
+  const { globalFilter, showGlobalFilter } = getState();
+  const textFieldProps = mantineSearchTextInputProps instanceof Function ? mantineSearchTextInputProps({ table }) : mantineSearchTextInputProps;
+  const [searchValue, setSearchValue] = useState(globalFilter !== null && globalFilter !== void 0 ? globalFilter : "");
+  const [debouncedSearchValue] = useDebouncedValue(searchValue, manualFiltering ? 500 : 250);
+  useEffect(() => {
+    setGlobalFilter(debouncedSearchValue || void 0);
+  }, [debouncedSearchValue]);
+  useEffect(() => {
+    if (globalFilter === void 0) {
+      handleClear();
+    }
+  }, [globalFilter]);
+  const handleClear = () => {
+    setSearchValue("");
+    setGlobalFilter(void 0);
+  };
+  return React__default.createElement(
+    Collapse,
+    { in: showGlobalFilter, sx: { "& > div": { display: "flex" } } },
+    enableGlobalFilterModes && React__default.createElement(
+      Menu,
+      { withinPortal: true },
+      React__default.createElement(
+        Menu.Target,
+        null,
+        React__default.createElement(
+          ActionIcon,
+          { "aria-label": localization.changeSearchMode, size: "sm" },
+          React__default.createElement(IconSearch2, null)
+        )
+      ),
+      React__default.createElement(MRT_FilterOptionMenu, { table, onSelect: handleClear })
+    ),
+    React__default.createElement(TextInput, Object.assign({ placeholder: localization.search, onChange: (event) => setSearchValue(event.target.value), value: searchValue !== null && searchValue !== void 0 ? searchValue : "", variant: "filled", icon: !enableGlobalFilterModes && React__default.createElement(IconSearch2, null), rightSection: React__default.createElement(
+      ActionIcon,
+      { "aria-label": localization.clearSearch, disabled: !(searchValue === null || searchValue === void 0 ? void 0 : searchValue.length), onClick: handleClear, size: "sm", sx: {
+        "&:disabled": {
+          backgroundColor: "transparent",
+          border: "none"
+        }
+      } },
+      React__default.createElement(
+        Tooltip,
+        { withinPortal: true, withArrow: true, label: (_a = localization.clearSearch) !== null && _a !== void 0 ? _a : "" },
+        React__default.createElement(IconX2, null)
+      )
+    ) }, textFieldProps, { ref: (node) => {
+      if (node) {
+        searchInputRef.current = node;
+        if (textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.ref) {
+          textFieldProps.ref = node;
+        }
+      }
+    } }))
+  );
+};
+const MRT_ProgressBar = ({ isTopToolbar, table }) => {
+  const { options: { mantineProgressProps }, getState } = table;
+  const { isLoading, showProgressBars } = getState();
+  const linearProgressProps = mantineProgressProps instanceof Function ? mantineProgressProps({ isTopToolbar, table }) : mantineProgressProps;
+  return React__default.createElement(
+    Collapse,
+    { in: isLoading || showProgressBars, sx: {
+      bottom: isTopToolbar ? 0 : void 0,
+      position: "absolute",
+      top: !isTopToolbar ? 0 : void 0,
+      width: "100%"
+    } },
+    React__default.createElement(Progress, Object.assign({ animate: true, "aria-label": "Loading", "aria-busy": "true", sx: {
+      position: "relative"
+    }, value: 100 }, linearProgressProps))
+  );
+};
+const commonActionButtonStyles = {
+  userSelect: "none",
+  "&:disabled": {
+    backgroundColor: "transparent",
+    border: "none"
+  }
+};
+const MRT_TablePagination = ({ table, position = "bottom" }) => {
+  var _a;
+  const { getPrePaginationRowModel, getState, setPageIndex, setPageSize, options: { enableToolbarInternalActions, icons: { IconChevronLeft: IconChevronLeft2, IconChevronRight: IconChevronRight2 }, localization, mantinePaginationProps, rowCount } } = table;
+  const { pagination: { pageSize = 10, pageIndex = 0 }, showGlobalFilter } = getState();
+  const paginationProps = mantinePaginationProps instanceof Function ? mantinePaginationProps({ table }) : mantinePaginationProps;
+  const totalRowCount = rowCount !== null && rowCount !== void 0 ? rowCount : getPrePaginationRowModel().rows.length;
+  const showFirstLastPageButtons = totalRowCount / pageSize > 2 && (paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.showFirstLastPageButtons) !== false;
+  const firstRowIndex = pageIndex * pageSize;
+  const lastRowIndex = Math.min(pageIndex * pageSize + pageSize, totalRowCount);
+  return React__default.createElement(
+    Flex,
+    Object.assign({ align: "center", justify: "space-between", gap: "lg", py: "xs", px: "sm", mt: position === "top" && enableToolbarInternalActions && !showGlobalFilter ? "3rem" : void 0, p: "relative", sx: { zIndex: 2 } }, paginationProps),
+    (paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.showRowsPerPage) !== false && React__default.createElement(Select, { data: (_a = paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.rowsPerPageOptions) !== null && _a !== void 0 ? _a : [
+      "5",
+      "10",
+      "15",
+      "20",
+      "25",
+      "30",
+      "50",
+      "100"
+    ], label: localization.rowsPerPage, onChange: (value) => setPageSize(+value), value: pageSize.toString(), sx: {
+      "@media (min-width: 720px)": {
+        display: "flex",
+        alignItems: "center",
+        gap: "8px"
+      },
+      "& .mantine-Select-input": {
+        width: "90px"
+      }
+    } }),
+    React__default.createElement(Text, null, `${firstRowIndex + 1}-${lastRowIndex} ${localization.of} ${totalRowCount}`),
+    React__default.createElement(
+      Flex,
+      { gap: "xs" },
+      showFirstLastPageButtons && React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.goToFirstPage, disabled: pageIndex <= 0, onClick: () => setPageIndex(0), sx: commonActionButtonStyles },
+        React__default.createElement("b", { style: { transform: "translate(4px, -1.5px)" } }, "|"),
+        React__default.createElement(IconChevronLeft2, null)
+      ),
+      React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.goToPreviousPage, disabled: pageIndex <= 0, onClick: () => setPageIndex(pageIndex - 1), sx: commonActionButtonStyles },
+        React__default.createElement(IconChevronLeft2, null)
+      ),
+      React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.goToNextPage, disabled: lastRowIndex >= totalRowCount, onClick: () => setPageIndex(pageIndex + 1), sx: commonActionButtonStyles },
+        React__default.createElement(IconChevronRight2, null)
+      ),
+      showFirstLastPageButtons && React__default.createElement(
+        ActionIcon,
+        { "aria-label": localization.goToLastPage, disabled: lastRowIndex >= totalRowCount, onClick: () => setPageIndex(Math.ceil(totalRowCount / pageSize) - 1), sx: commonActionButtonStyles },
+        React__default.createElement(IconChevronRight2, null),
+        React__default.createElement("b", { style: { transform: "translate(-4px, -1.5px)" } }, "|")
+      )
+    )
+  );
+};
+const MRT_ToolbarAlertBanner = ({ stackAlertBanner, table }) => {
+  var _a, _b;
+  const { getPrePaginationRowModel, getSelectedRowModel, getState, options: { icons: { IconX: IconX2 }, localization, mantineToolbarAlertBannerProps, mantineToolbarAlertBannerChipProps, positionToolbarAlertBanner, rowCount } } = table;
+  const { grouping, showAlertBanner } = getState();
+  const alertProps = mantineToolbarAlertBannerProps instanceof Function ? mantineToolbarAlertBannerProps({ table }) : mantineToolbarAlertBannerProps;
+  const chipProps = mantineToolbarAlertBannerChipProps instanceof Function ? mantineToolbarAlertBannerChipProps({ table }) : mantineToolbarAlertBannerChipProps;
+  const selectMessage = getSelectedRowModel().rows.length > 0 ? (_b = (_a = localization.selectedCountOfRowCountRowsSelected) === null || _a === void 0 ? void 0 : _a.replace("{selectedCount}", getSelectedRowModel().rows.length.toString())) === null || _b === void 0 ? void 0 : _b.replace("{rowCount}", (rowCount !== null && rowCount !== void 0 ? rowCount : getPrePaginationRowModel().rows.length).toString()) : null;
+  const groupedByMessage = grouping.length > 0 ? React__default.createElement(
+    Flex,
+    null,
+    localization.groupedBy,
+    " ",
+    grouping.map((columnId, index) => React__default.createElement(
+      Fragment,
+      { key: `${index}-${columnId}` },
+      index > 0 ? localization.thenBy : "",
+      React__default.createElement(
+        Chip,
+        Object.assign({ onChange: () => table.getColumn(columnId).toggleGrouping(), sx: { paddingLeft: "1ch" } }, chipProps),
+        table.getColumn(columnId).columnDef.header,
+        " ",
+        React__default.createElement(IconX2, { size: "12pt", style: { transform: "translate(6px, 3px)" } })
+      )
+    ))
+  ) : null;
+  return React__default.createElement(
+    Collapse,
+    { in: showAlertBanner || !!selectMessage || !!groupedByMessage, transitionDuration: stackAlertBanner ? 200 : 0 },
+    React__default.createElement(
+      Alert,
+      Object.assign({ color: "blue", icon: false }, alertProps, { sx: (theme) => Object.assign({ borderRadius: 0, fontSize: "16px", left: 0, position: "relative", marginBottom: stackAlertBanner ? 0 : positionToolbarAlertBanner === "bottom" ? "-16px" : void 0, padding: "8px", right: 0, top: 0, width: "100%", zIndex: 2 }, (alertProps === null || alertProps === void 0 ? void 0 : alertProps.sx) instanceof Function ? alertProps.sx(theme) : alertProps === null || alertProps === void 0 ? void 0 : alertProps.sx) }),
+      (alertProps === null || alertProps === void 0 ? void 0 : alertProps.title) && React__default.createElement(Box, null, alertProps.title),
+      React__default.createElement(
+        Flex,
+        { sx: { padding: "8px 16px" } },
+        alertProps === null || alertProps === void 0 ? void 0 : alertProps.children,
+        (alertProps === null || alertProps === void 0 ? void 0 : alertProps.children) && (selectMessage || groupedByMessage) && React__default.createElement("br", null),
+        selectMessage,
+        selectMessage && groupedByMessage && React__default.createElement("br", null),
+        groupedByMessage
+      )
+    )
+  );
+};
+const MRT_ToggleFullScreenButton = (_a) => {
+  var _b;
+  var { table } = _a, rest = __rest(_a, ["table"]);
+  const { getState, options: { icons: { IconMinimize: IconMinimize2, IconMaximize: IconMaximize2 }, localization }, setIsFullScreen } = table;
+  const { isFullScreen } = getState();
+  const handleToggleFullScreen = () => {
+    setIsFullScreen(!isFullScreen);
+  };
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, label: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.toggleFullScreen },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": localization.showHideFilters, onClick: handleToggleFullScreen, size: "lg" }, rest, { title: void 0 }), isFullScreen ? React__default.createElement(IconMinimize2, null) : React__default.createElement(IconMaximize2, null))
+  );
+};
+const MRT_ColumnPinningButtons = ({ column, table }) => {
+  const { options: { icons: { IconPinned: IconPinned2, IconPinnedOff: IconPinnedOff2 }, localization } } = table;
+  const handlePinColumn = (pinDirection) => {
+    column.pin(pinDirection);
+  };
+  return React__default.createElement(Flex, { sx: {
+    minWidth: "70px",
+    alignContent: "center",
+    justifyContent: "center"
+  } }, column.getIsPinned() ? React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, label: localization.unpin },
+    React__default.createElement(
+      ActionIcon,
+      { onClick: () => handlePinColumn(false), size: "md" },
+      React__default.createElement(IconPinnedOff2, null)
+    )
+  ) : React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, label: localization.pinToLeft },
+      React__default.createElement(
+        ActionIcon,
+        { onClick: () => handlePinColumn("left"), size: "md" },
+        React__default.createElement(IconPinned2, { style: {
+          transform: "rotate(90deg)"
+        } })
+      )
+    ),
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, label: localization.pinToRight },
+      React__default.createElement(
+        ActionIcon,
+        { onClick: () => handlePinColumn("right"), size: "md" },
+        React__default.createElement(IconPinned2, { style: {
+          transform: "rotate(-90deg)"
+        } })
+      )
+    )
+  ));
+};
+const MRT_GrabHandleButton = ({ actionIconProps, onDragEnd, onDragStart, table }) => {
+  var _a;
+  const { options: { icons: { IconGripHorizontal: IconGripHorizontal2 }, localization } } = table;
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, openDelay: 1e3, position: "top", label: (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.title) !== null && _a !== void 0 ? _a : localization.move },
+    React__default.createElement(
+      ActionIcon,
+      Object.assign({ draggable: "true", size: "sm" }, actionIconProps, { onClick: (e) => {
+        var _a2;
+        e.stopPropagation();
+        (_a2 = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onClick) === null || _a2 === void 0 ? void 0 : _a2.call(actionIconProps, e);
+      }, onDragStart, onDragEnd, sx: (theme) => Object.assign({ cursor: "grab", margin: "0 -0.16px", opacity: 0.5, padding: "2px", transition: "opacity 100ms ease-in-out", "&:hover": {
+        backgroundColor: "transparent",
+        opacity: 1
+      }, "&:active": {
+        cursor: "grabbing"
+      } }, (actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx) instanceof Function ? actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx(theme) : actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx), title: void 0 }),
+      React__default.createElement(IconGripHorizontal2, null)
+    )
+  );
+};
+const MRT_ShowHideColumnsMenuItems = ({ allColumns, hoveredColumn, setHoveredColumn, column, isSubMenu, table }) => {
+  var _a;
+  const { getState, options: { enableColumnOrdering, enableHiding, enablePinning, localization }, setColumnOrder } = table;
+  const { columnOrder } = getState();
+  const { columnDef } = column;
+  const { columnDefType } = columnDef;
+  const switchChecked = columnDefType !== "group" && column.getIsVisible() || columnDefType === "group" && column.getLeafColumns().some((col) => col.getIsVisible());
+  const handleToggleColumnHidden = (column2) => {
+    var _a2, _b;
+    if (columnDefType === "group") {
+      (_b = (_a2 = column2 === null || column2 === void 0 ? void 0 : column2.columns) === null || _a2 === void 0 ? void 0 : _a2.forEach) === null || _b === void 0 ? void 0 : _b.call(_a2, (childColumn) => {
+        childColumn.toggleVisibility(!switchChecked);
+      });
+    } else {
+      column2.toggleVisibility();
+    }
+  };
+  const menuItemRef = useRef(null);
+  const [isDragging, setIsDragging] = useState(false);
+  const handleDragStart = (e) => {
+    setIsDragging(true);
+    e.dataTransfer.setDragImage(menuItemRef.current, 0, 0);
+  };
+  const handleDragEnd = (_e) => {
+    setIsDragging(false);
+    setHoveredColumn(null);
+    if (hoveredColumn) {
+      setColumnOrder(reorderColumn(column, hoveredColumn, columnOrder));
+    }
+  };
+  const handleDragEnter = (_e) => {
+    if (!isDragging && columnDef.enableColumnOrdering !== false) {
+      setHoveredColumn(column);
+    }
+  };
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Menu.Item,
+      { ref: menuItemRef, onDragEnter: handleDragEnter, sx: (theme) => ({
+        alignItems: "center",
+        justifyContent: "flex-start",
+        opacity: isDragging ? 0.5 : 1,
+        outline: isDragging ? `1px dashed ${theme.colors.gray[7]}` : (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === column.id ? `2px dashed ${getPrimaryColor(theme)}` : "none",
+        paddingLeft: `${(column.depth + 0.5) * 2}rem`,
+        paddingTop: "6px",
+        paddingBottom: "6px"
+      }) },
+      React__default.createElement(
+        Box,
+        { sx: {
+          display: "flex",
+          flexWrap: "nowrap",
+          gap: "8px"
+        } },
+        !isSubMenu && columnDefType !== "group" && enableColumnOrdering && !allColumns.some((col) => col.columnDef.columnDefType === "group") && (columnDef.enableColumnOrdering !== false ? React__default.createElement(MRT_GrabHandleButton, { onDragEnd: handleDragEnd, onDragStart: handleDragStart, table }) : React__default.createElement(Box, { sx: { width: "28px" } })),
+        !isSubMenu && enablePinning && (column.getCanPin() ? React__default.createElement(MRT_ColumnPinningButtons, { column, table }) : React__default.createElement(Box, { sx: { width: "70px" } })),
+        enableHiding ? React__default.createElement(
+          Tooltip,
+          { withinPortal: true, withArrow: true, openDelay: 1e3, label: localization.toggleVisibility },
+          React__default.createElement(Switch, { checked: switchChecked, disabled: isSubMenu && switchChecked || !column.getCanHide(), label: columnDef.header, onChange: () => handleToggleColumnHidden(column), sx: {
+            cursor: "pointer !important"
+          } })
+        ) : React__default.createElement(Text, { sx: { alignSelf: "center" } }, columnDef.header)
+      )
+    ),
+    (_a = column.columns) === null || _a === void 0 ? void 0 : _a.map((c, i) => React__default.createElement(MRT_ShowHideColumnsMenuItems, { allColumns, column: c, hoveredColumn, isSubMenu, key: `${i}-${c.id}`, setHoveredColumn, table }))
+  );
+};
+const MRT_ShowHideColumnsMenu = ({ isSubMenu, table }) => {
+  const { getAllColumns, getAllLeafColumns, getCenterLeafColumns, getIsAllColumnsVisible, getIsSomeColumnsPinned, getIsSomeColumnsVisible, getLeftLeafColumns, getRightLeafColumns, getState, toggleAllColumnsVisible, options: { enableColumnOrdering, enableHiding, enablePinning, localization } } = table;
+  const { columnOrder, columnPinning } = getState();
+  const hideAllColumns = () => {
+    getAllLeafColumns().filter((col) => col.columnDef.enableHiding !== false).forEach((col) => col.toggleVisibility(false));
+  };
+  const allColumns = useMemo(() => {
+    const columns = getAllColumns();
+    if (columnOrder.length > 0 && !columns.some((col) => col.columnDef.columnDefType === "group")) {
+      return [
+        ...getLeftLeafColumns(),
+        ...Array.from(new Set(columnOrder)).map((colId) => getCenterLeafColumns().find((col) => (col === null || col === void 0 ? void 0 : col.id) === colId)),
+        ...getRightLeafColumns()
+      ].filter(Boolean);
+    }
+    return columns;
+  }, [
+    columnOrder,
+    columnPinning,
+    getAllColumns(),
+    getCenterLeafColumns(),
+    getLeftLeafColumns(),
+    getRightLeafColumns()
+  ]);
+  const [hoveredColumn, setHoveredColumn] = useState(null);
+  return React__default.createElement(
+    Menu.Dropdown,
+    null,
+    React__default.createElement(
+      Flex,
+      { sx: {
+        justifyContent: isSubMenu ? "center" : "space-between",
+        padding: "8px",
+        gap: "8px"
+      } },
+      !isSubMenu && enableHiding && React__default.createElement(Button, { disabled: !getIsSomeColumnsVisible(), onClick: hideAllColumns, variant: "subtle" }, localization.hideAll),
+      !isSubMenu && enableColumnOrdering && React__default.createElement(Button, { onClick: () => table.setColumnOrder(getDefaultColumnOrderIds(table.options)), variant: "subtle" }, localization.resetOrder),
+      !isSubMenu && enablePinning && React__default.createElement(Button, { disabled: !getIsSomeColumnsPinned(), onClick: () => table.resetColumnPinning(true), variant: "subtle" }, localization.unpinAll),
+      enableHiding && React__default.createElement(Button, { disabled: getIsAllColumnsVisible(), onClick: () => toggleAllColumnsVisible(true), variant: "subtle" }, localization.showAll)
+    ),
+    React__default.createElement(Divider, null),
+    allColumns.map((column, index) => React__default.createElement(MRT_ShowHideColumnsMenuItems, { allColumns, column, hoveredColumn, isSubMenu, key: `${index}-${column.id}`, setHoveredColumn, table }))
+  );
+};
+const MRT_ShowHideColumnsButton = (_a) => {
+  var _b;
+  var { table } = _a, rest = __rest(_a, ["table"]);
+  const { options: { icons: { IconColumns: IconColumns2 }, localization } } = table;
+  return React__default.createElement(
+    Menu,
+    { closeOnItemClick: false, withinPortal: true },
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, label: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.showHideColumns },
+      React__default.createElement(
+        Menu.Target,
+        null,
+        React__default.createElement(
+          ActionIcon,
+          Object.assign({ "aria-label": localization.showHideColumns, size: "lg" }, rest, { title: void 0 }),
+          React__default.createElement(IconColumns2, null)
+        )
+      )
+    ),
+    React__default.createElement(MRT_ShowHideColumnsMenu, { table })
+  );
+};
+const sizes = ["xs", "sm", "md", "lg", "xl"];
+const commonStyles = {
+  transform: "rotate(90deg)"
+};
+const MRT_ToggleDensePaddingButton = (_a) => {
+  var _b;
+  var { table } = _a, rest = __rest(_a, ["table"]);
+  const { getState, options: { icons: { IconTallymark1: IconTallymark12, IconTallymark2: IconTallymark22, IconTallymark3: IconTallymark32, IconTallymark4: IconTallymark42, IconTallymarks: IconTallymarks2 }, localization }, setDensity } = table;
+  const { density } = getState();
+  const handleToggleDensePadding = () => {
+    var _a2;
+    setDensity((_a2 = sizes[(sizes.indexOf(density) - 1) % sizes.length]) !== null && _a2 !== void 0 ? _a2 : "xl");
+  };
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, label: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.toggleDensity },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": localization.toggleDensity, onClick: handleToggleDensePadding, size: "lg" }, rest, { title: void 0 }), density === "xs" ? React__default.createElement(IconTallymarks2, { style: commonStyles }) : density === "sm" ? React__default.createElement(IconTallymark42, { style: commonStyles }) : density === "md" ? React__default.createElement(IconTallymark32, { style: commonStyles }) : density === "lg" ? React__default.createElement(IconTallymark22, { style: commonStyles }) : React__default.createElement(IconTallymark12, { style: commonStyles }))
+  );
+};
+const MRT_ToggleFiltersButton = (_a) => {
+  var _b;
+  var { table } = _a, rest = __rest(_a, ["table"]);
+  const { getState, options: { icons: { IconFilter: IconFilter2, IconFilterOff: IconFilterOff2 }, localization }, setShowFilters } = table;
+  const { showColumnFilters } = getState();
+  const handleToggleShowFilters = () => {
+    setShowFilters(!showColumnFilters);
+  };
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, label: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.showHideFilters },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": localization.showHideFilters, onClick: handleToggleShowFilters, size: "lg" }, rest, { title: void 0 }), showColumnFilters ? React__default.createElement(IconFilterOff2, null) : React__default.createElement(IconFilter2, null))
+  );
+};
+const MRT_ToggleGlobalFilterButton = (_a) => {
+  var _b, _c;
+  var { table } = _a, rest = __rest(_a, ["table"]);
+  const { getState, options: { icons: { IconSearch: IconSearch2, IconCircleOff: IconCircleOff2 }, localization }, refs: { searchInputRef }, setShowGlobalFilter } = table;
+  const { globalFilter, showGlobalFilter } = getState();
+  const handleToggleSearch = () => {
+    setShowGlobalFilter(!showGlobalFilter);
+    setTimeout(() => {
+      var _a2;
+      return (_a2 = searchInputRef.current) === null || _a2 === void 0 ? void 0 : _a2.focus();
+    }, 100);
+  };
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, label: (_b = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _b !== void 0 ? _b : localization.showHideSearch },
+    React__default.createElement(ActionIcon, Object.assign({ "aria-label": (_c = rest === null || rest === void 0 ? void 0 : rest.title) !== null && _c !== void 0 ? _c : localization.showHideSearch, disabled: !!globalFilter, onClick: handleToggleSearch, size: "lg" }, rest, { title: void 0 }), showGlobalFilter ? React__default.createElement(IconCircleOff2, null) : React__default.createElement(IconSearch2, null))
+  );
+};
+const MRT_ToolbarInternalButtons = ({ table }) => {
+  var _a;
+  const { options: { enableColumnFilters, enableColumnOrdering, enableDensityToggle, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableHiding, enablePinning, initialState, renderToolbarInternalActions } } = table;
+  return React__default.createElement(Flex, { sx: {
+    alignItems: "center",
+    gap: "2px",
+    zIndex: 3
+  } }, (_a = renderToolbarInternalActions === null || renderToolbarInternalActions === void 0 ? void 0 : renderToolbarInternalActions({
+    table
+  })) !== null && _a !== void 0 ? _a : React__default.createElement(
+    React__default.Fragment,
+    null,
+    enableFilters && enableGlobalFilter && !(initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) && React__default.createElement(MRT_ToggleGlobalFilterButton, { table }),
+    enableFilters && enableColumnFilters && React__default.createElement(MRT_ToggleFiltersButton, { table }),
+    (enableHiding || enableColumnOrdering || enablePinning) && React__default.createElement(MRT_ShowHideColumnsButton, { table }),
+    enableDensityToggle && React__default.createElement(MRT_ToggleDensePaddingButton, { table }),
+    enableFullScreenToggle && React__default.createElement(MRT_ToggleFullScreenButton, { table })
+  ));
+};
+const MRT_ToolbarDropZone = ({ table }) => {
+  const { getState, options: { enableGrouping, localization }, setHoveredColumn, setShowToolbarDropZone } = table;
+  const { draggingColumn, hoveredColumn, grouping, showToolbarDropZone } = getState();
+  const handleDragEnter = (_event) => {
+    setHoveredColumn({ id: "drop-zone" });
+  };
+  useEffect(() => {
+    var _a;
+    if (((_a = table.options.state) === null || _a === void 0 ? void 0 : _a.showToolbarDropZone) !== void 0) {
+      setShowToolbarDropZone(!!enableGrouping && !!draggingColumn && !grouping.includes(draggingColumn.id));
+    }
+  }, [enableGrouping, draggingColumn, grouping]);
+  return React__default.createElement(Transition, { mounted: showToolbarDropZone, transition: "fade" }, (styles) => {
+    var _a, _b;
+    return React__default.createElement(
+      Flex,
+      { className: "mantine-ToolbarDropZone", sx: (theme) => ({
+        alignItems: "center",
+        backgroundColor: theme.fn.rgba(getPrimaryColor(theme), (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === "drop-zone" ? 0.2 : 0.1),
+        border: `dashed ${getPrimaryColor(theme)} 2px`,
+        justifyContent: "center",
+        height: "calc(100%)",
+        position: "absolute",
+        width: "calc(100%)",
+        zIndex: 2
+      }), onDragEnter: handleDragEnter, style: styles },
+      React__default.createElement(Text, null, localization.dropToGroupBy.replace("{column}", (_b = (_a = draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.columnDef) === null || _a === void 0 ? void 0 : _a.header) !== null && _b !== void 0 ? _b : ""))
+    );
+  });
+};
+const commonToolbarStyles = ({ theme }) => ({
+  alignItems: "flex-start",
+  backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white,
+  backgroundImage: "none",
+  display: "grid",
+  flexWrap: "wrap-reverse",
+  minHeight: "3.5rem",
+  overflow: "visible",
+  padding: "0 !important",
+  transition: "all 100ms ease-in-out",
+  zIndex: 1
+});
+const MRT_TopToolbar = ({ table }) => {
+  var _a;
+  const { getState, options: { enableGlobalFilter, enablePagination, enableToolbarInternalActions, mantineTopToolbarProps, positionGlobalFilter, positionPagination, positionToolbarAlertBanner, positionToolbarDropZone, renderTopToolbarCustomActions }, refs: { topToolbarRef } } = table;
+  const { isFullScreen, showGlobalFilter } = getState();
+  const isMobile = useMediaQuery("(max-width: 720px)");
+  const toolbarProps = mantineTopToolbarProps instanceof Function ? mantineTopToolbarProps({ table }) : mantineTopToolbarProps;
+  const stackAlertBanner = isMobile || !!renderTopToolbarCustomActions || showGlobalFilter;
+  return React__default.createElement(
+    Box,
+    Object.assign({}, toolbarProps, { ref: (node) => {
+      if (node) {
+        topToolbarRef.current = node;
+        if (toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.ref) {
+          toolbarProps.ref.current = node;
+        }
+      }
+    }, sx: (theme) => Object.assign(Object.assign({ position: isFullScreen ? "sticky" : "relative", top: isFullScreen ? "0" : void 0 }, commonToolbarStyles({ theme })), (toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.sx) instanceof Function ? toolbarProps.sx(theme) : toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.sx) }),
+    positionToolbarAlertBanner === "top" && React__default.createElement(MRT_ToolbarAlertBanner, { stackAlertBanner, table }),
+    ["both", "top"].includes(positionToolbarDropZone !== null && positionToolbarDropZone !== void 0 ? positionToolbarDropZone : "") && React__default.createElement(MRT_ToolbarDropZone, { table }),
+    React__default.createElement(
+      Flex,
+      { sx: {
+        alignItems: "flex-start",
+        boxSizing: "border-box",
+        justifyContent: "space-between",
+        padding: "8px",
+        position: stackAlertBanner ? "relative" : "absolute",
+        right: 0,
+        top: 0,
+        width: "100%"
+      } },
+      enableGlobalFilter && positionGlobalFilter === "left" && React__default.createElement(MRT_GlobalFilterTextInput, { table }),
+      (_a = renderTopToolbarCustomActions === null || renderTopToolbarCustomActions === void 0 ? void 0 : renderTopToolbarCustomActions({ table })) !== null && _a !== void 0 ? _a : React__default.createElement("span", null),
+      enableToolbarInternalActions ? React__default.createElement(
+        Flex,
+        { sx: {
+          flexWrap: "wrap-reverse",
+          justifyContent: "flex-end"
+        } },
+        enableGlobalFilter && positionGlobalFilter === "right" && React__default.createElement(MRT_GlobalFilterTextInput, { table }),
+        React__default.createElement(MRT_ToolbarInternalButtons, { table })
+      ) : enableGlobalFilter && positionGlobalFilter === "right" && React__default.createElement(MRT_GlobalFilterTextInput, { table })
+    ),
+    enablePagination && ["top", "both"].includes(positionPagination !== null && positionPagination !== void 0 ? positionPagination : "") && React__default.createElement(
+      Flex,
+      { justify: "end" },
+      React__default.createElement(MRT_TablePagination, { table, position: "top" })
+    ),
+    React__default.createElement(MRT_ProgressBar, { isTopToolbar: true, table })
+  );
+};
+const MRT_BottomToolbar = ({ table }) => {
+  const { getState, options: { enablePagination, mantineBottomToolbarProps, positionPagination, positionToolbarAlertBanner, positionToolbarDropZone, renderBottomToolbarCustomActions }, refs: { bottomToolbarRef } } = table;
+  const { isFullScreen } = getState();
+  const isMobile = useMediaQuery("(max-width: 720px)");
+  const toolbarProps = mantineBottomToolbarProps instanceof Function ? mantineBottomToolbarProps({ table }) : mantineBottomToolbarProps;
+  const stackAlertBanner = isMobile || !!renderBottomToolbarCustomActions;
+  return React__default.createElement(
+    Box,
+    Object.assign({}, toolbarProps, { ref: (node) => {
+      if (node) {
+        bottomToolbarRef.current = node;
+        if (toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.ref) {
+          toolbarProps.ref.current = node;
+        }
+      }
+    }, sx: (theme) => Object.assign(Object.assign(Object.assign({}, commonToolbarStyles({ theme })), { bottom: isFullScreen ? "0" : void 0, boxShadow: `0 1px 2px -1px ${theme.fn.rgba(theme.black, 0.1)} inset`, left: 0, position: isFullScreen ? "fixed" : "relative", right: 0 }), (toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.sx) instanceof Function ? toolbarProps.sx(theme) : toolbarProps === null || toolbarProps === void 0 ? void 0 : toolbarProps.sx) }),
+    React__default.createElement(MRT_ProgressBar, { isTopToolbar: false, table }),
+    positionToolbarAlertBanner === "bottom" && React__default.createElement(MRT_ToolbarAlertBanner, { stackAlertBanner, table }),
+    ["both", "bottom"].includes(positionToolbarDropZone !== null && positionToolbarDropZone !== void 0 ? positionToolbarDropZone : "") && React__default.createElement(MRT_ToolbarDropZone, { table }),
+    React__default.createElement(
+      Box,
+      { sx: {
+        alignItems: "center",
+        boxSizing: "border-box",
+        display: "flex",
+        justifyContent: "space-between",
+        padding: "8px",
+        width: "100%"
+      } },
+      renderBottomToolbarCustomActions ? renderBottomToolbarCustomActions({ table }) : React__default.createElement("span", null),
+      React__default.createElement(Box, { sx: {
+        display: "flex",
+        justifyContent: "flex-end",
+        position: stackAlertBanner ? "relative" : "absolute",
+        right: 0,
+        top: 0
+      } }, enablePagination && ["bottom", "both"].includes(positionPagination !== null && positionPagination !== void 0 ? positionPagination : "") && React__default.createElement(MRT_TablePagination, { table, position: "bottom" }))
+    )
+  );
+};
+const MRT_ColumnActionMenu = ({ header, table }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+  const { getState, toggleAllColumnsVisible, setColumnOrder, options: { enableColumnFilters, enableColumnResizing, enableGrouping, enableHiding, enablePinning, enableSorting, icons: { IconArrowAutofitContent: IconArrowAutofitContent2, IconBoxMultiple: IconBoxMultiple2, IconClearAll: IconClearAll2, IconColumns: IconColumns2, IconDotsVertical: IconDotsVertical2, IconEyeOff: IconEyeOff2, IconFilter: IconFilter2, IconFilterOff: IconFilterOff2, IconPinned: IconPinned2, IconPinnedOff: IconPinnedOff2, IconSortAscending: IconSortAscending2, IconSortDescending: IconSortDescending2 }, localization, mantineColumnActionsButtonProps, renderColumnActionsMenuItems }, refs: { filterInputRefs }, setColumnSizingInfo, setShowFilters } = table;
+  const { column } = header;
+  const { columnDef } = column;
+  const { columnSizing, columnVisibility } = getState();
+  const mTableHeadCellColumnActionsButtonProps = mantineColumnActionsButtonProps instanceof Function ? mantineColumnActionsButtonProps({ column, table }) : mantineColumnActionsButtonProps;
+  const mcTableHeadCellColumnActionsButtonProps = columnDef.mantineColumnActionsButtonProps instanceof Function ? columnDef.mantineColumnActionsButtonProps({
+    column,
+    table
+  }) : columnDef.mantineColumnActionsButtonProps;
+  const actionIconProps = Object.assign(Object.assign({}, mTableHeadCellColumnActionsButtonProps), mcTableHeadCellColumnActionsButtonProps);
+  const handleClearSort = () => {
+    column.clearSorting();
+  };
+  const handleSortAsc = () => {
+    column.toggleSorting(false);
+  };
+  const handleSortDesc = () => {
+    column.toggleSorting(true);
+  };
+  const handleResetColumnSize = () => {
+    setColumnSizingInfo((old) => Object.assign(Object.assign({}, old), { isResizingColumn: false }));
+    column.resetSize();
+  };
+  const handleHideColumn = () => {
+    column.toggleVisibility(false);
+  };
+  const handlePinColumn = (pinDirection) => {
+    column.pin(pinDirection);
+  };
+  const handleGroupByColumn = () => {
+    column.toggleGrouping();
+    setColumnOrder((old) => ["mrt-row-expand", ...old]);
+  };
+  const handleClearFilter = () => {
+    column.setFilterValue("");
+  };
+  const handleFilterByColumn = () => {
+    setShowFilters(true);
+    setTimeout(() => {
+      var _a2;
+      return (_a2 = filterInputRefs.current[`${column.id}-0`]) === null || _a2 === void 0 ? void 0 : _a2.focus();
+    }, 100);
+  };
+  const handleShowAllColumns = () => {
+    toggleAllColumnsVisible(true);
+  };
+  return React__default.createElement(
+    Menu,
+    { closeOnItemClick: true, withinPortal: true },
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, openDelay: 1e3, position: "top", label: (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.title) !== null && _a !== void 0 ? _a : localization.columnActions },
+      React__default.createElement(
+        Menu.Target,
+        null,
+        React__default.createElement(
+          ActionIcon,
+          Object.assign({ "aria-label": localization.columnActions, size: "sm" }, actionIconProps, { sx: (theme) => Object.assign({ opacity: 0.5, transition: "opacity 100ms", "&:hover": {
+            opacity: 1
+          } }, (actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx) instanceof Function ? actionIconProps.sx(theme) : actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.sx) }),
+          React__default.createElement(IconDotsVertical2, null)
+        )
+      )
+    ),
+    React__default.createElement(
+      Menu.Dropdown,
+      null,
+      (_d = (_c = (_b = columnDef.renderColumnActionsMenuItems) === null || _b === void 0 ? void 0 : _b.call(columnDef, {
+        column,
+        table
+      })) !== null && _c !== void 0 ? _c : renderColumnActionsMenuItems === null || renderColumnActionsMenuItems === void 0 ? void 0 : renderColumnActionsMenuItems({
+        column,
+        table
+      })) !== null && _d !== void 0 ? _d : enableSorting && column.getCanSort() && React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(Menu.Item, { disabled: !column.getIsSorted(), icon: React__default.createElement(IconClearAll2, null), onClick: handleClearSort }, localization.clearSort),
+        React__default.createElement(Menu.Item, { disabled: column.getIsSorted() === "asc", icon: React__default.createElement(IconSortAscending2, null), onClick: handleSortAsc }, (_e = localization.sortByColumnAsc) === null || _e === void 0 ? void 0 : _e.replace("{column}", String(columnDef.header))),
+        React__default.createElement(Menu.Item, { icon: React__default.createElement(IconSortDescending2, null), disabled: column.getIsSorted() === "desc", onClick: handleSortDesc }, (_f = localization.sortByColumnDesc) === null || _f === void 0 ? void 0 : _f.replace("{column}", String(columnDef.header))),
+        (enableColumnFilters || enableGrouping || enableHiding) && React__default.createElement(Menu.Divider, { key: 3 })
+      ),
+      enableColumnFilters && column.getCanFilter() && React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(Menu.Item, { disabled: !column.getFilterValue(), icon: React__default.createElement(IconFilterOff2, null), onClick: handleClearFilter }, localization.clearFilter),
+        React__default.createElement(Menu.Item, { icon: React__default.createElement(IconFilter2, null), onClick: handleFilterByColumn }, (_g = localization.filterByColumn) === null || _g === void 0 ? void 0 : _g.replace("{column}", String(columnDef.header))),
+        (enableGrouping || enableHiding) && React__default.createElement(Menu.Divider, { key: 2 })
+      ),
+      enableGrouping && column.getCanGroup() && React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(Menu.Item, { icon: React__default.createElement(IconBoxMultiple2, null), onClick: handleGroupByColumn }, (_h = localization[column.getIsGrouped() ? "ungroupByColumn" : "groupByColumn"]) === null || _h === void 0 ? void 0 : _h.replace("{column}", String(columnDef.header))),
+        enablePinning && React__default.createElement(Menu.Divider, null)
+      ),
+      enablePinning && column.getCanPin() && React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(Menu.Item, { disabled: column.getIsPinned() === "left" || !column.getCanPin(), icon: React__default.createElement(IconPinned2, { style: { transform: "rotate(90deg)" } }), onClick: () => handlePinColumn("left") }, localization.pinToLeft),
+        React__default.createElement(Menu.Item, { disabled: column.getIsPinned() === "right" || !column.getCanPin(), icon: React__default.createElement(IconPinned2, { style: { transform: "rotate(-90deg)" } }), onClick: () => handlePinColumn("right") }, localization.pinToRight),
+        React__default.createElement(Menu.Item, { disabled: !column.getIsPinned(), icon: React__default.createElement(IconPinnedOff2, null), onClick: () => handlePinColumn(false) }, localization.unpin),
+        enableHiding && React__default.createElement(Menu.Divider, null)
+      ),
+      enableColumnResizing && column.getCanResize() && React__default.createElement(Menu.Item, { disabled: !columnSizing[column.id], icon: React__default.createElement(IconArrowAutofitContent2, null), key: 0, onClick: handleResetColumnSize }, localization.resetColumnSize),
+      enableHiding && React__default.createElement(
+        React__default.Fragment,
+        null,
+        React__default.createElement(Menu.Item, { disabled: !column.getCanHide(), icon: React__default.createElement(IconEyeOff2, null), key: 0, onClick: handleHideColumn }, (_j = localization.hideColumn) === null || _j === void 0 ? void 0 : _j.replace("{column}", String(columnDef.header))),
+        React__default.createElement(Menu.Item, { disabled: !Object.values(columnVisibility).filter((visible) => !visible).length, icon: React__default.createElement(IconColumns2, null), key: 1, onClick: handleShowAllColumns }, (_k = localization.showAllColumns) === null || _k === void 0 ? void 0 : _k.replace("{column}", String(columnDef.header)))
+      )
+    )
+  );
+};
+const MRT_FilterTextInput = ({ header, rangeFilterIndex, table }) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const { options: { columnFilterModeOptions, icons: { IconX: IconX2 }, localization, manualFiltering, mantineFilterTextInputProps, mantineFilterSelectProps, mantineFilterMultiSelectProps }, refs: { filterInputRefs }, setColumnFilterFns } = table;
+  const { column } = header;
+  const { columnDef } = column;
+  const mFilterTextInputProps = mantineFilterTextInputProps instanceof Function ? mantineFilterTextInputProps({
+    column,
+    table,
+    rangeFilterIndex
+  }) : mantineFilterTextInputProps;
+  const mcFilterTextInputProps = columnDef.mantineFilterTextInputProps instanceof Function ? columnDef.mantineFilterTextInputProps({
+    column,
+    table,
+    rangeFilterIndex
+  }) : columnDef.mantineFilterTextInputProps;
+  const textInputProps = Object.assign(Object.assign({}, mFilterTextInputProps), mcFilterTextInputProps);
+  const mSelectProps = mantineFilterSelectProps instanceof Function ? mantineFilterSelectProps({ column, table, rangeFilterIndex }) : mantineFilterSelectProps;
+  const mcSelectProps = columnDef.mantineFilterSelectProps instanceof Function ? columnDef.mantineFilterSelectProps({ column, table, rangeFilterIndex }) : columnDef.mantineFilterSelectProps;
+  const selectProps = Object.assign(Object.assign({}, mSelectProps), mcSelectProps);
+  const mMultiSelectProps = mantineFilterMultiSelectProps instanceof Function ? mantineFilterMultiSelectProps({ column, table, rangeFilterIndex }) : mantineFilterMultiSelectProps;
+  const mcMultiSelectProps = columnDef.mantineFilterMultiSelectProps instanceof Function ? columnDef.mantineFilterMultiSelectProps({
+    column,
+    table,
+    rangeFilterIndex
+  }) : columnDef.mantineFilterMultiSelectProps;
+  const multiSelectProps = Object.assign(Object.assign({}, mMultiSelectProps), mcMultiSelectProps);
+  const isRangeFilter = columnDef.filterVariant === "range" || columnDef.filterVariant === "date-range" || rangeFilterIndex !== void 0;
+  const isSelectFilter = columnDef.filterVariant === "select";
+  const isMultiSelectFilter = columnDef.filterVariant === "multi-select";
+  const isDateFilter = columnDef.filterVariant === "date";
+  const allowedColumnFilterOptions = (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _a !== void 0 ? _a : columnFilterModeOptions;
+  const currentFilterOption = columnDef._filterFn;
+  const filterChipLabel = ["empty", "notEmpty"].includes(currentFilterOption) ? (
+    //@ts-ignore
+    localization[`filter${((_c = (_b = currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.charAt) === null || _b === void 0 ? void 0 : _b.call(currentFilterOption, 0)) === null || _c === void 0 ? void 0 : _c.toUpperCase()) + (currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.slice(1))}`]
+  ) : "";
+  const filterPlaceholder = !isRangeFilter ? (_d = textInputProps === null || textInputProps === void 0 ? void 0 : textInputProps.placeholder) !== null && _d !== void 0 ? _d : (_e = localization.filterByColumn) === null || _e === void 0 ? void 0 : _e.replace("{column}", String(columnDef.header)) : rangeFilterIndex === 0 ? localization.min : rangeFilterIndex === 1 ? localization.max : "";
+  const isMounted = useRef(false);
+  const [filterValue, setFilterValue] = useState(() => {
+    var _a2, _b2;
+    return isMultiSelectFilter ? column.getFilterValue() || [] : isRangeFilter ? ((_a2 = column.getFilterValue()) === null || _a2 === void 0 ? void 0 : _a2[rangeFilterIndex]) || [] : (_b2 = column.getFilterValue()) !== null && _b2 !== void 0 ? _b2 : "";
+  });
+  const [debouncedFilterValue] = useDebouncedValue(filterValue, manualFiltering ? 400 : 200);
+  useEffect(() => {
+    if (!isMounted.current)
+      return;
+    if (isRangeFilter) {
+      column.setFilterValue((old) => {
+        const newFilterValues = Array.isArray(old) ? old : ["", ""];
+        newFilterValues[rangeFilterIndex] = debouncedFilterValue;
+        return newFilterValues;
+      });
+    } else {
+      column.setFilterValue(debouncedFilterValue !== null && debouncedFilterValue !== void 0 ? debouncedFilterValue : void 0);
+    }
+  }, [debouncedFilterValue]);
+  useEffect(() => {
+    if (!isMounted.current) {
+      isMounted.current = true;
+      return;
+    }
+    const tableFilterValue = column.getFilterValue();
+    if (tableFilterValue === void 0) {
+      handleClear();
+    } else if (isRangeFilter && rangeFilterIndex !== void 0) {
+      setFilterValue(tableFilterValue[rangeFilterIndex]);
+    } else {
+      setFilterValue(tableFilterValue);
+    }
+  }, [column.getFilterValue()]);
+  const handleClear = () => {
+    if (isMultiSelectFilter) {
+      setFilterValue([]);
+      column.setFilterValue([]);
+    } else if (isRangeFilter) {
+      setFilterValue("");
+      column.setFilterValue((old) => {
+        const newFilterValues = old !== null && old !== void 0 ? old : ["", ""];
+        newFilterValues[rangeFilterIndex] = void 0;
+        return newFilterValues;
+      });
+    } else {
+      setFilterValue("");
+      column.setFilterValue(void 0);
+    }
+  };
+  if (columnDef.Filter) {
+    return React__default.createElement(React__default.Fragment, null, (_f = columnDef.Filter) === null || _f === void 0 ? void 0 : _f.call(columnDef, { column, header, rangeFilterIndex, table }));
+  }
+  const handleClearEmptyFilterChip = () => {
+    setFilterValue("");
+    column.setFilterValue(void 0);
+    setColumnFilterFns((prev) => {
+      var _a2;
+      return Object.assign(Object.assign({}, prev), { [header.id]: (_a2 = allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions[0]) !== null && _a2 !== void 0 ? _a2 : "fuzzy" });
+    });
+  };
+  const commonProps = {
+    disabled: !!filterChipLabel,
+    placeholder: filterPlaceholder,
+    title: filterPlaceholder,
+    onClick: (event) => event.stopPropagation(),
+    onChange: setFilterValue,
+    value: filterValue,
+    variant: "unstyled",
+    sx: (theme) => Object.assign({ borderBottom: `2px solid ${theme.colors.gray[theme.colorScheme === "dark" ? 7 : 3]}`, minWidth: isRangeFilter ? "80px" : !filterChipLabel ? "100px" : "auto", width: "100%" }, packSx(isMultiSelectFilter ? multiSelectProps.sx : isSelectFilter ? selectProps.sx : textInputProps === null || textInputProps === void 0 ? void 0 : textInputProps.sx))
+  };
+  return filterChipLabel ? React__default.createElement(
+    Box,
+    { sx: commonProps.sx },
+    React__default.createElement(
+      Chip,
+      { onClick: handleClearEmptyFilterChip, sx: { margin: "4px" } },
+      filterChipLabel,
+      " ",
+      React__default.createElement(IconX2, { size: "12pt", style: { transform: "translate(6px, 3px)" } })
+    )
+  ) : isMultiSelectFilter ? React__default.createElement(MultiSelect, Object.assign({}, commonProps, { data: multiSelectProps.data, withinPortal: true }, multiSelectProps)) : isSelectFilter ? React__default.createElement(Select, Object.assign({}, commonProps, { clearable: true, data: selectProps.data, withinPortal: true }, selectProps)) : isDateFilter ? null : React__default.createElement(TextInput, Object.assign({}, commonProps, { rightSection: !filterChipLabel && ((_g = filterValue === null || filterValue === void 0 ? void 0 : filterValue.toString()) === null || _g === void 0 ? void 0 : _g.length) ? React__default.createElement(
+    ActionIcon,
+    { "aria-label": localization.clearFilter, onClick: handleClear, size: "sm", sx: {
+      "&:disabled": {
+        backgroundColor: "transparent",
+        border: "none"
+      }
+    }, title: (_h = localization.clearFilter) !== null && _h !== void 0 ? _h : "" },
+    React__default.createElement(IconX2, null)
+  ) : null, onChange: (e) => setFilterValue(e.target.value) }, textInputProps, { ref: (node) => {
+    if (node) {
+      filterInputRefs.current[`${column.id}-${rangeFilterIndex !== null && rangeFilterIndex !== void 0 ? rangeFilterIndex : 0}`] = node;
+      if (textInputProps.ref) {
+        textInputProps.ref.current = node;
+      }
+    }
+  } }));
+};
+const MRT_FilterRangeFields = ({ header, table }) => {
+  return React__default.createElement(
+    Box,
+    { sx: { display: "grid", gridTemplateColumns: "6fr 6fr", gap: "16px" } },
+    React__default.createElement(MRT_FilterTextInput, { header, rangeFilterIndex: 0, table }),
+    React__default.createElement(MRT_FilterTextInput, { header, rangeFilterIndex: 1, table })
+  );
+};
+const MRT_FilterCheckbox = ({ column, table }) => {
+  var _a, _b, _c;
+  const { getState, options: { localization, mantineFilterCheckboxProps } } = table;
+  const { density } = getState();
+  const { columnDef } = column;
+  const mTableHeadCellFilterCheckboxProps = mantineFilterCheckboxProps instanceof Function ? mantineFilterCheckboxProps({
+    column,
+    table
+  }) : mantineFilterCheckboxProps;
+  const mcTableHeadCellFilterCheckboxProps = columnDef.mantineFilterCheckboxProps instanceof Function ? columnDef.mantineFilterCheckboxProps({
+    column,
+    table
+  }) : columnDef.mantineFilterCheckboxProps;
+  const checkboxProps = Object.assign(Object.assign({}, mTableHeadCellFilterCheckboxProps), mcTableHeadCellFilterCheckboxProps);
+  const filterLabel = (_a = localization.filterByColumn) === null || _a === void 0 ? void 0 : _a.replace("{column}", columnDef.header);
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, openDelay: 1e3, label: (_b = checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.title) !== null && _b !== void 0 ? _b : filterLabel },
+    React__default.createElement(Checkbox, Object.assign({ checked: column.getFilterValue() === "true", indeterminate: column.getFilterValue() === void 0, color: column.getFilterValue() === void 0 ? "default" : "primary", size: density === "xs" ? "sm" : "md", label: (_c = checkboxProps.title) !== null && _c !== void 0 ? _c : filterLabel }, checkboxProps, { onClick: (e) => {
+      var _a2;
+      e.stopPropagation();
+      (_a2 = checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.onClick) === null || _a2 === void 0 ? void 0 : _a2.call(checkboxProps, e);
+    }, onChange: (e) => {
+      var _a2;
+      column.setFilterValue(column.getFilterValue() === void 0 ? "true" : column.getFilterValue() === "true" ? "false" : void 0);
+      (_a2 = checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.onChange) === null || _a2 === void 0 ? void 0 : _a2.call(checkboxProps, e);
+    }, sx: (theme) => Object.assign({ fontWeight: "normal", marginTop: "8px" }, (checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.sx) instanceof Function ? checkboxProps.sx(theme) : checkboxProps === null || checkboxProps === void 0 ? void 0 : checkboxProps.sx), title: void 0 }))
+  );
+};
+const MRT_TableHeadCellFilterContainer = ({ header, table }) => {
+  var _a, _b;
+  const { getState, options: { enableColumnFilterModes, columnFilterModeOptions, localization } } = table;
+  const { showColumnFilters } = getState();
+  const { column } = header;
+  const { columnDef } = column;
+  const currentFilterOption = columnDef._filterFn;
+  const allowedColumnFilterOptions = (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef.columnFilterModeOptions) !== null && _a !== void 0 ? _a : columnFilterModeOptions;
+  const showChangeModeButton = enableColumnFilterModes && columnDef.enableColumnFilterModes !== false && (allowedColumnFilterOptions === void 0 || !!(allowedColumnFilterOptions === null || allowedColumnFilterOptions === void 0 ? void 0 : allowedColumnFilterOptions.length));
+  return React__default.createElement(
+    Collapse,
+    { in: showColumnFilters },
+    React__default.createElement(
+      Flex,
+      { direction: "column" },
+      React__default.createElement(
+        Flex,
+        { align: "flex-end" },
+        columnDef.filterVariant === "checkbox" ? React__default.createElement(MRT_FilterCheckbox, { column, table }) : columnDef.filterVariant === "range" || columnDef.filterVariant === "date-range" || ["between", "betweenInclusive", "inNumberRange"].includes(columnDef._filterFn) ? React__default.createElement(MRT_FilterRangeFields, { header, table }) : React__default.createElement(MRT_FilterTextInput, { header, table }),
+        showChangeModeButton && React__default.createElement(
+          Menu,
+          { withinPortal: true },
+          React__default.createElement(
+            Tooltip,
+            { label: localization.changeFilterMode, position: "bottom-start", withArrow: true, withinPortal: true },
+            React__default.createElement(
+              Menu.Target,
+              null,
+              React__default.createElement(
+                ActionIcon,
+                { "aria-label": localization.changeFilterMode, size: "md", sx: { transform: "translateY(-2px)" } },
+                React__default.createElement(IconFilter, null)
+              )
+            )
+          ),
+          React__default.createElement(MRT_FilterOptionMenu, { header, table })
+        )
+      ),
+      showChangeModeButton ? React__default.createElement(Text, { component: "label", color: "dimmed", sx: { whiteSpace: "nowrap", marginTop: "4px", fontSize: "10px" } }, localization.filterMode.replace(
+        "{filterType}",
+        // @ts-ignore
+        localization[`filter${((_b = currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.charAt(0)) === null || _b === void 0 ? void 0 : _b.toUpperCase()) + (currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.slice(1))}`]
+      )) : null
+    )
+  );
+};
+const MRT_TableHeadCellFilterLabel = ({ header, table }) => {
+  var _a, _b, _c;
+  const { options: { icons: { IconFilter: IconFilter2 }, localization }, refs: { filterInputRefs }, setShowFilters } = table;
+  const { column } = header;
+  const { columnDef } = column;
+  const isRangeFilter = columnDef.filterVariant === "range" || ["between", "betweenInclusive", "inNumberRange"].includes(columnDef._filterFn);
+  const currentFilterOption = columnDef._filterFn;
+  const filterTooltip = localization.filteringByColumn.replace("{column}", String(columnDef.header)).replace(
+    "{filterType}",
+    // @ts-ignore
+    localization[`filter${((_a = currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.charAt(0)) === null || _a === void 0 ? void 0 : _a.toUpperCase()) + (currentFilterOption === null || currentFilterOption === void 0 ? void 0 : currentFilterOption.slice(1))}`]
+  ).replace("{filterValue}", `"${Array.isArray(column.getFilterValue()) ? column.getFilterValue().join(`" ${isRangeFilter ? localization.and : localization.or} "`) : column.getFilterValue()}"`).replace('" "', "");
+  return React__default.createElement(Transition, { transition: "scale", mounted: !!column.getFilterValue() && !isRangeFilter || isRangeFilter && // @ts-ignore
+  (!!((_b = column.getFilterValue()) === null || _b === void 0 ? void 0 : _b[0]) || !!((_c = column.getFilterValue()) === null || _c === void 0 ? void 0 : _c[1])) }, (styles) => React__default.createElement(
+    Box,
+    { component: "span", sx: { flex: "0 0" }, style: styles },
+    React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, position: "top", label: filterTooltip },
+      React__default.createElement(
+        ActionIcon,
+        { onClick: (event) => {
+          setShowFilters(true);
+          setTimeout(() => {
+            var _a2, _b2;
+            (_a2 = filterInputRefs.current[`${column.id}-0`]) === null || _a2 === void 0 ? void 0 : _a2.focus();
+            (_b2 = filterInputRefs.current[`${column.id}-0`]) === null || _b2 === void 0 ? void 0 : _b2.select();
+          }, 100);
+          event.stopPropagation();
+        }, size: "sm", sx: {
+          opacity: column.getFilterValue() ? 1 : 0.5,
+          padding: "2px"
+        } },
+        React__default.createElement(IconFilter2, null)
+      )
+    )
+  ));
+};
+const MRT_TableHeadCellGrabHandle = ({ column, table, tableHeadCellRef }) => {
+  const { getState, options: { enableColumnOrdering, mantineColumnDragHandleProps }, setColumnOrder, setDraggingColumn, setHoveredColumn } = table;
+  const { columnDef } = column;
+  const { hoveredColumn, draggingColumn, columnOrder } = getState();
+  const mActionIconProps = mantineColumnDragHandleProps instanceof Function ? mantineColumnDragHandleProps({ column, table }) : mantineColumnDragHandleProps;
+  const mcActionIconProps = columnDef.mantineColumnDragHandleProps instanceof Function ? columnDef.mantineColumnDragHandleProps({ column, table }) : columnDef.mantineColumnDragHandleProps;
+  const actionIconProps = Object.assign(Object.assign({}, mActionIconProps), mcActionIconProps);
+  const handleDragStart = (event) => {
+    var _a;
+    (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onDragStart) === null || _a === void 0 ? void 0 : _a.call(actionIconProps, event);
+    setDraggingColumn(column);
+    event.dataTransfer.setDragImage(tableHeadCellRef.current, 0, 0);
+  };
+  const handleDragEnd = (event) => {
+    var _a;
+    (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onDragEnd) === null || _a === void 0 ? void 0 : _a.call(actionIconProps, event);
+    if ((hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === "drop-zone") {
+      column.toggleGrouping();
+    } else if (enableColumnOrdering && hoveredColumn && (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) !== (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id)) {
+      setColumnOrder(reorderColumn(column, hoveredColumn, columnOrder));
+    }
+    setDraggingColumn(null);
+    setHoveredColumn(null);
+  };
+  return React__default.createElement(MRT_GrabHandleButton, { actionIconProps, onDragStart: handleDragStart, onDragEnd: handleDragEnd, table });
+};
+const MRT_TableHeadCellResizeHandle = ({ header, table }) => {
+  var _a;
+  const { getState, options: { columnResizeMode }, setColumnSizingInfo } = table;
+  const { density } = getState();
+  const { column } = header;
+  return React__default.createElement(
+    Box,
+    { onDoubleClick: () => {
+      setColumnSizingInfo((old) => Object.assign(Object.assign({}, old), { isResizingColumn: false }));
+      column.resetSize();
+    }, onMouseDown: header.getResizeHandler(), onTouchStart: header.getResizeHandler(), sx: (theme) => ({
+      cursor: "col-resize",
+      marginRight: density === "xl" ? "-24px" : density === "lg" ? "-22px" : density === "md" ? "-20px" : density === "sm" ? "-16px" : "-14px",
+      position: "absolute",
+      right: "1px",
+      paddingLeft: "4px",
+      paddingRight: "4px",
+      "&:active > .mantine-Divider-vertical": {
+        borderLeftColor: getPrimaryColor(theme),
+        opacity: 1
+      }
+    }), style: {
+      transform: column.getIsResizing() && columnResizeMode === "onEnd" ? `translateX(${(_a = getState().columnSizingInfo.deltaOffset) !== null && _a !== void 0 ? _a : 0}px)` : void 0
+    } },
+    React__default.createElement(Divider, { orientation: "vertical", size: "lg", sx: {
+      borderRadius: "2px",
+      borderWidth: "4px",
+      height: "24px",
+      touchAction: "none",
+      transition: column.getIsResizing() ? void 0 : "all 100ms ease-in-out",
+      userSelect: "none",
+      zIndex: 4
+    } })
+  );
+};
+const MRT_TableHeadCellSortLabel = ({ header, table }) => {
+  const { options: { icons: { IconSortDescending: IconSortDescending2, IconSortAscending: IconSortAscending2, IconArrowsSort: IconArrowsSort2 }, localization } } = table;
+  const { column } = header;
+  const { columnDef } = column;
+  const sortTooltip = column.getIsSorted() ? column.getIsSorted() === "desc" ? localization.sortedByColumnDesc.replace("{column}", columnDef.header) : localization.sortedByColumnAsc.replace("{column}", columnDef.header) : localization.unsorted;
+  return React__default.createElement(
+    Tooltip,
+    { withinPortal: true, withArrow: true, position: "top", label: sortTooltip },
+    React__default.createElement(ActionIcon, { "aria-label": sortTooltip, size: "xs", sx: {
+      opacity: column.getIsSorted() ? 1 : 0,
+      transition: "opacity 100ms ease-in-out",
+      "&:hover": {
+        opacity: 1
+      }
+    } }, column.getIsSorted() === "desc" ? React__default.createElement(IconSortDescending2, null) : column.getIsSorted() === "asc" ? React__default.createElement(IconSortAscending2, null) : React__default.createElement(IconArrowsSort2, null))
+  );
+};
+const MRT_TableHeadCell = ({ header, table }) => {
+  var _a, _b, _c, _d;
+  const theme = useMantineTheme();
+  const { getState, options: { enableColumnActions, enableColumnDragging, enableColumnOrdering, enableGrouping, enableMultiSort, layoutMode, mantineTableHeadCellProps }, refs: { tableHeadCellRefs }, setHoveredColumn } = table;
+  const { density, draggingColumn, grouping, hoveredColumn } = getState();
+  const { column } = header;
+  const { columnDef } = column;
+  const { columnDefType } = columnDef;
+  const mTableHeadCellProps = mantineTableHeadCellProps instanceof Function ? mantineTableHeadCellProps({ column, table }) : mantineTableHeadCellProps;
+  const mcTableHeadCellProps = columnDef.mantineTableHeadCellProps instanceof Function ? columnDef.mantineTableHeadCellProps({ column, table }) : columnDef.mantineTableHeadCellProps;
+  const tableCellProps = Object.assign(Object.assign({}, mTableHeadCellProps), mcTableHeadCellProps);
+  const showColumnActions = (enableColumnActions || columnDef.enableColumnActions) && columnDef.enableColumnActions !== false;
+  const showDragHandle = enableColumnDragging !== false && columnDef.enableColumnDragging !== false && (enableColumnDragging || enableColumnOrdering && columnDef.enableColumnOrdering !== false || enableGrouping && columnDef.enableGrouping !== false && !grouping.includes(column.id));
+  const headerPL = useMemo(() => {
+    let pl = 0;
+    if (column.getCanSort())
+      pl++;
+    if (showColumnActions)
+      pl += 1.75;
+    if (showDragHandle)
+      pl += 1.25;
+    return pl;
+  }, [showColumnActions, showDragHandle]);
+  const draggingBorder = useMemo(() => (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id ? `1px dashed ${theme.colors.gray[7]} !important` : (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === column.id ? `2px dashed ${getPrimaryColor(theme)} !important` : void 0, [draggingColumn, hoveredColumn]);
+  const draggingBorders = draggingBorder ? {
+    borderLeft: draggingBorder,
+    borderRight: draggingBorder,
+    borderTop: draggingBorder
+  } : void 0;
+  const handleDragEnter = (_e) => {
+    if (enableGrouping && (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === "drop-zone") {
+      setHoveredColumn(null);
+    }
+    if (enableColumnOrdering && draggingColumn && columnDefType !== "group") {
+      setHoveredColumn(columnDef.enableColumnOrdering !== false ? column : null);
+    }
+  };
+  const headerElement = (columnDef === null || columnDef === void 0 ? void 0 : columnDef.Header) instanceof Function ? (_a = columnDef === null || columnDef === void 0 ? void 0 : columnDef.Header) === null || _a === void 0 ? void 0 : _a.call(columnDef, {
+    column,
+    header,
+    table
+  }) : (_b = columnDef === null || columnDef === void 0 ? void 0 : columnDef.Header) !== null && _b !== void 0 ? _b : columnDef.header;
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "th", align: columnDefType === "group" ? "center" : "left", colSpan: header.colSpan, onDragEnter: handleDragEnter, ref: (node) => {
+      if (node) {
+        tableHeadCellRefs.current[column.id] = node;
+      }
+    } }, tableCellProps, { sx: (theme2) => Object.assign(Object.assign({ flexDirection: layoutMode === "grid" ? "column" : void 0, fontWeight: "bold", overflow: "visible", padding: density === "xl" ? "23px" : density === "lg" ? "20px" : density === "md" ? "16px" : density === "sm" ? "12px" : "10px", userSelect: enableMultiSort && column.getCanSort() ? "none" : void 0, verticalAlign: "top", zIndex: column.getIsResizing() || (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id ? 3 : column.getIsPinned() && columnDefType !== "group" ? 2 : 1, "&:hover .mantine-ActionIcon-root": {
+      opacity: 1
+    } }, getCommonCellStyles({
+      column,
+      header,
+      table,
+      tableCellProps,
+      theme: theme2
+    })), draggingBorders) }),
+    header.isPlaceholder ? null : React__default.createElement(
+      Flex,
+      { className: "mantine-TableHeadCell-Content", sx: {
+        alignItems: "flex-start",
+        flexDirection: (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.align) === "right" ? "row-reverse" : "row",
+        justifyContent: columnDefType === "group" || (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.align) === "center" ? "center" : column.getCanResize() ? "space-between" : "flex-start",
+        position: "relative",
+        width: "100%"
+      } },
+      React__default.createElement(
+        Flex,
+        { className: "mantine-TableHeadCell-Content-Labels", onClick: column.getToggleSortingHandler(), sx: {
+          alignItems: "center",
+          cursor: column.getCanSort() && columnDefType !== "group" ? "pointer" : void 0,
+          flexDirection: (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.align) === "right" ? "row-reverse" : "row",
+          overflow: columnDefType === "data" ? "hidden" : void 0,
+          paddingLeft: (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.align) === "center" ? `${headerPL}rem` : void 0
+        } },
+        React__default.createElement(Flex, { className: "mantine-TableHeadCell-Content-Wrapper", sx: {
+          overflow: columnDefType === "data" ? "hidden" : void 0,
+          textOverflow: "ellipsis",
+          whiteSpace: ((_d = (_c = columnDef.header) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) < 20 ? "nowrap" : "normal"
+        }, title: columnDefType === "data" ? columnDef.header : void 0 }, headerElement),
+        column.getCanSort() && React__default.createElement(MRT_TableHeadCellSortLabel, { header, table }),
+        column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterLabel, { header, table })
+      ),
+      columnDefType !== "group" && React__default.createElement(
+        Flex,
+        { className: "mantine-TableHeadCell-Content-Actions", sx: {
+          alignItems: "center",
+          alignSelf: "center",
+          whiteSpace: "nowrap"
+        } },
+        showDragHandle && React__default.createElement(MRT_TableHeadCellGrabHandle, { column, table, tableHeadCellRef: {
+          current: tableHeadCellRefs.current[column.id]
+        } }),
+        showColumnActions && React__default.createElement(MRT_ColumnActionMenu, { header, table })
+      ),
+      column.getCanResize() && React__default.createElement(MRT_TableHeadCellResizeHandle, { header, table })
+    ),
+    column.getCanFilter() && React__default.createElement(MRT_TableHeadCellFilterContainer, { header, table })
+  );
+};
+const MRT_TableHeadRow = ({ headerGroup, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight }) => {
+  const { getState, options: { enableStickyHeader, layoutMode, mantineTableHeadRowProps } } = table;
+  const { isFullScreen } = getState();
+  const tableRowProps = mantineTableHeadRowProps instanceof Function ? mantineTableHeadRowProps({ headerGroup, table }) : mantineTableHeadRowProps;
+  const stickyHeader = enableStickyHeader || isFullScreen;
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "tr" }, tableRowProps, { sx: (theme) => Object.assign(Object.assign({ backgroundColor: theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white, boxShadow: `4px 0 8px ${theme.fn.rgba(theme.black, 0.1)}`, display: layoutMode === "grid" ? "flex" : "table-row", top: stickyHeader ? 0 : void 0 }, (tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) instanceof Function ? tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx(theme) : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx), { position: stickyHeader ? "sticky" : void 0 }) }),
+    virtualPaddingLeft ? React__default.createElement("th", { style: { display: "flex", width: virtualPaddingLeft } }) : null,
+    (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : headerGroup.headers).map((headerOrVirtualHeader) => {
+      const header = virtualColumns ? headerGroup.headers[headerOrVirtualHeader.index] : headerOrVirtualHeader;
+      return React__default.createElement(MRT_TableHeadCell, { header, key: header.id, table });
+    }),
+    virtualPaddingRight ? React__default.createElement("th", { style: { display: "flex", width: virtualPaddingRight } }) : null
+  );
+};
+const MRT_TableHead = ({ table, virtualColumns, virtualPaddingLeft, virtualPaddingRight }) => {
+  const { getHeaderGroups, getState, options: { enableStickyHeader, layoutMode, mantineTableHeadProps } } = table;
+  const { isFullScreen } = getState();
+  const tableHeadProps = mantineTableHeadProps instanceof Function ? mantineTableHeadProps({ table }) : mantineTableHeadProps;
+  const stickyHeader = enableStickyHeader || isFullScreen;
+  return React__default.createElement(Box, Object.assign({ component: "thead" }, tableHeadProps, { sx: (theme) => Object.assign({ display: layoutMode === "grid" ? "grid" : "table-row-group", opacity: 0.97, position: stickyHeader && layoutMode === "grid" ? "sticky" : "relative", top: stickyHeader ? 0 : void 0, zIndex: stickyHeader ? 2 : void 0 }, (tableHeadProps === null || tableHeadProps === void 0 ? void 0 : tableHeadProps.sx) instanceof Function ? tableHeadProps === null || tableHeadProps === void 0 ? void 0 : tableHeadProps.sx(theme) : tableHeadProps === null || tableHeadProps === void 0 ? void 0 : tableHeadProps.sx) }), getHeaderGroups().map((headerGroup) => React__default.createElement(MRT_TableHeadRow, { headerGroup, key: headerGroup.id, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight })));
+};
+const MRT_EditCellTextInput = ({ cell, showLabel, table }) => {
+  var _a;
+  const { getState, options: { mantineEditTextInputProps }, refs: { editInputRefs }, setEditingCell, setEditingRow } = table;
+  const { column, row } = cell;
+  const { columnDef } = column;
+  const { editingRow } = getState();
+  const [value, setValue] = useState(() => cell.getValue());
+  const mTableBodyCellEditTextInputProps = mantineEditTextInputProps instanceof Function ? mantineEditTextInputProps({ cell, column, row, table }) : mantineEditTextInputProps;
+  const mcTableBodyCellEditTextInputProps = columnDef.mantineEditTextInputProps instanceof Function ? columnDef.mantineEditTextInputProps({
+    cell,
+    column,
+    row,
+    table
+  }) : columnDef.mantineEditTextInputProps;
+  const textFieldProps = Object.assign(Object.assign({}, mTableBodyCellEditTextInputProps), mcTableBodyCellEditTextInputProps);
+  const saveRow = (newValue) => {
+    if (editingRow) {
+      setEditingRow(Object.assign(Object.assign({}, editingRow), { _valuesCache: Object.assign(Object.assign({}, editingRow._valuesCache), { [column.id]: newValue }) }));
+    }
+  };
+  const handleChange = (event) => {
+    var _a2;
+    (_a2 = textFieldProps.onChange) === null || _a2 === void 0 ? void 0 : _a2.call(textFieldProps, event);
+    setValue(event.target.value);
+  };
+  const handleBlur = (event) => {
+    var _a2;
+    (_a2 = textFieldProps.onBlur) === null || _a2 === void 0 ? void 0 : _a2.call(textFieldProps, event);
+    saveRow(value);
+    setEditingCell(null);
+  };
+  const handleEnterKeyDown = (event) => {
+    var _a2, _b;
+    (_a2 = textFieldProps.onKeyDown) === null || _a2 === void 0 ? void 0 : _a2.call(textFieldProps, event);
+    if (event.key === "Enter") {
+      (_b = editInputRefs.current[column.id]) === null || _b === void 0 ? void 0 : _b.blur();
+    }
+  };
+  if (columnDef.Edit) {
+    return React__default.createElement(React__default.Fragment, null, (_a = columnDef.Edit) === null || _a === void 0 ? void 0 : _a.call(columnDef, { cell, column, row, table }));
+  }
+  return React__default.createElement(TextInput, Object.assign({
+    disabled: (columnDef.enableEditing instanceof Function ? columnDef.enableEditing(row) : columnDef.enableEditing) === false,
+    // inputRef={(inputRef) => {
+    //   if (inputRef) {
+    //     editInputRefs.current[column.id] = inputRef;
+    //     if (textFieldProps.inputRef) {
+    //       textFieldProps.inputRef = inputRef;
+    //     }
+    //   }
+    // }}
+    label: showLabel ? column.columnDef.header : void 0,
+    name: column.id,
+    placeholder: columnDef.header,
+    value,
+    variant: "default"
+  }, textFieldProps, { onClick: (e) => {
+    var _a2;
+    e.stopPropagation();
+    (_a2 = textFieldProps === null || textFieldProps === void 0 ? void 0 : textFieldProps.onClick) === null || _a2 === void 0 ? void 0 : _a2.call(textFieldProps, e);
+  }, onBlur: handleBlur, onChange: handleChange, onKeyDown: handleEnterKeyDown }));
+};
+const MRT_CopyButton = ({ cell, children, table }) => {
+  const { options: { localization, mantineCopyButtonProps } } = table;
+  const { column, row } = cell;
+  const { columnDef } = column;
+  const mTableBodyCellCopyButtonProps = mantineCopyButtonProps instanceof Function ? mantineCopyButtonProps({ cell, column, row, table }) : mantineCopyButtonProps;
+  const mcTableBodyCellCopyButtonProps = columnDef.mantineCopyButtonProps instanceof Function ? columnDef.mantineCopyButtonProps({
+    cell,
+    column,
+    row,
+    table
+  }) : columnDef.mantineCopyButtonProps;
+  const buttonProps = Object.assign(Object.assign({}, mTableBodyCellCopyButtonProps), mcTableBodyCellCopyButtonProps);
+  return React__default.createElement(CopyButton, { value: cell.getValue() }, ({ copied, copy }) => {
+    var _a;
+    return React__default.createElement(
+      Tooltip,
+      { withinPortal: true, withArrow: true, openDelay: 1e3, position: "top", label: (_a = buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.title) !== null && _a !== void 0 ? _a : copied ? localization.copiedToClipboard : localization.clickToCopy },
+      React__default.createElement(UnstyledButton, Object.assign({}, buttonProps, { onClick: copy, sx: (theme) => Object.assign({ backgroundColor: "transparent", border: "none", borderRadius: "4px", color: "inherit", cursor: "copy", fontFamily: "inherit", fontSize: "inherit", fontWeight: "inherit", justifyContent: "inherit", letterSpacing: "inherit", margin: "-4px", minWidth: "unset", padding: "4px", textAlign: "inherit", textTransform: "inherit", "&:active": {
+        transform: "translateY(1px)"
+      }, "&:hover": {
+        backgroundColor: theme.fn.rgba(getPrimaryColor(theme), 0.1)
+      } }, (buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.sx) instanceof Function ? buttonProps.sx(theme) : buttonProps === null || buttonProps === void 0 ? void 0 : buttonProps.sx), title: void 0 }), children)
+    );
+  });
+};
+const MRT_TableBodyRowGrabHandle = ({ cell, rowRef, table }) => {
+  const { options: { mantineRowDragHandleProps } } = table;
+  const { row } = cell;
+  const actionIconProps = mantineRowDragHandleProps instanceof Function ? mantineRowDragHandleProps({ row, table }) : mantineRowDragHandleProps;
+  const handleDragStart = (event) => {
+    var _a;
+    (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onDragStart) === null || _a === void 0 ? void 0 : _a.call(actionIconProps, event);
+    event.dataTransfer.setDragImage(rowRef.current, 0, 0);
+    table.setDraggingRow(row);
+  };
+  const handleDragEnd = (event) => {
+    var _a;
+    (_a = actionIconProps === null || actionIconProps === void 0 ? void 0 : actionIconProps.onDragEnd) === null || _a === void 0 ? void 0 : _a.call(actionIconProps, event);
+    table.setDraggingRow(null);
+    table.setHoveredRow(null);
+  };
+  return React__default.createElement(MRT_GrabHandleButton, { actionIconProps, onDragStart: handleDragStart, onDragEnd: handleDragEnd, table });
+};
+const allowedTypes = ["string", "number"];
+const MRT_TableBodyCellValue = ({ cell, table }) => {
+  var _a, _b, _c, _d;
+  const { getState, options: { enableFilterMatchHighlighting } } = table;
+  const { column, row } = cell;
+  const { columnDef } = column;
+  const { globalFilter } = getState();
+  const filterValue = column.getFilterValue();
+  let renderedCellValue = cell.getIsAggregated() && columnDef.AggregatedCell ? columnDef.AggregatedCell({
+    cell,
+    column,
+    row,
+    table
+  }) : row.getIsGrouped() && !cell.getIsGrouped() ? null : cell.getIsGrouped() && columnDef.GroupedCell ? columnDef.GroupedCell({
+    cell,
+    column,
+    row,
+    table
+  }) : void 0;
+  const isGroupedValue = renderedCellValue !== void 0;
+  if (!isGroupedValue) {
+    renderedCellValue = cell.renderValue();
+  }
+  if (enableFilterMatchHighlighting && columnDef.enableFilterMatchHighlighting !== false && renderedCellValue && allowedTypes.includes(typeof renderedCellValue) && (filterValue && allowedTypes.includes(typeof filterValue) && columnDef.filterVariant === "text" || globalFilter && allowedTypes.includes(typeof globalFilter))) {
+    const chunks = highlightWords === null || highlightWords === void 0 ? void 0 : highlightWords({
+      text: renderedCellValue === null || renderedCellValue === void 0 ? void 0 : renderedCellValue.toString(),
+      query: ((_b = (_a = column.getFilterValue()) !== null && _a !== void 0 ? _a : globalFilter) !== null && _b !== void 0 ? _b : "").toString()
+    });
+    if ((chunks === null || chunks === void 0 ? void 0 : chunks.length) > 1 || ((_c = chunks === null || chunks === void 0 ? void 0 : chunks[0]) === null || _c === void 0 ? void 0 : _c.match)) {
+      renderedCellValue = React__default.createElement("span", { "aria-label": renderedCellValue, role: "note" }, (_d = chunks === null || chunks === void 0 ? void 0 : chunks.map(({ key, match, text }) => React__default.createElement(Box, { "aria-hidden": "true", component: "span", key, sx: match ? (theme) => ({
+        backgroundColor: theme.colors.yellow[theme.colorScheme === "dark" ? 9 : 5],
+        borderRadius: "2px",
+        color: theme.colorScheme === "dark" ? theme.white : theme.black,
+        p: "2px 1px"
+      }) : void 0 }, text))) !== null && _d !== void 0 ? _d : renderedCellValue);
+    }
+  }
+  if (columnDef.Cell && !isGroupedValue) {
+    renderedCellValue = columnDef.Cell({
+      cell,
+      renderedCellValue,
+      column,
+      row,
+      table
+    });
+  }
+  return React__default.createElement(React__default.Fragment, null, renderedCellValue);
+};
+const MRT_TableBodyCell = ({ cell, enableHover, measureElement, numRows, rowIndex, rowRef, table, virtualCell }) => {
+  var _a, _b, _c, _d;
+  const theme = useMantineTheme();
+  const { getState, options: { editingMode, enableClickToCopy, enableColumnOrdering, enableEditing, enableGrouping, enableRowNumbers, layoutMode, mantineTableBodyCellProps, mantineSkeletonProps, rowNumberMode }, refs: { editInputRefs }, setEditingCell, setHoveredColumn } = table;
+  const { draggingColumn, draggingRow, hoveredRow, editingCell, editingRow, hoveredColumn, density, isLoading, showSkeletons } = getState();
+  const { column, row } = cell;
+  const { columnDef } = column;
+  const { columnDefType } = columnDef;
+  const mTableCellBodyProps = mantineTableBodyCellProps instanceof Function ? mantineTableBodyCellProps({ cell, column, row, table }) : mantineTableBodyCellProps;
+  const mcTableCellBodyProps = columnDef.mantineTableBodyCellProps instanceof Function ? columnDef.mantineTableBodyCellProps({ cell, column, row, table }) : columnDef.mantineTableBodyCellProps;
+  const tableCellProps = Object.assign(Object.assign({}, mTableCellBodyProps), mcTableCellBodyProps);
+  const skeletonProps = mantineSkeletonProps instanceof Function ? mantineSkeletonProps({ cell, column, row, table }) : mantineSkeletonProps;
+  const [skeletonWidth, setSkeletonWidth] = useState(0);
+  useEffect(() => setSkeletonWidth(isLoading || showSkeletons ? columnDefType === "display" ? column.getSize() / 2 : Math.round(Math.random() * (column.getSize() - column.getSize() / 3) + column.getSize() / 3) : 100), []);
+  const draggingBorders = useMemo(() => {
+    const isDraggingColumn = (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id;
+    const isHoveredColumn = (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === column.id;
+    const isDraggingRow = (draggingRow === null || draggingRow === void 0 ? void 0 : draggingRow.id) === row.id;
+    const isHoveredRow = (hoveredRow === null || hoveredRow === void 0 ? void 0 : hoveredRow.id) === row.id;
+    const isFirstColumn = getIsFirstColumn(column, table);
+    const isLastColumn = getIsLastColumn(column, table);
+    const isLastRow = rowIndex === numRows - 1;
+    const borderStyle = isDraggingColumn || isDraggingRow ? `1px dashed ${theme.colors.gray[7]} !important` : isHoveredColumn || isHoveredRow ? `2px dashed ${getPrimaryColor(theme)} !important` : void 0;
+    return borderStyle ? {
+      borderLeft: isDraggingColumn || isHoveredColumn || (isDraggingRow || isHoveredRow) && isFirstColumn ? borderStyle : void 0,
+      borderRight: isDraggingColumn || isHoveredColumn || (isDraggingRow || isHoveredRow) && isLastColumn ? borderStyle : void 0,
+      borderBottom: isDraggingRow || isHoveredRow || isLastRow ? borderStyle : void 0,
+      borderTop: isDraggingRow || isHoveredRow ? borderStyle : void 0
+    } : void 0;
+  }, [draggingColumn, draggingRow, hoveredColumn, hoveredRow, rowIndex]);
+  const isEditable = (enableEditing instanceof Function ? enableEditing(row) : enableEditing) && (columnDef.enableEditing instanceof Function ? columnDef.enableEditing(row) : columnDef.enableEditing) !== false;
+  const isEditing = isEditable && editingMode !== "modal" && (editingMode === "table" || (editingRow === null || editingRow === void 0 ? void 0 : editingRow.id) === row.id || (editingCell === null || editingCell === void 0 ? void 0 : editingCell.id) === cell.id) && !row.getIsGrouped();
+  const handleDoubleClick = (event) => {
+    var _a2;
+    (_a2 = tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.onDoubleClick) === null || _a2 === void 0 ? void 0 : _a2.call(tableCellProps, event);
+    if (isEditable && editingMode === "cell") {
+      setEditingCell(cell);
+      setTimeout(() => {
+        var _a3;
+        const textField = editInputRefs.current[column.id];
+        if (textField) {
+          textField.focus();
+          (_a3 = textField.select) === null || _a3 === void 0 ? void 0 : _a3.call(textField);
+        }
+      }, 100);
+    }
+  };
+  const handleDragEnter = (e) => {
+    var _a2;
+    (_a2 = tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.onDragEnter) === null || _a2 === void 0 ? void 0 : _a2.call(tableCellProps, e);
+    if (enableGrouping && (hoveredColumn === null || hoveredColumn === void 0 ? void 0 : hoveredColumn.id) === "drop-zone") {
+      setHoveredColumn(null);
+    }
+    if (enableColumnOrdering && draggingColumn) {
+      setHoveredColumn(columnDef.enableColumnOrdering !== false ? column : null);
+    }
+  };
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "td", "data-index": virtualCell === null || virtualCell === void 0 ? void 0 : virtualCell.index, ref: (node) => {
+      if (node) {
+        measureElement === null || measureElement === void 0 ? void 0 : measureElement(node);
+      }
+    } }, tableCellProps, { onDragEnter: handleDragEnter, onDoubleClick: handleDoubleClick, sx: (theme2) => Object.assign(Object.assign({ alignItems: layoutMode === "grid" ? "center" : void 0, cursor: isEditable && editingMode === "cell" ? "pointer" : "inherit", justifyContent: layoutMode === "grid" ? tableCellProps.align : void 0, overflow: "hidden", paddingLeft: column.id === "mrt-row-expand" ? `${row.depth + 1}rem !important` : void 0, textOverflow: columnDefType !== "display" ? "ellipsis" : void 0, whiteSpace: density === "xs" ? "nowrap" : "normal", zIndex: (draggingColumn === null || draggingColumn === void 0 ? void 0 : draggingColumn.id) === column.id ? 2 : column.getIsPinned() ? 1 : 0, "&:hover": {
+      backgroundColor: enableHover && isEditable && ["table", "cell"].includes(editingMode !== null && editingMode !== void 0 ? editingMode : "") ? theme2.colorScheme === "dark" ? `${theme2.fn.lighten(theme2.colors.dark[7], 0.2)} !important` : `${theme2.fn.darken(theme2.colors.dark[7], 0.1)} !important` : void 0
+    } }, getCommonCellStyles({
+      column,
+      table,
+      theme: theme2,
+      tableCellProps
+    })), draggingBorders) }),
+    React__default.createElement(React__default.Fragment, null, cell.getIsPlaceholder() ? (_b = (_a = columnDef.PlaceholderCell) === null || _a === void 0 ? void 0 : _a.call(columnDef, { cell, column, row, table })) !== null && _b !== void 0 ? _b : null : isLoading || showSkeletons ? React__default.createElement(Skeleton, Object.assign({ height: 20, width: skeletonWidth }, skeletonProps)) : enableRowNumbers && rowNumberMode === "static" && column.id === "mrt-row-numbers" ? rowIndex + 1 : column.id === "mrt-row-drag" ? React__default.createElement(MRT_TableBodyRowGrabHandle, { cell, rowRef, table }) : columnDefType === "display" && (column.id === "mrt-row-select" || column.id === "mrt-row-expand" || !row.getIsGrouped()) ? (_c = columnDef.Cell) === null || _c === void 0 ? void 0 : _c.call(columnDef, {
+      cell,
+      column,
+      row,
+      renderedCellValue: cell.getValue(),
+      table
+    }) : isEditing ? React__default.createElement(MRT_EditCellTextInput, { cell, table }) : (enableClickToCopy || columnDef.enableClickToCopy) && columnDef.enableClickToCopy !== false ? React__default.createElement(
+      MRT_CopyButton,
+      { cell, table },
+      React__default.createElement(MRT_TableBodyCellValue, { cell, table })
+    ) : React__default.createElement(MRT_TableBodyCellValue, { cell, table })),
+    cell.getIsGrouped() && !columnDef.GroupedCell && React__default.createElement(
+      React__default.Fragment,
+      null,
+      " (",
+      (_d = row.subRows) === null || _d === void 0 ? void 0 : _d.length,
+      ")"
+    )
+  );
+};
+const Memo_MRT_TableBodyCell = memo(MRT_TableBodyCell, (prev, next) => next.cell === prev.cell);
+const MRT_TableDetailPanel = ({ parentRowRef, row, table, virtualRow }) => {
+  const { getVisibleLeafColumns, getState, options: { layoutMode, mantineTableBodyRowProps, mantineDetailPanelProps, renderDetailPanel } } = table;
+  const { isLoading } = getState();
+  const tableRowProps = mantineTableBodyRowProps instanceof Function ? mantineTableBodyRowProps({ isDetailPanel: true, row, table }) : mantineTableBodyRowProps;
+  const tableCellProps = mantineDetailPanelProps instanceof Function ? mantineDetailPanelProps({ row, table }) : mantineDetailPanelProps;
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "tr", className: "mantine-TableBodyCell-DetailPanel" }, tableRowProps, { sx: (theme) => {
+      var _a, _b;
+      return Object.assign({ display: layoutMode === "grid" ? "flex" : "table-row", position: virtualRow ? "absolute" : void 0, top: virtualRow ? `${(_b = (_a = parentRowRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.height}px` : void 0, transform: virtualRow ? `translateY(${virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.start}px)` : void 0, width: "100%", zIndex: virtualRow ? 2 : void 0 }, (tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) instanceof Function ? tableRowProps.sx(theme) : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx);
+    } }),
+    React__default.createElement(Box, Object.assign({ component: "td", className: "mantine-TableBodyCell-DetailPanel", colSpan: getVisibleLeafColumns().length }, tableCellProps, { sx: (theme) => Object.assign({ backgroundColor: virtualRow ? theme.fn.lighten(theme.colors.dark[7], 0.06) : void 0, borderBottom: !row.getIsExpanded() ? "none" : void 0, display: layoutMode === "grid" ? "flex" : "table-cell", paddingBottom: row.getIsExpanded() ? "16px !important" : "0 !important", paddingTop: row.getIsExpanded() ? "16px !important" : "0 !important", transition: "all 100ms ease-in-out", width: `${table.getTotalSize()}px` }, (tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx) instanceof Function ? tableCellProps.sx(theme) : tableCellProps === null || tableCellProps === void 0 ? void 0 : tableCellProps.sx) }), renderDetailPanel && React__default.createElement(Collapse, { in: row.getIsExpanded() }, !isLoading && renderDetailPanel({ row, table })))
+  );
+};
+const MRT_TableBodyRow = ({ columnVirtualizer, enableHover, measureElement, numRows, row, rowIndex, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight, virtualRow }) => {
+  const { getIsSomeColumnsPinned, getState, options: { enableRowOrdering, layoutMode, memoMode, mantineTableBodyRowProps, renderDetailPanel }, setHoveredRow } = table;
+  const { draggingColumn, draggingRow, editingCell, editingRow, hoveredRow } = getState();
+  const tableRowProps = mantineTableBodyRowProps instanceof Function ? mantineTableBodyRowProps({ row, table }) : mantineTableBodyRowProps;
+  const handleDragEnter = (_e) => {
+    if (enableRowOrdering && draggingRow) {
+      setHoveredRow(row);
+    }
+  };
+  const rowRef = useRef(null);
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Box,
+      Object.assign({ component: "tr", "data-index": virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.index, onDragEnter: handleDragEnter, ref: (node) => {
+        if (node) {
+          rowRef.current = node;
+          measureElement === null || measureElement === void 0 ? void 0 : measureElement(node);
+        }
+      } }, tableRowProps, { sx: (theme) => Object.assign({ backgroundColor: row.getIsSelected() ? theme.fn.rgba(getPrimaryColor(theme), 0.1) : theme.colorScheme === "dark" ? theme.fn.lighten(theme.colors.dark[7], 0.02) : theme.white, display: layoutMode === "grid" ? "flex" : "table-row", opacity: (draggingRow === null || draggingRow === void 0 ? void 0 : draggingRow.id) === row.id || (hoveredRow === null || hoveredRow === void 0 ? void 0 : hoveredRow.id) === row.id ? 0.5 : 1, position: virtualRow ? "absolute" : void 0, top: virtualRow ? 0 : void 0, transform: virtualRow ? `translateY(${virtualRow === null || virtualRow === void 0 ? void 0 : virtualRow.start}px)` : void 0, transition: virtualRow ? "none" : "all 100ms ease-in-out", width: "100%", "&:hover td": {
+        backgroundColor: enableHover !== false && getIsSomeColumnsPinned() ? theme.colorScheme === "dark" ? `${theme.fn.lighten(theme.colors.dark[7], 0.12)}` : `${theme.fn.darken(theme.white, 0.05)}` : row.getIsSelected() ? theme.fn.rgba(getPrimaryColor(theme), 0.2) : void 0
+      } }, (tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) instanceof Function ? tableRowProps.sx(theme) : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) }),
+      virtualPaddingLeft ? React__default.createElement("td", { style: { display: "flex", width: virtualPaddingLeft } }) : null,
+      (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : row.getVisibleCells()).map((cellOrVirtualCell) => {
+        const cell = columnVirtualizer ? row.getVisibleCells()[cellOrVirtualCell.index] : cellOrVirtualCell;
+        const props = {
+          cell,
+          enableHover,
+          key: cell.id,
+          measureElement: columnVirtualizer === null || columnVirtualizer === void 0 ? void 0 : columnVirtualizer.measureElement,
+          numRows,
+          rowIndex,
+          rowRef,
+          table,
+          virtualCell: columnVirtualizer ? cellOrVirtualCell : void 0
+        };
+        return memoMode === "cells" && cell.column.columnDef.columnDefType === "data" && !draggingColumn && !draggingRow && (editingCell === null || editingCell === void 0 ? void 0 : editingCell.id) !== cell.id && (editingRow === null || editingRow === void 0 ? void 0 : editingRow.id) !== row.id ? React__default.createElement(Memo_MRT_TableBodyCell, Object.assign({}, props)) : React__default.createElement(MRT_TableBodyCell, Object.assign({}, props));
+      }),
+      virtualPaddingRight ? React__default.createElement("td", { style: { display: "flex", width: virtualPaddingRight } }) : null
+    ),
+    renderDetailPanel && !row.getIsGrouped() && React__default.createElement(MRT_TableDetailPanel, { parentRowRef: rowRef, row, table, virtualRow })
+  );
+};
+const Memo_MRT_TableBodyRow = memo(MRT_TableBodyRow, (prev, next) => prev.row === next.row && prev.rowIndex === next.rowIndex);
+const MRT_TableBody = ({ columnVirtualizer, enableHover, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight }) => {
+  var _a, _b;
+  const { getRowModel, getPrePaginationRowModel, getState, options: { enableGlobalFilterRankedResults, enablePagination, enableRowVirtualization, layoutMode, localization, mantineTableBodyProps, manualExpanding, manualFiltering, manualGrouping, manualPagination, manualSorting, memoMode, rowVirtualizerInstanceRef, rowVirtualizerProps }, refs: { tableContainerRef, tablePaperRef } } = table;
+  const { columnFilters, density, expanded, globalFilter, globalFilterFn, pagination, sorting } = getState();
+  const tableBodyProps = mantineTableBodyProps instanceof Function ? mantineTableBodyProps({ table }) : mantineTableBodyProps;
+  const vProps = rowVirtualizerProps instanceof Function ? rowVirtualizerProps({ table }) : rowVirtualizerProps;
+  const shouldRankResults = useMemo(() => !manualExpanding && !manualFiltering && !manualGrouping && !manualSorting && enableGlobalFilterRankedResults && globalFilter && globalFilterFn === "fuzzy" && expanded !== true && !Object.values(sorting).some(Boolean) && !Object.values(expanded).some(Boolean), [
+    enableGlobalFilterRankedResults,
+    expanded,
+    globalFilter,
+    manualExpanding,
+    manualFiltering,
+    manualGrouping,
+    manualSorting,
+    sorting
+  ]);
+  const rows = useMemo(() => {
+    if (!shouldRankResults)
+      return getRowModel().rows;
+    const rankedRows = getPrePaginationRowModel().rows.sort((a, b) => rankGlobalFuzzy(a, b));
+    if (enablePagination && !manualPagination) {
+      const start = pagination.pageIndex * pagination.pageSize;
+      return rankedRows.slice(start, start + pagination.pageSize);
+    }
+    return rankedRows;
+  }, [
+    shouldRankResults,
+    shouldRankResults ? getPrePaginationRowModel().rows : getRowModel().rows,
+    pagination.pageIndex,
+    pagination.pageSize
+  ]);
+  const rowVirtualizer = enableRowVirtualization ? useVirtualizer(Object.assign({ count: rows.length, estimateSize: () => density === "xs" ? 37 : density === "md" ? 58 : 73, getScrollElement: () => tableContainerRef.current, measureElement: (element) => element === null || element === void 0 ? void 0 : element.getBoundingClientRect().height, overscan: 4 }, vProps)) : void 0;
+  if (rowVirtualizerInstanceRef && rowVirtualizer) {
+    rowVirtualizerInstanceRef.current = rowVirtualizer;
+  }
+  const virtualRows = rowVirtualizer ? rowVirtualizer.getVirtualItems() : void 0;
+  return React__default.createElement(Box, Object.assign({ component: "tbody" }, tableBodyProps, { sx: (theme) => Object.assign({ display: layoutMode === "grid" ? "grid" : "table-row-group", height: rowVirtualizer ? `${rowVirtualizer.getTotalSize()}px` : "inherit", minHeight: !rows.length ? "100px" : void 0, position: "relative" }, (tableBodyProps === null || tableBodyProps === void 0 ? void 0 : tableBodyProps.sx) instanceof Function ? tableBodyProps === null || tableBodyProps === void 0 ? void 0 : tableBodyProps.sx(theme) : tableBodyProps === null || tableBodyProps === void 0 ? void 0 : tableBodyProps.sx) }), !rows.length ? React__default.createElement(
+    "tr",
+    { style: { display: layoutMode === "grid" ? "grid" : "table-row" } },
+    React__default.createElement(
+      "td",
+      { colSpan: table.getVisibleLeafColumns().length, style: { display: layoutMode === "grid" ? "grid" : "table-cell" } },
+      React__default.createElement(Text, { sx: {
+        color: "gray",
+        fontStyle: "italic",
+        maxWidth: `min(100vw, ${(_b = (_a = tablePaperRef.current) === null || _a === void 0 ? void 0 : _a.clientWidth) !== null && _b !== void 0 ? _b : 360}px)`,
+        paddingTop: "2rem",
+        paddingBottom: "2rem",
+        textAlign: "center",
+        width: "100%"
+      } }, globalFilter || columnFilters.length ? localization.noResultsFound : localization.noRecordsToDisplay)
+    )
+  ) : React__default.createElement(React__default.Fragment, null, (virtualRows !== null && virtualRows !== void 0 ? virtualRows : rows).map((rowOrVirtualRow, rowIndex) => {
+    const row = rowVirtualizer ? rows[rowOrVirtualRow.index] : rowOrVirtualRow;
+    const props = {
+      columnVirtualizer,
+      enableHover,
+      key: row.id,
+      measureElement: rowVirtualizer === null || rowVirtualizer === void 0 ? void 0 : rowVirtualizer.measureElement,
+      numRows: rows.length,
+      row,
+      rowIndex: rowVirtualizer ? rowOrVirtualRow.index : rowIndex,
+      table,
+      virtualColumns,
+      virtualPaddingLeft,
+      virtualPaddingRight,
+      virtualRow: rowVirtualizer ? rowOrVirtualRow : void 0
+    };
+    return memoMode === "rows" ? React__default.createElement(Memo_MRT_TableBodyRow, Object.assign({}, props)) : React__default.createElement(MRT_TableBodyRow, Object.assign({}, props));
+  })));
+};
+const Memo_MRT_TableBody = memo(MRT_TableBody, (prev, next) => prev.table.options.data === next.table.options.data);
+const MRT_TableFooterCell = ({ footer, table }) => {
+  var _a, _b, _c;
+  const { options: { layoutMode, mantineTableFooterCellProps } } = table;
+  const { column } = footer;
+  const { columnDef } = column;
+  const { columnDefType } = columnDef;
+  const mTableFooterCellProps = mantineTableFooterCellProps instanceof Function ? mantineTableFooterCellProps({ column, table }) : mantineTableFooterCellProps;
+  const mcTableFooterCellProps = columnDef.mantineTableFooterCellProps instanceof Function ? columnDef.mantineTableFooterCellProps({ column, table }) : columnDef.mantineTableFooterCellProps;
+  const tableCellProps = Object.assign(Object.assign({}, mTableFooterCellProps), mcTableFooterCellProps);
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "th", align: columnDefType === "group" ? "center" : "left", colSpan: footer.colSpan }, tableCellProps, { sx: (theme) => Object.assign({ display: layoutMode === "grid" ? "grid" : "table-cell", fontWeight: "bold", justifyContent: columnDefType === "group" ? "center" : void 0, padding: "8px", verticalAlign: "top", zIndex: column.getIsPinned() && columnDefType !== "group" ? 2 : 1 }, getCommonCellStyles({
+      column,
+      table,
+      theme,
+      tableCellProps
+    })) }),
+    React__default.createElement(React__default.Fragment, null, footer.isPlaceholder ? null : (_c = (_b = columnDef.Footer instanceof Function ? (_a = columnDef.Footer) === null || _a === void 0 ? void 0 : _a.call(columnDef, {
+      column,
+      footer,
+      table
+    }) : columnDef.Footer) !== null && _b !== void 0 ? _b : columnDef.footer) !== null && _c !== void 0 ? _c : null)
+  );
+};
+const MRT_TableFooterRow = ({ footerGroup, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight }) => {
+  var _a;
+  const { options: { layoutMode, mantineTableFooterRowProps } } = table;
+  if (!((_a = footerGroup.headers) === null || _a === void 0 ? void 0 : _a.some((header) => typeof header.column.columnDef.footer === "string" && !!header.column.columnDef.footer || header.column.columnDef.Footer)))
+    return null;
+  const tableRowProps = mantineTableFooterRowProps instanceof Function ? mantineTableFooterRowProps({ footerGroup, table }) : mantineTableFooterRowProps;
+  return React__default.createElement(
+    Box,
+    Object.assign({ component: "tr" }, tableRowProps, { sx: (theme) => Object.assign({ backgroundColor: theme.fn.lighten(theme.colorScheme === "dark" ? theme.colors.dark[7] : theme.white, 0.06), display: layoutMode === "grid" ? "flex" : "table-row", width: "100%" }, (tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) instanceof Function ? tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx(theme) : tableRowProps === null || tableRowProps === void 0 ? void 0 : tableRowProps.sx) }),
+    virtualPaddingLeft ? React__default.createElement("th", { style: { display: "flex", width: virtualPaddingLeft } }) : null,
+    (virtualColumns !== null && virtualColumns !== void 0 ? virtualColumns : footerGroup.headers).map((footerOrVirtualFooter) => {
+      const footer = virtualColumns ? footerGroup.headers[footerOrVirtualFooter.index] : footerOrVirtualFooter;
+      return React__default.createElement(MRT_TableFooterCell, { footer, key: footer.id, table });
+    }),
+    virtualPaddingRight ? React__default.createElement("th", { style: { display: "flex", width: virtualPaddingRight } }) : null
+  );
+};
+const MRT_TableFooter = ({ table, virtualColumns, virtualPaddingLeft, virtualPaddingRight }) => {
+  const { getFooterGroups, getState, options: { enableStickyFooter, layoutMode, mantineTableFooterProps } } = table;
+  const { isFullScreen } = getState();
+  const tableFooterProps = mantineTableFooterProps instanceof Function ? mantineTableFooterProps({ table }) : mantineTableFooterProps;
+  const stickFooter = (isFullScreen || enableStickyFooter) && enableStickyFooter !== false;
+  return React__default.createElement(Box, Object.assign({ component: "tfoot" }, tableFooterProps, { sx: (theme) => Object.assign({ bottom: stickFooter ? 0 : void 0, display: layoutMode === "grid" ? "grid" : "table-row-group", opacity: stickFooter ? 0.97 : void 0, outline: stickFooter ? theme.colorScheme === "light" ? `1px solid ${theme.colors.gray[3]}` : `1px solid ${theme.colors.gray[7]}` : void 0, position: stickFooter ? "sticky" : void 0, zIndex: stickFooter ? 1 : void 0 }, (tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx) instanceof Function ? tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx(theme) : tableFooterProps === null || tableFooterProps === void 0 ? void 0 : tableFooterProps.sx) }), getFooterGroups().map((footerGroup) => React__default.createElement(MRT_TableFooterRow, { footerGroup, key: footerGroup.id, table, virtualColumns, virtualPaddingLeft, virtualPaddingRight })));
+};
+const MRT_Table = ({ table }) => {
+  var _a, _b, _c, _d;
+  const { getFlatHeaders, getState, options: { columns, columnVirtualizerInstanceRef, columnVirtualizerProps, enableColumnResizing, enableColumnVirtualization, enablePinning, enableTableFooter, enableTableHead, layoutMode, memoMode, mantineTableProps }, refs: { tableContainerRef } } = table;
+  const { columnSizing, columnSizingInfo, columnPinning, columnVisibility, density } = getState();
+  const tableProps = mantineTableProps instanceof Function ? mantineTableProps({ table }) : mantineTableProps;
+  const vProps = columnVirtualizerProps instanceof Function ? columnVirtualizerProps({ table }) : columnVirtualizerProps;
+  const columnSizeVars = useMemo(() => {
+    const headers = getFlatHeaders();
+    const colSizes = {};
+    for (let i = 0; i < headers.length; i++) {
+      const header = headers[i];
+      const colSize = header.getSize();
+      colSizes[`--header-${parseCSSVarId(header.id)}-size`] = colSize;
+      colSizes[`--col-${parseCSSVarId(header.column.id)}-size`] = colSize;
+    }
+    return colSizes;
+  }, [columns, columnSizing, columnSizingInfo, columnVisibility]);
+  const averageColumnWidth = useMemo(() => {
+    var _a2, _b2, _c2, _d2;
+    if (!enableColumnVirtualization)
+      return 0;
+    const columnsWidths = (_d2 = (_c2 = (_b2 = (_a2 = table.getRowModel().rows[0]) === null || _a2 === void 0 ? void 0 : _a2.getCenterVisibleCells()) === null || _b2 === void 0 ? void 0 : _b2.slice(0, 16)) === null || _c2 === void 0 ? void 0 : _c2.map((cell) => cell.column.getSize() * 1.2)) !== null && _d2 !== void 0 ? _d2 : [];
+    return columnsWidths.reduce((a, b) => a + b, 0) / columnsWidths.length;
+  }, [table.getRowModel().rows, columnPinning, columnVisibility]);
+  const [leftPinnedIndexes, rightPinnedIndexes] = useMemo(() => enableColumnVirtualization && enablePinning ? [
+    table.getLeftLeafColumns().map((c) => c.getPinnedIndex()),
+    table.getRightLeafColumns().map((c) => table.getVisibleLeafColumns().length - c.getPinnedIndex() - 1)
+  ] : [[], []], [columnPinning, enableColumnVirtualization, enablePinning]);
+  const columnVirtualizer = enableColumnVirtualization ? useVirtualizer(Object.assign({ count: table.getVisibleLeafColumns().length, estimateSize: () => averageColumnWidth, getScrollElement: () => tableContainerRef.current, horizontal: true, overscan: 3, rangeExtractor: useCallback((range) => [
+    .../* @__PURE__ */ new Set([
+      ...leftPinnedIndexes,
+      ...defaultRangeExtractor(range),
+      ...rightPinnedIndexes
+    ])
+  ], [leftPinnedIndexes, rightPinnedIndexes]) }, vProps)) : void 0;
+  if (columnVirtualizerInstanceRef && columnVirtualizer) {
+    columnVirtualizerInstanceRef.current = columnVirtualizer;
+  }
+  const virtualColumns = columnVirtualizer ? columnVirtualizer.getVirtualItems() : void 0;
+  let virtualPaddingLeft;
+  let virtualPaddingRight;
+  if (columnVirtualizer && (virtualColumns === null || virtualColumns === void 0 ? void 0 : virtualColumns.length)) {
+    virtualPaddingLeft = (_b = (_a = virtualColumns[leftPinnedIndexes.length]) === null || _a === void 0 ? void 0 : _a.start) !== null && _b !== void 0 ? _b : 0;
+    virtualPaddingRight = columnVirtualizer.getTotalSize() - ((_d = (_c = virtualColumns[virtualColumns.length - 1 - rightPinnedIndexes.length]) === null || _c === void 0 ? void 0 : _c.end) !== null && _d !== void 0 ? _d : 0);
+  }
+  const props = {
+    enableHover: tableProps === null || tableProps === void 0 ? void 0 : tableProps.highlightOnHover,
+    table,
+    virtualColumns,
+    virtualPaddingLeft,
+    virtualPaddingRight
+  };
+  return React__default.createElement(
+    Table,
+    Object.assign({ highlightOnHover: true, horizontalSpacing: density, verticalSpacing: density }, tableProps, { sx: (theme) => Object.assign({ display: layoutMode === "grid" ? "grid" : "table", tableLayout: layoutMode !== "grid" && enableColumnResizing ? "fixed" : void 0, "& tr:first-of-type td": {
+      borderTop: `1px solid ${theme.colors.gray[theme.colorScheme === "dark" ? 8 : 3]}`
+    }, "& tr:last-of-type td": {
+      borderBottom: `1px solid ${theme.colors.gray[theme.colorScheme === "dark" ? 8 : 3]}`
+    } }, (tableProps === null || tableProps === void 0 ? void 0 : tableProps.sx) instanceof Function ? tableProps.sx(theme) : tableProps === null || tableProps === void 0 ? void 0 : tableProps.sx), style: Object.assign(Object.assign({}, columnSizeVars), tableProps === null || tableProps === void 0 ? void 0 : tableProps.style) }),
+    enableTableHead && React__default.createElement(MRT_TableHead, Object.assign({}, props)),
+    memoMode === "table-body" || columnSizingInfo.isResizingColumn ? React__default.createElement(Memo_MRT_TableBody, Object.assign({ columnVirtualizer }, props)) : React__default.createElement(MRT_TableBody, Object.assign({ columnVirtualizer }, props)),
+    enableTableFooter && React__default.createElement(MRT_TableFooter, Object.assign({}, props))
+  );
+};
+const useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+const MRT_TableContainer = ({ table }) => {
+  const { getState, options: { enableStickyHeader, mantineTableContainerProps }, refs: { tableContainerRef, bottomToolbarRef, topToolbarRef } } = table;
+  const { isFullScreen } = getState();
+  const [totalToolbarHeight, setTotalToolbarHeight] = useState(0);
+  const tableContainerProps = mantineTableContainerProps instanceof Function ? mantineTableContainerProps({ table }) : mantineTableContainerProps;
+  useIsomorphicLayoutEffect(() => {
+    var _a, _b, _c, _d;
+    const topToolbarHeight = typeof document !== "undefined" ? (_b = (_a = topToolbarRef.current) === null || _a === void 0 ? void 0 : _a.offsetHeight) !== null && _b !== void 0 ? _b : 0 : 0;
+    const bottomToolbarHeight = typeof document !== "undefined" ? (_d = (_c = bottomToolbarRef === null || bottomToolbarRef === void 0 ? void 0 : bottomToolbarRef.current) === null || _c === void 0 ? void 0 : _c.offsetHeight) !== null && _d !== void 0 ? _d : 0 : 0;
+    setTotalToolbarHeight(topToolbarHeight + bottomToolbarHeight);
+  });
+  return React__default.createElement(
+    Box,
+    Object.assign({}, tableContainerProps, { ref: (node) => {
+      if (node) {
+        tableContainerRef.current = node;
+        if (tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.ref) {
+          tableContainerProps.ref.current = node;
+        }
+      }
+    }, sx: (theme) => Object.assign({ maxWidth: "100%", maxHeight: enableStickyHeader ? `clamp(350px, calc(100vh - ${totalToolbarHeight}px), 9999px)` : void 0, overflow: "auto" }, (tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.sx) instanceof Function ? tableContainerProps.sx(theme) : tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.sx), style: Object.assign({ maxHeight: isFullScreen ? `calc(100vh - ${totalToolbarHeight}px)` : void 0 }, tableContainerProps === null || tableContainerProps === void 0 ? void 0 : tableContainerProps.style) }),
+    React__default.createElement(MRT_Table, { table })
+  );
+};
+const MRT_TablePaper = ({ table }) => {
+  const { getState, options: { enableBottomToolbar, enableTopToolbar, mantinePaperProps, renderBottomToolbar, renderTopToolbar }, refs: { tablePaperRef } } = table;
+  const { isFullScreen } = getState();
+  const tablePaperProps = mantinePaperProps instanceof Function ? mantinePaperProps({ table }) : mantinePaperProps;
+  return React__default.createElement(
+    Paper,
+    Object.assign({ shadow: "xs", withBorder: true }, tablePaperProps, { ref: (ref) => {
+      tablePaperRef.current = ref;
+      if (tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.ref) {
+        tablePaperProps.ref.current = ref;
+      }
+    }, sx: (theme) => Object.assign({ transition: "all 100ms ease-in-out" }, (tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.sx) instanceof Function ? tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.sx(theme) : tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.sx), style: Object.assign(Object.assign({}, tablePaperProps === null || tablePaperProps === void 0 ? void 0 : tablePaperProps.style), isFullScreen ? {
+      height: "100vh",
+      margin: 0,
+      maxHeight: "100vh",
+      maxWidth: "100vw",
+      padding: 0,
+      width: "100vw"
+    } : {}) }),
+    enableTopToolbar && (renderTopToolbar instanceof Function ? renderTopToolbar({ table }) : renderTopToolbar !== null && renderTopToolbar !== void 0 ? renderTopToolbar : React__default.createElement(MRT_TopToolbar, { table })),
+    React__default.createElement(MRT_TableContainer, { table }),
+    enableBottomToolbar && (renderBottomToolbar instanceof Function ? renderBottomToolbar({ table }) : renderBottomToolbar !== null && renderBottomToolbar !== void 0 ? renderBottomToolbar : React__default.createElement(MRT_BottomToolbar, { table }))
+  );
+};
+const MRT_EditRowModal = ({ open, row, table }) => {
+  const { options: { localization, onEditingRowCancel }, setEditingRow } = table;
+  return React__default.createElement(
+    Modal,
+    { closeOnClickOutside: false, onClose: () => {
+      onEditingRowCancel === null || onEditingRowCancel === void 0 ? void 0 : onEditingRowCancel({ row, table });
+      setEditingRow(null);
+    }, opened: open, withCloseButton: false },
+    React__default.createElement(Text, { sx: { textAlign: "center" } }, localization.edit),
+    React__default.createElement(
+      "form",
+      { onSubmit: (e) => e.preventDefault() },
+      React__default.createElement(Stack, { sx: {
+        gap: "24px",
+        paddingTop: "16px",
+        width: "100%"
+      } }, row.getAllCells().filter((cell) => cell.column.columnDef.columnDefType === "data").map((cell) => React__default.createElement(MRT_EditCellTextInput, { cell, key: cell.id, showLabel: true, table })))
+    ),
+    React__default.createElement(
+      Flex,
+      { sx: { paddingTop: "24px", justifyContent: "flex-end" } },
+      React__default.createElement(MRT_EditActionButtons, { row, table, variant: "text" })
+    )
+  );
+};
+const MRT_TableRoot = (props) => {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8, _9, _10, _11, _12, _13;
+  const bottomToolbarRef = useRef(null);
+  const editInputRefs = useRef({});
+  const filterInputRefs = useRef({});
+  const searchInputRef = useRef(null);
+  const tableContainerRef = useRef(null);
+  const tableHeadCellRefs = useRef({});
+  const tablePaperRef = useRef(null);
+  const topToolbarRef = useRef(null);
+  const initialState = useMemo(() => {
+    var _a2, _b2, _c2;
+    const initState = (_a2 = props.initialState) !== null && _a2 !== void 0 ? _a2 : {};
+    initState.columnOrder = (_b2 = initState.columnOrder) !== null && _b2 !== void 0 ? _b2 : getDefaultColumnOrderIds(props);
+    initState.globalFilterFn = (_c2 = props.globalFilterFn) !== null && _c2 !== void 0 ? _c2 : "fuzzy";
+    return initState;
+  }, []);
+  const [columnFilterFns, setColumnFilterFns] = useState(() => Object.assign({}, ...getAllLeafColumnDefs(props.columns).map((col) => {
+    var _a2, _b2, _c2, _d2;
+    return {
+      [getColumnId(col)]: col.filterFn instanceof Function ? (_a2 = col.filterFn.name) !== null && _a2 !== void 0 ? _a2 : "custom" : (_d2 = (_b2 = col.filterFn) !== null && _b2 !== void 0 ? _b2 : (_c2 = initialState === null || initialState === void 0 ? void 0 : initialState.columnFilterFns) === null || _c2 === void 0 ? void 0 : _c2[getColumnId(col)]) !== null && _d2 !== void 0 ? _d2 : getDefaultColumnFilterFn(col)
+    };
+  })));
+  const [columnOrder, setColumnOrder] = useState((_a = initialState.columnOrder) !== null && _a !== void 0 ? _a : []);
+  const [density, setDensity] = useState((_b = initialState === null || initialState === void 0 ? void 0 : initialState.density) !== null && _b !== void 0 ? _b : "md");
+  const [draggingColumn, setDraggingColumn] = useState((_c = initialState.draggingColumn) !== null && _c !== void 0 ? _c : null);
+  const [draggingRow, setDraggingRow] = useState((_d = initialState.draggingRow) !== null && _d !== void 0 ? _d : null);
+  const [editingCell, setEditingCell] = useState((_e = initialState.editingCell) !== null && _e !== void 0 ? _e : null);
+  const [editingRow, setEditingRow] = useState((_f = initialState.editingRow) !== null && _f !== void 0 ? _f : null);
+  const [globalFilterFn, setGlobalFilterFn] = useState((_g = initialState.globalFilterFn) !== null && _g !== void 0 ? _g : "fuzzy");
+  const [grouping, setGrouping] = useState((_h = initialState.grouping) !== null && _h !== void 0 ? _h : []);
+  const [hoveredColumn, setHoveredColumn] = useState((_j = initialState.hoveredColumn) !== null && _j !== void 0 ? _j : null);
+  const [hoveredRow, setHoveredRow] = useState((_k = initialState.hoveredRow) !== null && _k !== void 0 ? _k : null);
+  const [isFullScreen, setIsFullScreen] = useState((_l = initialState === null || initialState === void 0 ? void 0 : initialState.isFullScreen) !== null && _l !== void 0 ? _l : false);
+  const [showAlertBanner, setShowAlertBanner] = useState((_o = (_m = props.initialState) === null || _m === void 0 ? void 0 : _m.showAlertBanner) !== null && _o !== void 0 ? _o : false);
+  const [showColumnFilters, setShowFilters] = useState((_p = initialState === null || initialState === void 0 ? void 0 : initialState.showColumnFilters) !== null && _p !== void 0 ? _p : false);
+  const [showGlobalFilter, setShowGlobalFilter] = useState((_q = initialState === null || initialState === void 0 ? void 0 : initialState.showGlobalFilter) !== null && _q !== void 0 ? _q : false);
+  const [showToolbarDropZone, setShowToolbarDropZone] = useState((_r = initialState === null || initialState === void 0 ? void 0 : initialState.showToolbarDropZone) !== null && _r !== void 0 ? _r : false);
+  const displayColumns = useMemo(() => {
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2, _j2, _k2, _l2, _m2, _o2, _p2, _q2, _r2, _s2;
+    return [
+      ((_b2 = (_a2 = props.state) === null || _a2 === void 0 ? void 0 : _a2.columnOrder) !== null && _b2 !== void 0 ? _b2 : columnOrder).includes("mrt-row-drag") && Object.assign(Object.assign(Object.assign({ header: props.localization.move, size: 60 }, props.defaultDisplayColumn), (_c2 = props.displayColumnDefOptions) === null || _c2 === void 0 ? void 0 : _c2["mrt-row-drag"]), { id: "mrt-row-drag" }),
+      ((_e2 = (_d2 = props.state) === null || _d2 === void 0 ? void 0 : _d2.columnOrder) !== null && _e2 !== void 0 ? _e2 : columnOrder).includes("mrt-row-actions") && Object.assign(Object.assign(Object.assign({ Cell: ({ cell, row }) => React__default.createElement(MRT_ToggleRowActionMenuButton, { cell, row, table }), header: props.localization.actions, size: 70 }, props.defaultDisplayColumn), (_f2 = props.displayColumnDefOptions) === null || _f2 === void 0 ? void 0 : _f2["mrt-row-actions"]), { id: "mrt-row-actions" }),
+      ((_h2 = (_g2 = props.state) === null || _g2 === void 0 ? void 0 : _g2.columnOrder) !== null && _h2 !== void 0 ? _h2 : columnOrder).includes("mrt-row-expand") && showExpandColumn(props, (_k2 = (_j2 = props.state) === null || _j2 === void 0 ? void 0 : _j2.grouping) !== null && _k2 !== void 0 ? _k2 : grouping) && Object.assign(Object.assign(Object.assign({ Cell: ({ row }) => React__default.createElement(MRT_ExpandButton, { row, table }), Header: props.enableExpandAll ? () => React__default.createElement(MRT_ExpandAllButton, { table }) : null, header: props.localization.expand, size: 60 }, props.defaultDisplayColumn), (_l2 = props.displayColumnDefOptions) === null || _l2 === void 0 ? void 0 : _l2["mrt-row-expand"]), { id: "mrt-row-expand" }),
+      ((_o2 = (_m2 = props.state) === null || _m2 === void 0 ? void 0 : _m2.columnOrder) !== null && _o2 !== void 0 ? _o2 : columnOrder).includes("mrt-row-select") && Object.assign(Object.assign(Object.assign({ Cell: ({ row }) => React__default.createElement(MRT_SelectCheckbox, { row, table }), Header: props.enableSelectAll && props.enableMultiRowSelection ? () => React__default.createElement(MRT_SelectCheckbox, { selectAll: true, table }) : null, header: props.localization.select, size: 60 }, props.defaultDisplayColumn), (_p2 = props.displayColumnDefOptions) === null || _p2 === void 0 ? void 0 : _p2["mrt-row-select"]), { id: "mrt-row-select" }),
+      ((_r2 = (_q2 = props.state) === null || _q2 === void 0 ? void 0 : _q2.columnOrder) !== null && _r2 !== void 0 ? _r2 : columnOrder).includes("mrt-row-numbers") && Object.assign(Object.assign(Object.assign({ Cell: ({ row }) => row.index + 1, Header: () => props.localization.rowNumber, header: props.localization.rowNumbers, size: 60 }, props.defaultDisplayColumn), (_s2 = props.displayColumnDefOptions) === null || _s2 === void 0 ? void 0 : _s2["mrt-row-numbers"]), { id: "mrt-row-numbers" })
+    ].filter(Boolean);
+  }, [
+    columnOrder,
+    grouping,
+    (_s = props.state) === null || _s === void 0 ? void 0 : _s.columnOrder,
+    (_t = props.state) === null || _t === void 0 ? void 0 : _t.grouping,
+    props.displayColumnDefOptions,
+    props.editingMode,
+    props.enableColumnDragging,
+    props.enableColumnFilterModes,
+    props.enableColumnOrdering,
+    props.enableEditing,
+    props.enableExpandAll,
+    props.enableExpanding,
+    props.enableGrouping,
+    props.enableRowActions,
+    props.enableRowDragging,
+    props.enableRowNumbers,
+    props.enableRowOrdering,
+    props.enableRowSelection,
+    props.enableSelectAll,
+    props.localization,
+    props.positionActionsColumn,
+    props.renderDetailPanel
+  ]);
+  const columnDefs = useMemo(() => {
+    var _a2, _b2, _c2;
+    return prepareColumns({
+      aggregationFns: props.aggregationFns,
+      columnDefs: [...displayColumns, ...props.columns],
+      columnFilterFns: (_b2 = (_a2 = props.state) === null || _a2 === void 0 ? void 0 : _a2.columnFilterFns) !== null && _b2 !== void 0 ? _b2 : columnFilterFns,
+      defaultDisplayColumn: (_c2 = props.defaultDisplayColumn) !== null && _c2 !== void 0 ? _c2 : {},
+      filterFns: props.filterFns,
+      sortingFns: props.sortingFns
+    });
+  }, [
+    columnFilterFns,
+    displayColumns,
+    props.columns,
+    (_u = props.state) === null || _u === void 0 ? void 0 : _u.columnFilterFns
+  ]);
+  const data = useMemo(() => {
+    var _a2, _b2, _c2, _d2, _e2;
+    return (((_a2 = props.state) === null || _a2 === void 0 ? void 0 : _a2.isLoading) || ((_b2 = props.state) === null || _b2 === void 0 ? void 0 : _b2.showSkeletons)) && !props.data.length ? [
+      ...Array(((_d2 = (_c2 = props.state) === null || _c2 === void 0 ? void 0 : _c2.pagination) === null || _d2 === void 0 ? void 0 : _d2.pageSize) || ((_e2 = initialState === null || initialState === void 0 ? void 0 : initialState.pagination) === null || _e2 === void 0 ? void 0 : _e2.pageSize) || 10).fill(null)
+    ].map(() => Object.assign({}, ...getAllLeafColumnDefs(props.columns).map((col) => ({
+      [getColumnId(col)]: null
+    })))) : props.data;
+  }, [props.data, (_v = props.state) === null || _v === void 0 ? void 0 : _v.isLoading, (_w = props.state) === null || _w === void 0 ? void 0 : _w.showSkeletons]);
+  const table = Object.assign(Object.assign({}, useReactTable(Object.assign(Object.assign({ getCoreRowModel: getCoreRowModel(), getExpandedRowModel: getExpandedRowModel(), getFacetedRowModel: getFacetedRowModel(), getFilteredRowModel: getFilteredRowModel(), getGroupedRowModel: getGroupedRowModel(), getPaginationRowModel: getPaginationRowModel(), getSortedRowModel: getSortedRowModel(), onColumnOrderChange: setColumnOrder, onGroupingChange: setGrouping, getSubRows: (row) => row === null || row === void 0 ? void 0 : row.subRows }, props), {
+    //@ts-ignore
+    columns: columnDefs,
+    data,
+    globalFilterFn: (_y = (_x = props.filterFns) === null || _x === void 0 ? void 0 : _x[globalFilterFn]) !== null && _y !== void 0 ? _y : (_z = props.filterFns) === null || _z === void 0 ? void 0 : _z.fuzzy,
+    initialState,
+    state: Object.assign({
+      columnFilterFns,
+      columnOrder,
+      density,
+      draggingColumn,
+      draggingRow,
+      editingCell,
+      editingRow,
+      globalFilterFn,
+      grouping,
+      hoveredColumn,
+      hoveredRow,
+      isFullScreen,
+      showAlertBanner,
+      showColumnFilters,
+      showGlobalFilter,
+      showToolbarDropZone
+    }, props.state)
+  }))), { refs: {
+    bottomToolbarRef,
+    editInputRefs,
+    filterInputRefs,
+    searchInputRef,
+    tableContainerRef,
+    tableHeadCellRefs,
+    tablePaperRef,
+    topToolbarRef
+  }, setColumnFilterFns: (_0 = props.onColumnFilterFnsChange) !== null && _0 !== void 0 ? _0 : setColumnFilterFns, setDensity: (_1 = props.onDensityChange) !== null && _1 !== void 0 ? _1 : setDensity, setDraggingColumn: (_2 = props.onDraggingColumnChange) !== null && _2 !== void 0 ? _2 : setDraggingColumn, setDraggingRow: (_3 = props.onDraggingRowChange) !== null && _3 !== void 0 ? _3 : setDraggingRow, setEditingCell: (_4 = props.onEditingCellChange) !== null && _4 !== void 0 ? _4 : setEditingCell, setEditingRow: (_5 = props.onEditingRowChange) !== null && _5 !== void 0 ? _5 : setEditingRow, setGlobalFilterFn: (_6 = props.onGlobalFilterFnChange) !== null && _6 !== void 0 ? _6 : setGlobalFilterFn, setHoveredColumn: (_7 = props.onHoveredColumnChange) !== null && _7 !== void 0 ? _7 : setHoveredColumn, setHoveredRow: (_8 = props.onHoveredRowChange) !== null && _8 !== void 0 ? _8 : setHoveredRow, setIsFullScreen: (_9 = props.onIsFullScreenChange) !== null && _9 !== void 0 ? _9 : setIsFullScreen, setShowAlertBanner: (_10 = props.onShowAlertBannerChange) !== null && _10 !== void 0 ? _10 : setShowAlertBanner, setShowFilters: (_11 = props.onShowFiltersChange) !== null && _11 !== void 0 ? _11 : setShowFilters, setShowGlobalFilter: (_12 = props.onShowGlobalFilterChange) !== null && _12 !== void 0 ? _12 : setShowGlobalFilter, setShowToolbarDropZone: (_13 = props.onShowToolbarDropZoneChange) !== null && _13 !== void 0 ? _13 : setShowToolbarDropZone });
+  if (props.tableInstanceRef) {
+    props.tableInstanceRef.current = table;
+  }
+  const initialBodyHeight = useRef();
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      initialBodyHeight.current = document.body.style.height;
+    }
+  }, []);
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      if (table.getState().isFullScreen) {
+        document.body.style.height = "100vh";
+      } else {
+        document.body.style.height = initialBodyHeight.current;
+      }
+    }
+  }, [table.getState().isFullScreen]);
+  return React__default.createElement(
+    React__default.Fragment,
+    null,
+    React__default.createElement(
+      Modal,
+      { fullScreen: true, onClose: () => table.setIsFullScreen(false), opened: table.getState().isFullScreen, transitionDuration: 400, withCloseButton: false, withinPortal: false, sx: {
+        "& .mantine-Modal-modal": {
+          padding: 0
+        }
+      } },
+      React__default.createElement(MRT_TablePaper, { table })
+    ),
+    !table.getState().isFullScreen && React__default.createElement(MRT_TablePaper, { table }),
+    editingRow && props.editingMode === "modal" && React__default.createElement(MRT_EditRowModal, { row: editingRow, table, open: true })
+  );
+};
+const MRT_Localization_EN = {
+  actions: "Actions",
+  and: "and",
+  cancel: "Cancel",
+  changeFilterMode: "Change filter mode",
+  changeSearchMode: "Change search mode",
+  clearFilter: "Clear filter",
+  clearSearch: "Clear search",
+  clearSort: "Clear sort",
+  clickToCopy: "Click to copy",
+  collapse: "Collapse",
+  collapseAll: "Collapse all",
+  columnActions: "Column Actions",
+  copiedToClipboard: "Copied to clipboard",
+  dropToGroupBy: "Drop to group by {column}",
+  edit: "Edit",
+  expand: "Expand",
+  expandAll: "Expand all",
+  filterArrIncludes: "Includes",
+  filterArrIncludesAll: "Includes all",
+  filterArrIncludesSome: "Includes",
+  filterBetween: "Between",
+  filterBetweenInclusive: "Between Inclusive",
+  filterByColumn: "Filter by {column}",
+  filterContains: "Contains",
+  filterEmpty: "Empty",
+  filterEndsWith: "Ends With",
+  filterEquals: "Equals",
+  filterEqualsString: "Equals",
+  filterFuzzy: "Fuzzy",
+  filterGreaterThan: "Greater Than",
+  filterGreaterThanOrEqualTo: "Greater Than Or Equal To",
+  filterInNumberRange: "Between",
+  filterIncludesString: "Contains",
+  filterIncludesStringSensitive: "Contains",
+  filterLessThan: "Less Than",
+  filterLessThanOrEqualTo: "Less Than Or Equal To",
+  filterMode: "Filter Mode: {filterType}",
+  filterNotEmpty: "Not Empty",
+  filterNotEquals: "Not Equals",
+  filterStartsWith: "Starts With",
+  filterWeakEquals: "Equals",
+  filteringByColumn: "Filtering by {column} - {filterType} {filterValue}",
+  goToFirstPage: "Go to first page",
+  goToLastPage: "Go to last page",
+  goToNextPage: "Go to next page",
+  goToPreviousPage: "Go to previous page",
+  grab: "Grab",
+  groupByColumn: "Group by {column}",
+  groupedBy: "Grouped by ",
+  hideAll: "Hide all",
+  hideColumn: "Hide {column} column",
+  max: "Max",
+  min: "Min",
+  move: "Move",
+  noRecordsToDisplay: "No records to display",
+  noResultsFound: "No results found",
+  of: "of",
+  or: "or",
+  pinToLeft: "Pin to left",
+  pinToRight: "Pin to right",
+  resetColumnSize: "Reset column size",
+  resetOrder: "Reset order",
+  rowActions: "Row Actions",
+  rowNumber: "#",
+  rowNumbers: "Row Numbers",
+  rowsPerPage: "Rows per page",
+  save: "Save",
+  search: "Search",
+  selectedCountOfRowCountRowsSelected: "{selectedCount} of {rowCount} row(s) selected",
+  select: "Select",
+  showAll: "Show all",
+  showAllColumns: "Show all columns",
+  showHideColumns: "Show/Hide columns",
+  showHideFilters: "Show/Hide filters",
+  showHideSearch: "Show/Hide search",
+  sortByColumnAsc: "Sort by {column} ascending",
+  sortByColumnDesc: "Sort by {column} descending",
+  sortedByColumnAsc: "Sorted by {column} ascending",
+  sortedByColumnDesc: "Sorted by {column} descending",
+  thenBy: ", then by ",
+  toggleDensity: "Toggle density",
+  toggleFullScreen: "Toggle full screen",
+  toggleSelectAll: "Toggle select all",
+  toggleSelectRow: "Toggle select row",
+  toggleVisibility: "Toggle visibility",
+  ungroupByColumn: "Ungroup by {column}",
+  unpin: "Unpin",
+  unpinAll: "Unpin all",
+  unsorted: "Unsorted"
+};
+const MantineReactTable = (_a) => {
+  var _b;
+  var { aggregationFns: aggregationFns2, autoResetExpanded = false, columnResizeMode = "onChange", defaultColumn, defaultDisplayColumn, editingMode = "modal", enableBottomToolbar = true, enableColumnActions = true, enableColumnFilters = true, enableColumnOrdering = false, enableColumnResizing = false, enableDensityToggle = true, enableExpandAll = true, enableFilterMatchHighlighting = true, enableFilters = true, enableFullScreenToggle = true, enableGlobalFilter = true, enableGlobalFilterRankedResults = true, enableGrouping = false, enableHiding = true, enableMultiRowSelection = true, enableMultiSort = true, enablePagination = true, enablePinning = false, enableRowSelection = false, enableSelectAll = true, enableSorting = true, enableStickyHeader = false, enableTableFooter = true, enableTableHead = true, enableToolbarInternalActions = true, enableTopToolbar = true, filterFns: filterFns2, icons, layoutMode = "semantic", localization, manualFiltering, manualGrouping, manualPagination, manualSorting, positionActionsColumn = "first", positionExpandColumn = "first", positionGlobalFilter = "right", positionPagination = "bottom", positionToolbarAlertBanner = "top", positionToolbarDropZone = "top", rowNumberMode = "original", selectAllMode = "page", sortingFns: sortingFns2 } = _a, rest = __rest(_a, ["aggregationFns", "autoResetExpanded", "columnResizeMode", "defaultColumn", "defaultDisplayColumn", "editingMode", "enableBottomToolbar", "enableColumnActions", "enableColumnFilters", "enableColumnOrdering", "enableColumnResizing", "enableDensityToggle", "enableExpandAll", "enableFilterMatchHighlighting", "enableFilters", "enableFullScreenToggle", "enableGlobalFilter", "enableGlobalFilterRankedResults", "enableGrouping", "enableHiding", "enableMultiRowSelection", "enableMultiSort", "enablePagination", "enablePinning", "enableRowSelection", "enableSelectAll", "enableSorting", "enableStickyHeader", "enableTableFooter", "enableTableHead", "enableToolbarInternalActions", "enableTopToolbar", "filterFns", "icons", "layoutMode", "localization", "manualFiltering", "manualGrouping", "manualPagination", "manualSorting", "positionActionsColumn", "positionExpandColumn", "positionGlobalFilter", "positionPagination", "positionToolbarAlertBanner", "positionToolbarDropZone", "rowNumberMode", "selectAllMode", "sortingFns"]);
+  const _icons = useMemo(() => Object.assign(Object.assign({}, MRT_Default_Icons), icons), [icons]);
+  const _localization = useMemo(() => Object.assign(Object.assign({}, MRT_Localization_EN), localization), [localization]);
+  const _aggregationFns = useMemo(() => Object.assign(Object.assign({}, MRT_AggregationFns), aggregationFns2), []);
+  const _filterFns = useMemo(() => Object.assign(Object.assign({}, MRT_FilterFns), filterFns2), []);
+  const _sortingFns = useMemo(() => Object.assign(Object.assign({}, MRT_SortingFns), sortingFns2), []);
+  const _defaultColumn = useMemo(() => Object.assign(Object.assign({}, MRT_DefaultColumn), defaultColumn), [defaultColumn]);
+  const _defaultDisplayColumn = useMemo(() => Object.assign(Object.assign({}, MRT_DefaultDisplayColumn), defaultDisplayColumn), [defaultDisplayColumn]);
+  if (rest.enableRowVirtualization || rest.enableColumnVirtualization) {
+    layoutMode = "grid";
+  }
+  if (rest.enableRowVirtualization) {
+    enableStickyHeader = true;
+  }
+  if (enablePagination === false && manualPagination === void 0) {
+    manualPagination = true;
+  }
+  if (!((_b = rest.data) === null || _b === void 0 ? void 0 : _b.length)) {
+    manualFiltering = true;
+    manualGrouping = true;
+    manualPagination = true;
+    manualSorting = true;
+  }
+  return React__default.createElement(MRT_TableRoot, Object.assign({ aggregationFns: _aggregationFns, autoResetExpanded, columnResizeMode, defaultColumn: _defaultColumn, defaultDisplayColumn: _defaultDisplayColumn, editingMode, enableBottomToolbar, enableColumnActions, enableColumnFilters, enableColumnOrdering, enableColumnResizing, enableDensityToggle, enableExpandAll, enableFilterMatchHighlighting, enableFilters, enableFullScreenToggle, enableGlobalFilter, enableGlobalFilterRankedResults, enableGrouping, enableHiding, enableMultiRowSelection, enableMultiSort, enablePagination, enablePinning, enableRowSelection, enableSelectAll, enableSorting, enableStickyHeader, enableTableFooter, enableTableHead, enableToolbarInternalActions, enableTopToolbar, filterFns: _filterFns, icons: _icons, layoutMode, localization: _localization, manualFiltering, manualGrouping, manualPagination, manualSorting, positionActionsColumn, positionExpandColumn, positionGlobalFilter, positionPagination, positionToolbarAlertBanner, positionToolbarDropZone, rowNumberMode, selectAllMode, sortingFns: _sortingFns }, rest));
+};
+export {
+  MRT_AggregationFns,
+  MRT_BottomToolbar,
+  MRT_CopyButton,
+  MRT_FilterFns,
+  MRT_FilterOptionMenu,
+  MRT_GlobalFilterTextInput,
+  MRT_ProgressBar,
+  MRT_ShowHideColumnsButton,
+  MRT_SortingFns,
+  MRT_TablePagination,
+  MRT_ToggleDensePaddingButton,
+  MRT_ToggleFiltersButton,
+  MRT_ToggleFullScreenButton,
+  MRT_ToggleGlobalFilterButton,
+  MRT_ToggleRowActionMenuButton,
+  MRT_ToolbarAlertBanner,
+  MRT_ToolbarDropZone,
+  MRT_ToolbarInternalButtons,
+  MRT_TopToolbar,
+  MantineReactTable
+};