@ttoss/components 2.1.1 → 2.1.3

package/README.md

@@ -189,12 +189,6 @@ The `Table` component is a flexible and customizable table that supports sorting
 import * as React from 'react';
 import {
   Table,
-  TableBody,
-  TableCell,
-  TableFooter,
-  TableHead,
-  TableHeader,
-  TableRow,
   createColumnHelper,
   flexRender,
   getCoreRowModel,
@@ -311,61 +305,61 @@ const RenderTable = () => {
 
   return (
     <Table>
-      <TableHead>
+      <Table.Head>
         {table.getHeaderGroups().map((headerGroup) => {
           return (
-            <TableRow key={headerGroup.id}>
+            <Table.Row key={headerGroup.id}>
               {headerGroup.headers.map((header) => {
                 return (
-                  <TableHeader key={header.id}>
+                  <Table.Header key={header.id}>
                     {header.isPlaceholder
                       ? null
                       : flexRender(
                           header.column.columnDef.header,
                           header.getContext()
                         )}
-                  </TableHeader>
+                  </Table.Header>
                 );
               })}
-            </TableRow>
+            </Table.Row>
           );
         })}
-      </TableHead>
-      <TableBody>
+      </Table.Head>
+      <Table.Body>
         {table.getRowModel().rows.map((row) => {
           return (
-            <TableRow key={row.id}>
+            <Table.Row key={row.id}>
               {row.getVisibleCells().map((cell) => {
                 return (
-                  <TableCell key={cell.id}>
+                  <Table.Cell key={cell.id}>
                     {flexRender(cell.column.columnDef.cell, cell.getContext())}
-                  </TableCell>
+                  </Table.Cell>
                 );
               })}
-            </TableRow>
+            </Table.Row>
           );
         })}
-      </TableBody>
-      <TableFooter>
+      </Table.Body>
+      <Table.Footer>
         {table.getFooterGroups().map((footerGroup) => {
           return (
-            <TableRow key={footerGroup.id}>
+            <Table.Row key={footerGroup.id}>
               {footerGroup.headers.map((header) => {
                 return (
-                  <TableHeader key={header.id}>
+                  <Table.Header key={header.id}>
                     {header.isPlaceholder
                       ? null
                       : flexRender(
                           header.column.columnDef.footer,
                           header.getContext()
                         )}
-                  </TableHeader>
+                  </Table.Header>
                 );
               })}
-            </TableRow>
+            </Table.Row>
           );
         })}
-      </TableFooter>
+      </Table.Footer>
     </Table>
   );
 };

package/dist/Table/index.d.ts

@@ -1,14 +1,16 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { BoxProps } from '@ttoss/ui';
-export * from '@tanstack/react-table';
+export { createCell, createColumnHelper, flexRender, getCoreRowModel, useReactTable } from '@tanstack/react-table';
 
-declare const Table: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableHead: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableBody: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableRow: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableCell: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableHeader: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableCaption: (props: BoxProps) => react_jsx_runtime.JSX.Element;
-declare const TableFooter: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+declare const Table: {
+    (props: BoxProps): react_jsx_runtime.JSX.Element;
+    Head: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Body: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Row: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Cell: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Header: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Caption: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+    Footer: (props: BoxProps) => react_jsx_runtime.JSX.Element;
+};
 
-export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };
+export { Table };