feat: + useVisibilityState

package.json

@@ -25,6 +25,9 @@
     "pack:all": "npm run build && npm pack --pack-destination ./dist && node scripts/pack-modules.js",
     "test": "echo \"Error: no test specified\" && exit 1"
   },
+  "peerDependencies": {
+    "react": "^18.3.0"
+  },
   "devDependencies": {
     "@babel/cli": "^7.28.3",
     "@babel/core": "^7.28.5",
@@ -32,6 +35,7 @@
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.0",
     "@rollup/plugin-node-resolve": "^15.3.0",
+    "react": "^18.3.1",
     "rimraf": "^6.1.2",
     "rollup": "^4.24.0"
   }

src/hooks/index.js

@@ -1,2 +1,3 @@
 // Auto Generated index.js
 export * as useHTLanguageSets from './useHTLanguageSets.js';
+export * as useVisibilityState from './useVisibilityState.js';

src/hooks/useVisibilityState.js

@@ -0,0 +1,20 @@
+import { useState, useEffect } from 'react';
+export function useVisibilityState() {
+  const [isVisible, setIsVisible] = useState(true);
+
+  useEffect(() => {
+    const handleVisibilityChange = () => {
+      setIsVisible(document.visibilityState === 'visible');
+    };
+
+    document.addEventListener('visibilitychange', handleVisibilityChange);
+
+    handleVisibilityChange(); // Initial check on component mount
+
+    return () => {
+      document.removeEventListener('visibilitychange', handleVisibilityChange);
+    };
+  }, []);
+
+  return isVisible;
+}