react-google-recaptcha-hook - npm Package Compare versions

Comparing version 0.2.1 to 0.2.2

dist/react-google-recaptcha-hook.cjs.js

@@ -1,1 +0,1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var r=require("react");const h=()=>{var c;typeof window.grecaptcha=="undefined"&&((c=window.___grecaptcha_cfg)!=null||(window.___grecaptcha_cfg={fns:[]}),window.grecaptcha={ready:e=>{window.___grecaptcha_cfg.fns.push(e)},enterprise:{ready:e=>{window.___grecaptcha_cfg.fns.push(e)}}})},w=c=>new Promise(e=>{h(),c?window.grecaptcha.enterprise.ready(()=>e(window.grecaptcha.enterprise)):window.grecaptcha.ready(()=>e(window.grecaptcha))}),i=()=>{h(),window.grecaptcha.ready(()=>{document.querySelector(".grecaptcha-badge").style.visibility="hidden"})},f=()=>{h(),window.grecaptcha.ready(()=>{document.querySelector(".grecaptcha-badge").style.visibility="visible"})},p=(c,e)=>{const n=e!=null&&e.language?`&hl=${e.language}`:"",t=e!=null&&e.enterprise?"enterprise.js":"api.js";return`https://www.${e!=null&&e.recaptchaNet?"recaptcha.net":"google.com"}/recaptcha/${t}?render=${c}${n}`},y=(c,e)=>{const n=r.useCallback(()=>{if(document.getElementById(c))return;const a=document.createElement("script");a.async=!0,a.type="text/javascript",a.src=p(c,e),a.id=c,document.getElementsByTagName("head")[0].appendChild(a)},[]),t=r.useCallback(i,[]),u=r.useCallback(f,[]),s=r.useCallback(async a=>{var l;const d=await w(e==null?void 0:e.enterprise);return(l=d.execute)==null?void 0:l.call(d,c,{action:a})},[]),g=r.useRef(!1);return r.useEffect(()=>{g.current||(g.current=!0,e!=null&&e.hide&&t(),n())},[n,t,e]),{executeGoogleReCaptcha:s,hideGoogleReCaptcha:t,showGoogleReCaptcha:u}};exports.useGoogleReCaptcha=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var h=require("react");const w=()=>{var c;(c=window.___grecaptcha_cfg)!=null||(window.___grecaptcha_cfg={fns:[]})},g=c=>new Promise(e=>{var a;w(),c?(a=window==null?void 0:window.grecaptcha)!=null&&a.enterprise?e(window.grecaptcha.enterprise):window.___grecaptcha_cfg.fns.push(()=>e(window.grecaptcha.enterprise)):window!=null&&window.grecaptcha?e(window.grecaptcha):window.___grecaptcha_cfg.fns.push(()=>e(window.grecaptcha))}),n=async(c,e,a)=>(await g(c)).execute(e,{action:a}),f=async c=>{(await g(c)).ready(()=>{const a=document.querySelector(".grecaptcha-badge");a&&(a.style.visibility="hidden")})},s=async c=>{(await g(c)).ready(()=>{const a=document.querySelector(".grecaptcha-badge");a&&(a.style.visibility="visible")})},_=(c,e)=>{const a=e!=null&&e.language?`&hl=${e.language}`:"",t=e!=null&&e.enterprise?"enterprise.js":"api.js";return`https://www.${e!=null&&e.recaptchaNet?"recaptcha.net":"google.com"}/recaptcha/${t}?render=${c}${a}`},b=(c,e)=>{const a=h.useCallback(()=>{if(document.getElementById(c))return;const r=document.createElement("script");r.async=!0,r.type="text/javascript",r.src=_(c,e),r.id=c,document.getElementsByTagName("head")[0].appendChild(r)},[e,c]),t=h.useCallback(()=>f(!!(e!=null&&e.enterprise)),[e==null?void 0:e.enterprise]),u=h.useCallback(()=>s(!!(e!=null&&e.enterprise)),[e==null?void 0:e.enterprise]),l=h.useCallback(r=>n(!!(e!=null&&e.enterprise),c,r),[e==null?void 0:e.enterprise,c]),d=h.useRef(!1);return h.useEffect(()=>{d.current||(d.current=!0,e!=null&&e.hide&&t(),a())},[a,t,e]),{executeGoogleReCaptcha:l,hideGoogleReCaptcha:t,showGoogleReCaptcha:u}};exports.useGoogleReCaptcha=b;

dist/react-google-recaptcha-hook.es.js

 import { useCallback, useRef, useEffect } from "react";
 const initGrecaptcha = () => {
   var _a;
-  if (typeof window.grecaptcha === "undefined") {
-    (_a = window.___grecaptcha_cfg) != null ? _a : window.___grecaptcha_cfg = {
-      fns: []
-    };
-    window.grecaptcha = {
-      ready: (callback) => {
-        window.___grecaptcha_cfg.fns.push(callback);
-      },
-      enterprise: {
-        ready: (callback) => {
-          window.___grecaptcha_cfg.fns.push(callback);
-        }
-      }
-    };
-  }
+  (_a = window.___grecaptcha_cfg) != null ? _a : window.___grecaptcha_cfg = {
+    fns: []
+  };
 };
 const getGrecaptcha = (enterprise) => new Promise((resolve) => {
+  var _a;
   initGrecaptcha();
   if (enterprise) {
-    window.grecaptcha.enterprise.ready(() => resolve(window.grecaptcha.enterprise));
+    ((_a = window == null ? void 0 : window.grecaptcha) == null ? void 0 : _a.enterprise) ? resolve(window.grecaptcha.enterprise) : window.___grecaptcha_cfg.fns.push(() => resolve(window.grecaptcha.enterprise));
   } else {
-    window.grecaptcha.ready(() => resolve(window.grecaptcha));
+    (window == null ? void 0 : window.grecaptcha) ? resolve(window.grecaptcha) : window.___grecaptcha_cfg.fns.push(() => resolve(window.grecaptcha));
   }
 });
-const hideGrecaptcha = () => {
-  initGrecaptcha();
-  window.grecaptcha.ready(() => {
-    document.querySelector(".grecaptcha-badge").style.visibility = "hidden";
+const executeGrecaptcha = async (enterprise, siteKey, action) => {
+  const grecaptcha = await getGrecaptcha(enterprise);
+  return grecaptcha.execute(siteKey, { action });
+};
+const hideGrecaptcha = async (enterprise) => {
+  const grecaptcha = await getGrecaptcha(enterprise);
+  grecaptcha.ready(() => {
+    const badge = document.querySelector(".grecaptcha-badge");
+    if (badge)
+      badge.style.visibility = "hidden";
   });
 };
-const showGrecaptcha = () => {
-  initGrecaptcha();
-  window.grecaptcha.ready(() => {
-    document.querySelector(".grecaptcha-badge").style.visibility = "visible";
+const showGrecaptcha = async (enterprise) => {
+  const grecaptcha = await getGrecaptcha(enterprise);
+  grecaptcha.ready(() => {
+    const badge = document.querySelector(".grecaptcha-badge");
+    if (badge)
+      badge.style.visibility = "visible";
   });
@@ -56,10 +53,6 @@ };
     document.getElementsByTagName("head")[0].appendChild(script);
-  }, []);
-  const hideGoogleReCaptcha = useCallback(hideGrecaptcha, []);
-  const showGoogleReCaptcha = useCallback(showGrecaptcha, []);
-  const executeGoogleReCaptcha = useCallback(async (action) => {
-    var _a;
-    const grecaptcha = await getGrecaptcha(options == null ? void 0 : options.enterprise);
-    return (_a = grecaptcha.execute) == null ? void 0 : _a.call(grecaptcha, siteKey, { action });
-  }, []);
+  }, [options, siteKey]);
+  const hideGoogleReCaptcha = useCallback(() => hideGrecaptcha(!!(options == null ? void 0 : options.enterprise)), [options == null ? void 0 : options.enterprise]);
+  const showGoogleReCaptcha = useCallback(() => showGrecaptcha(!!(options == null ? void 0 : options.enterprise)), [options == null ? void 0 : options.enterprise]);
+  const executeGoogleReCaptcha = useCallback((action) => executeGrecaptcha(!!(options == null ? void 0 : options.enterprise), siteKey, action), [options == null ? void 0 : options.enterprise, siteKey]);
   const oneTimeRef = useRef(false);
@@ -66,0 +59,0 @@ useEffect(() => {

package.json

@@ -20,3 +20,3 @@ {
   "license": "MIT",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "files": [
@@ -39,3 +39,7 @@ "dist",
     "coverage": "vitest run --coverage",
+    "lint": "npm run lint:eslint; npm run lint:prettier",
+    "lint:eslint": "eslint . --ignore-path .gitignore",
     "lint:prettier": "prettier . --check --ignore-path .gitignore",
+    "fix": "npm run fix:eslint; npm run fix:prettier",
+    "fix:eslint": "eslint . --fix --ignore-path .gitignore",
     "fix:prettier": "prettier . --write --ignore-path .gitignore",
@@ -62,4 +66,10 @@ "storybook": "start-storybook -p 6006",
     "@types/react-dom": "^18.0.5",
+    "@typescript-eslint/eslint-plugin": "^5.27.0",
+    "@typescript-eslint/parser": "^5.27.0",
     "@vitejs/plugin-react": "^1.3.2",
     "c8": "^7.11.3",
+    "eslint": "^8.17.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-react": "^7.30.0",
+    "eslint-plugin-react-hooks": "^4.5.0",
     "happy-dom": "^4.1.0",
@@ -66,0 +76,0 @@ "husky": "^8.0.1",

README.md

@@ -34,10 +34,8 @@ # React Hook for Google reCAPTCHA V3
   // execute reCAPTCHA with action, return torken
-  // (action: string) => Promise<string>
+  // async (action: string) => Promise<string>
   executeGoogleReCaptcha,
-  // show recaptcha-badge
-  // () => void
+  // hide / show recaptcha-badge
+  // async () => Promise<void>
+  hideGoogleReCaptcha,
   showGoogleReCaptcha,
-  // hide recaptcha-badge
-  // () => void
-  hideGoogleReCaptcha,
 } = useGoogleReCaptcha(
@@ -44,0 +42,0 @@ `${YOUR_SITE_KEY}`, // your site key

types/functions.d.ts

@@ -6,5 +6,6 @@ import { ReCaptcha } from "./useGoogleRecaptcha";
 export declare const initGrecaptcha: () => void;
-export declare const getGrecaptcha: (enterprise?: boolean) => Promise<ReCaptcha>;
-export declare const hideGrecaptcha: () => void;
-export declare const showGrecaptcha: () => void;
+export declare const getGrecaptcha: (enterprise: boolean) => Promise<ReCaptcha>;
+export declare const executeGrecaptcha: (enterprise: boolean, siteKey: string, action: string) => Promise<string>;
+export declare const hideGrecaptcha: (enterprise: boolean) => Promise<void>;
+export declare const showGrecaptcha: (enterprise: boolean) => Promise<void>;
 export declare const generateGrecaptchaSrc: (siteKey: string, options?: {
@@ -11,0 +12,0 @@ language?: string;

types/useGoogleRecaptcha.d.ts

@@ -12,3 +12,3 @@ declare global {
 export declare type ReCaptcha = {
-    execute?(siteKey: string, options: {
+    execute(siteKey: string, options: {
         action: string;
@@ -24,6 +24,6 @@ }): PromiseLike<string>;
 }) => {
-    executeGoogleReCaptcha: (action: string) => Promise<string | undefined>;
-    hideGoogleReCaptcha: () => void;
-    showGoogleReCaptcha: () => void;
+    executeGoogleReCaptcha: (action: string) => Promise<string>;
+    hideGoogleReCaptcha: () => Promise<void>;
+    showGoogleReCaptcha: () => Promise<void>;
 };
 //# sourceMappingURL=useGoogleRecaptcha.d.ts.map

No alert changes

Improved metrics

Total package byte prevSize

13022

increased by10.63%

Worsened metrics

Dev dependency count

27

increased by28.57%

Lines of code

120

decreased by-4.76%

Number of lines in readme file

56

decreased by-3.45%

No dependency changes