Closed
Description
First of all, thanks for your library!
Second, I've noticed that React <input/> elements that rely on events to update their values and that are children of a <ScrollLock/> cannot have spaces typed into them. I suspect this might happen because <ScrollLock/> is registering listeners on the raw events whereas the React <input/> is listening to React's synthetic events. Perhaps the raw event is cancelled before it ever becomes a React synthetic event? Since normally the child element will receive the bubbled event before the parent, but that's not happening in this case.
For example, in a component roughly defined like this:
...
<div>
<ScrollLock>
<div>
<input
value={this.state.value}
onChange={event => {
this.setState({
value: event.target.value,
})
}}
</div>
</ScrollLock>
</div>
...
The <input/> will never receive onChange events for a spacebar press.