Data Table 10 - Sticky header and first columnPro
Wide regional revenue grid inside a fixed-height scroll area with a sticky header row and a pinned first column that stay visible while scrolling both axes.
About Data Table 10
Wide regional revenue grid inside a fixed-height scroll area with a sticky header row and a pinned first column that stay visible while scrolling both axes.
Data Table 10 is a pro data table block for React, built on shadcn/ui and Tailwind CSS. It ships as 101 lines of TypeScript you own: every piece of copy is a prop with a sensible default, so you can drop it in and replace the content without touching the layout.
- table
- sticky
- scroll-area
- pinned-column
- wide
Installation
- Add the Chocolate UI registry to your
components.json(see the installation guide). - Run the shadcn CLI:
npx shadcn@latest add @chocolate/data-table-10Uses: reveal, scroll-area, utils.
Usage
import DataTable10 from "@/components/blocks/data-table-10"
export default function Page() {
return <DataTable10 />
}