velloo 0.0.0 → 0.2.0

package/pkgs/schema/src/fonts.ts

@@ -0,0 +1,690 @@
+// Generated by scripts/build-font-catalog.ts — do not edit by hand.
+//
+// The selection is editorial; the axis specs are read from Google's font
+// metadata, so every entry here is one the css2 API actually answers.
+
+/** What a family is good for — drives grouping and the default role name. */
+export type FontRole = "body" | "display" | "mono";
+
+/** How the picker groups families. Google's own classification. */
+export type FontCategory = "sans" | "serif" | "display" | "mono" | "handwriting";
+
+export interface CatalogFont {
+  /** Family name, spelled as Google Fonts spells it. */
+  family: string;
+  category: FontCategory;
+  /**
+   * The css2 axis spec — the part after `family=<name>:` — or `true` for a
+   * family with nothing worth asking for beyond its single weight. Exactly the
+   * shape `set_fonts` takes as its `google` argument.
+   */
+  google: string | true;
+  /** CSS stack tail, following the family's skeleton rather than its role. */
+  fallback: string;
+  roles: FontRole[];
+  note: string;
+}
+
+export const FONT_CATALOG: CatalogFont[] = [
+  {
+    family: "Inter",
+    category: "sans",
+    google: "ital,opsz,wght@0,14..32,100..900;1,14..32,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "The default for a reason — neutral, huge x-height, drawn for screens.",
+  },
+  {
+    family: "Geist",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Tighter and more opinionated than Inter, with a mono twin.",
+  },
+  {
+    family: "Manrope",
+    category: "sans",
+    google: "wght@200..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Semi-rounded geometric; friendly without going soft.",
+  },
+  {
+    family: "DM Sans",
+    category: "sans",
+    google: "ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Low-contrast geometric that stays clean when set large.",
+  },
+  {
+    family: "Plus Jakarta Sans",
+    category: "sans",
+    google: "ital,wght@0,200..800;1,200..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Geometric bones, humanist warmth; strong at both ends.",
+  },
+  {
+    family: "Work Sans",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Optimised for the middle sizes where most interface text lives.",
+  },
+  {
+    family: "Public Sans",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Unopinionated on purpose — a neutral civic workhorse.",
+  },
+  {
+    family: "Figtree",
+    category: "sans",
+    google: "ital,wght@0,300..900;1,300..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Geometric with a little play in it; holds up small.",
+  },
+  {
+    family: "Outfit",
+    category: "sans",
+    google: "wght@100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Purely geometric — strongest as a heading face.",
+  },
+  {
+    family: "Sora",
+    category: "sans",
+    google: "wght@100..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Angular and technical; a display sans that isn't generic.",
+  },
+  {
+    family: "Lexend",
+    category: "sans",
+    google: "wght@100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Wide apertures, tuned for reading proficiency.",
+  },
+  {
+    family: "Rubik",
+    category: "sans",
+    google: "ital,wght@0,300..900;1,300..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Softened corners; warm and sturdy at any weight.",
+  },
+  {
+    family: "Karla",
+    category: "sans",
+    google: "ital,wght@0,200..800;1,200..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "A grotesque with quirks — good foil for a serif display.",
+  },
+  {
+    family: "Mulish",
+    category: "sans",
+    google: "ital,wght@0,200..1000;1,200..1000",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Minimal and quiet enough to disappear behind the content.",
+  },
+  {
+    family: "Nunito Sans",
+    category: "sans",
+    google: "ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Rounded terminals; an approachable product voice.",
+  },
+  {
+    family: "Source Sans 3",
+    category: "sans",
+    google: "ital,wght@0,200..900;1,200..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Adobe's interface workhorse; very legible small.",
+  },
+  {
+    family: "IBM Plex Sans",
+    category: "sans",
+    google: "ital,wght@0,100..700;1,100..700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Engineered and faintly technical; pairs with Plex Mono.",
+  },
+  {
+    family: "Barlow",
+    category: "sans",
+    google: "wght@400;500;600;700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Slightly condensed grotesque when you need the density.",
+  },
+  {
+    family: "Archivo",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Built for high performance; enormous weight range.",
+  },
+  {
+    family: "Epilogue",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Real personality once you get into the heavy weights.",
+  },
+  {
+    family: "Onest",
+    category: "sans",
+    google: "wght@100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Contemporary neutral — a fresher take on the Inter brief.",
+  },
+  {
+    family: "Instrument Sans",
+    category: "sans",
+    google: "ital,wght@0,400..700;1,400..700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Compact grotesque; sharp and very current.",
+  },
+  {
+    family: "Schibsted Grotesk",
+    category: "sans",
+    google: "ital,wght@0,400..900;1,400..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Editorial grotesque, drawn for a news publisher.",
+  },
+  {
+    family: "Space Grotesk",
+    category: "sans",
+    google: "wght@300..700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Techy proportions; the default startup display face.",
+  },
+  {
+    family: "Albert Sans",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body", "display"],
+    note: "Geometric revival with an elegant lowercase.",
+  },
+  {
+    family: "Bricolage Grotesque",
+    category: "sans",
+    google: "opsz,wght@12..96,200..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Deliberately awkward — excellent editorial headers.",
+  },
+  {
+    family: "Hanken Grotesk",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Even-toned grotesque that never draws attention.",
+  },
+  {
+    family: "Be Vietnam Pro",
+    category: "sans",
+    google: "wght@400;500;600;700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["body"],
+    note: "Crisp geometric with unusually good diacritics.",
+  },
+  {
+    family: "Red Hat Display",
+    category: "sans",
+    google: "ital,wght@0,300..900;1,300..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Open and geometric; corporate without being cold.",
+  },
+  {
+    family: "Source Serif 4",
+    category: "serif",
+    google: "ital,opsz,wght@0,8..60,200..900;1,8..60,200..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Screen-first serif; comfortable over long measures.",
+  },
+  {
+    family: "Lora",
+    category: "serif",
+    google: "ital,wght@0,400..700;1,400..700",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Brushed curves — the safe editorial body serif.",
+  },
+  {
+    family: "Crimson Pro",
+    category: "serif",
+    google: "ital,wght@0,200..900;1,200..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Old-style and book-like; low contrast survives screens.",
+  },
+  {
+    family: "Newsreader",
+    category: "serif",
+    google: "ital,opsz,wght@0,6..72,200..800;1,6..72,200..800",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body", "display"],
+    note: "Made for news, so it works as body and as headline.",
+  },
+  {
+    family: "Literata",
+    category: "serif",
+    google: "ital,opsz,wght@0,7..72,200..900;1,7..72,200..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Google's ebook serif; sturdy down to small sizes.",
+  },
+  {
+    family: "Spectral",
+    category: "serif",
+    google: "wght@400;500;600;700",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Screen-native serif with generous built-in spacing.",
+  },
+  {
+    family: "EB Garamond",
+    category: "serif",
+    google: "ital,wght@0,400..800;1,400..800",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Classic Garamond — give it size and leading to breathe.",
+  },
+  {
+    family: "Libre Baskerville",
+    category: "serif",
+    google: "ital,wght@0,400..700;1,400..700",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "High contrast; set it larger than you think.",
+  },
+  {
+    family: "Bitter",
+    category: "serif",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Contemporary slab that stays strong at small sizes.",
+  },
+  {
+    family: "Merriweather",
+    category: "serif",
+    google: "ital,opsz,wght@0,18..144,300..900;1,18..144,300..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Dense and dark; built to be legible on screens.",
+  },
+  {
+    family: "Petrona",
+    category: "serif",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body", "display"],
+    note: "Quirky text serif with a surprisingly wide range.",
+  },
+  {
+    family: "Faustina",
+    category: "serif",
+    google: "ital,wght@0,300..800;1,300..800",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Compact serif that packs a lot of words per line.",
+  },
+  {
+    family: "Frank Ruhl Libre",
+    category: "serif",
+    google: "wght@300..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body", "display"],
+    note: "Hebrew-rooted serif with striking heavy weights.",
+  },
+  {
+    family: "Vollkorn",
+    category: "serif",
+    google: "ital,wght@0,400..900;1,400..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Warm and slightly rough — good for long-form.",
+  },
+  {
+    family: "Zilla Slab",
+    category: "serif",
+    google: "wght@400;500;600;700",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body", "display"],
+    note: "Mozilla's slab: technical but warm.",
+  },
+  {
+    family: "Roboto Slab",
+    category: "serif",
+    google: "wght@100..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body", "display"],
+    note: "Neutral slab; the least surprising choice.",
+  },
+  {
+    family: "Alegreya",
+    category: "serif",
+    google: "ital,wght@0,400..900;1,400..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["body"],
+    note: "Calligraphic origins, designed for literature.",
+  },
+  {
+    family: "Instrument Serif",
+    category: "serif",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "High-contrast display serif; everywhere right now.",
+  },
+  {
+    family: "Fraunces",
+    category: "serif",
+    google: "opsz,wght@9..144,100..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Wonky and optical-size aware; enormous personality.",
+  },
+  {
+    family: "Playfair Display",
+    category: "serif",
+    google: "wght@400..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "High-contrast Didone — the classic luxury headline.",
+  },
+  {
+    family: "DM Serif Display",
+    category: "serif",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Sharp Didone; the free Playfair alternative.",
+  },
+  {
+    family: "Bodoni Moda",
+    category: "serif",
+    google: "opsz,wght@6..96,400..900",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "True Didone with optical sizes; fashion-editorial.",
+  },
+  {
+    family: "Abril Fatface",
+    category: "display",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Heavy Didone built for one-word headlines.",
+  },
+  {
+    family: "Unbounded",
+    category: "sans",
+    google: "wght@200..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Geometric and loud; unmistakably brand-forward.",
+  },
+  {
+    family: "Syne",
+    category: "sans",
+    google: "wght@400..800",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Deliberately odd widths — art-gallery energy.",
+  },
+  {
+    family: "Anton",
+    category: "sans",
+    google: "wght@400",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Ultra-condensed poster weight, and only that.",
+  },
+  {
+    family: "Bebas Neue",
+    category: "sans",
+    google: "wght@400",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "All-caps condensed; posters and scoreboards.",
+  },
+  {
+    family: "Archivo Black",
+    category: "sans",
+    google: "wght@400",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "One very heavy weight that fills the line.",
+  },
+  {
+    family: "Big Shoulders",
+    category: "display",
+    google: "opsz,wght@10..72,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Tall condensed; wayfinding and data-dense headers.",
+  },
+  {
+    family: "Cormorant Garamond",
+    category: "serif",
+    google: "wght@300..700",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Delicate high contrast — set it big or lose it.",
+  },
+  {
+    family: "Marcellus",
+    category: "serif",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Roman inscriptional capitals; quietly expensive.",
+  },
+  {
+    family: "Prata",
+    category: "serif",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Didone with a single weight and a lot of poise.",
+  },
+  {
+    family: "Gloock",
+    category: "serif",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Fat high-contrast serif; editorial and current.",
+  },
+  {
+    family: "Yeseva One",
+    category: "display",
+    google: "wght@400",
+    fallback: "ui-serif, Georgia, serif",
+    roles: ["display"],
+    note: "Curvy and decorative; strong at very large sizes.",
+  },
+  {
+    family: "Chivo",
+    category: "sans",
+    google: "ital,wght@0,100..900;1,100..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Grotesque with heavy weights made for headlines.",
+  },
+  {
+    family: "Darker Grotesque",
+    category: "sans",
+    google: "wght@300..900",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display"],
+    note: "Tall, tight and slightly strange.",
+  },
+  {
+    family: "Familjen Grotesk",
+    category: "sans",
+    google: "ital,wght@0,400..700;1,400..700",
+    fallback: "ui-sans-serif, system-ui, sans-serif",
+    roles: ["display", "body"],
+    note: "Swedish grotesque with a distinctive g.",
+  },
+  {
+    family: "Caveat",
+    category: "handwriting",
+    google: "wght@400..700",
+    fallback: "ui-rounded, cursive",
+    roles: ["display"],
+    note: "Handwritten — annotations and margin notes.",
+  },
+  {
+    family: "JetBrains Mono",
+    category: "mono",
+    google: "wght@100..800",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Tall x-height, drawn for code; the safe default.",
+  },
+  {
+    family: "IBM Plex Mono",
+    category: "mono",
+    google: "wght@400;500;600;700",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Pairs exactly with Plex Sans and Plex Serif.",
+  },
+  {
+    family: "Space Mono",
+    category: "mono",
+    google: "wght@400;700",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono", "display"],
+    note: "Retro-technical and quirky; works as display mono.",
+  },
+  {
+    family: "Fira Code",
+    category: "mono",
+    google: "wght@300..700",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Programming ligatures, if you want them.",
+  },
+  {
+    family: "Source Code Pro",
+    category: "mono",
+    google: "wght@200..900",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Adobe's code face; wide and unambiguous.",
+  },
+  {
+    family: "Roboto Mono",
+    category: "mono",
+    google: "wght@100..700",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "The neutral default nobody objects to.",
+  },
+  {
+    family: "DM Mono",
+    category: "mono",
+    google: "wght@400;500",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Low contrast and geometric; unusually pretty.",
+  },
+  {
+    family: "Geist Mono",
+    category: "mono",
+    google: "wght@100..900",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Geist's twin — use them together.",
+  },
+  {
+    family: "Martian Mono",
+    category: "mono",
+    google: "wght@100..800",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono", "display"],
+    note: "Wide and semi-condensed; a mono with presence.",
+  },
+  {
+    family: "Azeret Mono",
+    category: "mono",
+    google: "wght@100..900",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Boxy and deliberate; good for figures and tables.",
+  },
+  {
+    family: "Red Hat Mono",
+    category: "mono",
+    google: "wght@300..700",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Humanist mono that reads like prose.",
+  },
+  {
+    family: "Inconsolata",
+    category: "mono",
+    google: "wght@200..900",
+    fallback: "ui-monospace, SFMono-Regular, monospace",
+    roles: ["mono"],
+    note: "Narrow and efficient; fits more columns.",
+  },
+];
+
+/** Families offered for a role, best fit first. */
+export function fontsForRole(role: FontRole): CatalogFont[] {
+  return FONT_CATALOG.filter((f) => f.roles.includes(role)).sort(
+    (a, b) => a.roles.indexOf(role) - b.roles.indexOf(role),
+  );
+}
+
+/** Look up a curated family by name. */
+export function catalogFont(family: string): CatalogFont | undefined {
+  return FONT_CATALOG.find((f) => f.family === family);
+}
+
+/** The CSS stack `set_fonts` would write for this family. */
+export function fontStack(font: CatalogFont): string {
+  return `"${font.family}", ${font.fallback}`;
+}
+
+/**
+ * A css2 URL for one family. `text` asks Google for just the glyphs in that
+ * string, which is how the picker previews eighty families without pulling
+ * eighty full fonts.
+ */
+export function googleFontUrl(spec: string | true, family: string, text?: string): string {
+  const param = family.replace(/ /g, "+");
+  const value = spec === true ? param : `${param}:${spec}`;
+  const suffix = text ? `&text=${encodeURIComponent(text)}` : "";
+  return `https://fonts.googleapis.com/css2?family=${value}${suffix}&display=swap`;
+}