@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
44 lines • 7.97 kB
JavaScript
import { Component, Input } from '@angular/core';
import { gettext } from '@c8y/ngx-components/gettext';
import { NgIf } from '@angular/common';
import { C8yTranslatePipe } from '../i18n';
import * as i0 from "@angular/core";
export class LoadingComponent {
constructor() {
/**
* Defining the layout of the loading component. By default the
* component loading activity is used.
*/
this.layout = 'component';
/**
* If set, a progress bar is shown. The layout property is ignored.
*/
this.progress = null;
/**
* Showing a message while loading. The application layout by default shows the label `Loading…`.
*/
this.message = null;
}
/**
* @ignore
*/
get defaultLoadingMessage() {
if (this.message !== null) {
return this.message;
}
return this.layout === 'application' ? gettext('Loading…') : null;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: LoadingComponent, isStandalone: true, selector: "c8y-loading", inputs: { layout: "layout", progress: "progress", message: "message" }, ngImport: i0, template: "<div\n class=\"spinner p-relative\"\n *ngIf=\"layout === 'component' && progress === null\"\n>\n <div class=\"rect1\"></div>\n <div class=\"rect2\"></div>\n <div class=\"rect3\"></div>\n <div class=\"rect4\"></div>\n <div class=\"rect5\"></div>\n</div>\n\n<div\n class=\"spinner-snake\"\n *ngIf=\"layout === 'application' && progress === null\"\n></div>\n\n<div\n class=\"loading-bar active\"\n *ngIf=\"layout === 'page' && progress === null\"\n></div>\n\n<div\n class=\"progress progress-striped active\"\n *ngIf=\"progress !== null\"\n>\n <div\n class=\"progress-bar\"\n [style.width]=\"progress + '%'\"\n [attr.aria-label]=\"'Progress' | translate\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"progress\"\n role=\"progressbar\"\n ></div>\n</div>\n\n<p\n class=\"text-center\"\n *ngIf=\"defaultLoadingMessage\"\n>\n {{ defaultLoadingMessage | translate }}\n</p>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoadingComponent, decorators: [{
type: Component,
args: [{ selector: 'c8y-loading', standalone: true, imports: [NgIf, C8yTranslatePipe], template: "<div\n class=\"spinner p-relative\"\n *ngIf=\"layout === 'component' && progress === null\"\n>\n <div class=\"rect1\"></div>\n <div class=\"rect2\"></div>\n <div class=\"rect3\"></div>\n <div class=\"rect4\"></div>\n <div class=\"rect5\"></div>\n</div>\n\n<div\n class=\"spinner-snake\"\n *ngIf=\"layout === 'application' && progress === null\"\n></div>\n\n<div\n class=\"loading-bar active\"\n *ngIf=\"layout === 'page' && progress === null\"\n></div>\n\n<div\n class=\"progress progress-striped active\"\n *ngIf=\"progress !== null\"\n>\n <div\n class=\"progress-bar\"\n [style.width]=\"progress + '%'\"\n [attr.aria-label]=\"'Progress' | translate\"\n aria-valuemin=\"0\"\n aria-valuemax=\"100\"\n [attr.aria-valuenow]=\"progress\"\n role=\"progressbar\"\n ></div>\n</div>\n\n<p\n class=\"text-center\"\n *ngIf=\"defaultLoadingMessage\"\n>\n {{ defaultLoadingMessage | translate }}\n</p>\n" }]
}], propDecorators: { layout: [{
type: Input
}], progress: [{
type: Input
}], message: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi9jb3JlL2NvbW1vbi9sb2FkaW5nLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uL2NvcmUvY29tbW9uL2xvYWRpbmcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakQsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBQ3RELE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxTQUFTLENBQUM7O0FBUTNDLE1BQU0sT0FBTyxnQkFBZ0I7SUFON0I7UUFPRTs7O1dBR0c7UUFDTSxXQUFNLEdBQXlDLFdBQVcsQ0FBQztRQUVwRTs7V0FFRztRQUNNLGFBQVEsR0FBVyxJQUFJLENBQUM7UUFFakM7O1dBRUc7UUFDTSxZQUFPLEdBQVcsSUFBSSxDQUFDO0tBV2pDO0lBVEM7O09BRUc7SUFDSCxJQUFJLHFCQUFxQjtRQUN2QixJQUFJLElBQUksQ0FBQyxPQUFPLEtBQUssSUFBSSxFQUFFLENBQUM7WUFDMUIsT0FBTyxJQUFJLENBQUMsT0FBTyxDQUFDO1FBQ3RCLENBQUM7UUFDRCxPQUFPLElBQUksQ0FBQyxNQUFNLEtBQUssYUFBYSxDQUFDLENBQUMsQ0FBQyxPQUFPLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQztJQUNwRSxDQUFDOytHQXpCVSxnQkFBZ0I7bUdBQWhCLGdCQUFnQiwrSUNYN0IscTZCQTBDQSw0Q0RqQ1ksSUFBSSx3RkFBRSxnQkFBZ0I7OzRGQUVyQixnQkFBZ0I7a0JBTjVCLFNBQVM7K0JBQ0UsYUFBYSxjQUVYLElBQUksV0FDUCxDQUFDLElBQUksRUFBRSxnQkFBZ0IsQ0FBQzs4QkFPeEIsTUFBTTtzQkFBZCxLQUFLO2dCQUtHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBS0csT0FBTztzQkFBZixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgZ2V0dGV4dCB9IGZyb20gJ0BjOHkvbmd4LWNvbXBvbmVudHMvZ2V0dGV4dCc7XG5pbXBvcnQgeyBOZ0lmIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IEM4eVRyYW5zbGF0ZVBpcGUgfSBmcm9tICcuLi9pMThuJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYzh5LWxvYWRpbmcnLFxuICB0ZW1wbGF0ZVVybDogJy4vbG9hZGluZy5jb21wb25lbnQuaHRtbCcsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtOZ0lmLCBDOHlUcmFuc2xhdGVQaXBlXVxufSlcbmV4cG9ydCBjbGFzcyBMb2FkaW5nQ29tcG9uZW50IHtcbiAgLyoqXG4gICAqIERlZmluaW5nIHRoZSBsYXlvdXQgb2YgdGhlIGxvYWRpbmcgY29tcG9uZW50LiBCeSBkZWZhdWx0IHRoZVxuICAgKiBjb21wb25lbnQgbG9hZGluZyBhY3Rpdml0eSBpcyB1c2VkLlxuICAgKi9cbiAgQElucHV0KCkgbGF5b3V0OiAnY29tcG9uZW50JyB8ICdhcHBsaWNhdGlvbicgfCAncGFnZScgPSAnY29tcG9uZW50JztcblxuICAvKipcbiAgICogSWYgc2V0LCBhIHByb2dyZXNzIGJhciBpcyBzaG93bi4gVGhlIGxheW91dCBwcm9wZXJ0eSBpcyBpZ25vcmVkLlxuICAgKi9cbiAgQElucHV0KCkgcHJvZ3Jlc3M6IG51bWJlciA9IG51bGw7XG5cbiAgLyoqXG4gICAqIFNob3dpbmcgYSBtZXNzYWdlIHdoaWxlIGxvYWRpbmcuIFRoZSBhcHBsaWNhdGlvbiBsYXlvdXQgYnkgZGVmYXVsdCBzaG93cyB0aGUgbGFiZWwgYExvYWRpbmfigKZgLlxuICAgKi9cbiAgQElucHV0KCkgbWVzc2FnZTogc3RyaW5nID0gbnVsbDtcblxuICAvKipcbiAgICogQGlnbm9yZVxuICAgKi9cbiAgZ2V0IGRlZmF1bHRMb2FkaW5nTWVzc2FnZSgpIHtcbiAgICBpZiAodGhpcy5tZXNzYWdlICE9PSBudWxsKSB7XG4gICAgICByZXR1cm4gdGhpcy5tZXNzYWdlO1xuICAgIH1cbiAgICByZXR1cm4gdGhpcy5sYXlvdXQgPT09ICdhcHBsaWNhdGlvbicgPyBnZXR0ZXh0KCdMb2FkaW5n4oCmJykgOiBudWxsO1xuICB9XG59XG4iLCI8ZGl2XG4gIGNsYXNzPVwic3Bpbm5lciBwLXJlbGF0aXZlXCJcbiAgKm5nSWY9XCJsYXlvdXQgPT09ICdjb21wb25lbnQnICYmIHByb2dyZXNzID09PSBudWxsXCJcbj5cbiAgPGRpdiBjbGFzcz1cInJlY3QxXCI+PC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJyZWN0MlwiPjwvZGl2PlxuICA8ZGl2IGNsYXNzPVwicmVjdDNcIj48L2Rpdj5cbiAgPGRpdiBjbGFzcz1cInJlY3Q0XCI+PC9kaXY+XG4gIDxkaXYgY2xhc3M9XCJyZWN0NVwiPjwvZGl2PlxuPC9kaXY+XG5cbjxkaXZcbiAgY2xhc3M9XCJzcGlubmVyLXNuYWtlXCJcbiAgKm5nSWY9XCJsYXlvdXQgPT09ICdhcHBsaWNhdGlvbicgJiYgcHJvZ3Jlc3MgPT09IG51bGxcIlxuPjwvZGl2PlxuXG48ZGl2XG4gIGNsYXNzPVwibG9hZGluZy1iYXIgYWN0aXZlXCJcbiAgKm5nSWY9XCJsYXlvdXQgPT09ICdwYWdlJyAmJiBwcm9ncmVzcyA9PT0gbnVsbFwiXG4+PC9kaXY+XG5cbjxkaXZcbiAgY2xhc3M9XCJwcm9ncmVzcyBwcm9ncmVzcy1zdHJpcGVkIGFjdGl2ZVwiXG4gICpuZ0lmPVwicHJvZ3Jlc3MgIT09IG51bGxcIlxuPlxuICA8ZGl2XG4gICAgY2xhc3M9XCJwcm9ncmVzcy1iYXJcIlxuICAgIFtzdHlsZS53aWR0aF09XCJwcm9ncmVzcyArICclJ1wiXG4gICAgW2F0dHIuYXJpYS1sYWJlbF09XCInUHJvZ3Jlc3MnIHwgdHJhbnNsYXRlXCJcbiAgICBhcmlhLXZhbHVlbWluPVwiMFwiXG4gICAgYXJpYS12YWx1ZW1heD1cIjEwMFwiXG4gICAgW2F0dHIuYXJpYS12YWx1ZW5vd109XCJwcm9ncmVzc1wiXG4gICAgcm9sZT1cInByb2dyZXNzYmFyXCJcbiAgPjwvZGl2PlxuPC9kaXY+XG5cbjxwXG4gIGNsYXNzPVwidGV4dC1jZW50ZXJcIlxuICAqbmdJZj1cImRlZmF1bHRMb2FkaW5nTWVzc2FnZVwiXG4+XG4gIHt7IGRlZmF1bHRMb2FkaW5nTWVzc2FnZSB8IHRyYW5zbGF0ZSB9fVxuPC9wPlxuIl19