fix: Support of shortcuts for React v16 (#128)

Author: jaywcjlove

src/shortcuts.ts

@@ -4,7 +4,13 @@ import { SelectionText } from './SelectionText';
 
 export default function shortcuts(e: React.KeyboardEvent<HTMLTextAreaElement>) {
   const api = new SelectionText(e.target as HTMLTextAreaElement);
-  if (e.code && e.code.toLowerCase() === 'tab') {
+  /**
+   * Support of shortcuts for React v16
+   * https://github.com/uiwjs/react-textarea-code-editor/issues/128
+   * https://blog.saeloun.com/2021/04/23/react-keyboard-event-code.html
+   */
+  const code = (e.code || e.nativeEvent.code).toLocaleLowerCase();
+  if (code === 'tab') {
     stopPropagation(e);
     if (api.start === api.end) {
       api.insertText('  ').position(api.start + 2, api.end + 2);
@@ -16,20 +22,16 @@ export default function shortcuts(e: React.KeyboardEvent<HTMLTextAreaElement>) {
       api.insertText('  ').position(api.start + 2, api.end);
     }
     api.notifyChange();
-  } else if (e.code && e.code.toLowerCase() === 'enter') {
+  } else if (code === 'enter') {
     stopPropagation(e);
     const indent = `\n${api.getIndentText()}`;
     api.insertText(indent).position(api.start + indent.length, api.start + indent.length);
     api.notifyChange();
-  } else if (
-    e.code &&
-    /^(quote|backquote|bracketleft|digit9|comma)$/.test(e.code.toLowerCase()) &&
-    api.getSelectedValue()
-  ) {
+  } else if (code && /^(quote|backquote|bracketleft|digit9|comma)$/.test(code) && api.getSelectedValue()) {
     stopPropagation(e);
     const val = api.getSelectedValue();
     let txt = '';
-    switch (e.code.toLowerCase()) {
+    switch (code) {
       case 'quote':
         txt = `'${val}'`;
         if (e.shiftKey) {