rvx
Version:
A signal based rendering library
61 lines • 2.12 kB
JavaScript
import { Context } from "../context.js";
import { XMLNS } from "../element-common.js";
import { ENV } from "../env.js";
import { isolate } from "../isolate.js";
import { watch } from "../signals.js";
import { appendContent } from "./append-content.js";
import { setAttr } from "./set-attr.js";
import { setClass } from "./set-class.js";
import { setStyle } from "./set-style.js";
export function createElement(tagName, attrs) {
const env = ENV.current;
const elem = env.document.createElementNS(XMLNS.current, tagName);
for (const name in attrs) {
const value = attrs[name];
if (value !== undefined) {
if (name === "children") {
appendContent(elem, value, env);
}
else if (name.startsWith("on:")) {
let listener;
let options;
if (Array.isArray(value)) {
listener = value[0];
options = value[1];
}
else {
listener = value;
}
const wrapped = Context.wrap(listener);
elem.addEventListener(name.slice(3), event => isolate(wrapped, event), options);
}
else if (name.startsWith("prop:")) {
const prop = name.slice(5);
watch(value, value => elem[prop] = value);
}
else if (name.startsWith("attr:")) {
const attr = name.slice(5);
setAttr(elem, attr, value);
}
else if (name === "ref") {
if (Array.isArray(value)) {
value.forEach(v => v(elem));
}
else {
value(elem);
}
}
else if (name === "style") {
setStyle(elem, value);
}
else if (name === "class") {
setClass(elem, value);
}
else {
setAttr(elem, name, value);
}
}
}
return elem;
}
//# sourceMappingURL=create-element.js.map