import React, { useEffect, useState, useContext } from 'react';
import classNames from 'classnames';
import { ConfigContext } from '../config-provider/config-context';
import { getPrefixCls } from '../_utils/general';
import { ArrowDown } from '../_utils/components';
var isValid = function (val) {
    return !isNaN(+val);
};
var InputNumber = function (props) {
    var _a;
    var _b = props.size, size = _b === void 0 ? 'md' : _b, _c = props.disabled, disabled = _c === void 0 ? false : _c, _d = props.defaultValue, defaultValue = _d === void 0 ? 0 : _d, _e = props.step, step = _e === void 0 ? 1 : _e, _f = props.controls, controls = _f === void 0 ? false : _f, _g = props.min, min = _g === void 0 ? Number.NEGATIVE_INFINITY : _g, _h = props.max, max = _h === void 0 ? Number.POSITIVE_INFINITY : _h, onChange = props.onChange, className = props.className, customisedCls = props.prefixCls, style = props.style;
    var configContext = useContext(ConfigContext);
    var prefixCls = getPrefixCls('input-number', configContext.prefixCls, customisedCls);
    var inputSize = props.size || configContext.componentSize || size;
    var cls = classNames(prefixCls, className, prefixCls + "_" + inputSize, (_a = {},
        _a[prefixCls + "_disabled"] = disabled,
        _a[prefixCls + "_always-controls"] = controls,
        _a));
    var _j = useState('value' in props ? props.value : defaultValue), value = _j[0], setValue = _j[1];
    var inputOnChange = function (e) {
        var val = Number(e.target.value.trim());
        !('value' in props) && setValue(val);
        onChange && isValid(val) && onChange(val, e);
    };
    var plusOnClick = function (e) {
        e.stopPropagation();
        if (!disabled && isValid(step)) {
            var val = +value + +step;
            if (val <= max) {
                !('value' in props) && setValue(val);
                onChange && onChange(val, e);
            }
        }
    };
    var minusOnClick = function (e) {
        e.stopPropagation();
        if (!disabled && isValid(step)) {
            var val = +value - +step;
            if (val >= min) {
                !('value' in props) && setValue(val);
                onChange && onChange(val, e);
            }
        }
    };
    useEffect(function () {
        'value' in props && setValue(props.value);
    }, [props]);
    return (React.createElement("div", { className: cls, style: style },
        React.createElement("input", { autoComplete: "off", disabled: disabled, value: value, type: "number", className: prefixCls + "__input", max: max, min: min, step: step, onChange: inputOnChange, "aria-valuenow": value, "aria-valuemax": max, "aria-valuemin": min, "aria-disabled": disabled }),
        React.createElement("div", { className: prefixCls + "__controls" },
            React.createElement("span", { className: prefixCls + "__up", onClick: plusOnClick },
                React.createElement(ArrowDown, { size: 8, className: prefixCls + "__icon " + prefixCls + "__icon_reverse" })),
            React.createElement("span", { className: prefixCls + "__down", onClick: minusOnClick },
                React.createElement(ArrowDown, { size: 8, className: prefixCls + "__icon" })))));
};
export default InputNumber;
//# sourceMappingURL=index.js.map