JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/react@15.6.1/dist/react.min.js"></script>
<script src="https://unpkg.com/react-dom@15.6.1/dist/react-dom.min.js"></script>
<script src="https://unpkg.com/dynamic-object@2.1.19/built/bundle.js"></script>
<script src="https://unpkg.com/dependency-inject@1.0.15/built/bundle.js"></script>
<script src="https://unpkg.com/dynamic-react@2.0.20/built/bundle.js"></script>
<div id='react-dom'></div>

Babel + JSX

// import { observable } from 'dynamic-object'
// import { Connect, Provider } from 'dynamic-react'
// import { inject } from 'dependency-inject'

@observable
class UserStore {
    name = 'bob'
}

class UserAction {
    @inject(UserStore) userStore: UserStore

    @Action setName (name: string) {
        this.userStore.name = name
    }
}

const container = new Container()
container.set(UserStore, new UserStore())
container.set(UserAction, new UserAction())

@Connect
class App extends React.Component {
    componentWillMount () {
    		setTimeout(() => {
            this.props.action.setName('nick')
        }, 1000)
    }

    render() {
        return (
            <span>{this.props.store.name}</span>
        )
    }
}

ReactDOM.render(
    <Provider store={container.get(UserStore)} action={container.get(UserAction)}>
        <App />
    </Provider>
, document.getElementById('react-dom'))