@hanzo/ui 8.0.62 → 8.0.64

package/README.md

@@ -119,7 +119,7 @@ registerField('rating', { Display: MyStars, Input: MyStarPicker })
 ```tsx
 import { Hanzo } from '@hanzo/ui'
 
-<Hanzo analytics={{ product: 'console', ingestKey: process.env.NEXT_PUBLIC_EVENT_INGEST_KEY }}>
+<Hanzo analytics={{ product: 'console', ingestKey: process.env.NEXT_PUBLIC_PUBLISHABLE_KEY }}>
   <App />
 </Hanzo>
 ```
@@ -183,8 +183,8 @@ in **both** directions, because that is what explicit means. Beyond that:
 
 `ingestKey` is a publishable `pk-…` — write-only, safe in a bundle, minted per
 org with `POST /v1/keys {"type":"publishable"}`. Omit it and the client reads
-`NEXT_PUBLIC_EVENT_INGEST_KEY` from the build env, which is the spelling the
-fleet already carries end to end (KMS holds `deploy/EVENT_INGEST_KEY`; the
+`NEXT_PUBLIC_PUBLISHABLE_KEY` from the build env, which is the spelling the
+fleet already carries end to end (KMS holds `deploy/PUBLISHABLE_KEY`; the
 Dockerfile takes it as a build-arg and re-exports it with the `NEXT_PUBLIC_`
 prefix Next needs to inline it). A surface with no key reports only for whoever
 is signed in and silently drops every logged-out visitor — the door refuses an

package/dist/gui-config.cjs

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.config = void 0;
+exports.monochrome = exports.config = void 0;
 const v5_1 = require("@hanzogui/config/v5");
 const gui_1 = require("@hanzo/gui");
 // ─────────────────────────────────────────────────────────────────────────────
@@ -224,9 +224,10 @@ const themes = Object.fromEntries(Object.entries(v5_1.defaultConfig.themes).map(
             : ringed,
     ];
 }));
-exports.config = (0, gui_1.createGui)({
+// Everything except the theme table, which is the one thing the two configs
+// below disagree about. Stated once so they cannot drift on radius or fonts.
+const base = {
     ...v5_1.defaultConfig,
-    themes,
     tokens: {
         ...v5_1.defaultConfig.tokens,
         radius: RADIUS,
@@ -243,5 +244,37 @@ exports.config = (0, gui_1.createGui)({
         // token, not a silent no-op, so it is defined.
         mono: { ...v5_1.defaultConfig.fonts.body, family: GEIST_MONO, size: FONT_SIZE, lineHeight: LINE_HEIGHT },
     },
-});
+};
+exports.config = (0, gui_1.createGui)({ ...base, themes });
 exports.default = exports.config;
+/**
+ * The eight chromatic families. Everything else a sub-theme name can carry —
+ * `accent`, `black`, `white`, `gray`, `neutral`, `surface1`, `surface2` — is a
+ * position on the greyscale, so it survives into the monochrome table below.
+ *
+ * Derived from the segment, never from a substring: `dark_teal_Button` is
+ * chromatic because one of its segments IS `teal`, while a future
+ * `dark_tealish` or a component called `Red` is not caught by accident.
+ */
+const CHROMA = new Set(['blue', 'green', 'orange', 'pink', 'purple', 'red', 'teal', 'yellow']);
+const chromatic = (name) => name.split('_').slice(1).some((s) => CHROMA.has(s));
+/**
+ * The same system with the chromatic sub-themes omitted — 150 themes instead of
+ * 390, and 62% less theme table.
+ *
+ * A gui theme table is DATA that ships: it cannot be tree-shaken, because a
+ * theme is selected by string at runtime. So a surface that renders no colour
+ * still pays for every hue. The browser extension's new-tab page is monochrome
+ * by design and loads on every single tab, and 240 themes it can never activate
+ * were the difference between it fitting its bundle budget and not.
+ *
+ * This is NOT a second design system. It is the same `config` with rows
+ * removed, from the same scale, so nothing here can drift from `config` — only
+ * be absent from it. Reach for it when a surface genuinely renders no hue;
+ * anything that does must use `config`, because a missing theme falls back
+ * silently rather than failing.
+ */
+exports.monochrome = (0, gui_1.createGui)({
+    ...base,
+    themes: Object.fromEntries(Object.entries(themes).filter(([name]) => !chromatic(name))),
+});

package/dist/gui-config.d.ts

@@ -766,5 +766,788 @@ export declare const config: import("@hanzogui/web").GuiInternalConfig<{
     styleCompat: "web";
 }, "default">;
 export default config;
+/**
+ * The same system with the chromatic sub-themes omitted — 150 themes instead of
+ * 390, and 62% less theme table.
+ *
+ * A gui theme table is DATA that ships: it cannot be tree-shaken, because a
+ * theme is selected by string at runtime. So a surface that renders no colour
+ * still pays for every hue. The browser extension's new-tab page is monochrome
+ * by design and loads on every single tab, and 240 themes it can never activate
+ * were the difference between it fitting its bundle budget and not.
+ *
+ * This is NOT a second design system. It is the same `config` with rows
+ * removed, from the same scale, so nothing here can drift from `config` — only
+ * be absent from it. Reach for it when a surface genuinely renders no hue;
+ * anything that does must use `config`, because a missing theme falls back
+ * silently rather than failing.
+ */
+export declare const monochrome: import("@hanzogui/web").GuiInternalConfig<{
+    radius: {
+        readonly 0: 0;
+        readonly 1: 6;
+        readonly 2: 6;
+        readonly 3: 8;
+        readonly 4: 8;
+        readonly 5: 12;
+        readonly 6: 12;
+        readonly 7: 12;
+        readonly 8: 12;
+        readonly 9: 12;
+        readonly 10: 9999;
+        readonly 11: 9999;
+        readonly 12: 9999;
+        readonly true: 8;
+    };
+    space: Record<string, number>;
+    zIndex: {
+        0: number;
+        1: number;
+        2: number;
+        3: number;
+        4: number;
+        5: number;
+    };
+    size: {
+        $0: number;
+        "$0.25": number;
+        "$0.5": number;
+        "$0.75": number;
+        $1: number;
+        "$1.5": number;
+        $2: number;
+        "$2.5": number;
+        $3: number;
+        "$3.5": number;
+        $4: number;
+        $true: number;
+        "$4.5": number;
+        $5: number;
+        $6: number;
+        $7: number;
+        $8: number;
+        $9: number;
+        $10: number;
+        $11: number;
+        $12: number;
+        $13: number;
+        $14: number;
+        $15: number;
+        $16: number;
+        $17: number;
+        $18: number;
+        $19: number;
+        $20: number;
+    };
+}, import("@hanzogui/config/v5").V5Themes, {
+    text: "textAlign";
+    b: "bottom";
+    bg: "backgroundColor";
+    content: "alignContent";
+    grow: "flexGrow";
+    items: "alignItems";
+    justify: "justifyContent";
+    l: "left";
+    m: "margin";
+    maxH: "maxHeight";
+    maxW: "maxWidth";
+    mb: "marginBottom";
+    minH: "minHeight";
+    minW: "minWidth";
+    ml: "marginLeft";
+    mr: "marginRight";
+    mt: "marginTop";
+    mx: "marginHorizontal";
+    my: "marginVertical";
+    p: "padding";
+    pb: "paddingBottom";
+    pl: "paddingLeft";
+    pr: "paddingRight";
+    pt: "paddingTop";
+    px: "paddingHorizontal";
+    py: "paddingVertical";
+    r: "right";
+    rounded: "borderRadius";
+    select: "userSelect";
+    self: "alignSelf";
+    shrink: "flexShrink";
+    t: "top";
+    z: "zIndex";
+}, {
+    readonly touchable: {
+        pointer: string;
+    };
+    readonly hoverable: {
+        hover: string;
+    };
+    readonly 'max-xxl': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-xl': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-lg': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-md': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-sm': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-xs': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-xxs': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-xxxs': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-200': {
+        readonly maxWidth: number;
+    };
+    readonly 'max-100': {
+        readonly maxWidth: number;
+    };
+    readonly xxxs: {
+        readonly minWidth: number;
+    };
+    readonly xxs: {
+        readonly minWidth: number;
+    };
+    readonly xs: {
+        readonly minWidth: number;
+    };
+    readonly sm: {
+        readonly minWidth: number;
+    };
+    readonly md: {
+        readonly minWidth: number;
+    };
+    readonly lg: {
+        readonly minWidth: number;
+    };
+    readonly xl: {
+        readonly minWidth: number;
+    };
+    readonly xxl: {
+        readonly minWidth: number;
+    };
+    readonly 'max-height-lg': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-md': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-sm': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-xs': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-xxs': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-xxxs': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-200': {
+        readonly maxHeight: number;
+    };
+    readonly 'max-height-100': {
+        readonly maxHeight: number;
+    };
+    readonly 'height-sm': {
+        readonly minHeight: number;
+    };
+    readonly 'height-md': {
+        readonly minHeight: number;
+    };
+    readonly 'height-lg': {
+        readonly minHeight: number;
+    };
+}, {}, {
+    body: {
+        family: string;
+        size: {
+            readonly 1: 11;
+            readonly 2: 13;
+            readonly 3: 14;
+            readonly 4: 15;
+            readonly 5: 15;
+            readonly 6: 17;
+            readonly 7: 21;
+            readonly 8: 26;
+            readonly 9: 26;
+            readonly 10: 32;
+            readonly 11: 40;
+            readonly 12: 48;
+            readonly 13: 56;
+            readonly 14: 64;
+            readonly 15: 80;
+            readonly 16: 96;
+            readonly true: 14;
+        };
+        lineHeight: {
+            readonly 1: 16;
+            readonly 2: 18;
+            readonly 3: 20;
+            readonly 4: 22;
+            readonly 5: 22;
+            readonly 6: 24;
+            readonly 7: 28;
+            readonly 8: 32;
+            readonly 9: 32;
+            readonly 10: 38;
+            readonly 11: 46;
+            readonly 12: 54;
+            readonly 13: 62;
+            readonly 14: 70;
+            readonly 15: 86;
+            readonly 16: 102;
+            readonly true: 20;
+        };
+        weight: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        letterSpacing: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        style: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        transform: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        color: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        face: Partial<Partial<{
+            bold: {
+                normal?: string;
+                italic?: string;
+            };
+            normal: {
+                normal?: string;
+                italic?: string;
+            };
+            100: {
+                normal?: string;
+                italic?: string;
+            };
+            500: {
+                normal?: string;
+                italic?: string;
+            };
+            700: {
+                normal?: string;
+                italic?: string;
+            };
+            200: {
+                normal?: string;
+                italic?: string;
+            };
+            300: {
+                normal?: string;
+                italic?: string;
+            };
+            400: {
+                normal?: string;
+                italic?: string;
+            };
+            600: {
+                normal?: string;
+                italic?: string;
+            };
+            800: {
+                normal?: string;
+                italic?: string;
+            };
+            900: {
+                normal?: string;
+                italic?: string;
+            };
+        }> | undefined>;
+    };
+    heading: {
+        family: string;
+        size: {
+            readonly 1: 11;
+            readonly 2: 13;
+            readonly 3: 14;
+            readonly 4: 15;
+            readonly 5: 15;
+            readonly 6: 17;
+            readonly 7: 21;
+            readonly 8: 26;
+            readonly 9: 26;
+            readonly 10: 32;
+            readonly 11: 40;
+            readonly 12: 48;
+            readonly 13: 56;
+            readonly 14: 64;
+            readonly 15: 80;
+            readonly 16: 96;
+            readonly true: 14;
+        };
+        lineHeight: {
+            readonly 1: 16;
+            readonly 2: 18;
+            readonly 3: 20;
+            readonly 4: 22;
+            readonly 5: 22;
+            readonly 6: 24;
+            readonly 7: 28;
+            readonly 8: 32;
+            readonly 9: 32;
+            readonly 10: 38;
+            readonly 11: 46;
+            readonly 12: 54;
+            readonly 13: 62;
+            readonly 14: 70;
+            readonly 15: 86;
+            readonly 16: 102;
+            readonly true: 20;
+        };
+        weight: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        letterSpacing: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        style: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        transform: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        color: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        face: Partial<Partial<{
+            bold: {
+                normal?: string;
+                italic?: string;
+            };
+            normal: {
+                normal?: string;
+                italic?: string;
+            };
+            100: {
+                normal?: string;
+                italic?: string;
+            };
+            500: {
+                normal?: string;
+                italic?: string;
+            };
+            700: {
+                normal?: string;
+                italic?: string;
+            };
+            200: {
+                normal?: string;
+                italic?: string;
+            };
+            300: {
+                normal?: string;
+                italic?: string;
+            };
+            400: {
+                normal?: string;
+                italic?: string;
+            };
+            600: {
+                normal?: string;
+                italic?: string;
+            };
+            800: {
+                normal?: string;
+                italic?: string;
+            };
+            900: {
+                normal?: string;
+                italic?: string;
+            };
+        }> | undefined>;
+    };
+    mono: {
+        family: string;
+        size: {
+            readonly 1: 11;
+            readonly 2: 13;
+            readonly 3: 14;
+            readonly 4: 15;
+            readonly 5: 15;
+            readonly 6: 17;
+            readonly 7: 21;
+            readonly 8: 26;
+            readonly 9: 26;
+            readonly 10: 32;
+            readonly 11: 40;
+            readonly 12: 48;
+            readonly 13: 56;
+            readonly 14: 64;
+            readonly 15: 80;
+            readonly 16: 96;
+            readonly true: 14;
+        };
+        lineHeight: {
+            readonly 1: 16;
+            readonly 2: 18;
+            readonly 3: 20;
+            readonly 4: 22;
+            readonly 5: 22;
+            readonly 6: 24;
+            readonly 7: 28;
+            readonly 8: 32;
+            readonly 9: 32;
+            readonly 10: 38;
+            readonly 11: 46;
+            readonly 12: 54;
+            readonly 13: 62;
+            readonly 14: 70;
+            readonly 15: 86;
+            readonly 16: 102;
+            readonly true: 20;
+        };
+        weight: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        letterSpacing: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        style: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        transform: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        color: {
+            1: any;
+            5: any;
+            7: any;
+            12: any;
+            2: any;
+            3: any;
+            16: any;
+            4: any;
+            6: any;
+            true: any;
+            10: any;
+            8: any;
+            11: any;
+            9: any;
+            15: any;
+            14: any;
+            13: any;
+        };
+        face: Partial<Partial<{
+            bold: {
+                normal?: string;
+                italic?: string;
+            };
+            normal: {
+                normal?: string;
+                italic?: string;
+            };
+            100: {
+                normal?: string;
+                italic?: string;
+            };
+            500: {
+                normal?: string;
+                italic?: string;
+            };
+            700: {
+                normal?: string;
+                italic?: string;
+            };
+            200: {
+                normal?: string;
+                italic?: string;
+            };
+            300: {
+                normal?: string;
+                italic?: string;
+            };
+            400: {
+                normal?: string;
+                italic?: string;
+            };
+            600: {
+                normal?: string;
+                italic?: string;
+            };
+            800: {
+                normal?: string;
+                italic?: string;
+            };
+            900: {
+                normal?: string;
+                italic?: string;
+            };
+        }> | undefined>;
+    };
+}, {
+    mediaQueryDefaultActive: {
+        touchable: boolean;
+        hoverable: boolean;
+        "max-xxl": boolean;
+        "max-xl": boolean;
+        "max-lg": boolean;
+        "max-md": boolean;
+        "max-sm": boolean;
+        "max-xs": boolean;
+        "max-xxs": boolean;
+        "max-xxxs": boolean;
+        xxxs: boolean;
+        xxs: boolean;
+        xs: boolean;
+        sm: boolean;
+        md: boolean;
+        lg: boolean;
+        xl: boolean;
+        xxl: boolean;
+        "max-height-sm": boolean;
+        "max-height-md": boolean;
+        "max-height-lg": boolean;
+        "height-sm": boolean;
+        "height-md": boolean;
+        "height-lg": boolean;
+    };
+    defaultFont: string;
+    fastSchemeChange: true;
+    shouldAddPrefersColorThemes: true;
+    allowedStyleValues: "somewhat-strict-web";
+    addThemeClassName: "html";
+    onlyAllowShorthands: true;
+    styleCompat: "web";
+}, "default">;
 export type Conf = typeof config;
 //# sourceMappingURL=gui-config.d.ts.map

package/dist/gui-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gui-config.d.ts","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"AA6OA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAmBjB,CAAA;AAEF,eAAe,MAAM,CAAA;AAErB,MAAM,MAAM,IAAI,GAAG,OAAO,MAAM,CAAA"}
+{"version":3,"file":"gui-config.d.ts","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"AAmQA,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAAiC,CAAA;AAEpD,eAAe,MAAM,CAAA;AAerB;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;aAKrB,CAAA;AAEF,MAAM,MAAM,IAAI,GAAG,OAAO,MAAM,CAAA"}

package/dist/gui-config.js

@@ -221,9 +221,10 @@ const themes = Object.fromEntries(Object.entries(defaultConfig.themes).map(([nam
             : ringed,
     ];
 }));
-export const config = createGui({
+// Everything except the theme table, which is the one thing the two configs
+// below disagree about. Stated once so they cannot drift on radius or fonts.
+const base = {
     ...defaultConfig,
-    themes,
     tokens: {
         ...defaultConfig.tokens,
         radius: RADIUS,
@@ -240,6 +241,38 @@ export const config = createGui({
         // token, not a silent no-op, so it is defined.
         mono: { ...defaultConfig.fonts.body, family: GEIST_MONO, size: FONT_SIZE, lineHeight: LINE_HEIGHT },
     },
-});
+};
+export const config = createGui({ ...base, themes });
 export default config;
+/**
+ * The eight chromatic families. Everything else a sub-theme name can carry —
+ * `accent`, `black`, `white`, `gray`, `neutral`, `surface1`, `surface2` — is a
+ * position on the greyscale, so it survives into the monochrome table below.
+ *
+ * Derived from the segment, never from a substring: `dark_teal_Button` is
+ * chromatic because one of its segments IS `teal`, while a future
+ * `dark_tealish` or a component called `Red` is not caught by accident.
+ */
+const CHROMA = new Set(['blue', 'green', 'orange', 'pink', 'purple', 'red', 'teal', 'yellow']);
+const chromatic = (name) => name.split('_').slice(1).some((s) => CHROMA.has(s));
+/**
+ * The same system with the chromatic sub-themes omitted — 150 themes instead of
+ * 390, and 62% less theme table.
+ *
+ * A gui theme table is DATA that ships: it cannot be tree-shaken, because a
+ * theme is selected by string at runtime. So a surface that renders no colour
+ * still pays for every hue. The browser extension's new-tab page is monochrome
+ * by design and loads on every single tab, and 240 themes it can never activate
+ * were the difference between it fitting its bundle budget and not.
+ *
+ * This is NOT a second design system. It is the same `config` with rows
+ * removed, from the same scale, so nothing here can drift from `config` — only
+ * be absent from it. Reach for it when a surface genuinely renders no hue;
+ * anything that does must use `config`, because a missing theme falls back
+ * silently rather than failing.
+ */
+export const monochrome = createGui({
+    ...base,
+    themes: Object.fromEntries(Object.entries(themes).filter(([name]) => !chromatic(name))),
+});
 //# sourceMappingURL=gui-config.js.map

package/dist/gui-config.js.map

@@ -1 +1 @@
-{"version":3,"file":"gui-config.js","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"gui-config.js","sourceRoot":"","sources":["../src/gui-config.ts"],"names":[],"mappings":"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"}

package/dist/styles.css

@@ -231,23 +231,23 @@
    silent (the border simply stops existing) and has shipped before. */
 .light, :root.t_light, .t_light{
   color-scheme:light;
-  --background:#ffffff;
+  --background:#f7f7f7;
   --foreground:#0a0a0a;
   /* A ladder, not four names for #f5f5f5. Light lifts by the same tiny steps
      dark does — ~2% per rung — so --surface-0..3 mean something in both themes. */
-  --card:#fafafa;
+  --card:#f2f2f2;
   --card-foreground:#0a0a0a;
-  --popover:#ffffff;
+  --popover:#fbfbfb;
   --popover-foreground:#0a0a0a;
   --primary:#0a0a0a;
   --primary-hover:#262626;
   --primary-foreground:#fafafa;
-  --secondary:#ededed;
+  --secondary:#e4e4e4;
   --secondary-hover:#e0e0e0;
   --secondary-foreground:#0a0a0a;
-  --muted:#f5f5f5;
+  --muted:#ededed;
   --muted-foreground:#525252;
-  --accent:#ededed;
+  --accent:#e4e4e4;
   --accent-foreground:#0a0a0a;
   --destructive:var(--state-error);
   --destructive-hover:#dc2626;
@@ -272,9 +272,9 @@
   --selection:rgb(0 0 0 / .16);
   --glass:rgb(0 0 0 / .04);
   --glass-strong:rgb(0 0 0 / .07);
-  --surface-card:#fafafa;
-  --surface-card-emphasis:#ffffff;
-  --surface-card-quiet:#fcfcfc;
+  --surface-card:#f2f2f2;
+  --surface-card-emphasis:#fdfdfd;
+  --surface-card-quiet:#f5f5f5;
   --surface-overlay:rgb(255 255 255 / .95);
   --surface-header:rgb(255 255 255 / .8);
   --surface-scrim:rgb(0 0 0 / .5);

package/dist/theme.css

@@ -229,23 +229,23 @@
    silent (the border simply stops existing) and has shipped before. */
 .light, :root.t_light, .t_light{
   color-scheme:light;
-  --background:#ffffff;
+  --background:#f7f7f7;
   --foreground:#0a0a0a;
   /* A ladder, not four names for #f5f5f5. Light lifts by the same tiny steps
      dark does — ~2% per rung — so --surface-0..3 mean something in both themes. */
-  --card:#fafafa;
+  --card:#f2f2f2;
   --card-foreground:#0a0a0a;
-  --popover:#ffffff;
+  --popover:#fbfbfb;
   --popover-foreground:#0a0a0a;
   --primary:#0a0a0a;
   --primary-hover:#262626;
   --primary-foreground:#fafafa;
-  --secondary:#ededed;
+  --secondary:#e4e4e4;
   --secondary-hover:#e0e0e0;
   --secondary-foreground:#0a0a0a;
-  --muted:#f5f5f5;
+  --muted:#ededed;
   --muted-foreground:#525252;
-  --accent:#ededed;
+  --accent:#e4e4e4;
   --accent-foreground:#0a0a0a;
   --destructive:var(--state-error);
   --destructive-hover:#dc2626;
@@ -270,9 +270,9 @@
   --selection:rgb(0 0 0 / .16);
   --glass:rgb(0 0 0 / .04);
   --glass-strong:rgb(0 0 0 / .07);
-  --surface-card:#fafafa;
-  --surface-card-emphasis:#ffffff;
-  --surface-card-quiet:#fcfcfc;
+  --surface-card:#f2f2f2;
+  --surface-card-emphasis:#fdfdfd;
+  --surface-card-quiet:#f5f5f5;
   --surface-overlay:rgb(255 255 255 / .95);
   --surface-header:rgb(255 255 255 / .8);
   --surface-scrim:rgb(0 0 0 / .5);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hanzo/ui",
-  "version": "8.0.62",
+  "version": "8.0.64",
   "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": {