Add useRefWithInit

Author: compulim

packages/component/src/providers/ClipboardWritePermissionWithStable/private/useRefWithInit.ts

@@ -0,0 +1,14 @@
+import { useRef } from 'react';
+
+// useRef() does not support init function like useMemo().
+export default function useRefWithInit<T>(fn: () => T): ReturnType<typeof useRef<T>> {
+  const initializedRef = useRef(false);
+  const ref = useRef<T>();
+
+  if (!initializedRef.current) {
+    ref.current = fn();
+    initializedRef.current = true;
+  }
+
+  return ref;
+}

packages/component/src/providers/ClipboardWritePermissionWithStable/private/useStableStateHook.ts

@@ -1,7 +1,9 @@
-import { useCallback, useEffect, useMemo, useRef, useState, type Dispatch, type SetStateAction } from 'react';
+import { useCallback, useEffect, useMemo, useState, type Dispatch, type SetStateAction } from 'react';
 import { createPropagation } from 'use-propagate';
 import { useRefFrom } from 'use-ref-from';
 
+import useRefWithInit from './useRefWithInit';
+
 export default function useStableStateHook<T>(value: T): () => readonly [T];
 
 export default function useStableStateHook<T>(
@@ -13,13 +15,9 @@ export default function useStableStateHook<T>(
   value: T,
   setValue?: Dispatch<SetStateAction<T>> | undefined
 ): () => readonly [T, Dispatch<SetStateAction<T>>] | readonly [T] {
-  const propagationRef = useRef<ReturnType<typeof createPropagation<T>>>();
+  const propagationRef = useRefWithInit<ReturnType<typeof createPropagation<T>>>(() => createPropagation<T>());
   const valueRef = useRefFrom(value);
 
-  if (!propagationRef.current) {
-    propagationRef.current = createPropagation<T>();
-  }
-
   const {
     current: { usePropagate, useListen }
   } = propagationRef;
@@ -28,6 +26,7 @@ export default function useStableStateHook<T>(
 
   useEffect(() => propagate(value), [propagate, value]);
 
+  // One-off variable to hack around ESLint rules without disabling react-hooks/rules-of-hooks.
   const useHook = () => {
     const [propagatedValue, setPropagatedValue] = useState<T>(valueRef.current);