@orangecheck/auth-client 2.25.3 → 2.26.0

package/dist/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var React3 = require('react');
+var React4 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var browser = require('@simplewebauthn/browser');
 
@@ -22,7 +22,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React3__namespace = /*#__PURE__*/_interopNamespace(React3);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 
 // src/provider.tsx
 
@@ -221,7 +221,7 @@ async function consumeTabAccountHint(authOrigin) {
   }
   return null;
 }
-var SessionContext = React3__namespace.createContext(null);
+var SessionContext = React4__namespace.createContext(null);
 function normalizeDisplayIdentity(raw, didOc) {
   const di = raw.display_identity ?? raw.displayIdentity;
   if (di && typeof di === "object" && typeof di.value === "string" && di.value.length > 0 && typeof di.kind === "string" && DISPLAY_IDENTITY_KINDS.includes(di.kind)) {
@@ -279,14 +279,14 @@ function OcSessionProvider({
   config,
   defaultReturnTo
 }) {
-  const cfg = React3__namespace.useMemo(() => resolveConfig(config), [config]);
-  const [account, setAccount] = React3__namespace.useState(null);
-  const [roster, setRoster] = React3__namespace.useState([]);
-  const [status, setStatus] = React3__namespace.useState("loading");
-  const [error, setError] = React3__namespace.useState(null);
-  const [tabPinned, setTabPinned] = React3__namespace.useState(false);
-  const pinInFlightRef = React3__namespace.useRef(false);
-  const pinThisTab = React3__namespace.useCallback(
+  const cfg = React4__namespace.useMemo(() => resolveConfig(config), [config]);
+  const [account, setAccount] = React4__namespace.useState(null);
+  const [roster, setRoster] = React4__namespace.useState([]);
+  const [status, setStatus] = React4__namespace.useState("loading");
+  const [error, setError] = React4__namespace.useState(null);
+  const [tabPinned, setTabPinned] = React4__namespace.useState(false);
+  const pinInFlightRef = React4__namespace.useRef(false);
+  const pinThisTab = React4__namespace.useCallback(
     async (didOc) => {
       if (pinInFlightRef.current || readTabSession()) return;
       pinInFlightRef.current = true;
@@ -309,7 +309,7 @@ function OcSessionProvider({
     },
     [cfg.authOrigin]
   );
-  const refresh = React3__namespace.useCallback(async () => {
+  const refresh = React4__namespace.useCallback(async () => {
     if (typeof window === "undefined") return;
     try {
       let pin = readTabSession();
@@ -363,7 +363,7 @@ function OcSessionProvider({
       setError(err instanceof Error ? err : new Error(String(err)));
     }
   }, [cfg, pinThisTab]);
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     let cancelled = false;
     consumeTabAdoptMarker();
     void (async () => {
@@ -374,9 +374,9 @@ function OcSessionProvider({
       cancelled = true;
     };
   }, [refresh, cfg.authOrigin]);
-  React3__namespace.useEffect(() => installTabFetchInterceptor(cfg.authOrigin), [cfg.authOrigin]);
-  React3__namespace.useEffect(() => installTabLinkDecorator(cfg.authOrigin), [cfg.authOrigin]);
-  const signOut = React3__namespace.useCallback(
+  React4__namespace.useEffect(() => installTabFetchInterceptor(cfg.authOrigin), [cfg.authOrigin]);
+  React4__namespace.useEffect(() => installTabLinkDecorator(cfg.authOrigin), [cfg.authOrigin]);
+  const signOut = React4__namespace.useCallback(
     async (opts) => {
       const scope = opts?.scope ?? "all";
       try {
@@ -412,7 +412,7 @@ function OcSessionProvider({
     },
     [cfg.authOrigin, cfg.logoutPath, refresh]
   );
-  const switchAccount = React3__namespace.useCallback(
+  const switchAccount = React4__namespace.useCallback(
     async (didOc) => {
       if (typeof window === "undefined") return;
       const res = await fetch(`${cfg.authOrigin}/api/auth/switch`, {
@@ -442,14 +442,14 @@ function OcSessionProvider({
     },
     [cfg.authOrigin, refresh]
   );
-  const addAccountUrl = React3__namespace.useCallback(
+  const addAccountUrl = React4__namespace.useCallback(
     (returnTo) => {
       const rt = returnTo ?? (typeof window !== "undefined" ? window.location.href : void 0);
       return buildAddAccountUrl(cfg, rt);
     },
     [cfg]
   );
-  const setDisplayIdentity = React3__namespace.useCallback(
+  const setDisplayIdentity = React4__namespace.useCallback(
     async (kind) => {
       if (typeof window === "undefined") return;
       const res = await fetch(`${cfg.authOrigin}/api/auth/account`, {
@@ -479,7 +479,7 @@ function OcSessionProvider({
     },
     [cfg.authOrigin, refresh]
   );
-  const value = React3__namespace.useMemo(() => {
+  const value = React4__namespace.useMemo(() => {
     const returnTo = defaultReturnTo ?? (typeof window !== "undefined" ? window.location.href : void 0);
     return {
       status,
@@ -511,7 +511,7 @@ function OcSessionProvider({
   return /* @__PURE__ */ jsxRuntime.jsx(SessionContext.Provider, { value, children });
 }
 function useOcSession() {
-  const ctx = React3__namespace.useContext(SessionContext);
+  const ctx = React4__namespace.useContext(SessionContext);
   if (!ctx) {
     throw new Error(
       "[@orangecheck/auth-client] useOcSession() must be called inside <OcSessionProvider>"
@@ -520,7 +520,7 @@ function useOcSession() {
   return ctx;
 }
 function useOptionalOcSession() {
-  return React3__namespace.useContext(SessionContext);
+  return React4__namespace.useContext(SessionContext);
 }
 function shortenAddress(addr) {
   if (addr.length <= 12) return addr;
@@ -535,7 +535,7 @@ function isPrefixOf(value, target) {
 }
 var listboxIdCounter = 0;
 function useUniqueId(prefix) {
-  const [id] = React3__namespace.useState(() => `${prefix}-${++listboxIdCounter}`);
+  const [id] = React4__namespace.useState(() => `${prefix}-${++listboxIdCounter}`);
   return id;
 }
 function OcAccountChip({
@@ -549,9 +549,9 @@ function OcAccountChip({
 }) {
   const { status, account, signInUrl: sessionSignInUrl, signOut } = useOcSession();
   const signInUrl = signInUrlOverride ?? sessionSignInUrl;
-  const [open, setOpen] = React3__namespace.useState(false);
-  const wrapRef = React3__namespace.useRef(null);
-  React3__namespace.useEffect(() => {
+  const [open, setOpen] = React4__namespace.useState(false);
+  const wrapRef = React4__namespace.useRef(null);
+  React4__namespace.useEffect(() => {
     if (!open) return;
     function handleClickOutside(e) {
       if (wrapRef.current && !wrapRef.current.contains(e.target)) {
@@ -874,9 +874,9 @@ function useOcAddressSuggestion(options) {
   } = options;
   const { status, account } = useOcSession();
   const sessionAddress = status === "authenticated" ? account?.primaryBtc ?? null : null;
-  const [open, setOpen] = React3__namespace.useState(false);
-  const [highlighted, setHighlighted] = React3__namespace.useState(false);
-  const blurTimer = React3__namespace.useRef(null);
+  const [open, setOpen] = React4__namespace.useState(false);
+  const [highlighted, setHighlighted] = React4__namespace.useState(false);
+  const blurTimer = React4__namespace.useRef(null);
   const listboxId = useUniqueId("oc-addr-listbox");
   const optionId = `${listboxId}-opt`;
   const valueMatchesSession = sessionAddress != null && value.toLowerCase() === sessionAddress.toLowerCase();
@@ -888,7 +888,7 @@ function useOcAddressSuggestion(options) {
     setOpen(false);
     setHighlighted(false);
   }
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     return () => {
       if (blurTimer.current != null) window.clearTimeout(blurTimer.current);
     };
@@ -991,7 +991,7 @@ function useOcAddressSuggestion(options) {
   ) : null;
   return { inputProps, popover };
 }
-var OcAddressInput = React3__namespace.forwardRef(
+var OcAddressInput = React4__namespace.forwardRef(
   function OcAddressInput2({
     value,
     onValueChange,
@@ -1006,15 +1006,15 @@ var OcAddressInput = React3__namespace.forwardRef(
   }, forwardedRef) {
     const { status, account } = useOcSession();
     const sessionAddress = status === "authenticated" ? account?.primaryBtc ?? null : null;
-    const [open, setOpen] = React3__namespace.useState(false);
-    const [highlighted, setHighlighted] = React3__namespace.useState(false);
-    const innerRef = React3__namespace.useRef(null);
+    const [open, setOpen] = React4__namespace.useState(false);
+    const [highlighted, setHighlighted] = React4__namespace.useState(false);
+    const innerRef = React4__namespace.useRef(null);
     const setRef = (node) => {
       innerRef.current = node;
       if (typeof forwardedRef === "function") forwardedRef(node);
       else if (forwardedRef) forwardedRef.current = node;
     };
-    const blurTimer = React3__namespace.useRef(null);
+    const blurTimer = React4__namespace.useRef(null);
     const listboxId = useUniqueId("oc-addr-listbox");
     const optionId = `${listboxId}-opt`;
     const valueMatchesSession = sessionAddress != null && value.toLowerCase() === sessionAddress.toLowerCase();
@@ -1061,7 +1061,7 @@ var OcAddressInput = React3__namespace.forwardRef(
       }
       onKeyDown?.(e);
     }
-    React3__namespace.useEffect(() => {
+    React4__namespace.useEffect(() => {
       return () => {
         if (blurTimer.current != null) window.clearTimeout(blurTimer.current);
       };
@@ -1195,13 +1195,14 @@ async function fetchOcLinkedIdentities(opts) {
 function OcLinkedIdentities({
   authOrigin = DEFAULT_AUTH_ORIGIN,
   className,
-  onChange
+  onChange,
+  attestationLink = true
 }) {
-  const [resp, setResp] = React3__namespace.useState(null);
-  const [error, setError] = React3__namespace.useState(null);
-  const [showEmailLink, setShowEmailLink] = React3__namespace.useState(false);
-  const [showBtcLink, setShowBtcLink] = React3__namespace.useState(false);
-  const refresh = React3__namespace.useCallback(async () => {
+  const [resp, setResp] = React4__namespace.useState(null);
+  const [error, setError] = React4__namespace.useState(null);
+  const [showEmailLink, setShowEmailLink] = React4__namespace.useState(false);
+  const [showBtcLink, setShowBtcLink] = React4__namespace.useState(false);
+  const refresh = React4__namespace.useCallback(async () => {
     setError(null);
     try {
       const r = await fetch(`${authOrigin}/api/auth/identities`, {
@@ -1220,10 +1221,10 @@ function OcLinkedIdentities({
       setError(e instanceof Error ? e.message : "load failed");
     }
   }, [authOrigin]);
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     void refresh();
   }, [refresh]);
-  const afterChange = React3__namespace.useCallback(() => {
+  const afterChange = React4__namespace.useCallback(() => {
     setShowEmailLink(false);
     setShowBtcLink(false);
     void refresh();
@@ -1255,11 +1256,7 @@ function OcLinkedIdentities({
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, "data-oc-li": "", style: { display: "grid", gap: 16 }, children: [
     /* @__PURE__ */ jsxRuntime.jsxs("div", { style: panelStyle(), children: [
       /* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: "\xA7 what this is" }),
-      /* @__PURE__ */ jsxRuntime.jsxs("p", { style: bodyStyle, children: [
-        "Your public identity is the opaque ",
-        /* @__PURE__ */ jsxRuntime.jsx("code", { style: codeStyle, children: "did:oc:" }),
-        " DID. Below it sit your private linked identities \u2014 your email and your Bitcoin address. They never appear in dashboard chrome and never reach an integrator unless you grant the matching scope. Linking a second identity is also your account-recovery path: if you lose one, the other still signs you in."
-      ] })
+      /* @__PURE__ */ jsxRuntime.jsx("p", { style: bodyStyle, children: "These are the ways you can sign in to this account. An app you sign in to sees one only if you grant it. Linking a second one is also your way back in: lose one, and the other still signs you in." })
     ] }),
     mergedFrom.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(ConsolidationPanel, { entries: mergedFrom }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { style: panelStyle("plain"), "data-oc-li-rows": "", children: [
@@ -1312,7 +1309,7 @@ function OcLinkedIdentities({
         onCancel: () => setShowBtcLink(false)
       }
     ),
-    hasBtc && /* @__PURE__ */ jsxRuntime.jsx(AttestationLink, {})
+    hasBtc && attestationLink && /* @__PURE__ */ jsxRuntime.jsx(AttestationLink, {})
   ] });
 }
 function IdentityGroup({
@@ -1356,10 +1353,10 @@ function IdentityRow({
   authOrigin,
   onChange
 }) {
-  const [shown, setShown] = React3__namespace.useState(false);
-  const [confirming, setConfirming] = React3__namespace.useState(false);
-  const [busy, setBusy] = React3__namespace.useState(false);
-  const [err, setErr] = React3__namespace.useState(null);
+  const [shown, setShown] = React4__namespace.useState(false);
+  const [confirming, setConfirming] = React4__namespace.useState(false);
+  const [busy, setBusy] = React4__namespace.useState(false);
+  const [err, setErr] = React4__namespace.useState(null);
   const masked = row.value ? mask(row.value, kind) : "\u2014 pending recovery \u2014";
   const display = shown && row.value ? row.value : masked;
   async function unlink() {
@@ -1558,13 +1555,13 @@ function EmailLinkForm({
   onDone,
   onCancel
 }) {
-  const [step, setStep] = React3__namespace.useState("email");
-  const [email, setEmail] = React3__namespace.useState("");
-  const [code, setCode] = React3__namespace.useState("");
-  const [token, setToken] = React3__namespace.useState("");
-  const [busy, setBusy] = React3__namespace.useState(false);
-  const [err, setErr] = React3__namespace.useState(null);
-  const [transfer, setTransfer] = React3__namespace.useState(false);
+  const [step, setStep] = React4__namespace.useState("email");
+  const [email, setEmail] = React4__namespace.useState("");
+  const [code, setCode] = React4__namespace.useState("");
+  const [token, setToken] = React4__namespace.useState("");
+  const [busy, setBusy] = React4__namespace.useState(false);
+  const [err, setErr] = React4__namespace.useState(null);
+  const [transfer, setTransfer] = React4__namespace.useState(false);
   async function start() {
     setBusy(true);
     setErr(null);
@@ -1707,12 +1704,12 @@ function BtcLinkForm({
   onDone,
   onCancel
 }) {
-  const [step, setStep] = React3__namespace.useState("request");
-  const [addr, setAddr] = React3__namespace.useState("");
-  const [challenge, setChallenge] = React3__namespace.useState("");
-  const [busy, setBusy] = React3__namespace.useState(false);
-  const [err, setErr] = React3__namespace.useState(null);
-  const [pendingSig, setPendingSig] = React3__namespace.useState(null);
+  const [step, setStep] = React4__namespace.useState("request");
+  const [addr, setAddr] = React4__namespace.useState("");
+  const [challenge, setChallenge] = React4__namespace.useState("");
+  const [busy, setBusy] = React4__namespace.useState(false);
+  const [err, setErr] = React4__namespace.useState(null);
+  const [pendingSig, setPendingSig] = React4__namespace.useState(null);
   async function getChallenge() {
     if (!didOc) {
       setErr("session not loaded yet \xB7 refresh and retry");
@@ -1872,9 +1869,9 @@ function TransferConfirm({
   ] });
 }
 function LazyWalletButton(props) {
-  const [Comp, setComp] = React3__namespace.useState(null);
-  const [failed, setFailed] = React3__namespace.useState(false);
-  React3__namespace.useEffect(() => {
+  const [Comp, setComp] = React4__namespace.useState(null);
+  const [failed, setFailed] = React4__namespace.useState(false);
+  React4__namespace.useEffect(() => {
     let alive = true;
     import('@orangecheck/wallet-adapter/react').then((m) => {
       if (alive) {
@@ -1982,10 +1979,6 @@ var hintStyle = {
   fontSize: 10.5,
   opacity: 0.8
 };
-var codeStyle = {
-  fontFamily: MONO,
-  color: V.foreground
-};
 var rowStyle = {
   display: "flex",
   flexWrap: "wrap",
@@ -2092,6 +2085,50 @@ function hardNavigate(target) {
   if (typeof window === "undefined") return;
   window.location.assign(target);
 }
+var SIGNIN_ERRORS = {
+  bad_request: "That doesn't look like a Bitcoin address.",
+  invalid_challenge: "That signature doesn't match this address. Sign with the wallet that holds it.",
+  sig_invalid: "That signature doesn't match this address. Sign with the wallet that holds it.",
+  sig_unsupported_scheme: "We can't check this wallet's signature format yet. Try another wallet, or use email.",
+  expired: "That request timed out. Try again for a fresh one.",
+  not_yet_valid: "That request is not valid yet. Check your device clock, then try again.",
+  nonce_mismatch: "That request didn't match. Try again for a fresh one.",
+  audience_mismatch: "That request didn't match this site. Reload the page and try again.",
+  purpose_mismatch: "That request didn't match. Try again for a fresh one.",
+  malformed: "That signature couldn't be read. Copy it again, whole.",
+  cross_site_blocked: "Your browser blocked this request. Reload the page and try again.",
+  rate_limited: "Too many tries. Wait a minute, then try again.",
+  invalid_email: "That email address doesn't look right.",
+  mailer_unavailable: "We couldn't send the email right now. Try again in a minute.",
+  mailer_error: "We couldn't send the email right now. Try again in a minute.",
+  wrong_code: "That code isn't right. Check the newest email from us.",
+  replay: "That code was already used. Send a new one.",
+  invalid_token: "That code is no longer valid. Send a new one.",
+  email_mismatch: "That code was sent to a different address. Send a new one."
+};
+var EMAIL_ERRORS = {
+  expired: "That code expired. Send a new one."
+};
+var SUBMIT_ERRORS = {
+  bad_request: "That signature couldn't be read. Copy it again, whole."
+};
+var NETWORK_ERROR = "We couldn't reach the server. Check your connection and try again.";
+function humanSigninError(reason, path, step = "challenge") {
+  if (!/^[a-z0-9_]+$/.test(reason)) return reason;
+  if (path === "wallet" && step === "submit" && SUBMIT_ERRORS[reason]) return SUBMIT_ERRORS[reason];
+  if (path === "email" && EMAIL_ERRORS[reason]) return EMAIL_ERRORS[reason];
+  return SIGNIN_ERRORS[reason] ?? (path === "email" ? "That didn't work. Try again, or send a new code." : "That didn't work. Try again.");
+}
+function failureMessage(err, path, step) {
+  if (err instanceof TypeError || err instanceof SyntaxError) return NETWORK_ERROR;
+  return humanSigninError(err instanceof Error ? err.message : "failed", path, step);
+}
+var BECH32_ADDRESS = /^(bc1|tb1|bcrt1)[qpzry9x8gf2tvdw0s3jn54khce6mua7l]{8,87}$/i;
+var BASE58_ADDRESS = /^[123mn][1-9A-HJ-NP-Za-km-z]{25,34}$/;
+function looksLikeBitcoinAddress(input) {
+  const s = input.trim();
+  return BECH32_ADDRESS.test(s) || BASE58_ADDRESS.test(s);
+}
 function OcSignIn({
   audience,
   returnTo,
@@ -2107,10 +2144,10 @@ function OcSignIn({
 }) {
   const walletEnabled = paths?.wallet ?? true;
   const emailEnabled = paths?.email ?? true;
-  const [resolvedReturn, setResolvedReturn] = React3__namespace.useState(
+  const [resolvedReturn, setResolvedReturn] = React4__namespace.useState(
     () => familyReturnTarget(returnTo) ?? safeReturnTo(returnTo)
   );
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     const fromProp = familyReturnTarget(returnTo);
     if (fromProp) {
       setResolvedReturn(fromProp);
@@ -2121,8 +2158,8 @@ function OcSignIn({
     const fromQuery = familyReturnTarget(q.get("return_to")) ?? familyReturnTarget(q.get("next"));
     setResolvedReturn(fromQuery ?? "/");
   }, [returnTo]);
-  const [addMode, setAddMode] = React3__namespace.useState(Boolean(addProp));
-  React3__namespace.useEffect(() => {
+  const [addMode, setAddMode] = React4__namespace.useState(Boolean(addProp));
+  React4__namespace.useEffect(() => {
     if (typeof window === "undefined") return;
     if (addProp !== void 0) {
       setAddMode(Boolean(addProp));
@@ -2130,19 +2167,19 @@ function OcSignIn({
     }
     setAddMode(new URLSearchParams(window.location.search).get("add") === "1");
   }, [addProp]);
-  const [path, setPath] = React3__namespace.useState(
+  const [path, setPath] = React4__namespace.useState(
     initialPath ?? (providersFirst ? "email" : "wallet")
   );
-  const [signedIn, setSignedIn] = React3__namespace.useState(null);
-  const [linkAlso, setLinkAlso] = React3__namespace.useState(false);
-  const [oauthError, setOauthError] = React3__namespace.useState(false);
-  React3__namespace.useEffect(() => {
+  const [signedIn, setSignedIn] = React4__namespace.useState(null);
+  const [linkAlso, setLinkAlso] = React4__namespace.useState(false);
+  const [oauthError, setOauthError] = React4__namespace.useState(false);
+  React4__namespace.useEffect(() => {
     if (typeof window === "undefined") return;
     if (new URLSearchParams(window.location.search).has("oauth_error")) {
       setOauthError(true);
     }
   }, []);
-  const navigate = React3__namespace.useCallback(
+  const navigate = React4__namespace.useCallback(
     async (account) => {
       if (resolveReturnTo) {
         try {
@@ -2156,7 +2193,7 @@ function OcSignIn({
     },
     [resolveReturnTo, resolvedReturn]
   );
-  const handleSuccess = React3__namespace.useCallback(
+  const handleSuccess = React4__namespace.useCallback(
     async (account, token, via) => {
       const proceed = () => {
         clearTabSession();
@@ -2242,7 +2279,7 @@ function OcSignIn({
           fontFamily: "ui-monospace, SFMono-Regular, monospace",
           fontSize: 11
         },
-        children: "That sign-in didn't complete. Please try again."
+        children: "That sign-in didn't finish. Try again, or use another way below."
       }
     ),
     addMode && /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2307,7 +2344,7 @@ function OcSignIn({
             {
               active: path === "email",
               onClick: () => setPath("email"),
-              children: "email + otp"
+              children: "email"
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -2315,7 +2352,7 @@ function OcSignIn({
             {
               active: path === "wallet",
               onClick: () => setPath("wallet"),
-              children: "bitcoin \xB7 self-custody"
+              children: "bitcoin wallet"
             }
           )
         ] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
@@ -2332,7 +2369,7 @@ function OcSignIn({
             {
               active: path === "email",
               onClick: () => setPath("email"),
-              children: "email + otp"
+              children: "email"
             }
           )
         ] })
@@ -2365,7 +2402,7 @@ function OcSignIn({
           type: "checkbox",
           checked: linkAlso,
           onChange: (e) => setLinkAlso(e.target.checked),
-          style: { marginTop: 2, accentColor: "var(--primary, #f97316)" }
+          style: { margin: 0, accentColor: "var(--primary, #f97316)" }
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
@@ -2373,7 +2410,7 @@ function OcSignIn({
         " ",
         activeMethod === "email" ? "a Bitcoin wallet" : "an email",
         " ",
-        /* @__PURE__ */ jsxRuntime.jsx("span", { style: { opacity: 0.65 }, children: "\u2014 optional, one more signature." })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { children: "\u2014 optional, one more signature." })
       ] })
     ] })
   ] });
@@ -2392,6 +2429,7 @@ function SigninTab({
       onClick,
       "data-oc-signin-tab": active ? "active" : "inactive",
       style: {
+        minHeight: 44,
         padding: "0.6rem 0.875rem",
         background: "transparent",
         border: "none",
@@ -2431,20 +2469,21 @@ function ProviderSignIn({
   add,
   first = false
 }) {
-  const [providers, setProviders] = React3__namespace.useState([]);
-  const [origin, setOrigin] = React3__namespace.useState("");
-  React3__namespace.useEffect(() => {
+  const [providers, setProviders] = React4__namespace.useState(null);
+  const [origin, setOrigin] = React4__namespace.useState("");
+  React4__namespace.useEffect(() => {
     setOrigin(window.location.origin);
     let cancelled = false;
     fetch(`${authOrigin}/api/auth/providers`, { credentials: "include" }).then((r) => r.ok ? r.json() : null).then((body) => {
-      if (!cancelled && body?.providers) setProviders(body.providers);
+      if (!cancelled) setProviders(body?.providers ?? []);
     }).catch(() => {
+      if (!cancelled) setProviders([]);
     });
     return () => {
       cancelled = true;
     };
   }, [authOrigin]);
-  if (providers.length === 0) return null;
+  if (providers !== null && providers.length === 0) return null;
   const providerReturnTo = returnTo.startsWith("/") ? origin ? `${origin}${returnTo}` : returnTo : returnTo;
   const line = { flex: 1, height: 1, background: "var(--border, #27272a)" };
   const BLOCK_GAP = 16;
@@ -2473,6 +2512,31 @@ function ProviderSignIn({
       ]
     }
   );
+  const buttonStyle = (i) => ({
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: 10,
+    boxSizing: "border-box",
+    width: "100%",
+    minHeight: 44,
+    marginTop: i === 0 ? 0 : BUTTON_GAP,
+    padding: "0.6rem 0.875rem",
+    border: "1px solid var(--border, #27272a)",
+    borderRadius: 6,
+    background: "transparent",
+    color: "var(--muted-foreground, #a1a1aa)",
+    fontFamily: "ui-monospace, SFMono-Regular, monospace",
+    fontSize: 12,
+    textDecoration: "none"
+  });
+  if (providers === null) {
+    if (!first) return null;
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-oc-signin-providers": "", "aria-hidden": "true", children: [
+      [0, 1].map((i) => /* @__PURE__ */ jsxRuntime.jsx("div", { style: { ...buttonStyle(i), visibility: "hidden" }, children: "\xA0" }, i)),
+      divider
+    ] });
+  }
   const buttons = providers.map((p, i) => /* @__PURE__ */ jsxRuntime.jsxs(
     "a",
     {
@@ -2480,23 +2544,7 @@ function ProviderSignIn({
         providerReturnTo
       )}${add ? "&add=1" : ""}`,
       "data-oc-signin-provider": p.id,
-      style: {
-        display: "flex",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 10,
-        boxSizing: "border-box",
-        width: "100%",
-        marginTop: i === 0 ? 0 : BUTTON_GAP,
-        padding: "0.6rem 0.875rem",
-        border: "1px solid var(--border, #27272a)",
-        borderRadius: 6,
-        background: "transparent",
-        color: "var(--muted-foreground, #a1a1aa)",
-        fontFamily: "ui-monospace, SFMono-Regular, monospace",
-        fontSize: 12,
-        textDecoration: "none"
-      },
+      style: buttonStyle(i),
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(ProviderIcon, { id: p.id }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { children: p.label })
@@ -2519,82 +2567,214 @@ function ProviderSignIn({
     }
   );
 }
+async function loadAdapter() {
+  return await import('@orangecheck/wallet-adapter');
+}
+async function detectBrowserWallets() {
+  return (await loadAdapter()).detectWallets().filter((w) => w.detected && w.id !== "manual").map((w) => ({ id: w.id, name: w.name }));
+}
 function WalletFlow({ authOrigin, audience, add, onSuccess }) {
-  const [address, setAddress] = React3__namespace.useState("");
-  const [error, setError] = React3__namespace.useState(null);
-  const [submitting, setSubmitting] = React3__namespace.useState(false);
-  const [stage, setStage] = React3__namespace.useState("enter");
+  const uid = React4__namespace.useId();
+  const ids = {
+    address: `${uid}-address`,
+    wallet: `${uid}-wallet`,
+    message: `${uid}-message`,
+    signature: `${uid}-signature`
+  };
+  const [address, setAddress] = React4__namespace.useState("");
+  const [error, setError] = React4__namespace.useState(null);
+  const [submitting, setSubmitting] = React4__namespace.useState(false);
+  const [wallets, setWallets] = React4__namespace.useState(null);
+  const [walletId, setWalletId] = React4__namespace.useState(null);
+  const [manual, setManual] = React4__namespace.useState(null);
+  const [pasted, setPasted] = React4__namespace.useState("");
+  const [copied, setCopied] = React4__namespace.useState("idle");
+  React4__namespace.useEffect(() => {
+    let cancelled = false;
+    detectBrowserWallets().then((found) => {
+      if (cancelled) return;
+      setWallets(found);
+      setWalletId(found[0]?.id ?? null);
+    }).catch(() => {
+      if (!cancelled) setWallets([]);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+  async function fetchChallenge(addr) {
+    const res = await fetch(
+      `${authOrigin}/api/challenge?addr=${encodeURIComponent(addr)}&audience=${encodeURIComponent(audience)}&purpose=login`
+    );
+    const json = await res.json();
+    if (!res.ok || !json.message || !json.nonce) {
+      throw new Error(json.error ?? "challenge_failed");
+    }
+    return { message: json.message, nonce: json.nonce };
+  }
+  async function submitSignature(message, nonce, signature, scheme) {
+    const res = await fetch(`${authOrigin}/api/auth/signin`, {
+      method: "POST",
+      credentials: "include",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        message,
+        signature,
+        ...scheme ? { scheme } : {},
+        expectedNonce: nonce,
+        expectedAudience: audience,
+        expectedPurpose: "login",
+        // Multi-account add-mode · the auth host preserves the current
+        // roster_id when set, instead of minting a fresh one.
+        ...add ? { add: true } : {}
+      })
+    });
+    const json = await res.json();
+    if (!res.ok || !("ok" in json) || !json.ok || !json.account) {
+      throw new Error(
+        "reason" in json && json.reason || "error" in json && json.error || "verify_failed"
+      );
+    }
+    onSuccess(json.account, json.token);
+  }
   async function signIn(e) {
     e.preventDefault();
     const addr = address.trim();
     if (!addr) {
-      setError("paste a Bitcoin address");
+      setError("Paste your Bitcoin address.");
+      return;
+    }
+    if (!looksLikeBitcoinAddress(addr)) {
+      setError(humanSigninError("bad_request", "wallet"));
       return;
     }
     setError(null);
     setSubmitting(true);
-    setStage("signing");
+    let step = "challenge";
     try {
-      const challengeRes = await fetch(
-        `${authOrigin}/api/challenge?addr=${encodeURIComponent(addr)}&audience=${encodeURIComponent(audience)}&purpose=login`
-      );
-      const challenge = await challengeRes.json();
-      if (!challengeRes.ok || !challenge.message || !challenge.nonce) {
-        throw new Error(challenge.error ?? "challenge_failed");
+      let id = walletId;
+      if (wallets === null) {
+        const found = await detectBrowserWallets().catch(() => []);
+        setWallets(found);
+        id = found[0]?.id ?? null;
+        setWalletId(id);
       }
-      let adapter;
-      try {
-        adapter = await import('@orangecheck/wallet-adapter');
-      } catch {
-        throw new Error(
-          "could not load wallet support \xB7 refresh to try again"
-        );
-      }
-      const wallets = adapter.detectWallets().filter((w) => w.detected && w.id !== "manual");
-      if (wallets.length === 0) {
-        throw new Error("no BIP-322 wallet extension detected \xB7 install one and refresh");
+      const challenge = await fetchChallenge(addr);
+      if (!id) {
+        setManual(challenge);
+        setSubmitting(false);
+        return;
       }
-      const wallet = wallets[0];
-      const signer = adapter.getSigner(wallet.id, { address: addr });
+      const signer = (await loadAdapter()).getSigner(id, { address: addr });
       const signature = await signer(challenge.message);
-      const res = await fetch(`${authOrigin}/api/auth/signin`, {
-        method: "POST",
-        credentials: "include",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({
-          message: challenge.message,
-          signature,
-          scheme: "bip322",
-          expectedNonce: challenge.nonce,
-          expectedAudience: audience,
-          expectedPurpose: "login",
-          // Multi-account add-mode · the auth host preserves
-          // the current roster_id when set, instead of minting
-          // a fresh one. Hosts that haven't deployed the
-          // multi-account migration silently ignore the field.
-          ...add ? { add: true } : {}
-        })
-      });
-      const json = await res.json();
-      if (!res.ok || !("ok" in json) || !json.ok || !json.account) {
-        throw new Error(
-          "reason" in json && json.reason || "error" in json && json.error || `verify_failed_${res.status}`
-        );
-      }
-      onSuccess(json.account, json.token);
+      step = "submit";
+      await submitSignature(challenge.message, challenge.nonce, signature, "bip322");
     } catch (err) {
-      const msg = err instanceof Error ? err.message : "sign-in failed";
-      setError(msg);
+      setError(failureMessage(err, "wallet", step));
       setSubmitting(false);
-      setStage("enter");
     }
   }
+  async function signInManual(e) {
+    e.preventDefault();
+    if (!manual) return;
+    const sig = pasted.trim();
+    if (!sig) {
+      setError("Paste the signature your wallet gave you.");
+      return;
+    }
+    setError(null);
+    setSubmitting(true);
+    try {
+      await submitSignature(manual.message, manual.nonce, sig, void 0);
+    } catch (err) {
+      setError(failureMessage(err, "wallet", "submit"));
+      setSubmitting(false);
+    }
+  }
+  async function copyMessage() {
+    if (!manual) return;
+    try {
+      await navigator.clipboard.writeText(manual.message);
+      setCopied("copied");
+    } catch {
+      setCopied("failed");
+    }
+  }
+  if (manual) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: signInManual, "data-oc-signin-wallet-manual": "", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(FlowHeader, { children: [
+        "In your wallet, use \u201Csign message\u201D (BIP-322) with ",
+        address.trim(),
+        ", sign the text below, and paste the signature back here. Nothing is spent."
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: ids.message, children: "message to sign" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "textarea",
+        {
+          id: ids.message,
+          readOnly: true,
+          value: manual.message,
+          rows: 5,
+          onFocus: (e) => e.currentTarget.select(),
+          style: { ...inputStyle2, resize: "vertical" }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("button", { type: "button", onClick: () => void copyMessage(), style: linkButtonStyle, children: copied === "copied" ? "copied" : "copy message" }),
+      copied === "failed" && /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: "Couldn't copy here. Select the text above and copy it." }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: 14 }, children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: ids.signature, children: "signature" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "textarea",
+          {
+            id: ids.signature,
+            value: pasted,
+            onChange: (e) => {
+              setPasted(e.target.value);
+              if (error) setError(null);
+            },
+            rows: 3,
+            placeholder: "paste the signature",
+            spellCheck: false,
+            autoFocus: true,
+            "aria-invalid": error ? true : void 0,
+            style: { ...inputStyle2, resize: "vertical" }
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsxRuntime.jsx(ErrorLine2, { children: error }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "submit",
+          disabled: submitting || !pasted.trim(),
+          style: submitStyle(submitting || !pasted.trim()),
+          children: submitting ? "checking\u2026" : "sign me in \u2192"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setManual(null);
+            setPasted("");
+            setError(null);
+            setCopied("idle");
+          },
+          style: linkButtonStyle,
+          children: "use a different address"
+        }
+      )
+    ] });
+  }
+  const noBrowserWallet = wallets !== null && wallets.length === 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: signIn, "data-oc-signin-wallet": "", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(FlowHeader, { label: "\xA7 bitcoin wallet", children: "Sign in with any BIP-322-capable Bitcoin wallet (Sparrow, Xverse, Leather, UniSat, Alby, OKX, Phantom). Paste your address, click sign \u2014 your wallet extension prompts for a one-time signature on a short challenge. The address becomes your OC identity. Private key material never leaves your wallet." }),
-    /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "bitcoin address" }),
+    /* @__PURE__ */ jsxRuntime.jsx(FlowHeader, { children: "Your wallet signs a short message to prove you hold the address. Nothing is spent and your key never leaves the wallet. Works with browser wallets, or any wallet that can sign a message, like Sparrow." }),
+    /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: ids.address, children: "bitcoin address" }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
+        id: ids.address,
         type: "text",
         value: address,
         onChange: (e) => {
@@ -2610,6 +2790,19 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
         style: inputStyle2
       }
     ),
+    wallets && wallets.length > 1 && /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginTop: 12 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: ids.wallet, children: "sign with" }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "select",
+        {
+          id: ids.wallet,
+          value: walletId ?? "",
+          onChange: (e) => setWalletId(e.target.value),
+          style: inputStyle2,
+          children: wallets.map((w) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: w.id, children: w.name }, w.id))
+        }
+      )
+    ] }),
     error && /* @__PURE__ */ jsxRuntime.jsx(ErrorLine2, { children: error }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "button",
@@ -2617,54 +2810,71 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
         type: "submit",
         disabled: submitting || !address.trim(),
         style: submitStyle(submitting || !address.trim()),
-        children: stage === "signing" && submitting ? "waiting for wallet\u2026" : "sign challenge \xB7 sign me in \u2192"
+        children: submitting ? "waiting for wallet\u2026" : noBrowserWallet ? "get the message to sign \u2192" : "sign in with wallet \u2192"
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: "Detection picks the first installed BIP-322-capable extension. Address is the one your wallet will sign for." })
+    noBrowserWallet && /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: "No browser wallet found here. You can sign with any wallet and paste." })
   ] });
 }
 function EmailFlow({ authOrigin, add, onSuccess }) {
-  const [stage, setStage] = React3__namespace.useState("enter");
-  const [email, setEmail] = React3__namespace.useState("");
-  const [emailError, setEmailError] = React3__namespace.useState(null);
-  const [code, setCode] = React3__namespace.useState("");
-  const [codeError, setCodeError] = React3__namespace.useState(null);
-  const [token, setToken] = React3__namespace.useState(null);
-  const [submitting, setSubmitting] = React3__namespace.useState(false);
-  async function start(e) {
-    e.preventDefault();
-    const trimmed = email.trim().toLowerCase();
-    if (!trimmed || !/.+@.+\..+/.test(trimmed)) {
-      setEmailError("enter a valid email");
-      return;
-    }
-    setEmailError(null);
-    setSubmitting(true);
+  const uid = React4__namespace.useId();
+  const [stage, setStage] = React4__namespace.useState("enter");
+  const [email, setEmail] = React4__namespace.useState("");
+  const [emailError, setEmailError] = React4__namespace.useState(null);
+  const [code, setCode] = React4__namespace.useState("");
+  const [codeError, setCodeError] = React4__namespace.useState(null);
+  const [token, setToken] = React4__namespace.useState(null);
+  const [submitting, setSubmitting] = React4__namespace.useState(false);
+  const [resent, setResent] = React4__namespace.useState(false);
+  async function sendCode(address) {
     try {
       const res = await fetch(`${authOrigin}/api/auth/email-otp/start`, {
         method: "POST",
         credentials: "include",
         headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ email: trimmed })
+        body: JSON.stringify({ email: address })
       });
       const json = await res.json();
-      if (!res.ok || !json.token) {
-        throw new Error(json.reason ?? `start failed (${res.status})`);
-      }
+      if (!res.ok || !json.token) return humanSigninError(json.reason ?? "server_error", "email");
       setToken(json.token);
-      setEmail(trimmed);
-      setStage("code");
-    } catch (err) {
-      setEmailError(err instanceof Error ? err.message : "failed to send code");
-    } finally {
-      setSubmitting(false);
+      return null;
+    } catch {
+      return NETWORK_ERROR;
+    }
+  }
+  async function start(e) {
+    e.preventDefault();
+    const trimmed = email.trim().toLowerCase();
+    if (!trimmed || !/.+@.+\..+/.test(trimmed)) {
+      setEmailError(humanSigninError("invalid_email", "email"));
+      return;
+    }
+    setEmailError(null);
+    setSubmitting(true);
+    const err = await sendCode(trimmed);
+    setSubmitting(false);
+    if (err) {
+      setEmailError(err);
+      return;
     }
+    setEmail(trimmed);
+    setStage("code");
+  }
+  async function resend() {
+    setCodeError(null);
+    setResent(false);
+    setSubmitting(true);
+    const err = await sendCode(email);
+    setSubmitting(false);
+    setCode("");
+    if (err) setCodeError(err);
+    else setResent(true);
   }
   async function verify(e) {
     e.preventDefault();
     if (!token) return;
     if (code.length !== 6) {
-      setCodeError("6 digits");
+      setCodeError("The code is 6 digits.");
       return;
     }
     setCodeError(null);
@@ -2685,23 +2895,24 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
       const json = await res.json();
       if (!res.ok || !("ok" in json) || !json.ok || !json.account) {
         throw new Error(
-          "reason" in json && json.reason || "error" in json && json.error || `verify failed (${res.status})`
+          "reason" in json && json.reason || "error" in json && json.error || "server_error"
         );
       }
       onSuccess(json.account, json.token);
     } catch (err) {
-      setCodeError(err instanceof Error ? err.message : "verify failed");
+      setCodeError(failureMessage(err, "email", "submit"));
     } finally {
       setSubmitting(false);
     }
   }
   if (stage === "enter") {
     return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: start, "data-oc-signin-email": "", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(FlowHeader, { label: "\xA7 email + otp", children: "We email you a 6-digit code. No password, and no wallet needed to start. Link a Bitcoin address any time \u2014 that is the identity you hold yourself." }),
-      /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "email" }),
+      /* @__PURE__ */ jsxRuntime.jsx(FlowHeader, { children: "We email you a 6-digit code. No password, and no wallet needed to start. Link a Bitcoin address any time \u2014 that is the identity you hold yourself." }),
+      /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: `${uid}-email`, children: "email" }),
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
+          id: `${uid}-email`,
           type: "email",
           autoComplete: "email",
           value: email,
@@ -2716,20 +2927,20 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
         }
       ),
       emailError && /* @__PURE__ */ jsxRuntime.jsx(ErrorLine2, { children: emailError }),
-      /* @__PURE__ */ jsxRuntime.jsx("button", { type: "submit", disabled: submitting, style: submitStyle(submitting), children: submitting ? "sending\u2026" : "send one-time code \u2192" }),
-      /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: "Codes come from the auth host, expire in 10 minutes, and work once." })
+      /* @__PURE__ */ jsxRuntime.jsx("button", { type: "submit", disabled: submitting, style: submitStyle(submitting), children: submitting ? "sending\u2026" : "send one-time code \u2192" })
     ] });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: verify, "data-oc-signin-email-verify": "", children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(FlowHeader, { label: "\xA7 enter the code", children: [
-      "Sent a 6-digit code to ",
+    /* @__PURE__ */ jsxRuntime.jsxs(FlowHeader, { children: [
+      resent ? "Sent a new code to " : "Sent a 6-digit code to ",
       /* @__PURE__ */ jsxRuntime.jsx("span", { style: { color: "var(--foreground, #fafafa)" }, children: email }),
-      ". Code expires in 10 minutes."
+      ". It expires in 10 minutes."
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(Label, { children: "one-time code" }),
+    /* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: `${uid}-code`, children: "one-time code" }),
     /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
+        id: `${uid}-code`,
         type: "text",
         inputMode: "numeric",
         pattern: "\\d{6}",
@@ -2757,31 +2968,32 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
         children: submitting ? "verifying\u2026" : "verify \xB7 sign me in \u2192"
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "button",
-      {
-        type: "button",
-        onClick: () => {
-          setStage("enter");
-          setCode("");
-          setToken(null);
-        },
-        style: {
-          marginTop: 12,
-          background: "transparent",
-          border: "none",
-          color: "var(--muted-foreground, #a1a1aa)",
-          fontFamily: "ui-monospace, SFMono-Regular, monospace",
-          fontSize: 11,
-          letterSpacing: "0.12em",
-          textTransform: "uppercase",
-          cursor: "pointer",
-          padding: 0
-        },
-        children: "use a different email"
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(Hint, { children: "On verify, oc_session is set on Domain=.ochk.io family-wide." })
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => void resend(),
+          disabled: submitting,
+          style: linkButtonStyle,
+          children: "send a new code"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            setStage("enter");
+            setCode("");
+            setToken(null);
+            setResent(false);
+          },
+          style: linkButtonStyle,
+          children: "use a different email"
+        }
+      )
+    ] })
   ] });
 }
 function FlowHeader({
@@ -2789,7 +3001,7 @@ function FlowHeader({
   children
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { marginBottom: 16 }, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
+    label && /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
         style: {
@@ -2817,10 +3029,30 @@ function FlowHeader({
     )
   ] });
 }
-function Label({ children }) {
+var linkButtonStyle = {
+  display: "inline-flex",
+  alignItems: "center",
+  minHeight: 44,
+  marginTop: 4,
+  marginRight: 16,
+  background: "transparent",
+  border: "none",
+  color: "var(--muted-foreground, #a1a1aa)",
+  fontFamily: "ui-monospace, SFMono-Regular, monospace",
+  fontSize: 11,
+  letterSpacing: "0.12em",
+  textTransform: "uppercase",
+  cursor: "pointer",
+  padding: 0
+};
+function Label({
+  htmlFor,
+  children
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "label",
     {
+      htmlFor,
       style: {
         display: "block",
         color: "var(--foreground, #fafafa)",
@@ -2850,7 +3082,9 @@ var inputStyle2 = {
 };
 var linkAlsoStyle = {
   display: "flex",
-  alignItems: "flex-start",
+  alignItems: "center",
+  // The whole row is the checkbox's hit area; the 13px box alone was not.
+  minHeight: 44,
   gap: 8,
   marginTop: 16,
   paddingTop: 14,
@@ -2906,8 +3140,7 @@ function Hint({ children }) {
         color: "var(--muted-foreground, #a1a1aa)",
         fontFamily: "ui-monospace, SFMono-Regular, monospace",
         fontSize: 10.5,
-        lineHeight: 1.55,
-        opacity: 0.7
+        lineHeight: 1.55
       },
       children: [
         "> ",
@@ -2926,13 +3159,13 @@ function isAbortError(err) {
 }
 function useWebAuthnRegister(opts) {
   const authOrigin = resolveAuthOrigin(opts);
-  const [status, setStatus] = React3__namespace.useState("idle");
-  const [error, setError] = React3__namespace.useState(null);
-  const reset = React3__namespace.useCallback(() => {
+  const [status, setStatus] = React4__namespace.useState("idle");
+  const [error, setError] = React4__namespace.useState(null);
+  const reset = React4__namespace.useCallback(() => {
     setStatus("idle");
     setError(null);
   }, []);
-  const register = React3__namespace.useCallback(
+  const register = React4__namespace.useCallback(
     async (args) => {
       setError(null);
       setStatus("requesting-options");
@@ -2994,10 +3227,10 @@ function useWebAuthnRegister(opts) {
 function useWebAuthnList(opts) {
   const authOrigin = resolveAuthOrigin(opts);
   const { status: sessionStatus } = useOcSession();
-  const [credentials, setCredentials] = React3__namespace.useState([]);
-  const [status, setStatus] = React3__namespace.useState("loading");
-  const [error, setError] = React3__namespace.useState(null);
-  const refetch = React3__namespace.useCallback(async () => {
+  const [credentials, setCredentials] = React4__namespace.useState([]);
+  const [status, setStatus] = React4__namespace.useState("loading");
+  const [error, setError] = React4__namespace.useState(null);
+  const refetch = React4__namespace.useCallback(async () => {
     setError(null);
     if (sessionStatus !== "authenticated") {
       setCredentials([]);
@@ -3025,10 +3258,10 @@ function useWebAuthnList(opts) {
       setStatus("error");
     }
   }, [authOrigin, sessionStatus]);
-  React3__namespace.useEffect(() => {
+  React4__namespace.useEffect(() => {
     void refetch();
   }, [refetch]);
-  const rename = React3__namespace.useCallback(
+  const rename = React4__namespace.useCallback(
     async (id, label) => {
       try {
         const r = await fetch(`${authOrigin}/api/auth/webauthn/credentials/${id}`, {
@@ -3053,7 +3286,7 @@ function useWebAuthnList(opts) {
     },
     [authOrigin, refetch]
   );
-  const remove = React3__namespace.useCallback(
+  const remove = React4__namespace.useCallback(
     async (id) => {
       try {
         const r = await fetch(`${authOrigin}/api/auth/webauthn/credentials/${id}`, {
@@ -3081,13 +3314,13 @@ function useWebAuthnList(opts) {
 function useStepUpAuth(opts) {
   const authOrigin = resolveAuthOrigin(opts);
   const { refresh } = useOcSession();
-  const [status, setStatus] = React3__namespace.useState("idle");
-  const [error, setError] = React3__namespace.useState(null);
-  const reset = React3__namespace.useCallback(() => {
+  const [status, setStatus] = React4__namespace.useState("idle");
+  const [error, setError] = React4__namespace.useState(null);
+  const reset = React4__namespace.useCallback(() => {
     setStatus("idle");
     setError(null);
   }, []);
-  const stepUp = React3__namespace.useCallback(
+  const stepUp = React4__namespace.useCallback(
     async (args) => {
       setError(null);
       setStatus("requesting-options");