UNPKG

primeng

Version:

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/primeng.svg)](https://badge.fury.io/js/primeng) [![Build Status](https://travis-ci.org/primefaces/primeng.

191 lines (187 loc) 6.22 kB
import { forwardRef, EventEmitter, ChangeDetectorRef, Input, ViewChild, Output, Component, ChangeDetectionStrategy, NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; return c > 3 && r && Object.defineProperty(target, key, r), r; }; const CHECKBOX_VALUE_ACCESSOR = { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => Checkbox), multi: true }; let Checkbox = class Checkbox { constructor(cd) { this.cd = cd; this.checkboxIcon = 'pi pi-check'; this.onChange = new EventEmitter(); this.onModelChange = () => { }; this.onModelTouched = () => { }; this.focused = false; this.checked = false; } onClick(event, checkbox, focus) { event.preventDefault(); if (this.disabled || this.readonly) { return; } this.checked = !this.checked; this.updateModel(); if (focus) { checkbox.focus(); } } updateModel() { if (!this.binary) { if (this.checked) this.addValue(); else this.removeValue(); this.onModelChange(this.model); if (this.formControl) { this.formControl.setValue(this.model); } } else { this.onModelChange(this.checked); } this.onChange.emit(this.checked); } handleChange(event) { if (!this.readonly) { this.checked = event.target.checked; this.updateModel(); } } isChecked() { if (this.binary) return this.model; else return this.model && this.model.indexOf(this.value) > -1; } removeValue() { this.model = this.model.filter(val => val !== this.value); } addValue() { if (this.model) this.model = [...this.model, this.value]; else this.model = [this.value]; } onFocus() { this.focused = true; } onBlur() { this.focused = false; this.onModelTouched(); } focus() { this.inputViewChild.nativeElement.focus(); } writeValue(model) { this.model = model; this.checked = this.isChecked(); this.cd.markForCheck(); } registerOnChange(fn) { this.onModelChange = fn; } registerOnTouched(fn) { this.onModelTouched = fn; } setDisabledState(val) { this.disabled = val; } }; Checkbox.ctorParameters = () => [ { type: ChangeDetectorRef } ]; __decorate([ Input() ], Checkbox.prototype, "value", void 0); __decorate([ Input() ], Checkbox.prototype, "name", void 0); __decorate([ Input() ], Checkbox.prototype, "disabled", void 0); __decorate([ Input() ], Checkbox.prototype, "binary", void 0); __decorate([ Input() ], Checkbox.prototype, "label", void 0); __decorate([ Input() ], Checkbox.prototype, "ariaLabelledBy", void 0); __decorate([ Input() ], Checkbox.prototype, "tabindex", void 0); __decorate([ Input() ], Checkbox.prototype, "inputId", void 0); __decorate([ Input() ], Checkbox.prototype, "style", void 0); __decorate([ Input() ], Checkbox.prototype, "styleClass", void 0); __decorate([ Input() ], Checkbox.prototype, "labelStyleClass", void 0); __decorate([ Input() ], Checkbox.prototype, "formControl", void 0); __decorate([ Input() ], Checkbox.prototype, "checkboxIcon", void 0); __decorate([ Input() ], Checkbox.prototype, "readonly", void 0); __decorate([ Input() ], Checkbox.prototype, "required", void 0); __decorate([ ViewChild('cb') ], Checkbox.prototype, "inputViewChild", void 0); __decorate([ Output() ], Checkbox.prototype, "onChange", void 0); Checkbox = __decorate([ Component({ selector: 'p-checkbox', template: ` <div [ngStyle]="style" [ngClass]="{'ui-chkbox ui-widget': true,'ui-chkbox-readonly': readonly}" [class]="styleClass"> <div class="ui-helper-hidden-accessible"> <input #cb type="checkbox" [attr.id]="inputId" [attr.name]="name" [readonly]="readonly" [value]="value" [checked]="checked" (focus)="onFocus()" (blur)="onBlur()" [ngClass]="{'ui-state-focus':focused}" (change)="handleChange($event)" [disabled]="disabled" [attr.tabindex]="tabindex" [attr.aria-labelledby]="ariaLabelledBy" [attr.required]="required"> </div> <div class="ui-chkbox-box ui-widget ui-corner-all ui-state-default" (click)="onClick($event,cb,true)" [ngClass]="{'ui-state-active':checked,'ui-state-disabled':disabled,'ui-state-focus':focused}" role="checkbox" [attr.aria-checked]="checked"> <span class="ui-chkbox-icon ui-clickable" [ngClass]="checked ? checkboxIcon : null"></span> </div> </div> <label (click)="onClick($event,cb,true)" [class]="labelStyleClass" [ngClass]="{'ui-chkbox-label': true, 'ui-label-active':checked, 'ui-label-disabled':disabled, 'ui-label-focus':focused}" *ngIf="label" [attr.for]="inputId">{{label}}</label> `, providers: [CHECKBOX_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.Default }) ], Checkbox); let CheckboxModule = class CheckboxModule { }; CheckboxModule = __decorate([ NgModule({ imports: [CommonModule], exports: [Checkbox], declarations: [Checkbox] }) ], CheckboxModule); /** * Generated bundle index. Do not edit. */ export { CHECKBOX_VALUE_ACCESSOR, Checkbox, CheckboxModule }; //# sourceMappingURL=primeng-checkbox.js.map