From 6121b396febae882b18b50d644e0647ba4d88a7a Mon Sep 17 00:00:00 2001
From: Tim Kolberger <tim@kolberger.eu>
Date: Tue, 15 Nov 2022 13:19:24 +0100
Subject: [PATCH 1/2] fix(react): forward ref typings

---
 packages/react/src/forwardRef.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/forwardRef.tsx b/packages/react/src/forwardRef.tsx
index 4aa32471..713c0970 100644
--- a/packages/react/src/forwardRef.tsx
+++ b/packages/react/src/forwardRef.tsx
@@ -63,8 +63,8 @@ export function forwardRef<
   Props extends Record<string, unknown> = Record<never, never>,
 >(
   component: ForwardRefRenderFunction<
-    unknown,
-    AssignCommon<ComponentProps<Component>, Props> & {
+    never,
+    AssignCommon<PropsOf<Component>, Props> & {
       as?: ElementType
     }
   >,

From 8ce279efdcb76c47a37b1e512e6bfa3a68b9c0d1 Mon Sep 17 00:00:00 2001
From: Tim Kolberger <tim@kolberger.eu>
Date: Tue, 15 Nov 2022 13:19:52 +0100
Subject: [PATCH 2/2] test(react): add tests for forward ref

---
 packages/react/test/forward-ref.test.tsx | 30 ++++++++++++++++++++++++
 1 file changed, 30 insertions(+)
 create mode 100644 packages/react/test/forward-ref.test.tsx

diff --git a/packages/react/test/forward-ref.test.tsx b/packages/react/test/forward-ref.test.tsx
new file mode 100644
index 00000000..27cb2923
--- /dev/null
+++ b/packages/react/test/forward-ref.test.tsx
@@ -0,0 +1,30 @@
+import { createRef } from 'react'
+import type { HTMLPolymorphicProps } from '../src'
+import { polymorphicFactory, forwardRef } from '../src'
+import { render } from '@testing-library/react'
+
+describe('forwardRef', () => {
+  const poly = polymorphicFactory()
+
+  it('should forward the ref', () => {
+    const ComponentUnderTest = forwardRef<'div', HTMLPolymorphicProps<'div'>>((props, ref) => (
+      <poly.div {...props} ref={ref} />
+    ))
+
+    const ref = createRef<HTMLDivElement>()
+    render(<ComponentUnderTest ref={ref} />)
+    expect(ref.current).toBeInstanceOf(HTMLDivElement)
+  })
+
+  it('should forward the ref with as prop', () => {
+    const ComponentUnderTest = forwardRef<'div', HTMLPolymorphicProps<'div'>>((props, ref) => (
+      <poly.div {...props} ref={ref} />
+    ))
+
+    // known issue: with the `as` prop refs are not inherited correctly
+    // workaround:
+    const ref = createRef<HTMLDivElement & HTMLFormElement>()
+    render(<ComponentUnderTest as="form" ref={ref} />)
+    expect(ref.current).toBeInstanceOf(HTMLFormElement)
+  })
+})