@hyperbook/markdown 0.35.1 → 0.36.0

package/dist/assets/client.js

@@ -274,9 +274,38 @@ var hyperbook = (function () {
     initBookmarks(root);
   }
 
+  // Check for standalone layout URL parameter or iframe context
+  function checkStandaloneMode() {
+    // Check if explicitly requested via URL parameter
+    const urlParams = new URLSearchParams(window.location.search);
+    const standaloneParam = urlParams.get('standalone') === 'true';
+    
+    // Check if page is inside an iframe
+    const isInIframe = window.self !== window.top;
+    
+    if (standaloneParam || isInIframe) {
+      const mainGrid = document.querySelector('.main-grid');
+      if (mainGrid && !mainGrid.classList.contains('layout-standalone')) {
+        mainGrid.classList.add('layout-standalone');
+      }
+      
+      // Hide TOC and QR code buttons when in standalone mode
+      const tocToggle = document.getElementById('toc-toggle');
+      if (tocToggle) {
+        tocToggle.style.display = 'none';
+      }
+      
+      const qrcodeOpen = document.getElementById('qrcode-open');
+      if (qrcodeOpen) {
+        qrcodeOpen.style.display = 'none';
+      }
+    }
+  }
+
   // Initialize existing elements on document load
   document.addEventListener("DOMContentLoaded", () => {
     init(document);
+    checkStandaloneMode();
   });
 
   // Observe for new elements added to the DOM

package/dist/assets/shell.css

@@ -807,3 +807,62 @@ nav.toc li.level-3 {
   flex-shrink: 0;
   /* Prevent caption from shrinking */
 }
+
+/* Wide layout: full width content with drawer-only navigation */
+.main-grid.layout-wide {
+  grid-template-columns: 1fr;
+  grid-template-areas:
+    "header"
+    "article";
+
+
+  --main-width: 100%;
+}
+
+.main-grid.layout-wide .sidebar {
+  display: none;
+}
+
+.main-grid.layout-wide .mobile-nav {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.main-grid.layout-wide main {
+  padding: 20px 40px;
+  max-width: 100%;
+}
+
+/* Standalone layout: content only, no navigation or header (for iframe embedding) */
+.main-grid.layout-standalone {
+  grid-template-columns: 1fr;
+  grid-template-rows: 1fr;
+  grid-template-areas: "article";
+
+  --main-width: 100%;
+
+  #toc-toggle {
+    top: inherit;
+  }
+
+  #qrcode-open {
+    top: 90px;
+  }
+}
+
+.main-grid.layout-standalone header,
+.main-grid.layout-standalone .sidebar {
+  display: none;
+}
+
+.main-grid.layout-standalone main {
+  padding: 20px 40px;
+  max-width: 100%;
+}
+
+.main-grid.layout-standalone .jump-container,
+.main-grid.layout-standalone .meta,
+.main-grid.layout-standalone #custom-links-footer {
+  display: none;
+}

package/dist/index.js

@@ -63837,12 +63837,19 @@ var makeCustomLinksFooter = (ctx) => {
 var rehypeShell_default = (ctx) => () => {
   return (tree, file) => {
     const originalChildren = tree.children;
+    const layout = ctx.navigation.current?.layout || "default";
+    let mainGridClass = "main-grid";
+    if (layout === "wide") {
+      mainGridClass = "main-grid layout-wide";
+    } else if (layout === "standalone") {
+      mainGridClass = "main-grid layout-standalone";
+    }
     tree.children = [
       {
         type: "element",
         tagName: "div",
         properties: {
-          class: "main-grid"
+          class: mainGridClass
         },
         children: [
           ...makeHeaderElements(ctx),