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

🔤 just typos + status updates

Browse Source
This commit is contained in:
Jan Andrle
2025-03-07 14:54:48 +01:00
parent 4366027658
commit d56d5e45d5
1 changed files with 24 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
README.md
View File

@ -25,26 +25,27 @@ function EmojiCounter({ initial }) {
/** @param {HTMLOptionElement} el */ /** @param {HTMLOptionElement} el */
const isSelected= el=> (el.selected= el.value===initial); const isSelected= el=> (el.selected= el.value===initial);
// 🔄 View - UI updates automatically when signals change // 🔄 View - UI updates automatically when signals change
return el().append( return el().append(
el("p", { el("p", {
className: "output", className: "output",
textContent: S(() => textContent: S(() =>
`Hello World ${emoji.get().repeat(clicks.get())}`), `Hello World ${emoji.get().repeat(clicks.get())}`),
}), }),
// 🎮 Controls - Update state on events // 🎮 Controls - Update state on events
el("button", { textContent: "Add Emoji" }, el("button", { textContent: "Add Emoji" },
on("click", () => count.set(count.get() + 1)) on("click", () => count.set(count.get() + 1))
), ),
el("select", null, on("change", e => emoji.set(e.target.value))) el("select", null,
.append( on("change", e => emoji.set(e.target.value))
el(Option, "🎉", isSelected), ).append(
el(Option, "🚀", isSelected), el(Option, "🎉", isSelected),
el(Option, "💖", isSelected), el(Option, "🚀", isSelected),
) el(Option, "💖", isSelected),
)
); );
} }
function Option({ textContent }){ function Option({ textContent }){
@ -61,10 +62,12 @@ Creating reactive elements, components, and Web Components using the native
- ✅ **No build step required** — use directly in browsers or Node.js - ✅ **No build step required** — use directly in browsers or Node.js
- ☑️ **Lightweight** — ~10-15kB minified (original goal 10kB) with zero/minimal dependencies - ☑️ **Lightweight** — ~10-15kB minified (original goal 10kB) with zero/minimal dependencies
- ✅ **Declarative & functional approach** for clean, maintainable code - ✅ **Declarative & functional approach** for clean, maintainable code
- ✅ **Optional signals** with support for custom reactive implementations - ✅ **Signals and events** for reactive UI
- ✅ **Optional build-in signals** with support for custom reactive implementations
- ✅ **Server-side rendering** support via [jsdom](https://github.com/jsdom/jsdom) - ✅ **Server-side rendering** support via [jsdom](https://github.com/jsdom/jsdom)
- 🔄 **TypeScript support** (work in progress) - ✅ **TypeScript support** (work in progress)
- 🔄 **Enhanced Web Components** support (work in progress) - ☑️ **Support for debugging with browser DevTools** without extensions
- ☑️ **Enhanced Web Components** support (work in progress)
## Why Another Library? ## Why Another Library?