ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-02-16 10:58:30 -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 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(); this._showList();
})); }));
@@ -145,8 +145,12 @@ export class Dropdown extends Disposable {
this._register(DOM.addStandardDisposableListener(this._input.inputElement, DOM.EventType.KEY_DOWN, (e: StandardKeyboardEvent) => { this._register(DOM.addStandardDisposableListener(this._input.inputElement, DOM.EventType.KEY_DOWN, (e: StandardKeyboardEvent) => {
switch (e.keyCode) { switch (e.keyCode) {
case KeyCode.Enter: case KeyCode.Enter:
if (this._input.validate()) { if (this._contextView.isVisible()) {
this._onValueChange.fire(this._input.value); if (this._input.validate()) {
this._onValueChange.fire(this._input.value);
}
} else {
this._showList();
} }
e.stopPropagation(); e.stopPropagation();
break; break;
@@ -192,6 +196,11 @@ export class Dropdown extends Disposable {
this._contextView.hide(); this._contextView.hide();
}); });
this._controller.onDropdownEscape(() => {
this._input.focus();
this._contextView.hide();
});
this._input.onDidChange(e => { this._input.onDidChange(e => {
if (this._dataSource.options) { if (this._dataSource.options) {
this._filter.filterString = e; this._filter.filterString = e;
@@ -231,17 +240,19 @@ export class Dropdown extends Disposable {
} }
private _layoutTree(): void { private _layoutTree(): void {
let filteredLength = this._dataSource.options.reduce((p, i) => { if (this._dataSource && this._dataSource.options && this._dataSource.options.length > 0) {
if (this._filter.isVisible(undefined, i)) { let filteredLength = this._dataSource.options.reduce((p, i) => {
return p + 1; if (this._filter.isVisible(undefined, i)) {
} else { return p + 1;
return p; } else {
} return p;
}, 0); }
let height = filteredLength * this._renderer.getHeight(undefined, undefined) > this._options.maxHeight ? this._options.maxHeight : filteredLength * this._renderer.getHeight(undefined, undefined); }, 0);
this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px'); let height = filteredLength * this._renderer.getHeight(undefined, undefined) > this._options.maxHeight ? this._options.maxHeight : filteredLength * this._renderer.getHeight(undefined, undefined);
this._tree.layout(parseInt(this.$treeContainer.style('height'))); this.$treeContainer.style('height', height + 'px').style('width', DOM.getContentWidth(this.$input.getHTMLElement()) - 2 + 'px');
this._tree.refresh(); this._tree.layout(parseInt(this.$treeContainer.style('height')));
this._tree.refresh();
}
} }
public set values(vals: string[]) { 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>(); private _onSelectionChange = new Emitter<Resource>();
public readonly onSelectionChange: Event<Resource> = this._onSelectionChange.event; public readonly onSelectionChange: Event<Resource> = this._onSelectionChange.event;
private _onDropdownEscape = new Emitter<void>();
public readonly onDropdownEscape: Event<void> = this._onDropdownEscape.event;
constructor() { constructor() {
super(); 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 { protected onLeftClick(tree: tree.ITree, element: any, eventish: TreeDefaults.ICancelableEvent, origin: string): boolean {
let response = super.onLeftClick(tree, element, eventish, origin); let response = super.onLeftClick(tree, element, eventish, origin);
if (response) { if (response) {

3
src/vs/base/browser/ui/contextview/contextview.ts
View File

@@ -248,7 +248,8 @@ export class ContextView {
this.$view.hide(); this.$view.hide();
} }
private isVisible(): boolean { // {{SQL CARBON EDIT}}
public isVisible(): boolean {
return !!this.delegate; return !!this.delegate;
} }