cfc-ds
Version:
Design System do Conselho Federal de Contabilidade baseado no govbr-ds
49 lines • 8.44 kB
JavaScript
import { Component, EventEmitter, Input, Output } from '@angular/core';
import { CheckboxOptionState } from '../../enums/checkbox-option-state.enum';
import { CheckboxOptionType } from '../../enums/checkbox-option-type.enum';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/flex-layout/extended";
export class CheckboxOptionComponent {
type = CheckboxOptionType.withRightLabel;
state = CheckboxOptionState.default;
option;
checked = false;
checkedChange = new EventEmitter();
checkboxOptionStates = CheckboxOptionState;
checkboxOptionTypes = CheckboxOptionType;
// get layout(): string {
// switch (this.type) {
// case this.checkboxOptionTypes.withRightLabel:
// return 'column';
// case this.checkboxOptionTypes.withLeftLabel:
// return 'row-reverse';
// case this.checkboxOptionTypes.withBelowLabel:
// return 'column';
// default:
// return 'column-reverse';
// }
// }
onCheckboxChange(event) {
const target = event.target;
this.checked = target.checked;
this.checkedChange.emit(this.checked);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CheckboxOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: CheckboxOptionComponent, selector: "cfc-checkbox-option", inputs: { type: "type", state: "state", option: "option", checked: "checked" }, outputs: { checkedChange: "checkedChange" }, ngImport: i0, template: "<div\r\n class=\"br-checkbox\"\r\n [ngClass]=\"state\">\r\n <input\r\n type=\"checkbox\"\r\n [id]=\"option.name\"\r\n [name]=\"option.name\"\r\n [ariaLabel]=\"option.value\"\r\n [checked]=\"checked\"\r\n [disabled]=\"state === checkboxOptionStates.disabled\"\r\n (change)=\"onCheckboxChange($event)\"\r\n />\r\n <label\r\n *ngIf=\"type !== checkboxOptionTypes.withoutLabel\"\r\n [for]=\"option.name\">\r\n {{ option.name }}\r\n </label>\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.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: CheckboxOptionComponent, decorators: [{
type: Component,
args: [{ selector: 'cfc-checkbox-option', template: "<div\r\n class=\"br-checkbox\"\r\n [ngClass]=\"state\">\r\n <input\r\n type=\"checkbox\"\r\n [id]=\"option.name\"\r\n [name]=\"option.name\"\r\n [ariaLabel]=\"option.value\"\r\n [checked]=\"checked\"\r\n [disabled]=\"state === checkboxOptionStates.disabled\"\r\n (change)=\"onCheckboxChange($event)\"\r\n />\r\n <label\r\n *ngIf=\"type !== checkboxOptionTypes.withoutLabel\"\r\n [for]=\"option.name\">\r\n {{ option.name }}\r\n </label>\r\n</div>\r\n" }]
}], propDecorators: { type: [{
type: Input
}], state: [{
type: Input
}], option: [{
type: Input
}], checked: [{
type: Input
}], checkedChange: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3gtb3B0aW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NmYy1kcy9zcmMvbGliL2NvbXBvbmVudHMvY2hlY2tib3gtb3B0aW9uL2NoZWNrYm94LW9wdGlvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL2NoZWNrYm94LW9wdGlvbi9jaGVja2JveC1vcHRpb24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2RSxPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUU3RSxPQUFPLEVBQUUsa0JBQWtCLEVBQUUsTUFBTSx1Q0FBdUMsQ0FBQzs7OztBQU8zRSxNQUFNLE9BQU8sdUJBQXVCO0lBRXpCLElBQUksR0FBdUIsa0JBQWtCLENBQUMsY0FBYyxDQUFDO0lBQzdELEtBQUssR0FBd0IsbUJBQW1CLENBQUMsT0FBTyxDQUFDO0lBQ3pELE1BQU0sQ0FBa0I7SUFDeEIsT0FBTyxHQUFZLEtBQUssQ0FBQztJQUN4QixhQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztJQUV0RCxvQkFBb0IsR0FBK0IsbUJBQW1CLENBQUM7SUFDdkUsbUJBQW1CLEdBQThCLGtCQUFrQixDQUFDO0lBRXBFLHlCQUF5QjtJQUN6Qix5QkFBeUI7SUFDekIsb0RBQW9EO0lBQ3BELHlCQUF5QjtJQUN6QixtREFBbUQ7SUFDbkQsOEJBQThCO0lBQzlCLG9EQUFvRDtJQUNwRCx5QkFBeUI7SUFDekIsZUFBZTtJQUNmLGlDQUFpQztJQUNqQyxNQUFNO0lBQ04sSUFBSTtJQUVKLGdCQUFnQixDQUFDLEtBQVk7UUFDM0IsTUFBTSxNQUFNLEdBQUcsS0FBSyxDQUFDLE1BQTBCLENBQUM7UUFDaEQsSUFBSSxDQUFDLE9BQU8sR0FBRyxNQUFNLENBQUMsT0FBTyxDQUFDO1FBQzlCLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUN4QyxDQUFDO3dHQTVCVSx1QkFBdUI7NEZBQXZCLHVCQUF1Qix3TENWcEMsd2VBa0JBOzs0RkRSYSx1QkFBdUI7a0JBTG5DLFNBQVM7K0JBQ0UscUJBQXFCOzhCQU10QixJQUFJO3NCQUFaLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksYUFBYTtzQkFBdEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENoZWNrYm94T3B0aW9uU3RhdGUgfSBmcm9tICcuLi8uLi9lbnVtcy9jaGVja2JveC1vcHRpb24tc3RhdGUuZW51bSc7XHJcbmltcG9ydCB7IENoZWNrYm94T3B0aW9uIH0gZnJvbSAnLi4vLi4vbW9kZWxzL2NoZWNrYm94Lm1vZGVsJ1xyXG5pbXBvcnQgeyBDaGVja2JveE9wdGlvblR5cGUgfSBmcm9tICcuLi8uLi9lbnVtcy9jaGVja2JveC1vcHRpb24tdHlwZS5lbnVtJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnY2ZjLWNoZWNrYm94LW9wdGlvbicsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2NoZWNrYm94LW9wdGlvbi5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmw6ICcuL2NoZWNrYm94LW9wdGlvbi5jb21wb25lbnQuc2NzcydcclxufSlcclxuZXhwb3J0IGNsYXNzIENoZWNrYm94T3B0aW9uQ29tcG9uZW50IHtcclxuXHJcbiAgQElucHV0KCkgdHlwZTogQ2hlY2tib3hPcHRpb25UeXBlID0gQ2hlY2tib3hPcHRpb25UeXBlLndpdGhSaWdodExhYmVsO1xyXG4gIEBJbnB1dCgpIHN0YXRlOiBDaGVja2JveE9wdGlvblN0YXRlID0gQ2hlY2tib3hPcHRpb25TdGF0ZS5kZWZhdWx0O1xyXG4gIEBJbnB1dCgpIG9wdGlvbiE6IENoZWNrYm94T3B0aW9uO1xyXG4gIEBJbnB1dCgpIGNoZWNrZWQ6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBAT3V0cHV0KCkgY2hlY2tlZENoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcclxuXHJcbiAgY2hlY2tib3hPcHRpb25TdGF0ZXM6IHR5cGVvZiBDaGVja2JveE9wdGlvblN0YXRlID0gQ2hlY2tib3hPcHRpb25TdGF0ZTtcclxuICBjaGVja2JveE9wdGlvblR5cGVzOiB0eXBlb2YgQ2hlY2tib3hPcHRpb25UeXBlID0gQ2hlY2tib3hPcHRpb25UeXBlO1xyXG5cclxuICAvLyBnZXQgbGF5b3V0KCk6IHN0cmluZyB7XHJcbiAgLy8gICBzd2l0Y2ggKHRoaXMudHlwZSkge1xyXG4gIC8vICAgICBjYXNlIHRoaXMuY2hlY2tib3hPcHRpb25UeXBlcy53aXRoUmlnaHRMYWJlbDpcclxuICAvLyAgICAgICByZXR1cm4gJ2NvbHVtbic7XHJcbiAgLy8gICAgIGNhc2UgdGhpcy5jaGVja2JveE9wdGlvblR5cGVzLndpdGhMZWZ0TGFiZWw6XHJcbiAgLy8gICAgICAgcmV0dXJuICdyb3ctcmV2ZXJzZSc7XHJcbiAgLy8gICAgIGNhc2UgdGhpcy5jaGVja2JveE9wdGlvblR5cGVzLndpdGhCZWxvd0xhYmVsOlxyXG4gIC8vICAgICAgIHJldHVybiAnY29sdW1uJztcclxuICAvLyAgICAgZGVmYXVsdDpcclxuICAvLyAgICAgICByZXR1cm4gJ2NvbHVtbi1yZXZlcnNlJztcclxuICAvLyAgIH1cclxuICAvLyB9XHJcblxyXG4gIG9uQ2hlY2tib3hDaGFuZ2UoZXZlbnQ6IEV2ZW50KTogdm9pZCB7XHJcbiAgICBjb25zdCB0YXJnZXQgPSBldmVudC50YXJnZXQgYXMgSFRNTElucHV0RWxlbWVudDtcclxuICAgIHRoaXMuY2hlY2tlZCA9IHRhcmdldC5jaGVja2VkO1xyXG4gICAgdGhpcy5jaGVja2VkQ2hhbmdlLmVtaXQodGhpcy5jaGVja2VkKTtcclxuICB9XHJcbn1cclxuIiwiPGRpdlxyXG4gIGNsYXNzPVwiYnItY2hlY2tib3hcIlxyXG4gIFtuZ0NsYXNzXT1cInN0YXRlXCI+XHJcbiAgPGlucHV0XHJcbiAgICB0eXBlPVwiY2hlY2tib3hcIlxyXG4gICAgW2lkXT1cIm9wdGlvbi5uYW1lXCJcclxuICAgIFtuYW1lXT1cIm9wdGlvbi5uYW1lXCJcclxuICAgIFthcmlhTGFiZWxdPVwib3B0aW9uLnZhbHVlXCJcclxuICAgIFtjaGVja2VkXT1cImNoZWNrZWRcIlxyXG4gICAgW2Rpc2FibGVkXT1cInN0YXRlID09PSBjaGVja2JveE9wdGlvblN0YXRlcy5kaXNhYmxlZFwiXHJcbiAgICAoY2hhbmdlKT1cIm9uQ2hlY2tib3hDaGFuZ2UoJGV2ZW50KVwiXHJcbiAgLz5cclxuICA8bGFiZWxcclxuICAgICpuZ0lmPVwidHlwZSAhPT0gY2hlY2tib3hPcHRpb25UeXBlcy53aXRob3V0TGFiZWxcIlxyXG4gICAgW2Zvcl09XCJvcHRpb24ubmFtZVwiPlxyXG4gICAge3sgb3B0aW9uLm5hbWUgfX1cclxuICA8L2xhYmVsPlxyXG48L2Rpdj5cclxuIl19