feat(clerk-js,types): Add support for ticket sign-ins and sign-ups (#6806)

Author: dstaley

.changeset/two-mangos-rest.md

@@ -0,0 +1,6 @@
+---
+'@clerk/clerk-js': minor
+'@clerk/types': minor
+---
+
+[Experimental] Add support for ticket sign-ins and sign-ups

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

@@ -44,6 +44,7 @@ import type {
   SignInFutureResetPasswordSubmitParams,
   SignInFutureResource,
   SignInFutureSSOParams,
+  SignInFutureTicketParams,
   SignInFutureTOTPVerifyParams,
   SignInIdentifier,
   SignInJSON,
@@ -914,6 +915,11 @@ class SignInFuture implements SignInFutureResource {
     });
   }
 
+  async ticket(params?: SignInFutureTicketParams): Promise<{ error: unknown }> {
+    const ticket = params?.ticket ?? getClerkQueryParam('__clerk_ticket');
+    return this.create({ ticket: ticket ?? undefined });
+  }
+
   async finalize(params?: SignInFutureFinalizeParams): Promise<{ error: unknown }> {
     const { navigate } = params || {};
     return runAsyncResourceTask(this.resource, async () => {

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

@@ -25,6 +25,7 @@ import type {
   SignUpFuturePhoneCodeVerifyParams,
   SignUpFutureResource,
   SignUpFutureSSOParams,
+  SignUpFutureTicketParams,
   SignUpFutureUpdateParams,
   SignUpIdentificationField,
   SignUpJSON,
@@ -44,6 +45,7 @@ import {
   generateSignatureWithMetamask,
   generateSignatureWithOKXWallet,
   getBaseIdentifier,
+  getClerkQueryParam,
   getCoinbaseWalletIdentifier,
   getMetamaskIdentifier,
   getOKXWalletIdentifier,
@@ -773,6 +775,11 @@ class SignUpFuture implements SignUpFutureResource {
     });
   }
 
+  async ticket(params?: SignUpFutureTicketParams): Promise<{ error: unknown }> {
+    const ticket = params?.ticket ?? getClerkQueryParam('__clerk_ticket');
+    return this.create({ ...params, ticket: ticket ?? undefined });
+  }
+
   async finalize(params?: SignUpFutureFinalizeParams): Promise<{ error: unknown }> {
     const { navigate } = params || {};
     return runAsyncResourceTask(this.resource, async () => {

packages/react/src/stateProxy.ts

@@ -91,6 +91,7 @@ export class StateProxy implements State {
           'verifyTOTP',
           'verifyBackupCode',
         ] as const),
+        ticket: this.gateMethod(target, 'ticket'),
       },
     };
   }
@@ -119,6 +120,7 @@ export class StateProxy implements State {
         update: gateMethod(target, 'update'),
         sso: gateMethod(target, 'sso'),
         password: gateMethod(target, 'password'),
+        ticket: gateMethod(target, 'ticket'),
         finalize: gateMethod(target, 'finalize'),
 
         verifications: wrapMethods(() => target().verifications, [

packages/types/src/signInFuture.ts

@@ -10,6 +10,7 @@ export interface SignInFutureCreateParams {
   redirectUrl?: string;
   actionCompleteRedirectUrl?: string;
   transfer?: boolean;
+  ticket?: string;
 }
 
 export type SignInFuturePasswordParams =
@@ -110,6 +111,10 @@ export interface SignInFutureBackupCodeVerifyParams {
   code: string;
 }
 
+export interface SignInFutureTicketParams {
+  ticket: string;
+}
+
 export interface SignInFutureFinalizeParams {
   navigate?: SetActiveNavigate;
 }
@@ -266,7 +271,12 @@ export interface SignInFutureResource {
   };
 
   /**
-   * Used to convert a sign-in with `status === ‘complete’` into an active session. Will cause anything observing the
+   * Used to perform a ticket-based sign-in.
+   */
+  ticket: (params?: SignInFutureTicketParams) => Promise<{ error: unknown }>;
+
+  /**
+   * Used to convert a sign-in with `status === 'complete'` into an active session. Will cause anything observing the
    * session state (such as the `useUser()` hook) to update automatically.
    */
   finalize: (params?: SignInFutureFinalizeParams) => Promise<{ error: unknown }>;

packages/types/src/signUpFuture.ts

@@ -11,6 +11,7 @@ interface SignUpFutureAdditionalParams {
 
 export interface SignUpFutureCreateParams extends SignUpFutureAdditionalParams {
   transfer?: boolean;
+  ticket?: string;
 }
 
 // This will likely get more properties
@@ -50,6 +51,10 @@ export interface SignUpFutureSSOParams {
   redirectCallbackUrl: string;
 }
 
+export interface SignUpFutureTicketParams extends SignUpFutureAdditionalParams {
+  ticket: string;
+}
+
 export interface SignUpFutureFinalizeParams {
   navigate?: SetActiveNavigate;
 }
@@ -116,7 +121,12 @@ export interface SignUpFutureResource {
   sso: (params: SignUpFutureSSOParams) => Promise<{ error: unknown }>;
 
   /**
-   * Used to convert a sign-up with `status === ‘complete’` into an active session. Will cause anything observing the
+   * Used to perform a ticket-based sign-up.
+   */
+  ticket: (params?: SignUpFutureTicketParams) => Promise<{ error: unknown }>;
+
+  /**
+   * Used to convert a sign-up with `status === 'complete'` into an active session. Will cause anything observing the
    * session state (such as the `useUser()` hook) to update automatically.
    */
   finalize: (params?: SignUpFutureFinalizeParams) => Promise<{ error: unknown }>;