@coreui/angular
Version:
CoreUI Components Library for Angular
57 lines • 8.88 kB
JavaScript
import { booleanAttribute, Component, computed, input } from '@angular/core';
import { NgClass } from '@angular/common';
import { CardBodyComponent, CardComponent } from '../../card';
import * as i0 from "@angular/core";
export class WidgetStatBComponent extends CardComponent {
constructor() {
super();
/**
* Sets the color context of the component to one of CoreUI themed colors.
* @type Colors
*/
// override readonly color: InputSignal<Colors | undefined> = input();
/**
* Sets the text-color context of the component to one of CoreUI themed colors.
* via TextColorDirective
* @type TextColors
*/
// override readonly textColor: InputSignal<TextColors | undefined> = input();
/**
* Title of the widget to display
* @type string
*/
this.title = input();
/**
* Helper text for your widget.
* @type string
*/
this.text = input();
/**
* Value for your widget to display
* @type string
*/
this.value = input();
/**
* Invert colors from their default dark shade.
* @type boolean
*/
this.inverse = input(false, { transform: booleanAttribute });
this.hostClasses = computed(() => {
const color = this.color();
const textColor = this.textColor();
return {
card: true,
[`bg-${color}`]: !!color,
[`text-${textColor}`]: !!textColor,
'text-white': this.inverse()
};
});
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: WidgetStatBComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.12", type: WidgetStatBComponent, isStandalone: true, selector: "c-widget-stat-b", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, inverse: { classPropertyName: "inverse", publicName: "inverse", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "hostClasses()" }, classAttribute: "card" }, exportAs: ["cWidgetStatB"], usesInheritance: true, ngImport: i0, template: "<c-card-body>\n @if (!!value()) {\n <div class=\"fs-4 fw-semibold\">{{ value() }}</div>\n }\n @if (!!title()) {\n <div>{{ title() }}</div>\n }\n <ng-content />\n @if (text()) {\n <small [ngClass]=\"inverse() ? 'text-white text-opacity-75' : 'text-body-secondary'\">\n {{ text() }}\n </small>\n }\n</c-card-body>\n", dependencies: [{ kind: "component", type: CardBodyComponent, selector: "c-card-body, [c-card-body]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: WidgetStatBComponent, decorators: [{
type: Component,
args: [{ selector: 'c-widget-stat-b', exportAs: 'cWidgetStatB', standalone: true, imports: [CardBodyComponent, NgClass], host: { class: 'card', '[class]': 'hostClasses()' }, template: "<c-card-body>\n @if (!!value()) {\n <div class=\"fs-4 fw-semibold\">{{ value() }}</div>\n }\n @if (!!title()) {\n <div>{{ title() }}</div>\n }\n <ng-content />\n @if (text()) {\n <small [ngClass]=\"inverse() ? 'text-white text-opacity-75' : 'text-body-secondary'\">\n {{ text() }}\n </small>\n }\n</c-card-body>\n" }]
}], ctorParameters: () => [] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2lkZ2V0LXN0YXQtYi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jb3JldWktYW5ndWxhci9zcmMvbGliL3dpZGdldC93aWRnZXQtc3RhdC1iL3dpZGdldC1zdGF0LWIuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29yZXVpLWFuZ3VsYXIvc3JjL2xpYi93aWRnZXQvd2lkZ2V0LXN0YXQtYi93aWRnZXQtc3RhdC1iLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLEtBQUssRUFBeUMsTUFBTSxlQUFlLENBQUM7QUFDcEgsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBRTFDLE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxhQUFhLEVBQUUsTUFBTSxZQUFZLENBQUM7O0FBVTlELE1BQU0sT0FBTyxvQkFBcUIsU0FBUSxhQUFhO0lBQ3JEO1FBQ0UsS0FBSyxFQUFFLENBQUM7UUFHVjs7O1dBR0c7UUFDSCxzRUFBc0U7UUFFdEU7Ozs7V0FJRztRQUNILDhFQUE4RTtRQUU5RTs7O1dBR0c7UUFDTSxVQUFLLEdBQW9DLEtBQUssRUFBVSxDQUFDO1FBRWxFOzs7V0FHRztRQUNNLFNBQUksR0FBb0MsS0FBSyxFQUFVLENBQUM7UUFFakU7OztXQUdHO1FBQ00sVUFBSyxHQUFvQyxLQUFLLEVBQVUsQ0FBQztRQUVsRTs7O1dBR0c7UUFDTSxZQUFPLEdBQStDLEtBQUssQ0FBQyxLQUFLLEVBQUUsRUFBRSxTQUFTLEVBQUUsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDO1FBRTNGLGdCQUFXLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRTtZQUM1QyxNQUFNLEtBQUssR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDM0IsTUFBTSxTQUFTLEdBQUcsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1lBQ25DLE9BQU87Z0JBQ0wsSUFBSSxFQUFFLElBQUk7Z0JBQ1YsQ0FBQyxNQUFNLEtBQUssRUFBRSxDQUFDLEVBQUUsQ0FBQyxDQUFDLEtBQUs7Z0JBQ3hCLENBQUMsUUFBUSxTQUFTLEVBQUUsQ0FBQyxFQUFFLENBQUMsQ0FBQyxTQUFTO2dCQUNsQyxZQUFZLEVBQUUsSUFBSSxDQUFDLE9BQU8sRUFBRTthQUNGLENBQUM7UUFDL0IsQ0FBQyxDQUFDLENBQUM7SUFoREgsQ0FBQzsrR0FIVSxvQkFBb0I7bUdBQXBCLG9CQUFvQix5ckJDYmpDLG1WQWNBLDRDREpZLGlCQUFpQix1RUFBRSxPQUFPOzs0RkFHekIsb0JBQW9CO2tCQVJoQyxTQUFTOytCQUNFLGlCQUFpQixZQUVqQixjQUFjLGNBQ1osSUFBSSxXQUNQLENBQUMsaUJBQWlCLEVBQUUsT0FBTyxDQUFDLFFBQy9CLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgYm9vbGVhbkF0dHJpYnV0ZSwgQ29tcG9uZW50LCBjb21wdXRlZCwgaW5wdXQsIElucHV0U2lnbmFsLCBJbnB1dFNpZ25hbFdpdGhUcmFuc2Zvcm0gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE5nQ2xhc3MgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuXG5pbXBvcnQgeyBDYXJkQm9keUNvbXBvbmVudCwgQ2FyZENvbXBvbmVudCB9IGZyb20gJy4uLy4uL2NhcmQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjLXdpZGdldC1zdGF0LWInLFxuICB0ZW1wbGF0ZVVybDogJy4vd2lkZ2V0LXN0YXQtYi5jb21wb25lbnQuaHRtbCcsXG4gIGV4cG9ydEFzOiAnY1dpZGdldFN0YXRCJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NhcmRCb2R5Q29tcG9uZW50LCBOZ0NsYXNzXSxcbiAgaG9zdDogeyBjbGFzczogJ2NhcmQnLCAnW2NsYXNzXSc6ICdob3N0Q2xhc3NlcygpJyB9XG59KVxuZXhwb3J0IGNsYXNzIFdpZGdldFN0YXRCQ29tcG9uZW50IGV4dGVuZHMgQ2FyZENvbXBvbmVudCB7XG4gIGNvbnN0cnVjdG9yKCkge1xuICAgIHN1cGVyKCk7XG4gIH1cblxuICAvKipcbiAgICogU2V0cyB0aGUgY29sb3IgY29udGV4dCBvZiB0aGUgY29tcG9uZW50IHRvIG9uZSBvZiBDb3JlVUkgdGhlbWVkIGNvbG9ycy5cbiAgICogQHR5cGUgQ29sb3JzXG4gICAqL1xuICAvLyBvdmVycmlkZSByZWFkb25seSBjb2xvcjogSW5wdXRTaWduYWw8Q29sb3JzIHwgdW5kZWZpbmVkPiA9IGlucHV0KCk7XG5cbiAgLyoqXG4gICAqIFNldHMgdGhlIHRleHQtY29sb3IgY29udGV4dCBvZiB0aGUgY29tcG9uZW50IHRvIG9uZSBvZiBDb3JlVUkgdGhlbWVkIGNvbG9ycy5cbiAgICogdmlhIFRleHRDb2xvckRpcmVjdGl2ZVxuICAgKiBAdHlwZSBUZXh0Q29sb3JzXG4gICAqL1xuICAvLyBvdmVycmlkZSByZWFkb25seSB0ZXh0Q29sb3I6IElucHV0U2lnbmFsPFRleHRDb2xvcnMgfCB1bmRlZmluZWQ+ID0gaW5wdXQoKTtcblxuICAvKipcbiAgICogVGl0bGUgb2YgdGhlIHdpZGdldCB0byBkaXNwbGF5XG4gICAqIEB0eXBlIHN0cmluZ1xuICAgKi9cbiAgcmVhZG9ubHkgdGl0bGU6IElucHV0U2lnbmFsPHN0cmluZyB8IHVuZGVmaW5lZD4gPSBpbnB1dDxzdHJpbmc+KCk7XG5cbiAgLyoqXG4gICAqIEhlbHBlciB0ZXh0IGZvciB5b3VyIHdpZGdldC5cbiAgICogQHR5cGUgc3RyaW5nXG4gICAqL1xuICByZWFkb25seSB0ZXh0OiBJbnB1dFNpZ25hbDxzdHJpbmcgfCB1bmRlZmluZWQ+ID0gaW5wdXQ8c3RyaW5nPigpO1xuXG4gIC8qKlxuICAgKiBWYWx1ZSBmb3IgeW91ciB3aWRnZXQgdG8gZGlzcGxheVxuICAgKiBAdHlwZSBzdHJpbmdcbiAgICovXG4gIHJlYWRvbmx5IHZhbHVlOiBJbnB1dFNpZ25hbDxzdHJpbmcgfCB1bmRlZmluZWQ+ID0gaW5wdXQ8c3RyaW5nPigpO1xuXG4gIC8qKlxuICAgKiBJbnZlcnQgY29sb3JzIGZyb20gdGhlaXIgZGVmYXVsdCBkYXJrIHNoYWRlLlxuICAgKiBAdHlwZSBib29sZWFuXG4gICAqL1xuICByZWFkb25seSBpbnZlcnNlOiBJbnB1dFNpZ25hbFdpdGhUcmFuc2Zvcm08Ym9vbGVhbiwgdW5rbm93bj4gPSBpbnB1dChmYWxzZSwgeyB0cmFuc2Zvcm06IGJvb2xlYW5BdHRyaWJ1dGUgfSk7XG5cbiAgb3ZlcnJpZGUgcmVhZG9ubHkgaG9zdENsYXNzZXMgPSBjb21wdXRlZCgoKSA9PiB7XG4gICAgY29uc3QgY29sb3IgPSB0aGlzLmNvbG9yKCk7XG4gICAgY29uc3QgdGV4dENvbG9yID0gdGhpcy50ZXh0Q29sb3IoKTtcbiAgICByZXR1cm4ge1xuICAgICAgY2FyZDogdHJ1ZSxcbiAgICAgIFtgYmctJHtjb2xvcn1gXTogISFjb2xvcixcbiAgICAgIFtgdGV4dC0ke3RleHRDb2xvcn1gXTogISF0ZXh0Q29sb3IsXG4gICAgICAndGV4dC13aGl0ZSc6IHRoaXMuaW52ZXJzZSgpXG4gICAgfSBhcyBSZWNvcmQ8c3RyaW5nLCBib29sZWFuPjtcbiAgfSk7XG59XG4iLCI8Yy1jYXJkLWJvZHk+XG4gIEBpZiAoISF2YWx1ZSgpKSB7XG4gICAgPGRpdiBjbGFzcz1cImZzLTQgZnctc2VtaWJvbGRcIj57eyB2YWx1ZSgpIH19PC9kaXY+XG4gIH1cbiAgQGlmICghIXRpdGxlKCkpIHtcbiAgICA8ZGl2Pnt7IHRpdGxlKCkgfX08L2Rpdj5cbiAgfVxuICA8bmctY29udGVudCAvPlxuICBAaWYgKHRleHQoKSkge1xuICAgIDxzbWFsbCBbbmdDbGFzc109XCJpbnZlcnNlKCkgPyAndGV4dC13aGl0ZSB0ZXh0LW9wYWNpdHktNzUnIDogJ3RleHQtYm9keS1zZWNvbmRhcnknXCI+XG4gICAgICB7eyB0ZXh0KCkgfX1cbiAgICA8L3NtYWxsPlxuICB9XG48L2MtY2FyZC1ib2R5PlxuIl19