From 71428471aeb5e4d40af5d38ba200cf236808e6a0 Mon Sep 17 00:00:00 2001
From: Alessandro Cuppari <me@alessandrojcm.dev>
Date: Wed, 27 Sep 2023 19:27:34 +0100
Subject: [PATCH] fix storybook runtime errors (#141)

* fix comment style on columns.util

* fix: re-add getprimarycolor and getprimaryshade utilities

* fix: storybook runtime errors
---
 packages/mantine-react-table/src/column.utils.ts             | 3 ++-
 packages/mantine-react-table/src/footer/MRT_TableFooter.tsx  | 3 +--
 .../mantine-react-table/src/footer/MRT_TableFooterCell.tsx   | 5 +++--
 .../mantine-react-table/src/footer/MRT_TableFooterRow.tsx    | 3 +--
 packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx  | 3 +--
 packages/mantine-react-table/src/head/MRT_TableHeadRow.tsx   | 3 +--
 6 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/packages/mantine-react-table/src/column.utils.ts b/packages/mantine-react-table/src/column.utils.ts
index cb2a464db..e516aabf8 100644
--- a/packages/mantine-react-table/src/column.utils.ts
+++ b/packages/mantine-react-table/src/column.utils.ts
@@ -12,6 +12,7 @@ import {
   type BoxProps,
   type CssVariable,
   type CssVariables,
+  type MantineStyleProp,
   type MantineTheme,
 } from '@mantine/core';
 import {
@@ -300,7 +301,7 @@ export const getCommonCellStyles = <TData extends Record<string, any> = {}>({
   table: MRT_TableInstance<TData>;
   tableCellProps: BoxProps;
   theme: MantineTheme;
-}): { __vars: CssVariables; className: string; style: CSSStyleDeclaration } => {
+}): { __vars: CssVariables; className: string; style: MantineStyleProp } => {
   const __vars: Record<CssVariable, string | undefined> = {};
   const headerId = `--${header ? 'header' : 'col'}-${parseCSSVarId(
     header?.id ?? column.id,
diff --git a/packages/mantine-react-table/src/footer/MRT_TableFooter.tsx b/packages/mantine-react-table/src/footer/MRT_TableFooter.tsx
index 5d47ea22e..92493cebb 100644
--- a/packages/mantine-react-table/src/footer/MRT_TableFooter.tsx
+++ b/packages/mantine-react-table/src/footer/MRT_TableFooter.tsx
@@ -24,7 +24,7 @@ export const MRT_TableFooter = <TData extends Record<string, any> = {}>({
   } = table;
   const { isFullScreen } = getState();
 
-  const { className, ...tableFooterProps } =
+  const tableFooterProps =
     mantineTableFooterProps instanceof Function
       ? mantineTableFooterProps({ table })
       : mantineTableFooterProps;
@@ -41,7 +41,6 @@ export const MRT_TableFooter = <TData extends Record<string, any> = {}>({
         layoutMode === 'grid'
           ? classes.MRT_TableFooterGrid
           : classes.MRT_TableFooterTableRowGroup,
-        className,
       )}
       style={(theme) => ({
         ...(tableFooterProps?.style instanceof Function
diff --git a/packages/mantine-react-table/src/footer/MRT_TableFooterCell.tsx b/packages/mantine-react-table/src/footer/MRT_TableFooterCell.tsx
index 3d28456de..ad43ccba2 100644
--- a/packages/mantine-react-table/src/footer/MRT_TableFooterCell.tsx
+++ b/packages/mantine-react-table/src/footer/MRT_TableFooterCell.tsx
@@ -1,4 +1,4 @@
-import { Box } from '@mantine/core';
+import { Box, useMantineTheme } from '@mantine/core';
 import clsx from 'clsx';
 import { getCommonCellStyles } from '../column.utils';
 import { type MRT_Header, type MRT_TableInstance } from '../types';
@@ -13,6 +13,7 @@ export const MRT_TableFooterCell = <TData extends Record<string, any> = {}>({
   footer,
   table,
 }: Props<TData>) => {
+  const theme = useMantineTheme();
   const {
     options: { layoutMode, mantineTableFooterCellProps },
   } = table;
@@ -51,7 +52,7 @@ export const MRT_TableFooterCell = <TData extends Record<string, any> = {}>({
       component="th"
       align={columnDefType === 'group' ? 'center' : 'left'}
       colSpan={footer.colSpan}
-      data-selected={row?.getIsSelected() ?? 'false'}
+      data-selected={'false'}
       data-ispinned={column?.getIsPinned() ?? 'false'}
       data-columndef={columnDefType}
       {...tableCellProps}
diff --git a/packages/mantine-react-table/src/footer/MRT_TableFooterRow.tsx b/packages/mantine-react-table/src/footer/MRT_TableFooterRow.tsx
index 39ad6dbd1..0ab41046d 100644
--- a/packages/mantine-react-table/src/footer/MRT_TableFooterRow.tsx
+++ b/packages/mantine-react-table/src/footer/MRT_TableFooterRow.tsx
@@ -39,7 +39,7 @@ export const MRT_TableFooterRow = <TData extends Record<string, any> = {}>({
   )
     return null;
 
-  const { className, ...tableRowProps } =
+  const tableRowProps =
     mantineTableFooterRowProps instanceof Function
       ? mantineTableFooterRowProps({ footerGroup, table })
       : mantineTableFooterRowProps;
@@ -52,7 +52,6 @@ export const MRT_TableFooterRow = <TData extends Record<string, any> = {}>({
         layoutMode === 'grid'
           ? classes.MRT_TableFooterRowGrid
           : classes.MRT_TableFooterRowTableRow,
-        className,
       )}
       {...tableRowProps}
       style={(theme) => ({
diff --git a/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx b/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
index 00d4e2e5c..c3a3fe43f 100644
--- a/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
+++ b/packages/mantine-react-table/src/head/MRT_TableHeadCell.tsx
@@ -94,7 +94,7 @@ export const MRT_TableHeadCell = <TData extends Record<string, any> = {}>({
         borderRight: draggingBorder,
         borderTop: draggingBorder,
       }
-    : undefined;
+    : {};
 
   const handleDragEnter = (_e: DragEvent) => {
     if (enableGrouping && hoveredColumn?.id === 'drop-zone') {
@@ -127,7 +127,6 @@ export const MRT_TableHeadCell = <TData extends Record<string, any> = {}>({
     <Box
       component="th"
       align={columnDefType === 'group' ? 'center' : 'left'}
-      data-selected={row?.getIsSelected() ?? 'false'}
       data-ispinned={column?.getIsPinned() ?? 'false'}
       data-cansort={column.getCanSort()}
       data-isresizing={column.getIsResizing()}
diff --git a/packages/mantine-react-table/src/head/MRT_TableHeadRow.tsx b/packages/mantine-react-table/src/head/MRT_TableHeadRow.tsx
index fda5263a4..cf397d1a3 100644
--- a/packages/mantine-react-table/src/head/MRT_TableHeadRow.tsx
+++ b/packages/mantine-react-table/src/head/MRT_TableHeadRow.tsx
@@ -30,7 +30,7 @@ export const MRT_TableHeadRow = <TData extends Record<string, any> = {}>({
   } = table;
   const { isFullScreen } = getState();
 
-  const { className, ...tableRowProps } =
+  const tableRowProps =
     mantineTableHeadRowProps instanceof Function
       ? mantineTableHeadRowProps({ headerGroup, table })
       : mantineTableHeadRowProps;
@@ -44,7 +44,6 @@ export const MRT_TableHeadRow = <TData extends Record<string, any> = {}>({
       className={clsx(
         classes.MRT_TableHeadRow,
         stickyHeader && classes.MRT_TableHeadRowSticky,
-        className,
       )}
       __vars={{
         '--display': layoutMode === 'grid' ? 'flex' : 'table-row',