1
0
mirror of https://github.com/jaandrle/deka-dom-el synced 2024-11-24 17:39:36 +01:00

add namespace function

This commit is contained in:
Jan Andrle 2023-08-24 15:31:22 +02:00
parent acdfb4ef57
commit 1fbc6a8641
Signed by: jaandrle
GPG Key ID: B3A25AED155AFFAB
2 changed files with 16 additions and 17 deletions

View File

@ -1,24 +1,23 @@
let namespace_curr= "html";
export function namespace(namespace){
namespace_curr= namespace==="svg" ? "http://www.w3.org/2000/svg" : namespace;
return {
append(el){ namespace_curr= "html"; return el; }
};
}
export function createElement(tag, attributes, ...connect){ export function createElement(tag, attributes, ...connect){
let el; let el;
switch(true){ switch(true){
case typeof tag==="function": el= tag(attributes || undefined); break; case typeof tag==="function": el= tag(attributes || undefined); break;
case tag==="<>": el= document.createDocumentFragment(); break; case tag==="<>": el= document.createDocumentFragment(); break;
case tag==="#text": el= assign(document.createTextNode(""), attributes); break; case tag==="#text": el= assign(document.createTextNode(""), attributes); break;
case namespace_curr!=="html": el= assign(document.createElementNS(namespace_curr, tag), attributes); break;
default: el= assign(document.createElement(tag), attributes); default: el= assign(document.createElement(tag), attributes);
} }
connect.forEach(c=> c(el)); connect.forEach(c=> c(el));
return el; return el;
} }
export { createElement as el }; export { createElement as el };
export function createElementNS(tag, attributes, attributes_todo){
let namespace= "svg";
if(typeof attributes_todo !== "undefined"){
namespace= tag; tag= attributes; attributes= attributes_todo; }
if(tag==="<>") return document.createDocumentFragment();
if(tag==="") return document.createTextNode(attributes.textContent ?? attributes.innerText ?? attributes.innerHTML);
return assign(document.createElementNS(namespace==="svg" ? "http://www.w3.org/2000/svg" : namespace, tag), attributes);
}
export { createElementNS as elNS };
import { watch, isSignal } from './signals.js'; import { watch, isSignal } from './signals.js';
export function assign(element, ...attributes){ export function assign(element, ...attributes){
@ -27,10 +26,10 @@ export function assign(element, ...attributes){
const setRemoveAttr= (is_svg ? setRemoveNS : setRemove).bind(null, element, "Attribute"); const setRemoveAttr= (is_svg ? setRemoveNS : setRemove).bind(null, element, "Attribute");
Object.entries(Object.assign({}, ...attributes)).forEach(function assignNth([ key, attr ]){ Object.entries(Object.assign({}, ...attributes)).forEach(function assignNth([ key, attr ]){
if(key[0]==="=") return setRemoveAttr(key.slice(1), attr);
if(key[0]===".") return setDelete(element, key.slice(1), attr);
if(isSignal(attr)) //TODO: unmounted if(isSignal(attr)) //TODO: unmounted
return watch(()=> assignNth([ key, attr() ])); return watch(()=> assignNth([ key, attr() ]));
if(key[0]==="=") return setRemoveAttr(key.slice(1), attr);
if(key[0]===".") return setDelete(element, key.slice(1), attr);
if(typeof attr === "object"){ if(typeof attr === "object"){
switch(key){ switch(key){
case "style": return forEachEntries(attr, setRemove.bind(null, element.style, "Property")) case "style": return forEachEntries(attr, setRemove.bind(null, element.style, "Property"))

View File

@ -1,5 +1,5 @@
import { S, watch, el, elNS, assign, listen, dispatch } from "../index.js"; import { S, watch, el, namespace, assign, listen, dispatch } from "../index.js";
Object.assign(globalThis, { S, watch, el, elNS, assign, listen, dispatch }); Object.assign(globalThis, { S, watch, el, namespace, assign, listen, dispatch });
const { style, css }= createStyle(); const { style, css }= createStyle();
globalThis.test= console.log; globalThis.test= console.log;