Upgrade jaamd to 0.9.1

packages/jaad/package.json

@@ -44,7 +44,7 @@
     "@astrojs/sitemap": "^3.7.3",
     "@tailwindcss/vite": "^4.3.3",
     "github-slugger": "^2.0.0",
-    "@lancher-dev/jaamd": "^0.8.1",
+    "@lancher-dev/jaamd": "^0.9.2",
     "tailwindcss": "^4.3.3"
   },
   "scripts": {

packages/jaad/src/config.ts

@@ -6,6 +6,7 @@ import type {
   SessionDriverConfig,
 } from "astro";
 import { existsSync } from "node:fs";
+import { createRequire } from "node:module";
 import { join } from "node:path";
 import { fileURLToPath } from "node:url";
 import {
@@ -203,20 +204,28 @@ export function resolveConfig(
   };
 }
 
+const requireFrom = createRequire(import.meta.url);
+
+const styleInPackage = (name: string) =>
+  fileURLToPath(new URL(`./styles/${name}`, import.meta.url));
+
 /** Absolute paths, kept off the resolved config, which gets serialised. */
 export function resolveStylesheets(
   config: JaadConfig,
   cwd: string = process.cwd(),
-): { user: string | null; theme: string | null } {
+): { user: string | null; theme: string | null; bridge: string } {
   const userCss = join(cwd, "src", "jaad.css");
-  const preset =
-    typeof config.theme === "string" ? PRESETS[config.theme].css : null;
+  const slug =
+    typeof config.theme === "string" ? PRESETS[config.theme].theme : null;
 
   return {
     user: existsSync(userCss) ? userCss : null,
-    theme: preset
-      ? fileURLToPath(new URL(`./themes/${preset}`, import.meta.url))
+    // Resolved through JAAMD's export map rather than by path.
+    theme: slug
+      ? requireFrom.resolve(`@lancher-dev/jaamd/themes/${slug}.css`)
       : null,
+    // A preset supplies the palette, so the colours travel the other way.
+    bridge: styleInPackage(slug ? "jaamd-reverse.css" : "jaamd-forward.css"),
   };
 }
 

packages/jaad/src/integration.ts

@@ -21,6 +21,7 @@ import {
 interface Stylesheets {
   user: string | null;
   theme: string | null;
+  bridge: string;
 }
 
 export interface IntegrationState {
@@ -124,6 +125,7 @@ export function createCoreIntegration(
                 config,
                 stylesheets.user,
                 stylesheets.theme,
+                stylesheets.bridge,
                 () => state.docsFrame,
               ),
             ],

packages/jaad/src/layouts/Docs.astro

@@ -18,6 +18,7 @@ import "../styles/docs.css";
 import "../styles/jaamd.css";
 import "@lancher-dev/jaamd/styles.css";
 import "virtual:jaad/theme.css";
+import "virtual:jaad/bridge.css";
 import "virtual:jaad/user.css";
 
 interface Props {

packages/jaad/src/styles/docs.css

@@ -71,10 +71,6 @@ html {
   scroll-padding-top: 8rem;
 }
 
-.markdown-content h2[id] {
-  scroll-margin-top: 8rem;
-}
-
 .docs-sidebar-left::-webkit-scrollbar,
 .docs-sidebar-right::-webkit-scrollbar {
   width: 6px;

packages/jaad/src/styles/jaamd-forward.css

@@ -0,0 +1,16 @@
+/* JAAD's palette drives JAAMD's. Used when the colours come from JAAD — its own
+   identity, or a custom theme written in src/jaad.css. */
+
+:root {
+  --jaamd-bg: var(--color-background);
+  --jaamd-color-fg: var(--color-foreground);
+  --jaamd-color-fg-bright: var(--color-foreground-bright);
+  --jaamd-color-primary: var(--color-primary);
+  --jaamd-color-success: var(--color-success);
+
+  --jaamd-alert-note-color: var(--color-info);
+  --jaamd-alert-tip-color: var(--color-success);
+  --jaamd-alert-important-color: var(--color-primary);
+  --jaamd-alert-warning-color: var(--color-warning);
+  --jaamd-alert-caution-color: var(--color-error);
+}

packages/jaad/src/styles/jaamd-reverse.css

@@ -0,0 +1,21 @@
+/* JAAMD's palette drives JAAD's. Used when a JAAMD preset supplies the colours —
+   the opposite direction to jaamd-forward.css, and never both at once: together
+   they would be a cycle, and CSS drops both sides of one.
+
+   Only the seeds: global.css derives borders, surfaces and muted text from them
+   with color-mix(). `:root, html.dark` matches the specificity global.css uses,
+   and this sheet is loaded after it. */
+
+:root,
+html.dark {
+  --color-background: var(--jaamd-bg);
+  --color-surface: var(--jaamd-surface-1);
+  --color-foreground: var(--jaamd-color-fg);
+  --color-foreground-bright: var(--jaamd-color-fg-bright);
+  --color-primary: var(--jaamd-color-primary);
+
+  --color-info: var(--jaamd-alert-note-color);
+  --color-success: var(--jaamd-alert-tip-color);
+  --color-warning: var(--jaamd-alert-warning-color);
+  --color-error: var(--jaamd-alert-caution-color);
+}

packages/jaad/src/styles/jaamd.css

@@ -7,15 +7,5 @@
   --jaamd-font-size: 1.125rem;
   --jaamd-line-height: 1.6;
 
-  --jaamd-bg: var(--color-background);
-  --jaamd-color-fg: var(--color-foreground);
-  --jaamd-color-fg-bright: var(--color-foreground-bright);
-  --jaamd-color-primary: var(--color-primary);
-  --jaamd-color-success: var(--color-success);
-
-  --jaamd-alert-note-color: var(--color-info);
-  --jaamd-alert-tip-color: var(--color-success);
-  --jaamd-alert-important-color: var(--color-primary);
-  --jaamd-alert-warning-color: var(--color-warning);
-  --jaamd-alert-caution-color: var(--color-error);
+  --jaamd-scroll-margin-top: 0;
 }

packages/jaad/src/themes/index.ts

@@ -1,32 +1,30 @@
+import { themes } from "@lancher-dev/jaamd/themes";
+
 export interface Preset {
   /** Shiki theme, or a light/dark pair, for code blocks. */
   shiki: string | { light: string; dark: string };
-  /** Stylesheet next to this file, or null when the defaults already apply. */
-  css: string | null;
+  /** JAAMD theme slug, or null when JAAD's own identity already applies. */
+  theme: string | null;
+  /** `dual` carries a light and a dark palette; the others apply in both modes. */
+  mode: "light" | "dark" | "dual";
 }
 
+/**
+ * The palettes come from JAAMD, which ships them with a manifest; JAAD adds only
+ * `default`, its own identity, which needs no stylesheet.
+ */
 export const PRESETS: Record<string, Preset> = {
-  default: { shiki: { light: "github-light", dark: "github-dark" }, css: null },
-  dracula: { shiki: "dracula", css: "dracula.css" },
-  nord: { shiki: "nord", css: "nord.css" },
-  "one-dark": { shiki: "one-dark-pro", css: "one-dark.css" },
-  "tokyo-night": { shiki: "tokyo-night", css: "tokyo-night.css" },
-  gruvbox: {
-    shiki: { light: "gruvbox-light-medium", dark: "gruvbox-dark-medium" },
-    css: "gruvbox.css",
-  },
-  "rose-pine": {
-    shiki: { light: "rose-pine-dawn", dark: "rose-pine" },
-    css: "rose-pine.css",
-  },
-  "rose-pine-moon": {
-    shiki: { light: "rose-pine-dawn", dark: "rose-pine-moon" },
-    css: "rose-pine-moon.css",
-  },
-  catppuccin: {
-    shiki: { light: "catppuccin-latte", dark: "catppuccin-mocha" },
-    css: "catppuccin.css",
+  default: {
+    shiki: { light: "github-light", dark: "github-dark" },
+    theme: null,
+    mode: "dual",
   },
+  ...Object.fromEntries(
+    themes.map((theme) => [
+      theme.slug,
+      { shiki: theme.shiki, theme: theme.slug, mode: theme.mode },
+    ]),
+  ),
 };
 
 export const PRESET_NAMES = Object.keys(PRESETS);