ng-zorro-antd-mobile
Version:
An enterprise-class mobile UI components based on Ant Design and Angular
90 lines (89 loc) • 6.16 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { Component, Input, Output, HostBinding, EventEmitter } from '@angular/core';
/**
* @record
*/
export function OnChangeEvent() { }
/** @type {?} */
OnChangeEvent.prototype.selectedIndex;
/** @type {?} */
OnChangeEvent.prototype.value;
var SegmentedControlComponent = /** @class */ (function () {
function SegmentedControlComponent() {
this.prefixCls = 'am-segment';
this.tintColor = '#2DB7F5';
this.disabled = false;
this.selectedIndex = 0;
this.onChange = new EventEmitter();
this.role = 'tablist';
this.amSegment = true;
}
Object.defineProperty(SegmentedControlComponent.prototype, "amDisabled", {
get: /**
* @return {?}
*/
function () {
return this.disabled;
},
enumerable: true,
configurable: true
});
/**
* @param {?} index
* @param {?} value
* @return {?}
*/
SegmentedControlComponent.prototype.onClick = /**
* @param {?} index
* @param {?} value
* @return {?}
*/
function (index, value) {
if (!this.disabled && index !== this.selectedIndex) {
this.selectedIndex = index;
this.onChange.emit({ selectedIndex: index, value: value });
}
};
SegmentedControlComponent.decorators = [
{ type: Component, args: [{
selector: 'SegmentedControl, nz-segmented-control',
template: "<div role=\"tab\"\n *ngFor=\"let value of values; let i = index;\"\n class=\"{{prefixCls}}-item\"\n [ngClass]=\"{'am-segment-item-selected' : i === selectedIndex}\"\n [ngStyle]=\"{'border-color': tintColor, 'color': i === selectedIndex ? '#fff' : tintColor, 'background-color': i === selectedIndex ? tintColor : 'transparent'}\"\n (click)=\"onClick(i, value)\"\n>\n <div class=\"{{prefixCls}}-item-inner\"\n [ngStyle]=\"{'background-color': i === selectedIndex ? tintColor : 'transparent'}\"\n ></div>\n {{value}}\n</div>\n"
}] }
];
/** @nocollapse */
SegmentedControlComponent.ctorParameters = function () { return []; };
SegmentedControlComponent.propDecorators = {
tintColor: [{ type: Input }],
disabled: [{ type: Input }],
selectedIndex: [{ type: Input }],
values: [{ type: Input }],
onChange: [{ type: Output }],
role: [{ type: HostBinding, args: ['attr.role',] }],
amSegment: [{ type: HostBinding, args: ['class.am-segment',] }],
amDisabled: [{ type: HostBinding, args: ['class.am-segment-disabled',] }]
};
return SegmentedControlComponent;
}());
export { SegmentedControlComponent };
if (false) {
/** @type {?} */
SegmentedControlComponent.prototype.prefixCls;
/** @type {?} */
SegmentedControlComponent.prototype.tintColor;
/** @type {?} */
SegmentedControlComponent.prototype.disabled;
/** @type {?} */
SegmentedControlComponent.prototype.selectedIndex;
/** @type {?} */
SegmentedControlComponent.prototype.values;
/** @type {?} */
SegmentedControlComponent.prototype.onChange;
/** @type {?} */
SegmentedControlComponent.prototype.role;
/** @type {?} */
SegmentedControlComponent.prototype.amSegment;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VnbWVudGVkLWNvbnRyb2wuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmctem9ycm8tYW50ZC1tb2JpbGUvIiwic291cmNlcyI6WyJzZWdtZW50ZWQtY29udHJvbC9zZWdtZW50ZWQtY29udHJvbC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxXQUFXLEVBQUUsWUFBWSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7Ozs7Ozs7O0lBa0NsRjt5QkF0Qm9CLFlBQVk7eUJBR1osU0FBUzt3QkFFVCxLQUFLOzZCQUVELENBQUM7d0JBSWUsSUFBSSxZQUFZLEVBQWlCO29CQUdsRSxTQUFTO3lCQUVLLElBQUk7S0FNVDtJQUxoQixzQkFDSSxpREFBVTs7OztRQURkO1lBRUUsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDO1NBQ3RCOzs7T0FBQTs7Ozs7O0lBSUQsMkNBQU87Ozs7O0lBQVAsVUFBUSxLQUFhLEVBQUUsS0FBYTtRQUNsQyxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsSUFBSSxLQUFLLEtBQUssSUFBSSxDQUFDLGFBQWEsRUFBRTtZQUNsRCxJQUFJLENBQUMsYUFBYSxHQUFHLEtBQUssQ0FBQztZQUMzQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxFQUFFLGFBQWEsRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUM7U0FDNUQ7S0FDRjs7Z0JBbENGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsd0NBQXdDO29CQUNsRCxvakJBQWlEO2lCQUNsRDs7Ozs7NEJBSUUsS0FBSzsyQkFFTCxLQUFLO2dDQUVMLEtBQUs7eUJBRUwsS0FBSzsyQkFFTCxNQUFNO3VCQUdOLFdBQVcsU0FBQyxXQUFXOzRCQUV2QixXQUFXLFNBQUMsa0JBQWtCOzZCQUU5QixXQUFXLFNBQUMsMkJBQTJCOztvQ0E3QjFDOztTQVdhLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgSG9zdEJpbmRpbmcsIEV2ZW50RW1pdHRlciB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5leHBvcnQgaW50ZXJmYWNlIE9uQ2hhbmdlRXZlbnQge1xuICBzZWxlY3RlZEluZGV4OiBudW1iZXI7XG4gIHZhbHVlOiBzdHJpbmc7XG59XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ1NlZ21lbnRlZENvbnRyb2wsIG56LXNlZ21lbnRlZC1jb250cm9sJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3NlZ21lbnRlZC1jb250cm9sLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBTZWdtZW50ZWRDb250cm9sQ29tcG9uZW50IHtcbiAgcHJlZml4Q2xzOiBzdHJpbmcgPSAnYW0tc2VnbWVudCc7XG5cbiAgQElucHV0KClcbiAgdGludENvbG9yOiBzdHJpbmcgPSAnIzJEQjdGNSc7XG4gIEBJbnB1dCgpXG4gIGRpc2FibGVkOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpXG4gIHNlbGVjdGVkSW5kZXg6IG51bWJlciA9IDA7XG4gIEBJbnB1dCgpXG4gIHZhbHVlczogQXJyYXk8c3RyaW5nPltdO1xuICBAT3V0cHV0KClcbiAgb25DaGFuZ2U6IEV2ZW50RW1pdHRlcjxPbkNoYW5nZUV2ZW50PiA9IG5ldyBFdmVudEVtaXR0ZXI8T25DaGFuZ2VFdmVudD4oKTtcblxuICBASG9zdEJpbmRpbmcoJ2F0dHIucm9sZScpXG4gIHJvbGUgPSAndGFibGlzdCc7XG4gIEBIb3N0QmluZGluZygnY2xhc3MuYW0tc2VnbWVudCcpXG4gIGFtU2VnbWVudDogYm9vbGVhbiA9IHRydWU7XG4gIEBIb3N0QmluZGluZygnY2xhc3MuYW0tc2VnbWVudC1kaXNhYmxlZCcpXG4gIGdldCBhbURpc2FibGVkKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLmRpc2FibGVkO1xuICB9XG5cbiAgY29uc3RydWN0b3IoKSB7fVxuXG4gIG9uQ2xpY2soaW5kZXg6IG51bWJlciwgdmFsdWU6IHN0cmluZykge1xuICAgIGlmICghdGhpcy5kaXNhYmxlZCAmJiBpbmRleCAhPT0gdGhpcy5zZWxlY3RlZEluZGV4KSB7XG4gICAgICB0aGlzLnNlbGVjdGVkSW5kZXggPSBpbmRleDtcbiAgICAgIHRoaXMub25DaGFuZ2UuZW1pdCh7IHNlbGVjdGVkSW5kZXg6IGluZGV4LCB2YWx1ZTogdmFsdWUgfSk7XG4gICAgfVxuICB9XG59XG4iXX0=