fix virtual detail panels, more striped row stuff

apps/mantine-react-table-docs/examples/advanced/sandbox/src/Legacy.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/advanced/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/aggregation-and-grouping/sandbox/src/Legacy.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { Box, Stack } from '@mantine/core';

apps/mantine-react-table-docs/examples/aggregation-and-grouping/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { Box, Stack } from '@mantine/core';

apps/mantine-react-table-docs/examples/aggregation-multi/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { Box } from '@mantine/core';

apps/mantine-react-table-docs/examples/alternate-column-filtering/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/alternate-detail-panel/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/alternate-pagination/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { MantineReactTable, useMantineReactTable } from 'mantine-react-table';
 import { columns, data } from './makeData';

apps/mantine-react-table-docs/examples/basic/sandbox/src/Legacy.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/basic/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/column-actions-space/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/column-alignment/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/custom-column-actions/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/custom-headless/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import {
   flexRender,

apps/mantine-react-table-docs/examples/custom-top-toolbar/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/customize-display-columns/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { Box, Button } from '@mantine/core';

apps/mantine-react-table-docs/examples/customize-filter-components/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/customize-filter-modes/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/customize-filter-variants/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/customize-global-filter-component/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/customize-row-selection/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/customize-table-styles/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/disable-column-actions/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/disable-column-filters/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/disable-column-hiding/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/disable-density-toggle/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/editing-crud-cell/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/editing-crud-modal/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/editing-crud-row/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/editing-crud-table/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-click-to-copy/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-column-ordering/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-column-pinning/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-column-resizing-no-grow/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-column-resizing/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-column-virtualization/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useRef } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-detail-panel/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-editing-cell/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-editing-modal/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-editing-row/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-editing-table/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-expanding-tree/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/enable-filter-facet-values/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-row-dragging/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-row-numbers-original/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { MantineReactTable, useMantineReactTable } from 'mantine-react-table';
 import { columns, data } from './makeData';

apps/mantine-react-table-docs/examples/enable-row-numbers-static/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { MantineReactTable, useMantineReactTable } from 'mantine-react-table';
 import { columns, data } from './makeData';

apps/mantine-react-table-docs/examples/enable-row-ordering/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-row-selection-switch/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-row-selection/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useEffect, useMemo, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-row-virtualization/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useEffect, useMemo, useRef, useState } from 'react';
 import {

apps/mantine-react-table-docs/examples/enable-sticky-header/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';

apps/mantine-react-table-docs/examples/expanding-tree-expanded/sandbox/src/TS.tsx

@@ -1,5 +1,5 @@
 import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css'; //if using mantine component features
+import '@mantine/dates/styles.css'; //if using mantine date picker features
 import 'mantine-react-table/styles.css'; //make sure MRT styles were imported in your app root (once)
 import { useMemo } from 'react';
 import { MantineReactTable, type MRT_ColumnDef } from 'mantine-react-table';