{"version":3,"sources":["../src/components/chat/messages/ImageRenderer.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ImageRendererProps } from \"../props\";\n\n/**\n * Default image rendering component that can be customized by users.\n * Uses CSS classes for styling so users can override styles.\n */\nexport const ImageRenderer: React.FC<ImageRendererProps> = ({ image, content, className = \"\" }) => {\n  const [imageError, setImageError] = useState(false);\n  const imageSrc = `data:image/${image.format};base64,${image.bytes}`;\n  const altText = content || \"User uploaded image\";\n\n  const handleImageError = () => {\n    setImageError(true);\n  };\n\n  if (imageError) {\n    return (\n      <div className={`copilotKitImageRendering copilotKitImageRenderingError ${className}`}>\n        <div className=\"copilotKitImageRenderingErrorMessage\">Failed to load image</div>\n        {content && <div className=\"copilotKitImageRenderingContent\">{content}</div>}\n      </div>\n    );\n  }\n\n  return (\n    <div className={`copilotKitImageRendering ${className}`}>\n      <img\n        src={imageSrc}\n        alt={altText}\n        className=\"copilotKitImageRenderingImage\"\n        onError={handleImageError}\n      />\n      {content && <div className=\"copilotKitImageRenderingContent\">{content}</div>}\n    </div>\n  );\n};\n"],"mappings":";AAAA,SAAgB,gBAAgB;AAkB1B,SACE,KADF;AAXC,IAAM,gBAA8C,CAAC,EAAE,OAAO,SAAS,YAAY,GAAG,MAAM;AACjG,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,WAAW,cAAc,MAAM,iBAAiB,MAAM;AAC5D,QAAM,UAAU,WAAW;AAE3B,QAAM,mBAAmB,MAAM;AAC7B,kBAAc,IAAI;AAAA,EACpB;AAEA,MAAI,YAAY;AACd,WACE,qBAAC,SAAI,WAAW,0DAA0D,aACxE;AAAA,0BAAC,SAAI,WAAU,wCAAuC,kCAAoB;AAAA,MACzE,WAAW,oBAAC,SAAI,WAAU,mCAAmC,mBAAQ;AAAA,OACxE;AAAA,EAEJ;AAEA,SACE,qBAAC,SAAI,WAAW,4BAA4B,aAC1C;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS;AAAA;AAAA,IACX;AAAA,IACC,WAAW,oBAAC,SAAI,WAAU,mCAAmC,mBAAQ;AAAA,KACxE;AAEJ;","names":[]}