feat(clerk-js,shared): Add additional verification fields to SignUpFuture

.changeset/khaki-colts-ring.md

@@ -0,0 +1,6 @@
+---
+'@clerk/clerk-js': minor
+'@clerk/shared': minor
+---
+
+Add additional verification fields to SignUpFuture.

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

@@ -30,6 +30,7 @@ import type {
   SignUpFuturePhoneCodeVerifyParams,
   SignUpFutureResource,
   SignUpFutureSSOParams,
+  SignUpFutureVerificationsResource,
   SignUpFutureTicketParams,
   SignUpFutureUpdateParams,
   SignUpFutureWeb3Params,
@@ -588,19 +589,58 @@ export class SignUp extends BaseResource implements SignUpResource {
   };
 }
 
+type SignUpFutureVerificationsMethods = Pick<
+  SignUpFutureVerificationsResource,
+  'sendEmailCode' | 'verifyEmailCode' | 'sendPhoneCode' | 'verifyPhoneCode'
+>;
+
+class SignUpFutureVerifications implements SignUpFutureVerificationsResource {
+  #resource: SignUp;
+
+  sendEmailCode: SignUpFutureVerificationsResource['sendEmailCode'];
+  verifyEmailCode: SignUpFutureVerificationsResource['verifyEmailCode'];
+  sendPhoneCode: SignUpFutureVerificationsResource['sendPhoneCode'];
+  verifyPhoneCode: SignUpFutureVerificationsResource['verifyPhoneCode'];
+
+  constructor(resource: SignUp, methods: SignUpFutureVerificationsMethods) {
+    this.#resource = resource;
+    this.sendEmailCode = methods.sendEmailCode;
+    this.verifyEmailCode = methods.verifyEmailCode;
+    this.sendPhoneCode = methods.sendPhoneCode;
+    this.verifyPhoneCode = methods.verifyPhoneCode;
+  }
+
+  get emailAddress() {
+    return this.#resource.verifications.emailAddress;
+  }
+
+  get phoneNumber() {
+    return this.#resource.verifications.phoneNumber;
+  }
+
+  get web3Wallet() {
+    return this.#resource.verifications.web3Wallet;
+  }
+
+  get externalAccount() {
+    return this.#resource.verifications.externalAccount;
+  }
+}
+
 class SignUpFuture implements SignUpFutureResource {
-  verifications = {
-    sendEmailCode: this.sendEmailCode.bind(this),
-    verifyEmailCode: this.verifyEmailCode.bind(this),
-    sendPhoneCode: this.sendPhoneCode.bind(this),
-    verifyPhoneCode: this.verifyPhoneCode.bind(this),
-  };
+  verifications: SignUpFutureVerifications;
 
   #canBeDiscarded = false;
   readonly #resource: SignUp;
 
   constructor(resource: SignUp) {
     this.#resource = resource;
+    this.verifications = new SignUpFutureVerifications(this.#resource, {
+      sendEmailCode: this.sendEmailCode.bind(this),
+      verifyEmailCode: this.verifyEmailCode.bind(this),
+      sendPhoneCode: this.sendPhoneCode.bind(this),
+      verifyPhoneCode: this.verifyPhoneCode.bind(this),
+    });
   }
 
   get id() {

packages/shared/src/types/signUpFuture.ts

@@ -1,8 +1,9 @@
 import type { ClerkError } from '../errors/clerkError';
 import type { SetActiveNavigate } from './clerk';
 import type { PhoneCodeChannel } from './phoneCodeChannel';
-import type { SignUpField, SignUpIdentificationField, SignUpStatus } from './signUpCommon';
+import type { SignUpField, SignUpIdentificationField, SignUpStatus, SignUpVerificationResource } from './signUpCommon';
 import type { Web3Strategy } from './strategies';
+import type { VerificationResource } from './verification';
 
 export interface SignUpFutureAdditionalParams {
   /**
@@ -252,6 +253,51 @@ export interface SignUpFutureFinalizeParams {
   navigate?: SetActiveNavigate;
 }
 
+/**
+ * An object that contains information about all available verification strategies.
+ */
+export interface SignUpFutureVerifications {
+  /**
+   * An object holding information about the email address verification.
+   */
+  readonly emailAddress: SignUpVerificationResource;
+
+  /**
+   * An object holding information about the phone number verification.
+   */
+  readonly phoneNumber: SignUpVerificationResource;
+
+  /**
+   * An object holding information about the Web3 wallet verification.
+   */
+  readonly web3Wallet: VerificationResource;
+
+  /**
+   * An object holding information about the external account verification.
+   */
+  readonly externalAccount: VerificationResource;
+
+  /**
+   * Used to send an email code to verify an email address.
+   */
+  sendEmailCode: () => Promise<{ error: ClerkError | null }>;
+
+  /**
+   * Used to verify a code sent via email.
+   */
+  verifyEmailCode: (params: SignUpFutureEmailCodeVerifyParams) => Promise<{ error: ClerkError | null }>;
+
+  /**
+   * Used to send a phone code to verify a phone number.
+   */
+  sendPhoneCode: (params: SignUpFuturePhoneCodeSendParams) => Promise<{ error: ClerkError | null }>;
+
+  /**
+   * Used to verify a code sent via phone.
+   */
+  verifyPhoneCode: (params: SignUpFuturePhoneCodeVerifyParams) => Promise<{ error: ClerkError | null }>;
+}
+
 /**
  * The `SignUpFuture` class holds the state of the current sign-up attempt and provides methods to drive custom sign-up
  * flows, including email/phone verification, password, SSO, ticket-based, and Web3-based account creation.
@@ -414,29 +460,9 @@ export interface SignUpFutureResource {
   update: (params: SignUpFutureUpdateParams) => Promise<{ error: ClerkError | null }>;
 
   /**
-   *
+   * An object that contains information about all available verification strategies.
    */
-  verifications: {
-    /**
-     * Used to send an email code to verify an email address.
-     */
-    sendEmailCode: () => Promise<{ error: ClerkError | null }>;
-
-    /**
-     * Used to verify a code sent via email.
-     */
-    verifyEmailCode: (params: SignUpFutureEmailCodeVerifyParams) => Promise<{ error: ClerkError | null }>;
-
-    /**
-     * Used to send a phone code to verify a phone number.
-     */
-    sendPhoneCode: (params: SignUpFuturePhoneCodeSendParams) => Promise<{ error: ClerkError | null }>;
-
-    /**
-     * Used to verify a code sent via phone.
-     */
-    verifyPhoneCode: (params: SignUpFuturePhoneCodeVerifyParams) => Promise<{ error: ClerkError | null }>;
-  };
+  verifications: SignUpFutureVerifications;
 
   /**
    * Used to sign up using an email address and password.