hyperapp-tags

To write HTML code in HyperApp v2.x using regular HTML tags. This lib does same jobs as @hyperapp/html but get updated with HyperApp v2.x and later.

Usage no npm install needed!

<script type="module">
  import hyperappTags from 'https://cdn.skypack.dev/hyperapp-tags';
</script>

README

hyperapp-tags

To write HTML code in HyperApp v2.x using regular HTML tags. This lib does same jobs as @hyperapp/html but get updated with HyperApp v2.x and later.

NPM Build Status Coverage Status

Usage

// install if not yet
npm install hyperapp-tags

Then import it to use:


const hyperTag = require('hyperapp-tags');

// or newer syntax
// import hyperTag from 'hyperapp-tags';

const {div, ul, li, a} = hyperTag;

div(
  {
    id: 'leftPanel',
    class: 'container sidebar',
  },
  [
    ul(
      {},
      [
        li(
          {
            class: 'menu-item',
          },
          [
            a(
              {
                class: 'link',
                href: '/home',
              },
              'Home',
            ),
          ]
        ),
        li(
          {
            class: 'menu-item',
          },
          [
            a(
              {
                class: 'link',
                href: '/about',
              },
              'About',
            ),
          ]
        ),
        li(
          {
            class: 'menu-item',
          },
          [
            a(
              {
                class: 'link',
                href: '/contact',
              },
              'Contact',
            ),
          ]
        ),
      ]
    ),
  ]
);

Test

git clone https://github.com/ndaidong/hyperapp-tags.git
cd hyperapp-tags
npm install
npm test

License

The MIT License (MIT)