@orangecheck/auth-client 1.0.0 → 1.1.0

package/dist/index.mjs

@@ -132,13 +132,15 @@ function useUniqueId(prefix) {
 }
 function OcAccountChip({
   dashboardUrl = "https://ochk.io/dashboard",
+  signInUrl: signInUrlOverride,
   signInLabel = "sign in",
   className,
   triggerClassName,
   popoverClassName,
   menuItemClassName
 }) {
-  const { status, account, signInUrl, signOut } = useOcSession();
+  const { status, account, signInUrl: sessionSignInUrl, signOut } = useOcSession();
+  const signInUrl = signInUrlOverride ?? sessionSignInUrl;
   const [open, setOpen] = React2.useState(false);
   const wrapRef = React2.useRef(null);
   React2.useEffect(() => {
@@ -395,16 +397,18 @@ function OcSignInButton({
   label = "sign in with bitcoin",
   eager = false,
   className,
+  signInUrl: signInUrlOverride,
   ...rest
 }) {
-  const { status, signInUrl } = useOcSession();
+  const { status, signInUrl: sessionSignInUrl } = useOcSession();
+  const href = signInUrlOverride ?? sessionSignInUrl;
   if (status === "authenticated") return null;
   if (!eager && status === "loading") return null;
   return /* @__PURE__ */ jsx(
     "a",
     {
       ...rest,
-      href: signInUrl,
+      href,
       className,
       "data-oc-sign-in-button": "",
       children: label
@@ -742,7 +746,510 @@ var OcAddressInput = React2.forwardRef(
     );
   }
 );
+function safeReturnTo(input) {
+  const candidate = input ?? "/";
+  if (typeof candidate !== "string") return "/";
+  if (!candidate.startsWith("/") || candidate.startsWith("//")) return "/";
+  return candidate;
+}
+function hardNavigate(target) {
+  if (typeof window === "undefined") return;
+  window.location.assign(target);
+}
+function OcSignIn({
+  audience,
+  returnTo,
+  onSuccess,
+  authOrigin = "https://ochk.io",
+  initialPath = "wallet",
+  paths,
+  className
+}) {
+  const walletEnabled = paths?.wallet ?? true;
+  const emailEnabled = paths?.email ?? true;
+  const safeReturn = safeReturnTo(returnTo);
+  const [path, setPath] = React2.useState(initialPath);
+  const handleSuccess = React2.useCallback(
+    (account) => {
+      if (onSuccess) {
+        onSuccess(account);
+        return;
+      }
+      hardNavigate(safeReturn);
+    },
+    [onSuccess, safeReturn]
+  );
+  if (!walletEnabled && !emailEnabled) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className,
+        "data-oc-signin": "",
+        style: {
+          padding: "1rem",
+          border: "1px solid var(--border, #27272a)",
+          color: "var(--foreground, #fafafa)",
+          fontFamily: "ui-monospace, SFMono-Regular, monospace",
+          fontSize: 12
+        },
+        children: [
+          "no signin paths enabled \u2014 set ",
+          /* @__PURE__ */ jsx("code", { children: "paths.wallet" }),
+          " or",
+          " ",
+          /* @__PURE__ */ jsx("code", { children: "paths.email" }),
+          " to ",
+          /* @__PURE__ */ jsx("code", { children: "true" })
+        ]
+      }
+    );
+  }
+  const showWallet = walletEnabled && (path === "wallet" || !emailEnabled);
+  const showEmail = emailEnabled && (path === "email" || !walletEnabled);
+  const bothEnabled = walletEnabled && emailEnabled;
+  return /* @__PURE__ */ jsxs("div", { className, "data-oc-signin": "", children: [
+    bothEnabled && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        role: "tablist",
+        "aria-label": "signin method",
+        "data-oc-signin-tabs": "",
+        style: {
+          display: "flex",
+          gap: 8,
+          marginBottom: 16,
+          borderBottom: "1px solid var(--border, #27272a)"
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            SigninTab,
+            {
+              active: path === "wallet",
+              onClick: () => setPath("wallet"),
+              children: "bitcoin wallet"
+            }
+          ),
+          /* @__PURE__ */ jsx(SigninTab, { active: path === "email", onClick: () => setPath("email"), children: "email + otp" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { "data-oc-signin-panel": "", role: "tabpanel", children: [
+      showWallet && /* @__PURE__ */ jsx(
+        WalletFlow,
+        {
+          authOrigin,
+          audience,
+          onSuccess: handleSuccess
+        }
+      ),
+      showEmail && /* @__PURE__ */ jsx(EmailFlow, { authOrigin, onSuccess: handleSuccess })
+    ] })
+  ] });
+}
+function SigninTab({
+  active,
+  onClick,
+  children
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      role: "tab",
+      "aria-selected": active,
+      onClick,
+      "data-oc-signin-tab": active ? "active" : "inactive",
+      style: {
+        padding: "0.6rem 0.875rem",
+        background: "transparent",
+        border: "none",
+        borderBottom: active ? "2px solid var(--primary, #f97316)" : "2px solid transparent",
+        color: active ? "var(--foreground, #fafafa)" : "var(--muted-foreground, #a1a1aa)",
+        fontFamily: "ui-monospace, SFMono-Regular, monospace",
+        fontSize: 11,
+        letterSpacing: "0.12em",
+        textTransform: "uppercase",
+        cursor: "pointer",
+        marginBottom: -1
+      },
+      children
+    }
+  );
+}
+function WalletFlow({ authOrigin, audience, onSuccess }) {
+  const [address, setAddress] = React2.useState("");
+  const [error, setError] = React2.useState(null);
+  const [submitting, setSubmitting] = React2.useState(false);
+  const [stage, setStage] = React2.useState("enter");
+  async function signIn(e) {
+    e.preventDefault();
+    const addr = address.trim();
+    if (!addr) {
+      setError("paste a Bitcoin address");
+      return;
+    }
+    setError(null);
+    setSubmitting(true);
+    setStage("signing");
+    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 adapter;
+      try {
+        const moduleId = "@orangecheck/wallet-adapter";
+        adapter = await Function("m", "return import(m)")(
+          moduleId
+        );
+      } catch {
+        throw new Error(
+          "@orangecheck/wallet-adapter not installed \xB7 add it to your consumer site"
+        );
+      }
+      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 wallet = wallets[0];
+      const signer = adapter.getSigner(wallet.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"
+        })
+      });
+      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);
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : "sign-in failed";
+      setError(msg);
+      setSubmitting(false);
+      setStage("enter");
+    }
+  }
+  return /* @__PURE__ */ jsxs("form", { onSubmit: signIn, "data-oc-signin-wallet": "", children: [
+    /* @__PURE__ */ 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__ */ jsx(Label, { children: "bitcoin address" }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "text",
+        value: address,
+        onChange: (e) => {
+          setAddress(e.target.value);
+          if (error) setError(null);
+        },
+        placeholder: "bc1q\u2026 \xB7 3\u2026 \xB7 1\u2026",
+        autoComplete: "off",
+        autoCapitalize: "none",
+        spellCheck: false,
+        required: true,
+        "aria-invalid": error ? true : void 0,
+        style: inputStyle
+      }
+    ),
+    error && /* @__PURE__ */ jsx(ErrorLine, { children: error }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        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"
+      }
+    ),
+    /* @__PURE__ */ jsx(Hint, { children: "Detection picks the first installed BIP-322-capable extension. Address is the one your wallet will sign for." })
+  ] });
+}
+function EmailFlow({ authOrigin, onSuccess }) {
+  const [stage, setStage] = React2.useState("enter");
+  const [email, setEmail] = React2.useState("");
+  const [emailError, setEmailError] = React2.useState(null);
+  const [code, setCode] = React2.useState("");
+  const [codeError, setCodeError] = React2.useState(null);
+  const [token, setToken] = React2.useState(null);
+  const [submitting, setSubmitting] = React2.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);
+    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 })
+      });
+      const json = await res.json();
+      if (!res.ok || !json.token) {
+        throw new Error(json.reason ?? `start failed (${res.status})`);
+      }
+      setToken(json.token);
+      setEmail(trimmed);
+      setStage("code");
+    } catch (err) {
+      setEmailError(err instanceof Error ? err.message : "failed to send code");
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  async function verify(e) {
+    e.preventDefault();
+    if (!token) return;
+    if (code.length !== 6) {
+      setCodeError("6 digits");
+      return;
+    }
+    setCodeError(null);
+    setSubmitting(true);
+    try {
+      const res = await fetch(`${authOrigin}/api/auth/email-otp/verify`, {
+        method: "POST",
+        credentials: "include",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ email, code, token })
+      });
+      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);
+    } catch (err) {
+      setCodeError(err instanceof Error ? err.message : "verify failed");
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  if (stage === "enter") {
+    return /* @__PURE__ */ jsxs("form", { onSubmit: start, "data-oc-signin-email": "", children: [
+      /* @__PURE__ */ jsx(FlowHeader, { label: "\xA7 email + otp", children: "We email you a 6-digit code. No password. The federation provisions a custodial wallet for you in your browser. Best path if you don't have a Bitcoin wallet yet \u2014 graduate to self-custody anytime by adding your BTC address from your account dashboard." }),
+      /* @__PURE__ */ jsx(Label, { children: "email" }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "email",
+          autoComplete: "email",
+          value: email,
+          onChange: (e) => {
+            setEmail(e.target.value);
+            if (emailError) setEmailError(null);
+          },
+          placeholder: "you@example.com",
+          required: true,
+          "aria-invalid": emailError ? true : void 0,
+          style: inputStyle
+        }
+      ),
+      emailError && /* @__PURE__ */ jsx(ErrorLine, { children: emailError }),
+      /* @__PURE__ */ jsx("button", { type: "submit", disabled: submitting, style: submitStyle(submitting), children: submitting ? "sending\u2026" : "send one-time code \u2192" }),
+      /* @__PURE__ */ jsx(Hint, { children: "OTP delivered by the auth host. Codes expire in 10 minutes and are single-use. Rate-limited 5 starts/hour/IP." })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("form", { onSubmit: verify, "data-oc-signin-email-verify": "", children: [
+    /* @__PURE__ */ jsxs(FlowHeader, { label: "\xA7 enter the code", children: [
+      "Sent a 6-digit code to ",
+      /* @__PURE__ */ jsx("span", { style: { color: "var(--foreground, #fafafa)" }, children: email }),
+      ". Code expires in 10 minutes."
+    ] }),
+    /* @__PURE__ */ jsx(Label, { children: "one-time code" }),
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "text",
+        inputMode: "numeric",
+        pattern: "\\d{6}",
+        maxLength: 6,
+        autoComplete: "one-time-code",
+        value: code,
+        onChange: (e) => {
+          setCode(e.target.value.replace(/\D/g, "").slice(0, 6));
+          if (codeError) setCodeError(null);
+        },
+        placeholder: "6 digits",
+        required: true,
+        autoFocus: true,
+        "aria-invalid": codeError ? true : void 0,
+        style: { ...inputStyle, letterSpacing: "0.4em", fontSize: 16 }
+      }
+    ),
+    codeError && /* @__PURE__ */ jsx(ErrorLine, { children: codeError }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "submit",
+        disabled: submitting || code.length !== 6,
+        style: submitStyle(submitting || code.length !== 6),
+        children: submitting ? "verifying\u2026" : "verify \xB7 sign me in \u2192"
+      }
+    ),
+    /* @__PURE__ */ 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__ */ jsx(Hint, { children: "On verify, oc_session is set on Domain=.ochk.io family-wide." })
+  ] });
+}
+function FlowHeader({
+  label,
+  children
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: { marginBottom: 16 }, children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        style: {
+          color: "var(--primary, #f97316)",
+          fontFamily: "ui-monospace, SFMono-Regular, monospace",
+          fontSize: 10,
+          letterSpacing: "0.18em",
+          textTransform: "uppercase",
+          marginBottom: 6
+        },
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      "p",
+      {
+        style: {
+          color: "var(--muted-foreground, #a1a1aa)",
+          fontSize: 13,
+          lineHeight: 1.55,
+          margin: 0
+        },
+        children
+      }
+    )
+  ] });
+}
+function Label({ children }) {
+  return /* @__PURE__ */ jsx(
+    "label",
+    {
+      style: {
+        display: "block",
+        color: "var(--foreground, #fafafa)",
+        fontFamily: "ui-monospace, SFMono-Regular, monospace",
+        fontSize: 11,
+        letterSpacing: "0.12em",
+        textTransform: "uppercase",
+        marginBottom: 6
+      },
+      children
+    }
+  );
+}
+var inputStyle = {
+  width: "100%",
+  padding: "0.55rem 0.75rem",
+  background: "var(--background, #0a0a0a)",
+  color: "var(--foreground, #fafafa)",
+  border: "1px solid var(--input, #27272a)",
+  borderRadius: 6,
+  fontFamily: "ui-monospace, SFMono-Regular, monospace",
+  fontSize: 13,
+  outline: "none"
+};
+function submitStyle(disabled) {
+  return {
+    marginTop: 12,
+    padding: "0.6rem 1rem",
+    background: "var(--primary, #f97316)",
+    color: "var(--primary-foreground, #0a0a0a)",
+    border: "none",
+    borderRadius: 6,
+    fontFamily: "ui-monospace, SFMono-Regular, monospace",
+    fontSize: 11,
+    letterSpacing: "0.14em",
+    textTransform: "uppercase",
+    fontWeight: 600,
+    cursor: disabled ? "not-allowed" : "pointer",
+    opacity: disabled ? 0.5 : 1,
+    width: "100%"
+  };
+}
+function ErrorLine({ children }) {
+  return /* @__PURE__ */ jsx(
+    "p",
+    {
+      role: "alert",
+      style: {
+        marginTop: 6,
+        marginBottom: 0,
+        color: "var(--destructive, #ef4444)",
+        fontFamily: "ui-monospace, SFMono-Regular, monospace",
+        fontSize: 11,
+        letterSpacing: "0.04em"
+      },
+      children
+    }
+  );
+}
+function Hint({ children }) {
+  return /* @__PURE__ */ jsxs(
+    "p",
+    {
+      style: {
+        marginTop: 12,
+        marginBottom: 0,
+        color: "var(--muted-foreground, #a1a1aa)",
+        fontFamily: "ui-monospace, SFMono-Regular, monospace",
+        fontSize: 10.5,
+        lineHeight: 1.55,
+        opacity: 0.7
+      },
+      children: [
+        "> ",
+        children
+      ]
+    }
+  );
+}
 
-export { DEFAULT_CONFIG, OcAccountChip, OcAccountPill, OcAddressInput, OcSessionProvider, OcSignInButton, buildSignInUrl, useOcAddressSuggestion, useOcSession, useOptionalOcSession };
+export { DEFAULT_CONFIG, OcAccountChip, OcAccountPill, OcAddressInput, OcSessionProvider, OcSignIn, OcSignInButton, buildSignInUrl, useOcAddressSuggestion, useOcSession, useOptionalOcSession };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map