fix(clerk-js): Implement fixes from core-3 merge of Solana feature

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();
 

.changeset/tame-icons-know.md

@@ -0,0 +1,2 @@
+---
+---

packages/clerk-js/src/core/resources/SignIn.ts

@@ -469,13 +469,28 @@ export class SignIn extends BaseResource implements SignInResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-in.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use for authentication
+ * @returns A promise that resolves to the updated SignIn resource
+ * @throws {ClerkRuntimeError} If walletName is not provided or wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signIn.authenticateWithSolana({ walletName: 'phantom' });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ }: SignInAuthenticateWithSolanaParams): Promise<SignInResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
  strategy: 'web3_solana_signature',
- walletName: params.walletName,
+ walletName,
  });
  };
 

packages/clerk-js/src/core/resources/SignUp.ts

@@ -366,15 +366,37 @@ export class SignUp extends BaseResource implements SignUpResource {
  });
  };
 
- public authenticateWithSolana = async (params: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
- const identifier = await getSolanaIdentifier(params.walletName);
+ /**
+ * Authenticates a user using a Solana Web3 wallet during sign-up.
+ *
+ * @param params - Configuration for Solana authentication
+ * @param params.walletName - The name of the Solana wallet to use (e.g., 'phantom')
+ * @param params.unsafeMetadata - Optional unsafe metadata to attach to the user
+ * @param params.legalAccepted - Optional flag indicating legal terms acceptance
+ * @returns A promise that resolves to the updated SignUp resource
+ * @throws {ClerkRuntimeError} If wallet connection fails
+ *
+ * @example
+ * ```typescript
+ * await signUp.authenticateWithSolana({
+ * walletName: 'phantom',
+ * legalAccepted: true
+ * });
+ * ```
+ */
+ public authenticateWithSolana = async ({
+ walletName,
+ unsafeMetadata,
+ legalAccepted,
+ }: SignUpAuthenticateWithSolanaParams): Promise<SignUpResource> => {
+ const identifier = await getSolanaIdentifier(walletName);
  return this.authenticateWithWeb3({
  identifier,
- generateSignature: p => generateSignatureWithSolana({ ...p, walletName: params.walletName }),
- unsafeMetadata: params?.unsafeMetadata,
+ generateSignature: p => generateSignatureWithSolana({ ...p, walletName }),
+ unsafeMetadata,
  strategy: 'web3_solana_signature',
- legalAccepted: params?.legalAccepted,
- walletName: params.walletName,
+ legalAccepted,
+ walletName,
  });
  };
 

packages/clerk-js/src/ui/components/SignIn/SignInFactorOneSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -67,7 +67,7 @@ const SignInFactorOneSolanaWalletsCardInner = () => {
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignInUrl || '/',
  secondFactorUrl: 'factor-two',
- signUpContinueUrl: ctx.isCombinedFlow ? '../create/continue' : ctx.signUpContinueUrl,
+ signUpContinueUrl: ctx.isCombinedFlow ? 'create/continue' : ctx.signUpContinueUrl,
  strategy: 'web3_solana_signature',
  walletName,
  })

packages/clerk-js/src/ui/components/SignUp/SignUpStartSolanaWalletsCard.tsx

@@ -10,7 +10,7 @@ import { Header } from '@/ui/elements/Header';
 import { web3CallbackErrorHandler } from '@/ui/utils/web3CallbackErrorHandler';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -66,7 +66,7 @@ const SignUpStartSolanaWalletsCardInner = () => {
  .authenticateWithWeb3({
  customNavigate: router.navigate,
  redirectUrl: ctx.afterSignUpUrl || '/',
- signUpContinueUrl: '../continue',
+ signUpContinueUrl: 'continue',
  strategy: 'web3_solana_signature',
  unsafeMetadata: ctx.unsafeMetadata,
  walletName,

packages/clerk-js/src/ui/components/UserProfile/Web3SelectSolanaWalletScreen.tsx

@@ -1,3 +1,4 @@
+import { ClerkRuntimeError } from '@clerk/shared/error';
 import type { Web3Strategy } from '@clerk/shared/types';
 import { lazy, Suspense } from 'react';
 
@@ -6,11 +7,12 @@ import { useCardState } from '@/ui/elements/contexts';
 import { Form } from '@/ui/elements/Form';
 import { FormButtonContainer } from '@/ui/elements/FormButtons';
 import { FormContainer } from '@/ui/elements/FormContainer';
+import { handleError } from '@/ui/utils/errorHandler';
 
 import { Button, descriptors, Flex, localizationKeys, Spinner } from '../../customizables';
 
 const Web3SolanaWalletButtons = lazy(() =>
- import(/* webpackChunkName: "web3-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
+ import(/* webpackChunkName: "web3-solana-wallet-buttons" */ '@/ui/elements/Web3SolanaWalletButtons').then(m => ({
  default: m.Web3SolanaWalletButtons,
  })),
 );
@@ -30,9 +32,15 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  card.setIdle();
  } catch (err) {
  card.setIdle();
- console.error(err);
- } finally {
- close();
+ if (err instanceof Error) {
+ handleError(err, [], card.setError);
+ } else {
+ const error = new ClerkRuntimeError('An error occurred while generating the Solana signature.', {
+ code: 'web3_solana_signature_generation_failed',
+ cause: err instanceof Error ? err : undefined,
+ });
+ handleError(error, [], card.setError);
+ }
  }
  };
 
@@ -65,6 +73,7 @@ export const Web3SelectSolanaWalletScreen = ({ onConnect }: Web3SelectWalletProp
  </Suspense>
  <FormButtonContainer>
  <Button
+ type='button'
  variant='ghost'
  onClick={() => {
  close();

packages/clerk-js/src/ui/elements/Web3SolanaWalletButtons.tsx

@@ -177,6 +177,7 @@ const WalletButtonIcon = forwardRef((props: WalletButtonProps, ref: Ref<HTMLButt
  return (
  <Button
  ref={ref}
+ aria-label={label}
  textVariant='buttonLarge'
  variant='outline'
  colorScheme='neutral'

packages/clerk-js/src/utils/injectedWeb3SolanaProviders.ts

@@ -5,11 +5,16 @@ import type { Wallet } from '@wallet-standard/core';
 
 class InjectedWeb3SolanaProviders {
  #wallets: readonly Wallet[] | undefined = undefined;
+ #initialized: boolean = false;
  static #instance: InjectedWeb3SolanaProviders | null = null;
 
  private constructor() {}
 
  async #initialize() {
+ if (this.#initialized) {
+ return;
+ }
+ this.#initialized = true;
  const wallets = await import('@wallet-standard/core').then(mod => mod.getWallets());
  this.#wallets = wallets.get();