Inital platform relayering (#6385)

* moving test files and inital refactoring * relayer extension host code * fix imports * make insights work * relayer dashboard * relayer notebooks * moveing more code around * formatting * accept angular as browser * fix serializer * add missing files * remove declarations from extensions * fix build errors * more relayering * change urls to relative to help code relayering * remove layering to prep for merge * fix hygiene errors * fix hygiene errors * fix tests
2026-01-16 09:35:36 -05:00 · 2019-07-18 17:29:17 -07:00
parent 45c13116de
commit c23738f935
576 changed files with 2090 additions and 2788 deletions
--- a/src/sql/workbench/browser/modelComponents/flexContainer.component.ts
+++ b/src/sql/workbench/browser/modelComponents/flexContainer.component.ts
@@ -0,0 +1,119 @@
+/*---------------------------------------------------------------------------------------------
+ *  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!./media/flexContainer';
+
+import {
+	Component, Input, Inject, ChangeDetectorRef, forwardRef,
+	ElementRef, OnDestroy
+} from '@angular/core';
+
+import { IComponent, IComponentDescriptor, IModelStore } from 'sql/workbench/browser/modelComponents/interfaces';
+import { FlexLayout, FlexItemLayout } from 'azdata';
+
+import { ContainerBase } from 'sql/workbench/browser/modelComponents/componentBase';
+
+export class FlexItem {
+	constructor(public descriptor: IComponentDescriptor, public config: FlexItemLayout) { }
+}
+
+@Component({
+	template: `
+		<div *ngIf="items" class="flexContainer" [style.flexFlow]="flexFlow" [style.justifyContent]="justifyContent" [style.position]="position"
+				[style.alignItems]="alignItems" [style.alignContent]="alignContent" [style.height]="height" [style.width]="width">
+			<div *ngFor="let item of items" [style.flex]="getItemFlex(item)" [style.textAlign]="textAlign" [style.order]="getItemOrder(item)" [ngStyle]="getItemStyles(item)">
+				<model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore">
+				</model-component-wrapper>
+			</div>
+		</div>
+	`
+})
+export default class FlexContainer extends ContainerBase<FlexItemLayout> implements IComponent, OnDestroy {
+	@Input() descriptor: IComponentDescriptor;
+	@Input() modelStore: IModelStore;
+	private _flexFlow: string;
+	private _justifyContent: string;
+	private _alignItems: string;
+	private _alignContent: string;
+	private _textAlign: string;
+	private _height: string;
+	private _width: string;
+	private _position: string;
+
+	constructor(
+		@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
+		@Inject(forwardRef(() => ElementRef)) el: ElementRef
+	) {
+		super(changeRef, el);
+		this._flexFlow = '';	// default
+		this._justifyContent = '';	// default
+	}
+
+	ngOnInit(): void {
+		this.baseInit();
+	}
+
+	ngOnDestroy(): void {
+		this.baseDestroy();
+	}
+
+
+	/// IComponent implementation
+
+	public setLayout(layout: FlexLayout): void {
+		this._flexFlow = layout.flexFlow ? layout.flexFlow : '';
+		this._justifyContent = layout.justifyContent ? layout.justifyContent : '';
+		this._alignItems = layout.alignItems ? layout.alignItems : '';
+		this._alignContent = layout.alignContent ? layout.alignContent : '';
+		this._textAlign = layout.textAlign ? layout.textAlign : '';
+		this._position = layout.position ? layout.position : '';
+		this._height = this.convertSize(layout.height);
+		this._width = this.convertSize(layout.width);
+
+		this.layout();
+	}
+
+	// CSS-bound properties
+	public get flexFlow(): string {
+		return this._flexFlow;
+	}
+
+	public get justifyContent(): string {
+		return this._justifyContent;
+	}
+
+	public get alignItems(): string {
+		return this._alignItems;
+	}
+
+	public get height(): string {
+		return this._height;
+	}
+
+	public get width(): string {
+		return this._width;
+	}
+
+	public get alignContent(): string {
+		return this._alignContent;
+	}
+
+	public get textAlign(): string {
+		return this._textAlign;
+	}
+
+	public get position(): string {
+		return this._position;
+	}
+
+	private getItemFlex(item: FlexItem): string {
+		return item.config ? item.config.flex : '1 1 auto';
+	}
+	private getItemOrder(item: FlexItem): number {
+		return item.config ? item.config.order : 0;
+	}
+	private getItemStyles(item: FlexItem): { [key: string]: string } {
+		return item.config && item.config.CSSStyles ? item.config.CSSStyles : {};
+	}
+}