--- a/light9/live/Effect.ts	Wed May 24 14:45:25 2023 -0700
+++ b/light9/live/Effect.ts	Thu May 25 11:46:08 2023 -0700
@@ -5,6 +5,7 @@
 import { SyncedGraph } from "../web/SyncedGraph";
 import { shortShow } from "../web/show_specific";
 
+// todo: Align these names with newtypes.py, which uses HexColor and VTUnion.
 type Color = string;
 export type ControlValue = number | Color | NamedNode;
 

--- a/light9/live/Light9DeviceControl.ts	Wed May 24 14:45:25 2023 -0700
+++ b/light9/live/Light9DeviceControl.ts	Thu May 25 11:46:08 2023 -0700
@@ -84,9 +84,10 @@
           <resource-display id="mainLabel" .uri="${this.uri}"></resource-display>
           a <resource-display minor .uri="${this.deviceClass}"></resource-display>
         </h2>
+
         ${this.deviceAttrs.map(
           (dattr: DeviceAttrRow) => html`
-            <div xon-click="onAttrClick" class="deviceAttr ${dattr.attrClasses}">
+            <div @click="onAttrClick" class="deviceAttr ${dattr.attrClasses}">
               <span>attr <resource-display minor .uri="${dattr.uri}"></resource-display></span>
               <light9-live-control
                 .device="${this.uri}"

--- a/light9/live/Light9Listbox.ts	Wed May 24 14:45:25 2023 -0700
+++ b/light9/live/Light9Listbox.ts	Thu May 25 11:46:08 2023 -0700
@@ -1,8 +1,9 @@
 import debug from "debug";
-const log = debug("listbox");
 import { css, html, LitElement, PropertyValues } from "lit";
 import { customElement, property } from "lit/decorators.js";
-export type Choice = {uri:string,label:string}
+const log = debug("listbox");
+export type Choice = { uri: string; label: string };
+
 @customElement("light9-listbox")
 export class Light9Listbox extends LitElement {
   static styles = [

--- a/light9/live/Light9LiveControl.ts	Wed May 24 14:45:25 2023 -0700
+++ b/light9/live/Light9LiveControl.ts	Thu May 25 11:46:08 2023 -0700
@@ -1,15 +1,17 @@
 import debug from "debug";
-const log = debug("control");
-import { css, html, LitElement, PropertyPart, PropertyValues } from "lit";
+import { css, html, LitElement, PropertyValues } from "lit";
 import { customElement, property } from "lit/decorators.js";
-import { NamedNode } from "n3";
-import { getTopGraph } from "../web/RdfdbSyncedGraph";
+import { Literal, NamedNode } from "n3";
 import { SyncedGraph } from "../web/SyncedGraph";
 import { ControlValue } from "./Effect";
 import { GraphToControls } from "./GraphToControls";
 import { DeviceAttrRow } from "./Light9DeviceControl";
 import { Choice } from "./Light9Listbox";
+
+const log = debug("control");
+
 export { Slider } from "@material/mwc-slider";
+// UI for one device attr (of any type).
 @customElement("light9-live-control")
 export class Light9LiveControl extends LitElement {
   graph!: SyncedGraph;

--- a/light9/live/Light9LiveControls.ts	Wed May 24 14:45:25 2023 -0700
+++ b/light9/live/Light9LiveControls.ts	Thu May 25 11:46:08 2023 -0700
@@ -99,7 +99,7 @@
     log(`found ${classes.length} device classes`);
     uniq(sortBy(classes, "value"), true).forEach((dc) => {
       sortBy(this.graph.subjects(U("rdf:type"), dc), "value").forEach((dev) => {
-        log(`found dev ${dev.value}`)
+        log(`found dev ${dev.value}`);
         this.devices.push(dev as NamedNode);
       });
     });