choop - component

index.js

var choop = require('choop')
var html = require('choop/html')
var h = require('choop/h')
var Component = require('choop/component')
var devtools = require('choo-devtools')

var app = choop()
app.use(devtools())
app.route('*', mainView)
app.mount('body')

class ClickMe extends Component {
  constructor () {
    super()
    this.state = { n: 0 }
    this.handleClick = () => {
      this.setState({ n: this.state.n + 1 })
    }
  }
  render (props, state) {
    return html`
      <div>
        <h1>clicked ${state.n} times</h1>
        <button onClick=${this.handleClick}>click me!</button>
      </div>
    `
  }
}

function mainView (state, emit) {
  return html`
    <main>
      ${h(ClickMe)}
      ${h(ClickMe)}
      ${h(ClickMe)}
    </main>
  `
}

package.json

{
  "dependencies": {
    "choop": "3.0.0",
    "choo-devtools": "2.2.0"
  }
}