I have a styled component:
const Wrapper = styled.View` align-items: center; flex-direction: row;`;
I have a component which is using this styled component:
interface ProfileInfoBar extends ViewProps {}const ProfileInfoBar: React.FC<ProfileInfoBar> = ({ ...rest }) => { return (<Wrapper {...rest}><Avatar firstname="A" lastname="B" size={60} /></Wrapper> );};
But I am getting an error when trying to pass rest
to Wrapper
:
No overload matches this call. Overload 1 of 2, '(props:Pick<Pick<ViewProps & RefAttributes, "hitSlop" | "onLayout" |"pointerEvents" | "removeClippedSubviews" | "style" | "testID" |"nativeID" | ... 48 more ... | "key"> & Partial<...>, "hitSlop" | ...54 more ... | "key"> & { ...; } & { ...; } & { ...; }):ReactElement<...>', gave the following error.Type '{ children: Element[]; hitSlop?: Insets | undefined; onLayout?: ((event: LayoutChangeEvent) => void) | undefined;pointerEvents?: "none" | "auto" | "box-none" | "box-only" | undefined;... 48 more ...; accessibilityIgnoresInvertColors?: boolean |undefined; }' is not assignable to type 'Pick<Pick<ViewProps &RefAttributes, "hitSlop" | "onLayout" | "pointerEvents" |"removeClippedSubviews" | "style" | "testID" | "nativeID" | ... 48more ... | "key"> & Partial<...>, "hitSlop" | ... 54 more ... |"key">'.Types of property 'style' are incompatible.
I can't understand how to pass all props to styled component. Any ideas?