@worldcoin/idkit 2.3.0 → 2.4.1

package/build/index.cjs

@@ -33,6 +33,10 @@ __export(src_exports, {
   IDKitWidget: () => IDKitWidget_default,
   VerificationLevel: () => import_idkit_core7.VerificationLevel,
   VerificationState: () => import_idkit_core7.VerificationState,
+  getCurrentLanguage: () => getCurrentLanguage,
+  getLocalizationConfig: () => getLocalizationConfig,
+  getSupportedLanguages: () => getSupportedLanguages,
+  setLocalizationConfig: () => setLocalizationConfig,
   solidityEncode: () => import_hashing.solidityEncode,
   useIDKit: () => useIDKit_default,
   useSession: () => useSession,
@@ -43,21 +47,157 @@ module.exports = __toCommonJS(src_exports);
 // src/hooks/useIDKit.ts
 var import_react = require("react");
 
+// src/lang/translations/en.ts
+var en = {
+  "All set!": "All set!",
+  "Your World ID is now connected": "Your World ID is now connected",
+  "Transmitting verification to host app. Please wait...": "Transmitting verification to host app. Please wait...",
+  "Something went wrong": "Something went wrong",
+  "Verification Declined": "Verification Declined",
+  "Request cancelled": "Request cancelled",
+  "Connection to your wallet failed. Please try again.": "Connection to your wallet failed. Please try again.",
+  "You've cancelled the request in World App.": "You've cancelled the request in World App.",
+  "You have already verified the maximum number of times for this action.": "You have already verified the maximum number of times for this action.",
+  "It seems you do not have the verification level required by this app.": "It seems you do not have the verification level required by this app.",
+  "Invalid network. If you are the app owner, visit docs.world.org/test for details.": "Invalid network. If you are the app owner, visit docs.world.org/test for details.",
+  "Your identity is still being registered. Please wait a few minutes and try again.": "Your identity is still being registered. Please wait a few minutes and try again.",
+  "We couldn't complete your request. Please try again.": "We couldn't complete your request. Please try again.",
+  "Try Again": "Try Again",
+  "Open World App": "Open World App",
+  "Hide QR Code": "Hide QR Code",
+  "Display QR Code": "Display QR Code",
+  "QR Code copied": "QR Code copied",
+  "Connect your World ID": "Connect your World ID",
+  "Use phone camera to scan the QR code": "Use phone camera to scan the QR code",
+  "Connecting...": "Connecting...",
+  "Please continue in app": "Please continue in app",
+  "You will be redirected to the app, please return to this page once you're done": "You will be redirected to the app, please return to this page once you're done",
+  "Action cannot be an empty string.": "Action cannot be an empty string.",
+  "Invalid IDKitStage :stage.": "Invalid IDKitStage :stage.",
+  "Terms & Privacy": "Terms & Privacy"
+};
+
+// src/lang/translations/es.ts
+var es = {
+  "All set!": "\xA1Todo listo!",
+  "Your World ID is now connected": "Tu World ID ahora est\xE1 conectado",
+  "Transmitting verification to host app. Please wait...": "Transmitiendo verificaci\xF3n a la aplicaci\xF3n host. Por favor espera...",
+  "Something went wrong": "Algo sali\xF3 mal",
+  "Verification Declined": "Verificaci\xF3n rechazada",
+  "Request cancelled": "Solicitud cancelada",
+  "Connection to your wallet failed. Please try again.": "La conexi\xF3n a tu billetera fall\xF3. Por favor intenta de nuevo.",
+  "You've cancelled the request in World App.": "Has cancelado la solicitud en World App.",
+  "You have already verified the maximum number of times for this action.": "Ya has verificado el n\xFAmero m\xE1ximo de veces para esta acci\xF3n.",
+  "It seems you do not have the verification level required by this app.": "Parece que no tienes el nivel de verificaci\xF3n requerido por esta aplicaci\xF3n.",
+  "Invalid network. If you are the app owner, visit docs.world.org/test for details.": "Red inv\xE1lida. Si eres el propietario de la aplicaci\xF3n, visita docs.world.org/test para m\xE1s detalles.",
+  "Your identity is still being registered. Please wait a few minutes and try again.": "Tu identidad a\xFAn se est\xE1 registrando. Por favor espera unos minutos e intenta de nuevo.",
+  "We couldn't complete your request. Please try again.": "No pudimos completar tu solicitud. Por favor intenta de nuevo.",
+  "Try Again": "Intentar de nuevo",
+  "Open World App": "Abrir World App",
+  "Hide QR Code": "Ocultar c\xF3digo QR",
+  "Display QR Code": "Mostrar c\xF3digo QR",
+  "QR Code copied": "C\xF3digo QR copiado",
+  "Connect your World ID": "Conecta tu World ID",
+  "Use phone camera to scan the QR code": "Usa la c\xE1mara del tel\xE9fono para escanear el c\xF3digo QR",
+  "Connecting...": "Conectando...",
+  "Please continue in app": "Por favor contin\xFAa en la aplicaci\xF3n",
+  "You will be redirected to the app, please return to this page once you're done": "Ser\xE1s redirigido a la aplicaci\xF3n, por favor regresa a esta p\xE1gina una vez que hayas terminado",
+  "Action cannot be an empty string.": "La acci\xF3n no puede ser una cadena vac\xEDa.",
+  "Invalid IDKitStage :stage.": "IDKitStage inv\xE1lido :stage.",
+  "Terms & Privacy": "T\xE9rminos y privacidad"
+};
+
+// src/lang/translations/th.ts
+var th = {
+  "All set!": "\u0E40\u0E23\u0E35\u0E22\u0E1A\u0E23\u0E49\u0E2D\u0E22!",
+  "Your World ID is now connected": "World ID \u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D\u0E41\u0E25\u0E49\u0E27",
+  "Transmitting verification to host app. Please wait...": "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E2A\u0E48\u0E07\u0E01\u0E32\u0E23\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19\u0E44\u0E1B\u0E22\u0E31\u0E07\u0E41\u0E2D\u0E1B\u0E42\u0E2E\u0E2A\u0E15\u0E4C \u0E01\u0E23\u0E38\u0E13\u0E32\u0E23\u0E2D\u0E2A\u0E31\u0E01\u0E04\u0E23\u0E39\u0E48...",
+  "Something went wrong": "\u0E40\u0E01\u0E34\u0E14\u0E02\u0E49\u0E2D\u0E1C\u0E34\u0E14\u0E1E\u0E25\u0E32\u0E14",
+  "Verification Declined": "\u0E01\u0E32\u0E23\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19\u0E16\u0E39\u0E01\u0E1B\u0E0F\u0E34\u0E40\u0E2A\u0E18",
+  "Request cancelled": "\u0E04\u0E33\u0E02\u0E2D\u0E16\u0E39\u0E01\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01",
+  "Connection to your wallet failed. Please try again.": "\u0E01\u0E32\u0E23\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D\u0E01\u0E31\u0E1A\u0E01\u0E23\u0E30\u0E40\u0E1B\u0E4B\u0E32\u0E40\u0E07\u0E34\u0E19\u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E25\u0E49\u0E21\u0E40\u0E2B\u0E25\u0E27 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
+  "You've cancelled the request in World App.": "\u0E04\u0E38\u0E13\u0E44\u0E14\u0E49\u0E22\u0E01\u0E40\u0E25\u0E34\u0E01\u0E04\u0E33\u0E02\u0E2D\u0E43\u0E19 World App",
+  "You have already verified the maximum number of times for this action.": "\u0E04\u0E38\u0E13\u0E44\u0E14\u0E49\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19\u0E04\u0E23\u0E1A\u0E08\u0E33\u0E19\u0E27\u0E19\u0E04\u0E23\u0E31\u0E49\u0E07\u0E2A\u0E39\u0E07\u0E2A\u0E38\u0E14\u0E2A\u0E33\u0E2B\u0E23\u0E31\u0E1A\u0E01\u0E32\u0E23\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E19\u0E35\u0E49\u0E41\u0E25\u0E49\u0E27",
+  "It seems you do not have the verification level required by this app.": "\u0E14\u0E39\u0E40\u0E2B\u0E21\u0E37\u0E2D\u0E19\u0E27\u0E48\u0E32\u0E04\u0E38\u0E13\u0E44\u0E21\u0E48\u0E21\u0E35\u0E23\u0E30\u0E14\u0E31\u0E1A\u0E01\u0E32\u0E23\u0E22\u0E37\u0E19\u0E22\u0E31\u0E19\u0E17\u0E35\u0E48\u0E41\u0E2D\u0E1B\u0E19\u0E35\u0E49\u0E15\u0E49\u0E2D\u0E07\u0E01\u0E32\u0E23",
+  "Invalid network. If you are the app owner, visit docs.world.org/test for details.": "\u0E40\u0E04\u0E23\u0E37\u0E2D\u0E02\u0E48\u0E32\u0E22\u0E44\u0E21\u0E48\u0E16\u0E39\u0E01\u0E15\u0E49\u0E2D\u0E07 \u0E2B\u0E32\u0E01\u0E04\u0E38\u0E13\u0E40\u0E1B\u0E47\u0E19\u0E40\u0E08\u0E49\u0E32\u0E02\u0E2D\u0E07\u0E41\u0E2D\u0E1B \u0E42\u0E1B\u0E23\u0E14\u0E44\u0E1B\u0E17\u0E35\u0E48 docs.world.org/test \u0E2A\u0E33\u0E2B\u0E23\u0E31\u0E1A\u0E23\u0E32\u0E22\u0E25\u0E30\u0E40\u0E2D\u0E35\u0E22\u0E14",
+  "Your identity is still being registered. Please wait a few minutes and try again.": "\u0E15\u0E31\u0E27\u0E15\u0E19\u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E22\u0E31\u0E07\u0E2D\u0E22\u0E39\u0E48\u0E23\u0E30\u0E2B\u0E27\u0E48\u0E32\u0E07\u0E01\u0E32\u0E23\u0E25\u0E07\u0E17\u0E30\u0E40\u0E1A\u0E35\u0E22\u0E19 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E23\u0E2D\u0E2A\u0E31\u0E01\u0E04\u0E23\u0E39\u0E48\u0E41\u0E25\u0E49\u0E27\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
+  "We couldn't complete your request. Please try again.": "\u0E40\u0E23\u0E32\u0E44\u0E21\u0E48\u0E2A\u0E32\u0E21\u0E32\u0E23\u0E16\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E15\u0E32\u0E21\u0E04\u0E33\u0E02\u0E2D\u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13\u0E44\u0E14\u0E49 \u0E01\u0E23\u0E38\u0E13\u0E32\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
+  "Try Again": "\u0E25\u0E2D\u0E07\u0E2D\u0E35\u0E01\u0E04\u0E23\u0E31\u0E49\u0E07",
+  "Open World App": "\u0E40\u0E1B\u0E34\u0E14 World App",
+  "Hide QR Code": "\u0E0B\u0E48\u0E2D\u0E19 QR Code",
+  "Display QR Code": "\u0E41\u0E2A\u0E14\u0E07 QR Code",
+  "QR Code copied": "\u0E04\u0E31\u0E14\u0E25\u0E2D\u0E01 QR Code \u0E41\u0E25\u0E49\u0E27",
+  "Connect your World ID": "\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D World ID \u0E02\u0E2D\u0E07\u0E04\u0E38\u0E13",
+  "Use phone camera to scan the QR code": "\u0E43\u0E0A\u0E49\u0E01\u0E25\u0E49\u0E2D\u0E07\u0E42\u0E17\u0E23\u0E28\u0E31\u0E1E\u0E17\u0E4C\u0E40\u0E1E\u0E37\u0E48\u0E2D\u0E2A\u0E41\u0E01\u0E19 QR code",
+  "Connecting...": "\u0E01\u0E33\u0E25\u0E31\u0E07\u0E40\u0E0A\u0E37\u0E48\u0E2D\u0E21\u0E15\u0E48\u0E2D...",
+  "Please continue in app": "\u0E01\u0E23\u0E38\u0E13\u0E32\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E15\u0E48\u0E2D\u0E43\u0E19\u0E41\u0E2D\u0E1B",
+  "You will be redirected to the app, please return to this page once you're done": "\u0E04\u0E38\u0E13\u0E08\u0E30\u0E16\u0E39\u0E01\u0E19\u0E33\u0E44\u0E1B\u0E22\u0E31\u0E07\u0E41\u0E2D\u0E1B \u0E01\u0E23\u0E38\u0E13\u0E32\u0E01\u0E25\u0E31\u0E1A\u0E21\u0E32\u0E17\u0E35\u0E48\u0E2B\u0E19\u0E49\u0E32\u0E19\u0E35\u0E49\u0E40\u0E21\u0E37\u0E48\u0E2D\u0E40\u0E2A\u0E23\u0E47\u0E08\u0E41\u0E25\u0E49\u0E27",
+  "Action cannot be an empty string.": "\u0E01\u0E32\u0E23\u0E14\u0E33\u0E40\u0E19\u0E34\u0E19\u0E01\u0E32\u0E23\u0E44\u0E21\u0E48\u0E2A\u0E32\u0E21\u0E32\u0E23\u0E16\u0E40\u0E1B\u0E47\u0E19\u0E02\u0E49\u0E2D\u0E04\u0E27\u0E32\u0E21\u0E27\u0E48\u0E32\u0E07\u0E44\u0E14\u0E49",
+  "Invalid IDKitStage :stage.": "IDKitStage \u0E44\u0E21\u0E48\u0E16\u0E39\u0E01\u0E15\u0E49\u0E2D\u0E07 :stage.",
+  "Terms & Privacy": "\u0E02\u0E49\u0E2D\u0E01\u0E33\u0E2B\u0E19\u0E14\u0E41\u0E25\u0E30\u0E04\u0E27\u0E32\u0E21\u0E40\u0E1B\u0E47\u0E19\u0E2A\u0E48\u0E27\u0E19\u0E15\u0E31\u0E27"
+};
+
+// src/lang/translations/index.ts
+var translations = {
+  en,
+  es,
+  th
+};
+
+// src/lang/localization.ts
+var currentConfig = {};
+var setLocalizationConfig = (config) => {
+  currentConfig = config;
+};
+var getLocalizationConfig = () => currentConfig;
+var detectBrowserLanguage = () => {
+  for (const lang of navigator.languages) {
+    const [language] = lang.split("-");
+    const normalizedLang = language.toLowerCase();
+    if (normalizedLang in translations) {
+      return normalizedLang;
+    }
+  }
+  return void 0;
+};
+var getCurrentLanguage = () => {
+  const config = getLocalizationConfig();
+  if (config.language && config.language in translations) {
+    return config.language;
+  }
+  const browserLang = detectBrowserLanguage();
+  if (browserLang) {
+    return browserLang;
+  }
+  return "en";
+};
+var getTranslations = () => {
+  const currentLang = getCurrentLanguage();
+  return translations[currentLang];
+};
+var getSupportedLanguages = () => {
+  return Object.keys(translations);
+};
+
 // src/lang/index.ts
-var translations = {};
 var getLang = () => {
-  if (!navigator?.languages) return;
-  const supportedLang = navigator.languages.find((l) => translations[l] != void 0) ?? "";
-  return translations[supportedLang];
+  return getTranslations();
 };
 var replaceParams = (str, params) => {
-  let replaced = str;
-  for (const [key, value] of Object.entries(params ?? {})) replaced = str.replace(`:${key}`, value);
-  return replaced;
+  if (!params) return str;
+  let result = str;
+  for (const [key, value] of Object.entries(params)) {
+    result = result.replace(`:${key}`, value);
+  }
+  return result;
 };
-function __(str, params) {
-  if (typeof navigator === "undefined") return str;
-  return replaceParams(getLang()?.[str] ?? str, params);
+function __(str, ...args) {
+  const [params] = args;
+  if (typeof navigator === "undefined" && typeof window === "undefined") {
+    return replaceParams(str, params);
+  }
+  const translated = getLang()?.[str] ?? str;
+  return replaceParams(translated, params);
 }
 
 // src/store/idkit.ts
@@ -211,13 +351,13 @@ var import_react2 = require("react");
 var useMedia = () => {
   const getInitialState = () => {
     if (typeof window !== "undefined") {
-      return window.matchMedia("(max-width: 768px)").matches ? "mobile" : "desktop";
+      return window.matchMedia("(max-width: 1024px)").matches ? "mobile" : "desktop";
     }
     return "desktop";
   };
   const [media, setMedia] = (0, import_react2.useState)(getInitialState());
   (0, import_react2.useEffect)(() => {
-    const mql = window.matchMedia("(max-width: 768px)");
+    const mql = window.matchMedia("(max-width: 1024px)");
     const handleChange = (mql2) => setMedia(mql2.matches ? "mobile" : "desktop");
     handleChange(mql);
     mql.addEventListener("change", handleChange);
@@ -1513,6 +1653,9 @@ input[type='number']::-webkit-inner-spin-button,
   .md\\:mt-2 {
     margin-top: 8px;
   }
+  .md\\:block {
+    display: block;
+  }
   .md\\:hidden {
     display: none;
   }
@@ -1539,6 +1682,15 @@ input[type='number']::-webkit-inner-spin-button,
     padding: 16px;
   }
 }
+
+@media (min-width: 1280px) {
+  .xl\\:block {
+    display: block;
+  }
+  .xl\\:hidden {
+    display: none;
+  }
+}
 `;
 
 // src/components/Styles.tsx
@@ -1703,25 +1855,36 @@ var WarningIcon_default = WarningIcon;
 // src/components/IDKitWidget/States/ErrorState.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
 var getParams = ({ retryFlow, errorState }) => ({ retryFlow, errorState });
-var ERROR_TITLES = {
-  [import_idkit_core2.AppErrorCodes.GenericError]: __("Something went wrong"),
-  [import_idkit_core2.AppErrorCodes.FailedByHostApp]: __("Verification Declined"),
-  [import_idkit_core2.AppErrorCodes.VerificationRejected]: __("Request cancelled")
+var getErrorTitle = (code) => {
+  switch (code) {
+    case import_idkit_core2.AppErrorCodes.GenericError:
+      return __("Something went wrong");
+    case import_idkit_core2.AppErrorCodes.FailedByHostApp:
+      return __("Verification Declined");
+    case import_idkit_core2.AppErrorCodes.VerificationRejected:
+      return __("Request cancelled");
+    default:
+      return __("Something went wrong");
+  }
 };
-var ERROR_MESSAGES = {
-  [import_idkit_core2.AppErrorCodes.ConnectionFailed]: __("Connection to your wallet failed. Please try again."),
-  [import_idkit_core2.AppErrorCodes.VerificationRejected]: __("You\u2019ve cancelled the request in World App."),
-  [import_idkit_core2.AppErrorCodes.MaxVerificationsReached]: __(
-    "You have already verified the maximum number of times for this action."
-  ),
-  [import_idkit_core2.AppErrorCodes.CredentialUnavailable]: __("It seems you do not have the verification level required by this app."),
-  [import_idkit_core2.AppErrorCodes.InvalidNetwork]: __(
-    "Invalid network. If you are the app owner, visit docs.world.org/test for details."
-  ),
-  [import_idkit_core2.AppErrorCodes.InclusionProofPending]: __(
-    "Your identity is still being registered. Please wait a few minutes and try again."
-  ),
-  [import_idkit_core2.AppErrorCodes.GenericError]: __("We couldn't complete your request. Please try again.")
+var getErrorMessage = (code) => {
+  switch (code) {
+    case import_idkit_core2.AppErrorCodes.ConnectionFailed:
+      return __("Connection to your wallet failed. Please try again.");
+    case import_idkit_core2.AppErrorCodes.VerificationRejected:
+      return __("You've cancelled the request in World App.");
+    case import_idkit_core2.AppErrorCodes.MaxVerificationsReached:
+      return __("You've already verified the maximum number of times for this action.");
+    case import_idkit_core2.AppErrorCodes.CredentialUnavailable:
+      return __("It seems you don't have the verification level required by this app.");
+    case import_idkit_core2.AppErrorCodes.InvalidNetwork:
+      return __("Invalid network. If you are the app owner, visit docs.world.org/test for details.");
+    case import_idkit_core2.AppErrorCodes.InclusionProofPending:
+      return __("Your identity is still being registered. Please wait a few minutes and try again.");
+    case import_idkit_core2.AppErrorCodes.GenericError:
+    default:
+      return __("We couldn't complete your request. Please try again.");
+  }
 };
 var ErrorState = (props) => {
   const { retryFlow, errorState } = idkit_default(getParams);
@@ -1734,8 +1897,8 @@ var ErrorState = (props) => {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "space-y-8", children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: clsx_default("flex items-center justify-center", show_modal ? "-mt-5" : ""), children: errorState?.code == import_idkit_core2.AppErrorCodes.VerificationRejected ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(WarningIcon_default, { className: "w-24" }) : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ErrorIcon_default, { className: "w-24" }) }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: (errorState?.code && ERROR_TITLES[errorState.code]) ?? ERROR_TITLES[import_idkit_core2.AppErrorCodes.GenericError] }),
-      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-auto mt-2 max-w-[224px] text-center text-657080", children: (errorState?.code && ERROR_MESSAGES[errorState.code]) ?? ERROR_MESSAGES[import_idkit_core2.AppErrorCodes.GenericError] })
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "text-center text-2xl font-semibold text-gray-900 dark:text-white", children: errorState?.code ? getErrorTitle(errorState.code) : getErrorTitle(import_idkit_core2.AppErrorCodes.GenericError) }),
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-auto mt-2 max-w-[224px] text-center text-657080", children: errorState?.code ? getErrorMessage(errorState.code) : getErrorMessage(import_idkit_core2.AppErrorCodes.GenericError) })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "flex justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       "button",
@@ -2022,15 +2185,22 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
     setTimeout(() => setCopiedLink(false), 2e3);
   }, [qrData]);
   return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: clsx_default("md:hidden", { "mb-10 space-y-4": !showQR }), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "md:hidden", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+      "a",
+      {
+        href: qrData ?? "",
+        className: "flex w-full items-center space-x-2 rounded-2xl border border-transparent p-4 font-medium shadow-sm bg-0d151d text-white dark:bg-white dark:text-0d151d",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(WorldcoinIcon_default, { className: "size-5" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex-1 text-center", children: __("Open World App") })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: clsx_default("hidden md:block xl:hidden", { "mb-10 space-y-4": !showQR }), children: [
       /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-        import_framer_motion.motion.a,
+        "a",
         {
           href: qrData ?? "",
-          whileTap: { scale: 0.95 },
-          whileHover: { scale: 1.05 },
-          transition: { layout: { duration: 0.15 } },
-          layoutId: media == "desktop" ? void 0 : "worldid-button",
           className: clsx_default(
             "flex w-full items-center space-x-2 rounded-2xl border border-transparent p-4 font-medium shadow-sm",
             "bg-0d151d text-white dark:bg-white dark:text-0d151d",
@@ -2038,20 +2208,12 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
           ),
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(WorldcoinIcon_default, { className: "size-5" }),
-            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-              import_framer_motion.motion.span,
-              {
-                className: "flex-1 text-center",
-                transition: { layout: { duration: 0.15 } },
-                layoutId: media == "desktop" ? void 0 : "worldid-text",
-                children: __("Open World App")
-              }
-            )
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "flex-1 text-center", children: __("Open World App") })
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: clsx_default("mb-3", { "space-y-4": !showQR, hidden: media === "mobile" }), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: clsx_default("flex items-center space-x-4 ", { hidden: showQR }), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: clsx_default("mb-3 space-y-4", { hidden: showQR }), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "flex items-center space-x-4", children: [
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("hr", { className: "flex-1" }),
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "text-xs font-medium text-9ba3ae", children: "or" }),
           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("hr", { className: "flex-1" })
@@ -2061,12 +2223,61 @@ var QRState = ({ qrData, showQR, setShowQR }) => {
           {
             className: "w-full rounded-2xl border border-ebecef p-4 text-lg font-medium text-3c424b",
             onClick: () => setShowQR((state) => !state),
-            children: showQR ? __("Hide QR Code") : __("Display QR Code")
+            children: __("Display QR Code")
           }
         )
       ] })
     ] }),
-    (media == "desktop" || showQR) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+    showQR && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "hidden md:block xl:hidden", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        import_framer_motion.motion.button,
+        {
+          className: "w-full rounded-2xl border border-ebecef p-4 text-lg font-medium text-3c424b",
+          onClick: () => setShowQR(false),
+          children: __("Hide QR Code")
+        }
+      ) }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "relative inline-flex items-center justify-center rounded-2xl border border-f1f5f8 p-3 dark:border-f1f5f8/10", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "text-29343f dark:text-white", children: qrData ? (
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { onClick: copyLink, className: "cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(QRCode_default, { data: qrData, size: 200 }) })
+      ) : /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "flex size-[200px] items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(QRPlaceholderIcon_default, { className: "size-[200px] animate-pulse" }) }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_framer_motion.AnimatePresence, { children: copiedLink && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+        import_framer_motion.motion.div,
+        {
+          className: "text-sm text-9eafc0 text-center",
+          initial: "hidden",
+          animate: "visible",
+          exit: "exit",
+          variants: {
+            hidden: { opacity: 0, height: 0, marginTop: 0 },
+            visible: {
+              opacity: 1,
+              height: "auto",
+              marginTop: 8,
+              transition: {
+                duration: 0.25,
+                opacity: { delay: 0.05, duration: 0.2 },
+                ease: "easeInOut"
+              }
+            },
+            exit: {
+              opacity: 0,
+              height: 0,
+              marginTop: 0,
+              transition: {
+                duration: 0.4,
+                delay: 0.1,
+                opacity: { duration: 0.25, delay: 0 },
+                ease: "easeInOut"
+              }
+            }
+          },
+          children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("span", { className: "rounded-lg border border-f1f5f8 px-2 py-1 text-sm", children: __("QR Code copied") })
+        },
+        "copied"
+      ) })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "hidden xl:block", children: [
       /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_framer_motion.AnimatePresence, { children: copiedLink && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
         import_framer_motion.motion.div,
         {
@@ -2245,7 +2456,8 @@ var WorldIDState = (props) => {
         /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: clsx_default(!show_modal ? "hidden" : ""), children: [
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "mb-4 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex size-14 items-center justify-center rounded-full border-[1.2px] border-solid border-[#EBECEF]", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(WorldcoinIcon_default, { className: "size-8 text-0d151d dark:text-white" }) }) }),
           /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: "text-2xl font-semibold text-gray-900 dark:text-white", children: __("Connect your World ID") }),
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: clsx_default("mt-3 text-657080 dark:text-9eafc0 md:mt-2", { hidden: media === "mobile" }), children: __("Use phone camera to scan the QR code") })
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: clsx_default("mt-3 text-657080 dark:text-9eafc0 md:mt-2", { hidden: media === "mobile" }), children: __("Use phone camera to scan the QR code") }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("p", { className: clsx_default("mt-3 text-657080 dark:text-9eafc0 md:mt-2", { hidden: media !== "mobile" }), children: __("You will be redirected to the app, please return to this page once you're done") })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "relative w-full", children: [
           verificationState === import_idkit_core4.VerificationState.WaitingForApp && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "absolute inset-0 flex flex-col items-center justify-center space-y-6", children: [
@@ -2303,10 +2515,16 @@ var IDKitWidget = ({
   show_modal = true,
   container_id,
   disable_default_modal_behavior = false,
+  language,
   ...config
 }) => {
   const media = useMedia_default();
   const { isOpen, onOpenChange, stage, setStage, setOptions, setErrorState } = idkit_default(getParams2, import_shallow3.shallow);
+  (0, import_react9.useEffect)(() => {
+    if (language) {
+      setLocalizationConfig({ language });
+    }
+  }, [language]);
   (0, import_react9.useEffect)(() => {
     if (config.action === "") {
       throw new Error(__("Action cannot be an empty string."));
@@ -2324,7 +2542,7 @@ var IDKitWidget = ({
       case "HOST_APP_VERIFICATION" /* HOST_APP_VERIFICATION */:
         return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HostAppVerificationState_default, {});
       default:
-        throw new Error(__("Invalid IDKitStage :stage.", { stage }));
+        throw new Error(__("Invalid IDKitStage :stage.", { s: String(stage) }));
     }
   }, [stage, show_modal]);
   const widgetContent = /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(ShadowHost, { mode: "open", id: "idkit-widget", children: [
@@ -2469,6 +2687,10 @@ function useSession(config) {
   IDKitWidget,
   VerificationLevel,
   VerificationState,
+  getCurrentLanguage,
+  getLocalizationConfig,
+  getSupportedLanguages,
+  setLocalizationConfig,
   solidityEncode,
   useIDKit,
   useSession,

package/build/index.d.cts

@@ -1,4 +1,5 @@
-import { C as Config, W as WidgetProps } from './config-BRFx4nLT.cjs';
+import { C as Config, W as WidgetProps } from './config-SH5TbLYj.cjs';
+export { S as SupportedLanguage, a as getCurrentLanguage, g as getLocalizationConfig, b as getSupportedLanguages, s as setLocalizationConfig } from './config-SH5TbLYj.cjs';
 import * as react from 'react';
 export { solidityEncode } from '@worldcoin/idkit-core/hashing';
 export { IVerifyResponse, verifyCloudProof } from '@worldcoin/idkit-core/backend';

package/build/index.d.ts

@@ -1,4 +1,5 @@
-import { C as Config, W as WidgetProps } from './config-BRFx4nLT.js';
+import { C as Config, W as WidgetProps } from './config-SH5TbLYj.js';
+export { S as SupportedLanguage, a as getCurrentLanguage, g as getLocalizationConfig, b as getSupportedLanguages, s as setLocalizationConfig } from './config-SH5TbLYj.js';
 import * as react from 'react';
 export { solidityEncode } from '@worldcoin/idkit-core/hashing';
 export { IVerifyResponse, verifyCloudProof } from '@worldcoin/idkit-core/backend';