"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ValidateInput = exports.VALIDATE_TYPE = void 0;
const tslib_1 = require("tslib");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const react_1 = tslib_1.__importDefault(require("react"));
const Input_1 = require("./Input");
require("./validate-input.less");
var VALIDATE_TYPE;
(function (VALIDATE_TYPE) {
    VALIDATE_TYPE[VALIDATE_TYPE["INFO"] = 1] = "INFO";
    VALIDATE_TYPE[VALIDATE_TYPE["ERROR"] = 2] = "ERROR";
    VALIDATE_TYPE[VALIDATE_TYPE["WARNING"] = 3] = "WARNING";
    VALIDATE_TYPE[VALIDATE_TYPE["IGNORE"] = 4] = "IGNORE";
})(VALIDATE_TYPE = exports.VALIDATE_TYPE || (exports.VALIDATE_TYPE = {}));
exports.ValidateInput = react_1.default.forwardRef((_a, ref) => {
    var { type, className, validate, onChange, onValueChange, validateMessage: validateInfo, popup = true } = _a, restProps = tslib_1.__rest(_a, ["type", "className", "validate", "onChange", "onValueChange", "validateMessage", "popup"]);
    const [validateMessage, setValidateMessage] = react_1.default.useState();
    react_1.default.useEffect(() => {
        setValidateMessage(validateInfo);
    }, [validateInfo]);
    const validateClx = (0, classnames_1.default)({
        'validate-error': validateMessage && validateMessage.type === VALIDATE_TYPE.ERROR,
        'validate-warning': validateMessage && validateMessage.type === VALIDATE_TYPE.WARNING,
        'validate-info': validateMessage && validateMessage.type === VALIDATE_TYPE.INFO,
    });
    const renderValidateMessage = () => {
        if (validateMessage && validateMessage.message) {
            return react_1.default.createElement("div", { className: (0, classnames_1.default)('validate-message', validateClx, { popup }) }, validateMessage.message);
        }
    };
    const handleChange = (event) => {
        const input = event.target;
        let value;
        if (input.type === 'number') {
            value = event.target.valueAsNumber;
        }
        else {
            value = event.target.value;
        }
        if (typeof validate === 'function') {
            let message;
            if (type === 'number') {
                if (/^[0-9]+$/.test(value)) {
                    message = validate(Number(value));
                }
                else {
                    message = validate(String(value));
                }
            }
            else {
                message = validate(value);
            }
            setValidateMessage(message);
        }
        if (typeof onChange === 'function') {
            onChange(event);
        }
        if (typeof onValueChange === 'function') {
            onValueChange(value);
        }
    };
    return (react_1.default.createElement("div", { className: (0, classnames_1.default)('input-box', { popup }) },
        react_1.default.createElement(Input_1.Input, Object.assign({ type: type, ref: ref, className: (0, classnames_1.default)(className, validateMessage, validateClx), onChange: handleChange }, restProps)),
        renderValidateMessage()));
});
exports.ValidateInput.displayName = 'ValidateInput';
//# sourceMappingURL=ValidateInput.js.map