I am struggling with an error in my placeholderTextColor and cannot seem to find a solution.
import React from 'react';
import { TextInputProps } from 'react-native';
import { color } from 'react-native-reanimated';
import { Container, TextInput, Icon } from './styles';
interface InputProps extends TextInputProps {
name: string;
icon: string;
}
// All "rest" properties are passed to the TextInput, in this case only the placeholder
const Input: React.FC<InputProps> = ({ name, icon, ...placeholder }) => (
<Container>
<Icon name={icon} size={20} color="#666360" />
<TextInput
keyboardAppearance="dark"
placeholderTextColor="#666360"
{...placeholder}
/>
</Container>
);
export default Input;
The error persists. If I remove the spread operator, the error disappears, but that is not a proper solution.
Full Error:
(JSX attribute) placeholderTextColor?: string | typeof OpaqueColorValue | undefined
The text color of the placeholder string
No overload matches this call.
Overload 1 of 2, '(props: Pick & Partial<...>, "ref" | ... 109 more ... | "showSoftInputOnFocus"> & { ...; } & { ...; } & { ...; }): ReactElement<...>', gave the following error.
Type 'ColorValue' is not assignable to type 'string | unique symbol | undefined'.
Type 'unique symbol' is not assignable to type 'string | unique symbol | undefined'.
Overload 2 of 2, '(props: StyledComponentPropsWithAs): ReactElement, string | ... 1 more ... | (new (props: any) => Component<...>)>', gave the following error.
Type 'ColorValue' is not assignable to type 'string | unique symbol | undefined'.
Type 'unique symbol' is not assignable to type 'string | unique symbol | undefined'.ts(2769)
index.d.ts(1626, 5): The expected type comes from property 'placeholderTextColor' which is declared here on type 'IntrinsicAttributes & Pick & Partial<...>, "ref" | ... 109 more ... | "showSoftInputOnFocus"> & { ...; } & { ...; } & { ...; }'
index.d.ts(1626, 5): The expected type comes from property 'placeholderTextColor' which is declared here on type 'IntrinsicAttributes & Pick & Partial<...>, "ref" | ... 109 more ... | "showSoftInputOnFocus"> & { ...; } & { ...; } & { ...; }'