GitHub/outline
1
0
Fork 0
mirror of https://github.com/outline/outline.git synced 2026-06-13 03:14:59 +03:00
Code Issues Packages Projects Releases Wiki Activity

Trigger hover previews when editor has focus (#12545)

Browse Source 
* fix: Trigger hover previews when editor has focus
This commit is contained in:
Tom Moor
2026-05-31 16:29:56 -04:00
committed by GitHub
parent ad89288eac
commit 991df631ca
1 changed files with 15 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/editor/extensions/HoverPreviews.tsx
+15 -8
View File
@@ -41,10 +41,9 @@ export default class HoverPreviews extends Extension<HoverPreviewsOptions> {
}
get plugins() {
const isHoverTarget = (target: Element | null, view: EditorView) =>
const isHoverTarget = (target: Element | null) =>
target instanceof HTMLElement &&
this.editor.elementRef.current?.contains(target) &&
(!view.editable || (view.editable && !view.hasFocus()));
this.editor.elementRef.current?.contains(target);
let hoveringTimeout: ReturnType<typeof setTimeout>;
@@ -52,11 +51,11 @@ export default class HoverPreviews extends Extension<HoverPreviewsOptions> {
new Plugin({
props: {
handleDOMEvents: {
mouseover: (view: EditorView, event: MouseEvent) => {
mouseover: (_view: EditorView, event: MouseEvent) => {
const target = (event.target as HTMLElement)?.closest(
".use-hover-preview"
);
if (isHoverTarget(target, view)) {
if (isHoverTarget(target)) {
hoveringTimeout = setTimeout(
action(async () => {
const element = target as HTMLElement;
@@ -79,7 +78,15 @@ export default class HoverPreviews extends Extension<HoverPreviewsOptions> {
documentId,
});
if (unfurl) {
// The fetch is async, so the pointer may have already
// left the target (or the node may have been removed) by
// the time it resolves – only show the preview if the
// element is still hovered.
if (
unfurl &&
element.isConnected &&
element.matches(":hover")
) {
this.state.activeLinkElement = element;
this.state.unfurlId = transformedUrl;
} else {
@@ -94,11 +101,11 @@ export default class HoverPreviews extends Extension<HoverPreviewsOptions> {
}
return false;
},
mouseout: action((view: EditorView, event: MouseEvent) => {
mouseout: action((_view: EditorView, event: MouseEvent) => {
const target = (event.target as HTMLElement)?.closest(
".use-hover-preview"
);
if (isHoverTarget(target, view)) {
if (isHoverTarget(target)) {
clearTimeout(hoveringTimeout);
this.state.activeLinkElement = null;
}