blume 1.3.1 → 1.4.1

package/src/cli/commands/doctor.ts

@@ -2,6 +2,7 @@ import { readFileSync } from "node:fs";
 
 import { defineCommand } from "citty";
 import { join } from "pathe";
+import { satisfies } from "semver";
 
 import { BlumeError } from "../../core/diagnostics.ts";
 import { packageRoot } from "../../core/package-root.ts";
@@ -16,35 +17,21 @@ import {
   reportDiagnosticsJson,
 } from "../log.ts";
 
-const FALLBACK_MIN_NODE = "22.12.0";
-const LEADING_RANGE = /^[^\d]*/u;
+const FALLBACK_NODE_RANGE = ">=22.12.0";
 
-/** The minimum Node version, read from the package's own `engines` field so
+/** The supported Node range, read from the package's own `engines` field so
  * doctor can never drift from what the package actually declares. */
-const minSupportedNode = (): string => {
+const supportedNodeRange = (): string => {
   try {
     const pkg = JSON.parse(
       readFileSync(join(packageRoot(), "package.json"), "utf-8")
     ) as { engines?: { node?: string } };
-    const range = pkg.engines?.node ?? "";
-    return range.replace(LEADING_RANGE, "") || FALLBACK_MIN_NODE;
+    return pkg.engines?.node || FALLBACK_NODE_RANGE;
   } catch {
-    return FALLBACK_MIN_NODE;
+    return FALLBACK_NODE_RANGE;
   }
 };
 
-const versionBelow = (current: string, minimum: string): boolean => {
-  const a = current.split(".").map((part) => Math.trunc(Number(part)));
-  const b = minimum.split(".").map((part) => Math.trunc(Number(part)));
-  for (let i = 0; i < 3; i += 1) {
-    const delta = (a[i] ?? 0) - (b[i] ?? 0);
-    if (delta !== 0) {
-      return delta < 0;
-    }
-  }
-  return false;
-};
-
 export const doctorCommand = defineCommand({
   args: {
     json: {
@@ -60,11 +47,11 @@ export const doctorCommand = defineCommand({
     const root = process.cwd();
     const diagnostics: Diagnostic[] = [];
 
-    const minNode = minSupportedNode();
-    if (versionBelow(process.versions.node, minNode)) {
+    const nodeRange = supportedNodeRange();
+    if (!satisfies(process.versions.node, nodeRange)) {
       diagnostics.push({
         code: "BLUME_NODE_VERSION",
-        message: `Node ${process.versions.node} is below the supported minimum (${minNode}).`,
+        message: `Node ${process.versions.node} is outside the supported range (${nodeRange}).`,
         severity: "warning",
       });
     }

package/src/cli/commands/translate.ts

@@ -0,0 +1,300 @@
+import { defineCommand } from "citty";
+
+import { AGENTS } from "../../audit/agent.ts";
+import type { AgentKind } from "../../audit/agent.ts";
+import { BlumeError } from "../../core/diagnostics.ts";
+import { i18nEnabled, localeCodes } from "../../core/i18n.ts";
+import { scanProject } from "../../core/project-graph.ts";
+import type { ResolvedI18nConfig } from "../../core/schema.ts";
+import { DEFAULT_TRANSLATE_TIMEOUT_MS } from "../../translate/agents.ts";
+import {
+  pruneLedger,
+  readLedger,
+  stampLedger,
+  writeLedger,
+} from "../../translate/ledger.ts";
+import {
+  checkLines,
+  checkReportJson,
+  checkSummaryLine,
+  createProgressRenderer,
+  diagnosticLines,
+  hasDrift,
+  translateHeaderLine,
+  translateReportJson,
+  translateSummaryLine,
+} from "../../translate/report.ts";
+import { runTranslate } from "../../translate/run.ts";
+import { computeWorkList } from "../../translate/work-list.ts";
+import { reportInternalError } from "../internal-error.ts";
+import { flushStdout, logger } from "../log.ts";
+
+/** Wall-clock ceiling per file, in seconds. */
+const DEFAULT_TIMEOUT_S = DEFAULT_TRANSLATE_TIMEOUT_MS / 1000;
+
+/** Parallel agent sessions per run; each one is a full agent process. */
+const DEFAULT_CONCURRENCY = 4;
+const MAX_CONCURRENCY = 16;
+
+interface TranslateFlags {
+  check?: boolean;
+  claude?: boolean;
+  codex?: boolean;
+  concurrency?: string;
+  force?: boolean;
+  json?: boolean;
+  locale?: string;
+  timeout?: string;
+}
+
+/** Validate the flag surface, exiting with a message on the first offense. */
+const parseFlags = (
+  args: TranslateFlags
+): { agent: AgentKind | undefined; concurrency: number; timeoutS: number } => {
+  const agents = (Object.keys(AGENTS) as AgentKind[]).filter(
+    (kind) => args[kind]
+  );
+  if (agents.length > 1) {
+    logger.error("Pass exactly one of --claude or --codex.");
+    process.exit(1);
+  }
+  if (args.check && agents.length > 0) {
+    logger.error(
+      "--check is read-only and never runs an agent; drop --claude/--codex."
+    );
+    process.exit(1);
+  }
+  if (!args.check && agents.length === 0) {
+    logger.error(
+      "Pass --claude or --codex to choose the agent CLI that translates."
+    );
+    process.exit(1);
+  }
+  const timeoutS =
+    args.timeout === undefined ? DEFAULT_TIMEOUT_S : Number(args.timeout);
+  if (!Number.isInteger(timeoutS) || timeoutS <= 0) {
+    logger.error(`Invalid --timeout "${args.timeout}" (whole seconds).`);
+    process.exit(1);
+  }
+  const concurrency =
+    args.concurrency === undefined
+      ? DEFAULT_CONCURRENCY
+      : Number(args.concurrency);
+  if (
+    !Number.isInteger(concurrency) ||
+    concurrency < 1 ||
+    concurrency > MAX_CONCURRENCY
+  ) {
+    logger.error(
+      `Invalid --concurrency "${args.concurrency}" (use 1..${MAX_CONCURRENCY}).`
+    );
+    process.exit(1);
+  }
+  return { agent: agents[0], concurrency, timeoutS };
+};
+
+/**
+ * Resolve `--locale` against the configured locales: comma-separated,
+ * case-insensitive, adopting the configured casing. Unknown codes and the
+ * default locale (the translation source) are errors.
+ */
+const parseLocales = (
+  value: string | undefined,
+  i18n: ResolvedI18nConfig
+): string[] | undefined => {
+  if (value === undefined) {
+    return;
+  }
+  const configured = new Map(
+    i18n.locales.map((locale) => [locale.code.toLowerCase(), locale.code])
+  );
+  const resolved: string[] = [];
+  for (const part of value.split(",")) {
+    const code = configured.get(part.trim().toLowerCase());
+    if (code === undefined) {
+      logger.error(
+        `Unknown --locale "${part.trim()}" (configured: ${localeCodes(i18n).join(", ")}).`
+      );
+      process.exit(1);
+    }
+    if (code === i18n.defaultLocale) {
+      logger.error(
+        `--locale "${code}" is the default locale — it is the translation source, not a target.`
+      );
+      process.exit(1);
+    }
+    resolved.push(code);
+  }
+  return resolved;
+};
+
+const notInstalled = (agent: AgentKind): never => {
+  const cli = AGENTS[agent];
+  logger.error(
+    `${cli.name} (\`${cli.bin}\`) was not found on PATH. Install it with \`${cli.install}\`.`
+  );
+  return process.exit(1);
+};
+
+export const translateCommand = defineCommand({
+  args: {
+    check: {
+      description:
+        "Report missing/stale translations without writing anything; exits 1 on drift (for CI).",
+      type: "boolean",
+    },
+    claude: {
+      description: "Translate with Claude Code.",
+      type: "boolean",
+    },
+    codex: {
+      description: "Translate with Codex.",
+      type: "boolean",
+    },
+    concurrency: {
+      description: `Parallel agent sessions. Defaults to ${DEFAULT_CONCURRENCY}, max ${MAX_CONCURRENCY}.`,
+      type: "string",
+    },
+    force: {
+      description:
+        "Retranslate everything, up-to-date and hand-authored files included.",
+      type: "boolean",
+    },
+    json: {
+      description: "Emit the report as JSON on stdout (for CI/editors).",
+      type: "boolean",
+    },
+    locale: {
+      description:
+        "Comma-separated target locale codes; defaults to every non-default locale.",
+      type: "string",
+    },
+    timeout: {
+      description: `Agent time limit per file, in seconds. Defaults to ${DEFAULT_TIMEOUT_S}.`,
+      type: "string",
+    },
+  },
+  meta: {
+    description:
+      "Translate docs into the configured locales with a local agent CLI.",
+    name: "translate",
+  },
+  async run({ args }) {
+    const root = process.cwd();
+    const { agent, concurrency, timeoutS } = parseFlags(args);
+
+    try {
+      // `scanProject`, not `prepareProject`: translation reads the content
+      // tree and writes source files, never `.blume/`, so it doesn't contend
+      // with a running dev server. Same reasoning as `blume audit`/`eval`.
+      const project = await scanProject(root, { mode: "build" });
+      if (!i18nEnabled(project.config)) {
+        logger.error(
+          "i18n is not configured — add `i18n.locales` to blume.config to use `blume translate`."
+        );
+        process.exit(1);
+      }
+      const { i18n } = project.config;
+      if (localeCodes(i18n).every((code) => code === i18n.defaultLocale)) {
+        logger.error(
+          "i18n.locales has no locale besides the default — nothing to translate into."
+        );
+        process.exit(1);
+      }
+      const locales = parseLocales(args.locale, i18n);
+      const ledger = await readLedger(root);
+      const workList = await computeWorkList(project, ledger, {
+        force: !args.check && Boolean(args.force),
+        locales,
+      });
+
+      if (args.check) {
+        const lines = [
+          ...diagnosticLines(workList.diagnostics),
+          ...checkLines(workList),
+          "",
+          `  ${checkSummaryLine(workList)}`,
+          "",
+        ];
+        process.stderr.write(`${lines.join("\n")}\n`);
+        if (args.json) {
+          process.stdout.write(checkReportJson(workList));
+        }
+        if (hasDrift(workList)) {
+          await flushStdout();
+          process.exit(1);
+        }
+        return;
+      }
+
+      const kind = agent as AgentKind;
+      process.stderr.write(
+        `${translateHeaderLine(workList.items.length, workList.targetLocales.length, kind)}\n\n`
+      );
+
+      // Adopt pre-existing hand-authored translations (stamp, never rewrite)
+      // and persist BEFORE the agents run, so adoption survives an interrupt.
+      for (const entry of workList.untracked) {
+        stampLedger(ledger, entry.sourceRel, entry.locale, entry.hash);
+      }
+      await writeLedger(root, ledger);
+
+      const renderer = createProgressRenderer({
+        isTTY: process.stderr.isTTY === true,
+        write: (chunk) => process.stderr.write(chunk),
+      });
+      const result = await runTranslate({
+        agent: kind,
+        concurrency,
+        ledger,
+        onProgress: (event) => renderer.onProgress(event),
+        // Flush after every finished item, so stopping a long run mid-way
+        // keeps everything already translated out of the next work list.
+        persistLedger: () => writeLedger(root, ledger),
+        project,
+        timeoutMs: timeoutS * 1000,
+        workList,
+      });
+      renderer.stop();
+
+      // Prune entries whose source or locale no longer exists. Pruning spans
+      // ALL non-default locales — a `--locale fr` run must not drop the other
+      // locales' stamps.
+      const knownLocales = new Set(
+        localeCodes(i18n).filter((code) => code !== i18n.defaultLocale)
+      );
+      await writeLedger(
+        root,
+        pruneLedger(ledger, workList.knownSources, knownLocales)
+      );
+
+      const tail = [
+        "",
+        ...diagnosticLines(workList.diagnostics),
+        `  ${translateSummaryLine(result, workList)}`,
+        "",
+      ];
+      process.stderr.write(tail.join("\n"));
+
+      if (args.json) {
+        process.stdout.write(translateReportJson(result, workList));
+      }
+      if (result.counts.failed > 0 || result.counts.partial > 0) {
+        // The ledger write above already persisted every success, so a failed
+        // rerun only retries what actually failed.
+        await flushStdout();
+        process.exit(1);
+      }
+    } catch (error) {
+      if (error instanceof BlumeError) {
+        logger.error(error.diagnostic.message);
+        process.exit(1);
+      }
+      if ((error as NodeJS.ErrnoException)?.code === "ENOENT" && agent) {
+        notInstalled(agent);
+      }
+      reportInternalError(error);
+      process.exit(1);
+    }
+  },
+});

package/src/cli/env.ts

@@ -1,5 +1,6 @@
 import { existsSync, readFileSync } from "node:fs";
 
+import { parse } from "dotenv";
 import { dirname, join, resolve } from "pathe";
 
 // Blume's remote sources (GitHub Releases, mdx-remote, Sanity, Notion…) read
@@ -8,57 +9,6 @@ import { dirname, join, resolve } from "pathe";
 // that gap: it cascades `.env`/`.env.local` from the working dir up to the repo
 // root, so a monorepo can keep one `.env` at the root and every app picks it up.
 
-const ENV_LINE =
-  /^\s*(?:export\s+)?(?<key>[A-Za-z_][A-Za-z0-9_]*)\s*=\s*(?<value>.*?)\s*$/u;
-const DOUBLE_QUOTED = /^"(?<body>[\s\S]*)"$/u;
-const SINGLE_QUOTED = /^'(?<body>[\s\S]*)'$/u;
-
-const ESCAPE = /\\(?<char>[\\nt"])/gu;
-const UNESCAPED: Record<string, string> = {
-  '"': '"',
-  "\\": "\\",
-  n: "\n",
-  t: "\t",
-};
-
-/** Unquote a value, expanding `\n`/`\t`/escapes inside double quotes only. */
-const unquote = (raw: string): string => {
-  const double = raw.match(DOUBLE_QUOTED)?.groups?.body;
-  if (double !== undefined) {
-    // A single pass so each backslash is consumed exactly once — sequential
-    // replaceAll calls would expand the `n` in `\\n` (an escaped backslash
-    // followed by a literal `n`) into a newline.
-    return double.replaceAll(
-      ESCAPE,
-      (match, char: string) => UNESCAPED[char] ?? match
-    );
-  }
-  const single = raw.match(SINGLE_QUOTED)?.groups?.body;
-  if (single !== undefined) {
-    return single;
-  }
-  // dotenv/Vite treat an unquoted `#` as the start of an inline comment (a
-  // value containing `#` must be quoted) — keeping the comment would hand
-  // consumers a silently corrupted value.
-  const hash = raw.indexOf("#");
-  return (hash === -1 ? raw : raw.slice(0, hash)).trim();
-};
-
-/** Parse `.env` text into key/value pairs, skipping blanks and `#` comments. */
-export const parseEnv = (content: string): Record<string, string> => {
-  const env: Record<string, string> = {};
-  for (const line of content.split(/\r?\n/u)) {
-    if (line.trim() === "" || line.trimStart().startsWith("#")) {
-      continue;
-    }
-    const groups = line.match(ENV_LINE)?.groups;
-    if (groups?.key !== undefined && groups.value !== undefined) {
-      env[groups.key] = unquote(groups.value);
-    }
-  }
-  return env;
-};
-
 /** Apply parsed vars without clobbering anything already in `process.env`. */
 const applyEnv = (parsed: Record<string, string>): void => {
   for (const [key, value] of Object.entries(parsed)) {
@@ -71,7 +21,11 @@ const applyEnv = (parsed: Record<string, string>): void => {
 const loadFile = (path: string): void => {
   try {
     if (existsSync(path)) {
-      applyEnv(parseEnv(readFileSync(path, "utf-8")));
+      // dotenv is the same parser Vite runs over these files at build time,
+      // so a value means the same thing to the pre-boot content scan and the
+      // built site — including multi-line double-quoted values (PEM keys),
+      // which a line-based parser silently truncates.
+      applyEnv(parse(readFileSync(path, "utf-8")));
     }
   } catch {
     // Env files are best-effort; a read/parse failure must not abort a build.

package/src/cli/index.ts

@@ -13,6 +13,7 @@ import { initCommand } from "./commands/init.ts";
 import { mcpStdioCommand } from "./commands/mcp-stdio.ts";
 import { previewCommand } from "./commands/preview.ts";
 import { syncCommand } from "./commands/sync.ts";
+import { translateCommand } from "./commands/translate.ts";
 import { validateCommand } from "./commands/validate.ts";
 import { loadEnvFiles } from "./env.ts";
 import { reportInternalError } from "./internal-error.ts";
@@ -36,6 +37,7 @@ const main = defineCommand({
     "mcp-stdio": mcpStdioCommand,
     preview: previewCommand,
     sync: syncCommand,
+    translate: translateCommand,
     validate: validateCommand,
   },
 });

package/src/cli/init/scaffold.ts

@@ -195,28 +195,29 @@ const hasRemoteSource = (sources: SourceKind[]): boolean =>
  * Config snippets for each remote source kind, with placeholder values to
  * replace and comments naming the env var each source authenticates with.
  */
-const sourceSnippetFor = (kind: Exclude<SourceKind, "filesystem">): string => {
-  switch (kind) {
-    case "github-releases": {
-      return `      // Changelog entries from GitHub Releases. Private repos read
+const SOURCE_SNIPPETS: Record<Exclude<SourceKind, "filesystem">, string> = {
+  "github-releases": `      // Changelog entries from GitHub Releases. Private repos read
       // GITHUB_TOKEN from the environment.
       {
         type: "github-releases",
         owner: "your-org",
         repo: "your-repo",
         prefix: "changelog",
-      },`;
-    }
-    case "notion": {
-      return `      // Pages from a Notion database. Reads NOTION_TOKEN from the environment.
+      },`,
+  "mdx-remote": `      // MDX fetched from a GitHub repo. Private repos read GITHUB_TOKEN
+      // from the environment.
+      {
+        type: "mdx-remote",
+        github: { owner: "your-org", repo: "your-repo", path: "docs" },
+        prefix: "remote",
+      },`,
+  notion: `      // Pages from a Notion database. Reads NOTION_TOKEN from the environment.
       {
         type: "notion",
         database: "your-database-id",
         prefix: "notion",
-      },`;
-    }
-    case "sanity": {
-      return `      // Documents from a Sanity dataset. Private datasets read SANITY_TOKEN
+      },`,
+  sanity: `      // Documents from a Sanity dataset. Private datasets read SANITY_TOKEN
       // from the environment.
       {
         type: "sanity",
@@ -224,21 +225,7 @@ const sourceSnippetFor = (kind: Exclude<SourceKind, "filesystem">): string => {
         dataset: "production",
         query: \`*[_type == "doc"]\`,
         prefix: "sanity",
-      },`;
-    }
-    case "mdx-remote": {
-      return `      // MDX fetched from a GitHub repo. Private repos read GITHUB_TOKEN
-      // from the environment.
-      {
-        type: "mdx-remote",
-        github: { owner: "your-org", repo: "your-repo", path: "docs" },
-        prefix: "remote",
-      },`;
-    }
-    default: {
-      return kind satisfies never;
-    }
-  }
+      },`,
 };
 
 /**
@@ -263,7 +250,7 @@ const contentBlockFor = (answers: InitAnswers): string => {
     (kind) =>
       kind === "filesystem"
         ? `      { type: "filesystem", root: ${JSON.stringify(answers.contentDir)} },`
-        : sourceSnippetFor(kind)
+        : SOURCE_SNIPPETS[kind]
   );
   return `
   content: {

package/src/cli/internal-error.ts

@@ -1,10 +1,6 @@
-import { getBlumeVersion } from "../core/version.ts";
+import { colors } from "consola/utils";
 
-const ESC = String.fromCodePoint(27);
-const DIM = `${ESC}[2m`;
-const RED = `${ESC}[31m`;
-const BOLD = `${ESC}[1m`;
-const RESET = `${ESC}[0m`;
+import { getBlumeVersion } from "../core/version.ts";
 
 const ISSUES_URL = "https://github.com/haydenbleasel/blume/issues";
 
@@ -40,7 +36,7 @@ export const remapBlumeStack = (stack: string): string =>
 export const reportInternalError = (error: unknown): void => {
   const err = error instanceof Error ? error : new Error(String(error));
   const lines = [
-    `${RED}${BOLD}BLUME_INTERNAL${RESET} An unexpected error occurred.`,
+    `${colors.red(colors.bold("BLUME_INTERNAL"))} An unexpected error occurred.`,
     `  ${err.message}`,
   ];
 
@@ -52,15 +48,19 @@ export const reportInternalError = (error: unknown): void => {
     .map((line) => line.trim())
     .filter(Boolean);
   if (stack.length > 0) {
-    lines.push("", `${DIM}${stack.join("\n")}${RESET}`);
+    lines.push("", colors.dim(stack.join("\n")));
   }
 
   lines.push(
     "",
     "This is likely a bug in Blume. Please report it with the details below:",
-    `  ${DIM}Blume:    ${getBlumeVersion()}`,
-    `  Node:     ${process.version}`,
-    `  Platform: ${process.platform} ${process.arch}${RESET}`,
+    colors.dim(
+      [
+        `  Blume:    ${getBlumeVersion()}`,
+        `  Node:     ${process.version}`,
+        `  Platform: ${process.platform} ${process.arch}`,
+      ].join("\n")
+    ),
     `  ${ISSUES_URL}`
   );
 

package/src/components/Icon.astro

@@ -1,4 +1,5 @@
 ---
+import { isImageIcon, isInlineSvg } from "../theme/icon-kind.ts";
 import { resolveIcon } from "../theme/icons.ts";
 import { withBase } from "./islands/base-path.ts";
 
@@ -27,13 +28,7 @@ const customIcon =
     ? rawIcon
     : null;
 const iconName = typeof rawIcon === "string" ? rawIcon : null;
-const rawSvg =
-  iconName && /^\s*<svg[\s\S]*<\/svg>\s*$/u.test(iconName)
-    ? iconName.trim()
-    : null;
-const isImageIcon = (value: string): boolean =>
-  /^(?:https?:\/\/|data:image\/|\/|\.{1,2}\/)/u.test(value) ||
-  /\.(?:avif|gif|jpe?g|png|svg|webp)$/iu.test(value);
+const rawSvg = iconName && isInlineSvg(iconName) ? iconName.trim() : null;
 const imageSrc = iconName && !rawSvg && isImageIcon(iconName) ? iconName : null;
 const resolvedIcon =
   iconName && !(imageSrc || rawSvg) ? resolveIcon(iconName) : null;

package/src/components/content/Step.astro

@@ -1,6 +1,7 @@
 ---
-import Icon from "../Icon.astro";
+import { isAssetIcon } from "../../theme/icon-kind.ts";
 import { hasIcon } from "../../theme/icons.ts";
+import Icon from "../Icon.astro";
 
 interface Props {
   icon?: string;
@@ -10,14 +11,8 @@ interface Props {
 const { icon, title } = Astro.props;
 const markerClass =
   "absolute top-0 -start-[2.75rem] flex size-6 items-center justify-center rounded-full bg-accent text-center font-semibold text-accent-foreground text-xs";
-const isImageIcon = (value: string): boolean =>
-  /^(?:https?:\/\/|data:image\/|\/|\.{1,2}\/)/u.test(value) ||
-  /\.(?:avif|gif|jpe?g|png|svg|webp)$/iu.test(value);
 const canRenderIcon =
-  icon !== undefined &&
-  (/^\s*<svg[\s\S]*<\/svg>\s*$/u.test(icon) ||
-    isImageIcon(icon) ||
-    hasIcon(icon));
+  icon !== undefined && (isAssetIcon(icon) || hasIcon(icon));
 ---
 
 <div

package/src/components/content/Tab.astro

@@ -21,9 +21,28 @@ const slugify = (value: string): string =>
 const tabId = id ?? slugify(title);
 ---
 
+{/*
+  Drop the inset only when the panel is *nothing but* code fences: a fence owns
+  its own frame, so a code-only panel would double-inset it. A panel holding a
+  fence AND prose is real prose content and keeps the inset, matching every
+  other code-block host (CodeGroup, Steps, Callout, Card, Accordion) — see the
+  scroll-container note in theme/entry.ts. Previously the bare `:has(>pre)`
+  also matched mixed panels, stripping padding from the prose too; with
+  `[&>:last-child]:mb-0!` a trailing paragraph sat flush against the border.
+
+  The `template` exclusion is load-bearing, not defensive: when `icon` is set
+  this component renders a `<template data-blume-tab-icon>` that stays a
+  permanent child, because the tabs script *clones* its content into the
+  trigger (`icon.content.cloneNode(true)`) rather than moving the node. So the
+  panel legitimately has a non-`pre` child even when it is code-only, and
+  `:has(>pre:only-child)` would stop matching every icon tab — restoring the
+  double inset. `:only-of-type` survives the single-fence case but breaks a
+  code-only panel holding two fences. Excluding `template` handles both. Do
+  not "simplify" this to those.
+*/}
 <div
   class:list={[
-    "px-4 py-3 [&:has(>pre)]:p-0 [&>:first-child]:mt-0! [&>:last-child]:mb-0!",
+    "px-4 py-3 [&:has(>pre):not(:has(>:not(pre,template)))]:p-0 [&>:first-child]:mt-0! [&>:last-child]:mb-0!",
     className,
   ]}
   data-blume-tab-panel