feat: Internationalize turnstile widget

playground/pages/index.vue

@@ -1,17 +1,25 @@
 <template>
   <div>
     <NuxtLink id="home-link" to="/home">to /home</NuxtLink>
+    <div>
+      <label for="language">Select Turnstile Language : </label>
+      <select id="language" v-model="selectedLanguage">
+        <option v-for="lang in languages" :key="lang" :value="lang">{{ lang }}</option>
+      </select>
+    </div>
     <button @click="toggle = !toggle">Load Turnstiles</button>
     <form @submit.prevent="onSubmit">
       <h2>Using vue model</h2>
-      <NuxtTurnstile v-if="toggle" v-model="token" :options="{ action: 'vue' }" />
+      <NuxtTurnstile v-if="toggle" :key="selectedLanguage" v-model="token"
+        :options="{ action: 'vue', language: selectedLanguage }" />
       <input type="submit" />
     </form>
     <pre>{{ response1 }}</pre>
     <hr />
     <form @submit.prevent="onNativeSubmit">
       <h2>Using native form</h2>
-      <NuxtTurnstile v-if="toggle" ref="turnstile" :options="{ action: 'native' }" />
+      <NuxtTurnstile v-if="toggle" :key="selectedLanguage" ref="turnstile"
+        :options="{ action: 'native', language: selectedLanguage }" />
       <input type="submit" />
     </form>
     <button :disabled="!turnstile" @click="turnstile.reset()">Reset</button>
@@ -20,6 +28,9 @@
 </template>
 
 <script setup lang="ts">
+const selectedLanguage = ref('en')
+const languages = ['en', 'de', 'fr']
+
 const toggle = ref(false)
 const token = ref()
 

src/runtime/types.ts

@@ -22,6 +22,11 @@ export interface TurnstileRenderOptions {
    * A customer payload that can be used to attach customer data to the challenge throughout its issuance and which is returned upon validation.
    */
   cData?: any
+  /**
+   * A custom language setting. Use 'auto' (default) for the visitor's chosen language, ISO 639-1 two-letter language code (e.g., en), or language and country code (e.g., en-US).
+   * Consult the list of supported languages: https://developers.cloudflare.com/turnstile/reference/supported-languages/
+   */
+  language?: string
   /**
    * A JavaScript callback that is invoked upon success of the challenge. The callback is passed a token that can be validated.
    */