react-kefir

Connect Kefir observables to React components

Usage no npm install needed!

<script type="module">
  import reactKefir from 'https://cdn.skypack.dev/react-kefir';
</script>

README

react-kefir

Connect Kefir observables to React components

Test Coverage Build Status

npm install --save react-kefir

Connector(component: ReactComponent): ReactComponent

This higher-order component automatically subscribes to observable props and keeps the wrapped component updated. That allows us to treat continuous values as effectively discrete.

import { Connector } from 'react-kefir'

Usage

Given a component (A),

let A = (props) => (<span>{props.v}</span>)

and an infinite stream of values (S),

let _i = 0
let S = fromPoll(1000, () => ++_i).toProperty(() => 0)
•---•--->---•---•--->
0   1  ...  n   n+1

apply connector, and render:

A = Connector(A)
render(<A v={S} />, document.body)

Now, sit back and observe the passage of time!

Example