web-components/index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Web Components</title>
  </head>
  <body>
    <main>
      <seam-connect-account-button
        publishable-key="seam_pk1J0Bgui_oYEuzDhOqUzSBkrPmrNsUuKL"
      ></seam-connect-account-button>
      <seam-device-table
        publishable-key="seam_pk1J0Bgui_oYEuzDhOqUzSBkrPmrNsUuKL"
      ></seam-device-table>
    </main>
    <script type="module" src="https://react.seam.co/v/3.0.2/dist/elements.js"></script>
    <script>
      globalThis.customElements.whenDefined("seam-device-table").then(() => {
        const elements = globalThis.document.getElementsByTagName("seam-device-table");

        const element = elements[0];

        if (element == null) {
          throw new Error("Cannot find seam-device-table in document");
        }

        element.onDeviceClick = (deviceId) => {
          console.log(deviceId);
        };
      });
    </script>
  </body>
</html>