ng-loaders
Version:
Angular component to add CSS loaders to your application
52 lines • 10.4 kB
JavaScript
import { NgClass, NgComponentOutlet, NgIf, NgSwitch, NgSwitchCase, NgSwitchDefault, } from '@angular/common';
import { Component, Injector, Input } from '@angular/core';
import { RotatingCubesComponent } from '../rotating-cubes/rotating-cubes.component';
import { CubeGridComponent } from '../cube-grid/cube-grid.component';
import { EllipsisComponent } from '../ellipsis/ellipsis.component';
import { GrowingBarsComponent } from '../growing-bars/growing-bars.component';
import { GrowingCircleComponent } from '../growing-circle/growing-circle.component';
import { PulsingCirclesComponent } from '../pulsing-circles/pulsing-circles.component';
import { RotatingDotsComponent } from '../rotating-dots/rotating-dots.component';
import { RotatingSquareComponent } from '../rotating-square/rotating-square.component';
import { NG_LOADERS_CONFIG } from '../injection-token';
import * as i0 from "@angular/core";
class LoaderComponent {
constructor(_injector) {
this._injector = _injector;
this.config = this._injector.get(NG_LOADERS_CONFIG);
this.spinnerType = this.config.spinnerType;
this.coverContainer = false;
this.fixed = false;
this.componentsMap = {
'cube-grid': CubeGridComponent,
ellipsis: EllipsisComponent,
'growing-bars': GrowingBarsComponent,
'growing-circle': GrowingCircleComponent,
'pulsing-circles': PulsingCirclesComponent,
'rotating-cubes': RotatingCubesComponent,
'rotating-dots': RotatingDotsComponent,
'rotating-square': RotatingSquareComponent,
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.6", ngImport: i0, type: LoaderComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.6", type: LoaderComponent, isStandalone: true, selector: "ngx-loader", inputs: { spinnerType: "spinnerType", coverContainer: "coverContainer", fixed: "fixed" }, ngImport: i0, template: "<div\n\tclass=\"ng-loader-container\"\n\t[ngClass]=\"{ 'cover-container': coverContainer, fixed }\"\n>\n\t<div *ngIf=\"coverContainer || fixed\" class=\"overlay\"></div>\n\t<ng-container\n\t\t*ngComponentOutlet=\"componentsMap[spinnerType]\"\n\t></ng-container>\n</div>\n", styles: [".ng-loader-container{--defaultSpinnerColor: blue;--defaultOverlayColor: #ffffff;--defaultOverlayOpacity: .5}.ng-loader-container.cover-container,.ng-loader-container.fixed{display:flex;height:100%;width:100%;justify-content:center;align-items:center;position:absolute;inset:0;z-index:10}.ng-loader-container.cover-container .overlay,.ng-loader-container.fixed .overlay{position:absolute;inset:0;background-color:var(--spinnerOverlayColor, var(--defaultOverlayColor));opacity:var(--spinnerOverlayOpacity, var(--defaultOverlayOpacity))}.ng-loader-container.fixed,.ng-loader-container.fixed .overlay{position:fixed}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }] }); }
}
export { LoaderComponent };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.6", ngImport: i0, type: LoaderComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-loader', standalone: true, imports: [
NgIf,
NgClass,
NgSwitch,
NgSwitchCase,
NgSwitchDefault,
NgComponentOutlet,
], template: "<div\n\tclass=\"ng-loader-container\"\n\t[ngClass]=\"{ 'cover-container': coverContainer, fixed }\"\n>\n\t<div *ngIf=\"coverContainer || fixed\" class=\"overlay\"></div>\n\t<ng-container\n\t\t*ngComponentOutlet=\"componentsMap[spinnerType]\"\n\t></ng-container>\n</div>\n", styles: [".ng-loader-container{--defaultSpinnerColor: blue;--defaultOverlayColor: #ffffff;--defaultOverlayOpacity: .5}.ng-loader-container.cover-container,.ng-loader-container.fixed{display:flex;height:100%;width:100%;justify-content:center;align-items:center;position:absolute;inset:0;z-index:10}.ng-loader-container.cover-container .overlay,.ng-loader-container.fixed .overlay{position:absolute;inset:0;background-color:var(--spinnerOverlayColor, var(--defaultOverlayColor));opacity:var(--spinnerOverlayOpacity, var(--defaultOverlayOpacity))}.ng-loader-container.fixed,.ng-loader-container.fixed .overlay{position:fixed}\n"] }]
}], ctorParameters: function () { return [{ type: i0.Injector }]; }, propDecorators: { spinnerType: [{
type: Input
}], coverContainer: [{
type: Input
}], fixed: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvbmctbG9hZGVycy9zcmMvbGliL2xvYWRlci9sb2FkZXIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9uZy1sb2FkZXJzL3NyYy9saWIvbG9hZGVyL2xvYWRlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQ04sT0FBTyxFQUNQLGlCQUFpQixFQUNqQixJQUFJLEVBQ0osUUFBUSxFQUNSLFlBQVksRUFDWixlQUFlLEdBQ2YsTUFBTSxpQkFBaUIsQ0FBQztBQUN6QixPQUFPLEVBQUUsU0FBUyxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDM0QsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDcEYsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sa0NBQWtDLENBQUM7QUFDckUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZ0NBQWdDLENBQUM7QUFDbkUsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0sd0NBQXdDLENBQUM7QUFDOUUsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDcEYsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sOENBQThDLENBQUM7QUFDdkYsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sMENBQTBDLENBQUM7QUFDakYsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sOENBQThDLENBQUM7QUFDdkYsT0FBTyxFQUFFLGlCQUFpQixFQUFtQixNQUFNLG9CQUFvQixDQUFDOztBQVl4RSxNQWNhLGVBQWU7SUFnQjNCLFlBQW9CLFNBQW1CO1FBQW5CLGNBQVMsR0FBVCxTQUFTLENBQVU7UUFmL0IsV0FBTSxHQUFvQixJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFDO1FBQy9ELGdCQUFXLEdBQWdCLElBQUksQ0FBQyxNQUFNLENBQUMsV0FBVyxDQUFDO1FBQ25ELG1CQUFjLEdBQUcsS0FBSyxDQUFDO1FBQ3ZCLFVBQUssR0FBWSxLQUFLLENBQUM7UUFDaEMsa0JBQWEsR0FBRztZQUNmLFdBQVcsRUFBRSxpQkFBaUI7WUFDOUIsUUFBUSxFQUFFLGlCQUFpQjtZQUMzQixjQUFjLEVBQUUsb0JBQW9CO1lBQ3BDLGdCQUFnQixFQUFFLHNCQUFzQjtZQUN4QyxpQkFBaUIsRUFBRSx1QkFBdUI7WUFDMUMsZ0JBQWdCLEVBQUUsc0JBQXNCO1lBQ3hDLGVBQWUsRUFBRSxxQkFBcUI7WUFDdEMsaUJBQWlCLEVBQUUsdUJBQXVCO1NBQzFDLENBQUM7SUFFd0MsQ0FBQzs4R0FoQi9CLGVBQWU7a0dBQWYsZUFBZSxnS0MzQzVCLGlSQVNBLGdxQkR3QkUsSUFBSSw2RkFDSixPQUFPLG9GQUlQLGlCQUFpQjs7U0FLTixlQUFlOzJGQUFmLGVBQWU7a0JBZDNCLFNBQVM7K0JBQ0MsWUFBWSxjQUNWLElBQUksV0FDUDt3QkFDUixJQUFJO3dCQUNKLE9BQU87d0JBQ1AsUUFBUTt3QkFDUixZQUFZO3dCQUNaLGVBQWU7d0JBQ2YsaUJBQWlCO3FCQUNqQjsrRkFNUSxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcblx0TmdDbGFzcyxcblx0TmdDb21wb25lbnRPdXRsZXQsXG5cdE5nSWYsXG5cdE5nU3dpdGNoLFxuXHROZ1N3aXRjaENhc2UsXG5cdE5nU3dpdGNoRGVmYXVsdCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgSW5qZWN0b3IsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBSb3RhdGluZ0N1YmVzQ29tcG9uZW50IH0gZnJvbSAnLi4vcm90YXRpbmctY3ViZXMvcm90YXRpbmctY3ViZXMuY29tcG9uZW50JztcbmltcG9ydCB7IEN1YmVHcmlkQ29tcG9uZW50IH0gZnJvbSAnLi4vY3ViZS1ncmlkL2N1YmUtZ3JpZC5jb21wb25lbnQnO1xuaW1wb3J0IHsgRWxsaXBzaXNDb21wb25lbnQgfSBmcm9tICcuLi9lbGxpcHNpcy9lbGxpcHNpcy5jb21wb25lbnQnO1xuaW1wb3J0IHsgR3Jvd2luZ0JhcnNDb21wb25lbnQgfSBmcm9tICcuLi9ncm93aW5nLWJhcnMvZ3Jvd2luZy1iYXJzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBHcm93aW5nQ2lyY2xlQ29tcG9uZW50IH0gZnJvbSAnLi4vZ3Jvd2luZy1jaXJjbGUvZ3Jvd2luZy1jaXJjbGUuY29tcG9uZW50JztcbmltcG9ydCB7IFB1bHNpbmdDaXJjbGVzQ29tcG9uZW50IH0gZnJvbSAnLi4vcHVsc2luZy1jaXJjbGVzL3B1bHNpbmctY2lyY2xlcy5jb21wb25lbnQnO1xuaW1wb3J0IHsgUm90YXRpbmdEb3RzQ29tcG9uZW50IH0gZnJvbSAnLi4vcm90YXRpbmctZG90cy9yb3RhdGluZy1kb3RzLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBSb3RhdGluZ1NxdWFyZUNvbXBvbmVudCB9IGZyb20gJy4uL3JvdGF0aW5nLXNxdWFyZS9yb3RhdGluZy1zcXVhcmUuY29tcG9uZW50JztcbmltcG9ydCB7IE5HX0xPQURFUlNfQ09ORklHLCBOZ0xvYWRlcnNDb25maWcgfSBmcm9tICcuLi9pbmplY3Rpb24tdG9rZW4nO1xuXG5leHBvcnQgdHlwZSBTcGlubmVyVHlwZSA9XG5cdHwgJ2N1YmUtZ3JpZCdcblx0fCAnZWxsaXBzaXMnXG5cdHwgJ2dyb3dpbmctYmFycydcblx0fCAnZ3Jvd2luZy1jaXJjbGUnXG5cdHwgJ3B1bHNpbmctY2lyY2xlcydcblx0fCAncm90YXRpbmctY3ViZXMnXG5cdHwgJ3JvdGF0aW5nLWRvdHMnXG5cdHwgJ3JvdGF0aW5nLXNxdWFyZSc7XG5cbkBDb21wb25lbnQoe1xuXHRzZWxlY3RvcjogJ25neC1sb2FkZXInLFxuXHRzdGFuZGFsb25lOiB0cnVlLFxuXHRpbXBvcnRzOiBbXG5cdFx0TmdJZixcblx0XHROZ0NsYXNzLFxuXHRcdE5nU3dpdGNoLFxuXHRcdE5nU3dpdGNoQ2FzZSxcblx0XHROZ1N3aXRjaERlZmF1bHQsXG5cdFx0TmdDb21wb25lbnRPdXRsZXQsXG5cdF0sXG5cdHRlbXBsYXRlVXJsOiAnLi9sb2FkZXIuY29tcG9uZW50Lmh0bWwnLFxuXHRzdHlsZVVybHM6IFsnLi9sb2FkZXIuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgTG9hZGVyQ29tcG9uZW50IHtcblx0cHJpdmF0ZSBjb25maWc6IE5nTG9hZGVyc0NvbmZpZyA9IHRoaXMuX2luamVjdG9yLmdldChOR19MT0FERVJTX0NPTkZJRyk7XG5cdEBJbnB1dCgpIHNwaW5uZXJUeXBlOiBTcGlubmVyVHlwZSA9IHRoaXMuY29uZmlnLnNwaW5uZXJUeXBlO1xuXHRASW5wdXQoKSBjb3ZlckNvbnRhaW5lciA9IGZhbHNlO1xuXHRASW5wdXQoKSBmaXhlZDogYm9vbGVhbiA9IGZhbHNlO1xuXHRjb21wb25lbnRzTWFwID0ge1xuXHRcdCdjdWJlLWdyaWQnOiBDdWJlR3JpZENvbXBvbmVudCxcblx0XHRlbGxpcHNpczogRWxsaXBzaXNDb21wb25lbnQsXG5cdFx0J2dyb3dpbmctYmFycyc6IEdyb3dpbmdCYXJzQ29tcG9uZW50LFxuXHRcdCdncm93aW5nLWNpcmNsZSc6IEdyb3dpbmdDaXJjbGVDb21wb25lbnQsXG5cdFx0J3B1bHNpbmctY2lyY2xlcyc6IFB1bHNpbmdDaXJjbGVzQ29tcG9uZW50LFxuXHRcdCdyb3RhdGluZy1jdWJlcyc6IFJvdGF0aW5nQ3ViZXNDb21wb25lbnQsXG5cdFx0J3JvdGF0aW5nLWRvdHMnOiBSb3RhdGluZ0RvdHNDb21wb25lbnQsXG5cdFx0J3JvdGF0aW5nLXNxdWFyZSc6IFJvdGF0aW5nU3F1YXJlQ29tcG9uZW50LFxuXHR9O1xuXG5cdGNvbnN0cnVjdG9yKHByaXZhdGUgX2luamVjdG9yOiBJbmplY3Rvcikge31cbn1cbiIsIjxkaXZcblx0Y2xhc3M9XCJuZy1sb2FkZXItY29udGFpbmVyXCJcblx0W25nQ2xhc3NdPVwieyAnY292ZXItY29udGFpbmVyJzogY292ZXJDb250YWluZXIsIGZpeGVkIH1cIlxuPlxuXHQ8ZGl2ICpuZ0lmPVwiY292ZXJDb250YWluZXIgfHwgZml4ZWRcIiBjbGFzcz1cIm92ZXJsYXlcIj48L2Rpdj5cblx0PG5nLWNvbnRhaW5lclxuXHRcdCpuZ0NvbXBvbmVudE91dGxldD1cImNvbXBvbmVudHNNYXBbc3Bpbm5lclR5cGVdXCJcblx0PjwvbmctY29udGFpbmVyPlxuPC9kaXY+XG4iXX0=