@celestia-island/hikari 0.55.201 → 0.55.202

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@celestia-island/hikari",
-  "version": "0.55.201",
+  "version": "0.55.202",
   "private": false,
   "type": "module",
   "description": "Hikari UI library, Vue 3 runtime — one design system for Vue 3 and Rust/WASM applications",

package/src/components/HkAdminHeader.test.tsx

@@ -129,6 +129,28 @@ describe("HkAdminHeader", () => {
     expect(withoutTitle.querySelector("header > div")?.textContent).not.toContain("Dashboard");
   });
 
+  it("renders no avatar trigger when no identity is injected", () => {
+    // 2026-10-24 regression: the trigger rendered unconditionally, so a
+    // host with no identity props got a stray "?" button opening an
+    // empty "Signing in…" menu with a lone sign-out row. The identity
+    // cluster is injection-driven now — no identity, no trigger.
+    const anonymous = mount(headerNode({ username: "", title: "Anywhere" }));
+    expect(avatarButton(anonymous)).toBeNull();
+    // The page title still rides the left wing without the avatar.
+    expect(anonymous.querySelector("header > div")?.textContent).toContain("Anywhere");
+
+    // The pending identity flow is EXPLICIT injection: signingInLabel /
+    // onForceSignOut keep the "?" trigger alive so the force-sign-out
+    // escape stays reachable during a wedged session restore.
+    const pending = mount(headerNode({
+      username: "",
+      signingInLabel: "Signing in…",
+      onForceSignOut: () => {},
+    }));
+    const btn = avatarButton(pending) as HTMLButtonElement;
+    expect(btn.querySelector(".s-user-avatar")?.textContent).toBe("?");
+  });
+
   it("toggles the user dropdown with the profile identity header in menu mode", async () => {
     const c = mount(headerNode({
       userEmail: "alice@example.com",

package/src/components/HkAdminHeader.tsx

@@ -87,6 +87,23 @@ export const HkAdminHeader = defineComponent({
     const avatarModalOpen = ref(false);
     const avatarFailed = ref(false);
 
+    // The identity cluster is INJECTED, not assumed (2026-10-24): the
+    // trigger renders only when the host actually supplied an identity
+    // (username / email / avatar) or explicitly opted into the pending
+    // identity flow (signingInLabel / onForceSignOut — the fetchUser
+    // race machinery whose "?" trigger opens the force-sign-out escape).
+    // A host that passes none of those has no account surface, and the
+    // old unconditional render left it a stray "?" button opening an
+    // empty "Signing in…" menu.
+    const identityMounted = computed(
+      () =>
+        !!props.username ||
+        !!props.userEmail ||
+        !!props.avatarUrl ||
+        props.signingInLabel !== undefined ||
+        props.onForceSignOut !== undefined,
+    );
+
     function onAvatarClick(e: MouseEvent) {
       e.stopPropagation();
       if (props.avatarAction === "drawer") {
@@ -192,35 +209,37 @@ export const HkAdminHeader = defineComponent({
               <Menu size={20} class="s-admin-header-hamburger-icon" />
             </HButton>
           )}
-          <button
-            class="s-admin-header-avatar"
-            aria-label={props.avatarTriggerLabel ?? t("hikari::adminHeader.avatarTrigger", "Account menu")}
-            aria-haspopup={props.avatarAction === "drawer" ? "dialog" : "menu"}
-            aria-expanded={props.avatarAction === "menu" ? userMenuOpen.value : undefined}
-            onClick={onAvatarClick}
-          >
-            {/* Deliberately NO hover veil here: the trigger opens the user
-             *  MENU (the avatar edit lives one row down as the Camera
-             *  item), so a camera overlay would promise click-to-change
-             *  and lie (user report 2026-09-16). */}
-            {props.avatarUrl && !avatarFailed.value ? (
-              <img
-                src={props.avatarUrl}
-                alt={props.username}
-                class="s-admin-header-avatar-img"
-                onError={() => { avatarFailed.value = true; }}
-              />
-            ) : (
-              // Letter fallback on the shared avatar primitive — the
-              // same filled-circle grammar as the chat frontend's
-              // trigger. The old border-2 ring made the console's
-              // avatar read as a different control (user report
-              // 2026-09-12: 前后台头像不一致).
-              <span class="s-user-avatar">
-                {props.username?.charAt(0).toUpperCase() || "?"}
-              </span>
-            )}
-          </button>
+          {identityMounted.value && (
+            <button
+              class="s-admin-header-avatar"
+              aria-label={props.avatarTriggerLabel ?? t("hikari::adminHeader.avatarTrigger", "Account menu")}
+              aria-haspopup={props.avatarAction === "drawer" ? "dialog" : "menu"}
+              aria-expanded={props.avatarAction === "menu" ? userMenuOpen.value : undefined}
+              onClick={onAvatarClick}
+            >
+              {/* Deliberately NO hover veil here: the trigger opens the user
+               *  MENU (the avatar edit lives one row down as the Camera
+               *  item), so a camera overlay would promise click-to-change
+               *  and lie (user report 2026-09-16). */}
+              {props.avatarUrl && !avatarFailed.value ? (
+                <img
+                  src={props.avatarUrl}
+                  alt={props.username}
+                  class="s-admin-header-avatar-img"
+                  onError={() => { avatarFailed.value = true; }}
+                />
+              ) : (
+                // Letter fallback on the shared avatar primitive — the
+                // same filled-circle grammar as the chat frontend's
+                // trigger. The old border-2 ring made the console's
+                // avatar read as a different control (user report
+                // 2026-09-12: 前后台头像不一致).
+                <span class="s-user-avatar">
+                  {props.username?.charAt(0).toUpperCase() || "?"}
+                </span>
+              )}
+            </button>
+          )}
           {/* WHERE am I — the open view's title, not the nickname. The
               1.5 line-height (in the class) keeps descenders (g, y, p)
               inside the truncate clip box: the default text-sm box is

package/src/components/HkAdminShell.test.tsx

@@ -538,4 +538,74 @@ describe("HkAdminShell", () => {
     expect(tripleInner?.style.paddingLeft).toBe("2rem");
     expect(tripleInner?.style.paddingRight).toBe("2rem");
   });
+
+  it("reserves the footer band only when a status bar is actually injected", () => {
+    // 2026-10-24 regression: the body carried
+    // paddingBottom: var(--s-footer-height) unconditionally — a dead 3rem
+    // blank under every console that never mounts a status bar. The
+    // reservation is injection-driven now: the shell's own footer slot
+    // brings it, an explicit prop overrides it, nothing else reserves.
+    setWidth(1024);
+
+    // No footer slot, no prop: NO band.
+    const plain = mount(shellNode(
+      { navTitle: "Navigation" },
+      { header: () => null, sidebar: NAV, content: CONTENT },
+    ));
+    const plainBody = plain.querySelector(".s-admin-shell-body") as HTMLElement;
+    expect(plainBody.style.paddingBottom).toBe("0px");
+    expect(plain.querySelector("footer.s-status-bar")).toBeNull();
+
+    // A filled footer slot renders the fixed .s-status-bar and reserves
+    // its band by default.
+    const withBar = mount(shellNode(
+      { navTitle: "Navigation" },
+      {
+        header: () => null,
+        sidebar: NAV,
+        content: CONTENT,
+        footer: () => h("div", { class: "bar-mock" }, "STATUS"),
+      },
+    ));
+    const barBody = withBar.querySelector(".s-admin-shell-body") as HTMLElement;
+    // A fallback-less var() survives as the direct longhand here — the
+    // shorthand round-trip failures happy-dom shows elsewhere in this
+    // file do not apply to a single-track longhand read.
+    expect(barBody.style.paddingBottom).toBe("var(--s-footer-height)");
+    expect(withBar.querySelector("footer.s-status-bar .bar-mock")).toBeTruthy();
+
+    // An explicit prop overrides BOTH branches: the opt-in for hosts that
+    // pin their own fixed bar outside the shell…
+    const external = mount(shellNode(
+      { navTitle: "Navigation", footerHeight: "3.5rem" },
+      { header: () => null, sidebar: NAV, content: CONTENT },
+    ));
+    expect((external.querySelector(".s-admin-shell-body") as HTMLElement).style.paddingBottom)
+      .toBe("3.5rem");
+    // …and a custom band for hosts that fill the slot anyway. "0px"
+    // explicitly re-kills it.
+    const explicitZero = mount(shellNode(
+      { navTitle: "Navigation", footerHeight: "0px" },
+      {
+        header: () => null,
+        sidebar: NAV,
+        content: CONTENT,
+        footer: () => h("div", { class: "bar-mock" }, "STATUS"),
+      },
+    ));
+    expect((explicitZero.querySelector(".s-admin-shell-body") as HTMLElement).style.paddingBottom)
+      .toBe("0px");
+
+    // The empty string is an EXPLICIT value, not an absent one: `!==`
+    // undefined (not truthiness) is the gate, so "" passes through
+    // verbatim exactly as the old code passed it — same contract the
+    // contentPadding longhand pins below. A truthiness mutant would
+    // reroute "" into the slot branch; this mount catches it.
+    const explicitEmpty = mount(shellNode(
+      { navTitle: "Navigation", footerHeight: "" },
+      { header: () => null, sidebar: NAV, content: CONTENT },
+    ));
+    expect((explicitEmpty.querySelector(".s-admin-shell-body") as HTMLElement).style.paddingBottom)
+      .toBe("");
+  });
 });

package/src/components/HkAdminShell.tsx

@@ -140,7 +140,17 @@ export const HkAdminShell = defineComponent({
      *  1024px "lg" breakpoint; lower it (e.g. 768) for tablet-friendly
      *  admins that keep the sidebar at md widths. */
     mobileBreakpoint: { type: Number, default: 1024 },
-    footerHeight: { type: String, default: "var(--s-footer-height)" },
+    /** Height reserved under the scroll body for a fixed status-bar
+     *  band. INJECTION-DRIVEN (2026-10-24): the reservation tracks
+     *  whether the shell actually renders a status bar — a filled
+     *  `footer` slot (the shell's own fixed `.s-status-bar`) reserves
+     *  `var(--s-footer-height)` by default, and with NO footer slot
+     *  nothing is reserved (`0px`). The old unconditional default
+     *  reserved the band on every host, leaving a dead 3rem blank under
+     *  consoles that never mount a status bar. Hosts that pin their OWN
+     *  fixed bar outside the shell opt back in by passing an explicit
+     *  value (e.g. `"var(--s-footer-height)"`). */
+    footerHeight: { type: String, default: undefined },
     navTitle: { type: String, default: undefined },
     /** Extra class for the mobile nav drawer's panel — lets consumers zero
      *  nested paddings so drawer nav rows and a `userPanel` footer share
@@ -186,6 +196,19 @@ export const HkAdminShell = defineComponent({
 
     const actionBar = provideActionBar();
 
+    // The status-bar band exists only when the shell renders one (the
+    // footer slot) or the host pins its own bar and says so via the prop
+    // — an unreserved shell carries no dead clearance (2026-10-24: the
+    // unconditional default used to blank 3rem under every console that
+    // never mounted a status bar). Computed INSIDE the render (not a
+    // `computed()`): slot PRESENCE is what it reads, and a cached
+    // computed is not reliably invalidated by a slot appearing or
+    // disappearing, while every re-render re-evaluates this line.
+    function footerPad(): string {
+      if (props.footerHeight !== undefined) return props.footerHeight;
+      return slots.footer ? "var(--s-footer-height)" : "0px";
+    }
+
     const toggleHamburger = () => {
       sidebarOpen.value = !sidebarOpen.value;
     };
@@ -215,7 +238,7 @@ export const HkAdminShell = defineComponent({
           </div>
         )}
 
-        <div class="s-admin-shell-body" style={{ paddingBottom: props.footerHeight }}>
+        <div class="s-admin-shell-body" style={{ paddingBottom: footerPad() }}>
           {isDesktop.value && !props.sidebarCollapsed && slots.sidebar && (
             <aside
               style={{

package/src/styles/admin-tokens.scss

@@ -1228,8 +1228,13 @@
   font-variant-numeric: tabular-nums;
 }
 
+// Full-viewport by default: the page does NOT assume a fixed status bar
+// is mounted under it (2026-10-24 — the old calc() subtracted
+// --s-footer-height unconditionally, stopping the background 3rem short
+// of the bottom on pages with no status bar). Hosts that DO pair the
+// auth page with a status bar subtract it themselves.
 .a-auth-page {
-  min-height: calc(100vh - var(--s-footer-height, 3rem));
+  min-height: 100vh;
 }
 
 // ── adjacent-button spacing (the button-row grammar) ──────────────────────