Content
Table

Table

The Table component allows you to create customizable tables with various styling options. You can configure properties such as width, borders, background, and more.

Examples

Basic Usage

<Widget
	src='flashui.near/widget/Table'
	props={{
		children: (
			<>
				<tr>
					<th>Header 1</th>
					<th>Header 2</th>
					<th>Header 3</th>
				</tr>
				<tr>
					<td>Row 1, Cell 1</td>
					<td>Row 1, Cell 2</td>
					<td>Row 1, Cell 3</td>
				</tr>
				<tr>
					<td>Row 2, Cell 1</td>
					<td>Row 2, Cell 2</td>
					<td>Row 2, Cell 3</td>
				</tr>
			</>
		),
	}}
/>

Props

The Table component accepts the following props:

  • width (string, optional): The width of the table. Defaults to "100%."

  • border (string, optional): The overall table border style. Defaults to "none."

  • borderTop (string, optional): The top border style of the table. Defaults to null.

  • borderBottom (string, optional): The bottom border style of the table. Defaults to null.

  • borderLeft (string, optional): The left border style of the table. Defaults to null.

  • borderRight (string, optional): The right border style of the table. Defaults to null.

  • margin (string, optional): The margin around the table. Defaults to ".5rem."

  • maxWidth (string, optional): The maximum width of the table. Defaults to null.

  • minWidth (string, optional): The minimum width of the table. Defaults to null.

  • background (string, optional): The background color of the table. Defaults to null.

  • boxShadow (string, optional): The box shadow of the table. Defaults to null.

  • overflow (string, optional): The overflow behavior for the table. Defaults to null.

  • children (ReactNode, optional): The content of the table. Defaults to null.

ListTypography