From cd7026923d5c23cdde555d72cc5871c8cd884dd5 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Wed, 11 Jun 2025 17:48:28 +0200 Subject: [PATCH 01/24] feat(angular-query-devtools): move devtools to conditional sub-paths, improves tree shaking and dependency injection --- .github/labeler.yml | 2 - codecov.yml | 4 - docs/framework/angular/devtools.md | 73 ++++-- .../reference/functions/withdevtools.md | 4 +- docs/framework/angular/reference/index.md | 2 +- .../type-aliases/developertoolsfeature.md | 8 +- .../reference/type-aliases/queryfeatures.md | 2 +- .../auto-refetching/src/app/app.config.ts | 2 +- .../basic-persister/src/app/app.config.ts | 2 +- examples/angular/basic/src/app/app.config.ts | 2 +- examples/angular/devtools-panel/package.json | 1 - .../basic-devtools-panel-example.component.ts | 2 +- ...y-load-devtools-panel-example.component.ts | 4 +- .../src/app/app.config.ts | 2 +- .../optimistic-updates/src/app/app.config.ts | 2 +- .../angular/pagination/src/app/app.config.ts | 2 +- .../src/app/app.config.ts | 2 +- examples/angular/router/src/app/app.config.ts | 2 +- examples/angular/rxjs/src/app/app.config.ts | 2 +- examples/angular/simple/src/app/app.config.ts | 2 +- package.json | 1 - .../.attw.json | 7 - .../eslint.config.js | 17 -- .../package.json | 68 ------ .../root.eslint.config.js | 1 - .../src/index.ts | 1 - .../src/test-setup.ts | 10 - .../tsconfig.json | 17 -- .../tsconfig.prod.json | 8 - .../tsup.config.js | 13 -- .../vite.config.ts | 28 --- .../eslint.config.js | 8 +- .../angular-query-experimental/package.json | 26 ++- .../__tests__/inject-devtools-panel.test.ts | 8 +- .../src/__tests__/providers.test.ts | 150 +++++++++--- .../src/devtools-panel/index.ts | 8 + .../devtools-panel}/inject-devtools-panel.ts | 65 +----- .../src/devtools-panel/stub.ts | 7 + .../src/devtools-panel/types.ts | 57 +++++ .../src/devtools/index.ts | 8 + .../src/devtools/stub.ts | 7 + .../src/devtools/types.ts | 103 ++++++++ .../src/devtools/with-devtools.ts | 173 ++++++++++++++ .../angular-query-experimental/src/index.ts | 7 +- .../src/infinite-query-options.ts | 4 - .../src/inject-infinite-query.ts | 4 - .../src/inject-is-mutating.ts | 1 - .../src/inject-is-restoring.ts | 28 +-- .../src/inject-mutation-state.ts | 4 - .../src/inject-mutation.ts | 1 - .../src/inject-queries.ts | 4 - .../src/inject-query-client.ts | 1 - .../src/inject-query.ts | 4 - .../src/mutation-options.ts | 4 - .../src/providers.ts | 219 +----------------- .../src/query-options.ts | 4 - .../angular-query-experimental/src/types.ts | 48 ---- .../src/util/is-dev-mode/is-dev-mode.ts | 3 - .../angular-query-experimental/tsup.config.js | 17 +- .../angular-query-persist-client/package.json | 4 +- pnpm-lock.yaml | 73 +----- scripts/publish.js | 4 - 62 files changed, 639 insertions(+), 708 deletions(-) delete mode 100644 packages/angular-query-devtools-experimental/.attw.json delete mode 100644 packages/angular-query-devtools-experimental/eslint.config.js delete mode 100644 packages/angular-query-devtools-experimental/package.json delete mode 120000 packages/angular-query-devtools-experimental/root.eslint.config.js delete mode 100644 packages/angular-query-devtools-experimental/src/index.ts delete mode 100644 packages/angular-query-devtools-experimental/src/test-setup.ts delete mode 100644 packages/angular-query-devtools-experimental/tsconfig.json delete mode 100644 packages/angular-query-devtools-experimental/tsconfig.prod.json delete mode 100644 packages/angular-query-devtools-experimental/tsup.config.js delete mode 100644 packages/angular-query-devtools-experimental/vite.config.ts rename packages/{angular-query-devtools-experimental => angular-query-experimental}/src/__tests__/inject-devtools-panel.test.ts (96%) create mode 100644 packages/angular-query-experimental/src/devtools-panel/index.ts rename packages/{angular-query-devtools-experimental/src => angular-query-experimental/src/devtools-panel}/inject-devtools-panel.ts (60%) create mode 100644 packages/angular-query-experimental/src/devtools-panel/stub.ts create mode 100644 packages/angular-query-experimental/src/devtools-panel/types.ts create mode 100644 packages/angular-query-experimental/src/devtools/index.ts create mode 100644 packages/angular-query-experimental/src/devtools/stub.ts create mode 100644 packages/angular-query-experimental/src/devtools/types.ts create mode 100644 packages/angular-query-experimental/src/devtools/with-devtools.ts delete mode 100644 packages/angular-query-experimental/src/util/is-dev-mode/is-dev-mode.ts diff --git a/.github/labeler.yml b/.github/labeler.yml index 922ccaf298..001cb10a68 100644 --- a/.github/labeler.yml +++ b/.github/labeler.yml @@ -1,5 +1,3 @@ -'package: angular-query-devtools-experimental': - - 'packages/angular-query-devtools-experimental/**/*' 'package: angular-query-experimental': - 'packages/angular-query-experimental/**/*' 'package: eslint-plugin-query': diff --git a/codecov.yml b/codecov.yml index ef21589e00..da56c6458c 100644 --- a/codecov.yml +++ b/codecov.yml @@ -19,10 +19,6 @@ comment: component_management: individual_components: - - component_id: angular-query-devtools-experimental - name: '@tanstack/angular-query-devtools-experimental' - paths: - - packages/angular-query-devtools-experimental/** - component_id: angular-query-experimental name: '@tanstack/angular-query-experimental' paths: diff --git a/docs/framework/angular/devtools.md b/docs/framework/angular/devtools.md index 1787544ca1..eef761f6fe 100644 --- a/docs/framework/angular/devtools.md +++ b/docs/framework/angular/devtools.md @@ -7,27 +7,38 @@ title: Devtools The devtools help you debug and inspect your queries and mutations. You can enable the devtools by adding `withDevtools` to `provideTanStackQuery`. -By default, the devtools are enabled when Angular [`isDevMode`](https://angular.dev/api/core/isDevMode) returns true. So you don't need to worry about excluding them during a production build. The core tools are lazily loaded and excluded from bundled code. In most cases, all you'll need to do is add `withDevtools()` to `provideTanStackQuery` without any additional configuration. +By default, Angular Query Devtools are only included in development mode bundles, so you don't need to worry about excluding them during a production build. ```ts import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' + export const appConfig: ApplicationConfig = { providers: [provideTanStackQuery(new QueryClient(), withDevtools())], } ``` -## Configuring if devtools are loaded +## Devtools in production + +Devtools are automatically excluded from production builds. However, it might be desirable to lazy load the devtools in production. + +To use `withDevtools` in production builds, import using the `production` sub-path. The function exported from the production subpath is identical to the main one, but won't be excluded from production builds. + +```ts +import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' +``` -If you need more control over when devtools are loaded, you can use the `loadDevtools` option. This is particularly useful if you want to load devtools based on environment configurations. For instance, you might have a test environment running in production mode but still require devtools to be available. +To control when devtools are loaded, you can use the `loadDevtools` option. This is particularly useful if you want to load devtools based on environment configurations or user interaction. For instance, you might have a test environment running in production mode but still require devtools to be available. -When not setting the option or setting it to 'auto', the devtools will be loaded when Angular is in development mode. +When not setting the option or setting it to 'auto', the devtools will be loaded automatically when Angular runs in development mode. ```ts +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' + provideTanStackQuery(new QueryClient(), withDevtools()) // which is equivalent to @@ -39,7 +50,12 @@ provideTanStackQuery( When setting the option to true, the devtools will be loaded in both development and production mode. +This is particularly useful if you want to load devtools based on environment configurations. E.g. you could set this to true either when `isDevMode()` is true or when the application is running on your production build staging environment. + ```ts +// Make sure to use the production sub-path to load devtools in production builds +import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' + provideTanStackQuery( new QueryClient(), withDevtools(() => ({ loadDevtools: true })), @@ -55,44 +71,67 @@ provideTanStackQuery( ) ``` -The `withDevtools` options are returned from a callback function to support reactivity through signals. In the following example -a signal is created from a RxJS observable that listens for a keyboard shortcut. When the event is triggered, the devtools are lazily loaded. -Using this technique allows you to support on-demand loading of the devtools even in production mode, without including the full tools in the bundled code. +## Derive options through reactivity + +Options are passed to `withDevtools` from a callback function to support reactivity through signals. In the following example +a signal is created from a RxJS observable that emits on a keyboard shortcut. When the derived signal is set to true, the devtools are lazily loaded. + +> If you don't need devtools in production builds, don't use the `production` sub-path. Even though most of the devtools are lazy loaded on-demand, code is needed for on-demand loading and option handling. When importing devtools from `@tanstack/angular-query-experimental/devtools`, all devtools code will be excluded from your build and no lazy chunks will be created, minimizing deployment size. + +The example below always loads devtools in development mode and loads on-demand in production mode when a keyboard shortcut is pressed. ```ts +import { Injectable, isDevMode } from '@angular/core' +import { fromEvent, map, scan } from 'rxjs' +import { toSignal } from '@angular/core/rxjs-interop' + @Injectable({ providedIn: 'root' }) -class DevtoolsOptionsManager { +export class DevtoolsOptionsManager { loadDevtools = toSignal( fromEvent(document, 'keydown').pipe( map( (event): boolean => event.metaKey && event.ctrlKey && event.shiftKey && event.key === 'D', ), - scan((acc, curr) => acc || curr, false), + scan((acc, curr) => acc || curr, isDevMode()), ), { - initialValue: false, + initialValue: isDevMode(), }, ) } +``` + +If you want to use an injectable such as a service in the callback you can use `deps`. The injected value will be passed as parameter to the callback function. + +This is similar to `deps` in Angular's [`useFactory`](https://angular.dev/guide/di/dependency-injection-providers#factory-providers-usefactory) provider. + +```ts +// ... +import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' export const appConfig: ApplicationConfig = { providers: [ provideHttpClient(), provideTanStackQuery( new QueryClient(), - withDevtools(() => ({ - initialIsOpen: true, - loadDevtools: inject(DevtoolsOptionsManager).loadDevtools(), - })), + withDevtools( + (devToolsOptionsManager: DevtoolsOptionsManager) => ({ + loadDevtools: devToolsOptionsManager.loadDevtools(), + }), + { + // `deps` is used to inject and pass `DevtoolsOptionsManager` to the `withDevtools` callback. + deps: [DevtoolsOptionsManager], + }, + ), ), ], } ``` -### Options +### Options returned from the callback -Of these options `client`, `position`, `errorTypes`, `buttonPosition`, and `initialIsOpen` support reactivity through signals. +Of these options `loadDevtools`, `client`, `position`, `errorTypes`, `buttonPosition`, and `initialIsOpen` support reactivity through signals. - `loadDevtools?: 'auto' | boolean` - Defaults to `auto`: lazily loads devtools when in development mode. Skips loading in production mode. diff --git a/docs/framework/angular/reference/functions/withdevtools.md b/docs/framework/angular/reference/functions/withdevtools.md index 6dfdac2d77..b5e4e14d00 100644 --- a/docs/framework/angular/reference/functions/withdevtools.md +++ b/docs/framework/angular/reference/functions/withdevtools.md @@ -6,7 +6,7 @@ title: withDevtools # Function: withDevtools() ```ts -function withDevtools(withDevtoolsFn?): DeveloperToolsFeature +function withDevtools(withDevtoolsFn?): DevtoolsFeature ``` Enables developer tools. @@ -35,7 +35,7 @@ A function that returns `DevtoolsOptions`. ## Returns -[`DeveloperToolsFeature`](../../type-aliases/developertoolsfeature.md) +[`DevtoolsFeature`](../../type-aliases/developertoolsfeature.md) A set of providers for use with `provideTanStackQuery`. diff --git a/docs/framework/angular/reference/index.md b/docs/framework/angular/reference/index.md index c8b1690d3d..8dd0081367 100644 --- a/docs/framework/angular/reference/index.md +++ b/docs/framework/angular/reference/index.md @@ -35,7 +35,7 @@ title: '@tanstack/angular-query-experimental' - [DefinedCreateQueryResult](../type-aliases/definedcreatequeryresult.md) - [DefinedInitialDataInfiniteOptions](../type-aliases/definedinitialdatainfiniteoptions.md) - [DefinedInitialDataOptions](../type-aliases/definedinitialdataoptions.md) -- [DeveloperToolsFeature](../type-aliases/developertoolsfeature.md) +- [DevtoolsFeature](../type-aliases/developertoolsfeature.md) - [PersistQueryClientFeature](../type-aliases/persistqueryclientfeature.md) - [QueriesOptions](../type-aliases/queriesoptions.md) - [QueriesResults](../type-aliases/queriesresults.md) diff --git a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md index ad4c952ff7..72c1227bd8 100644 --- a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md +++ b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md @@ -1,12 +1,12 @@ --- -id: DeveloperToolsFeature -title: DeveloperToolsFeature +id: DevtoolsFeature +title: DevtoolsFeature --- -# Type Alias: DeveloperToolsFeature +# Type Alias: DevtoolsFeature ```ts -type DeveloperToolsFeature = QueryFeature<'DeveloperTools'> +type DevtoolsFeature = QueryFeature<'DeveloperTools'> ``` A type alias that represents a feature which enables developer tools. diff --git a/docs/framework/angular/reference/type-aliases/queryfeatures.md b/docs/framework/angular/reference/type-aliases/queryfeatures.md index cb6a2eb82d..8278758878 100644 --- a/docs/framework/angular/reference/type-aliases/queryfeatures.md +++ b/docs/framework/angular/reference/type-aliases/queryfeatures.md @@ -6,7 +6,7 @@ title: QueryFeatures # Type Alias: QueryFeatures ```ts -type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature +type QueryFeatures = DevtoolsFeature | PersistQueryClientFeature ``` A type alias that represents all Query features available for use with `provideTanStackQuery`. diff --git a/examples/angular/auto-refetching/src/app/app.config.ts b/examples/angular/auto-refetching/src/app/app.config.ts index 65a84a0c25..b9b2b6c36f 100644 --- a/examples/angular/auto-refetching/src/app/app.config.ts +++ b/examples/angular/auto-refetching/src/app/app.config.ts @@ -6,8 +6,8 @@ import { import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { mockInterceptor } from './interceptor/mock-api.interceptor' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/basic-persister/src/app/app.config.ts b/examples/angular/basic-persister/src/app/app.config.ts index d449e21582..b563947609 100644 --- a/examples/angular/basic-persister/src/app/app.config.ts +++ b/examples/angular/basic-persister/src/app/app.config.ts @@ -2,10 +2,10 @@ import { provideHttpClient, withFetch } from '@angular/common/http' import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' import { withPersistQueryClient } from '@tanstack/angular-query-persist-client' import { createSyncStoragePersister } from '@tanstack/query-sync-storage-persister' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import type { ApplicationConfig } from '@angular/core' const localStoragePersister = createSyncStoragePersister({ diff --git a/examples/angular/basic/src/app/app.config.ts b/examples/angular/basic/src/app/app.config.ts index 700f4dc0a5..77281147d1 100644 --- a/examples/angular/basic/src/app/app.config.ts +++ b/examples/angular/basic/src/app/app.config.ts @@ -2,8 +2,8 @@ import { provideHttpClient, withFetch } from '@angular/common/http' import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import type { ApplicationConfig } from '@angular/core' export const appConfig: ApplicationConfig = { diff --git a/examples/angular/devtools-panel/package.json b/examples/angular/devtools-panel/package.json index 0f24fb6bfd..d28cd87fd8 100644 --- a/examples/angular/devtools-panel/package.json +++ b/examples/angular/devtools-panel/package.json @@ -15,7 +15,6 @@ "@angular/platform-browser": "^20.0.0", "@angular/platform-browser-dynamic": "^20.0.0", "@angular/router": "^20.0.0", - "@tanstack/angular-query-devtools-experimental": "^5.80.6", "@tanstack/angular-query-experimental": "^5.80.6", "rxjs": "^7.8.2", "tslib": "^2.8.1", diff --git a/examples/angular/devtools-panel/src/app/components/basic-devtools-panel-example.component.ts b/examples/angular/devtools-panel/src/app/components/basic-devtools-panel-example.component.ts index 7892d377c9..f0a56611eb 100644 --- a/examples/angular/devtools-panel/src/app/components/basic-devtools-panel-example.component.ts +++ b/examples/angular/devtools-panel/src/app/components/basic-devtools-panel-example.component.ts @@ -4,7 +4,7 @@ import { signal, viewChild, } from '@angular/core' -import { injectDevtoolsPanel } from '@tanstack/angular-query-devtools-experimental' +import { injectDevtoolsPanel } from '@tanstack/angular-query-experimental/devtools-panel' import { ExampleQueryComponent } from './example-query.component' import type { ElementRef } from '@angular/core' diff --git a/examples/angular/devtools-panel/src/app/components/lazy-load-devtools-panel-example.component.ts b/examples/angular/devtools-panel/src/app/components/lazy-load-devtools-panel-example.component.ts index cd2366a4ce..9bb23b1192 100644 --- a/examples/angular/devtools-panel/src/app/components/lazy-load-devtools-panel-example.component.ts +++ b/examples/angular/devtools-panel/src/app/components/lazy-load-devtools-panel-example.component.ts @@ -10,7 +10,7 @@ import { } from '@angular/core' import { ExampleQueryComponent } from './example-query.component' import type { ElementRef } from '@angular/core' -import type { DevtoolsPanelRef } from '@tanstack/angular-query-devtools-experimental' +import type { DevtoolsPanelRef } from '@tanstack/angular-query-experimental/devtools-panel' @Component({ selector: 'lazy-load-devtools-panel-example', @@ -49,7 +49,7 @@ export default class LazyLoadDevtoolsPanelExampleComponent { if (this.devtools()) return if (this.isOpen()) { this.devtools.set( - import('@tanstack/angular-query-devtools-experimental').then( + import('@tanstack/angular-query-experimental/devtools-panel').then( ({ injectDevtoolsPanel }) => injectDevtoolsPanel(this.devToolsOptions, { injector: this.injector, diff --git a/examples/angular/infinite-query-with-max-pages/src/app/app.config.ts b/examples/angular/infinite-query-with-max-pages/src/app/app.config.ts index bd9b7a03d1..06854c4a7d 100644 --- a/examples/angular/infinite-query-with-max-pages/src/app/app.config.ts +++ b/examples/angular/infinite-query-with-max-pages/src/app/app.config.ts @@ -6,8 +6,8 @@ import { import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { projectsMockInterceptor } from './api/projects-mock.interceptor' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/optimistic-updates/src/app/app.config.ts b/examples/angular/optimistic-updates/src/app/app.config.ts index 65a84a0c25..b9b2b6c36f 100644 --- a/examples/angular/optimistic-updates/src/app/app.config.ts +++ b/examples/angular/optimistic-updates/src/app/app.config.ts @@ -6,8 +6,8 @@ import { import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { mockInterceptor } from './interceptor/mock-api.interceptor' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/pagination/src/app/app.config.ts b/examples/angular/pagination/src/app/app.config.ts index 919a81f92c..dc3189ba84 100644 --- a/examples/angular/pagination/src/app/app.config.ts +++ b/examples/angular/pagination/src/app/app.config.ts @@ -6,8 +6,8 @@ import { import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { projectsMockInterceptor } from './api/projects-mock.interceptor' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/query-options-from-a-service/src/app/app.config.ts b/examples/angular/query-options-from-a-service/src/app/app.config.ts index 7dd1d37236..dd6675f997 100644 --- a/examples/angular/query-options-from-a-service/src/app/app.config.ts +++ b/examples/angular/query-options-from-a-service/src/app/app.config.ts @@ -3,9 +3,9 @@ import { provideRouter, withComponentInputBinding } from '@angular/router' import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { routes } from './app.routes' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/router/src/app/app.config.ts b/examples/angular/router/src/app/app.config.ts index de3234392a..3fbec800b1 100644 --- a/examples/angular/router/src/app/app.config.ts +++ b/examples/angular/router/src/app/app.config.ts @@ -3,9 +3,9 @@ import { provideRouter, withComponentInputBinding } from '@angular/router' import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { routes } from './app.routes' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/rxjs/src/app/app.config.ts b/examples/angular/rxjs/src/app/app.config.ts index 36f8212a03..27eb15a53b 100644 --- a/examples/angular/rxjs/src/app/app.config.ts +++ b/examples/angular/rxjs/src/app/app.config.ts @@ -6,8 +6,8 @@ import { import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import { autocompleteMockInterceptor } from './api/autocomplete-mock.interceptor' import type { ApplicationConfig } from '@angular/core' diff --git a/examples/angular/simple/src/app/app.config.ts b/examples/angular/simple/src/app/app.config.ts index c4b9ca045e..9c7eda2597 100644 --- a/examples/angular/simple/src/app/app.config.ts +++ b/examples/angular/simple/src/app/app.config.ts @@ -2,8 +2,8 @@ import { provideHttpClient, withFetch } from '@angular/common/http' import { QueryClient, provideTanStackQuery, - withDevtools, } from '@tanstack/angular-query-experimental' +import { withDevtools } from '@tanstack/angular-query-experimental/devtools' import type { ApplicationConfig } from '@angular/core' export const appConfig: ApplicationConfig = { diff --git a/package.json b/package.json index c8896ea94c..1a705bbad6 100644 --- a/package.json +++ b/package.json @@ -79,7 +79,6 @@ }, "pnpm": { "overrides": { - "@tanstack/angular-query-devtools-experimental": "workspace:*", "@tanstack/angular-query-experimental": "workspace:*", "@tanstack/eslint-plugin-query": "workspace:*", "@tanstack/query-async-storage-persister": "workspace:*", diff --git a/packages/angular-query-devtools-experimental/.attw.json b/packages/angular-query-devtools-experimental/.attw.json deleted file mode 100644 index 864f618c22..0000000000 --- a/packages/angular-query-devtools-experimental/.attw.json +++ /dev/null @@ -1,7 +0,0 @@ -{ - "ignoreRules": [ - "cjs-resolves-to-esm", - "internal-resolution-error", - "no-resolution" - ] -} diff --git a/packages/angular-query-devtools-experimental/eslint.config.js b/packages/angular-query-devtools-experimental/eslint.config.js deleted file mode 100644 index 131737bfa0..0000000000 --- a/packages/angular-query-devtools-experimental/eslint.config.js +++ /dev/null @@ -1,17 +0,0 @@ -// @ts-check - -import pluginJsdoc from 'eslint-plugin-jsdoc' -import rootConfig from './root.eslint.config.js' - -export default [ - ...rootConfig, - pluginJsdoc.configs['flat/recommended-typescript'], - { - rules: { - 'jsdoc/require-hyphen-before-param-description': 1, - 'jsdoc/sort-tags': 1, - 'jsdoc/require-throws': 1, - 'jsdoc/check-tag-names': ['warn'], - }, - }, -] diff --git a/packages/angular-query-devtools-experimental/package.json b/packages/angular-query-devtools-experimental/package.json deleted file mode 100644 index bb9d01e5a0..0000000000 --- a/packages/angular-query-devtools-experimental/package.json +++ /dev/null @@ -1,68 +0,0 @@ -{ - "name": "@tanstack/angular-query-devtools-experimental", - "version": "5.80.6", - "description": "Developer tools to interact with and visualize the TanStack/angular-query cache", - "author": "Arnoud de Vries", - "license": "MIT", - "repository": { - "type": "git", - "url": "git+https://github.com/TanStack/query.git", - "directory": "packages/angular-query-devtools-experimental" - }, - "homepage": "https://tanstack.com/query", - "funding": { - "type": "github", - "url": "https://github.com/sponsors/tannerlinsley" - }, - "scripts": { - "clean": "premove ./build ./coverage ./dist-ts", - "compile": "tsc --build", - "test:eslint": "eslint ./src", - "test:types": "npm-run-all --serial test:types:*", - "test:types:ts51": "node ../../node_modules/typescript51/lib/tsc.js --build", - "test:types:ts52": "node ../../node_modules/typescript52/lib/tsc.js --build", - "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js --build", - "test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js --build", - "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js --build", - "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js --build", - "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js --build", - "test:types:tscurrent": "tsc --build", - "test:build": "publint --strict && attw --pack", - "build": "pnpm build:tsup", - "build:tsup": "tsup --tsconfig tsconfig.prod.json" - }, - "type": "module", - "types": "build/index.d.ts", - "module": "build/index.mjs", - "exports": { - ".": { - "@tanstack/custom-condition": "./src/index.ts", - "types": "./build/index.d.ts", - "default": "./build/index.mjs" - }, - "./package.json": { - "default": "./package.json" - } - }, - "sideEffects": false, - "files": [ - "build", - "src", - "!src/__tests__" - ], - "dependencies": { - "@tanstack/query-devtools": "workspace:*" - }, - "devDependencies": { - "@angular/core": "^20.0.0", - "@angular/platform-browser-dynamic": "^20.0.0", - "@tanstack/angular-query-experimental": "workspace:*", - "eslint-plugin-jsdoc": "^50.5.0", - "npm-run-all2": "^5.0.0" - }, - "peerDependencies": { - "@angular/common": ">=16.0.0", - "@angular/core": ">=16.0.0", - "@tanstack/angular-query-experimental": "workspace:^" - } -} diff --git a/packages/angular-query-devtools-experimental/root.eslint.config.js b/packages/angular-query-devtools-experimental/root.eslint.config.js deleted file mode 120000 index 35dedbe5a4..0000000000 --- a/packages/angular-query-devtools-experimental/root.eslint.config.js +++ /dev/null @@ -1 +0,0 @@ -../../eslint.config.js \ No newline at end of file diff --git a/packages/angular-query-devtools-experimental/src/index.ts b/packages/angular-query-devtools-experimental/src/index.ts deleted file mode 100644 index 82c19d6916..0000000000 --- a/packages/angular-query-devtools-experimental/src/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './inject-devtools-panel' diff --git a/packages/angular-query-devtools-experimental/src/test-setup.ts b/packages/angular-query-devtools-experimental/src/test-setup.ts deleted file mode 100644 index 30c962a8e6..0000000000 --- a/packages/angular-query-devtools-experimental/src/test-setup.ts +++ /dev/null @@ -1,10 +0,0 @@ -import { - BrowserDynamicTestingModule, - platformBrowserDynamicTesting, -} from '@angular/platform-browser-dynamic/testing' -import { getTestBed } from '@angular/core/testing' - -getTestBed().initTestEnvironment( - BrowserDynamicTestingModule, - platformBrowserDynamicTesting(), -) diff --git a/packages/angular-query-devtools-experimental/tsconfig.json b/packages/angular-query-devtools-experimental/tsconfig.json deleted file mode 100644 index 6e4428ba78..0000000000 --- a/packages/angular-query-devtools-experimental/tsconfig.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "extends": "../../tsconfig.json", - "compilerOptions": { - "outDir": "./dist-ts", - "rootDir": ".", - "noImplicitOverride": true, - "noPropertyAccessFromIndexSignature": true, - "noFallthroughCasesInSwitch": true, - "useDefineForClassFields": false, - "target": "ES2022" - }, - "include": ["src", "*.config.js", "*.config.ts", "package.json"], - "references": [ - { "path": "../query-devtools" }, - { "path": "../angular-query-experimental" } - ] -} diff --git a/packages/angular-query-devtools-experimental/tsconfig.prod.json b/packages/angular-query-devtools-experimental/tsconfig.prod.json deleted file mode 100644 index 0f4c92da06..0000000000 --- a/packages/angular-query-devtools-experimental/tsconfig.prod.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "extends": "./tsconfig.json", - "compilerOptions": { - "incremental": false, - "composite": false, - "rootDir": "../../" - } -} diff --git a/packages/angular-query-devtools-experimental/tsup.config.js b/packages/angular-query-devtools-experimental/tsup.config.js deleted file mode 100644 index a1e9d23c1c..0000000000 --- a/packages/angular-query-devtools-experimental/tsup.config.js +++ /dev/null @@ -1,13 +0,0 @@ -import { defineConfig } from 'tsup' - -export default defineConfig({ - entry: ['src/index.ts'], - sourcemap: true, - clean: true, - format: ['esm'], - dts: true, - outDir: 'build', - outExtension({ format }) { - return format === 'esm' ? { js: '.mjs' } : { js: '.js' } - }, -}) diff --git a/packages/angular-query-devtools-experimental/vite.config.ts b/packages/angular-query-devtools-experimental/vite.config.ts deleted file mode 100644 index 25fdba1056..0000000000 --- a/packages/angular-query-devtools-experimental/vite.config.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { defineConfig } from 'vitest/config' - -import packageJson from './package.json' - -export default defineConfig({ - // fix from https://github.com/vitest-dev/vitest/issues/6992#issuecomment-2509408660 - resolve: { - conditions: ['@tanstack/custom-condition'], - }, - environments: { - ssr: { - resolve: { - conditions: ['@tanstack/custom-condition'], - }, - }, - }, - test: { - name: packageJson.name, - dir: './src', - watch: false, - environment: 'jsdom', - setupFiles: ['src/test-setup.ts'], - coverage: { enabled: true, provider: 'istanbul', include: ['src/**/*'] }, - typecheck: { enabled: true }, - globals: true, - restoreMocks: true, - }, -}) diff --git a/packages/angular-query-experimental/eslint.config.js b/packages/angular-query-experimental/eslint.config.js index a86775ff27..08acd3ac43 100644 --- a/packages/angular-query-experimental/eslint.config.js +++ b/packages/angular-query-experimental/eslint.config.js @@ -20,13 +20,7 @@ export default [ 'jsdoc/require-hyphen-before-param-description': 1, 'jsdoc/sort-tags': 1, 'jsdoc/require-throws': 1, - 'jsdoc/check-tag-names': [ - 'warn', - { - // Not compatible with Api Extractor @public - typed: false, - }, - ], + 'jsdoc/check-tag-names': ['warn'], }, }, { diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 3d8c81165d..8e12cf4931 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -37,8 +37,8 @@ "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js --build", "test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js --build", "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js --build", - "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js --build", - "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js --build", + "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js --build", + "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js --build", "test:types:tscurrent": "tsc --build", "test:lib": "vitest", "test:lib:dev": "pnpm run test:lib --watch", @@ -47,14 +47,30 @@ "build:tsup": "tsup --tsconfig tsconfig.prod.json" }, "type": "module", - "types": "build/index.d.ts", - "module": "build/index.mjs", "exports": { ".": { - "@tanstack/custom-condition": "./src/index.ts", "types": "./build/index.d.ts", + "@tanstack/custom-condition": "./src/index.ts", "default": "./build/index.mjs" }, + "./devtools": { + "types": "./build/devtools/index.d.ts", + "development": "./build/devtools/index.mjs", + "default": "./build/devtools/stub.mjs" + }, + "./devtools/production": { + "types": "./build/devtools/index.d.ts", + "default": "./build/devtools/index.mjs" + }, + "./devtools-panel": { + "types": "./build/devtools-panel/index.d.ts", + "development": "./build/devtools-panel/index.mjs", + "default": "./build/devtools-panel/stub.mjs" + }, + "./devtools-panel/production": { + "types": "./build/devtools-panel/index.d.ts", + "default": "./build/devtools-panel/index.mjs" + }, "./package.json": { "default": "./package.json" } diff --git a/packages/angular-query-devtools-experimental/src/__tests__/inject-devtools-panel.test.ts b/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts similarity index 96% rename from packages/angular-query-devtools-experimental/src/__tests__/inject-devtools-panel.test.ts rename to packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts index 367bb708f5..b18d2a3b34 100644 --- a/packages/angular-query-devtools-experimental/src/__tests__/inject-devtools-panel.test.ts +++ b/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts @@ -4,12 +4,10 @@ import { signal, } from '@angular/core' import { TestBed } from '@angular/core/testing' -import { - QueryClient, - provideTanStackQuery, -} from '@tanstack/angular-query-experimental' import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest' -import { injectDevtoolsPanel } from '../inject-devtools-panel' +import { QueryClient } from '@tanstack/query-core' +import { provideTanStackQuery } from '../providers' +import { injectDevtoolsPanel } from '../devtools-panel' const mockDevtoolsPanelInstance = { mount: vi.fn(), diff --git a/packages/angular-query-experimental/src/__tests__/providers.test.ts b/packages/angular-query-experimental/src/__tests__/providers.test.ts index 929cf1ea34..e5f1177fa0 100644 --- a/packages/angular-query-experimental/src/__tests__/providers.test.ts +++ b/packages/angular-query-experimental/src/__tests__/providers.test.ts @@ -3,22 +3,21 @@ import { QueryClient } from '@tanstack/query-core' import { TestBed } from '@angular/core/testing' import { ENVIRONMENT_INITIALIZER, + EnvironmentInjector, + PLATFORM_ID, + createEnvironmentInjector, + isDevMode, provideZonelessChangeDetection, signal, } from '@angular/core' -import { isDevMode } from '../util/is-dev-mode/is-dev-mode' -import { provideTanStackQuery, withDevtools } from '../providers' -import type { DevtoolsOptions } from '../providers' -import type { Mock } from 'vitest' +import { provideTanStackQuery } from '../providers' +import { withDevtools } from '../devtools' import type { DevtoolsButtonPosition, DevtoolsErrorType, DevtoolsPosition, } from '@tanstack/query-devtools' - -vi.mock('../util/is-dev-mode/is-dev-mode', () => ({ - isDevMode: vi.fn(), -})) +import type { DevtoolsOptions } from '../devtools' const mockDevtoolsInstance = { mount: vi.fn(), @@ -36,12 +35,20 @@ vi.mock('@tanstack/query-devtools', () => ({ TanstackQueryDevtools: mockTanstackQueryDevtools, })) -describe('withDevtools feature', () => { - let isDevModeMock: Mock +vi.mock('@angular/core', async () => { + const actual = await vi.importActual('@angular/core') + return { + ...actual, + isDevMode: vi.fn(), + } +}) + +const mockIsDevMode = vi.mocked(isDevMode) +describe('withDevtools feature', () => { beforeEach(() => { + vi.clearAllMocks() vi.useFakeTimers() - isDevModeMock = isDevMode as Mock }) afterEach(() => { @@ -50,61 +57,59 @@ describe('withDevtools feature', () => { test.each([ { - description: - 'should provide developer tools in development mode by default', - isDevModeValue: true, + description: 'should load developer tools in development mode', + isDevMode: true, expectedCalled: true, }, { - description: - 'should not provide developer tools in production mode by default', - isDevModeValue: false, + description: 'should not load developer tools in production mode', + isDevMode: false, expectedCalled: false, }, { - description: `should provide developer tools in development mode when 'loadDeveloperTools' is set to 'auto'`, - isDevModeValue: true, + description: `should load developer tools in development mode when 'loadDevtools' is set to 'auto'`, + isDevMode: true, loadDevtools: 'auto', expectedCalled: true, }, { - description: `should not provide developer tools in production mode when 'loadDeveloperTools' is set to 'auto'`, - isDevModeValue: false, + description: `should not load developer tools in production mode when 'loadDevtools' is set to 'auto'`, + isDevMode: false, loadDevtools: 'auto', expectedCalled: false, }, { description: - "should provide developer tools in development mode when 'loadDevtools' is set to true", - isDevModeValue: true, + "should load developer tools in development mode when 'loadDevtools' is set to true", + isDevMode: true, loadDevtools: true, expectedCalled: true, }, { description: - "should provide developer tools in production mode when 'loadDevtools' is set to true", - isDevModeValue: false, + "should load developer tools in production mode when 'loadDevtools' is set to true", + isDevMode: false, loadDevtools: true, expectedCalled: true, }, { description: - "should not provide developer tools in development mode when 'loadDevtools' is set to false", - isDevModeValue: true, + "should not load developer tools in development mode when 'loadDevtools' is set to false", + isDevMode: true, loadDevtools: false, expectedCalled: false, }, { description: - "should not provide developer tools in production mode when 'loadDevtools' is set to false", - isDevModeValue: false, + "should not load developer tools in production mode when 'loadDevtools' is set to false", + isDevMode: false, loadDevtools: false, expectedCalled: false, }, ])( '$description', - async ({ isDevModeValue, loadDevtools, expectedCalled }) => { - isDevModeMock.mockReturnValue(isDevModeValue) + async ({ isDevMode: isDevModeValue, loadDevtools, expectedCalled }) => { + mockIsDevMode.mockReturnValue(isDevModeValue) const providers = [ provideZonelessChangeDetection(), @@ -127,6 +132,10 @@ describe('withDevtools feature', () => { TestBed.inject(ENVIRONMENT_INITIALIZER) await vi.runAllTimersAsync() + TestBed.tick() + await vi.dynamicImportSettled() + TestBed.tick() + await vi.dynamicImportSettled() if (expectedCalled) { expect(mockTanstackQueryDevtools).toHaveBeenCalled() @@ -136,6 +145,85 @@ describe('withDevtools feature', () => { }, ) + it('should not continue loading devtools after injector is destroyed', async () => { + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(() => ({ + loadDevtools: true, + })), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + // Destroys injector + TestBed.resetTestingModule() + await vi.runAllTimersAsync() + + expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() + }) + + it('should not create devtools again when already provided', async () => { + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(() => ({ + loadDevtools: true, + })), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.runAllTimersAsync() + + expect(mockTanstackQueryDevtools).toHaveBeenCalledTimes(1) + + const injector = TestBed.inject(EnvironmentInjector) + + createEnvironmentInjector( + [ + withDevtools(() => ({ + loadDevtools: true, + })).ɵproviders, + ], + injector, + ) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.runAllTimersAsync() + + expect(mockTanstackQueryDevtools).toHaveBeenCalledTimes(1) + }) + + it('should not load devtools if platform is not browser', async () => { + TestBed.configureTestingModule({ + providers: [ + { + provide: PLATFORM_ID, + useValue: 'server', + }, + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(() => ({ + loadDevtools: true, + })), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.runAllTimersAsync() + + expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() + }) + it('should update error types', async () => { const errorTypes = signal([] as Array) diff --git a/packages/angular-query-experimental/src/devtools-panel/index.ts b/packages/angular-query-experimental/src/devtools-panel/index.ts new file mode 100644 index 0000000000..2742a15469 --- /dev/null +++ b/packages/angular-query-experimental/src/devtools-panel/index.ts @@ -0,0 +1,8 @@ +export type { + InjectDevtoolsPanel, + DevtoolsPanelOptions, + InjectDevtoolsPanelOptions, + DevtoolsPanelRef, +} from './types' + +export { injectDevtoolsPanel } from './inject-devtools-panel' diff --git a/packages/angular-query-devtools-experimental/src/inject-devtools-panel.ts b/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts similarity index 60% rename from packages/angular-query-devtools-experimental/src/inject-devtools-panel.ts rename to packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts index 0fdff618fc..71ac82e5ad 100644 --- a/packages/angular-query-devtools-experimental/src/inject-devtools-panel.ts +++ b/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts @@ -10,22 +10,13 @@ import { untracked, } from '@angular/core' import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools' -import { - QueryClient, - onlineManager, -} from '@tanstack/angular-query-experimental' +import { QueryClient, onlineManager } from '@tanstack/query-core' import { isPlatformBrowser } from '@angular/common' -import type { ElementRef } from '@angular/core' -import type { DevtoolsErrorType } from '@tanstack/query-devtools' - -export interface InjectDevtoolsPanelOptions { - /** - * The `Injector` in which to create the devtools panel. - * - * If this is not provided, the current injection context will be used instead (via `inject`). - */ - injector?: Injector -} +import type { + DevtoolsPanelOptions, + InjectDevtoolsPanel, + InjectDevtoolsPanelOptions, +} from './types' /** * Inject a TanStack Query devtools panel and render it in the DOM. @@ -39,10 +30,10 @@ export interface InjectDevtoolsPanelOptions { * @returns DevtoolsPanelRef * @see https://tanstack.com/query/v5/docs/framework/angular/devtools */ -export function injectDevtoolsPanel( +export const injectDevtoolsPanel: InjectDevtoolsPanel = ( injectDevtoolsPanelFn: () => DevtoolsPanelOptions, options?: InjectDevtoolsPanelOptions, -): DevtoolsPanelRef { +) => { !options?.injector && assertInInjectionContext(injectDevtoolsPanel) const currentInjector = options?.injector ?? inject(Injector) @@ -108,43 +99,3 @@ export function injectDevtoolsPanel( } }) } - -/** - * A devtools panel, which can be manually destroyed. - */ -export interface DevtoolsPanelRef { - /** - * Destroy the panel, removing it from the DOM and stops listening to signal changes. - */ - destroy: () => void -} - -export interface DevtoolsPanelOptions { - /** - * Custom instance of QueryClient - */ - client?: QueryClient - /** - * Use this so you can define custom errors that can be shown in the devtools. - */ - errorTypes?: Array - /** - * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. - */ - styleNonce?: string - /** - * Use this so you can attach the devtool's styles to specific element in the DOM. - */ - shadowDOMTarget?: ShadowRoot - - /** - * Callback function that is called when the devtools panel is closed - */ - onClose?: () => unknown - - /** - * Element where to render the devtools panel. When set to undefined or null, the devtools panel will not be created, or destroyed if existing. - * If changed from undefined to a ElementRef, the devtools panel will be created. - */ - hostElement?: ElementRef -} diff --git a/packages/angular-query-experimental/src/devtools-panel/stub.ts b/packages/angular-query-experimental/src/devtools-panel/stub.ts new file mode 100644 index 0000000000..63e836eb5c --- /dev/null +++ b/packages/angular-query-experimental/src/devtools-panel/stub.ts @@ -0,0 +1,7 @@ +import { noop } from '@tanstack/query-core' +import type { InjectDevtoolsPanel } from './types' + +// Stub which replaces `injectDevtoolsPanel` in production builds +export const injectDevtoolsPanel: InjectDevtoolsPanel = () => ({ + destroy: noop, +}) diff --git a/packages/angular-query-experimental/src/devtools-panel/types.ts b/packages/angular-query-experimental/src/devtools-panel/types.ts new file mode 100644 index 0000000000..b87373ad95 --- /dev/null +++ b/packages/angular-query-experimental/src/devtools-panel/types.ts @@ -0,0 +1,57 @@ +import type { DevtoolsErrorType } from '@tanstack/query-devtools' +import type { ElementRef, Injector } from '@angular/core' +import type { QueryClient } from '@tanstack/query-core' + +export interface InjectDevtoolsPanelOptions { + /** + * The `Injector` in which to create the devtools panel. + * + * If this is not provided, the current injection context will be used instead (via `inject`). + */ + injector?: Injector +} + +/** + * A devtools panel, which can be manually destroyed. + */ +export interface DevtoolsPanelRef { + /** + * Destroy the panel, removing it from the DOM and stops listening to signal changes. + */ + destroy: () => void +} + +export interface DevtoolsPanelOptions { + /** + * Custom instance of QueryClient + */ + client?: QueryClient + /** + * Use this so you can define custom errors that can be shown in the devtools. + */ + errorTypes?: Array + /** + * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. + */ + styleNonce?: string + /** + * Use this so you can attach the devtool's styles to specific element in the DOM. + */ + shadowDOMTarget?: ShadowRoot + + /** + * Callback function that is called when the devtools panel is closed + */ + onClose?: () => unknown + + /** + * Element where to render the devtools panel. When set to undefined or null, the devtools panel will not be created, or destroyed if existing. + * If changed from undefined to a ElementRef, the devtools panel will be created. + */ + hostElement?: ElementRef +} + +export type InjectDevtoolsPanel = ( + injectDevtoolsPanelFn: () => DevtoolsPanelOptions, + options?: InjectDevtoolsPanelOptions, +) => DevtoolsPanelRef diff --git a/packages/angular-query-experimental/src/devtools/index.ts b/packages/angular-query-experimental/src/devtools/index.ts new file mode 100644 index 0000000000..d4f7e9238f --- /dev/null +++ b/packages/angular-query-experimental/src/devtools/index.ts @@ -0,0 +1,8 @@ +export type { + DevtoolsOptions, + WithDevtools, + WithDevtoolsFn, + WithDevtoolsOptions, +} from './types' + +export { withDevtools } from './with-devtools' diff --git a/packages/angular-query-experimental/src/devtools/stub.ts b/packages/angular-query-experimental/src/devtools/stub.ts new file mode 100644 index 0000000000..d8090a4b28 --- /dev/null +++ b/packages/angular-query-experimental/src/devtools/stub.ts @@ -0,0 +1,7 @@ +import type { WithDevtools } from './types' + +// Stub which replaces `withDevtools` in production builds +export const withDevtools: WithDevtools = () => ({ + ɵkind: 'Devtools', + ɵproviders: [], +}) diff --git a/packages/angular-query-experimental/src/devtools/types.ts b/packages/angular-query-experimental/src/devtools/types.ts new file mode 100644 index 0000000000..79ea7d77c6 --- /dev/null +++ b/packages/angular-query-experimental/src/devtools/types.ts @@ -0,0 +1,103 @@ +import type { QueryClient } from '@tanstack/query-core' +import type { + DevtoolsButtonPosition, + DevtoolsErrorType, + DevtoolsPosition, +} from '@tanstack/query-devtools' +import type { DevtoolsFeature } from '../providers' + +/** + * Options for configuring withDevtools. + */ +export interface WithDevtoolsOptions { + /** + * An array of dependencies to be injected and passed to the `withDevtoolsFn` function. + * + * **Example** + * ```ts + * export const appConfig: ApplicationConfig = { + * providers: [ + * provideTanStackQuery( + * new QueryClient(), + * withDevtools( + * (devToolsOptionsManager: DevtoolsOptionsManager) => ({ + * loadDevtools: devToolsOptionsManager.loadDevtools(), + * }), + * { + * deps: [DevtoolsOptionsManager], + * }, + * ), + * ), + * ], + * } + * ``` + */ + deps?: Array +} + +/** + * Options for configuring the TanStack Query devtools. + */ +export interface DevtoolsOptions { + /** + * Set this true if you want the devtools to default to being open + */ + initialIsOpen?: boolean + /** + * The position of the TanStack logo to open and close the devtools panel. + * `top-left` | `top-right` | `bottom-left` | `bottom-right` | `relative` + * Defaults to `bottom-right`. + */ + buttonPosition?: DevtoolsButtonPosition + /** + * The position of the TanStack Query devtools panel. + * `top` | `bottom` | `left` | `right` + * Defaults to `bottom`. + */ + position?: DevtoolsPosition + /** + * Custom instance of QueryClient + */ + client?: QueryClient + /** + * Use this so you can define custom errors that can be shown in the devtools. + */ + errorTypes?: Array + /** + * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. + */ + styleNonce?: string + /** + * Use this so you can attach the devtool's styles to a specific element in the DOM. + */ + shadowDOMTarget?: ShadowRoot + + /** + * Whether the developer tools should load. + * - `auto`- (Default) Lazily loads devtools when in development mode. Skips loading in production mode. + * - `true`- Always load the devtools, regardless of the environment. + * - `false`- Never load the devtools, regardless of the environment. + * + * You can use `true` and `false` to override loading developer tools from an environment file. + * For example, a test environment might run in production mode but you may want to load developer tools. + * + * Additionally, you can use a signal in the callback to dynamically load the devtools based on a condition. For example, + * a signal created from a RxJS observable that listens for a keyboard shortcut. + * + * **Example** + * ```ts + * withDevtools(() => ({ + * initialIsOpen: true, + * loadDevtools: inject(ExampleService).loadDevtools() + * })) + * ``` + */ + loadDevtools?: 'auto' | boolean +} + +export type WithDevtoolsFn = (...deps: Array) => DevtoolsOptions + +export type WithDevtools = ( + withDevtoolsFn?: WithDevtoolsFn, + options?: WithDevtoolsOptions, +) => DevtoolsFeature diff --git a/packages/angular-query-experimental/src/devtools/with-devtools.ts b/packages/angular-query-experimental/src/devtools/with-devtools.ts new file mode 100644 index 0000000000..1212804442 --- /dev/null +++ b/packages/angular-query-experimental/src/devtools/with-devtools.ts @@ -0,0 +1,173 @@ +import { isPlatformBrowser } from '@angular/common' +import { + DestroyRef, + ENVIRONMENT_INITIALIZER, + InjectionToken, + Injector, + PLATFORM_ID, + computed, + effect, + inject, + isDevMode, +} from '@angular/core' +import { QueryClient, noop, onlineManager } from '@tanstack/query-core' +import { queryFeature } from '../providers' +import type { Signal } from '@angular/core' +import type { + DevtoolsOptions, + WithDevtools, + WithDevtoolsFn, + WithDevtoolsOptions, +} from './types' +import type { TanstackQueryDevtools } from '@tanstack/query-devtools' + +/** + * Internal token used to prevent double providing of devtools in child injectors + */ +const DEVTOOLS_PROVIDED = new InjectionToken('', { + factory: () => ({ + isProvided: false, + }), +}) + +/** + * Internal token for providing devtools options + */ +const DEVTOOLS_OPTIONS_SIGNAL = new InjectionToken>('') + +/** + * Enables developer tools in Angular development builds. + * + * **Example** + * + * ```ts + * export const appConfig: ApplicationConfig = { + * providers: [ + * provideTanStackQuery(new QueryClient(), withDevtools()) + * ] + * } + * ``` + * The devtools will be rendered in ``. + * + * If you need more control over when devtools are loaded, you can use the `loadDevtools` option. + * + * If you need more control over where devtools are rendered, consider `injectDevtoolsPanel`. This allows rendering devtools inside your own devtools for example. + * @param withDevtoolsFn - A function that returns `DevtoolsOptions`. + * @param options - Additional options for configuring `withDevtools`. + * @returns A set of providers for use with `provideTanStackQuery`. + * @see {@link provideTanStackQuery} + * @see {@link DevtoolsOptions} + */ +export const withDevtools: WithDevtools = ( + withDevtoolsFn?: WithDevtoolsFn, + options: WithDevtoolsOptions = {}, +) => + queryFeature('Devtools', [ + { + provide: DEVTOOLS_OPTIONS_SIGNAL, + useFactory: (...deps: Array) => + computed(() => withDevtoolsFn?.(...deps) ?? {}), + deps: options.deps || [], + }, + { + // Do not use provideEnvironmentInitializer while Angular < v19 is supported + provide: ENVIRONMENT_INITIALIZER, + multi: true, + useFactory: () => { + const devtoolsProvided = inject(DEVTOOLS_PROVIDED) + if ( + !isPlatformBrowser(inject(PLATFORM_ID)) || + devtoolsProvided.isProvided + ) + return noop + + devtoolsProvided.isProvided = true + let injectorIsDestroyed = false + inject(DestroyRef).onDestroy(() => (injectorIsDestroyed = true)) + + return () => { + const injectedClient = inject(QueryClient, { + optional: true, + }) + const destroyRef = inject(DestroyRef) + const devtoolsOptions = inject(DEVTOOLS_OPTIONS_SIGNAL) + const injector = inject(Injector) + + let devtools: TanstackQueryDevtools | null = null + let el: HTMLElement | null = null + + const shouldLoadToolsSignal = computed(() => { + const { loadDevtools } = devtoolsOptions() + return typeof loadDevtools === 'boolean' + ? loadDevtools + : isDevMode() + }) + + const getResolvedQueryClient = () => { + const client = devtoolsOptions().client ?? injectedClient + if (!client) { + throw new Error('No QueryClient found') + } + return client + } + + const destroyDevtools = () => { + devtools?.unmount() + el?.remove() + devtools = null + } + + effect( + () => { + const shouldLoadTools = shouldLoadToolsSignal() + const { + client, + position, + errorTypes, + buttonPosition, + initialIsOpen, + } = devtoolsOptions() + + if (!shouldLoadTools) { + // Destroy or do nothing + devtools && destroyDevtools() + return + } + + if (devtools) { + // Update existing devtools config + client && devtools.setClient(client) + position && devtools.setPosition(position) + errorTypes && devtools.setErrorTypes(errorTypes) + buttonPosition && devtools.setButtonPosition(buttonPosition) + typeof initialIsOpen === 'boolean' && + devtools.setInitialIsOpen(initialIsOpen) + return + } + + // Create devtools + import('@tanstack/query-devtools').then((queryDevtools) => { + // As this code runs async, injector can be destroyed in the meantime + if (injectorIsDestroyed) return + + devtools = new queryDevtools.TanstackQueryDevtools({ + ...devtoolsOptions(), + client: getResolvedQueryClient(), + queryFlavor: 'Angular Query', + version: '5', + onlineManager, + }) + + el = document.body.appendChild(document.createElement('div')) + el.classList.add('tsqd-parent-container') + devtools.mount(el) + + destroyRef.onDestroy(destroyDevtools) + }) + }, + { injector }, + ) + } + }, + }, + ]) diff --git a/packages/angular-query-experimental/src/index.ts b/packages/angular-query-experimental/src/index.ts index 360be005e6..edc45c9b6a 100644 --- a/packages/angular-query-experimental/src/index.ts +++ b/packages/angular-query-experimental/src/index.ts @@ -48,17 +48,14 @@ export { injectQuery } from './inject-query' export { injectQueryClient } from './inject-query-client' export type { - DeveloperToolsFeature, - DevtoolsOptions, + DevtoolsFeature, PersistQueryClientFeature, QueryFeature, - QueryFeatureKind, QueryFeatures, } from './providers' export { + provideAngularQuery, provideQueryClient, provideTanStackQuery, queryFeature, - queryFeatures, - withDevtools, } from './providers' diff --git a/packages/angular-query-experimental/src/infinite-query-options.ts b/packages/angular-query-experimental/src/infinite-query-options.ts index fdc7396c99..fc18c0e94d 100644 --- a/packages/angular-query-experimental/src/infinite-query-options.ts +++ b/packages/angular-query-experimental/src/infinite-query-options.ts @@ -84,7 +84,6 @@ export type DefinedInitialDataInfiniteOptions< * The `queryKey` will be tagged with the type from `queryFn`. * @param options - The infinite query options to tag with the type from `queryFn`. * @returns The tagged infinite query options. - * @public */ export function infiniteQueryOptions< TQueryFnData, @@ -116,7 +115,6 @@ export function infiniteQueryOptions< * The `queryKey` will be tagged with the type from `queryFn`. * @param options - The infinite query options to tag with the type from `queryFn`. * @returns The tagged infinite query options. - * @public */ export function infiniteQueryOptions< TQueryFnData, @@ -148,7 +146,6 @@ export function infiniteQueryOptions< * The `queryKey` will be tagged with the type from `queryFn`. * @param options - The infinite query options to tag with the type from `queryFn`. * @returns The tagged infinite query options. - * @public */ export function infiniteQueryOptions< TQueryFnData, @@ -180,7 +177,6 @@ export function infiniteQueryOptions< * The `queryKey` will be tagged with the type from `queryFn`. * @param options - The infinite query options to tag with the type from `queryFn`. * @returns The tagged infinite query options. - * @public */ export function infiniteQueryOptions(options: unknown) { return options diff --git a/packages/angular-query-experimental/src/inject-infinite-query.ts b/packages/angular-query-experimental/src/inject-infinite-query.ts index 6df26a0bb5..ee6de03240 100644 --- a/packages/angular-query-experimental/src/inject-infinite-query.ts +++ b/packages/angular-query-experimental/src/inject-infinite-query.ts @@ -37,7 +37,6 @@ export interface InjectInfiniteQueryOptions { * @param injectInfiniteQueryFn - A function that returns infinite query options. * @param options - Additional configuration. * @returns The infinite query result. - * @public */ export function injectInfiniteQuery< TQueryFnData, @@ -62,7 +61,6 @@ export function injectInfiniteQuery< * @param injectInfiniteQueryFn - A function that returns infinite query options. * @param options - Additional configuration. * @returns The infinite query result. - * @public */ export function injectInfiniteQuery< TQueryFnData, @@ -87,7 +85,6 @@ export function injectInfiniteQuery< * @param injectInfiniteQueryFn - A function that returns infinite query options. * @param options - Additional configuration. * @returns The infinite query result. - * @public */ export function injectInfiniteQuery< TQueryFnData, @@ -112,7 +109,6 @@ export function injectInfiniteQuery< * @param injectInfiniteQueryFn - A function that returns infinite query options. * @param options - Additional configuration. * @returns The infinite query result. - * @public */ export function injectInfiniteQuery( injectInfiniteQueryFn: () => CreateInfiniteQueryOptions, diff --git a/packages/angular-query-experimental/src/inject-is-mutating.ts b/packages/angular-query-experimental/src/inject-is-mutating.ts index 21de13b90e..8f11291b0e 100644 --- a/packages/angular-query-experimental/src/inject-is-mutating.ts +++ b/packages/angular-query-experimental/src/inject-is-mutating.ts @@ -26,7 +26,6 @@ export interface InjectIsMutatingOptions { * @param filters - The filters to apply to the query. * @param options - Additional configuration * @returns signal with number of fetching mutations. - * @public */ export function injectIsMutating( filters?: MutationFilters, diff --git a/packages/angular-query-experimental/src/inject-is-restoring.ts b/packages/angular-query-experimental/src/inject-is-restoring.ts index 92e50d4342..2c7fb3ae68 100644 --- a/packages/angular-query-experimental/src/inject-is-restoring.ts +++ b/packages/angular-query-experimental/src/inject-is-restoring.ts @@ -7,30 +7,27 @@ import { } from '@angular/core' import type { Provider, Signal } from '@angular/core' -const IS_RESTORING = new InjectionToken( - typeof ngDevMode === 'undefined' || ngDevMode - ? 'TANSTACK_QUERY_IS_RESTORING' - : '', - { - // Default value when not provided - factory: () => signal(false).asReadonly(), - }, -) - /** - * The `Injector` in which to create the isRestoring signal. - * - * If this is not provided, the current injection context will be used instead (via `inject`). + * Internal token used to track isRestoring state, accessible in public API through `injectIsRestoring` and set via `provideIsRestoring` */ +const IS_RESTORING = new InjectionToken('', { + // Default value when not provided + factory: () => signal(false).asReadonly(), +}) + interface InjectIsRestoringOptions { + /** + * The `Injector` to use to get the isRestoring signal. + * + * If this is not provided, the current injection context will be used instead (via `inject`). + */ injector?: Injector } /** * Injects a signal that tracks whether a restore is currently in progress. {@link injectQuery} and friends also check this internally to avoid race conditions between the restore and initializing queries. * @param options - Options for injectIsRestoring. - * @returns signal with boolean that indicates whether a restore is in progress. - * @public + * @returns readonly signal with boolean that indicates whether a restore is in progress. */ export function injectIsRestoring(options?: InjectIsRestoringOptions) { !options?.injector && assertInInjectionContext(injectIsRestoring) @@ -42,7 +39,6 @@ export function injectIsRestoring(options?: InjectIsRestoringOptions) { * Used by TanStack Query Angular persist client plugin to provide the signal that tracks the restore state * @param isRestoring - a readonly signal that returns a boolean * @returns Provider for the `isRestoring` signal - * @public */ export function provideIsRestoring(isRestoring: Signal): Provider { return { diff --git a/packages/angular-query-experimental/src/inject-mutation-state.ts b/packages/angular-query-experimental/src/inject-mutation-state.ts index 89419f1037..5f8996b2b1 100644 --- a/packages/angular-query-experimental/src/inject-mutation-state.ts +++ b/packages/angular-query-experimental/src/inject-mutation-state.ts @@ -42,9 +42,6 @@ function getResult( ) } -/** - * @public - */ export interface InjectMutationStateOptions { /** * The `Injector` in which to create the mutation state signal. @@ -59,7 +56,6 @@ export interface InjectMutationStateOptions { * @param injectMutationStateFn - A function that returns mutation state options. * @param options - The Angular injector to use. * @returns The signal that tracks the state of all mutations. - * @public */ export function injectMutationState( injectMutationStateFn: () => MutationStateOptions = () => ({}), diff --git a/packages/angular-query-experimental/src/inject-mutation.ts b/packages/angular-query-experimental/src/inject-mutation.ts index 2cb465104f..a2a29c70e8 100644 --- a/packages/angular-query-experimental/src/inject-mutation.ts +++ b/packages/angular-query-experimental/src/inject-mutation.ts @@ -37,7 +37,6 @@ export interface InjectMutationOptions { * @param injectMutationFn - A function that returns mutation options. * @param options - Additional configuration * @returns The mutation. - * @public */ export function injectMutation< TData = unknown, diff --git a/packages/angular-query-experimental/src/inject-queries.ts b/packages/angular-query-experimental/src/inject-queries.ts index 1889e9560c..0cbcf3fb6a 100644 --- a/packages/angular-query-experimental/src/inject-queries.ts +++ b/packages/angular-query-experimental/src/inject-queries.ts @@ -116,7 +116,6 @@ type GetResults = /** * QueriesOptions reducer recursively unwraps function arguments to infer/enforce type param - * @public */ export type QueriesOptions< T extends Array, @@ -159,7 +158,6 @@ export type QueriesOptions< /** * QueriesResults reducer recursively maps type param to results - * @public */ export type QueriesResults< T extends Array, @@ -200,8 +198,6 @@ export type QueriesResults< * @param root0.queries * @param root0.combine * @param injector - * @param injector - * @public */ export function injectQueries< T extends Array, diff --git a/packages/angular-query-experimental/src/inject-query-client.ts b/packages/angular-query-experimental/src/inject-query-client.ts index 3ac28e4d5e..7cd29e3850 100644 --- a/packages/angular-query-experimental/src/inject-query-client.ts +++ b/packages/angular-query-experimental/src/inject-query-client.ts @@ -6,7 +6,6 @@ import type { InjectOptions } from '@angular/core' * Injects a `QueryClient` instance and allows passing a custom injector. * @param injectOptions - Type of the options argument to inject and optionally a custom injector. * @returns The `QueryClient` instance. - * @public * @deprecated Use `inject(QueryClient)` instead. * If you need to get a `QueryClient` from a custom injector, use `injector.get(QueryClient)`. * diff --git a/packages/angular-query-experimental/src/inject-query.ts b/packages/angular-query-experimental/src/inject-query.ts index 0defdf18e9..1dac0ab694 100644 --- a/packages/angular-query-experimental/src/inject-query.ts +++ b/packages/angular-query-experimental/src/inject-query.ts @@ -60,7 +60,6 @@ export interface InjectQueryOptions { * @param injectQueryFn - A function that returns query options. * @param options - Additional configuration * @returns The query result. - * @public * @see https://tanstack.com/query/latest/docs/framework/angular/guides/queries */ export function injectQuery< @@ -112,7 +111,6 @@ export function injectQuery< * @param injectQueryFn - A function that returns query options. * @param options - Additional configuration * @returns The query result. - * @public * @see https://tanstack.com/query/latest/docs/framework/angular/guides/queries */ export function injectQuery< @@ -164,7 +162,6 @@ export function injectQuery< * @param injectQueryFn - A function that returns query options. * @param options - Additional configuration * @returns The query result. - * @public * @see https://tanstack.com/query/latest/docs/framework/angular/guides/queries */ export function injectQuery< @@ -216,7 +213,6 @@ export function injectQuery< * @param injectQueryFn - A function that returns query options. * @param options - Additional configuration * @returns The query result. - * @public * @see https://tanstack.com/query/latest/docs/framework/angular/guides/queries */ export function injectQuery( diff --git a/packages/angular-query-experimental/src/mutation-options.ts b/packages/angular-query-experimental/src/mutation-options.ts index b55f0367db..6e8f9b43ef 100644 --- a/packages/angular-query-experimental/src/mutation-options.ts +++ b/packages/angular-query-experimental/src/mutation-options.ts @@ -33,7 +33,6 @@ import type { * ``` * @param options - The mutation options. * @returns Mutation options. - * @public */ export function mutationOptions< TData = unknown, @@ -46,9 +45,6 @@ export function mutationOptions< return options } -/** - * @public - */ export interface CreateMutationOptions< TData = unknown, TError = DefaultError, diff --git a/packages/angular-query-experimental/src/providers.ts b/packages/angular-query-experimental/src/providers.ts index d7619cec71..076d76d0c3 100644 --- a/packages/angular-query-experimental/src/providers.ts +++ b/packages/angular-query-experimental/src/providers.ts @@ -1,22 +1,6 @@ -import { - DestroyRef, - ENVIRONMENT_INITIALIZER, - InjectionToken, - PLATFORM_ID, - computed, - effect, - inject, -} from '@angular/core' -import { QueryClient, noop, onlineManager } from '@tanstack/query-core' -import { isPlatformBrowser } from '@angular/common' -import { isDevMode } from './util/is-dev-mode/is-dev-mode' +import { DestroyRef, InjectionToken, inject } from '@angular/core' +import { QueryClient } from '@tanstack/query-core' import type { Provider } from '@angular/core' -import type { - DevtoolsButtonPosition, - DevtoolsErrorType, - DevtoolsPosition, - TanstackQueryDevtools, -} from '@tanstack/query-devtools' /** * Usually {@link provideTanStackQuery} is used once to set up TanStack Query and the @@ -108,6 +92,10 @@ export function provideQueryClient( * // In a lazy loaded route or lazy loaded component's providers array: * providers: [provideTanStackQuery(MY_QUERY_CLIENT)] * ``` + * Using an InjectionToken for the QueryClient is an advanced optimization which allows TanStack Query to be absent from the main application bundle. + * This can be beneficial if you want to include TanStack Query on lazy loaded routes only while still sharing a `QueryClient`. + * + * Note that this is a small optimization and for most applications it's preferable to provide the `QueryClient` in the main application config. * @param queryClient - A `QueryClient` instance, or an `InjectionToken` which provides a `QueryClient`. * @param features - Optional features to configure additional Query functionality. * @returns A set of providers to set up TanStack Query. @@ -130,7 +118,6 @@ export function provideTanStackQuery( * Allows to configure a `QueryClient`. * @param queryClient - A `QueryClient` instance. * @returns A set of providers to set up TanStack Query. - * @public * @see https://tanstack.com/query/v5/docs/framework/angular/quick-start * @deprecated Use `provideTanStackQuery` instead. */ @@ -138,6 +125,10 @@ export function provideAngularQuery(queryClient: QueryClient): Array { return provideTanStackQuery(queryClient) } +const queryFeatures = ['Devtools', 'PersistQueryClient'] as const + +type QueryFeatureKind = (typeof queryFeatures)[number] + /** * Helper type to represent a Query feature. */ @@ -162,207 +153,21 @@ export function queryFeature( /** * A type alias that represents a feature which enables developer tools. * The type is used to describe the return value of the `withDevtools` function. - * @public * @see {@link withDevtools} */ -export type DeveloperToolsFeature = QueryFeature<'DeveloperTools'> +export type DevtoolsFeature = QueryFeature<'Devtools'> /** * A type alias that represents a feature which enables persistence. * The type is used to describe the return value of the `withPersistQueryClient` function. - * @public */ export type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'> -/** - * Options for configuring the TanStack Query devtools. - * @public - */ -export interface DevtoolsOptions { - /** - * Set this true if you want the devtools to default to being open - */ - initialIsOpen?: boolean - /** - * The position of the TanStack logo to open and close the devtools panel. - * `top-left` | `top-right` | `bottom-left` | `bottom-right` | `relative` - * Defaults to `bottom-right`. - */ - buttonPosition?: DevtoolsButtonPosition - /** - * The position of the TanStack Query devtools panel. - * `top` | `bottom` | `left` | `right` - * Defaults to `bottom`. - */ - position?: DevtoolsPosition - /** - * Custom instance of QueryClient - */ - client?: QueryClient - /** - * Use this so you can define custom errors that can be shown in the devtools. - */ - errorTypes?: Array - /** - * Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. - */ - styleNonce?: string - /** - * Use this so you can attach the devtool's styles to a specific element in the DOM. - */ - shadowDOMTarget?: ShadowRoot - - /** - * Whether the developer tools should load. - * - `auto`- (Default) Lazily loads devtools when in development mode. Skips loading in production mode. - * - `true`- Always load the devtools, regardless of the environment. - * - `false`- Never load the devtools, regardless of the environment. - * - * You can use `true` and `false` to override loading developer tools from an environment file. - * For example, a test environment might run in production mode but you may want to load developer tools. - * - * Additionally, you can use a signal in the callback to dynamically load the devtools based on a condition. For example, - * a signal created from a RxJS observable that listens for a keyboard shortcut. - * - * **Example** - * ```ts - * withDevtools(() => ({ - * initialIsOpen: true, - * loadDevtools: inject(ExampleService).loadDevtools() - * })) - * ``` - */ - loadDevtools?: 'auto' | boolean -} - -/** - * Enables developer tools. - * - * **Example** - * - * ```ts - * export const appConfig: ApplicationConfig = { - * providers: [ - * provideTanStackQuery(new QueryClient(), withDevtools()) - * ] - * } - * ``` - * By default the devtools will be loaded when Angular runs in development mode and rendered in ``. - * - * If you need more control over when devtools are loaded, you can use the `loadDevtools` option. This is particularly useful if you want to load devtools based on environment configurations. For instance, you might have a test environment running in production mode but still require devtools to be available. - * - * If you need more control over where devtools are rendered, consider `injectDevtoolsPanel`. This allows rendering devtools inside your own devtools for example. - * @param withDevtoolsFn - A function that returns `DevtoolsOptions`. - * @returns A set of providers for use with `provideTanStackQuery`. - * @public - * @see {@link provideTanStackQuery} - * @see {@link DevtoolsOptions} - */ -export function withDevtools( - withDevtoolsFn?: () => DevtoolsOptions, -): DeveloperToolsFeature { - let providers: Array = [] - if (!isDevMode() && !withDevtoolsFn) { - providers = [] - } else { - providers = [ - { - // Do not use provideEnvironmentInitializer while Angular < v19 is supported - provide: ENVIRONMENT_INITIALIZER, - multi: true, - useFactory: () => { - if (!isPlatformBrowser(inject(PLATFORM_ID))) return noop - const injectedClient = inject(QueryClient, { - optional: true, - }) - const destroyRef = inject(DestroyRef) - - const options = computed(() => withDevtoolsFn?.() ?? {}) - - let devtools: TanstackQueryDevtools | null = null - let el: HTMLElement | null = null - - const shouldLoadToolsSignal = computed(() => { - const { loadDevtools } = options() - return typeof loadDevtools === 'boolean' - ? loadDevtools - : isDevMode() - }) - - const getResolvedQueryClient = () => { - const client = options().client ?? injectedClient - if (!client) { - throw new Error('No QueryClient found') - } - return client - } - - const destroyDevtools = () => { - devtools?.unmount() - el?.remove() - devtools = null - } - - return () => - effect(() => { - const shouldLoadTools = shouldLoadToolsSignal() - const { - client, - position, - errorTypes, - buttonPosition, - initialIsOpen, - } = options() - - if (devtools && !shouldLoadTools) { - destroyDevtools() - return - } else if (devtools && shouldLoadTools) { - client && devtools.setClient(client) - position && devtools.setPosition(position) - errorTypes && devtools.setErrorTypes(errorTypes) - buttonPosition && devtools.setButtonPosition(buttonPosition) - initialIsOpen && devtools.setInitialIsOpen(initialIsOpen) - return - } else if (!shouldLoadTools) { - return - } - - el = document.body.appendChild(document.createElement('div')) - el.classList.add('tsqd-parent-container') - - import('@tanstack/query-devtools').then((queryDevtools) => { - devtools = new queryDevtools.TanstackQueryDevtools({ - ...options(), - client: getResolvedQueryClient(), - queryFlavor: 'Angular Query', - version: '5', - onlineManager, - }) - - el && devtools.mount(el) - - // Unmount the devtools on application destroy - destroyRef.onDestroy(destroyDevtools) - }) - }) - }, - }, - ] - } - return queryFeature('DeveloperTools', providers) -} - /** * A type alias that represents all Query features available for use with `provideTanStackQuery`. * Features can be enabled by adding special functions to the `provideTanStackQuery` call. * See documentation for each symbol to find corresponding function name. See also `provideTanStackQuery` * documentation on how to use those functions. - * @public * @see {@link provideTanStackQuery} */ -export type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature - -export const queryFeatures = ['DeveloperTools', 'PersistQueryClient'] as const - -export type QueryFeatureKind = (typeof queryFeatures)[number] +export type QueryFeatures = DevtoolsFeature | PersistQueryClientFeature diff --git a/packages/angular-query-experimental/src/query-options.ts b/packages/angular-query-experimental/src/query-options.ts index e82540bee5..069472b903 100644 --- a/packages/angular-query-experimental/src/query-options.ts +++ b/packages/angular-query-experimental/src/query-options.ts @@ -72,7 +72,6 @@ export type DefinedInitialDataOptions< * ``` * @param options - The query options to tag with the type from `queryFn`. * @returns The tagged query options. - * @public */ export function queryOptions< TQueryFnData = unknown, @@ -105,7 +104,6 @@ export function queryOptions< * ``` * @param options - The query options to tag with the type from `queryFn`. * @returns The tagged query options. - * @public */ export function queryOptions< TQueryFnData = unknown, @@ -138,7 +136,6 @@ export function queryOptions< * ``` * @param options - The query options to tag with the type from `queryFn`. * @returns The tagged query options. - * @public */ export function queryOptions< TQueryFnData = unknown, @@ -171,7 +168,6 @@ export function queryOptions< * ``` * @param options - The query options to tag with the type from `queryFn`. * @returns The tagged query options. - * @public */ export function queryOptions(options: unknown) { return options diff --git a/packages/angular-query-experimental/src/types.ts b/packages/angular-query-experimental/src/types.ts index 578eaa0864..e32b8b8585 100644 --- a/packages/angular-query-experimental/src/types.ts +++ b/packages/angular-query-experimental/src/types.ts @@ -17,9 +17,6 @@ import type { import type { Signal } from '@angular/core' import type { MapToSignals } from './signal-proxy' -/** - * @public - */ export interface CreateBaseQueryOptions< TQueryFnData = unknown, TError = DefaultError, @@ -34,9 +31,6 @@ export interface CreateBaseQueryOptions< TQueryKey > {} -/** - * @public - */ export interface CreateQueryOptions< TQueryFnData = unknown, TError = DefaultError, @@ -53,18 +47,12 @@ export interface CreateQueryOptions< 'suspense' > {} -/** - * @public - */ type CreateStatusBasedQueryResult< TStatus extends QueryObserverResult['status'], TData = unknown, TError = DefaultError, > = Extract, { status: TStatus }> -/** - * @public - */ export interface BaseQueryNarrowing { isSuccess: ( this: CreateBaseQueryResult, @@ -89,9 +77,6 @@ export interface BaseQueryNarrowing { > } -/** - * @public - */ export interface CreateInfiniteQueryOptions< TQueryFnData = unknown, TError = DefaultError, @@ -109,9 +94,6 @@ export interface CreateInfiniteQueryOptions< 'suspense' > {} -/** - * @public - */ export type CreateBaseQueryResult< TData = unknown, TError = DefaultError, @@ -119,17 +101,11 @@ export type CreateBaseQueryResult< > = BaseQueryNarrowing & MapToSignals> -/** - * @public - */ export type CreateQueryResult< TData = unknown, TError = DefaultError, > = CreateBaseQueryResult -/** - * @public - */ export type DefinedCreateQueryResult< TData = unknown, TError = DefaultError, @@ -137,18 +113,12 @@ export type DefinedCreateQueryResult< > = BaseQueryNarrowing & MapToSignals> -/** - * @public - */ export type CreateInfiniteQueryResult< TData = unknown, TError = DefaultError, > = BaseQueryNarrowing & MapToSignals> -/** - * @public - */ export type DefinedCreateInfiniteQueryResult< TData = unknown, TError = DefaultError, @@ -158,9 +128,6 @@ export type DefinedCreateInfiniteQueryResult< >, > = MapToSignals -/** - * @public - */ export type CreateMutateFunction< TData = unknown, TError = DefaultError, @@ -170,9 +137,6 @@ export type CreateMutateFunction< ...args: Parameters> ) => void -/** - * @public - */ export type CreateMutateAsyncFunction< TData = unknown, TError = DefaultError, @@ -180,9 +144,6 @@ export type CreateMutateAsyncFunction< TContext = unknown, > = MutateFunction -/** - * @public - */ export type CreateBaseMutationResult< TData = unknown, TError = DefaultError, @@ -195,9 +156,6 @@ export type CreateBaseMutationResult< mutateAsync: CreateMutateAsyncFunction } -/** - * @public - */ type CreateStatusBasedMutationResult< TStatus extends CreateBaseMutationResult['status'], TData = unknown, @@ -211,9 +169,6 @@ type CreateStatusBasedMutationResult< type SignalFunction any> = T & Signal> -/** - * @public - */ export interface BaseMutationNarrowing< TData = unknown, TError = DefaultError, @@ -290,9 +245,6 @@ export interface BaseMutationNarrowing< > } -/** - * @public - */ export type CreateMutationResult< TData = unknown, TError = DefaultError, diff --git a/packages/angular-query-experimental/src/util/is-dev-mode/is-dev-mode.ts b/packages/angular-query-experimental/src/util/is-dev-mode/is-dev-mode.ts deleted file mode 100644 index 5c18cfcf51..0000000000 --- a/packages/angular-query-experimental/src/util/is-dev-mode/is-dev-mode.ts +++ /dev/null @@ -1,3 +0,0 @@ -// Re-export for mocking in tests - -export { isDevMode } from '@angular/core' diff --git a/packages/angular-query-experimental/tsup.config.js b/packages/angular-query-experimental/tsup.config.js index a1e9d23c1c..f68a72c9c5 100644 --- a/packages/angular-query-experimental/tsup.config.js +++ b/packages/angular-query-experimental/tsup.config.js @@ -1,13 +1,26 @@ import { defineConfig } from 'tsup' export default defineConfig({ - entry: ['src/index.ts'], + entry: [ + 'src/devtools-panel/index.ts', + 'src/devtools-panel/stub.ts', + 'src/devtools/index.ts', + 'src/devtools/stub.ts', + 'src/index.ts', + ], sourcemap: true, clean: true, format: ['esm'], - dts: true, + dts: { + entry: [ + 'src/devtools-panel/index.ts', + 'src/devtools/index.ts', + 'src/index.ts', + ], + }, outDir: 'build', outExtension({ format }) { return format === 'esm' ? { js: '.mjs' } : { js: '.js' } }, + splitting: false, }) diff --git a/packages/angular-query-persist-client/package.json b/packages/angular-query-persist-client/package.json index ad231460b9..7a45aa5d95 100644 --- a/packages/angular-query-persist-client/package.json +++ b/packages/angular-query-persist-client/package.json @@ -26,8 +26,8 @@ "test:types:ts53": "node ../../node_modules/typescript53/lib/tsc.js --build", "test:types:ts54": "node ../../node_modules/typescript54/lib/tsc.js --build", "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js --build", - "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js --build", - "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js --build", + "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js --build", + "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js --build", "test:types:tscurrent": "tsc --build", "test:lib": "vitest", "test:lib:dev": "pnpm run test:lib --watch", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ff70b200c4..92de4ae6b2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -5,7 +5,6 @@ settings: excludeLinksFromLockfile: false overrides: - '@tanstack/angular-query-devtools-experimental': workspace:* '@tanstack/angular-query-experimental': workspace:* '@tanstack/eslint-plugin-query': workspace:* '@tanstack/query-async-storage-persister': workspace:* @@ -305,9 +304,6 @@ importers: '@angular/router': specifier: ^20.0.0 version: 20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(rxjs@7.8.2) - '@tanstack/angular-query-devtools-experimental': - specifier: workspace:* - version: link:../../../packages/angular-query-devtools-experimental '@tanstack/angular-query-experimental': specifier: workspace:* version: link:../../../packages/angular-query-experimental @@ -1231,7 +1227,7 @@ importers: version: 6.1.18(react-native@0.76.3(@babel/core@7.26.10)(@babel/preset-env@7.27.2(@babel/core@7.26.10))(@react-native-community/cli-server-api@13.6.9(encoding@0.1.13))(@types/react@19.0.1)(encoding@0.1.13)(react@19.0.0))(react@19.0.0) '@react-navigation/stack': specifier: ^6.4.1 - version: 6.4.1(cgoxobftzx7q2rxvco2fw2mfyq) + version: 6.4.1(1f29909f8de70b3aa674884b982ac755) '@tanstack/react-query': specifier: workspace:* version: link:../../../packages/react-query @@ -2276,31 +2272,6 @@ importers: specifier: ^2.2.8 version: 2.2.8(typescript@5.8.3) - packages/angular-query-devtools-experimental: - dependencies: - '@angular/common': - specifier: '>=16.0.0' - version: 19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) - '@tanstack/query-devtools': - specifier: workspace:* - version: link:../query-devtools - devDependencies: - '@angular/core': - specifier: ^20.0.0 - version: 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) - '@angular/platform-browser-dynamic': - specifier: ^20.0.0 - version: 20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/compiler@20.0.0)(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))) - '@tanstack/angular-query-experimental': - specifier: workspace:* - version: link:../angular-query-experimental - eslint-plugin-jsdoc: - specifier: ^50.5.0 - version: 50.5.0(eslint@9.15.0(jiti@2.4.2)) - npm-run-all2: - specifier: ^5.0.0 - version: 5.0.2 - packages/angular-query-experimental: dependencies: '@tanstack/query-core': @@ -2367,7 +2338,7 @@ importers: version: link:../query-test-utils '@testing-library/angular': specifier: ^17.3.7 - version: 17.3.7(5fchvpeatqbl65tde2d3342iqq) + version: 17.3.7(44e06ac0fb247039d3919c909462d711) '@testing-library/dom': specifier: ^10.4.0 version: 10.4.0 @@ -2986,13 +2957,6 @@ packages: engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0, npm: ^6.11.0 || ^7.5.6 || >=8.0.0, yarn: '>= 1.13.0'} hasBin: true - '@angular/common@19.2.4': - resolution: {integrity: sha512-5iBerI1hkY8rAt0gZQgOlfzR69jj5j25JyfkDOhdZhezE0pqhDc69OnbkUM20LTau4bFRYOj015eiKWzE2DOzQ==} - engines: {node: ^18.19.1 || ^20.11.1 || >=22.0.0} - peerDependencies: - '@angular/core': 19.2.4 - rxjs: ^6.5.3 || ^7.4.0 - '@angular/common@20.0.0': resolution: {integrity: sha512-tZTvxDjx+wH74/hIpip63u4tlaXNVXkq1iVf4gk7RPQGCAYLNPDWma8X+RpXMXWikn4/mA5NS1VBBtStTbS+gg==} engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0} @@ -16473,13 +16437,6 @@ snapshots: transitivePeerDependencies: - chokidar - '@angular/animations@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))': - dependencies: - '@angular/common': 19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) - '@angular/core': 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) - tslib: 2.8.1 - optional: true - '@angular/animations@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))': dependencies: '@angular/common': 20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) @@ -16563,12 +16520,6 @@ snapshots: - chokidar - supports-color - '@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2)': - dependencies: - '@angular/core': 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) - rxjs: 7.8.2 - tslib: 2.8.1 - '@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2)': dependencies: '@angular/core': 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) @@ -16611,14 +16562,6 @@ snapshots: rxjs: 7.8.2 tslib: 2.8.1 - '@angular/platform-browser-dynamic@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/compiler@20.0.0)(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))': - dependencies: - '@angular/common': 19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) - '@angular/compiler': 20.0.0 - '@angular/core': 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) - '@angular/platform-browser': 20.0.0(@angular/animations@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)) - tslib: 2.8.1 - '@angular/platform-browser-dynamic@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/compiler@20.0.0)(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))': dependencies: '@angular/common': 20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) @@ -16627,14 +16570,6 @@ snapshots: '@angular/platform-browser': 20.0.0(@angular/animations@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)) tslib: 2.8.1 - '@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))': - dependencies: - '@angular/common': 19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) - '@angular/core': 20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0) - tslib: 2.8.1 - optionalDependencies: - '@angular/animations': 20.0.0(@angular/common@19.2.4(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)) - '@angular/platform-browser@20.0.0(@angular/animations@20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)))(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))': dependencies: '@angular/common': 20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) @@ -20997,7 +20932,7 @@ snapshots: dependencies: nanoid: 3.3.8 - '@react-navigation/stack@6.4.1(cgoxobftzx7q2rxvco2fw2mfyq)': + '@react-navigation/stack@6.4.1(1f29909f8de70b3aa674884b982ac755)': dependencies: '@react-navigation/elements': 1.3.31(@react-navigation/native@6.1.18(react-native@0.76.3(@babel/core@7.26.10)(@babel/preset-env@7.27.2(@babel/core@7.26.10))(@react-native-community/cli-server-api@13.6.9(encoding@0.1.13))(@types/react@19.0.1)(encoding@0.1.13)(react@19.0.0))(react@19.0.0))(react-native-safe-area-context@4.12.0(react-native@0.76.3(@babel/core@7.26.10)(@babel/preset-env@7.27.2(@babel/core@7.26.10))(@react-native-community/cli-server-api@13.6.9(encoding@0.1.13))(@types/react@19.0.1)(encoding@0.1.13)(react@19.0.0))(react@19.0.0))(react-native@0.76.3(@babel/core@7.26.10)(@babel/preset-env@7.27.2(@babel/core@7.26.10))(@react-native-community/cli-server-api@13.6.9(encoding@0.1.13))(@types/react@19.0.1)(encoding@0.1.13)(react@19.0.0))(react@19.0.0) '@react-navigation/native': 6.1.18(react-native@0.76.3(@babel/core@7.26.10)(@babel/preset-env@7.27.2(@babel/core@7.26.10))(@react-native-community/cli-server-api@13.6.9(encoding@0.1.13))(@types/react@19.0.1)(encoding@0.1.13)(react@19.0.0))(react@19.0.0) @@ -21786,7 +21721,7 @@ snapshots: - tsx - yaml - '@testing-library/angular@17.3.7(5fchvpeatqbl65tde2d3342iqq)': + '@testing-library/angular@17.3.7(44e06ac0fb247039d3919c909462d711)': dependencies: '@angular/animations': 20.0.0(@angular/common@20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2))(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0)) '@angular/common': 20.0.0(@angular/core@20.0.0(@angular/compiler@20.0.0)(rxjs@7.8.2)(zone.js@0.15.0))(rxjs@7.8.2) diff --git a/scripts/publish.js b/scripts/publish.js index 953763b569..a1ac340296 100644 --- a/scripts/publish.js +++ b/scripts/publish.js @@ -84,10 +84,6 @@ await publish({ name: '@tanstack/vue-query-devtools', packageDir: 'packages/vue-query-devtools', }, - { - name: '@tanstack/angular-query-devtools-experimental', - packageDir: 'packages/angular-query-devtools-experimental', - }, { name: '@tanstack/angular-query-experimental', packageDir: 'packages/angular-query-experimental', From fbc3eb07ed8651b6a98db2a96e0a073df35dc1dc Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Thu, 12 Jun 2025 16:05:48 +0200 Subject: [PATCH 02/24] Fix compatibility with moduleResolution node --- knip.json | 3 ++ .../angular-query-experimental/DEVELOPMENT.md | 34 +++++++++++++++ .../angular-query-experimental/package.json | 42 ++++++++++++++++--- .../src/devtools-panel/production/index.ts | 1 + .../src/devtools/production/index.ts | 1 + .../angular-query-experimental/tsup.config.js | 21 ++++++++++ scripts/publish.js | 2 +- 7 files changed, 97 insertions(+), 7 deletions(-) create mode 100644 packages/angular-query-experimental/DEVELOPMENT.md create mode 100644 packages/angular-query-experimental/src/devtools-panel/production/index.ts create mode 100644 packages/angular-query-experimental/src/devtools/production/index.ts diff --git a/knip.json b/knip.json index c36c891ce7..bbce657376 100644 --- a/knip.json +++ b/knip.json @@ -14,6 +14,9 @@ ], "ignoreWorkspaces": ["examples/**", "integrations/**"], "workspaces": { + "packages/angular-query-experimental": { + "ignore": ["**/production/index.ts"] + }, "packages/query-codemods": { "entry": ["src/v4/**/*.cjs", "src/v5/**/*.cjs"], "ignore": ["**/__testfixtures__/**"] diff --git a/packages/angular-query-experimental/DEVELOPMENT.md b/packages/angular-query-experimental/DEVELOPMENT.md new file mode 100644 index 0000000000..7af6bf10c5 --- /dev/null +++ b/packages/angular-query-experimental/DEVELOPMENT.md @@ -0,0 +1,34 @@ +# Angular adapter development + +## Subpath exports and moduleResolution: node + +Many applications including NX monorepos and older Angular CLI applications still specify `moduleResolution: node` in their tsconfig. +To maintain compatibility with these applications, +exports should strictly export types from the same path as the subpath so that TypeScript can resolve the types. + +### ✅ Compatible +```json +{ + "./devtools/production": { + "types": "./devtools/production/index.d.ts", + "default": "./devtools/index.mjs" + } +} +``` + +### ❌ Not compatible: types are exported from the build directory, which is not part of the export path +```json +{ + "./devtools/production": { + "types": "./build/devtools/production/index.d.ts", + "default": "./devtools/index.mjs" + } +} +``` + +### How are these paths correctly configured? + +- tsup.config.js is configured to copy package.json and README.md to the build directory +- the production subpath exports are configured as dts entry points in tsup.config.js. Note that simply copying generated type declarations can result in incorrect relative imports. +- package.json contains `publishConfig` which overrides `exports` when publishing the package, excluding `build` in the subpath export paths. +- The build directory is published instead of the containing directory. This is configured in `scripts/publish.js` diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 8e12cf4931..64ea922c88 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -42,7 +42,7 @@ "test:types:tscurrent": "tsc --build", "test:lib": "vitest", "test:lib:dev": "pnpm run test:lib --watch", - "test:build": "publint --strict && attw --pack", + "test:build": "publint --strict --pack=false ./build && attw --pack ./build", "build": "pnpm build:tsup", "build:tsup": "tsup --tsconfig tsconfig.prod.json" }, @@ -59,7 +59,7 @@ "default": "./build/devtools/stub.mjs" }, "./devtools/production": { - "types": "./build/devtools/index.d.ts", + "types": "./build/devtools/production/index.d.ts", "default": "./build/devtools/index.mjs" }, "./devtools-panel": { @@ -68,7 +68,7 @@ "default": "./build/devtools-panel/stub.mjs" }, "./devtools-panel/production": { - "types": "./build/devtools-panel/index.d.ts", + "types": "./build/devtools-panel/production/index.d.ts", "default": "./build/devtools-panel/index.mjs" }, "./package.json": { @@ -77,9 +77,10 @@ }, "sideEffects": false, "files": [ - "build", - "src", - "!src/__tests__" + "devtools", + "devtools-panel", + "index.*", + "*.d.ts" ], "dependencies": { "@tanstack/query-core": "workspace:*", @@ -98,5 +99,34 @@ "peerDependencies": { "@angular/common": ">=16.0.0", "@angular/core": ">=16.0.0" + }, + "publishConfig": { + "exports":{ + ".": { + "types": "./index.d.ts", + "default": "./index.mjs" + }, + "./devtools": { + "types": "./devtools/index.d.ts", + "development": "./devtools/index.mjs", + "default": "./devtools/stub.mjs" + }, + "./devtools/production": { + "types": "./devtools/production/index.d.ts", + "default": "./devtools/index.mjs" + }, + "./devtools-panel": { + "types": "./devtools-panel/index.d.ts", + "development": "./devtools-panel/index.mjs", + "default": "./devtools-panel/stub.mjs" + }, + "./devtools-panel/production": { + "types": "./devtools-panel/production/index.d.ts", + "default": "./devtools-panel/index.mjs" + }, + "./package.json": { + "default": "./package.json" + } + } } } diff --git a/packages/angular-query-experimental/src/devtools-panel/production/index.ts b/packages/angular-query-experimental/src/devtools-panel/production/index.ts new file mode 100644 index 0000000000..51a3b4100a --- /dev/null +++ b/packages/angular-query-experimental/src/devtools-panel/production/index.ts @@ -0,0 +1 @@ +export * from '../types' diff --git a/packages/angular-query-experimental/src/devtools/production/index.ts b/packages/angular-query-experimental/src/devtools/production/index.ts new file mode 100644 index 0000000000..51a3b4100a --- /dev/null +++ b/packages/angular-query-experimental/src/devtools/production/index.ts @@ -0,0 +1 @@ +export * from '../types' diff --git a/packages/angular-query-experimental/tsup.config.js b/packages/angular-query-experimental/tsup.config.js index f68a72c9c5..778284492d 100644 --- a/packages/angular-query-experimental/tsup.config.js +++ b/packages/angular-query-experimental/tsup.config.js @@ -1,3 +1,5 @@ +import { copyFileSync, mkdirSync } from 'node:fs' +import { dirname } from 'node:path' import { defineConfig } from 'tsup' export default defineConfig({ @@ -14,7 +16,9 @@ export default defineConfig({ dts: { entry: [ 'src/devtools-panel/index.ts', + 'src/devtools-panel/production/index.ts', 'src/devtools/index.ts', + 'src/devtools/production/index.ts', 'src/index.ts', ], }, @@ -24,3 +28,20 @@ export default defineConfig({ }, splitting: false, }) + +process.on('beforeExit', (code) => { + if (code === 0) { + const files = [ + { + from: 'package.json', + to: 'build/package.json', + }, + { from: 'README.md', to: 'build/README.md' }, + ] + + for (const { from, to } of files) { + mkdirSync(dirname(to), { recursive: true }) + copyFileSync(from, to) + } + } +}) diff --git a/scripts/publish.js b/scripts/publish.js index a1ac340296..a8fbb3da12 100644 --- a/scripts/publish.js +++ b/scripts/publish.js @@ -86,7 +86,7 @@ await publish({ }, { name: '@tanstack/angular-query-experimental', - packageDir: 'packages/angular-query-experimental', + packageDir: 'packages/angular-query-experimental/build', }, // publish when angular-query is stable // { From f8334ca3b8ae4a8780f454a563f4218e9812283b Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Thu, 12 Jun 2025 14:11:10 +0000 Subject: [PATCH 03/24] ci: apply automated fixes --- packages/angular-query-experimental/DEVELOPMENT.md | 2 ++ packages/angular-query-experimental/package.json | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/angular-query-experimental/DEVELOPMENT.md b/packages/angular-query-experimental/DEVELOPMENT.md index 7af6bf10c5..c117747695 100644 --- a/packages/angular-query-experimental/DEVELOPMENT.md +++ b/packages/angular-query-experimental/DEVELOPMENT.md @@ -7,6 +7,7 @@ To maintain compatibility with these applications, exports should strictly export types from the same path as the subpath so that TypeScript can resolve the types. ### ✅ Compatible + ```json { "./devtools/production": { @@ -17,6 +18,7 @@ exports should strictly export types from the same path as the subpath so that T ``` ### ❌ Not compatible: types are exported from the build directory, which is not part of the export path + ```json { "./devtools/production": { diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index dbe31b7525..d90367bf69 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -101,7 +101,7 @@ "@angular/core": ">=16.0.0" }, "publishConfig": { - "exports":{ + "exports": { ".": { "types": "./index.d.ts", "default": "./index.mjs" From 59ad3d87b2a1aa67706b91366c472b674c61da65 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Thu, 12 Jun 2025 16:43:02 +0200 Subject: [PATCH 04/24] fix preview release for angular-query --- .github/workflows/pr.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 5ef53b56ce..30be72dfa9 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -57,7 +57,7 @@ jobs: - name: Build Packages run: pnpm run build:all - name: Publish Previews - run: pnpx pkg-pr-new publish --pnpm --compact './packages/*' --template './examples/*/*' + run: pnpx pkg-pr-new publish --pnpm --compact './packages/!(angular-query-experimental)' './packages/angular-query-experimental/build' --template './examples/*/*' - name: Determine commit SHA id: determine-sha run: | From e9055fba9592260adf70649262a4e217c312dd27 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Thu, 12 Jun 2025 17:07:56 +0200 Subject: [PATCH 05/24] Fix angular-query preview release --- .github/workflows/pr.yml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 30be72dfa9..3c1fbc9926 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -57,7 +57,10 @@ jobs: - name: Build Packages run: pnpm run build:all - name: Publish Previews - run: pnpx pkg-pr-new publish --pnpm --compact './packages/!(angular-query-experimental)' './packages/angular-query-experimental/build' --template './examples/*/*' + shell: bash + run: | + dirs=($(find ./packages -mindepth 1 -maxdepth 1 -type d ! -name 'angular-query-experimental') './packages/angular-query-experimental/build') + pnpx pkg-pr-new publish --pnpm --compact "${dirs[@]}" --template './examples/*/*' - name: Determine commit SHA id: determine-sha run: | From 635774e833c4c02349b987b9cc315c52e6566dc0 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Tue, 17 Jun 2025 20:43:51 +0200 Subject: [PATCH 06/24] Revert some changes made obsolete by better Vite based alternative --- .github/workflows/pr.yml | 5 +-- .../angular-query-experimental/DEVELOPMENT.md | 36 ------------------- .../angular-query-experimental/package.json | 22 ++++++------ scripts/publish.js | 2 +- 4 files changed, 13 insertions(+), 52 deletions(-) delete mode 100644 packages/angular-query-experimental/DEVELOPMENT.md diff --git a/.github/workflows/pr.yml b/.github/workflows/pr.yml index 3c1fbc9926..5ef53b56ce 100644 --- a/.github/workflows/pr.yml +++ b/.github/workflows/pr.yml @@ -57,10 +57,7 @@ jobs: - name: Build Packages run: pnpm run build:all - name: Publish Previews - shell: bash - run: | - dirs=($(find ./packages -mindepth 1 -maxdepth 1 -type d ! -name 'angular-query-experimental') './packages/angular-query-experimental/build') - pnpx pkg-pr-new publish --pnpm --compact "${dirs[@]}" --template './examples/*/*' + run: pnpx pkg-pr-new publish --pnpm --compact './packages/*' --template './examples/*/*' - name: Determine commit SHA id: determine-sha run: | diff --git a/packages/angular-query-experimental/DEVELOPMENT.md b/packages/angular-query-experimental/DEVELOPMENT.md deleted file mode 100644 index c117747695..0000000000 --- a/packages/angular-query-experimental/DEVELOPMENT.md +++ /dev/null @@ -1,36 +0,0 @@ -# Angular adapter development - -## Subpath exports and moduleResolution: node - -Many applications including NX monorepos and older Angular CLI applications still specify `moduleResolution: node` in their tsconfig. -To maintain compatibility with these applications, -exports should strictly export types from the same path as the subpath so that TypeScript can resolve the types. - -### ✅ Compatible - -```json -{ - "./devtools/production": { - "types": "./devtools/production/index.d.ts", - "default": "./devtools/index.mjs" - } -} -``` - -### ❌ Not compatible: types are exported from the build directory, which is not part of the export path - -```json -{ - "./devtools/production": { - "types": "./build/devtools/production/index.d.ts", - "default": "./devtools/index.mjs" - } -} -``` - -### How are these paths correctly configured? - -- tsup.config.js is configured to copy package.json and README.md to the build directory -- the production subpath exports are configured as dts entry points in tsup.config.js. Note that simply copying generated type declarations can result in incorrect relative imports. -- package.json contains `publishConfig` which overrides `exports` when publishing the package, excluding `build` in the subpath export paths. -- The build directory is published instead of the containing directory. This is configured in `scripts/publish.js` diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 8799b7d50e..71442b0f0f 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -27,7 +27,7 @@ "tanstack" ], "scripts": { - "clean": "premove ./build ./coverage ./dist-ts ./**.d.ts", + "clean": "premove ./dist ./coverage ./dist-ts ./**.d.ts", "compile": "tsc --build", "test:eslint": "eslint ./src", "test:types": "npm-run-all --serial test:types:*", @@ -57,22 +57,22 @@ "default": "./dist/index.mjs" }, "./devtools": { - "types": "./build/devtools/index.d.ts", - "development": "./build/devtools/index.mjs", - "default": "./build/devtools/stub.mjs" + "types": "./dist/devtools/index.d.ts", + "development": "./dist/devtools/index.mjs", + "default": "./dist/devtools/stub.mjs" }, "./devtools/production": { - "types": "./build/devtools/production/index.d.ts", - "default": "./build/devtools/index.mjs" + "types": "./dist/devtools/production/index.d.ts", + "default": "./dist/devtools/index.mjs" }, "./devtools-panel": { - "types": "./build/devtools-panel/index.d.ts", - "development": "./build/devtools-panel/index.mjs", - "default": "./build/devtools-panel/stub.mjs" + "types": "./dist/devtools-panel/index.d.ts", + "development": "./dist/devtools-panel/index.mjs", + "default": "./dist/devtools-panel/stub.mjs" }, "./devtools-panel/production": { - "types": "./build/devtools-panel/production/index.d.ts", - "default": "./build/devtools-panel/index.mjs" + "types": "./dist/devtools-panel/production/index.d.ts", + "default": "./dist/devtools-panel/index.mjs" }, "./package.json": { "default": "./package.json" diff --git a/scripts/publish.js b/scripts/publish.js index a8fbb3da12..a1ac340296 100644 --- a/scripts/publish.js +++ b/scripts/publish.js @@ -86,7 +86,7 @@ await publish({ }, { name: '@tanstack/angular-query-experimental', - packageDir: 'packages/angular-query-experimental/build', + packageDir: 'packages/angular-query-experimental', }, // publish when angular-query is stable // { From c2600eb13c3a9843b1b307da297cb7c2fab2fd6a Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Tue, 17 Jun 2025 21:28:59 +0200 Subject: [PATCH 07/24] Update export paths --- packages/angular-query-experimental/package.json | 8 ++++---- packages/angular-query-experimental/vite.config.ts | 10 +++++++--- 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 71442b0f0f..2c89f6ec14 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -57,21 +57,21 @@ "default": "./dist/index.mjs" }, "./devtools": { - "types": "./dist/devtools/index.d.ts", + "types": "./dist/types/devtools/index.d.ts", "development": "./dist/devtools/index.mjs", "default": "./dist/devtools/stub.mjs" }, "./devtools/production": { - "types": "./dist/devtools/production/index.d.ts", + "types": "./dist/types/devtools/production/index.d.ts", "default": "./dist/devtools/index.mjs" }, "./devtools-panel": { - "types": "./dist/devtools-panel/index.d.ts", + "types": "./dist/types/devtools-panel/index.d.ts", "development": "./dist/devtools-panel/index.mjs", "default": "./dist/devtools-panel/stub.mjs" }, "./devtools-panel/production": { - "types": "./dist/devtools-panel/production/index.d.ts", + "types": "./dist/types/devtools-panel/production/index.d.ts", "default": "./dist/devtools-panel/index.mjs" }, "./package.json": { diff --git a/packages/angular-query-experimental/vite.config.ts b/packages/angular-query-experimental/vite.config.ts index 25eb7d8c68..1ba81961f9 100644 --- a/packages/angular-query-experimental/vite.config.ts +++ b/packages/angular-query-experimental/vite.config.ts @@ -76,8 +76,6 @@ export const tanstackViteConfig = (options: Options) => { declarationMap: false, }, beforeWriteFile: (filePath, content) => { - // content = - // options.beforeWriteDeclarationFile?.(filePath, content) || content return { filePath, content: ensureImportFileExtension({ content, extension: 'js' }), @@ -114,7 +112,13 @@ export default mergeConfig( config, tanstackViteConfig({ cjs: false, - entry: ['./src/index.ts'], + entry: [ + './src/index.ts', + './src/devtools-panel/index.ts', + './src/devtools-panel/stub.ts', + './src/devtools/index.ts', + './src/devtools/stub.ts', + ], exclude: ['src/__tests__'], srcDir: './src', tsconfigPath: 'tsconfig.prod.json', From d6f6fa355c5b54eaef939c819b12819b17a3d026 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Tue, 17 Jun 2025 21:55:17 +0200 Subject: [PATCH 08/24] Fix production exports and publishconfig --- .../angular-query-experimental/package.json | 39 +++++++++---------- .../src/devtools-panel/production/index.ts | 2 +- .../src/devtools/production/index.ts | 2 +- 3 files changed, 20 insertions(+), 23 deletions(-) diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 2c89f6ec14..001a5c50d4 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -112,30 +112,27 @@ "types": "./index.d.ts", "default": "./dist/index.mjs" }, + "./devtools": { + "types": "./devtools/index.d.ts", + "development": "./dist/devtools/index.mjs", + "default": "./dist/devtools/stub.mjs" + }, + "./devtools/production": { + "types": "./devtools/production/index.d.ts", + "default": "./dist/devtools/index.mjs" + }, + "./devtools-panel": { + "types": "./devtools-panel/index.d.ts", + "development": "./dist/devtools-panel/index.mjs", + "default": "./dist/devtools-panel/stub.mjs" + }, + "./devtools-panel/production": { + "types": "./devtools-panel/production/index.d.ts", + "default": "./dist/devtools-panel/index.mjs" + }, "./package.json": { "default": "./package.json" } - }, - "./devtools": { - "types": "./devtools/index.d.ts", - "development": "./devtools/index.mjs", - "default": "./devtools/stub.mjs" - }, - "./devtools/production": { - "types": "./devtools/production/index.d.ts", - "default": "./devtools/index.mjs" - }, - "./devtools-panel": { - "types": "./devtools-panel/index.d.ts", - "development": "./devtools-panel/index.mjs", - "default": "./devtools-panel/stub.mjs" - }, - "./devtools-panel/production": { - "types": "./devtools-panel/production/index.d.ts", - "default": "./devtools-panel/index.mjs" - }, - "./package.json": { - "default": "./package.json" } } } diff --git a/packages/angular-query-experimental/src/devtools-panel/production/index.ts b/packages/angular-query-experimental/src/devtools-panel/production/index.ts index 51a3b4100a..546becea7f 100644 --- a/packages/angular-query-experimental/src/devtools-panel/production/index.ts +++ b/packages/angular-query-experimental/src/devtools-panel/production/index.ts @@ -1 +1 @@ -export * from '../types' +export * from '..' diff --git a/packages/angular-query-experimental/src/devtools/production/index.ts b/packages/angular-query-experimental/src/devtools/production/index.ts index 51a3b4100a..546becea7f 100644 --- a/packages/angular-query-experimental/src/devtools/production/index.ts +++ b/packages/angular-query-experimental/src/devtools/production/index.ts @@ -1 +1 @@ -export * from '../types' +export * from '..' From 891f8d661b78fcb37bdeef450d0d67fe40ff7291 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Wed, 23 Jul 2025 13:06:41 +0200 Subject: [PATCH 09/24] knip config --- knip.json | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/knip.json b/knip.json index 588441e084..8bc297fd4c 100644 --- a/knip.json +++ b/knip.json @@ -15,9 +15,6 @@ ], "ignoreWorkspaces": ["examples/**", "integrations/**"], "workspaces": { - "packages/angular-query-experimental": { - "ignore": ["**/production/index.ts"] - }, "packages/query-codemods": { "entry": ["src/v4/**/*.cjs", "src/v5/**/*.cjs"], "ignore": ["**/__testfixtures__/**"] @@ -27,6 +24,13 @@ "ignoreDependencies": ["vue2", "vue2.7"] }, "packages/angular-query-experimental": { + "entry": [ + "src/index.ts", + "src/devtools/index.ts", + "src/devtools/production/index.ts", + "src/devtools-panel/index.ts", + "src/devtools-panel/production/index.ts" + ], "ignore": ["scripts/prepack.js", "scripts/prepare-package.js"] } } From 6b72a82a30eabc06e680eee1465583fb17b2e6d6 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Wed, 23 Jul 2025 13:45:17 +0200 Subject: [PATCH 10/24] remove postpack --- packages/angular-query-experimental/package.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 6a607d5114..edb796d038 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -44,8 +44,7 @@ "test:lib:dev": "pnpm run test:lib --watch", "test:build": "pnpm pack && publint *.tgz --strict && attw *.tgz; premove *.tgz", "build": "vite build", - "prepack": "node scripts/prepack.js", - "postpack": "node scripts/postpack.js" + "prepack": "node scripts/prepack.js" }, "type": "module", "types": "dist/types/index.d.ts", From 4637f2165fbfba5fc57665574ce24c7c70988a79 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 1 Aug 2025 17:53:22 +0200 Subject: [PATCH 11/24] Generate API reference docs --- .../functions/infinitequeryoptions.md | 48 +++--- .../functions/injectinfinitequery.md | 22 ++- .../reference/functions/injectisfetching.md | 8 +- .../reference/functions/injectismutating.md | 8 +- .../reference/functions/injectisrestoring.md | 10 +- .../reference/functions/injectmutation.md | 8 +- .../functions/injectmutationstate.md | 8 +- .../reference/functions/injectqueries.md | 18 +-- .../reference/functions/injectquery.md | 20 +-- .../reference/functions/injectqueryclient.md | 8 +- .../reference/functions/mutationoptions.md | 8 +- .../functions/provideangularquery.md | 40 +++++ .../reference/functions/provideisrestoring.md | 8 +- .../reference/functions/providequeryclient.md | 8 +- .../functions/providetanstackquery.md | 13 +- .../reference/functions/queryfeature.md | 10 +- .../reference/functions/queryoptions.md | 39 ++--- .../reference/functions/withdevtools.md | 49 ------ docs/framework/angular/reference/index.md | 14 +- .../interfaces/basemutationnarrowing.md | 20 +-- .../interfaces/basequerynarrowing.md | 28 ++-- .../interfaces/createbasequeryoptions.md | 4 + .../interfaces/createinfinitequeryoptions.md | 10 +- .../interfaces/createmutationoptions.md | 4 + .../interfaces/createqueryoptions.md | 4 + .../reference/interfaces/devtoolsoptions.md | 143 ------------------ .../interfaces/injectinfinitequeryoptions.md | 10 +- .../interfaces/injectisfetchingoptions.md | 10 +- .../interfaces/injectismutatingoptions.md | 10 +- .../interfaces/injectmutationoptions.md | 10 +- .../interfaces/injectmutationstateoptions.md | 10 +- .../interfaces/injectqueryoptions.md | 10 +- .../reference/interfaces/queryfeature.md | 14 +- .../type-aliases/createbasemutationresult.md | 8 +- .../type-aliases/createbasequeryresult.md | 8 +- .../type-aliases/createinfinitequeryresult.md | 8 +- .../type-aliases/createmutateasyncfunction.md | 8 +- .../type-aliases/createmutatefunction.md | 8 +- .../type-aliases/createmutationresult.md | 8 +- .../type-aliases/createqueryresult.md | 8 +- .../definedcreateinfinitequeryresult.md | 8 +- .../type-aliases/definedcreatequeryresult.md | 8 +- .../definedinitialdatainfiniteoptions.md | 9 +- .../type-aliases/definedinitialdataoptions.md | 8 +- .../type-aliases/developertoolsfeature.md | 18 +-- .../type-aliases/persistqueryclientfeature.md | 8 +- .../reference/type-aliases/queriesoptions.md | 12 +- .../reference/type-aliases/queriesresults.md | 12 +- .../type-aliases/queryfeaturekind.md | 14 -- .../reference/type-aliases/queryfeatures.md | 10 +- .../undefinedinitialdatainfiniteoptions.md | 9 +- .../undefinedinitialdataoptions.md | 8 +- .../unusedskiptokeninfiniteoptions.md | 11 +- .../type-aliases/unusedskiptokenoptions.md | 8 +- .../reference/variables/queryfeatures.md | 14 -- .../src/devtools/types.ts | 4 +- .../angular-query-experimental/src/index.ts | 2 +- .../src/providers.ts | 4 +- 58 files changed, 346 insertions(+), 511 deletions(-) create mode 100644 docs/framework/angular/reference/functions/provideangularquery.md delete mode 100644 docs/framework/angular/reference/functions/withdevtools.md delete mode 100644 docs/framework/angular/reference/interfaces/devtoolsoptions.md delete mode 100644 docs/framework/angular/reference/type-aliases/queryfeaturekind.md delete mode 100644 docs/framework/angular/reference/variables/queryfeatures.md diff --git a/docs/framework/angular/reference/functions/infinitequeryoptions.md b/docs/framework/angular/reference/functions/infinitequeryoptions.md index 92894f5bcd..872d55935b 100644 --- a/docs/framework/angular/reference/functions/infinitequeryoptions.md +++ b/docs/framework/angular/reference/functions/infinitequeryoptions.md @@ -3,6 +3,8 @@ id: infiniteQueryOptions title: infiniteQueryOptions --- + + # Function: infiniteQueryOptions() Allows to share and re-use infinite query options in a type-safe way. @@ -24,16 +26,19 @@ function infiniteQueryOptions< TPageParam, >( options, -): DefinedInitialDataInfiniteOptions< +): CreateInfiniteQueryOptions< TQueryFnData, TError, TData, TQueryKey, TPageParam > & + object & object ``` +Defined in: [infinite-query-options.ts:88](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L88) + Allows to share and re-use infinite query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -60,7 +65,7 @@ The infinite query options to tag with the type from `queryFn`. ### Returns -[`DefinedInitialDataInfiniteOptions`](../../type-aliases/definedinitialdatainfiniteoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` +[`CreateInfiniteQueryOptions`](../../interfaces/createinfinitequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` & `object` The tagged infinite query options. @@ -70,10 +75,6 @@ The tagged infinite query options. The infinite query options to tag with the type from `queryFn`. -### Defined in - -[infinite-query-options.ts:94](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L94) - ## Call Signature ```ts @@ -85,16 +86,22 @@ function infiniteQueryOptions< TPageParam, >( options, -): UnusedSkipTokenInfiniteOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam +): OmitKeyof< + CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam + >, + 'queryFn' > & + object & object ``` +Defined in: [infinite-query-options.ts:119](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L119) + Allows to share and re-use infinite query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -121,7 +128,7 @@ The infinite query options to tag with the type from `queryFn`. ### Returns -[`UnusedSkipTokenInfiniteOptions`](../../type-aliases/unusedskiptokeninfiniteoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` +`OmitKeyof`\<[`CreateInfiniteQueryOptions`](../../interfaces/createinfinitequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>, `"queryFn"`\> & `object` & `object` The tagged infinite query options. @@ -131,10 +138,6 @@ The tagged infinite query options. The infinite query options to tag with the type from `queryFn`. -### Defined in - -[infinite-query-options.ts:126](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L126) - ## Call Signature ```ts @@ -146,16 +149,19 @@ function infiniteQueryOptions< TPageParam, >( options, -): UndefinedInitialDataInfiniteOptions< +): CreateInfiniteQueryOptions< TQueryFnData, TError, TData, TQueryKey, TPageParam > & + object & object ``` +Defined in: [infinite-query-options.ts:150](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L150) + Allows to share and re-use infinite query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -182,7 +188,7 @@ The infinite query options to tag with the type from `queryFn`. ### Returns -[`UndefinedInitialDataInfiniteOptions`](../../type-aliases/undefinedinitialdatainfiniteoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` +[`CreateInfiniteQueryOptions`](../../interfaces/createinfinitequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> & `object` & `object` The tagged infinite query options. @@ -191,7 +197,3 @@ The tagged infinite query options. ### Param The infinite query options to tag with the type from `queryFn`. - -### Defined in - -[infinite-query-options.ts:158](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L158) diff --git a/docs/framework/angular/reference/functions/injectinfinitequery.md b/docs/framework/angular/reference/functions/injectinfinitequery.md index 7cc9e202e5..aa51ecaf7a 100644 --- a/docs/framework/angular/reference/functions/injectinfinitequery.md +++ b/docs/framework/angular/reference/functions/injectinfinitequery.md @@ -3,6 +3,8 @@ id: injectInfiniteQuery title: injectInfiniteQuery --- + + # Function: injectInfiniteQuery() Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. @@ -31,6 +33,8 @@ function injectInfiniteQuery< ): DefinedCreateInfiniteQueryResult ``` +Defined in: [inject-infinite-query.ts:41](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L41) + Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -76,10 +80,6 @@ A function that returns infinite query options. Additional configuration. -### Defined in - -[inject-infinite-query.ts:42](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L42) - ## Call Signature ```ts @@ -92,6 +92,8 @@ function injectInfiniteQuery< >(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` +Defined in: [inject-infinite-query.ts:65](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L65) + Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -137,10 +139,6 @@ A function that returns infinite query options. Additional configuration. -### Defined in - -[inject-infinite-query.ts:67](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L67) - ## Call Signature ```ts @@ -153,6 +151,8 @@ function injectInfiniteQuery< >(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` +Defined in: [inject-infinite-query.ts:89](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L89) + Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -172,7 +172,7 @@ Infinite queries can additively "load more" data onto an existing set of data or #### injectInfiniteQueryFn -() => [`CreateInfiniteQueryOptions`](../../interfaces/createinfinitequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryFnData`, `TQueryKey`, `TPageParam`\> +() => [`CreateInfiniteQueryOptions`](../../interfaces/createinfinitequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\> A function that returns infinite query options. @@ -197,7 +197,3 @@ A function that returns infinite query options. ### Param Additional configuration. - -### Defined in - -[inject-infinite-query.ts:92](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L92) diff --git a/docs/framework/angular/reference/functions/injectisfetching.md b/docs/framework/angular/reference/functions/injectisfetching.md index acd90757c5..7b9b55d8e4 100644 --- a/docs/framework/angular/reference/functions/injectisfetching.md +++ b/docs/framework/angular/reference/functions/injectisfetching.md @@ -3,12 +3,16 @@ id: injectIsFetching title: injectIsFetching --- + + # Function: injectIsFetching() ```ts function injectIsFetching(filters?, options?): Signal ``` +Defined in: [inject-is-fetching.ts:32](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L32) + Injects a signal that tracks the number of queries that your application is loading or fetching in the background. @@ -33,7 +37,3 @@ Additional configuration `Signal`\<`number`\> signal with number of loading or fetching queries. - -## Defined in - -[inject-is-fetching.ts:32](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L32) diff --git a/docs/framework/angular/reference/functions/injectismutating.md b/docs/framework/angular/reference/functions/injectismutating.md index 7ee99e51ab..2772bff553 100644 --- a/docs/framework/angular/reference/functions/injectismutating.md +++ b/docs/framework/angular/reference/functions/injectismutating.md @@ -3,12 +3,16 @@ id: injectIsMutating title: injectIsMutating --- + + # Function: injectIsMutating() ```ts function injectIsMutating(filters?, options?): Signal ``` +Defined in: [inject-is-mutating.ts:30](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L30) + Injects a signal that tracks the number of mutations that your application is fetching. Can be used for app-wide loading indicators @@ -32,7 +36,3 @@ Additional configuration `Signal`\<`number`\> signal with number of fetching mutations. - -## Defined in - -[inject-is-mutating.ts:31](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L31) diff --git a/docs/framework/angular/reference/functions/injectisrestoring.md b/docs/framework/angular/reference/functions/injectisrestoring.md index abc69d04bd..2ff91278df 100644 --- a/docs/framework/angular/reference/functions/injectisrestoring.md +++ b/docs/framework/angular/reference/functions/injectisrestoring.md @@ -3,12 +3,16 @@ id: injectIsRestoring title: injectIsRestoring --- + + # Function: injectIsRestoring() ```ts function injectIsRestoring(options?): Signal ``` +Defined in: [inject-is-restoring.ts:32](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L32) + Injects a signal that tracks whether a restore is currently in progress. [injectQuery](../injectquery.md) and friends also check this internally to avoid race conditions between the restore and initializing queries. ## Parameters @@ -23,8 +27,4 @@ Options for injectIsRestoring. `Signal`\<`boolean`\> -signal with boolean that indicates whether a restore is in progress. - -## Defined in - -[inject-is-restoring.ts:35](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L35) +readonly signal with boolean that indicates whether a restore is in progress. diff --git a/docs/framework/angular/reference/functions/injectmutation.md b/docs/framework/angular/reference/functions/injectmutation.md index 6711e90c85..8b21565850 100644 --- a/docs/framework/angular/reference/functions/injectmutation.md +++ b/docs/framework/angular/reference/functions/injectmutation.md @@ -3,6 +3,8 @@ id: injectMutation title: injectMutation --- + + # Function: injectMutation() ```ts @@ -12,6 +14,8 @@ function injectMutation( ): CreateMutationResult ``` +Defined in: [inject-mutation.ts:41](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L41) + Injects a mutation: an imperative function that can be invoked which typically performs server side effects. Unlike queries, mutations are not run automatically. @@ -45,7 +49,3 @@ Additional configuration [`CreateMutationResult`](../../type-aliases/createmutationresult.md)\<`TData`, `TError`, `TVariables`, `TContext`\> The mutation. - -## Defined in - -[inject-mutation.ts:42](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L42) diff --git a/docs/framework/angular/reference/functions/injectmutationstate.md b/docs/framework/angular/reference/functions/injectmutationstate.md index 16e31386fc..15aef3c9ff 100644 --- a/docs/framework/angular/reference/functions/injectmutationstate.md +++ b/docs/framework/angular/reference/functions/injectmutationstate.md @@ -3,6 +3,8 @@ id: injectMutationState title: injectMutationState --- + + # Function: injectMutationState() ```ts @@ -12,6 +14,8 @@ function injectMutationState( ): Signal ``` +Defined in: [inject-mutation-state.ts:60](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L60) + Injects a signal that tracks the state of all mutations. ## Type Parameters @@ -37,7 +41,3 @@ The Angular injector to use. `Signal`\<`TResult`[]\> The signal that tracks the state of all mutations. - -## Defined in - -[inject-mutation-state.ts:64](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L64) diff --git a/docs/framework/angular/reference/functions/injectqueries.md b/docs/framework/angular/reference/functions/injectqueries.md index 326e4faf2c..13c72fc06d 100644 --- a/docs/framework/angular/reference/functions/injectqueries.md +++ b/docs/framework/angular/reference/functions/injectqueries.md @@ -3,32 +3,36 @@ id: injectQueries title: injectQueries --- + + # Function: injectQueries() ```ts function injectQueries( - __namedParameters, + root0, injector?, ): Signal ``` +Defined in: [inject-queries.ts:202](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L202) + ## Type Parameters • **T** _extends_ `any`[] -• **TCombinedResult** = `T` _extends_ [] ? [] : `T` _extends_ [`Head`] ? [`GetResults`\<`Head`\>] : `T` _extends_ [`Head`, `...Tail[]`] ? [`...Tail[]`] _extends_ [] ? [] : [`...Tail[]`] _extends_ [`Head`] ? [`GetResults`\<`Head`\>, `GetResults`\<`Head`\>] : [`...Tail[]`] _extends_ [`Head`, `...Tail[]`] ? [`...Tail[]`] _extends_ [] ? [] : [`...Tail[]`] _extends_ [`Head`] ? [`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>] : [`...Tail[]`] _extends_ [`Head`, `...Tail[]`] ? [`...(...)[]`] _extends_ [] ? [] : ... _extends_ ... ? ... : ... : [`...(...)[]`] _extends_ ...[] ? ...[] : ...[] : [`...Tail[]`] _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] +• **TCombinedResult** = `T` _extends_ \[\] ? \[\] : `T` _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] _extends_ \[\] ? \[\] : ... _extends_ ... ? ... : ... : \[`...(...)[]`\] _extends_ ...[] ? ...[] : ...[] : \[`...Tail[]`\] _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] ## Parameters -### \_\_namedParameters +### root0 -#### combine +#### combine? (`result`) => `TCombinedResult` #### queries -`Signal`\<[`...(T extends [] ? [] : T extends [Head] ? [GetOptions] : T extends [Head, ...Tail[]] ? [...Tail[]] extends [] ? [] : [...Tail[]] extends [Head] ? [GetOptions, GetOptions] : [...Tail[]] extends [Head, ...Tail[]] ? [...(...)[]] extends [] ? [] : (...) extends (...) ? (...) : (...) : readonly (...)[] extends [...(...)[]] ? [...(...)[]] : (...) extends (...) ? (...) : (...) : readonly unknown[] extends T ? T : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverOptionsForCreateQueries[] : QueryObserverOptionsForCreateQueries[])[]`]\> +`Signal`\<\[`...(T extends [] ? [] : T extends [Head] ? [GetOptions] : T extends [Head, ...Tail[]] ? [...Tail[]] extends [] ? [] : [...Tail[]] extends [Head] ? [GetOptions, GetOptions] : [...Tail[]] extends [Head, ...Tail[]] ? [...(...)[]] extends [] ? [] : (...) extends (...) ? (...) : (...) : readonly (...)[] extends [...(...)[]] ? [...(...)[]] : (...) extends (...) ? (...) : (...) : readonly unknown[] extends T ? T : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverOptionsForCreateQueries[] : QueryObserverOptionsForCreateQueries[])[]`\]\> ### injector? @@ -37,7 +41,3 @@ function injectQueries( ## Returns `Signal`\<`TCombinedResult`\> - -## Defined in - -[inject-queries.ts:206](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L206) diff --git a/docs/framework/angular/reference/functions/injectquery.md b/docs/framework/angular/reference/functions/injectquery.md index 74a2c1ecf6..9500e7b7c6 100644 --- a/docs/framework/angular/reference/functions/injectquery.md +++ b/docs/framework/angular/reference/functions/injectquery.md @@ -3,6 +3,8 @@ id: injectQuery title: injectQuery --- + + # Function: injectQuery() Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. @@ -59,6 +61,8 @@ function injectQuery( ): DefinedCreateQueryResult ``` +Defined in: [inject-query.ts:65](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L65) + Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** @@ -140,10 +144,6 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries https://tanstack.com/query/latest/docs/framework/angular/guides/queries -### Defined in - -[inject-query.ts:66](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L66) - ## Call Signature ```ts @@ -153,6 +153,8 @@ function injectQuery( ): CreateQueryResult ``` +Defined in: [inject-query.ts:116](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L116) + Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** @@ -234,10 +236,6 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries https://tanstack.com/query/latest/docs/framework/angular/guides/queries -### Defined in - -[inject-query.ts:118](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L118) - ## Call Signature ```ts @@ -247,6 +245,8 @@ function injectQuery( ): CreateQueryResult ``` +Defined in: [inject-query.ts:167](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L167) + Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** @@ -327,7 +327,3 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ### See https://tanstack.com/query/latest/docs/framework/angular/guides/queries - -### Defined in - -[inject-query.ts:170](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L170) diff --git a/docs/framework/angular/reference/functions/injectqueryclient.md b/docs/framework/angular/reference/functions/injectqueryclient.md index fbe1a39573..bf4a0651f7 100644 --- a/docs/framework/angular/reference/functions/injectqueryclient.md +++ b/docs/framework/angular/reference/functions/injectqueryclient.md @@ -3,12 +3,16 @@ id: injectQueryClient title: injectQueryClient --- + + # Function: ~~injectQueryClient()~~ ```ts function injectQueryClient(injectOptions): QueryClient ``` +Defined in: [inject-query-client.ts:18](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query-client.ts#L18) + Injects a `QueryClient` instance and allows passing a custom injector. ## Parameters @@ -35,7 +39,3 @@ If you need to get a `QueryClient` from a custom injector, use `injector.get(Que ```ts const queryClient = injectQueryClient() ``` - -## Defined in - -[inject-query-client.ts:19](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query-client.ts#L19) diff --git a/docs/framework/angular/reference/functions/mutationoptions.md b/docs/framework/angular/reference/functions/mutationoptions.md index ff7377df57..d5fe0674d3 100644 --- a/docs/framework/angular/reference/functions/mutationoptions.md +++ b/docs/framework/angular/reference/functions/mutationoptions.md @@ -3,6 +3,8 @@ id: mutationOptions title: mutationOptions --- + + # Function: mutationOptions() ```ts @@ -11,6 +13,8 @@ function mutationOptions( ): CreateMutationOptions ``` +Defined in: [mutation-options.ts:37](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L37) + Allows to share and re-use mutation options in a type-safe way. **Example** @@ -61,7 +65,3 @@ The mutation options. [`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\> Mutation options. - -## Defined in - -[mutation-options.ts:38](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L38) diff --git a/docs/framework/angular/reference/functions/provideangularquery.md b/docs/framework/angular/reference/functions/provideangularquery.md new file mode 100644 index 0000000000..895e0e9057 --- /dev/null +++ b/docs/framework/angular/reference/functions/provideangularquery.md @@ -0,0 +1,40 @@ +--- +id: provideAngularQuery +title: provideAngularQuery +--- + + + +# Function: ~~provideAngularQuery()~~ + +```ts +function provideAngularQuery(queryClient): Provider[] +``` + +Defined in: [providers.ts:124](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L124) + +Sets up providers necessary to enable TanStack Query functionality for Angular applications. + +Allows to configure a `QueryClient`. + +## Parameters + +### queryClient + +`QueryClient` + +A `QueryClient` instance. + +## Returns + +`Provider`[] + +A set of providers to set up TanStack Query. + +## See + +https://tanstack.com/query/v5/docs/framework/angular/quick-start + +## Deprecated + +Use `provideTanStackQuery` instead. diff --git a/docs/framework/angular/reference/functions/provideisrestoring.md b/docs/framework/angular/reference/functions/provideisrestoring.md index a920e0b6a2..e3e72ad3f5 100644 --- a/docs/framework/angular/reference/functions/provideisrestoring.md +++ b/docs/framework/angular/reference/functions/provideisrestoring.md @@ -3,12 +3,16 @@ id: provideIsRestoring title: provideIsRestoring --- + + # Function: provideIsRestoring() ```ts function provideIsRestoring(isRestoring): Provider ``` +Defined in: [inject-is-restoring.ts:43](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L43) + Used by TanStack Query Angular persist client plugin to provide the signal that tracks the restore state ## Parameters @@ -24,7 +28,3 @@ a readonly signal that returns a boolean `Provider` Provider for the `isRestoring` signal - -## Defined in - -[inject-is-restoring.ts:47](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L47) diff --git a/docs/framework/angular/reference/functions/providequeryclient.md b/docs/framework/angular/reference/functions/providequeryclient.md index 8c67ee34fa..80e3944641 100644 --- a/docs/framework/angular/reference/functions/providequeryclient.md +++ b/docs/framework/angular/reference/functions/providequeryclient.md @@ -3,12 +3,16 @@ id: provideQueryClient title: provideQueryClient --- + + # Function: provideQueryClient() ```ts function provideQueryClient(queryClient): Provider ``` +Defined in: [providers.ts:14](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L14) + Usually [provideTanStackQuery](../providetanstackquery.md) is used once to set up TanStack Query and the [https://tanstack.com/query/latest/docs/reference/QueryClient\|QueryClient](https://tanstack.com/query/latest/docs/reference/QueryClient|QueryClient) for the entire application. Internally it calls `provideQueryClient`. @@ -28,7 +32,3 @@ A `QueryClient` instance, or an `InjectionToken` which provides a `QueryClient`. `Provider` a provider object that can be used to provide the `QueryClient` instance. - -## Defined in - -[providers.ts:31](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L31) diff --git a/docs/framework/angular/reference/functions/providetanstackquery.md b/docs/framework/angular/reference/functions/providetanstackquery.md index 3c83ce2bb6..74d1f3c33b 100644 --- a/docs/framework/angular/reference/functions/providetanstackquery.md +++ b/docs/framework/angular/reference/functions/providetanstackquery.md @@ -3,12 +3,16 @@ id: provideTanStackQuery title: provideTanStackQuery --- + + # Function: provideTanStackQuery() ```ts function provideTanStackQuery(queryClient, ...features): Provider[] ``` +Defined in: [providers.ts:105](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L105) + Sets up providers necessary to enable TanStack Query functionality for Angular applications. Allows to configure a `QueryClient` and optional features such as developer tools. @@ -73,6 +77,11 @@ export const MY_QUERY_CLIENT = new InjectionToken('', { providers: [provideTanStackQuery(MY_QUERY_CLIENT)] ``` +Using an InjectionToken for the QueryClient is an advanced optimization which allows TanStack Query to be absent from the main application bundle. +This can be beneficial if you want to include TanStack Query on lazy loaded routes only while still sharing a `QueryClient`. + +Note that this is a small optimization and for most applications it's preferable to provide the `QueryClient` in the main application config. + ## Parameters ### queryClient @@ -97,7 +106,3 @@ A set of providers to set up TanStack Query. - https://tanstack.com/query/v5/docs/framework/angular/quick-start - withDevtools - -## Defined in - -[providers.ts:118](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L118) diff --git a/docs/framework/angular/reference/functions/queryfeature.md b/docs/framework/angular/reference/functions/queryfeature.md index 78d71ca0aa..7f5679a937 100644 --- a/docs/framework/angular/reference/functions/queryfeature.md +++ b/docs/framework/angular/reference/functions/queryfeature.md @@ -3,17 +3,21 @@ id: queryFeature title: queryFeature --- + + # Function: queryFeature() ```ts function queryFeature(kind, providers): QueryFeature ``` +Defined in: [providers.ts:146](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L146) + Helper function to create an object that represents a Query feature. ## Type Parameters -• **TFeatureKind** _extends_ `"DeveloperTools"` \| `"PersistQueryClient"` +• **TFeatureKind** _extends_ `"Devtools"` \| `"PersistQueryClient"` ## Parameters @@ -30,7 +34,3 @@ Helper function to create an object that represents a Query feature. [`QueryFeature`](../../interfaces/queryfeature.md)\<`TFeatureKind`\> A Query feature. - -## Defined in - -[providers.ts:156](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L156) diff --git a/docs/framework/angular/reference/functions/queryoptions.md b/docs/framework/angular/reference/functions/queryoptions.md index 27627d7672..06112cd4c8 100644 --- a/docs/framework/angular/reference/functions/queryoptions.md +++ b/docs/framework/angular/reference/functions/queryoptions.md @@ -3,6 +3,8 @@ id: queryOptions title: queryOptions --- + + # Function: queryOptions() Allows to share and re-use query options in a type-safe way. @@ -32,9 +34,13 @@ The query options to tag with the type from `queryFn`. ```ts function queryOptions( options, -): DefinedInitialDataOptions & object +): Omit, 'queryFn'> & + object & + object ``` +Defined in: [query-options.ts:76](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L76) + Allows to share and re-use query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -73,7 +79,7 @@ The query options to tag with the type from `queryFn`. ### Returns -[`DefinedInitialDataOptions`](../../type-aliases/definedinitialdataoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` +`Omit`\<[`CreateQueryOptions`](../../interfaces/createqueryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>, `"queryFn"`\> & `object` & `object` The tagged query options. @@ -83,18 +89,21 @@ The tagged query options. The query options to tag with the type from `queryFn`. -### Defined in - -[query-options.ts:78](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L78) - ## Call Signature ```ts function queryOptions( options, -): UnusedSkipTokenOptions & object +): OmitKeyof< + CreateQueryOptions, + 'queryFn' +> & + object & + object ``` +Defined in: [query-options.ts:108](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L108) + Allows to share and re-use query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -133,7 +142,7 @@ The query options to tag with the type from `queryFn`. ### Returns -[`UnusedSkipTokenOptions`](../../type-aliases/unusedskiptokenoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` +`OmitKeyof`\<[`CreateQueryOptions`](../../interfaces/createqueryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\>, `"queryFn"`\> & `object` & `object` The tagged query options. @@ -143,18 +152,16 @@ The tagged query options. The query options to tag with the type from `queryFn`. -### Defined in - -[query-options.ts:111](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L111) - ## Call Signature ```ts function queryOptions( options, -): UndefinedInitialDataOptions & object +): CreateQueryOptions & object & object ``` +Defined in: [query-options.ts:140](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L140) + Allows to share and re-use query options in a type-safe way. The `queryKey` will be tagged with the type from `queryFn`. @@ -193,7 +200,7 @@ The query options to tag with the type from `queryFn`. ### Returns -[`UndefinedInitialDataOptions`](../../type-aliases/undefinedinitialdataoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` +[`CreateQueryOptions`](../../interfaces/createqueryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`\> & `object` & `object` The tagged query options. @@ -202,7 +209,3 @@ The tagged query options. ### Param The query options to tag with the type from `queryFn`. - -### Defined in - -[query-options.ts:144](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L144) diff --git a/docs/framework/angular/reference/functions/withdevtools.md b/docs/framework/angular/reference/functions/withdevtools.md deleted file mode 100644 index b5e4e14d00..0000000000 --- a/docs/framework/angular/reference/functions/withdevtools.md +++ /dev/null @@ -1,49 +0,0 @@ ---- -id: withDevtools -title: withDevtools ---- - -# Function: withDevtools() - -```ts -function withDevtools(withDevtoolsFn?): DevtoolsFeature -``` - -Enables developer tools. - -**Example** - -```ts -export const appConfig: ApplicationConfig = { - providers: [provideTanStackQuery(new QueryClient(), withDevtools())], -} -``` - -By default the devtools will be loaded when Angular runs in development mode and rendered in ``. - -If you need more control over when devtools are loaded, you can use the `loadDevtools` option. This is particularly useful if you want to load devtools based on environment configurations. For instance, you might have a test environment running in production mode but still require devtools to be available. - -If you need more control over where devtools are rendered, consider `injectDevtoolsPanel`. This allows rendering devtools inside your own devtools for example. - -## Parameters - -### withDevtoolsFn? - -() => [`DevtoolsOptions`](../../interfaces/devtoolsoptions.md) - -A function that returns `DevtoolsOptions`. - -## Returns - -[`DevtoolsFeature`](../../type-aliases/developertoolsfeature.md) - -A set of providers for use with `provideTanStackQuery`. - -## See - -- [provideTanStackQuery](../providetanstackquery.md) -- [DevtoolsOptions](../../interfaces/devtoolsoptions.md) - -## Defined in - -[providers.ts:262](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L262) diff --git a/docs/framework/angular/reference/index.md b/docs/framework/angular/reference/index.md index 8dd0081367..d9d29d1e6a 100644 --- a/docs/framework/angular/reference/index.md +++ b/docs/framework/angular/reference/index.md @@ -3,6 +3,8 @@ id: '@tanstack/angular-query-experimental' title: '@tanstack/angular-query-experimental' --- + + # @tanstack/angular-query-experimental ## Interfaces @@ -13,7 +15,6 @@ title: '@tanstack/angular-query-experimental' - [CreateInfiniteQueryOptions](../interfaces/createinfinitequeryoptions.md) - [CreateMutationOptions](../interfaces/createmutationoptions.md) - [CreateQueryOptions](../interfaces/createqueryoptions.md) -- [DevtoolsOptions](../interfaces/devtoolsoptions.md) - [InjectInfiniteQueryOptions](../interfaces/injectinfinitequeryoptions.md) - [InjectIsFetchingOptions](../interfaces/injectisfetchingoptions.md) - [InjectIsMutatingOptions](../interfaces/injectismutatingoptions.md) @@ -35,21 +36,16 @@ title: '@tanstack/angular-query-experimental' - [DefinedCreateQueryResult](../type-aliases/definedcreatequeryresult.md) - [DefinedInitialDataInfiniteOptions](../type-aliases/definedinitialdatainfiniteoptions.md) - [DefinedInitialDataOptions](../type-aliases/definedinitialdataoptions.md) -- [DevtoolsFeature](../type-aliases/developertoolsfeature.md) +- [DeveloperToolsFeature](../type-aliases/developertoolsfeature.md) - [PersistQueryClientFeature](../type-aliases/persistqueryclientfeature.md) - [QueriesOptions](../type-aliases/queriesoptions.md) - [QueriesResults](../type-aliases/queriesresults.md) -- [QueryFeatureKind](../type-aliases/queryfeaturekind.md) - [QueryFeatures](../type-aliases/queryfeatures.md) - [UndefinedInitialDataInfiniteOptions](../type-aliases/undefinedinitialdatainfiniteoptions.md) - [UndefinedInitialDataOptions](../type-aliases/undefinedinitialdataoptions.md) - [UnusedSkipTokenInfiniteOptions](../type-aliases/unusedskiptokeninfiniteoptions.md) - [UnusedSkipTokenOptions](../type-aliases/unusedskiptokenoptions.md) -## Variables - -- [queryFeatures](../variables/queryfeatures.md) - ## Functions - [infiniteQueryOptions](../functions/infinitequeryoptions.md) @@ -61,11 +57,11 @@ title: '@tanstack/angular-query-experimental' - [injectMutationState](../functions/injectmutationstate.md) - [injectQueries](../functions/injectqueries.md) - [injectQuery](../functions/injectquery.md) -- [injectQueryClient](../functions/injectqueryclient.md) +- [~~injectQueryClient~~](../functions/injectqueryclient.md) - [mutationOptions](../functions/mutationoptions.md) +- [~~provideAngularQuery~~](../functions/provideangularquery.md) - [provideIsRestoring](../functions/provideisrestoring.md) - [provideQueryClient](../functions/providequeryclient.md) - [provideTanStackQuery](../functions/providetanstackquery.md) - [queryFeature](../functions/queryfeature.md) - [queryOptions](../functions/queryoptions.md) -- [withDevtools](../functions/withdevtools.md) diff --git a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md index b81171eaf6..45bd112776 100644 --- a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md +++ b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md @@ -3,8 +3,12 @@ id: BaseMutationNarrowing title: BaseMutationNarrowing --- + + # Interface: BaseMutationNarrowing\ +Defined in: [types.ts:172](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L172) + ## Type Parameters • **TData** = `unknown` @@ -41,9 +45,7 @@ isError: SignalFunction< > ``` -#### Defined in - -[types.ts:242](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L242) +Defined in: [types.ts:195](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L195) --- @@ -71,9 +73,7 @@ isIdle: SignalFunction< > ``` -#### Defined in - -[types.ts:276](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L276) +Defined in: [types.ts:229](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L229) --- @@ -101,9 +101,7 @@ isPending: SignalFunction< > ``` -#### Defined in - -[types.ts:259](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L259) +Defined in: [types.ts:212](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L212) --- @@ -131,6 +129,4 @@ isSuccess: SignalFunction< > ``` -#### Defined in - -[types.ts:225](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L225) +Defined in: [types.ts:178](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L178) diff --git a/docs/framework/angular/reference/interfaces/basequerynarrowing.md b/docs/framework/angular/reference/interfaces/basequerynarrowing.md index bd1d7bee2a..c714b191a8 100644 --- a/docs/framework/angular/reference/interfaces/basequerynarrowing.md +++ b/docs/framework/angular/reference/interfaces/basequerynarrowing.md @@ -3,8 +3,12 @@ id: BaseQueryNarrowing title: BaseQueryNarrowing --- + + # Interface: BaseQueryNarrowing\ +Defined in: [types.ts:56](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L56) + ## Type Parameters • **TData** = `unknown` @@ -19,20 +23,18 @@ title: BaseQueryNarrowing isError: (this) => this is CreateBaseQueryResult>; ``` +Defined in: [types.ts:64](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L64) + #### Parameters ##### this -[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`, `QueryObserverResult`\<`TData`, `TError`\>\> +[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`\> #### Returns `this is CreateBaseQueryResult>` -#### Defined in - -[types.ts:76](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L76) - --- ### isPending() @@ -41,20 +43,18 @@ isError: (this) => this is CreateBaseQueryResult this is CreateBaseQueryResult>; ``` +Defined in: [types.ts:71](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L71) + #### Parameters ##### this -[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`, `QueryObserverResult`\<`TData`, `TError`\>\> +[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`\> #### Returns `this is CreateBaseQueryResult>` -#### Defined in - -[types.ts:83](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L83) - --- ### isSuccess() @@ -63,16 +63,14 @@ isPending: (this) => this is CreateBaseQueryResult this is CreateBaseQueryResult>; ``` +Defined in: [types.ts:57](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L57) + #### Parameters ##### this -[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`, `QueryObserverResult`\<`TData`, `TError`\>\> +[`CreateBaseQueryResult`](../../type-aliases/createbasequeryresult.md)\<`TData`, `TError`\> #### Returns `this is CreateBaseQueryResult>` - -#### Defined in - -[types.ts:69](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L69) diff --git a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md index c371959980..01cfa93c69 100644 --- a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md @@ -3,8 +3,12 @@ id: CreateBaseQueryOptions title: CreateBaseQueryOptions --- + + # Interface: CreateBaseQueryOptions\ +Defined in: [types.ts:20](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L20) + ## Extends - `QueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`\> diff --git a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md index dade8e1e30..cb996fec9e 100644 --- a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md @@ -3,11 +3,15 @@ id: CreateInfiniteQueryOptions title: CreateInfiniteQueryOptions --- -# Interface: CreateInfiniteQueryOptions\ + + +# Interface: CreateInfiniteQueryOptions\ + +Defined in: [types.ts:80](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L80) ## Extends -- `OmitKeyof`\<`InfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryData`, `TQueryKey`, `TPageParam`\>, `"suspense"`\> +- `OmitKeyof`\<`InfiniteQueryObserverOptions`\<`TQueryFnData`, `TError`, `TData`, `TQueryKey`, `TPageParam`\>, `"suspense"`\> ## Type Parameters @@ -17,8 +21,6 @@ title: CreateInfiniteQueryOptions • **TData** = `TQueryFnData` -• **TQueryData** = `TQueryFnData` - • **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/interfaces/createmutationoptions.md b/docs/framework/angular/reference/interfaces/createmutationoptions.md index ffca256828..0c59141103 100644 --- a/docs/framework/angular/reference/interfaces/createmutationoptions.md +++ b/docs/framework/angular/reference/interfaces/createmutationoptions.md @@ -3,8 +3,12 @@ id: CreateMutationOptions title: CreateMutationOptions --- + + # Interface: CreateMutationOptions\ +Defined in: [mutation-options.ts:48](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L48) + ## Extends - `OmitKeyof`\<`MutationObserverOptions`\<`TData`, `TError`, `TVariables`, `TContext`\>, `"_defaulted"`\> diff --git a/docs/framework/angular/reference/interfaces/createqueryoptions.md b/docs/framework/angular/reference/interfaces/createqueryoptions.md index 372319f6d4..a11f9d314f 100644 --- a/docs/framework/angular/reference/interfaces/createqueryoptions.md +++ b/docs/framework/angular/reference/interfaces/createqueryoptions.md @@ -3,8 +3,12 @@ id: CreateQueryOptions title: CreateQueryOptions --- + + # Interface: CreateQueryOptions\ +Defined in: [types.ts:34](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L34) + ## Extends - `OmitKeyof`\<[`CreateBaseQueryOptions`](../createbasequeryoptions.md)\<`TQueryFnData`, `TError`, `TData`, `TQueryFnData`, `TQueryKey`\>, `"suspense"`\> diff --git a/docs/framework/angular/reference/interfaces/devtoolsoptions.md b/docs/framework/angular/reference/interfaces/devtoolsoptions.md deleted file mode 100644 index 0eccac40a8..0000000000 --- a/docs/framework/angular/reference/interfaces/devtoolsoptions.md +++ /dev/null @@ -1,143 +0,0 @@ ---- -id: DevtoolsOptions -title: DevtoolsOptions ---- - -# Interface: DevtoolsOptions - -Options for configuring the TanStack Query devtools. - -## Properties - -### buttonPosition? - -```ts -optional buttonPosition: DevtoolsButtonPosition; -``` - -The position of the TanStack logo to open and close the devtools panel. -`top-left` | `top-right` | `bottom-left` | `bottom-right` | `relative` -Defaults to `bottom-right`. - -#### Defined in - -[providers.ts:192](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L192) - ---- - -### client? - -```ts -optional client: QueryClient; -``` - -Custom instance of QueryClient - -#### Defined in - -[providers.ts:202](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L202) - ---- - -### errorTypes? - -```ts -optional errorTypes: DevtoolsErrorType[]; -``` - -Use this so you can define custom errors that can be shown in the devtools. - -#### Defined in - -[providers.ts:206](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L206) - ---- - -### initialIsOpen? - -```ts -optional initialIsOpen: boolean; -``` - -Set this true if you want the devtools to default to being open - -#### Defined in - -[providers.ts:186](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L186) - ---- - -### loadDevtools? - -```ts -optional loadDevtools: boolean | "auto"; -``` - -Whether the developer tools should load. - -- `auto`- (Default) Lazily loads devtools when in development mode. Skips loading in production mode. -- `true`- Always load the devtools, regardless of the environment. -- `false`- Never load the devtools, regardless of the environment. - -You can use `true` and `false` to override loading developer tools from an environment file. -For example, a test environment might run in production mode but you may want to load developer tools. - -Additionally, you can use a signal in the callback to dynamically load the devtools based on a condition. For example, -a signal created from a RxJS observable that listens for a keyboard shortcut. - -**Example** - -```ts -withDevtools(() => ({ - initialIsOpen: true, - loadDevtools: inject(ExampleService).loadDevtools(), -})) -``` - -#### Defined in - -[providers.ts:236](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L236) - ---- - -### position? - -```ts -optional position: DevtoolsPosition; -``` - -The position of the TanStack Query devtools panel. -`top` | `bottom` | `left` | `right` -Defaults to `bottom`. - -#### Defined in - -[providers.ts:198](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L198) - ---- - -### shadowDOMTarget? - -```ts -optional shadowDOMTarget: ShadowRoot; -``` - -Use this so you can attach the devtool's styles to a specific element in the DOM. - -#### Defined in - -[providers.ts:214](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L214) - ---- - -### styleNonce? - -```ts -optional styleNonce: string; -``` - -Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles. - -#### Defined in - -[providers.ts:210](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L210) diff --git a/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md b/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md index a1783d1f97..998a67981b 100644 --- a/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md @@ -3,8 +3,12 @@ id: InjectInfiniteQueryOptions title: InjectInfiniteQueryOptions --- + + # Interface: InjectInfiniteQueryOptions +Defined in: [inject-infinite-query.ts:25](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L25) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectInfiniteQueryOptions optional injector: Injector; ``` +Defined in: [inject-infinite-query.ts:31](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L31) + The `Injector` in which to create the infinite query. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-infinite-query.ts:31](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L31) diff --git a/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md b/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md index 55184b8053..58f1bec12a 100644 --- a/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md +++ b/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md @@ -3,8 +3,12 @@ id: InjectIsFetchingOptions title: InjectIsFetchingOptions --- + + # Interface: InjectIsFetchingOptions +Defined in: [inject-is-fetching.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L13) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectIsFetchingOptions optional injector: Injector; ``` +Defined in: [inject-is-fetching.ts:19](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L19) + The `Injector` in which to create the isFetching signal. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-is-fetching.ts:19](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L19) diff --git a/docs/framework/angular/reference/interfaces/injectismutatingoptions.md b/docs/framework/angular/reference/interfaces/injectismutatingoptions.md index daf4f69b66..eff218f898 100644 --- a/docs/framework/angular/reference/interfaces/injectismutatingoptions.md +++ b/docs/framework/angular/reference/interfaces/injectismutatingoptions.md @@ -3,8 +3,12 @@ id: InjectIsMutatingOptions title: InjectIsMutatingOptions --- + + # Interface: InjectIsMutatingOptions +Defined in: [inject-is-mutating.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L13) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectIsMutatingOptions optional injector: Injector; ``` +Defined in: [inject-is-mutating.ts:19](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L19) + The `Injector` in which to create the isMutating signal. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-is-mutating.ts:19](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L19) diff --git a/docs/framework/angular/reference/interfaces/injectmutationoptions.md b/docs/framework/angular/reference/interfaces/injectmutationoptions.md index 88dc930a57..7e72fc58e0 100644 --- a/docs/framework/angular/reference/interfaces/injectmutationoptions.md +++ b/docs/framework/angular/reference/interfaces/injectmutationoptions.md @@ -3,8 +3,12 @@ id: InjectMutationOptions title: InjectMutationOptions --- + + # Interface: InjectMutationOptions +Defined in: [inject-mutation.ts:24](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L24) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectMutationOptions optional injector: Injector; ``` +Defined in: [inject-mutation.ts:30](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L30) + The `Injector` in which to create the mutation. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-mutation.ts:30](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L30) diff --git a/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md b/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md index 253f8cea32..1a6bbedbf0 100644 --- a/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md +++ b/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md @@ -3,8 +3,12 @@ id: InjectMutationStateOptions title: InjectMutationStateOptions --- + + # Interface: InjectMutationStateOptions +Defined in: [inject-mutation-state.ts:45](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L45) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectMutationStateOptions optional injector: Injector; ``` +Defined in: [inject-mutation-state.ts:51](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L51) + The `Injector` in which to create the mutation state signal. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-mutation-state.ts:54](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L54) diff --git a/docs/framework/angular/reference/interfaces/injectqueryoptions.md b/docs/framework/angular/reference/interfaces/injectqueryoptions.md index 202354d583..7f1139166a 100644 --- a/docs/framework/angular/reference/interfaces/injectqueryoptions.md +++ b/docs/framework/angular/reference/interfaces/injectqueryoptions.md @@ -3,8 +3,12 @@ id: InjectQueryOptions title: InjectQueryOptions --- + + # Interface: InjectQueryOptions +Defined in: [inject-query.ts:20](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L20) + ## Properties ### injector? @@ -13,10 +17,8 @@ title: InjectQueryOptions optional injector: Injector; ``` +Defined in: [inject-query.ts:26](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L26) + The `Injector` in which to create the query. If this is not provided, the current injection context will be used instead (via `inject`). - -#### Defined in - -[inject-query.ts:26](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L26) diff --git a/docs/framework/angular/reference/interfaces/queryfeature.md b/docs/framework/angular/reference/interfaces/queryfeature.md index c0c3e15028..1c63ce3b59 100644 --- a/docs/framework/angular/reference/interfaces/queryfeature.md +++ b/docs/framework/angular/reference/interfaces/queryfeature.md @@ -3,13 +3,17 @@ id: QueryFeature title: QueryFeature --- + + # Interface: QueryFeature\ +Defined in: [providers.ts:135](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L135) + Helper type to represent a Query feature. ## Type Parameters -• **TFeatureKind** _extends_ [`QueryFeatureKind`](../../type-aliases/queryfeaturekind.md) +• **TFeatureKind** _extends_ `QueryFeatureKind` ## Properties @@ -19,9 +23,7 @@ Helper type to represent a Query feature. ɵkind: TFeatureKind ``` -#### Defined in - -[providers.ts:146](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L146) +Defined in: [providers.ts:136](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L136) --- @@ -31,6 +33,4 @@ Helper type to represent a Query feature. ɵproviders: Provider[]; ``` -#### Defined in - -[providers.ts:147](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L147) +Defined in: [providers.ts:137](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L137) diff --git a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md index 5c05660689..a30685661d 100644 --- a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md @@ -3,6 +3,8 @@ id: CreateBaseMutationResult title: CreateBaseMutationResult --- + + # Type Alias: CreateBaseMutationResult\ ```ts @@ -15,6 +17,8 @@ type CreateBaseMutationResult = Override< object ``` +Defined in: [types.ts:147](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L147) + ## Type declaration ### mutateAsync @@ -32,7 +36,3 @@ mutateAsync: CreateMutateAsyncFunction • **TVariables** = `unknown` • **TContext** = `unknown` - -## Defined in - -[types.ts:188](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L188) diff --git a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md index f8b5b1d147..5991242592 100644 --- a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md @@ -3,6 +3,8 @@ id: CreateBaseQueryResult title: CreateBaseQueryResult --- + + # Type Alias: CreateBaseQueryResult\ ```ts @@ -13,6 +15,8 @@ type CreateBaseQueryResult = BaseQueryNarrowing< MapToSignals> ``` +Defined in: [types.ts:97](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L97) + ## Type Parameters • **TData** = `unknown` @@ -20,7 +24,3 @@ type CreateBaseQueryResult = BaseQueryNarrowing< • **TError** = `DefaultError` • **TState** = `QueryObserverResult`\<`TData`, `TError`\> - -## Defined in - -[types.ts:117](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L117) diff --git a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md index 4f38c46f78..d9fa3e8c5a 100644 --- a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md @@ -3,6 +3,8 @@ id: CreateInfiniteQueryResult title: CreateInfiniteQueryResult --- + + # Type Alias: CreateInfiniteQueryResult\ ```ts @@ -13,12 +15,10 @@ type CreateInfiniteQueryResult = BaseQueryNarrowing< MapToSignals> ``` +Defined in: [types.ts:116](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L116) + ## Type Parameters • **TData** = `unknown` • **TError** = `DefaultError` - -## Defined in - -[types.ts:145](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L145) diff --git a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md index 789f636025..bf0ede2500 100644 --- a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md @@ -3,6 +3,8 @@ id: CreateMutateAsyncFunction title: CreateMutateAsyncFunction --- + + # Type Alias: CreateMutateAsyncFunction\ ```ts @@ -10,6 +12,8 @@ type CreateMutateAsyncFunction = MutateFunction ``` +Defined in: [types.ts:140](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L140) + ## Type Parameters • **TData** = `unknown` @@ -19,7 +23,3 @@ type CreateMutateAsyncFunction = • **TVariables** = `void` • **TContext** = `unknown` - -## Defined in - -[types.ts:178](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L178) diff --git a/docs/framework/angular/reference/type-aliases/createmutatefunction.md b/docs/framework/angular/reference/type-aliases/createmutatefunction.md index 006ab2ae9a..8bdd4cde58 100644 --- a/docs/framework/angular/reference/type-aliases/createmutatefunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutatefunction.md @@ -3,6 +3,8 @@ id: CreateMutateFunction title: CreateMutateFunction --- + + # Type Alias: CreateMutateFunction()\ ```ts @@ -11,6 +13,8 @@ type CreateMutateFunction = ( ) => void ``` +Defined in: [types.ts:131](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L131) + ## Type Parameters • **TData** = `unknown` @@ -30,7 +34,3 @@ type CreateMutateFunction = ( ## Returns `void` - -## Defined in - -[types.ts:166](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L166) diff --git a/docs/framework/angular/reference/type-aliases/createmutationresult.md b/docs/framework/angular/reference/type-aliases/createmutationresult.md index 3306bbe436..8475de0b03 100644 --- a/docs/framework/angular/reference/type-aliases/createmutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createmutationresult.md @@ -3,6 +3,8 @@ id: CreateMutationResult title: CreateMutationResult --- + + # Type Alias: CreateMutationResult\ ```ts @@ -11,6 +13,8 @@ type CreateMutationResult = MapToSignals> ``` +Defined in: [types.ts:248](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L248) + ## Type Parameters • **TData** = `unknown` @@ -22,7 +26,3 @@ type CreateMutationResult = • **TContext** = `unknown` • **TState** = `CreateStatusBasedMutationResult`\<[`CreateBaseMutationResult`](../createbasemutationresult.md)\[`"status"`\], `TData`, `TError`, `TVariables`, `TContext`\> - -## Defined in - -[types.ts:298](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L298) diff --git a/docs/framework/angular/reference/type-aliases/createqueryresult.md b/docs/framework/angular/reference/type-aliases/createqueryresult.md index 78ada66abc..3e5aec14aa 100644 --- a/docs/framework/angular/reference/type-aliases/createqueryresult.md +++ b/docs/framework/angular/reference/type-aliases/createqueryresult.md @@ -3,18 +3,18 @@ id: CreateQueryResult title: CreateQueryResult --- + + # Type Alias: CreateQueryResult\ ```ts type CreateQueryResult = CreateBaseQueryResult ``` +Defined in: [types.ts:104](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L104) + ## Type Parameters • **TData** = `unknown` • **TError** = `DefaultError` - -## Defined in - -[types.ts:127](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L127) diff --git a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md index 77ae3e35ec..613583207b 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md @@ -3,6 +3,8 @@ id: DefinedCreateInfiniteQueryResult title: DefinedCreateInfiniteQueryResult --- + + # Type Alias: DefinedCreateInfiniteQueryResult\ ```ts @@ -13,6 +15,8 @@ type DefinedCreateInfiniteQueryResult< > = MapToSignals ``` +Defined in: [types.ts:122](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L122) + ## Type Parameters • **TData** = `unknown` @@ -20,7 +24,3 @@ type DefinedCreateInfiniteQueryResult< • **TError** = `DefaultError` • **TDefinedInfiniteQueryObserver** = `DefinedInfiniteQueryObserverResult`\<`TData`, `TError`\> - -## Defined in - -[types.ts:154](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L154) diff --git a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md index abf57a2b9d..c5296dd763 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md @@ -3,6 +3,8 @@ id: DefinedCreateQueryResult title: DefinedCreateQueryResult --- + + # Type Alias: DefinedCreateQueryResult\ ```ts @@ -13,6 +15,8 @@ type DefinedCreateQueryResult = BaseQueryNarrowing< MapToSignals> ``` +Defined in: [types.ts:109](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L109) + ## Type Parameters • **TData** = `unknown` @@ -20,7 +24,3 @@ type DefinedCreateQueryResult = BaseQueryNarrowing< • **TError** = `DefaultError` • **TState** = `DefinedQueryObserverResult`\<`TData`, `TError`\> - -## Defined in - -[types.ts:135](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L135) diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md index 83ec9cc092..8752d6fb07 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md @@ -3,6 +3,8 @@ id: DefinedInitialDataInfiniteOptions title: DefinedInitialDataInfiniteOptions --- + + # Type Alias: DefinedInitialDataInfiniteOptions\ ```ts @@ -16,13 +18,14 @@ type DefinedInitialDataInfiniteOptions< TQueryFnData, TError, TData, - TQueryFnData, TQueryKey, TPageParam > & object ``` +Defined in: [infinite-query-options.ts:62](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L62) + ## Type declaration ### initialData @@ -45,7 +48,3 @@ initialData: • **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` - -## Defined in - -[infinite-query-options.ts:66](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L66) diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md index 742efded7e..722cb6ff9a 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md @@ -3,6 +3,8 @@ id: DefinedInitialDataOptions title: DefinedInitialDataOptions --- + + # Type Alias: DefinedInitialDataOptions\ ```ts @@ -13,6 +15,8 @@ type DefinedInitialDataOptions = Omit< object ``` +Defined in: [query-options.ts:40](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L40) + ## Type declaration ### initialData @@ -38,7 +42,3 @@ optional queryFn: QueryFunction; • **TData** = `TQueryFnData` • **TQueryKey** _extends_ `QueryKey` = `QueryKey` - -## Defined in - -[query-options.ts:41](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L41) diff --git a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md index 72c1227bd8..f6350504d3 100644 --- a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md +++ b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md @@ -1,21 +1,21 @@ --- -id: DevtoolsFeature -title: DevtoolsFeature +id: DeveloperToolsFeature +title: DeveloperToolsFeature --- -# Type Alias: DevtoolsFeature + + +# Type Alias: DeveloperToolsFeature ```ts -type DevtoolsFeature = QueryFeature<'DeveloperTools'> +type DeveloperToolsFeature = QueryFeature<'Devtools'> ``` +Defined in: [providers.ts:158](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L158) + A type alias that represents a feature which enables developer tools. The type is used to describe the return value of the `withDevtools` function. ## See -[withDevtools](../../functions/withdevtools.md) - -## Defined in - -[providers.ts:169](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L169) +withDevtools diff --git a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md index 18682f7f48..cb9e559e31 100644 --- a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md +++ b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md @@ -3,15 +3,15 @@ id: PersistQueryClientFeature title: PersistQueryClientFeature --- + + # Type Alias: PersistQueryClientFeature ```ts type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'> ``` +Defined in: [providers.ts:164](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L164) + A type alias that represents a feature which enables persistence. The type is used to describe the return value of the `withPersistQueryClient` function. - -## Defined in - -[providers.ts:176](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L176) diff --git a/docs/framework/angular/reference/type-aliases/queriesoptions.md b/docs/framework/angular/reference/type-aliases/queriesoptions.md index a9b1e1645c..0c92d95b7e 100644 --- a/docs/framework/angular/reference/type-aliases/queriesoptions.md +++ b/docs/framework/angular/reference/type-aliases/queriesoptions.md @@ -3,6 +3,8 @@ id: QueriesOptions title: QueriesOptions --- + + # Type Alias: QueriesOptions\ ```ts @@ -35,16 +37,14 @@ type QueriesOptions = TDepth['length'] extends MAXIMUM_DEPTH : QueryObserverOptionsForCreateQueries[] ``` +Defined in: [inject-queries.ts:120](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L120) + QueriesOptions reducer recursively unwraps function arguments to infer/enforce type param ## Type Parameters • **T** _extends_ `any`[] -• **TResult** _extends_ `any`[] = [] - -• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = [] - -## Defined in +• **TResult** _extends_ `any`[] = \[\] -[inject-queries.ts:121](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L121) +• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queriesresults.md b/docs/framework/angular/reference/type-aliases/queriesresults.md index 687bbb8d2b..05fe2aca98 100644 --- a/docs/framework/angular/reference/type-aliases/queriesresults.md +++ b/docs/framework/angular/reference/type-aliases/queriesresults.md @@ -3,6 +3,8 @@ id: QueriesResults title: QueriesResults --- + + # Type Alias: QueriesResults\ ```ts @@ -31,16 +33,14 @@ type QueriesResults = TDepth['length'] extends MAXIMUM_DEPTH : QueryObserverResult[] ``` +Defined in: [inject-queries.ts:162](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L162) + QueriesResults reducer recursively maps type param to results ## Type Parameters • **T** _extends_ `any`[] -• **TResult** _extends_ `any`[] = [] - -• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = [] - -## Defined in +• **TResult** _extends_ `any`[] = \[\] -[inject-queries.ts:164](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L164) +• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queryfeaturekind.md b/docs/framework/angular/reference/type-aliases/queryfeaturekind.md deleted file mode 100644 index 6b45969712..0000000000 --- a/docs/framework/angular/reference/type-aliases/queryfeaturekind.md +++ /dev/null @@ -1,14 +0,0 @@ ---- -id: QueryFeatureKind -title: QueryFeatureKind ---- - -# Type Alias: QueryFeatureKind - -```ts -type QueryFeatureKind = (typeof queryFeatures)[number] -``` - -## Defined in - -[providers.ts:369](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L369) diff --git a/docs/framework/angular/reference/type-aliases/queryfeatures.md b/docs/framework/angular/reference/type-aliases/queryfeatures.md index 8278758878..ec55b4949a 100644 --- a/docs/framework/angular/reference/type-aliases/queryfeatures.md +++ b/docs/framework/angular/reference/type-aliases/queryfeatures.md @@ -3,12 +3,16 @@ id: QueryFeatures title: QueryFeatures --- + + # Type Alias: QueryFeatures ```ts -type QueryFeatures = DevtoolsFeature | PersistQueryClientFeature +type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature ``` +Defined in: [providers.ts:173](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L173) + A type alias that represents all Query features available for use with `provideTanStackQuery`. Features can be enabled by adding special functions to the `provideTanStackQuery` call. See documentation for each symbol to find corresponding function name. See also `provideTanStackQuery` @@ -17,7 +21,3 @@ documentation on how to use those functions. ## See [provideTanStackQuery](../../functions/providetanstackquery.md) - -## Defined in - -[providers.ts:365](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L365) diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md index 88c03a01ff..877b3aea72 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md @@ -3,6 +3,8 @@ id: UndefinedInitialDataInfiniteOptions title: UndefinedInitialDataInfiniteOptions --- + + # Type Alias: UndefinedInitialDataInfiniteOptions\ ```ts @@ -16,13 +18,14 @@ type UndefinedInitialDataInfiniteOptions< TQueryFnData, TError, TData, - TQueryFnData, TQueryKey, TPageParam > & object ``` +Defined in: [infinite-query-options.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L13) + ## Type declaration ### initialData? @@ -44,7 +47,3 @@ optional initialData: • **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` - -## Defined in - -[infinite-query-options.ts:12](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L12) diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md index ec360cc9bd..6af7540324 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md @@ -3,6 +3,8 @@ id: UndefinedInitialDataOptions title: UndefinedInitialDataOptions --- + + # Type Alias: UndefinedInitialDataOptions\ ```ts @@ -10,6 +12,8 @@ type UndefinedInitialDataOptions = CreateQueryOptions & object ``` +Defined in: [query-options.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L13) + ## Type declaration ### initialData? @@ -29,7 +33,3 @@ optional initialData: • **TData** = `TQueryFnData` • **TQueryKey** _extends_ `QueryKey` = `QueryKey` - -## Defined in - -[query-options.ts:12](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L12) diff --git a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md index c03412d5cb..d76009d0d9 100644 --- a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md @@ -3,6 +3,8 @@ id: UnusedSkipTokenInfiniteOptions title: UnusedSkipTokenInfiniteOptions --- + + # Type Alias: UnusedSkipTokenInfiniteOptions\ ```ts @@ -17,7 +19,6 @@ type UnusedSkipTokenInfiniteOptions< TQueryFnData, TError, TData, - TQueryFnData, TQueryKey, TPageParam >, @@ -26,12 +27,14 @@ type UnusedSkipTokenInfiniteOptions< object ``` +Defined in: [infinite-query-options.ts:34](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L34) + ## Type declaration ### queryFn? ```ts -optional queryFn: Exclude["queryFn"], SkipToken | undefined>; +optional queryFn: Exclude["queryFn"], SkipToken | undefined>; ``` ## Type Parameters @@ -45,7 +48,3 @@ optional queryFn: Exclude + # Type Alias: UnusedSkipTokenOptions\ ```ts @@ -13,6 +15,8 @@ type UnusedSkipTokenOptions = OmitKeyof< object ``` +Defined in: [query-options.ts:25](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L25) + ## Type declaration ### queryFn? @@ -30,7 +34,3 @@ optional queryFn: Exclude) => DevtoolsOptions export type WithDevtools = ( withDevtoolsFn?: WithDevtoolsFn, options?: WithDevtoolsOptions, -) => DevtoolsFeature +) => DeveloperToolsFeature diff --git a/packages/angular-query-experimental/src/index.ts b/packages/angular-query-experimental/src/index.ts index edc45c9b6a..18689be07b 100644 --- a/packages/angular-query-experimental/src/index.ts +++ b/packages/angular-query-experimental/src/index.ts @@ -48,7 +48,7 @@ export { injectQuery } from './inject-query' export { injectQueryClient } from './inject-query-client' export type { - DevtoolsFeature, + DeveloperToolsFeature, PersistQueryClientFeature, QueryFeature, QueryFeatures, diff --git a/packages/angular-query-experimental/src/providers.ts b/packages/angular-query-experimental/src/providers.ts index 076d76d0c3..3473c2affb 100644 --- a/packages/angular-query-experimental/src/providers.ts +++ b/packages/angular-query-experimental/src/providers.ts @@ -155,7 +155,7 @@ export function queryFeature( * The type is used to describe the return value of the `withDevtools` function. * @see {@link withDevtools} */ -export type DevtoolsFeature = QueryFeature<'Devtools'> +export type DeveloperToolsFeature = QueryFeature<'Devtools'> /** * A type alias that represents a feature which enables persistence. @@ -170,4 +170,4 @@ export type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'> * documentation on how to use those functions. * @see {@link provideTanStackQuery} */ -export type QueryFeatures = DevtoolsFeature | PersistQueryClientFeature +export type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature From a05c217a2d8da3add8e2f84c408aaff59aba07ba Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 1 Aug 2025 20:31:14 +0200 Subject: [PATCH 12/24] type declarations in correct directory --- packages/angular-query-experimental/package.json | 8 ++++---- packages/angular-query-experimental/vite.config.ts | 3 +-- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index f76332eeaf..bac25d5285 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -57,21 +57,21 @@ }, "./package.json": "./package.json", "./devtools": { - "types": "./dist/types/devtools/index.d.ts", + "types": "./dist/devtools/index.d.ts", "development": "./dist/devtools/index.mjs", "default": "./dist/devtools/stub.mjs" }, "./devtools/production": { - "types": "./dist/types/devtools/production/index.d.ts", + "types": "./dist/devtools/production/index.d.ts", "default": "./dist/devtools/index.mjs" }, "./devtools-panel": { - "types": "./dist/types/devtools-panel/index.d.ts", + "types": "./dist/devtools-panel/index.d.ts", "development": "./dist/devtools-panel/index.mjs", "default": "./dist/devtools-panel/stub.mjs" }, "./devtools-panel/production": { - "types": "./dist/types/devtools-panel/production/index.d.ts", + "types": "./dist/devtools-panel/production/index.d.ts", "default": "./dist/devtools-panel/index.mjs" } }, diff --git a/packages/angular-query-experimental/vite.config.ts b/packages/angular-query-experimental/vite.config.ts index e1a794e38b..1f107dad22 100644 --- a/packages/angular-query-experimental/vite.config.ts +++ b/packages/angular-query-experimental/vite.config.ts @@ -52,7 +52,6 @@ const config = defineConfig({ }) // copy from @tanstack/config/vite with changes: -// - dts outDir: dist/types // - build - lib - fileName: [name.mjs] // - rollup - output - preserveModulesRoot: src export const tanstackViteConfig = (options: Options) => { @@ -66,7 +65,7 @@ export const tanstackViteConfig = (options: Options) => { projects: options.tsconfigPath ? [options.tsconfigPath] : undefined, }), dts({ - outDir: `dist/types`, + outDir, entryRoot: options.srcDir, include: options.srcDir, exclude: options.exclude, From 4f148ebb71d2c0c28890c8a9335aaf28e5cb258d Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Mon, 4 Aug 2025 17:11:49 +0200 Subject: [PATCH 13/24] Update documentation --- docs/framework/angular/devtools.md | 10 +++++++--- .../angular-query-experimental/src/devtools/types.ts | 4 ++++ .../src/devtools/with-devtools.ts | 2 +- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/docs/framework/angular/devtools.md b/docs/framework/angular/devtools.md index a8204e0172..4c469cfb43 100644 --- a/docs/framework/angular/devtools.md +++ b/docs/framework/angular/devtools.md @@ -34,7 +34,7 @@ To use `withDevtools` in production builds, import using the `production` sub-pa import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' ``` -To control when devtools are loaded, you can use the `loadDevtools` option. This is particularly useful if you want to load devtools based on environment configurations or user interaction. For instance, you might have a test environment running in production mode but still require devtools to be available. +To control when devtools are loaded, you can use the `loadDevtools` option. When not setting the option or setting it to 'auto', the devtools will be loaded automatically when Angular runs in development mode. @@ -52,15 +52,16 @@ provideTanStackQuery( When setting the option to true, the devtools will be loaded in both development and production mode. -This is particularly useful if you want to load devtools based on environment configurations. E.g. you could set this to true either when `isDevMode()` is true or when the application is running on your production build staging environment. +This is useful if you want to load devtools based on [Angular environment configurations](https://angular.dev/tools/cli/environments). E.g. you could set this to true when the application is running on your production build staging environment. ```ts +import { environment } from './environments/environment' // Make sure to use the production sub-path to load devtools in production builds import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' provideTanStackQuery( new QueryClient(), - withDevtools(() => ({ loadDevtools: true })), + withDevtools(() => ({ loadDevtools: environment.loadDevtools })), ) ``` @@ -110,6 +111,7 @@ This is similar to `deps` in Angular's [`useFactory`](https://angular.dev/guide/ ```ts // ... +// 👇 Note we import from the production sub-path to enable devtools lazy loading in production builds import { withDevtools } from '@tanstack/angular-query-experimental/devtools/production' export const appConfig: ApplicationConfig = { @@ -156,3 +158,5 @@ Of these options `loadDevtools`, `client`, `position`, `errorTypes`, `buttonPosi - `shadowDOMTarget?: ShadowRoot` - Default behavior will apply the devtool's styles to the head tag within the DOM. - Use this to pass a shadow DOM target to the devtools so that the styles will be applied within the shadow DOM instead of within the head tag in the light DOM. +- `hideDisabledQueries?: boolean` + - Set this to true to hide disabled queries from the devtools panel. diff --git a/packages/angular-query-experimental/src/devtools/types.ts b/packages/angular-query-experimental/src/devtools/types.ts index 0ea9b9691a..8ab243b97a 100644 --- a/packages/angular-query-experimental/src/devtools/types.ts +++ b/packages/angular-query-experimental/src/devtools/types.ts @@ -71,6 +71,10 @@ export interface DevtoolsOptions { * Use this so you can attach the devtool's styles to a specific element in the DOM. */ shadowDOMTarget?: ShadowRoot + /** + * Set this to true to hide disabled queries from the devtools panel. + */ + hideDisabledQueries?: boolean /** * Whether the developer tools should load. diff --git a/packages/angular-query-experimental/src/devtools/with-devtools.ts b/packages/angular-query-experimental/src/devtools/with-devtools.ts index 1212804442..1267676c7f 100644 --- a/packages/angular-query-experimental/src/devtools/with-devtools.ts +++ b/packages/angular-query-experimental/src/devtools/with-devtools.ts @@ -147,7 +147,7 @@ export const withDevtools: WithDevtools = ( // Create devtools import('@tanstack/query-devtools').then((queryDevtools) => { - // As this code runs async, injector can be destroyed in the meantime + // As this code runs async, the injector could have been destroyed if (injectorIsDestroyed) return devtools = new queryDevtools.TanstackQueryDevtools({ From 9df1e24a0f4c06d5b0eb781b1540a99a386ba2e2 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Mon, 4 Aug 2025 17:36:33 +0200 Subject: [PATCH 14/24] knip config --- docs/framework/angular/guides/query-cancellation.md | 2 +- knip.json | 3 --- 2 files changed, 1 insertion(+), 4 deletions(-) diff --git a/docs/framework/angular/guides/query-cancellation.md b/docs/framework/angular/guides/query-cancellation.md index e0d108da67..5775b828b9 100644 --- a/docs/framework/angular/guides/query-cancellation.md +++ b/docs/framework/angular/guides/query-cancellation.md @@ -60,7 +60,7 @@ query = injectQuery(() => ({ [//]: # 'Example3' -```tsx +```ts import axios from 'axios' const query = injectQuery(() => ({ diff --git a/knip.json b/knip.json index 9bba39b1cc..7b5fc71e3b 100644 --- a/knip.json +++ b/knip.json @@ -25,10 +25,7 @@ }, "packages/angular-query-experimental": { "entry": [ - "src/index.ts", - "src/devtools/index.ts", "src/devtools/production/index.ts", - "src/devtools-panel/index.ts", "src/devtools-panel/production/index.ts" ] } From 34323dae1cc30994d91eb57b95d1269ee1746860 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Tue, 2 Sep 2025 22:25:12 +0200 Subject: [PATCH 15/24] Optional core devtools dependency --- .../angular-query-experimental/package.json | 6 ++- .../__tests__/inject-devtools-panel.test.ts | 32 +++++++++++---- .../devtools-panel/inject-devtools-panel.ts | 39 +++++++++++------- .../src/devtools/with-devtools.ts | 41 +++++++++++-------- pnpm-lock.yaml | 7 ++-- 5 files changed, 81 insertions(+), 44 deletions(-) diff --git a/packages/angular-query-experimental/package.json b/packages/angular-query-experimental/package.json index 93b63025e6..a63401cef4 100644 --- a/packages/angular-query-experimental/package.json +++ b/packages/angular-query-experimental/package.json @@ -82,8 +82,7 @@ "**/*.mjs.map" ], "dependencies": { - "@tanstack/query-core": "workspace:*", - "@tanstack/query-devtools": "workspace:*" + "@tanstack/query-core": "workspace:*" }, "devDependencies": { "@angular/common": "^20.0.0", @@ -97,6 +96,9 @@ "vite-plugin-externalize-deps": "^0.9.0", "vite-tsconfig-paths": "^5.1.4" }, + "optionalDependencies": { + "@tanstack/query-devtools": "workspace:*" + }, "peerDependencies": { "@angular/common": ">=16.0.0", "@angular/core": ">=16.0.0" diff --git a/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts b/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts index b18d2a3b34..7368deb32e 100644 --- a/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts +++ b/packages/angular-query-experimental/src/__tests__/inject-devtools-panel.test.ts @@ -31,6 +31,12 @@ describe('injectDevtoolsPanel', () => { let queryClient: QueryClient let mockElementRef: ElementRef + const waitForDevtoolsToBeCreated = async () => { + await vi.waitFor(() => { + expect(mocks.mockTanstackQueryDevtoolsPanel).toHaveBeenCalledTimes(1) + }) + } + beforeEach(() => { queryClient = new QueryClient() mockElementRef = new ElementRef(document.createElement('div')) @@ -59,7 +65,7 @@ describe('injectDevtoolsPanel', () => { }) }) - it('should initialize TanstackQueryDevtoolsPanel', () => { + it('should initialize TanstackQueryDevtoolsPanel', async () => { TestBed.runInInjectionContext(() => { injectDevtoolsPanel(() => ({ hostElement: TestBed.inject(ElementRef), @@ -68,10 +74,12 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() - expect(mocks.mockTanstackQueryDevtoolsPanel).toHaveBeenCalledTimes(1) + await waitForDevtoolsToBeCreated() + + expect(mockDevtoolsPanelInstance.mount).toHaveBeenCalledTimes(1) }) - it('should destroy TanstackQueryDevtoolsPanel', () => { + it('should destroy TanstackQueryDevtoolsPanel', async () => { const result = TestBed.runInInjectionContext(() => { return injectDevtoolsPanel(() => ({ hostElement: TestBed.inject(ElementRef), @@ -80,12 +88,14 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() + await waitForDevtoolsToBeCreated() + result.destroy() expect(mockDevtoolsPanelInstance.unmount).toHaveBeenCalledTimes(1) }) - it('should destroy TanstackQueryDevtoolsPanel when hostElement is removed', () => { + it('should destroy TanstackQueryDevtoolsPanel when hostElement is removed', async () => { const hostElement = signal(mockElementRef) TestBed.runInInjectionContext(() => { @@ -96,6 +106,8 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() + await waitForDevtoolsToBeCreated() + expect(mockDevtoolsPanelInstance.unmount).toHaveBeenCalledTimes(0) hostElement.set(null as unknown as ElementRef) @@ -105,7 +117,7 @@ describe('injectDevtoolsPanel', () => { expect(mockDevtoolsPanelInstance.unmount).toHaveBeenCalledTimes(1) }) - it('should update client', () => { + it('should update client', async () => { const client = signal(new QueryClient()) TestBed.runInInjectionContext(() => { @@ -117,6 +129,8 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() + await waitForDevtoolsToBeCreated() + expect(mockDevtoolsPanelInstance.setClient).toHaveBeenCalledTimes(0) client.set(new QueryClient()) @@ -126,7 +140,7 @@ describe('injectDevtoolsPanel', () => { expect(mockDevtoolsPanelInstance.setClient).toHaveBeenCalledTimes(1) }) - it('should update error types', () => { + it('should update error types', async () => { const errorTypes = signal([]) TestBed.runInInjectionContext(() => { @@ -138,6 +152,8 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() + await waitForDevtoolsToBeCreated() + expect(mockDevtoolsPanelInstance.setErrorTypes).toHaveBeenCalledTimes(0) errorTypes.set([]) @@ -147,7 +163,7 @@ describe('injectDevtoolsPanel', () => { expect(mockDevtoolsPanelInstance.setErrorTypes).toHaveBeenCalledTimes(1) }) - it('should update onclose', () => { + it('should update onclose', async () => { const functionA = () => {} const functionB = () => {} @@ -162,6 +178,8 @@ describe('injectDevtoolsPanel', () => { TestBed.tick() + await waitForDevtoolsToBeCreated() + expect(mockDevtoolsPanelInstance.setOnClose).toHaveBeenCalledTimes(0) onClose.set(functionB) diff --git a/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts b/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts index 71ac82e5ad..94aaa185ca 100644 --- a/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts +++ b/packages/angular-query-experimental/src/devtools-panel/inject-devtools-panel.ts @@ -9,9 +9,9 @@ import { runInInjectionContext, untracked, } from '@angular/core' -import { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools' import { QueryClient, onlineManager } from '@tanstack/query-core' import { isPlatformBrowser } from '@angular/common' +import type { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools' import type { DevtoolsPanelOptions, InjectDevtoolsPanel, @@ -68,20 +68,29 @@ export const injectDevtoolsPanel: InjectDevtoolsPanel = ( untracked(() => { if (!client) throw new Error('No QueryClient found') if (!devtools && hostElement) { - devtools = new TanstackQueryDevtoolsPanel({ - client, - queryFlavor: 'Angular Query', - version: '5', - buttonPosition: 'bottom-left', - position: 'bottom', - initialIsOpen: true, - errorTypes, - styleNonce, - shadowDOMTarget, - onClose, - onlineManager, - }) - devtools.mount(hostElement.nativeElement) + import('@tanstack/query-devtools') + .then((queryDevtools) => { + devtools = new queryDevtools.TanstackQueryDevtoolsPanel({ + client, + queryFlavor: 'Angular Query', + version: '5', + buttonPosition: 'bottom-left', + position: 'bottom', + initialIsOpen: true, + errorTypes, + styleNonce, + shadowDOMTarget, + onClose, + onlineManager, + }) + devtools.mount(hostElement.nativeElement) + }) + .catch((error) => { + console.error( + 'Install @tanstack/query-devtools or reinstall without --omit=optional.', + error, + ) + }) } else if (devtools && hostElement) { devtools.setClient(client) devtools.setErrorTypes(errorTypes) diff --git a/packages/angular-query-experimental/src/devtools/with-devtools.ts b/packages/angular-query-experimental/src/devtools/with-devtools.ts index 1267676c7f..23806c3ea7 100644 --- a/packages/angular-query-experimental/src/devtools/with-devtools.ts +++ b/packages/angular-query-experimental/src/devtools/with-devtools.ts @@ -146,24 +146,31 @@ export const withDevtools: WithDevtools = ( } // Create devtools - import('@tanstack/query-devtools').then((queryDevtools) => { - // As this code runs async, the injector could have been destroyed - if (injectorIsDestroyed) return - - devtools = new queryDevtools.TanstackQueryDevtools({ - ...devtoolsOptions(), - client: getResolvedQueryClient(), - queryFlavor: 'Angular Query', - version: '5', - onlineManager, + import('@tanstack/query-devtools') + .then((queryDevtools) => { + // As this code runs async, the injector could have been destroyed + if (injectorIsDestroyed) return + + devtools = new queryDevtools.TanstackQueryDevtools({ + ...devtoolsOptions(), + client: getResolvedQueryClient(), + queryFlavor: 'Angular Query', + version: '5', + onlineManager, + }) + + el = document.body.appendChild(document.createElement('div')) + el.classList.add('tsqd-parent-container') + devtools.mount(el) + + destroyRef.onDestroy(destroyDevtools) + }) + .catch((error) => { + console.error( + 'Install @tanstack/query-devtools or reinstall without --omit=optional.', + error + ) }) - - el = document.body.appendChild(document.createElement('div')) - el.classList.add('tsqd-parent-container') - devtools.mount(el) - - destroyRef.onDestroy(destroyDevtools) - }) }, { injector }, ) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a5b3630ee1..50bbf030c7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2244,9 +2244,6 @@ importers: '@tanstack/query-core': specifier: workspace:* version: link:../query-core - '@tanstack/query-devtools': - specifier: workspace:* - version: link:../query-devtools devDependencies: '@angular/common': specifier: ^20.0.0 @@ -2278,6 +2275,10 @@ importers: vite-tsconfig-paths: specifier: ^5.1.4 version: 5.1.4(typescript@5.8.3)(vite@6.3.5(@types/node@22.15.3)(jiti@2.4.2)(less@4.3.0)(lightningcss@1.29.2)(sass@1.88.0)(terser@5.39.1)(tsx@4.20.1)(yaml@2.8.0)) + optionalDependencies: + '@tanstack/query-devtools': + specifier: workspace:* + version: link:../query-devtools publishDirectory: dist packages/angular-query-persist-client: From 727d5dfaa303aa2be22e7ac7811406370a041c2d Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Tue, 2 Sep 2025 21:16:59 +0000 Subject: [PATCH 16/24] ci: apply automated fixes --- .../angular-query-experimental/src/devtools/with-devtools.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/angular-query-experimental/src/devtools/with-devtools.ts b/packages/angular-query-experimental/src/devtools/with-devtools.ts index 23806c3ea7..22ee80c1ca 100644 --- a/packages/angular-query-experimental/src/devtools/with-devtools.ts +++ b/packages/angular-query-experimental/src/devtools/with-devtools.ts @@ -168,7 +168,7 @@ export const withDevtools: WithDevtools = ( .catch((error) => { console.error( 'Install @tanstack/query-devtools or reinstall without --omit=optional.', - error + error, ) }) }, From a32e4c022466edc08234bee2de49c5ee0505fcc4 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 12 Sep 2025 16:20:07 +0200 Subject: [PATCH 17/24] regenerate api reference docs --- .../functions/infinitequeryoptions.md | 69 ++------- .../functions/injectinfinitequery.md | 39 ++---- .../reference/functions/injectisfetching.md | 2 +- .../reference/functions/injectismutating.md | 2 +- .../reference/functions/injectisrestoring.md | 2 +- .../reference/functions/injectmutation.md | 7 +- .../functions/injectmutationstate.md | 7 +- .../reference/functions/injectqueries.md | 11 +- .../reference/functions/injectquery.md | 35 ++--- .../reference/functions/injectqueryclient.md | 5 +- .../reference/functions/mutationoptions.md | 132 ++++++++++++++++-- .../functions/provideangularquery.md | 2 +- .../reference/functions/provideisrestoring.md | 2 +- .../reference/functions/providequeryclient.md | 2 +- .../functions/providetanstackquery.md | 8 +- .../reference/functions/queryfeature.md | 4 +- .../reference/functions/queryoptions.md | 103 ++++++-------- docs/framework/angular/reference/index.md | 4 +- .../interfaces/basemutationnarrowing.md | 96 ++----------- .../interfaces/basequerynarrowing.md | 12 +- .../interfaces/createbasequeryoptions.md | 4 +- .../interfaces/createinfinitequeryoptions.md | 4 +- .../interfaces/createmutationoptions.md | 2 +- .../interfaces/createqueryoptions.md | 4 +- .../interfaces/injectinfinitequeryoptions.md | 4 +- .../interfaces/injectisfetchingoptions.md | 4 +- .../interfaces/injectismutatingoptions.md | 4 +- .../interfaces/injectmutationoptions.md | 4 +- .../interfaces/injectmutationstateoptions.md | 4 +- .../interfaces/injectqueryoptions.md | 4 +- .../reference/interfaces/queryfeature.md | 12 +- .../type-aliases/createbasemutationresult.md | 14 +- .../type-aliases/createbasequeryresult.md | 8 +- .../type-aliases/createinfinitequeryresult.md | 8 +- .../type-aliases/createmutateasyncfunction.md | 5 +- .../type-aliases/createmutatefunction.md | 6 +- .../type-aliases/createmutationresult.md | 6 +- .../type-aliases/createqueryresult.md | 4 +- .../definedcreateinfinitequeryresult.md | 8 +- .../type-aliases/definedcreatequeryresult.md | 8 +- .../definedinitialdatainfiniteoptions.md | 21 +-- .../type-aliases/definedinitialdataoptions.md | 12 +- .../type-aliases/developertoolsfeature.md | 4 +- .../type-aliases/persistqueryclientfeature.md | 4 +- .../reference/type-aliases/queriesoptions.md | 36 +---- .../reference/type-aliases/queriesresults.md | 32 +---- .../reference/type-aliases/queryfeatures.md | 6 +- .../undefinedinitialdatainfiniteoptions.md | 21 +-- .../undefinedinitialdataoptions.md | 9 +- .../unusedskiptokeninfiniteoptions.md | 22 +-- .../type-aliases/unusedskiptokenoptions.md | 10 +- 51 files changed, 316 insertions(+), 522 deletions(-) diff --git a/docs/framework/angular/reference/functions/infinitequeryoptions.md b/docs/framework/angular/reference/functions/infinitequeryoptions.md index 872d55935b..ac83ec422c 100644 --- a/docs/framework/angular/reference/functions/infinitequeryoptions.md +++ b/docs/framework/angular/reference/functions/infinitequeryoptions.md @@ -18,26 +18,10 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->( - options, -): CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam -> & - object & - object +function infiniteQueryOptions(options): CreateInfiniteQueryOptions & object & object ``` -Defined in: [infinite-query-options.ts:88](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L88) +Defined in: [infinite-query-options.ts:88](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L88) Allows to share and re-use infinite query options in a type-safe way. @@ -51,7 +35,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -78,29 +62,10 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->( - options, -): OmitKeyof< - CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam - >, - 'queryFn' -> & - object & - object +function infiniteQueryOptions(options): OmitKeyof, "queryFn"> & object & object ``` -Defined in: [infinite-query-options.ts:119](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L119) +Defined in: [infinite-query-options.ts:119](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L119) Allows to share and re-use infinite query options in a type-safe way. @@ -114,7 +79,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -141,26 +106,10 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->( - options, -): CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam -> & - object & - object +function infiniteQueryOptions(options): CreateInfiniteQueryOptions & object & object ``` -Defined in: [infinite-query-options.ts:150](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L150) +Defined in: [infinite-query-options.ts:150](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L150) Allows to share and re-use infinite query options in a type-safe way. @@ -174,7 +123,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/functions/injectinfinitequery.md b/docs/framework/angular/reference/functions/injectinfinitequery.md index aa51ecaf7a..dc8a1d88da 100644 --- a/docs/framework/angular/reference/functions/injectinfinitequery.md +++ b/docs/framework/angular/reference/functions/injectinfinitequery.md @@ -21,19 +21,10 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->( - injectInfiniteQueryFn, - options?, -): DefinedCreateInfiniteQueryResult +function injectInfiniteQuery(injectInfiniteQueryFn, options?): DefinedCreateInfiniteQueryResult ``` -Defined in: [inject-infinite-query.ts:41](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L41) +Defined in: [inject-infinite-query.ts:41](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L41) Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -46,7 +37,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -83,16 +74,10 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult +function injectInfiniteQuery(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` -Defined in: [inject-infinite-query.ts:65](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L65) +Defined in: [inject-infinite-query.ts:65](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L65) Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -105,7 +90,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -142,16 +127,10 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, ->(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult +function injectInfiniteQuery(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` -Defined in: [inject-infinite-query.ts:89](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L89) +Defined in: [inject-infinite-query.ts:89](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L89) Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a unique key. Infinite queries can additively "load more" data onto an existing set of data or "infinite scroll" @@ -164,7 +143,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/functions/injectisfetching.md b/docs/framework/angular/reference/functions/injectisfetching.md index 7b9b55d8e4..14555e20a0 100644 --- a/docs/framework/angular/reference/functions/injectisfetching.md +++ b/docs/framework/angular/reference/functions/injectisfetching.md @@ -11,7 +11,7 @@ title: injectIsFetching function injectIsFetching(filters?, options?): Signal ``` -Defined in: [inject-is-fetching.ts:32](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L32) +Defined in: [inject-is-fetching.ts:32](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L32) Injects a signal that tracks the number of queries that your application is loading or fetching in the background. diff --git a/docs/framework/angular/reference/functions/injectismutating.md b/docs/framework/angular/reference/functions/injectismutating.md index 2772bff553..74b6bc31a1 100644 --- a/docs/framework/angular/reference/functions/injectismutating.md +++ b/docs/framework/angular/reference/functions/injectismutating.md @@ -11,7 +11,7 @@ title: injectIsMutating function injectIsMutating(filters?, options?): Signal ``` -Defined in: [inject-is-mutating.ts:30](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L30) +Defined in: [inject-is-mutating.ts:30](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L30) Injects a signal that tracks the number of mutations that your application is fetching. diff --git a/docs/framework/angular/reference/functions/injectisrestoring.md b/docs/framework/angular/reference/functions/injectisrestoring.md index 2ff91278df..dfae444b28 100644 --- a/docs/framework/angular/reference/functions/injectisrestoring.md +++ b/docs/framework/angular/reference/functions/injectisrestoring.md @@ -11,7 +11,7 @@ title: injectIsRestoring function injectIsRestoring(options?): Signal ``` -Defined in: [inject-is-restoring.ts:32](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L32) +Defined in: [inject-is-restoring.ts:32](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L32) Injects a signal that tracks whether a restore is currently in progress. [injectQuery](../injectquery.md) and friends also check this internally to avoid race conditions between the restore and initializing queries. diff --git a/docs/framework/angular/reference/functions/injectmutation.md b/docs/framework/angular/reference/functions/injectmutation.md index 8b21565850..e57110675d 100644 --- a/docs/framework/angular/reference/functions/injectmutation.md +++ b/docs/framework/angular/reference/functions/injectmutation.md @@ -8,13 +8,10 @@ title: injectMutation # Function: injectMutation() ```ts -function injectMutation( - injectMutationFn, - options?, -): CreateMutationResult +function injectMutation(injectMutationFn, options?): CreateMutationResult ``` -Defined in: [inject-mutation.ts:41](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L41) +Defined in: [inject-mutation.ts:44](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L44) Injects a mutation: an imperative function that can be invoked which typically performs server side effects. diff --git a/docs/framework/angular/reference/functions/injectmutationstate.md b/docs/framework/angular/reference/functions/injectmutationstate.md index 15aef3c9ff..2b37544ec4 100644 --- a/docs/framework/angular/reference/functions/injectmutationstate.md +++ b/docs/framework/angular/reference/functions/injectmutationstate.md @@ -8,13 +8,10 @@ title: injectMutationState # Function: injectMutationState() ```ts -function injectMutationState( - injectMutationStateFn, - options?, -): Signal +function injectMutationState(injectMutationStateFn, options?): Signal ``` -Defined in: [inject-mutation-state.ts:60](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L60) +Defined in: [inject-mutation-state.ts:60](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L60) Injects a signal that tracks the state of all mutations. diff --git a/docs/framework/angular/reference/functions/injectqueries.md b/docs/framework/angular/reference/functions/injectqueries.md index 13c72fc06d..9f91a84503 100644 --- a/docs/framework/angular/reference/functions/injectqueries.md +++ b/docs/framework/angular/reference/functions/injectqueries.md @@ -8,19 +8,16 @@ title: injectQueries # Function: injectQueries() ```ts -function injectQueries( - root0, - injector?, -): Signal +function injectQueries(root0, injector?): Signal ``` -Defined in: [inject-queries.ts:202](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L202) +Defined in: [inject-queries.ts:202](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L202) ## Type Parameters -• **T** _extends_ `any`[] +• **T** *extends* `any`[] -• **TCombinedResult** = `T` _extends_ \[\] ? \[\] : `T` _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] _extends_ \[\] ? \[\] : ... _extends_ ... ? ... : ... : \[`...(...)[]`\] _extends_ ...[] ? ...[] : ...[] : \[`...Tail[]`\] _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] +• **TCombinedResult** = `T` *extends* \[\] ? \[\] : `T` *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] *extends* \[\] ? \[\] : ... *extends* ... ? ... : ... : \[`...(...)[]`\] *extends* ...[] ? ...[] : ...[] : \[`...Tail[]`\] *extends* `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` *extends* `TData` ? `TQueryFnData` : `TData`, `unknown` *extends* `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` *extends* `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` *extends* `TData` ? `TQueryFnData` : `TData`, `unknown` *extends* `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] ## Parameters diff --git a/docs/framework/angular/reference/functions/injectquery.md b/docs/framework/angular/reference/functions/injectquery.md index 9500e7b7c6..c57f44e32e 100644 --- a/docs/framework/angular/reference/functions/injectquery.md +++ b/docs/framework/angular/reference/functions/injectquery.md @@ -10,7 +10,6 @@ title: injectQuery Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** - ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -26,7 +25,6 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** - ```ts class ServiceOrComponent { filter = signal('') @@ -55,18 +53,14 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery( - injectQueryFn, - options?, -): DefinedCreateQueryResult +function injectQuery(injectQueryFn, options?): DefinedCreateQueryResult ``` -Defined in: [inject-query.ts:65](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L65) +Defined in: [inject-query.ts:65](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L65) Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** - ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -82,7 +76,6 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** - ```ts class ServiceOrComponent { filter = signal('') @@ -104,7 +97,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -147,18 +140,14 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery( - injectQueryFn, - options?, -): CreateQueryResult +function injectQuery(injectQueryFn, options?): CreateQueryResult ``` -Defined in: [inject-query.ts:116](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L116) +Defined in: [inject-query.ts:116](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L116) Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** - ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -174,7 +163,6 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** - ```ts class ServiceOrComponent { filter = signal('') @@ -196,7 +184,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -239,18 +227,14 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery( - injectQueryFn, - options?, -): CreateQueryResult +function injectQuery(injectQueryFn, options?): CreateQueryResult ``` -Defined in: [inject-query.ts:167](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L167) +Defined in: [inject-query.ts:167](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L167) Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** - ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -266,7 +250,6 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** - ```ts class ServiceOrComponent { filter = signal('') @@ -288,7 +271,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters diff --git a/docs/framework/angular/reference/functions/injectqueryclient.md b/docs/framework/angular/reference/functions/injectqueryclient.md index bf4a0651f7..e036aedfba 100644 --- a/docs/framework/angular/reference/functions/injectqueryclient.md +++ b/docs/framework/angular/reference/functions/injectqueryclient.md @@ -11,7 +11,7 @@ title: injectQueryClient function injectQueryClient(injectOptions): QueryClient ``` -Defined in: [inject-query-client.ts:18](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query-client.ts#L18) +Defined in: [inject-query-client.ts:18](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query-client.ts#L18) Injects a `QueryClient` instance and allows passing a custom injector. @@ -35,7 +35,6 @@ Use `inject(QueryClient)` instead. If you need to get a `QueryClient` from a custom injector, use `injector.get(QueryClient)`. **Example** - ```ts -const queryClient = injectQueryClient() +const queryClient = injectQueryClient(); ``` diff --git a/docs/framework/angular/reference/functions/mutationoptions.md b/docs/framework/angular/reference/functions/mutationoptions.md index d5fe0674d3..a253e82fe8 100644 --- a/docs/framework/angular/reference/functions/mutationoptions.md +++ b/docs/framework/angular/reference/functions/mutationoptions.md @@ -7,13 +7,44 @@ title: mutationOptions # Function: mutationOptions() +Allows to share and re-use mutation options in a type-safe way. + +**Example** + ```ts -function mutationOptions( - options, -): CreateMutationOptions +export class QueriesService { + private http = inject(HttpClient); + + updatePost(id: number) { + return mutationOptions({ + mutationFn: (post: Post) => Promise.resolve(post), + mutationKey: ["updatePost", id], + onSuccess: (newPost) => { + // ^? newPost: Post + this.queryClient.setQueryData(["posts", id], newPost); + }, + }); + } +} + +queries = inject(QueriesService) +idSignal = new Signal(0); +mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) + +mutation.mutate({ title: 'New Title' }) ``` -Defined in: [mutation-options.ts:37](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L37) +## Param + +The mutation options. + +## Call Signature + +```ts +function mutationOptions(options): WithRequired, "mutationKey"> +``` + +Defined in: [mutation-options.ts:34](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L34) Allows to share and re-use mutation options in a type-safe way. @@ -21,28 +52,28 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient) + private http = inject(HttpClient); updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ['updatePost', id], + mutationKey: ["updatePost", id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(['posts', id], newPost) + this.queryClient.setQueryData(["posts", id], newPost); }, - }) + }); } } queries = inject(QueriesService) -idSignal = new Signal(0) +idSignal = new Signal(0); mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) mutation.mutate({ title: 'New Title' }) ``` -## Type Parameters +### Type Parameters • **TData** = `unknown` @@ -52,16 +83,87 @@ mutation.mutate({ title: 'New Title' }) • **TContext** = `unknown` -## Parameters +### Parameters -### options +#### options -`MutationObserverOptions`\<`TData`, `TError`, `TVariables`, `TContext`\> +`WithRequired`\<[`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\>, `"mutationKey"`\> The mutation options. -## Returns +### Returns -[`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\> +`WithRequired`\<[`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\>, `"mutationKey"`\> Mutation options. + +Mutation options. + +### Param + +The mutation options. + +## Call Signature + +```ts +function mutationOptions(options): Omit, "mutationKey"> +``` + +Defined in: [mutation-options.ts:48](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L48) + +Allows to share and re-use mutation options in a type-safe way. + +**Example** + +```ts +export class QueriesService { + private http = inject(HttpClient); + + updatePost(id: number) { + return mutationOptions({ + mutationFn: (post: Post) => Promise.resolve(post), + mutationKey: ["updatePost", id], + onSuccess: (newPost) => { + // ^? newPost: Post + this.queryClient.setQueryData(["posts", id], newPost); + }, + }); + } +} + +queries = inject(QueriesService) +idSignal = new Signal(0); +mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) + +mutation.mutate({ title: 'New Title' }) +``` + +### Type Parameters + +• **TData** = `unknown` + +• **TError** = `Error` + +• **TVariables** = `void` + +• **TContext** = `unknown` + +### Parameters + +#### options + +`Omit`\<[`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\>, `"mutationKey"`\> + +The mutation options. + +### Returns + +`Omit`\<[`CreateMutationOptions`](../../interfaces/createmutationoptions.md)\<`TData`, `TError`, `TVariables`, `TContext`\>, `"mutationKey"`\> + +Mutation options. + +Mutation options. + +### Param + +The mutation options. diff --git a/docs/framework/angular/reference/functions/provideangularquery.md b/docs/framework/angular/reference/functions/provideangularquery.md index 895e0e9057..dbd57559fe 100644 --- a/docs/framework/angular/reference/functions/provideangularquery.md +++ b/docs/framework/angular/reference/functions/provideangularquery.md @@ -11,7 +11,7 @@ title: provideAngularQuery function provideAngularQuery(queryClient): Provider[] ``` -Defined in: [providers.ts:124](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L124) +Defined in: [providers.ts:124](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L124) Sets up providers necessary to enable TanStack Query functionality for Angular applications. diff --git a/docs/framework/angular/reference/functions/provideisrestoring.md b/docs/framework/angular/reference/functions/provideisrestoring.md index e3e72ad3f5..ef5610b384 100644 --- a/docs/framework/angular/reference/functions/provideisrestoring.md +++ b/docs/framework/angular/reference/functions/provideisrestoring.md @@ -11,7 +11,7 @@ title: provideIsRestoring function provideIsRestoring(isRestoring): Provider ``` -Defined in: [inject-is-restoring.ts:43](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L43) +Defined in: [inject-is-restoring.ts:43](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-restoring.ts#L43) Used by TanStack Query Angular persist client plugin to provide the signal that tracks the restore state diff --git a/docs/framework/angular/reference/functions/providequeryclient.md b/docs/framework/angular/reference/functions/providequeryclient.md index 80e3944641..69dab5d6e3 100644 --- a/docs/framework/angular/reference/functions/providequeryclient.md +++ b/docs/framework/angular/reference/functions/providequeryclient.md @@ -11,7 +11,7 @@ title: provideQueryClient function provideQueryClient(queryClient): Provider ``` -Defined in: [providers.ts:14](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L14) +Defined in: [providers.ts:14](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L14) Usually [provideTanStackQuery](../providetanstackquery.md) is used once to set up TanStack Query and the [https://tanstack.com/query/latest/docs/reference/QueryClient\|QueryClient](https://tanstack.com/query/latest/docs/reference/QueryClient|QueryClient) diff --git a/docs/framework/angular/reference/functions/providetanstackquery.md b/docs/framework/angular/reference/functions/providetanstackquery.md index 74d1f3c33b..2a5a2070cb 100644 --- a/docs/framework/angular/reference/functions/providetanstackquery.md +++ b/docs/framework/angular/reference/functions/providetanstackquery.md @@ -11,7 +11,7 @@ title: provideTanStackQuery function provideTanStackQuery(queryClient, ...features): Provider[] ``` -Defined in: [providers.ts:105](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L105) +Defined in: [providers.ts:105](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L105) Sets up providers necessary to enable TanStack Query functionality for Angular applications. @@ -49,7 +49,6 @@ export class AppModule {} You can also enable optional developer tools by adding `withDevtools`. By default the tools will then be loaded when your app is in development mode. - ```ts import { provideTanStackQuery, @@ -76,7 +75,6 @@ export const MY_QUERY_CLIENT = new InjectionToken('', { // In a lazy loaded route or lazy loaded component's providers array: providers: [provideTanStackQuery(MY_QUERY_CLIENT)] ``` - Using an InjectionToken for the QueryClient is an advanced optimization which allows TanStack Query to be absent from the main application bundle. This can be beneficial if you want to include TanStack Query on lazy loaded routes only while still sharing a `QueryClient`. @@ -104,5 +102,5 @@ A set of providers to set up TanStack Query. ## See -- https://tanstack.com/query/v5/docs/framework/angular/quick-start -- withDevtools + - https://tanstack.com/query/v5/docs/framework/angular/quick-start + - withDevtools diff --git a/docs/framework/angular/reference/functions/queryfeature.md b/docs/framework/angular/reference/functions/queryfeature.md index 7f5679a937..46d7d72dd3 100644 --- a/docs/framework/angular/reference/functions/queryfeature.md +++ b/docs/framework/angular/reference/functions/queryfeature.md @@ -11,13 +11,13 @@ title: queryFeature function queryFeature(kind, providers): QueryFeature ``` -Defined in: [providers.ts:146](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L146) +Defined in: [providers.ts:146](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L146) Helper function to create an object that represents a Query feature. ## Type Parameters -• **TFeatureKind** _extends_ `"Devtools"` \| `"PersistQueryClient"` +• **TFeatureKind** *extends* `"Devtools"` \| `"PersistQueryClient"` ## Parameters diff --git a/docs/framework/angular/reference/functions/queryoptions.md b/docs/framework/angular/reference/functions/queryoptions.md index 06112cd4c8..25847f526a 100644 --- a/docs/framework/angular/reference/functions/queryoptions.md +++ b/docs/framework/angular/reference/functions/queryoptions.md @@ -14,15 +14,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts -const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise -}) - -const queryClient = new QueryClient() -const data = queryClient.getQueryData(queryKey) -// ^? number | undefined + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(queryKey) + // ^? number | undefined ``` ## Param @@ -32,14 +32,10 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions( - options, -): Omit, 'queryFn'> & - object & - object +function queryOptions(options): Omit, "queryFn"> & object & object ``` -Defined in: [query-options.ts:76](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L76) +Defined in: [query-options.ts:76](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L76) Allows to share and re-use query options in a type-safe way. @@ -48,15 +44,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts -const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise -}) - -const queryClient = new QueryClient() -const data = queryClient.getQueryData(queryKey) -// ^? number | undefined + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(queryKey) + // ^? number | undefined ``` ### Type Parameters @@ -67,7 +63,7 @@ const data = queryClient.getQueryData(queryKey) • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -92,17 +88,10 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions( - options, -): OmitKeyof< - CreateQueryOptions, - 'queryFn' -> & - object & - object +function queryOptions(options): OmitKeyof, "queryFn"> & object & object ``` -Defined in: [query-options.ts:108](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L108) +Defined in: [query-options.ts:108](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L108) Allows to share and re-use query options in a type-safe way. @@ -111,15 +100,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts -const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise -}) - -const queryClient = new QueryClient() -const data = queryClient.getQueryData(queryKey) -// ^? number | undefined + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(queryKey) + // ^? number | undefined ``` ### Type Parameters @@ -130,7 +119,7 @@ const data = queryClient.getQueryData(queryKey) • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -155,12 +144,10 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions( - options, -): CreateQueryOptions & object & object +function queryOptions(options): CreateQueryOptions & object & object ``` -Defined in: [query-options.ts:140](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L140) +Defined in: [query-options.ts:140](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L140) Allows to share and re-use query options in a type-safe way. @@ -169,15 +156,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts -const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise -}) - -const queryClient = new QueryClient() -const data = queryClient.getQueryData(queryKey) -// ^? number | undefined + const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise + }) + + const queryClient = new QueryClient() + const data = queryClient.getQueryData(queryKey) + // ^? number | undefined ``` ### Type Parameters @@ -188,7 +175,7 @@ const data = queryClient.getQueryData(queryKey) • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] ### Parameters diff --git a/docs/framework/angular/reference/index.md b/docs/framework/angular/reference/index.md index d9d29d1e6a..f06745a8d5 100644 --- a/docs/framework/angular/reference/index.md +++ b/docs/framework/angular/reference/index.md @@ -1,6 +1,6 @@ --- -id: '@tanstack/angular-query-experimental' -title: '@tanstack/angular-query-experimental' +id: "@tanstack/angular-query-experimental" +title: "@tanstack/angular-query-experimental" --- diff --git a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md index 45bd112776..b007103464 100644 --- a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md +++ b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md @@ -7,7 +7,7 @@ title: BaseMutationNarrowing # Interface: BaseMutationNarrowing\ -Defined in: [types.ts:172](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L172) +Defined in: [types.ts:183](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L183) ## Type Parameters @@ -24,109 +24,37 @@ Defined in: [types.ts:172](https://github.com/arnoud-dv/query/blob/main/packages ### isError ```ts -isError: SignalFunction< - (this) => this is CreateMutationResult< - TData, - TError, - TVariables, - TContext, - Override< - MutationObserverErrorResult, - { mutate: CreateMutateFunction } - > & { - mutateAsync: CreateMutateAsyncFunction< - TData, - TError, - TVariables, - TContext - > - } - > -> +isError: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; ``` -Defined in: [types.ts:195](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L195) +Defined in: [types.ts:206](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L206) ---- +*** ### isIdle ```ts -isIdle: SignalFunction< - (this) => this is CreateMutationResult< - TData, - TError, - TVariables, - TContext, - Override< - MutationObserverIdleResult, - { mutate: CreateMutateFunction } - > & { - mutateAsync: CreateMutateAsyncFunction< - TData, - TError, - TVariables, - TContext - > - } - > -> +isIdle: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; ``` -Defined in: [types.ts:229](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L229) +Defined in: [types.ts:240](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L240) ---- +*** ### isPending ```ts -isPending: SignalFunction< - (this) => this is CreateMutationResult< - TData, - TError, - TVariables, - TContext, - Override< - MutationObserverLoadingResult, - { mutate: CreateMutateFunction } - > & { - mutateAsync: CreateMutateAsyncFunction< - TData, - TError, - TVariables, - TContext - > - } - > -> +isPending: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; ``` -Defined in: [types.ts:212](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L212) +Defined in: [types.ts:223](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L223) ---- +*** ### isSuccess ```ts -isSuccess: SignalFunction< - (this) => this is CreateMutationResult< - TData, - TError, - TVariables, - TContext, - Override< - MutationObserverSuccessResult, - { mutate: CreateMutateFunction } - > & { - mutateAsync: CreateMutateAsyncFunction< - TData, - TError, - TVariables, - TContext - > - } - > -> +isSuccess: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; ``` -Defined in: [types.ts:178](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L178) +Defined in: [types.ts:189](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L189) diff --git a/docs/framework/angular/reference/interfaces/basequerynarrowing.md b/docs/framework/angular/reference/interfaces/basequerynarrowing.md index c714b191a8..cee854982a 100644 --- a/docs/framework/angular/reference/interfaces/basequerynarrowing.md +++ b/docs/framework/angular/reference/interfaces/basequerynarrowing.md @@ -7,7 +7,7 @@ title: BaseQueryNarrowing # Interface: BaseQueryNarrowing\ -Defined in: [types.ts:56](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L56) +Defined in: [types.ts:57](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L57) ## Type Parameters @@ -23,7 +23,7 @@ Defined in: [types.ts:56](https://github.com/arnoud-dv/query/blob/main/packages/ isError: (this) => this is CreateBaseQueryResult>; ``` -Defined in: [types.ts:64](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L64) +Defined in: [types.ts:65](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L65) #### Parameters @@ -35,7 +35,7 @@ Defined in: [types.ts:64](https://github.com/arnoud-dv/query/blob/main/packages/ `this is CreateBaseQueryResult>` ---- +*** ### isPending() @@ -43,7 +43,7 @@ Defined in: [types.ts:64](https://github.com/arnoud-dv/query/blob/main/packages/ isPending: (this) => this is CreateBaseQueryResult>; ``` -Defined in: [types.ts:71](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L71) +Defined in: [types.ts:72](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L72) #### Parameters @@ -55,7 +55,7 @@ Defined in: [types.ts:71](https://github.com/arnoud-dv/query/blob/main/packages/ `this is CreateBaseQueryResult>` ---- +*** ### isSuccess() @@ -63,7 +63,7 @@ Defined in: [types.ts:71](https://github.com/arnoud-dv/query/blob/main/packages/ isSuccess: (this) => this is CreateBaseQueryResult>; ``` -Defined in: [types.ts:57](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L57) +Defined in: [types.ts:58](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L58) #### Parameters diff --git a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md index 01cfa93c69..3e1ee35164 100644 --- a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md @@ -7,7 +7,7 @@ title: CreateBaseQueryOptions # Interface: CreateBaseQueryOptions\ -Defined in: [types.ts:20](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L20) +Defined in: [types.ts:21](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L21) ## Extends @@ -23,4 +23,4 @@ Defined in: [types.ts:20](https://github.com/arnoud-dv/query/blob/main/packages/ • **TQueryData** = `TQueryFnData` -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md index cb996fec9e..e1e744ba4f 100644 --- a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md @@ -7,7 +7,7 @@ title: CreateInfiniteQueryOptions # Interface: CreateInfiniteQueryOptions\ -Defined in: [types.ts:80](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L80) +Defined in: [types.ts:81](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L81) ## Extends @@ -21,6 +21,6 @@ Defined in: [types.ts:80](https://github.com/arnoud-dv/query/blob/main/packages/ • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/interfaces/createmutationoptions.md b/docs/framework/angular/reference/interfaces/createmutationoptions.md index 0c59141103..ebc47be190 100644 --- a/docs/framework/angular/reference/interfaces/createmutationoptions.md +++ b/docs/framework/angular/reference/interfaces/createmutationoptions.md @@ -7,7 +7,7 @@ title: CreateMutationOptions # Interface: CreateMutationOptions\ -Defined in: [mutation-options.ts:48](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L48) +Defined in: [types.ts:132](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L132) ## Extends diff --git a/docs/framework/angular/reference/interfaces/createqueryoptions.md b/docs/framework/angular/reference/interfaces/createqueryoptions.md index a11f9d314f..f4242283e0 100644 --- a/docs/framework/angular/reference/interfaces/createqueryoptions.md +++ b/docs/framework/angular/reference/interfaces/createqueryoptions.md @@ -7,7 +7,7 @@ title: CreateQueryOptions # Interface: CreateQueryOptions\ -Defined in: [types.ts:34](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L34) +Defined in: [types.ts:35](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L35) ## Extends @@ -21,4 +21,4 @@ Defined in: [types.ts:34](https://github.com/arnoud-dv/query/blob/main/packages/ • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md b/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md index 998a67981b..954c705fde 100644 --- a/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/injectinfinitequeryoptions.md @@ -7,7 +7,7 @@ title: InjectInfiniteQueryOptions # Interface: InjectInfiniteQueryOptions -Defined in: [inject-infinite-query.ts:25](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L25) +Defined in: [inject-infinite-query.ts:25](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L25) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-infinite-query.ts:25](https://github.com/arnoud-dv/query/blo optional injector: Injector; ``` -Defined in: [inject-infinite-query.ts:31](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L31) +Defined in: [inject-infinite-query.ts:31](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L31) The `Injector` in which to create the infinite query. diff --git a/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md b/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md index 58f1bec12a..d5de1f4ae3 100644 --- a/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md +++ b/docs/framework/angular/reference/interfaces/injectisfetchingoptions.md @@ -7,7 +7,7 @@ title: InjectIsFetchingOptions # Interface: InjectIsFetchingOptions -Defined in: [inject-is-fetching.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L13) +Defined in: [inject-is-fetching.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L13) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-is-fetching.ts:13](https://github.com/arnoud-dv/query/blob/m optional injector: Injector; ``` -Defined in: [inject-is-fetching.ts:19](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L19) +Defined in: [inject-is-fetching.ts:19](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-fetching.ts#L19) The `Injector` in which to create the isFetching signal. diff --git a/docs/framework/angular/reference/interfaces/injectismutatingoptions.md b/docs/framework/angular/reference/interfaces/injectismutatingoptions.md index eff218f898..393dfd44a0 100644 --- a/docs/framework/angular/reference/interfaces/injectismutatingoptions.md +++ b/docs/framework/angular/reference/interfaces/injectismutatingoptions.md @@ -7,7 +7,7 @@ title: InjectIsMutatingOptions # Interface: InjectIsMutatingOptions -Defined in: [inject-is-mutating.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L13) +Defined in: [inject-is-mutating.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L13) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-is-mutating.ts:13](https://github.com/arnoud-dv/query/blob/m optional injector: Injector; ``` -Defined in: [inject-is-mutating.ts:19](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L19) +Defined in: [inject-is-mutating.ts:19](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-is-mutating.ts#L19) The `Injector` in which to create the isMutating signal. diff --git a/docs/framework/angular/reference/interfaces/injectmutationoptions.md b/docs/framework/angular/reference/interfaces/injectmutationoptions.md index 7e72fc58e0..0de78ed031 100644 --- a/docs/framework/angular/reference/interfaces/injectmutationoptions.md +++ b/docs/framework/angular/reference/interfaces/injectmutationoptions.md @@ -7,7 +7,7 @@ title: InjectMutationOptions # Interface: InjectMutationOptions -Defined in: [inject-mutation.ts:24](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L24) +Defined in: [inject-mutation.ts:27](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L27) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-mutation.ts:24](https://github.com/arnoud-dv/query/blob/main optional injector: Injector; ``` -Defined in: [inject-mutation.ts:30](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L30) +Defined in: [inject-mutation.ts:33](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L33) The `Injector` in which to create the mutation. diff --git a/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md b/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md index 1a6bbedbf0..022a878941 100644 --- a/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md +++ b/docs/framework/angular/reference/interfaces/injectmutationstateoptions.md @@ -7,7 +7,7 @@ title: InjectMutationStateOptions # Interface: InjectMutationStateOptions -Defined in: [inject-mutation-state.ts:45](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L45) +Defined in: [inject-mutation-state.ts:45](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L45) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-mutation-state.ts:45](https://github.com/arnoud-dv/query/blo optional injector: Injector; ``` -Defined in: [inject-mutation-state.ts:51](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L51) +Defined in: [inject-mutation-state.ts:51](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L51) The `Injector` in which to create the mutation state signal. diff --git a/docs/framework/angular/reference/interfaces/injectqueryoptions.md b/docs/framework/angular/reference/interfaces/injectqueryoptions.md index 7f1139166a..680e49ed3f 100644 --- a/docs/framework/angular/reference/interfaces/injectqueryoptions.md +++ b/docs/framework/angular/reference/interfaces/injectqueryoptions.md @@ -7,7 +7,7 @@ title: InjectQueryOptions # Interface: InjectQueryOptions -Defined in: [inject-query.ts:20](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L20) +Defined in: [inject-query.ts:20](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L20) ## Properties @@ -17,7 +17,7 @@ Defined in: [inject-query.ts:20](https://github.com/arnoud-dv/query/blob/main/pa optional injector: Injector; ``` -Defined in: [inject-query.ts:26](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L26) +Defined in: [inject-query.ts:26](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L26) The `Injector` in which to create the query. diff --git a/docs/framework/angular/reference/interfaces/queryfeature.md b/docs/framework/angular/reference/interfaces/queryfeature.md index 1c63ce3b59..cfc23901dd 100644 --- a/docs/framework/angular/reference/interfaces/queryfeature.md +++ b/docs/framework/angular/reference/interfaces/queryfeature.md @@ -7,25 +7,25 @@ title: QueryFeature # Interface: QueryFeature\ -Defined in: [providers.ts:135](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L135) +Defined in: [providers.ts:135](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L135) Helper type to represent a Query feature. ## Type Parameters -• **TFeatureKind** _extends_ `QueryFeatureKind` +• **TFeatureKind** *extends* `QueryFeatureKind` ## Properties ### ɵkind ```ts -ɵkind: TFeatureKind +ɵkind: TFeatureKind; ``` -Defined in: [providers.ts:136](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L136) +Defined in: [providers.ts:136](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L136) ---- +*** ### ɵproviders @@ -33,4 +33,4 @@ Defined in: [providers.ts:136](https://github.com/arnoud-dv/query/blob/main/pack ɵproviders: Provider[]; ``` -Defined in: [providers.ts:137](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L137) +Defined in: [providers.ts:137](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L137) diff --git a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md index a30685661d..59160d33e0 100644 --- a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md @@ -8,23 +8,19 @@ title: CreateBaseMutationResult # Type Alias: CreateBaseMutationResult\ ```ts -type CreateBaseMutationResult = Override< - MutationObserverResult, - { - mutate: CreateMutateFunction - } -> & - object +type CreateBaseMutationResult = Override, { + mutate: CreateMutateFunction; + }> & object; ``` -Defined in: [types.ts:147](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L147) +Defined in: [types.ts:158](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L158) ## Type declaration ### mutateAsync ```ts -mutateAsync: CreateMutateAsyncFunction +mutateAsync: CreateMutateAsyncFunction; ``` ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md index 5991242592..02406bfa51 100644 --- a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md @@ -8,14 +8,10 @@ title: CreateBaseQueryResult # Type Alias: CreateBaseQueryResult\ ```ts -type CreateBaseQueryResult = BaseQueryNarrowing< - TData, - TError -> & - MapToSignals> +type CreateBaseQueryResult = BaseQueryNarrowing & MapToSignals>; ``` -Defined in: [types.ts:97](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L97) +Defined in: [types.ts:98](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L98) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md index d9fa3e8c5a..6176823282 100644 --- a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md @@ -8,14 +8,10 @@ title: CreateInfiniteQueryResult # Type Alias: CreateInfiniteQueryResult\ ```ts -type CreateInfiniteQueryResult = BaseQueryNarrowing< - TData, - TError -> & - MapToSignals> +type CreateInfiniteQueryResult = BaseQueryNarrowing & MapToSignals>; ``` -Defined in: [types.ts:116](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L116) +Defined in: [types.ts:117](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L117) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md index bf0ede2500..579f3f90de 100644 --- a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md @@ -8,11 +8,10 @@ title: CreateMutateAsyncFunction # Type Alias: CreateMutateAsyncFunction\ ```ts -type CreateMutateAsyncFunction = - MutateFunction +type CreateMutateAsyncFunction = MutateFunction; ``` -Defined in: [types.ts:140](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L140) +Defined in: [types.ts:151](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L151) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createmutatefunction.md b/docs/framework/angular/reference/type-aliases/createmutatefunction.md index 8bdd4cde58..87ce65f202 100644 --- a/docs/framework/angular/reference/type-aliases/createmutatefunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutatefunction.md @@ -8,12 +8,10 @@ title: CreateMutateFunction # Type Alias: CreateMutateFunction()\ ```ts -type CreateMutateFunction = ( - ...args -) => void +type CreateMutateFunction = (...args) => void; ``` -Defined in: [types.ts:131](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L131) +Defined in: [types.ts:142](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L142) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createmutationresult.md b/docs/framework/angular/reference/type-aliases/createmutationresult.md index 8475de0b03..ae0c5cb054 100644 --- a/docs/framework/angular/reference/type-aliases/createmutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createmutationresult.md @@ -8,12 +8,10 @@ title: CreateMutationResult # Type Alias: CreateMutationResult\ ```ts -type CreateMutationResult = - BaseMutationNarrowing & - MapToSignals> +type CreateMutationResult = BaseMutationNarrowing & MapToSignals>; ``` -Defined in: [types.ts:248](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L248) +Defined in: [types.ts:259](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L259) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createqueryresult.md b/docs/framework/angular/reference/type-aliases/createqueryresult.md index 3e5aec14aa..11c07e5aba 100644 --- a/docs/framework/angular/reference/type-aliases/createqueryresult.md +++ b/docs/framework/angular/reference/type-aliases/createqueryresult.md @@ -8,10 +8,10 @@ title: CreateQueryResult # Type Alias: CreateQueryResult\ ```ts -type CreateQueryResult = CreateBaseQueryResult +type CreateQueryResult = CreateBaseQueryResult; ``` -Defined in: [types.ts:104](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L104) +Defined in: [types.ts:105](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L105) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md index 613583207b..297c65bca9 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md @@ -8,14 +8,10 @@ title: DefinedCreateInfiniteQueryResult # Type Alias: DefinedCreateInfiniteQueryResult\ ```ts -type DefinedCreateInfiniteQueryResult< - TData, - TError, - TDefinedInfiniteQueryObserver, -> = MapToSignals +type DefinedCreateInfiniteQueryResult = MapToSignals; ``` -Defined in: [types.ts:122](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L122) +Defined in: [types.ts:123](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L123) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md index c5296dd763..b764ec669b 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md @@ -8,14 +8,10 @@ title: DefinedCreateQueryResult # Type Alias: DefinedCreateQueryResult\ ```ts -type DefinedCreateQueryResult = BaseQueryNarrowing< - TData, - TError -> & - MapToSignals> +type DefinedCreateQueryResult = BaseQueryNarrowing & MapToSignals>; ``` -Defined in: [types.ts:109](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/types.ts#L109) +Defined in: [types.ts:110](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L110) ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md index 8752d6fb07..dabe372f90 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md @@ -8,30 +8,17 @@ title: DefinedInitialDataInfiniteOptions # Type Alias: DefinedInitialDataInfiniteOptions\ ```ts -type DefinedInitialDataInfiniteOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, -> = CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam -> & - object +type DefinedInitialDataInfiniteOptions = CreateInfiniteQueryOptions & object; ``` -Defined in: [infinite-query-options.ts:62](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L62) +Defined in: [infinite-query-options.ts:62](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L62) ## Type declaration ### initialData ```ts -initialData: +initialData: | NonUndefinedGuard> | () => NonUndefinedGuard> | undefined; @@ -45,6 +32,6 @@ initialData: • **TData** = `InfiniteData`\<`TQueryFnData`\> -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md index 722cb6ff9a..d0613848bc 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md @@ -8,21 +8,17 @@ title: DefinedInitialDataOptions # Type Alias: DefinedInitialDataOptions\ ```ts -type DefinedInitialDataOptions = Omit< - CreateQueryOptions, - 'queryFn' -> & - object +type DefinedInitialDataOptions = Omit, "queryFn"> & object; ``` -Defined in: [query-options.ts:40](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L40) +Defined in: [query-options.ts:40](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L40) ## Type declaration ### initialData ```ts -initialData: +initialData: | NonUndefinedGuard | () => NonUndefinedGuard; ``` @@ -41,4 +37,4 @@ optional queryFn: QueryFunction; • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md index f6350504d3..ea208df058 100644 --- a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md +++ b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md @@ -8,10 +8,10 @@ title: DeveloperToolsFeature # Type Alias: DeveloperToolsFeature ```ts -type DeveloperToolsFeature = QueryFeature<'Devtools'> +type DeveloperToolsFeature = QueryFeature<"Devtools">; ``` -Defined in: [providers.ts:158](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L158) +Defined in: [providers.ts:158](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L158) A type alias that represents a feature which enables developer tools. The type is used to describe the return value of the `withDevtools` function. diff --git a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md index cb9e559e31..c4bd1e64c4 100644 --- a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md +++ b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md @@ -8,10 +8,10 @@ title: PersistQueryClientFeature # Type Alias: PersistQueryClientFeature ```ts -type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'> +type PersistQueryClientFeature = QueryFeature<"PersistQueryClient">; ``` -Defined in: [providers.ts:164](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L164) +Defined in: [providers.ts:164](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L164) A type alias that represents a feature which enables persistence. The type is used to describe the return value of the `withPersistQueryClient` function. diff --git a/docs/framework/angular/reference/type-aliases/queriesoptions.md b/docs/framework/angular/reference/type-aliases/queriesoptions.md index 0c92d95b7e..1ba49c5e93 100644 --- a/docs/framework/angular/reference/type-aliases/queriesoptions.md +++ b/docs/framework/angular/reference/type-aliases/queriesoptions.md @@ -8,43 +8,17 @@ title: QueriesOptions # Type Alias: QueriesOptions\ ```ts -type QueriesOptions = TDepth['length'] extends MAXIMUM_DEPTH - ? QueryObserverOptionsForCreateQueries[] - : T extends [] - ? [] - : T extends [infer Head] - ? [...TResult, GetOptions] - : T extends [infer Head, ...infer Tail] - ? QueriesOptions< - [...Tail], - [...TResult, GetOptions], - [...TDepth, 1] - > - : ReadonlyArray extends T - ? T - : T extends QueryObserverOptionsForCreateQueries< - infer TQueryFnData, - infer TError, - infer TData, - infer TQueryKey - >[] - ? QueryObserverOptionsForCreateQueries< - TQueryFnData, - TError, - TData, - TQueryKey - >[] - : QueryObserverOptionsForCreateQueries[] +type QueriesOptions = TDepth["length"] extends MAXIMUM_DEPTH ? QueryObserverOptionsForCreateQueries[] : T extends [] ? [] : T extends [infer Head] ? [...TResult, GetOptions] : T extends [infer Head, ...(infer Tail)] ? QueriesOptions<[...Tail], [...TResult, GetOptions], [...TDepth, 1]> : ReadonlyArray extends T ? T : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverOptionsForCreateQueries[] : QueryObserverOptionsForCreateQueries[]; ``` -Defined in: [inject-queries.ts:120](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L120) +Defined in: [inject-queries.ts:120](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L120) QueriesOptions reducer recursively unwraps function arguments to infer/enforce type param ## Type Parameters -• **T** _extends_ `any`[] +• **T** *extends* `any`[] -• **TResult** _extends_ `any`[] = \[\] +• **TResult** *extends* `any`[] = \[\] -• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] +• **TDepth** *extends* `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queriesresults.md b/docs/framework/angular/reference/type-aliases/queriesresults.md index 05fe2aca98..eae0895ee3 100644 --- a/docs/framework/angular/reference/type-aliases/queriesresults.md +++ b/docs/framework/angular/reference/type-aliases/queriesresults.md @@ -8,39 +8,17 @@ title: QueriesResults # Type Alias: QueriesResults\ ```ts -type QueriesResults = TDepth['length'] extends MAXIMUM_DEPTH - ? QueryObserverResult[] - : T extends [] - ? [] - : T extends [infer Head] - ? [...TResult, GetResults] - : T extends [infer Head, ...infer Tail] - ? QueriesResults< - [...Tail], - [...TResult, GetResults], - [...TDepth, 1] - > - : T extends QueryObserverOptionsForCreateQueries< - infer TQueryFnData, - infer TError, - infer TData, - any - >[] - ? QueryObserverResult< - unknown extends TData ? TQueryFnData : TData, - unknown extends TError ? DefaultError : TError - >[] - : QueryObserverResult[] +type QueriesResults = TDepth["length"] extends MAXIMUM_DEPTH ? QueryObserverResult[] : T extends [] ? [] : T extends [infer Head] ? [...TResult, GetResults] : T extends [infer Head, ...(infer Tail)] ? QueriesResults<[...Tail], [...TResult, GetResults], [...TDepth, 1]> : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverResult[] : QueryObserverResult[]; ``` -Defined in: [inject-queries.ts:162](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L162) +Defined in: [inject-queries.ts:162](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L162) QueriesResults reducer recursively maps type param to results ## Type Parameters -• **T** _extends_ `any`[] +• **T** *extends* `any`[] -• **TResult** _extends_ `any`[] = \[\] +• **TResult** *extends* `any`[] = \[\] -• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] +• **TDepth** *extends* `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queryfeatures.md b/docs/framework/angular/reference/type-aliases/queryfeatures.md index ec55b4949a..3bab4b9a36 100644 --- a/docs/framework/angular/reference/type-aliases/queryfeatures.md +++ b/docs/framework/angular/reference/type-aliases/queryfeatures.md @@ -8,10 +8,12 @@ title: QueryFeatures # Type Alias: QueryFeatures ```ts -type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature +type QueryFeatures = + | DeveloperToolsFeature + | PersistQueryClientFeature; ``` -Defined in: [providers.ts:173](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/providers.ts#L173) +Defined in: [providers.ts:173](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L173) A type alias that represents all Query features available for use with `provideTanStackQuery`. Features can be enabled by adding special functions to the `provideTanStackQuery` call. diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md index 877b3aea72..9061a58458 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md @@ -8,30 +8,17 @@ title: UndefinedInitialDataInfiniteOptions # Type Alias: UndefinedInitialDataInfiniteOptions\ ```ts -type UndefinedInitialDataInfiniteOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, -> = CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam -> & - object +type UndefinedInitialDataInfiniteOptions = CreateInfiniteQueryOptions & object; ``` -Defined in: [infinite-query-options.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L13) +Defined in: [infinite-query-options.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L13) ## Type declaration ### initialData? ```ts -optional initialData: +optional initialData: | NonUndefinedGuard> | InitialDataFunction>>; ``` @@ -44,6 +31,6 @@ optional initialData: • **TData** = `InfiniteData`\<`TQueryFnData`\> -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md index 6af7540324..12037f13e7 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md @@ -8,18 +8,17 @@ title: UndefinedInitialDataOptions # Type Alias: UndefinedInitialDataOptions\ ```ts -type UndefinedInitialDataOptions = - CreateQueryOptions & object +type UndefinedInitialDataOptions = CreateQueryOptions & object; ``` -Defined in: [query-options.ts:13](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L13) +Defined in: [query-options.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L13) ## Type declaration ### initialData? ```ts -optional initialData: +optional initialData: | InitialDataFunction> | NonUndefinedGuard; ``` @@ -32,4 +31,4 @@ optional initialData: • **TData** = `TQueryFnData` -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md index d76009d0d9..eebf0bb773 100644 --- a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md @@ -8,26 +8,10 @@ title: UnusedSkipTokenInfiniteOptions # Type Alias: UnusedSkipTokenInfiniteOptions\ ```ts -type UnusedSkipTokenInfiniteOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam, -> = OmitKeyof< - CreateInfiniteQueryOptions< - TQueryFnData, - TError, - TData, - TQueryKey, - TPageParam - >, - 'queryFn' -> & - object +type UnusedSkipTokenInfiniteOptions = OmitKeyof, "queryFn"> & object; ``` -Defined in: [infinite-query-options.ts:34](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L34) +Defined in: [infinite-query-options.ts:34](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L34) ## Type declaration @@ -45,6 +29,6 @@ optional queryFn: Exclude -• **TQueryKey** _extends_ `QueryKey` = `QueryKey` +• **TQueryKey** *extends* `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md b/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md index 868fc7d8cc..ec956c1148 100644 --- a/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md +++ b/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md @@ -8,14 +8,10 @@ title: UnusedSkipTokenOptions # Type Alias: UnusedSkipTokenOptions\ ```ts -type UnusedSkipTokenOptions = OmitKeyof< - CreateQueryOptions, - 'queryFn' -> & - object +type UnusedSkipTokenOptions = OmitKeyof, "queryFn"> & object; ``` -Defined in: [query-options.ts:25](https://github.com/arnoud-dv/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L25) +Defined in: [query-options.ts:25](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L25) ## Type declaration @@ -33,4 +29,4 @@ optional queryFn: Exclude Date: Fri, 12 Sep 2025 14:21:47 +0000 Subject: [PATCH 18/24] ci: apply automated fixes --- .../functions/infinitequeryoptions.md | 63 ++++++++++-- .../functions/injectinfinitequery.md | 33 +++++-- .../reference/functions/injectmutation.md | 5 +- .../functions/injectmutationstate.md | 5 +- .../reference/functions/injectqueries.md | 9 +- .../reference/functions/injectquery.md | 29 ++++-- .../reference/functions/injectqueryclient.md | 3 +- .../reference/functions/mutationoptions.md | 44 +++++---- .../functions/providetanstackquery.md | 6 +- .../reference/functions/queryfeature.md | 2 +- .../reference/functions/queryoptions.md | 97 +++++++++++-------- docs/framework/angular/reference/index.md | 4 +- .../interfaces/basemutationnarrowing.md | 94 ++++++++++++++++-- .../interfaces/basequerynarrowing.md | 4 +- .../interfaces/createbasequeryoptions.md | 2 +- .../interfaces/createinfinitequeryoptions.md | 2 +- .../interfaces/createqueryoptions.md | 2 +- .../reference/interfaces/queryfeature.md | 6 +- .../type-aliases/createbasemutationresult.md | 12 ++- .../type-aliases/createbasequeryresult.md | 6 +- .../type-aliases/createinfinitequeryresult.md | 6 +- .../type-aliases/createmutateasyncfunction.md | 3 +- .../type-aliases/createmutatefunction.md | 4 +- .../type-aliases/createmutationresult.md | 4 +- .../type-aliases/createqueryresult.md | 2 +- .../definedcreateinfinitequeryresult.md | 6 +- .../type-aliases/definedcreatequeryresult.md | 6 +- .../definedinitialdatainfiniteoptions.md | 19 +++- .../type-aliases/definedinitialdataoptions.md | 10 +- .../type-aliases/developertoolsfeature.md | 2 +- .../type-aliases/persistqueryclientfeature.md | 2 +- .../reference/type-aliases/queriesoptions.md | 34 ++++++- .../reference/type-aliases/queriesresults.md | 30 +++++- .../reference/type-aliases/queryfeatures.md | 4 +- .../undefinedinitialdatainfiniteoptions.md | 19 +++- .../undefinedinitialdataoptions.md | 7 +- .../unusedskiptokeninfiniteoptions.md | 20 +++- .../type-aliases/unusedskiptokenoptions.md | 8 +- 38 files changed, 470 insertions(+), 144 deletions(-) diff --git a/docs/framework/angular/reference/functions/infinitequeryoptions.md b/docs/framework/angular/reference/functions/infinitequeryoptions.md index ac83ec422c..4f7055f247 100644 --- a/docs/framework/angular/reference/functions/infinitequeryoptions.md +++ b/docs/framework/angular/reference/functions/infinitequeryoptions.md @@ -18,7 +18,23 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions(options): CreateInfiniteQueryOptions & object & object +function infiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>( + options, +): CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam +> & + object & + object ``` Defined in: [infinite-query-options.ts:88](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L88) @@ -35,7 +51,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -62,7 +78,26 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions(options): OmitKeyof, "queryFn"> & object & object +function infiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>( + options, +): OmitKeyof< + CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam + >, + 'queryFn' +> & + object & + object ``` Defined in: [infinite-query-options.ts:119](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L119) @@ -79,7 +114,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -106,7 +141,23 @@ The infinite query options to tag with the type from `queryFn`. ## Call Signature ```ts -function infiniteQueryOptions(options): CreateInfiniteQueryOptions & object & object +function infiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>( + options, +): CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam +> & + object & + object ``` Defined in: [infinite-query-options.ts:150](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L150) @@ -123,7 +174,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/functions/injectinfinitequery.md b/docs/framework/angular/reference/functions/injectinfinitequery.md index dc8a1d88da..a8dff3e877 100644 --- a/docs/framework/angular/reference/functions/injectinfinitequery.md +++ b/docs/framework/angular/reference/functions/injectinfinitequery.md @@ -21,7 +21,16 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery(injectInfiniteQueryFn, options?): DefinedCreateInfiniteQueryResult +function injectInfiniteQuery< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>( + injectInfiniteQueryFn, + options?, +): DefinedCreateInfiniteQueryResult ``` Defined in: [inject-infinite-query.ts:41](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L41) @@ -37,7 +46,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -74,7 +83,13 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult +function injectInfiniteQuery< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` Defined in: [inject-infinite-query.ts:65](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L65) @@ -90,7 +105,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` @@ -127,7 +142,13 @@ Additional configuration. ## Call Signature ```ts -function injectInfiniteQuery(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult +function injectInfiniteQuery< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +>(injectInfiniteQueryFn, options?): CreateInfiniteQueryResult ``` Defined in: [inject-infinite-query.ts:89](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-infinite-query.ts#L89) @@ -143,7 +164,7 @@ Infinite queries can additively "load more" data onto an existing set of data or • **TData** = `InfiniteData`\<`TQueryFnData`, `unknown`\> -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/functions/injectmutation.md b/docs/framework/angular/reference/functions/injectmutation.md index e57110675d..bb6abf188f 100644 --- a/docs/framework/angular/reference/functions/injectmutation.md +++ b/docs/framework/angular/reference/functions/injectmutation.md @@ -8,7 +8,10 @@ title: injectMutation # Function: injectMutation() ```ts -function injectMutation(injectMutationFn, options?): CreateMutationResult +function injectMutation( + injectMutationFn, + options?, +): CreateMutationResult ``` Defined in: [inject-mutation.ts:44](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation.ts#L44) diff --git a/docs/framework/angular/reference/functions/injectmutationstate.md b/docs/framework/angular/reference/functions/injectmutationstate.md index 2b37544ec4..67f5d3d1bf 100644 --- a/docs/framework/angular/reference/functions/injectmutationstate.md +++ b/docs/framework/angular/reference/functions/injectmutationstate.md @@ -8,7 +8,10 @@ title: injectMutationState # Function: injectMutationState() ```ts -function injectMutationState(injectMutationStateFn, options?): Signal +function injectMutationState( + injectMutationStateFn, + options?, +): Signal ``` Defined in: [inject-mutation-state.ts:60](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-mutation-state.ts#L60) diff --git a/docs/framework/angular/reference/functions/injectqueries.md b/docs/framework/angular/reference/functions/injectqueries.md index 9f91a84503..bc78ac6c4c 100644 --- a/docs/framework/angular/reference/functions/injectqueries.md +++ b/docs/framework/angular/reference/functions/injectqueries.md @@ -8,16 +8,19 @@ title: injectQueries # Function: injectQueries() ```ts -function injectQueries(root0, injector?): Signal +function injectQueries( + root0, + injector?, +): Signal ``` Defined in: [inject-queries.ts:202](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L202) ## Type Parameters -• **T** *extends* `any`[] +• **T** _extends_ `any`[] -• **TCombinedResult** = `T` *extends* \[\] ? \[\] : `T` *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] *extends* \[\] ? \[\] : \[`...Tail[]`\] *extends* \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] *extends* \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] *extends* \[\] ? \[\] : ... *extends* ... ? ... : ... : \[`...(...)[]`\] *extends* ...[] ? ...[] : ...[] : \[`...Tail[]`\] *extends* `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` *extends* `TData` ? `TQueryFnData` : `TData`, `unknown` *extends* `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` *extends* `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` *extends* `TData` ? `TQueryFnData` : `TData`, `unknown` *extends* `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] +• **TCombinedResult** = `T` _extends_ \[\] ? \[\] : `T` _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>\] : `T` _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...Tail[]`\] _extends_ \[\] ? \[\] : \[`...Tail[]`\] _extends_ \[`Head`\] ? \[`GetResults`\<`Head`\>, `GetResults`\<`Head`\>, `GetResults`\<`Head`\>\] : \[`...Tail[]`\] _extends_ \[`Head`, `...Tail[]`\] ? \[`...(...)[]`\] _extends_ \[\] ? \[\] : ... _extends_ ... ? ... : ... : \[`...(...)[]`\] _extends_ ...[] ? ...[] : ...[] : \[`...Tail[]`\] _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] : `T` _extends_ `QueryObserverOptionsForCreateQueries`\<`TQueryFnData`, `TError`, `TData`, `any`\>[] ? `QueryObserverResult`\<`unknown` _extends_ `TData` ? `TQueryFnData` : `TData`, `unknown` _extends_ `TError` ? `Error` : `TError`\>[] : `QueryObserverResult`[] ## Parameters diff --git a/docs/framework/angular/reference/functions/injectquery.md b/docs/framework/angular/reference/functions/injectquery.md index c57f44e32e..289eb21fc0 100644 --- a/docs/framework/angular/reference/functions/injectquery.md +++ b/docs/framework/angular/reference/functions/injectquery.md @@ -10,6 +10,7 @@ title: injectQuery Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** + ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -25,6 +26,7 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** + ```ts class ServiceOrComponent { filter = signal('') @@ -53,7 +55,10 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery(injectQueryFn, options?): DefinedCreateQueryResult +function injectQuery( + injectQueryFn, + options?, +): DefinedCreateQueryResult ``` Defined in: [inject-query.ts:65](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L65) @@ -61,6 +66,7 @@ Defined in: [inject-query.ts:65](https://github.com/TanStack/query/blob/main/pac Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** + ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -76,6 +82,7 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** + ```ts class ServiceOrComponent { filter = signal('') @@ -97,7 +104,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -140,7 +147,10 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery(injectQueryFn, options?): CreateQueryResult +function injectQuery( + injectQueryFn, + options?, +): CreateQueryResult ``` Defined in: [inject-query.ts:116](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L116) @@ -148,6 +158,7 @@ Defined in: [inject-query.ts:116](https://github.com/TanStack/query/blob/main/pa Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** + ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -163,6 +174,7 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** + ```ts class ServiceOrComponent { filter = signal('') @@ -184,7 +196,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -227,7 +239,10 @@ https://tanstack.com/query/latest/docs/framework/angular/guides/queries ## Call Signature ```ts -function injectQuery(injectQueryFn, options?): CreateQueryResult +function injectQuery( + injectQueryFn, + options?, +): CreateQueryResult ``` Defined in: [inject-query.ts:167](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-query.ts#L167) @@ -235,6 +250,7 @@ Defined in: [inject-query.ts:167](https://github.com/TanStack/query/blob/main/pa Injects a query: a declarative dependency on an asynchronous source of data that is tied to a unique key. **Basic example** + ```ts class ServiceOrComponent { query = injectQuery(() => ({ @@ -250,6 +266,7 @@ In the example below, the query will be automatically enabled and executed when to a truthy value. When the filter signal changes back to a falsy value, the query will be disabled. **Reactive example** + ```ts class ServiceOrComponent { filter = signal('') @@ -271,7 +288,7 @@ class ServiceOrComponent { • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters diff --git a/docs/framework/angular/reference/functions/injectqueryclient.md b/docs/framework/angular/reference/functions/injectqueryclient.md index e036aedfba..a5450f4dcf 100644 --- a/docs/framework/angular/reference/functions/injectqueryclient.md +++ b/docs/framework/angular/reference/functions/injectqueryclient.md @@ -35,6 +35,7 @@ Use `inject(QueryClient)` instead. If you need to get a `QueryClient` from a custom injector, use `injector.get(QueryClient)`. **Example** + ```ts -const queryClient = injectQueryClient(); +const queryClient = injectQueryClient() ``` diff --git a/docs/framework/angular/reference/functions/mutationoptions.md b/docs/framework/angular/reference/functions/mutationoptions.md index a253e82fe8..98fc97ec2c 100644 --- a/docs/framework/angular/reference/functions/mutationoptions.md +++ b/docs/framework/angular/reference/functions/mutationoptions.md @@ -13,22 +13,22 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } queries = inject(QueriesService) -idSignal = new Signal(0); +idSignal = new Signal(0) mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) mutation.mutate({ title: 'New Title' }) @@ -41,7 +41,12 @@ The mutation options. ## Call Signature ```ts -function mutationOptions(options): WithRequired, "mutationKey"> +function mutationOptions( + options, +): WithRequired< + CreateMutationOptions, + 'mutationKey' +> ``` Defined in: [mutation-options.ts:34](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L34) @@ -52,22 +57,22 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } queries = inject(QueriesService) -idSignal = new Signal(0); +idSignal = new Signal(0) mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) mutation.mutate({ title: 'New Title' }) @@ -106,7 +111,12 @@ The mutation options. ## Call Signature ```ts -function mutationOptions(options): Omit, "mutationKey"> +function mutationOptions( + options, +): Omit< + CreateMutationOptions, + 'mutationKey' +> ``` Defined in: [mutation-options.ts:48](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L48) @@ -117,22 +127,22 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } queries = inject(QueriesService) -idSignal = new Signal(0); +idSignal = new Signal(0) mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) mutation.mutate({ title: 'New Title' }) diff --git a/docs/framework/angular/reference/functions/providetanstackquery.md b/docs/framework/angular/reference/functions/providetanstackquery.md index 2a5a2070cb..b70abdf030 100644 --- a/docs/framework/angular/reference/functions/providetanstackquery.md +++ b/docs/framework/angular/reference/functions/providetanstackquery.md @@ -49,6 +49,7 @@ export class AppModule {} You can also enable optional developer tools by adding `withDevtools`. By default the tools will then be loaded when your app is in development mode. + ```ts import { provideTanStackQuery, @@ -75,6 +76,7 @@ export const MY_QUERY_CLIENT = new InjectionToken('', { // In a lazy loaded route or lazy loaded component's providers array: providers: [provideTanStackQuery(MY_QUERY_CLIENT)] ``` + Using an InjectionToken for the QueryClient is an advanced optimization which allows TanStack Query to be absent from the main application bundle. This can be beneficial if you want to include TanStack Query on lazy loaded routes only while still sharing a `QueryClient`. @@ -102,5 +104,5 @@ A set of providers to set up TanStack Query. ## See - - https://tanstack.com/query/v5/docs/framework/angular/quick-start - - withDevtools +- https://tanstack.com/query/v5/docs/framework/angular/quick-start +- withDevtools diff --git a/docs/framework/angular/reference/functions/queryfeature.md b/docs/framework/angular/reference/functions/queryfeature.md index 46d7d72dd3..f749616ba4 100644 --- a/docs/framework/angular/reference/functions/queryfeature.md +++ b/docs/framework/angular/reference/functions/queryfeature.md @@ -17,7 +17,7 @@ Helper function to create an object that represents a Query feature. ## Type Parameters -• **TFeatureKind** *extends* `"Devtools"` \| `"PersistQueryClient"` +• **TFeatureKind** _extends_ `"Devtools"` \| `"PersistQueryClient"` ## Parameters diff --git a/docs/framework/angular/reference/functions/queryoptions.md b/docs/framework/angular/reference/functions/queryoptions.md index 25847f526a..d492b5a880 100644 --- a/docs/framework/angular/reference/functions/queryoptions.md +++ b/docs/framework/angular/reference/functions/queryoptions.md @@ -14,15 +14,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts - const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise - }) - - const queryClient = new QueryClient() - const data = queryClient.getQueryData(queryKey) - // ^? number | undefined +const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise +}) + +const queryClient = new QueryClient() +const data = queryClient.getQueryData(queryKey) +// ^? number | undefined ``` ## Param @@ -32,7 +32,11 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions(options): Omit, "queryFn"> & object & object +function queryOptions( + options, +): Omit, 'queryFn'> & + object & + object ``` Defined in: [query-options.ts:76](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L76) @@ -44,15 +48,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts - const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise - }) - - const queryClient = new QueryClient() - const data = queryClient.getQueryData(queryKey) - // ^? number | undefined +const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise +}) + +const queryClient = new QueryClient() +const data = queryClient.getQueryData(queryKey) +// ^? number | undefined ``` ### Type Parameters @@ -63,7 +67,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -88,7 +92,14 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions(options): OmitKeyof, "queryFn"> & object & object +function queryOptions( + options, +): OmitKeyof< + CreateQueryOptions, + 'queryFn' +> & + object & + object ``` Defined in: [query-options.ts:108](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L108) @@ -100,15 +111,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts - const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise - }) - - const queryClient = new QueryClient() - const data = queryClient.getQueryData(queryKey) - // ^? number | undefined +const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise +}) + +const queryClient = new QueryClient() +const data = queryClient.getQueryData(queryKey) +// ^? number | undefined ``` ### Type Parameters @@ -119,7 +130,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters @@ -144,7 +155,9 @@ The query options to tag with the type from `queryFn`. ## Call Signature ```ts -function queryOptions(options): CreateQueryOptions & object & object +function queryOptions( + options, +): CreateQueryOptions & object & object ``` Defined in: [query-options.ts:140](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L140) @@ -156,15 +169,15 @@ The `queryKey` will be tagged with the type from `queryFn`. **Example** ```ts - const { queryKey } = queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(5), - // ^? Promise - }) - - const queryClient = new QueryClient() - const data = queryClient.getQueryData(queryKey) - // ^? number | undefined +const { queryKey } = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(5), + // ^? Promise +}) + +const queryClient = new QueryClient() +const data = queryClient.getQueryData(queryKey) +// ^? number | undefined ``` ### Type Parameters @@ -175,7 +188,7 @@ The `queryKey` will be tagged with the type from `queryFn`. • **TData** = `TQueryFnData` -• **TQueryKey** *extends* readonly `unknown`[] = readonly `unknown`[] +• **TQueryKey** _extends_ readonly `unknown`[] = readonly `unknown`[] ### Parameters diff --git a/docs/framework/angular/reference/index.md b/docs/framework/angular/reference/index.md index f06745a8d5..d9d29d1e6a 100644 --- a/docs/framework/angular/reference/index.md +++ b/docs/framework/angular/reference/index.md @@ -1,6 +1,6 @@ --- -id: "@tanstack/angular-query-experimental" -title: "@tanstack/angular-query-experimental" +id: '@tanstack/angular-query-experimental' +title: '@tanstack/angular-query-experimental' --- diff --git a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md index b007103464..b85af9815f 100644 --- a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md +++ b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md @@ -24,37 +24,117 @@ Defined in: [types.ts:183](https://github.com/TanStack/query/blob/main/packages/ ### isError ```ts -isError: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; +isError: SignalFunction< + ( + this, + ) => this is CreateMutationResult< + TData, + TError, + TVariables, + TContext, + Override< + MutationObserverErrorResult, + { mutate: CreateMutateFunction } + > & { + mutateAsync: CreateMutateAsyncFunction< + TData, + TError, + TVariables, + TContext + > + } + > +> ``` Defined in: [types.ts:206](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L206) -*** +--- ### isIdle ```ts -isIdle: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; +isIdle: SignalFunction< + ( + this, + ) => this is CreateMutationResult< + TData, + TError, + TVariables, + TContext, + Override< + MutationObserverIdleResult, + { mutate: CreateMutateFunction } + > & { + mutateAsync: CreateMutateAsyncFunction< + TData, + TError, + TVariables, + TContext + > + } + > +> ``` Defined in: [types.ts:240](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L240) -*** +--- ### isPending ```ts -isPending: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; +isPending: SignalFunction< + ( + this, + ) => this is CreateMutationResult< + TData, + TError, + TVariables, + TContext, + Override< + MutationObserverLoadingResult, + { mutate: CreateMutateFunction } + > & { + mutateAsync: CreateMutateAsyncFunction< + TData, + TError, + TVariables, + TContext + > + } + > +> ``` Defined in: [types.ts:223](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L223) -*** +--- ### isSuccess ```ts -isSuccess: SignalFunction<(this) => this is CreateMutationResult, { mutate: CreateMutateFunction }> & { mutateAsync: CreateMutateAsyncFunction }>>; +isSuccess: SignalFunction< + ( + this, + ) => this is CreateMutationResult< + TData, + TError, + TVariables, + TContext, + Override< + MutationObserverSuccessResult, + { mutate: CreateMutateFunction } + > & { + mutateAsync: CreateMutateAsyncFunction< + TData, + TError, + TVariables, + TContext + > + } + > +> ``` Defined in: [types.ts:189](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L189) diff --git a/docs/framework/angular/reference/interfaces/basequerynarrowing.md b/docs/framework/angular/reference/interfaces/basequerynarrowing.md index cee854982a..3a8618c7ab 100644 --- a/docs/framework/angular/reference/interfaces/basequerynarrowing.md +++ b/docs/framework/angular/reference/interfaces/basequerynarrowing.md @@ -35,7 +35,7 @@ Defined in: [types.ts:65](https://github.com/TanStack/query/blob/main/packages/a `this is CreateBaseQueryResult>` -*** +--- ### isPending() @@ -55,7 +55,7 @@ Defined in: [types.ts:72](https://github.com/TanStack/query/blob/main/packages/a `this is CreateBaseQueryResult>` -*** +--- ### isSuccess() diff --git a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md index 3e1ee35164..e0d731d5b3 100644 --- a/docs/framework/angular/reference/interfaces/createbasequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createbasequeryoptions.md @@ -23,4 +23,4 @@ Defined in: [types.ts:21](https://github.com/TanStack/query/blob/main/packages/a • **TQueryData** = `TQueryFnData` -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md index e1e744ba4f..53ad6617ca 100644 --- a/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md +++ b/docs/framework/angular/reference/interfaces/createinfinitequeryoptions.md @@ -21,6 +21,6 @@ Defined in: [types.ts:81](https://github.com/TanStack/query/blob/main/packages/a • **TData** = `TQueryFnData` -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/interfaces/createqueryoptions.md b/docs/framework/angular/reference/interfaces/createqueryoptions.md index f4242283e0..61baca7951 100644 --- a/docs/framework/angular/reference/interfaces/createqueryoptions.md +++ b/docs/framework/angular/reference/interfaces/createqueryoptions.md @@ -21,4 +21,4 @@ Defined in: [types.ts:35](https://github.com/TanStack/query/blob/main/packages/a • **TData** = `TQueryFnData` -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/interfaces/queryfeature.md b/docs/framework/angular/reference/interfaces/queryfeature.md index cfc23901dd..70871d1f80 100644 --- a/docs/framework/angular/reference/interfaces/queryfeature.md +++ b/docs/framework/angular/reference/interfaces/queryfeature.md @@ -13,19 +13,19 @@ Helper type to represent a Query feature. ## Type Parameters -• **TFeatureKind** *extends* `QueryFeatureKind` +• **TFeatureKind** _extends_ `QueryFeatureKind` ## Properties ### ɵkind ```ts -ɵkind: TFeatureKind; +ɵkind: TFeatureKind ``` Defined in: [providers.ts:136](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L136) -*** +--- ### ɵproviders diff --git a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md index 59160d33e0..39441b5f12 100644 --- a/docs/framework/angular/reference/type-aliases/createbasemutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasemutationresult.md @@ -8,9 +8,13 @@ title: CreateBaseMutationResult # Type Alias: CreateBaseMutationResult\ ```ts -type CreateBaseMutationResult = Override, { - mutate: CreateMutateFunction; - }> & object; +type CreateBaseMutationResult = Override< + MutationObserverResult, + { + mutate: CreateMutateFunction + } +> & + object ``` Defined in: [types.ts:158](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L158) @@ -20,7 +24,7 @@ Defined in: [types.ts:158](https://github.com/TanStack/query/blob/main/packages/ ### mutateAsync ```ts -mutateAsync: CreateMutateAsyncFunction; +mutateAsync: CreateMutateAsyncFunction ``` ## Type Parameters diff --git a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md index 02406bfa51..1dd27ac995 100644 --- a/docs/framework/angular/reference/type-aliases/createbasequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createbasequeryresult.md @@ -8,7 +8,11 @@ title: CreateBaseQueryResult # Type Alias: CreateBaseQueryResult\ ```ts -type CreateBaseQueryResult = BaseQueryNarrowing & MapToSignals>; +type CreateBaseQueryResult = BaseQueryNarrowing< + TData, + TError +> & + MapToSignals> ``` Defined in: [types.ts:98](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L98) diff --git a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md index 6176823282..a2db0e64fd 100644 --- a/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/createinfinitequeryresult.md @@ -8,7 +8,11 @@ title: CreateInfiniteQueryResult # Type Alias: CreateInfiniteQueryResult\ ```ts -type CreateInfiniteQueryResult = BaseQueryNarrowing & MapToSignals>; +type CreateInfiniteQueryResult = BaseQueryNarrowing< + TData, + TError +> & + MapToSignals> ``` Defined in: [types.ts:117](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L117) diff --git a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md index 579f3f90de..abe1503a1d 100644 --- a/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutateasyncfunction.md @@ -8,7 +8,8 @@ title: CreateMutateAsyncFunction # Type Alias: CreateMutateAsyncFunction\ ```ts -type CreateMutateAsyncFunction = MutateFunction; +type CreateMutateAsyncFunction = + MutateFunction ``` Defined in: [types.ts:151](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L151) diff --git a/docs/framework/angular/reference/type-aliases/createmutatefunction.md b/docs/framework/angular/reference/type-aliases/createmutatefunction.md index 87ce65f202..dba0f7aa6e 100644 --- a/docs/framework/angular/reference/type-aliases/createmutatefunction.md +++ b/docs/framework/angular/reference/type-aliases/createmutatefunction.md @@ -8,7 +8,9 @@ title: CreateMutateFunction # Type Alias: CreateMutateFunction()\ ```ts -type CreateMutateFunction = (...args) => void; +type CreateMutateFunction = ( + ...args +) => void ``` Defined in: [types.ts:142](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L142) diff --git a/docs/framework/angular/reference/type-aliases/createmutationresult.md b/docs/framework/angular/reference/type-aliases/createmutationresult.md index ae0c5cb054..0800010d05 100644 --- a/docs/framework/angular/reference/type-aliases/createmutationresult.md +++ b/docs/framework/angular/reference/type-aliases/createmutationresult.md @@ -8,7 +8,9 @@ title: CreateMutationResult # Type Alias: CreateMutationResult\ ```ts -type CreateMutationResult = BaseMutationNarrowing & MapToSignals>; +type CreateMutationResult = + BaseMutationNarrowing & + MapToSignals> ``` Defined in: [types.ts:259](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L259) diff --git a/docs/framework/angular/reference/type-aliases/createqueryresult.md b/docs/framework/angular/reference/type-aliases/createqueryresult.md index 11c07e5aba..16c95c6798 100644 --- a/docs/framework/angular/reference/type-aliases/createqueryresult.md +++ b/docs/framework/angular/reference/type-aliases/createqueryresult.md @@ -8,7 +8,7 @@ title: CreateQueryResult # Type Alias: CreateQueryResult\ ```ts -type CreateQueryResult = CreateBaseQueryResult; +type CreateQueryResult = CreateBaseQueryResult ``` Defined in: [types.ts:105](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L105) diff --git a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md index 297c65bca9..3585ab5bf1 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreateinfinitequeryresult.md @@ -8,7 +8,11 @@ title: DefinedCreateInfiniteQueryResult # Type Alias: DefinedCreateInfiniteQueryResult\ ```ts -type DefinedCreateInfiniteQueryResult = MapToSignals; +type DefinedCreateInfiniteQueryResult< + TData, + TError, + TDefinedInfiniteQueryObserver, +> = MapToSignals ``` Defined in: [types.ts:123](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L123) diff --git a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md index b764ec669b..b3588c97c7 100644 --- a/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md +++ b/docs/framework/angular/reference/type-aliases/definedcreatequeryresult.md @@ -8,7 +8,11 @@ title: DefinedCreateQueryResult # Type Alias: DefinedCreateQueryResult\ ```ts -type DefinedCreateQueryResult = BaseQueryNarrowing & MapToSignals>; +type DefinedCreateQueryResult = BaseQueryNarrowing< + TData, + TError +> & + MapToSignals> ``` Defined in: [types.ts:110](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/types.ts#L110) diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md index dabe372f90..16025e3fc7 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdatainfiniteoptions.md @@ -8,7 +8,20 @@ title: DefinedInitialDataInfiniteOptions # Type Alias: DefinedInitialDataInfiniteOptions\ ```ts -type DefinedInitialDataInfiniteOptions = CreateInfiniteQueryOptions & object; +type DefinedInitialDataInfiniteOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +> = CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam +> & + object ``` Defined in: [infinite-query-options.ts:62](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L62) @@ -18,7 +31,7 @@ Defined in: [infinite-query-options.ts:62](https://github.com/TanStack/query/blo ### initialData ```ts -initialData: +initialData: | NonUndefinedGuard> | () => NonUndefinedGuard> | undefined; @@ -32,6 +45,6 @@ initialData: • **TData** = `InfiniteData`\<`TQueryFnData`\> -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md index d0613848bc..a54c79c787 100644 --- a/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/definedinitialdataoptions.md @@ -8,7 +8,11 @@ title: DefinedInitialDataOptions # Type Alias: DefinedInitialDataOptions\ ```ts -type DefinedInitialDataOptions = Omit, "queryFn"> & object; +type DefinedInitialDataOptions = Omit< + CreateQueryOptions, + 'queryFn' +> & + object ``` Defined in: [query-options.ts:40](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L40) @@ -18,7 +22,7 @@ Defined in: [query-options.ts:40](https://github.com/TanStack/query/blob/main/pa ### initialData ```ts -initialData: +initialData: | NonUndefinedGuard | () => NonUndefinedGuard; ``` @@ -37,4 +41,4 @@ optional queryFn: QueryFunction; • **TData** = `TQueryFnData` -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md index ea208df058..b1278a3d2e 100644 --- a/docs/framework/angular/reference/type-aliases/developertoolsfeature.md +++ b/docs/framework/angular/reference/type-aliases/developertoolsfeature.md @@ -8,7 +8,7 @@ title: DeveloperToolsFeature # Type Alias: DeveloperToolsFeature ```ts -type DeveloperToolsFeature = QueryFeature<"Devtools">; +type DeveloperToolsFeature = QueryFeature<'Devtools'> ``` Defined in: [providers.ts:158](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L158) diff --git a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md index c4bd1e64c4..2e923a3c6a 100644 --- a/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md +++ b/docs/framework/angular/reference/type-aliases/persistqueryclientfeature.md @@ -8,7 +8,7 @@ title: PersistQueryClientFeature # Type Alias: PersistQueryClientFeature ```ts -type PersistQueryClientFeature = QueryFeature<"PersistQueryClient">; +type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'> ``` Defined in: [providers.ts:164](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L164) diff --git a/docs/framework/angular/reference/type-aliases/queriesoptions.md b/docs/framework/angular/reference/type-aliases/queriesoptions.md index 1ba49c5e93..88e9502ce3 100644 --- a/docs/framework/angular/reference/type-aliases/queriesoptions.md +++ b/docs/framework/angular/reference/type-aliases/queriesoptions.md @@ -8,7 +8,33 @@ title: QueriesOptions # Type Alias: QueriesOptions\ ```ts -type QueriesOptions = TDepth["length"] extends MAXIMUM_DEPTH ? QueryObserverOptionsForCreateQueries[] : T extends [] ? [] : T extends [infer Head] ? [...TResult, GetOptions] : T extends [infer Head, ...(infer Tail)] ? QueriesOptions<[...Tail], [...TResult, GetOptions], [...TDepth, 1]> : ReadonlyArray extends T ? T : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverOptionsForCreateQueries[] : QueryObserverOptionsForCreateQueries[]; +type QueriesOptions = TDepth['length'] extends MAXIMUM_DEPTH + ? QueryObserverOptionsForCreateQueries[] + : T extends [] + ? [] + : T extends [infer Head] + ? [...TResult, GetOptions] + : T extends [infer Head, ...infer Tail] + ? QueriesOptions< + [...Tail], + [...TResult, GetOptions], + [...TDepth, 1] + > + : ReadonlyArray extends T + ? T + : T extends QueryObserverOptionsForCreateQueries< + infer TQueryFnData, + infer TError, + infer TData, + infer TQueryKey + >[] + ? QueryObserverOptionsForCreateQueries< + TQueryFnData, + TError, + TData, + TQueryKey + >[] + : QueryObserverOptionsForCreateQueries[] ``` Defined in: [inject-queries.ts:120](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L120) @@ -17,8 +43,8 @@ QueriesOptions reducer recursively unwraps function arguments to infer/enforce t ## Type Parameters -• **T** *extends* `any`[] +• **T** _extends_ `any`[] -• **TResult** *extends* `any`[] = \[\] +• **TResult** _extends_ `any`[] = \[\] -• **TDepth** *extends* `ReadonlyArray`\<`number`\> = \[\] +• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queriesresults.md b/docs/framework/angular/reference/type-aliases/queriesresults.md index eae0895ee3..b977f67923 100644 --- a/docs/framework/angular/reference/type-aliases/queriesresults.md +++ b/docs/framework/angular/reference/type-aliases/queriesresults.md @@ -8,7 +8,29 @@ title: QueriesResults # Type Alias: QueriesResults\ ```ts -type QueriesResults = TDepth["length"] extends MAXIMUM_DEPTH ? QueryObserverResult[] : T extends [] ? [] : T extends [infer Head] ? [...TResult, GetResults] : T extends [infer Head, ...(infer Tail)] ? QueriesResults<[...Tail], [...TResult, GetResults], [...TDepth, 1]> : T extends QueryObserverOptionsForCreateQueries[] ? QueryObserverResult[] : QueryObserverResult[]; +type QueriesResults = TDepth['length'] extends MAXIMUM_DEPTH + ? QueryObserverResult[] + : T extends [] + ? [] + : T extends [infer Head] + ? [...TResult, GetResults] + : T extends [infer Head, ...infer Tail] + ? QueriesResults< + [...Tail], + [...TResult, GetResults], + [...TDepth, 1] + > + : T extends QueryObserverOptionsForCreateQueries< + infer TQueryFnData, + infer TError, + infer TData, + any + >[] + ? QueryObserverResult< + unknown extends TData ? TQueryFnData : TData, + unknown extends TError ? DefaultError : TError + >[] + : QueryObserverResult[] ``` Defined in: [inject-queries.ts:162](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/inject-queries.ts#L162) @@ -17,8 +39,8 @@ QueriesResults reducer recursively maps type param to results ## Type Parameters -• **T** *extends* `any`[] +• **T** _extends_ `any`[] -• **TResult** *extends* `any`[] = \[\] +• **TResult** _extends_ `any`[] = \[\] -• **TDepth** *extends* `ReadonlyArray`\<`number`\> = \[\] +• **TDepth** _extends_ `ReadonlyArray`\<`number`\> = \[\] diff --git a/docs/framework/angular/reference/type-aliases/queryfeatures.md b/docs/framework/angular/reference/type-aliases/queryfeatures.md index 3bab4b9a36..8167e22cf3 100644 --- a/docs/framework/angular/reference/type-aliases/queryfeatures.md +++ b/docs/framework/angular/reference/type-aliases/queryfeatures.md @@ -8,9 +8,7 @@ title: QueryFeatures # Type Alias: QueryFeatures ```ts -type QueryFeatures = - | DeveloperToolsFeature - | PersistQueryClientFeature; +type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature ``` Defined in: [providers.ts:173](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/providers.ts#L173) diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md index 9061a58458..0d33355981 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdatainfiniteoptions.md @@ -8,7 +8,20 @@ title: UndefinedInitialDataInfiniteOptions # Type Alias: UndefinedInitialDataInfiniteOptions\ ```ts -type UndefinedInitialDataInfiniteOptions = CreateInfiniteQueryOptions & object; +type UndefinedInitialDataInfiniteOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +> = CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam +> & + object ``` Defined in: [infinite-query-options.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L13) @@ -18,7 +31,7 @@ Defined in: [infinite-query-options.ts:13](https://github.com/TanStack/query/blo ### initialData? ```ts -optional initialData: +optional initialData: | NonUndefinedGuard> | InitialDataFunction>>; ``` @@ -31,6 +44,6 @@ optional initialData: • **TData** = `InfiniteData`\<`TQueryFnData`\> -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md index 12037f13e7..3f5a06db66 100644 --- a/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md +++ b/docs/framework/angular/reference/type-aliases/undefinedinitialdataoptions.md @@ -8,7 +8,8 @@ title: UndefinedInitialDataOptions # Type Alias: UndefinedInitialDataOptions\ ```ts -type UndefinedInitialDataOptions = CreateQueryOptions & object; +type UndefinedInitialDataOptions = + CreateQueryOptions & object ``` Defined in: [query-options.ts:13](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L13) @@ -18,7 +19,7 @@ Defined in: [query-options.ts:13](https://github.com/TanStack/query/blob/main/pa ### initialData? ```ts -optional initialData: +optional initialData: | InitialDataFunction> | NonUndefinedGuard; ``` @@ -31,4 +32,4 @@ optional initialData: • **TData** = `TQueryFnData` -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` diff --git a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md index eebf0bb773..9634febe87 100644 --- a/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md +++ b/docs/framework/angular/reference/type-aliases/unusedskiptokeninfiniteoptions.md @@ -8,7 +8,23 @@ title: UnusedSkipTokenInfiniteOptions # Type Alias: UnusedSkipTokenInfiniteOptions\ ```ts -type UnusedSkipTokenInfiniteOptions = OmitKeyof, "queryFn"> & object; +type UnusedSkipTokenInfiniteOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam, +> = OmitKeyof< + CreateInfiniteQueryOptions< + TQueryFnData, + TError, + TData, + TQueryKey, + TPageParam + >, + 'queryFn' +> & + object ``` Defined in: [infinite-query-options.ts:34](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/infinite-query-options.ts#L34) @@ -29,6 +45,6 @@ optional queryFn: Exclude -• **TQueryKey** *extends* `QueryKey` = `QueryKey` +• **TQueryKey** _extends_ `QueryKey` = `QueryKey` • **TPageParam** = `unknown` diff --git a/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md b/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md index ec956c1148..d115842200 100644 --- a/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md +++ b/docs/framework/angular/reference/type-aliases/unusedskiptokenoptions.md @@ -8,7 +8,11 @@ title: UnusedSkipTokenOptions # Type Alias: UnusedSkipTokenOptions\ ```ts -type UnusedSkipTokenOptions = OmitKeyof, "queryFn"> & object; +type UnusedSkipTokenOptions = OmitKeyof< + CreateQueryOptions, + 'queryFn' +> & + object ``` Defined in: [query-options.ts:25](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/query-options.ts#L25) @@ -29,4 +33,4 @@ optional queryFn: Exclude Date: Fri, 12 Sep 2025 14:22:40 +0000 Subject: [PATCH 19/24] ci: apply automated fixes (attempt 2/3) --- .../interfaces/basemutationnarrowing.md | 16 ++++------------ 1 file changed, 4 insertions(+), 12 deletions(-) diff --git a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md index b85af9815f..8ea0f00f90 100644 --- a/docs/framework/angular/reference/interfaces/basemutationnarrowing.md +++ b/docs/framework/angular/reference/interfaces/basemutationnarrowing.md @@ -25,9 +25,7 @@ Defined in: [types.ts:183](https://github.com/TanStack/query/blob/main/packages/ ```ts isError: SignalFunction< - ( - this, - ) => this is CreateMutationResult< + (this) => this is CreateMutationResult< TData, TError, TVariables, @@ -55,9 +53,7 @@ Defined in: [types.ts:206](https://github.com/TanStack/query/blob/main/packages/ ```ts isIdle: SignalFunction< - ( - this, - ) => this is CreateMutationResult< + (this) => this is CreateMutationResult< TData, TError, TVariables, @@ -85,9 +81,7 @@ Defined in: [types.ts:240](https://github.com/TanStack/query/blob/main/packages/ ```ts isPending: SignalFunction< - ( - this, - ) => this is CreateMutationResult< + (this) => this is CreateMutationResult< TData, TError, TVariables, @@ -115,9 +109,7 @@ Defined in: [types.ts:223](https://github.com/TanStack/query/blob/main/packages/ ```ts isSuccess: SignalFunction< - ( - this, - ) => this is CreateMutationResult< + (this) => this is CreateMutationResult< TData, TError, TVariables, From 73c8099c1ea0f7d93e4e1642a6e9d62ada1bc0fa Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 12 Sep 2025 17:20:35 +0200 Subject: [PATCH 20/24] regenerate api reference docs --- .../reference/functions/mutationoptions.md | 46 ++++++++++++------- .../src/mutation-options.ts | 16 +++---- 2 files changed, 37 insertions(+), 25 deletions(-) diff --git a/docs/framework/angular/reference/functions/mutationoptions.md b/docs/framework/angular/reference/functions/mutationoptions.md index a253e82fe8..ba5a045ec9 100644 --- a/docs/framework/angular/reference/functions/mutationoptions.md +++ b/docs/framework/angular/reference/functions/mutationoptions.md @@ -21,17 +21,21 @@ export class QueriesService { mutationKey: ["updatePost", id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(["posts", id], newPost) }, }); } } -queries = inject(QueriesService) -idSignal = new Signal(0); -mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) +class ComponentOrService { + queries = inject(QueriesService) + id = signal(0) + mutation = injectMutation(() => this.queries.updatePost(this.id())) -mutation.mutate({ title: 'New Title' }) + save() { + this.mutation.mutate({ title: 'New Title' }) + } +} ``` ## Param @@ -44,7 +48,7 @@ The mutation options. function mutationOptions(options): WithRequired, "mutationKey"> ``` -Defined in: [mutation-options.ts:34](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L34) +Defined in: [mutation-options.ts:38](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L38) Allows to share and re-use mutation options in a type-safe way. @@ -60,17 +64,21 @@ export class QueriesService { mutationKey: ["updatePost", id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(["posts", id], newPost) }, }); } } -queries = inject(QueriesService) -idSignal = new Signal(0); -mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) +class ComponentOrService { + queries = inject(QueriesService) + id = signal(0) + mutation = injectMutation(() => this.queries.updatePost(this.id())) -mutation.mutate({ title: 'New Title' }) + save() { + this.mutation.mutate({ title: 'New Title' }) + } +} ``` ### Type Parameters @@ -109,7 +117,7 @@ The mutation options. function mutationOptions(options): Omit, "mutationKey"> ``` -Defined in: [mutation-options.ts:48](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L48) +Defined in: [mutation-options.ts:52](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L52) Allows to share and re-use mutation options in a type-safe way. @@ -125,17 +133,21 @@ export class QueriesService { mutationKey: ["updatePost", id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost); + this.queryClient.setQueryData(["posts", id], newPost) }, }); } } -queries = inject(QueriesService) -idSignal = new Signal(0); -mutation = injectMutation(() => this.queries.updatePost(this.idSignal())) +class ComponentOrService { + queries = inject(QueriesService) + id = signal(0) + mutation = injectMutation(() => this.queries.updatePost(this.id())) -mutation.mutate({ title: 'New Title' }) + save() { + this.mutation.mutate({ title: 'New Title' }) + } +} ``` ### Type Parameters diff --git a/packages/angular-query-experimental/src/mutation-options.ts b/packages/angular-query-experimental/src/mutation-options.ts index 61dfc242cb..b99608e151 100644 --- a/packages/angular-query-experimental/src/mutation-options.ts +++ b/packages/angular-query-experimental/src/mutation-options.ts @@ -26,10 +26,10 @@ import type { CreateMutationOptions } from './types' * queries = inject(QueriesService) * id = signal(0) * mutation = injectMutation(() => this.queries.updatePost(this.id())) - * } * - * save() { - * this.mutation.mutate({ title: 'New Title' }) + * save() { + * this.mutation.mutate({ title: 'New Title' }) + * } * } * ``` * @param options - The mutation options. @@ -86,13 +86,13 @@ export function mutationOptions< * } * * class ComponentOrService { - * queries = inject(QueriesService) - * id = signal(0) + * queries = inject(QueriesService) + * id = signal(0) * mutation = injectMutation(() => this.queries.updatePost(this.id())) - * } * - * save() { - * this.mutation.mutate({ title: 'New Title' }) + * save() { + * this.mutation.mutate({ title: 'New Title' }) + * } * } * ``` * @param options - The mutation options. From 7f8a863c7e80394e9854b9cc77f24cd60b7cddb5 Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 12 Sep 2025 17:22:00 +0200 Subject: [PATCH 21/24] formatting --- .../reference/functions/mutationoptions.md | 38 ++++++++++++------- 1 file changed, 24 insertions(+), 14 deletions(-) diff --git a/docs/framework/angular/reference/functions/mutationoptions.md b/docs/framework/angular/reference/functions/mutationoptions.md index ba5a045ec9..46e3844f40 100644 --- a/docs/framework/angular/reference/functions/mutationoptions.md +++ b/docs/framework/angular/reference/functions/mutationoptions.md @@ -13,17 +13,17 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost) + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } @@ -45,7 +45,12 @@ The mutation options. ## Call Signature ```ts -function mutationOptions(options): WithRequired, "mutationKey"> +function mutationOptions( + options, +): WithRequired< + CreateMutationOptions, + 'mutationKey' +> ``` Defined in: [mutation-options.ts:38](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L38) @@ -56,17 +61,17 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost) + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } @@ -114,7 +119,12 @@ The mutation options. ## Call Signature ```ts -function mutationOptions(options): Omit, "mutationKey"> +function mutationOptions( + options, +): Omit< + CreateMutationOptions, + 'mutationKey' +> ``` Defined in: [mutation-options.ts:52](https://github.com/TanStack/query/blob/main/packages/angular-query-experimental/src/mutation-options.ts#L52) @@ -125,17 +135,17 @@ Allows to share and re-use mutation options in a type-safe way. ```ts export class QueriesService { - private http = inject(HttpClient); + private http = inject(HttpClient) updatePost(id: number) { return mutationOptions({ mutationFn: (post: Post) => Promise.resolve(post), - mutationKey: ["updatePost", id], + mutationKey: ['updatePost', id], onSuccess: (newPost) => { // ^? newPost: Post - this.queryClient.setQueryData(["posts", id], newPost) + this.queryClient.setQueryData(['posts', id], newPost) }, - }); + }) } } From 6a46c1e78e5000bac15e99b2a3ec7c3bb66cf00f Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Fri, 12 Sep 2025 17:34:39 +0200 Subject: [PATCH 22/24] apply coderabbit suggestions --- packages/angular-query-experimental/src/mutation-options.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/angular-query-experimental/src/mutation-options.ts b/packages/angular-query-experimental/src/mutation-options.ts index b99608e151..ec702cb45c 100644 --- a/packages/angular-query-experimental/src/mutation-options.ts +++ b/packages/angular-query-experimental/src/mutation-options.ts @@ -8,7 +8,8 @@ import type { CreateMutationOptions } from './types' * * ```ts * export class QueriesService { - * private http = inject(HttpClient); + * private http = inject(HttpClient) + * private queryClient = inject(QueryClient) * * updatePost(id: number) { * return mutationOptions({ @@ -71,7 +72,8 @@ export function mutationOptions< * * ```ts * export class QueriesService { - * private http = inject(HttpClient); + * private http = inject(HttpClient) + * private queryClient = inject(QueryClient) * * updatePost(id: number) { * return mutationOptions({ From bc62387d44ce7ea6e25de30fc7aa6deb1542068f Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Sun, 14 Sep 2025 17:30:42 +0200 Subject: [PATCH 23/24] Improve unit tests --- ...roviders.test.ts => with-devtools.test.ts} | 216 +++++++++++++++++- 1 file changed, 205 insertions(+), 11 deletions(-) rename packages/angular-query-experimental/src/__tests__/{providers.test.ts => with-devtools.test.ts} (58%) diff --git a/packages/angular-query-experimental/src/__tests__/providers.test.ts b/packages/angular-query-experimental/src/__tests__/with-devtools.test.ts similarity index 58% rename from packages/angular-query-experimental/src/__tests__/providers.test.ts rename to packages/angular-query-experimental/src/__tests__/with-devtools.test.ts index d1b45aa62a..7091f5a0c2 100644 --- a/packages/angular-query-experimental/src/__tests__/providers.test.ts +++ b/packages/angular-query-experimental/src/__tests__/with-devtools.test.ts @@ -4,6 +4,7 @@ import { TestBed } from '@angular/core/testing' import { ENVIRONMENT_INITIALIZER, EnvironmentInjector, + InjectionToken, PLATFORM_ID, createEnvironmentInjector, isDevMode, @@ -53,55 +54,57 @@ describe('withDevtools feature', () => { afterEach(() => { vi.restoreAllMocks() + vi.useRealTimers() + TestBed.resetTestingModule() }) test.each([ { - description: 'should load developer tools in development mode', + description: 'should load devtools in development mode', isDevMode: true, expectedCalled: true, }, { - description: 'should not load developer tools in production mode', + description: 'should not load devtools in production mode', isDevMode: false, expectedCalled: false, }, { - description: `should load developer tools in development mode when 'loadDevtools' is set to 'auto'`, + description: `should load devtools in development mode when 'loadDevtools' is set to 'auto'`, isDevMode: true, loadDevtools: 'auto', expectedCalled: true, }, { - description: `should not load developer tools in production mode when 'loadDevtools' is set to 'auto'`, + description: `should not load devtools in production mode when 'loadDevtools' is set to 'auto'`, isDevMode: false, loadDevtools: 'auto', expectedCalled: false, }, { description: - "should load developer tools in development mode when 'loadDevtools' is set to true", + "should load devtools in development mode when 'loadDevtools' is set to true", isDevMode: true, loadDevtools: true, expectedCalled: true, }, { description: - "should load developer tools in production mode when 'loadDevtools' is set to true", + "should load devtools in production mode when 'loadDevtools' is set to true", isDevMode: false, loadDevtools: true, expectedCalled: true, }, { description: - "should not load developer tools in development mode when 'loadDevtools' is set to false", + "should not load devtools in development mode when 'loadDevtools' is set to false", isDevMode: true, loadDevtools: false, expectedCalled: false, }, { description: - "should not load developer tools in production mode when 'loadDevtools' is set to false", + "should not load devtools in production mode when 'loadDevtools' is set to false", isDevMode: false, loadDevtools: false, expectedCalled: false, @@ -139,8 +142,10 @@ describe('withDevtools feature', () => { if (expectedCalled) { expect(mockTanstackQueryDevtools).toHaveBeenCalled() + expect(mockDevtoolsInstance.mount).toHaveBeenCalled() } else { expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() + expect(mockDevtoolsInstance.mount).not.toHaveBeenCalled() } }, ) @@ -162,6 +167,7 @@ describe('withDevtools feature', () => { // Destroys injector TestBed.resetTestingModule() await vi.advanceTimersByTimeAsync(0) + await vi.dynamicImportSettled() expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() }) @@ -247,16 +253,21 @@ describe('withDevtools feature', () => { expect(mockDevtoolsInstance.setErrorTypes).toHaveBeenCalledTimes(0) - errorTypes.set([ + const newErrorTypes = [ { name: '', initializer: () => new Error(), }, - ]) + ] + + errorTypes.set(newErrorTypes) TestBed.tick() expect(mockDevtoolsInstance.setErrorTypes).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.setErrorTypes).toHaveBeenCalledWith( + newErrorTypes, + ) }) it('should update client', async () => { @@ -282,11 +293,13 @@ describe('withDevtools feature', () => { expect(mockDevtoolsInstance.setClient).toHaveBeenCalledTimes(0) - client.set(new QueryClient()) + const newClient = new QueryClient() + client.set(newClient) TestBed.tick() expect(mockDevtoolsInstance.setClient).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.setClient).toHaveBeenCalledWith(newClient) }) it('should update position', async () => { @@ -317,6 +330,7 @@ describe('withDevtools feature', () => { TestBed.tick() expect(mockDevtoolsInstance.setPosition).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.setPosition).toHaveBeenCalledWith('left') }) it('should update button position', async () => { @@ -347,6 +361,9 @@ describe('withDevtools feature', () => { TestBed.tick() expect(mockDevtoolsInstance.setButtonPosition).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.setButtonPosition).toHaveBeenCalledWith( + 'bottom-right', + ) }) it('should update initialIsOpen', async () => { @@ -377,6 +394,7 @@ describe('withDevtools feature', () => { TestBed.tick() expect(mockDevtoolsInstance.setInitialIsOpen).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.setInitialIsOpen).toHaveBeenCalledWith(true) }) it('should destroy devtools', async () => { @@ -406,4 +424,180 @@ describe('withDevtools feature', () => { expect(mockDevtoolsInstance.unmount).toHaveBeenCalledTimes(1) }) + + it('should unmount devtools when injector is destroyed', async () => { + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(() => ({ + loadDevtools: true, + })), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.advanceTimersByTimeAsync(0) + TestBed.tick() + await vi.dynamicImportSettled() + + expect(mockTanstackQueryDevtools).toHaveBeenCalled() + expect(mockDevtoolsInstance.mount).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.unmount).toHaveBeenCalledTimes(0) + + // Destroy the injector + TestBed.resetTestingModule() + + expect(mockDevtoolsInstance.unmount).toHaveBeenCalledTimes(1) + }) + + it('should remount devtools when toggled from false to true', async () => { + const loadDevtools = signal(false) + + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(() => ({ + loadDevtools: loadDevtools(), + })), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.advanceTimersByTimeAsync(0) + + expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() + expect(mockDevtoolsInstance.mount).not.toHaveBeenCalled() + + loadDevtools.set(true) + TestBed.tick() + await vi.dynamicImportSettled() + + expect(mockTanstackQueryDevtools).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.mount).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.unmount).not.toHaveBeenCalled() + + loadDevtools.set(false) + TestBed.tick() + + expect(mockDevtoolsInstance.unmount).toHaveBeenCalledTimes(1) + expect(mockDevtoolsInstance.mount).toHaveBeenCalledTimes(1) + + loadDevtools.set(true) + TestBed.tick() + await vi.dynamicImportSettled() + + // Should remount (mount called twice now) + expect(mockDevtoolsInstance.mount).toHaveBeenCalledTimes(2) + expect(mockDevtoolsInstance.unmount).toHaveBeenCalledTimes(1) + }) + + describe('deps parameter', () => { + it('should inject dependencies and pass them to withDevtoolsFn in correct order', async () => { + const mockService1 = { value: 'service1' } + const mockService2 = { value: 'service2' } + const mockService1Token = new InjectionToken('MockService1') + const mockService2Token = new InjectionToken('MockService2') + const withDevtoolsFn = vi.fn().mockReturnValue({ loadDevtools: true }) + + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + { + provide: mockService1Token, + useValue: mockService1, + }, + { + provide: mockService2Token, + useValue: mockService2, + }, + provideTanStackQuery( + new QueryClient(), + withDevtools(withDevtoolsFn, { + deps: [mockService1Token, mockService2Token], + }), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.advanceTimersByTimeAsync(0) + + expect(withDevtoolsFn).toHaveBeenCalledWith(mockService1, mockService2) + }) + + it('should work with empty deps array', async () => { + const withDevtoolsFn = vi.fn().mockReturnValue({ loadDevtools: true }) + + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + provideTanStackQuery( + new QueryClient(), + withDevtools(withDevtoolsFn, { + deps: [], + }), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.advanceTimersByTimeAsync(0) + + expect(withDevtoolsFn).toHaveBeenCalledWith() + }) + + it('should reactively update when injected services change', async () => { + class ReactiveService { + enabled = signal(false) + position = signal('bottom') + } + + const withDevtoolsFn = (service: ReactiveService) => ({ + loadDevtools: service.enabled(), + position: service.position(), + }) + + TestBed.configureTestingModule({ + providers: [ + provideZonelessChangeDetection(), + ReactiveService, + provideTanStackQuery( + new QueryClient(), + withDevtools(withDevtoolsFn, { + deps: [ReactiveService], + }), + ), + ], + }) + + TestBed.inject(ENVIRONMENT_INITIALIZER) + await vi.advanceTimersByTimeAsync(0) + + const service = TestBed.inject(ReactiveService) + + expect(mockTanstackQueryDevtools).not.toHaveBeenCalled() + + service.enabled.set(true) + TestBed.tick() + await vi.dynamicImportSettled() + + expect(mockTanstackQueryDevtools).toHaveBeenCalledTimes(1) + expect(mockTanstackQueryDevtools).toHaveBeenCalledWith( + expect.objectContaining({ + position: 'bottom', + }), + ) + + service.position.set('top') + TestBed.tick() + + expect(mockDevtoolsInstance.setPosition).toHaveBeenCalledWith('top') + }) + }) }) From 8813efb1bbaac7fb321bdf886ee6edbc99f31ccb Mon Sep 17 00:00:00 2001 From: Arnoud de Vries <6420061+arnoud-dv@users.noreply.github.com> Date: Mon, 15 Sep 2025 22:38:27 +0200 Subject: [PATCH 24/24] docs --- docs/framework/angular/devtools.md | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/docs/framework/angular/devtools.md b/docs/framework/angular/devtools.md index f7705c1ce6..c0cfb9141c 100644 --- a/docs/framework/angular/devtools.md +++ b/docs/framework/angular/devtools.md @@ -40,7 +40,7 @@ import { withDevtools } from '@tanstack/angular-query-experimental/devtools/prod To control when devtools are loaded, you can use the `loadDevtools` option. -When not setting the option or setting it to 'auto', the devtools will be loaded automatically when Angular runs in development mode. +When not setting the option or setting it to 'auto', the devtools will be loaded automatically only when Angular runs in development mode. ```ts import { withDevtools } from '@tanstack/angular-query-experimental/devtools' @@ -83,8 +83,6 @@ provideTanStackQuery( Options are passed to `withDevtools` from a callback function to support reactivity through signals. In the following example a signal is created from a RxJS observable that emits on a keyboard shortcut. When the derived signal is set to true, the devtools are lazily loaded. -> If you don't need devtools in production builds, don't use the `production` sub-path. Even though most of the devtools are lazy loaded on-demand, code is needed for on-demand loading and option handling. When importing devtools from `@tanstack/angular-query-experimental/devtools`, all devtools code will be excluded from your build and no lazy chunks will be created, minimizing deployment size. - The example below always loads devtools in development mode and loads on-demand in production mode when a keyboard shortcut is pressed. ```ts