cloudflare-turnstile-widget

import type { BridgeInfo, WidgetEventDetail } from './TurnstileWidget.js'; export declare class TurnstileWidgetFrame extends HTMLElement { private static _currentIdentifier?; static get currentIdentifier(): string | undefined; private static set currentIdentifier(value); get siteKey(): string | null; set siteKey(value: string | null); get theme(): TurnstileTheme | null; set theme(value: TurnstileTheme | null); get size(): TurnstileSize | null; set size(value: TurnstileSize | null); get retry(): TurnstileRetry | null; set retry(value: TurnstileRetry | null); get refreshExpired(): RefreshExpired | null; set refreshExpired(value: RefreshExpired | null); /** * Initializes the component. * * @hideconstructor */ constructor(); /** * Setup the component once added to the DOM. */ connectedCallback(): void; /** * Send a bridged message to the hosting application frame as a widget. * * @param identifier Identifier to represent widget. * @param eventName Name of event to send to application. * @param detail Custom detail to attach as event detail. * @param callback (Optional) Callback function to invoke on widget response. * @param timeout (Optional) Duration to wait for callback. * @param timeoutCallback (Optional) Callback function to invoke if response timeout is exceeded * @param callbackIdentifierPrefix (Optional) Prefix to apply on generated widget callback id */ static messageApplication<T, U = any>(identifier: string, eventName: string, detail?: T, callback?: (detail: U) => void, timeout?: number, timeoutCallback?: () => void, callbackIdentifierPrefix?: string): void; /** * Generate a unique identifier string */ static uuidv4(): string; /** * Asynchronously sends a bridged message to the hosting application frame as a widget, then awaits and returns its response. * @param identifier Identifier to represent widget. * @param eventName The event this message correlates to. * @param detail Custom detail to attach as event detail. * @param timeout (Optional) Duration to wait for before rejecting the promise. If not specified, will wait indefinitely. * @param callbackIdentifierPrefix (Optional) Prefix to apply on generated widget callback id */ static messageApplicationAsync<T, U = any>(identifier: string, eventName: string, detail: T, timeout?: number, callbackIdentifierPrefix?: string): Promise<U>; /** * Set up a callback for the `frame-load` event from the widget component in a hosting application. * Can be used by a widget application to retrieve its identifier from the widget component. * @param frameLoaded The callback to invoke when the `frame-load` event occurs. */ static initialize(frameLoaded: (identifier: string) => void): void; /** * Set up a callback for the specified event from the widget component in a hosting application. * @param eventName The event name to listen for when receiving bridged messages. * @param listener The callback to invoke when the specified event occurs. * @returns Event listener instance that can be used to remove the listener via `Widget.removeEventListener` */ static addEventListener<T = any, U = any>(eventName: string, listener: (event: WidgetEventDetail<T, U>) => void): (event: MessageEvent<BridgeInfo<T>>) => void; /** * Remove the listener from the widget component in a hosting application. * @param messageListener The listener instance created by `Widget.addEventListener` to remove */ static removeEventListener<T = any>(messageListener: (event: MessageEvent<BridgeInfo<T>>) => void): void; } declare global { const turnstile: Turnstile; interface HTMLElementTagNameMap { 'turnstile-widget-frame': TurnstileWidgetFrame; } interface Window { turnstile?: Turnstile; } interface Turnstile { /** * The ready function will be invoked once the DOM is ready, at this point the turnstile can be rendered. * @param callback * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#explicitly-render-the-turnstile-widget */ ready(callback: () => void): void; /** * The render function takes an argument to a HTML widget. * If the invocation is successful, the function returns a widgetId (string). * If the invocation is unsuccessful, the function returns undefined. * @param container * @param params * @returns * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#explicitly-render-the-turnstile-widget */ render: (container?: string | HTMLElement, params?: RenderOptions) => string | undefined; } interface RenderOptions { /** * Every widget has a sitekey. This sitekey is associated with the corresponding widget configuration and is created upon the widget creation. * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations */ sitekey: string; /** * A callback invoked upon success of the turnstile challenge. The callback is passed a token that can be validated. * @param token * @returns * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations */ callback?: (token: string) => void; /** * A callback invoked when there is an error (e.g. network error or the challenge failed). Refer to {@link https://developers.cloudflare.com/turnstile/reference/client-side-errors client-side errors}. * @param errorCode * @returns * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations */ 'error-callback'?: (errorCode: unknown) => void; /** * A callback invoked when the token expires and does not reset the widget. * @returns * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations */ 'expired-callback'?: () => void; /** * A callback invoked when a given client/browser is not supported by Turnstile. * @returns * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations */ 'unsupported-callback'?: () => void; /** * The widget theme. Can take the following values: light, dark, auto. * The default is auto, which respects the user preference. This can be forced to light or dark by setting the theme accordingly. * @default 'auto' */ theme?: TurnstileTheme; /** * The widget size. Can take the following values: normal, compact. * Normal is 300px by 65px, and compact is 130px by 120px. * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#widget-size * @default 'normal' */ size?: TurnstileSize; /** * Controls whether the widget should automatically retry to obtain a token if it did not succeed. * The default is auto, which will retry automatically. This can be set to never to disable retry upon failure. * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations * @default 'auto' */ retry?: TurnstileRetry; /** * When retry is set to auto, retry-interval controls the time between retry attempts in milliseconds. * Value must be a positive integer less than 900000, defaults to 8000. * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations * @default 8000 */ 'retry-interval'?: number; /** * Automatically refreshes the token when it expires. Can take auto, manual or never, defaults to auto. * @see https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations * @default 'auto' */ 'refresh-expired'?: RefreshExpired; } type TurnstileTheme = 'auto' | 'light' | 'dark'; type TurnstileSize = 'normal' | 'compact'; type TurnstileRetry = 'auto' | 'never'; type RefreshExpired = 'auto' | 'manual' | 'never'; } //# sourceMappingURL=TurnstileWidgetFrame.d.ts.map