dom-reactive/dist/index.mjs

A library for working with DOM with syntax similar to Vue.

function O(e) {
  return { all: e = e || /* @__PURE__ */ new Map(), on: function(n, o) {
    var t = e.get(n);
    t ? t.push(o) : e.set(n, [o]);
  }, off: function(n, o) {
    var t = e.get(n);
    t && (o ? t.splice(t.indexOf(o) >>> 0, 1) : e.set(n, []));
  }, emit: function(n, o) {
    var t = e.get(n);
    t && t.slice().map(function(s) {
      s(o);
    }), (t = e.get("*")) && t.slice().map(function(s) {
      s(n, o);
    });
  } };
}
const y = O();
let C = /* @__PURE__ */ new Map(), v = () => {
};
window && typeof window.crypto.randomUUID == "function" ? v = window.crypto.randomUUID.bind(window.crypto) : v = P;
function W(e, n, o = "") {
  const t = document.getElementById(e);
  if (t) {
    const s = n(t);
    b(t, s), j(t, s), S(t, s), w(t, s), L(t, s), R(t, s), o !== "" ? window[o] = s : window[e] = s;
  }
}
function F(e, n) {
  const o = document.getElementsByClassName(
    e
  );
  for (let t of o)
    if (t) {
      const s = n(t);
      U(s) && (b(t, s), j(t, s), S(t, s), w(
        t,
        s
      ), L(t, s), R(t, s));
    }
}
function H(e) {
  const n = `state_${v()}`;
  let o = { value: e };
  const t = new Proxy(o, {
    set(s, m, u) {
      return m === "value" ? (s.value !== u && (s.value = u, y.emit(n, s)), !0) : !1;
    }
  });
  return C.set(t, n), y.emit(n, t), t;
}
function b(e, n) {
  g("data-ref", e).forEach((t) => {
    const s = t.getAttribute("data-ref");
    s && n[s] && (n[s].value = t);
  });
}
function w(e, n) {
  g("data-value", e).forEach((t) => {
    if (t instanceof HTMLInputElement) {
      const s = t.getAttribute("data-value") || null;
      if (s) {
        let u = E(s);
        const d = n[u];
        if (d) {
          t.value = d.value;
          const f = C.get(d);
          y.on(f, (i) => {
            t.value = i.value;
          });
        }
      }
    }
  });
}
function j(e, n) {
  const o = g("data-click", e);
  o.length && o.forEach((t) => {
    let s = t.getAttribute("data-click");
    if (s) {
      const m = E(s), u = n[m];
      u && t.addEventListener("click", function(d) {
        u(d);
      });
    }
  });
}
function L(e, n) {
  const o = g("data-change", e);
  o.length && o.forEach((t) => {
    if (t) {
      let s = t.getAttribute("data-change");
      if (s) {
        const m = E(s), u = n[m];
        u && t.addEventListener("change", function(d) {
          u(d);
        });
      }
    }
  });
}
function R(e, n) {
  const o = g("data-input", e);
  o.length && o.forEach((t) => {
    if (t) {
      let s = t.getAttribute("data-input");
      if (s) {
        const m = E(s), u = n[m];
        u && t.addEventListener("input", function(d) {
          u(d);
        });
      }
    }
  });
}
function S(e, n) {
  g("data-class", e).forEach((f) => {
    t(f);
  });
  function t(f) {
    let i = f.getAttribute("data-class");
    if (i) {
      let r;
      try {
        r = JSON.parse(i);
      } catch (a) {
        throw console.error(a), new Error("Error at JSON string: " + i);
      }
      if (Array.isArray(r))
        for (let a in r) {
          let c = r[a];
          const x = /(.+?)\s*\?\s*(.+?)\s*:\s*(.+)/, l = c.match(x);
          let p = l[1];
          const h = l[2], A = l[3];
          s(
            f,
            [h, A],
            p
          );
        }
      else if (U(r))
        for (let a in r) {
          let c = r[a];
          s(
            f,
            a,
            c
          );
        }
    }
  }
  function s(f, i, r) {
    let a = !1;
    r[0] === "!" && (a = !0, r = r.slice(1));
    let c = E(r);
    const x = c.includes("!="), l = c.includes("==");
    x || l ? x ? m(
      c,
      /!=/,
      "!=",
      a,
      i,
      f
    ) : l && m(
      c,
      /==/,
      "==",
      a,
      i,
      f
    ) : u(
      c,
      !0,
      "==",
      a,
      i,
      f
    );
  }
  function m(f, i, r, a, c, x) {
    const l = D(f, i);
    if (l && l.length === 2) {
      const [p, h] = l;
      u(
        p,
        h,
        r,
        a,
        c,
        x
      );
    }
  }
  function u(f, i, r, a, c, x) {
    const l = n[f];
    if (!l)
      k(e);
    else {
      const p = N(l.value, i, r);
      d(p, c, x, a);
      const h = C.get(l);
      y.on(h, (A) => {
        const I = N(A.value, i, r);
        d(I, c, x, a);
      });
    }
  }
  function d(f, i, r, a = !1) {
    try {
      const c = f && !a || !f && a;
      if (typeof i == "string")
        c ? r.classList.add(i) : r.classList.remove(i);
      else if (Array.isArray(i)) {
        const [x, l] = i;
        c ? (r.classList.remove(l), r.classList.add(x)) : (r.classList.remove(x), r.classList.add(l));
      }
    } catch (c) {
      console.error(c);
    }
  }
}
function k(e, n) {
  "#" + e.getAttribute("id") || "" + e.getAttribute("class");
}
function U(e) {
  return e !== null && typeof e == "object";
}
function E(e) {
  return e.replace(/^\w+\./, "");
}
function D(e, n) {
  const o = e.split(n);
  return o.length === 2 ? [o[0].trim(), o[1].trim()] : null;
}
function N(e, n, o) {
  switch (o) {
    case "!=":
      return e != n;
    case "==":
      return e == n;
    case "<":
      return e < n;
    case ">":
      return e > n;
    case "<=":
      return e <= n;
    case ">=":
      return e >= n;
    default:
      throw new Error("Invalid operator");
  }
}
function g(e, n) {
  const o = n.querySelectorAll(`[${e}]`), t = [...Array.from(o)];
  return n.dataset && n.getAttribute(e) && t.push(n), t;
}
function P() {
  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(e) {
    const n = Math.random() * 16 | 0;
    return (e === "x" ? n : n & 3 | 8).toString(16);
  });
}
export {
  F as createComponent,
  W as createScope,
  y as emitter,
  H as ref
};
//# sourceMappingURL=index.mjs.map