@faststore/components 2.0.41-alpha.0 → 2.0.42-alpha.0

package/CHANGELOG.md

@@ -3,6 +3,15 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.42-alpha.0](https://github.com/vtex/faststore/compare/v2.0.41-alpha.0...v2.0.42-alpha.0) (2023-01-10)
+
+
+### Chores
+
+* `Table` component's improvements ([#1592](https://github.com/vtex/faststore/issues/1592)) ([176a710](https://github.com/vtex/faststore/commit/176a710cf8d2917527cb4f99a8ddc956d841ae76))
+
+
+
 ## [2.0.41-alpha.0](https://github.com/vtex/faststore/compare/v2.0.40-alpha.0...v2.0.41-alpha.0) (2023-01-10)
 
 

package/dist/molecules/Table/Table.d.ts

@@ -1,18 +1,16 @@
-import type { TableHTMLAttributes } from 'react';
 import React from 'react';
+import type { TableHTMLAttributes } from 'react';
 export interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
     /**
      * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
      */
     testId?: string;
-    /**
-     * Children for Table components.
-     */
-    children: React.ReactNode;
     /**
      * Defines what style this component should use.
      */
     variant?: 'colored' | 'bordered';
 }
-declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
+declare const Table: React.ForwardRefExoticComponent<TableProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableElement>>;
 export default Table;

package/dist/molecules/Table/Table.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-const Table = forwardRef(function Table({ variant = 'colored', testId = 'fs-table', children, ...otherProps }, ref) {
+const Table = forwardRef(function Table({ children, variant = 'colored', testId = 'fs-table', ...otherProps }, ref) {
     return (React.createElement("div", { "data-fs-table": true },
         React.createElement("table", { ref: ref, "data-fs-table-content": true, "data-fs-table-variant": variant, "data-testid": testId, ...otherProps }, children)));
 });

package/dist/molecules/Table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/molecules/Table/Table.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAiBzC,MAAM,KAAK,GAAG,UAAU,CAA+B,SAAS,KAAK,CACnE,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,GAAG,UAAU,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACrE,GAAG;IAEH,OAAO,CACL;QACE,+BACE,GAAG,EAAE,GAAG,0DAEe,OAAO,iBACjB,MAAM,KACf,UAAU,IAEb,QAAQ,CACH,CACJ,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,KAAK,CAAA"}
+{"version":3,"file":"Table.js","sourceRoot":"","sources":["../../../src/molecules/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAczC,MAAM,KAAK,GAAG,UAAU,CACtB,SAAS,KAAK,CACZ,EAAE,QAAQ,EAAE,OAAO,GAAG,SAAS,EAAE,MAAM,GAAG,UAAU,EAAE,GAAG,UAAU,EAAE,EACrE,GAAG;IAEH,OAAO,CACL;QACE,+BACE,GAAG,EAAE,GAAG,0DAEe,OAAO,iBACjB,MAAM,KACf,UAAU,IAEb,QAAQ,CACH,CACJ,CACP,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,KAAK,CAAA"}

package/dist/molecules/Table/TableBody.d.ts

@@ -1,14 +1,12 @@
-import type { HTMLAttributes } from 'react';
 import React from 'react';
+import type { HTMLAttributes } from 'react';
 export interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {
     /**
      * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
      */
     testId?: string;
-    /**
-     * Children for TableBody components.
-     */
-    children: React.ReactNode;
 }
-declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableSectionElement>>;
 export default TableBody;

package/dist/molecules/Table/TableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableBody.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAczC,MAAM,SAAS,GAAG,UAAU,CAC1B,SAAS,SAAS,CAChB,EAAE,QAAQ,EAAE,MAAM,GAAG,eAAe,EAAE,GAAG,UAAU,EAAE,EACrD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,iCAAyB,UAAU,IACpE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableBody.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAWzC,MAAM,SAAS,GAAG,UAAU,CAG1B,SAAS,SAAS,CAClB,EAAE,QAAQ,EAAE,MAAM,GAAG,eAAe,EAAE,GAAG,UAAU,EAAE,EACrD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,iCAAyB,UAAU,IACpE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/molecules/Table/TableCell.d.ts

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react';
 import React from 'react';
+import type { HTMLAttributes } from 'react';
 type TableCellVariant = 'data' | 'header';
 export interface TableCellProps extends HTMLAttributes<HTMLTableCellElement> {
     /**
@@ -20,5 +20,7 @@ export interface TableCellProps extends HTMLAttributes<HTMLTableCellElement> {
      */
     align?: 'left' | 'center' | 'right';
 }
-declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableCellElement>>;
 export default TableCell;

package/dist/molecules/Table/TableCell.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-const TableCell = forwardRef(function TableCell({ testId = 'fs-table-cell', children, variant = 'data', scope, align, ...otherProps }, ref) {
+const TableCell = forwardRef(function TableCell({ scope, align, children, variant = 'data', testId = 'fs-table-cell', ...otherProps }, ref) {
     const Cell = variant === 'header' ? 'th' : 'td';
     return (React.createElement(Cell, { ref: ref, "data-fs-table-cell": variant, "data-fs-table-cell-align": align, "data-testid": testId, scope: scope, ...otherProps }, children));
 });

package/dist/molecules/Table/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableCell.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAwBzC,MAAM,SAAS,GAAG,UAAU,CAC1B,SAAS,SAAS,CAChB,EACE,MAAM,GAAG,eAAe,EACxB,QAAQ,EACR,OAAO,GAAG,MAAM,EAChB,KAAK,EACL,KAAK,EACL,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,IAAI,GAAG,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;IAE/C,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,GAAG,wBACY,OAAO,8BACD,KAAK,iBAClB,MAAM,EACnB,KAAK,EAAE,KAAK,KACR,UAAU,IAEb,QAAQ,CACJ,CACR,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableCell.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAyBzC,MAAM,SAAS,GAAG,UAAU,CAG1B,SAAS,SAAS,CAClB,EACE,KAAK,EACL,KAAK,EACL,QAAQ,EACR,OAAO,GAAG,MAAM,EAChB,MAAM,GAAG,eAAe,EACxB,GAAG,UAAU,EACd,EACD,GAAG;IAEH,MAAM,IAAI,GAAG,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA;IAE/C,OAAO,CACL,oBAAC,IAAI,IACH,GAAG,EAAE,GAAG,wBACY,OAAO,8BACD,KAAK,iBAClB,MAAM,EACnB,KAAK,EAAE,KAAK,KACR,UAAU,IAEb,QAAQ,CACJ,CACR,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/molecules/Table/TableFooter.d.ts

@@ -1,14 +1,12 @@
-import type { HTMLAttributes } from 'react';
 import React from 'react';
+import type { HTMLAttributes } from 'react';
 export interface TableFooterProps extends HTMLAttributes<HTMLTableSectionElement> {
     /**
      * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
      */
     testId?: string;
-    /**
-     * Children for TableFooter components.
-     */
-    children: React.ReactNode;
 }
-declare const TableFooter: React.ForwardRefExoticComponent<TableFooterProps & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: React.ForwardRefExoticComponent<TableFooterProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableSectionElement>>;
 export default TableFooter;

package/dist/molecules/Table/TableFooter.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableFooter.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableFooter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAczC,MAAM,WAAW,GAAG,UAAU,CAC5B,SAAS,WAAW,CAClB,EAAE,QAAQ,EAAE,MAAM,GAAG,iBAAiB,EAAE,GAAG,UAAU,EAAE,EACvD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,mCAA2B,UAAU,IACtE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"TableFooter.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAWzC,MAAM,WAAW,GAAG,UAAU,CAG5B,SAAS,WAAW,CACpB,EAAE,QAAQ,EAAE,MAAM,GAAG,iBAAiB,EAAE,GAAG,UAAU,EAAE,EACvD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,mCAA2B,UAAU,IACtE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,WAAW,CAAA"}

package/dist/molecules/Table/TableHead.d.ts

@@ -1,14 +1,12 @@
-import type { HTMLAttributes } from 'react';
 import React from 'react';
+import type { HTMLAttributes } from 'react';
 export interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {
     /**
      * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
      */
     testId?: string;
-    /**
-     * Children for TableHead components.
-     */
-    children: React.ReactNode;
 }
-declare const TableHead: React.ForwardRefExoticComponent<TableHeadProps & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableHead: React.ForwardRefExoticComponent<TableHeadProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableSectionElement>>;
 export default TableHead;

package/dist/molecules/Table/TableHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHead.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableHead.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAczC,MAAM,SAAS,GAAG,UAAU,CAC1B,SAAS,SAAS,CAChB,EAAE,QAAQ,EAAE,MAAM,GAAG,eAAe,EAAE,GAAG,UAAU,EAAE,EACrD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,iCAAyB,UAAU,IACpE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,SAAS,CAAA"}
+{"version":3,"file":"TableHead.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableHead.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAWzC,MAAM,SAAS,GAAG,UAAU,CAG1B,SAAS,SAAS,CAClB,EAAE,QAAQ,EAAE,MAAM,GAAG,eAAe,EAAE,GAAG,UAAU,EAAE,EACrD,GAAG;IAEH,OAAO,CACL,+BAAO,GAAG,EAAE,GAAG,iBAAe,MAAM,iCAAyB,UAAU,IACpE,QAAQ,CACH,CACT,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

package/dist/molecules/Table/TableRow.d.ts

@@ -1,14 +1,12 @@
-import type { HTMLAttributes } from 'react';
 import React from 'react';
+import type { HTMLAttributes } from 'react';
 export interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {
     /**
      * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
      */
     testId?: string;
-    /**
-     * Children for TableRow components.
-     */
-    children: React.ReactNode;
 }
-declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
+declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLTableRowElement>>;
 export default TableRow;

package/dist/molecules/Table/TableRow.js

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-const TableRow = forwardRef(function TableRow({ testId = 'fs-table-row', children, ...otherProps }, ref) {
+const TableRow = forwardRef(function TableRow({ children, testId = 'fs-table-row', ...otherProps }, ref) {
     return (React.createElement("tr", { ref: ref, "data-fs-table-row": true, "data-testid": testId, ...otherProps }, children));
 });
 export default TableRow;

package/dist/molecules/Table/TableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableRow.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAazC,MAAM,QAAQ,GAAG,UAAU,CACzB,SAAS,QAAQ,CACf,EAAE,MAAM,GAAG,cAAc,EAAE,QAAQ,EAAE,GAAG,UAAU,EAAE,EACpD,GAAG;IAEH,OAAO,CACL,4BAAI,GAAG,EAAE,GAAG,4CAAiC,MAAM,KAAM,UAAU,IAChE,QAAQ,CACN,CACN,CAAA;AACH,CAAC,CACF,CAAA;AAED,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"TableRow.js","sourceRoot":"","sources":["../../../src/molecules/Table/TableRow.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAUzC,MAAM,QAAQ,GAAG,UAAU,CAGzB,SAAS,QAAQ,CAAC,EAAE,QAAQ,EAAE,MAAM,GAAG,cAAc,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG;IAC3E,OAAO,CACL,4BAAI,GAAG,EAAE,GAAG,4CAAiC,MAAM,KAAM,UAAU,IAChE,QAAQ,CACN,CACN,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/components",
-  "version": "2.0.41-alpha.0",
+  "version": "2.0.42-alpha.0",
   "module": "dist/index.js",
   "typings": "dist/index.d.ts",
   "author": "Emerson Laurentino @emersonlaurentino",
@@ -30,5 +30,5 @@
     "node": "16.18.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "e307ecc596c61e0da4b83cb76aeea0c677197e03"
+  "gitHead": "47ce2b7c180d5a90d1ebadd7628ee47d0ceb1280"
 }

package/src/molecules/Table/Table.tsx

@@ -1,38 +1,36 @@
-import type { TableHTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { TableHTMLAttributes, PropsWithChildren } from 'react'
 
 export interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
   /**
    * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
    */
   testId?: string
-  /**
-   * Children for Table components.
-   */
-  children: React.ReactNode
   /**
    * Defines what style this component should use.
    */
   variant?: 'colored' | 'bordered'
 }
 
-const Table = forwardRef<HTMLTableElement, TableProps>(function Table(
-  { variant = 'colored', testId = 'fs-table', children, ...otherProps },
-  ref
-) {
-  return (
-    <div data-fs-table>
-      <table
-        ref={ref}
-        data-fs-table-content
-        data-fs-table-variant={variant}
-        data-testid={testId}
-        {...otherProps}
-      >
-        {children}
-      </table>
-    </div>
-  )
-})
+const Table = forwardRef<HTMLTableElement, PropsWithChildren<TableProps>>(
+  function Table(
+    { children, variant = 'colored', testId = 'fs-table', ...otherProps },
+    ref
+  ) {
+    return (
+      <div data-fs-table>
+        <table
+          ref={ref}
+          data-fs-table-content
+          data-fs-table-variant={variant}
+          data-testid={testId}
+          {...otherProps}
+        >
+          {children}
+        </table>
+      </div>
+    )
+  }
+)
 
 export default Table

package/src/molecules/Table/TableBody.tsx

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { HTMLAttributes, PropsWithChildren } from 'react'
 
 export interface TableBodyProps
   extends HTMLAttributes<HTMLTableSectionElement> {
@@ -7,23 +7,20 @@ export interface TableBodyProps
    * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
    */
   testId?: string
-  /**
-   * Children for TableBody components.
-   */
-  children: React.ReactNode
 }
 
-const TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(
-  function TableBody(
-    { children, testId = 'fs-table-body', ...otherProps },
-    ref
-  ) {
-    return (
-      <tbody ref={ref} data-testid={testId} data-fs-table-body {...otherProps}>
-        {children}
-      </tbody>
-    )
-  }
-)
+const TableBody = forwardRef<
+  HTMLTableSectionElement,
+  PropsWithChildren<TableBodyProps>
+>(function TableBody(
+  { children, testId = 'fs-table-body', ...otherProps },
+  ref
+) {
+  return (
+    <tbody ref={ref} data-testid={testId} data-fs-table-body {...otherProps}>
+      {children}
+    </tbody>
+  )
+})
 
 export default TableBody

package/src/molecules/Table/TableCell.tsx

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { HTMLAttributes, PropsWithChildren } from 'react'
 
 type TableCellVariant = 'data' | 'header'
 
@@ -23,33 +23,34 @@ export interface TableCellProps extends HTMLAttributes<HTMLTableCellElement> {
   align?: 'left' | 'center' | 'right'
 }
 
-const TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(
-  function TableCell(
-    {
-      testId = 'fs-table-cell',
-      children,
-      variant = 'data',
-      scope,
-      align,
-      ...otherProps
-    },
-    ref
-  ) {
-    const Cell = variant === 'header' ? 'th' : 'td'
+const TableCell = forwardRef<
+  HTMLTableCellElement,
+  PropsWithChildren<TableCellProps>
+>(function TableCell(
+  {
+    scope,
+    align,
+    children,
+    variant = 'data',
+    testId = 'fs-table-cell',
+    ...otherProps
+  },
+  ref
+) {
+  const Cell = variant === 'header' ? 'th' : 'td'
 
-    return (
-      <Cell
-        ref={ref}
-        data-fs-table-cell={variant}
-        data-fs-table-cell-align={align}
-        data-testid={testId}
-        scope={scope}
-        {...otherProps}
-      >
-        {children}
-      </Cell>
-    )
-  }
-)
+  return (
+    <Cell
+      ref={ref}
+      data-fs-table-cell={variant}
+      data-fs-table-cell-align={align}
+      data-testid={testId}
+      scope={scope}
+      {...otherProps}
+    >
+      {children}
+    </Cell>
+  )
+})
 
 export default TableCell

package/src/molecules/Table/TableFooter.tsx

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { HTMLAttributes, PropsWithChildren } from 'react'
 
 export interface TableFooterProps
   extends HTMLAttributes<HTMLTableSectionElement> {
@@ -7,23 +7,20 @@ export interface TableFooterProps
    * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
    */
   testId?: string
-  /**
-   * Children for TableFooter components.
-   */
-  children: React.ReactNode
 }
 
-const TableFooter = forwardRef<HTMLTableSectionElement, TableFooterProps>(
-  function TableFooter(
-    { children, testId = 'fs-table-footer', ...otherProps },
-    ref
-  ) {
-    return (
-      <tfoot ref={ref} data-testid={testId} data-fs-table-footer {...otherProps}>
-        {children}
-      </tfoot>
-    )
-  }
-)
+const TableFooter = forwardRef<
+  HTMLTableSectionElement,
+  PropsWithChildren<TableFooterProps>
+>(function TableFooter(
+  { children, testId = 'fs-table-footer', ...otherProps },
+  ref
+) {
+  return (
+    <tfoot ref={ref} data-testid={testId} data-fs-table-footer {...otherProps}>
+      {children}
+    </tfoot>
+  )
+})
 
 export default TableFooter

package/src/molecules/Table/TableHead.tsx

@@ -1,5 +1,5 @@
-import type { HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { HTMLAttributes, PropsWithChildren } from 'react'
 
 export interface TableHeadProps
   extends HTMLAttributes<HTMLTableSectionElement> {
@@ -7,23 +7,20 @@ export interface TableHeadProps
    * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
    */
   testId?: string
-  /**
-   * Children for TableHead components.
-   */
-  children: React.ReactNode
 }
 
-const TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(
-  function TableHead(
-    { children, testId = 'fs-table-head', ...otherProps },
-    ref
-  ) {
-    return (
-      <thead ref={ref} data-testid={testId} data-fs-table-head {...otherProps}>
-        {children}
-      </thead>
-    )
-  }
-)
+const TableHead = forwardRef<
+  HTMLTableSectionElement,
+  PropsWithChildren<TableHeadProps>
+>(function TableHead(
+  { children, testId = 'fs-table-head', ...otherProps },
+  ref
+) {
+  return (
+    <thead ref={ref} data-testid={testId} data-fs-table-head {...otherProps}>
+      {children}
+    </thead>
+  )
+})
 
 export default TableHead

package/src/molecules/Table/TableRow.tsx

@@ -1,28 +1,22 @@
-import type { HTMLAttributes } from 'react'
 import React, { forwardRef } from 'react'
+import type { HTMLAttributes, PropsWithChildren } from 'react'
 
 export interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {
   /**
    * ID to find this component in testing tools (e.g.: cypress, testing library, and jest).
    */
   testId?: string
-  /**
-   * Children for TableRow components.
-   */
-  children: React.ReactNode
 }
 
-const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(
-  function TableRow(
-    { testId = 'fs-table-row', children, ...otherProps },
-    ref
-  ) {
-    return (
-      <tr ref={ref} data-fs-table-row data-testid={testId} {...otherProps}>
-        {children}
-      </tr>
-    )
-  }
-)
+const TableRow = forwardRef<
+  HTMLTableRowElement,
+  PropsWithChildren<TableRowProps>
+>(function TableRow({ children, testId = 'fs-table-row', ...otherProps }, ref) {
+  return (
+    <tr ref={ref} data-fs-table-row data-testid={testId} {...otherProps}>
+      {children}
+    </tr>
+  )
+})
 
 export default TableRow