Skip to content

Html helper functions for Hyperapp V1

License

Notifications You must be signed in to change notification settings

diesdasdigital/hyperapp-html

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

81 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

@diesdasdigital/hyperapp-html

npm

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.

About

Html helper functions for Hyperapp V1

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%