dom-augmentor

    2.0.8 • Public • Published

    dom-augmentor

    Build Status Coverage Status Greenkeeper badge WebReflection status

    Social Media Photo by stephan sorkin on Unsplash

    This is exactly the same as the augmentor module, except it handles automatically effects per DOM nodes.

    Compatible with any function that returns a DOM node, or a fragment, or a hyperhtml like Wire instance.

    Breaking in v1

    • the default export has been removed, it's import {augmentor} from 'augmentor' now
    • the augmentor library is the v1 one
    • effects now work more reliably and there are no constrains for the guards

    Example

    Live Demo

    const {augmentor: $, useEffect, useRef, useState} = augmentor;
    const {render, hook} = lighterhtml;
    const {html, svg} = hook(useRef);
     
    const Button = (text) => $(() => {
      useEffect(
        () => {
          console.log('connected');
          return () => console.log('disconnected');
        },
        []
      );
      const [i, increment] = useState(0);
      return html`
      <button onclick=${() => increment(i + 1)}>
        ${text} ${i}
      </button>`;
    });
     
    const button = Button('hello');
     
    render(document.body, button);
    // alternatively
    // document.body.appendChild(button());

    Install

    npm i dom-augmentor

    DownloadsWeekly Downloads

    10

    Version

    2.0.8

    License

    ISC

    Unpacked Size

    27.5 kB

    Total Files

    9

    Last publish

    Collaborators

    • webreflection