mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-10-25 20:26:51 +03:00
Code Issues Projects Releases Packages Wiki Activity

Dropdown stop keyboard propagation if key handled

Browse source
This commit is contained in:
Michael Telatynski 2019-12-17 15:14:01 +00:00
parent 0140338ac5
commit 7f78f55c94
1 changed files with 11 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/components/views/elements/Dropdown.js
View file

@ -94,8 +94,6 @@ export default class Dropdown extends React.Component {
this._onRootClick = this._onRootClick.bind(this);
this._onDocumentClick = this._onDocumentClick.bind(this);
this._onMenuOptionClick = this._onMenuOptionClick.bind(this);
this._onInputKeyPress = this._onInputKeyPress.bind(this);
this._onInputKeyUp = this._onInputKeyUp.bind(this);
this._onInputChange = this._onInputChange.bind(this);
this._collectRoot = this._collectRoot.bind(this);
this._collectInputTextBox = this._collectInputTextBox.bind(this);
@ -193,14 +191,9 @@ export default class Dropdown extends React.Component {
this.props.onOptionChange(dropdownKey);
}
_onInputKeyPress(e) {
// This needs to be on the keypress event because otherwise it can't cancel the form submission
if (e.key === Key.ENTER) {
e.preventDefault();
}
}
_onInputKeyDown = (e) => {
let handled = true;
_onInputKeyUp(e) {
// These keys don't generate keypress events and so needs to be on keyup
switch (e.key) {
case Key.ENTER:
@ -219,6 +212,13 @@ export default class Dropdown extends React.Component {
highlightedOption: this._prevOption(this.state.highlightedOption),
});
break;
default:
handled = false;
}
if (handled) {
e.preventDefault();
e.stopPropagation();
}
}
@ -314,8 +314,7 @@ export default class Dropdown extends React.Component {
type="text"
className="mx_Dropdown_option"
ref={this._collectInputTextBox}
onKeyPress={this._onInputKeyPress}
onKeyUp={this._onInputKeyUp}
onKeyDown={this._onInputKeyDown}
onChange={this._onInputChange}
value={this.state.searchQuery}
role="combobox"