Fixing the layering in the base folder (#5308)

* removes more builder references

* remove builder from profiler

* formatting

* fix profiler dailog

* remove builder from oatuhdialog

* remove the rest of builder references

* formatting

* add more strict null checks to base

* enable strict tslint rules

* code layering of base

* wip

* working through changes to table data view

* fix tests

* update editabledropdown to not use layout service

* wip

* fix imports

* fix import

* fix compile error

* add more localization

* add comments to changes to import patterns

* add more import comments

src/sql/base/browser/ui/checkbox/checkbox.ts

@@ -3,6 +3,8 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+import 'vs/css!./media/checkbox';
+
 import { Color } from 'vs/base/common/color';
 import { Event, Emitter } from 'vs/base/common/event';
 import { KeyCode } from 'vs/base/common/keyCodes';

src/sql/base/browser/ui/scrollableSplitview/scrollableSplitview.ts

@@ -3,7 +3,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import 'vs/css!./scrollableSplitview';
+import 'vs/css!./media/scrollableSplitview';
 import { HeightMap, IView as HeightIView, IViewItem as HeightIViewItem } from './heightMap';
 
 import { IDisposable, combinedDisposable, toDisposable } from 'vs/base/common/lifecycle';

src/sql/base/browser/ui/selectBox/selectBox.ts

@@ -11,8 +11,8 @@ import { IContextViewProvider, AnchorAlignment } from 'vs/base/browser/ui/contex
 import * as dom from 'vs/base/browser/dom';
 import { RenderOptions, renderFormattedText, renderText } from 'vs/base/browser/htmlContentRenderer';
 import { IMessage, MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
-import aria = require('vs/base/browser/ui/aria/aria');
-import nls = require('vs/nls');
+import * as aria from 'vs/base/browser/ui/aria/aria';
+import * as nls from 'vs/nls';
 
 const $ = dom.$;
 

src/sql/base/browser/ui/table/plugins/checkboxSelectColumn.plugin.ts

@@ -1,7 +1,5 @@
 // Adopted and converted to typescript from https://github.com/6pac/SlickGrid/blob/master/plugins/slick.checkboxselectcolumn.js
 
-import 'vs/css!vs/base/browser/ui/checkbox/checkbox';
-
 import { mixin } from 'vs/base/common/objects';
 import * as nls from 'vs/nls';
 import { ICheckboxStyles } from 'vs/base/browser/ui/checkbox/checkbox';

src/sql/base/browser/ui/table/plugins/headerFilter.plugin.ts

@@ -2,10 +2,11 @@
 // heavily modified
 
 import { mixin } from 'vs/base/common/objects';
-import { Button } from '../../button/button';
-import { attachButtonStyler } from 'sql/platform/theme/common/styler';
+import { IButtonStyles } from 'vs/base/browser/ui/button/button';
+import { localize } from 'vs/nls';
+
+import { Button } from 'sql/base/browser/ui/button/button';
 import { escape } from 'sql/base/common/strings';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
 
 export class HeaderFilter {
 
@@ -28,7 +29,7 @@ export class HeaderFilter {
 	private workingFilters: any;
 	private columnDef: any;
 
-	constructor(options: any, private _themeService: IThemeService) {
+	constructor(options: any) {
 		this.options = mixin(options, this.defaults, false);
 	}
 
@@ -191,8 +192,8 @@ export class HeaderFilter {
 			.appendTo(this.$menu);
 
 		this.okButton = new Button(this.$menu.get(0));
-		this.okButton.label = 'OK';
-		this.okButton.title = 'OK';
+		this.okButton.label = localize('headerFilter.ok', "OK");
+		this.okButton.title = localize('headerFilter.ok', "OK");
 		this.okButton.element.id = 'filter-ok-button';
 		const okElement = jQuery('#filter-ok-button');
 		okElement.bind('click', (ev) => {
@@ -202,8 +203,8 @@ export class HeaderFilter {
 		});
 
 		this.clearButton = new Button(this.$menu.get(0));
-		this.clearButton.label = 'Clear';
-		this.clearButton.title = 'Clear';
+		this.clearButton.label = localize('headerFilter.clear', "Clear");
+		this.clearButton.title = localize('headerFilter.clear', "Clear");
 		this.clearButton.element.id = 'filter-clear-button';
 		const clearElement = jQuery('#filter-clear-button');
 		clearElement.bind('click', (ev) => {
@@ -213,14 +214,11 @@ export class HeaderFilter {
 		});
 
 		this.cancelButton = new Button(this.$menu.get(0));
-		this.cancelButton.label = 'Cancel';
-		this.cancelButton.title = 'Cancel';
+		this.cancelButton.label = localize('headerFilter.cancel', "Cancel");
+		this.cancelButton.title = localize('headerFilter.cancel', "Cancel");
 		this.cancelButton.element.id = 'filter-cancel-button';
 		const cancelElement = jQuery('#filter-cancel-button');
 		cancelElement.bind('click', () => this.hideMenu());
-		attachButtonStyler(this.okButton, this._themeService);
-		attachButtonStyler(this.clearButton, this._themeService);
-		attachButtonStyler(this.cancelButton, this._themeService);
 
 		jQuery(':checkbox', $filter).bind('click', (e) => {
 			this.workingFilters = this.changeWorkingFilter(filterItems, this.workingFilters, jQuery(e.target));
@@ -238,6 +236,12 @@ export class HeaderFilter {
 			.css('left', (left > 0 ? left : 0));
 	}
 
+	public style(styles: IButtonStyles): void {
+		this.okButton.style(styles);
+		this.clearButton.style(styles);
+		this.cancelButton.style(styles);
+	}
+
 	private columnsResized() {
 		this.hideMenu();
 	}

src/sql/base/browser/ui/table/table.ts

@@ -11,7 +11,6 @@ import 'vs/css!./media/slickGrid';
 import { TableDataView } from './tableDataView';
 import { IDisposableDataProvider, ITableSorter, ITableMouseEvent, ITableConfiguration, ITableStyles } from 'sql/base/browser/ui/table/interfaces';
 
-import { IThemable } from 'vs/platform/theme/common/styler';
 import * as DOM from 'vs/base/browser/dom';
 import { mixin } from 'vs/base/common/objects';
 import { IDisposable } from 'vs/base/common/lifecycle';
@@ -29,7 +28,7 @@ function getDefaultOptions<T>(): Slick.GridOptions<T> {
 	};
 }
 
-export class Table<T extends Slick.SlickData> extends Widget implements IThemable, IDisposable {
+export class Table<T extends Slick.SlickData> extends Widget implements IDisposable {
 	private styleElement: HTMLStyleElement;
 	private idPrefix: string;
 

src/sql/base/browser/ui/taskbar/actionbar.ts

@@ -3,8 +3,6 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import 'vs/css!vs/base/browser/ui/actionbar/actionbar';
-
 import { IAction, IActionRunner, ActionRunner } from 'vs/base/common/actions';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
 import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
@@ -16,7 +14,7 @@ import * as lifecycle from 'vs/base/common/lifecycle';
 import * as DOM from 'vs/base/browser/dom';
 import * as types from 'vs/base/common/types';
 
-let defaultOptions: IActionBarOptions = {
+const defaultOptions: IActionBarOptions = {
 	orientation: ActionsOrientation.HORIZONTAL,
 	context: null
 };

src/sql/base/browser/ui/taskbar/taskbar.ts

@@ -5,7 +5,6 @@
 
 import 'vs/css!./media/taskbar';
 import 'vs/css!./media/icons';
-import 'vs/css!sql/media/icons/common-icons';
 
 import { ActionBar } from './actionbar';
 

src/sql/base/electron-browser/ui/breadcrumb/breadcrumb.component.ts

@@ -3,7 +3,6 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import 'vs/css!sql/media/icons/common-icons';
 import 'vs/css!./media/breadcrumb';
 
 import { Component, Inject, forwardRef, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';

src/sql/base/electron-browser/ui/panel/panel.component.ts

@@ -8,8 +8,8 @@ import {
 	Input, EventEmitter, Output, ViewChild, ElementRef
 } from '@angular/core';
 
-import { TabComponent } from './tab.component';
-import { ScrollableDirective } from 'sql/base/browser/ui/scrollable/scrollable.directive';
+import { TabComponent } from 'sql/base/electron-browser/ui/panel/tab.component';
+import { ScrollableDirective } from 'sql/base/electron-browser/ui/scrollable/scrollable.directive';
 import { subscriptionToDisposable } from 'sql/base/node/lifecycle';
 
 import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
@@ -17,7 +17,7 @@ import { Action } from 'vs/base/common/actions';
 import * as types from 'vs/base/common/types';
 import { mixin } from 'vs/base/common/objects';
 import { Disposable } from 'vs/base/common/lifecycle';
-import { ScrollbarVisibility } from 'vs/editor/common/standalone/standaloneEnums';
+import { ScrollbarVisibility } from 'vs/base/common/scrollable';
 
 export interface IPanelOptions {
 	/**
@@ -47,7 +47,7 @@ let idPool = 0;
 		<div class="tabbedPanel fullsize" [ngClass]="options.layout === NavigationBarLayout.vertical ? 'vertical' : 'horizontal'">
 			<div *ngIf="!options.showTabsWhenOne ? _tabs.length !== 1 : true" class="composite title">
 				<div class="tabContainer">
-					<div class="tabList" role="tablist" scrollable [horizontalScroll]="ScrollbarVisibility.Auto" [verticalScroll]="ScrollbarVisibility.Hidden" [scrollYToX]="true">
+					<div class="tabList" role="tablist" scrollable [horizontalScroll]="AutoScrollbarVisibility" [verticalScroll]="HiddenScrollbarVisibility" [scrollYToX]="true">
 						<div role="presentation" *ngFor="let tab of _tabs">
 							<tab-header role="presentation" [active]="_activeTab === tab" [tab]="tab" [showIcon]="options.showIcon" (onSelectTab)='selectTab($event)' (onCloseTab)='closeTab($event)'></tab-header>
 						</div>
@@ -79,7 +79,8 @@ export class PanelComponent extends Disposable {
 	private _actionbar: ActionBar;
 	private _mru: TabComponent[];
 
-	protected ScrollbarVisibility = ScrollbarVisibility; // used by angular template
+	protected AutoScrollbarVisibility = ScrollbarVisibility.Auto; // used by angular template
+	protected HiddenScrollbarVisibility = ScrollbarVisibility.Hidden; // used by angular template
 	protected NavigationBarLayout = NavigationBarLayout; // used by angular template
 
 	@ViewChild('panelActionbar', { read: ElementRef }) private _actionbarRef: ElementRef;

src/sql/base/electron-browser/ui/panel/panel.module.ts

@@ -10,7 +10,7 @@ import { TabComponent } from './tab.component';
 import { TabHeaderComponent } from './tabHeader.component';
 import { PanelComponent } from './panel.component';
 
-import { ScrollableModule } from 'sql/base/browser/ui/scrollable/scrollable.module';
+import { ScrollableModule } from 'sql/base/electron-browser/ui/scrollable/scrollable.module';
 
 @NgModule({
 	imports: [CommonModule, ScrollableModule],

src/sql/base/electron-browser/ui/panel/tabHeader.component.ts

@@ -3,8 +3,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import 'vs/css!sql/media/icons/common-icons';
-import 'vs/css!./tabHeader';
+import 'vs/css!./media/tabHeader';
 
 import { Component, AfterContentInit, OnDestroy, Input, Output, ElementRef, ViewChild, EventEmitter } from '@angular/core';
 
@@ -15,7 +14,7 @@ import * as DOM from 'vs/base/browser/dom';
 import { Disposable } from 'vs/base/common/lifecycle';
 
 import { TabComponent } from './tab.component';
-import { CloseTabAction } from './tabActions';
+import { CloseTabAction } from 'sql/base/browser/ui/panel/tabActions';
 
 @Component({
 	selector: 'tab-header',

src/sql/platform/dialog/dialog.module.ts

@@ -20,10 +20,10 @@ import { ModelComponentWrapper } from 'sql/workbench/electron-browser/modelCompo
 import { ComponentHostDirective } from 'sql/workbench/parts/dashboard/common/componentHost.directive';
 import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/bootstrap/node/bootstrapService';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
-import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
 import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
-import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
+import { Checkbox } from 'sql/base/electron-browser/ui/checkbox/checkbox.component';
+import { SelectBox } from 'sql/platform/ui/electron-browser/selectBox/selectBox.component';
+import { InputBox } from 'sql/base/electron-browser/ui/inputBox/inputBox.component';
 
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { Registry } from 'vs/platform/registry/common/platform';

src/sql/platform/dialog/dialogPane.ts

@@ -40,7 +40,7 @@ export class DialogPane extends Disposable implements IThemable {
 		private _content: string | DialogTab[],
 		private _validityChangedCallback: (valid: boolean) => void,
 		private _instantiationService: IInstantiationService,
-		private themeService: IThemeService,
+		private _themeService: IThemeService,
 		public displayPageTitle: boolean,
 		public description?: string,
 	) {
@@ -54,7 +54,7 @@ export class DialogPane extends Disposable implements IThemable {
 			this.initializeModelViewContainer(this._body, modelViewId);
 		} else {
 			this._tabbedPanel = new TabbedPanel(this._body);
-			attachTabbedPanelStyler(this._tabbedPanel, this.themeService);
+			attachTabbedPanelStyler(this._tabbedPanel, this._themeService);
 			this._content.forEach((tab, tabIndex) => {
 				if (this._selectedTabIndex === tabIndex) {
 					this._selectedTabContent = tab.content;

src/sql/workbench/electron-browser/modelComponents/dropdown.component.ts

@@ -19,7 +19,6 @@ import { attachSelectBoxStyler } from 'vs/platform/theme/common/styler';
 
 import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/workbenchThemeService';
 import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
-import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
 
 @Component({
 	selector: 'modelview-dropdown',
@@ -43,8 +42,7 @@ export default class DropDownComponent extends ComponentBase implements ICompone
 		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
 		@Inject(IWorkbenchThemeService) private themeService: IWorkbenchThemeService,
 		@Inject(IContextViewService) private contextViewService: IContextViewService,
-		@Inject(forwardRef(() => ElementRef)) el: ElementRef,
-		@Inject(ILayoutService) private readonly layoutService: ILayoutService
+		@Inject(forwardRef(() => ElementRef)) el: ElementRef
 	) {
 		super(changeRef, el);
 	}

src/sql/workbench/electron-browser/modelComponents/modelViewInput.ts

@@ -65,7 +65,6 @@ export class ModelViewInput extends EditorInput {
 		this._container = document.createElement('div');
 		this._container.id = `modelView-${_model.modelViewId}`;
 		this.layoutService.getContainer(Parts.EDITOR_PART).appendChild(this._container);
-
 	}
 
 	public get title(): string {

src/sql/workbench/parts/dashboard/common/dashboardPage.component.ts

@@ -12,10 +12,10 @@ import { DashboardServiceInterface } from 'sql/workbench/parts/dashboard/service
 import { CommonServiceInterface, SingleConnectionManagementService } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
 import { WidgetConfig, TabConfig, TabSettingConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { IPropertiesConfig } from 'sql/workbench/parts/dashboard/pages/serverDashboardPage.contribution';
-import { PanelComponent } from 'sql/base/browser/ui/panel/panel.component';
+import { PanelComponent } from 'sql/base/electron-browser/ui/panel/panel.component';
 import { IDashboardRegistry, Extensions as DashboardExtensions, IDashboardTab } from 'sql/platform/dashboard/common/dashboardRegistry';
 import { PinUnpinTabAction, AddFeatureTabAction } from './actions';
-import { TabComponent, TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabComponent, TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { AngularEventType, IAngularEventingService } from 'sql/platform/angularEventing/common/angularEventingService';
 import { DashboardTab, IConfigModifierCollection } from 'sql/workbench/parts/dashboard/common/interfaces';
 import * as dashboardHelper from 'sql/workbench/parts/dashboard/common/dashboardHelper';

src/sql/workbench/parts/dashboard/common/interfaces.ts

@@ -8,7 +8,7 @@ import { OnDestroy } from '@angular/core';
 import { Event } from 'vs/base/common/event';
 import { IContextKeyService } from 'vs/platform/contextkey/common/contextkey';
 
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { SingleConnectionManagementService } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
 
 export enum Conditional {

src/sql/workbench/parts/dashboard/containers/dashboardControlHostContainer.component.ts

@@ -12,7 +12,7 @@ import { Event, Emitter } from 'vs/base/common/event';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { TabConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { ControlHostContent } from 'sql/workbench/parts/dashboard/contents/controlHostContent.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 @Component({
 	selector: 'dashboard-controlhost-container',

src/sql/workbench/parts/dashboard/containers/dashboardErrorContainer.component.ts

@@ -9,7 +9,7 @@ import { Component, Inject, Input, forwardRef, ViewChild, ElementRef, ChangeDete
 
 import { TabConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 import { Event, Emitter } from 'vs/base/common/event';
 import * as nls from 'vs/nls';

src/sql/workbench/parts/dashboard/containers/dashboardGridContainer.component.ts

@@ -12,7 +12,7 @@ import { TabConfig, WidgetConfig } from 'sql/workbench/parts/dashboard/common/da
 import { DashboardWidgetWrapper } from 'sql/workbench/parts/dashboard/contents/dashboardWidgetWrapper.component';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { WebviewContent } from 'sql/workbench/parts/dashboard/contents/webviewContent.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 import { Event, Emitter } from 'vs/base/common/event';
 

src/sql/workbench/parts/dashboard/containers/dashboardHomeContainer.component.ts

@@ -13,8 +13,8 @@ import { DashboardServiceInterface } from 'sql/workbench/parts/dashboard/service
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
 import { AngularEventType, IAngularEventingService } from 'sql/platform/angularEventing/common/angularEventingService';
 import { DashboardWidgetWrapper } from 'sql/workbench/parts/dashboard/contents/dashboardWidgetWrapper.component';
-import { ScrollableDirective } from 'sql/base/browser/ui/scrollable/scrollable.directive';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { ScrollableDirective } from 'sql/base/electron-browser/ui/scrollable/scrollable.directive';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 import { ConfigurationTarget, IConfigurationService } from 'vs/platform/configuration/common/configuration';
 import { ScrollbarVisibility } from 'vs/editor/common/standalone/standaloneEnums';

src/sql/workbench/parts/dashboard/containers/dashboardModelViewContainer.component.ts

@@ -12,7 +12,7 @@ import { Event, Emitter } from 'vs/base/common/event';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { TabConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { ModelViewContent } from 'sql/workbench/electron-browser/modelComponents/modelViewContent.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 @Component({
 	selector: 'dashboard-modelview-container',

src/sql/workbench/parts/dashboard/containers/dashboardNavSection.component.ts

@@ -9,8 +9,8 @@ import { Component, Inject, Input, forwardRef, ViewChild, ElementRef, ViewChildr
 
 import { CommonServiceInterface, SingleConnectionManagementService } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
 import { WidgetConfig, TabConfig, NavSectionConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
-import { PanelComponent, IPanelOptions, NavigationBarLayout } from 'sql/base/browser/ui/panel/panel.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { PanelComponent, IPanelOptions, NavigationBarLayout } from 'sql/base/electron-browser/ui/panel/panel.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { DashboardTab, IConfigModifierCollection } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { WIDGETS_CONTAINER } from 'sql/workbench/parts/dashboard/containers/dashboardWidgetContainer.contribution';
 import { GRID_CONTAINER } from 'sql/workbench/parts/dashboard/containers/dashboardGridContainer.contribution';

src/sql/workbench/parts/dashboard/containers/dashboardWebviewContainer.component.ts

@@ -12,7 +12,7 @@ import { Event, Emitter } from 'vs/base/common/event';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { TabConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { WebviewContent } from 'sql/workbench/parts/dashboard/contents/webviewContent.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 @Component({
 	selector: 'dashboard-webview-container',

src/sql/workbench/parts/dashboard/containers/dashboardWidgetContainer.component.ts

@@ -10,7 +10,7 @@ import { Component, Inject, Input, forwardRef, ViewChild, OnDestroy, ChangeDetec
 import { TabConfig, WidgetConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { DashboardTab } from 'sql/workbench/parts/dashboard/common/interfaces';
 import { WidgetContent } from 'sql/workbench/parts/dashboard/contents/widgetContent.component';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 
 import { Event, Emitter } from 'vs/base/common/event';
 

src/sql/workbench/parts/dashboard/dashboard.module.ts

@@ -44,8 +44,8 @@ import { WidgetContent } from 'sql/workbench/parts/dashboard/contents/widgetCont
 import { ModelViewContent } from 'sql/workbench/electron-browser/modelComponents/modelViewContent.component';
 import { ModelComponentWrapper } from 'sql/workbench/electron-browser/modelComponents/modelComponentWrapper.component';
 import { WebviewContent } from 'sql/workbench/parts/dashboard/contents/webviewContent.component';
-import { BreadcrumbComponent } from 'sql/base/browser/ui/breadcrumb/breadcrumb.component';
-import { IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
+import { BreadcrumbComponent } from 'sql/base/electron-browser/ui/breadcrumb/breadcrumb.component';
+import { IBreadcrumbService } from 'sql/base/electron-browser/ui/breadcrumb/interfaces';
 import { DashboardHomeContainer } from 'sql/workbench/parts/dashboard/containers/dashboardHomeContainer.component';
 import { ControlHostContent } from 'sql/workbench/parts/dashboard/contents/controlHostContent.component';
 import { DashboardControlHostContainer } from 'sql/workbench/parts/dashboard/containers/dashboardControlHostContainer.component';
@@ -55,11 +55,11 @@ import { AlertsViewComponent } from 'sql/workbench/parts/jobManagement/electron-
 import { JobHistoryComponent } from 'sql/workbench/parts/jobManagement/electron-browser/jobHistory.component';
 import { OperatorsViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/operatorsView.component';
 import { ProxiesViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/proxiesView.component';
-import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
-import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
-import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
-import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
 import LoadingSpinner from 'sql/workbench/electron-browser/modelComponents/loadingSpinner.component';
+import { Checkbox } from 'sql/base/electron-browser/ui/checkbox/checkbox.component';
+import { SelectBox } from 'sql/platform/ui/electron-browser/selectBox/selectBox.component';
+import { InputBox } from 'sql/base/electron-browser/ui/inputBox/inputBox.component';
+import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
 
 const baseComponents = [DashboardHomeContainer, DashboardComponent, DashboardWidgetWrapper, DashboardWebviewContainer,
 	DashboardWidgetContainer, DashboardGridContainer, DashboardErrorContainer, DashboardNavSection, ModelViewContent, WebviewContent, WidgetContent,
@@ -68,9 +68,9 @@ const baseComponents = [DashboardHomeContainer, DashboardComponent, DashboardWid
 	DashboardModelViewContainer, ModelComponentWrapper, Checkbox, EditableDropDown, SelectBox, InputBox, LoadingSpinner];
 
 /* Panel */
-import { PanelModule } from 'sql/base/browser/ui/panel/panel.module';
+import { PanelModule } from 'sql/base/electron-browser/ui/panel/panel.module';
 
-import { ScrollableModule } from 'sql/base/browser/ui/scrollable/scrollable.module';
+import { ScrollableModule } from 'sql/base/electron-browser/ui/scrollable/scrollable.module';
 
 /* Pages */
 import { ServerDashboardPage } from 'sql/workbench/parts/dashboard/pages/serverDashboardPage.component';

src/sql/workbench/parts/dashboard/pages/databaseDashboardPage.component.ts

@@ -7,7 +7,7 @@ import { OnInit, Inject, forwardRef, ChangeDetectorRef, ElementRef } from '@angu
 
 import { DashboardPage } from 'sql/workbench/parts/dashboard/common/dashboardPage.component';
 import { BreadcrumbClass } from 'sql/workbench/parts/dashboard/services/breadcrumb.service';
-import { IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
+import { IBreadcrumbService } from 'sql/base/electron-browser/ui/breadcrumb/interfaces';
 import { DashboardServiceInterface } from 'sql/workbench/parts/dashboard/services/dashboardServiceInterface.service';
 import { WidgetConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';

src/sql/workbench/parts/dashboard/pages/serverDashboardPage.component.ts

@@ -7,7 +7,7 @@ import { OnInit, Inject, forwardRef, ChangeDetectorRef, ElementRef } from '@angu
 
 import { DashboardPage } from 'sql/workbench/parts/dashboard/common/dashboardPage.component';
 import { BreadcrumbClass } from 'sql/workbench/parts/dashboard/services/breadcrumb.service';
-import { IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
+import { IBreadcrumbService } from 'sql/base/electron-browser/ui/breadcrumb/interfaces';
 import { WidgetConfig } from 'sql/workbench/parts/dashboard/common/dashboardWidget';
 import { DashboardServiceInterface } from 'sql/workbench/parts/dashboard/services/dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';

src/sql/workbench/parts/dashboard/services/breadcrumb.service.ts

@@ -8,7 +8,7 @@ import { Subject } from 'rxjs/Subject';
 
 import { DashboardServiceInterface } from './dashboardServiceInterface.service';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { MenuItem, IBreadcrumbService } from 'sql/base/browser/ui/breadcrumb/interfaces';
+import { MenuItem, IBreadcrumbService } from 'sql/base/electron-browser/ui/breadcrumb/interfaces';
 import { ConnectionProfile } from 'sql/platform/connection/common/connectionProfile';
 
 import * as nls from 'vs/nls';

src/sql/workbench/parts/jobManagement/electron-browser/agentView.component.ts

@@ -8,7 +8,7 @@ import 'vs/css!./media/jobs';
 import * as nls from 'vs/nls';
 import { Component, Inject, forwardRef, ChangeDetectorRef, ViewChild, Injectable } from '@angular/core';
 import { AgentJobInfo } from 'azdata';
-import { PanelComponent, IPanelOptions, NavigationBarLayout } from 'sql/base/browser/ui/panel/panel.component';
+import { PanelComponent, IPanelOptions, NavigationBarLayout } from 'sql/base/electron-browser/ui/panel/panel.component';
 import { IJobManagementService } from 'sql/platform/jobManagement/common/interfaces';
 import { IDashboardService } from 'sql/platform/dashboard/browser/dashboardService';
 

src/sql/workbench/parts/jobManagement/electron-browser/alertsView.component.ts

@@ -9,7 +9,7 @@ import * as dom from 'vs/base/browser/dom';
 import * as nls from 'vs/nls';
 import * as azdata from 'azdata';
 import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, OnInit, OnDestroy } from '@angular/core';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { Table } from 'sql/base/browser/ui/table/table';
 import { AgentViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/agentView.component';
 import { IJobManagementService } from 'sql/platform/jobManagement/common/interfaces';

src/sql/workbench/parts/jobManagement/electron-browser/jobHistory.component.ts

@@ -28,7 +28,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti
 import { ScrollbarVisibility } from 'vs/base/common/scrollable';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { JobManagementView } from 'sql/workbench/parts/jobManagement/electron-browser/jobManagementView';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { IDashboardService } from 'sql/platform/dashboard/browser/dashboardService';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';

src/sql/workbench/parts/jobManagement/electron-browser/jobManagementView.ts

@@ -15,7 +15,7 @@ import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { Taskbar } from 'sql/base/browser/ui/taskbar/taskbar';
 import { JobsRefreshAction, IJobActionInfo } from 'sql/platform/jobManagement/common/jobActions';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { IDashboardService } from 'sql/platform/dashboard/browser/dashboardService';
 
 export abstract class JobManagementView extends TabChild implements AfterContentChecked {

src/sql/workbench/parts/jobManagement/electron-browser/jobStepsView.component.ts

@@ -22,7 +22,7 @@ import { IDashboardService } from 'sql/platform/dashboard/browser/dashboardServi
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import * as TelemetryKeys from 'sql/platform/telemetry/telemetryKeys';
 

src/sql/workbench/parts/jobManagement/electron-browser/jobsView.component.ts

@@ -9,7 +9,7 @@ import * as azdata from 'azdata';
 import * as nls from 'vs/nls';
 import * as dom from 'vs/base/browser/dom';
 import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, OnInit, OnDestroy } from '@angular/core';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { Table } from 'sql/base/browser/ui/table/table';
 import { AgentViewComponent } from 'sql/workbench/parts/jobManagement/electron-browser/agentView.component';
 import { RowDetailView } from 'sql/base/browser/ui/table/plugins/rowDetailView';
@@ -31,6 +31,7 @@ import { IWorkbenchThemeService, IColorTheme } from 'vs/workbench/services/theme
 import { tableBackground, cellBackground, cellBorderColor } from 'sql/platform/theme/common/colors';
 import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry';
 import * as TelemetryKeys from 'sql/platform/telemetry/telemetryKeys';
+import { attachButtonStyler } from 'sql/platform/theme/common/styler';
 
 export const JOBSVIEW_SELECTOR: string = 'jobsview-component';
 export const ROW_HEIGHT: number = 45;
@@ -172,7 +173,8 @@ export class JobsViewComponent extends JobManagementView implements OnInit, OnDe
 		});
 		this.rowDetail = rowDetail;
 		columns.unshift(this.rowDetail.getColumnDefinition());
-		let filterPlugin = new HeaderFilter({}, this._themeService);
+		let filterPlugin = new HeaderFilter({});
+		this._register(attachButtonStyler(filterPlugin, this._themeService));
 		this.filterPlugin = filterPlugin;
 		jQuery(this._gridEl.nativeElement).empty();
 		jQuery(this.actionBarContainer.nativeElement).empty();

src/sql/workbench/parts/jobManagement/electron-browser/operatorsView.component.ts

@@ -15,7 +15,7 @@ import { IJobManagementService } from 'sql/platform/jobManagement/common/interfa
 import { EditOperatorAction, DeleteOperatorAction, NewOperatorAction } from 'sql/platform/jobManagement/common/jobActions';
 import { JobManagementView } from 'sql/workbench/parts/jobManagement/electron-browser/jobManagementView';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { ICommandService } from 'vs/platform/commands/common/commands';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';

src/sql/workbench/parts/jobManagement/electron-browser/proxiesView.component.ts

@@ -14,7 +14,7 @@ import { AgentViewComponent } from 'sql/workbench/parts/jobManagement/electron-b
 import { IJobManagementService } from 'sql/platform/jobManagement/common/interfaces';
 import { EditProxyAction, DeleteProxyAction, NewProxyAction } from 'sql/platform/jobManagement/common/jobActions';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
+import { TabChild } from 'sql/base/electron-browser/ui/panel/tab.component';
 import { JobManagementView } from 'sql/workbench/parts/jobManagement/electron-browser/jobManagementView';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';

src/sql/workbench/parts/notebook/notebook.module.ts

@@ -3,21 +3,15 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-'use strict';
-
 import { forwardRef, NgModule, ComponentFactoryResolver, Inject, ApplicationRef } from '@angular/core';
 import { FormsModule } from '@angular/forms';
 import { CommonModule, APP_BASE_HREF } from '@angular/common';
 import { BrowserModule } from '@angular/platform-browser';
 
-
 import { ComponentHostDirective } from 'sql/workbench/parts/dashboard/common/componentHost.directive';
 import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/bootstrap/node/bootstrapService';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
-import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
 import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
-import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
 import { NotebookComponent } from 'sql/workbench/parts/notebook/notebook.component';
 
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
@@ -29,6 +23,9 @@ import { OutputComponent } from 'sql/workbench/parts/notebook/cellViews/output.c
 import { StdInComponent } from 'sql/workbench/parts/notebook/cellViews/stdin.component';
 import { PlaceholderCellComponent } from 'sql/workbench/parts/notebook/cellViews/placeholderCell.component';
 import LoadingSpinner from 'sql/workbench/electron-browser/modelComponents/loadingSpinner.component';
+import { Checkbox } from 'sql/base/electron-browser/ui/checkbox/checkbox.component';
+import { SelectBox } from 'sql/platform/ui/electron-browser/selectBox/selectBox.component';
+import { InputBox } from 'sql/base/electron-browser/ui/inputBox/inputBox.component';
 
 export const NotebookModule = (params, selector: string, instantiationService: IInstantiationService): any => {
 	@NgModule({

src/sql/workbench/parts/query/browser/queryActions.ts

@@ -28,7 +28,6 @@ import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox';
 import { attachEditableDropdownStyler, attachSelectBoxStyler } from 'sql/platform/theme/common/styler';
 import { EventEmitter } from 'sql/base/common/eventEmitter';
 import { Dropdown } from 'sql/base/parts/editableDropdown/browser/dropdown';
-import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
 
 /**
  * Action class that query-based Actions will extend. This base class automatically handles activating and
@@ -449,8 +448,7 @@ export class ListDatabasesActionItem extends EventEmitter implements IActionItem
 		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService,
 		@INotificationService private _notificationService: INotificationService,
 		@IContextViewService contextViewProvider: IContextViewService,
-		@IConfigurationService private readonly _configurationService: IConfigurationService,
-		@ILayoutService layoutService: ILayoutService
+		@IConfigurationService private readonly _configurationService: IConfigurationService
 	) {
 		super();
 		this._toDispose = [];

src/sql/workbench/parts/query/browser/queryResultsView.ts

@@ -173,14 +173,15 @@ export class QueryResultsView extends Disposable {
 
 	constructor(
 		container: HTMLElement,
+		@IThemeService themeService: IThemeService,
 		@IInstantiationService private instantiationService: IInstantiationService,
-		@IQueryModelService private queryModelService: IQueryModelService,
-		@IThemeService themeService: IThemeService
+		@IQueryModelService private queryModelService: IQueryModelService
 	) {
 		super();
 		this.resultsTab = this._register(new ResultsTab(instantiationService));
 		this.chartTab = this._register(new ChartTab(instantiationService));
 		this._panelView = this._register(new TabbedPanel(container, { showHeaderWhenSingleView: false }));
+		attachTabbedPanelStyler(this._panelView, themeService);
 		this.qpTab = this._register(new QueryPlanTab());
 		this.topOperationsTab = this._register(new TopOperationsTab(instantiationService));
 

src/sql/workbench/parts/query/modelViewTab/queryModelViewTab.module.ts

@@ -16,14 +16,14 @@ import { ModelComponentWrapper } from 'sql/workbench/electron-browser/modelCompo
 import { ComponentHostDirective } from 'sql/workbench/parts/dashboard/common/componentHost.directive';
 import { IBootstrapParams, ISelector, providerIterator } from 'sql/platform/bootstrap/node/bootstrapService';
 import { CommonServiceInterface } from 'sql/platform/bootstrap/node/commonServiceInterface.service';
-import { Checkbox } from 'sql/base/browser/ui/checkbox/checkbox.component';
-import { SelectBox } from 'sql/base/browser/ui/selectBox/selectBox.component';
 import { EditableDropDown } from 'sql/platform/electron-browser/editableDropdown/editableDropdown.component';
-import { InputBox } from 'sql/base/browser/ui/inputBox/inputBox.component';
+import { QueryModelViewTabContainer } from 'sql/workbench/parts/query/modelViewTab/queryModelViewTabContainer.component';
+import { Checkbox } from 'sql/base/electron-browser/ui/checkbox/checkbox.component';
+import { SelectBox } from 'sql/platform/ui/electron-browser/selectBox/selectBox.component';
+import { InputBox } from 'sql/base/electron-browser/ui/inputBox/inputBox.component';
 
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { Registry } from 'vs/platform/registry/common/platform';
-import { QueryModelViewTabContainer } from 'sql/workbench/parts/query/modelViewTab/queryModelViewTabContainer.component';
 
 export const QueryModelViewTabModule = (params, selector: string, instantiationService: IInstantiationService): any => {
 

src/sql/workbench/services/connection/browser/cmsConnectionWidget.ts

@@ -51,7 +51,7 @@ export class CmsConnectionWidget extends ConnectionWidget {
 		@IConfigurationService _configurationService: IConfigurationService,
 		@IAccountManagementService _accountManagementService: IAccountManagementService
 	) {
-		super(options, callbacks, providerName, _themeService, _contextViewService, _layoutService, _connectionManagementService, _capabilitiesService,
+		super(options, callbacks, providerName, _themeService, _contextViewService, _connectionManagementService, _capabilitiesService,
 			_clipboardService, _configurationService, _accountManagementService);
 		let authTypeOption = this._optionsMaps[ConnectionOptionSpecialType.authType];
 		if (authTypeOption) {

src/sql/workbench/services/connection/browser/connectionWidget.ts

@@ -34,7 +34,6 @@ import { MessageType } from 'vs/base/browser/ui/inputbox/inputBox';
 import { endsWith, startsWith } from 'vs/base/common/strings';
 import { IClipboardService } from 'vs/platform/clipboard/common/clipboardService';
 import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
-import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
 
 export class ConnectionWidget {
 	private _previousGroupOption: string;
@@ -98,7 +97,6 @@ export class ConnectionWidget {
 		providerName: string,
 		@IThemeService protected _themeService: IThemeService,
 		@IContextViewService protected _contextViewService: IContextViewService,
-		@ILayoutService private _layoutService: ILayoutService,
 		@IConnectionManagementService private _connectionManagementService: IConnectionManagementService,
 		@ICapabilitiesService private _capabilitiesService: ICapabilitiesService,
 		@IClipboardService private _clipboardService: IClipboardService,