TOTP Enrollment QR Panel (src/totp-enrollment-qr-panel.tsx)

React component and formatting utilities for displaying TOTP enrollment QR codes and manual keys. Reuse in two-factor authentication flows.

// Source: https://github.com/hashgraph-online/hol-guard | License: Apache-2.0 | Copyright You must retain, in the Source form of any Derivative Works
// Provided via justclaw.it.com; keep this notice with the code.
import QRCode from "react-qr-code";

import type { GuardApprovalGateTotpEnrollment } from "./guard-api";

export function buildTotpQrImageOptions(): { bgColor: string; fgColor: string; level: "L" | "M" | "Q" | "H"; size: number } {
  return {
    bgColor: "#ffffff",
    fgColor: "#121a3a",
    level: "M",
    size: 160,
  };
}

export function formatTotpManualKey(value: string | null | undefined): string {
  return (value ?? "").replace(/[\s-]+/g, "").replace(/(.{4})/g, "$1 ").trim();
}

export function formatTotpEnrollmentExpiry(value: string | null | undefined): string {
  if

... (truncated -- full source via MCP)