@trpc/react-query 10.43.0 → 11.0.0-next.92

package/dist/bundle-analysis.json

@@ -0,0 +1,208 @@
+{
+  "bundleSize": 26612,
+  "bundleOrigSize": 58916,
+  "bundleReduction": 54.83,
+  "modules": [
+    {
+      "id": "/src/shared/hooks/createHooksInternal.tsx",
+      "size": 16054,
+      "origSize": 18460,
+      "renderedExports": [
+        "createRootHooks"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/createTRPCReact.tsx"
+      ],
+      "percent": 60.33,
+      "reduction": 13.03
+    },
+    {
+      "id": "/src/server/ssgProxy.ts",
+      "size": 3636,
+      "origSize": 7050,
+      "renderedExports": [
+        "createServerSideHelpers"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/server/index.ts"
+      ],
+      "percent": 13.66,
+      "reduction": 48.43
+    },
+    {
+      "id": "/src/shared/proxy/utilsProxy.ts",
+      "size": 2496,
+      "origSize": 9808,
+      "renderedExports": [
+        "getQueryType",
+        "createReactQueryUtils"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts"
+      ],
+      "percent": 9.38,
+      "reduction": 74.55
+    },
+    {
+      "id": "/src/internals/getQueryKey.ts",
+      "size": 1546,
+      "origSize": 3901,
+      "renderedExports": [
+        "getQueryKeyInternal",
+        "getQueryKey"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/index.ts",
+        "/src/server/ssgProxy.ts",
+        "/src/shared/proxy/utilsProxy.ts",
+        "/src/shared/proxy/useQueriesProxy.ts",
+        "/src/shared/hooks/createHooksInternal.tsx"
+      ],
+      "percent": 5.81,
+      "reduction": 60.37
+    },
+    {
+      "id": "/src/createTRPCReact.tsx",
+      "size": 828,
+      "origSize": 8519,
+      "renderedExports": [
+        "createHooksInternal",
+        "createTRPCReact"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/index.ts"
+      ],
+      "percent": 3.11,
+      "reduction": 90.28
+    },
+    {
+      "id": "/src/shared/proxy/decorationProxy.ts",
+      "size": 789,
+      "origSize": 990,
+      "renderedExports": [
+        "createReactDecoration"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts"
+      ],
+      "percent": 2.96,
+      "reduction": 20.3
+    },
+    {
+      "id": "/src/shared/proxy/useQueriesProxy.ts",
+      "size": 551,
+      "origSize": 2122,
+      "renderedExports": [
+        "createUseQueries"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts",
+        "/src/shared/hooks/createHooksInternal.tsx"
+      ],
+      "percent": 2.07,
+      "reduction": 74.03
+    },
+    {
+      "id": "/src/internals/getClientArgs.ts",
+      "size": 244,
+      "origSize": 337,
+      "renderedExports": [
+        "getClientArgs"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts",
+        "/src/shared/hooks/createHooksInternal.tsx"
+      ],
+      "percent": 0.92,
+      "reduction": 27.6
+    },
+    {
+      "id": "/src/internals/useHookResult.ts",
+      "size": 184,
+      "origSize": 336,
+      "renderedExports": [
+        "useHookResult"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/hooks/createHooksInternal.tsx"
+      ],
+      "percent": 0.69,
+      "reduction": 45.24
+    },
+    {
+      "id": "/src/internals/context.tsx",
+      "size": 155,
+      "origSize": 5939,
+      "renderedExports": [
+        "contextProps",
+        "TRPCContext"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts",
+        "/src/shared/index.ts",
+        "/src/shared/proxy/utilsProxy.ts",
+        "/src/shared/hooks/createHooksInternal.tsx"
+      ],
+      "percent": 0.58,
+      "reduction": 97.39
+    },
+    {
+      "id": "/src/shared/queryClient.ts",
+      "size": 129,
+      "origSize": 469,
+      "renderedExports": [
+        "getQueryClient"
+      ],
+      "removedExports": [],
+      "dependents": [
+        "/src/shared/index.ts"
+      ],
+      "percent": 0.48,
+      "reduction": 72.49
+    },
+    {
+      "id": "/src/index.ts",
+      "size": 0,
+      "origSize": 250,
+      "renderedExports": [],
+      "removedExports": [],
+      "dependents": [],
+      "percent": 0,
+      "reduction": 100
+    },
+    {
+      "id": "/src/server/index.ts",
+      "size": 0,
+      "origSize": 54,
+      "renderedExports": [],
+      "removedExports": [],
+      "dependents": [],
+      "percent": 0,
+      "reduction": 100
+    },
+    {
+      "id": "/src/shared/index.ts",
+      "size": 0,
+      "origSize": 681,
+      "renderedExports": [],
+      "removedExports": [],
+      "dependents": [
+        "/src/createTRPCReact.tsx",
+        "/src/server/ssgProxy.ts"
+      ],
+      "percent": 0,
+      "reduction": 100
+    }
+  ],
+  "moduleCount": 14
+}

package/dist/createHooksInternal-3d8ebfcf.mjs

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