[Recompose] Handle React Events as Streams with RxJS and Recompose

Events are the beginning of most every stream. Recompose provides a createEventHandler function to help your create handler and stream pairs. Once the handler/stream pairs are created, it’s simply a matter of passing the handlers down the stream as props and combining the streams any way you want.

 

const SimpleFormStream = componentFromStream(
  props$ => {
    const {
      stream: onInput$,
      handler: onInput
    } = createEventHandler();

    const text$ = onInput$
      .map(e => e.target.value)
      .debounceTime(500)
      .switchMap(text => createTypeWrite(text))
      .startWith("");

    return text$
 
      .map(text => ({ text, onInput }))
      .map(SimpleForm) 
  }
)