@takazudo/zudo-doc 5.26.2 → 5.26.3

package/CHANGELOG.md

@@ -8,6 +8,16 @@ The format is based on Keep a Changelog, and release notes are generated from th
 
 No unreleased changes.
 
+## [5.26.3] - 2026-09-21
+
+### Bug Fixes
+
+- The mobile sidebar toggle no longer renders both of its icons at once in a project whose global CSS contains an unlayered media reset such as `img, svg, video, canvas, audio, iframe, embed, object { display: block }`. The inactive icon used to be hidden with Tailwind's `.hidden` utility, which ships inside `@layer utilities` — an unlayered author rule outranks every layered rule by cascade-layer precedence regardless of source order, so both icons computed to `display: block`, stacked vertically, and made the toggle a 48px control showing the X and the hamburger together. The inactive icon is now hidden with an inline declaration, which no consumer stylesheet can outrank. (30d6625e8)
+
+### Other Changes
+
+- The `@takazudo/zfb`, `@takazudo/zfb-runtime`, and `@takazudo/zfb-md-wasm` peer dependency floors are now `^2.20.1`. The 2.20.1 release is lockstep metadata only — no upstream package reports a package-specific change, and the published-tarball delta is limited to each package's own version field plus its platform-binary pins. No zudo-doc config migration is required. (07d700356)
+
 ## [5.26.2] - 2026-09-20
 
 ### Bug Fixes

package/dist/sidebar-toggle-island/index.js

@@ -5,6 +5,7 @@ import { AFTER_NAVIGATE_EVENT, ensureNestedIslandPropsRefresh } from "../transit
 import { SidebarTree } from "../sidebar-tree-island/index.js";
 ensureNestedIslandPropsRefresh();
 const cx = (...classes) => classes.filter(Boolean).join(" ");
+const HIDDEN_ICON_STYLE = "display:none";
 function SidebarToggle({
   nodes,
   currentSlug,
@@ -47,7 +48,8 @@ function SidebarToggle({
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
-              className: cx("h-icon-lg w-icon-lg", !open && "hidden"),
+              className: "h-icon-lg w-icon-lg",
+              style: open ? void 0 : HIDDEN_ICON_STYLE,
               "aria-hidden": "true",
               fill: "none",
               viewBox: "0 0 24 24",
@@ -67,7 +69,8 @@ function SidebarToggle({
             "svg",
             {
               xmlns: "http://www.w3.org/2000/svg",
-              className: cx("h-icon-lg w-icon-lg", open && "hidden"),
+              className: "h-icon-lg w-icon-lg",
+              style: open ? HIDDEN_ICON_STYLE : void 0,
               "aria-hidden": "true",
               fill: "none",
               viewBox: "0 0 24 24",

package/eject/sidebar-toggle-island/index.tsx

@@ -27,6 +27,17 @@ ensureNestedIslandPropsRefresh();
 const cx = (...classes: Array<string | false | null | undefined>) =>
   classes.filter(Boolean).join(" ");
 
+// Icon visibility deliberately does NOT ride on Tailwind's `.hidden` utility.
+// `.hidden` is emitted inside `@layer utilities`, and a consumer component pack
+// that ships an UNLAYERED media reset — `img, svg, video, … { display: block }`
+// — outranks every layered rule by cascade-layer precedence, no matter the
+// source order. Both icons then computed to `display: block`, stacked, and made
+// the mobile toggle 48px tall (zudolab/zudo-doc#4355). An inline declaration
+// sits above all author rules, layered or not, so the state holds against any
+// consumer stylesheet. It is a plain string so SSR and the initial client
+// render serialise byte-identically for hydration.
+const HIDDEN_ICON_STYLE = "display:none";
+
 // Mobile drawer hosts the SidebarTree directly (rather than receiving it as
 // JSX children) so the tree's data props ride across the SSR → hydrate
 // boundary inside the Island marker's `data-props` attribute. zfb's
@@ -101,10 +112,10 @@ export function SidebarToggle({
     <>
       {/* Hamburger button - visible only on mobile.
           Both icons are always rendered so the SSR output has the same
-          DOM shape as the post-hydration tree. The closed-state icon is
-          hidden via `hidden` when open=true, and vice versa, so Preact's
-          hydration walk sees byte-stable markup and keeps the click
-          handler attached. */}
+          DOM shape as the post-hydration tree. The inactive one is hidden
+          via an inline `display:none` (see HIDDEN_ICON_STYLE above), so
+          Preact's hydration walk sees byte-stable markup and keeps the
+          click handler attached. */}
       <button
         type="button"
         onClick={() => setOpen(!open)}
@@ -115,7 +126,8 @@ export function SidebarToggle({
         {/* X icon — visible only when open */}
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className={cx("h-icon-lg w-icon-lg", !open && "hidden")}
+          className="h-icon-lg w-icon-lg"
+          style={open ? undefined : HIDDEN_ICON_STYLE}
           aria-hidden="true"
           fill="none"
           viewBox="0 0 24 24"
@@ -131,7 +143,8 @@ export function SidebarToggle({
         {/* Hamburger icon — visible only when closed */}
         <svg
           xmlns="http://www.w3.org/2000/svg"
-          className={cx("h-icon-lg w-icon-lg", open && "hidden")}
+          className="h-icon-lg w-icon-lg"
+          style={open ? HIDDEN_ICON_STYLE : undefined}
           aria-hidden="true"
           fill="none"
           viewBox="0 0 24 24"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takazudo/zudo-doc",
-  "version": "5.26.2",
+  "version": "5.26.3",
   "type": "module",
   "description": "zudo-doc framework primitives layer that sits on top of zfb's engine — sidebar, theme, TOC, breadcrumb, layouts, head injection, View Transitions, SSR-skip wrappers (per ADR-003).",
   "license": "MIT",
@@ -717,9 +717,9 @@
   ],
   "peerDependencies": {
     "@takazudo/zdtp": "^0.5.2 || ^0.6.0 || ^0.7.0 || ^0.8.0",
-    "@takazudo/zfb": "^2.20.0",
-    "@takazudo/zfb-md-wasm": "^2.20.0",
-    "@takazudo/zfb-runtime": "^2.20.0",
+    "@takazudo/zfb": "^2.20.1",
+    "@takazudo/zfb-md-wasm": "^2.20.1",
+    "@takazudo/zfb-runtime": "^2.20.1",
     "@takazudo/zudo-doc-history-server": "^5.17.2",
     "diff": "^8.0.0",
     "katex": "^0.16.0",
@@ -757,9 +757,9 @@
   },
   "devDependencies": {
     "@takazudo/mdx-formatter": "1.3.0-next.4",
-    "@takazudo/zfb": "2.20.0",
-    "@takazudo/zfb-md-wasm": "2.20.0",
-    "@takazudo/zfb-runtime": "2.20.0",
+    "@takazudo/zfb": "2.20.1",
+    "@takazudo/zfb-md-wasm": "2.20.1",
+    "@takazudo/zfb-runtime": "2.20.1",
     "@types/fs-extra": "^11.0.4",
     "@types/minimist": "^1.2.5",
     "@types/node": "^25.3.5",
@@ -771,7 +771,7 @@
     "typescript": "^5.0.0",
     "vitest": "^4.1.0",
     "zod": "^4.3.6",
-    "@takazudo/zudo-doc-history-server": "5.26.2"
+    "@takazudo/zudo-doc-history-server": "5.26.3"
   },
   "scripts": {
     "gen:search-widget-script": "node scripts/gen-search-widget-script.mjs",