Back to Components
Display

Data Table

Sortable, filterable data table with pagination and search.

Aurora Labs
EnterpriseActive422 hours ago
Northwind
TeamActive18Yesterday
Halo Studio
StarterTrial63 days ago
Nova Supply
TeamPaused12Last week
Helix Digital
EnterpriseActive641 hour ago
Signal Ops
TeamActive242 days ago
Showing 6 of 7 records
Page 1 of 2

Dependencies

  • @tanstack/react-table
  • clsx
  • lucide-react
  • tailwind-merge

Files

  • components/ui/data-table.tsx

Installation

Using shadcn CLI

npx shadcn add data-table --url https://ui.hampton.io

Manual installation

Copy the component file to your project and install dependencies:

npm install @tanstack/react-table clsx lucide-react tailwind-merge