@thi.ng/rdom/object.js

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

import { fromObject } from "@thi.ng/rstream/object";
import { Component } from "./component.js";
import { __nextID } from "./idgen.js";
import { $subWithID } from "./sub.js";
const $object = (src, opts, inner) => new $Object(src, opts, inner);
const $subObject = (src, opts, inner) => $subWithID(
  src,
  $object(src.deref() || {}, opts, inner),
  __nextID("obj", src)
);
class $Object extends Component {
  constructor(src, opts, ctor) {
    super();
    this.ctor = ctor;
    this.obj = fromObject(src, opts);
  }
  obj;
  inner;
  async mount(parent, index = -1, state) {
    state !== void 0 && this.obj.next(state);
    this.inner = this.$compile(await this.ctor(this.obj.streams));
    this.el = await this.inner.mount(parent, index);
    return this.el;
  }
  async unmount() {
    this.obj.done();
    await this.inner.unmount();
    this.el = void 0;
    this.inner = void 0;
  }
  update(state) {
    this.obj.next(state);
  }
}
export {
  $Object,
  $object,
  $subObject
};