23 lines
630 B
JavaScript
23 lines
630 B
JavaScript
|
import { useEffect } from "react";
|
||
|
|
import { useFocusVisible } from "@react-aria/interactions";
|
||
|
|
import styles from "./usePageFocusStyle.module.css";
|
||
|
|
|
||
|
|
export function usePageFocusStyle() {
|
||
|
|
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]);
|
||
|
|
}
|