@openfort/react 0.0.2 → 0.0.4

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.
package/README.md CHANGED
@@ -10,22 +10,18 @@
10
10
  Documentation
11
11
  </a>
12
12
  <span> | </span>
13
- <a href="https://www.openfort.io/docs/reference/api/authentication">
14
- API Docs
15
- </a>
16
- <span> | </span>
17
13
  <a href="https://x.com/openfort_hq">
18
14
  X
19
15
  </a>
20
- <span> | </span>
21
- <a href="https://create-next-app.openfort.xyz/">
16
+ <span> | </span>
17
+ <a href="https://playground.openfort.io/">
22
18
  Demo
23
19
  </a>
24
20
  </h4>
25
21
  </div>
26
22
 
27
23
 
28
- # Openfort Kit
24
+ # Openfort React SDK
29
25
 
30
26
  [![Downloads](https://img.shields.io/npm/dm/@openfort/react.svg)](https://www.npmjs.com/package/@openfort/react)
31
27
  [![License](https://img.shields.io/badge/license-MIT-green.svg)](LICENSE)
@@ -48,29 +44,29 @@ and much more...
48
44
 
49
45
  ### New app
50
46
 
51
- Get started with `create` Openfortkit + [wagmi](https://wagmi.sh/) + [viem](https://viem.sh) project by running one of the following in your terminal:
47
+ Get started with `create` Openfort + [wagmi](https://wagmi.sh/) + [viem](https://viem.sh) project by running one of the following in your terminal:
52
48
 
53
49
  #### npm
54
50
 
55
51
  ```sh
56
- npx create openfortkit
52
+ npx create openfort
57
53
  ```
58
54
 
59
55
  #### yarn
60
56
 
61
57
  ```sh
62
- yarn create openfortkit
58
+ yarn create openfort
63
59
  ```
64
60
 
65
61
  #### pnpm
66
62
 
67
63
  ```sh
68
- pnpm create openfortkit
64
+ pnpm create openfort
69
65
  ```
70
66
 
71
- ### Import `OpenfortKit` to your project
67
+ ### Import `Openfort` to your project
72
68
 
73
- Add OpenfortKit to your already existing project.
69
+ Add Openfort to your already existing project.
74
70
 
75
71
  #### npm
76
72
 
@@ -90,25 +86,21 @@ yarn add @openfort/react @tanstack/react-query wagmi viem
90
86
  pnpm add @openfort/react @tanstack/react-query wagmi viem
91
87
  ```
92
88
 
93
- ## Documentation
94
-
95
- You can find the full OpenfortKit documentation in the Family docs [here]().
96
-
97
89
  ## Examples
98
90
 
99
- There are various runnable examples included in this repository in the [examples folder](https://github.com/openfort-xyz/openfort-kit/tree/main/examples):
91
+ There are various runnable examples included in this repository in the [examples folder](https://github.com/openfort-xyz/openfort-react/tree/main/examples):
100
92
 
101
- - [Create React App Example (TypeScript)](https://github.com/openfort-xyz/openfort-kit/tree/main/examples/cra)
102
- - [Next.js Example (TypeScript)](https://github.com/openfort-xyz/openfort-kit/tree/main/examples/nextjs)
103
- - [Vite Example (TypeScript)](https://github.com/openfort-xyz/openfort-kit/tree/main/examples/vite)
93
+ - [Create React App Example (TypeScript)](https://github.com/openfort-xyz/openfort-react/tree/main/examples/cra)
94
+ - [Next.js Example (TypeScript)](https://github.com/openfort-xyz/openfort-react/tree/main/examples/nextjs)
95
+ - [Vite Example (TypeScript)](https://github.com/openfort-xyz/openfort-react/tree/main/examples/vite)
104
96
 
105
97
  ### Running Examples Locally
106
98
 
107
- Clone the FortKit project and install the necessary dependencies:
99
+ Clone the project and install the necessary dependencies:
108
100
 
109
101
  ```sh
110
- $ git clone git@github.com:openfort-xyz/openfort-kit.git
111
- $ cd openfort-kit
102
+ $ git clone git@github.com:openfort-xyz/openfort-react.git
103
+ $ cd openfort
112
104
  $ yarn install
113
105
  ```
114
106
 
@@ -128,8 +120,8 @@ $ yarn dev:cra # Create React App
128
120
 
129
121
  ## License
130
122
 
131
- See [LICENSE](https://github.com/openfort-xyz/openfort-kit/blob/main/LICENSE) for more information.
123
+ See [LICENSE](https://github.com/openfort-xyz/openfort-react/blob/main/LICENSE) for more information.
132
124
 
133
125
  ## Credits
134
126
 
135
- OpenfortKit is a fork of [Connectkit](https://github.com/openfort-xyz/openfort-kit) developed by [Family](https://family.co). We're grateful to them for making Connectkit fast, beautiful and open-source.
127
+ Openfort is a fork of [Connectkit](https://github.com/openfort-xyz/openfort-react) developed by [Family](https://family.co). We're grateful to them for making Connectkit fast, beautiful and open-source.
@@ -17,7 +17,7 @@ type ConnectButtonRendererProps = {
17
17
  ensName?: string;
18
18
  }) => React.ReactNode;
19
19
  };
20
- type OpenfortKitButtonProps = {
20
+ type OpenfortButtonProps = {
21
21
  label?: string;
22
22
  showBalance?: boolean;
23
23
  showAvatar?: boolean;
@@ -26,8 +26,8 @@ type OpenfortKitButtonProps = {
26
26
  customTheme?: CustomTheme;
27
27
  onClick?: (open: () => void) => void;
28
28
  };
29
- export declare function OpenfortKitButton({ label, showBalance, showAvatar, theme, mode, customTheme, onClick, }: OpenfortKitButtonProps): import("react/jsx-runtime").JSX.Element | null;
30
- export declare namespace OpenfortKitButton {
29
+ export declare function OpenfortButton({ label, showBalance, showAvatar, theme, mode, customTheme, onClick, }: OpenfortButtonProps): import("react/jsx-runtime").JSX.Element | null;
30
+ export declare namespace OpenfortButton {
31
31
  var Custom: React.FC<ConnectButtonRendererProps>;
32
32
  }
33
33
  export {};
@@ -10,7 +10,7 @@ type OpenfortProviderProps = {
10
10
  walletConfig?: OpenfortWalletConfig;
11
11
  } & useConnectCallbackProps;
12
12
  /**
13
- * OpenfortProvider component provides context and configuration for OpenfortKit.
13
+ * OpenfortProvider component provides context and configuration for Openfort.
14
14
  * It must be used within a WagmiProvider.
15
15
  *
16
16
  * @param {React.ReactNode} children - The child components to be wrapped by the provider.
@@ -34,5 +34,5 @@ export type ContextValue = {
34
34
  uiConfig?: OpenfortUIOptionsExtended;
35
35
  walletConfig?: OpenfortWalletConfig;
36
36
  } & useConnectCallbackProps;
37
- export declare const OpenfortKitContext: React.Context<ContextValue | null>;
37
+ export declare const Openfortcontext: React.Context<ContextValue | null>;
38
38
  export {};
@@ -1,7 +1,7 @@
1
1
  import React, { ReactNode } from 'react';
2
2
  import { CustomAvatarProps, CustomTheme, Languages, Mode, Theme } from '../../types';
3
3
  import { RecoveryMethod } from '@openfort/openfort-js';
4
- import { CoreOpenfortProviderProps } from '../../openfort/OpenfortProvider';
4
+ import { CoreOpenfortProviderProps } from '../../openfort/CoreOpenfortProvider';
5
5
  export declare const routes: {
6
6
  readonly PROVIDERS: "providers";
7
7
  readonly SOCIAL_PROVIDERS: "socialProviders";
@@ -84,7 +84,7 @@ export type OpenfortOptions = {
84
84
  termsOfServiceUrl?: string;
85
85
  privacyPolicyUrl?: string;
86
86
  logo?: React.ReactNode;
87
- openfortUrlOverrides?: CoreOpenfortProviderProps['overrides'];
87
+ overrides?: CoreOpenfortProviderProps['overrides'];
88
88
  };
89
89
  export type ConnectUIOptions = {
90
90
  theme?: Theme;
@@ -0,0 +1 @@
1
+ export declare const useOpenfort: () => import("./context").ContextValue;
@@ -1,39 +1,24 @@
1
1
  import { OpenfortHookOptions, OpenfortError } from "../../../types";
2
2
  import { AuthProvider } from "../../../components/Openfort/types";
3
- import { UserWallet } from "../useWallets";
4
- import { type AuthPlayerResponse as OpenfortUser } from '@openfort/openfort-js';
5
- type CallbackResult = StoreCredentialsResult | EmailVerificationResult;
6
- type EmailVerificationResult = {
7
- type: "verifyEmail";
8
- email?: string;
9
- error?: OpenfortError;
10
- };
11
- type StoreCredentialsResult = {
3
+ import { CreateWalletPostAuthOptions } from "./useCreateWalletPostAuth";
4
+ import { EmailVerificationResult } from "./useEmailAuth";
5
+ import { StoreCredentialsResult } from "./useOAuth";
6
+ type CallbackResult = (StoreCredentialsResult & {
12
7
  type: "storeCredentials";
13
- user?: OpenfortUser;
14
- wallet?: UserWallet;
15
- error?: OpenfortError;
16
- };
17
- type VerifyEmailOptions = {
18
- email: string;
19
- state: string;
20
- } & OpenfortHookOptions<EmailVerificationResult>;
21
- type StoreCredentialsOptions = {
22
- player: string;
23
- accessToken: string;
24
- refreshToken: string;
25
- } & OpenfortHookOptions<StoreCredentialsResult>;
8
+ }) | (EmailVerificationResult & {
9
+ type: "verifyEmail";
10
+ });
26
11
  type UseAuthCallbackOptions = {
27
- automaticallyHandleCallback?: boolean;
28
- } & OpenfortHookOptions<CallbackResult>;
29
- export declare const useAuthCallback: ({ automaticallyHandleCallback, ...hookOptions }?: UseAuthCallbackOptions) => {
12
+ enabled?: boolean;
13
+ } & OpenfortHookOptions<CallbackResult> & CreateWalletPostAuthOptions;
14
+ export declare const useAuthCallback: ({ enabled, ...hookOptions }?: UseAuthCallbackOptions) => {
15
+ email: string | null;
16
+ provider: AuthProvider | null;
17
+ verifyEmail: (options: import("./useEmailAuth").VerifyEmailOptions) => Promise<EmailVerificationResult>;
18
+ storeCredentials: ({ player, accessToken, refreshToken, ...options }: import("./useOAuth").StoreCredentialsOptions) => Promise<StoreCredentialsResult>;
30
19
  isLoading: boolean;
31
20
  isError: boolean;
32
21
  isSuccess: boolean;
33
22
  error: OpenfortError | null | undefined;
34
- email: string | null;
35
- provider: AuthProvider | null;
36
- verifyEmail: ({ email, state, ...options }: VerifyEmailOptions) => Promise<EmailVerificationResult>;
37
- storeCredentials: ({ player, accessToken, refreshToken, ...options }: StoreCredentialsOptions) => Promise<StoreCredentialsResult>;
38
23
  };
39
24
  export {};
@@ -1,5 +1,16 @@
1
+ export type CreateWalletPostAuthOptions = {
2
+ /**
3
+ * @default true
4
+ * It will log out the user if there is an error while trying to create a wallet (automatic recovery).
5
+ */
6
+ logoutOnError?: boolean;
7
+ /**
8
+ *
9
+ */
10
+ automaticRecovery?: boolean;
11
+ };
1
12
  export declare const useCreateWalletPostAuth: () => {
2
- tryUseWallet: () => Promise<{
13
+ tryUseWallet: ({ logoutOnError: signOutOnError, automaticRecovery }: CreateWalletPostAuthOptions) => Promise<{
3
14
  error?: import("../../..").OpenfortError;
4
15
  wallet?: import("../useWallets").UserWallet;
5
16
  }>;
@@ -1,5 +1,6 @@
1
1
  import { type AuthPlayerResponse as OpenfortUser } from '@openfort/openfort-js';
2
2
  import { OpenfortHookOptions, OpenfortError } from "../../../types";
3
+ import { CreateWalletPostAuthOptions } from './useCreateWalletPostAuth';
3
4
  import { UserWallet } from '../useWallets';
4
5
  export type EmailAuthResult = {
5
6
  error?: OpenfortError;
@@ -11,13 +12,13 @@ export type SignInEmailOptions = {
11
12
  email: string;
12
13
  password: string;
13
14
  emailVerificationRedirectTo?: string;
14
- } & OpenfortHookOptions<EmailAuthResult>;
15
+ } & OpenfortHookOptions<EmailAuthResult> & CreateWalletPostAuthOptions;
15
16
  export type SignUpEmailOptions = {
16
17
  email: string;
17
18
  password: string;
18
19
  name?: string;
19
20
  emailVerificationRedirectTo?: string;
20
- } & OpenfortHookOptions<EmailAuthResult>;
21
+ } & OpenfortHookOptions<EmailAuthResult> & CreateWalletPostAuthOptions;
21
22
  export type RequestResetPasswordOptions = {
22
23
  email: string;
23
24
  emailVerificationRedirectTo?: string;
@@ -32,9 +33,17 @@ export type LinkEmailOptions = {
32
33
  password: string;
33
34
  emailVerificationRedirectTo?: string;
34
35
  } & OpenfortHookOptions<EmailAuthResult>;
36
+ export type VerifyEmailOptions = {
37
+ email: string;
38
+ state: string;
39
+ } & OpenfortHookOptions<EmailVerificationResult>;
40
+ export type EmailVerificationResult = {
41
+ email?: string;
42
+ error?: OpenfortError;
43
+ };
35
44
  export type UseEmailHookOptions = {
36
45
  emailVerificationRedirectTo?: string;
37
- } & OpenfortHookOptions<EmailAuthResult>;
46
+ } & OpenfortHookOptions<EmailAuthResult | EmailVerificationResult> & CreateWalletPostAuthOptions;
38
47
  export declare const useEmailAuth: (hookOptions?: UseEmailHookOptions) => {
39
48
  requiresEmailVerification: boolean;
40
49
  isAwaitingInput: boolean;
@@ -44,6 +53,7 @@ export declare const useEmailAuth: (hookOptions?: UseEmailHookOptions) => {
44
53
  error: OpenfortError | null | undefined;
45
54
  signInEmail: (options: SignInEmailOptions) => Promise<EmailAuthResult>;
46
55
  signUpEmail: (options: SignUpEmailOptions) => Promise<EmailAuthResult>;
56
+ verifyEmail: (options: VerifyEmailOptions) => Promise<EmailVerificationResult>;
47
57
  linkEmail: (options: LinkEmailOptions) => Promise<EmailAuthResult>;
48
58
  requestResetPassword: (options: RequestResetPasswordOptions) => Promise<EmailAuthResult>;
49
59
  resetPassword: (options: ResetPasswordOptions) => Promise<EmailAuthResult>;
@@ -1,12 +1,13 @@
1
1
  import { type AuthPlayerResponse as OpenfortUser } from '@openfort/openfort-js';
2
2
  import { OpenfortHookOptions, OpenfortError } from "../../../types";
3
+ import { CreateWalletPostAuthOptions } from "./useCreateWalletPostAuth";
3
4
  import { UserWallet } from "../useWallets";
4
5
  export type GuestHookResult = {
5
6
  error?: OpenfortError;
6
7
  user?: OpenfortUser;
7
8
  wallet?: UserWallet;
8
9
  };
9
- export type GuestHookOptions = OpenfortHookOptions<OpenfortUser>;
10
+ export type GuestHookOptions = OpenfortHookOptions<GuestHookResult> & CreateWalletPostAuthOptions;
10
11
  export declare const useGuestAuth: (hookOptions?: GuestHookOptions) => {
11
12
  isLoading: boolean;
12
13
  isError: boolean;
@@ -1,15 +1,28 @@
1
- import { AuthProvider } from '../../../components/Openfort/types';
1
+ import { OAuthProvider } from '@openfort/openfort-js';
2
2
  import { OpenfortHookOptions, OpenfortError } from '../../../types';
3
+ import { CreateWalletPostAuthOptions } from './useCreateWalletPostAuth';
4
+ import { UserWallet } from "../useWallets";
5
+ import { type AuthPlayerResponse as OpenfortUser } from '@openfort/openfort-js';
3
6
  export type InitializeOAuthOptions = {
4
- provider: AuthProvider;
7
+ provider: OAuthProvider;
5
8
  redirectTo?: string;
6
- } & OpenfortHookOptions;
7
- export type AuthHookOptions = {
8
- redirectTo?: string;
9
- } & OpenfortHookOptions;
9
+ } & OpenfortHookOptions<InitOAuthReturnType>;
10
10
  export type InitOAuthReturnType = {
11
11
  error?: OpenfortError;
12
12
  };
13
+ export type StoreCredentialsResult = {
14
+ user?: OpenfortUser;
15
+ wallet?: UserWallet;
16
+ error?: OpenfortError;
17
+ };
18
+ export type StoreCredentialsOptions = {
19
+ player: string;
20
+ accessToken: string;
21
+ refreshToken: string;
22
+ } & OpenfortHookOptions<StoreCredentialsResult> & CreateWalletPostAuthOptions;
23
+ export type AuthHookOptions = {
24
+ redirectTo?: string;
25
+ } & OpenfortHookOptions<StoreCredentialsResult | InitOAuthReturnType> & CreateWalletPostAuthOptions;
13
26
  export declare const useOAuth: (hookOptions?: AuthHookOptions) => {
14
27
  isLoading: boolean;
15
28
  isError: boolean;
@@ -17,4 +30,5 @@ export declare const useOAuth: (hookOptions?: AuthHookOptions) => {
17
30
  error: OpenfortError | null | undefined;
18
31
  initOAuth: (options: InitializeOAuthOptions) => Promise<InitOAuthReturnType>;
19
32
  linkOauth: (options: InitializeOAuthOptions) => Promise<InitOAuthReturnType>;
33
+ storeCredentials: ({ player, accessToken, refreshToken, ...options }: StoreCredentialsOptions) => Promise<StoreCredentialsResult>;
20
34
  };
@@ -1,4 +1,4 @@
1
- export declare enum OpenfortKitStatus {
1
+ export declare enum OpenfortStatus {
2
2
  DISCONNECTED = 0,
3
3
  NEEDS_RECOVERY = 1,
4
4
  LOADING = 2,
@@ -1,15 +1,17 @@
1
+ import { RecoveryMethod } from "@openfort/openfort-js";
1
2
  import { Hex } from "viem";
2
3
  import { Connector } from "wagmi";
3
4
  import { embeddedWalletId } from "../../constants/openfort";
4
5
  import { OpenfortError, OpenfortHookOptions } from "../../types";
5
6
  export type UserWallet = {
6
- address?: `0x${string}`;
7
+ address?: Hex;
7
8
  connectorType?: string;
8
9
  walletClientType?: string;
9
10
  connector?: Connector;
10
11
  id: string;
11
12
  isAvailable: boolean;
12
- isActive: boolean;
13
+ isActive?: boolean;
14
+ isConnecting?: boolean;
13
15
  };
14
16
  type SetActiveWalletResult = {
15
17
  error?: OpenfortError;
@@ -23,26 +25,35 @@ type SetActiveWalletOptions = ({
23
25
  } | {
24
26
  connector: typeof embeddedWalletId;
25
27
  password?: string;
28
+ } | {
29
+ connector: Connector;
26
30
  })) & OpenfortHookOptions<SetActiveWalletResult>;
27
31
  type CreateWalletResult = SetActiveWalletResult;
28
32
  type CreateWalletOptions = {
29
33
  password?: string;
30
34
  } & OpenfortHookOptions<CreateWalletResult>;
35
+ type RecoverEmbeddedWalletResult = SetActiveWalletResult;
36
+ type SetRecoveryOptions = {
37
+ recoveryMethod: RecoveryMethod;
38
+ recoveryPassword?: string;
39
+ } & OpenfortHookOptions<CreateWalletResult>;
31
40
  type WalletOptions = OpenfortHookOptions<SetActiveWalletResult | CreateWalletResult>;
32
41
  export declare function useWallets(hookOptions?: WalletOptions): {
33
42
  exportPrivateKey: () => Promise<string>;
34
- isLoading: boolean;
43
+ error: OpenfortError | null | undefined;
35
44
  isError: boolean;
36
45
  isSuccess: boolean;
37
- error: OpenfortError | null | undefined;
46
+ isCreating: boolean;
47
+ isConnecting: boolean;
38
48
  wallets: UserWallet[];
39
49
  availableWallets: import("../../wallets/useWallets").WalletProps[];
40
50
  activeWallet: UserWallet | undefined;
41
- setActiveWallet: (options: SetActiveWalletOptions | string) => Promise<SetActiveWalletResult>;
51
+ setRecovery: (params: SetRecoveryOptions) => Promise<RecoverEmbeddedWalletResult>;
42
52
  createWallet: ({ password, ...options }?: CreateWalletOptions) => Promise<{
43
53
  error: OpenfortError;
44
54
  } | {
45
55
  wallet: UserWallet;
46
56
  }>;
57
+ setActiveWallet: (options: SetActiveWalletOptions | string) => Promise<SetActiveWalletResult>;
47
58
  };
48
59
  export {};
package/build/index.d.ts CHANGED
@@ -1,17 +1,17 @@
1
- export { OPENFORTKIT_VERSION } from './version';
1
+ export { OPENFORT_VERSION } from './version';
2
2
  export * from './types';
3
3
  export { default as getDefaultConfig } from './defaultConfig';
4
4
  export { default as getDefaultConnectors } from './defaultConnectors';
5
5
  export { wallets } from './wallets';
6
6
  export { AuthProvider, } from './components/Openfort/types';
7
- export { OpenfortKitContext, } from './components/Openfort/context';
8
- export { OpenfortProvider, } from './components/Openfort/OpenfortKit';
9
- export { OpenfortKitButton } from './components/ConnectButton';
7
+ export { Openfortcontext, } from './components/Openfort/context';
8
+ export { OpenfortProvider, } from './components/Openfort/OpenfortProvider';
9
+ export { OpenfortButton } from './components/ConnectButton';
10
10
  export { default as Avatar } from './components/Common/Avatar';
11
11
  export { default as ChainIcon } from './components/Common/Chain';
12
12
  export { useChains } from './hooks/useChains';
13
13
  export { useChainIsSupported } from './hooks/useChainIsSupported';
14
- export { useStatus, OpenfortKitStatus } from './hooks/openfort/useStatus';
14
+ export { useStatus, OpenfortStatus } from './hooks/openfort/useStatus';
15
15
  export { useUser } from './hooks/openfort/useUser';
16
16
  export { useUI } from "./hooks/openfort/useUI";
17
17
  export { useWallets, UserWallet } from "./hooks/openfort/useWallets";