2
0

🐛 (editor) Fix outside click not working in some cases

This commit is contained in:
Baptiste Arnaud
2023-01-26 10:08:33 +01:00
parent 01c9691175
commit 0fc82cf73b
3 changed files with 6 additions and 4 deletions

View File

@ -58,7 +58,7 @@ export const VariableSearchInput = ({
useOutsideClick({ useOutsideClick({
ref: dropdownRef, ref: dropdownRef,
handler: () => onClose, handler: onClose,
}) })
useEffect(() => { useEffect(() => {
@ -189,6 +189,7 @@ export const VariableSearchInput = ({
w="inherit" w="inherit"
shadow="lg" shadow="lg"
onMouseDown={(e) => e.stopPropagation()} onMouseDown={(e) => e.stopPropagation()}
onPointerDown={(e) => e.stopPropagation()}
> >
{isCreateVariableButtonDisplayed && ( {isCreateVariableButtonDisplayed && (
<Button <Button

View File

@ -148,6 +148,9 @@ const TextBubbleEditorContent = ({
rememberedSelection.current = editor.selection rememberedSelection.current = editor.selection
}, },
onKeyDown: handleKeyDown, onKeyDown: handleKeyDown,
onClick: () => {
setIsVariableDropdownOpen(false)
},
}} }}
/> />
{isVariableDropdownOpen && ( {isVariableDropdownOpen && (

View File

@ -6,13 +6,11 @@ type Handler = (event: MouseEvent) => void
type Props<T> = { type Props<T> = {
ref: RefObject<T> ref: RefObject<T>
handler: Handler handler: Handler
mouseEvent?: 'mousedown' | 'mouseup'
} }
export const useOutsideClick = <T extends HTMLElement = HTMLElement>({ export const useOutsideClick = <T extends HTMLElement = HTMLElement>({
ref, ref,
handler, handler,
mouseEvent = 'mousedown',
}: Props<T>): void => { }: Props<T>): void => {
const triggerHandlerIfOutside = (event: MouseEvent) => { const triggerHandlerIfOutside = (event: MouseEvent) => {
const el = ref?.current const el = ref?.current
@ -22,5 +20,5 @@ export const useOutsideClick = <T extends HTMLElement = HTMLElement>({
handler(event) handler(event)
} }
useEventListener(mouseEvent, triggerHandlerIfOutside) useEventListener('pointerdown', triggerHandlerIfOutside)
} }