diff options
author | Starfall <root@starfall.blue> | 2020-05-10 02:59:07 -0500 |
---|---|---|
committer | Starfall <root@starfall.blue> | 2020-05-10 02:59:07 -0500 |
commit | 77fa1183cc113e3d3d20140e3545443cf6c7f170 (patch) | |
tree | 2ce4e4dd5235999d163350779f18cf74fe1ff0d1 /app/javascript/flavours/glitch/components/dropdown_menu.js | |
parent | b107e4f771f036b214563764fcd95786f8016ee7 (diff) | |
parent | c6ff4c634caf718adf7280e04909c091d15add1d (diff) |
Merge branch 'glitch'
Diffstat (limited to 'app/javascript/flavours/glitch/components/dropdown_menu.js')
-rw-r--r-- | app/javascript/flavours/glitch/components/dropdown_menu.js | 31 |
1 files changed, 10 insertions, 21 deletions
diff --git a/app/javascript/flavours/glitch/components/dropdown_menu.js b/app/javascript/flavours/glitch/components/dropdown_menu.js index cc4d714e8..60ed859a3 100644 --- a/app/javascript/flavours/glitch/components/dropdown_menu.js +++ b/app/javascript/flavours/glitch/components/dropdown_menu.js @@ -46,7 +46,7 @@ class DropdownMenu extends React.PureComponent { document.addEventListener('keydown', this.handleKeyDown, false); document.addEventListener('touchend', this.handleDocumentClick, listenerOptions); if (this.focusedItem && this.props.openedViaKeyboard) { - this.focusedItem.focus(); + this.focusedItem.focus({ preventScroll: true }); } this.setState({ mounted: true }); } @@ -68,20 +68,14 @@ class DropdownMenu extends React.PureComponent { handleKeyDown = e => { const items = Array.from(this.node.getElementsByTagName('a')); const index = items.indexOf(document.activeElement); - let element; + let element = null; switch(e.key) { case 'ArrowDown': - element = items[index+1]; - if (element) { - element.focus(); - } + element = items[index+1] || items[0]; break; case 'ArrowUp': - element = items[index-1]; - if (element) { - element.focus(); - } + element = items[index-1] || items[items.length-1]; break; case 'Tab': if (e.shiftKey) { @@ -89,28 +83,23 @@ class DropdownMenu extends React.PureComponent { } else { element = items[index+1] || items[0]; } - if (element) { - element.focus(); - e.preventDefault(); - e.stopPropagation(); - } break; case 'Home': element = items[0]; - if (element) { - element.focus(); - } break; case 'End': element = items[items.length-1]; - if (element) { - element.focus(); - } break; case 'Escape': this.props.onClose(); break; } + + if (element) { + element.focus(); + e.preventDefault(); + e.stopPropagation(); + } } handleItemKeyPress = e => { |