Kubit

components

TableCell

v.1.0.0 | Saturn

Usage

import { TableCell } from '@kubit-ui-web/react-components'

123

<TableCell variant="HEADER_CELL_DEFAULT">
  TableCell
</TableCell>

Let's delve into the versatility of the tableCell component by examining all its avalaible props.


Property	Type	Default	Description
variant	string	-	Current variant of TableCell
id	string	-	HTML identifier
scope	string	-	It specifies whether a header cell is a header for a column, row, or group of columns or rows
th	boolean	false	When true a `th` HTML component will be render
colSpan	number	-	It defines the number of columns a cell should span
rowSpan	number	-	It specifies the number of rows a cell should span
height	string	-	CSS hight
width	string	-	CSS width
minWidth	string	-	CSS min-width
maxWidth	string	-	CSS max-width
textAlign	string	-	CSS text-align
hidden	boolean	-	When true, it will be hidden, but read only by screen readers
sticky	boolean or "right" or "left"	-	It defines the sticky position (Avoid using boolean values for `sticky`, it is preferable to use 'left' or 'right' to define the sticky position)
top	string	-	CSS top
left	string	-	CSS left
right	string	-	CSS right
bottom	string	-	CSS bottom
component	string or React.ComponentType<any>	td	HTML component to render
onClick	function	-	onClick function
onMouseEnter	function	-	onMouseEnter function
onMouseLeave	function	-	onMouseLeave function
aria-label	string	-	aria-label
aria-labelledby	string	-	aria-labelledby
dataTestId	string	tableCell	Id for testing
ctv	string	-	Modify styles for the component