diff --git a/extensions/dacpac/src/test/testContext.ts b/extensions/dacpac/src/test/testContext.ts index 88ff1ffe01..523b226b8a 100644 --- a/extensions/dacpac/src/test/testContext.ts +++ b/extensions/dacpac/src/test/testContext.ts @@ -113,9 +113,16 @@ export function createViewContext(): ViewTestContext { onDidClick: onClick.event }); - let buttonBuilder: azdata.ComponentBuilder = { + let buttonBuilder: azdata.ComponentBuilder = { component: () => button, - withProperties: (properties) => { + withProperties: (properties: any) => { + if ((properties as any).label === '•••') { + button.label = '•••'; + button.onDidClick = fileButtonOnClick.event; + } + return buttonBuilder; + }, + withProps: (properties) => { if ((properties as any).label === '•••') { button.label = '•••'; button.onDidClick = fileButtonOnClick.event; @@ -127,8 +134,9 @@ export function createViewContext(): ViewTestContext { let radioButtonBuilder = () => { let button = radioButton(); - let builder: azdata.ComponentBuilder = { + let builder: azdata.ComponentBuilder = { component: () => button, + withProps: () => undefined, withProperties: (properties) => { switch ((properties as any).label) { case loc.newDatabase: @@ -163,9 +171,10 @@ export function createViewContext(): ViewTestContext { return builder; }; - let checkBoxBuilder: azdata.ComponentBuilder = { + let checkBoxBuilder: azdata.ComponentBuilder = { component: () => checkbox, withProperties: () => checkBoxBuilder, + withProps: () => checkBoxBuilder, withValidation: () => checkBoxBuilder }; let inputBox: () => azdata.InputBoxComponent = () => Object.assign({}, componentBase, { @@ -193,17 +202,19 @@ export function createViewContext(): ViewTestContext { component: undefined! }); - let tableBuilder: azdata.ComponentBuilder = { + let tableBuilder: azdata.ComponentBuilder = { component: () => table(), withProperties: () => tableBuilder, - withValidation: () => tableBuilder + withValidation: () => tableBuilder, + withProps: () => tableBuilder }; let loadingBuilder: azdata.LoadingComponentBuilder = { component: () => loadingComponent(), withProperties: () => loadingBuilder, withValidation: () => loadingBuilder, - withItem: () => loadingBuilder + withItem: () => loadingBuilder, + withProps: () => loadingBuilder }; let formBuilder: azdata.FormBuilder = Object.assign({}, { @@ -216,7 +227,8 @@ export function createViewContext(): ViewTestContext { withProperties: () => formBuilder, withValidation: () => formBuilder, withItems: () => formBuilder, - withLayout: () => formBuilder + withLayout: () => formBuilder, + withProps: () => formBuilder }); let flexBuilder: azdata.FlexBuilder = Object.assign({}, { @@ -224,32 +236,37 @@ export function createViewContext(): ViewTestContext { withProperties: () => flexBuilder, withValidation: () => flexBuilder, withItems: () => flexBuilder, - withLayout: () => flexBuilder + withLayout: () => flexBuilder, + withProps: () => flexBuilder }); + let divBuilder: azdata.DivBuilder = Object.assign({}, { component: () => div, withProperties: () => divBuilder, withValidation: () => divBuilder, withItems: () => divBuilder, - withLayout: () => divBuilder + withLayout: () => divBuilder, + withProps: () => divBuilder }); - let inputBoxBuilder: azdata.ComponentBuilder = { + let inputBoxBuilder: azdata.ComponentBuilder = { component: () => { let r = inputBox(); return r; }, withProperties: () => inputBoxBuilder, - withValidation: () => inputBoxBuilder + withValidation: () => inputBoxBuilder, + withProps: () => inputBoxBuilder }; - let dropdownBuilder: azdata.ComponentBuilder = { + let dropdownBuilder: azdata.ComponentBuilder = { component: () => { let r = dropdown(); return r; }, withProperties: () => dropdownBuilder, - withValidation: () => dropdownBuilder + withValidation: () => dropdownBuilder, + withProps: () => dropdownBuilder }; let view: azdata.ModelView = { diff --git a/extensions/machine-learning/src/test/views/utils.ts b/extensions/machine-learning/src/test/views/utils.ts index b43f1ee7cd..711461abf1 100644 --- a/extensions/machine-learning/src/test/views/utils.ts +++ b/extensions/machine-learning/src/test/views/utils.ts @@ -62,24 +62,28 @@ export function createViewContext(): ViewTestContext { onDidClick: onClick.event }); - let buttonBuilder: azdata.ComponentBuilder = { + let buttonBuilder: azdata.ComponentBuilder = { component: () => button, withProperties: () => buttonBuilder, - withValidation: () => buttonBuilder + withValidation: () => buttonBuilder, + withProps: () => buttonBuilder }; - let hyperLinkBuilder: azdata.ComponentBuilder = { + let hyperLinkBuilder: azdata.ComponentBuilder = { component: () => link, withProperties: () => hyperLinkBuilder, - withValidation: () => hyperLinkBuilder + withValidation: () => hyperLinkBuilder, + withProps: () => hyperLinkBuilder }; - let radioButtonBuilder: azdata.ComponentBuilder = { + let radioButtonBuilder: azdata.ComponentBuilder = { component: () => radioButton, withProperties: () => radioButtonBuilder, + withProps: () => radioButtonBuilder, withValidation: () => radioButtonBuilder }; - let checkBoxBuilder: azdata.ComponentBuilder = { + let checkBoxBuilder: azdata.ComponentBuilder = { component: () => checkbox, withProperties: () => checkBoxBuilder, + withProps: () => checkBoxBuilder, withValidation: () => checkBoxBuilder }; let inputBox: () => azdata.InputBoxComponent = () => Object.assign({}, componentBase, { @@ -119,17 +123,19 @@ export function createViewContext(): ViewTestContext { collapsed: false, }); - let declarativeTableBuilder: azdata.ComponentBuilder = { + let declarativeTableBuilder: azdata.ComponentBuilder = { component: () => declarativeTable(), withProperties: () => declarativeTableBuilder, - withValidation: () => declarativeTableBuilder + withValidation: () => declarativeTableBuilder, + withProps: () => declarativeTableBuilder }; let loadingBuilder: azdata.LoadingComponentBuilder = { component: () => loadingComponent(), withProperties: () => loadingBuilder, withValidation: () => loadingBuilder, - withItem: () => loadingBuilder + withItem: () => loadingBuilder, + withProps: () => loadingBuilder }; let formBuilder: azdata.FormBuilder = Object.assign({}, { @@ -142,7 +148,8 @@ export function createViewContext(): ViewTestContext { withProperties: () => formBuilder, withValidation: () => formBuilder, withItems: () => formBuilder, - withLayout: () => formBuilder + withLayout: () => formBuilder, + withProps: () => formBuilder }); let flexBuilder: azdata.FlexBuilder = Object.assign({}, { @@ -150,56 +157,63 @@ export function createViewContext(): ViewTestContext { withProperties: () => flexBuilder, withValidation: () => flexBuilder, withItems: () => flexBuilder, - withLayout: () => flexBuilder + withLayout: () => flexBuilder, + withProps: () => flexBuilder }); let divBuilder: azdata.DivBuilder = Object.assign({}, { component: () => div, withProperties: () => divBuilder, withValidation: () => divBuilder, withItems: () => divBuilder, - withLayout: () => divBuilder + withLayout: () => divBuilder, + withProps: () => divBuilder }); - let inputBoxBuilder: azdata.ComponentBuilder = { + let inputBoxBuilder: azdata.ComponentBuilder = { component: () => { let r = inputBox(); return r; }, withProperties: () => inputBoxBuilder, - withValidation: () => inputBoxBuilder + withValidation: () => inputBoxBuilder, + withProps: () => inputBoxBuilder }; - let cardBuilder: azdata.ComponentBuilder = { + let cardBuilder: azdata.ComponentBuilder = { component: () => { let r = card(); return r; }, withProperties: () => cardBuilder, - withValidation: () => cardBuilder + withValidation: () => cardBuilder, + withProps: () => cardBuilder }; let groupBuilder: azdata.GroupBuilder = { component: () => { return group(); }, withProperties: () => groupBuilder, + withProps: () => groupBuilder, withValidation: () => groupBuilder, withItems: () => groupBuilder, withLayout: () => groupBuilder }; - let imageBuilder: azdata.ComponentBuilder = { + let imageBuilder: azdata.ComponentBuilder = { component: () => { let r = image(); return r; }, withProperties: () => imageBuilder, + withProps: () => imageBuilder, withValidation: () => imageBuilder }; - let dropdownBuilder: azdata.ComponentBuilder = { + let dropdownBuilder: azdata.ComponentBuilder = { component: () => { let r = dropdown(); return r; }, withProperties: () => dropdownBuilder, + withProps: () => dropdownBuilder, withValidation: () => dropdownBuilder }; diff --git a/extensions/notebook/src/test/common.ts b/extensions/notebook/src/test/common.ts index 85b0fb3b44..c2ae75d67d 100644 --- a/extensions/notebook/src/test/common.ts +++ b/extensions/notebook/src/test/common.ts @@ -430,22 +430,27 @@ class TestFlexContainer extends TestComponentBase implements azdata.FlexContaine } } -class TestComponentBuilder implements azdata.ComponentBuilder { +class TestComponentBuilder implements azdata.ComponentBuilder { constructor(private _component: T) { } component(): T { return this._component; } - withProperties(properties: U): azdata.ComponentBuilder { + withProperties(properties: U): azdata.ComponentBuilder { this._component.updateProperties(properties); return this; } - withValidation(validation: (component: T) => boolean): azdata.ComponentBuilder { + withValidation(validation: (component: T) => boolean): azdata.ComponentBuilder { + return this; + } + + withProps(properties: TPropertyBag): azdata.ComponentBuilder { + this._component.updateProperties(properties); return this; } } -class TestLoadingBuilder extends TestComponentBuilder implements azdata.LoadingComponentBuilder { +class TestLoadingBuilder extends TestComponentBuilder implements azdata.LoadingComponentBuilder { withItem(component: azdata.Component): azdata.LoadingComponentBuilder { this.component().component = component; return this; @@ -456,12 +461,12 @@ export function createViewContext(): TestContext { let onClick: vscode.EventEmitter = new vscode.EventEmitter(); let form: azdata.FormContainer = new TestFormContainer(); - let textBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestTextComponent()); - let buttonBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestButtonComponent(onClick)); - let radioButtonBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestRadioButtonComponent(onClick)); - let declarativeTableBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestDeclarativeTableComponent(onClick)); + let textBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestTextComponent()); + let buttonBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestButtonComponent(onClick)); + let radioButtonBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestRadioButtonComponent(onClick)); + let declarativeTableBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestDeclarativeTableComponent(onClick)); let loadingBuilder: azdata.LoadingComponentBuilder = new TestLoadingBuilder(new TestLoadingComponent()); - let dropdownBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestDropdownComponent(onClick)); + let dropdownBuilder: azdata.ComponentBuilder = new TestComponentBuilder(new TestDropdownComponent(onClick)); let formBuilder: azdata.FormBuilder = Object.assign({}, { component: () => form, @@ -473,7 +478,8 @@ export function createViewContext(): TestContext { withProperties: () => formBuilder, withValidation: () => formBuilder, withItems: () => formBuilder, - withLayout: () => formBuilder + withLayout: () => formBuilder, + withProps: () => formBuilder }); let div: azdata.DivContainer = new TestDivContainer(); @@ -487,7 +493,8 @@ export function createViewContext(): TestContext { withProperties: () => divBuilder, withValidation: () => divBuilder, withItems: () => divBuilder, - withLayout: () => divBuilder + withLayout: () => divBuilder, + withProps: () => divBuilder }); let flex: azdata.FlexContainer = new TestFlexContainer(); @@ -501,7 +508,8 @@ export function createViewContext(): TestContext { withProperties: () => flexBuilder, withValidation: () => flexBuilder, withItems: () => flexBuilder, - withLayout: () => flexBuilder + withLayout: () => flexBuilder, + withProps: () => flexBuilder }); let view: azdata.ModelView = { diff --git a/extensions/notebook/src/test/managePackages/managePackagesDialog.test.ts b/extensions/notebook/src/test/managePackages/managePackagesDialog.test.ts index e522640ff2..d82d28ab6f 100644 --- a/extensions/notebook/src/test/managePackages/managePackagesDialog.test.ts +++ b/extensions/notebook/src/test/managePackages/managePackagesDialog.test.ts @@ -150,15 +150,17 @@ describe('Manage Package Dialog', () => { let flex: azdata.FlexContainer = Object.assign({}, componentBase, container, { }); - let buttonBuilder: azdata.ComponentBuilder = { + let buttonBuilder: azdata.ComponentBuilder = { component: () => button, withProperties: () => buttonBuilder, - withValidation: () => buttonBuilder + withValidation: () => buttonBuilder, + withProps: () => buttonBuilder }; - let radioButtonBuilder: azdata.ComponentBuilder = { + let radioButtonBuilder: azdata.ComponentBuilder = { component: () => radioButton, withProperties: () => radioButtonBuilder, - withValidation: () => radioButtonBuilder + withValidation: () => radioButtonBuilder, + withProps: () => radioButtonBuilder }; let inputBox: () => azdata.InputBoxComponent = () => Object.assign({}, componentBase, { onTextChanged: undefined!, @@ -187,17 +189,19 @@ describe('Manage Package Dialog', () => { component: undefined! }); - let declarativeTableBuilder: azdata.ComponentBuilder = { + let declarativeTableBuilder: azdata.ComponentBuilder = { component: () => declarativeTable(), withProperties: () => declarativeTableBuilder, - withValidation: () => declarativeTableBuilder + withValidation: () => declarativeTableBuilder, + withProps: () => declarativeTableBuilder }; let loadingBuilder: azdata.LoadingComponentBuilder = { component: () => loadingComponent(), withProperties: () => loadingBuilder, withValidation: () => loadingBuilder, - withItem: () => loadingBuilder + withItem: () => loadingBuilder, + withProps: () => loadingBuilder }; let formBuilder: azdata.FormBuilder = Object.assign({}, { @@ -210,7 +214,8 @@ describe('Manage Package Dialog', () => { withProperties: () => formBuilder, withValidation: () => formBuilder, withItems: () => formBuilder, - withLayout: () => formBuilder + withLayout: () => formBuilder, + withProps: () => formBuilder }); let flexBuilder: azdata.FlexBuilder = Object.assign({}, { @@ -218,32 +223,36 @@ describe('Manage Package Dialog', () => { withProperties: () => flexBuilder, withValidation: () => flexBuilder, withItems: () => flexBuilder, - withLayout: () => flexBuilder + withLayout: () => flexBuilder, + withProps: () => flexBuilder }); - let inputBoxBuilder: azdata.ComponentBuilder = { + let inputBoxBuilder: azdata.ComponentBuilder = { component: () => { let r = inputBox(); return r; }, withProperties: () => inputBoxBuilder, - withValidation: () => inputBoxBuilder + withValidation: () => inputBoxBuilder, + withProps: () => inputBoxBuilder }; - let imageBuilder: azdata.ComponentBuilder = { + let imageBuilder: azdata.ComponentBuilder = { component: () => { let r = image(); return r; }, withProperties: () => imageBuilder, - withValidation: () => imageBuilder + withValidation: () => imageBuilder, + withProps: () => imageBuilder }; - let dropdownBuilder: azdata.ComponentBuilder = { + let dropdownBuilder: azdata.ComponentBuilder = { component: () => { let r = dropdown(); return r; }, withProperties: () => dropdownBuilder, - withValidation: () => dropdownBuilder + withValidation: () => dropdownBuilder, + withProps: () => dropdownBuilder }; let view: azdata.ModelView = { diff --git a/extensions/resource-deployment/src/ui/radioGroupLoadingComponentBuilder.ts b/extensions/resource-deployment/src/ui/radioGroupLoadingComponentBuilder.ts index 9133a04fda..f82cfe8634 100644 --- a/extensions/resource-deployment/src/ui/radioGroupLoadingComponentBuilder.ts +++ b/extensions/resource-deployment/src/ui/radioGroupLoadingComponentBuilder.ts @@ -7,7 +7,7 @@ import * as vscode from 'vscode'; import { OptionsInfo, FieldInfo } from '../interfaces'; import { getErrorMessage } from '../utils'; -export class RadioGroupLoadingComponentBuilder implements azdata.ComponentBuilder { +export class RadioGroupLoadingComponentBuilder implements azdata.ComponentBuilder { private _optionsDivContainer!: azdata.DivContainer; private _optionsLoadingBuilder: azdata.LoadingComponentBuilder; private _onValueChangedEmitter: vscode.EventEmitter = new vscode.EventEmitter(); @@ -21,11 +21,15 @@ export class RadioGroupLoadingComponentBuilder implements azdata.ComponentBuilde return this._optionsLoadingBuilder.component(); } - withProperties(properties: U): azdata.ComponentBuilder { + withProperties(properties: U): azdata.ComponentBuilder { return this._optionsLoadingBuilder.withProperties(properties); } - withValidation(validation: (component: azdata.LoadingComponent) => boolean): azdata.ComponentBuilder { + withProps(properties: azdata.LoadingComponentProperties): azdata.ComponentBuilder { + return this._optionsLoadingBuilder.withProperties(properties); + } + + withValidation(validation: (component: azdata.LoadingComponent) => boolean): azdata.ComponentBuilder { return this._optionsLoadingBuilder.withValidation(validation); } diff --git a/src/sql/azdata.d.ts b/src/sql/azdata.d.ts index 239798e319..97a76c58ba 100644 --- a/src/sql/azdata.d.ts +++ b/src/sql/azdata.d.ts @@ -2555,37 +2555,37 @@ declare module 'azdata' { * Supports defining a model that can be instantiated as a view in the UI */ export interface ModelBuilder { - navContainer(): ContainerBuilder; + navContainer(): ContainerBuilder; divContainer(): DivBuilder; flexContainer(): FlexBuilder; splitViewContainer(): SplitViewBuilder; - dom(): ComponentBuilder; + dom(): ComponentBuilder; /** * @deprecated please use radioCardGroup component. */ - card(): ComponentBuilder; - inputBox(): ComponentBuilder; - checkBox(): ComponentBuilder; - radioButton(): ComponentBuilder; - webView(): ComponentBuilder; - editor(): ComponentBuilder; - diffeditor(): ComponentBuilder; - text(): ComponentBuilder; - image(): ComponentBuilder; - button(): ComponentBuilder; - dropDown(): ComponentBuilder; - tree(): ComponentBuilder>; - listBox(): ComponentBuilder; - table(): ComponentBuilder; - declarativeTable(): ComponentBuilder; - dashboardWidget(widgetId: string): ComponentBuilder; - dashboardWebview(webviewId: string): ComponentBuilder; + card(): ComponentBuilder; + inputBox(): ComponentBuilder; + checkBox(): ComponentBuilder; + radioButton(): ComponentBuilder; + webView(): ComponentBuilder; + editor(): ComponentBuilder; + diffeditor(): ComponentBuilder; + text(): ComponentBuilder; + image(): ComponentBuilder; + button(): ComponentBuilder; + dropDown(): ComponentBuilder; + tree(): ComponentBuilder, TreeProperties>; + listBox(): ComponentBuilder; + table(): ComponentBuilder; + declarativeTable(): ComponentBuilder; + dashboardWidget(widgetId: string): ComponentBuilder; + dashboardWebview(webviewId: string): ComponentBuilder; formContainer(): FormBuilder; groupContainer(): GroupBuilder; toolbarContainer(): ToolbarBuilder; loadingComponent(): LoadingComponentBuilder; - fileBrowserTree(): ComponentBuilder; - hyperlink(): ComponentBuilder; + fileBrowserTree(): ComponentBuilder; + hyperlink(): ComponentBuilder; } export interface TreeComponentDataProvider extends vscode.TreeDataProvider { @@ -2607,31 +2607,31 @@ declare module 'azdata' { enabled?: boolean; } - export interface ComponentBuilder { - component(): T; - withProperties(properties: U): ComponentBuilder; - withValidation(validation: (component: T) => boolean): ComponentBuilder; + export interface ComponentBuilder { + component(): TComponent; + withProperties(properties: U): ComponentBuilder; + withValidation(validation: (component: TComponent) => boolean): ComponentBuilder; } - export interface ContainerBuilder extends ComponentBuilder { - withLayout(layout: TLayout): ContainerBuilder; - withItems(components: Array, itemLayout?: TItemLayout): ContainerBuilder; + export interface ContainerBuilder extends ComponentBuilder { + withLayout(layout: TLayout): ContainerBuilder; + withItems(components: Array, itemLayout?: TItemLayout): ContainerBuilder; } - export interface FlexBuilder extends ContainerBuilder { + export interface FlexBuilder extends ContainerBuilder { } // Building on top of flex item - export interface SplitViewBuilder extends ContainerBuilder { + export interface SplitViewBuilder extends ContainerBuilder { } - export interface DivBuilder extends ContainerBuilder { + export interface DivBuilder extends ContainerBuilder { } - export interface GroupBuilder extends ContainerBuilder { + export interface GroupBuilder extends ContainerBuilder { } - export interface ToolbarBuilder extends ContainerBuilder { - withToolbarItems(components: ToolbarComponent[]): ContainerBuilder; + export interface ToolbarBuilder extends ContainerBuilder { + withToolbarItems(components: ToolbarComponent[]): ContainerBuilder; /** * Creates a collection of child components and adds them all to this container @@ -2648,7 +2648,7 @@ declare module 'azdata' { addToolbarItem(toolbarComponent: ToolbarComponent): void; } - export interface LoadingComponentBuilder extends ComponentBuilder { + export interface LoadingComponentBuilder extends ComponentBuilder { /** * Set the component wrapped by the LoadingComponent * @param component The component to wrap @@ -2656,7 +2656,7 @@ declare module 'azdata' { withItem(component: Component): LoadingComponentBuilder; } - export interface FormBuilder extends ContainerBuilder { + export interface FormBuilder extends ContainerBuilder { withFormItems(components: (FormComponent | FormComponentGroup)[], itemLayout?: FormItemLayout): FormBuilder; /** @@ -3275,7 +3275,7 @@ declare module 'azdata' { export interface ImageComponentProperties extends ComponentProperties, ComponentWithIcon { } - export interface GroupContainerProperties { + export interface GroupContainerProperties extends ComponentProperties { collapsed: boolean; } @@ -3310,7 +3310,7 @@ declare module 'azdata' { columns: DeclarativeTableColumn[]; } - export interface ListBoxProperties { + export interface ListBoxProperties extends ComponentProperties { selectedRow?: number; values?: string[]; } @@ -3353,6 +3353,18 @@ declare module 'azdata' { * Minimum height for editor component */ minimumHeight?: number; + + /** + * The editor Uri which will be used as a reference for VSCode Language Service. + * Currently this is auto-generated by the framework but can be queried after + * view initialization is completed + */ + readonly editorUri: string + + /** + * Toggle for whether the editor should be automatically resized or not + */ + isAutoResizable: boolean; } export interface ButtonProperties extends ComponentProperties, ComponentWithIcon { @@ -3376,7 +3388,7 @@ declare module 'azdata' { title?: string; } - export interface LoadingComponentProperties { + export interface LoadingComponentProperties extends ComponentProperties { loading?: boolean; showText?: boolean; loadingText?: string; @@ -3401,7 +3413,7 @@ declare module 'azdata' { clickable?: boolean; } - export interface TitledComponentProperties { + export interface TitledComponentProperties extends ComponentProperties { /** * The title for the component. This title will show when hovered over */ @@ -3495,21 +3507,7 @@ declare module 'azdata' { /** * Editor component for displaying the text code editor */ - export interface EditorComponent extends Component { - /** - * The content inside the text editor - */ - content: string; - /** - * The languge mode for this text editor. The language mode is SQL by default. - */ - languageMode: string; - /** - * The editor Uri which will be used as a reference for VSCode Language Service. - * Currently this is auto-generated by the framework but can be queried after - * view initialization is completed - */ - readonly editorUri: string; + export interface EditorComponent extends Component, EditorProperties { /** * An event called when the editor content is updated */ @@ -3519,16 +3517,6 @@ declare module 'azdata' { * An event called when the editor is created */ readonly onEditorCreated: vscode.Event; - - /** - * Toggle for whether the editor should be automatically resized or not - */ - isAutoResizable: boolean; - - /** - * Minimum height for editor component - */ - minimumHeight: number; } export interface DiffEditorComponent extends Component { diff --git a/src/sql/azdata.proposed.d.ts b/src/sql/azdata.proposed.d.ts index 0685d42265..1775fa1af5 100644 --- a/src/sql/azdata.proposed.d.ts +++ b/src/sql/azdata.proposed.d.ts @@ -231,10 +231,14 @@ declare module 'azdata' { } export interface ModelBuilder { - radioCardGroup(): ComponentBuilder; + radioCardGroup(): ComponentBuilder; tabbedPanel(): TabbedPanelComponentBuilder; - separator(): ComponentBuilder; - propertiesContainer(): ComponentBuilder; + separator(): ComponentBuilder; + propertiesContainer(): ComponentBuilder; + } + + export interface ComponentBuilder { + withProps(properties: TPropertyBag): ComponentBuilder; } export interface RadioCard { @@ -278,6 +282,9 @@ declare module 'azdata' { } export interface SeparatorComponent extends Component { + } + export interface SeparatorComponentProperties extends ComponentProperties { + } export interface DeclarativeTableProperties extends ComponentProperties { @@ -287,7 +294,7 @@ declare module 'azdata' { ariaHidden?: boolean; } - export interface ComponentWithIconProperties { + export interface ComponentWithIconProperties extends ComponentProperties { /** * The path for the icon with optional dark-theme away alternative */ @@ -409,12 +416,12 @@ declare module 'azdata' { /** * Builder for TabbedPannelComponent */ - export interface TabbedPanelComponentBuilder extends ContainerBuilder { + export interface TabbedPanelComponentBuilder extends ContainerBuilder { /** * Add the tabs to the component * @param tabs tabs/tab groups to be added */ - withTabs(tabs: (Tab | TabGroup)[]): ContainerBuilder; + withTabs(tabs: (Tab | TabGroup)[]): ContainerBuilder; } export interface InputBoxProperties extends ComponentProperties { @@ -450,7 +457,7 @@ declare module 'azdata' { /** * Properties for configuring a PropertiesContainerComponent */ - export interface PropertiesContainerComponentProperties { + export interface PropertiesContainerComponentProperties extends ComponentProperties { /** * The properties to display */ @@ -463,7 +470,6 @@ declare module 'azdata' { */ export const onDidChangeActiveNotebookEditor: vscode.Event; } - export namespace window { export interface ModelViewDashboard { registerTabs(handler: (view: ModelView) => Thenable<(DashboardTab | DashboardTabGroup)[]>): void; @@ -629,4 +635,10 @@ declare module 'azdata' { */ delete?: boolean; } + export interface DiffEditorComponent { + /** + * Title of editor + */ + title: string; + } } diff --git a/src/sql/workbench/api/common/extHostModelView.ts b/src/sql/workbench/api/common/extHostModelView.ts index 1fad842b54..0fbbe18ccb 100644 --- a/src/sql/workbench/api/common/extHostModelView.ts +++ b/src/sql/workbench/api/common/extHostModelView.ts @@ -23,7 +23,7 @@ import { onUnexpectedError } from 'vs/base/common/errors'; class ModelBuilderImpl implements azdata.ModelBuilder { private nextComponentId: number; - private readonly _componentBuilders = new Map>(); + private readonly _componentBuilders = new Map>(); constructor( private readonly _proxy: MainThreadModelViewShape, @@ -35,9 +35,9 @@ class ModelBuilderImpl implements azdata.ModelBuilder { this.nextComponentId = 0; } - navContainer(): azdata.ContainerBuilder { + navContainer(): azdata.ContainerBuilder { let id = this.getNextComponentId(); - let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.NavContainer, id); + let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.NavContainer, id); this._componentBuilders.set(id, container); return container; } @@ -51,14 +51,14 @@ class ModelBuilderImpl implements azdata.ModelBuilder { flexContainer(): azdata.FlexBuilder { let id = this.getNextComponentId(); - let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.FlexContainer, id); + let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.FlexContainer, id); this._componentBuilders.set(id, container); return container; } splitViewContainer(): azdata.SplitViewBuilder { let id = this.getNextComponentId(); - let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.SplitViewContainer, id); + let container: GenericContainerBuilder = new GenericContainerBuilder(this._proxy, this._handle, ModelComponentTypes.SplitViewContainer, id); this._componentBuilders.set(id, container); return container; } @@ -85,132 +85,132 @@ class ModelBuilderImpl implements azdata.ModelBuilder { } private cardDeprecationMessagePrinted = false; - card(): azdata.ComponentBuilder { + card(): azdata.ComponentBuilder { if (!this.cardDeprecationMessagePrinted) { this.logService.warn(`Extension '${this._extension.identifier.value}' is using card component which has been replaced by radioCardGroup. the card component will be removed in a future release.`); this.cardDeprecationMessagePrinted = true; } let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new CardWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new CardWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - tree(): azdata.ComponentBuilder> { + tree(): azdata.ComponentBuilder, azdata.TreeProperties> { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl> = this.getComponentBuilder(new TreeComponentWrapper(this._extHostModelViewTree, this._proxy, this._handle, id, this._extension), id); + let builder: ComponentBuilderImpl, azdata.TreeProperties> = this.getComponentBuilder(new TreeComponentWrapper(this._extHostModelViewTree, this._proxy, this._handle, id, this._extension), id); this._componentBuilders.set(id, builder); return builder; } - inputBox(): azdata.ComponentBuilder { + inputBox(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new InputBoxWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new InputBoxWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - text(): azdata.ComponentBuilder { + text(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new TextComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new TextComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - image(): azdata.ComponentBuilder { + image(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new ImageComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new ImageComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - radioButton(): azdata.ComponentBuilder { + radioButton(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new RadioButtonWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new RadioButtonWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - checkBox(): azdata.ComponentBuilder { + checkBox(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new CheckBoxWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new CheckBoxWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - webView(): azdata.ComponentBuilder { + webView(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new WebViewWrapper(this._proxy, this._handle, id, this._extension.extensionLocation), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new WebViewWrapper(this._proxy, this._handle, id, this._extension.extensionLocation), id); this._componentBuilders.set(id, builder); return builder; } - editor(): azdata.ComponentBuilder { + editor(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new EditorWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new EditorWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - diffeditor(): azdata.ComponentBuilder { + diffeditor(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new DiffEditorWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new DiffEditorWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - button(): azdata.ComponentBuilder { + button(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new ButtonWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new ButtonWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - separator(): azdata.ComponentBuilder { + separator(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new SeparatorWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new SeparatorWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - dropDown(): azdata.ComponentBuilder { + dropDown(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new DropDownWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new DropDownWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - listBox(): azdata.ComponentBuilder { + listBox(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new ListBoxWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new ListBoxWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - table(): azdata.ComponentBuilder { + table(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new TableComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new TableComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - declarativeTable(): azdata.ComponentBuilder { + declarativeTable(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new DeclarativeTableWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new DeclarativeTableWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - dashboardWidget(widgetId: string): azdata.ComponentBuilder { + dashboardWidget(widgetId: string): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder = this.getComponentBuilder(new ComponentWrapper(this._proxy, this._handle, ModelComponentTypes.DashboardWidget, id), id); + let builder = this.getComponentBuilder(new ComponentWrapper(this._proxy, this._handle, ModelComponentTypes.DashboardWidget, id), id); this._componentBuilders.set(id, builder); return builder; } - dashboardWebview(webviewId: string): azdata.ComponentBuilder { + dashboardWebview(webviewId: string): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new ComponentWrapper(this._proxy, this._handle, ModelComponentTypes.DashboardWebview, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new ComponentWrapper(this._proxy, this._handle, ModelComponentTypes.DashboardWebview, id), id); this._componentBuilders.set(id, builder); return builder; } @@ -222,30 +222,30 @@ class ModelBuilderImpl implements azdata.ModelBuilder { return builder; } - fileBrowserTree(): azdata.ComponentBuilder { + fileBrowserTree(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new FileBrowserTreeComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new FileBrowserTreeComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - dom(): azdata.ComponentBuilder { + dom(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new DomComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new DomComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - hyperlink(): azdata.ComponentBuilder { + hyperlink(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new HyperlinkComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new HyperlinkComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - radioCardGroup(): azdata.ComponentBuilder { + radioCardGroup(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new RadioCardGroupComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new RadioCardGroupComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } @@ -257,16 +257,16 @@ class ModelBuilderImpl implements azdata.ModelBuilder { return builder; } - propertiesContainer(): azdata.ComponentBuilder { + propertiesContainer(): azdata.ComponentBuilder { let id = this.getNextComponentId(); - let builder: ComponentBuilderImpl = this.getComponentBuilder(new PropertiesContainerComponentWrapper(this._proxy, this._handle, id), id); + let builder: ComponentBuilderImpl = this.getComponentBuilder(new PropertiesContainerComponentWrapper(this._proxy, this._handle, id), id); this._componentBuilders.set(id, builder); return builder; } - getComponentBuilder(component: ComponentWrapper, id: string): ComponentBuilderImpl { - let componentBuilder: ComponentBuilderImpl = new ComponentBuilderImpl(component); + getComponentBuilder(component: ComponentWrapper, id: string): ComponentBuilderImpl { + let componentBuilder: ComponentBuilderImpl = new ComponentBuilderImpl(component); this._componentBuilders.set(id, componentBuilder); return componentBuilder; } @@ -292,7 +292,7 @@ interface IWithEventHandler { handleEvent(eventArgs: IComponentEventArgs): void; } -class ComponentBuilderImpl implements azdata.ComponentBuilder, IWithEventHandler { +class ComponentBuilderImpl implements azdata.ComponentBuilder, IWithEventHandler { constructor(protected _component: ComponentWrapper) { _component.registerEvent(); @@ -306,13 +306,18 @@ class ComponentBuilderImpl implements azdata.Compone return this._component; } - withProperties(properties: U): azdata.ComponentBuilder { + withProperties(properties: U): azdata.ComponentBuilder { // Keep any properties that may have been set during initial object construction this._component.properties = assign({}, this._component.properties, properties); return this; } - withValidation(validation: (component: T) => boolean): azdata.ComponentBuilder { + withProps(properties: TPropertyBag): azdata.ComponentBuilder { + this._component.properties = assign({}, this._component.properties, properties); + return this; + } + + withValidation(validation: (component: T) => boolean): azdata.ComponentBuilder { this._component.customValidations.push(validation); return this; } @@ -322,17 +327,17 @@ class ComponentBuilderImpl implements azdata.Compone } } -class ContainerBuilderImpl extends ComponentBuilderImpl implements azdata.ContainerBuilder { +class ContainerBuilderImpl extends ComponentBuilderImpl implements azdata.ContainerBuilder { constructor(componentWrapper: ComponentWrapper) { super(componentWrapper); } - withLayout(layout: TLayout): azdata.ContainerBuilder { + withLayout(layout: TLayout): azdata.ContainerBuilder { this._component.layout = layout; return this; } - withItems(components: azdata.Component[], itemLayout?: TItemLayout): azdata.ContainerBuilder { + withItems(components: azdata.Component[], itemLayout?: TItemLayout): azdata.ContainerBuilder { this._component.itemConfigs = components.map(item => { let componentWrapper = item as ComponentWrapper; return new InternalItemConfig(componentWrapper, itemLayout); @@ -341,19 +346,19 @@ class ContainerBuilderImpl ext } } -class GenericContainerBuilder extends ContainerBuilderImpl { +class GenericContainerBuilder extends ContainerBuilderImpl { constructor(proxy: MainThreadModelViewShape, handle: number, type: ModelComponentTypes, id: string) { super(new ComponentWrapper(proxy, handle, type, id)); } } -class DivContainerBuilder extends ContainerBuilderImpl { +class DivContainerBuilder extends ContainerBuilderImpl { constructor(proxy: MainThreadModelViewShape, handle: number, type: ModelComponentTypes, id: string) { super(new DivContainerWrapper(proxy, handle, type, id)); } } -class FormContainerBuilder extends GenericContainerBuilder implements azdata.FormBuilder { +class FormContainerBuilder extends GenericContainerBuilder implements azdata.FormBuilder { constructor(proxy: MainThreadModelViewShape, handle: number, type: ModelComponentTypes, id: string, private _builder: ModelBuilderImpl) { super(proxy, handle, type, id); } @@ -471,14 +476,14 @@ class FormContainerBuilder extends GenericContainerBuilder { +class GroupContainerBuilder extends ContainerBuilderImpl { constructor(proxy: MainThreadModelViewShape, handle: number, type: ModelComponentTypes, id: string) { super(new GroupContainerComponentWrapper(proxy, handle, type, id)); } } -class ToolbarContainerBuilder extends GenericContainerBuilder implements azdata.ToolbarBuilder { - withToolbarItems(components: azdata.ToolbarComponent[]): azdata.ContainerBuilder { +class ToolbarContainerBuilder extends GenericContainerBuilder implements azdata.ToolbarBuilder { + withToolbarItems(components: azdata.ToolbarComponent[]): azdata.ContainerBuilder { this._component.itemConfigs = components.map(item => { return this.convertToItemConfig(item); }); @@ -506,8 +511,8 @@ class ToolbarContainerBuilder extends GenericContainerBuilder implements azdata.TabbedPanelComponentBuilder { - withTabs(items: (azdata.Tab | azdata.TabGroup)[]): azdata.ContainerBuilder { +class TabbedPanelComponentBuilder extends ContainerBuilderImpl implements azdata.TabbedPanelComponentBuilder { + withTabs(items: (azdata.Tab | azdata.TabGroup)[]): azdata.ContainerBuilder { this._component.itemConfigs = createFromTabs(items); return this; } @@ -537,7 +542,7 @@ function toTabItemConfig(content: azdata.Component, title: string, id?: string, }); } -class LoadingComponentBuilder extends ComponentBuilderImpl implements azdata.LoadingComponentBuilder { +class LoadingComponentBuilder extends ComponentBuilderImpl implements azdata.LoadingComponentBuilder { withItem(component: azdata.Component) { this.component().component = component; return this; @@ -1230,6 +1235,14 @@ class DiffEditorWrapper extends ComponentWrapper implements azdata.DiffEditorCom public set editorUriRight(v: string) { this.setProperty('editorUriRight', v); } + + public get title(): string { + return this.properties['title']; + } + + public set title(v: string) { + this.setProperty('title', v); + } } class RadioButtonWrapper extends ComponentWrapper implements azdata.RadioButtonComponent { diff --git a/src/sql/workbench/browser/modelComponents/button.component.ts b/src/sql/workbench/browser/modelComponents/button.component.ts index af04a26422..b723f70ab1 100644 --- a/src/sql/workbench/browser/modelComponents/button.component.ts +++ b/src/sql/workbench/browser/modelComponents/button.component.ts @@ -33,7 +33,7 @@ import { convertSize } from 'sql/base/browser/dom'; ` }) -export default class ButtonComponent extends ComponentWithIconBase implements IComponent, OnDestroy, AfterViewInit { +export default class ButtonComponent extends ComponentWithIconBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _button: Button; @@ -151,27 +151,27 @@ export default class ButtonComponent extends ComponentWithIconBase implements IC // CSS-bound properties private get label(): string { - return this.getPropertyOrDefault((props) => props.label, ''); + return this.getPropertyOrDefault((props) => props.label, ''); } private set label(newValue: string) { - this.setPropertyFromUI(this.setValueProperties, newValue); + this.setPropertyFromUI(this.setValueProperties, newValue); } public get isFile(): boolean { - return this.getPropertyOrDefault((props) => props.isFile, false); + return this.getPropertyOrDefault((props) => props.isFile, false); } public set isFile(newValue: boolean) { - this.setPropertyFromUI(this.setFileProperties, newValue); + this.setPropertyFromUI(this.setFileProperties, newValue); } private get fileContent(): string { - return this.getPropertyOrDefault((props) => props.fileContent, ''); + return this.getPropertyOrDefault((props) => props.fileContent, ''); } private set fileContent(newValue: string) { - this.setPropertyFromUI(this.setFileContentProperties, newValue); + this.setPropertyFromUI(this.setFileContentProperties, newValue); } private setFileContentProperties(properties: azdata.ButtonProperties, fileContent: string): void { diff --git a/src/sql/workbench/browser/modelComponents/card.component.ts b/src/sql/workbench/browser/modelComponents/card.component.ts index c95952f26a..72d2a4301c 100644 --- a/src/sql/workbench/browser/modelComponents/card.component.ts +++ b/src/sql/workbench/browser/modelComponents/card.component.ts @@ -57,7 +57,7 @@ export enum CardType { @Component({ templateUrl: decodeURI(require.toUrl('./card.component.html')) }) -export default class CardComponent extends ComponentWithIconBase implements IComponent, OnDestroy { +export default class CardComponent extends ComponentWithIconBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @@ -156,23 +156,23 @@ export default class CardComponent extends ComponentWithIconBase implements ICom // CSS-bound properties public get label(): string { - return this.getPropertyOrDefault((props) => props.label, ''); + return this.getPropertyOrDefault((props) => props.label, ''); } public get value(): string { - return this.getPropertyOrDefault((props) => props.value, ''); + return this.getPropertyOrDefault((props) => props.value, ''); } public get cardType(): string { - return this.getPropertyOrDefault((props) => props.cardType, 'Details'); + return this.getPropertyOrDefault((props) => props.cardType, 'Details'); } public get selected(): boolean { - return this.getPropertyOrDefault((props) => props.selected, false); + return this.getPropertyOrDefault((props) => props.selected, false); } public set selected(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.selected = value, newValue); + this.setPropertyFromUI((props, value) => props.selected = value, newValue); } public get isDetailsCard(): boolean { @@ -196,20 +196,20 @@ export default class CardComponent extends ComponentWithIconBase implements ICom } public get descriptions(): CardDescriptionItem[] { - return this.getPropertyOrDefault((props) => props.descriptions, []); + return this.getPropertyOrDefault((props) => props.descriptions, []); } public get actions(): ActionDescriptor[] { - return this.getPropertyOrDefault((props) => props.actions, []); + return this.getPropertyOrDefault((props) => props.actions, []); } public hasStatus(): boolean { - let status = this.getPropertyOrDefault((props) => props.status, StatusIndicator.None); + let status = this.getPropertyOrDefault((props) => props.status, StatusIndicator.None); return status !== StatusIndicator.None; } public get statusColor(): string { - let status = this.getPropertyOrDefault((props) => props.status, StatusIndicator.None); + let status = this.getPropertyOrDefault((props) => props.status, StatusIndicator.None); switch (status) { case StatusIndicator.Ok: return 'green'; diff --git a/src/sql/workbench/browser/modelComponents/checkbox.component.ts b/src/sql/workbench/browser/modelComponents/checkbox.component.ts index e9f8bf68fe..a674606a2b 100644 --- a/src/sql/workbench/browser/modelComponents/checkbox.component.ts +++ b/src/sql/workbench/browser/modelComponents/checkbox.component.ts @@ -24,7 +24,7 @@ import { convertSize } from 'sql/base/browser/dom';
` }) -export default class CheckBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class CheckBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _input: Checkbox; @@ -102,27 +102,27 @@ export default class CheckBoxComponent extends ComponentBase implements ICompone // CSS-bound properties public get checked(): boolean { - return this.getPropertyOrDefault((props) => props.checked, false); + return this.getPropertyOrDefault((props) => props.checked, false); } public set checked(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.checked = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.checked = value; }, newValue); } private get label(): string { - return this.getPropertyOrDefault((props) => props.label, ''); + return this.getPropertyOrDefault((props) => props.label, ''); } private set label(newValue: string) { - this.setPropertyFromUI((properties, label) => { properties.label = label; }, newValue); + this.setPropertyFromUI((properties, label) => { properties.label = label; }, newValue); } public get required(): boolean { - return this.getPropertyOrDefault((props) => props.required, false); + return this.getPropertyOrDefault((props) => props.required, false); } public set required(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.required = value, newValue); + this.setPropertyFromUI((props, value) => props.required = value, newValue); } public focus(): void { diff --git a/src/sql/workbench/browser/modelComponents/componentBase.ts b/src/sql/workbench/browser/modelComponents/componentBase.ts index 95e232c79e..e13e4fea80 100644 --- a/src/sql/workbench/browser/modelComponents/componentBase.ts +++ b/src/sql/workbench/browser/modelComponents/componentBase.ts @@ -28,7 +28,7 @@ export class ItemDescriptor { constructor(public descriptor: IComponentDescriptor, public config: T) { } } -export abstract class ComponentBase extends Disposable implements IComponent, OnDestroy, OnInit { +export abstract class ComponentBase extends Disposable implements IComponent, OnDestroy, OnInit { protected properties: { [key: string]: any; } = {}; private _valid: boolean = true; protected _validations: (() => boolean | Thenable)[] = []; @@ -109,17 +109,17 @@ export abstract class ComponentBase extends Disposable implements IComponent, On } } - protected getProperties(): TPropertyBag { + protected getProperties(): TPropertyBag { return this.properties as TPropertyBag; } - protected getPropertyOrDefault(propertyGetter: (TPropertyBag) => TValue, defaultVal: TValue) { - let property = propertyGetter(this.getProperties()); + protected getPropertyOrDefault(propertyGetter: (property: TPropertyBag) => TValue, defaultVal: TValue) { + let property = propertyGetter(this.getProperties()); return types.isUndefinedOrNull(property) ? defaultVal : property; } - protected setPropertyFromUI(propertySetter: (TPropertyBag, TValue) => void, value: TValue) { - propertySetter(this.getProperties(), value); + protected setPropertyFromUI(propertySetter: (TPropertyBag, TValue) => void, value: TValue) { + propertySetter(this.getProperties(), value); this.fireEvent({ eventType: ComponentEventType.PropertiesChanged, args: this.getProperties() @@ -144,75 +144,75 @@ export abstract class ComponentBase extends Disposable implements IComponent, On } public get height(): number | string { - return this.getPropertyOrDefault((props) => props.height, undefined); + return this.getPropertyOrDefault((props) => props.height, undefined); } public set height(newValue: number | string) { - this.setPropertyFromUI((props, value) => props.height = value, newValue); + this.setPropertyFromUI((props, value) => props.height = value, newValue); } public get width(): number | string { - return this.getPropertyOrDefault((props) => props.width, undefined); + return this.getPropertyOrDefault((props) => props.width, undefined); } public set width(newValue: number | string) { - this.setPropertyFromUI((props, value) => props.width = value, newValue); + this.setPropertyFromUI((props, value) => props.width = value, newValue); } public get position(): string { - return this.getPropertyOrDefault((props) => props.position, ''); + return this.getPropertyOrDefault((props) => props.position, ''); } public set position(newValue: string) { - this.setPropertyFromUI((properties, position) => { properties.position = position; }, newValue); + this.setPropertyFromUI((properties, position) => { properties.position = position; }, newValue); } public get display(): azdata.DisplayType { - return this.getPropertyOrDefault((props) => props.display, undefined); + return this.getPropertyOrDefault((props) => props.display, undefined); } public set display(newValue: azdata.DisplayType) { - this.setPropertyFromUI((properties, display) => { properties.display = display; }, newValue); + this.setPropertyFromUI((properties, display) => { properties.display = display; }, newValue); } public get ariaLabel(): string { - return this.getPropertyOrDefault((props) => props.ariaLabel, ''); + return this.getPropertyOrDefault((props) => props.ariaLabel, ''); } public set ariaLabel(newValue: string) { - this.setPropertyFromUI((props, value) => props.ariaLabel = value, newValue); + this.setPropertyFromUI((props, value) => props.ariaLabel = value, newValue); } public get ariaRole(): string { - return this.getPropertyOrDefault((props) => props.ariaRole, ''); + return this.getPropertyOrDefault((props) => props.ariaRole, ''); } public set ariaRole(newValue: string) { - this.setPropertyFromUI((props, value) => props.ariaRole = value, newValue); + this.setPropertyFromUI((props, value) => props.ariaRole = value, newValue); } public get ariaSelected(): boolean { - return this.getPropertyOrDefault((props) => props.ariaSelected, false); + return this.getPropertyOrDefault((props) => props.ariaSelected, false); } public set ariaSelected(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.ariaSelected = value, newValue); + this.setPropertyFromUI((props, value) => props.ariaSelected = value, newValue); } public get ariaHidden(): boolean { - return this.getPropertyOrDefault((props) => props.ariaHidden, false); + return this.getPropertyOrDefault((props) => props.ariaHidden, false); } public set ariaHidden(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.ariaHidden = value, newValue); + this.setPropertyFromUI((props, value) => props.ariaHidden = value, newValue); } public get CSSStyles(): { [key: string]: string } { - return this.getPropertyOrDefault((props) => props.CSSStyles, {}); + return this.getPropertyOrDefault<{ [key: string]: string }>((props) => props.CSSStyles, {}); } public set CSSStyles(newValue: { [key: string]: string }) { - this.setPropertyFromUI((properties, CSSStyles) => { properties.CSSStyles = CSSStyles; }, newValue); + this.setPropertyFromUI<{ [key: string]: string }>((properties, CSSStyles) => { properties.CSSStyles = CSSStyles; }, newValue); } protected getWidth(): string { @@ -275,7 +275,7 @@ export abstract class ComponentBase extends Disposable implements IComponent, On } } -export abstract class ContainerBase extends ComponentBase { +export abstract class ContainerBase extends ComponentBase { protected items: ItemDescriptor[]; @ViewChildren(ModelComponentWrapper) protected _componentWrappers: QueryList; diff --git a/src/sql/workbench/browser/modelComponents/componentWithIconBase.ts b/src/sql/workbench/browser/modelComponents/componentWithIconBase.ts index bee6ac05ff..1f381119f6 100644 --- a/src/sql/workbench/browser/modelComponents/componentWithIconBase.ts +++ b/src/sql/workbench/browser/modelComponents/componentWithIconBase.ts @@ -16,7 +16,7 @@ export class ItemDescriptor { constructor(public descriptor: IComponentDescriptor, public config: T) { } } -export abstract class ComponentWithIconBase extends ComponentBase { +export abstract class ComponentWithIconBase extends ComponentBase { protected _iconClass: string; protected _iconPath: IUserFriendlyIcon; @@ -49,23 +49,23 @@ export abstract class ComponentWithIconBase extends ComponentBase { } public get iconPath(): string | URI | { light: string | URI; dark: string | URI } { - return this.getPropertyOrDefault((props) => props.iconPath, undefined); + return this.getPropertyOrDefault((props) => props.iconPath, undefined); } public get iconHeight(): number | string { - return this.getPropertyOrDefault((props) => props.iconHeight, '50px'); + return this.getPropertyOrDefault((props) => props.iconHeight, '50px'); } public get iconWidth(): number | string { - return this.getPropertyOrDefault((props) => props.iconWidth, '50px'); + return this.getPropertyOrDefault((props) => props.iconWidth, '50px'); } public get title(): string { - return this.getPropertyOrDefault((props) => props.title, ''); + return this.getPropertyOrDefault((props) => props.title, ''); } public set title(newTitle: string) { - this.setPropertyFromUI((properties, title) => { properties.title = title; }, newTitle); + this.setPropertyFromUI((properties, title) => { properties.title = title; }, newTitle); } ngOnDestroy(): void { diff --git a/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts b/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts index 311a23e51c..cfb0c40096 100644 --- a/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts +++ b/src/sql/workbench/browser/modelComponents/declarativeTable.component.ts @@ -132,7 +132,7 @@ export default class DeclarativeTableComponent extends ContainerBase implem private onCellDataChanged(newValue: any, rowIdx: number, colIdx: number): void { this.data[rowIdx][colIdx] = newValue; - this.setPropertyFromUI((props, value) => props.data = value, this.data); + this.setPropertyFromUI((props, value) => props.data = value, this.data); let newCellData: azdata.TableCell = { row: rowIdx, column: colIdx, diff --git a/src/sql/workbench/browser/modelComponents/diffeditor.component.ts b/src/sql/workbench/browser/modelComponents/diffeditor.component.ts index 4b0340230d..1641ad8d37 100644 --- a/src/sql/workbench/browser/modelComponents/diffeditor.component.ts +++ b/src/sql/workbench/browser/modelComponents/diffeditor.component.ts @@ -37,7 +37,7 @@ import { convertSizeToNumber } from 'sql/base/browser/dom'; `, selector: 'modelview-diff-editor-component' }) -export default class DiffEditorComponent extends ComponentBase implements IComponent, OnDestroy { +export default class DiffEditorComponent extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _editor: TextDiffEditor; @@ -176,66 +176,66 @@ export default class DiffEditorComponent extends ComponentBase implements ICompo // CSS-bound properties public get contentLeft(): string { - return this.getPropertyOrDefault((props) => props.contentLeft, undefined); + return this.getPropertyOrDefault((props) => props.contentLeft, undefined); } public set contentLeft(newValue: string) { - this.setPropertyFromUI((properties, contentLeft) => { properties.contentLeft = contentLeft; }, newValue); + this.setPropertyFromUI((properties, contentLeft) => { properties.contentLeft = contentLeft; }, newValue); } public get contentRight(): string { - return this.getPropertyOrDefault((props) => props.contentRight, undefined); + return this.getPropertyOrDefault((props) => props.contentRight, undefined); } public set contentRight(newValue: string) { - this.setPropertyFromUI((properties, contentRight) => { properties.contentRight = contentRight; }, newValue); + this.setPropertyFromUI((properties, contentRight) => { properties.contentRight = contentRight; }, newValue); } public get languageMode(): string { - return this.getPropertyOrDefault((props) => props.languageMode, undefined); + return this.getPropertyOrDefault((props) => props.languageMode, undefined); } public set languageMode(newValue: string) { - this.setPropertyFromUI((properties, languageMode) => { properties.languageMode = languageMode; }, newValue); + this.setPropertyFromUI((properties, languageMode) => { properties.languageMode = languageMode; }, newValue); } public get isAutoResizable(): boolean { - return this.getPropertyOrDefault((props) => props.isAutoResizable, false); + return this.getPropertyOrDefault((props) => props.isAutoResizable, false); } public set isAutoResizable(newValue: boolean) { - this.setPropertyFromUI((properties, isAutoResizable) => { properties.isAutoResizable = isAutoResizable; }, newValue); + this.setPropertyFromUI((properties, isAutoResizable) => { properties.isAutoResizable = isAutoResizable; }, newValue); } public get minimumHeight(): number { - return this.getPropertyOrDefault((props) => props.minimumHeight, this._editor.minimumHeight); + return this.getPropertyOrDefault((props) => props.minimumHeight, this._editor.minimumHeight); } public set minimumHeight(newValue: number) { - this.setPropertyFromUI((properties, minimumHeight) => { properties.minimumHeight = minimumHeight; }, newValue); + this.setPropertyFromUI((properties, minimumHeight) => { properties.minimumHeight = minimumHeight; }, newValue); } public get editorUriLeft(): string { - return this.getPropertyOrDefault((props) => props.editorUriLeft, ''); + return this.getPropertyOrDefault((props) => props.editorUriLeft, ''); } public set editorUriLeft(newValue: string) { - this.setPropertyFromUI((properties, editorUriLeft) => { properties.editorUriLeft = editorUriLeft; }, newValue); + this.setPropertyFromUI((properties, editorUriLeft) => { properties.editorUriLeft = editorUriLeft; }, newValue); } public get editorUriRight(): string { - return this.getPropertyOrDefault((props) => props.editorUriRight, ''); + return this.getPropertyOrDefault((props) => props.editorUriRight, ''); } public set editorUriRight(newValue: string) { - this.setPropertyFromUI((properties, editorUriRight) => { properties.editorUriRight = editorUriRight; }, newValue); + this.setPropertyFromUI((properties, editorUriRight) => { properties.editorUriRight = editorUriRight; }, newValue); } public get title(): string { - return this.getPropertyOrDefault((props) => props.title, undefined); + return this.getPropertyOrDefault((props) => props.title, undefined); } public set title(newValue: string) { - this.setPropertyFromUI((properties, title) => { properties.title = title; }, newValue); + this.setPropertyFromUI((properties, title) => { properties.title = title; }, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/divContainer.component.ts b/src/sql/workbench/browser/modelComponents/divContainer.component.ts index 52244aea6d..8514ea3e1f 100644 --- a/src/sql/workbench/browser/modelComponents/divContainer.component.ts +++ b/src/sql/workbench/browser/modelComponents/divContainer.component.ts @@ -32,7 +32,7 @@ class DivItem { ` }) -export default class DivContainer extends ContainerBase implements IComponent, OnDestroy, AfterViewInit { +export default class DivContainer extends ContainerBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @ViewChild('divContainer', { read: ElementRef }) divContainer; @@ -126,21 +126,21 @@ export default class DivContainer extends ContainerBase im // CSS-bound properties public get overflowY(): string { - return this.getPropertyOrDefault((props) => props.overflowY, ''); + return this.getPropertyOrDefault((props) => props.overflowY, ''); } public set overflowY(newValue: string) { - this.setPropertyFromUI((properties, newValue) => { properties.overflowY = newValue; }, newValue); + this.setPropertyFromUI((properties, newValue) => { properties.overflowY = newValue; }, newValue); } public get yOffsetChange(): number { - return this.getPropertyOrDefault((props) => props.yOffsetChange, 0); + return this.getPropertyOrDefault((props) => props.yOffsetChange, 0); } public set yOffsetChange(newValue: number) { - this.setPropertyFromUI((properties, newValue) => { properties.yOffsetChange = newValue; }, newValue); + this.setPropertyFromUI((properties, newValue) => { properties.yOffsetChange = newValue; }, newValue); } public get clickable(): boolean { - return this.getPropertyOrDefault((props) => props.clickable, false); + return this.getPropertyOrDefault((props) => props.clickable, false); } public onKey(e: KeyboardEvent) { diff --git a/src/sql/workbench/browser/modelComponents/dom.component.ts b/src/sql/workbench/browser/modelComponents/dom.component.ts index 5005aa8e16..ce316a8161 100644 --- a/src/sql/workbench/browser/modelComponents/dom.component.ts +++ b/src/sql/workbench/browser/modelComponents/dom.component.ts @@ -20,7 +20,7 @@ import { IComponent, IComponentDescriptor, IModelStore } from 'sql/platform/dash template: '', selector: 'modelview-dom-component' }) -export default class DomComponent extends ComponentBase implements IComponent, OnDestroy { +export default class DomComponent extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _renderedHtml: string; @@ -82,10 +82,10 @@ export default class DomComponent extends ComponentBase implements IComponent, O // CSS-bound properties public get html(): string { - return this.getPropertyOrDefault((props) => props.html, ''); + return this.getPropertyOrDefault((props) => props.html, ''); } public set html(newValue: string) { - this.setPropertyFromUI((properties, html) => { properties.html = html; }, newValue); + this.setPropertyFromUI((properties, html) => { properties.html = html; }, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/dropdown.component.ts b/src/sql/workbench/browser/modelComponents/dropdown.component.ts index f82f41cc25..f9b4cf49b9 100644 --- a/src/sql/workbench/browser/modelComponents/dropdown.component.ts +++ b/src/sql/workbench/browser/modelComponents/dropdown.component.ts @@ -32,7 +32,7 @@ import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } fro ` }) -export default class DropDownComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class DropDownComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _editableDropdown: Dropdown; @@ -186,15 +186,15 @@ export default class DropDownComponent extends ComponentBase implements ICompone // CSS-bound properties private get value(): string | azdata.CategoryValue { - return this.getPropertyOrDefault((props) => props.value, ''); + return this.getPropertyOrDefault((props) => props.value, ''); } private get editable(): boolean { - return this.getPropertyOrDefault((props) => props.editable, false); + return this.getPropertyOrDefault((props) => props.editable, false); } private get fireOnTextChange(): boolean { - return this.getPropertyOrDefault((props) => props.fireOnTextChange, false); + return this.getPropertyOrDefault((props) => props.fireOnTextChange, false); } public getEditableDisplay(): string { @@ -206,15 +206,15 @@ export default class DropDownComponent extends ComponentBase implements ICompone } private set value(newValue: string | azdata.CategoryValue) { - this.setPropertyFromUI(this.setValueProperties, newValue); + this.setPropertyFromUI(this.setValueProperties, newValue); } private get values(): string[] | azdata.CategoryValue[] { - return this.getPropertyOrDefault((props) => props.values, []); + return this.getPropertyOrDefault((props) => props.values, []); } private set values(newValue: string[] | azdata.CategoryValue[]) { - this.setPropertyFromUI(this.setValuesProperties, newValue); + this.setPropertyFromUI(this.setValuesProperties, newValue); } private setValueProperties(properties: azdata.DropDownProperties, value: string | azdata.CategoryValue): void { @@ -226,11 +226,11 @@ export default class DropDownComponent extends ComponentBase implements ICompone } public get required(): boolean { - return this.getPropertyOrDefault((props) => props.required, false); + return this.getPropertyOrDefault((props) => props.required, false); } public set required(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.required = value, newValue); + this.setPropertyFromUI((props, value) => props.required = value, newValue); } public focus(): void { diff --git a/src/sql/workbench/browser/modelComponents/editor.component.ts b/src/sql/workbench/browser/modelComponents/editor.component.ts index f36811bf4a..8de6b145d4 100644 --- a/src/sql/workbench/browser/modelComponents/editor.component.ts +++ b/src/sql/workbench/browser/modelComponents/editor.component.ts @@ -31,7 +31,7 @@ import { convertSizeToNumber } from 'sql/base/browser/dom'; template: '', selector: 'modelview-editor-component' }) -export default class EditorComponent extends ComponentBase implements IComponent, OnDestroy { +export default class EditorComponent extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _editor: QueryTextEditor; @@ -164,42 +164,42 @@ export default class EditorComponent extends ComponentBase implements IComponent // CSS-bound properties public get content(): string { - return this.getPropertyOrDefault((props) => props.content, undefined); + return this.getPropertyOrDefault((props) => props.content, undefined); } public set content(newValue: string) { - this.setPropertyFromUI((properties, content) => { properties.content = content; }, newValue); + this.setPropertyFromUI((properties, content) => { properties.content = content; }, newValue); } public get languageMode(): string { - return this.getPropertyOrDefault((props) => props.languageMode, undefined); + return this.getPropertyOrDefault((props) => props.languageMode, undefined); } public set languageMode(newValue: string) { - this.setPropertyFromUI((properties, languageMode) => { properties.languageMode = languageMode; }, newValue); + this.setPropertyFromUI((properties, languageMode) => { properties.languageMode = languageMode; }, newValue); } public get isAutoResizable(): boolean { - return this.getPropertyOrDefault((props) => props.isAutoResizable, false); + return this.getPropertyOrDefault((props) => props.isAutoResizable, false); } public set isAutoResizable(newValue: boolean) { - this.setPropertyFromUI((properties, isAutoResizable) => { properties.isAutoResizable = isAutoResizable; }, newValue); + this.setPropertyFromUI((properties, isAutoResizable) => { properties.isAutoResizable = isAutoResizable; }, newValue); } public get minimumHeight(): number { - return this.getPropertyOrDefault((props) => props.minimumHeight, this._editor.minimumHeight); + return this.getPropertyOrDefault((props) => props.minimumHeight, this._editor.minimumHeight); } public set minimumHeight(newValue: number) { - this.setPropertyFromUI((properties, minimumHeight) => { properties.minimumHeight = minimumHeight; }, newValue); + this.setPropertyFromUI((properties, minimumHeight) => { properties.minimumHeight = minimumHeight; }, newValue); } public get editorUri(): string { - return this.getPropertyOrDefault((props) => props.editorUri, ''); + return this.getPropertyOrDefault((props) => props.editorUri, ''); } public set editorUri(newValue: string) { - this.setPropertyFromUI((properties, editorUri) => { properties.editorUri = editorUri; }, newValue); + this.setPropertyFromUI((properties, editorUri) => { properties.editorUri = editorUri; }, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/fileBrowserTree.component.ts b/src/sql/workbench/browser/modelComponents/fileBrowserTree.component.ts index adeb43459c..086d6081c8 100644 --- a/src/sql/workbench/browser/modelComponents/fileBrowserTree.component.ts +++ b/src/sql/workbench/browser/modelComponents/fileBrowserTree.component.ts @@ -22,7 +22,7 @@ import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } fro
` }) -export default class FileBrowserTreeComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class FileBrowserTreeComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _treeView: FileBrowserTreeView; @@ -124,10 +124,10 @@ export default class FileBrowserTreeComponent extends ComponentBase implements I // CSS-bound properties public get ownerUri(): string { - return this.getPropertyOrDefault((props) => props.ownerUri, ''); + return this.getPropertyOrDefault((props) => props.ownerUri, ''); } public set ownerUri(newValue: string) { - this.setPropertyFromUI((props, value) => props.ownerUri = value, newValue); + this.setPropertyFromUI((props, value) => props.ownerUri = value, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/groupContainer.component.ts b/src/sql/workbench/browser/modelComponents/groupContainer.component.ts index 65e200ad38..5b451d678d 100644 --- a/src/sql/workbench/browser/modelComponents/groupContainer.component.ts +++ b/src/sql/workbench/browser/modelComponents/groupContainer.component.ts @@ -36,7 +36,7 @@ import { IComponent, IComponentDescriptor, IModelStore } from 'sql/platform/dash ` }) -export default class GroupContainer extends ContainerBase implements IComponent, OnDestroy, AfterViewInit { +export default class GroupContainer extends ContainerBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @@ -88,11 +88,11 @@ export default class GroupContainer extends ContainerBase implement } public set collapsed(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.collapsed = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.collapsed = value; }, newValue); } public get collapsed(): boolean { - return this.getPropertyOrDefault((props) => props.collapsed, false); + return this.getPropertyOrDefault((props) => props.collapsed, false); } private hasHeader(): boolean { diff --git a/src/sql/workbench/browser/modelComponents/hyperlink.component.ts b/src/sql/workbench/browser/modelComponents/hyperlink.component.ts index 62ca3b1d72..8fac97a892 100644 --- a/src/sql/workbench/browser/modelComponents/hyperlink.component.ts +++ b/src/sql/workbench/browser/modelComponents/hyperlink.component.ts @@ -21,7 +21,7 @@ import * as DOM from 'vs/base/browser/dom'; selector: 'modelview-hyperlink', template: `{{label}}` }) -export default class HyperlinkComponent extends TitledComponent implements IComponent, OnDestroy, AfterViewInit { +export default class HyperlinkComponent extends TitledComponent implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @@ -50,19 +50,19 @@ export default class HyperlinkComponent extends TitledComponent implements IComp } public set label(newValue: string) { - this.setPropertyFromUI((properties, value) => { properties.label = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.label = value; }, newValue); } public get label(): string { - return this.getPropertyOrDefault((props) => props.label, ''); + return this.getPropertyOrDefault((props) => props.label, ''); } public set url(newValue: string) { - this.setPropertyFromUI((properties, value) => { properties.url = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.url = value; }, newValue); } public get url(): string { - return this.getPropertyOrDefault((props) => props.url, ''); + return this.getPropertyOrDefault((props) => props.url, ''); } public onClick(e: MouseEvent): void { diff --git a/src/sql/workbench/browser/modelComponents/image.component.ts b/src/sql/workbench/browser/modelComponents/image.component.ts index bea9eeb38d..5b3d6d0c09 100644 --- a/src/sql/workbench/browser/modelComponents/image.component.ts +++ b/src/sql/workbench/browser/modelComponents/image.component.ts @@ -9,6 +9,7 @@ import { } from '@angular/core'; import * as DOM from 'vs/base/browser/dom'; +import * as azdata from 'azdata'; import { ITitledComponent } from 'sql/workbench/browser/modelComponents/interfaces'; import { ComponentWithIconBase } from 'sql/workbench/browser/modelComponents/componentWithIconBase'; import { IComponent, IComponentDescriptor, IModelStore } from 'sql/platform/dashboard/browser/interfaces'; @@ -18,7 +19,7 @@ import { IComponent, IComponentDescriptor, IModelStore } from 'sql/platform/dash template: `
` }) -export default class ImageComponent extends ComponentWithIconBase implements ITitledComponent, IComponent, OnDestroy, AfterViewInit { +export default class ImageComponent extends ComponentWithIconBase implements ITitledComponent, IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @ViewChild('imageContainer', { read: ElementRef }) imageContainer: ElementRef; diff --git a/src/sql/workbench/browser/modelComponents/inputbox.component.ts b/src/sql/workbench/browser/modelComponents/inputbox.component.ts index f5a5e351fc..0b10569c67 100644 --- a/src/sql/workbench/browser/modelComponents/inputbox.component.ts +++ b/src/sql/workbench/browser/modelComponents/inputbox.component.ts @@ -34,7 +34,7 @@ import { convertSize, convertSizeToNumber } from 'sql/base/browser/dom';
` }) -export default class InputBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class InputBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _input: InputBox; @@ -250,95 +250,95 @@ export default class InputBoxComponent extends ComponentBase implements ICompone // CSS-bound properties public get value(): string { - return this.getPropertyOrDefault((props) => props.value, ''); + return this.getPropertyOrDefault((props) => props.value, ''); } public set value(newValue: string) { - this.setPropertyFromUI((props, value) => props.value = value, newValue); + this.setPropertyFromUI((props, value) => props.value = value, newValue); } public get ariaLive() { - return this.getPropertyOrDefault((props) => props.ariaLive, ''); + return this.getPropertyOrDefault((props) => props.ariaLive, ''); } public get placeHolder(): string { - return this.getPropertyOrDefault((props) => props.placeHolder, ''); + return this.getPropertyOrDefault((props) => props.placeHolder, ''); } public set placeHolder(newValue: string) { - this.setPropertyFromUI((props, value) => props.placeHolder = value, newValue); + this.setPropertyFromUI((props, value) => props.placeHolder = value, newValue); } public set columns(newValue: number) { - this.setPropertyFromUI((props, value) => props.columns = value, newValue); + this.setPropertyFromUI((props, value) => props.columns = value, newValue); } public get rows(): number { - return this.getPropertyOrDefault((props) => props.rows, undefined); + return this.getPropertyOrDefault((props) => props.rows, undefined); } public get columns(): number { - return this.getPropertyOrDefault((props) => props.columns, undefined); + return this.getPropertyOrDefault((props) => props.columns, undefined); } public set rows(newValue: number) { - this.setPropertyFromUI((props, value) => props.rows = value, newValue); + this.setPropertyFromUI((props, value) => props.rows = value, newValue); } public get min(): number { - return this.getPropertyOrDefault((props) => props.min, undefined); + return this.getPropertyOrDefault((props) => props.min, undefined); } public set min(newValue: number) { - this.setPropertyFromUI((props, value) => props.min = value, newValue); + this.setPropertyFromUI((props, value) => props.min = value, newValue); } public get max(): number { - return this.getPropertyOrDefault((props) => props.max, undefined); + return this.getPropertyOrDefault((props) => props.max, undefined); } public set max(newValue: number) { - this.setPropertyFromUI((props, value) => props.max = value, newValue); + this.setPropertyFromUI((props, value) => props.max = value, newValue); } public get inputType(): string { - return this.getPropertyOrDefault((props) => props.inputType, 'text'); + return this.getPropertyOrDefault((props) => props.inputType, 'text'); } public set inputType(newValue: string) { - this.setPropertyFromUI((props, value) => props.inputType = value, newValue); + this.setPropertyFromUI((props, value) => props.inputType = value, newValue); } public get multiline(): boolean { - return this.getPropertyOrDefault((props) => props.multiline, false); + return this.getPropertyOrDefault((props) => props.multiline, false); } public set multiline(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.multiline = value, newValue); + this.setPropertyFromUI((props, value) => props.multiline = value, newValue); } public get readOnly(): boolean { - return this.getPropertyOrDefault((props) => props.readOnly, false); + return this.getPropertyOrDefault((props) => props.readOnly, false); } public set readOnly(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.readOnly = value, newValue); + this.setPropertyFromUI((props, value) => props.readOnly = value, newValue); } public get required(): boolean { - return this.getPropertyOrDefault((props) => props.required, false); + return this.getPropertyOrDefault((props) => props.required, false); } public set required(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.required = value, newValue); + this.setPropertyFromUI((props, value) => props.required = value, newValue); } public get stopEnterPropagation(): boolean { - return this.getPropertyOrDefault((props) => props.stopEnterPropagation, false); + return this.getPropertyOrDefault((props) => props.stopEnterPropagation, false); } public set stopEnterPropagation(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.stopEnterPropagation = value, newValue); + this.setPropertyFromUI((props, value) => props.stopEnterPropagation = value, newValue); } public focus(): void { @@ -346,10 +346,10 @@ export default class InputBoxComponent extends ComponentBase implements ICompone } public get validationErrorMessage(): string { - return this.getPropertyOrDefault((props) => props.validationErrorMessage, ''); + return this.getPropertyOrDefault((props) => props.validationErrorMessage, ''); } public set validationErrorMessage(newValue: string) { - this.setPropertyFromUI((props, value) => props.validationErrorMessage = value, newValue); + this.setPropertyFromUI((props, value) => props.validationErrorMessage = value, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/listbox.component.ts b/src/sql/workbench/browser/modelComponents/listbox.component.ts index 0830a556ae..7afa8c282b 100644 --- a/src/sql/workbench/browser/modelComponents/listbox.component.ts +++ b/src/sql/workbench/browser/modelComponents/listbox.component.ts @@ -26,7 +26,7 @@ import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } fro
` }) -export default class ListBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class ListBoxComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _input: ListBox; @@ -108,18 +108,18 @@ export default class ListBoxComponent extends ComponentBase implements IComponen // CSS-bound properties private get values(): string[] { - return this.getPropertyOrDefault((props) => props.values, undefined); + return this.getPropertyOrDefault((props) => props.values, undefined); } private set values(newValue: string[]) { - this.setPropertyFromUI((props, value) => props.values = value, newValue); + this.setPropertyFromUI((props, value) => props.values = value, newValue); } private get selectedRow(): number { - return this.getPropertyOrDefault((props) => props.selectedRow, undefined); + return this.getPropertyOrDefault((props) => props.selectedRow, undefined); } private set selectedRow(newValue: number) { - this.setPropertyFromUI((props, value) => props.selectedRow = value, newValue); + this.setPropertyFromUI((props, value) => props.selectedRow = value, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts b/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts index 94930655b6..52e497eda6 100644 --- a/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts +++ b/src/sql/workbench/browser/modelComponents/loadingComponent.component.ts @@ -26,7 +26,7 @@ import { status } from 'vs/base/browser/ui/aria/aria'; ` }) -export default class LoadingComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class LoadingComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { private _component: IComponentDescriptor; @Input() descriptor: IComponentDescriptor; @@ -72,24 +72,24 @@ export default class LoadingComponent extends ComponentBase implements IComponen } public get loading(): boolean { - return this.getPropertyOrDefault((props) => props.loading, false); + return this.getPropertyOrDefault((props) => props.loading, false); } public set loading(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.loading = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.loading = value; }, newValue); this.layout(); } public get showText(): boolean { - return this.getPropertyOrDefault((props) => props.showText, false); + return this.getPropertyOrDefault((props) => props.showText, false); } public get loadingText(): string { - return this.getPropertyOrDefault((props) => props.loadingText, localize('loadingMessage', "Loading")); + return this.getPropertyOrDefault((props) => props.loadingText, localize('loadingMessage', "Loading")); } public get loadingCompletedText(): string { - return this.getPropertyOrDefault((props) => props.loadingCompletedText, localize('loadingCompletedMessage', "Loading completed")); + return this.getPropertyOrDefault((props) => props.loadingCompletedText, localize('loadingCompletedMessage', "Loading completed")); } public addToContainer(componentDescriptor: IComponentDescriptor): void { diff --git a/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts b/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts index f3787e39e0..68023085cb 100644 --- a/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts +++ b/src/sql/workbench/browser/modelComponents/propertiesContainer.component.ts @@ -22,7 +22,7 @@ import { PROPERTIES_CONTAINER_PROPERTY_NAME, PROPERTIES_CONTAINER_PROPERTY_VALUE ` }) -export default class PropertiesContainerComponent extends ComponentBase implements IComponent, OnDestroy { +export default class PropertiesContainerComponent extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @@ -48,11 +48,11 @@ export default class PropertiesContainerComponent extends ComponentBase implemen } public get propertyItems(): PropertyItem[] { - return this.getPropertyOrDefault((props) => props.propertyItems, []); + return this.getPropertyOrDefault((props) => props.propertyItems, []); } public set propertyItems(newValue: azdata.PropertiesContainerItem[]) { - this.setPropertyFromUI((props, value) => props.propertyItems = value, newValue); + this.setPropertyFromUI((props, value) => props.propertyItems = value, newValue); this._propertiesContainer.propertyItems = newValue; } } diff --git a/src/sql/workbench/browser/modelComponents/radioButton.component.ts b/src/sql/workbench/browser/modelComponents/radioButton.component.ts index 462b813a0a..a3041c06dc 100644 --- a/src/sql/workbench/browser/modelComponents/radioButton.component.ts +++ b/src/sql/workbench/browser/modelComponents/radioButton.component.ts @@ -23,7 +23,7 @@ import { IComponent, IComponentDescriptor, IModelStore, ComponentEventType } fro
` }) -export default class RadioButtonComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class RadioButtonComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _input: RadioButton; @@ -80,19 +80,19 @@ export default class RadioButtonComponent extends ComponentBase implements IComp // CSS-bound properties public get checked(): boolean { - return this.getPropertyOrDefault((props) => props.checked, false); + return this.getPropertyOrDefault((props) => props.checked, false); } public set checked(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.checked = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.checked = value; }, newValue); } public set value(newValue: string) { - this.setPropertyFromUI((properties, value) => { properties.value = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.value = value; }, newValue); } public get value(): string { - return this.getPropertyOrDefault((props) => props.value, ''); + return this.getPropertyOrDefault((props) => props.value, ''); } public getLabel(): string { @@ -100,19 +100,19 @@ export default class RadioButtonComponent extends ComponentBase implements IComp } public get label(): string { - return this.getPropertyOrDefault((props) => props.label, ''); + return this.getPropertyOrDefault((props) => props.label, ''); } public set label(newValue: string) { - this.setPropertyFromUI((properties, label) => { properties.label = label; }, newValue); + this.setPropertyFromUI((properties, label) => { properties.label = label; }, newValue); } public get name(): string { - return this.getPropertyOrDefault((props) => props.name, ''); + return this.getPropertyOrDefault((props) => props.name, ''); } public set name(newValue: string) { - this.setPropertyFromUI((properties, label) => { properties.name = label; }, newValue); + this.setPropertyFromUI((properties, label) => { properties.name = label; }, newValue); } public focus(): void { diff --git a/src/sql/workbench/browser/modelComponents/radioCardGroup.component.ts b/src/sql/workbench/browser/modelComponents/radioCardGroup.component.ts index a6883c89a4..e87fb31dbb 100644 --- a/src/sql/workbench/browser/modelComponents/radioCardGroup.component.ts +++ b/src/sql/workbench/browser/modelComponents/radioCardGroup.component.ts @@ -19,7 +19,7 @@ import { deepClone } from 'vs/base/common/objects'; @Component({ templateUrl: decodeURI(require.toUrl('./radioCardGroup.component.html')) }) -export default class RadioCardGroup extends ComponentBase implements IComponent, OnDestroy { +export default class RadioCardGroup extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @ViewChildren('cardDiv') cardElements: QueryList; @@ -96,38 +96,34 @@ export default class RadioCardGroup extends ComponentBase implements IComponent, } public get cards(): azdata.RadioCard[] { - return this.getSpecficProperties().cards ?? []; + return this.getProperties().cards ?? []; } public get cardWidth(): string | undefined { - return this.getSpecficProperties().cardWidth ?? undefined; + return this.getProperties().cardWidth ?? undefined; } public get cardHeight(): string | undefined { - return this.getSpecficProperties().cardHeight ?? undefined; + return this.getProperties().cardHeight ?? undefined; } public get iconWidth(): string | undefined { - return this.getSpecficProperties().iconWidth ?? undefined; + return this.getProperties().iconWidth ?? undefined; } public get iconHeight(): string | undefined { - return this.getSpecficProperties().iconHeight ?? undefined; + return this.getProperties().iconHeight ?? undefined; } public get selectedCardId(): string | undefined { - return this.getSpecficProperties().selectedCardId ?? undefined; + return this.getProperties().selectedCardId ?? undefined; } public get orientation(): string { - const x = this.getSpecficProperties().orientation ?? 'horizontal'; + const x = this.getProperties().orientation ?? 'horizontal'; return x; } - private getSpecficProperties(): azdata.RadioCardGroupComponentProperties { - return this.getProperties(); - } - public getIconClass(cardId: string): string { if (!this.iconClasses[cardId]) { this.iconClasses[cardId] = `cardIcon icon ${createIconCssClass(this.getCardById(cardId).icon)}`; @@ -149,7 +145,7 @@ export default class RadioCardGroup extends ComponentBase implements IComponent, } const cardElement = this.getCardElement(cardId); cardElement.nativeElement.focus(); - this.setPropertyFromUI((props, value) => props.selectedCardId = value, cardId); + this.setPropertyFromUI((props, value) => props.selectedCardId = value, cardId); this._changeRef.detectChanges(); this.fireEvent({ eventType: ComponentEventType.onDidChange, diff --git a/src/sql/workbench/browser/modelComponents/separator.component.ts b/src/sql/workbench/browser/modelComponents/separator.component.ts index 726d92bfce..27c195e062 100644 --- a/src/sql/workbench/browser/modelComponents/separator.component.ts +++ b/src/sql/workbench/browser/modelComponents/separator.component.ts @@ -7,6 +7,7 @@ import { Component, Input, Inject, ChangeDetectorRef, forwardRef, ViewChild, ElementRef, OnDestroy, AfterViewInit } from '@angular/core'; +import * as azdata from 'azdata'; import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase'; @@ -19,7 +20,7 @@ import { Separator } from 'sql/base/browser/ui/separator/separator';
` }) -export default class SeparatorComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class SeparatorComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { private _separator: Separator; @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; diff --git a/src/sql/workbench/browser/modelComponents/splitviewContainer.component.ts b/src/sql/workbench/browser/modelComponents/splitviewContainer.component.ts index 92caf39d4b..1e19a170b0 100644 --- a/src/sql/workbench/browser/modelComponents/splitviewContainer.component.ts +++ b/src/sql/workbench/browser/modelComponents/splitviewContainer.component.ts @@ -3,10 +3,9 @@ * 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 { FlexItemLayout, SplitViewLayout } from 'azdata'; +import { FlexItemLayout, SplitViewLayout, SplitViewContainer } from 'azdata'; import { FlexItem } from './flexContainer.component'; import { ContainerBase, ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase'; import { Event } from 'vs/base/common/event'; @@ -22,7 +21,7 @@ class SplitPane implements IView { maximumSize: number; onDidChange: Event = Event.None; size: number; - component: ComponentBase; + component: ComponentBase; layout(size: number): void { this.size = size; try { @@ -48,7 +47,7 @@ class SplitPane implements IView { ` }) -export default class SplitViewContainer extends ContainerBase implements IComponent, OnDestroy { +export default class SplitViewContainerImpl extends ContainerBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _flexFlow: string; @@ -87,7 +86,7 @@ export default class SplitViewContainer extends ContainerBase im } private GetCorrespondingView(component: IComponent, orientation: Orientation): IView { - let c = component as ComponentBase; + let c = component as ComponentBase; let basicView: SplitPane = new SplitPane(); basicView.orientation = orientation; basicView.element = c.getHtml(); diff --git a/src/sql/workbench/browser/modelComponents/table.component.ts b/src/sql/workbench/browser/modelComponents/table.component.ts index a663b09ee8..5f5383fc44 100644 --- a/src/sql/workbench/browser/modelComponents/table.component.ts +++ b/src/sql/workbench/browser/modelComponents/table.component.ts @@ -42,7 +42,7 @@ export enum ColumnSizingMode {
` }) -export default class TableComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class TableComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _table: Table; @@ -368,62 +368,62 @@ export default class TableComponent extends ComponentBase implements IComponent, // CSS-bound properties public get data(): any[][] { - return this.getPropertyOrDefault((props) => props.data, []); + return this.getPropertyOrDefault((props) => props.data, []); } public set data(newValue: any[][]) { - this.setPropertyFromUI((props, value) => props.data = value, newValue); + this.setPropertyFromUI((props, value) => props.data = value, newValue); } public get columns(): string[] | azdata.TableColumn[] { - return this.getPropertyOrDefault((props) => props.columns, []); + return this.getPropertyOrDefault((props) => props.columns, []); } public get fontSize(): number | string { - return this.getPropertyOrDefault((props) => props.fontSize, ''); + return this.getPropertyOrDefault((props) => props.fontSize, ''); } public set columns(newValue: string[] | azdata.TableColumn[]) { - this.setPropertyFromUI((props, value) => props.columns = value, newValue); + this.setPropertyFromUI((props, value) => props.columns = value, newValue); } public get selectedRows(): number[] { - return this.getPropertyOrDefault((props) => props.selectedRows, []); + return this.getPropertyOrDefault((props) => props.selectedRows, []); } public set selectedRows(newValue: number[]) { - this.setPropertyFromUI((props, value) => props.selectedRows = value, newValue); + this.setPropertyFromUI((props, value) => props.selectedRows = value, newValue); } public get forceFitColumns() { - return this.getPropertyOrDefault((props) => props.forceFitColumns, ColumnSizingMode.ForceFit); + return this.getPropertyOrDefault((props) => props.forceFitColumns, ColumnSizingMode.ForceFit); } public get title() { - return this.getPropertyOrDefault((props) => props.title, ''); + return this.getPropertyOrDefault((props) => props.title, ''); } public get ariaRowCount(): number { - return this.getPropertyOrDefault((props) => props.ariaRowCount, -1); + return this.getPropertyOrDefault((props) => props.ariaRowCount, -1); } public get ariaColumnCount(): number { - return this.getPropertyOrDefault((props) => props.ariaColumnCount, -1); + return this.getPropertyOrDefault((props) => props.ariaColumnCount, -1); } public set moveFocusOutWithTab(newValue: boolean) { - this.setPropertyFromUI((props, value) => props.moveFocusOutWithTab = value, newValue); + this.setPropertyFromUI((props, value) => props.moveFocusOutWithTab = value, newValue); } public get moveFocusOutWithTab(): boolean { - return this.getPropertyOrDefault((props) => props.moveFocusOutWithTab, false); + return this.getPropertyOrDefault((props) => props.moveFocusOutWithTab, false); } public get updateCells(): azdata.TableCell[] { - return this.getPropertyOrDefault((props) => props.updateCells, undefined); + return this.getPropertyOrDefault((props) => props.updateCells, undefined); } public set updateCells(newValue: azdata.TableCell[]) { - this.setPropertyFromUI((properties, value) => { properties.updateCells = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.updateCells = value; }, newValue); } } diff --git a/src/sql/workbench/browser/modelComponents/text.component.ts b/src/sql/workbench/browser/modelComponents/text.component.ts index 04bd3299a8..681bc400a1 100644 --- a/src/sql/workbench/browser/modelComponents/text.component.ts +++ b/src/sql/workbench/browser/modelComponents/text.component.ts @@ -37,7 +37,7 @@ import { IThemeService } from 'vs/platform/theme/common/themeService';

` }) -export default class TextComponent extends TitledComponent implements IComponent, OnDestroy, AfterViewInit { +export default class TextComponent extends TitledComponent implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @ViewChild('textContainer', { read: ElementRef }) textContainer: ElementRef; @@ -71,27 +71,27 @@ export default class TextComponent extends TitledComponent implements IComponent } public set value(newValue: string) { - this.setPropertyFromUI((properties, value) => { properties.value = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.value = value; }, newValue); } public get value(): string { - return this.getPropertyOrDefault((props) => props.value, ''); + return this.getPropertyOrDefault((props) => props.value, ''); } public set description(newValue: string) { - this.setPropertyFromUI((properties, value) => { properties.description = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.description = value; }, newValue); } public get description(): string { - return this.getPropertyOrDefault((props) => props.description, ''); + return this.getPropertyOrDefault((props) => props.description, ''); } public set requiredIndicator(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.requiredIndicator = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.requiredIndicator = value; }, newValue); } public get requiredIndicator(): boolean { - return this.getPropertyOrDefault((props) => props.requiredIndicator, false); + return this.getPropertyOrDefault((props) => props.requiredIndicator, false); } public setProperties(properties: { [key: string]: any; }): void { @@ -102,7 +102,7 @@ export default class TextComponent extends TitledComponent implements IComponent public updateText(): void { DOM.clearNode((this.textContainer.nativeElement)); - const links = this.getPropertyOrDefault((props) => props.links, []); + const links = this.getPropertyOrDefault((props) => props.links, []); // The text may contain link placeholders so go through and create those and insert them as needed now let text = this.value; for (let i: number = 0; i < links.length; i++) { diff --git a/src/sql/workbench/browser/modelComponents/titledComponent.ts b/src/sql/workbench/browser/modelComponents/titledComponent.ts index 01ce1a3e0e..e3314213b6 100644 --- a/src/sql/workbench/browser/modelComponents/titledComponent.ts +++ b/src/sql/workbench/browser/modelComponents/titledComponent.ts @@ -11,7 +11,7 @@ import * as azdata from 'azdata'; import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase'; -export abstract class TitledComponent extends ComponentBase implements ITitledComponent { +export abstract class TitledComponent extends ComponentBase implements ITitledComponent { constructor( protected _changeRef: ChangeDetectorRef, @@ -20,10 +20,10 @@ export abstract class TitledComponent extends ComponentBase implements ITitledCo } public get title(): string { - return this.getPropertyOrDefault((props) => props.title, ''); + return this.getPropertyOrDefault((props) => props.title, ''); } public set title(newTitle: string) { - this.setPropertyFromUI((properties, title) => { properties.title = title; }, newTitle); + this.setPropertyFromUI((properties, title) => { properties.title = title; }, newTitle); } } diff --git a/src/sql/workbench/browser/modelComponents/tree.component.ts b/src/sql/workbench/browser/modelComponents/tree.component.ts index 595ffa79f4..1fe32821db 100644 --- a/src/sql/workbench/browser/modelComponents/tree.component.ts +++ b/src/sql/workbench/browser/modelComponents/tree.component.ts @@ -45,7 +45,7 @@ class Root implements ITreeComponentItem {
` }) -export default class TreeComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { +export default class TreeComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; private _tree: Tree; @@ -163,10 +163,10 @@ export default class TreeComponent extends ComponentBase implements IComponent, } public get withCheckbox(): boolean { - return this.getPropertyOrDefault((props) => props.withCheckbox, false); + return this.getPropertyOrDefault((props) => props.withCheckbox, false); } public set withCheckbox(newValue: boolean) { - this.setPropertyFromUI((properties, value) => { properties.withCheckbox = value; }, newValue); + this.setPropertyFromUI((properties, value) => { properties.withCheckbox = value; }, newValue); } } diff --git a/src/sql/workbench/contrib/modelView/browser/webview.component.ts b/src/sql/workbench/contrib/modelView/browser/webview.component.ts index e12bb3c737..1a464acc83 100644 --- a/src/sql/workbench/contrib/modelView/browser/webview.component.ts +++ b/src/sql/workbench/contrib/modelView/browser/webview.component.ts @@ -28,11 +28,15 @@ function reviveWebviewOptions(options: vscode.WebviewOptions): vscode.WebviewOpt }; } +interface WebViewProperties extends azdata.WebViewProperties { + extensionLocation: UriComponents +} + @Component({ template: '', selector: 'modelview-webview-component' }) -export default class WebViewComponent extends ComponentBase implements IComponent, OnDestroy { +export default class WebViewComponent extends ComponentBase implements IComponent, OnDestroy { @Input() descriptor: IComponentDescriptor; @Input() modelStore: IModelStore; @@ -172,27 +176,27 @@ export default class WebViewComponent extends ComponentBase implements IComponen // CSS-bound properties public get message(): any { - return this.getPropertyOrDefault((props) => props.message, undefined); + return this.getPropertyOrDefault((props) => props.message, undefined); } public set message(newValue: any) { - this.setPropertyFromUI((properties, message) => { properties.message = message; }, newValue); + this.setPropertyFromUI((properties, message) => { properties.message = message; }, newValue); } public get html(): string { - return this.getPropertyOrDefault((props) => props.html, undefined); + return this.getPropertyOrDefault((props) => props.html, undefined); } public set html(newValue: string) { - this.setPropertyFromUI((properties, html) => { properties.html = html; }, newValue); + this.setPropertyFromUI((properties, html) => { properties.html = html; }, newValue); } public get options(): vscode.WebviewOptions { - return this.getPropertyOrDefault((props) => props.options, undefined); + return this.getPropertyOrDefault((props) => props.options, undefined); } public get extensionLocation(): UriComponents { - return this.getPropertyOrDefault((props) => props.extensionLocation, undefined); + return this.getPropertyOrDefault((props) => props.extensionLocation, undefined); } private get extensionLocationUri(): URI { diff --git a/src/sql/workbench/test/electron-browser/modalComponents/componentBase.test.ts b/src/sql/workbench/test/electron-browser/modalComponents/componentBase.test.ts index 0670440f1c..e9bfc9a865 100644 --- a/src/sql/workbench/test/electron-browser/modalComponents/componentBase.test.ts +++ b/src/sql/workbench/test/electron-browser/modalComponents/componentBase.test.ts @@ -3,6 +3,7 @@ * Licensed under the Source EULA. See License.txt in the project root for license information. *--------------------------------------------------------------------------------------------*/ +import * as azdata from 'azdata'; import * as assert from 'assert'; import { ComponentBase, ContainerBase, ItemDescriptor } from 'sql/workbench/browser/modelComponents/componentBase'; import { ModelStore } from 'sql/workbench/browser/modelComponents/modelStore'; @@ -10,7 +11,7 @@ import { ChangeDetectorRef } from '@angular/core'; import { IComponentDescriptor, IModelStore, ComponentEventType } from 'sql/platform/dashboard/browser/interfaces'; -class TestComponent extends ComponentBase { +class TestComponent extends ComponentBase { public descriptor: IComponentDescriptor; constructor(public modelStore: IModelStore, id: string) {