Capítulo 4 de 54

Chapter 4: Agent Skills (TanStack Intent)

Core Idea

TanStack Table ships its own SKILL.md guidance files inside its npm packages (the open Agent Skills format), so AI coding agents — Claude Code, Cursor, Copilot, Codex — can load correct, version-matched v9 usage guidance directly from node_modules, instead of relying on training data that may still suggest deprecated v8 APIs like useReactTable.

Key Concepts

  • Skills live at node_modules/<package>/skills/<skill-name>/SKILL.md and are versioned with the package — updating TanStack Table updates the guidance automatically, no separate CLI step needed.
  • @tanstack/intent is the CLI that wires this up: npx @tanstack/intent@latest install writes a managed intent-skills block into AGENTS.md (default), or CLAUDE.md / .cursorrules / .github/copilot-instructions.md depending on the target agent.
  • Skill coverage by package: @tanstack/table-core → core/architecture/feature skills (sorting, filtering, grouping, pagination, pinning, sizing, selection, aggregation); @tanstack/<framework>-table → framework setup/state/migration/TanStack Query-Virtual composition skills; table-devtools packages → devtools skill; @tanstack/match-sorter-utilsfuzzy-ranking skill.
  • Once wired, the agent is expected to run intent list to see available skills and intent load <package>#<skill> before a substantial table-related task, reading the loaded SKILL.md before editing.
  • Without the CLI, you can point an agent config file directly at a skill file path manually (the path under node_modules is stable even without the CLI).

Code Examples

# one-time setup per project
pnpm add @tanstack/react-table
npx @tanstack/intent@latest install       # writes the intent-skills block
npx @tanstack/intent@latest list          # see what's available
npx @tanstack/intent@latest load @tanstack/react-table#getting-started
  • What it demonstrates: the full loop from installing the adapter to having an agent auto-discover the correct v9 guidance for it.

Key Takeaways

  1. If an AI agent working in this codebase keeps suggesting useReactTable() or other v8 patterns, the fix is npx @tanstack/intent@latest install, not manual prompting.
  2. Confirm it worked by checking that a fresh agent session uses useTable(), declares features/row models explicitly via tableFeatures(), and keeps columns/data references stable — those are the tells that v9 skills are loaded correctly.
  3. This mechanism is specific to TanStack Table's own packages; it doesn't apply to react-docs, radix-primitives-docs, or other skills in this biblioteca-skills library, which are generated once from a documentation snapshot rather than kept live via node_modules.

Connects To

  • Framework Adapters & Installation: the npm install step this guide assumes is already done.
  • Migrating to TanStack Table V9 (React): the v8→v9 API changes the agent skills are meant to prevent regressing into.