add examples for mpa

Sascha Schulz

2025-01-13 2a64dd8fd50b8771244e7d4a0565315d7ee6a832

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
class MyComponent extends HTMLElement { 
    constructor() { 
        super(); 
 
        const shadowRoot = this.attachShadow({mode: "open"}); 
 
        shadowRoot.innerHTML = ` 
            <style> 
                :host { 
                    display: block; 
                } 
                 
                .inner { 
                    /* Inner Styles */ 
                } 
            </style> 
             
            <div class="inner">Web Component Text with inner class</div> 
            <div class="outer">Web Component Text with outer class</div>     
        `; 
    } 
} 
 
window.customElements.define("my-component", MyComponent);