@yuntijs/ui
Version:
☁️ Yunti UI - an open-source UI component library for building Cloud Native web apps
31 lines • 1.3 kB
JavaScript
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
import { COMMAND_PRIORITY_LOW, KEY_DOWN_COMMAND } from 'lexical';
import { useEffect, useRef } from 'react';
export var OnKeyDownPlugin = function OnKeyDownPlugin(_ref) {
var onKeyDown = _ref.onKeyDown;
var _useLexicalComposerCo = useLexicalComposerContext(),
_useLexicalComposerCo2 = _slicedToArray(_useLexicalComposerCo, 1),
editor = _useLexicalComposerCo2[0];
var onKeyDownRef = useRef(onKeyDown);
useEffect(function () {
onKeyDownRef.current = onKeyDown;
}, [onKeyDown]);
useEffect(function () {
// https://github.com/facebook/lexical/discussions/4464#discussioncomment-5833227
editor.registerCommand(KEY_DOWN_COMMAND, function (event) {
// 这里把 onKeyDown 放在下一次事件循环中触发，是为了避免跟 Lexical 还未结束的输入等事务发生冲突
if (window.queueMicrotask === undefined) {
setTimeout(function () {
onKeyDownRef.current(event);
}, 0);
} else {
queueMicrotask(function () {
onKeyDownRef.current(event);
});
}
return false;
}, COMMAND_PRIORITY_LOW);
}, [editor]);
return null;
};