{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "transform-image", "type": "registry:item", "description": "Transform and optimize images using sharp", "dependencies": [ "sharp" ], "files": [ { "path": "steps/transform-image.ts", "content": "import { FatalError } from \"workflow\"\nimport { Buffer } from \"buffer\"\n\ninterface TransformImageOptions {\n imageUrl: string\n width?: number\n height?: number\n format?: \"jpeg\" | \"png\" | \"webp\" | \"avif\"\n quality?: number\n fit?: \"cover\" | \"contain\" | \"fill\" | \"inside\" | \"outside\"\n}\n\n/**\n * Transform and optimize images using sharp\n *\n * @example\n * const buffer = await transformImage({\n * imageUrl: 'https://example.com/image.jpg',\n * width: 800,\n * height: 600,\n * format: 'webp',\n * quality: 80\n * });\n */\nexport async function transformImage(options: TransformImageOptions) {\n \"use step\"\n\n const { imageUrl, width, height, format = \"webp\", quality = 80, fit = \"cover\" } = options\n\n if (!imageUrl) {\n throw new FatalError(\"imageUrl is required\")\n }\n\n // Fetch the image\n const response = await fetch(imageUrl)\n if (!response.ok) {\n throw new Error(`Failed to fetch image: ${response.statusText}`)\n }\n\n const arrayBuffer = await response.arrayBuffer()\n const buffer = Buffer.from(arrayBuffer)\n\n // Dynamic import sharp (server-side only)\n const sharp = (await import(\"sharp\")).default\n\n let transformer = sharp(buffer)\n\n // Apply transformations\n if (width || height) {\n transformer = transformer.resize(width, height, { fit })\n }\n\n // Convert format\n switch (format) {\n case \"jpeg\":\n transformer = transformer.jpeg({ quality })\n break\n case \"png\":\n transformer = transformer.png({ quality })\n break\n case \"webp\":\n transformer = transformer.webp({ quality })\n break\n case \"avif\":\n transformer = transformer.avif({ quality })\n break\n }\n\n const transformedBuffer = await transformer.toBuffer()\n\n return {\n buffer: transformedBuffer,\n size: transformedBuffer.length,\n format,\n dimensions: width && height ? { width, height } : undefined,\n }\n}\n", "type": "registry:file", "target": "steps/transform-image.ts" } ] }