Image Generator Demo: UI/UX (#58)

This PR updates the UI/UX of the Image Generator Demo.

* Hierarchy moved to the left of the editor view instead of overlaying
  it
* Hierarchy can now be resized
* Bevy canvas resizes trigger a screen-capture update
* Transform Toolbar now centered over the editor view instead of the
  entire viewport
* Added Prompt and Seed text fields, with a refresh button for the Seed

studio-web/src/lib/studio.element.ts

@@ -67,7 +67,14 @@ export class StudioElement extends LitElement {
 
 	#onResize(): void {
 		const { width, height } = this.getBoundingClientRect();
+
 		studio.resize(new ViewportSize(width, height));
+
+		this.dispatchEvent(new CustomEvent("viewport-resized", {
+			detail: { width, height },
+			bubbles: true,
+			composed: true,
+		}));
 	}
 
 	#tick(): void {
@@ -120,6 +127,7 @@ export class StudioElement extends LitElement {
 	}
 
 	protected override render = () => html`
-		<slot name="canvas"></slot>
+		<slot name="canvas" part="canvas"></slot>
+		<slot></slot>
 	`;
 }