@dot-event/el

dot-event dom elements

What is it?

This library allows you to write JSX to define pure DOM elements and manage element lists.

✅ SSR   🚫 No virtual dom!

Install

npm install dot-event @dot-event/el

Setup

const dot = require("dot-event")
require("@dot-event/el")(dot)

Usage

The dot.el API works well with JSX and view components:

/** @jsx dot.el */

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

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

Then use it:

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

List helper

A common pattern is to set an array of objects in the store:

dot.set("myId", [{id: 1}, {id: 2}])

And create a list of elements using a particular view component:

dot.elList("myId", { event: "myView" })

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

Related composers

Library	Description	URL
controller	DOM controller	https://github.com/dot-event/controller#readme
render	Server side render	https://github.com/dot-event/render#readme
view	DOM view	https://github.com/dot-event/view#readme

Credit

This library borrows heavily from attodom.