Value not passed to children on render

[johnson-christopher]

I'm working with a TextField from material ui and it renders differently with a value than it does without. Labels are hidden and it has a hint for the value instead. So, if there is a value when it's time to render it's important for that value to be set on the TextFields component.

My first thought was to just remove 'value' from the list of controlled props that are removed when creating the children. However, I'm thinking this may miss some important steps that would normally be called in onChange. So, before I do another PR for that I wanted to discuss the possible solutions and see what the maintainers think is the best.

For what it's worth I do have a workaround. By passing a function that renders my child component with the correct value, rather than passing just the component, I am able to force it to have the right value.

Example:

<InputMask value="some value">
  {(props) => (
    <TextField
      value="some value"
      {...props}
    />
  )}
</InputMask>

If we can pass that value along on render it becomes this instead, which is much cleaner:

<InputMask value="some value">
  {TextField}
</InputMask>