@stack-mode/site-manager-kit 1.44.0 → 1.45.0

package/src/chat-types.ts

@@ -1,76 +1,76 @@
-// Website Chat shapes and the reader for its streamed replies. Plain code, safe in the browser and on the server.
-
-/** GET /api/v1/chat. `live` false: the site shows no chat. */
-export type ChatConfig = {
-  live: boolean;
-  name: string;
-  greeting: string;
-  suggestedQuestions: string[];
-  /** The chat can offer open times and book one. */
-  canBook: boolean;
-  /** The site's accent color from Site Manager, or null. The component's own `accent` prop wins. */
-  accent: string | null;
-  retentionDays: number;
-};
-
-/** One line of a streamed reply. */
-export type ChatEvent =
-  | { type: "start"; conversationId: string }
-  | { type: "delta"; text: string }
-  | { type: "done"; unanswered: boolean; handoff: boolean; booking: boolean }
-  | { type: "error"; code: string };
-
-export type ChatSlotDay = { date: string; slots: { start: string; end: string; label: string }[] };
-export type ChatSlots = { timezone: string; slotMinutes: number; days: ChatSlotDay[] };
-
-export type ChatLeadResult = { ok: true; successMessage: string } | { ok: false; error: "invalid" | "slot_taken" | "rate_limited" | "unavailable"; fields?: Record<string, string> };
-
-/** Splits streamed NDJSON into events, keeping a partial last line for the next chunk. Unknown lines are skipped. */
-export function parseChatLines(buffer: string): { events: ChatEvent[]; rest: string } {
-  const events: ChatEvent[] = [];
-  const lines = buffer.split("\n");
-  const rest = lines.pop() ?? "";
-  for (const line of lines) {
-    if (!line.trim()) continue;
-    try {
-      const e = JSON.parse(line) as ChatEvent;
-      if (e && typeof e === "object" && typeof e.type === "string") events.push(e);
-    } catch {
-      // A broken line: skip it rather than lose the rest of the reply.
-    }
-  }
-  return { events, rest };
-}
-
-/** Reads a streamed reply, calling `onEvent` for each event as it arrives. */
-export async function readChatStream(body: ReadableStream<Uint8Array>, onEvent: (e: ChatEvent) => void): Promise<void> {
-  const reader = body.getReader();
-  const decoder = new TextDecoder();
-  let buf = "";
-  for (;;) {
-    const { done, value } = await reader.read();
-    if (done) break;
-    buf += decoder.decode(value, { stream: true });
-    const { events, rest } = parseChatLines(buf);
-    buf = rest;
-    for (const e of events) onEvent(e);
-  }
-  for (const e of parseChatLines(`${buf}\n`).events) onEvent(e);
-}
-
-/**
- * Text color on the accent: near-black on a light accent (a lime or yellow), white on a dark one, so the button and
- * the visitor's messages stay readable whatever the site's color. Colors it can't read get white.
- */
-export function textOn(color: string): string {
-  const m = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(color.trim());
-  if (!m) return "#ffffff";
-  const hex = m[1].length === 3 ? [...m[1]].map((c) => c + c).join("") : m[1];
-  const [r, g, b] = [0, 2, 4].map((i) => {
-    const c = parseInt(hex.slice(i, i + 2), 16) / 255;
-    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
-  });
-  const lum = 0.2126 * r + 0.7152 * g + 0.0722 * b;
-  // White wins below this luminance (the point where both have equal contrast).
-  return lum > 0.179 ? "#111318" : "#ffffff";
-}
+// Website Chat shapes and the reader for its streamed replies. Plain code, safe in the browser and on the server.
+
+/** GET /api/v1/chat. `live` false: the site shows no chat. */
+export type ChatConfig = {
+  live: boolean;
+  name: string;
+  greeting: string;
+  suggestedQuestions: string[];
+  /** The chat can offer open times and book one. */
+  canBook: boolean;
+  /** The site's accent color from Site Manager, or null. The component's own `accent` prop wins. */
+  accent: string | null;
+  retentionDays: number;
+};
+
+/** One line of a streamed reply. */
+export type ChatEvent =
+  | { type: "start"; conversationId: string }
+  | { type: "delta"; text: string }
+  | { type: "done"; unanswered: boolean; handoff: boolean; booking: boolean }
+  | { type: "error"; code: string };
+
+export type ChatSlotDay = { date: string; slots: { start: string; end: string; label: string }[] };
+export type ChatSlots = { timezone: string; slotMinutes: number; days: ChatSlotDay[] };
+
+export type ChatLeadResult = { ok: true; successMessage: string } | { ok: false; error: "invalid" | "slot_taken" | "rate_limited" | "unavailable"; fields?: Record<string, string> };
+
+/** Splits streamed NDJSON into events, keeping a partial last line for the next chunk. Unknown lines are skipped. */
+export function parseChatLines(buffer: string): { events: ChatEvent[]; rest: string } {
+  const events: ChatEvent[] = [];
+  const lines = buffer.split("\n");
+  const rest = lines.pop() ?? "";
+  for (const line of lines) {
+    if (!line.trim()) continue;
+    try {
+      const e = JSON.parse(line) as ChatEvent;
+      if (e && typeof e === "object" && typeof e.type === "string") events.push(e);
+    } catch {
+      // A broken line: skip it rather than lose the rest of the reply.
+    }
+  }
+  return { events, rest };
+}
+
+/** Reads a streamed reply, calling `onEvent` for each event as it arrives. */
+export async function readChatStream(body: ReadableStream<Uint8Array>, onEvent: (e: ChatEvent) => void): Promise<void> {
+  const reader = body.getReader();
+  const decoder = new TextDecoder();
+  let buf = "";
+  for (;;) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    buf += decoder.decode(value, { stream: true });
+    const { events, rest } = parseChatLines(buf);
+    buf = rest;
+    for (const e of events) onEvent(e);
+  }
+  for (const e of parseChatLines(`${buf}\n`).events) onEvent(e);
+}
+
+/**
+ * Text color on the accent: near-black on a light accent (a lime or yellow), white on a dark one, so the button and
+ * the visitor's messages stay readable whatever the site's color. Colors it can't read get white.
+ */
+export function textOn(color: string): string {
+  const m = /^#?([0-9a-f]{3}|[0-9a-f]{6})$/i.exec(color.trim());
+  if (!m) return "#ffffff";
+  const hex = m[1].length === 3 ? [...m[1]].map((c) => c + c).join("") : m[1];
+  const [r, g, b] = [0, 2, 4].map((i) => {
+    const c = parseInt(hex.slice(i, i + 2), 16) / 255;
+    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
+  });
+  const lum = 0.2126 * r + 0.7152 * g + 0.0722 * b;
+  // White wins below this luminance (the point where both have equal contrast).
+  return lum > 0.179 ? "#111318" : "#ffffff";
+}

package/src/client.ts

@@ -1,116 +1,116 @@
-/*
- * The one place requests to Site Manager are made. Server only: the API key must never reach a browser.
- *
- * Env (server only, never NEXT_PUBLIC_):
- *   BLUEPRINT_URL         Site Manager's address, for example https://manager.example.com
- *   BLUEPRINT_API_KEY     this site's key (bp_...)
- *   BLUEPRINT_SITE_ID     this site's id, shown on its Connection tab in Site Manager
- *   BLUEPRINT_REVALIDATE_SECRET  the website connection secret, also used to sign preview reads
- */
-
-import { unstable_cache } from "next/cache";
-import { draftMode } from "next/headers";
-import { PREVIEW_HEADER, signPreviewHeader } from "./preview";
-
-export class BlueprintError extends Error {
-  constructor(
-    message: string,
-    public status: number,
-    public code?: string,
-  ) {
-    super(message);
-    this.name = "BlueprintError";
-  }
-}
-
-function env(name: string): string {
-  const v = process.env[name]?.trim();
-  if (!v) throw new BlueprintError(`${name} is not set`, 0, "config");
-  return v;
-}
-
-export function siteId(): string {
-  return env("BLUEPRINT_SITE_ID");
-}
-
-/** Cache tags match what Site Manager sends when content changes: bp:<siteId> and bp:<siteId>:<module>. */
-export function tagsFor(...modules: string[]): string[] {
-  const id = siteId();
-  return [`bp:${id}`, ...modules.map((m) => `bp:${id}:${m}`)];
-}
-
-type Options = { tags?: string[]; method?: "GET" | "POST"; body?: unknown; cache?: "no-store" };
-
-type Envelope<T> = { data: T; meta: Record<string, unknown> };
-
-async function request<T>(base: string, path: string, init: RequestInit, whole = false): Promise<T | null> {
-  const res = await fetch(`${base}/api/v1${path}`, init);
-  if (res.status === 404) return null;
-  if (res.status === 204) return null;
-  const json = (await res.json().catch(() => null)) as { data?: unknown; meta?: Record<string, unknown>; error?: { code?: string } } | null;
-  if (!res.ok) throw new BlueprintError(`Site Manager answered ${res.status} for ${path}`, res.status, json?.error?.code);
-  if (whole) return (json && json.data !== undefined ? { data: json.data, meta: json.meta ?? {} } : null) as T | null;
-  return (json?.data ?? null) as T | null;
-}
-
-/**
- * Fetches `/api/v1<path>`. Reads are cached for an hour and refreshed early by tag when Site Manager says content
- * changed. Returns null for a 404, throws BlueprintError for anything else that isn't OK (errors aren't cached).
- *
- * Reads use unstable_cache rather than fetch's own cache options because it behaves the same with Cache Components
- * on or off, and like the fetch cache it lasts across deployments and servers.
- *
- * In a preview opened from Site Manager (draft mode), reads skip the cache and include drafts and scheduled changes.
- */
-export async function bp<T>(path: string, opts: Options = {}): Promise<T | null> {
-  return read<T>(path, opts, false);
-}
-
-/** Like bp, but keeps the response's `meta` too (paging counts), as `{ data, meta }`. */
-export async function bpWithMeta<T>(path: string, opts: Options = {}): Promise<Envelope<T> | null> {
-  return read<Envelope<T>>(path, opts, true);
-}
-
-async function read<T>(path: string, opts: Options, whole: boolean): Promise<T | null> {
-  const base = env("BLUEPRINT_URL").replace(/\/+$/, "");
-  const method = opts.method ?? "GET";
-  const preview = method === "GET" && (await inPreview());
-  const headers: Record<string, string> = { authorization: `Bearer ${env("BLUEPRINT_API_KEY")}` };
-  if (opts.body !== undefined) headers["content-type"] = "application/json";
-  if (preview) headers[PREVIEW_HEADER] = signPreviewHeader(env("BLUEPRINT_REVALIDATE_SECRET"));
-  const init: RequestInit = {
-    method,
-    cache: "no-store",
-    headers,
-    ...(opts.body !== undefined ? { body: JSON.stringify(opts.body) } : {}),
-  };
-  if (preview || opts.cache === "no-store" || method === "POST") return request<T>(base, path, init, whole);
-  return unstable_cache(() => request<T>(base, path, init, whole), ["site-manager-kit", base, siteId(), path, ...(whole ? ["meta"] : [])], {
-    tags: opts.tags ?? tagsFor(),
-    revalidate: 3600,
-  })();
-}
-
-/**
- * Whether this request is a preview opened from Site Manager (Next.js draft mode). Readable inside `use cache`
- * scopes too. Outside a request (build time, generateStaticParams) there is no preview.
- */
-async function inPreview(): Promise<boolean> {
-  try {
-    return (await draftMode()).isEnabled;
-  } catch {
-    return false;
-  }
-}
-
-/** For writes that return an error body worth reading (form submits). */
-export async function bpRaw(path: string, body: unknown): Promise<{ status: number; json: unknown }> {
-  const base = env("BLUEPRINT_URL").replace(/\/+$/, "");
-  const res = await fetch(`${base}/api/v1${path}`, {
-    method: "POST",
-    cache: "no-store",
-    headers: { authorization: `Bearer ${env("BLUEPRINT_API_KEY")}`, "content-type": "application/json" },
-    body: JSON.stringify(body),
-  });
-  return { status: res.status, json: await res.json().catch(() => null) };
-}
+/*
+ * The one place requests to Site Manager are made. Server only: the API key must never reach a browser.
+ *
+ * Env (server only, never NEXT_PUBLIC_):
+ *   BLUEPRINT_URL         Site Manager's address, for example https://manager.example.com
+ *   BLUEPRINT_API_KEY     this site's key (bp_...)
+ *   BLUEPRINT_SITE_ID     this site's id, shown on its Connection tab in Site Manager
+ *   BLUEPRINT_REVALIDATE_SECRET  the website connection secret, also used to sign preview reads
+ */
+
+import { unstable_cache } from "next/cache";
+import { draftMode } from "next/headers";
+import { PREVIEW_HEADER, signPreviewHeader } from "./preview";
+
+export class BlueprintError extends Error {
+  constructor(
+    message: string,
+    public status: number,
+    public code?: string,
+  ) {
+    super(message);
+    this.name = "BlueprintError";
+  }
+}
+
+function env(name: string): string {
+  const v = process.env[name]?.trim();
+  if (!v) throw new BlueprintError(`${name} is not set`, 0, "config");
+  return v;
+}
+
+export function siteId(): string {
+  return env("BLUEPRINT_SITE_ID");
+}
+
+/** Cache tags match what Site Manager sends when content changes: bp:<siteId> and bp:<siteId>:<module>. */
+export function tagsFor(...modules: string[]): string[] {
+  const id = siteId();
+  return [`bp:${id}`, ...modules.map((m) => `bp:${id}:${m}`)];
+}
+
+type Options = { tags?: string[]; method?: "GET" | "POST"; body?: unknown; cache?: "no-store" };
+
+type Envelope<T> = { data: T; meta: Record<string, unknown> };
+
+async function request<T>(base: string, path: string, init: RequestInit, whole = false): Promise<T | null> {
+  const res = await fetch(`${base}/api/v1${path}`, init);
+  if (res.status === 404) return null;
+  if (res.status === 204) return null;
+  const json = (await res.json().catch(() => null)) as { data?: unknown; meta?: Record<string, unknown>; error?: { code?: string } } | null;
+  if (!res.ok) throw new BlueprintError(`Site Manager answered ${res.status} for ${path}`, res.status, json?.error?.code);
+  if (whole) return (json && json.data !== undefined ? { data: json.data, meta: json.meta ?? {} } : null) as T | null;
+  return (json?.data ?? null) as T | null;
+}
+
+/**
+ * Fetches `/api/v1<path>`. Reads are cached for an hour and refreshed early by tag when Site Manager says content
+ * changed. Returns null for a 404, throws BlueprintError for anything else that isn't OK (errors aren't cached).
+ *
+ * Reads use unstable_cache rather than fetch's own cache options because it behaves the same with Cache Components
+ * on or off, and like the fetch cache it lasts across deployments and servers.
+ *
+ * In a preview opened from Site Manager (draft mode), reads skip the cache and include drafts and scheduled changes.
+ */
+export async function bp<T>(path: string, opts: Options = {}): Promise<T | null> {
+  return read<T>(path, opts, false);
+}
+
+/** Like bp, but keeps the response's `meta` too (paging counts), as `{ data, meta }`. */
+export async function bpWithMeta<T>(path: string, opts: Options = {}): Promise<Envelope<T> | null> {
+  return read<Envelope<T>>(path, opts, true);
+}
+
+async function read<T>(path: string, opts: Options, whole: boolean): Promise<T | null> {
+  const base = env("BLUEPRINT_URL").replace(/\/+$/, "");
+  const method = opts.method ?? "GET";
+  const preview = method === "GET" && (await inPreview());
+  const headers: Record<string, string> = { authorization: `Bearer ${env("BLUEPRINT_API_KEY")}` };
+  if (opts.body !== undefined) headers["content-type"] = "application/json";
+  if (preview) headers[PREVIEW_HEADER] = signPreviewHeader(env("BLUEPRINT_REVALIDATE_SECRET"));
+  const init: RequestInit = {
+    method,
+    cache: "no-store",
+    headers,
+    ...(opts.body !== undefined ? { body: JSON.stringify(opts.body) } : {}),
+  };
+  if (preview || opts.cache === "no-store" || method === "POST") return request<T>(base, path, init, whole);
+  return unstable_cache(() => request<T>(base, path, init, whole), ["site-manager-kit", base, siteId(), path, ...(whole ? ["meta"] : [])], {
+    tags: opts.tags ?? tagsFor(),
+    revalidate: 3600,
+  })();
+}
+
+/**
+ * Whether this request is a preview opened from Site Manager (Next.js draft mode). Readable inside `use cache`
+ * scopes too. Outside a request (build time, generateStaticParams) there is no preview.
+ */
+async function inPreview(): Promise<boolean> {
+  try {
+    return (await draftMode()).isEnabled;
+  } catch {
+    return false;
+  }
+}
+
+/** For writes that return an error body worth reading (form submits). */
+export async function bpRaw(path: string, body: unknown): Promise<{ status: number; json: unknown }> {
+  const base = env("BLUEPRINT_URL").replace(/\/+$/, "");
+  const res = await fetch(`${base}/api/v1${path}`, {
+    method: "POST",
+    cache: "no-store",
+    headers: { authorization: `Bearer ${env("BLUEPRINT_API_KEY")}`, "content-type": "application/json" },
+    body: JSON.stringify(body),
+  });
+  return { status: res.status, json: await res.json().catch(() => null) };
+}

package/src/config.ts

@@ -1,78 +1,78 @@
-import type { NextConfig } from "next";
-import { VISUAL_COOKIE } from "./preview";
-
-// For next.config.ts. Use it inside withBotId: withBotId(withSiteManager({ ... })).
-
-type Header = { key: string; value: string };
-type HeaderRule = Awaited<ReturnType<NonNullable<NextConfig["headers"]>>>[number];
-
-export type SiteManagerConfigOptions = {
-  /** Browser features to switch off for every page. Default: camera, microphone and USB. Payment and location stay on for checkout and maps. */
-  disableFeatures?: string[];
-  /** Send HSTS for subdomains too. Only when every subdomain serves HTTPS. Default true. */
-  hstsSubdomains?: boolean;
-  /** Who may show this site in a frame: "SAMEORIGIN" (default) or "DENY". */
-  frameOptions?: "SAMEORIGIN" | "DENY";
-};
-
-/** The baseline security headers, so every website connected to Site Manager sends the same ones. */
-export function securityHeaders(opts: SiteManagerConfigOptions = {}): Header[] {
-  const features = opts.disableFeatures ?? ["camera", "microphone", "usb"];
-  return [
-    { key: "X-Content-Type-Options", value: "nosniff" },
-    { key: "Referrer-Policy", value: "strict-origin-when-cross-origin" },
-    { key: "X-Frame-Options", value: opts.frameOptions ?? "SAMEORIGIN" },
-    { key: "Permissions-Policy", value: features.map((f) => `${f}=()`).join(", ") },
-    { key: "Strict-Transport-Security", value: `max-age=63072000${opts.hstsSubdomains === false ? "" : "; includeSubDomains"}` },
-  ];
-}
-
-/** Where Site Manager's uploaded media lives, so next/image can resize it. */
-export const MEDIA_REMOTE_PATTERN = { protocol: "https", hostname: "*.public.blob.vercel-storage.com" } as const;
-
-const FRAME_ANCESTORS = /^frame-ancestors(\s|$)/i;
-
-/**
- * Lets the Visual Editor show the site when the site sets its own Content-Security-Policy here, where there is no
- * request to read the editor's address from. A browser that opened the page from the Visual Editor (it has the visual
- * cookie) gets the same policy without its frame-ancestors; visualFrameHeaders in the proxy then adds frame-ancestors
- * for the signed Site Manager address only. X-Frame-Options stays on every response, so a cookie the proxy doesn't
- * accept, or a path the proxy doesn't run on, still can't be framed: browsers ignore X-Frame-Options only when a
- * frame-ancestors is present.
- */
-export function allowVisualFrames(rules: HeaderRule[]): HeaderRule[] {
-  const cookie = { type: "cookie" as const, key: VISUAL_COOKIE };
-  return rules.flatMap((rule) => {
-    const csp = rule.headers.find(
-      (h) => h.key.toLowerCase() === "content-security-policy" && h.value.split(";").some((d) => FRAME_ANCESTORS.test(d.trim())),
-    );
-    if (!csp) return [rule];
-    const policy = csp.value
-      .split(";")
-      .map((d) => d.trim())
-      .filter((d) => d && !FRAME_ANCESTORS.test(d))
-      .join("; ");
-    return [
-      { ...rule, missing: [...(rule.missing ?? []), cookie] },
-      { ...rule, has: [...(rule.has ?? []), cookie], headers: rule.headers.map((h) => (h === csp ? { key: h.key, value: policy } : h)) },
-    ];
-  });
-}
-
-/**
- * Adds the baseline security headers to every route, lets next/image resize Site Manager's media, and stops sending
- * X-Powered-By. Keeps everything already in the config: its own headers come after these, so a site can override one.
- * A Content-Security-Policy of its own keeps working with the Visual Editor (allowVisualFrames).
- */
-export function withSiteManager(config: NextConfig = {}, opts: SiteManagerConfigOptions = {}): NextConfig {
-  const own = config.headers;
-  const patterns = config.images?.remotePatterns ?? [];
-  return {
-    ...config,
-    poweredByHeader: false,
-    images: { ...config.images, remotePatterns: [...patterns, MEDIA_REMOTE_PATTERN] },
-    async headers() {
-      return allowVisualFrames([{ source: "/:path*", headers: securityHeaders(opts) }, ...(own ? await own() : [])]);
-    },
-  };
-}
+import type { NextConfig } from "next";
+import { VISUAL_COOKIE } from "./preview";
+
+// For next.config.ts. Use it inside withBotId: withBotId(withSiteManager({ ... })).
+
+type Header = { key: string; value: string };
+type HeaderRule = Awaited<ReturnType<NonNullable<NextConfig["headers"]>>>[number];
+
+export type SiteManagerConfigOptions = {
+  /** Browser features to switch off for every page. Default: camera, microphone and USB. Payment and location stay on for checkout and maps. */
+  disableFeatures?: string[];
+  /** Send HSTS for subdomains too. Only when every subdomain serves HTTPS. Default true. */
+  hstsSubdomains?: boolean;
+  /** Who may show this site in a frame: "SAMEORIGIN" (default) or "DENY". */
+  frameOptions?: "SAMEORIGIN" | "DENY";
+};
+
+/** The baseline security headers, so every website connected to Site Manager sends the same ones. */
+export function securityHeaders(opts: SiteManagerConfigOptions = {}): Header[] {
+  const features = opts.disableFeatures ?? ["camera", "microphone", "usb"];
+  return [
+    { key: "X-Content-Type-Options", value: "nosniff" },
+    { key: "Referrer-Policy", value: "strict-origin-when-cross-origin" },
+    { key: "X-Frame-Options", value: opts.frameOptions ?? "SAMEORIGIN" },
+    { key: "Permissions-Policy", value: features.map((f) => `${f}=()`).join(", ") },
+    { key: "Strict-Transport-Security", value: `max-age=63072000${opts.hstsSubdomains === false ? "" : "; includeSubDomains"}` },
+  ];
+}
+
+/** Where Site Manager's uploaded media lives, so next/image can resize it. */
+export const MEDIA_REMOTE_PATTERN = { protocol: "https", hostname: "*.public.blob.vercel-storage.com" } as const;
+
+const FRAME_ANCESTORS = /^frame-ancestors(\s|$)/i;
+
+/**
+ * Lets the Visual Editor show the site when the site sets its own Content-Security-Policy here, where there is no
+ * request to read the editor's address from. A browser that opened the page from the Visual Editor (it has the visual
+ * cookie) gets the same policy without its frame-ancestors; visualFrameHeaders in the proxy then adds frame-ancestors
+ * for the signed Site Manager address only. X-Frame-Options stays on every response, so a cookie the proxy doesn't
+ * accept, or a path the proxy doesn't run on, still can't be framed: browsers ignore X-Frame-Options only when a
+ * frame-ancestors is present.
+ */
+export function allowVisualFrames(rules: HeaderRule[]): HeaderRule[] {
+  const cookie = { type: "cookie" as const, key: VISUAL_COOKIE };
+  return rules.flatMap((rule) => {
+    const csp = rule.headers.find(
+      (h) => h.key.toLowerCase() === "content-security-policy" && h.value.split(";").some((d) => FRAME_ANCESTORS.test(d.trim())),
+    );
+    if (!csp) return [rule];
+    const policy = csp.value
+      .split(";")
+      .map((d) => d.trim())
+      .filter((d) => d && !FRAME_ANCESTORS.test(d))
+      .join("; ");
+    return [
+      { ...rule, missing: [...(rule.missing ?? []), cookie] },
+      { ...rule, has: [...(rule.has ?? []), cookie], headers: rule.headers.map((h) => (h === csp ? { key: h.key, value: policy } : h)) },
+    ];
+  });
+}
+
+/**
+ * Adds the baseline security headers to every route, lets next/image resize Site Manager's media, and stops sending
+ * X-Powered-By. Keeps everything already in the config: its own headers come after these, so a site can override one.
+ * A Content-Security-Policy of its own keeps working with the Visual Editor (allowVisualFrames).
+ */
+export function withSiteManager(config: NextConfig = {}, opts: SiteManagerConfigOptions = {}): NextConfig {
+  const own = config.headers;
+  const patterns = config.images?.remotePatterns ?? [];
+  return {
+    ...config,
+    poweredByHeader: false,
+    images: { ...config.images, remotePatterns: [...patterns, MEDIA_REMOTE_PATTERN] },
+    async headers() {
+      return allowVisualFrames([{ source: "/:path*", headers: securityHeaders(opts) }, ...(own ? await own() : [])]);
+    },
+  };
+}

package/src/copy-keys-route.ts

@@ -1,21 +1,21 @@
-import { declaredKeys, declaredLists, type CopyKeyDef, type CopyListRule } from "./copy-keys";
-import { SIGNATURE_HEADER, verify } from "./signature";
-import { KIT_VERSION } from "./version";
-
-/**
- * Site Manager's Sync from Website reads the site's declared copy keys here. Put in
- * app/api/blueprint/copy-keys/route.ts:
- *
- *   import { copyKeysRoute } from "site-manager-kit/copy-keys-route";
- *   import { COPY } from "@/copy-keys";
- *   export const GET = copyKeysRoute(COPY);
- *
- * Signed like the health route, over an empty body. Unsigned requests get a 401. Sends the keys and the list rules.
- */
-export function copyKeysRoute(copy: { __defs: Record<string, CopyKeyDef>; __lists?: Record<string, CopyListRule> }): (req: Request) => Promise<Response> {
-  return async (req) => {
-    const check = verify(process.env.BLUEPRINT_REVALIDATE_SECRET, req.headers.get(SIGNATURE_HEADER), "");
-    if (!check.ok) return Response.json({ error: check.reason }, { status: 401 });
-    return Response.json({ kitVersion: KIT_VERSION, keys: declaredKeys(copy), lists: declaredLists(copy) }, { headers: { "cache-control": "no-store" } });
-  };
-}
+import { declaredKeys, declaredLists, type CopyKeyDef, type CopyListRule } from "./copy-keys";
+import { SIGNATURE_HEADER, verify } from "./signature";
+import { KIT_VERSION } from "./version";
+
+/**
+ * Site Manager's Sync from Website reads the site's declared copy keys here. Put in
+ * app/api/blueprint/copy-keys/route.ts:
+ *
+ *   import { copyKeysRoute } from "site-manager-kit/copy-keys-route";
+ *   import { COPY } from "@/copy-keys";
+ *   export const GET = copyKeysRoute(COPY);
+ *
+ * Signed like the health route, over an empty body. Unsigned requests get a 401. Sends the keys and the list rules.
+ */
+export function copyKeysRoute(copy: { __defs: Record<string, CopyKeyDef>; __lists?: Record<string, CopyListRule> }): (req: Request) => Promise<Response> {
+  return async (req) => {
+    const check = verify(process.env.BLUEPRINT_REVALIDATE_SECRET, req.headers.get(SIGNATURE_HEADER), "");
+    if (!check.ok) return Response.json({ error: check.reason }, { status: 401 });
+    return Response.json({ kitVersion: KIT_VERSION, keys: declaredKeys(copy), lists: declaredLists(copy) }, { headers: { "cache-control": "no-store" } });
+  };
+}