diff --git a/packages/components/inputs/TextInputCustom.tsx b/packages/components/inputs/TextInputCustom.tsx index c1ed96342a..f859502402 100644 --- a/packages/components/inputs/TextInputCustom.tsx +++ b/packages/components/inputs/TextInputCustom.tsx @@ -49,6 +49,8 @@ import { LegacyTertiaryBox } from "../boxes/LegacyTertiaryBox"; import { CustomPressable } from "../buttons/CustomPressable"; import { SpacerColumn, SpacerRow } from "../spacer"; +import { useTheme } from "@/hooks/useTheme"; + // TODO: Refacto TextInputCustom. Too much props export interface TextInputCustomProps<T extends FieldValues> @@ -164,6 +166,8 @@ export const TextInputCustom = <T extends FieldValues>({ }); const inputRef = useRef<TextInput>(null); const [hovered, setHovered] = useState(false); + const theme = useTheme(); + // Passing ref to parent since I didn't find a pattern to handle generic argument <T extends FieldValues> AND forwardRef useEffect(() => { if (inputRef.current && setRef) { @@ -313,7 +317,11 @@ export const TextInputCustom = <T extends FieldValues>({ onKeyPress={(event) => handleKeyPress({ event, onPressEnter })} placeholderTextColor={neutral77} value={field.value} - style={[styles.textInput, textInputStyle]} + style={[ + { color: theme.textColor }, + styles.textInput, + textInputStyle, + ]} {...restProps} /> </View>