* add commands hook * add commands in editor * add command auto complete menu * add commands in room input * remove old reply code from room input * fix video component css * do not auto focus input on android or ios * fix crash on enable block after selection * fix circular deps in editor * fix autocomplete return focus move editor cursor * remove unwanted keydown from room input * fix emoji alignment in editor * test ipad user agent * refactor isAndroidOrIOS to mobileOrTablet * update slate & slate-react * downgrade slate-react to 0.98.4 0.99.0 has breaking changes with ReactEditor.focus * add sql to readable ext mimetype * fix empty editor formatting gets saved as draft * add option to use enter for newline * remove empty msg draft from atom family * prevent msg ctx menu from open on text selection
63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
import { isHotkey } from 'is-hotkey';
|
|
import { KeyboardEvent } from 'react';
|
|
import { Editor } from 'slate';
|
|
import { isAnyMarkActive, isBlockActive, removeAllMark, toggleBlock, toggleMark } from './utils';
|
|
import { BlockType, MarkType } from './types';
|
|
|
|
export const INLINE_HOTKEYS: Record<string, MarkType> = {
|
|
'mod+b': MarkType.Bold,
|
|
'mod+i': MarkType.Italic,
|
|
'mod+u': MarkType.Underline,
|
|
'mod+shift+u': MarkType.StrikeThrough,
|
|
'mod+[': MarkType.Code,
|
|
'mod+h': MarkType.Spoiler,
|
|
};
|
|
const INLINE_KEYS = Object.keys(INLINE_HOTKEYS);
|
|
|
|
export const BLOCK_HOTKEYS: Record<string, BlockType> = {
|
|
'mod+shift+7': BlockType.OrderedList,
|
|
'mod+shift+8': BlockType.UnorderedList,
|
|
"mod+shift+'": BlockType.BlockQuote,
|
|
'mod+shift+;': BlockType.CodeBlock,
|
|
};
|
|
const BLOCK_KEYS = Object.keys(BLOCK_HOTKEYS);
|
|
|
|
/**
|
|
* @return boolean true if shortcut is toggled.
|
|
*/
|
|
export const toggleKeyboardShortcut = (editor: Editor, event: KeyboardEvent<Element>): boolean => {
|
|
if (isHotkey('mod+e', event)) {
|
|
if (isAnyMarkActive(editor)) {
|
|
removeAllMark(editor);
|
|
return true;
|
|
}
|
|
|
|
if (!isBlockActive(editor, BlockType.Paragraph)) {
|
|
toggleBlock(editor, BlockType.Paragraph);
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
|
|
const blockToggled = BLOCK_KEYS.find((hotkey) => {
|
|
if (isHotkey(hotkey, event)) {
|
|
event.preventDefault();
|
|
toggleBlock(editor, BLOCK_HOTKEYS[hotkey]);
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
if (blockToggled) return true;
|
|
|
|
const inlineToggled = isBlockActive(editor, BlockType.CodeBlock)
|
|
? false
|
|
: INLINE_KEYS.find((hotkey) => {
|
|
if (isHotkey(hotkey, event)) {
|
|
event.preventDefault();
|
|
toggleMark(editor, INLINE_HOTKEYS[hotkey]);
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
return !!inlineToggled;
|
|
};
|