номер типа ввода с использованием минимального и максимального диапазона ошибок

Question

Я сделал генератор для случайного числа в диапазоне от минимального до максимального числа. Теперь, похоже, есть какая-то ошибка, которую я не могу определить, в моем ли это коде или во входном типе. Скажем, max = 99 и min = 11. Если я использую стрелки, чтобы минимальное значение было введено go ниже 10 (делая его одним числом di git), его значение увеличится до 15 (значение max), и если я попытайтесь использовать стрелки, чтобы сделать максимальное значение от go до 100 (делая его трехкратным числом git), оно будет прыгать до 11 (значение min). Что здесь происходит?

Приложение. js:

class Generator extends React.Component {
    constructor (props) {
        super(props)
        this.state = { 
        onView: '0',
        minNum: 0 ,
        maxNum: 100
      } 
    }

    btnClick = () => {
      const { minNum, maxNum } = this.state;
      const min = Math.ceil(minNum);
      const max = Math.floor(maxNum);
      const x = Math.floor(Math.random() * (max - min + 1)) + min;
      return this.setState({ onView : x });
    }

    minRangeInputChange = (event) => {
      const { minNum, maxNum } = this.state;
       if (event.target.value > maxNum) {
        this.setState({ minNum: maxNum });
       } else {
        this.setState({ minNum: event.target.value });
      }
      return console.log(minNum);
    }

    maxRangeInputChange = (event) => {
      const { minNum, maxNum } = this.state;
       if (event.target.value < minNum) {
        this.setState({ maxNum: minNum});
      } else {
        this.setState({ maxNum: event.target.value })
      }
      return console.log(maxNum);
    }

  render() {

  return (
    <div className="container">
    <Instructions />
    <Range 
      max={this.state.maxNum} 
      min={this.state.minNum} 
      minChange={this.minRangeInputChange}
      maxChange={this.maxRangeInputChange}
      />
    <Generate currentClick={this.btnClick}/>
    <View show={this.state.onView}/>
    </div>
    );
  }
}

export default Generator;

Компонент диапазона:

class Range extends React.Component {
    constructor(props) {
        super(props)
        }
        render() {
    return (
        <div className="range">
            <h3>Minimum</h3>
                <input 
                type="number" 
                min="0"
                max="99999999999999999999"
                value={this.props.min} 
                onChange={this.props.minChange} 
                required/>
            <h3>Maximum</h3>
                <input 
                type="number" 
                min="1"
                max="99999999999999999999"
                value={this.props.max}
                onChange={this.props.maxChange}
                required/>
        </div>
        )
    }
}


export default Range;