@draftlab/auth 0.0.1

package/dist/adapters/node.d.ts

@@ -0,0 +1,18 @@
+import { IncomingMessage, ServerResponse } from "node:http";
+
+//#region src/adapters/node.d.ts
+
+/**
+ * Converts Node.js IncomingMessage to Web Standards Request
+ */
+declare const nodeRequestAdapter: (req: IncomingMessage) => Request;
+/**
+ * Writes Web Standards Response to Node.js ServerResponse
+ */
+declare const nodeResponseAdapter: (response: Response, res: ServerResponse) => Promise<void>;
+/**
+ * Creates a Node.js HTTP handler from a Web Standards fetch function
+ */
+declare const createNodeHandler: (fetchHandler: (request: Request) => Promise<Response>) => ((req: IncomingMessage, res: ServerResponse) => void);
+//#endregion
+export { createNodeHandler, nodeRequestAdapter, nodeResponseAdapter };

package/dist/adapters/node.js

@@ -0,0 +1,71 @@
+import { Readable } from "node:stream";
+
+//#region src/adapters/node.ts
+/**
+* Converts Node.js IncomingMessage to Web Standards Request
+*/
+const nodeRequestAdapter = (req) => {
+	const host = req.headers.host || "localhost";
+	const sanitizedHost = host.split(",")[0]?.trim();
+	const url = new URL(req.url || "/", `http://${sanitizedHost}`);
+	const headers = new Headers();
+	for (const [key, value] of Object.entries(req.headers)) if (value !== void 0) if (Array.isArray(value)) for (const v of value) headers.append(key, v);
+	else headers.set(key, value);
+	let body;
+	if (req.method !== "GET" && req.method !== "HEAD") body = Readable.toWeb(req);
+	return new Request(url.toString(), {
+		method: req.method || "GET",
+		headers,
+		body,
+		duplex: "half"
+	});
+};
+/**
+* Writes Web Standards Response to Node.js ServerResponse
+*/
+const nodeResponseAdapter = async (response, res) => {
+	res.statusCode = response.status;
+	res.statusMessage = response.statusText;
+	response.headers.forEach((value, key) => {
+		res.setHeader(key, value);
+	});
+	if (response.body) {
+		const reader = response.body.getReader();
+		try {
+			while (true) {
+				const { done, value } = await reader.read();
+				if (done) break;
+				if (!res.write(value)) await new Promise((resolve) => res.once("drain", resolve));
+			}
+		} finally {
+			reader.releaseLock();
+		}
+	}
+	res.end();
+};
+/**
+* Creates a Node.js HTTP handler from a Web Standards fetch function
+*/
+const createNodeHandler = (fetchHandler) => {
+	return (req, res) => {
+		try {
+			const request = nodeRequestAdapter(req);
+			fetchHandler(request).then((response) => nodeResponseAdapter(response, res)).catch((error) => {
+				console.error("Handler error:", error instanceof Error ? error.message : "Unknown error");
+				if (!res.headersSent) {
+					res.statusCode = 500;
+					res.end("Internal Server Error");
+				}
+			});
+		} catch (error) {
+			console.error("Request adapter error:", error instanceof Error ? error.message : "Unknown error");
+			if (!res.headersSent) {
+				res.statusCode = 400;
+				res.end("Bad Request");
+			}
+		}
+	};
+};
+
+//#endregion
+export { createNodeHandler, nodeRequestAdapter, nodeResponseAdapter };

package/dist/allow-CixonwTW.d.ts

@@ -0,0 +1,59 @@
+//#region src/allow.d.ts
+/**
+ * Client authorization validation utilities.
+ * Provides security checks to determine if OAuth authorization requests should be permitted
+ * based on redirect URI validation and domain matching policies.
+ */
+/**
+ * Input parameters for authorization allow checks.
+ * Contains all necessary information to validate if a client request should be permitted.
+ */
+interface AllowCheckInput {
+  /** The client ID of the application requesting authorization */
+  readonly clientID: string;
+  /** The redirect URI where the user will be sent after authorization */
+  readonly redirectURI: string;
+  /** Optional audience parameter for the authorization request */
+  readonly audience?: string;
+}
+/**
+ * Default authorization check that validates client requests based on redirect URI security.
+ *
+ * ## Security Policy
+ * - **Localhost**: Always allowed (for development)
+ * - **Same domain**: Redirect URI must match request origin at TLD+1 level
+ * - **Cross-domain**: Rejected for security
+ *
+ * This prevents unauthorized applications from hijacking authorization codes by using
+ * malicious redirect URIs that don't belong to the legitimate client application.
+ *
+ * @param input - Client request details including ID and redirect URI
+ * @param req - The original HTTP request for domain comparison
+ * @returns Promise resolving to true if the request should be allowed
+ *
+ * @example
+ * ```ts
+ * // Allowed: localhost development
+ * await defaultAllowCheck({
+ *   clientID: "dev-app",
+ *   redirectURI: "http://localhost:3000/callback"
+ * }, request) // → true
+ *
+ * // Allowed: same domain
+ * // Request from: https://myapp.com
+ * await defaultAllowCheck({
+ *   clientID: "web-app",
+ *   redirectURI: "https://auth.myapp.com/callback"
+ * }, request) // → true
+ *
+ * // Rejected: different domain
+ * // Request from: https://myapp.com
+ * await defaultAllowCheck({
+ *   clientID: "malicious-app",
+ *   redirectURI: "https://evil.com/steal-codes"
+ * }, request) // → false
+ * ```
+ */
+declare const defaultAllowCheck: (input: AllowCheckInput, req: Request) => Promise<boolean>;
+//#endregion
+export { AllowCheckInput, defaultAllowCheck };

package/dist/allow-DX5cehSc.js

@@ -0,0 +1,63 @@
+import { isDomainMatch } from "./util-CSdHUFOo.js";
+
+//#region src/allow.ts
+/**
+* Default authorization check that validates client requests based on redirect URI security.
+*
+* ## Security Policy
+* - **Localhost**: Always allowed (for development)
+* - **Same domain**: Redirect URI must match request origin at TLD+1 level
+* - **Cross-domain**: Rejected for security
+*
+* This prevents unauthorized applications from hijacking authorization codes by using
+* malicious redirect URIs that don't belong to the legitimate client application.
+*
+* @param input - Client request details including ID and redirect URI
+* @param req - The original HTTP request for domain comparison
+* @returns Promise resolving to true if the request should be allowed
+*
+* @example
+* ```ts
+* // Allowed: localhost development
+* await defaultAllowCheck({
+*   clientID: "dev-app",
+*   redirectURI: "http://localhost:3000/callback"
+* }, request) // → true
+*
+* // Allowed: same domain
+* // Request from: https://myapp.com
+* await defaultAllowCheck({
+*   clientID: "web-app",
+*   redirectURI: "https://auth.myapp.com/callback"
+* }, request) // → true
+*
+* // Rejected: different domain
+* // Request from: https://myapp.com
+* await defaultAllowCheck({
+*   clientID: "malicious-app",
+*   redirectURI: "https://evil.com/steal-codes"
+* }, request) // → false
+* ```
+*/
+const defaultAllowCheck = (input, req) => {
+	return Promise.resolve((() => {
+		let redirectHostname;
+		try {
+			redirectHostname = new URL(input.redirectURI).hostname;
+		} catch {
+			return false;
+		}
+		if (redirectHostname === "localhost" || redirectHostname === "127.0.0.1") return true;
+		let currentHostname;
+		try {
+			const forwardedHost = req.headers.get("x-forwarded-host");
+			currentHostname = forwardedHost ? new URL(`https://${forwardedHost}`).hostname : new URL(req.url).hostname;
+		} catch {
+			return false;
+		}
+		return isDomainMatch(redirectHostname, currentHostname);
+	})());
+};
+
+//#endregion
+export { defaultAllowCheck };

package/dist/allow.d.ts

@@ -0,0 +1,2 @@
+import { AllowCheckInput, defaultAllowCheck } from "./allow-CixonwTW.js";
+export { AllowCheckInput, defaultAllowCheck };

package/dist/allow.js

@@ -0,0 +1,4 @@
+import "./util-CSdHUFOo.js";
+import { defaultAllowCheck } from "./allow-DX5cehSc.js";
+
+export { defaultAllowCheck };

package/dist/base-DRutbxgL.js

@@ -0,0 +1,422 @@
+import { getTheme } from "./theme-CswaLtbW.js";
+
+//#region src/ui/base.ts
+const css = `@import url("https://unpkg.com/tailwindcss@3.4.15/src/css/preflight.css");
+
+:root {
+	--color-background-dark: #0e0e11;
+	--color-background-light: #ffffff;
+	--color-primary-dark: #6772e5;
+	--color-primary-light: #6772e5;
+
+	--color-background-success-dark: oklch(0.3 0.04 172);
+	--color-background-success-light: oklch(
+		from var(--color-background-success-dark) 0.83 c h
+	);
+	--color-success-dark: oklch(
+		from var(--color-background-success-dark) 0.92 c h
+	);
+	--color-success-light: oklch(
+		from var(--color-background-success-dark) 0.25 c h
+	);
+
+	--color-background-error-dark: oklch(0.32 0.07 15);
+	--color-background-error-light: oklch(
+		from var(--color-background-error-dark) 0.92 c h
+	);
+	--color-error-dark: oklch(from var(--color-background-error-dark) 0.92 c h);
+	--color-error-light: oklch(from var(--color-background-error-dark) 0.25 c h);
+
+	--border-radius: 0;
+
+	--color-background: var(--color-background-dark);
+	--color-primary: var(--color-primary-dark);
+
+	--color-background-success: var(--color-background-success-dark);
+	--color-success: var(--color-success-dark);
+	--color-background-error: var(--color-background-error-dark);
+	--color-error: var(--color-error-dark);
+
+	@media (prefers-color-scheme: light) {
+		--color-background: var(--color-background-light);
+		--color-primary: var(--color-primary-light);
+
+		--color-background-success: var(--color-background-success-light);
+		--color-success: var(--color-success-light);
+		--color-background-error: var(--color-background-error-light);
+		--color-error: var(--color-error-light);
+	}
+
+	--color-high: oklch(
+		from var(--color-background) clamp(0, calc((l - 0.714) * -1000), 1) 0 0
+	);
+	--color-low: oklch(
+		from var(--color-background) clamp(0, calc((l - 0.714) * 1000), 1) 0 0
+	);
+	--lightness-high: color-mix(
+		in oklch,
+		var(--color-high) 0%,
+		oklch(var(--color-high) 0 0)
+	);
+	--lightness-low: color-mix(
+		in oklch,
+		var(--color-low) 0%,
+		oklch(var(--color-low) 0 0)
+	);
+	--font-family:
+		ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
+		"Segoe UI Symbol", "Noto Color Emoji";
+	--font-scale: 1;
+
+	--font-size-xs: calc(0.75rem * var(--font-scale));
+	--font-size-sm: calc(0.875rem * var(--font-scale));
+	--font-size-md: calc(1rem * var(--font-scale));
+	--font-size-lg: calc(1.125rem * var(--font-scale));
+	--font-size-xl: calc(1.25rem * var(--font-scale));
+	--font-size-2xl: calc(1.5rem * var(--font-scale));
+}
+
+[data-component="root"] {
+	font-family: var(--font-family);
+	background-color: var(--color-background);
+	padding: 1rem;
+	color: white;
+	position: absolute;
+	inset: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-direction: column;
+	user-select: none;
+	color: var(--color-high);
+}
+
+[data-component="center"] {
+	width: 380px;
+	display: flex;
+	flex-direction: column;
+	gap: 1.5rem;
+}
+
+[data-component="center"][data-size="small"] {
+	width: 300px;
+}
+
+[data-component="link"] {
+	text-decoration: underline;
+	text-underline-offset: 0.125rem;
+	font-weight: 600;
+}
+
+[data-component="label"] {
+	display: flex;
+	gap: 0.75rem;
+	flex-direction: column;
+	font-size: var(--font-size-xs);
+}
+
+[data-component="logo"] {
+	margin: 0 auto;
+	height: 2.5rem;
+	width: auto;
+	display: none;
+}
+
+@media (prefers-color-scheme: light) {
+	[data-component="logo"][data-mode="light"] {
+		display: block;
+	}
+}
+
+@media (prefers-color-scheme: dark) {
+	[data-component="logo"][data-mode="dark"] {
+		display: block;
+	}
+}
+
+[data-component="logo-default"] {
+	margin: 0 auto;
+	height: 2.5rem;
+	width: auto;
+}
+
+@media (prefers-color-scheme: light) {
+	[data-component="logo-default"] {
+		color: var(--color-high);
+	}
+}
+
+@media (prefers-color-scheme: dark) {
+	[data-component="logo-default"] {
+		color: var(--color-high);
+	}
+}
+
+[data-component="input"] {
+	width: 100%;
+	height: 2.5rem;
+	padding: 0 1rem;
+	border: 1px solid transparent;
+	--background: oklch(
+		from var(--color-background)
+			calc(l + (-0.06 * clamp(0, calc((l - 0.714) * 1000), 1) + 0.03)) c h
+	);
+	background: var(--background);
+	border-color: oklch(
+		from var(--color-background)
+			calc(
+				clamp(
+					0.22,
+					l +
+					(-0.12 * clamp(0, calc((l - 0.714) * 1000), 1) + 0.06),
+					0.88
+				)
+			)
+			c h
+	);
+	border-radius: calc(var(--border-radius) * 0.25rem);
+	font-size: var(--font-size-sm);
+	outline: none;
+}
+
+[data-component="input"]:focus {
+	border-color: oklch(
+		from var(--color-background)
+			calc(
+				clamp(
+					0.3,
+					l +
+					(-0.2 * clamp(0, calc((l - 0.714) * 1000), 1) + 0.1),
+					0.7
+				)
+			)
+			c h
+	);
+}
+
+[data-component="input"]:user-invalid:not(:focus) {
+	border-color: oklch(0.4 0.09 7.91);
+}
+
+[data-component="button"] {
+	height: 2.5rem;
+	cursor: pointer;
+	border: 0;
+	font-weight: 500;
+	font-size: var(--font-size-sm);
+	border-radius: calc(var(--border-radius) * 0.25rem);
+	display: flex;
+	gap: 0.75rem;
+	align-items: center;
+	justify-content: center;
+	background: var(--color-primary);
+	color: oklch(
+		from var(--color-primary) clamp(0, calc((l - 0.714) * -1000), 1) 0 0
+	);
+}
+
+[data-component="button"][data-color="ghost"] {
+	background: transparent;
+	color: var(--color-high);
+	border: 1px solid
+		oklch(
+			from var(--color-background)
+				calc(
+					clamp(
+						0.22,
+						l +
+						(-0.12 * clamp(0, calc((l - 0.714) * 1000), 1) + 0.06),
+						0.88
+					)
+				)
+				c h
+		);
+}
+
+[data-component="button"] [data-slot="icon"] {
+	width: 16px;
+	height: 16px;
+}
+
+[data-component="button"] [data-slot="icon"] svg {
+	width: 100%;
+	height: 100%;
+}
+
+[data-component="form"] {
+	max-width: 100%;
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	margin: 0;
+}
+
+[data-component="form-alert"] {
+	height: 2.5rem;
+	display: flex;
+	align-items: center;
+	padding: 0 1rem;
+	border-radius: calc(var(--border-radius) * 0.25rem);
+	background: var(--color-background-error);
+	color: var(--color-error);
+	text-align: left;
+	font-size: 0.75rem;
+	gap: 0.5rem;
+}
+
+[data-component="form-alert"][data-color="success"] {
+	background: var(--color-background-success);
+	color: var(--color-success);
+}
+
+[data-component="form-alert"][data-color="success"] [data-slot="icon-success"] {
+	display: block;
+}
+[data-component="form-alert"][data-color="success"] [data-slot="icon-danger"] {
+	display: none;
+}
+
+[data-component="form-alert"]:has([data-slot="message"]:empty) {
+	display: none;
+}
+
+[data-component="form-alert"] [data-slot="icon-success"],
+[data-component="form-alert"] [data-slot="icon-danger"] {
+	width: 1rem;
+	height: 1rem;
+}
+[data-component="form-alert"] [data-slot="icon-success"] {
+	display: none;
+}
+
+[data-component="form-footer"] {
+	display: flex;
+	gap: 1rem;
+	font-size: 0.75rem;
+	align-items: center;
+	justify-content: center;
+}
+
+[data-component="form-footer"]:has(> :nth-child(2)) {
+	justify-content: space-between;
+}
+`;
+/**
+* Main layout component that wraps all authentication UI screens.
+* Handles theming, logo display, and provides consistent styling.
+*
+* @param props - Layout props including children and optional size
+* @returns Complete HTML document as a string with theming and branding applied
+*/
+const Layout = (props) => {
+	const theme = getTheme();
+	/**
+	* Gets a theme value for a specific key and color mode.
+	* Handles both string values and light/dark object configurations.
+	*/
+	const getThemeValue = (key, mode) => {
+		if (!theme?.[key]) return;
+		if (typeof theme[key] === "string") return theme[key];
+		return theme[key][mode];
+	};
+	/**
+	* Calculates border radius value based on theme configuration.
+	*/
+	const getBorderRadius = () => {
+		switch (theme?.radius) {
+			case "none": return "0";
+			case "sm": return "1";
+			case "md": return "1.25";
+			case "lg": return "1.5";
+			case "full": return "1000000000001";
+			default: return "1";
+		}
+	};
+	/**
+	* Checks if both light and dark logo variants are available.
+	*/
+	const hasCustomLogo = Boolean(getThemeValue("logo", "light") && getThemeValue("logo", "dark"));
+	/**
+	* CSS custom properties for theming.
+	*/
+	const themeStyles = [
+		`--color-background-light: ${getThemeValue("background", "light") || ""}`,
+		`--color-background-dark: ${getThemeValue("background", "dark") || ""}`,
+		`--color-primary-light: ${getThemeValue("primary", "light") || ""}`,
+		`--color-primary-dark: ${getThemeValue("primary", "dark") || ""}`,
+		`--font-family: ${theme?.font?.family || ""}`,
+		`--font-scale: ${theme?.font?.scale || ""}`,
+		`--border-radius: ${getBorderRadius()}`
+	].join("; ");
+	const faviconHtml = theme?.favicon ? `<link href="${theme.favicon}" rel="icon" />` : `
+			<link href="https://openauth.js.org/favicon.ico" rel="icon" sizes="48x48" />
+			<link href="https://openauth.js.org/favicon.svg" media="(prefers-color-scheme: light)" rel="icon" />
+			<link href="https://openauth.js.org/favicon-dark.svg" media="(prefers-color-scheme: dark)" rel="icon" />
+			<link href="https://openauth.js.org/favicon.svg" rel="shortcut icon" type="image/svg+xml" />
+		  `;
+	const logoHtml = hasCustomLogo ? `
+			<img
+				alt="Logo Light"
+				data-component="logo"
+				data-mode="light"
+				src="${getThemeValue("logo", "light") || ""}"
+			/>
+			<img
+				alt="Logo Dark"
+				data-component="logo"
+				data-mode="dark"
+				src="${getThemeValue("logo", "dark") || ""}"
+			/>
+		  ` : DefaultDraftAuthLogo();
+	const childrenHtml = props.children || "";
+	return `
+		<!DOCTYPE html>
+		<html lang="en" style="${themeStyles}">
+			<head>
+				<title>${theme?.title || "Draft Auth"}</title>
+				<meta charset="utf-8" />
+				<meta content="width=device-width, initial-scale=1" name="viewport" />
+
+				${faviconHtml}
+
+				<!-- Base CSS styles -->
+				<style>${css}</style>
+
+				<!-- Custom theme CSS if provided -->
+				${theme?.css ? `<style>${theme.css}</style>` : ""}
+			</head>
+			<body>
+				<div data-component="root">
+					<div data-component="center" data-size="${props.size || ""}">
+						${logoHtml}
+						${childrenHtml}
+					</div>
+				</div>
+			</body>
+		</html>
+	`;
+};
+/**
+* Default Draft Auth logo component.
+* Used when no custom logo is provided in the theme configuration.
+*/
+const DefaultDraftAuthLogo = () => `
+	<svg
+		aria-label="Draft Auth Logo"
+		data-component="logo-default"
+		fill="none"
+		height="51"
+		viewBox="0 0 51 51"
+		width="51"
+		xmlns="http://www.w3.org/2000/svg"
+	>
+		<title>Draft Auth Logo</title>
+		<path
+			d="M0 50.2303V0.12854H50.1017V50.2303H0ZM3.08002 11.8326H11.7041V3.20856H3.08002V11.8326ZM14.8526 11.8326H23.4766V3.20856H14.8526V11.8326ZM26.5566 11.8326H35.1807V3.20856H26.5566V11.8326ZM38.3292 11.8326H47.0217V3.20856H38.3292V11.8326ZM3.08002 23.6052H11.7041V14.9811H3.08002V23.6052ZM14.8526 23.6052H23.4766V14.9811H14.8526V23.6052ZM26.5566 23.6052H35.1807V14.9811H26.5566V23.6052ZM38.3292 23.6052H47.0217V14.9811H38.3292V23.6052ZM3.08002 35.3092H11.7041V26.6852H3.08002V35.3092ZM14.8526 35.3092H23.4766V26.6852H14.8526V35.3092ZM26.5566 35.3092H35.1807V26.6852H26.5566V35.3092ZM38.3292 35.3092H47.0217V26.6852H38.3292V35.3092ZM3.08002 47.1502H11.7041V38.3893H3.08002V47.1502ZM14.8526 47.1502H23.4766V38.3893H14.8526V47.1502ZM26.5566 47.1502H35.1807V38.3893H26.5566V47.1502ZM38.3292 47.1502H47.0217V38.3893H38.3292V47.1502Z"
+			fill="currentColor"
+		/>
+	</svg>
+`;
+
+//#endregion
+export { Layout };