AeontelAeontel Docs

Table

Styled HTML table primitives.

Usage

TSX
import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@aeontel/ui";

<Table>
  <TableHeader>
    <TableRow>
      <TableHead>Name</TableHead>
      <TableHead>Status</TableHead>
    </TableRow>
  </TableHeader>
  <TableBody>
    {agents.map((a) => (
      <TableRow key={a.id}>
        <TableCell>{a.name}</TableCell>
        <TableCell>{a.status}</TableCell>
      </TableRow>
    ))}
  </TableBody>
</Table>;

Exports

Table

Root <table> element.

TypeScript
Table(props: React.ComponentProps<"table">): JSX.Element

TableHeader

<thead> section.

TypeScript
TableHeader(props: React.ComponentProps<"thead">): JSX.Element

TableBody

<tbody> section.

TypeScript
TableBody(props: React.ComponentProps<"tbody">): JSX.Element

TableFooter

<tfoot> section.

TypeScript
TableFooter(props: React.ComponentProps<"tfoot">): JSX.Element

TableRow

<tr> element.

TypeScript
TableRow(props: React.ComponentProps<"tr">): JSX.Element

TableHead

<th> header cell.

TypeScript
TableHead(props: React.ComponentProps<"th">): JSX.Element

TableCell

<td> body cell.

TypeScript
TableCell(props: React.ComponentProps<"td">): JSX.Element

TableCaption

<caption> element.

TypeScript
TableCaption(props: React.ComponentProps<"caption">): JSX.Element