skills.rest
TanStack
TanStackOFFICIAL
Explore all skills by this author →
Website𝕏@tan_stackGitHub

preact/migrate-v8-to-v9

Migrate TanStack Table v8 code to the v9 Preact adapter.

28.3k|3.6k|Updated Oct 20, 2016
Search Tags:#migration#preact#tanstack-table#flexrender#v8-to-v9#row-models#table-features
One-click install
npx skills add https://github.com/TanStack/table --skill preact-migrate-v8-to-v9
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: preact/migrate-v8-to-v9
Source: https://github.com/TanStack/table/tree/main/packages/preact-table/skills/preact/migrate-v8-to-v9
Command: npx skills add https://github.com/TanStack/table --skill preact-migrate-v8-to-v9

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

TanStack Table v8 to v9 migrations for the Preact adapter can break due to renamed APIs, changed row-model/feature wiring, and updated rendering and typing patterns, causing difficult-to-debug runtime behavior and TypeScript errors.

Core Features & Use Cases

  • Map v8 APIs to v9 equivalents: Converts useReactTable, get*RowModel options, flexRender, and type generics into the v9 useTable, _features/_rowModels, table.FlexRender, and updated ColumnDef/Table helper signatures.
  • Guide the correct v9 feature registration: Ensures the feature(s) you call are registered in _features, and the corresponding row-model factories exist in _rowModels so methods become functional instead of no-ops.
  • Update state management strategy: Translates state + on*Change patterns into the v9-preferred atoms approach for finer-grained updates and better reactivity.

Quick Start

Ask an AI coding agent to generate a v8-to-v9 patch for your @tanstack/preact-table usage by applying the skill’s mappings, replacing useReactTable with useTable and wiring _features/_rowModels, then updating column typing and replacing flexRender calls with table.FlexRender.

Frequently Asked Questions about preact/migrate-v8-to-v9

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

FAQPage Schema
How do I migrate TanStack Table v8 to v9 in Preact?▼

Migrate TanStack Table v8 to v9 in Preact by replacing useReactTable with useTable, wiring _features and _rowModels, updating ColumnDef generics, and switching flexRender to table.FlexRender. This ensures type-safe APIs and functional table methods.

Why are my TanStack Table v9 row models and sorting features no-ops in Preact?▼

TanStack Table v9 features act as no-ops when the corresponding feature is not registered in _features or its row-model factory is missing from _rowModels. You must explicitly wire _features and _rowModels in useTable for methods to become functional.

How do I update state management for TanStack Table v9 in Preact?▼

Update state management for TanStack Table v9 in Preact by translating v8 state and on*Change patterns into the v9-preferred atoms approach. This provides finer-grained updates and better reactivity for table state.

Does Preact TanStack Table v9 require updating ColumnDef and createColumnHelper generics?▼

Yes, Preact TanStack Table v9 requires updating ColumnDef and createColumnHelper generic signatures. Keeping these type generics updated ensures that table features and APIs remain type-safe after the v8 to v9 migration.

What is the best way to replace flexRender when upgrading to TanStack Table v9 in Preact?▼

The best way to replace flexRender when upgrading to TanStack Table v9 in Preact is to use table.FlexRender. This updated rendering utility replaces the v8 flexRender function and aligns with the new v9 preact adapter structure.

Can I automate v8 to v9 TanStack Table patching for Preact projects?▼

You can automate v8 to v9 TanStack Table patching for Preact projects by asking an AI coding agent. The agent applies the skill's mappings to generate a deterministic patch replacing v8-only options with v9 _features and _rowModels wiring.

Related Skills

Explore More Software Engineering Skills→
sncollectivesncollective

tanstack-table-v8

Develops Blazor Server & WebAssembly apps with C#.

Official
Intermediate
TanStackTanStack
28.3k

angular/migrate-v8-to-v9

Migrate @tanstack/angular-table code from v8 to v9 with mechanical translation patterns.

Official
Intermediate
mgd34msumgd34msu
4

jotai

Manage React state with atomic, derived, and async capabilities.

Community
Intermediate
TanStackTanStack
28.3k

vue/migrate-v8-to-v9

Migrate @tanstack/vue-table v8 code to v9 APIs and row models.

Official
Advanced