"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"
Table
Table component is used to organize and display data efficiently. It renders a `<table>` element by default
Props#
Table#
colorScheme
colorScheme
Type
Default
"gray"
size
size
Type
"sm" | "md" | "lg"
Default
"md"
variant
variant
Type
"simple" | "striped" | "unstyled"
Default
"simple"
Td#
isNumeric
isNumeric
Description
Aligns the cell content to the right
Type
boolean
Th#
isNumeric
isNumeric
Description
Aligns the cell content to the right
Type
boolean
TableCaption#
placement
placement
Description
The placement of the table caption. This sets the `caption-side` CSS attribute.
Type
"top" | "bottom"
Default
"bottom"
Props#
Table#
colorScheme
colorScheme
Type
"whiteAlpha" | "blackAlpha" | "gray" | "red" | "orange" | "yellow" | "green" | "teal" | "blue" | "cyan" | "purple" | "pink" | "linkedin" | "facebook" | "messenger" | "whatsapp" | "twitter" | "telegram"
Default
"gray"
size
size
Type
"sm" | "md" | "lg"
Default
"md"
variant
variant
Type
"simple" | "striped" | "unstyled"
Default
"simple"
Td#
isNumeric
isNumeric
Description
Aligns the cell content to the right
Type
boolean
Th#
isNumeric
isNumeric
Description
Aligns the cell content to the right
Type
boolean
TableCaption#
placement
placement
Description
The placement of the table caption. This sets the `caption-side` CSS attribute.
Type
"top" | "bottom"
Default
"bottom"
TODO