@justa/mask-directive/fesm2015/justa-mask-directive.js

 

import { Directive, ElementRef, Input, HostListener, Renderer2, forwardRef, NgModule } from '@angular/core';
import InputMask from 'inputmask';
import { NgControl, NG_VALUE_ACCESSOR } from '@angular/forms';

/**
 * @fileoverview added by tsickle
 * Generated from: lib/money-mask.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * @deprecated Use `jstCurrencyMask` instead.
 */
class MoneyMaskDirective {
    /**
     * @param {?} elementRef
     */
    constructor(elementRef) {
        this.elementRef = elementRef;
        // Ref to the element in the DOM
        this.hasDecimal = false; // Input to set decimals to inputmask obj
        // Input to set decimals to inputmask obj
        this.hasPrefix = false; // Prefix to insert to the inputmask obj
        // Prefix to insert to the inputmask obj
        this.prefixSymbol = 'R$ '; // prefix symbol to the inputmask
        // prefix symbol to the inputmask
        this.imObject = {
            alias: 'currency',
            autoGroup: true,
            groupSeparator: '.',
            radixPoint: ',',
            rightAlign: false,
            prefix: 'R$ ',
        };
        // Attach the local variable to the element in the DOM
        this.el = this.elementRef.nativeElement;
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        // verify if has prefix. Eg.: R$
        if (this.hasPrefix && this.prefixSymbol) {
            this.imObject['prefix'] = this.prefixSymbol;
        }
        // Verify if has decimal numbers
        if (this.hasDecimal) {
            this.imObject['numericInput'] = true;
        }
        this.im = new InputMask(this.imObject);
        this.im.mask(this.el);
    }
    /**
     * @param {?} event
     * @return {?}
     */
    onKeyPress(event) {
        console.log(event);
        if (!this.restrictNumeric(event)) {
            event.preventDefault;
        }
    }
    /**
     * @param {?} e
     * @return {?}
     */
    onPaste(e) {
        this.onInputChange(e);
    }
    /**
     * @param {?} e
     * @return {?}
     */
    onChange(e) {
        this.onInputChange(e);
    }
    /**
     * @param {?} e
     * @return {?}
     */
    onInput(e) {
        this.onInputChange(e);
    }
    /**
     * @param {?} event
     * @return {?}
     */
    onInputChange(event) {
        /** @type {?} */
        const eventValue = event;
        /** @type {?} */
        const newVal = typeof event === 'string' && (eventValue.includes('R$') || eventValue.includes('.'))
            ? eventValue.replace(/\D/gi, '')
            : eventValue;
    }
    /**
     * @param {?} e
     * @return {?}
     */
    restrictNumeric(e) {
        /** @type {?} */
        let input;
        if (e.metaKey || e.ctrlKey) {
            return true;
        }
        if (e.which === 32) {
            return false;
        }
        if (e.which === 0) {
            return true;
        }
        if (e.which < 33) {
            return true;
        }
        input = String.fromCharCode(e.which);
        return !!/[\d\s]/.test(input);
    }
}
MoneyMaskDirective.decorators = [
    { type: Directive, args: [{
                selector: '[jstMoneyMask]',
            },] }
];
/** @nocollapse */
MoneyMaskDirective.ctorParameters = () => [
    { type: ElementRef }
];
MoneyMaskDirective.propDecorators = {
    hasDecimal: [{ type: Input }],
    hasPrefix: [{ type: Input }],
    prefixSymbol: [{ type: Input }],
    onKeyPress: [{ type: HostListener, args: ['keypress', ['$event'],] }],
    onPaste: [{ type: HostListener, args: ['paste', ['$event'],] }],
    onChange: [{ type: HostListener, args: ['change', ['$event'],] }],
    onInput: [{ type: HostListener, args: ['input', ['$event'],] }]
};
if (false) {
    /**
     * @type {?}
     * @private
     */
    MoneyMaskDirective.prototype.im;
    /**
     * @type {?}
     * @private
     */
    MoneyMaskDirective.prototype.el;
    /** @type {?} */
    MoneyMaskDirective.prototype.hasDecimal;
    /** @type {?} */
    MoneyMaskDirective.prototype.hasPrefix;
    /** @type {?} */
    MoneyMaskDirective.prototype.prefixSymbol;
    /**
     * @type {?}
     * @private
     */
    MoneyMaskDirective.prototype.imObject;
    /**
     * @type {?}
     * @private
     */
    MoneyMaskDirective.prototype.elementRef;
}

/**
 * @fileoverview added by tsickle
 * Generated from: lib/utils/index.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const CPF_REGEX = new RegExp(/(?!(\d)\1{2}.\1{3}.\1{3}-\1{2})\d{3}\.\d{3}\.\d{3}\-\d{2}/gm);
/** @type {?} */
const CNPJ_REGEX = new RegExp(/^\d{2}.\d{3}.\d{3}\/\d{4}-\d{2}$/g);
// CPF Utils (length dot indexes and hyphen index)
/** @type {?} */
const CPF_LENGTH = 11;
/** @type {?} */
const CPF_DOT_INDEXES = [2, 5];
/** @type {?} */
const CPF_HYPHEN_INDEX = [8];
// CNPJ Utils
/** @type {?} */
const CNPJ_LENGTH = 14;
/** @type {?} */
const CNPJ_DOT_INDEXES = [1, 4];
/** @type {?} */
const CNPJ_SLASH_INDEXES = [7];
/** @type {?} */
const CNPJ_HYPHEN_INDEX = [11];
/**
 * \@description Returns a Brazilian CPF formated
 * @type {?}
 */
const formatCpf = (/**
 * @param {?} cpf
 * @return {?}
 */
(cpf) => {
    /** @type {?} */
    const cpfFormated = removeAllSpecialChar(cpf);
    return cpfFormated
        .slice(0, CPF_LENGTH)
        .split('')
        .reduce((/**
     * @param {?} acc
     * @param {?} cpf
     * @param {?} index
     * @return {?}
     */
    (acc, cpf, index) => {
        /** @type {?} */
        const result = `${acc}${cpf}`;
        if (!isLastChar(index, cpfFormated)) {
            if (CPF_DOT_INDEXES.indexOf(index) >= 0)
                return `${result}.`;
            if (CPF_HYPHEN_INDEX.indexOf(index) >= 0)
                return `${result}-`;
        }
        return result;
    }), '');
})
/**
 * @description Returns a Brazilian CNPJ formated
 */
;
/**
 * \@description Returns a Brazilian CNPJ formated
 * @type {?}
 */
const formatCnpj = (/**
 * @param {?} cnpj
 * @return {?}
 */
(cnpj) => {
    /** @type {?} */
    const digits = removeAllSpecialChar(cnpj);
    return digits
        .slice(0, CNPJ_LENGTH)
        .split('')
        .reduce((/**
     * @param {?} acc
     * @param {?} digit
     * @param {?} index
     * @return {?}
     */
    (acc, digit, index) => {
        /** @type {?} */
        const result = `${acc}${digit}`;
        if (!isLastChar(index, digits)) {
            if (CNPJ_DOT_INDEXES.includes(index))
                return `${result}.`;
            if (CNPJ_SLASH_INDEXES.includes(index))
                return `${result}/`;
            if (CNPJ_HYPHEN_INDEX.includes(index))
                return `${result}-`;
        }
        return result;
    }), '');
});
/** @type {?} */
const removeAllSpecialChar = (/**
 * @param {?} input
 * @return {?}
 */
(input) => {
    return String(input).replace(/[^\d]/g, '');
});
const ɵ0 = removeAllSpecialChar;
/** @type {?} */
const isLastChar = (/**
 * @param {?} index
 * @param {?} input
 * @return {?}
 */
(index, input) => {
    return index === input.length - 1;
});
const ɵ1 = isLastChar;

/**
 * @fileoverview added by tsickle
 * Generated from: lib/legal-document-mask.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class LegalDocumentMaskDirective {
    /**
     * @param {?} el
     * @param {?} renderer
     * @param {?} _control
     */
    constructor(el, renderer, _control) {
        this.el = el;
        this.renderer = renderer;
        this._control = _control;
        this.onChange = (/**
         * @param {?} value
         * @return {?}
         */
        (value) => { });
        this.onTouched = (/**
         * @return {?}
         */
        () => { });
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        /** @type {?} */
        const unformattedValue = this.el.nativeElement.value;
        if (unformattedValue && unformattedValue.length > 0) {
            /** @type {?} */
            const value = this.returnValue(unformattedValue);
            this.writeValue(value);
        }
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        clearTimeout(this.writeTimeout);
    }
    /**
     * @return {?}
     */
    get control() {
        return this._control.control;
    }
    /**
     * @param {?} event
     * @return {?}
     */
    inputKeyup(event) {
        /** @type {?} */
        const value = this.returnValue(event.target.value);
        this.writeValue(value);
        event.target.value = value;
    }
    /**
     * @deprecated This method for Ionic inputs will be deprecated in the next
     * minor version.
     * @param {?} event
     * @return {?}
     */
    inputOnblur(event) {
        /** @type {?} */
        const value = this.returnValue(event.value);
        this.writeValue(value);
        event.value = value;
        console.warn('This directive won\'t work more in Ionic into next minor version!');
    }
    /**
     * @deprecated This method for Ionic inputs will be deprecated in the next
     * minor version.
     * @param {?} event
     * @return {?}
     */
    inputFocus(event) {
        /** @type {?} */
        const value = this.returnValue(event.value);
        this.writeValue(value);
        event.value = value;
        console.warn('This directive won\'t work more in Ionic into next minor version!');
    }
    /**
     * @param {?} event
     * @return {?}
     */
    focusInput(event) {
        /** @type {?} */
        const value = this.returnValue(event.target.value);
        this.writeValue(value);
        event.target.value = value;
    }
    /**
     * @param {?} event
     * @return {?}
     */
    blurInput(event) {
        /** @type {?} */
        const value = this.returnValue(event.target.value);
        this.writeValue(value);
        event.target.value = value;
    }
    /**
     * @param {?} event
     * @return {?}
     */
    ngModelChangeInput(event) {
        /** @type {?} */
        const value = this.returnValue(event);
        this.writeValue(value);
    }
    /**
     * @param {?} value
     * @return {?}
     */
    writeValue(value) {
        this.writeTimeout = setTimeout((/**
         * @return {?}
         */
        () => {
            this.renderer.setProperty(this.el.nativeElement, 'value', value);
        }), 1);
    }
    /**
     * @param {?} fn
     * @return {?}
     */
    registerOnChange(fn) {
        this.onChange = fn;
    }
    /**
     * @param {?} fn
     * @return {?}
     */
    registerOnTouched(fn) {
        this.onChange = fn;
    }
    /**
     * @private
     * @param {?} value
     * @return {?}
     */
    writeValuePerson(value) {
        if (value.length <= 11) {
            return formatCpf(value);
        }
        return formatCnpj(value);
    }
    /**
     * @private
     * @param {?} value
     * @return {?}
     */
    returnValue(value) {
        /** @type {?} */
        const newVal = value ? value.replace(/\D/gi, '') : '';
        return this.writeValuePerson(newVal);
    }
}
LegalDocumentMaskDirective.decorators = [
    { type: Directive, args: [{
                selector: '[jstLegalDocumentMask]',
            },] }
];
/** @nocollapse */
LegalDocumentMaskDirective.ctorParameters = () => [
    { type: ElementRef },
    { type: Renderer2 },
    { type: NgControl }
];
LegalDocumentMaskDirective.propDecorators = {
    inputKeyup: [{ type: HostListener, args: ['keyup', ['$event'],] }],
    inputOnblur: [{ type: HostListener, args: ['ionBlur', ['$event'],] }],
    inputFocus: [{ type: HostListener, args: ['ionFocus', ['$event'],] }],
    focusInput: [{ type: HostListener, args: ['focus', ['$event'],] }],
    blurInput: [{ type: HostListener, args: ['blur', ['$event'],] }],
    ngModelChangeInput: [{ type: HostListener, args: ['ngModelChange', ['$event'],] }]
};
if (false) {
    /** @type {?} */
    LegalDocumentMaskDirective.prototype.onChange;
    /** @type {?} */
    LegalDocumentMaskDirective.prototype.onTouched;
    /** @type {?} */
    LegalDocumentMaskDirective.prototype.writeTimeout;
    /**
     * @type {?}
     * @private
     */
    LegalDocumentMaskDirective.prototype.el;
    /**
     * @type {?}
     * @private
     */
    LegalDocumentMaskDirective.prototype.renderer;
    /**
     * @type {?}
     * @private
     */
    LegalDocumentMaskDirective.prototype._control;
}

/**
 * @fileoverview added by tsickle
 * Generated from: lib/currency-mask.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class CurrencyMaskDirective {
    /**
     * @param {?} elementRef
     * @param {?} renderer
     */
    constructor(elementRef, renderer) {
        this.elementRef = elementRef;
        this.renderer = renderer;
        this.currencyMultiplier = 100;
        this.currencyPrefix = 'R$ ';
        this.masker = new InputMask({
            alias: 'currency',
            autoGroup: true,
            autoUnmask: true,
            groupSeparator: '.',
            radixPoint: ',',
            rightAlign: false,
            placeholder: '0,00',
            numericInput: true,
            prefix: this.currencyPrefix,
        });
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        this.masker.mask(this.elementRef.nativeElement);
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        window.clearTimeout(this.rendererTimeout);
    }
    /**
     * @param {?} rawValue
     * @return {?}
     */
    writeValue(rawValue) {
        /** @type {?} */
        const value = parseFloat(rawValue) / this.currencyMultiplier;
        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 {?} isDisabled
     * @return {?}
     */
    setDisabledState(isDisabled) {
        this.renderer.setProperty(this.elementRef.nativeElement, 'disabled', isDisabled);
    }
    /**
     * @param {?} event
     * @return {?}
     */
    onInputBlur(event) {
        // Inputmask não troca o separador de casas decimais
        /** @type {?} */
        const value = parseFloat(event.target.value.replace(',', '.')) *
            this.currencyMultiplier;
        this.onChange(value);
    }
}
CurrencyMaskDirective.decorators = [
    { type: Directive, args: [{
                selector: '[jstCurrencyMask]',
                providers: [
                    {
                        provide: NG_VALUE_ACCESSOR,
                        useExisting: forwardRef((/**
                         * @return {?}
                         */
                        () => CurrencyMaskDirective)),
                        multi: true,
                    },
                ],
            },] }
];
/** @nocollapse */
CurrencyMaskDirective.ctorParameters = () => [
    { type: ElementRef },
    { type: Renderer2 }
];
CurrencyMaskDirective.propDecorators = {
    currencyMultiplier: [{ type: Input }],
    currencyPrefix: [{ type: Input }],
    onInputBlur: [{ type: HostListener, args: ['blur', ['$event'],] }]
};
if (false) {
    /** @type {?} */
    CurrencyMaskDirective.prototype.currencyMultiplier;
    /** @type {?} */
    CurrencyMaskDirective.prototype.currencyPrefix;
    /** @type {?} */
    CurrencyMaskDirective.prototype.onChange;
    /** @type {?} */
    CurrencyMaskDirective.prototype.onTouched;
    /**
     * @type {?}
     * @private
     */
    CurrencyMaskDirective.prototype.rendererTimeout;
    /**
     * @type {?}
     * @private
     */
    CurrencyMaskDirective.prototype.masker;
    /**
     * @type {?}
     * @private
     */
    CurrencyMaskDirective.prototype.elementRef;
    /**
     * @type {?}
     * @private
     */
    CurrencyMaskDirective.prototype.renderer;
}

/**
 * @fileoverview added by tsickle
 * Generated from: lib/percentage-mask.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
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;
}

/**
 * @fileoverview added by tsickle
 * Generated from: lib/mask-directive.module.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const MASK_DIRECTIVES = [
    MoneyMaskDirective,
    LegalDocumentMaskDirective,
    CurrencyMaskDirective,
    PercentageMaskDirective,
];
class MaskDirectiveModule {
}
MaskDirectiveModule.decorators = [
    { type: NgModule, args: [{
                declarations: [...MASK_DIRECTIVES],
                imports: [],
                exports: [...MASK_DIRECTIVES],
            },] }
];

/**
 * @fileoverview added by tsickle
 * Generated from: public_api.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * Generated from: justa-mask-directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { MaskDirectiveModule, MoneyMaskDirective as ɵa, LegalDocumentMaskDirective as ɵb, CurrencyMaskDirective as ɵc, PercentageMaskDirective as ɵd };
//# sourceMappingURL=justa-mask-directive.js.map