UNPKG

@justa/mask-directive

Version:

![](https://img.shields.io/bundlephobia/minzip/@justa/mask-directive.svg?style=flat-square) ![](https://img.shields.io/bundlephobia/min/@justa/mask-directive.svg?style=flat-square)

132 lines 8.56 kB
/** * @fileoverview added by tsickle * Generated from: lib/percentage-mask.directive.ts * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ import { Directive, forwardRef, Input, ElementRef, Renderer2, HostListener, } from '@angular/core'; import { NG_VALUE_ACCESSOR } from '@angular/forms'; import InputMask from 'inputmask'; export class PercentageMaskDirective { /** * @param {?} elementRef * @param {?} renderer */ constructor(elementRef, renderer) { this.elementRef = elementRef; this.renderer = renderer; this.percentSuffix = ' %'; this.mask = new InputMask({ alias: 'percentage', autoGroup: false, autoUnmask: true, radixPoint: ',', rightAlign: false, placeHolder: '0,00', numericInput: true, digits: 2, suffix: this.percentSuffix, }); } /** * @return {?} */ ngOnInit() { this.mask.mask(this.elementRef.nativeElement); } /** * @return {?} */ ngOnDestroy() { window.clearTimeout(this.rendererTimeout); } /** * @param {?} rawValue * @return {?} */ writeValue(rawValue) { /** @type {?} */ const value = parseFloat(rawValue) * 100; this.rendererTimeout = window.setTimeout((/** * @return {?} */ () => { this.renderer.setProperty(this.elementRef.nativeElement, 'value', value); }), 0); } /** * @param {?} onChange * @return {?} */ registerOnChange(onChange) { this.onChange = onChange; } /** * @param {?} onTouched * @return {?} */ registerOnTouched(onTouched) { this.onTouched = onTouched; } /** * @param {?} event * @return {?} */ onInputBlur(event) { /** @type {?} */ const value = parseFloat(event.target.value.replace(',', '.')) / 100; this.onChange(value); } } PercentageMaskDirective.decorators = [ { type: Directive, args: [{ selector: '[jstPercentageMask]', providers: [ { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ () => PercentageMaskDirective)), multi: true, }, ], },] } ]; /** @nocollapse */ PercentageMaskDirective.ctorParameters = () => [ { type: ElementRef }, { type: Renderer2 } ]; PercentageMaskDirective.propDecorators = { percentSuffix: [{ type: Input }], onInputBlur: [{ type: HostListener, args: ['blur', ['$event'],] }] }; if (false) { /** @type {?} */ PercentageMaskDirective.prototype.percentSuffix; /** @type {?} */ PercentageMaskDirective.prototype.onChange; /** @type {?} */ PercentageMaskDirective.prototype.onTouched; /** * @type {?} * @private */ PercentageMaskDirective.prototype.mask; /** * @type {?} * @private */ PercentageMaskDirective.prototype.rendererTimeout; /** * @type {?} * @private */ PercentageMaskDirective.prototype.elementRef; /** * @type {?} * @private */ PercentageMaskDirective.prototype.renderer; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGVyY2VudGFnZS1tYXNrLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BqdXN0YS9tYXNrLWRpcmVjdGl2ZS8iLCJzb3VyY2VzIjpbImxpYi9wZXJjZW50YWdlLW1hc2suZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUNMLFNBQVMsRUFDVCxVQUFVLEVBR1YsS0FBSyxFQUNMLFVBQVUsRUFDVixTQUFTLEVBQ1QsWUFBWSxHQUNiLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxpQkFBaUIsRUFBd0IsTUFBTSxnQkFBZ0IsQ0FBQztBQUN6RSxPQUFPLFNBQVMsTUFBTSxXQUFXLENBQUM7QUFZbEMsTUFBTSxPQUFPLHVCQUF1Qjs7Ozs7SUFVbEMsWUFBb0IsVUFBc0IsRUFBVSxRQUFtQjtRQUFuRCxlQUFVLEdBQVYsVUFBVSxDQUFZO1FBQVUsYUFBUSxHQUFSLFFBQVEsQ0FBVztRQVI5RCxrQkFBYSxHQUFHLElBQUksQ0FBQztRQVM1QixJQUFJLENBQUMsSUFBSSxHQUFHLElBQUksU0FBUyxDQUFDO1lBQ3hCLEtBQUssRUFBRSxZQUFZO1lBQ25CLFNBQVMsRUFBRSxLQUFLO1lBQ2hCLFVBQVUsRUFBRSxJQUFJO1lBQ2hCLFVBQVUsRUFBRSxHQUFHO1lBQ2YsVUFBVSxFQUFFLEtBQUs7WUFDakIsV0FBVyxFQUFFLE1BQU07WUFDbkIsWUFBWSxFQUFFLElBQUk7WUFDbEIsTUFBTSxFQUFFLENBQUM7WUFDVCxNQUFNLEVBQUUsSUFBSSxDQUFDLGFBQWE7U0FDM0IsQ0FBQyxDQUFDO0lBQ0wsQ0FBQzs7OztJQUVELFFBQVE7UUFDTixJQUFJLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsQ0FBQyxDQUFDO0lBQ2hELENBQUM7Ozs7SUFFRCxXQUFXO1FBQ1QsTUFBTSxDQUFDLFlBQVksQ0FBQyxJQUFJLENBQUMsZUFBZSxDQUFDLENBQUM7SUFDNUMsQ0FBQzs7Ozs7SUFFRCxVQUFVLENBQUMsUUFBYTs7Y0FDaEIsS0FBSyxHQUFHLFVBQVUsQ0FBQyxRQUFRLENBQUMsR0FBRyxHQUFHO1FBQ3hDLElBQUksQ0FBQyxlQUFlLEdBQUcsTUFBTSxDQUFDLFVBQVU7OztRQUFDLEdBQUcsRUFBRTtZQUM1QyxJQUFJLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLGFBQWEsRUFBRSxPQUFPLEVBQUUsS0FBSyxDQUFDLENBQUM7UUFDM0UsQ0FBQyxHQUFFLENBQUMsQ0FBQyxDQUFDO0lBQ1IsQ0FBQzs7Ozs7SUFFRCxnQkFBZ0IsQ0FBQyxRQUE4QjtRQUM3QyxJQUFJLENBQUMsUUFBUSxHQUFHLFFBQVEsQ0FBQztJQUMzQixDQUFDOzs7OztJQUVELGlCQUFpQixDQUFDLFNBQStCO1FBQy9DLElBQUksQ0FBQyxTQUFTLEdBQUcsU0FBUyxDQUFDO0lBQzdCLENBQUM7Ozs7O0lBR0QsV0FBVyxDQUFDLEtBQVU7O2NBQ2QsS0FBSyxHQUFHLFVBQVUsQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxPQUFPLENBQUMsR0FBRyxFQUFFLEdBQUcsQ0FBQyxDQUFDLEdBQUcsR0FBRztRQUNwRSxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3ZCLENBQUM7OztZQTdERixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLHFCQUFxQjtnQkFDL0IsU0FBUyxFQUFFO29CQUNUO3dCQUNFLE9BQU8sRUFBRSxpQkFBaUI7d0JBQzFCLFdBQVcsRUFBRSxVQUFVOzs7d0JBQUMsR0FBRyxFQUFFLENBQUMsdUJBQXVCLEVBQUM7d0JBQ3RELEtBQUssRUFBRSxJQUFJO3FCQUNaO2lCQUNGO2FBQ0Y7Ozs7WUFoQkMsVUFBVTtZQUNWLFNBQVM7Ozs0QkFrQlIsS0FBSzswQkE2Q0wsWUFBWSxTQUFDLE1BQU0sRUFBRSxDQUFDLFFBQVEsQ0FBQzs7OztJQTdDaEMsZ0RBQThCOztJQUU5QiwyQ0FBZ0M7O0lBQ2hDLDRDQUFpQzs7Ozs7SUFFakMsdUNBQWtCOzs7OztJQUNsQixrREFBaUM7Ozs7O0lBRXJCLDZDQUE4Qjs7Ozs7SUFBRSwyQ0FBMkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBEaXJlY3RpdmUsXG4gIGZvcndhcmRSZWYsXG4gIE9uSW5pdCxcbiAgT25EZXN0cm95LFxuICBJbnB1dCxcbiAgRWxlbWVudFJlZixcbiAgUmVuZGVyZXIyLFxuICBIb3N0TGlzdGVuZXIsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgTkdfVkFMVUVfQUNDRVNTT1IsIENvbnRyb2xWYWx1ZUFjY2Vzc29yIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IElucHV0TWFzayBmcm9tICdpbnB1dG1hc2snO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6ICdbanN0UGVyY2VudGFnZU1hc2tdJyxcbiAgcHJvdmlkZXJzOiBbXG4gICAge1xuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBQZXJjZW50YWdlTWFza0RpcmVjdGl2ZSksXG4gICAgICBtdWx0aTogdHJ1ZSxcbiAgICB9LFxuICBdLFxufSlcbmV4cG9ydCBjbGFzcyBQZXJjZW50YWdlTWFza0RpcmVjdGl2ZVxuICBpbXBsZW1lbnRzIE9uSW5pdCwgT25EZXN0cm95LCBDb250cm9sVmFsdWVBY2Nlc3NvciB7XG4gIEBJbnB1dCgpIHBlcmNlbnRTdWZmaXggPSAnICUnO1xuXG4gIG9uQ2hhbmdlPzogKGV2ZW50OiBhbnkpID0+IHZvaWQ7XG4gIG9uVG91Y2hlZD86IChldmVudDogYW55KSA9PiB2b2lkO1xuXG4gIHByaXZhdGUgbWFzazogYW55O1xuICBwcml2YXRlIHJlbmRlcmVyVGltZW91dD86IG51bWJlcjtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsZW1lbnRSZWY6IEVsZW1lbnRSZWYsIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMikge1xuICAgIHRoaXMubWFzayA9IG5ldyBJbnB1dE1hc2soe1xuICAgICAgYWxpYXM6ICdwZXJjZW50YWdlJyxcbiAgICAgIGF1dG9Hcm91cDogZmFsc2UsXG4gICAgICBhdXRvVW5tYXNrOiB0cnVlLFxuICAgICAgcmFkaXhQb2ludDogJywnLFxuICAgICAgcmlnaHRBbGlnbjogZmFsc2UsXG4gICAgICBwbGFjZUhvbGRlcjogJzAsMDAnLFxuICAgICAgbnVtZXJpY0lucHV0OiB0cnVlLFxuICAgICAgZGlnaXRzOiAyLFxuICAgICAgc3VmZml4OiB0aGlzLnBlcmNlbnRTdWZmaXgsXG4gICAgfSk7XG4gIH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLm1hc2subWFzayh0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudCk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpIHtcbiAgICB3aW5kb3cuY2xlYXJUaW1lb3V0KHRoaXMucmVuZGVyZXJUaW1lb3V0KTtcbiAgfVxuXG4gIHdyaXRlVmFsdWUocmF3VmFsdWU6IGFueSk6IHZvaWQge1xuICAgIGNvbnN0IHZhbHVlID0gcGFyc2VGbG9hdChyYXdWYWx1ZSkgKiAxMDA7XG4gICAgdGhpcy5yZW5kZXJlclRpbWVvdXQgPSB3aW5kb3cuc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICB0aGlzLnJlbmRlcmVyLnNldFByb3BlcnR5KHRoaXMuZWxlbWVudFJlZi5uYXRpdmVFbGVtZW50LCAndmFsdWUnLCB2YWx1ZSk7XG4gICAgfSwgMCk7XG4gIH1cblxuICByZWdpc3Rlck9uQ2hhbmdlKG9uQ2hhbmdlOiAoZXZlbnQ6IGFueSkgPT4gdm9pZCk6IHZvaWQge1xuICAgIHRoaXMub25DaGFuZ2UgPSBvbkNoYW5nZTtcbiAgfVxuXG4gIHJlZ2lzdGVyT25Ub3VjaGVkKG9uVG91Y2hlZDogKGV2ZW50OiBhbnkpID0+IHZvaWQpOiB2b2lkIHtcbiAgICB0aGlzLm9uVG91Y2hlZCA9IG9uVG91Y2hlZDtcbiAgfVxuXG4gIEBIb3N0TGlzdGVuZXIoJ2JsdXInLCBbJyRldmVudCddKVxuICBvbklucHV0Qmx1cihldmVudDogYW55KTogdm9pZCB7XG4gICAgY29uc3QgdmFsdWUgPSBwYXJzZUZsb2F0KGV2ZW50LnRhcmdldC52YWx1ZS5yZXBsYWNlKCcsJywgJy4nKSkgLyAxMDA7XG4gICAgdGhpcy5vbkNoYW5nZSh2YWx1ZSk7XG4gIH1cbn1cbiJdfQ==