@mgks/docmd 0.2.9 → 0.3.1

package/src/commands/build.js

@@ -14,6 +14,7 @@ const MarkdownIt = require('markdown-it');
 const hljs = require('highlight.js');
 const CleanCSS = require('clean-css');
 const esbuild = require('esbuild');
+const MiniSearch = require('minisearch');
 
 // Debug function to log navigation information
 function logNavigationPaths(pagePath, navPath, normalizedPath) {
@@ -64,6 +65,7 @@ async function buildSite(configPath, options = { isDev: false, preserve: false,
   const USER_ASSETS_DIR = path.resolve(CWD, 'assets');
   const md = createMarkdownItInstance(config);
   const shouldMinify = !options.isDev && config.minify !== false;
+  const searchIndexData = [];
 
   if (!await fs.pathExists(SRC_DIR)) {
     throw new Error(`Source directory not found: ${formatPathForDisplay(SRC_DIR, CWD)}`);
@@ -244,7 +246,7 @@ async function buildSite(configPath, options = { isDev: false, preserve: false,
       }
 
       // Destructure the valid data
-      const { frontmatter: pageFrontmatter, htmlContent, headings } = processedData;
+      const { frontmatter: pageFrontmatter, htmlContent, headings, searchData } = processedData;
 
       const isIndexFile = path.basename(relativePath) === 'index.md';
 
@@ -333,9 +335,27 @@ async function buildSite(configPath, options = { isDev: false, preserve: false,
         outputPath: sitemapOutputPath.replace(/\\/g, '/'),
         frontmatter: pageFrontmatter
       });
+
+      // Collect Search Data
+      if (searchData) {
+        let pageUrl = outputHtmlPath.replace(/\\/g, '/');
+        if (pageUrl.endsWith('/index.html')) {
+          pageUrl = pageUrl.substring(0, pageUrl.length - 10); // remove index.html
+        }
+
+        // Add to index array
+        searchIndexData.push({
+          id: pageUrl, // URL is the ID
+          title: searchData.title,
+          text: searchData.content,
+          headings: searchData.headings.join(' ')
+        });
+      }
+
     } catch (error) {
       console.error(`❌ An unexpected error occurred while processing file ${path.relative(CWD, filePath)}:`, error);
     }
+
   }
 
   // Generate sitemap if enabled in config
@@ -347,6 +367,33 @@ async function buildSite(configPath, options = { isDev: false, preserve: false,
     }
   }
 
+  // Generate search index if enabled
+  if (config.search !== false) {
+    console.log('🔍 Generating search index...');
+
+    // Create MiniSearch instance
+    const miniSearch = new MiniSearch({
+      fields: ['title', 'headings', 'text'], // fields to index for full-text search
+      storeFields: ['title', 'id', 'text'], // fields to return with search results (don't store full text to keep JSON small)
+      searchOptions: {
+        boost: { title: 2, headings: 1.5 }, // title matches are more important
+        fuzzy: 0.2
+      }
+    });
+
+    // Add documents
+    miniSearch.addAll(searchIndexData);
+
+    // Serialize to JSON
+    const jsonIndex = JSON.stringify(miniSearch.toJSON());
+    const searchIndexPath = path.join(OUTPUT_DIR, 'search-index.json');
+    await fs.writeFile(searchIndexPath, jsonIndex);
+
+    if (!options.isDev) {
+      console.log(`✅ Search index generated (${(jsonIndex.length / 1024).toFixed(1)} KB)`);
+    }
+  }
+
   // Print summary of preserved files at the end of build
   if (preservedFiles.length > 0 && !options.isDev) {
     console.log(`\n📋 Build Summary: ${preservedFiles.length} existing files were preserved:`);
@@ -364,6 +411,74 @@ async function buildSite(configPath, options = { isDev: false, preserve: false,
     }
   }
 
+  // Bundle third-party libraries into assets
+  const copyLibrary = async (packageName, fileToBundle, destFileName) => {
+    try {
+      let srcPath;
+
+      // 1. Resolve Source Path
+      try {
+        srcPath = require.resolve(`${packageName}/${fileToBundle}`);
+      } catch (e) {
+        const mainPath = require.resolve(packageName);
+        let currentDir = path.dirname(mainPath);
+        let packageRoot = null;
+        
+        for (let i = 0; i < 5; i++) {
+          if (await fs.pathExists(path.join(currentDir, 'package.json'))) {
+            packageRoot = currentDir;
+            break;
+          }
+          currentDir = path.dirname(currentDir);
+        }
+
+        if (packageRoot) {
+          srcPath = path.join(packageRoot, fileToBundle);
+        }
+      }
+
+      // 2. Process and Write
+      if (srcPath && await fs.pathExists(srcPath)) {
+        const destPath = path.join(OUTPUT_DIR, 'assets/js', destFileName);
+        
+        // Read content
+        let content = await fs.readFile(srcPath, 'utf8');
+        
+        // This prevents the browser from looking for index.js.map or similar files we didn't copy
+        content = content.replace(/\/\/# sourceMappingURL=.*$/gm, '');
+        
+        // Minify if production build
+        if (shouldMinify) {
+            try {
+                const result = await esbuild.transform(content, {
+                    minify: true,
+                    loader: 'js',
+                    target: 'es2015'
+                });
+                await fs.writeFile(destPath, result.code);
+            } catch (minErr) {
+                console.warn(`⚠️ Minification failed for ${packageName}, using sanitized original.`, minErr.message);
+                await fs.writeFile(destPath, content);
+            }
+        } else {
+            // Write sanitized original in dev mode
+            await fs.writeFile(destPath, content);
+        }
+
+      } else {
+        console.warn(`⚠️ Could not locate ${fileToBundle} in ${packageName}`);
+      }
+    } catch (e) {
+      console.warn(`⚠️ Failed to bundle ${packageName}: ${e.message}`);
+    }
+  };
+
+  // Bundle MiniSearch 
+  await copyLibrary('minisearch', 'dist/umd/index.js', 'minisearch.js');
+
+  // Bundle Mermaid
+  await copyLibrary('mermaid', 'dist/mermaid.min.js', 'mermaid.min.js');
+
   return {
     config,
     processedPages,

package/src/commands/init.js

@@ -23,6 +23,11 @@ module.exports = {
   // Directory Configuration
   srcDir: 'docs',       // Source directory for Markdown files
   outputDir: 'site',    // Directory for generated static site
+
+  // Search Configuration
+  search: true,        // Enable/disable search functionality
+
+  // Build Options
   minify: true,        // Enable/disable HTML/CSS/JS minification
 
   // Sidebar Configuration

package/src/core/config-validator.js

@@ -6,7 +6,8 @@ const chalk = require('chalk');
 const KNOWN_KEYS = [
   'siteTitle', 'siteUrl', 'srcDir', 'outputDir', 'logo', 
   'sidebar', 'theme', 'customJs', 'autoTitleFromH1', 
-  'copyCode', 'plugins', 'navigation', 'footer', 'sponsor', 'favicon'
+  'copyCode', 'plugins', 'navigation', 'footer', 'sponsor', 'favicon',
+  'search', 'minify', 'editLink', 'pageNavigation'
 ];
 
 // Common typos mapping

package/src/core/file-processor.js

@@ -4,6 +4,7 @@ const fs = require('fs-extra');
 const path = require('path');
 const matter = require('gray-matter');
 const { createMarkdownItInstance } = require('./markdown/setup');
+const striptags = require('striptags');
 
 function decodeHtmlEntities(html) {
     return html.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>').replace(/"/g, '"').replace(/'/g, "'").replace(/ /g, ' ');
@@ -56,8 +57,18 @@ async function processMarkdownFile(filePath, md, config) {
       htmlContent = md.render(markdownContent);
       headings = extractHeadingsFromHtml(htmlContent);
     }
+
+    let searchData = null;
+    if (!frontmatter.noindex) {
+        const rawText = decodeHtmlEntities(striptags(htmlContent));
+        searchData = {
+            title: frontmatter.title || 'Untitled',
+            content: rawText.slice(0, 5000), // Safety cap to prevent massive JSON
+            headings: headings.map(h => h.text)
+        };
+    }
   
-    return { frontmatter, htmlContent, headings };
+    return { frontmatter, htmlContent, headings, searchData };
 }
   
 async function findMarkdownFiles(dir) {

package/src/templates/layout.ejs

@@ -66,6 +66,15 @@
             </div>
             <% if (theme && theme.enableModeToggle && theme.positionMode === 'top') { %>
             <div class="header-right">
+                <% if (config.search !== false) { %>
+                <button class="docmd-search-trigger" aria-label="Search">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search-icon lucide-search"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg>
+                    <span class="search-label">Search</span>
+                    <span class="search-keys">
+                        <kbd class="docmd-kbd">⌘</kbd><kbd class="docmd-kbd">k</kbd>
+                    </span>
+                </button>
+                <% } %>
                 <button id="theme-toggle-button" aria-label="Toggle theme" class="theme-toggle-button theme-toggle-header">
                     <%# renderIcon is available in the global EJS scope from html-generator %>
                     <%- renderIcon('sun', { class: 'icon-sun' }) %>
@@ -137,16 +146,48 @@
                     <%- footerHtml || '' %>
                 </div>
                 <div class="branding-footer">
-                    Build with <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path><path d="M12 5 9.04 7.96a2.17 2.17 0 0 0 0 3.08c.82.82 2.13.85 3 .07l2.07-1.9a2.82 2.82 0 0 1 3.79 0l2.96 2.66"></path><path d="m18 15-2-2"></path><path d="m15 18-2-2"></path></svg> <a href="https://docmd.mgks.dev" target="_blank" rel="noopener">docmd.</a>
+                    Build with <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"></path><path d="M12 5 9.04 7.96a2.17 2.17 0 0 0 0 3.08c.82.82 2.13.85 3 .07l2.07-1.9a2.82 2.82 0 0 1 3.79 0l2.96 2.66"></path><path d="m18 15-2-2"></path><path d="m15 18-2-2"></path></svg> <a href="https://github.com/mgks/docmd" target="_blank" rel="noopener">docmd.</a>
                 </div>
             </div>
         </footer>
     </div>
 
+    <% if (config.search !== false) { %>
+    <!-- Search Modal -->
+    <div id="docmd-search-modal" class="docmd-search-modal" style="display: none;">
+        <div class="docmd-search-box">
+            <div class="docmd-search-header">
+                <svg xmlns="http://www.w3.org/2000/svg" width="1.25em" height="1.25em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search-icon lucide-search"><path d="m21 21-4.34-4.34"></path><circle cx="11" cy="11" r="8"></circle></svg>
+                <input type="text" id="docmd-search-input" placeholder="Search documentation..." autocomplete="off" spellcheck="false">
+                <button onclick="window.closeDocmdSearch()" class="docmd-search-close" aria-label="Close search">
+                    <svg xmlns="http://www.w3.org/2000/svg" width="2em" height="2em" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-x-icon lucide-x"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
+                </button>
+            </div>
+            <div id="docmd-search-results" class="docmd-search-results">
+                <!-- Results injected here -->
+            </div>
+            <div class="docmd-search-footer">
+                <span><kbd class="docmd-kbd">↑</kbd> <kbd class="docmd-kbd">↓</kbd> to navigate</span>
+                <span><kbd class="docmd-kbd">ESC</kbd> to close</span>
+            </div>
+        </div>
+    </div>
+    <% } %>
+
+    <script>
+      window.DOCMD_ROOT = "<%= relativePathToRoot %>";
+    </script>
+
     <script src="<%= relativePathToRoot %>assets/js/docmd-main.js"></script>
-    
+
+    <% if (config.search !== false) { %>
+    <!-- Search Scripts -->
+    <script src="<%= relativePathToRoot %>assets/js/minisearch.js"></script>
+    <script src="<%= relativePathToRoot %>assets/js/docmd-search.js"></script>
+    <% } %>
+
     <!-- Mermaid.js for diagram rendering -->
-    <script src="https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.min.js"></script>
+    <script src="<%= relativePathToRoot %>assets/js/mermaid.min.js"></script>
     <script src="<%= relativePathToRoot %>assets/js/docmd-mermaid.js"></script>
 
     <% (customJsFiles || []).forEach(jsFile => { %>