hd-garden 0.5.13 → 0.5.15

package/app/lib/content.ts

@@ -15,24 +15,26 @@ import remarkParse from "remark-parse";
 import { unified } from "unified";
 import { visit } from "unist-util-visit";
 import { splitHeadingNumber } from "./heading-number";
+import { siteHref } from "./site-href";
 
 export { columns, posts, thoughts };
 export type { ContentEntry, MediaItem };
 
-export const postHref = (post: Pick<ContentEntry, "path">) => `/blog/${post.path}`;
+export const postHref = (post: Pick<ContentEntry, "path">) => siteHref(`/blog/${post.path}`);
 export const columnEntryPath = (entry: Pick<ContentEntry, "column" | "path">) => {
   const prefix = entry.column ? `${entry.column}/` : "";
   return prefix && entry.path.startsWith(prefix) ? entry.path.slice(prefix.length) : entry.path;
 };
 export const columnHref = (entry: Pick<ContentEntry, "column" | "path">) =>
-  `/columns/${entry.column}/${columnEntryPath(entry)}`;
+  siteHref(`/columns/${entry.column}/${columnEntryPath(entry)}`);
 
 /** The column a post belongs to (the first one, if it is listed in several). */
 export const columnOfPost = (post: Pick<ContentEntry, "path">) => {
   const entry = columns.find((item) => item.path === post.path && item.column);
   return entry?.column ? { slug: entry.column, title: entry.columnTitle ?? entry.column } : undefined;
 };
-export const columnIndexHref = (slug: string) => `/columns/#${slug}`;
+export const columnIndexHref = (slug: string) => siteHref(`/columns/#${slug}`);
+export const thoughtHref = (slug: string) => siteHref(`/thoughts/${slug}`);
 
 export const formatDate = (value: string, withTime = false) => {
   if (!withTime) return demoDateLabel(value);

package/app/lib/markdown-plugins.ts

@@ -1,15 +1,6 @@
-import remarkGfm from "remark-gfm";
-import remarkCjkFriendly from "remark-cjk-friendly";
-import remarkBreaks from "remark-breaks";
-import remarkMath from "remark-math";
 import type { PluggableList } from "unified";
+import { markdownSyntaxPlugins } from "../../ui/garden/markdown-syntax.mjs";
 import { remarkGarden } from "./remark-garden.mjs";
 
 // Keep article rendering and heading extraction on the same Markdown syntax.
-export const markdownPlugins: PluggableList = [
-  remarkGfm,
-  remarkCjkFriendly,
-  remarkBreaks,
-  remarkMath,
-  remarkGarden,
-];
+export const markdownPlugins: PluggableList = [...markdownSyntaxPlugins, remarkGarden];

package/app/lib/site-href.ts

@@ -0,0 +1,9 @@
+import { siteLinks } from "@garden/site-config";
+import { withTrailingSlash } from "../../ui/garden/site-href.mjs";
+
+/**
+ * Every address inside the site goes through here. Page paths follow Next's
+ * trailingSlash (always on in a static export, TRAILING_SLASH=1 on a server);
+ * ?query and #hash come after the path.
+ */
+export const siteHref = (href: string): string => withTrailingSlash(href, siteLinks?.trailingSlash === true);

package/app/lib/tag-filter.ts

@@ -145,6 +145,14 @@ export function tagFilterHref(selected: readonly string[], pathname = "/blog") {
   return query ? `${pathname}?${query}` : pathname;
 }
 
+/**
+ * Where a tag link points (tags on an article, the /tags page): the list page at its exported address
+ * (`/blog/`, with the slash, so the static host does not answer /blog?t=… with
+ * a 301 first), filtered to that one tag. The tag is URL-encoded.
+ */
+export const ARTICLE_TAG_LIST = "/blog/";
+export const articleTagHref = (tag: string) => tagFilterHref([tag], ARTICLE_TAG_LIST);
+
 /** 「共 N 篇」, or 「2 个标签，共 5 篇」 with a selection. */
 export function tagSummary(selectedCount: number, resultCount: number) {
   return selectedCount ? `${selectedCount} 个标签，共 ${resultCount} 篇` : `共 ${resultCount} 篇`;

package/app/page.tsx

@@ -3,6 +3,7 @@ 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";
+import { siteHref } from "./lib/site-href";
 
 export const metadata = {
   title: { absolute: siteConfig.name },
@@ -40,7 +41,7 @@ export default function Home() {
         <h1>{siteConfig.pages.home.title}</h1>
         <p>{siteConfig.pages.home.subtitle || siteConfig.description}</p>
         <div className="links">
-          <Link href="/about">关于我</Link>
+          <Link href={siteHref("/about")}>关于我</Link>
           <a href={githubUrl} rel="me">GitHub</a>
           <a href="/rss.xml">RSS 订阅</a>
         </div>
@@ -71,7 +72,7 @@ export default function Home() {
         <section className="sh-section" aria-labelledby="h-recent">
           <div className="sh-sec-head">
             <h2 id="h-recent">最近更新</h2>
-            <Link className="sh-more" href="/blog">全部 {posts.length} 篇</Link>
+            <Link className="sh-more" href={siteHref("/blog")}>全部 {posts.length} 篇</Link>
           </div>
           <ol className="sh-rows">
             {recent.slice(0, 6).map((post) => (
@@ -102,7 +103,7 @@ export default function Home() {
         <section className="sh-section" aria-labelledby="h-cols">
           <div className="sh-sec-head">
             <h2 id="h-cols">专栏</h2>
-            <Link className="sh-more" href="/columns">全部专栏</Link>
+            <Link className="sh-more" href={siteHref("/columns")}>全部专栏</Link>
           </div>
           <div className="sh-cols">
             {series.map(([slug, entries]) => {
@@ -116,7 +117,7 @@ export default function Home() {
                     ) : null}
                   </div>
                   <div className="body">
-                    <h3><Link href={`/columns/#${slug}`}>{first.columnTitle}</Link></h3>
+                    <h3><Link href={siteHref(`/columns/#${slug}`)}>{first.columnTitle}</Link></h3>
                     <p className="count">{entries.length} 篇，{first.columnStatus ?? "持续更新"}</p>
                     <p>{first.columnDescription ?? first.description}</p>
                   </div>

package/app/rss.xml/route.ts

@@ -1,9 +1,10 @@
 import { marked } from "marked";
-import { columnHref, columns, postHref, posts } from "../lib/content";
+import { columnHref, columns, postHref, posts, thoughtHref } 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";
+import { withTrailingSlash } from "../../ui/garden/site-href.mjs";
 
 const escapeXml = (value: string) =>
   value
@@ -15,6 +16,8 @@ const escapeXml = (value: string) =>
 
 const cdata = (value: string) => value.replaceAll("]]>", "]]]]><![CDATA[>");
 
+// The link follows trailingSlash; the guid keeps this route's 0.5.14 form (no trailing slash),
+// because readers tell items apart by it.
 export async function GET() {
   const origin = configuredSiteUrl();
   const thoughts = getPublishedThoughts();
@@ -27,7 +30,7 @@ export async function GET() {
     ...thoughts.map((thought) => ({
       ...thought,
       description: stripCardMarkers(thought.content).replace(/\s+/gu, " ").slice(0, 180),
-      path: `/thoughts/${thought.slug}`,
+      path: thoughtHref(thought.slug),
     })),
   ].sort((a, b) => Date.parse(b.date) - Date.parse(a.date));
 
@@ -45,7 +48,7 @@ export async function GET() {
     <item>
       <title>${escapeXml(entry.title)}</title>
       <link>${origin}${entry.path}</link>
-      <guid isPermaLink="true">${origin}${entry.path}</guid>
+      <guid isPermaLink="true">${origin}${withTrailingSlash(entry.path, false)}</guid>
       <pubDate>${new Date(entry.date).toUTCString()}</pubDate>
       <description>${escapeXml(entry.description ?? "")}</description>
       ${(entry.tags ?? [])

package/app/sitemap.ts

@@ -1,7 +1,8 @@
 import type { MetadataRoute } from "next";
-import { columnHref, columns, postHref, posts } from "./lib/content";
+import { columnHref, columns, postHref, posts, thoughtHref } from "./lib/content";
 import { absoluteUrl, getSiteUrl } from "./lib/site";
 import { getPublishedThoughts } from "./lib/public-thoughts";
+import { siteHref } from "./lib/site-href";
 
 export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
   const baseUrl = await getSiteUrl();
@@ -14,7 +15,7 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
     { path: "/about", priority: 0.5, changeFrequency: "monthly" as const },
     { path: "/garden", priority: 0.4, changeFrequency: "monthly" as const },
   ].map((route) => ({
-    url: absoluteUrl(route.path, baseUrl),
+    url: absoluteUrl(siteHref(route.path), baseUrl),
     changeFrequency: route.changeFrequency,
     priority: route.priority,
   }));
@@ -37,7 +38,7 @@ export default async function sitemap(): Promise<MetadataRoute.Sitemap> {
       priority: 0.75,
     })),
     ...thoughts.map((thought) => ({
-      url: absoluteUrl(`/thoughts/${thought.slug}`, baseUrl),
+      url: absoluteUrl(thoughtHref(thought.slug), baseUrl),
       lastModified: new Date(thought.updated ?? thought.date),
       changeFrequency: "monthly" as const,
       priority: 0.6,

package/app/styles/a2.css

@@ -1567,3 +1567,75 @@ html[data-theme="dark"] .g-quiz-out.no { color: #f29aab; }
 @media (max-width: 640px) {
   .g-range { grid-template-columns: 84px minmax(0, 1fr) 54px; gap: 8px; }
 }
+
+/* ---- garden file: a download card, a group of rows, a preview drawer ---- */
+.gf { margin: 24px 0; border: 1px solid var(--rule); border-radius: 12px; background: var(--card); font-family: var(--sans); }
+.gf-title { padding: 14px 16px 0; font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--muted); }
+.gf-row { display: flex; align-items: center; gap: 14px; padding: 14px 16px; }
+.gf-row + .gf-row { border-top: 1px solid var(--rule); }
+.gf-ico { display: grid; place-items: center; flex: none; width: 36px; height: 36px; border-radius: 8px; background: var(--chip); color: var(--soft); }
+.gf-i { flex: none; width: 18px; height: 18px; }
+.gf-main { flex: 1; min-width: 0; }
+.gf-name { overflow: hidden; font-size: 15px; font-weight: 600; line-height: 1.45; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; }
+.gf-desc { margin-top: 2px; font-size: 14px; line-height: 1.55; color: var(--soft); }
+.gf-meta { margin-top: 2px; font-size: 13px; line-height: 1.4; color: var(--muted); font-variant-numeric: tabular-nums; }
+.gf-act { display: flex; flex: none; gap: 6px; }
+.gf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 12px; border: 0; border-radius: 999px; background: transparent; color: var(--soft); font: 500 14px/1 var(--sans); white-space: nowrap; cursor: pointer; transition: background-color .15s ease, color .15s ease; }
+.markdown-body a.gf-btn, a.gf-btn { color: var(--soft); text-decoration: none; }
+.gf-btn:hover, .markdown-body a.gf-btn:hover { background: var(--tint); color: var(--ink); text-decoration: none; }
+.gf-btn:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
+.gf-btn.icon { width: 34px; padding: 0; }
+.gf-btn.pri, .markdown-body a.gf-btn.pri { background: var(--ink); color: var(--paper); }
+.gf-btn.pri:hover, .markdown-body a.gf-btn.pri:hover { background: var(--ink-soft); color: var(--paper); }
+
+/* The drawer: right side on wide screens, the whole screen on phones. */
+.gf-layer { position: fixed; inset: 0; z-index: 95; }
+.gf-scrim { position: absolute; inset: 0; background: rgb(20 20 19 / 22%); animation: gf-fade .16s ease-out; }
+html[data-theme="dark"] .gf-scrim { background: rgb(0 0 0 / 45%); }
+.gf-drawer { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(600px, 46vw); border-left: 1px solid var(--rule); background: var(--paper); box-shadow: -12px 0 32px rgb(0 0 0 / 8%); font-family: var(--sans); animation: gf-slide .2s ease-out; }
+.gf-dh { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 12px 12px 20px; border-bottom: 1px solid var(--rule); }
+.gf-dh .gf-act { gap: 2px; }
+.gf-db { flex: 1; min-height: 0; overflow: auto; padding: 28px 32px 40px; font-size: 15px; line-height: 1.75; overscroll-behavior: contain; }
+.gf-db-frame { padding: 0; overflow: hidden; background: var(--card); }
+.gf-frame { display: block; width: 100%; height: 100%; border: 0; background: #fff; }
+.gf-drawer[data-preview="pdf"] .gf-frame { background: var(--paper-deep); }
+.gf-db .gf-doc { max-width: none; margin: 0; font-size: 15px; line-height: 1.75; }
+.gf-db .gf-doc > :first-child { margin-top: 0; }
+@keyframes gf-fade { from { opacity: 0; } }
+@keyframes gf-slide { from { transform: translateX(24px); opacity: 0; } }
+@media (prefers-reduced-motion: reduce) {
+  .gf-scrim, .gf-drawer { animation: none; }
+  .gf-btn { transition: none; }
+}
+
+@media (max-width: 600px) {
+  .gf-row { flex-wrap: wrap; align-items: flex-start; gap: 12px; padding: 14px; }
+  .gf-main { flex: 1 1 calc(100% - 50px); }
+  .gf-act { width: 100%; padding-left: 48px; }
+  .gf-btn { height: 44px; padding: 0 14px; }
+  .gf-btn.icon { width: 44px; padding: 0; }
+  .gf.group .gf-row { flex-wrap: nowrap; align-items: center; }
+  .gf.group .gf-main { flex: 1 1 auto; }
+  .gf.group .gf-act { width: auto; gap: 0; padding: 0; }
+  .gf.group .gf-btn { width: 44px; padding: 0; }
+  .gf.group .gf-lb { display: none; }
+  .gf-drawer { width: 100%; border: 0; box-shadow: none; }
+  .gf-dh { min-height: 56px; padding: 6px 6px 6px 16px; }
+  .gf-dh .gf-act { width: auto; padding: 0; gap: 0; }
+  .gf-db { padding: 20px 20px 40px; }
+  .gf-db-frame { padding: 0; }
+}
+
+/* While the prerendered Markdown loads, or when it cannot. (Without scripts 预览 is a plain link to it.) */
+.gf-state { display: grid; justify-items: start; gap: 12px; padding: 8px 0; font-size: 15px; line-height: 1.6; color: var(--muted); }
+.gf-state p { margin: 0; color: var(--soft); }
+.gf-state-act { display: flex; flex-wrap: wrap; gap: 8px; }
+.gf-state-act .gf-btn { border: 1px solid var(--rule); }
+/* A previewed Markdown file reads as a document: its own title, a smaller scale than the post. */
+.gf-db .gf-doc h1 { margin: 0 0 12px; font-size: 22px; font-weight: 600; line-height: 1.4; color: var(--ink); }
+.gf-db .gf-doc h2 { margin: 28px 0 10px; font-size: 19px; line-height: 1.4; }
+.gf-db .gf-doc h3 { margin: 24px 0 8px; font-size: 17px; line-height: 1.4; }
+.gf-db .gf-doc h4 { margin: 20px 0 6px; font-size: 15px; line-height: 1.5; }
+.gf-db .gf-doc p, .gf-db .gf-doc li { font-size: 15px; line-height: 1.75; }
+.gf-db .gf-doc p { margin: 0 0 14px; }
+.gf-db .gf-doc ul, .gf-db .gf-doc ol { margin: 0 0 14px; }

package/app/styles/shell.css

@@ -65,10 +65,11 @@ html[data-mod="other"] .sh-search .kbd-other{display:inline}
 .sh-icon{display:inline-grid;place-items:center;width:40px;height:40px;border:0;background:transparent;color:var(--soft);border-radius:var(--r);cursor:pointer;transition:background-color .15s ease,color .15s ease}
 @media (hover:hover){.sh-icon:hover{background:var(--tint);color:var(--ink)}}
 .sh-menu-btn,.sh-search-m{display:none}
+.sh-menu-nojs,.sh-menu-nojs-close{display:none}
+/* Fragment targets for the no-JS menu: fixed, so jumping to them never scrolls the page. */
+.sh-menu-target{position:fixed;top:0;left:0;width:0;height:0;overflow:hidden;pointer-events:none}
 .i-sun,html[data-theme="dark"] .i-moon{display:none}
 html[data-theme="dark"] .i-sun{display:inline}
-/* No JavaScript: the theme cannot be switched, the page follows the system (build/dark-fallback-postcss.mjs). */
-@media (scripting:none){.sh-theme,.sh-menu-theme{display:none}}
 .sh-menu{display:none}
 
 /* ---------- page frame ---------- */
@@ -304,6 +305,24 @@ html[data-theme="dark"] .sh-pal-scrim{background:rgba(0,0,0,.55)}
   .sh-pal-foot{display:none}
   .sh-pal-input{font-size:17px;height:56px}
 }
+/* No JavaScript: the theme cannot be switched, the page follows the system (build/dark-fallback-postcss.mjs).
+   Keep this after every rule that shows the toggles (the 820px block above sets .sh-menu-theme to flex);
+   tests/header-nojs.test.mjs checks the order in the built CSS. */
+@media (scripting:none){.sh-theme,.sh-menu-theme{display:none}}
+/* Search needs JavaScript too: without it the desktop 「搜索」 button would do nothing. */
+@media (scripting:none){.sh-search{display:none}}
+/* No JavaScript: the ☰ button cannot open the menu, so a ☰ link in the same place opens it by targeting
+   #sh-menu-on, and ✕ closes it by targeting #sh-menu-off. Both are fixed anchors outside the sticky header,
+   as the TOC drawer's are, so neither moves the page. With JavaScript none of this applies. */
+@media (max-width:820px) and (scripting:none){
+  .sh-menu-btn{display:none}
+  /* Search needs JavaScript (the index loads on demand); without it the button would do nothing. */
+  .sh-search-m{display:none}
+  .sh-menu-nojs{display:inline-grid;width:44px;height:44px;text-decoration:none}
+  body:has(#sh-menu-on:target) .sh-menu{opacity:1;transform:none;visibility:visible;transition:opacity .18s ease,transform .18s var(--ease)}
+  body:has(#sh-menu-on:target) .sh-menu-nojs{display:none}
+  body:has(#sh-menu-on:target) .sh-menu-nojs-close{display:inline-grid;width:44px;height:44px;text-decoration:none}
+}
 @media (prefers-reduced-motion:reduce){
   *,*::before,*::after{animation:none!important;transition:none!important}
   html{scroll-behavior:auto!important}

package/app/tags/page.tsx

@@ -1,7 +1,8 @@
 import Link from "next/link";
 import { Suspense } from "react";
 import { posts } from "../lib/content";
-import { tagCounts, tagFilterHref } from "../lib/tag-filter";
+import { siteHref } from "../lib/site-href";
+import { articleTagHref, tagCounts } from "../lib/tag-filter";
 import { TagRedirect } from "../components/TagRedirect";
 import { siteDocumentTitle } from "../site.config";
 
@@ -25,7 +26,7 @@ export default function TagsPage() {
         <ul className="sh-tagchips sh-tagindex" aria-label="全部标签">
           {tags.map(([tag, count]) => (
             <li key={tag}>
-              <Link className="sh-tagchip" href={tagFilterHref([tag])}>
+              <Link className="sh-tagchip" href={siteHref(articleTagHref(tag))}>
                 #{tag}<span className="n num">{count}</span>
               </Link>
             </li>

package/app/thoughts/[slug]/page.tsx

@@ -12,6 +12,7 @@ import {
   getSiteUrl,
   webmentionApiEndpoint,
 } from "../../lib/site";
+import { siteHref } from "../../lib/site-href";
 
 export function generateStaticParams() {
   return thoughts.map((thought) => ({ slug: thought.slug }));
@@ -26,7 +27,7 @@ export async function generateMetadata({
   const thought = findPublishedThought(slug);
   if (!thought) return {};
   const baseUrl = await getSiteUrl();
-  const pathname = `/thoughts/${slug}`;
+  const pathname = siteHref(`/thoughts/${slug}`);
   const images = Array.isArray(thought.media)
     ? thought.media.filter((item) => item.type === "image").slice(0, 4)
     : [];
@@ -60,11 +61,11 @@ export default async function ThoughtPage({
   const thought = findPublishedThought(slug);
   if (!thought) notFound();
   const baseUrl = await getSiteUrl();
-  const pathname = `/thoughts/${slug}`;
+  const pathname = siteHref(`/thoughts/${slug}`);
 
   return (
     <main className="page-shell thought-detail-page">
-      <Link href="/thoughts" className="back-link">
+      <Link href={siteHref("/thoughts")} className="back-link">
         <ArrowLeft size={16} />
         返回随想
       </Link>

package/bin/garden.mjs

@@ -32,7 +32,8 @@ function runNode(script, scriptArgs = [], { cwd = siteRoot, env } = {}) {
     env: env ?? siteEnv(),
     stdio: "inherit",
   });
-  if (result.status) process.exit(result.status ?? 1);
+  // A non-zero exit or a signal (status null) stops the command with a failure.
+  if (result.status !== 0) process.exit(result.status || 1);
 }
 
 function resolveVinext() {
@@ -278,7 +279,8 @@ function runVinext(vinextArgs, { copyDist = false } = {}) {
     stdio: "inherit",
   });
   if (copyDist) publishDist(cwd);
-  if (result.status) process.exit(result.status ?? 1);
+  // A non-zero exit or a signal (status null) stops the command with a failure.
+  if (result.status !== 0) process.exit(result.status || 1);
 }
 
 function copyTemplate(from, to) {
@@ -356,6 +358,7 @@ function help() {
   garden embed            拉取外链摘要
   garden links            重新拉取外链图标（build 时会自动做）
   garden images           读取新的远程图片尺寸，写入 image-sizes.json（build 时会自动做）
+  garden files            读取 garden file 里远程文件的大小，写入 file-sizes.json（build 时会自动做）
   garden init [目录]      创建只含稿和配置的新站点
   garden check <文章.md>  检查一篇博文的硬性结构
   garden ui <子命令>      Intelligent UI：scan、check、apply、prompt、schema、catalog
@@ -385,6 +388,8 @@ switch (command) {
     if (process.env.GARDEN_OFFLINE !== "1") runNode("scripts/link-assets.mjs");
     // Remote image sizes: only new images are probed; the rest come from image-sizes.json.
     if (process.env.GARDEN_OFFLINE !== "1") runNode("scripts/image-sizes.mjs");
+    // Sizes of remote files in garden file blocks; failures fall back to file-sizes.json.
+    if (process.env.GARDEN_OFFLINE !== "1") runNode("scripts/file-sizes.mjs");
     runVinext(["build", ...rest], { copyDist: true });
     // Pages for old addresses listed under redirects in site.config.yaml (static export only).
     if (process.env.STATIC_EXPORT === "1") runNode("scripts/redirects.mjs");
@@ -395,6 +400,9 @@ switch (command) {
   case "images":
     runNode("scripts/image-sizes.mjs");
     break;
+  case "files":
+    runNode("scripts/file-sizes.mjs");
+    break;
   case "start":
     runVinext(["start", ...rest]);
     break;

package/next.config.ts

@@ -1,13 +1,15 @@
 import type { NextConfig } from "next";
+import { trailingSlashEnabled } from "./ui/garden/site-href.mjs";
 
 const nextConfig: NextConfig = {
   ...(process.env.STATIC_EXPORT === "1"
     ? {
         output: "export",
-        trailingSlash: true,
         images: { unoptimized: true },
       }
     : {}),
+  // Always on in a static export; a server build opts in with TRAILING_SLASH=1. Links follow it (siteHref).
+  trailingSlash: trailingSlashEnabled(process.env),
 };
 
 export default nextConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hd-garden",
-  "version": "0.5.13",
+  "version": "0.5.15",
   "private": false,
   "description": "用 Markdown 写作、用 GitHub Pages 发布的个人博客引擎。",
   "license": "MIT",
@@ -102,11 +102,13 @@
     "rehype-katex": "^7.0.1",
     "rehype-raw": "^7.0.0",
     "rehype-slug": "^6.0.0",
+    "rehype-stringify": "^10.0.1",
     "remark-breaks": "^4.0.0",
     "remark-cjk-friendly": "^2.3.1",
     "remark-gfm": "^4.0.1",
     "remark-math": "^6.0.0",
     "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.2",
     "tailwindcss": "4.2.1",
     "typescript": "5.9.3",
     "unified": "^11.0.5",

package/scripts/build-content.mjs

@@ -15,6 +15,20 @@ import { resolveBrand } from "./brand.mjs";
 import { imageSources, readImageCache, sizeFromBytes } from "./image-sizes.mjs";
 import { buildFullIndex, buildSearchIndex } from "../ui/garden/search-index.mjs";
 import { coverImageSet, loadSharp } from "./cover-images.mjs";
+import { readFileSizeCache } from "./file-sizes.mjs";
+import { previewDocument, previewFileName, renderFilePreview } from "./file-preview.mjs";
+import { parseGardenBlock, parseGardenInfo, scanFences } from "../ui/garden/parse.mjs";
+import {
+  fileIcon,
+  fileName,
+  formatLabel,
+  isRemoteSrc,
+  previewKind,
+  maskHtmlComments,
+  readFileProps,
+} from "../ui/garden/file-block.mjs";
+import { resolveRepoFile } from "../ui/garden/file-paths.mjs";
+import { trailingSlashEnabled, withTrailingSlash } from "../ui/garden/site-href.mjs";
 
 function resolveSiteRoot() {
   if (process.env.GARDEN_SITE) return path.resolve(process.env.GARDEN_SITE);
@@ -266,6 +280,80 @@ function rewriteWidgetFences(content, markdownPath, sourcePath) {
   );
 }
 
+const remoteFileSizes = readFileSizeCache(root).files;
+
+/** One file of a `garden file` fence, resolved for the page. */
+function resolveFileEntry(file, markdownPath, sourcePath) {
+  const src = file.src;
+  const name = fileName(src);
+  const entry = {
+    name,
+    title: file.title || name,
+    ...(file.note ? { note: file.note } : {}),
+    format: formatLabel(src),
+    icon: fileIcon(src),
+  };
+  if (isRemoteSrc(src)) {
+    const size = remoteFileSizes[src]?.size;
+    return { ...entry, url: src, remote: true, preview: "", ...(size > 0 ? { size } : {}) };
+  }
+  if (src.startsWith("/")) {
+    // A site path: served as is, download only.
+    const file = path.join(root, "public", src.split(/[?#]/u, 1)[0]);
+    const size = fs.existsSync(file) && fs.statSync(file).isFile() ? fs.statSync(file).size : 0;
+    return { ...entry, url: `${basePath}${src}`, remote: false, preview: "", ...(size > 0 ? { size } : {}) };
+  }
+  const resolved = resolveRepoFile(src, markdownPath, contentRoot);
+  if (resolved.error) fail(sourcePath, `garden file：${resolved.error}`);
+  const missingMessage = `garden file 找不到 ${src}；src 相对这篇 Markdown 所在的目录`;
+  if (!fs.existsSync(resolved.path) || !fs.statSync(resolved.path).isFile()) fail(sourcePath, missingMessage);
+  const url = copyLocalAsset(src, markdownPath, sourcePath, { missingMessage });
+  const preview = previewKind(src, { remote: false });
+  const next = { ...entry, url, size: fs.statSync(resolved.path).size, remote: false, preview };
+  if (preview === "md") {
+    // Rendered now into its own file next to the copy; the page only links to it and the
+    // preview fetches it on demand. Images next to the Markdown file are copied too.
+    const { content } = matter(fs.readFileSync(resolved.path, "utf8"));
+    const html = renderFilePreview(rewriteMarkdownAssets(content.trim(), resolved.path, sourcePath));
+    const { destination } = assetFiles.get(url.split(/[?#]/u, 1)[0]);
+    fs.writeFileSync(previewFileName(destination), previewDocument(html, { title: entry.title }));
+    next.previewSrc = previewFileName(url.split(/[?#]/u, 1)[0]);
+  }
+  return next;
+}
+
+/**
+ * `garden file` fences: resolve every src next to the Markdown file, copy repo
+ * files to the public folder, and replace the YAML with `resolved:` data the
+ * page renders without reading the file system.
+ */
+function rewriteFileFences(content, markdownPath, sourcePath) {
+  const fences = scanFences(maskHtmlComments(content)).filter((fence) => parseGardenInfo(fence.info)?.name === "file" && !fence.unclosed);
+  if (!fences.length) return content;
+  const lines = content.split("\n");
+  for (const fence of [...fences].reverse()) {
+    const block = parseGardenBlock(fence.info, fence.body);
+    if (block?.error) fail(sourcePath, `第 ${fence.line} 行 garden file：${block.error.message}`);
+    if (block.props.resolved) fail(sourcePath, `第 ${fence.line} 行 garden file：resolved 由构建生成，不要手写`);
+    const read = readFileProps(block.props);
+    if (read.errors.length) fail(sourcePath, `第 ${fence.line} 行 garden file：${read.errors.join("；")}`);
+    const resolved = {
+      layout: read.layout,
+      ...(read.title ? { title: read.title } : {}),
+      files: read.files.map((file) => resolveFileEntry(file, markdownPath, sourcePath)),
+    };
+    const indent = " ".repeat(fence.indent);
+    lines.splice(
+      fence.line - 1,
+      fence.endLine - fence.line + 1,
+      `${indent}${fence.marker}${fence.info}`,
+      `${indent}resolved: ${JSON.stringify(resolved)}`,
+      `${indent}${fence.marker}`,
+    );
+  }
+  return lines.join("\n");
+}
+
 function rewriteUiFences(content, markdownPath, sourcePath, lineOffset) {
   const { content: transformed, errors } = transformUiContent(content, {
     mode: uiMode,
@@ -392,9 +480,13 @@ function validateAndNormalize(data, content, markdownPath, kind, sourcePath, lin
       ? copyLocalAsset(data.poster, markdownPath, sourcePath)
       : undefined,
     media: normalizeMedia(data.media, markdownPath, sourcePath),
-    content: rewriteWidgetFences(
-      rewriteMarkdownAssets(
-        rewriteUiFences(content.trim(), markdownPath, sourcePath, lineOffset + leadingLines(content)),
+    content: rewriteFileFences(
+      rewriteWidgetFences(
+        rewriteMarkdownAssets(
+          rewriteUiFences(content.trim(), markdownPath, sourcePath, lineOffset + leadingLines(content)),
+          markdownPath,
+          sourcePath,
+        ),
         markdownPath,
         sourcePath,
       ),
@@ -411,7 +503,9 @@ function readMarkdownTree(directory, kind) {
 
   return fs.readdirSync(directory, { withFileTypes: true }).flatMap((entry) => {
     const fullPath = path.join(directory, entry.name);
-    if (entry.isDirectory()) return readMarkdownTree(fullPath, kind);
+    // `post.md` + `post/` is the post's own folder of files (garden html, garden file):
+    // Markdown inside it is a file to download or preview, not another post.
+    if (entry.isDirectory()) return fs.existsSync(`${fullPath}.md`) ? [] : readMarkdownTree(fullPath, kind);
     if (!entry.name.endsWith(".md")) return [];
 
     const raw = fs.readFileSync(fullPath, "utf8");
@@ -674,7 +768,7 @@ export const searchFull = ${JSON.stringify({ url: `${basePath}/${fullIndex.fileN
 // Header logo (inlined SVG) and icon URLs, from brand in site.config.yaml.
 export const brand = ${JSON.stringify(resolveBrand(root, siteConfig, basePath, (line) => console.warn(line)))};
 // Full URLs to this address render as internal links.
-export const siteLinks = ${JSON.stringify({ address: siteAddress, basePath })};
+export const siteLinks = ${JSON.stringify({ address: siteAddress, basePath, trailingSlash: trailingSlashEnabled(process.env) })};
 `,
 );
 fs.mkdirSync(path.join(root, "public"), { recursive: true });
@@ -696,9 +790,15 @@ const publicRoot = path.join(root, "public");
 const columnEntryPath = (entry) => entry.path.startsWith(`${entry.column}/`)
   ? entry.path.slice(entry.column.length + 1)
   : entry.path;
+// Page addresses in the feeds and the sitemap follow trailingSlash like every site link.
+const pageAddress = (pathname) => withTrailingSlash(pathname, trailingSlashEnabled(process.env));
+// A feed item's guid is how readers tell items apart: it keeps the form it has had since 0.5.14
+// (`/blog/<path>/`, `/thoughts/<slug>/`) whatever the link looks like, or every reader would show
+// the whole feed as new again.
+const feedEntry = (entry, pathname) => ({ ...entry, path: pageAddress(pathname), guidPath: pathname });
 const feedEntries = [
-  ...posts.map((entry) => ({ ...entry, path: `/blog/${entry.path}/` })),
-  ...thoughts.map((entry) => ({ ...entry, path: `/thoughts/${entry.slug}/` })),
+  ...posts.map((entry) => feedEntry(entry, `/blog/${entry.path}/`)),
+  ...thoughts.map((entry) => feedEntry(entry, `/thoughts/${entry.slug}/`)),
 ].sort((left, right) => Date.parse(right.date) - Date.parse(left.date));
 
 const feedLastBuildDate = (entries) => new Date(entries.reduce(
@@ -711,7 +811,7 @@ function writeRssFeed(fileName, entries) {
     <item>
       <title>${escapeXml(entry.title)}</title>
       <link>${escapeXml(`${publicBaseUrl}${entry.path}`)}</link>
-      <guid isPermaLink="true">${escapeXml(`${publicBaseUrl}${entry.path}`)}</guid>
+      <guid isPermaLink="true">${escapeXml(`${publicBaseUrl}${entry.guidPath}`)}</guid>
       <pubDate>${new Date(entry.date).toUTCString()}</pubDate>
       <description>${escapeXml(entry.description ?? contentToSearchText(entry.content).replace(/\s+/gu, " ").trim().slice(0, 180))}</description>
       ${(entry.tags ?? []).map((tag) => `<category>${escapeXml(tag)}</category>`).join("")}
@@ -735,14 +835,14 @@ function writeRssFeed(fileName, entries) {
 writeRssFeed("rss.xml", feedEntries);
 writeRssFeed(
   "posts.xml",
-  posts.map((entry) => ({ ...entry, path: `/blog/${entry.path}/` })),
+  posts.map((entry) => feedEntry(entry, `/blog/${entry.path}/`)),
 );
 const sitemapEntries = [
   "/", "/blog/", "/thoughts/", "/columns/", "/about/",
   ...posts.map((entry) => `/blog/${entry.path}/`),
   ...columns.map((entry) => `/columns/${entry.column}/${columnEntryPath(entry)}/`),
   ...thoughts.map((entry) => `/thoughts/${entry.slug}/`),
-];
+].map(pageAddress);
 // Card URLs in published entries: the only pages the link-card Worker may read.
 fs.writeFileSync(
   path.join(publicRoot, "link-allowlist.json"),