CodeUI

Configure the UI that’s used by the Code provider.

import { CodeUI } from "@openauthjs/openauth/ui/code"
import { CodeProvider } from "@openauthjs/openauth/provider/code"

export default issuer({
  providers: {
    code: CodeAdapter(
      CodeUI({
        copy: {
          code_info: "We'll send a pin code to your email"
        },
        sendCode: (claims, code) => console.log(claims.email, code)
      })
    )
  },
  // ...
})

---

Methods

CodeUI

CodeUI(props)

Parameters

• props CodeUIOptions

  Configure the UI.

Returns CodeProviderOptions

Creates a UI for the Code provider flow.

CodeUICopy

Type any

CodeUIOptions

• copy? Object

  • button_continue string

  • code_didnt_get string

  • code_info string

  • code_invalid string

  • code_placeholder string

  • code_resend string

  • code_resent string

  • code_sent string

  • email_invalid string

  • email_placeholder string

• mode? “email” | “phone”

• sendCode (claims: Record<string, string>, code: string) => Promise<void>

Configure the password UI.

CodeUIOptions.copy?

Type Object

Custom copy for the UI.

CodeUIOptions.copy.button_continue

Type string

Default “Continue”

Copy for the continue button.

CodeUIOptions.copy.code_didnt_get

Type string

Default “Didn’t get code?”

Copy for the link to resend the code.

CodeUIOptions.copy.code_info

Type string

Default “We’ll send a pin code to your email.”

Copy informing that the pin code will be emailed.

CodeUIOptions.copy.code_invalid

Type string

Default “Invalid code”

Error message when the code is invalid.

CodeUIOptions.copy.code_placeholder

Type string

Default “Code”

Copy for the pin code input.

CodeUIOptions.copy.code_resend

Type string

Default “Resend”

Copy for the resend button.

CodeUIOptions.copy.code_resent

Type string

Default “Code resent to ”

Copy for when the code was resent.

CodeUIOptions.copy.code_sent

Type string

Default “Code sent to ”

Copy for when the code was sent.

CodeUIOptions.copy.email_invalid

Type string

Default “Email address is not valid”

Error message when the email is invalid.

CodeUIOptions.copy.email_placeholder

Type string

Default “Email”

Copy for the email input.

CodeUIOptions.mode?

Type “email” | “phone”

Default “email”

The mode to use for the input.

CodeUIOptions.sendCode

Type (claims: Record<string, string>, code: string) => Promise<void>

Callback to send the pin code to the user.

The claims object contains the email or phone number of the user. You can send the code using this.

async (claims, code) => {
  // Send the code via the claim
}