diff --git a/README.md b/README.md index 45ed92f..33de4b9 100644 --- a/README.md +++ b/README.md @@ -8,6 +8,7 @@ you can jump back instantly and navigate your graph with confidence.** [![Ask DeepWiki](https://deepwiki.com/badge.svg)](https://deepwiki.com/RoamJS/breadcrumbs) +[![Slack](https://img.shields.io/badge/Slack-%23roam--js-purple)](https://roamresearch.slack.com/archives/C016N2B66JU) ![](https://github.com/user-attachments/assets/bb192b0d-04ad-420f-909d-7dd9be71347c) @@ -16,6 +17,7 @@ you can jump back instantly and navigate your graph with confidence.** - Tracks recently visited pages and block locations - Renders oldest-to-current breadcrumb trail in the top bar - Click any non-current breadcrumb to navigate back +- Shift+click any non-current breadcrumb to open in the right sidebar - Distinguishes pages vs blocks with different styles - Supports Blueprint dark mode (`.bp3-dark`) diff --git a/package-lock.json b/package-lock.json index ba005f0..c3b2a87 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "breadcrumbs", - "version": "1.0.1", + "version": "1.1.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "breadcrumbs", - "version": "1.0.1", + "version": "1.1.0", "hasInstallScript": true, "license": "MIT", "dependencies": { diff --git a/package.json b/package.json index f437d4a..cea7d3e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "breadcrumbs", - "version": "1.0.1", + "version": "1.1.0", "description": "Navigation breadcrumbs for Roam Research.", "main": "index.js", "scripts": { diff --git a/src/index.ts b/src/index.ts index 5ed69b1..4406cad 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,6 @@ import { OnloadArgs } from "roamjs-components/types/native"; import runExtension from "roamjs-components/util/runExtension"; +import openBlockInSidebar from "roamjs-components/writes/openBlockInSidebar"; type LocationType = "page" | "block"; @@ -170,7 +171,7 @@ const truncateText = ({ return `${cleaned.slice(0, maxLength - 1)}...`; }; -const navigateTo = ({ +const openInMainWindow = ({ uid, type, }: { @@ -185,6 +186,23 @@ const navigateTo = ({ window.roamAlphaAPI.ui.mainWindow.openBlock({ block: { uid } }); }; +const navigateTo = ({ + uid, + type, + inSidebar, +}: { + uid: string; + type: LocationType; + inSidebar: boolean; +}): void => { + if (inSidebar) { + openBlockInSidebar(uid); + return; + } + + openInMainWindow({ uid, type }); +}; + const createSeparatorElement = (): HTMLSpanElement => { const separator = document.createElement("span"); separator.className = "breadcrumb-separator"; @@ -213,12 +231,25 @@ const createBreadcrumbElement = ({ }); element.title = stripMarkdown({ text: item.title }); element.style.maxWidth = `${Math.max(truncateLength, 20)}ch`; + element.addEventListener("mousedown", (event: MouseEvent) => { + if (event.shiftKey) { + event.preventDefault(); + } + }); if (!isCurrent) { - element.addEventListener("click", (event) => { + element.addEventListener("click", (event: MouseEvent) => { event.preventDefault(); event.stopPropagation(); - navigateTo({ uid: item.uid, type: item.type }); + if (event.shiftKey) { + // handle shift+click selecting text + window.getSelection()?.removeAllRanges(); + } + navigateTo({ + uid: item.uid, + type: item.type, + inSidebar: event.shiftKey, + }); }); } @@ -358,6 +389,8 @@ const injectStyles = (): void => { white-space: nowrap; text-overflow: ellipsis; max-width: 200px; + user-select: none; + -webkit-user-select: none; } .breadcrumb-item:hover:not(.breadcrumb-current) {