Merge branch 'main' into fix-replaceEqualDeep-array-undefined

Author: TkDodo

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

@@ -85,7 +85,7 @@ export class TodosComponent {
 
   todosQuery = injectQuery(() => ({
     queryKey: ['todos', this.filter()],
-    queryFn: this.filter ? () => fetchTodos(this.filter()) : skipToken,
+    queryFn: this.filter() ? () => fetchTodos(this.filter()) : skipToken,
   }))
 }
 ```

docs/framework/angular/installation.md

@@ -3,7 +3,7 @@ id: installation
 title: Installation
 ---
 
-> VERY IMPORTANT: This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
+> 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
 

docs/framework/angular/overview.md

@@ -3,7 +3,7 @@ id: overview
 title: Overview
 ---
 
-> VERY IMPORTANT: This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
+> 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.
 

docs/framework/angular/quick-start.md

@@ -3,7 +3,7 @@ id: quick-start
 title: Quick Start
 ---
 
-> VERY IMPORTANT: This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
+> 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.
 
 [//]: # 'Example'
 
@@ -23,6 +23,24 @@ bootstrapApplication(AppComponent, {
 })
 ```
 
+or in a NgModule-based app
+
+```ts
+import { provideHttpClient } from '@angular/common/http'
+import {
+  provideAngularQuery,
+  QueryClient,
+} from '@tanstack/angular-query-experimental'
+
+@NgModule({
+  declarations: [AppComponent],
+  imports: [BrowserModule],
+  providers: [provideAngularQuery(new QueryClient())],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}
+```
+
 ### Component with query and mutation
 
 ```ts

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

@@ -1,9 +1,9 @@
 import { provideHttpClient, withFetch } from '@angular/common/http'
-import { ApplicationConfig } from '@angular/core'
 import {
   QueryClient,
   provideAngularQuery,
 } from '@tanstack/angular-query-experimental'
+import type { ApplicationConfig } from '@angular/core'
 
 export const appConfig: ApplicationConfig = {
   providers: [

packages/angular-query-devtools-experimental/src/angular-query-devtools.component.ts

@@ -39,7 +39,9 @@ export class AngularQueryDevtools
   /*
    * It is intentional that there are no default values on inputs.
    * Core devtools will set defaults when values are undefined.
-   * */
+   *
+   * Signal inputs are not used to remain compatible with previous Angular versions.
+   */
 
   /**
    * Add this attribute if you want the dev tools to default to being open

packages/angular-query-experimental/README.md

@@ -7,13 +7,13 @@
 
 # Angular Query
 
-> This library is currently in an experimental stage. This means that breaking changes will happen in minor AND patch releases. Use at your own risk. If you choose to rely on this in production in an experimental stage, please lock your version to a patch-level version to avoid unexpected breakages.
+> 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.
 
 Functions for fetching, caching and updating asynchronous data in Angular
 
 # Documentation
 
-Visit https://tanstack.com/query/latest/docs/angular/overview
+Visit https://tanstack.com/query/latest/docs/framework/angular/overview
 
 ## Quick Features
 
@@ -54,6 +54,23 @@ Visit https://tanstack.com/query/latest/docs/angular/overview
    })
    ```
 
+   or in a NgModule-based app
+
+   ```ts
+   import { provideHttpClient } from '@angular/common/http'
+   import {
+   provideAngularQuery,
+   QueryClient,
+   } from '@tanstack/angular-query-experimental'
+
+   @NgModule({
+     declarations: [AppComponent],
+     imports: [BrowserModule],
+     providers: [provideAngularQuery(new QueryClient())],
+     bootstrap: [AppComponent],
+   })
+   ```
+
 3. Inject query
 
    ```ts

packages/angular-query-experimental/src/__tests__/inject-mutation-state.test.ts

@@ -3,7 +3,6 @@ import { QueryClient } from '@tanstack/query-core'
 import { TestBed } from '@angular/core/testing'
 import { describe, expect, test, vi } from 'vitest'
 import { By } from '@angular/platform-browser'
-import { JsonPipe } from '@angular/common'
 import { injectMutation } from '../inject-mutation'
 import { injectMutationState } from '../inject-mutation-state'
 import { provideAngularQuery } from '../providers'
@@ -139,7 +138,6 @@ describe('injectMutationState', () => {
           }
         `,
         standalone: true,
-        imports: [JsonPipe],
       })
       class FakeComponent {
         name = input.required<string>()

packages/angular-query-experimental/src/create-base-query.ts

@@ -31,7 +31,7 @@ export function createBaseQuery<
   TQueryData,
   TQueryKey extends QueryKey,
 >(
-  options: (
+  optionsFn: (
     client: QueryClient,
   ) => CreateBaseQueryOptions<
     TQueryFnData,
@@ -57,7 +57,7 @@ export function createBaseQuery<
        */
       const defaultedOptionsSignal = computed(() => {
         const defaultedOptions = queryClient.defaultQueryOptions(
-          options(queryClient),
+          optionsFn(queryClient),
         )
         defaultedOptions._optimisticResults = 'optimistic'
         return defaultedOptions

packages/angular-query-experimental/src/index.ts

@@ -20,9 +20,5 @@ export * from './inject-mutation'
 export * from './inject-mutation-state'
 export * from './inject-queries'
 export * from './inject-query'
-export {
-  injectQueryClient,
-  provideQueryClient,
-  QUERY_CLIENT,
-} from './inject-query-client'
+export { injectQueryClient, provideQueryClient } from './inject-query-client'
 export { provideAngularQuery } from './providers'