focus move

microsoft · Apr 27, 2020 · 59890fd · 59890fd
1 parent 77d9578
commit 59890fd
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/Composer/packages/extensions/visual-designer/src/components/lib/KeyboardZone.tsx b/Composer/packages/extensions/visual-designer/src/components/lib/KeyboardZone.tsx
@@ -14,7 +14,7 @@ const KeyNameByModifierAttr = {
   shiftKey: 'Shift',
 };
 
-const overriddenKeyCodes = ['Tab', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
+const overriddenKeyCodes = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
 
 interface KeyboardZoneProps {
   onCommand: (action, e: KeyboardEvent) => object | void;

diff --git a/Composer/packages/extensions/visual-designer/src/editors/ObiEditor.tsx b/Composer/packages/extensions/visual-designer/src/editors/ObiEditor.tsx
@@ -20,6 +20,7 @@ import { normalizeSelection } from '../utils/normalizeSelection';
 import { KeyboardZone } from '../components/lib/KeyboardZone';
 import { scrollNodeIntoView } from '../utils/nodeOperation';
 import { designerCache } from '../store/DesignerCache';
+import { MenuTypes } from '../constants/MenuTypes';
 
 import { AdaptiveDialogEditor } from './AdaptiveDialogEditor';
 
@@ -228,6 +229,12 @@ export const ObiEditor: FC<ObiEditorProps> = ({
     setSelectableElements(querySelectableElements());
   }, [data, focusedEvent]);
 
+  useEffect((): void => {
+    if (!focusedId) {
+      resetSelectionData();
+    }
+  }, [focusedId]);
+
   const selection = new Selection({
     onSelectionChanged: (): void => {
       const selectedIndices = selection.getSelectedIndices();
@@ -293,7 +300,13 @@ export const ObiEditor: FC<ObiEditorProps> = ({
         break;
       case KeyboardPrimaryTypes.Cursor: {
         const currentSelectedId = selectionContext.selectedIds[0] || focusedId || '';
-        const { selected, focused, tab } = moveCursor(selectableElements, currentSelectedId, command);
+        const { selected, focused, tab } = currentSelectedId
+          ? moveCursor(selectableElements, currentSelectedId, command)
+          : {
+              selected: `${focusedEvent}.actions[0]${MenuTypes.EdgeMenu}`,
+              focused: undefined,
+              tab: '',
+            };
         setSelectionContext({
           getNodeIndex: selectionContext.getNodeIndex,
           selectedIds: [selected as string],