# @emit-js/el

> emit dom elements

Latest version **0.0.14** (published 2019-04-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install @emit-js/el
pnpm add @emit-js/el
yarn add @emit-js/el
bun add @emit-js/el
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.14 |
| Published | 2019-04-07 |
| First published | 2019-04-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 11.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | emit |
| Maintainers | winton |
| Keywords | emit, dom, elements |

## Links

- npm: https://www.npmjs.com/package/@emit-js/el
- Repository: https://github.com/emit-js/el
- Homepage: https://github.com/emit-js/el#readme
- Issues: https://github.com/emit-js/el/issues
- npm.io page: https://npm.io/package/@emit-js/el

## Alternatives

- [babylon](https://npm.io/package/babylon.md) — 5.1M weekly downloads
- [csscolorparser](https://npm.io/package/csscolorparser.md) — 3.7M weekly downloads
- [expr-eval-fork](https://npm.io/package/expr-eval-fork.md) — 1.5M weekly downloads
- [@leeoniya/ufuzzy](https://npm.io/package/@leeoniya/ufuzzy.md) — 247.7K weekly downloads
- [xml-parser](https://npm.io/package/xml-parser.md) — 78.4K weekly downloads

## Recent versions

- 0.0.14 (latest) — 2019-04-07
- 0.0.12 — 2019-04-07

## README

# @emit-js/el

[emit](https://github.com/emit-js/emit#readme) dom elements

![element](element.gif)

## What is it?

This library allows you to write JSX to define [pure DOM elements](https://developer.mozilla.org/en-US/docs/Web/API/Element) and manage element lists.

✅ SSR   🚫 No virtual dom!

## Install

```js
npm install @emit-js/emit @emit-js/el
```

## Setup

```js
const emit = require("@emit-js/emit")
require("@emit-js/el")(emit)
```

## Usage

The `emit.el` API works well with JSX and [view components](https://github.com/emit-js/view):

```js
/** @jsx emit.el */

module.exports = function(emit) {
  emit.view("myView", { render })
}

function render(arg, prop, emit) {
  return <div id={prop} />
}
```

Then use it:

```js
require("./myView")(emit)
emit.myView("myId") // `render` element to #myId
```

## List helper

A common pattern is to set an array of objects in the [store](https://github.com/emit-js/store):

```js
emit.set("myId", [{id: 1}, {id: 2}])
```

And create a list of elements using a particular [view component](https://github.com/emit-js/view):

```js
emit.elList("myId", { event: "myView" })
```

The `emit.elList` helper works with SSR elements, removing, updating, and inserting where necessary.

## Related composers

| Library    | Description    | URL                                     |
| ---------- | -------------- | --------------------------------------- |
| controller | DOM controller | https://github.com/emit-js/controller#readme |
| render     | Server side render     | https://github.com/emit-js/render#readme     |
| view       | DOM view       | https://github.com/emit-js/view#readme       |

## Credit

This library borrows heavily from [attodom](https://github.com/hville/attodom).

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