joplin-plugin-minimap 1.1.1 → 1.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "joplin-plugin-minimap",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "A hover-to-expand table of contents minimap for the Joplin note viewer",
   "author": "lim0513",
   "homepage": "https://github.com/lim0513/joplin-minimap",

package/publish/manifest.json

@@ -2,7 +2,7 @@
 	"manifest_version": 1,
 	"id": "com.github.joplin-minimap",
 	"app_min_version": "2.8",
-	"version": "1.1.1",
+	"version": "1.1.3",
 	"name": "Joplin Minimap",
 	"description": "A hover-to-expand table of contents minimap for the note viewer. Shows heading tick marks on the right edge; hover to expand into a full ToC, click to jump.",
 	"author": "lim0513",

package/publish/minimap-view.js

@@ -25,6 +25,47 @@
 
 	var cleanup = null; // removes listeners belonging to the current build
 
+	// Clicking the minimap gives the webview focus, which can make Joplin
+	// re-render the whole note. That detaches every heading element we hold,
+	// and scrollIntoView on a detached node is a silent no-op. So jumps are
+	// index/text-based against the LIVE DOM, and if a rebuild happens right
+	// after a click (the re-render case), the jump is re-applied afterwards.
+	var pendingJump = null; // { index, text, until }
+
+	function liveHeadings() {
+		var root = document.getElementById('rendered-md') || document.body;
+		return Array.prototype.slice.call(root.querySelectorAll('h1, h2, h3, h4, h5, h6'));
+	}
+
+	function jumpTo(index, text) {
+		var hs = liveHeadings();
+		var h = hs[index];
+		if (!h || (text && (h.textContent || '').trim() !== text)) {
+			for (var i = 0; i < hs.length; i++) {
+				if ((hs[i].textContent || '').trim() === text) { h = hs[i]; break; }
+			}
+		}
+		if (h && h.isConnected) h.scrollIntoView({ behavior: 'smooth', block: 'start' });
+	}
+
+	// Width of the note viewer's right-edge scrollbar zone. Overlay scrollbars
+	// (e.g. Windows 11) reserve no layout space but still intercept clicks with
+	// priority over page content, so when nothing is measurable we keep a safety
+	// gap anyway. The minimap must stay clear of that zone or clicks on the
+	// rightmost part of the panel silently hit the scrollbar instead.
+	function scrollbarGap(root) {
+		var gap = 0;
+		var node = root;
+		while (node && node !== document.documentElement) {
+			if (node.scrollHeight > node.clientHeight + 1) {
+				var w = node.offsetWidth - node.clientWidth;
+				if (w > gap) gap = w;
+			}
+			node = node.parentElement;
+		}
+		return gap > 0 ? gap : 14;
+	}
+
 	function build() {
 		if (cleanup) { cleanup(); cleanup = null; }
 
@@ -39,12 +80,18 @@
 
 		var nav = document.createElement('nav');
 		nav.id = 'jp-minimap';
-		nav.style.right = settings.rightOffset + 'px';
+		// Applied in BOTH collapsed and expanded states: shifting only on hover
+		// would move the panel out from under the cursor and cause a
+		// hover/unhover flicker loop.
+		nav.style.right = (settings.rightOffset + scrollbarGap(root)) + 'px';
 		nav.style.setProperty('--jp-mm-width', settings.panelWidth + 'px');
 		// The viewer DOM can be editable in some contexts; make sure the
 		// minimap never shows a caret or accepts keyboard input.
+		// NOTE: no preventDefault on mousedown! Blocking the default mouse-focus
+		// path makes Joplin's later programmatic focus count as keyboard-like,
+		// and the browser then draws a :focus-visible ring on the scroll
+		// container. Natural mouse focus never shows a ring.
 		nav.setAttribute('contenteditable', 'false');
-		nav.addEventListener('mousedown', function (e) { e.preventDefault(); });
 		// Own the wheel entirely while the cursor is over the minimap:
 		// scroll the ToC list ourselves and never let the event chain
 		// through to the note underneath (scroll chaining feels erratic).
@@ -56,7 +103,7 @@
 		var list = document.createElement('div');
 		list.className = 'jp-mm-list';
 
-		var items = headings.map(function (h) {
+		var items = headings.map(function (h, index) {
 			var level = Number(h.tagName.charAt(1));
 
 			// NOT an <a>: Joplin's viewer shows a "Ctrl+click to open" tooltip
@@ -74,8 +121,17 @@
 			item.appendChild(bar);
 			item.appendChild(label);
 
-			item.addEventListener('click', function () {
-				h.scrollIntoView({ behavior: 'smooth', block: 'start' });
+			// MOUSEDOWN, not click: the press gives the webview focus, Joplin may
+			// re-render the note, and our panel gets rebuilt BETWEEN mousedown and
+			// mouseup - so the click event (which needs the same target for both)
+			// never fires. mousedown runs before any of that can happen.
+			item.addEventListener('mousedown', function (e) {
+				if (e.button !== 0) return;
+				var text = (label.textContent || '').trim();
+				// If the press triggers a note re-render, the rebuild will
+				// re-apply this jump against the fresh DOM.
+				pendingJump = { index: index, text: text, until: Date.now() + 1200 };
+				jumpTo(index, text);
 			});
 
 			list.appendChild(item);
@@ -98,6 +154,13 @@
 		document.addEventListener('scroll', updateActive, { passive: true, capture: true });
 		updateActive();
 
+		// A rebuild arriving right after a click means the note was re-rendered
+		// and the original scrollIntoView hit a detached node - redo the jump.
+		if (pendingJump && Date.now() < pendingJump.until) {
+			jumpTo(pendingJump.index, pendingJump.text);
+			pendingJump = null;
+		}
+
 		cleanup = function () {
 			document.removeEventListener('scroll', updateActive, { capture: true });
 		};

package/publish/minimap.css

@@ -103,12 +103,11 @@
 	background: rgba(127, 127, 127, 0.18);
 }
 
-/* slim scrollbar in the expanded panel */
-.jp-mm-list::-webkit-scrollbar { width: 4px; }
-.jp-mm-list::-webkit-scrollbar-thumb {
-	background: rgba(127, 127, 127, 0.4);
-	border-radius: 2px;
-}
+/* No scrollbar in the expanded panel: the wheel handler owns scrolling,
+ * and a visible scrollbar at the panel edge invites overlay-scrollbar
+ * style hover/click interference. */
+.jp-mm-list::-webkit-scrollbar { display: none; }
+.jp-mm-list { scrollbar-width: none; }
 
 /* don't show over printed/exported output */
 @media print {