@thi.ng/rdom/wrap.js

Lightweight, reactive, VDOM-less UI/DOM components with async lifecycle and @thi.ng/hiccup compatible

import { $compile } from "./compile.js";
import { $addChild, $html, $remove, $text } from "./dom.js";
const __wrapper = (update) => (tag, attribs, body) => ({
  async mount(parent, index, state) {
    this.inner = $compile([tag, attribs]);
    this.el = await this.inner.mount(parent, index);
    update(this.el, state != null ? state : body);
    return this.el;
  },
  async unmount() {
    this.inner.unmount();
    this.el = void 0;
  },
  update(body2) {
    if (this.el) update(this.el, body2);
  }
});
const $wrapText = __wrapper($text);
const $wrapHtml = __wrapper($html);
const $wrapEl = (el) => ({
  async mount(parent, idx) {
    $addChild(parent, el, idx);
    return this.el = el;
  },
  async unmount() {
    $remove(this.el);
    this.el = void 0;
  },
  update() {
  }
});
export {
  $wrapEl,
  $wrapHtml,
  $wrapText
};