Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Slot component causes a warning in React 19 about accessing .ref directly #2890

Closed
OriginalEXE opened this issue May 9, 2024 · 2 comments
Closed

Comments

@OriginalEXE
Copy link

Bug report

Current Behavior

The Slot component accesses .ref on the element, which seems to be a no-no in React 19. The problematic line seems to be this one:
https://github.com/radix-ui/primitives/blob/main/packages/react/slot/src/Slot.tsx#L66

This results in the following warning:

Warning: Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.

Expected behavior

No warnings

Reproducible example

CodeSandbox Template

Suggested solution

I haven't tried it, but maybe something like

ref: forwardedRef ? composeRefs(forwardedRef, (children as any).props.ref ?? (children as any).ref) : (children as any).props.ref ?? (children as any).ref,

Your environment

Software Name(s) Version
Radix Package(s) Any using Slot latest
React n/a 19.0.0-beta-6946ebe620-20240508
@OriginalEXE OriginalEXE changed the title Fix a warning in React 19 about accessing .ref directly Slot component causes a warning in React 19 about accessing .ref directly May 9, 2024
@bzmillerboy
Copy link

A PR is open to address this. #2811

@OriginalEXE
Copy link
Author

Ah, didn't find it via search, thanks, eagerly watching that PR then 👀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants