> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# ResetPasswordMfaWebauthnPlatformChallenge

> Describe todos los hooks y métodos disponibles para personalizar la pantalla `reset-password-mfa-webauthn-platform-challenge` de Universal Login.

La pantalla `reset-password-mfa-webauthn-platform-challenge` se muestra durante el flujo de restablecimiento de contraseña cuando se requiere MFA mediante una clave de acceso de plataforma. Solicita al usuario que se autentique con la clave de acceso almacenada en su dispositivo para continuar el proceso de restablecimiento.

<Frame>
  <img style={{maxHeight:"400px"}} src="https://mintcdn.com/translations/c0RQ9V0YAcT0-8l5/docs/images/cdy7uua7fh8z/7aNLJSP1f1xmQI9RIc7bQh/98db8a7a627e84896b50cf219497c345/Screenshot_2025-05-28_at_12.43.54.png?fit=max&auto=format&n=c0RQ9V0YAcT0-8l5&q=85&s=01218bb888944129130ad534caf20281" alt="ACUL Desafío de plataforma de WebAuthn para MFA de restablecimiento de contraseña" width="363" height="493" data-path="docs/images/cdy7uua7fh8z/7aNLJSP1f1xmQI9RIc7bQh/98db8a7a627e84896b50cf219497c345/Screenshot_2025-05-28_at_12.43.54.png" />
</Frame>

<div id="import">
  ## Importación
</div>

Cada pantalla tiene su propio conjunto de Hooks y métodos. El SDK admite la **importación parcial** y la **importación desde la raíz** para cada pantalla.

* La importación parcial te permite incluir solo el código que necesitas para tu caso de uso específico.
* La importación desde la raíz te permite cargar todas las pantallas desde un único bundle, lo que resulta útil cuando quieres una compilación unificada que gestione todas las pantallas posibles.

```jsx Import Example theme={null}
// importación desde la raíz
import { useResetPasswordMfaWebAuthnPlatformChallenge } from '@auth0/auth0-acul-react';

// importación parcial
import {
  useResetPasswordMfaWebAuthnPlatformChallenge,
  // Hooks de contexto
  useUser,
  useTenant,
  useBranding,
  useClient,
  useOrganization,
  usePrompt,
  useScreen,
  useTransaction,
  useUntrustedData,
  // Hooks comunes
  useCurrentScreen,
  useAuth0Themes,
  useErrors,
  // Hooks de utilidad
  useChangeLanguage,
  // Métodos
  continueWithPasskey,
  reportBrowserError,
  tryAnotherMethod,
} from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';

function ResetPasswordMfaWebAuthnPlatformChallengeScreen() {
  const { continueWithPasskey } = useResetPasswordMfaWebAuthnPlatformChallenge();
  return (
    <button onClick={() => continueWithPasskey()}>
      Authenticate with Passkey
    </button>
  );
}
```

<div id="context-hooks">
  ## Hooks de contexto
</div>

Hooks para la pantalla que proporcionan acceso de solo lectura a los datos de contexto de Auth0 en la pantalla `reset-password-mfa-webauthn-platform-challenge`. Impórtalos desde `@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge`.

<ParamField body="useBranding" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/BrandingMembers">BrandingMembers</a></span>}>
  Este hook proporciona configuraciones de marca, como el logotipo, los colores y los ajustes de tema que se muestran en la pantalla `reset-password-mfa-webauthn-platform-challenge`.

  ```jsx Example theme={null}
  import { useBranding } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function CustomTheme() {
    const branding = useBranding();
  }
  ```
</ParamField>

<ParamField body="useClient" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ClientMembers">ClientMembers</a></span>}>
  Este hook proporciona configuraciones relacionadas con el cliente, como `id`, `name` y `logoUrl`, para la pantalla `reset-password-mfa-webauthn-platform-challenge`.

  ```jsx Example theme={null}
  import { useClient } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function AppInfo() {
    const client = useClient();
  }
  ```
</ParamField>

<ParamField body="useOrganization" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/OrganizationMembers">OrganizationMembers</a></span>}>
  Este hook proporciona información sobre la organización del usuario si el restablecimiento de contraseña está restringido a una organización. Devuelve `null` cuando no hay contexto de organización.

  ```jsx Example theme={null}
  import { useOrganization } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function OrgSelector() {
    const organization = useOrganization();
    if (!organization) {
      return <p>No Organization context</p>;
    }
  }
  ```
</ParamField>

<ParamField body="usePrompt" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/PromptMembers">PromptMembers</a></span>}>
  Este hook contiene datos sobre la pantalla actual del flujo de autenticación.

  ```jsx Example theme={null}
  import { usePrompt } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function FlowInfo() {
    const prompt = usePrompt();
  }
  ```
</ParamField>

<ParamField body="useScreen" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ScreenMembersOnResetPasswordMfaWebAuthnPlatformChallenge">ScreenMembersOnResetPasswordMfaWebAuthnPlatformChallenge</a></span>}>
  Este hook contiene detalles específicos de la pantalla `reset-password-mfa-webauthn-platform-challenge`, incluida su configuración y su contexto.

  ```jsx Example theme={null}
  import { useScreen } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function ScreenDebug() {
    const screen = useScreen();
  }
  ```
</ParamField>

<ParamField body="useTenant" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/TenantMembers">TenantMembers</a></span>}>
  Este hook contiene datos relacionados con el inquilino, como `id` y los metadatos asociados.

  ```jsx Example theme={null}
  import { useTenant } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function TenantInfo() {
    const tenant = useTenant();
  }
  ```
</ParamField>

<ParamField body="useTransaction" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/TransactionMembers">TransactionMembers</a></span>}>
  Este hook proporciona datos específicos de la transacción para la pantalla `reset-password-mfa-webauthn-platform-challenge`, como las conexiones activas y el estado actual del flujo.

  ```jsx Example theme={null}
  import { useTransaction } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function TransactionInfo() {
    const transaction = useTransaction();
  }
  ```
</ParamField>

<ParamField body="useUntrustedData" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UntrustedDataMembers">UntrustedDataMembers</a></span>}>
  Este hook procesa los datos no confiables que recibe la pantalla, como un correo electrónico o un nombre de usuario precargados a partir de parámetros de la URL.

  ```jsx Example theme={null}
  import { useUntrustedData } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function PrefilledForm() {
    const untrustedData = useUntrustedData();
  }
  ```
</ParamField>

<ParamField body="useUser" type={<span>() =&gt; <a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/UserMembers">UserMembers</a></span>}>
  Este hook proporciona detalles sobre el usuario activo, incluidos `username`, `email` y los métodos de autenticación disponibles.

  ```jsx Example theme={null}
  import { useUser } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';
  function UserProfile() {
    const user = useUser();
  }
  ```
</ParamField>

<ParamField body="useResetPasswordMfaWebAuthnPlatformChallenge" type={<a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ResetPasswordMfaWebAuthnPlatformChallengeMembers">ResetPasswordMfaWebAuthnPlatformChallengeMembers</a>}>
  Este hook devuelve todos los métodos y el contexto disponibles para la pantalla `reset-password-mfa-webauthn-platform-challenge`.
</ParamField>

<div id="methods">
  ## Métodos
</div>

<ParamField body="continueWithPasskey" type="Promise<void>">
  Este método inicia el desafío de clave de acceso de la plataforma para continuar el paso de MFA en el flujo de restablecimiento de contraseña.

  ```jsx Example theme={null}
  import { useResetPasswordMfaWebAuthnPlatformChallenge } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';

  function ContinueWithPasskeyButton() {
    const { continueWithPasskey } = useResetPasswordMfaWebAuthnPlatformChallenge();
    return (
      <button onClick={() => continueWithPasskey()}>
        Autenticarse con clave de acceso
      </button>
    );
  }
  ```

  **Parámetros del método**

  <Expandable title="Parámetros">
    <ParamField body="options">
      [ResetPasswordMfaWebAuthnPlatformChallengeContinueOptions](/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ResetPasswordMfaWebAuthnPlatformChallengeContinueOptions).
    </ParamField>

    <ParamField body="rememberDevice?" type="boolean">
      Si es `true` y `screen.showRememberDevice` también es `true`, omite MFA en inicios de sesión posteriores desde el navegador actual.
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="reportBrowserError" type="Promise<void>">
  Este método notifica a Auth0 un error del navegador relacionado con WebAuthn cuando el desafío de clave de acceso falla en el dispositivo del usuario.

  ```jsx Example theme={null}
  import { useResetPasswordMfaWebAuthnPlatformChallenge } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';

  function HandlePasskeyError() {
    const { reportBrowserError } = useResetPasswordMfaWebAuthnPlatformChallenge();
    return (
      <button onClick={() => reportBrowserError({ error: { name: 'NotAllowedError', message: 'User cancelled' } })}>
        Informar error
      </button>
    );
  }
  ```

  **Parámetros del método**

  <Expandable title="Parámetros">
    <ParamField body="options">
      [ResetPasswordMfaWebAuthnPlatformChallengeReportErrorOptions](/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/ResetPasswordMfaWebAuthnPlatformChallengeReportErrorOptions).
    </ParamField>

    <ParamField body="error" type={<span><a href="/es/docs/libraries/acul/react-sdk/API-Reference/Types/interfaces/WebAuthnErrorDetails">WebAuthnErrorDetails</a></span>} required>
      El objeto de error de la API de WebAuthn (`navigator.credentials.get()`) que se debe notificar.

      <ParamField body="name" type="string" required>
        El nombre del error (por ejemplo, `'NotAllowedError'`).
      </ParamField>

      <ParamField body="message" type="string" required>
        El mensaje de error que describe el problema.
      </ParamField>
    </ParamField>
  </Expandable>
</ParamField>

<ParamField body="tryAnotherMethod" type="Promise<void>">
  Este método redirige al usuario para que seleccione otro método de MFA.

  ```jsx Example theme={null}
  import { useResetPasswordMfaWebAuthnPlatformChallenge } from '@auth0/auth0-acul-react/reset-password-mfa-webauthn-platform-challenge';

  function TryAnotherMethodButton() {
    const { tryAnotherMethod } = useResetPasswordMfaWebAuthnPlatformChallenge();
    return (
      <button onClick={() => tryAnotherMethod()}>
        Probar otro método
      </button>
    );
  }
  ```
</ParamField>

<div id="commonutility-hooks">
  ## Hooks comunes y de utilidad
</div>

<ParamField body={<a href="/es/docs/libraries/acul/react-sdk/API-Reference/Hooks/useAuth0Themes">useAuth0Themes</a>} type="Hooks">
  Este hook obtiene las opciones del tema actual con la configuración consolidada del contexto de marca.
</ParamField>

<ParamField body={<a href="/es/docs/libraries/acul/react-sdk/API-Reference/Hooks/useChangeLanguage">useChangeLanguage</a>} type="Hooks">
  Este hook devuelve una función para cambiar el idioma que se muestra en la pantalla actual de ACUL.
</ParamField>

<ParamField body={<a href="/es/docs/libraries/acul/react-sdk/API-Reference/Hooks/useCurrentScreen">useCurrentScreen</a>} type="Hooks">
  Este hook obtiene el contexto y el estado de la pantalla actual.
</ParamField>

<ParamField body={<a href="/es/docs/libraries/acul/react-sdk/API-Reference/Hooks/useErrors">useErrors</a>} type="Hooks">
  Este hook lee y administra los errores del servidor, del cliente y del desarrollador que se muestran en la pantalla.
</ParamField>