cfc-ds
Version:
Design System do Conselho Federal de Contabilidade baseado no govbr-ds
77 lines • 13.1 kB
JavaScript
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable @angular-eslint/no-output-on-prefix */
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { InputState } from '../../enums/input-state.enum';
import { InputDensity } from '../../enums/input-density.enum';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "@angular/flex-layout/extended";
export class InputComponent {
value;
disabled = false;
buttonAriaLabel = '';
formControlName = null;
isPassword = false;
isHighlight = false;
inverted = false;
labelInline = false;
state = InputState.default;
density = InputDensity.medium;
buttonIcon;
label;
type;
placeholder;
icon;
onChange = new EventEmitter();
onInput = new EventEmitter();
onIconClicked = new EventEmitter();
onIconSubmited = new EventEmitter();
inputDensities = InputDensity;
inputStates = InputState;
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: InputComponent, selector: "cfc-input", inputs: { value: "value", disabled: "disabled", buttonAriaLabel: "buttonAriaLabel", formControlName: "formControlName", isPassword: "isPassword", isHighlight: "isHighlight", inverted: "inverted", labelInline: "labelInline", state: "state", density: "density", buttonIcon: "buttonIcon", label: "label", type: "type", placeholder: "placeholder", icon: "icon" }, outputs: { onChange: "onChange", onInput: "onInput", onIconClicked: "onIconClicked", onIconSubmited: "onIconSubmited" }, ngImport: i0, template: "<div\r\n class=\"br-input\"\r\n [class.input-inline]=\"labelInline\"\r\n [class.input-button]=\"labelInline\"\r\n [ngClass]=\"state\">\r\n <div\r\n *ngIf=\"label\"\r\n class=\"input-label\">\r\n <label\r\n class=\"text-nowrap\"\r\n [for]=\"'input-'+(icon ? icon + '-' : '')+density\">\r\n {{ label }}\r\n </label>\r\n </div>\r\n <div\r\n class=\"input-content\">\r\n <div\r\n class=\"input-group\">\r\n <div\r\n *ngIf=\"icon\"\r\n class=\"input-icon\">\r\n <i\r\n [class]=\"'fas fa-' + icon\"\r\n aria-hidden=\"true\">\r\n </i>\r\n </div>\r\n\r\n <input\r\n [id]=\"'input-icon'+(density !== inputDensities.medium ? '-' + density : '')\"\r\n [type]=\"isPassword ? 'password' : type\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"formControlName\"\r\n [value]=\"value ? value : ''\"\r\n (ngModelChange)=\"onChange.emit()\" />\r\n\r\n <button\r\n *ngIf=\"buttonIcon\"\r\n class=\"br-button\"\r\n type=\"button\"\r\n [ariaLabel]=\"buttonAriaLabel\">\r\n <i\r\n [class]=\"'fa fa-' + buttonIcon\"\r\n aria-hidden=\"true\">\r\n </i>\r\n </button>\r\n </div>\r\n </div>\r\n</div>\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.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.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: InputComponent, decorators: [{
type: Component,
args: [{ selector: 'cfc-input', template: "<div\r\n class=\"br-input\"\r\n [class.input-inline]=\"labelInline\"\r\n [class.input-button]=\"labelInline\"\r\n [ngClass]=\"state\">\r\n <div\r\n *ngIf=\"label\"\r\n class=\"input-label\">\r\n <label\r\n class=\"text-nowrap\"\r\n [for]=\"'input-'+(icon ? icon + '-' : '')+density\">\r\n {{ label }}\r\n </label>\r\n </div>\r\n <div\r\n class=\"input-content\">\r\n <div\r\n class=\"input-group\">\r\n <div\r\n *ngIf=\"icon\"\r\n class=\"input-icon\">\r\n <i\r\n [class]=\"'fas fa-' + icon\"\r\n aria-hidden=\"true\">\r\n </i>\r\n </div>\r\n\r\n <input\r\n [id]=\"'input-icon'+(density !== inputDensities.medium ? '-' + density : '')\"\r\n [type]=\"isPassword ? 'password' : type\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [formControlName]=\"formControlName\"\r\n [value]=\"value ? value : ''\"\r\n (ngModelChange)=\"onChange.emit()\" />\r\n\r\n <button\r\n *ngIf=\"buttonIcon\"\r\n class=\"br-button\"\r\n type=\"button\"\r\n [ariaLabel]=\"buttonAriaLabel\">\r\n <i\r\n [class]=\"'fa fa-' + buttonIcon\"\r\n aria-hidden=\"true\">\r\n </i>\r\n </button>\r\n </div>\r\n </div>\r\n</div>\r\n" }]
}], propDecorators: { value: [{
type: Input
}], disabled: [{
type: Input
}], buttonAriaLabel: [{
type: Input
}], formControlName: [{
type: Input
}], isPassword: [{
type: Input
}], isHighlight: [{
type: Input
}], inverted: [{
type: Input
}], labelInline: [{
type: Input
}], state: [{
type: Input
}], density: [{
type: Input
}], buttonIcon: [{
type: Input
}], label: [{
type: Input
}], type: [{
type: Input
}], placeholder: [{
type: Input
}], icon: [{
type: Input
}], onChange: [{
type: Output
}], onInput: [{
type: Output
}], onIconClicked: [{
type: Output
}], onIconSubmited: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2ZjLWRzL3NyYy9saWIvY29tcG9uZW50cy9pbnB1dC9pbnB1dC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL2lucHV0L2lucHV0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLHVEQUF1RDtBQUN2RCx3REFBd0Q7QUFDeEQsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2RSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFDMUQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGdDQUFnQyxDQUFDOzs7OztBQVE5RCxNQUFNLE9BQU8sY0FBYztJQUNoQixLQUFLLENBQU07SUFDWCxRQUFRLEdBQUcsS0FBSyxDQUFDO0lBQ2pCLGVBQWUsR0FBRyxFQUFFLENBQUM7SUFDckIsZUFBZSxHQUEyQixJQUFJLENBQUM7SUFDL0MsVUFBVSxHQUFHLEtBQUssQ0FBQztJQUNuQixXQUFXLEdBQUcsS0FBSyxDQUFDO0lBQ3BCLFFBQVEsR0FBRyxLQUFLLENBQUM7SUFDakIsV0FBVyxHQUFHLEtBQUssQ0FBQztJQUNwQixLQUFLLEdBQWUsVUFBVSxDQUFDLE9BQU8sQ0FBQztJQUN2QyxPQUFPLEdBQWlCLFlBQVksQ0FBQyxNQUFNLENBQUM7SUFDNUMsVUFBVSxDQUFVO0lBQ3BCLEtBQUssQ0FBVTtJQUNmLElBQUksQ0FBVTtJQUNkLFdBQVcsQ0FBVTtJQUNyQixJQUFJLENBQVU7SUFFYixRQUFRLEdBQWtDLElBQUksWUFBWSxFQUFtQixDQUFDO0lBQzlFLE9BQU8sR0FBa0MsSUFBSSxZQUFZLEVBQW1CLENBQUM7SUFDN0UsYUFBYSxHQUFzQixJQUFJLFlBQVksRUFBTyxDQUFDO0lBQzNELGNBQWMsR0FBc0IsSUFBSSxZQUFZLEVBQU8sQ0FBQztJQUU3RCxjQUFjLEdBQUcsWUFBWSxDQUFDO0lBQzlCLFdBQVcsR0FBRyxVQUFVLENBQUM7d0dBdkJ2QixjQUFjOzRGQUFkLGNBQWMsa2hCQ1ozQixtMENBaURBOzs0RkRyQ2EsY0FBYztrQkFMMUIsU0FBUzsrQkFDRSxXQUFXOzhCQUtaLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLGVBQWU7c0JBQXZCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFDRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUVJLFFBQVE7c0JBQWpCLE1BQU07Z0JBQ0csT0FBTztzQkFBaEIsTUFBTTtnQkFDRyxhQUFhO3NCQUF0QixNQUFNO2dCQUNHLGNBQWM7c0JBQXZCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQtZGlzYWJsZSBAdHlwZXNjcmlwdC1lc2xpbnQvbm8tZXhwbGljaXQtYW55ICovXHJcbi8qIGVzbGludC1kaXNhYmxlIEBhbmd1bGFyLWVzbGludC9uby1vdXRwdXQtb24tcHJlZml4ICovXHJcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IElucHV0U3RhdGUgfSBmcm9tICcuLi8uLi9lbnVtcy9pbnB1dC1zdGF0ZS5lbnVtJztcclxuaW1wb3J0IHsgSW5wdXREZW5zaXR5IH0gZnJvbSAnLi4vLi4vZW51bXMvaW5wdXQtZGVuc2l0eS5lbnVtJztcclxuaW1wb3J0IHsgRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2NmYy1pbnB1dCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2lucHV0LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybDogJy4vaW5wdXQuY29tcG9uZW50LnNjc3MnXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBJbnB1dENvbXBvbmVudCB7XHJcbiAgQElucHV0KCkgdmFsdWU6IGFueTtcclxuICBASW5wdXQoKSBkaXNhYmxlZCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGJ1dHRvbkFyaWFMYWJlbCA9ICcnO1xyXG4gIEBJbnB1dCgpIGZvcm1Db250cm9sTmFtZTogc3RyaW5nIHwgbnVtYmVyIHwgbnVsbCA9IG51bGw7XHJcbiAgQElucHV0KCkgaXNQYXNzd29yZCA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGlzSGlnaGxpZ2h0ID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaW52ZXJ0ZWQgPSBmYWxzZTtcclxuICBASW5wdXQoKSBsYWJlbElubGluZSA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIHN0YXRlOiBJbnB1dFN0YXRlID0gSW5wdXRTdGF0ZS5kZWZhdWx0O1xyXG4gIEBJbnB1dCgpIGRlbnNpdHk6IElucHV0RGVuc2l0eSA9IElucHV0RGVuc2l0eS5tZWRpdW07XHJcbiAgQElucHV0KCkgYnV0dG9uSWNvbj86IHN0cmluZztcclxuICBASW5wdXQoKSBsYWJlbD86IHN0cmluZztcclxuICBASW5wdXQoKSB0eXBlPzogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIHBsYWNlaG9sZGVyPzogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGljb24/OiBzdHJpbmc7XHJcblxyXG4gIEBPdXRwdXQoKSBvbkNoYW5nZTogRXZlbnRFbWl0dGVyPHN0cmluZyB8IG51bWJlcj4gPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZyB8IG51bWJlcj4oKTtcclxuICBAT3V0cHV0KCkgb25JbnB1dDogRXZlbnRFbWl0dGVyPHN0cmluZyB8IG51bWJlcj4gPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZyB8IG51bWJlcj4oKTtcclxuICBAT3V0cHV0KCkgb25JY29uQ2xpY2tlZDogRXZlbnRFbWl0dGVyPGFueT4gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuICBAT3V0cHV0KCkgb25JY29uU3VibWl0ZWQ6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XHJcblxyXG4gIHJlYWRvbmx5IGlucHV0RGVuc2l0aWVzID0gSW5wdXREZW5zaXR5O1xyXG4gIHJlYWRvbmx5IGlucHV0U3RhdGVzID0gSW5wdXRTdGF0ZTtcclxufVxyXG4iLCI8ZGl2XHJcbiAgY2xhc3M9XCJici1pbnB1dFwiXHJcbiAgW2NsYXNzLmlucHV0LWlubGluZV09XCJsYWJlbElubGluZVwiXHJcbiAgW2NsYXNzLmlucHV0LWJ1dHRvbl09XCJsYWJlbElubGluZVwiXHJcbiAgW25nQ2xhc3NdPVwic3RhdGVcIj5cclxuICA8ZGl2XHJcbiAgICAqbmdJZj1cImxhYmVsXCJcclxuICAgIGNsYXNzPVwiaW5wdXQtbGFiZWxcIj5cclxuICAgIDxsYWJlbFxyXG4gICAgICBjbGFzcz1cInRleHQtbm93cmFwXCJcclxuICAgICAgW2Zvcl09XCInaW5wdXQtJysoaWNvbiA/IGljb24gKyAnLScgOiAnJykrZGVuc2l0eVwiPlxyXG4gICAgICB7eyBsYWJlbCB9fVxyXG4gICAgPC9sYWJlbD5cclxuICA8L2Rpdj5cclxuICA8ZGl2XHJcbiAgICBjbGFzcz1cImlucHV0LWNvbnRlbnRcIj5cclxuICAgIDxkaXZcclxuICAgICAgY2xhc3M9XCJpbnB1dC1ncm91cFwiPlxyXG4gICAgICA8ZGl2XHJcbiAgICAgICAgKm5nSWY9XCJpY29uXCJcclxuICAgICAgICBjbGFzcz1cImlucHV0LWljb25cIj5cclxuICAgICAgICA8aVxyXG4gICAgICAgICAgW2NsYXNzXT1cIidmYXMgZmEtJyArIGljb25cIlxyXG4gICAgICAgICAgYXJpYS1oaWRkZW49XCJ0cnVlXCI+XHJcbiAgICAgICAgPC9pPlxyXG4gICAgICA8L2Rpdj5cclxuXHJcbiAgICAgIDxpbnB1dFxyXG4gICAgICAgIFtpZF09XCInaW5wdXQtaWNvbicrKGRlbnNpdHkgIT09IGlucHV0RGVuc2l0aWVzLm1lZGl1bSA/ICctJyArIGRlbnNpdHkgOiAnJylcIlxyXG4gICAgICAgIFt0eXBlXT1cImlzUGFzc3dvcmQgPyAncGFzc3dvcmQnIDogdHlwZVwiXHJcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cInBsYWNlaG9sZGVyXCJcclxuICAgICAgICBbZGlzYWJsZWRdPVwiZGlzYWJsZWRcIlxyXG4gICAgICAgIFtmb3JtQ29udHJvbE5hbWVdPVwiZm9ybUNvbnRyb2xOYW1lXCJcclxuICAgICAgICBbdmFsdWVdPVwidmFsdWUgPyB2YWx1ZSA6ICcnXCJcclxuICAgICAgICAobmdNb2RlbENoYW5nZSk9XCJvbkNoYW5nZS5lbWl0KClcIiAvPlxyXG5cclxuICAgICAgPGJ1dHRvblxyXG4gICAgICAgICpuZ0lmPVwiYnV0dG9uSWNvblwiXHJcbiAgICAgICAgY2xhc3M9XCJici1idXR0b25cIlxyXG4gICAgICAgIHR5cGU9XCJidXR0b25cIlxyXG4gICAgICAgIFthcmlhTGFiZWxdPVwiYnV0dG9uQXJpYUxhYmVsXCI+XHJcbiAgICAgICAgPGlcclxuICAgICAgICAgIFtjbGFzc109XCInZmEgZmEtJyArIGJ1dHRvbkljb25cIlxyXG4gICAgICAgICAgYXJpYS1oaWRkZW49XCJ0cnVlXCI+XHJcbiAgICAgICAgPC9pPlxyXG4gICAgICA8L2J1dHRvbj5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj5cclxuIl19