react-native-paper: Typescript error: No overload matches this call.

It seems this PR once closed will fix problem #2522

Currently on “@types/react-native”: “0.63.47” and the issue still persists.

Working configuration right now:

    "react-native": "~0.63.4",
    "react-native-paper": "^4.7.1",
    "@types/react-native": "^0.62.0",

There is one easy way to know what should be these versions.

Just pick version of @types/react-native from https://github.com/callstack/react-native-paper/blob/main/package.json

Hi got the solution. When initializing project using expo init it automatically added types for react-native project version

• @types/react-native@0.63.2

After upgrading the react-native type version to

• @types/react-native@0.63.40

It is working fine.

It seems this PR once closed will fix problem #2522

Currently on “@types/react-native”: “0.63.47” and the issue still persists.

Working configuration right now:

    "react-native": "~0.63.4",
    "react-native-paper": "^4.7.1",
    "@types/react-native": "^0.62.0",

There is one easy way to know what should be these versions.

Just pick version of @types/react-native from https://github.com/callstack/react-native-paper/blob/main/package.json

I tried version 0.62.0 of @types/react-native and it didn’t work, i installed 0.63.0 and the errors disappeared

same for me…

<Button
              mode="outlined"
              onPress={() => {
                setCounter(counter + 1);
                observableAppStore.setTracker(counter);
              }}>
              Press me
            </Button>

ERROR No overload matches this call. Overload 1 of 2, ‘(props: Pick<Props, “ref” | “style” | “children” | “hitSlop” | “onLayout” | “pointerEvents” | “removeClippedSubviews” | “testID” | “nativeID” | “collapsable” | “needsOffscreenAlphaCompositing” | … 57 more … | “contentStyle”> & { …; }, context?: any): ReactElement<…> | … 1 more … | null’, gave the following error. Type ‘{ children: string; mode: “outlined”; onPress: () => void; }’ is missing the following properties from type ‘Pick<Props, “ref” | “style” | “children” | “hitSlop” | “onLayout” | “pointerEvents” | “removeClippedSubviews” | “testID” | “nativeID” | “collapsable” | “needsOffscreenAlphaCompositing” | … 57 more … | “contentStyle”>’: accessibilityComponentType, accessibilityTraits Overload 2 of 2, ‘(props: PropsWithChildren<Pick<Props, “ref” | “style” | “children” | “hitSlop” | “onLayout” | “pointerEvents” | “removeClippedSubviews” | “testID” | “nativeID” | “collapsable” | “needsOffscreenAlphaCompositing” | … 57 more … | “contentStyle”> & { …; }>, context?: any): ReactElement<…> | … 1 more … | null’, gave the following error. Type ‘{ children: string; mode: “outlined”; onPress: () => void; }’ is missing the following pr

PACKEGE

“dependencies”: { “@babel/plugin-proposal-decorators”: “^7.12.12”, “babel-plugin-transform-decorators-legacy”: “^1.3.5”, “mobx”: “^6.0.5”, “mobx-react”: “^7.0.6”, “react”: “16.13.1”, “react-native”: “0.63.4”, “react-native-paper”: “^4.7.1”, “react-native-vector-icons”: “^8.0.0” }, “devDependencies”: { “@babel/core”: “^7.8.4”, “@babel/runtime”: “^7.8.4”, “@react-native-community/eslint-config”: “^1.1.0”, “@types/color”: “^3.0.1”, “@types/jest”: “^25.2.3”, “@types/react-native”: “^0.63.46”, “@types/react-test-renderer”: “^16.9.2”, “babel-jest”: “^25.1.0”, “eslint”: “^6.5.1”, “jest”: “^25.1.0”, “metro-react-native-babel-preset”: “^0.59.0”, “react-test-renderer”: “16.13.1”, “typescript”: “^3.8.3” },

this issue is also present for me with many attempts over the last few days trying to figure out which @types/react-native version is causing this leading to nowhere

creating a new TS project with expo init and following RN paper instructions for installing the library should recreate the issue.

I’m currently facing this issue when trying to import the Text component😕

Error :

No overload matches this call.
  Overload 1 of 2, '(props: Pick<TextProps & { style?: StyleProp<TextStyle>; theme: Theme; } & RefAttributes<{}>, "testID" | "ref" | "children" | ... 37 more ... | "onPressOut"> & { ...; }, context?: any): ReactElement<...> | ... 1 more ... | null', gave the following error.
    Type '{ children: string; style: { fontSize: number; marginBottom: number; }; }' is missing the following properties from type 'Pick<TextProps & { style?: StyleProp<TextStyle>; theme: Theme; } & RefAttributes<{}>, "testID" | "ref" | "children" | "onLayout" | ... 36 more ... | "onPressOut">': onPressIn, onPressOut
  Overload 2 of 2, '(props: PropsWithChildren<Pick<TextProps & { style?: StyleProp<TextStyle>; theme: Theme; } & RefAttributes<{}>, "testID" | "ref" | "children" | ... 37 more ... | "onPressOut"> & { ...; }>, context?: any): ReactElement<...> | ... 1 more ... | null', gave the following error.
    Type '{ children: string; style: { fontSize: number; marginBottom: number; }; }' is missing the following properties from type 'Pick<TextProps & { style?: StyleProp<TextStyle>; theme: Theme; } & RefAttributes<{}>, "testID" | "ref" | "children" | "onLayout" | ... 36 more ... | "onPressOut">': onPressIn, onPressOutts(2769)

Package.json:

  "dependencies": {
  	"@react-navigation/native": "^6.0.6",
  	"@react-navigation/native-stack": "^6.2.5",
  	"@reduxjs/toolkit": "^1.7.1",
  	"expo": "~44.0.0",
  	"expo-status-bar": "~1.2.0",
  	"react": "17.0.1",
  	"react-dom": "17.0.1",
  	"react-native": "0.64.3",
  	"react-native-paper": "^4.11.2",
  	"react-native-safe-area-context": "3.3.2",
  	"react-native-screens": "~3.10.1",
  	"react-native-web": "0.17.1",
  	"react-redux": "^7.2.6"
  },
  "devDependencies": {
  	"@babel/core": "^7.12.9",
  	"@types/react": "~17.0.21",
  	"@types/react-native": "~0.64.12",
  	"babel-preset-expo": "^9.0.2",
  	"ts-node": "^10.4.0",
  	"typescript": "^4.5.4"
  },

To all strugling with react native paper lint errors Simply search in the package.json of react native paper : https://github.com/callstack/react-native-paper/blob/main/package.json, (change the tag with the version of react native paper you use) And change the react-native and @types/react-native version to the same as in the package.json of react native paper

I just ran this command and everything works fine: yarn add -D @types/react-native

Working with Expo SDK 43 (react-native 0.64.3 - @types/react-native 0.64.19) and react-native-paper 4.9.2

I did: npm i react-native@latest npm i react-native-paper@latest npm i --save-dev @types/react-native@latest and it didn’t work

I was facing the same issue. I did:

npm i react-native@latest
npm i react-native-paper@latest
npm i --save-dev @types/react-native@latest

Worked like a charm !

If we can just @latest all the associated packages then I would think this can be closed.

It seems this PR once closed will fix problem #2522

Issue is back for me as well. Currently on @types/react-native 0.63.46.

I was able to fix this by only upgrading my @types/react-native to the latest version (0.66.15 at time of writing this). yarn add -D @types/react-native@latest

My relevant dependencies prior to upgrading were as follows:

"@types/react-native": "^0.63.48",
"react-native": "0.63.4",
"react-native-paper": "^4.11.2",

Yes, same here. This seems very annoying due to our tooling failing

Still, the problem have …

Problem fix do not use a title or any kind of attr for button because btn dont have like this attr.

This issue is back for me with the most recent version of @types/react-native (@0.63.45 for @latest at time of writing this)