npm package: @jhoguet/react-rxjs
Description: bringing react and rxjs, and IOC together
Author: Jon Hoguet
Latest version: 0.0.5

## @jhoguet/react-rxjs

:exclamation: Use with caution, this is still in the proof of concept phase and lacks adequate testing both in automated
tests and in the wild.

## Getting Started

    npm install @jhoguet/react-rxjs

### Simple Example
```js
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { IOCContainer, DependencyInjectableStreamComponent } from '@jhoguet/react-rxjs';
import { BehaviorSubject } from 'rxjs';
import 'aurelia-polyfills';

class HappinessViewModel{
    constructor(){
        this.happiness$ = new BehaviorSubject(1);
        this.increment = () => this.happiness$.next(this.happiness$.value + 1);
    }
}

class AppView extends Component {
    render(){
        const props = this.props;
        return (
            <div>
                <h1>Happiness {props.happiness}</h1>
                <button onClick={e => props.increment()}>Happier!</button>
            </div>
        );
    }
}

class App extends DependencyInjectableStreamComponent {
    static inject(){
        return {
            happiness : HappinessViewModel
        };
    }
    getRenderStream(){
        return this.happiness.happiness$.map(happiness => {
            return {
                happiness,
                increment : () => this.happiness.increment()
            };
        })
        .map(props => {
            return <AppView {...props} />
        });
    }
}

const el = document.createElement('div');
ReactDOM.render(
    <IOCContainer>
        <App />
    </IOCContainer>
    , el
);
document.body.appendChild(el);
```

So much to cover... submit an issue to encourage me to pump out the api docs...

## Intent
The intent of this is to provide a means of building a complex application leveraging the strenths of IOC, React, and
RxJS Streams. You should be able easily use any react components.

You should be able to use the same tools (rxjs and IOC) to manage the state / logic of both a "Smart" component like a
dropdown (eg open state) as you do complex components (like your entire application.

You should be able to easily have multiple independent instances of any component, something that is not trivial in a system
leveraging global stores.


## Assumptions / Constraints

* this is using `aurelia-dependency-injection` which is a great IOC container, but is rather large (mostly because of
`corejs` and forces you to use classes. Ideally an IOC container in Javascript would also support functions... in effect
currying dependencies.
* `DependencyInjectableStreamComponent` has to wrap the component in order for the `react-debugger` to see the
component... dig in to this to better understand options and expose the best abstraction for consumers?
* IOC isn't strictly necessary in this repo... consider splitting out the IOC part from the Stream part?
* add an IOC opt-out option which uses a container to build everything without the consumer knowing there was ever a
container?

## Similar Projects

- http://cycle.js.org/ ands its sister https://github.com/pH200/cycle-react

## Next Steps / How to help
* automated tests in a browser (real dom)
* docs...
* research IOC solutions
* research state of decorators... time to bring in `@inject()`?