branding-engine 0.1.0 → 0.2.1

package/src/make-mark.mjs

@@ -8,10 +8,12 @@ import path from 'node:path';
 import sharp from 'sharp';
 import { markSvg } from './lib/mark.mjs';
 import { normalizeHex } from './lib/color.mjs';
+import { normalizeGlyph } from './lib/identity.mjs';
 import { pngsToIco } from './lib/ico.mjs';
 
 export async function makeMark({ slug, hex, glyph = 'JS', outDir }) {
   const fill = normalizeHex(hex);
+  glyph = normalizeGlyph(glyph);
   const iconsDir = path.join(outDir, slug, 'icons');
   const markDir = path.join(outDir, slug, 'mark');
   fs.mkdirSync(iconsDir, { recursive: true });

package/src/make-sheet.mjs

@@ -7,6 +7,7 @@ import { mkdirSync, writeFileSync } from 'node:fs';
 import path from 'node:path';
 import sharp from 'sharp';
 import { markSvg } from './lib/mark.mjs';
+import { normalizeGlyph } from './lib/identity.mjs';
 import { fontPath } from './lib/font.mjs';
 import { darken, normalizeHex } from './lib/color.mjs';
 import { esc } from './lib/html.mjs';
@@ -21,6 +22,7 @@ function prettyFont(file) {
 }
 
 export async function makeSheet({ slug, hex, glyph = 'JS', wordmark, deep, browser, outDir }) {
+  glyph = normalizeGlyph(glyph);
   const fill = normalizeHex(hex);
   const deepShade = deep ? normalizeHex(deep) : darken(fill);
   const title = wordmark || glyph;

package/src/make-web.mjs

@@ -5,9 +5,11 @@
 import { mkdirSync, writeFileSync } from 'node:fs';
 import path from 'node:path';
 import { darken, normalizeHex } from './lib/color.mjs';
+import { normalizeGlyph } from './lib/identity.mjs';
 
 export function makeWeb({ slug, hex, glyph = 'JS', name, deep, onColor, outDir }) {
   const accent = normalizeHex(hex);
+  glyph = normalizeGlyph(glyph);
   const deepShade = deep ? normalizeHex(deep) : darken(accent);
   const onAccent = onColor ? normalizeHex(onColor) : '#ffffff';
   const label = name || slug;

package/src/make-wordmark.mjs

@@ -8,6 +8,7 @@ import path from 'node:path';
 import sharp from 'sharp';
 import { wordmarkSvg } from './lib/wordmark.mjs';
 import { WORDMARK_CHARS, ensureGlyphs, wordmarkGlyphFile } from './lib/glyphs.mjs';
+import { normalizeGlyph } from './lib/identity.mjs';
 
 const INK = { light: '#0b0620', dark: '#ffffff' }; // ink for light / dark backgrounds
 const PNG_HEIGHT = 512; // raster export height; SVG stays the source of truth
@@ -17,13 +18,14 @@ const VARIANTS = [
 ];
 
 export async function makeWordmark({ slug, hex, text, glyph = 'JS', weight = 700, outDir }) {
+  glyph = normalizeGlyph(glyph);
   const dir = path.join(outDir, slug, 'wordmark');
   mkdirSync(dir, { recursive: true });
 
   // The build pre-extracts, but a one-off kit lands straight here, so make sure
   // the cache exists. It bundles the whole alphabet (WORDMARK_CHARS) so a one-off
   // never overwrites the shared set with just its own name's letters.
-  ensureGlyphs({ file: wordmarkGlyphFile(), weight, chars: WORDMARK_CHARS, label: 'wordmark glyphs' });
+  await ensureGlyphs({ file: wordmarkGlyphFile(), weight, chars: WORDMARK_CHARS, label: 'wordmark glyphs' });
 
   const toPng = (svg) => sharp(Buffer.from(svg)).resize({ height: PNG_HEIGHT }).png().toBuffer();
   for (const { caps, base } of VARIANTS) {

package/src/site.mjs

@@ -11,6 +11,7 @@ import path from 'node:path';
 import sharp from 'sharp';
 import { markSvg } from './lib/mark.mjs';
 import { darken, normalizeHex } from './lib/color.mjs';
+import { normalizeGlyph } from './lib/identity.mjs';
 import { pngsToIco } from './lib/ico.mjs';
 
 const DEFAULT_CONFIG = {
@@ -27,6 +28,7 @@ function headSnippet(accent) {
     '<link rel="icon" type="image/svg+xml" href="/favicon.svg" />',
     '<link rel="apple-touch-icon" href="/apple-touch-icon.png" />',
     '<link rel="manifest" href="/site.webmanifest" />',
+    '<link rel="stylesheet" href="/brand-tokens.css" />',
     `<meta name="theme-color" content="${accent}" />`,
   ].join('\n');
 }
@@ -69,7 +71,7 @@ export async function generateSite({ config, publicDir = 'public', cwd = process
   const accent = normalizeHex(cfg.accent);
   const onAccent = cfg.onColor ? normalizeHex(cfg.onColor) : '#ffffff';
   const deep = cfg.deep ? normalizeHex(cfg.deep) : darken(accent);
-  const glyph = cfg.glyph || 'JS';
+  const glyph = normalizeGlyph(cfg.glyph || 'JS');
   const name = cfg.name || 'Site';
 
   const pub = path.resolve(cwd, publicDir);

package/requirements.txt

@@ -1,3 +0,0 @@
-# For ./glyphs.sh (glyph extraction). Install with: pip install -r requirements.txt
-fonttools>=4.60
-brotli>=1.1

package/src/lib/extract-glyphs.py

@@ -1,75 +0,0 @@
-#!/usr/bin/env python3
-"""Extract glyph outlines as SVG path data for the brand mark.
-
-Defaults to the bundled Inter variable woff2, but any font works: pass a path to
-a .ttf/.otf/.woff2. Variable fonts are instantiated at the given weight; static
-fonts use their single master. Output is JSON the node generators consume, so
-they stay pure-node.
-
-Usage:
-  python3 bin/lib/extract-glyphs.py "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789" 800
-  python3 bin/lib/extract-glyphs.py "AB" 700 ~/fonts/SomeFont.ttf
-  python3 bin/lib/extract-glyphs.py "AB" 700 ~/fonts/SomeFont.ttf myfont-glyphs.json
-
-The default run writes brand-glyphs.json (the kit's glyph cache). A custom font
-writes <font-stem>-glyphs.json unless you name the output, so the brand cache is
-never clobbered by accident. Point a generator at a non-default file with
-BRAND_GLYPHS=<file> (e.g. BRAND_GLYPHS=somefont-glyphs.json ./kit.sh ...).
-"""
-import json
-import sys
-from pathlib import Path
-
-from fontTools.ttLib import TTFont
-from fontTools.varLib.instancer import instantiateVariableFont
-from fontTools.pens.svgPathPen import SVGPathPen
-from fontTools.pens.boundsPen import BoundsPen
-
-here = Path(__file__).resolve().parent
-root = here.parents[1]
-default_font = root / "assets/fonts/inter/inter-variable-latin.woff2"
-
-chars = sys.argv[1] if len(sys.argv) > 1 else "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789"
-weight = float(sys.argv[2]) if len(sys.argv) > 2 else 800.0
-font_path = Path(sys.argv[3]).expanduser() if len(sys.argv) > 3 else default_font
-
-if len(sys.argv) > 4:
-    out_path = Path(sys.argv[4])
-    if not out_path.is_absolute():
-        out_path = here / out_path
-elif len(sys.argv) > 3:
-    # Custom font, no explicit output: derive a name so Inter is never clobbered.
-    out_path = here / f"{font_path.stem}-glyphs.json"
-else:
-    out_path = here / "brand-glyphs.json"
-
-font = TTFont(str(font_path))
-if "fvar" in font:
-    instantiateVariableFont(font, {"wght": weight}, inplace=True)
-
-glyph_set = font.getGlyphSet()
-cmap = font.getBestCmap()
-upem = font["head"].unitsPerEm
-
-glyphs = {}
-for ch in dict.fromkeys(chars):
-    name = cmap[ord(ch)]
-    g = glyph_set[name]
-    pen = SVGPathPen(glyph_set)
-    g.draw(pen)
-    bp = BoundsPen(glyph_set)
-    g.draw(bp)
-    # Blank glyphs (e.g. the space) have no contours, so BoundsPen leaves
-    # bounds None; they still carry an advance width the layout needs.
-    xmin, ymin, xmax, ymax = bp.bounds or (0, 0, 0, 0)
-    glyphs[ch] = {
-        "path": pen.getCommands(),
-        "advance": g.width,
-        "bounds": {"xMin": xmin, "yMin": ymin, "xMax": xmax, "yMax": ymax},
-    }
-
-out_path.write_text(json.dumps(
-    {"font": font_path.name, "unitsPerEm": upem, "weight": weight, "glyphs": glyphs},
-    indent=2,
-))
-print(f"wrote {out_path.name} from {font_path.name} — upem={upem} weight={int(weight)} chars={''.join(glyphs)}")