kash-shell 0.3.18__py3-none-any.whl → 0.3.21__py3-none-any.whl

kash/utils/text_handling/escape_html_tags.py

@@ -1,8 +1,13 @@
 import re
 from collections.abc import Set
 
-HTML_IN_MD_TAGS = frozenset(["div", "span", "sup", "sub", "br", "details", "summary"])
-"""These are tags that have reasonable usage in Markdown so typically would be preserved."""
+HTML_IN_MD_TAGS = frozenset(
+    ["div", "span", "i", "b", "em", "sup", "sub", "br", "details", "summary"]
+)
+"""
+These are tags that have reasonable usage in Markdown so typically would be preserved.
+Note we want `<i>` because it's used for icons like `<i data-feather="list"></i>`.
+"""
 
 ALLOWED_BARE_PROTOS = frozenset(["http://", "https://", "file://"])
 
@@ -68,7 +73,7 @@ def escape_html_tags(
 def test_escape_html_tags():
     """Tests the escape_html_tags function with various cases."""
 
-    # 1. Basic Whitelist Check (Default)
+    # Basic Whitelist Check (Default)
     assert escape_html_tags("<div>Test</div>") == "<div>Test</div>"
     assert escape_html_tags("<span>Test</span>") == "<span>Test</span>"
     assert escape_html_tags("<br>") == "<br>"
@@ -77,21 +82,21 @@ def test_escape_html_tags():
         == "<details><summary>Sum</summary>Det</details>"
     )
 
-    # 2. Basic Escape Check
+    # Basic Escape Check
     assert escape_html_tags("<p>Test</p>") == "&lt;p>Test&lt;/p>"
     assert escape_html_tags("<script>alert('x');</script>") == "&lt;script>alert('x');&lt;/script>"
     assert escape_html_tags("<img>") == "&lt;img>"
 
-    # 3. Case Insensitivity
+    # Case Insensitivity
     assert escape_html_tags("<DiV>Case</DiV>") == "<DiV>Case</DiV>"  # Whitelisted
     assert escape_html_tags("<P>Test</P>") == "&lt;P>Test&lt;/P>"  # Escaped
 
-    # 4. Self-closing tags
+    # Self-closing tags
     assert escape_html_tags("<br/>") == "<br/>"  # Whitelisted
     assert escape_html_tags("<br />") == "<br />"  # Whitelisted
     assert escape_html_tags("<img/>") == "&lt;img/>"  # Escaped
 
-    # 5. Tags with Attributes
+    # Tags with Attributes
     assert (
         escape_html_tags('<div class="foo">Test</div>') == '<div class="foo">Test</div>'
     )  # Whitelisted
@@ -102,7 +107,7 @@ def test_escape_html_tags():
     assert escape_html_tags('<p class="foo">Test</p>') == '&lt;p class="foo">Test&lt;/p>'  # Escaped
     assert escape_html_tags('<img src="a.jpg"/>') == '&lt;img src="a.jpg"/>'  # Escaped
 
-    # 6. Markdown URL Handling
+    # Markdown URL Handling
     url_md = "Check <https://example.com> and <http://test.org/path>"
     assert escape_html_tags(url_md, allow_bare_md_urls=True) == url_md
     assert (
@@ -127,7 +132,7 @@ def test_escape_html_tags():
         == "&lt;/https://example.com>"
     )  # Closing URL-like is escaped
 
-    # 7. Nested/Malformed '<' and Edge Cases
+    # Nested/Malformed '<' and Edge Cases
     assert escape_html_tags("<<script>>") == "&lt;&lt;script>>"  # Escaped non-tag <
     assert escape_html_tags("<div><p>nested</p></div>") == "<div>&lt;p>nested&lt;/p></div>"
     assert escape_html_tags("<div<span") == "&lt;div&lt;span"  # Incomplete tags are escaped
@@ -140,7 +145,7 @@ def test_escape_html_tags():
     assert escape_html_tags("< >") == "&lt; >"
     assert escape_html_tags("< / div >") == "< / div >"  # Whitelisted closing tag with spaces
 
-    # 8. Mixed Content Combination
+    # Mixed Content Combination
     complex_html = "<DiV class='A'>Hello <Br/> <p>World</p> <https://link.com> </DiV>"
     expected_complex_allowed = (
         "<DiV class='A'>Hello <Br/> &lt;p>World&lt;/p> <https://link.com> </DiV>"
@@ -151,6 +156,6 @@ def test_escape_html_tags():
     assert escape_html_tags(complex_html, allow_bare_md_urls=True) == expected_complex_allowed
     assert escape_html_tags(complex_html, allow_bare_md_urls=False) == expected_complex_disallowed
 
-    # 9. Empty/No Tags
+    # Empty/No Tags
     assert escape_html_tags("") == ""
     assert escape_html_tags("Just plain text, no tags.") == "Just plain text, no tags."

kash/utils/text_handling/markdown_render.py

@@ -33,6 +33,7 @@ MARKO_GFM = marko.Markdown(
 
 
 FOOTNOTE_UP_ARROW = " ↑ "
+FOOTNOTE_DOWN_ARROW = " ↓ "
 
 
 def html_postprocess(html: str) -> str:

kash/web_content/web_extract.py

@@ -1,38 +1,57 @@
 from funlog import log_calls
 
 from kash.utils.common.url import Url
+from kash.utils.file_utils.file_formats_model import file_format_info
 from kash.web_content.canon_url import thumbnail_url
 from kash.web_content.file_cache_utils import cache_file
 from kash.web_content.web_extract_justext import extract_text_justext
-from kash.web_content.web_fetch import fetch_url
 from kash.web_content.web_page_model import PageExtractor, WebPageData
 
 
 @log_calls(level="message")
-def fetch_extract(
+def fetch_page_content(
     url: Url,
+    *,
     refetch: bool = False,
-    use_cache: bool = True,
-    extractor: PageExtractor = extract_text_justext,
+    cache: bool = True,
+    text_extractor: PageExtractor = extract_text_justext,
 ) -> WebPageData:
     """
     Fetches a URL and extracts the title, description, and content.
-    By default, uses the content cache if available. Can force re-fetching and
-    updating the cache by setting `refetch` to true.
+    Always uses the content cache, at least temporarily.
+
+    Force re-fetching and updating the cache by setting `refetch` to true.
+    Cached file path is returned in the content, unless `cache` is false,
+    in case the cached content is deleted.
+
+    For HTML and other text files, uses the `text_extractor` to extract
+    clean text and page metadata.
     """
     expiration_sec = 0 if refetch else None
-    if use_cache:
-        path = cache_file(url, expiration_sec=expiration_sec).content.path
-        with open(path, "rb") as file:
-            content = file.read()
-        page_data = extractor(url, content)
+
+    path = cache_file(url, expiration_sec=expiration_sec).content.path
+    format_info = file_format_info(path)
+
+    content = None
+    if format_info.format and format_info.format.is_text:
+        content = path.read_bytes()
+        page_data = text_extractor(url, content)
     else:
-        response = fetch_url(url)
-        page_data = extractor(url, response.content)
+        page_data = WebPageData(url)
 
-    # Add a thumbnail, if available.
+    # Add file format info (for both HTML/text and all other file types).
+
+    page_data.format_info = format_info
+
+    # Add a thumbnail, if known for this URL.
     page_data.thumbnail_url = thumbnail_url(url)
 
+    # Return the local cache path if we will be keeping it.
+    if cache:
+        page_data.saved_content = path
+    else:
+        path.unlink()
+
     return page_data
 
 
@@ -53,5 +72,5 @@ if __name__ == "__main__":
 
     for url in sample_urls:
         print(f"URL: {url}")
-        print(fetch_extract(Url(url)))
+        print(fetch_page_content(Url(url)))
         print()

kash/web_content/web_page_model.py

@@ -5,12 +5,19 @@ from prettyfmt import abbrev_obj
 from pydantic.dataclasses import dataclass
 
 from kash.utils.common.url import Url
+from kash.utils.file_utils.file_formats_model import FileFormatInfo
 
 
 @dataclass
 class WebPageData:
     """
-    Data about a web page, including URL, title and optionally description and extracted content.
+    Data about a web page, including URL, title and optionally description and
+    extracted content.
+
+    The `text` field should be a clean text version of the page, if available.
+    The `clean_html` field should be a clean HTML version of the page, if available.
+    The `saved_content` is optional but can be used to reference the original content,
+    especially for large or non-text content.
     """
 
     locator: Url | Path
@@ -19,6 +26,8 @@ class WebPageData:
     description: str | None = None
     text: str | None = None
     clean_html: str | None = None
+    saved_content: Path | None = None
+    format_info: FileFormatInfo | None = None
     thumbnail_url: Url | None = None
 
     def __repr__(self):

kash/web_gen/templates/base_styles.css.jinja

@@ -5,7 +5,7 @@
   --font-sans: "Source Sans 3 Variable", sans-serif, "Hack Nerd Font";
   --font-serif: "PT Serif", serif, "Hack Nerd Font";
   /* Source Sans 3 Variable better at these weights. */
-  --font-weight-sans-medium: 565;
+  --font-weight-sans-medium: 550;
   --font-weight-sans-bold: 650;
   --font-mono: "Hack Nerd Font", "Menlo", "DejaVu Sans Mono", Consolas, "Lucida Console", monospace;
 
@@ -156,7 +156,13 @@ h4 {
   margin-bottom: 0.7rem;
 }
 
-h5, h6 {
+h5 {
+  font-size: 1rem;
+  margin-top: 0.7rem;
+  margin-bottom: 0.5rem;
+}
+
+h6 {
   font-size: 1rem;
   margin-top: 0.7rem;
   margin-bottom: 0.5rem;
@@ -368,15 +374,15 @@ hr:before {
 
 .long-text h3 {
   font-family: var(--font-sans);
-  font-weight: 565;
+  font-weight: 550;
   text-transform: uppercase;
   letter-spacing: 0.025em;
 }
 
 .long-text h4 {
-  font-family: var(--font-sans);
-  font-weight: 650;
-  letter-spacing: 0.02em;
+  font-family: var(--font-serif);
+  font-weight: 400;
+  font-style: italic;
 }
 
 .long-text h5 {
@@ -435,6 +441,10 @@ hr:before {
 {% endblock long_text_styles %}
 
 {% block table_styles %}
+table, th, td, tbody tr {
+  transition: background-color 0.4s ease-in-out, border-color 0.4s ease-in-out;
+}
+
 table {
   font-family: var(--font-sans);
   font-size: var(--font-size-small);
@@ -453,6 +463,7 @@ th {
   letter-spacing: 0.03em;
   border-bottom: 1px solid var(--color-border-hint);
   line-height: 1.2;
+  background-color: var(--color-bg-alt-solid);
 }
 
 th, td {
@@ -461,10 +472,6 @@ th, td {
   min-width: 6rem;
 }
 
-th {
-  background-color: var(--color-bg-alt-solid);
-}
-
 tbody tr:nth-child(even) {
   background-color: var(--color-bg-alt-solid); 
 }
@@ -480,7 +487,12 @@ tbody tr:nth-child(even) {
   transform: translateX(-50%);
   /* Prevent container from expanding beyond its content area */
   overflow-x: auto;
-  overflow-y: visible;
+  overflow-y: hidden; /* Whole height of table shown, no vertical scrolling. */
+}
+
+.table-container table {
+  /* Tricky: Need this to prevent bogus extra horizontal scroll while keeping normal sizing */
+  contain: content;
 }
 
 /* When TOC is present, simplify table container positioning */
@@ -540,7 +552,6 @@ sup {
     width: calc(100vw - 6rem);
     /* Ensure container doesn't expand beyond its width */
     max-width: calc(100vw - 6rem);
-    contain: layout inline-size;
   }
   
   /* Apply shadow to long-text containers on larger screens */
@@ -590,8 +601,6 @@ sup {
     
     /* Ensure horizontal scroll works properly without expanding container */
     overflow-x: auto;
-    overflow-y: visible;
-    contain: layout inline-size;
   }
   
   .content-with-toc.has-toc table {
@@ -634,20 +643,17 @@ sup {
   
   /* Make table containers scrollable without affecting page layout */
   .table-container {
-    width: calc(100vw - 3rem);  /* Fixed width instead of max-width */
-    max-width: calc(100vw - 3rem);
     overflow-x: auto;
-    overflow-y: visible;  /* Ensure vertical overflow is not hidden */
     transform: none;
     left: 0;
     position: relative;
     margin-left: auto;
-    margin-right: auto;
+    margin-right: 0; /* Extend to right edge */
     /* Prevent container from expanding beyond its width */
     box-sizing: border-box;
-    contain: layout inline-size;  /* CSS containment to prevent width expansion */
+    width: calc(100vw - 1.5rem); /* Full width minus left margin */
   }
-  
+
   table {
     font-size: var(--font-size-smaller);
     /* Tables can be wider than container on mobile */

kash/web_gen/templates/components/toc_styles.css.jinja

@@ -6,7 +6,7 @@
 
 @media (min-width: 1536px) {
   :root {
-    --toc-width: min(21vw, 30rem);
+    --toc-width: min(21vw, 26rem);
   }
 }
 

kash/web_gen/templates/components/tooltip_scripts.js.jinja

@@ -7,8 +7,8 @@ const TOOLTIP_CONFIG = {
   // Timing delays (in milliseconds)
   delays: {
     show: 500,           // Delay before showing tooltip
-    hide: 1500,          // Default delay before hiding tooltip
-    hideWideRight: 2000, // Delay for wide-right tooltips (farther away)
+    hide: 2500,          // Default delay before hiding tooltip
+    hideWideRight: 4000, // Delay for wide-right tooltips (farther away)
     hideMovingToward: 500, // Shorter delay when mouse moving toward tooltip
     hideLinkClick: 300,  // Delay after clicking a link in tooltip
   },
@@ -79,6 +79,14 @@ const TooltipUtils = {
     return this.extractContent(element, true);
   },
   
+  // Add footnote navigation button to tooltip content
+  addFootnoteNavigationButton(content, footnoteId) {
+    const navButton = `<span class="footnote-nav-container">
+      <a href="#${footnoteId}" class="footnote" data-footnote-id="${footnoteId}" title="Go to footnote">&nbsp;↓&nbsp;</a>
+    </span>`;
+    return content + navButton;
+  },
+  
   // Determine optimal tooltip position based on element location and screen size
   getOptimalPosition(element) {
     const viewportWidth = window.innerWidth;
@@ -106,6 +114,69 @@ const TooltipUtils = {
   }
 };
 
+/* -----------------------------------------------------------------------------
+   Mobile tap-outside-to-close functionality
+   ----------------------------------------------------------------------------- */
+
+// Mobile interaction manager
+const MobileInteractionManager = {
+  isActive: false,
+  
+  // Initialize mobile interaction handling
+  init() {
+    if (this.isActive) return;
+    
+    // Only activate on mobile screens
+    if (window.innerWidth <= TOOLTIP_CONFIG.breakpoints.mobile) {
+      this.activate();
+    }
+    
+    // Listen for resize events to activate/deactivate
+    window.addEventListener('resize', () => {
+      if (window.innerWidth <= TOOLTIP_CONFIG.breakpoints.mobile) {
+        this.activate();
+      } else {
+        this.deactivate();
+      }
+    });
+  },
+  
+  // Activate mobile interaction handling
+  activate() {
+    if (this.isActive) return;
+    this.isActive = true;
+    document.addEventListener('touchstart', this.handleTouchStart.bind(this), { passive: true });
+    console.debug('Mobile interaction manager activated');
+  },
+  
+  // Deactivate mobile interaction handling
+  deactivate() {
+    if (!this.isActive) return;
+    this.isActive = false;
+    document.removeEventListener('touchstart', this.handleTouchStart.bind(this));
+    console.debug('Mobile interaction manager deactivated');
+  },
+  
+  // Handle touch start events
+  handleTouchStart(event) {
+    // Check if any tooltip is visible
+    const hasVisibleTooltips = Array.from(TooltipManager.activeTooltips.values())
+      .some(state => state.isVisible);
+    
+    if (!hasVisibleTooltips) return;
+    
+    // Check if touch is outside all tooltips
+    const touchedElement = event.target;
+    const isInsideTooltip = touchedElement.closest('.tooltip-element');
+    const isTooltipTrigger = touchedElement.closest('[data-tooltip-trigger]');
+    
+    if (!isInsideTooltip && !isTooltipTrigger) {
+      // Close all tooltips
+      TooltipManager.closeAllTooltips();
+    }
+  }
+};
+
 /* -----------------------------------------------------------------------------
    Generic tooltip creation and management functions
    ----------------------------------------------------------------------------- */
@@ -115,7 +186,7 @@ const TooltipManager = {
   activeTooltips: new Map(), // Track active tooltip states
   
   // Add tooltip to any element with HTML content
-  addTooltip(element, htmlContent, position = 'auto') {
+  addTooltip(element, htmlContent, position = 'auto', options = {}) {
     if (!element || !htmlContent) return;
     
     // Check if tooltip already exists for this element
@@ -128,7 +199,7 @@ const TooltipManager = {
       TooltipUtils.getOptimalPosition(element) : position;
     
     // Create real DOM tooltip element
-    const tooltipElement = this.createTooltipElement(htmlContent, actualPosition);
+    const tooltipElement = this.createTooltipElement(htmlContent, actualPosition, options);
     
     // Mark the trigger element
     element.setAttribute('data-tooltip-trigger', 'true');
@@ -147,29 +218,62 @@ const TooltipManager = {
     }
     
     // Set up enhanced hover behavior
-    this.setupAdvancedHover(element, tooltipElement, actualPosition);
+    this.setupAdvancedHover(element, tooltipElement, actualPosition, options);
   },
   
   // Create a real DOM tooltip element
-  createTooltipElement(htmlContent, position) {
+  createTooltipElement(htmlContent, position, options = {}) {
     const tooltip = document.createElement('div');
     tooltip.className = `tooltip-element tooltip-${position}`;
     
     // Add footnote-specific class if content contains footnote or links
-    if (htmlContent.includes('footnote') || htmlContent.includes('<a')) {
+    if (htmlContent.includes('footnote') || htmlContent.includes('<a') || options.isFootnote) {
       tooltip.classList.add('footnote-element');
     }
     
     tooltip.innerHTML = htmlContent;
+    
+    // Set up footnote navigation button if present
+    if (options.isFootnote) {
+      this.setupFootnoteNavigation(tooltip, options.footnoteId);
+    }
+    
     return tooltip;
   },
   
+  // Set up footnote navigation link functionality
+  setupFootnoteNavigation(tooltipElement, footnoteId) {
+    const navLink = tooltipElement.querySelector('.footnote-nav-container .footnote');
+    if (navLink) {
+      navLink.addEventListener('click', (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        
+        // Navigate to the footnote
+        const footnoteElement = document.getElementById(footnoteId);
+        if (footnoteElement) {
+          footnoteElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
+          
+          // Close tooltip after navigation
+          setTimeout(() => {
+            const tooltipState = Array.from(this.activeTooltips.values())
+              .find(state => state.tooltipElement === tooltipElement);
+            if (tooltipState) {
+              this.hideTooltip(tooltipState);
+            }
+          }, TOOLTIP_CONFIG.delays.hideLinkClick);
+        }
+      });
+    }
+  },
+  
   // Set up advanced hover behavior with delays and mouse tracking
-  setupAdvancedHover(triggerElement, tooltipElement, position) {
+  setupAdvancedHover(triggerElement, tooltipElement, position, options = {}) {
     const tooltipState = {
       triggerElement,
       tooltipElement,
       position,
+      options,
       showTimeout: null,
       hideTimeout: null,
       isVisible: false
@@ -181,6 +285,7 @@ const TooltipManager = {
     const handlers = {
       triggerEnter: (e) => this.handleTriggerEnter(tooltipState, e),
       triggerLeave: (e) => this.handleTriggerLeave(tooltipState, e),
+      triggerTouch: (e) => this.handleTriggerTouch(tooltipState, e),
       tooltipEnter: () => this.handleTooltipEnter(tooltipState),
       tooltipLeave: () => this.handleTooltipLeave(tooltipState),
       tooltipClick: (e) => this.handleTooltipClick(tooltipState, e)
@@ -189,6 +294,7 @@ const TooltipManager = {
     // Add event listeners
     triggerElement.addEventListener('mouseenter', handlers.triggerEnter);
     triggerElement.addEventListener('mouseleave', handlers.triggerLeave);
+    triggerElement.addEventListener('touchstart', handlers.triggerTouch, { passive: false });
     tooltipElement.addEventListener('mouseenter', handlers.tooltipEnter);
     tooltipElement.addEventListener('mouseleave', handlers.tooltipLeave);
     tooltipElement.addEventListener('click', handlers.tooltipClick);
@@ -197,6 +303,7 @@ const TooltipManager = {
     tooltipState.cleanupListeners = () => {
       triggerElement.removeEventListener('mouseenter', handlers.triggerEnter);
       triggerElement.removeEventListener('mouseleave', handlers.triggerLeave);
+      triggerElement.removeEventListener('touchstart', handlers.triggerTouch);
       tooltipElement.removeEventListener('mouseenter', handlers.tooltipEnter);
       tooltipElement.removeEventListener('mouseleave', handlers.tooltipLeave);
       tooltipElement.removeEventListener('click', handlers.tooltipClick);
@@ -228,6 +335,26 @@ const TooltipManager = {
     }
   },
   
+  // Handle touch events on trigger elements (mobile)
+  handleTriggerTouch(tooltipState, event) {
+    // Prevent default to avoid triggering mouse events and navigation
+    event.preventDefault();
+    event.stopPropagation();
+    
+    // If tooltip is already visible, hide it
+    if (tooltipState.isVisible) {
+      this.hideTooltip(tooltipState);
+      return;
+    }
+    
+    // Cancel any pending timers
+    this.clearTimeout(tooltipState, 'hideTimeout');
+    this.clearTimeout(tooltipState, 'showTimeout');
+    
+    // Show tooltip immediately on touch (no delay like hover)
+    this.showTooltip(tooltipState, event);
+  },
+  
   // Handle tooltip mouse enter
   handleTooltipEnter(tooltipState) {
     this.clearTimeout(tooltipState, 'hideTimeout');
@@ -242,14 +369,17 @@ const TooltipManager = {
   
   // Handle clicks within tooltip
   handleTooltipClick(tooltipState, event) {
-    // Allow clicks on links within tooltips
-    if (event.target.tagName === 'A') {
+    // Allow clicks on all links and buttons within tooltips
+    if (event.target.tagName === 'A' || event.target.tagName === 'BUTTON' || 
+        event.target.closest('a') || event.target.closest('button')) {
       event.stopPropagation();
-      // Keep tooltip open briefly after clicking a link
-      this.clearTimeout(tooltipState, 'hideTimeout');
-      tooltipState.hideTimeout = setTimeout(() => {
-        this.hideTooltip(tooltipState);
-      }, TOOLTIP_CONFIG.delays.hideLinkClick);
+      // Keep tooltip open briefly after clicking a link (except footnote nav link)
+      if (!event.target.closest('.footnote-nav-container')) {
+        this.clearTimeout(tooltipState, 'hideTimeout');
+        tooltipState.hideTimeout = setTimeout(() => {
+          this.hideTooltip(tooltipState);
+        }, TOOLTIP_CONFIG.delays.hideLinkClick);
+      }
     }
   },
   
@@ -632,8 +762,9 @@ const TooltipManager = {
       
       if (shouldBeWideRight !== isWideRight) {
         const htmlContent = tooltipState.tooltipElement.innerHTML;
+        const options = tooltipState.options;
         this.removeTooltip(element);
-        this.addTooltip(element, htmlContent, 'auto');
+        this.addTooltip(element, htmlContent, 'auto', options);
       }
     });
   }
@@ -667,6 +798,18 @@ function initFootnoteTooltips() {
         return;
       }
       
+      // Prevent default action immediately for all footnote reference links
+      refLink.addEventListener('click', (e) => {
+        e.preventDefault();
+        return false;
+      });
+      
+      // Also prevent default on touch events for mobile
+      refLink.addEventListener('touchend', (e) => {
+        e.preventDefault();
+        return false;
+      });
+      
       // Extract and validate content
       const footnoteHtml = TooltipUtils.extractHtmlContent(footnoteElement);
       const footnoteText = TooltipUtils.extractTextContent(footnoteElement);
@@ -677,10 +820,16 @@ function initFootnoteTooltips() {
       }
       
       // Truncate if needed
-      const displayContent = truncateFootnoteContent(footnoteHtml, footnoteText);
+      let displayContent = truncateFootnoteContent(footnoteHtml, footnoteText);
       
-      // Add tooltip
-      TooltipManager.addTooltip(refLink, displayContent, 'auto');
+      // Add footnote navigation button
+      displayContent = TooltipUtils.addFootnoteNavigationButton(displayContent, footnoteId);
+      
+      // Add tooltip with footnote options
+      TooltipManager.addTooltip(refLink, displayContent, 'auto', {
+        isFootnote: true,
+        footnoteId: footnoteId
+      });
       tooltipsAdded++;
       
       console.debug(`Added tooltip for footnote ${footnoteId}: "${footnoteText.substring(0, 50)}..."`);
@@ -715,6 +864,9 @@ function initTooltips() {
   console.debug('Starting tooltip initialization...');
   
   try {
+    // Initialize mobile interaction manager
+    MobileInteractionManager.init();
+    
     const footnoteCount = initFootnoteTooltips();
     console.debug(`Tooltip initialization complete. Total footnote tooltips: ${footnoteCount}`);
   } catch (error) {