diff --git a/packages/ui/src/components/ChatMessage/ChatMessage.tsx b/packages/ui/src/components/ChatMessage/ChatMessage.tsx index d564612d5a..97be4e8acc 100644 --- a/packages/ui/src/components/ChatMessage/ChatMessage.tsx +++ b/packages/ui/src/components/ChatMessage/ChatMessage.tsx @@ -241,6 +241,16 @@ const ChatContentRenderer = createContentRenderer({ reference: { contentSize: '$l', }, + image: { + alignItems: 'flex-start', + imageProps: { + maxWidth: 600, + maxHeight: 600, + height: 'auto', + width: 'auto', + objectFit: 'contain', + }, + }, }, }); diff --git a/packages/ui/src/components/Image.tsx b/packages/ui/src/components/Image.tsx index f9be0305ff..058a5abb50 100644 --- a/packages/ui/src/components/Image.tsx +++ b/packages/ui/src/components/Image.tsx @@ -60,10 +60,10 @@ const WebImage = ({ src={source.uri} alt={alt} style={{ - ...StyleSheet.flatten(style), maxWidth: '100%', height: props.height ? props.height : '100%', objectFit: contentFit ? contentFit : undefined, + ...StyleSheet.flatten(style), }} onLoad={handleLoad} onError={handleError} diff --git a/packages/ui/src/components/NotebookPost/NotebookPost.tsx b/packages/ui/src/components/NotebookPost/NotebookPost.tsx index 96f5c427e1..4393347368 100644 --- a/packages/ui/src/components/NotebookPost/NotebookPost.tsx +++ b/packages/ui/src/components/NotebookPost/NotebookPost.tsx @@ -312,6 +312,7 @@ export const NotebookPostHeroImage = styled(Image, { width: '100%', height: IMAGE_HEIGHT, borderRadius: '$s', + objectFit: 'cover', variants: { size: { $s: { diff --git a/packages/ui/src/components/PostContent/BlockRenderer.tsx b/packages/ui/src/components/PostContent/BlockRenderer.tsx index a351a44a42..936c897f27 100644 --- a/packages/ui/src/components/PostContent/BlockRenderer.tsx +++ b/packages/ui/src/components/PostContent/BlockRenderer.tsx @@ -250,7 +250,6 @@ export function ImageBlock({ return (