onResize and onResizeCapture are required for virtually all components

[thobas-dnvgl]

Those are all the dependencies of my Sanity Studio project:

{
  "dependencies": {
    "@sanity/color-input": "^3.0.1",
    "@sanity/icons": "^2.1.0",
    "@sanity/table": "^1.0.1",
    "@sanity/ui": "^1.0.1",
    "@sanity/util": "^3.0.6",
    "@sanity/uuid": "^3.0.1",
    "@sanity/vision": "^3.0.6",
    "csv-reader": "^1.0.10",
    "lodash.get": "^4.4.2",
    "lodash.merge": "^4.6.2",
    "match-sorter": "^6.3.1",
    "mocha": "^10.2.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^4.7.1",
    "react-is": "^18.2.0",
    "react-query": "^3.39.2",
    "react-virtuoso": "^3.1.5",
    "sanity": "^3.0.6",
    "sanity-plugin-datatable": "^1.1.0",
    "styled-components": "^5.3.6"
  },
  "devDependencies": {
    "@types/lodash.get": "^4.4.7",
    "@types/lodash.merge": "^4.6.7",
    "@types/mocha": "^10.0.1",
    "@typescript-eslint/eslint-plugin": "^5.46.1",
    "@typescript-eslint/parser": "^5.46.1",
    "eslint": "^8.29.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-config-sanity": "^6.0.0",
    "eslint-plugin-react": "^7.31.11",
    "mocha-junit-reporter": "^2.2.0",
    "prettier": "^2.8.1",
    "ts-node": "^10.9.1",
    "typescript": "^4.9.4"
  }
}

Almost all components have TypeScript errors (in this screenshots, all but <Stack/>):

The error is:

Type '{ children: string; }' is missing the following properties from type 'Pick<TextProps & Omit<HTMLProps<HTMLDivElement>, "size" | "as">, "className" | "color" | "height" | "id" | "lang" | "max" | ... 353 more ... | keyof TextProps>': onResize, onResizeCapture ts(2739)

Adding onResize={undefined} onResizeCapture={undefined} on the components removes the error but it's not optimal.

Am I the only one having this issue? :)

[mariuslundgard]

Hello @thobas-dnvgl – this is caused by an unfortunate mismatch between older and newer versions of @types/react caused by this PR: DefinitelyTyped/DefinitelyTyped#63076

The solution is to update your @types/react dependency (or add it to you dev dependencies) to the latest version.