diff --git a/src/core/islands/Panel.mjs b/src/core/islands/Panel.mjs index 93382f3..8a98bed 100644 --- a/src/core/islands/Panel.mjs +++ b/src/core/islands/Panel.mjs @@ -280,13 +280,17 @@ function Panel({ // hovering over the peek trigger will temporarily // pop out an interactive preview of the panel - let _peekDebounce; - const $peekTrigger = html`
`; - $panel.prepend($peekTrigger); + >`; + modDatabase(coreId).then(async (db) => { + _peekPanelOnHover = await db.get("peekPanelOnHover"); + if (_peekPanelOnHover) $panel.prepend($peekTrigger); + }); $panel.addEventListener("mouseout", () => { if (isDragging() || isAnimated() || isPinned()) return; if (!$panel.matches(":hover")) $panel.close(); @@ -331,6 +335,7 @@ function Panel({ $panel.resize(); }; $panel.peek = () => { + if (!_peekPanelOnHover) return; if (isPeeked() || !panelViews.length) return; if (isClosed()) Object.assign(animationState, peekAnimation); animatePanel({ ...openWidth, ...peekAnimation }); @@ -353,7 +358,7 @@ function Panel({ // only animate container close if it is actually taking up space, // otherwise will unnaturally grow + retrigger peek on peek mouseout if (isPinned()) animate($panel, [{ width }, closedWidth]); - if (!$panel.matches(":hover")) { + if (!$panel.matches(":hover") || !_peekPanelOnHover) { $panel.removeAttribute("data-pinned"); $panel.removeAttribute("data-peeked"); animatePanel(closedWidth); diff --git a/src/core/mod.json b/src/core/mod.json index acb0fc2..ceb9010 100644 --- a/src/core/mod.json +++ b/src/core/mod.json @@ -50,6 +50,12 @@ "description": "Sets whether the notion-enhancer icon added to Notion's sidebar should be coloured or monochrome. The latter style will match the theme's icon colour for users who would like the icon to be less noticeable.", "values": ["Colour", "Monochrome"] }, + { + "type": "toggle", + "key": "peekPanelOnHover", + "description": "Pops the side panel out to preview its content when hovering near the right edge of the window, in the same way that Notion's left-hand sidebar will slide out on hover. Disable this if you prefer to view the panel only by pinning it.", + "value": true + }, { "type": "heading", "label": "Experimental" }, { "type": "toggle",