hd-garden 0.5.0 → 0.5.2

package/app/lib/remark-link-card.mjs

@@ -0,0 +1,85 @@
+import { toString } from "mdast-util-to-string";
+
+/**
+ * `[text](url){card}` asks for a link card.
+ *
+ * - The marker only counts written straight after the link's `)`. Inside code
+ *   it is plain text and stays.
+ * - A paragraph that is nothing but the marked link becomes the card itself,
+ *   in the same spot; the inline link is not kept.
+ * - Otherwise the link stays in the sentence and its card follows the
+ *   paragraph (inside the same list item or quote).
+ *
+ * Cards are `garden-linkcard` elements carrying `data-url`, `data-text` and,
+ * for the standalone form, `data-standalone`.
+ */
+
+const MARKER = "{card}";
+const isHttp = (url) => /^https?:\/\//iu.test(url ?? "");
+
+function writtenAsLink(node, source) {
+  if (!source || node.position?.end?.offset === undefined) return true;
+  return source[node.position.end.offset - 1] === ")";
+}
+
+function cardNode(link, standalone) {
+  const properties = { dataUrl: link.url, dataText: toString(link).trim() };
+  if (standalone) properties.dataStandalone = "true";
+  return { type: "linkCard", data: { hName: "garden-linkcard", hProperties: properties }, children: [] };
+}
+
+const meaningful = (children) =>
+  children.filter((child) => !(child.type === "text" && !child.value.trim()) && child.type !== "break");
+
+/** Take the markers out of one parent's inline children; return the marked links. */
+function takeMarkers(parent, source, sameSite) {
+  const marked = [];
+  const children = parent.children ?? [];
+  for (let index = 0; index < children.length - 1; index += 1) {
+    const link = children[index];
+    const next = children[index + 1];
+    if (link.type !== "link" || next.type !== "text" || !next.value.startsWith(MARKER)) continue;
+    if (!isHttp(link.url) || !writtenAsLink(link, source)) continue;
+    next.value = next.value.slice(MARKER.length);
+    // A link back to this site is an ordinary internal link: the marker goes, no card.
+    if (!sameSite(link.url)) marked.push(link);
+  }
+  parent.children = children.filter((child) => !(child.type === "text" && child.value === ""));
+  return marked;
+}
+
+function walk(parent, source, sameSite) {
+  const children = parent.children ?? [];
+  for (let index = 0; index < children.length; index += 1) {
+    const node = children[index];
+    if (node.type === "code" || node.type === "inlineCode" || node.type === "html") continue;
+    if (node.type !== "paragraph") {
+      if (node.children) {
+        // Headings, table cells and the like: drop the marker, no card.
+        if (node.type === "heading" || node.type === "tableCell") takeMarkers(node, source, sameSite);
+        walk(node, source, sameSite);
+      }
+      continue;
+    }
+    // Links nested in emphasis count too.
+    const marked = takeMarkers(node, source, sameSite);
+    for (const child of node.children) if (child.children && child.type !== "link") marked.push(...takeMarkers(child, source, sameSite));
+    if (!marked.length) continue;
+    const rest = meaningful(node.children);
+    if (marked.length === 1 && rest.length === 1 && rest[0] === marked[0]) {
+      children[index] = cardNode(marked[0], true);
+      continue;
+    }
+    const cards = marked.map((link) => cardNode(link, false));
+    children.splice(index + 1, 0, ...cards);
+    index += cards.length;
+  }
+}
+
+export function remarkLinkCard(options = {}) {
+  const sameSite = typeof options?.sameSite === "function" ? options.sameSite : () => null;
+  return (tree, file) => {
+    const source = typeof file?.value === "string" ? file.value : String(file?.value ?? "");
+    walk(tree, source, sameSite);
+  };
+}

package/app/lib/tag-filter.ts

@@ -22,28 +22,61 @@ export const DEFAULT_VISIBLE_TAGS = 14;
 const byCount = (left: [string, number], right: [string, number]) =>
   right[1] - left[1] || left[0].localeCompare(right[0], "zh");
 
-/** Every tag with its post count, most used first. */
+/** Tags match regardless of case: `Rust`, `rust` and `RUST` are one tag. */
+export const tagKey = (tag: string) => tag.trim().toLocaleLowerCase();
+
+const postKeys = (post: Tagged) => new Set((post.tags ?? []).map(tagKey).filter(Boolean));
+
+/**
+ * Every tag with its post count, most used first. Spellings that differ only
+ * in case count as one tag, shown in its most common spelling.
+ */
 export function tagCounts(posts: readonly Tagged[]): [string, number][] {
   const counts = new Map<string, number>();
+  const spellings = new Map<string, Map<string, number>>();
   for (const post of posts) {
-    for (const tag of new Set(post.tags ?? [])) counts.set(tag, (counts.get(tag) ?? 0) + 1);
+    const seen = new Set<string>();
+    for (const raw of post.tags ?? []) {
+      const tag = raw.trim();
+      const key = tagKey(tag);
+      if (!key) continue;
+      const forms = spellings.get(key) ?? new Map<string, number>();
+      forms.set(tag, (forms.get(tag) ?? 0) + 1);
+      spellings.set(key, forms);
+      if (seen.has(key)) continue;
+      seen.add(key);
+      counts.set(key, (counts.get(key) ?? 0) + 1);
+    }
   }
-  return [...counts.entries()].sort(byCount);
+  return [...counts.entries()]
+    .map(([key, count]): [string, number] => {
+      // Map keeps insertion order, so ties go to the first spelling seen.
+      const [label] = [...(spellings.get(key) ?? new Map([[key, 0]])).entries()].reduce((best, form) => (form[1] > best[1] ? form : best));
+      return [label, count];
+    })
+    .sort(byCount);
 }
 
-/** Selected tags from the repeated URL param, trimmed and de-duplicated, in URL order. */
+/** Selected tags from the repeated URL param, trimmed and de-duplicated (ignoring case), in URL order. */
 export function selectedTags(values: readonly string[]): string[] {
-  const seen = new Set<string>();
+  const seen = new Map<string, string>();
   for (const value of values) {
     const tag = value.trim();
-    if (tag) seen.add(tag);
+    const key = tagKey(tag);
+    if (key && !seen.has(key)) seen.set(key, tag);
   }
-  return [...seen];
+  return [...seen.values()];
+}
+
+/** Selected tags written the way the posts write them (`?t=Rust` becomes `rust`); unknown tags stay as given. */
+export function canonicalTags(posts: readonly Tagged[], selected: readonly string[]): string[] {
+  const labels = new Map(tagCounts(posts).map(([tag]) => [tagKey(tag), tag]));
+  return selected.map((tag) => labels.get(tagKey(tag)) ?? tag);
 }
 
 const hasAll = (post: Tagged, tags: readonly string[]) => {
-  const own = new Set(post.tags ?? []);
-  return tags.every((tag) => own.has(tag));
+  const own = postKeys(post);
+  return tags.every((tag) => own.has(tagKey(tag)));
 };
 
 /** Posts carrying every selected tag (intersection). No selection keeps everything. */
@@ -54,14 +87,15 @@ export function filterByTags<T extends Tagged>(posts: readonly T[], selected: re
 /** One option per known tag plus any selected tag the posts do not use. */
 export function tagOptions(posts: readonly Tagged[], selected: readonly string[]): TagOption[] {
   const current = filterByTags(posts, selected);
-  const chosen = new Set(selected);
+  const chosen = new Set(selected.map(tagKey));
   const options = tagCounts(posts).map(([tag, total]) => {
-    const isSelected = chosen.has(tag);
-    const next = isSelected ? current.length : current.filter((post) => (post.tags ?? []).includes(tag)).length;
+    const key = tagKey(tag);
+    const isSelected = chosen.has(key);
+    const next = isSelected ? current.length : current.filter((post) => postKeys(post).has(key)).length;
     return { tag, total, next, selected: isSelected, disabled: !isSelected && next === 0 };
   });
   for (const tag of selected) {
-    if (!options.some((option) => option.tag === tag)) {
+    if (!options.some((option) => tagKey(option.tag) === tagKey(tag))) {
       options.push({ tag, total: 0, next: 0, selected: true, disabled: false });
     }
   }
@@ -95,9 +129,12 @@ export function visibleTagOptions(options: readonly TagOption[], expanded: boole
   return { shown, hidden: options.length - shown.length };
 }
 
-/** Add the tag if absent, remove it if present. */
+/** Add the tag if absent, remove it if present (in any spelling). */
 export function toggleTag(selected: readonly string[], tag: string): string[] {
-  return selected.includes(tag) ? selected.filter((item) => item !== tag) : [...selected, tag];
+  const key = tagKey(tag);
+  return selected.some((item) => tagKey(item) === key)
+    ? selected.filter((item) => tagKey(item) !== key)
+    : [...selected, tag];
 }
 
 /** `/blog?t=A&t=B`, or `/blog` with no selection. */

package/app/page.tsx

@@ -1,4 +1,5 @@
 import Link from "next/link";
+import { CoverImage } from "./components/CoverImage";
 import { homeListDate } from "./lib/a2-meta";
 import { columns, formatDate, postHref, posts } from "./lib/content";
 import { githubUrl, siteConfig } from "./site.config";
@@ -49,8 +50,7 @@ export default function Home() {
         <article className="sh-feature" aria-labelledby="ft">
           {feature.cover ? (
             <div className="cover">
-              {/* eslint-disable-next-line @next/next/no-img-element */}
-              <img src={feature.cover} alt="" />
+              <CoverImage src={feature.cover} image={feature.coverImage} alt="" sizes="(max-width: 700px) calc(100vw - 40px), 604px" priority />
             </div>
           ) : null}
           <div>
@@ -112,7 +112,7 @@ export default function Home() {
                   <div className="cover" style={{ background: "var(--well)" }}>
                     {first.columnCover ? (
                       // eslint-disable-next-line @next/next/no-img-element
-                      <img src={first.columnCover} alt={first.columnCoverAlt ?? ""} />
+                      <img src={first.columnCover} alt={first.columnCoverAlt ?? ""} loading="lazy" decoding="async" />
                     ) : null}
                   </div>
                   <div className="body">

package/app/rss.xml/route.ts

@@ -3,6 +3,7 @@ import { columnHref, columns, postHref, posts } from "../lib/content";
 import { getPublishedThoughts } from "../lib/public-thoughts";
 import { configuredSiteUrl, siteDescription, siteName } from "../lib/site";
 import { contentForFeed } from "../../ui/core/transform.mjs";
+import { stripCardMarkers } from "../../ui/garden/markdown-links.mjs";
 
 const escapeXml = (value: string) =>
   value
@@ -25,7 +26,7 @@ export async function GET() {
     })),
     ...thoughts.map((thought) => ({
       ...thought,
-      description: thought.content.replace(/\s+/gu, " ").slice(0, 180),
+      description: stripCardMarkers(thought.content).replace(/\s+/gu, " ").slice(0, 180),
       path: `/thoughts/${thought.slug}`,
     })),
   ].sort((a, b) => Date.parse(b.date) - Date.parse(a.date));

package/app/styles/a2.css

@@ -408,6 +408,34 @@ html[data-theme="dark"] .markdown-body a.ext {
   text-decoration-thickness: 2px;
 }
 
+/* Site favicon before an external link, downloaded at build time. */
+.markdown-body a.ext img.fav {
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  margin: 0 5px 0 0;
+  border-radius: 3px;
+  vertical-align: -2px;
+  object-fit: contain;
+}
+
+.markdown-body a.ext .fav-keep {
+  white-space: nowrap;
+}
+
+/* Many icons are black on transparent; give them a light backing in dark mode. */
+html[data-theme="dark"] .markdown-body img.fav {
+  padding: 1px;
+  box-sizing: border-box;
+  background: #f5f4ed;
+}
+
+.markdown-body .table-wrap a.ext img.fav,
+.markdown-body h2 a.ext img.fav,
+.markdown-body h3 a.ext img.fav {
+  display: none;
+}
+
 .markdown-body :not(pre) > code {
   font: 400 var(--fs-small) / 1 var(--mono);
   color: var(--ink);
@@ -438,9 +466,9 @@ html[data-theme="dark"] .markdown-body a.ext {
 }
 
 .markdown-body.prose {
-  --al-note: #30302e;
-  --al-note-bg: #f0eee6;
-  --al-note-line: rgba(20, 20, 19, 0.18);
+  --al-note: #2c55b4;
+  --al-note-bg: #eef3fc;
+  --al-note-line: rgba(44, 85, 180, 0.22);
   --al-tip: #2d6a3e;
   --al-tip-bg: #edf5ef;
   --al-tip-line: rgba(45, 106, 62, 0.22);
@@ -459,9 +487,9 @@ html[data-theme="dark"] .markdown-body a.ext {
 :root[data-theme="dark"] .prose,
 html[data-theme="dark"] .markdown-body.prose,
 html[data-theme="dark"] .prose {
-  --al-note: #eeece7;
-  --al-note-bg: rgba(238, 236, 231, 0.06);
-  --al-note-line: rgba(238, 236, 231, 0.22);
+  --al-note: #93b2f4;
+  --al-note-bg: rgba(147, 178, 244, 0.09);
+  --al-note-line: rgba(147, 178, 244, 0.28);
   --al-tip: #8fcb9f;
   --al-tip-bg: rgba(143, 203, 159, 0.08);
   --al-tip-line: rgba(143, 203, 159, 0.26);
@@ -1443,16 +1471,32 @@ html[data-theme="dark"] .g-quiz-out.no { color: #f29aab; }
 .g-flow .fl-e line, .g-flow .fl-e1 { stroke: var(--muted); stroke-width: 1.3; fill: none; }
 .g-flow .fl-ah { fill: var(--muted); }
 .g-flow .gc-stw { fill: rgba(180, 33, 58, 0.08); stroke: rgba(180, 33, 58, 0.45); }
+/* Link cards: `[text](url){card}`. Title, description and picture come from the build. */
 .prose .link-cards { list-style: none; padding: 0; margin: 24px 0 32px; display: grid; gap: 12px; }
 .prose .link-cards li { margin: 0; padding: 0; }
-.link-card { display: flex; gap: 20px; align-items: stretch; padding: 16px; border: 1px solid var(--rule); border-radius: 12px; color: inherit; text-decoration: none; }
-.prose a.link-card { text-decoration: none; }
+.link-card { display: flex; gap: 20px; align-items: stretch; padding: 16px; border: 1px solid var(--rule); border-radius: 12px; background: transparent; color: inherit; text-decoration: none; transition: border-color .15s ease, background-color .15s ease; }
+.prose a.link-card, .markdown-body a.link-card { text-decoration: none; padding-right: 16px; background-image: none; }
+.link-card:hover { border-color: var(--rule-strong, #cfcbc2); background: var(--card-hover); }
+.link-card:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
 .lc-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
-.lc-site { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--muted); }
-.lc-sitename { color: var(--soft); font-weight: 600; }
+.lc-site { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 13px; line-height: 1.5; color: var(--muted); }
+.markdown-body .lc-site img.fav { display: block; flex: 0 0 auto; width: 14px; height: 14px; margin: 0; border-radius: 3px; object-fit: contain; }
+.lc-sitename { color: var(--soft); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .lc-host { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-.lc-arrow { width: 10px; height: 10px; margin-left: auto; background: var(--muted); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3 1.5h5.5V7M8.5 1.5 1.5 8.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
-.lc-title { font-weight: 600; font-size: 16px; line-height: 1.45; color: var(--ink); }
+.lc-arrow { flex: 0 0 auto; width: 10px; height: 10px; margin-left: auto; background: var(--muted); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3 1.5h5.5V7M8.5 1.5 1.5 8.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
+.lc-title { font-weight: 600; font-size: 16px; line-height: 1.45; color: var(--ink); text-wrap: pretty; }
+.lc-desc { font-size: var(--fs-small); line-height: 1.55; color: var(--soft); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
+.lc-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: auto; padding-top: 4px; font-size: 13px; line-height: 1.5; color: var(--muted); }
+/* Fixed aspect ratio, so a picture arriving late never moves the text. */
+.markdown-body img.lc-thumb { display: block; flex: 0 0 auto; width: 168px; max-width: none; height: auto; aspect-ratio: 1.91 / 1; object-fit: cover; align-self: center; margin: 0; border: 1px solid var(--rule); border-radius: 8px; background: var(--well); }
+@media (max-width: 640px) {
+  .link-card { flex-direction: column-reverse; gap: 12px; padding: 12px; }
+  .prose a.link-card, .markdown-body a.link-card { padding-right: 12px; }
+  .markdown-body img.lc-thumb { width: 100%; }
+}
+@media (prefers-reduced-motion: reduce) {
+  .link-card { transition: none; }
+}
 .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
 .g-chart-t { margin: 0 0 12px; font-weight: 600; color: var(--ink); font-size: 15px; }
 .g-bars { display: grid; grid-template-columns: fit-content(40%) minmax(0, 1fr) max-content; gap: 8px 10px; align-items: center; }

package/app/styles/tokens.css

@@ -90,7 +90,7 @@ html[data-theme="dark"] {
   --accent: var(--blue);
   --accent-soft: var(--blue-tint);
   --selection: rgb(238 236 231 / 18%);
-  --hl: #6b5a2a;
+  --hl: #5e4e17;
   --red: #f29aab;
   --red-text: #f29aab;
   --red-tint: rgb(242 154 171 / 12%);

package/bin/garden.mjs

@@ -354,6 +354,7 @@ function help() {
   garden sync             只从 Markdown 生成索引
   garden new              创建文章草稿
   garden embed            拉取外链摘要
+  garden links            重新拉取外链图标（build 时会自动做）
   garden init [目录]      创建只含稿和配置的新站点
   garden check <文章.md>  检查一篇博文的硬性结构
   garden ui <子命令>      Intelligent UI：scan、check、apply、prompt、schema、catalog
@@ -379,8 +380,13 @@ switch (command) {
     runVinext(["dev", ...rest]);
     break;
   case "build":
+    // Favicons are refetched on every build; failures fall back to link-assets.json.
+    if (process.env.GARDEN_OFFLINE !== "1") runNode("scripts/link-assets.mjs");
     runVinext(["build", ...rest], { copyDist: true });
     break;
+  case "links":
+    runNode("scripts/link-assets.mjs");
+    break;
   case "start":
     runVinext(["start", ...rest]);
     break;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hd-garden",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "private": false,
   "description": "用 Markdown 写作、用 GitHub Pages 发布的个人博客引擎。",
   "license": "MIT",

package/scripts/build-content.mjs

@@ -7,6 +7,12 @@ import { parse as parseYaml, stringify as stringifyYaml } from "yaml";
 import { canonicalSiteDate } from "./site-date.mjs";
 import { contentForFeed, contentToSearchText, transformUiContent } from "../ui/core/transform.mjs";
 import { countDemoWords } from "../ui/garden/word-count.mjs";
+import { referenceDomain } from "../ui/garden/references.mjs";
+import { linkAssetsForRender } from "./link-assets.mjs";
+import { cardUrls } from "../ui/garden/markdown-links.mjs";
+import { configuredSiteAddress, sameSiteMatcher } from "../ui/garden/same-site.mjs";
+import { buildFullIndex, buildSearchIndex } from "../ui/garden/search-index.mjs";
+import { coverImageSet, loadSharp } from "./cover-images.mjs";
 
 function resolveSiteRoot() {
   if (process.env.GARDEN_SITE) return path.resolve(process.env.GARDEN_SITE);
@@ -34,6 +40,9 @@ const siteUrl = (process.env.SITE_URL ?? process.env.NEXT_PUBLIC_SITE_URL ?? "ht
 const publicBaseUrl = basePath && !siteUrl.endsWith(basePath)
   ? `${siteUrl}${basePath}`
   : siteUrl;
+// Full URLs to this address are internal links: no new tab, no card.
+const siteAddress = configuredSiteAddress(siteConfig, process.env);
+const sameSite = sameSiteMatcher(siteAddress, basePath);
 const siteName = process.env.SITE_NAME ?? siteConfig.name;
 const siteDescription = process.env.SITE_DESCRIPTION ?? siteConfig.description;
 
@@ -95,7 +104,8 @@ const normalizeReferences = (value, sourcePath) => {
     if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
       fail(sourcePath, `${where}.url 必须是 http 或 https 链接`);
     }
-    return { title, url };
+    const domain = referenceDomain(url);
+    return domain ? { title, url, domain } : { title, url };
   });
   return references.length ? references : undefined;
 };
@@ -107,6 +117,8 @@ const isExternalAsset = (value) =>
   value.startsWith("#");
 
 const assetCache = new Map();
+/** Published URL → original file and its copy, for making resized covers later. */
+const assetFiles = new Map();
 
 function copyLocalAsset(value, markdownPath, sourcePath, options = {}) {
   if (!value || isExternalAsset(value)) return value;
@@ -136,10 +148,9 @@ function copyLocalAsset(value, markdownPath, sourcePath, options = {}) {
     const destination = path.join(generatedMediaRoot, safeRelative);
     fs.mkdirSync(path.dirname(destination), { recursive: true });
     fs.copyFileSync(absoluteSource, destination);
-    assetCache.set(
-      absoluteSource,
-      `${basePath}/media/${safeRelative.split(path.sep).map(encodeURIComponent).join("/")}`,
-    );
+    const url = `${basePath}/media/${safeRelative.split(path.sep).map(encodeURIComponent).join("/")}`;
+    assetCache.set(absoluteSource, url);
+    assetFiles.set(url, { source: absoluteSource, destination });
   }
 
   return `${assetCache.get(absoluteSource)}${suffix}`;
@@ -537,6 +548,19 @@ const a2WordCounts = fs.existsSync(parityDir)
     }))
   : {};
 
+// Resized WebP covers for lists and article heroes; skipped quietly without sharp.
+const sharp = await loadSharp();
+if (sharp) {
+  const sets = new Map();
+  for (const entry of [...posts, ...columns]) {
+    const files = entry.cover ? assetFiles.get(entry.cover) : undefined;
+    if (!files) continue;
+    if (!sets.has(entry.cover)) sets.set(entry.cover, await coverImageSet({ sharp, ...files, url: entry.cover }));
+    const set = sets.get(entry.cover);
+    if (set) entry.coverImage = set;
+  }
+}
+
 const contentHash = crypto
   .createHash("sha256")
   .update(JSON.stringify({ posts, columns, thoughts, a2WordCounts }))
@@ -564,7 +588,7 @@ export type ContentEntry = {
   publishAt?: string;
   draft?: boolean;
   tags?: string[];
-  references?: { title: string; url?: string }[];
+  references?: { title: string; url?: string; domain?: string }[];
   pinned?: boolean;
   readingTime?: string;
   kind: "post" | "column" | "thought";
@@ -578,6 +602,7 @@ export type ContentEntry = {
   columnCoverAlt?: string;
   order?: number;
   cover?: string;
+  coverImage?: { src: string; srcset: string; width: number; height: number };
   mediaType?: "image" | "audio" | "video" | "link" | "text";
   media?: string | MediaItem[];
   mediaAlt?: string;
@@ -586,22 +611,39 @@ export type ContentEntry = {
   linkDescription?: string;
 };
 
+export type LinkCardMeta = { title: string; description?: string; siteName?: string; author?: string; publishedTime?: string; image?: string };
+export type LinkAssets = { favicons: Record<string, string>; cards: Record<string, LinkCardMeta> };
+
 export const contentHash = "${contentHash}";
 export const posts = ${JSON.stringify(posts, null, 2)} as ContentEntry[];
 export const columns = ${JSON.stringify(columns, null, 2)} as ContentEntry[];
 export const thoughts = ${JSON.stringify(thoughts, null, 2)} as ContentEntry[];
 export const a2WordCounts = ${JSON.stringify(a2WordCounts, null, 2)} as Record<string, number>;
+export const linkAssets = ${JSON.stringify(linkAssetsForRender(root, basePath), null, 2)} as LinkAssets;
 `;
 
 fs.mkdirSync(path.dirname(output), { recursive: true });
 fs.writeFileSync(output, source);
+const fullIndex = buildFullIndex({ posts, columns, thoughts });
 fs.writeFileSync(
   siteConfigOutput,
   `// Generated by garden sync. Edit site.config.yaml instead.
 export const siteConfig = ${JSON.stringify(siteConfig, null, 2)} as const;
 export const githubUrl = ${JSON.stringify(`https://github.com/${siteConfig.author.github}`)};
+// Loaded by the header only when search opens; the hash busts stale caches.
+export const searchIndexUrl = ${JSON.stringify(`${basePath}/search-index.json?v=${contentHash}`)};
+// Every body as plain text, fetched in the background after load; the name changes with the text.
+export const searchFull = ${JSON.stringify({ url: `${basePath}/${fullIndex.fileName}`, hash: fullIndex.hash })};
+// Full URLs to this address render as internal links.
+export const siteLinks = ${JSON.stringify({ address: siteAddress, basePath })};
 `,
 );
+fs.mkdirSync(path.join(root, "public"), { recursive: true });
+fs.writeFileSync(path.join(root, "public", "search-index.json"), JSON.stringify(buildSearchIndex({ posts, columns, thoughts })));
+for (const name of fs.readdirSync(path.join(root, "public"))) {
+  if (/^search-full\.[0-9a-f]+\.json$/u.test(name) && name !== fullIndex.fileName) fs.rmSync(path.join(root, "public", name));
+}
+fs.writeFileSync(path.join(root, "public", fullIndex.fileName), fullIndex.json);
 
 const escapeXml = (value) =>
   value
@@ -662,6 +704,11 @@ const sitemapEntries = [
   ...columns.map((entry) => `/columns/${entry.column}/${columnEntryPath(entry)}/`),
   ...thoughts.map((entry) => `/thoughts/${entry.slug}/`),
 ];
+// Card URLs in published entries: the only pages the link-card Worker may read.
+fs.writeFileSync(
+  path.join(publicRoot, "link-allowlist.json"),
+  `${JSON.stringify({ urls: [...new Set([...posts, ...columns, ...thoughts].flatMap((entry) => cardUrls(entry.content)).filter((url) => !sameSite(url)))].sort() }, null, 2)}\n`,
+);
 fs.writeFileSync(path.join(publicRoot, "sitemap.xml"), `<?xml version="1.0" encoding="UTF-8" ?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">${sitemapEntries.map((entry) => `
   <url><loc>${escapeXml(`${publicBaseUrl}${entry}`)}</loc></url>`).join("")}

package/scripts/cover-images.mjs

@@ -0,0 +1,69 @@
+/**
+ * Resized WebP copies of cover images, made at build time with `sharp` when
+ * the site has it. Originals stay untouched; the copies go next to the
+ * published original under public/media, with a content hash in the name so
+ * they can be cached for a long time.
+ */
+import crypto from "node:crypto";
+import fs from "node:fs";
+import path from "node:path";
+
+export const COVER_WIDTHS = [480, 960, 1440];
+
+export async function loadSharp() {
+  try {
+    return (await import("sharp")).default;
+  } catch {
+    return null;
+  }
+}
+
+const RASTER = /\.(jpe?g|png|webp|avif|tiff?)$/iu;
+
+/** Which widths to make: those below the original, plus the original width when it is under the largest. */
+export function coverWidths(naturalWidth, widths = COVER_WIDTHS) {
+  if (!naturalWidth) return [];
+  const below = widths.filter((width) => width < naturalWidth);
+  if (naturalWidth <= widths[widths.length - 1] && !below.includes(naturalWidth)) below.push(naturalWidth);
+  return below;
+}
+
+/**
+ * `{ src, srcset, width, height }` for one published cover, or null when it
+ * cannot be resized (no sharp, not a raster image, unreadable file).
+ */
+export async function coverImageSet({ sharp, source, destination, url, widths = COVER_WIDTHS, quality = 78 }) {
+  if (!sharp || !RASTER.test(source)) return null;
+  try {
+    const bytes = fs.readFileSync(source);
+    const meta = await sharp(bytes).metadata();
+    if (!meta.width || !meta.height) return null;
+    // EXIF-rotated images swap their sides.
+    const rotated = (meta.orientation ?? 1) >= 5;
+    const width = rotated ? meta.height : meta.width;
+    const height = rotated ? meta.width : meta.height;
+    const hash = crypto.createHash("sha256").update(bytes).digest("hex").slice(0, 8);
+    const stem = path.basename(destination).replace(/\.[^.]+$/u, "");
+    const urlDir = url.slice(0, url.lastIndexOf("/") + 1);
+    const variants = [];
+    for (const target of coverWidths(width, widths)) {
+      const name = `${stem}.${hash}-${target}.webp`;
+      const file = path.join(path.dirname(destination), name);
+      if (!fs.existsSync(file)) {
+        const out = await sharp(bytes).rotate().resize({ width: target, withoutEnlargement: true }).webp({ quality }).toBuffer();
+        fs.writeFileSync(file, out);
+      }
+      variants.push({ width: target, url: `${urlDir}${encodeURIComponent(name)}` });
+    }
+    if (!variants.length) return null;
+    const fallback = variants.find((variant) => variant.width >= 960) ?? variants[variants.length - 1];
+    return {
+      src: fallback.url,
+      srcset: variants.map((variant) => `${variant.url} ${variant.width}w`).join(", "),
+      width,
+      height,
+    };
+  } catch {
+    return null;
+  }
+}