# tagl-mithril

> Wrapper around [tagl](https://github.com/StephanHoyer/tagl), a readability enhancement for hyperscript code. The example tagl function for [mithril](https://mithril.js.org) is extended by camelcase to hyphenated syntax for css-classes and ids.

Latest version **1.2.2** (published 2019-11-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install tagl-mithril
pnpm add tagl-mithril
yarn add tagl-mithril
bun add tagl-mithril
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.2.2 |
| Published | 2019-11-13 |
| First published | 2018-11-27 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 26.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | abulvenz |
| Maintainers | abulvenz |

## Links

- npm: https://www.npmjs.com/package/tagl-mithril
- Repository: https://github.com/abulvenz/tagl-mithril
- Homepage: https://github.com/abulvenz/tagl-mithril#readme
- Issues: https://github.com/abulvenz/tagl-mithril/issues
- npm.io page: https://npm.io/package/tagl-mithril

## Dependencies (2)

- [tagl](https://npm.io/package/tagl.md) ^1.1.2
- [mithril](https://npm.io/package/mithril.md) ^2.0.4

## Recent versions

- 1.2.2 (latest) — 2019-11-13
- 1.2.1 — 2019-11-13
- 1.2.0 — 2019-11-13
- 1.1.3 — 2019-11-13
- 1.1.2 — 2019-11-13
- 1.1.1 — 2019-11-13
- 1.1.0 — 2019-11-13
- 1.0.8 — 2019-11-13
- 1.0.6 — 2019-11-13
- 1.0.5 — 2019-11-13
- 1.0.4 — 2018-11-27
- 1.0.3 — 2018-11-27
- 1.0.2 — 2018-11-27
- 1.0.1 — 2018-11-27
- 1.0.0 — 2018-11-27

## README

# tagl-mithril

Wrapper around [tagl](https://github.com/StephanHoyer/tagl), a readability enhancement for hyperscript code. The example tagl function for [mithril](https://mithril.js.org) is extended by camelcase to hyphenated syntax for css-classes and ids.

# Installation

`npm install --save tagl-mithril`

## Example usage

```javascript
import tagl_hyperscript from 'tagl-mithril';
import m from 'mithril'

const {
    nav, 
    section, 
    footer,
    h1, 
    div
} = tagl_hyperscript(m);

m.mount(document.body,{
    view(vnode) {
        return [
            nav.navbar.isInfo(
                '...'
            ),
            section.content.$home(
                h1.title('Hello Tagl And Mithril')
            ),
            footer.fixedBottom(
                '...'
            )
        ]
    }
})
```
The above snippet will be rendered to the DOM like this:

```html
<nav class="navbar is-info">...</nav>
<section id="home" class="content">
  <h1 class="title">Hello Tagl And Mithril</h1>
</section>
<footer class="fixed-bottom">...</footer>
```

## What you should have noticed ...

... is that you need to define all tags that you want to use as a result of `tagl_hyperscript(m)`.

... is that `isInfo` was turned into `is-info`, because css classes don't like camelcase.

... is that `$home` was transformed into an id attribute for the section.

---
_Source: https://npm.io/package/tagl-mithril · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._