@apollo/client 4.0.11 → 4.0.12-beta.0

package/react/hooks/internal/useDeepMemo.js

@@ -2,9 +2,11 @@ import { equal } from "@wry/equality";
 import * as React from "react";
 export function useDeepMemo(memoFn, deps) {
     const ref = React.useRef(void 0);
+    // eslint-disable-next-line react-hooks/refs
     if (!ref.current || !equal(ref.current.deps, deps)) {
         ref.current = { value: memoFn(), deps };
     }
+    // eslint-disable-next-line react-hooks/refs
     return ref.current.value;
 }
 //# sourceMappingURL=useDeepMemo.js.map

package/react/hooks/internal/useDeepMemo.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDeepMemo.js","sourceRoot":"","sources":["../../../../src/react/hooks/internal/useDeepMemo.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,UAAU,WAAW,CACzB,MAAoB,EACpB,IAAoB;IAEpB,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAA0C,KAAK,CAAC,CAAC,CAAC;IAC1E,IAAI,CAAC,GAAG,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC;QACnD,GAAG,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC;IAC1C,CAAC;IACD,OAAO,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC;AAC3B,CAAC","sourcesContent":["import { equal } from \"@wry/equality\";\nimport type { DependencyList } from \"react\";\nimport * as React from \"react\";\n\nexport function useDeepMemo<TValue>(\n  memoFn: () => TValue,\n  deps: DependencyList\n) {\n  const ref = React.useRef<{ deps: DependencyList; value: TValue }>(void 0);\n  if (!ref.current || !equal(ref.current.deps, deps)) {\n    ref.current = { value: memoFn(), deps };\n  }\n  return ref.current.value;\n}\n"]}
+{"version":3,"file":"useDeepMemo.js","sourceRoot":"","sources":["../../../../src/react/hooks/internal/useDeepMemo.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,UAAU,WAAW,CACzB,MAAoB,EACpB,IAAoB;IAEpB,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAA0C,KAAK,CAAC,CAAC,CAAC;IAC1E,4CAA4C;IAC5C,IAAI,CAAC,GAAG,CAAC,OAAO,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC;QACnD,GAAG,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC;IAC1C,CAAC;IACD,4CAA4C;IAC5C,OAAO,GAAG,CAAC,OAAO,CAAC,KAAK,CAAC;AAC3B,CAAC","sourcesContent":["import { equal } from \"@wry/equality\";\nimport type { DependencyList } from \"react\";\nimport * as React from \"react\";\n\nexport function useDeepMemo<TValue>(\n  memoFn: () => TValue,\n  deps: DependencyList\n) {\n  const ref = React.useRef<{ deps: DependencyList; value: TValue }>(void 0);\n  // eslint-disable-next-line react-hooks/refs\n  if (!ref.current || !equal(ref.current.deps, deps)) {\n    ref.current = { value: memoFn(), deps };\n  }\n  // eslint-disable-next-line react-hooks/refs\n  return ref.current.value;\n}\n"]}

package/react/hooks/useBackgroundQuery.js

@@ -5,9 +5,7 @@ import { useApolloClient } from "./useApolloClient.js";
 import { useWatchQueryOptions } from "./useSuspenseQuery.js";
 export function useBackgroundQuery(query, options) {
     "use no memo";
-    return wrapHook("useBackgroundQuery", 
-    // eslint-disable-next-line react-compiler/react-compiler
-    useBackgroundQuery_, useApolloClient(typeof options === "object" ? options.client : undefined))(query, options ?? {});
+    return wrapHook("useBackgroundQuery", useBackgroundQuery_, useApolloClient(typeof options === "object" ? options.client : undefined))(query, options ?? {});
 }
 function useBackgroundQuery_(query, options) {
     const client = useApolloClient(options.client);

package/react/hooks/useBackgroundQuery.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBackgroundQuery.js","sourceRoot":"","sources":["../../../src/react/hooks/useBackgroundQuery.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataState,\n  DefaultContext,\n  DocumentNode,\n  ErrorPolicy,\n  OperationVariables,\n  RefetchWritePolicy,\n  TypedDocumentNode,\n  WatchQueryFetchPolicy,\n} from \"@apollo/client\";\nimport type { SubscribeToMoreFunction } from \"@apollo/client\";\nimport type { QueryRef } from \"@apollo/client/react\";\nimport type {\n  FetchMoreFunction,\n  RefetchFunction,\n} from \"@apollo/client/react/internal\";\nimport {\n  getSuspenseCache,\n  unwrapQueryRef,\n  updateWrappedQueryRef,\n  wrapQueryRef,\n} from \"@apollo/client/react/internal\";\nimport type {\n  DocumentationTypes as UtilityDocumentationTypes,\n  NoInfer,\n  VariablesOption,\n} from \"@apollo/client/utilities/internal\";\n\nimport type { SkipToken } from \"./constants.js\";\nimport { useSuspenseHookCacheKey, wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\nimport { useWatchQueryOptions } from \"./useSuspenseQuery.js\";\n\nexport declare namespace useBackgroundQuery {\n  import _self = useBackgroundQuery;\n  export type FetchPolicy = Extract<\n    WatchQueryFetchPolicy,\n    \"cache-first\" | \"network-only\" | \"no-cache\" | \"cache-and-network\"\n  >;\n\n  export namespace Base {\n    export interface Options {\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#client:member} */\n      client?: ApolloClient;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#refetchWritePolicy_suspense:member} */\n      refetchWritePolicy?: RefetchWritePolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#errorPolicy:member} */\n      errorPolicy?: ErrorPolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#context:member} */\n      context?: DefaultContext;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#returnPartialData:member} */\n      returnPartialData?: boolean;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#fetchPolicy:member} */\n      fetchPolicy?: FetchPolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#queryKey:member} */\n      queryKey?: string | number | any[];\n\n      /**\n       * {@inheritDoc @apollo/client!QueryOptionsDocumentation#skip_deprecated:member}\n       *\n       * @example Recommended usage of `skipToken`:\n       *\n       * ```ts\n       * import { skipToken, useBackgroundQuery } from \"@apollo/client\";\n       *\n       * const [queryRef] = useBackgroundQuery(\n       *   query,\n       *   id ? { variables: { id } } : skipToken\n       * );\n       * ```\n       */\n      skip?: boolean;\n    }\n  }\n\n  export type Options<\n    TVariables extends OperationVariables = OperationVariables,\n  > = Base.Options & VariablesOption<TVariables>;\n\n  export namespace DocumentationTypes {\n    namespace useBackgroundQuery {\n      export interface Options<\n        TVariables extends OperationVariables = OperationVariables,\n      > extends Base.Options,\n          UtilityDocumentationTypes.VariableOptions<TVariables> {}\n    }\n  }\n\n  export interface Result<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n  > {\n    /** {@inheritDoc @apollo/client!ObservableQuery#subscribeToMore:member(1)} */\n    subscribeToMore: SubscribeToMoreFunction<TData, TVariables>;\n\n    /**\n     * {@inheritDoc @apollo/client!ObservableQuery#fetchMore:member(1)}\n     *\n     * @remarks\n     * Calling this function will cause the component to re-suspend, unless the call site is wrapped in [`startTransition`](https://react.dev/reference/react/startTransition).\n     */\n    fetchMore: FetchMoreFunction<TData, TVariables>;\n\n    /**\n     * {@inheritDoc @apollo/client!QueryResultDocumentation#refetch:member}\n     *\n     * @remarks\n     * Calling this function will cause the component to re-suspend, unless the call site is wrapped in [`startTransition`](https://react.dev/reference/react/startTransition).\n     */\n    refetch: RefetchFunction<TData, TVariables>;\n  }\n\n  namespace DocumentationTypes {\n    namespace useBackgroundQuery {\n      export interface Result<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends _self.Result<TData, TVariables> {}\n    }\n  }\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\n    export function useBackgroundQuery<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n      options: SkipToken | useBackgroundQuery.Options<TVariables>\n    ): [\n      QueryRef<TData, TVariables> | undefined,\n      useBackgroundQuery.Result<TData, TVariables>,\n    ];\n  }\n}\n\n/**\n * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).\n *\n * @returns A tuple containing:\n *\n * 1.  A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.\n * 2.  An object containing helper functions for the query:\n *     - `refetch`: A function to re-execute the query\n *     - `fetchMore`: A function to fetch more results for pagination\n *     - `subscribeToMore`: A function to subscribe to updates\n *\n * @example\n *\n * ```jsx\n * import { Suspense } from \"react\";\n * import { ApolloClient, InMemoryCache, HttpLink } from \"@apollo/client\";\n * import { useBackgroundQuery, useReadQuery } from \"@apollo/client/react\";\n *\n * const query = gql`\n *   foo {\n *     bar\n *   }\n * `;\n *\n * const client = new ApolloClient({\n *   link: new HttpLink({ uri: \"http://localhost:4000/graphql\" }),\n *   cache: new InMemoryCache(),\n * });\n *\n * function SuspenseFallback() {\n *   return <div>Loading...</div>;\n * }\n *\n * function Child({ queryRef }) {\n *   const { data } = useReadQuery(queryRef);\n *\n *   return <div>{data.foo.bar}</div>;\n * }\n *\n * function Parent() {\n *   const [queryRef] = useBackgroundQuery(query);\n *\n *   return (\n *     <Suspense fallback={<SuspenseFallback />}>\n *       <Child queryRef={queryRef} />\n *     </Suspense>\n *   );\n * }\n *\n * function App() {\n *   return (\n *     <ApolloProvider client={client}>\n *       <Parent />\n *     </ApolloProvider>\n *   );\n * }\n * ```\n *\n * @param query - A GraphQL query document parsed into an AST by `gql`.\n * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.\n */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    /** @deprecated `returnPartialData` has no effect on `no-cache` queries */\n    returnPartialData: boolean;\n    fetchPolicy: \"no-cache\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: false;\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: boolean;\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n    returnPartialData: false;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n    returnPartialData: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: false;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: SkipToken\n): [undefined, useBackgroundQuery.Result<TData, TVariables>];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | SkipToken\n    | (useBackgroundQuery.Options<NoInfer<TVariables>> & {\n        returnPartialData: false;\n      })\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | SkipToken\n    | (useBackgroundQuery.Options<NoInfer<TVariables>> & {\n        returnPartialData: boolean;\n      })\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  ...[options]: {} extends TVariables ?\n    [options?: useBackgroundQuery.Options<NoInfer<TVariables>>]\n  : [options: useBackgroundQuery.Options<NoInfer<TVariables>>]\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  ...[options]: {} extends TVariables ?\n    [options?: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>]\n  : [options: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>]\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options?: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, DataState<TData>[\"dataState\"]> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n] {\n  \"use no memo\";\n  return wrapHook(\n    \"useBackgroundQuery\",\n    // eslint-disable-next-line react-compiler/react-compiler\n    useBackgroundQuery_,\n    useApolloClient(typeof options === \"object\" ? options.client : undefined)\n  )(query, options ?? ({} as any));\n}\n\nfunction useBackgroundQuery_<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n  TStates extends DataState<TData>[\"dataState\"] = DataState<TData>[\"dataState\"],\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | (SkipToken & Partial<useBackgroundQuery.Options<NoInfer<TVariables>>>)\n    | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, TStates> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n] {\n  const client = useApolloClient(options.client);\n  const suspenseCache = getSuspenseCache(client);\n  const watchQueryOptions = useWatchQueryOptions({ client, query, options });\n  const { fetchPolicy } = watchQueryOptions;\n  const cacheKey = useSuspenseHookCacheKey(query, options);\n\n  // This ref tracks the first time query execution is enabled to determine\n  // whether to return a query ref or `undefined`. When initialized\n  // in a skipped state (either via `skip: true` or `skipToken`) we return\n  // `undefined` for the `queryRef` until the query has been enabled. Once\n  // enabled, a query ref is always returned regardless of whether the query is\n  // skipped again later.\n  const didFetchResult = React.useRef(fetchPolicy !== \"standby\");\n  didFetchResult.current ||= fetchPolicy !== \"standby\";\n\n  const queryRef = suspenseCache.getQueryRef<TData, TStates>(cacheKey, () =>\n    client.watchQuery(\n      watchQueryOptions as ApolloClient.WatchQueryOptions<any, any>\n    )\n  );\n\n  const [wrappedQueryRef, setWrappedQueryRef] = React.useState(\n    wrapQueryRef(queryRef)\n  );\n  if (unwrapQueryRef(wrappedQueryRef) !== queryRef) {\n    setWrappedQueryRef(wrapQueryRef(queryRef));\n  }\n  if (queryRef.didChangeOptions(watchQueryOptions)) {\n    const promise = queryRef.applyOptions(watchQueryOptions);\n    updateWrappedQueryRef(wrappedQueryRef, promise);\n  }\n\n  // This prevents issues where rerendering useBackgroundQuery after the\n  // queryRef has been disposed would cause the hook to return a new queryRef\n  // instance since disposal also removes it from the suspense cache. We add\n  // the queryRef back in the suspense cache so that the next render will reuse\n  // this queryRef rather than initializing a new instance.\n  React.useEffect(() => {\n    // Since the queryRef is disposed async via `setTimeout`, we have to wait a\n    // tick before checking it and adding back to the suspense cache.\n    const id = setTimeout(() => {\n      if (queryRef.disposed) {\n        suspenseCache.add(cacheKey, queryRef);\n      }\n    });\n\n    return () => clearTimeout(id);\n    // Omitting the deps is intentional. This avoids stale closures and the\n    // conditional ensures we aren't running the logic on each render.\n  });\n\n  const fetchMore: FetchMoreFunction<TData, TVariables> = React.useCallback(\n    (options) => {\n      const promise = queryRef.fetchMore(options);\n\n      setWrappedQueryRef(wrapQueryRef(queryRef));\n\n      return promise;\n    },\n    [queryRef]\n  );\n\n  const refetch: RefetchFunction<TData, TVariables> = React.useCallback(\n    (variables) => {\n      const promise = queryRef.refetch(variables);\n\n      setWrappedQueryRef(wrapQueryRef(queryRef));\n\n      return promise;\n    },\n    [queryRef]\n  );\n\n  React.useEffect(() => queryRef.softRetain(), [queryRef]);\n\n  return [\n    didFetchResult.current ? wrappedQueryRef : void 0,\n    {\n      fetchMore,\n      refetch,\n      // TODO: The internalQueryRef doesn't have TVariables' type information so we have to cast it here\n      subscribeToMore: queryRef.observable\n        .subscribeToMore as SubscribeToMoreFunction<TData, TVariables>,\n    },\n  ];\n}\n"]}
+{"version":3,"file":"useBackgroundQuery.js","sourceRoot":"","sources":["../../../src/react/hooks/useBackgroundQuery.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataState,\n  DefaultContext,\n  DocumentNode,\n  ErrorPolicy,\n  OperationVariables,\n  RefetchWritePolicy,\n  TypedDocumentNode,\n  WatchQueryFetchPolicy,\n} from \"@apollo/client\";\nimport type { SubscribeToMoreFunction } from \"@apollo/client\";\nimport type { QueryRef } from \"@apollo/client/react\";\nimport type {\n  FetchMoreFunction,\n  RefetchFunction,\n} from \"@apollo/client/react/internal\";\nimport {\n  getSuspenseCache,\n  unwrapQueryRef,\n  updateWrappedQueryRef,\n  wrapQueryRef,\n} from \"@apollo/client/react/internal\";\nimport type {\n  DocumentationTypes as UtilityDocumentationTypes,\n  NoInfer,\n  VariablesOption,\n} from \"@apollo/client/utilities/internal\";\n\nimport type { SkipToken } from \"./constants.js\";\nimport { useSuspenseHookCacheKey, wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\nimport { useWatchQueryOptions } from \"./useSuspenseQuery.js\";\n\nexport declare namespace useBackgroundQuery {\n  import _self = useBackgroundQuery;\n  export type FetchPolicy = Extract<\n    WatchQueryFetchPolicy,\n    \"cache-first\" | \"network-only\" | \"no-cache\" | \"cache-and-network\"\n  >;\n\n  export namespace Base {\n    export interface Options {\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#client:member} */\n      client?: ApolloClient;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#refetchWritePolicy_suspense:member} */\n      refetchWritePolicy?: RefetchWritePolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#errorPolicy:member} */\n      errorPolicy?: ErrorPolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#context:member} */\n      context?: DefaultContext;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#returnPartialData:member} */\n      returnPartialData?: boolean;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#fetchPolicy:member} */\n      fetchPolicy?: FetchPolicy;\n\n      /** {@inheritDoc @apollo/client!QueryOptionsDocumentation#queryKey:member} */\n      queryKey?: string | number | any[];\n\n      /**\n       * {@inheritDoc @apollo/client!QueryOptionsDocumentation#skip_deprecated:member}\n       *\n       * @example Recommended usage of `skipToken`:\n       *\n       * ```ts\n       * import { skipToken, useBackgroundQuery } from \"@apollo/client\";\n       *\n       * const [queryRef] = useBackgroundQuery(\n       *   query,\n       *   id ? { variables: { id } } : skipToken\n       * );\n       * ```\n       */\n      skip?: boolean;\n    }\n  }\n\n  export type Options<\n    TVariables extends OperationVariables = OperationVariables,\n  > = Base.Options & VariablesOption<TVariables>;\n\n  export namespace DocumentationTypes {\n    namespace useBackgroundQuery {\n      export interface Options<\n        TVariables extends OperationVariables = OperationVariables,\n      > extends Base.Options,\n          UtilityDocumentationTypes.VariableOptions<TVariables> {}\n    }\n  }\n\n  export interface Result<\n    TData = unknown,\n    TVariables extends OperationVariables = OperationVariables,\n  > {\n    /** {@inheritDoc @apollo/client!ObservableQuery#subscribeToMore:member(1)} */\n    subscribeToMore: SubscribeToMoreFunction<TData, TVariables>;\n\n    /**\n     * {@inheritDoc @apollo/client!ObservableQuery#fetchMore:member(1)}\n     *\n     * @remarks\n     * Calling this function will cause the component to re-suspend, unless the call site is wrapped in [`startTransition`](https://react.dev/reference/react/startTransition).\n     */\n    fetchMore: FetchMoreFunction<TData, TVariables>;\n\n    /**\n     * {@inheritDoc @apollo/client!QueryResultDocumentation#refetch:member}\n     *\n     * @remarks\n     * Calling this function will cause the component to re-suspend, unless the call site is wrapped in [`startTransition`](https://react.dev/reference/react/startTransition).\n     */\n    refetch: RefetchFunction<TData, TVariables>;\n  }\n\n  namespace DocumentationTypes {\n    namespace useBackgroundQuery {\n      export interface Result<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends _self.Result<TData, TVariables> {}\n    }\n  }\n\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\n    export function useBackgroundQuery<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >(\n      query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n      options: SkipToken | useBackgroundQuery.Options<TVariables>\n    ): [\n      QueryRef<TData, TVariables> | undefined,\n      useBackgroundQuery.Result<TData, TVariables>,\n    ];\n  }\n}\n\n/**\n * For a detailed explanation of useBackgroundQuery, see the [fetching with Suspense reference](https://www.apollographql.com/docs/react/data/suspense).\n *\n * @returns A tuple containing:\n *\n * 1.  A `QueryRef` that can be passed to `useReadQuery` to read the query result. The `queryRef` is `undefined` if the query is skipped.\n * 2.  An object containing helper functions for the query:\n *     - `refetch`: A function to re-execute the query\n *     - `fetchMore`: A function to fetch more results for pagination\n *     - `subscribeToMore`: A function to subscribe to updates\n *\n * @example\n *\n * ```jsx\n * import { Suspense } from \"react\";\n * import { ApolloClient, InMemoryCache, HttpLink } from \"@apollo/client\";\n * import { useBackgroundQuery, useReadQuery } from \"@apollo/client/react\";\n *\n * const query = gql`\n *   foo {\n *     bar\n *   }\n * `;\n *\n * const client = new ApolloClient({\n *   link: new HttpLink({ uri: \"http://localhost:4000/graphql\" }),\n *   cache: new InMemoryCache(),\n * });\n *\n * function SuspenseFallback() {\n *   return <div>Loading...</div>;\n * }\n *\n * function Child({ queryRef }) {\n *   const { data } = useReadQuery(queryRef);\n *\n *   return <div>{data.foo.bar}</div>;\n * }\n *\n * function Parent() {\n *   const [queryRef] = useBackgroundQuery(query);\n *\n *   return (\n *     <Suspense fallback={<SuspenseFallback />}>\n *       <Child queryRef={queryRef} />\n *     </Suspense>\n *   );\n * }\n *\n * function App() {\n *   return (\n *     <ApolloProvider client={client}>\n *       <Parent />\n *     </ApolloProvider>\n *   );\n * }\n * ```\n *\n * @param query - A GraphQL query document parsed into an AST by `gql`.\n * @param options - An optional object containing options for the query. Instead of passing a `useBackgroundQuery.Options` object into the hook, you can also pass a [`skipToken`](#skiptoken) to prevent the `useBackgroundQuery` hook from executing the query or suspending.\n */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    /** @deprecated `returnPartialData` has no effect on `no-cache` queries */\n    returnPartialData: boolean;\n    fetchPolicy: \"no-cache\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: false;\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: boolean;\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    errorPolicy: \"ignore\" | \"all\";\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"empty\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n    returnPartialData: false;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n    returnPartialData: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: false;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    returnPartialData: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: useBackgroundQuery.Options<NoInfer<TVariables>> & {\n    skip: boolean;\n  }\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: SkipToken\n): [undefined, useBackgroundQuery.Result<TData, TVariables>];\n\n/** {@inheritDoc @apollo/client/react!useBackgroundQuery:function(1)} */\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | SkipToken\n    | (useBackgroundQuery.Options<NoInfer<TVariables>> & {\n        returnPartialData: false;\n      })\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | SkipToken\n    | (useBackgroundQuery.Options<NoInfer<TVariables>> & {\n        returnPartialData: boolean;\n      })\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\" | \"partial\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  ...[options]: {} extends TVariables ?\n    [options?: useBackgroundQuery.Options<NoInfer<TVariables>>]\n  : [options: useBackgroundQuery.Options<NoInfer<TVariables>>]\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\">,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  ...[options]: {} extends TVariables ?\n    [options?: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>]\n  : [options: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>]\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, \"complete\" | \"streaming\"> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n];\n\nexport function useBackgroundQuery<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options?: SkipToken | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, DataState<TData>[\"dataState\"]> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n] {\n  \"use no memo\";\n  return wrapHook(\n    \"useBackgroundQuery\",\n    useBackgroundQuery_,\n    useApolloClient(typeof options === \"object\" ? options.client : undefined)\n  )(query, options ?? ({} as any));\n}\n\nfunction useBackgroundQuery_<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n  TStates extends DataState<TData>[\"dataState\"] = DataState<TData>[\"dataState\"],\n>(\n  query: DocumentNode | TypedDocumentNode<TData, TVariables>,\n  options:\n    | (SkipToken & Partial<useBackgroundQuery.Options<NoInfer<TVariables>>>)\n    | useBackgroundQuery.Options<NoInfer<TVariables>>\n): [\n  QueryRef<TData, TVariables, TStates> | undefined,\n  useBackgroundQuery.Result<TData, TVariables>,\n] {\n  const client = useApolloClient(options.client);\n  const suspenseCache = getSuspenseCache(client);\n  const watchQueryOptions = useWatchQueryOptions({ client, query, options });\n  const { fetchPolicy } = watchQueryOptions;\n  const cacheKey = useSuspenseHookCacheKey(query, options);\n\n  // This ref tracks the first time query execution is enabled to determine\n  // whether to return a query ref or `undefined`. When initialized\n  // in a skipped state (either via `skip: true` or `skipToken`) we return\n  // `undefined` for the `queryRef` until the query has been enabled. Once\n  // enabled, a query ref is always returned regardless of whether the query is\n  // skipped again later.\n  const didFetchResult = React.useRef(fetchPolicy !== \"standby\");\n  didFetchResult.current ||= fetchPolicy !== \"standby\";\n\n  const queryRef = suspenseCache.getQueryRef<TData, TStates>(cacheKey, () =>\n    client.watchQuery(\n      watchQueryOptions as ApolloClient.WatchQueryOptions<any, any>\n    )\n  );\n\n  const [wrappedQueryRef, setWrappedQueryRef] = React.useState(\n    wrapQueryRef(queryRef)\n  );\n  if (unwrapQueryRef(wrappedQueryRef) !== queryRef) {\n    setWrappedQueryRef(wrapQueryRef(queryRef));\n  }\n  if (queryRef.didChangeOptions(watchQueryOptions)) {\n    const promise = queryRef.applyOptions(watchQueryOptions);\n    updateWrappedQueryRef(wrappedQueryRef, promise);\n  }\n\n  // This prevents issues where rerendering useBackgroundQuery after the\n  // queryRef has been disposed would cause the hook to return a new queryRef\n  // instance since disposal also removes it from the suspense cache. We add\n  // the queryRef back in the suspense cache so that the next render will reuse\n  // this queryRef rather than initializing a new instance.\n  React.useEffect(() => {\n    // Since the queryRef is disposed async via `setTimeout`, we have to wait a\n    // tick before checking it and adding back to the suspense cache.\n    const id = setTimeout(() => {\n      if (queryRef.disposed) {\n        suspenseCache.add(cacheKey, queryRef);\n      }\n    });\n\n    return () => clearTimeout(id);\n    // Omitting the deps is intentional. This avoids stale closures and the\n    // conditional ensures we aren't running the logic on each render.\n  });\n\n  const fetchMore: FetchMoreFunction<TData, TVariables> = React.useCallback(\n    (options) => {\n      const promise = queryRef.fetchMore(options);\n\n      setWrappedQueryRef(wrapQueryRef(queryRef));\n\n      return promise;\n    },\n    [queryRef]\n  );\n\n  const refetch: RefetchFunction<TData, TVariables> = React.useCallback(\n    (variables) => {\n      const promise = queryRef.refetch(variables);\n\n      setWrappedQueryRef(wrapQueryRef(queryRef));\n\n      return promise;\n    },\n    [queryRef]\n  );\n\n  React.useEffect(() => queryRef.softRetain(), [queryRef]);\n\n  return [\n    didFetchResult.current ? wrappedQueryRef : void 0,\n    {\n      fetchMore,\n      refetch,\n      // TODO: The internalQueryRef doesn't have TVariables' type information so we have to cast it here\n      subscribeToMore: queryRef.observable\n        .subscribeToMore as SubscribeToMoreFunction<TData, TVariables>,\n    },\n  ];\n}\n"]}

package/react/hooks/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.FromOptionValue<TData> | Array<useFragment.FromOptionValue<TData> | null> | null;
         /**
          * 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 FromOptionValue<TData> = ApolloCache.FromOptionValue<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<useFragment.FromOptionValue<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.FromOptionValue<TData> | null>;
+}): 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

package/react/hooks/useFragment.js

@@ -1,103 +1,54 @@
-import { equal } from "@wry/equality";
 import * as React from "react";
 import { useDeepMemo, wrapHook } from "./internal/index.js";
 import { useApolloClient } from "./useApolloClient.js";
 import { useSyncExternalStore } from "./useSyncExternalStore.js";
-/**
- * `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 function useFragment(options) {
     "use no memo";
-    return wrapHook("useFragment", 
-    // eslint-disable-next-line react-compiler/react-compiler
-    useFragment_, useApolloClient(options.client))(options);
+    return wrapHook("useFragment", useFragment_, useApolloClient(options.client))(options);
 }
 function useFragment_(options) {
     const client = useApolloClient(options.client);
-    const { cache } = client;
     const { from, ...rest } = options;
-    // We calculate the cache id separately from `stableOptions` because we don't
-    // want changes to non key fields in the `from` property to affect
-    // `stableOptions` and retrigger our subscription. If the cache identifier
-    // stays the same between renders, we want to reuse the existing subscription.
-    const id = React.useMemo(() => typeof from === "string" ? from
-        : from === null ? null
-            : cache.identify(from), [cache, from]);
-    const stableOptions = useDeepMemo(() => ({ ...rest, from: id }), [rest, id]);
-    // Since .next is async, we need to make sure that we
-    // get the correct diff on the next render given new diffOptions
-    const diff = React.useMemo(() => {
-        const { fragment, fragmentName, from, optimistic = true } = stableOptions;
-        if (from === null) {
-            return {
-                result: diffToResult({
-                    result: {},
-                    complete: false,
-                }),
-            };
-        }
-        const { cache } = client;
-        const diff = cache.diff({
-            ...stableOptions,
-            returnPartialData: true,
-            id: from,
-            query: cache["getFragmentDoc"](client["transform"](fragment), fragmentName),
-            optimistic,
-        });
-        return {
-            result: diffToResult({
-                ...diff,
-                result: client["queryManager"].maskFragment({
-                    fragment,
-                    fragmentName,
-                    // TODO: Revert to `diff.result` once `useFragment` supports `null` as
-                    // valid return value
-                    data: diff.result === null ? {} : diff.result,
-                }),
-            }),
-        };
-    }, [client, stableOptions]);
-    // Used for both getSnapshot and getServerSnapshot
-    const getSnapshot = React.useCallback(() => diff.result, [diff]);
-    return useSyncExternalStore(React.useCallback((forceUpdate) => {
+    const { cache } = client;
+    // We calculate the cache id seperately because we don't want changes to non
+    // key fields in the `from` property to recreate the observable. If the cache
+    // identifier stays the same between renders, we want to reuse the existing
+    // subscription.
+    const ids = useDeepMemo(() => {
+        const fromArray = Array.isArray(from) ? from : [from];
+        const ids = fromArray.map((value) => typeof value === "string" ? value
+            : value === null ? null
+                : cache.identify(value));
+        return Array.isArray(from) ? ids : ids[0];
+    }, [cache, from]);
+    const stableOptions = useDeepMemo(() => ({ ...rest, from: ids }), [rest, ids]);
+    const observable = React.useMemo(() => client.watchFragment(stableOptions), [client, stableOptions]);
+    // Unfortunately we forgot to update the use case of `from: null` on
+    // useFragment in 4.0 to match `useSuspenseFragment`. As such, we need to
+    // fallback to data: {} with complete: false when `from` is `null` to maintain
+    // backwards compatibility. We should plan to change this in v5.
+    const getSnapshot = React.useCallback(() => (from === null ? nullResult : observable.getCurrentResult()), [from, observable]);
+    return useSyncExternalStore(React.useCallback((update) => {
         let lastTimeout = 0;
-        const subscription = stableOptions.from === null ?
-            null
-            : client.watchFragment(stableOptions).subscribe({
-                next: (result) => {
-                    // Avoid unnecessarily rerendering this hook for the initial result
-                    // emitted from watchFragment which should be equal to
-                    // `diff.result`.
-                    if (equal(result, diff.result))
-                        return;
-                    diff.result = result;
-                    // If we get another update before we've re-rendered, bail out of
-                    // the update and try again. This ensures that the relative timing
-                    // between useQuery and useFragment stays roughly the same as
-                    // fixed in https://github.com/apollographql/apollo-client/pull/11083
-                    clearTimeout(lastTimeout);
-                    lastTimeout = setTimeout(forceUpdate);
-                },
-            });
+        const subscription = observable.subscribe({
+            next: () => {
+                // If we get another update before we've re-rendered, bail out of
+                // the update and try again. This ensures that the relative timing
+                // between useQuery and useFragment stays roughly the same as
+                // fixed in https://github.com/apollographql/apollo-client/pull/11083
+                clearTimeout(lastTimeout);
+                lastTimeout = setTimeout(update);
+            },
+        });
         return () => {
-            subscription?.unsubscribe();
+            subscription.unsubscribe();
             clearTimeout(lastTimeout);
         };
-    }, [client, stableOptions, diff]), getSnapshot, getSnapshot);
-}
-function diffToResult(diff) {
-    const result = {
-        data: diff.result,
-        complete: !!diff.complete,
-        dataState: diff.complete ? "complete" : "partial",
-    }; // TODO: Remove assertion once useFragment returns null
-    if (diff.missing) {
-        result.missing = diff.missing.missing;
-    }
-    return result;
+    }, [observable]), getSnapshot, getSnapshot);
 }
+const nullResult = Object.freeze({
+    data: {},
+    dataState: "partial",
+    complete: false,
+});
 //# sourceMappingURL=useFragment.js.map

package/react/hooks/useFragment.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFragment.js","sourceRoot":"","sources":["../../../src/react/hooks/useFragment.ts"],"names":[],"mappings":"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","sourcesContent":["import { equal } from \"@wry/equality\";\nimport * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataValue,\n  DocumentNode,\n  GetDataState,\n  OperationVariables,\n  TypedDocumentNode,\n} from \"@apollo/client\";\nimport type {\n  Cache,\n  MissingTree,\n  Reference,\n  StoreObject,\n} from \"@apollo/client/cache\";\nimport type { FragmentType, MaybeMasked } from \"@apollo/client/masking\";\nimport type { NoInfer } from \"@apollo/client/utilities/internal\";\n\nimport { useDeepMemo, wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\nimport { useSyncExternalStore } from \"./useSyncExternalStore.js\";\n\nexport declare namespace useFragment {\n  import _self = useFragment;\n  export interface 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     * Any variables that the GraphQL query may depend on.\n     */\n    variables?: NoInfer<TVariables>;\n\n    /**\n     * 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).\n     */\n    from:\n      | StoreObject\n      | Reference\n      | FragmentType<NoInfer<TData>>\n      | string\n      | null;\n\n    /**\n     * Whether to read from optimistic or non-optimistic cache data. If\n     * this named option is provided, the optimistic parameter of the\n     * readQuery method can be omitted.\n     *\n     * @defaultValue true\n     */\n    optimistic?: boolean;\n\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  namespace DocumentationTypes {\n    namespace useFragment {\n      export interface Options<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends _self.Options<TData, TVariables> {}\n    }\n  }\n\n  // TODO: Update this to return `null` when there is no data returned from the\n  // fragment.\n  export type Result<TData> =\n    | ({\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#complete:member} */\n        complete: true;\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#missing:member} */\n        missing?: never;\n      } & GetDataState<MaybeMasked<TData>, \"complete\">)\n    | ({\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#complete:member} */\n        complete: false;\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#missing:member} */\n        missing?: MissingTree;\n      } & GetDataState<MaybeMasked<TData>, \"partial\">);\n\n  export namespace DocumentationTypes {\n    namespace useFragment {\n      export interface Result<TData> {\n        data: MaybeMasked<TData> | DataValue.Partial<MaybeMasked<TData>>;\n        complete: boolean;\n        /**\n         * 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.\n         */\n        missing?: MissingTree;\n      }\n    }\n  }\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useFragment:function(1)} */\n    export function useFragment<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >({\n      fragment,\n      from,\n      fragmentName,\n      variables,\n      optimistic,\n      client,\n    }: useFragment.Options<TData, TVariables>): useFragment.Result<TData>;\n  }\n}\n\n/**\n * `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.\n *\n * 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.\n *\n * To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.\n */\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(options: useFragment.Options<TData, TVariables>): useFragment.Result<TData> {\n  \"use no memo\";\n  return wrapHook(\n    \"useFragment\",\n    // eslint-disable-next-line react-compiler/react-compiler\n    useFragment_,\n    useApolloClient(options.client)\n  )(options);\n}\n\nfunction useFragment_<TData, TVariables extends OperationVariables>(\n  options: useFragment.Options<TData, TVariables>\n): useFragment.Result<TData> {\n  const client = useApolloClient(options.client);\n  const { cache } = client;\n  const { from, ...rest } = options;\n\n  // We calculate the cache id separately from `stableOptions` because we don't\n  // want changes to non key fields in the `from` property to affect\n  // `stableOptions` and retrigger our subscription. If the cache identifier\n  // stays the same between renders, we want to reuse the existing subscription.\n  const id = React.useMemo(\n    () =>\n      typeof from === \"string\" ? from\n      : from === null ? null\n      : cache.identify(from),\n    [cache, from]\n  );\n\n  const stableOptions = useDeepMemo(() => ({ ...rest, from: id! }), [rest, id]);\n\n  // Since .next is async, we need to make sure that we\n  // get the correct diff on the next render given new diffOptions\n  const diff = React.useMemo(() => {\n    const { fragment, fragmentName, from, optimistic = true } = stableOptions;\n\n    if (from === null) {\n      return {\n        result: diffToResult({\n          result: {},\n          complete: false,\n        } as Cache.DiffResult<TData>),\n      };\n    }\n\n    const { cache } = client;\n    const diff = cache.diff<TData, TVariables>({\n      ...stableOptions,\n      returnPartialData: true,\n      id: from,\n      query: cache[\"getFragmentDoc\"](\n        client[\"transform\"](fragment),\n        fragmentName\n      ),\n      optimistic,\n    });\n\n    return {\n      result: diffToResult<TData>({\n        ...diff,\n        result: client[\"queryManager\"].maskFragment({\n          fragment,\n          fragmentName,\n          // TODO: Revert to `diff.result` once `useFragment` supports `null` as\n          // valid return value\n          data: diff.result === null ? {} : diff.result,\n        }) as any,\n      }),\n    };\n  }, [client, stableOptions]);\n\n  // Used for both getSnapshot and getServerSnapshot\n  const getSnapshot = React.useCallback(() => diff.result, [diff]);\n\n  return useSyncExternalStore(\n    React.useCallback(\n      (forceUpdate) => {\n        let lastTimeout = 0;\n\n        const subscription =\n          stableOptions.from === null ?\n            null\n          : client.watchFragment(stableOptions).subscribe({\n              next: (result) => {\n                // Avoid unnecessarily rerendering this hook for the initial result\n                // emitted from watchFragment which should be equal to\n                // `diff.result`.\n                if (equal(result, diff.result)) return;\n                diff.result = result;\n                // If we get another update before we've re-rendered, bail out of\n                // the update and try again. This ensures that the relative timing\n                // between useQuery and useFragment stays roughly the same as\n                // fixed in https://github.com/apollographql/apollo-client/pull/11083\n                clearTimeout(lastTimeout);\n                lastTimeout = setTimeout(forceUpdate) as any;\n              },\n            });\n        return () => {\n          subscription?.unsubscribe();\n          clearTimeout(lastTimeout);\n        };\n      },\n      [client, stableOptions, diff]\n    ),\n    getSnapshot,\n    getSnapshot\n  );\n}\n\nfunction diffToResult<TData>(\n  diff: Cache.DiffResult<TData>\n): useFragment.Result<TData> {\n  const result = {\n    data: diff.result,\n    complete: !!diff.complete,\n    dataState: diff.complete ? \"complete\" : \"partial\",\n  } as useFragment.Result<TData>; // TODO: Remove assertion once useFragment returns null\n\n  if (diff.missing) {\n    result.missing = diff.missing.missing;\n  }\n\n  return result;\n}\n"]}
+{"version":3,"file":"useFragment.js","sourceRoot":"","sources":["../../../src/react/hooks/useFragment.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\n\nimport type {\n  ApolloClient,\n  DataValue,\n  DocumentNode,\n  GetDataState,\n  OperationVariables,\n  TypedDocumentNode,\n} from \"@apollo/client\";\nimport type { ApolloCache, MissingTree } from \"@apollo/client/cache\";\nimport type { MaybeMasked } from \"@apollo/client/masking\";\nimport type { NoInfer } from \"@apollo/client/utilities/internal\";\n\nimport { useDeepMemo, wrapHook } from \"./internal/index.js\";\nimport { useApolloClient } from \"./useApolloClient.js\";\nimport { useSyncExternalStore } from \"./useSyncExternalStore.js\";\n\nexport declare namespace useFragment {\n  import _self = useFragment;\n\n  export interface 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     * Any variables that the GraphQL query may depend on.\n     */\n    variables?: NoInfer<TVariables>;\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      | useFragment.FromOptionValue<TData>\n      | Array<useFragment.FromOptionValue<TData> | null>\n      | null;\n\n    /**\n     * Whether to read from optimistic or non-optimistic cache data. If\n     * this named option is provided, the optimistic parameter of the\n     * readQuery method can be omitted.\n     *\n     * @defaultValue true\n     */\n    optimistic?: boolean;\n\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  namespace DocumentationTypes {\n    namespace useFragment {\n      export interface Options<\n        TData = unknown,\n        TVariables extends OperationVariables = OperationVariables,\n      > extends _self.Options<TData, TVariables> {}\n    }\n  }\n\n  /**\n   * Acceptable values provided to the `from` option.\n   */\n  export type FromOptionValue<TData> = ApolloCache.FromOptionValue<TData>;\n\n  // TODO: Update this to return `null` when there is no data returned from the\n  // fragment.\n  export type Result<TData> =\n    | ({\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#complete:member} */\n        complete: true;\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#missing:member} */\n        missing?: never;\n      } & GetDataState<MaybeMasked<TData>, \"complete\">)\n    | {\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#complete:member} */\n        complete: false;\n        /** {@inheritDoc @apollo/client/react!useFragment.DocumentationTypes.useFragment.Result#missing:member} */\n        missing?: MissingTree;\n        /** {@inheritDoc @apollo/client!QueryResultDocumentation#data:member} */\n        data: TData extends Array<infer TItem> ?\n          Array<DataValue.Partial<TItem> | null>\n        : DataValue.Partial<TData>;\n        /** {@inheritDoc @apollo/client!QueryResultDocumentation#dataState:member} */\n        dataState: \"partial\";\n      };\n\n  export namespace DocumentationTypes {\n    namespace useFragment {\n      export interface Result<TData> {\n        data: MaybeMasked<TData> | DataValue.Partial<MaybeMasked<TData>>;\n        complete: boolean;\n        /**\n         * 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.\n         */\n        missing?: MissingTree;\n      }\n    }\n  }\n  export namespace DocumentationTypes {\n    /** {@inheritDoc @apollo/client/react!useFragment:function(1)} */\n    export function useFragment<\n      TData = unknown,\n      TVariables extends OperationVariables = OperationVariables,\n    >({\n      fragment,\n      from,\n      fragmentName,\n      variables,\n      optimistic,\n      client,\n    }: useFragment.Options<TData, TVariables>): useFragment.Result<TData>;\n  }\n}\n\n/**\n * `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.\n *\n * 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.\n *\n * To view a `useFragment` example, see the [Fragments](https://www.apollographql.com/docs/react/data/fragments#usefragment) page.\n */\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useFragment.Options<TData, TVariables> & {\n    from: Array<useFragment.FromOptionValue<TData>>;\n  }\n): useFragment.Result<Array<TData>>;\n\n/** {@inheritDoc @apollo/client/react!useFragment:function(1)} */\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useFragment.Options<TData, TVariables> & {\n    from: Array<null>;\n  }\n): useFragment.Result<Array<null>>;\n\n/** {@inheritDoc @apollo/client/react!useFragment:function(1)} */\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useFragment.Options<TData, TVariables> & {\n    from: Array<useFragment.FromOptionValue<TData> | null>;\n  }\n): useFragment.Result<Array<TData | null>>;\n\n/** {@inheritDoc @apollo/client/react!useFragment:function(1)} */\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(options: useFragment.Options<TData, TVariables>): useFragment.Result<TData>;\n\nexport function useFragment<\n  TData = unknown,\n  TVariables extends OperationVariables = OperationVariables,\n>(\n  options: useFragment.Options<TData, TVariables>\n): useFragment.Result<TData> | useFragment.Result<Array<TData | null>> {\n  \"use no memo\";\n  return wrapHook(\n    \"useFragment\",\n    useFragment_,\n    useApolloClient(options.client)\n  )(options);\n}\n\nfunction useFragment_<TData, TVariables extends OperationVariables>(\n  options: useFragment.Options<TData, TVariables>\n): useFragment.Result<TData> | useFragment.Result<Array<TData | null>> {\n  const client = useApolloClient(options.client);\n  const { from, ...rest } = options;\n  const { cache } = client;\n\n  // We calculate the cache id seperately because we don't want changes to non\n  // key fields in the `from` property to recreate the observable. If the cache\n  // identifier stays the same between renders, we want to reuse the existing\n  // subscription.\n  const ids = useDeepMemo(() => {\n    const fromArray = Array.isArray(from) ? from : [from];\n\n    const ids = fromArray.map((value) =>\n      typeof value === \"string\" ? value\n      : value === null ? null\n      : cache.identify(value)\n    );\n\n    return Array.isArray(from) ? ids : ids[0];\n  }, [cache, from]);\n\n  const stableOptions = useDeepMemo(\n    () => ({ ...rest, from: ids as any }),\n    [rest, ids]\n  );\n\n  const observable = React.useMemo(\n    () => client.watchFragment(stableOptions),\n    [client, stableOptions]\n  );\n\n  // Unfortunately we forgot to update the use case of `from: null` on\n  // useFragment in 4.0 to match `useSuspenseFragment`. As such, we need to\n  // fallback to data: {} with complete: false when `from` is `null` to maintain\n  // backwards compatibility. We should plan to change this in v5.\n  const getSnapshot = React.useCallback(\n    () => (from === null ? nullResult : observable.getCurrentResult()),\n    [from, observable]\n  );\n\n  return useSyncExternalStore(\n    React.useCallback(\n      (update) => {\n        let lastTimeout = 0;\n        const subscription = observable.subscribe({\n          next: () => {\n            // If we get another update before we've re-rendered, bail out of\n            // the update and try again. This ensures that the relative timing\n            // between useQuery and useFragment stays roughly the same as\n            // fixed in https://github.com/apollographql/apollo-client/pull/11083\n            clearTimeout(lastTimeout);\n            lastTimeout = setTimeout(update) as any;\n          },\n        });\n\n        return () => {\n          subscription.unsubscribe();\n          clearTimeout(lastTimeout);\n        };\n      },\n      [observable]\n    ),\n    getSnapshot,\n    getSnapshot\n  );\n}\n\nconst nullResult = Object.freeze({\n  data: {},\n  dataState: \"partial\",\n  complete: false,\n}) as useFragment.Result<any>;\n"]}

package/react/hooks/useLazyQuery.js

@@ -126,9 +126,11 @@ export function useLazyQuery(query, options) {
             ...eagerMethods,
             ...result,
             client,
+            // eslint-disable-next-line react-hooks/refs
             previousData: previousDataRef.current,
             variables: observable.variables,
             observable,
+            // eslint-disable-next-line react-hooks/refs
             called: !!resultRef.current,
         };
     }, [client, observableResult, eagerMethods, observable]);