@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, DataState, DefaultContext, DocumentNode, ErrorPolicy, OperationVariables, RefetchWritePolicy, TypedDocumentNode, WatchQueryFetchPolicy } from "@apollo/client";
1
+ import type { ApolloClient, DataState, 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";
@@ -109,113 +109,575 @@ export declare namespace useLoadableQuery {
109
109
  * @docGroup 3. Caching options
110
110
  */
111
111
  returnPartialData?: boolean;
112
+ /**
113
+ * Determines whether events trigger refetches for the query. Provide an
114
+ * object mapping each refetch event to `true` (enable), `false` (disable)
115
+ * or a callback function that returns `true`/`false` to control individual
116
+ * events. Provide `false` to disable all automatic refetch events for this
117
+ * query. Provide `true` to enable all automatic refetch events for this query.
118
+ * Provide a callback function to perform additional logic to determine
119
+ * whether to enable or disable a refetch for a query.
120
+ *
121
+ * `@remarks`
122
+ * `refetchOn` inherits from `defaultOptions.watchQuery.refetchOn`. If
123
+ * `defaultOptions.watchQuery.refetchOn` is not set, all refetch events are
124
+ * enabled by default.
125
+ *
126
+ * This option only has an effect when the client is configured with a
127
+ * `refetchEventManager`.
128
+ * @docGroup 1. Operation options
129
+ */
130
+ refetchOn?: RefetchOn.Option;
112
131
  }
113
132
  interface DefaultOptions extends ApolloClient.DefaultOptions.WatchQuery.Calculated {
114
133
  }
115
134
  type ResultForOptions<TData, TVariables extends OperationVariables, TOptions extends Record<string, never> | Options> = Result<TData, TVariables, "complete" | "streaming" | (OptionWithFallback<TOptions, DefaultOptions, "errorPolicy"> extends ("none") ? never : "empty") | (OptionWithFallback<TOptions, DefaultOptions, "returnPartialData"> extends false ? never : "partial")>;
116
135
  namespace DocumentationTypes {
117
- /**
118
- * A hook for imperatively loading a query, such as responding to a user
119
- * interaction.
120
- *
121
- * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
122
- *
123
- * @example
124
- *
125
- * ```jsx
126
- * import { gql, useLoadableQuery } from "@apollo/client";
127
- *
128
- * const GET_GREETING = gql`
129
- * query GetGreeting($language: String!) {
130
- * greeting(language: $language) {
131
- * message
132
- * }
133
- * }
134
- * `;
135
- *
136
- * function App() {
137
- * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
138
- *
139
- * return (
140
- * <>
141
- * <button onClick={() => loadGreeting({ language: "english" })}>
142
- * Load greeting
143
- * </button>
144
- * <Suspense fallback={<div>Loading...</div>}>
145
- * {queryRef && <Hello queryRef={queryRef} />}
146
- * </Suspense>
147
- * </>
148
- * );
149
- * }
150
- *
151
- * function Hello({ queryRef }) {
152
- * const { data } = useReadQuery(queryRef);
153
- *
154
- * return <div>{data.greeting.message}</div>;
155
- * }
156
- * ```
157
- *
158
- * @param query - A GraphQL query document parsed into an AST by `gql`.
159
- * @param options - Options to control how the query is executed.
160
- * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
161
- */
162
136
  interface useLoadableQuery {
137
+ /**
138
+ * A hook for imperatively loading a query, such as responding to a user
139
+ * interaction.
140
+ *
141
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
142
+ *
143
+ * @example
144
+ *
145
+ * ```jsx
146
+ * import { gql, useLoadableQuery } from "@apollo/client";
147
+ *
148
+ * const GET_GREETING = gql`
149
+ * query GetGreeting($language: String!) {
150
+ * greeting(language: $language) {
151
+ * message
152
+ * }
153
+ * }
154
+ * `;
155
+ *
156
+ * function App() {
157
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
158
+ *
159
+ * return (
160
+ * <>
161
+ * <button onClick={() => loadGreeting({ language: "english" })}>
162
+ * Load greeting
163
+ * </button>
164
+ * <Suspense fallback={<div>Loading...</div>}>
165
+ * {queryRef && <Hello queryRef={queryRef} />}
166
+ * </Suspense>
167
+ * </>
168
+ * );
169
+ * }
170
+ *
171
+ * function Hello({ queryRef }) {
172
+ * const { data } = useReadQuery(queryRef);
173
+ *
174
+ * return <div>{data.greeting.message}</div>;
175
+ * }
176
+ * ```
177
+ *
178
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
179
+ * @param options - Options to control how the query is executed.
180
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
181
+ */
163
182
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables>;
164
183
  }
165
- /**
166
- * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
167
- * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
168
- */
169
184
  interface useLoadableQuery_Deprecated {
185
+ /**
186
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
187
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
188
+ *
189
+ *
190
+ * A hook for imperatively loading a query, such as responding to a user
191
+ * interaction.
192
+ *
193
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
194
+ *
195
+ * @example
196
+ *
197
+ * ```jsx
198
+ * import { gql, useLoadableQuery } from "@apollo/client";
199
+ *
200
+ * const GET_GREETING = gql`
201
+ * query GetGreeting($language: String!) {
202
+ * greeting(language: $language) {
203
+ * message
204
+ * }
205
+ * }
206
+ * `;
207
+ *
208
+ * function App() {
209
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
210
+ *
211
+ * return (
212
+ * <>
213
+ * <button onClick={() => loadGreeting({ language: "english" })}>
214
+ * Load greeting
215
+ * </button>
216
+ * <Suspense fallback={<div>Loading...</div>}>
217
+ * {queryRef && <Hello queryRef={queryRef} />}
218
+ * </Suspense>
219
+ * </>
220
+ * );
221
+ * }
222
+ *
223
+ * function Hello({ queryRef }) {
224
+ * const { data } = useReadQuery(queryRef);
225
+ *
226
+ * return <div>{data.greeting.message}</div>;
227
+ * }
228
+ * ```
229
+ *
230
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
231
+ * @param options - Options to control how the query is executed.
232
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
233
+ */
170
234
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables>;
171
235
  }
172
236
  }
173
237
  namespace Signatures {
174
238
  /**
239
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
240
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
241
+ *
242
+ *
243
+ * A hook for imperatively loading a query, such as responding to a user
244
+ * interaction.
175
245
  *
246
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
247
+ *
248
+ * @example
249
+ *
250
+ * ```jsx
251
+ * import { gql, useLoadableQuery } from "@apollo/client";
252
+ *
253
+ * const GET_GREETING = gql`
254
+ * query GetGreeting($language: String!) {
255
+ * greeting(language: $language) {
256
+ * message
257
+ * }
258
+ * }
259
+ * `;
260
+ *
261
+ * function App() {
262
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
263
+ *
264
+ * return (
265
+ * <>
266
+ * <button onClick={() => loadGreeting({ language: "english" })}>
267
+ * Load greeting
268
+ * </button>
269
+ * <Suspense fallback={<div>Loading...</div>}>
270
+ * {queryRef && <Hello queryRef={queryRef} />}
271
+ * </Suspense>
272
+ * </>
273
+ * );
274
+ * }
275
+ *
276
+ * function Hello({ queryRef }) {
277
+ * const { data } = useReadQuery(queryRef);
278
+ *
279
+ * return <div>{data.greeting.message}</div>;
280
+ * }
281
+ * ```
282
+ *
283
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
284
+ * @param options - Options to control how the query is executed.
285
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
176
286
  */
177
287
  interface Classic {
178
288
  /**
289
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
290
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
291
+ *
292
+ *
293
+ * A hook for imperatively loading a query, such as responding to a user
294
+ * interaction.
295
+ *
296
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
297
+ *
298
+ * @example
299
+ *
300
+ * ```jsx
301
+ * import { gql, useLoadableQuery } from "@apollo/client";
302
+ *
303
+ * const GET_GREETING = gql`
304
+ * query GetGreeting($language: String!) {
305
+ * greeting(language: $language) {
306
+ * message
307
+ * }
308
+ * }
309
+ * `;
179
310
  *
311
+ * function App() {
312
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
313
+ *
314
+ * return (
315
+ * <>
316
+ * <button onClick={() => loadGreeting({ language: "english" })}>
317
+ * Load greeting
318
+ * </button>
319
+ * <Suspense fallback={<div>Loading...</div>}>
320
+ * {queryRef && <Hello queryRef={queryRef} />}
321
+ * </Suspense>
322
+ * </>
323
+ * );
324
+ * }
325
+ *
326
+ * function Hello({ queryRef }) {
327
+ * const { data } = useReadQuery(queryRef);
328
+ *
329
+ * return <div>{data.greeting.message}</div>;
330
+ * }
331
+ * ```
332
+ *
333
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
334
+ * @param options - Options to control how the query is executed.
335
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
180
336
  */
181
337
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
182
338
  returnPartialData: true;
183
339
  errorPolicy: "ignore" | "all";
184
340
  }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "partial" | "empty">;
185
341
  /**
342
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
343
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
344
+ *
345
+ *
346
+ * A hook for imperatively loading a query, such as responding to a user
347
+ * interaction.
348
+ *
349
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
350
+ *
351
+ * @example
352
+ *
353
+ * ```jsx
354
+ * import { gql, useLoadableQuery } from "@apollo/client";
355
+ *
356
+ * const GET_GREETING = gql`
357
+ * query GetGreeting($language: String!) {
358
+ * greeting(language: $language) {
359
+ * message
360
+ * }
361
+ * }
362
+ * `;
363
+ *
364
+ * function App() {
365
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
366
+ *
367
+ * return (
368
+ * <>
369
+ * <button onClick={() => loadGreeting({ language: "english" })}>
370
+ * Load greeting
371
+ * </button>
372
+ * <Suspense fallback={<div>Loading...</div>}>
373
+ * {queryRef && <Hello queryRef={queryRef} />}
374
+ * </Suspense>
375
+ * </>
376
+ * );
377
+ * }
378
+ *
379
+ * function Hello({ queryRef }) {
380
+ * const { data } = useReadQuery(queryRef);
186
381
  *
382
+ * return <div>{data.greeting.message}</div>;
383
+ * }
384
+ * ```
385
+ *
386
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
387
+ * @param options - Options to control how the query is executed.
388
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
187
389
  */
188
390
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
189
391
  errorPolicy: "ignore" | "all";
190
392
  }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "empty">;
191
393
  /**
394
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
395
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
396
+ *
397
+ *
398
+ * A hook for imperatively loading a query, such as responding to a user
399
+ * interaction.
400
+ *
401
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
402
+ *
403
+ * @example
404
+ *
405
+ * ```jsx
406
+ * import { gql, useLoadableQuery } from "@apollo/client";
407
+ *
408
+ * const GET_GREETING = gql`
409
+ * query GetGreeting($language: String!) {
410
+ * greeting(language: $language) {
411
+ * message
412
+ * }
413
+ * }
414
+ * `;
192
415
  *
416
+ * function App() {
417
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
418
+ *
419
+ * return (
420
+ * <>
421
+ * <button onClick={() => loadGreeting({ language: "english" })}>
422
+ * Load greeting
423
+ * </button>
424
+ * <Suspense fallback={<div>Loading...</div>}>
425
+ * {queryRef && <Hello queryRef={queryRef} />}
426
+ * </Suspense>
427
+ * </>
428
+ * );
429
+ * }
430
+ *
431
+ * function Hello({ queryRef }) {
432
+ * const { data } = useReadQuery(queryRef);
433
+ *
434
+ * return <div>{data.greeting.message}</div>;
435
+ * }
436
+ * ```
437
+ *
438
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
439
+ * @param options - Options to control how the query is executed.
440
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
193
441
  */
194
442
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
195
443
  returnPartialData: true;
196
444
  }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "partial">;
197
445
  /**
446
+ * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
447
+ * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
448
+ *
449
+ *
450
+ * A hook for imperatively loading a query, such as responding to a user
451
+ * interaction.
452
+ *
453
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
198
454
  *
455
+ * @example
456
+ *
457
+ * ```jsx
458
+ * import { gql, useLoadableQuery } from "@apollo/client";
459
+ *
460
+ * const GET_GREETING = gql`
461
+ * query GetGreeting($language: String!) {
462
+ * greeting(language: $language) {
463
+ * message
464
+ * }
465
+ * }
466
+ * `;
467
+ *
468
+ * function App() {
469
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
470
+ *
471
+ * return (
472
+ * <>
473
+ * <button onClick={() => loadGreeting({ language: "english" })}>
474
+ * Load greeting
475
+ * </button>
476
+ * <Suspense fallback={<div>Loading...</div>}>
477
+ * {queryRef && <Hello queryRef={queryRef} />}
478
+ * </Suspense>
479
+ * </>
480
+ * );
481
+ * }
482
+ *
483
+ * function Hello({ queryRef }) {
484
+ * const { data } = useReadQuery(queryRef);
485
+ *
486
+ * return <div>{data.greeting.message}</div>;
487
+ * }
488
+ * ```
489
+ *
490
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
491
+ * @param options - Options to control how the query is executed.
492
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
199
493
  */
200
494
  <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming">;
201
495
  }
202
496
  /**
497
+ * A hook for imperatively loading a query, such as responding to a user
498
+ * interaction.
499
+ *
500
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
501
+ *
502
+ * @example
503
+ *
504
+ * ```jsx
505
+ * import { gql, useLoadableQuery } from "@apollo/client";
506
+ *
507
+ * const GET_GREETING = gql`
508
+ * query GetGreeting($language: String!) {
509
+ * greeting(language: $language) {
510
+ * message
511
+ * }
512
+ * }
513
+ * `;
514
+ *
515
+ * function App() {
516
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
517
+ *
518
+ * return (
519
+ * <>
520
+ * <button onClick={() => loadGreeting({ language: "english" })}>
521
+ * Load greeting
522
+ * </button>
523
+ * <Suspense fallback={<div>Loading...</div>}>
524
+ * {queryRef && <Hello queryRef={queryRef} />}
525
+ * </Suspense>
526
+ * </>
527
+ * );
528
+ * }
203
529
  *
530
+ * function Hello({ queryRef }) {
531
+ * const { data } = useReadQuery(queryRef);
532
+ *
533
+ * return <div>{data.greeting.message}</div>;
534
+ * }
535
+ * ```
536
+ *
537
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
538
+ * @param options - Options to control how the query is executed.
539
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
204
540
  */
205
541
  interface Modern {
206
542
  /**
543
+ * A hook for imperatively loading a query, such as responding to a user
544
+ * interaction.
545
+ *
546
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
547
+ *
548
+ * @example
549
+ *
550
+ * ```jsx
551
+ * import { gql, useLoadableQuery } from "@apollo/client";
552
+ *
553
+ * const GET_GREETING = gql`
554
+ * query GetGreeting($language: String!) {
555
+ * greeting(language: $language) {
556
+ * message
557
+ * }
558
+ * }
559
+ * `;
560
+ *
561
+ * function App() {
562
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
207
563
  *
564
+ * return (
565
+ * <>
566
+ * <button onClick={() => loadGreeting({ language: "english" })}>
567
+ * Load greeting
568
+ * </button>
569
+ * <Suspense fallback={<div>Loading...</div>}>
570
+ * {queryRef && <Hello queryRef={queryRef} />}
571
+ * </Suspense>
572
+ * </>
573
+ * );
574
+ * }
575
+ *
576
+ * function Hello({ queryRef }) {
577
+ * const { data } = useReadQuery(queryRef);
578
+ *
579
+ * return <div>{data.greeting.message}</div>;
580
+ * }
581
+ * ```
582
+ *
583
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
584
+ * @param options - Options to control how the query is executed.
585
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
208
586
  */
209
587
  <TData, TVariables extends OperationVariables, TOptions extends never>(query: DocumentNode | TypedDocumentNode<TData, TVariables>): useLoadableQuery.ResultForOptions<TData, TVariables, Record<string, never>>;
210
588
  /**
589
+ * A hook for imperatively loading a query, such as responding to a user
590
+ * interaction.
591
+ *
592
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
593
+ *
594
+ * @example
595
+ *
596
+ * ```jsx
597
+ * import { gql, useLoadableQuery } from "@apollo/client";
211
598
  *
599
+ * const GET_GREETING = gql`
600
+ * query GetGreeting($language: String!) {
601
+ * greeting(language: $language) {
602
+ * message
603
+ * }
604
+ * }
605
+ * `;
606
+ *
607
+ * function App() {
608
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
609
+ *
610
+ * return (
611
+ * <>
612
+ * <button onClick={() => loadGreeting({ language: "english" })}>
613
+ * Load greeting
614
+ * </button>
615
+ * <Suspense fallback={<div>Loading...</div>}>
616
+ * {queryRef && <Hello queryRef={queryRef} />}
617
+ * </Suspense>
618
+ * </>
619
+ * );
620
+ * }
621
+ *
622
+ * function Hello({ queryRef }) {
623
+ * const { data } = useReadQuery(queryRef);
624
+ *
625
+ * return <div>{data.greeting.message}</div>;
626
+ * }
627
+ * ```
628
+ *
629
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
630
+ * @param options - Options to control how the query is executed.
631
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
212
632
  */
213
633
  <TData, TVariables extends OperationVariables, TOptions extends useLoadableQuery.Options>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: TOptions): useLoadableQuery.ResultForOptions<TData, TVariables, TOptions>;
214
634
  }
215
635
  type Evaluated = SignatureStyle extends "classic" ? Classic : Modern;
216
636
  }
217
637
  /**
638
+ * A hook for imperatively loading a query, such as responding to a user
639
+ * interaction.
640
+ *
641
+ * > Refer to the [Suspense - Fetching in response to user interaction](https://www.apollographql.com/docs/react/data/suspense#fetching-in-response-to-user-interaction) section for a more in-depth overview of `useLoadableQuery`.
642
+ *
643
+ * @example
644
+ *
645
+ * ```jsx
646
+ * import { gql, useLoadableQuery } from "@apollo/client";
647
+ *
648
+ * const GET_GREETING = gql`
649
+ * query GetGreeting($language: String!) {
650
+ * greeting(language: $language) {
651
+ * message
652
+ * }
653
+ * }
654
+ * `;
655
+ *
656
+ * function App() {
657
+ * const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
658
+ *
659
+ * return (
660
+ * <>
661
+ * <button onClick={() => loadGreeting({ language: "english" })}>
662
+ * Load greeting
663
+ * </button>
664
+ * <Suspense fallback={<div>Loading...</div>}>
665
+ * {queryRef && <Hello queryRef={queryRef} />}
666
+ * </Suspense>
667
+ * </>
668
+ * );
669
+ * }
670
+ *
671
+ * function Hello({ queryRef }) {
672
+ * const { data } = useReadQuery(queryRef);
673
+ *
674
+ * return <div>{data.greeting.message}</div>;
675
+ * }
676
+ * ```
218
677
  *
678
+ * @param query - A GraphQL query document parsed into an AST by `gql`.
679
+ * @param options - Options to control how the query is executed.
680
+ * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
219
681
  */
220
682
  interface Signature extends Signatures.Evaluated {
221
683
  }