skills.rest
iEnergyy
iEnergyyCOMMUNITY
Explore all skills by this author →
GitHub

tanstack-table

Implement headless table logic for sorting, filtering, pagination, and selection with TanStack Table.

Updated Apr 14, 2026
Search Tags:#typescript#react#tanstack#headless#table#ui-library#datagrid
One-click install
npx skills add https://github.com/iEnergyy/opsflow --skill tanstack-table-ienergyy
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tanstack-table
Source: https://github.com/iEnergyy/opsflow/tree/main/.agents/skills/tanstack-table
Command: npx skills add https://github.com/iEnergyy/opsflow --skill tanstack-table-ienergyy

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Table provides a headless UI framework to implement robust, feature-rich data tables without rendering markup or styles, enabling precise control over rendering and behavior.

Core Features & Use Cases

  • Sorting, filtering, pagination, grouping, and row selection logic without opinionated UI.
  • Works across TS/JS ecosystems and frameworks (React, Vue, Svelte, etc.) to render accessible, high-performance datagrids.
  • Example use: build a customizable admin table with server-side pagination and dynamic column definitions.

Quick Start

Create a minimal headless table setup for a React app using TanStack Table.

Frequently Asked Questions about tanstack-table

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a headless data table with sorting and pagination in React?▼

A headless table separates data logic from UI rendering, providing state management for sorting, filtering, and pagination without generating markup. This approach gives developers complete control over styling and DOM structure while handling complex data grid operations.

Can I use TanStack Table to implement server-side pagination and dynamic columns?▼

Yes, TanStack Table supports server-side pagination and dynamic column definitions. It provides utilities like flexRender and extensible row models to fetch and render interactive, accessible grids from API data efficiently across TypeScript and JavaScript apps.

Does this headless table logic work with Vue, Solid, or Svelte frameworks?▼

Yes, the headless table logic works across Vue, Solid, and Svelte frameworks. It operates independently of UI components, allowing you to integrate table pipelines and interactive grid logic into any TypeScript or JavaScript ecosystem.

What is the best way to manage row selection and filtering without an opinionated UI library?▼

The best way to manage row selection and filtering without an opinionated UI is using a headless framework. It supplies the core row models and state pipelines, letting you implement custom logic and render accessible grids without fighting predefined styles.

Related Skills

Explore More Software Engineering Skills→
Montte-erpMontte-erp
6

tanstack-table

Manage sorting, filtering, pagination, grouping, and row state for dynamic data grids.

Official
Advanced
sncollectivesncollective

tanstack-table-v8

Develops Blazor Server & WebAssembly apps with C#.

Official
Intermediate
skilld-devskilld-dev
174

tanstack-vue-table-skilld

Integrate TanStack Vue Table into Vue 3 apps with sorting, filtering, pagination, and grouping.

Official
Intermediate
joshkellett87joshkellett87

frontend-ui-ux

Convert designer briefs into HTML/CSS/JS frontend prototypes.

Community
Advanced