feat: follow other tanstack naming conventions (#5615)

docs/api/core/table.md

@@ -2,10 +2,10 @@
 title: Table APIs
 ---
 
-## `createAngularTable` / `useReactTable` / `createSolidTable` / `useQwikTable` / `useVueTable` / `createSvelteTable`
+## `createTable` / `useTable` / `injectTable`
 
 ```tsx
-type useReactTable = <TData extends AnyData>(
+type useTable = <TData extends AnyData>(
   options: TableOptions<TData>
 ) => Table<TData>
 ```

docs/api/features/column-filtering.md

@@ -278,7 +278,7 @@ const column = columnHelper.data('key', {
   filterFn: 'myCustomFilter',
 })
 
-const table = useReactTable({
+const table = useTable({
   columns: [column],
   filterFns: {
     myCustomFilter: (rows, columnIds, filterValue) => {

docs/api/features/global-filtering.md

@@ -135,7 +135,7 @@ const column = columnHelper.data('key', {
   filterFn: 'myCustomFilter',
 })
 
-const table = useReactTable({
+const table = useTable({
   columns: [column],
   filterFns: {
     myCustomFilter: (rows, columnIds, filterValue) => {

docs/api/features/grouping.md

@@ -242,7 +242,7 @@ const column = columnHelper.data('key', {
   aggregationFn: 'myCustomAggregation',
 })
 
-const table = useReactTable({
+const table = useTable({
   columns: [column],
   aggregationFns: {
     myCustomAggregation: (columnId, leafRows, childRows) => {

docs/api/features/sorting.md

@@ -259,7 +259,7 @@ const column = columnHelper.data('key', {
   sortingFn: 'myCustomSorting',
 })
 
-const table = useReactTable({
+const table = useTable({
   columns: [column],
   sortingFns: {
     myCustomSorting: (rowA: any, rowB: any, columnId: any): number =>

docs/faq.md

@@ -26,8 +26,8 @@ export default function MyComponent() {
     // ...
   ];
 
-  //❌ Columns and data are defined in the same scope as `useReactTable` without a stable reference, will cause infinite loop!
-  const table = useReactTable({
+  //❌ Columns and data are defined in the same scope as `useTable` without a stable reference, will cause infinite loop!
+  const table = useTable({
     columns,
     data,
   });
@@ -64,7 +64,7 @@ export default function MyComponent() {
   ]);
 
   // Columns and data are defined in a stable reference, will not cause infinite loop!
-  const table = useReactTable({
+  const table = useTable({
     columns,
     data,
   });
@@ -89,7 +89,7 @@ export default function MyComponent() {
     //...
   });
 
-  const table = useReactTable({
+  const table = useTable({
     columns,
     //❌ BAD: This will cause an infinite loop of re-renders because `data` is mutated in place (destroys stable reference)
     data: data?.filter(d => d.isActive) ?? [],
@@ -118,7 +118,7 @@ export default function MyComponent() {
   //✅ GOOD: This will not cause an infinite loop of re-renders because `filteredData` is memoized
   const filteredData = useMemo(() => data?.filter(d => d.isActive) ?? [], [data]);
 
-  const table = useReactTable({
+  const table = useTable({
     columns,
     data: filteredData, // stable reference!
   });
@@ -156,7 +156,7 @@ React.useEffect(() => {
   skipPageResetRef.current = false
 })
 
-useReactTable({
+useTable({
   ...
   autoResetPageIndex: !skipPageResetRef.current,
   autoResetExpanded: !skipPageResetRef.current,

docs/framework/angular/angular-table.md

@@ -9,17 +9,17 @@ state the "angular signals" way, providing types and the rendering implementatio
 
 `@tanstack/angular-table` re-exports all of `@tanstack/table-core`'s APIs and the following:
 
-### `createAngularTable`
+### `injectTable`
 
 Accepts an options function or a computed value that returns the table options, and returns a table.
 
 ```ts
-import {createAngularTable} from '@tanstack/angular-table'
+import {injectTable} from '@tanstack/angular-table'
 
 export class AppComponent {
   data = signal<Person[]>([])
 
-  table = createAngularTable(() => ({
+  table = injectTable(() => ({
     data: this.data(),
     columns: defaultColumns,
     getCoreRowModel: getCoreRowModel(),

docs/framework/angular/guide/table-state.md

@@ -11,7 +11,7 @@ TanStack Table has a simple underlying internal state management system to store
 You do not need to set up anything special in order for the table state to work. If you pass nothing into either `state`, `initialState`, or any of the `on[State]Change` table options, the table will manage its own state internally. You can access any part of this internal state by using the `table.getState()` table instance API.
 
 ```ts
-table = createAngularTable(() => ({
+table = injectTable(() => ({
   columns: this.columns,
   data: this.data(),
   //...
@@ -28,7 +28,7 @@ someHandler() {
 If all you need to do for certain states is customize their initial default values, you still do not need to manage any of the state yourself. You can simply set values in the `initialState` option of the table instance.
 
 ```jsx
-table = createAngularTable(() => ({
+table = injectTable(() => ({
   columns: this.columns,
   data: this.data(),
   initialState: {
@@ -91,7 +91,7 @@ class TableComponent {
   )
   readonly data = toSignal(this.data$);
 
-  readonly table = createAngularTable(() => ({
+  readonly table = injectTable(() => ({
     columns: this.columns,
     data: this.data(),
     //...
@@ -135,7 +135,7 @@ class TableComponent {
   readonly state = signal({} as TableState);
 
   // create a table instance with default state values
-  readonly table = createAngularTable(() => ({
+  readonly table = injectTable(() => ({
     columns: this.columns,
     data: this.data(),
     // our fully controlled state overrides the internal state
@@ -175,7 +175,7 @@ Specifying an `on[State]Change` callback tells the table instance that this will
 class TableComponent {
   sorting = signal<SortingState>([])
 
-  table = createAngularTable(() => ({
+  table = injectTable(() => ({
     columns: this.columns,
     data: this.data(),
     //...
@@ -204,7 +204,7 @@ This is why you will see the `updater instanceof Function ? this.state.update(up
 All complex states in TanStack Table have their own TypeScript types that you can import and use. This can be handy for ensuring that you are using the correct data structures and properties for the state values that you are controlling.
 
 ```ts
-import {createAngularTable, type SortingState} from '@tanstack/angular-table'
+import {injectTable, type SortingState} from '@tanstack/angular-table'
 
 class TableComponent {
   readonly sorting = signal<SortingState>([

docs/framework/qwik/guide/table-state.md

@@ -11,7 +11,7 @@ TanStack Table has a simple underlying internal state management system to store
 You do not need to set up anything special in order for the table state to work. If you pass nothing into either `state`, `initialState`, or any of the `on[State]Change` table options, the table will manage its own state internally. You can access any part of this internal state by using the `table.getState()` table instance API.
 
 ```jsx
-const table = useQwikTable({
+const table = useTable({
   columns,
   data,
   //...
@@ -26,7 +26,7 @@ console.log(table.getState().rowSelection) //access just the row selection state
 If all you need to do for certain states is customize their initial default values, you still do not need to manage any of the state yourself. You can simply set values in the `initialState` option of the table instance.
 
 ```jsx
-const table = useQwikTable({
+const table = useTable({
   columns,
   data,
   initialState: {
@@ -75,7 +75,7 @@ const tableQuery = useQuery({
   //...
 })
 
-const table = useQwikTable({
+const table = useTable({
   columns: columns.value,
   data: tableQuery.data,
   //...
@@ -105,7 +105,7 @@ A couple of more tricks may be needed to make this work. If you use the `onState
 
 ```jsx
 //create a table instance with default state values
-const table = useQwikTable({
+const table = useTable({
   columns,
   data,
   //... Note: `state` values are NOT passed in yet
@@ -141,7 +141,7 @@ Specifying an `on[State]Change` callback tells the table instance that this will
 ```jsx
 const sorting = Qwik.useSignal([])
 //...
-const table = useQwikTable({
+const table = useTable({
   columns,
   data,
   //...
@@ -167,7 +167,7 @@ This is why you will see the `updater instanceof Function ? updater(state.value)
 All complex states in TanStack Table have their own TypeScript types that you can import and use. This can be handy for ensuring that you are using the correct data structures and properties for the state values that you are controlling.
 
 ```tsx
-import { useQwikTable, type SortingState } from '@tanstack/qwik-table'
+import { useTable, type SortingState } from '@tanstack/qwik-table'
 //...
 const sorting = Qwik.useSignal<SortingState[]>([
   {

docs/framework/qwik/qwik-table.md

@@ -8,14 +8,14 @@ The `@tanstack/qwik-table` adapter is a wrapper around the core table logic. Mos
 
 `@tanstack/qwik-table` re-exports all of `@tanstack/table-core`'s APIs and the following:
 
-### `useQwikTable`
+### `useTable`
 
 Takes an `options` object and returns a table from a Qwik Store with `NoSerialize`.
 
 ```ts
-import { useQwikTable } from '@tanstack/qwik-table'
+import { useTable } from '@tanstack/qwik-table'
 
-const table = useQwikTable(options)
+const table = useTable(options)
 // ...render your table
 
 ```

docs/framework/react/guide/table-state.md

@@ -18,7 +18,7 @@ TanStack Table has a simple underlying internal state management system to store
 You do not need to set up anything special in order for the table state to work. If you pass nothing into either `state`, `initialState`, or any of the `on[State]Change` table options, the table will manage its own state internally. You can access any part of this internal state by using the `table.getState()` table instance API.
 
 ```jsx
-const table = useReactTable({
+const table = useTable({
   columns,
   data,
   //...
@@ -33,7 +33,7 @@ console.log(table.getState().rowSelection) //access just the row selection state
 If all you need to do for certain states is customize their initial default values, you still do not need to manage any of the state yourself. You can simply set values in the `initialState` option of the table instance.
 
 ```jsx
-const table = useReactTable({
+const table = useTable({
   columns,
   data,
   initialState: {
@@ -82,7 +82,7 @@ const tableQuery = useQuery({
   //...
 })
 
-const table = useReactTable({
+const table = useTable({
   columns,
   data: tableQuery.data,
   //...
@@ -106,7 +106,7 @@ A couple of more tricks may be needed to make this work. If you use the `onState
 
 ```jsx
 //create a table instance with default state values
-const table = useReactTable({
+const table = useTable({
   columns,
   data,
   //... Note: `state` values are NOT passed in yet
@@ -140,7 +140,7 @@ Specifying an `on[State]Change` callback tells the table instance that this will
 ```jsx
 const [sorting, setSorting] = React.useState([])
 //...
-const table = useReactTable({
+const table = useTable({
   columns,
   data,
   //...
@@ -161,7 +161,7 @@ What implications does this have? It means that if you want to add in some extra
 const [sorting, setSorting] = React.useState([])
 const [pagination, setPagination] = React.useState({ pageIndex: 0, pageSize: 10 })
 
-const table = useReactTable({
+const table = useTable({
   columns,
   data,
   //...
@@ -193,7 +193,7 @@ const table = useReactTable({
 All complex states in TanStack Table have their own TypeScript types that you can import and use. This can be handy for ensuring that you are using the correct data structures and properties for the state values that you are controlling.
 
 ```tsx
-import { useReactTable, type SortingState } from '@tanstack/react-table'
+import { useTable, type SortingState } from '@tanstack/react-table'
 //...
 const [sorting, setSorting] = React.useState<SortingState[]>([
   {

docs/framework/react/react-table.md

@@ -4,15 +4,15 @@ title: React Table
 
 The `@tanstack/react-table` adapter is a wrapper around the core table logic. Most of its job is related to managing state the "react" way, providing types and the rendering implementation of cell/header/footer templates.
 
-## `useReactTable`
+## `useTable`
 
 Takes an `options` object and returns a table.
 
 ```tsx
-import { useReactTable } from '@tanstack/react-table'
+import { useTable } from '@tanstack/react-table'
 
 function App() {
-  const table = useReactTable(options)
+  const table = useTable(options)
 
   // ...render your table
 }

docs/framework/solid/guide/table-state.md

@@ -11,7 +11,7 @@ TanStack Table has a simple underlying internal state management system to store
 You do not need to set up anything special in order for the table state to work. If you pass nothing into either `state`, `initialState`, or any of the `on[State]Change` table options, the table will manage its own state internally. You can access any part of this internal state by using the `table.getState()` table instance API.
 
 ```jsx
-const table = createSolidTable({
+const table = createTable({
   columns,
   get data() {
     return data()
@@ -28,7 +28,7 @@ console.log(table.getState().rowSelection) //access just the row selection state
 If all you need to do for certain states is customize their initial default values, you still do not need to manage any of the state yourself. You can simply set values in the `initialState` option of the table instance.
 
 ```jsx
-const table = createSolidTable({
+const table = createTable({
   columns,
   data,
   initialState: {
@@ -77,7 +77,7 @@ const tableQuery = createQuery({
   //...
 })
 
-const table = createSolidTable({
+const table = createTable({
   columns,
   get data() {
     return tableQuery.data()
@@ -109,7 +109,7 @@ A couple of more tricks may be needed to make this work. If you use the `onState
 
 ```jsx
 //create a table instance with default state values
-const table = createSolidTable({
+const table = createTable({
   columns,
   get data() {
     return data()
@@ -147,7 +147,7 @@ Specifying an `on[State]Change` callback tells the table instance that this will
 ```jsx
 const [sorting, setSorting] = createSignal([])
 //...
-const table = createSolidTable({
+const table = createTable({
   columns,
   data,
   //...
@@ -170,7 +170,7 @@ What implications does this have? It means that if you want to add in some extra
 const [sorting, setSorting] = createSignal([])
 const [pagination, setPagination] = createSignal({ pageIndex: 0, pageSize: 10 })
 
-const table = createSolidTable({
+const table = createTable({
   get columns() {
     return columns()
   },
@@ -210,7 +210,7 @@ const table = createSolidTable({
 All complex states in TanStack Table have their own TypeScript types that you can import and use. This can be handy for ensuring that you are using the correct data structures and properties for the state values that you are controlling.
 
 ```tsx
-import { createSolidTable, type SortingState } from '@tanstack/solid-table'
+import { createTable, type SortingState } from '@tanstack/solid-table'
 //...
 const [sorting, setSorting] = createSignal<SortingState[]>([
   {