feat: release design system engine, studio and component contracts

packages/ui/test/drawflow-canvas.test.ts

@@ -0,0 +1,20 @@
+import { test, expect } from "bun:test";
+import { readFileSync } from "node:fs";
+import { renderComponent, mountHtml } from "../../test/src/index.ts";
+test("Drawflow canvas preserves graph data and forwards editor outputs", async () => {
+  const source = readFileSync(new URL("../components/DrawflowCanvas.wrn", import.meta.url), "utf8");
+  const nodes = [{ id: "a", label: "<script>unsafe</script>", x: 40, y: 60, ports: [] }];
+  const dom = mountHtml(await renderComponent(source, { nodes }));
+  const root = dom.querySelector("[data-drawflow-editor]") as HTMLElement;
+  expect(JSON.parse(root.dataset.flowNodes!)).toEqual(nodes);
+  expect(root.querySelector("script")).toBeNull();
+  let detail: any;
+  root.addEventListener("select", (e: any) => (detail = e.detail));
+  root.dispatchEvent(
+    new (dom.window as { CustomEvent: typeof CustomEvent }).CustomEvent("flowselect", {
+      detail: { id: "a" },
+      bubbles: true,
+    }),
+  );
+  expect(detail.id).toBe("a");
+});