feat(javascript): add i18n to wrapper

.changeset/sharp-pears-teach.md

@@ -0,0 +1,5 @@
+---
+'@flatfile/javascript': minor
+---
+
+Add internationalization support with detected browser language or given override language.

apps/vanilla/config.js

@@ -3,6 +3,16 @@ export const config = {
   labels: ['pinned'],
   sheets: [
     {
+      actions: [
+        {
+          operation: 'customAction',
+          mode: 'foreground',
+          label: 'Custom Action',
+          icon: 'none',
+          description: 'Do something custom',
+          primary: true,
+        },
+      ],
       name: 'Contacts',
       slug: 'contacts',
       allowAdditionalFields: true,

apps/vanilla/index.html

@@ -15,6 +15,30 @@
     <button onclick="initializeFlatfile('pk_123456')">
       Open "On Demand" Flatfile
     </button>
+
+    <label>Override language:</label>
+    <select id="override-language">
+      <option selected value=""></option>
+      <option value="de">de</option>
+      <option value="en">en</option>
+      <option value="en-GB">en-GB</option>
+      <option value="en-CA">en-CA</option>
+      <option value="en-ZA">en-ZA</option>
+      <option value="es">es</option>
+      <option value="fr">fr</option>
+      <option value="fr-CA">fr-CA</option>
+      <option value="fr-FR">fr-FR</option>
+      <option value="id">id</option>
+      <option value="it">it</option>
+      <option value="jp">jp</option>
+      <option value="kr">kr</option>
+      <option value="pt">pt</option>
+      <option value="pt-BR">pt-BR</option>
+      <option value="tr">tr</option>
+      <option value="vi">vi</option>
+      <option value="zh">zh</option>
+    </select>
+
     <script>
       window.addEventListener('load', (event) => {
         preloadFlatfile()

apps/vanilla/main.js

@@ -2,6 +2,16 @@ import { createIframe, initializeFlatfile } from '@flatfile/javascript'
 
 import { config } from './config'
 import { listener } from './listener'
+
+const overrideLanguageSelect = document.getElementById('override-language')
+overrideLanguageSelect.addEventListener('change', () => {
+  localStorage.setItem('overrideLanguage', overrideLanguageSelect.value)
+})
+const overrideLanguage = localStorage.getItem('overrideLanguage')
+if (overrideLanguage) {
+  overrideLanguageSelect.value = overrideLanguage
+}
+
 /*
 // ---Get a space to reuse it, load automatically
 const flatfile = new FlatfileClient({
@@ -33,6 +43,7 @@ getSpace()
 */
 
 const BASE_OPTIONS = {
+  languageOverride: overrideLanguageSelect.value,
   spaceBody: { name: 'Hello' },
   // listener,
   // Additional parameters...