As you can see in attached screenshot some of the content is moving to right.

This is my chatRenderText code
`
const messageView = () => (
<View
style={[
styles.markdownContainer,
// eslint-disable-next-line react-native/no-inline-styles
{
backgroundColor: isUser ? '#FFFFFF' : 'transparent',
alignSelf: position === 'right' ? 'flex-end' : 'flex-start',
// ottavia chat has 20 margins from both left and right
width: position === 'right' ? 'auto' : wp(100) - 40,
// by default left and right is 16 in library just adjusting 4 to make it 20
marginLeft: position === 'right' ? 0 : 4,
marginRight: position === 'right' ? 4 : 0,
maxWidth: position === 'right' ? 302 : undefined,
},
]}
>
<View
// eslint-disable-next-line react-native/no-inline-styles
style={{
paddingHorizontal: isUser ? 14 : 0,
// as already has 10 margins vertically so giving 2 to make it 12
paddingTop:
currentMessage.replyTo && currentMessage.replyTo !== '' ? 0 : 2,
paddingBottom: 2,
}}
>
{currentMessage.text}


);

const styles = StyleSheet.create({
markdownContainer: {
flexShrink: 1,
borderRadius: wp(5.5),
},
rightBubbleContainer: {
paddingBottom: 20,
},
leftBubbleView: {
backgroundColor: 'transparent',
paddingBottom: 20,
},
rightBubbleView: {
backgroundColor: 'transparent',
},
});`

versions:-
"react-native-gifted-chat": "2.8.1"
"react-native": "0.82.0",
"react-native-reanimated": "4.1.3",
"react-native-gesture-handler": "2.28.0",
"react-native-safe-area-context": "5.6.1",
"react-native-keyboard-controller": "1.18.6",