Cleaned up code, added support for lists, classes, attributes, and more. Added more test code, everything appears to be working. More cleanup and testing is needed.

This commit is contained in:
2020-07-28 09:04:04 -07:00
parent 8f9ade2dbd
commit b591a42370
10 changed files with 619 additions and 12 deletions

48
src/sheet.js Normal file
View File

@ -0,0 +1,48 @@
import { IgniteElement } from './ignite-element.js';
import { IgniteTemplate, div, html, list, a } from './ignite-template.js';
class Sheet extends IgniteElement {
constructor() {
super();
this.show = false;
this.items = [];
this.href = "www.google.com";
}
properties() {
return [
"show",
"name",
"items",
"href"
];
}
render() {
return this.template
.class(this.show)
.child(
new div(
new html("<h2>this is before</h2>"),
new list(this.items, (item) => {
return new html(`<h1>${item}</h1>`)
}),
new html("<h2>this is after</h2>"),
new a("this is a link").attribute("href", this.href)
)
);
}
}
class SheetTemplate extends IgniteTemplate {
constructor(...items) {
super(items);
this.tagName = "md-sheet";
}
}
customElements.define("md-sheet", Sheet);
export { SheetTemplate as Sheet };