@hanzo/ui 8.3.2 → 8.3.3

package/dist/gallery.html

@@ -1,4 +1,4 @@
-<!doctype html><html lang="en" class="t_dark"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>@hanzo/ui 8.3.2</title><style>/* @hanzo/ui — generated by scripts/gen-css.mjs. Do not edit. */
+<!doctype html><html lang="en" class="t_dark"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>@hanzo/ui 8.3.3</title><style>/* @hanzo/ui — generated by scripts/gen-css.mjs. Do not edit. */
 :root { --hanzo-ui-styles: 1; }
 /* Hanzo Design System — the entry point. Import THIS one file.
  *
@@ -840,33 +840,72 @@
 }
 
 /* ── tokens/fonts.css ─────────────────────────────────────── */
-/* Geist Sans + Geist Mono — the only two faces on Hanzo surfaces.
+/* Zen — the only family on Hanzo surfaces, sans and mono.
    SELF-HOSTED. The faces ship inside this package (assets/fonts/*.woff2, two
-   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Geist.txt).
-
-   Why self-hosted rather than @import from fonts.googleapis.com:
+   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Zen.txt).
+
+   Zen is our own family, under the SIL Open Font License. The licence file
+   beside the binaries carries every copyright the OFL requires; nothing else in
+   this repository restates them, which is the whole of what §2 asks for.
+
+   SHIPPED here rather than @import-ed from `@hanzo/font`, and that is load
+   bearing. `@hanzo/ui` composes this file into the MIDDLE of its theme.css, and
+   CSS drops an @import that does not precede every other rule — measured, in
+   Chromium, on the built sheet: zero faces loaded and not one woff2 requested.
+   An @font-face has no such ordering rule, so declaring the faces is the only
+   form that survives being flattened into a larger stylesheet. `@hanzo/font`
+   remains the one place the faces are AUTHORED; this is a copy of its output,
+   the same way the colour tokens are copied rather than fetched.
+
+   Why self-hosted rather than a third-party CDN:
    - A sign-in page must not make a third-party request. hanzoai/id refused to
      import this file for exactly that reason, which split the token layer: id
      took the colours and not the typeface. Self-hosting removes the reason, so
      every surface can import styles.css unchanged.
-   - The @import was a render-blocking request to a host we do not control, on
-     the critical path of every surface, and it broke offline/air-gapped dev.
+   - It was a render-blocking request to a host we do not control, on the
+     critical path of every surface, and it broke offline/air-gapped dev.
    - One variable file per family replaces nine static weights, and it is fewer
-     bytes than the CSS-then-woff2 round trip Google served.
+     bytes than the CSS-then-woff2 round trip.
 
    The url()s are relative to THIS file, so they resolve wherever the package is
-   mounted — node_modules, a CDN, a copied dist — with no configuration. */
+   mounted — node_modules, a CDN, a copied dist — with no configuration.
+
+   `font-display: block`, NOT swap, and the difference is the whole brand. `swap`
+   paints the fallback IMMEDIATELY and repaints when the face lands, so every first
+   visit shows the platform's own sans for as long as the download takes — on Ubuntu
+   that is DejaVu, which looks nothing like us and is the single most common way a
+   Hanzo surface renders wrong. `block` holds the text invisible for a short period
+   (~3s) and then paints Zen, so the fallback is only ever reached when the face
+   genuinely fails to arrive. A held word is a moment; the wrong typeface is the
+   brand. The generic tail below stays for exactly that real-failure case. */
 
 
 
 
 :root{
-  --font-sans:"Geist","Geist Sans",ui-sans-serif,system-ui,sans-serif;
+  --font-sans:"Zen",ui-sans-serif,system-ui,sans-serif;
   --font-display:var(--font-sans);
-  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,monospace;
+  --font-mono:"Zen Mono",ui-monospace,SFMono-Regular,monospace;
   --font-serif:Georgia,serif;
-  /* hanzo.ai sets these OpenType features on <body>. */
-  --font-feature-settings:"ss01","ss02","cv01","cv02","cv03";
+  /* The default is Zen as drawn, and that is a decision rather than an omission.
+     `base.css` puts this on <body>, so whatever is here is the voice of every
+     surface in the estate — which is exactly why it should not carry a brand's.
+
+     It used to read `"ss01","ss02","cv01","cv02","cv03"`, of which FOUR did
+     nothing: Zen has no cv01/cv02/cv03 at all, and ss01 and ss02 both remap `a`,
+     so ss01 substitutes first and ss02 never matches the glyph it was written
+     for. The one that did work quietly gave Lux and Zoo the single-storey `a`
+     that belongs to Hanzo.
+
+     A brand sets its own voice by overriding THIS token — one knob, one place:
+       Hanzo   "ss01"            single-storey a, the neo-grotesque register
+       Lux     "ss04"            straight-leg R, to sit under the wordmark
+       Zoo     normal            the humanist default, the warmest of the three
+     Zen ships eleven sets; ss03 is a tailed l, ss05 a serifed I, ss06 an
+     alternate G and ss09 a slashed zero with a serif one. Kerning, ligatures and
+     contextual alternates are on by default in every browser and do not belong
+     in this list. */
+  --font-feature-settings:normal;
 }
 
 /* ── tokens/base.css ─────────────────────────────────────── */
@@ -1089,6 +1128,13 @@
   :where(*)::-webkit-scrollbar-thumb{background:var(--white-15);border-radius:var(--radius-full)}
   :where(*)::-webkit-scrollbar-thumb:hover{background:var(--white-30)}
   :where(*)::-webkit-scrollbar-corner{background:transparent}
+  /* The stepper arrows, and they are a LINUX defect specifically. Chromium on
+     macOS draws no buttons, so styling the track and thumb looks finished there
+     and ships a classic GTK scrollbar — a boxed arrow at each end of every
+     scroller, on both axes — to everyone on Ubuntu. Styling the other pseudos
+     does not suppress them; only this does. Zero width AND height because the
+     horizontal and vertical bars each read one of them. */
+  :where(*)::-webkit-scrollbar-button{display:none;width:0;height:0}
   .light :where(*)::-webkit-scrollbar-thumb{background:rgb(0 0 0 / .18)}
   .light :where(*)::-webkit-scrollbar-thumb:hover{background:rgb(0 0 0 / .32)}
 }

package/dist/styles.css

@@ -840,33 +840,72 @@
 }
 
 /* ── tokens/fonts.css ─────────────────────────────────────── */
-/* Geist Sans + Geist Mono — the only two faces on Hanzo surfaces.
+/* Zen — the only family on Hanzo surfaces, sans and mono.
    SELF-HOSTED. The faces ship inside this package (assets/fonts/*.woff2, two
-   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Geist.txt).
-
-   Why self-hosted rather than @import from fonts.googleapis.com:
+   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Zen.txt).
+
+   Zen is our own family, under the SIL Open Font License. The licence file
+   beside the binaries carries every copyright the OFL requires; nothing else in
+   this repository restates them, which is the whole of what §2 asks for.
+
+   SHIPPED here rather than @import-ed from `@hanzo/font`, and that is load
+   bearing. `@hanzo/ui` composes this file into the MIDDLE of its theme.css, and
+   CSS drops an @import that does not precede every other rule — measured, in
+   Chromium, on the built sheet: zero faces loaded and not one woff2 requested.
+   An @font-face has no such ordering rule, so declaring the faces is the only
+   form that survives being flattened into a larger stylesheet. `@hanzo/font`
+   remains the one place the faces are AUTHORED; this is a copy of its output,
+   the same way the colour tokens are copied rather than fetched.
+
+   Why self-hosted rather than a third-party CDN:
    - A sign-in page must not make a third-party request. hanzoai/id refused to
      import this file for exactly that reason, which split the token layer: id
      took the colours and not the typeface. Self-hosting removes the reason, so
      every surface can import styles.css unchanged.
-   - The @import was a render-blocking request to a host we do not control, on
-     the critical path of every surface, and it broke offline/air-gapped dev.
+   - It was a render-blocking request to a host we do not control, on the
+     critical path of every surface, and it broke offline/air-gapped dev.
    - One variable file per family replaces nine static weights, and it is fewer
-     bytes than the CSS-then-woff2 round trip Google served.
+     bytes than the CSS-then-woff2 round trip.
 
    The url()s are relative to THIS file, so they resolve wherever the package is
-   mounted — node_modules, a CDN, a copied dist — with no configuration. */
+   mounted — node_modules, a CDN, a copied dist — with no configuration.
+
+   `font-display: block`, NOT swap, and the difference is the whole brand. `swap`
+   paints the fallback IMMEDIATELY and repaints when the face lands, so every first
+   visit shows the platform's own sans for as long as the download takes — on Ubuntu
+   that is DejaVu, which looks nothing like us and is the single most common way a
+   Hanzo surface renders wrong. `block` holds the text invisible for a short period
+   (~3s) and then paints Zen, so the fallback is only ever reached when the face
+   genuinely fails to arrive. A held word is a moment; the wrong typeface is the
+   brand. The generic tail below stays for exactly that real-failure case. */
 
 
 
 
 :root{
-  --font-sans:"Geist","Geist Sans",ui-sans-serif,system-ui,sans-serif;
+  --font-sans:"Zen",ui-sans-serif,system-ui,sans-serif;
   --font-display:var(--font-sans);
-  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,monospace;
+  --font-mono:"Zen Mono",ui-monospace,SFMono-Regular,monospace;
   --font-serif:Georgia,serif;
-  /* hanzo.ai sets these OpenType features on <body>. */
-  --font-feature-settings:"ss01","ss02","cv01","cv02","cv03";
+  /* The default is Zen as drawn, and that is a decision rather than an omission.
+     `base.css` puts this on <body>, so whatever is here is the voice of every
+     surface in the estate — which is exactly why it should not carry a brand's.
+
+     It used to read `"ss01","ss02","cv01","cv02","cv03"`, of which FOUR did
+     nothing: Zen has no cv01/cv02/cv03 at all, and ss01 and ss02 both remap `a`,
+     so ss01 substitutes first and ss02 never matches the glyph it was written
+     for. The one that did work quietly gave Lux and Zoo the single-storey `a`
+     that belongs to Hanzo.
+
+     A brand sets its own voice by overriding THIS token — one knob, one place:
+       Hanzo   "ss01"            single-storey a, the neo-grotesque register
+       Lux     "ss04"            straight-leg R, to sit under the wordmark
+       Zoo     normal            the humanist default, the warmest of the three
+     Zen ships eleven sets; ss03 is a tailed l, ss05 a serifed I, ss06 an
+     alternate G and ss09 a slashed zero with a serif one. Kerning, ligatures and
+     contextual alternates are on by default in every browser and do not belong
+     in this list. */
+  --font-feature-settings:normal;
 }
 
 /* ── tokens/base.css ─────────────────────────────────────── */
@@ -1089,6 +1128,13 @@
   :where(*)::-webkit-scrollbar-thumb{background:var(--white-15);border-radius:var(--radius-full)}
   :where(*)::-webkit-scrollbar-thumb:hover{background:var(--white-30)}
   :where(*)::-webkit-scrollbar-corner{background:transparent}
+  /* The stepper arrows, and they are a LINUX defect specifically. Chromium on
+     macOS draws no buttons, so styling the track and thumb looks finished there
+     and ships a classic GTK scrollbar — a boxed arrow at each end of every
+     scroller, on both axes — to everyone on Ubuntu. Styling the other pseudos
+     does not suppress them; only this does. Zero width AND height because the
+     horizontal and vertical bars each read one of them. */
+  :where(*)::-webkit-scrollbar-button{display:none;width:0;height:0}
   .light :where(*)::-webkit-scrollbar-thumb{background:rgb(0 0 0 / .18)}
   .light :where(*)::-webkit-scrollbar-thumb:hover{background:rgb(0 0 0 / .32)}
 }

package/dist/theme.css

@@ -838,33 +838,72 @@
 }
 
 /* ── tokens/fonts.css ─────────────────────────────────────── */
-/* Geist Sans + Geist Mono — the only two faces on Hanzo surfaces.
+/* Zen — the only family on Hanzo surfaces, sans and mono.
    SELF-HOSTED. The faces ship inside this package (assets/fonts/*.woff2, two
-   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Geist.txt).
-
-   Why self-hosted rather than @import from fonts.googleapis.com:
+   variable files, 141 KB total, SIL OFL-1.1 — see assets/fonts/LICENSE-Zen.txt).
+
+   Zen is our own family, under the SIL Open Font License. The licence file
+   beside the binaries carries every copyright the OFL requires; nothing else in
+   this repository restates them, which is the whole of what §2 asks for.
+
+   SHIPPED here rather than @import-ed from `@hanzo/font`, and that is load
+   bearing. `@hanzo/ui` composes this file into the MIDDLE of its theme.css, and
+   CSS drops an @import that does not precede every other rule — measured, in
+   Chromium, on the built sheet: zero faces loaded and not one woff2 requested.
+   An @font-face has no such ordering rule, so declaring the faces is the only
+   form that survives being flattened into a larger stylesheet. `@hanzo/font`
+   remains the one place the faces are AUTHORED; this is a copy of its output,
+   the same way the colour tokens are copied rather than fetched.
+
+   Why self-hosted rather than a third-party CDN:
    - A sign-in page must not make a third-party request. hanzoai/id refused to
      import this file for exactly that reason, which split the token layer: id
      took the colours and not the typeface. Self-hosting removes the reason, so
      every surface can import styles.css unchanged.
-   - The @import was a render-blocking request to a host we do not control, on
-     the critical path of every surface, and it broke offline/air-gapped dev.
+   - It was a render-blocking request to a host we do not control, on the
+     critical path of every surface, and it broke offline/air-gapped dev.
    - One variable file per family replaces nine static weights, and it is fewer
-     bytes than the CSS-then-woff2 round trip Google served.
+     bytes than the CSS-then-woff2 round trip.
 
    The url()s are relative to THIS file, so they resolve wherever the package is
-   mounted — node_modules, a CDN, a copied dist — with no configuration. */
+   mounted — node_modules, a CDN, a copied dist — with no configuration.
+
+   `font-display: block`, NOT swap, and the difference is the whole brand. `swap`
+   paints the fallback IMMEDIATELY and repaints when the face lands, so every first
+   visit shows the platform's own sans for as long as the download takes — on Ubuntu
+   that is DejaVu, which looks nothing like us and is the single most common way a
+   Hanzo surface renders wrong. `block` holds the text invisible for a short period
+   (~3s) and then paints Zen, so the fallback is only ever reached when the face
+   genuinely fails to arrive. A held word is a moment; the wrong typeface is the
+   brand. The generic tail below stays for exactly that real-failure case. */
 
 
 
 
 :root{
-  --font-sans:"Geist","Geist Sans",ui-sans-serif,system-ui,sans-serif;
+  --font-sans:"Zen",ui-sans-serif,system-ui,sans-serif;
   --font-display:var(--font-sans);
-  --font-mono:"Geist Mono",ui-monospace,SFMono-Regular,monospace;
+  --font-mono:"Zen Mono",ui-monospace,SFMono-Regular,monospace;
   --font-serif:Georgia,serif;
-  /* hanzo.ai sets these OpenType features on <body>. */
-  --font-feature-settings:"ss01","ss02","cv01","cv02","cv03";
+  /* The default is Zen as drawn, and that is a decision rather than an omission.
+     `base.css` puts this on <body>, so whatever is here is the voice of every
+     surface in the estate — which is exactly why it should not carry a brand's.
+
+     It used to read `"ss01","ss02","cv01","cv02","cv03"`, of which FOUR did
+     nothing: Zen has no cv01/cv02/cv03 at all, and ss01 and ss02 both remap `a`,
+     so ss01 substitutes first and ss02 never matches the glyph it was written
+     for. The one that did work quietly gave Lux and Zoo the single-storey `a`
+     that belongs to Hanzo.
+
+     A brand sets its own voice by overriding THIS token — one knob, one place:
+       Hanzo   "ss01"            single-storey a, the neo-grotesque register
+       Lux     "ss04"            straight-leg R, to sit under the wordmark
+       Zoo     normal            the humanist default, the warmest of the three
+     Zen ships eleven sets; ss03 is a tailed l, ss05 a serifed I, ss06 an
+     alternate G and ss09 a slashed zero with a serif one. Kerning, ligatures and
+     contextual alternates are on by default in every browser and do not belong
+     in this list. */
+  --font-feature-settings:normal;
 }
 
 /* ── tokens/base.css ─────────────────────────────────────── */
@@ -1087,6 +1126,13 @@
   :where(*)::-webkit-scrollbar-thumb{background:var(--white-15);border-radius:var(--radius-full)}
   :where(*)::-webkit-scrollbar-thumb:hover{background:var(--white-30)}
   :where(*)::-webkit-scrollbar-corner{background:transparent}
+  /* The stepper arrows, and they are a LINUX defect specifically. Chromium on
+     macOS draws no buttons, so styling the track and thumb looks finished there
+     and ships a classic GTK scrollbar — a boxed arrow at each end of every
+     scroller, on both axes — to everyone on Ubuntu. Styling the other pseudos
+     does not suppress them; only this does. Zero width AND height because the
+     horizontal and vertical bars each read one of them. */
+  :where(*)::-webkit-scrollbar-button{display:none;width:0;height:0}
   .light :where(*)::-webkit-scrollbar-thumb{background:rgb(0 0 0 / .18)}
   .light :where(*)::-webkit-scrollbar-thumb:hover{background:rgb(0 0 0 / .32)}
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.3.2",
+  "version": "8.3.3",
   "type": "module",
   "description": "Hanzo UI — the one canonical Hanzo component library, on @hanzo/gui + @hanzo/design. ONE substrate: every component renders through @hanzo/gui primitives, so the same import works on web, native (expo) and desktop (Tauri). Self-contained (theme.css), presentational, host-agnostic, clean-room.",
   "exports": {
@@ -211,11 +211,11 @@
   "dependencies": {
     "@hanzo/appearance": "^0.2.2",
     "@hanzo/brand": "^1.4.5",
-    "@hanzo/design": "^0.5.18",
+    "@hanzo/design": "^0.5.21",
+    "@hanzo/font": "^1.8.2",
     "@hanzo/logo": "^1.0.13",
     "@hanzo/products": "^0.2.0",
-    "clsx": "^2.1.1",
-    "@hanzo/font": "^1.8.1"
+    "clsx": "^2.1.1"
   },
   "peerDependencies": {
     "@hanzo/canvas": ">=0.1.0",