UNPKG

@trpc/tanstack-react-query

Version:

TanStack React Query Integration for tRPC

851 lines • 43.8 kB
import * as React from "react"; import { TRPCClient, TRPCClientErrorLike, TRPCRequestOptions, TRPCUntypedClient } from "@trpc/client"; import { AnyTRPCProcedure, AnyTRPCRootTypes, AnyTRPCRouter, TRPCProcedureType, TRPCRouterRecord, inferProcedureErrorShape, inferProcedureInput, inferRouterContext, inferTransformedProcedureOutput } from "@trpc/server"; import { DataTag, DefinedInitialDataInfiniteOptions, DefinedInitialDataOptions, FetchQueryOptions, GetNextPageParamFunction, InfiniteData, QueryClient, QueryFilters, SkipToken, UndefinedInitialDataInfiniteOptions, UndefinedInitialDataOptions, UnusedSkipTokenInfiniteOptions, UnusedSkipTokenOptions, UseMutationOptions } from "@tanstack/react-query"; import { DistributiveOmit, MaybePromise, coerceAsyncIterableToArray, inferAsyncIterableYield } from "@trpc/server/unstable-core-do-not-import"; import { TRPCConnectionState } from "@trpc/client/unstable-internals"; import { Unsubscribable } from "@trpc/server/observable"; //#region src/internals/types.d.ts /** * Turn a set of optional properties into required * @internal */ type WithRequired<TObj, TKey extends keyof TObj> = TObj & { [P in TKey]-?: TObj[P]; }; /** * @internal */ type ResolverDef = { input: any; output: any; transformer: boolean; errorShape: any; featureFlags: FeatureFlags; }; /** * @remark `void` is here due to https://github.com/trpc/trpc/pull/4374 */ type CursorInput = { cursor?: any; }; /** * An input that may have a `cursor`, as used by infinite queries. */ type OptionalCursorInput = CursorInput | void; /** * @internal */ type ExtractCursorType<TInput> = TInput extends CursorInput ? TInput['cursor'] : unknown; /** * @internal */ type TRPCInfiniteData<TInput, TOutput> = InfiniteData<TOutput, NonNullable<ExtractCursorType<TInput>> | null>; /** * tRPC options for a single query or mutation, passed as `trpc`. * @public */ interface TRPCReactRequestOptions extends Omit<TRPCRequestOptions, 'signal'> { /** * Opt out of SSR for this query by passing `ssr: false` */ ssr?: boolean; /** * Opt out or into aborting request on unmount */ abortOnUnmount?: boolean; } /** * Adds the `trpc` option to TanStack Query options. * @public */ interface TRPCQueryBaseOptions { /** * tRPC-related options */ trpc?: TRPCReactRequestOptions; } /** * Extra fields that tRPC adds to the options it returns. * @public */ interface TRPCQueryOptionsResult { /** * tRPC details about the options, such as the procedure path. */ trpc: { /** * The dot-separated procedure path, such as `post.byId`. */ path: string; }; } /** * The kind of query a key matches. `any` matches both. * @public */ type QueryType = 'any' | 'infinite' | 'query'; /** * A tRPC query key: the procedure path, then the input and query type. * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryKey * @public */ type TRPCQueryKeyWithoutPrefix = [path: string[], opts?: { input?: unknown; type?: Exclude<QueryType, 'any'>; }]; /** * A tRPC query key that starts with a key prefix. * @see https://trpc.io/docs/client/tanstack-react-query/usage#keyPrefix * @public */ type TRPCQueryKeyWithPrefix = [prefix: string[], ...TRPCQueryKeyWithoutPrefix]; /** * A tRPC query key, with a prefix if `TPrefixEnabled` is `true`. * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryKey */ type TRPCQueryKey<TPrefixEnabled extends boolean = false> = TPrefixEnabled extends true ? TRPCQueryKeyWithPrefix : TRPCQueryKeyWithoutPrefix; /** * Any tRPC query key, with or without a prefix. */ type AnyTRPCQueryKey = TRPCQueryKeyWithoutPrefix | TRPCQueryKeyWithPrefix; /** * A tRPC mutation key that starts with a key prefix. * @see https://trpc.io/docs/client/tanstack-react-query/usage#keyPrefix * @public */ type TRPCMutationKeyWithPrefix = [prefix: string[], ...TRPCMutationKeyWithoutPrefix]; /** * A tRPC mutation key: the procedure path. * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationKey * @public */ type TRPCMutationKeyWithoutPrefix = [path: string[]]; /** * Any tRPC mutation key, with or without a prefix. */ type AnyTRPCMutationKey = TRPCMutationKeyWithoutPrefix | TRPCMutationKeyWithPrefix; /** * A tRPC mutation key, with a prefix if `TPrefixEnabled` is `true`. * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationKey * @public */ type TRPCMutationKey<TPrefixEnabled extends boolean = false> = TPrefixEnabled extends true ? TRPCMutationKeyWithPrefix : TRPCMutationKeyWithoutPrefix; /** * Feature flags for configuring tRPC behavior * @public */ type FeatureFlags = { /** * Whether query and mutation keys start with a prefix. * @see https://trpc.io/docs/client/tanstack-react-query/usage#keyPrefix */ keyPrefix: boolean; }; /** * @internal */ type ofFeatureFlags<T extends FeatureFlags> = T; /** * @internal */ type KeyPrefixOptions<TFeatureFlags extends FeatureFlags> = TFeatureFlags['keyPrefix'] extends true ? { keyPrefix: string; } : { /** * In order to use a query key prefix, you have to initialize the context with the `keyPrefix` */ keyPrefix?: never; }; /** * Default feature flags with query key prefix disabled * @public */ type DefaultFeatureFlags = ofFeatureFlags<{ /** * Query and mutation keys have no prefix. */ keyPrefix: false; }>; //#endregion //#region src/internals/infiniteQueryOptions.d.ts type ReservedOptions$2 = 'queryKey' | 'queryFn' | 'queryHashFn' | 'queryHash' | 'initialPageParam'; interface UndefinedTRPCInfiniteQueryOptionsIn<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, ReservedOptions$2>, TRPCQueryBaseOptions { initialCursor?: NonNullable<ExtractCursorType<TInput>> | null; } interface UndefinedTRPCInfiniteQueryOptionsOut<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UndefinedInitialDataInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, 'initialPageParam'>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, TRPCInfiniteData<TInput, TData>, TError>; initialPageParam: NonNullable<ExtractCursorType<TInput>> | null; } interface DefinedTRPCInfiniteQueryOptionsIn<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, ReservedOptions$2>, TRPCQueryBaseOptions { initialCursor?: NonNullable<ExtractCursorType<TInput>> | null; } interface DefinedTRPCInfiniteQueryOptionsOut<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<DefinedInitialDataInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, 'initialPageParam'>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, TRPCInfiniteData<TInput, TData>, TError>; initialPageParam: NonNullable<ExtractCursorType<TInput>> | null; } interface UnusedSkipTokenTRPCInfiniteQueryOptionsIn<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UnusedSkipTokenInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, ReservedOptions$2>, TRPCQueryBaseOptions { initialCursor?: NonNullable<ExtractCursorType<TInput>> | null; } interface UnusedSkipTokenTRPCInfiniteQueryOptionsOut<TInput, TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UnusedSkipTokenInfiniteOptions<TQueryFnData, TError, TRPCInfiniteData<TInput, TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>, NonNullable<ExtractCursorType<TInput>> | null>, 'initialPageParam'>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, TRPCInfiniteData<TInput, TData>, TError>; initialPageParam: NonNullable<ExtractCursorType<TInput>> | null; } /** * The `infiniteQueryOptions` helper on a query procedure. Returns options for `useInfiniteQuery`, `prefetchInfiniteQuery` and so on. * @see https://trpc.io/docs/client/tanstack-react-query/usage#infiniteQueryOptions */ interface TRPCInfiniteQueryOptions<TDef extends ResolverDef> { <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'] | SkipToken, opts: DefinedTRPCInfiniteQueryOptionsIn<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>): DefinedTRPCInfiniteQueryOptionsOut<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>; <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'], opts: UnusedSkipTokenTRPCInfiniteQueryOptionsIn<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>): UnusedSkipTokenTRPCInfiniteQueryOptionsOut<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>; <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'] | SkipToken, opts: UndefinedTRPCInfiniteQueryOptionsIn<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>): UndefinedTRPCInfiniteQueryOptionsOut<TDef['input'], TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TDef['featureFlags']>; } //#endregion //#region src/internals/queryOptions.d.ts type ReservedOptions$1 = 'queryKey' | 'queryFn' | 'queryHashFn' | 'queryHash'; interface UndefinedTRPCQueryOptionsIn<TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UndefinedInitialDataOptions<coerceAsyncIterableToArray<TQueryFnData>, TError, coerceAsyncIterableToArray<TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, ReservedOptions$1>, TRPCQueryBaseOptions {} interface UndefinedTRPCQueryOptionsOut<TQueryFnData, TOutput, TError, TFeatureFlags extends FeatureFlags> extends UndefinedInitialDataOptions<coerceAsyncIterableToArray<TQueryFnData>, TError, coerceAsyncIterableToArray<TOutput>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, coerceAsyncIterableToArray<TOutput>, TError>; } interface DefinedTRPCQueryOptionsIn<TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<DefinedInitialDataOptions<coerceAsyncIterableToArray<NoInfer<TQueryFnData>>, TError, coerceAsyncIterableToArray<TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, ReservedOptions$1>, TRPCQueryBaseOptions {} interface DefinedTRPCQueryOptionsOut<TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DefinedInitialDataOptions<coerceAsyncIterableToArray<TQueryFnData>, TError, coerceAsyncIterableToArray<TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, coerceAsyncIterableToArray<TData>, TError>; } interface UnusedSkipTokenTRPCQueryOptionsIn<TQueryFnData, TData, TError, TFeatureFlags extends FeatureFlags> extends DistributiveOmit<UnusedSkipTokenOptions<coerceAsyncIterableToArray<TQueryFnData>, TError, coerceAsyncIterableToArray<TData>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, ReservedOptions$1>, TRPCQueryBaseOptions {} interface UnusedSkipTokenTRPCQueryOptionsOut<TQueryFnData, TOutput, TError, TFeatureFlags extends FeatureFlags> extends UnusedSkipTokenOptions<coerceAsyncIterableToArray<TQueryFnData>, TError, coerceAsyncIterableToArray<TOutput>, TRPCQueryKey<TFeatureFlags['keyPrefix']>>, TRPCQueryOptionsResult { queryKey: DataTag<TRPCQueryKey<TFeatureFlags['keyPrefix']>, coerceAsyncIterableToArray<TOutput>, TError>; } /** * The `queryOptions` helper on a query procedure. Returns options for `useQuery`, `prefetchQuery` and so on. * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryOptions */ interface TRPCQueryOptions<TDef extends ResolverDef, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> { <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'] | SkipToken, opts: DefinedTRPCQueryOptionsIn<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>): DefinedTRPCQueryOptionsOut<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>; <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'], opts?: UnusedSkipTokenTRPCQueryOptionsIn<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>): UnusedSkipTokenTRPCQueryOptionsOut<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>; <TQueryFnData extends TDef['output'], TData = TQueryFnData>(input: TDef['input'] | SkipToken, opts?: UndefinedTRPCQueryOptionsIn<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>): UndefinedTRPCQueryOptionsOut<TQueryFnData, TData, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>, TFeatureFlags>; } //#endregion //#region src/internals/handles.d.ts declare const handleDef: unique symbol; type ErrorOf<TDef extends ResolverDef> = TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>; type InfiniteHandleInput<TInput> = TInput extends object ? Omit<TInput, 'cursor' | 'direction'> : TInput; /** * A plain tuple typed with the procedure's input. TanStack Router's serializability check * rejects `unknown` inputs and `DataTag`-ged keys, so handles in `beforeLoad` need this shape. */ type HandleQueryKey<TDef extends ResolverDef, TInput, TType extends 'query' | 'infinite'> = TDef['featureFlags']['keyPrefix'] extends true ? [prefix: string[], path: string[], opts?: { input?: TInput; type?: TType; }] : [path: string[], opts?: { input?: TInput; type?: TType; }]; /** * A serializable reference to a query started on the server (or in a loader). * Pass it to a client component and read it with `trpc.unstable_$fromHandle(handle)`. */ interface unstable_TRPCQueryHandle<TDef extends ResolverDef = ResolverDef> { /** * Type-only: never present at runtime. Required, so only the handle verbs * create handles. */ readonly [handleDef]: TDef & { kind: 'query'; }; readonly queryKey: HandleQueryKey<TDef, TDef['input'], 'query'>; /** The input the query was started with. The key is absent when the input is `undefined`. */ readonly input: TDef['input']; } /** * A serializable reference to an infinite query started on the server (or in a loader). * Read it with `trpc.unstable_$fromHandle(handle, { getNextPageParam })`. */ interface unstable_TRPCInfiniteQueryHandle<TDef extends ResolverDef = ResolverDef> { /** * Type-only: never present at runtime. Required, so only the handle verbs * create handles. */ readonly [handleDef]: TDef & { kind: 'infinite'; }; readonly queryKey: HandleQueryKey<TDef, InfiniteHandleInput<TDef['input']>, 'infinite'>; /** The input the query was started with, without `cursor` and `direction` */ readonly input: InfiniteHandleInput<TDef['input']>; readonly initialCursor?: NonNullable<ExtractCursorType<TDef['input']>> | null; } /** Any query or infinite query handle. */ type unstable_AnyTRPCHandle = unstable_TRPCQueryHandle<any> | unstable_TRPCInfiniteQueryHandle<any>; /** Options for starting a query that returns a handle */ interface unstable_TRPCPrefetchOptions extends Pick<FetchQueryOptions, 'staleTime' | 'retry' | 'retryDelay' | 'gcTime' | 'meta'>, TRPCQueryBaseOptions {} type HandleGetNextPageParam<TDef extends ResolverDef> = GetNextPageParamFunction<NonNullable<ExtractCursorType<TDef['input']>> | null, TDef['output']>; /** * Options for starting an infinite query that returns a handle. Pass * `pages` and `getNextPageParam` to load several pages up front. * @see https://trpc.io/docs/client/tanstack-react-query/handles#infinite-queries */ type unstable_TRPCPrefetchInfiniteOptions<TDef extends ResolverDef> = unstable_TRPCPrefetchOptions & { initialCursor?: NonNullable<ExtractCursorType<TDef['input']>> | null; } & ({ pages?: never; /** * Without it, refetching a cached query with more than one page * fails on the second page. */ getNextPageParam?: HandleGetNextPageParam<TDef>; } | { /** Number of pages to load up front */ pages: number; getNextPageParam: HandleGetNextPageParam<TDef>; }); /** Verbs added to query procedures */ interface DecorateQueryHandleVerbs<TDef extends ResolverDef> { /** * Start the query without waiting and return a serializable handle for it. * Never throws: errors surface where the handle is read. * * Same as `void queryClient.prefetchQuery(trpc.<path>.queryOptions(input, opts))`. * On `useTRPC()`, call it during render: like TanStack's `usePrefetchQuery`, it only * starts a query the cache has no state for. * @see https://trpc.io/docs/client/tanstack-react-query/handles */ unstable_$prefetch: (...args: undefined extends TDef['input'] ? [input?: TDef['input'], opts?: unstable_TRPCPrefetchOptions] : [input: TDef['input'], opts?: unstable_TRPCPrefetchOptions]) => unstable_TRPCQueryHandle<TDef>; /** * Start the query and wait until the cache has data for it, so a loader can hold * navigation until then. The handle carries no data: read it with `useSuspenseQuery` * to get data that's always defined. Rejects if that request fails. * * Same as `await queryClient.ensureQueryData({ ...trpc.<path>.queryOptions(input, opts), revalidateIfStale: true })`. * Not available on `useTRPC()`. * @see https://trpc.io/docs/client/tanstack-react-query/handles */ unstable_$ensure: (...args: undefined extends TDef['input'] ? [input?: TDef['input'], opts?: unstable_TRPCPrefetchOptions] : [input: TDef['input'], opts?: unstable_TRPCPrefetchOptions]) => Promise<unstable_TRPCQueryHandle<TDef>>; /** * Like `unstable_$ensure`, but stale data in the cache is refetched before it resolves. * Rejects if that request fails. * * Same as `await queryClient.fetchQuery(trpc.<path>.queryOptions(input, opts))`. * Not available on `useTRPC()`. * @see https://trpc.io/docs/client/tanstack-react-query/handles#fetch */ unstable_$fetch: (...args: undefined extends TDef['input'] ? [input?: TDef['input'], opts?: unstable_TRPCPrefetchOptions] : [input: TDef['input'], opts?: unstable_TRPCPrefetchOptions]) => Promise<unstable_TRPCQueryHandle<TDef>>; } /** Verbs added to query procedures with a `cursor` input */ interface DecorateInfiniteQueryHandleVerbs<TDef extends ResolverDef> { /** * Like `unstable_$prefetch`, for an infinite query. Loads the first page unless `pages` is set. * * Same as `void queryClient.prefetchInfiniteQuery(trpc.<path>.infiniteQueryOptions(input, opts))`. * On `useTRPC()`, call it during render, like `unstable_$prefetch`. * @see https://trpc.io/docs/client/tanstack-react-query/handles#infinite-queries */ unstable_$prefetchInfinite: (input: TDef['input'], opts?: unstable_TRPCPrefetchInfiniteOptions<TDef>) => unstable_TRPCInfiniteQueryHandle<TDef>; /** * Like `unstable_$ensure`, for an infinite query. * * Same as `await queryClient.ensureInfiniteQueryData({ ...trpc.<path>.infiniteQueryOptions(input, opts), revalidateIfStale: true })`. * Not available on `useTRPC()`. * @see https://trpc.io/docs/client/tanstack-react-query/handles#infinite-queries */ unstable_$ensureInfinite: (input: TDef['input'], opts?: unstable_TRPCPrefetchInfiniteOptions<TDef>) => Promise<unstable_TRPCInfiniteQueryHandle<TDef>>; /** * Like `unstable_$fetch`, for an infinite query. * * Same as `await queryClient.fetchInfiniteQuery(trpc.<path>.infiniteQueryOptions(input, opts))`. * Not available on `useTRPC()`. * @see https://trpc.io/docs/client/tanstack-react-query/handles#infinite-queries */ unstable_$fetchInfinite: (input: TDef['input'], opts?: unstable_TRPCPrefetchInfiniteOptions<TDef>) => Promise<unstable_TRPCInfiniteQueryHandle<TDef>>; } /** Readers added to every router level of the options proxy */ interface DecorateHandleReaders<TFeatureFlags extends FeatureFlags> { /** * Options for a handle: the same options `trpc.<path>.queryOptions(input)` or * `trpc.<path>.infiniteQueryOptions(input, opts)` return for the handle's procedure and input. * Pass them to `useQuery`, `useSuspenseQuery`, `useSuspenseInfiniteQuery`, etc. * @see https://trpc.io/docs/client/tanstack-react-query/handles#reading-a-handle */ unstable_$fromHandle: { <TDef extends ResolverDef, TData = TDef['output']>(handle: unstable_TRPCQueryHandle<TDef>, opts?: UnusedSkipTokenTRPCQueryOptionsIn<NoInfer<TDef['output']>, TData, ErrorOf<TDef>, TFeatureFlags>): UnusedSkipTokenTRPCQueryOptionsOut<TDef['output'], TData, ErrorOf<TDef>, TFeatureFlags>; <TDef extends ResolverDef, TData = TDef['output']>(handle: unstable_TRPCInfiniteQueryHandle<TDef>, opts: UnusedSkipTokenTRPCInfiniteQueryOptionsIn<TDef['input'], NoInfer<TDef['output']>, TData, ErrorOf<TDef>, TFeatureFlags>): UnusedSkipTokenTRPCInfiniteQueryOptionsOut<TDef['input'], TDef['output'], TData, ErrorOf<TDef>, TFeatureFlags>; }; } /** * The handle type a query procedure's `unstable_$prefetch()` returns, for * typing props. `unstable_$ensure()` and `unstable_$fetch()` resolve to the * same type. * @see https://trpc.io/docs/client/tanstack-react-query/handles#typing-props */ type unstable_inferQueryHandle<TProcedure extends DecorateQueryHandleVerbs<any>> = ReturnType<TProcedure['unstable_$prefetch']>; /** * The handle type an infinite query procedure's * `unstable_$prefetchInfinite()` returns, for typing props. * @see https://trpc.io/docs/client/tanstack-react-query/handles#typing-props */ type unstable_inferInfiniteQueryHandle<TProcedure extends DecorateInfiniteQueryHandleVerbs<any>> = ReturnType<TProcedure['unstable_$prefetchInfinite']>; //#endregion //#region src/internals/mutationOptions.d.ts type ReservedOptions = 'mutationKey' | 'mutationFn'; type TRPCMutationOptionsIn<TInput, TError, TOutput, TContext, TFeatureFlags extends FeatureFlags> = DistributiveOmit<UseMutationOptions<TOutput, TError, TInput, TContext>, ReservedOptions> & TRPCQueryBaseOptions & KeyPrefixOptions<TFeatureFlags>; interface TRPCMutationOptionsOut<TInput, TError, TOutput, TContext, TFeatureFlags extends FeatureFlags> extends UseMutationOptions<TOutput, TError, TInput, TContext>, TRPCQueryOptionsResult { mutationKey: TRPCMutationKey<TFeatureFlags['keyPrefix']>; } /** * The `mutationOptions` helper on a mutation procedure. Returns options for `useMutation`. * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationOptions */ interface TRPCMutationOptions<TDef extends ResolverDef, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> { <TContext = unknown>(opts?: TRPCMutationOptionsIn<TDef['input'], TRPCClientErrorLike<TDef>, TDef['output'], TContext, TFeatureFlags>): TRPCMutationOptionsOut<TDef['input'], TRPCClientErrorLike<TDef>, TDef['output'], TContext, TFeatureFlags>; } /** * @internal */ interface MutationOptionsOverride { onSuccess: (opts: { /** * Calls the original function that was defined in the query's `onSuccess` option */ originalFn: () => MaybePromise<unknown>; queryClient: QueryClient; /** * Meta data passed in from the `useMutation()` hook */ meta: Record<string, unknown>; }) => MaybePromise<unknown>; } //#endregion //#region src/internals/subscriptionOptions.d.ts interface BaseTRPCSubscriptionOptionsIn<TOutput, TError> { enabled?: boolean; onStarted?: () => void; onData?: (data: inferAsyncIterableYield<TOutput>) => void; onError?: (err: TError) => void; onStopped?: () => void; /** * Called when the subscription is completed on the server. * The status will transition to `'idle'` with `data: undefined`. */ onComplete?: () => void; onConnectionStateChange?: (state: TRPCConnectionState<TError>) => void; } interface UnusedSkipTokenTRPCSubscriptionOptionsIn<TOutput, TError> { onStarted?: () => void; onData?: (data: inferAsyncIterableYield<TOutput>) => void; onError?: (err: TError) => void; onStopped?: () => void; /** * Called when the subscription is completed on the server. * The status will transition to `'idle'` with `data: undefined`. */ onComplete?: () => void; onConnectionStateChange?: (state: TRPCConnectionState<TError>) => void; } interface TRPCSubscriptionOptionsOut<TOutput, TError, TFeatureFlags extends FeatureFlags> extends UnusedSkipTokenTRPCSubscriptionOptionsIn<TOutput, TError>, TRPCQueryOptionsResult { enabled: boolean; queryKey: TRPCQueryKey<TFeatureFlags['keyPrefix']>; subscribe: (innerOpts: UnusedSkipTokenTRPCSubscriptionOptionsIn<TOutput, TError>) => Unsubscribable; } /** * The `subscriptionOptions` helper on a subscription procedure. Returns options for {@link useSubscription}. * @see https://trpc.io/docs/client/tanstack-react-query/usage#subscriptionOptions */ interface TRPCSubscriptionOptions<TDef extends ResolverDef, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> { (input: TDef['input'], opts?: UnusedSkipTokenTRPCSubscriptionOptionsIn<inferAsyncIterableYield<TDef['output']>, TRPCClientErrorLike<TDef>>): TRPCSubscriptionOptionsOut<inferAsyncIterableYield<TDef['output']>, TRPCClientErrorLike<TDef>, TFeatureFlags>; (input: TDef['input'] | SkipToken, opts?: BaseTRPCSubscriptionOptionsIn<inferAsyncIterableYield<TDef['output']>, TRPCClientErrorLike<TDef>>): TRPCSubscriptionOptionsOut<inferAsyncIterableYield<TDef['output']>, TRPCClientErrorLike<TDef>, TFeatureFlags>; } /** * The status of a subscription. */ type TRPCSubscriptionStatus = 'idle' | 'connecting' | 'pending' | 'error'; /** * Fields shared by every {@link useSubscription} result. */ interface TRPCSubscriptionBaseResult<TOutput, TError> { /** * Where the subscription is in its lifecycle. */ status: TRPCSubscriptionStatus; /** * The last data received. */ data: undefined | TOutput; /** * The last error, if any. */ error: null | TError; /** * Reset the subscription */ reset: () => void; } /** * Result while the subscription is not running. */ interface TRPCSubscriptionIdleResult<TOutput> extends TRPCSubscriptionBaseResult<TOutput, null> { status: 'idle'; data: undefined; error: null; } /** * Result while connecting or reconnecting. */ interface TRPCSubscriptionConnectingResult<TOutput, TError> extends TRPCSubscriptionBaseResult<TOutput, TError> { status: 'connecting'; data: undefined | TOutput; error: TError | null; } /** * Result while connected and waiting for data. */ interface TRPCSubscriptionPendingResult<TOutput> extends TRPCSubscriptionBaseResult<TOutput, undefined> { status: 'pending'; data: TOutput | undefined; error: null; } /** * Result after an error that stopped the subscription. */ interface TRPCSubscriptionErrorResult<TOutput, TError> extends TRPCSubscriptionBaseResult<TOutput, TError> { status: 'error'; data: TOutput | undefined; error: TError; } /** * The result of {@link useSubscription}. Check `status` to narrow it. */ type TRPCSubscriptionResult<TOutput, TError> = TRPCSubscriptionIdleResult<TOutput> | TRPCSubscriptionConnectingResult<TOutput, TError> | TRPCSubscriptionErrorResult<TOutput, TError> | TRPCSubscriptionPendingResult<TOutput>; /** * Runs a subscription while the component is mounted. * * @example * ```ts * const trpc = useTRPC(); * const sub = useSubscription( * trpc.chat.onMessage.subscriptionOptions({ roomId }), * ); * ``` * * @see https://trpc.io/docs/client/tanstack-react-query/usage#subscriptionOptions */ declare function useSubscription<TOutput, TError>(opts: TRPCSubscriptionOptionsOut<TOutput, TError, any>): TRPCSubscriptionResult<TOutput, TError>; //#endregion //#region src/internals/createOptionsProxy.d.ts /** * Key and filter helpers for a router path. */ interface DecorateRouterKeyable<TFeatureFlags extends FeatureFlags> { /** * Calculate the TanStack Query Key for any path, could be used to invalidate every procedure beneath this path * * @see https://tanstack.com/query/latest/docs/framework/react/guides/query-keys * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryKey */ pathKey: () => TRPCQueryKey<TFeatureFlags['keyPrefix']>; /** * Calculate a TanStack Query Filter for any path, could be used to manipulate every procedure beneath this path * * @see https://tanstack.com/query/latest/docs/framework/react/guides/filters * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryFilter */ pathFilter: (filters?: QueryFilters<TRPCQueryKey<TFeatureFlags['keyPrefix']>>) => WithRequired<QueryFilters<TRPCQueryKey<TFeatureFlags['keyPrefix']>>, 'queryKey'>; } interface TypeHelper<TDef extends ResolverDef> { /** * @internal prefer using inferInput and inferOutput to access types */ '~types': { input: TDef['input']; output: TDef['output']; errorShape: TDef['errorShape']; }; } /** * The input type of a procedure on the options proxy. * @see https://trpc.io/docs/client/tanstack-react-query/usage#inferring-input-and-output-types */ type inferInput<TProcedure extends DecorateInfiniteQueryProcedure<any> | DecorateQueryProcedure<any> | DecorateMutationProcedure<any>> = TProcedure['~types']['input']; /** * The output type of a procedure on the options proxy. * @see https://trpc.io/docs/client/tanstack-react-query/usage#inferring-input-and-output-types */ type inferOutput<TProcedure extends DecorateInfiniteQueryProcedure<any> | DecorateQueryProcedure<any> | DecorateMutationProcedure<any>> = TProcedure['~types']['output']; /** * The helpers for a query procedure whose input has a `cursor`. * @see https://trpc.io/docs/client/tanstack-react-query/usage#infiniteQueryOptions */ interface DecorateInfiniteQueryProcedure<TDef extends ResolverDef> extends TypeHelper<TDef>, DecorateInfiniteQueryHandleVerbs<TDef> { /** * Create a set of type-safe infinite query options that can be passed to `useInfiniteQuery`, `prefetchInfiniteQuery` etc. * * @see https://tanstack.com/query/latest/docs/framework/react/reference/infiniteQueryOptions#infinitequeryoptions * @see https://trpc.io/docs/client/tanstack-react-query/usage#infiniteQueryOptions */ infiniteQueryOptions: TRPCInfiniteQueryOptions<TDef>; /** * Calculate the TanStack Query Key for a Infinite Query Procedure * * @see https://tanstack.com/query/latest/docs/framework/react/guides/query-keys * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryKey */ infiniteQueryKey: (input?: Partial<TDef['input']>) => DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TRPCInfiniteData<TDef['input'], TDef['output']>, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>; /** * Calculate a TanStack Query Filter for a Infinite Query Procedure * * @see https://tanstack.com/query/latest/docs/framework/react/guides/filters * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryFilter */ infiniteQueryFilter: (input?: Partial<TDef['input']>, filters?: QueryFilters<DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TRPCInfiniteData<TDef['input'], TDef['output']>, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>>) => WithRequired<QueryFilters<DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TRPCInfiniteData<TDef['input'], TDef['output']>, TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>>, 'queryKey'>; } /** * The helpers for a query procedure. * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryOptions */ interface DecorateQueryProcedure<TDef extends ResolverDef> extends TypeHelper<TDef>, DecorateRouterKeyable<TDef['featureFlags']>, DecorateQueryHandleVerbs<TDef> { /** * Create a set of type-safe query options that can be passed to `useQuery`, `prefetchQuery` etc. * * @see https://tanstack.com/query/latest/docs/framework/react/reference/queryOptions#queryoptions * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryOptions */ queryOptions: TRPCQueryOptions<TDef>; /** * Calculate the TanStack Query Key for a Query Procedure * * @see https://tanstack.com/query/latest/docs/framework/react/guides/query-keys * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryKey */ queryKey: (input?: Partial<TDef['input']>) => DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TDef['output'], TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>; /** * Calculate a TanStack Query Filter for a Query Procedure * * @see https://tanstack.com/query/latest/docs/framework/react/guides/filters * @see https://trpc.io/docs/client/tanstack-react-query/usage#queryFilter */ queryFilter: (input?: Partial<TDef['input']>, filters?: QueryFilters<DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TDef['output'], TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>>) => WithRequired<QueryFilters<DataTag<TRPCQueryKey<TDef['featureFlags']['keyPrefix']>, TDef['output'], TRPCClientErrorLike<{ transformer: TDef['transformer']; errorShape: TDef['errorShape']; }>>>, 'queryKey'>; } /** * The helpers for a mutation procedure. * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationOptions */ interface DecorateMutationProcedure<TDef extends ResolverDef> extends TypeHelper<TDef> { /** * Create a set of type-safe mutation options that can be passed to `useMutation` * * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationOptions */ mutationOptions: TRPCMutationOptions<TDef>; /** * Calculate the TanStack Mutation Key for a Mutation Procedure * * @see https://trpc.io/docs/client/tanstack-react-query/usage#mutationKey */ mutationKey: () => TRPCMutationKey<TDef['featureFlags']['keyPrefix']>; } /** * The helpers for a subscription procedure. * @see https://trpc.io/docs/client/tanstack-react-query/usage#subscriptionOptions */ interface DecorateSubscriptionProcedure<TDef extends ResolverDef> extends TypeHelper<TDef> { /** * Create a set of type-safe subscription options that can be passed to `useSubscription` * * @see https://trpc.io/docs/client/tanstack-react-query/usage#subscriptionOptions */ subscriptionOptions: TRPCSubscriptionOptions<TDef>; } /** * The helpers for a procedure of the given type. */ type DecorateProcedure<TType extends TRPCProcedureType, TDef extends ResolverDef> = TType extends 'query' ? DecorateQueryProcedure<TDef> & (TDef['input'] extends OptionalCursorInput ? DecorateInfiniteQueryProcedure<TDef> : Record<string, never>) : TType extends 'mutation' ? DecorateMutationProcedure<TDef> : TType extends 'subscription' ? DecorateSubscriptionProcedure<TDef> : never; /** * @internal */ type DecoratedRouterRecord<TRoot extends AnyTRPCRootTypes, TRecord extends TRPCRouterRecord, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> = { [TKey in keyof TRecord]: TRecord[TKey] extends (infer $Value) ? $Value extends TRPCRouterRecord ? DecoratedRouterRecord<TRoot, $Value, TFeatureFlags> & DecorateRouterKeyable<TFeatureFlags> & DecorateHandleReaders<TFeatureFlags> : $Value extends AnyTRPCProcedure ? DecorateProcedure<$Value['_def']['type'], { input: inferProcedureInput<$Value>; output: inferTransformedProcedureOutput<TRoot, $Value>; transformer: TRoot['transformer']; errorShape: inferProcedureErrorShape<TRoot, $Value>; featureFlags: TFeatureFlags; }> : never : never; }; /** * The object returned by `useTRPC()` and `createTRPCOptionsProxy`. It mirrors your router and has query, mutation and subscription option helpers on each procedure. * @see https://trpc.io/docs/client/tanstack-react-query/usage */ type TRPCOptionsProxy<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> = DecoratedRouterRecord<TRouter['_def']['_config']['$types'], TRouter['_def']['record'], TFeatureFlags> & DecorateRouterKeyable<TFeatureFlags> & DecorateHandleReaders<TFeatureFlags>; /** * Options shared by every {@link createTRPCOptionsProxy} call. */ type TRPCOptionsProxyOptionsBase<TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> = { /** * The `QueryClient`, or a function that returns it. */ queryClient: QueryClient | (() => QueryClient); /** * @internal */ overrides?: { mutations?: MutationOptionsOverride; }; } & KeyPrefixOptions<TFeatureFlags>; /** * Call procedures on a router directly, for example on the server. */ interface TRPCOptionsProxyOptionsInternal<TRouter extends AnyTRPCRouter> { /** * The router to call. */ router: TRouter; /** * The context for each call, or a function that returns it. */ ctx: inferRouterContext<TRouter> | (() => MaybePromise<inferRouterContext<TRouter>>); } /** * Call procedures through a tRPC client. */ interface TRPCOptionsProxyOptionsExternal<TRouter extends AnyTRPCRouter> { /** * The tRPC client to call procedures with. */ client: TRPCUntypedClient<TRouter> | TRPCClient<TRouter>; } /** * Options for {@link createTRPCOptionsProxy}. Pass either `client` or `router` and `ctx`. */ type TRPCOptionsProxyOptions<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> = TRPCOptionsProxyOptionsBase<TFeatureFlags> & (TRPCOptionsProxyOptionsInternal<TRouter> | TRPCOptionsProxyOptionsExternal<TRouter>); /** * Creates the options proxy without React context. Works on the server too. * * @example * ```ts * export const trpc = createTRPCOptionsProxy<AppRouter>({ * client: trpcClient, * queryClient, * }); * ``` * * @see https://trpc.io/docs/client/tanstack-react-query/setup#3c-set-up-without-react-context * @see https://trpc.io/docs/client/tanstack-react-query/server-components#5-create-a-trpc-caller-for-server-components */ declare function createTRPCOptionsProxy<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags>(opts: TRPCOptionsProxyOptions<TRouter, TFeatureFlags>): TRPCOptionsProxy<TRouter, TFeatureFlags>; //#endregion //#region src/internals/Context.d.ts type TRPCProviderType<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> = React.FC<{ children: React.ReactNode; queryClient: QueryClient; trpcClient: TRPCClient<TRouter>; } & KeyPrefixOptions<TFeatureFlags>>; /** * What {@link createTRPCContext} returns. */ interface CreateTRPCContextResult<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags> { /** * Provides the tRPC client and `QueryClient` to `useTRPC` and * `useTRPCClient`. */ TRPCProvider: TRPCProviderType<TRouter, TFeatureFlags>; /** * Returns the options proxy for your router. * @see https://trpc.io/docs/client/tanstack-react-query/usage */ useTRPC: () => TRPCOptionsProxy<TRouter, TFeatureFlags>; /** * Returns the tRPC client, for calling procedures directly. * @see https://trpc.io/docs/client/tanstack-react-query/usage#useTRPCClient */ useTRPCClient: () => TRPCClient<TRouter>; } /** * Creates a `TRPCProvider` and the `useTRPC` and `useTRPCClient` hooks for * your router. * * @example * ```ts * export const { TRPCProvider, useTRPC, useTRPCClient } = * createTRPCContext<AppRouter>(); * ``` * * @see https://trpc.io/docs/client/tanstack-react-query/setup#3a-set-up-the-trpc-context-provider */ declare function createTRPCContext<TRouter extends AnyTRPCRouter, TFeatureFlags extends FeatureFlags = DefaultFeatureFlags>(): CreateTRPCContextResult<TRouter, TFeatureFlags>; //#endregion //#region src/internals/HydrateClient.d.ts /** The props of the component `unstable_createHydrateClient` returns. */ interface unstable_HydrateClientProps { /** Rendered inside the hydration boundary. */ children?: React.ReactNode; } /** * Create a `HydrateClient` server component for the request's `QueryClient`. * It sends the queries started so far in this request to the browser, * pending ones as promises that stream in as they settle. A query an earlier * `HydrateClient` already sent is skipped, so nesting them is fine. * * React Server Components only: the package resolves to the server build * through the `react-server` export condition. * * @see https://trpc.io/docs/client/tanstack-react-query/handles#hydrate-client */ declare function unstable_createHydrateClient(_queryClient: QueryClient | (() => QueryClient)): React.FC<unstable_HydrateClientProps>; /** * `unstable_createHydrateClient` for the `react-server` export condition. * @internal */ declare function createHydrateClientReactServer(queryClient: QueryClient | (() => QueryClient)): React.FC<unstable_HydrateClientProps>; //#endregion export { TRPCQueryOptions as A, ResolverDef as B, unstable_AnyTRPCHandle as C, unstable_TRPCQueryHandle as D, unstable_TRPCPrefetchOptions as E, ExtractCursorType as F, TRPCQueryBaseOptions as G, TRPCMutationKey as H, FeatureFlags as I, TRPCQueryKeyWithoutPrefix as J, TRPCQueryKey as K, KeyPrefixOptions as L, AnyTRPCMutationKey as M, AnyTRPCQueryKey as N, unstable_inferInfiniteQueryHandle as O, DefaultFeatureFlags as P, ofFeatureFlags as Q, OptionalCursorInput as R, TRPCMutationOptions as S, unstable_TRPCPrefetchInfiniteOptions as T, TRPCMutationKeyWithPrefix as U, TRPCInfiniteData as V, TRPCMutationKeyWithoutPrefix as W, TRPCReactRequestOptions as X, TRPCQueryOptionsResult as Y, WithRequired as Z, TRPCSubscriptionOptions as _, DecorateMutationProcedure as a, TRPCSubscriptionStatus as b, DecorateRouterKeyable as c, createTRPCOptionsProxy as d, inferInput as f, TRPCSubscriptionIdleResult as g, TRPCSubscriptionErrorResult as h, createTRPCContext as i, TRPCInfiniteQueryOptions as j, unstable_inferQueryHandle as k, DecorateSubscriptionProcedure as l, TRPCSubscriptionConnectingResult as m, unstable_HydrateClientProps as n, DecorateProcedure as o, inferOutput as p, TRPCQueryKeyWithPrefix as q, unstable_createHydrateClient as r, DecorateQueryProcedure as s, createHydrateClientReactServer as t, TRPCOptionsProxy as u, TRPCSubscriptionPendingResult as v, unstable_TRPCInfiniteQueryHandle as w, useSubscription as x, TRPCSubscriptionResult as y, QueryType as z }; //# sourceMappingURL=index-DHoTA0ue.d.mts.map