Update example to use ReactNode over ReactElement

mediamonks · Dec 5, 2023 · 60f7672 · 60f7672
1 parent 2e5243e
commit 60f7672
Showing 1 changed file with 15 additions and 13 deletions.
diff --git a/src/types/PolymorphicComponentProps/PolymorphicComponentProps.mdx b/src/types/PolymorphicComponentProps/PolymorphicComponentProps.mdx
@@ -19,7 +19,7 @@ type FooComponentProps<T extends ElementType> = PolymorphicComponentProps<
   { barProp: string | undefined }
 >;
 
-type FooComponent = <T extends ElementType>(props: FooComponentProps<T>) => ReactElement | null;
+type FooComponent = <T extends ElementType>(props: FooComponentProps<T>) => ReactNode | null;
 
 export const Foo: FooComponent = <T extends ElementType>({
   as: Component = 'div',
@@ -68,16 +68,18 @@ type FooComponentProps<T extends ElementType> = PolymorphicComponentPropsWithRef
   { barProp: string | undefined }
 >;
 
-type FooComponent = <T extends ElementType>(props: FooComponentProps<T>) => ReactElement | null;
-
-export const Foo: FooComponent = <T extends ElementType>(
-  { as: Component = 'div', children, ...otherProps }: FooComponentProps<T>,
-  ref?: PolymorphicRef<T>,
-) => {
-  return (
-    <Component {...otherProps} ref={ref}>
-      {children}
-    </Component>
-  );
-};
+type FooComponent = <T extends ElementType>(props: FooComponentProps<T>) => ReactNode | null;
+
+export const Foo: FooComponent = forwardRef(
+  <T extends ElementType>(
+    { as: Component = 'div', children, ...otherProps }: FooComponentProps<T>,
+    ref?: PolymorphicRef<T>,
+  ) => {
+    return (
+      <Component {...otherProps} ref={ref}>
+        {children}
+      </Component>
+    );
+  },
+);
 ```