react native typescript No overload matches this call

I am new to typescript and I’m using react native. I added a style to an view element and I’m getting the errors below.

Can someone please explain what the issue is and what I can do to fix it?

Here is my styles component

import StyleSheet from 'react-native-media-query';
import { useMediaQuery } from 'react-responsive'

const { ids, styles } = StyleSheet.create({
  viewStyle: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    alignSelf: "center",
    '@media (min-width: 1400px)': {
      width: "20%"
    },
    '@media (min-width: 1000px)': {
      width: "30%"
    },
    '@media (max-width: 1000px) and (min-width: 700px)': {
      width: "60%"
    },
    '@media (max-width: 700px)': {
      width: "70%"
    },
    '@media (max-width: 700px)': {
      width: "90%"
    }


  },
  inputStyle: {
    padding: "10px"
  },
  emailContainer: {
    justifyContent: "center",
    AlignItems: "center",
    alignSelf: "center",
    ...Platform.select({
      native: {
        margin: 40,
      },
      web: {
        maxHeight: "10%",
      },
    }),
  },
});

export { ids, styles };

And here is my component using the style

import { Input, Button } from "@rneui/themed";
import { useEffect, useState } from "react";
import { Text, View } from "react-native";
import { ids, styles } from "./styles";

export default function InitialEmailComponent() {
  const [email, setEmail] = useState<string>("");
  const [emailError, setEmailError] = useState<string>("");

  const handleEmailSubmit = async () => {
    debugger;
  };

  return (
    <View style={styles.viewStyle} dataSet={{ media: ids.viewStyle }} >
      <Input
        inputStyle={styles.inputStyle}
        id="register-email-input"
        placeholder={"Enter your email"}
        onChangeText={(email) => setEmail(email)}
        errorStyle={{ color: "red" }}
        errorMessage={emailError}
      />
      <Button
        id="register-email-submit"
        title="Submit"
        onPress={handleEmailSubmit}
      />
    </View>
  );
}

src/components/auth/initialEmailComponent/index.tsx:15:11 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(props: ViewProps | Readonly<ViewProps>): View', gave the following error.
    Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; } | {} | ({ ...; } & {}) | ({ ...; } & {})' is not assignable to type 'StyleProp<ViewStyle>'.
      Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; }' is not assignable to type 'StyleProp<ViewStyle>'.
        Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; }' is not assignable to type 'ViewStyle'.
          Types of property 'backfaceVisibility' are incompatible.
            Type 'TextStyle | ViewStyle | "visible" | "hidden" | ImageStyle | undefined' is not assignable to type '"visible" | "hidden" | undefined'.
              Type 'TextStyle' is not assignable to type '"visible" | "hidden" | undefined'.
  Overload 2 of 2, '(props: ViewProps, context: any): View', gave the following error.
    Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; } | {} | ({ ...; } & {}) | ({ ...; } & {})' is not assignable to type 'StyleProp<ViewStyle>'.

15     <View style={styles.viewStyle}
             ~~~~~

  node_modules/react-native/Libraries/Components/View/ViewPropTypes.d.ts:234:3
    234   style?: StyleProp<ViewStyle> | undefined;
          ~~~~~
    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'
  node_modules/react-native/Libraries/Components/View/ViewPropTypes.d.ts:234:3
    234   style?: StyleProp<ViewStyle> | undefined;
          ~~~~~
    The expected type comes from property 'style' which is declared here on type 'IntrinsicAttributes & IntrinsicClassAttributes<View> & Readonly<ViewProps>'

src/components/auth/initialEmailComponent/index.tsx:19:9 - error TS2322: Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; } | {} | ({ ...; } & {}) | ({ ...; } & {})' is not assignable to type 'StyleProp<TextStyle>'.
  Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; }' is not assignable to type 'StyleProp<TextStyle>'.
    Type '{ position?: "fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined; backfaceVisibility?: TextStyle | ... 4 more ... | undefined; ... 73 more ...; translateY?: TextStyle | ... 3 more ... | undefined; }' is not assignable to type 'TextStyle'.
      Types of property 'position' are incompatible.
        Type '"fixed" | TextStyle | ViewStyle | "static" | "relative" | "absolute" | "sticky" | ImageStyle | undefined' is not assignable to type '"fixed" | "static" | "relative" | "absolute" | "sticky" | undefined'.
          Type 'TextStyle' is not assignable to type '"fixed" | "static" | "relative" | "absolute" | "sticky" | undefined'.

19         inputStyle={styles.inputStyle}
           ~~~~~~~~~~

  node_modules/@rneui/base/dist/Input/Input.d.ts:15:5
    15     inputStyle?: StyleProp<TextStyle>;
           ~~~~~~~~~~
    The expected type comes from property 'inputStyle' which is declared here on type 'IntrinsicAttributes & InputProps & { children?: ReactNode; } & RefAttributes<PropsWithChildren<InputProps>>'


Found 2 errors in the same file, starting at: src/components/auth/initialEmailComponent/index.tsx:15