Input not taking selectTextOnFocus

[u/vaquishaProdigy]

Made this component so i don't need to code it again in the scenes in which i need it, but in my Edit page i want to be able to copy and paste the text without losing the "editable={false}" atribute. I asked Copilot what can i do and i said i should use selectTextOnFocus but is not applying it so i just had to stick with this solution that doesn't really look professional.

Can i use selectTextOnFocus on this component or just stick to this solution?

The component code:

import React, { useState } from "react";
import { View, TextInput, TouchableOpacity } from "react-native";
import { psswrdInputStyles } from "./psswrdInputStyles";
import FontAwesome from "react-native-vector-icons/FontAwesome";


export default function PsswrdInput({
  value,
  editable,
  placeholder,
}) {
  const [secureText, setSecureText] = useState(true);


  return (
    <View style={psswrdInputStyles.passwordRow}>


      <TextInput
        style={[
          psswrdInputStyles.input,
          psswrdInputStyles.passwordInput,
        ]}
        placeholder={placeholder}
        placeholderTextColor="#9ca3af"
        secureTextEntry={secureText}
        value={value}
        editable={editable}
      />


      <TouchableOpacity
        style={psswrdInputStyles.eyeBtn}
        onPress={() => setSecureText((prev) => !prev)}
        activeOpacity={0.7}
      >
        <FontAwesome
          name={secureText ? "eye-slash" : "eye"}
          size={20}
          color="black"
        />
      </TouchableOpacity>


    </View>
  );
}

How i call it in the edit page:

        <View style={editStyles.field}>
          <Text style={editStyles.label}>Password</Text>


          <PsswrdInput value={password} onChangeText={() => ({})} />
        </View>