Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Table Block Sticky Header
Data table component with sticky header that stays fixed while scrolling for React long datasets
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Keep column context on your Next.js dashboard with this sticky header table component. Features fixed header that stays visible during scroll, max-height scrollable container, CSS position sticky with z-index layering, opaque header background to hide scrolling rows, and smooth scrolling behavior. Built with shadcn/ui Table component using Tailwind CSS and native CSS sticky positioning. The scroll-friendly design maintains context—perfect for transaction logs, long reports, admin tables with many rows, or any React app displaying scrollable datasets.
30 transactions
Scroll to see sticky header
| ID | Date | Description | Category | Amount | Status |
|---|---|---|---|---|---|
| TXN0001 | Jan 1, 2024 | Office Supplies Purchase | Operations | $1,250 | Completed |
| TXN0002 | Jan 1, 2024 | Monthly Software Subscription | Software | $499 | Pending |
| TXN0003 | Jan 2, 2024 | Client Invoice Payment | Revenue | $3,200 | Failed |
| TXN0004 | Jan 2, 2024 | Marketing Campaign Expense | Marketing | $875 | Completed |
| TXN0005 | Jan 3, 2024 | Team Lunch Meeting | Team | $156 | Pending |
| TXN0006 | Jan 3, 2024 | Cloud Infrastructure Costs | Infrastructure | $2,100 | Failed |
| TXN0007 | Jan 4, 2024 | Freelancer Payment | Contractors | $1,800 | Completed |
| TXN0008 | Jan 4, 2024 | Equipment Purchase | Equipment | $425 | Pending |
| TXN0009 | Jan 5, 2024 | Office Supplies Purchase | Operations | $2,750 | Failed |
| TXN0010 | Jan 5, 2024 | Monthly Software Subscription | Software | $680 | Completed |
| TXN0011 | Jan 6, 2024 | Client Invoice Payment | Revenue | $1,450 | Pending |
| TXN0012 | Jan 6, 2024 | Marketing Campaign Expense | Marketing | $920 | Failed |
| TXN0013 | Jan 7, 2024 | Team Lunch Meeting | Team | $3,100 | Completed |
| TXN0014 | Jan 7, 2024 | Cloud Infrastructure Costs | Infrastructure | $275 | Pending |
| TXN0015 | Jan 8, 2024 | Freelancer Payment | Contractors | $1,875 | Failed |
| TXN0016 | Jan 8, 2024 | Equipment Purchase | Equipment | $560 | Completed |
| TXN0017 | Jan 9, 2024 | Office Supplies Purchase | Operations | $2,400 | Pending |
| TXN0018 | Jan 9, 2024 | Monthly Software Subscription | Software | $1,100 | Failed |
| TXN0019 | Jan 10, 2024 | Client Invoice Payment | Revenue | $750 | Completed |
| TXN0020 | Jan 10, 2024 | Marketing Campaign Expense | Marketing | $1,950 | Pending |
| TXN0021 | Jan 11, 2024 | Team Lunch Meeting | Team | $380 | Failed |
| TXN0022 | Jan 11, 2024 | Cloud Infrastructure Costs | Infrastructure | $2,600 | Completed |
| TXN0023 | Jan 12, 2024 | Freelancer Payment | Contractors | $1,350 | Pending |
| TXN0024 | Jan 12, 2024 | Equipment Purchase | Equipment | $890 | Failed |
| TXN0025 | Jan 13, 2024 | Office Supplies Purchase | Operations | $2,200 | Completed |
| TXN0026 | Jan 13, 2024 | Monthly Software Subscription | Software | $475 | Pending |
| TXN0027 | Jan 14, 2024 | Client Invoice Payment | Revenue | $1,650 | Failed |
| TXN0028 | Jan 14, 2024 | Marketing Campaign Expense | Marketing | $720 | Completed |
| TXN0029 | Jan 15, 2024 | Team Lunch Meeting | Team | $2,850 | Pending |
| TXN0030 | Jan 15, 2024 | Cloud Infrastructure Costs | Infrastructure | $1,025 | Failed |
Installation
Related blocks you will also like
Table with Sortable Columns
Click headers to sort data
Table with Page Navigation
Paginate long data lists
Searchable Filterable Data Table
Search and filter functionality
Table with Density Toggle
Adjust row spacing modes
Table with Column Visibility
Show/hide columns dynamically
Table with Row Selection
Select rows with checkboxes