@apollo/client 4.2.0-alpha.2 → 4.2.0-alpha.4

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.
Files changed (147) hide show
  1. package/CHANGELOG.md +240 -0
  2. package/__cjs/cache/core/cache.cjs +1 -1
  3. package/__cjs/cache/inmemory/entityStore.cjs +3 -3
  4. package/__cjs/cache/inmemory/entityStore.cjs.map +1 -1
  5. package/__cjs/cache/inmemory/key-extractor.cjs +1 -1
  6. package/__cjs/cache/inmemory/policies.cjs +4 -4
  7. package/__cjs/cache/inmemory/readFromStore.cjs +2 -2
  8. package/__cjs/cache/inmemory/writeToStore.cjs +4 -4
  9. package/__cjs/core/ApolloClient.cjs +52 -20
  10. package/__cjs/core/ApolloClient.cjs.map +1 -1
  11. package/__cjs/core/ApolloClient.d.cts +159 -22
  12. package/__cjs/core/ObservableQuery.cjs +7 -7
  13. package/__cjs/core/ObservableQuery.cjs.map +1 -1
  14. package/__cjs/core/ObservableQuery.d.cts +20 -1
  15. package/__cjs/core/QueryManager.cjs +12 -12
  16. package/__cjs/core/QueryManager.cjs.map +1 -1
  17. package/__cjs/core/RefetchEventManager.cjs +134 -0
  18. package/__cjs/core/RefetchEventManager.cjs.map +1 -0
  19. package/__cjs/core/RefetchEventManager.d.cts +130 -0
  20. package/__cjs/core/index.cjs +7 -1
  21. package/__cjs/core/index.cjs.map +1 -1
  22. package/__cjs/core/index.d.cts +4 -1
  23. package/__cjs/core/refetchSources/onlineSource.cjs +10 -0
  24. package/__cjs/core/refetchSources/onlineSource.cjs.map +1 -0
  25. package/__cjs/core/refetchSources/onlineSource.d.cts +3 -0
  26. package/__cjs/core/refetchSources/windowFocusSource.cjs +13 -0
  27. package/__cjs/core/refetchSources/windowFocusSource.cjs.map +1 -0
  28. package/__cjs/core/refetchSources/windowFocusSource.d.cts +3 -0
  29. package/__cjs/core/types.d.cts +20 -0
  30. package/__cjs/invariantErrorCodes.cjs +69 -44
  31. package/__cjs/link/ws/index.cjs +9 -1
  32. package/__cjs/link/ws/index.cjs.map +1 -1
  33. package/__cjs/link/ws/index.d.cts +1 -1
  34. package/__cjs/react/hooks/useBackgroundQuery.cjs.map +1 -1
  35. package/__cjs/react/hooks/useBackgroundQuery.d.cts +1486 -66
  36. package/__cjs/react/hooks/useLazyQuery.cjs +1 -0
  37. package/__cjs/react/hooks/useLazyQuery.cjs.map +1 -1
  38. package/__cjs/react/hooks/useLazyQuery.d.cts +366 -40
  39. package/__cjs/react/hooks/useLoadableQuery.cjs.map +1 -1
  40. package/__cjs/react/hooks/useLoadableQuery.d.cts +512 -50
  41. package/__cjs/react/hooks/useMutation.cjs +5 -48
  42. package/__cjs/react/hooks/useMutation.cjs.map +1 -1
  43. package/__cjs/react/hooks/useMutation.d.cts +239 -130
  44. package/__cjs/react/hooks/useQuery.cjs.map +1 -1
  45. package/__cjs/react/hooks/useQuery.d.cts +590 -41
  46. package/__cjs/react/hooks/useSubscription.cjs +1 -1
  47. package/__cjs/react/hooks/useSubscription.cjs.map +1 -1
  48. package/__cjs/react/hooks/useSubscription.d.cts +2 -2
  49. package/__cjs/react/hooks/useSuspenseQuery.cjs.map +1 -1
  50. package/__cjs/react/hooks/useSuspenseQuery.d.cts +754 -46
  51. package/__cjs/react/internal/cache/QueryReference.cjs +1 -0
  52. package/__cjs/react/internal/cache/QueryReference.cjs.map +1 -1
  53. package/__cjs/react/internal/cache/QueryReference.d.cts +1 -1
  54. package/__cjs/react/query-preloader/createQueryPreloader.cjs.map +1 -1
  55. package/__cjs/react/query-preloader/createQueryPreloader.d.cts +20 -1
  56. package/__cjs/react/types/types.documentation.d.cts +19 -0
  57. package/__cjs/version.cjs +1 -1
  58. package/cache/core/cache.js +1 -1
  59. package/cache/inmemory/entityStore.js +3 -3
  60. package/cache/inmemory/entityStore.js.map +1 -1
  61. package/cache/inmemory/key-extractor.js +1 -1
  62. package/cache/inmemory/policies.js +4 -4
  63. package/cache/inmemory/readFromStore.js +2 -2
  64. package/cache/inmemory/writeToStore.js +4 -4
  65. package/core/ApolloClient.d.ts +159 -22
  66. package/core/ApolloClient.js +53 -21
  67. package/core/ApolloClient.js.map +1 -1
  68. package/core/ObservableQuery.d.ts +20 -1
  69. package/core/ObservableQuery.js +7 -7
  70. package/core/ObservableQuery.js.map +1 -1
  71. package/core/QueryManager.js +12 -12
  72. package/core/QueryManager.js.map +1 -1
  73. package/core/RefetchEventManager.d.ts +130 -0
  74. package/core/RefetchEventManager.js +126 -0
  75. package/core/RefetchEventManager.js.map +1 -0
  76. package/core/index.d.ts +4 -1
  77. package/core/index.js +3 -0
  78. package/core/index.js.map +1 -1
  79. package/core/refetchSources/onlineSource.d.ts +3 -0
  80. package/core/refetchSources/onlineSource.js +6 -0
  81. package/core/refetchSources/onlineSource.js.map +1 -0
  82. package/core/refetchSources/windowFocusSource.d.ts +3 -0
  83. package/core/refetchSources/windowFocusSource.js +9 -0
  84. package/core/refetchSources/windowFocusSource.js.map +1 -0
  85. package/core/types.d.ts +20 -0
  86. package/core/types.js.map +1 -1
  87. package/invariantErrorCodes.js +69 -44
  88. package/link/ws/index.d.ts +1 -1
  89. package/link/ws/index.js +9 -1
  90. package/link/ws/index.js.map +1 -1
  91. package/package.json +3 -7
  92. package/react/hooks/useBackgroundQuery.d.ts +1486 -66
  93. package/react/hooks/useBackgroundQuery.js.map +1 -1
  94. package/react/hooks/useLazyQuery.d.ts +366 -40
  95. package/react/hooks/useLazyQuery.js +1 -0
  96. package/react/hooks/useLazyQuery.js.map +1 -1
  97. package/react/hooks/useLoadableQuery.d.ts +512 -50
  98. package/react/hooks/useLoadableQuery.js.map +1 -1
  99. package/react/hooks/useMutation.d.ts +239 -130
  100. package/react/hooks/useMutation.js +5 -48
  101. package/react/hooks/useMutation.js.map +1 -1
  102. package/react/hooks/useQuery.d.ts +590 -41
  103. package/react/hooks/useQuery.js.map +1 -1
  104. package/react/hooks/useSubscription.d.ts +2 -2
  105. package/react/hooks/useSubscription.js +1 -1
  106. package/react/hooks/useSubscription.js.map +1 -1
  107. package/react/hooks/useSuspenseQuery.d.ts +754 -46
  108. package/react/hooks/useSuspenseQuery.js.map +1 -1
  109. package/react/hooks-compiled/useBackgroundQuery.d.ts +1486 -66
  110. package/react/hooks-compiled/useBackgroundQuery.js.map +1 -1
  111. package/react/hooks-compiled/useLazyQuery.d.ts +366 -40
  112. package/react/hooks-compiled/useLazyQuery.js +1 -0
  113. package/react/hooks-compiled/useLazyQuery.js.map +1 -1
  114. package/react/hooks-compiled/useLoadableQuery.d.ts +512 -50
  115. package/react/hooks-compiled/useLoadableQuery.js.map +1 -1
  116. package/react/hooks-compiled/useMutation.d.ts +239 -130
  117. package/react/hooks-compiled/useMutation.js +4 -47
  118. package/react/hooks-compiled/useMutation.js.map +1 -1
  119. package/react/hooks-compiled/useQuery.d.ts +590 -41
  120. package/react/hooks-compiled/useQuery.js.map +1 -1
  121. package/react/hooks-compiled/useSubscription.d.ts +2 -2
  122. package/react/hooks-compiled/useSubscription.js +1 -1
  123. package/react/hooks-compiled/useSubscription.js.map +1 -1
  124. package/react/hooks-compiled/useSuspenseQuery.d.ts +754 -46
  125. package/react/hooks-compiled/useSuspenseQuery.js.map +1 -1
  126. package/react/internal/cache/QueryReference.d.ts +1 -1
  127. package/react/internal/cache/QueryReference.js +1 -0
  128. package/react/internal/cache/QueryReference.js.map +1 -1
  129. package/react/query-preloader/createQueryPreloader.d.ts +20 -1
  130. package/react/query-preloader/createQueryPreloader.js.map +1 -1
  131. package/react/types/types.documentation.d.ts +19 -0
  132. package/react/types/types.documentation.js.map +1 -1
  133. package/skills/apollo-client/SKILL.md +168 -0
  134. package/skills/apollo-client/references/caching.md +560 -0
  135. package/skills/apollo-client/references/error-handling.md +350 -0
  136. package/skills/apollo-client/references/fragments.md +804 -0
  137. package/skills/apollo-client/references/integration-client.md +336 -0
  138. package/skills/apollo-client/references/integration-nextjs.md +325 -0
  139. package/skills/apollo-client/references/integration-react-router.md +256 -0
  140. package/skills/apollo-client/references/integration-tanstack-start.md +378 -0
  141. package/skills/apollo-client/references/mutations.md +549 -0
  142. package/skills/apollo-client/references/queries.md +416 -0
  143. package/skills/apollo-client/references/state-management.md +428 -0
  144. package/skills/apollo-client/references/suspense-hooks.md +773 -0
  145. package/skills/apollo-client/references/troubleshooting.md +487 -0
  146. package/skills/apollo-client/references/typescript-codegen.md +133 -0
  147. package/version.js +1 -1
@@ -1,4 +1,4 @@
1
- import type { ApolloClient, DefaultContext, DocumentNode, ErrorPolicy, OperationVariables, RefetchWritePolicy, TypedDocumentNode, WatchQueryFetchPolicy } from "@apollo/client";
1
+ import type { ApolloClient, DefaultContext, DocumentNode, ErrorPolicy, OperationVariables, RefetchOn, RefetchWritePolicy, TypedDocumentNode, WatchQueryFetchPolicy } from "@apollo/client";
2
2
  import type { SubscribeToMoreFunction } from "@apollo/client";
3
3
  import type { QueryRef } from "@apollo/client/react";
4
4
  import type { FetchMoreFunction, RefetchFunction } from "@apollo/client/react/internal";
@@ -72,6 +72,25 @@ export declare namespace useBackgroundQuery {
72
72
  */
73
73
  queryKey?: string | number | any[];
74
74
  /**
75
+ * Determines whether events trigger refetches for the query. Provide an
76
+ * object mapping each refetch event to `true` (enable), `false` (disable)
77
+ * or a callback function that returns `true`/`false` to control individual
78
+ * events. Provide `false` to disable all automatic refetch events for this
79
+ * query. Provide `true` to enable all automatic refetch events for this query.
80
+ * Provide a callback function to perform additional logic to determine
81
+ * whether to enable or disable a refetch for a query.
82
+ *
83
+ * `@remarks`
84
+ * `refetchOn` inherits from `defaultOptions.watchQuery.refetchOn`. If
85
+ * `defaultOptions.watchQuery.refetchOn` is not set, all refetch events are
86
+ * enabled by default.
87
+ *
88
+ * This option only has an effect when the client is configured with a
89
+ * `refetchEventManager`.
90
+ * @docGroup 1. Operation options
91
+ */
92
+ refetchOn?: RefetchOn.Option;
93
+ /**
75
94
  * If `true`, the query is not executed. The default value is `false`.
76
95
  *
77
96
  * @deprecated We recommend using `skipToken` in place of the `skip` option as
@@ -152,78 +171,139 @@ export declare namespace useBackgroundQuery {
152
171
  result: useBackgroundQuery.Result<TData, TVariables>
153
172
  ];
154
173
  namespace DocumentationTypes {
155
- /**
156
- * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
157
- *
158
- * @returns A tuple containing:
159
- *
160
- * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
161
- * 2. An object containing helper functions for the query:
162
- * - `refetch`: A function to re-execute the query
163
- * - `fetchMore`: A function to fetch more results for pagination
164
- * - `subscribeToMore`: A function to subscribe to updates
165
- *
166
- * @example
167
- *
168
- * ```jsx
169
- * import { Suspense } from "react";
170
- * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
171
- * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
172
- *
173
- * const query = gql`
174
- * foo {
175
- * bar
176
- * }
177
- * `;
178
- *
179
- * const client = new ApolloClient({
180
- * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
181
- * cache: new InMemoryCache(),
182
- * });
183
- *
184
- * function SuspenseFallback() {
185
- * return <div>Loading...</div>;
186
- * }
187
- *
188
- * function Child({ queryRef }) {
189
- * const { data } = useReadQuery(queryRef);
190
- *
191
- * return <div>{data.foo.bar}</div>;
192
- * }
193
- *
194
- * function Parent() {
195
- * const [queryRef] = useBackgroundQuery(query);
196
- *
197
- * return (
198
- * <Suspense fallback={<SuspenseFallback />}>
199
- * <Child queryRef={queryRef} />
200
- * </Suspense>
201
- * );
202
- * }
203
- *
204
- * function App() {
205
- * return (
206
- * <ApolloProvider client={client}>
207
- * <Parent />
208
- * </ApolloProvider>
209
- * );
210
- * }
211
- * ```
212
- *
213
- * @param query - A GraphQL query document parsed into an AST by `gql`.
214
- * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
215
- */
216
174
  interface useBackgroundQuery {
175
+ /**
176
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
177
+ *
178
+ * @returns A tuple containing:
179
+ *
180
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
181
+ * 2. An object containing helper functions for the query:
182
+ * - `refetch`: A function to re-execute the query
183
+ * - `fetchMore`: A function to fetch more results for pagination
184
+ * - `subscribeToMore`: A function to subscribe to updates
185
+ *
186
+ * @example
187
+ *
188
+ * ```jsx
189
+ * import { Suspense } from "react";
190
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
191
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
192
+ *
193
+ * const query = gql`
194
+ * foo {
195
+ * bar
196
+ * }
197
+ * `;
198
+ *
199
+ * const client = new ApolloClient({
200
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
201
+ * cache: new InMemoryCache(),
202
+ * });
203
+ *
204
+ * function SuspenseFallback() {
205
+ * return <div>Loading...</div>;
206
+ * }
207
+ *
208
+ * function Child({ queryRef }) {
209
+ * const { data } = useReadQuery(queryRef);
210
+ *
211
+ * return <div>{data.foo.bar}</div>;
212
+ * }
213
+ *
214
+ * function Parent() {
215
+ * const [queryRef] = useBackgroundQuery(query);
216
+ *
217
+ * return (
218
+ * <Suspense fallback={<SuspenseFallback />}>
219
+ * <Child queryRef={queryRef} />
220
+ * </Suspense>
221
+ * );
222
+ * }
223
+ *
224
+ * function App() {
225
+ * return (
226
+ * <ApolloProvider client={client}>
227
+ * <Parent />
228
+ * </ApolloProvider>
229
+ * );
230
+ * }
231
+ * ```
232
+ *
233
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
234
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
235
+ */
217
236
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken | useBackgroundQuery.Options<TVariables>): [
218
237
  QueryRef<TData, TVariables> | undefined,
219
238
  useBackgroundQuery.Result<TData, TVariables>
220
239
  ];
221
240
  }
222
- /**
223
- * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
224
- * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
225
- */
226
241
  interface useBackgroundQuery_Deprecated {
242
+ /**
243
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
244
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
245
+ *
246
+ *
247
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
248
+ *
249
+ * @returns A tuple containing:
250
+ *
251
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
252
+ * 2. An object containing helper functions for the query:
253
+ * - `refetch`: A function to re-execute the query
254
+ * - `fetchMore`: A function to fetch more results for pagination
255
+ * - `subscribeToMore`: A function to subscribe to updates
256
+ *
257
+ * @example
258
+ *
259
+ * ```jsx
260
+ * import { Suspense } from "react";
261
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
262
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
263
+ *
264
+ * const query = gql`
265
+ * foo {
266
+ * bar
267
+ * }
268
+ * `;
269
+ *
270
+ * const client = new ApolloClient({
271
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
272
+ * cache: new InMemoryCache(),
273
+ * });
274
+ *
275
+ * function SuspenseFallback() {
276
+ * return <div>Loading...</div>;
277
+ * }
278
+ *
279
+ * function Child({ queryRef }) {
280
+ * const { data } = useReadQuery(queryRef);
281
+ *
282
+ * return <div>{data.foo.bar}</div>;
283
+ * }
284
+ *
285
+ * function Parent() {
286
+ * const [queryRef] = useBackgroundQuery(query);
287
+ *
288
+ * return (
289
+ * <Suspense fallback={<SuspenseFallback />}>
290
+ * <Child queryRef={queryRef} />
291
+ * </Suspense>
292
+ * );
293
+ * }
294
+ *
295
+ * function App() {
296
+ * return (
297
+ * <ApolloProvider client={client}>
298
+ * <Parent />
299
+ * </ApolloProvider>
300
+ * );
301
+ * }
302
+ * ```
303
+ *
304
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
305
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
306
+ */
227
307
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken | useBackgroundQuery.Options<TVariables>): [
228
308
  QueryRef<TData, TVariables> | undefined,
229
309
  useBackgroundQuery.Result<TData, TVariables>
@@ -232,11 +312,135 @@ export declare namespace useBackgroundQuery {
232
312
  }
233
313
  namespace Signatures {
234
314
  /**
315
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
316
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
317
+ *
318
+ *
319
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
320
+ *
321
+ * @returns A tuple containing:
322
+ *
323
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
324
+ * 2. An object containing helper functions for the query:
325
+ * - `refetch`: A function to re-execute the query
326
+ * - `fetchMore`: A function to fetch more results for pagination
327
+ * - `subscribeToMore`: A function to subscribe to updates
328
+ *
329
+ * @example
330
+ *
331
+ * ```jsx
332
+ * import { Suspense } from "react";
333
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
334
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
335
+ *
336
+ * const query = gql`
337
+ * foo {
338
+ * bar
339
+ * }
340
+ * `;
341
+ *
342
+ * const client = new ApolloClient({
343
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
344
+ * cache: new InMemoryCache(),
345
+ * });
346
+ *
347
+ * function SuspenseFallback() {
348
+ * return <div>Loading...</div>;
349
+ * }
350
+ *
351
+ * function Child({ queryRef }) {
352
+ * const { data } = useReadQuery(queryRef);
353
+ *
354
+ * return <div>{data.foo.bar}</div>;
355
+ * }
356
+ *
357
+ * function Parent() {
358
+ * const [queryRef] = useBackgroundQuery(query);
359
+ *
360
+ * return (
361
+ * <Suspense fallback={<SuspenseFallback />}>
362
+ * <Child queryRef={queryRef} />
363
+ * </Suspense>
364
+ * );
365
+ * }
235
366
  *
367
+ * function App() {
368
+ * return (
369
+ * <ApolloProvider client={client}>
370
+ * <Parent />
371
+ * </ApolloProvider>
372
+ * );
373
+ * }
374
+ * ```
375
+ *
376
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
377
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
236
378
  */
237
379
  interface Classic {
238
380
  /**
381
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
382
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
383
+ *
384
+ *
385
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
386
+ *
387
+ * @returns A tuple containing:
388
+ *
389
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
390
+ * 2. An object containing helper functions for the query:
391
+ * - `refetch`: A function to re-execute the query
392
+ * - `fetchMore`: A function to fetch more results for pagination
393
+ * - `subscribeToMore`: A function to subscribe to updates
394
+ *
395
+ * @example
396
+ *
397
+ * ```jsx
398
+ * import { Suspense } from "react";
399
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
400
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
401
+ *
402
+ * const query = gql`
403
+ * foo {
404
+ * bar
405
+ * }
406
+ * `;
407
+ *
408
+ * const client = new ApolloClient({
409
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
410
+ * cache: new InMemoryCache(),
411
+ * });
412
+ *
413
+ * function SuspenseFallback() {
414
+ * return <div>Loading...</div>;
415
+ * }
416
+ *
417
+ * function Child({ queryRef }) {
418
+ * const { data } = useReadQuery(queryRef);
239
419
  *
420
+ * return <div>{data.foo.bar}</div>;
421
+ * }
422
+ *
423
+ * function Parent() {
424
+ * const [queryRef] = useBackgroundQuery(query);
425
+ *
426
+ * return (
427
+ * <Suspense fallback={<SuspenseFallback />}>
428
+ * <Child queryRef={queryRef} />
429
+ * </Suspense>
430
+ * );
431
+ * }
432
+ *
433
+ * function App() {
434
+ * return (
435
+ * <ApolloProvider client={client}>
436
+ * <Parent />
437
+ * </ApolloProvider>
438
+ * );
439
+ * }
440
+ * ```
441
+ *
442
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
443
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
240
444
  */
241
445
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
242
446
  /** @deprecated `returnPartialData` has no effect on `no-cache` queries */
@@ -247,7 +451,69 @@ export declare namespace useBackgroundQuery {
247
451
  useBackgroundQuery.Result<TData, TVariables>
248
452
  ];
249
453
  /**
454
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
455
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
456
+ *
457
+ *
458
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
459
+ *
460
+ * @returns A tuple containing:
461
+ *
462
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
463
+ * 2. An object containing helper functions for the query:
464
+ * - `refetch`: A function to re-execute the query
465
+ * - `fetchMore`: A function to fetch more results for pagination
466
+ * - `subscribeToMore`: A function to subscribe to updates
467
+ *
468
+ * @example
469
+ *
470
+ * ```jsx
471
+ * import { Suspense } from "react";
472
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
473
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
250
474
  *
475
+ * const query = gql`
476
+ * foo {
477
+ * bar
478
+ * }
479
+ * `;
480
+ *
481
+ * const client = new ApolloClient({
482
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
483
+ * cache: new InMemoryCache(),
484
+ * });
485
+ *
486
+ * function SuspenseFallback() {
487
+ * return <div>Loading...</div>;
488
+ * }
489
+ *
490
+ * function Child({ queryRef }) {
491
+ * const { data } = useReadQuery(queryRef);
492
+ *
493
+ * return <div>{data.foo.bar}</div>;
494
+ * }
495
+ *
496
+ * function Parent() {
497
+ * const [queryRef] = useBackgroundQuery(query);
498
+ *
499
+ * return (
500
+ * <Suspense fallback={<SuspenseFallback />}>
501
+ * <Child queryRef={queryRef} />
502
+ * </Suspense>
503
+ * );
504
+ * }
505
+ *
506
+ * function App() {
507
+ * return (
508
+ * <ApolloProvider client={client}>
509
+ * <Parent />
510
+ * </ApolloProvider>
511
+ * );
512
+ * }
513
+ * ```
514
+ *
515
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
516
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
251
517
  */
252
518
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
253
519
  returnPartialData: false;
@@ -257,7 +523,69 @@ export declare namespace useBackgroundQuery {
257
523
  useBackgroundQuery.Result<TData, TVariables>
258
524
  ];
259
525
  /**
526
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
527
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
528
+ *
529
+ *
530
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
531
+ *
532
+ * @returns A tuple containing:
533
+ *
534
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
535
+ * 2. An object containing helper functions for the query:
536
+ * - `refetch`: A function to re-execute the query
537
+ * - `fetchMore`: A function to fetch more results for pagination
538
+ * - `subscribeToMore`: A function to subscribe to updates
539
+ *
540
+ * @example
541
+ *
542
+ * ```jsx
543
+ * import { Suspense } from "react";
544
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
545
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
546
+ *
547
+ * const query = gql`
548
+ * foo {
549
+ * bar
550
+ * }
551
+ * `;
552
+ *
553
+ * const client = new ApolloClient({
554
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
555
+ * cache: new InMemoryCache(),
556
+ * });
557
+ *
558
+ * function SuspenseFallback() {
559
+ * return <div>Loading...</div>;
560
+ * }
561
+ *
562
+ * function Child({ queryRef }) {
563
+ * const { data } = useReadQuery(queryRef);
564
+ *
565
+ * return <div>{data.foo.bar}</div>;
566
+ * }
567
+ *
568
+ * function Parent() {
569
+ * const [queryRef] = useBackgroundQuery(query);
260
570
  *
571
+ * return (
572
+ * <Suspense fallback={<SuspenseFallback />}>
573
+ * <Child queryRef={queryRef} />
574
+ * </Suspense>
575
+ * );
576
+ * }
577
+ *
578
+ * function App() {
579
+ * return (
580
+ * <ApolloProvider client={client}>
581
+ * <Parent />
582
+ * </ApolloProvider>
583
+ * );
584
+ * }
585
+ * ```
586
+ *
587
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
588
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
261
589
  */
262
590
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
263
591
  returnPartialData: boolean;
@@ -267,7 +595,69 @@ export declare namespace useBackgroundQuery {
267
595
  useBackgroundQuery.Result<TData, TVariables>
268
596
  ];
269
597
  /**
598
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
599
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
600
+ *
601
+ *
602
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
603
+ *
604
+ * @returns A tuple containing:
605
+ *
606
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
607
+ * 2. An object containing helper functions for the query:
608
+ * - `refetch`: A function to re-execute the query
609
+ * - `fetchMore`: A function to fetch more results for pagination
610
+ * - `subscribeToMore`: A function to subscribe to updates
611
+ *
612
+ * @example
613
+ *
614
+ * ```jsx
615
+ * import { Suspense } from "react";
616
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
617
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
618
+ *
619
+ * const query = gql`
620
+ * foo {
621
+ * bar
622
+ * }
623
+ * `;
624
+ *
625
+ * const client = new ApolloClient({
626
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
627
+ * cache: new InMemoryCache(),
628
+ * });
270
629
  *
630
+ * function SuspenseFallback() {
631
+ * return <div>Loading...</div>;
632
+ * }
633
+ *
634
+ * function Child({ queryRef }) {
635
+ * const { data } = useReadQuery(queryRef);
636
+ *
637
+ * return <div>{data.foo.bar}</div>;
638
+ * }
639
+ *
640
+ * function Parent() {
641
+ * const [queryRef] = useBackgroundQuery(query);
642
+ *
643
+ * return (
644
+ * <Suspense fallback={<SuspenseFallback />}>
645
+ * <Child queryRef={queryRef} />
646
+ * </Suspense>
647
+ * );
648
+ * }
649
+ *
650
+ * function App() {
651
+ * return (
652
+ * <ApolloProvider client={client}>
653
+ * <Parent />
654
+ * </ApolloProvider>
655
+ * );
656
+ * }
657
+ * ```
658
+ *
659
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
660
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
271
661
  */
272
662
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
273
663
  errorPolicy: "ignore" | "all";
@@ -276,7 +666,69 @@ export declare namespace useBackgroundQuery {
276
666
  useBackgroundQuery.Result<TData, TVariables>
277
667
  ];
278
668
  /**
669
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
670
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
671
+ *
672
+ *
673
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
674
+ *
675
+ * @returns A tuple containing:
676
+ *
677
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
678
+ * 2. An object containing helper functions for the query:
679
+ * - `refetch`: A function to re-execute the query
680
+ * - `fetchMore`: A function to fetch more results for pagination
681
+ * - `subscribeToMore`: A function to subscribe to updates
279
682
  *
683
+ * @example
684
+ *
685
+ * ```jsx
686
+ * import { Suspense } from "react";
687
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
688
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
689
+ *
690
+ * const query = gql`
691
+ * foo {
692
+ * bar
693
+ * }
694
+ * `;
695
+ *
696
+ * const client = new ApolloClient({
697
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
698
+ * cache: new InMemoryCache(),
699
+ * });
700
+ *
701
+ * function SuspenseFallback() {
702
+ * return <div>Loading...</div>;
703
+ * }
704
+ *
705
+ * function Child({ queryRef }) {
706
+ * const { data } = useReadQuery(queryRef);
707
+ *
708
+ * return <div>{data.foo.bar}</div>;
709
+ * }
710
+ *
711
+ * function Parent() {
712
+ * const [queryRef] = useBackgroundQuery(query);
713
+ *
714
+ * return (
715
+ * <Suspense fallback={<SuspenseFallback />}>
716
+ * <Child queryRef={queryRef} />
717
+ * </Suspense>
718
+ * );
719
+ * }
720
+ *
721
+ * function App() {
722
+ * return (
723
+ * <ApolloProvider client={client}>
724
+ * <Parent />
725
+ * </ApolloProvider>
726
+ * );
727
+ * }
728
+ * ```
729
+ *
730
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
731
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
280
732
  */
281
733
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
282
734
  skip: boolean;
@@ -286,7 +738,69 @@ export declare namespace useBackgroundQuery {
286
738
  useBackgroundQuery.Result<TData, TVariables>
287
739
  ];
288
740
  /**
741
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
742
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
743
+ *
744
+ *
745
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
746
+ *
747
+ * @returns A tuple containing:
748
+ *
749
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
750
+ * 2. An object containing helper functions for the query:
751
+ * - `refetch`: A function to re-execute the query
752
+ * - `fetchMore`: A function to fetch more results for pagination
753
+ * - `subscribeToMore`: A function to subscribe to updates
754
+ *
755
+ * @example
756
+ *
757
+ * ```jsx
758
+ * import { Suspense } from "react";
759
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
760
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
761
+ *
762
+ * const query = gql`
763
+ * foo {
764
+ * bar
765
+ * }
766
+ * `;
767
+ *
768
+ * const client = new ApolloClient({
769
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
770
+ * cache: new InMemoryCache(),
771
+ * });
772
+ *
773
+ * function SuspenseFallback() {
774
+ * return <div>Loading...</div>;
775
+ * }
776
+ *
777
+ * function Child({ queryRef }) {
778
+ * const { data } = useReadQuery(queryRef);
289
779
  *
780
+ * return <div>{data.foo.bar}</div>;
781
+ * }
782
+ *
783
+ * function Parent() {
784
+ * const [queryRef] = useBackgroundQuery(query);
785
+ *
786
+ * return (
787
+ * <Suspense fallback={<SuspenseFallback />}>
788
+ * <Child queryRef={queryRef} />
789
+ * </Suspense>
790
+ * );
791
+ * }
792
+ *
793
+ * function App() {
794
+ * return (
795
+ * <ApolloProvider client={client}>
796
+ * <Parent />
797
+ * </ApolloProvider>
798
+ * );
799
+ * }
800
+ * ```
801
+ *
802
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
803
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
290
804
  */
291
805
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
292
806
  skip: boolean;
@@ -296,7 +810,69 @@ export declare namespace useBackgroundQuery {
296
810
  useBackgroundQuery.Result<TData, TVariables>
297
811
  ];
298
812
  /**
813
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
814
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
815
+ *
816
+ *
817
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
818
+ *
819
+ * @returns A tuple containing:
820
+ *
821
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
822
+ * 2. An object containing helper functions for the query:
823
+ * - `refetch`: A function to re-execute the query
824
+ * - `fetchMore`: A function to fetch more results for pagination
825
+ * - `subscribeToMore`: A function to subscribe to updates
826
+ *
827
+ * @example
828
+ *
829
+ * ```jsx
830
+ * import { Suspense } from "react";
831
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
832
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
299
833
  *
834
+ * const query = gql`
835
+ * foo {
836
+ * bar
837
+ * }
838
+ * `;
839
+ *
840
+ * const client = new ApolloClient({
841
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
842
+ * cache: new InMemoryCache(),
843
+ * });
844
+ *
845
+ * function SuspenseFallback() {
846
+ * return <div>Loading...</div>;
847
+ * }
848
+ *
849
+ * function Child({ queryRef }) {
850
+ * const { data } = useReadQuery(queryRef);
851
+ *
852
+ * return <div>{data.foo.bar}</div>;
853
+ * }
854
+ *
855
+ * function Parent() {
856
+ * const [queryRef] = useBackgroundQuery(query);
857
+ *
858
+ * return (
859
+ * <Suspense fallback={<SuspenseFallback />}>
860
+ * <Child queryRef={queryRef} />
861
+ * </Suspense>
862
+ * );
863
+ * }
864
+ *
865
+ * function App() {
866
+ * return (
867
+ * <ApolloProvider client={client}>
868
+ * <Parent />
869
+ * </ApolloProvider>
870
+ * );
871
+ * }
872
+ * ```
873
+ *
874
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
875
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
300
876
  */
301
877
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
302
878
  returnPartialData: false;
@@ -305,7 +881,69 @@ export declare namespace useBackgroundQuery {
305
881
  useBackgroundQuery.Result<TData, TVariables>
306
882
  ];
307
883
  /**
884
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
885
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
886
+ *
887
+ *
888
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
308
889
  *
890
+ * @returns A tuple containing:
891
+ *
892
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
893
+ * 2. An object containing helper functions for the query:
894
+ * - `refetch`: A function to re-execute the query
895
+ * - `fetchMore`: A function to fetch more results for pagination
896
+ * - `subscribeToMore`: A function to subscribe to updates
897
+ *
898
+ * @example
899
+ *
900
+ * ```jsx
901
+ * import { Suspense } from "react";
902
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
903
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
904
+ *
905
+ * const query = gql`
906
+ * foo {
907
+ * bar
908
+ * }
909
+ * `;
910
+ *
911
+ * const client = new ApolloClient({
912
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
913
+ * cache: new InMemoryCache(),
914
+ * });
915
+ *
916
+ * function SuspenseFallback() {
917
+ * return <div>Loading...</div>;
918
+ * }
919
+ *
920
+ * function Child({ queryRef }) {
921
+ * const { data } = useReadQuery(queryRef);
922
+ *
923
+ * return <div>{data.foo.bar}</div>;
924
+ * }
925
+ *
926
+ * function Parent() {
927
+ * const [queryRef] = useBackgroundQuery(query);
928
+ *
929
+ * return (
930
+ * <Suspense fallback={<SuspenseFallback />}>
931
+ * <Child queryRef={queryRef} />
932
+ * </Suspense>
933
+ * );
934
+ * }
935
+ *
936
+ * function App() {
937
+ * return (
938
+ * <ApolloProvider client={client}>
939
+ * <Parent />
940
+ * </ApolloProvider>
941
+ * );
942
+ * }
943
+ * ```
944
+ *
945
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
946
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
309
947
  */
310
948
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
311
949
  returnPartialData: boolean;
@@ -314,7 +952,69 @@ export declare namespace useBackgroundQuery {
314
952
  useBackgroundQuery.Result<TData, TVariables>
315
953
  ];
316
954
  /**
955
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
956
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
957
+ *
958
+ *
959
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
960
+ *
961
+ * @returns A tuple containing:
962
+ *
963
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
964
+ * 2. An object containing helper functions for the query:
965
+ * - `refetch`: A function to re-execute the query
966
+ * - `fetchMore`: A function to fetch more results for pagination
967
+ * - `subscribeToMore`: A function to subscribe to updates
968
+ *
969
+ * @example
970
+ *
971
+ * ```jsx
972
+ * import { Suspense } from "react";
973
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
974
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
975
+ *
976
+ * const query = gql`
977
+ * foo {
978
+ * bar
979
+ * }
980
+ * `;
981
+ *
982
+ * const client = new ApolloClient({
983
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
984
+ * cache: new InMemoryCache(),
985
+ * });
317
986
  *
987
+ * function SuspenseFallback() {
988
+ * return <div>Loading...</div>;
989
+ * }
990
+ *
991
+ * function Child({ queryRef }) {
992
+ * const { data } = useReadQuery(queryRef);
993
+ *
994
+ * return <div>{data.foo.bar}</div>;
995
+ * }
996
+ *
997
+ * function Parent() {
998
+ * const [queryRef] = useBackgroundQuery(query);
999
+ *
1000
+ * return (
1001
+ * <Suspense fallback={<SuspenseFallback />}>
1002
+ * <Child queryRef={queryRef} />
1003
+ * </Suspense>
1004
+ * );
1005
+ * }
1006
+ *
1007
+ * function App() {
1008
+ * return (
1009
+ * <ApolloProvider client={client}>
1010
+ * <Parent />
1011
+ * </ApolloProvider>
1012
+ * );
1013
+ * }
1014
+ * ```
1015
+ *
1016
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1017
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
318
1018
  */
319
1019
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useBackgroundQuery.Options<NoInfer<TVariables>> & {
320
1020
  skip: boolean;
@@ -323,11 +1023,135 @@ export declare namespace useBackgroundQuery {
323
1023
  useBackgroundQuery.Result<TData, TVariables>
324
1024
  ];
325
1025
  /**
1026
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1027
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
1028
+ *
1029
+ *
1030
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1031
+ *
1032
+ * @returns A tuple containing:
1033
+ *
1034
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1035
+ * 2. An object containing helper functions for the query:
1036
+ * - `refetch`: A function to re-execute the query
1037
+ * - `fetchMore`: A function to fetch more results for pagination
1038
+ * - `subscribeToMore`: A function to subscribe to updates
1039
+ *
1040
+ * @example
1041
+ *
1042
+ * ```jsx
1043
+ * import { Suspense } from "react";
1044
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1045
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1046
+ *
1047
+ * const query = gql`
1048
+ * foo {
1049
+ * bar
1050
+ * }
1051
+ * `;
1052
+ *
1053
+ * const client = new ApolloClient({
1054
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1055
+ * cache: new InMemoryCache(),
1056
+ * });
1057
+ *
1058
+ * function SuspenseFallback() {
1059
+ * return <div>Loading...</div>;
1060
+ * }
1061
+ *
1062
+ * function Child({ queryRef }) {
1063
+ * const { data } = useReadQuery(queryRef);
1064
+ *
1065
+ * return <div>{data.foo.bar}</div>;
1066
+ * }
1067
+ *
1068
+ * function Parent() {
1069
+ * const [queryRef] = useBackgroundQuery(query);
1070
+ *
1071
+ * return (
1072
+ * <Suspense fallback={<SuspenseFallback />}>
1073
+ * <Child queryRef={queryRef} />
1074
+ * </Suspense>
1075
+ * );
1076
+ * }
1077
+ *
1078
+ * function App() {
1079
+ * return (
1080
+ * <ApolloProvider client={client}>
1081
+ * <Parent />
1082
+ * </ApolloProvider>
1083
+ * );
1084
+ * }
1085
+ * ```
326
1086
  *
1087
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1088
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
327
1089
  */
328
1090
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken): [undefined, useBackgroundQuery.Result<TData, TVariables>];
329
1091
  /**
1092
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1093
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
330
1094
  *
1095
+ *
1096
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1097
+ *
1098
+ * @returns A tuple containing:
1099
+ *
1100
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1101
+ * 2. An object containing helper functions for the query:
1102
+ * - `refetch`: A function to re-execute the query
1103
+ * - `fetchMore`: A function to fetch more results for pagination
1104
+ * - `subscribeToMore`: A function to subscribe to updates
1105
+ *
1106
+ * @example
1107
+ *
1108
+ * ```jsx
1109
+ * import { Suspense } from "react";
1110
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1111
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1112
+ *
1113
+ * const query = gql`
1114
+ * foo {
1115
+ * bar
1116
+ * }
1117
+ * `;
1118
+ *
1119
+ * const client = new ApolloClient({
1120
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1121
+ * cache: new InMemoryCache(),
1122
+ * });
1123
+ *
1124
+ * function SuspenseFallback() {
1125
+ * return <div>Loading...</div>;
1126
+ * }
1127
+ *
1128
+ * function Child({ queryRef }) {
1129
+ * const { data } = useReadQuery(queryRef);
1130
+ *
1131
+ * return <div>{data.foo.bar}</div>;
1132
+ * }
1133
+ *
1134
+ * function Parent() {
1135
+ * const [queryRef] = useBackgroundQuery(query);
1136
+ *
1137
+ * return (
1138
+ * <Suspense fallback={<SuspenseFallback />}>
1139
+ * <Child queryRef={queryRef} />
1140
+ * </Suspense>
1141
+ * );
1142
+ * }
1143
+ *
1144
+ * function App() {
1145
+ * return (
1146
+ * <ApolloProvider client={client}>
1147
+ * <Parent />
1148
+ * </ApolloProvider>
1149
+ * );
1150
+ * }
1151
+ * ```
1152
+ *
1153
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1154
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
331
1155
  */
332
1156
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken | (useBackgroundQuery.Options<NoInfer<TVariables>> & {
333
1157
  returnPartialData: false;
@@ -336,7 +1160,69 @@ export declare namespace useBackgroundQuery {
336
1160
  useBackgroundQuery.Result<TData, TVariables>
337
1161
  ];
338
1162
  /**
1163
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1164
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
1165
+ *
1166
+ *
1167
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1168
+ *
1169
+ * @returns A tuple containing:
1170
+ *
1171
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1172
+ * 2. An object containing helper functions for the query:
1173
+ * - `refetch`: A function to re-execute the query
1174
+ * - `fetchMore`: A function to fetch more results for pagination
1175
+ * - `subscribeToMore`: A function to subscribe to updates
1176
+ *
1177
+ * @example
1178
+ *
1179
+ * ```jsx
1180
+ * import { Suspense } from "react";
1181
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1182
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1183
+ *
1184
+ * const query = gql`
1185
+ * foo {
1186
+ * bar
1187
+ * }
1188
+ * `;
339
1189
  *
1190
+ * const client = new ApolloClient({
1191
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1192
+ * cache: new InMemoryCache(),
1193
+ * });
1194
+ *
1195
+ * function SuspenseFallback() {
1196
+ * return <div>Loading...</div>;
1197
+ * }
1198
+ *
1199
+ * function Child({ queryRef }) {
1200
+ * const { data } = useReadQuery(queryRef);
1201
+ *
1202
+ * return <div>{data.foo.bar}</div>;
1203
+ * }
1204
+ *
1205
+ * function Parent() {
1206
+ * const [queryRef] = useBackgroundQuery(query);
1207
+ *
1208
+ * return (
1209
+ * <Suspense fallback={<SuspenseFallback />}>
1210
+ * <Child queryRef={queryRef} />
1211
+ * </Suspense>
1212
+ * );
1213
+ * }
1214
+ *
1215
+ * function App() {
1216
+ * return (
1217
+ * <ApolloProvider client={client}>
1218
+ * <Parent />
1219
+ * </ApolloProvider>
1220
+ * );
1221
+ * }
1222
+ * ```
1223
+ *
1224
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1225
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
340
1226
  */
341
1227
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken | (useBackgroundQuery.Options<NoInfer<TVariables>> & {
342
1228
  returnPartialData: boolean;
@@ -345,7 +1231,69 @@ export declare namespace useBackgroundQuery {
345
1231
  useBackgroundQuery.Result<TData, TVariables>
346
1232
  ];
347
1233
  /**
1234
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1235
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
1236
+ *
1237
+ *
1238
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1239
+ *
1240
+ * @returns A tuple containing:
348
1241
  *
1242
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1243
+ * 2. An object containing helper functions for the query:
1244
+ * - `refetch`: A function to re-execute the query
1245
+ * - `fetchMore`: A function to fetch more results for pagination
1246
+ * - `subscribeToMore`: A function to subscribe to updates
1247
+ *
1248
+ * @example
1249
+ *
1250
+ * ```jsx
1251
+ * import { Suspense } from "react";
1252
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1253
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1254
+ *
1255
+ * const query = gql`
1256
+ * foo {
1257
+ * bar
1258
+ * }
1259
+ * `;
1260
+ *
1261
+ * const client = new ApolloClient({
1262
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1263
+ * cache: new InMemoryCache(),
1264
+ * });
1265
+ *
1266
+ * function SuspenseFallback() {
1267
+ * return <div>Loading...</div>;
1268
+ * }
1269
+ *
1270
+ * function Child({ queryRef }) {
1271
+ * const { data } = useReadQuery(queryRef);
1272
+ *
1273
+ * return <div>{data.foo.bar}</div>;
1274
+ * }
1275
+ *
1276
+ * function Parent() {
1277
+ * const [queryRef] = useBackgroundQuery(query);
1278
+ *
1279
+ * return (
1280
+ * <Suspense fallback={<SuspenseFallback />}>
1281
+ * <Child queryRef={queryRef} />
1282
+ * </Suspense>
1283
+ * );
1284
+ * }
1285
+ *
1286
+ * function App() {
1287
+ * return (
1288
+ * <ApolloProvider client={client}>
1289
+ * <Parent />
1290
+ * </ApolloProvider>
1291
+ * );
1292
+ * }
1293
+ * ```
1294
+ *
1295
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1296
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
349
1297
  */
350
1298
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, ...[options]: {} extends TVariables ? [
351
1299
  options?: useBackgroundQuery.Options<NoInfer<TVariables>>
@@ -354,7 +1302,69 @@ export declare namespace useBackgroundQuery {
354
1302
  useBackgroundQuery.Result<TData, TVariables>
355
1303
  ];
356
1304
  /**
1305
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1306
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
1307
+ *
1308
+ *
1309
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1310
+ *
1311
+ * @returns A tuple containing:
1312
+ *
1313
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1314
+ * 2. An object containing helper functions for the query:
1315
+ * - `refetch`: A function to re-execute the query
1316
+ * - `fetchMore`: A function to fetch more results for pagination
1317
+ * - `subscribeToMore`: A function to subscribe to updates
1318
+ *
1319
+ * @example
1320
+ *
1321
+ * ```jsx
1322
+ * import { Suspense } from "react";
1323
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1324
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1325
+ *
1326
+ * const query = gql`
1327
+ * foo {
1328
+ * bar
1329
+ * }
1330
+ * `;
1331
+ *
1332
+ * const client = new ApolloClient({
1333
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1334
+ * cache: new InMemoryCache(),
1335
+ * });
1336
+ *
1337
+ * function SuspenseFallback() {
1338
+ * return <div>Loading...</div>;
1339
+ * }
1340
+ *
1341
+ * function Child({ queryRef }) {
1342
+ * const { data } = useReadQuery(queryRef);
357
1343
  *
1344
+ * return <div>{data.foo.bar}</div>;
1345
+ * }
1346
+ *
1347
+ * function Parent() {
1348
+ * const [queryRef] = useBackgroundQuery(query);
1349
+ *
1350
+ * return (
1351
+ * <Suspense fallback={<SuspenseFallback />}>
1352
+ * <Child queryRef={queryRef} />
1353
+ * </Suspense>
1354
+ * );
1355
+ * }
1356
+ *
1357
+ * function App() {
1358
+ * return (
1359
+ * <ApolloProvider client={client}>
1360
+ * <Parent />
1361
+ * </ApolloProvider>
1362
+ * );
1363
+ * }
1364
+ * ```
1365
+ *
1366
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1367
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
358
1368
  */
359
1369
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, ...[options]: {} extends TVariables ? [
360
1370
  options?: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>
@@ -363,7 +1373,69 @@ export declare namespace useBackgroundQuery {
363
1373
  useBackgroundQuery.Result<TData, TVariables>
364
1374
  ];
365
1375
  /**
1376
+ * @deprecated Avoid manually specifying generics on `useBackgroundQuery`.
1377
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
1378
+ *
1379
+ *
1380
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1381
+ *
1382
+ * @returns A tuple containing:
1383
+ *
1384
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1385
+ * 2. An object containing helper functions for the query:
1386
+ * - `refetch`: A function to re-execute the query
1387
+ * - `fetchMore`: A function to fetch more results for pagination
1388
+ * - `subscribeToMore`: A function to subscribe to updates
1389
+ *
1390
+ * @example
366
1391
  *
1392
+ * ```jsx
1393
+ * import { Suspense } from "react";
1394
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1395
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1396
+ *
1397
+ * const query = gql`
1398
+ * foo {
1399
+ * bar
1400
+ * }
1401
+ * `;
1402
+ *
1403
+ * const client = new ApolloClient({
1404
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1405
+ * cache: new InMemoryCache(),
1406
+ * });
1407
+ *
1408
+ * function SuspenseFallback() {
1409
+ * return <div>Loading...</div>;
1410
+ * }
1411
+ *
1412
+ * function Child({ queryRef }) {
1413
+ * const { data } = useReadQuery(queryRef);
1414
+ *
1415
+ * return <div>{data.foo.bar}</div>;
1416
+ * }
1417
+ *
1418
+ * function Parent() {
1419
+ * const [queryRef] = useBackgroundQuery(query);
1420
+ *
1421
+ * return (
1422
+ * <Suspense fallback={<SuspenseFallback />}>
1423
+ * <Child queryRef={queryRef} />
1424
+ * </Suspense>
1425
+ * );
1426
+ * }
1427
+ *
1428
+ * function App() {
1429
+ * return (
1430
+ * <ApolloProvider client={client}>
1431
+ * <Parent />
1432
+ * </ApolloProvider>
1433
+ * );
1434
+ * }
1435
+ * ```
1436
+ *
1437
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1438
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
367
1439
  */
368
1440
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>): [
369
1441
  QueryRef<TData, TVariables, "complete" | "streaming"> | undefined,
@@ -371,25 +1443,315 @@ export declare namespace useBackgroundQuery {
371
1443
  ];
372
1444
  }
373
1445
  /**
1446
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1447
+ *
1448
+ * @returns A tuple containing:
1449
+ *
1450
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1451
+ * 2. An object containing helper functions for the query:
1452
+ * - `refetch`: A function to re-execute the query
1453
+ * - `fetchMore`: A function to fetch more results for pagination
1454
+ * - `subscribeToMore`: A function to subscribe to updates
1455
+ *
1456
+ * @example
1457
+ *
1458
+ * ```jsx
1459
+ * import { Suspense } from "react";
1460
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1461
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1462
+ *
1463
+ * const query = gql`
1464
+ * foo {
1465
+ * bar
1466
+ * }
1467
+ * `;
1468
+ *
1469
+ * const client = new ApolloClient({
1470
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1471
+ * cache: new InMemoryCache(),
1472
+ * });
1473
+ *
1474
+ * function SuspenseFallback() {
1475
+ * return <div>Loading...</div>;
1476
+ * }
1477
+ *
1478
+ * function Child({ queryRef }) {
1479
+ * const { data } = useReadQuery(queryRef);
1480
+ *
1481
+ * return <div>{data.foo.bar}</div>;
1482
+ * }
1483
+ *
1484
+ * function Parent() {
1485
+ * const [queryRef] = useBackgroundQuery(query);
1486
+ *
1487
+ * return (
1488
+ * <Suspense fallback={<SuspenseFallback />}>
1489
+ * <Child queryRef={queryRef} />
1490
+ * </Suspense>
1491
+ * );
1492
+ * }
1493
+ *
1494
+ * function App() {
1495
+ * return (
1496
+ * <ApolloProvider client={client}>
1497
+ * <Parent />
1498
+ * </ApolloProvider>
1499
+ * );
1500
+ * }
1501
+ * ```
374
1502
  *
1503
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1504
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
375
1505
  */
376
1506
  interface Modern {
377
1507
  /**
1508
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
378
1509
  *
1510
+ * @returns A tuple containing:
1511
+ *
1512
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1513
+ * 2. An object containing helper functions for the query:
1514
+ * - `refetch`: A function to re-execute the query
1515
+ * - `fetchMore`: A function to fetch more results for pagination
1516
+ * - `subscribeToMore`: A function to subscribe to updates
1517
+ *
1518
+ * @example
1519
+ *
1520
+ * ```jsx
1521
+ * import { Suspense } from "react";
1522
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1523
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1524
+ *
1525
+ * const query = gql`
1526
+ * foo {
1527
+ * bar
1528
+ * }
1529
+ * `;
1530
+ *
1531
+ * const client = new ApolloClient({
1532
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1533
+ * cache: new InMemoryCache(),
1534
+ * });
1535
+ *
1536
+ * function SuspenseFallback() {
1537
+ * return <div>Loading...</div>;
1538
+ * }
1539
+ *
1540
+ * function Child({ queryRef }) {
1541
+ * const { data } = useReadQuery(queryRef);
1542
+ *
1543
+ * return <div>{data.foo.bar}</div>;
1544
+ * }
1545
+ *
1546
+ * function Parent() {
1547
+ * const [queryRef] = useBackgroundQuery(query);
1548
+ *
1549
+ * return (
1550
+ * <Suspense fallback={<SuspenseFallback />}>
1551
+ * <Child queryRef={queryRef} />
1552
+ * </Suspense>
1553
+ * );
1554
+ * }
1555
+ *
1556
+ * function App() {
1557
+ * return (
1558
+ * <ApolloProvider client={client}>
1559
+ * <Parent />
1560
+ * </ApolloProvider>
1561
+ * );
1562
+ * }
1563
+ * ```
1564
+ *
1565
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1566
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
379
1567
  */
380
1568
  <TData, TVariables extends OperationVariables, TOptions extends never>(query: {} extends TVariables ? DocumentNode | TypedDocumentNode<TData, TVariables> : never): useBackgroundQuery.ResultForOptions<TData, TVariables, Record<string, never>>;
381
1569
  /**
1570
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1571
+ *
1572
+ * @returns A tuple containing:
1573
+ *
1574
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1575
+ * 2. An object containing helper functions for the query:
1576
+ * - `refetch`: A function to re-execute the query
1577
+ * - `fetchMore`: A function to fetch more results for pagination
1578
+ * - `subscribeToMore`: A function to subscribe to updates
1579
+ *
1580
+ * @example
1581
+ *
1582
+ * ```jsx
1583
+ * import { Suspense } from "react";
1584
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1585
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1586
+ *
1587
+ * const query = gql`
1588
+ * foo {
1589
+ * bar
1590
+ * }
1591
+ * `;
1592
+ *
1593
+ * const client = new ApolloClient({
1594
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1595
+ * cache: new InMemoryCache(),
1596
+ * });
1597
+ *
1598
+ * function SuspenseFallback() {
1599
+ * return <div>Loading...</div>;
1600
+ * }
1601
+ *
1602
+ * function Child({ queryRef }) {
1603
+ * const { data } = useReadQuery(queryRef);
382
1604
  *
1605
+ * return <div>{data.foo.bar}</div>;
1606
+ * }
1607
+ *
1608
+ * function Parent() {
1609
+ * const [queryRef] = useBackgroundQuery(query);
1610
+ *
1611
+ * return (
1612
+ * <Suspense fallback={<SuspenseFallback />}>
1613
+ * <Child queryRef={queryRef} />
1614
+ * </Suspense>
1615
+ * );
1616
+ * }
1617
+ *
1618
+ * function App() {
1619
+ * return (
1620
+ * <ApolloProvider client={client}>
1621
+ * <Parent />
1622
+ * </ApolloProvider>
1623
+ * );
1624
+ * }
1625
+ * ```
1626
+ *
1627
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1628
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
383
1629
  */
384
1630
  <TData, TVariables extends OperationVariables, TOptions extends never>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, skipToken: SkipToken): useBackgroundQuery.ResultForOptions<TData, TVariables, SkipToken>;
385
1631
  /**
1632
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1633
+ *
1634
+ * @returns A tuple containing:
1635
+ *
1636
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1637
+ * 2. An object containing helper functions for the query:
1638
+ * - `refetch`: A function to re-execute the query
1639
+ * - `fetchMore`: A function to fetch more results for pagination
1640
+ * - `subscribeToMore`: A function to subscribe to updates
1641
+ *
1642
+ * @example
1643
+ *
1644
+ * ```jsx
1645
+ * import { Suspense } from "react";
1646
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1647
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1648
+ *
1649
+ * const query = gql`
1650
+ * foo {
1651
+ * bar
1652
+ * }
1653
+ * `;
1654
+ *
1655
+ * const client = new ApolloClient({
1656
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1657
+ * cache: new InMemoryCache(),
1658
+ * });
386
1659
  *
1660
+ * function SuspenseFallback() {
1661
+ * return <div>Loading...</div>;
1662
+ * }
1663
+ *
1664
+ * function Child({ queryRef }) {
1665
+ * const { data } = useReadQuery(queryRef);
1666
+ *
1667
+ * return <div>{data.foo.bar}</div>;
1668
+ * }
1669
+ *
1670
+ * function Parent() {
1671
+ * const [queryRef] = useBackgroundQuery(query);
1672
+ *
1673
+ * return (
1674
+ * <Suspense fallback={<SuspenseFallback />}>
1675
+ * <Child queryRef={queryRef} />
1676
+ * </Suspense>
1677
+ * );
1678
+ * }
1679
+ *
1680
+ * function App() {
1681
+ * return (
1682
+ * <ApolloProvider client={client}>
1683
+ * <Parent />
1684
+ * </ApolloProvider>
1685
+ * );
1686
+ * }
1687
+ * ```
1688
+ *
1689
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1690
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
387
1691
  */
388
1692
  <TData, TVariables extends OperationVariables, TOptions extends useBackgroundQuery.Options<NoInfer<TVariables>> & VariablesOption<TVariables & {
389
1693
  [K in Exclude<keyof TOptions["variables"], keyof TVariables>]?: never;
390
1694
  }>>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, ...[options]: {} extends TVariables ? [options?: TOptions] : [options: TOptions]): useBackgroundQuery.ResultForOptions<TData, TVariables, TOptions>;
391
1695
  /**
1696
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1697
+ *
1698
+ * @returns A tuple containing:
1699
+ *
1700
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1701
+ * 2. An object containing helper functions for the query:
1702
+ * - `refetch`: A function to re-execute the query
1703
+ * - `fetchMore`: A function to fetch more results for pagination
1704
+ * - `subscribeToMore`: A function to subscribe to updates
1705
+ *
1706
+ * @example
1707
+ *
1708
+ * ```jsx
1709
+ * import { Suspense } from "react";
1710
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1711
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
392
1712
  *
1713
+ * const query = gql`
1714
+ * foo {
1715
+ * bar
1716
+ * }
1717
+ * `;
1718
+ *
1719
+ * const client = new ApolloClient({
1720
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1721
+ * cache: new InMemoryCache(),
1722
+ * });
1723
+ *
1724
+ * function SuspenseFallback() {
1725
+ * return <div>Loading...</div>;
1726
+ * }
1727
+ *
1728
+ * function Child({ queryRef }) {
1729
+ * const { data } = useReadQuery(queryRef);
1730
+ *
1731
+ * return <div>{data.foo.bar}</div>;
1732
+ * }
1733
+ *
1734
+ * function Parent() {
1735
+ * const [queryRef] = useBackgroundQuery(query);
1736
+ *
1737
+ * return (
1738
+ * <Suspense fallback={<SuspenseFallback />}>
1739
+ * <Child queryRef={queryRef} />
1740
+ * </Suspense>
1741
+ * );
1742
+ * }
1743
+ *
1744
+ * function App() {
1745
+ * return (
1746
+ * <ApolloProvider client={client}>
1747
+ * <Parent />
1748
+ * </ApolloProvider>
1749
+ * );
1750
+ * }
1751
+ * ```
1752
+ *
1753
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1754
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
393
1755
  */
394
1756
  <TData, TVariables extends OperationVariables, TOptions extends useBackgroundQuery.Options<NoInfer<TVariables>> & VariablesOption<TVariables & {
395
1757
  [K in Exclude<keyof TOptions["variables"], keyof TVariables>]?: never;
@@ -398,7 +1760,65 @@ export declare namespace useBackgroundQuery {
398
1760
  type Evaluated = SignatureStyle extends "classic" ? Classic : Modern;
399
1761
  }
400
1762
  /**
1763
+ * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).
1764
+ *
1765
+ * @returns A tuple containing:
1766
+ *
1767
+ * 1. A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.
1768
+ * 2. An object containing helper functions for the query:
1769
+ * - `refetch`: A function to re-execute the query
1770
+ * - `fetchMore`: A function to fetch more results for pagination
1771
+ * - `subscribeToMore`: A function to subscribe to updates
1772
+ *
1773
+ * @example
1774
+ *
1775
+ * ```jsx
1776
+ * import { Suspense } from "react";
1777
+ * import { ApolloClient, InMemoryCache, HttpLink } from "@apollo/client";
1778
+ * import { useBackgroundQuery, useReadQuery } from "@apollo/client/react";
1779
+ *
1780
+ * const query = gql`
1781
+ * foo {
1782
+ * bar
1783
+ * }
1784
+ * `;
1785
+ *
1786
+ * const client = new ApolloClient({
1787
+ * link: new HttpLink({ uri: "http://localhost:4000/graphql" }),
1788
+ * cache: new InMemoryCache(),
1789
+ * });
1790
+ *
1791
+ * function SuspenseFallback() {
1792
+ * return <div>Loading...</div>;
1793
+ * }
1794
+ *
1795
+ * function Child({ queryRef }) {
1796
+ * const { data } = useReadQuery(queryRef);
1797
+ *
1798
+ * return <div>{data.foo.bar}</div>;
1799
+ * }
1800
+ *
1801
+ * function Parent() {
1802
+ * const [queryRef] = useBackgroundQuery(query);
1803
+ *
1804
+ * return (
1805
+ * <Suspense fallback={<SuspenseFallback />}>
1806
+ * <Child queryRef={queryRef} />
1807
+ * </Suspense>
1808
+ * );
1809
+ * }
1810
+ *
1811
+ * function App() {
1812
+ * return (
1813
+ * <ApolloProvider client={client}>
1814
+ * <Parent />
1815
+ * </ApolloProvider>
1816
+ * );
1817
+ * }
1818
+ * ```
401
1819
  *
1820
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
1821
+ * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.
402
1822
  */
403
1823
  interface Signature extends Signatures.Evaluated {
404
1824
  }