feat: add ComfyUI integration for image generation

- Implemented ComfyUI API for generating images with various modes (text-to-image, image-to-image, inpaint, outpaint).
- Created GenerateSheet and associated controls for user input on generation settings.
- Added subtle scrollbar styles for improved UI experience.
- Enhanced canvas input handling to ignore key events when focused on editable elements.
- Optimized canvas resizing logic to prevent unnecessary dispatches.
- Introduced error handling for generation failures and loading models.
- Added functionality to upload images and masks for inpainting.

view/GenerateSheet.tsx

@@ -0,0 +1,32 @@
+import type { ImageDocument } from "@core/document";
+import type { SelectionState, ViewportState } from "@editor/state";
+import type { GenerateSettings } from "@editor/tools";
+import type { AppStore } from "@editor/store";
+import { GenerateControls } from "./bottom-controls/GenerateControls";
+
+export type GenerateSheetProps = {
+  document: ImageDocument;
+  selection: SelectionState;
+  viewport: ViewportState;
+  settings: GenerateSettings;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  dispatch: AppStore["dispatch"];
+};
+
+export function GenerateSheet({ document, selection, viewport, settings, open, onOpenChange, dispatch }: GenerateSheetProps) {
+  return (
+    <aside
+      aria-hidden={!open}
+      aria-label="Generate settings"
+      className={`pointer-events-auto absolute bottom-6 right-4 top-24 z-20 flex w-[28rem] max-w-[calc(100vw-2rem)] flex-col overflow-hidden rounded-[2.5rem] px-4 text-sm text-white backdrop-blur-xl transition-all duration-200 ${
+        open ? "translate-x-0 opacity-100" : "pointer-events-none translate-x-8 opacity-0"
+      }`}
+    >
+      <div className="subtle-scrollbar min-h-0 flex-1 overflow-auto py-4">
+        <GenerateControls document={document} selection={selection} viewport={viewport} settings={settings} dispatch={dispatch} />
+      </div>
+    </aside>
+  );
+}
+