Fixes #98

web/cm_plugins/markdown_widget.ts

@@ -6,6 +6,7 @@ import { resolveAttachmentPath } from "$sb/lib/resolve.ts";
 import { parse } from "../../common/markdown_parser/parse_tree.ts";
 import { parsePageRef } from "$sb/lib/page.ts";
 import { extendedMarkdownLanguage } from "../../common/markdown_parser/parser.ts";
+import { tagPrefix } from "../../plugs/index/constants.ts";
 
 const activeWidgets = new Set<MarkdownWidget>();
 
@@ -157,6 +158,24 @@ export class MarkdownWidget extends WidgetType {
       });
     });
 
+    // Attach click handlers to hash tags
+    div.querySelectorAll("span.hashtag").forEach((el_) => {
+      const el = el_ as HTMLElement;
+      // Override default click behavior with a local navigate (faster)
+      console.log("Found hashtag", el.innerText);
+      el.addEventListener("click", (e) => {
+        console.log("Hashtag clicked", el.innerText);
+        if (e.ctrlKey || e.metaKey) {
+          // Don't do anything special for ctrl/meta clicks
+          return;
+        }
+        this.client.navigate({
+          page: `${tagPrefix}${el.innerText.slice(1)}`,
+          pos: 0,
+        });
+      });
+    });
+
     div.querySelectorAll("button[data-onclick]").forEach((el_) => {
       const el = el_ as HTMLElement;
       const onclick = el.dataset.onclick!;

web/styles/colors.scss

@@ -177,6 +177,7 @@
     color: var(--editor-hashtag-color);
     background-color: var(--editor-hashtag-background-color);
     border: 1px solid var(--editor-hashtag-border-color);
+    cursor: pointer;
   }
 
   .sb-line-hr {