Description
I get this console Error using the Modal Component in react-bootstrap:
Warning: Accessing element.ref is no longer supported. ref is now a regular prop. It will be removed from the JSX Element type in a future release.
Stack:
RTGTransition<@webpack-internal:///(app-pages-browser)/./node_modules/@restart/ui/esm/RTGTransition.js:18:9 Modal<@webpack-internal:///(app-pages-browser)/./node_modules/@restart/ui/esm/Modal.js:102:9 _c2<@webpack-internal:///(app-pages-browser)/./node_modules/react-bootstrap/esm/Modal.js:70:614 ...
I see in @restart/ui/esm/RTGTransition.js that the .ref property is being assigned, and I assume this is the cause.
I'm using:
- "@restart/ui" "version": "1.6.8"
- "next": "^14.3.0-canary.16"
- "react": "^18.2.0"
- "react-bootstrap": "^2.10.2"
I'm getting red console error is why I'm posting this as a bug instead of a feature, please excuse me if this is was a mistake.
-- Update
This is untested, but I noticed this may be triggering the error:
//- const mergedRef = useMergedRefs(nodeRef, typeof children === 'function' ? null : children.ref);
//+
const mergedRef = useMergedRefs(nodeRef, typeof children === 'function' ? null : children.props.ref);