astrotype 0.1.4 → 0.1.6

package/cli/commands/add.mjs

@@ -1,6 +1,7 @@
 import path from "node:path";
-import { getFontByName, getPairingByName } from "../lib/registry.mjs";
+import { getAllPairings, getFontByName, getPairingByName } from "../lib/registry.mjs";
 import {
+  activatePairingCssImport,
   ensureAstroFontsApiSetup,
   isAstroProject,
   writeAstrotypeCss,
@@ -17,6 +18,52 @@ function toCssRules(ruleMap) {
     .join("\n\n");
 }
 
+function fontFamilyFallback(font) {
+  const raw =
+    font?.font?.provider === "google"
+      ? String(font?.font?.family || font?.title || "")
+      : String(font?.title || "");
+  const normalized = raw.replace(/ Variable$/, "").replace(/"/g, '\\"');
+  return `"${normalized}"`;
+}
+
+function withPairingFontFallbacks(pairing, fonts) {
+  const headingFont = fonts[0];
+  const bodyFont = fonts[1];
+  const monoFont = fonts[2];
+  const css = JSON.parse(JSON.stringify(pairing.css || {}));
+  const root = { ...css[":root"] };
+
+  if (headingFont) {
+    const variable = headingFont.font?.variable || "--font-heading";
+    root["--font-heading"] = `var(${variable}, ${fontFamilyFallback(headingFont)})`;
+  }
+  if (bodyFont) {
+    const variable = bodyFont.font?.variable || "--font-body";
+    root["--font-body"] = `var(${variable}, ${fontFamilyFallback(bodyFont)})`;
+  }
+  if (monoFont) {
+    const variable = monoFont.font?.variable || "--font-mono";
+    root["--font-mono"] = `var(${variable}, ${fontFamilyFallback(monoFont)})`;
+  }
+  css[":root"] = root;
+  return css;
+}
+
+function toUtilityClassRules() {
+  return `.font-heading {
+  font-family: var(--font-heading);
+}
+
+.font-body {
+  font-family: var(--font-body);
+}
+
+.font-mono {
+  font-family: var(--font-mono);
+}`;
+}
+
 export async function addPairingCommand(pairingName, options = {}) {
   const targetDir = path.resolve(options.cwd || process.cwd());
   if (!isAstroProject(targetDir)) {
@@ -40,12 +87,20 @@ export async function addPairingCommand(pairingName, options = {}) {
     process.exit(1);
   }
 
-  const cssText = `${toCssRules(pairing.css)}
+  const cssRulesWithFallbacks = withPairingFontFallbacks(pairing, fonts);
+  const cssText = `${toCssRules(cssRulesWithFallbacks)}
+
+${toUtilityClassRules()}
 `;
   const pairingCssPath = writeAstrotypeCss(targetDir, pairing.name, cssText);
+  const pairingSlugs = getAllPairings().map((item) => item.name).filter(Boolean);
+  const importUpdate = activatePairingCssImport(targetDir, pairing.name, pairingSlugs);
   const fontsSetup = ensureAstroFontsApiSetup(targetDir, fonts);
 
   console.log(`Installed pairing "${pairing.name}" -> ${path.relative(targetDir, pairingCssPath)}`);
+  if (importUpdate.removed.length > 0) {
+    console.log(`Switched active pairing import (removed: ${importUpdate.removed.join(", ")}).`);
+  }
   if (fontsSetup.configured) {
     console.log("Wired Astro Fonts API entries for this pairing.");
     if (fontsSetup.manualMergeRequired) {

package/cli/lib/add-utils.mjs

@@ -38,10 +38,14 @@ function toAstroFontDescriptor(font) {
   if (provider === "npm") {
     const npmPackage = font.font.npmPackage || font.font.package;
     if (!npmPackage) return null;
-    let file = null;
     if (npmPackage === "geist") {
-      if (font.name === "geist") file = "font/sans.css";
-      if (font.name === "geist-mono") file = "font/mono.css";
+      return {
+        name: font.name,
+        familyName: font.name === "geist-mono" ? "Geist Mono" : "Geist",
+        cssVariable,
+        provider: "google",
+        options: null,
+      };
     }
     return {
       name: font.name,
@@ -50,7 +54,6 @@ function toAstroFontDescriptor(font) {
       provider: "npm",
       options: {
         package: npmPackage,
-        ...(file ? { file } : {}),
       },
     };
   }
@@ -58,11 +61,15 @@ function toAstroFontDescriptor(font) {
 }
 
 function serializeAstroFontDescriptor(descriptor) {
+  const providerCall =
+    descriptor.provider === "npm"
+      ? 'fontProviders.npm({ cdn: "https://cdn.jsdelivr.net/npm/" })'
+      : `fontProviders.${descriptor.provider}()`;
   const optionsLine = descriptor.options
     ? `,\n    options: ${JSON.stringify(descriptor.options)}`
     : "";
   return `  {
-    provider: fontProviders.${descriptor.provider}(),
+    provider: ${providerCall},
     name: ${JSON.stringify(descriptor.familyName)},
     cssVariable: ${JSON.stringify(descriptor.cssVariable)}${optionsLine}
   }`;
@@ -150,18 +157,29 @@ ${lines}
   configText = ensureAstroConfigHasAstrotypeImport(configText);
   const result = ensureAstroConfigHasFontsProperty(configText);
   fs.writeFileSync(astroConfigPath, result.text);
+  const isAlreadyWired = /\bfonts\s*:\s*astrotypeFonts\b/.test(result.text);
 
   return {
     configured: true,
     configPath: astroConfigPath,
-    manualMergeRequired: !result.injected && /\bfonts\s*:/.test(configText),
+    manualMergeRequired: !result.injected && !isAlreadyWired && /\bfonts\s*:/.test(configText),
   };
 }
 
 export function ensureImport(globalCssPath, importLine) {
   const css = fs.existsSync(globalCssPath) ? fs.readFileSync(globalCssPath, "utf-8") : "";
   if (css.includes(importLine)) return;
-  fs.writeFileSync(globalCssPath, `${importLine}\n${css}`);
+  const lines = css.split(/\r?\n/);
+  let lastImportIndex = -1;
+  for (let index = 0; index < lines.length; index += 1) {
+    if (/^\s*@import\s+/.test(lines[index])) lastImportIndex = index;
+  }
+  if (lastImportIndex === -1) {
+    fs.writeFileSync(globalCssPath, `${importLine}\n${css}`);
+    return;
+  }
+  lines.splice(lastImportIndex + 1, 0, importLine);
+  fs.writeFileSync(globalCssPath, `${lines.join("\n")}\n`);
 }
 
 export function writeAstrotypeCss(targetDir, slug, cssText) {
@@ -175,3 +193,53 @@ export function writeAstrotypeCss(targetDir, slug, cssText) {
   ensureImport(globalCssPath, `@import "./astrotypes/${slug}.css";`);
   return cssPath;
 }
+
+export function activatePairingCssImport(targetDir, activePairingSlug, pairingSlugs) {
+  const globalCssPath = path.join(targetDir, "src", "styles", "global.css");
+  ensureDir(path.dirname(globalCssPath));
+  const importLine = `@import "./astrotypes/${activePairingSlug}.css";`;
+  const knownPairings = new Set(pairingSlugs || []);
+
+  if (!fs.existsSync(globalCssPath)) {
+    fs.writeFileSync(globalCssPath, `${importLine}\n`);
+    return { removed: [], added: true };
+  }
+
+  const css = fs.readFileSync(globalCssPath, "utf-8");
+  const lines = css.split(/\r?\n/);
+  const keptLines = [];
+  const removed = [];
+  let hasActive = false;
+
+  for (const line of lines) {
+    const match = line.match(
+      /^\s*@import\s+["']\.\/astrotypes\/([a-z0-9-]+)\.css["'];\s*$/
+    );
+    if (!match) {
+      keptLines.push(line);
+      continue;
+    }
+    const slug = match[1];
+    if (slug === activePairingSlug) {
+      hasActive = true;
+      keptLines.push(importLine);
+      continue;
+    }
+    if (knownPairings.has(slug)) {
+      removed.push(slug);
+      continue;
+    }
+    keptLines.push(line);
+  }
+
+  if (!hasActive) {
+    let lastImportIndex = -1;
+    for (let index = 0; index < keptLines.length; index += 1) {
+      if (/^\s*@import\s+/.test(keptLines[index])) lastImportIndex = index;
+    }
+    if (lastImportIndex === -1) keptLines.unshift(importLine);
+    else keptLines.splice(lastImportIndex + 1, 0, importLine);
+  }
+  fs.writeFileSync(globalCssPath, `${keptLines.join("\n")}\n`);
+  return { removed, added: !hasActive };
+}

package/package.json

@@ -2,7 +2,7 @@
   "name": "astrotype",
   "description": "Astro-first font registry and CLI for installing pairings or single fonts.",
   "type": "module",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "private": false,
   "keywords": [
     "astro",