@asi-ngtools/lib
Version:
This project is a little components library, simple to use, which will help you to simplify your project.
191 lines (190 loc) • 13.5 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { DefaultControlValueAccessor } from './../common/default-control-value-accessor';
import { NG_VALUE_ACCESSOR, FormControl } from '@angular/forms';
import { Component, forwardRef, Input, ElementRef, ViewChild, Renderer2 } from '@angular/core';
import { debounceTime } from 'rxjs/operators';
import * as nh from '../../native-helper';
export class AsiInputComponent extends DefaultControlValueAccessor {
/**
* @param {?} renderer
* @param {?} elementRef
*/
constructor(renderer, elementRef) {
super();
this.renderer = renderer;
this.elementRef = elementRef;
/**
* html input type
*/
this.type = 'text';
/**
* Label position
*/
this.labelPosition = 'top';
/**
* placeholder (is translated)
*/
this.placeholder = '';
/**
* Max length of the text
*/
this.maxlength = -1;
/**
* Must be a number (internaly set the regex to ^-*[0-9,\.]*$
*/
this.number = false;
/**
* Delay before the component change value
*/
this.delay = 0;
this.inputControl = new FormControl();
}
/**
* @return {?}
*/
ngOnInit() {
this.renderer.addClass(this.elementRef.nativeElement, 'label-' + this.labelPosition);
if (this.number) {
this.pattern = new RegExp('^-*[0-9,\.]*$');
}
}
/**
* @return {?}
*/
ngAfterViewInit() {
this.inputControl.valueChanges.pipe(debounceTime(this.delay)).subscribe((value) => {
if (value === '') {
this.value = null;
}
else if (this.isValide(value)) {
this.value = value;
}
else if (this.maxlength !== -1 && value.length > this.maxlength) {
// if value is too long, we truncate
this.value = value.substr(0, this.maxlength);
}
this.inputElm.nativeElement.value = this._value;
});
}
/**
* @param {?} value
* @return {?}
*/
isValide(value) {
return value == null || ((this.maxlength === -1 || value.length <= this.maxlength)
&& (this.pattern == null || this.pattern.test(value)));
}
/**
* @param {?} value
* @return {?}
*/
writeValue(value) {
if (this.isValide(value)) {
this.inputControl.setValue(value, { emitEvent: false });
}
else if (this.maxlength !== -1 && value.length > this.maxlength) {
// Length incorrect on truncate
this.inputControl.setValue(nh.truncate(value, this.maxlength), { emitEvent: false });
}
else {
// Pattern incorrect
this.inputElm.nativeElement.value = 'Incorrect value';
}
}
}
AsiInputComponent.decorators = [
{ type: Component, args: [{
selector: 'asi-input',
host: { 'class': 'asi-component asi-input' },
template: "<label class=\"input-label\" *ngIf=\"label != null\">{{label | translate}}</label>\n<input #asiInput class=\"asi-focus-error\"\n [attr.id]=\"id\"\n [attr.name]=\"name\"\n [attr.type]=\"type\"\n [attr.disabled]=\"disabled ? '' : null\"\n [attr.placeholder]=\"placeholder\"\n [formControl]=\"inputControl\"/>\n",
providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => AsiInputComponent),
multi: true
}
]
}] }
];
/** @nocollapse */
AsiInputComponent.ctorParameters = () => [
{ type: Renderer2 },
{ type: ElementRef }
];
AsiInputComponent.propDecorators = {
id: [{ type: Input }],
name: [{ type: Input }],
type: [{ type: Input }],
label: [{ type: Input }],
labelPosition: [{ type: Input }],
placeholder: [{ type: Input }],
pattern: [{ type: Input }],
maxlength: [{ type: Input }],
number: [{ type: Input }],
delay: [{ type: Input }],
inputElm: [{ type: ViewChild, args: ['asiInput',] }]
};
if (false) {
/**
* html id
* @type {?}
*/
AsiInputComponent.prototype.id;
/**
* html name
* @type {?}
*/
AsiInputComponent.prototype.name;
/**
* html input type
* @type {?}
*/
AsiInputComponent.prototype.type;
/**
* Label to display (is translated)
* @type {?}
*/
AsiInputComponent.prototype.label;
/**
* Label position
* @type {?}
*/
AsiInputComponent.prototype.labelPosition;
/**
* placeholder (is translated)
* @type {?}
*/
AsiInputComponent.prototype.placeholder;
/**
* Allow you to define a regex that the input must respect
* @type {?}
*/
AsiInputComponent.prototype.pattern;
/**
* Max length of the text
* @type {?}
*/
AsiInputComponent.prototype.maxlength;
/**
* Must be a number (internaly set the regex to ^-*[0-9,\.]*$
* @type {?}
*/
AsiInputComponent.prototype.number;
/**
* Delay before the component change value
* @type {?}
*/
AsiInputComponent.prototype.delay;
/** @type {?} */
AsiInputComponent.prototype.inputControl;
/** @type {?} */
AsiInputComponent.prototype.inputElm;
/** @type {?} */
AsiInputComponent.prototype.renderer;
/** @type {?} */
AsiInputComponent.prototype.elementRef;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNpLWlucHV0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0Bhc2ktbmd0b29scy9saWIvIiwic291cmNlcyI6WyJsaWIvY29tcG9uZW50cy9hc2ktaW5wdXQvYXNpLWlucHV0LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLDJCQUEyQixFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDekYsT0FBTyxFQUFFLGlCQUFpQixFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ2hFLE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLEtBQUssRUFBeUIsVUFBVSxFQUFFLFNBQVMsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEgsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzlDLE9BQU8sS0FBSyxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFjMUMsTUFBTSx3QkFBeUIsU0FBUSwyQkFBMkI7Ozs7O0lBaUNoRSxZQUFvQixRQUFtQixFQUM3QjtRQUNSLEtBQUssRUFBRSxDQUFDO1FBRlUsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQUM3QixlQUFVLEdBQVYsVUFBVTs7OztvQkEzQmlCLE1BQU07Ozs7NkJBS29ELEtBQUs7Ozs7MkJBRzdFLEVBQUU7Ozs7eUJBTUosQ0FBQyxDQUFDOzs7O3NCQUdMLEtBQUs7Ozs7cUJBR04sQ0FBQzs0QkFFSCxJQUFJLFdBQVcsRUFBRTtLQU8vQjs7OztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsUUFBUSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFBRSxRQUFRLEdBQUcsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBQ3JGLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDO1lBQ2hCLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxNQUFNLENBQUMsZUFBZSxD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QVUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEZWZhdWx0Q29udHJvbFZhbHVlQWNjZXNzb3IgfSBmcm9tICcuLy4uL2NvbW1vbi9kZWZhdWx0LWNvbnRyb2wtdmFsdWUtYWNjZXNzb3InO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IsIEZvcm1Db250cm9sIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBmb3J3YXJkUmVmLCBJbnB1dCwgT25Jbml0LCBBZnRlclZpZXdJbml0LCBFbGVtZW50UmVmLCBWaWV3Q2hpbGQsIFJlbmRlcmVyMiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgZGVib3VuY2VUaW1lIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xuaW1wb3J0ICogYXMgbmggZnJvbSAnLi4vLi4vbmF0aXZlLWhlbHBlcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FzaS1pbnB1dCcsXG4gIGhvc3Q6IHsgJ2NsYXNzJzogJ2FzaS1jb21wb25lbnQgYXNpLWlucHV0JyB9LFxuICB0ZW1wbGF0ZVVybDogJ2FzaS1pbnB1dC5jb21wb25lbnQuaHRtbCcsXG4gIHByb3ZpZGVyczogW1xuICAgIHtcbiAgICAgIHByb3ZpZGU6IE5HX1ZBTFVFX0FDQ0VTU09SLFxuICAgICAgdXNlRXhpc3Rpbmc6IGZvcndhcmRSZWYoKCkgPT4gQXNpSW5wdXRDb21wb25lbnQpLFxuICAgICAgbXVsdGk6IHRydWVcbiAgICB9XG4gIF1cbn0pXG5leHBvcnQgY2xhc3MgQXNpSW5wdXRDb21wb25lbnQgZXh0ZW5kcyBEZWZhdWx0Q29udHJvbFZhbHVlQWNjZXNzb3IgaW1wbGVtZW50cyBPbkluaXQsIEFmdGVyVmlld0luaXQge1xuXG4gIC8qKiBodG1sIGlkICovXG4gIEBJbnB1dCgpIGlkOiBzdHJpbmc7XG4gIC8qKiBodG1sIG5hbWUgKi9cbiAgQElucHV0KCkgbmFtZTogc3RyaW5nO1xuICAvKiogaHRtbCBpbnB1dCB0eXBlICovXG4gIEBJbnB1dCgpIHR5cGU6ICdwYXNzd29yZCcgfCAndGV4dCcgPSAndGV4dCc7XG5cbiAgLyoqIExhYmVsIHRvIGRpc3BsYXkgKGlzIHRyYW5zbGF0ZWQpKi9cbiAgQElucHV0KCkgbGFiZWw6IHN0cmluZztcbiAgLyoqIExhYmVsIHBvc2l0aW9uICovXG4gIEBJbnB1dCgpIGxhYmVsUG9zaXRpb246ICd0b3AnIHwgJ2xlZnQnIHwgJ3JpZ2h0JyB8ICdib3R0b20nIHwgJ2JvdHRvbS1jZW50ZXInIHwgJ3RvcC1jZW50ZXInID0gJ3RvcCc7XG5cbiAgLyoqIHBsYWNlaG9sZGVyIChpcyB0cmFuc2xhdGVkKSAqL1xuICBASW5wdXQoKSBwbGFjZWhvbGRlciA9ICcnO1xuXG4gIC8qKiBBbGxvdyB5b3UgdG8gZGVmaW5lIGEgcmVnZXggdGhhdCB0aGUgaW5wdXQgbXVzdCByZXNwZWN0ICovXG4gIEBJbnB1dCgpIHBhdHRlcm46IFJlZ0V4cDtcblxuICAvKiogTWF4IGxlbmd0aCBvZiB0aGUgdGV4dCAqL1xuICBASW5wdXQoKSBtYXhsZW5ndGggPSAtMTtcblxuICAvKiogTXVzdCBiZSBhIG51bWJlciAoaW50ZXJuYWx5IHNldCB0aGUgcmVnZXggdG8gXi0qWzAtOSxcXC5dKiQgKi9cbiAgQElucHV0KCkgbnVtYmVyID0gZmFsc2U7XG5cbiAgLyoqIERlbGF5IGJlZm9yZSB0aGUgY29tcG9uZW50IGNoYW5nZSB2YWx1ZSAqL1xuICBASW5wdXQoKSBkZWxheSA9IDA7XG5cbiAgaW5wdXRDb250cm9sID0gbmV3IEZvcm1Db250cm9sKCk7XG5cbiAgQFZpZXdDaGlsZCgnYXNpSW5wdXQnKSBpbnB1dEVsbTogRWxlbWVudFJlZjtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlbmRlcmVyOiBSZW5kZXJlcjIsXG4gICAgcHJpdmF0ZSBlbGVtZW50UmVmOiBFbGVtZW50UmVmKSB7XG4gICAgc3VwZXIoKTtcbiAgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMucmVuZGVyZXIuYWRkQ2xhc3ModGhpcy5lbGVtZW50UmVmLm5hdGl2ZUVsZW1lbnQsICdsYWJlbC0nICsgdGhpcy5sYWJlbFBvc2l0aW9uKTtcbiAgICBpZiAodGhpcy5udW1iZXIpIHtcbiAgICAgIHRoaXMucGF0dGVybiA9IG5ldyBSZWdFeHAoJ14tKlswLTksXFwuXSokJyk7XG4gICAgfVxuICB9XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMuaW5wdXRDb250cm9sLnZhbHVlQ2hhbmdlcy5waXBlKGRlYm91bmNlVGltZSh0aGlzLmRlbGF5KSkuc3Vic2NyaWJlKCh2YWx1ZTogc3RyaW5nKSA9PiB7XG4gICAgICBpZiAodmFsdWUgPT09ICcnKSB7XG4gICAgICAgIHRoaXMudmFsdWUgPSBudWxsO1xuICAgICAgfSBlbHNlIGlmICh0aGlzLmlzVmFsaWRlKHZhbHVlKSkge1xuICAgICAgICB0aGlzLnZhbHVlID0gdmFsdWU7XG4gICAgICB9IGVsc2UgaWYgKHRoaXMubWF4bGVuZ3RoICE9PSAtMSAmJiB2YWx1ZS5sZW5ndGggPiB0aGlzLm1heGxlbmd0aCkge1xuICAgICAgICAvLyBpZiB2YWx1ZSBpcyB0b28gbG9uZywgd2UgdHJ1bmNhdGVcbiAgICAgICAgdGhpcy52YWx1ZSA9IHZhbHVlLnN1YnN0cigwLCB0aGlzLm1heGxlbmd0aCk7XG4gICAgICB9XG4gICAgICB0aGlzLmlucHV0RWxtLm5hdGl2ZUVsZW1lbnQudmFsdWUgPSB0aGlzLl92YWx1ZTtcbiAgICB9KTtcbiAgfVxuXG4gIHByaXZhdGUgaXNWYWxpZGUodmFsdWU6IHN0cmluZyk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB2YWx1ZSA9PSBudWxsIHx8ICgodGhpcy5tYXhsZW5ndGggPT09IC0xIHx8IHZhbHVlLmxlbmd0aCA8PSB0aGlzLm1heGxlbmd0aClcbiAgICAgICYmICh0aGlzLnBhdHRlcm4gPT0gbnVsbCB8fCB0aGlzLnBhdHRlcm4udGVzdCh2YWx1ZSkpKVxuICB9XG5cbiAgd3JpdGVWYWx1ZSh2YWx1ZTogc3RyaW5nKSB7XG4gICAgaWYgKHRoaXMuaXNWYWxpZGUodmFsdWUpKSB7XG4gICAgICB0aGlzLmlucHV0Q29udHJvbC5zZXRWYWx1ZSh2YWx1ZSwgeyBlbWl0RXZlbnQ6IGZhbHNlIH0pO1xuICAgIH0gZWxzZSBpZiAodGhpcy5tYXhsZW5ndGggIT09IC0xICYmIHZhbHVlLmxlbmd0aCA+IHRoaXMubWF4bGVuZ3RoKSB7XG4gICAgICAvLyBMZW5ndGggaW5jb3JyZWN0IG9uIHRydW5jYXRlXG4gICAgICB0aGlzLmlucHV0Q29udHJvbC5zZXRWYWx1ZShuaC50cnVuY2F0ZSh2YWx1ZSwgdGhpcy5tYXhsZW5ndGgpLCB7IGVtaXRFdmVudDogZmFsc2UgfSk7XG4gICAgfSBlbHNlIHtcbiAgICAgIC8vIFBhdHRlcm4gaW5jb3JyZWN0XG4gICAgICB0aGlzLmlucHV0RWxtLm5hdGl2ZUVsZW1lbnQudmFsdWUgPSAnSW5jb3JyZWN0IHZhbHVlJztcbiAgICB9XG4gIH1cbn1cbiJdfQ==