Skip to content

Commit 3a9b8ef

Browse files
jscottsmithjscottsmith
authored
feat: support react 19 (#282)
* feat: support react 19 * Revert "fix: do nothing when ref is null" This reverts commit 491ae26. * fix: tests * chore: remove obsolete snapshots * fix: act warning
1 parent 491ae26 commit 3a9b8ef

File tree

10 files changed

+377
-942
lines changed

10 files changed

+377
-942
lines changed

‎documentation/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@
2424
"classnames": "^2.3.2",
2525
"clsx": "2.0.0",
2626
"prism-react-renderer": "^2.3.0",
27-
"react": "^18.2.0",
28-
"react-dom": "^18.2.0",
27+
"react": "^19.1.1",
28+
"react-dom": "^19.1.1",
2929
"react-scroll-parallax": "^3.4.5"
3030
},
3131
"browserslist": {

‎documentation/pnpm-lock.yaml‎

Lines changed: 223 additions & 228 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@
4444
"release": "np"
4545
},
4646
"peerDependencies": {
47-
"react": "^16.8.0-0 || >=17.0.1 || ^18.0.0",
48-
"react-dom": "^16.8.0-0 || >=17.0.1 || ^18.0.0"
47+
"react": "^16.8.0-0 || >=17.0.1 || ^18.0.0 || ^19.0.0",
48+
"react-dom": "^16.8.0-0 || >=17.0.1 || ^18.0.0 || ^19.0.0"
4949
},
5050
"author": "J Scott Smith",
5151
"license": "MIT",
@@ -86,8 +86,8 @@
8686
"@testing-library/dom": "^10.0.0",
8787
"@testing-library/jest-dom": "^6.0.0",
8888
"@testing-library/react": "^16.0.0",
89-
"@types/react": "^18.2.0",
90-
"@types/react-dom": "^18.2.0",
89+
"@types/react": "^19.1.1",
90+
"@types/react-dom": "^19.1.1",
9191
"@typescript-eslint/eslint-plugin": "^8.44.1",
9292
"@typescript-eslint/parser": "^8.44.1",
9393
"@vitest/coverage-v8": "^3.2.4",
@@ -100,10 +100,10 @@
100100
"np": "^10.2.0",
101101
"postcss": "^8",
102102
"prettier": "^3.6.2",
103-
"react": "^18.2.0",
104-
"react-dom": "^18.2.0",
105-
"react-is": "^18.2.0",
106-
"react-test-renderer": "^18.2.0",
103+
"react": "^19.1.1",
104+
"react-dom": "^19.1.1",
105+
"react-is": "^19.1.1",
106+
"react-test-renderer": "^19.1.1",
107107
"sass": "^1.49.11",
108108
"sass-loader": "^10.1.0",
109109
"size-limit": "^6.0.4",

‎pnpm-lock.yaml‎

Lines changed: 77 additions & 108 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/components/Parallax/__snapshots__/index.test.tsx.snap‎

Lines changed: 0 additions & 205 deletions
Original file line numberDiff line numberDiff line change
@@ -204,208 +204,3 @@ exports[`given the <Parallax> component > when the prop { translateY: [ -100, 10
204204
/>
205205
</DocumentFragment>
206206
`;
207-
208-
exports[`given the <Parallax> component when normal configurations are given then it renders correctly 1`] = `
209-
<DocumentFragment>
210-
<div
211-
class="class-foo"
212-
style="border: 2px solid red; will-change: transform; transform: translateX(100%)translateY(100%);"
213-
>
214-
<div
215-
class="foo"
216-
/>
217-
</div>
218-
</DocumentFragment>
219-
`;
220-
221-
exports[`given the <Parallax> component when the prop { disabled: true } is given then it renders without issue and calls create element with props 1`] = `
222-
<DocumentFragment>
223-
<div
224-
style="will-change: transform;"
225-
/>
226-
</DocumentFragment>
227-
`;
228-
229-
exports[`given the <Parallax> component when the prop { easing: 'easeInQuad' } is given then it renders without issue and calls create element with props 1`] = `
230-
<DocumentFragment>
231-
<div
232-
style="will-change: transform;"
233-
/>
234-
</DocumentFragment>
235-
`;
236-
237-
exports[`given the <Parallax> component when the prop { easing: [Array] } is given then it renders without issue and calls create element with props 1`] = `
238-
<DocumentFragment>
239-
<div
240-
style="will-change: transform;"
241-
/>
242-
</DocumentFragment>
243-
`;
244-
245-
exports[`given the <Parallax> component when the prop { onChange: [Function: onChange] } is given then it renders without issue and calls create element with props 1`] = `
246-
<DocumentFragment>
247-
<div
248-
style="will-change: transform;"
249-
/>
250-
</DocumentFragment>
251-
`;
252-
253-
exports[`given the <Parallax> component when the prop { onEnter: [Function: onEnter] } is given then it renders without issue and calls create element with props 1`] = `
254-
<DocumentFragment>
255-
<div
256-
style="will-change: transform;"
257-
/>
258-
</DocumentFragment>
259-
`;
260-
261-
exports[`given the <Parallax> component when the prop { onExit: [Function: onExit] } is given then it renders without issue and calls create element with props 1`] = `
262-
<DocumentFragment>
263-
<div
264-
style="will-change: transform;"
265-
/>
266-
</DocumentFragment>
267-
`;
268-
269-
exports[`given the <Parallax> component when the prop { onProgressChange: [Function: onProgressChange] } is given then it renders without issue and calls create element with props 1`] = `
270-
<DocumentFragment>
271-
<div
272-
style="will-change: transform;"
273-
/>
274-
</DocumentFragment>
275-
`;
276-
277-
exports[`given the <Parallax> component when the prop { opacity: [Array] } is given then it renders without issue and calls create element with props 1`] = `
278-
<DocumentFragment>
279-
<div
280-
style="will-change: transform,opacity; opacity: 1;"
281-
/>
282-
</DocumentFragment>
283-
`;
284-
285-
exports[`given the <Parallax> component when the prop { rootMargin: [Object] } is given then it renders without issue and calls create element with props 1`] = `
286-
<DocumentFragment>
287-
<div
288-
style="will-change: transform;"
289-
/>
290-
</DocumentFragment>
291-
`;
292-
293-
exports[`given the <Parallax> component when the prop { rotate: [Array] } is given then it renders without issue and calls create element with props 1`] = `
294-
<DocumentFragment>
295-
<div
296-
style="will-change: transform; transform: rotate(1turn);"
297-
/>
298-
</DocumentFragment>
299-
`;
300-
301-
exports[`given the <Parallax> component when the prop { rotateX: [Array] } is given then it renders without issue and calls create element with props 1`] = `
302-
<DocumentFragment>
303-
<div
304-
style="will-change: transform; transform: rotateX(1turn);"
305-
/>
306-
</DocumentFragment>
307-
`;
308-
309-
exports[`given the <Parallax> component when the prop { rotateY: [Array] } is given then it renders without issue and calls create element with props 1`] = `
310-
<DocumentFragment>
311-
<div
312-
style="will-change: transform; transform: rotateY(1turn);"
313-
/>
314-
</DocumentFragment>
315-
`;
316-
317-
exports[`given the <Parallax> component when the prop { rotateZ: [Array] } is given then it renders without issue and calls create element with props 1`] = `
318-
<DocumentFragment>
319-
<div
320-
style="will-change: transform; transform: rotateZ(1turn);"
321-
/>
322-
</DocumentFragment>
323-
`;
324-
325-
exports[`given the <Parallax> component when the prop { scale: [Array] } is given then it renders without issue and calls create element with props 1`] = `
326-
<DocumentFragment>
327-
<div
328-
style="will-change: transform; transform: scale(1);"
329-
/>
330-
</DocumentFragment>
331-
`;
332-
333-
exports[`given the <Parallax> component when the prop { scaleX: [Array] } is given then it renders without issue and calls create element with props 1`] = `
334-
<DocumentFragment>
335-
<div
336-
style="will-change: transform; transform: scaleX(1);"
337-
/>
338-
</DocumentFragment>
339-
`;
340-
341-
exports[`given the <Parallax> component when the prop { scaleY: [Array] } is given then it renders without issue and calls create element with props 1`] = `
342-
<DocumentFragment>
343-
<div
344-
style="will-change: transform; transform: scaleY(1);"
345-
/>
346-
</DocumentFragment>
347-
`;
348-
349-
exports[`given the <Parallax> component when the prop { scaleZ: [Array] } is given then it renders without issue and calls create element with props 1`] = `
350-
<DocumentFragment>
351-
<div
352-
style="will-change: transform; transform: scaleZ(1);"
353-
/>
354-
</DocumentFragment>
355-
`;
356-
357-
exports[`given the <Parallax> component when the prop { shouldAlwaysCompleteAnimation: true } is given then it renders without issue and calls create element with props 1`] = `
358-
<DocumentFragment>
359-
<div
360-
style="will-change: transform;"
361-
/>
362-
</DocumentFragment>
363-
`;
364-
365-
exports[`given the <Parallax> component when the prop { shouldDisableScalingTranslations: true } is given then it renders without issue and calls create element with props 1`] = `
366-
<DocumentFragment>
367-
<div
368-
style="will-change: transform;"
369-
/>
370-
</DocumentFragment>
371-
`;
372-
373-
exports[`given the <Parallax> component when the prop { speed: 10 } is given then it renders without issue and calls create element with props 1`] = `
374-
<DocumentFragment>
375-
<div
376-
style="will-change: transform; transform: translateY(-100px);"
377-
/>
378-
</DocumentFragment>
379-
`;
380-
381-
exports[`given the <Parallax> component when the prop { startScroll: 0, endScroll: 1000 } is given then it renders without issue and calls create element with props 1`] = `
382-
<DocumentFragment>
383-
<div
384-
style="will-change: transform;"
385-
/>
386-
</DocumentFragment>
387-
`;
388-
389-
exports[`given the <Parallax> component when the prop { targetElement: HTMLDivElement {} } is given then it renders without issue and calls create element with props 1`] = `
390-
<DocumentFragment>
391-
<div
392-
style="will-change: transform;"
393-
/>
394-
</DocumentFragment>
395-
`;
396-
397-
exports[`given the <Parallax> component when the prop { translateX: [Array] } is given then it renders without issue and calls create element with props 1`] = `
398-
<DocumentFragment>
399-
<div
400-
style="will-change: transform; transform: translateX(100%);"
401-
/>
402-
</DocumentFragment>
403-
`;
404-
405-
exports[`given the <Parallax> component when the prop { translateY: [Array] } is given then it renders without issue and calls create element with props 1`] = `
406-
<DocumentFragment>
407-
<div
408-
style="will-change: transform; transform: translateY(100%);"
409-
/>
410-
</DocumentFragment>
411-
`;

0 commit comments

Comments
 (0)