handzon-core 0.15.1 → 0.15.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "handzon-core",
-  "version": "0.15.1",
+  "version": "0.15.3",
   "description": "Core framework for Handzon — layouts, components, content + AI libs, and server runtime (handlers, DB, auth, migration runner) consumed by Handzon scaffolds.",
   "publishConfig": {
     "access": "public"

package/src/components/Sidebar.astro

@@ -172,6 +172,8 @@ const slug = tutorial.id;
     letter-spacing: -0.015em;
     margin: 0.5rem 0 0.25rem;
     line-height: 1.2;
+    min-height: calc(1.15rem * 1.2 * 2);
+    text-wrap: balance;
   }
   .sb-title a { color: var(--color-fg); text-decoration: none; }
   .sb-meta {

package/src/components/auth/UserMenu.astro

@@ -14,29 +14,13 @@ import UserMenuIsland from "./UserMenu.tsx";
 // fallback to the cached signed-in state, removing the nav reload flash.
 const AUTH_SNAPSHOT_KEY = "hz-auth-snapshot";
 const TOKENS_HREF = withBase("/settings/tokens");
-
-const GITHUB_ICON_PATH =
-  "M12 .5C5.65.5.5 5.65 5.65.5 12c0 5.08 3.29 9.39 7.86 10.91.58.11.79-.25.79-.55v-2.02c-3.2.7-3.88-1.36-3.88-1.36-.52-1.33-1.28-1.68-1.28-1.68-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.18 1.76 1.18 1.03 1.76 2.7 1.25 3.36.96.1-.74.4-1.25.72-1.54-2.55-.29-5.24-1.27-5.24-5.66 0-1.25.45-2.27 1.18-3.07-.12-.29-.51-1.45.11-3.03 0 0 .96-.31 3.15 1.17a10.94 10.94 0 0 1 5.76 0c2.19-1.48 3.15-1.17 3.15-1.17.62 1.58.23 2.74.11 3.03.74.8 1.18 1.82 1.18 3.07 0 4.4-2.69 5.37-5.25 5.65.41.35.78 1.04.78 2.11v3.13c0 .3.21.66.79.55C20.71 21.39 24 17.08 24 12 24 5.65 18.85.5 12 .5z";
 ---
 <div class="user-menu-shell">
   <div class="user-menu um-fallback" data-user-menu-fallback aria-hidden="true">
-    {/* Signed-out placeholder. Shown by default; the inline script below
-        hides it when a cached signed-in snapshot exists. */}
-    <span class="um-fallback-variant" data-um-fallback-signedout>
-      <button type="button" class="um-btn" disabled tabindex="-1">
-        <svg
-          class="um-gh"
-          viewBox="0 0 24 24"
-          width="14"
-          height="14"
-          fill="currentColor"
-          aria-hidden="true"
-        >
-          <path d={GITHUB_ICON_PATH} />
-        </svg>
-        <span>Sign in with GitHub</span>
-      </button>
-    </span>
+    {/* Neutral placeholder. The static page cannot read Auth.js' HttpOnly
+        session cookie, so do not show a signed-out GitHub button until
+        the client fetch resolves. */}
+    <span class="um-fallback-variant um-fallback-spacer" data-um-fallback-spacer></span>
     {/* Signed-in placeholder. Hidden until the inline script fills in the
         cached avatar + name and reveals it. Mirrors the island's
         signed-in layout so the swap on hydration is invisible. */}
@@ -97,9 +81,9 @@ const GITHUB_ICON_PATH =
       if (!user) return; // signed out → keep the default placeholder
       var root = document.querySelector("[data-user-menu-fallback]");
       if (!root) return;
-      var signedOut = root.querySelector("[data-um-fallback-signedout]");
+      var spacer = root.querySelector("[data-um-fallback-spacer]");
       var signedIn = root.querySelector("[data-um-fallback-signedin]");
-      if (!signedOut || !signedIn) return;
+      if (!spacer || !signedIn) return;
 
       var label = user.name || user.email || "Signed in";
       var first = String(label).trim().split(/\s+/)[0] || "Signed in";
@@ -118,7 +102,7 @@ const GITHUB_ICON_PATH =
         initial.textContent = label.trim().charAt(0).toUpperCase();
         initial.hidden = false;
       }
-      signedOut.hidden = true;
+      spacer.hidden = true;
       signedIn.hidden = false;
     } catch (e) {
       /* ignore — fall back to the default signed-out placeholder */
@@ -180,6 +164,11 @@ const GITHUB_ICON_PATH =
   .um-fallback-variant[hidden] {
     display: none;
   }
+  .um-fallback-spacer {
+    display: inline-block;
+    width: 11.5rem;
+    height: calc(1em + 0.6rem + 2px);
+  }
   .um-btn {
     display: inline-flex;
     align-items: center;

package/src/components/auth/UserMenu.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { useEffect, useLayoutEffect, useState } from "react";
 import { withBase } from "../../lib/base";
 
 /**
@@ -132,7 +132,7 @@ export default function UserMenu() {
     };
   }, []);
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     // Only retire the static fallback once the island has something to
     // show in its place (a known user or the wired sign-in form) or the
     // fetch has resolved with nothing to show (Tier-1). Until then, keep

package/styles/components/mermaid.css

@@ -6,8 +6,12 @@
   display: grid;
   place-items: center;
   border-radius: 0;
+  min-height: var(--mermaid-min-height, 14rem);
 }
 .mermaid-wrap :global(svg) { max-width: 100%; height: auto; }
+pre.mermaid {
+  min-height: var(--mermaid-min-height, 14rem);
+}
 .mermaid-error {
   padding: 0.75rem;
   background: color-mix(in oklab, var(--color-danger) 14%, var(--color-bg));