create-zudo-doc 0.2.10 → 0.2.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/scaffold.js +10 -7
  2. package/package.json +1 -1
  3. package/templates/base/src/components/sidebar-toggle.tsx +6 -4
  4. package/templates/base/src/styles/global.css +17 -9
  5. package/templates/features/sidebarToggle/files/src/components/desktop-sidebar-toggle.tsx +6 -33
package/dist/scaffold.js CHANGED
@@ -333,12 +333,16 @@ function generatePackageJson(choices) {
333
333
  // "@takazudo/zfb" (#972) — plus removal of the no-op linkValidation.allowExternal
334
334
  // knob (#925); both are non-breaking for a fresh scaffold. A fresh scaffold
335
335
  // sets no explicit codeHighlight.theme so the default still applies. No
336
- // consumer-facing / CLI breaking change.
337
- "@takazudo/zfb": "0.1.0-next.51",
338
- "@takazudo/zfb-runtime": "0.1.0-next.51",
336
+ // consumer-facing / CLI breaking change. next.52 (current pin): adds the
337
+ // `ClientRouter({ preserveHtmlAttrs })` option (zfb#1104) — consumers can
338
+ // declare runtime `<html>` attribute names to preserve across SPA swaps so
339
+ // e.g. `data-sidebar-hidden` / `data-theme` survive (zudolab/zudo-doc#2200).
340
+ // Additive, non-breaking for a fresh scaffold.
341
+ "@takazudo/zfb": "0.1.0-next.52",
342
+ "@takazudo/zfb-runtime": "0.1.0-next.52",
339
343
  // zfb-adapter-cloudflare — required for any route with `prerender = false`.
340
344
  // Pinned in lockstep with @takazudo/zfb.
341
- "@takazudo/zfb-adapter-cloudflare": "0.1.0-next.51",
345
+ "@takazudo/zfb-adapter-cloudflare": "0.1.0-next.52",
342
346
  // @takazudo/zudo-doc — published from this monorepo via
343
347
  // .github/workflows/publish-zudo-doc.yml. The pin here is bumped in
344
348
  // lockstep by scripts/release-create-zudo-doc.sh whenever zudo-doc's
@@ -350,7 +354,7 @@ function generatePackageJson(choices) {
350
354
  // ties this pin to packages/zudo-doc's version, so the lockstep release
351
355
  // bumps both together; do not cut a create-zudo-doc release until the
352
356
  // matching @takazudo/zudo-doc version (with content.css) is on npm.
353
- "@takazudo/zudo-doc": "^0.2.10",
357
+ "@takazudo/zudo-doc": "^0.2.12",
354
358
  // zod — used by the generated zfb.config.ts. zfb-config-gen emits
355
359
  // `import { z } from "zod"` for the content-collection schema +
356
360
  // `z.toJSONSchema(...)` conversion. Without this dep, the consumer
@@ -373,7 +377,6 @@ function generatePackageJson(choices) {
373
377
  "preact-render-to-string": "^6.6.6",
374
378
  shiki: "^4.0.2",
375
379
  "@shikijs/transformers": "^4.0.0",
376
- clsx: "^2.1.0",
377
380
  "gray-matter": "^4.0.0",
378
381
  mermaid: "^11.12.3",
379
382
  "remark-cjk-friendly": "^2.0.1",
@@ -405,7 +408,7 @@ function generatePackageJson(choices) {
405
408
  // @takazudo/zudo-doc/integrations/doc-history which in turn imports
406
409
  // @takazudo/zudo-doc-history-server/git-history. Without this dep the
407
410
  // plugin host fails at init with ERR_MODULE_NOT_FOUND — W8A (#1739).
408
- deps["@takazudo/zudo-doc-history-server"] = "^0.2.10";
411
+ deps["@takazudo/zudo-doc-history-server"] = "^0.2.12";
409
412
  // W7A (#1736): doc-history-plugin.mjs spawns `tsx -e <inline-script>` to
410
413
  // run the v2 runtime in a TS-aware Node subprocess; without tsx the
411
414
  // plugin's preBuild step exits with ENOENT before zfb finishes config
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "create-zudo-doc",
3
- "version": "0.2.10",
3
+ "version": "0.2.12",
4
4
  "description": "Create a new zudo-doc documentation site",
5
5
  "license": "MIT",
6
6
  "author": "Takeshi Takatsudo",
package/templates/base/src/components/sidebar-toggle.tsx CHANGED
@@ -6,7 +6,6 @@
6
6
  // packages/zudo-doc/src/theme-toggle/index.tsx. Type references via
7
7
  // the global React namespace still resolve via @types/react.
8
8
  import { useState, useEffect } from "preact/hooks";
9
- import clsx from "clsx";
10
9
  // After zudolab/zudo-doc#1335 (E2 task 2 half B) the host components
11
10
  // pull lifecycle event names from the v2 transitions module rather
12
11
  // than hard-coding `astro:*` literals.
@@ -18,6 +17,9 @@ import type { LocaleLink } from "@/types/locale";
18
17
  // pulled in by `./sidebar`'s runtime barrel.
19
18
  import type { SidebarRootMenuItem } from "@takazudo/zudo-doc/sidebar/types";
20
19
 
20
+ const cx = (...classes: Array<string | false | null | undefined>) =>
21
+ classes.filter(Boolean).join(" ");
22
+
21
23
  // Mobile drawer hosts the SidebarTree directly (rather than receiving it as
22
24
  // JSX children) so the tree's data props ride across the SSR → hydrate
23
25
  // boundary inside the Island marker's `data-props` attribute. zfb's
@@ -90,7 +92,7 @@ export default function SidebarToggle({
90
92
  {/* X icon — visible only when open */}
91
93
  <svg
92
94
  xmlns="http://www.w3.org/2000/svg"
93
- className={clsx("h-icon-lg w-icon-lg", !open && "hidden")}
95
+ className={cx("h-icon-lg w-icon-lg", !open && "hidden")}
94
96
  aria-hidden="true"
95
97
  fill="none"
96
98
  viewBox="0 0 24 24"
@@ -106,7 +108,7 @@ export default function SidebarToggle({
106
108
  {/* Hamburger icon — visible only when closed */}
107
109
  <svg
108
110
  xmlns="http://www.w3.org/2000/svg"
109
- className={clsx("h-icon-lg w-icon-lg", open && "hidden")}
111
+ className={cx("h-icon-lg w-icon-lg", open && "hidden")}
110
112
  aria-hidden="true"
111
113
  fill="none"
112
114
  viewBox="0 0 24 24"
@@ -131,7 +133,7 @@ export default function SidebarToggle({
131
133
  backdrop (onClick below), so the header hamburger being dimmed under
132
134
  it is fine. */}
133
135
  <div
134
- className={clsx("fixed inset-0 z-modal-backdrop bg-overlay/30 lg:hidden", !open && "hidden")}
136
+ className={cx("fixed inset-0 z-modal-backdrop bg-overlay/30 lg:hidden", !open && "hidden")}
135
137
  aria-hidden={!open}
136
138
  onClick={() => setOpen(false)}
137
139
  />
package/templates/base/src/styles/global.css CHANGED
@@ -717,6 +717,11 @@ pre[class^="syntect-"] .line .highlighted-word {
717
717
  }
718
718
  }
719
719
 
720
+ /* The SPA-swap flash guard (`data-sidebar-no-transition`) was removed once
721
+ * doc-layout adopted <ClientRouter preserveHtmlAttrs={["data-sidebar-hidden",
722
+ * ...]} /> (zfb-runtime >= 0.1.0-next.52): the attribute now survives the swap
723
+ * before paint, so no sidebar geometry transition fires mid-swap. */
724
+
720
725
  /* ── Find-in-page highlight (W7A: unconditional — Tauri feature gates at runtime) ── */
721
726
  .find-match {
722
727
  background-color: color-mix(in oklch, var(--color-warning) 40%, transparent);
@@ -906,6 +911,10 @@ dialog.zd-mermaid-dialog::backdrop {
906
911
 
907
912
  .zd-mermaid-viewport[data-pan-active] {
908
913
  cursor: grab;
914
+ /* In pan mode a drag should pan, not select diagram text. Scoped to
915
+ * [data-pan-active] so text stays selectable when pan mode is off. */
916
+ -webkit-user-select: none;
917
+ user-select: none;
909
918
  }
910
919
 
911
920
  .zd-mermaid-viewport[data-pan-active]:active {
@@ -946,15 +955,14 @@ dialog.zd-mermaid-dialog::backdrop {
946
955
  overflow: visible;
947
956
  }
948
957
 
949
- /* Toolbar — bottom-center pill of zoom/pan controls. */
958
+ /* Toolbar — bottom-right pill of zoom/pan controls (2× sized buttons). */
950
959
  .zd-mermaid-toolbar {
951
960
  position: absolute;
952
961
  bottom: var(--spacing-image-overlay-inset);
953
- left: 50%;
954
- transform: translateX(-50%);
962
+ right: var(--spacing-image-overlay-inset);
955
963
  display: flex;
956
- gap: var(--spacing-hsp-2xs);
957
- padding: var(--spacing-hsp-2xs);
964
+ gap: var(--spacing-hsp-xs);
965
+ padding: var(--spacing-hsp-xs);
958
966
  border: 1px solid var(--color-muted);
959
967
  border-radius: var(--radius-DEFAULT);
960
968
  background: color-mix(in oklch, var(--color-surface) 92%, transparent);
@@ -965,8 +973,8 @@ dialog.zd-mermaid-dialog::backdrop {
965
973
  display: flex;
966
974
  align-items: center;
967
975
  justify-content: center;
968
- width: var(--spacing-icon-lg);
969
- height: var(--spacing-icon-lg);
976
+ width: calc(var(--spacing-icon-lg) * 2);
977
+ height: calc(var(--spacing-icon-lg) * 2);
970
978
  padding: var(--spacing-vsp-2xs);
971
979
  border: none;
972
980
  border-radius: var(--radius-DEFAULT);
@@ -993,8 +1001,8 @@ dialog.zd-mermaid-dialog::backdrop {
993
1001
  }
994
1002
 
995
1003
  .zd-mermaid-tool-btn > svg {
996
- width: var(--spacing-icon-md);
997
- height: var(--spacing-icon-md);
1004
+ width: calc(var(--spacing-icon-md) * 2);
1005
+ height: calc(var(--spacing-icon-md) * 2);
998
1006
  }
999
1007
 
1000
1008
  /* @slot:global-css:feature-styles */
package/templates/features/sidebarToggle/files/src/components/desktop-sidebar-toggle.tsx CHANGED
@@ -1,7 +1,6 @@
1
1
  "use client";
2
2
 
3
3
  import { useState, useEffect, useRef } from 'preact/hooks';
4
- import { BEFORE_NAVIGATE_EVENT, AFTER_NAVIGATE_EVENT } from '@takazudo/zudo-doc/transitions';
5
4
 
6
5
  export const SIDEBAR_STORAGE_KEY = 'zudo-doc-sidebar-visible';
7
6
 
@@ -28,8 +27,7 @@ export default function DesktopSidebarToggle() {
28
27
  // doc-layout's pre-paint inline script applies `data-sidebar-hidden`
29
28
  // to <html> from localStorage *before* this island mounts, so the
30
29
  // visual state stays correct; we only need to sync this island's
31
- // React state to the persisted preference after hydration. Same
32
- // pattern as packages/zudo-doc/src/theme-toggle/index.tsx (commit 9aebd8e).
30
+ // React state to the persisted preference after hydration.
33
31
  const [visible, setVisible] = useState<boolean>(true);
34
32
  // Tracks whether the hydration sync (below) has run. The persistence
35
33
  // effect below skips the very first mount so we don't overwrite the
@@ -66,36 +64,11 @@ export default function DesktopSidebarToggle() {
66
64
  // eslint-disable-next-line react-hooks/exhaustive-deps
67
65
  }, []);
68
66
 
69
- // Re-apply data-sidebar-hidden to <html> after every SPA nav.
70
- // zfb's swapRootAttributes wipes all non-preserved <html> attributes on
71
- // each navigation (data-sidebar-hidden is not in NON_OVERRIDABLE_ZFB_ATTRS),
72
- // and the pre-paint inline script does not re-run on SPA nav. Since this
73
- // island is persisted (data-zfb-transition-persist), this listener stays
74
- // registered across SPA swaps.
75
- //
76
- // Strategy: capture the attribute presence just before the swap
77
- // (BEFORE_NAVIGATE_EVENT fires before swapRootAttributes runs), then
78
- // restore it once the swap completes (AFTER_NAVIGATE_EVENT). This is
79
- // authoritative regardless of how the attribute was set (toggle click,
80
- // localStorage, or external mutation). (#1551, #1552 B10)
81
- useEffect(() => {
82
- let wasHidden = false;
83
- const capture = () => {
84
- wasHidden = document.documentElement.hasAttribute('data-sidebar-hidden');
85
- };
86
- const restore = () => {
87
- if (wasHidden) {
88
- document.documentElement.setAttribute('data-sidebar-hidden', '');
89
- }
90
- // If not hidden, swapRootAttributes already cleared it — nothing to do.
91
- };
92
- document.addEventListener(BEFORE_NAVIGATE_EVENT, capture);
93
- document.addEventListener(AFTER_NAVIGATE_EVENT, restore);
94
- return () => {
95
- document.removeEventListener(BEFORE_NAVIGATE_EVENT, capture);
96
- document.removeEventListener(AFTER_NAVIGATE_EVENT, restore);
97
- };
98
- }, []);
67
+ // The SPA-navigation flash (a collapsed sidebar briefly painting open on
68
+ // every soft swap) is handled upstream: doc-layout mounts
69
+ // <ClientRouter preserveHtmlAttrs={["data-sidebar-hidden", ...]} /> so
70
+ // zfb-runtime (>= 0.1.0-next.52) re-applies the runtime attribute across the
71
+ // swap before paint. No host-side capture/restore guard is needed.
99
72
 
100
73
  return (
101
74
  <button