ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
574 lines (561 loc) • 22.1 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/observers'), require('@angular/common'), require('@angular/cdk/a11y'), require('@angular/core'), require('@angular/forms'), require('ng-zorro-antd/core')) :
typeof define === 'function' && define.amd ? define('ng-zorro-antd/checkbox', ['exports', '@angular/cdk/observers', '@angular/common', '@angular/cdk/a11y', '@angular/core', '@angular/forms', 'ng-zorro-antd/core'], factory) :
(factory((global['ng-zorro-antd'] = global['ng-zorro-antd'] || {}, global['ng-zorro-antd'].checkbox = {}),global.ng.cdk.observers,global.ng.common,global.ng.cdk.a11y,global.ng.core,global.ng.forms,global['ng-zorro-antd'].core));
}(this, (function (exports,observers,common,a11y,core,forms,core$1) { 'use strict';
/*! *****************************************************************************
Copyright (c) Microsoft Corporation. All rights reserved.
Licensed under the Apache License, Version 2.0 (the "License"); you may not use
this file except in compliance with the License. You may obtain a copy of the
License at http://www.apache.org/licenses/LICENSE-2.0
THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED
WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,
MERCHANTABLITY OR NON-INFRINGEMENT.
See the Apache Version 2.0 License for specific language governing permissions
and limitations under the License.
***************************************************************************** */
function __decorate(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;
}
function __metadata(metadataKey, metadataValue) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
return Reflect.metadata(metadataKey, metadataValue);
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzCheckboxWrapperComponent = /** @class */ (function () {
function NzCheckboxWrapperComponent(renderer, elementRef) {
this.nzOnChange = new core.EventEmitter();
this.checkboxList = [];
renderer.addClass(elementRef.nativeElement, 'ant-checkbox-group');
}
/**
* @param {?} value
* @return {?}
*/
NzCheckboxWrapperComponent.prototype.addCheckbox = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.checkboxList.push(value);
};
/**
* @param {?} value
* @return {?}
*/
NzCheckboxWrapperComponent.prototype.removeCheckbox = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.checkboxList.splice(this.checkboxList.indexOf(value), 1);
};
/**
* @return {?}
*/
NzCheckboxWrapperComponent.prototype.outputValue = /**
* @return {?}
*/
function () {
/** @type {?} */
var checkedList = this.checkboxList.filter(( /**
* @param {?} item
* @return {?}
*/function (item) { return item.nzChecked; }));
return checkedList.map(( /**
* @param {?} item
* @return {?}
*/function (item) { return item.nzValue; }));
};
/**
* @return {?}
*/
NzCheckboxWrapperComponent.prototype.onChange = /**
* @return {?}
*/
function () {
this.nzOnChange.emit(this.outputValue());
};
NzCheckboxWrapperComponent.decorators = [
{ type: core.Component, args: [{
selector: 'nz-checkbox-wrapper',
exportAs: 'nzCheckboxWrapper',
preserveWhitespaces: false,
changeDetection: core.ChangeDetectionStrategy.OnPush,
encapsulation: core.ViewEncapsulation.None,
template: "<ng-content></ng-content>"
}] }
];
/** @nocollapse */
NzCheckboxWrapperComponent.ctorParameters = function () {
return [
{ type: core.Renderer2 },
{ type: core.ElementRef }
];
};
NzCheckboxWrapperComponent.propDecorators = {
nzOnChange: [{ type: core.Output }]
};
return NzCheckboxWrapperComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzCheckboxComponent = /** @class */ (function () {
function NzCheckboxComponent(elementRef, renderer, nzCheckboxWrapperComponent, cdr, focusMonitor) {
this.elementRef = elementRef;
this.renderer = renderer;
this.nzCheckboxWrapperComponent = nzCheckboxWrapperComponent;
this.cdr = cdr;
this.focusMonitor = focusMonitor;
// tslint:disable-next-line:no-any
this.onChange = ( /**
* @return {?}
*/function () { return null; });
// tslint:disable-next-line:no-any
this.onTouched = ( /**
* @return {?}
*/function () { return null; });
this.nzCheckedChange = new core.EventEmitter();
this.nzAutoFocus = false;
this.nzDisabled = false;
this.nzIndeterminate = false;
this.nzChecked = false;
renderer.addClass(elementRef.nativeElement, 'ant-checkbox-wrapper');
}
/**
* @param {?} e
* @return {?}
*/
NzCheckboxComponent.prototype.hostClick = /**
* @param {?} e
* @return {?}
*/
function (e) {
e.preventDefault();
this.focus();
this.innerCheckedChange(!this.nzChecked);
};
/**
* @param {?} checked
* @return {?}
*/
NzCheckboxComponent.prototype.innerCheckedChange = /**
* @param {?} checked
* @return {?}
*/
function (checked) {
if (!this.nzDisabled) {
this.nzChecked = checked;
this.onChange(this.nzChecked);
this.nzCheckedChange.emit(this.nzChecked);
if (this.nzCheckboxWrapperComponent) {
this.nzCheckboxWrapperComponent.onChange();
}
}
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.updateAutoFocus = /**
* @return {?}
*/
function () {
if (this.inputElement && this.nzAutoFocus) {
this.renderer.setAttribute(this.inputElement.nativeElement, 'autofocus', 'autofocus');
}
else {
this.renderer.removeAttribute(this.inputElement.nativeElement, 'autofocus');
}
};
/**
* @param {?} value
* @return {?}
*/
NzCheckboxComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.nzChecked = value;
this.cdr.markForCheck();
};
/**
* @param {?} fn
* @return {?}
*/
NzCheckboxComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
NzCheckboxComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
/**
* @param {?} isDisabled
* @return {?}
*/
NzCheckboxComponent.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.nzDisabled = isDisabled;
this.cdr.markForCheck();
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.focus = /**
* @return {?}
*/
function () {
this.focusMonitor.focusVia(this.inputElement, 'keyboard');
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.blur = /**
* @return {?}
*/
function () {
this.inputElement.nativeElement.blur();
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.checkContent = /**
* @return {?}
*/
function () {
if (core$1.isEmpty(this.contentElement.nativeElement)) {
this.renderer.setStyle(this.contentElement.nativeElement, 'display', 'none');
}
else {
this.renderer.removeStyle(this.contentElement.nativeElement, 'display');
}
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this.focusMonitor.monitor(this.elementRef, true).subscribe(( /**
* @param {?} focusOrigin
* @return {?}
*/function (focusOrigin) {
if (!focusOrigin) {
Promise.resolve().then(( /**
* @return {?}
*/function () { return _this.onTouched(); }));
}
}));
if (this.nzCheckboxWrapperComponent) {
this.nzCheckboxWrapperComponent.addCheckbox(this);
}
};
/**
* @param {?} changes
* @return {?}
*/
NzCheckboxComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes.nzAutoFocus) {
this.updateAutoFocus();
}
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this.updateAutoFocus();
this.checkContent();
};
/**
* @return {?}
*/
NzCheckboxComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.focusMonitor.stopMonitoring(this.elementRef);
if (this.nzCheckboxWrapperComponent) {
this.nzCheckboxWrapperComponent.removeCheckbox(this);
}
};
NzCheckboxComponent.decorators = [
{ type: core.Component, args: [{
selector: '[nz-checkbox]',
exportAs: 'nzCheckbox',
preserveWhitespaces: false,
changeDetection: core.ChangeDetectionStrategy.OnPush,
encapsulation: core.ViewEncapsulation.None,
template: "<span class=\"ant-checkbox\"\n [class.ant-checkbox-checked]=\"nzChecked && !nzIndeterminate\"\n [class.ant-checkbox-disabled]=\"nzDisabled\"\n [class.ant-checkbox-indeterminate]=\"nzIndeterminate\">\n <input #inputElement [checked]=\"nzChecked\" [ngModel]=\"nzChecked\" [disabled]=\"nzDisabled\" (ngModelChange)=\"innerCheckedChange($event)\" (click)=\"$event.stopPropagation();\" type=\"checkbox\" class=\"ant-checkbox-input\">\n <span class=\"ant-checkbox-inner\"></span>\n</span>\n<span #contentElement (cdkObserveContent)=\"checkContent()\"><ng-content></ng-content></span>",
providers: [
{
provide: forms.NG_VALUE_ACCESSOR,
useExisting: core.forwardRef(( /**
* @return {?}
*/function () { return NzCheckboxComponent; })),
multi: true
}
],
host: {
'(click)': 'hostClick($event)'
}
}] }
];
/** @nocollapse */
NzCheckboxComponent.ctorParameters = function () {
return [
{ type: core.ElementRef },
{ type: core.Renderer2 },
{ type: NzCheckboxWrapperComponent, decorators: [{ type: core.Optional }] },
{ type: core.ChangeDetectorRef },
{ type: a11y.FocusMonitor }
];
};
NzCheckboxComponent.propDecorators = {
inputElement: [{ type: core.ViewChild, args: ['inputElement',] }],
contentElement: [{ type: core.ViewChild, args: ['contentElement',] }],
nzCheckedChange: [{ type: core.Output }],
nzValue: [{ type: core.Input }],
nzAutoFocus: [{ type: core.Input }],
nzDisabled: [{ type: core.Input }],
nzIndeterminate: [{ type: core.Input }],
nzChecked: [{ type: core.Input }]
};
__decorate([
core$1.InputBoolean(),
__metadata("design:type", Object)
], NzCheckboxComponent.prototype, "nzAutoFocus", void 0);
__decorate([
core$1.InputBoolean(),
__metadata("design:type", Object)
], NzCheckboxComponent.prototype, "nzDisabled", void 0);
__decorate([
core$1.InputBoolean(),
__metadata("design:type", Object)
], NzCheckboxComponent.prototype, "nzIndeterminate", void 0);
__decorate([
core$1.InputBoolean(),
__metadata("design:type", Object)
], NzCheckboxComponent.prototype, "nzChecked", void 0);
return NzCheckboxComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzCheckboxGroupComponent = /** @class */ (function () {
function NzCheckboxGroupComponent(elementRef, focusMonitor, cdr, renderer) {
this.elementRef = elementRef;
this.focusMonitor = focusMonitor;
this.cdr = cdr;
// tslint:disable-next-line:no-any
this.onChange = ( /**
* @return {?}
*/function () { return null; });
// tslint:disable-next-line:no-any
this.onTouched = ( /**
* @return {?}
*/function () { return null; });
this.options = [];
this.nzDisabled = false;
renderer.addClass(elementRef.nativeElement, 'ant-checkbox-group');
}
/**
* @return {?}
*/
NzCheckboxGroupComponent.prototype.onOptionChange = /**
* @return {?}
*/
function () {
this.onChange(this.options);
};
/**
* @param {?} _index
* @param {?} option
* @return {?}
*/
NzCheckboxGroupComponent.prototype.trackByOption = /**
* @param {?} _index
* @param {?} option
* @return {?}
*/
function (_index, option) {
return option.value;
};
/**
* @return {?}
*/
NzCheckboxGroupComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var _this = this;
this.focusMonitor.monitor(this.elementRef, true).subscribe(( /**
* @param {?} focusOrigin
* @return {?}
*/function (focusOrigin) {
if (!focusOrigin) {
Promise.resolve().then(( /**
* @return {?}
*/function () { return _this.onTouched(); }));
}
}));
};
/**
* @return {?}
*/
NzCheckboxGroupComponent.prototype.ngOnDestroy = /**
* @return {?}
*/
function () {
this.focusMonitor.stopMonitoring(this.elementRef);
};
/**
* @param {?} value
* @return {?}
*/
NzCheckboxGroupComponent.prototype.writeValue = /**
* @param {?} value
* @return {?}
*/
function (value) {
this.options = value;
this.cdr.markForCheck();
};
/**
* @param {?} fn
* @return {?}
*/
NzCheckboxGroupComponent.prototype.registerOnChange = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onChange = fn;
};
/**
* @param {?} fn
* @return {?}
*/
NzCheckboxGroupComponent.prototype.registerOnTouched = /**
* @param {?} fn
* @return {?}
*/
function (fn) {
this.onTouched = fn;
};
/**
* @param {?} isDisabled
* @return {?}
*/
NzCheckboxGroupComponent.prototype.setDisabledState = /**
* @param {?} isDisabled
* @return {?}
*/
function (isDisabled) {
this.nzDisabled = isDisabled;
this.cdr.markForCheck();
};
NzCheckboxGroupComponent.decorators = [
{ type: core.Component, args: [{
selector: 'nz-checkbox-group',
exportAs: 'nzCheckboxGroup',
preserveWhitespaces: false,
encapsulation: core.ViewEncapsulation.None,
template: "<label nz-checkbox\n *ngFor=\"let option of options; trackBy:trackByOption\"\n [nzDisabled]=\"option.disabled || nzDisabled\"\n [(nzChecked)]=\"option.checked\"\n (nzCheckedChange)=\"onOptionChange()\">\n <span>{{ option.label }}</span>\n</label>",
providers: [
{
provide: forms.NG_VALUE_ACCESSOR,
useExisting: core.forwardRef(( /**
* @return {?}
*/function () { return NzCheckboxGroupComponent; })),
multi: true
}
]
}] }
];
/** @nocollapse */
NzCheckboxGroupComponent.ctorParameters = function () {
return [
{ type: core.ElementRef },
{ type: a11y.FocusMonitor },
{ type: core.ChangeDetectorRef },
{ type: core.Renderer2 }
];
};
NzCheckboxGroupComponent.propDecorators = {
nzDisabled: [{ type: core.Input }]
};
__decorate([
core$1.InputBoolean(),
__metadata("design:type", Object)
], NzCheckboxGroupComponent.prototype, "nzDisabled", void 0);
return NzCheckboxGroupComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var NzCheckboxModule = /** @class */ (function () {
function NzCheckboxModule() {
}
NzCheckboxModule.decorators = [
{ type: core.NgModule, args: [{
imports: [common.CommonModule, forms.FormsModule, observers.ObserversModule],
declarations: [NzCheckboxComponent, NzCheckboxGroupComponent, NzCheckboxWrapperComponent],
exports: [NzCheckboxComponent, NzCheckboxGroupComponent, NzCheckboxWrapperComponent]
},] }
];
return NzCheckboxModule;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
exports.NzCheckboxComponent = NzCheckboxComponent;
exports.NzCheckboxModule = NzCheckboxModule;
exports.NzCheckboxGroupComponent = NzCheckboxGroupComponent;
exports.NzCheckboxWrapperComponent = NzCheckboxWrapperComponent;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=ng-zorro-antd-checkbox.umd.js.map