Material-ui: [TextField] type=number missing min, max, step Typescript types

Does this work?

<TextField type="number" inputProps={{ min: "0", max: "10", step: "1" }} />

Yes that works. inputProps accepts an object with anything in it, though, so I'm effectively opting out of the type system by doing it this way.

Yes that works. inputProps accepts an object with anything in it, though, so I'm effectively opting out of the type system by doing it this way.

Good point, I've opened #9321 to fix the typing of inputProps.

inputProps is intended to allow for _anything goes_ on an InputComponent. This allows for open integration with external components, for which unfortunately we may not know or have types.

Example:

import * as MaskedInput from 'react-text-mask'

      <TextField
        InputProps={{
          inputComponent: MaskedInput,
        }}
        inputProps={{
          guide: false,
          mask,
          placeholderChar: '\u2000',
        }}
        type="tel"
        value={value}
      />

So the alternative to avoiding strongly typed inputProps in the same scenario (thanks @pelotom) is

import { InputProps as MuiInputProps } from 'material-ui/Input'

      <TextField
        InputProps={{
          inputComponent: (inputProps: MuiInputProps) => (
            <MaskedInput {...inputProps} guide={false} mask={mask} placeholderChar="\u2000" />
          ),
        }}
        type="tel"
        value={value}
      />

@pelotom is filing a new proposal/issue to revisit this API.

@rosskevin
MaskedInput is not defined,
mask is not defined
:(

This seems like an overly complicated workaround

It would be better to define these at the TextField level, so that validation can be performed without a bunch of repeated logic everywhere. I'd hate to have to extend TextField every time I want to use it for a number field with min/max/step requirements.