Shadcn UI Crud Companies Block
CompaniesList1 is a feature-rich data table built with TanStack Table for displaying company records. The table includes sortable columns with directional arrows, row selection checkboxes, a search input for filtering, and a filter popover with checkbox options for industry and funding filters. Columns display company logo, name, industry badge, employee count, funding, and website link.
Light background with bordered table and rounded corners. Sort buttons show ascending/descending arrows on interaction. The filter popover opens from a sliders button and shows grouped checkbox filters. Badges use secondary styling for industry labels. The search input has a clear button when active. Pinned columns keep selection checkbox visible during horizontal scroll.
This is a comprehensive data table implementation suitable for CRM or admin dashboards. The combination of sorting, filtering, and row selection covers most table interaction needs. Higher complexity due to the TanStack Table integration and multiple filter types.
Dependencies
| Package | Type |
|---|---|
| @tanstack/react-table | NPM |
| lucide-react | NPM |
| react | NPM |
badge @shadcn | Registry |
button @shadcn | Registry |
checkbox @shadcn | Registry |
input @shadcn | Registry |
label @shadcn | Registry |
popover @shadcn | Registry |
table @shadcn | Registry |