Shadcn Table screenshot

Shadcn Table

Author Avatar Theme by Sadmann7
Updated: 27 Apr 2025
4952 Stars

Shadcn table with server-side sorting, filtering, and pagination.

Categories

Overview

The Shadcn Table is a table component that offers server-side sorting, filtering, and pagination. It is built with Next.js as the framework and Tailwind CSS for styling. The component is part of the Shadcn UI package and uses the TanStack/react-table package for table functionality. However, it is important to note that the project is still in development and is not yet suitable for production use.

Features

  • Server-side pagination, sorting, and filtering
  • Customizable columns
  • Dynamic debounced search inputs
  • Dynamic faceted filters
  • Optional advanced filtering
  • Optional floating bar on row selection
  • Action to delete rows

Installation

  1. Clone the repository.
  2. Install dependencies using pnpm.
  3. Copy the .env.example file to .env and update the variables.
  4. Start the development server.
  5. Push the database schema.

Summary

The Shadcn Table is a powerful table component with various features for server-side sorting, filtering, and pagination. It offers customizable columns, dynamic search inputs, and faceted filters. Additionally, it provides an optional floating bar for row selection and an action to delete rows. Although the project is still in development, it shows promise for creating efficient and functional tables in web applications.