Fixed issues with the chip list and editable label. Added initial collapsable-region and icon tabs code.
This commit is contained in:
47
collapsable-region.js
Normal file
47
collapsable-region.js
Normal file
@@ -0,0 +1,47 @@
|
||||
import { IgniteElement } from "../ignite-html/ignite-element.js";
|
||||
import { IgniteTemplate, div, slot } from "../ignite-html/ignite-template.js";
|
||||
|
||||
class CollapsableRegion extends IgniteElement {
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
||||
get styles() {
|
||||
return `
|
||||
mt-collapsable-region .title:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
`;
|
||||
}
|
||||
|
||||
get properties() {
|
||||
return {
|
||||
collapse: true,
|
||||
title: "Placeholder"
|
||||
};
|
||||
}
|
||||
|
||||
render() {
|
||||
return this.template.child(
|
||||
new div()
|
||||
.class("title")
|
||||
.onClick(() => this.collapse = !this.collapse)
|
||||
.child(this.title),
|
||||
new div().hide(this.collapse).child(
|
||||
new slot(this)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class CollapsableRegionTemplate extends IgniteTemplate {
|
||||
constructor(...children) {
|
||||
super("mt-collapsable-region", children);
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("mt-collapsable-region", CollapsableRegion);
|
||||
|
||||
export {
|
||||
CollapsableRegionTemplate as CollapsableRegion
|
||||
};
|
||||
Reference in New Issue
Block a user