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

♻️ use eventsSink for n-binding

Browse Source
This commit is contained in:
Jan Andrle
2023-08-23 20:15:30 +02:00
parent 31563c4f7b
commit 7a2c3e6a4b
2 changed files with 27 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
test/index.js
View File

@ -22,36 +22,36 @@ function component({ value= "World" }= {}){
}
`;
const output= (function(){
const element= el("strong", { textContent: value });
return {
element,
onchange: listen("change", function(event){
assign(element, { textContent: event.target.value });
})
}
})();
const input= (function(){
const element= el("input", { type: "text", value }, output.onchange);
return {
element,
onchange: listen("change", function(event){
assign(element, { value: event.detail });
dispatch("change")(element);
})
};
})();
const output= eventsSink(store=> ({
onchange: listen("change", function(event){
assign(store.element, { textContent: event.target.value });
})
}));
const input= eventsSink(store=> ({
onchange: listen("change", function(event){
assign(store.element, { value: event.detail });
dispatch("change")(input.element);
})
}));
return el("div", { className: name }, input.onchange).append(
el("p").append(
el("#text", { textContent: "Hello " }),
output.element,
el("strong", { textContent: value }, output.target),
),
el("label").append(
el("#text", { textContent: "Set name:" }),
input.element
el("input", { type: "text", value }, output.onchange, input.target)
)
)
}
function eventsSink(fn){
const store= {
element: null,
target: function(element){ store.element= element; },
};
Object.assign(store, fn(store));
return store;
}
function createStyle(){
const style= el("style");
return {