feat: Fluent UI Outlook Lite + connections mockup

node_modules/@fluentui/react-utilities/lib/hooks/useEventCallback.js

@@ -0,0 +1,31 @@
+'use client';
+import * as React from 'react';
+import { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';
+/**
+ * @internal
+ * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
+ *
+ * Modified `useCallback` that can be used when dependencies change too frequently. Can occur when
+ * e.g. user props are dependencies which could change on every render
+ * e.g. volatile values (i.e. useState/useDispatch) are dependencies which could change frequently
+ *
+ * This should not be used often, but can be a useful re-render optimization since the callback is a ref and
+ * will not be invalidated between re-renders
+ *
+ * @param fn - The callback function that will be used
+ */ export const useEventCallback = (fn)=>{
+    const callbackRef = React.useRef(()=>{
+        throw new Error('Cannot call an event handler while rendering');
+    });
+    useIsomorphicLayoutEffect(()=>{
+        callbackRef.current = fn;
+    }, [
+        fn
+    ]);
+    return React.useCallback((...args)=>{
+        const callback = callbackRef.current;
+        return callback(...args);
+    }, [
+        callbackRef
+    ]);
+};