|
1 | 1 | <script context="module" lang="ts">
|
| 2 | + // Credit for the type defs go to @Le0Developer |
| 3 | + // https://github.com/Le0Developer/react-turnstile/blob/420eddf1e0bde2ad593dd78bd99b8f134ce8a754/src/index.tsx#L139 |
| 4 | +
|
2 | 5 | declare global {
|
3 | 6 | interface Window {
|
4 |
| - onloadTurnstileCallback: () => void; |
5 | 7 | turnstile: {
|
6 | 8 | render: (
|
7 | 9 | element: string | HTMLElement,
|
8 | 10 | options: TurnstileOptions,
|
9 | 11 | ) => string;
|
10 | 12 | reset: (widgetId: string) => void;
|
11 | 13 | getResponse: (widgetId: string) => string | undefined;
|
| 14 | + remove: (widgetId: string) => void; |
12 | 15 | };
|
13 | 16 | }
|
14 | 17 | }
|
|
22 | 25 | 'expired-callback'?: () => void;
|
23 | 26 | theme?: TurnstileTheme;
|
24 | 27 | tabindex?: number;
|
| 28 | +
|
| 29 | + // Undocumented Fields - not implemented in svelte-turnstile yet |
| 30 | + size?: 'normal' | 'invisible' | 'compact'; |
| 31 | + 'response-field'?: boolean; |
| 32 | + 'response-field-name'?: string; |
25 | 33 | }
|
26 | 34 |
|
27 | 35 | export type TurnstileTheme = 'light' | 'dark' | 'auto';
|
28 | 36 | </script>
|
29 | 37 |
|
30 | 38 | <script lang="ts">
|
31 | 39 | import { createEventDispatcher } from 'svelte';
|
| 40 | + import type { Action } from 'svelte/action'; |
32 | 41 | import { onMount } from 'svelte';
|
33 | 42 |
|
34 | 43 | const dispatch = createEventDispatcher<{
|
|
78 | 87 | dispatch('turnstile-callback', { token });
|
79 | 88 | }
|
80 | 89 |
|
81 |
| - const turnstile = (node: HTMLElement) => { |
82 |
| - widgetId = window.turnstile.render(node, { |
| 90 | + const turnstile: Action = (node) => { |
| 91 | + const id = window.turnstile.render(node, { |
83 | 92 | 'expired-callback': expired,
|
84 | 93 | 'error-callback': error,
|
85 | 94 | callback,
|
|
91 | 100 | theme,
|
92 | 101 | cData,
|
93 | 102 | });
|
| 103 | +
|
| 104 | + widgetId = id; |
| 105 | +
|
| 106 | + return { |
| 107 | + destroy: () => { |
| 108 | + window.turnstile.remove(id); |
| 109 | + }, |
| 110 | + }; |
94 | 111 | };
|
95 | 112 | </script>
|
96 | 113 |
|
|
0 commit comments