From 60e98ed668a21589392fdcb229129d11e59e031c Mon Sep 17 00:00:00 2001
From: mckervinc <mckervinc@live.com>
Date: Thu, 30 May 2024 21:55:46 -0400
Subject: [PATCH] more style changes

---
 example/src/examples/07-controlled.tsx | 3 ++-
 example/src/examples/08-header.tsx     | 3 ++-
 example/src/examples/10-footer.tsx     | 5 +++--
 index.d.ts                             | 4 ++--
 4 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/example/src/examples/07-controlled.tsx b/example/src/examples/07-controlled.tsx
index fb5059e..934b281 100644
--- a/example/src/examples/07-controlled.tsx
+++ b/example/src/examples/07-controlled.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import {
   randCatchPhrase,
   randCity,
@@ -104,7 +105,7 @@ const Controlled = ({ data, height, columns: variableColumns }: ControlledProps)
     <StyledTable
       borders
       data={rows}
-      columns={variableColumns}
+      columns={variableColumns as unknown as any[]}
       tableHeight={height}
       rowHeight={35}
       onSort={onSort}
diff --git a/example/src/examples/08-header.tsx b/example/src/examples/08-header.tsx
index d17dee9..fad6d15 100644
--- a/example/src/examples/08-header.tsx
+++ b/example/src/examples/08-header.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import _ from "lodash";
 import React, { useState } from "react";
 import { ColumnProps, HeaderProps, SortDirection, Table } from "react-fluid-table";
@@ -19,7 +20,7 @@ const HeaderCell = ({ name, sortDirection, style, onClick }: HeaderCellProps) =>
     <Arrow size="small" name={`chevron ${sortDirection === "ASC" ? "up" : "down"}`} />
   );
 
-  const cellStyle = {
+  const cellStyle: any = {
     background: sortDirection ? "rgb(39, 40, 34)" : undefined,
     ...style
   };
diff --git a/example/src/examples/10-footer.tsx b/example/src/examples/10-footer.tsx
index 95e022d..f2485fe 100644
--- a/example/src/examples/10-footer.tsx
+++ b/example/src/examples/10-footer.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import { useEffect, useRef, useState } from "react";
 import { ColumnProps, FooterProps, Table } from "react-fluid-table";
 import { Checkbox, Form, Grid, Icon, Input, Radio } from "semantic-ui-react";
@@ -192,11 +193,11 @@ const Example10 = () => {
       <StyledTable
         borders
         data={testData.slice(0, 30)}
-        columns={columns}
+        columns={columns as unknown as any[]}
         stickyFooter={sticky}
         tableHeight={400}
         footerStyle={{ backgroundColor: "white" }}
-        footerComponent={InnerFooter}
+        footerComponent={InnerFooter as unknown as any}
       />
     </>
   );
diff --git a/index.d.ts b/index.d.ts
index 8b6690d..729a61d 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -172,7 +172,7 @@ export type ColumnProps<T> = {
   /**
    * specifies whether or not to display a footer cell
    */
-  footer?: (props: FooterCellProps<T>) => ReactNode;
+  footer?: (props: FooterCellProps<T>) => ReactNode | JSX.Element;
 };
 
 export type TableRef = {
@@ -310,7 +310,7 @@ export type TableProps<T> = {
   /**
    * When a column has `expander`, this component will be rendered under the row.
    */
-  subComponent?: (props: SubComponentProps<T>) => ReactNode;
+  subComponent?: (props: SubComponentProps<T>) => ReactNode | JSX.Element;
   /**
    * The callback that gets called every time a row is clicked.
    */