From 9c295d9710e8d0cca3a7f312f286b1d208bf11c2 Mon Sep 17 00:00:00 2001
From: Klink <85062+dogmar@users.noreply.github.com>
Date: Tue, 26 Sep 2023 09:42:16 -0700
Subject: [PATCH] fix: Typescript errors for Switch and Table (#519)

---
 src/components/Switch.tsx     | 4 ++--
 src/components/Table.tsx      | 3 ++-
 src/stories/Table.stories.tsx | 4 ++--
 3 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/Switch.tsx b/src/components/Switch.tsx
index adf4edab..f8d1aed3 100644
--- a/src/components/Switch.tsx
+++ b/src/components/Switch.tsx
@@ -1,4 +1,4 @@
-import { useMemo, useRef } from 'react'
+import { type ComponentProps, useMemo, useRef } from 'react'
 import { useToggleState } from 'react-stately'
 import {
   type AriaSwitchProps,
@@ -26,7 +26,7 @@ type UseSwitchProps = Omit<
 }
 
 export type SwitchProps = UseSwitchProps &
-  Pick<typeof SwitchSC, 'as' | 'className'>
+  Pick<ComponentProps<typeof SwitchSC>, 'as'> & { className?: string }
 
 const SwitchSC = styled.label<SwitchStyleProps>(
   ({ $checked, $disabled, $readOnly, theme }) => ({
diff --git a/src/components/Table.tsx b/src/components/Table.tsx
index f58dc4cf..8f3759d2 100644
--- a/src/components/Table.tsx
+++ b/src/components/Table.tsx
@@ -18,6 +18,7 @@ import type {
   FilterFn,
   Row,
   SortDirection,
+  TableOptions,
 } from '@tanstack/react-table'
 import {
   flexRender,
@@ -64,7 +65,7 @@ export type TableProps = Omit<
     Parameters<typeof useVirtualizer>,
     'parentRef' | 'size'
   >
-  reactTableOptions?: Omit<Parameters<typeof useReactTable>, 'data' | 'columns'>
+  reactTableOptions?: Partial<Omit<TableOptions<any>, 'data' | 'columns'>>
   onRowClick?: (e: MouseEvent<HTMLTableRowElement>, row: Row<any>) => void
 }
 
diff --git a/src/stories/Table.stories.tsx b/src/stories/Table.stories.tsx
index ede46127..afcc7485 100644
--- a/src/stories/Table.stories.tsx
+++ b/src/stories/Table.stories.tsx
@@ -1,6 +1,6 @@
 import { createColumnHelper } from '@tanstack/react-table'
 import { Div, Flex, Input, type InputProps, P } from 'honorable'
-import React, { type ReactElement, useEffect } from 'react'
+import React, { type ComponentProps, type ReactElement, useEffect } from 'react'
 import type { Row } from '@tanstack/react-table'
 
 import {
@@ -235,7 +235,7 @@ function DebouncedInput({
   )
 }
 
-function FilterableTemplate(args: any) {
+function FilterableTemplate(args: ComponentProps<typeof Table>) {
   const [globalFilter, setGlobalFilter] = React.useState('')
 
   return (