feat: allow a ref to be undefined in the types (#33)

Author: skvale

src/index.test.tsx

@@ -21,3 +21,25 @@ test("mergeRefs", () => {
   expect(refAsFunc).toHaveBeenCalledWith(null);
   expect(refAsObj.current).toBe(null);
 });
+
+test("mergeRefs with undefined and null refs", () => {
+  const Dummy = React.forwardRef(function Dummy(_, ref) {
+    React.useImperativeHandle(ref, () => "refValue");
+    return null;
+  });
+  const refAsFunc = jest.fn();
+  const refAsObj = { current: undefined };
+  const Example: React.FC<{ visible: boolean }> = ({ visible }) => {
+    return visible ? (
+      <Dummy ref={mergeRefs([null, undefined, refAsFunc, refAsObj])} />
+    ) : null;
+  };
+  const { rerender } = render(<Example visible />);
+  expect(refAsFunc).toHaveBeenCalledTimes(1);
+  expect(refAsFunc).toHaveBeenCalledWith("refValue");
+  expect(refAsObj.current).toBe("refValue");
+  rerender(<Example visible={false} />);
+  expect(refAsFunc).toHaveBeenCalledTimes(2);
+  expect(refAsFunc).toHaveBeenCalledWith(null);
+  expect(refAsObj.current).toBe(null);
+});

src/index.tsx

@@ -1,7 +1,7 @@
 import type * as React from "react";
 
 export function mergeRefs<T = any>(
-  refs: Array<React.MutableRefObject<T> | React.LegacyRef<T>>
+  refs: Array<React.MutableRefObject<T> | React.LegacyRef<T> | undefined | null>
 ): React.RefCallback<T> {
   return (value) => {
     refs.forEach((ref) => {