Flat TextInput label flickers if right prop is rendering by condition

[donutdonate]

Current behaviour

I want to render right IconButton if TextInput is focus and have non empty text, but label is flickering when right IconButton appears/disappears

Expected behaviour

If i need to render right iconButton by condition, then label keeps his position and doesn't flicker

How to reproduce?

function TextInputDefault(): React.JSX.Element {
  const [text, setText] = useState('');
  const [isFocused, setIsFocused] = useState(false);

  return (
    <View>
        <TextInput
          right={
            isFocused && text ? (
              <TextInput.Icon
                icon="camera"
                forceTextInputFocus={true}
                style={{ backgroundColor: 'red' }}
                onPress={() => setText('')}
              />
            ) : null
          }
          onFocus={() => setIsFocused(true)}
          onBlur={() => setIsFocused(false)}
          error={false}
          label="Email" //#0062A3
          value={text}
          onChangeText={(text) => setText(text)}
          selectionColor="#317BA8"
          cursorColor="#317BA8"
          underlineColor="#A3B3C2"
          activeUnderlineColor="#007ABE"
          textColor="#081C31"
          placeholderTextColor="#BFCCD9"
          placeholder="Placeholder"
          contentStyle={{ backgroundColor: 'transparent' }}
          style={{ backgroundColor: '#51667A1A' }}
        />
      <HelperText type="error" visible={false} padding="none">
        Email address is invalid!
      </HelperText>
    </View>
  );
}

Preview

https://github.com/callstack/react-native-paper/assets/98227045/cee707e3-1a18-478e-a0be-19aa38a895af

https://github.com/callstack/react-native-paper/assets/98227045/4abea4bd-d38f-40c3-bad7-0cafb4304459

Your Environment

software	version
ios	17.2
android	13
react-native	0.73.6
react-native-paper	5.12.3
node	20.5.0
npm or yarn	1.22.19
expo sdk	-