cfc-ds
Version:
Design System do Conselho Federal de Contabilidade baseado no govbr-ds
47 lines • 8.35 kB
JavaScript
import { Component, Input } from '@angular/core';
import { LoadingDensity } from '../../enums/loading-density.enum';
import * as i0 from "@angular/core";
import * as i1 from "../../services/loading.service";
import * as i2 from "@angular/common";
import * as i3 from "@angular/flex-layout/extended";
import * as i4 from "../scrim/scrim.component";
export class LoadingComponent {
loadingService;
density = LoadingDensity.medium;
progress;
minValue = 0;
maxValue = 100;
isFullScreen = true;
loadingSubscription;
constructor(loadingService) {
this.loadingService = loadingService;
}
ngOnInit() {
// this.loadingSubscription = this.loadingService.isLoading$.subscribe(
// ({ isLoading, isFullScreen }) => {
// this.isFullScreen = isFullScreen;
// if (isLoading) {
// } else {
// }
// }
// );
}
ngOnDestroy() {
// this.loadingSubscription?.unsubscribe();
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, deps: [{ token: i1.LoadingService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LoadingComponent, selector: "cfc-loading", inputs: { density: "density", progress: "progress", minValue: "minValue", maxValue: "maxValue" }, ngImport: i0, template: "<cfc-scrim [isVisible]=\"isFullScreen\"></cfc-scrim>\r\n\r\n<div\r\n class=\"br-loading\"\r\n role=\"progressbar\"\r\n [ariaLabel]=\"progress ? 'Carregando em ' + progress + '%' : 'Carregando...'\"\r\n [attr.data-progress]=\"progress\"\r\n [attr.aria-valuemin]=\"progress ? minValue : undefined\"\r\n [attr.aria-valuemax]=\"progress ? maxValue : undefined\"\r\n [ngClass]=\"density\">\r\n <ng-container *ngIf=\"progress\">\r\n <div class=\"br-loading-mask full\">\r\n <div class=\"br-loading-fill\"></div>\r\n </div>\r\n <div class=\"br-loading-mask\">\r\n <div class=\"br-loading-fill\"></div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".full-screen-overlay{position:fixed;top:0;left:0;width:100dvw;height:100dvh;background:#00000073;-webkit-backdrop-filter:blur(.1px);backdrop-filter:blur(.1px);z-index:1000}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i4.ScrimComponent, selector: "cfc-scrim", inputs: ["isVisible", "isClosable"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, decorators: [{
type: Component,
args: [{ selector: 'cfc-loading', template: "<cfc-scrim [isVisible]=\"isFullScreen\"></cfc-scrim>\r\n\r\n<div\r\n class=\"br-loading\"\r\n role=\"progressbar\"\r\n [ariaLabel]=\"progress ? 'Carregando em ' + progress + '%' : 'Carregando...'\"\r\n [attr.data-progress]=\"progress\"\r\n [attr.aria-valuemin]=\"progress ? minValue : undefined\"\r\n [attr.aria-valuemax]=\"progress ? maxValue : undefined\"\r\n [ngClass]=\"density\">\r\n <ng-container *ngIf=\"progress\">\r\n <div class=\"br-loading-mask full\">\r\n <div class=\"br-loading-fill\"></div>\r\n </div>\r\n <div class=\"br-loading-mask\">\r\n <div class=\"br-loading-fill\"></div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n", styles: [".full-screen-overlay{position:fixed;top:0;left:0;width:100dvw;height:100dvh;background:#00000073;-webkit-backdrop-filter:blur(.1px);backdrop-filter:blur(.1px);z-index:1000}\n"] }]
}], ctorParameters: () => [{ type: i1.LoadingService }], propDecorators: { density: [{
type: Input
}], progress: [{
type: Input
}], minValue: [{
type: Input
}], maxValue: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL2xvYWRpbmcvbG9hZGluZy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBcUIsTUFBTSxlQUFlLENBQUM7QUFHcEUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLGtDQUFrQyxDQUFDOzs7Ozs7QUFPbEUsTUFBTSxPQUFPLGdCQUFnQjtJQVdQO0lBVFgsT0FBTyxHQUFtQixjQUFjLENBQUMsTUFBTSxDQUFDO0lBQ2hELFFBQVEsQ0FBVTtJQUNsQixRQUFRLEdBQVcsQ0FBQyxDQUFDO0lBQ3JCLFFBQVEsR0FBVyxHQUFHLENBQUM7SUFFaEMsWUFBWSxHQUFHLElBQUksQ0FBQztJQUVaLG1CQUFtQixDQUEyQjtJQUV0RCxZQUFvQixjQUE4QjtRQUE5QixtQkFBYyxHQUFkLGNBQWMsQ0FBZ0I7SUFBRyxDQUFDO0lBRXRELFFBQVE7UUFDTix1RUFBdUU7UUFDdkUsdUNBQXVDO1FBQ3ZDLHdDQUF3QztRQUN4Qyx1QkFBdUI7UUFDdkIsZUFBZTtRQUNmLFFBQVE7UUFDUixNQUFNO1FBQ04sS0FBSztJQUNQLENBQUM7SUFFRCxXQUFXO1FBQ1QsMkNBQTJDO0lBQzdDLENBQUM7d0dBMUJVLGdCQUFnQjs0RkFBaEIsZ0JBQWdCLHFKQ1Y3QixncUJBbUJBOzs0RkRUYSxnQkFBZ0I7a0JBTDVCLFNBQVM7K0JBQ0UsYUFBYTttRkFNZCxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkRlc3Ryb3ksIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBMb2FkaW5nU2VydmljZSB9IGZyb20gJy4uLy4uL3NlcnZpY2VzL2xvYWRpbmcuc2VydmljZSc7XHJcbmltcG9ydCB7IFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xyXG5pbXBvcnQgeyBMb2FkaW5nRGVuc2l0eSB9IGZyb20gJy4uLy4uL2VudW1zL2xvYWRpbmctZGVuc2l0eS5lbnVtJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnY2ZjLWxvYWRpbmcnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9sb2FkaW5nLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9sb2FkaW5nLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIExvYWRpbmdDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XHJcblxyXG4gIEBJbnB1dCgpIGRlbnNpdHk6IExvYWRpbmdEZW5zaXR5ID0gTG9hZGluZ0RlbnNpdHkubWVkaXVtO1xyXG4gIEBJbnB1dCgpIHByb2dyZXNzPzogbnVtYmVyO1xyXG4gIEBJbnB1dCgpIG1pblZhbHVlOiBudW1iZXIgPSAwO1xyXG4gIEBJbnB1dCgpIG1heFZhbHVlOiBudW1iZXIgPSAxMDA7XHJcblxyXG4gIGlzRnVsbFNjcmVlbiA9IHRydWU7XHJcblxyXG4gIHByaXZhdGUgbG9hZGluZ1N1YnNjcmlwdGlvbjogU3Vic2NyaXB0aW9uIHwgdW5kZWZpbmVkO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGxvYWRpbmdTZXJ2aWNlOiBMb2FkaW5nU2VydmljZSkge31cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICAvLyB0aGlzLmxvYWRpbmdTdWJzY3JpcHRpb24gPSB0aGlzLmxvYWRpbmdTZXJ2aWNlLmlzTG9hZGluZyQuc3Vic2NyaWJlKFxyXG4gICAgLy8gICAoeyBpc0xvYWRpbmcsIGlzRnVsbFNjcmVlbiB9KSA9PiB7XHJcbiAgICAvLyAgICAgdGhpcy5pc0Z1bGxTY3JlZW4gPSBpc0Z1bGxTY3JlZW47XHJcbiAgICAvLyAgICAgaWYgKGlzTG9hZGluZykge1xyXG4gICAgLy8gICAgIH0gZWxzZSB7XHJcbiAgICAvLyAgICAgfVxyXG4gICAgLy8gICB9XHJcbiAgICAvLyApO1xyXG4gIH1cclxuXHJcbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XHJcbiAgICAvLyB0aGlzLmxvYWRpbmdTdWJzY3JpcHRpb24/LnVuc3Vic2NyaWJlKCk7XHJcbiAgfVxyXG59XHJcbiIsIjxjZmMtc2NyaW0gW2lzVmlzaWJsZV09XCJpc0Z1bGxTY3JlZW5cIj48L2NmYy1zY3JpbT5cclxuXHJcbjxkaXZcclxuICBjbGFzcz1cImJyLWxvYWRpbmdcIlxyXG4gIHJvbGU9XCJwcm9ncmVzc2JhclwiXHJcbiAgW2FyaWFMYWJlbF09XCJwcm9ncmVzcyA/ICdDYXJyZWdhbmRvIGVtICcgKyBwcm9ncmVzcyArICclJyA6ICdDYXJyZWdhbmRvLi4uJ1wiXHJcbiAgW2F0dHIuZGF0YS1wcm9ncmVzc109XCJwcm9ncmVzc1wiXHJcbiAgW2F0dHIuYXJpYS12YWx1ZW1pbl09XCJwcm9ncmVzcyA/IG1pblZhbHVlIDogdW5kZWZpbmVkXCJcclxuICBbYXR0ci5hcmlhLXZhbHVlbWF4XT1cInByb2dyZXNzID8gbWF4VmFsdWUgOiB1bmRlZmluZWRcIlxyXG4gIFtuZ0NsYXNzXT1cImRlbnNpdHlcIj5cclxuICA8bmctY29udGFpbmVyICpuZ0lmPVwicHJvZ3Jlc3NcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJici1sb2FkaW5nLW1hc2sgZnVsbFwiPlxyXG4gICAgICA8ZGl2IGNsYXNzPVwiYnItbG9hZGluZy1maWxsXCI+PC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJici1sb2FkaW5nLW1hc2tcIj5cclxuICAgICAgPGRpdiBjbGFzcz1cImJyLWxvYWRpbmctZmlsbFwiPjwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbiAgPC9uZy1jb250YWluZXI+XHJcbjwvZGl2PlxyXG4iXX0=