Table

A responsive table component for displaying tabular data.

Examples

State

Striped

State

Hoverable

State

Compact

Invoice	Status	Method	Amount
InvoiceINV001	StatusPaid	MethodCredit Card	Amount$250.00
InvoiceINV002	StatusPending	MethodPayPal	Amount$150.00
InvoiceINV003	StatusUnpaid	MethodBank Transfer	Amount$350.00

import { Table } from 'kalki-design'

<Table>Click me</Table>

npx kalki-design add table

import { Table } from 'kalki-design'

export default function Example() {
  return <Table />
}

Name	Type	Default	Description
Name`striped`	Type`boolean`	Default`false`	DescriptionAlternating background colors for rows.
Name`hoverable`	Type`boolean`	Default`false`	DescriptionHighlight rows on hover.
Name`compact`	Type`boolean`	Default`false`	DescriptionReduces padding inside cells.
Name`stickyHeader`	Type`boolean`	Default`false`	DescriptionFixes header at the top when scrolling.