@codelitdev/oauth-server-kit 0.1.0-alpha.0 → 0.1.0-alpha.1

package/README.md

@@ -8,17 +8,6 @@ The library authenticates people and OAuth clients. Each product continues to
 own its users-to-actor mapping, organizations, teams, memberships, roles,
 permissions, API keys, and credential precedence.
 
-## Install
-
-The package is currently released through npm's `alpha` channel:
-
-```sh
-pnpm add @codelitdev/oauth-server-kit@alpha
-```
-
-It has a pre-1.0 public API. Pin an explicit version for production consumers
-and upgrade deliberately.
-
 ## Supported surfaces
 
 - Web apps use product-local Better Auth sessions.
@@ -85,14 +74,3 @@ pnpm build
 The coverage release gate is 90% statements, lines, and functions and 80%
 branches. The suite includes a real Better Auth OAuth Provider flow with a
 public client, S256 PKCE, refresh, JWKS verification, and MCP discovery.
-
-## Releasing an alpha
-
-After updating the package version, run:
-
-```sh
-npm run release:alpha -- --otp=<npm-otp>
-```
-
-The command validates formatting, linting, types, tests, coverage, and the
-build before publishing to npm with the `alpha` dist-tag.

package/dist/express.d.mts

@@ -30,6 +30,9 @@ interface CreateOAuthPagesRouterOptions {
     defaultRedirectUrl: string;
     loginMethods: readonly HostedLoginMethod[];
     legacyHostOnlySessionCookieNames?: readonly string[];
+    logoUrl?: string;
+    faviconUrl?: string;
+    primaryColor?: string;
 }
 declare function createOAuthPagesRouter(rawOptions: CreateOAuthPagesRouterOptions): Router;
 

package/dist/express.d.ts

@@ -30,6 +30,9 @@ interface CreateOAuthPagesRouterOptions {
     defaultRedirectUrl: string;
     loginMethods: readonly HostedLoginMethod[];
     legacyHostOnlySessionCookieNames?: readonly string[];
+    logoUrl?: string;
+    faviconUrl?: string;
+    primaryColor?: string;
 }
 declare function createOAuthPagesRouter(rawOptions: CreateOAuthPagesRouterOptions): Router;
 

package/dist/express.js

@@ -209,6 +209,41 @@ function absoluteOrigin(value, field) {
   }
   return url.origin;
 }
+var HEX_COLOR = /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;
+var OKLCH_COLOR = /^oklch\([0-9.%\s/,+-]+\)$/i;
+function brandingColor(value, field) {
+  if (value === void 0) return void 0;
+  const color = value.trim();
+  if (HEX_COLOR.test(color) || OKLCH_COLOR.test(color)) return color;
+  throw new Error(`${field} must be a hex or oklch() color`);
+}
+function brandingUrl(value, field) {
+  if (value === void 0) return void 0;
+  const raw = value.trim();
+  if (!raw) throw new Error(`${field} must be a URL`);
+  if (raw.startsWith("/") && !raw.startsWith("//")) {
+    if (/\s/.test(raw) || raw.includes("\\") || raw.includes("<")) {
+      throw new Error(`${field} must be a safe URL`);
+    }
+    return raw;
+  }
+  let url;
+  try {
+    url = new URL(raw);
+  } catch (e) {
+    throw new Error(`${field} must be an absolute URL`);
+  }
+  if (!["http:", "https:"].includes(url.protocol)) {
+    throw new Error(`${field} must use http or https`);
+  }
+  if (process.env.NODE_ENV === "production" && url.protocol !== "https:") {
+    throw new Error(`${field} must use https in production`);
+  }
+  if (url.username || url.password) {
+    throw new Error(`${field} must not contain credentials`);
+  }
+  return url.toString();
+}
 function normalizeOptions(options) {
   var _a;
   if (!options.appName.trim()) throw new Error("appName is required");
@@ -263,19 +298,42 @@ function normalizeOptions(options) {
     appName: options.appName.trim(),
     authBasePath,
     allowedRedirectOrigins,
-    defaultRedirectUrl: defaultRedirect.toString()
+    defaultRedirectUrl: defaultRedirect.toString(),
+    logoUrl: brandingUrl(options.logoUrl, "logoUrl"),
+    faviconUrl: brandingUrl(options.faviconUrl, "faviconUrl"),
+    primaryColor: brandingColor(options.primaryColor, "primaryColor")
   });
 }
 var STYLES = `
-*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:#0b0b0b;color:#fff;font-family:system-ui,sans-serif}
-.card{width:100%;max-width:400px;padding:32px;border:1px solid #292929;border-radius:14px;background:#111}.logo{width:38px;height:38px;margin:0 auto 20px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#111;font-weight:700}
-h1{margin:0 0 8px;text-align:center;font-size:22px}.sub{margin:0 0 24px;text-align:center;color:#aaa;font-size:13px;line-height:1.5}.error{display:none;margin-bottom:16px;padding:10px 12px;border-radius:8px;background:#3a1717;color:#ff9a9a;font-size:13px}
-form{margin:0}.field{margin-bottom:14px}label{display:block;margin-bottom:6px;font-size:12px}input{width:100%;padding:11px 13px;border:1px solid #333;border-radius:8px;background:#181818;color:#fff;font-size:15px}
-button{width:100%;margin-top:8px;padding:11px;border:1px solid #333;border-radius:8px;background:#1b1b1b;color:#fff;font-size:14px;cursor:pointer}.primary{border-color:#8c7a6b;background:#8c7a6b}.secondary{color:#bbb}.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:#777;font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#2a2a2a}
-button:disabled{opacity:.55;cursor:not-allowed}.client{margin:20px 0;padding:14px;border:1px solid #2a2a2a;border-radius:9px;background:#181818}.client-name{font-weight:600;word-break:break-all}.scopes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.scope{padding:4px 7px;border:1px solid #333;border-radius:6px;color:#bbb;font-size:12px}.actions{display:flex;gap:8px}.actions button{margin:0}
+html{--brand-primary:#8c7a6b;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:#f4f4f5;color:#171717;font-family:system-ui,sans-serif}
+.card{width:100%;max-width:400px;padding:32px;border:1px solid #e4e4e7;border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}.logo{width:38px;height:38px;margin:0 auto 20px;display:grid;place-items:center;border-radius:50%;background:#171717;color:#fff;font-weight:700}.logo.has-image{background:transparent;border-radius:8px}.logo img{width:38px;height:38px;object-fit:contain;display:block}
+h1{margin:0 0 24px;text-align:center;font-size:22px;font-weight:650}.sub{margin:-12px 0 24px;text-align:center;color:#71717a;font-size:13px;line-height:1.5}.error{display:none;margin-bottom:16px;padding:10px 12px;border-radius:8px;background:#fef2f2;color:#b42318;font-size:13px}
+form{margin:0}.field{margin-bottom:14px}label{display:block;margin-bottom:6px;font-size:12px;color:#52525b}input{width:100%;padding:11px 13px;border:1px solid #d4d4d8;border-radius:8px;background:#fff;color:#171717;font-size:15px}input:focus{outline:2px solid var(--brand-primary);outline-offset:1px;border-color:transparent}
+button{width:100%;margin-top:8px;padding:11px;border:1px solid #d4d4d8;border-radius:8px;background:#fafafa;color:#171717;font-size:14px;font-weight:550;cursor:pointer}button:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}.primary{border-color:var(--brand-primary);background:var(--brand-primary);color:#fff}.secondary{color:#52525b;background:transparent}.social{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#1f1f1f;border-color:#dadce0;font-weight:500}.social:hover{background:#f7f8f8}.social svg{width:18px;height:18px;flex:0 0 18px}
+.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:#a1a1aa;font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#e4e4e7}
+button:disabled{opacity:.55;cursor:not-allowed}.client{margin:20px 0;padding:14px;border:1px solid #e4e4e7;border-radius:9px;background:#fafafa}.client-name{font-weight:600;word-break:break-all}.scopes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.scope{padding:4px 7px;border:1px solid #e4e4e7;border-radius:6px;color:#52525b;font-size:12px}.actions{display:flex;gap:8px}.actions button{margin:0}
 `;
-function page(title, body) {
-  return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>${escapeHtml(title)}</title><style>${STYLES}</style></head><body><main class="card">${body}</main></body></html>`;
+function page(title, body, options) {
+  const favicon = options.faviconUrl ? `<link rel="icon" href="${escapeHtml(options.faviconUrl)}">` : "";
+  const brandColor = options.primaryColor ? `html{--brand-primary:${options.primaryColor}}` : "";
+  return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>${escapeHtml(title)}</title>${favicon}<style>${STYLES}${brandColor}</style></head><body><main class="card">${body}</main></body></html>`;
+}
+function brandMark(options) {
+  var _a;
+  if (options.logoUrl) {
+    return `<div class="logo has-image"><img src="${escapeHtml(options.logoUrl)}" alt="${escapeHtml(options.appName)}"></div>`;
+  }
+  return `<div class="logo">${escapeHtml((_a = options.appName[0]) != null ? _a : "?")}</div>`;
+}
+var SOCIAL_ICONS = {
+  google: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" aria-hidden="true"><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"/><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"/><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"/><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"/></svg>',
+  github: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82A7.7 7.7 0 0 1 8 4.84c.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8"/></svg>',
+  microsoft: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23" aria-hidden="true"><path fill="#f35325" d="M1 1h10v10H1z"/><path fill="#81bc06" d="M12 1h10v10H12z"/><path fill="#05a6f0" d="M1 12h10v10H1z"/><path fill="#ffba08" d="M12 12h10v10H12z"/></svg>'
+};
+function socialButton(method) {
+  var _a;
+  const icon = (_a = SOCIAL_ICONS[method.providerId]) != null ? _a : "";
+  return `<button type="button" class="social" data-provider="${escapeHtml(method.providerId)}">${icon}<span>${escapeHtml(method.label)}</span></button>`;
 }
 function clearLegacyCookies(response, names) {
   for (const name of names != null ? names : []) {
@@ -289,19 +347,17 @@ function clearLegacyCookies(response, names) {
   }
 }
 function loginMarkup(options) {
-  var _a, _b;
+  var _a;
   const emailMethod = options.loginMethods.find(
     (method) => method.type === "email-otp"
   );
   const socialMethods = options.loginMethods.filter(
     (method) => method.type === "social"
   );
-  const email = emailMethod ? `<form id="email-form"><div class="field"><label for="email">Email</label><input id="email" type="email" required autocomplete="email"></div><button class="primary" type="submit">${escapeHtml((_a = emailMethod.label) != null ? _a : "Continue with email")}</button></form><form id="otp-form" hidden><div class="field"><label for="otp">Verification code</label><input id="otp" inputmode="numeric" required autocomplete="one-time-code"></div><button class="primary" type="submit">Sign in</button><button class="secondary" type="button" id="change-email">Use a different email</button></form>` : "";
-  const social = socialMethods.map(
-    (method) => `<button type="button" class="social" data-provider="${escapeHtml(method.providerId)}">${escapeHtml(method.label)}</button>`
-  ).join("");
+  const email = emailMethod ? `<form id="email-form"><div class="field"><label for="email">Email address</label><input id="email" type="email" required autocomplete="email"></div><button class="primary" type="submit">${escapeHtml((_a = emailMethod.label) != null ? _a : "Continue with email")}</button></form><form id="otp-form" hidden><div class="field"><label for="otp">Verification code</label><input id="otp" inputmode="numeric" required autocomplete="one-time-code"></div><button class="primary" type="submit">Sign in</button><button class="secondary" type="button" id="change-email">Use a different email</button></form>` : "";
+  const social = socialMethods.map(socialButton).join("");
   const divider = email && social ? '<div class="divider">or</div>' : "";
-  return `<div class="logo">${escapeHtml((_b = options.appName[0]) != null ? _b : "?")}</div><h1>Sign in to ${escapeHtml(options.appName)}</h1><p class="sub">Use one of the configured sign-in methods.</p><div class="error" id="error"></div>${email}${divider}${social}`;
+  return `${brandMark(options)}<h1>Sign in to ${escapeHtml(options.appName)}</h1><div class="error" id="error" role="alert"></div>${email}${divider}${social}`;
 }
 function loginScript(options, oauth, redirect) {
   const authBasePath = scriptLiteral(options.authBasePath);
@@ -310,7 +366,7 @@ function loginScript(options, oauth, redirect) {
 var authBasePath=${authBasePath};var oauth=${oauth};var oauthQuery=location.search.slice(1);var redirectTarget=${redirectTarget};var errorEl=document.getElementById("error");
 function showError(message){errorEl.textContent=message||"Sign-in failed. Please try again.";errorEl.style.display="block"}function clearError(){errorEl.style.display="none"}
 async function post(path,body){var response=await fetch(authBasePath+path,{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify(body)});var data={};try{data=await response.json()}catch{}if(!response.ok)throw new Error("Sign-in failed. Please try again.");return data}
-function follow(data){var target=oauth?(data.url||data.redirect_uri):redirectTarget;if(!target)throw new Error("Sign-in failed. Please try again.");location.assign(target)}
+function follow(data){var target=data.url||data.redirect_uri||redirectTarget;if(!target)throw new Error("Sign-in failed. Please try again.");location.assign(target)}
 var emailForm=document.getElementById("email-form"),otpForm=document.getElementById("otp-form"),email="";
 if(emailForm){emailForm.addEventListener("submit",async function(event){event.preventDefault();clearError();email=emailForm.querySelector("input").value;try{await post("/email-otp/send-verification-otp",{email:email,type:"sign-in",...(oauth?{oauth_query:oauthQuery}:{})});emailForm.hidden=true;otpForm.hidden=false}catch(error){showError(error.message)}});otpForm.addEventListener("submit",async function(event){event.preventDefault();clearError();try{var data=await post("/sign-in/email-otp",{email:email,otp:document.getElementById("otp").value,name:email.split("@")[0],...(oauth?{oauth_query:oauthQuery}:{})});follow(data)}catch(error){showError(error.message)}});document.getElementById("change-email").addEventListener("click",function(){otpForm.hidden=true;emailForm.hidden=false;clearError()})}
 document.querySelectorAll("button.social").forEach(function(button){button.addEventListener("click",async function(){clearError();button.disabled=true;try{var body={provider:button.dataset.provider,...(oauth?{oauth_query:oauthQuery}:{callbackURL:redirectTarget,errorCallbackURL:location.href})};follow(await post("/sign-in/social",body))}catch(error){showError(error.message);button.disabled=false}})});
@@ -335,7 +391,8 @@ function createOAuthPagesRouter(rawOptions) {
     response.type("html").send(
       page(
         `Sign in to ${options.appName}`,
-        loginMarkup(options) + loginScript(options, false, redirect)
+        loginMarkup(options) + loginScript(options, false, redirect),
+        options
       )
     );
   });
@@ -345,19 +402,19 @@ function createOAuthPagesRouter(rawOptions) {
     response.type("html").send(
       page(
         `Sign in to ${options.appName}`,
-        loginMarkup(options) + loginScript(options, true)
+        loginMarkup(options) + loginScript(options, true),
+        options
       )
     );
   });
   router.get("/oauth/consent", (request, response) => {
-    var _a;
     frameProtection(response);
     const clientId = typeof request.query.client_id === "string" ? request.query.client_id : "OAuth client";
     const scope = typeof request.query.scope === "string" ? request.query.scope : "";
     const scopes = scope.split(/\s+/).filter(Boolean);
     const badges = scopes.map((item) => `<span class="scope">${escapeHtml(item)}</span>`).join("");
-    const body = `<div class="logo">${escapeHtml((_a = options.appName[0]) != null ? _a : "?")}</div><h1>Authorize ${escapeHtml(options.appName)} access</h1><p class="sub">Review the client and requested scopes.</p><div class="error" id="error"></div><div class="client"><div class="client-name">${escapeHtml(clientId)}</div>${badges ? `<div class="scopes">${badges}</div>` : ""}</div><div class="actions"><button class="primary" id="allow" type="button">Allow</button><button id="deny" type="button">Deny</button></div><script>(function(){var authBasePath=${scriptLiteral(options.authBasePath)},oauthQuery=location.search.slice(1),errorEl=document.getElementById("error"),buttons=[document.getElementById("allow"),document.getElementById("deny")];async function decide(accept){buttons.forEach(function(button){button.disabled=true});errorEl.style.display="none";try{var response=await fetch(authBasePath+"/oauth2/consent",{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify({accept:accept,oauth_query:oauthQuery})});var data={};try{data=await response.json()}catch{}var target=data.url||data.redirect_uri;if(!response.ok||!target)throw new Error();location.assign(target)}catch{errorEl.textContent="Could not complete authorization.";errorEl.style.display="block";buttons.forEach(function(button){button.disabled=false})}}buttons[0].addEventListener("click",function(){decide(true)});buttons[1].addEventListener("click",function(){decide(false)})})();</script>`;
-    response.type("html").send(page(`Authorize ${options.appName} access`, body));
+    const body = `${brandMark(options)}<h1>Authorize ${escapeHtml(options.appName)} access</h1><p class="sub">Review the client and requested scopes.</p><div class="error" id="error"></div><div class="client"><div class="client-name">${escapeHtml(clientId)}</div>${badges ? `<div class="scopes">${badges}</div>` : ""}</div><div class="actions"><button class="primary" id="allow" type="button">Allow</button><button id="deny" type="button">Deny</button></div><script>(function(){var authBasePath=${scriptLiteral(options.authBasePath)},oauthQuery=location.search.slice(1),errorEl=document.getElementById("error"),buttons=[document.getElementById("allow"),document.getElementById("deny")];async function decide(accept){buttons.forEach(function(button){button.disabled=true});errorEl.style.display="none";try{var response=await fetch(authBasePath+"/oauth2/consent",{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify({accept:accept,oauth_query:oauthQuery})});var data={};try{data=await response.json()}catch{}var target=data.url||data.redirect_uri;if(!response.ok||!target)throw new Error();location.assign(target)}catch{errorEl.textContent="Could not complete authorization.";errorEl.style.display="block";buttons.forEach(function(button){button.disabled=false})}}buttons[0].addEventListener("click",function(){decide(true)});buttons[1].addEventListener("click",function(){decide(false)})})();</script>`;
+    response.type("html").send(page(`Authorize ${options.appName} access`, body, options));
   });
   return router;
 }

package/dist/express.mjs

@@ -106,6 +106,41 @@ function absoluteOrigin(value, field) {
   }
   return url.origin;
 }
+var HEX_COLOR = /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;
+var OKLCH_COLOR = /^oklch\([0-9.%\s/,+-]+\)$/i;
+function brandingColor(value, field) {
+  if (value === void 0) return void 0;
+  const color = value.trim();
+  if (HEX_COLOR.test(color) || OKLCH_COLOR.test(color)) return color;
+  throw new Error(`${field} must be a hex or oklch() color`);
+}
+function brandingUrl(value, field) {
+  if (value === void 0) return void 0;
+  const raw = value.trim();
+  if (!raw) throw new Error(`${field} must be a URL`);
+  if (raw.startsWith("/") && !raw.startsWith("//")) {
+    if (/\s/.test(raw) || raw.includes("\\") || raw.includes("<")) {
+      throw new Error(`${field} must be a safe URL`);
+    }
+    return raw;
+  }
+  let url;
+  try {
+    url = new URL(raw);
+  } catch (e) {
+    throw new Error(`${field} must be an absolute URL`);
+  }
+  if (!["http:", "https:"].includes(url.protocol)) {
+    throw new Error(`${field} must use http or https`);
+  }
+  if (process.env.NODE_ENV === "production" && url.protocol !== "https:") {
+    throw new Error(`${field} must use https in production`);
+  }
+  if (url.username || url.password) {
+    throw new Error(`${field} must not contain credentials`);
+  }
+  return url.toString();
+}
 function normalizeOptions(options) {
   var _a;
   if (!options.appName.trim()) throw new Error("appName is required");
@@ -160,19 +195,42 @@ function normalizeOptions(options) {
     appName: options.appName.trim(),
     authBasePath,
     allowedRedirectOrigins,
-    defaultRedirectUrl: defaultRedirect.toString()
+    defaultRedirectUrl: defaultRedirect.toString(),
+    logoUrl: brandingUrl(options.logoUrl, "logoUrl"),
+    faviconUrl: brandingUrl(options.faviconUrl, "faviconUrl"),
+    primaryColor: brandingColor(options.primaryColor, "primaryColor")
   });
 }
 var STYLES = `
-*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:#0b0b0b;color:#fff;font-family:system-ui,sans-serif}
-.card{width:100%;max-width:400px;padding:32px;border:1px solid #292929;border-radius:14px;background:#111}.logo{width:38px;height:38px;margin:0 auto 20px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#111;font-weight:700}
-h1{margin:0 0 8px;text-align:center;font-size:22px}.sub{margin:0 0 24px;text-align:center;color:#aaa;font-size:13px;line-height:1.5}.error{display:none;margin-bottom:16px;padding:10px 12px;border-radius:8px;background:#3a1717;color:#ff9a9a;font-size:13px}
-form{margin:0}.field{margin-bottom:14px}label{display:block;margin-bottom:6px;font-size:12px}input{width:100%;padding:11px 13px;border:1px solid #333;border-radius:8px;background:#181818;color:#fff;font-size:15px}
-button{width:100%;margin-top:8px;padding:11px;border:1px solid #333;border-radius:8px;background:#1b1b1b;color:#fff;font-size:14px;cursor:pointer}.primary{border-color:#8c7a6b;background:#8c7a6b}.secondary{color:#bbb}.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:#777;font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#2a2a2a}
-button:disabled{opacity:.55;cursor:not-allowed}.client{margin:20px 0;padding:14px;border:1px solid #2a2a2a;border-radius:9px;background:#181818}.client-name{font-weight:600;word-break:break-all}.scopes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.scope{padding:4px 7px;border:1px solid #333;border-radius:6px;color:#bbb;font-size:12px}.actions{display:flex;gap:8px}.actions button{margin:0}
+html{--brand-primary:#8c7a6b;color-scheme:light}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:grid;place-items:center;padding:24px;background:#f4f4f5;color:#171717;font-family:system-ui,sans-serif}
+.card{width:100%;max-width:400px;padding:32px;border:1px solid #e4e4e7;border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.04)}.logo{width:38px;height:38px;margin:0 auto 20px;display:grid;place-items:center;border-radius:50%;background:#171717;color:#fff;font-weight:700}.logo.has-image{background:transparent;border-radius:8px}.logo img{width:38px;height:38px;object-fit:contain;display:block}
+h1{margin:0 0 24px;text-align:center;font-size:22px;font-weight:650}.sub{margin:-12px 0 24px;text-align:center;color:#71717a;font-size:13px;line-height:1.5}.error{display:none;margin-bottom:16px;padding:10px 12px;border-radius:8px;background:#fef2f2;color:#b42318;font-size:13px}
+form{margin:0}.field{margin-bottom:14px}label{display:block;margin-bottom:6px;font-size:12px;color:#52525b}input{width:100%;padding:11px 13px;border:1px solid #d4d4d8;border-radius:8px;background:#fff;color:#171717;font-size:15px}input:focus{outline:2px solid var(--brand-primary);outline-offset:1px;border-color:transparent}
+button{width:100%;margin-top:8px;padding:11px;border:1px solid #d4d4d8;border-radius:8px;background:#fafafa;color:#171717;font-size:14px;font-weight:550;cursor:pointer}button:focus-visible{outline:2px solid var(--brand-primary);outline-offset:2px}.primary{border-color:var(--brand-primary);background:var(--brand-primary);color:#fff}.secondary{color:#52525b;background:transparent}.social{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#fff;color:#1f1f1f;border-color:#dadce0;font-weight:500}.social:hover{background:#f7f8f8}.social svg{width:18px;height:18px;flex:0 0 18px}
+.divider{display:flex;align-items:center;gap:10px;margin:18px 0;color:#a1a1aa;font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#e4e4e7}
+button:disabled{opacity:.55;cursor:not-allowed}.client{margin:20px 0;padding:14px;border:1px solid #e4e4e7;border-radius:9px;background:#fafafa}.client-name{font-weight:600;word-break:break-all}.scopes{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.scope{padding:4px 7px;border:1px solid #e4e4e7;border-radius:6px;color:#52525b;font-size:12px}.actions{display:flex;gap:8px}.actions button{margin:0}
 `;
-function page(title, body) {
-  return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>${escapeHtml(title)}</title><style>${STYLES}</style></head><body><main class="card">${body}</main></body></html>`;
+function page(title, body, options) {
+  const favicon = options.faviconUrl ? `<link rel="icon" href="${escapeHtml(options.faviconUrl)}">` : "";
+  const brandColor = options.primaryColor ? `html{--brand-primary:${options.primaryColor}}` : "";
+  return `<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>${escapeHtml(title)}</title>${favicon}<style>${STYLES}${brandColor}</style></head><body><main class="card">${body}</main></body></html>`;
+}
+function brandMark(options) {
+  var _a;
+  if (options.logoUrl) {
+    return `<div class="logo has-image"><img src="${escapeHtml(options.logoUrl)}" alt="${escapeHtml(options.appName)}"></div>`;
+  }
+  return `<div class="logo">${escapeHtml((_a = options.appName[0]) != null ? _a : "?")}</div>`;
+}
+var SOCIAL_ICONS = {
+  google: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" aria-hidden="true"><path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"/><path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"/><path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"/><path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"/></svg>',
+  github: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82A7.7 7.7 0 0 1 8 4.84c.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8"/></svg>',
+  microsoft: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23 23" aria-hidden="true"><path fill="#f35325" d="M1 1h10v10H1z"/><path fill="#81bc06" d="M12 1h10v10H12z"/><path fill="#05a6f0" d="M1 12h10v10H1z"/><path fill="#ffba08" d="M12 12h10v10H12z"/></svg>'
+};
+function socialButton(method) {
+  var _a;
+  const icon = (_a = SOCIAL_ICONS[method.providerId]) != null ? _a : "";
+  return `<button type="button" class="social" data-provider="${escapeHtml(method.providerId)}">${icon}<span>${escapeHtml(method.label)}</span></button>`;
 }
 function clearLegacyCookies(response, names) {
   for (const name of names != null ? names : []) {
@@ -186,19 +244,17 @@ function clearLegacyCookies(response, names) {
   }
 }
 function loginMarkup(options) {
-  var _a, _b;
+  var _a;
   const emailMethod = options.loginMethods.find(
     (method) => method.type === "email-otp"
   );
   const socialMethods = options.loginMethods.filter(
     (method) => method.type === "social"
   );
-  const email = emailMethod ? `<form id="email-form"><div class="field"><label for="email">Email</label><input id="email" type="email" required autocomplete="email"></div><button class="primary" type="submit">${escapeHtml((_a = emailMethod.label) != null ? _a : "Continue with email")}</button></form><form id="otp-form" hidden><div class="field"><label for="otp">Verification code</label><input id="otp" inputmode="numeric" required autocomplete="one-time-code"></div><button class="primary" type="submit">Sign in</button><button class="secondary" type="button" id="change-email">Use a different email</button></form>` : "";
-  const social = socialMethods.map(
-    (method) => `<button type="button" class="social" data-provider="${escapeHtml(method.providerId)}">${escapeHtml(method.label)}</button>`
-  ).join("");
+  const email = emailMethod ? `<form id="email-form"><div class="field"><label for="email">Email address</label><input id="email" type="email" required autocomplete="email"></div><button class="primary" type="submit">${escapeHtml((_a = emailMethod.label) != null ? _a : "Continue with email")}</button></form><form id="otp-form" hidden><div class="field"><label for="otp">Verification code</label><input id="otp" inputmode="numeric" required autocomplete="one-time-code"></div><button class="primary" type="submit">Sign in</button><button class="secondary" type="button" id="change-email">Use a different email</button></form>` : "";
+  const social = socialMethods.map(socialButton).join("");
   const divider = email && social ? '<div class="divider">or</div>' : "";
-  return `<div class="logo">${escapeHtml((_b = options.appName[0]) != null ? _b : "?")}</div><h1>Sign in to ${escapeHtml(options.appName)}</h1><p class="sub">Use one of the configured sign-in methods.</p><div class="error" id="error"></div>${email}${divider}${social}`;
+  return `${brandMark(options)}<h1>Sign in to ${escapeHtml(options.appName)}</h1><div class="error" id="error" role="alert"></div>${email}${divider}${social}`;
 }
 function loginScript(options, oauth, redirect) {
   const authBasePath = scriptLiteral(options.authBasePath);
@@ -207,7 +263,7 @@ function loginScript(options, oauth, redirect) {
 var authBasePath=${authBasePath};var oauth=${oauth};var oauthQuery=location.search.slice(1);var redirectTarget=${redirectTarget};var errorEl=document.getElementById("error");
 function showError(message){errorEl.textContent=message||"Sign-in failed. Please try again.";errorEl.style.display="block"}function clearError(){errorEl.style.display="none"}
 async function post(path,body){var response=await fetch(authBasePath+path,{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify(body)});var data={};try{data=await response.json()}catch{}if(!response.ok)throw new Error("Sign-in failed. Please try again.");return data}
-function follow(data){var target=oauth?(data.url||data.redirect_uri):redirectTarget;if(!target)throw new Error("Sign-in failed. Please try again.");location.assign(target)}
+function follow(data){var target=data.url||data.redirect_uri||redirectTarget;if(!target)throw new Error("Sign-in failed. Please try again.");location.assign(target)}
 var emailForm=document.getElementById("email-form"),otpForm=document.getElementById("otp-form"),email="";
 if(emailForm){emailForm.addEventListener("submit",async function(event){event.preventDefault();clearError();email=emailForm.querySelector("input").value;try{await post("/email-otp/send-verification-otp",{email:email,type:"sign-in",...(oauth?{oauth_query:oauthQuery}:{})});emailForm.hidden=true;otpForm.hidden=false}catch(error){showError(error.message)}});otpForm.addEventListener("submit",async function(event){event.preventDefault();clearError();try{var data=await post("/sign-in/email-otp",{email:email,otp:document.getElementById("otp").value,name:email.split("@")[0],...(oauth?{oauth_query:oauthQuery}:{})});follow(data)}catch(error){showError(error.message)}});document.getElementById("change-email").addEventListener("click",function(){otpForm.hidden=true;emailForm.hidden=false;clearError()})}
 document.querySelectorAll("button.social").forEach(function(button){button.addEventListener("click",async function(){clearError();button.disabled=true;try{var body={provider:button.dataset.provider,...(oauth?{oauth_query:oauthQuery}:{callbackURL:redirectTarget,errorCallbackURL:location.href})};follow(await post("/sign-in/social",body))}catch(error){showError(error.message);button.disabled=false}})});
@@ -232,7 +288,8 @@ function createOAuthPagesRouter(rawOptions) {
     response.type("html").send(
       page(
         `Sign in to ${options.appName}`,
-        loginMarkup(options) + loginScript(options, false, redirect)
+        loginMarkup(options) + loginScript(options, false, redirect),
+        options
       )
     );
   });
@@ -242,19 +299,19 @@ function createOAuthPagesRouter(rawOptions) {
     response.type("html").send(
       page(
         `Sign in to ${options.appName}`,
-        loginMarkup(options) + loginScript(options, true)
+        loginMarkup(options) + loginScript(options, true),
+        options
       )
     );
   });
   router.get("/oauth/consent", (request, response) => {
-    var _a;
     frameProtection(response);
     const clientId = typeof request.query.client_id === "string" ? request.query.client_id : "OAuth client";
     const scope = typeof request.query.scope === "string" ? request.query.scope : "";
     const scopes = scope.split(/\s+/).filter(Boolean);
     const badges = scopes.map((item) => `<span class="scope">${escapeHtml(item)}</span>`).join("");
-    const body = `<div class="logo">${escapeHtml((_a = options.appName[0]) != null ? _a : "?")}</div><h1>Authorize ${escapeHtml(options.appName)} access</h1><p class="sub">Review the client and requested scopes.</p><div class="error" id="error"></div><div class="client"><div class="client-name">${escapeHtml(clientId)}</div>${badges ? `<div class="scopes">${badges}</div>` : ""}</div><div class="actions"><button class="primary" id="allow" type="button">Allow</button><button id="deny" type="button">Deny</button></div><script>(function(){var authBasePath=${scriptLiteral(options.authBasePath)},oauthQuery=location.search.slice(1),errorEl=document.getElementById("error"),buttons=[document.getElementById("allow"),document.getElementById("deny")];async function decide(accept){buttons.forEach(function(button){button.disabled=true});errorEl.style.display="none";try{var response=await fetch(authBasePath+"/oauth2/consent",{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify({accept:accept,oauth_query:oauthQuery})});var data={};try{data=await response.json()}catch{}var target=data.url||data.redirect_uri;if(!response.ok||!target)throw new Error();location.assign(target)}catch{errorEl.textContent="Could not complete authorization.";errorEl.style.display="block";buttons.forEach(function(button){button.disabled=false})}}buttons[0].addEventListener("click",function(){decide(true)});buttons[1].addEventListener("click",function(){decide(false)})})();</script>`;
-    response.type("html").send(page(`Authorize ${options.appName} access`, body));
+    const body = `${brandMark(options)}<h1>Authorize ${escapeHtml(options.appName)} access</h1><p class="sub">Review the client and requested scopes.</p><div class="error" id="error"></div><div class="client"><div class="client-name">${escapeHtml(clientId)}</div>${badges ? `<div class="scopes">${badges}</div>` : ""}</div><div class="actions"><button class="primary" id="allow" type="button">Allow</button><button id="deny" type="button">Deny</button></div><script>(function(){var authBasePath=${scriptLiteral(options.authBasePath)},oauthQuery=location.search.slice(1),errorEl=document.getElementById("error"),buttons=[document.getElementById("allow"),document.getElementById("deny")];async function decide(accept){buttons.forEach(function(button){button.disabled=true});errorEl.style.display="none";try{var response=await fetch(authBasePath+"/oauth2/consent",{method:"POST",headers:{"content-type":"application/json",accept:"application/json"},body:JSON.stringify({accept:accept,oauth_query:oauthQuery})});var data={};try{data=await response.json()}catch{}var target=data.url||data.redirect_uri;if(!response.ok||!target)throw new Error();location.assign(target)}catch{errorEl.textContent="Could not complete authorization.";errorEl.style.display="block";buttons.forEach(function(button){button.disabled=false})}}buttons[0].addEventListener("click",function(){decide(true)});buttons[1].addEventListener("click",function(){decide(false)})})();</script>`;
+    response.type("html").send(page(`Authorize ${options.appName} access`, body, options));
   });
   return router;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@codelitdev/oauth-server-kit",
-    "version": "0.1.0-alpha.0",
+    "version": "0.1.0-alpha.1",
     "description": "Lean Better Auth OAuth authentication framework for web, mobile, REST, and MCP surfaces.",
     "author": "CodeLit",
     "license": "MIT",
@@ -66,17 +66,17 @@
         "format:check": "prettier --check src test docs *.md *.json",
         "quality": "pnpm format:check && pnpm lint && pnpm check-types",
         "prepare": "husky",
-        "release:alpha": "pnpm quality && pnpm test:coverage && pnpm build && npm publish --tag alpha"
+        "release:alpha": "pnpm quality && pnpm test:coverage && pnpm build && pnpm publish --tag alpha --access public --no-git-checks"
+    },
+    "publishConfig": {
+        "access": "public",
+        "tag": "alpha"
     },
     "peerDependencies": {
         "@better-auth/oauth-provider": "^1.6.23",
         "better-auth": "^1.6.23",
         "express": "^4.21.2"
     },
-    "publishConfig": {
-        "access": "public",
-        "tag": "alpha"
-    },
     "devDependencies": {
         "@better-auth/oauth-provider": "^1.6.23",
         "@types/express": "^4.17.20",

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2026 CodeLit
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.