:bug: Fixed bug where ffi code incorrectly imported runtime.

4 files changed, 73 insertions, 65 deletions

diff --git a/src/client-component.ffi.mjs b/src/client-component.ffi.mjs
index 0970e7f..c64527f 100644
--- a/src/client-component.ffi.mjs
+++ b/src/client-component.ffi.mjs
@@ -1,5 +1,5 @@
 import { Ok, Error, isEqual } from "./gleam.mjs";
-import { Dispatch, Shutdown } from "./lustre/runtime.mjs";
+import { Dispatch, Shutdown } from "./lustre/internals/runtime.mjs";
 import {
   ComponentAlreadyRegistered,
   BadComponentName,
@@ -16,59 +16,63 @@ export function register({ init, update, view, on_attribute_change }, name) {
 
   window.customElements.define(
     name,
-    class LustreClientComponent extends HTMLElement {
-      #root = document.createElement("div");
-      #application = null;
+    makeComponent(init, update, view, on_attribute_change),
+  );
 
-      static get observedAttributes() {
-        return on_attribute_change.entries().map(([name, _]) => name);
-      }
+  return new Ok(undefined);
+}
 
-      constructor() {
-        super();
-        on_attribute_change.forEach((decoder, name) => {
-          Object.defineProperty(this, name, {
-            get() {
-              return this[`_${name}`] || this.getAttribute(name);
-            },
+function makeComponent(init, update, view, on_attribute_change) {
+  return class LustreClientComponent extends HTMLElement {
+    #root = document.createElement("div");
+    #application = null;
 
-            set(value) {
-              const prev = this[name];
-              const decoded = decoder(value);
+    static get observedAttributes() {
+      return on_attribute_change.entries().map(([name, _]) => name);
+    }
 
-              if (decoded.isOk() && !isEqual(prev, value)) {
-                this.#application
-                  ? this.#application.send(new Dispatch(decoded[0]))
-                  : window.requestAnimationFrame(() =>
-                      this.#application.send(new Dispatch(decoded[0]))
-                    );
-              }
+    constructor() {
+      super();
+      on_attribute_change.forEach((decoder, name) => {
+        Object.defineProperty(this, name, {
+          get() {
+            return this[`_${name}`] || this.getAttribute(name);
+          },
 
-              if (typeof value === "string") {
-                this.setAttribute(name, value);
-              } else {
-                this[`_${name}`] = value;
-              }
-            },
-          });
-        });
-      }
+          set(value) {
+            const prev = this[name];
+            const decoded = decoder(value);
 
-      connectedCallback() {
-        this.#application = new LustreClientApplication(
-          init(),
-          update,
-          view,
-          this.#root
-        );
-        this.appendChild(this.#root);
-      }
+            if (decoded.isOk() && !isEqual(prev, value)) {
+              this.#application
+                ? this.#application.send(new Dispatch(decoded[0]))
+                : window.requestAnimationFrame(() =>
+                    this.#application.send(new Dispatch(decoded[0])),
+                  );
+            }
 
-      disconnectedCallback() {
-        this.#application.send(new Shutdown());
-      }
+            if (typeof value === "string") {
+              this.setAttribute(name, value);
+            } else {
+              this[`_${name}`] = value;
+            }
+          },
+        });
+      });
+    }
+
+    connectedCallback() {
+      this.#application = new LustreClientApplication(
+        init(),
+        update,
+        view,
+        this.#root,
+      );
+      this.appendChild(this.#root);
     }
-  );
 
-  return new Ok(null);
+    disconnectedCallback() {
+      this.#application.send(new Shutdown());
+    }
+  };
 }
diff --git a/src/client-runtime.ffi.mjs b/src/client-runtime.ffi.mjs
index bb3bf9d..12c8627 100644
--- a/src/client-runtime.ffi.mjs
+++ b/src/client-runtime.ffi.mjs
@@ -1,5 +1,5 @@
 import { ElementNotFound, NotABrowser } from "./lustre.mjs";
-import { Dispatch, Shutdown } from "./lustre/runtime.mjs";
+import { Dispatch, Shutdown } from "./lustre/internals/runtime.mjs";
 import { morph } from "./vdom.ffi.mjs";
 import { Ok, Error, isEqual } from "./gleam.mjs";
 
diff --git a/src/server-component.mjs b/src/server-component.mjs
index b7aec2c..373f4cd 100644
--- a/src/server-component.mjs
+++ b/src/server-component.mjs
@@ -63,22 +63,26 @@ export class LustreServerComponent extends HTMLElement {
 
           this.#socket?.close();
           this.#socket = new WebSocket(`ws://${window.location.host}${route}`);
-          this.#socket.addEventListener("message", ({ data }) => {
-            const [kind, ...payload] = JSON.parse(data);
+          this.#socket.addEventListener("message", (message) =>
+            this.messageReceivedCallback(message),
+          );
+        }
+      }
+    }
+  }
 
-            switch (kind) {
-              case Constants.diff:
-                return this.diff(payload);
+  messageReceivedCallback({ data }) {
+    const [kind, ...payload] = JSON.parse(data);
 
-              case Constants.emit:
-                return this.emit(payload);
+    switch (kind) {
+      case Constants.diff:
+        return this.diff(payload);
 
-              case Constants.init:
-                return this.init(payload);
-            }
-          });
-        }
-      }
+      case Constants.emit:
+        return this.emit(payload);
+
+      case Constants.init:
+        return this.init(payload);
     }
   }
 
@@ -107,7 +111,7 @@ export class LustreServerComponent extends HTMLElement {
 
           if (prev !== value) {
             this.#socket?.send(
-              JSON.stringify([Constants.attrs, [[attr, value]]])
+              JSON.stringify([Constants.attrs, [[attr, value]]]),
             );
           }
         },
diff --git a/src/server-runtime.ffi.mjs b/src/server-runtime.ffi.mjs
index e82e82d..5432824 100644
--- a/src/server-runtime.ffi.mjs
+++ b/src/server-runtime.ffi.mjs
@@ -5,7 +5,7 @@ import {
   Event,
   RemoveRenderer,
   Shutdown,
-} from "./lustre/runtime.mjs";
+} from "./lustre/internals/runtime.mjs";
 
 export class LustreServerApplication {
   #queue = [];
@@ -107,7 +107,7 @@ export class LustreServerApplication {
     while (this.#effects.length) {
       this.#effects.shift()(
         (msg) => this.send(new Dispatch(msg)),
-        (event, data) => this.emit(event, data)
+        (event, data) => this.emit(event, data),
       );
     }
 
@@ -139,5 +139,5 @@ export const start = (app, selector, flags) =>
     selector,
     app.init,
     app.update,
-    app.view
+    app.view,
   );