@frak-labs/react-sdk 0.1.1 → 0.2.0-beta.7898df5b

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 (38) hide show
  1. package/README.md +25 -0
  2. package/dist/index.cjs +1 -1
  3. package/dist/index.d.cts +29 -68
  4. package/dist/index.d.ts +28 -67
  5. package/dist/index.js +1 -1
  6. package/package.json +17 -16
  7. package/src/hook/helper/useReferralInteraction.test.ts +309 -0
  8. package/src/hook/helper/useReferralInteraction.ts +73 -0
  9. package/src/hook/index.ts +10 -0
  10. package/src/hook/useDisplayModal.test.ts +275 -0
  11. package/src/hook/useDisplayModal.ts +68 -0
  12. package/src/hook/useFrakClient.test.ts +119 -0
  13. package/src/hook/useFrakClient.ts +11 -0
  14. package/src/hook/useFrakConfig.test.ts +184 -0
  15. package/src/hook/useFrakConfig.ts +22 -0
  16. package/src/hook/useGetMerchantInformation.ts +56 -0
  17. package/src/hook/useOpenSso.test.ts +202 -0
  18. package/src/hook/useOpenSso.ts +51 -0
  19. package/src/hook/usePrepareSso.test.ts +197 -0
  20. package/src/hook/usePrepareSso.ts +55 -0
  21. package/src/hook/useSendTransaction.test.ts +218 -0
  22. package/src/hook/useSendTransaction.ts +62 -0
  23. package/src/hook/useSiweAuthenticate.test.ts +258 -0
  24. package/src/hook/useSiweAuthenticate.ts +66 -0
  25. package/src/hook/useWalletStatus.test.ts +112 -0
  26. package/src/hook/useWalletStatus.ts +55 -0
  27. package/src/hook/utils/useFrakContext.test.ts +157 -0
  28. package/src/hook/utils/useFrakContext.ts +42 -0
  29. package/src/hook/utils/useMounted.test.ts +70 -0
  30. package/src/hook/utils/useMounted.ts +12 -0
  31. package/src/hook/utils/useWindowLocation.test.ts +54 -0
  32. package/src/hook/utils/useWindowLocation.ts +40 -0
  33. package/src/index.ts +25 -0
  34. package/src/provider/FrakConfigProvider.test.ts +246 -0
  35. package/src/provider/FrakConfigProvider.ts +54 -0
  36. package/src/provider/FrakIFrameClientProvider.test.tsx +209 -0
  37. package/src/provider/FrakIFrameClientProvider.ts +86 -0
  38. package/src/provider/index.ts +7 -0
package/README.md CHANGED
@@ -6,3 +6,28 @@ Checkout our documentation for more information's about the usage:
6
6
  - [React client usage](https://docs.frak.id/wallet-sdk/getting-started/react)
7
7
  - [Core client usage](https://docs.frak.id/wallet-sdk/getting-started/javascript)
8
8
  - [CDN / Browser usage](https://docs.frak.id/wallet-sdk/getting-started/cdn)
9
+
10
+ ## Hooks
11
+
12
+ | Hook | Purpose |
13
+ |------|---------|
14
+ | `useWalletStatus` | Watch wallet connection state and account information |
15
+ | `useDisplayModal` | Trigger SDK modal display for user interactions |
16
+ | `useSiweAuthenticate` | SIWE (Sign-In with Ethereum) authentication flow |
17
+ | `useOpenSso` | Open SSO authentication flow |
18
+ | `usePrepareSso` | Prepare SSO data before opening authentication |
19
+ | `useSendTransactionAction` | Send blockchain transaction actions |
20
+ | `useGetMerchantInformation` | Query merchant info and available rewards |
21
+ | `useReferralInteraction` | Auto-submit referral interactions |
22
+ | `useFrakClient` | Access the FrakClient instance |
23
+ | `useFrakConfig` | Access SDK configuration |
24
+
25
+ ## Providers
26
+
27
+ Wrap your application root with these providers:
28
+
29
+ - **`FrakConfigProvider`** — SDK configuration context. Required at app root.
30
+ - **`FrakIFrameClientProvider`** — Iframe client context for SDK communication.
31
+
32
+ Both providers export TypeScript types: `FrakConfigProviderProps`, `FrakIFrameClientProps`.
33
+
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- let e=require(`@frak-labs/core-sdk/actions`),t=require(`@frak-labs/frame-connector`),n=require(`@tanstack/react-query`),r=require(`react`),i=require(`@frak-labs/core-sdk`);const a=(0,r.createContext)(void 0);function o(e){let{children:t,config:n}=e;return(0,r.createElement)(a.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const s=(0,r.createContext)(void 0);function c({style:e,children:t}){let n=g(),[a,o]=(0,r.useState)(void 0);return(0,r.createElement)(r.Fragment,null,(0,r.createElement)(`iframe`,{...i.baseIframeProps,src:`${n.walletUrl}/listener`,style:e??i.baseIframeProps.style,ref:e=>{!e||a||o((0,i.createIFrameFrakClient)({iframe:e,config:n}))}}),(0,r.createElement)(s.Provider,{value:a},t))}function l(){return(0,r.useContext)(s)}function u(){let i=(0,n.useQueryClient)(),a=l(),o=(0,r.useCallback)(e=>{i.setQueryData([`frak-sdk`,`wallet-status-listener`],e)},[i]);return(0,n.useQuery)({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!a)throw new t.ClientNotFound;return(0,e.watchWalletStatus)(a,o)},enabled:!!a})}function d(){let[e,t]=(0,r.useState)(!1);return(0,r.useEffect)(()=>{t(!0)},[]),e}function f(){let e=d(),[t,n]=(0,r.useState)(e?window.location:void 0);return(0,r.useEffect)(()=>{if(!e)return;function r(){n(window.location)}return t||r(),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`popstate`,r)}},[e,t]),{location:t,href:(0,r.useMemo)(()=>t?.href,[t?.href])}}function p(){let{location:e}=f();return{frakContext:(0,r.useMemo)(()=>e?.href?i.FrakContextManager.parse({url:e.href}):null,[e?.href]),updateContext:(0,r.useCallback)(t=>{console.log(`Updating context`,{newContext:t}),i.FrakContextManager.replaceUrl({url:e?.href,context:t})},[e?.href])}}function m({productId:i,modalConfig:a,options:o}={}){let s=l(),{frakContext:c}=p(),{data:d}=u(),{data:f,error:m,status:h}=(0,n.useQuery)({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`auto-referral-interaction`,c?.r??`no-referrer`,d?.key??`no-wallet-status`,i??`no-product-id`],queryFn:()=>{if(!s)throw new t.ClientNotFound;return(0,e.processReferral)(s,{walletStatus:d,frakContext:c,modalConfig:a,productId:i,options:o})},enabled:!!d});return(0,r.useMemo)(()=>h===`pending`?`processing`:h===`error`?m:f||`idle`,[f,h,m])}function h({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.displayModal)(i,n)}})}function g(){let e=(0,r.useContext)(a);if(!e)throw new t.FrakRpcError(t.RpcErrorCodes.configError,`Frak config not found`);return e}function _({query:r}={}){let i=l();return(0,n.useQuery)({...r,queryKey:[`frak-sdk`,`get-product-information`],queryFn:async()=>{if(!i)throw new t.ClientNotFound;return(0,e.getProductInformation)(i)}})}function v({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.openSso)(i,n)}})}function y(r){let i=l();return(0,n.useQuery)({queryKey:[`frak-sdk`,`prepare-sso`,r],queryFn:async()=>{if(!i)throw new t.ClientNotFound;return(0,e.prepareSso)(i,r)}})}function b({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`send-interaction`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.sendInteraction)(i,n)}})}function x({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.sendTransaction)(i,n)}})}function S({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`siwe-authenticate`,i?.config.domain??`no-domain`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.siweAuthenticate)(i,n)}})}exports.FrakConfigContext=a,exports.FrakConfigProvider=o,exports.FrakIFrameClientContext=s,exports.FrakIFrameClientProvider=c,exports.useDisplayModal=h,exports.useFrakClient=l,exports.useFrakConfig=g,exports.useGetProductInformation=_,exports.useOpenSso=v,exports.usePrepareSso=y,exports.useReferralInteraction=m,exports.useSendInteraction=b,exports.useSendTransactionAction=x,exports.useSiweAuthenticate=S,exports.useWalletStatus=u;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@frak-labs/core-sdk/actions`),t=require(`@frak-labs/frame-connector`),n=require(`@tanstack/react-query`),r=require(`react`),i=require(`@frak-labs/core-sdk`);const a=(0,r.createContext)(void 0);function o(e){let{children:t,config:n}=e;return(0,r.createElement)(a.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const s=(0,r.createContext)(void 0);function c({style:e,children:t}){let n=g(),[a,o]=(0,r.useState)(void 0);return(0,r.createElement)(r.Fragment,null,(0,r.createElement)(`iframe`,{...i.baseIframeProps,src:`${n.walletUrl}/listener`,style:e??i.baseIframeProps.style,ref:e=>{!e||a||o((0,i.createIFrameFrakClient)({iframe:e,config:n}))}}),(0,r.createElement)(s.Provider,{value:a},t))}function l(){return(0,r.useContext)(s)}function u(){let i=(0,n.useQueryClient)(),a=l(),o=(0,r.useCallback)(e=>{i.setQueryData([`frak-sdk`,`wallet-status-listener`],e)},[i]);return(0,n.useQuery)({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!a)throw new t.ClientNotFound;return(0,e.watchWalletStatus)(a,o)},enabled:!!a})}function d(){let[e,t]=(0,r.useState)(!1);return(0,r.useEffect)(()=>{t(!0)},[]),e}function f(){let e=d(),[t,n]=(0,r.useState)(e?window.location:void 0);return(0,r.useEffect)(()=>{if(!e)return;function r(){n(window.location)}return t||r(),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`popstate`,r)}},[e,t]),{location:t,href:(0,r.useMemo)(()=>t?.href,[t?.href])}}function p(){let{location:e}=f();return{frakContext:(0,r.useMemo)(()=>e?.href?i.FrakContextManager.parse({url:e.href}):null,[e?.href]),updateContext:(0,r.useCallback)(t=>{console.log(`Updating context`,{newContext:t}),i.FrakContextManager.replaceUrl({url:e?.href,context:t})},[e?.href])}}function m({options:i}={}){let a=l(),{frakContext:o}=p(),{data:s}=u(),{data:c,error:d,status:f}=(0,n.useQuery)({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`auto-referral-interaction`,o?.r??`no-referrer`,s?.key??`no-wallet-status`],queryFn:()=>{if(!a)throw new t.ClientNotFound;return(0,e.processReferral)(a,{walletStatus:s,frakContext:o,options:i})},enabled:!!s});return(0,r.useMemo)(()=>f===`pending`?`processing`:f===`error`?d:c||`idle`,[c,f,d])}function h({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.displayModal)(i,n)}})}function g(){let e=(0,r.useContext)(a);if(!e)throw new t.FrakRpcError(t.RpcErrorCodes.configError,`Frak config not found`);return e}function _({query:r}={}){let i=l();return(0,n.useQuery)({...r,queryKey:[`frak-sdk`,`get-merchant-information`],queryFn:async()=>{if(!i)throw new t.ClientNotFound;return(0,e.getMerchantInformation)(i)}})}function v({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.openSso)(i,n)}})}function y(r){let i=l();return(0,n.useQuery)({queryKey:[`frak-sdk`,`prepare-sso`,r],queryFn:async()=>{if(!i)throw new t.ClientNotFound;return(0,e.prepareSso)(i,r)}})}function b({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.sendTransaction)(i,n)}})}function x({mutations:r}={}){let i=l();return(0,n.useMutation)({...r,mutationKey:[`frak-sdk`,`siwe-authenticate`,i?.config.domain??`no-domain`],mutationFn:async n=>{if(!i)throw new t.ClientNotFound;return(0,e.siweAuthenticate)(i,n)}})}exports.FrakConfigContext=a,exports.FrakConfigProvider=o,exports.FrakIFrameClientContext=s,exports.FrakIFrameClientProvider=c,exports.useDisplayModal=h,exports.useFrakClient=l,exports.useFrakConfig=g,exports.useGetMerchantInformation=_,exports.useOpenSso=v,exports.usePrepareSso=y,exports.useReferralInteraction=m,exports.useSendTransactionAction=b,exports.useSiweAuthenticate=x,exports.useWalletStatus=u;
package/dist/index.d.cts CHANGED
@@ -1,23 +1,19 @@
1
- import * as _frak_labs_core_sdk0 from "@frak-labs/core-sdk";
2
- import { DisplayEmbeddedWalletParamsType, DisplayModalParamsType, FrakClient, FrakWalletSdkConfig, GetProductInformationReturnType, ModalRpcStepsResultType, ModalStepTypes, OpenSsoParamsType, OpenSsoReturnType, PrepareSsoParamsType, SendInteractionParamsType, SendInteractionReturnType, SendTransactionReturnType, SiweAuthenticateReturnType, WalletStatusReturnType } from "@frak-labs/core-sdk";
3
1
  import { ProcessReferralOptions, SendTransactionParams, SiweAuthenticateModalParams } from "@frak-labs/core-sdk/actions";
4
- import { Hex } from "viem";
5
2
  import * as _tanstack_react_query0 from "@tanstack/react-query";
6
3
  import { UseMutationOptions, UseQueryOptions } from "@tanstack/react-query";
4
+ import * as _frak_labs_core_sdk0 from "@frak-labs/core-sdk";
5
+ import { DisplayModalParamsType, FrakClient, FrakWalletSdkConfig, GetMerchantInformationReturnType, ModalRpcStepsResultType, ModalStepTypes, OpenSsoParamsType, OpenSsoReturnType, PrepareSsoParamsType, SendTransactionReturnType, SiweAuthenticateReturnType, WalletStatusReturnType } from "@frak-labs/core-sdk";
7
6
  import { FrakRpcError } from "@frak-labs/frame-connector";
8
- import * as react2 from "react";
7
+ import * as react from "react";
9
8
  import { CSSProperties, PropsWithChildren, ReactNode } from "react";
10
9
 
11
10
  //#region src/hook/helper/useReferralInteraction.d.ts
12
-
13
11
  /**
14
12
  * Helper hook to automatically submit a referral interaction when detected
15
13
  *
16
14
  * @group hooks
17
15
  *
18
16
  * @param args
19
- * @param args.productId - The product id to interact with (if not specified will be recomputed from the current domain)
20
- * @param args.modalConfig - The modal configuration to display if the user is not logged in
21
17
  * @param args.options - Some options for the referral interaction
22
18
  *
23
19
  * @returns The resulting referral state, or a potential error
@@ -27,31 +23,27 @@ import { CSSProperties, PropsWithChildren, ReactNode } from "react";
27
23
  * @see {@link @frak-labs/core-sdk!actions.processReferral | `processReferral()`} for more details on the automatic referral handling process
28
24
  */
29
25
  declare function useReferralInteraction({
30
- productId,
31
- modalConfig,
32
26
  options
33
27
  }?: {
34
- productId?: Hex;
35
- modalConfig?: DisplayEmbeddedWalletParamsType;
36
28
  options?: ProcessReferralOptions;
37
- }): Error | ("processing" | "no-referrer" | "idle" | "success" | "no-wallet" | "no-session" | "error" | "self-referral");
29
+ }): "processing" | Error | "no-referrer" | "idle" | "success" | "self-referral";
38
30
  //#endregion
39
31
  //#region src/hook/useDisplayModal.d.ts
40
32
  /** @ignore */
41
- type MutationOptions$4<T extends ModalStepTypes[]> = Omit<UseMutationOptions<ModalRpcStepsResultType<T>, FrakRpcError, DisplayModalParamsType<T>>, "mutationFn" | "mutationKey">;
33
+ type MutationOptions$3<T extends ModalStepTypes[]> = Omit<UseMutationOptions<ModalRpcStepsResultType<T>, FrakRpcError, DisplayModalParamsType<T>>, "mutationFn" | "mutationKey">;
42
34
  /** @inline */
43
35
  interface UseDisplayModalParams<T extends ModalStepTypes[] = ModalStepTypes[]> {
44
36
  /**
45
37
  * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
46
38
  */
47
- mutations?: MutationOptions$4<T>;
39
+ mutations?: MutationOptions$3<T>;
48
40
  }
49
41
  /**
50
42
  * Hook that return a mutation helping to display a modal to the user
51
43
  *
52
44
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.displayModal | `displayModal()`} action
53
45
  *
54
- * @param args
46
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
55
47
  *
56
48
  * @typeParam T
57
49
  * The modal steps types to display (the result will correspond to the steps types asked in params)
@@ -91,52 +83,52 @@ declare function useFrakClient(): _frak_labs_core_sdk0.FrakClient | undefined;
91
83
  */
92
84
  declare function useFrakConfig(): _frak_labs_core_sdk0.FrakWalletSdkConfig;
93
85
  //#endregion
94
- //#region src/hook/useGetProductInformation.d.ts
86
+ //#region src/hook/useGetMerchantInformation.d.ts
95
87
  /** @ignore */
96
- type QueryOptions = Omit<UseQueryOptions<GetProductInformationReturnType, FrakRpcError, undefined>, "queryKey" | "queryFn">;
88
+ type QueryOptions = Omit<UseQueryOptions<GetMerchantInformationReturnType, FrakRpcError, GetMerchantInformationReturnType>, "queryKey" | "queryFn">;
97
89
  /** @inline */
98
- interface UseGetProductInformationParams {
90
+ interface UseGetMerchantInformationParams {
99
91
  /**
100
92
  * Optional query options, see {@link @tanstack/react-query!useQuery | `useQuery()`} for more infos
101
93
  */
102
94
  query?: QueryOptions;
103
95
  }
104
96
  /**
105
- * Hook that return a query helping to get the current product information
97
+ * Hook that return a query helping to get the current merchant information
106
98
  *
107
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.getProductInformation | `getProductInformation()`} action
99
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.getMerchantInformation | `getMerchantInformation()`} action
108
100
  *
109
- * @param args
101
+ * @param args - Optional config object with `query` for customizing the underlying {@link @tanstack/react-query!useQuery | `useQuery()`}
110
102
  *
111
103
  * @group hooks
112
104
  *
113
105
  * @returns
114
- * The query hook wrapping the `getProductInformation()` action
115
- * The `data` result is a {@link @frak-labs/core-sdk!index.GetProductInformationReturnType | `GetProductInformationReturnType`}
106
+ * The query hook wrapping the `getMerchantInformation()` action
107
+ * The `data` result is a {@link @frak-labs/core-sdk!index.GetMerchantInformationReturnType | `GetMerchantInformationReturnType`}
116
108
  *
117
- * @see {@link @frak-labs/core-sdk!actions.getProductInformation | `getProductInformation()`} for more info about the underlying action
109
+ * @see {@link @frak-labs/core-sdk!actions.getMerchantInformation | `getMerchantInformation()`} for more info about the underlying action
118
110
  * @see {@link @tanstack/react-query!useQuery | `useQuery()`} for more info about the useQuery options and response
119
111
  */
120
- declare function useGetProductInformation({
112
+ declare function useGetMerchantInformation({
121
113
  query
122
- }?: UseGetProductInformationParams): _tanstack_react_query0.UseQueryResult<undefined, FrakRpcError<undefined>>;
114
+ }?: UseGetMerchantInformationParams): _tanstack_react_query0.UseQueryResult<GetMerchantInformationReturnType, FrakRpcError<undefined>>;
123
115
  //#endregion
124
116
  //#region src/hook/useOpenSso.d.ts
125
117
  /** @ignore */
126
- type MutationOptions$3 = Omit<UseMutationOptions<OpenSsoReturnType, FrakRpcError, OpenSsoParamsType>, "mutationFn" | "mutationKey">;
118
+ type MutationOptions$2 = Omit<UseMutationOptions<OpenSsoReturnType, FrakRpcError, OpenSsoParamsType>, "mutationFn" | "mutationKey">;
127
119
  /** @inline */
128
120
  interface UseOpenSsoParams {
129
121
  /**
130
122
  * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
131
123
  */
132
- mutations?: MutationOptions$3;
124
+ mutations?: MutationOptions$2;
133
125
  }
134
126
  /**
135
127
  * Hook that return a mutation helping to open the SSO page
136
128
  *
137
129
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.openSso | `openSso()`} action
138
130
  *
139
- * @param args
131
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
140
132
  *
141
133
  * @group hooks
142
134
  *
@@ -191,37 +183,6 @@ declare function useOpenSso({
191
183
  */
192
184
  declare function usePrepareSso(params: PrepareSsoParamsType): _tanstack_react_query0.UseQueryResult<_frak_labs_core_sdk0.PrepareSsoReturnType, Error>;
193
185
  //#endregion
194
- //#region src/hook/useSendInteraction.d.ts
195
- /** @ignore */
196
- type MutationOptions$2 = Omit<UseMutationOptions<SendInteractionReturnType, FrakRpcError, SendInteractionParamsType>, "mutationFn" | "mutationKey">;
197
- /** @inline */
198
- interface UseSendInteractionParams {
199
- /**
200
- * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
201
- */
202
- mutations?: MutationOptions$2;
203
- }
204
- /**
205
- * Hook that return a mutation helping to send a user interaction
206
- *
207
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendInteraction | `sendInteraction()`} action
208
- *
209
- * @param args
210
- *
211
- * @group hooks
212
- *
213
- * @returns
214
- * The mutation hook wrapping the `sendInteraction()` action
215
- * The `mutate` and `mutateAsync` argument is of type {@link @frak-labs/core-sdk!index.SendInteractionParamsType | `SendInteractionParamsType`}
216
- * The `data` result is a {@link @frak-labs/core-sdk!index.SendInteractionReturnType | `SendInteractionReturnType`}
217
- *
218
- * @see {@link @frak-labs/core-sdk!actions.sendInteraction | `sendInteraction()`} for more info about the underlying action
219
- * @see {@link @tanstack/react-query!useMutation | `useMutation()`} for more info about the mutation options and response
220
- */
221
- declare function useSendInteraction({
222
- mutations
223
- }?: UseSendInteractionParams): _tanstack_react_query0.UseMutationResult<SendInteractionReturnType, FrakRpcError<undefined>, SendInteractionParamsType, unknown>;
224
- //#endregion
225
186
  //#region src/hook/useSendTransaction.d.ts
226
187
  /** @ignore */
227
188
  type MutationOptions$1 = Omit<UseMutationOptions<SendTransactionReturnType, FrakRpcError, SendTransactionParams>, "mutationFn" | "mutationKey">;
@@ -237,7 +198,7 @@ interface UseSendTransactionParams {
237
198
  *
238
199
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendTransaction | `sendTransaction()`} action
239
200
  *
240
- * @param args
201
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
241
202
  *
242
203
  * @group hooks
243
204
  *
@@ -266,9 +227,9 @@ interface UseSiweAuthenticateParams {
266
227
  /**
267
228
  * Hook that return a mutation helping to send perform a SIWE authentication
268
229
  *
269
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendTransaction | `sendTransaction()`} action
230
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.siweAuthenticate | `siweAuthenticate()`} action
270
231
  *
271
- * @param args
232
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
272
233
  *
273
234
  * @group hooks
274
235
  *
@@ -306,7 +267,7 @@ declare function useWalletStatus(): _tanstack_react_query0.UseQueryResult<Wallet
306
267
  * The context that will keep the Frak Wallet SDK configuration
307
268
  * @ignore
308
269
  */
309
- declare const FrakConfigContext: react2.Context<FrakWalletSdkConfig | undefined>;
270
+ declare const FrakConfigContext: react.Context<FrakWalletSdkConfig | undefined>;
310
271
  /**
311
272
  * Props to instantiate the Frak Wallet SDK configuration provider
312
273
  *
@@ -328,14 +289,14 @@ type FrakConfigProviderProps = {
328
289
  *
329
290
  * @param parameters
330
291
  */
331
- declare function FrakConfigProvider(parameters: PropsWithChildren<FrakConfigProviderProps>): react2.FunctionComponentElement<react2.ProviderProps<FrakWalletSdkConfig | undefined>>;
292
+ declare function FrakConfigProvider(parameters: PropsWithChildren<FrakConfigProviderProps>): react.FunctionComponentElement<react.ProviderProps<FrakWalletSdkConfig | undefined>>;
332
293
  //#endregion
333
294
  //#region src/provider/FrakIFrameClientProvider.d.ts
334
295
  /**
335
296
  * The context that will keep the Frak Wallet SDK client
336
297
  * @ignore
337
298
  */
338
- declare const FrakIFrameClientContext: react2.Context<FrakClient | undefined>;
299
+ declare const FrakIFrameClientContext: react.Context<FrakClient | undefined>;
339
300
  /**
340
301
  * Props to instantiate the Frak Wallet SDK configuration provider
341
302
  *
@@ -363,6 +324,6 @@ declare function FrakIFrameClientProvider({
363
324
  }: {
364
325
  style?: CSSProperties;
365
326
  children?: ReactNode;
366
- }): react2.FunctionComponentElement<react2.FragmentProps>;
327
+ }): react.FunctionComponentElement<react.FragmentProps>;
367
328
  //#endregion
368
- export { FrakConfigContext, FrakConfigProvider, type FrakConfigProviderProps, FrakIFrameClientContext, type FrakIFrameClientProps, FrakIFrameClientProvider, useDisplayModal, useFrakClient, useFrakConfig, useGetProductInformation, useOpenSso, usePrepareSso, useReferralInteraction, useSendInteraction, useSendTransactionAction, useSiweAuthenticate, useWalletStatus };
329
+ export { FrakConfigContext, FrakConfigProvider, type FrakConfigProviderProps, FrakIFrameClientContext, type FrakIFrameClientProps, FrakIFrameClientProvider, useDisplayModal, useFrakClient, useFrakConfig, useGetMerchantInformation, useOpenSso, usePrepareSso, useReferralInteraction, useSendTransactionAction, useSiweAuthenticate, useWalletStatus };
package/dist/index.d.ts CHANGED
@@ -2,22 +2,18 @@ import { ProcessReferralOptions, SendTransactionParams, SiweAuthenticateModalPar
2
2
  import { FrakRpcError } from "@frak-labs/frame-connector";
3
3
  import * as _tanstack_react_query0 from "@tanstack/react-query";
4
4
  import { UseMutationOptions, UseQueryOptions } from "@tanstack/react-query";
5
- import * as react2 from "react";
5
+ import * as react from "react";
6
6
  import { CSSProperties, PropsWithChildren, ReactNode } from "react";
7
7
  import * as _frak_labs_core_sdk0 from "@frak-labs/core-sdk";
8
- import { DisplayEmbeddedWalletParamsType, DisplayModalParamsType, FrakClient, FrakWalletSdkConfig, GetProductInformationReturnType, ModalRpcStepsResultType, ModalStepTypes, OpenSsoParamsType, OpenSsoReturnType, PrepareSsoParamsType, SendInteractionParamsType, SendInteractionReturnType, SendTransactionReturnType, SiweAuthenticateReturnType, WalletStatusReturnType } from "@frak-labs/core-sdk";
9
- import { Hex } from "viem";
8
+ import { DisplayModalParamsType, FrakClient, FrakWalletSdkConfig, GetMerchantInformationReturnType, ModalRpcStepsResultType, ModalStepTypes, OpenSsoParamsType, OpenSsoReturnType, PrepareSsoParamsType, SendTransactionReturnType, SiweAuthenticateReturnType, WalletStatusReturnType } from "@frak-labs/core-sdk";
10
9
 
11
10
  //#region src/hook/helper/useReferralInteraction.d.ts
12
-
13
11
  /**
14
12
  * Helper hook to automatically submit a referral interaction when detected
15
13
  *
16
14
  * @group hooks
17
15
  *
18
16
  * @param args
19
- * @param args.productId - The product id to interact with (if not specified will be recomputed from the current domain)
20
- * @param args.modalConfig - The modal configuration to display if the user is not logged in
21
17
  * @param args.options - Some options for the referral interaction
22
18
  *
23
19
  * @returns The resulting referral state, or a potential error
@@ -27,31 +23,27 @@ import { Hex } from "viem";
27
23
  * @see {@link @frak-labs/core-sdk!actions.processReferral | `processReferral()`} for more details on the automatic referral handling process
28
24
  */
29
25
  declare function useReferralInteraction({
30
- productId,
31
- modalConfig,
32
26
  options
33
27
  }?: {
34
- productId?: Hex;
35
- modalConfig?: DisplayEmbeddedWalletParamsType;
36
28
  options?: ProcessReferralOptions;
37
- }): Error | ("processing" | "no-referrer" | "idle" | "success" | "no-wallet" | "no-session" | "error" | "self-referral");
29
+ }): "processing" | Error | "no-referrer" | "idle" | "success" | "self-referral";
38
30
  //#endregion
39
31
  //#region src/hook/useDisplayModal.d.ts
40
32
  /** @ignore */
41
- type MutationOptions$4<T extends ModalStepTypes[]> = Omit<UseMutationOptions<ModalRpcStepsResultType<T>, FrakRpcError, DisplayModalParamsType<T>>, "mutationFn" | "mutationKey">;
33
+ type MutationOptions$3<T extends ModalStepTypes[]> = Omit<UseMutationOptions<ModalRpcStepsResultType<T>, FrakRpcError, DisplayModalParamsType<T>>, "mutationFn" | "mutationKey">;
42
34
  /** @inline */
43
35
  interface UseDisplayModalParams<T extends ModalStepTypes[] = ModalStepTypes[]> {
44
36
  /**
45
37
  * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
46
38
  */
47
- mutations?: MutationOptions$4<T>;
39
+ mutations?: MutationOptions$3<T>;
48
40
  }
49
41
  /**
50
42
  * Hook that return a mutation helping to display a modal to the user
51
43
  *
52
44
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.displayModal | `displayModal()`} action
53
45
  *
54
- * @param args
46
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
55
47
  *
56
48
  * @typeParam T
57
49
  * The modal steps types to display (the result will correspond to the steps types asked in params)
@@ -91,52 +83,52 @@ declare function useFrakClient(): _frak_labs_core_sdk0.FrakClient | undefined;
91
83
  */
92
84
  declare function useFrakConfig(): _frak_labs_core_sdk0.FrakWalletSdkConfig;
93
85
  //#endregion
94
- //#region src/hook/useGetProductInformation.d.ts
86
+ //#region src/hook/useGetMerchantInformation.d.ts
95
87
  /** @ignore */
96
- type QueryOptions = Omit<UseQueryOptions<GetProductInformationReturnType, FrakRpcError, undefined>, "queryKey" | "queryFn">;
88
+ type QueryOptions = Omit<UseQueryOptions<GetMerchantInformationReturnType, FrakRpcError, GetMerchantInformationReturnType>, "queryKey" | "queryFn">;
97
89
  /** @inline */
98
- interface UseGetProductInformationParams {
90
+ interface UseGetMerchantInformationParams {
99
91
  /**
100
92
  * Optional query options, see {@link @tanstack/react-query!useQuery | `useQuery()`} for more infos
101
93
  */
102
94
  query?: QueryOptions;
103
95
  }
104
96
  /**
105
- * Hook that return a query helping to get the current product information
97
+ * Hook that return a query helping to get the current merchant information
106
98
  *
107
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.getProductInformation | `getProductInformation()`} action
99
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.getMerchantInformation | `getMerchantInformation()`} action
108
100
  *
109
- * @param args
101
+ * @param args - Optional config object with `query` for customizing the underlying {@link @tanstack/react-query!useQuery | `useQuery()`}
110
102
  *
111
103
  * @group hooks
112
104
  *
113
105
  * @returns
114
- * The query hook wrapping the `getProductInformation()` action
115
- * The `data` result is a {@link @frak-labs/core-sdk!index.GetProductInformationReturnType | `GetProductInformationReturnType`}
106
+ * The query hook wrapping the `getMerchantInformation()` action
107
+ * The `data` result is a {@link @frak-labs/core-sdk!index.GetMerchantInformationReturnType | `GetMerchantInformationReturnType`}
116
108
  *
117
- * @see {@link @frak-labs/core-sdk!actions.getProductInformation | `getProductInformation()`} for more info about the underlying action
109
+ * @see {@link @frak-labs/core-sdk!actions.getMerchantInformation | `getMerchantInformation()`} for more info about the underlying action
118
110
  * @see {@link @tanstack/react-query!useQuery | `useQuery()`} for more info about the useQuery options and response
119
111
  */
120
- declare function useGetProductInformation({
112
+ declare function useGetMerchantInformation({
121
113
  query
122
- }?: UseGetProductInformationParams): _tanstack_react_query0.UseQueryResult<undefined, FrakRpcError<undefined>>;
114
+ }?: UseGetMerchantInformationParams): _tanstack_react_query0.UseQueryResult<GetMerchantInformationReturnType, FrakRpcError<undefined>>;
123
115
  //#endregion
124
116
  //#region src/hook/useOpenSso.d.ts
125
117
  /** @ignore */
126
- type MutationOptions$3 = Omit<UseMutationOptions<OpenSsoReturnType, FrakRpcError, OpenSsoParamsType>, "mutationFn" | "mutationKey">;
118
+ type MutationOptions$2 = Omit<UseMutationOptions<OpenSsoReturnType, FrakRpcError, OpenSsoParamsType>, "mutationFn" | "mutationKey">;
127
119
  /** @inline */
128
120
  interface UseOpenSsoParams {
129
121
  /**
130
122
  * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
131
123
  */
132
- mutations?: MutationOptions$3;
124
+ mutations?: MutationOptions$2;
133
125
  }
134
126
  /**
135
127
  * Hook that return a mutation helping to open the SSO page
136
128
  *
137
129
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.openSso | `openSso()`} action
138
130
  *
139
- * @param args
131
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
140
132
  *
141
133
  * @group hooks
142
134
  *
@@ -191,37 +183,6 @@ declare function useOpenSso({
191
183
  */
192
184
  declare function usePrepareSso(params: PrepareSsoParamsType): _tanstack_react_query0.UseQueryResult<_frak_labs_core_sdk0.PrepareSsoReturnType, Error>;
193
185
  //#endregion
194
- //#region src/hook/useSendInteraction.d.ts
195
- /** @ignore */
196
- type MutationOptions$2 = Omit<UseMutationOptions<SendInteractionReturnType, FrakRpcError, SendInteractionParamsType>, "mutationFn" | "mutationKey">;
197
- /** @inline */
198
- interface UseSendInteractionParams {
199
- /**
200
- * Optional mutation options, see {@link @tanstack/react-query!useMutation | `useMutation()`} for more infos
201
- */
202
- mutations?: MutationOptions$2;
203
- }
204
- /**
205
- * Hook that return a mutation helping to send a user interaction
206
- *
207
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendInteraction | `sendInteraction()`} action
208
- *
209
- * @param args
210
- *
211
- * @group hooks
212
- *
213
- * @returns
214
- * The mutation hook wrapping the `sendInteraction()` action
215
- * The `mutate` and `mutateAsync` argument is of type {@link @frak-labs/core-sdk!index.SendInteractionParamsType | `SendInteractionParamsType`}
216
- * The `data` result is a {@link @frak-labs/core-sdk!index.SendInteractionReturnType | `SendInteractionReturnType`}
217
- *
218
- * @see {@link @frak-labs/core-sdk!actions.sendInteraction | `sendInteraction()`} for more info about the underlying action
219
- * @see {@link @tanstack/react-query!useMutation | `useMutation()`} for more info about the mutation options and response
220
- */
221
- declare function useSendInteraction({
222
- mutations
223
- }?: UseSendInteractionParams): _tanstack_react_query0.UseMutationResult<SendInteractionReturnType, FrakRpcError<undefined>, SendInteractionParamsType, unknown>;
224
- //#endregion
225
186
  //#region src/hook/useSendTransaction.d.ts
226
187
  /** @ignore */
227
188
  type MutationOptions$1 = Omit<UseMutationOptions<SendTransactionReturnType, FrakRpcError, SendTransactionParams>, "mutationFn" | "mutationKey">;
@@ -237,7 +198,7 @@ interface UseSendTransactionParams {
237
198
  *
238
199
  * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendTransaction | `sendTransaction()`} action
239
200
  *
240
- * @param args
201
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
241
202
  *
242
203
  * @group hooks
243
204
  *
@@ -266,9 +227,9 @@ interface UseSiweAuthenticateParams {
266
227
  /**
267
228
  * Hook that return a mutation helping to send perform a SIWE authentication
268
229
  *
269
- * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.sendTransaction | `sendTransaction()`} action
230
+ * It's a {@link @tanstack/react-query!home | `tanstack`} wrapper around the {@link @frak-labs/core-sdk!actions.siweAuthenticate | `siweAuthenticate()`} action
270
231
  *
271
- * @param args
232
+ * @param args - Optional config object with `mutations` for customizing the underlying {@link @tanstack/react-query!useMutation | `useMutation()`}
272
233
  *
273
234
  * @group hooks
274
235
  *
@@ -306,7 +267,7 @@ declare function useWalletStatus(): _tanstack_react_query0.UseQueryResult<Wallet
306
267
  * The context that will keep the Frak Wallet SDK configuration
307
268
  * @ignore
308
269
  */
309
- declare const FrakConfigContext: react2.Context<FrakWalletSdkConfig | undefined>;
270
+ declare const FrakConfigContext: react.Context<FrakWalletSdkConfig | undefined>;
310
271
  /**
311
272
  * Props to instantiate the Frak Wallet SDK configuration provider
312
273
  *
@@ -328,14 +289,14 @@ type FrakConfigProviderProps = {
328
289
  *
329
290
  * @param parameters
330
291
  */
331
- declare function FrakConfigProvider(parameters: PropsWithChildren<FrakConfigProviderProps>): react2.FunctionComponentElement<react2.ProviderProps<FrakWalletSdkConfig | undefined>>;
292
+ declare function FrakConfigProvider(parameters: PropsWithChildren<FrakConfigProviderProps>): react.FunctionComponentElement<react.ProviderProps<FrakWalletSdkConfig | undefined>>;
332
293
  //#endregion
333
294
  //#region src/provider/FrakIFrameClientProvider.d.ts
334
295
  /**
335
296
  * The context that will keep the Frak Wallet SDK client
336
297
  * @ignore
337
298
  */
338
- declare const FrakIFrameClientContext: react2.Context<FrakClient | undefined>;
299
+ declare const FrakIFrameClientContext: react.Context<FrakClient | undefined>;
339
300
  /**
340
301
  * Props to instantiate the Frak Wallet SDK configuration provider
341
302
  *
@@ -363,6 +324,6 @@ declare function FrakIFrameClientProvider({
363
324
  }: {
364
325
  style?: CSSProperties;
365
326
  children?: ReactNode;
366
- }): react2.FunctionComponentElement<react2.FragmentProps>;
327
+ }): react.FunctionComponentElement<react.FragmentProps>;
367
328
  //#endregion
368
- export { FrakConfigContext, FrakConfigProvider, type FrakConfigProviderProps, FrakIFrameClientContext, type FrakIFrameClientProps, FrakIFrameClientProvider, useDisplayModal, useFrakClient, useFrakConfig, useGetProductInformation, useOpenSso, usePrepareSso, useReferralInteraction, useSendInteraction, useSendTransactionAction, useSiweAuthenticate, useWalletStatus };
329
+ export { FrakConfigContext, FrakConfigProvider, type FrakConfigProviderProps, FrakIFrameClientContext, type FrakIFrameClientProps, FrakIFrameClientProvider, useDisplayModal, useFrakClient, useFrakConfig, useGetMerchantInformation, useOpenSso, usePrepareSso, useReferralInteraction, useSendTransactionAction, useSiweAuthenticate, useWalletStatus };
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- import{displayModal as e,getProductInformation as t,openSso as n,prepareSso as r,processReferral as i,sendInteraction as a,sendTransaction as o,siweAuthenticate as s,watchWalletStatus as c}from"@frak-labs/core-sdk/actions";import{ClientNotFound as l,FrakRpcError as u,RpcErrorCodes as d}from"@frak-labs/frame-connector";import{useMutation as f,useQuery as p,useQueryClient as m}from"@tanstack/react-query";import{Fragment as h,createContext as g,createElement as _,useCallback as v,useContext as y,useEffect as b,useMemo as x,useState as S}from"react";import{FrakContextManager as C,baseIframeProps as w,createIFrameFrakClient as T}from"@frak-labs/core-sdk";const E=g(void 0);function D(e){let{children:t,config:n}=e;return _(E.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const O=g(void 0);function k({style:e,children:t}){let n=L(),[r,i]=S(void 0);return _(h,null,_(`iframe`,{...w,src:`${n.walletUrl}/listener`,style:e??w.style,ref:e=>{!e||r||i(T({iframe:e,config:n}))}}),_(O.Provider,{value:r},t))}function A(){return y(O)}function j(){let e=m(),t=A(),n=v(t=>{e.setQueryData([`frak-sdk`,`wallet-status-listener`],t)},[e]);return p({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!t)throw new l;return c(t,n)},enabled:!!t})}function M(){let[e,t]=S(!1);return b(()=>{t(!0)},[]),e}function N(){let e=M(),[t,n]=S(e?window.location:void 0);return b(()=>{if(!e)return;function r(){n(window.location)}return t||r(),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`popstate`,r)}},[e,t]),{location:t,href:x(()=>t?.href,[t?.href])}}function P(){let{location:e}=N();return{frakContext:x(()=>e?.href?C.parse({url:e.href}):null,[e?.href]),updateContext:v(t=>{console.log(`Updating context`,{newContext:t}),C.replaceUrl({url:e?.href,context:t})},[e?.href])}}function F({productId:e,modalConfig:t,options:n}={}){let r=A(),{frakContext:a}=P(),{data:o}=j(),{data:s,error:c,status:u}=p({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`auto-referral-interaction`,a?.r??`no-referrer`,o?.key??`no-wallet-status`,e??`no-product-id`],queryFn:()=>{if(!r)throw new l;return i(r,{walletStatus:o,frakContext:a,modalConfig:t,productId:e,options:n})},enabled:!!o});return x(()=>u===`pending`?`processing`:u===`error`?c:s||`idle`,[s,u,c])}function I({mutations:t}={}){let n=A();return f({...t,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async t=>{if(!n)throw new l;return e(n,t)}})}function L(){let e=y(E);if(!e)throw new u(d.configError,`Frak config not found`);return e}function R({query:e}={}){let n=A();return p({...e,queryKey:[`frak-sdk`,`get-product-information`],queryFn:async()=>{if(!n)throw new l;return t(n)}})}function z({mutations:e}={}){let t=A();return f({...e,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async e=>{if(!t)throw new l;return n(t,e)}})}function B(e){let t=A();return p({queryKey:[`frak-sdk`,`prepare-sso`,e],queryFn:async()=>{if(!t)throw new l;return r(t,e)}})}function V({mutations:e}={}){let t=A();return f({...e,mutationKey:[`frak-sdk`,`send-interaction`],mutationFn:async e=>{if(!t)throw new l;return a(t,e)}})}function H({mutations:e}={}){let t=A();return f({...e,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async e=>{if(!t)throw new l;return o(t,e)}})}function U({mutations:e}={}){let t=A();return f({...e,mutationKey:[`frak-sdk`,`siwe-authenticate`,t?.config.domain??`no-domain`],mutationFn:async e=>{if(!t)throw new l;return s(t,e)}})}export{E as FrakConfigContext,D as FrakConfigProvider,O as FrakIFrameClientContext,k as FrakIFrameClientProvider,I as useDisplayModal,A as useFrakClient,L as useFrakConfig,R as useGetProductInformation,z as useOpenSso,B as usePrepareSso,F as useReferralInteraction,V as useSendInteraction,H as useSendTransactionAction,U as useSiweAuthenticate,j as useWalletStatus};
1
+ import{displayModal as e,getMerchantInformation as t,openSso as n,prepareSso as r,processReferral as i,sendTransaction as a,siweAuthenticate as o,watchWalletStatus as s}from"@frak-labs/core-sdk/actions";import{ClientNotFound as c,FrakRpcError as l,RpcErrorCodes as u}from"@frak-labs/frame-connector";import{useMutation as d,useQuery as f,useQueryClient as p}from"@tanstack/react-query";import{Fragment as m,createContext as h,createElement as g,useCallback as _,useContext as v,useEffect as y,useMemo as b,useState as x}from"react";import{FrakContextManager as S,baseIframeProps as C,createIFrameFrakClient as w}from"@frak-labs/core-sdk";const T=h(void 0);function E(e){let{children:t,config:n}=e;return g(T.Provider,{value:{...n,walletUrl:n.walletUrl??`https://wallet.frak.id`,domain:n.domain??(typeof window<`u`?window?.location?.host:void 0)??`not-found`}},t)}const D=h(void 0);function O({style:e,children:t}){let n=I(),[r,i]=x(void 0);return g(m,null,g(`iframe`,{...C,src:`${n.walletUrl}/listener`,style:e??C.style,ref:e=>{!e||r||i(w({iframe:e,config:n}))}}),g(D.Provider,{value:r},t))}function k(){return v(D)}function A(){let e=p(),t=k(),n=_(t=>{e.setQueryData([`frak-sdk`,`wallet-status-listener`],t)},[e]);return f({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`wallet-status-listener`],queryFn:async()=>{if(!t)throw new c;return s(t,n)},enabled:!!t})}function j(){let[e,t]=x(!1);return y(()=>{t(!0)},[]),e}function M(){let e=j(),[t,n]=x(e?window.location:void 0);return y(()=>{if(!e)return;function r(){n(window.location)}return t||r(),window.addEventListener(`popstate`,r),()=>{window.removeEventListener(`popstate`,r)}},[e,t]),{location:t,href:b(()=>t?.href,[t?.href])}}function N(){let{location:e}=M();return{frakContext:b(()=>e?.href?S.parse({url:e.href}):null,[e?.href]),updateContext:_(t=>{console.log(`Updating context`,{newContext:t}),S.replaceUrl({url:e?.href,context:t})},[e?.href])}}function P({options:e}={}){let t=k(),{frakContext:n}=N(),{data:r}=A(),{data:a,error:o,status:s}=f({gcTime:0,staleTime:0,queryKey:[`frak-sdk`,`auto-referral-interaction`,n?.r??`no-referrer`,r?.key??`no-wallet-status`],queryFn:()=>{if(!t)throw new c;return i(t,{walletStatus:r,frakContext:n,options:e})},enabled:!!r});return b(()=>s===`pending`?`processing`:s===`error`?o:a||`idle`,[a,s,o])}function F({mutations:t}={}){let n=k();return d({...t,mutationKey:[`frak-sdk`,`display-modal`],mutationFn:async t=>{if(!n)throw new c;return e(n,t)}})}function I(){let e=v(T);if(!e)throw new l(u.configError,`Frak config not found`);return e}function L({query:e}={}){let n=k();return f({...e,queryKey:[`frak-sdk`,`get-merchant-information`],queryFn:async()=>{if(!n)throw new c;return t(n)}})}function R({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`open-sso`],mutationFn:async e=>{if(!t)throw new c;return n(t,e)}})}function z(e){let t=k();return f({queryKey:[`frak-sdk`,`prepare-sso`,e],queryFn:async()=>{if(!t)throw new c;return r(t,e)}})}function B({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`send-transaction`],mutationFn:async e=>{if(!t)throw new c;return a(t,e)}})}function V({mutations:e}={}){let t=k();return d({...e,mutationKey:[`frak-sdk`,`siwe-authenticate`,t?.config.domain??`no-domain`],mutationFn:async e=>{if(!t)throw new c;return o(t,e)}})}export{T as FrakConfigContext,E as FrakConfigProvider,D as FrakIFrameClientContext,O as FrakIFrameClientProvider,F as useDisplayModal,k as useFrakClient,I as useFrakConfig,L as useGetMerchantInformation,R as useOpenSso,z as usePrepareSso,P as useReferralInteraction,B as useSendTransactionAction,V as useSiweAuthenticate,A as useWalletStatus};
package/package.json CHANGED
@@ -11,7 +11,7 @@
11
11
  "url": "https://twitter.com/QNivelais"
12
12
  }
13
13
  ],
14
- "version": "0.1.1",
14
+ "version": "0.2.0-beta.7898df5b",
15
15
  "description": "React SDK of the Frak wallet, low level library to interact directly with the frak ecosystem.",
16
16
  "repository": {
17
17
  "url": "https://github.com/frak-id/wallet",
@@ -33,7 +33,8 @@
33
33
  },
34
34
  "type": "module",
35
35
  "files": [
36
- "/dist"
36
+ "/dist",
37
+ "/src"
37
38
  ],
38
39
  "main": "./dist/index.cjs",
39
40
  "types": "./dist/index.d.cts",
@@ -58,7 +59,7 @@
58
59
  "build": "tsdown",
59
60
  "build:watch": "tsdown --watch",
60
61
  "check-exports": "attw --pack .",
61
- "typecheck": "tsc --noEmit",
62
+ "typecheck": "tsgo --noEmit",
62
63
  "test": "vitest",
63
64
  "test:ui": "vitest --ui",
64
65
  "test:coverage": "vitest --coverage",
@@ -66,8 +67,8 @@
66
67
  "publish": "echo 'Publishing react...'"
67
68
  },
68
69
  "dependencies": {
69
- "@frak-labs/frame-connector": "0.1.0",
70
- "@frak-labs/core-sdk": "0.1.0"
70
+ "@frak-labs/frame-connector": "0.2.0-beta.7898df5b",
71
+ "@frak-labs/core-sdk": "0.2.0-beta.7898df5b"
71
72
  },
72
73
  "peerDependencies": {
73
74
  "viem": "^2.x",
@@ -78,22 +79,22 @@
78
79
  "@arethetypeswrong/cli": "^0.18.2",
79
80
  "@frak-labs/dev-tooling": "0.0.0",
80
81
  "@frak-labs/test-foundation": "0.1.0",
81
- "@frak-labs/wallet-shared": "0.0.0",
82
- "@tanstack/react-query": "^5.90.16",
82
+ "@frak-labs/wallet-shared": "0.0.2",
83
+ "@tanstack/react-query": "^5.90.20",
83
84
  "@testing-library/jest-dom": "^6.9.1",
84
- "@testing-library/react": "^16.3.1",
85
+ "@testing-library/react": "^16.3.2",
85
86
  "@testing-library/react-hooks": "^8.0.1",
86
87
  "@testing-library/user-event": "^14.6.1",
87
88
  "@types/jsdom": "^27.0.0",
88
- "@types/node": "^24.10.4",
89
- "@types/react": "19.2.7",
90
- "@vitest/coverage-v8": "^4.0.16",
91
- "@vitest/ui": "^4.0.16",
92
- "jsdom": "^27.3.0",
93
- "react": "^19.2.3",
94
- "tsdown": "^0.18.2",
89
+ "@types/node": "^24.10.13",
90
+ "@types/react": "19.2.13",
91
+ "@vitest/coverage-v8": "^4.0.18",
92
+ "@vitest/ui": "^4.0.18",
93
+ "jsdom": "^28.0.0",
94
+ "react": "^19.2.4",
95
+ "tsdown": "^0.20.3",
95
96
  "typescript": "^5",
96
97
  "viem": "^2.39.0",
97
- "vitest": "^4.0.16"
98
+ "vitest": "^4.0.18"
98
99
  }
99
100
  }