title: ViewStyle is not assignable to type StyleProp<ViewStyle>
body: <p>i am new to react-native and typescript so might be missing or making some silly mistake that's giving this error mentioned below. I'm creating a component which uses some other library where the &quot;InnerComponent&quot; lives and i am just importing it. I need to pass value from OuterComponent prop which is named as &quot;myCustomContainer&quot; to the InnerComponent prop which is named as &quot;containerStyle&quot; so i specified the same type of prop(StyleProp) as it's expecting in the InnerComponent but getting the following error.</p>
  <pre><code>Type 'import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).StyleProp&lt;import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).ViewStyle&gt;' 
      is not assignable to type 'import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).StyleProp&lt;import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).ViewStyle&gt;'.
    Type 'ViewStyle' is not assignable to type 'StyleProp&lt;ViewStyle&gt;'.
      Type 'import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).ViewStyle' is not assignable to type 'import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).ViewStyle'.
        Types of property 'backgroundColor' are incompatible.
          Type 'string | typeof import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).OpaqueColorValue | undefined' is not assignable to type 'string | typeof import(&quot;c:/myApp/node_modules/@types/react-native/index&quot;).OpaqueColorValue | undefined'.
            Type 'unique symbol' is not assignable to type 'string | unique symbol | undefined'.ts(2322)
               InnerComponent.d.ts(12, 5): The expected type comes from property 'containerStyle' which is declared here on type 'IntrinsicAttributes &amp; IntrinsicClassAttributes&lt;InnerComponent&gt; &amp; Pick&lt;Readonly&lt;Props&gt; &amp; Readonly&lt;{ children?: ReactNode; }&gt;, &quot;myCustomText&quot; | ... 12 more ... | &quot;someOtherContainerStyle&quot;&gt; &amp; Partial&lt;...&gt; &amp; Partial&lt;...&gt;'
           
  </code></pre>
  <p>Here is the code for the component i created and typed definition file(d.ts) of the imported component.</p>
  <p><strong>My Component</strong></p>
  <pre><code>import React from &quot;react&quot;;
  import { View, StyleProp, ViewStyle } from &quot;react-native&quot;;
  import { NavigationInjectedProps, withNavigation } from &quot;react-navigation&quot;;
  import { InnerComponent } from &quot;ComponentsLibrary&quot;;
  import { myStyles as styles } from &quot;../styles&quot;;
  
  interface IProps {
    myText?: string;
    myCustomContainerStyle?: StyleProp&lt;ViewStyle&gt;
  }
  
  type Props = IProps &amp; NavigationInjectedProps;
  
  export const MyOuterComponent: React.FC&lt;Props&gt; = (props: Props) =&gt; {
    const {
      myText,
      myCustomContainerStyle
    } = props;
    return (
      &lt;View&gt;
          &lt;InnerComponent
            customText={myText}
            containerStyle={myCustomContainerStyle}
            onChangeText={(e) =&gt; console.log(e.target.value)}
          /&gt;   
      &lt;/View&gt;
    );
  };
  </code></pre>
  <p><strong>InnerComponent.d.ts file for the component i am using</strong></p>
  <pre><code>import { Component } from &quot;react&quot;;
  import { StyleProp, ViewStyle } from &quot;react-native&quot;;
  /**
   * Component Props
   */
  declare type Props = {
      containerStyle?: StyleProp&lt;ViewStyle&gt;;
      someOtherContainerStyle?: StyleProp&lt;ViewStyle&gt;;
      customText?: string;
      onChangeText: (customText: string) =&gt; void;
  };
  /**
   * Component State
   */
  declare type State = {
      isTextMode: boolean;
      customText: string;
  };
  export declare class InnerComponent extends Component&lt;Props, State&gt; {
      static defaultProps: {
          onChange: undefined;
      };
      constructor(props: Props);
      someFunction: () =&gt; void;
      componentDidUpdate(prevProps: Props): void;
      render(): JSX.Element;
      private onCancel;
  }
  export default InnerComponent;
  </code></pre>