Formulários
cosmemilton-ui/server

CmPasswordStrength

Medidor de força de senha: quatro segmentos, o rótulo do nível e, se você quiser, o que falta para subir. A cor nunca carrega a informação sozinha — o rótulo em texto anda junto, porque para quem não distingue vermelho de verde quatro barrinhas coloridas não dizem nada.

Import

tsx
import { CmPasswordStrength, cmEstimatePasswordStrength } from "cosmemilton-ui/server";

Medindo o que a pessoa digita

CmInput controlado no cliente e o medidor lendo o valor, com as dicas ligadas.

Esta instalação exige 10 caracteres.

fraca
  • senhas longas valem mais que senhas complicadas
  • evite palavras óbvias

O valor inicial mostra o teto: maiúscula, número e símbolo não salvam uma senha que contém uma palavra óbvia.

O estimador em Server Component

cmEstimatePasswordStrength é pura: o mesmo nível sai no servidor, sem hooks e sem "use client".

Estes níveis foram calculados no servidor, em tempo de render: cmEstimatePasswordStrength é uma função pura, sem hooks e sem estado.

aA1!xnível 1 · fraca
  • use pelo menos 8 caracteres

Quatro classes de caractere em cinco posições: abaixo do mínimo o teto segura no nível 1.

Senha@2026nível 1 · fraca
  • senhas longas valem mais que senhas complicadas
  • evite palavras óbvias

O que se digita quando o formulário pede maiúscula, número e símbolo — e é palavra óbvia.

secretaria2026nível 2 · razoável
  • misture maiúsculas e minúsculas
  • inclua símbolos

Comprimento ajuda, mas só duas classes de caractere.

GestaoEscolar25nível 3 · boa
  • inclua símbolos

Um símbolo a mais levaria a 16 caracteres e à quarta classe: os dois pontos que faltam.

Sombrinha!Frevo#2026nível 4 · forte

Longa e variada, sem repetição nem sequência: nada a corrigir.

API rápida

Props principais de cada peça exportada.

CmPasswordStrength

valuescorelabellevelLabelsminLengthshowHintshintslivemeterLabel

cmEstimatePasswordStrength(password, options)

scorelabelhints

CmPasswordStrengthOptions

minLengthlabels

Notas

A senha é apenas LIDA aqui — nunca guardada, nunca enviada. O medidor mora na página de propósito: mandar a senha para um serviço só para pintar quatro barrinhas seria criar superfície de vazamento a troco de estética.

cmEstimatePasswordStrength é heurística de INTERFACE, não medida de entropia: serve para orientar quem digita e nunca substitui a política de senha de quem valida do outro lado.

A função é pura e determinística e o componente não usa hooks — os dois são server-safe e saem do entry /server, então o mesmo nível pode ser calculado no servidor e na tela.

Tetos duros: senha abaixo de minLength (padrão 8) ou óbvia demais não passa do nível 1, por mais símbolos que tenha. É a diferença entre um medidor honesto e um enfeite verde.

score de 0 a 4 pula o estimador: passe o nível que a sua política calculou e value é ignorado.

Renderiza role="meter" com aria-valuenow de 0 a 4 e aria-valuetext com o rótulo; live (padrão true) anuncia a mudança de nível.

showHints lista o que falta para subir; hints substitui essa lista pela sua.