Table - Keep React
Table of Contents#
- Default Table
- Transactions Table
- Orders Table
- Files Uploaded Table
- Hoverable Table
- Striped Table
- Bordered Table
- API Reference
The Default Table serves as a foundational example, which can be customized and extended according to specific application needs.
Transactions Table is a specialized type of Table Component designed specifically to display transaction-related data. This type of table typically includes information about various transactions, such as financial transactions, order history, or any other type of recorded actions.
Orders Table is a specific type of Table Component designed to display information related to orders in a structured and organized format. This type of table is commonly used in e-commerce platforms or order management systems to present details about customer orders.
Files Uploaded Table#
A Files Uploaded Table is a specialized Table Component designed to display information about uploaded files in a structured and organized manner. This type of table is commonly used in applications that involve file management, document sharing, or any scenario where tracking and presenting information about uploaded files is necessary.
The Hoverable Table is designed to make it easier for users to identify which row or cell they are interacting with, especially in larger tables where rows and cells might be closely packed.
A Striped Table is a type of Table Component that utilizes alternating background colors for its rows. The rows are styled with different background colors, typically in a pattern of light and dark shades.
A Bordered Table is a type of Table Component in which each cell and row is outlined by borders. These borders can be used to visually separate the cells and rows from each other, creating a well-defined grid structure within the table.
Explore the available props for the table component
|hoverable||Enables hover effect on table rows.||boolean||false|
|showCheckbox||Indicates if checkboxes should be displayed in the table.||boolean||false|
|showBorder||Controls the visibility of the table's borders.||boolean||false|
|showBorderPosition||Determines the position of the table's borders|
|children||Child components and content to be placed within the table.||ReactNode||content|
|striped||Applies alternating background colors to table rows for better readability.||boolean||false|