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.
8 years ago
8 years ago
8 years ago
8 years ago
8 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago