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:
parent
acdfb4ef57
commit
1fbc6a8641
21
src/dom.js
21
src/dom.js
@ -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"))
|
||||||
|
@ -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;
|
||||||
|
Loading…
Reference in New Issue
Block a user