sdk-loading
Version:
Simple to use (Angular) loading component that overlays other components while processing.
59 lines (53 loc) • 5.29 kB
JavaScript
import * as i0 from '@angular/core';
import { Input, Component, NO_ERRORS_SCHEMA, NgModule } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
class SDKLoadingComponent {
constructor() {
/**************************************************************************
* Input/Output Parameters
**************************************************************************/
this.isLoading = false;
this.showEllipsis = false;
this.style = "";
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SDKLoadingComponent, isStandalone: true, selector: "sdk-loading", inputs: { isLoading: "isLoading", showEllipsis: "showEllipsis", style: "style" }, ngImport: i0, template: "<div *ngIf=\"isLoading\" class=\"sdk-loading\" [style]=\"style\">\n <div *ngIf=\"isLoading && !showEllipsis\" class=\"spinner\">\n <div class=\"sdk-loading-icon\"></div>\n </div>\n <div *ngIf=\"isLoading && showEllipsis\" class=\"ellipsis\">\n <div class=\"sdk-loading-icon\"></div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sdk-loading{position:absolute;inset:0;z-index:9999;overflow:hidden;background-color:#000;opacity:.33}.sdk-loading .spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);overflow:hidden}.sdk-loading .spinner .sdk-loading-icon{height:75px;width:75px;border-radius:50%;position:relative;border:3px solid rgb(44.75,44.75,44.75);border-right:3px solid white;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.sdk-loading .ellipsis .sdk-loading-icon{font-size:30px;font-weight:700;color:#fff}.sdk-loading .ellipsis .sdk-loading-icon:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);overflow:hidden;display:inline-block;animation:ellipsis steps(4,end) 1s infinite;content:\"\\2026\";margin:-8px 0;padding:0;width:0px}@keyframes ellipsis{to{width:1em}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingComponent, decorators: [{
type: Component,
args: [{ selector: 'sdk-loading', standalone: true, imports: [CommonModule], template: "<div *ngIf=\"isLoading\" class=\"sdk-loading\" [style]=\"style\">\n <div *ngIf=\"isLoading && !showEllipsis\" class=\"spinner\">\n <div class=\"sdk-loading-icon\"></div>\n </div>\n <div *ngIf=\"isLoading && showEllipsis\" class=\"ellipsis\">\n <div class=\"sdk-loading-icon\"></div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.sdk-loading{position:absolute;inset:0;z-index:9999;overflow:hidden;background-color:#000;opacity:.33}.sdk-loading .spinner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);overflow:hidden}.sdk-loading .spinner .sdk-loading-icon{height:75px;width:75px;border-radius:50%;position:relative;border:3px solid rgb(44.75,44.75,44.75);border-right:3px solid white;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.sdk-loading .ellipsis .sdk-loading-icon{font-size:30px;font-weight:700;color:#fff}.sdk-loading .ellipsis .sdk-loading-icon:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);overflow:hidden;display:inline-block;animation:ellipsis steps(4,end) 1s infinite;content:\"\\2026\";margin:-8px 0;padding:0;width:0px}@keyframes ellipsis{to{width:1em}}\n"] }]
}], propDecorators: { isLoading: [{
type: Input
}], showEllipsis: [{
type: Input
}], style: [{
type: Input
}] } });
class SDKLoadingModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingModule, imports: [SDKLoadingComponent], exports: [SDKLoadingComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingModule, imports: [SDKLoadingComponent] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SDKLoadingModule, decorators: [{
type: NgModule,
args: [{
imports: [
SDKLoadingComponent
],
exports: [
SDKLoadingComponent
],
schemas: [
NO_ERRORS_SCHEMA
]
}]
}] });
/*
* Public API Surface of sdk-loading
*/
/**
* Generated bundle index. Do not edit.
*/
export { SDKLoadingComponent, SDKLoadingModule };
//# sourceMappingURL=sdk-loading.mjs.map