react-native-picker / picker

Picker is a cross-platform UI component for selecting an item from a list of options.
MIT License
1.47k stars 278 forks source link

Support React 18 Types #436

Open Tony-Starkus opened 2 years ago

Tony-Starkus commented 2 years ago

So, after upgrading my React Native project to version 0.69.1 with React 18, the component Picker.Item started raise error.

'Picker.Item' cannot be used as a JSX component.
  Its element type 'ReactElement<any, any> | Component<PickerItemProps<T>, any, any> | null' is not a valid JSX element.
    Type 'Component<PickerItemProps<T>, any, any>' is not assignable to type 'Element | ElementClass | null'.
      Type 'Component<PickerItemProps<T>, any, any>' is not assignable to type 'ElementClass'.
        The types returned by 'render()' are incompatible between these types.
          Type 'React.ReactNode' is not assignable to type 'import("/home/thalisson/Documents/Git/CryptoView/frontend/node_modules/@types/styled-components/node_modules/@types/react/index").ReactNode'.ts(2786)
jameswilddev commented 1 year ago

This one is pretty critical as Expo 46 upgraded to a react-native version without its own picker, but also needs React 18 so you can't install react-native-picker/picker.

serfgy commented 1 year ago

bump, how is this one going? tried to use npm i --force but bound to meet with further issues ahead

Borduhh commented 1 year ago

Same. Updated to Expo 46 and get peer dependency issues with the test renderer.

xpario commented 1 year ago

looks really nice but wont install with latest version of expo installed w/ React 18.

serfgy commented 1 year ago

just to share my workaround, am using expo 46

in my package.json i used npm 8 new function 'overrides'

"overrides": { "@react-native-picker/picker": { "react-native-webview": "^11.23.0" }, },

installation and runtime turned out fine

xpario commented 1 year ago

Can i pay someone to please fix this? We have wasted a week trying to build our own picker for expo 46.

juanoi commented 1 year ago

I'm having the same issue. Any estimate when this might get fixed?

MaxwellDG commented 1 year ago

@xpario

This will allow you to continue using this lib while they're updating it to React 18. Keep in mind that you'll need to add this flag everytime you 'npm install' because it will need to be reminded that this library should be allowed to use React 17.

parK-dev commented 1 year ago

just to share my workaround, am using expo 46

in my package.json i used npm 8 new function 'overrides'

"overrides": { "@react-native-picker/picker": { "react-native-webview": "^11.23.0" }, },

installation and runtime turned out fine

This isn't working for me.

sungsong88 commented 1 year ago

Any update on this?

emirhansemercioglu commented 1 year ago

I was having a similar issue with my project and i find the following solution with help of my terminal:

Some dependencies are incompatible with the installed expo version: @react-native-picker/picker@2.4.8 - expected version: 2.4.2 Your project may not work correctly until you install the correct versions of the packages. Install individual packages by running npx expo install @react-native-picker/picker@2.4.2

However the npx expo install @react-native-picker/picker@2.4.2 wouldn't solve. I manage to find the solution via another issue page thanks to @amandeepmittal. Here

Writing this has solved my problem: npm install @react-native-picker/picker@2.4.2 --legacy-peer-deps

YoannBuzenet commented 1 year ago

You can add it in a .npmrc file that will be used during the build by Expo, with the following : legacy-peer-deps=true