elastomer
v2.0.3
Published
A web-component library for commonjs based on rivet
Downloads
15
Maintainers
Readme
elastomer
A web-component library for commonjs based on rivet
Overview
ALPHA version - incomplete doc / incomplete tests
Getting Started
Install the module with: npm install elastomer --save
Getting Started
'use strict'
const elastomer = require('nova-elastomer')
require('nova-elastomer/webcomponents-lite.js') // Optional
class Foobar extends elastomer.HTMLElastomer {
initialize (elasto) {
elasto.html = `
<h2>{{title}}</h2>
<ul>
<li nv-each-item="list">{{item.label}}</li>
</ul>
<content></content>`
elasto.css = `:host {}`
}
link (scope, elasto) {
scope.list = [
{ label: 'A' },
{ label: 'B' }
]
elasto.mapAttribute('title')
}
}
module.exports = elastomer('nova-foobar', { prototype: Foobar.prototype })
Now you can use the new <nova-foobar>
tag
<div>
<nova-foobar title="Hello world">
<p>The future is now</p>
</nova-foobar>
</div>
The pseudo-dom produced looks like:
<div>
<nova-foobar title="Hello world">
<h2>Hello world</h2>
<ul>
<li>A</li>
<li>B</li>
</ul>
<p>The future is now</p>
</nova-foobar>
</div>
License: MIT