WebReflection / Dom Augmentor
Licence: isc
Same as augmentor but with DOM oriented useEffect handling via dropEffect.
Stars: ✭ 55
Programming Languages
javascript
184084 projects - #8 most used programming language
dom-augmentor
Social Media Photo by stephan sorkin on Unsplash
This is exactly the same as the augmentor module, except it handles automatically effects per DOM nodes.
Compatible with any function that returns a DOM node, or a fragment, or a hyperhtml like Wire instance.
Breaking in v1
- the default export has been removed, it's
import {augmentor} from 'augmentor'
now - the
augmentor
library is the v1 one - effects now work more reliably and there are no constrains for the guards
Example
const {augmentor: $, useEffect, useRef, useState} = augmentor;
const {render, hook} = lighterhtml;
const {html, svg} = hook(useRef);
const Button = (text) => $(() => {
useEffect(
() => {
console.log('connected');
return () => console.log('disconnected');
},
[]
);
const [i, increment] = useState(0);
return html`
<button onclick=${() => increment(i + 1)}>
${text} ${i}
</button>`;
});
const button = Button('hello');
render(document.body, button);
// alternatively
// document.body.appendChild(button());
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].