LoginPassword

Import Example

import React, { useState } from "react";
import { useScreen, useTransaction, login, useErrors } from "@auth0/auth0-acul-react/login-password";
import { Logo } from "../../components/Logo";

​

Hooks de contexte

useBranding · () => BrandingMembers

Hook permettant d’accéder à la configuration de l’image de marque et du thème.

Example

import { useBranding } from '@auth0/auth0-acul-react/login-id';
function CustomTheme() {
  const branding = useBranding();
}

useClient · () => ClientMembers

Hook permettant d’accéder à la configuration de l’application Auth0 (client).

Example

import { useClient } from '@auth0/auth0-acul-react/login-id';
function AppInfo() {
  const client = useClient();
}

useOrganization · () => OrganizationMembers

Hook permettant d’accéder au contexte et aux paramètres de l’organisation.

Example

import { useOrganization } from '@auth0/auth0-acul-react/login-id';
function OrgSelector() {
  const organization = useOrganization();
  if (!organization) {
    return <p>Aucun contexte d'organisation</p>;
  }
}

usePrompt · () => PromptMembers

Hook permettant d’accéder à la configuration du prompt et aux paramètres du flux.

Example

import { usePrompt } from '@auth0/auth0-acul-react/login-id';
function FlowInfo() {
  const prompt = usePrompt();
}

useScreen · () => ScreenMembersOnLoginPassword

Hook permettant d’accéder aux informations et aux métadonnées de l’écran actuel.

Objet screen contenant le nom de l’écran actuel, sa configuration et les données propres à cet écran

Example

import { useScreen } from '@auth0/auth0-acul-react/login-id';
function ScreenDebug() {
  const screen = useScreen();
}

useTenant · () => TenantMembers

Hook permettant d’accéder à la configuration et aux paramètres du tenant.

Example

import { useTenant } from '@auth0/auth0-acul-react/login-id';
function TenantInfo() {
  const tenant = useTenant();
}

useTransaction · () => TransactionMembersOnLoginPassword

Hook permettant d’accéder à l’état de la transaction et aux données du flux d’authentification.

Objet de transaction contenant l’état du flux, les données de session et les informations propres à la transaction

Example

import { useTransaction } from '@auth0/auth0-acul-react/login-id';
function TransactionInfo() {
  const transaction = useTransaction();
}

useUntrustedData · () => UntrustedDataMembers

Hook permettant d’accéder aux données non fiables provenant des paramètres d’URL et des soumissions de formulaires.

Example

import { useUntrustedData } from '@auth0/auth0-acul-react/login-id';
function PrefilledForm() {
  const untrustedData = useUntrustedData();
}

useUser · () => UserMembers

Hook permettant d’accéder aux informations sur l’utilisateur et aux données de profil.

Example

import { useUser } from '@auth0/auth0-acul-react/login-id';
function UserProfile() {
  const user = useUser();
}

​

Méthodes

federatedLogin · void | Promise<void>

Afficher Paramètres

payload · FederatedLoginPasswordOptions

Propriétés

connection · string

login · void | Promise<void>

Afficher Paramètres

payload · LoginPasswordOptions

Propriétés

captcha? · string

password · string

username · string

useLoginPassword · LoginPasswordMembers

Afficher Paramètres

Propriétés

branding · BrandingMembers

Propriétés

settings · BrandingSettings

themes · BrandingThemes

​

BrandingSettings

export interface BrandingSettings {
  colors?: {
    primary?: string;
    pageBackground?:
      | string
      | {
          type: string;
          start: string;
          end: string;
          angleDegree: number;
        };
  };
  faviconUrl?: string;
  logoUrl?: string;
  fontUrl?: string;
}

​

Propriétés

colors? · object

Afficher Propriétés

pageBackground? · string | { angleDegree: number; end: string; start: string; type: string; }

primary? · string

faviconUrl? · string

fontUrl? · string

logoUrl? · string

​

BrandingThemes

export interface BrandingThemes {
  default: {
    borders: Record<string, string | boolean | number>;
    colors: Record<string, string>;
    displayName: string;
    fonts: Record<string, string | boolean | object>;
    pageBackground: Record<string, string>;
    widget: Record<string, string | number>;
  };
}

​

Propriétés

default · object

Afficher properties

borders · Record<string, string | boolean | number>

colors · Record<string, string>

displayName · string

fonts · Record<string, string | boolean | object>

pageBackground · Record<string, string>

widget · Record<string, string | number>

client · ClientMembers

Propriétés

description · string

id · string

logoUrl · string

metadata · {[key: string]: string; }

name · string

organization · OrganizationMembers

Propriétés

branding · Branding

displayName · string

id · string

metadata · {[key: string]: string; }

name · string

usage · string

prompt · PromptMembers

Propriétés

name · string

screen · ScreenMembersOnLoginPassword

Propriétés

captcha · CaptchaContext

captchaImage · string

captchaProvider · string

captchaSiteKey · string

data · username

editIdentifierLink · string

isCaptchaAvailable · boolean

links · Record

name · string

resetPasswordLink · string

signupLink · string

texts · Record

tenant · TenantMembers

Propriétés

enabledFactors · string[]

enabledLocales · string[]

friendlyName · string

name · string

transaction · TransactionMembersOnLoginPassword

Propriétés

alternateConnections · Connection

connectionStrategy · string

countryCode · string

countryPrefix · string

currentConnection · Connection

errors · Error

hasErrors · boolean

isForgotPasswordEnabled · boolean

isPasskeyEnabled · boolean

isSignupEnabled · boolean

locale · string

state · string

​

Méthodes

getAllowedIdentifiers · IdentifierType []

getPasswordPolicy · PasswordPolicy

getUsernamePolicy · UsernamePolicy

untrustedData · UntrustedDataMembers

Propriétés

authorizationParams · { [key: ext-${string} ]: string; login_hint?: string; screen_hint?: string; ui_locales?: string; }

submittedFormData · {[key: string]: string | number | boolean | null | undefined; }

user · UserMembers

Propriétés

appMetadata · {[key: string]: string; }

email · string

enrolledDevices · EnrolledDevice

enrolledEmails · EnrolledEmail

enrolledFactors · string[]

enrolledPhoneNumbers · EnrolledPhoneNumber

id · string

organizations · Organizations

phoneNumber · string

picture · string

userMetadata · {[key: string]: string; }

username · string

Méthodes

federatedLogin · Promise<void>

Afficher Paramètres

payload · FederatedLoginPasswordOptions

Propriétés

connection · string

login · Promise<void>

Afficher Paramètres

payload · LoginPasswordOptions

Propriétés

captcha? · string

password · string

username · string

​

Hooks utilitaires courants

useCurrentScreen · Hooks

useErrors · Hooks

useAuth0Themes · Hooks

UseErrorOptions · Types

UseErrorsResult · Types

ErrorsResult · Types

ErrorKind · Types