authtara-sdk 1.1.21 → 1.1.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/react.js +30 -24
  2. package/dist/react.mjs +30 -24
  3. package/package.json +1 -1
package/dist/react.js CHANGED
@@ -280,10 +280,37 @@ function AuthTaraAuth({
280
280
  const [error, setError] = React2.useState(null);
281
281
  const [isCredentialsLoading, setIsCredentialsLoading] = React2.useState(false);
282
282
  const [turnstileToken, setTurnstileToken] = React2.useState(null);
283
- const turnstileRef = React2.useRef(null);
283
+ const turnstileContainerRef = React2.useRef(null);
284
+ const turnstileWidgetId = React2.useRef(null);
284
285
  const [email, setEmail] = React2.useState("");
285
286
  const [password, setPassword] = React2.useState("");
286
287
  const isLoading = oauthLoading || isCredentialsLoading;
288
+ const isDark = appearance?.theme === "dark";
289
+ React2.useEffect(() => {
290
+ if (!turnstileSiteKey || !turnstileContainerRef.current) return;
291
+ if (typeof window === "undefined" || !window.turnstile) return;
292
+ if (turnstileWidgetId.current) return;
293
+ const widgetId = window.turnstile.render(turnstileContainerRef.current, {
294
+ sitekey: turnstileSiteKey,
295
+ theme: isDark ? "dark" : "light",
296
+ callback: (token) => setTurnstileToken(token),
297
+ "expired-callback": () => setTurnstileToken(null),
298
+ "error-callback": () => setTurnstileToken(null)
299
+ });
300
+ turnstileWidgetId.current = widgetId;
301
+ return () => {
302
+ if (turnstileWidgetId.current && window.turnstile) {
303
+ window.turnstile.remove(turnstileWidgetId.current);
304
+ turnstileWidgetId.current = null;
305
+ }
306
+ };
307
+ }, [turnstileSiteKey, isDark]);
308
+ function resetTurnstile() {
309
+ if (turnstileWidgetId.current && window.turnstile) {
310
+ window.turnstile.reset(turnstileWidgetId.current);
311
+ setTurnstileToken(null);
312
+ }
313
+ }
287
314
  async function handleOAuthSignIn(selectedProvider) {
288
315
  setError(null);
289
316
  try {
@@ -332,13 +359,11 @@ function AuthTaraAuth({
332
359
  const message = err instanceof Error ? err.message : "Authentication failed";
333
360
  setError(message);
334
361
  onError?.(err);
335
- turnstileRef.current?.reset();
336
- setTurnstileToken(null);
362
+ resetTurnstile();
337
363
  } finally {
338
364
  setIsCredentialsLoading(false);
339
365
  }
340
366
  }
341
- const isDark = appearance?.theme === "dark";
342
367
  const cardBgColor = isDark ? "#111111" : "#ffffff";
343
368
  const cardBorderColor = isDark ? "#222222" : "#e5e7eb";
344
369
  const textColor = isDark ? "#ffffff" : "#111827";
@@ -553,26 +578,7 @@ function AuthTaraAuth({
553
578
  }
554
579
  )
555
580
  ] }),
556
- turnstileSiteKey && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { display: "flex", justifyContent: "center", marginTop: "0.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
557
- "div",
558
- {
559
- id: "turnstile-widget",
560
- ref: (el) => {
561
- if (el && typeof window !== "undefined" && window.turnstile) {
562
- window.turnstile.render(el, {
563
- sitekey: turnstileSiteKey,
564
- theme: isDark ? "dark" : "light",
565
- callback: (token) => setTurnstileToken(token),
566
- "expired-callback": () => setTurnstileToken(null),
567
- "error-callback": () => setTurnstileToken(null)
568
- });
569
- turnstileRef.current = {
570
- reset: () => window.turnstile.reset(el)
571
- };
572
- }
573
- }
574
- }
575
- ) }),
581
+ turnstileSiteKey && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { style: { display: "flex", justifyContent: "center", marginTop: "0.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { ref: turnstileContainerRef }) }),
576
582
  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
577
583
  "button",
578
584
  {
package/dist/react.mjs CHANGED
@@ -244,10 +244,37 @@ function AuthTaraAuth({
244
244
  const [error, setError] = React2.useState(null);
245
245
  const [isCredentialsLoading, setIsCredentialsLoading] = React2.useState(false);
246
246
  const [turnstileToken, setTurnstileToken] = React2.useState(null);
247
- const turnstileRef = React2.useRef(null);
247
+ const turnstileContainerRef = React2.useRef(null);
248
+ const turnstileWidgetId = React2.useRef(null);
248
249
  const [email, setEmail] = React2.useState("");
249
250
  const [password, setPassword] = React2.useState("");
250
251
  const isLoading = oauthLoading || isCredentialsLoading;
252
+ const isDark = appearance?.theme === "dark";
253
+ React2.useEffect(() => {
254
+ if (!turnstileSiteKey || !turnstileContainerRef.current) return;
255
+ if (typeof window === "undefined" || !window.turnstile) return;
256
+ if (turnstileWidgetId.current) return;
257
+ const widgetId = window.turnstile.render(turnstileContainerRef.current, {
258
+ sitekey: turnstileSiteKey,
259
+ theme: isDark ? "dark" : "light",
260
+ callback: (token) => setTurnstileToken(token),
261
+ "expired-callback": () => setTurnstileToken(null),
262
+ "error-callback": () => setTurnstileToken(null)
263
+ });
264
+ turnstileWidgetId.current = widgetId;
265
+ return () => {
266
+ if (turnstileWidgetId.current && window.turnstile) {
267
+ window.turnstile.remove(turnstileWidgetId.current);
268
+ turnstileWidgetId.current = null;
269
+ }
270
+ };
271
+ }, [turnstileSiteKey, isDark]);
272
+ function resetTurnstile() {
273
+ if (turnstileWidgetId.current && window.turnstile) {
274
+ window.turnstile.reset(turnstileWidgetId.current);
275
+ setTurnstileToken(null);
276
+ }
277
+ }
251
278
  async function handleOAuthSignIn(selectedProvider) {
252
279
  setError(null);
253
280
  try {
@@ -296,13 +323,11 @@ function AuthTaraAuth({
296
323
  const message = err instanceof Error ? err.message : "Authentication failed";
297
324
  setError(message);
298
325
  onError?.(err);
299
- turnstileRef.current?.reset();
300
- setTurnstileToken(null);
326
+ resetTurnstile();
301
327
  } finally {
302
328
  setIsCredentialsLoading(false);
303
329
  }
304
330
  }
305
- const isDark = appearance?.theme === "dark";
306
331
  const cardBgColor = isDark ? "#111111" : "#ffffff";
307
332
  const cardBorderColor = isDark ? "#222222" : "#e5e7eb";
308
333
  const textColor = isDark ? "#ffffff" : "#111827";
@@ -517,26 +542,7 @@ function AuthTaraAuth({
517
542
  }
518
543
  )
519
544
  ] }),
520
- turnstileSiteKey && /* @__PURE__ */ jsx2("div", { style: { display: "flex", justifyContent: "center", marginTop: "0.5rem" }, children: /* @__PURE__ */ jsx2(
521
- "div",
522
- {
523
- id: "turnstile-widget",
524
- ref: (el) => {
525
- if (el && typeof window !== "undefined" && window.turnstile) {
526
- window.turnstile.render(el, {
527
- sitekey: turnstileSiteKey,
528
- theme: isDark ? "dark" : "light",
529
- callback: (token) => setTurnstileToken(token),
530
- "expired-callback": () => setTurnstileToken(null),
531
- "error-callback": () => setTurnstileToken(null)
532
- });
533
- turnstileRef.current = {
534
- reset: () => window.turnstile.reset(el)
535
- };
536
- }
537
- }
538
- }
539
- ) }),
545
+ turnstileSiteKey && /* @__PURE__ */ jsx2("div", { style: { display: "flex", justifyContent: "center", marginTop: "0.5rem" }, children: /* @__PURE__ */ jsx2("div", { ref: turnstileContainerRef }) }),
540
546
  /* @__PURE__ */ jsx2(
541
547
  "button",
542
548
  {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "authtara-sdk",
3
- "version": "1.1.21",
3
+ "version": "1.1.22",
4
4
  "description": "SDK Client untuk integrasi dengan DigitalSolution Platform - SSO, Billing, dan Metering",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",