Angular stable release - WIP

.github/labeler.yml

@@ -1,7 +1,7 @@
 'package: angular-query-devtools-experimental':
-  - 'packages/angular-query-devtools-experimental/**/*'
-'package: angular-query-experimental':
-  - 'packages/angular-query-experimental/**/*'
+  - 'packages/angular-query-devtools/**/*'
+'package: angular-query':
+  - 'packages/angular-query/**/*'
 'package: eslint-plugin-query':
   - 'packages/eslint-plugin-query/**/*'
 'package: query-async-storage-persister':

.gitignore

@@ -6,6 +6,10 @@ node_modules
 package-lock.json
 yarn.lock
 
+*.d.ts
+*.map
+*.tsbuildinfo
+
 # builds
 build
 coverage

.prettierignore

@@ -8,6 +8,3 @@
 pnpm-lock.yaml
 packages/**/tsup.config.bundled*.mjs
 **/tsconfig.vitest-temp.json
-
-# API Extractor report
-packages/angular-query-experimental/etc/*.md

codecov.yml

@@ -19,14 +19,14 @@ comment:
 
 component_management:
   individual_components:
-    - component_id: angular-query-devtools-experimental
-      name: '@tanstack/angular-query-devtools-experimental'
+    - component_id: angular-query-devtools
+      name: '@tanstack/angular-query-devtools'
       paths:
-        - packages/angular-query-devtools-experimental/**
-    - component_id: angular-query-experimental
-      name: '@tanstack/angular-query-experimental'
+        - packages/angular-query-devtools/**
+    - component_id: angular-query
+      name: '@tanstack/angular-query'
       paths:
-        - packages/angular-query-experimental/**
+        - packages/angular-query/**
     - component_id: eslint-plugin-query
       name: '@tanstack/eslint-plugin-query'
       paths:

docs/framework/angular/devtools.md

@@ -14,7 +14,7 @@ import {
   QueryClient,
   provideTanStackQuery,
   withDevtools,
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 
 export const appConfig: ApplicationConfig = {
   providers: [provideTanStackQuery(new QueryClient(), withDevtools())],

docs/framework/angular/guides/background-fetching-indicators.md

@@ -36,7 +36,7 @@ class TodosComponent {
 [//]: # 'Example2'
 
 ```angular-ts
-import { injectIsFetching } from '@tanstack/angular-query-experimental'
+import { injectIsFetching } from '@tanstack/angular-query'
 
 @Component({
   selector: 'global-loading-indicator',

docs/framework/angular/guides/infinite-queries.md

@@ -10,7 +10,7 @@ replace:
 
 ```angular-ts
 import { Component, computed, inject } from '@angular/core'
-import { injectInfiniteQuery } from '@tanstack/angular-query-experimental'
+import { injectInfiniteQuery } from '@tanstack/angular-query'
 import { lastValueFrom } from 'rxjs'
 import { ProjectsService } from './projects-service'
 

docs/framework/angular/guides/invalidations-from-mutations.md

@@ -17,10 +17,7 @@ mutation = injectMutation(() => ({
 [//]: # 'Example2'
 
 ```ts
-import {
-  injectMutation,
-  QueryClient,
-} from '@tanstack/angular-query-experimental'
+import { injectMutation, QueryClient } from '@tanstack/angular-query'
 
 export class TodosComponent {
   queryClient = inject(QueryClient)

docs/framework/angular/guides/queries.md

@@ -17,7 +17,7 @@ replace:
 [//]: # 'Example'
 
 ```ts
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 
 export class TodosComponent {
   info = injectQuery(() => ({ queryKey: ['todos'], queryFn: fetchTodoList }))

docs/framework/angular/guides/query-cancellation.md

@@ -15,7 +15,7 @@ However, if you consume the `AbortSignal`, the Promise will be cancelled (e.g. a
 
 ```ts
 import { HttpClient } from '@angular/common/http'
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 
 postQuery = injectQuery(() => ({
   enabled: this.postId() > 0,

docs/framework/angular/guides/query-invalidation.md

@@ -8,7 +8,7 @@ replace: { 'useQuery': 'injectQuery', 'hooks': 'functions' }
 [//]: # 'Example2'
 
 ```ts
-import { injectQuery, QueryClient } from '@tanstack/angular-query-experimental'
+import { injectQuery, QueryClient } from '@tanstack/angular-query'
 
 class QueryInvalidationExample {
   queryClient = inject(QueryClient)

docs/framework/angular/guides/query-options.md

@@ -7,7 +7,7 @@ ref: docs/framework/react/guides/query-options.md
 [//]: # 'Example1'
 
 ```ts
-import { queryOptions } from '@tanstack/angular-query-experimental'
+import { queryOptions } from '@tanstack/angular-query'
 
 @Injectable({
   providedIn: 'root',

docs/framework/angular/guides/query-retries.md

@@ -15,7 +15,7 @@ replace:
 [//]: # 'Example'
 
 ```ts
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 
 // Make a specific query retry a certain number of times
 const result = injectQuery(() => ({
@@ -34,7 +34,7 @@ import {
   QueryCache,
   QueryClient,
   QueryClientProvider,
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 
 const queryClient = new QueryClient({
   defaultOptions: {

docs/framework/angular/guides/window-focus-refetching.md

@@ -2,7 +2,7 @@
 id: window-focus-refetching
 title: Window Focus Refetching
 ref: docs/framework/react/guides/window-focus-refetching.md
-replace: { '@tanstack/react-query': '@tanstack/angular-query-experimental' }
+replace: { '@tanstack/react-query': '@tanstack/angular-query' }
 ---
 
 [//]: # 'Example'

docs/framework/angular/installation.md

@@ -3,32 +3,30 @@ id: installation
 title: Installation
 ---
 
-> IMPORTANT: This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Upgrade carefully. If you use this in production while in experimental stage, please lock your version to a patch-level version to avoid unexpected breaking changes.
-
 ### NPM
 
 _Angular Query is compatible with Angular v16 and higher_
 
 ```bash
-npm i @tanstack/angular-query-experimental
+npm i @tanstack/angular-query
 ```
 
 or
 
 ```bash
-pnpm add @tanstack/angular-query-experimental
+pnpm add @tanstack/angular-query
 ```
 
 or
 
 ```bash
-yarn add @tanstack/angular-query-experimental
+yarn add @tanstack/angular-query
 ```
 
 or
 
 ```bash
-bun add @tanstack/angular-query-experimental
+bun add @tanstack/angular-query
 ```
 
 > Wanna give it a spin before you download? Try out the [simple](../examples/simple) or [basic](../examples/basic) examples!

docs/framework/angular/overview.md

@@ -3,13 +3,7 @@ id: overview
 title: Overview
 ---
 
-> IMPORTANT: This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Upgrade carefully. If you use this in production while in experimental stage, please lock your version to a patch-level version to avoid unexpected breaking changes.
-
-The `@tanstack/angular-query-experimental` package offers a 1st-class API for using TanStack Query via Angular.
-
-## Feedback welcome!
-
-We are in the process of getting to a stable API for TanStack Query on Angular. If you have any feedback, please contact us at the [TanStack Discord](https://tlinz.com/discord) server or [visit this discussion](https://github.com/TanStack/query/discussions/6293) on Github.
+The `@tanstack/angular-query` package offers a 1st-class API for using TanStack Query via Angular.
 
 ## Supported Angular Versions
 
@@ -64,7 +58,7 @@ In the example below, you can see TanStack Query in its most basic and simple fo
 import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
 import { HttpClient } from '@angular/common/http'
 import { CommonModule } from '@angular/common'
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 import { lastValueFrom } from 'rxjs'
 
 @Component({

docs/framework/angular/quick-start.md

@@ -13,10 +13,7 @@ If you're looking for a fully functioning example, please have a look at our [ba
 
 ```ts
 import { provideHttpClient } from '@angular/common/http'
-import {
-  provideTanStackQuery,
-  QueryClient,
-} from '@tanstack/angular-query-experimental'
+import { provideTanStackQuery, QueryClient } from '@tanstack/angular-query'
 
 bootstrapApplication(AppComponent, {
   providers: [provideHttpClient(), provideTanStackQuery(new QueryClient())],
@@ -27,10 +24,7 @@ or in a NgModule-based app
 
 ```ts
 import { provideHttpClient } from '@angular/common/http'
-import {
-  provideTanStackQuery,
-  QueryClient,
-} from '@tanstack/angular-query-experimental'
+import { provideTanStackQuery, QueryClient } from '@tanstack/angular-query'
 
 @NgModule({
   declarations: [AppComponent],
@@ -52,7 +46,7 @@ import {
   injectMutation,
   injectQuery,
   QueryClient
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 
 @Component({
   standalone: true,

docs/framework/angular/reference/functions/provideangularquery.md

@@ -16,10 +16,7 @@ Allows to configure a `QueryClient`.
 **Example - standalone**
 
 ```ts
-import {
-  provideAngularQuery,
-  QueryClient,
-} from '@tanstack/angular-query-experimental'
+import { provideAngularQuery, QueryClient } from '@tanstack/angular-query'
 
 bootstrapApplication(AppComponent, {
   providers: [provideAngularQuery(new QueryClient())],
@@ -29,10 +26,7 @@ bootstrapApplication(AppComponent, {
 **Example - NgModule-based**
 
 ```ts
-import {
-  provideAngularQuery,
-  QueryClient,
-} from '@tanstack/angular-query-experimental'
+import { provideAngularQuery, QueryClient } from '@tanstack/angular-query'
 
 @NgModule({
   declarations: [AppComponent],

docs/framework/angular/typescript.md

@@ -6,7 +6,7 @@ replace:
   {
     'useQuery': 'injectQuery',
     'useMutation': 'injectMutation',
-    'react-query': 'angular-query-experimental',
+    'react-query': 'angular-query',
     'public API of React Query': 'public API of TanStack Query and - after the experimental phase, the angular-query package',
     'still follows': 'still follow',
     'React Query': 'TanStack Query',
@@ -149,9 +149,9 @@ computed(() => {
 [//]: # 'RegisterErrorType'
 
 ```ts
-import '@tanstack/angular-query-experimental'
+import '@tanstack/angular-query'
 
-declare module '@tanstack/angular-query-experimental' {
+declare module '@tanstack/angular-query' {
   interface Register {
     defaultError: AxiosError
   }

examples/angular/auto-refetching/package.json

@@ -14,7 +14,7 @@
     "@angular/core": "^19.1.0-next.0",
     "@angular/platform-browser": "^19.1.0-next.0",
     "@angular/platform-browser-dynamic": "^19.1.0-next.0",
-    "@tanstack/angular-query-experimental": "^5.67.2",
+    "@tanstack/angular-query": "^5.67.2",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.15.0"

examples/angular/auto-refetching/src/app/app.config.ts

@@ -7,7 +7,7 @@ import {
   QueryClient,
   provideTanStackQuery,
   withDevtools,
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 import { mockInterceptor } from './interceptor/mock-api.interceptor'
 import type { ApplicationConfig } from '@angular/core'
 

examples/angular/auto-refetching/src/app/components/auto-refetching.component.ts

@@ -4,10 +4,7 @@ import {
   inject,
   signal,
 } from '@angular/core'
-import {
-  injectMutation,
-  injectQuery,
-} from '@tanstack/angular-query-experimental'
+import { injectMutation, injectQuery } from '@tanstack/angular-query'
 import { NgStyle } from '@angular/common'
 import { TasksService } from '../services/tasks.service'
 

examples/angular/auto-refetching/src/app/services/tasks.service.ts

@@ -4,7 +4,7 @@ import {
   QueryClient,
   mutationOptions,
   queryOptions,
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 
 import { lastValueFrom } from 'rxjs'
 

examples/angular/basic/package.json

@@ -14,7 +14,7 @@
     "@angular/core": "^19.1.0-next.0",
     "@angular/platform-browser": "^19.1.0-next.0",
     "@angular/platform-browser-dynamic": "^19.1.0-next.0",
-    "@tanstack/angular-query-experimental": "^5.67.2",
+    "@tanstack/angular-query": "^5.67.2",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.15.0"

examples/angular/basic/src/app/app.config.ts

@@ -3,7 +3,7 @@ import {
   QueryClient,
   provideTanStackQuery,
   withDevtools,
-} from '@tanstack/angular-query-experimental'
+} from '@tanstack/angular-query'
 import type { ApplicationConfig } from '@angular/core'
 
 export const appConfig: ApplicationConfig = {

examples/angular/basic/src/app/components/post.component.ts

@@ -5,7 +5,7 @@ import {
   input,
   output,
 } from '@angular/core'
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 import { fromEvent, lastValueFrom, takeUntil } from 'rxjs'
 import { PostsService } from '../services/posts-service'
 

examples/angular/basic/src/app/components/posts.component.ts

@@ -4,7 +4,7 @@ import {
   inject,
   output,
 } from '@angular/core'
-import { QueryClient, injectQuery } from '@tanstack/angular-query-experimental'
+import { QueryClient, injectQuery } from '@tanstack/angular-query'
 import { lastValueFrom } from 'rxjs'
 import { PostsService } from '../services/posts-service'
 

examples/angular/devtools-panel/package.json

@@ -16,7 +16,7 @@
     "@angular/platform-browser-dynamic": "^19.1.0-next.0",
     "@angular/router": "^19.1.0-next.0",
     "@tanstack/angular-query-devtools-experimental": "^5.67.2",
-    "@tanstack/angular-query-experimental": "^5.67.2",
+    "@tanstack/angular-query": "^5.67.2",
     "rxjs": "^7.8.1",
     "tslib": "^2.6.3",
     "zone.js": "^0.15.0"

examples/angular/devtools-panel/src/app/app.config.ts

@@ -1,10 +1,7 @@
 import { provideHttpClient, withFetch } from '@angular/common/http'
 
 import { provideRouter } from '@angular/router'
-import {
-  QueryClient,
-  provideTanStackQuery,
-} from '@tanstack/angular-query-experimental'
+import { QueryClient, provideTanStackQuery } from '@tanstack/angular-query'
 import { routes } from './app.routes'
 import type { ApplicationConfig } from '@angular/core'
 

examples/angular/devtools-panel/src/app/components/example-query.component.ts

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, inject } from '@angular/core'
-import { injectQuery } from '@tanstack/angular-query-experimental'
+import { injectQuery } from '@tanstack/angular-query'
 import { HttpClient } from '@angular/common/http'
 import { lastValueFrom } from 'rxjs'