I'm making a GenericModal
component with some custom styling. I want to pass an array of my ModalText
components as props to GenericModal and have it display them. I'd like to be specific that this is the type I'm passing rather than doing something generic like React.FC
.
If I do
type Props = PropsWithChildren<{ paneContents: ModalText[];}>
I get an error ModalText refers to a value but is being used as a type here. Did you mean typeof ModalText
.
If I use typeof ModalText[]
then I get an error when I use it:
<View> {props.paneContents}</View>
saying TS2769: No overload matches this call. '(props: ViewProps | Readonly<ViewProps>): View', gave the following error. Type 'FC<Props>[]' is not assignable to type 'ReactNode'.
Is there a way to do this? Or do I just have to use React.FC as the type and put in the comments that it's meant to be a ModalText?
Edit
Here's the ModalText component, if that helps:
type Props = PropsWithChildren<{ style?: ViewStyle; header?: string; body?: string;}>;const ModalText: React.FC<Props> = (props) => { return (<View style={[style.container, props.style]}> {props.header && <Text style={style.modalHeader}>{props.header}</Text>} {props.body && <Text style={style.modalText}>{props.body}</Text>}</View> );};