X-Element's vision is to provide an agnostic non framework that enhances custom elements with functionality and data binding that mimics native custom element standards.
-
👶 Simple to learn if you know custom elements you know X-Element.
-
📦 Shareable A single class to build a single component or an entire app.
-
⚡ Fast Tiny footprint ~15KB (minified and compressed).
-
🏗 Framework Agnostic Use X-Element with any framework - React, Vue, Angular...
https://xeaone.github.io/element/
import XElement from '/x-element.js';
MyElement extends XElement {
greeting: '',
greet () { this.greeting = 'Greeting'; }
constructor () {
super();
this.greeting = 'Hello World';
this.shadowRoot.innerHTML = `
<h1>{{title}}</h1>
<button onclick="{{greet()}}">Greet</button>;
`;
}
}
MyElement.define();https://esm.sh/@xeaone/element
https://cdn.jsdelivr.net/gh/xeaone/element/pro/index.js
https://cdn.jsdelivr.net/npm/@xeaone/element/pro/index.js/+esm
https://www.npmjs.com/package/@xeaone/element
Originally called Oxe and still available on the oxe branch
Why You Should Choose MPL-2.0 This project is licensed under the MPL-2.0 License