@coreui/angular
Version:
CoreUI for Angular UI components library
92 lines • 13.5 kB
JavaScript
import { Component, ContentChildren, HostBinding, Input } from '@angular/core';
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { TemplateIdDirective } from '../../shared';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "../../card/card-body.component";
import * as i3 from "../../card/card-footer.component";
export class WidgetStatFComponent {
constructor() {
this._padding = false;
this.templates = {};
}
/**
* Set padding of your component.
* @type boolean
*/
get padding() {
return this._padding;
}
set padding(value) {
this._padding = coerceBooleanProperty(value);
}
get hostClasses() {
return {
card: true
};
}
get cardBodyClasses() {
return {
'd-flex': true,
'align-items-center': true,
'p-0': !this.padding,
};
}
get iconClasses() {
return {
'me-3': !this.textColor,
'text-white': true,
[`bg-${this.color}`]: !!this.color,
'p-3': this.padding,
'p-4': !this.padding,
};
}
get titleClasses() {
return {
'text-medium-emphasis': !this.textColor,
'small': true,
'text-uppercase': true,
'fw-semibold': true,
[`text-${this.textColor}`]: !!this.textColor,
};
}
get valueClasses() {
return {
'fs-6': !this.textColor,
'fw-semibold': true,
[`text-${this.textColor}`]: !!this.textColor,
};
}
ngAfterContentInit() {
this.contentTemplates.forEach((child) => {
this.templates[child.id] = child.templateRef;
});
}
}
WidgetStatFComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: WidgetStatFComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
WidgetStatFComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: WidgetStatFComponent, selector: "c-widget-stat-f", inputs: { color: "color", textColor: "textColor", footer: "footer", icon: "icon", padding: "padding", title: "title", value: "value" }, host: { properties: { "class": "this.hostClasses" } }, queries: [{ propertyName: "contentTemplates", predicate: TemplateIdDirective, descendants: true }], exportAs: ["cWidgetStatB"], ngImport: i0, template: "<ng-container>\n <c-card-body [ngClass]=\"cardBodyClasses\">\n <div [ngClass]=\"iconClasses\">\n <ng-container *ngTemplateOutlet=\"templates?.widgetIconTemplate || defaultWidgetIconTemplate\"></ng-container>\n </div>\n <div>\n <div [ngClass]=\"valueClasses\">{{value}}</div>\n <div [ngClass]=\"titleClasses\">{{title}}</div>\n </div>\n </c-card-body>\n <c-card-footer *ngIf=\"footer || templates?.widgetFooterTemplate\">\n <ng-container *ngTemplateOutlet=\"templates?.widgetFooterTemplate || defaultFooterIconTemplate\"></ng-container>\n </c-card-footer>\n</ng-container>\n\n<ng-template #defaultWidgetIconTemplate>\n <span>{{icon}}</span>\n</ng-template>\n\n<ng-template #defaultFooterIconTemplate>\n <span>{{footer}}</span>\n</ng-template>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.CardBodyComponent, selector: "c-card-body, [c-card-body]" }, { kind: "component", type: i3.CardFooterComponent, selector: "c-card-footer, [c-card-footer]" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: WidgetStatFComponent, decorators: [{
type: Component,
args: [{ selector: 'c-widget-stat-f', exportAs: 'cWidgetStatB', template: "<ng-container>\n <c-card-body [ngClass]=\"cardBodyClasses\">\n <div [ngClass]=\"iconClasses\">\n <ng-container *ngTemplateOutlet=\"templates?.widgetIconTemplate || defaultWidgetIconTemplate\"></ng-container>\n </div>\n <div>\n <div [ngClass]=\"valueClasses\">{{value}}</div>\n <div [ngClass]=\"titleClasses\">{{title}}</div>\n </div>\n </c-card-body>\n <c-card-footer *ngIf=\"footer || templates?.widgetFooterTemplate\">\n <ng-container *ngTemplateOutlet=\"templates?.widgetFooterTemplate || defaultFooterIconTemplate\"></ng-container>\n </c-card-footer>\n</ng-container>\n\n<ng-template #defaultWidgetIconTemplate>\n <span>{{icon}}</span>\n</ng-template>\n\n<ng-template #defaultFooterIconTemplate>\n <span>{{footer}}</span>\n</ng-template>\n" }]
}], propDecorators: { color: [{
type: Input
}], textColor: [{
type: Input
}], footer: [{
type: Input
}], icon: [{
type: Input
}], padding: [{
type: Input
}], title: [{
type: Input
}], value: [{
type: Input
}], contentTemplates: [{
type: ContentChildren,
args: [TemplateIdDirective, { descendants: true }]
}], hostClasses: [{
type: HostBinding,
args: ['class']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0LXN0YXQtZi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JldWktYW5ndWxhci9zcmMvbGliL3dpZGdldC93aWRnZXQtc3RhdC1mL3dpZGdldC1zdGF0LWYuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29yZXVpLWFuZ3VsYXIvc3JjL2xpYi93aWRnZXQvd2lkZ2V0LXN0YXQtZi93aWRnZXQtc3RhdC1mLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBb0IsU0FBUyxFQUFFLGVBQWUsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFhLE1BQU0sZUFBZSxDQUFDO0FBQzVHLE9BQU8sRUFBZ0IscUJBQXFCLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQztBQUU1RSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxjQUFjLENBQUM7Ozs7O0FBU25ELE1BQU0sT0FBTyxvQkFBb0I7SUFOakM7UUF5Q1UsYUFBUSxHQUFHLEtBQUssQ0FBQztRQWF6QixjQUFTLEdBQVEsRUFBRSxDQUFDO0tBbURyQjtJQTNFQzs7O09BR0c7SUFDSCxJQUNJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQztJQUNELElBQUksT0FBTyxDQUFDLEtBQWM7UUFDeEIsSUFBSSxDQUFDLFFBQVEsR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMvQyxDQUFDO0lBaUJELElBQ0ksV0FBVztRQUNiLE9BQU87WUFDTCxJQUFJLEVBQUUsSUFBSTtTQUNYLENBQUE7SUFDSCxDQUFDO0lBRUQsSUFBSSxlQUFlO1FBQ2pCLE9BQU87WUFDTCxRQUFRLEVBQUUsSUFBSTtZQUNkLG9CQUFvQixFQUFFLElBQUk7WUFDMUIsS0FBSyxFQUFFLENBQUMsSUFBSSxDQUFDLE9BQU87U0FDckIsQ0FBQTtJQUNILENBQUM7SUFFRCxJQUFJLFdBQVc7UUFDYixPQUFPO1lBQ0wsTUFBTSxFQUFFLENBQUMsSUFBSSxDQUFDLFNBQVM7WUFDdkIsWUFBWSxFQUFFLElBQUk7WUFDbEIsQ0FBQyxNQUFNLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSztZQUNsQyxLQUFLLEVBQUUsSUFBSSxDQUFDLE9BQU87WUFDbkIsS0FBSyxFQUFFLENBQUMsSUFBSSxDQUFDLE9BQU87U0FDckIsQ0FBQTtJQUNILENBQUM7SUFFRCxJQUFJLFlBQVk7UUFDZCxPQUFPO1lBQ0wsc0JBQXNCLEVBQUUsQ0FBQyxJQUFJLENBQUMsU0FBUztZQUN2QyxPQUFPLEVBQUUsSUFBSTtZQUNiLGdCQUFnQixFQUFFLElBQUk7WUFDdEIsYUFBYSxFQUFFLElBQUk7WUFDbkIsQ0FBQyxRQUFRLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsU0FBUztTQUM3QyxDQUFBO0lBQ0gsQ0FBQztJQUVELElBQUksWUFBWTtRQUNkLE9BQU87WUFDTCxNQUFNLEVBQUUsQ0FBQyxJQUFJLENBQUMsU0FBUztZQUN2QixhQUFhLEVBQUUsSUFBSTtZQUNuQixDQUFDLFFBQVEsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxTQUFTO1NBQzdDLENBQUE7SUFDSCxDQUFDO0lBRUQsa0JBQWtCO1FBQ2hCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxPQUFPLENBQUMsQ0FBQyxLQUEwQixFQUFFLEVBQUU7WUFDM0QsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUFDLEdBQUcsS0FBSyxDQUFDLFdBQVcsQ0FBQztRQUMvQyxDQUFDLENBQUMsQ0FBQztJQUNMLENBQUM7O2tIQWxHVSxvQkFBb0I7c0dBQXBCLG9CQUFvQix1UkFpRGQsbUJBQW1CLDRFQzdEdEMsNndCQXNCQTs0RkRWYSxvQkFBb0I7a0JBTmhDLFNBQVM7K0JBQ0UsaUJBQWlCLFlBR2pCLGNBQWM7OEJBU2YsS0FBSztzQkFBYixLQUFLO2dCQUtHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBS0csTUFBTTtzQkFBZCxLQUFLO2dCQUtHLElBQUk7c0JBQVosS0FBSztnQkFPRixPQUFPO3NCQURWLEtBQUs7Z0JBYUcsS0FBSztzQkFBYixLQUFLO2dCQUtHLEtBQUs7c0JBQWIsS0FBSztnQkFHcUQsZ0JBQWdCO3NCQUExRSxlQUFlO3VCQUFDLG1CQUFtQixFQUFFLEVBQUMsV0FBVyxFQUFFLElBQUksRUFBQztnQkFHckQsV0FBVztzQkFEZCxXQUFXO3VCQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBBZnRlckNvbnRlbnRJbml0LCBDb21wb25lbnQsIENvbnRlbnRDaGlsZHJlbiwgSG9zdEJpbmRpbmcsIElucHV0LCBRdWVyeUxpc3QgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQm9vbGVhbklucHV0LCBjb2VyY2VCb29sZWFuUHJvcGVydHkgfSBmcm9tICdAYW5ndWxhci9jZGsvY29lcmNpb24nO1xyXG5cclxuaW1wb3J0IHsgVGVtcGxhdGVJZERpcmVjdGl2ZSB9IGZyb20gJy4uLy4uL3NoYXJlZCc7XHJcbmltcG9ydCB7IENvbG9ycyB9IGZyb20gJy4uLy4uL2NvcmV1aS50eXBlcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2Mtd2lkZ2V0LXN0YXQtZicsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3dpZGdldC1zdGF0LWYuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3dpZGdldC1zdGF0LWYuY29tcG9uZW50LnNjc3MnXSxcclxuICBleHBvcnRBczogJ2NXaWRnZXRTdGF0QidcclxufSlcclxuZXhwb3J0IGNsYXNzIFdpZGdldFN0YXRGQ29tcG9uZW50IGltcGxlbWVudHMgQWZ0ZXJDb250ZW50SW5pdCB7XHJcblxyXG4gIHN0YXRpYyBuZ0FjY2VwdElucHV0VHlwZV9wYWRkaW5nOiBCb29sZWFuSW5wdXQ7XHJcbiAgLyoqXHJcbiAgICogU2V0cyB0aGUgY29sb3IgY29udGV4dCBvZiB0aGUgY29tcG9uZW50IHRvIG9uZSBvZiBDb3JlVUnigJlzIHRoZW1lZCBjb2xvcnMuXHJcbiAgICogQHR5cGUgQ29sb3JzXHJcbiAgICovXHJcbiAgQElucHV0KCkgY29sb3I/OiBDb2xvcnM7XHJcbiAgLyoqXHJcbiAgICogU2V0cyB0aGUgdGV4dC1jb2xvciBjb250ZXh0IG9mIHRoZSBjb21wb25lbnQgdG8gb25lIG9mIENvcmVVSeKAmXMgdGhlbWVkIGNvbG9ycy5cclxuICAgKiBAdHlwZSBDb2xvcnNcclxuICAgKi9cclxuICBASW5wdXQoKSB0ZXh0Q29sb3I/OiBDb2xvcnMgfCAnd2hpdGUnIHwgJ211dGVkJztcclxuICAvKipcclxuICAgKiBGb290ZXIgZm9yIHlvdXIgd2lkZ2V0XHJcbiAgICogQHR5cGUgc3RyaW5nXHJcbiAgICovXHJcbiAgQElucHV0KCkgZm9vdGVyPzogc3RyaW5nO1xyXG4gIC8qKlxyXG4gICAqIEljb24gZm9yIHlvdXIgd2lkZ2V0XHJcbiAgICogQHR5cGUgc3RyaW5nXHJcbiAgICovXHJcbiAgQElucHV0KCkgaWNvbj86IHN0cmluZztcclxuXHJcbiAgLyoqXHJcbiAgICogU2V0IHBhZGRpbmcgb2YgeW91ciBjb21wb25lbnQuXHJcbiAgICogQHR5cGUgYm9vbGVhblxyXG4gICAqL1xyXG4gIEBJbnB1dCgpXHJcbiAgZ2V0IHBhZGRpbmcoKTogYm9vbGVhbiB7XHJcbiAgICByZXR1cm4gdGhpcy5fcGFkZGluZztcclxuICB9XHJcbiAgc2V0IHBhZGRpbmcodmFsdWU6IGJvb2xlYW4pIHtcclxuICAgIHRoaXMuX3BhZGRpbmcgPSBjb2VyY2VCb29sZWFuUHJvcGVydHkodmFsdWUpO1xyXG4gIH1cclxuICBwcml2YXRlIF9wYWRkaW5nID0gZmFsc2U7XHJcblxyXG4gIC8qKlxyXG4gICAqIFRpdGxlIG9mIHRoZSB3aWRnZXQgdG8gZGlzcGxheVxyXG4gICAqIEB0eXBlIHN0cmluZ1xyXG4gICAqL1xyXG4gIEBJbnB1dCgpIHRpdGxlPzogc3RyaW5nO1xyXG4gIC8qKlxyXG4gICAqIFZhbHVlIGZvciB5b3VyIHdpZGdldCB0byBkaXNwbGF5XHJcbiAgICogQHR5cGUgc3RyaW5nXHJcbiAgICovXHJcbiAgQElucHV0KCkgdmFsdWU/OiBzdHJpbmcgfCBudW1iZXI7XHJcblxyXG4gIHRlbXBsYXRlczogYW55ID0ge307XHJcbiAgQENvbnRlbnRDaGlsZHJlbihUZW1wbGF0ZUlkRGlyZWN0aXZlLCB7ZGVzY2VuZGFudHM6IHRydWV9KSBjb250ZW50VGVtcGxhdGVzITogUXVlcnlMaXN0PFRlbXBsYXRlSWREaXJlY3RpdmU+O1xyXG5cclxuICBASG9zdEJpbmRpbmcoJ2NsYXNzJylcclxuICBnZXQgaG9zdENsYXNzZXMoKSB7XHJcbiAgICByZXR1cm4ge1xyXG4gICAgICBjYXJkOiB0cnVlXHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBnZXQgY2FyZEJvZHlDbGFzc2VzKCkge1xyXG4gICAgcmV0dXJuIHtcclxuICAgICAgJ2QtZmxleCc6IHRydWUsXHJcbiAgICAgICdhbGlnbi1pdGVtcy1jZW50ZXInOiB0cnVlLFxyXG4gICAgICAncC0wJzogIXRoaXMucGFkZGluZyxcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGdldCBpY29uQ2xhc3NlcygpIHtcclxuICAgIHJldHVybiB7XHJcbiAgICAgICdtZS0zJzogIXRoaXMudGV4dENvbG9yLFxyXG4gICAgICAndGV4dC13aGl0ZSc6IHRydWUsXHJcbiAgICAgIFtgYmctJHt0aGlzLmNvbG9yfWBdOiAhIXRoaXMuY29sb3IsXHJcbiAgICAgICdwLTMnOiB0aGlzLnBhZGRpbmcsXHJcbiAgICAgICdwLTQnOiAhdGhpcy5wYWRkaW5nLFxyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgZ2V0IHRpdGxlQ2xhc3NlcygpIHtcclxuICAgIHJldHVybiB7XHJcbiAgICAgICd0ZXh0LW1lZGl1bS1lbXBoYXNpcyc6ICF0aGlzLnRleHRDb2xvcixcclxuICAgICAgJ3NtYWxsJzogdHJ1ZSxcclxuICAgICAgJ3RleHQtdXBwZXJjYXNlJzogdHJ1ZSxcclxuICAgICAgJ2Z3LXNlbWlib2xkJzogdHJ1ZSxcclxuICAgICAgW2B0ZXh0LSR7dGhpcy50ZXh0Q29sb3J9YF06ICEhdGhpcy50ZXh0Q29sb3IsXHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBnZXQgdmFsdWVDbGFzc2VzKCkge1xyXG4gICAgcmV0dXJuIHtcclxuICAgICAgJ2ZzLTYnOiAhdGhpcy50ZXh0Q29sb3IsXHJcbiAgICAgICdmdy1zZW1pYm9sZCc6IHRydWUsXHJcbiAgICAgIFtgdGV4dC0ke3RoaXMudGV4dENvbG9yfWBdOiAhIXRoaXMudGV4dENvbG9yLFxyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgbmdBZnRlckNvbnRlbnRJbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5jb250ZW50VGVtcGxhdGVzLmZvckVhY2goKGNoaWxkOiBUZW1wbGF0ZUlkRGlyZWN0aXZlKSA9PiB7XHJcbiAgICAgIHRoaXMudGVtcGxhdGVzW2NoaWxkLmlkXSA9IGNoaWxkLnRlbXBsYXRlUmVmO1xyXG4gICAgfSk7XHJcbiAgfVxyXG59XHJcbiIsIjxuZy1jb250YWluZXI+XG4gIDxjLWNhcmQtYm9keSBbbmdDbGFzc109XCJjYXJkQm9keUNsYXNzZXNcIj5cbiAgICA8ZGl2IFtuZ0NsYXNzXT1cImljb25DbGFzc2VzXCI+XG4gICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwidGVtcGxhdGVzPy53aWRnZXRJY29uVGVtcGxhdGUgfHwgZGVmYXVsdFdpZGdldEljb25UZW1wbGF0ZVwiPjwvbmctY29udGFpbmVyPlxuICAgIDwvZGl2PlxuICAgIDxkaXY+XG4gICAgICA8ZGl2IFtuZ0NsYXNzXT1cInZhbHVlQ2xhc3Nlc1wiPnt7dmFsdWV9fTwvZGl2PlxuICAgICAgPGRpdiBbbmdDbGFzc109XCJ0aXRsZUNsYXNzZXNcIj57e3RpdGxlfX08L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9jLWNhcmQtYm9keT5cbiAgPGMtY2FyZC1mb290ZXIgKm5nSWY9XCJmb290ZXIgfHwgdGVtcGxhdGVzPy53aWRnZXRGb290ZXJUZW1wbGF0ZVwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nVGVtcGxhdGVPdXRsZXQ9XCJ0ZW1wbGF0ZXM/LndpZGdldEZvb3RlclRlbXBsYXRlIHx8IGRlZmF1bHRGb290ZXJJY29uVGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cbiAgPC9jLWNhcmQtZm9vdGVyPlxuPC9uZy1jb250YWluZXI+XG5cbjxuZy10ZW1wbGF0ZSAjZGVmYXVsdFdpZGdldEljb25UZW1wbGF0ZT5cbiAgPHNwYW4+e3tpY29ufX08L3NwYW4+XG48L25nLXRlbXBsYXRlPlxuXG48bmctdGVtcGxhdGUgI2RlZmF1bHRGb290ZXJJY29uVGVtcGxhdGU+XG4gIDxzcGFuPnt7Zm9vdGVyfX08L3NwYW4+XG48L25nLXRlbXBsYXRlPlxuIl19