From d59f3d1f0753085060159de44113bed3cdf70e58 Mon Sep 17 00:00:00 2001
From: Kevin Van Cott <kevinvandy656@gmail.com>
Date: Mon, 8 Jan 2024 21:02:11 -0600
Subject: [PATCH] release v2.0.0-alpha.10

---
 .../styles/ThemeContext.tsx                   |  2 +-
 packages/mantine-react-table/package.json     |  2 +-
 .../src/head/MRT_TableHeadCell.tsx            | 40 ++++++++++---------
 .../src/head/MRT_TableHeadRow.module.css      |  1 -
 4 files changed, 23 insertions(+), 22 deletions(-)

diff --git a/apps/mantine-react-table-docs/styles/ThemeContext.tsx b/apps/mantine-react-table-docs/styles/ThemeContext.tsx
index 8c7caa387..13caf617e 100644
--- a/apps/mantine-react-table-docs/styles/ThemeContext.tsx
+++ b/apps/mantine-react-table-docs/styles/ThemeContext.tsx
@@ -30,7 +30,7 @@ export const ThemeContextProvider = ({ children }) => {
 
   useEffect(() => {
     if (typeof window !== 'undefined') {
-      localStorage.setItem('isLightTheme', darkDark.toString());
+      localStorage.setItem('darkDark', darkDark.toString());
     }
   }, [darkDark]);
 
diff --git a/packages/mantine-react-table/package.json b/packages/mantine-react-table/package.json
index 38ff80ae4..41f99a12d 100644
--- a/packages/mantine-react-table/package.json
+++ b/packages/mantine-react-table/package.json
@@ -1,5 +1,5 @@
 {
-  "version": "2.0.0-alpha.9",
+  "version": "2.0.0-alpha.10",
   "license": "MIT",
   "name": "mantine-react-table",
   "description": "A fully featured Mantine implementation of TanStack React Table V8, written from the ground up in TypeScript.",
diff --git a/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx b/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
index 372d0f94c..4b9edacc1 100644
--- a/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
+++ b/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
@@ -1,5 +1,10 @@
-import { type ReactNode, useMemo, type CSSProperties } from 'react';
-import { Box, Flex } from '@mantine/core';
+import {
+  type ReactNode,
+  useMemo,
+  type CSSProperties,
+  type DragEventHandler,
+} from 'react';
+import { Flex, TableTh } from '@mantine/core';
 import { MRT_ColumnActionMenu } from '../menus/MRT_ColumnActionMenu';
 import { MRT_TableHeadCellFilterContainer } from './MRT_TableHeadCellFilterContainer';
 import { MRT_TableHeadCellFilterLabel } from './MRT_TableHeadCellFilterLabel';
@@ -94,6 +99,17 @@ export const MRT_TableHeadCell = <TData extends MRT_RowData>({
     return pl;
   }, [showColumnActions, showDragHandle]);
 
+  const handleDragEnter: DragEventHandler<HTMLTableCellElement> = (_e) => {
+    if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
+      setHoveredColumn(null);
+    }
+    if (enableColumnOrdering && draggingColumn && columnDefType !== 'group') {
+      setHoveredColumn(
+        columnDef.enableColumnOrdering !== false ? column : null,
+      );
+    }
+  };
+
   const headerElement =
     columnDef?.Header instanceof Function
       ? columnDef?.Header?.({
@@ -104,25 +120,11 @@ export const MRT_TableHeadCell = <TData extends MRT_RowData>({
       : columnDef?.Header ?? (columnDef.header as ReactNode);
 
   return (
-    <Box
+    <TableTh
       {...tableCellProps}
-      component="th"
       align={columnDefType === 'group' ? 'center' : 'left'}
       colSpan={header.colSpan}
-      onDragEnter={() => {
-        if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
-          setHoveredColumn(null);
-        }
-        if (
-          enableColumnOrdering &&
-          draggingColumn &&
-          columnDefType !== 'group'
-        ) {
-          setHoveredColumn(
-            columnDef.enableColumnOrdering !== false ? column : null,
-          );
-        }
-      }}
+      onDragEnter={handleDragEnter}
       ref={(node: HTMLTableCellElement) => {
         if (node) {
           tableHeadCellRefs.current[column.id] = node;
@@ -248,6 +250,6 @@ export const MRT_TableHeadCell = <TData extends MRT_RowData>({
       {columnFilterDisplayMode === 'subheader' && column.getCanFilter() && (
         <MRT_TableHeadCellFilterContainer header={header} table={table} />
       )}
-    </Box>
+    </TableTh>
   );
 };
diff --git a/packages/mantine-react-table/src/head/MRT_TableHeadRow.module.css b/packages/mantine-react-table/src/head/MRT_TableHeadRow.module.css
index d9d038db2..6911ef783 100644
--- a/packages/mantine-react-table/src/head/MRT_TableHeadRow.module.css
+++ b/packages/mantine-react-table/src/head/MRT_TableHeadRow.module.css
@@ -7,7 +7,6 @@
   &.layout-mode-grid {
     display: flex;
   }
-  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
 }
 
 .sticky {