@hanzo/design 0.3.4 → 0.3.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/design",
-  "version": "0.3.4",
+  "version": "0.3.5",
   "packageManager": "pnpm@11.17.0",
   "description": "Hanzo Design System \u2014 monochrome, dark-default tokens + components + brand assets, the single source of truth for every Hanzo surface. CSS + typed programmatic tokens.",
   "license": "BSD-3-Clause",

package/scripts/check-tokens.mjs

@@ -3,7 +3,7 @@
 // unimported token file resolves nothing, and a 1.66:1 focus ring looks fine to
 // whoever shipped it. None of them can fail loudly on their own, so they fail
 // here. Run via `npm test` (part of `build`).
-import { readFileSync, readdirSync } from 'node:fs'
+import { existsSync, readFileSync, readdirSync } from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import { dirname, join } from 'node:path'
 
@@ -44,6 +44,19 @@ const pass = (msg) => console.log(`  ok    ${msg}`)
   entry.includes('@import')
     ? fail('styles.css contains an @import — a consumer cannot resolve it (see gen-tokens.mjs)')
     : pass('styles.css has no @import to resolve')
+
+  // Every asset it names must EXIST at the path it names, from the root the
+  // bundle now sits at. tokens/fonts.css points one directory up because it is
+  // authored one directory down; flattening rebases that, and a rebase that
+  // silently stopped happening would put the faces outside the package and fail
+  // every consumer's build on a missing module.
+  const urls = [...entry.matchAll(/url\(\s*['"]?([^'")]+)['"]?\s*\)/g)]
+    .map((m) => m[1])
+    .filter((u) => !/^(data:|https?:|\/\/)/.test(u))
+  const broken = urls.filter((u) => !existsSync(join(root, u)))
+  broken.length
+    ? broken.forEach((u) => fail(`styles.css references ${u}, which does not exist at the package root`))
+    : pass(`all ${urls.length} asset url()s resolve from the package root`)
 }
 
 // ── 2. every var() used inside the token layer must resolve ──────────────

package/scripts/gen-tokens.mjs

@@ -109,8 +109,17 @@ const banner = `/* Hanzo Design System — the entry point. Import THIS one file
  * always imported in.
  */
 `
+// Hoisting a file from tokens/ to the package root moves what its relative
+// url()s point at. tokens/fonts.css says `../assets/fonts/Geist-Variable.woff2`
+// — correct from tokens/, one directory too high from the root, where it lands
+// outside the package entirely and every consumer's build fails on a missing
+// module. Rebasing is therefore part of flattening, not an afterthought: the
+// bundle is one level shallower, so `../` becomes `./`.
+const rebase = (css) =>
+  css.replace(/url\((\s*['"]?)\.\.\/(?!\.)/g, 'url($1./')
+
 const bundle = banner + FILES.map((f) => {
-  const css = readFileSync(join(tokensDir, `${f}.css`), 'utf8').trim()
+  const css = rebase(readFileSync(join(tokensDir, `${f}.css`), 'utf8').trim())
   return `\n/* ── tokens/${f}.css ─────────────────────────────────────── */\n${css}\n`
 }).join('')
 writeFileSync(join(root, 'styles.css'), bundle)

package/styles.css

@@ -449,14 +449,14 @@
 
 @font-face{
   font-family:"Geist";
-  src:url("../assets/fonts/Geist-Variable.woff2") format("woff2");
+  src:url("./assets/fonts/Geist-Variable.woff2") format("woff2");
   font-weight:100 900;
   font-style:normal;
   font-display:swap;
 }
 @font-face{
   font-family:"Geist Mono";
-  src:url("../assets/fonts/GeistMono-Variable.woff2") format("woff2");
+  src:url("./assets/fonts/GeistMono-Variable.woff2") format("woff2");
   font-weight:100 900;
   font-style:normal;
   font-display:swap;