create custom html element

1class className extends HTMLElement{//or any othere element you want
2	contructor(){
3    super()//to call the parent class contructor
4      this._root = this.attachShadow({mode:"open"})//attach a shadow dom for easy manipulation
5      connectedCallback(){
6      	//runs code everytime the element is used on the html page
7      }
8      disconnectedCallback(){
9      	//runs everytime the element is removed from the dom
10      }
11      adoptedCallback(){
12      	//runs everytime the element is moved
13      }
14      attributeChangedCallback(nameOfAtr, oldValue, newValue){
15      	//runs everytime the elements attributes are changed in any way
16      }
17    }
18}
19window.customElements.define("what you want your tag name to be",class name of tag)//to add the custom element and be able to add in in html