27 lines
931 B
HTML
27 lines
931 B
HTML
<cat-template>
|
|
<cat-caption><cat-checkbox><cat-inherits checked='folded'></cat-inherits></cat-checkbox><cat-inherits label='label'></cat-caption>
|
|
<cat-box flex="1"><cat-inherits hidden='folded'></cat-inherits>
|
|
<cat-children></cat-children>
|
|
</cat-box>
|
|
</cat-template>
|
|
<script>
|
|
customElements.define('cat-control-group', class extends HTMLElement {
|
|
static get observedAttributes() { return ['label', 'folded']; }
|
|
attributeChangedCallback(attr, oldValue, newValue) { this[attr] = newValue; }
|
|
|
|
constructor() {
|
|
super();
|
|
document.currentScript.ownerDocument.querySelector('cat-template').cloneTo(this);
|
|
}
|
|
connectedCallback() {
|
|
this.querySelector('cat-caption').addEventListener('click', e => {
|
|
if (this.hasAttribute('folded')) {
|
|
this.removeAttribute('folded');
|
|
} else {
|
|
this.setAttribute('folded', '');
|
|
}
|
|
});
|
|
}
|
|
});
|
|
</script>
|