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

package/react/hooks-compiled/useLoadableQuery.d.ts

@@ -114,108 +114,551 @@ export declare namespace useLoadableQuery {
     }
     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")>;
     namespace DocumentationTypes {
-        /**
-         * A hook for imperatively loading a query, such as responding to a user
-         * interaction.
-         *
-         * > 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`.
-         *
-         * @example
-         *
-         * ```jsx
-         * import { gql, useLoadableQuery } from "@apollo/client";
-         *
-         * const GET_GREETING = gql`
-         *   query GetGreeting($language: String!) {
-         *     greeting(language: $language) {
-         *       message
-         *     }
-         *   }
-         * `;
-         *
-         * function App() {
-         *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
-         *
-         *   return (
-         *     <>
-         *       <button onClick={() => loadGreeting({ language: "english" })}>
-         *         Load greeting
-         *       </button>
-         *       <Suspense fallback={<div>Loading...</div>}>
-         *         {queryRef && <Hello queryRef={queryRef} />}
-         *       </Suspense>
-         *     </>
-         *   );
-         * }
-         *
-         * function Hello({ queryRef }) {
-         *   const { data } = useReadQuery(queryRef);
-         *
-         *   return <div>{data.greeting.message}</div>;
-         * }
-         * ```
-         *
-         * @param query - A GraphQL query document parsed into an AST by `gql`.
-         * @param options - Options to control how the query is executed.
-         * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
-         */
         interface useLoadableQuery {
+            /**
+             * A hook for imperatively loading a query, such as responding to a user
+             * interaction.
+             *
+             * > 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`.
+             *
+             * @example
+             *
+             * ```jsx
+             * import { gql, useLoadableQuery } from "@apollo/client";
+             *
+             * const GET_GREETING = gql`
+             *   query GetGreeting($language: String!) {
+             *     greeting(language: $language) {
+             *       message
+             *     }
+             *   }
+             * `;
+             *
+             * function App() {
+             *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+             *
+             *   return (
+             *     <>
+             *       <button onClick={() => loadGreeting({ language: "english" })}>
+             *         Load greeting
+             *       </button>
+             *       <Suspense fallback={<div>Loading...</div>}>
+             *         {queryRef && <Hello queryRef={queryRef} />}
+             *       </Suspense>
+             *     </>
+             *   );
+             * }
+             *
+             * function Hello({ queryRef }) {
+             *   const { data } = useReadQuery(queryRef);
+             *
+             *   return <div>{data.greeting.message}</div>;
+             * }
+             * ```
+             *
+             * @param query - A GraphQL query document parsed into an AST by `gql`.
+             * @param options - Options to control how the query is executed.
+             * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
+             */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables>;
         }
-        /**
-        * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
-        * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
-        */
         interface useLoadableQuery_Deprecated {
+            /**
+            * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+            * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+            *
+            *
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
+            */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables>;
         }
     }
     namespace Signatures {
         /**
+        * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+        * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+        * 
+        * 
+        * A hook for imperatively loading a query, such as responding to a user
+        * interaction.
+        * 
+        * > 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`.
+        * 
+        * @example
+        * 
+        * ```jsx
+        * import { gql, useLoadableQuery } from "@apollo/client";
+        * 
+        * const GET_GREETING = gql`
+        *   query GetGreeting($language: String!) {
+        *     greeting(language: $language) {
+        *       message
+        *     }
+        *   }
+        * `;
         * 
+        * function App() {
+        *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+        * 
+        *   return (
+        *     <>
+        *       <button onClick={() => loadGreeting({ language: "english" })}>
+        *         Load greeting
+        *       </button>
+        *       <Suspense fallback={<div>Loading...</div>}>
+        *         {queryRef && <Hello queryRef={queryRef} />}
+        *       </Suspense>
+        *     </>
+        *   );
+        * }
+        * 
+        * function Hello({ queryRef }) {
+        *   const { data } = useReadQuery(queryRef);
+        * 
+        *   return <div>{data.greeting.message}</div>;
+        * }
+        * ```
+        * 
+        * @param query - A GraphQL query document parsed into an AST by `gql`.
+        * @param options - Options to control how the query is executed.
+        * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
         */
         interface Classic {
             /**
+            * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+            * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+            * 
+            * 
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
             * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
                 returnPartialData: true;
                 errorPolicy: "ignore" | "all";
             }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "partial" | "empty">;
             /**
+            * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+            * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+            * 
+            * 
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
             * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
                 errorPolicy: "ignore" | "all";
             }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "empty">;
             /**
+            * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+            * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+            * 
             * 
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: useLoadableQuery.Options & {
                 returnPartialData: true;
             }): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming" | "partial">;
             /**
+            * @deprecated Avoid manually specifying generics on `useLoadableQuery`.
+            * Instead, rely on TypeScript's type inference along with a correctly typed `TypedDocumentNode` to get accurate types for your query results.
+            * 
+            * 
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
             * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData = unknown, TVariables extends OperationVariables = OperationVariables>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options?: useLoadableQuery.Options): useLoadableQuery.Result<TData, TVariables, "complete" | "streaming">;
         }
         /**
+        * A hook for imperatively loading a query, such as responding to a user
+        * interaction.
+        * 
+        * > 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`.
+        * 
+        * @example
+        * 
+        * ```jsx
+        * import { gql, useLoadableQuery } from "@apollo/client";
+        * 
+        * const GET_GREETING = gql`
+        *   query GetGreeting($language: String!) {
+        *     greeting(language: $language) {
+        *       message
+        *     }
+        *   }
+        * `;
+        * 
+        * function App() {
+        *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+        * 
+        *   return (
+        *     <>
+        *       <button onClick={() => loadGreeting({ language: "english" })}>
+        *         Load greeting
+        *       </button>
+        *       <Suspense fallback={<div>Loading...</div>}>
+        *         {queryRef && <Hello queryRef={queryRef} />}
+        *       </Suspense>
+        *     </>
+        *   );
+        * }
+        * 
+        * function Hello({ queryRef }) {
+        *   const { data } = useReadQuery(queryRef);
         * 
+        *   return <div>{data.greeting.message}</div>;
+        * }
+        * ```
+        * 
+        * @param query - A GraphQL query document parsed into an AST by `gql`.
+        * @param options - Options to control how the query is executed.
+        * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
         */
         interface Modern {
             /**
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
+            * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
             * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData, TVariables extends OperationVariables, TOptions extends never>(query: DocumentNode | TypedDocumentNode<TData, TVariables>): useLoadableQuery.ResultForOptions<TData, TVariables, Record<string, never>>;
             /**
+            * A hook for imperatively loading a query, such as responding to a user
+            * interaction.
+            * 
+            * > 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`.
+            * 
+            * @example
+            * 
+            * ```jsx
+            * import { gql, useLoadableQuery } from "@apollo/client";
+            * 
+            * const GET_GREETING = gql`
+            *   query GetGreeting($language: String!) {
+            *     greeting(language: $language) {
+            *       message
+            *     }
+            *   }
+            * `;
             * 
+            * function App() {
+            *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+            * 
+            *   return (
+            *     <>
+            *       <button onClick={() => loadGreeting({ language: "english" })}>
+            *         Load greeting
+            *       </button>
+            *       <Suspense fallback={<div>Loading...</div>}>
+            *         {queryRef && <Hello queryRef={queryRef} />}
+            *       </Suspense>
+            *     </>
+            *   );
+            * }
+            * 
+            * function Hello({ queryRef }) {
+            *   const { data } = useReadQuery(queryRef);
+            * 
+            *   return <div>{data.greeting.message}</div>;
+            * }
+            * ```
+            * 
+            * @param query - A GraphQL query document parsed into an AST by `gql`.
+            * @param options - Options to control how the query is executed.
+            * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
             */
             <TData, TVariables extends OperationVariables, TOptions extends useLoadableQuery.Options>(query: DocumentNode | TypedDocumentNode<TData, TVariables>, options: TOptions): useLoadableQuery.ResultForOptions<TData, TVariables, TOptions>;
         }
         type Evaluated = SignatureStyle extends "classic" ? Classic : Modern;
     }
     /**
+    * A hook for imperatively loading a query, such as responding to a user
+    * interaction.
+    * 
+    * > 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`.
+    * 
+    * @example
+    * 
+    * ```jsx
+    * import { gql, useLoadableQuery } from "@apollo/client";
+    * 
+    * const GET_GREETING = gql`
+    *   query GetGreeting($language: String!) {
+    *     greeting(language: $language) {
+    *       message
+    *     }
+    *   }
+    * `;
+    * 
+    * function App() {
+    *   const [loadGreeting, queryRef] = useLoadableQuery(GET_GREETING);
+    * 
+    *   return (
+    *     <>
+    *       <button onClick={() => loadGreeting({ language: "english" })}>
+    *         Load greeting
+    *       </button>
+    *       <Suspense fallback={<div>Loading...</div>}>
+    *         {queryRef && <Hello queryRef={queryRef} />}
+    *       </Suspense>
+    *     </>
+    *   );
+    * }
+    * 
+    * function Hello({ queryRef }) {
+    *   const { data } = useReadQuery(queryRef);
+    * 
+    *   return <div>{data.greeting.message}</div>;
+    * }
+    * ```
     * 
+    * @param query - A GraphQL query document parsed into an AST by `gql`.
+    * @param options - Options to control how the query is executed.
+    * @returns A tuple in the form of `[loadQuery, queryRef, handlers]`
     */
     interface Signature extends Signatures.Evaluated {
     }