Mercurial > code > home > repos > light9
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));