reactjs – ReactNative palceholder align Issue on iOS using height property.(cannot use multiline for other reasons)

I’m having issues in my TextInput component in iOS device. I gave TextInput a certain height but the placeholder is now at the center. I want it at the top. I cannot use multiline property. textAlignVertical seems to work on Android, is there anything alternative I can use to bring the palceholder to the top left.

I tried padding, paddingTop..etc didnt work.

here’s the code:

<View style={styles.cardInput}>
  <TextInput
    ref={ref}
    placeholder="Enter.."
    placeholderTextColor={colors.black}
    textAlignVertical="top"
    style={styles.cardInputStyle}
    value={inputText}
    onChangeText={handleTextChange}
  />
  <Text style={styles.counter}>
    {inputText.length}/{MAX_CHARACTER_COUNT}
  </Text>
</View>

and the style is:

const styles = StyleSheet.create({
  cardInputStyle: {
    paddingHorizontal: 15,
    color: colors.black,
    minHeight: 150,
    textAlignVertical: 'top',
  },
  cardInput: {
    borderWidth: 1,
    borderColor: colors.borderGrey,
    backgroundColor: colors.white,
    borderRadius: 5,
    margin: 30,
    width: '90%',
    paddingVertical: 0,
  },
  counter: {
    padding: 15,
  },
});

Any help is appreciated.