forgecad 0.6.3 → 0.8.0

package/dist/assets/{DocsPage-CKRV2iq2.js → DocsPage-D3A_g8V3.js}

@@ -2,8 +2,9 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 var _a;
-import { u as useParams, e as useNavigate, r as reactExports, j as jsxRuntimeExports, L as Link } from "./vendor-react-Dt7-aaJH.js";
-import { H as HighlightJS, j as javascript$1 } from "./javascript-DCxGoE5Y.js";
+import { u as useParams, h as useNavigate, r as reactExports, j as jsxRuntimeExports, L as Link } from "./vendor-react-CG3i_wp0.js";
+import { H as HighlightJS, j as javascript$1 } from "./javascript-DAl8Gmyo.js";
+import { a as applyTheme } from "./index-Pz321YAt.js";
 function M() {
   return { async: false, breaks: false, extensions: null, gfm: true, hooks: null, pedantic: false, renderer: null, silent: false, tokenizer: null, walkTokens: null };
 }
@@ -3721,7 +3722,7 @@ function slugify(text) {
   return text.toLowerCase().replace(/`/g, "").replace(/<[^>]*>/g, "").replace(/[^\w\s-]/g, "").replace(/\s+/g, "-").replace(/-+/g, "-").trim();
 }
 const renderer = new g.Renderer();
-renderer.code = function({ text, lang }) {
+renderer.code = ({ text, lang }) => {
   let highlighted;
   if (lang && HighlightJS.getLanguage(lang)) {
     highlighted = HighlightJS.highlight(text, { language: lang }).value;
@@ -3730,38 +3731,42 @@ renderer.code = function({ text, lang }) {
   }
   return `<pre class="fc-docs-code"><code class="hljs language-${lang || ""}">${highlighted}</code></pre>`;
 };
-renderer.heading = function({ text, depth }) {
+renderer.heading = ({ text, depth }) => {
   const id = slugify(text);
-  return `<h${depth} id="${id}">${text}<a class="fc-docs-anchor" href="#${id}" aria-label="Link to this section">#</a></h${depth}>
+  const html = g.parseInline(text, { async: false });
+  return `<h${depth} id="${id}">${html}<a class="fc-docs-anchor" href="#${id}" aria-label="Link to this section">#</a></h${depth}>
 `;
 };
-renderer.table = function({ header, rows }) {
+renderer.table = ({
+  header,
+  rows
+}) => {
+  const inline = (t) => g.parseInline(t, { async: false });
   let html = '<table class="fc-docs-table"><thead><tr>';
   for (const cell of header) {
     const align = cell.align ? ` style="text-align:${cell.align}"` : "";
-    html += `<th${align}>${cell.text}</th>`;
+    html += `<th${align}>${inline(cell.text)}</th>`;
   }
   html += "</tr></thead><tbody>";
   for (const row of rows) {
     html += "<tr>";
     for (const cell of row) {
       const align = cell.align ? ` style="text-align:${cell.align}"` : "";
-      html += `<td${align}>${cell.text}</td>`;
+      html += `<td${align}>${inline(cell.text)}</td>`;
     }
     html += "</tr>";
   }
   html += "</tbody></table>";
   return html;
 };
-renderer.codespan = function({ text }) {
-  return `<code class="fc-docs-inline-code">${text}</code>`;
-};
-renderer.blockquote = function({ text }) {
-  return `<blockquote class="fc-docs-blockquote">${text}</blockquote>`;
-};
+renderer.codespan = ({ text }) => `<code class="fc-docs-inline-code">${text}</code>`;
+renderer.blockquote = ({ text }) => `<blockquote class="fc-docs-blockquote">${text}</blockquote>`;
 g.use({ renderer, gfm: true, breaks: false });
+function stripFrontmatter(md) {
+  return md.replace(/^---\n[\s\S]*?\n---\n/, "");
+}
 function renderToHtml(md) {
-  return g.parse(md, { async: false });
+  return g.parse(stripFrontmatter(md), { async: false });
 }
 const DOC_SECTIONS = [
   { slug: "core", title: "Core", description: "Primitives, booleans, transforms, patterns" },
@@ -3772,11 +3777,10 @@ const DOC_SECTIONS = [
   { slug: "lib", title: "Library", description: "Gears, fasteners, pipes" },
   { slug: "sheet-metal", title: "Sheet Metal", description: "Bends, flat patterns" },
   { slug: "viewport", title: "Viewport", description: "Camera, animation, scenes" },
+  { slug: "sdf", title: "SDF (Experimental)", description: "Organic forms, smooth booleans, TPMS" },
   { slug: "concepts", title: "Concepts", description: "Semantic data structures" }
 ];
-const CLI_SECTIONS = [
-  { slug: "cli", title: "CLI Reference", description: "Command-line tools and options" }
-];
+const CLI_SECTIONS = [{ slug: "cli", title: "CLI", description: "Install, run, export, publish — from your terminal" }];
 const ALL_SECTIONS = [...DOC_SECTIONS, ...CLI_SECTIONS];
 function buildSearchEntries(slug, sectionTitle, md) {
   const entries = [];
@@ -3810,17 +3814,58 @@ function buildSearchEntries(slug, sectionTitle, md) {
     const sigMatch = line.match(/^(\w+)\(.*\):/);
     if (sigMatch && !sig) sig = line.trim();
     if (!line.startsWith("```") && line.trim()) {
-      buffer.push(line.replace(/[#*`\[\]]/g, "").trim());
+      buffer.push(line.replace(/[#*`[\]]/g, "").trim());
     }
   }
   flush();
   return entries;
 }
-function SiteNav({ onSearchOpen }) {
+function SidebarToggle({ side, open, onClick }) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "button",
+    {
+      className: `fc-docs-sidebar-toggle ${side}`,
+      onClick,
+      type: "button",
+      title: `${open ? "Hide" : "Show"} ${side === "left" ? "navigation" : "page outline"}`,
+      children: side === "left" ? /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M9 3v18" })
+      ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M15 3v18" })
+      ] })
+    }
+  );
+}
+function ThemeToggle() {
+  const [dark, setDark] = reactExports.useState(() => (localStorage.getItem("fc-theme") || "dark") !== "light");
+  const toggle = reactExports.useCallback(() => {
+    const next = dark ? "light" : "dark";
+    applyTheme(next);
+    localStorage.setItem("fc-theme", next);
+    setDark(!dark);
+  }, [dark]);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("button", { className: "fc-docs-theme-toggle", onClick: toggle, type: "button", title: dark ? "Switch to light mode" : "Switch to dark mode", children: dark ? /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "12", cy: "12", r: "5" }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42" })
+  ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" }) }) });
+}
+function SiteNav({
+  onSearchOpen,
+  showSidebar,
+  showToc,
+  onToggleSidebar,
+  onToggleToc,
+  hasToc
+}) {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("nav", { className: "fc-docs-nav", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs(Link, { to: "/", className: "fc-docs-nav-logo", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 20 }, children: "⚒" }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "ForgeCAD" })
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-nav-left", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(SidebarToggle, { side: "left", open: showSidebar, onClick: onToggleSidebar }),
+      /* @__PURE__ */ jsxRuntimeExports.jsxs(Link, { to: "/", className: "fc-docs-nav-logo", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { style: { fontSize: 20 }, children: "⚒" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { children: "ForgeCAD" })
+      ] })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-nav-links", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("button", { onClick: onSearchOpen, className: "fc-docs-search-trigger", type: "button", children: [
@@ -3833,46 +3878,55 @@ function SiteNav({ onSearchOpen }) {
       ] }),
       /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/docs", className: "fc-docs-nav-active", children: "Docs" }),
       false,
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/", className: "fc-docs-nav-cta", children: "Back to Editor" })
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Link, { to: "/", className: "fc-docs-nav-cta", children: "Back to Editor" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(ThemeToggle, {}),
+      hasToc && /* @__PURE__ */ jsxRuntimeExports.jsx(SidebarToggle, { side: "right", open: showToc, onClick: onToggleToc })
     ] })
   ] });
 }
-function Sidebar({ activeSlug }) {
+function Sidebar({ activeSlug, open, onClose }) {
   const activeRef = reactExports.useRef(null);
   reactExports.useEffect(() => {
     var _a2;
     (_a2 = activeRef.current) == null ? void 0 : _a2.scrollIntoView({ block: "nearest" });
   }, [activeSlug]);
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("aside", { className: "fc-docs-sidebar", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-sidebar-group-title", children: "API Reference" }),
-    DOC_SECTIONS.map((s) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Link,
-      {
-        ref: activeSlug === s.slug ? activeRef : void 0,
-        to: `/docs/${s.slug}`,
-        className: `fc-docs-sidebar-link${activeSlug === s.slug ? " active" : ""}`,
-        children: s.title
-      },
-      s.slug
-    )),
-    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-sidebar-group-title", style: { marginTop: 16 }, children: "Tools" }),
-    CLI_SECTIONS.map((s) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-      Link,
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "div",
       {
-        ref: activeSlug === s.slug ? activeRef : void 0,
-        to: `/docs/${s.slug}`,
-        className: `fc-docs-sidebar-link${activeSlug === s.slug ? " active" : ""}`,
-        children: s.title
-      },
-      s.slug
-    ))
+        className: `fc-docs-sidebar-backdrop${open ? " open" : ""}`,
+        onClick: onClose
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("aside", { className: `fc-docs-sidebar${open ? " open" : ""}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-sidebar-group-title", children: "API Reference" }),
+      DOC_SECTIONS.map((s) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Link,
+        {
+          ref: activeSlug === s.slug ? activeRef : void 0,
+          to: `/docs/${s.slug}`,
+          className: `fc-docs-sidebar-link${activeSlug === s.slug ? " active" : ""}`,
+          onClick: onClose,
+          children: s.title
+        },
+        s.slug
+      )),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-sidebar-group-title", style: { marginTop: 16 }, children: "Tools" }),
+      CLI_SECTIONS.map((s) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        Link,
+        {
+          ref: activeSlug === s.slug ? activeRef : void 0,
+          to: `/docs/${s.slug}`,
+          className: `fc-docs-sidebar-link${activeSlug === s.slug ? " active" : ""}`,
+          onClick: onClose,
+          children: s.title
+        },
+        s.slug
+      ))
+    ] })
   ] });
 }
-function SearchOverlay({
-  open,
-  onClose,
-  searchIndex
-}) {
+function SearchOverlay({ open, onClose, searchIndex }) {
   const inputRef = reactExports.useRef(null);
   const [query, setQuery] = reactExports.useState("");
   const [selected, setSelected] = reactExports.useState(0);
@@ -3894,101 +3948,208 @@ function SearchOverlay({
   reactExports.useEffect(() => {
     setSelected(0);
   }, [query]);
-  const selectResult = reactExports.useCallback((idx) => {
-    const hit = results[idx];
-    if (!hit) return;
-    onClose();
-    const anchor = hit.item.anchor ? `#${hit.item.anchor}` : "";
-    navigate(`/docs/${hit.item.slug}${anchor}`);
-  }, [results, onClose, navigate]);
-  const onKeyDown = reactExports.useCallback((e) => {
-    if (e.key === "ArrowDown") {
-      e.preventDefault();
-      setSelected((s) => Math.min(s + 1, results.length - 1));
-    } else if (e.key === "ArrowUp") {
-      e.preventDefault();
-      setSelected((s) => Math.max(s - 1, 0));
-    } else if (e.key === "Enter") {
-      e.preventDefault();
-      selectResult(selected);
-    } else if (e.key === "Escape") {
-      e.preventDefault();
+  const selectResult = reactExports.useCallback(
+    (idx) => {
+      const hit = results[idx];
+      if (!hit) return;
       onClose();
-    }
-  }, [results.length, selected, selectResult, onClose]);
+      const anchor = hit.item.anchor ? `#${hit.item.anchor}` : "";
+      navigate(`/docs/${hit.item.slug}${anchor}`);
+    },
+    [results, onClose, navigate]
+  );
+  const onKeyDown = reactExports.useCallback(
+    (e) => {
+      if (e.key === "ArrowDown") {
+        e.preventDefault();
+        setSelected((s) => Math.min(s + 1, results.length - 1));
+      } else if (e.key === "ArrowUp") {
+        e.preventDefault();
+        setSelected((s) => Math.max(s - 1, 0));
+      } else if (e.key === "Enter") {
+        e.preventDefault();
+        selectResult(selected);
+      } else if (e.key === "Escape") {
+        e.preventDefault();
+        onClose();
+      }
+    },
+    [results.length, selected, selectResult, onClose]
+  );
   if (!open) return null;
-  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-overlay", onClick: (e) => {
-    if (e.target === e.currentTarget) onClose();
-  }, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-modal", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-input-wrap", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", style: { color: "var(--fc-textDim)", flexShrink: 0 }, children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "11", cy: "11", r: "8" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "m21 21-4.35-4.35" })
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx(
-        "input",
-        {
-          ref: inputRef,
-          type: "text",
-          placeholder: "Search docs...",
-          value: query,
-          onChange: (e) => setQuery(e.target.value),
-          onKeyDown,
-          autoComplete: "off",
-          spellCheck: false
-        }
-      ),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "esc" })
-    ] }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-results", children: [
-      query.trim() && results.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-empty", children: [
-        "No results for “",
-        query,
-        "”"
-      ] }),
-      results.map((hit, i) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
-        "div",
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "div",
+    {
+      className: "fc-docs-search-overlay",
+      onClick: (e) => {
+        if (e.target === e.currentTarget) onClose();
+      },
+      children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-modal", children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-input-wrap", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "svg",
+            {
+              width: "18",
+              height: "18",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              style: { color: "var(--fc-textDim)", flexShrink: 0 },
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("circle", { cx: "11", cy: "11", r: "8" }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("path", { d: "m21 21-4.35-4.35" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            "input",
+            {
+              ref: inputRef,
+              type: "text",
+              placeholder: "Search docs...",
+              value: query,
+              onChange: (e) => setQuery(e.target.value),
+              onKeyDown,
+              autoComplete: "off",
+              spellCheck: false
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "esc" })
+        ] }),
+        /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-results", children: [
+          query.trim() && results.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-empty", children: [
+            "No results for “",
+            query,
+            "”"
+          ] }),
+          results.map((hit, i) => /* @__PURE__ */ jsxRuntimeExports.jsxs(
+            "div",
+            {
+              className: `fc-docs-search-result${i === selected ? " selected" : ""}`,
+              onClick: () => selectResult(i),
+              onMouseEnter: () => setSelected(i),
+              children: [
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-title", children: hit.item.title }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-category", children: hit.item.category }),
+                hit.item.content && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-snippet", children: hit.item.content.slice(0, 120) })
+              ]
+            },
+            `${hit.item.slug}-${hit.item.anchor}-${i}`
+          ))
+        ] }),
+        query.trim() && results.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-footer", children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "↑↓" }),
+            " navigate"
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "↵" }),
+            " open"
+          ] }),
+          /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "esc" }),
+            " close"
+          ] })
+        ] })
+      ] })
+    }
+  );
+}
+function extractTocEntries(container) {
+  var _a2;
+  const headings = Array.from(container.querySelectorAll("h2, h3"));
+  const entries = [];
+  for (const h of headings) {
+    const id = h.id;
+    if (!id) continue;
+    const text = ((_a2 = h.textContent) == null ? void 0 : _a2.replace(/#$/, "").trim()) || "";
+    if (!text) continue;
+    entries.push({ id, text, depth: parseInt(h.tagName[1]) });
+  }
+  return entries;
+}
+function OnThisPage({ contentRef, html, open, onClose }) {
+  const [entries, setEntries] = reactExports.useState([]);
+  const [activeId, setActiveId] = reactExports.useState("");
+  reactExports.useEffect(() => {
+    if (!html || !contentRef.current) {
+      setEntries([]);
+      return;
+    }
+    const raf = requestAnimationFrame(() => {
+      if (contentRef.current) setEntries(extractTocEntries(contentRef.current));
+    });
+    return () => cancelAnimationFrame(raf);
+  }, [html]);
+  reactExports.useEffect(() => {
+    if (entries.length === 0 || !contentRef.current) return;
+    const scrollContainer = contentRef.current.closest(".fc-docs-main");
+    if (!scrollContainer) return;
+    const handleScroll = () => {
+      var _a2;
+      const headings = Array.from(((_a2 = contentRef.current) == null ? void 0 : _a2.querySelectorAll("h2, h3")) ?? []);
+      let current = "";
+      for (const h of headings) {
+        if (h.getBoundingClientRect().top <= 100) current = h.id;
+        else break;
+      }
+      setActiveId(current);
+    };
+    scrollContainer.addEventListener("scroll", handleScroll, { passive: true });
+    handleScroll();
+    return () => scrollContainer.removeEventListener("scroll", handleScroll);
+  }, [entries, contentRef]);
+  if (entries.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "div",
+      {
+        className: `fc-docs-toc-backdrop${open ? " open" : ""}`,
+        onClick: onClose
+      }
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("aside", { className: `fc-docs-toc${open ? " open" : ""}`, children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-toc-handle" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-toc-title", children: "On this page" }),
+      entries.map((e) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "a",
         {
-          className: `fc-docs-search-result${i === selected ? " selected" : ""}`,
-          onClick: () => selectResult(i),
-          onMouseEnter: () => setSelected(i),
-          children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-title", children: hit.item.title }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-category", children: hit.item.category }),
-            hit.item.content && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "fc-docs-search-result-snippet", children: hit.item.content.slice(0, 120) })
-          ]
+          href: `#${e.id}`,
+          className: `fc-docs-toc-link${e.depth === 3 ? " indent" : ""}${activeId === e.id ? " active" : ""}`,
+          onClick: (ev) => {
+            var _a2;
+            ev.preventDefault();
+            onClose();
+            const target = (_a2 = contentRef.current) == null ? void 0 : _a2.querySelector(`#${CSS.escape(e.id)}`);
+            if (target) {
+              target.scrollIntoView({ behavior: "smooth", block: "start" });
+              history.replaceState(null, "", `#${e.id}`);
+            }
+          },
+          children: e.text
         },
-        `${hit.item.slug}-${hit.item.anchor}-${i}`
+        e.id
       ))
-    ] }),
-    query.trim() && results.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-search-footer", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "↑↓" }),
-        " navigate"
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "↵" }),
-        " open"
-      ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("kbd", { children: "esc" }),
-        " close"
-      ] })
     ] })
-  ] }) });
+  ] });
 }
-function DocContent({ slug }) {
+function DocContent({ slug, contentRef, onHtml }) {
   const [html, setHtml] = reactExports.useState(null);
   const [error, setError] = reactExports.useState(null);
-  const contentRef = reactExports.useRef(null);
   reactExports.useEffect(() => {
     setHtml(null);
     setError(null);
+    onHtml(null);
     const filename = slug === "cli" ? "CLI.md" : `generated/${slug}.md`;
     fetch(`/docs-raw/${filename}`).then((r) => {
       if (!r.ok) throw new Error(`Not found: ${filename}`);
       return r.text();
-    }).then((md) => setHtml(renderToHtml(md))).catch((e) => setError(e.message));
+    }).then((md) => {
+      const h = renderToHtml(md);
+      setHtml(h);
+      onHtml(h);
+    }).catch((e) => setError(e.message));
   }, [slug]);
   reactExports.useEffect(() => {
     if (!html || !contentRef.current) return;
@@ -4031,14 +4192,7 @@ function DocContent({ slug }) {
   if (html === null) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { style: { padding: 40, color: "var(--fc-textDim)" }, children: "Loading..." });
   }
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "div",
-    {
-      ref: contentRef,
-      className: "fc-docs-content",
-      dangerouslySetInnerHTML: { __html: html }
-    }
-  );
+  return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { ref: contentRef, className: "fc-docs-content", dangerouslySetInnerHTML: { __html: html } });
 }
 function DocsIndex() {
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-index", children: [
@@ -4068,6 +4222,10 @@ function DocsPage() {
   const navigate = useNavigate();
   const [searchOpen, setSearchOpen] = reactExports.useState(false);
   const [searchIndex, setSearchIndex] = reactExports.useState(null);
+  const contentRef = reactExports.useRef(null);
+  const [docHtml, setDocHtml] = reactExports.useState(null);
+  const [showSidebar, setShowSidebar] = reactExports.useState(() => window.innerWidth > 900);
+  const [showToc, setShowToc] = reactExports.useState(() => window.innerWidth > 1200);
   const buildSearchIndex = reactExports.useCallback(async () => {
     if (searchIndex) return;
     const entries = [];
@@ -4076,25 +4234,27 @@ function DocsPage() {
       try {
         const r = await fetch(`/docs-raw/${filename}`);
         if (!r.ok) return;
-        const md = await r.text();
+        const md = stripFrontmatter(await r.text());
         entries.push(...buildSearchEntries(section.slug, section.title, md));
       } catch {
       }
     });
     await Promise.all(fetches);
-    setSearchIndex(new Fuse(entries, {
-      keys: [
-        { name: "title", weight: 0.45 },
-        { name: "signature", weight: 0.25 },
-        { name: "category", weight: 0.15 },
-        { name: "content", weight: 0.15 }
-      ],
-      threshold: 0.35,
-      distance: 100,
-      includeMatches: true,
-      minMatchCharLength: 1,
-      ignoreLocation: true
-    }));
+    setSearchIndex(
+      new Fuse(entries, {
+        keys: [
+          { name: "title", weight: 0.45 },
+          { name: "signature", weight: 0.25 },
+          { name: "category", weight: 0.15 },
+          { name: "content", weight: 0.15 }
+        ],
+        threshold: 0.35,
+        distance: 100,
+        includeMatches: true,
+        minMatchCharLength: 1,
+        ignoreLocation: true
+      })
+    );
   }, [searchIndex]);
   const openSearch = reactExports.useCallback(() => {
     setSearchOpen(true);
@@ -4121,20 +4281,26 @@ function DocsPage() {
     document.addEventListener("keydown", handler);
     return () => document.removeEventListener("keydown", handler);
   }, [slug, openSearch, navigate]);
+  const closeSidebar = reactExports.useCallback(() => setShowSidebar(false), []);
+  const closeToc = reactExports.useCallback(() => setShowToc(false), []);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-layout", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsx(SiteNav, { onSearchOpen: openSearch }),
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-body", children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx(Sidebar, { activeSlug: slug }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: "fc-docs-main", children: slug ? /* @__PURE__ */ jsxRuntimeExports.jsx(DocContent, { slug }) : /* @__PURE__ */ jsxRuntimeExports.jsx(DocsIndex, {}) })
-    ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(
-      SearchOverlay,
+      SiteNav,
       {
-        open: searchOpen,
-        onClose: () => setSearchOpen(false),
-        searchIndex
+        onSearchOpen: openSearch,
+        showSidebar,
+        showToc,
+        onToggleSidebar: () => setShowSidebar((s) => !s),
+        onToggleToc: () => setShowToc((s) => !s),
+        hasToc: !!slug
       }
-    )
+    ),
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "fc-docs-body", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Sidebar, { activeSlug: slug, open: showSidebar, onClose: closeSidebar }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: "fc-docs-main", children: slug ? /* @__PURE__ */ jsxRuntimeExports.jsx(DocContent, { slug, contentRef, onHtml: setDocHtml }) : /* @__PURE__ */ jsxRuntimeExports.jsx(DocsIndex, {}) }),
+      slug && /* @__PURE__ */ jsxRuntimeExports.jsx(OnThisPage, { contentRef, html: docHtml, open: showToc, onClose: closeToc })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx(SearchOverlay, { open: searchOpen, onClose: () => setSearchOpen(false), searchIndex })
   ] });
 }
 export {