Add toolbar separator (#4890)

* Add option to add toolbar separator after toolbar component
This commit is contained in:
kisantia
2019-04-08 15:27:18 -07:00
committed by GitHub
parent e6faef27ab
commit ada0966832
4 changed files with 16 additions and 4 deletions

View File

@@ -2590,6 +2590,7 @@ declare module 'azdata' {
export interface ToolbarComponent { export interface ToolbarComponent {
component: Component; component: Component;
title?: string; title?: string;
toolbarSeparatorAfter?: boolean;
} }
/** /**

View File

@@ -68,9 +68,8 @@
.taskbarSeparator { .taskbarSeparator {
width: 1px; width: 1px;
background-color:#555; background-color:#A5A5A5;
margin-right: 6px; margin: 6px 8px;
margin-top: 3px;
} }
.taskbarTextSeparator { .taskbarTextSeparator {

View File

@@ -3,6 +3,7 @@
* Licensed under the Source EULA. See License.txt in the project root for license information. * Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/ *--------------------------------------------------------------------------------------------*/
import 'vs/css!./toolbarLayout'; import 'vs/css!./toolbarLayout';
import 'vs/css!../../../sql/base/browser/ui/taskbar/media/taskbar';
import { import {
Component, Input, Inject, ChangeDetectorRef, forwardRef, Component, Input, Inject, ChangeDetectorRef, forwardRef,
@@ -18,6 +19,7 @@ import { CommonServiceInterface } from 'sql/services/common/commonServiceInterfa
export interface ToolbarItemConfig { export interface ToolbarItemConfig {
title?: string; title?: string;
toolbarSeparatorAfter?: boolean;
} }
export class ToolbarItem { export class ToolbarItem {
@@ -37,6 +39,8 @@ export class ToolbarItem {
<model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore" > <model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore" >
</model-component-wrapper> </model-component-wrapper>
</div> </div>
<div *ngIf="shouldShowToolbarSeparator(item)" class="taskbarSeparator" >
</div>
</div> </div>
</ng-container> </ng-container>
</div> </div>
@@ -85,6 +89,13 @@ export default class ToolbarContainer extends ContainerBase<ToolbarItemConfig> i
return this.hasTitle(item) && this.isHorizontal(); return this.hasTitle(item) && this.isHorizontal();
} }
public shouldShowToolbarSeparator(item: ToolbarItem): boolean {
if (!item || !item.config) {
return false;
}
return item.config.toolbarSeparatorAfter;
}
private hasTitle(item: ToolbarItem): boolean { private hasTitle(item: ToolbarItem): boolean {
return item && item.config && item.config.title !== undefined; return item && item.config && item.config.title !== undefined;
} }

View File

@@ -428,7 +428,8 @@ class ToolbarContainerBuilder extends GenericContainerBuilder<azdata.ToolbarCont
let componentWrapper = toolbarComponent.component as ComponentWrapper; let componentWrapper = toolbarComponent.component as ComponentWrapper;
return new InternalItemConfig(componentWrapper, { return new InternalItemConfig(componentWrapper, {
title: toolbarComponent.title title: toolbarComponent.title,
toolbarSeparatorAfter: toolbarComponent.toolbarSeparatorAfter
}); });
} }