nohomey / material-ui-number-input Goto Github PK

With React 15.5+

warning.js:36 Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

More on this on the official React documentation page

The culprit is this line here.

There have been several bugs introduced with 5.0.13 and 5.0.12 releases:

Both 5.0.12 5.0.13 and tried to fix a bug where onError, onValid and onRequestValue are not called when either of there props: min, max, required and strategy changes. But instead they just introduced more bugs which let to onError to not be called on time and old props to be used.

The fix of these bugs is to change all methods that reference this.props to accept props: NumberInputProps argument passed to them which means that those methods that don't reference this other than for props should be made static.

If you have a completely blank field with strategy set to ignore, the hint text is shown. Then, type a letter. The hint text is gone, yet there is still nothing in the box.

Hi,

I dont know why the input started to fail. Out log:

Uncaught TypeError: value.match is not a function
    at Function.NumberInput.validateValue (NumberInput.js:103)

When I check the "value" variable is a number not a string.

Any ideas?

Thanks in advance!

This looks very promising and I'm happy to have found it. I completely agree a user expects an input type of number, however when I have tried this, and inspected it, it shows it as being of type="text". I see this how it's set in NumberInput.js as well.

I also tried your demo from my phone, where I'd expect the input to bring up a number pad and it does not. Perhaps I've done something wrong. Please let me know if I'm missing something here.

Thanks and regards

Hey!

If I set the strategy to 'ignore' and min to 20 on https://nohomey.github.io/material-ui-number-input/ and write in the NumberInput the number 10 it doesn't reset to 20. It only works if I write 0 in the NumberInput.

Another issue I noticed is that if I set the min to -20 on 'ignore' the NumberInput still doesn't allow the minus key in the input.

I have the same issues locally.

Please could this control be upgraded to use material-ui 1.0 now that it has been released

When I install this package he is empty. Why?

material-ui-number-input specifies a dependency on material-ui of ^0.17.x which effectively locks the dependency to the older 0.17.* versions of material-ui, and in turn locks any application that uses number-input.

If that in not intentional, and versions 0.18.* are compatible, the dependency could be specified as >0.17.1 instead.

Hi, I'm getting the following errors when calling <NumberInput> within a stateless component.

const X = () => (
  <NumberInput ...>
);

Warning: Stateless function components cannot be given refs. Attempts to access this ref will fail.
Check the render method of `NumberInput`.

Uncaught TypeError: Cannot read property 'getInputNode' of undefined

Is this correct? I think the package should work with stateless components.

Test:

• strategies
• handlers
• validation props

Using [email protected], [email protected], material-ui@^0.18.3, @ types/material-ui@^0.17.11.

Stacktrace:

(99,21): error TS2605: JSX element type 'NumberInput' is not a constructor function for JSX elements.
  Types of property 'setState' are incompatible.
    Type '{ <K extends never>(f: (prevState: void, props: NumberInputProps) => Pick<void, K>, callback?: ()...' is not assignable to type '{ <K extends never>(f: (prevState: {}, props: any) => Pick<{}, K>, callback?: () => any): void; <...'.
      Types of parameters 'f' and 'f' are incompatible.
        Type '(prevState: {}, props: any) => Pick<{}, any>' is not assignable to type '(prevState: void, props: NumberInputProps) => Pick<void, any>'.
          Types of parameters 'prevState' and 'prevState' are incompatible.
            Type 'void' is not assignable to type '{}'.

How I used it:

<NumberInput
    required
    hintText="Rate ($/hour)"
    floatingLabelText="Rate ($/hour)"
    strategy="warn"
    min={0}
    errorText={this.state.rateError}
    fullWidth
    value={this.state.rate}
    onChange={(e: React.FormEvent<HTMLInputElement>, value: string) => this.setState({ rate: value })}
    onValid={valid => this.setState({ validRate: valid })}
    onRequestValue={value => this.setState({ rate: value })}
    onError={this.onError}
/>

I believe this happened on upgrade from @ types/material-ui@^0.17.10 to @ types/material-ui@^0.17.11.

Love the component!

I thought with this being a NumberInput, that the onChange event would return a valid number rather than a string value?

Is this something in the pipeline?