@diesdasdigital/hyperapp-html

@diesdasdigital/hyperapp-html

NOTE: This is a fork of Swizz/hyperapp-html to provide better types for Typescript:

• allow lazy components
• allow passing a single VNode as children

Html helper functions for Hyperapp. Use @diesdasdigital/hyperapp-html as an alternative to JSX or the hyperapp.h function.

Installation

yarn add @diesdasdigital/hyperapp-html

Usage

Here is a counter that can be incremented or decremented. Go ahead and try it online.

import { h, app } from "hyperapp"
import { div, h1, button } from "@diesdasdigital/hyperapp-html"

const state = {
  count: 0
}

const actions = {
  down: () => state => ({ count: state.count - 1 }),
  up: () => state => ({ count: state.count + 1 })
}

const view = (state, actions) =>
  div([
    h1(state.count),
    button({ onclick: actions.down }, "-"),
    button({ onclick: actions.up }, "+")
  ])

app(state, actions, view, document.body)

See /vars.json for the list of available Html tags you can use in your program.

License

@diesdasdigital/hyperapp-html is MIT licensed. See LICENSE.