JSFiddle - React, Tailwind, and code Playground

by amindunited

HTML

<state-lee>
  <button>
    Click
  </button>
</state-lee>

JavaScript

class StateLee extends HTMLElement {

	static state = {};
  static dispatch = () => {
  	console.log('dispatch');
  }

	static updateState = () => {
  	console.log('static update state fn', this)
  }

	constructor() {
    super();
    this._internals = this.attachInternals();
    // this.updateState = StateLee.updateState;
    console.log('init ', this);
	}

	get state () {
  	return this.state;
  }
	
}

customElements.define(`state-lee`, StateLee, []);


const btn = document.querySelector('button');
btn.addEventListener('click', () => {
  console.log('stately ', StateLee, StateLee.dispatch());
  const state = document.querySelector('state-lee');
  state.updateState();
  // StateLee.updateState();
  
});