Built-in component for controlled components

Disclaimer: I’m just now reading through the docs, maybe I have missed it. Apologies in advance 😃

Since React 16.4, having mixed-control components (that work either via a value prop and onChange callback, or with an internal state) are discouraged, if cumbersome to build.

I wonder if there could be a built-in component that can manage the state for a controlled component:

<Controller>
{ (state, setState) => 
    <MyComponent value={state.value} onChange={ value => setState({ value }) } />
}
</Controller>

[denisborovikov]

Have you seen react-powerplug?

[jedrichards]

Wouldn’t an api like the below make Playground much more useful out of the box?

<Playground state={{value: ''}}>
  {
    ({state, setState}) => (
      <input
        value={state.value},
        onChange={e => setState({ value: e.target.value })}
      />
    )
  }
</Playground>

It would be completely optional and opt-in (i.e. using a render prop as opposed to children). Should be super easy to implement with react-powerplug under the hood.