a11y: add keyboard shortcut for copy, cut, paste (microsoft#2694)

* open node shortcut for visual editor * refactor * move focus to nexe node * delete useless code * fix some bug
lei9444 · Apr 28, 2020 · 24bebc2 · 24bebc2
1 parent 6589428
commit 24bebc2
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 6 deletions.
diff --git a/Composer/packages/extensions/visual-designer/src/constants/KeyboardCommandTypes.ts b/Composer/packages/extensions/visual-designer/src/constants/KeyboardCommandTypes.ts
@@ -89,11 +89,15 @@ const KeyboardNodeEditingShortcuts = {
   'Windows.Control.c': KeyboardCommandTypes.Node.Copy,
   'Windows.Control.X': KeyboardCommandTypes.Node.Cut,
   'Windows.Control.x': KeyboardCommandTypes.Node.Cut,
+  'Windows.Control.V': KeyboardCommandTypes.Node.Paste,
+  'Windows.Control.v': KeyboardCommandTypes.Node.Paste,
 
   'Mac.Meta.C': KeyboardCommandTypes.Node.Copy,
   'Mac.Meta.c': KeyboardCommandTypes.Node.Copy,
   'Mac.Meta.X': KeyboardCommandTypes.Node.Cut,
   'Mac.Meta.x': KeyboardCommandTypes.Node.Cut,
+  'Mac.Meta.V': KeyboardCommandTypes.Node.Paste,
+  'Mac.Meta.v': KeyboardCommandTypes.Node.Paste,
 };
 
 const KeyboardOperationEditingShortcuts = {

diff --git a/Composer/packages/extensions/visual-designer/src/editors/ObiEditor.tsx b/Composer/packages/extensions/visual-designer/src/editors/ObiEditor.tsx
@@ -283,12 +283,18 @@ export const ObiEditor: FC<ObiEditorProps> = ({
           case KeyboardCommandTypes.Node.Cut:
             dispatchEvent(NodeEventTypes.CutSelection, { actionIds: getClipboardTargetsFromContext() });
             break;
-          case KeyboardCommandTypes.Node.Paste:
-            dispatchEvent(NodeEventTypes.AppendSelection, {
-              target: focusedId,
-              actions: clipboardActions,
-            });
+          case KeyboardCommandTypes.Node.Paste: {
+            const currentSelectedId = selectionContext.selectedIds[0];
+            if (currentSelectedId.endsWith('+')) {
+              const { arrayPath, arrayIndex } = DialogUtils.parseNodePath(currentSelectedId.slice(0, -1)) || {};
+              dispatchEvent(NodeEventTypes.Insert, {
+                id: arrayPath,
+                position: arrayIndex,
+                $kind: 'PASTE',
+              });
+            }
             break;
+          }
         }
         break;
       case KeyboardPrimaryTypes.Cursor: {

diff --git a/Composer/packages/extensions/visual-designer/src/editors/editorConfig.ts b/Composer/packages/extensions/visual-designer/src/editors/editorConfig.ts
@@ -6,7 +6,7 @@ export const EditorConfig = {
     showEvents: false,
     arrowNavigation: true,
     tabNavigation: true,
-    keyboardNodeEditing: false,
+    keyboardNodeEditing: true,
     keyboardOperationEditing: true,
   },
 };