Seamless Multiline autogrow textinput support in react native web

[vishnuc]

Is there an existing request?

• I have searched for this request

Describe the feature request

I have below component , which is initially 48px height and when i type multiple lines it goes upto 200px , in native devices like ios and android.. But this autogrow is not working web , same code.Can we do something about it. please watch the video - https://www.youtube.com/watch?v=tLq2z6MhBqE

const GrowingTextInput = ({
  style,
  containerStyle,
  placeholder = "Type here...",
  value,
  onChangeText,
}: Props) => {
  const [inputValue, setInputValue] = useState(value || "");
  const [inputHeight, setInputHeight] = useState(styles.input.minHeight);

  const handleChangeText = (text: string) => {
    setInputValue(text);
    onChangeText?.(text);
  };

  return (
    <View style={[styles.container, containerStyle]}>
      <TextInput
        multiline={true}
        style={{
          color: "white",
          flex: 1,
          alignSelf: "flex-end",
          minHeight: 48,
          maxHeight: 300,
          verticalAlign: "bottom",
        }}
        placeholder="Type Your Message"
      />
    </View>
  );
};

[](url)

const styles = StyleSheet.create({
  container: {
    borderWidth: 1,
    borderColor: "lightgrey",
    flexDirection: "row",
    backgroundColor: "transparent",
  },
  input: {
    minHeight: 40,
    maxHeight: 500,
    flex: 1,
    paddingHorizontal: 12,
    backgroundColor: "#F0F0F0",
    borderStyle: "solid",
    borderWidth: 1,
    borderColor: "lightgrey",
    borderRadius: 25,
    fontSize: 16,
    padding: 10,
  },
});

export default GrowingTextInput;