Password StrengthPassword Strength

"use client";

import * as React from "react";
import { PasswordStrength } from "@/components/ui/notchset/password-strength";

// 20 characters from a 64-character alphabet: 120 bits, and n & 63 picks each one without bias.
const ALPHABET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
const strongPassword = () => Array.from(crypto.getRandomValues(new Uint8Array(20)), (n) => ALPHABET[n & 63]).join("");

export function NewPassword() {
  const [password, setPassword] = React.useState("");
  // For a strength verdict, pass estimate={(v) => { const r = zxcvbn(v); return { score: r.score, crackTime: r.crackTimesDisplay.offlineSlowHashing1e4PerSecond, warning: r.feedback.warning ?? undefined }; }}
  return <PasswordStrength value={password} onValueChange={setPassword} generate={strongPassword} />;
}