1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
| import type { FC } from 'react'
| import { useEffect, useRef } from 'react'
| import {
| BLUR_COMMAND,
| COMMAND_PRIORITY_EDITOR,
| FOCUS_COMMAND,
| KEY_ESCAPE_COMMAND,
| } from 'lexical'
| import { mergeRegister } from '@lexical/utils'
| import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'
| import { CLEAR_HIDE_MENU_TIMEOUT } from './workflow-variable-block'
|
| type OnBlurBlockProps = {
| onBlur?: () => void
| onFocus?: () => void
| }
| const OnBlurBlock: FC<OnBlurBlockProps> = ({
| onBlur,
| onFocus,
| }) => {
| const [editor] = useLexicalComposerContext()
|
| const ref = useRef<any>(null)
|
| useEffect(() => {
| return mergeRegister(
| editor.registerCommand(
| CLEAR_HIDE_MENU_TIMEOUT,
| () => {
| if (ref.current) {
| clearTimeout(ref.current)
| ref.current = null
| }
| return true
| },
| COMMAND_PRIORITY_EDITOR,
| ),
| editor.registerCommand(
| BLUR_COMMAND,
| () => {
| ref.current = setTimeout(() => {
| editor.dispatchCommand(KEY_ESCAPE_COMMAND, new KeyboardEvent('keydown', { key: 'Escape' }))
| }, 200)
|
| if (onBlur)
| onBlur()
|
| return true
| },
| COMMAND_PRIORITY_EDITOR,
| ),
| editor.registerCommand(
| FOCUS_COMMAND,
| () => {
| if (onFocus)
| onFocus()
| return true
| },
| COMMAND_PRIORITY_EDITOR,
| ),
| )
| }, [editor, onBlur, onFocus])
|
| return null
| }
|
| export default OnBlurBlock
|
|
