rdoc 6.17.0 → 8.1.0

data/lib/rdoc/generator/template/aliki/index.rhtml

@@ -3,7 +3,7 @@
 <%= render '_header.rhtml' %>
 <%= render '_sidebar_toggle.rhtml' %>
 
-<nav id="navigation" role="navigation">
+<nav id="sidebar-navigation" role="navigation" hidden>
   <%= render '_sidebar_pages.rhtml' %>
   <%= render '_sidebar_classes.rhtml' %>
 </nav>

data/lib/rdoc/generator/template/aliki/js/aliki.js

@@ -28,7 +28,7 @@ function createSearchInstance(input, result) {
 
   result.classList.remove("initially-hidden");
 
-  const search = new Search(search_data, input, result);
+  const search = new SearchController(search_data, input, result);
 
   search.renderItem = function(result) {
     const li = document.createElement('li');
@@ -40,8 +40,14 @@ function createSearchInstance(input, result) {
       html += `<span class="params">${result.params}</span>`;
     html += '</a>';
 
-    if (result.namespace)
-      html += `<p class="search-namespace">${this.hlt(result.namespace)}`;
+    // Add type indicator
+    if (result.type) {
+      const typeLabel = this.formatType(result.type);
+      const typeClass = result.type.replace(/_/g, '-');
+      html += `<span class="search-type search-type-${this.escapeHTML(typeClass)}">${typeLabel}</span>`;
+    }
+
+    html += '</p>';
 
     if (result.snippet)
       html += `<div class="search-snippet">${result.snippet}</div>`;
@@ -51,19 +57,20 @@ function createSearchInstance(input, result) {
     return li;
   }
 
-  search.select = function(result) {
-    let href = result.firstChild.firstChild.href;
-    const query = this.input.value;
-    if (query) {
-      const url = new URL(href, window.location.origin);
-      url.searchParams.set('q', query);
-      url.searchParams.set('nav', '0');
-      href = url.toString();
-    }
-    window.location.href = href;
+  search.formatType = function(type) {
+    const typeLabels = {
+      'class': 'class',
+      'module': 'module',
+      'constant': 'const',
+      'instance_method': 'method',
+      'class_method': 'method'
+    };
+    return typeLabels[type] || type;
   }
 
-  search.scrollIntoView = search.scrollInWindow;
+  search.select = function(result) {
+    window.location.href = result.firstChild.firstChild.href;
+  }
 
   return search;
 }
@@ -74,6 +81,11 @@ function hookSearch() {
 
   if (!input || !result) return; // Exit if search elements not found
 
+  const container = input.closest('[data-search-container]');
+  const searchToggle = document.querySelector('#search-toggle');
+  const searchEmpty = container && container.querySelector('.search-empty');
+  let focusBeforeOpen = null;
+
   const search_section = document.querySelector('#search-section');
   if (search_section) {
     search_section.classList.remove("initially-hidden");
@@ -82,29 +94,92 @@ function hookSearch() {
   const search = createSearchInstance(input, result);
   if (!search) return;
 
+  if (searchEmpty) {
+    const originalRenderItem = search.renderItem;
+    search.renderItem = function(result) {
+      searchEmpty.style.display = 'none';
+      return originalRenderItem.call(this, result);
+    };
+  }
+
+  const showSearchSurface = () => {
+    if (container) container.classList.add('is-open');
+    if (searchToggle) searchToggle.setAttribute('aria-expanded', 'true');
+  };
+
+  const openSearch = () => {
+    focusBeforeOpen = document.activeElement;
+    showSearchSurface();
+    input.focus({ preventScroll: true });
+  };
+
+  const closeSearch = (restoreFocus = true) => {
+    if (container) container.classList.remove('is-open');
+    if (searchToggle) searchToggle.setAttribute('aria-expanded', 'false');
+    search.hide();
+    input.blur();
+
+    if (restoreFocus && focusBeforeOpen && typeof focusBeforeOpen.focus === 'function') {
+      focusBeforeOpen.focus({ preventScroll: true });
+    }
+    focusBeforeOpen = null;
+  };
+
+  if (searchToggle) searchToggle.addEventListener('click', openSearch);
+  if (container) {
+    container.querySelectorAll('[data-search-close]').forEach((control) => {
+      control.addEventListener('click', () => closeSearch());
+    });
+  }
+
+  hookFocus(openSearch);
+
+  // Hide search results when clicking outside the search area
+  document.addEventListener('click', (e) => {
+    if (container && container.contains(e.target)) return;
+
+    search.hide();
+    if (container && container.classList.contains('is-open')) closeSearch(false);
+  });
+
+  // Close the search surface on Escape
+  document.addEventListener('keydown', (e) => {
+    const isOpen = container && container.classList.contains('is-open');
+    if (e.key === 'Escape' && (isOpen || input.matches(":focus"))) {
+      closeSearch();
+    }
+  });
+
+  // Show search results when focusing on input (if there's a query)
+  input.addEventListener('focus', () => {
+    showSearchSurface();
+    if (input.value.trim()) {
+      search.show();
+    }
+  });
+
   // Check for ?q= URL parameter and trigger search automatically
   if (typeof URLSearchParams !== 'undefined') {
     const urlParams = new URLSearchParams(window.location.search);
     const queryParam = urlParams.get('q');
     if (queryParam) {
-      const navParam = urlParams.get('nav');
-      const autoSelect = navParam !== '0';
+      openSearch();
       input.value = queryParam;
-      search.search(queryParam, autoSelect);
+      search.search(queryParam, false);
     }
   }
 }
 
 /* ===== Keyboard Shortcuts ===== */
 
-function hookFocus() {
+function hookFocus(openSearch) {
   document.addEventListener("keydown", (event) => {
     if (document.activeElement.tagName === 'INPUT') {
       return;
     }
     if (event.key === "/") {
       event.preventDefault();
-      document.querySelector('#search-field').focus();
+      openSearch();
     }
   });
 }
@@ -112,55 +187,62 @@ function hookFocus() {
 /* ===== Mobile Navigation ===== */
 
 function hookSidebar() {
-  const navigation = document.querySelector('#navigation');
-  const navigationToggle = document.querySelector('#navigation-toggle');
+  const sidebarNavigation = document.querySelector('#sidebar-navigation');
+  const sidebarNavigationToggle = document.querySelector('#sidebar-navigation-toggle');
 
-  if (!navigation || !navigationToggle) return;
+  if (!sidebarNavigation || !sidebarNavigationToggle) return;
 
   const closeNav = () => {
-    navigation.hidden = true;
-    navigationToggle.ariaExpanded = 'false';
-    document.body.classList.remove('nav-open');
+    sidebarNavigation.hidden = true;
+    sidebarNavigationToggle.ariaExpanded = 'false';
+    document.body.classList.remove('sidebar-navigation-open');
   };
 
   const openNav = () => {
-    navigation.hidden = false;
-    navigationToggle.ariaExpanded = 'true';
-    document.body.classList.add('nav-open');
+    sidebarNavigation.hidden = false;
+    sidebarNavigationToggle.ariaExpanded = 'true';
+    document.body.classList.add('sidebar-navigation-open');
   };
 
   const toggleNav = () => {
-    if (navigation.hidden) {
+    if (sidebarNavigation.hidden) {
       openNav();
     } else {
       closeNav();
     }
   };
 
-  navigationToggle.addEventListener('click', (e) => {
+  sidebarNavigationToggle.addEventListener('click', (e) => {
     e.stopPropagation();
     toggleNav();
   });
 
   const isSmallViewport = window.matchMedia("(max-width: 1023px)").matches;
+
+  // The sidebar is hidden by default with the `hidden` attribute
+  // On large viewports, we display the sidebar with JavaScript
+  // This is better than the opposite approach of hiding it with JavaScript
+  // because it avoids flickering the sidebar when the page is loaded, especially on mobile devices
   if (isSmallViewport) {
     closeNav();
 
     // Close nav when clicking links inside it
     document.addEventListener('click', (e) => {
-      if (e.target.closest('#navigation a')) {
+      if (e.target.closest('#sidebar-navigation a')) {
         closeNav();
       }
     });
 
     // Close nav when clicking backdrop
     document.addEventListener('click', (e) => {
-      if (!navigation.hidden &&
-          !e.target.closest('#navigation') &&
-          !e.target.closest('#navigation-toggle')) {
+      if (!sidebarNavigation.hidden &&
+          !e.target.closest('#sidebar-navigation') &&
+          !e.target.closest('#sidebar-navigation-toggle')) {
         closeNav();
       }
     });
+  } else {
+    openNav();
   }
 }
 
@@ -203,7 +285,7 @@ function generateToc() {
     tocNav.appendChild(tocList);
   } else {
     // Hide TOC if no headings found
-    const tocContainer = document.querySelector('.table-of-contents');
+    const tocContainer = document.querySelector('#table-of-contents');
     if (tocContainer) {
       tocContainer.style.display = 'none';
     }
@@ -296,80 +378,6 @@ function setHeadingSelfLinkScrollHandlers() {
   })
 }
 
-/* ===== Mobile Search Modal ===== */
-
-function hookSearchModal() {
-  const searchToggle = document.querySelector('#search-toggle');
-  const searchModal = document.querySelector('#search-modal');
-  const searchModalClose = document.querySelector('#search-modal-close');
-  const searchModalBackdrop = document.querySelector('.search-modal-backdrop');
-  const searchInput = document.querySelector('#search-field-mobile');
-  const searchResults = document.querySelector('#search-results-mobile');
-  const searchEmpty = document.querySelector('.search-modal-empty');
-
-  if (!searchToggle || !searchModal) return;
-
-  // Initialize search for mobile modal
-  const mobileSearch = createSearchInstance(searchInput, searchResults);
-  if (!mobileSearch) return;
-
-  // Hide empty state when there are results
-  const originalRenderItem = mobileSearch.renderItem;
-  mobileSearch.renderItem = function(result) {
-    if (searchEmpty) searchEmpty.style.display = 'none';
-    return originalRenderItem.call(this, result);
-  };
-
-  const openSearchModal = () => {
-    searchModal.hidden = false;
-    document.body.style.overflow = 'hidden';
-    // Focus input after animation
-    setTimeout(() => {
-      if (searchInput) searchInput.focus();
-    }, 100);
-  };
-
-  const closeSearchModal = () => {
-    searchModal.hidden = true;
-    document.body.style.overflow = '';
-  };
-
-  // Open on button click
-  searchToggle.addEventListener('click', openSearchModal);
-
-  // Close on close button click
-  if (searchModalClose) {
-    searchModalClose.addEventListener('click', closeSearchModal);
-  }
-
-  // Close on backdrop click
-  if (searchModalBackdrop) {
-    searchModalBackdrop.addEventListener('click', closeSearchModal);
-  }
-
-  // Close on Escape key
-  document.addEventListener('keydown', (e) => {
-    if (e.key === 'Escape' && !searchModal.hidden) {
-      closeSearchModal();
-    }
-  });
-
-  // Check for ?q= URL parameter on mobile and open modal
-  if (typeof URLSearchParams !== 'undefined') {
-    const urlParams = new URLSearchParams(window.location.search);
-    const queryParam = urlParams.get('q');
-    const isSmallViewport = window.matchMedia("(max-width: 1023px)").matches;
-
-    if (queryParam && isSmallViewport) {
-      openSearchModal();
-      searchInput.value = queryParam;
-      const navParam = urlParams.get('nav');
-      const autoSelect = navParam !== '0';
-      mobileSearch.search(queryParam, autoSelect);
-    }
-  }
-}
-
 /* ===== Code Block Copy Functionality ===== */
 
 function createCopyButton() {
@@ -407,8 +415,8 @@ function wrapCodeBlocksWithCopyButton() {
   //   not directly in rhtml templates
   // - Modifying the formatter would require extending RDoc's core internals
 
-  // Find all pre elements that are not already wrapped
-  const preElements = document.querySelectorAll('main pre:not(.code-block-wrapper pre)');
+  // Target code examples and source code; skip type signature blocks
+  const preElements = document.querySelectorAll('main pre:not(.method-type-signature)');
 
   preElements.forEach((pre) => {
     // Skip if already wrapped
@@ -473,11 +481,9 @@ function showCopySuccess(button) {
 document.addEventListener('DOMContentLoaded', () => {
   hookSourceViews();
   hookSearch();
-  hookFocus();
   hookSidebar();
   generateToc();
   setHeadingSelfLinkScrollHandlers();
   hookTocActiveHighlighting();
-  hookSearchModal();
   wrapCodeBlocksWithCopyButton();
 });

data/lib/rdoc/generator/template/aliki/js/bash_highlighter.js

@@ -0,0 +1,167 @@
+/**
+ * Client-side shell syntax highlighter for RDoc
+ * Highlights: $ prompts, commands, options, strings, env vars, comments
+ */
+
+(function() {
+  'use strict';
+
+  function escapeHtml(text) {
+    return text
+      .replace(/&/g, '&')
+      .replace(/</g, '&lt;')
+      .replace(/>/g, '&gt;')
+      .replace(/"/g, '&quot;')
+      .replace(/'/g, '&#39;');
+  }
+
+  function wrap(className, text) {
+    return '<span class="' + className + '">' + escapeHtml(text) + '</span>';
+  }
+
+  function highlightLine(line) {
+    if (line.trim() === '') return escapeHtml(line);
+
+    var result = '';
+    var i = 0;
+    var len = line.length;
+
+    // Preserve leading whitespace
+    while (i < len && (line[i] === ' ' || line[i] === '\t')) {
+      result += escapeHtml(line[i++]);
+    }
+
+    // Check for $ prompt ($ followed by space or end of line)
+    if (line[i] === '$' && (line[i + 1] === ' ' || line[i + 1] === undefined)) {
+      result += wrap('sh-prompt', '$');
+      i++;
+    }
+
+    // Check for # comment at start
+    if (line[i] === '#') {
+      return result + wrap('sh-comment', line.slice(i));
+    }
+
+    var seenCommand = false;
+    var afterSpace = true;
+
+    while (i < len) {
+      var ch = line[i];
+
+      // Whitespace
+      if (ch === ' ' || ch === '\t') {
+        result += escapeHtml(ch);
+        i++;
+        afterSpace = true;
+        continue;
+      }
+
+      // Comment after whitespace
+      if (ch === '#' && afterSpace) {
+        result += wrap('sh-comment', line.slice(i));
+        break;
+      }
+
+      // Double-quoted string
+      if (ch === '"') {
+        var end = i + 1;
+        while (end < len && line[end] !== '"') {
+          if (line[end] === '\\' && end + 1 < len) end += 2;
+          else end++;
+        }
+        if (end < len) end++;
+        result += wrap('sh-string', line.slice(i, end));
+        i = end;
+        afterSpace = false;
+        continue;
+      }
+
+      // Single-quoted string
+      if (ch === "'") {
+        var end = i + 1;
+        while (end < len && line[end] !== "'") end++;
+        if (end < len) end++;
+        result += wrap('sh-string', line.slice(i, end));
+        i = end;
+        afterSpace = false;
+        continue;
+      }
+
+      // Environment variable (ALLCAPS=)
+      if (afterSpace && /[A-Z]/.test(ch)) {
+        var match = line.slice(i).match(/^[A-Z][A-Z0-9_]*=/);
+        if (match) {
+          result += wrap('sh-envvar', match[0]);
+          i += match[0].length;
+          // Read unquoted value
+          var valEnd = i;
+          while (valEnd < len && line[valEnd] !== ' ' && line[valEnd] !== '\t' && line[valEnd] !== '"' && line[valEnd] !== "'") valEnd++;
+          if (valEnd > i) {
+            result += escapeHtml(line.slice(i, valEnd));
+            i = valEnd;
+          }
+          afterSpace = false;
+          continue;
+        }
+      }
+
+      // Option (must be after whitespace)
+      if (ch === '-' && afterSpace) {
+        var match = line.slice(i).match(/^--?[a-zA-Z0-9_-]+(=[^"'\s]*)?/);
+        if (match) {
+          result += wrap('sh-option', match[0]);
+          i += match[0].length;
+          afterSpace = false;
+          continue;
+        }
+      }
+
+      // Command (first word: regular, ./path, ../path, ~/path, /abs/path, @scope/pkg)
+      if (!seenCommand && afterSpace) {
+        var isCmd = /[a-zA-Z0-9@~\/]/.test(ch) ||
+                    (ch === '.' && (line[i + 1] === '/' || (line[i + 1] === '.' && line[i + 2] === '/')));
+        if (isCmd) {
+          var end = i;
+          while (end < len && line[end] !== ' ' && line[end] !== '\t') end++;
+          result += wrap('sh-command', line.slice(i, end));
+          i = end;
+          seenCommand = true;
+          afterSpace = false;
+          continue;
+        }
+      }
+
+      // Everything else
+      result += escapeHtml(ch);
+      i++;
+      afterSpace = false;
+    }
+
+    return result;
+  }
+
+  function highlightShell(code) {
+    return code.split('\n').map(highlightLine).join('\n');
+  }
+
+  function initHighlighting() {
+    var selectors = [
+      'pre.bash', 'pre.sh', 'pre.shell', 'pre.console',
+      'pre[data-language="bash"]', 'pre[data-language="sh"]',
+      'pre[data-language="shell"]', 'pre[data-language="console"]'
+    ];
+
+    var blocks = document.querySelectorAll(selectors.join(', '));
+    blocks.forEach(function(block) {
+      if (block.getAttribute('data-highlighted') === 'true') return;
+      block.innerHTML = highlightShell(block.textContent);
+      block.setAttribute('data-highlighted', 'true');
+    });
+  }
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initHighlighting);
+  } else {
+    initHighlighting();
+  }
+})();

data/lib/rdoc/generator/template/aliki/js/c_highlighter.js

@@ -276,7 +276,7 @@
    * Initialize C syntax highlighting on page load
    */
   function initHighlighting() {
-    const codeBlocks = document.querySelectorAll('pre[data-language="c"]');
+    const codeBlocks = document.querySelectorAll('pre.c');
 
     codeBlocks.forEach(block => {
       if (block.getAttribute('data-highlighted') === 'true') {

data/lib/rdoc/generator/template/aliki/js/{search.js → search_controller.js}

@@ -1,15 +1,15 @@
-Search = function(data, input, result) {
+SearchController = function(data, input, result) {
   this.data = data;
   this.input = input;
   this.result = result;
 
   this.current = null;
   this.view = this.result.parentNode;
-  this.searcher = new Searcher(data.index);
+  this.ranker = new SearchRanker(data.index);
   this.init();
 }
 
-Search.prototype = Object.assign({}, Navigation, new function() {
+SearchController.prototype = Object.assign({}, SearchNavigation, new function() {
   var suid = 1;
 
   this.init = function() {
@@ -25,7 +25,7 @@ Search.prototype = Object.assign({}, Navigation, new function() {
     this.input.addEventListener('keyup', observer);
     this.input.addEventListener('click', observer); // mac's clear field
 
-    this.searcher.ready(function(results, isLast) {
+    this.ranker.ready(function(results, isLast) {
       _this.addResults(results, isLast);
     })
 
@@ -36,7 +36,7 @@ Search.prototype = Object.assign({}, Navigation, new function() {
   this.search = function(value, selectFirstMatch) {
     this.selectFirstMatch = selectFirstMatch;
 
-    value = value.trim().toLowerCase();
+    value = value.trim();
     if (value) {
       this.setNavigationActive(true);
     } else {
@@ -53,7 +53,7 @@ Search.prototype = Object.assign({}, Navigation, new function() {
       this.result.setAttribute('aria-busy',     'true');
       this.result.setAttribute('aria-expanded', 'true');
       this.firstRun = true;
-      this.searcher.find(value);
+      this.ranker.find(value);
     }
   }
 
@@ -96,7 +96,7 @@ Search.prototype = Object.assign({}, Navigation, new function() {
       this.current.classList.remove('search-selected');
       next.classList.add('search-selected');
       this.input.setAttribute('aria-activedescendant', next.getAttribute('id'));
-      this.scrollIntoView(next, this.view);
+      this.scrollInElement(next, this.result);
       this.current = next;
       this.input.value = next.firstChild.firstChild.text;
       this.input.select();
@@ -116,5 +116,14 @@ Search.prototype = Object.assign({}, Navigation, new function() {
     });
   }
 
+  this.hide = function() {
+    this.result.setAttribute('aria-expanded', 'false');
+    this.setNavigationActive(false);
+  }
+
+  this.show = function() {
+    this.result.setAttribute('aria-expanded', 'true');
+    this.setNavigationActive(true);
+  }
 });