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

⚡ on.host

Browse Source
This commit is contained in:
Jan Andrle
2025-03-14 13:49:01 +01:00
parent 36fab5276d
commit ba13055d7d
3 changed files with 32 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
docs/components/examples/events/live-cycle.js
View File

@ -1,13 +1,28 @@
import { el, on } from "deka-dom-el";
const paragraph= el("p", "See lifecycle events in console.",
el=> log({ type: "dde:created", detail: el }),
on.connected(log),
on.disconnected(log),
);
function allLifecycleEvents(){
return el("form", null,
el=> log({ type: "dde:created", detail: el }),
on.connected(log),
on.disconnected(log),
).append(
el("select", { id: "country" }, on.host(select => {
// This runs when the host (select) is ready with all its options
select.value = "cz"; // Pre-select Czechia
log({ type: "dde:on.host", detail: select });
})).append(
el("option", { value: "au", textContent: "Australia" }),
el("option", { value: "ca", textContent: "Canada" }),
el("option", { value: "cz", textContent: "Czechia" }),
),
el("p", "See lifecycle events in console."),
);
}
document.body.append(
paragraph,
el("button", "Remove", on("click", ()=> paragraph.remove()))
el(allLifecycleEvents),
el("button", "Remove Element", on("click", function(){
this.previousSibling.remove();
}))
);
/** @param {Partial<CustomEvent>} event */