mirror of
https://github.com/jaandrle/deka-dom-el
synced 2024-11-25 01:39:37 +01:00
♻️ Update todosComponent to use types properly
This commit is contained in:
parent
1dd05518b8
commit
ff22eed991
1
src/signals.d.ts
vendored
1
src/signals.d.ts
vendored
@ -41,6 +41,7 @@ interface S {
|
||||
signal: SymbolSignal;
|
||||
onclear: SymbolOnclear;
|
||||
}
|
||||
el<S extends any, T extends HTMLElement>(signal: Signal<S, any>, el: (v: S)=> T): T;
|
||||
}
|
||||
export const S: S;
|
||||
declare global {
|
||||
|
@ -16,12 +16,11 @@ const className= style.host(todosComponent).css`
|
||||
`;
|
||||
/** @param {{ todos: string[] }} */
|
||||
export function todosComponent({ todos= [ "Task A" ] }= {}){
|
||||
const todosS= S([], {
|
||||
const todosS= S(todos.map(t=> S(t)), {
|
||||
add(v){ this.value.push(S(v)); },
|
||||
remove(i){ this.value.splice(i, 1); },
|
||||
[S.symbols.onclear](){ S.clear(...this.value); },
|
||||
});
|
||||
todos.forEach(v=> S.action(todosS, "add", v));
|
||||
const name= "todoName";
|
||||
const onsubmitAdd= on("submit", event=> {
|
||||
const el= event.target.elements[name];
|
||||
@ -81,7 +80,7 @@ function todoComponent({ textContent, value }, host){
|
||||
return el("li").append(
|
||||
S.el(is_editable, is=> is
|
||||
? el("input", { value: textContent(), type: "text" }, onedited)
|
||||
: el("span", textContent, on("click", ()=> is_editable(true))),
|
||||
: el("span", { textContent, onclick: is_editable.bind(null, true) }),
|
||||
),
|
||||
el("button", { type: "button", value, textContent: "-" }, onclick)
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user