@goodfellow-cms/next 0.7.0 → 0.9.0

package/bin/goodfellow-next.js

@@ -3,12 +3,14 @@
 // writes the calendar files of collections of events, collections' feeds, the pages at redirects' old addresses and Cloudflare Pages' _redirects, and the search index for sites with a search block,
 // copies the site's Google Fonts into the export, builds plugins' admin frames and runs their build steps, starts every page with the admin address's guard for a site with one, and reports what automated checks find on the exported pages. `index` only writes the index.
 // `goodfellow-next update` updates Goodfellow, as `goodfellow update` does for other sites.
-// `goodfellow-next task [--out <file>]` runs one of a plugin's tasks for the admin panel, as `goodfellow task` does.
+// `goodfellow-next task [--describe] [--out <file>]` runs one of a plugin's tasks for the admin panel, or with
+// --describe only writes it down for a job with no secrets, as `goodfellow task` does.
 // `goodfellow-next due [--since <time>] [--output <file>]` says whether a scheduled change has come due, as `goodfellow due` does.
 // `goodfellow-next nightly [--mode <mode>]` says whether tonight's build is needed, as `goodfellow nightly` does.
 // `goodfellow-next content link|copy [folder]` puts a content repository's files in place, for a site whose
 // content is kept in a repository of its own.
 // `goodfellow-next import wordpress <file or address> [--dry-run]` imports a WordPress site, as `goodfellow import` does.
+// `goodfellow-next import markdown <folder> [--dry-run]` imports a folder of Markdown files, as `goodfellow import` does.
 // `goodfellow-next export wordpress [file]` writes the site as a WordPress export file, as `goodfellow export` does.
 // `goodfellow-next blocks add <item> [--registry <folder>] [--native <app>]` makes a block of a shadcn item, as
 // `goodfellow blocks add` does, and with --native its version for an Expo app.
@@ -16,7 +18,7 @@
 // the token broker, in goodfellow.config.tsx, as `goodfellow admin` and `goodfellow broker` do.
 import { existsSync, readFileSync } from "node:fs";
 import { rm } from "node:fs/promises";
-import { relative, resolve } from "node:path";
+import { join, relative, resolve } from "node:path";
 import { parseArgs } from "node:util";
 import { buildNotes, CLOUDFLARE_REDIRECTS_LIMIT, configAdmin, formatUpdateResult } from "@goodfellow-cms/core";
 import { reportSiteProblems } from "@goodfellow-cms/core/accessibility";
@@ -24,13 +26,19 @@ import {
   AdminSetupError,
   BrokerSetupError,
   ContentRepositoryError,
+  checkEarlyTheme,
   checkSiteAdminAddress,
   contentRepositoryProblem,
   exportWordPress,
   formatAdminResult,
+  formatAdminText,
+  formatMarkdownImport,
   formatWordPressExport,
   formatWordPressImport,
+  importMarkdown,
   importWordPress,
+  MarkdownFolderError,
+  markdownFolderChoices,
   nightlyCheck,
   reportDue,
   reportNightly,
@@ -39,6 +47,8 @@ import {
   setBrokerAddress,
   setUpContentRepository,
   update,
+  writeAdminText,
+  writeTaskDescription,
 } from "@goodfellow-cms/core/node";
 import { writePagesSearchIndex, writeSearchIndex } from "@goodfellow-cms/core/search-index";
 import { addShadcnBlock, blockWorks, formatShadcnBlock, ShadcnBlockError } from "@goodfellow-cms/core/shadcn";
@@ -49,15 +59,19 @@ import {
   builtPages,
   checkPages,
   exportedPages,
+  exportTrailingSlash,
   fixSegmentFiles,
   guardExport,
   NEXT_SITE_FILES,
+  nextDistDir,
   writeBuildRecordFile,
   writeCalendarFiles,
   writeContentApi,
   writeEditorPolicy,
+  writeExportHeaders,
   writeFeedFiles,
   writeFontFiles,
+  writeImageFiles,
   writePageLanguages,
   writePluginFiles,
   writeRedirectFiles,
@@ -69,6 +83,19 @@ const CONFIG_FILES = ["goodfellow.config.tsx", "goodfellow.config.ts", "goodfell
 // A full-stack site (withGoodfellow(config, { server: true })): Next.js serves its pages and sends redirects
 // itself, so the calendar files, feeds and the search index are written into public/, which `next start` and hosts
 // serve as static files, as they are for an export.
+// A theme installed before it was three days old is used only once its provenance checks out, whatever the
+// admin panel said, since a browser can lie.
+if (command === "finish") {
+  // Pages' full addresses end as Next.js served the pages, unless where the site is built says otherwise.
+  process.env.GOODFELLOW_TRAILING_SLASH ||= String(await exportTrailingSlash());
+  try {
+    const theme = await checkEarlyTheme(process.cwd());
+    if (theme) console.log(`${theme.name} ${theme.release} was installed early: its provenance checks out.`);
+  } catch (error) {
+    console.error(error instanceof Error ? error.message : error);
+    process.exit(1);
+  }
+}
 if (command === "finish" && dir === "--server") {
   // Next.js renders a full-stack site's pages as it serves them, so nothing can put a guard first in each.
   const config = CONFIG_FILES.find((file) => existsSync(file));
@@ -80,13 +107,15 @@ if (command === "finish" && dir === "--server") {
   }
   for (const folder of await buildFileFolders()) await rm(`public/${folder}`, { recursive: true, force: true });
   // The editor's frames' page, which next start serves as it was rendered.
-  await writeEditorPolicy(".next/server/app");
+  await writeEditorPolicy(join(await nextDistDir(), "server/app"));
   const calendars = await writeCalendarFiles("public");
   if (calendars > 0) console.log(`Wrote ${calendars} calendar files, in public/calendars`);
   const feeds = await writeFeedFiles("public");
   if (feeds > 0) console.log(`Wrote ${feeds} feeds, in public/feeds`);
   const api = await writeContentApi("public");
   if (api !== undefined) console.log(`Wrote the content API, with ${api} pages, in public/api`);
+  // The admin panel's text in the site's own languages, for the sign-in screen, which can't read the site yet.
+  for (const line of formatAdminText(await writeAdminText("public"))) console.log(line);
   // Before the pages are read, so the search index and the checks see each page's language.
   const languages = await writePageLanguages(undefined);
   if (languages > 0) console.log(`Marked ${languages} pages with their language`);
@@ -117,8 +146,20 @@ if (command === "update") {
   process.exit(result.state === "failed" ? 1 : 0);
 }
 if (command === "task") {
-  const { values } = parseArgs({ args: process.argv.slice(3), options: { out: { type: "string" } } });
+  const { values } = parseArgs({
+    args: process.argv.slice(3),
+    options: { out: { type: "string" }, describe: { type: "boolean" } },
+  });
   const env = process.env;
+  if (values.describe) {
+    await writeTaskDescription(
+      ".",
+      { module: new URL("../dist/export.js", import.meta.url).href, export: "loadTaskConfig" },
+      { plugin: env.GOODFELLOW_TASK_PLUGIN ?? "", task: env.GOODFELLOW_TASK_NAME ?? "" },
+      values.out,
+    );
+    process.exit(0);
+  }
   await writeTaskResult(
     ".",
     {
@@ -202,10 +243,39 @@ if (command === "import") {
   const { positionals, values } = parseArgs({
     args: process.argv.slice(3),
     allowPositionals: true,
-    options: { "dry-run": { type: "boolean" } },
+    options: {
+      "dry-run": { type: "boolean" },
+      pages: { type: "string", multiple: true },
+      collection: { type: "string", multiple: true },
+      "replace-home": { type: "boolean" },
+      "replace-pages": { type: "boolean" },
+      drafts: { type: "boolean" },
+      menu: { type: "boolean" },
+      "keep-fields": { type: "boolean" },
+    },
   });
   const [kind, from] = positionals;
   const problem = contentRepositoryProblem(".");
+  if (kind === "markdown" && from && !problem) {
+    try {
+      const result = await importMarkdown(".", from, {
+        folders: markdownFolderChoices(values.pages, values.collection),
+        replaceHome: values["replace-home"],
+        replacePages: values["replace-pages"],
+        drafts: values.drafts,
+        menu: values.menu,
+        keepFields: values["keep-fields"],
+        dryRun: values["dry-run"],
+        log: (line) => console.log(line),
+      });
+      console.log(formatMarkdownImport(result));
+      process.exit(0);
+    } catch (error) {
+      if (!(error instanceof MarkdownFolderError)) throw error;
+      console.error(error.message);
+      process.exit(1);
+    }
+  }
   if (kind === "wordpress" && from && !problem) {
     try {
       const result = await importWordPress(".", from, { dryRun: values["dry-run"], log: (line) => console.log(line) });
@@ -270,6 +340,8 @@ if (command !== "finish" && command !== "index") {
       "       goodfellow-next nightly [--mode changed|always|off] [--output <file>]",
       "       goodfellow-next content link|copy [folder]",
       "       goodfellow-next import wordpress <file or address> [--dry-run]",
+      "       goodfellow-next import markdown <folder> [--dry-run] [--pages <folder>] [--collection <folder>]",
+      "                                        [--replace-home] [--replace-pages] [--drafts] [--menu] [--keep-fields]",
       "       goodfellow-next export wordpress [file]",
       "       goodfellow-next blocks add <item> [--registry <folder>] [--native <app>]",
       "       goodfellow-next admin add <address> | check | remove",
@@ -299,7 +371,9 @@ if (command !== "finish" && command !== "index") {
       "        or copies them from it, as builds do.",
       "import  Brings a WordPress site's pages, posts, categories, tags, menus and media into",
       "        this site, from its export file (Tools → Export) or its address. With --dry-run,",
-      "        says what it would bring across and changes nothing.",
+      "        says what it would bring across and changes nothing. import markdown brings a folder",
+      "        of Markdown files in: the files at the top as pages, each folder as a collection,",
+      "        unless --pages or --collection names it (. for the top).",
       "export  Writes this site as a WordPress export file (default: named after the site),",
       "        which WordPress imports with Tools → Import → WordPress.",
       "blocks  Installs a shadcn registry item (button, @acme/hero, or an item's address) with",
@@ -328,6 +402,7 @@ if (command === "finish") {
   if (feeds > 0) console.log(`Wrote ${feeds} feeds`);
   const api = await writeContentApi(dir);
   if (api !== undefined) console.log(`Wrote the content API, with ${api} pages, in api/`);
+  for (const line of formatAdminText(await writeAdminText(dir))) console.log(line);
   const languages = await writePageLanguages(dir);
   if (languages > 0) console.log(`Marked ${languages} pages with their language`);
   // Before the redirects' pages, which aren't the site's.
@@ -339,7 +414,10 @@ if (command === "finish") {
       `Cloudflare Pages reads only the first ${CLOUDFLARE_REDIRECTS_LIMIT.toLocaleString("en")} lines of _redirects, so ${redirects.cloudflareLeft} old address${redirects.cloudflareLeft === 1 ? " is" : "es are"} left to the pages that send visitors on.`,
     );
   }
-  for (const line of buildNotes(await writeFontFiles(dir))) console.log(line);
+  // Cloudflare Pages' header rules, after the site's own public/_headers.
+  await writeExportHeaders(dir);
+  const images = await writeImageFiles(dir);
+  for (const line of buildNotes({ ...(await writeFontFiles(dir)), ...(images && { images }) })) console.log(line);
   // Plugins' admin frames and build steps, once Goodfellow has written the rest, before the index and the guards.
   const plugins = await writePluginFiles(dir);
   if (plugins.frames.length > 0) console.log(`Wrote the admin frames of ${plugins.frames.join(", ")}`);

package/dist/admin.js

@@ -1,12 +1,12 @@
 "use client";
-import { n as EDITOR_PAGE, t as ADMIN_PAGE } from "./site-files-BeLnLxCl.js";
+import { n as EDITOR_PAGE, t as ADMIN_PAGE } from "./site-files-Cmu3ovIs.js";
 import { ADMIN_POLICY, DEV_EDITOR_PREFIX } from "@goodfellow-cms/core";
 import { useEffect, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Admin, OutdatedAdminPage, reloadFrames } from "@goodfellow-cms/admin";
 import "@goodfellow-cms/admin/styles.css";
 //#region src/generated/theme-css.ts
-var theme_css_default = "/*\n * Maps the site theme (CSS variables written from content/site.json) onto\n * Tailwind, so classes like bg-primary, text-muted-foreground, font-heading and\n * rounded-lg follow the theme. Import after \"tailwindcss\".\n */\n/*\n * Blocks' dark: classes apply only where the site has dark mode\n * (Site Settings), which gives its pages <meta name=\"color-scheme\"\n * content=\"light dark\">: when the visitor's computer is set to dark, or when\n * the admin panel's preview shows the site dark. Light-only sites never\n * use them, even on a computer set to dark.\n */\n@custom-variant dark {\n  @media (prefers-color-scheme: dark) {\n    &:where(\n        :root:has(meta[name=\"color-scheme\"][content~=\"dark\"]):not([data-gf-color-scheme=\"light\"]),\n        :root:has(meta[name=\"color-scheme\"][content~=\"dark\"]):not([data-gf-color-scheme=\"light\"]) *\n      ) {\n      @slot;\n    }\n  }\n  &:where([data-gf-color-scheme=\"dark\"], [data-gf-color-scheme=\"dark\"] *) {\n    @slot;\n  }\n}\n\n@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  --color-secondary: var(--secondary);\n  --color-secondary-foreground: var(--secondary-foreground);\n  --color-muted: var(--muted);\n  --color-muted-foreground: var(--muted-foreground);\n  --color-accent: var(--accent);\n  --color-accent-foreground: var(--accent-foreground);\n  --color-border: var(--border);\n  /* The rest of shadcn/ui's colors, for blocks built with it, follow the ones above unless custom CSS sets them. */\n  --color-card: var(--card, var(--background));\n  --color-card-foreground: var(--card-foreground, var(--foreground));\n  --color-popover: var(--popover, var(--background));\n  --color-popover-foreground: var(--popover-foreground, var(--foreground));\n  --color-destructive: var(--destructive, #dc2626);\n  --color-input: var(--input, var(--border));\n  --color-ring: var(--ring, var(--primary));\n  --font-sans: var(--gf-font-body);\n  --font-heading: var(--gf-font-heading);\n  --radius-sm: calc(var(--radius) - 4px);\n  --radius-md: calc(var(--radius) - 2px);\n  --radius-lg: var(--radius);\n  --radius-xl: calc(var(--radius) + 4px);\n}\n\n@layer base {\n  *,\n  ::before,\n  ::after {\n    border-color: var(--color-border);\n  }\n\n  body {\n    background-color: var(--color-background);\n    color: var(--color-foreground);\n    /* Keeps the footer at the bottom of short pages. */\n    display: flex;\n    flex-direction: column;\n    min-height: 100dvh;\n  }\n\n  .gf-main {\n    flex: 1;\n  }\n\n  /* The credits of the photos on a page, which their licenses ask for. */\n  .gf-credits {\n    max-width: 72rem;\n    margin: 0 auto;\n    padding: 1.5rem 1rem;\n    font-size: 0.75rem;\n    line-height: 1.5;\n    color: var(--color-muted-foreground);\n  }\n\n  .gf-credits a {\n    text-decoration: underline;\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-family: var(--font-heading);\n  }\n}\n";
+var theme_css_default = "/*\n * Maps the site theme (CSS variables written from content/site.json) onto\n * Tailwind, so classes like bg-primary, text-muted-foreground, font-heading and\n * rounded-lg follow the theme. Import after \"tailwindcss\".\n */\n/*\n * Blocks' dark: classes apply only where the site has dark mode\n * (Site Settings), which gives its pages <meta name=\"color-scheme\"\n * content=\"light dark\">: when the visitor's computer is set to dark, or when\n * the admin panel's preview shows the site dark. Light-only sites never\n * use them, even on a computer set to dark.\n */\n@custom-variant dark {\n  @media (prefers-color-scheme: dark) {\n    &:where(\n        :root:has(meta[name=\"color-scheme\"][content~=\"dark\"]):not([data-gf-color-scheme=\"light\"]),\n        :root:has(meta[name=\"color-scheme\"][content~=\"dark\"]):not([data-gf-color-scheme=\"light\"]) *\n      ) {\n      @slot;\n    }\n  }\n  &:where([data-gf-color-scheme=\"dark\"], [data-gf-color-scheme=\"dark\"] *) {\n    @slot;\n  }\n}\n\n@theme inline {\n  --color-background: var(--background);\n  --color-foreground: var(--foreground);\n  --color-primary: var(--primary);\n  --color-primary-foreground: var(--primary-foreground);\n  --color-secondary: var(--secondary);\n  --color-secondary-foreground: var(--secondary-foreground);\n  --color-muted: var(--muted);\n  --color-muted-foreground: var(--muted-foreground);\n  --color-accent: var(--accent);\n  --color-accent-foreground: var(--accent-foreground);\n  --color-border: var(--border);\n  /* The rest of shadcn/ui's colors, for blocks built with it, follow the ones above unless custom CSS sets them. */\n  --color-card: var(--card, var(--background));\n  --color-card-foreground: var(--card-foreground, var(--foreground));\n  --color-popover: var(--popover, var(--background));\n  --color-popover-foreground: var(--popover-foreground, var(--foreground));\n  --color-destructive: var(--destructive, #dc2626);\n  --color-input: var(--input, var(--border));\n  --color-ring: var(--ring, var(--primary));\n  --font-sans: var(--gf-font-body);\n  --font-heading: var(--gf-font-heading);\n  --radius-sm: calc(var(--radius) - 4px);\n  --radius-md: calc(var(--radius) - 2px);\n  --radius-lg: var(--radius);\n  --radius-xl: calc(var(--radius) + 4px);\n}\n\n@layer base {\n  *,\n  ::before,\n  ::after {\n    border-color: var(--color-border);\n  }\n\n  body {\n    background-color: var(--color-background);\n    color: var(--color-foreground);\n    /* Keeps the footer at the bottom of short pages. */\n    display: flex;\n    flex-direction: column;\n    min-height: 100dvh;\n  }\n\n  .gf-main {\n    flex: 1;\n  }\n\n  /* The credits of the photos on a page, which their licenses ask for. */\n  .gf-credits {\n    max-width: 72rem;\n    margin: 0 auto;\n    padding: 1.5rem 1rem;\n    font-size: 0.75rem;\n    line-height: 1.5;\n    color: var(--color-muted-foreground);\n  }\n\n  .gf-credits a {\n    text-decoration: underline;\n  }\n\n  /*\n   * On a site that asks visitors before loading other sites' content: the\n   * notice, and what's shown in a held-back player's place.\n   */\n  .gf-consent {\n    position: fixed;\n    inset-inline: 1rem;\n    bottom: 1rem;\n    z-index: 50;\n    max-width: 40rem;\n    margin-inline: auto;\n    display: flex;\n    flex-direction: column;\n    gap: 0.75rem;\n    padding: 1rem;\n    border: 1px solid var(--color-border);\n    border-radius: var(--radius-lg);\n    background-color: var(--color-background);\n    color: var(--color-foreground);\n    box-shadow: 0 10px 30px rgb(0 0 0 / 0.15);\n    font-size: 0.875rem;\n    line-height: 1.5;\n  }\n\n  .gf-consent a {\n    text-decoration: underline;\n  }\n\n  .gf-consent-buttons {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: flex-end;\n    gap: 0.5rem;\n  }\n\n  .gf-consent button,\n  .gf-consent-placeholder button {\n    padding: 0.5rem 1rem;\n    border: 1px solid var(--color-border);\n    border-radius: var(--radius-md);\n    font-weight: 500;\n    cursor: pointer;\n  }\n\n  .gf-consent [data-gf-consent-accept],\n  .gf-consent-placeholder button {\n    border-color: var(--color-primary);\n    background-color: var(--color-primary);\n    color: var(--color-primary-foreground);\n  }\n\n  .gf-consent-placeholder {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    gap: 0.75rem;\n    padding: 1rem;\n    border-radius: inherit;\n    background-color: var(--color-muted);\n    color: var(--color-foreground);\n    font-size: 0.875rem;\n    text-align: center;\n  }\n\n  /* In a form, beside its other fields, rather than over a player. */\n  .gf-consent-placeholder.gf-consent-inline {\n    position: static;\n    align-items: flex-start;\n    text-align: start;\n    border-radius: var(--radius-md);\n  }\n\n  .gf-consent-box {\n    position: relative;\n  }\n\n  /* A choice for each kind of content, which Choose shows. */\n  .gf-consent-choices {\n    display: flex;\n    flex-direction: column;\n    gap: 0.5rem;\n    margin: 0;\n    padding: 0;\n    border: 0;\n  }\n\n  .gf-consent-choices label {\n    display: flex;\n    align-items: flex-start;\n    gap: 0.5rem;\n  }\n\n  .gf-consent-choices input {\n    margin-top: 0.25rem;\n    accent-color: var(--color-primary);\n  }\n\n  /* Hidden until the consent script shows them, whatever else styles them. */\n  .gf-consent[hidden],\n  .gf-consent-placeholder[hidden],\n  .gf-consent-choices[hidden],\n  .gf-consent button[hidden] {\n    display: none;\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    font-family: var(--font-heading);\n  }\n}\n";
 //#endregion
 //#region src/admin.tsx
 /**

package/dist/components.d.ts

@@ -10,11 +10,28 @@ export declare function NextImage({ src, alt, width, height, loading, ...props }
  * Marks the current page's links in the site's menus (`data-current`, and
  * `aria-current` for the page itself), as Menu does when it knows the page. The
  * layout's header and footer are shared by every page, so they can't know it;
- * this runs in the browser after every navigation instead.
+ * this runs in the browser after every navigation instead, and closes a menu
+ * button's links, which would otherwise stay open on the new page.
  */
 export declare function CurrentMenuLinks({ basePath }: {
   basePath?: string;
 }): null;
+/**
+ * Counts each page visitors move to with GoatCounter, whose script counts only
+ * the page it loads on. Plausible's and Umami's scripts follow Next.js's
+ * navigations themselves. Does nothing until the script has loaded, which on a
+ * site that asks visitors first is once they allow statistics.
+ */
+export declare function GoatCounterNavigation(): null;
+/**
+ * Opens the Search box's results with Next.js's navigation, and loads them
+ * ahead when they're pointed at or reached with the keyboard, as `next/link`
+ * does. The Search box writes its results itself (`searchScript()`), as plain
+ * links, so pages built with `goodfellow build` need no React for them.
+ */
+export declare function SearchResultLinks({ basePath }: {
+  basePath?: string;
+}): null;
 /**
  * On a site in several languages, says the page's language on `<html>`, which
  * the root layout shared by every page can't. `goodfellow-next finish` writes

package/dist/components.js

@@ -1,7 +1,7 @@
 "use client";
 import { CurrentPathProvider } from "@goodfellow-cms/react";
-import { usePathname } from "next/navigation";
-import { useEffect } from "react";
+import { usePathname, useRouter } from "next/navigation";
+import { useEffect, useRef } from "react";
 import Image from "next/image";
 import Link from "next/link";
 import { jsx } from "react/jsx-runtime";
@@ -29,7 +29,8 @@ function trimSlash(path) {
 * Marks the current page's links in the site's menus (`data-current`, and
 * `aria-current` for the page itself), as Menu does when it knows the page. The
 * layout's header and footer are shared by every page, so they can't know it;
-* this runs in the browser after every navigation instead.
+* this runs in the browser after every navigation instead, and closes a menu
+* button's links, which would otherwise stay open on the new page.
 */
 function CurrentMenuLinks({ basePath = "" }) {
 	const pathname = usePathname();
@@ -45,10 +46,70 @@ function CurrentMenuLinks({ basePath = "" }) {
 			if (exact) link.setAttribute("aria-current", "page");
 			else link.removeAttribute("aria-current");
 		}
+		for (const panel of document.querySelectorAll("[data-gf-menu] details[open]")) panel.open = false;
 	}, [pathname, basePath]);
 	return null;
 }
 /**
+* Counts each page visitors move to with GoatCounter, whose script counts only
+* the page it loads on. Plausible's and Umami's scripts follow Next.js's
+* navigations themselves. Does nothing until the script has loaded, which on a
+* site that asks visitors first is once they allow statistics.
+*/
+function GoatCounterNavigation() {
+	const pathname = usePathname();
+	const first = useRef(true);
+	useEffect(() => {
+		if (first.current) {
+			first.current = false;
+			return;
+		}
+		window.goatcounter?.count?.({ path: location.pathname + location.search });
+	}, [pathname]);
+	return null;
+}
+/**
+* Opens the Search box's results with Next.js's navigation, and loads them
+* ahead when they're pointed at or reached with the keyboard, as `next/link`
+* does. The Search box writes its results itself (`searchScript()`), as plain
+* links, so pages built with `goodfellow build` need no React for them.
+*/
+function SearchResultLinks({ basePath = "" }) {
+	const router = useRouter();
+	useEffect(() => {
+		const prefix = trimSlash(basePath) === "/" ? "" : trimSlash(basePath);
+		/** A result's address within the site, without the base path, which Next.js's router adds. */
+		const target = (event) => {
+			const link = event.target?.closest?.("[data-gf-search-box] a[href]");
+			if (!(link instanceof HTMLAnchorElement) || link.target && link.target !== "_self") return void 0;
+			const url = new URL(link.href, location.href);
+			if (url.origin !== location.origin) return void 0;
+			if (prefix && url.pathname !== prefix && !url.pathname.startsWith(`${prefix}/`)) return void 0;
+			return `${url.pathname.slice(prefix.length) || "/"}${url.search}${url.hash}`;
+		};
+		const open = (event) => {
+			if (event.defaultPrevented || event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
+			const to = target(event);
+			if (!to) return;
+			event.preventDefault();
+			router.push(to);
+		};
+		const prefetch = (event) => {
+			const to = target(event);
+			if (to) router.prefetch(to);
+		};
+		document.addEventListener("click", open);
+		document.addEventListener("pointerover", prefetch);
+		document.addEventListener("focusin", prefetch);
+		return () => {
+			document.removeEventListener("click", open);
+			document.removeEventListener("pointerover", prefetch);
+			document.removeEventListener("focusin", prefetch);
+		};
+	}, [router, basePath]);
+	return null;
+}
+/**
 * On a site in several languages, says the page's language on `<html>`, which
 * the root layout shared by every page can't. `goodfellow-next finish` writes
 * it into exported pages; this keeps it right as visitors move between pages.
@@ -74,4 +135,4 @@ function ByLanguage({ variants }) {
 	});
 }
 //#endregion
-export { ByLanguage, CurrentMenuLinks, NextImage, NextLink, PageLanguage };
+export { ByLanguage, CurrentMenuLinks, GoatCounterNavigation, NextImage, NextLink, PageLanguage, SearchResultLinks };

package/dist/config.d.ts

@@ -11,6 +11,14 @@ export interface GoodfellowNextOptions {
    */
   server?: boolean;
 }
+/**
+ * A redirect's target as Next.js's destination: Next.js reads `:name`, `*`,
+ * `+`, `(`, `)`, `{` and `}` in its path and hash as a pattern, which would
+ * fail the build (`/a/:b` names a value the source doesn't have), so they're
+ * percent-encoded there, which browsers and servers read as the same address.
+ * Next.js escapes its query values itself.
+ */
+export declare function redirectDestination(to: string): string;
 /**
  * Sets up Next.js for a Goodfellow site, in `next.config.ts`:
  * `export default withGoodfellow({ ... })`.
@@ -23,8 +31,10 @@ export interface GoodfellowNextOptions {
  * - Serves images as they are unless the site sets an image loader, since static files can't be optimized on request.
  * - Adds the site's redirects (Site Settings → Redirects) ahead of the site's own, for hosts that
  *   send them, such as Vercel. Others get the pages `goodfellow-next finish` writes at old addresses.
- * - For a site with an admin address, adds header rules that sandbox every page there but the
- *   admin panel's own, for hosts that send headers, such as Vercel.
+ * - Adds header rules for hosts that send them, such as Vercel: the media library's SVGs
+ *   sandboxed, the admin panel unframed, and, for a site with an admin address, every page
+ *   there sandboxed but the admin panel's own, with redirects sending pages opened at the
+ *   wrong one of the two addresses to the right one.
  * - With `{ server: true }`, builds a full-stack site for a server instead of as static
  *   files: see `goodfellowApi()` in `@goodfellow-cms/next/server`.
  * - In `next dev`, runs the admin panel's local backend, so publishing saves to

package/dist/config.js

@@ -1,9 +1,10 @@
-import { CALENDARS_DIR, FEEDS_DIR, allPages, brokerOrigin, configAdmin, configBroker, loadSiteContent, normalizeBase, redirectFrom, redirectProblems, shownContent, vercelAdminHeaders } from "@goodfellow-cms/core";
-import { BUILD_DATES_DIR, BUILD_DATES_ENV, DEV_API_PREFIX, builtSiteSource, contentRepositoryProblem, handleDevApi, isLocalOrigin, localFileStore, localRegistryDir } from "@goodfellow-cms/core/node";
+import { n as IMAGE_SIZES_ENV, r as IMAGE_SIZES_MARK, t as DIST_DIR_RECORD } from "./image-sizes-mark-BOE7ObB9.js";
+import { CALENDARS_DIR, FEEDS_DIR, TRAILING_SLASH_VARIABLE, allPages, brokerOrigin, buildNotes, configAdmin, configBroker, loadSiteContent, normalizeBase, redirectFrom, redirectProblems, shownContent, vercelAdminRedirects, vercelHeaders } from "@goodfellow-cms/core";
+import { BUILD_DATES_DIR, BUILD_DATES_ENV, DEV_API_PREFIX, builtSiteSource, contentRepositoryProblem, handleDevApi, hostFonts, isAllowedDevHost, isLocalOrigin, localFileStore, localRegistryDir } from "@goodfellow-cms/core/node";
 import { existsSync, readFileSync } from "node:fs";
-import { rm } from "node:fs/promises";
+import { mkdir, rm, writeFile } from "node:fs/promises";
 import { createServer } from "node:http";
-import { join, resolve } from "node:path";
+import { dirname, join, resolve } from "node:path";
 //#region src/config.ts
 const CONFIG_FILES = [
 	"goodfellow.config.tsx",
@@ -17,15 +18,34 @@ function siteAdmin(root) {
 	return file ? configAdmin(readFileSync(file, "utf8")) : void 0;
 }
 /**
-* The admin address's header rules, for hosts that read them from the build,
-* such as Vercel: every page there sandboxed but the admin panel's own, as
-* `goodfellow build`'s `_headers` does on Cloudflare Pages. Next.js adds the base path itself.
+* The site's header rules, for hosts that read them from the build, such as
+* Vercel, as `goodfellow build`'s `_headers` does on Cloudflare Pages: the
+* media library's SVGs sandboxed, the admin panel unframed, and with an admin
+* address every page there sandboxed but the admin panel's own. Next.js adds the base path itself.
 */
-function adminHeaders(root) {
+function siteHeaders(root) {
 	const admin = siteAdmin(root);
 	const file = CONFIG_FILES.map((name) => join(root, name)).find((path) => existsSync(path));
 	const broker = brokerOrigin(file ? configBroker(readFileSync(file, "utf8")) : void 0);
-	return admin ? vercelAdminHeaders(admin, "/", broker) : [];
+	return vercelHeaders({
+		...admin && { admin },
+		...broker && { broker }
+	});
+}
+/**
+* A full-stack site's Google Fonts, copied into its `public/` folder
+* (`hostFonts()`), or `undefined` where it has none or Google can't be
+* reached, which the build says, as `goodfellow build` does.
+*/
+async function hostSiteFonts(root) {
+	const { settings } = await loadSiteContent(builtSiteSource(root));
+	const fonts = await hostFonts(join(root, "public"), settings.theme);
+	if (!fonts) return void 0;
+	if ("unavailable" in fonts) {
+		for (const line of buildNotes({ fonts })) console.warn(line);
+		return;
+	}
+	return fonts;
 }
 /** `PHASE_DEVELOPMENT_SERVER` from `next/constants`, which Node can't import by that name. */
 const PHASE_DEVELOPMENT_SERVER = "phase-development-server";
@@ -41,16 +61,21 @@ function startDevApi(root) {
 	globals[SERVER_KEY] ??= new Promise((resolvePort, reject) => {
 		const store = localFileStore(root);
 		const registryDir = localRegistryDir(root);
-		const editor = import("./dev-editor-CzE9HofK.js").then(({ startDevEditor }) => startDevEditor(root)).catch((error) => {
+		const editor = import("./dev-editor-BYUVUdPI.js").then(({ startDevEditor }) => startDevEditor(root)).catch((error) => {
 			console.error(`The editor's frames can't be served: ${error.message}`);
 			return { serve: async () => false };
 		});
 		const tasks = {
 			root,
-			plugins: async () => (await (await import("./plugins-K5i8XztM.js").then((n) => n.o)).loadSiteConfig(root)).plugins ?? [],
+			plugins: async () => (await (await import("./plugins-UKkfu0Uj.js").then((n) => n.o)).loadSiteConfig(root)).plugins ?? [],
 			server: "next-dev"
 		};
 		const server = createServer(async (req, res) => {
+			const forwarded = req.headers["x-forwarded-host"];
+			if (!isAllowedDevHost(req.headers.host) || forwarded !== void 0 && !isAllowedDevHost(String(forwarded))) {
+				res.writeHead(403).end();
+				return;
+			}
 			if (await (await editor).serve(req, res)) return;
 			if (!await handleDevApi(store, req, res, {
 				trustOrigin: isLocalOrigin,
@@ -94,6 +119,25 @@ function redirectSource(path) {
 	return encodeURI(path).replace(/[()[\]{}+*?:!]/g, "\\$&");
 }
 /**
+* A redirect's target as Next.js's destination: Next.js reads `:name`, `*`,
+* `+`, `(`, `)`, `{` and `}` in its path and hash as a pattern, which would
+* fail the build (`/a/:b` names a value the source doesn't have), so they're
+* percent-encoded there, which browsers and servers read as the same address.
+* Next.js escapes its query values itself.
+*/
+function redirectDestination(to) {
+	const target = to.trim();
+	const origin = /^https:\/\/[^/?#]*/i.exec(target)?.[0] ?? "";
+	const rest = target.slice(origin.length);
+	const query = rest.indexOf("?");
+	const hash = rest.indexOf("#");
+	const encode = (part) => part.replace(/[:*+(){}]/g, (character) => `%${character.charCodeAt(0).toString(16).toUpperCase()}`);
+	const pathEnd = [query, hash].filter((index) => index >= 0).reduce((a, b) => Math.min(a, b), rest.length);
+	const search = query >= 0 && (hash < 0 || query < hash) ? rest.slice(query, hash > query ? hash : void 0) : "";
+	const fragment = hash >= 0 ? rest.slice(hash) : "";
+	return `${origin}${encode(rest.slice(0, pathEnd))}${search}${encode(fragment)}`;
+}
+/**
 * The site's redirects (`content/redirects.json`) for hosts that send them
 * themselves, such as Vercel, which reads them from the build. Redirects from
 * an address a page or a collection's item has are left out, since pages win,
@@ -110,12 +154,33 @@ async function siteRedirects(root) {
 		if (problems[index] || !from.ok || taken.has(from.path)) return [];
 		return [{
 			source: redirectSource(from.path),
-			destination: redirect.to.trim(),
+			destination: redirectDestination(redirect.to),
 			permanent: true
 		}];
 	});
 }
 /**
+* Pages opened at the wrong one of the Site address and the admin address,
+* sent to the right one before anything loads, for hosts that send redirects,
+* such as Vercel (`vercelAdminRedirects()`). The Site address is
+* `content/site.json`'s own, never a copy's, which leaves the admin address
+* out. Their addresses already have the base path, so Next.js adds none.
+*/
+function adminRedirects(root, basePath) {
+	const admin = siteAdmin(root);
+	if (!admin) return [];
+	let siteUrl;
+	try {
+		siteUrl = JSON.parse(readFileSync(join(root, "content/site.json"), "utf8")).url;
+	} catch {
+		return [];
+	}
+	return vercelAdminRedirects(admin, typeof siteUrl === "string" ? siteUrl : void 0, `${basePath}/`).map((rule) => ({
+		...rule,
+		basePath: false
+	}));
+}
+/**
 * Sets up Next.js for a Goodfellow site, in `next.config.ts`:
 * `export default withGoodfellow({ ... })`.
 *
@@ -127,8 +192,10 @@ async function siteRedirects(root) {
 * - Serves images as they are unless the site sets an image loader, since static files can't be optimized on request.
 * - Adds the site's redirects (Site Settings → Redirects) ahead of the site's own, for hosts that
 *   send them, such as Vercel. Others get the pages `goodfellow-next finish` writes at old addresses.
-* - For a site with an admin address, adds header rules that sandbox every page there but the
-*   admin panel's own, for hosts that send headers, such as Vercel.
+* - Adds header rules for hosts that send them, such as Vercel: the media library's SVGs
+*   sandboxed, the admin panel unframed, and, for a site with an admin address, every page
+*   there sandboxed but the admin panel's own, with redirects sending pages opened at the
+*   wrong one of the two addresses to the right one.
 * - With `{ server: true }`, builds a full-stack site for a server instead of as static
 *   files: see `goodfellowApi()` in `@goodfellow-cms/next/server`.
 * - In `next dev`, runs the admin panel's local backend, so publishing saves to
@@ -150,21 +217,36 @@ function withGoodfellow(nextConfig = {}, options = {}) {
 			images: imageSettings(nextConfig.images),
 			env: {
 				...nextConfig.env,
-				GOODFELLOW_BASE_PATH: basePath
+				GOODFELLOW_BASE_PATH: basePath,
+				[TRAILING_SLASH_VARIABLE]: String(nextConfig.trailingSlash ?? true)
 			}
 		};
 		if (phase === PHASE_PRODUCTION_BUILD) {
+			await mkdir(dirname(join(root, DIST_DIR_RECORD)), { recursive: true });
+			await writeFile(join(root, DIST_DIR_RECORD), nextConfig.distDir ?? ".next");
 			const dates = join(root, nextConfig.distDir ?? ".next", BUILD_DATES_DIR);
 			await rm(dates, {
 				recursive: true,
 				force: true
 			});
 			process.env[BUILD_DATES_ENV] = dates;
+			const mark = join(root, nextConfig.distDir ?? ".next", IMAGE_SIZES_MARK);
+			await rm(mark, { force: true });
+			if (!options.server && config.images?.unoptimized) {
+				process.env[IMAGE_SIZES_ENV] = "1";
+				await mkdir(dirname(mark), { recursive: true });
+				await writeFile(mark, "");
+			} else delete process.env[IMAGE_SIZES_ENV];
 		}
 		if (phase !== PHASE_DEVELOPMENT_SERVER && options.server) {
 			if (siteAdmin(root)) throw new Error("A full-stack site can't have an admin address: its admin panel signs in with the site's own sign-in.");
+			const fonts = phase === PHASE_PRODUCTION_BUILD ? await hostSiteFonts(root) : void 0;
 			return {
 				...config,
+				...fonts && { env: {
+					...config.env,
+					GOODFELLOW_FONTS: JSON.stringify(fonts)
+				} },
 				images: nextConfig.images,
 				outputFileTracingIncludes: {
 					...nextConfig.outputFileTracingIncludes,
@@ -174,14 +256,19 @@ function withGoodfellow(nextConfig = {}, options = {}) {
 						"./public/media/**/*"
 					]
 				},
-				redirects: async () => [...await siteRedirects(root), ...await nextConfig.redirects?.() ?? []]
+				redirects: async () => [...await siteRedirects(root), ...await nextConfig.redirects?.() ?? []],
+				headers: async () => [...siteHeaders(root), ...await nextConfig.headers?.() ?? []]
 			};
 		}
 		if (phase !== PHASE_DEVELOPMENT_SERVER) return {
 			output: "export",
 			...config,
-			redirects: async () => [...await siteRedirects(root), ...await nextConfig.redirects?.() ?? []],
-			...siteAdmin(root) && { headers: async () => [...adminHeaders(root), ...await nextConfig.headers?.() ?? []] }
+			redirects: async () => [
+				...adminRedirects(root, basePath),
+				...await siteRedirects(root),
+				...await nextConfig.redirects?.() ?? []
+			],
+			...(siteAdmin(root) || process.env.VERCEL) && { headers: async () => [...siteHeaders(root), ...await nextConfig.headers?.() ?? []] }
 		};
 		const port = await startDevApi(root);
 		const rewrite = {
@@ -216,4 +303,4 @@ function withGoodfellow(nextConfig = {}, options = {}) {
 	};
 }
 //#endregion
-export { withGoodfellow };
+export { redirectDestination, withGoodfellow };

package/dist/{dev-editor-CzE9HofK.js → dev-editor-BYUVUdPI.js}

@@ -1,4 +1,4 @@
-import { i as loadSiteConfig, t as buildPluginFrame } from "./plugins-K5i8XztM.js";
+import { i as loadSiteConfig, t as buildPluginFrame } from "./plugins-UKkfu0Uj.js";
 import { DEV_EDITOR_PREFIX, EDITOR_PRELUDE, editorPage, pluginId } from "@goodfellow-cms/core";
 import { existsSync } from "node:fs";
 import { mkdir, readFile, writeFile } from "node:fs/promises";