Rework editableDropdown to not need platform (#5189)

* rework editableDropdown to not need platform

* rework editable dropdown to not depend on platform

* fix compile

* fix focus bluring
This commit is contained in:
Anthony Dresser
2019-04-30 09:25:04 -07:00
committed by GitHub
parent aacc0eca67
commit 56342af140
16 changed files with 53 additions and 58 deletions

View File

@@ -8,7 +8,7 @@ import 'vs/css!./media/dropdownList';
import { ToggleDropdownAction } from './actions'; import { ToggleDropdownAction } from './actions';
import { DropdownDataSource, DropdownFilter, DropdownModel, DropdownRenderer, DropdownController } from './dropdownTree'; import { DropdownDataSource, DropdownFilter, DropdownModel, DropdownRenderer, DropdownController } from './dropdownTree';
import { IContextViewProvider, ContextView } from 'vs/base/browser/ui/contextview/contextview'; import { IContextViewProvider } from 'vs/base/browser/ui/contextview/contextview';
import { mixin } from 'vs/base/common/objects'; import { mixin } from 'vs/base/common/objects';
import { InputBox, IInputBoxStyles } from 'sql/base/browser/ui/inputBox/inputBox'; import { InputBox, IInputBoxStyles } from 'sql/base/browser/ui/inputBox/inputBox';
import { IMessage, MessageType } from 'vs/base/browser/ui/inputbox/inputBox'; import { IMessage, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
@@ -21,7 +21,7 @@ import { Event, Emitter } from 'vs/base/common/event';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent'; import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode } from 'vs/base/common/keyCodes'; import { KeyCode } from 'vs/base/common/keyCodes';
import { Tree } from 'vs/base/parts/tree/browser/treeImpl'; import { Tree } from 'vs/base/parts/tree/browser/treeImpl';
import { ILayoutService } from 'vs/platform/layout/browser/layoutService'; import { ITree } from 'vs/base/parts/tree/browser/tree';
export interface IDropdownOptions extends IDropdownStyles { export interface IDropdownOptions extends IDropdownStyles {
/** /**
@@ -78,11 +78,9 @@ export class Dropdown extends Disposable {
private _inputContainer: HTMLElement; private _inputContainer: HTMLElement;
private _treeContainer: HTMLElement; private _treeContainer: HTMLElement;
private _input: InputBox; private _input: InputBox;
private _tree: Tree; private _tree: ITree;
private _options: IDropdownOptions; private _options: IDropdownOptions;
private _toggleAction: ToggleDropdownAction; private _toggleAction: ToggleDropdownAction;
// we have to create our own contextview since otherwise inputbox will override ours
private _contextView: ContextView;
private _dataSource = new DropdownDataSource(); private _dataSource = new DropdownDataSource();
private _filter = new DropdownFilter(); private _filter = new DropdownFilter();
private _renderer = new DropdownRenderer(); private _renderer = new DropdownRenderer();
@@ -100,12 +98,10 @@ export class Dropdown extends Disposable {
constructor( constructor(
container: HTMLElement, container: HTMLElement,
contextViewService: IContextViewProvider, private readonly contextViewService: IContextViewProvider,
readonly layoutService: ILayoutService,
opt?: IDropdownOptions opt?: IDropdownOptions
) { ) {
super(); super();
this._contextView = new ContextView(layoutService.container);
this._options = opt || Object.create(null); this._options = opt || Object.create(null);
mixin(this._options, defaults, false); mixin(this._options, defaults, false);
this._el = DOM.append(container, DOM.$('.monaco-dropdown')); this._el = DOM.append(container, DOM.$('.monaco-dropdown'));
@@ -124,7 +120,7 @@ export class Dropdown extends Disposable {
this._input = new InputBox(this._inputContainer, contextViewService, { this._input = new InputBox(this._inputContainer, contextViewService, {
validationOptions: { validationOptions: {
// @SQLTODO // @SQLTODO
//showMessage: false, // showMessage: false,
validation: v => this._inputValidator(v) validation: v => this._inputValidator(v)
}, },
placeholder: this._options.placeholder, placeholder: this._options.placeholder,
@@ -140,21 +136,18 @@ export class Dropdown extends Disposable {
this._showList(); this._showList();
})); }));
this._register(DOM.addDisposableListener(this._input.inputElement, DOM.EventType.BLUR, () => { const inputTracker = this._register(DOM.trackFocus(this._input.inputElement));
inputTracker.onDidBlur(() => {
if (!this._tree.isDOMFocused()) { if (!this._tree.isDOMFocused()) {
this._onBlur.fire(); this._onBlur.fire();
} }
})); });
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._contextView.isVisible()) { if (this._input.validate()) {
if (this._input.validate()) { this._onValueChange.fire(this._input.value);
this._onValueChange.fire(this._input.value);
}
} else {
this._showList();
} }
e.stopPropagation(); e.stopPropagation();
break; break;
@@ -162,14 +155,14 @@ export class Dropdown extends Disposable {
if (this._treeContainer.parentElement) { if (this._treeContainer.parentElement) {
this._input.validate(); this._input.validate();
this._onBlur.fire(); this._onBlur.fire();
this._contextView.hide(); this.contextViewService.hideContextView();
e.stopPropagation(); e.stopPropagation();
} }
break; break;
case KeyCode.Tab: case KeyCode.Tab:
this._input.validate(); this._input.validate();
this._onBlur.fire(); this._onBlur.fire();
this._contextView.hide(); this.contextViewService.hideContextView();
e.stopPropagation(); e.stopPropagation();
break; break;
case KeyCode.DownArrow: case KeyCode.DownArrow:
@@ -191,18 +184,26 @@ export class Dropdown extends Disposable {
controller: this._controller controller: this._controller
}, { paddingOnRow: false, indentPixels: 0, twistiePixels: 0 }); }, { paddingOnRow: false, indentPixels: 0, twistiePixels: 0 });
const treeTracker = this._register(DOM.trackFocus(this._tree.getHTMLElement()));
treeTracker.onDidBlur(() => {
if (!this._input.hasFocus()) {
this._onBlur.fire();
}
});
this.values = this._options.values; this.values = this._options.values;
this._controller.onSelectionChange(e => { this._controller.onSelectionChange(e => {
this.value = e.value; this.value = e.value;
this._onValueChange.fire(e.value); this._onValueChange.fire(e.value);
this._input.focus(); this._input.focus();
this._contextView.hide(); this.contextViewService.hideContextView();
}); });
this._controller.onDropdownEscape(() => { this._controller.onDropdownEscape(() => {
this._input.focus(); this._input.focus();
this._contextView.hide(); this.contextViewService.hideContextView();
}); });
this._input.onDidChange(e => { this._input.onDidChange(e => {
@@ -216,29 +217,30 @@ export class Dropdown extends Disposable {
} }
}); });
this._register(this._contextView); this.onBlur(() => {
this.contextViewService.hideContextView();
});
this._register(this._tree); this._register(this._tree);
this._register(this._input); this._register(this._input);
this._register(this._contextView);
} }
private _showList(): void { private _showList(): void {
if (this._input.isEnabled) { if (this._input.isEnabled) {
this._onFocus.fire(); this._onFocus.fire();
this._filter.filterString = ''; this._filter.filterString = '';
this._contextView.show({ this.contextViewService.showContextView({
getAnchor: () => this._inputContainer, getAnchor: () => this._inputContainer,
render: container => { render: container => {
DOM.append(container, this._treeContainer); DOM.append(container, this._treeContainer);
this._layoutTree(); this._layoutTree();
return { dispose: () => { } }; return {
}, dispose: () => {
onDOMEvent: e => { // when we dispose we want to remove treecontainer so that it doesn't have a parent
if (!DOM.isAncestor((<HTMLElement>e.srcElement), this._el) && !DOM.isAncestor((<HTMLElement>e.srcElement), this._treeContainer)) { // we often use the presense of a parent to detect if the tree is being shown
this._input.validate(); this._treeContainer.remove();
this._onBlur.fire(); }
this._contextView.hide(); };
}
} }
}); });
} }
@@ -288,7 +290,7 @@ export class Dropdown extends Disposable {
public blur() { public blur() {
this._input.blur(); this._input.blur();
this._contextView.hide(); this.contextViewService.hideContextView();
} }
style(style: IListStyles & IInputBoxStyles & IDropdownStyles) { style(style: IListStyles & IInputBoxStyles & IDropdownStyles) {

View File

Before

Width:  |  Height:  |  Size: 211 B

After

Width:  |  Height:  |  Size: 211 B

View File

@@ -22,7 +22,7 @@ import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/boot
import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service'; import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component'; import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
import { EditableDropDown } from 'sql/base/browser/ui/editableDropdown/editableDropdown.component'; import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component'; import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation'; import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';

View File

@@ -8,13 +8,12 @@ import {
Output, OnChanges, SimpleChanges, EventEmitter Output, OnChanges, SimpleChanges, EventEmitter
} from '@angular/core'; } from '@angular/core';
import { Dropdown, IDropdownOptions } from 'sql/base/browser/ui/editableDropdown/dropdown'; import { Dropdown, IDropdownOptions } from 'sql/base/parts/editableDropdown/browser/dropdown';
import { AngularDisposable } from 'sql/base/node/lifecycle'; import { AngularDisposable } from 'sql/base/node/lifecycle';
import { attachEditableDropdownStyler } from 'sql/platform/theme/common/styler'; import { attachEditableDropdownStyler } from 'sql/platform/theme/common/styler';
import { IContextViewService } from 'vs/platform/contextview/browser/contextView'; import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
import { IThemeService } from 'vs/platform/theme/common/themeService'; import { IThemeService } from 'vs/platform/theme/common/themeService';
import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
@Component({ @Component({
selector: 'editable-select-box', selector: 'editable-select-box',
@@ -32,10 +31,9 @@ export class EditableDropDown extends AngularDisposable implements OnInit, OnCha
private _previousVal: string; private _previousVal: string;
constructor( constructor(
@Inject(forwardRef(() => ElementRef)) private _el: ElementRef, @Inject(forwardRef(() => ElementRef)) private readonly _el: ElementRef,
@Inject(IThemeService) private themeService: IThemeService, @Inject(IThemeService) private readonly themeService: IThemeService,
@Inject(IContextViewService) private contextViewService: IContextViewService, @Inject(IContextViewService) private readonly contextViewService: IContextViewService
@Inject(ILayoutService) private layoutService: ILayoutService
) { ) {
super(); super();
} }
@@ -49,7 +47,7 @@ export class EditableDropDown extends AngularDisposable implements OnInit, OnCha
ariaLabel: '', ariaLabel: '',
actionLabel: '' actionLabel: ''
}; };
this._selectbox = new Dropdown(this._el.nativeElement, this.contextViewService, this.layoutService, dropdownOptions); this._selectbox = new Dropdown(this._el.nativeElement, this.contextViewService, dropdownOptions);
this._selectbox.values = this.options; this._selectbox.values = this.options;
this._selectbox.value = this.selectedOption; this._selectbox.value = this.selectedOption;

View File

@@ -12,7 +12,7 @@ import * as azdata from 'azdata';
import { ComponentBase } from 'sql/workbench/electron-browser/modelComponents/componentBase'; import { ComponentBase } from 'sql/workbench/electron-browser/modelComponents/componentBase';
import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/workbench/electron-browser/modelComponents/interfaces'; import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/workbench/electron-browser/modelComponents/interfaces';
import { Dropdown, IDropdownOptions } from 'sql/base/browser/ui/editableDropdown/dropdown'; import { Dropdown, IDropdownOptions } from 'sql/base/parts/editableDropdown/browser/dropdown';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
import { attachEditableDropdownStyler } from 'sql/platform/theme/common/styler'; import { attachEditableDropdownStyler } from 'sql/platform/theme/common/styler';
import { attachSelectBoxStyler } from 'vs/platform/theme/common/styler'; import { attachSelectBoxStyler } from 'vs/platform/theme/common/styler';
@@ -63,7 +63,7 @@ export default class DropDownComponent extends ComponentBase implements ICompone
ariaLabel: '', ariaLabel: '',
actionLabel: '' actionLabel: ''
}; };
this._editableDropdown = new Dropdown(this._editableDropDownContainer.nativeElement, this.contextViewService, this.layoutService, this._editableDropdown = new Dropdown(this._editableDropDownContainer.nativeElement, this.contextViewService,
dropdownOptions); dropdownOptions);
this._register(this._editableDropdown); this._register(this._editableDropdown);

View File

@@ -57,7 +57,7 @@ import { OperatorsViewComponent } from 'sql/workbench/parts/jobManagement/electr
import { ProxiesViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/proxiesView.component'; import { ProxiesViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/proxiesView.component';
import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component'; import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
import { EditableDropDown } from 'sql/base/browser/ui/editableDropdown/editableDropdown.component'; import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component'; import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
import LoadingSpinner from 'sql/workbench/electron-browser/modelComponents/loadingSpinner.component'; import LoadingSpinner from 'sql/workbench/electron-browser/modelComponents/loadingSpinner.component';

View File

@@ -16,7 +16,7 @@ import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/boot
import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service'; import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component'; import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
import { EditableDropDown } from 'sql/base/browser/ui/editableDropdown/editableDropdown.component'; import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component'; import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
import { NotebookComponent } from 'sql/workbench/parts/notebook/notebook.component'; import { NotebookComponent } from 'sql/workbench/parts/notebook/notebook.component';

View File

@@ -27,7 +27,7 @@ import { IQueryModelService } from 'sql/platform/query/common/queryModel';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
import { attachEditableDropdownStyler, attachSelectBoxStyler } from 'sql/platform/theme/common/styler'; import { attachEditableDropdownStyler, attachSelectBoxStyler } from 'sql/platform/theme/common/styler';
import { EventEmitter } from 'sql/base/common/eventEmitter'; import { EventEmitter } from 'sql/base/common/eventEmitter';
import { Dropdown } from 'sql/base/browser/ui/editableDropdown/dropdown'; import { Dropdown } from 'sql/base/parts/editableDropdown/browser/dropdown';
import { ILayoutService } from 'vs/platform/layout/browser/layoutService'; import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
/** /**
@@ -464,7 +464,7 @@ export class ListDatabasesActionItem extends EventEmitter implements IActionItem
this._databaseSelectBox.disable(); this._databaseSelectBox.disable();
} else { } else {
this._dropdown = new Dropdown(this._databaseListDropdown, contextViewProvider, layoutService, { this._dropdown = new Dropdown(this._databaseListDropdown, contextViewProvider, {
strictSelection: true, strictSelection: true,
placeholder: this._selectDatabaseString, placeholder: this._selectDatabaseString,
ariaLabel: this._selectDatabaseString, ariaLabel: this._selectDatabaseString,

View File

@@ -18,7 +18,7 @@ import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/boot
import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service'; import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component'; import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
import { EditableDropDown } from 'sql/base/browser/ui/editableDropdown/editableDropdown.component'; import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component'; import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation'; import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';

View File

@@ -37,7 +37,7 @@ import * as TelemetryKeys from 'sql/platform/telemetry/telemetryKeys';
import * as BackupConstants from 'sql/workbench/parts/backup/common/constants'; import * as BackupConstants from 'sql/workbench/parts/backup/common/constants';
import { RestoreViewModel, RestoreOptionParam, SouceDatabaseNamesParam } from 'sql/workbench/parts/restore/browser/restoreViewModel'; import { RestoreViewModel, RestoreOptionParam, SouceDatabaseNamesParam } from 'sql/workbench/parts/restore/browser/restoreViewModel';
import * as FileValidationConstants from 'sql/workbench/services/fileBrowser/common/fileValidationServiceConstants'; import * as FileValidationConstants from 'sql/workbench/services/fileBrowser/common/fileValidationServiceConstants';
import { Dropdown } from 'sql/base/browser/ui/editableDropdown/dropdown'; import { Dropdown } from 'sql/base/parts/editableDropdown/browser/dropdown';
import { TabbedPanel, PanelTabIdentifier } from 'sql/base/browser/ui/panel/panel'; import { TabbedPanel, PanelTabIdentifier } from 'sql/base/browser/ui/panel/panel';
import { ServiceOptionType } from 'sql/workbench/api/common/sqlExtHostTypes'; import { ServiceOptionType } from 'sql/workbench/api/common/sqlExtHostTypes';
import { IClipboardService } from 'sql/platform/clipboard/common/clipboardService'; import { IClipboardService } from 'sql/platform/clipboard/common/clipboardService';
@@ -211,7 +211,7 @@ export class RestoreDialog extends Modal {
// Get the bootstrap params and perform the bootstrap // Get the bootstrap params and perform the bootstrap
dropdownContainer.style.width = '100%'; dropdownContainer.style.width = '100%';
this._databaseDropdown = new Dropdown(dropdownContainer, this._contextViewService, this.layoutService, this._databaseDropdown = new Dropdown(dropdownContainer, this._contextViewService,
{ {
strictSelection: false, strictSelection: false,
ariaLabel: LocalizedStrings.TARGETDATABASE, ariaLabel: LocalizedStrings.TARGETDATABASE,

View File

@@ -5,20 +5,15 @@
import 'vs/css!./media/sqlConnection'; import 'vs/css!./media/sqlConnection';
import { Button } from 'sql/base/browser/ui/button/button';
import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox'; import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox';
import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox'; import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox';
import * as DialogHelper from 'sql/workbench/browser/modal/dialogHelper'; import * as DialogHelper from 'sql/workbench/browser/modal/dialogHelper';
import { IConnectionComponentCallbacks } from 'sql/workbench/services/connection/browser/connectionDialogService'; import { IConnectionComponentCallbacks } from 'sql/workbench/services/connection/browser/connectionDialogService';
import { IConnectionProfile } from 'sql/platform/connection/common/interfaces'; import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
import { ConnectionOptionSpecialType } from 'sql/workbench/api/common/sqlExtHostTypes'; import { ConnectionOptionSpecialType } from 'sql/workbench/api/common/sqlExtHostTypes';
import * as Constants from 'sql/platform/connection/common/constants'; import * as Constants from 'sql/platform/connection/common/constants';
import { ConnectionProfileGroup, IConnectionProfileGroup } from 'sql/platform/connection/common/connectionProfileGroup';
import { Dropdown } from 'sql/base/browser/ui/editableDropdown/dropdown';
import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement'; import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement';
import { ICapabilitiesService } from 'sql/platform/capabilities/common/capabilitiesService'; import { ICapabilitiesService } from 'sql/platform/capabilities/common/capabilitiesService';
import { ConnectionProfile } from 'sql/platform/connection/common/connectionProfile';
import * as styler from 'sql/platform/theme/common/styler'; import * as styler from 'sql/platform/theme/common/styler';
import { IAccountManagementService } from 'sql/platform/accounts/common/interfaces'; import { IAccountManagementService } from 'sql/platform/accounts/common/interfaces';

View File

@@ -15,7 +15,7 @@ import { IConnectionProfile } from 'sql/platform/connection/common/interfaces';
import { ConnectionOptionSpecialType } from 'sql/workbench/api/common/sqlExtHostTypes'; import { ConnectionOptionSpecialType } from 'sql/workbench/api/common/sqlExtHostTypes';
import * as Constants from 'sql/platform/connection/common/constants'; import * as Constants from 'sql/platform/connection/common/constants';
import { ConnectionProfileGroup, IConnectionProfileGroup } from 'sql/platform/connection/common/connectionProfileGroup'; import { ConnectionProfileGroup, IConnectionProfileGroup } from 'sql/platform/connection/common/connectionProfileGroup';
import { Dropdown } from 'sql/base/browser/ui/editableDropdown/dropdown'; import { Dropdown } from 'sql/base/parts/editableDropdown/browser/dropdown';
import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement'; import { IConnectionManagementService } from 'sql/platform/connection/common/connectionManagement';
import { ICapabilitiesService } from 'sql/platform/capabilities/common/capabilitiesService'; import { ICapabilitiesService } from 'sql/platform/capabilities/common/capabilitiesService';
import { ConnectionProfile } from 'sql/platform/connection/common/connectionProfile'; import { ConnectionProfile } from 'sql/platform/connection/common/connectionProfile';
@@ -249,7 +249,7 @@ export class ConnectionWidget {
let databaseOption = this._optionsMaps[ConnectionOptionSpecialType.databaseName]; let databaseOption = this._optionsMaps[ConnectionOptionSpecialType.databaseName];
if (databaseOption) { if (databaseOption) {
let databaseName = DialogHelper.appendRow(this._tableContainer, databaseOption.displayName, 'connection-label', 'connection-input'); let databaseName = DialogHelper.appendRow(this._tableContainer, databaseOption.displayName, 'connection-label', 'connection-input');
this._databaseNameInputBox = new Dropdown(databaseName, this._contextViewService, this._layoutService, { this._databaseNameInputBox = new Dropdown(databaseName, this._contextViewService, {
values: [this._defaultDatabaseName, this._loadingDatabaseName], values: [this._defaultDatabaseName, this._loadingDatabaseName],
strictSelection: false, strictSelection: false,
placeholder: this._defaultDatabaseName, placeholder: this._defaultDatabaseName,