The recent change to Framer's ForwardRefComponent type breaks compatibility with React.ForwardRefExoticComponent due to a missing property $$typeof, which lives on React.ExoticComponent.
This means that Framer's motion components won't be accepted in contexts calling for a standard ForwardRefExoticComponent. See below:
Working in framer-motion@11.1.3, but breaks in framer-motion@11.1.4
import * as React from "react"
import { motion } from "framer-motion"
function myComponentFactory<P>(component: React.ForwardRefExoticComponent<P>) {
// implementation
}
myComponentFactory(motion.header)
/*
❗ Property '$$typeof' is missing in type 'ForwardRefComponent<HTMLElement, HTMLMotionProps<"header">>'
*/
With this change, ForwardRefComponent's type behaves as normal, and can retain the JSX.Element return type while better supporting React's type implementation.
The recent change to Framer's
ForwardRefComponent
type breaks compatibility withReact.ForwardRefExoticComponent
due to a missing property$$typeof
, which lives onReact.ExoticComponent
.This means that Framer's
motion
components won't be accepted in contexts calling for a standardForwardRefExoticComponent
. See below:Working in
framer-motion@11.1.3
, but breaks inframer-motion@11.1.4
With this change,
ForwardRefComponent
's type behaves as normal, and can retain theJSX.Element
return type while better supporting React's type implementation.