From 4d2fe517e1130a57aacf3ee514be1bd238600ac2 Mon Sep 17 00:00:00 2001 From: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com> Date: Tue, 28 Jan 2025 00:17:16 +0100 Subject: [PATCH] fix: Side menu scrolling (#1394) --- .../core/src/extensions/SideMenu/SideMenuPlugin.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/packages/core/src/extensions/SideMenu/SideMenuPlugin.ts b/packages/core/src/extensions/SideMenu/SideMenuPlugin.ts index 62a1541c8..4013a8846 100644 --- a/packages/core/src/extensions/SideMenu/SideMenuPlugin.ts +++ b/packages/core/src/extensions/SideMenu/SideMenuPlugin.ts @@ -187,6 +187,11 @@ export class SideMenuView< this.onKeyDown as EventListener, true ); + + // Setting capture=true ensures that any parent container of the editor that + // gets scrolled will trigger the scroll event. Scroll events do not bubble + // and so won't propagate to the document by default. + pmView.root.addEventListener("scroll", this.onScroll, true); } updateState = (state: SideMenuState) => { @@ -473,6 +478,13 @@ export class SideMenuView< return evt; } + onScroll = () => { + if (this.state?.show) { + this.state.referencePos = this.hoveredBlock!.getBoundingClientRect(); + this.emitUpdate(this.state); + } + }; + // Needed in cases where the editor state updates without the mouse cursor // moving, as some state updates can require a side menu update. For example, // adding a button to the side menu which removes the block can cause the @@ -515,6 +527,7 @@ export class SideMenuView< this.onKeyDown as EventListener, true ); + this.pmView.root.removeEventListener("scroll", this.onScroll, true); } }