class ProfileModal extends HTMLElement {
	static observedAttributes = ["target-id"];
	#attributes = [];

	constructor() {
		super();
		this.#attributes.push({name: "target-id", value: this.getAttribute("target-id")});
		const _session = session.get_sync();
		const root = create_element("template", {}, [
			create_element("h4", {innerText: _session.username, style: {margin: 0}}),
			create_element("p", {innerText: _session.role}),
			create_element("button", {innerText: "Log out", classList: ["do-logout"]}),
		]);
		this.style.padding = "5px";
		this.innerHTML = root.innerHTML;
	}

	attributeChangedCallback(name, oldValue, newValue) {
	}
}

customElements.define("profile-modal", ProfileModal, {extends: "dialog"});

class ElementBase extends HTMLElement {
	constructor() {
		super();
	}
}