fix: wrong PartialTableTheme type

src/components/cell.tsx

@@ -1,7 +1,7 @@
 import React, { memo } from 'react';
 import { Id, useColumnContext, useTableContext, useTheme } from '..';
 import { cx } from '../misc/helpers';
-import { defaultClasses } from '../theme/defaultClasses';
+import { defaultClasses } from '../theme/defaultTheme/defaultClasses';
 import { calcClassNames } from './row';
 
 export const Cell = memo(function Cell<T>({ itemId, rowIndex }: { itemId: Id; rowIndex: number }) {

src/components/datePicker.tsx

@@ -1,7 +1,7 @@
 import { useDayzed } from 'dayzed';
 import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { useTheme } from '..';
-import { gray } from '../theme/defaultClasses';
+import { gray } from '../theme/defaultTheme/defaultClasses';
 import { useCssVariables } from '../theme/useCssVariables';
 
 export type DateRange = { min: Date; max: Date };

src/components/row.tsx

@@ -1,6 +1,6 @@
 import React, { memo, useEffect, useRef } from 'react';
 import { cx, getAncestors } from '../misc/helpers';
-import { defaultClasses } from '../theme/defaultClasses';
+import { defaultClasses } from '../theme/defaultTheme/defaultClasses';
 import { Id, InternalColumn } from '../types';
 import { Cell } from './cell';
 import { ExpandControl } from './expandControl';

src/components/table.tsx

@@ -4,7 +4,7 @@ import { useTheme } from '..';
 import { useTableStateStorage } from '../internalState/tableStateStorage';
 import { useTableState } from '../internalState/useTableState';
 import { cx } from '../misc/helpers';
-import { defaultClasses } from '../theme/defaultClasses';
+import { defaultClasses } from '../theme/defaultTheme/defaultClasses';
 import { useCssVariables } from '../theme/useCssVariables';
 import { Id, InternalTableState, TableProps } from '../types';
 import { ColumnHeader, ColumnHeaderContext } from './columnHeader';

src/theme/defaultTheme/button.tsx

@@ -1,5 +1,5 @@
 import { TableTheme } from '../../types';
-import { darkGray, lightGray } from '../defaultClasses';
+import { darkGray, lightGray } from './defaultClasses';
 
 export const Button: TableTheme['components']['Button'] = ({ startIcon, children, variant = 'text', ...props }) => {
   return (

src/theme/defaultColors.ts → src/theme/defaultTheme/defaultColors.ts

@@ -1,4 +1,4 @@
-import { TableTheme } from '../types';
+import { TableTheme } from '../../types';
 
 export const defaultColors: TableTheme['colors'] = {
   primary: { main: '#1976d2', light: '#42a5f5', contrastText: '#fff' },

src/theme/defaultTheme/defaultComponents.ts

@@ -0,0 +1,18 @@
+import { Spinner } from '../../components/spinnner';
+import { TableTheme } from '../../types';
+import { Badge } from './badge';
+import { Button } from './button';
+import { Checkbox } from './checkbox';
+import { IconButton } from './iconButton';
+import { Popover } from './popover';
+import { TextField } from './textField';
+
+export const defaultComponents: TableTheme['components'] = {
+  IconButton,
+  Checkbox,
+  Popover,
+  Button,
+  Badge,
+  TextField,
+  Spinner,
+};

src/theme/defaultIcons.tsx → src/theme/defaultTheme/defaultIcons.tsx

@@ -1,6 +1,6 @@
 import { ClassNames, css } from '@emotion/react';
 import { cloneElement, HTMLProps } from 'react';
-import { TableTheme } from '../types';
+import { TableTheme } from '../../types';
 
 const IconDefaultStyle = css({
   width: '1.5em',

src/theme/defaultTexts.tsx → src/theme/defaultTheme/defaultTexts.tsx

@@ -1,4 +1,4 @@
-import { TableTheme } from '../types';
+import { TableTheme } from '../../types';
 
 export const defaultTexts: TableTheme['text'] = {
   selectColumns: 'Select visible columns',

src/theme/defaultTheme/index.tsx

@@ -1,18 +1,13 @@
-import { Spinner } from '../../components/spinnner';
 import { TableTheme } from '../../types';
-import { Badge } from './badge';
-import { Button } from './button';
-import { Checkbox } from './checkbox';
-import { IconButton } from './iconButton';
-import { Popover } from './popover';
-import { TextField } from './textField';
+import { defaultColors } from './defaultColors';
+import { defaultComponents } from './defaultComponents';
+import { defaultIcons } from './defaultIcons';
+import { defaultTexts } from './defaultTexts';
 
-export const defaultComponents: TableTheme['components'] = {
-  IconButton,
-  Checkbox,
-  Popover,
-  Button,
-  Badge,
-  TextField,
-  Spinner,
+export const defaultTableTheme: TableTheme = {
+  text: defaultTexts,
+  components: defaultComponents,
+  icons: defaultIcons,
+  colors: defaultColors,
+  spacing: '5px',
 };

src/theme/defaultTheme/popover.tsx

@@ -1,7 +1,7 @@
 import React, { createContext, useContext, useLayoutEffect, useMemo, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { TableTheme } from '../../types';
-import { defaultClasses } from '../defaultClasses';
+import { defaultClasses } from './defaultClasses';
 
 const MARGIN = 10;
 const MAX_OFFSET = 20;

src/theme/defaultTheme/textField.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { TableTheme } from '../../types';
-import { darkGray } from '../defaultClasses';
+import { darkGray } from './defaultClasses';
 
 export const TextField: TableTheme['components']['TextField'] = ({ endIcon, className, inputRef, ...props }) => {
   const [focus, setFocus] = useState(false);

src/theme/tableTheme.tsx

@@ -1,6 +1,6 @@
 import { createContext, ReactNode, useContext } from 'react';
 import { InternalTableProps, PartialTableTheme, TableTheme } from '../types';
-import { defaultTableTheme } from './defaultTheme/defaultTableTheme';
+import { defaultTableTheme } from './defaultTheme';
 
 let globalTableTheme: PartialTableTheme = {};
 export function configureTableTheme(tableTheme: PartialTableTheme) {

src/types.ts

@@ -2,7 +2,6 @@ import { CSSInterpolation } from '@emotion/serialize';
 import React, { ComponentType, CSSProperties, ReactNode, Ref } from 'react';
 import { TableStateStorage } from './internalState/tableStateStorage';
 import { CsvExportOptions } from './misc/csvExport';
-import { DeepPartial } from './misc/deepPartial';
 
 export type Sort = { columnId: string | number; direction: SortDirection };
 export type SortDirection = 'asc' | 'desc';
@@ -86,7 +85,9 @@ export interface TableTheme<T = unknown> {
   spacing: string | number;
 }
 
-export type PartialTableTheme<T = unknown> = DeepPartial<TableTheme<T>>;
+export type PartialTableTheme<T = unknown> = {
+  [K in keyof TableTheme<T>]?: TableTheme<T>[K] extends Record<string, any> ? Partial<TableTheme<T>[K]> : TableTheme<T>[K];
+};
 
 export interface TableProps<T> extends Partial<TableTheme<T>> {
   //////////////////////////////////////////////////