examples/design-system/packages/acme-utils/src/useIsomorphicLayoutEffect.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13

import * as React from "react";

/**
 * On the server, React emits a warning when calling `useLayoutEffect`.
 * This is because neither `useLayoutEffect` nor `useEffect` run on the server.
 * We use this safe version which suppresses the warning by replacing it with a noop on the server.
 *
 * See: https://reactjs.org/docs/hooks-reference.html#uselayouteffect
 */
const useIsomorphicLayoutEffect =
  typeof window !== "undefined" ? React.useLayoutEffect : () => {};

export { useIsomorphicLayoutEffect };