Skip to content

Commit bb043a3

Browse files
authored
fix: prevent formatting toolbar from closing if click was from inside the editor (#1775)
1 parent 3fb8b7b commit bb043a3

File tree

1 file changed

+18
-0
lines changed

1 file changed

+18
-0
lines changed

packages/react/src/components/FormattingToolbar/FormattingToolbarController.tsx

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {
55
StyleSchema,
66
} from "@blocknote/core";
77
import { UseFloatingOptions, flip, offset, shift } from "@floating-ui/react";
8+
import { isEventTargetWithin } from "@floating-ui/react/utils";
89
import { FC, useMemo, useRef, useState } from "react";
910

1011
import { useBlockNoteEditor } from "../../hooks/useBlockNoteEditor.js";
@@ -88,6 +89,23 @@ export const FormattingToolbarController = (props: {
8889
editor.focus();
8990
}
9091
},
92+
canDismiss: {
93+
enabled: true,
94+
escapeKey: true,
95+
outsidePress: (e) => {
96+
const view = editor._tiptapEditor?.view;
97+
if (!view) {
98+
return false;
99+
}
100+
101+
const target = e.target;
102+
if (!target) {
103+
return false;
104+
}
105+
106+
return !isEventTargetWithin(e, view.dom.parentElement);
107+
},
108+
},
91109
...props.floatingOptions,
92110
},
93111
);

0 commit comments

Comments
 (0)