diff options
| -rw-r--r-- | src/lustre.ffi.mjs | 16 |
1 files changed, 14 insertions, 2 deletions
diff --git a/src/lustre.ffi.mjs b/src/lustre.ffi.mjs index 25d82ae..39ba9ec 100644 --- a/src/lustre.ffi.mjs +++ b/src/lustre.ffi.mjs @@ -145,14 +145,16 @@ export const setup_component = ( customElements.define( name, class extends HTMLElement { + static get observedAttributes() { + return on_attribute_change.entries().map(([name, _]) => name); + } + #container = document.createElement("div"); #app = null; #dispatch = null; constructor() { super(); - this.attachShadow({ mode: "open" }); - this.shadowRoot.appendChild(this.#container); this.#app = new App(init, update, render); const dispatch = this.#app.start(this.#container); @@ -186,6 +188,16 @@ export const setup_component = ( }); } + connectedCallback() { + this.appendChild(this.#container); + } + + attributeChangedCallback(name, prev, next) { + if (prev !== next) { + this[name] = next; + } + } + disconnectedCallback() { this.#app.destroy(); } |