@tanstack/angular-query-experimental 5.103.1 → 5.103.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/create-base-query.d.mts +169 -0
- package/dist/create-base-query.d.mts.map +1 -0
- package/dist/create-base-query.mjs +91 -0
- package/dist/create-base-query.mjs.map +1 -0
- package/dist/devtools/index.d.mts +3 -0
- package/dist/devtools/index.mjs +2 -0
- package/dist/devtools/production/index.d.mts +4 -0
- package/dist/devtools/production/index.mjs +2 -0
- package/dist/devtools/stub.d.mts +6 -0
- package/dist/devtools/stub.d.mts.map +1 -0
- package/dist/devtools/stub.mjs +9 -0
- package/dist/devtools/stub.mjs.map +1 -0
- package/dist/devtools/types.d.mts +107 -0
- package/dist/devtools/types.d.mts.map +1 -0
- package/dist/devtools/types.mjs +1 -0
- package/{devtools/with-devtools.d.ts → dist/devtools/with-devtools.d.mts} +6 -2
- package/dist/devtools/with-devtools.d.mts.map +1 -0
- package/dist/devtools/with-devtools.mjs +110 -0
- package/dist/devtools/with-devtools.mjs.map +1 -0
- package/dist/devtools-panel/index.d.mts +3 -0
- package/dist/devtools-panel/index.mjs +2 -0
- package/{devtools-panel/inject-devtools-panel.d.ts → dist/devtools-panel/inject-devtools-panel.d.mts} +6 -2
- package/dist/devtools-panel/inject-devtools-panel.d.mts.map +1 -0
- package/dist/devtools-panel/inject-devtools-panel.mjs +67 -0
- package/dist/devtools-panel/inject-devtools-panel.mjs.map +1 -0
- package/dist/devtools-panel/production/index.d.mts +4 -0
- package/dist/devtools-panel/production/index.mjs +2 -0
- package/dist/devtools-panel/stub.d.mts +6 -0
- package/dist/devtools-panel/stub.d.mts.map +1 -0
- package/dist/devtools-panel/stub.mjs +7 -0
- package/dist/devtools-panel/stub.mjs.map +1 -0
- package/dist/devtools-panel/types.d.mts +52 -0
- package/dist/devtools-panel/types.d.mts.map +1 -0
- package/dist/devtools-panel/types.mjs +1 -0
- package/dist/index.d.mts +16 -0
- package/{index.mjs → dist/index.mjs} +8 -21
- package/dist/index.mjs.map +1 -0
- package/{infinite-query-options.d.ts → dist/infinite-query-options.d.mts} +35 -31
- package/dist/infinite-query-options.d.mts.map +1 -0
- package/dist/infinite-query-options.mjs +8 -0
- package/dist/infinite-query-options.mjs.map +1 -0
- package/{inject-infinite-query.d.ts → dist/inject-infinite-query.d.mts} +18 -14
- package/dist/inject-infinite-query.d.mts.map +1 -0
- package/dist/inject-infinite-query.mjs +13 -0
- package/dist/inject-infinite-query.mjs.map +1 -0
- package/{inject-is-fetching.d.ts → dist/inject-is-fetching.d.mts} +14 -10
- package/dist/inject-is-fetching.d.mts.map +1 -0
- package/dist/inject-is-fetching.mjs +69 -0
- package/dist/inject-is-fetching.mjs.map +1 -0
- package/{inject-is-mutating.d.ts → dist/inject-is-mutating.d.mts} +14 -10
- package/dist/inject-is-mutating.d.mts.map +1 -0
- package/dist/inject-is-mutating.mjs +52 -0
- package/dist/inject-is-mutating.mjs.map +1 -0
- package/{inject-is-restoring.d.ts → dist/inject-is-restoring.d.mts} +13 -10
- package/dist/inject-is-restoring.d.mts.map +1 -0
- package/dist/inject-is-restoring.mjs +35 -0
- package/dist/inject-is-restoring.mjs.map +1 -0
- package/{inject-mutation-state.d.ts → dist/inject-mutation-state.d.mts} +16 -13
- package/dist/inject-mutation-state.d.mts.map +1 -0
- package/dist/inject-mutation-state.mjs +103 -0
- package/dist/inject-mutation-state.mjs.map +1 -0
- package/{inject-mutation.d.ts → dist/inject-mutation.d.mts} +15 -11
- package/dist/inject-mutation.d.mts.map +1 -0
- package/dist/inject-mutation.mjs +226 -0
- package/dist/inject-mutation.mjs.map +1 -0
- package/dist/inject-queries-experimental/index.d.mts +2 -0
- package/dist/inject-queries-experimental/index.mjs +2 -0
- package/{inject-queries.d.ts → dist/inject-queries.d.mts} +36 -55
- package/dist/inject-queries.d.mts.map +1 -0
- package/dist/inject-queries.mjs +203 -0
- package/dist/inject-queries.mjs.map +1 -0
- package/{inject-query-client.d.ts → dist/inject-query-client.d.mts} +8 -4
- package/dist/inject-query-client.d.mts.map +1 -0
- package/dist/inject-query-client.mjs +23 -0
- package/dist/inject-query-client.mjs.map +1 -0
- package/{inject-query.d.ts → dist/inject-query.d.mts} +18 -14
- package/dist/inject-query.d.mts.map +1 -0
- package/dist/inject-query.mjs +12 -0
- package/dist/inject-query.mjs.map +1 -0
- package/{mutation-options.d.ts → dist/mutation-options.d.mts} +8 -4
- package/dist/mutation-options.d.mts.map +1 -0
- package/dist/mutation-options.mjs +8 -0
- package/dist/mutation-options.mjs.map +1 -0
- package/dist/pending-tasks-compat.d.mts +10 -0
- package/dist/pending-tasks-compat.d.mts.map +1 -0
- package/dist/pending-tasks-compat.mjs +13 -0
- package/dist/pending-tasks-compat.mjs.map +1 -0
- package/{providers.d.ts → dist/providers.d.mts} +16 -13
- package/dist/providers.d.mts.map +1 -0
- package/dist/providers.mjs +124 -0
- package/dist/providers.mjs.map +1 -0
- package/{query-options.d.ts → dist/query-options.d.mts} +41 -37
- package/dist/query-options.d.mts.map +1 -0
- package/dist/query-options.mjs +8 -0
- package/dist/query-options.mjs.map +1 -0
- package/dist/signal-proxy.d.mts +13 -0
- package/dist/signal-proxy.d.mts.map +1 -0
- package/dist/signal-proxy.mjs +35 -0
- package/dist/signal-proxy.mjs.map +1 -0
- package/{types.d.ts → dist/types.d.mts} +36 -37
- package/dist/types.d.mts.map +1 -0
- package/dist/types.mjs +6 -0
- package/dist/types.mjs.map +1 -0
- package/package.json +48 -20
- package/src/__tests__/infinite-query-options.test-d.ts +314 -0
- package/src/__tests__/infinite-query-options.test.ts +19 -0
- package/src/__tests__/inject-devtools-panel.test.ts +196 -0
- package/src/__tests__/inject-infinite-query.test-d.ts +66 -0
- package/src/__tests__/inject-infinite-query.test.ts +227 -0
- package/src/__tests__/inject-is-fetching.test.ts +108 -0
- package/src/__tests__/inject-is-mutating.test.ts +113 -0
- package/src/__tests__/inject-is-restoring.test.ts +93 -0
- package/src/__tests__/inject-mutation-state.test-d.ts +22 -0
- package/src/__tests__/inject-mutation-state.test.ts +198 -0
- package/src/__tests__/inject-mutation.test-d.ts +158 -0
- package/src/__tests__/inject-mutation.test.ts +1161 -0
- package/src/__tests__/inject-queries.test-d.ts +196 -0
- package/src/__tests__/inject-queries.test.ts +240 -0
- package/src/__tests__/inject-query.test-d.ts +357 -0
- package/src/__tests__/inject-query.test.ts +700 -0
- package/src/__tests__/mutation-options.test-d.ts +234 -0
- package/src/__tests__/mutation-options.test.ts +344 -0
- package/src/__tests__/pending-tasks.test.ts +644 -0
- package/src/__tests__/provide-query-client.test.ts +38 -0
- package/src/__tests__/provide-tanstack-query.test.ts +38 -0
- package/src/__tests__/query-options.test-d.ts +262 -0
- package/src/__tests__/query-options.test.ts +14 -0
- package/src/__tests__/signal-proxy.test.ts +27 -0
- package/src/__tests__/test-utils.ts +77 -0
- package/src/__tests__/with-devtools.test.ts +674 -0
- package/src/create-base-query.ts +175 -0
- package/src/devtools/index.ts +8 -0
- package/src/devtools/production/index.ts +1 -0
- package/src/devtools/stub.ts +7 -0
- package/src/devtools/types.ts +116 -0
- package/src/devtools/with-devtools.ts +182 -0
- package/src/devtools-panel/index.ts +8 -0
- package/src/devtools-panel/inject-devtools-panel.ts +110 -0
- package/src/devtools-panel/production/index.ts +1 -0
- package/src/devtools-panel/stub.ts +7 -0
- package/src/devtools-panel/types.ts +57 -0
- package/src/index.ts +60 -0
- package/src/infinite-query-options.ts +354 -0
- package/src/inject-infinite-query.ts +296 -0
- package/src/inject-is-fetching.ts +97 -0
- package/src/inject-is-mutating.ts +80 -0
- package/src/inject-is-restoring.ts +53 -0
- package/src/inject-mutation-state.ts +167 -0
- package/src/inject-mutation.ts +328 -0
- package/src/inject-queries-experimental/index.ts +1 -0
- package/src/inject-queries.ts +479 -0
- package/src/inject-query-client.ts +22 -0
- package/src/inject-query.ts +208 -0
- package/src/mutation-options.ts +121 -0
- package/src/pending-tasks-compat.ts +27 -0
- package/src/providers.ts +170 -0
- package/src/query-options.ts +292 -0
- package/src/signal-proxy.ts +46 -0
- package/src/types.ts +429 -0
- package/create-base-query.d.ts +0 -164
- package/create-base-query.mjs +0 -99
- package/create-base-query.mjs.map +0 -1
- package/devtools/index.d.ts +0 -2
- package/devtools/index.mjs +0 -5
- package/devtools/index.mjs.map +0 -1
- package/devtools/production/index.d.ts +0 -1
- package/devtools/stub.d.ts +0 -2
- package/devtools/stub.mjs +0 -8
- package/devtools/stub.mjs.map +0 -1
- package/devtools/types.d.ts +0 -100
- package/devtools/with-devtools.mjs +0 -106
- package/devtools/with-devtools.mjs.map +0 -1
- package/devtools-panel/index.d.ts +0 -2
- package/devtools-panel/index.mjs +0 -5
- package/devtools-panel/index.mjs.map +0 -1
- package/devtools-panel/inject-devtools-panel.mjs +0 -72
- package/devtools-panel/inject-devtools-panel.mjs.map +0 -1
- package/devtools-panel/production/index.d.ts +0 -1
- package/devtools-panel/stub.d.ts +0 -2
- package/devtools-panel/stub.mjs +0 -8
- package/devtools-panel/stub.mjs.map +0 -1
- package/devtools-panel/types.d.ts +0 -48
- package/index.d.ts +0 -25
- package/index.mjs.map +0 -1
- package/infinite-query-options.mjs +0 -7
- package/infinite-query-options.mjs.map +0 -1
- package/inject-infinite-query.mjs +0 -18
- package/inject-infinite-query.mjs.map +0 -1
- package/inject-is-fetching.mjs +0 -31
- package/inject-is-fetching.mjs.map +0 -1
- package/inject-is-mutating.mjs +0 -31
- package/inject-is-mutating.mjs.map +0 -1
- package/inject-is-restoring.mjs +0 -21
- package/inject-is-restoring.mjs.map +0 -1
- package/inject-mutation-state.mjs +0 -51
- package/inject-mutation-state.mjs.map +0 -1
- package/inject-mutation.mjs +0 -94
- package/inject-mutation.mjs.map +0 -1
- package/inject-queries-experimental/index.d.ts +0 -1
- package/inject-queries-experimental/index.mjs +0 -5
- package/inject-queries-experimental/index.mjs.map +0 -1
- package/inject-queries.mjs +0 -82
- package/inject-queries.mjs.map +0 -1
- package/inject-query-client.mjs +0 -9
- package/inject-query-client.mjs.map +0 -1
- package/inject-query.mjs +0 -14
- package/inject-query.mjs.map +0 -1
- package/mutation-options.mjs +0 -7
- package/mutation-options.mjs.map +0 -1
- package/pending-tasks-compat.d.ts +0 -7
- package/pending-tasks-compat.mjs +0 -19
- package/pending-tasks-compat.mjs.map +0 -1
- package/providers.mjs +0 -32
- package/providers.mjs.map +0 -1
- package/query-options.mjs +0 -7
- package/query-options.mjs.map +0 -1
- package/signal-proxy.d.ts +0 -11
- package/signal-proxy.mjs +0 -29
- package/signal-proxy.mjs.map +0 -1
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
import { DestroyRef, Injector, PLATFORM_ID, assertInInjectionContext, computed, effect, inject, runInInjectionContext, untracked } from "@angular/core";
|
|
2
|
+
import { QueryClient, onlineManager } from "@tanstack/query-core";
|
|
3
|
+
import { isPlatformBrowser } from "@angular/common";
|
|
4
|
+
//#region src/devtools-panel/inject-devtools-panel.ts
|
|
5
|
+
/**
|
|
6
|
+
* Inject a TanStack Query devtools panel and render it in the DOM.
|
|
7
|
+
*
|
|
8
|
+
* Devtools panel allows programmatic control over the devtools, for example if you want to render
|
|
9
|
+
* the devtools as part of your own devtools.
|
|
10
|
+
*
|
|
11
|
+
* Consider `withDevtools` instead if you don't need this.
|
|
12
|
+
* @param injectDevtoolsPanelFn - A function that returns devtools panel options.
|
|
13
|
+
* @param options - Additional configuration
|
|
14
|
+
* @returns DevtoolsPanelRef
|
|
15
|
+
* @see https://tanstack.com/query/v5/docs/framework/angular/devtools
|
|
16
|
+
*/
|
|
17
|
+
const injectDevtoolsPanel = (injectDevtoolsPanelFn, options) => {
|
|
18
|
+
!options?.injector && assertInInjectionContext(injectDevtoolsPanel);
|
|
19
|
+
const currentInjector = options?.injector ?? inject(Injector);
|
|
20
|
+
return runInInjectionContext(currentInjector, () => {
|
|
21
|
+
const destroyRef = inject(DestroyRef);
|
|
22
|
+
const isBrowser = isPlatformBrowser(inject(PLATFORM_ID));
|
|
23
|
+
const injectedClient = inject(QueryClient, { optional: true });
|
|
24
|
+
const queryOptions = computed(injectDevtoolsPanelFn);
|
|
25
|
+
let devtools = null;
|
|
26
|
+
const destroy = () => {
|
|
27
|
+
devtools?.unmount();
|
|
28
|
+
devtools = null;
|
|
29
|
+
};
|
|
30
|
+
if (!isBrowser) return { destroy };
|
|
31
|
+
effect(() => {
|
|
32
|
+
const { client = injectedClient, errorTypes = [], styleNonce, shadowDOMTarget, onClose, hostElement } = queryOptions();
|
|
33
|
+
untracked(() => {
|
|
34
|
+
if (!client) throw new Error("No QueryClient found");
|
|
35
|
+
if (!devtools && hostElement) import("@tanstack/query-devtools").then((queryDevtools) => {
|
|
36
|
+
devtools = new queryDevtools.TanstackQueryDevtoolsPanel({
|
|
37
|
+
client,
|
|
38
|
+
queryFlavor: "Angular Query",
|
|
39
|
+
version: "5",
|
|
40
|
+
buttonPosition: "bottom-left",
|
|
41
|
+
position: "bottom",
|
|
42
|
+
initialIsOpen: true,
|
|
43
|
+
errorTypes,
|
|
44
|
+
styleNonce,
|
|
45
|
+
shadowDOMTarget,
|
|
46
|
+
onClose,
|
|
47
|
+
onlineManager
|
|
48
|
+
});
|
|
49
|
+
devtools.mount(hostElement.nativeElement);
|
|
50
|
+
}).catch((error) => {
|
|
51
|
+
console.error("Install @tanstack/query-devtools or reinstall without --omit=optional.", error);
|
|
52
|
+
});
|
|
53
|
+
else if (devtools && hostElement) {
|
|
54
|
+
devtools.setClient(client);
|
|
55
|
+
devtools.setErrorTypes(errorTypes);
|
|
56
|
+
onClose && devtools.setOnClose(onClose);
|
|
57
|
+
} else if (devtools && !hostElement) destroy();
|
|
58
|
+
});
|
|
59
|
+
});
|
|
60
|
+
destroyRef.onDestroy(destroy);
|
|
61
|
+
return { destroy };
|
|
62
|
+
});
|
|
63
|
+
};
|
|
64
|
+
//#endregion
|
|
65
|
+
export { injectDevtoolsPanel };
|
|
66
|
+
|
|
67
|
+
//# sourceMappingURL=inject-devtools-panel.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inject-devtools-panel.mjs","names":[],"sources":["../../src/devtools-panel/inject-devtools-panel.ts"],"sourcesContent":["import {\n DestroyRef,\n Injector,\n PLATFORM_ID,\n assertInInjectionContext,\n computed,\n effect,\n inject,\n runInInjectionContext,\n untracked,\n} from '@angular/core'\nimport { QueryClient, onlineManager } from '@tanstack/query-core'\nimport { isPlatformBrowser } from '@angular/common'\nimport type { TanstackQueryDevtoolsPanel } from '@tanstack/query-devtools'\nimport type {\n DevtoolsPanelOptions,\n InjectDevtoolsPanel,\n InjectDevtoolsPanelOptions,\n} from './types'\n\n/**\n * Inject a TanStack Query devtools panel and render it in the DOM.\n *\n * Devtools panel allows programmatic control over the devtools, for example if you want to render\n * the devtools as part of your own devtools.\n *\n * Consider `withDevtools` instead if you don't need this.\n * @param injectDevtoolsPanelFn - A function that returns devtools panel options.\n * @param options - Additional configuration\n * @returns DevtoolsPanelRef\n * @see https://tanstack.com/query/v5/docs/framework/angular/devtools\n */\nexport const injectDevtoolsPanel: InjectDevtoolsPanel = (\n injectDevtoolsPanelFn: () => DevtoolsPanelOptions,\n options?: InjectDevtoolsPanelOptions,\n) => {\n !options?.injector && assertInInjectionContext(injectDevtoolsPanel)\n const currentInjector = options?.injector ?? inject(Injector)\n\n return runInInjectionContext(currentInjector, () => {\n const destroyRef = inject(DestroyRef)\n const isBrowser = isPlatformBrowser(inject(PLATFORM_ID))\n const injectedClient = inject(QueryClient, { optional: true })\n\n const queryOptions = computed(injectDevtoolsPanelFn)\n let devtools: TanstackQueryDevtoolsPanel | null = null\n\n const destroy = () => {\n devtools?.unmount()\n devtools = null\n }\n\n if (!isBrowser)\n return {\n destroy,\n }\n\n effect(() => {\n const {\n client = injectedClient,\n errorTypes = [],\n styleNonce,\n shadowDOMTarget,\n onClose,\n hostElement,\n } = queryOptions()\n\n untracked(() => {\n if (!client) throw new Error('No QueryClient found')\n if (!devtools && hostElement) {\n import('@tanstack/query-devtools')\n .then((queryDevtools) => {\n devtools = new queryDevtools.TanstackQueryDevtoolsPanel({\n client,\n queryFlavor: 'Angular Query',\n version: '5',\n buttonPosition: 'bottom-left',\n position: 'bottom',\n initialIsOpen: true,\n errorTypes,\n styleNonce,\n shadowDOMTarget,\n onClose,\n onlineManager,\n })\n devtools.mount(hostElement.nativeElement)\n })\n .catch((error) => {\n console.error(\n 'Install @tanstack/query-devtools or reinstall without --omit=optional.',\n error,\n )\n })\n } else if (devtools && hostElement) {\n devtools.setClient(client)\n devtools.setErrorTypes(errorTypes)\n onClose && devtools.setOnClose(onClose)\n } else if (devtools && !hostElement) {\n destroy()\n }\n })\n })\n\n destroyRef.onDestroy(destroy)\n\n return {\n destroy,\n }\n })\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAgCA,MAAa,uBACX,uBACA,YACG;CACH,CAAC,SAAS,YAAY,yBAAyB,mBAAmB;CAClE,MAAM,kBAAkB,SAAS,YAAY,OAAO,QAAQ;CAE5D,OAAO,sBAAsB,uBAAuB;EAClD,MAAM,aAAa,OAAO,UAAU;EACpC,MAAM,YAAY,kBAAkB,OAAO,WAAW,CAAC;EACvD,MAAM,iBAAiB,OAAO,aAAa,EAAE,UAAU,KAAK,CAAC;EAE7D,MAAM,eAAe,SAAS,qBAAqB;EACnD,IAAI,WAA8C;EAElD,MAAM,gBAAgB;GACpB,UAAU,QAAQ;GAClB,WAAW;EACb;EAEA,IAAI,CAAC,WACH,OAAO,EACL,QACF;EAEF,aAAa;GACX,MAAM,EACJ,SAAS,gBACT,aAAa,CAAC,GACd,YACA,iBACA,SACA,gBACE,aAAa;GAEjB,gBAAgB;IACd,IAAI,CAAC,QAAQ,MAAM,IAAI,MAAM,sBAAsB;IACnD,IAAI,CAAC,YAAY,aACf,OAAO,2BAA2B,CAC/B,MAAM,kBAAkB;KACvB,WAAW,IAAI,cAAc,2BAA2B;MACtD;MACA,aAAa;MACb,SAAS;MACT,gBAAgB;MAChB,UAAU;MACV,eAAe;MACf;MACA;MACA;MACA;MACA;KACF,CAAC;KACD,SAAS,MAAM,YAAY,aAAa;IAC1C,CAAC,CAAC,CACD,OAAO,UAAU;KAChB,QAAQ,MACN,0EACA,KACF;IACF,CAAC;SACE,IAAI,YAAY,aAAa;KAClC,SAAS,UAAU,MAAM;KACzB,SAAS,cAAc,UAAU;KACjC,WAAW,SAAS,WAAW,OAAO;IACxC,OAAO,IAAI,YAAY,CAAC,aACtB,QAAQ;GAEZ,CAAC;EACH,CAAC;EAED,WAAW,UAAU,OAAO;EAE5B,OAAO,EACL,QACF;CACF,CAAC;AACH"}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { DevtoolsPanelOptions, DevtoolsPanelRef, InjectDevtoolsPanel, InjectDevtoolsPanelOptions } from "../types.mjs";
|
|
2
|
+
import { injectDevtoolsPanel } from "../inject-devtools-panel.mjs";
|
|
3
|
+
import "../index.mjs";
|
|
4
|
+
export { type DevtoolsPanelOptions, type DevtoolsPanelRef, type InjectDevtoolsPanel, type InjectDevtoolsPanelOptions, injectDevtoolsPanel };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stub.d.mts","names":[],"sources":["../../src/devtools-panel/stub.ts"],"mappings":";;cAIa,qBAAqB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"stub.mjs","names":[],"sources":["../../src/devtools-panel/stub.ts"],"sourcesContent":["import { noop } from '@tanstack/query-core'\nimport type { InjectDevtoolsPanel } from './types'\n\n// Stub which replaces `injectDevtoolsPanel` in production builds\nexport const injectDevtoolsPanel: InjectDevtoolsPanel = () => ({\n destroy: noop,\n})\n"],"mappings":";;AAIA,MAAa,6BAAkD,EAC7D,SAAS,KACX"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { ElementRef, Injector } from "@angular/core";
|
|
2
|
+
import { QueryClient } from "@tanstack/query-core";
|
|
3
|
+
import { DevtoolsErrorType } from "@tanstack/query-devtools";
|
|
4
|
+
//#region src/devtools-panel/types.d.ts
|
|
5
|
+
interface InjectDevtoolsPanelOptions {
|
|
6
|
+
/**
|
|
7
|
+
* The `Injector` in which to create the devtools panel.
|
|
8
|
+
*
|
|
9
|
+
* If this is not provided, the current injection context will be used instead (via `inject`).
|
|
10
|
+
*/
|
|
11
|
+
injector?: Injector;
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* A devtools panel, which can be manually destroyed.
|
|
15
|
+
*/
|
|
16
|
+
interface DevtoolsPanelRef {
|
|
17
|
+
/**
|
|
18
|
+
* Destroy the panel, removing it from the DOM and stops listening to signal changes.
|
|
19
|
+
*/
|
|
20
|
+
destroy: () => void;
|
|
21
|
+
}
|
|
22
|
+
interface DevtoolsPanelOptions {
|
|
23
|
+
/**
|
|
24
|
+
* Custom instance of QueryClient
|
|
25
|
+
*/
|
|
26
|
+
client?: QueryClient;
|
|
27
|
+
/**
|
|
28
|
+
* Use this so you can define custom errors that can be shown in the devtools.
|
|
29
|
+
*/
|
|
30
|
+
errorTypes?: Array<DevtoolsErrorType>;
|
|
31
|
+
/**
|
|
32
|
+
* 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.
|
|
33
|
+
*/
|
|
34
|
+
styleNonce?: string;
|
|
35
|
+
/**
|
|
36
|
+
* Use this so you can attach the devtool's styles to specific element in the DOM.
|
|
37
|
+
*/
|
|
38
|
+
shadowDOMTarget?: ShadowRoot;
|
|
39
|
+
/**
|
|
40
|
+
* Callback function that is called when the devtools panel is closed
|
|
41
|
+
*/
|
|
42
|
+
onClose?: () => void;
|
|
43
|
+
/**
|
|
44
|
+
* Element where to render the devtools panel. When set to undefined or null, the devtools panel will not be created, or destroyed if existing.
|
|
45
|
+
* If changed from undefined to an ElementRef, the devtools panel will be created.
|
|
46
|
+
*/
|
|
47
|
+
hostElement?: ElementRef;
|
|
48
|
+
}
|
|
49
|
+
type InjectDevtoolsPanel = (injectDevtoolsPanelFn: () => DevtoolsPanelOptions, options?: InjectDevtoolsPanelOptions) => DevtoolsPanelRef;
|
|
50
|
+
//#endregion
|
|
51
|
+
export { DevtoolsPanelOptions, DevtoolsPanelRef, InjectDevtoolsPanel, InjectDevtoolsPanelOptions };
|
|
52
|
+
//# sourceMappingURL=types.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.mts","names":[],"sources":["../../src/devtools-panel/types.ts"],"mappings":";;;;UAIiB;;;;;;EAMf,WAAW;;;;;UAMI;;;;EAIf;;UAGe;;;;EAIf,SAAS;;;;EAIT,aAAa,MAAM;;;;EAInB;;;;EAIA,kBAAkB;;;;EAKlB;;;;;EAMA,cAAc;;KAGJ,uBACV,6BAA6B,sBAC7B,UAAU,+BACP"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { BaseMutationNarrowing, BaseQueryNarrowing, CreateBaseMutationResult, CreateBaseQueryOptions, CreateBaseQueryResult, CreateInfiniteQueryOptions, CreateInfiniteQueryResult, CreateMutateAsyncFunction, CreateMutateFunction, CreateMutationOptions, CreateMutationResult, CreateQueryOptions, CreateQueryResult, DefinedCreateInfiniteQueryResult, DefinedCreateQueryResult } from "./types.mjs";
|
|
2
|
+
import { DevtoolsFeature, PersistQueryClientFeature, QueryFeature, QueryFeatures, provideAngularQuery, provideQueryClient, provideTanStackQuery, queryFeature } from "./providers.mjs";
|
|
3
|
+
import { DefinedInitialDataOptions, UndefinedInitialDataOptions, UnusedSkipTokenOptions, queryOptions } from "./query-options.mjs";
|
|
4
|
+
import { mutationOptions } from "./mutation-options.mjs";
|
|
5
|
+
import { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, UnusedSkipTokenInfiniteOptions, infiniteQueryOptions } from "./infinite-query-options.mjs";
|
|
6
|
+
import { InjectInfiniteQueryOptions, injectInfiniteQuery } from "./inject-infinite-query.mjs";
|
|
7
|
+
import { InjectIsFetchingOptions, injectIsFetching } from "./inject-is-fetching.mjs";
|
|
8
|
+
import { InjectIsMutatingOptions, injectIsMutating } from "./inject-is-mutating.mjs";
|
|
9
|
+
import { injectIsRestoring, provideIsRestoring } from "./inject-is-restoring.mjs";
|
|
10
|
+
import { InjectMutationOptions, injectMutation } from "./inject-mutation.mjs";
|
|
11
|
+
import { InjectMutationStateOptions, injectMutationState } from "./inject-mutation-state.mjs";
|
|
12
|
+
import { QueriesOptions, QueriesResults } from "./inject-queries.mjs";
|
|
13
|
+
import { InjectQueryOptions, injectQuery } from "./inject-query.mjs";
|
|
14
|
+
import { injectQueryClient } from "./inject-query-client.mjs";
|
|
15
|
+
export * from "@tanstack/query-core";
|
|
16
|
+
export { BaseMutationNarrowing, BaseQueryNarrowing, CreateBaseMutationResult, CreateBaseQueryOptions, CreateBaseQueryResult, CreateInfiniteQueryOptions, CreateInfiniteQueryResult, CreateMutateAsyncFunction, CreateMutateFunction, CreateMutationOptions, CreateMutationResult, CreateQueryOptions, CreateQueryResult, DefinedCreateInfiniteQueryResult, DefinedCreateQueryResult, type DefinedInitialDataInfiniteOptions, type DefinedInitialDataOptions, type DevtoolsFeature, type InjectInfiniteQueryOptions, type InjectIsFetchingOptions, type InjectIsMutatingOptions, type InjectMutationOptions, type InjectMutationStateOptions, type InjectQueryOptions, type PersistQueryClientFeature, type QueriesOptions, type QueriesResults, type QueryFeature, type QueryFeatures, type UndefinedInitialDataInfiniteOptions, type UndefinedInitialDataOptions, type UnusedSkipTokenInfiniteOptions, type UnusedSkipTokenOptions, infiniteQueryOptions, injectInfiniteQuery, injectIsFetching, injectIsMutating, injectIsRestoring, injectMutation, injectMutationState, injectQuery, injectQueryClient, mutationOptions, provideAngularQuery, provideIsRestoring, provideQueryClient, provideTanStackQuery, queryFeature, queryOptions };
|
|
@@ -1,32 +1,19 @@
|
|
|
1
|
-
|
|
1
|
+
import { injectIsRestoring, provideIsRestoring } from "./inject-is-restoring.mjs";
|
|
2
2
|
import { queryOptions } from "./query-options.mjs";
|
|
3
3
|
import { mutationOptions } from "./mutation-options.mjs";
|
|
4
4
|
import { infiniteQueryOptions } from "./infinite-query-options.mjs";
|
|
5
5
|
import { injectInfiniteQuery } from "./inject-infinite-query.mjs";
|
|
6
6
|
import { injectIsFetching } from "./inject-is-fetching.mjs";
|
|
7
7
|
import { injectIsMutating } from "./inject-is-mutating.mjs";
|
|
8
|
-
import { injectIsRestoring, provideIsRestoring } from "./inject-is-restoring.mjs";
|
|
9
8
|
import { injectMutation } from "./inject-mutation.mjs";
|
|
10
9
|
import { injectMutationState } from "./inject-mutation-state.mjs";
|
|
11
10
|
import { injectQuery } from "./inject-query.mjs";
|
|
12
11
|
import { injectQueryClient } from "./inject-query-client.mjs";
|
|
13
12
|
import { provideAngularQuery, provideQueryClient, provideTanStackQuery, queryFeature } from "./providers.mjs";
|
|
14
|
-
export
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
injectMutationState,
|
|
22
|
-
injectQuery,
|
|
23
|
-
injectQueryClient,
|
|
24
|
-
mutationOptions,
|
|
25
|
-
provideAngularQuery,
|
|
26
|
-
provideIsRestoring,
|
|
27
|
-
provideQueryClient,
|
|
28
|
-
provideTanStackQuery,
|
|
29
|
-
queryFeature,
|
|
30
|
-
queryOptions
|
|
31
|
-
};
|
|
32
|
-
//# sourceMappingURL=index.mjs.map
|
|
13
|
+
export * from "@tanstack/query-core";
|
|
14
|
+
//#region src/index.ts
|
|
15
|
+
/* istanbul ignore file */
|
|
16
|
+
//#endregion
|
|
17
|
+
export { infiniteQueryOptions, injectInfiniteQuery, injectIsFetching, injectIsMutating, injectIsRestoring, injectMutation, injectMutationState, injectQuery, injectQueryClient, mutationOptions, provideAngularQuery, provideIsRestoring, provideQueryClient, provideTanStackQuery, queryFeature, queryOptions };
|
|
18
|
+
|
|
19
|
+
//# sourceMappingURL=index.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.mjs","names":[],"sources":["../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\nexport * from './types'\n\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n UnusedSkipTokenOptions,\n} from './query-options'\nexport { queryOptions } from './query-options'\n\nexport type { CreateMutationOptions } from './types'\nexport { mutationOptions } from './mutation-options'\n\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n UnusedSkipTokenInfiniteOptions,\n} from './infinite-query-options'\nexport { infiniteQueryOptions } from './infinite-query-options'\n\nexport type { InjectInfiniteQueryOptions } from './inject-infinite-query'\nexport { injectInfiniteQuery } from './inject-infinite-query'\n\nexport type { InjectIsFetchingOptions } from './inject-is-fetching'\nexport { injectIsFetching } from './inject-is-fetching'\n\nexport type { InjectIsMutatingOptions } from './inject-is-mutating'\nexport { injectIsMutating } from './inject-is-mutating'\n\nexport { injectIsRestoring, provideIsRestoring } from './inject-is-restoring'\n\nexport type { InjectMutationOptions } from './inject-mutation'\nexport { injectMutation } from './inject-mutation'\n\nexport type { InjectMutationStateOptions } from './inject-mutation-state'\nexport { injectMutationState } from './inject-mutation-state'\n\nexport type { QueriesOptions, QueriesResults } from './inject-queries'\n\nexport type { InjectQueryOptions } from './inject-query'\nexport { injectQuery } from './inject-query'\n\nexport { injectQueryClient } from './inject-query-client'\n\nexport type {\n DevtoolsFeature,\n PersistQueryClientFeature,\n QueryFeature,\n QueryFeatures,\n} from './providers'\nexport {\n provideAngularQuery,\n provideQueryClient,\n provideTanStackQuery,\n queryFeature,\n} from './providers'\n"],"mappings":""}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { CreateInfiniteQueryOptions } from "./types.mjs";
|
|
2
|
+
import { DefaultError, InfiniteData, InitialDataFunction, NonUndefinedGuard, OmitKeyof, QueryKey, QueryKeyWithDataTag, SkipToken } from "@tanstack/query-core";
|
|
3
|
+
//#region src/infinite-query-options.d.ts
|
|
3
4
|
/**
|
|
4
5
|
* The options accepted by the `infiniteQueryOptions` overload selected when no `initialData` is set — `data`
|
|
5
6
|
* may be `undefined` while the query is `pending`.
|
|
@@ -11,15 +12,15 @@ import { CreateInfiniteQueryOptions } from './types.js';
|
|
|
11
12
|
* @template TQueryKey - The type of your `queryKey`.
|
|
12
13
|
* @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.
|
|
13
14
|
*/
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
15
|
+
type UndefinedInitialDataInfiniteOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown> = CreateInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & {
|
|
16
|
+
/**
|
|
17
|
+
* If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
|
|
18
|
+
* created or cached yet). If set to a function, the function will be called **once** during the shared/root
|
|
19
|
+
* query initialization, and be expected to synchronously return the initial data. Initial data is
|
|
20
|
+
* considered stale by default unless a `staleTime` has been set. `initialData` **is persisted** to the
|
|
21
|
+
* cache.
|
|
22
|
+
*/
|
|
23
|
+
initialData?: undefined | NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>> | InitialDataFunction<NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>>;
|
|
23
24
|
};
|
|
24
25
|
/**
|
|
25
26
|
* The options accepted by the `infiniteQueryOptions` overload selected when no `initialData` is set and
|
|
@@ -33,14 +34,14 @@ export type UndefinedInitialDataInfiniteOptions<TQueryFnData, TError = DefaultEr
|
|
|
33
34
|
* @template TQueryKey - The type of your `queryKey`.
|
|
34
35
|
* @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.
|
|
35
36
|
*/
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
37
|
+
type UnusedSkipTokenInfiniteOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown> = OmitKeyof<CreateInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>, 'queryFn'> & {
|
|
38
|
+
/**
|
|
39
|
+
* `skipToken` is not allowed as a value here — this overload is selected when no `initialData` is set. If
|
|
40
|
+
* you don't intend to run the query yet, set `enabled: false` — omitting `queryFn` alone still triggers a
|
|
41
|
+
* fetch that fails with "Missing queryFn" unless `enabled` is `false` or a default query function has been
|
|
42
|
+
* defined. A default query function only supplies `queryFn`; it doesn't defer the fetch on its own.
|
|
43
|
+
*/
|
|
44
|
+
queryFn?: Exclude<CreateInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>['queryFn'], SkipToken | undefined>;
|
|
44
45
|
};
|
|
45
46
|
/**
|
|
46
47
|
* The options accepted by the `infiniteQueryOptions` overload selected when `initialData` is set — `data` is
|
|
@@ -53,15 +54,15 @@ export type UnusedSkipTokenInfiniteOptions<TQueryFnData, TError = DefaultError,
|
|
|
53
54
|
* @template TQueryKey - The type of your `queryKey`.
|
|
54
55
|
* @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.
|
|
55
56
|
*/
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
57
|
+
type DefinedInitialDataInfiniteOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown> = CreateInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & {
|
|
58
|
+
/**
|
|
59
|
+
* If set, this value will be used as the initial data for the query cache (as long as the query hasn't been
|
|
60
|
+
* created or cached yet). If set to a function, the function will be called **once** during the shared/root
|
|
61
|
+
* query initialization, and be expected to synchronously return the initial data. Initial data is
|
|
62
|
+
* considered stale by default unless a `staleTime` has been set. `initialData` **is persisted** to the
|
|
63
|
+
* cache.
|
|
64
|
+
*/
|
|
65
|
+
initialData: NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>> | (() => NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>) | undefined;
|
|
65
66
|
};
|
|
66
67
|
/**
|
|
67
68
|
* You can generally pass everything to `infiniteQueryOptions` that you can also pass to
|
|
@@ -109,7 +110,7 @@ export type DefinedInitialDataInfiniteOptions<TQueryFnData, TError = DefaultErro
|
|
|
109
110
|
* }
|
|
110
111
|
* ```
|
|
111
112
|
*/
|
|
112
|
-
|
|
113
|
+
declare function infiniteQueryOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;
|
|
113
114
|
/**
|
|
114
115
|
* You can generally pass everything to `infiniteQueryOptions` that you can also pass to
|
|
115
116
|
* `injectInfiniteQuery`. These options can be shared across functions and imperative APIs such as
|
|
@@ -161,7 +162,7 @@ export declare function infiniteQueryOptions<TQueryFnData, TError = DefaultError
|
|
|
161
162
|
* @param options - The {@link UnusedSkipTokenInfiniteOptions} to use — everything you can pass to
|
|
162
163
|
* `injectInfiniteQuery`.
|
|
163
164
|
*/
|
|
164
|
-
|
|
165
|
+
declare function infiniteQueryOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: UnusedSkipTokenInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): UnusedSkipTokenInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;
|
|
165
166
|
/**
|
|
166
167
|
* You can generally pass everything to `infiniteQueryOptions` that you can also pass to
|
|
167
168
|
* `injectInfiniteQuery`. These options can be shared across functions and imperative APIs such as
|
|
@@ -213,4 +214,7 @@ export declare function infiniteQueryOptions<TQueryFnData, TError = DefaultError
|
|
|
213
214
|
* @param options - The {@link UndefinedInitialDataInfiniteOptions} to use — everything you can pass to
|
|
214
215
|
* `injectInfiniteQuery`.
|
|
215
216
|
*/
|
|
216
|
-
|
|
217
|
+
declare function infiniteQueryOptions<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam> & QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>;
|
|
218
|
+
//#endregion
|
|
219
|
+
export { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, UnusedSkipTokenInfiniteOptions, infiniteQueryOptions };
|
|
220
|
+
//# sourceMappingURL=infinite-query-options.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"infinite-query-options.d.mts","names":[],"sources":["../src/infinite-query-options.ts"],"mappings":";;;;;;;;;;;;;;KAuBY,oCACV,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,wBACE,2BACF,cACA,QACA,OACA,WACA;;;;;;;;EASA,0BAEI,kBAAkB,aAAa,cAAc,eAC7C,oBACE,kBAAkB,aAAa,cAAc;;;;;;;;;;;;;;KAgBzC,+BACV,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,wBACE,UACF,2BACE,cACA,QACA,OACA,WACA;;;;;;;EAUF,UAAU,QACR,2BACE,cACA,QACA,OACA,WACA,wBAEF;;;;;;;;;;;;;KAeQ,kCACV,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,wBACE,2BACF,cACA,QACA,OACA,WACA;;;;;;;;EASA,aACI,kBAAkB,aAAa,cAAc,sBACtC,kBAAkB,aAAa,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAkD1C,qBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,SAAS,kCACP,cACA,QACA,OACA,WACA,cAED,kCACD,cACA,QACA,OACA,WACA,cAEA,oBAAoB,WAAW,aAAa,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAqD7C,qBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,SAAS,+BACP,cACA,QACA,OACA,WACA,cAED,+BACD,cACA,QACA,OACA,WACA,cAEA,oBAAoB,WAAW,aAAa,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAqD7C,qBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,SAAS,oCACP,cACA,QACA,OACA,WACA,cAED,oCACD,cACA,QACA,OACA,WACA,cAEA,oBAAoB,WAAW,aAAa,eAAe"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"infinite-query-options.mjs","names":[],"sources":["../src/infinite-query-options.ts"],"sourcesContent":["import type {\n DefaultError,\n InfiniteData,\n InitialDataFunction,\n NonUndefinedGuard,\n OmitKeyof,\n QueryKey,\n QueryKeyWithDataTag,\n SkipToken,\n} from '@tanstack/query-core'\nimport type { CreateInfiniteQueryOptions } from './types'\n\n/**\n * The options accepted by the `infiniteQueryOptions` overload selected when no `initialData` is set — `data`\n * may be `undefined` while the query is `pending`.\n *\n * @template TQueryFnData - The type of a single page, as your `queryFn` resolves it.\n * @template TError - The type of errors your `queryFn` may throw.\n * @template TData - The type `data` ends up as after `select` runs — defaults to `InfiniteData<TQueryFnData>`,\n * the shape of all fetched pages plus their page params.\n * @template TQueryKey - The type of your `queryKey`.\n * @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.\n */\nexport type UndefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n> = CreateInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n> & {\n /**\n * If set, this value will be used as the initial data for the query cache (as long as the query hasn't been\n * created or cached yet). If set to a function, the function will be called **once** during the shared/root\n * query initialization, and be expected to synchronously return the initial data. Initial data is\n * considered stale by default unless a `staleTime` has been set. `initialData` **is persisted** to the\n * cache.\n */\n initialData?:\n | undefined\n | NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>\n | InitialDataFunction<\n NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>\n >\n}\n\n/**\n * The options accepted by the `infiniteQueryOptions` overload selected when no `initialData` is set and\n * `queryFn` is not `skipToken` — same as {@link UndefinedInitialDataInfiniteOptions}, but `queryFn` may not be\n * `skipToken`.\n *\n * @template TQueryFnData - The type of a single page, as your `queryFn` resolves it.\n * @template TError - The type of errors your `queryFn` may throw.\n * @template TData - The type `data` ends up as after `select` runs — defaults to `InfiniteData<TQueryFnData>`,\n * the shape of all fetched pages plus their page params.\n * @template TQueryKey - The type of your `queryKey`.\n * @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.\n */\nexport type UnusedSkipTokenInfiniteOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n> = OmitKeyof<\n CreateInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n 'queryFn'\n> & {\n /**\n * `skipToken` is not allowed as a value here — this overload is selected when no `initialData` is set. If\n * you don't intend to run the query yet, set `enabled: false` — omitting `queryFn` alone still triggers a\n * fetch that fails with \"Missing queryFn\" unless `enabled` is `false` or a default query function has been\n * defined. A default query function only supplies `queryFn`; it doesn't defer the fetch on its own.\n */\n queryFn?: Exclude<\n CreateInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >['queryFn'],\n SkipToken | undefined\n >\n}\n\n/**\n * The options accepted by the `infiniteQueryOptions` overload selected when `initialData` is set — `data` is\n * never `undefined` (unless a `select` changes `TData` to include `undefined`).\n *\n * @template TQueryFnData - The type of a single page, as your `queryFn` resolves it.\n * @template TError - The type of errors your `queryFn` may throw.\n * @template TData - The type `data` ends up as after `select` runs — defaults to `InfiniteData<TQueryFnData>`,\n * the shape of all fetched pages plus their page params.\n * @template TQueryKey - The type of your `queryKey`.\n * @template TPageParam - The type of the parameter passed to `queryFn` to fetch a given page.\n */\nexport type DefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n> = CreateInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n> & {\n /**\n * If set, this value will be used as the initial data for the query cache (as long as the query hasn't been\n * created or cached yet). If set to a function, the function will be called **once** during the shared/root\n * query initialization, and be expected to synchronously return the initial data. Initial data is\n * considered stale by default unless a `staleTime` has been set. `initialData` **is persisted** to the\n * cache.\n */\n initialData:\n | NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>\n | (() => NonUndefinedGuard<InfiniteData<TQueryFnData, TPageParam>>)\n | undefined\n}\n\n/**\n * You can generally pass everything to `infiniteQueryOptions` that you can also pass to\n * `injectInfiniteQuery`. These options can be shared across functions and imperative APIs such as\n * `queryClient.fetchInfiniteQuery`. `options.queryKey` is required and is the query key to generate options\n * for.\n *\n * This overload is selected when `initialData` is set.\n *\n * @see {@link injectInfiniteQuery} to run an infinite query with these options.\n * @param options - The {@link DefinedInitialDataInfiniteOptions} to use — everything you can pass to\n * `injectInfiniteQuery`, with `initialData` set.\n * @returns The same options object, typed so that `queryKey` carries the inferred data type.\n * @remarks See {@link injectInfiniteQuery} for examples that fetch further pages, from a button click or\n * automatically as the user scrolls.\n *\n * @example\n * ```angular-ts\n * import { infiniteQueryOptions, injectInfiniteQuery } from '@tanstack/angular-query-experimental'\n *\n * export const projectsOptions = infiniteQueryOptions({\n * queryKey: ['projects'],\n * queryFn: ({ pageParam }) => fetchProjects(pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * initialData: { pages: [], pageParams: [] },\n * })\n *\n * @Component({\n * selector: 'projects',\n * template: `\n * <!-- `projectsQuery.data()` is never `undefined`, thanks to `initialData` — even if a\n * refetch fails, so the list stays visible alongside the error. -->\n * <ul>\n * @for (page of projectsQuery.data().pages; track $index) {\n * @for (project of page.projects; track project.id) {\n * <li>{{ project.name }}</li>\n * }\n * }\n * </ul>\n * `,\n * })\n * export class Projects {\n * readonly projectsQuery = injectInfiniteQuery(() => projectsOptions)\n * }\n * ```\n */\nexport function infiniteQueryOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: DefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n): DefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n> &\n QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>\n\n/**\n * You can generally pass everything to `infiniteQueryOptions` that you can also pass to\n * `injectInfiniteQuery`. These options can be shared across functions and imperative APIs such as\n * `queryClient.fetchInfiniteQuery`. `options.queryKey` is required and is the query key to generate options\n * for.\n *\n * @returns The same options object, typed so that `queryKey` carries the inferred data type.\n * @remarks See {@link injectInfiniteQuery} for examples that fetch further pages, from a button click or\n * automatically as the user scrolls.\n *\n * @example\n * A parameterized factory, so the same options object can be reused per `postId`:\n * ```angular-ts\n * import { infiniteQueryOptions, injectInfiniteQuery } from '@tanstack/angular-query-experimental'\n *\n * export const commentsOptions = (postId: string) =>\n * infiniteQueryOptions({\n * queryKey: ['post', postId, 'comments'],\n * queryFn: ({ pageParam }) => fetchComments(postId, pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * })\n *\n * @Component({\n * selector: 'comments',\n * template: `\n * @if (commentsQuery.isPending()) {\n * Loading...\n * } @else if (commentsQuery.isError()) {\n * <span>Error: {{ commentsQuery.error()?.message }}</span>\n * } @else {\n * <ul>\n * @for (page of commentsQuery.data().pages; track $index) {\n * @for (comment of page.comments; track comment.id) {\n * <li>{{ comment.text }}</li>\n * }\n * }\n * </ul>\n * }\n * `,\n * })\n * export class Comments {\n * readonly postId = signal('1')\n * readonly commentsQuery = injectInfiniteQuery(() => commentsOptions(this.postId()))\n * }\n * ```\n *\n * @see {@link injectInfiniteQuery} to run an infinite query with these options.\n * @param options - The {@link UnusedSkipTokenInfiniteOptions} to use — everything you can pass to\n * `injectInfiniteQuery`.\n */\nexport function infiniteQueryOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: UnusedSkipTokenInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n): UnusedSkipTokenInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n> &\n QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>\n\n/**\n * You can generally pass everything to `infiniteQueryOptions` that you can also pass to\n * `injectInfiniteQuery`. These options can be shared across functions and imperative APIs such as\n * `queryClient.fetchInfiniteQuery`. `options.queryKey` is required and is the query key to generate options\n * for.\n *\n * @returns The same options object, typed so that `queryKey` carries the inferred data type.\n * @remarks See {@link injectInfiniteQuery} for examples that fetch further pages (from a button click or\n * automatically as the user scrolls) and that use `skipToken` to disable the query until `postId` is set.\n *\n * @example\n * A parameterized factory, so the same options object can be reused per `postId`:\n * ```angular-ts\n * import { infiniteQueryOptions, injectInfiniteQuery } from '@tanstack/angular-query-experimental'\n *\n * export const commentsOptions = (postId: string) =>\n * infiniteQueryOptions({\n * queryKey: ['post', postId, 'comments'],\n * queryFn: ({ pageParam }) => fetchComments(postId, pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * })\n *\n * @Component({\n * selector: 'comments',\n * template: `\n * @if (commentsQuery.isPending()) {\n * Loading...\n * } @else if (commentsQuery.isError()) {\n * <span>Error: {{ commentsQuery.error()?.message }}</span>\n * } @else {\n * <ul>\n * @for (page of commentsQuery.data().pages; track $index) {\n * @for (comment of page.comments; track comment.id) {\n * <li>{{ comment.text }}</li>\n * }\n * }\n * </ul>\n * }\n * `,\n * })\n * export class Comments {\n * readonly postId = signal('1')\n * readonly commentsQuery = injectInfiniteQuery(() => commentsOptions(this.postId()))\n * }\n * ```\n *\n * @see {@link injectInfiniteQuery} to run an infinite query with these options.\n * @param options - The {@link UndefinedInitialDataInfiniteOptions} to use — everything you can pass to\n * `injectInfiniteQuery`.\n */\nexport function infiniteQueryOptions<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: UndefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n): UndefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n> &\n QueryKeyWithDataTag<TQueryKey, InfiniteData<TQueryFnData>, TError>\n\nexport function infiniteQueryOptions(options: unknown) {\n return options\n}\n"],"mappings":";AA+VA,SAAgB,qBAAqB,SAAkB;CACrD,OAAO;AACT"}
|
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import { CreateInfiniteQueryOptions, CreateInfiniteQueryResult, DefinedCreateInfiniteQueryResult } from "./types.mjs";
|
|
2
|
+
import { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions } from "./infinite-query-options.mjs";
|
|
3
|
+
import { Injector } from "@angular/core";
|
|
4
|
+
import { DefaultError, InfiniteData, QueryKey } from "@tanstack/query-core";
|
|
5
|
+
//#region src/inject-infinite-query.d.ts
|
|
6
|
+
interface InjectInfiniteQueryOptions {
|
|
7
|
+
/**
|
|
8
|
+
* The `Injector` in which to create the infinite query.
|
|
9
|
+
*
|
|
10
|
+
* If this is not provided, the current injection context will be used instead (via `inject`).
|
|
11
|
+
*/
|
|
12
|
+
injector?: Injector;
|
|
12
13
|
}
|
|
13
14
|
/**
|
|
14
15
|
* The options for `injectInfiniteQuery` are identical to `injectQuery`, with the addition of
|
|
@@ -59,7 +60,7 @@ export interface InjectInfiniteQueryOptions {
|
|
|
59
60
|
* }
|
|
60
61
|
* ```
|
|
61
62
|
*/
|
|
62
|
-
|
|
63
|
+
declare function injectInfiniteQuery<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(injectInfiniteQueryFn: () => DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>, options?: InjectInfiniteQueryOptions): DefinedCreateInfiniteQueryResult<TData, TError>;
|
|
63
64
|
/**
|
|
64
65
|
* Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a
|
|
65
66
|
* unique key. Infinite queries can additively "load more" data onto an existing set of data, or
|
|
@@ -199,7 +200,7 @@ export declare function injectInfiniteQuery<TQueryFnData, TError = DefaultError,
|
|
|
199
200
|
* }
|
|
200
201
|
* ```
|
|
201
202
|
*/
|
|
202
|
-
|
|
203
|
+
declare function injectInfiniteQuery<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(injectInfiniteQueryFn: () => UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>, options?: InjectInfiniteQueryOptions): CreateInfiniteQueryResult<TData, TError>;
|
|
203
204
|
/**
|
|
204
205
|
* This overload accepts the general {@link CreateInfiniteQueryOptions} shape rather than the
|
|
205
206
|
* `initialData`-aware overloads above, so whether `data` is defined can't be inferred from the call site —
|
|
@@ -211,4 +212,7 @@ export declare function injectInfiniteQuery<TQueryFnData, TError = DefaultError,
|
|
|
211
212
|
* @param options - Additional configuration.
|
|
212
213
|
* @returns The infinite query result.
|
|
213
214
|
*/
|
|
214
|
-
|
|
215
|
+
declare function injectInfiniteQuery<TQueryFnData, TError = DefaultError, TData = InfiniteData<TQueryFnData>, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(injectInfiniteQueryFn: () => CreateInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>, options?: InjectInfiniteQueryOptions): CreateInfiniteQueryResult<TData, TError>;
|
|
216
|
+
//#endregion
|
|
217
|
+
export { InjectInfiniteQueryOptions, injectInfiniteQuery };
|
|
218
|
+
//# sourceMappingURL=inject-infinite-query.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inject-infinite-query.d.mts","names":[],"sources":["../src/inject-infinite-query.ts"],"mappings":";;;;;UAwBiB;;;;;;EAMf,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBAoDG,oBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,6BAA6B,kCAC3B,cACA,QACA,OACA,WACA,aAEF,UAAU,6BACT,iCAAiC,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA6I3B,oBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,6BAA6B,oCAC3B,cACA,QACA,OACA,WACA,aAEF,UAAU,6BACT,0BAA0B,OAAO;;;;;;;;;;;;iBAapB,oBACd,cACA,SAAS,cACT,QAAQ,aAAa,eACrB,kBAAkB,WAAW,UAC7B,sBAEA,6BAA6B,2BAC3B,cACA,QACA,OACA,WACA,aAEF,UAAU,6BACT,0BAA0B,OAAO"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { createBaseQuery } from "./create-base-query.mjs";
|
|
2
|
+
import { Injector, assertInInjectionContext, inject, runInInjectionContext } from "@angular/core";
|
|
3
|
+
import { InfiniteQueryObserver } from "@tanstack/query-core";
|
|
4
|
+
//#region src/inject-infinite-query.ts
|
|
5
|
+
function injectInfiniteQuery(injectInfiniteQueryFn, options) {
|
|
6
|
+
!options?.injector && assertInInjectionContext(injectInfiniteQuery);
|
|
7
|
+
const injector = options?.injector ?? inject(Injector);
|
|
8
|
+
return runInInjectionContext(injector, () => createBaseQuery(injectInfiniteQueryFn, InfiniteQueryObserver));
|
|
9
|
+
}
|
|
10
|
+
//#endregion
|
|
11
|
+
export { injectInfiniteQuery };
|
|
12
|
+
|
|
13
|
+
//# sourceMappingURL=inject-infinite-query.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inject-infinite-query.mjs","names":[],"sources":["../src/inject-infinite-query.ts"],"sourcesContent":["import { InfiniteQueryObserver } from '@tanstack/query-core'\nimport {\n Injector,\n assertInInjectionContext,\n inject,\n runInInjectionContext,\n} from '@angular/core'\nimport { createBaseQuery } from './create-base-query'\nimport type {\n DefaultError,\n InfiniteData,\n QueryKey,\n QueryObserver,\n} from '@tanstack/query-core'\nimport type {\n CreateInfiniteQueryOptions,\n CreateInfiniteQueryResult,\n DefinedCreateInfiniteQueryResult,\n} from './types'\nimport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infinite-query-options'\n\nexport interface InjectInfiniteQueryOptions {\n /**\n * The `Injector` in which to create the infinite query.\n *\n * If this is not provided, the current injection context will be used instead (via `inject`).\n */\n injector?: Injector\n}\n\n/**\n * The options for `injectInfiniteQuery` are identical to `injectQuery`, with the addition of\n * `initialPageParam`, `getNextPageParam`, `getPreviousPageParam`, and `maxPages`. Infinite queries can\n * additively \"load more\" data onto an existing set of data, or \"infinite scroll\".\n *\n * This overload is selected when `initialData` is set on the options returned by `injectInfiniteQueryFn`,\n * so the resulting `data` signal is never `undefined` (unless a `select` changes `TData` to include `undefined`).\n *\n * @remarks Keep in mind that imperative fetch calls, such as `fetchNextPage`, may interfere with the default\n * refetch behavior, resulting in outdated data. Make sure to call these functions only in response to user\n * actions, or add conditions like `hasNextPage() && !isFetching()`.\n * @see {@link infiniteQueryOptions} to share these options between `injectInfiniteQuery` and imperative APIs\n * like `queryClient.fetchInfiniteQuery`.\n * @param injectInfiniteQueryFn - A function returning the {@link DefinedInitialDataInfiniteOptions} to use —\n * everything you can pass to `injectInfiniteQuery`, with `initialData` set. Similar to `computed` from\n * Angular, this function runs in the reactive context, so signals read inside it drive the query.\n * @param options - Additional configuration.\n * @returns The same signals as `injectQuery`, with the addition of `fetchNextPage`, `fetchPreviousPage`,\n * `hasNextPage`, `hasPreviousPage`, `isFetchingNextPage`, and `isFetchingPreviousPage`. `data().pages` and\n * `data().pageParams` are also added, as long as a `select` doesn't change `TData` away from its default\n * `InfiniteData<TQueryFnData>` shape.\n *\n * @example\n * ```angular-ts\n * @Component({\n * selector: 'projects',\n * template: `\n * <!-- `projectsQuery.data()` is never `undefined`, thanks to `initialData` — even if a\n * refetch fails, so the list stays visible alongside the error. -->\n * <ul>\n * @for (page of projectsQuery.data().pages; track $index) {\n * @for (project of page.projects; track project.id) {\n * <li>{{ project.name }}</li>\n * }\n * }\n * </ul>\n * `,\n * })\n * export class Projects {\n * readonly projectsQuery = injectInfiniteQuery(() => ({\n * queryKey: ['projects'],\n * queryFn: ({ pageParam }) => fetchProjects(pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * initialData: { pages: [], pageParams: [] },\n * }))\n * }\n * ```\n */\nexport function injectInfiniteQuery<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n injectInfiniteQueryFn: () => DefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n options?: InjectInfiniteQueryOptions,\n): DefinedCreateInfiniteQueryResult<TData, TError>\n\n/**\n * Injects an infinite query: a declarative dependency on an asynchronous source of data that is tied to a\n * unique key. Infinite queries can additively \"load more\" data onto an existing set of data, or\n * \"infinite scroll\".\n *\n * @remarks Keep in mind that imperative fetch calls, such as `fetchNextPage`, may interfere with the default\n * refetch behavior, resulting in outdated data. Make sure to call these functions only in response to user\n * actions, or add conditions like `hasNextPage() && !isFetching()`. This is the only overload that accepts\n * `queryFn: skipToken`, shown below.\n * @see {@link infiniteQueryOptions} to share these options between `injectInfiniteQuery` and imperative APIs\n * like `queryClient.fetchInfiniteQuery`.\n * @param injectInfiniteQueryFn - A function returning the {@link UndefinedInitialDataInfiniteOptions} to use\n * — everything you can pass to `injectInfiniteQuery`. Similar to `computed` from Angular, this function runs\n * in the reactive context, so signals read inside it drive the query.\n * @param options - Additional configuration.\n * @returns The same signals as `injectQuery`, with the addition of `fetchNextPage`, `fetchPreviousPage`,\n * `hasNextPage`, `hasPreviousPage`, `isFetchingNextPage`, and `isFetchingPreviousPage`. `data().pages` and\n * `data().pageParams` are also added, as long as a `select` doesn't change `TData` away from its default\n * `InfiniteData<TQueryFnData>` shape.\n *\n * @example\n * Fetching the next page from a button click:\n * ```angular-ts\n * @Component({\n * selector: 'projects-list',\n * template: `\n * <ul>\n * @for (page of projectsQuery.data()?.pages; track $index) {\n * @for (project of page.projects; track project.id) {\n * <li>{{ project.name }}</li>\n * }\n * }\n * </ul>\n * <button\n * [disabled]=\"!projectsQuery.hasNextPage() || projectsQuery.isFetching()\"\n * (click)=\"projectsQuery.fetchNextPage()\"\n * >\n * Load More\n * </button>\n * `,\n * })\n * export class ProjectsList {\n * readonly projectsQuery = injectInfiniteQuery(() => ({\n * queryKey: ['projects'],\n * queryFn: ({ pageParam }) => fetchProjects(pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * }))\n * }\n * ```\n *\n * @example\n * Fetching the next page automatically as the user scrolls, using an `IntersectionObserver` on a sentinel\n * element after the list:\n * ```angular-ts\n * @Component({\n * selector: 'projects-list',\n * template: `\n * <ul>\n * @for (page of projectsQuery.data()?.pages; track $index) {\n * @for (project of page.projects; track project.id) {\n * <li>{{ project.name }}</li>\n * }\n * }\n * </ul>\n * <div #sentinel>{{ projectsQuery.isFetchingNextPage() ? 'Loading more...' : '' }}</div>\n * `,\n * })\n * export class ProjectsList {\n * readonly sentinel = viewChild<ElementRef<HTMLElement>>('sentinel')\n *\n * readonly projectsQuery = injectInfiniteQuery(() => ({\n * queryKey: ['projects'],\n * queryFn: ({ pageParam }) => fetchProjects(pageParam),\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * }))\n *\n * constructor() {\n * effect((onCleanup) => {\n * const sentinel = this.sentinel()?.nativeElement\n * if (\n * sentinel == null ||\n * !this.projectsQuery.hasNextPage() ||\n * this.projectsQuery.isFetching()\n * ) {\n * return\n * }\n *\n * const observer = new IntersectionObserver(([entry]) => {\n * if (entry?.isIntersecting) this.projectsQuery.fetchNextPage()\n * })\n * observer.observe(sentinel)\n *\n * onCleanup(() => observer.disconnect())\n * })\n * }\n * }\n * ```\n *\n * @example\n * A query that's disabled, type safe, until `postId` is set — pass `skipToken` as `queryFn` instead of\n * setting `enabled: false`:\n * ```angular-ts\n * @Component({\n * selector: 'comments',\n * template: `\n * @if (postId() == null) {\n * Select a post\n * } @else if (commentsQuery.isPending()) {\n * Loading...\n * } @else if (commentsQuery.isError()) {\n * <span>Error: {{ commentsQuery.error()?.message }}</span>\n * } @else {\n * <ul>\n * @for (page of commentsQuery.data().pages; track $index) {\n * @for (comment of page.comments; track comment.id) {\n * <li>{{ comment.text }}</li>\n * }\n * }\n * </ul>\n * }\n * `,\n * })\n * export class Comments {\n * readonly postId = signal<string | undefined>(undefined)\n *\n * readonly commentsQuery = injectInfiniteQuery(() => ({\n * queryKey: ['post', this.postId(), 'comments'],\n * queryFn:\n * this.postId() != null\n * ? ({ pageParam }) => fetchComments(this.postId()!, pageParam)\n * : skipToken,\n * initialPageParam: 0,\n * getNextPageParam: (lastPage) => lastPage.nextId,\n * }))\n * }\n * ```\n */\nexport function injectInfiniteQuery<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n injectInfiniteQueryFn: () => UndefinedInitialDataInfiniteOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n options?: InjectInfiniteQueryOptions,\n): CreateInfiniteQueryResult<TData, TError>\n\n/**\n * This overload accepts the general {@link CreateInfiniteQueryOptions} shape rather than the\n * `initialData`-aware overloads above, so whether `data` is defined can't be inferred from the call site —\n * useful when wrapping `injectInfiniteQuery` in your own helper function that forwards caller-provided\n * options.\n *\n * @param injectInfiniteQueryFn - A function that returns infinite query options. Similar to `computed` from\n * Angular, this function runs in the reactive context, so signals read inside it drive the query.\n * @param options - Additional configuration.\n * @returns The infinite query result.\n */\nexport function injectInfiniteQuery<\n TQueryFnData,\n TError = DefaultError,\n TData = InfiniteData<TQueryFnData>,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n injectInfiniteQueryFn: () => CreateInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n options?: InjectInfiniteQueryOptions,\n): CreateInfiniteQueryResult<TData, TError>\n\nexport function injectInfiniteQuery(\n injectInfiniteQueryFn: () => CreateInfiniteQueryOptions,\n options?: InjectInfiniteQueryOptions,\n) {\n !options?.injector && assertInInjectionContext(injectInfiniteQuery)\n const injector = options?.injector ?? inject(Injector)\n return runInInjectionContext(injector, () =>\n createBaseQuery(\n injectInfiniteQueryFn,\n InfiniteQueryObserver as typeof QueryObserver,\n ),\n )\n}\n"],"mappings":";;;;AA2RA,SAAgB,oBACd,uBACA,SACA;CACA,CAAC,SAAS,YAAY,yBAAyB,mBAAmB;CAClE,MAAM,WAAW,SAAS,YAAY,OAAO,QAAQ;CACrD,OAAO,sBAAsB,gBAC3B,gBACE,uBACA,qBACF,CACF;AACF"}
|
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { Injector, Signal } from
|
|
2
|
-
import { QueryFilters } from
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { Injector, Signal } from "@angular/core";
|
|
2
|
+
import { QueryFilters } from "@tanstack/query-core";
|
|
3
|
+
//#region src/inject-is-fetching.d.ts
|
|
4
|
+
interface InjectIsFetchingOptions {
|
|
5
|
+
/**
|
|
6
|
+
* The `Injector` in which to create the isFetching signal.
|
|
7
|
+
*
|
|
8
|
+
* If this is not provided, the current injection context will be used instead (via `inject`).
|
|
9
|
+
*/
|
|
10
|
+
injector?: Injector;
|
|
10
11
|
}
|
|
11
12
|
/**
|
|
12
13
|
* Injects a signal that tracks the number of queries that your application is loading or fetching in the
|
|
@@ -49,4 +50,7 @@ export interface InjectIsFetchingOptions {
|
|
|
49
50
|
* }
|
|
50
51
|
* ```
|
|
51
52
|
*/
|
|
52
|
-
|
|
53
|
+
declare function injectIsFetching(filters?: QueryFilters, options?: InjectIsFetchingOptions): Signal<number>;
|
|
54
|
+
//#endregion
|
|
55
|
+
export { InjectIsFetchingOptions, injectIsFetching };
|
|
56
|
+
//# sourceMappingURL=inject-is-fetching.d.mts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"inject-is-fetching.d.mts","names":[],"sources":["../src/inject-is-fetching.ts"],"mappings":";;;UAYiB;;;;;;EAMf,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA4CG,iBACd,UAAU,cACV,UAAU,0BACT"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { DestroyRef, Injector, NgZone, assertInInjectionContext, inject, signal } from "@angular/core";
|
|
2
|
+
import { QueryClient, notifyManager } from "@tanstack/query-core";
|
|
3
|
+
//#region src/inject-is-fetching.ts
|
|
4
|
+
/**
|
|
5
|
+
* Injects a signal that tracks the number of queries that your application is loading or fetching in the
|
|
6
|
+
* background (useful for app-wide loading indicators).
|
|
7
|
+
*
|
|
8
|
+
* @param filters - The {@link QueryFilters} to narrow down the matched queries.
|
|
9
|
+
* @param options - Additional configuration
|
|
10
|
+
* @returns A `Signal` with the number of queries that your application is currently loading or fetching in
|
|
11
|
+
* the background.
|
|
12
|
+
*
|
|
13
|
+
* @example
|
|
14
|
+
* ```angular-ts
|
|
15
|
+
* @Component({
|
|
16
|
+
* selector: 'posts-fetching-indicator',
|
|
17
|
+
* template: `
|
|
18
|
+
* @if (isFetchingPosts()) {
|
|
19
|
+
* <span>Refreshing posts...</span>
|
|
20
|
+
* }
|
|
21
|
+
* `,
|
|
22
|
+
* })
|
|
23
|
+
* export class PostsFetchingIndicator {
|
|
24
|
+
* // How many queries matching the posts prefix are fetching?
|
|
25
|
+
* readonly isFetchingPosts = injectIsFetching({ queryKey: ['posts'] })
|
|
26
|
+
* }
|
|
27
|
+
* ```
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* A global loading indicator for any query fetching in the background, not just the ones on screen:
|
|
31
|
+
* ```angular-ts
|
|
32
|
+
* @Component({
|
|
33
|
+
* selector: 'global-loading-indicator',
|
|
34
|
+
* template: `
|
|
35
|
+
* @if (isFetching()) {
|
|
36
|
+
* <div>Queries are fetching in the background...</div>
|
|
37
|
+
* }
|
|
38
|
+
* `,
|
|
39
|
+
* })
|
|
40
|
+
* export class GlobalLoadingIndicator {
|
|
41
|
+
* readonly isFetching = injectIsFetching()
|
|
42
|
+
* }
|
|
43
|
+
* ```
|
|
44
|
+
*/
|
|
45
|
+
function injectIsFetching(filters, options) {
|
|
46
|
+
!options?.injector && assertInInjectionContext(injectIsFetching);
|
|
47
|
+
const injector = options?.injector ?? inject(Injector);
|
|
48
|
+
const destroyRef = injector.get(DestroyRef);
|
|
49
|
+
const ngZone = injector.get(NgZone);
|
|
50
|
+
const queryClient = injector.get(QueryClient);
|
|
51
|
+
const cache = queryClient.getQueryCache();
|
|
52
|
+
let isFetching = queryClient.isFetching(filters);
|
|
53
|
+
const result = signal(isFetching);
|
|
54
|
+
const unsubscribe = ngZone.runOutsideAngular(() => cache.subscribe(notifyManager.batchCalls(() => {
|
|
55
|
+
const newIsFetching = queryClient.isFetching(filters);
|
|
56
|
+
if (isFetching !== newIsFetching) {
|
|
57
|
+
isFetching = newIsFetching;
|
|
58
|
+
ngZone.run(() => {
|
|
59
|
+
result.set(isFetching);
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
})));
|
|
63
|
+
destroyRef.onDestroy(unsubscribe);
|
|
64
|
+
return result;
|
|
65
|
+
}
|
|
66
|
+
//#endregion
|
|
67
|
+
export { injectIsFetching };
|
|
68
|
+
|
|
69
|
+
//# sourceMappingURL=inject-is-fetching.mjs.map
|