diff web/TiledHome.ts @ 2376:4556eebe5d73

topdir reorgs; let pdm have its src/ dir; separate vite area from light9/
author drewp@bigasterisk.com
date Sun, 12 May 2024 19:02:10 -0700
parents light9/web/TiledHome.ts@9d47c44d4ae4
children 40d5a54dec99
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/web/TiledHome.ts	Sun May 12 19:02:10 2024 -0700
@@ -0,0 +1,49 @@
+import * as React from "react";
+import { createRoot } from "react-dom/client";
+import * as FlexLayout from "flexlayout-react";
+export { Light9DeviceSettings } from "./live/Light9DeviceSettings";
+export { Light9CollectorUi } from "./collector/Light9CollectorUi";
+
+const config:FlexLayout.IJsonModel = {
+  global: {},
+  borders: [],
+  layout: {
+    type: "row",
+    weight: 100,
+    children: [
+      {
+        type: "tabset",
+        weight: 50,
+        children: [{ type: "tab", name: "devsettings", component: "light9-device-settings" }],
+      },
+      {
+        type: "tabset",
+        weight: 50,
+        children: [{ type: "tab", name: "collector", component: "light9-collector-ui" }],
+      },
+    ],
+  },
+};
+
+const e = React.createElement;
+
+// see https://github.com/lit/lit/tree/main/packages/labs/react
+
+class Main extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { model: FlexLayout.Model.fromJson(config) };
+  }
+
+  factory = (node) => {
+    var component = node.getComponent();
+    return e(component, null, "");
+  };
+
+  render() {
+    return e(FlexLayout.Layout, { model: this.state.model, factory: this.factory });
+  }
+}
+
+const root = createRoot(document.getElementById("container")!);
+root.render(React.createElement(Main));