UNPKG

ng-zorro-antd

Version:

An enterprise-class UI components based on Ant Design and Angular

568 lines (560 loc) 17.2 kB
import { Component, ViewEncapsulation, ChangeDetectionStrategy, forwardRef, ElementRef, Renderer2, ChangeDetectorRef, ViewChild, Input, HostListener, ContentChildren, NgModule } from '@angular/core'; import { FocusMonitor } from '@angular/cdk/a11y'; import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms'; import { __decorate, __metadata } from 'tslib'; import { Subject, merge } from 'rxjs'; import { InputBoolean, isNotNil } from 'ng-zorro-antd/core'; import { startWith, takeUntil } from 'rxjs/operators'; import { CommonModule } from '@angular/common'; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class NzRadioComponent { /* tslint:disable-next-line:no-any */ /** * @param {?} elementRef * @param {?} renderer * @param {?} cdr * @param {?} focusMonitor */ constructor(elementRef, renderer, cdr, focusMonitor) { this.elementRef = elementRef; this.renderer = renderer; this.cdr = cdr; this.focusMonitor = focusMonitor; this.select$ = new Subject(); this.touched$ = new Subject(); this.checked = false; this.isNgModel = false; this.onChange = (/** * @return {?} */ () => null); this.onTouched = (/** * @return {?} */ () => null); this.nzDisabled = false; this.nzAutoFocus = false; this.renderer.addClass(elementRef.nativeElement, 'ant-radio-wrapper'); } /** * @return {?} */ updateAutoFocus() { if (this.inputElement) { if (this.nzAutoFocus) { this.renderer.setAttribute(this.inputElement.nativeElement, 'autofocus', 'autofocus'); } else { this.renderer.removeAttribute(this.inputElement.nativeElement, 'autofocus'); } } } /** * @param {?} event * @return {?} */ onClick(event) { // Prevent label click triggered twice. event.stopPropagation(); event.preventDefault(); if (!this.nzDisabled && !this.checked) { this.select$.next(this); if (this.isNgModel) { this.checked = true; this.onChange(true); } } } /** * @return {?} */ focus() { this.focusMonitor.focusVia(this.inputElement, 'keyboard'); } /** * @return {?} */ blur() { this.inputElement.nativeElement.blur(); } /** * @return {?} */ markForCheck() { this.cdr.markForCheck(); } /** * @param {?} isDisabled * @return {?} */ setDisabledState(isDisabled) { this.nzDisabled = isDisabled; this.cdr.markForCheck(); } /** * @param {?} value * @return {?} */ writeValue(value) { this.checked = value; this.cdr.markForCheck(); } /** * @param {?} fn * @return {?} */ registerOnChange(fn) { this.isNgModel = true; this.onChange = fn; } /** * @param {?} fn * @return {?} */ registerOnTouched(fn) { this.onTouched = fn; } /** * @return {?} */ ngAfterViewInit() { this.focusMonitor.monitor(this.elementRef, true).subscribe((/** * @param {?} focusOrigin * @return {?} */ focusOrigin => { if (!focusOrigin) { Promise.resolve().then((/** * @return {?} */ () => this.onTouched())); this.touched$.next(); } })); this.updateAutoFocus(); } /** * @param {?} changes * @return {?} */ ngOnChanges(changes) { if (changes.nzAutoFocus) { this.updateAutoFocus(); } } /** * @return {?} */ ngOnDestroy() { this.focusMonitor.stopMonitoring(this.elementRef); } } NzRadioComponent.decorators = [ { type: Component, args: [{ selector: '[nz-radio]', exportAs: 'nzRadio', preserveWhitespaces: false, template: "<span class=\"ant-radio\" [class.ant-radio-checked]=\"checked\" [class.ant-radio-disabled]=\"nzDisabled\">\n <input #inputElement type=\"radio\" class=\"ant-radio-input\" [disabled]=\"nzDisabled\" [checked]=\"checked\" [attr.name]=\"name\">\n <span class=\"ant-radio-inner\"></span>\n</span>\n<span><ng-content></ng-content></span>", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ () => NzRadioComponent)), multi: true } ], host: { '[class.ant-radio-wrapper-checked]': 'checked', '[class.ant-radio-wrapper-disabled]': 'nzDisabled' } }] } ]; /** @nocollapse */ NzRadioComponent.ctorParameters = () => [ { type: ElementRef }, { type: Renderer2 }, { type: ChangeDetectorRef }, { type: FocusMonitor } ]; NzRadioComponent.propDecorators = { inputElement: [{ type: ViewChild, args: ['inputElement', { static: false },] }], nzValue: [{ type: Input }], nzDisabled: [{ type: Input }], nzAutoFocus: [{ type: Input }], onClick: [{ type: HostListener, args: ['click', ['$event'],] }] }; __decorate([ InputBoolean(), __metadata("design:type", Object) ], NzRadioComponent.prototype, "nzDisabled", void 0); __decorate([ InputBoolean(), __metadata("design:type", Object) ], NzRadioComponent.prototype, "nzAutoFocus", void 0); if (false) { /** @type {?} */ NzRadioComponent.prototype.select$; /** @type {?} */ NzRadioComponent.prototype.touched$; /** @type {?} */ NzRadioComponent.prototype.checked; /** @type {?} */ NzRadioComponent.prototype.name; /** @type {?} */ NzRadioComponent.prototype.isNgModel; /** @type {?} */ NzRadioComponent.prototype.onChange; /** @type {?} */ NzRadioComponent.prototype.onTouched; /** @type {?} */ NzRadioComponent.prototype.inputElement; /** @type {?} */ NzRadioComponent.prototype.nzValue; /** @type {?} */ NzRadioComponent.prototype.nzDisabled; /** @type {?} */ NzRadioComponent.prototype.nzAutoFocus; /** * @type {?} * @private */ NzRadioComponent.prototype.elementRef; /** * @type {?} * @private */ NzRadioComponent.prototype.renderer; /** * @type {?} * @private */ NzRadioComponent.prototype.cdr; /** * @type {?} * @private */ NzRadioComponent.prototype.focusMonitor; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class NzRadioButtonComponent extends NzRadioComponent { /* tslint:disable-next-line:no-any */ /** * @param {?} elementRef * @param {?} renderer * @param {?} cdr * @param {?} focusMonitor */ constructor(elementRef, renderer, cdr, focusMonitor) { super(elementRef, renderer, cdr, focusMonitor); renderer.removeClass(elementRef.nativeElement, 'ant-radio-wrapper'); renderer.addClass(elementRef.nativeElement, 'ant-radio-button-wrapper'); } } NzRadioButtonComponent.decorators = [ { type: Component, args: [{ selector: '[nz-radio-button]', exportAs: 'nzRadioButton', providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ () => NzRadioComponent)), multi: true }, { provide: NzRadioComponent, useExisting: forwardRef((/** * @return {?} */ () => NzRadioButtonComponent)) } ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, template: "<span class=\"ant-radio-button\" [class.ant-radio-button-checked]=\"checked\" [class.ant-radio-button-disabled]=\"nzDisabled\">\n <input type=\"radio\" #inputElement class=\"ant-radio-button-input\" [disabled]=\"nzDisabled\" [checked]=\"checked\" [attr.name]=\"name\">\n <span class=\"ant-radio-button-inner\"></span>\n</span>\n<span><ng-content></ng-content></span>", host: { '[class.ant-radio-button-wrapper-checked]': 'checked', '[class.ant-radio-button-wrapper-disabled]': 'nzDisabled' } }] } ]; /** @nocollapse */ NzRadioButtonComponent.ctorParameters = () => [ { type: ElementRef }, { type: Renderer2 }, { type: ChangeDetectorRef }, { type: FocusMonitor } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class NzRadioGroupComponent { /** * @param {?} cdr * @param {?} renderer * @param {?} elementRef */ constructor(cdr, renderer, elementRef) { this.cdr = cdr; this.destroy$ = new Subject(); this.onChange = (/** * @return {?} */ () => null); this.onTouched = (/** * @return {?} */ () => null); this.nzButtonStyle = 'outline'; this.nzSize = 'default'; renderer.addClass(elementRef.nativeElement, 'ant-radio-group'); } /** * @return {?} */ updateChildrenStatus() { if (this.radios) { Promise.resolve().then((/** * @return {?} */ () => { this.radios.forEach((/** * @param {?} radio * @return {?} */ radio => { radio.checked = radio.nzValue === this.value; if (isNotNil(this.nzDisabled)) { radio.nzDisabled = this.nzDisabled; } if (this.nzName) { radio.name = this.nzName; } radio.markForCheck(); })); })); } } /** * @return {?} */ ngAfterContentInit() { this.radios.changes .pipe(startWith(null), takeUntil(this.destroy$)) .subscribe((/** * @return {?} */ () => { this.updateChildrenStatus(); if (this.selectSubscription) { this.selectSubscription.unsubscribe(); } this.selectSubscription = merge(...this.radios.map((/** * @param {?} radio * @return {?} */ radio => radio.select$))) .pipe(takeUntil(this.destroy$)) .subscribe((/** * @param {?} radio * @return {?} */ radio => { if (this.value !== radio.nzValue) { this.value = radio.nzValue; this.updateChildrenStatus(); this.onChange(this.value); } })); if (this.touchedSubscription) { this.touchedSubscription.unsubscribe(); } this.touchedSubscription = merge(...this.radios.map((/** * @param {?} radio * @return {?} */ radio => radio.touched$))) .pipe(takeUntil(this.destroy$)) .subscribe((/** * @return {?} */ () => { Promise.resolve().then((/** * @return {?} */ () => this.onTouched())); })); })); } /** * @param {?} changes * @return {?} */ ngOnChanges(changes) { if (changes.nzDisabled || changes.nzName) { this.updateChildrenStatus(); } } /** * @return {?} */ ngOnDestroy() { this.destroy$.next(); this.destroy$.complete(); } /* tslint:disable-next-line:no-any */ /** * @param {?} value * @return {?} */ writeValue(value) { this.value = value; this.updateChildrenStatus(); this.cdr.markForCheck(); } /** * @param {?} fn * @return {?} */ registerOnChange(fn) { this.onChange = fn; } /** * @param {?} fn * @return {?} */ registerOnTouched(fn) { this.onTouched = fn; } /** * @param {?} isDisabled * @return {?} */ setDisabledState(isDisabled) { this.nzDisabled = isDisabled; this.cdr.markForCheck(); } } NzRadioGroupComponent.decorators = [ { type: Component, args: [{ selector: 'nz-radio-group', exportAs: 'nzRadioGroup', preserveWhitespaces: false, template: "<ng-content></ng-content>", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ () => NzRadioGroupComponent)), multi: true } ], host: { '[class.ant-radio-group-large]': `nzSize === 'large'`, '[class.ant-radio-group-small]': `nzSize === 'small'`, '[class.ant-radio-group-solid]': `nzButtonStyle === 'solid'` } }] } ]; /** @nocollapse */ NzRadioGroupComponent.ctorParameters = () => [ { type: ChangeDetectorRef }, { type: Renderer2 }, { type: ElementRef } ]; NzRadioGroupComponent.propDecorators = { radios: [{ type: ContentChildren, args: [forwardRef((/** * @return {?} */ () => NzRadioComponent)), { descendants: true },] }], nzDisabled: [{ type: Input }], nzButtonStyle: [{ type: Input }], nzSize: [{ type: Input }], nzName: [{ type: Input }] }; __decorate([ InputBoolean(), __metadata("design:type", Boolean) ], NzRadioGroupComponent.prototype, "nzDisabled", void 0); if (false) { /** * @type {?} * @private */ NzRadioGroupComponent.prototype.value; /** * @type {?} * @private */ NzRadioGroupComponent.prototype.destroy$; /** * @type {?} * @private */ NzRadioGroupComponent.prototype.selectSubscription; /** * @type {?} * @private */ NzRadioGroupComponent.prototype.touchedSubscription; /** @type {?} */ NzRadioGroupComponent.prototype.onChange; /** @type {?} */ NzRadioGroupComponent.prototype.onTouched; /** @type {?} */ NzRadioGroupComponent.prototype.radios; /** @type {?} */ NzRadioGroupComponent.prototype.nzDisabled; /** @type {?} */ NzRadioGroupComponent.prototype.nzButtonStyle; /** @type {?} */ NzRadioGroupComponent.prototype.nzSize; /** @type {?} */ NzRadioGroupComponent.prototype.nzName; /** * @type {?} * @private */ NzRadioGroupComponent.prototype.cdr; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class NzRadioModule { } NzRadioModule.decorators = [ { type: NgModule, args: [{ imports: [CommonModule, FormsModule], exports: [NzRadioComponent, NzRadioButtonComponent, NzRadioGroupComponent], declarations: [NzRadioComponent, NzRadioButtonComponent, NzRadioGroupComponent] },] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ export { NzRadioButtonComponent, NzRadioComponent, NzRadioGroupComponent, NzRadioModule }; //# sourceMappingURL=ng-zorro-antd-radio.js.map