just so much groundwork

ui/button.ts

@@ -0,0 +1,39 @@
+import { Doodler, Vector } from "@bearmetal/doodler";
+import { getContext, getContextItem } from "../lib/context.ts";
+
+export function addButton(props: {
+  text: string;
+  onClick: () => void;
+  style?: {
+    color?: string;
+    fillColor?: string;
+    strokeColor?: string;
+    weight?: number;
+    noStroke?: boolean;
+    noFill?: boolean;
+  };
+  at: [Vector, Vector];
+}) {
+  const doodler = getContextItem<Doodler>("doodler");
+  const { text, onClick, style } = props;
+  const { x, y } = props.at[1].copy().sub(props.at[0]);
+  const id = doodler.addUIElement(
+    "rectangle",
+    props.at[0],
+    x,
+    y,
+    style,
+  );
+  doodler.registerClickable(props.at[0], props.at[1], onClick);
+  return {
+    id,
+    text,
+    onClick,
+    style,
+  };
+}
+
+export function removeButton(id: string, onClick: () => void) {
+  getContextItem<Doodler>("doodler").removeUIElement(id);
+  getContextItem<Doodler>("doodler").unregisterClickable(onClick);
+}