Feat/model backed ui (#1145)

This is an initial PR for a new model-driven UI where extensions can provide definitions of the components & how they're laid out using Containers.
#1140, #1141, #1142, #1143 and #1144 are all tracking additional work needed to improve the initial implementation and fix some issues with the implementation.

Features:
- Supports defining a FlexContainer that maps to a flexbox-based layout.
- Supports creating a card component, which is a key-value pair based control that will lay out simple information to a user. Eventually this will have an optional set of actions associated with it.
- Has a sample project which shows how to use the API and was used for verification

src/sql/parts/modelComponents/modelViewContent.component.ts

@@ -0,0 +1,80 @@
+/*---------------------------------------------------------------------------------------------
+*  Copyright (c) Microsoft Corporation. All rights reserved.
+*  Licensed under the Source EULA. See License.txt in the project root for license information.
+*--------------------------------------------------------------------------------------------*/
+// import 'vs/css!./modelViewContent';
+
+import { Component, forwardRef, Input, OnInit, Inject, ChangeDetectorRef, ElementRef } from '@angular/core';
+
+import Event, { Emitter } from 'vs/base/common/event';
+import { Parts } from 'vs/workbench/services/part/common/partService';
+import { IDisposable, Disposable } from 'vs/base/common/lifecycle';
+import { addDisposableListener, EventType } from 'vs/base/browser/dom';
+import { memoize } from 'vs/base/common/decorators';
+import nls = require('vs/nls');
+
+import { DashboardTab } from 'sql/parts/dashboard/common/interfaces';
+import { TabConfig } from 'sql/parts/dashboard/common/dashboardWidget';
+import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
+import { IModelView } from 'sql/services/model/modelViewService';
+import { AngularDisposable } from 'sql/base/common/lifecycle';
+
+import * as sqlops from 'sqlops';
+import { ViewBase } from 'sql/parts/modelComponents/viewBase';
+
+@Component({
+	selector: 'modelview-content',
+	template: `
+		<div *ngIf="rootDescriptor">
+			<model-component-wrapper [descriptor]="rootDescriptor" [modelStore]="modelStore">
+			</model-component-wrapper>
+		</div>
+	`
+})
+export class ModelViewContent extends ViewBase implements OnInit, IModelView {
+	@Input() private modelViewId: string;
+
+	private _onResize = new Emitter<void>();
+	public readonly onResize: Event<void> = this._onResize.event;
+	private _onMessage = new Emitter<string>();
+	public readonly onMessage: Event<string> = this._onMessage.event;
+
+	private _onMessageDisposable: IDisposable;
+
+	constructor(
+		@Inject(forwardRef(() => DashboardServiceInterface)) private _dashboardService: DashboardServiceInterface,
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef
+	) {
+		super(changeRef);
+	}
+
+	ngOnInit() {
+		this._dashboardService.dashboardViewService.registerModelView(this);
+		this._register(addDisposableListener(window, EventType.RESIZE, e => {
+			this.layout();
+		}));
+	}
+
+	public layout(): void {
+	}
+
+	public get id(): string {
+		return this.modelViewId;
+	}
+
+	@memoize
+	public get connection(): sqlops.connection.Connection {
+		let currentConnection = this._dashboardService.connectionManagementService.connectionInfo.connectionProfile;
+		let connection: sqlops.connection.Connection = {
+			providerName: currentConnection.providerName,
+			connectionId: currentConnection.id,
+			options: currentConnection.options
+		};
+		return connection;
+	}
+
+	@memoize
+	public get serverInfo(): sqlops.ServerInfo {
+		return this._dashboardService.connectionManagementService.connectionInfo.serverInfo;
+	}
+}