@tanstack/angular-query-experimental
Version:
Signals for managing, caching and syncing asynchronous and remote data in Angular
1 lines • 6.67 kB
Source Map (JSON)
{"version":3,"file":"providers.mjs","sources":["../src/providers.ts"],"sourcesContent":["import { DestroyRef, InjectionToken, inject } from '@angular/core'\nimport { QueryClient } from '@tanstack/query-core'\nimport type { Provider } from '@angular/core'\n\n/**\n * Usually {@link provideTanStackQuery} is used once to set up TanStack Query and the\n * {@link https://tanstack.com/query/latest/docs/reference/QueryClient|QueryClient}\n * for the entire application. Internally it calls `provideQueryClient`.\n * You can use `provideQueryClient` to provide a different `QueryClient` instance for a part\n * of the application or for unit testing purposes.\n * @param queryClient - A `QueryClient` instance, or an `InjectionToken` which provides a `QueryClient`.\n * @returns a provider object that can be used to provide the `QueryClient` instance.\n */\nexport function provideQueryClient(\n queryClient: QueryClient | InjectionToken<QueryClient>,\n): Provider {\n return {\n provide: QueryClient,\n useFactory: () => {\n const client =\n queryClient instanceof InjectionToken\n ? inject(queryClient)\n : queryClient\n // Unmount the query client on injector destroy\n inject(DestroyRef).onDestroy(() => client.unmount())\n client.mount()\n return client\n },\n }\n}\n\n/**\n * Sets up providers necessary to enable TanStack Query functionality for Angular applications.\n *\n * Allows to configure a `QueryClient` and optional features such as developer tools.\n *\n * **Example - standalone**\n *\n * ```ts\n * import {\n * provideTanStackQuery,\n * QueryClient,\n * } from '@tanstack/angular-query-experimental'\n *\n * bootstrapApplication(AppComponent, {\n * providers: [provideTanStackQuery(new QueryClient())],\n * })\n * ```\n *\n * **Example - NgModule-based**\n *\n * ```ts\n * import {\n * provideTanStackQuery,\n * QueryClient,\n * } from '@tanstack/angular-query-experimental'\n *\n * @NgModule({\n * declarations: [AppComponent],\n * imports: [BrowserModule],\n * providers: [provideTanStackQuery(new QueryClient())],\n * bootstrap: [AppComponent],\n * })\n * export class AppModule {}\n * ```\n *\n * You can also enable optional developer tools by adding `withDevtools`. By\n * default the tools will then be loaded when your app is in development mode.\n * ```ts\n * import {\n * provideTanStackQuery,\n * withDevtools\n * QueryClient,\n * } from '@tanstack/angular-query-experimental'\n *\n * bootstrapApplication(AppComponent,\n * {\n * providers: [\n * provideTanStackQuery(new QueryClient(), withDevtools())\n * ]\n * }\n * )\n * ```\n *\n * **Example: using an InjectionToken**\n *\n * ```ts\n * export const MY_QUERY_CLIENT = new InjectionToken('', {\n * factory: () => new QueryClient(),\n * })\n *\n * // In a lazy loaded route or lazy loaded component's providers array:\n * providers: [provideTanStackQuery(MY_QUERY_CLIENT)]\n * ```\n * Using an InjectionToken for the QueryClient is an advanced optimization which allows TanStack Query to be absent from the main application bundle.\n * This can be beneficial if you want to include TanStack Query on lazy loaded routes only while still sharing a `QueryClient`.\n *\n * Note that this is a small optimization and for most applications it's preferable to provide the `QueryClient` in the main application config.\n * @param queryClient - A `QueryClient` instance, or an `InjectionToken` which provides a `QueryClient`.\n * @param features - Optional features to configure additional Query functionality.\n * @returns A set of providers to set up TanStack Query.\n * @see https://tanstack.com/query/v5/docs/framework/angular/quick-start\n * @see withDevtools\n */\nexport function provideTanStackQuery(\n queryClient: QueryClient | InjectionToken<QueryClient>,\n ...features: Array<QueryFeatures>\n): Array<Provider> {\n return [\n provideQueryClient(queryClient),\n features.map((feature) => feature.ɵproviders),\n ]\n}\n\n/**\n * Sets up providers necessary to enable TanStack Query functionality for Angular applications.\n *\n * Allows to configure a `QueryClient`.\n * @param queryClient - A `QueryClient` instance.\n * @returns A set of providers to set up TanStack Query.\n * @see https://tanstack.com/query/v5/docs/framework/angular/quick-start\n * @deprecated Use `provideTanStackQuery` instead.\n */\nexport function provideAngularQuery(queryClient: QueryClient): Array<Provider> {\n return provideTanStackQuery(queryClient)\n}\n\nconst queryFeatures = ['Devtools', 'PersistQueryClient'] as const\n\ntype QueryFeatureKind = (typeof queryFeatures)[number]\n\n/**\n * Helper type to represent a Query feature.\n */\nexport interface QueryFeature<TFeatureKind extends QueryFeatureKind> {\n ɵkind: TFeatureKind\n ɵproviders: Array<Provider>\n}\n\n/**\n * Helper function to create an object that represents a Query feature.\n * @param kind -\n * @param providers -\n * @returns A Query feature.\n */\nexport function queryFeature<TFeatureKind extends QueryFeatureKind>(\n kind: TFeatureKind,\n providers: Array<Provider>,\n): QueryFeature<TFeatureKind> {\n return { ɵkind: kind, ɵproviders: providers }\n}\n\n/**\n * A type alias that represents a feature which enables developer tools.\n * The type is used to describe the return value of the `withDevtools` function.\n * @see {@link withDevtools}\n */\nexport type DeveloperToolsFeature = QueryFeature<'Devtools'>\n\n/**\n * A type alias that represents a feature which enables persistence.\n * The type is used to describe the return value of the `withPersistQueryClient` function.\n */\nexport type PersistQueryClientFeature = QueryFeature<'PersistQueryClient'>\n\n/**\n * A type alias that represents all Query features available for use with `provideTanStackQuery`.\n * Features can be enabled by adding special functions to the `provideTanStackQuery` call.\n * See documentation for each symbol to find corresponding function name. See also `provideTanStackQuery`\n * documentation on how to use those functions.\n * @see {@link provideTanStackQuery}\n */\nexport type QueryFeatures = DeveloperToolsFeature | PersistQueryClientFeature\n"],"names":[],"mappings":";;AAaO,SAAS,mBACd,aACU;AACH,SAAA;AAAA,IACL,SAAS;AAAA,IACT,YAAY,MAAM;AAChB,YAAM,SACJ,uBAAuB,iBACnB,OAAO,WAAW,IAClB;AAEN,aAAO,UAAU,EAAE,UAAU,MAAM,OAAO,SAAS;AACnD,aAAO,MAAM;AACN,aAAA;AAAA,IAAA;AAAA,EAEX;AACF;AA2EgB,SAAA,qBACd,gBACG,UACc;AACV,SAAA;AAAA,IACL,mBAAmB,WAAW;AAAA,IAC9B,SAAS,IAAI,CAAC,YAAY,QAAQ,UAAU;AAAA,EAC9C;AACF;AAWO,SAAS,oBAAoB,aAA2C;AAC7E,SAAO,qBAAqB,WAAW;AACzC;AAoBgB,SAAA,aACd,MACA,WAC4B;AAC5B,SAAO,EAAE,OAAO,MAAM,YAAY,UAAU;AAC9C;"}