@coreui/angular
Version:
CoreUI Components Library for Angular
36 lines • 7.32 kB
JavaScript
import { Component, computed, input } from '@angular/core';
import { CardBodyComponent, CardComponent, CardHeaderComponent } from '../../card';
import { ColComponent, RowDirective } from '../../grid';
import { NgClass } from '@angular/common';
import * as i0 from "@angular/core";
export class WidgetStatDComponent extends CardComponent {
constructor() {
super(...arguments);
/**
* Sets the color context of the component to one of CoreUI’s themed colors.
* @type Colors
*/
// override readonly color = input<Colors>();
/**
* Values and subtitles for your component.
* @type WidgetStatDValue
*/
this.values = input();
this.headerClasses = computed(() => {
return {
'position-relative': true,
'd-flex': true,
'justify-content-center': true,
'align-items-center': true,
[`bg-${this.color()}`]: this.color()
};
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: WidgetStatDComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.12", type: WidgetStatDComponent, isStandalone: true, selector: "c-widget-stat-d", inputs: { values: { classPropertyName: "values", publicName: "values", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "card" }, exportAs: ["cWidgetStatD"], usesInheritance: true, ngImport: i0, template: "<c-card-header [ngClass]=\"headerClasses()\">\n <ng-content />\n</c-card-header>\n<c-card-body cRow class=\"text-center\">\n @for (item of values(); track item; let i = $index) {\n @if (i % 2 !== 0) {\n <div class=\"vr\"></div>\n }\n <c-col>\n <div class=\"fs-5 fw-semibold\">{{ item.value }}</div>\n <div class=\"text-uppercase text-body-secondary small\">{{ item.title }}</div>\n </c-col>\n }\n</c-card-body>\n", dependencies: [{ kind: "component", type: CardHeaderComponent, selector: "c-card-header, [c-card-header]" }, { kind: "component", type: CardBodyComponent, selector: "c-card-body, [c-card-body]" }, { kind: "component", type: ColComponent, selector: "c-col" }, { kind: "directive", type: RowDirective, selector: "[cRow]", inputs: ["xs", "sm", "md", "lg", "xl", "xxl"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: WidgetStatDComponent, decorators: [{
type: Component,
args: [{ selector: 'c-widget-stat-d', exportAs: 'cWidgetStatD', standalone: true, imports: [CardHeaderComponent, CardBodyComponent, ColComponent, RowDirective, NgClass], host: { class: 'card' }, template: "<c-card-header [ngClass]=\"headerClasses()\">\n <ng-content />\n</c-card-header>\n<c-card-body cRow class=\"text-center\">\n @for (item of values(); track item; let i = $index) {\n @if (i % 2 !== 0) {\n <div class=\"vr\"></div>\n }\n <c-col>\n <div class=\"fs-5 fw-semibold\">{{ item.value }}</div>\n <div class=\"text-uppercase text-body-secondary small\">{{ item.title }}</div>\n </c-col>\n }\n</c-card-body>\n" }]
}] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0LXN0YXQtZC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JldWktYW5ndWxhci9zcmMvbGliL3dpZGdldC93aWRnZXQtc3RhdC1kL3dpZGdldC1zdGF0LWQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29yZXVpLWFuZ3VsYXIvc3JjL2xpYi93aWRnZXQvd2lkZ2V0LXN0YXQtZC93aWRnZXQtc3RhdC1kLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUUzRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsYUFBYSxFQUFFLG1CQUFtQixFQUFFLE1BQU0sWUFBWSxDQUFDO0FBQ25GLE9BQU8sRUFBRSxZQUFZLEVBQUUsWUFBWSxFQUFFLE1BQU0sWUFBWSxDQUFDO0FBQ3hELE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQzs7QUFlMUMsTUFBTSxPQUFPLG9CQUFxQixTQUFRLGFBQWE7SUFSdkQ7O1FBU0U7OztXQUdHO1FBQ0gsNkNBQTZDO1FBRTdDOzs7V0FHRztRQUNNLFdBQU0sR0FBRyxLQUFLLEVBQXNCLENBQUM7UUFFckMsa0JBQWEsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFO1lBQ3JDLE9BQU87Z0JBQ0wsbUJBQW1CLEVBQUUsSUFBSTtnQkFDekIsUUFBUSxFQUFFLElBQUk7Z0JBQ2Qsd0JBQXdCLEVBQUUsSUFBSTtnQkFDOUIsb0JBQW9CLEVBQUUsSUFBSTtnQkFDMUIsQ0FBQyxNQUFNLElBQUksQ0FBQyxLQUFLLEVBQUUsRUFBRSxDQUFDLEVBQUUsSUFBSSxDQUFDLEtBQUssRUFBRTthQUNWLENBQUM7UUFDL0IsQ0FBQyxDQUFDLENBQUM7S0FDSjsrR0F0Qlksb0JBQW9CO21HQUFwQixvQkFBb0IsdVNDbkJqQyw0YkFjQSw0Q0RFWSxtQkFBbUIsMkVBQUUsaUJBQWlCLHVFQUFFLFlBQVksa0RBQUUsWUFBWSxrR0FBRSxPQUFPOzs0RkFHMUUsb0JBQW9CO2tCQVJoQyxTQUFTOytCQUNFLGlCQUFpQixZQUVqQixjQUFjLGNBQ1osSUFBSSxXQUNQLENBQUMsbUJBQW1CLEVBQUUsaUJBQWlCLEVBQUUsWUFBWSxFQUFFLFlBQVksRUFBRSxPQUFPLENBQUMsUUFDaEYsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbG9ycyB9IGZyb20gJy4uLy4uL2NvcmV1aS50eXBlcyc7XG5pbXBvcnQgeyBDYXJkQm9keUNvbXBvbmVudCwgQ2FyZENvbXBvbmVudCwgQ2FyZEhlYWRlckNvbXBvbmVudCB9IGZyb20gJy4uLy4uL2NhcmQnO1xuaW1wb3J0IHsgQ29sQ29tcG9uZW50LCBSb3dEaXJlY3RpdmUgfSBmcm9tICcuLi8uLi9ncmlkJztcbmltcG9ydCB7IE5nQ2xhc3MgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5leHBvcnQgdHlwZSBXaWRnZXRTdGF0RFZhbHVlID0ge1xuICB0aXRsZT86IHN0cmluZztcbiAgdmFsdWU/OiBudW1iZXIgfCBzdHJpbmc7XG59O1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjLXdpZGdldC1zdGF0LWQnLFxuICB0ZW1wbGF0ZVVybDogJy4vd2lkZ2V0LXN0YXQtZC5jb21wb25lbnQuaHRtbCcsXG4gIGV4cG9ydEFzOiAnY1dpZGdldFN0YXREJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NhcmRIZWFkZXJDb21wb25lbnQsIENhcmRCb2R5Q29tcG9uZW50LCBDb2xDb21wb25lbnQsIFJvd0RpcmVjdGl2ZSwgTmdDbGFzc10sXG4gIGhvc3Q6IHsgY2xhc3M6ICdjYXJkJyB9XG59KVxuZXhwb3J0IGNsYXNzIFdpZGdldFN0YXREQ29tcG9uZW50IGV4dGVuZHMgQ2FyZENvbXBvbmVudCB7XG4gIC8qKlxuICAgKiBTZXRzIHRoZSBjb2xvciBjb250ZXh0IG9mIHRoZSBjb21wb25lbnQgdG8gb25lIG9mIENvcmVVSeKAmXMgdGhlbWVkIGNvbG9ycy5cbiAgICogQHR5cGUgQ29sb3JzXG4gICAqL1xuICAvLyBvdmVycmlkZSByZWFkb25seSBjb2xvciA9IGlucHV0PENvbG9ycz4oKTtcblxuICAvKipcbiAgICogVmFsdWVzIGFuZCBzdWJ0aXRsZXMgZm9yIHlvdXIgY29tcG9uZW50LlxuICAgKiBAdHlwZSBXaWRnZXRTdGF0RFZhbHVlXG4gICAqL1xuICByZWFkb25seSB2YWx1ZXMgPSBpbnB1dDxXaWRnZXRTdGF0RFZhbHVlW10+KCk7XG5cbiAgcmVhZG9ubHkgaGVhZGVyQ2xhc3NlcyA9IGNvbXB1dGVkKCgpID0+IHtcbiAgICByZXR1cm4ge1xuICAgICAgJ3Bvc2l0aW9uLXJlbGF0aXZlJzogdHJ1ZSxcbiAgICAgICdkLWZsZXgnOiB0cnVlLFxuICAgICAgJ2p1c3RpZnktY29udGVudC1jZW50ZXInOiB0cnVlLFxuICAgICAgJ2FsaWduLWl0ZW1zLWNlbnRlcic6IHRydWUsXG4gICAgICBbYGJnLSR7dGhpcy5jb2xvcigpfWBdOiB0aGlzLmNvbG9yKClcbiAgICB9IGFzIFJlY29yZDxzdHJpbmcsIGJvb2xlYW4+O1xuICB9KTtcbn1cbiIsIjxjLWNhcmQtaGVhZGVyIFtuZ0NsYXNzXT1cImhlYWRlckNsYXNzZXMoKVwiPlxuICA8bmctY29udGVudCAvPlxuPC9jLWNhcmQtaGVhZGVyPlxuPGMtY2FyZC1ib2R5IGNSb3cgY2xhc3M9XCJ0ZXh0LWNlbnRlclwiPlxuICBAZm9yIChpdGVtIG9mIHZhbHVlcygpOyB0cmFjayBpdGVtOyBsZXQgaSA9ICRpbmRleCkge1xuICAgIEBpZiAoaSAlIDIgIT09IDApIHtcbiAgICAgIDxkaXYgY2xhc3M9XCJ2clwiPjwvZGl2PlxuICAgIH1cbiAgICA8Yy1jb2w+XG4gICAgICA8ZGl2IGNsYXNzPVwiZnMtNSBmdy1zZW1pYm9sZFwiPnt7IGl0ZW0udmFsdWUgfX08L2Rpdj5cbiAgICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LXVwcGVyY2FzZSB0ZXh0LWJvZHktc2Vjb25kYXJ5IHNtYWxsXCI+e3sgaXRlbS50aXRsZSB9fTwvZGl2PlxuICAgIDwvYy1jb2w+XG4gIH1cbjwvYy1jYXJkLWJvZHk+XG4iXX0=