@duoduo-oba/ng-devui
Version:
DevUI components based on Angular
174 lines • 12.8 kB
JavaScript
/**
* @fileoverview added by tsickle
* Generated from: toggle.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
import { Component, EventEmitter, forwardRef, HostListener, Input, Output } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
export class ToggleComponent {
constructor() {
this.size = 'small';
this.change = new EventEmitter();
this.onTouchedCallback = (/**
* @param {?} v
* @return {?}
*/
(v) => {
});
this.onChangeCallback = (/**
* @param {?} v
* @return {?}
*/
(v) => {
});
}
/**
* @param {?} v
* @return {?}
*/
set checked(v) {
this._checked = v !== false;
}
/**
* @return {?}
*/
get checked() {
return this._checked;
}
/**
* @param {?} v
* @return {?}
*/
set disabled(v) {
this._disabled = v !== false;
}
/**
* @return {?}
*/
get disabled() {
return this._disabled;
}
/**
* @return {?}
*/
onToggle() {
if (this.disabled) {
return;
}
this.canChange().then((/**
* @param {?} change
* @return {?}
*/
(change) => {
if (!change) {
return;
}
this.checked = !this.checked;
this.change.emit(this.checked);
this.onChangeCallback(this.checked);
this.onTouchedCallback(this.checked);
}));
}
/**
* @return {?}
*/
canChange() {
/** @type {?} */
let changeResult = Promise.resolve(true);
if (this.beforeChange) {
/** @type {?} */
const result = this.beforeChange(this.checked);
if (typeof result !== 'undefined') {
if (result.then) {
changeResult = result;
}
else if (result.subscribe) {
changeResult = ((/** @type {?} */ (result))).toPromise();
}
else {
changeResult = Promise.resolve(result);
}
}
}
return changeResult;
}
/**
* @param {?} obj
* @return {?}
*/
writeValue(obj) {
if (obj !== this.checked) {
this.checked = !!obj;
}
}
/**
* @param {?} fn
* @return {?}
*/
registerOnChange(fn) {
this.onChangeCallback = fn;
}
/**
* @param {?} fn
* @return {?}
*/
registerOnTouched(fn) {
this.onTouchedCallback = fn;
}
}
ToggleComponent.decorators = [
{ type: Component, args: [{
selector: 'd-toggle',
template: "<span\r\n class=\"devui-toggle\"\r\n [class.devui-checked]=\"checked\"\r\n [class.devui-disabled]=\"disabled\"\r\n [class.devui-toggle-large]=\"size === 'large'\"\r\n [class.devui-toggle-medium]=\"size === 'medium'\"\r\n [class.devui-toggle-small]=\"size === 'small'\"\r\n [style.background]=\"checked ? color : ''\"\r\n [style.border-color]=\"checked ? color : ''\"\r\n>\r\n <small></small>\r\n</span>\r\n",
exportAs: 'toggle',
providers: [{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef((/**
* @return {?}
*/
() => ToggleComponent)),
multi: true
}],
styles: [":host{display:inline-block}.devui-toggle{background:#fff;border:1px solid #adb0b8;position:relative;display:inline-block;box-sizing:content-box;overflow:visible;padding:0;margin:0;cursor:pointer;-webkit-transition:.3s ease-out;transition:.3s ease-out}.devui-toggle:active,.devui-toggle:hover{border-color:#344899}.devui-toggle small{background:#adb0b8;border-radius:100%;position:absolute;top:0;left:2px;-webkit-transition:.3s ease-out;transition:.3s ease-out}.devui-toggle.devui-toggle-large{width:66px;height:40px;border-radius:40px}.devui-toggle.devui-toggle-large small{width:40px;height:40px}.devui-toggle.devui-toggle-large.devui-checked small{background:#fff;left:26px}.devui-toggle.devui-toggle-medium{width:50px;height:30px;border-radius:30px}.devui-toggle.devui-toggle-medium small{width:30px;height:30px}.devui-toggle.devui-toggle-medium.devui-checked small{background:#fff;left:20px}.devui-toggle.devui-toggle-small{width:30px;height:14px;border-radius:14px}.devui-toggle.devui-toggle-small small{width:10px;height:10px;position:absolute;top:2px}.devui-toggle.devui-toggle-small.devui-checked small{background:#fff;left:18px}.devui-toggle.devui-checked{background:#5e7ce0;border-color:#5e7ce0}.devui-toggle.devui-checked:active,.devui-toggle.devui-checked:hover{background:#344899;border-color:#344899}.devui-toggle.devui-disabled{opacity:.3;cursor:not-allowed}"]
}] }
];
ToggleComponent.propDecorators = {
size: [{ type: Input }],
color: [{ type: Input }],
beforeChange: [{ type: Input }],
checked: [{ type: Input }],
disabled: [{ type: Input }],
change: [{ type: Output }],
onToggle: [{ type: HostListener, args: ['click',] }]
};
if (false) {
/**
* @type {?}
* @private
*/
ToggleComponent.prototype._checked;
/**
* @type {?}
* @private
*/
ToggleComponent.prototype._disabled;
/** @type {?} */
ToggleComponent.prototype.size;
/** @type {?} */
ToggleComponent.prototype.color;
/** @type {?} */
ToggleComponent.prototype.beforeChange;
/** @type {?} */
ToggleComponent.prototype.change;
/**
* @type {?}
* @private
*/
ToggleComponent.prototype.onTouchedCallback;
/**
* @type {?}
* @private
*/
ToggleComponent.prototype.onChangeCallback;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9nZ2xlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL25nLWRldnVpL3RvZ2dsZS8iLCJzb3VyY2VzIjpbInRvZ2dsZS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxVQUFVLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakcsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBZXpFLE1BQU0sT0FBTyxlQUFlO0lBWjVCO1FBZ0JXLFNBQUksR0FBaUMsT0FBTyxDQUFDO1FBbUI1QyxXQUFNLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQUV2QyxzQkFBaUI7Ozs7UUFBRyxDQUFDLENBQU0sRUFBRSxFQUFFO1FBQ3ZDLENBQUMsRUFBQTtRQUNPLHFCQUFnQjs7OztRQUFHLENBQUMsQ0FBTSxFQUFFLEVBQUU7UUFDdEMsQ0FBQyxFQUFBO0lBa0RILENBQUM7Ozs7O0lBdkVDLElBQWEsT0FBTyxDQUFDLENBQVU7UUFDN0IsSUFBSSxDQUFDLFFBQVEsR0FBRyxDQUFDLEtBQUssS0FBSyxDQUFDO0lBQzlCLENBQUM7Ozs7SUFFRCxJQUFJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQzs7Ozs7SUFFRCxJQUFhLFFBQVEsQ0FBQyxDQUFVO1FBQzlCLElBQUksQ0FBQyxTQUFTLEdBQUcsQ0FBQyxLQUFLLEtBQUssQ0FBQztJQUMvQixDQUFDOzs7O0lBRUQsSUFBSSxRQUFRO1FBQ1YsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3hCLENBQUM7Ozs7SUFVRCxRQUFRO1FBQ04sSUFBSSxJQUFJLENBQUMsUUFBUSxFQUFFO1lBQ2pCLE9BQU87U0FDUjtRQUNELElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQyxJQUFJOzs7O1FBQUMsQ0FBQyxNQUFNLEVBQUUsRUFBRTtZQUMvQixJQUFJLENBQUMsTUFBTSxFQUFFO2dCQUNYLE9BQU87YUFDUjtZQUNELElBQUksQ0FBQyxPQUFPLEdBQUcsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDO1lBQzdCLElBQUksQ0FBQyxNQUFNLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztZQUMvQixJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBQ3BDLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDdkMsQ0FBQyxFQUFDLENBQUM7SUFDTCxDQUFDOzs7O0lBRUQsU0FBUzs7WUFDSCxZQUFZLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUM7UUFFeEMsSUFBSSxJQUFJLENBQUMsWUFBWSxFQUFFOztrQkFDZixNQUFNLEdBQVEsSUFBSSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDO1lBQ25ELElBQUksT0FBTyxNQUFNLEtBQUssV0FBVyxFQUFFO2dCQUNqQyxJQUFJLE1BQU0sQ0FBQyxJQUFJLEVBQUU7b0JBQ2YsWUFBWSxHQUFHLE1BQU0sQ0FBQztpQkFDdkI7cUJBQU0sSUFBSSxNQUFNLENBQUMsU0FBUyxFQUFFO29CQUMzQixZQUFZLEdBQUcsQ0FBQyxtQkFBQSxNQUFNLEVBQXVCLENBQUMsQ0FBQyxTQUFTLEVBQUUsQ0FBQztpQkFDNUQ7cUJBQU07b0JBQ0wsWUFBWSxHQUFHLE9BQU8sQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUM7aUJBQ3hDO2FBQ0Y7U0FDRjtRQUVELE9BQU8sWUFBWSxDQUFDO0lBQ3RCLENBQUM7Ozs7O0lBRUQsVUFBVSxDQUFDLEdBQVE7UUFDakIsSUFBSSxHQUFHLEtBQUssSUFBSSxDQUFDLE9BQU8sRUFBRTtZQUN4QixJQUFJLENBQUMsT0FBTyxHQUFHLENBQUMsQ0FBQyxHQUFHLENBQUM7U0FDdEI7SUFDSCxDQUFDOzs7OztJQUVELGdCQUFnQixDQUFDLEVBQU87UUFDdEIsSUFBSSxDQUFDLGdCQUFnQixHQUFHLEVBQUUsQ0FBQztJQUM3QixDQUFDOzs7OztJQUVELGlCQUFpQixDQUFDLEVBQU87UUFDdkIsSUFBSSxDQUFDLGlCQUFpQixHQUFHLEVBQUUsQ0FBQztJQUM5QixDQUFDOzs7WUF6RkYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxVQUFVO2dCQUNwQiwyYUFBc0M7Z0JBRXRDLFFBQVEsRUFBRSxRQUFRO2dCQUNsQixTQUFTLEVBQUUsQ0FBQzt3QkFDVixPQUFPLEVBQUUsaUJBQWlCO3dCQUMxQixXQUFXLEVBQUUsVUFBVTs7O3dCQUFDLEdBQUcsRUFBRSxDQUFDLGVBQWUsRUFBQzt3QkFDOUMsS0FBSyxFQUFFLElBQUk7cUJBQ1osQ0FBQzs7YUFDSDs7O21CQU1FLEtBQUs7b0JBQ0wsS0FBSzsyQkFDTCxLQUFLO3NCQUNMLEtBQUs7dUJBUUwsS0FBSztxQkFRTCxNQUFNO3VCQU9OLFlBQVksU0FBQyxPQUFPOzs7Ozs7O0lBN0JyQixtQ0FBMEI7Ozs7O0lBQzFCLG9DQUEyQjs7SUFFM0IsK0JBQXNEOztJQUN0RCxnQ0FBdUI7O0lBQ3ZCLHVDQUFtRjs7SUFpQm5GLGlDQUErQzs7Ozs7SUFFL0MsNENBQ0M7Ozs7O0lBQ0QsMkNBQ0MiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgZm9yd2FyZFJlZiwgSG9zdExpc3RlbmVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbnRyb2xWYWx1ZUFjY2Vzc29yLCBOR19WQUxVRV9BQ0NFU1NPUiB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdkLXRvZ2dsZScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3RvZ2dsZS5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbYC4vdG9nZ2xlLmNvbXBvbmVudC5zY3NzYF0sXHJcbiAgZXhwb3J0QXM6ICd0b2dnbGUnLFxyXG4gIHByb3ZpZGVyczogW3tcclxuICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxyXG4gICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gVG9nZ2xlQ29tcG9uZW50KSxcclxuICAgIG11bHRpOiB0cnVlXHJcbiAgfV1cclxufSlcclxuXHJcbmV4cG9ydCBjbGFzcyBUb2dnbGVDb21wb25lbnQgaW1wbGVtZW50cyBDb250cm9sVmFsdWVBY2Nlc3NvciB7XHJcbiAgcHJpdmF0ZSBfY2hlY2tlZDogYm9vbGVhbjtcclxuICBwcml2YXRlIF9kaXNhYmxlZDogYm9vbGVhbjtcclxuXHJcbiAgQElucHV0KCkgc2l6ZTogJ3NtYWxsJyB8ICdtZWRpdW0nIHwgJ2xhcmdlJyA9ICdzbWFsbCc7XHJcbiAgQElucHV0KCkgY29sb3I6IHN0cmluZztcclxuICBASW5wdXQoKSBiZWZvcmVDaGFuZ2U6ICh2YWx1ZSkgPT4gYm9vbGVhbiB8IFByb21pc2U8Ym9vbGVhbj4gfCBPYnNlcnZhYmxlPGJvb2xlYW4+O1xyXG4gIEBJbnB1dCgpIHNldCBjaGVja2VkKHY6IGJvb2xlYW4pIHtcclxuICAgIHRoaXMuX2NoZWNrZWQgPSB2ICE9PSBmYWxzZTtcclxuICB9XHJcblxyXG4gIGdldCBjaGVja2VkKCkge1xyXG4gICAgcmV0dXJuIHRoaXMuX2NoZWNrZWQ7XHJcbiAgfVxyXG5cclxuICBASW5wdXQoKSBzZXQgZGlzYWJsZWQodjogYm9vbGVhbikge1xyXG4gICAgdGhpcy5fZGlzYWJsZWQgPSB2ICE9PSBmYWxzZTtcclxuICB9XHJcblxyXG4gIGdldCBkaXNhYmxlZCgpIHtcclxuICAgIHJldHVybiB0aGlzLl9kaXNhYmxlZDtcclxuICB9XHJcblxyXG4gIEBPdXRwdXQoKSBjaGFuZ2UgPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XHJcblxyXG4gIHByaXZhdGUgb25Ub3VjaGVkQ2FsbGJhY2sgPSAodjogYW55KSA9PiB7XHJcbiAgfVxyXG4gIHByaXZhdGUgb25DaGFuZ2VDYWxsYmFjayA9ICh2OiBhbnkpID0+IHtcclxuICB9XHJcblxyXG4gIEBIb3N0TGlzdGVuZXIoJ2NsaWNrJylcclxuICBvblRvZ2dsZSgpIHtcclxuICAgIGlmICh0aGlzLmRpc2FibGVkKSB7XHJcbiAgICAgIHJldHVybjtcclxuICAgIH1cclxuICAgIHRoaXMuY2FuQ2hhbmdlKCkudGhlbigoY2hhbmdlKSA9PiB7XHJcbiAgICAgIGlmICghY2hhbmdlKSB7XHJcbiAgICAgICAgcmV0dXJuO1xyXG4gICAgICB9XHJcbiAgICAgIHRoaXMuY2hlY2tlZCA9ICF0aGlzLmNoZWNrZWQ7XHJcbiAgICAgIHRoaXMuY2hhbmdlLmVtaXQodGhpcy5jaGVja2VkKTtcclxuICAgICAgdGhpcy5vbkNoYW5nZUNhbGxiYWNrKHRoaXMuY2hlY2tlZCk7XHJcbiAgICAgIHRoaXMub25Ub3VjaGVkQ2FsbGJhY2sodGhpcy5jaGVja2VkKTtcclxuICAgIH0pO1xyXG4gIH1cclxuXHJcbiAgY2FuQ2hhbmdlKCkge1xyXG4gICAgbGV0IGNoYW5nZVJlc3VsdCA9IFByb21pc2UucmVzb2x2ZSh0cnVlKTtcclxuXHJcbiAgICBpZiAodGhpcy5iZWZvcmVDaGFuZ2UpIHtcclxuICAgICAgY29uc3QgcmVzdWx0OiBhbnkgPSB0aGlzLmJlZm9yZUNoYW5nZSh0aGlzLmNoZWNrZWQpO1xyXG4gICAgICBpZiAodHlwZW9mIHJlc3VsdCAhPT0gJ3VuZGVmaW5lZCcpIHtcclxuICAgICAgICBpZiAocmVzdWx0LnRoZW4pIHtcclxuICAgICAgICAgIGNoYW5nZVJlc3VsdCA9IHJlc3VsdDtcclxuICAgICAgICB9IGVsc2UgaWYgKHJlc3VsdC5zdWJzY3JpYmUpIHtcclxuICAgICAgICAgIGNoYW5nZVJlc3VsdCA9IChyZXN1bHQgYXMgT2JzZXJ2YWJsZTxib29sZWFuPikudG9Qcm9taXNlKCk7XHJcbiAgICAgICAgfSBlbHNlIHtcclxuICAgICAgICAgIGNoYW5nZVJlc3VsdCA9IFByb21pc2UucmVzb2x2ZShyZXN1bHQpO1xyXG4gICAgICAgIH1cclxuICAgICAgfVxyXG4gICAgfVxyXG5cclxuICAgIHJldHVybiBjaGFuZ2VSZXN1bHQ7XHJcbiAgfVxyXG5cclxuICB3cml0ZVZhbHVlKG9iajogYW55KTogdm9pZCB7XHJcbiAgICBpZiAob2JqICE9PSB0aGlzLmNoZWNrZWQpIHtcclxuICAgICAgdGhpcy5jaGVja2VkID0gISFvYmo7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICByZWdpc3Rlck9uQ2hhbmdlKGZuOiBhbnkpIHtcclxuICAgIHRoaXMub25DaGFuZ2VDYWxsYmFjayA9IGZuO1xyXG4gIH1cclxuXHJcbiAgcmVnaXN0ZXJPblRvdWNoZWQoZm46IGFueSkge1xyXG4gICAgdGhpcy5vblRvdWNoZWRDYWxsYmFjayA9IGZuO1xyXG4gIH1cclxufVxyXG4iXX0=