@trpc/react-query 10.42.0 → 11.0.0-next.91

package/dist/createHooksInternal-e2034194.js

@@ -0,0 +1,490 @@
+'use strict';
+
+var shared = require('@trpc/server/shared');
+var reactQuery = require('@tanstack/react-query');
+var client = require('@trpc/client');
+var React = require('react');
+var utilsProxy = require('./utilsProxy-27bd93c1.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Create proxy for decorating procedures
+ * @internal
+ */ function createReactDecoration(name, hooks) {
+    return shared.createRecursiveProxy(({ path , args  })=>{
+        const pathCopy = [
+            name,
+            ...path
+        ];
+        // The last arg is for instance `.useMutation` or `.useQuery()`
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        const lastArg = pathCopy.pop();
+        if (lastArg === 'useMutation') {
+            return hooks[lastArg](pathCopy, ...args);
+        }
+        if (lastArg === '_def') {
+            return {
+                path: pathCopy
+            };
+        }
+        const [input, ...rest] = args;
+        const opts = rest[0] || {};
+        return hooks[lastArg](pathCopy, input, opts);
+    });
+}
+
+/**
+ * Create proxy for `useQueries` options
+ * @internal
+ */ function createUseQueries(client) {
+    return shared.createRecursiveProxy((opts)=>{
+        const arrayPath = opts.path;
+        const dotPath = arrayPath.join('.');
+        const [input, _opts] = opts.args;
+        const options = {
+            queryKey: utilsProxy.getQueryKeyInternal(arrayPath, input, 'query'),
+            queryFn: ()=>{
+                return client.query(dotPath, input, _opts?.trpc);
+            },
+            ..._opts
+        };
+        return options;
+    });
+}
+
+function getClientArgs(queryKey, opts, pageParam) {
+    const path = queryKey[0];
+    const input = queryKey[1]?.input;
+    if (pageParam) input.cursor = pageParam;
+    return [
+        path.join('.'),
+        input,
+        opts?.trpc
+    ];
+}
+
+/**
+ * Makes a stable reference of the `trpc` prop
+ */ function useHookResult(value) {
+    const ref = React.useRef(value);
+    ref.current.path = value.path;
+    return ref.current;
+}
+
+/**
+ * @internal
+ */ function createRootHooks(config) {
+    const mutationSuccessOverride = config?.overrides?.useMutation?.onSuccess ?? ((options)=>options.originalFn());
+    const Context = config?.context ?? utilsProxy.TRPCContext;
+    const createClient = (opts)=>{
+        return client.createTRPCUntypedClient(opts);
+    };
+    const TRPCProvider = (props)=>{
+        const { abortOnUnmount =false , client , queryClient , ssrContext  } = props;
+        const [ssrState, setSSRState] = React.useState(props.ssrState ?? false);
+        React.useEffect(()=>{
+            // Only updating state to `mounted` if we are using SSR.
+            // This makes it so we don't have an unnecessary re-render when opting out of SSR.
+            setSSRState((state)=>state ? 'mounted' : false);
+        }, []);
+        return /*#__PURE__*/ React__default["default"].createElement(Context.Provider, {
+            value: {
+                abortOnUnmount,
+                queryClient,
+                client,
+                ssrContext: ssrContext ?? null,
+                ssrState,
+                fetchQuery: React.useCallback((queryKey, opts)=>{
+                    return queryClient.fetchQuery({
+                        ...opts,
+                        queryKey,
+                        queryFn: ()=>client.query(...getClientArgs(queryKey, opts))
+                    });
+                }, [
+                    client,
+                    queryClient
+                ]),
+                fetchInfiniteQuery: React.useCallback((queryKey, opts)=>{
+                    return queryClient.fetchInfiniteQuery({
+                        ...opts,
+                        queryKey,
+                        queryFn: ({ pageParam  })=>{
+                            return client.query(...getClientArgs(queryKey, opts, pageParam));
+                        },
+                        initialPageParam: opts?.initialCursor ?? null
+                    });
+                }, [
+                    client,
+                    queryClient
+                ]),
+                prefetchQuery: React.useCallback((queryKey, opts)=>{
+                    return queryClient.prefetchQuery({
+                        ...opts,
+                        queryKey,
+                        queryFn: ()=>client.query(...getClientArgs(queryKey, opts))
+                    });
+                }, [
+                    client,
+                    queryClient
+                ]),
+                prefetchInfiniteQuery: React.useCallback((queryKey, opts)=>{
+                    return queryClient.prefetchInfiniteQuery({
+                        ...opts,
+                        queryKey,
+                        queryFn: ({ pageParam  })=>{
+                            return client.query(...getClientArgs(queryKey, opts, pageParam));
+                        },
+                        initialPageParam: opts?.initialCursor ?? null
+                    });
+                }, [
+                    client,
+                    queryClient
+                ]),
+                ensureQueryData: React.useCallback((queryKey, opts)=>{
+                    return queryClient.ensureQueryData({
+                        ...opts,
+                        queryKey,
+                        queryFn: ()=>client.query(...getClientArgs(queryKey, opts))
+                    });
+                }, [
+                    client,
+                    queryClient
+                ]),
+                invalidateQueries: React.useCallback((queryKey, filters, options)=>{
+                    return queryClient.invalidateQueries({
+                        ...filters,
+                        queryKey
+                    }, options);
+                }, [
+                    queryClient
+                ]),
+                resetQueries: React.useCallback((queryKey, filters, options)=>{
+                    return queryClient.resetQueries({
+                        ...filters,
+                        queryKey
+                    }, options);
+                }, [
+                    queryClient
+                ]),
+                refetchQueries: React.useCallback((queryKey, filters, options)=>{
+                    return queryClient.refetchQueries({
+                        ...filters,
+                        queryKey
+                    }, options);
+                }, [
+                    queryClient
+                ]),
+                cancelQuery: React.useCallback((queryKey, options)=>{
+                    return queryClient.cancelQueries({
+                        queryKey
+                    }, options);
+                }, [
+                    queryClient
+                ]),
+                setQueryData: React.useCallback((queryKey, updater, options)=>{
+                    return queryClient.setQueryData(queryKey, updater, options);
+                }, [
+                    queryClient
+                ]),
+                getQueryData: React.useCallback((queryKey)=>{
+                    return queryClient.getQueryData(queryKey);
+                }, [
+                    queryClient
+                ]),
+                setInfiniteQueryData: React.useCallback((queryKey, updater, options)=>{
+                    return queryClient.setQueryData(queryKey, updater, options);
+                }, [
+                    queryClient
+                ]),
+                getInfiniteQueryData: React.useCallback((queryKey)=>{
+                    return queryClient.getQueryData(queryKey);
+                }, [
+                    queryClient
+                ])
+            }
+        }, props.children);
+    };
+    function useContext() {
+        const context = React__default["default"].useContext(Context);
+        if (!context) {
+            throw new Error('Unable to find tRPC Context. Did you forget to wrap your App inside `withTRPC` HoC?');
+        }
+        return context;
+    }
+    /**
+   * Hack to make sure errors return `status`='error` when doing SSR
+   * @link https://github.com/trpc/trpc/pull/1645
+   */ function useSSRQueryOptionsIfNeeded(queryKey, opts) {
+        const { queryClient , ssrState  } = useContext();
+        return ssrState && ssrState !== 'mounted' && queryClient.getQueryCache().find({
+            queryKey
+        })?.state.status === 'error' ? {
+            retryOnMount: false,
+            ...opts
+        } : opts;
+    }
+    function useQuery(path, input, opts) {
+        const context = useContext();
+        const { abortOnUnmount , client , ssrState , queryClient , prefetchQuery  } = context;
+        const queryKey = utilsProxy.getQueryKeyInternal(path, input, 'query');
+        const defaultOpts = queryClient.getQueryDefaults(queryKey);
+        if (typeof window === 'undefined' && ssrState === 'prepass' && opts?.trpc?.ssr !== false && (opts?.enabled ?? defaultOpts?.enabled) !== false && !queryClient.getQueryCache().find({
+            queryKey
+        })) {
+            void prefetchQuery(queryKey, opts);
+        }
+        const ssrOpts = useSSRQueryOptionsIfNeeded(queryKey, {
+            ...defaultOpts,
+            ...opts
+        });
+        const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? config?.abortOnUnmount ?? abortOnUnmount;
+        const hook = reactQuery.useQuery({
+            ...ssrOpts,
+            queryKey: queryKey,
+            queryFn: (queryFunctionContext)=>{
+                const actualOpts = {
+                    ...ssrOpts,
+                    trpc: {
+                        ...ssrOpts?.trpc,
+                        ...shouldAbortOnUnmount ? {
+                            signal: queryFunctionContext.signal
+                        } : {}
+                    }
+                };
+                return client.query(...getClientArgs(queryKey, actualOpts));
+            }
+        }, queryClient);
+        hook.trpc = useHookResult({
+            path: path.join('.')
+        });
+        return hook;
+    }
+    function useSuspenseQuery(path, input, opts) {
+        const context = useContext();
+        const queryKey = utilsProxy.getQueryKeyInternal(path, input, 'query');
+        const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? config?.abortOnUnmount ?? context.abortOnUnmount;
+        const hook = reactQuery.useSuspenseQuery({
+            ...opts,
+            queryKey: queryKey,
+            queryFn: (queryFunctionContext)=>{
+                const actualOpts = {
+                    trpc: {
+                        ...shouldAbortOnUnmount ? {
+                            signal: queryFunctionContext.signal
+                        } : {}
+                    }
+                };
+                return context.client.query(...getClientArgs(queryKey, actualOpts));
+            }
+        }, context.queryClient);
+        hook.trpc = useHookResult({
+            path: path.join('.')
+        });
+        return [
+            hook.data,
+            hook
+        ];
+    }
+    function useMutation(path, opts) {
+        const { client  } = useContext();
+        const queryClient = reactQuery.useQueryClient();
+        const mutationKey = [
+            path
+        ];
+        const defaultOpts = queryClient.getMutationDefaults(mutationKey);
+        const hook = reactQuery.useMutation({
+            ...opts,
+            mutationKey: mutationKey,
+            mutationFn: (input)=>{
+                return client.mutation(...getClientArgs([
+                    path,
+                    {
+                        input
+                    }
+                ], opts));
+            },
+            onSuccess (...args) {
+                const originalFn = ()=>opts?.onSuccess?.(...args) ?? defaultOpts?.onSuccess?.(...args);
+                return mutationSuccessOverride({
+                    originalFn,
+                    queryClient,
+                    meta: opts?.meta ?? defaultOpts?.meta ?? {}
+                });
+            }
+        }, queryClient);
+        hook.trpc = useHookResult({
+            path: path.join('.')
+        });
+        return hook;
+    }
+    /* istanbul ignore next -- @preserve */ function useSubscription(path, input, opts) {
+        const enabled = opts?.enabled ?? true;
+        const queryKey = reactQuery.hashKey(utilsProxy.getQueryKeyInternal(path, input, 'any'));
+        const { client  } = useContext();
+        const optsRef = React.useRef(opts);
+        optsRef.current = opts;
+        React.useEffect(()=>{
+            if (!enabled) {
+                return;
+            }
+            let isStopped = false;
+            const subscription = client.subscription(path.join('.'), input ?? undefined, {
+                onStarted: ()=>{
+                    if (!isStopped) {
+                        optsRef.current.onStarted?.();
+                    }
+                },
+                onData: (data)=>{
+                    if (!isStopped) {
+                        opts.onData(data);
+                    }
+                },
+                onError: (err)=>{
+                    if (!isStopped) {
+                        optsRef.current.onError?.(err);
+                    }
+                }
+            });
+            return ()=>{
+                isStopped = true;
+                subscription.unsubscribe();
+            };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+        }, [
+            queryKey,
+            enabled
+        ]);
+    }
+    function useInfiniteQuery(path, input, opts) {
+        const { client , ssrState , prefetchInfiniteQuery , queryClient , abortOnUnmount ,  } = useContext();
+        const queryKey = utilsProxy.getQueryKeyInternal(path, input, 'infinite');
+        const defaultOpts = queryClient.getQueryDefaults(queryKey);
+        if (typeof window === 'undefined' && ssrState === 'prepass' && opts?.trpc?.ssr !== false && (opts?.enabled ?? defaultOpts?.enabled) !== false && !queryClient.getQueryCache().find({
+            queryKey
+        })) {
+            void prefetchInfiniteQuery(queryKey, {
+                ...defaultOpts,
+                ...opts
+            });
+        }
+        const ssrOpts = useSSRQueryOptionsIfNeeded(queryKey, {
+            ...defaultOpts,
+            ...opts
+        });
+        // request option should take priority over global
+        const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? abortOnUnmount;
+        const hook = reactQuery.useInfiniteQuery({
+            ...ssrOpts,
+            initialPageParam: opts.initialCursor ?? null,
+            persister: opts.persister,
+            queryKey: queryKey,
+            queryFn: (queryFunctionContext)=>{
+                const actualOpts = {
+                    ...ssrOpts,
+                    trpc: {
+                        ...ssrOpts?.trpc,
+                        ...shouldAbortOnUnmount ? {
+                            signal: queryFunctionContext.signal
+                        } : {}
+                    }
+                };
+                return client.query(...getClientArgs(queryKey, actualOpts, queryFunctionContext.pageParam ?? opts.initialCursor));
+            }
+        }, queryClient);
+        hook.trpc = useHookResult({
+            path: path.join('.')
+        });
+        return hook;
+    }
+    function useSuspenseInfiniteQuery(path, input, opts) {
+        const context = useContext();
+        const queryKey = utilsProxy.getQueryKeyInternal(path, input, 'infinite');
+        const defaultOpts = context.queryClient.getQueryDefaults(queryKey);
+        const ssrOpts = useSSRQueryOptionsIfNeeded(queryKey, {
+            ...defaultOpts,
+            ...opts
+        });
+        // request option should take priority over global
+        const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? context.abortOnUnmount;
+        const hook = reactQuery.useSuspenseInfiniteQuery({
+            ...opts,
+            initialPageParam: opts.initialCursor ?? null,
+            queryKey,
+            queryFn: (queryFunctionContext)=>{
+                const actualOpts = {
+                    ...ssrOpts,
+                    trpc: {
+                        ...ssrOpts?.trpc,
+                        ...shouldAbortOnUnmount ? {
+                            signal: queryFunctionContext.signal
+                        } : {}
+                    }
+                };
+                return context.client.query(...getClientArgs(queryKey, actualOpts, queryFunctionContext.pageParam ?? opts.initialCursor));
+            }
+        }, context.queryClient);
+        hook.trpc = useHookResult({
+            path: path.join('.')
+        });
+        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+        return [
+            hook.data,
+            hook
+        ];
+    }
+    const useQueries = (queriesCallback)=>{
+        const { ssrState , queryClient , prefetchQuery , client  } = useContext();
+        const proxy = createUseQueries(client);
+        const queries = queriesCallback(proxy);
+        if (typeof window === 'undefined' && ssrState === 'prepass') {
+            for (const query of queries){
+                const queryOption = query;
+                if (queryOption.trpc?.ssr !== false && !queryClient.getQueryCache().find({
+                    queryKey: queryOption.queryKey
+                })) {
+                    void prefetchQuery(queryOption.queryKey, queryOption);
+                }
+            }
+        }
+        return reactQuery.useQueries({
+            queries: queries.map((query)=>({
+                    ...query,
+                    queryKey: query.queryKey
+                }))
+        }, queryClient);
+    };
+    const useDehydratedState = (client, trpcState)=>{
+        const transformed = React.useMemo(()=>{
+            if (!trpcState) {
+                return trpcState;
+            }
+            return client.runtime.transformer.deserialize(trpcState);
+        }, [
+            trpcState,
+            client
+        ]);
+        return transformed;
+    };
+    return {
+        Provider: TRPCProvider,
+        createClient,
+        useContext,
+        useUtils: useContext,
+        useQuery,
+        useSuspenseQuery,
+        useQueries,
+        useMutation,
+        useSubscription,
+        useDehydratedState,
+        useInfiniteQuery,
+        useSuspenseInfiniteQuery
+    };
+}
+
+exports.createReactDecoration = createReactDecoration;
+exports.createRootHooks = createRootHooks;
+exports.createUseQueries = createUseQueries;
+exports.getClientArgs = getClientArgs;

package/dist/createTRPCReact.d.ts

@@ -1,77 +1,77 @@
-import { InfiniteData } from '@tanstack/react-query';
 import { TRPCClientErrorLike } from '@trpc/client';
-import { AnyMutationProcedure, AnyProcedure, AnyQueryProcedure, AnyRouter, AnySubscriptionProcedure, inferProcedureInput, ProcedureRouterRecord, ProtectedIntersection } from '@trpc/server';
+import { AnyMutationProcedure, AnyProcedure, AnyQueryProcedure, AnyRootConfig, AnyRouter, AnySubscriptionProcedure, inferProcedureInput, ProcedureRouterRecord, ProtectedIntersection } from '@trpc/server';
 import { inferTransformedProcedureOutput, inferTransformedSubscriptionOutput } from '@trpc/server/shared';
-import { QueryKey, QueryType } from './internals/getArrayQueryKey';
 import { TRPCUseQueries } from './internals/useQueries';
-import { CreateReactUtilsProxy } from './shared';
-import { CreateReactQueryHooks } from './shared/hooks/createRootHooks';
-import { CreateClient, DefinedUseTRPCQueryOptions, DefinedUseTRPCQueryResult, TRPCProvider, UseDehydratedState, UseTRPCInfiniteQueryOptions, UseTRPCInfiniteQueryResult, UseTRPCInfiniteQuerySuccessResult, UseTRPCMutationOptions, UseTRPCMutationResult, UseTRPCQueryOptions, UseTRPCQueryResult, UseTRPCQuerySuccessResult, UseTRPCSubscriptionOptions } from './shared/hooks/types';
+import { CreateReactUtils } from './shared';
+import { CreateReactQueryHooks } from './shared/hooks/createHooksInternal';
+import { CreateClient, DefinedUseTRPCQueryOptions, DefinedUseTRPCQueryResult, TRPCProvider, UseDehydratedState, UseTRPCInfiniteQueryOptions, UseTRPCInfiniteQueryResult, UseTRPCMutationOptions, UseTRPCMutationResult, UseTRPCQueryOptions, UseTRPCQueryResult, UseTRPCSubscriptionOptions, UseTRPCSuspenseInfiniteQueryOptions, UseTRPCSuspenseInfiniteQueryResult, UseTRPCSuspenseQueryOptions, UseTRPCSuspenseQueryResult } from './shared/hooks/types';
 import { CreateTRPCReactOptions } from './shared/types';
 /**
  * @internal
  */
-export interface ProcedureUseQuery<TProcedure extends AnyProcedure, TPath extends string> {
-    <TQueryFnData extends inferTransformedProcedureOutput<TProcedure> = inferTransformedProcedureOutput<TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts: DefinedUseTRPCQueryOptions<TPath, inferProcedureInput<TProcedure>, TQueryFnData, TData, TRPCClientErrorLike<TProcedure>, inferTransformedProcedureOutput<TProcedure>>): DefinedUseTRPCQueryResult<TData, TRPCClientErrorLike<TProcedure>>;
-    <TQueryFnData extends inferTransformedProcedureOutput<TProcedure> = inferTransformedProcedureOutput<TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts?: UseTRPCQueryOptions<TPath, inferProcedureInput<TProcedure>, TQueryFnData, TData, TRPCClientErrorLike<TProcedure>, inferTransformedProcedureOutput<TProcedure>>): UseTRPCQueryResult<TData, TRPCClientErrorLike<TProcedure>>;
+export interface ProcedureUseQuery<TConfig extends AnyRootConfig, TProcedure extends AnyProcedure> {
+    <TQueryFnData extends inferTransformedProcedureOutput<TConfig, TProcedure> = inferTransformedProcedureOutput<TConfig, TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts: DefinedUseTRPCQueryOptions<TQueryFnData, TData, TRPCClientErrorLike<TConfig>, inferTransformedProcedureOutput<TConfig, TProcedure>>): DefinedUseTRPCQueryResult<TData, TRPCClientErrorLike<TConfig>>;
+    <TQueryFnData extends inferTransformedProcedureOutput<TConfig, TProcedure> = inferTransformedProcedureOutput<TConfig, TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts?: UseTRPCQueryOptions<TQueryFnData, TData, TRPCClientErrorLike<TConfig>, inferTransformedProcedureOutput<TConfig, TProcedure>>): UseTRPCQueryResult<TData, TRPCClientErrorLike<TConfig>>;
 }
 /**
- * @internal
+ * @remark `void` is here due to https://github.com/trpc/trpc/pull/4374
  */
-export type DecorateProcedure<TProcedure extends AnyProcedure, _TFlags, TPath extends string> = TProcedure extends AnyQueryProcedure ? (inferProcedureInput<TProcedure> extends {
+type CursorInput = {
     cursor?: any;
-} | void ? {
+} | void;
+/**
+ * @internal
+ */
+export type MaybeDecoratedInfiniteQuery<TProcedure extends AnyProcedure, TConfig extends AnyRootConfig> = inferProcedureInput<TProcedure> extends CursorInput ? {
     /**
      * @see https://trpc.io/docs/client/react/suspense#useinfinitesuspensequery
      */
-    useInfiniteQuery: (input: Omit<inferProcedureInput<TProcedure>, 'cursor'>, opts?: UseTRPCInfiniteQueryOptions<TPath, inferProcedureInput<TProcedure>, inferTransformedProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>>) => UseTRPCInfiniteQueryResult<inferTransformedProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>>;
+    useInfiniteQuery: (input: Omit<inferProcedureInput<TProcedure>, 'cursor'>, opts: UseTRPCInfiniteQueryOptions<inferProcedureInput<TProcedure>, inferTransformedProcedureOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>>) => UseTRPCInfiniteQueryResult<inferTransformedProcedureOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>, inferProcedureInput<TProcedure>>;
     /**
      * @see https://trpc.io/docs/client/react/suspense
      */
-    useSuspenseInfiniteQuery: (input: Omit<inferProcedureInput<TProcedure>, 'cursor'>, opts?: Omit<UseTRPCInfiniteQueryOptions<TPath, inferProcedureInput<TProcedure>, inferTransformedProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>>, 'enabled' | 'suspense'>) => [
-        InfiniteData<inferTransformedProcedureOutput<TProcedure>>,
-        UseTRPCInfiniteQuerySuccessResult<inferTransformedProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>>
-    ];
-} : object) & {
-    /**
-     * Method to extract the query key for a procedure
-     * @param type - defaults to `any`
-     * @see https://trpc.io/docs/client/react/getQueryKey
-     * @deprecated - import `getQueryKey` from `@trpc/react-query` instead
-     */
-    getQueryKey: (input: inferProcedureInput<TProcedure>, type?: QueryType) => QueryKey;
+    useSuspenseInfiniteQuery: (input: Omit<inferProcedureInput<TProcedure>, 'cursor'>, opts: UseTRPCSuspenseInfiniteQueryOptions<inferProcedureInput<TProcedure>, inferTransformedProcedureOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>>) => UseTRPCSuspenseInfiniteQueryResult<inferTransformedProcedureOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>, inferProcedureInput<TProcedure>>;
+} : object;
+/**
+ * @internal
+ */
+export type DecoratedQueryMethods<TConfig extends AnyRootConfig, TProcedure extends AnyProcedure> = {
     /**
      * @see https://trpc.io/docs/client/react/useQuery
      */
-    useQuery: ProcedureUseQuery<TProcedure, TPath>;
+    useQuery: ProcedureUseQuery<TConfig, TProcedure>;
     /**
      * @see https://trpc.io/docs/client/react/suspense#usesuspensequery
      */
-    useSuspenseQuery: <TQueryFnData extends inferTransformedProcedureOutput<TProcedure> = inferTransformedProcedureOutput<TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts?: Omit<UseTRPCQueryOptions<TPath, inferProcedureInput<TProcedure>, TQueryFnData, TData, TRPCClientErrorLike<TProcedure>>, 'enabled' | 'suspense'>) => [
-        TData,
-        UseTRPCQuerySuccessResult<TData, TRPCClientErrorLike<TProcedure>>
-    ];
-} : TProcedure extends AnyMutationProcedure ? {
+    useSuspenseQuery: <TQueryFnData extends inferTransformedProcedureOutput<TConfig, TProcedure> = inferTransformedProcedureOutput<TConfig, TProcedure>, TData = TQueryFnData>(input: inferProcedureInput<TProcedure>, opts?: UseTRPCSuspenseQueryOptions<TQueryFnData, TData, TRPCClientErrorLike<TConfig>>) => UseTRPCSuspenseQueryResult<TData, TRPCClientErrorLike<TConfig>>;
+};
+/**
+ * @internal
+ */
+export type DecoratedQuery<TConfig extends AnyRootConfig, TProcedure extends AnyProcedure> = MaybeDecoratedInfiniteQuery<TProcedure, TConfig> & DecoratedQueryMethods<TConfig, TProcedure>;
+/**
+ * @internal
+ */
+export interface DecoratedMutation<TConfig extends AnyRootConfig, TProcedure extends AnyProcedure> {
     /**
      * @see https://trpc.io/docs/client/react/useMutation
      */
-    useMutation: <TContext = unknown>(opts?: UseTRPCMutationOptions<inferProcedureInput<TProcedure>, TRPCClientErrorLike<TProcedure>, inferTransformedProcedureOutput<TProcedure>, TContext>) => UseTRPCMutationResult<inferTransformedProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>, inferProcedureInput<TProcedure>, TContext>;
-} : TProcedure extends AnySubscriptionProcedure ? {
+    useMutation: <TContext = unknown>(opts?: UseTRPCMutationOptions<inferProcedureInput<TProcedure>, TRPCClientErrorLike<TConfig>, inferTransformedProcedureOutput<TConfig, TProcedure>, TContext>) => UseTRPCMutationResult<inferTransformedProcedureOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>, inferProcedureInput<TProcedure>, TContext>;
+}
+/**
+ * @internal
+ */
+export type DecorateProcedure<TConfig extends AnyRootConfig, TProcedure extends AnyProcedure, _TFlags> = TProcedure extends AnyQueryProcedure ? DecoratedQuery<TConfig, TProcedure> : TProcedure extends AnyMutationProcedure ? DecoratedMutation<TConfig, TProcedure> : TProcedure extends AnySubscriptionProcedure ? {
     /**
      * @see https://trpc.io/docs/subscriptions
      */
-    useSubscription: (input: inferProcedureInput<TProcedure>, opts?: UseTRPCSubscriptionOptions<inferTransformedSubscriptionOutput<TProcedure>, TRPCClientErrorLike<TProcedure>>) => void;
+    useSubscription: (input: inferProcedureInput<TProcedure>, opts?: UseTRPCSubscriptionOptions<inferTransformedSubscriptionOutput<TConfig, TProcedure>, TRPCClientErrorLike<TConfig>>) => void;
 } : never;
 /**
  * @internal
  */
-export type DecoratedProcedureRecord<TProcedures extends ProcedureRouterRecord, TFlags, TPath extends string = ''> = {
-    [TKey in keyof TProcedures]: TProcedures[TKey] extends AnyRouter ? DecoratedProcedureRecord<TProcedures[TKey]['_def']['record'], TFlags, `${TPath}${TKey & string}.`> & {
-        /**
-         * @deprecated - import `getQueryKey` from `@trpc/react-query` instead
-         */
-        getQueryKey: () => QueryKey;
-    } : TProcedures[TKey] extends AnyProcedure ? DecorateProcedure<TProcedures[TKey], TFlags, `${TPath}${TKey & string}`> : never;
+export type DecoratedProcedureRecord<TConfig extends AnyRootConfig, TProcedures extends ProcedureRouterRecord, TFlags> = {
+    [TKey in keyof TProcedures]: TProcedures[TKey] extends AnyRouter ? DecoratedProcedureRecord<TConfig, TProcedures[TKey]['_def']['record'], TFlags> : TProcedures[TKey] extends AnyProcedure ? DecorateProcedure<TConfig, TProcedures[TKey], TFlags> : never;
 };
 /**
  * @internal
@@ -82,20 +82,21 @@ export type CreateTRPCReactBase<TRouter extends AnyRouter, TSSRContext> = {
      *
      * @see https://trpc.io/docs/client/react/useUtils
      */
-    useContext(): CreateReactUtilsProxy<TRouter, TSSRContext>;
+    useContext(): CreateReactUtils<TRouter, TSSRContext>;
     /**
      * @see https://trpc.io/docs/client/react/useUtils
      */
-    useUtils(): CreateReactUtilsProxy<TRouter, TSSRContext>;
+    useUtils(): CreateReactUtils<TRouter, TSSRContext>;
     Provider: TRPCProvider<TRouter, TSSRContext>;
     createClient: CreateClient<TRouter>;
     useQueries: TRPCUseQueries<TRouter>;
     useDehydratedState: UseDehydratedState<TRouter>;
 };
-export type CreateTRPCReact<TRouter extends AnyRouter, TSSRContext, TFlags> = ProtectedIntersection<CreateTRPCReactBase<TRouter, TSSRContext>, DecoratedProcedureRecord<TRouter['_def']['record'], TFlags>>;
+export type CreateTRPCReact<TRouter extends AnyRouter, TSSRContext, TFlags> = ProtectedIntersection<CreateTRPCReactBase<TRouter, TSSRContext>, DecoratedProcedureRecord<TRouter['_def']['_config'], TRouter['_def']['record'], TFlags>>;
 /**
  * @internal
  */
-export declare function createHooksInternalProxy<TRouter extends AnyRouter, TSSRContext = unknown, TFlags = null>(trpc: CreateReactQueryHooks<TRouter, TSSRContext>): ProtectedIntersection<CreateTRPCReactBase<TRouter, TSSRContext>, DecoratedProcedureRecord<TRouter["_def"]["record"], TFlags, "">>;
+export declare function createHooksInternal<TRouter extends AnyRouter, TSSRContext = unknown, TFlags = null>(trpc: CreateReactQueryHooks<TRouter, TSSRContext>): ProtectedIntersection<CreateTRPCReactBase<TRouter, TSSRContext>, DecoratedProcedureRecord<TRouter["_def"]["_config"], TRouter["_def"]["record"], TFlags>>;
 export declare function createTRPCReact<TRouter extends AnyRouter, TSSRContext = unknown, TFlags = null>(opts?: CreateTRPCReactOptions<TRouter>): CreateTRPCReact<TRouter, TSSRContext, TFlags>;
+export {};
 //# sourceMappingURL=createTRPCReact.d.ts.map