Namespace Component + forwardRef 왜 안돼

응집도를 높이고 결합도를 낮추기 위해서 컴포넌트의 하위 속성으로 컴포넌트를 전달하는 React Namespace Pattern이 있는데요. forwardRef와 함께 사용하면 아쉬운 문제점이 있습니다.

forwardRef로 컴포넌트를 wrapping하면 하위 컴포넌트를 추가했을 때 다음과 같은 타입에러가 발생하여 실제로 활용할 수가 없죠.

이를 해결하기 위해 Object.assign을 사용하여 forwardRef로 wrapping된 컴포넌트의 하위 속성으로 자식 컴포넌트를 추가할 수 있습니다.
(JavaScript에서 function은 객체이고 그로 인해서 Object.assign으로 하위 컴포넌트를 속성값으로 병합할 수 있습니다)