apidocly 1.0.3 → 1.0.5

package/README.md

@@ -3,14 +3,13 @@
 [![npm version](https://img.shields.io/npm/v/apidocly.svg)](https://www.npmjs.com/package/apidocly)
 [![npm downloads](https://img.shields.io/npm/dm/apidocly.svg)](https://www.npmjs.com/package/apidocly)
 
-API documentation generator with shadcn-style dark UI and password protection.
+API documentation generator with dark UI and password protection.
 
 A modern, dark-themed package that generates pure HTML/CSS/JS documentation.
 
 ## Features
 
 - **apidoc-compatible**: Uses the same annotation syntax as apidoc.js
-- **Shadcn Dark UI**: Beautiful, modern dark theme inspired by shadcn/ui
 - **OpenAPI Export**: Automatically generates OpenAPI 3.0 JSON for AI tools and code generators
 - **Password Protection**: Optional client-side password protection with AES-256-GCM encryption
 - **Zero Dependencies Output**: Generated docs are pure HTML/CSS/JS - no frameworks required
@@ -84,11 +83,13 @@ Create `apidocly.json` in your project root:
   "passwordMessage": "Enter password to view documentation",
   "header": {
     "title": "Introduction",
-    "filename": "header.md"
+    "filename": "header.md",
+    "collapsed": false
   },
   "footer": {
     "title": "Footer",
-    "filename": "footer.md"
+    "filename": "footer.md",
+    "collapsed": true
   }
 }
 ```

package/lib/generator/index.js

@@ -38,7 +38,8 @@ async function generateDocs(apiData, config, outputPath, options = {}) {
   }
 
   // Always save version history for version switching feature
-  saveVersionHistory(apiData, config, outputPath, verbose);
+  const plainPassword = password ? getPlainPassword(password) : null;
+  saveVersionHistory(apiData, config, outputPath, verbose, plainPassword);
 
   generateApiDataFile(apiData, outputPath, password, authData);
 
@@ -229,7 +230,7 @@ function escapeHtml(str) {
     .replace(/'/g, ''');
 }
 
-function saveVersionHistory(apiData, config, outputPath, verbose) {
+function saveVersionHistory(apiData, config, outputPath, verbose, password = null) {
   const versionsDir = path.join(outputPath, 'versions');
 
   if (!fs.existsSync(versionsDir)) {
@@ -294,18 +295,32 @@ function saveVersionHistory(apiData, config, outputPath, verbose) {
     }
   };
 
-  fs.writeFileSync(versionPath, JSON.stringify(versionData, null, 2), 'utf8');
+  // If password is provided, encrypt the version file
+  if (password) {
+    const encryptedVersionData = encryptData(versionData, password);
+    fs.writeFileSync(versionPath, encryptedVersionData, 'utf8');
+  } else {
+    fs.writeFileSync(versionPath, JSON.stringify(versionData, null, 2), 'utf8');
+  }
 
-  // Save versions index
+  // Save versions index (not encrypted - only contains metadata, no API data)
   fs.writeFileSync(versionsIndexPath, JSON.stringify(versionsIndex, null, 2), 'utf8');
 
   // Load all version data to embed in versions.js (for file:// protocol support)
+  // When encrypted, we store the encrypted strings directly
   const allVersionData = {};
   for (const v of versionsIndex) {
     const vPath = path.join(versionsDir, v.filename);
     if (fs.existsSync(vPath)) {
       try {
-        allVersionData[v.filename] = JSON.parse(fs.readFileSync(vPath, 'utf8'));
+        const fileContent = fs.readFileSync(vPath, 'utf8');
+        if (password) {
+          // Store encrypted string directly
+          allVersionData[v.filename] = fileContent;
+        } else {
+          // Store parsed JSON
+          allVersionData[v.filename] = JSON.parse(fileContent);
+        }
       } catch (e) {
         // Skip if can't read
       }
@@ -313,13 +328,14 @@ function saveVersionHistory(apiData, config, outputPath, verbose) {
   }
 
   // Generate versions.js for frontend
-  // Include withCompare setting and embedded version data for file:// protocol support
+  // Include withCompare setting, encrypted flag, and embedded version data
   const withCompare = config.template && config.template.withCompare ? true : false;
-  const versionsJs = `var apiVersions=${JSON.stringify(versionsIndex)};var apiVersionsConfig={withCompare:${withCompare}};var apiVersionsData=${JSON.stringify(allVersionData)};`;
+  const isEncrypted = !!password;
+  const versionsJs = `var apiVersions=${JSON.stringify(versionsIndex)};var apiVersionsConfig={withCompare:${withCompare},encrypted:${isEncrypted}};var apiVersionsData=${JSON.stringify(allVersionData)};`;
   fs.writeFileSync(path.join(outputPath, 'versions.js'), versionsJs, 'utf8');
 
   if (verbose) {
-    console.log(`  Saved version ${version} to history (${versionsIndex.length} versions total)`);
+    console.log(`  Saved version ${version} to history (${versionsIndex.length} versions total)${password ? ' (encrypted)' : ''}`);
   }
 }
 

package/package.json

@@ -1,46 +1,46 @@
-{
-  "name": "apidocly",
-  "version": "1.0.3",
-  "description": "API documentation generator with beautiful dark UI, password protection, and OpenAPI/Rest client export.",
-  "main": "lib/index.js",
-  "bin": {
-    "apidocly": "bin/apidocly.js"
-  },
-  "scripts": {
-    "test": "echo \"No tests yet\" && exit 0"
-  },
-  "keywords": [
-    "api",
-    "documentation",
-    "generator",
-    "apidoc",
-    "openapi",
-    "swagger",
-    "dark-mode",
-    "rest-api",
-    "api-docs",
-    "jsdoc",
-    "cli"
-  ],
-  "author": "",
-  "license": "MIT",
-  "homepage": "https://apidocly.com",
-  "bugs": {
-    "url": "https://apidocly.com"
-  },
-  "dependencies": {
-    "commander": "^11.1.0",
-    "glob": "11.1.0",
-    "terser": "^5.37.0"
-  },
-  "engines": {
-    "node": ">=14.0.0"
-  },
-  "files": [
-    "bin",
-    "lib",
-    "template",
-    "README.md",
-    "LICENSE"
-  ]
-}
+{
+  "name": "apidocly",
+  "version": "1.0.5",
+  "description": "API documentation generator with beautiful dark UI, password protection, and OpenAPI/Rest client export.",
+  "main": "lib/index.js",
+  "bin": {
+    "apidocly": "bin/apidocly.js"
+  },
+  "scripts": {
+    "test": "echo \"No tests yet\" && exit 0"
+  },
+  "keywords": [
+    "api",
+    "documentation",
+    "generator",
+    "apidoc",
+    "openapi",
+    "swagger",
+    "dark-mode",
+    "rest-api",
+    "api-docs",
+    "jsdoc",
+    "cli"
+  ],
+  "author": "",
+  "license": "MIT",
+  "homepage": "https://apidocly.com",
+  "bugs": {
+    "url": "https://apidocly.com"
+  },
+  "dependencies": {
+    "commander": "^11.1.0",
+    "glob": "11.1.0",
+    "terser": "^5.37.0"
+  },
+  "engines": {
+    "node": ">=14.0.0"
+  },
+  "files": [
+    "bin",
+    "lib",
+    "template",
+    "README.md",
+    "LICENSE"
+  ]
+}

package/template/css/style.css

@@ -810,6 +810,190 @@ a:hover {
   backdrop-filter: blur(10px);
 }
 
+/* Documentation Header Block (collapsible) */
+.doc-header-block {
+  margin: 0 0 1.5rem;
+  background: linear-gradient(135deg, rgba(255, 255, 255, 0.02) 0%, rgba(255, 255, 255, 0.01) 100%);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-xl);
+  overflow: hidden;
+  backdrop-filter: blur(10px);
+}
+
+.doc-header-block.hidden {
+  display: none;
+}
+
+.doc-header-toggle {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 1.25rem 1.5rem;
+  background: rgba(255, 255, 255, 0.02);
+  border-bottom: 1px solid var(--border);
+  cursor: pointer;
+  user-select: none;
+  transition: background-color 0.2s;
+}
+
+.doc-header-toggle:hover {
+  background: rgba(255, 255, 255, 0.04);
+}
+
+.doc-header-block.collapsed .doc-header-toggle {
+  border-bottom: none;
+}
+
+.doc-header-toggle-title {
+  font-size: 0.9375rem;
+  font-weight: 600;
+  color: var(--foreground);
+}
+
+.doc-header-chevron {
+  transition: transform 0.2s;
+  color: var(--muted-foreground);
+  flex-shrink: 0;
+}
+
+.doc-header-block.collapsed .doc-header-chevron {
+  transform: rotate(-90deg);
+}
+
+.doc-header-block.collapsed .doc-header-content {
+  display: none;
+}
+
+/* Documentation Header Content (from markdown) */
+.doc-header-content {
+  padding: 1.25rem 1.5rem;
+  color: var(--muted-foreground);
+  font-size: 0.9375rem;
+  line-height: 1.7;
+}
+
+.doc-header-content > *:first-child {
+  margin-top: 0;
+}
+
+.doc-header-content > *:last-child {
+  margin-bottom: 0;
+}
+
+.doc-header-content h1,
+.doc-header-content h2,
+.doc-header-content h3,
+.doc-header-content h4 {
+  color: var(--foreground);
+  margin-top: 1.25rem;
+  margin-bottom: 0.75rem;
+}
+
+.doc-header-content h1 { font-size: 1.5rem; }
+.doc-header-content h2 { font-size: 1.25rem; }
+.doc-header-content h3 { font-size: 1.125rem; }
+.doc-header-content h4 { font-size: 1rem; }
+
+.doc-header-content p {
+  margin-bottom: 0.75rem;
+}
+
+.doc-header-content ul,
+.doc-header-content ol {
+  margin: 0.75rem 0;
+  padding-left: 1.5rem;
+}
+
+.doc-header-content li {
+  margin-bottom: 0.375rem;
+}
+
+.doc-header-content li > ul,
+.doc-header-content li > ol {
+  margin-top: 0.375rem;
+  margin-bottom: 0;
+}
+
+.doc-header-content blockquote {
+  margin: 1rem 0;
+  padding: 0.75rem 1rem;
+  border-left: 3px solid var(--primary);
+  background: rgba(255, 255, 255, 0.02);
+  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
+}
+
+.doc-header-content blockquote p {
+  margin: 0;
+}
+
+.doc-header-content table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: 1rem 0;
+  font-size: 0.875rem;
+}
+
+.doc-header-content th,
+.doc-header-content td {
+  padding: 0.625rem 0.75rem;
+  border: 1px solid var(--border);
+  text-align: left;
+}
+
+.doc-header-content th {
+  background: var(--secondary);
+  color: var(--foreground);
+  font-weight: 600;
+}
+
+.doc-header-content tr:nth-child(even) td {
+  background: rgba(255, 255, 255, 0.02);
+}
+
+.doc-header-content hr {
+  margin: 1.5rem 0;
+  border: none;
+  border-top: 1px solid var(--border);
+}
+
+.doc-header-content code {
+  background: rgba(255, 255, 255, 0.05);
+  padding: 0.15rem 0.4rem;
+  border-radius: var(--radius-sm);
+  font-family: var(--font-mono);
+  font-size: 0.875em;
+  color: var(--primary);
+}
+
+.doc-header-content pre {
+  background: rgba(0, 0, 0, 0.3);
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  padding: 1rem;
+  margin: 1rem 0;
+  overflow-x: auto;
+}
+
+.doc-header-content pre code {
+  background: none;
+  padding: 0;
+  color: var(--foreground);
+}
+
+.doc-header-content a {
+  color: var(--primary);
+  text-decoration: none;
+}
+
+.doc-header-content a:hover {
+  text-decoration: underline;
+}
+
+.doc-header-content strong {
+  color: var(--foreground);
+  font-weight: 600;
+}
+
 /* Section Header */
 .section-header {
   display: flex;

package/template/index.html

@@ -157,6 +157,17 @@
         </div>
       </div>
 
+      <!-- Header Content (from markdown) - collapsible, separate block -->
+      <div class="doc-header-block hidden" id="doc-header-block">
+        <div class="doc-header-toggle" onclick="toggleDocHeader()">
+          <span class="doc-header-toggle-title" id="doc-header-toggle-title">Documentation</span>
+          <svg class="doc-header-chevron" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <path d="m6 9 6 6 6-6"></path>
+          </svg>
+        </div>
+        <div class="doc-header-content" id="doc-header-content"></div>
+      </div>
+
       <!-- Content Container -->
       <div class="content-container" id="content-container">
         <!-- Groups View (default) -->

package/template/js/main.js

@@ -197,11 +197,47 @@
     initEnvironmentSelector();
     initVersionComparison();
     updateStats();
+    renderHeaderContent();
     renderGroups();
     setupEventListeners();
     handleInitialHash();
   }
 
+  // Render header content from markdown
+  function renderHeaderContent() {
+    const headerBlock = document.getElementById('doc-header-block');
+    const headerContent = document.getElementById('doc-header-content');
+    const headerToggleTitle = document.getElementById('doc-header-toggle-title');
+    if (!headerBlock || !headerContent) return;
+
+    if (apiData.header && apiData.header.content) {
+      // Set the toggle title
+      if (headerToggleTitle && apiData.header.title) {
+        headerToggleTitle.textContent = apiData.header.title;
+      }
+      // Render markdown content
+      headerContent.innerHTML = marked.parse(apiData.header.content);
+      headerBlock.classList.remove('hidden');
+
+      // Determine collapsed state: localStorage overrides config default
+      const savedState = localStorage.getItem('apidocly-header-collapsed');
+      let isCollapsed;
+      if (savedState !== null) {
+        // User has manually toggled, use their preference
+        isCollapsed = savedState === 'true';
+      } else {
+        // Use config default (collapsed: true means start collapsed)
+        isCollapsed = apiData.header.collapsed !== false;
+      }
+
+      if (isCollapsed) {
+        headerBlock.classList.add('collapsed');
+      }
+    } else {
+      headerBlock.classList.add('hidden');
+    }
+  }
+
   // Environment Selector
   function initEnvironmentSelector() {
     const environments = apiData.project.environments || [];
@@ -2028,6 +2064,15 @@
   }
 
   // Global functions
+  window.toggleDocHeader = function() {
+    const block = document.getElementById('doc-header-block');
+    if (block) {
+      block.classList.toggle('collapsed');
+      // Save state to localStorage
+      localStorage.setItem('apidocly-header-collapsed', block.classList.contains('collapsed'));
+    }
+  };
+
   window.toggleExample = function(header) {
     const block = header.closest('.example-block');
     block.classList.toggle('collapsed');
@@ -2667,8 +2712,28 @@
 
     // Check if version data is embedded in versions.js (for file:// protocol support)
     if (typeof apiVersionsData !== 'undefined' && apiVersionsData[filename]) {
-      versionCache[filename] = apiVersionsData[filename];
-      return apiVersionsData[filename];
+      const versionContent = apiVersionsData[filename];
+
+      // Check if data is encrypted
+      if (typeof apiVersionsConfig !== 'undefined' && apiVersionsConfig.encrypted) {
+        // Decrypt using the stored password from auth module
+        const storedPwd = sessionStorage.getItem('apidocly-pwd');
+        if (!storedPwd) {
+          throw new Error('Cannot decrypt version data: no password available');
+        }
+        try {
+          const decrypted = await window.apiDoclyAuth.decryptData(versionContent, storedPwd);
+          versionCache[filename] = decrypted;
+          return decrypted;
+        } catch (e) {
+          console.error('Failed to decrypt version data:', e);
+          throw new Error('Failed to decrypt version data');
+        }
+      } else {
+        // Not encrypted, use directly
+        versionCache[filename] = versionContent;
+        return versionContent;
+      }
     }
 
     // Fall back to fetch (for http:// protocol)
@@ -2679,7 +2744,20 @@
         throw new Error('Failed to load version: ' + filename + ' (HTTP ' + response.status + ')');
       }
 
-      const data = await response.json();
+      // Check if response is encrypted (starts with base64 data, not JSON)
+      const text = await response.text();
+      let data;
+
+      if (typeof apiVersionsConfig !== 'undefined' && apiVersionsConfig.encrypted) {
+        const storedPwd = sessionStorage.getItem('apidocly-pwd');
+        if (!storedPwd) {
+          throw new Error('Cannot decrypt version data: no password available');
+        }
+        data = await window.apiDoclyAuth.decryptData(text, storedPwd);
+      } else {
+        data = JSON.parse(text);
+      }
+
       versionCache[filename] = data;
       return data;
     } catch (error) {