Uranus® Design System
Blocos

ResetPasswordForm

Define uma nova senha após verificação por email.

ResetPasswordForm recebe nova senha + confirmação. Faz validação client-side de mismatch (sem submit, com mensagem aria-describedby) e delega o token de reset ao consumidor — geralmente lido da URL.

Definir nova senha

Escolha uma senha forte com ao menos 8 caracteres.

'use client';

import { ResetPasswordForm } from '@uranus-workspace/blocks';
import { Card, CardContent } from '@uranus-workspace/design-system';

export default function ResetPasswordFormDefault() {
  return (
    <div className="flex w-full justify-center">
      <Card className="w-full max-w-md border-border/60 shadow-lg">
        <CardContent className="p-6 sm:p-8">
          <ResetPasswordForm
            title="Definir nova senha"
            description="Escolha uma senha forte com ao menos 8 caracteres."
            onSubmit={() => {}}
          />
        </CardContent>
      </Card>
    </div>
  );
}

Uso

import { ResetPasswordForm } from '@uranus-workspace/blocks';
import { useSearchParams } from 'next/navigation';

const params = useSearchParams();
const token = params.get('token');

<ResetPasswordForm
  onSubmit={async ({ password }) => {
    await resetPasswordAction({ token, password });
  }}
/>

Validação

  • minLength default: 8.
  • Mismatch: bloqueia submit, mostra mensagem inline com aria-describedby no input de confirmação.

Sem força de senha embutida

Diferente de SignUpForm, este bloco não mostra medidor — assume que a política já é conhecida pelo usuário (eles estão redefinindo). Para mostrar, use composição.