feat: deployable design studio and updated component showcase

test/hosted-studio.test.ts

@@ -0,0 +1,33 @@
+import { expect, test } from "bun:test";
+import { createStudioHandler } from "@wrnexus/design-studio/server";
+import { CORE_DESIGN_SYSTEMS } from "@wrnexus/design-system";
+
+test("deployed Studio serves assets and isolated previews without application writes", async () => {
+  const handler = await createStudioHandler({
+    hosted: { basePath: "/design-studio" },
+  });
+  const origin = "https://components.example";
+  const html = await handler(new Request(origin + "/design-studio/"));
+  expect(await html.text()).toContain('<base href="/design-studio/">');
+  expect(
+    (await handler(new Request(origin + "/design-studio/studio.js"))).status,
+  ).toBe(200);
+  const request = (path: string, from = origin) =>
+    handler(
+      new Request(origin + "/design-studio/api/" + path, {
+        method: "POST",
+        headers: { "content-type": "application/json", origin: from },
+        body: JSON.stringify({
+          system: CORE_DESIGN_SYSTEMS.soft,
+          base: "none",
+        }),
+      }),
+    );
+  expect((await request("apply")).status).toBe(409);
+  expect((await request("preview", "https://other.example")).status).toBe(403);
+  const preview = await request("preview");
+  expect(preview.status).toBe(200);
+  const { url } = await preview.json();
+  expect(url).toStartWith("/design-studio/preview/");
+  expect((await handler(new Request(origin + url))).status).toBe(200);
+});