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:
48
src/sheet.js
Normal file
48
src/sheet.js
Normal 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 };
|
Reference in New Issue
Block a user