ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-24 17:23:05 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix keyboard issues in editable dropdown (#1600)

Browse Source
This commit is contained in:
Abbie Petchtes
2018-06-11 09:28:27 -07:00
committed by GitHub
parent eb62d054de
commit e50b512580
3 changed files with 36 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/sql/base/browser/ui/editableDropdown/dropdown.ts
View File

@@ -132,7 +132,7 @@ export class Dropdown extends Disposable {
ariaLabel: this._options.ariaLabel
});
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.FOCUS, () => {
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.CLICK, () => {
this._showList();
}));
@@ -145,8 +145,12 @@ export class Dropdown extends Disposable {
this._register(DOM.addStandardDisposableListener(this._input.inputElement, DOM.EventType.KEY_DOWN, (e: StandardKeyboardEvent) => {
switch (e.keyCode) {
case KeyCode.Enter:
if (this._input.validate()) {
this._onValueChange.fire(this._input.value);
if (this._contextView.isVisible()) {
if (this._input.validate()) {
this._onValueChange.fire(this._input.value);
}
} else {
this._showList();
}
e.stopPropagation();
break;
@@ -192,6 +196,11 @@ export class Dropdown extends Disposable {
this._contextView.hide();
});
this._controller.onDropdownEscape(() => {
this._input.focus();
this._contextView.hide();
});
this._input.onDidChange(e => {
if (this._dataSource.options) {
this._filter.filterString = e;
@@ -231,17 +240,19 @@ export class Dropdown extends Disposable {
}
private _layoutTree(): void {
let filteredLength = this._dataSource.options.reduce((p, i) => {
if (this._filter.isVisible(undefined, i)) {
return p + 1;
} else {
return p;
}
}, 0);
let height = filteredLength * this._renderer.getHeight(undefined, undefined) > this._options.maxHeight ? this._options.maxHeight : filteredLength * this._renderer.getHeight(undefined, undefined);
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px');
this._tree.layout(parseInt(this.$treeContainer.style('height')));
this._tree.refresh();
if (this._dataSource && this._dataSource.options && this._dataSource.options.length > 0) {
let filteredLength = this._dataSource.options.reduce((p, i) => {
if (this._filter.isVisible(undefined, i)) {
return p + 1;
} else {
return p;
}
}, 0);
let height = filteredLength * this._renderer.getHeight(undefined, undefined) > this._options.maxHeight ? this._options.maxHeight : filteredLength * this._renderer.getHeight(undefined, undefined);
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px');
this._tree.layout(parseInt(this.$treeContainer.style('height')));
this._tree.refresh();
}
}
public set values(vals: string[]) {

9
src/sql/base/browser/ui/editableDropdown/dropdownTree.ts
View File

@@ -101,10 +101,19 @@ export class DropdownController extends TreeDefaults.DefaultController {
private _onSelectionChange = new Emitter<Resource>();
public readonly onSelectionChange: Event<Resource> = this._onSelectionChange.event;
private _onDropdownEscape = new Emitter<void>();
public readonly onDropdownEscape: Event<void> = this._onDropdownEscape.event;
constructor() {
super();
}
protected onEscape(tree: tree.ITree, event: IKeyboardEvent): boolean {
let response = super.onEscape(tree, event);
this._onDropdownEscape.fire();
return response;
}
protected onLeftClick(tree: tree.ITree, element: any, eventish: TreeDefaults.ICancelableEvent, origin: string): boolean {
let response = super.onLeftClick(tree, element, eventish, origin);
if (response) {