jaandrle/deka-dom-el
1
0
Fork 0
mirror of https://github.com/jaandrle/deka-dom-el synced 2025-07-01 20:32:13 +02:00
Code Packages Releases Activity

🚀 simplify text, S⇔reactive?, todo as an example

Browse Source
This commit is contained in:
Jan Andrle
2023-08-26 09:36:55 +02:00
parent 77cb9cf626
commit 7f1506781f
4 changed files with 91 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/dom.js
View File

@ -1,3 +1,4 @@
import { addSignalListener, isSignal } from './signals.js';
let namespace_curr= "html";
export function namespace(namespace){
namespace_curr= namespace==="svg" ? "http://www.w3.org/2000/svg" : namespace;
@ -6,6 +7,8 @@ export function namespace(namespace){
};
}
export function createElement(tag, attributes, ...connect){
if(typeof attributes==="string" || ( isSignal(attributes) /* TODO && isText*/ ))
attributes= { textContent: attributes };
let el;
switch(true){
case typeof tag==="function": el= tag(attributes || undefined); break;
@ -19,15 +22,16 @@ export function createElement(tag, attributes, ...connect){
}
export { createElement as el };
import { watch, isSignal } from './signals.js';
export function assign(element, ...attributes){
if(!attributes.length) return element;
const is_svg= element instanceof SVGElement;
const setRemoveAttr= (is_svg ? setRemoveNS : setRemove).bind(null, element, "Attribute");
Object.entries(Object.assign({}, ...attributes)).forEach(function assignNth([ key, attr ]){
if(isSignal(attr)) //TODO: unmounted
return watch(()=> assignNth([ key, attr() ]));
if(isSignal(attr)){ //TODO: unmounted
addSignalListener(attr, attr=> assignNth([ key, attr ]));
attr= attr();
}
if(key[0]==="=") return setRemoveAttr(key.slice(1), attr);
if(key[0]===".") return setDelete(element, key.slice(1), attr);
if(typeof attr === "object"){

12
src/signals.js
View File

@ -15,7 +15,8 @@ export function S(value){
watch(()=> out(value()));
return out;
}
export function reactive(data){
S.reactive= reactive;
function reactive(data){
if(isSignal(data))
return data;
if(typeof data!=="object" || data===null)
@ -37,10 +38,14 @@ export function reactive(data){
const signal= (...value)=>
value.length ? write(signal, reactive(value[0])) : read(signal[mark]);
return createWrapObject(type, toSignal(signal, data));
}
};
const stack= [];
export function watch(context){
stack.push(context);
stack.push(function contextReWatch(){
stack.push(contextReWatch);
context();
stack.pop();
});
context();
stack.pop();
};
@ -103,4 +108,5 @@ function read({ value, listeners }){
function write(signal, value){
signal[mark].value= value;
signal[mark].listeners.forEach(fn=> fn(value))
return value;
}