Upgrade to React 18

[Dagur]

No description provided.

[marnusw]

Looks good at first glance, thanks. I'll review this and #101 as soon as I can.

[dagfs]

Let me know if there is anything I can do to help with reviewing this 😄

[marnusw]

I was just looking this over properly, and it looks like it only updates the demo. Is there anything in the library itself which makes it incompatible with React 18? (Except maybe #101) Not that I'm against merging this at all, I'm carving out some time for it. I just want to make sure I understand the need for this fully.

[dagfs]

You are correct. I misread.

I am not sure if there is anything in the library that makes incompatible with React 18, but I am having some problems with type definitions with this library after upgrading to React 18. So there might be something I can / should do on my side that I am not aware of.

The type errors I am getting is:

Property 'children' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Props, any, any>> & Readonly<Props>'.ts(2322)

So I was hoping this PR would help with that.

Working with typescript, so I think there are some type definitions that have changed between react 17 and 18.

I tried running the PR locally and could not get it installed. Had to update devDependencies in the root package.json to get things installed.

Updated it to:

 "devDependencies": {
    "babel-eslint": "^10.1.0",
    "eslint": "^8.20.0",
    "eslint-config-react-app": "^7.0.1",
    "eslint-plugin-flowtype": "^8.0.3",
    "eslint-plugin-import": "^2.26.0",
    "eslint-plugin-jsx-a11y": "^6.6.1",
    "eslint-plugin-react": "^7.30.1",
    "eslint-plugin-react-hooks": "^4.6.0",
    "husky": "^8.0.1",
    "lint-staged": "^13.0.3",
    "prettier": "^2.7.1"
  },

Ill see if I can get yarn installed properly then try and build and link the project with updated peer dependencies to see if that helps with the type definitions.

 "peerDependencies": {
    "react": "^16.3.0 || ^17.0.0 || ^18.0.0",
    "react-dom": "^16.3.0 || ^17.0.0 || ^18.0.0"
  },

[farukg]

Is there anything in the library itself which makes it incompatible with React 18?

while technically not really incompatible, but i guess react 18 features like concurrent rendering, suspense and alike could potentially lead to problems.
For instance, in strict-mode there is a warning about UNSAFE_componentWillReceiveProps:
StrictMode is a tool for highlighting potential problems in an application