added NotebookLM link

Author: zsviczian

src/core/settings.ts

@@ -607,6 +607,33 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
     containerEl.addClass("excalidraw-settings");
     this.containerEl.empty();
 
+    // ------------------------------------------------
+    // Search and Settings to Clipboard
+    // ------------------------------------------------
+
+    const search = new ContentSearcher(containerEl);
+    
+
+    const notebookLM = search.getSearchBarWrapper().createDiv("setting-item-description excalidraw-settings-links-container");
+    notebookLM.createEl("a",{
+      href: "https://notebooklm.google.com/notebook/42d76a2f-c11d-4002-9286-1683c43d0ab0",
+      attr: { 
+        "aria-label": t("NOTEBOOKLM_LINK_ARIA"),
+        "style": "margin: auto;"
+      }},
+      (a)=> {
+        //Lucide: message-circle-question-mark
+        a.innerHTML = `<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" class="lucide lucide-message-circle-question-mark-icon lucide-message-circle-question-mark"><path d="M7.9 20A9 9 0 1 0 4 16.1L2 22Z"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"/><path d="M12 17h.01"/></svg>${
+          t("NOTEBOOKLM_LINK_TEXT")
+        }`;
+      }
+    );
+   
+
+    // ------------------------------------------------
+    // Promo links
+    // ------------------------------------------------
+
     const coffeeDiv = containerEl.createDiv("coffee");
     coffeeDiv.addClass("ex-coffee-div");
     const coffeeLink = coffeeDiv.createEl("a", {
@@ -665,13 +692,6 @@ export class ExcalidrawSettingTab extends PluginSettingTab {
       });
     });
 
-    // ------------------------------------------------
-    // Search and Settings to Clipboard
-    // ------------------------------------------------
-
-    const searcher = new ContentSearcher(containerEl);
-    containerEl.prepend(searcher.getSearchBarWrapper());
-
     // ------------------------------------------------
     // Saving
     // ------------------------------------------------  

src/lang/locale/en.ts

@@ -201,6 +201,8 @@ export default {
 
 
   //settings.ts
+  NOTEBOOKLM_LINK_ARIA: "Ask NotebookLM for help about the plugin. This model is pre-loaded with all my video transcripts, release notes and other helpful content. Chat with NotebookLM to explore my 250+ videos and the Excalidraw documentation.",
+  NOTEBOOKLM_LINK_TEXT: "Learn the Plugin. Access the NotebookLM knowledgebase.",
   LINKS_BUGS_ARIA: "Report bugs and raise feature requsts on the plugin's GitHub page",
   LINKS_BUGS: "Report Bugs",
   LINKS_YT_ARIA: "Check out my YouTube channel to learn about Visual Thinking and Excalidraw",

src/shared/Dialogs/ScriptInstallPrompt.ts

@@ -20,8 +20,7 @@ export class ScriptInstallPrompt extends Modal {
     this.contentDiv = document.createElement("div");
     this.contentEl.appendChild(this.contentDiv);
 
-    const searcher = new ContentSearcher(this.contentDiv);
-    this.contentEl.prepend(searcher.getSearchBarWrapper());
+    new ContentSearcher(this.contentDiv);
 
     this.containerEl.classList.add("excalidraw-scriptengine-install");
     try {

src/shared/components/ContentSearcher.ts

@@ -16,6 +16,7 @@ export class ContentSearcher {
     this.contentDiv = contentDiv;
     this.createSearchElements();
     this.setupEventListeners();
+    contentDiv.prepend(this.getSearchBarWrapper());
   }
 
   /**
@@ -239,12 +240,32 @@ export class ContentSearcher {
 
     const nextActiveHighlight = highlights[nextActiveIndex];
     nextActiveHighlight.classList.add("active-highlight");
-    nextActiveHighlight.scrollIntoView({
-      behavior: "smooth",
-      block: "nearest",
-    });
+    
+    // Expand all parent details elements
+    this.expandParentDetails(nextActiveHighlight);
+    
+    // Use setTimeout to ensure DOM has time to update after expanding details
+    setTimeout(() => {
+      nextActiveHighlight.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest",
+      });
+    }, 100);
 
     // Update the hit count
     this.hitCount.textContent = `${nextActiveIndex + 1} / ${highlights.length}`;
   }
+  
+  /**
+   * Expand all parent <details> elements to make the element visible
+   */
+  private expandParentDetails(element: HTMLElement): void {
+    let parent = element.parentElement;
+    while (parent) {
+      if (parent.tagName === "DETAILS") {
+        parent.setAttribute("open", "");
+      }
+      parent = parent.parentElement;
+    }
+  }
 }

styles.css

@@ -622,12 +622,15 @@ textarea.excalidraw-wysiwyg, .excalidraw input {
 }
 
 .excalidraw-settings-links-container {
-  display: flex; /* Align SVG and text horizontally */
-  align-items: center; /* Center SVG and text vertically */
-  text-decoration: none; /* Remove underline from links */
-  color: inherit; /* Inherit text color */
-  text-align: center;
-  gap: 0.3em;
+    align-items: center;
+    color: inherit;
+    display: flex;
+    gap: .3em;
+    text-align: center;
+    text-decoration: none;
+    flex-wrap: wrap;
+    justify-content: center;
+    flex-direction: row;
 }
 
 .excalidraw-settings-links-container a {