ceb v1.0.4
<ceb/>
custom-element-builder
<ceb/>
is a library helping to develop Custom Elements (v0).
Its core is a builder which executes others builders.
By this way, <ceb/>
is natively opened to extensions and builders easily sharable.
Obviously, <ceb/>
exposes builders and helpers handling the common needs:
- property
- attribute
- events
- delegation to child element (attribute, property and method)
- templating
- event dispatching
- type checking
- etc.
A ceb's playground is available showing how-to build simple and more complex Custom Elements.
Quick overview
import {element, property, method, dispatchCustomEvent} from 'ceb';
// create a fresh element builder
let builder = element();
builder.builders(
// add a property named foo initialized to 0
property('foo').value(0),
// add a method named incFoo, which will increment the foo value
method('incFoo').invoke( (el, num=1) => el.foo = el.foo + num )
);
builder.builders(
// add a method named bar, which will dispatch the custom event 'bar' when invoked
method('bar').invoke( (el, detail) => dispatchCustomEvent(el, 'bar', {detail}) )
);
// build and register the custom element
let CebExample = builder.register('ceb-example');
// export the class of the custom element
export default CebExample;
// create an instance of ceb-example
let cebExample = document.createElement('ceb-example');
// by default foo is 0
console.log(cebExample.foo) // => 0
cebExample.incFoo();
console.log(cebExample.foo) // => now it's: 1
cebExample.incFoo(2);
console.log(cebExample.foo) // => and finally: 3
cebExample.bar('foo'); // => dispatch the custom event 'bar' with the detail 'foo'
Download
<ceb/>
is available from npm and bower.
From npm:
npm install ceb
From bower:
bower install ceb
<ceb/>
can also be fetched from a unpkg, a CDN:
<script src="https://unpkg.com/ceb/dist/umd/ceb.js"></script>
<script src="https://unpkg.com/ceb/dist/umd/ceb.min.js"></script>
License
Released under the MIT license.
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago