import { __assign, __awaiter, __decorate, __extends, __generator } from "tslib";
import Cleave from 'cleave.js';
import Component from 'vue-class-component';
import { Model, Prop, Watch } from 'vue-property-decorator';
import { ModulVue } from '../../utils/vue/vue';
import WithRender from './input-mask.html';
/**
 * inspired from https://github.com/ankurk91/vue-cleave-component/blob/master/src/component.js
 */
var MInputMask = /** @class */ (function (_super) {
    __extends(MInputMask, _super);
    function MInputMask() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.internalModel = '';
        return _this;
    }
    MInputMask.prototype.mounted = function () {
        this.internalModel = this.value || '';
        this.cleave = new Cleave(this.$refs.input, this.getOptions());
        this.updateRawValue(this.value);
    };
    MInputMask.prototype.beforeDestroy = function () {
        this.cleave.destroy();
    };
    MInputMask.prototype.getOptions = function () {
        var _this = this;
        return __assign(__assign({}, this.options), { onValueChanged: (function (event) {
                var _value = _this.raw ? event.target.rawValue : event.target.value;
                // only emit if model is changed
                // when v-model is not masked (raw)
                if (_this.internalModel === _value) {
                    return;
                }
                else {
                    _this.internalModel = _value;
                    _this.$emit('input', _value);
                }
            }) });
    };
    MInputMask.prototype.focusAndSelectAll = function () {
        return __awaiter(this, void 0, void 0, function () {
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0: return [4 /*yield*/, this.$nextTick()];
                    case 1:
                        _a.sent();
                        this.$refs.input.focus();
                        this.$refs.input.setSelectionRange(0, this.$refs.input.value.length);
                        return [2 /*return*/];
                }
            });
        });
    };
    MInputMask.prototype.focus = function () {
        return __awaiter(this, void 0, void 0, function () {
            return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0: return [4 /*yield*/, this.$nextTick()];
                    case 1:
                        _a.sent();
                        this.$refs.input.focus();
                        return [2 /*return*/];
                }
            });
        });
    };
    MInputMask.prototype.optionsChanged = function (options) {
        this.cleave.destroy();
        this.cleave = new Cleave(this.$el, this.getOptions());
        this.updateRawValue(this.value);
    };
    MInputMask.prototype.inputValueChanged = function (inputValue) {
        // when v-model is not masked (raw)
        if (this.raw && inputValue === this.cleave.getRawValue()) {
            return;
        }
        //  when v-model is masked (NOT raw)
        if (!this.raw && inputValue === this.$refs.input.value) {
            return;
        }
        this.internalModel = this.value || '';
        this.updateRawValue(inputValue);
    };
    MInputMask.prototype.onFocus = function ($event) {
        this.$emit('focus', $event);
    };
    MInputMask.prototype.onBlur = function ($event) {
        this.updateRawValue();
        this.$emit('blur', $event);
    };
    MInputMask.prototype.onKeyup = function ($event) {
        this.$emit('keyup', $event);
    };
    MInputMask.prototype.onKeydownTextfield = function ($event) {
        var rawValue = this.cleave.getRawValue();
        if (($event.key === '.' || $event.key === ',') && !rawValue.endsWith('.')) {
            this.cleave.setRawValue(rawValue + ".");
        }
        this.$emit('keydown', $event);
    };
    // Hack pour android qui lève toujours le key code 229.
    MInputMask.prototype.onTextInput = function ($event) {
        var key = $event.data;
        var rawValue = this.cleave.getRawValue();
        if (key === '.' && !rawValue.endsWith('.')) {
            this.cleave.setRawValue(rawValue + ".");
        }
        this.$emit('keydown', $event);
    };
    MInputMask.prototype.onEnter = function ($event) {
        this.$emit('keydown.enter', $event);
    };
    MInputMask.prototype.onPasteTextfield = function ($event) {
        this.$emit('paste', $event);
    };
    MInputMask.prototype.onDropTextfield = function ($event) {
        this.$emit('drop', $event);
    };
    MInputMask.prototype.onChange = function ($event) {
        this.$emit('change', $event);
    };
    MInputMask.prototype.updateRawValue = function (rawValue) {
        if (rawValue === void 0) { rawValue = this.cleave.getRawValue(); }
        // See what happens with issue https://github.com/nosir/cleave.js/issues/463.
        // Remove this code if it's resolved.
        if (this.options.removeTrailingDecimalMark && this.options.numeral === true && rawValue[rawValue.length - 1] === '.') {
            this.cleave.setRawValue(rawValue.replace('.', ''));
        }
        else if (this.options.forceDecimalScale && this.options.numeral && rawValue.includes('.') && this.options.numeralDecimalScale) {
            var valueStringParts = rawValue.split('.');
            var integerPart = valueStringParts[0];
            var decimalPart = valueStringParts[1];
            this.cleave.setRawValue(integerPart + "." + decimalPart.padEnd(this.options.numeralDecimalScale, '0'));
        }
        else {
            this.cleave.setRawValue(rawValue);
        }
    };
    __decorate([
        Prop()
    ], MInputMask.prototype, "maxLength", void 0);
    __decorate([
        Prop(),
        Model('input')
    ], MInputMask.prototype, "value", void 0);
    __decorate([
        Prop({ default: true })
    ], MInputMask.prototype, "raw", void 0);
    __decorate([
        Prop()
    ], MInputMask.prototype, "options", void 0);
    __decorate([
        Watch('options', { deep: true })
    ], MInputMask.prototype, "optionsChanged", null);
    __decorate([
        Watch('value')
    ], MInputMask.prototype, "inputValueChanged", null);
    MInputMask = __decorate([
        WithRender,
        Component
    ], MInputMask);
    return MInputMask;
}(ModulVue));
export { MInputMask };
//# sourceMappingURL=input-mask.js.map