Describe the bug

When using an input of type number, adding validation rules isMaxNumber or isMinNumber won't trigger validation error when the value is not a number.

Code

const MyField = (props) => {
  const { value, setValue, isValid, errorMessage } = useField(props);

  const handleChange = (e) => {
    setValue(e.target.value);
  };
  return (
    <>
      <input type="number" value={value} onChange={handleChange} />
      {!isValid && { errorMessage }}
    </>
  );
};

const Demo = () => {
  const form = useForm();
  return (
    <Formiz autoForm connect={form} onValidSubmit={console.log}>
      <MyField
        name="number"
        validations={[
          { rule: isMinNumber(0), message: 'Too low' },
          { rule: isMaxNumber(100), message: 'Too high' },
        ]}
      />
      <button onClick={() => form.submit}>Submit</button>
    </Formiz>
  );
};

Expected behavior

A validation error should trigger when not number values are used in the field.

Version

• OS: Linux
• Browser: Mozilla Firefox 90.0

Additional context

• The bug won't happen in Chrome because inputs of type number are controlled by the browser to prevent bad values in the field.
• In Firefox, the values are controlled when submitted. If the value of the field is not a number, the validation will pass, but the value returned by the form will be null.
• In Firefox, if the value is a valid number, but too high or too low, the validation will trigger.