@trpc/next 11.22.1 → 11.22.2-canary.11.4427f0bea

package/README.md

@@ -36,14 +36,6 @@ pnpm add @trpc/next @trpc/react-query @tanstack/react-query
 bun add @trpc/next @trpc/react-query @tanstack/react-query
 ```
 
-## AI Agents
-
-If you use an AI coding agent, install tRPC skills for better code generation:
-
-```bash
-npx @tanstack/intent@latest install
-```
-
 ## Basic Example
 
 Setup tRPC in `utils/trpc.ts`.

package/dist/index.d.cts

@@ -1,7 +1,7 @@
-import { a as WithTRPCSSROptions, i as WithTRPCNoSSROptions, n as TRPCPrepassProps, o as withTRPC, r as WithTRPCConfig, t as TRPCPrepassHelper } from "./withTRPC-DywCxFfq.cjs";
+import { a as WithTRPCSSROptions, i as WithTRPCNoSSROptions, n as TRPCPrepassProps, o as withTRPC, r as WithTRPCConfig, t as TRPCPrepassHelper } from "./withTRPC-Cr10aYRv.cjs";
 import { AnyRouter, ProtectedIntersection } from "@trpc/server/unstable-core-do-not-import";
 import { CreateReactUtils, DecorateRouterRecord, TRPCUseQueries, TRPCUseSuspenseQueries } from "@trpc/react-query/shared";
-import { NextPageContext } from "next/types";
+import { NextPageContext } from "next/types.js";
 //#region src/createTRPCNext.d.ts
 /**
  * @internal

package/dist/index.d.mts

@@ -1,7 +1,7 @@
-import { a as WithTRPCSSROptions, i as WithTRPCNoSSROptions, n as TRPCPrepassProps, o as withTRPC, r as WithTRPCConfig, t as TRPCPrepassHelper } from "./withTRPC-BchtyodQ.mjs";
+import { a as WithTRPCSSROptions, i as WithTRPCNoSSROptions, n as TRPCPrepassProps, o as withTRPC, r as WithTRPCConfig, t as TRPCPrepassHelper } from "./withTRPC-CxGgngCY.mjs";
 import { CreateReactUtils, DecorateRouterRecord, TRPCUseQueries, TRPCUseSuspenseQueries } from "@trpc/react-query/shared";
 import { AnyRouter, ProtectedIntersection } from "@trpc/server/unstable-core-do-not-import";
-import { NextPageContext } from "next/types";
+import { NextPageContext } from "next/types.js";
 //#region src/createTRPCNext.d.ts
 /**
  * @internal

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../src/withTRPC.tsx","../src/createTRPCNext.tsx"],"sourcesContent":["/**\n * Heavily based on urql's ssr\n * https://github.com/FormidableLabs/urql/blob/main/packages/next-urql/src/with-urql-client.ts\n */\nimport type { DehydratedState, QueryClient } from '@tanstack/react-query';\nimport { HydrationBoundary, QueryClientProvider } from '@tanstack/react-query';\nimport type {\n  CreateTRPCClientOptions,\n  TRPCClient,\n  TRPCClientError,\n  TRPCUntypedClient,\n} from '@trpc/client';\nimport type { CoercedTransformerParameters } from '@trpc/client/unstable-internals';\nimport {\n  getTransformer,\n  type TransformerOptions,\n} from '@trpc/client/unstable-internals';\nimport type {\n  CreateTRPCReactOptions,\n  CreateTRPCReactQueryClientConfig,\n} from '@trpc/react-query/shared';\nimport { createRootHooks, getQueryClient } from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  Dict,\n  inferClientTypes,\n  ResponseMeta,\n} from '@trpc/server/unstable-core-do-not-import';\nimport type {\n  AppContextType,\n  AppPropsType,\n  NextComponentType,\n  NextPageContext,\n} from 'next/dist/shared/lib/utils';\nimport type { NextRouter } from 'next/router';\nimport React, { useState } from 'react';\n\nexport type WithTRPCConfig<TRouter extends AnyRouter> =\n  CreateTRPCClientOptions<TRouter> &\n    CreateTRPCReactQueryClientConfig & {\n      abortOnUnmount?: boolean;\n    };\n\ntype WithTRPCOptions<TRouter extends AnyRouter> =\n  CreateTRPCReactOptions<TRouter> & {\n    config: (info: { ctx?: NextPageContext }) => WithTRPCConfig<TRouter>;\n  } & TransformerOptions<inferClientTypes<TRouter>>;\n\nexport type TRPCPrepassHelper = (opts: {\n  parent: WithTRPCSSROptions<AnyRouter>;\n  WithTRPC: NextComponentType<any, any, any>;\n  AppOrPage: NextComponentType<any, any, any>;\n}) => void;\nexport type WithTRPCSSROptions<TRouter extends AnyRouter> =\n  WithTRPCOptions<TRouter> & {\n    /**\n     * If you enable this, you also need to add a `ssrPrepass`-prop\n     * @see https://trpc.io/docs/client/nextjs/ssr\n     */\n    ssr:\n      true | ((opts: { ctx: NextPageContext }) => boolean | Promise<boolean>);\n    responseMeta?: (opts: {\n      ctx: NextPageContext;\n      clientErrors: TRPCClientError<TRouter>[];\n    }) => ResponseMeta;\n    /**\n     * use `import { ssrPrepass } from '@trpc/next/ssrPrepass'`\n     * @see https://trpc.io/docs/client/nextjs/ssr\n     */\n    ssrPrepass: TRPCPrepassHelper;\n  };\n\nexport type WithTRPCNoSSROptions<TRouter extends AnyRouter> =\n  WithTRPCOptions<TRouter> & {\n    ssr?: false;\n  };\n\nexport type TRPCPrepassProps<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n> = {\n  config: WithTRPCConfig<TRouter>;\n  queryClient: QueryClient;\n  trpcClient: TRPCUntypedClient<TRouter> | TRPCClient<TRouter>;\n  ssrState: 'prepass';\n  ssrContext: TSSRContext;\n};\n\nexport function withTRPC<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n>(opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>) {\n  const { config: getClientConfig } = opts;\n  const transformer = getTransformer(\n    (opts as CoercedTransformerParameters).transformer,\n  );\n\n  type $PrepassProps = TRPCPrepassProps<TRouter, TSSRContext>;\n  return (AppOrPage: NextComponentType<any, any, any>): NextComponentType => {\n    const trpc = createRootHooks<TRouter, TSSRContext>(opts);\n\n    const WithTRPC = (\n      props: AppPropsType<NextRouter, any> & {\n        trpc?: $PrepassProps;\n      },\n    ) => {\n      const [prepassProps] = useState(() => {\n        if (props.trpc) {\n          return props.trpc;\n        }\n\n        const config = getClientConfig({});\n        const queryClient = getQueryClient(config);\n        const trpcClient = trpc.createClient(config);\n\n        return {\n          abortOnUnmount: config.abortOnUnmount,\n          queryClient,\n          trpcClient,\n          ssrState: opts.ssr ? ('mounting' as const) : (false as const),\n          ssrContext: null,\n        };\n      });\n\n      const { queryClient, trpcClient, ssrState, ssrContext } = prepassProps;\n\n      // allow normal components to be wrapped, not just app/pages\n      const trpcState = props.pageProps?.trpcState;\n\n      const hydratedState: DehydratedState | undefined = React.useMemo(() => {\n        if (!trpcState) {\n          return trpcState;\n        }\n\n        return transformer.input.deserialize(trpcState);\n      }, [trpcState]);\n\n      return (\n        <trpc.Provider\n          abortOnUnmount={(prepassProps as any).abortOnUnmount ?? false}\n          client={trpcClient}\n          queryClient={queryClient}\n          ssrState={ssrState}\n          ssrContext={ssrContext}\n        >\n          <QueryClientProvider client={queryClient}>\n            <HydrationBoundary state={hydratedState}>\n              <AppOrPage {...props} />\n            </HydrationBoundary>\n          </QueryClientProvider>\n        </trpc.Provider>\n      );\n    };\n\n    if (opts.ssr) {\n      opts.ssrPrepass({\n        parent: opts,\n        AppOrPage,\n        WithTRPC,\n      });\n    } else if (AppOrPage.getInitialProps) {\n      // Allow combining `getServerSideProps` and `getInitialProps`\n\n      WithTRPC.getInitialProps = async (appOrPageCtx: AppContextType) => {\n        // Determine if we are wrapping an App component or a Page component.\n        const isApp = !!appOrPageCtx.Component;\n\n        // Run the wrapped component's getInitialProps function.\n        let pageProps: Dict<unknown> = {};\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const originalProps = await AppOrPage.getInitialProps!(\n          appOrPageCtx as any,\n        );\n        const originalPageProps = isApp\n          ? (originalProps.pageProps ?? {})\n          : originalProps;\n\n        pageProps = {\n          ...originalPageProps,\n          ...pageProps,\n        };\n        const getAppTreeProps = (props: Dict<unknown>) =>\n          isApp ? { pageProps: props } : props;\n\n        return getAppTreeProps(pageProps);\n      };\n    }\n\n    const displayName = AppOrPage.displayName ?? AppOrPage.name ?? 'Component';\n    WithTRPC.displayName = `withTRPC(${displayName})`;\n\n    return WithTRPC as any;\n  };\n}\n","/* istanbul ignore file -- @preserve */\n// We're testing this through E2E-testing\nimport type {\n  CreateReactUtils,\n  DecorateRouterRecord,\n  TRPCUseQueries,\n  TRPCUseSuspenseQueries,\n} from '@trpc/react-query/shared';\nimport {\n  createReactDecoration,\n  createReactQueryUtils,\n  createRootHooks,\n} from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  ProtectedIntersection,\n} from '@trpc/server/unstable-core-do-not-import';\nimport { createFlatProxy } from '@trpc/server/unstable-core-do-not-import';\nimport type { NextPageContext } from 'next/types';\nimport { useMemo } from 'react';\nimport type { WithTRPCNoSSROptions, WithTRPCSSROptions } from './withTRPC';\nimport { withTRPC } from './withTRPC';\n\n/**\n * @internal\n */\nexport interface CreateTRPCNextBase<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext,\n> {\n  /**\n   * @deprecated renamed to `useUtils` and will be removed in a future tRPC version\n   *\n   * @see https://trpc.io/docs/v11/client/react/useUtils\n   */\n  useContext(): CreateReactUtils<TRouter, TSSRContext>;\n  /**\n   * @see https://trpc.io/docs/v11/client/react/useUtils\n   */\n  useUtils(): CreateReactUtils<TRouter, TSSRContext>;\n  withTRPC: ReturnType<typeof withTRPC<TRouter, TSSRContext>>;\n  useQueries: TRPCUseQueries<TRouter>;\n  useSuspenseQueries: TRPCUseSuspenseQueries<TRouter>;\n}\n\n/**\n * @internal\n */\nexport type CreateTRPCNext<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext,\n> = ProtectedIntersection<\n  CreateTRPCNextBase<TRouter, TSSRContext>,\n  DecorateRouterRecord<\n    TRouter['_def']['_config']['$types'],\n    TRouter['_def']['record']\n  >\n>;\n\nexport function createTRPCNext<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n>(\n  opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>,\n): CreateTRPCNext<TRouter, TSSRContext> {\n  const hooks = createRootHooks<TRouter, TSSRContext>(opts);\n\n  // TODO: maybe set TSSRContext to `never` when using `WithTRPCNoSSROptions`\n  const _withTRPC = withTRPC(opts);\n\n  const proxy = createReactDecoration(hooks) as DecorateRouterRecord<\n    TRouter['_def']['_config']['$types'],\n    TRouter['_def']['record']\n  >;\n\n  return createFlatProxy((key) => {\n    if (key === 'useContext' || key === 'useUtils') {\n      return () => {\n        const context = hooks.useUtils();\n        // create a stable reference of the utils context\n        return useMemo(() => {\n          return (createReactQueryUtils as any)(context);\n        }, [context]);\n      };\n    }\n\n    if (key === 'useQueries') {\n      return hooks.useQueries;\n    }\n\n    if (key === 'useSuspenseQueries') {\n      return hooks.useSuspenseQueries;\n    }\n\n    if (key === 'withTRPC') {\n      return _withTRPC;\n    }\n\n    return proxy[key];\n  });\n}\n"],"mappings":";;;;;;;AAwFA,SAAgB,SAGd,MAAmE;CACnE,MAAM,EAAE,QAAQ,oBAAoB;CACpC,MAAM,cAAc,eACjB,KAAsC,WACzC;CAGA,QAAQ,cAAmE;;EACzE,MAAM,OAAO,gBAAsC,IAAI;EAEvD,MAAM,YACJ,UAGG;;GACH,MAAM,CAAC,gBAAgB,eAAe;IACpC,IAAI,MAAM,MACR,OAAO,MAAM;IAGf,MAAM,SAAS,gBAAgB,CAAC,CAAC;IACjC,MAAM,cAAc,eAAe,MAAM;IACzC,MAAM,aAAa,KAAK,aAAa,MAAM;IAE3C,OAAO;KACL,gBAAgB,OAAO;KACvB;KACA;KACA,UAAU,KAAK,MAAO,aAAwB;KAC9C,YAAY;IACd;GACF,CAAC;GAED,MAAM,EAAE,aAAa,YAAY,UAAU,eAAe;GAG1D,MAAM,aAAA,mBAAY,MAAM,eAAA,QAAA,qBAAA,KAAA,IAAA,KAAA,IAAA,iBAAW;GAEnC,MAAM,gBAA6C,MAAM,cAAc;IACrE,IAAI,CAAC,WACH,OAAO;IAGT,OAAO,YAAY,MAAM,YAAY,SAAS;GAChD,GAAG,CAAC,SAAS,CAAC;GAEd,OACE,sBAAA,cAAC,KAAK,UAAN;IACE,iBAAA,kBAAiB,aAAqB,oBAAA,QAAA,oBAAA,KAAA,IAAA,kBAAkB;IACxD,QAAQ;IACK;IACH;IACE;GAOC,GALb,sBAAA,cAAC,qBAAD,EAAqB,QAAQ,YAIR,GAHnB,sBAAA,cAAC,mBAAD,EAAmB,OAAO,cAEP,GADjB,sBAAA,cAAC,WAAc,KAAQ,CACN,CACA,CACR;EAEnB;EAEA,IAAI,KAAK,KACP,KAAK,WAAW;GACd,QAAQ;GACR;GACA;EACF,CAAC;OACI,IAAI,UAAU,iBAGnB,SAAS,kBAAkB,OAAO,iBAAiC;;GAEjE,MAAM,QAAQ,CAAC,CAAC,aAAa;GAG7B,IAAI,YAA2B,CAAC;GAEhC,MAAM,gBAAgB,MAAM,UAAU,gBACpC,YACF;GACA,MAAM,oBAAoB,SAAA,wBACrB,cAAc,eAAA,QAAA,0BAAA,KAAA,IAAA,wBAAa,CAAC,IAC7B;GAEJ,YAAA,eAAA,eAAA,CAAA,GACK,iBAAA,GACA,SACL;GACA,MAAM,mBAAmB,UACvB,QAAQ,EAAE,WAAW,MAAM,IAAI;GAEjC,OAAO,gBAAgB,SAAS;EAClC;EAIF,SAAS,cAAc,aAAA,QAAA,wBADH,UAAU,iBAAA,QAAA,0BAAA,KAAA,IAAA,wBAAe,UAAU,UAAA,QAAA,SAAA,KAAA,IAAA,OAAQ,YAChB;EAE/C,OAAO;CACT;AACF;;;;ACtIA,SAAgB,eAId,MACsC;CACtC,MAAM,QAAQ,gBAAsC,IAAI;CAGxD,MAAM,YAAY,SAAS,IAAI;CAE/B,MAAM,QAAQ,sBAAsB,KAAK;CAKzC,OAAO,iBAAiB,QAAQ;EAC9B,IAAI,QAAQ,gBAAgB,QAAQ,YAClC,aAAa;GACX,MAAM,UAAU,MAAM,SAAS;GAE/B,OAAO,cAAc;IACnB,OAAQ,sBAA8B,OAAO;GAC/C,GAAG,CAAC,OAAO,CAAC;EACd;EAGF,IAAI,QAAQ,cACV,OAAO,MAAM;EAGf,IAAI,QAAQ,sBACV,OAAO,MAAM;EAGf,IAAI,QAAQ,YACV,OAAO;EAGT,OAAO,MAAM;CACf,CAAC;AACH"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../src/withTRPC.tsx","../src/createTRPCNext.tsx"],"sourcesContent":["/**\n * Heavily based on urql's ssr\n * https://github.com/FormidableLabs/urql/blob/main/packages/next-urql/src/with-urql-client.ts\n */\nimport type { DehydratedState, QueryClient } from '@tanstack/react-query';\nimport { HydrationBoundary, QueryClientProvider } from '@tanstack/react-query';\nimport type {\n  CreateTRPCClientOptions,\n  TRPCClient,\n  TRPCClientError,\n  TRPCUntypedClient,\n} from '@trpc/client';\nimport type { CoercedTransformerParameters } from '@trpc/client/unstable-internals';\nimport {\n  getTransformer,\n  type TransformerOptions,\n} from '@trpc/client/unstable-internals';\nimport type {\n  CreateTRPCReactOptions,\n  CreateTRPCReactQueryClientConfig,\n} from '@trpc/react-query/shared';\nimport { createRootHooks, getQueryClient } from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  Dict,\n  inferClientTypes,\n  ResponseMeta,\n} from '@trpc/server/unstable-core-do-not-import';\nimport type {\n  AppContextType,\n  AppPropsType,\n  NextComponentType,\n  NextPageContext,\n} from 'next/dist/shared/lib/utils.js';\nimport type { NextRouter } from 'next/router';\nimport React, { useState } from 'react';\n\nexport type WithTRPCConfig<TRouter extends AnyRouter> =\n  CreateTRPCClientOptions<TRouter> &\n    CreateTRPCReactQueryClientConfig & {\n      abortOnUnmount?: boolean;\n    };\n\ntype WithTRPCOptions<TRouter extends AnyRouter> =\n  CreateTRPCReactOptions<TRouter> & {\n    config: (info: { ctx?: NextPageContext }) => WithTRPCConfig<TRouter>;\n  } & TransformerOptions<inferClientTypes<TRouter>>;\n\nexport type TRPCPrepassHelper = (opts: {\n  parent: WithTRPCSSROptions<AnyRouter>;\n  WithTRPC: NextComponentType<any, any, any>;\n  AppOrPage: NextComponentType<any, any, any>;\n}) => void;\nexport type WithTRPCSSROptions<TRouter extends AnyRouter> =\n  WithTRPCOptions<TRouter> & {\n    /**\n     * If you enable this, you also need to add a `ssrPrepass`-prop\n     * @see https://trpc.io/docs/client/nextjs/ssr\n     */\n    ssr:\n      true | ((opts: { ctx: NextPageContext }) => boolean | Promise<boolean>);\n    responseMeta?: (opts: {\n      ctx: NextPageContext;\n      clientErrors: TRPCClientError<TRouter>[];\n    }) => ResponseMeta;\n    /**\n     * use `import { ssrPrepass } from '@trpc/next/ssrPrepass'`\n     * @see https://trpc.io/docs/client/nextjs/ssr\n     */\n    ssrPrepass: TRPCPrepassHelper;\n  };\n\nexport type WithTRPCNoSSROptions<TRouter extends AnyRouter> =\n  WithTRPCOptions<TRouter> & {\n    ssr?: false;\n  };\n\nexport type TRPCPrepassProps<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n> = {\n  config: WithTRPCConfig<TRouter>;\n  queryClient: QueryClient;\n  trpcClient: TRPCUntypedClient<TRouter> | TRPCClient<TRouter>;\n  ssrState: 'prepass';\n  ssrContext: TSSRContext;\n};\n\nexport function withTRPC<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n>(opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>) {\n  const { config: getClientConfig } = opts;\n  const transformer = getTransformer(\n    (opts as CoercedTransformerParameters).transformer,\n  );\n\n  type $PrepassProps = TRPCPrepassProps<TRouter, TSSRContext>;\n  return (AppOrPage: NextComponentType<any, any, any>): NextComponentType => {\n    const trpc = createRootHooks<TRouter, TSSRContext>(opts);\n\n    const WithTRPC = (\n      props: AppPropsType<NextRouter, any> & {\n        trpc?: $PrepassProps;\n      },\n    ) => {\n      const [prepassProps] = useState(() => {\n        if (props.trpc) {\n          return props.trpc;\n        }\n\n        const config = getClientConfig({});\n        const queryClient = getQueryClient(config);\n        const trpcClient = trpc.createClient(config);\n\n        return {\n          abortOnUnmount: config.abortOnUnmount,\n          queryClient,\n          trpcClient,\n          ssrState: opts.ssr ? ('mounting' as const) : (false as const),\n          ssrContext: null,\n        };\n      });\n\n      const { queryClient, trpcClient, ssrState, ssrContext } = prepassProps;\n\n      // allow normal components to be wrapped, not just app/pages\n      const trpcState = props.pageProps?.trpcState;\n\n      const hydratedState: DehydratedState | undefined = React.useMemo(() => {\n        if (!trpcState) {\n          return trpcState;\n        }\n\n        return transformer.input.deserialize(trpcState);\n      }, [trpcState]);\n\n      return (\n        <trpc.Provider\n          abortOnUnmount={(prepassProps as any).abortOnUnmount ?? false}\n          client={trpcClient}\n          queryClient={queryClient}\n          ssrState={ssrState}\n          ssrContext={ssrContext}\n        >\n          <QueryClientProvider client={queryClient}>\n            <HydrationBoundary state={hydratedState}>\n              <AppOrPage {...props} />\n            </HydrationBoundary>\n          </QueryClientProvider>\n        </trpc.Provider>\n      );\n    };\n\n    if (opts.ssr) {\n      opts.ssrPrepass({\n        parent: opts,\n        AppOrPage,\n        WithTRPC,\n      });\n    } else if (AppOrPage.getInitialProps) {\n      // Allow combining `getServerSideProps` and `getInitialProps`\n\n      WithTRPC.getInitialProps = async (appOrPageCtx: AppContextType) => {\n        // Determine if we are wrapping an App component or a Page component.\n        const isApp = !!appOrPageCtx.Component;\n\n        // Run the wrapped component's getInitialProps function.\n        let pageProps: Dict<unknown> = {};\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        const originalProps = await AppOrPage.getInitialProps!(\n          appOrPageCtx as any,\n        );\n        const originalPageProps = isApp\n          ? (originalProps.pageProps ?? {})\n          : originalProps;\n\n        pageProps = {\n          ...originalPageProps,\n          ...pageProps,\n        };\n        const getAppTreeProps = (props: Dict<unknown>) =>\n          isApp ? { pageProps: props } : props;\n\n        return getAppTreeProps(pageProps);\n      };\n    }\n\n    const displayName = AppOrPage.displayName ?? AppOrPage.name ?? 'Component';\n    WithTRPC.displayName = `withTRPC(${displayName})`;\n\n    return WithTRPC as any;\n  };\n}\n","/* istanbul ignore file -- @preserve */\n// We're testing this through E2E-testing\nimport type {\n  CreateReactUtils,\n  DecorateRouterRecord,\n  TRPCUseQueries,\n  TRPCUseSuspenseQueries,\n} from '@trpc/react-query/shared';\nimport {\n  createReactDecoration,\n  createReactQueryUtils,\n  createRootHooks,\n} from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  ProtectedIntersection,\n} from '@trpc/server/unstable-core-do-not-import';\nimport { createFlatProxy } from '@trpc/server/unstable-core-do-not-import';\nimport type { NextPageContext } from 'next/types.js';\nimport { useMemo } from 'react';\nimport type { WithTRPCNoSSROptions, WithTRPCSSROptions } from './withTRPC';\nimport { withTRPC } from './withTRPC';\n\n/**\n * @internal\n */\nexport interface CreateTRPCNextBase<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext,\n> {\n  /**\n   * @deprecated renamed to `useUtils` and will be removed in a future tRPC version\n   *\n   * @see https://trpc.io/docs/v11/client/react/useUtils\n   */\n  useContext(): CreateReactUtils<TRouter, TSSRContext>;\n  /**\n   * @see https://trpc.io/docs/v11/client/react/useUtils\n   */\n  useUtils(): CreateReactUtils<TRouter, TSSRContext>;\n  withTRPC: ReturnType<typeof withTRPC<TRouter, TSSRContext>>;\n  useQueries: TRPCUseQueries<TRouter>;\n  useSuspenseQueries: TRPCUseSuspenseQueries<TRouter>;\n}\n\n/**\n * @internal\n */\nexport type CreateTRPCNext<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext,\n> = ProtectedIntersection<\n  CreateTRPCNextBase<TRouter, TSSRContext>,\n  DecorateRouterRecord<\n    TRouter['_def']['_config']['$types'],\n    TRouter['_def']['record']\n  >\n>;\n\nexport function createTRPCNext<\n  TRouter extends AnyRouter,\n  TSSRContext extends NextPageContext = NextPageContext,\n>(\n  opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>,\n): CreateTRPCNext<TRouter, TSSRContext> {\n  const hooks = createRootHooks<TRouter, TSSRContext>(opts);\n\n  // TODO: maybe set TSSRContext to `never` when using `WithTRPCNoSSROptions`\n  const _withTRPC = withTRPC(opts);\n\n  const proxy = createReactDecoration(hooks) as DecorateRouterRecord<\n    TRouter['_def']['_config']['$types'],\n    TRouter['_def']['record']\n  >;\n\n  return createFlatProxy((key) => {\n    if (key === 'useContext' || key === 'useUtils') {\n      return () => {\n        const context = hooks.useUtils();\n        // create a stable reference of the utils context\n        return useMemo(() => {\n          return (createReactQueryUtils as any)(context);\n        }, [context]);\n      };\n    }\n\n    if (key === 'useQueries') {\n      return hooks.useQueries;\n    }\n\n    if (key === 'useSuspenseQueries') {\n      return hooks.useSuspenseQueries;\n    }\n\n    if (key === 'withTRPC') {\n      return _withTRPC;\n    }\n\n    return proxy[key];\n  });\n}\n"],"mappings":";;;;;;;AAwFA,SAAgB,SAGd,MAAmE;CACnE,MAAM,EAAE,QAAQ,oBAAoB;CACpC,MAAM,cAAc,eACjB,KAAsC,WACzC;CAGA,QAAQ,cAAmE;;EACzE,MAAM,OAAO,gBAAsC,IAAI;EAEvD,MAAM,YACJ,UAGG;;GACH,MAAM,CAAC,gBAAgB,eAAe;IACpC,IAAI,MAAM,MACR,OAAO,MAAM;IAGf,MAAM,SAAS,gBAAgB,CAAC,CAAC;IACjC,MAAM,cAAc,eAAe,MAAM;IACzC,MAAM,aAAa,KAAK,aAAa,MAAM;IAE3C,OAAO;KACL,gBAAgB,OAAO;KACvB;KACA;KACA,UAAU,KAAK,MAAO,aAAwB;KAC9C,YAAY;IACd;GACF,CAAC;GAED,MAAM,EAAE,aAAa,YAAY,UAAU,eAAe;GAG1D,MAAM,aAAA,mBAAY,MAAM,eAAA,QAAA,qBAAA,KAAA,IAAA,KAAA,IAAA,iBAAW;GAEnC,MAAM,gBAA6C,MAAM,cAAc;IACrE,IAAI,CAAC,WACH,OAAO;IAGT,OAAO,YAAY,MAAM,YAAY,SAAS;GAChD,GAAG,CAAC,SAAS,CAAC;GAEd,OACE,sBAAA,cAAC,KAAK,UAAN;IACE,iBAAA,kBAAiB,aAAqB,oBAAA,QAAA,oBAAA,KAAA,IAAA,kBAAkB;IACxD,QAAQ;IACK;IACH;IACE;GAOC,GALb,sBAAA,cAAC,qBAAD,EAAqB,QAAQ,YAIR,GAHnB,sBAAA,cAAC,mBAAD,EAAmB,OAAO,cAEP,GADjB,sBAAA,cAAC,WAAc,KAAQ,CACN,CACA,CACR;EAEnB;EAEA,IAAI,KAAK,KACP,KAAK,WAAW;GACd,QAAQ;GACR;GACA;EACF,CAAC;OACI,IAAI,UAAU,iBAGnB,SAAS,kBAAkB,OAAO,iBAAiC;;GAEjE,MAAM,QAAQ,CAAC,CAAC,aAAa;GAG7B,IAAI,YAA2B,CAAC;GAEhC,MAAM,gBAAgB,MAAM,UAAU,gBACpC,YACF;GACA,MAAM,oBAAoB,SAAA,wBACrB,cAAc,eAAA,QAAA,0BAAA,KAAA,IAAA,wBAAa,CAAC,IAC7B;GAEJ,YAAA,eAAA,eAAA,CAAA,GACK,iBAAA,GACA,SACL;GACA,MAAM,mBAAmB,UACvB,QAAQ,EAAE,WAAW,MAAM,IAAI;GAEjC,OAAO,gBAAgB,SAAS;EAClC;EAIF,SAAS,cAAc,aAAA,QAAA,wBADH,UAAU,iBAAA,QAAA,0BAAA,KAAA,IAAA,wBAAe,UAAU,UAAA,QAAA,SAAA,KAAA,IAAA,OAAQ,YAChB;EAE/C,OAAO;CACT;AACF;;;;ACtIA,SAAgB,eAId,MACsC;CACtC,MAAM,QAAQ,gBAAsC,IAAI;CAGxD,MAAM,YAAY,SAAS,IAAI;CAE/B,MAAM,QAAQ,sBAAsB,KAAK;CAKzC,OAAO,iBAAiB,QAAQ;EAC9B,IAAI,QAAQ,gBAAgB,QAAQ,YAClC,aAAa;GACX,MAAM,UAAU,MAAM,SAAS;GAE/B,OAAO,cAAc;IACnB,OAAQ,sBAA8B,OAAO;GAC/C,GAAG,CAAC,OAAO,CAAC;EACd;EAGF,IAAI,QAAQ,cACV,OAAO,MAAM;EAGf,IAAI,QAAQ,sBACV,OAAO,MAAM;EAGf,IAAI,QAAQ,YACV,OAAO;EAGT,OAAO,MAAM;CACf,CAAC;AACH"}

package/dist/ssrPrepass.d.cts

@@ -1,4 +1,4 @@
-import { t as TRPCPrepassHelper } from "./withTRPC-DywCxFfq.cjs";
+import { t as TRPCPrepassHelper } from "./withTRPC-Cr10aYRv.cjs";
 //#region src/ssrPrepass.d.ts
 export declare const ssrPrepass: TRPCPrepassHelper;
 //#endregion

package/dist/ssrPrepass.d.mts

@@ -1,4 +1,4 @@
-import { t as TRPCPrepassHelper } from "./withTRPC-BchtyodQ.mjs";
+import { t as TRPCPrepassHelper } from "./withTRPC-CxGgngCY.mjs";
 //#region src/ssrPrepass.d.ts
 export declare const ssrPrepass: TRPCPrepassHelper;
 //#endregion

package/dist/ssrPrepass.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ssrPrepass.mjs","names":[],"sources":["../src/ssrPrepass.ts"],"sourcesContent":["/**\n * Heavily based on urql's ssr\n * https://github.com/FormidableLabs/urql/blob/main/packages/next-urql/src/with-urql-client.ts\n */\nimport type { DehydratedState } from '@tanstack/react-query';\nimport { dehydrate } from '@tanstack/react-query';\nimport { createTRPCUntypedClient } from '@trpc/client';\nimport type { TRPCClientError, TRPCClientErrorLike } from '@trpc/client';\nimport type { CoercedTransformerParameters } from '@trpc/client/unstable-internals';\nimport { getTransformer } from '@trpc/client/unstable-internals';\nimport { getQueryClient } from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  Dict,\n  Maybe,\n} from '@trpc/server/unstable-core-do-not-import';\nimport type {\n  AppContextType,\n  NextPageContext,\n} from 'next/dist/shared/lib/utils';\nimport { createElement } from 'react';\nimport type { TRPCPrepassHelper, TRPCPrepassProps } from './withTRPC';\n\nfunction transformQueryOrMutationCacheErrors<\n  TState extends\n    DehydratedState['mutations'][0] | DehydratedState['queries'][0],\n>(result: TState): TState {\n  const error = result.state.error as Maybe<TRPCClientError<any>>;\n  if (error instanceof Error && error.name === 'TRPCClientError') {\n    const newError: TRPCClientErrorLike<any> = {\n      message: error.message,\n      data: error.data,\n      shape: error.shape,\n    };\n    return {\n      ...result,\n      state: {\n        ...result.state,\n        error: newError,\n      },\n    };\n  }\n  return result;\n}\n\nexport const ssrPrepass: TRPCPrepassHelper = (opts) => {\n  const { parent, WithTRPC, AppOrPage } = opts;\n  type $PrepassProps = TRPCPrepassProps<AnyRouter, any>;\n\n  const transformer = getTransformer(\n    (parent as CoercedTransformerParameters).transformer,\n  );\n  WithTRPC.getInitialProps = async (appOrPageCtx: AppContextType) => {\n    const shouldSsr = async () => {\n      if (typeof window !== 'undefined') {\n        return false;\n      }\n      if (typeof parent.ssr === 'function') {\n        try {\n          return await parent.ssr({ ctx: appOrPageCtx.ctx });\n        } catch {\n          return false;\n        }\n      }\n      return parent.ssr;\n    };\n    const ssrEnabled = await shouldSsr();\n    const AppTree = appOrPageCtx.AppTree;\n\n    // Determine if we are wrapping an App component or a Page component.\n    const isApp = !!appOrPageCtx.Component;\n    const ctx: NextPageContext = isApp\n      ? appOrPageCtx.ctx\n      : (appOrPageCtx as any as NextPageContext);\n\n    // Run the wrapped component's getInitialProps function.\n    let pageProps: Dict<unknown> = {};\n    if (AppOrPage.getInitialProps) {\n      const originalProps = await AppOrPage.getInitialProps(\n        appOrPageCtx as any,\n      );\n      const originalPageProps = isApp\n        ? (originalProps.pageProps ?? {})\n        : originalProps;\n\n      pageProps = {\n        ...originalPageProps,\n        ...pageProps,\n      };\n    }\n    const getAppTreeProps = (props: Record<string, unknown>) =>\n      isApp ? { pageProps: props } : props;\n\n    if (typeof window !== 'undefined' || !ssrEnabled) {\n      return getAppTreeProps(pageProps);\n    }\n\n    const config = parent.config({ ctx });\n    const trpcClient = createTRPCUntypedClient(config);\n    const queryClient = getQueryClient(config);\n\n    const trpcProp: $PrepassProps = {\n      config,\n      trpcClient,\n      queryClient,\n      ssrState: 'prepass',\n      ssrContext: ctx,\n    };\n    const prepassProps = {\n      pageProps,\n      trpc: trpcProp,\n    };\n\n    const reactDomServer = await import('react-dom/server');\n\n    // Run the prepass step on AppTree. This will run all trpc queries on the server.\n    // multiple prepass ensures that we can do batching on the server\n    while (true) {\n      // render full tree\n      reactDomServer.renderToString(createElement(AppTree, prepassProps));\n      if (!queryClient.isFetching()) {\n        // the render didn't cause the queryClient to fetch anything\n        break;\n      }\n\n      // wait until the query cache has settled it's promises\n      await new Promise<void>((resolve) => {\n        const unsub = queryClient.getQueryCache().subscribe((event) => {\n          if (event?.query.getObserversCount() === 0) {\n            resolve();\n            unsub();\n          }\n        });\n      });\n    }\n    const dehydratedCache = dehydrate(queryClient, {\n      shouldDehydrateQuery(query) {\n        // filter out queries that are marked as trpc: { ssr: false } or are not enabled, but make sure errors are dehydrated\n        const isExcludedFromSSr =\n          query.state.fetchStatus === 'idle' &&\n          query.state.status === 'pending';\n        return !isExcludedFromSSr;\n      },\n    });\n    // since error instances can't be serialized, let's make them into `TRPCClientErrorLike`-objects\n    const dehydratedCacheWithErrors = {\n      ...dehydratedCache,\n      queries: dehydratedCache.queries.map(transformQueryOrMutationCacheErrors),\n      mutations: dehydratedCache.mutations.map(\n        transformQueryOrMutationCacheErrors,\n      ),\n    };\n\n    // dehydrate query client's state and add it to the props\n    pageProps['trpcState'] = transformer.input.serialize(\n      dehydratedCacheWithErrors,\n    );\n\n    const appTreeProps = getAppTreeProps(pageProps);\n\n    const meta =\n      parent.responseMeta?.({\n        ctx,\n        clientErrors: [...dehydratedCache.queries, ...dehydratedCache.mutations]\n          .map((v) => v.state.error)\n          .flatMap((err) =>\n            err instanceof Error && err.name === 'TRPCClientError'\n              ? [err as TRPCClientError<AnyRouter>]\n              : [],\n          ),\n      }) ?? {};\n\n    for (const [key, value] of Object.entries(meta.headers ?? {})) {\n      if (typeof value === 'string') {\n        ctx.res?.setHeader(key, value);\n      }\n    }\n    if (meta.status && ctx.res) {\n      ctx.res.statusCode = meta.status;\n    }\n\n    return appTreeProps;\n  };\n};\n"],"mappings":"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"}
+{"version":3,"file":"ssrPrepass.mjs","names":[],"sources":["../src/ssrPrepass.ts"],"sourcesContent":["/**\n * Heavily based on urql's ssr\n * https://github.com/FormidableLabs/urql/blob/main/packages/next-urql/src/with-urql-client.ts\n */\nimport type { DehydratedState } from '@tanstack/react-query';\nimport { dehydrate } from '@tanstack/react-query';\nimport { createTRPCUntypedClient } from '@trpc/client';\nimport type { TRPCClientError, TRPCClientErrorLike } from '@trpc/client';\nimport type { CoercedTransformerParameters } from '@trpc/client/unstable-internals';\nimport { getTransformer } from '@trpc/client/unstable-internals';\nimport { getQueryClient } from '@trpc/react-query/shared';\nimport type {\n  AnyRouter,\n  Dict,\n  Maybe,\n} from '@trpc/server/unstable-core-do-not-import';\nimport type {\n  AppContextType,\n  NextPageContext,\n} from 'next/dist/shared/lib/utils.js';\nimport { createElement } from 'react';\nimport type { TRPCPrepassHelper, TRPCPrepassProps } from './withTRPC';\n\nfunction transformQueryOrMutationCacheErrors<\n  TState extends\n    DehydratedState['mutations'][0] | DehydratedState['queries'][0],\n>(result: TState): TState {\n  const error = result.state.error as Maybe<TRPCClientError<any>>;\n  if (error instanceof Error && error.name === 'TRPCClientError') {\n    const newError: TRPCClientErrorLike<any> = {\n      message: error.message,\n      data: error.data,\n      shape: error.shape,\n    };\n    return {\n      ...result,\n      state: {\n        ...result.state,\n        error: newError,\n      },\n    };\n  }\n  return result;\n}\n\nexport const ssrPrepass: TRPCPrepassHelper = (opts) => {\n  const { parent, WithTRPC, AppOrPage } = opts;\n  type $PrepassProps = TRPCPrepassProps<AnyRouter, any>;\n\n  const transformer = getTransformer(\n    (parent as CoercedTransformerParameters).transformer,\n  );\n  WithTRPC.getInitialProps = async (appOrPageCtx: AppContextType) => {\n    const shouldSsr = async () => {\n      if (typeof window !== 'undefined') {\n        return false;\n      }\n      if (typeof parent.ssr === 'function') {\n        try {\n          return await parent.ssr({ ctx: appOrPageCtx.ctx });\n        } catch {\n          return false;\n        }\n      }\n      return parent.ssr;\n    };\n    const ssrEnabled = await shouldSsr();\n    const AppTree = appOrPageCtx.AppTree;\n\n    // Determine if we are wrapping an App component or a Page component.\n    const isApp = !!appOrPageCtx.Component;\n    const ctx: NextPageContext = isApp\n      ? appOrPageCtx.ctx\n      : (appOrPageCtx as any as NextPageContext);\n\n    // Run the wrapped component's getInitialProps function.\n    let pageProps: Dict<unknown> = {};\n    if (AppOrPage.getInitialProps) {\n      const originalProps = await AppOrPage.getInitialProps(\n        appOrPageCtx as any,\n      );\n      const originalPageProps = isApp\n        ? (originalProps.pageProps ?? {})\n        : originalProps;\n\n      pageProps = {\n        ...originalPageProps,\n        ...pageProps,\n      };\n    }\n    const getAppTreeProps = (props: Record<string, unknown>) =>\n      isApp ? { pageProps: props } : props;\n\n    if (typeof window !== 'undefined' || !ssrEnabled) {\n      return getAppTreeProps(pageProps);\n    }\n\n    const config = parent.config({ ctx });\n    const trpcClient = createTRPCUntypedClient(config);\n    const queryClient = getQueryClient(config);\n\n    const trpcProp: $PrepassProps = {\n      config,\n      trpcClient,\n      queryClient,\n      ssrState: 'prepass',\n      ssrContext: ctx,\n    };\n    const prepassProps = {\n      pageProps,\n      trpc: trpcProp,\n    };\n\n    const reactDomServer = await import('react-dom/server');\n\n    // Run the prepass step on AppTree. This will run all trpc queries on the server.\n    // multiple prepass ensures that we can do batching on the server\n    while (true) {\n      // render full tree\n      reactDomServer.renderToString(createElement(AppTree, prepassProps));\n      if (!queryClient.isFetching()) {\n        // the render didn't cause the queryClient to fetch anything\n        break;\n      }\n\n      // wait until the query cache has settled it's promises\n      await new Promise<void>((resolve) => {\n        const unsub = queryClient.getQueryCache().subscribe((event) => {\n          if (event?.query.getObserversCount() === 0) {\n            resolve();\n            unsub();\n          }\n        });\n      });\n    }\n    const dehydratedCache = dehydrate(queryClient, {\n      shouldDehydrateQuery(query) {\n        // filter out queries that are marked as trpc: { ssr: false } or are not enabled, but make sure errors are dehydrated\n        const isExcludedFromSSr =\n          query.state.fetchStatus === 'idle' &&\n          query.state.status === 'pending';\n        return !isExcludedFromSSr;\n      },\n    });\n    // since error instances can't be serialized, let's make them into `TRPCClientErrorLike`-objects\n    const dehydratedCacheWithErrors = {\n      ...dehydratedCache,\n      queries: dehydratedCache.queries.map(transformQueryOrMutationCacheErrors),\n      mutations: dehydratedCache.mutations.map(\n        transformQueryOrMutationCacheErrors,\n      ),\n    };\n\n    // dehydrate query client's state and add it to the props\n    pageProps['trpcState'] = transformer.input.serialize(\n      dehydratedCacheWithErrors,\n    );\n\n    const appTreeProps = getAppTreeProps(pageProps);\n\n    const meta =\n      parent.responseMeta?.({\n        ctx,\n        clientErrors: [...dehydratedCache.queries, ...dehydratedCache.mutations]\n          .map((v) => v.state.error)\n          .flatMap((err) =>\n            err instanceof Error && err.name === 'TRPCClientError'\n              ? [err as TRPCClientError<AnyRouter>]\n              : [],\n          ),\n      }) ?? {};\n\n    for (const [key, value] of Object.entries(meta.headers ?? {})) {\n      if (typeof value === 'string') {\n        ctx.res?.setHeader(key, value);\n      }\n    }\n    if (meta.status && ctx.res) {\n      ctx.res.statusCode = meta.status;\n    }\n\n    return appTreeProps;\n  };\n};\n"],"mappings":"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"}

package/dist/{withTRPC-BchtyodQ.d.mts → withTRPC-Cr10aYRv.d.cts}

@@ -1,9 +1,9 @@
-import { QueryClient } from "@tanstack/react-query";
+import { CreateTRPCClientOptions, TRPCClient, TRPCClientError, TRPCUntypedClient } from "@trpc/client";
+import { AnyRouter, ResponseMeta, inferClientTypes } from "@trpc/server/unstable-core-do-not-import";
 import { TransformerOptions } from "@trpc/client/unstable-internals";
+import { QueryClient } from "@tanstack/react-query";
 import { CreateTRPCReactOptions, CreateTRPCReactQueryClientConfig } from "@trpc/react-query/shared";
-import { AnyRouter, ResponseMeta, inferClientTypes } from "@trpc/server/unstable-core-do-not-import";
-import { CreateTRPCClientOptions, TRPCClient, TRPCClientError, TRPCUntypedClient } from "@trpc/client";
-import { NextComponentType, NextPageContext } from "next/dist/shared/lib/utils";
+import { NextComponentType, NextPageContext } from "next/dist/shared/lib/utils.js";
 //#region src/withTRPC.d.ts
 type WithTRPCConfig<TRouter extends AnyRouter> = CreateTRPCClientOptions<TRouter> & CreateTRPCReactQueryClientConfig & {
   abortOnUnmount?: boolean;
@@ -49,4 +49,4 @@ type TRPCPrepassProps<TRouter extends AnyRouter, TSSRContext extends NextPageCon
 declare function withTRPC<TRouter extends AnyRouter, TSSRContext extends NextPageContext = NextPageContext>(opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>): (AppOrPage: NextComponentType<any, any, any>) => NextComponentType;
 //#endregion
 export { WithTRPCSSROptions as a, WithTRPCNoSSROptions as i, TRPCPrepassProps as n, withTRPC as o, WithTRPCConfig as r, TRPCPrepassHelper as t };
-//# sourceMappingURL=withTRPC-BchtyodQ.d.mts.map
+//# sourceMappingURL=withTRPC-Cr10aYRv.d.cts.map

package/dist/{withTRPC-DywCxFfq.d.cts.map → withTRPC-Cr10aYRv.d.cts.map}

@@ -1 +1 @@
-{"version":3,"file":"withTRPC-DywCxFfq.d.cts","names":[],"sources":["../src/withTRPC.tsx"],"mappings":";;;;;;;KAqCY,eAAe,gBAAgB,aACzC,wBAAwB,WACtB;EACE;;KAGD,gBAAgB,gBAAgB,aACnC,uBAAuB;EACrB,SAAS;IAAQ,MAAM;QAAsB,eAAe;IAC1D,mBAAmB,iBAAiB;KAE9B,qBAAqB;EAC/B,QAAQ,mBAAmB;EAC3B,UAAU;EACV,WAAW;;KAED,mBAAmB,gBAAgB,aAC7C,gBAAgB;;;;;EAKd,cACW;IAAQ,KAAK;kBAAgC;EACxD,gBAAgB;IACd,KAAK;IACL,cAAc,gBAAgB;QAC1B;;;;;EAKN,YAAY;;KAGJ,qBAAqB,gBAAgB,aAC/C,gBAAgB;EACd;;KAGQ,iBACV,gBAAgB,WAChB,oBAAoB,kBAAkB;EAEtC,QAAQ,eAAe;EACvB,aAAa;EACb,YAAY,kBAAkB,WAAW,WAAW;EACpD;EACA,YAAY;;iBAGE,SACd,gBAAgB,WAChB,oBAAoB,kBAAkB,iBACtC,MAAM,qBAAqB,WAAW,mBAAmB,YAAQ,WAO9C,qCAAmC"}
+{"version":3,"file":"withTRPC-Cr10aYRv.d.cts","names":[],"sources":["../src/withTRPC.tsx"],"mappings":";;;;;;;KAqCY,eAAe,gBAAgB,aACzC,wBAAwB,WACtB;EACE;;KAGD,gBAAgB,gBAAgB,aACnC,uBAAuB;EACrB,SAAS;IAAQ,MAAM;QAAsB,eAAe;IAC1D,mBAAmB,iBAAiB;KAE9B,qBAAqB;EAC/B,QAAQ,mBAAmB;EAC3B,UAAU;EACV,WAAW;;KAED,mBAAmB,gBAAgB,aAC7C,gBAAgB;;;;;EAKd,cACW;IAAQ,KAAK;kBAAgC;EACxD,gBAAgB;IACd,KAAK;IACL,cAAc,gBAAgB;QAC1B;;;;;EAKN,YAAY;;KAGJ,qBAAqB,gBAAgB,aAC/C,gBAAgB;EACd;;KAGQ,iBACV,gBAAgB,WAChB,oBAAoB,kBAAkB;EAEtC,QAAQ,eAAe;EACvB,aAAa;EACb,YAAY,kBAAkB,WAAW,WAAW;EACpD;EACA,YAAY;;iBAGE,SACd,gBAAgB,WAChB,oBAAoB,kBAAkB,iBACtC,MAAM,qBAAqB,WAAW,mBAAmB,YAAQ,WAO9C,qCAAmC"}

package/dist/{withTRPC-DywCxFfq.d.cts → withTRPC-CxGgngCY.d.mts}

@@ -1,9 +1,9 @@
-import { CreateTRPCClientOptions, TRPCClient, TRPCClientError, TRPCUntypedClient } from "@trpc/client";
-import { AnyRouter, ResponseMeta, inferClientTypes } from "@trpc/server/unstable-core-do-not-import";
-import { TransformerOptions } from "@trpc/client/unstable-internals";
 import { QueryClient } from "@tanstack/react-query";
+import { TransformerOptions } from "@trpc/client/unstable-internals";
 import { CreateTRPCReactOptions, CreateTRPCReactQueryClientConfig } from "@trpc/react-query/shared";
-import { NextComponentType, NextPageContext } from "next/dist/shared/lib/utils";
+import { AnyRouter, ResponseMeta, inferClientTypes } from "@trpc/server/unstable-core-do-not-import";
+import { CreateTRPCClientOptions, TRPCClient, TRPCClientError, TRPCUntypedClient } from "@trpc/client";
+import { NextComponentType, NextPageContext } from "next/dist/shared/lib/utils.js";
 //#region src/withTRPC.d.ts
 type WithTRPCConfig<TRouter extends AnyRouter> = CreateTRPCClientOptions<TRouter> & CreateTRPCReactQueryClientConfig & {
   abortOnUnmount?: boolean;
@@ -49,4 +49,4 @@ type TRPCPrepassProps<TRouter extends AnyRouter, TSSRContext extends NextPageCon
 declare function withTRPC<TRouter extends AnyRouter, TSSRContext extends NextPageContext = NextPageContext>(opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>): (AppOrPage: NextComponentType<any, any, any>) => NextComponentType;
 //#endregion
 export { WithTRPCSSROptions as a, WithTRPCNoSSROptions as i, TRPCPrepassProps as n, withTRPC as o, WithTRPCConfig as r, TRPCPrepassHelper as t };
-//# sourceMappingURL=withTRPC-DywCxFfq.d.cts.map
+//# sourceMappingURL=withTRPC-CxGgngCY.d.mts.map

package/dist/{withTRPC-BchtyodQ.d.mts.map → withTRPC-CxGgngCY.d.mts.map}

@@ -1 +1 @@
-{"version":3,"file":"withTRPC-BchtyodQ.d.mts","names":[],"sources":["../src/withTRPC.tsx"],"mappings":";;;;;;;KAqCY,eAAe,gBAAgB,aACzC,wBAAwB,WACtB;EACE;;KAGD,gBAAgB,gBAAgB,aACnC,uBAAuB;EACrB,SAAS;IAAQ,MAAM;QAAsB,eAAe;IAC1D,mBAAmB,iBAAiB;KAE9B,qBAAqB;EAC/B,QAAQ,mBAAmB;EAC3B,UAAU;EACV,WAAW;;KAED,mBAAmB,gBAAgB,aAC7C,gBAAgB;;;;;EAKd,cACW;IAAQ,KAAK;kBAAgC;EACxD,gBAAgB;IACd,KAAK;IACL,cAAc,gBAAgB;QAC1B;;;;;EAKN,YAAY;;KAGJ,qBAAqB,gBAAgB,aAC/C,gBAAgB;EACd;;KAGQ,iBACV,gBAAgB,WAChB,oBAAoB,kBAAkB;EAEtC,QAAQ,eAAe;EACvB,aAAa;EACb,YAAY,kBAAkB,WAAW,WAAW;EACpD;EACA,YAAY;;iBAGE,SACd,gBAAgB,WAChB,oBAAoB,kBAAkB,iBACtC,MAAM,qBAAqB,WAAW,mBAAmB,YAAQ,WAO9C,qCAAmC"}
+{"version":3,"file":"withTRPC-CxGgngCY.d.mts","names":[],"sources":["../src/withTRPC.tsx"],"mappings":";;;;;;;KAqCY,eAAe,gBAAgB,aACzC,wBAAwB,WACtB;EACE;;KAGD,gBAAgB,gBAAgB,aACnC,uBAAuB;EACrB,SAAS;IAAQ,MAAM;QAAsB,eAAe;IAC1D,mBAAmB,iBAAiB;KAE9B,qBAAqB;EAC/B,QAAQ,mBAAmB;EAC3B,UAAU;EACV,WAAW;;KAED,mBAAmB,gBAAgB,aAC7C,gBAAgB;;;;;EAKd,cACW;IAAQ,KAAK;kBAAgC;EACxD,gBAAgB;IACd,KAAK;IACL,cAAc,gBAAgB;QAC1B;;;;;EAKN,YAAY;;KAGJ,qBAAqB,gBAAgB,aAC/C,gBAAgB;EACd;;KAGQ,iBACV,gBAAgB,WAChB,oBAAoB,kBAAkB;EAEtC,QAAQ,eAAe;EACvB,aAAa;EACb,YAAY,kBAAkB,WAAW,WAAW;EACpD;EACA,YAAY;;iBAGE,SACd,gBAAgB,WAChB,oBAAoB,kBAAkB,iBACtC,MAAM,qBAAqB,WAAW,mBAAmB,YAAQ,WAO9C,qCAAmC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "name": "@trpc/next",
-  "version": "11.22.1",
+  "version": "11.22.2-canary.11.4427f0bea",
   "description": "The tRPC Next.js library",
   "author": "KATT",
   "license": "MIT",
@@ -100,16 +100,13 @@
     "app-dir",
     "ssrPrepass",
     "!**/*.test.*",
-    "!**/__tests__",
-    "skills",
-    "!skills/_artifacts",
-    "bin"
+    "!**/__tests__"
   ],
   "peerDependencies": {
     "@tanstack/react-query": "^5.59.15",
-    "@trpc/client": "11.22.1",
-    "@trpc/react-query": "11.22.1",
-    "@trpc/server": "11.22.1",
+    "@trpc/client": "11.22.2-canary.11.4427f0bea",
+    "@trpc/react-query": "11.22.2-canary.11.4427f0bea",
+    "@trpc/server": "11.22.2-canary.11.4427f0bea",
     "next": "*",
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
@@ -124,11 +121,10 @@
     }
   },
   "devDependencies": {
-    "@tanstack/intent": "^0.0.27",
     "@tanstack/react-query": "^5.80.3",
-    "@trpc/client": "11.22.1",
-    "@trpc/react-query": "11.22.1",
-    "@trpc/server": "11.22.1",
+    "@trpc/client": "11.22.2-canary.11.4427f0bea",
+    "@trpc/react-query": "11.22.2-canary.11.4427f0bea",
+    "@trpc/server": "11.22.2-canary.11.4427f0bea",
     "@types/express": "^5.0.0",
     "@types/node": "^24.13.4",
     "@types/react": "^19.1.0",
@@ -149,11 +145,5 @@
   "funding": [
     "https://trpc.io/sponsor"
   ],
-  "keywords": [
-    "tanstack-intent"
-  ],
-  "bin": {
-    "intent": "./bin/intent.js"
-  },
-  "gitHead": "708753ff1383c47c5f765694978db1000a86ee36"
+  "gitHead": "4427f0bea4ceca48f3e15125e858ab9adddf3f3b"
 }

package/src/createTRPCNext.tsx

@@ -16,7 +16,7 @@ import type {
   ProtectedIntersection,
 } from '@trpc/server/unstable-core-do-not-import';
 import { createFlatProxy } from '@trpc/server/unstable-core-do-not-import';
-import type { NextPageContext } from 'next/types';
+import type { NextPageContext } from 'next/types.js';
 import { useMemo } from 'react';
 import type { WithTRPCNoSSROptions, WithTRPCSSROptions } from './withTRPC';
 import { withTRPC } from './withTRPC';

package/src/ssrPrepass.ts

@@ -17,7 +17,7 @@ import type {
 import type {
   AppContextType,
   NextPageContext,
-} from 'next/dist/shared/lib/utils';
+} from 'next/dist/shared/lib/utils.js';
 import { createElement } from 'react';
 import type { TRPCPrepassHelper, TRPCPrepassProps } from './withTRPC';
 

package/src/withTRPC.tsx

@@ -31,7 +31,7 @@ import type {
   AppPropsType,
   NextComponentType,
   NextPageContext,
-} from 'next/dist/shared/lib/utils';
+} from 'next/dist/shared/lib/utils.js';
 import type { NextRouter } from 'next/router';
 import React, { useState } from 'react';
 

package/bin/intent.js

@@ -1,20 +0,0 @@
-#!/usr/bin/env node
-// Auto-generated by @tanstack/intent setup
-// Exposes the intent end-user CLI for consumers of this library.
-// Commit this file, then add to your package.json:
-//   "bin": { "intent": "./bin/intent.js" }
-try {
-  await import('@tanstack/intent/intent-library');
-} catch (e) {
-  if (e?.code === 'ERR_MODULE_NOT_FOUND' || e?.code === 'MODULE_NOT_FOUND') {
-    console.error('@tanstack/intent is not installed.');
-    console.error('');
-    console.error('Install it as a dev dependency:');
-    console.error('  npm add -D @tanstack/intent');
-    console.error('');
-    console.error('Or run directly:');
-    console.error('  npx @tanstack/intent@latest list');
-    process.exit(1);
-  }
-  throw e;
-}

package/skills/nextjs-app-router/SKILL.md

@@ -1,429 +0,0 @@
----
-name: nextjs-app-router
-description: >
-  Full end-to-end tRPC setup for Next.js App Router. Covers route handler
-  with fetchRequestHandler (GET + POST exports), TRPCProvider with
-  QueryClientProvider, createTRPCOptionsProxy for RSC prefetching,
-  HydrateClient/HydrationBoundary for hydration, useSuspenseQuery
-  for Suspense, and server-side callers.
-type: framework
-library: trpc
-framework: react
-library_version: '11.16.0'
-requires:
-  - server-setup
-  - client-setup
-  - react-query-setup
-  - adapter-fetch
-sources:
-  - www/docs/client/nextjs/overview.mdx
-  - www/docs/client/tanstack-react-query/server-components.mdx
-  - www/docs/server/adapters/nextjs.md
-  - examples/next-prisma-starter/
-  - examples/next-sse-chat/
----
-
-This skill builds on [server-setup], [client-setup], [react-query-setup], and [adapter-fetch]. Read them first for foundational concepts.
-
-# tRPC -- Next.js App Router
-
-## File Structure
-
-```
-.
-├── app
-│   ├── api/trpc/[trpc]
-│   │   └── route.ts        # tRPC HTTP handler
-│   ├── layout.tsx           # mount TRPCReactProvider
-│   ├── page.tsx             # server component (prefetch)
-│   └── client-greeting.tsx  # client component (consume)
-├── trpc
-│   ├── init.ts              # initTRPC, createTRPCContext
-│   ├── routers
-│   │   └── _app.ts          # main app router, AppRouter type
-│   ├── query-client.ts      # shared QueryClient factory
-│   ├── client.tsx           # client hooks & TRPCReactProvider
-│   └── server.tsx           # server-side proxy & helpers
-└── ...
-```
-
-## Setup
-
-### 1. Install
-
-```sh
-npm install @trpc/server @trpc/client @trpc/tanstack-react-query @tanstack/react-query zod server-only client-only
-```
-
-### 2. Server init and context
-
-```ts title="trpc/init.ts"
-import { initTRPC } from '@trpc/server';
-
-export const createTRPCContext = async (opts: { headers: Headers }) => {
-  return { userId: 'user_123' };
-};
-
-const t = initTRPC
-  .context<Awaited<ReturnType<typeof createTRPCContext>>>()
-  .create();
-
-export const createTRPCRouter = t.router;
-export const createCallerFactory = t.createCallerFactory;
-export const baseProcedure = t.procedure;
-```
-
-### 3. Define the router
-
-```ts title="trpc/routers/_app.ts"
-import { z } from 'zod';
-import { baseProcedure, createTRPCRouter } from '../init';
-
-export const appRouter = createTRPCRouter({
-  hello: baseProcedure
-    .input(z.object({ text: z.string() }))
-    .query(({ input }) => ({
-      greeting: `hello ${input.text}`,
-    })),
-});
-
-export type AppRouter = typeof appRouter;
-```
-
-### 4. Route handler (API endpoint)
-
-```ts title="app/api/trpc/[trpc]/route.ts"
-import { fetchRequestHandler } from '@trpc/server/adapters/fetch';
-import { createTRPCContext } from '../../../../trpc/init';
-import { appRouter } from '../../../../trpc/routers/_app';
-
-const handler = (req: Request) =>
-  fetchRequestHandler({
-    endpoint: '/api/trpc',
-    req,
-    router: appRouter,
-    createContext: () => createTRPCContext({ headers: req.headers }),
-  });
-
-export { handler as GET, handler as POST };
-```
-
-### 5. QueryClient factory
-
-```ts title="trpc/query-client.ts"
-import {
-  defaultShouldDehydrateQuery,
-  QueryClient,
-} from '@tanstack/react-query';
-
-export function makeQueryClient() {
-  return new QueryClient({
-    defaultOptions: {
-      queries: {
-        staleTime: 30 * 1000,
-      },
-      dehydrate: {
-        shouldDehydrateQuery: (query) =>
-          defaultShouldDehydrateQuery(query) ||
-          query.state.status === 'pending',
-      },
-    },
-  });
-}
-```
-
-If using a data transformer (e.g., superjson), add `dehydrate.serializeData` and `hydrate.deserializeData` here.
-
-### 6. Client provider (client component)
-
-```tsx title="trpc/client.tsx"
-'use client';
-
-import type { QueryClient } from '@tanstack/react-query';
-import { QueryClientProvider } from '@tanstack/react-query';
-import { createTRPCClient, httpBatchLink } from '@trpc/client';
-import { createTRPCContext } from '@trpc/tanstack-react-query';
-import { useState } from 'react';
-import { makeQueryClient } from './query-client';
-import type { AppRouter } from './routers/_app';
-
-export const { TRPCProvider, useTRPC, useTRPCClient } =
-  createTRPCContext<AppRouter>();
-
-let browserQueryClient: QueryClient;
-function getQueryClient() {
-  if (typeof window === 'undefined') {
-    return makeQueryClient();
-  }
-  if (!browserQueryClient) browserQueryClient = makeQueryClient();
-  return browserQueryClient;
-}
-
-function getUrl() {
-  const base = (() => {
-    if (typeof window !== 'undefined') return '';
-    if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`;
-    return 'http://localhost:3000';
-  })();
-  return `${base}/api/trpc`;
-}
-
-export function TRPCReactProvider(props: { children: React.ReactNode }) {
-  const queryClient = getQueryClient();
-
-  const [trpcClient] = useState(() =>
-    createTRPCClient<AppRouter>({
-      links: [
-        httpBatchLink({
-          url: getUrl(),
-        }),
-      ],
-    }),
-  );
-
-  return (
-    <QueryClientProvider client={queryClient}>
-      <TRPCProvider trpcClient={trpcClient} queryClient={queryClient}>
-        {props.children}
-      </TRPCProvider>
-    </QueryClientProvider>
-  );
-}
-```
-
-### 7. Server-side proxy (server component)
-
-```tsx title="trpc/server.tsx"
-import 'server-only';
-import { dehydrate, HydrationBoundary } from '@tanstack/react-query';
-import { createTRPCOptionsProxy } from '@trpc/tanstack-react-query';
-import type { TRPCQueryOptions } from '@trpc/tanstack-react-query';
-import { headers } from 'next/headers';
-import { cache } from 'react';
-import { createTRPCContext } from './init';
-import { makeQueryClient } from './query-client';
-import { appRouter } from './routers/_app';
-
-export const getQueryClient = cache(makeQueryClient);
-
-export const trpc = createTRPCOptionsProxy({
-  ctx: async () =>
-    createTRPCContext({
-      headers: await headers(),
-    }),
-  router: appRouter,
-  queryClient: getQueryClient,
-});
-
-export function HydrateClient(props: { children: React.ReactNode }) {
-  const queryClient = getQueryClient();
-  return (
-    <HydrationBoundary state={dehydrate(queryClient)}>
-      {props.children}
-    </HydrationBoundary>
-  );
-}
-
-export function prefetch<T extends ReturnType<TRPCQueryOptions<any>>>(
-  queryOptions: T,
-) {
-  const queryClient = getQueryClient();
-  if (queryOptions.queryKey[1]?.type === 'infinite') {
-    void queryClient.prefetchInfiniteQuery(queryOptions as any);
-  } else {
-    void queryClient.prefetchQuery(queryOptions);
-  }
-}
-```
-
-### 8. Mount provider in layout
-
-```tsx title="app/layout.tsx"
-import { TRPCReactProvider } from '../trpc/client';
-
-export default function RootLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <html lang="en">
-      <body>
-        <TRPCReactProvider>{children}</TRPCReactProvider>
-      </body>
-    </html>
-  );
-}
-```
-
-## Core Patterns
-
-### Prefetch in server component, consume in client component
-
-```tsx title="app/page.tsx"
-import { HydrateClient, prefetch, trpc } from '../trpc/server';
-import { ClientGreeting } from './client-greeting';
-
-export default async function Home() {
-  prefetch(trpc.hello.queryOptions({ text: 'world' }));
-
-  return (
-    <HydrateClient>
-      <ClientGreeting />
-    </HydrateClient>
-  );
-}
-```
-
-```tsx title="app/client-greeting.tsx"
-'use client';
-
-import { useQuery } from '@tanstack/react-query';
-import { useTRPC } from '../trpc/client';
-
-export function ClientGreeting() {
-  const trpc = useTRPC();
-  const greeting = useQuery(trpc.hello.queryOptions({ text: 'world' }));
-  if (!greeting.data) return <div>Loading...</div>;
-  return <div>{greeting.data.greeting}</div>;
-}
-```
-
-### Suspense with prefetch
-
-```tsx title="app/page.tsx"
-import { Suspense } from 'react';
-import { ErrorBoundary } from 'react-error-boundary';
-import { HydrateClient, prefetch, trpc } from '../trpc/server';
-import { ClientGreeting } from './client-greeting';
-
-export default async function Home() {
-  prefetch(trpc.hello.queryOptions({ text: 'world' }));
-
-  return (
-    <HydrateClient>
-      <ErrorBoundary fallback={<div>Something went wrong</div>}>
-        <Suspense fallback={<div>Loading...</div>}>
-          <ClientGreeting />
-        </Suspense>
-      </ErrorBoundary>
-    </HydrateClient>
-  );
-}
-```
-
-```tsx title="app/client-greeting.tsx"
-'use client';
-
-import { useSuspenseQuery } from '@tanstack/react-query';
-import { useTRPC } from '../trpc/client';
-
-export function ClientGreeting() {
-  const trpc = useTRPC();
-  const { data } = useSuspenseQuery(trpc.hello.queryOptions({ text: 'world' }));
-  return <div>{data.greeting}</div>;
-}
-```
-
-### Direct server caller (data needed on server only)
-
-```tsx title="trpc/server.tsx"
-// Add to existing server.tsx
-export const caller = appRouter.createCaller(async () =>
-  createTRPCContext({ headers: await headers() }),
-);
-```
-
-```tsx title="app/page.tsx"
-import { caller } from '../trpc/server';
-
-export default async function Home() {
-  const greeting = await caller.hello({ text: 'world' });
-  return <div>{greeting.greeting}</div>;
-}
-```
-
-Note: `caller` results are not stored in the query cache. They cannot hydrate to client components. Use `prefetchQuery` if client components also need the data.
-
-### fetchQuery for data on server AND client
-
-```tsx title="app/page.tsx"
-import { getQueryClient, HydrateClient, trpc } from '../trpc/server';
-import { ClientGreeting } from './client-greeting';
-
-export default async function Home() {
-  const queryClient = getQueryClient();
-  const greeting = await queryClient.fetchQuery(
-    trpc.hello.queryOptions({ text: 'world' }),
-  );
-
-  // Use greeting on the server
-  console.log(greeting.greeting);
-
-  return (
-    <HydrateClient>
-      <ClientGreeting />
-    </HydrateClient>
-  );
-}
-```
-
-## Common Mistakes
-
-### Not exporting both GET and POST from route handler
-
-Next.js App Router route handlers must export named `GET` and `POST` functions. Missing either causes queries or mutations to return 405 Method Not Allowed.
-
-```ts
-// WRONG
-export default function handler(req: Request) { ... }
-
-// CORRECT
-const handler = (req: Request) =>
-  fetchRequestHandler({ req, router: appRouter, endpoint: '/api/trpc', createContext });
-export { handler as GET, handler as POST };
-```
-
-### Creating a singleton QueryClient for SSR
-
-In server components, each request needs its own `QueryClient` instance. A singleton leaks data between requests.
-
-```ts
-// WRONG
-const queryClient = new QueryClient(); // shared across requests!
-
-// CORRECT
-export const getQueryClient = cache(makeQueryClient);
-```
-
-The `cache()` wrapper from React ensures the same `QueryClient` is reused within a single request but a new one is created for each new request.
-
-### Missing dehydrate/shouldDehydrateQuery config
-
-RSC hydration requires `shouldDehydrateQuery` to include pending queries so that prefetched-but-not-yet-resolved promises can stream to the client. Without this, prefetched queries may not appear in the hydrated state.
-
-```ts
-// WRONG
-new QueryClient(); // default shouldDehydrateQuery skips pending
-
-// CORRECT
-new QueryClient({
-  defaultOptions: {
-    dehydrate: {
-      shouldDehydrateQuery: (query) =>
-        defaultShouldDehydrateQuery(query) || query.state.status === 'pending',
-    },
-  },
-});
-```
-
-### Suspense query failure crashes entire page during SSR
-
-If a query fails during SSR with `useSuspenseQuery`, the entire page crashes. Error Boundaries only catch errors on the client side. For critical pages, either handle errors server-side before rendering, or use `useQuery` (non-suspense) which allows graceful degradation.
-
-## See Also
-
-- [react-query-setup] -- TanStack React Query setup, queryOptions/mutationOptions factories
-- [adapter-fetch] -- fetchRequestHandler for edge/serverless runtimes
-- [server-setup] -- initTRPC, routers, procedures, context
-- [nextjs-pages-router] -- if maintaining a Pages Router project alongside App Router

package/skills/nextjs-pages-router/SKILL.md

@@ -1,386 +0,0 @@
----
-name: nextjs-pages-router
-description: >
-  Set up tRPC in Next.js Pages Router with createNextApiHandler,
-  createTRPCNext, withTRPC HOC, SSR via ssr option and ssrPrepass,
-  SSG via createServerSideHelpers with getStaticProps, and
-  server-side helpers for getServerSideProps prefetching.
-type: framework
-library: trpc
-framework: react
-library_version: '11.16.0'
-requires:
-  - server-setup
-  - client-setup
-sources:
-  - www/docs/client/nextjs/overview.mdx
-  - www/docs/server/adapters/nextjs.md
-  - examples/next-prisma-starter/
----
-
-This skill builds on [server-setup] and [client-setup]. Read them first for foundational concepts.
-
-# tRPC -- Next.js Pages Router
-
-## File Structure
-
-```
-.
-├── src
-│   ├── pages
-│   │   ├── _app.tsx              # withTRPC() HOC
-│   │   ├── api/trpc
-│   │   │   └── [trpc].ts        # tRPC API handler
-│   │   └── index.tsx             # page using tRPC hooks
-│   ├── server
-│   │   ├── routers
-│   │   │   └── _app.ts          # main app router
-│   │   ├── context.ts           # createContext
-│   │   └── trpc.ts              # initTRPC, procedure helpers
-│   └── utils
-│       └── trpc.ts              # createTRPCNext, hooks
-└── ...
-```
-
-## Setup
-
-### 1. Install
-
-```sh
-npm install @trpc/server @trpc/client @trpc/react-query @trpc/next @tanstack/react-query zod
-```
-
-### 2. Server init
-
-```ts title="server/trpc.ts"
-import { initTRPC } from '@trpc/server';
-
-const t = initTRPC.create();
-
-export const router = t.router;
-export const procedure = t.procedure;
-```
-
-### 3. Define the router
-
-```ts title="server/routers/_app.ts"
-import { z } from 'zod';
-import { procedure, router } from '../trpc';
-
-export const appRouter = router({
-  hello: procedure.input(z.object({ text: z.string() })).query(({ input }) => ({
-    greeting: `hello ${input.text}`,
-  })),
-});
-
-export type AppRouter = typeof appRouter;
-```
-
-### 4. API handler
-
-```ts title="pages/api/trpc/[trpc].ts"
-import { createNextApiHandler } from '@trpc/server/adapters/next';
-import { appRouter } from '../../../server/routers/_app';
-
-export default createNextApiHandler({
-  router: appRouter,
-  createContext: () => ({}),
-});
-```
-
-### 5. Create tRPC hooks
-
-```ts title="utils/trpc.ts"
-import { httpBatchLink } from '@trpc/client';
-import { createTRPCNext } from '@trpc/next';
-import type { AppRouter } from '../server/routers/_app';
-
-function getBaseUrl() {
-  if (typeof window !== 'undefined') return '';
-  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`;
-  return `http://localhost:${process.env.PORT ?? 3000}`;
-}
-
-export const trpc = createTRPCNext<AppRouter>({
-  config() {
-    return {
-      links: [
-        httpBatchLink({
-          url: `${getBaseUrl()}/api/trpc`,
-        }),
-      ],
-    };
-  },
-  ssr: false,
-});
-```
-
-### 6. Wrap app with withTRPC HOC
-
-```tsx title="pages/_app.tsx"
-import type { AppType } from 'next/app';
-import { trpc } from '../utils/trpc';
-
-const MyApp: AppType = ({ Component, pageProps }) => {
-  return <Component {...pageProps} />;
-};
-
-export default trpc.withTRPC(MyApp);
-```
-
-### 7. Use hooks in pages
-
-```tsx title="pages/index.tsx"
-import { trpc } from '../utils/trpc';
-
-export default function IndexPage() {
-  const hello = trpc.hello.useQuery({ text: 'client' });
-  if (!hello.data) return <div>Loading...</div>;
-  return <p>{hello.data.greeting}</p>;
-}
-```
-
-## Core Patterns
-
-### SSR with ssr: true
-
-Enable SSR to prefetch all queries on the server automatically. Requires `ssrPrepass` and forwarding client headers.
-
-```ts title="utils/trpc.ts"
-import { httpBatchLink } from '@trpc/client';
-import { createTRPCNext } from '@trpc/next';
-import { ssrPrepass } from '@trpc/next/ssrPrepass';
-import type { AppRouter } from '../server/routers/_app';
-
-function getBaseUrl() {
-  if (typeof window !== 'undefined') return '';
-  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`;
-  return `http://localhost:${process.env.PORT ?? 3000}`;
-}
-
-export const trpc = createTRPCNext<AppRouter>({
-  ssr: true,
-  ssrPrepass,
-  config({ ctx }) {
-    if (typeof window !== 'undefined') {
-      return {
-        links: [httpBatchLink({ url: '/api/trpc' })],
-      };
-    }
-    return {
-      links: [
-        httpBatchLink({
-          url: `${getBaseUrl()}/api/trpc`,
-          headers() {
-            if (!ctx?.req?.headers) return {};
-            return { cookie: ctx.req.headers.cookie };
-          },
-        }),
-      ],
-    };
-  },
-});
-```
-
-### SSG with createServerSideHelpers and getStaticProps
-
-```tsx title="pages/posts/[id].tsx"
-import { createServerSideHelpers } from '@trpc/react-query/server';
-import type {
-  GetStaticPaths,
-  GetStaticPropsContext,
-  InferGetStaticPropsType,
-} from 'next';
-import superjson from 'superjson';
-import { appRouter } from '../../server/routers/_app';
-import { trpc } from '../../utils/trpc';
-
-export async function getStaticProps(
-  context: GetStaticPropsContext<{ id: string }>,
-) {
-  const helpers = createServerSideHelpers({
-    router: appRouter,
-    ctx: {},
-    transformer: superjson,
-  });
-  const id = context.params?.id as string;
-
-  await helpers.post.byId.prefetch({ id });
-
-  return {
-    props: {
-      trpcState: helpers.dehydrate(),
-      id,
-    },
-    revalidate: 1,
-  };
-}
-
-export const getStaticPaths: GetStaticPaths = async () => {
-  return { paths: [], fallback: 'blocking' };
-};
-
-export default function PostPage(
-  props: InferGetStaticPropsType<typeof getStaticProps>,
-) {
-  const { id } = props;
-  const postQuery = trpc.post.byId.useQuery({ id });
-
-  if (postQuery.status !== 'success') return <>Loading...</>;
-  return <h1>{postQuery.data.title}</h1>;
-}
-```
-
-### Server-side helpers with getServerSideProps
-
-```tsx title="pages/posts/[id].tsx"
-import { createServerSideHelpers } from '@trpc/react-query/server';
-import type {
-  GetServerSidePropsContext,
-  InferGetServerSidePropsType,
-} from 'next';
-import superjson from 'superjson';
-import { appRouter } from '../../server/routers/_app';
-import { trpc } from '../../utils/trpc';
-
-export async function getServerSideProps(
-  context: GetServerSidePropsContext<{ id: string }>,
-) {
-  const helpers = createServerSideHelpers({
-    router: appRouter,
-    ctx: {},
-    transformer: superjson,
-  });
-  const id = context.params?.id as string;
-
-  await helpers.post.byId.prefetch({ id });
-
-  return {
-    props: {
-      trpcState: helpers.dehydrate(),
-      id,
-    },
-  };
-}
-
-export default function PostPage(
-  props: InferGetServerSidePropsType<typeof getServerSideProps>,
-) {
-  const { id } = props;
-  const postQuery = trpc.post.byId.useQuery({ id });
-
-  if (postQuery.status !== 'success') return <>Loading...</>;
-  return <h1>{postQuery.data.title}</h1>;
-}
-```
-
-### SSR response caching
-
-```ts title="utils/trpc.ts"
-import { httpBatchLink } from '@trpc/client';
-import { createTRPCNext } from '@trpc/next';
-import { ssrPrepass } from '@trpc/next/ssrPrepass';
-import type { AppRouter } from '../server/routers/_app';
-
-export const trpc = createTRPCNext<AppRouter>({
-  ssr: true,
-  ssrPrepass,
-  config() {
-    return {
-      links: [httpBatchLink({ url: '/api/trpc' })],
-    };
-  },
-  responseMeta(opts) {
-    const { clientErrors } = opts;
-    if (clientErrors.length) {
-      return { status: clientErrors[0].data?.httpStatus ?? 500 };
-    }
-    const ONE_DAY_IN_SECONDS = 60 * 60 * 24;
-    return {
-      headers: new Headers([
-        [
-          'cache-control',
-          `s-maxage=1, stale-while-revalidate=${ONE_DAY_IN_SECONDS}`,
-        ],
-      ]),
-    };
-  },
-});
-```
-
-### CORS on the API handler
-
-```ts title="pages/api/trpc/[trpc].ts"
-import { createNextApiHandler } from '@trpc/server/adapters/next';
-import type { NextApiRequest, NextApiResponse } from 'next';
-import { appRouter } from '../../../server/routers/_app';
-
-const nextApiHandler = createNextApiHandler({
-  router: appRouter,
-  createContext: () => ({}),
-});
-
-export default async function handler(
-  req: NextApiRequest,
-  res: NextApiResponse,
-) {
-  res.setHeader('Access-Control-Allow-Origin', '*');
-  res.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET, POST');
-  res.setHeader('Access-Control-Allow-Headers', '*');
-
-  if (req.method === 'OPTIONS') {
-    res.writeHead(200);
-    return res.end();
-  }
-
-  return nextApiHandler(req, res);
-}
-```
-
-### Limiting batch size with maxBatchSize
-
-```ts title="pages/api/trpc/[trpc].ts"
-import { createNextApiHandler } from '@trpc/server/adapters/next';
-import { appRouter } from '../../../server/routers/_app';
-
-export default createNextApiHandler({
-  router: appRouter,
-  createContext: () => ({}),
-  maxBatchSize: 10,
-});
-```
-
-Requests batching more than `maxBatchSize` operations are rejected with a `400 Bad Request` error. Set `maxItems` on your client's `httpBatchLink` to the same value to avoid exceeding the limit.
-
-## Common Mistakes
-
-### Using ssr: true without understanding implications
-
-Enabling `ssr: true` imports `react-dom` and runs `ssrPrepass` on every request, rendering the component tree repeatedly until no queries are fetching. This adds latency and server load. For better control, keep `ssr: false` (the default) and use `createServerSideHelpers` in `getServerSideProps` or `getStaticProps` to selectively prefetch only the queries you need.
-
-### SSR prepass renders multiple times
-
-The SSR prepass loop re-renders the component tree repeatedly until all queries resolve. This is by design but causes performance issues with expensive renders. Keep SSR-rendered pages lightweight, or switch to selective prefetching with server-side helpers.
-
-### Mixing App Router and Pages Router patterns
-
-App Router uses `fetchRequestHandler`, `createTRPCOptionsProxy`, and `@trpc/tanstack-react-query`. Pages Router uses `createNextApiHandler`, `createTRPCNext`, and `@trpc/next`/`@trpc/react-query`. Applying App Router patterns (like `HydrationBoundary` or `prefetchQuery`) in Pages Router, or vice versa, produces non-functional code.
-
-### Forgetting to return trpcState from getStaticProps/getServerSideProps
-
-When using `createServerSideHelpers`, you must return `trpcState: helpers.dehydrate()` in props. Without this, the prefetched data is lost and queries re-fetch on the client.
-
-```ts
-// WRONG
-return { props: { id } }; // missing trpcState!
-
-// CORRECT
-return { props: { trpcState: helpers.dehydrate(), id } };
-```
-
-## See Also
-
-- [server-setup] -- initTRPC, routers, procedures, context
-- [client-setup] -- vanilla tRPC client, links configuration
-- [nextjs-app-router] -- if migrating to or starting with App Router
-- [react-query-classic-migration] -- migrating from @trpc/react-query to @trpc/tanstack-react-query