var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import './InputStepper.scss';
import Button from '../Button';
import MinusIconSvg from '../Icons/MinusIconSvg';
import PlusIconSvg from '../Icons/PlusIconSvg';
import ClampedInput from '../ClampedInput';
var stopPropagation = function (event) { return event.stopPropagation(); };
var InputStepper = /** @class */ (function (_super) {
    __extends(InputStepper, _super);
    function InputStepper() {
        var _this = _super !== null && _super.apply(this, arguments) || this;
        _this.getDecrementLabel = function () {
            return _this.props.labelWhenRemoving && _this.props.value === 1 ?
                "Remove " + _this.props.labelWhenRemoving :
                "Decrement " + _this.props.label;
        };
        _this.getIncrementLabel = function () {
            return "Increment " + _this.props.label;
        };
        _this.setValue = function (value) {
            if (_this.props.min != null && value < _this.props.min) {
                return;
            }
            if (_this.props.max != null && value > _this.props.max) {
                return;
            }
            _this.props.onChange(value);
        };
        _this.handleDownClicked = function () {
            _this.setValue(_this.props.value - 1);
        };
        _this.handleValueChanged = function (event) {
            if (!event.target.value) {
                return;
            }
            var value = parseInt(event.target.value, 10);
            _this.setValue(value);
        };
        _this.handleUpClicked = function () {
            _this.setValue(_this.props.value + 1);
        };
        return _this;
    }
    InputStepper.prototype.render = function () {
        return (React.createElement("div", { className: [
                this.props.className,
                'input-stepper',
                this.props.isMini && 'input-stepper--mini',
                this.props.isVertical ? 'input-stepper--vertical' : 'input-stepper--horizontal',
            ]
                .filter(Boolean)
                .join(' ') },
            React.createElement(Button, { className: "input-stepper__down", onClick: this.handleDownClicked, onMouseDown: stopPropagation, title: this.getDecrementLabel() },
                React.createElement(MinusIconSvg, null)),
            React.createElement(ClampedInput, { className: "input-stepper__value", highlightOnFocus: true, id: this.props.inputId, min: 0, max: Number.POSITIVE_INFINITY, onChange: this.setValue, onMouseDown: stopPropagation, title: this.props.label, value: this.props.value }),
            React.createElement(Button, { className: "input-stepper__up", onClick: this.handleUpClicked, onMouseDown: stopPropagation, title: this.getIncrementLabel() },
                React.createElement(PlusIconSvg, null))));
    };
    InputStepper.propTypes = {
        className: PropTypes.string,
        inputId: PropTypes.string,
        isMini: PropTypes.bool,
        isVertical: PropTypes.bool,
        label: PropTypes.string,
        labelWhenRemoving: PropTypes.string,
        max: PropTypes.number,
        min: PropTypes.number,
        onChange: PropTypes.func.isRequired,
        value: PropTypes.number.isRequired,
    };
    InputStepper.defaultProps = {
        className: '',
        isMini: false,
        isVertical: false,
    };
    return InputStepper;
}(PureComponent));
export default InputStepper;
//# sourceMappingURL=InputStepper.js.map