Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 8 additions & 15 deletions main/docs/libraries/acul/js-sdk/Screens/classes/Login.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ The Login class implements the `login` screen functionality. This screen collect

## Constructors

Creates an instance of Login screen manager
Create an instance of Login screen manager

```ts Example
import Login from "@auth0/auth0-acul-js/login";
Expand All @@ -22,7 +22,7 @@ loginManager.login({
## Properties

<ParamField body='branding' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/BrandingMembers">BrandingMembers</a></span>}>
Provides branding-related configurations, such as theme settings for the `login` screen.
Provides branding-related configurations, such as branding theme and settings.
</ParamField>

<ParamField body='client' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/ClientMembers">ClientMembers</a></span>}>
Expand Down Expand Up @@ -77,11 +77,11 @@ loginManager.federatedLogin({
<Expandable title="Parameters">

<ParamField body='connection' type='string' required>
The social connection name to use
The social connection name to use.
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand Down Expand Up @@ -120,7 +120,7 @@ The captcha code or response from the captcha provider. This property is require
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -142,7 +142,7 @@ loginManager.pickCountryCode();

<Expandable title="Parameters">
<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -151,21 +151,14 @@ The authentication transaction state

<ParamField body='getErrors' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/Error">Error</a>[]</span>}>

Retrieves the array of transaction errors from the context, or an empty array if none exist.

An array of error objects from the transaction context.
This method retrieves the array of transaction errors from the context, or an empty array if none exist. An array of error objects from the transaction context.

</ParamField>

---

<ParamField body='getLoginIdentifiers' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/type-aliases/ScreenIdentifierType">ScreenIdentifierType</a>[]</span>}>

**`Utility Feature`**

Gets the active identifier types for the login screen

An array of active identifier types or null if none are active
This method lets the active identifier types for the login screen. An array of active identifier types or `null` if none are active

```typescript Example
import Login from "@auth0/auth0-acul-js/login";
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ to verify their identity during the login process.

## Constructors

Creates an instance of LoginEmailVerification screen manager
Create an instance of LoginEmailVerification screen manager

```typescript Example
// How to use the LoginEmailVerification screen SDK:
Expand All @@ -24,11 +24,11 @@ const loginEmailVerificationManager = new LoginEmailVerification();
## Properties

<ParamField body='branding' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/BrandingMembers">BrandingMembers</a></span>}>
Provides branding-related configurations, such as theme settings for the `login-email-verification` screen.
Provides branding-related configurations, such as branding theme and settings.
</ParamField>

<ParamField body='client' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/ClientMembers">ClientMembers</a></span>}>
Provides client-related configurations, such as `id`, `name`, and `logoUrl`, for the `login-email-verification`screen.
Provides client-related configurations, such as `id`, `name`, and `logoUrl`.
</ParamField>

<ParamField body='organization' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/OrganizationMembers">OrganizationMembers</a></span>}>
Expand Down Expand Up @@ -88,7 +88,7 @@ or alphanumeric string that the user must enter into the form.
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand Down Expand Up @@ -120,7 +120,7 @@ manager.resendCode()
<Expandable title="Parameters">

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -129,7 +129,7 @@ The authentication transaction state

<ParamField body='resendManager' type='(options ?)'/>

This method resends functionality with timeout management for this screen
This method gets resend functionality with timeout management for this screen.

```typescript Example
import LoginEmailVerification from '@auth0/auth0-acul-js/login-email-verification';
Expand All @@ -153,7 +153,9 @@ startResend();

<Expandable title="Parameters">

<ParamField body='onStatusChange?' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/type-aliases/OnStatusChangeCallback">OnStatusChangeCallback</a></span>}/>
<ParamField body='onStatusChange?' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/type-aliases/OnStatusChangeCallback">OnStatusChangeCallback</a></span>}>
Callback function for status changes during resend countdown.
</ParamField>

<ParamField body='onTimeout' type='void'/>

Expand All @@ -165,8 +167,6 @@ startResend();

<ParamField body='getErrors' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/Error">Error</a>[]</span>}>

Retrieves the array of transaction errors from the context, or an empty array if none exist.

An array of error objects from the transaction context.
This method retrieves the array of transaction errors from the context, or an empty array if none exist. An array of error objects from the transaction context.

</ParamField>
58 changes: 28 additions & 30 deletions main/docs/libraries/acul/js-sdk/Screens/classes/LoginId.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ loginIdManager.getLoginIdentifiers();
## Properties

<ParamField body='branding' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/BrandingMembers">BrandingMembers</a></span>}>
Provides branding-related configurations, such as theme settings for the `login-id` screen.
Provides branding-related configurations, such as branding theme and settings.
</ParamField>

<ParamField body='client' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/ClientMembers">ClientMembers</a></span>}>
Expand Down Expand Up @@ -84,25 +84,21 @@ loginIdManager.federatedLogin({

**Method Parameters**

<ParamField body='options' type='OPTIONAL'>
An object containing the necessarty parameters for selecting a specific social connection for login.
</ParamField>

<Expandable title="Parameters">

<ParamField body='connection' type='string' required>
The social connection name to use
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>

---

<ParamField body='login' type='OPTIONAL'/>
<ParamField body='login' type='(options ?)'/>

This method prompts the user to provide their username.

Expand All @@ -129,7 +125,7 @@ The captcha code or response from the captcha provider. This property is require
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -153,7 +149,7 @@ loginIdManager.passkeyLogin();
<Expandable title="Parameters">

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -175,16 +171,16 @@ loginIdManager.pickCountryCode();

<Expandable title="Parameters">
<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>

---

<ParamField body='registerPasskeyAutofill' type='(inputId?: string)'>
<ParamField body='registerPasskeyAutofill' type='(inputId?: string)'/>

Registers the browser's Conditional UI for passkeys (autocomplete experience).
This method registers the browser's Conditional UI for passkeys (autocomplete experience).

This method initializes a passive WebAuthn credential request using
`navigator.credentials.get()` with `mediation: "conditional"`. When supported,
Expand All @@ -195,7 +191,21 @@ Call this **once** when the login screen is initialized (for example, on page lo
After registration, focusing the username input will automatically display
matching passkeys as suggestions. Selecting a passkey completes authentication
without requiring additional user interaction.
</ParamField>

```ts Example
import LoginId from '@auth0/auth0-acul-js/login-id';

// Example: initializing passkey autocomplete inside an async setup block.
async function initializeLogin() {
const loginId = new LoginId();
// Make sure associated HTML input exists:
// <input id="username" autocomplete="webauthn username" />
// Conditional UI registration.
await loginId.registerPasskeyAutofill('username');
}

initializeLogin().catch(console.error);
```

**Input configuration**
If an `inputId` is provided, the SDK will:
Expand All @@ -221,27 +231,16 @@ the input element manually with the correct attributes:

**Method Parameters**

<Expandable title="Parameters">

<ParamField body='inputId?' type='string'>
`string`

Optional ID of the username `<input>` element (without `#`). Example: `"username"`.
If omitted, the developer must manually ensure the correct `autocomplete` attributes.
</ParamField>

```ts Example
import LoginId from '@auth0/auth0-acul-js/login-id';

// Example: initializing passkey autocomplete inside an async setup block.
async function initializeLogin() {
const loginId = new LoginId();
// Make sure associated HTML input exists:
// <input id="username" autocomplete="webauthn username" />
// Conditional UI registration.
await loginId.registerPasskeyAutofill('username');
}
</Expandable>

initializeLogin().catch(console.error);
```

**Remarks**

Expand All @@ -253,16 +252,15 @@ only be invoked once per page lifecycle.

<ParamField body='getErrors' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/Error">Error</a>[]</span>}>

Retrieves the array of transaction errors from the context, or an empty array if none exist.
This method retrieves the array of transaction errors from the context, or an empty array if none exist.

</ParamField>

---

<ParamField body='getLoginIdentifiers' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/type-aliases/ScreenIdentifierType">ScreenIdentifierType</a>[]</span>}>


Gets the active identifier types for the login screen
This method gets the active identifier types for the login screen.

```typescript Example
import LoginId from "@auth0/auth0-acul-js/login";
Expand Down
20 changes: 9 additions & 11 deletions main/docs/libraries/acul/js-sdk/Screens/classes/LoginPassword.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ The LoginPassword class implements the `login-password` screen functionality. Th

## Constructors

Creates an instance of LoginPassword screen manager
Create an instance of LoginPassword screen manager

```ts Example
import LoginPassword from "@auth0/auth0-acul-js/login-password";
Expand All @@ -22,11 +22,11 @@ loginPasswordManager.login({
## Properties

<ParamField body='branding' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/BrandingMembers">BrandingMembers</a></span>}>
Provides branding-related configurations, such as theme settings for the `login-password` screen.
Provides branding-related configurations, such as branding theme and settings.
</ParamField>

<ParamField body='client' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/ClientMembers">ClientMembers</a></span>}>
Provides client-related configurations, such as `id`, `name`, and `logoUrl`, for the `login-password` screen.
Provides client-related configurations, such as `id`, `name`, and `logoUrl`.
</ParamField>

<ParamField body='organization' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/OrganizationMembers">OrganizationMembers</a></span>}>
Expand Down Expand Up @@ -89,11 +89,11 @@ loginIdManager.federatedLogin({
<Expandable title="Parameters">

<ParamField body='connection' type='string' required>
The social connection name to use
The social connection name to use.
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand Down Expand Up @@ -129,7 +129,7 @@ The captcha code or response from the captcha provider. This property is require
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand Down Expand Up @@ -160,11 +160,11 @@ handleSwitchConnection('sms'); // Switch to SMS-based authentication
<Expandable title="Parameters">

<ParamField body='connection' type='string' required>
The social connection name to use
The social connection name to use.
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand All @@ -173,8 +173,6 @@ The authentication transaction state

<ParamField body='getErrors' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/Error">Error</a>[]</span>}>

This method retrieves the array of transaction errors from the context, or an empty array if none exist.

An array of error objects from the transaction context.
This method retrieves the array of transaction errors from the context, or an empty array if none exist. An array of error objects from the transaction context.

</ParamField>
Original file line number Diff line number Diff line change
Expand Up @@ -70,9 +70,7 @@ Details of the active user, including `username`, `email`, and `roles`.

<ParamField body='getErrors' type={<span><a href="/docs/libraries/acul/js-sdk/Screens/interfaces/Error">Error</a>[]</span>}>

Retrieves the array of transaction errors from the context, or an empty array if none exist.

An array of error objects from the transaction context.
This method retrieves the array of transaction errors from the context, or an empty array if none exist. An array of error objects from the transaction context.

</ParamField>

Expand All @@ -93,7 +91,7 @@ loginPasswordlessEmailCode.resendCode();
<Expandable title="Parameters">

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

</Expandable>
Expand Down Expand Up @@ -165,11 +163,9 @@ The code entered by the user.
</ParamField>

<ParamField body='[`key`: `string`]' type='"string" | "number" | "boolean" | "undefined"'>
The authentication transaction state
Additional data collected from the user.
</ParamField>

Additional data collected from the user.

</Expandable>

---
Expand Down
Loading