@orangecheck/auth-client 2.27.0 → 2.29.0

package/dist/index.mjs

@@ -10,7 +10,8 @@ var DEFAULT_CONFIG = {
   authOrigin: "https://ochk.io",
   signInPath: "/signin",
   mePath: "/api/auth/me",
-  logoutPath: "/api/auth/logout"
+  logoutPath: "/api/auth/logout",
+  multiAccount: true
 };
 function resolveConfig(cfg) {
   return { ...DEFAULT_CONFIG, ...cfg ?? {} };
@@ -266,7 +267,7 @@ function OcSessionProvider({
   const pinInFlightRef = React4.useRef(false);
   const pinThisTab = React4.useCallback(
     async (didOc) => {
-      if (pinInFlightRef.current || readTabSession()) return;
+      if (!cfg.multiAccount || pinInFlightRef.current || readTabSession()) return;
       pinInFlightRef.current = true;
       try {
         const res = await fetch(`${cfg.authOrigin}/api/auth/tab`, {
@@ -285,7 +286,7 @@ function OcSessionProvider({
         pinInFlightRef.current = false;
       }
     },
-    [cfg.authOrigin]
+    [cfg.authOrigin, cfg.multiAccount]
   );
   const refresh = React4.useCallback(async () => {
     if (typeof window === "undefined") return;
@@ -332,7 +333,7 @@ function OcSessionProvider({
       setError(null);
       if (acct && !pin) void pinThisTab(acct.didOc);
       const currentOrigin = typeof window !== "undefined" ? window.location.origin : null;
-      if (acct && rosterEntries.length === 0 && currentOrigin !== null && !cfg.authOrigin.startsWith(currentOrigin)) {
+      if (cfg.multiAccount && acct && rosterEntries.length === 0 && currentOrigin !== null && !cfg.authOrigin.startsWith(currentOrigin)) {
         const peers = await fetchHostRoster(cfg);
         if (peers.length > 0) setRoster(peers);
       }
@@ -345,15 +346,21 @@ function OcSessionProvider({
     let cancelled = false;
     consumeTabAdoptMarker();
     void (async () => {
-      await consumeTabAccountHint(cfg.authOrigin);
+      if (cfg.multiAccount) await consumeTabAccountHint(cfg.authOrigin);
       if (!cancelled) void refresh();
     })();
     return () => {
       cancelled = true;
     };
-  }, [refresh, cfg.authOrigin]);
-  React4.useEffect(() => installTabFetchInterceptor(cfg.authOrigin), [cfg.authOrigin]);
-  React4.useEffect(() => installTabLinkDecorator(cfg.authOrigin), [cfg.authOrigin]);
+  }, [refresh, cfg.authOrigin, cfg.multiAccount]);
+  React4.useEffect(
+    () => cfg.multiAccount ? installTabFetchInterceptor(cfg.authOrigin) : void 0,
+    [cfg.authOrigin, cfg.multiAccount]
+  );
+  React4.useEffect(
+    () => cfg.multiAccount ? installTabLinkDecorator(cfg.authOrigin) : void 0,
+    [cfg.authOrigin, cfg.multiAccount]
+  );
   const signOut = React4.useCallback(
     async (opts) => {
       const scope = opts?.scope ?? "all";
@@ -1167,6 +1174,7 @@ var signinSize = (px) => `calc(${px}px * var(--oc-signin-scale, 1))`;
 var signinRadius = (px) => `var(--oc-signin-radius, ${px}px)`;
 var SIGNIN_BUTTON_RADIUS = "var(--oc-signin-button-radius, 6px)";
 var SIGNIN_STRONG = "var(--oc-signin-strong, 600)";
+var SIGNIN_ARROW = "var(--oc-signin-arrow, inline)";
 var DEFAULT_AUTH_ORIGIN = "https://ochk.io";
 async function fetchOcLinkedIdentities(opts) {
   const authOrigin = opts?.authOrigin ?? DEFAULT_AUTH_ORIGIN;
@@ -2120,16 +2128,21 @@ function OcSignIn({
   returnTo,
   onSuccess,
   resolveReturnTo,
-  linkPrompt = true,
+  linkPrompt: linkPromptProp = true,
   add: addProp,
   authOrigin = "https://ochk.io",
   initialPath,
   providersFirst = true,
   paths,
-  className
+  className,
+  mode,
+  providerHref
 }) {
   const walletEnabled = paths?.wallet ?? true;
   const emailEnabled = paths?.email ?? true;
+  const firstParty = mode === "first-party";
+  const credentials = firstParty ? "omit" : "include";
+  const linkPrompt = linkPromptProp && !firstParty;
   const [resolvedReturn, setResolvedReturn] = React4.useState(
     () => familyReturnTarget(returnTo) ?? safeReturnTo(returnTo)
   );
@@ -2144,15 +2157,19 @@ function OcSignIn({
     const fromQuery = familyReturnTarget(q.get("return_to")) ?? familyReturnTarget(q.get("next"));
     setResolvedReturn(fromQuery ?? "/");
   }, [returnTo]);
-  const [addMode, setAddMode] = React4.useState(Boolean(addProp));
+  const [addMode, setAddMode] = React4.useState(Boolean(addProp) && !firstParty);
   React4.useEffect(() => {
     if (typeof window === "undefined") return;
+    if (firstParty) {
+      setAddMode(false);
+      return;
+    }
     if (addProp !== void 0) {
       setAddMode(Boolean(addProp));
       return;
     }
     setAddMode(new URLSearchParams(window.location.search).get("add") === "1");
-  }, [addProp]);
+  }, [addProp, firstParty]);
   const [path, setPath] = React4.useState(
     initialPath ?? (providersFirst ? "email" : "wallet")
   );
@@ -2309,6 +2326,9 @@ function OcSignIn({
         authOrigin,
         returnTo: resolvedReturn,
         add: addMode,
+        credentials,
+        firstParty,
+        providerHref,
         first: true
       }
     ),
@@ -2330,7 +2350,7 @@ function OcSignIn({
             {
               active: path === "email",
               onClick: () => setPath("email"),
-              children: "email"
+              children: "Email"
             }
           ),
           /* @__PURE__ */ jsx(
@@ -2338,7 +2358,7 @@ function OcSignIn({
             {
               active: path === "wallet",
               onClick: () => setPath("wallet"),
-              children: "bitcoin wallet"
+              children: "Bitcoin wallet"
             }
           )
         ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -2347,7 +2367,7 @@ function OcSignIn({
             {
               active: path === "wallet",
               onClick: () => setPath("wallet"),
-              children: "bitcoin wallet"
+              children: "Bitcoin wallet"
             }
           ),
           /* @__PURE__ */ jsx(
@@ -2355,7 +2375,7 @@ function OcSignIn({
             {
               active: path === "email",
               onClick: () => setPath("email"),
-              children: "email"
+              children: "Email"
             }
           )
         ] })
@@ -2368,6 +2388,7 @@ function OcSignIn({
           authOrigin,
           audience,
           add: addMode,
+          credentials,
           onSuccess: (a, t) => void handleSuccess(a, t, "wallet")
         }
       ),
@@ -2376,11 +2397,22 @@ function OcSignIn({
         {
           authOrigin,
           add: addMode,
+          credentials,
           onSuccess: (a, t) => void handleSuccess(a, t, "email")
         }
       )
     ] }),
-    !providersFirst && /* @__PURE__ */ jsx(ProviderSignIn, { authOrigin, returnTo: resolvedReturn, add: addMode }),
+    !providersFirst && /* @__PURE__ */ jsx(
+      ProviderSignIn,
+      {
+        authOrigin,
+        returnTo: resolvedReturn,
+        add: addMode,
+        credentials,
+        firstParty,
+        providerHref
+      }
+    ),
     linkPrompt && /* @__PURE__ */ jsxs("label", { "data-oc-signin-linkalso": "", style: linkAlsoStyle, children: [
       /* @__PURE__ */ jsx(
         "input",
@@ -2453,14 +2485,19 @@ function ProviderSignIn({
   authOrigin,
   returnTo,
   add,
+  credentials,
+  firstParty,
+  providerHref,
   first = false
 }) {
   const [providers, setProviders] = React4.useState(null);
   const [origin, setOrigin] = React4.useState("");
+  const hidden = firstParty && !providerHref;
   React4.useEffect(() => {
     setOrigin(window.location.origin);
+    if (hidden) return;
     let cancelled = false;
-    fetch(`${authOrigin}/api/auth/providers`, { credentials: "include" }).then((r) => r.ok ? r.json() : null).then((body) => {
+    fetch(`${authOrigin}/api/auth/providers`, { credentials }).then((r) => r.ok ? r.json() : null).then((body) => {
       if (!cancelled) setProviders(body?.providers ?? []);
     }).catch(() => {
       if (!cancelled) setProviders([]);
@@ -2468,7 +2505,8 @@ function ProviderSignIn({
     return () => {
       cancelled = true;
     };
-  }, [authOrigin]);
+  }, [authOrigin, credentials, hidden]);
+  if (hidden) 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)" };
@@ -2526,7 +2564,7 @@ function ProviderSignIn({
   const buttons = providers.map((p, i) => /* @__PURE__ */ jsxs(
     "a",
     {
-      href: `${authOrigin}/api/auth/${p.id}/start?return_to=${encodeURIComponent(
+      href: providerHref ? providerHref(p.id) : `${authOrigin}/api/auth/${p.id}/start?return_to=${encodeURIComponent(
         providerReturnTo
       )}${add ? "&add=1" : ""}`,
       "data-oc-signin-provider": p.id,
@@ -2559,7 +2597,13 @@ async function loadAdapter() {
 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 }) {
+function WalletFlow({
+  authOrigin,
+  audience,
+  add,
+  credentials,
+  onSuccess
+}) {
   const uid = React4.useId();
   const ids = {
     address: `${uid}-address`,
@@ -2601,7 +2645,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
   async function submitSignature(message, nonce, signature, scheme) {
     const res = await fetch(`${authOrigin}/api/auth/signin`, {
       method: "POST",
-      credentials: "include",
+      credentials,
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({
         message,
@@ -2693,7 +2737,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
         address.trim(),
         ", sign the text below, and paste the signature back here. Nothing is spent."
       ] }),
-      /* @__PURE__ */ jsx(Label, { htmlFor: ids.message, children: "message to sign" }),
+      /* @__PURE__ */ jsx(Label, { htmlFor: ids.message, children: "Message to sign" }),
       /* @__PURE__ */ jsx(
         "textarea",
         {
@@ -2705,10 +2749,10 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
           style: { ...inputStyle2, resize: "vertical" }
         }
       ),
-      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => void copyMessage(), style: linkButtonStyle, children: copied === "copied" ? "copied" : "copy message" }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => void copyMessage(), style: linkButtonStyle, children: copied === "copied" ? "Copied" : "Copy message" }),
       copied === "failed" && /* @__PURE__ */ jsx(Hint, { children: "Couldn't copy here. Select the text above and copy it." }),
       /* @__PURE__ */ jsxs("div", { style: { marginTop: 14 }, children: [
-        /* @__PURE__ */ jsx(Label, { htmlFor: ids.signature, children: "signature" }),
+        /* @__PURE__ */ jsx(Label, { htmlFor: ids.signature, children: "Signature" }),
         /* @__PURE__ */ jsx(
           "textarea",
           {
@@ -2734,7 +2778,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
           type: "submit",
           disabled: submitting || !pasted.trim(),
           style: submitStyle(submitting || !pasted.trim()),
-          children: submitting ? "checking\u2026" : "sign me in \u2192"
+          children: submitting ? "Checking\u2026" : /* @__PURE__ */ jsx(Submit, { children: "Sign me in" })
         }
       ),
       /* @__PURE__ */ jsx(
@@ -2748,7 +2792,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
             setCopied("idle");
           },
           style: linkButtonStyle,
-          children: "use a different address"
+          children: "Use a different address"
         }
       )
     ] });
@@ -2756,7 +2800,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
   const noBrowserWallet = wallets !== null && wallets.length === 0;
   return /* @__PURE__ */ jsxs("form", { onSubmit: signIn, "data-oc-signin-wallet": "", children: [
     /* @__PURE__ */ 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__ */ jsx(Label, { htmlFor: ids.address, children: "bitcoin address" }),
+    /* @__PURE__ */ jsx(Label, { htmlFor: ids.address, children: "Bitcoin address" }),
     /* @__PURE__ */ jsx(
       "input",
       {
@@ -2777,7 +2821,7 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
       }
     ),
     wallets && wallets.length > 1 && /* @__PURE__ */ jsxs("div", { style: { marginTop: 12 }, children: [
-      /* @__PURE__ */ jsx(Label, { htmlFor: ids.wallet, children: "sign with" }),
+      /* @__PURE__ */ jsx(Label, { htmlFor: ids.wallet, children: "Sign with" }),
       /* @__PURE__ */ jsx(
         "select",
         {
@@ -2796,13 +2840,13 @@ function WalletFlow({ authOrigin, audience, add, onSuccess }) {
         type: "submit",
         disabled: submitting || !address.trim(),
         style: submitStyle(submitting || !address.trim()),
-        children: submitting ? "waiting for wallet\u2026" : noBrowserWallet ? "get the message to sign \u2192" : "sign in with wallet \u2192"
+        children: submitting ? "Waiting for wallet\u2026" : noBrowserWallet ? /* @__PURE__ */ jsx(Submit, { children: "Get the message to sign" }) : /* @__PURE__ */ jsx(Submit, { children: "Sign in with wallet" })
       }
     ),
     noBrowserWallet && /* @__PURE__ */ jsx(Hint, { children: "No browser wallet found here. You can sign with any wallet and paste." })
   ] });
 }
-function EmailFlow({ authOrigin, add, onSuccess }) {
+function EmailFlow({ authOrigin, add, credentials, onSuccess }) {
   const uid = React4.useId();
   const [stage, setStage] = React4.useState("enter");
   const [email, setEmail] = React4.useState("");
@@ -2816,7 +2860,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
     try {
       const res = await fetch(`${authOrigin}/api/auth/email-otp/start`, {
         method: "POST",
-        credentials: "include",
+        credentials,
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({ email: address })
       });
@@ -2868,7 +2912,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
     try {
       const res = await fetch(`${authOrigin}/api/auth/email-otp/verify`, {
         method: "POST",
-        credentials: "include",
+        credentials,
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({
           email,
@@ -2894,7 +2938,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
   if (stage === "enter") {
     return /* @__PURE__ */ jsxs("form", { onSubmit: start, "data-oc-signin-email": "", children: [
       /* @__PURE__ */ 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__ */ jsx(Label, { htmlFor: `${uid}-email`, children: "email" }),
+      /* @__PURE__ */ jsx(Label, { htmlFor: `${uid}-email`, children: "Email" }),
       /* @__PURE__ */ jsx(
         "input",
         {
@@ -2913,7 +2957,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
         }
       ),
       emailError && /* @__PURE__ */ jsx(ErrorLine2, { children: emailError }),
-      /* @__PURE__ */ jsx("button", { type: "submit", disabled: submitting, style: submitStyle(submitting), children: submitting ? "sending\u2026" : "send one-time code \u2192" })
+      /* @__PURE__ */ jsx("button", { type: "submit", disabled: submitting, style: submitStyle(submitting), children: submitting ? "Sending\u2026" : /* @__PURE__ */ jsx(Submit, { children: "Send one-time code" }) })
     ] });
   }
   return /* @__PURE__ */ jsxs("form", { onSubmit: verify, "data-oc-signin-email-verify": "", children: [
@@ -2922,7 +2966,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
       /* @__PURE__ */ jsx("span", { style: { color: "var(--foreground, #fafafa)" }, children: email }),
       ". It expires in 10 minutes."
     ] }),
-    /* @__PURE__ */ jsx(Label, { htmlFor: `${uid}-code`, children: "one-time code" }),
+    /* @__PURE__ */ jsx(Label, { htmlFor: `${uid}-code`, children: "One-time code" }),
     /* @__PURE__ */ jsx(
       "input",
       {
@@ -2951,7 +2995,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
         type: "submit",
         disabled: submitting || code.length !== 6,
         style: submitStyle(submitting || code.length !== 6),
-        children: submitting ? "verifying\u2026" : "verify \xB7 sign me in \u2192"
+        children: submitting ? "Verifying\u2026" : /* @__PURE__ */ jsx(Submit, { children: "Verify \xB7 sign me in" })
       }
     ),
     /* @__PURE__ */ jsxs("div", { children: [
@@ -2962,7 +3006,7 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
           onClick: () => void resend(),
           disabled: submitting,
           style: linkButtonStyle,
-          children: "send a new code"
+          children: "Send a new code"
         }
       ),
       /* @__PURE__ */ jsx(
@@ -2976,12 +3020,18 @@ function EmailFlow({ authOrigin, add, onSuccess }) {
             setResent(false);
           },
           style: linkButtonStyle,
-          children: "use a different email"
+          children: "Use a different email"
         }
       )
     ] })
   ] });
 }
+function Submit({ children }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    children,
+    /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: { display: SIGNIN_ARROW }, children: " \u2192" })
+  ] });
+}
 function FlowHeader({
   label,
   children