cfc-ds
Version:
Design System do Conselho Federal de Contabilidade baseado no govbr-ds
25 lines • 6.15 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/flex-layout/extended";
export class TagComponent {
label;
type = 'text';
backgroundColor = 'bg-gray-50';
density = 'medium';
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TagComponent, selector: "cfc-tag", inputs: { label: "label", type: "type", backgroundColor: "backgroundColor", density: "density" }, ngImport: i0, template: "<ng-container *ngIf=\"type === 'text'\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"br-tag\" aria-describedby=\"tag-text01\"\r\n ><i class=\"fas fa-car\" aria-hidden=\"true\"></i\r\n ><span id=\"tag-text01\">{{ label }}</span></span\r\n >\r\n </div>\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"type === 'status'\">\r\n <div class=\"d-flex align-items-center mt-1\">\r\n <span\r\n class=\"br-tag status\"\r\n [ngClass]=\"[\r\n backgroundColor,\r\n density === 'small' ? 'small' : '',\r\n density === 'medium' ? 'medium' : '',\r\n density === 'large' ? 'large' : ''\r\n ]\"\r\n aria-describedby=\"tag-status-01\"\r\n ></span\r\n ><span class=\"ml-1\" id=\"tag-status-01\">{{label}}</span\r\n >\r\n </div>\r\n</ng-container>\r\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: i2.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagComponent, decorators: [{
type: Component,
args: [{ selector: 'cfc-tag', template: "<ng-container *ngIf=\"type === 'text'\">\r\n <div class=\"d-flex align-items-center\">\r\n <span class=\"br-tag\" aria-describedby=\"tag-text01\"\r\n ><i class=\"fas fa-car\" aria-hidden=\"true\"></i\r\n ><span id=\"tag-text01\">{{ label }}</span></span\r\n >\r\n </div>\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"type === 'status'\">\r\n <div class=\"d-flex align-items-center mt-1\">\r\n <span\r\n class=\"br-tag status\"\r\n [ngClass]=\"[\r\n backgroundColor,\r\n density === 'small' ? 'small' : '',\r\n density === 'medium' ? 'medium' : '',\r\n density === 'large' ? 'large' : ''\r\n ]\"\r\n aria-describedby=\"tag-status-01\"\r\n ></span\r\n ><span class=\"ml-1\" id=\"tag-status-01\">{{label}}</span\r\n >\r\n </div>\r\n</ng-container>\r\n" }]
}], propDecorators: { label: [{
type: Input
}], type: [{
type: Input
}], backgroundColor: [{
type: Input
}], density: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFnLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NmYy1kcy9zcmMvbGliL2NvbXBvbmVudHMvdGFnL3RhZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL3RhZy90YWcuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7QUFPakQsTUFBTSxPQUFPLFlBQVk7SUFDZCxLQUFLLENBQVU7SUFDZixJQUFJLEdBQTJDLE1BQU0sQ0FBQztJQUN0RCxlQUFlLEdBQVUsWUFBWSxDQUFDO0lBQ3RDLE9BQU8sR0FBaUMsUUFBUSxDQUFDO3dHQUovQyxZQUFZOzRGQUFaLFlBQVksaUpDUHpCLGcwQkF5QkE7OzRGRGxCYSxZQUFZO2tCQUx4QixTQUFTOytCQUNFLFNBQVM7OEJBS1YsS0FBSztzQkFBYixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxlQUFlO3NCQUF2QixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnY2ZjLXRhZycsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3RhZy5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmw6ICcuL3RhZy5jb21wb25lbnQuc2NzcydcclxufSlcclxuZXhwb3J0IGNsYXNzIFRhZ0NvbXBvbmVudCB7XHJcbiAgQElucHV0KCkgbGFiZWwhOiBzdHJpbmc7XHJcbiAgQElucHV0KCkgdHlwZTogJ3RleHQnIHwgJ3N0YXR1cycgfCAnY291bnRlcicgfCAnaWNvbicgPSAndGV4dCc7XHJcbiAgQElucHV0KCkgYmFja2dyb3VuZENvbG9yOiBzdHJpbmc9ICdiZy1ncmF5LTUwJztcclxuICBASW5wdXQoKSBkZW5zaXR5OiAnc21hbGwnIHwgJ21lZGl1bScgfCAnbGFyZ2UnID0gJ21lZGl1bSc7XHJcblxyXG59XHJcbiIsIjxuZy1jb250YWluZXIgKm5nSWY9XCJ0eXBlID09PSAndGV4dCdcIj5cclxuICA8ZGl2IGNsYXNzPVwiZC1mbGV4IGFsaWduLWl0ZW1zLWNlbnRlclwiPlxyXG4gICAgPHNwYW4gY2xhc3M9XCJici10YWdcIiBhcmlhLWRlc2NyaWJlZGJ5PVwidGFnLXRleHQwMVwiXHJcbiAgICAgID48aSBjbGFzcz1cImZhcyBmYS1jYXJcIiBhcmlhLWhpZGRlbj1cInRydWVcIj48L2lcclxuICAgICAgPjxzcGFuIGlkPVwidGFnLXRleHQwMVwiPnt7IGxhYmVsIH19PC9zcGFuPjwvc3BhblxyXG4gICAgPlxyXG4gIDwvZGl2PlxyXG48L25nLWNvbnRhaW5lcj5cclxuXHJcbjxuZy1jb250YWluZXIgKm5nSWY9XCJ0eXBlID09PSAnc3RhdHVzJ1wiPlxyXG4gIDxkaXYgY2xhc3M9XCJkLWZsZXggYWxpZ24taXRlbXMtY2VudGVyIG10LTFcIj5cclxuICAgIDxzcGFuXHJcbiAgICAgIGNsYXNzPVwiYnItdGFnIHN0YXR1c1wiXHJcbiAgICAgIFtuZ0NsYXNzXT1cIltcclxuICAgICAgICBiYWNrZ3JvdW5kQ29sb3IsXHJcbiAgICAgICAgZGVuc2l0eSA9PT0gJ3NtYWxsJyA/ICdzbWFsbCcgOiAnJyxcclxuICAgICAgICBkZW5zaXR5ID09PSAnbWVkaXVtJyA/ICdtZWRpdW0nIDogJycsXHJcbiAgICAgICAgZGVuc2l0eSA9PT0gJ2xhcmdlJyA/ICdsYXJnZScgOiAnJ1xyXG4gICAgICBdXCJcclxuICAgICAgYXJpYS1kZXNjcmliZWRieT1cInRhZy1zdGF0dXMtMDFcIlxyXG4gICAgPjwvc3BhblxyXG4gICAgPjxzcGFuIGNsYXNzPVwibWwtMVwiIGlkPVwidGFnLXN0YXR1cy0wMVwiPnt7bGFiZWx9fTwvc3BhblxyXG4gICAgPlxyXG4gIDwvZGl2PlxyXG48L25nLWNvbnRhaW5lcj5cclxuIl19