Enhance canvas functionality with new node types and validation

- Added support for new canvas node types: curves, color-adjust, light-adjust, detail-adjust, and render.
- Implemented validation for adjustment nodes to restrict incoming edges to one.
- Updated canvas connection validation to improve user feedback on invalid connections.
- Enhanced node creation and rendering logic to accommodate new node types and their properties.
- Refactored related components and utilities for better maintainability and performance.

lib/image-pipeline/preview-renderer.ts

@@ -0,0 +1,48 @@
+import type { PipelineStep } from "@/lib/image-pipeline/contracts";
+import { computeHistogram, type HistogramData } from "@/lib/image-pipeline/histogram";
+import { applyPipelineStep } from "@/lib/image-pipeline/render-core";
+import { loadSourceBitmap } from "@/lib/image-pipeline/source-loader";
+
+export type PreviewRenderResult = {
+  width: number;
+  height: number;
+  imageData: ImageData;
+  histogram: HistogramData;
+};
+
+export async function renderPreview(options: {
+  sourceUrl: string;
+  steps: readonly PipelineStep[];
+  previewWidth: number;
+}): Promise<PreviewRenderResult> {
+  const bitmap = await loadSourceBitmap(options.sourceUrl);
+  const width = Math.max(1, Math.round(options.previewWidth));
+  const height = Math.max(1, Math.round((bitmap.height / bitmap.width) * width));
+
+  const canvas = document.createElement("canvas");
+  canvas.width = width;
+  canvas.height = height;
+  const context = canvas.getContext("2d", { willReadFrequently: true });
+  if (!context) {
+    throw new Error("Preview renderer could not create 2D context.");
+  }
+
+  context.drawImage(bitmap, 0, 0, width, height);
+  const imageData = context.getImageData(0, 0, width, height);
+
+  for (let index = 0; index < options.steps.length; index += 1) {
+    applyPipelineStep(imageData.data, options.steps[index]!, width, height);
+    await new Promise<void>((resolve) => {
+      requestAnimationFrame(() => resolve());
+    });
+  }
+
+  const histogram = computeHistogram(imageData.data);
+
+  return {
+    width,
+    height,
+    imageData,
+    histogram,
+  };
+}