This package has been deprecated

Author message:

Please use the now official package @hyperapp/html

hyperapp-html
TypeScript icon, indicating that this package has built-in type declarations

2.0.0 • Public • Published

hyperapp-html

npm Slack

Html helpers for hyperapp h.

Note

This library is builded using meta programing through template engine to allow the use of tree shaking and a better optimisation.

Installation

Using npm:

npm i hyperapp-html

Then setup a build pipeline and import it.

import { div, h1 } from "hyperapp-html"

Using a CDN:

<script src="https://unpkg.com/hyperapp-html"></script>

Then access the all hmtl tags from hyperappHtml in the global scope as hyperappHtml.div, hyperappHtml.h1, etc...

Usage

const vnode = h1({ id: "title" }, "Hi.")

Example

Try it online

app({
  state: {
    count: 0
  },
  view: (state, actions) =>
    main([
      h1({}, state.count),
      button({
        onclick: actions.down,
        disabled: state.count <= 0
      }, ""),
      button({
        onclick: actions.up
      }, "")
    ]),
  actions: {
    down: state => ({ count: state.count - 1 }),
    up: state => ({ count: state.count + 1 })
  }
})

API

Tags

tagname

Type: (props: object, children: vnode[]) => vnode

Call h to return a vnode according to the tag name.

const vnode = tagname({ id: "title" }, "Hi.")

License

hyperapp-html is MIT licensed. See LICENSE.

Package Sidebar

Install

npm i hyperapp-html

Weekly Downloads

8

Version

2.0.0

License

MIT

Last publish

Collaborators

  • swizz