feat: add ctrl+v flow

web/src/lib/components/DropZone.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { ACCEPTED_IMAGE_TYPES, isSupportedImage } from '$lib/core/io';
+	import { ACCEPTED_IMAGE_TYPES, isSupportedImage, unsupportedImageMessage } from '$lib/core/io';
 
 	interface Props {
 		onFile: (file: File) => void;
@@ -16,9 +16,7 @@
 	function accept(file: File | undefined | null) {
 		if (!file) return;
 		if (!isSupportedImage(file)) {
-			onError?.(
-				`Неподдерживаемый формат файла (${file.type || 'неизвестный'}). Поддерживаются PNG, JPEG, WebP, GIF и BMP.`
-			);
+			onError?.(unsupportedImageMessage(file));
 			return;
 		}
 		onFile(file);

web/src/lib/components/ToolPage.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { imageInfo, type ImageInfo } from '$lib/core/analyze';
-	import { decodeFile } from '$lib/core/io';
+	import { decodeFile, isSupportedImage, unsupportedImageMessage } from '$lib/core/io';
 	import type { PixelImage } from '$lib/core/types';
 	import { defaultParams, outputOf, sanitizeParams, type ToolEntry } from '$lib/registry';
 	import Button from './ui/Button.svelte';
@@ -73,8 +73,28 @@
 		status = 'idle';
 		values = defaultParams(tool);
 	}
+
+	function handlePaste(event: ClipboardEvent) {
+		const items = event.clipboardData?.items;
+		if (!items) return;
+		for (const item of items) {
+			if (!item.type.startsWith('image/')) continue;
+			const file = item.getAsFile();
+			if (file) {
+				event.preventDefault();
+				if (!isSupportedImage(file)) {
+					errorText = unsupportedImageMessage(file);
+					return;
+				}
+				handleFile(file);
+			}
+			return;
+		}
+	}
 </script>
 
+<svelte:window onpaste={handlePaste} />
+
 <section>
 	<h1>{tool.title}</h1>
 	<p class="description text-muted">{tool.description}</p>

web/src/lib/core/io.ts

@@ -11,6 +11,10 @@ export function isSupportedImage(file: File): boolean {
 	return SUPPORTED_MIME_TYPES.has(file.type);
 }
 
+export function unsupportedImageMessage(file: File): string {
+	return `Неподдерживаемый формат файла (${file.type || 'неизвестный'}). Поддерживаются PNG, JPEG, WebP, GIF и BMP.`;
+}
+
 export async function decodeFile(file: File): Promise<PixelImage> {
 	const bitmap = await createImageBitmap(file);
 	try {