diff --git a/.changeset/great-bats-warn.md b/.changeset/great-bats-warn.md new file mode 100644 index 000000000000..9dd5121fe4d4 --- /dev/null +++ b/.changeset/great-bats-warn.md @@ -0,0 +1,8 @@ +--- +'@data-client/use-enhanced-reducer': patch +'@data-client/react': patch +'@data-client/test': patch +'@data-client/ssr': patch +--- + +Improve compatibility with React 19 diff --git a/.circleci/config.yml b/.circleci/config.yml index 74461e53b697..6c04e57641be 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -85,26 +85,30 @@ jobs: at: ~/ - run: command: | - if [ "<< parameters.react-version >>" != "^18" ]; then + if [ "<< parameters.react-version >>" == "^17.0.0" ]; then YARN_ENABLE_GLOBAL_CACHE=false yarn remove @react-navigation/native @react-navigation/native-stack react-native-screens YARN_ENABLE_GLOBAL_CACHE=false yarn workspace @data-client/react remove @react-navigation/native YARN_ENABLE_GLOBAL_CACHE=false yarn add --dev react@<< parameters.react-version >> react-dom@<< parameters.react-version >> react-test-renderer@<< parameters.react-version >> @testing-library/react@^12.0.0 @testing-library/react-hooks @react-navigation/native@^6.0.0 @react-navigation/native-stack@^6.0.0 react-native-screens@^3.0.0 YARN_ENABLE_GLOBAL_CACHE=false yarn workspace @data-client/react add @react-navigation/native@^6.0.0 YARN_ENABLE_GLOBAL_CACHE=false yarn workspace @data-client/test add @testing-library/react@^12.0.0 + elif [ "<< parameters.react-version >>" == "^18" ]; then + YARN_ENABLE_GLOBAL_CACHE=false yarn add --dev react@<< parameters.react-version >> react-dom@<< parameters.react-version >> react-test-renderer@<< parameters.react-version >> fi - run: command: | if [ "<< parameters.react-version >>" == "^17.0.0" ]; then + yarn test:ci --maxWorkers=3 --selectProjects ReactDOM ReactNative --testPathPattern packages/react packages/use-enhanced-reducer packages/img + elif [ "<< parameters.react-version >>" == "^18" ]; then curl -Os https://uploader.codecov.io/latest/linux/codecov; chmod +x codecov; - yarn run test:coverage --ci --maxWorkers=4 --coverageReporters=text-lcov > ./lcov.info; + yarn run test:coverage --ci --maxWorkers=3 --coverageReporters=text-lcov > ./lcov.info; if [ "$CODECOV_TOKEN" != "" ]; then ./codecov -t ${CODECOV_TOKEN} < ./lcov.info || true; else ./codecov < ./lcov.info || true; fi else - yarn test:ci --maxWorkers=3 --selectProjects ReactDOM ReactNative + yarn test:ci --maxWorkers=4 --selectProjects Node ReactDOM --testPathPattern packages/react packages/use-enhanced-reducer packages/img fi node_matrix: @@ -146,21 +150,25 @@ jobs: - run: command: | if [ "<< parameters.typescript-version >>" != "latest" ]; then - YARN_ENABLE_GLOBAL_CACHE=false yarn add --dev typescript@<< parameters.typescript-version >> + YARN_ENABLE_GLOBAL_CACHE=false yarn add --dev typescript@~<< parameters.typescript-version >> fi - if [ "<< parameters.typescript-version >>" == "~4.0" ]; then - YARN_ENABLE_GLOBAL_CACHE=false yarn workspaces foreach -Rt --from github-app --from todo-app add -DE @types/react@18.0.0 + if [[ "<< parameters.typescript-version >>" == "4.0" || \ + "<< parameters.typescript-version >>" == "4.1" || \ + "<< parameters.typescript-version >>" == "4.3" ]]; then + sed -i '/"@types\/react":/d' package.json + sed -i '/"@types\/react-dom":/d' package.json + YARN_ENABLE_GLOBAL_CACHE=false yarn workspaces foreach -Rt --from github-app --from todo-app add -DE @types/react@ts<< parameters.typescript-version >> fi - run: name: typecheck command: | - if [ "<< parameters.typescript-version >>" == "latest" ] || [ "<< parameters.typescript-version >>" == "~5.3" ] || [ "<< parameters.typescript-version >>" == "~4.8" ]; then + if [ "<< parameters.typescript-version >>" == "latest" ] || [ "<< parameters.typescript-version >>" == "5.3" ] || [ "<< parameters.typescript-version >>" == "4.8" ]; then yarn run tsc --project examples/todo-app/tsconfig.json yarn run tsc --project examples/github-app/tsconfig.json fi yarn run tsc --project examples/todo-app/tsconfig.typetest.json yarn run tsc --project examples/github-app/tsconfig.typetest.json - if [ "<< parameters.typescript-version >>" != "~4.0" ]; then + if [ "<< parameters.typescript-version >>" != "4.0" ]; then yarn run tsc --project examples/todo-app/tsconfig.typetest41.json fi @@ -208,7 +216,7 @@ workflows: - unit_tests: matrix: parameters: - react-version: ["^17.0.0", "^18"] + react-version: ["^17.0.0", "^18", "latest"] requires: - setup - node_matrix: @@ -237,7 +245,7 @@ workflows: # 4.1 is min version for rest package working well # 4.3 # 4.7 (but its broken so we do 4.8) lets you apply a generic type to a function type to see its return value - typescript-version: ["~4.0", "~4.1", "~4.3", "~4.8", "~5.3", "latest"] + typescript-version: ["4.0", "4.1", "4.3", "4.8", "5.3", "latest"] requires: - setup - esmodule-loosenulltypes: diff --git a/examples/benchmark/package.json b/examples/benchmark/package.json index 25a0257577d0..9ee4e278fe67 100644 --- a/examples/benchmark/package.json +++ b/examples/benchmark/package.json @@ -22,7 +22,7 @@ "@data-client/normalizr": "workspace:^", "benchmark": "^2.1.4", "normalizr": "^3.6.2", - "react": "^18.2.0" + "react": "^19.0.0-rc.1" }, "devDependencies": { "@anansi/webpack-config": "^20.0.0", @@ -30,7 +30,7 @@ "@babel/node": "7.26.0", "@types/babel__core": "^7", "@types/benchmark": "2.1.5", - "@types/react": "18.3.12", + "@types/react": "npm:types-react@19.0.0-rc.1", "webpack": "^5.76.2", "webpack-cli": "^5.1.4" } diff --git a/examples/coin-app/package.json b/examples/coin-app/package.json index d5927dddca65..e3dd65cbfbc5 100644 --- a/examples/coin-app/package.json +++ b/examples/coin-app/package.json @@ -47,8 +47,8 @@ "@data-client/rest": "^0.14.0", "d3": "^7.9.0", "history": "*", - "react": "^18.3.0", - "react-dom": "^18.3.0" + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1" }, "main": "src/index.ts", "types": "src/index.ts", diff --git a/examples/github-app/package-lock.json b/examples/github-app/package-lock.json index 353ac8867daa..25b2e5bda93c 100644 --- a/examples/github-app/package-lock.json +++ b/examples/github-app/package-lock.json @@ -17,8 +17,8 @@ "@js-temporal/polyfill": "^0.4.4", "antd": "5.22.1", "parse-link-header": "^2.0.0", - "react": "18.3.1", - "react-dom": "18.3.1", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "react-error-boundary": "^4.0.0", "react-markdown": "9.0.1", "rehype-highlight": "7.0.1", @@ -37,8 +37,8 @@ "@linaria/shaker": "5.0.3", "@types/lodash": "4.14.192", "@types/parse-link-header": "^2.0.0", - "@types/react": "18.3.12", - "@types/react-dom": "18.3.1", + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "@types/uuid": "^10.0.0", "react-refresh": "0.14.2", "serve": "14.2.4", @@ -4801,12 +4801,6 @@ "integrity": "sha512-ffLAxD6Xqcf2gSbtEJehj8yJ5R/2OZqD4liodQvQQ+hhO4kg1mk9ToEZQPMtNTm/zIQj2GNleQbsjPp9+UQm4Q==", "dev": true }, - "node_modules/@types/prop-types": { - "version": "15.7.5", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", - "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", - "license": "MIT" - }, "node_modules/@types/qs": { "version": "6.9.7", "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.7.tgz", @@ -4822,21 +4816,21 @@ "license": "MIT" }, "node_modules/@types/react": { - "version": "18.3.12", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.3.12.tgz", - "integrity": "sha512-D2wOSq/d6Agt28q7rSI3jhU7G6aiuzljDGZ2hTZHIkrTLUI+AF3WMeKkEZ9nN2fkBAlcktT6vcZjDFiIhMYEQw==", - "license": "MIT", + "name": "types-react", + "version": "19.0.0-rc.1", + "resolved": "https://registry.npmjs.org/types-react/-/types-react-19.0.0-rc.1.tgz", + "integrity": "sha512-RshndUfqTW6K3STLPis8BtAYCGOkMbtvYsi90gmVNDZBXUyUc5juf2PE9LfS/JmOlUIRO8cWTS/1MTnmhjDqyQ==", + "dev": true, "dependencies": { - "@types/prop-types": "*", "csstype": "^3.0.2" } }, "node_modules/@types/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==", + "name": "types-react-dom", + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/types-react-dom/-/types-react-dom-19.0.0.tgz", + "integrity": "sha512-qtWBYduBCmrgf4wqnTrGttEJJSZ6cTGmzuvmWd/34TJNKz/Pp69Islc1+txHF3nRxSuRvmhxztFXvLyxhp8G2w==", "dev": true, - "license": "MIT", "dependencies": { "@types/react": "*" } @@ -8895,14 +8889,6 @@ "dev": true, "license": "MIT" }, - "node_modules/fast-diff": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", - "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", - "dev": true, - "license": "Apache-2.0", - "peer": true - }, "node_modules/fast-glob": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.1.tgz", @@ -10642,6 +10628,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": { @@ -10854,28 +10841,12 @@ "dev": true, "license": "MIT" }, - "node_modules/lodash.clonedeep": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz", - "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==", "dev": true }, - "node_modules/lodash.isequal": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz", - "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/lodash.isplainobject": { "version": "4.0.6", "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz", @@ -10909,18 +10880,6 @@ "url": "https://github.com/sponsors/wooorm" } }, - "node_modules/loose-envify": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", - "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", - "license": "MIT", - "dependencies": { - "js-tokens": "^3.0.0 || ^4.0.0" - }, - "bin": { - "loose-envify": "cli.js" - } - }, "node_modules/lower-case": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", @@ -14456,22 +14415,6 @@ ], "license": "MIT" }, - "node_modules/quill-delta": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-5.1.0.tgz", - "integrity": "sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "fast-diff": "^1.3.0", - "lodash.clonedeep": "^4.5.0", - "lodash.isequal": "^4.5.0" - }, - "engines": { - "node": ">= 12.0.0" - } - }, "node_modules/ramda": { "version": "0.30.1", "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.30.1.tgz", @@ -15156,12 +15099,9 @@ } }, "node_modules/react": { - "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==", - "dependencies": { - "loose-envify": "^1.1.0" - }, + "version": "19.0.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/react/-/react-19.0.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-nvE3Gy+IOIfH/DXhkyxFVQSrITarFcQz4+shzC/McxQXEUSonpw2oDy/Wi9hdDtV3hlP12VYuDL95iiBREedNQ==", "engines": { "node": ">=0.10.0" } @@ -15220,15 +15160,14 @@ "license": "MIT" }, "node_modules/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "version": "19.0.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-PoEsPe32F7KPLYOBvZfjylEI1B67N44PwY3lyvpmBkhlluLnLz0jH8q2Wg9YidAi6z0k3iUnNRm5x10wurzt9Q==", "dependencies": { - "loose-envify": "^1.1.0", - "scheduler": "^0.23.2" + "scheduler": "0.25.0-rc-fb9a90fa48-20240614" }, "peerDependencies": { - "react": "^18.3.1" + "react": "19.0.0-rc-fb9a90fa48-20240614" } }, "node_modules/react-error-boundary": { @@ -15728,17 +15667,6 @@ "queue-microtask": "^1.2.2" } }, - "node_modules/rxjs": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", - "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, - "license": "Apache-2.0", - "peer": true, - "dependencies": { - "tslib": "^2.1.0" - } - }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -15840,12 +15768,9 @@ } }, "node_modules/scheduler": { - "version": "0.23.2", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", - "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", - "dependencies": { - "loose-envify": "^1.1.0" - } + "version": "0.25.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-HHqQ/SqbeiDfXXVKgNxTpbQTD4n7IUb4hZATvHjp03jr3TF7igehCyHdOjeYTrzIseLO93cTTfSb5f4qWcirMQ==" }, "node_modules/schema-utils": { "version": "3.3.0", @@ -16947,21 +16872,6 @@ "node": ">= 0.6" } }, - "node_modules/typescript": { - "version": "5.6.2", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.2.tgz", - "integrity": "sha512-NW8ByodCSNCwZeghjN3o+JX5OFH0Ojg6sadjEKY4huZ52TqbJTJnDo5+Tw98lSy63NZvi4n+ez5m2u5d4PkZyw==", - "dev": true, - "license": "Apache-2.0", - "peer": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=14.17" - } - }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz", diff --git a/examples/github-app/package.json b/examples/github-app/package.json index 4159e426de69..fafc1aa3a617 100644 --- a/examples/github-app/package.json +++ b/examples/github-app/package.json @@ -35,8 +35,8 @@ "@linaria/shaker": "5.0.3", "@types/lodash": "4.14.192", "@types/parse-link-header": "^2.0.0", - "@types/react": "18.3.12", - "@types/react-dom": "18.3.1", + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "@types/uuid": "^10.0.0", "react-refresh": "0.14.2", "serve": "14.2.4", @@ -53,8 +53,8 @@ "@js-temporal/polyfill": "^0.4.4", "antd": "5.22.1", "parse-link-header": "^2.0.0", - "react": "18.3.1", - "react-dom": "18.3.1", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "react-error-boundary": "^4.0.0", "react-markdown": "9.0.1", "rehype-highlight": "7.0.1", diff --git a/examples/github-app/src/pages/IssueDetail/index.tsx b/examples/github-app/src/pages/IssueDetail/index.tsx index 79342652d5f1..ad3d5e2eed3d 100644 --- a/examples/github-app/src/pages/IssueDetail/index.tsx +++ b/examples/github-app/src/pages/IssueDetail/index.tsx @@ -2,7 +2,7 @@ import { Link } from '@anansi/router'; import { useSuspense, useCache, useDLE } from '@data-client/react'; import { Card, Avatar } from 'antd'; import { Tag } from 'antd'; -import React, { useMemo, memo } from 'react'; +import React, { useMemo, memo, type JSX } from 'react'; import { ErrorBoundary } from 'react-error-boundary'; import Markdown from 'react-markdown'; import rehypeHighlight from 'rehype-highlight'; diff --git a/examples/github-app/src/pages/ProfileDetail/UserRepos.tsx b/examples/github-app/src/pages/ProfileDetail/UserRepos.tsx index ec4fdd1fde53..33cde47d4e68 100644 --- a/examples/github-app/src/pages/ProfileDetail/UserRepos.tsx +++ b/examples/github-app/src/pages/ProfileDetail/UserRepos.tsx @@ -2,7 +2,7 @@ import { Link } from '@anansi/router'; import { ForkOutlined, StarOutlined } from '@ant-design/icons'; import { useCache, useSuspense } from '@data-client/react'; import { List, Space, Typography } from 'antd'; -import React from 'react'; +import React, { type JSX } from 'react'; import RepositoryResource, { Repository } from '@/resources/Repository'; import { UserResource, User } from '@/resources/User'; diff --git a/examples/github-app/src/resources/Event.tsx b/examples/github-app/src/resources/Event.tsx index 034a14bb4c7b..dcbdd4a482ff 100644 --- a/examples/github-app/src/resources/Event.tsx +++ b/examples/github-app/src/resources/Event.tsx @@ -8,6 +8,7 @@ import { } from '@ant-design/icons'; import { schema } from '@data-client/rest'; import { Temporal } from '@js-temporal/polyfill'; +import type { JSX } from 'react'; import { githubResource, GithubEntity } from './Base'; import { Issue } from './Issue'; diff --git a/examples/todo-app/package-lock.json b/examples/todo-app/package-lock.json index 184d587e80fd..12f1a4d8ad82 100644 --- a/examples/todo-app/package-lock.json +++ b/examples/todo-app/package-lock.json @@ -12,8 +12,8 @@ "@data-client/endpoint": "^0.14.0", "@data-client/react": "^0.14.0", "@data-client/rest": "^0.14.0", - "react": "18.3.1", - "react-dom": "18.3.1", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "uuid": "^11.0.0" }, "devDependencies": { @@ -25,7 +25,8 @@ "@linaria/core": "6.2.0", "@linaria/react": "6.2.1", "@linaria/shaker": "5.0.3", - "@types/react-dom": "18.3.1", + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "@types/uuid": "^10.0.0", "react-refresh": "0.14.2", "webpack": "5.96.1", @@ -4498,13 +4499,6 @@ "dev": true, "license": "MIT" }, - "node_modules/@types/prop-types": { - "version": "15.7.5", - "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz", - "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==", - "devOptional": true, - "license": "MIT" - }, "node_modules/@types/qs": { "version": "6.9.7", "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.7.tgz", @@ -4520,23 +4514,21 @@ "license": "MIT" }, "node_modules/@types/react": { - "version": "18.2.17", - "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.17.tgz", - "integrity": "sha512-u+e7OlgPPh+aryjOm5UJMX32OvB2E3QASOAqVMY6Ahs90djagxwv2ya0IctglNbNTexC12qCSMZG47KPfy1hAA==", - "devOptional": true, - "license": "MIT", + "name": "types-react", + "version": "19.0.0-rc.1", + "resolved": "https://registry.npmjs.org/types-react/-/types-react-19.0.0-rc.1.tgz", + "integrity": "sha512-RshndUfqTW6K3STLPis8BtAYCGOkMbtvYsi90gmVNDZBXUyUc5juf2PE9LfS/JmOlUIRO8cWTS/1MTnmhjDqyQ==", + "dev": true, "dependencies": { - "@types/prop-types": "*", - "@types/scheduler": "*", "csstype": "^3.0.2" } }, "node_modules/@types/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-qW1Mfv8taImTthu4KoXgDfLuk4bydU6Q/TkADnDWWHwi4NX4BR+LWfTp2sVmTqRrsHvyDDTelgelxJ+SsejKKQ==", + "name": "types-react-dom", + "version": "19.0.0", + "resolved": "https://registry.npmjs.org/types-react-dom/-/types-react-dom-19.0.0.tgz", + "integrity": "sha512-qtWBYduBCmrgf4wqnTrGttEJJSZ6cTGmzuvmWd/34TJNKz/Pp69Islc1+txHF3nRxSuRvmhxztFXvLyxhp8G2w==", "dev": true, - "license": "MIT", "dependencies": { "@types/react": "*" } @@ -4560,13 +4552,6 @@ "sass": "^1.45.0" } }, - "node_modules/@types/scheduler": { - "version": "0.16.3", - "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.3.tgz", - "integrity": "sha512-5cJ8CB4yAx7BH1oMvdU0Jh9lrEXyPkar6F9G/ERswkCuvP4KQZfZkSjcMbAICCpQTN4OuZn8tz0HiKv9TGZgrQ==", - "devOptional": true, - "license": "MIT" - }, "node_modules/@types/send": { "version": "0.17.1", "resolved": "https://registry.npmjs.org/@types/send/-/send-0.17.1.tgz", @@ -7374,7 +7359,7 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.2.tgz", "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/debounce": { @@ -8187,14 +8172,6 @@ "dev": true, "license": "MIT" }, - "node_modules/fast-diff": { - "version": "1.3.0", - "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", - "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", - "dev": true, - "license": "Apache-2.0", - "peer": true - }, "node_modules/fast-glob": { "version": "3.3.1", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.1.tgz", @@ -9763,6 +9740,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": { @@ -9961,28 +9939,12 @@ "dev": true, "license": "MIT" }, - "node_modules/lodash.clonedeep": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz", - "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==", "dev": true }, - "node_modules/lodash.isequal": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz", - "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==", - "dev": true, - "license": "MIT", - "peer": true - }, "node_modules/lodash.isplainobject": { "version": "4.0.6", "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz", @@ -10007,18 +9969,6 @@ "dev": true, "license": "MIT" }, - "node_modules/loose-envify": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", - "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==", - "license": "MIT", - "dependencies": { - "js-tokens": "^3.0.0 || ^4.0.0" - }, - "bin": { - "loose-envify": "cli.js" - } - }, "node_modules/lower-case": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz", @@ -12736,22 +12686,6 @@ ], "license": "MIT" }, - "node_modules/quill-delta": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-5.1.0.tgz", - "integrity": "sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==", - "dev": true, - "license": "MIT", - "peer": true, - "dependencies": { - "fast-diff": "^1.3.0", - "lodash.clonedeep": "^4.5.0", - "lodash.isequal": "^4.5.0" - }, - "engines": { - "node": ">= 12.0.0" - } - }, "node_modules/ramda": { "version": "0.30.1", "resolved": "https://registry.npmjs.org/ramda/-/ramda-0.30.1.tgz", @@ -12810,12 +12744,9 @@ } }, "node_modules/react": { - "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==", - "dependencies": { - "loose-envify": "^1.1.0" - }, + "version": "19.0.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/react/-/react-19.0.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-nvE3Gy+IOIfH/DXhkyxFVQSrITarFcQz4+shzC/McxQXEUSonpw2oDy/Wi9hdDtV3hlP12VYuDL95iiBREedNQ==", "engines": { "node": ">=0.10.0" } @@ -12874,15 +12805,14 @@ "license": "MIT" }, "node_modules/react-dom": { - "version": "18.3.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", - "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "version": "19.0.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-PoEsPe32F7KPLYOBvZfjylEI1B67N44PwY3lyvpmBkhlluLnLz0jH8q2Wg9YidAi6z0k3iUnNRm5x10wurzt9Q==", "dependencies": { - "loose-envify": "^1.1.0", - "scheduler": "^0.23.2" + "scheduler": "0.25.0-rc-fb9a90fa48-20240614" }, "peerDependencies": { - "react": "^18.3.1" + "react": "19.0.0-rc-fb9a90fa48-20240614" } }, "node_modules/react-error-overlay": { @@ -13221,17 +13151,6 @@ "queue-microtask": "^1.2.2" } }, - "node_modules/rxjs": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", - "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", - "dev": true, - "license": "Apache-2.0", - "peer": true, - "dependencies": { - "tslib": "^2.1.0" - } - }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -13333,12 +13252,9 @@ } }, "node_modules/scheduler": { - "version": "0.23.2", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", - "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", - "dependencies": { - "loose-envify": "^1.1.0" - } + "version": "0.25.0-rc-fb9a90fa48-20240614", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0-rc-fb9a90fa48-20240614.tgz", + "integrity": "sha512-HHqQ/SqbeiDfXXVKgNxTpbQTD4n7IUb4hZATvHjp03jr3TF7igehCyHdOjeYTrzIseLO93cTTfSb5f4qWcirMQ==" }, "node_modules/schema-utils": { "version": "3.3.0", @@ -14193,21 +14109,6 @@ "node": ">= 0.6" } }, - "node_modules/typescript": { - "version": "5.6.2", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.6.2.tgz", - "integrity": "sha512-NW8ByodCSNCwZeghjN3o+JX5OFH0Ojg6sadjEKY4huZ52TqbJTJnDo5+Tw98lSy63NZvi4n+ez5m2u5d4PkZyw==", - "dev": true, - "license": "Apache-2.0", - "peer": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=14.17" - } - }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.1.tgz", diff --git a/examples/todo-app/package.json b/examples/todo-app/package.json index 04518b3a3676..8b0c58e1e58d 100644 --- a/examples/todo-app/package.json +++ b/examples/todo-app/package.json @@ -33,7 +33,8 @@ "@linaria/core": "6.2.0", "@linaria/react": "6.2.1", "@linaria/shaker": "5.0.3", - "@types/react-dom": "18.3.1", + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "@types/uuid": "^10.0.0", "react-refresh": "0.14.2", "webpack": "5.96.1", @@ -44,8 +45,8 @@ "@data-client/endpoint": "^0.14.0", "@data-client/react": "^0.14.0", "@data-client/rest": "^0.14.0", - "react": "18.3.1", - "react-dom": "18.3.1", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "uuid": "^11.0.0" }, "packageManager": "yarn@4.5.1" diff --git a/examples/todo-app/tsconfig.typetest.json b/examples/todo-app/tsconfig.typetest.json index 1225a13cc3b7..64312ac0675e 100644 --- a/examples/todo-app/tsconfig.typetest.json +++ b/examples/todo-app/tsconfig.typetest.json @@ -2,6 +2,7 @@ "extends": "./tsconfig", "compilerOptions": { "skipLibCheck": true, + "skipDefaultLibCheck": true }, "include": ["typetest.ts"], } diff --git a/examples/todo-app/tsconfig.typetest41.json b/examples/todo-app/tsconfig.typetest41.json index d95e4ac0b8c1..354cb757027b 100644 --- a/examples/todo-app/tsconfig.typetest41.json +++ b/examples/todo-app/tsconfig.typetest41.json @@ -2,6 +2,7 @@ "extends": "./tsconfig", "compilerOptions": { "skipLibCheck": true, + "skipDefaultLibCheck": true }, "include": ["typetest41.ts"], } diff --git a/package.json b/package.json index 19a3b85b69bf..70d800fa677e 100644 --- a/package.json +++ b/package.json @@ -65,7 +65,8 @@ "@testing-library/react-native": "12.8.1", "@types/jest": "29.5.14", "@types/node": "22.9.0", - "@types/react": "18.3.12", + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "babel-plugin-module-resolver": "5.0.2", "babel-plugin-syntax-hermes-parser": "^0.25.0", "benchmark": "^2.1.4", @@ -86,12 +87,12 @@ "node-fetch": "^3.3.0", "npm-run-all": "^4.1.5", "prettier": "3.3.3", - "react": "18.3.1", - "react-dom": "18.3.1", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "react-native": "0.76.2", - "react-native-safe-area-context": "^4.4.1", - "react-native-screens": "^4.0.0", - "react-test-renderer": "18.3.1", + "react-native-safe-area-context": "^4.14.0", + "react-native-screens": "^4.1.0", + "react-test-renderer": "^19.0.0-rc.1", "rimraf": "^6.0.0", "rollup": "2.79.2", "rollup-plugin-babel": "^4.4.0", @@ -108,6 +109,8 @@ "whatwg-fetch": "3.0.0" }, "resolutions": { + "@types/react": "npm:types-react@19.0.0-rc.1", + "@types/react-dom": "npm:types-react-dom@19.0.0", "whatwg-fetch": "3.0.0", "downlevel-dts/typescript": "4.9.0-dev.20220903" }, diff --git a/packages/react/src/__tests__/integration.node.tsx b/packages/react/src/__tests__/integration.node.tsx index d472f3793cc0..167bd8f7e19c 100644 --- a/packages/react/src/__tests__/integration.node.tsx +++ b/packages/react/src/__tests__/integration.node.tsx @@ -2,6 +2,8 @@ import { DataProvider as ExternalDataProvider } from '@data-client/react/redux'; import { CoolerArticleDetail } from '__tests__/new'; // relative imports to avoid circular dependency in tsconfig references +import React from 'react'; + import { makeRenderDataClient, act } from '../../../test'; import { useCache, useSuspense } from '../hooks'; import { useController } from '../hooks'; @@ -42,7 +44,10 @@ describe('SSR', () => { }); it('should resolve useSuspense()', async () => { - const { result, waitForNextUpdate } = renderDataClient( + // React 19 does not support SSR hook testing + if (Number(React.version.substring(0, 3)) >= 19) return; + + const { result, waitFor } = renderDataClient( () => { return useSuspense(CoolerArticleDetail, payload); }, @@ -57,7 +62,7 @@ describe('SSR', () => { }, ); expect(result.current).toBeUndefined(); - await waitForNextUpdate(); + await waitFor(() => expect(result.current).toBeDefined()); expect(result.current.title).toBe(payload.title); // @ts-expect-error expect(result.current.lafsjlfd).toBeUndefined(); diff --git a/packages/react/src/components/UniversalSuspense.tsx b/packages/react/src/components/UniversalSuspense.tsx index 09622a5be5dc..298d59de39bb 100644 --- a/packages/react/src/components/UniversalSuspense.tsx +++ b/packages/react/src/components/UniversalSuspense.tsx @@ -11,10 +11,7 @@ const UniversalSuspense: React.FunctionComponent<{ }> = /* istanbul ignore if */ LegacyReact && SSR ? - /* istanbul ignore next */ ({ children }) => children as JSX.Element + /* istanbul ignore next */ ({ children = null }) => children as JSX.Element : Suspense; -if (LegacyReact && SSR) { - UniversalSuspense.defaultProps = { children: null }; -} export default UniversalSuspense; diff --git a/packages/react/src/hooks/__tests__/useLive.tsx b/packages/react/src/hooks/__tests__/useLive.tsx index 2720fcd63810..b43a7af504e4 100644 --- a/packages/react/src/hooks/__tests__/useLive.tsx +++ b/packages/react/src/hooks/__tests__/useLive.tsx @@ -138,7 +138,7 @@ describe.each([ rerender({ active: true }); expect((result.current as any).title).toBe('fiver'); // not gonna try too hard to get the rest of this test working - if (React.version.startsWith('18')) { + if (Number(React.version.substring(0, 3)) >= 18) { jest.advanceTimersByTime(frequency); await waitFor(() => expect(lastCall.isDone()).toBeTruthy()); act(() => { diff --git a/packages/react/src/hooks/useCancelling.ts b/packages/react/src/hooks/useCancelling.ts index 4a8646e8fa43..91e141aa25a9 100644 --- a/packages/react/src/hooks/useCancelling.ts +++ b/packages/react/src/hooks/useCancelling.ts @@ -15,7 +15,7 @@ export default function useCancelling< extend: (o: { signal?: AbortSignal }) => any; }, >(endpoint: E, ...args: readonly [...Parameters] | readonly [null]): E { - const abortRef = useRef(); + const abortRef = useRef(undefined); // send abort signal anytime the params change // if fetch is already completed signal goes nowhere diff --git a/packages/react/src/server/redux/PromiseifyMiddleware.ts b/packages/react/src/server/redux/PromiseifyMiddleware.ts index 401093710dd1..c88642576a09 100644 --- a/packages/react/src/server/redux/PromiseifyMiddleware.ts +++ b/packages/react/src/server/redux/PromiseifyMiddleware.ts @@ -1,11 +1,14 @@ import type { Dispatch } from '@data-client/core'; -import React from 'react'; +import type React from 'react'; const PromiseifyMiddleware = >(_: unknown) => (next: Dispatch) => - (action: React.ReducerAction): Promise => { + (action: ReducerAction): Promise => { next(action); return Promise.resolve(); }; export default PromiseifyMiddleware; + +type ReducerAction> = + R extends React.Reducer ? A : never; diff --git a/packages/ssr/package.json b/packages/ssr/package.json index 260eefac63cc..ec8f5be3ddd9 100644 --- a/packages/ssr/package.json +++ b/packages/ssr/package.json @@ -139,7 +139,7 @@ "@types/react": "^18.0.30", "@types/react-dom": "^18.0.11", "next": "^15.0.0", - "react-dom": "^18.2.0", + "react-dom": "^19.0.0-rc.1", "redux": "^5.0.0" } } diff --git a/packages/test/src/makeRenderDataClient/renderHook.cts b/packages/test/src/makeRenderDataClient/renderHook.cts index ecb6f8ca3458..18433688558d 100644 --- a/packages/test/src/makeRenderDataClient/renderHook.cts +++ b/packages/test/src/makeRenderDataClient/renderHook.cts @@ -1,13 +1,9 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ /** * Provides an abstraction over react 17 and 18 compatible libraries */ -import type { - Queries, - waitForOptions, - RenderHookOptions, -} from '@testing-library/react'; +import type { Queries, waitForOptions } from '@testing-library/react'; +import type { RenderHookOptions } from './renderHookOptions.js'; import { USE18 } from './use18.cjs'; export const renderHook: RenderHook = @@ -30,7 +26,7 @@ export const act: ActType = require('./render18HookWrapped.js').act : (require('@testing-library/react-hooks').act as any); -export type { RenderHookOptions } from '@testing-library/react'; +export type { RenderHookOptions }; type RenderHook = < Result, diff --git a/packages/test/src/makeRenderDataClient/renderHookOptions.ts b/packages/test/src/makeRenderDataClient/renderHookOptions.ts new file mode 100644 index 000000000000..80899e776e14 --- /dev/null +++ b/packages/test/src/makeRenderDataClient/renderHookOptions.ts @@ -0,0 +1,28 @@ +import { queries } from '@testing-library/dom'; +import type { Queries, RenderOptions } from '@testing-library/react'; +import * as ReactDOMClient from 'react-dom/client'; + +export type RenderHookOptions< + Props, + Q extends Queries = typeof queries, + Container extends RendererableContainer | HydrateableContainer = HTMLElement, + BaseElement extends RendererableContainer | HydrateableContainer = Container, +> = + | import('@testing-library/react').RenderHookOptions< + Props, + Q, + Container, + BaseElement + > + | (RenderOptions & { + /** + * The argument passed to the renderHook callback. Can be useful if you plan + * to use the rerender utility to change the values passed to your hook. + */ + initialProps?: Props | undefined; + }); + +type RendererableContainer = ReactDOMClient.Container; +type HydrateableContainer = Parameters< + (typeof ReactDOMClient)['hydrateRoot'] +>[0]; diff --git a/packages/test/src/makeRenderDataClient/use18.cts b/packages/test/src/makeRenderDataClient/use18.cts index 051632ebf92c..21d9fb9696b2 100644 --- a/packages/test/src/makeRenderDataClient/use18.cts +++ b/packages/test/src/makeRenderDataClient/use18.cts @@ -2,4 +2,5 @@ import React from 'react'; // @testing-library/react-hooks does not support node/SSR, so we must fallback to previous testing export const USE18 = - React.version.startsWith('18') && typeof document !== 'undefined'; + Number(React.version.substring(0, 3)) >= 18 && + typeof document !== 'undefined'; diff --git a/packages/test/src/makeRenderDataClient/use18.native.cts b/packages/test/src/makeRenderDataClient/use18.native.cts index 1939250fd346..570613c73b64 100644 --- a/packages/test/src/makeRenderDataClient/use18.native.cts +++ b/packages/test/src/makeRenderDataClient/use18.native.cts @@ -1,3 +1,3 @@ import React from 'react'; -export const USE18 = React.version.startsWith('18'); +export const USE18 = Number(React.version.substring(0, 3)) >= 18; diff --git a/packages/use-enhanced-reducer/src/ReducerAction.ts b/packages/use-enhanced-reducer/src/ReducerAction.ts new file mode 100644 index 000000000000..a4dd1ce7a79a --- /dev/null +++ b/packages/use-enhanced-reducer/src/ReducerAction.ts @@ -0,0 +1,4 @@ +import type React from 'react'; + +export type ReducerAction> = + R extends React.Reducer ? A : never; diff --git a/packages/use-enhanced-reducer/src/types.ts b/packages/use-enhanced-reducer/src/types.ts index 7728c4d622e3..cafa8ca4b7aa 100644 --- a/packages/use-enhanced-reducer/src/types.ts +++ b/packages/use-enhanced-reducer/src/types.ts @@ -1,5 +1,7 @@ import React from 'react'; +import type { ReducerAction } from './ReducerAction.js'; + export interface MiddlewareAPI< R extends React.Reducer = React.Reducer, > { @@ -8,7 +10,7 @@ export interface MiddlewareAPI< } export type Dispatch> = ( - action: React.ReducerAction, + action: ReducerAction, ) => Promise; export type Middleware = >({ diff --git a/packages/use-enhanced-reducer/src/useEnhancedReducer.ts b/packages/use-enhanced-reducer/src/useEnhancedReducer.ts index a43706d1fc3f..49884d6d4c49 100644 --- a/packages/use-enhanced-reducer/src/useEnhancedReducer.ts +++ b/packages/use-enhanced-reducer/src/useEnhancedReducer.ts @@ -7,6 +7,7 @@ import React, { useCallback, } from 'react'; +import { ReducerAction } from './ReducerAction.js'; import { Middleware, Dispatch } from './types.js'; import usePromisifiedDispatch from './usePromisifiedDispatch.js'; @@ -28,7 +29,7 @@ export default function useEnhancedReducer>( middlewares: Middleware[], ): [ React.ReducerState, - (value: React.ReducerAction) => Promise, + (value: ReducerAction) => Promise, () => React.ReducerState, ] { const stateRef = useRef(startingState); @@ -50,7 +51,7 @@ export default function useEnhancedReducer>( // closure here around dispatch allows us to change it after middleware is constructed const middlewareAPI = { getState, - dispatch: (action: React.ReducerAction) => + dispatch: (action: ReducerAction) => protectedDispatchRef.current(action), }; const chain = middlewares.map(middleware => middleware(middlewareAPI)); diff --git a/packages/use-enhanced-reducer/src/usePromisifiedDispatch.ts b/packages/use-enhanced-reducer/src/usePromisifiedDispatch.ts index d3e57f551f67..75424c1c8827 100644 --- a/packages/use-enhanced-reducer/src/usePromisifiedDispatch.ts +++ b/packages/use-enhanced-reducer/src/usePromisifiedDispatch.ts @@ -1,15 +1,14 @@ 'use client'; import React, { useRef, useCallback, useEffect } from 'react'; +import type { ReducerAction } from './ReducerAction.js'; + type PromiseHolder = { promise: Promise; resolve: () => void }; /** Turns a dispatch function into one that resolves once its been commited */ export default function usePromisifiedDispatch< R extends React.Reducer, ->( - dispatch: React.Dispatch>, - state: React.ReducerState, -) { +>(dispatch: React.Dispatch>, state: React.ReducerState) { const dispatchPromiseRef = useRef(null); useEffect(() => { if (dispatchPromiseRef.current) { @@ -19,7 +18,7 @@ export default function usePromisifiedDispatch< }, [state]); return useCallback( - (action: React.ReducerAction) => { + (action: ReducerAction) => { if (!dispatchPromiseRef.current) { dispatchPromiseRef.current = NewPromiseHolder(); } diff --git a/website/package.json b/website/package.json index 6c2d38a38d0d..f188146456d8 100644 --- a/website/package.json +++ b/website/package.json @@ -51,8 +51,8 @@ "clsx": "2.1.1", "monaco-editor": "^0.52.0", "parse-numeric-range": "^1.3.0", - "react": "^18.2.0", - "react-dom": "^18.2.0", + "react": "^19.0.0-rc.1", + "react-dom": "^19.0.0-rc.1", "react-json-tree": "0.19.0", "react-live": "^4.0.0", "typescript": "^5.5.2", diff --git a/website/src/components/Playground/editor-types/@data-client/react.d.ts b/website/src/components/Playground/editor-types/@data-client/react.d.ts index 94f39a1fb489..654807eacec6 100644 --- a/website/src/components/Playground/editor-types/@data-client/react.d.ts +++ b/website/src/components/Playground/editor-types/@data-client/react.d.ts @@ -434,7 +434,9 @@ declare namespace internal_d { }; } +type ReducerAction> = R extends React.Reducer ? A : never; + /** Turns a dispatch function into one that resolves once its been commited */ -declare function usePromisifiedDispatch>(dispatch: React.Dispatch>, state: React.ReducerState): (action: React.ReducerAction) => Promise; +declare function usePromisifiedDispatch>(dispatch: React.Dispatch>, state: React.ReducerState): (action: ReducerAction) => Promise; export { _default as AsyncBoundary, BackupLoading, DataProvider as CacheProvider, ControllerContext, DataProvider, DevToolsPosition, ErrorBoundary, WebIdlingNetworkManager as IdlingNetworkManager, ErrorBoundary as NetworkErrorBoundary, ProviderProps, StateContext, Store, StoreContext, UniversalSuspense, internal_d as __INTERNAL__, getDefaultManagers, useCache, useCancelling, useController, useDLE, useDebounce, useError, useFetch, useLive, useLoading, usePromisifiedDispatch, useQuery, useSubscription, useSuspense }; diff --git a/website/src/components/Playground/editor-types/@data-client/react/redux.d.ts b/website/src/components/Playground/editor-types/@data-client/react/redux.d.ts index 355af70f1dce..92ddd2be4758 100644 --- a/website/src/components/Playground/editor-types/@data-client/react/redux.d.ts +++ b/website/src/components/Playground/editor-types/@data-client/react/redux.d.ts @@ -181,7 +181,9 @@ declare function ExternalDataProvider({ children, store, selector, controller declare const mapMiddleware: (selector: (state: any) => State) => (...middlewares: Middleware[]) => M; //# sourceMappingURL=mapMiddleware.d.ts.map -declare const PromiseifyMiddleware: >(_: unknown) => (next: Dispatch$1) => (action: React.ReducerAction) => Promise; +declare const PromiseifyMiddleware: >(_: unknown) => (next: Dispatch$1) => (action: ReducerAction) => Promise; + +type ReducerAction> = R extends React.Reducer ? A : never; //# sourceMappingURL=PromiseifyMiddleware.d.ts.map export { ExternalDataProvider$1 as DataProvider, ExternalDataProvider, Middleware, PromiseifyMiddleware, Reducer, mapMiddleware, prepareStore }; diff --git a/website/src/components/Playground/editor-types/react.d.ts b/website/src/components/Playground/editor-types/react.d.ts index 45b3c126249e..00d260578fdb 100755 --- a/website/src/components/Playground/editor-types/react.d.ts +++ b/website/src/components/Playground/editor-types/react.d.ts @@ -5,7 +5,6 @@ /// import * as CSS from "csstype"; -import * as PropTypes from "prop-types"; type NativeAnimationEvent = AnimationEvent; type NativeClipboardEvent = ClipboardEvent; @@ -16,6 +15,7 @@ type NativeKeyboardEvent = KeyboardEvent; type NativeMouseEvent = MouseEvent; type NativeTouchEvent = TouchEvent; type NativePointerEvent = PointerEvent; +type NativeToggleEvent = ToggleEvent; type NativeTransitionEvent = TransitionEvent; type NativeUIEvent = UIEvent; type NativeWheelEvent = WheelEvent; @@ -33,6 +33,25 @@ type CrossOrigin = "anonymous" | "use-credentials" | "" | undefined; declare const UNDEFINED_VOID_ONLY: unique symbol; +/** + * @internal Use `Awaited` instead + */ +// Helper type to enable `Awaited`. +// Must be a copy of the non-thenables of `ReactNode`. +type AwaitedReactNode = + | React.ReactElement + | string + | number + | bigint + | Iterable + | React.ReactPortal + | boolean + | null + | undefined + | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES[ + keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES + ]; + /** * The function returned from an effect passed to {@link React.useEffect useEffect}, * which can be used to clean up the effect when the component unmounts. @@ -93,8 +112,7 @@ declare namespace React { * Represents any user-defined component, either as a function or a class. * * Similar to {@link JSXElementConstructor}, but with extra properties like - * {@link FunctionComponent.defaultProps defaultProps } and - * {@link ComponentClass.contextTypes contextTypes}. + * {@link FunctionComponent.defaultProps defaultProps }. * * @template P The props the component accepts. * @@ -107,30 +125,16 @@ declare namespace React { * Represents any user-defined component, either as a function or a class. * * Similar to {@link ComponentType}, but without extra properties like - * {@link FunctionComponent.defaultProps defaultProps } and - * {@link ComponentClass.contextTypes contextTypes}. + * {@link FunctionComponent.defaultProps defaultProps }. * * @template P The props the component accepts. */ type JSXElementConstructor

= | (( props: P, - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#referencing-context-in-stateless-function-components React Docs} - */ - deprecatedLegacyContext?: any, ) => ReactNode) - | (new( - props: P, - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#referencing-context-in-lifecycle-methods React Docs} - */ - deprecatedLegacyContext?: any, - ) => Component); + // constructor signature must match React.Component + | (new(props: P) => Component); /** * A readonly ref container where {@link current} cannot be mutated. @@ -151,7 +155,7 @@ declare namespace React { /** * The current value of the ref. */ - readonly current: T | null; + current: T; } interface DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES { @@ -174,6 +178,7 @@ declare namespace React { instance: T | null, ): | void + | (() => VoidOrUndefinedOnly) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES ]; @@ -186,22 +191,15 @@ declare namespace React { * @see {@link RefObject} */ - type Ref = RefCallback | RefObject | null; + type Ref = RefCallback | RefObject | null; /** - * A legacy implementation of refs where you can pass a string to a ref prop. - * - * @see {@link https://react.dev/reference/react/Component#refs React Docs} - * - * @example - * - * ```tsx - *

- * ``` + * @deprecated Use `Ref` instead. String refs are no longer supported. + * If you're typing a library with support for React versions with string refs, use `RefAttributes['ref']` instead. */ - // TODO: Remove the string ref special case from `PropsWithRef` once we remove LegacyRef - type LegacyRef = string | Ref; - + type LegacyRef = Ref; /** + * @deprecated Use `ComponentRef` instead + * * Retrieves the type of the 'ref' prop for a given component type or tag name. * * @template C The component type. @@ -222,17 +220,9 @@ declare namespace React { C extends | ForwardRefExoticComponent | { new(props: any): Component } - | ((props: any, deprecatedLegacyContext?: any) => ReactNode) + | ((props: any) => ReactNode) | keyof JSX.IntrinsicElements, - > = - // need to check first if `ref` is a valid prop for ts@3.0 - // otherwise it will infer `{}` instead of `never` - "ref" extends keyof ComponentPropsWithRef - ? NonNullable["ref"]> extends RefAttributes< - infer Instance - >["ref"] ? Instance - : never - : never; + > = ComponentRef; type ComponentState = any; @@ -300,7 +290,7 @@ declare namespace React { * * @see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs} */ - ref?: LegacyRef | undefined; + ref?: Ref | undefined; } /** @@ -325,7 +315,7 @@ declare namespace React { * ``` */ interface ReactElement< - P = any, + P = unknown, T extends string | JSXElementConstructor = string | JSXElementConstructor, > { type: T; @@ -341,13 +331,28 @@ declare namespace React { P = Pick, Exclude, "key" | "ref">>, > extends ReactElement> {} + /** + * @deprecated Use `ReactElement>` + */ interface FunctionComponentElement

extends ReactElement> { + /** + * @deprecated Use `element.props.ref` instead. + */ ref?: ("ref" extends keyof P ? P extends { ref?: infer R | undefined } ? R : never : never) | undefined; } + /** + * @deprecated Use `ReactElement>` + */ type CElement> = ComponentElement; + /** + * @deprecated Use `ReactElement>` + */ interface ComponentElement> extends ReactElement> { - ref?: LegacyRef | undefined; + /** + * @deprecated Use `element.props.ref` instead. + */ + ref?: Ref | undefined; } /** @@ -356,89 +361,34 @@ declare namespace React { type ClassicElement

= CElement>; // string fallback for custom web-components + /** + * @deprecated Use `ReactElement` + */ interface DOMElement

| SVGAttributes, T extends Element> extends ReactElement { - ref: LegacyRef; + /** + * @deprecated Use `element.props.ref` instead. + */ + ref: Ref; } // ReactHTML for ReactHTMLElement interface ReactHTMLElement extends DetailedReactHTMLElement, T> {} interface DetailedReactHTMLElement

, T extends HTMLElement> extends DOMElement { - type: keyof ReactHTML; + type: HTMLElementType; } // ReactSVG for ReactSVGElement interface ReactSVGElement extends DOMElement, SVGElement> { - type: keyof ReactSVG; + type: SVGElementType; } interface ReactPortal extends ReactElement { children: ReactNode; } - // - // Factories - // ---------------------------------------------------------------------- - - type Factory

= (props?: Attributes & P, ...children: ReactNode[]) => ReactElement

; - - /** - * @deprecated Please use `FunctionComponentFactory` - */ - type SFCFactory

= FunctionComponentFactory

; - - type FunctionComponentFactory

= ( - props?: Attributes & P, - ...children: ReactNode[] - ) => FunctionComponentElement

; - - type ComponentFactory> = ( - props?: ClassAttributes & P, - ...children: ReactNode[] - ) => CElement; - - type CFactory> = ComponentFactory; - type ClassicFactory

= CFactory>; - - type DOMFactory

, T extends Element> = ( - props?: ClassAttributes & P | null, - ...children: ReactNode[] - ) => DOMElement; - - interface HTMLFactory extends DetailedHTMLFactory, T> {} - - interface DetailedHTMLFactory

, T extends HTMLElement> extends DOMFactory { - (props?: ClassAttributes & P | null, ...children: ReactNode[]): DetailedReactHTMLElement; - } - - interface SVGFactory extends DOMFactory, SVGElement> { - ( - props?: ClassAttributes & SVGAttributes | null, - ...children: ReactNode[] - ): ReactSVGElement; - } - - /** - * @deprecated - This type is not relevant when using React. Inline the type instead to make the intent clear. - */ - type ReactText = string | number; - /** - * @deprecated - This type is not relevant when using React. Inline the type instead to make the intent clear. - */ - type ReactChild = ReactElement | string | number; - - /** - * @deprecated Use either `ReactNode[]` if you need an array or `Iterable` if its passed to a host component. - */ - interface ReactNodeArray extends ReadonlyArray {} - /** - * WARNING: Not related to `React.Fragment`. - * @deprecated This type is not relevant when using React. Inline the type instead to make the intent clear. - */ - type ReactFragment = Iterable; - /** * Different release channels declare additional types of ReactNode this particular release channel accepts. * App or library types should never augment this interface. @@ -479,6 +429,7 @@ declare namespace React { | ReactElement | string | number + | bigint | Iterable | ReactPortal | boolean @@ -486,36 +437,13 @@ declare namespace React { | undefined | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_REACT_NODES - ]; + ] + | Promise; // // Top Level API // ---------------------------------------------------------------------- - // DOM Elements - /** @deprecated */ - function createFactory( - type: keyof ReactHTML, - ): HTMLFactory; - /** @deprecated */ - function createFactory( - type: keyof ReactSVG, - ): SVGFactory; - /** @deprecated */ - function createFactory

, T extends Element>( - type: string, - ): DOMFactory; - - // Custom components - /** @deprecated */ - function createFactory

(type: FunctionComponent

): FunctionComponentFactory

; - /** @deprecated */ - function createFactory, C extends ComponentClass

>( - type: ClassType, - ): CFactory; - /** @deprecated */ - function createFactory

(type: ComponentClass

): Factory

; - // DOM Elements // TODO: generalize this to everything in `keyof ReactHTML`, not just "input" function createElement( @@ -524,12 +452,12 @@ declare namespace React { ...children: ReactNode[] ): DetailedReactHTMLElement, HTMLInputElement>; function createElement

, T extends HTMLElement>( - type: keyof ReactHTML, + type: HTMLElementType, props?: ClassAttributes & P | null, ...children: ReactNode[] ): DetailedReactHTMLElement; function createElement

, T extends SVGElement>( - type: keyof ReactSVG, + type: SVGElementType, props?: ClassAttributes & P | null, ...children: ReactNode[] ): ReactSVGElement; @@ -658,7 +586,6 @@ declare namespace React { * @template P The props the component accepts. */ interface ProviderExoticComponent

extends ExoticComponent

{ - propTypes?: WeakValidationMap

| undefined; } /** @@ -740,7 +667,7 @@ declare namespace React { * const ThemeContext = createContext('light'); * ``` */ - interface Context { + interface Context extends Provider { Provider: Provider; Consumer: Consumer; /** @@ -769,6 +696,13 @@ declare namespace React { * import { createContext } from 'react'; * * const ThemeContext = createContext('light'); + * function App() { + * return ( + * + * + * + * ); + * } * ``` */ function createContext( @@ -779,9 +713,6 @@ declare namespace React { function isValidElement

(object: {} | null | undefined): object is ReactElement

; - /** - * Maintainer's note: Sync with {@link ReactChildren} until {@link ReactChildren} is removed. - */ const Children: { map( children: C | readonly C[], @@ -848,12 +779,6 @@ declare namespace React { /** A fallback react tree to show when a Suspense child (like React.lazy) suspends */ fallback?: ReactNode; - - /** - * A name for this Suspense boundary for instrumentation purposes. - * The name will help identify this boundary in React DevTools. - */ - name?: string | undefined; } /** @@ -987,6 +912,12 @@ declare namespace React { */ static contextType?: Context | undefined; + /** + * Ignored by React. + * @deprecated Only kept in types for backwards compatibility. Will be removed in a futre major release. + */ + static propTypes?: any; + /** * If using the new style context, re-declare this in your class to be the * `React.ContextType` of your `static contextType`. @@ -1005,12 +936,8 @@ declare namespace React { */ context: unknown; + // Keep in sync with constructor signature of JSXElementConstructor and ComponentClass. constructor(props: P); - /** - * @deprecated - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html React Docs} - */ - constructor(props: P, context: any); // We MUST keep setState() as a unified signature because it allows proper checking of the method return type. // See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/18365#issuecomment-351013257 @@ -1025,14 +952,6 @@ declare namespace React { readonly props: Readonly

; state: Readonly; - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs Legacy React Docs} - */ - refs: { - [key: string]: ReactInstance; - }; } class PureComponent

extends Component {} @@ -1049,10 +968,6 @@ declare namespace React { getInitialState?(): S; } - interface ChildContextProvider { - getChildContext(): CC; - } - // // Class Interfaces // ---------------------------------------------------------------------- @@ -1117,58 +1032,12 @@ declare namespace React { * ``` */ interface FunctionComponent

{ - ( - props: P, - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#referencing-context-in-lifecycle-methods React Docs} - */ - deprecatedLegacyContext?: any, - ): ReactNode; - /** - * Used to declare the types of the props accepted by the - * component. These types will be checked during rendering - * and in development only. - * - * We recommend using TypeScript instead of checking prop - * types at runtime. - * - * @see {@link https://react.dev/reference/react/Component#static-proptypes React Docs} - */ - propTypes?: WeakValidationMap

| undefined; + (props: P): ReactNode; /** - * @deprecated - * - * Lets you specify which legacy context is consumed by - * this component. - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html Legacy React Docs} + * Ignored by React. + * @deprecated Only kept in types for backwards compatibility. Will be removed in a futre major release. */ - contextTypes?: ValidationMap | undefined; - /** - * Used to define default values for the props accepted by - * the component. - * - * @see {@link https://react.dev/reference/react/Component#static-defaultprops React Docs} - * - * @example - * - * ```tsx - * type Props = { name?: string } - * - * const MyComponent: FC = (props) => { - * return

{props.name}
- * } - * - * MyComponent.defaultProps = { - * name: 'John Doe' - * } - * ``` - * - * @deprecated Use {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#default_value|default values for destructuring assignments instead}. - */ - defaultProps?: Partial

| undefined; + propTypes?: any; /** * Used in debugging messages. You might want to set it * explicitly if you want to display a different name for @@ -1190,44 +1059,14 @@ declare namespace React { displayName?: string | undefined; } - /** - * @deprecated - Equivalent to {@link React.FunctionComponent}. - * - * @see {@link React.FunctionComponent} - * @alias {@link VoidFunctionComponent} - */ - type VFC

= VoidFunctionComponent

; - - /** - * @deprecated - Equivalent to {@link React.FunctionComponent}. - * - * @see {@link React.FunctionComponent} - */ - interface VoidFunctionComponent

{ - ( - props: P, - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#referencing-context-in-lifecycle-methods React Docs} - */ - deprecatedLegacyContext?: any, - ): ReactNode; - propTypes?: WeakValidationMap

| undefined; - contextTypes?: ValidationMap | undefined; - /** - * @deprecated Use {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#default_value|default values for destructuring assignments instead}. - */ - defaultProps?: Partial

| undefined; - displayName?: string | undefined; - } - /** * The type of the ref received by a {@link ForwardRefRenderFunction}. * * @see {@link ForwardRefRenderFunction} */ - type ForwardedRef = ((instance: T | null) => void) | MutableRefObject | null; + // Making T nullable is assuming the refs will be managed by React or the component impl will write it somewhere else. + // But this isn't necessarily true. We haven't heard complains about it yet and hopefully `forwardRef` is removed from React before we do. + type ForwardedRef = ((instance: T | null) => void) | RefObject | null; /** * The type of the function passed to {@link forwardRef}. This is considered different @@ -1256,19 +1095,10 @@ declare namespace React { */ displayName?: string | undefined; /** - * defaultProps are not supported on render functions passed to forwardRef. - * - * @see {@link https://github.com/microsoft/TypeScript/issues/36826 linked GitHub issue} for context - * @see {@link https://react.dev/reference/react/Component#static-defaultprops React Docs} - */ - defaultProps?: never | undefined; - /** - * propTypes are not supported on render functions passed to forwardRef. - * - * @see {@link https://github.com/microsoft/TypeScript/issues/36826 linked GitHub issue} for context - * @see {@link https://react.dev/reference/react/Component#static-proptypes React Docs} + * Ignored by React. + * @deprecated Only kept in types for backwards compatibility. Will be removed in a futre major release. */ - propTypes?: never | undefined; + propTypes?: any; } /** @@ -1278,48 +1108,14 @@ declare namespace React { * @template S The internal state of the component. */ interface ComponentClass

extends StaticLifecycle { - new( - props: P, - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#referencing-context-in-lifecycle-methods React Docs} - */ - deprecatedLegacyContext?: any, - ): Component; + // constructor signature must match React.Component + new(props: P): Component; /** - * Used to declare the types of the props accepted by the - * component. These types will be checked during rendering - * and in development only. - * - * We recommend using TypeScript instead of checking prop - * types at runtime. - * - * @see {@link https://react.dev/reference/react/Component#static-proptypes React Docs} + * Ignored by React. + * @deprecated Only kept in types for backwards compatibility. Will be removed in a futre major release. */ - propTypes?: WeakValidationMap

| undefined; + propTypes?: any; contextType?: Context | undefined; - /** - * @deprecated use {@link ComponentClass.contextType} instead - * - * Lets you specify which legacy context is consumed by - * this component. - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html Legacy React Docs} - */ - contextTypes?: ValidationMap | undefined; - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/docs/legacy-context.html#how-to-use-context Legacy React Docs} - */ - childContextTypes?: ValidationMap | undefined; - /** - * Used to define default values for the props accepted by - * the component. - * - * @see {@link https://react.dev/reference/react/Component#static-defaultprops React Docs} - */ defaultProps?: Partial

| undefined; /** * Used in debugging messages. You might want to set it @@ -1338,7 +1134,7 @@ declare namespace React { * @see {@link https://www.npmjs.com/package/create-react-class `create-react-class` on npm} */ interface ClassicComponentClass

extends ComponentClass

{ - new(props: P, deprecatedLegacyContext?: any): ClassicComponent; + new(props: P): ClassicComponent; getDefaultProps?(): P; } @@ -1353,7 +1149,7 @@ declare namespace React { */ type ClassType, C extends ComponentClass

> = & C - & (new(props: P, deprecatedLegacyContext?: any) => T); + & (new(props: P) => T); // // Component Specs and Lifecycle @@ -1377,7 +1173,7 @@ declare namespace React { * If false is returned, {@link Component.render}, `componentWillUpdate` * and `componentDidUpdate` will not be called. */ - shouldComponentUpdate?(nextProps: Readonly

, nextState: Readonly, nextContext: any): boolean; + shouldComponentUpdate?(nextProps: Readonly

, nextState: Readonly): boolean; /** * Called immediately before a component is destroyed. Perform any necessary cleanup in this method, such as * cancelled network requests, or cleaning up any DOM elements created in `componentDidMount`. @@ -1476,7 +1272,7 @@ declare namespace React { * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#updating-state-based-on-props} * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path} */ - componentWillReceiveProps?(nextProps: Readonly

, nextContext: any): void; + componentWillReceiveProps?(nextProps: Readonly

): void; /** * Called when the component may be receiving new props. * React may call this even if props have not changed, so be sure to compare new and existing @@ -1494,7 +1290,7 @@ declare namespace React { * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#updating-state-based-on-props} * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path} */ - UNSAFE_componentWillReceiveProps?(nextProps: Readonly

, nextContext: any): void; + UNSAFE_componentWillReceiveProps?(nextProps: Readonly

): void; /** * Called immediately before rendering when new props or state is received. Not called for the initial render. * @@ -1508,7 +1304,7 @@ declare namespace React { * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#reading-dom-properties-before-an-update} * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path} */ - componentWillUpdate?(nextProps: Readonly

, nextState: Readonly, nextContext: any): void; + componentWillUpdate?(nextProps: Readonly

, nextState: Readonly): void; /** * Called immediately before rendering when new props or state is received. Not called for the initial render. * @@ -1524,41 +1320,10 @@ declare namespace React { * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#reading-dom-properties-before-an-update} * @see {@link https://legacy.reactjs.org/blog/2018/03/27/update-on-async-rendering.html#gradual-migration-path} */ - UNSAFE_componentWillUpdate?(nextProps: Readonly

, nextState: Readonly, nextContext: any): void; - } - - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/blog/2016/07/13/mixins-considered-harmful.html Mixins Considered Harmful} - */ - interface Mixin extends ComponentLifecycle { - mixins?: Array> | undefined; - statics?: { - [key: string]: any; - } | undefined; - - displayName?: string | undefined; - propTypes?: ValidationMap | undefined; - contextTypes?: ValidationMap | undefined; - childContextTypes?: ValidationMap | undefined; - - getDefaultProps?(): P; - getInitialState?(): S; - } - - /** - * @deprecated - * - * @see {@link https://legacy.reactjs.org/blog/2016/07/13/mixins-considered-harmful.html Mixins Considered Harmful} - */ - interface ComponentSpec extends Mixin { - render(): ReactNode; - - [propertyName: string]: any; + UNSAFE_componentWillUpdate?(nextProps: Readonly

, nextState: Readonly): void; } - function createRef(): RefObject; + function createRef(): RefObject; /** * The type of the component returned from {@link forwardRef}. @@ -1569,10 +1334,10 @@ declare namespace React { */ interface ForwardRefExoticComponent

extends NamedExoticComponent

{ /** - * @deprecated Use {@link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#default_value|default values for destructuring assignments instead}. + * Ignored by React. + * @deprecated Only kept in types for backwards compatibility. Will be removed in a futre major release. */ - defaultProps?: Partial

| undefined; - propTypes?: WeakValidationMap

| undefined; + propTypes?: any; } /** @@ -1603,29 +1368,24 @@ declare namespace React { * ``` */ function forwardRef( - render: ForwardRefRenderFunction>, + render: ForwardRefRenderFunction, ): ForwardRefExoticComponent & RefAttributes>; /** * Omits the 'ref' attribute from the given props object. * - * @template P The props object type. + * @template Props The props object type. */ - type PropsWithoutRef

= + type PropsWithoutRef = // Omit would not be sufficient for this. We'd like to avoid unnecessary mapping and need a distributive conditional to support unions. // see: https://www.typescriptlang.org/docs/handbook/2/conditional-types.html#distributive-conditional-types // https://github.com/Microsoft/TypeScript/issues/28339 - P extends any ? ("ref" extends keyof P ? Omit : P) : P; - /** Ensures that the props do not include string ref, which cannot be forwarded */ - type PropsWithRef

= - // Note: String refs can be forwarded. We can't fix this bug without breaking a bunch of libraries now though. - // Just "P extends { ref?: infer R }" looks sufficient, but R will infer as {} if P is {}. - "ref" extends keyof P - ? P extends { ref?: infer R | undefined } - ? string extends R ? PropsWithoutRef

& { ref?: Exclude | undefined } - : P - : P - : P; + Props extends any ? ("ref" extends keyof Props ? Omit : Props) : Props; + /** + * Ensures that the props do not include string ref, which cannot be forwarded + * @deprecated Use `Props` directly. `PropsWithRef` is just an alias for `Props` + */ + type PropsWithRef = Props; type PropsWithChildren

= P & { children?: ReactNode | undefined }; @@ -1657,7 +1417,7 @@ declare namespace React { * ``` */ type ComponentProps> = T extends - JSXElementConstructor ? P + JSXElementConstructor ? Props : T extends keyof JSX.IntrinsicElements ? JSX.IntrinsicElements[T] : {}; @@ -1684,9 +1444,11 @@ declare namespace React { * type MyComponentPropsWithRef = React.ComponentPropsWithRef; * ``` */ - type ComponentPropsWithRef = T extends (new(props: infer P) => Component) - ? PropsWithoutRef

& RefAttributes> - : PropsWithRef>; + type ComponentPropsWithRef = T extends JSXElementConstructor + // If it's a class i.e. newable we're dealing with a class component + ? T extends abstract new(args: any) => any ? PropsWithoutRef & RefAttributes> + : Props + : ComponentProps; /** * Used to retrieve the props a custom component accepts with its ref. * @@ -1703,9 +1465,10 @@ declare namespace React { * type MyComponentPropsWithRef = React.CustomComponentPropsWithRef; * ``` */ - type CustomComponentPropsWithRef = T extends (new(props: infer P) => Component) - ? (PropsWithoutRef

& RefAttributes>) - : T extends ((props: infer P, legacyContext?: any) => ReactNode) ? PropsWithRef

+ type CustomComponentPropsWithRef = T extends JSXElementConstructor + // If it's a class i.e. newable we're dealing with a class component + ? T extends abstract new(args: any) => any ? PropsWithoutRef & RefAttributes> + : Props : never; /** @@ -1733,10 +1496,24 @@ declare namespace React { */ type ComponentPropsWithoutRef = PropsWithoutRef>; - type ComponentRef = T extends NamedExoticComponent< - ComponentPropsWithoutRef & RefAttributes - > ? Method - : ComponentPropsWithRef extends RefAttributes ? Method + /** + * Retrieves the type of the 'ref' prop for a given component type or tag name. + * + * @template C The component type. + * + * @example + * + * ```tsx + * type MyComponentRef = React.ElementRef; + * ``` + * + * @example + * + * ```tsx + * type DivRef = React.ElementRef<'div'>; + * ``` + */ + type ComponentRef = ComponentPropsWithRef extends RefAttributes ? Method : never; // will show `Memo(${Component.displayName || Component.name})` in devtools by default, @@ -1837,6 +1614,11 @@ declare namespace React { * A {@link Dispatch} function can sometimes be called without any arguments. */ type DispatchWithoutAction = () => void; + // Limit the reducer to accept only 0 or 1 action arguments + // eslint-disable-next-line @definitelytyped/no-single-element-tuple-type + type AnyActionArg = [] | [any]; + // Get the dispatch type from the reducer arguments (captures optional action argument correctly) + type ActionDispatch = (...args: ActionArg) => void; // Unlike redux, the actions _can_ be anything type Reducer = (prevState: S, action: A) => S; // If useReducer accepts a reducer without action, dispatch may be called without any parameters. @@ -1844,15 +1626,14 @@ declare namespace React { // types used to try and prevent the compiler from reducing S // to a supertype common with the second argument to useReducer() type ReducerState> = R extends Reducer ? S : never; - type ReducerAction> = R extends Reducer ? A : never; - // The identity check is done with the SameValue algorithm (Object.is), which is stricter than === - type ReducerStateWithoutAction> = R extends ReducerWithoutAction ? S - : never; type DependencyList = readonly unknown[]; // NOTE: callbacks are _only_ allowed to return either void, or a destructor. type EffectCallback = () => void | Destructor; + /** + * @deprecated Use `RefObject` instead. + */ interface MutableRefObject { current: T; } @@ -1891,46 +1672,10 @@ declare namespace React { * @version 16.8.0 * @see {@link https://react.dev/reference/react/useReducer} */ - // overload where dispatch could accept 0 arguments. - function useReducer, I>( - reducer: R, - initializerArg: I, - initializer: (arg: I) => ReducerStateWithoutAction, - ): [ReducerStateWithoutAction, DispatchWithoutAction]; - /** - * An alternative to `useState`. - * - * `useReducer` is usually preferable to `useState` when you have complex state logic that involves - * multiple sub-values. It also lets you optimize performance for components that trigger deep - * updates because you can pass `dispatch` down instead of callbacks. - * - * @version 16.8.0 - * @see {@link https://react.dev/reference/react/useReducer} - */ - // overload where dispatch could accept 0 arguments. - function useReducer>( - reducer: R, - initializerArg: ReducerStateWithoutAction, - initializer?: undefined, - ): [ReducerStateWithoutAction, DispatchWithoutAction]; - /** - * An alternative to `useState`. - * - * `useReducer` is usually preferable to `useState` when you have complex state logic that involves - * multiple sub-values. It also lets you optimize performance for components that trigger deep - * updates because you can pass `dispatch` down instead of callbacks. - * - * @version 16.8.0 - * @see {@link https://react.dev/reference/react/useReducer} - */ - // overload where "I" may be a subset of ReducerState; used to provide autocompletion. - // If "I" matches ReducerState exactly then the last overload will allow initializer to be omitted. - // the last overload effectively behaves as if the identity function (x => x) is the initializer. - function useReducer, I>( - reducer: R, - initializerArg: I & ReducerState, - initializer: (arg: I & ReducerState) => ReducerState, - ): [ReducerState, Dispatch>]; + function useReducer( + reducer: (prevState: S, ...args: A) => S, + initialState: S, + ): [S, ActionDispatch]; /** * An alternative to `useState`. * @@ -1941,12 +1686,10 @@ declare namespace React { * @version 16.8.0 * @see {@link https://react.dev/reference/react/useReducer} */ - // overload for free "I"; all goes as long as initializer converts it into "ReducerState". - function useReducer, I>( - reducer: R, - initializerArg: I, - initializer: (arg: I) => ReducerState, - ): [ReducerState, Dispatch>]; + function useReducer( + reducer: (prevState: S, ...args: A) => S, + initialState: S, + ): [S, ActionDispatch]; /** * An alternative to `useState`. * @@ -1957,21 +1700,11 @@ declare namespace React { * @version 16.8.0 * @see {@link https://react.dev/reference/react/useReducer} */ - - // I'm not sure if I keep this 2-ary or if I make it (2,3)-ary; it's currently (2,3)-ary. - // The Flow types do have an overload for 3-ary invocation with undefined initializer. - - // NOTE: without the ReducerState indirection, TypeScript would reduce S to be the most common - // supertype between the reducer's return type and the initialState (or the initializer's return type), - // which would prevent autocompletion from ever working. - - // TODO: double-check if this weird overload logic is necessary. It is possible it's either a bug - // in older versions, or a regression in newer versions of the typescript completion service. - function useReducer>( - reducer: R, - initialState: ReducerState, - initializer?: undefined, - ): [ReducerState, Dispatch>]; + function useReducer( + reducer: (prevState: S, ...args: A) => S, + initialArg: I, + init: (i: I) => S, + ): [S, ActionDispatch]; /** * `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument * (`initialValue`). The returned object will persist for the full lifetime of the component. @@ -1982,7 +1715,7 @@ declare namespace React { * @version 16.8.0 * @see {@link https://react.dev/reference/react/useRef} */ - function useRef(initialValue: T): MutableRefObject; + function useRef(initialValue: T): RefObject; // convenience overload for refs given as a ref prop as they typically start with a null value /** * `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument @@ -1991,15 +1724,11 @@ declare namespace React { * Note that `useRef()` is useful for more than the `ref` attribute. It’s handy for keeping any mutable * value around similar to how you’d use instance fields in classes. * - * Usage note: if you need the result of useRef to be directly mutable, include `| null` in the type - * of the generic argument. - * * @version 16.8.0 * @see {@link https://react.dev/reference/react/useRef} */ - function useRef(initialValue: T | null): RefObject; - // convenience overload for potentially undefined initialValue / call with 0 arguments - // has a default to stop it from defaulting to {} instead + function useRef(initialValue: T | null): RefObject; + // convenience overload for undefined initialValue /** * `useRef` returns a mutable ref object whose `.current` property is initialized to the passed argument * (`initialValue`). The returned object will persist for the full lifetime of the component. @@ -2010,7 +1739,7 @@ declare namespace React { * @version 16.8.0 * @see {@link https://react.dev/reference/react/useRef} */ - function useRef(): MutableRefObject; + function useRef(initialValue: T | undefined): RefObject; /** * The signature is identical to `useEffect`, but it fires synchronously after all DOM mutations. * Use this to read layout from the DOM and synchronously re-render. Updates scheduled inside @@ -2080,8 +1809,7 @@ declare namespace React { // it's just the function name without the "use" prefix. function useDebugValue(value: T, format?: (value: T) => any): void; - // must be synchronous - export type TransitionFunction = () => VoidOrUndefinedOnly; + export type TransitionFunction = () => VoidOrUndefinedOnly | Promise; // strange definition to allow vscode to show documentation on the invocation export interface TransitionStartFunction { /** @@ -2089,7 +1817,7 @@ declare namespace React { * * **If some state update causes a component to suspend, that state update should be wrapped in a transition.** * - * @param callback A _synchronous_ function which causes state updates that can be deferred. + * @param callback A function which causes state updates that can be deferred. */ (callback: TransitionFunction): void; } @@ -2128,9 +1856,10 @@ declare namespace React { /** * Similar to `useTransition` but allows uses where hooks are not available. * - * @param callback A _synchronous_ function which causes state updates that can be deferred. + * @param callback A function which causes state updates that can be deferred. */ export function startTransition(scope: TransitionFunction): void; + export function startTransition(scope: TransitionFunction): void; /** * Wrap any code rendering and triggering updates to your components into `act()` calls. @@ -2143,6 +1872,11 @@ declare namespace React { * * @see https://reactjs.org/blog/2019/02/06/react-v16.8.0.html#testing-hooks */ + // NOTES + // - the order of these signatures matters - typescript will check the signatures in source order. + // If the `() => VoidOrUndefinedOnly` signature is first, it'll erroneously match a Promise returning function for users with + // `strictNullChecks: false`. + // - VoidOrUndefinedOnly is there to forbid any non-void return values for users with `strictNullChecks: true` // While act does always return Thenable, if a void function is passed, we pretend the return value is also void to not trigger dangling Promise lint rules. export function act(callback: () => VoidOrUndefinedOnly): void; export function act(callback: () => T | Promise): Promise; @@ -2170,6 +1904,29 @@ declare namespace React { getServerSnapshot?: () => Snapshot, ): Snapshot; + export function useOptimistic( + passthrough: State, + ): [State, (action: State | ((pendingState: State) => State)) => void]; + export function useOptimistic( + passthrough: State, + reducer: (state: State, action: Action) => State, + ): [State, (action: Action) => void]; + + export type Usable = PromiseLike | Context; + + export function use(usable: Usable): T; + + export function useActionState( + action: (state: Awaited) => State | Promise, + initialState: Awaited, + permalink?: string, + ): [state: Awaited, dispatch: () => void, isPending: boolean]; + export function useActionState( + action: (state: Awaited, payload: Payload) => State | Promise, + initialState: Awaited, + permalink?: string, + ): [state: Awaited, dispatch: (payload: Payload) => void, isPending: boolean]; + // // Event System // ---------------------------------------------------------------------- @@ -2337,6 +2094,11 @@ declare namespace React { pseudoElement: string; } + interface ToggleEvent extends SyntheticEvent { + oldState: "closed" | "open"; + newState: "closed" | "open"; + } + interface TransitionEvent extends SyntheticEvent { elapsedTime: number; propertyName: string; @@ -2364,6 +2126,7 @@ declare namespace React { type UIEventHandler = EventHandler>; type WheelEventHandler = EventHandler>; type AnimationEventHandler = EventHandler>; + type ToggleEventHandler = EventHandler>; type TransitionEventHandler = EventHandler>; // @@ -2434,9 +2197,9 @@ declare namespace React { // Keyboard Events onKeyDown?: KeyboardEventHandler | undefined; onKeyDownCapture?: KeyboardEventHandler | undefined; - /** @deprecated Use `onKeyUp` or `onKeyDown` instead */ + /** @deprecated */ onKeyPress?: KeyboardEventHandler | undefined; - /** @deprecated Use `onKeyUpCapture` or `onKeyDownCapture` instead */ + /** @deprecated */ onKeyPressCapture?: KeyboardEventHandler | undefined; onKeyUp?: KeyboardEventHandler | undefined; onKeyUpCapture?: KeyboardEventHandler | undefined; @@ -2577,9 +2340,19 @@ declare namespace React { onAnimationIteration?: AnimationEventHandler | undefined; onAnimationIterationCapture?: AnimationEventHandler | undefined; + // Toggle Events + onToggle?: ToggleEventHandler | undefined; + onBeforeToggle?: ToggleEventHandler | undefined; + // Transition Events + onTransitionCancel?: TransitionEventHandler | undefined; + onTransitionCancelCapture?: TransitionEventHandler | undefined; onTransitionEnd?: TransitionEventHandler | undefined; onTransitionEndCapture?: TransitionEventHandler | undefined; + onTransitionRun?: TransitionEventHandler | undefined; + onTransitionRunCapture?: TransitionEventHandler | undefined; + onTransitionStart?: TransitionEventHandler | undefined; + onTransitionStartCapture?: TransitionEventHandler | undefined; } export interface CSSProperties extends CSS.Properties { @@ -2899,14 +2672,12 @@ declare namespace React { // Standard HTML Attributes accessKey?: string | undefined; - autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}); autoFocus?: boolean | undefined; className?: string | undefined; contentEditable?: Booleanish | "inherit" | "plaintext-only" | undefined; contextMenu?: string | undefined; dir?: string | undefined; draggable?: Booleanish | undefined; - enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined; hidden?: boolean | undefined; id?: string | undefined; lang?: string | undefined; @@ -2938,6 +2709,7 @@ declare namespace React { vocab?: string | undefined; // Non-standard Attributes + autoCapitalize?: string | undefined; autoCorrect?: string | undefined; autoSave?: string | undefined; color?: string | undefined; @@ -2950,7 +2722,16 @@ declare namespace React { security?: string | undefined; unselectable?: "on" | "off" | undefined; + // Popover API + popover?: "" | "auto" | "manual" | undefined; + popoverTargetAction?: "toggle" | "show" | "hide" | undefined; + popoverTarget?: string | undefined; + // Living Standard + /** + * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert + */ + inert?: boolean | undefined; /** * Hints at the type of data that might be entered by the user while editing the element or its contents * @see {@link https://html.spec.whatwg.org/multipage/interaction.html#input-modalities:-the-inputmode-attribute} @@ -2977,6 +2758,7 @@ declare namespace React { action?: | string | undefined + | ((formData: FormData) => void) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS ]; @@ -3011,6 +2793,7 @@ declare namespace React { formAction?: | string | undefined + | ((formData: FormData) => void) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS ]; @@ -3143,6 +2926,7 @@ declare namespace React { form?: string | undefined; formAction?: | string + | ((formData: FormData) => void) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS ] @@ -3176,7 +2960,6 @@ declare namespace React { interface DetailsHTMLAttributes extends HTMLAttributes { open?: boolean | undefined; - onToggle?: ReactEventHandler | undefined; name?: string | undefined; } @@ -3209,6 +2992,7 @@ declare namespace React { action?: | string | undefined + | ((formData: FormData) => void) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS ]; @@ -3361,9 +3145,11 @@ declare namespace React { capture?: boolean | "user" | "environment" | undefined; // https://www.w3.org/TR/html-media-capture/#the-capture-attribute checked?: boolean | undefined; disabled?: boolean | undefined; + enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined; form?: string | undefined; formAction?: | string + | ((formData: FormData) => void) | DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[ keyof DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS ] @@ -3947,259 +3733,184 @@ declare namespace React { webpreferences?: string | undefined; } - // - // React.DOM - // ---------------------------------------------------------------------- - - interface ReactHTML { - a: DetailedHTMLFactory, HTMLAnchorElement>; - abbr: DetailedHTMLFactory, HTMLElement>; - address: DetailedHTMLFactory, HTMLElement>; - area: DetailedHTMLFactory, HTMLAreaElement>; - article: DetailedHTMLFactory, HTMLElement>; - aside: DetailedHTMLFactory, HTMLElement>; - audio: DetailedHTMLFactory, HTMLAudioElement>; - b: DetailedHTMLFactory, HTMLElement>; - base: DetailedHTMLFactory, HTMLBaseElement>; - bdi: DetailedHTMLFactory, HTMLElement>; - bdo: DetailedHTMLFactory, HTMLElement>; - big: DetailedHTMLFactory, HTMLElement>; - blockquote: DetailedHTMLFactory, HTMLQuoteElement>; - body: DetailedHTMLFactory, HTMLBodyElement>; - br: DetailedHTMLFactory, HTMLBRElement>; - button: DetailedHTMLFactory, HTMLButtonElement>; - canvas: DetailedHTMLFactory, HTMLCanvasElement>; - caption: DetailedHTMLFactory, HTMLElement>; - center: DetailedHTMLFactory, HTMLElement>; - cite: DetailedHTMLFactory, HTMLElement>; - code: DetailedHTMLFactory, HTMLElement>; - col: DetailedHTMLFactory, HTMLTableColElement>; - colgroup: DetailedHTMLFactory, HTMLTableColElement>; - data: DetailedHTMLFactory, HTMLDataElement>; - datalist: DetailedHTMLFactory, HTMLDataListElement>; - dd: DetailedHTMLFactory, HTMLElement>; - del: DetailedHTMLFactory, HTMLModElement>; - details: DetailedHTMLFactory, HTMLDetailsElement>; - dfn: DetailedHTMLFactory, HTMLElement>; - dialog: DetailedHTMLFactory, HTMLDialogElement>; - div: DetailedHTMLFactory, HTMLDivElement>; - dl: DetailedHTMLFactory, HTMLDListElement>; - dt: DetailedHTMLFactory, HTMLElement>; - em: DetailedHTMLFactory, HTMLElement>; - embed: DetailedHTMLFactory, HTMLEmbedElement>; - fieldset: DetailedHTMLFactory, HTMLFieldSetElement>; - figcaption: DetailedHTMLFactory, HTMLElement>; - figure: DetailedHTMLFactory, HTMLElement>; - footer: DetailedHTMLFactory, HTMLElement>; - form: DetailedHTMLFactory, HTMLFormElement>; - h1: DetailedHTMLFactory, HTMLHeadingElement>; - h2: DetailedHTMLFactory, HTMLHeadingElement>; - h3: DetailedHTMLFactory, HTMLHeadingElement>; - h4: DetailedHTMLFactory, HTMLHeadingElement>; - h5: DetailedHTMLFactory, HTMLHeadingElement>; - h6: DetailedHTMLFactory, HTMLHeadingElement>; - head: DetailedHTMLFactory, HTMLHeadElement>; - header: DetailedHTMLFactory, HTMLElement>; - hgroup: DetailedHTMLFactory, HTMLElement>; - hr: DetailedHTMLFactory, HTMLHRElement>; - html: DetailedHTMLFactory, HTMLHtmlElement>; - i: DetailedHTMLFactory, HTMLElement>; - iframe: DetailedHTMLFactory, HTMLIFrameElement>; - img: DetailedHTMLFactory, HTMLImageElement>; - input: DetailedHTMLFactory, HTMLInputElement>; - ins: DetailedHTMLFactory, HTMLModElement>; - kbd: DetailedHTMLFactory, HTMLElement>; - keygen: DetailedHTMLFactory, HTMLElement>; - label: DetailedHTMLFactory, HTMLLabelElement>; - legend: DetailedHTMLFactory, HTMLLegendElement>; - li: DetailedHTMLFactory, HTMLLIElement>; - link: DetailedHTMLFactory, HTMLLinkElement>; - main: DetailedHTMLFactory, HTMLElement>; - map: DetailedHTMLFactory, HTMLMapElement>; - mark: DetailedHTMLFactory, HTMLElement>; - menu: DetailedHTMLFactory, HTMLElement>; - menuitem: DetailedHTMLFactory, HTMLElement>; - meta: DetailedHTMLFactory, HTMLMetaElement>; - meter: DetailedHTMLFactory, HTMLMeterElement>; - nav: DetailedHTMLFactory, HTMLElement>; - noscript: DetailedHTMLFactory, HTMLElement>; - object: DetailedHTMLFactory, HTMLObjectElement>; - ol: DetailedHTMLFactory, HTMLOListElement>; - optgroup: DetailedHTMLFactory, HTMLOptGroupElement>; - option: DetailedHTMLFactory, HTMLOptionElement>; - output: DetailedHTMLFactory, HTMLOutputElement>; - p: DetailedHTMLFactory, HTMLParagraphElement>; - param: DetailedHTMLFactory, HTMLParamElement>; - picture: DetailedHTMLFactory, HTMLElement>; - pre: DetailedHTMLFactory, HTMLPreElement>; - progress: DetailedHTMLFactory, HTMLProgressElement>; - q: DetailedHTMLFactory, HTMLQuoteElement>; - rp: DetailedHTMLFactory, HTMLElement>; - rt: DetailedHTMLFactory, HTMLElement>; - ruby: DetailedHTMLFactory, HTMLElement>; - s: DetailedHTMLFactory, HTMLElement>; - samp: DetailedHTMLFactory, HTMLElement>; - search: DetailedHTMLFactory, HTMLElement>; - slot: DetailedHTMLFactory, HTMLSlotElement>; - script: DetailedHTMLFactory, HTMLScriptElement>; - section: DetailedHTMLFactory, HTMLElement>; - select: DetailedHTMLFactory, HTMLSelectElement>; - small: DetailedHTMLFactory, HTMLElement>; - source: DetailedHTMLFactory, HTMLSourceElement>; - span: DetailedHTMLFactory, HTMLSpanElement>; - strong: DetailedHTMLFactory, HTMLElement>; - style: DetailedHTMLFactory, HTMLStyleElement>; - sub: DetailedHTMLFactory, HTMLElement>; - summary: DetailedHTMLFactory, HTMLElement>; - sup: DetailedHTMLFactory, HTMLElement>; - table: DetailedHTMLFactory, HTMLTableElement>; - template: DetailedHTMLFactory, HTMLTemplateElement>; - tbody: DetailedHTMLFactory, HTMLTableSectionElement>; - td: DetailedHTMLFactory, HTMLTableDataCellElement>; - textarea: DetailedHTMLFactory, HTMLTextAreaElement>; - tfoot: DetailedHTMLFactory, HTMLTableSectionElement>; - th: DetailedHTMLFactory, HTMLTableHeaderCellElement>; - thead: DetailedHTMLFactory, HTMLTableSectionElement>; - time: DetailedHTMLFactory, HTMLTimeElement>; - title: DetailedHTMLFactory, HTMLTitleElement>; - tr: DetailedHTMLFactory, HTMLTableRowElement>; - track: DetailedHTMLFactory, HTMLTrackElement>; - u: DetailedHTMLFactory, HTMLElement>; - ul: DetailedHTMLFactory, HTMLUListElement>; - "var": DetailedHTMLFactory, HTMLElement>; - video: DetailedHTMLFactory, HTMLVideoElement>; - wbr: DetailedHTMLFactory, HTMLElement>; - webview: DetailedHTMLFactory, HTMLWebViewElement>; - } - - interface ReactSVG { - animate: SVGFactory; - circle: SVGFactory; - clipPath: SVGFactory; - defs: SVGFactory; - desc: SVGFactory; - ellipse: SVGFactory; - feBlend: SVGFactory; - feColorMatrix: SVGFactory; - feComponentTransfer: SVGFactory; - feComposite: SVGFactory; - feConvolveMatrix: SVGFactory; - feDiffuseLighting: SVGFactory; - feDisplacementMap: SVGFactory; - feDistantLight: SVGFactory; - feDropShadow: SVGFactory; - feFlood: SVGFactory; - feFuncA: SVGFactory; - feFuncB: SVGFactory; - feFuncG: SVGFactory; - feFuncR: SVGFactory; - feGaussianBlur: SVGFactory; - feImage: SVGFactory; - feMerge: SVGFactory; - feMergeNode: SVGFactory; - feMorphology: SVGFactory; - feOffset: SVGFactory; - fePointLight: SVGFactory; - feSpecularLighting: SVGFactory; - feSpotLight: SVGFactory; - feTile: SVGFactory; - feTurbulence: SVGFactory; - filter: SVGFactory; - foreignObject: SVGFactory; - g: SVGFactory; - image: SVGFactory; - line: SVGFactory; - linearGradient: SVGFactory; - marker: SVGFactory; - mask: SVGFactory; - metadata: SVGFactory; - path: SVGFactory; - pattern: SVGFactory; - polygon: SVGFactory; - polyline: SVGFactory; - radialGradient: SVGFactory; - rect: SVGFactory; - stop: SVGFactory; - svg: SVGFactory; - switch: SVGFactory; - symbol: SVGFactory; - text: SVGFactory; - textPath: SVGFactory; - tspan: SVGFactory; - use: SVGFactory; - view: SVGFactory; - } - - interface ReactDOM extends ReactHTML, ReactSVG {} - - // - // React.PropTypes - // ---------------------------------------------------------------------- - - /** - * @deprecated Use `Validator` from the ´prop-types` instead. - */ - type Validator = PropTypes.Validator; - - /** - * @deprecated Use `Requireable` from the ´prop-types` instead. - */ - type Requireable = PropTypes.Requireable; - - /** - * @deprecated Use `ValidationMap` from the ´prop-types` instead. - */ - type ValidationMap = PropTypes.ValidationMap; - - /** - * @deprecated Use `WeakValidationMap` from the ´prop-types` instead. - */ - type WeakValidationMap = { - [K in keyof T]?: null extends T[K] ? Validator - : undefined extends T[K] ? Validator - : Validator; - }; - - /** - * @deprecated Use `PropTypes.*` where `PropTypes` comes from `import * as PropTypes from 'prop-types'` instead. - */ - interface ReactPropTypes { - any: typeof PropTypes.any; - array: typeof PropTypes.array; - bool: typeof PropTypes.bool; - func: typeof PropTypes.func; - number: typeof PropTypes.number; - object: typeof PropTypes.object; - string: typeof PropTypes.string; - node: typeof PropTypes.node; - element: typeof PropTypes.element; - instanceOf: typeof PropTypes.instanceOf; - oneOf: typeof PropTypes.oneOf; - oneOfType: typeof PropTypes.oneOfType; - arrayOf: typeof PropTypes.arrayOf; - objectOf: typeof PropTypes.objectOf; - shape: typeof PropTypes.shape; - exact: typeof PropTypes.exact; - } - - // - // React.Children - // ---------------------------------------------------------------------- - - /** - * @deprecated - Use `typeof React.Children` instead. - */ - // Sync with type of `const Children`. - interface ReactChildren { - map( - children: C | readonly C[], - fn: (child: C, index: number) => T, - ): C extends null | undefined ? C : Array>; - forEach(children: C | readonly C[], fn: (child: C, index: number) => void): void; - count(children: any): number; - only(children: C): C extends any[] ? never : C; - toArray(children: ReactNode | ReactNode[]): Array>; - } + // TODO: Move to react-dom + type HTMLElementType = + | "a" + | "abbr" + | "address" + | "area" + | "article" + | "aside" + | "audio" + | "b" + | "base" + | "bdi" + | "bdo" + | "big" + | "blockquote" + | "body" + | "br" + | "button" + | "canvas" + | "caption" + | "center" + | "cite" + | "code" + | "col" + | "colgroup" + | "data" + | "datalist" + | "dd" + | "del" + | "details" + | "dfn" + | "dialog" + | "div" + | "dl" + | "dt" + | "em" + | "embed" + | "fieldset" + | "figcaption" + | "figure" + | "footer" + | "form" + | "h1" + | "h2" + | "h3" + | "h4" + | "h5" + | "h6" + | "head" + | "header" + | "hgroup" + | "hr" + | "html" + | "i" + | "iframe" + | "img" + | "input" + | "ins" + | "kbd" + | "keygen" + | "label" + | "legend" + | "li" + | "link" + | "main" + | "map" + | "mark" + | "menu" + | "menuitem" + | "meta" + | "meter" + | "nav" + | "noscript" + | "object" + | "ol" + | "optgroup" + | "option" + | "output" + | "p" + | "param" + | "picture" + | "pre" + | "progress" + | "q" + | "rp" + | "rt" + | "ruby" + | "s" + | "samp" + | "search" + | "slot" + | "script" + | "section" + | "select" + | "small" + | "source" + | "span" + | "strong" + | "style" + | "sub" + | "summary" + | "sup" + | "table" + | "template" + | "tbody" + | "td" + | "textarea" + | "tfoot" + | "th" + | "thead" + | "time" + | "title" + | "tr" + | "track" + | "u" + | "ul" + | "var" + | "video" + | "wbr" + | "webview"; + + // TODO: Move to react-dom + type SVGElementType = + | "animate" + | "circle" + | "clipPath" + | "defs" + | "desc" + | "ellipse" + | "feBlend" + | "feColorMatrix" + | "feComponentTransfer" + | "feComposite" + | "feConvolveMatrix" + | "feDiffuseLighting" + | "feDisplacementMap" + | "feDistantLight" + | "feDropShadow" + | "feFlood" + | "feFuncA" + | "feFuncB" + | "feFuncG" + | "feFuncR" + | "feGaussianBlur" + | "feImage" + | "feMerge" + | "feMergeNode" + | "feMorphology" + | "feOffset" + | "fePointLight" + | "feSpecularLighting" + | "feSpotLight" + | "feTile" + | "feTurbulence" + | "filter" + | "foreignObject" + | "g" + | "image" + | "line" + | "linearGradient" + | "marker" + | "mask" + | "metadata" + | "path" + | "pattern" + | "polygon" + | "polyline" + | "radialGradient" + | "rect" + | "stop" + | "svg" + | "switch" + | "symbol" + | "text" + | "textPath" + | "tspan" + | "use" + | "view"; // // Browser Interfaces @@ -4241,68 +3952,6 @@ declare namespace React { } // Keep in sync with JSX namespace in ./jsx-runtime.d.ts and ./jsx-dev-runtime.d.ts - namespace JSX { - type ElementType = GlobalJSXElementType; - interface Element extends GlobalJSXElement {} - interface ElementClass extends GlobalJSXElementClass {} - interface ElementAttributesProperty extends GlobalJSXElementAttributesProperty {} - interface ElementChildrenAttribute extends GlobalJSXElementChildrenAttribute {} - - type LibraryManagedAttributes = GlobalJSXLibraryManagedAttributes; - - interface IntrinsicAttributes extends GlobalJSXIntrinsicAttributes {} - interface IntrinsicClassAttributes extends GlobalJSXIntrinsicClassAttributes {} - interface IntrinsicElements extends GlobalJSXIntrinsicElements {} - } -} - -// naked 'any' type in a conditional type will short circuit and union both the then/else branches -// so boolean is only resolved for T = any -type IsExactlyAny = boolean extends (T extends never ? true : false) ? true : false; - -type ExactlyAnyPropertyKeys = { [K in keyof T]: IsExactlyAny extends true ? K : never }[keyof T]; -type NotExactlyAnyPropertyKeys = Exclude>; - -// Try to resolve ill-defined props like for JS users: props can be any, or sometimes objects with properties of type any -type MergePropTypes = - // Distribute over P in case it is a union type - P extends any - // If props is type any, use propTypes definitions - ? IsExactlyAny

extends true ? T - // If declared props have indexed properties, ignore inferred props entirely as keyof gets widened - : string extends keyof P ? P - // Prefer declared types which are not exactly any - : - & Pick> - // For props which are exactly any, use the type inferred from propTypes if present - & Pick>> - // Keep leftover props not specified in propTypes - & Pick> - : never; - -type InexactPartial = { [K in keyof T]?: T[K] | undefined }; - -// Any prop that has a default prop becomes optional, but its type is unchanged -// Undeclared default props are augmented into the resulting allowable attributes -// If declared props have indexed properties, ignore default props entirely as keyof gets widened -// Wrap in an outer-level conditional type to allow distribution over props that are unions -type Defaultize = P extends any ? string extends keyof P ? P - : - & Pick> - & InexactPartial>> - & InexactPartial>> - : never; - -type ReactManagedAttributes = C extends { propTypes: infer T; defaultProps: infer D } - ? Defaultize>, D> - : C extends { propTypes: infer T } ? MergePropTypes> - : C extends { defaultProps: infer D } ? Defaultize - : P; - -declare global { - /** - * @deprecated Use `React.JSX` instead of the global `JSX` namespace. - */ namespace JSX { // We don't just alias React.ElementType because React.ElementType // historically does more than we need it to. @@ -4526,18 +4175,18 @@ declare global { } } -// React.JSX needs to point to global.JSX to keep global module augmentations intact. -// But we can't access global.JSX so we need to create these aliases instead. -// Once the global JSX namespace will be removed we replace React.JSX with the contents of global.JSX -type GlobalJSXElementType = JSX.ElementType; -interface GlobalJSXElement extends JSX.Element {} -interface GlobalJSXElementClass extends JSX.ElementClass {} -interface GlobalJSXElementAttributesProperty extends JSX.ElementAttributesProperty {} -interface GlobalJSXElementChildrenAttribute extends JSX.ElementChildrenAttribute {} - -type GlobalJSXLibraryManagedAttributes = JSX.LibraryManagedAttributes; +type InexactPartial = { [K in keyof T]?: T[K] | undefined }; -interface GlobalJSXIntrinsicAttributes extends JSX.IntrinsicAttributes {} -interface GlobalJSXIntrinsicClassAttributes extends JSX.IntrinsicClassAttributes {} +// Any prop that has a default prop becomes optional, but its type is unchanged +// Undeclared default props are augmented into the resulting allowable attributes +// If declared props have indexed properties, ignore default props entirely as keyof gets widened +// Wrap in an outer-level conditional type to allow distribution over props that are unions +type Defaultize = P extends any ? string extends keyof P ? P + : + & Pick> + & InexactPartial>> + & InexactPartial>> + : never; -interface GlobalJSXIntrinsicElements extends JSX.IntrinsicElements {} +type ReactManagedAttributes = C extends { defaultProps: infer D } ? Defaultize + : P; diff --git a/yarn.lock b/yarn.lock index 239dd68ed5f4..e31d8ee8537f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3247,7 +3247,7 @@ __metadata: "@types/react": "npm:^18.0.30" "@types/react-dom": "npm:^18.0.11" next: "npm:^15.0.0" - react-dom: "npm:^18.2.0" + react-dom: "npm:^19.0.0-rc.1" redux: "npm:^5.0.0" peerDependencies: "@data-client/react": ^0.1.0 || ^0.2.0 || ^0.3.0 || ^0.4.0 || ^0.5.0 || ^0.7.0 || ^0.8.0 || ^0.9.0 || ^0.10.0 || ^0.11.0 || ^0.12.0 || ^0.13.0 || ^0.14.0 @@ -7479,13 +7479,6 @@ __metadata: languageName: node linkType: hard -"@types/prop-types@npm:*": - version: 15.7.5 - resolution: "@types/prop-types@npm:15.7.5" - checksum: 10c0/648aae41423821c61c83823ae36116c8d0f68258f8b609bdbc257752dcd616438d6343d554262aa9a7edaee5a19aca2e028a74fa2d0f40fffaf2816bc7056857 - languageName: node - linkType: hard - "@types/qs@npm:*": version: 6.9.7 resolution: "@types/qs@npm:6.9.7" @@ -7507,12 +7500,12 @@ __metadata: languageName: node linkType: hard -"@types/react-dom@npm:*, @types/react-dom@npm:^18.0.11, @types/react-dom@npm:^18.2.7": - version: 18.3.1 - resolution: "@types/react-dom@npm:18.3.1" +"@types/react-dom@npm:types-react-dom@19.0.0": + version: 19.0.0 + resolution: "types-react-dom@npm:19.0.0" dependencies: "@types/react": "npm:*" - checksum: 10c0/8b416551c60bb6bd8ec10e198c957910cfb271bc3922463040b0d57cf4739cdcd24b13224f8d68f10318926e1ec3cd69af0af79f0291b599a992f8c80d47f1eb + checksum: 10c0/5ea60f0a0a00a8f8b14a5dd0bf39c349bd2f1e9a1b4ce52777fdfc2d2fe03f791f7714b0ef3ab19d38be8ce52633ebd39d226d8f102344efe07d02e9931b62a3 languageName: node linkType: hard @@ -7566,13 +7559,12 @@ __metadata: languageName: node linkType: hard -"@types/react@npm:*, @types/react@npm:18.3.12, @types/react@npm:^18.0.30": - version: 18.3.12 - resolution: "@types/react@npm:18.3.12" +"@types/react@npm:types-react@19.0.0-rc.1": + version: 19.0.0-rc.1 + resolution: "types-react@npm:19.0.0-rc.1" dependencies: - "@types/prop-types": "npm:*" csstype: "npm:^3.0.2" - checksum: 10c0/8bae8d9a41619804561574792e29112b413044eb0d53746dde2b9720c1f9a59f71c895bbd7987cd8ce9500b00786e53bc032dced38cddf42910458e145675290 + checksum: 10c0/408cd9f3f960e806d510f7a9a3569f92a7f1cff3c57f5465fab4c139f0020c88dc7a08e6f357d2a116bd2c76e641851ce84527cb765f36824a6e818e0d477bbc languageName: node linkType: hard @@ -10791,8 +10783,8 @@ __metadata: "@types/react-dom": "npm:*" d3: "npm:^7.9.0" history: "npm:*" - react: "npm:^18.3.0" - react-dom: "npm:^18.3.0" + react: "npm:^19.0.0-rc.1" + react-dom: "npm:^19.0.0-rc.1" react-refresh: "npm:*" typescript: "npm:^5.4.5" webpack: "npm:*" @@ -14137,10 +14129,10 @@ __metadata: "@data-client/normalizr": "workspace:^" "@types/babel__core": "npm:^7" "@types/benchmark": "npm:2.1.5" - "@types/react": "npm:18.3.12" + "@types/react": "npm:types-react@19.0.0-rc.1" benchmark: "npm:^2.1.4" normalizr: "npm:^3.6.2" - react: "npm:^18.2.0" + react: "npm:^19.0.0-rc.1" webpack: "npm:^5.76.2" webpack-cli: "npm:^5.1.4" languageName: unknown @@ -25216,8 +25208,8 @@ __metadata: monaco-editor: "npm:^0.52.0" parse-numeric-range: "npm:^1.3.0" raw-loader: "npm:^4.0.2" - react: "npm:^18.2.0" - react-dom: "npm:^18.2.0" + react: "npm:^19.0.0-rc.1" + react-dom: "npm:^19.0.0-rc.1" react-json-tree: "npm:0.19.0" react-live: "npm:^4.0.0" serve: "npm:14.2.4" @@ -25281,15 +25273,14 @@ __metadata: languageName: node linkType: hard -"react-dom@npm:18.3.1, react-dom@npm:^18.2.0, react-dom@npm:^18.3.0": - version: 18.3.1 - resolution: "react-dom@npm:18.3.1" +"react-dom@npm:^19.0.0-rc.1": + version: 19.0.0-rc-fb9a90fa48-20240614 + resolution: "react-dom@npm:19.0.0-rc-fb9a90fa48-20240614" dependencies: - loose-envify: "npm:^1.1.0" - scheduler: "npm:^0.23.2" + scheduler: "npm:0.25.0-rc-fb9a90fa48-20240614" peerDependencies: - react: ^18.3.1 - checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85 + react: 19.0.0-rc-fb9a90fa48-20240614 + checksum: 10c0/ab4f49752f71fcf3de910af463d3ec4f2ea17777dbd854df7f08987b1ae4d91e5b59a1f5998063f68c7db3af06e9cb67f26a57f0e78bb71c28884ef5029edf0d languageName: node linkType: hard @@ -25359,10 +25350,10 @@ __metadata: languageName: node linkType: hard -"react-is@npm:^16.12.0 || ^17.0.0 || ^18.0.0, react-is@npm:^18.0.0, react-is@npm:^18.2.0, react-is@npm:^18.3.1": - version: 18.3.1 - resolution: "react-is@npm:18.3.1" - checksum: 10c0/f2f1e60010c683479e74c63f96b09fb41603527cd131a9959e2aee1e5a8b0caf270b365e5ca77d4a6b18aae659b60a86150bb3979073528877029b35aecd2072 +"react-is@npm:19.0.0-rc-fb9a90fa48-20240614": + version: 19.0.0-rc-fb9a90fa48-20240614 + resolution: "react-is@npm:19.0.0-rc-fb9a90fa48-20240614" + checksum: 10c0/73f4cd91d535788a60834690a303e4c02d3f55a63f34cfc4587cac8c132369aad849c614179cafd9840005614e56809c20c2d9f722aa630502d1b6db15e98c89 languageName: node linkType: hard @@ -25380,6 +25371,13 @@ __metadata: languageName: node linkType: hard +"react-is@npm:^18.0.0, react-is@npm:^18.2.0": + version: 18.3.1 + resolution: "react-is@npm:18.3.1" + checksum: 10c0/f2f1e60010c683479e74c63f96b09fb41603527cd131a9959e2aee1e5a8b0caf270b365e5ca77d4a6b18aae659b60a86150bb3979073528877029b35aecd2072 + languageName: node + linkType: hard + "react-json-tree@npm:0.19.0": version: 0.19.0 resolution: "react-json-tree@npm:0.19.0" @@ -25439,7 +25437,7 @@ __metadata: languageName: node linkType: hard -"react-native-safe-area-context@npm:^4.4.1": +"react-native-safe-area-context@npm:^4.14.0": version: 4.14.0 resolution: "react-native-safe-area-context@npm:4.14.0" peerDependencies: @@ -25449,7 +25447,7 @@ __metadata: languageName: node linkType: hard -"react-native-screens@npm:^4.0.0": +"react-native-screens@npm:^4.1.0": version: 4.1.0 resolution: "react-native-screens@npm:4.1.0" dependencies: @@ -25571,37 +25569,22 @@ __metadata: languageName: node linkType: hard -"react-shallow-renderer@npm:^16.15.0": - version: 16.15.0 - resolution: "react-shallow-renderer@npm:16.15.0" - dependencies: - object-assign: "npm:^4.1.1" - react-is: "npm:^16.12.0 || ^17.0.0 || ^18.0.0" - peerDependencies: - react: ^16.0.0 || ^17.0.0 || ^18.0.0 - checksum: 10c0/c194d741792e86043a4ae272f7353c1cb9412bc649945c4220c6a101a6ea5410cceb3d65d5a4d750f11a24f7426e8eec7977e8a4e3ad5d3ee235ca2b18166fa8 - languageName: node - linkType: hard - -"react-test-renderer@npm:18.3.1": - version: 18.3.1 - resolution: "react-test-renderer@npm:18.3.1" +"react-test-renderer@npm:^19.0.0-rc.1": + version: 19.0.0-rc-fb9a90fa48-20240614 + resolution: "react-test-renderer@npm:19.0.0-rc-fb9a90fa48-20240614" dependencies: - react-is: "npm:^18.3.1" - react-shallow-renderer: "npm:^16.15.0" - scheduler: "npm:^0.23.2" + react-is: "npm:19.0.0-rc-fb9a90fa48-20240614" + scheduler: "npm:0.25.0-rc-fb9a90fa48-20240614" peerDependencies: - react: ^18.3.1 - checksum: 10c0/c633558ef9af33bc68f0c4dbb5163a004c4fb9eade7bd0a7cfc0355fb367f36bd9d96533c90b7e85a146be6c525113a15f58683d269e0177ad77e2b04d4fe51c + react: 19.0.0-rc-fb9a90fa48-20240614 + checksum: 10c0/895375555035375dbcdce354abcf673c5a07884f3aac5960385a2380ee04a1ef6d90607501bc222757c46bca6a9a85889137c6b23c090afc56066eaaa6ba8881 languageName: node linkType: hard -"react@npm:18.3.1, react@npm:^18.2.0, react@npm:^18.3.0": - version: 18.3.1 - resolution: "react@npm:18.3.1" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3 +"react@npm:^19.0.0-rc.1": + version: 19.0.0-rc-fb9a90fa48-20240614 + resolution: "react@npm:19.0.0-rc-fb9a90fa48-20240614" + checksum: 10c0/99c3d3398d46c8c704c0deb04160f5a7c9cf2ff785a777fb0f1a4d0c91ade044c4d50cd52e008b4c45623eaa8f4d18a80272444df4972a2cc696bf35ef3e59b0 languageName: node linkType: hard @@ -26780,7 +26763,8 @@ __metadata: "@testing-library/react-native": "npm:12.8.1" "@types/jest": "npm:29.5.14" "@types/node": "npm:22.9.0" - "@types/react": "npm:18.3.12" + "@types/react": "npm:types-react@19.0.0-rc.1" + "@types/react-dom": "npm:types-react-dom@19.0.0" babel-plugin-module-resolver: "npm:5.0.2" babel-plugin-syntax-hermes-parser: "npm:^0.25.0" benchmark: "npm:^2.1.4" @@ -26801,12 +26785,12 @@ __metadata: node-fetch: "npm:^3.3.0" npm-run-all: "npm:^4.1.5" prettier: "npm:3.3.3" - react: "npm:18.3.1" - react-dom: "npm:18.3.1" + react: "npm:^19.0.0-rc.1" + react-dom: "npm:^19.0.0-rc.1" react-native: "npm:0.76.2" - react-native-safe-area-context: "npm:^4.4.1" - react-native-screens: "npm:^4.0.0" - react-test-renderer: "npm:18.3.1" + react-native-safe-area-context: "npm:^4.14.0" + react-native-screens: "npm:^4.1.0" + react-test-renderer: "npm:^19.0.0-rc.1" rimraf: "npm:^6.0.0" rollup: "npm:2.79.2" rollup-plugin-babel: "npm:^4.4.0" @@ -27028,12 +27012,10 @@ __metadata: languageName: node linkType: hard -"scheduler@npm:^0.23.2": - version: 0.23.2 - resolution: "scheduler@npm:0.23.2" - dependencies: - loose-envify: "npm:^1.1.0" - checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78 +"scheduler@npm:0.25.0-rc-fb9a90fa48-20240614": + version: 0.25.0-rc-fb9a90fa48-20240614 + resolution: "scheduler@npm:0.25.0-rc-fb9a90fa48-20240614" + checksum: 10c0/efd80573e35479d0e47e864ba5747579be2a8b20cfb61f32bcb17a8b945711d2337dd7f92ac6373f3128ed20a8915624dc82fda6b7f761aab352692a6445d411 languageName: node linkType: hard