@apollo/client 4.1.0-alpha.1 → 4.1.0-alpha.3

package/react/hooks/useMutation.d.ts

@@ -198,7 +198,19 @@ export declare namespace useMutation {
             variables: TVariables;
         }
     ]) => Promise<ApolloClient.MutateResult<MaybeMasked<TData>>>;
-    type MutationFunctionOptions<TData = unknown, TVariables extends OperationVariables = OperationVariables, TCache extends ApolloCache = ApolloCache> = Options<TData, TVariables, TCache>;
+    type MutationFunctionOptions<TData = unknown, TVariables extends OperationVariables = OperationVariables, TCache extends ApolloCache = ApolloCache> = Options<TData, TVariables, TCache> & {
+        /**
+        * If you're using [Apollo Link](https://www.apollographql.com/docs/react/api/link/introduction/), this object is the initial value of the `context` object that's passed along your link chain.
+        * 
+        * @docGroup 2. Networking options
+        *      
+        *
+        * @remarks
+        * When provided as a callback function, the function is called with the
+        * value of `context` provided to the `useMutation` hook.
+        */
+        context?: DefaultContext | ((hookContext: DefaultContext | undefined) => DefaultContext);
+    };
     namespace DocumentationTypes {
         /**
         * > Refer to the [Mutations](https://www.apollographql.com/docs/react/data/mutations/) section for a more in-depth overview of `useMutation`.

package/react/hooks/useMutation.js

@@ -67,6 +67,9 @@ export function useMutation(mutation, options) {
         const { options, mutation } = ref.current;
         const baseOptions = { ...options, mutation };
         const client = executeOptions.client || ref.current.client;
+        const context = typeof executeOptions.context === "function" ?
+            executeOptions.context(options?.context)
+            : executeOptions.context;
         if (!ref.current.result.loading && ref.current.isMounted) {
             setResult((ref.current.result = {
                 loading: true,
@@ -77,7 +80,10 @@ export function useMutation(mutation, options) {
             }));
         }
         const mutationId = ++ref.current.mutationId;
-        const clientOptions = mergeOptions(baseOptions, executeOptions);
+        const clientOptions = mergeOptions(baseOptions, {
+            ...executeOptions,
+            context,
+        });
         return preventUnhandledRejection(client
             .mutate(clientOptions)
             .then((response) => {

package/react/hooks/useMutation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMutation.js","sourceRoot":"","sources":["../../../src/react/hooks/useMutation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypedDocumentNode } from \"@graphql-typed-document-node/core\";\nimport { equal } from \"@wry/equality\";\nimport * as React from \"react\";\n\nimport type {\n  ApolloCache,\n  ApolloClient,\n  DefaultContext,\n  DocumentNode,\n  ErrorLike,\n  ErrorPolicy,\n  InternalRefetchQueriesInclude,\n  MaybeMasked,\n  MutationFetchPolicy,\n  MutationQueryReducersMap,\n  MutationUpdaterFunction,\n  NormalizedExecutionResult,\n  OnQueryUpdated,\n  OperationVariables,\n  Unmasked,\n} from \"@apollo/client\";\nimport type { IgnoreModifier } from \"@apollo/client/cache\";\nimport type { NoInfer, Prettify } from \"@apollo/client/utilities/internal\";\nimport {\n  mergeOptions,\n  preventUnhandledRejection,\n} from \"@apollo/client/utilities/internal\";\n\nimport { useIsomorphicLayoutEffect } from \"./internal/useIsomorphicLayoutEffect.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\n\ntype MakeRequiredVariablesOptional<\n  TVariables extends OperationVariables,\n  TConfiguredVariables extends Partial<TVariables>,\n> = Prettify<\n  {\n    [K in keyof TVariables as K extends keyof TConfiguredVariables ? K\n    : never]?: TVariables[K];\n  } & Omit<TVariables, keyof TConfiguredVariables>\n>;\n\nexport declare namespace useMutation {\n  export interface Options<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n    TConfiguredVariables extends Partial<TVariables> = Partial<TVariables>,\n  > {\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#optimisticResponse:member} */\n    optimisticResponse?:\n      | Unmasked<NoInfer<TData>>\n      | ((\n          vars: TVariables,\n          { IGNORE }: { IGNORE: IgnoreModifier }\n        ) => Unmasked<NoInfer<TData>> | IgnoreModifier);\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#updateQueries:member} */\n    updateQueries?: MutationQueryReducersMap<TData>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#refetchQueries:member} */\n    refetchQueries?:\n      | ((\n          result: NormalizedExecutionResult<Unmasked<TData>>\n        ) => InternalRefetchQueriesInclude)\n      | InternalRefetchQueriesInclude;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#awaitRefetchQueries:member} */\n    awaitRefetchQueries?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#update:member} */\n    update?: MutationUpdaterFunction<TData, TVariables, TCache>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onQueryUpdated:member} */\n    onQueryUpdated?: OnQueryUpdated<any>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#errorPolicy:member} */\n    errorPolicy?: ErrorPolicy;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n    variables?: Partial<TVariables> & TConfiguredVariables;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#context:member} */\n    context?: DefaultContext;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#fetchPolicy:member} */\n    fetchPolicy?: MutationFetchPolicy;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#keepRootFields:member} */\n    keepRootFields?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#client:member} */\n    client?: ApolloClient;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#notifyOnNetworkStatusChange:member} */\n    notifyOnNetworkStatusChange?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onCompleted:member} */\n    onCompleted?: (\n      data: MaybeMasked<TData>,\n      clientOptions?: Options<TData, TVariables, TCache>\n    ) => void;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onError:member} */\n    onError?: (\n      error: ErrorLike,\n      clientOptions?: Options<TData, TVariables, TCache>\n    ) => void;\n  }\n\n  export interface Result<TData = unknown> {\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#data:member} */\n    data: MaybeMasked<TData> | null | undefined;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#error:member} */\n    error: ErrorLike | undefined;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#loading:member} */\n    loading: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#called:member} */\n    called: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#client:member} */\n    client: ApolloClient;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#reset:member} */\n    reset: () => void;\n  }\n\n  export type ResultTuple<\n    TData,\n    TVariables extends OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = [\n    mutate: MutationFunction<TData, TVariables, TCache>,\n    result: Result<TData>,\n  ];\n\n  export type MutationFunction<\n    TData,\n    TVariables extends OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = (\n    ...[options]: {} extends TVariables ?\n      [\n        options?: MutationFunctionOptions<TData, TVariables, TCache> & {\n          /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n          variables?: TVariables;\n        },\n      ]\n    : [\n        options: MutationFunctionOptions<TData, TVariables, TCache> & {\n          /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n          variables: TVariables;\n        },\n      ]\n  ) => Promise<ApolloClient.MutateResult<MaybeMasked<TData>>>;\n\n  export type MutationFunctionOptions<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = Options<TData, TVariables, TCache>;\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useMutation:function(1)} */\n    export function useMutation<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,\n      options?: useMutation.Options<TData, TVariables>\n    ): useMutation.ResultTuple<TData, TVariables>;\n  }\n}\n\n/**\n * > Refer to the [Mutations](https://www.apollographql.com/docs/react/data/mutations/) section for a more in-depth overview of `useMutation`.\n *\n * @example\n *\n * ```jsx\n * import { gql, useMutation } from \"@apollo/client\";\n *\n * const ADD_TODO = gql`\n *   mutation AddTodo($type: String!) {\n *     addTodo(type: $type) {\n *       id\n *       type\n *     }\n *   }\n * `;\n *\n * function AddTodo() {\n *   let input;\n *   const [addTodo, { data }] = useMutation(ADD_TODO);\n *\n *   return (\n *     <div>\n *       <form\n *         onSubmit={(e) => {\n *           e.preventDefault();\n *           addTodo({ variables: { type: input.value } });\n *           input.value = \"\";\n *         }}\n *       >\n *         <input\n *           ref={(node) => {\n *             input = node;\n *           }}\n *         />\n *         <button type=\"submit\">Add Todo</button>\n *       </form>\n *     </div>\n *   );\n * }\n * ```\n *\n * @param mutation - A GraphQL mutation document parsed into an AST by `gql`.\n * @param options - Options to control how the mutation is executed.\n * @returns A tuple in the form of `[mutate, result]`\n */\nexport function useMutation<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n  TCache extends ApolloCache = ApolloCache,\n  TConfiguredVariables extends Partial<TVariables> = {},\n>(\n  mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options?: useMutation.Options<\n    NoInfer<TData>,\n    NoInfer<TVariables>,\n    TCache,\n    {\n      [K in keyof TConfiguredVariables]: K extends keyof TVariables ?\n        TConfiguredVariables[K]\n      : never;\n    }\n  >\n): useMutation.ResultTuple<\n  TData,\n  MakeRequiredVariablesOptional<TVariables, TConfiguredVariables>,\n  TCache\n> {\n  const client = useApolloClient(options?.client);\n  const [result, setResult] = React.useState<\n    Omit<useMutation.Result<TData>, \"reset\">\n  >(() => createInitialResult(client));\n\n  const ref = React.useRef({\n    result,\n    mutationId: 0,\n    isMounted: true,\n    client,\n    mutation,\n    options,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    Object.assign(ref.current, { client, options, mutation });\n  });\n\n  const execute = React.useCallback(\n    (\n      executeOptions: useMutation.MutationFunctionOptions<\n        TData,\n        TVariables,\n        TCache\n      > = {} as useMutation.MutationFunctionOptions<TData, TVariables, TCache>\n    ) => {\n      const { options, mutation } = ref.current;\n      const baseOptions = { ...options, mutation };\n      const client = executeOptions.client || ref.current.client;\n\n      if (!ref.current.result.loading && ref.current.isMounted) {\n        setResult(\n          (ref.current.result = {\n            loading: true,\n            error: undefined,\n            data: undefined,\n            called: true,\n            client,\n          })\n        );\n      }\n\n      const mutationId = ++ref.current.mutationId;\n      const clientOptions = mergeOptions(baseOptions, executeOptions as any);\n\n      return preventUnhandledRejection(\n        client\n          .mutate(\n            clientOptions as ApolloClient.MutateOptions<\n              TData,\n              OperationVariables\n            >\n          )\n          .then(\n            (response) => {\n              const { data, error } = response;\n\n              const onError =\n                executeOptions.onError || ref.current.options?.onError;\n\n              if (error && onError) {\n                onError(error, clientOptions);\n              }\n\n              if (mutationId === ref.current.mutationId) {\n                const result = {\n                  called: true,\n                  loading: false,\n                  data,\n                  error,\n                  client,\n                };\n\n                if (\n                  ref.current.isMounted &&\n                  !equal(ref.current.result, result)\n                ) {\n                  setResult((ref.current.result = result));\n                }\n              }\n\n              const onCompleted =\n                executeOptions.onCompleted || ref.current.options?.onCompleted;\n\n              if (!error) {\n                onCompleted?.(response.data!, clientOptions);\n              }\n\n              return response;\n            },\n            (error) => {\n              if (\n                mutationId === ref.current.mutationId &&\n                ref.current.isMounted\n              ) {\n                const result = {\n                  loading: false,\n                  error,\n                  data: void 0,\n                  called: true,\n                  client,\n                };\n\n                if (!equal(ref.current.result, result)) {\n                  setResult((ref.current.result = result));\n                }\n              }\n\n              const onError =\n                executeOptions.onError || ref.current.options?.onError;\n\n              if (onError) {\n                onError(error, clientOptions);\n              }\n\n              throw error;\n            }\n          )\n      );\n    },\n    []\n  );\n\n  const reset = React.useCallback(() => {\n    if (ref.current.isMounted) {\n      const result = createInitialResult(ref.current.client);\n      Object.assign(ref.current, { mutationId: 0, result });\n      setResult(result);\n    }\n  }, []);\n\n  React.useEffect(() => {\n    const current = ref.current;\n    current.isMounted = true;\n\n    return () => {\n      current.isMounted = false;\n    };\n  }, []);\n\n  return [execute as any, { reset, ...result }];\n}\n\nfunction createInitialResult(client: ApolloClient) {\n  return {\n    data: undefined,\n    error: undefined,\n    called: false,\n    loading: false,\n    client,\n  };\n}\n"]}
+{"version":3,"file":"useMutation.js","sourceRoot":"","sources":["../../../src/react/hooks/useMutation.ts"],"names":[],"mappings":"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","sourcesContent":["import type { TypedDocumentNode } from \"@graphql-typed-document-node/core\";\nimport { equal } from \"@wry/equality\";\nimport * as React from \"react\";\n\nimport type {\n  ApolloCache,\n  ApolloClient,\n  DefaultContext,\n  DocumentNode,\n  ErrorLike,\n  ErrorPolicy,\n  InternalRefetchQueriesInclude,\n  MaybeMasked,\n  MutationFetchPolicy,\n  MutationQueryReducersMap,\n  MutationUpdaterFunction,\n  NormalizedExecutionResult,\n  OnQueryUpdated,\n  OperationVariables,\n  Unmasked,\n} from \"@apollo/client\";\nimport type { IgnoreModifier } from \"@apollo/client/cache\";\nimport type { NoInfer, Prettify } from \"@apollo/client/utilities/internal\";\nimport {\n  mergeOptions,\n  preventUnhandledRejection,\n} from \"@apollo/client/utilities/internal\";\n\nimport { useIsomorphicLayoutEffect } from \"./internal/useIsomorphicLayoutEffect.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\n\ntype MakeRequiredVariablesOptional<\n  TVariables extends OperationVariables,\n  TConfiguredVariables extends Partial<TVariables>,\n> = Prettify<\n  {\n    [K in keyof TVariables as K extends keyof TConfiguredVariables ? K\n    : never]?: TVariables[K];\n  } & Omit<TVariables, keyof TConfiguredVariables>\n>;\n\nexport declare namespace useMutation {\n  export interface Options<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n    TConfiguredVariables extends Partial<TVariables> = Partial<TVariables>,\n  > {\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#optimisticResponse:member} */\n    optimisticResponse?:\n      | Unmasked<NoInfer<TData>>\n      | ((\n          vars: TVariables,\n          { IGNORE }: { IGNORE: IgnoreModifier }\n        ) => Unmasked<NoInfer<TData>> | IgnoreModifier);\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#updateQueries:member} */\n    updateQueries?: MutationQueryReducersMap<TData>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#refetchQueries:member} */\n    refetchQueries?:\n      | ((\n          result: NormalizedExecutionResult<Unmasked<TData>>\n        ) => InternalRefetchQueriesInclude)\n      | InternalRefetchQueriesInclude;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#awaitRefetchQueries:member} */\n    awaitRefetchQueries?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#update:member} */\n    update?: MutationUpdaterFunction<TData, TVariables, TCache>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onQueryUpdated:member} */\n    onQueryUpdated?: OnQueryUpdated<any>;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#errorPolicy:member} */\n    errorPolicy?: ErrorPolicy;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n    variables?: Partial<TVariables> & TConfiguredVariables;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#context:member} */\n    context?: DefaultContext;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#fetchPolicy:member} */\n    fetchPolicy?: MutationFetchPolicy;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#keepRootFields:member} */\n    keepRootFields?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#client:member} */\n    client?: ApolloClient;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#notifyOnNetworkStatusChange:member} */\n    notifyOnNetworkStatusChange?: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onCompleted:member} */\n    onCompleted?: (\n      data: MaybeMasked<TData>,\n      clientOptions?: Options<TData, TVariables, TCache>\n    ) => void;\n\n    /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#onError:member} */\n    onError?: (\n      error: ErrorLike,\n      clientOptions?: Options<TData, TVariables, TCache>\n    ) => void;\n  }\n\n  export interface Result<TData = unknown> {\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#data:member} */\n    data: MaybeMasked<TData> | null | undefined;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#error:member} */\n    error: ErrorLike | undefined;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#loading:member} */\n    loading: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#called:member} */\n    called: boolean;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#client:member} */\n    client: ApolloClient;\n\n    /** {@inheritDoc @apollo/client!MutationResultDocumentation#reset:member} */\n    reset: () => void;\n  }\n\n  export type ResultTuple<\n    TData,\n    TVariables extends OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = [\n    mutate: MutationFunction<TData, TVariables, TCache>,\n    result: Result<TData>,\n  ];\n\n  export type MutationFunction<\n    TData,\n    TVariables extends OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = (\n    ...[options]: {} extends TVariables ?\n      [\n        options?: MutationFunctionOptions<TData, TVariables, TCache> & {\n          /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n          variables?: TVariables;\n        },\n      ]\n    : [\n        options: MutationFunctionOptions<TData, TVariables, TCache> & {\n          /** {@inheritDoc @apollo/client!MutationOptionsDocumentation#variables:member} */\n          variables: TVariables;\n        },\n      ]\n  ) => Promise<ApolloClient.MutateResult<MaybeMasked<TData>>>;\n\n  export type MutationFunctionOptions<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n    TCache extends ApolloCache = ApolloCache,\n  > = Options<TData, TVariables, TCache> & {\n    /**\n     * {@inheritDoc @apollo/client!MutationOptionsDocumentation#context:member}\n     *\n     * @remarks\n     * When provided as a callback function, the function is called with the\n     * value of `context` provided to the `useMutation` hook.\n     */\n    context?:\n      | DefaultContext\n      | ((hookContext: DefaultContext | undefined) => DefaultContext);\n  };\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useMutation:function(1)} */\n    export function useMutation<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,\n      options?: useMutation.Options<TData, TVariables>\n    ): useMutation.ResultTuple<TData, TVariables>;\n  }\n}\n\n/**\n * > Refer to the [Mutations](https://www.apollographql.com/docs/react/data/mutations/) section for a more in-depth overview of `useMutation`.\n *\n * @example\n *\n * ```jsx\n * import { gql, useMutation } from \"@apollo/client\";\n *\n * const ADD_TODO = gql`\n *   mutation AddTodo($type: String!) {\n *     addTodo(type: $type) {\n *       id\n *       type\n *     }\n *   }\n * `;\n *\n * function AddTodo() {\n *   let input;\n *   const [addTodo, { data }] = useMutation(ADD_TODO);\n *\n *   return (\n *     <div>\n *       <form\n *         onSubmit={(e) => {\n *           e.preventDefault();\n *           addTodo({ variables: { type: input.value } });\n *           input.value = \"\";\n *         }}\n *       >\n *         <input\n *           ref={(node) => {\n *             input = node;\n *           }}\n *         />\n *         <button type=\"submit\">Add Todo</button>\n *       </form>\n *     </div>\n *   );\n * }\n * ```\n *\n * @param mutation - A GraphQL mutation document parsed into an AST by `gql`.\n * @param options - Options to control how the mutation is executed.\n * @returns A tuple in the form of `[mutate, result]`\n */\nexport function useMutation<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n  TCache extends ApolloCache = ApolloCache,\n  TConfiguredVariables extends Partial<TVariables> = {},\n>(\n  mutation: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options?: useMutation.Options<\n    NoInfer<TData>,\n    NoInfer<TVariables>,\n    TCache,\n    {\n      [K in keyof TConfiguredVariables]: K extends keyof TVariables ?\n        TConfiguredVariables[K]\n      : never;\n    }\n  >\n): useMutation.ResultTuple<\n  TData,\n  MakeRequiredVariablesOptional<TVariables, TConfiguredVariables>,\n  TCache\n> {\n  const client = useApolloClient(options?.client);\n  const [result, setResult] = React.useState<\n    Omit<useMutation.Result<TData>, \"reset\">\n  >(() => createInitialResult(client));\n\n  const ref = React.useRef({\n    result,\n    mutationId: 0,\n    isMounted: true,\n    client,\n    mutation,\n    options,\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    Object.assign(ref.current, { client, options, mutation });\n  });\n\n  const execute = React.useCallback(\n    (\n      executeOptions: useMutation.MutationFunctionOptions<\n        TData,\n        TVariables,\n        TCache\n      > = {} as useMutation.MutationFunctionOptions<TData, TVariables, TCache>\n    ) => {\n      const { options, mutation } = ref.current;\n      const baseOptions = { ...options, mutation };\n      const client = executeOptions.client || ref.current.client;\n      const context =\n        typeof executeOptions.context === \"function\" ?\n          executeOptions.context(options?.context)\n        : executeOptions.context;\n\n      if (!ref.current.result.loading && ref.current.isMounted) {\n        setResult(\n          (ref.current.result = {\n            loading: true,\n            error: undefined,\n            data: undefined,\n            called: true,\n            client,\n          })\n        );\n      }\n\n      const mutationId = ++ref.current.mutationId;\n      const clientOptions = mergeOptions(baseOptions, {\n        ...executeOptions,\n        context,\n      } as any);\n\n      return preventUnhandledRejection(\n        client\n          .mutate(\n            clientOptions as ApolloClient.MutateOptions<\n              TData,\n              OperationVariables\n            >\n          )\n          .then(\n            (response) => {\n              const { data, error } = response;\n\n              const onError =\n                executeOptions.onError || ref.current.options?.onError;\n\n              if (error && onError) {\n                onError(error, clientOptions);\n              }\n\n              if (mutationId === ref.current.mutationId) {\n                const result = {\n                  called: true,\n                  loading: false,\n                  data,\n                  error,\n                  client,\n                };\n\n                if (\n                  ref.current.isMounted &&\n                  !equal(ref.current.result, result)\n                ) {\n                  setResult((ref.current.result = result));\n                }\n              }\n\n              const onCompleted =\n                executeOptions.onCompleted || ref.current.options?.onCompleted;\n\n              if (!error) {\n                onCompleted?.(response.data!, clientOptions);\n              }\n\n              return response;\n            },\n            (error) => {\n              if (\n                mutationId === ref.current.mutationId &&\n                ref.current.isMounted\n              ) {\n                const result = {\n                  loading: false,\n                  error,\n                  data: void 0,\n                  called: true,\n                  client,\n                };\n\n                if (!equal(ref.current.result, result)) {\n                  setResult((ref.current.result = result));\n                }\n              }\n\n              const onError =\n                executeOptions.onError || ref.current.options?.onError;\n\n              if (onError) {\n                onError(error, clientOptions);\n              }\n\n              throw error;\n            }\n          )\n      );\n    },\n    []\n  );\n\n  const reset = React.useCallback(() => {\n    if (ref.current.isMounted) {\n      const result = createInitialResult(ref.current.client);\n      Object.assign(ref.current, { mutationId: 0, result });\n      setResult(result);\n    }\n  }, []);\n\n  React.useEffect(() => {\n    const current = ref.current;\n    current.isMounted = true;\n\n    return () => {\n      current.isMounted = false;\n    };\n  }, []);\n\n  return [execute as any, { reset, ...result }];\n}\n\nfunction createInitialResult(client: ApolloClient) {\n  return {\n    data: undefined,\n    error: undefined,\n    called: false,\n    loading: false,\n    client,\n  };\n}\n"]}

package/react/hooks/useSuspenseFragment.d.ts

@@ -1,7 +1,7 @@
-import type { ApolloClient, DataValue, DocumentNode, OperationVariables, Reference, StoreObject, TypedDocumentNode } from "@apollo/client";
-import type { FragmentType, MaybeMasked } from "@apollo/client/masking";
+import type { ApolloClient, DataValue, DocumentNode, OperationVariables, TypedDocumentNode } from "@apollo/client";
+import type { ApolloCache } from "@apollo/client/cache";
+import type { MaybeMasked } from "@apollo/client/masking";
 import type { DocumentationTypes as UtilityDocumentationTypes, NoInfer, VariablesOption } from "@apollo/client/utilities/internal";
-type From<TData> = StoreObject | Reference | FragmentType<NoInfer<TData>> | string | null;
 export declare namespace useSuspenseFragment {
     import _self = useSuspenseFragment;
     namespace Base {
@@ -19,7 +19,12 @@ export declare namespace useSuspenseFragment {
              * `fragment` document then that fragment will be used.
              */
             fragmentName?: string;
-            from: From<TData>;
+            /**
+             * An object or array containing a `__typename` and primary key fields
+             * (such as `id`) identifying the entity object from which the fragment will
+             * be retrieved, or a `{ __ref: "..." }` reference, or a `string` ID (uncommon).
+             */
+            from: useSuspenseFragment.FromValue<TData> | Array<useSuspenseFragment.FromValue<TData>>;
             optimistic?: boolean;
             /**
              * The instance of `ApolloClient` to use to look up the fragment.
@@ -39,6 +44,10 @@ export declare namespace useSuspenseFragment {
             }
         }
     }
+    /**
+     * Acceptable values provided to the `from` option.
+     */
+    type FromValue<TData> = ApolloCache.WatchFragmentFromValue<TData>;
     interface Result<TData> {
         data: DataValue.Complete<MaybeMasked<TData>>;
     }
@@ -56,8 +65,26 @@ export declare namespace useSuspenseFragment {
     }
 }
 /** #TODO documentation */
+export declare function useSuspenseFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables> & {
+    from: Array<NonNullable<useSuspenseFragment.FromValue<TData>>>;
+}): useSuspenseFragment.Result<Array<TData>>;
+/**
+* #TODO documentation
+*/
+export declare function useSuspenseFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables> & {
+    from: Array<null>;
+}): useSuspenseFragment.Result<Array<null>>;
+/**
+* #TODO documentation
+*/
+export declare function useSuspenseFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables> & {
+    from: Array<useSuspenseFragment.FromValue<TData>>;
+}): useSuspenseFragment.Result<Array<TData | null>>;
+/**
+* #TODO documentation
+*/
 export declare function useSuspenseFragment<TData, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables> & {
-    from: NonNullable<From<TData>>;
+    from: NonNullable<useSuspenseFragment.FromValue<TData>>;
 }): useSuspenseFragment.Result<TData>;
 /**
 * #TODO documentation
@@ -69,11 +96,10 @@ export declare function useSuspenseFragment<TData, TVariables extends OperationV
 * #TODO documentation
 */
 export declare function useSuspenseFragment<TData, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables> & {
-    from: From<TData>;
+    from: useSuspenseFragment.FromValue<TData>;
 }): useSuspenseFragment.Result<TData | null>;
 /**
 * #TODO documentation
 */
 export declare function useSuspenseFragment<TData, TVariables extends OperationVariables = OperationVariables>(options: useSuspenseFragment.Options<TData, TVariables>): useSuspenseFragment.Result<TData>;
-export {};
 //# sourceMappingURL=useSuspenseFragment.d.ts.map

package/react/hooks/useSuspenseFragment.js

@@ -2,9 +2,8 @@ import * as React from "react";
 import { canonicalStringify } from "@apollo/client/cache";
 import { getSuspenseCache } from "@apollo/client/react/internal";
 import { __use } from "./internal/__use.js";
-import { wrapHook } from "./internal/index.js";
+import { useDeepMemo, wrapHook } from "./internal/index.js";
 import { useApolloClient } from "./useApolloClient.js";
-const NULL_PLACEHOLDER = [];
 export function useSuspenseFragment(options) {
     "use no memo";
     return wrapHook("useSuspenseFragment", 
@@ -15,15 +14,15 @@ function useSuspenseFragment_(options) {
     const client = useApolloClient(options.client);
     const { from, variables } = options;
     const { cache } = client;
-    const id = React.useMemo(() => typeof from === "string" ? from
-        : from === null ? null
-            : cache.identify(from), [cache, from]);
-    const fragmentRef = id === null ? null : (getSuspenseCache(client).getFragmentRef([id, options.fragment, canonicalStringify(variables)], client, { ...options, variables: variables, from: id }));
-    let [current, setPromise] = React.useState(fragmentRef === null ? NULL_PLACEHOLDER : ([fragmentRef.key, fragmentRef.promise]));
+    const ids = useDeepMemo(() => {
+        return Array.isArray(from) ?
+            from.map((id) => toStringId(cache, id))
+            : toStringId(cache, from);
+    }, [cache, from]);
+    const idString = React.useMemo(() => (Array.isArray(ids) ? ids.join(",") : ids), [ids]);
+    const fragmentRef = getSuspenseCache(client).getFragmentRef([options.fragment, canonicalStringify(variables), idString], client, { ...options, variables: variables, from: ids });
+    let [current, setPromise] = React.useState([fragmentRef.key, fragmentRef.promise]);
     React.useEffect(() => {
-        if (fragmentRef === null) {
-            return;
-        }
         const dispose = fragmentRef.retain();
         const removeListener = fragmentRef.listen((promise) => {
             setPromise([fragmentRef.key, promise]);
@@ -33,9 +32,6 @@ function useSuspenseFragment_(options) {
             removeListener();
         };
     }, [fragmentRef]);
-    if (fragmentRef === null) {
-        return { data: null };
-    }
     if (current[0] !== fragmentRef.key) {
         // eslint-disable-next-line react-compiler/react-compiler
         current[0] = fragmentRef.key;
@@ -44,4 +40,9 @@ function useSuspenseFragment_(options) {
     const data = __use(current[1]);
     return { data };
 }
+function toStringId(cache, from) {
+    return (typeof from === "string" ? from
+        : from === null ? null
+            : cache.identify(from));
+}
 //# sourceMappingURL=useSuspenseFragment.js.map

package/react/hooks/useSuspenseFragment.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSuspenseFragment.js","sourceRoot":"","sources":["../../../src/react/hooks/useSuspenseFragment.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataValue,\n  DocumentNode,\n  OperationVariables,\n  Reference,\n  StoreObject,\n  TypedDocumentNode,\n} from \"@apollo/client\";\nimport { canonicalStringify } from \"@apollo/client/cache\";\nimport type { FragmentType, MaybeMasked } from \"@apollo/client/masking\";\nimport type { FragmentKey } from \"@apollo/client/react/internal\";\nimport { getSuspenseCache } from \"@apollo/client/react/internal\";\nimport type {\n  DocumentationTypes as UtilityDocumentationTypes,\n  NoInfer,\n  VariablesOption,\n} from \"@apollo/client/utilities/internal\";\n\nimport { __use } from \"./internal/__use.js\";\nimport { wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\n\ntype From<TData> =\n  | StoreObject\n  | Reference\n  | FragmentType<NoInfer<TData>>\n  | string\n  | null;\n\nexport declare namespace useSuspenseFragment {\n  import _self = useSuspenseFragment;\n  export namespace Base {\n    export type Options<TData, TVariables extends OperationVariables> = {\n      /**\n       * A GraphQL document created using the `gql` template string tag from\n       * `graphql-tag` with one or more fragments which will be used to determine\n       * the shape of data to read. If you provide more than one fragment in this\n       * document then you must also specify `fragmentName` to select a single.\n       */\n      fragment: DocumentNode | TypedDocumentNode<TData, TVariables>;\n\n      /**\n       * The name of the fragment in your GraphQL document to be used. If you do\n       * not provide a `fragmentName` and there is only one fragment in your\n       * `fragment` document then that fragment will be used.\n       */\n      fragmentName?: string;\n      from: From<TData>;\n      // Override this field to make it optional (default: true).\n      optimistic?: boolean;\n      /**\n       * The instance of `ApolloClient` to use to look up the fragment.\n       *\n       * By default, the instance that's passed down via context is used, but you\n       * can provide a different instance here.\n       *\n       * @docGroup 1. Operation options\n       */\n      client?: ApolloClient;\n    };\n  }\n  export type Options<\n    TData,\n    TVariables extends OperationVariables,\n  > = Base.Options<TData, TVariables> & VariablesOption<NoInfer<TVariables>>;\n\n  export namespace DocumentationTypes {\n    export namespace useSuspenseFragment {\n      export interface Options<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends Base.Options<TData, TVariables>,\n          UtilityDocumentationTypes.VariableOptions<TVariables> {}\n    }\n  }\n\n  export interface Result<TData> {\n    data: DataValue.Complete<MaybeMasked<TData>>;\n  }\n  export namespace DocumentationTypes {\n    export namespace useSuspenseFragment {\n      export interface Result<TData = unknown> extends _self.Result<TData> {}\n    }\n  }\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\n    export function useSuspenseFragment<\n      TData,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      options: useSuspenseFragment.Options<TData, TVariables>\n    ): useSuspenseFragment.Result<TData>;\n  }\n}\n\nconst NULL_PLACEHOLDER = [] as unknown as [\n  FragmentKey,\n  Promise<MaybeMasked<any> | null>,\n];\n\n/** #TODO documentation */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: NonNullable<From<TData>>;\n  }\n): useSuspenseFragment.Result<TData>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: null;\n  }\n): useSuspenseFragment.Result<null>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: From<TData>;\n  }\n): useSuspenseFragment.Result<TData | null>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData>;\n\nexport function useSuspenseFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData | null> {\n  \"use no memo\";\n  return wrapHook(\n    \"useSuspenseFragment\",\n    // eslint-disable-next-line react-compiler/react-compiler\n    useSuspenseFragment_,\n    useApolloClient(typeof options === \"object\" ? options.client : undefined)\n  )(options);\n}\n\nfunction useSuspenseFragment_<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData | null> {\n  const client = useApolloClient(options.client);\n  const { from, variables } = options;\n  const { cache } = client;\n\n  const id = React.useMemo(\n    () =>\n      typeof from === \"string\" ? from\n      : from === null ? null\n      : cache.identify(from),\n    [cache, from]\n  ) as string | null;\n\n  const fragmentRef =\n    id === null ? null : (\n      getSuspenseCache(client).getFragmentRef(\n        [id, options.fragment, canonicalStringify(variables)],\n        client,\n        { ...options, variables: variables as TVariables, from: id }\n      )\n    );\n\n  let [current, setPromise] = React.useState<\n    [FragmentKey, Promise<MaybeMasked<TData> | null>]\n  >(\n    fragmentRef === null ? NULL_PLACEHOLDER : (\n      [fragmentRef.key, fragmentRef.promise]\n    )\n  );\n\n  React.useEffect(() => {\n    if (fragmentRef === null) {\n      return;\n    }\n\n    const dispose = fragmentRef.retain();\n    const removeListener = fragmentRef.listen((promise) => {\n      setPromise([fragmentRef.key, promise]);\n    });\n\n    return () => {\n      dispose();\n      removeListener();\n    };\n  }, [fragmentRef]);\n\n  if (fragmentRef === null) {\n    return { data: null };\n  }\n\n  if (current[0] !== fragmentRef.key) {\n    // eslint-disable-next-line react-compiler/react-compiler\n    current[0] = fragmentRef.key;\n    current[1] = fragmentRef.promise;\n  }\n\n  const data = __use(current[1]);\n\n  return { data };\n}\n"]}
+{"version":3,"file":"useSuspenseFragment.js","sourceRoot":"","sources":["../../../src/react/hooks/useSuspenseFragment.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataValue,\n  DocumentNode,\n  OperationVariables,\n  TypedDocumentNode,\n} from \"@apollo/client\";\nimport type { ApolloCache } from \"@apollo/client/cache\";\nimport { canonicalStringify } from \"@apollo/client/cache\";\nimport type { MaybeMasked } from \"@apollo/client/masking\";\nimport type { FragmentKey } from \"@apollo/client/react/internal\";\nimport { getSuspenseCache } from \"@apollo/client/react/internal\";\nimport type {\n  DocumentationTypes as UtilityDocumentationTypes,\n  NoInfer,\n  VariablesOption,\n} from \"@apollo/client/utilities/internal\";\n\nimport { __use } from \"./internal/__use.js\";\nimport { useDeepMemo, wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\n\nexport declare namespace useSuspenseFragment {\n  import _self = useSuspenseFragment;\n  export namespace Base {\n    export type Options<TData, TVariables extends OperationVariables> = {\n      /**\n       * A GraphQL document created using the `gql` template string tag from\n       * `graphql-tag` with one or more fragments which will be used to determine\n       * the shape of data to read. If you provide more than one fragment in this\n       * document then you must also specify `fragmentName` to select a single.\n       */\n      fragment: DocumentNode | TypedDocumentNode<TData, TVariables>;\n\n      /**\n       * The name of the fragment in your GraphQL document to be used. If you do\n       * not provide a `fragmentName` and there is only one fragment in your\n       * `fragment` document then that fragment will be used.\n       */\n      fragmentName?: string;\n\n      /**\n       * An object or array containing a `__typename` and primary key fields\n       * (such as `id`) identifying the entity object from which the fragment will\n       * be retrieved, or a `{ __ref: \"...\" }` reference, or a `string` ID (uncommon).\n       */\n      from:\n        | useSuspenseFragment.FromValue<TData>\n        | Array<useSuspenseFragment.FromValue<TData>>;\n\n      // Override this field to make it optional (default: true).\n      optimistic?: boolean;\n      /**\n       * The instance of `ApolloClient` to use to look up the fragment.\n       *\n       * By default, the instance that's passed down via context is used, but you\n       * can provide a different instance here.\n       *\n       * @docGroup 1. Operation options\n       */\n      client?: ApolloClient;\n    };\n  }\n  export type Options<\n    TData,\n    TVariables extends OperationVariables,\n  > = Base.Options<TData, TVariables> & VariablesOption<NoInfer<TVariables>>;\n\n  export namespace DocumentationTypes {\n    export namespace useSuspenseFragment {\n      export interface Options<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends Base.Options<TData, TVariables>,\n          UtilityDocumentationTypes.VariableOptions<TVariables> {}\n    }\n  }\n\n  /**\n   * Acceptable values provided to the `from` option.\n   */\n  export type FromValue<TData> = ApolloCache.WatchFragmentFromValue<TData>;\n\n  export interface Result<TData> {\n    data: DataValue.Complete<MaybeMasked<TData>>;\n  }\n  export namespace DocumentationTypes {\n    export namespace useSuspenseFragment {\n      export interface Result<TData = unknown> extends _self.Result<TData> {}\n    }\n  }\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\n    export function useSuspenseFragment<\n      TData,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      options: useSuspenseFragment.Options<TData, TVariables>\n    ): useSuspenseFragment.Result<TData>;\n  }\n}\n\n/** #TODO documentation */\nexport function useSuspenseFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: Array<NonNullable<useSuspenseFragment.FromValue<TData>>>;\n  }\n): useSuspenseFragment.Result<Array<TData>>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: Array<null>;\n  }\n): useSuspenseFragment.Result<Array<null>>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: Array<useSuspenseFragment.FromValue<TData>>;\n  }\n): useSuspenseFragment.Result<Array<TData | null>>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: NonNullable<useSuspenseFragment.FromValue<TData>>;\n  }\n): useSuspenseFragment.Result<TData>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: null;\n  }\n): useSuspenseFragment.Result<null>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables> & {\n    from: useSuspenseFragment.FromValue<TData>;\n  }\n): useSuspenseFragment.Result<TData | null>;\n\n/** {@inheritDoc @apollo/client/react!useSuspenseFragment:function(1)} */\nexport function useSuspenseFragment<\n  TData,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData>;\n\nexport function useSuspenseFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData | null> {\n  \"use no memo\";\n  return wrapHook(\n    \"useSuspenseFragment\",\n    // eslint-disable-next-line react-compiler/react-compiler\n    useSuspenseFragment_,\n    useApolloClient(typeof options === \"object\" ? options.client : undefined)\n  )(options);\n}\n\nfunction useSuspenseFragment_<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useSuspenseFragment.Options<TData, TVariables>\n): useSuspenseFragment.Result<TData | null> {\n  const client = useApolloClient(options.client);\n  const { from, variables } = options;\n  const { cache } = client;\n\n  const ids = useDeepMemo(() => {\n    return Array.isArray(from) ?\n        from.map((id) => toStringId(cache, id))\n      : toStringId(cache, from);\n  }, [cache, from]);\n  const idString = React.useMemo(\n    () => (Array.isArray(ids) ? ids.join(\",\") : ids),\n    [ids]\n  );\n\n  const fragmentRef = getSuspenseCache(client).getFragmentRef(\n    [options.fragment, canonicalStringify(variables), idString],\n    client,\n    { ...options, variables: variables as TVariables, from: ids }\n  );\n\n  let [current, setPromise] = React.useState<\n    [FragmentKey, Promise<MaybeMasked<TData> | null>]\n  >([fragmentRef.key, fragmentRef.promise]);\n\n  React.useEffect(() => {\n    const dispose = fragmentRef.retain();\n    const removeListener = fragmentRef.listen((promise) => {\n      setPromise([fragmentRef.key, promise]);\n    });\n\n    return () => {\n      dispose();\n      removeListener();\n    };\n  }, [fragmentRef]);\n\n  if (current[0] !== fragmentRef.key) {\n    // eslint-disable-next-line react-compiler/react-compiler\n    current[0] = fragmentRef.key;\n    current[1] = fragmentRef.promise;\n  }\n\n  const data = __use(current[1]);\n\n  return { data };\n}\n\nfunction toStringId(\n  cache: ApolloCache,\n  from: useSuspenseFragment.FromValue<any>\n) {\n  return (\n    typeof from === \"string\" ? from\n    : from === null ? null\n    : cache.identify(from)) as string | null;\n}\n"]}

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

@@ -1,6 +1,6 @@
 import type { ApolloClient, DataValue, DocumentNode, GetDataState, OperationVariables, TypedDocumentNode } from "@apollo/client";
-import type { MissingTree, Reference, StoreObject } from "@apollo/client/cache";
-import type { FragmentType, MaybeMasked } from "@apollo/client/masking";
+import type { ApolloCache, MissingTree } from "@apollo/client/cache";
+import type { MaybeMasked } from "@apollo/client/masking";
 import type { NoInfer } from "@apollo/client/utilities/internal";
 export declare namespace useFragment {
     import _self = useFragment;
@@ -23,9 +23,11 @@ export declare namespace useFragment {
          */
         variables?: NoInfer<TVariables>;
         /**
-         * An object containing a `__typename` and primary key fields (such as `id`) identifying the entity object from which the fragment will be retrieved, or a `{ __ref: "..." }` reference, or a `string` ID (uncommon).
+         * An object or array containing a `__typename` and primary key fields
+         * (such as `id`) identifying the entity object from which the fragment will
+         * be retrieved, or a `{ __ref: "..." }` reference, or a `string` ID (uncommon).
          */
-        from: StoreObject | Reference | FragmentType<NoInfer<TData>> | string | null;
+        from: useFragment.FromValue<TData> | Array<useFragment.FromValue<TData>>;
         /**
          * Whether to read from optimistic or non-optimistic cache data. If
          * this named option is provided, the optimistic parameter of the
@@ -50,6 +52,10 @@ export declare namespace useFragment {
             }
         }
     }
+    /**
+     * Acceptable values provided to the `from` option.
+     */
+    type FromValue<TData> = ApolloCache.WatchFragmentFromValue<TData>;
     type Result<TData> = ({
         /**
         * 
@@ -59,7 +65,7 @@ export declare namespace useFragment {
         * A tree of all `MissingFieldError` messages reported during fragment reading, where the branches of the tree indicate the paths of the errors within the query result.
         */
         missing?: never;
-    } & GetDataState<MaybeMasked<TData>, "complete">) | ({
+    } & GetDataState<MaybeMasked<TData>, "complete">) | {
         /**
         * 
         */
@@ -68,7 +74,30 @@ export declare namespace useFragment {
         * A tree of all `MissingFieldError` messages reported during fragment reading, where the branches of the tree indicate the paths of the errors within the query result.
         */
         missing?: MissingTree;
-    } & GetDataState<MaybeMasked<TData>, "partial">);
+        /**
+        * An object containing the result of your GraphQL query after it completes.
+        * 
+        * This value might be `undefined` if a query results in one or more errors (depending on the query's `errorPolicy`).
+        * 
+        * @docGroup 1. Operation data
+        */
+        data: TData extends Array<infer TItem> ? Array<DataValue.Partial<TItem> | null> : DataValue.Partial<TData>;
+        /**
+        * Describes the completeness of `data`.
+        * 
+        * - `empty`: No data could be fulfilled from the cache or the result is
+        *   incomplete. `data` is `undefined`.
+        * - `partial`: Some data could be fulfilled from the cache but `data` is
+        *   incomplete. This is only possible when `returnPartialData` is `true`.
+        * - `streaming`: `data` is incomplete as a result of a deferred query and
+        *   the result is still streaming in.
+        * - `complete`: `data` is a fully satisfied query result fulfilled
+        *   either from the cache or network.
+        * 
+        * @docGroup 1. Operation data
+        */
+        dataState: "partial";
+    };
     namespace DocumentationTypes {
         namespace useFragment {
             interface Result<TData> {
@@ -99,5 +128,35 @@ export declare namespace useFragment {
  *
  * To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.
  */
+export declare function useFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useFragment.Options<TData, TVariables> & {
+    from: Array<NonNullable<useFragment.FromValue<TData>>>;
+}): useFragment.Result<Array<TData>>;
+/**
+* `useFragment` represents a lightweight live binding into the Apollo Client Cache and enables Apollo Client to broadcast very specific fragment results to individual components. This hook returns an always-up-to-date view of whatever data the cache currently contains for a given fragment. `useFragment` never triggers network requests of its own.
+* 
+* Note that the `useQuery` hook remains the primary hook responsible for querying and populating data in the cache ([see the API reference](./hooks#usequery)). As a result, the component reading the fragment data via `useFragment` is still subscribed to all changes in the query data, but receives updates only when that fragment's specific data change.
+* 
+* To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.
+*/
+export declare function useFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useFragment.Options<TData, TVariables> & {
+    from: Array<null>;
+}): useFragment.Result<Array<null>>;
+/**
+* `useFragment` represents a lightweight live binding into the Apollo Client Cache and enables Apollo Client to broadcast very specific fragment results to individual components. This hook returns an always-up-to-date view of whatever data the cache currently contains for a given fragment. `useFragment` never triggers network requests of its own.
+* 
+* Note that the `useQuery` hook remains the primary hook responsible for querying and populating data in the cache ([see the API reference](./hooks#usequery)). As a result, the component reading the fragment data via `useFragment` is still subscribed to all changes in the query data, but receives updates only when that fragment's specific data change.
+* 
+* To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.
+*/
+export declare function useFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useFragment.Options<TData, TVariables> & {
+    from: Array<useFragment.FromValue<TData>>;
+}): useFragment.Result<Array<TData | null>>;
+/**
+* `useFragment` represents a lightweight live binding into the Apollo Client Cache and enables Apollo Client to broadcast very specific fragment results to individual components. This hook returns an always-up-to-date view of whatever data the cache currently contains for a given fragment. `useFragment` never triggers network requests of its own.
+* 
+* Note that the `useQuery` hook remains the primary hook responsible for querying and populating data in the cache ([see the API reference](./hooks#usequery)). As a result, the component reading the fragment data via `useFragment` is still subscribed to all changes in the query data, but receives updates only when that fragment's specific data change.
+* 
+* To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.
+*/
 export declare function useFragment<TData = unknown, TVariables extends OperationVariables = OperationVariables>(options: useFragment.Options<TData, TVariables>): useFragment.Result<TData>;
 //# sourceMappingURL=useFragment.d.ts.map