React-unstated

Redux-like connect for unstated.

Installation

npm install --save react-unstated

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import { Container, Provider } from 'unstated';
import { connect } from 'react-unstated';

class CounterContainer extends Container {
  state = {
    count: 0
  }

  increase = () => {
    this.setState({
      count: this.state.count + 1
    });
  }
}

const Counter = ({ n, inc }) => (
  <div>
    <div>{n}</div>
    <div>
      <button onClick={inc}>Increase</button>
    </div>
  </div>
);

const EnchancedCounter = connect(Counter, CounterContainer, (c) => {
  return {
    n: c.state.count,
    inc: c.increase
  };
});

ReactDOM.render((
  <Provider>
    <EnchancedCounter />
  </Provider>
), document.getElementById('root'));