UNPKG

@ux-aspects/ux-aspects

Version:

Open source user interface framework for building modern, responsive, mobile big data applications

45 lines 6.79 kB
import { ChangeDetectionStrategy, Component, HostBinding, Input } from '@angular/core'; import * as i0 from "@angular/core"; import * as i1 from "@angular/common"; export class ProgressBarComponent { constructor() { this.value = 0; this.min = 0; this.max = 100; this.indeterminate = false; } /** When indeteminate we should omit the valuenow label */ get valueNow() { return this.indeterminate ? null : this.value; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.12", type: ProgressBarComponent, selector: "ux-progress-bar", inputs: { value: "value", min: "min", max: "max", indeterminate: "indeterminate", trackColor: "trackColor", barColor: "barColor" }, host: { attributes: { "role": "progressbar" }, properties: { "attr.aria-valuemin": "this.min", "attr.aria-valuemax": "this.max", "attr.aria-valuenow": "this.valueNow" } }, ngImport: i0, template: "@if (!indeterminate) {\n <div class=\"progressbar-track\" [style.width.%]=\"((value - min) / (max - min)) * 100\" [style.backgroundColor]=\"barColor\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n}\n@if (indeterminate) {\n <div class=\"progressbar-track indeterminate\" [style.backgroundColor]=\"barColor\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n}\n\n<!-- Workaround for Multiple ng-content tags issue: https://github.com/angular/angular/issues/22972 -->\n<ng-template #content><ng-content></ng-content></ng-template>", dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ProgressBarComponent, decorators: [{ type: Component, args: [{ selector: 'ux-progress-bar', changeDetection: ChangeDetectionStrategy.OnPush, host: { role: 'progressbar' }, template: "@if (!indeterminate) {\n <div class=\"progressbar-track\" [style.width.%]=\"((value - min) / (max - min)) * 100\" [style.backgroundColor]=\"barColor\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n}\n@if (indeterminate) {\n <div class=\"progressbar-track indeterminate\" [style.backgroundColor]=\"barColor\">\n <ng-container *ngTemplateOutlet=\"content\"></ng-container>\n </div>\n}\n\n<!-- Workaround for Multiple ng-content tags issue: https://github.com/angular/angular/issues/22972 -->\n<ng-template #content><ng-content></ng-content></ng-template>" }] }], propDecorators: { value: [{ type: Input }], min: [{ type: Input }, { type: HostBinding, args: ['attr.aria-valuemin'] }], max: [{ type: Input }, { type: HostBinding, args: ['attr.aria-valuemax'] }], indeterminate: [{ type: Input }], trackColor: [{ type: Input }], barColor: [{ type: Input }], valueNow: [{ type: HostBinding, args: ['attr.aria-valuenow'] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZ3Jlc3MtYmFyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3Byb2dyZXNzLWJhci9wcm9ncmVzcy1iYXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvcHJvZ3Jlc3MtYmFyL3Byb2dyZXNzLWJhci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQVV2RixNQUFNLE9BQU8sb0JBQW9CO0lBUmpDO1FBU2EsVUFBSyxHQUFXLENBQUMsQ0FBQztRQUNpQixRQUFHLEdBQVcsQ0FBQyxDQUFDO1FBQ2hCLFFBQUcsR0FBVyxHQUFHLENBQUM7UUFDckQsa0JBQWEsR0FBWSxLQUFLLENBQUM7S0FRM0M7SUFKRywwREFBMEQ7SUFDMUQsSUFBdUMsUUFBUTtRQUMzQyxPQUFPLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNsRCxDQUFDOytHQVhRLG9CQUFvQjttR0FBcEIsb0JBQW9CLHVXQ1ZqQywra0JBWTZEOzs0RkRGaEQsb0JBQW9CO2tCQVJoQyxTQUFTOytCQUNJLGlCQUFpQixtQkFFVix1QkFBdUIsQ0FBQyxNQUFNLFFBQ3pDO3dCQUNGLElBQUksRUFBRSxhQUFhO3FCQUN0Qjs4QkFHUSxLQUFLO3NCQUFiLEtBQUs7Z0JBQ3NDLEdBQUc7c0JBQTlDLEtBQUs7O3NCQUFJLFdBQVc7dUJBQUMsb0JBQW9CO2dCQUNFLEdBQUc7c0JBQTlDLEtBQUs7O3NCQUFJLFdBQVc7dUJBQUMsb0JBQW9CO2dCQUNqQyxhQUFhO3NCQUFyQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFHaUMsUUFBUTtzQkFBOUMsV0FBVzt1QkFBQyxvQkFBb0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBIb3N0QmluZGluZywgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICd1eC1wcm9ncmVzcy1iYXInLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9ncmVzcy1iYXIuY29tcG9uZW50Lmh0bWwnLFxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxuICAgIGhvc3Q6IHtcbiAgICAgICAgcm9sZTogJ3Byb2dyZXNzYmFyJ1xuICAgIH1cbn0pXG5leHBvcnQgY2xhc3MgUHJvZ3Jlc3NCYXJDb21wb25lbnQge1xuICAgIEBJbnB1dCgpIHZhbHVlOiBudW1iZXIgPSAwO1xuICAgIEBJbnB1dCgpIEBIb3N0QmluZGluZygnYXR0ci5hcmlhLXZhbHVlbWluJykgbWluOiBudW1iZXIgPSAwO1xuICAgIEBJbnB1dCgpIEBIb3N0QmluZGluZygnYXR0ci5hcmlhLXZhbHVlbWF4JykgbWF4OiBudW1iZXIgPSAxMDA7XG4gICAgQElucHV0KCkgaW5kZXRlcm1pbmF0ZTogYm9vbGVhbiA9IGZhbHNlO1xuICAgIEBJbnB1dCgpIHRyYWNrQ29sb3I6IHN0cmluZztcbiAgICBASW5wdXQoKSBiYXJDb2xvcjogc3RyaW5nO1xuXG4gICAgLyoqIFdoZW4gaW5kZXRlbWluYXRlIHdlIHNob3VsZCBvbWl0IHRoZSB2YWx1ZW5vdyBsYWJlbCAqL1xuICAgIEBIb3N0QmluZGluZygnYXR0ci5hcmlhLXZhbHVlbm93JykgZ2V0IHZhbHVlTm93KCkge1xuICAgICAgICByZXR1cm4gdGhpcy5pbmRldGVybWluYXRlID8gbnVsbCA6IHRoaXMudmFsdWU7XG4gICAgfVxufVxuIiwiQGlmICghaW5kZXRlcm1pbmF0ZSkge1xuICA8ZGl2IGNsYXNzPVwicHJvZ3Jlc3NiYXItdHJhY2tcIiBbc3R5bGUud2lkdGguJV09XCIoKHZhbHVlIC0gbWluKSAvIChtYXggLSBtaW4pKSAqIDEwMFwiIFtzdHlsZS5iYWNrZ3JvdW5kQ29sb3JdPVwiYmFyQ29sb3JcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbn1cbkBpZiAoaW5kZXRlcm1pbmF0ZSkge1xuICA8ZGl2IGNsYXNzPVwicHJvZ3Jlc3NiYXItdHJhY2sgaW5kZXRlcm1pbmF0ZVwiIFtzdHlsZS5iYWNrZ3JvdW5kQ29sb3JdPVwiYmFyQ29sb3JcIj5cbiAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwiY29udGVudFwiPjwvbmctY29udGFpbmVyPlxuICA8L2Rpdj5cbn1cblxuPCEtLSBXb3JrYXJvdW5kIGZvciBNdWx0aXBsZSBuZy1jb250ZW50IHRhZ3MgaXNzdWU6IGh0dHBzOi8vZ2l0aHViLmNvbS9hbmd1bGFyL2FuZ3VsYXIvaXNzdWVzLzIyOTcyIC0tPlxuPG5nLXRlbXBsYXRlICNjb250ZW50PjxuZy1jb250ZW50PjwvbmctY29udGVudD48L25nLXRlbXBsYXRlPiJdfQ==