blob: 9403a737ee74344a608c8ea9cd1f0b1b10593d7d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
|
export { TabElement }
/* <tab-element /> */
class TabElement extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
// this.replaceChildren(template.cloneNode(true));
let template
= (document.getElementById('tab-template') as HTMLTemplateElement)
.content
// const shadowRoot = this.attachShadow({ mode: 'open' })
// .appendChild(template.cloneNode(true));
// console.log(this);
let label = this.querySelector('[slot="label"]')
let content = this.querySelector('[slot="content"]')
if (!verifySlot(label)) throw "Bad label";
if (!verifySlot(content)) throw "Bad content";
/* TODO set label hover title somewhere around here */
this.replaceChildren(template.cloneNode(true));
this.querySelector('slot[name="label"]')!.replaceWith(label);
this.querySelector('slot[name="content"]')!.replaceWith(content);
}
}
function verifySlot(el: Node | null): el is HTMLElement {
if (el === null) {
console.error("Element is null");
return false;
}
if (!(el instanceof HTMLElement)) {
console.error("Node is not an HTMLElement", el);
return false;
}
return true
}
|