@trpc/react-query 10.0.0-proxy-beta.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (65) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +88 -0
  3. package/dist/createHooksInternal-b47ee704.mjs +392 -0
  4. package/dist/createHooksInternal-e8214d72.js +400 -0
  5. package/dist/createTRPCReact.d.ts +38 -0
  6. package/dist/createTRPCReact.d.ts.map +1 -0
  7. package/dist/getArrayQueryKey-062214e0.mjs +19 -0
  8. package/dist/getArrayQueryKey-a2092b3c.js +21 -0
  9. package/dist/index.d.ts +4 -0
  10. package/dist/index.d.ts.map +1 -0
  11. package/dist/index.js +58 -0
  12. package/dist/index.mjs +47 -0
  13. package/dist/internals/context.d.ts +99 -0
  14. package/dist/internals/context.d.ts.map +1 -0
  15. package/dist/internals/getArrayQueryKey.d.ts +9 -0
  16. package/dist/internals/getArrayQueryKey.d.ts.map +1 -0
  17. package/dist/internals/getQueryKey.d.ts +6 -0
  18. package/dist/internals/getQueryKey.d.ts.map +1 -0
  19. package/dist/interop.d.ts +10 -0
  20. package/dist/interop.d.ts.map +1 -0
  21. package/dist/queryClient-0569f6e0.mjs +7 -0
  22. package/dist/queryClient-83576230.js +9 -0
  23. package/dist/shared/hooks/createHooksInternal.d.ts +115 -0
  24. package/dist/shared/hooks/createHooksInternal.d.ts.map +1 -0
  25. package/dist/shared/index.d.ts +6 -0
  26. package/dist/shared/index.d.ts.map +1 -0
  27. package/dist/shared/index.js +18 -0
  28. package/dist/shared/index.mjs +7 -0
  29. package/dist/shared/proxy/decorationProxy.d.ts +8 -0
  30. package/dist/shared/proxy/decorationProxy.d.ts.map +1 -0
  31. package/dist/shared/proxy/utilsProxy.d.ts +80 -0
  32. package/dist/shared/proxy/utilsProxy.d.ts.map +1 -0
  33. package/dist/shared/queryClient.d.ts +16 -0
  34. package/dist/shared/queryClient.d.ts.map +1 -0
  35. package/dist/shared/types.d.ts +26 -0
  36. package/dist/shared/types.d.ts.map +1 -0
  37. package/dist/ssg/index.d.ts +5 -0
  38. package/dist/ssg/index.d.ts.map +1 -0
  39. package/dist/ssg/index.js +126 -0
  40. package/dist/ssg/index.mjs +121 -0
  41. package/dist/ssg/ssg.d.ts +23 -0
  42. package/dist/ssg/ssg.d.ts.map +1 -0
  43. package/dist/ssg/ssgProxy.d.ts +36 -0
  44. package/dist/ssg/ssgProxy.d.ts.map +1 -0
  45. package/package.json +75 -0
  46. package/shared/index.d.ts +1 -0
  47. package/shared/index.js +1 -0
  48. package/src/createTRPCReact.tsx +164 -0
  49. package/src/index.ts +4 -0
  50. package/src/internals/context.tsx +235 -0
  51. package/src/internals/getArrayQueryKey.test.ts +41 -0
  52. package/src/internals/getArrayQueryKey.ts +18 -0
  53. package/src/internals/getQueryKey.ts +10 -0
  54. package/src/interop.ts +25 -0
  55. package/src/shared/hooks/createHooksInternal.tsx +664 -0
  56. package/src/shared/index.ts +8 -0
  57. package/src/shared/proxy/decorationProxy.ts +33 -0
  58. package/src/shared/proxy/utilsProxy.ts +266 -0
  59. package/src/shared/queryClient.ts +20 -0
  60. package/src/shared/types.ts +27 -0
  61. package/src/ssg/index.ts +4 -0
  62. package/src/ssg/ssg.ts +138 -0
  63. package/src/ssg/ssgProxy.ts +105 -0
  64. package/ssg/index.d.ts +1 -0
  65. package/ssg/index.js +1 -0
@@ -0,0 +1,400 @@
1
+ 'use strict';
2
+
3
+ var shared = require('@trpc/server/shared');
4
+ var reactQuery = require('@tanstack/react-query');
5
+ var client = require('@trpc/client');
6
+ var React = require('react');
7
+ var getArrayQueryKey = require('./getArrayQueryKey-a2092b3c.js');
8
+
9
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
+
11
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
+
13
+ /**
14
+ * We treat `undefined` as an input the same as omitting an `input`
15
+ * https://github.com/trpc/trpc/issues/2290
16
+ */ function getQueryKey(path, input) {
17
+ return input === undefined ? [
18
+ path
19
+ ] : [
20
+ path,
21
+ input
22
+ ];
23
+ }
24
+
25
+ /**
26
+ * Create proxy for decorating procedures
27
+ * @internal
28
+ */ function createReactProxyDecoration(name, hooks) {
29
+ return shared.createRecursiveProxy((opts)=>{
30
+ const args = opts.args;
31
+ const pathCopy = [
32
+ name,
33
+ ...opts.path
34
+ ];
35
+ // The last arg is for instance `.useMutation` or `.useQuery()`
36
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
37
+ const lastArg = pathCopy.pop();
38
+ // The `path` ends up being something like `post.byId`
39
+ const path = pathCopy.join('.');
40
+ if (lastArg === 'useMutation') {
41
+ return hooks[lastArg](path, ...args);
42
+ }
43
+ const [input, ...rest] = args;
44
+ const queryKey = getQueryKey(path, input);
45
+ return hooks[lastArg](queryKey, ...rest);
46
+ });
47
+ }
48
+
49
+ const contextProps = [
50
+ 'client',
51
+ 'ssrContext',
52
+ 'ssrState',
53
+ 'abortOnUnmount'
54
+ ];
55
+ const TRPCContext = /*#__PURE__*/ React.createContext(null);
56
+
57
+ /**
58
+ * @internal
59
+ */ function createReactQueryUtilsProxy(context) {
60
+ return shared.createFlatProxy((key)=>{
61
+ const contextName = key;
62
+ if (contextProps.includes(contextName)) {
63
+ return context[contextName];
64
+ }
65
+ return shared.createRecursiveProxy(({ path , args })=>{
66
+ const pathCopy = [
67
+ key,
68
+ ...path
69
+ ];
70
+ const utilName = pathCopy.pop();
71
+ const fullPath = pathCopy.join('.');
72
+ const getOpts = (name)=>{
73
+ if ([
74
+ 'setData',
75
+ 'setInfiniteData'
76
+ ].includes(name)) {
77
+ const [updater, input, ...rest] = args;
78
+ const queryKey = getQueryKey(fullPath, input);
79
+ return {
80
+ queryKey,
81
+ updater,
82
+ rest
83
+ };
84
+ }
85
+ const [input1, ...rest1] = args;
86
+ const queryKey1 = getQueryKey(fullPath, input1);
87
+ return {
88
+ queryKey: queryKey1,
89
+ rest: rest1
90
+ };
91
+ };
92
+ const { queryKey , rest , updater } = getOpts(utilName);
93
+ const contextMap = {
94
+ fetch: ()=>context.fetchQuery(queryKey, ...rest),
95
+ fetchInfinite: ()=>context.fetchInfiniteQuery(queryKey, ...rest),
96
+ prefetch: ()=>context.prefetchQuery(queryKey, ...rest),
97
+ prefetchInfinite: ()=>context.prefetchInfiniteQuery(queryKey, ...rest),
98
+ invalidate: ()=>context.invalidateQueries(queryKey, ...rest),
99
+ refetch: ()=>context.refetchQueries(queryKey, ...rest),
100
+ cancel: ()=>context.cancelQuery(queryKey, ...rest),
101
+ setData: ()=>context.setQueryData(queryKey, updater, ...rest),
102
+ setInfiniteData: ()=>context.setInfiniteQueryData(queryKey, updater, ...rest),
103
+ getData: ()=>context.getQueryData(queryKey),
104
+ getInfiniteData: ()=>context.getInfiniteQueryData(queryKey)
105
+ };
106
+ return contextMap[utilName]();
107
+ });
108
+ });
109
+ }
110
+
111
+ function getClientArgs(pathAndInput, opts) {
112
+ const [path, input] = pathAndInput;
113
+ return [
114
+ path,
115
+ input,
116
+ opts?.trpc
117
+ ];
118
+ }
119
+ /**
120
+ * Makes a stable reference of the `trpc` prop
121
+ */ function useHookResult(value) {
122
+ const ref = React.useRef(value);
123
+ ref.current.path = value.path;
124
+ return ref.current;
125
+ }
126
+ /**
127
+ * Create strongly typed react hooks
128
+ * @internal
129
+ */ function createHooksInternal(config) {
130
+ const mutationSuccessOverride = config?.unstable_overrides?.useMutation?.onSuccess ?? ((options)=>options.originalFn());
131
+ const Context = TRPCContext;
132
+ const createClient = (opts)=>{
133
+ return client.createTRPCClient(opts);
134
+ };
135
+ const TRPCProvider = (props)=>{
136
+ const { abortOnUnmount =false , client , queryClient , ssrContext } = props;
137
+ const [ssrState, setSSRState] = React.useState(props.ssrState ?? false);
138
+ React.useEffect(()=>{
139
+ // Only updating state to `mounted` if we are using SSR.
140
+ // This makes it so we don't have an unnecessary re-render when opting out of SSR.
141
+ setSSRState((state)=>state ? 'mounted' : false);
142
+ }, []);
143
+ return /*#__PURE__*/ React__default["default"].createElement(Context.Provider, {
144
+ value: {
145
+ abortOnUnmount,
146
+ queryClient,
147
+ client,
148
+ ssrContext: ssrContext || null,
149
+ ssrState,
150
+ fetchQuery: React.useCallback((pathAndInput, opts)=>{
151
+ return queryClient.fetchQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), ()=>client.query(...getClientArgs(pathAndInput, opts)), opts);
152
+ }, [
153
+ client,
154
+ queryClient
155
+ ]),
156
+ fetchInfiniteQuery: React.useCallback((pathAndInput, opts)=>{
157
+ return queryClient.fetchInfiniteQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), ({ pageParam })=>{
158
+ const [path, input] = pathAndInput;
159
+ const actualInput = {
160
+ ...input,
161
+ cursor: pageParam
162
+ };
163
+ return client.query(...getClientArgs([
164
+ path,
165
+ actualInput
166
+ ], opts));
167
+ }, opts);
168
+ }, [
169
+ client,
170
+ queryClient
171
+ ]),
172
+ prefetchQuery: React.useCallback((pathAndInput, opts)=>{
173
+ return queryClient.prefetchQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), ()=>client.query(...getClientArgs(pathAndInput, opts)), opts);
174
+ }, [
175
+ client,
176
+ queryClient
177
+ ]),
178
+ prefetchInfiniteQuery: React.useCallback((pathAndInput, opts)=>{
179
+ return queryClient.prefetchInfiniteQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), ({ pageParam })=>{
180
+ const [path, input] = pathAndInput;
181
+ const actualInput = {
182
+ ...input,
183
+ cursor: pageParam
184
+ };
185
+ return client.query(...getClientArgs([
186
+ path,
187
+ actualInput
188
+ ], opts));
189
+ }, opts);
190
+ }, [
191
+ client,
192
+ queryClient
193
+ ]),
194
+ invalidateQueries: React.useCallback((...args)=>{
195
+ const [queryKey, ...rest] = args;
196
+ return queryClient.invalidateQueries(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
197
+ }, [
198
+ queryClient
199
+ ]),
200
+ refetchQueries: React.useCallback((...args)=>{
201
+ const [queryKey, ...rest] = args;
202
+ return queryClient.refetchQueries(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
203
+ }, [
204
+ queryClient
205
+ ]),
206
+ cancelQuery: React.useCallback((pathAndInput)=>{
207
+ return queryClient.cancelQueries(getArrayQueryKey.getArrayQueryKey(pathAndInput));
208
+ }, [
209
+ queryClient
210
+ ]),
211
+ setQueryData: React.useCallback((...args)=>{
212
+ const [queryKey, ...rest] = args;
213
+ return queryClient.setQueryData(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
214
+ }, [
215
+ queryClient
216
+ ]),
217
+ getQueryData: React.useCallback((...args)=>{
218
+ const [queryKey, ...rest] = args;
219
+ return queryClient.getQueryData(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
220
+ }, [
221
+ queryClient
222
+ ]),
223
+ setInfiniteQueryData: React.useCallback((...args)=>{
224
+ const [queryKey, ...rest] = args;
225
+ return queryClient.setQueryData(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
226
+ }, [
227
+ queryClient
228
+ ]),
229
+ getInfiniteQueryData: React.useCallback((...args)=>{
230
+ const [queryKey, ...rest] = args;
231
+ return queryClient.getQueryData(getArrayQueryKey.getArrayQueryKey(queryKey), ...rest);
232
+ }, [
233
+ queryClient
234
+ ])
235
+ }
236
+ }, props.children);
237
+ };
238
+ function useContext() {
239
+ return React__default["default"].useContext(Context);
240
+ }
241
+ /**
242
+ * Hack to make sure errors return `status`='error` when doing SSR
243
+ * @link https://github.com/trpc/trpc/pull/1645
244
+ */ function useSSRQueryOptionsIfNeeded(pathAndInput, opts) {
245
+ const { queryClient , ssrState } = useContext();
246
+ return ssrState && ssrState !== 'mounted' && queryClient.getQueryCache().find(getArrayQueryKey.getArrayQueryKey(pathAndInput))?.state.status === 'error' ? {
247
+ retryOnMount: false,
248
+ ...opts
249
+ } : opts;
250
+ }
251
+ function useQuery(pathAndInput, opts) {
252
+ const { abortOnUnmount , client , ssrState , queryClient , prefetchQuery } = useContext();
253
+ if (typeof window === 'undefined' && ssrState === 'prepass' && opts?.trpc?.ssr !== false && opts?.enabled !== false && !queryClient.getQueryCache().find(getArrayQueryKey.getArrayQueryKey(pathAndInput))) {
254
+ void prefetchQuery(pathAndInput, opts);
255
+ }
256
+ const ssrOpts = useSSRQueryOptionsIfNeeded(pathAndInput, opts);
257
+ // request option should take priority over global
258
+ const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? abortOnUnmount;
259
+ const hook = reactQuery.useQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), (queryFunctionContext)=>{
260
+ const actualOpts = {
261
+ ...ssrOpts,
262
+ trpc: {
263
+ ...ssrOpts?.trpc,
264
+ ...shouldAbortOnUnmount ? {
265
+ signal: queryFunctionContext.signal
266
+ } : {}
267
+ }
268
+ };
269
+ return client.query(...getClientArgs(pathAndInput, actualOpts));
270
+ }, ssrOpts);
271
+ hook.trpc = useHookResult({
272
+ path: pathAndInput[0]
273
+ });
274
+ return hook;
275
+ }
276
+ function useMutation(path, opts) {
277
+ const { client } = useContext();
278
+ const queryClient = reactQuery.useQueryClient();
279
+ const hook = reactQuery.useMutation((input)=>{
280
+ const actualPath = Array.isArray(path) ? path[0] : path;
281
+ return client.mutation(...getClientArgs([
282
+ actualPath,
283
+ input
284
+ ], opts));
285
+ }, {
286
+ ...opts,
287
+ onSuccess (...args) {
288
+ const originalFn = ()=>opts?.onSuccess?.(...args);
289
+ return mutationSuccessOverride({
290
+ originalFn,
291
+ queryClient
292
+ });
293
+ }
294
+ });
295
+ hook.trpc = useHookResult({
296
+ path: Array.isArray(path) ? path[0] : path
297
+ });
298
+ return hook;
299
+ }
300
+ /* istanbul ignore next */ /**
301
+ * ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️
302
+ * **Experimental.** API might change without major version bump
303
+ * ⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠
304
+ */ function useSubscription(pathAndInput, opts) {
305
+ const enabled = opts?.enabled ?? true;
306
+ const queryKey = reactQuery.hashQueryKey(pathAndInput);
307
+ const { client } = useContext();
308
+ return React.useEffect(()=>{
309
+ if (!enabled) {
310
+ return;
311
+ }
312
+ const [path, input] = pathAndInput;
313
+ let isStopped = false;
314
+ const subscription = client.subscription(path, input ?? undefined, {
315
+ onStarted: ()=>{
316
+ if (!isStopped) {
317
+ opts.onStarted?.();
318
+ }
319
+ },
320
+ onData: (data)=>{
321
+ if (!isStopped) {
322
+ opts.onData(data);
323
+ }
324
+ },
325
+ onError: (err)=>{
326
+ if (!isStopped) {
327
+ opts.onError?.(err);
328
+ }
329
+ }
330
+ });
331
+ return ()=>{
332
+ isStopped = true;
333
+ subscription.unsubscribe();
334
+ };
335
+ // eslint-disable-next-line react-hooks/exhaustive-deps
336
+ }, [
337
+ queryKey,
338
+ enabled
339
+ ]);
340
+ }
341
+ function useInfiniteQuery(pathAndInput, opts) {
342
+ const [path, input] = pathAndInput;
343
+ const { client , ssrState , prefetchInfiniteQuery , queryClient , abortOnUnmount , } = useContext();
344
+ if (typeof window === 'undefined' && ssrState === 'prepass' && opts?.trpc?.ssr !== false && opts?.enabled !== false && !queryClient.getQueryCache().find(getArrayQueryKey.getArrayQueryKey(pathAndInput))) {
345
+ void prefetchInfiniteQuery(pathAndInput, opts);
346
+ }
347
+ const ssrOpts = useSSRQueryOptionsIfNeeded(pathAndInput, opts);
348
+ // request option should take priority over global
349
+ const shouldAbortOnUnmount = opts?.trpc?.abortOnUnmount ?? abortOnUnmount;
350
+ const hook = reactQuery.useInfiniteQuery(getArrayQueryKey.getArrayQueryKey(pathAndInput), (queryFunctionContext)=>{
351
+ const actualOpts = {
352
+ ...ssrOpts,
353
+ trpc: {
354
+ ...ssrOpts?.trpc,
355
+ ...shouldAbortOnUnmount ? {
356
+ signal: queryFunctionContext.signal
357
+ } : {}
358
+ }
359
+ };
360
+ const actualInput = {
361
+ ...input ?? {},
362
+ cursor: queryFunctionContext.pageParam
363
+ };
364
+ return client.query(...getClientArgs([
365
+ path,
366
+ actualInput
367
+ ], actualOpts));
368
+ }, ssrOpts);
369
+ hook.trpc = useHookResult({
370
+ path
371
+ });
372
+ return hook;
373
+ }
374
+ const useDehydratedState = (client, trpcState)=>{
375
+ const transformed = React.useMemo(()=>{
376
+ if (!trpcState) {
377
+ return trpcState;
378
+ }
379
+ return client.runtime.transformer.deserialize(trpcState);
380
+ }, [
381
+ trpcState,
382
+ client
383
+ ]);
384
+ return transformed;
385
+ };
386
+ return {
387
+ Provider: TRPCProvider,
388
+ createClient,
389
+ useContext,
390
+ useQuery,
391
+ useMutation,
392
+ useSubscription,
393
+ useDehydratedState,
394
+ useInfiniteQuery
395
+ };
396
+ }
397
+
398
+ exports.createHooksInternal = createHooksInternal;
399
+ exports.createReactProxyDecoration = createReactProxyDecoration;
400
+ exports.createReactQueryUtilsProxy = createReactQueryUtilsProxy;
@@ -0,0 +1,38 @@
1
+ import { TRPCClientErrorLike } from '@trpc/client';
2
+ import { AnyMutationProcedure, AnyProcedure, AnyQueryProcedure, AnyRouter, AnySubscriptionProcedure, ProcedureRouterRecord, inferProcedureInput, inferProcedureOutput } from '@trpc/server';
3
+ import { inferObservableValue } from '@trpc/server/observable';
4
+ import { CreateReactUtilsProxy } from './shared';
5
+ import { CreateClient, CreateReactQueryHooks, TRPCProvider, UseDehydratedState, UseTRPCInfiniteQueryOptions, UseTRPCInfiniteQueryResult, UseTRPCMutationOptions, UseTRPCMutationResult, UseTRPCQueryOptions, UseTRPCQueryResult, UseTRPCSubscriptionOptions } from './shared/hooks/createHooksInternal';
6
+ import { CreateTRPCReactOptions } from './shared/types';
7
+ /**
8
+ * @internal
9
+ */
10
+ export declare type DecorateProcedure<TProcedure extends AnyProcedure, TPath extends string> = TProcedure extends AnyQueryProcedure ? {
11
+ useQuery: <TQueryFnData = inferProcedureOutput<TProcedure>, TData = inferProcedureOutput<TProcedure>>(input: inferProcedureInput<TProcedure>, opts?: UseTRPCQueryOptions<TPath, inferProcedureInput<TProcedure>, TQueryFnData, TData, TRPCClientErrorLike<TProcedure>>) => UseTRPCQueryResult<TData, TRPCClientErrorLike<TProcedure>>;
12
+ } & (inferProcedureInput<TProcedure> extends {
13
+ cursor?: any;
14
+ } ? {
15
+ useInfiniteQuery: <_TQueryFnData = inferProcedureOutput<TProcedure>, TData = inferProcedureOutput<TProcedure>>(input: Omit<inferProcedureInput<TProcedure>, 'cursor'>, opts?: UseTRPCInfiniteQueryOptions<TPath, inferProcedureInput<TProcedure>, TData, TRPCClientErrorLike<TProcedure>>) => UseTRPCInfiniteQueryResult<TData, TRPCClientErrorLike<TProcedure>>;
16
+ } : {}) : TProcedure extends AnyMutationProcedure ? {
17
+ useMutation: <TContext = unknown>(opts?: UseTRPCMutationOptions<inferProcedureInput<TProcedure>, TRPCClientErrorLike<TProcedure>, inferProcedureOutput<TProcedure>, TContext>) => UseTRPCMutationResult<inferProcedureOutput<TProcedure>, TRPCClientErrorLike<TProcedure>, inferProcedureInput<TProcedure>, TContext>;
18
+ } : TProcedure extends AnySubscriptionProcedure ? {
19
+ useSubscription: (input: inferProcedureInput<TProcedure>, opts?: UseTRPCSubscriptionOptions<inferObservableValue<inferProcedureOutput<TProcedure>>, TRPCClientErrorLike<TProcedure>>) => void;
20
+ } : never;
21
+ /**
22
+ * @internal
23
+ */
24
+ export declare type DecoratedProcedureRecord<TProcedures extends ProcedureRouterRecord, TPath extends string = ''> = {
25
+ [TKey in keyof TProcedures]: TProcedures[TKey] extends AnyRouter ? DecoratedProcedureRecord<TProcedures[TKey]['_def']['record'], `${TPath}${TKey & string}.`> : TProcedures[TKey] extends AnyProcedure ? DecorateProcedure<TProcedures[TKey], `${TPath}${TKey & string}`> : never;
26
+ };
27
+ export declare type CreateTRPCReact<TRouter extends AnyRouter, TSSRContext> = {
28
+ useContext(): CreateReactUtilsProxy<TRouter, TSSRContext>;
29
+ Provider: TRPCProvider<TRouter, TSSRContext>;
30
+ createClient: CreateClient<TRouter>;
31
+ useDehydratedState: UseDehydratedState<TRouter>;
32
+ } & DecoratedProcedureRecord<TRouter['_def']['record']>;
33
+ /**
34
+ * @internal
35
+ */
36
+ export declare function createHooksInternalProxy<TRouter extends AnyRouter, TSSRContext = unknown>(trpc: CreateReactQueryHooks<TRouter, TSSRContext>): CreateTRPCReact<TRouter, TSSRContext>;
37
+ export declare function createTRPCReact<TRouter extends AnyRouter, TSSRContext = unknown>(opts?: CreateTRPCReactOptions<TRouter>): CreateTRPCReact<TRouter, TSSRContext>;
38
+ //# sourceMappingURL=createTRPCReact.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"createTRPCReact.d.ts","sourceRoot":"","sources":["../src/createTRPCReact.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,19 @@
1
+ /**
2
+ * To allow easy interactions with groups of related queries, such as
3
+ * invalidating all queries of a router, we use an array as the path when
4
+ * storing in tanstack query. This function converts from the `.` separated
5
+ * path passed around internally by both the legacy and proxy implementation.
6
+ * https://github.com/trpc/trpc/issues/2611
7
+ */ function getArrayQueryKey(queryKey) {
8
+ const queryKeyArrayed = Array.isArray(queryKey) ? queryKey : [
9
+ queryKey
10
+ ];
11
+ const [path, ...input] = queryKeyArrayed;
12
+ const arrayPath = typeof path !== 'string' || path === '' ? [] : path.split('.');
13
+ return [
14
+ arrayPath,
15
+ ...input
16
+ ];
17
+ }
18
+
19
+ export { getArrayQueryKey as g };
@@ -0,0 +1,21 @@
1
+ 'use strict';
2
+
3
+ /**
4
+ * To allow easy interactions with groups of related queries, such as
5
+ * invalidating all queries of a router, we use an array as the path when
6
+ * storing in tanstack query. This function converts from the `.` separated
7
+ * path passed around internally by both the legacy and proxy implementation.
8
+ * https://github.com/trpc/trpc/issues/2611
9
+ */ function getArrayQueryKey(queryKey) {
10
+ const queryKeyArrayed = Array.isArray(queryKey) ? queryKey : [
11
+ queryKey
12
+ ];
13
+ const [path, ...input] = queryKeyArrayed;
14
+ const arrayPath = typeof path !== 'string' || path === '' ? [] : path.split('.');
15
+ return [
16
+ arrayPath,
17
+ ...input
18
+ ];
19
+ }
20
+
21
+ exports.getArrayQueryKey = getArrayQueryKey;
@@ -0,0 +1,4 @@
1
+ export * from '@trpc/client';
2
+ export { createTRPCReact, type CreateTRPCReact } from './createTRPCReact';
3
+ export { createReactQueryHooks } from './interop';
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAE7B,OAAO,EAAE,eAAe,EAAE,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,qBAAqB,EAAE,MAAM,WAAW,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,58 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var client = require('@trpc/client');
6
+ var shared = require('@trpc/server/shared');
7
+ var React = require('react');
8
+ var createHooksInternal = require('./createHooksInternal-e8214d72.js');
9
+ require('@tanstack/react-query');
10
+ require('./getArrayQueryKey-a2092b3c.js');
11
+
12
+ /**
13
+ * @internal
14
+ */ function createHooksInternalProxy(trpc) {
15
+ return shared.createFlatProxy((key)=>{
16
+ if (key === 'useContext') {
17
+ return ()=>{
18
+ const context = trpc.useContext();
19
+ // create a stable reference of the utils context
20
+ return React.useMemo(()=>{
21
+ return createHooksInternal.createReactQueryUtilsProxy(context);
22
+ }, [
23
+ context
24
+ ]);
25
+ };
26
+ }
27
+ if (key in trpc) {
28
+ return trpc[key];
29
+ }
30
+ return createHooksInternal.createReactProxyDecoration(key, trpc);
31
+ });
32
+ }
33
+ function createTRPCReact(opts) {
34
+ const hooks = createHooksInternal.createHooksInternal(opts);
35
+ const proxy = createHooksInternalProxy(hooks);
36
+ return proxy;
37
+ }
38
+
39
+ // interop:
40
+ /**
41
+ * @deprecated use `createTRPCReact` instead
42
+ */ function createReactQueryHooks() {
43
+ const trpc = createHooksInternal.createHooksInternal();
44
+ const proxy = createHooksInternalProxy(trpc);
45
+ return {
46
+ ...trpc,
47
+ proxy
48
+ };
49
+ }
50
+
51
+ exports.createReactQueryHooks = createReactQueryHooks;
52
+ exports.createTRPCReact = createTRPCReact;
53
+ Object.keys(client).forEach(function (k) {
54
+ if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
55
+ enumerable: true,
56
+ get: function () { return client[k]; }
57
+ });
58
+ });
package/dist/index.mjs ADDED
@@ -0,0 +1,47 @@
1
+ export * from '@trpc/client';
2
+ import { createFlatProxy } from '@trpc/server/shared';
3
+ import { useMemo } from 'react';
4
+ import { c as createHooksInternal, a as createReactQueryUtilsProxy, b as createReactProxyDecoration } from './createHooksInternal-b47ee704.mjs';
5
+ import '@tanstack/react-query';
6
+ import './getArrayQueryKey-062214e0.mjs';
7
+
8
+ /**
9
+ * @internal
10
+ */ function createHooksInternalProxy(trpc) {
11
+ return createFlatProxy((key)=>{
12
+ if (key === 'useContext') {
13
+ return ()=>{
14
+ const context = trpc.useContext();
15
+ // create a stable reference of the utils context
16
+ return useMemo(()=>{
17
+ return createReactQueryUtilsProxy(context);
18
+ }, [
19
+ context
20
+ ]);
21
+ };
22
+ }
23
+ if (key in trpc) {
24
+ return trpc[key];
25
+ }
26
+ return createReactProxyDecoration(key, trpc);
27
+ });
28
+ }
29
+ function createTRPCReact(opts) {
30
+ const hooks = createHooksInternal(opts);
31
+ const proxy = createHooksInternalProxy(hooks);
32
+ return proxy;
33
+ }
34
+
35
+ // interop:
36
+ /**
37
+ * @deprecated use `createTRPCReact` instead
38
+ */ function createReactQueryHooks() {
39
+ const trpc = createHooksInternal();
40
+ const proxy = createHooksInternalProxy(trpc);
41
+ return {
42
+ ...trpc,
43
+ proxy
44
+ };
45
+ }
46
+
47
+ export { createReactQueryHooks, createTRPCReact };