JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://unpkg.com/webcompose@latest/dist/webcompose.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.0.5/redux.min.js"></script>
<provider>
<simple-counter></simple-counter>
</provider>

JavaScript

function counter (state=0, action) {
  switch (action.type) {
  	case 'INCREMENT':
    	state++;
      break;
  }
  return state;
}

document.querySelector('provider').store = Redux.createStore(counter);

const { ComposableElement, html, connect } = window.webcompose

class Counter extends ComposableElement {
  static get composition(){
    return [
      connect((state)=>({
      	counter: state
      }), (dispatch) => ({
      	increment : () => {
        	dispatch({type:"INCREMENT"});
        }
      }))
    ]
  }

  static render({counter, increment}){
    return html`
      ${counter} <button on-click=${increment}>+</button>
    `
  }
}

customElements.define("simple-counter", Counter);