@trpc/next 11.0.0-next.91 → 11.0.0-rc.329

package/dist/index.mjs

@@ -1,185 +1,2 @@
-import { dehydrate, QueryClientProvider, HydrationBoundary } from '@tanstack/react-query';
-import { createTRPCUntypedClient } from '@trpc/client';
-import { createRootHooks, getQueryClient, createReactQueryUtils, createReactDecoration } from '@trpc/react-query/shared';
-import React, { createElement, useState, useMemo } from 'react';
-import ssrPrepass from 'react-ssr-prepass';
-import { createFlatProxy } from '@trpc/server/shared';
-
-function transformQueryOrMutationCacheErrors(result) {
-    const error = result.state.error;
-    if (error instanceof Error && error.name === 'TRPCClientError') {
-        const newError = {
-            message: error.message,
-            data: error.data,
-            shape: error.shape
-        };
-        return {
-            ...result,
-            state: {
-                ...result.state,
-                error: newError
-            }
-        };
-    }
-    return result;
-}
-function withTRPC(opts) {
-    const { config: getClientConfig  } = opts;
-    return (AppOrPage)=>{
-        const trpc = createRootHooks(opts);
-        const WithTRPC = (props)=>{
-            const [prepassProps] = useState(()=>{
-                if (props.trpc) {
-                    return props.trpc;
-                }
-                const config = getClientConfig({});
-                const queryClient = getQueryClient(config);
-                const trpcClient = trpc.createClient(config);
-                return {
-                    abortOnUnmount: config.abortOnUnmount,
-                    queryClient,
-                    trpcClient,
-                    ssrState: opts.ssr ? 'mounting' : false,
-                    ssrContext: null
-                };
-            });
-            const { queryClient , trpcClient , ssrState , ssrContext  } = prepassProps;
-            // allow normal components to be wrapped, not just app/pages
-            const hydratedState = trpc.useDehydratedState(trpcClient, props.pageProps?.trpcState);
-            return /*#__PURE__*/ React.createElement(trpc.Provider, {
-                abortOnUnmount: prepassProps.abortOnUnmount ?? false,
-                client: trpcClient,
-                queryClient: queryClient,
-                ssrState: ssrState,
-                ssrContext: ssrContext
-            }, /*#__PURE__*/ React.createElement(QueryClientProvider, {
-                client: queryClient
-            }, /*#__PURE__*/ React.createElement(HydrationBoundary, {
-                state: hydratedState
-            }, /*#__PURE__*/ React.createElement(AppOrPage, Object.assign({}, props)))));
-        };
-        if (AppOrPage.getInitialProps ?? opts.ssr) {
-            WithTRPC.getInitialProps = async (appOrPageCtx)=>{
-                const AppTree = appOrPageCtx.AppTree;
-                // Determine if we are wrapping an App component or a Page component.
-                const isApp = !!appOrPageCtx.Component;
-                const ctx = isApp ? appOrPageCtx.ctx : appOrPageCtx;
-                // Run the wrapped component's getInitialProps function.
-                let pageProps = {};
-                if (AppOrPage.getInitialProps) {
-                    const originalProps = await AppOrPage.getInitialProps(appOrPageCtx);
-                    const originalPageProps = isApp ? originalProps.pageProps ?? {} : originalProps;
-                    pageProps = {
-                        ...originalPageProps,
-                        ...pageProps
-                    };
-                }
-                const getAppTreeProps = (props)=>isApp ? {
-                        pageProps: props
-                    } : props;
-                if (typeof window !== 'undefined' || !opts.ssr) {
-                    return getAppTreeProps(pageProps);
-                }
-                const config = getClientConfig({
-                    ctx
-                });
-                const trpcClient = createTRPCUntypedClient(config);
-                const queryClient = getQueryClient(config);
-                const trpcProp = {
-                    config,
-                    trpcClient,
-                    queryClient,
-                    ssrState: 'prepass',
-                    ssrContext: ctx
-                };
-                const prepassProps = {
-                    pageProps,
-                    trpc: trpcProp
-                };
-                // Run the prepass step on AppTree. This will run all trpc queries on the server.
-                // multiple prepass ensures that we can do batching on the server
-                while(true){
-                    // render full tree
-                    await ssrPrepass(/*#__PURE__*/ createElement(AppTree, prepassProps));
-                    if (!queryClient.isFetching()) {
-                        break;
-                    }
-                    // wait until the query cache has settled it's promises
-                    await new Promise((resolve)=>{
-                        const unsub = queryClient.getQueryCache().subscribe((event)=>{
-                            if (event?.query.getObserversCount() === 0) {
-                                resolve();
-                                unsub();
-                            }
-                        });
-                    });
-                }
-                const dehydratedCache = dehydrate(queryClient, {
-                    shouldDehydrateQuery () {
-                        // makes sure errors are also dehydrated
-                        return true;
-                    }
-                });
-                // since error instances can't be serialized, let's make them into `TRPCClientErrorLike`-objects
-                const dehydratedCacheWithErrors = {
-                    ...dehydratedCache,
-                    queries: dehydratedCache.queries.map(transformQueryOrMutationCacheErrors),
-                    mutations: dehydratedCache.mutations.map(transformQueryOrMutationCacheErrors)
-                };
-                // dehydrate query client's state and add it to the props
-                pageProps.trpcState = trpcClient.runtime.combinedTransformer.output.serialize(dehydratedCacheWithErrors);
-                const appTreeProps = getAppTreeProps(pageProps);
-                const meta = opts.responseMeta?.({
-                    ctx,
-                    clientErrors: [
-                        ...dehydratedCache.queries,
-                        ...dehydratedCache.mutations
-                    ].map((v)=>v.state.error).flatMap((err)=>err instanceof Error && err.name === 'TRPCClientError' ? [
-                            err
-                        ] : [])
-                }) ?? {};
-                for (const [key, value] of Object.entries(meta.headers ?? {})){
-                    if (typeof value === 'string') {
-                        ctx.res?.setHeader(key, value);
-                    }
-                }
-                if (meta.status && ctx.res) {
-                    ctx.res.statusCode = meta.status;
-                }
-                return appTreeProps;
-            };
-        }
-        const displayName = AppOrPage.displayName ?? AppOrPage.name ?? 'Component';
-        WithTRPC.displayName = `withTRPC(${displayName})`;
-        return WithTRPC;
-    };
-}
-
-/* istanbul ignore file -- @preserve */ // We're testing this through E2E-testing
-function createTRPCNext(opts) {
-    const hooks = createRootHooks(opts);
-    // TODO: maybe set TSSRContext to `never` when using `WithTRPCNoSSROptions`
-    const _withTRPC = withTRPC(opts);
-    return createFlatProxy((key)=>{
-        if (key === 'useContext' || key === 'useUtils') {
-            return ()=>{
-                const context = hooks.useUtils();
-                // create a stable reference of the utils context
-                return useMemo(()=>{
-                    return createReactQueryUtils(context);
-                }, [
-                    context
-                ]);
-            };
-        }
-        if (key === 'useQueries') {
-            return hooks.useQueries;
-        }
-        if (key === 'withTRPC') {
-            return _withTRPC;
-        }
-        return createReactDecoration(key, hooks);
-    });
-}
-
-export { createTRPCNext, withTRPC };
+export { withTRPC } from './withTRPC.mjs';
+export { createTRPCNext } from './createTRPCNext.mjs';

package/dist/ssrPrepass.d.ts

@@ -0,0 +1,3 @@
+import type { TRPCPrepassHelper } from './withTRPC';
+export declare const ssrPrepass: TRPCPrepassHelper;
+//# sourceMappingURL=ssrPrepass.d.ts.map

package/dist/ssrPrepass.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ssrPrepass.d.ts","sourceRoot":"","sources":["../src/ssrPrepass.ts"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,iBAAiB,EAAoB,MAAM,YAAY,CAAC;AAyBtE,eAAO,MAAM,UAAU,EAAE,iBA0IxB,CAAC"}

package/dist/ssrPrepass.js

@@ -0,0 +1,139 @@
+'use strict';
+
+var reactQuery = require('@tanstack/react-query');
+var client = require('@trpc/client');
+var unstableInternals = require('@trpc/client/unstable-internals');
+var shared = require('@trpc/react-query/shared');
+var React = require('react');
+
+function transformQueryOrMutationCacheErrors(result) {
+    const error = result.state.error;
+    if (error instanceof Error && error.name === 'TRPCClientError') {
+        const newError = {
+            message: error.message,
+            data: error.data,
+            shape: error.shape
+        };
+        return {
+            ...result,
+            state: {
+                ...result.state,
+                error: newError
+            }
+        };
+    }
+    return result;
+}
+const ssrPrepass = (opts)=>{
+    const { parent , WithTRPC , AppOrPage  } = opts;
+    const transformer = unstableInternals.getTransformer(parent.transformer);
+    WithTRPC.getInitialProps = async (appOrPageCtx)=>{
+        const shouldSsr = async ()=>{
+            if (typeof window !== 'undefined') {
+                return false;
+            }
+            if (typeof parent.ssr === 'function') {
+                try {
+                    return await parent.ssr({
+                        ctx: appOrPageCtx.ctx
+                    });
+                } catch (e) {
+                    return false;
+                }
+            }
+            return parent.ssr;
+        };
+        const ssrEnabled = await shouldSsr();
+        const AppTree = appOrPageCtx.AppTree;
+        // Determine if we are wrapping an App component or a Page component.
+        const isApp = !!appOrPageCtx.Component;
+        const ctx = isApp ? appOrPageCtx.ctx : appOrPageCtx;
+        // Run the wrapped component's getInitialProps function.
+        let pageProps = {};
+        if (AppOrPage.getInitialProps) {
+            const originalProps = await AppOrPage.getInitialProps(appOrPageCtx);
+            const originalPageProps = isApp ? originalProps.pageProps ?? {} : originalProps;
+            pageProps = {
+                ...originalPageProps,
+                ...pageProps
+            };
+        }
+        const getAppTreeProps = (props)=>isApp ? {
+                pageProps: props
+            } : props;
+        if (typeof window !== 'undefined' || !ssrEnabled) {
+            return getAppTreeProps(pageProps);
+        }
+        const config = parent.config({
+            ctx
+        });
+        const trpcClient = client.createTRPCUntypedClient(config);
+        const queryClient = shared.getQueryClient(config);
+        const trpcProp = {
+            config,
+            trpcClient,
+            queryClient,
+            ssrState: 'prepass',
+            ssrContext: ctx
+        };
+        const prepassProps = {
+            pageProps,
+            trpc: trpcProp
+        };
+        const reactDomServer = await import('react-dom/server');
+        // Run the prepass step on AppTree. This will run all trpc queries on the server.
+        // multiple prepass ensures that we can do batching on the server
+        while(true){
+            // render full tree
+            reactDomServer.renderToString(React.createElement(AppTree, prepassProps));
+            if (!queryClient.isFetching()) {
+                break;
+            }
+            // wait until the query cache has settled it's promises
+            await new Promise((resolve)=>{
+                const unsub = queryClient.getQueryCache().subscribe((event)=>{
+                    if (event?.query.getObserversCount() === 0) {
+                        resolve();
+                        unsub();
+                    }
+                });
+            });
+        }
+        const dehydratedCache = reactQuery.dehydrate(queryClient, {
+            shouldDehydrateQuery (query) {
+                // filter out queries that are marked as trpc: { ssr: false } or are not enabled, but make sure errors are dehydrated
+                const isExcludedFromSSr = query.state.fetchStatus === 'idle' && query.state.status === 'pending';
+                return !isExcludedFromSSr;
+            }
+        });
+        // since error instances can't be serialized, let's make them into `TRPCClientErrorLike`-objects
+        const dehydratedCacheWithErrors = {
+            ...dehydratedCache,
+            queries: dehydratedCache.queries.map(transformQueryOrMutationCacheErrors),
+            mutations: dehydratedCache.mutations.map(transformQueryOrMutationCacheErrors)
+        };
+        // dehydrate query client's state and add it to the props
+        pageProps['trpcState'] = transformer.input.serialize(dehydratedCacheWithErrors);
+        const appTreeProps = getAppTreeProps(pageProps);
+        const meta = parent.responseMeta?.({
+            ctx,
+            clientErrors: [
+                ...dehydratedCache.queries,
+                ...dehydratedCache.mutations
+            ].map((v)=>v.state.error).flatMap((err)=>err instanceof Error && err.name === 'TRPCClientError' ? [
+                    err
+                ] : [])
+        }) ?? {};
+        for (const [key, value] of Object.entries(meta.headers ?? {})){
+            if (typeof value === 'string') {
+                ctx.res?.setHeader(key, value);
+            }
+        }
+        if (meta.status && ctx.res) {
+            ctx.res.statusCode = meta.status;
+        }
+        return appTreeProps;
+    };
+};
+
+exports.ssrPrepass = ssrPrepass;

package/dist/ssrPrepass.mjs

@@ -0,0 +1,137 @@
+import { dehydrate } from '@tanstack/react-query';
+import { createTRPCUntypedClient } from '@trpc/client';
+import { getTransformer } from '@trpc/client/unstable-internals';
+import { getQueryClient } from '@trpc/react-query/shared';
+import { createElement } from 'react';
+
+function transformQueryOrMutationCacheErrors(result) {
+    const error = result.state.error;
+    if (error instanceof Error && error.name === 'TRPCClientError') {
+        const newError = {
+            message: error.message,
+            data: error.data,
+            shape: error.shape
+        };
+        return {
+            ...result,
+            state: {
+                ...result.state,
+                error: newError
+            }
+        };
+    }
+    return result;
+}
+const ssrPrepass = (opts)=>{
+    const { parent , WithTRPC , AppOrPage  } = opts;
+    const transformer = getTransformer(parent.transformer);
+    WithTRPC.getInitialProps = async (appOrPageCtx)=>{
+        const shouldSsr = async ()=>{
+            if (typeof window !== 'undefined') {
+                return false;
+            }
+            if (typeof parent.ssr === 'function') {
+                try {
+                    return await parent.ssr({
+                        ctx: appOrPageCtx.ctx
+                    });
+                } catch (e) {
+                    return false;
+                }
+            }
+            return parent.ssr;
+        };
+        const ssrEnabled = await shouldSsr();
+        const AppTree = appOrPageCtx.AppTree;
+        // Determine if we are wrapping an App component or a Page component.
+        const isApp = !!appOrPageCtx.Component;
+        const ctx = isApp ? appOrPageCtx.ctx : appOrPageCtx;
+        // Run the wrapped component's getInitialProps function.
+        let pageProps = {};
+        if (AppOrPage.getInitialProps) {
+            const originalProps = await AppOrPage.getInitialProps(appOrPageCtx);
+            const originalPageProps = isApp ? originalProps.pageProps ?? {} : originalProps;
+            pageProps = {
+                ...originalPageProps,
+                ...pageProps
+            };
+        }
+        const getAppTreeProps = (props)=>isApp ? {
+                pageProps: props
+            } : props;
+        if (typeof window !== 'undefined' || !ssrEnabled) {
+            return getAppTreeProps(pageProps);
+        }
+        const config = parent.config({
+            ctx
+        });
+        const trpcClient = createTRPCUntypedClient(config);
+        const queryClient = getQueryClient(config);
+        const trpcProp = {
+            config,
+            trpcClient,
+            queryClient,
+            ssrState: 'prepass',
+            ssrContext: ctx
+        };
+        const prepassProps = {
+            pageProps,
+            trpc: trpcProp
+        };
+        const reactDomServer = await import('react-dom/server');
+        // Run the prepass step on AppTree. This will run all trpc queries on the server.
+        // multiple prepass ensures that we can do batching on the server
+        while(true){
+            // render full tree
+            reactDomServer.renderToString(createElement(AppTree, prepassProps));
+            if (!queryClient.isFetching()) {
+                break;
+            }
+            // wait until the query cache has settled it's promises
+            await new Promise((resolve)=>{
+                const unsub = queryClient.getQueryCache().subscribe((event)=>{
+                    if (event?.query.getObserversCount() === 0) {
+                        resolve();
+                        unsub();
+                    }
+                });
+            });
+        }
+        const dehydratedCache = dehydrate(queryClient, {
+            shouldDehydrateQuery (query) {
+                // filter out queries that are marked as trpc: { ssr: false } or are not enabled, but make sure errors are dehydrated
+                const isExcludedFromSSr = query.state.fetchStatus === 'idle' && query.state.status === 'pending';
+                return !isExcludedFromSSr;
+            }
+        });
+        // since error instances can't be serialized, let's make them into `TRPCClientErrorLike`-objects
+        const dehydratedCacheWithErrors = {
+            ...dehydratedCache,
+            queries: dehydratedCache.queries.map(transformQueryOrMutationCacheErrors),
+            mutations: dehydratedCache.mutations.map(transformQueryOrMutationCacheErrors)
+        };
+        // dehydrate query client's state and add it to the props
+        pageProps['trpcState'] = transformer.input.serialize(dehydratedCacheWithErrors);
+        const appTreeProps = getAppTreeProps(pageProps);
+        const meta = parent.responseMeta?.({
+            ctx,
+            clientErrors: [
+                ...dehydratedCache.queries,
+                ...dehydratedCache.mutations
+            ].map((v)=>v.state.error).flatMap((err)=>err instanceof Error && err.name === 'TRPCClientError' ? [
+                    err
+                ] : [])
+        }) ?? {};
+        for (const [key, value] of Object.entries(meta.headers ?? {})){
+            if (typeof value === 'string') {
+                ctx.res?.setHeader(key, value);
+            }
+        }
+        if (meta.status && ctx.res) {
+            ctx.res.statusCode = meta.status;
+        }
+        return appTreeProps;
+    };
+};
+
+export { ssrPrepass };

package/dist/withTRPC.d.ts

@@ -1,27 +1,55 @@
-import { CreateTRPCClientOptions } from '@trpc/client';
-import { TRPCClientError } from '@trpc/react-query';
-import { CreateTRPCReactOptions, CreateTRPCReactQueryClientConfig } from '@trpc/react-query/shared';
-import type { AnyRouter } from '@trpc/server';
-import type { ResponseMeta } from '@trpc/server/http';
-import { NextComponentType, NextPageContext } from 'next/dist/shared/lib/utils';
+/**
+ * Heavily based on urql's ssr
+ * https://github.com/FormidableLabs/urql/blob/main/packages/next-urql/src/with-urql-client.ts
+ */
+import type { QueryClient } from '@tanstack/react-query';
+import type { CreateTRPCClientOptions, TRPCUntypedClient } from '@trpc/client';
+import { type TransformerOptions } from '@trpc/client/unstable-internals';
+import type { TRPCClientError } from '@trpc/react-query';
+import type { CreateTRPCReactOptions, CreateTRPCReactQueryClientConfig } from '@trpc/react-query/shared';
+import type { AnyRouter, inferClientTypes, ResponseMeta } from '@trpc/server/unstable-core-do-not-import';
+import type { NextComponentType, NextPageContext } from 'next/dist/shared/lib/utils';
 export type WithTRPCConfig<TRouter extends AnyRouter> = CreateTRPCClientOptions<TRouter> & CreateTRPCReactQueryClientConfig & {
     abortOnUnmount?: boolean;
 };
-interface WithTRPCOptions<TRouter extends AnyRouter> extends CreateTRPCReactOptions<TRouter> {
+type WithTRPCOptions<TRouter extends AnyRouter> = CreateTRPCReactOptions<TRouter> & {
     config: (info: {
         ctx?: NextPageContext;
     }) => WithTRPCConfig<TRouter>;
-}
-export interface WithTRPCSSROptions<TRouter extends AnyRouter> extends WithTRPCOptions<TRouter> {
-    ssr: true;
+} & TransformerOptions<inferClientTypes<TRouter>>;
+export type TRPCPrepassHelper = (opts: {
+    parent: WithTRPCSSROptions<AnyRouter>;
+    WithTRPC: NextComponentType<any, any, any>;
+    AppOrPage: NextComponentType<any, any, any>;
+}) => void;
+export type WithTRPCSSROptions<TRouter extends AnyRouter> = WithTRPCOptions<TRouter> & {
+    /**
+     * If you enable this, you also need to add a `ssrPrepass`-prop
+     * @link https://trpc.io/docs/client/nextjs/ssr
+     */
+    ssr: true | ((opts: {
+        ctx: NextPageContext;
+    }) => boolean | Promise<boolean>);
     responseMeta?: (opts: {
         ctx: NextPageContext;
         clientErrors: TRPCClientError<TRouter>[];
     }) => ResponseMeta;
-}
-export interface WithTRPCNoSSROptions<TRouter extends AnyRouter> extends WithTRPCOptions<TRouter> {
+    /**
+     * use `import { ssrPrepass } from '@trpc/next/ssrPrepass'`
+     * @link https://trpc.io/docs/client/nextjs/ssr
+     */
+    ssrPrepass: TRPCPrepassHelper;
+};
+export type WithTRPCNoSSROptions<TRouter extends AnyRouter> = WithTRPCOptions<TRouter> & {
     ssr?: false;
-}
+};
+export type TRPCPrepassProps<TRouter extends AnyRouter, TSSRContext extends NextPageContext = NextPageContext> = {
+    config: WithTRPCConfig<TRouter>;
+    queryClient: QueryClient;
+    trpcClient: TRPCUntypedClient<TRouter>;
+    ssrState: 'prepass';
+    ssrContext: TSSRContext;
+};
 export declare function withTRPC<TRouter extends AnyRouter, TSSRContext extends NextPageContext = NextPageContext>(opts: WithTRPCNoSSROptions<TRouter> | WithTRPCSSROptions<TRouter>): (AppOrPage: NextComponentType<any, any, any>) => NextComponentType;
 export {};
 //# sourceMappingURL=withTRPC.d.ts.map

package/dist/withTRPC.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"withTRPC.d.ts","sourceRoot":"","sources":["../src/withTRPC.tsx"],"names":[],"mappings":"AAWA,OAAO,EACL,uBAAuB,EAGxB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,eAAe,EAAuB,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAEL,sBAAsB,EACtB,gCAAgC,EAEjC,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,EAAE,SAAS,EAAe,MAAM,cAAc,CAAC;AAC3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,EAGL,iBAAiB,EACjB,eAAe,EAChB,MAAM,4BAA4B,CAAC;AA2BpC,MAAM,MAAM,cAAc,CAAC,OAAO,SAAS,SAAS,IAClD,uBAAuB,CAAC,OAAO,CAAC,GAC9B,gCAAgC,GAAG;IACjC,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEN,UAAU,eAAe,CAAC,OAAO,SAAS,SAAS,CACjD,SAAQ,sBAAsB,CAAC,OAAO,CAAC;IACvC,MAAM,EAAE,CAAC,IAAI,EAAE;QAAE,GAAG,CAAC,EAAE,eAAe,CAAA;KAAE,KAAK,cAAc,CAAC,OAAO,CAAC,CAAC;CACtE;AAED,MAAM,WAAW,kBAAkB,CAAC,OAAO,SAAS,SAAS,CAC3D,SAAQ,eAAe,CAAC,OAAO,CAAC;IAChC,GAAG,EAAE,IAAI,CAAC;IACV,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QACpB,GAAG,EAAE,eAAe,CAAC;QACrB,YAAY,EAAE,eAAe,CAAC,OAAO,CAAC,EAAE,CAAC;KAC1C,KAAK,YAAY,CAAC;CACpB;AACD,MAAM,WAAW,oBAAoB,CAAC,OAAO,SAAS,SAAS,CAC7D,SAAQ,eAAe,CAAC,OAAO,CAAC;IAChC,GAAG,CAAC,EAAE,KAAK,CAAC;CACb;AAED,wBAAgB,QAAQ,CACtB,OAAO,SAAS,SAAS,EACzB,WAAW,SAAS,eAAe,GAAG,eAAe,EACrD,IAAI,EAAE,oBAAoB,CAAC,OAAO,CAAC,GAAG,kBAAkB,CAAC,OAAO,CAAC,eAU9C,kBAAkB,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,KAAG,iBAAiB,CA+KxE"}
+{"version":3,"file":"withTRPC.d.ts","sourceRoot":"","sources":["../src/withTRPC.tsx"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAmB,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAE1E,OAAO,KAAK,EAAE,uBAAuB,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAE/E,OAAO,EAEL,KAAK,kBAAkB,EACxB,MAAM,iCAAiC,CAAC;AACzC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,KAAK,EACV,sBAAsB,EACtB,gCAAgC,EACjC,MAAM,0BAA0B,CAAC;AAElC,OAAO,KAAK,EACV,SAAS,EAET,gBAAgB,EAChB,YAAY,EACb,MAAM,0CAA0C,CAAC;AAClD,OAAO,KAAK,EAGV,iBAAiB,EACjB,eAAe,EAChB,MAAM,4BAA4B,CAAC;AAIpC,MAAM,MAAM,cAAc,CAAC,OAAO,SAAS,SAAS,IAClD,uBAAuB,CAAC,OAAO,CAAC,GAC9B,gCAAgC,GAAG;IACjC,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,CAAC;AAEN,KAAK,eAAe,CAAC,OAAO,SAAS,SAAS,IAC5C,sBAAsB,CAAC,OAAO,CAAC,GAAG;IAChC,MAAM,EAAE,CAAC,IAAI,EAAE;QAAE,GAAG,CAAC,EAAE,eAAe,CAAA;KAAE,KAAK,cAAc,CAAC,OAAO,CAAC,CAAC;CACtE,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC,CAAC;AAEpD,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE;IACrC,MAAM,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACtC,QAAQ,EAAE,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;IAC3C,SAAS,EAAE,iBAAiB,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC;CAC7C,KAAK,IAAI,CAAC;AACX,MAAM,MAAM,kBAAkB,CAAC,OAAO,SAAS,SAAS,IACtD,eAAe,CAAC,OAAO,CAAC,GAAG;IACzB;;;OAGG;IACH,GAAG,EACC,IAAI,GACJ,CAAC,CAAC,IAAI,EAAE;QAAE,GAAG,EAAE,eAAe,CAAA;KAAE,KAAK,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC;IACrE,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE;QACpB,GAAG,EAAE,eAAe,CAAC;QACrB,YAAY,EAAE,eAAe,CAAC,OAAO,CAAC,EAAE,CAAC;KAC1C,KAAK,YAAY,CAAC;IACnB;;;OAGG;IACH,UAAU,EAAE,iBAAiB,CAAC;CAC/B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,CAAC,OAAO,SAAS,SAAS,IACxD,eAAe,CAAC,OAAO,CAAC,GAAG;IACzB,GAAG,CAAC,EAAE,KAAK,CAAC;CACb,CAAC;AAEJ,MAAM,MAAM,gBAAgB,CAC1B,OAAO,SAAS,SAAS,EACzB,WAAW,SAAS,eAAe,GAAG,eAAe,IACnD;IACF,MAAM,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IAChC,WAAW,EAAE,WAAW,CAAC;IACzB,UAAU,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;IACvC,QAAQ,EAAE,SAAS,CAAC;IACpB,UAAU,EAAE,WAAW,CAAC;CACzB,CAAC;AAEF,wBAAgB,QAAQ,CACtB,OAAO,SAAS,SAAS,EACzB,WAAW,SAAS,eAAe,GAAG,eAAe,EACrD,IAAI,EAAE,oBAAoB,CAAC,OAAO,CAAC,GAAG,kBAAkB,CAAC,OAAO,CAAC,eAO9C,kBAAkB,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC,KAAG,iBAAiB,CAgGxE"}

package/dist/withTRPC.js

@@ -0,0 +1,86 @@
+'use strict';
+
+var reactQuery = require('@tanstack/react-query');
+var unstableInternals = require('@trpc/client/unstable-internals');
+var shared = require('@trpc/react-query/shared');
+var React = require('react');
+
+function withTRPC(opts) {
+    const { config: getClientConfig  } = opts;
+    const transformer = unstableInternals.getTransformer(opts.transformer);
+    return (AppOrPage)=>{
+        const trpc = shared.createRootHooks(opts);
+        const WithTRPC = (props)=>{
+            const [prepassProps] = React.useState(()=>{
+                if (props.trpc) {
+                    return props.trpc;
+                }
+                const config = getClientConfig({});
+                const queryClient = shared.getQueryClient(config);
+                const trpcClient = trpc.createClient(config);
+                return {
+                    abortOnUnmount: config.abortOnUnmount,
+                    queryClient,
+                    trpcClient,
+                    ssrState: opts.ssr ? 'mounting' : false,
+                    ssrContext: null
+                };
+            });
+            const { queryClient , trpcClient , ssrState , ssrContext  } = prepassProps;
+            // allow normal components to be wrapped, not just app/pages
+            const trpcState = props.pageProps?.trpcState;
+            const hydratedState = React.useMemo(()=>{
+                if (!trpcState) {
+                    return trpcState;
+                }
+                return transformer.input.deserialize(trpcState);
+            // eslint-disable-next-line react-hooks/exhaustive-deps
+            }, [
+                trpcState,
+                trpcClient
+            ]);
+            return /*#__PURE__*/ React.createElement(trpc.Provider, {
+                abortOnUnmount: prepassProps.abortOnUnmount ?? false,
+                client: trpcClient,
+                queryClient: queryClient,
+                ssrState: ssrState,
+                ssrContext: ssrContext
+            }, /*#__PURE__*/ React.createElement(reactQuery.QueryClientProvider, {
+                client: queryClient
+            }, /*#__PURE__*/ React.createElement(reactQuery.HydrationBoundary, {
+                state: hydratedState
+            }, /*#__PURE__*/ React.createElement(AppOrPage, Object.assign({}, props)))));
+        };
+        if (opts.ssr) {
+            opts.ssrPrepass({
+                parent: opts,
+                AppOrPage,
+                WithTRPC
+            });
+        } else if (AppOrPage.getInitialProps) {
+            // Allow combining `getServerSideProps` and `getInitialProps`
+            WithTRPC.getInitialProps = async (appOrPageCtx)=>{
+                // Determine if we are wrapping an App component or a Page component.
+                const isApp = !!appOrPageCtx.Component;
+                // Run the wrapped component's getInitialProps function.
+                let pageProps = {};
+                // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                const originalProps = await AppOrPage.getInitialProps(appOrPageCtx);
+                const originalPageProps = isApp ? originalProps.pageProps ?? {} : originalProps;
+                pageProps = {
+                    ...originalPageProps,
+                    ...pageProps
+                };
+                const getAppTreeProps = (props)=>isApp ? {
+                        pageProps: props
+                    } : props;
+                return getAppTreeProps(pageProps);
+            };
+        }
+        const displayName = AppOrPage.displayName ?? AppOrPage.name ?? 'Component';
+        WithTRPC.displayName = `withTRPC(${displayName})`;
+        return WithTRPC;
+    };
+}
+
+exports.withTRPC = withTRPC;