@lovrozagar/flare 0.1.2 → 0.2.1

package/src/errors/index.ts

@@ -46,28 +46,60 @@ export class UnauthorizedError extends Error {
 }
 
 const SAFE_PROTOCOLS = new Set(["http:", "https:"]);
+const SENTINEL_ORIGIN = "https://flare.invalid";
+const HAS_SCHEME = /^[a-zA-Z][a-zA-Z+\-.]*:/;
 
 /**
  * Allowlist-based redirect URL validation using the URL constructor.
- * Lets the platform's URL parser handle all encoding/unicode normalization
- * instead of a regex blocklist that can be bypassed.
+ * Lets the platform's URL parser handle encoding, backslash normalization,
+ * and unicode instead of a regex blocklist that can be bypassed.
+ *
+ * Protocol-relative (`//host`) is not a same-origin path — `startsWith("/")`
+ * would treat it as one. Internal `to` must stay on the sentinel origin.
  */
-function validateExternalRedirectUrl(href: string): string {
-	/* Relative paths are safe — no protocol to exploit */
-	if (href.startsWith("/") || href.startsWith(".")) return href;
+function validateRedirectUrl(raw: string, mode: "internal" | "external"): string {
+	if (/[\0\r\n]/.test(raw)) {
+		throw new Error(`Unsafe redirect URL: ${raw}`);
+	}
 
 	let parsed: URL;
 	try {
-		parsed = new URL(href, "http://localhost");
+		parsed = new URL(raw, SENTINEL_ORIGIN);
 	} catch {
-		throw new Error(`Unsafe redirect URL: ${href}`);
+		throw new Error(`Unsafe redirect URL: ${raw}`);
 	}
 
 	if (!SAFE_PROTOCOLS.has(parsed.protocol)) {
-		throw new Error(`Unsafe redirect URL: ${href}`);
+		throw new Error(`Unsafe redirect URL: ${raw}`);
+	}
+
+	const sameOrigin = parsed.origin === SENTINEL_ORIGIN;
+	if (mode === "internal") {
+		let decodedPath = parsed.pathname;
+		try {
+			decodedPath = decodeURIComponent(parsed.pathname);
+		} catch {
+			/* keep pathname */
+		}
+		if (
+			!sameOrigin ||
+			!raw.startsWith("/") ||
+			raw.startsWith("//") ||
+			raw.includes("\\") ||
+			parsed.pathname.startsWith("//") ||
+			decodedPath.includes("\\") ||
+			decodedPath.startsWith("//")
+		) {
+			throw new Error(`Unsafe redirect URL: ${raw}`);
+		}
+		return `${parsed.pathname}${parsed.search}${parsed.hash}`;
+	}
+
+	if (!sameOrigin && !HAS_SCHEME.test(raw.trimStart())) {
+		throw new Error(`Unsafe redirect URL: ${raw}`);
 	}
 
-	return href;
+	return raw;
 }
 
 export class RedirectResponse extends Error {
@@ -80,10 +112,10 @@ export class RedirectResponse extends Error {
 	constructor(options: RawRedirectOptions) {
 		super("Redirect");
 		if ("href" in options) {
-			this.url = validateExternalRedirectUrl(options.href);
+			this.url = validateRedirectUrl(options.href, "external");
 			this.external = true;
 		} else {
-			this.url = options.to;
+			this.url = validateRedirectUrl(options.to, "internal");
 			this.external = false;
 		}
 		this.status = options.status ?? 303;
@@ -136,6 +168,8 @@ export function redirect(options: {
 	if (options.to === undefined) {
 		throw new Error("redirect() requires either 'to' or 'href'");
 	}
+	/* Validate the raw path before buildUrl collapses leading slashes (`//host` → `/host`) */
+	validateRedirectUrl(options.to, "internal");
 	const url = buildUrl({ params: options.params, search: options.search, to: options.to });
 	throw new RedirectResponse({ replace: options.replace, status: options.status, to: url });
 }

package/src/fonts/component.tsx

@@ -1,4 +1,5 @@
-import { For, type JSX } from "solid-js";
+import { For } from "solid-js";
+import type { JSX } from "@solidjs/web";
 import { useSSRContext } from "../components/ssr-context.tsx";
 import type { Font } from "./types.ts";
 

package/src/form/index.tsx

@@ -1,7 +1,9 @@
-import { createMemo, createSignal, For, type JSX, Show, splitProps } from "solid-js";
-import { Dynamic } from "solid-js/web";
+import { createMemo, createSignal, For, omit, Show } from "solid-js";
+import type { JSX } from "@solidjs/web";
+import { Dynamic } from "@solidjs/web";
 import type { FlattenedError } from "../errors/index.ts";
 import { ServerFnValidationError } from "../errors/index.ts";
+import { FORM_FN_FIELD, serverFnPath } from "../protocol.ts";
 import type { ServerFn } from "../server-fn/index.ts";
 
 /* Duplicated here to avoid importing server-context (uses node:async_hooks)
@@ -51,16 +53,20 @@ interface FormOwnProps<TInput, TOutput> {
 export type FormProps<TInput, TOutput> = FormOwnProps<TInput, TOutput> &
 	Omit<JSX.FormHTMLAttributes<HTMLFormElement>, "action" | "children" | "enctype" | "method">;
 
+/** Seed `form.error()` after a no-JS PE POST with form-level validation errors. */
+export function seedFormErrorFromSsr(ssrCtx: FormActionContext | undefined): Error | null {
+	if (!ssrCtx?.formErrors.length) return null;
+	return new ServerFnValidationError({
+		fieldErrors: ssrCtx.fieldErrors,
+		formErrors: ssrCtx.formErrors,
+	});
+}
+
 /* ── Form component ────────────────────────────────────────────────── */
 
 export function Form<TInput, TOutput>(props: FormProps<TInput, TOutput>): JSX.Element {
-	const [local, rest] = splitProps(props as FormOwnProps<TInput, TOutput> & Record<string, unknown>, [
-		"action",
-		"children",
-		"enctype",
-		"onError",
-		"onSuccess",
-	]);
+	const local = props as FormOwnProps<TInput, TOutput> & Record<string, unknown>;
+	const rest = omit(local, "action", "children", "enctype", "onError", "onSuccess");
 
 	const reg = createMemo(() => local.action._registration);
 	const fnId = createMemo(() => reg()?.id ?? "");
@@ -70,7 +76,7 @@ export function Form<TInput, TOutput>(props: FormProps<TInput, TOutput>): JSX.El
 	const ssrCtx = typeof window === "undefined" && _getFormActionContext ? _getFormActionContext(fnId()) : undefined;
 
 	const [pending, setPending] = createSignal(false);
-	const [error, setError] = createSignal<Error | null>(null);
+	const [error, setError] = createSignal<Error | null>(seedFormErrorFromSsr(ssrCtx));
 	const [fieldErrors, setFieldErrors] = createSignal<Record<string, string[]>>(ssrCtx?.fieldErrors ?? {});
 	const [result, setResult] = createSignal<TOutput | undefined>(undefined);
 
@@ -116,7 +122,7 @@ export function Form<TInput, TOutput>(props: FormProps<TInput, TOutput>): JSX.El
 		setFieldErrors({});
 
 		try {
-			const url = `/_fn/${id}/${name}`;
+			const url = serverFnPath(id, name);
 			const res = await fetch(url, {
 				body: formData,
 				method: "POST",
@@ -165,7 +171,7 @@ export function Form<TInput, TOutput>(props: FormProps<TInput, TOutput>): JSX.El
 			method="post"
 			onSubmit={handleSubmit}
 		>
-			<input name="__flare_fn" type="hidden" value={fnId()} />
+			<input name={FORM_FN_FIELD} type="hidden" value={fnId()} />
 			{local.children(formCtx)}
 		</form>
 	) as JSX.Element;

package/src/generators/index.ts

@@ -11,6 +11,7 @@ export type PrefetchStrategy = false | "intent" | "render" | "viewport";
 export type ExtractedStaticDeferMode = "resolve" | "stream";
 
 export interface ExtractedCacheConfig {
+	cdnTags?: string[];
 	client?: {
 		cacheDeferred?: boolean;
 		gcTime?: number;
@@ -37,6 +38,7 @@ export interface RouteDefinition {
 	exportName: string;
 	filePath: string;
 	cache: ExtractedCacheConfig;
+	hasAuthorize?: boolean;
 	hasInput: boolean;
 	intercept?: ExtractedInterceptConfig;
 	responseRoute: boolean;
@@ -76,6 +78,23 @@ function writeGenFile(filePath: string, body: string, generator: string): void {
 	writeFileSync(filePath, fullContent, "utf-8");
 }
 
+/**
+ * Recursive source listing, normalized to posix separators and sorted.
+ *
+ * `readdirSync` order is filesystem- and runtime-dependent — node, bun, and
+ * deno disagree — and generated files are checked in, so an unsorted scan
+ * makes `routes.gen.ts` churn based on who ran the build. Sorting by code
+ * unit (not `localeCompare`, which follows ICU locale data) pins the order.
+ * Returns [] when the directory is missing.
+ */
+function listSourceEntries(srcPath: string): string[] {
+	try {
+		return (readdirSync(srcPath, { recursive: true }) as string[]).map((entry) => entry.replace(/\\/g, "/")).sort();
+	} catch {
+		return [];
+	}
+}
+
 const BUILDER_TO_TYPE: Record<string, RouteDefinition["type"]> = {
 	createLayout: "layout",
 	createPage: "page",
@@ -206,6 +225,41 @@ function extractNestedBlock(body: string, key: string): string | null {
 	return null;
 }
 
+function extractStringArray(text: string, key: string): string[] | undefined {
+	const re = new RegExp(`${key}\\s*:\\s*\\[`);
+	const match = re.exec(text);
+	if (!match) return undefined;
+
+	const start = (match.index ?? 0) + match[0].length;
+	let depth = 1;
+	let end = start;
+	for (let i = start; i < text.length; i++) {
+		const skipped = skipStringOrComment(text, i);
+		if (skipped !== i) {
+			i = skipped;
+			continue;
+		}
+		if (text[i] === "[") depth++;
+		else if (text[i] === "]") {
+			depth--;
+			if (depth === 0) {
+				end = i;
+				break;
+			}
+		}
+	}
+	const inner = text.slice(start, end);
+	const items: string[] = [];
+	const itemRe = /["'`]([^"'`]*)["'`]/g;
+	let itemMatch: RegExpExecArray | null = itemRe.exec(inner);
+	while (itemMatch) {
+		const value = itemMatch[1];
+		if (value) items.push(value);
+		itemMatch = itemRe.exec(inner);
+	}
+	return items;
+}
+
 function extractNumeric(text: string, key: string, unit?: "ms" | "s"): number | undefined {
 	/* try duration string first: key: "5m" */
 	const dm = DURATION_STR_RE(key).exec(text);
@@ -295,6 +349,13 @@ export function extractCacheFromChain(chainText: string): ExtractedCacheConfig {
 		config.isr = true;
 	}
 
+	/* cdn: { tags: ["a", "b"] } — static string arrays only; function tags are computed at render */
+	const cdnBlock = extractNestedBlock(body, "cdn");
+	if (cdnBlock) {
+		const tags = extractStringArray(cdnBlock, "tags");
+		if (tags && tags.length > 0) config.cdnTags = tags;
+	}
+
 	return config;
 }
 
@@ -436,6 +497,7 @@ export function extractRouteDefinitions(src: string, filePath: string): RouteDef
 			const hasAuthenticateOptional = /\.authenticateOptional\s*\(/.test(chainText);
 			const hasAuthenticate = /\.authenticate\s*\(/.test(chainText);
 			const authenticateMode: AuthenticateMode = hasAuthenticateOptional ? "optional" : !!hasAuthenticate;
+			const hasAuthorize = /\.authorize\s*\(/.test(chainText);
 			const hasInput = /\.input\s*(?:<[^>]*>)?\s*\(/.test(chainText);
 			const responseRoute = /\.response\s*\(/.test(chainText);
 			const cache = extractCacheFromChain(chainText);
@@ -446,6 +508,7 @@ export function extractRouteDefinitions(src: string, filePath: string): RouteDef
 				cache,
 				exportName,
 				filePath,
+				hasAuthorize,
 				hasInput,
 				intercept,
 				responseRoute,
@@ -581,6 +644,11 @@ function formatRouteMeta(def: RouteDefinition): string {
 	const parts: string[] = [];
 	if (def.authenticateMode === true) parts.push("authenticate: true");
 	else if (def.authenticateMode === "optional") parts.push(`authenticate: "optional"`);
+	if (def.hasAuthorize) parts.push("authorize: true");
+	if (def.cache.cdnTags && def.cache.cdnTags.length > 0) {
+		const tagLit = def.cache.cdnTags.map((t) => `"${escapeCodegenStr(t)}"`).join(", ");
+		parts.push(`tags: [${tagLit}]`);
+	}
 
 	if (def.cache.client) {
 		const cp: string[] = [];
@@ -1106,17 +1174,7 @@ export function scanSourceFiles(options: ScanOptions): RouteDefinition[] {
 	const prefix = options.ignorePrefix ?? "_";
 	const defs: RouteDefinition[] = [];
 
-	let entries: string[];
-	try {
-		entries = readdirSync(srcPath, { recursive: true }) as string[];
-	} catch {
-		return defs;
-	}
-
-	for (const entry of entries) {
-		/* Normalize to posix separators */
-		const rel = entry.replace(/\\/g, "/");
-
+	for (const rel of listSourceEntries(srcPath)) {
 		/* Skip non-ts files */
 		if (!rel.endsWith(".ts") && !rel.endsWith(".tsx")) continue;
 
@@ -1254,15 +1312,7 @@ export function inspectFsCodegenLayout(options: ScanOptions): FsLayoutIssue[] {
 	const prefix = options.ignorePrefix ?? "_";
 	const issues: FsLayoutIssue[] = [];
 
-	let entries: string[];
-	try {
-		entries = readdirSync(srcPath, { recursive: true }) as string[];
-	} catch {
-		return issues;
-	}
-
-	for (const entry of entries) {
-		const rel = entry.replace(/\\/g, "/");
+	for (const rel of listSourceEntries(srcPath)) {
 		if (!rel.endsWith(".ts") && !rel.endsWith(".tsx") && !rel.endsWith(".js") && !rel.endsWith(".jsx")) continue;
 		if (rel.includes("_gen/") || rel.includes("node_modules")) continue;
 		if (rel.endsWith(".gen.ts") || rel.endsWith(".gen.tsx")) continue;
@@ -1421,16 +1471,7 @@ export function scanSourceFilesFsCodegen(options: ScanOptions): RouteDefinition[
 	const routesDir = "routes";
 	const defs: RouteDefinition[] = [];
 
-	let entries: string[];
-	try {
-		entries = readdirSync(srcPath, { recursive: true }) as string[];
-	} catch {
-		return defs;
-	}
-
-	for (const entry of entries) {
-		const rel = entry.replace(/\\/g, "/");
-
+	for (const rel of listSourceEntries(srcPath)) {
 		/* Only process files under routes/ */
 		if (!rel.startsWith(`${routesDir}/`)) continue;
 
@@ -1464,6 +1505,7 @@ export function scanSourceFilesFsCodegen(options: ScanOptions): RouteDefinition[
 		const hasAuthenticateOptional = /\.authenticateOptional\s*\(/.test(content);
 		const hasAuthenticate = /\.authenticate\s*\(/.test(content);
 		const authenticateMode: AuthenticateMode = hasAuthenticateOptional ? "optional" : !!hasAuthenticate;
+		const hasAuthorize = /\.authorize\s*\(/.test(content);
 		const hasInput = /\.input\s*(?:<[^>]*>)?\s*\(/.test(content);
 		const responseRoute = /\.response\s*\(/.test(content);
 		const cache = extractCacheFromChain(content);
@@ -1474,6 +1516,7 @@ export function scanSourceFilesFsCodegen(options: ScanOptions): RouteDefinition[
 			cache,
 			exportName: "route",
 			filePath: posix.join(options.srcDir ?? "src", rel),
+			hasAuthorize,
 			hasInput,
 			intercept,
 			responseRoute,

package/src/head-client/index.ts

@@ -17,6 +17,7 @@ const managedHreflangTags = new Set<string>();
 /* CSS lifecycle: per-route elements + refcounted dedup for shared stylesheets */
 const cssElementsByRoute = new Map<string, HTMLElement[]>();
 const cssRefCount = new Map<string, { element: HTMLElement; refCount: number }>();
+const styleRefCount = new Map<string, { element: HTMLElement; refCount: number }>();
 
 export function clearRouteTracking(): void {
 	baseTitle = "";
@@ -26,6 +27,7 @@ export function clearRouteTracking(): void {
 	managedHreflangTags.clear();
 	cssElementsByRoute.clear();
 	cssRefCount.clear();
+	styleRefCount.clear();
 }
 
 export function initRouteHierarchy(matchIds: string[], rootTitle?: string): void {
@@ -561,15 +563,70 @@ function addCssLinkForRoute(matchId: string, href: string): void {
 	cssElementsByRoute.set(matchId, list);
 }
 
+function stampStyleNonce(el: HTMLElement): void {
+	if (el.getAttribute("nonce") || el.nonce) return;
+	const meta = document.querySelector?.('meta[name="csp-nonce"]');
+	const tagged = document.querySelector?.("script[nonce], style[nonce]") as HTMLElement | null;
+	const nonce = meta?.getAttribute("content") || tagged?.nonce || tagged?.getAttribute("nonce") || "";
+	if (!nonce) return;
+	el.setAttribute("nonce", nonce);
+	el.nonce = nonce;
+}
+
+function isInfraStyle(el: HTMLElement): boolean {
+	const id = el.getAttribute("id");
+	return id === "flare-runtime" || id === "flare-critical";
+}
+
+function isStyleTracked(el: HTMLElement): boolean {
+	for (const ref of styleRefCount.values()) {
+		if (ref.element === el) return true;
+	}
+	return false;
+}
+
+function findAdoptableStyle(children: string): HTMLElement | null {
+	const nodes = document.head?.querySelectorAll("style");
+	if (!nodes) return null;
+	for (const node of nodes) {
+		const el = node as HTMLElement;
+		if (isInfraStyle(el) || isStyleTracked(el)) continue;
+		if (el.textContent === children) return el;
+	}
+	return null;
+}
+
+function trackStyleForRoute(matchId: string, el: HTMLElement): void {
+	const list = cssElementsByRoute.get(matchId) ?? [];
+	list.push(el);
+	cssElementsByRoute.set(matchId, list);
+}
+
 function addCssStyleForRoute(matchId: string, children: string): void {
 	if (typeof document === "undefined") return;
+	const ref = styleRefCount.get(children);
+	if (ref) {
+		ref.refCount++;
+		trackStyleForRoute(matchId, ref.element);
+		return;
+	}
+
+	const existing = findAdoptableStyle(children);
+	if (existing) {
+		existing.setAttribute("data-flare-route", matchId);
+		stampStyleNonce(existing);
+		styleRefCount.set(children, { element: existing, refCount: 1 });
+		trackStyleForRoute(matchId, existing);
+		return;
+	}
+
 	const el = document.createElement("style");
+	stampStyleNonce(el);
 	el.setAttribute("data-flare-route", matchId);
 	el.textContent = children;
 	document.head.appendChild(el);
-	const list = cssElementsByRoute.get(matchId) ?? [];
-	list.push(el);
-	cssElementsByRoute.set(matchId, list);
+	styleRefCount.set(children, { element: el, refCount: 1 });
+	trackStyleForRoute(matchId, el);
 }
 
 function applyCssForRoute(matchId: string, config: HeadConfig): void {
@@ -601,20 +658,34 @@ function applyCssForRoute(matchId: string, config: HeadConfig): void {
 
 	/* THEN decrement old refcounts — shared elements stay because new refs were added above */
 	for (const el of oldElements) {
-		const href = el.getAttribute("href");
-		if (href && el.getAttribute("rel") === "stylesheet") {
-			const ref = cssRefCount.get(href);
-			if (ref) {
-				ref.refCount--;
-				if (ref.refCount <= 0) {
-					ref.element.remove();
-					cssRefCount.delete(href);
-				}
-				continue;
+		releaseCssElement(el);
+	}
+}
+
+function releaseCssElement(el: HTMLElement): void {
+	const href = el.getAttribute("href");
+	if (href && el.getAttribute("rel") === "stylesheet") {
+		const ref = cssRefCount.get(href);
+		if (ref) {
+			ref.refCount--;
+			if (ref.refCount <= 0) {
+				ref.element.remove();
+				cssRefCount.delete(href);
 			}
+			return;
 		}
-		el.remove();
 	}
+	const content = el.textContent ?? "";
+	const styleRef = styleRefCount.get(content);
+	if (styleRef && styleRef.element === el) {
+		styleRef.refCount--;
+		if (styleRef.refCount <= 0) {
+			styleRef.element.remove();
+			styleRefCount.delete(content);
+		}
+		return;
+	}
+	el.remove();
 }
 
 function removeCssForRoute(routeId: string): void {
@@ -622,21 +693,7 @@ function removeCssForRoute(routeId: string): void {
 	if (!elements) return;
 
 	for (const el of elements) {
-		const href = el.getAttribute("href");
-		/* Refcounted stylesheet links */
-		if (href && el.getAttribute("rel") === "stylesheet") {
-			const ref = cssRefCount.get(href);
-			if (ref) {
-				ref.refCount--;
-				if (ref.refCount <= 0) {
-					ref.element.remove();
-					cssRefCount.delete(href);
-				}
-				continue;
-			}
-		}
-		/* <style> elements or untracked links — just remove */
-		el.remove();
+		releaseCssElement(el);
 	}
 	cssElementsByRoute.delete(routeId);
 }

package/src/history/index.ts

@@ -150,6 +150,12 @@ export function createScrollStore(maxSize = 200, ttl = DEFAULT_SCROLL_TTL): Scro
 
 	return {
 		get(key: string): ScrollPosition | null {
+			const ts = timestamps.get(key);
+			if (ts !== undefined && Date.now() - ts > ttl) {
+				store.delete(key);
+				timestamps.delete(key);
+				return null;
+			}
 			return store.get(key) ?? null;
 		},