import {createStore} from 'redux'
import {e, Component} from './base'

class App extends Component {
  render(state) {
    return e('div', {}, [
        e(MyLabel, {
          ...state.texts[state.text_index],
        }),
        e(MyButton, {
          button_text: state.button_text,
        }),
    ]);
  }
}

class MyLabel extends Component {
  render(state) {
    return e('p', {
      style: {
        color: state.color,
      },
    }, [
      state.text,
    ]);
  }
}

class MyButton extends Component {
  render(state) {
    return e('button', {
      onclick: (ev) => {
        store.dispatch({type: 'tick'});
      },
    }, [
      state.button_text,
    ]);
  }
}

let initState = {
  texts: [
    {color: 'red', text: 'Hello'},
    {color: 'blue', text: 'World'},
  ],
  text_index: 0,
  button_text: 'Click me',
}

let store = createStore((state = initState, action) => {
  switch (action.type) {
  case 'tick':
    return {...state,
      'text_index': -state.text_index + 1,
    }
  default:
    return state;
  }
});
store.subscribe(() => {
  app.set(store.getState());
});

let app = new App(initState);
app.bind(document.getElementById('app'));

@@ -5,44 +5,28 @@
 rt %7B
-createStore%7D from 'redux'%0Aimport %7Be,
+e, div, p, button,%0A 
  Com
@@ -31,16 +31,23 @@
 omponent
+, Store
 %7D from '
@@ -118,17 +118,12 @@
 urn 
-e('div', 
+div(
 %7B%7D, 
@@ -134,18 +134,16 @@
       e(
-My
 Label, %7B
@@ -209,18 +209,16 @@
       e(
-My
 Button, 
@@ -294,18 +294,16 @@
 %0A%0Aclass 
-My
 Label ex
@@ -353,15 +353,10 @@
 urn 
-e('p', 
+p(
 %7B%0A  
@@ -457,10 +457,8 @@
 ass 
-My
 Butt
@@ -513,20 +513,15 @@
 urn 
-e('
 button
-', 
+(
 %7B%0A  
@@ -561,31 +561,20 @@
 ore.
-dispatch(%7Btype: '
+emit(ev_
 tick
-'%7D
 );%0A 
@@ -626,24 +626,123 @@
  %5D);%0A  %7D%0A%7D%0A%0A
+function ev_tick(state, data) %7B%0A  return %7B...state,%0A    text_index: -state.text_index + 1,%0A  %7D;%0A%7D%0A%0A
 let initStat
@@ -889,284 +889,98 @@
 let 
-store = createStore((state = initState, action) =%3E %7B%0A  switch (action.type) %7B%0A  case 'tick':%0A    return %7B...state,%0A      'text_index': -state.text_index + 1,%0A    %7D%0A  default:%0A    return state;%0A  %7D%0A%7D);%0Astore.subscribe(() =%3E %7B%0A  app.set(store.getState());%0A%7D);%0A%0Alet app
+app = new App(initState);%0Aapp.bind(document.getElementById('app'));%0A%0Alet store
  = new 
-App
+Store
 (ini
@@ -992,46 +992,30 @@
 e);%0A
-app.bind(document.getElementById('
+store.setComponent(
 app
-')
 );%0A
+%0A

update example code