usePageFocusStyle

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

src/usePageFocusStyle.ts

@@ -0,0 +1,23 @@
+import { useEffect } from "react";
+import { useFocusVisible } from "@react-aria/interactions";
+
+import styles from "./usePageFocusStyle.module.css";
+
+export function usePageFocusStyle(): void {
+  const { isFocusVisible } = useFocusVisible();
+
+  useEffect(() => {
+    const classList = document.body.classList;
+    const hasClass = classList.contains(styles.hideFocus);
+
+    if (isFocusVisible && hasClass) {
+      classList.remove(styles.hideFocus);
+    } else if (!isFocusVisible && !hasClass) {
+      classList.add(styles.hideFocus);
+    }
+
+    return () => {
+      classList.remove(styles.hideFocus);
+    };
+  }, [isFocusVisible]);
+}