saturation/ui
DocsComponentsBlocksPages

Sections

IntroductionComponentsInstallationTheming

Components

ComponentsAccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBorder TrailBreadcrumbButtonButton GroupCalendar PickerCardChartCheckboxCollapsibleComboboxCommandContext MenuCredit CardData TableDate PickerDialogDropdown MenuEmptyFieldFiltersFull CalendarGlow EffectInputInput GroupInput OTPItemKanbanKbdMenubarNovel EditorPaginationProgressProgressive BlurRadio GroupSelectSeparatorSheetSkeletonSliderSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography
Docs/Components/Table

Table

A styled table component.

Loading...

Installation

pnpm dlx shadcn@latest add @saturation/table

Usage

import {
  Table,
  TableBody,
  TableCell,
  TableHead,
  TableHeader,
  TableRow,
} from "@/components/ui/table"
<Table>
  <TableHeader>
    <TableRow>
      <TableHead>Name</TableHead>
      <TableHead>Email</TableHead>
    </TableRow>
  </TableHeader>
  <TableBody>
    <TableRow>
      <TableCell>John</TableCell>
      <TableCell>john@example.com</TableCell>
    </TableRow>
  </TableBody>
</Table>

Examples

With Badges

Loading...
Table with status badges.

With Footer

Loading...
Table with footer total.

API Reference

PropTypeDefaultDescription
classNamestring—Additional CSS classes.

On This Page

  • Installation
  • Usage
  • Examples
  • With Badges
  • With Footer
  • API Reference
A list of your recent invoices.
InvoiceStatusMethodAmount
INV001PaidCredit Card$250.00
INV002PendingPayPal$150.00
INV003UnpaidBank Transfer$350.00
INV004PaidCredit Card$450.00
INV005PaidPayPal$550.00
INV006PendingBank Transfer$200.00
INV007UnpaidCredit Card$300.00
InvoiceClientStatusAmount
INV-001Acme ProductionsPaid$12,500.00
INV-002Summit FilmsPending$8,750.00
INV-003Horizon MediaPaid$15,200.00
INV-004Apex StudiosUnpaid$6,300.00
INV-005Nova EntertainmentPaid$22,000.00
INV-006Peak CreativePending$4,800.00
INV-007Atlas DigitalUnpaid$11,100.00
DescriptionQtyRateTotal
Camera rental (5 days)1$2,500.00$2,500.00
Lighting package1$1,800.00$1,800.00
Grip equipment1$1,200.00$1,200.00
Sound recording kit2$450.00$900.00
Production assistant5$300.00$1,500.00
Catering (crew of 20)5$600.00$3,000.00
Grand Total$10,900.00