Skip to content

Commit 823b5f9

Browse files
authored
chore: use React18 (SAP#6247)
1 parent 8184b4e commit 823b5f9

File tree

14 files changed

+82
-70
lines changed

14 files changed

+82
-70
lines changed

.github/workflows/docs-stable.yml

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -35,10 +35,6 @@ jobs:
3535
3636
- name: Build Storybook
3737
run: |
38-
# TODO remove as soon as https://github.com/recharts/recharts/issues/4558 is resolved
39-
yarn set resolution "@types/react@npm:*" "18"
40-
yarn set resolution "@types/react-dom@npm:*" "18"
41-
yarn add react@18 react-dom@18
4238
yarn build:storybook
4339
yarn build:storybook-sitemap --basePath "v${{ env.MAJOR_VERSION }}"
4440
env:

.github/workflows/main.yml

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -73,12 +73,12 @@ jobs:
7373
- name: Install
7474
run: yarn install --immutable
7575

76-
- name: Install 18
77-
if: ${{ matrix.react == '18' }}
76+
- name: Install 19
77+
if: ${{ matrix.react == '19' }}
7878
run: |
79-
yarn set resolution "@types/react@npm:*" "18"
80-
yarn set resolution "@types/react-dom@npm:*" "18"
81-
yarn add react@18 react-dom@18
79+
echo "$(jq '.resolutions += {"@types/react": "npm:types-react@rc", "@types/react-dom": "npm:types-react-dom@rc" }' package.json)" > package.json
80+
yarn add react@rc react-dom@rc
81+
yarn
8282
8383
- name: Build
8484
run: yarn build
@@ -122,10 +122,6 @@ jobs:
122122
- name: Install and Build
123123
run: |
124124
yarn install --immutable
125-
# TODO remove as soon as https://github.com/recharts/recharts/issues/4558 is resolved
126-
yarn set resolution "@types/react@npm:*" "18"
127-
yarn set resolution "@types/react-dom@npm:*" "18"
128-
yarn add react@18 react-dom@18
129125
yarn build:storybook
130126
env:
131127
NODE_OPTIONS: '--max-old-space-size=4096'

.github/workflows/test.yml

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,12 +35,12 @@ jobs:
3535
- name: Install
3636
run: yarn install --immutable
3737

38-
- name: Install 18
39-
if: ${{ matrix.react == '18' }}
38+
- name: Install 19
39+
if: ${{ matrix.react == '19' }}
4040
run: |
41-
yarn set resolution "@types/react@npm:*" "18"
42-
yarn set resolution "@types/react-dom@npm:*" "18"
43-
yarn add react@18 react-dom@18
41+
yarn set resolution "@types/react@npm:*" "npm:types-react@rc"
42+
yarn set resolution "@types/react-dom@npm:*" "npm:types-react-dom@rc"
43+
yarn add react@rc react-dom@rc
4444
4545
- name: Cypress run
4646
if: ${{ (matrix.react == '19' && matrix.spec == 'charts') != true }}

package.json

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -43,8 +43,8 @@
4343
"@ui5/webcomponents-compat": "2.1.2",
4444
"@ui5/webcomponents-fiori": "2.1.2",
4545
"@ui5/webcomponents-icons": "2.1.2",
46-
"react": "19.0.0-rc-f38c22b244-20240704",
47-
"react-dom": "19.0.0-rc-f38c22b244-20240704",
46+
"react": "^18.3.1",
47+
"react-dom": "^18.3.1",
4848
"remark-gfm": "^4.0.0",
4949
"tocbot": "4.29.0"
5050
},
@@ -59,8 +59,8 @@
5959
"@testing-library/cypress": "^10.0.0",
6060
"@types/jscodeshift": "^0.11.11",
6161
"@types/node": "^20.0.0",
62-
"@types/react": "npm:types-react@rc",
63-
"@types/react-dom": "npm:types-react-dom@rc",
62+
"@types/react": "^18.3.4",
63+
"@types/react-dom": "^18.3.0",
6464
"@types/use-sync-external-store": "^0.0.6",
6565
"@typescript-eslint/eslint-plugin": "^7.0.0",
6666
"@typescript-eslint/parser": "^7.0.0",
@@ -110,8 +110,6 @@
110110
]
111111
},
112112
"resolutions": {
113-
"@types/react": "npm:types-react@rc",
114-
"@types/react-dom": "npm:types-react-dom@rc",
115113
"tocbot": "4.29.0",
116114
"@joshwooding/vite-plugin-react-docgen-typescript": "0.3.0"
117115
},

packages/charts/src/components/BarChart/BarChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -236,7 +236,8 @@ const BarChart = forwardRef<HTMLDivElement, BarChartProps>((props, ref) => {
236236
resizeDebounce={chartConfig.resizeDebounce}
237237
{...propsWithoutOmitted}
238238
>
239-
{/*@ts-expect-error: todo not yet compatible with React19*/}
239+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
240+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
240241
<BarChartLib
241242
syncId={syncId}
242243
onClick={onClickInternal}

packages/charts/src/components/BulletChart/BulletChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -281,7 +281,8 @@ const BulletChart = forwardRef<HTMLDivElement, BulletChartProps>((props, ref) =>
281281
resizeDebounce={chartConfig.resizeDebounce}
282282
{...propsWithoutOmitted}
283283
>
284-
{/*@ts-expect-error: todo not yet compatible with React19*/}
284+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
285+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
285286
<ComposedChartLib
286287
syncId={syncId}
287288
onClick={onClickInternal}

packages/charts/src/components/ColumnChart/ColumnChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,8 @@ const ColumnChart = forwardRef<HTMLDivElement, ColumnChartProps>((props, ref) =>
235235
resizeDebounce={chartConfig.resizeDebounce}
236236
{...propsWithoutOmitted}
237237
>
238-
{/*@ts-expect-error: todo not yet compatible with React19*/}
238+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
239+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
239240
<ColumnChartLib
240241
syncId={syncId}
241242
onClick={onClickInternal}

packages/charts/src/components/ComposedChart/index.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -286,7 +286,8 @@ const ComposedChart = forwardRef<HTMLDivElement, ComposedChartProps>((props, ref
286286
resizeDebounce={chartConfig.resizeDebounce}
287287
{...propsWithoutOmitted}
288288
>
289-
{/*@ts-expect-error: todo not yet compatible with React19*/}
289+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
290+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
290291
<ComposedChartLib
291292
syncId={syncId}
292293
onClick={onClickInternal}

packages/charts/src/components/LineChart/LineChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -224,7 +224,8 @@ const LineChart = forwardRef<HTMLDivElement, LineChartProps>((props, ref) => {
224224
resizeDebounce={chartConfig.resizeDebounce}
225225
{...propsWithoutOmitted}
226226
>
227-
{/*@ts-expect-error: todo not yet compatible with React19*/}
227+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
228+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
228229
<LineChartLib
229230
syncId={syncId}
230231
margin={marginChart}

packages/charts/src/components/PieChart/PieChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -276,7 +276,8 @@ const PieChart = forwardRef<HTMLDivElement, PieChartProps>((props, ref) => {
276276
resizeDebounce={chartConfig.resizeDebounce}
277277
{...propsWithoutOmitted}
278278
>
279-
{/*@ts-expect-error: todo not yet compatible with React19*/}
279+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
280+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
280281
<PieChartLib
281282
onClick={onClickInternal}
282283
margin={chartConfig.margin}

packages/charts/src/components/RadarChart/RadarChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,8 @@ const RadarChart = forwardRef<HTMLDivElement, RadarChartProps>((props, ref) => {
175175
resizeDebounce={chartConfig.resizeDebounce}
176176
{...propsWithoutOmitted}
177177
>
178-
{/*@ts-expect-error: todo not yet compatible with React19*/}
178+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
179+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
179180
<RadarChartLib
180181
onClick={onClickInternal}
181182
data={dataset}

packages/charts/src/components/RadialChart/RadialChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -141,7 +141,8 @@ const RadialChart = forwardRef<HTMLDivElement, RadialChartProps>((props, ref) =>
141141
style={style}
142142
{...rest}
143143
>
144-
{/*@ts-expect-error: todo not yet compatible with React19*/}
144+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
145+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
145146
<RadialBarChart
146147
onClick={onClickInternal}
147148
innerRadius="90%"

packages/charts/src/components/ScatterChart/ScatterChart.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -226,7 +226,8 @@ const ScatterChart = forwardRef<HTMLDivElement, ScatterChartProps>((props, ref)
226226
resizeDebounce={chartConfig.resizeDebounce}
227227
{...propsWithoutOmitted}
228228
>
229-
{/*@ts-expect-error: todo not yet compatible with React19*/}
229+
{/* eslint-disable-next-line @typescript-eslint/ban-ts-comment */}
230+
{/*// @ts-ignore:: todo not yet compatible with React19*/}
230231
<ScatterChartLib
231232
onClick={onClickInternal}
232233
margin={marginChart}

yarn.lock

Lines changed: 50 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -5859,6 +5859,13 @@ __metadata:
58595859
languageName: node
58605860
linkType: hard
58615861

5862+
"@types/prop-types@npm:*":
5863+
version: 15.7.12
5864+
resolution: "@types/prop-types@npm:15.7.12"
5865+
checksum: 10c0/1babcc7db6a1177779f8fde0ccc78d64d459906e6ef69a4ed4dd6339c920c2e05b074ee5a92120fe4e9d9f1a01c952f843ebd550bee2332fc2ef81d1706878f8
5866+
languageName: node
5867+
linkType: hard
5868+
58625869
"@types/qs@npm:*":
58635870
version: 6.9.7
58645871
resolution: "@types/qs@npm:6.9.7"
@@ -5880,21 +5887,22 @@ __metadata:
58805887
languageName: node
58815888
linkType: hard
58825889

5883-
"@types/react-dom@npm:types-react-dom@rc":
5884-
version: 19.0.0-rc.0
5885-
resolution: "types-react-dom@npm:19.0.0-rc.0"
5890+
"@types/react-dom@npm:^18.3.0":
5891+
version: 18.3.0
5892+
resolution: "@types/react-dom@npm:18.3.0"
58865893
dependencies:
58875894
"@types/react": "npm:*"
5888-
checksum: 10c0/a05f48aec358142f167f4765ed25e4a8185926fe24421c6f0e9af7bbd3029055e01198a300543621c7dd0c045ac84a536e71a74b3ad6d5d95300e4584ab8a0aa
5895+
checksum: 10c0/6c90d2ed72c5a0e440d2c75d99287e4b5df3e7b011838cdc03ae5cd518ab52164d86990e73246b9d812eaf02ec351d74e3b4f5bd325bf341e13bf980392fd53b
58895896
languageName: node
58905897
linkType: hard
58915898

5892-
"@types/react@npm:types-react@rc":
5893-
version: 19.0.0-rc.0
5894-
resolution: "types-react@npm:19.0.0-rc.0"
5899+
"@types/react@npm:*, @types/react@npm:^16.8.0 || ^17.0.0 || ^18.0.0, @types/react@npm:^18.3.4":
5900+
version: 18.3.4
5901+
resolution: "@types/react@npm:18.3.4"
58955902
dependencies:
5903+
"@types/prop-types": "npm:*"
58965904
csstype: "npm:^3.0.2"
5897-
checksum: 10c0/b8c035f3f6354b2b1e24473ec2fb981afab9db726177755cdc6a610f607e8d89ca2297f4a80be1464013aa073a5496627fa0a0125f60af12daa769ad508cf3ea
5905+
checksum: 10c0/5c52e1e6f540cff21e3c2a5212066d02e005f6fb21e4a536a29097fae878db9f407cd7a4b43778f51359349c5f692e08bc77ddb5f5cecbfca9ca4d4e3c91a48e
58985906
languageName: node
58995907
linkType: hard
59005908

@@ -19065,17 +19073,6 @@ __metadata:
1906519073
languageName: node
1906619074
linkType: hard
1906719075

19068-
"react-dom@npm:19.0.0-rc-f38c22b244-20240704":
19069-
version: 19.0.0-rc-f38c22b244-20240704
19070-
resolution: "react-dom@npm:19.0.0-rc-f38c22b244-20240704"
19071-
dependencies:
19072-
scheduler: "npm:0.25.0-rc-f38c22b244-20240704"
19073-
peerDependencies:
19074-
react: 19.0.0-rc-f38c22b244-20240704
19075-
checksum: 10c0/fecc3111fdd257686f720a3fa2b61d52bc17e208eee8fcf96928216de1dddfd6684e28d7bc6148ec9d9b9a35f5e75d513b4fd7b3011cc66a1cab6acb371aa264
19076-
languageName: node
19077-
linkType: hard
19078-
1907919076
"react-dom@npm:^16.8.0 || ^17.0.0 || ^18.0.0":
1908019077
version: 18.2.0
1908119078
resolution: "react-dom@npm:18.2.0"
@@ -19088,6 +19085,18 @@ __metadata:
1908819085
languageName: node
1908919086
linkType: hard
1909019087

19088+
"react-dom@npm:^18.3.1":
19089+
version: 18.3.1
19090+
resolution: "react-dom@npm:18.3.1"
19091+
dependencies:
19092+
loose-envify: "npm:^1.1.0"
19093+
scheduler: "npm:^0.23.2"
19094+
peerDependencies:
19095+
react: ^18.3.1
19096+
checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85
19097+
languageName: node
19098+
linkType: hard
19099+
1909119100
"react-element-to-jsx-string@npm:^15.0.0":
1909219101
version: 15.0.0
1909319102
resolution: "react-element-to-jsx-string@npm:15.0.0"
@@ -19175,13 +19184,6 @@ __metadata:
1917519184
languageName: node
1917619185
linkType: hard
1917719186

19178-
"react@npm:19.0.0-rc-f38c22b244-20240704":
19179-
version: 19.0.0-rc-f38c22b244-20240704
19180-
resolution: "react@npm:19.0.0-rc-f38c22b244-20240704"
19181-
checksum: 10c0/fe2a5365016ab8dc4e0ffc285cc107a73df7829c524ded753390c6c05346b4ec6dbdcb40843182f91a7cfbee735ad707f349ed524c4626417fc14078637410d6
19182-
languageName: node
19183-
linkType: hard
19184-
1918519187
"react@npm:^16.8.0 || ^17.0.0 || ^18.0.0":
1918619188
version: 18.2.0
1918719189
resolution: "react@npm:18.2.0"
@@ -19191,6 +19193,15 @@ __metadata:
1919119193
languageName: node
1919219194
linkType: hard
1919319195

19196+
"react@npm:^18.3.1":
19197+
version: 18.3.1
19198+
resolution: "react@npm:18.3.1"
19199+
dependencies:
19200+
loose-envify: "npm:^1.1.0"
19201+
checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3
19202+
languageName: node
19203+
linkType: hard
19204+
1919419205
"read-cache@npm:^1.0.0":
1919519206
version: 1.0.0
1919619207
resolution: "read-cache@npm:1.0.0"
@@ -20068,13 +20079,6 @@ __metadata:
2006820079
languageName: node
2006920080
linkType: hard
2007020081

20071-
"scheduler@npm:0.25.0-rc-f38c22b244-20240704":
20072-
version: 0.25.0-rc-f38c22b244-20240704
20073-
resolution: "scheduler@npm:0.25.0-rc-f38c22b244-20240704"
20074-
checksum: 10c0/370f144cac09f27ed12d8cad81972f1551206da9fd2c6e64a6e797bb5bb258c655192d8502f2f9e71140f6b3ee93f964534e59301e2fe50950a643f4d3d8c233
20075-
languageName: node
20076-
linkType: hard
20077-
2007820082
"scheduler@npm:^0.23.0":
2007920083
version: 0.23.0
2008020084
resolution: "scheduler@npm:0.23.0"
@@ -20084,6 +20088,15 @@ __metadata:
2008420088
languageName: node
2008520089
linkType: hard
2008620090

20091+
"scheduler@npm:^0.23.2":
20092+
version: 0.23.2
20093+
resolution: "scheduler@npm:0.23.2"
20094+
dependencies:
20095+
loose-envify: "npm:^1.1.0"
20096+
checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78
20097+
languageName: node
20098+
linkType: hard
20099+
2008720100
"semver@npm:2 || 3 || 4 || 5, semver@npm:^5.6.0":
2008820101
version: 5.7.2
2008920102
resolution: "semver@npm:5.7.2"
@@ -21946,8 +21959,8 @@ __metadata:
2194621959
"@testing-library/cypress": "npm:^10.0.0"
2194721960
"@types/jscodeshift": "npm:^0.11.11"
2194821961
"@types/node": "npm:^20.0.0"
21949-
"@types/react": "npm:types-react@rc"
21950-
"@types/react-dom": "npm:types-react-dom@rc"
21962+
"@types/react": "npm:^18.3.4"
21963+
"@types/react-dom": "npm:^18.3.0"
2195121964
"@types/use-sync-external-store": "npm:^0.0.6"
2195221965
"@typescript-eslint/eslint-plugin": "npm:^7.0.0"
2195321966
"@typescript-eslint/parser": "npm:^7.0.0"
@@ -21983,8 +21996,8 @@ __metadata:
2198321996
postcss-modules: "npm:^6.0.0"
2198421997
postcss-nesting: "npm:^13.0.0"
2198521998
prettier: "npm:^3.0.0"
21986-
react: "npm:19.0.0-rc-f38c22b244-20240704"
21987-
react-dom: "npm:19.0.0-rc-f38c22b244-20240704"
21999+
react: "npm:^18.3.1"
22000+
react-dom: "npm:^18.3.1"
2198822001
remark-gfm: "npm:^4.0.0"
2198922002
rimraf: "npm:^6.0.0"
2199022003
storybook: "npm:8.2.9"

0 commit comments

Comments
 (0)