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

🔨 docs+addons

This commit is contained in:
2023-11-21 14:37:57 +01:00
parent c0fdec1e1e
commit ae0455f913
13 changed files with 149 additions and 144 deletions

View File

@ -1,15 +1,22 @@
import { assignAttribute, classListDeclarative } from "deka-dom-el";
import { assign, assignAttribute, classListDeclarative } from "deka-dom-el";
const paragraph= document.createElement("p");
assignAttribute(paragraph, "textContent", "Hello, world!");
assignAttribute(paragraph, "style", "color: red; font-weight: bold;");
assignAttribute(paragraph, "style", { color: "navy" });
assignAttribute(paragraph, "dataTest1", "v1");
assignAttribute(paragraph, "dataset", { test2: "v2" });
assignAttribute(paragraph, "ariaLabel", "v1");
assignAttribute(paragraph, "ariaset", { role: "none" });
assign(paragraph, { //textContent and style see above
ariaLabel: "v1", //data* see above
ariaset: { role: "none" }, // dataset see above
"=onclick": "console.log(event)",
onmouseout: console.info,
".something": "something",
classList: {} //see below
});
classListDeclarative(paragraph, {
classAdd: true,
@ -20,6 +27,7 @@ classListDeclarative(paragraph, {
});
console.log(paragraph.outerHTML);
console.log("paragraph.something=", paragraph.something);
document.body.append(
paragraph
);

View File

@ -1,7 +1,7 @@
import { el, on } from "deka-dom-el";
const abort_controller= new AbortController();
const { signal }= abort_controller;
/** @type {ddeElementModifier<HTMLButtonElement>} */
/** @type {ddeElementAddon<HTMLButtonElement>} */
const onclickOff= on("click", ()=> abort_controller.abort(), { signal });
/** @type {(ref?: HTMLOutputElement)=> HTMLOutputElement | null} */
const ref= (store=> ref=> ref ? (store= ref) : store)(null);