"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
class NumberInput {
    onCreate() {
        this.state = {
            value: 0,
            min: 0,
            max: Infinity,
        };
    }
    onMount() {
        var _a;
        this.textbox = (_a = this.getComponent("input")) === null || _a === void 0 ? void 0 : _a.getEl("input");
    }
    onInput(input) {
        var _a;
        const defaultMin = input.a11yDeleteText ? 1 : 0;
        this.state.min = input.min
            ? parseInt(input.min.toString(), 10)
            : defaultMin;
        this.state.max = input.max
            ? parseInt(input.max.toString(), 10)
            : Infinity;
        const value = (_a = input.value) !== null && _a !== void 0 ? _a : defaultMin;
        this.state.value =
            typeof value !== "number" ? parseInt(value.toString(), 10) : value;
    }
    checkBoundary(value, inc = 0) {
        const defaultMin = this.input.a11yDeleteText ? 1 : 0;
        let newValue = parseInt(value, 10) + inc;
        if (isNaN(newValue)) {
            newValue = defaultMin;
        }
        else if (newValue > this.state.max) {
            newValue = this.state.max;
        }
        else if (newValue < this.state.min) {
            newValue = this.state.min;
        }
        return newValue;
    }
    updateInputValue(event) {
        const value = this.checkBoundary(this.textbox.value, 0);
        this.state.value = value;
        // Update the input field's value to reflect the bounded value
        this.textbox.value = value.toString();
        this.emit("input-change", {
            originalEvent: event.originalEvent,
            value,
        });
        this.emit("change", { originalEvent: event.originalEvent, value });
    }
    updateInputValueChange(event) {
        const value = this.checkBoundary(this.textbox.value, 0);
        this.state.value = value;
        // Update the input field's value to reflect the bounded value
        this.textbox.value = value.toString();
        this.emit("change", { originalEvent: event.originalEvent, value });
    }
    handleAnimation(action) {
        // Normally we dont want to use dom manipulation for removing or adding classes,
        // but for this animation to work we need to trigger a reflow.
        const el = this.el;
        el.classList.remove(`number-input--increment`);
        el.classList.remove(`number-input--decrement`);
        el.classList.remove(`number-input--increment-disabled`);
        el.classList.remove(`number-input--decrement-disabled`);
        // Trigger a reflow to ensure the animation starts
        void el.offsetWidth;
        // Add the class for the animation
        el.classList.add(`number-input--${action}`);
    }
    handleIncrement(event) {
        const value = this.checkBoundary(this.textbox.value, 1);
        this.handleAnimation(value >= this.state.max ? "increment-disabled" : "increment");
        this.state.value = value;
        // Update the input field's value to reflect the bounded value
        this.textbox.value = value.toString();
        this.emit("increment", { originalEvent: event.originalEvent, value });
        this.emit("change", { originalEvent: event.originalEvent, value });
    }
    handleDecrement(event) {
        const value = this.checkBoundary(this.textbox.value, -1);
        this.handleAnimation(value <= this.state.min ? "decrement-disabled" : "decrement");
        this.state.value = value;
        // Update the input field's value to reflect the bounded value
        this.textbox.value = value.toString();
        this.emit("decrement", { originalEvent: event.originalEvent, value });
        this.emit("change", { originalEvent: event.originalEvent, value });
    }
}
module.exports = NumberInput;
