From 6811bce86fa99dd5d7f714ca485d8996514a106f Mon Sep 17 00:00:00 2001
From: Luis Marsiglia <marsiglia.business@gmail.com>
Date: Mon, 8 Jan 2024 13:02:41 -0400
Subject: [PATCH] feat: Add `onWidgetLoad` callback

fix #45
---
 docs/props.mdx            | 1 +
 packages/lib/src/lib.tsx  | 5 ++++-
 packages/lib/src/types.ts | 5 +++++
 3 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/docs/props.mdx b/docs/props.mdx
index 17c714a..9992328 100644
--- a/docs/props.mdx
+++ b/docs/props.mdx
@@ -11,6 +11,7 @@ These are the props you can pass to the `Turnstile` component.
 | `siteKey`       | string   | Your sitekey key, get one from [here](https://developers.cloudflare.com/turnstile/get-started/).                                                                                                                                                                                                                                       | ✅            |
 | ``options``     | object   | Widget render options. More info about this options [below](/props#options-prop).                                                                                                                                                                                                                                                      |              |
 | `scriptOptions` | object   | You can customize the injected `script` tag with this prop. It allows you to add `'async'`, `'defer'`, `'nonce'` attributes to the script tag. You can also control whether the injected script will be added to the document body or head with `appendTo` attribute. More info about this options [below](/props#scriptoptions-prop). |              |
+| `onWidgetLoad`     | function | Callback invoked when the widget is loaded or reloaded (e.g. after a reset).                                                                                                                                                                                                                     |              |
 | `onSuccess`     | function | Callback invoked upon success of the challenge. The callback is passed a token that can be validated.                                                                                                                                                                                                                          |              |
 | `onExpire`      | function | Callback invoked when a challenge expires. Read the [Cloudflare docs](https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#refreshing-a-widget) for more info about handling expired widgets.                                                                                                        |              |
 | `onError`         | function | Callback invoked when there is an error (e.g. network error or the challenge failed). Refer to [Client-side errors](https://developers.cloudflare.com/turnstile/reference/client-side-errors).                                                                                                                                                                                                                                                                                |              |
diff --git a/packages/lib/src/lib.tsx b/packages/lib/src/lib.tsx
index 55ae000..0f6bb68 100644
--- a/packages/lib/src/lib.tsx
+++ b/packages/lib/src/lib.tsx
@@ -17,6 +17,7 @@ export const Turnstile = forwardRef<TurnstileInstance | undefined, TurnstileProp
 		scriptOptions,
 		options = {},
 		siteKey,
+		onWidgetLoad,
 		onSuccess,
 		onExpire,
 		onError,
@@ -244,10 +245,12 @@ export const Turnstile = forwardRef<TurnstileInstance | undefined, TurnstileProp
 		if (!widgetId) return
 		if (!checkElementExistence(widgetId)) return
 
+		onWidgetLoad?.(widgetId)
+
 		return () => {
 			window.turnstile!.remove(widgetId)
 		}
-	}, [widgetId])
+	}, [widgetId, onWidgetLoad])
 
 	useEffect(() => {
 		setContainerStyle(
diff --git a/packages/lib/src/types.ts b/packages/lib/src/types.ts
index 32dec1e..8be780f 100644
--- a/packages/lib/src/types.ts
+++ b/packages/lib/src/types.ts
@@ -299,6 +299,11 @@ interface TurnstileProps extends React.HTMLAttributes<HTMLDivElement> {
 	 */
 	siteKey: RenderOptions['sitekey']
 
+	/**
+	 * Callback invoked when the widget is loaded or reloaded (e.g. after a reset).
+	 */
+	onWidgetLoad?: (widgetID: string) => void
+
 	/**
 	 * Callback invoked upon success of the challenge. The callback is passed a token that can be validated.
 	 * @param token - Token response.