@godxjp/ui 13.16.0 → 13.16.2

package/dist/components/layout/app-shell.js

@@ -20,7 +20,7 @@ function AppShell({
   ] });
   return /* @__PURE__ */ jsxs("div", { className: "app-root", "data-collapsed": sidebarCollapsed ? "true" : void 0, children: [
     /* @__PURE__ */ jsx("aside", { className: "app-sidebar", "aria-label": t("layout.appShell.sidebarLabel"), children: sidebar }),
-    /* @__PURE__ */ jsx("header", { className: "app-topbar", "aria-label": t("layout.appShell.headerLabel"), children: resolvedTopbar }),
+    /* @__PURE__ */ jsx("header", { className: "app-topbar ui-scale-fixed", "aria-label": t("layout.appShell.headerLabel"), children: resolvedTopbar }),
     /* @__PURE__ */ jsxs("main", { className: "app-main", "aria-label": t("layout.appShell.mainLabel"), children: [
       breadcrumb !== void 0 && /* @__PURE__ */ jsx("div", { className: "app-breadcrumb", children: breadcrumb }),
       children

package/dist/styles/shell-layout.css

@@ -35,6 +35,9 @@
 
   .app-topbar {
     grid-area: topbar;
+    /* Persistent navigation chrome stays a FIXED size regardless of density — the
+     * AppShell adds `.ui-scale-fixed` to this <header> (resets the whole size-token
+     * set to baseline; --scaling:1 alone is not enough — see foundation.css). */
     display: flex;
     min-width: 0;
     align-items: center;

package/dist/tokens/foundation.css

@@ -93,11 +93,17 @@
     0 20px 25px -5px rgb(var(--shadow-color) / 0.1), 0 8px 10px -6px rgb(var(--shadow-color) / 0.1);
   --shadow-2xl: 0 25px 50px -12px rgb(var(--shadow-color) / 0.25);
 
-  /* Typography scale — M PLUS 2 (JIS L1+L2 kanji, Vietnamese subset), one notch
-   * larger than the JP-dense base for comfortable reading (body 14px). */
+  /* Sans stack — script-aware per the international convention for mixed
+   * Latin/CJK UI: native Latin system fonts FIRST (clean, familiar English &
+   * Vietnamese on every OS), then the bundled "M PLUS 2" + Hiragino / Noto Sans JP
+   * as the CJK fallback. Browsers resolve fonts per-glyph, so Latin renders in the
+   * system sans while 日本語 falls through to M PLUS 2 (still shipped, so JP is
+   * consistent across machines). Listing M PLUS 2 first — its Latin glyphs are
+   * tuned to harmonise with kana, not for standalone English — made English read
+   * oddly; Latin-first fixes that without losing the bundled JP face. */
   --font-family-sans:
-    "M PLUS 2", "Be Vietnam Pro", "Hiragino Sans", "Noto Sans JP", -apple-system,
-    BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
+    system-ui, "M PLUS 2", "Hiragino Sans", "Noto Sans JP", "Be Vietnam Pro", sans-serif;
   --font-family-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
   /* ── Type scale — GOLDEN-RATIO modular scale (Ant/Tailwind model). ONE base + ONE ratio; every
    * step is base × ratioⁿ, so the whole scale stays in golden proportion. `--font-size-ratio` is
@@ -174,6 +180,62 @@
   --phi-p2: calc(var(--phi-p1) * var(--ratio-phi));
 }
 
+/* SCALE-FIXED — pin a subtree to the baseline size (--scaling 1) so persistent
+ * chrome (the AppShell topbar, the global search palette, …) does NOT resize with
+ * the density axis. Setting only --scaling:1 is insufficient: the size tokens were
+ * already substituted at :root and inherit baked, so each --scaling-derived token
+ * (and every semantic token that aliases the spacing grid) is RE-DECLARED here to
+ * re-resolve at baseline. Apply via `className="… ui-scale-fixed"`. Must list every
+ * scaled token — the scale-fixed coverage test guards against drift. */
+.ui-scale-fixed {
+  --scaling: 1;
+  --space-1: 0.25rem;
+  --space-2: 0.5rem;
+  --space-3: 0.75rem;
+  --space-4: 1rem;
+  --space-5: 1.25rem;
+  --space-6: 1.5rem;
+  --space-8: 2rem;
+  --space-10: 2.5rem;
+  --space-12: 3rem;
+  --radius: 0.375rem;
+  --control-height: var(--control-height-default);
+  /* baseline tier values (2rem ∓ step) as literals — keeps the control-sizing
+   * guard happy and avoids re-deriving from the (baked) active --control-height. */
+  --control-height-sm: 1.75rem;
+  --control-height-lg: 2.25rem;
+  --control-height-xs: 1.5rem;
+  --control-icon-size: 1rem;
+  --control-icon-size-sm: 0.875rem;
+  --control-padding-x: var(--space-3);
+  --control-gap: var(--space-2);
+  --control-gap-sm: var(--space-1);
+  --checkbox-size: 1rem;
+  --switch-width: 2.25rem;
+  --switch-height: 1.25rem;
+  --switch-thumb-size: 1rem;
+  --switch-thumb-translate: 1rem;
+  --table-row-height: var(--table-row-height-default);
+  --table-cell-padding-y: var(--space-2);
+  --phi-unit: var(--space-4);
+  --space-page-x: var(--space-6);
+  --space-page-y: var(--space-6);
+  --space-section: var(--space-4);
+  --space-stack-xs: var(--space-1);
+  --space-stack-sm: var(--space-2);
+  --space-stack-md: var(--space-4);
+  --space-stack-lg: var(--space-6);
+  --space-stack-xl: var(--space-10);
+  --space-inline-xs: var(--space-1);
+  --space-inline-sm: var(--space-2);
+  --space-inline-md: var(--space-3);
+  --space-inline-lg: var(--space-4);
+  --space-chrome-x: var(--space-6);
+  --space-chrome-y: var(--space-4);
+  --space-chrome-gap: var(--space-2);
+  --field-label-gap: var(--space-2);
+}
+
 .dark,
 :root[data-theme="dark"] {
   /* Warm-tinted dark spine — keeps the hue-60 character at low lightness.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@godxjp/ui",
-  "version": "13.16.0",
+  "version": "13.16.2",
   "type": "module",
   "packageManager": "pnpm@10.29.1",
   "sideEffects": false,