From 348d1a0630178a097c2915af66793d175500db58 Mon Sep 17 00:00:00 2001 From: Miroslav Bauer Date: Thu, 7 May 2026 17:27:18 +0200 Subject: [PATCH 1/3] dependencies: upgrade React deps to v18 * Upgrades react and react-dom from ^16.13.0 to ^18.3.0 * Requires Node version >=22.0.0 --- package-lock.json | 183 ++++++++++------------------------------------ package.json | 12 +-- 2 files changed, 44 insertions(+), 151 deletions(-) diff --git a/package-lock.json b/package-lock.json index 161037d8..2896319b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,7 @@ "license": "MIT", "devDependencies": { "@babel/cli": "^7.5.0", - "@inveniosoftware/eslint-config-invenio": "^2.0.0", + "@inveniosoftware/eslint-config-invenio": "^2.1.0", "@rollup/plugin-babel": "^5.0.0", "@rollup/plugin-commonjs": "^11.1.0", "@rollup/plugin-node-resolve": "^7.1.0", @@ -31,8 +31,8 @@ "lodash": "^4.17.0", "luxon": "^1.23.0", "query-string": "^7.0.0", - "react": "^16.13.0", - "react-dom": "^16.13.0", + "react": "^18.3.0", + "react-dom": "^18.3.0", "react-scripts": "^5.0.1", "rimraf": "^3.0.0", "rollup": "^2.10.0", @@ -47,7 +47,7 @@ "yup": "^0.32.11" }, "engines": { - "node": ">=16.0.0" + "node": ">=22.0.0" }, "peerDependencies": { "@babel/runtime": "^7.26.10", @@ -58,8 +58,8 @@ "lodash": "^4.17.0", "luxon": "^1.23.0", "query-string": "^7.0.0", - "react": "^16.13.0", - "react-dom": "^16.13.0", + "react": "^18.3.0", + "react-dom": "^18.3.0", "react-overridable": "^1.0.0", "semantic-ui-css": "^2.4.0", "semantic-ui-react": "^2.1.0", @@ -2185,6 +2185,7 @@ "version": "7.28.4", "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.4.tgz", "integrity": "sha512-Q/N6JNWvIvPnLDvjlE1OUBLPQHH6l3CltCEsHIujp45zQUSSh8K+gHnaEX45yAT1nyngnINhvWtzN+Nb9D8RAQ==", + "dev": true, "license": "MIT", "engines": { "node": ">=6.9.0" @@ -2728,11 +2729,10 @@ "license": "BSD-3-Clause" }, "node_modules/@inveniosoftware/eslint-config-invenio": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/@inveniosoftware/eslint-config-invenio/-/eslint-config-invenio-2.0.1.tgz", - "integrity": "sha512-O16f6w2m2HS8o26HpjqMMNyKnsZ2mE7F87RosFzmzh7AU8Y816HHK2UPN6V3uhIIvyV3zG+DUmn7n/y8fKzCNQ==", + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/@inveniosoftware/eslint-config-invenio/-/eslint-config-invenio-2.1.0.tgz", + "integrity": "sha512-WbaMJZ6Ce6FGLkEeW12bSh9Yz9MZRWQicLpy3Ldr7nru+nK+V3W967BPCr27mRoUvTibbffflzkKRFh+v1f8Gw==", "dev": true, - "license": "MIT", "dependencies": { "@babel/core": "^7.18.6", "@babel/eslint-parser": "^7.18.2", @@ -3820,7 +3820,6 @@ "resolved": "https://registry.npmjs.org/@jest/types/-/types-26.6.2.tgz", "integrity": "sha512-fC6QCp7Sc5sX6g8Tvbmj4XUTbyrik0akgRy03yjXbQaBWWNWGE7SGtJk98m0N8nzegD/7SggrUlivxo5ax4KWQ==", "dev": true, - "license": "MIT", "dependencies": { "@types/istanbul-lib-coverage": "^2.0.0", "@types/istanbul-reports": "^3.0.0", @@ -3837,7 +3836,6 @@ "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", "dev": true, - "license": "MIT", "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -4510,27 +4508,6 @@ "url": "https://github.com/sponsors/gregberge" } }, - "node_modules/@testing-library/dom": { - "version": "10.4.1", - "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz", - "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "@babel/code-frame": "^7.10.4", - "@babel/runtime": "^7.12.5", - "@types/aria-query": "^5.0.1", - "aria-query": "5.3.0", - "dom-accessibility-api": "^0.5.9", - "lz-string": "^1.5.0", - "picocolors": "1.1.1", - "pretty-format": "^27.0.2" - }, - "engines": { - "node": ">=18" - } - }, "node_modules/@testing-library/jest-dom": { "version": "4.2.4", "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-4.2.4.tgz", @@ -4931,14 +4908,6 @@ "node": ">=10.13.0" } }, - "node_modules/@types/aria-query": { - "version": "5.0.4", - "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz", - "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/@types/babel__core": { "version": "7.20.5", "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz", @@ -5251,17 +5220,6 @@ "dev": true, "license": "MIT" }, - "node_modules/@types/react": { - "version": "19.1.13", - "resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.13.tgz", - "integrity": "sha512-hHkbU/eoO3EG5/MZkuFSKmYqPbSVk5byPFa3e7y/8TybHiLMACgI8seVYlicwk7H5K/rI2px9xrQp/C+AUDTiQ==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "csstype": "^3.0.2" - } - }, "node_modules/@types/react-dom": { "version": "19.1.9", "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.1.9.tgz", @@ -6266,17 +6224,6 @@ "dev": true, "license": "Python-2.0" }, - "node_modules/aria-query": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz", - "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==", - "dev": true, - "license": "Apache-2.0", - "peer": true, - "dependencies": { - "dequal": "^2.0.3" - } - }, "node_modules/array-buffer-byte-length": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz", @@ -8492,14 +8439,6 @@ "dev": true, "license": "MIT" }, - "node_modules/csstype": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", - "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -8734,17 +8673,6 @@ "node": ">= 0.8" } }, - "node_modules/dequal": { - "version": "2.0.3", - "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz", - "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==", - "dev": true, - "license": "MIT", - "peer": true, - "engines": { - "node": ">=6" - } - }, "node_modules/destroy": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/destroy/-/destroy-1.2.0.tgz", @@ -8878,14 +8806,6 @@ "node": ">=6.0.0" } }, - "node_modules/dom-accessibility-api": { - "version": "0.5.16", - "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz", - "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/dom-converter": { "version": "0.2.0", "resolved": "https://registry.npmjs.org/dom-converter/-/dom-converter-0.2.0.tgz", @@ -10418,7 +10338,6 @@ "resolved": "https://registry.npmjs.org/expect/-/expect-26.6.2.tgz", "integrity": "sha512-9/hlOBkQl2l/PLHJx6JjoDF6xPKcJEsUlWKb23rKE7KzeDqUZKXKNMW27KIue5JMdBV9HgmoJPcc8HtO85t9IA==", "dev": true, - "license": "MIT", "dependencies": { "@jest/types": "^26.6.2", "ansi-styles": "^4.0.0", @@ -10436,7 +10355,6 @@ "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", "dev": true, - "license": "MIT", "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -10453,7 +10371,6 @@ "resolved": "https://registry.npmjs.org/diff-sequences/-/diff-sequences-26.6.2.tgz", "integrity": "sha512-Mv/TDa3nZ9sbc5soK+OoA74BsS3mL37yixCvUAQkiuA4Wz6YtwP/K47n2rv2ovzHZvoiQeA5FTQOschKkEwB0Q==", "dev": true, - "license": "MIT", "engines": { "node": ">= 10.14.2" } @@ -10463,7 +10380,6 @@ "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-26.6.2.tgz", "integrity": "sha512-6m+9Z3Gv9wN0WFVasqjCL/06+EFCMTqDEUl/b87HYK2rAPTyfz4ZIuSlPhY51PIQRWx5TaxeF1qmXKe9gfN3sA==", "dev": true, - "license": "MIT", "dependencies": { "chalk": "^4.0.0", "diff-sequences": "^26.6.2", @@ -10479,7 +10395,6 @@ "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-26.6.2.tgz", "integrity": "sha512-llnc8vQgYcNqDrqRDXWwMr9i7rS5XFiCwvh6DTP7Jqa2mqpcCBBlpCbn+trkG0KNhPu/h8rzyBkriOtBstvWhw==", "dev": true, - "license": "MIT", "dependencies": { "chalk": "^4.0.0", "jest-diff": "^26.6.2", @@ -10495,7 +10410,6 @@ "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-26.6.2.tgz", "integrity": "sha512-7AeGuCYNGmycyQbCqd/3PWH4eOoX/OiCa0uphp57NVTeAGdJGaAliecxwBDHYQCIvrW7aDBZCYeNTP/WX69mkg==", "dev": true, - "license": "MIT", "dependencies": { "@jest/types": "^26.6.2", "ansi-regex": "^5.0.0", @@ -10510,8 +10424,7 @@ "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", - "dev": true, - "license": "MIT" + "dev": true }, "node_modules/express": { "version": "4.21.2", @@ -13994,7 +13907,6 @@ "resolved": "https://registry.npmjs.org/jest-get-type/-/jest-get-type-26.3.0.tgz", "integrity": "sha512-TpfaviN1R2pQWkIihlfEanwOXK0zcxrKEE4MlU6Tn7keoXdN6/3gK/xl0yEh8DOunn5pOVGKf8hB4R9gVh04ig==", "dev": true, - "license": "MIT", "engines": { "node": ">= 10.14.2" } @@ -14447,7 +14359,6 @@ "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-26.6.2.tgz", "integrity": "sha512-rGiLePzQ3AzwUshu2+Rn+UMFk0pHN58sOG+IaJbk5Jxuqo3NYO1U2/MIR4S1sKgsoYSXSzdtSa0TgrmtUwEbmA==", "dev": true, - "license": "MIT", "dependencies": { "@babel/code-frame": "^7.0.0", "@jest/types": "^26.6.2", @@ -14468,7 +14379,6 @@ "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", "dev": true, - "license": "MIT", "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -14485,7 +14395,6 @@ "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-26.6.2.tgz", "integrity": "sha512-7AeGuCYNGmycyQbCqd/3PWH4eOoX/OiCa0uphp57NVTeAGdJGaAliecxwBDHYQCIvrW7aDBZCYeNTP/WX69mkg==", "dev": true, - "license": "MIT", "dependencies": { "@jest/types": "^26.6.2", "ansi-regex": "^5.0.0", @@ -14500,15 +14409,13 @@ "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==", - "dev": true, - "license": "MIT" + "dev": true }, "node_modules/jest-message-util/node_modules/slash": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", "dev": true, - "license": "MIT", "engines": { "node": ">=8" } @@ -14594,7 +14501,6 @@ "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-26.0.0.tgz", "integrity": "sha512-Gv3ZIs/nA48/Zvjrl34bf+oD76JHiGDUxNOVgUjh3j890sblXryjY4rss71fPtD/njchl6PSE2hIhvyWa1eT0A==", "dev": true, - "license": "MIT", "engines": { "node": ">= 10.14.2" } @@ -15759,6 +15665,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==", + "dev": true, "license": "MIT" }, "node_modules/js-yaml": { @@ -16395,6 +16302,7 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", + "dev": true, "license": "MIT", "dependencies": { "js-tokens": "^3.0.0 || ^4.0.0" @@ -16433,17 +16341,6 @@ "node": "*" } }, - "node_modules/lz-string": { - "version": "1.5.0", - "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz", - "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==", - "dev": true, - "license": "MIT", - "peer": true, - "bin": { - "lz-string": "bin/bin.js" - } - }, "node_modules/magic-string": { "version": "0.25.9", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.25.9.tgz", @@ -16971,6 +16868,7 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", + "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -19371,6 +19269,7 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", + "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.4.0", @@ -19610,14 +19509,12 @@ } }, "node_modules/react": { - "version": "16.14.0", - "resolved": "https://registry.npmjs.org/react/-/react-16.14.0.tgz", - "integrity": "sha512-0X2CImDkJGApiAlcf0ODKIneSwBPhqJawOa5wCtKbu7ZECrmS26NvtSILynQ66cgkT/RJ4LidJOc3bUESwmU8g==", - "license": "MIT", + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", + "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "dev": true, "dependencies": { - "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" + "loose-envify": "^1.1.0" }, "engines": { "node": ">=0.10.0" @@ -19705,18 +19602,25 @@ } }, "node_modules/react-dom": { - "version": "16.14.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.14.0.tgz", - "integrity": "sha512-1gCeQXDLoIqMgqD3IO2Ah9bnf0w9kzhwN5q4FGnHZ67hBm9yePzB5JJAIQCc8x3pFnNlwFq4RidZggNAAkzWWw==", - "license": "MIT", + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", + "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2", - "scheduler": "^0.19.1" + "scheduler": "^0.23.2" }, "peerDependencies": { - "react": "^16.14.0" + "react": "^18.3.1" + } + }, + "node_modules/react-dom/node_modules/scheduler": { + "version": "0.23.2", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", + "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", + "dev": true, + "dependencies": { + "loose-envify": "^1.1.0" } }, "node_modules/react-error-overlay": { @@ -19737,21 +19641,9 @@ "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", + "dev": true, "license": "MIT" }, - "node_modules/react-overridable": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/react-overridable/-/react-overridable-1.0.0.tgz", - "integrity": "sha512-s6pF5rTlB3MDFdM5xbkzOEj9yCLXMVAlXgcuPSVdqknqUnHybR7NfDQe1qkasdS1AZ3LLbZkb5JKmFRfaK9nwg==", - "license": "MIT", - "peer": true, - "peerDependencies": { - "@babel/runtime": "^7.9.0", - "prop-types": "^15.7.0", - "react": ">=16.14.0", - "react-dom": ">=16.14.0" - } - }, "node_modules/react-popper": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", @@ -20931,6 +20823,7 @@ "version": "0.19.1", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", + "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.1.0", diff --git a/package.json b/package.json index b869ca4b..a105ea3c 100644 --- a/package.json +++ b/package.json @@ -31,8 +31,8 @@ "lodash": "^4.17.0", "luxon": "^1.23.0", "query-string": "^7.0.0", - "react": "^16.13.0", - "react-dom": "^16.13.0", + "react": "^18.3.0", + "react-dom": "^18.3.0", "semantic-ui-css": "^2.4.0", "semantic-ui-react": "^2.1.0", "tinymce": "^6.7.2", @@ -41,7 +41,7 @@ }, "devDependencies": { "@babel/cli": "^7.5.0", - "@inveniosoftware/eslint-config-invenio": "^2.0.0", + "@inveniosoftware/eslint-config-invenio": "^2.1.0", "@rollup/plugin-babel": "^5.0.0", "@rollup/plugin-commonjs": "^11.1.0", "@rollup/plugin-node-resolve": "^7.1.0", @@ -62,8 +62,8 @@ "lodash": "^4.17.0", "luxon": "^1.23.0", "query-string": "^7.0.0", - "react": "^16.13.0", - "react-dom": "^16.13.0", + "react": "^18.3.0", + "react-dom": "^18.3.0", "react-scripts": "^5.0.1", "rimraf": "^3.0.0", "rollup": "^2.10.0", @@ -111,6 +111,6 @@ ] }, "engines": { - "node": ">=16.0.0" + "node": ">=22.0.0" } } From 255f98a6c9be7eb644f3175eabf76a17aff5b711 Mon Sep 17 00:00:00 2001 From: Miroslav Bauer Date: Thu, 7 May 2026 20:44:19 +0200 Subject: [PATCH 2/3] feat: apply react18 code transforms * Applies update-react-imports codemod * Applies pure-component codemod * Migrates ReactDOM.render to createRoot API --- src/demos/App.js | 10 +- src/index.js | 6 +- src/lib/elements/ErrorMessage.js | 27 ++-- .../elements/GridResponsiveSidebarColumn.js | 6 +- src/lib/elements/Image.js | 4 +- .../elements/accessibility/InvenioPopup.js | 66 +++++---- .../bulk_actions/SearchResultsBulkActions.js | 2 +- .../SearchResultsBulkActionsManager.js | 2 +- .../bulk_actions/SearchResultsRowCheckbox.js | 2 +- src/lib/elements/bulk_actions/context.js | 4 +- .../records/AffiliationsSuggestions.js | 1 - .../invenioRDM/users/UserListItemCompact.js | 57 ++++---- src/lib/forms/AccordionField.js | 2 +- src/lib/forms/ArrayField.js | 2 +- src/lib/forms/BaseForm/BaseForm.js | 17 +-- src/lib/forms/BooleanField.js | 2 +- src/lib/forms/ErrorLabel.js | 2 +- src/lib/forms/FeedbackLabel.js | 2 +- src/lib/forms/FieldLabel.js | 19 ++- src/lib/forms/FieldLabel.test.js | 12 +- src/lib/forms/FilesList.js | 51 ++++--- src/lib/forms/GroupField.js | 4 +- src/lib/forms/RadioField.js | 2 +- src/lib/forms/RadioField.test.js | 8 +- src/lib/forms/RemoteSelectField.js | 2 +- src/lib/forms/RichEditor.js | 6 +- src/lib/forms/RichInputField.js | 4 +- src/lib/forms/SelectField.js | 2 +- src/lib/forms/TextAreaField.js | 2 +- src/lib/forms/TextField.js | 123 +++++++++-------- src/lib/forms/ToggleField.js | 2 +- src/lib/forms/fieldComponents.js | 4 +- src/lib/forms/widgets/array/Array.js | 67 +++++----- .../AddDiscoverableFieldsModal.js | 2 +- .../widgets/custom_fields/CustomFields.js | 2 +- .../custom_fields/DiscoverFieldsSection.js | 2 +- .../ListAndFilterCustomFields.js | 2 +- .../widgets/custom_fields/RemoveField.js | 33 +++-- .../SubjectAutocompleteDropdown.js | 2 +- src/lib/forms/widgets/loader.js | 2 +- .../widgets/select/AutocompleteDropdown.js | 125 +++++++++--------- src/lib/forms/widgets/select/Dropdown.js | 2 +- src/lib/forms/widgets/text/BooleanCheckbox.js | 1 - src/lib/forms/widgets/text/Input.js | 57 ++++---- src/lib/forms/widgets/text/MultiInput.js | 2 +- src/lib/forms/widgets/text/NumberInput.js | 1 - src/lib/forms/widgets/text/RichInput.js | 61 ++++----- src/lib/forms/widgets/text/TextArea.js | 57 ++++---- src/lib/utils/dropdownOptionsGenerator.js | 2 - 49 files changed, 415 insertions(+), 460 deletions(-) diff --git a/src/demos/App.js b/src/demos/App.js index b6889063..63783820 100644 --- a/src/demos/App.js +++ b/src/demos/App.js @@ -5,8 +5,6 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; - import PropTypes from "prop-types"; import * as Yup from "yup"; import { Header, Message, Container } from "semantic-ui-react"; @@ -31,11 +29,9 @@ CurrentRecord.defaultProps = { record: undefined, }; -class RecordPreviewer extends Component { - render() { - const { record } = this.props; - return ; - } +function RecordPreviewer(props) { + const { record } = props; + return ; } RecordPreviewer.propTypes = { diff --git a/src/index.js b/src/index.js index f457f214..3a2e3f93 100644 --- a/src/index.js +++ b/src/index.js @@ -6,9 +6,9 @@ * under the terms of the MIT License; see LICENSE file for more details. */ -import React from "react"; -import ReactDOM from "react-dom"; +import { createRoot } from "react-dom/client"; import App from "./demos/App"; import "semantic-ui-css/semantic.min.css"; -ReactDOM.render(, document.getElementById("root")); +const root = createRoot(document.getElementById("root")); +root.render(); diff --git a/src/lib/elements/ErrorMessage.js b/src/lib/elements/ErrorMessage.js index 50494a6f..9d0fdddf 100644 --- a/src/lib/elements/ErrorMessage.js +++ b/src/lib/elements/ErrorMessage.js @@ -6,7 +6,6 @@ import { Message, Icon } from "semantic-ui-react"; import PropTypes from "prop-types"; -import React, { Component } from "react"; import _isEmpty from "lodash/isEmpty"; const FieldErrorList = ({ fieldErrors }) => { @@ -48,21 +47,19 @@ FieldErrorList.propTypes = { * - complex error messages: provide list or received errors. * Icon and other ui props are supported. */ -export class ErrorMessage extends Component { - render() { - const { header, errors, content, icon, ...uiProps } = this.props; +export function ErrorMessage(props) { + const { header, errors, content, icon, ...uiProps } = props; - return ( - - {icon && } - - {header && {header}} - {content} - {!_isEmpty(errors) && } - - - ); - } + return ( + + {icon && } + + {header && {header}} + {content} + {!_isEmpty(errors) && } + + + ); } ErrorMessage.propTypes = { diff --git a/src/lib/elements/GridResponsiveSidebarColumn.js b/src/lib/elements/GridResponsiveSidebarColumn.js index ff1db613..baeac436 100644 --- a/src/lib/elements/GridResponsiveSidebarColumn.js +++ b/src/lib/elements/GridResponsiveSidebarColumn.js @@ -1,10 +1,10 @@ -import React from "react"; +import { createRef, Component } from "react"; import PropTypes from "prop-types"; import { Grid, Sidebar, Button, Segment } from "semantic-ui-react"; -export class GridResponsiveSidebarColumn extends React.Component { +export class GridResponsiveSidebarColumn extends Component { render() { - const closeSidebarBtnRef = React.createRef(); + const closeSidebarBtnRef = createRef(); const { mobile, tablet, diff --git a/src/lib/elements/Image.js b/src/lib/elements/Image.js index 9a7f347a..52e1387d 100644 --- a/src/lib/elements/Image.js +++ b/src/lib/elements/Image.js @@ -5,7 +5,7 @@ // under the terms of the MIT License; see LICENSE file for more details. import PropTypes from "prop-types"; -import React, { Component } from "react"; +import { createRef, Component } from "react"; import { Image as SUIImage, Ref } from "semantic-ui-react"; import axios from "axios"; @@ -27,7 +27,7 @@ export class Image extends Component { } } } - myRef = React.createRef(); + myRef = createRef(); setSrc = (currentTarget, src, isFallback = false) => { if (isFallback) { diff --git a/src/lib/elements/accessibility/InvenioPopup.js b/src/lib/elements/accessibility/InvenioPopup.js index 74e793bb..cfeadc07 100644 --- a/src/lib/elements/accessibility/InvenioPopup.js +++ b/src/lib/elements/accessibility/InvenioPopup.js @@ -4,44 +4,42 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; +import { cloneElement } from "react"; import PropTypes from "prop-types"; import { Popup } from "semantic-ui-react"; -export class InvenioPopup extends Component { - render() { - const { - popupId, - size, - trigger, - content, - position, - inverted, - ariaLabel, - hoverable, - } = this.props; +export function InvenioPopup(props) { + const { + popupId, + size, + trigger, + content, + position, + inverted, + ariaLabel, + hoverable, + } = props; - return ( - - {content} -

- } - /> - ); - } + return ( + + {content} +

+ } + /> + ); } InvenioPopup.propTypes = { diff --git a/src/lib/elements/bulk_actions/SearchResultsBulkActions.js b/src/lib/elements/bulk_actions/SearchResultsBulkActions.js index 4526c5c9..d01ac82d 100644 --- a/src/lib/elements/bulk_actions/SearchResultsBulkActions.js +++ b/src/lib/elements/bulk_actions/SearchResultsBulkActions.js @@ -6,7 +6,7 @@ * under the terms of the MIT License; see LICENSE file for more details. */ -import React, { Component } from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { Checkbox, Dropdown } from "semantic-ui-react"; import { BulkActionsContext } from "./context"; diff --git a/src/lib/elements/bulk_actions/SearchResultsBulkActionsManager.js b/src/lib/elements/bulk_actions/SearchResultsBulkActionsManager.js index 4adf9edb..3b8bb939 100644 --- a/src/lib/elements/bulk_actions/SearchResultsBulkActionsManager.js +++ b/src/lib/elements/bulk_actions/SearchResultsBulkActionsManager.js @@ -1,5 +1,5 @@ import { BulkActionsContext } from "./context"; -import React, { Component } from "react"; +import { Component } from "react"; import _hasIn from "lodash/hasIn"; import PropTypes from "prop-types"; diff --git a/src/lib/elements/bulk_actions/SearchResultsRowCheckbox.js b/src/lib/elements/bulk_actions/SearchResultsRowCheckbox.js index 1237751b..54e4e23b 100644 --- a/src/lib/elements/bulk_actions/SearchResultsRowCheckbox.js +++ b/src/lib/elements/bulk_actions/SearchResultsRowCheckbox.js @@ -1,5 +1,5 @@ import { BulkActionsContext } from "./context"; -import React, { Component } from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { Checkbox } from "semantic-ui-react"; import _hasIn from "lodash/hasIn"; diff --git a/src/lib/elements/bulk_actions/context.js b/src/lib/elements/bulk_actions/context.js index 4e7d7e68..141378ef 100644 --- a/src/lib/elements/bulk_actions/context.js +++ b/src/lib/elements/bulk_actions/context.js @@ -1,6 +1,6 @@ -import React from "react"; +import { createContext } from "react"; -export const BulkActionsContext = React.createContext({ +export const BulkActionsContext = createContext({ bulkActionContext: {}, addToSelected: () => {}, allSelected: false, diff --git a/src/lib/elements/contrib/invenioRDM/records/AffiliationsSuggestions.js b/src/lib/elements/contrib/invenioRDM/records/AffiliationsSuggestions.js index 28a2d1a2..ab740e95 100644 --- a/src/lib/elements/contrib/invenioRDM/records/AffiliationsSuggestions.js +++ b/src/lib/elements/contrib/invenioRDM/records/AffiliationsSuggestions.js @@ -6,7 +6,6 @@ * // under the terms of the MIT License; see LICENSE file for more details. */ -import React from "react"; import { Image } from "../../../Image"; import { Header } from "semantic-ui-react"; import Overridable from "react-overridable"; diff --git a/src/lib/elements/contrib/invenioRDM/users/UserListItemCompact.js b/src/lib/elements/contrib/invenioRDM/users/UserListItemCompact.js index 76a1d4a5..01de637b 100644 --- a/src/lib/elements/contrib/invenioRDM/users/UserListItemCompact.js +++ b/src/lib/elements/contrib/invenioRDM/users/UserListItemCompact.js @@ -1,38 +1,35 @@ -import React, { Component } from "react"; import PropTypes from "prop-types"; import { Image } from "../../../Image"; import { Item, Label } from "semantic-ui-react"; -export class UserListItemCompact extends Component { - render() { - const { id, user, linkToDetailView } = this.props; - const name = user.profile?.full_name || user.username; - return ( - - - - - {linkToDetailView ? ( - - {name} - - ) : ( +export function UserListItemCompact(props) { + const { id, user, linkToDetailView } = props; + const name = user.profile?.full_name || user.username; + return ( + + + + + {linkToDetailView ? ( + {name} - )} - {user.type === "group" && } - {user.is_current_user && ( - - )} - - -
{user.profile?.affiliations}
- - - - ); - } + + ) : ( + {name} + )} + {user.type === "group" && } + {user.is_current_user && ( + + )} + + +
{user.profile?.affiliations}
+ + + + ); } UserListItemCompact.propTypes = { diff --git a/src/lib/forms/AccordionField.js b/src/lib/forms/AccordionField.js index 546ef8df..829eacff 100644 --- a/src/lib/forms/AccordionField.js +++ b/src/lib/forms/AccordionField.js @@ -6,7 +6,7 @@ import _get from "lodash/get"; import isEmpty from "lodash/isEmpty"; -import React, { Component } from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { Field, FastField } from "formik"; import { Accordion, Container, Icon, Label } from "semantic-ui-react"; diff --git a/src/lib/forms/ArrayField.js b/src/lib/forms/ArrayField.js index ea6e2765..5ffddfba 100644 --- a/src/lib/forms/ArrayField.js +++ b/src/lib/forms/ArrayField.js @@ -5,7 +5,7 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { getIn, FieldArray } from "formik"; import { Form, Icon } from "semantic-ui-react"; diff --git a/src/lib/forms/BaseForm/BaseForm.js b/src/lib/forms/BaseForm/BaseForm.js index 9d8994df..05951079 100644 --- a/src/lib/forms/BaseForm/BaseForm.js +++ b/src/lib/forms/BaseForm/BaseForm.js @@ -5,20 +5,17 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; import PropTypes from "prop-types"; import { Formik } from "formik"; import { Form } from "semantic-ui-react"; -export class BaseForm extends Component { - render() { - const { formik, onSubmit, children } = this.props; - return ( - -
{children}
- - ); - } +export function BaseForm(props) { + const { formik, onSubmit, children } = props; + return ( + +
{children}
+ + ); } BaseForm.propTypes = { diff --git a/src/lib/forms/BooleanField.js b/src/lib/forms/BooleanField.js index a18c5300..3df9bc1a 100644 --- a/src/lib/forms/BooleanField.js +++ b/src/lib/forms/BooleanField.js @@ -5,7 +5,7 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; +import { Component } from "react"; import PropTypes from "prop-types"; import { FastField, Field, getIn } from "formik"; import { Form } from "semantic-ui-react"; diff --git a/src/lib/forms/ErrorLabel.js b/src/lib/forms/ErrorLabel.js index 66c2a532..ed3095a5 100644 --- a/src/lib/forms/ErrorLabel.js +++ b/src/lib/forms/ErrorLabel.js @@ -8,7 +8,7 @@ import { Field } from "formik"; import _get from "lodash/get"; import PropTypes from "prop-types"; -import React, { Component } from "react"; +import { Component } from "react"; import { Label } from "semantic-ui-react"; export class ErrorLabel extends Component { diff --git a/src/lib/forms/FeedbackLabel.js b/src/lib/forms/FeedbackLabel.js index 092b6a65..5064c915 100644 --- a/src/lib/forms/FeedbackLabel.js +++ b/src/lib/forms/FeedbackLabel.js @@ -5,7 +5,7 @@ import _get from "lodash/get"; import isEmpty from "lodash/isEmpty"; -import React, { Component } from "react"; +import { Component } from "react"; import { Label, Icon } from "semantic-ui-react"; import { InvenioPopup } from "../elements/accessibility"; import PropTypes from "prop-types"; diff --git a/src/lib/forms/FieldLabel.js b/src/lib/forms/FieldLabel.js index 4c375ef7..89952763 100644 --- a/src/lib/forms/FieldLabel.js +++ b/src/lib/forms/FieldLabel.js @@ -6,20 +6,17 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; import PropTypes from "prop-types"; import { Icon } from "semantic-ui-react"; -export class FieldLabel extends Component { - render() { - const { htmlFor, icon, label, className } = this.props; - return ( - - ); - } +export function FieldLabel(props) { + const { htmlFor, icon, label, className } = props; + return ( + + ); } FieldLabel.propTypes = { diff --git a/src/lib/forms/FieldLabel.test.js b/src/lib/forms/FieldLabel.test.js index e04c8df8..cd1b79c2 100644 --- a/src/lib/forms/FieldLabel.test.js +++ b/src/lib/forms/FieldLabel.test.js @@ -5,19 +5,21 @@ // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React from "react"; -import ReactDOM from "react-dom"; +import { createRoot } from "react-dom/client"; import { FieldLabel } from "./FieldLabel"; it("renders without crashing with no props", () => { const div = document.createElement("div"); - ReactDOM.render(, div); + const root = createRoot(div); + root.render(); + root.unmount(); }); it("renders without crashing with all props", () => { const div = document.createElement("div"); - ReactDOM.render( + const root = createRoot(div); + root.render( , - div ); + root.unmount(); }); diff --git a/src/lib/forms/FilesList.js b/src/lib/forms/FilesList.js index 514e0490..1c0d86eb 100644 --- a/src/lib/forms/FilesList.js +++ b/src/lib/forms/FilesList.js @@ -3,7 +3,6 @@ // // React-Invenio-Forms is free software; you can redistribute it and/or modify it // under the terms of the MIT License; see LICENSE file for more details. -import React, { Component } from "react"; import PropTypes from "prop-types"; import { Label } from "semantic-ui-react"; import { humanReadableBytes } from "../utils/humanReadableBytes"; @@ -16,33 +15,31 @@ import { humanReadableBytes } from "../utils/humanReadableBytes"; * @param {function} props.onFileDelete The function to call when deleting a file from the list. * @returns {JSX.Element} */ -export class FilesList extends Component { - render() { - const { files, onFileDelete } = this.props; +export function FilesList(props) { + const { files, onFileDelete } = props; - return files?.map((file) => ( -