integration-libs/epd-visualization/components/visual-viewer/toolbar/visual-viewer-toolbar-button/visual-viewer-toolbar-button.component.ts
| changeDetection | ChangeDetectionStrategy.OnPush |
| selector | cx-epd-visualization-viewer-toolbar-button |
| templateUrl | ./visual-viewer-toolbar-button.component.html |
Properties |
Inputs |
| checked | |
Type : boolean
|
|
Default value : false
|
|
| disabled | |
Type : boolean
|
|
Default value : false
|
|
| iconClass | |
Type : string
|
|
| iconLibraryClass | |
Type : string
|
|
| text | |
Type : string
|
|
Default value : ''
|
|
| checked |
Default value : false
|
Decorators :
@Input()
|
| disabled |
Default value : false
|
Decorators :
@Input()
|
| iconClass |
Type : string
|
Decorators :
@Input()
|
| iconLibraryClass |
Type : string
|
Decorators :
@Input()
|
| text |
Type : string
|
Default value : ''
|
Decorators :
@Input()
|
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
@Component({
selector: 'cx-epd-visualization-viewer-toolbar-button',
templateUrl: './visual-viewer-toolbar-button.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class VisualViewerToolbarButtonComponent {
@Input() text = '';
@Input() iconLibraryClass: string;
@Input() iconClass: string;
@Input() disabled = false;
@Input() checked = false;
}
<button
class="btn btn-link"
type="submit"
[disabled]="disabled"
[class.checked]="checked"
[attr.aria-checked]="checked"
>
<div class="buttonVBox">
<cx-icon class="{{ iconLibraryClass }} {{ iconClass }}"></cx-icon>
<span class="buttonText">{{ text }}</span>
</div>
</button>