fix(react-utilities): avoid calling requestAnimationFrame when in SSR

change/@fluentui-react-utilities-b4af8469-27c7-4b29-a6a9-13ef542e6779.json

@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: use timeout instead of requestAnimationFrame for ssr",
+  "packageName": "@fluentui/react-utilities",
+  "email": "marcosvmmoura@gmail.com",
+  "dependentChangeType": "patch"
+}

packages/react-components/react-utilities/src/hooks/useAnimationFrame.ts

@@ -1,3 +1,4 @@
+import { canUseDOM } from '../ssr/canUseDOM';
 import { useBrowserTimer } from './useBrowserTimer';
 
 /**
@@ -9,6 +10,11 @@ import { useBrowserTimer } from './useBrowserTimer';
  * @returns A pair of [requestAnimationFrame, cancelAnimationFrame] that are stable between renders.
  */
 export function useAnimationFrame() {
+  const isDOM = canUseDOM();
+
   // TODO: figure it out a way to not call global.requestAnimationFrame and instead infer window from some context
-  return useBrowserTimer(requestAnimationFrame, cancelAnimationFrame);
+  const setAnimationFrame = isDOM ? requestAnimationFrame : setTimeout;
+  const clearAnimationFrame = isDOM ? cancelAnimationFrame : clearTimeout;
+
+  return useBrowserTimer(setAnimationFrame, clearAnimationFrame);
 }